From ef3e1c3b31cf185ed94ed1cc6177b851b6d6d099 Mon Sep 17 00:00:00 2001
From: wx <645899409@qq.com>
Date: Mon, 22 Jan 2024 17:42:45 +0800
Subject: [PATCH] =?UTF-8?q?update=201.=E4=BF=AE=E6=94=B9=E7=9D=A1=E7=9C=A0?=
 =?UTF-8?q?=E6=A8=A1=E5=9D=97=EF=BC=8C=E6=80=BB=E8=A7=88=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E6=AD=A5=E6=95=B0=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/images/allStep.png                 | Bin 0 -> 2804 bytes
 .../components/userInfoModal/allLook.vue      |   4 +-
 .../components/userInfoModal/allLookItem.vue  |  26 +-
 .../components/userInfoModal/sleep.vue        | 335 ++++++++++++------
 .../userInfoModal/userInfoModal.vue           |   4 +-
 5 files changed, 257 insertions(+), 112 deletions(-)
 create mode 100644 src/assets/images/allStep.png

diff --git a/src/assets/images/allStep.png b/src/assets/images/allStep.png
new file mode 100644
index 0000000000000000000000000000000000000000..b6b4db6f5726e599352e1aa0ff71d6096029fe8d
GIT binary patch
literal 2804
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
GLSTXl2r=>i

literal 0
HcmV?d00001

diff --git a/src/components/secondaryScreen/secondMap/components/userInfoModal/allLook.vue b/src/components/secondaryScreen/secondMap/components/userInfoModal/allLook.vue
index f48d504..30f4527 100644
--- a/src/components/secondaryScreen/secondMap/components/userInfoModal/allLook.vue
+++ b/src/components/secondaryScreen/secondMap/components/userInfoModal/allLook.vue
@@ -8,7 +8,7 @@
             </a-radio-group>
         </div>
 
-        <all-look-item :info-data="props.infoData" />
+        <all-look-item :info-data="props.infoData" :paramsDate="paramsDate" />
     </div>
 </template>
 <script setup lang="ts">
@@ -29,4 +29,4 @@
         emit('changeParamsDate', v.target.value);
     }
 </script>
-<style scoped lang="less"></style>
\ No newline at end of file
+<style scoped lang="less"></style>
diff --git a/src/components/secondaryScreen/secondMap/components/userInfoModal/allLookItem.vue b/src/components/secondaryScreen/secondMap/components/userInfoModal/allLookItem.vue
index 53f6b62..d7bf3d6 100644
--- a/src/components/secondaryScreen/secondMap/components/userInfoModal/allLookItem.vue
+++ b/src/components/secondaryScreen/secondMap/components/userInfoModal/allLookItem.vue
@@ -207,6 +207,28 @@
                 </div>
             </div>
         </div>
+
+        <div class="box-con-small">
+            <div style="display: flex; align-items: center; padding: 10px 0; justify-content: flex-start">
+                <img :src="allStep" alt="" />
+                步数
+            </div>
+
+            <div style="display: flex">
+                <div style="display: flex; width: 100%">
+                    <div class="label-d">
+                        <div>{{ paramsDate === '0' ? '总步数值' : '最大步数值' }}</div>
+                        <div :style="{ opacity: props.paramsDate === '0' ? 0 : 1 }">最小步数值</div>
+                        <div :style="{ opacity: props.paramsDate === '0' ? 0 : 1 }">平均步数值</div>
+                    </div>
+                    <div class="value-d">
+                        <div>{{ getNum(props.infoData?.sdcStat?.max) }}</div>
+                        <div :style="{ opacity: props.paramsDate === '0' ? 0 : 1 }">{{ getNum(props.infoData?.sdcStat?.min) }}</div>
+                        <div :style="{ opacity: props.paramsDate === '0' ? 0 : 1 }">{{ getNum(props.infoData?.sdcStat?.avg) }}</div>
+                    </div>
+                </div>
+            </div>
+        </div>
     </div>
 </template>
 <script setup lang="ts">
@@ -215,10 +237,12 @@
     const blood = new URL('/@/assets/images/blood_oxygen.png', import.meta.url).href;
     const heart_rate = new URL('/@/assets/images/heart_rate.png', import.meta.url).href;
     const temperature = new URL('/@/assets/images/temperature.png', import.meta.url).href;
+    const allStep = new URL('/@/assets/images/allStep.png', import.meta.url).href;
     const pressure = new URL('/@/assets/images/pressure.png', import.meta.url).href;
     const sleep = new URL('/@/assets/images/sleep.png', import.meta.url).href;
     const props = defineProps({
         infoData: propTypes.object.def({}),
+        paramsDate: propTypes.string.def('0'),
     });
 
     function getTime(time) {
@@ -316,4 +340,4 @@
             padding: 5px 0;
         }
     }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/components/secondaryScreen/secondMap/components/userInfoModal/sleep.vue b/src/components/secondaryScreen/secondMap/components/userInfoModal/sleep.vue
index 951332f..6307fc3 100644
--- a/src/components/secondaryScreen/secondMap/components/userInfoModal/sleep.vue
+++ b/src/components/secondaryScreen/secondMap/components/userInfoModal/sleep.vue
@@ -3,27 +3,38 @@
     <div class="item-three" style="display: flex; justify-content: center" v-if="status">
         <div style="width: 15%; text-align: center">
             <div>
-                <span style="font-size: 25px"> {{ maxInfo }}</span>
+                <template v-if="getTime(maxInfo)?.h > 0">
+                    <span style="font-size: 25px"> {{ getTime(maxInfo)?.h }}</span>
+                    <span style="color: #aa9db6">小时</span>
+                </template>
+                <span style="font-size: 25px"> {{ getTime(maxInfo)?.m }}</span>
                 <span style="color: #aa9db6">分钟</span>
             </div>
-            <div style="color: #aa9db6">最高睡眠时长</div>
+            <div style="color: #aa9db6">{{ type == 1 ? '深睡睡眠时长' : '日均深睡时长' }}</div>
         </div>
         <div style="width: 15%; text-align: center">
             <div>
-                <span style="font-size: 25px"> {{ minInfo }}</span>
+                <template v-if="getTime(minInfo)?.h > 0">
+                    <span style="font-size: 25px"> {{ getTime(minInfo)?.h }}</span>
+                    <span style="color: #aa9db6">小时</span>
+                </template>
+                <span style="font-size: 25px"> {{ getTime(minInfo)?.m }}</span>
                 <span style="color: #aa9db6">分钟</span>
             </div>
-            <div style="color: #aa9db6">最低睡眠时长</div>
+            <div style="color: #aa9db6">{{ type == 1 ? '浅睡睡眠时长' : '日均浅睡时长' }}</div>
         </div>
         <div style="width: 15%; text-align: center">
             <div>
-                <span style="font-size: 25px">{{ middleInfo }}</span>
+                <template v-if="getTime(middleInfo)?.h > 0">
+                    <span style="font-size: 25px">{{ getTime(middleInfo)?.h }}</span>
+                    <span style="color: #aa9db6">小时</span>
+                </template>
+                <span style="font-size: 25px">{{ getTime(middleInfo)?.m }}</span>
                 <span style="color: #aa9db6">分钟</span>
             </div>
-            <div style="color: #aa9db6">平均睡眠时长</div>
+            <div style="color: #aa9db6">{{ type == 1 ? '睡眠总时长' : '日均睡眠总时长' }}</div>
         </div>
     </div>
-
     <div v-if="status && !isEmpty" ref="chartRef" style="min-height: 300px; width: 100%"></div>
     <template v-if="status && isEmpty">
         <div style="min-height: 300px; width: 100%; display: flex; align-items: center; justify-content: center">
@@ -89,7 +100,7 @@
     function initF() {
         if (status.value) {
             echart && echart.clear();
-            initEchart('0');
+            initEchart();
         } else {
             tableReload();
         }
@@ -99,7 +110,7 @@
         status.value = s;
         if (s) {
             nextTick(() => {
-                initEchart('0');
+                initEchart();
             });
         }
     }
@@ -109,58 +120,153 @@
     /**
      *  @type 传入 type = '1' 则不需要要渲染图表
      * */
-    async function initEchart(t) {
+    async function initEchart() {
         try {
             const { code, result, message: msg } = await querySleepStatisticsApi(getParams());
+            maxInfo.value = '';
+            middleInfo.value = '';
+            minInfo.value = '';
             if (code === 200) {
-                isEmpty.value = result.viewDataList.length === 0;
-                let xArr = [];
-                let yArr = [];
-                let yArr1 = [];
-                maxInfo.value = result.maxValue ? result.maxValue : '/';
-                middleInfo.value = result.avgValue ? result.avgValue : '/';
-                minInfo.value = result.minValue ? result.minValue : '/';
-                if (t === '1') return;
-                type.value === 1 &&
-                    result.viewDataList.map((item) => {
-                        xArr.push(item.date);
-                        yArr.push(item.value === 1 ? 1 : 0);
-                        yArr1.push(item.value === 2 ? 1 : 0);
-                    });
+                isEmpty.value = type.value === 1 ? result.timePeriods.length === 0 : result.viewDataList.length === 0;
+                let xArr: any[] = [];
+                let yArr: any[] = [];
+                let yArr1: any[] = [];
+                maxInfo.value = type.value === 1 ? result.maxValue : result.deepSleepTimes ? result.deepSleepTimes : '';
+                middleInfo.value = type.value === 1 ? result.total1 : result.deepLightTimes ? result.deepLightTimes : '';
+                minInfo.value = type.value === 1 ? result.minValue : result.lightSleepTimes ? result.lightSleepTimes : '';
+                // debugger;
+                // type.value === 1 &&
+                //     result.viewDataList.map((item) => {
+                //         xArr.push(item.date);
+                //         yArr.push(item.value === 1 ? 1 : 0);
+                //         yArr1.push(item.value === 2 ? 1 : 0);
+                //     });
                 type.value !== 1 &&
                     result.viewDataList.map((item) => {
+                        const total = (item.value ? item.value : 0) + (item.value1 ? item.value1 : 0);
                         xArr.push(item.date);
-                        yArr.push(item.value);
-                        yArr1.push(item.value1);
+                        // let p1 = parseInt(((item.value ? item.value : 0) / total) * 100);
+                        // let p2 = parseInt(((item.value1 ? item.value1 : 0) / total) * 100);
+                        yArr.push(item.value ? item.value : 0);
+                        yArr1.push(item.value1 ? item.value1 : 0);
                     });
-                echart = echarts.init(chartRef.value);
-                const option = {
-                    title: {},
-                    legend: {
-                        textStyle: {
-                            color: '#fff',
-                        },
-                    },
-                    tooltip: {
-                        trigger: 'axis',
-                        axisPointer: {
-                            type: 'shadow',
-                        },
-                        textStyle: {
-                            color: '#fff',
-                        },
-                        backgroundColor: 'rgba(50,50,50,0.7)',
-                        borderColor: '#1b7ef2',
-                        formatter: function (params) {
-                            let tar1 = params[1];
-                            let tar = params[0];
-                            let str = '';
-                            if (type.value === 1) {
-                                str = xArr[tar.dataIndex] + '<br/>' + (tar1.value > 0 ? '浅睡' : '深睡');
-                            } else {
-                                str =
-                                    xArr[tar.dataIndex] +
-                                    `<div>
+                if (type.value === 1) {
+                    getZXEchart(result);
+                } else {
+                    getZEcahrt(xArr, yArr, yArr1);
+                }
+            } else {
+                isEmpty.value = true;
+                message.warn(msg);
+            }
+        } catch {}
+    }
+
+    function getZXEchart(res) {
+        echart = echarts.init(chartRef.value);
+        let xArr: any[] = [];
+        let yArr: any[] = [];
+        res.timePeriods &&
+            res.timePeriods.map((item) => {
+                switch (item.flag) {
+                    case 1:
+                        // 浅睡
+                        yArr.push(1);
+                        yArr.push(1);
+                        break;
+                    case 3:
+                        // 深睡
+                        yArr.push(0);
+                        yArr.push(0);
+                        break;
+                    case 4:
+                        // 清醒
+                        yArr.push(3);
+                        yArr.push(3);
+                        break;
+                    case 5:
+                        // 零星小睡
+                        yArr.push(2);
+                        yArr.push(2);
+                        break;
+                }
+                xArr.push(dayjs(item.start).format('HH:mm'));
+                xArr.push(dayjs(item.end).format('HH:mm'));
+            });
+        const option = {
+            xAxis: {
+                type: 'category',
+                data: xArr,
+            },
+            tooltip: {
+                trigger: 'axis',
+                axisPointer: {
+                    type: 'shadow',
+                },
+                formatter: function (params) {
+                    console.log(params);
+                    let tar = params[0];
+                    let name = '';
+                    switch (tar.value) {
+                        case 3:
+                            name = '清醒';
+                            break;
+                        case 2:
+                            name = '零星小睡';
+                            break;
+                        case 1:
+                            name = '浅睡';
+                            break;
+                        case 0:
+                            name = '深睡';
+                            break;
+                    }
+                    return xArr[tar.dataIndex] + '<br/>' + name;
+                },
+            },
+            yAxis: {
+                show: false,
+            },
+            series: [
+                {
+                    data: yArr,
+                    type: 'line',
+                },
+            ],
+        };
+
+        echart.setOption(option);
+        window.addEventListener('resize', () => {
+            echart.resize();
+        });
+    }
+
+    function getZEcahrt(xArr, yArr, yArr1) {
+        echart = echarts.init(chartRef.value);
+        const option = {
+            title: {},
+            legend: {
+                textStyle: {
+                    color: '#ffffff',
+                },
+            },
+            tooltip: {
+                trigger: 'axis',
+                axisPointer: {
+                    type: 'shadow',
+                },
+                formatter: function (params) {
+                    let tar1 = params[1];
+                    let tar = params[0];
+                    // let tar = params[1];
+                    // return (tar1.value > 0 ? '短睡' : '长睡') + '<br/>' + tar.seriesName + ' : ' + tar.value;
+                    let str = '';
+                    if (type.value === 1) {
+                        str = xArr[tar.dataIndex] + '<br/>' + (tar1.value > 0 ? '浅睡' : '深睡');
+                    } else {
+                        str =
+                            xArr[tar.dataIndex] +
+                            `<div>
                                             <div style="display: flex;justify-content: space-between">
                                                 <div>
                                                     深睡：${tar.value ? tar.value : 0}
@@ -178,62 +284,71 @@
                                                 </div>
                                             </div>
                                     </div>`;
-                            }
-                            return str;
-                        },
+                    }
+                    return str;
+                },
+            },
+            grid: {
+                left: '3%',
+                right: '4%',
+                bottom: '3%',
+                containLabel: true,
+            },
+            xAxis: {
+                type: 'category',
+                splitLine: { show: false },
+                data: xArr,
+                axisLabel: {
+                    color: '#fff',
+                },
+            },
+            yAxis: {
+                show: false,
+            },
+            series: [
+                {
+                    name: '深睡',
+                    type: 'bar',
+                    barMaxWidth: '20px',
+                    stack: 'a',
+                    itemStyle: {
+                        borderColor: '#5087ec',
+                        borderWidth: 0,
+                        color: '#5087ec',
                     },
-                    grid: {
-                        left: '3%',
-                        right: '4%',
-                        bottom: '3%',
-                        containLabel: true,
+                    // emphasis: {
+                    //     itemStyle: {
+                    //         borderColor: '#68bbc4',
+                    //         color: '#68bbc4',
+                    //     },
+                    // },
+                    axisLabel: {
+                        color: '#fff',
                     },
-                    xAxis: {
-                        type: 'category',
-                        splitLine: { show: false },
-                        data: xArr,
-                        axisLabel: {
-                            color: '#fff',
-                        },
+                    data: yArr,
+                },
+                {
+                    name: '浅睡',
+                    barMaxWidth: '20px',
+                    stack: 'a',
+                    itemStyle: {
+                        borderColor: '#85d0dc',
+                        borderWidth: 0,
+                        color: '#85d0dc',
                     },
-                    yAxis: {
-                        show: false,
+                    axisLabel: {
+                        color: '#fff',
                     },
-                    series: [
-                        {
-                            name: '深睡',
-                            type: 'bar',
-                            barMaxWidth: '20px',
-                            itemStyle: {
-                                borderColor: '#5087ec',
-                                borderWidth: 0,
-                                color: '#5087ec',
-                            },
-                            data: yArr,
-                        },
-                        {
-                            name: '浅睡',
-                            barMaxWidth: '20px',
-                            itemStyle: {
-                                borderColor: '#85d0dc',
-                                borderWidth: 0,
-                                color: '#85d0dc',
-                            },
-                            type: 'bar',
-                            data: yArr1,
-                        },
-                    ],
-                };
+                    type: 'bar',
+                    data: yArr1,
+                },
+            ],
+        };
 
-                echart.setOption(option);
-                window.addEventListener('resize', () => {
-                    echart.resize();
-                });
-            } else {
-                isEmpty.value = true;
-                message.warn(msg);
-            }
-        } catch {}
+        echart.setOption(option);
+        window.addEventListener('resize', () => {
+            echart.resize();
+        });
     }
 
     function getParams() {
@@ -259,8 +374,14 @@
         return params;
     }
 
+    function getTime(time) {
+        if (!time) return { h: 0, m: 0 };
+        if (time < 60) return { h: 0, m: time };
+
+        return { h: (time - (time % 60)) / 60, m: time % 60 };
+    }
     onMounted(() => {
-        initEchart('0');
+        initEchart();
     });
 </script>
-<style scoped lang="less"></style>
\ No newline at end of file
+<style scoped lang="less"></style>
diff --git a/src/components/secondaryScreen/secondMap/components/userInfoModal/userInfoModal.vue b/src/components/secondaryScreen/secondMap/components/userInfoModal/userInfoModal.vue
index 1e79072..c39fabe 100644
--- a/src/components/secondaryScreen/secondMap/components/userInfoModal/userInfoModal.vue
+++ b/src/components/secondaryScreen/secondMap/components/userInfoModal/userInfoModal.vue
@@ -18,11 +18,11 @@
                         <a-tab-pane key="0" tab="总览" />
                         <a-tab-pane key="1" tab="心率" />
                         <a-tab-pane key="2" tab="血氧" />
-                        <a-tab-pane key="4" tab="睡眠" />
                         <a-tab-pane key="3" tab="压力" />
+                        <a-tab-pane key="4" tab="睡眠" />
+                        <a-tab-pane key="5" tab="体温" />
                         <a-tab-pane key="6" tab="锻炼" />
                         <a-tab-pane key="7" tab="步数" />
-                        <a-tab-pane key="5" tab="体温" />
                     </a-tabs>
                     <div style="height: 60vh; overflow: auto">
                         <all-look