90 lines
2.6 KiB
Vue
90 lines
2.6 KiB
Vue
<template>
|
|
<div>
|
|
<public-title title="一线医疗点每日工作动态" themeType="dark" />
|
|
<div class="inner">
|
|
<div class="trends-item" v-for="(item, k) in trendsData" :key="k">
|
|
<div class="trends-title-con">
|
|
<span class="icon-medical"></span>
|
|
<span class="trends-item-title">{{ item.name }}</span>
|
|
</div>
|
|
<div class="trends-item-span-box">
|
|
<span class="trends-item-span">高风险干预{{ item?.high }}人</span>
|
|
<span class="trends-item-span">慢病管理{{ item?.slow }}人</span>
|
|
<span class="trends-item-span">巡诊{{ item?.tour }}人</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import PublicTitle from '/@/components/publicTitle.vue';
|
|
import { onMounted, ref } from 'vue';
|
|
import { caching, useSession } from '/@/hooks/autoRefresh/caching.ts';
|
|
import { getWorkDaily } from '/@/views/centralScreen/centralScreen.api.ts';
|
|
|
|
const { setSession, getSession } = useSession();
|
|
const { WORK_DAILY_NEW } = caching;
|
|
const trendsData = ref([]);
|
|
|
|
async function getTrendsData() {
|
|
try {
|
|
const { code, result } = await getWorkDaily({});
|
|
if (code != 200) {
|
|
return;
|
|
}
|
|
setSession(WORK_DAILY_NEW, result);
|
|
trendsData.value = result;
|
|
} catch {
|
|
trendsData.value = JSON.parse(getSession(WORK_DAILY_NEW));
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
getTrendsData();
|
|
});
|
|
</script>
|
|
<style scoped lang="less">
|
|
.inner {
|
|
height: calc(100% - 40px);
|
|
overflow: auto;
|
|
|
|
.trends-item {
|
|
font-size: 16px;
|
|
padding: 10px 20px;
|
|
|
|
.trends-title-con {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.icon-medical {
|
|
display: inline-block;
|
|
width: 26px;
|
|
height: 26px;
|
|
background: url('/@/assets/images/medical-center.png') no-repeat;
|
|
background-size: 100% 100%;
|
|
}
|
|
|
|
.trends-item-title {
|
|
margin-left: 8px;
|
|
font-size: 18px;
|
|
color: #fff;
|
|
}
|
|
|
|
.trends-item-span-box {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.trends-item-span {
|
|
flex: 1;
|
|
color: #ededed;
|
|
}
|
|
|
|
.trends-item-span:first-child {
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
}
|
|
</style>
|