This commit is contained in:
姚宇浩 2024-08-06 15:45:34 +08:00
parent 2c42020acf
commit 52c7f14559
3 changed files with 64 additions and 52 deletions

View File

@ -508,9 +508,9 @@ const dataEc = reactive({
}); });
const nlfb = reactive({ const nlfb = reactive({
year: [2022, 2023, 2024, 2025, 2026,2027], year: [2022, 2023, 2024, 2025, 2026,2027],
list1: [0, 1000, 500, 0, 0,0], list1: [709, 3424, 2064, 0, 0,0],
list2: [0, 2000, 1000, 0, 0,0], list2: [1548, 5895, 2753, 0, 0,0],
list3: [0, 3000, 1500, 0, 0,0], list3: [180, 930, 632, 0, 0,0],
}); });
const showEnrol = () => { const showEnrol = () => {
dialogShowEnrol.value = true; dialogShowEnrol.value = true;

View File

@ -104,9 +104,10 @@ const getOption = () => {
}, },
series: [ series: [
{ {
xAxisIndex: 0,
name: "0-18岁", name: "0-18岁",
type: "line", type: "line",
stack: "Total", // stack: "Total",
symbol: "emptyCircle", symbol: "emptyCircle",
smooth: true, smooth: true,
symbolSize: 10, symbolSize: 10,
@ -151,9 +152,10 @@ const getOption = () => {
data: data.list, data: data.list,
}, },
{ {
xAxisIndex: 0,
name: "19-60岁", name: "19-60岁",
type: "line", type: "line",
stack: "Total", // stack: "Total",
symbol: "emptyCircle", symbol: "emptyCircle",
smooth: true, smooth: true,
symbolSize: 10, symbolSize: 10,
@ -198,9 +200,10 @@ const getOption = () => {
data: data.list2, data: data.list2,
}, },
{ {
xAxisIndex: 0,
name: "60岁以上", name: "60岁以上",
type: "line", type: "line",
stack: "Total", // stack: "Total",
symbol: "emptyCircle", symbol: "emptyCircle",
smooth: true, smooth: true,
symbolSize: 10, symbolSize: 10,

View File

@ -2,8 +2,11 @@
<div class="module11"> <div class="module11">
<div class="displayFlex left_bg"> <div class="displayFlex left_bg">
<div class="flex1"> <div class="flex1">
<div class="yd_title " :class="leftchoose.first == '1' ? 'left_1' : 'left_1_1'" <div
@click="change2('first')"> class="yd_title"
:class="leftchoose.first == '1' ? 'left_1' : 'left_1_1'"
@click="change2('first')"
>
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
@ -120,20 +123,20 @@
</div> </div>
</div> </div>
<div class="center_top"> <div class="center_top">
<div class="item"> <div class="item5">
<img src="@/assets/images/hygiene/mjzrc.png" class="left" /> <img src="@/assets/images/hygiene/mjzrc.png" class="left5" />
<div class="right"> <div class="right5">
<div class="right_top font">门急诊人次</div> <div class="right5_top font">门急诊人次</div>
<img src="@/assets/images/hygiene/jt.png" class="right_center" /> <img src="@/assets/images/hygiene/jt.png" class="right5_center" />
<div class="right_bottom">{{ data.mz.mjzrc }}</div> <div class="right5_bottom">{{ data.mz.mjzrc }}</div>
</div> </div>
</div> </div>
<div class="item"> <div class="item5">
<img src="@/assets/images/hygiene/zyrs.png" class="left" /> <img src="@/assets/images/hygiene/zyrs.png" class="left5" />
<div class="right"> <div class="right5">
<div class="right_top font">住院人数</div> <div class="right5_top font">住院人数</div>
<img src="@/assets/images/hygiene/jt.png" class="right_center" /> <img src="@/assets/images/hygiene/jt.png" class="right5_center" />
<div class="right_bottom">{{ data.mz.zyrs }}</div> <div class="right5_bottom">{{ data.mz.zyrs }}</div>
</div> </div>
</div> </div>
</div> </div>
@ -160,24 +163,26 @@
src="@/assets/images/hygiene/jd.gif" src="@/assets/images/hygiene/jd.gif"
alt="" alt=""
/> />
<div class="historyimg font" style="padding:0 20px;">建档份数</div> <div class="historyimg font" style="padding: 0 20px">
建档份数
</div>
</div> </div>
</div> </div>
<div class="minTopPart2"> <div class="minTopPart2">
<div class="left"> <div class="left5">
<div class="leftImg"> <div class="leftImg5">
<eP4 :list="data.jkda.jdl" v-if="showEchart"></eP4> <eP4 :list="data.jkda.jdl" v-if="showEchart"></eP4>
</div> </div>
<div class="left_me"> <div class="left5_me">
<div>建档率</div> <div>建档率</div>
<div class="bo">{{ data.jkda.jdl }}%</div> <div class="bo">{{ data.jkda.jdl }}%</div>
</div> </div>
</div> </div>
<div class="right"> <div class="right5">
<div class="rightImg"> <div class="rightImg5">
<eP4_1 :list="data.jkda.jtysqyl" v-if="showEchart"></eP4_1> <eP4_1 :list="data.jkda.jtysqyl" v-if="showEchart"></eP4_1>
</div> </div>
<div class="right_me"> <div class="right5_me">
<div>家庭医生签约率</div> <div>家庭医生签约率</div>
<div class="bo">{{ data.jkda.jtysqyl }}%</div> <div class="bo">{{ data.jkda.jtysqyl }}%</div>
</div> </div>
@ -211,14 +216,14 @@
<img src="@/assets/images/hygiene/fy.png" alt="" /> <img src="@/assets/images/hygiene/fy.png" alt="" />
<img src="@/assets/images/hygiene/fy1.png" alt="" class="fyMove" /> <img src="@/assets/images/hygiene/fy1.png" alt="" class="fyMove" />
<img src="@/assets/images/hygiene/fy.gif" class="historyMoveImg" /> <img src="@/assets/images/hygiene/fy.gif" class="historyMoveImg" />
<div class="historyimg font" >孕产妇系统管理人数</div> <div class="historyimg font">孕产妇系统管理人数</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/fy.png" alt="" /> <img src="@/assets/images/hygiene/fy.png" alt="" />
<img src="@/assets/images/hygiene/fy2.png" alt="" class="fyMove" /> <img src="@/assets/images/hygiene/fy2.png" alt="" class="fyMove" />
<img src="@/assets/images/hygiene/fy.gif" class="historyMoveImg" /> <img src="@/assets/images/hygiene/fy.gif" class="historyMoveImg" />
<div class="historyimg font" >0-6岁儿童系统管理人数</div> <div class="historyimg font">0-6岁儿童系统管理人数</div>
</div> </div>
</div> </div>
</div> </div>
@ -297,7 +302,7 @@ const data = reactive({
fyglrs: {}, // fyglrs: {}, //
jktj: {}, //65 jktj: {}, //65
jkhd: [], // jkhd: [], //
lxbx:{},// lxbx: {}, //
}); });
const tabYd = ref([ const tabYd = ref([
{ {
@ -412,7 +417,7 @@ const getData = async () => {
.module11 { .module11 {
display: flex; display: flex;
width: 100%; width: 100%;
// margin-top: 112px; // margin-top: 112px;
} }
.yd_title { .yd_title {
@ -746,26 +751,26 @@ const getData = async () => {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;
.item { .item5 {
display: flex; display: flex;
align-items: center; align-items: center;
.left { .left5 {
width: 102px; width: 102px;
height: 102px; height: 102px;
} }
.right { .right5 {
margin-left: 10px; margin-left: 10px;
.right_top { .right5_top {
font-size: 16px; font-size: 16px;
color: #ffffff; color: #ffffff;
line-height: 22px; line-height: 22px;
letter-spacing: 2px; letter-spacing: 2px;
} }
.right_center { .right5_center {
width: 100px; width: 100px;
height: 7px; height: 7px;
} }
.right_bottom { .right5_bottom {
margin-top: 3px; margin-top: 3px;
padding: 5px; padding: 5px;
font-size: 22px; font-size: 22px;
@ -1187,30 +1192,34 @@ const getData = async () => {
} }
.minTopPart2 { .minTopPart2 {
margin-left: 5px; margin-left: 5px;
width: 420px; width: 390px;
height: 136px; height: 160px;
background-image: url(@/assets/images/hygiene/xia_1.png); background-image: url(@/assets/images/hygiene/xia_1.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
align-items: center; align-items: center;
position: relative; position: relative;
display: flex; display: flex;
justify-content: space-around;
margin-top: 35px; margin-top: 35px;
padding: 0 5px; padding: 0 5px;
box-sizing: border-box; box-sizing: border-box;
.left { .left5 {
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-left: 13px; margin-left: 13px;
.leftImg { .leftImg5 {
width: 90px; width: 90px;
height: 90px; height: 90px;
margin-bottom: 10px;
} }
.left_me { .left5_me {
margin-left: 10px; margin-left: 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
text-align: center;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 500; font-weight: 500;
font-size: 14px; font-size: 14px;
@ -1220,7 +1229,7 @@ const getData = async () => {
text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.65); text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.65);
.bo { .bo {
margin-top: 5px; // margin-top: 5px;
font-family: TCloudNumber, TCloudNumber; font-family: TCloudNumber, TCloudNumber;
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 18px;
@ -1230,19 +1239,20 @@ const getData = async () => {
} }
} }
} }
.right { .right5 {
display: flex;
align-items: center;
// justify-content: center;
.rightImg {
width: 90px;
height: 90px;
}
.right_me {
margin-left: 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center;
justify-content: center;
.rightImg5 {
width: 90px;
height: 90px;
margin-bottom: 10px;
}
.right5_me {
display: flex;
flex-direction: column;
text-align: center;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 500; font-weight: 500;
font-size: 14px; font-size: 14px;
@ -1251,7 +1261,6 @@ const getData = async () => {
letter-spacing: 2px; letter-spacing: 2px;
text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.65); text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.65);
.bo { .bo {
margin-top: 5px;
font-family: TCloudNumber, TCloudNumber; font-family: TCloudNumber, TCloudNumber;
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 18px;
@ -1319,7 +1328,7 @@ const getData = async () => {
margin-top: 15px; margin-top: 15px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.font{ .font {
font-size: 18px !important; font-size: 18px !important;
} }
</style> </style>