This commit is contained in:
lnn19986213 2024-06-04 17:04:49 +08:00
parent 7fd73800ad
commit 3fe6f83a42
10 changed files with 170 additions and 43 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 7.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

View File

@ -568,7 +568,7 @@ onBeforeMount(() => {
getOption(); getOption();
setChart(); setChart();
}, 400); }, 600);
}); });
</script> </script>

View File

@ -1,7 +1,10 @@
<template> <template>
<div class="module"> <div class="module">
<div class="displayFlex left_bg"> <div class="displayFlex left_bg">
<div class="flex1" style="flex: 0.5"> <div
class="flex1"
style="flex: 0.5"
>
<div class="yd_title left_1"> <div class="yd_title left_1">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -46,71 +49,112 @@
></ePie2> ></ePie2>
</div> </div>
<div class="flex1" style="margin-top: 10px"> <div
class="flex1"
style="margin-top: 10px"
>
<div class="yd_title left_3"> <div class="yd_title left_3">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="sm_title_1"></div> <div class="sm_title_1"></div>
<tnb :list="data.lmb.tnbrs" :year="data.lmb.year"></tnb> <tnb
:list="data.lmb.tnbrs"
:year="data.lmb.year"
></tnb>
<div class="sm_title_2"></div> <div class="sm_title_2"></div>
<gxy :list="data.lmb.gxyrs" :year="data.lmb.year"></gxy> <gxy
:list="data.lmb.gxyrs"
:year="data.lmb.year"
></gxy>
</div> </div>
</div> </div>
<div class="displayFlex center_bg"> <div class="displayFlex center_bg">
<div class="flex1"> <div class="flex1">
<div class="yd_title center_2"> <div class="yd_title center_2">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="center_top"> <div class="center_top">
<div class="item"> <div class="item">
<img src="@/assets/images/hygiene/mjzrc.png" class="left" /> <img
src="@/assets/images/hygiene/mjzrc.png"
class="left"
/>
<div class="right"> <div class="right">
<div class="right_top">门急诊人次</div> <div class="right_top">门急诊人次</div>
<img src="@/assets/images/hygiene/jt.png" class="right_center" /> <img
src="@/assets/images/hygiene/jt.png"
class="right_center"
/>
<div class="right_bottom">{{ data.mz.mjzrc }}</div> <div class="right_bottom">{{ data.mz.mjzrc }}</div>
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<img src="@/assets/images/hygiene/zyrs.png" class="left" /> <img
src="@/assets/images/hygiene/zyrs.png"
class="left"
/>
<div class="right"> <div class="right">
<div class="right_top">住院人数</div> <div class="right_top">住院人数</div>
<img src="@/assets/images/hygiene/jt.png" class="right_center" /> <img
src="@/assets/images/hygiene/jt.png"
class="right_center"
/>
<div class="right_bottom">{{ data.mz.zyrs }}</div> <div class="right_bottom">{{ data.mz.zyrs }}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="flex1" style="flex: 0.3"> <div
class="flex1"
style="flex: 0.3"
>
<div class="yd_title center_1"> <div class="yd_title center_1">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="minTop"> <div class="minTop">
<div class="minTopPart"> <div class="minTopPart">
<div class="history2"> <div class="history2">
<div class="va">33.67</div> <div class="va">33.67</div>
<img src="@/assets/images/hygiene/shang_left.png" alt="" /> <img
src="@/assets/images/hygiene/shang_left.png"
alt=""
/>
<img
class="moveImg"
src="@/assets/images/hygiene/shang_left2.png"
alt=""
/>
<img
class="moveImg2"
src="@/assets/images/hygiene/jd.gif"
alt=""
/>
<div class="historyimg">建档份数</div> <div class="historyimg">建档份数</div>
</div> </div>
</div> </div>
<div class="minTopPart2"> <div class="minTopPart2">
<div class="left"> <div class="left">
<div class="leftImg"><eP4></eP4></div> <div class="leftImg">
<eP4></eP4>
</div>
<div class="left_me"> <div class="left_me">
<div>建档率</div> <div>建档率</div>
<div class="bo">92.96%</div> <div class="bo">92.96%</div>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
<div class="rightImg"><eP4_1></eP4_1></div> <div class="rightImg">
<eP4_1></eP4_1>
</div>
<div class="right_me"> <div class="right_me">
<div>家庭医生签约率</div> <div>家庭医生签约率</div>
<div class="bo">62.16%</div> <div class="bo">62.16%</div>
@ -119,12 +163,15 @@
</div> </div>
</div> </div>
</div> </div>
<div class="flex1" style="margin-top: 20px"> <div
class="flex1"
style="margin-top: 20px"
>
<div class="yd_title familyPlanning"> <div class="yd_title familyPlanning">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<!-- <div style="width: 100%; "> --> <!-- <div style="width: 100%; "> -->
<eP5 :list="data.jsbgl"></eP5> <eP5 :list="data.jsbgl"></eP5>
@ -132,41 +179,66 @@
</div> </div>
</div> </div>
<div class="displayFlex right_bg"> <div class="displayFlex right_bg">
<div class="flex1" style="flex: 0.9"> <div
class="flex1"
style="flex: 0.9"
>
<div class="yd_title mechanism"> <div class="yd_title mechanism">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="history"> <div class="history">
<div class="history1"> <div class="history1">
<div class="va">{{ data.fyglrs.ycfrc }}</div> <div class="va">{{ data.fyglrs.ycfrc }}</div>
<img src="@/assets/images/hygiene/yf.png" alt="" /> <img
src="@/assets/images/hygiene/fy.png"
alt=""
/>
<img
src="@/assets/images/hygiene/fy1.png"
alt=""
class="fyMove"
/>
<div class="historyimg">孕产妇系统管理人数</div> <div class="historyimg">孕产妇系统管理人数</div>
</div> </div>
<div class="history1"> <div class="history1">
<div class="va">{{ data.fyglrs.etrs }}</div> <div class="va">{{ data.fyglrs.etrs }}</div>
<img src="@/assets/images/hygiene/et.png" alt="" /> <img
src="@/assets/images/hygiene/fy.png"
alt=""
/>
<img
src="@/assets/images/hygiene/fy2.png"
alt=""
class="fyMove"
/>
<div class="historyimg">0-6岁儿童系统管理人数</div> <div class="historyimg">0-6岁儿童系统管理人数</div>
</div> </div>
</div> </div>
</div> </div>
<div class="flex1" style="flex: 1.1"> <div
class="flex1"
style="flex: 1.1"
>
<div class="yd_title service"> <div class="yd_title service">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div>
</div> </div>
</div> <eP7
<eP7 :list="data.jktj.jktjrs" :year="data.jktj.year"></eP7> :list="data.jktj.jktjrs"
:year="data.jktj.year"
></eP7>
</div> </div>
<div class="flex1"> <div class="flex1">
<div class="yd_title last"> <div class="yd_title last">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<div <div
@ -175,7 +247,10 @@
@mouseenter="stopAutoScroll" @mouseenter="stopAutoScroll"
@mouseleave="startAutoScroll" @mouseleave="startAutoScroll"
> >
<div class="item" v-for="item in data.jkhd"> <div
class="item"
v-for="item in data.jkhd"
>
{{ item.jkhd }} {{ item.jkhd }}
</div> </div>
</div> </div>
@ -729,6 +804,31 @@ const getData = async () => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
position: relative;
.fyMove{
position: absolute;
top: 60px;
width: 60px;
height: 64px;
animation: example 3s infinite linear;
}
@keyframes example {
0% {
transform: translateY(0);
}
25% {
transform: translateY(-4px);
}
50% {
transform: translateY(0);
}
75% {
transform: translateY(4px);
}
100% {
transform: translateY(0);
}
}
.va { .va {
margin-top: 27px; margin-top: 27px;
margin-bottom: 10px; margin-bottom: 10px;
@ -901,14 +1001,41 @@ const getData = async () => {
text-align: center; text-align: center;
font-style: normal; font-style: normal;
font-family: PangMenZhengDao; font-family: PangMenZhengDao;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
position: relative;
.moveImg {
position: absolute;
top: 60px;
width: 64px;
height: 64px;
animation: example 3s infinite linear;
}
@keyframes example {
0% {
transform: translateY(0);
}
25% {
transform: translateY(-4px);
}
50% {
transform: translateY(0);
}
75% {
transform: translateY(4px);
}
100% {
transform: translateY(0);
}
}
.moveImg2 {
position: absolute;
top: 70px;
}
.va { .va {
margin-top: 27px; margin-top: 27px;
margin-bottom: 20px; margin-bottom: 20px;
font-family: TCloudNumber, TCloudNumber; font-family: TCloudNumber, TCloudNumber;
font-weight: bold; font-weight: bold;
font-size: 20px; font-size: 20px;