update

1.根据新疆反馈，修改相关问题

.env.development

@@ -1,7 +1,7 @@
 # 王昊地址
 #VITE_GLOB_API_URL=http://192.168.1.98
 #开发环境
-VITE_GLOB_API_URL=https://api-jkglpt.iosp.ydpt.tech
+VITE_GLOB_API_URL=http://api-xj.tri.dt.io
 #VITE_GLOB_API_URL=https://api.cqygjk.com
 #健康监测工具报警-websocket
 #VITE_GLOB_API_YIN_JI=ws://cqyt.dev.yg.dt.io/health-watch/websocket/watchMonitor

src/views/indexSun.vue

@@ -20,7 +20,7 @@
                     <twoL @handle-view="handleTwoLClick" :center-id="centerId" :bKey="`two-l-${count}`" />
                 </div>
                 <div class="sun-body-left-three">
-                    <three-left-new :bKey="`three-l-n-${count}`" :center-id="centerId" />
+                    <three-left-new :bKey="`three-l-n-${count}`" :center-id="centerId" @handle-view="handlePieView" />
                     <!--                    <threeL />-->
                     <!--                    <threeNewL :bKey="`three-l-${count}`" :center-id="centerId" />-->
                 </div>
@@ -103,6 +103,8 @@
             </template>
         </template>
     </IndexModal>
+    <heart-modal ref="heartModalRef" :get-container="() => pageRef" />
+    <emer-modal ref="emerRef" :get-container="() => pageRef" />
 </template>
 <script setup lang="ts">
     import { EnvironmentOutlined } from '@ant-design/icons-vue';
@@ -120,6 +122,8 @@
         infoContentSpecial,
         monitorColumns,
         oneRNewColumns,
+        pieColumns,
+        pieSearch,
         threeRModalColumns,
         threeRModalFromList,
         towRcolumns,
@@ -158,17 +162,22 @@
         twoRModal3Api,
         twoRNApi,
         twoRNDetailApi,
+        watchPageApi,
     } from '/@/views/indexSun/indexSun.api.ts';
     import dayjs from 'dayjs';
     import ThreeLeftNew from '/@/views/indexSun/threeLeftNew.vue';
     import OneRightNew from '/@/views/indexSun/oneRightNew.vue';
     import TwoNewR from '/@/views/indexSun/twoNewR.vue';
     import { message } from 'ant-design-vue';
+    import HeartModal from '/@/views/indexSun/heartModal.vue';
+    import EmerModal from '/@/views/indexSun/emerModal.vue';
     //0:处置 1:处理 2:呼入 3:全部
     const phoneType = ref('');
     const phoneDialogTitle = ref('呼入电话');
     const phoneDialogRef = ref();
     const indexModalRef = ref();
+    const heartModalRef = ref();
+    const emerRef = ref();
     const pageRef = ref();
     const indexModalTitle = ref();
     const indexColumn: any = ref([]);
@@ -331,7 +340,7 @@
         }
     }
 
-    function handleTwoLClick() {
+    function handleTwoLClick(params: any) {
         indexModalTitle.value = '应急求助详情';
         indexColumn.value = columns[1];
         firstFormOne.value = fromLists[1];
@@ -340,7 +349,7 @@
         needDept.value = true;
         needDatePicker.value = false;
         nextTick(() => {
-            indexModalRef.value.openDialog();
+            emerRef.value.openDialog(params);
         });
     }
 
@@ -708,6 +717,8 @@
         };
         indexModalTitle.value = '重点关爱趋势预警';
         modalApi.value = twoRNDetailApi;
+        needDept.value = false;
+        needDatePicker.value = false;
         apiParams.value = params;
         nextTick(() => {
             indexModalRef.value.openDialog();
@@ -728,6 +739,13 @@
             indexModalRef.value.openDialog();
         });
     }
+    function handlePieView(params: any) {
+        indexColumn.value = pieColumns;
+        firstFormOne.value = pieSearch;
+        nextTick(() => {
+            heartModalRef.value.openDialog(params);
+        });
+    }
     function handleEmer(userId: string) {
         indexColumn.value = contactListColumns;
         firstFormOne.value = [];

src/views/indexSun/emerModal.vue

@@ -0,0 +1,300 @@
+<template>
+    <Dialog v-bind="$attrs" class="index-modal" :openVis="visible" width="60%" :title="dialogTitle" @close="handleClose" :maskClosable="false">
+        <template #container>
+            <Form style="width: 100%">
+                <div style="width: 100%">
+                    <Row style="display: flex; flex-wrap: wrap; width: 100%; align-items: center">
+                        <Col :span="6">
+                            <a-form-item label="被救助人">
+                                <a-input
+                                    style="background: #082147; border-color: #082147; color: #ffffff"
+                                    placeholder="请输入姓名"
+                                    v-model:value="name"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="6">
+                            <a-form-item label="性别">
+                                <a-select
+                                    placeholder="选择性别"
+                                    v-model:value="salvageUserSex"
+                                    :options="[
+                                        {
+                                            label: '全部',
+                                            value: '',
+                                        },
+                                        {
+                                            label: '男',
+                                            value: SexType.male,
+                                        },
+                                        {
+                                            label: '女',
+                                            value: SexType.female,
+                                        },
+                                    ]"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="6">
+                            <a-form-item label="救助方式">
+                                <a-select
+                                    placeholder="选择救助方式"
+                                    v-model:value="initiatorType"
+                                    :options="[
+                                        {
+                                            label: '全部',
+                                            value: '',
+                                        },
+                                        {
+                                            label: '120',
+                                            value: '0',
+                                        },
+                                        {
+                                            label: '应急就医',
+                                            value: '1',
+                                        },
+                                    ]"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="6">
+                            <a-form-item label="单位">
+                                <a-select
+                                    :filterOption="
+                                        (input: string, option: any): boolean => {
+                                            const str: string = input.trim().toLowerCase();
+                                            return option.label.toLowerCase().indexOf(str) >= 0;
+                                        }
+                                    "
+                                    :show-search="true"
+                                    placeholder="选择单位"
+                                    @change="changeSecond"
+                                    v-model:value="orgCode1"
+                                    :options="option1"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="6">
+                            <a-form-item label="部门">
+                                <a-select
+                                    :filterOption="
+                                        (input: string, option: any): boolean => {
+                                            const str: string = input.trim().toLowerCase();
+                                            return option.label.toLowerCase().indexOf(str) >= 0;
+                                        }
+                                    "
+                                    :show-search="true"
+                                    placeholder="选择部门"
+                                    v-model:value="orgCode2"
+                                    :options="option2"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="8">
+                            <a-form-item label="时间">
+                                <a-range-picker
+                                    v-model:value="dateTime"
+                                    format="YYYY-MM-DD"
+                                    value-format="YYYY-MM-DD"
+                                    :bordered="false"
+                                    :allowClear="false"
+                                    style="width: 100%"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="8">
+                            <div class="form-btn">
+                                <a-button size="middle" @click="handleClickReset" style="border-color: #00ccff">重置</a-button>
+                                <a-button
+                                    size="middle"
+                                    @click="handleClickSearch"
+                                    :loading="loading"
+                                    style="margin-left: 10px; background: #00ccff; border-color: #00ccff; color: #ffffff"
+                                >
+                                    搜索
+                                </a-button>
+                            </div>
+                        </Col>
+                    </Row>
+                </div>
+            </Form>
+            <BasicTable
+                @table-load="tableLoad"
+                ref="registerTable"
+                class="table-container"
+                :api="twoLModalApi"
+                :columns="columns[1]"
+                :api-params="formState"
+            />
+        </template>
+    </Dialog>
+</template>
+<script setup lang="ts">
+    import Dialog from '/@/components/dialog/Dialog.vue';
+    import { useDialog } from '/@/views/components/dialogHooks.ts';
+    import { onMounted, ref } from 'vue';
+    import { Form, Row, Col } from 'ant-design-vue';
+    import BasicTable from '/@/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue';
+    import { allSecondaryDepartsApi, getThreeDepartByOrgCodeApi, twoLModalApi } from '/@/views/indexSun/indexSun.api.ts';
+    import { columns } from '/@/views/indexSun/indexSun.ts';
+    import { SexType } from '/@/utils/settings.ts';
+
+    const loading = ref<boolean>(false);
+    const registerTable = ref();
+    const dialogTitle = ref('');
+    const option1 = ref([{ label: '全部', value: '' }]);
+    const option2 = ref([{ label: '全部', value: '' }]);
+    const name = ref('');
+    const salvageUserSex = ref('');
+    const initiatorType = ref('');
+    const orgCode1 = ref('');
+    const orgCode2 = ref('');
+    const formState = ref({});
+    const dateTime = ref([]);
+    const initForm = ref({});
+    onMounted(() => {
+        getSecondDepart();
+    });
+    function getSecondDepart() {
+        allSecondaryDepartsApi({})
+            .then((res: any) => {
+                if (res.code === 200) {
+                    const op: any[] = res?.result
+                        ? res.result.map((it: any) => {
+                              return {
+                                  label: it.departName,
+                                  value: it.orgCode,
+                              };
+                          })
+                        : [];
+                    option1.value = option1.value.concat(op);
+                } else {
+                }
+            })
+            .catch((err) => {
+                console.log(err);
+            });
+    }
+
+    function changeSecond() {
+        orgCode2.value = '';
+        option2.value = [{ label: '全部', value: '' }];
+        if (orgCode1.value) {
+            getThirdD();
+        }
+    }
+
+    function getThirdD() {
+        getThreeDepartByOrgCodeApi({ orgCode: orgCode1.value })
+            .then((res: any) => {
+                if (res.code === 200) {
+                    const op: any[] = res?.result
+                        ? res.result.map((it: any) => {
+                              return {
+                                  label: it.departName,
+                                  value: it.orgCode,
+                              };
+                          })
+                        : [];
+                    option2.value = option2.value.concat(op);
+                } else {
+                }
+            })
+            .catch((err) => {
+                console.log(err);
+            });
+    }
+
+    function tableLoad(b: boolean) {
+        loading.value = b;
+    }
+
+    function handleClickSearch() {
+        formState.value = {
+            orgCode: orgCode2.value || orgCode1.value,
+            realName: name.value,
+            type: initForm.value.type,
+            search: initForm.value.search,
+            createTimeStart: dateTime.value && dateTime.value.length > 0 ? dateTime.value[0] : '',
+            createTimeEnd: dateTime.value && dateTime.value.length > 0 ? dateTime.value[1] : '',
+        };
+    }
+
+    function handleClickReset() {
+        orgCode1.value = '';
+        orgCode2.value = '';
+        name.value = '';
+        salvageUserSex.value = '';
+        initiatorType.value = '';
+        dateTime.value = [initForm.value.createTimeStart, initForm.value.createTimeEnd];
+        formState.value = initForm.value;
+    }
+
+    const { visible, closeDialog, openDialog } = useDialog({ title: dialogTitle.value });
+
+    function handleClose() {
+        orgCode2.value = '';
+        orgCode1.value = '';
+        name.value = '';
+        salvageUserSex.value = '';
+        initiatorType.value = '';
+        closeDialog();
+    }
+
+    function openD(params: any) {
+        dialogTitle.value = '应急求助详情';
+        initForm.value = params;
+        formState.value = params;
+        dateTime.value = [params?.createTimeStart, params?.createTimeEnd];
+        openDialog();
+    }
+    defineExpose({
+        openDialog: openD,
+        closeDialog,
+    });
+</script>
+<style lang="less" scoped>
+    :deep(.dialog) {
+        border: 1px solid #00ccff !important;
+    }
+    .index-modal {
+        .form-btn {
+            margin-bottom: 8px;
+            padding-left: 100px;
+        }
+    }
+
+    :deep(.ant-form-item-label > label) {
+        color: #ffffff !important;
+        padding-left: 20px;
+        width: 100px;
+        justify-content: flex-end;
+    }
+
+    :deep(.ant-form-item) {
+        margin-bottom: 8px;
+    }
+
+    :deep(.ant-picker) {
+        width: 250px;
+        color: #fff !important;
+        background-color: #082147 !important;
+        border: 1px solid transparent !important;
+        border-radius: 4px !important;
+        display: flex;
+        align-items: center;
+        height: 30px;
+    }
+    :deep(.ant-picker-input > input) {
+        color: #fff !important;
+    }
+
+    .ant-col {
+        padding-right: 20px;
+    }
+
+    :deep(.anticon-calendar) {
+        display: flex;
+        align-items: center;
+    }
+</style>

src/views/indexSun/heartModal.vue

@@ -0,0 +1,245 @@
+<template>
+    <Dialog v-bind="$attrs" class="index-modal" :openVis="visible" width="60%" :title="dialogTitle" @close="handleClose" :maskClosable="false">
+        <template #container>
+            <Form style="width: 100%">
+                <div style="width: 100%">
+                    <Row style="display: flex; flex-wrap: wrap; width: 100%; align-items: center">
+                        <Col :span="8">
+                            <a-form-item label="姓名">
+                                <a-input
+                                    style="background: #082147; border-color: #082147; color: #ffffff"
+                                    placeholder="请输入姓名"
+                                    v-model:value="name"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="8">
+                            <a-form-item label="单位">
+                                <a-select
+                                    :filterOption="
+                                        (input: string, option: any): boolean => {
+                                            const str: string = input.trim().toLowerCase();
+                                            return option.label.toLowerCase().indexOf(str) >= 0;
+                                        }
+                                    "
+                                    :show-search="true"
+                                    placeholder="选择单位"
+                                    @change="changeSecond"
+                                    v-model:value="orgCode1"
+                                    :options="option1"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="8">
+                            <a-form-item label="部门">
+                                <a-select
+                                    :filterOption="
+                                        (input: string, option: any): boolean => {
+                                            const str: string = input.trim().toLowerCase();
+                                            return option.label.toLowerCase().indexOf(str) >= 0;
+                                        }
+                                    "
+                                    :show-search="true"
+                                    placeholder="选择部门"
+                                    v-model:value="orgCode2"
+                                    :options="option2"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="8">
+                            <a-form-item label="时间">
+                                <a-range-picker
+                                    v-model:value="dateTime"
+                                    format="YYYY-MM-DD"
+                                    value-format="YYYY-MM-DD"
+                                    :bordered="false"
+                                    style="width: 100%"
+                                />
+                            </a-form-item>
+                        </Col>
+                        <Col :span="8">
+                            <div class="form-btn">
+                                <a-button size="middle" @click="handleClickReset" style="border-color: #00ccff">重置</a-button>
+                                <a-button
+                                    size="middle"
+                                    @click="handleClickSearch"
+                                    :loading="loading"
+                                    style="margin-left: 10px; background: #00ccff; border-color: #00ccff; color: #ffffff"
+                                >
+                                    搜索
+                                </a-button>
+                            </div>
+                        </Col>
+                    </Row>
+                </div>
+            </Form>
+            <BasicTable
+                @table-load="tableLoad"
+                ref="registerTable"
+                class="table-container"
+                :api="watchPageApi"
+                :columns="pieColumns"
+                :api-params="formState"
+            />
+        </template>
+    </Dialog>
+</template>
+<script setup lang="ts">
+    import Dialog from '/@/components/dialog/Dialog.vue';
+    import { useDialog } from '/@/views/components/dialogHooks.ts';
+    import { onMounted, ref } from 'vue';
+    import { Form, Row, Col } from 'ant-design-vue';
+    import BasicTable from '/@/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue';
+    import { allSecondaryDepartsApi, getThreeDepartByOrgCodeApi, watchPageApi } from '/@/views/indexSun/indexSun.api.ts';
+    import { pieColumns } from '/@/views/indexSun/indexSun.ts';
+
+    const loading = ref<boolean>(false);
+    const registerTable = ref();
+    const dialogTitle = ref('');
+    const option1 = ref([{ label: '全部', value: '' }]);
+    const option2 = ref([{ label: '全部', value: '' }]);
+    const name = ref('');
+    const orgCode1 = ref('');
+    const orgCode2 = ref('');
+    const formState = ref({});
+    const dateTime = ref([]);
+    const initForm = ref({});
+    onMounted(() => {
+        getSecondDepart();
+    });
+    function getSecondDepart() {
+        allSecondaryDepartsApi({})
+            .then((res: any) => {
+                if (res.code === 200) {
+                    const op: any[] = res?.result
+                        ? res.result.map((it: any) => {
+                              return {
+                                  label: it.departName,
+                                  value: it.orgCode,
+                              };
+                          })
+                        : [];
+                    option1.value = option1.value.concat(op);
+                } else {
+                }
+            })
+            .catch((err) => {
+                console.log(err);
+            });
+    }
+
+    function changeSecond() {
+        orgCode2.value = '';
+        option2.value = [{ label: '全部', value: '' }];
+        if (orgCode1.value) {
+            getThirdD();
+        }
+    }
+
+    function getThirdD() {
+        getThreeDepartByOrgCodeApi({ orgCode: orgCode1.value })
+            .then((res: any) => {
+                if (res.code === 200) {
+                    const op: any[] = res?.result
+                        ? res.result.map((it: any) => {
+                              return {
+                                  label: it.departName,
+                                  value: it.orgCode,
+                              };
+                          })
+                        : [];
+                    option2.value = option2.value.concat(op);
+                } else {
+                }
+            })
+            .catch((err) => {
+                console.log(err);
+            });
+    }
+
+    function tableLoad(b: boolean) {
+        loading.value = b;
+    }
+
+    function handleClickSearch() {
+        formState.value = {
+            orgCode: orgCode2.value || orgCode1.value,
+            realName: name.value,
+            type: initForm.value.type,
+            search: initForm.value.search,
+            startTime: dateTime.value && dateTime.value.length > 0 ? dateTime.value[0] : '',
+            endTime: dateTime.value && dateTime.value.length > 0 ? dateTime.value[1] : '',
+        };
+    }
+
+    function handleClickReset() {
+        orgCode1.value = '';
+        orgCode2.value = '';
+        name.value = '';
+        dateTime.value = [initForm.value.startTime, initForm.value.endTime];
+        formState.value = initForm.value;
+    }
+
+    const { visible, closeDialog, openDialog } = useDialog({ title: dialogTitle.value });
+
+    function handleClose() {
+        orgCode2.value = '';
+        orgCode1.value = '';
+        name.value = '';
+        closeDialog();
+    }
+
+    function openD(params: any) {
+        dialogTitle.value = params.title;
+        initForm.value = params;
+        formState.value = params;
+        dateTime.value = [params.startTime, params.endTime];
+        openDialog();
+    }
+    defineExpose({
+        openDialog: openD,
+        closeDialog,
+    });
+</script>
+<style lang="less" scoped>
+    :deep(.dialog) {
+        border: 1px solid #00ccff !important;
+    }
+    .index-modal {
+        .form-btn {
+            margin-bottom: 8px;
+        }
+    }
+
+    :deep(.ant-form-item-label > label) {
+        color: #ffffff !important;
+        padding-left: 20px;
+    }
+
+    :deep(.ant-form-item) {
+        margin-bottom: 8px;
+    }
+
+    :deep(.ant-picker) {
+        width: 250px;
+        color: #fff !important;
+        background-color: #082147 !important;
+        border: 1px solid transparent !important;
+        border-radius: 4px !important;
+        display: flex;
+        align-items: center;
+        height: 30px;
+    }
+    :deep(.ant-picker-input > input) {
+        color: #fff !important;
+    }
+
+    .ant-col {
+        padding-right: 20px;
+    }
+
+    :deep(.anticon-calendar) {
+        display: flex;
+        align-items: center;
+    }
+</style>

src/views/indexSun/indexSun.api.ts

@@ -26,6 +26,7 @@ enum Api {
     contactList = '/health-system/sys/api/emergencyContact/contactList',
     careUser = '/health-emergency/emergency/LargeScreenNew/careUser',
     queryAnYanToken = '/health-emergency/emergency/LargeScreenNew/queryAnYanToken',
+    watchPage = '/health-watch/watch/watchData/abnormal/page',
 }
 
 export const statisticsNewApi = (params: any) => post(Api.statisticsNew, params);
@@ -54,3 +55,4 @@ export const roomDetailApi = (params: any) => post(Api.roomDetail, params);
 export const getSecondaryDepartmentList = () => get({ url: Api.getSecondaryDepartment });
 export const allSecondaryDepartsApi = (params: any) => get(Api.allSecondaryDeparts, params);
 export const getThreeDepartByOrgCodeApi = (params: any) => get(Api.getThreeDepartByOrgCode, params);
+export const watchPageApi = (params: any) => get(Api.watchPage, params);

src/views/indexSun/indexSun.ts

@@ -987,3 +987,57 @@ export const contactListColumns = [
         },
     },
 ];
+
+export const pieColumns = [
+    {
+        title: '姓名',
+        dataIndex: 'realName',
+        key: 'realName',
+    },
+    {
+        title: '性别',
+        dataIndex: 'sex_dictText',
+        key: 'sex_dictText',
+        width: 80,
+    },
+    {
+        title: '工号',
+        dataIndex: 'workNo',
+        key: 'workNo',
+    },
+    {
+        title: '联系方式',
+        dataIndex: 'phone',
+        key: 'phone',
+    },
+    {
+        title: '单位',
+        dataIndex: 'secondDeptName',
+        key: 'secondDeptName',
+    },
+    {
+        title: '部门',
+        dataIndex: 'thirdDeptName',
+        key: 'thirdDeptName',
+    },
+    {
+        title: '异常数据',
+        dataIndex: 'dataValue',
+        key: 'dataValue',
+    },
+    {
+        title: '测量时间',
+        dataIndex: 'dateTime',
+        key: 'dateTime',
+    },
+];
+
+export const pieSearch = [
+    {
+        label: '姓名',
+        field: 'realName',
+        type: 'input',
+        placeholder: '请输入姓名',
+        defaultValue: '',
+    },
+];

src/views/indexSun/threeLeftNew.vue

@@ -29,18 +29,19 @@
                 <div class="item-title" style="width: 99%">
                     <div class="title chart-title" style="display: flex; font-weight: normal !important">
                         <div> <img :src="imgList[chooseType]" alt="" />{{ tabList[chooseType].label }}</div>
-                        <div v-if="[0, 1].includes(chooseType)"> 参考范围: {{ tabList[chooseType].tips }} </div>
+                        <div v-if="[0].includes(chooseType)"> {{ tabList[chooseType].tips }} </div>
+                        <div v-if="[1].includes(chooseType)"> 参考范围: {{ tabList[chooseType].tips }} </div>
                     </div>
                     <div style="height: 210px; display: flex; align-items: center; justify-content: center; width: 100%">
                         <div style="height: 100%" class="content-chart">
                             <template v-if="[0, 1, 2, 3].includes(chooseType)">
-                                <three-left-new-item :org-code="selectValue" :type="selectValue1" :choose-type="chooseType" />
+                                <three-left-new-item @click-pie="clickPie" :org-code="selectValue" :type="selectValue1" :choose-type="chooseType" />
                             </template>
                             <template v-if="[4].includes(chooseType)">
                                 <sleep-item :orgCode="selectValue" :type="selectValue1" style="height: 100%" />
                             </template>
                             <template v-if="[5].includes(chooseType)">
-                                <step-item :orgCode="selectValue" :type="selectValue1" style="height: 100%" />
+                                <step-item @click-pie="clickPie" :orgCode="selectValue" :type="selectValue1" style="height: 100%" />
                             </template>
                         </div>
                     </div>
@@ -66,6 +67,7 @@
     import item4Png from '/@/assets/images/threeLeftNew/item4.png';
     import item5Png from '/@/assets/images/threeLeftNew/item5.png';
     import item6Png from '/@/assets/images/threeLeftNew/item6.png';
+    import dayjs from 'dayjs';
 
     const { getCenterInfo } = useUserStore();
     const props = defineProps({
@@ -79,12 +81,13 @@
         {
             label: '心率',
             value: 0,
-            tips: '正常60~100次/分',
+            // tips: localStorage.getItem('monitorDataOne') ? JSON.parse(localStorage.getItem('monitorDataOne') || '{}')[0].tips : '',
+            tips: localStorage.getItem('monitorDataOne') ? JSON.parse(localStorage.getItem('monitorDataOne') || '{}')[0].tips : '',
         },
         {
             label: '血氧',
             value: 1,
-            tips: '血氧饱和度95%~100%',
+            tips: '血氧饱和度90%~100%',
         },
         {
             label: '压力',
@@ -145,6 +148,93 @@
     //     getData();
     // });
 
+    const emit = defineEmits(['handleView']);
+
+    function clickPie(params: any) {
+        let p: any = {
+            endTime: dayjs().format('YYYY-MM-DD'),
+        };
+        switch (selectValue1.value) {
+            case 'week':
+                p['startTime'] = dayjs().subtract(1, 'week').format('YYYY-MM-DD');
+                break;
+            case 'month':
+                p['startTime'] = dayjs().subtract(1, 'month').format('YYYY-MM-DD');
+                break;
+            case 'year':
+                p['startTime'] = dayjs().subtract(1, 'year').format('YYYY-MM-DD');
+                break;
+        }
+        switch (chooseType.value) {
+            case 0:
+                p['type'] = 1;
+                p['search'] = heart(params);
+                p['title'] = `心率${params.name}`;
+                break;
+            case 1:
+                p['type'] = 2;
+                p['search'] = oxygen(params);
+                p['title'] = `血氧${params.name}`;
+                break;
+            case 2:
+                p['type'] = 3;
+                p['search'] = pressure(params);
+                p['title'] = `压力${params.name}`;
+                break;
+            case 3:
+                p['type'] = 5;
+                p['search'] = temperature(params);
+                p['title'] = `体温${params.name}`;
+                break;
+            case 5:
+                p['type'] = 7;
+                p['search'] = step(params);
+                p['title'] = `步数${params.name}`;
+                break;
+        }
+
+        if (p['search'] !== -1) {
+            emit('handleView', p);
+        }
+    }
+
+    function heart(params: any) {
+        if (params.dataIndex === 1) {
+            return 0;
+        }
+        return -1;
+    }
+    function oxygen(params: any) {
+        if (params.dataIndex === 1) {
+            return 0;
+        }
+        return -1;
+    }
+    function pressure(params: any) {
+        if (params.dataIndex === 3) {
+            return 0;
+        }
+        if (params.dataIndex === 2) {
+            return 1;
+        }
+        return -1;
+    }
+    function temperature(params: any) {
+        if (params.dataIndex === 2) {
+            return 0;
+        }
+        if (params.dataIndex === 1) {
+            return 1;
+        }
+        return -1;
+    }
+    function step(params: any) {
+        if (params.dataIndex === 0) {
+            return 0;
+        }
+        return -1;
+    }
+
     function setTimer() {
         if (timer.value) {
             clearInterval(timer.value);
@@ -225,10 +315,6 @@
     //         });
     //     });
     // }
-    const emit = defineEmits(['handleView']);
-    function handleView() {
-        emit('handleView');
-    }
 </script>
 <style lang="less" scoped>
     .two-l-box {

src/views/indexSun/threeLeftNewItem/item-d.vue

@@ -56,6 +56,8 @@
         }
     );
 
+    const emit = defineEmits(['clickPie']);
+
     async function init() {
         initChart(props.data, props.userCount, props.color);
     }
@@ -63,8 +65,16 @@
     function initChart(chartData, total, color) {
         nextTick(() => {
             let myChart = echarts.init(healthChart.value);
+            myChart.off('click');
             let options = circleRing(chartData, total, color, props.chooseIndex);
             myChart.setOption(options);
+
+            myChart.on('click', function (params) {
+                if (params.componentType === 'series') {
+                    // 这里可以调用一个函数来显示弹窗
+                    emit('clickPie', params);
+                }
+            });
             window.addEventListener('resize', () => {
                 myChart.resize();
             });

src/views/indexSun/threeLeftNewItem/stepItem.vue

@@ -29,6 +29,8 @@
         },
         { immediate: true, deep: true }
     );
+
+    const emit = defineEmits(['clickPie']);
     const healthChart = ref<HTMLElement>();
     const { total, setStep, getStepData } = useStep();
 
@@ -57,8 +59,14 @@
 
     function initChart(chartData: any) {
         let myChart = echarts.init(healthChart.value);
+        myChart.off('click');
         let options = screenPie(chartData);
         myChart.setOption(options);
+        myChart.on('click', function (params) {
+            if (params.componentType === 'series') {
+                emit('clickPie', params);
+            }
+        });
         window.addEventListener('resize', () => {
             myChart.resize();
         });

src/views/indexSun/threeLeftNewItem/threeLeftNewItem.vue

@@ -8,9 +8,9 @@
         :color="dataList[props.chooseType].color"
         :user-count="dataList[props.chooseType].userCount"
         :chooseIndex="props.chooseType"
+        @click-pie="clickPie"
     />
 </template>
-r
 
 <script setup lang="ts">
     import { onMounted, ref, watch } from 'vue';
@@ -25,20 +25,20 @@ r
             title: '心率',
             data: [
                 { name: '正常', value: 0, key: 'normalCount' },
-                { name: '警戒', value: 0, key: 'warnCount' },
+                { name: '异常', value: 0, key: 'warnCount' },
-                { name: '危险', value: 0, key: 'riskCount' },
+                // { name: '危险', value: 0, key: 'riskCount' },
             ],
             type: '1',
             color: ['#0098FA', '#FF6648', '#FB466C'],
-            tips: '正常范围60~100次/分',
+            tips: '',
             userCount: 0,
         },
         {
             title: '血氧',
             data: [
                 { name: '正常', value: 0, key: 'normalCount' },
-                { name: '警戒', value: 0, key: 'warnCount' },
+                { name: '异常', value: 0, key: 'warnCount' },
-                { name: '危险', value: 0, key: 'riskCount' },
+                // { name: '危险', value: 0, key: 'riskCount' },
             ],
             type: '2',
             color: ['#0098FA', '#FF6648', '#FB466C'],
@@ -92,6 +92,12 @@ r
         init();
     });
 
+    const emit = defineEmits(['clickPie']);
+
+    function clickPie(params: any) {
+        emit('clickPie', params);
+    }
+
     async function init() {
         setSpin(true);
         try {
@@ -107,18 +113,22 @@ r
         }
     }
 
-    function setValue(result) {
+    function setValue(result: any) {
         setSpin(false);
         let data = cloneDeep(dataList.value);
-        data.forEach((item) => {
+        data.forEach((item: any) => {
-            let resData = result.find((v) => v.type == item.type);
+            let resData = result.find((v: any) => v.type == item.type);
             item.userCount = resData.userCount;
-            item.data = item.data.map((val) => {
+            if (item.type === '1') {
+                item.tips = resData?.minData === null || resData?.maxData === null ? '' : `${resData?.minData}~${resData?.maxData}次/分钟`;
+            }
+            item.data = item.data.map((val: any) => {
                 val.value = resData[val.key];
                 val = { ...val, label: { show: val.value > 0 }, labelLine: { show: val.value > 0 } };
                 return val;
             });
         });
+        localStorage.setItem('monitorDataOne', JSON.stringify(data));
         dataList.value = data;
     }
 

src/views/indexSun/twoL.vue

@@ -6,31 +6,32 @@
         </div>
         <div class="content">
             <div class="content-search">
-                <div>
+                <div style="display: flex; flex: 1" class="content-search-select">
                     <a-select v-model:value="selectValue" class="type-select" :options="selectOptions" @change="getData">
                         <a-select-option value="全部数据">全部数据</a-select-option>
                     </a-select>
+                    <a-select style="width: 100px" v-model:value="selectValue1" class="type-select" :options="selectOption1" @change="changeTime" />
                 </div>
-                <div class="type-time">
+                <!--                <div class="type-time">-->
-                    <div @click="clickChooseType('0')" :class="[chooseType === '0' ? 'selected' : 'no-selected']">
+                <!--                    <div @click="clickChooseType('0')" :class="[chooseType === '0' ? 'selected' : 'no-selected']">-->
-                        全部
+                <!--                        全部-->
-                        <div>
+                <!--                        <div>-->
-                            <div v-if="chooseType === '0'" class="triangle"></div>
+                <!--                            <div v-if="chooseType === '0'" class="triangle"></div>-->
-                        </div>
+                <!--                        </div>-->
-                    </div>
+                <!--                    </div>-->
-                    <div @click="clickChooseType('1')" :class="[chooseType === '1' ? 'selected' : 'no-selected']">
+                <!--                    <div @click="clickChooseType('1')" :class="[chooseType === '1' ? 'selected' : 'no-selected']">-->
-                        男
+                <!--                        男-->
-                        <div>
+                <!--                        <div>-->
-                            <div v-if="chooseType === '1'" class="triangle"></div>
+                <!--                            <div v-if="chooseType === '1'" class="triangle"></div>-->
-                        </div>
+                <!--                        </div>-->
-                    </div>
+                <!--                    </div>-->
-                    <div @click="clickChooseType('2')" :class="[chooseType === '2' ? 'selected' : 'no-selected']">
+                <!--                    <div @click="clickChooseType('2')" :class="[chooseType === '2' ? 'selected' : 'no-selected']">-->
-                        女
+                <!--                        女-->
-                        <div>
+                <!--                        <div>-->
-                            <div v-if="chooseType === '2'" class="triangle"></div>
+                <!--                            <div v-if="chooseType === '2'" class="triangle"></div>-->
-                        </div>
+                <!--                        </div>-->
-                    </div>
+                <!--                    </div>-->
-                </div>
+                <!--                </div>-->
             </div>
             <div class="content-chart">
                 <div class="charts" ref="newChart"></div>
@@ -44,6 +45,7 @@
     import { getClassCharts } from '/@/views/indexSun/indexSun.ts';
     import { allSecondaryDepartsApi, twoLApi } from '/@/views/indexSun/indexSun.api.ts';
     import { useUserStore } from '/@/store/modules/user.ts';
+    import dayjs from 'dayjs';
 
     const { getCenterInfo } = useUserStore();
     const props = defineProps({
@@ -52,6 +54,13 @@
             default: () => '',
         },
     });
+
+    const selectValue1 = ref('week');
+    const selectOption1 = ref([
+        { label: '近一周', value: 'week' },
+        { label: '近一月', value: 'month' },
+        { label: '近一年', value: 'year' },
+    ]);
     const chooseType = ref('0');
     const selectValue = ref('');
     const selectOptions = ref([{ label: '全部数据', value: '' }]);
@@ -93,11 +102,22 @@
             });
     }
 
+    function changeTime() {
+        getData();
+    }
+
     function getData() {
         twoLApi({
             sex: chooseType.value,
             depart: selectValue.value,
             centerId: getCenterInfo?.id,
+            endDate: dayjs().format('YYYY-MM-DD'),
+            startDate:
+                selectValue1.value === 'week'
+                    ? dayjs().subtract(1, 'week').format('YYYY-MM-DD')
+                    : selectValue1.value === 'month'
+                      ? dayjs().subtract(1, 'month').format('YYYY-MM-DD')
+                      : dayjs().subtract(1, 'year').format('YYYY-MM-DD'),
         })
             .then((res: any) => {
                 if (res.code == 200) {
@@ -131,7 +151,21 @@
     }
     const emit = defineEmits(['handleView']);
     function handleView() {
-        emit('handleView');
+        let p: any = {
+            createTimeEnd: dayjs().format('YYYY-MM-DD'),
+        };
+        switch (selectValue1.value) {
+            case 'week':
+                p['createTimeStart'] = dayjs().subtract(1, 'week').format('YYYY-MM-DD');
+                break;
+            case 'month':
+                p['createTimeStart'] = dayjs().subtract(1, 'month').format('YYYY-MM-DD');
+                break;
+            case 'year':
+                p['createTimeStart'] = dayjs().subtract(1, 'year').format('YYYY-MM-DD');
+                break;
+        }
+        emit('handleView', p);
     }
 </script>
 <style lang="less" scoped>
@@ -172,12 +206,15 @@
                 font-size: 14px;
                 > div {
                     cursor: pointer;
-                    padding: 3px 15px;
+                    padding: 3px 13px;
-                    margin: 0 10px;
                     display: flex;
                     align-items: center;
                     justify-content: center;
                     //width: 60px;
+
+                    &:nth-child(2) {
+                        margin: 0 10px;
+                    }
                 }
                 .selected {
                     color: #00ccff;
@@ -339,4 +376,17 @@
             }
         }
     }
+
+    .content-search-select {
+        > div {
+            margin-top: 5px;
+            &:nth-child(1) {
+                flex: 1;
+            }
+            &:nth-child(2) {
+                width: 100px;
+                margin-left: 20px;
+            }
+        }
+    }
 </style>