update

src/views/indexSon.vue

@@ -4,7 +4,7 @@
             <div class="title-d-left">
                 <span style="cursor: pointer" @click="clickBack">
                     <a-space>
-                        <rollback-outlined/>
+                        <rollback-outlined />
                     </a-space>
                     返回
                 </span>
@@ -28,66 +28,106 @@
                             :options="option"
                             :field-names="fieldNames"
                         ></a-select>
-            <a-select placeholder="选择时间范围" v-model:value="type" class="type-select"
+                        <a-select placeholder="选择时间范围" v-model:value="type" class="type-select" :options="timeRangeOption"></a-select>
-                      :options="timeRangeOption"></a-select>
                     </template>
                 </SecondMap>
             </div>
             <div class="body-d-right">
-        <one-r/>
+                <one-r />
-        <two-r/>
+                <two-r />
-        <three-r/>
+                <three-r />
             </div>
         </div>
         <div class="bottom-d"></div>
     </div>
 </template>
 <script setup lang="ts">
-import {RollbackOutlined} from '@ant-design/icons-vue';
+    import { RollbackOutlined } from '@ant-design/icons-vue';
-import {ref} from 'vue';
+    import { ref } from 'vue';
-import OneR from '/@/components/secondaryScreen/screen-right/oneR.vue';
+    import OneR from '/@/components/secondaryScreen/screen-right/oneR.vue';
-import TwoR from '/@/components/secondaryScreen/screen-right/twoR.vue';
+    import TwoR from '/@/components/secondaryScreen/screen-right/twoR.vue';
-import ThreeR from '/@/components/secondaryScreen/screen-right/threeR.vue';
+    import ThreeR from '/@/components/secondaryScreen/screen-right/threeR.vue';
-import SecondMap from '/@/components/secondaryScreen/secondMap/secondMap';
+    import SecondMap from '/@/components/secondaryScreen/secondMap/secondMap';
-import PieCharts from '/@/components/secondaryScreen/screen-left/PieCharts.vue'
+    import router from '/@/router';
-import router from '/@/router';
+    import ItemD from '/@/components/item-d/item-d.vue';
-import ItemD from '/@/components/item-d/item-d.vue';
+    import { useDepart, useTimeType } from '/@/components/secondaryScreen/secondMap/secondMapHooks.ts';
-import {useDepart, useTimeType} from '/@/components/secondaryScreen/secondMap/secondMapHooks.ts';
+    import { useTopTime } from '/@/utils/utils.ts';
-import {useTopTime} from '/@/utils/utils.ts';
 
-const dayTimeT = ref();
+    const dayTimeT = ref();
+    const dataList = ref([
+        {
+            title: '心率',
+            data: [
+                { name: '正常', value: 234 },
+                { name: '警戒', value: 204 },
+                { name: '危险', value: 34 },
+            ],
+            color: ['#0098FA', '#FF6648', '#FB466C'],
+            tips: '正常范围60~100次/分',
+        },
+        {
+            title: '血氧',
+            data: [
+                { name: '正常', value: 234 },
+                { name: '警戒', value: 204 },
+                { name: '危险', value: 34 },
+            ],
+            color: ['#0098FA', '#FF6648', '#FB466C'],
+            tips: '血氧饱和度范围95%~100%',
+        },
+        {
+            title: '压力',
+            data: [
+                { name: '正常', value: 234 },
+                { name: '放松', value: 204 },
+                { name: '中等', value: 34 },
+                { name: '偏高', value: 78 },
+            ],
+            color: ['#1DCC79', '#0098FA', '#0CD9B5', '#6C63F0'],
+            tips: '',
+        },
+        {
+            title: '体温',
+            data: [
+                { name: '37.2', value: 234 },
+                { name: '37.2-38', value: 204 },
+                { name: '>38', value: 34 },
+            ],
+            color: ['#0098FA', '#0CD9B5', '#3B72AD'],
+            tips: '',
+        },
+    ]);
 
-
+    function init() {
-function init() {
         getTime();
         setInterval(() => {
             getTime();
         }, 1000);
-}
+    }
 
-init();
+    init();
 
-function getTime() {
+    function getTime() {
-  const {timeRight} = useTopTime();
+        const { timeRight } = useTopTime();
         dayTimeT.value = timeRight;
-}
+    }
 
-function clickBack() {
+    function clickBack() {
         router.go(-1);
-}
+    }
 
-const {orgCode, option, fieldNames} = useDepart({});
+    const { orgCode, option, fieldNames } = useDepart({});
-const {type, timeRangeOption} = useTimeType('week');
+    const { type, timeRangeOption } = useTimeType('week');
 </script>
 <style lang="less" scoped>
-.outer {
+    .outer {
         height: 100%;
         box-sizing: border-box;
         background: url('../assets/images/bg.png') no-repeat;
         background-size: 100% 100%;
-}
+    }
 
-.title-d {
+    .title-d {
         height: 80px;
         line-height: 80px;
         display: flex;
@@ -122,9 +162,9 @@ const {type, timeRangeOption} = useTimeType('week');
         > :nth-child(3) {
             width: 29%;
         }
-}
+    }
 
-.body-d {
+    .body-d {
         display: flex;
         height: calc(100% - 120px);
         //padding-top: 10px;
@@ -187,9 +227,9 @@ const {type, timeRangeOption} = useTimeType('week');
         }
     }
 
-.bottom-d {
+    .bottom-d {
         height: 40px;
         background: url('../assets/images/bottom-b.png') no-repeat;
         background-size: 100% 100%;
-}
+    }
 </style>