原型制作

riku

2024-06-12 58a5242ff58523f5d048da13fc543ffba5065414

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<template>
  <el-row>
    <el-col :span="6" class="page-right">
      <el-scrollbar height="var(--fy-body-height)">
        <ManagementView></ManagementView>
      </el-scrollbar>
    </el-col>
    <el-col :span="12">
      <el-scrollbar class="page-left-top">
        <VisualizationView></VisualizationView>
      </el-scrollbar>
      <el-scrollbar class="page-left-bottom">
        <InspectionView></InspectionView>
      </el-scrollbar>
    </el-col>
    <el-col :span="6" class="page-right">
      <el-scrollbar height="var(--fy-body-height)">
        <ManagementView></ManagementView>
      </el-scrollbar>
    </el-col>
  </el-row>
</template>
 
<script setup>
import InspectionView from '@/views/inspection/InspectionView.vue'
import ManagementView from '@/views/management/ManagementView.vue'
import VisualizationView from '@/views/visualization/VisualizationView.vue'
 
import { provide } from 'vue'
 
provide('mapHeight', 'calc(var(--fy-body-height) / 3 * 2)')
</script>
 
<style scoped>
.page-left-top {
  height: calc(var(--fy-body-height) / 3 * 2);
  /* background-color: aquamarine; */
}
.page-left-bottom {
  height: calc(var(--fy-body-height) / 3 * 1);
  /* background-color: bisque; */
}
 
.page-right {
  /* background-color: aliceblue; */
}
</style>