This commit is contained in:
duanxiaohai 2024-06-05 13:11:13 +08:00
commit 005ba272f3
17 changed files with 240 additions and 101 deletions

BIN
src/assets/YLimg/turn.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 457 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 130 KiB

After

Width:  |  Height:  |  Size: 115 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 127 KiB

After

Width:  |  Height:  |  Size: 116 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 130 KiB

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 227 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 305 B

View File

@ -246,7 +246,7 @@ const getOption = () => {
yAxisIndex: 0, yAxisIndex: 0,
name: "特困救助人次", name: "特困救助人次",
data: data.list1, data: data.list1,
barWidth: 10, barWidth: 15,
type: "bar", type: "bar",
// itemStyle: { // itemStyle: {
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@ -282,7 +282,7 @@ const getOption = () => {
yAxisIndex: 0, yAxisIndex: 0,
name: "低保救助人次", name: "低保救助人次",
data: data.list2, data: data.list2,
barWidth: 10, barWidth: 15,
type: "bar", type: "bar",
itemStyle: { itemStyle: {
color: { color: {
@ -318,7 +318,7 @@ const getOption = () => {
yAxisIndex: 0, yAxisIndex: 0,
name: "低边救助人次", name: "低边救助人次",
data: data.list3, data: data.list3,
barWidth: 10, barWidth: 15,
type: "bar", type: "bar",
itemStyle: { itemStyle: {
color: { color: {
@ -386,7 +386,7 @@ const getOption = () => {
symbolPosition: "end", symbolPosition: "end",
data: data.list1, data: data.list1,
symbol: "diamond", symbol: "diamond",
symbolOffset: ["-20%", "-50%"], symbolOffset: ["-50%", "-50%"],
symbolSize: [14, 8], symbolSize: [14, 8],
itemStyle: { itemStyle: {
borderColor: "#2fffa4", borderColor: "#2fffa4",
@ -414,7 +414,7 @@ const getOption = () => {
symbolPosition: "end", symbolPosition: "end",
data: data.list3, data: data.list3,
symbol: "diamond", symbol: "diamond",
symbolOffset: [5, "-50%"], symbolOffset: [8, "-50%"],
symbolSize: [14, 8], symbolSize: [14, 8],
itemStyle: { itemStyle: {
borderColor: "#32ffee", borderColor: "#32ffee",

View File

@ -90,8 +90,11 @@
</div> </div>
</div> </div>
<div class="schoolb"> <div class="schoolb">
<img src="../assets/eduImg/xxgkTop.png" class="gkTop" alt="" /> <img
<img src="../assets/eduImg/xxgk.gif" class="gkMove" alt="" /> src="../assets/eduImg/xxgkTop.png"
class="gkTop"
alt=""
>
<div class="grade"> <div class="grade">
<div class="schoolbs"> <div class="schoolbs">
<span class="spot">初中</span> <span class="spot">初中</span>
@ -1061,8 +1064,9 @@ onMounted(() => {
.ppImg { .ppImg {
position: absolute; position: absolute;
width: 500px; width: 160px;
height: 170px; height: 120px;
top: 20px;
} }
img { img {

View File

@ -201,6 +201,10 @@
alt="" alt=""
class="fyMove" class="fyMove"
/> />
<img
src="@/assets/images/hygiene/fy.gif"
class="historyMoveImg"
/>
<div class="historyimg">孕产妇系统管理人数</div> <div class="historyimg">孕产妇系统管理人数</div>
</div> </div>
<div class="history1"> <div class="history1">
@ -214,6 +218,10 @@
alt="" alt=""
class="fyMove" class="fyMove"
/> />
<img
src="@/assets/images/hygiene/fy.gif"
class="historyMoveImg"
/>
<div class="historyimg">0-6岁儿童系统管理人数</div> <div class="historyimg">0-6岁儿童系统管理人数</div>
</div> </div>
</div> </div>
@ -800,7 +808,6 @@ 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;
@ -858,6 +865,12 @@ const getData = async () => {
line-height: 21px; line-height: 21px;
letter-spacing: 2px; letter-spacing: 2px;
} }
.historyMoveImg {
position: absolute;
top: 60px;
width: 180px;
height: 120px;
}
} }
img { img {
width: 154px; width: 154px;

View File

@ -15,16 +15,13 @@
</div> </div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span <span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.zgylbxzsr }}万元</span>
><span class="right"
>{{ data.LivelihoodWelfare.zgylbxzsr }}万元</span
>
</div> </div>
<div class="sr" style="margin-top: 5px"> <div
<span class="left">支出</span class="sr"
><span class="right" style="margin-top: 5px"
>{{ data.LivelihoodWelfare.zgylbxzzc }}万元</span >
> <span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.zgylbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -32,16 +29,13 @@
<div class="item_title"><span class="blue">工伤</span>保险</div> <div class="item_title"><span class="blue">工伤</span>保险</div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span <span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.gsbxzsr }}万元</span>
><span class="right"
>{{ data.LivelihoodWelfare.gsbxzsr }}万元</span
>
</div> </div>
<div class="sr" style="margin-top: 5px"> <div
<span class="left">支出</span class="sr"
><span class="right" style="margin-top: 5px"
>{{ data.LivelihoodWelfare.gsbxzzc }}万元</span >
> <span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.gsbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -51,16 +45,13 @@
</div> </div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span <span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.cxylbxzsr }}万元</span>
><span class="right"
>{{ data.LivelihoodWelfare.cxylbxzsr }}万元</span
>
</div> </div>
<div class="sr" style="margin-top: 5px"> <div
<span class="left">支出</span class="sr"
><span class="right" style="margin-top: 5px"
>{{ data.LivelihoodWelfare.cxylbxzzc }}万元</span >
> <span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.cxylbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -70,16 +61,13 @@
</div> </div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span <span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.zgyilbxzsr }}万元</span>
><span class="right"
>{{ data.LivelihoodWelfare.zgyilbxzsr }}万元</span
>
</div> </div>
<div class="sr" style="margin-top: 5px"> <div
<span class="left">支出</span class="sr"
><span class="right" style="margin-top: 5px"
>{{ data.LivelihoodWelfare.zgyilbxzzc }}万元</span >
> <span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.zgyilbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -89,16 +77,13 @@
</div> </div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span <span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.cxyilbxzsr }}万元</span>
><span class="right"
>{{ data.LivelihoodWelfare.cxyilbxzsr }}万元</span
>
</div> </div>
<div class="sr" style="margin-top: 5px"> <div
<span class="left">支出</span class="sr"
><span class="right" style="margin-top: 5px"
>{{ data.LivelihoodWelfare.cxyilbxzzc }}万元</span >
> <span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.cxyilbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -115,7 +100,10 @@
</div> </div>
</div> </div>
</div> </div>
<div class="flex1" style="margin-top: 10px"> <div
class="flex1"
style="margin-top: 10px"
>
<div class="yd_title left_2"> <div class="yd_title left_2">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -140,35 +128,41 @@
<div class="left_2_bottom_item"> <div class="left_2_bottom_item">
<div class="left_2_bottom_item_shang"> <div class="left_2_bottom_item_shang">
<div class="left"> <div class="left">
<span class="span1">{{ jysyList[0].title }}</span <span class="span1">{{ jysyList[0].title }}</span>学校师生比
>学校师生比
</div> </div>
<div class="right"> <div class="right">
<span class="span1">{{ jysyList[0].teacher }}</span <span class="span1">{{ jysyList[0].teacher }}</span>:{{ jysyList[0].student }}
>:{{ jysyList[0].student }}
</div> </div>
</div> </div>
<div class="left_2_bottom_item_xia"> <div class="left_2_bottom_item_xia">
<div class="csbl" :style="cs"></div> <div
class="csbl"
:style="cs"
></div>
</div> </div>
</div> </div>
<div class="left_2_bottom_item"> <div class="left_2_bottom_item">
<div class="left_2_bottom_item_shang"> <div class="left_2_bottom_item_shang">
<div class="left"> <div class="left">
<span class="span2">{{ jysyList[1].title }}</span <span class="span2">{{ jysyList[1].title }}</span>学校师生比
>学校师生比
</div> </div>
<div class="right"> <div class="right">
{{ jysyList[1].teacher }}:{{ jysyList[1].student }} {{ jysyList[1].teacher }}:{{ jysyList[1].student }}
</div> </div>
</div> </div>
<div class="left_2_bottom_item_xia"> <div class="left_2_bottom_item_xia">
<div class="ncbl" :style="nc"></div> <div
class="ncbl"
:style="nc"
></div>
</div> </div>
</div> </div>
</div> </div>
</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>
@ -213,22 +207,47 @@
/> />
<div class="people_total_item left"> <div class="people_total_item left">
<div class="number">{{ data.PopulationData.man }}</div> <div class="number">{{ data.PopulationData.man }}</div>
<img src="../assets/images/sy/man.png" alt="" /> <img
src="../assets/images/sy/man.png"
alt=""
/>
<div class="sex">男性人口</div> <div class="sex">男性人口</div>
<img
class="sexMove"
src="../assets/images/sy/sexImg.png"
alt=""
/>
</div> </div>
<div class="people_total_item2 center"> <div class="people_total_item2 center">
<img src="../assets/images/sy/people_total.png" alt="" /> <img
src="../assets/images/sy/people_total.png"
alt=""
/>
<div class="number">{{ data.PopulationData.rkzs }}</div> <div class="number">{{ data.PopulationData.rkzs }}</div>
<div class="total">人口总数</div> <div class="total">人口总数</div>
</div> </div>
<div class="people_total_item right"> <div class="people_total_item right">
<div class="number">{{ data.PopulationData.woman }}</div> <div class="number">{{ data.PopulationData.woman }}</div>
<img src="../assets/images/sy/woman.png" alt="" /> <img
src="../assets/images/sy/woman.png"
alt=""
/>
<div class="sex">女性人口</div> <div class="sex">女性人口</div>
<img
class="sexMove"
src="../assets/images/sy/sexImg.png"
alt=""
/>
</div> </div>
</div> </div>
<ePie2 style="margin-top: 20px" :list="data.ageRatio"></ePie2> <ePie2
<ePie style="margin-bottom: 20px" :list="data.ageGroup"></ePie> style="margin-top: 20px"
:list="data.ageRatio"
></ePie2>
<ePie
style="margin-bottom: 20px"
:list="data.ageGroup"
></ePie>
<div class="table"> <div class="table">
<div class="table_choose"> <div class="table_choose">
<div <div
@ -258,13 +277,20 @@
:header-cell-style="tableHeaderColor" :header-cell-style="tableHeaderColor"
v-if="choose == '1'" v-if="choose == '1'"
> >
<el-table-column prop="company" label="企业名称" width="200" /> <el-table-column
prop="company"
label="企业名称"
width="200"
/>
<el-table-column <el-table-column
prop="address" prop="address"
label="项目事项牵头单位" label="项目事项牵头单位"
width="200" width="200"
/> />
<el-table-column prop="finish" label="完成情况"> <el-table-column
prop="finish"
label="完成情况"
>
<template #default="scope"> <template #default="scope">
<div <div
style="letter-spacing: 3px" style="letter-spacing: 3px"
@ -275,7 +301,10 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="zwfw" v-if="choose == '3'"> <div
class="zwfw"
v-if="choose == '3'"
>
<div class="shang"> <div class="shang">
<div class="shang_item"> <div class="shang_item">
<div class="title">一网通办事</div> <div class="title">一网通办事</div>
@ -298,19 +327,31 @@
</div> </div>
<div class="xia"> <div class="xia">
<div class="xia_item"> <div class="xia_item">
<img class="left" src="@/assets/images/sy/zwfw_sl.png" /> <img
class="left"
src="@/assets/images/sy/zwfw_sl.png"
/>
<div class="right"> <div class="right">
<div class="name">平均受理时长</div> <div class="name">平均受理时长</div>
<img class="line" src="@/assets/images/sy/zwfw_line.png" /> <img
class="line"
src="@/assets/images/sy/zwfw_line.png"
/>
<div class="time"><span>0.22</span>小时</div> <div class="time"><span>0.22</span>小时</div>
</div> </div>
</div> </div>
<div class="fgx"></div> <div class="fgx"></div>
<div class="xia_item"> <div class="xia_item">
<img class="left" src="@/assets/images/sy/zwfw_bl.png" /> <img
class="left"
src="@/assets/images/sy/zwfw_bl.png"
/>
<div class="right"> <div class="right">
<div class="name">平均办理时长</div> <div class="name">平均办理时长</div>
<img class="line" src="@/assets/images/sy/zwfw_line.png" /> <img
class="line"
src="@/assets/images/sy/zwfw_line.png"
/>
<div class="time"><span>0.54</span>小时</div> <div class="time"><span>0.54</span>小时</div>
</div> </div>
</div> </div>
@ -338,7 +379,10 @@
</div> </div>
</div> </div>
</div> </div>
<div class="flex1" style="margin-top: 10px"> <div
class="flex1"
style="margin-top: 10px"
>
<div class="yd_title service"> <div class="yd_title service">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -358,7 +402,10 @@
</div> </div>
</div> </div>
</div> </div>
<div class="flex1" style="margin-top: 10px"> <div
class="flex1"
style="margin-top: 10px"
>
<div class="yd_title last"> <div class="yd_title last">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -383,7 +430,10 @@
</div> </div>
</div> </div>
</div> </div>
<div class="flex1" style="margin-top: 10px"> <div
class="flex1"
style="margin-top: 10px"
>
<div class="yd_title last_1"> <div class="yd_title last_1">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -412,8 +462,15 @@
<div class="jtsyBox"> <div class="jtsyBox">
<div class="jtsyBoxtop"> <div class="jtsyBoxtop">
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[0].img" alt="" /> <img
<img src="../assets/images/sy/jtsy.gif" class="turn" alt="" /> :src="data.jtsyList[0].img"
alt=""
/>
<img
src="../assets/images/sy/jtsy.gif"
class="turn"
alt=""
/>
<div> <div>
<div class="jtsyname">{{ data.jtsyList[0].name }}</div> <div class="jtsyname">{{ data.jtsyList[0].name }}</div>
<div class="jtsytext"> <div class="jtsytext">
@ -427,8 +484,15 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[1].img" alt="" /> <img
<img src="../assets/images/sy/jtsy.gif" class="turn" alt="" /> :src="data.jtsyList[1].img"
alt=""
/>
<img
src="../assets/images/sy/jtsy.gif"
class="turn"
alt=""
/>
<div> <div>
<div class="jtsyname">{{ data.jtsyList[1].name }}</div> <div class="jtsyname">{{ data.jtsyList[1].name }}</div>
<div class="jtsytext"> <div class="jtsytext">
@ -444,8 +508,15 @@
</div> </div>
<div class="jtsyBoxbot"> <div class="jtsyBoxbot">
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[2].img" alt="" /> <img
<img src="../assets/images/sy/jtsy.gif" class="turn" alt="" /> :src="data.jtsyList[2].img"
alt=""
/>
<img
src="../assets/images/sy/jtsy.gif"
class="turn"
alt=""
/>
<div> <div>
<div class="jtsyname">{{ data.jtsyList[2].name }}</div> <div class="jtsyname">{{ data.jtsyList[2].name }}</div>
<div class="jtsytext"> <div class="jtsytext">
@ -459,8 +530,15 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[3].img" alt="" /> <img
<img src="../assets/images/sy/jtsy.gif" class="turn" alt="" /> :src="data.jtsyList[3].img"
alt=""
/>
<img
src="../assets/images/sy/jtsy.gif"
class="turn"
alt=""
/>
<div> <div>
<div class="jtsyname">{{ data.jtsyList[3].name }}</div> <div class="jtsyname">{{ data.jtsyList[3].name }}</div>
<div class="jtsytext"> <div class="jtsytext">
@ -474,8 +552,15 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[4].img" alt="" /> <img
<img src="../assets/images/sy/jtsy.gif" class="turn" alt="" /> :src="data.jtsyList[4].img"
alt=""
/>
<img
src="../assets/images/sy/jtsy.gif"
class="turn"
alt=""
/>
<div> <div>
<div class="jtsyname">{{ data.jtsyList[4].name }}</div> <div class="jtsyname">{{ data.jtsyList[4].name }}</div>
<div class="jtsytext"> <div class="jtsytext">
@ -1018,16 +1103,14 @@ const jtsyList = ref([
// //
const cs = computed(() => { const cs = computed(() => {
let str = `--teacher: ${jysyList.value[0].teacher}; --total: ${ let str = `--teacher: ${jysyList.value[0].teacher}; --total: ${jysyList.value[0].teacher + jysyList.value[0].student
jysyList.value[0].teacher + jysyList.value[0].student }`;
}`;
return str; return str;
}); });
// //
const nc = computed(() => { const nc = computed(() => {
let str = `--teacher: ${jysyList.value[1].teacher}; --total: ${ let str = `--teacher: ${jysyList.value[1].teacher}; --total: ${jysyList.value[1].teacher + jysyList.value[1].student
jysyList.value[1].teacher + jysyList.value[1].student }`;
}`;
return str; return str;
}); });
// //
@ -1564,7 +1647,6 @@ onBeforeMount(async () => {
.right { .right {
margin-left: 10px; margin-left: 10px;
.right_top { .right_top {
font-size: 16px; font-size: 16px;
color: #ffffff; color: #ffffff;
@ -1916,9 +1998,9 @@ onBeforeMount(async () => {
.right { .right {
letter-spacing: 3px; letter-spacing: 3px;
font-size:22px; font-size: 22px;
span{ span {
font-size:22px; font-size: 22px;
} }
} }
} }
@ -2102,6 +2184,30 @@ onBeforeMount(async () => {
top: 40px; top: 40px;
right: 50px; right: 50px;
} }
.sexMove {
position: absolute;
width: 100px;
height: 20px;
top: 80px;
animation: sexIM 3s infinite linear;
}
@keyframes sexIM {
0% {
transform: translateY(0);
}
25% {
transform: translateY(-3px);
}
50% {
transform: translateY(0);
}
75% {
transform: translateY(2px);
}
100% {
transform: translateY(0);
}
}
} }
.table { .table {

View File

@ -243,7 +243,11 @@
<div class="serviceBox"> <div class="serviceBox">
<div class="serviceTop"> <div class="serviceTop">
<div class="visit"> <div class="visit">
<img class="serviceimg" src="@/assets/YLimg/ylimg8.png" alt="" /> <img
class="serviceimg"
src="@/assets/YLimg/ylimg8.png"
alt=""
/>
<ylSMFW :list="data.smfwcs"></ylSMFW> <ylSMFW :list="data.smfwcs"></ylSMFW>
</div> </div>
<div class="medicalService"> <div class="medicalService">
@ -252,6 +256,11 @@
src="@/assets/YLimg/ylimg9.png" src="@/assets/YLimg/ylimg9.png"
alt="" alt=""
/> />
<img
class="moveYl"
src="@/assets/YLimg/turn.gif"
alt=""
/>
<div class="medicalServiceTop"> <div class="medicalServiceTop">
<img <img
class="ylimg" class="ylimg"
@ -710,6 +719,13 @@ const getData = async () => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
position: relative;
.moveYl {
position: absolute;
width: 200px;
height: 190px;
top: 36px;
}
.ylimg { .ylimg {
width: 200px; width: 200px;