update: 大屏接口

src/utils/settings.ts

@@ -33,6 +33,21 @@ export const sexTypeList = [
     },
 ];
 
+export const normalTypeList = [
+    {
+        label: '全部',
+        value: '2',
+    },
+    {
+        label: '正常',
+        value: '0',
+    },
+    {
+        label: '异常',
+        value: '1',
+    },
+];
+
 export interface Settings {
     dataType: string;
     orgCode?: string;

src/views/indexSun.vue

@@ -27,16 +27,25 @@
                     <oneR @handle-view="handleOneRClick" />
                 </div>
                 <div class="sun-body-right-two">
-                    <twoR />
+                    <twoR @handle-click="handleTwoRClick" />
                 </div>
                 <div class="sun-body-right-three">
-                    <threeR />
+                    <threeR @handle-click="handleThreeRClick" />
                 </div>
             </div>
         </div>
     </div>
     <PhoneDialog ref="phoneDialogRef" :title="phoneDialogTitle" :useForm="true" :setting="setting" :phoneType="phoneType" />
-    <IndexModal ref="indexModalRef" :title="indexModalTitle" :useForm="true" :column="indexColumn" :firstForm="firstFormOne" />
+    <IndexModal
+        ref="indexModalRef"
+        :api="modalApi"
+        :api-params="apiParams"
+        :title="indexModalTitle"
+        :useForm="true"
+        :column="indexColumn"
+        :firstForm="firstFormOne"
+        :twoROnly="twoROnly"
+    />
 </template>
 <script setup lang="ts">
     // import threeL from '/@/views/indexSun/threeL.vue';
@@ -49,13 +58,15 @@
     import CenterMap from '/@/views/indexSun/centerMap.vue';
     import { ServerDetailType } from '/@/components/body-d-left/bodyLeftHooks.ts';
     import { nextTick, onMounted, ref } from 'vue';
-    import { columns, fromLists } from '/@/views/indexSun/indexSun.ts';
+    import { columns, fromLists, threeRModalColumns, threeRModalFromList, towRcolumns, twoRform } from '/@/views/indexSun/indexSun.ts';
     import PhoneDialog from '/@/views/components/phoneDialog/phoneDialog.vue';
     import { DataType, getSettings } from '/@/utils/settings.ts';
     import IndexModal from '/@/views/indexSun/indexModal.vue';
     import LoginOutButton from '/@/views/components/loginOutButton.vue';
     import router from '/@/router';
     import { getAuthCache } from '/@/utils/auth.ts';
+    import { threeRModalApi, twoRModal1Api, twoRModal2Api, twoRModal3Api } from '/@/views/indexSun/indexSun.api.ts';
+    import dayjs from 'dayjs';
     //0:处置 1:处理 2:呼入 3:全部
     const phoneType = ref('');
     const phoneDialogTitle = ref('呼入电话');
@@ -66,11 +77,12 @@
     const setting = getSettings(DataType.xian);
     const firstFormOne = ref();
     const centerId = ref();
+    const apiParams = ref();
+    const modalApi = ref();
+    const twoROnly = ref();
     onMounted(() => {
         const centerInfo = getAuthCache('centerInfo');
-        console.log(getAuthCache('centerInfo'), '123');
         centerId.value = centerInfo.id;
-        console.log(centerInfo, '12312313');
     });
     function handleOneLeftClick(item) {
         const { name, key } = item;
@@ -81,6 +93,7 @@
             indexModalTitle.value = name;
             firstFormOne.value = fromLists[0];
             indexColumn.value = columns[0];
+            twoROnly.value = '';
             nextTick(() => {
                 indexModalRef.value.openDialog();
             });
@@ -90,6 +103,7 @@
         indexModalTitle.value = '主诉分类详情';
         indexColumn.value = columns[1];
         firstFormOne.value = fromLists[1];
+        twoROnly.value = '';
         nextTick(() => {
             indexModalRef.value.openDialog();
         });
@@ -100,6 +114,44 @@
             path: '/indexSon',
         });
     }
+    function handleThreeRClick(type) {
+        const textArr = ['心血管异常人员列表', '脑血管异常人员列表', '冠状CT异常人员列表'];
+        console.log(type);
+        indexModalTitle.value = textArr[type - 1];
+        indexColumn.value = threeRModalColumns;
+        modalApi.value = threeRModalApi;
+        twoROnly.value = '';
+        apiParams.value = { queryType: type };
+        firstFormOne.value = threeRModalFromList;
+        nextTick(() => {
+            indexModalRef.value.openDialog();
+        });
+    }
+    function handleTwoRClick(data) {
+        const textArr = ['健康打卡减重数据', '健康打卡减血糖数据', '健康打卡血压数据'];
+        indexModalTitle.value = textArr[data.type - 1];
+        indexColumn.value = towRcolumns[data.type - 1];
+        twoROnly.value = data;
+        const apiArr = [twoRModal1Api, twoRModal2Api, twoRModal3Api];
+        const params = {
+            inputDateBegin: '',
+            inputDateEnd: '',
+            abFlag: data.normal == 2 ? '1' : '2',
+        };
+        if (data.date == 1) {
+            params.inputDateBegin = dayjs().format('YYYY-MM-DD');
+            params.inputDateEnd = dayjs().format('YYYY-MM-DD');
+        } else {
+            params.inputDateBegin = dayjs().startOf('month').format('YYYY-MM-DD');
+            params.inputDateEnd = dayjs().format('YYYY-MM-DD');
+        }
+        apiParams.value = params;
+        modalApi.value = apiArr[data.type - 1];
+        firstFormOne.value = twoRform(data.normal == 2 ? '1' : '2');
+        nextTick(() => {
+            indexModalRef.value.openDialog();
+        });
+    }
 </script>
 <style lang="less" scoped>
     .sun-screen-box {

src/views/indexSun/indexModal.vue

@@ -1,5 +1,5 @@
 <template>
-    <Dialog class="index-modal" :openVis="visible" width="60%" :title="dialogTitle" @close="closeDialog" :maskClosable="false">
+    <Dialog class="index-modal" :openVis="visible" width="60%" :title="dialogTitle" @close="handleClose" :maskClosable="false">
         <template #container>
             <div v-if="useForm" class="form-container">
                 <Form :model="formRecord" v-bind="formItemLayout">
@@ -22,7 +22,7 @@
                     <slot name="searchSecond"></slot>
                 </Form>
                 <div class="form-btn">
-                    <a-button @click="handleClicksearch" style="border-color: #00ccff">重置</a-button>
+                    <a-button @click="handleClickReset" style="border-color: #00ccff">重置</a-button>
                     <a-button
                         @click="handleClicksearch"
                         :loading="loading"
@@ -32,7 +32,23 @@
                     </a-button>
                 </div>
             </div>
-            <BasicTable @table-load="tableLoad" ref="registerTable" class="table-container" :key="visible" :columns="column" :apiParams="formState" />
+            <div class="top-bottom-center" v-if="twoROnly">
+                <div class="date-change">
+                    <span :class="dataActity == 1 ? 'date-item' : ''" @click="handleDataChange(1)">今日</span>
+                    <span :class="dataActity == 2 ? 'date-item' : ''" @click="handleDataChange(2)">本月</span>
+                </div>
+                <div style="margin: 0 20px"> {{ dataActity == 1 ? '今日' : '本月' }}打卡总人数：{{ normalNum }}人 </div>
+                <div> 异常人数：{{ abnormalNum }}人 </div>
+            </div>
+            <BasicTable
+                @table-load="tableLoad"
+                ref="registerTable"
+                class="table-container"
+                :api="api"
+                :key="visible"
+                :columns="column"
+                :apiParams="formState"
+            />
         </template>
     </Dialog>
 </template>
@@ -64,13 +80,23 @@
             type: Array,
             default: () => [],
         },
+        api: {
+            type: Function,
+            default: () => {},
+        },
+        twoROnly: {
+            type: Object,
+        },
+        apiParams: {
+            type: Object,
+        },
     });
     const loading = ref<boolean>(false);
     const formState = ref();
+    const registerTable = ref();
     const dialogTitle = ref('');
-    const formRecord = ref({
+    const formRecord = ref({});
-        sex: SexType.all,
+    const dataActity = ref(1);
-    });
     function changeDept() {
         if (!orgCode.value) {
             return message.warning('请先选择单位');
@@ -79,6 +105,10 @@
     onMounted(() => {
         getSecondDept();
     });
+    function handleDataChange(type) {
+        if (type == dataActity.value) return;
+        dataActity.value = type;
+    }
     function getSecondDept() {
         getSecondaryDepartmentList().then((res) => {
             console.log(res, 'shshakjhdsjbjanmdjka');
@@ -99,9 +129,52 @@
     };
     watch(props, () => {
         dialogTitle.value = props.title;
+        formState.value = {
+            ...formState.value,
+            ...props.apiParams,
+        };
+        if (props.twoROnly) {
+            twoROnlyFun();
+        }
         getField();
         getSecondDept();
     });
+    const normalNum = ref();
+    const abnormalNum = ref();
+    function twoROnlyFun() {
+        normalNum.value = '';
+        abnormalNum.value = '';
+        dataActity.value = props.twoROnly.date;
+        const twoRData = localStorage.getItem('twoRList');
+        const newData = JSON.parse(twoRData);
+        if (newData) {
+            if (props.twoROnly.type == 1) {
+                if (props.twoROnly.date == 1) {
+                    normalNum.value = newData.weightLossCountDay;
+                    abnormalNum.value = newData.weightLossAbnormalCountDay;
+                } else {
+                    normalNum.value = newData.weightLossCountMonth;
+                    abnormalNum.value = newData.weightLossCountMonth;
+                }
+            } else if (props.twoROnly.type == 2) {
+                if (props.twoROnly.date == 1) {
+                    normalNum.value = newData.bloodSugarCountDay;
+                    abnormalNum.value = newData.bloodSugarAbnormalCountDay;
+                } else {
+                    normalNum.value = newData.bloodSugarCountMonth;
+                    abnormalNum.value = newData.bloodSugarAbnormalCountMonth;
+                }
+            } else {
+                if (props.twoROnly.date == 1) {
+                    normalNum.value = newData.bloodPressureCountDay;
+                    abnormalNum.value = newData.bloodPressureAbnormalCountDay;
+                } else {
+                    normalNum.value = newData.bloodPressureCountMonth;
+                    abnormalNum.value = newData.bloodPressureAbnormalCountMonth;
+                }
+            }
+        }
+    }
 
     function tableLoad(b: boolean) {
         loading.value = b;
@@ -120,11 +193,28 @@
         console.log(formRecord.value);
     }
     function handleClicksearch() {
-        console.log(formRecord.value);
+        formState.value = {
+            ...formState.value,
+            ...formRecord.value,
+        };
+        // registerTable.value.getRecords();
     }
 
     const { orgCode, option, fieldNames, setOrgCode } = useDepart();
     const { visible, closeDialog, openDialog } = useDialog({ title: dialogTitle.value });
+
+    function handleClose() {
+        formRecord.value = {};
+        closeDialog();
+    }
+    function handleClickReset() {
+        getField();
+        formState.value = {
+            ...formState.value,
+            ...formRecord.value,
+        };
+        console.log(formState.value, formRecord.value);
+    }
     defineExpose({
         openDialog,
     });
@@ -156,6 +246,7 @@
                 display: flex;
                 .ant-form-item {
                     flex: 1;
+                    margin-bottom: 0 !important;
                 }
             }
             .form-btn {
@@ -170,7 +261,7 @@
             }
         }
         .table-container {
-            margin: 0 10px;
+            margin: 10px 10px 0;
         }
     }
 
@@ -181,4 +272,33 @@
     :deep(.ant-form-item-control) {
         margin-right: 20px !important;
     }
+    .top-bottom-center {
+        margin-top: 10px;
+        padding: 0 10px;
+        display: flex;
+        align-items: center;
+        .date-change {
+            > span {
+                display: inline-block;
+                cursor: pointer;
+                width: 80px;
+                text-align: center;
+                line-height: 30px;
+                background: #072246;
+                border: 1px solid #1684fc;
+                &:nth-child(1) {
+                    border-top-left-radius: 4px;
+                    border-bottom-left-radius: 4px;
+                }
+                &:nth-child(2) {
+                    border-left: none;
+                    border-top-right-radius: 4px;
+                    border-bottom-right-radius: 4px;
+                }
+            }
+            .date-item {
+                background: #02ccfc;
+            }
+        }
+    }
 </style>

src/views/indexSun/indexSun.api.ts

@@ -7,6 +7,10 @@ enum Api {
     oneR = '/health-watch/watch/watchMonitorData/getMonitorList',
     threeR = '/health-emergency/emergency/LargeScreenNew/medicalAbnormalStatistics',
     twoR = '/health-emergency/emergency/LargeScreenNew/healthSign',
+    threeRModal = '/health-emergency/emergency/LargeScreenNew/medicalAbnormal',
+    twoRModal1 = '/health-emergency/emergency/LargeScreenNew/healthWeightLoss',
+    twoRModal2 = '/health-emergency/emergency/LargeScreenNew/healthBloodSugar',
+    twoRModal3 = '/health-emergency/emergency/LargeScreenNew/healthBloodPressure',
     getSecondaryDepartment = '/sys/sysDepart/allSecondaryDeparts',
 }
 
@@ -17,4 +21,8 @@ export const oneRApi = (params) => get(Api.oneR, params);
 export const threeRApi = (params) => post(Api.threeR, params);
 export const twoRApi = (params) => post(Api.twoR, params);
 
+export const threeRModalApi = (params) => post(Api.threeRModal, params);
+export const twoRModal1Api = (params) => post(Api.twoRModal1, params);
+export const twoRModal2Api = (params) => post(Api.twoRModal2, params);
+export const twoRModal3Api = (params) => post(Api.twoRModal3, params);
 export const getSecondaryDepartmentList = () => get({ url: Api.getSecondaryDepartment });

src/views/indexSun/indexSun.ts

@@ -1,6 +1,6 @@
 import * as echarts from 'echarts';
 import { legend1, legend2, legend3, legend4, legend5 } from '/@/components/xianMap/xianMapHooks.ts';
-import { SexType, sexTypeList } from '/@/utils/settings.ts';
+import { normalTypeList, SexType, sexTypeList } from '/@/utils/settings.ts';
 export const legend1 = new URL('/@/assets/img/legend1.png', import.meta.url).href;
 export const legend2 = new URL('/@/assets/img/legend5.png', import.meta.url).href;
 export const legend3 = new URL('/@/assets/img/legend3.png', import.meta.url).href;
@@ -263,3 +263,215 @@ const fromList2 = [
 export const columns = [columns1, columns2];
 
 export const fromLists = [fromList, fromList2];
+
+export const threeRModalColumns = [
+    {
+        title: '单位',
+        dataIndex: 'departName',
+        key: 'departName',
+    },
+    {
+        title: '姓名',
+        dataIndex: 'name',
+        key: 'name',
+    },
+    {
+        title: '性别',
+        dataIndex: 'sex_dictText',
+        key: 'sex_dictText',
+    },
+    {
+        title: '年龄',
+        dataIndex: 'age',
+        key: 'age',
+    },
+    {
+        title: '体检医院',
+        dataIndex: 'hospitalName',
+        key: 'hospitalName',
+    },
+    {
+        title: '检查日期',
+        dataIndex: 'checkInDate',
+        key: 'checkInDate',
+    },
+];
+
+export const threeRModalFromList = [
+    {
+        label: '姓名',
+        field: 'name',
+        type: 'input',
+        placeholder: '请输入姓名',
+        defaultValue: '',
+    },
+    {
+        label: '体检医院',
+        field: 'hospitalName',
+        type: 'input',
+        placeholder: '请输入体检医院',
+        defaultValue: '',
+    },
+];
+
+const towRcolumn1 = [
+    {
+        title: '单位',
+        dataIndex: 'departName',
+        key: 'departName',
+    },
+    {
+        title: '姓名',
+        dataIndex: 'name',
+        key: 'name',
+    },
+    {
+        title: '性别',
+        dataIndex: 'sex_dictText',
+        key: 'sex_dictText',
+    },
+    {
+        title: '年龄',
+        dataIndex: 'age',
+        key: 'age',
+    },
+    {
+        title: '身高(cm)',
+        dataIndex: 'height',
+        key: 'height',
+    },
+    {
+        title: '体重(kg)',
+        dataIndex: 'weight',
+        key: 'weight',
+    },
+    {
+        title: 'BMI',
+        dataIndex: 'bmi',
+        key: 'bmi',
+    },
+    {
+        title: 'BMI是否异常',
+        dataIndex: 'bmiException',
+        key: 'bmiException',
+    },
+    {
+        title: '腰围(cm)',
+        dataIndex: 'waist',
+        key: 'waist',
+    },
+    {
+        title: '填报日期',
+        dataIndex: 'createTime',
+        key: 'createTime',
+    },
+];
+const towRcolumn2 = [
+    {
+        title: '单位',
+        dataIndex: 'departName',
+        key: 'departName',
+    },
+    {
+        title: '姓名',
+        dataIndex: 'name',
+        key: 'name',
+    },
+    {
+        title: '性别',
+        dataIndex: 'sex_dictText',
+        key: 'sex_dictText',
+    },
+    {
+        title: '年龄',
+        dataIndex: 'age',
+        key: 'age',
+    },
+    {
+        title: '血糖值(mmol/L)',
+        dataIndex: 'height',
+        key: 'height',
+    },
+    {
+        title: '血糖是否异常',
+        dataIndex: 'weight',
+        key: 'weight',
+    },
+    {
+        title: '腰围(cm)',
+        dataIndex: 'waist',
+        key: 'waist',
+    },
+    {
+        title: '填报日期',
+        dataIndex: 'createTime',
+        key: 'createTime',
+    },
+];
+const towRcolumn3 = [
+    {
+        title: '单位',
+        dataIndex: 'departName',
+        key: 'departName',
+    },
+    {
+        title: '姓名',
+        dataIndex: 'name',
+        key: 'name',
+    },
+    {
+        title: '性别',
+        dataIndex: 'sex_dictText',
+        key: 'sex_dictText',
+    },
+    {
+        title: '年龄',
+        dataIndex: 'age',
+        key: 'age',
+    },
+    {
+        title: '收缩压(mmHg)',
+        dataIndex: 'height',
+        key: 'height',
+    },
+    {
+        title: '收缩压是否异常',
+        dataIndex: 'weight',
+        key: 'weight',
+    },
+    {
+        title: '舒张压(mmHg)',
+        dataIndex: 'bmi',
+        key: 'bmi',
+    },
+    {
+        title: '舒张压是否异常',
+        dataIndex: 'bmiException',
+        key: 'bmiException',
+    },
+    {
+        title: '填报日期',
+        dataIndex: 'createTime',
+        key: 'createTime',
+    },
+];
+export function twoRform(type) {
+    return [
+        {
+            label: '员工姓名',
+            field: 'realName',
+            type: 'input',
+            placeholder: '请输入',
+            defaultValue: '',
+        },
+        {
+            label: '异常标记',
+            field: 'abFlag',
+            type: 'select',
+            placeholder: '请选择性别',
+            options: normalTypeList,
+            defaultValue: type,
+        },
+    ];
+}
+export const towRcolumns = [towRcolumn1, towRcolumn2, towRcolumn3];

src/views/indexSun/threeNewL.vue

@@ -84,7 +84,6 @@
                     letter-spacing: 0;
                     margin-bottom: 20px;
                     cursor: pointer;
-                    .item-d-img {
                     img {
                         display: inline-block;
                         width: 32px;
@@ -95,5 +94,4 @@
             }
         }
     }
-    }
 </style>

src/views/indexSun/threeR.vue

@@ -47,6 +47,7 @@
     import { ref, onMounted } from 'vue';
     import { threeRApi } from '/@/views/indexSun/indexSun.api.ts';
     const scrollList = ref();
+    const emit = defineEmits(['handleClick']);
     onMounted(() => {
         threeRApi({}).then((res) => {
             if (res.code == 200) {
@@ -55,8 +56,7 @@
         });
     });
     function handleClickNum(type) {
-        console.log(type);
+        emit('handleClick', type);
-        console.log(123);
     }
 </script>
 <style lang="less" scoped>

src/views/indexSun/twoR.vue

@@ -16,22 +16,28 @@
                     <div class="content-item-clock">
                         <div>
                             <span class="clock-text">今日打卡人数：</span>
-                            <span class="clock-num1">{{ twoRList?.weightLossCountDay ? twoRList?.weightLossCountDay : '--' }}人</span>
+                            <span class="clock-num1" @click="handleClickNum1(1, 1, 1)"
+                                >{{ twoRList?.weightLossCountDay ? twoRList?.weightLossCountDay : '--' }}人</span
+                            >
                         </div>
                         <div>
                             <span class="clock-text">异常人数：</span>
-                            <span class="clock-num2">{{ twoRList?.weightLossAbnormalCountDay ? twoRList?.weightLossAbnormalCountDay : '--' }}人</span>
+                            <span class="clock-num2" @click="handleClickNum1(1, 1, 2)"
+                                >{{ twoRList?.weightLossAbnormalCountDay ? twoRList?.weightLossAbnormalCountDay : '--' }}人</span
+                            >
                         </div>
                     </div>
                     <div class="content-item-clock" style="margin-bottom: 0">
                         <div>
                             <span class="clock-text">本月打卡人数：</span>
-                            <span class="clock-num1">{{ twoRList?.weightLossCountMonth ? twoRList?.weightLossCountMonth : '--' }}人</span>
+                            <span class="clock-num1" @click="handleClickNum1(1, 2, 1)"
+                                >{{ twoRList?.weightLossCountMonth ? twoRList?.weightLossCountMonth : '--' }}人</span
+                            >
                         </div>
                         <div>
                             <span class="clock-text">异常人数：</span>
-                            <span class="clock-num2"
+                            <span class="clock-num2" @click="handleClickNum1(1, 2, 2)"
-                                >{{ twoRList?.weightLossAbnormalCountMonth ? twoRList?.weightLossAbnormalCountMonth : '--' }}人</span
+                                >{{ twoRList?.weightLossCountMonth ? twoRList?.weightLossAbnormalCountMonth : '--' }}人</span
                             >
                         </div>
                     </div>
@@ -48,21 +54,27 @@
                     <div class="content-item-clock">
                         <div>
                             <span class="clock-text">今日打卡人数：</span>
-                            <span class="clock-num1">{{ twoRList?.bloodSugarCountDay ? twoRList?.bloodSugarCountDay : '--' }}人</span>
+                            <span class="clock-num1" @click="handleClickNum1(2, 1, 1)"
+                                >{{ twoRList?.bloodSugarCountDay ? twoRList?.bloodSugarCountDay : '--' }}人</span
+                            >
                         </div>
                         <div>
                             <span class="clock-text">异常人数：</span>
-                            <span class="clock-num2">{{ twoRList?.bloodSugarAbnormalCountDay ? twoRList?.bloodSugarAbnormalCountDay : '--' }}人</span>
+                            <span class="clock-num2" @click="handleClickNum1(2, 1, 2)"
+                                >{{ twoRList?.bloodSugarAbnormalCountDay ? twoRList?.bloodSugarAbnormalCountDay : '--' }}人</span
+                            >
                         </div>
                     </div>
                     <div class="content-item-clock" style="margin-bottom: 0">
                         <div>
                             <span class="clock-text">本月打卡人数：</span>
-                            <span class="clock-num1">{{ twoRList?.bloodSugarCountMonth ? twoRList?.bloodSugarCountMonth : '--' }}人</span>
+                            <span class="clock-num1" @click="handleClickNum1(2, 2, 1)"
+                                >{{ twoRList?.bloodSugarCountMonth ? twoRList?.bloodSugarCountMonth : '--' }}人</span
+                            >
                         </div>
                         <div>
                             <span class="clock-text">异常人数：</span>
-                            <span class="clock-num2"
+                            <span class="clock-num2" @click="handleClickNum1(2, 2, 2)"
                                 >{{ twoRList?.bloodSugarAbnormalCountMonth ? twoRList?.bloodSugarAbnormalCountMonth : '--' }}人</span
                             >
                         </div>
@@ -80,11 +92,13 @@
                     <div class="content-item-clock">
                         <div>
                             <span class="clock-text">今日打卡人数：</span>
-                            <span class="clock-num1">{{ twoRList?.bloodPressureCountDay ? twoRList?.bloodPressureCountDay : '--' }}人</span>
+                            <span class="clock-num1" @click="handleClickNum1(3, 1, 1)"
+                                >{{ twoRList?.bloodPressureCountDay ? twoRList?.bloodPressureCountDay : '--' }}人</span
+                            >
                         </div>
                         <div>
                             <span class="clock-text">异常人数：</span>
-                            <span class="clock-num2"
+                            <span class="clock-num2" @click="handleClickNum1(3, 1, 2)"
                                 >{{ twoRList?.bloodPressureAbnormalCountDay ? twoRList?.bloodPressureAbnormalCountDay : '--' }}人</span
                             >
                         </div>
@@ -92,11 +106,13 @@
                     <div class="content-item-clock" style="margin-bottom: 0">
                         <div>
                             <span class="clock-text">本月打卡人数：</span>
-                            <span class="clock-num1">{{ twoRList?.bloodPressureCountMonth ? twoRList?.bloodPressureCountMonth : '--' }}人</span>
+                            <span class="clock-num1" @click="handleClickNum1(3, 2, 1)"
+                                >{{ twoRList?.bloodPressureCountMonth ? twoRList?.bloodPressureCountMonth : '--' }}人</span
+                            >
                         </div>
                         <div>
                             <span class="clock-text">异常人数：</span>
-                            <span class="clock-num2"
+                            <span class="clock-num2" @click="handleClickNum1(3, 2, 2)"
                                 >{{ twoRList?.bloodPressureAbnormalCountMonth ? twoRList?.bloodPressureAbnormalCountMonth : '--' }}人</span
                             >
                         </div>
@@ -113,16 +129,23 @@
     import { onMounted, ref } from 'vue';
     import { twoRApi } from '/@/views/indexSun/indexSun.api.ts';
     const twoRList = ref();
+    const emit = defineEmits(['handleClick']);
     onMounted(() => {
         getList();
     });
+
     function getList() {
         twoRApi({}).then((res) => {
             if (res.code == 200) {
+                localStorage.removeItem('twoRList');
                 twoRList.value = res.result;
+                localStorage.setItem('twoRList', JSON.stringify(res.result));
             }
         });
     }
+    function handleClickNum1(type, date, normal) {
+        emit('handleClick', { type, date, normal });
+    }
 </script>
 <style lang="less" scoped>
     .two-r-box {