xj-screen/src/views/indexSun/threeLeftNewItem/threeLeftNewItem.vue

<template>
    <item-d
        :themeType="themeType"
        :keu="spinning"
        :title="dataList[props.chooseType].title"
        :data="dataList[props.chooseType].data"
        :tips="dataList[props.chooseType].tips"
        :color="dataList[props.chooseType].color"
        :user-count="dataList[props.chooseType].userCount"
        :chooseIndex="props.chooseType"
        @click-pie="clickPie"
    />
</template>

<script setup lang="ts">
    import { onMounted, ref, watch } from 'vue';
    import { cloneDeep } from 'lodash-es';
    import { getWatchDataByOrgCodeNew } from '/@/components/secondaryScreen/commonApi.ts';
    import { useSpin } from '/@/components/body-d-left/bodyLeftHooks.ts';
    import ItemD from '/src/views/indexSun/threeLeftNewItem/item-d.vue';

    const { spinning, setSpin } = useSpin();
    const dataList = ref([
        {
            title: '心率',
            data: [
                { name: '正常', value: 0, key: 'normalCount' },
                { name: '异常', value: 0, key: 'warnCount' },
                // { name: '危险', value: 0, key: 'riskCount' },
            ],
            type: '1',
            color: ['#0098FA', '#FF6648', '#FB466C'],
            tips: '',
            userCount: 0,
        },
        {
            title: '血氧',
            data: [
                { name: '正常', value: 0, key: 'normalCount' },
                { name: '异常', value: 0, key: 'warnCount' },
                // { name: '危险', value: 0, key: 'riskCount' },
            ],
            type: '2',
            color: ['#0098FA', '#FF6648', '#FB466C'],
            tips: '血氧饱和度范围95%~100%',
            userCount: 0,
        },
        {
            title: '压力',
            data: [
                { name: '正常', value: 0, key: 'normalCount' },
                { name: '放松', value: 0, key: 'unwindCount' },
                { name: '中等', value: 0, key: 'warnCount' },
                { name: '偏高', value: 0, key: 'riskCount' },
            ],
            type: '3',
            color: ['#1DCC79', '#0098FA', '#0CD9B5', '#6C63F0'],
            tips: '',
            userCount: 0,
        },
        {
            title: '体温',
            data: [
                { name: '<37.2', value: 0, key: 'normalCount' },
                { name: '37.2-38', value: 0, key: 'warnCount' },
                { name: '>38', value: 0, key: 'riskCount' },
            ],
            type: '5',
            color: ['#0098FA', '#0CD9B5', '#3B72AD'],
            tips: '',
            userCount: 0,
        },
    ]);

    const props = defineProps({
        orgCode: String,
        type: String,
        themeType: String,
        refreshState: {
            type: Boolean,
            default: () => false,
        },
        chooseType: {
            type: Number,
            default: () => 0,
        },
        bKey: {
            type: String,
            default: () => '',
        },
    });

    onMounted(() => {
        init();
    });
    watch(
        () => props.orgCode,
        () => {
            init();
        }
    );
    watch(
        () => props.bKey,
        () => {
            init();
        }
    );
    watch(
        () => props.type,
        () => {
            init();
        }
    );
    watch(
        () => props.themeType,
        () => {
            init();
        }
    );
    watch(
        () => props.refreshState,
        () => {
            init();
        }
    );
    watch(
        () => props.chooseType,
        () => {
            initByLocal();
        }
    );

    async function initByLocal() {
        if (localStorage.getItem('monitorDataOne')) {
            dataList.value = JSON.parse(localStorage.getItem('monitorDataOne') || '{}');
        } else {
            await init();
        }
    }

    const emit = defineEmits(['clickPie']);

    function clickPie(params: any) {
        emit('clickPie', params);
    }

    async function init() {
        setSpin(true);
        try {
            // const { code, result } = await getWatchDataByOrgCode(props);
            const { code, result } = await getWatchDataByOrgCodeNew(props);
            if (code == 200) {
                setValue(result);
                // setSession(PAGE2_LEFT, JSON.stringify(result));
            }
        } catch {
            // const result = JSON.parse(getSession(PAGE2_LEFT));
            // setValue(result);
        }
    }

    function setValue(result: any) {
        setSpin(false);
        let data = cloneDeep(dataList.value);
        data.forEach((item: any) => {
            let resData = result.find((v: any) => v.type == item.type);
            item.userCount = resData.userCount;
            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;
    }

    defineExpose({
        init,
    });
</script>

<style scoped></style>