Merge branch 'main' of git.zdool.com:xs/ggfwjsc

This commit is contained in:
duanxiaohai 2024-06-04 11:25:33 +08:00
commit 1386572720
8 changed files with 258 additions and 123 deletions

BIN
src/assets/RightLine.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

View File

@ -20,6 +20,8 @@
</div> </div>
</div> </div>
</div> </div>
<img src="../assets/RightLine.gif" class="rightLineClass">
<img src="../assets/RightLine.gif" class="leftLineClass">
</div> </div>
</template> </template>
@ -218,5 +220,17 @@ onMounted(() => {
color: #fff; color: #fff;
} }
} }
.rightLineClass{
position: absolute;
right: -70px;
bottom: -50px;
}
.leftLineClass{
position: absolute;
transform: scaleX(-1);
left: -70px;
bottom: -50px;
}
} }
</style> </style>

View File

@ -888,13 +888,13 @@ onMounted(() => {
content: ""; content: "";
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 1px; height: 2px;
} }
i { i {
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 100%;
width: 1px; width: 2px;
} }
&::before { &::before {
top: 0; top: 0;

View File

@ -319,13 +319,13 @@ const getData = async () => {
content: ""; content: "";
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 1px; height: 2px;
} }
i { i {
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 100%;
width: 1px; width: 2px;
} }
&::before { &::before {
top: 0; top: 0;

View File

@ -2,12 +2,12 @@
<div class="module"> <div class="module">
<div class="displayFlex left_bg"> <div class="displayFlex left_bg">
<div class="flex1"> <div class="flex1">
<div class="yd_title left_1"> <div class="yd_title left_1">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="left_1_bg"> <div class="left_1_bg">
<div class="item yl_1"> <div class="item yl_1">
@ -16,16 +16,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>
@ -33,16 +30,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>
@ -52,16 +46,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>
@ -71,16 +62,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>
@ -90,16 +78,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>
@ -116,12 +101,15 @@
</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>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="left_2_top"> <div class="left_2_top">
<div class="item school"> <div class="item school">
@ -141,40 +129,46 @@
<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>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="left_3_1"> <div class="left_3_1">
<div <div
@ -206,22 +200,37 @@
<div class="people_total"> <div class="people_total">
<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>
</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>
</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
@ -251,13 +260,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"
@ -268,36 +284,57 @@
</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>
<div class="i"><zwfw1 /></div> <div class="i">
<zwfw1 />
</div>
</div> </div>
<div class="shang_item"> <div class="shang_item">
<div class="title">超期受理率</div> <div class="title">超期受理率</div>
<div class="i"><zwfw2 /></div> <div class="i">
<zwfw2 />
</div>
</div> </div>
<div class="shang_item"> <div class="shang_item">
<div class="title">超期办理率</div> <div class="title">超期办理率</div>
<div class="i"><zwfw3 /></div> <div class="i">
<zwfw3 />
</div>
</div> </div>
</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>
@ -310,9 +347,9 @@
<div class="flex1"> <div class="flex1">
<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="ylws"> <div class="ylws">
<div <div
@ -325,12 +362,15 @@
</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>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="whsy"> <div class="whsy">
<div <div
@ -345,12 +385,15 @@
</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>
<i></i> <i></i>
</div> </div>
</div> </div>
<div class="tysy"> <div class="tysy">
<div <div
@ -362,17 +405,23 @@
{{ item.value }}<span>{{ item.dw ? item.dw : "" }}</span> {{ item.value }}<span>{{ item.dw ? item.dw : "" }}</span>
</div> </div>
<img :src="item.img" /> <img :src="item.img" />
<img src="../assets/images/sy/tyBon.png" style="margin-top: -60px;"> <img
src="../assets/images/sy/tyBon.png"
style="margin-top: -60px;"
>
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</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 last_1"> <div class="yd_title last_1">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<!-- <table class="table"> <!-- <table class="table">
<tbody> <tbody>
@ -396,7 +445,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
: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">
@ -410,7 +467,15 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[1].img" alt="" /> <img
: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">
@ -426,7 +491,15 @@
</div> </div>
<div class="jtsyBoxbot"> <div class="jtsyBoxbot">
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[2].img" alt="" /> <img
: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">
@ -440,7 +513,15 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[3].img" alt="" /> <img
: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">
@ -454,7 +535,15 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img :src="data.jtsyList[4].img" alt="" /> <img
: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">
@ -997,16 +1086,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;
}); });
// //
@ -1289,13 +1376,13 @@ onBeforeMount(async () => {
content: ""; content: "";
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 1px; height: 2px;
} }
i { i {
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 100%;
width: 1px; width: 2px;
} }
&::before { &::before {
top: 0; top: 0;
@ -1306,7 +1393,7 @@ onBeforeMount(async () => {
#03e9f4, #03e9f4,
transparent transparent
); );
animation: one 4s linear infinite; animation: one 4s linear infinite;
} }
i:nth-child(1) { i:nth-child(1) {
@ -1372,7 +1459,7 @@ onBeforeMount(async () => {
left: 100%; left: 100%;
} }
} }
@keyframes two { @keyframes two {
0% { 0% {
top: -100%; top: -100%;
@ -1382,7 +1469,7 @@ onBeforeMount(async () => {
top: 100%; top: 100%;
} }
} }
@keyframes three { @keyframes three {
0% { 0% {
right: -100%; right: -100%;
@ -1392,7 +1479,7 @@ onBeforeMount(async () => {
right: 100%; right: 100%;
} }
} }
@keyframes four { @keyframes four {
0% { 0% {
bottom: -100%; bottom: -100%;
@ -1403,7 +1490,6 @@ onBeforeMount(async () => {
} }
} }
.mechanism { .mechanism {
background-image: url(@/assets/images/sy/new_ylws.png); background-image: url(@/assets/images/sy/new_ylws.png);
background-repeat: no-repeat; background-repeat: no-repeat;
@ -1948,6 +2034,25 @@ onBeforeMount(async () => {
background-size: 100% 100%; background-size: 100% 100%;
text-align: center; text-align: center;
padding-top: 22px; padding-top: 22px;
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);
}
}
div:nth-child(1) { div:nth-child(1) {
font-family: PangMenZhengDao, PangMenZhengDao; font-family: PangMenZhengDao, PangMenZhengDao;
@ -2441,13 +2546,22 @@ table {
height: 96px; height: 96px;
margin-right: 4px; margin-right: 4px;
} }
.jtsyBoxtop { .jtsyBoxtop {
display: flex; display: flex;
justify-content: space-evenly; justify-content: space-evenly;
margin-bottom: 15px; margin-bottom: 15px;
padding-top: 20px; padding-top: 20px;
.jtsyBoxtop1 { .jtsyBoxtop1 {
position: relative;
display: flex; display: flex;
.turn {
width: 146px;
height: 104px;
position: absolute;
left: -38px;
top: -31px;
}
span { span {
font-family: TCloudNumber, TCloudNumber; font-family: TCloudNumber, TCloudNumber;
font-weight: 400; font-weight: 400;
@ -2490,6 +2604,14 @@ table {
justify-content: space-between; justify-content: space-between;
.jtsyBoxtop1 { .jtsyBoxtop1 {
display: flex; display: flex;
position: relative;
.turn {
width: 146px;
height: 104px;
position: absolute;
left: -38px;
top: -31px;
}
span { span {
font-family: TCloudNumber, TCloudNumber; font-family: TCloudNumber, TCloudNumber;
font-weight: 400; font-weight: 400;
@ -2527,5 +2649,4 @@ table {
} }
} }
} }
</style> </style>

View File

@ -770,13 +770,13 @@ onMounted(() => {
content: ""; content: "";
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 1px; height: 2px;
} }
i { i {
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 100%;
width: 1px; width: 2px;
} }
&::before { &::before {
top: 0; top: 0;

View File

@ -511,13 +511,13 @@ const getData = async () => {
content: ""; content: "";
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 1px; height: 2px;
} }
i { i {
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 100%;
width: 1px; width: 2px;
} }
&::before { &::before {
top: 0; top: 0;