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

This commit is contained in:
duanxiaohai 2024-06-06 15:24:11 +08:00
commit 99919c256b
9 changed files with 541 additions and 504 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

View File

@ -119,13 +119,14 @@ const getOption = () => {
barGap: 0.3 /*多个并排柱子设置柱子之间的间距*/, barGap: 0.3 /*多个并排柱子设置柱子之间的间距*/,
label: { label: {
show: true, show: true,
position: "inside", position: "right",
color: "#ffffff", color: "#ffffff",
formatter: function (data) { formatter: function (data) {
return data.value; return data.value;
}, },
}, },
itemStyle: { itemStyle: {
show:true,
color: { color: {
type: "linear", type: "linear",
colorStops: [ colorStops: [
@ -145,7 +146,7 @@ const getOption = () => {
barGap: 0.3 /*多个并排柱子设置柱子之间的间距*/, barGap: 0.3 /*多个并排柱子设置柱子之间的间距*/,
label: { label: {
show: true, show: true,
position: "inside", position: "right",
color: "#ffffff", color: "#ffffff",
formatter: function (data) { formatter: function (data) {
return data.value; return data.value;
@ -153,6 +154,7 @@ const getOption = () => {
}, },
itemStyle: { itemStyle: {
color: { color: {
show:true,
type: "linear", type: "linear",
colorStops: [ colorStops: [
{ offset: 0, color: "rgba(23, 255, 206, 0.2)" }, { offset: 0, color: "rgba(23, 255, 206, 0.2)" },

View File

@ -449,7 +449,7 @@ const setChart1 = () => {
onBeforeMount(() => { onBeforeMount(() => {
setTimeout(() => { setTimeout(() => {
data.list = props.list; data.list = props.list;
data.month = props.list.month; data.month = props.list.month.map((item) => item + "月");
// console.log(data.list, ""); // console.log(data.list, "");
setChart1(); setChart1();
getOption(); getOption();

View File

@ -36,321 +36,334 @@ const data = reactive({
list: [], list: [],
list1: [], list1: [],
list2: [], list2: [],
year: [], lineData: [],
lineData2: [],
month: [],
option: {}, option: {},
initialLegendData: ["困难军人生活补贴人数", "困难军人生活补贴金额"],
}); });
// const data1 = [120, 200, 50, 80, 70]; // const data1 = [120, 200, 50, 80, 70];
// const data2 = [12, 20, 5, 8, 7]; // const data2 = [12, 20, 5, 8, 7];
// const lineData = [150, 230, 24, 218, 135]; // const lineData = [150, 230, 24, 218, 135];
// const lineData2 = [15, 23, 4, 18, 15]; // const lineData2 = [15, 23, 4, 18, 15];
// const max = data //
// .concat(lineData) const color = [
// .reduce((pre, cur) => (pre > cur ? pre : cur), 0); // {
// // type: "linear",
// const color = [ x: 0,
// { x2: 0,
// type: "linear", y: 0,
// x: 0, y2: 1,
// x2: 0, },
// y: 0, ];
// y2: 1,
// },
// ];
// const getOption = () => { const getOption = () => {
// data.option = { data.option = {
// tooltip: { tooltip: {
// trigger: "axis", trigger: "axis",
// formatter: "{b0}<br/> {a0}:{c0}<br/>{a1}:{c1}<br/>{a2}:{c2}<br/>{a3}:{c3}", formatter:
// }, "{b0}月<br/> {a0}:{c0}<br/>{a1}:{c1}<br/>{a2}:{c2}<br/>{a3}:{c3}",
},
// legend: { legend: {
// data: [ data: [
// "", "困难残疾人生活补贴人数",
// "", "护理补贴人数",
// "", "",
// "", "困难残疾人生活补贴金额",
// "", "护理补贴金额",
// ], ],
// top: "3%", top: "3%",
// textStyle: { textStyle: {
// fontSize: 14, fontSize: 14,
// color: "#ffffff", // color: "#ffffff", //
// }, },
// }, },
// grid: { grid: {
// top: "25%", top: "25%",
// left: "6%", left: "6%",
// right: "9%", right: "9%",
// bottom: "5%", bottom: "5%",
// containLabel: true, containLabel: true,
// color: "#ffffff", color: "#ffffff",
// fontSize: 14, fontSize: 14,
// }, },
// calculable: true, calculable: true,
// color, color,
// xAxis: [ xAxis: [
// { {
// type: "category", type: "category",
// axisLabel: { axisLabel: {
// // //
// textStyle: { textStyle: {
// color: "#ffffff", color: "#ffffff",
// fontSize: 14, fontSize: 14,
// }, },
// }, },
// axisTick: { axisTick: {
// show: false, // show: false, //
// }, },
// data: ["2019", "2020", "2021", "2022", "2023"], data: data.month,
// }, },
// { {
// type: "category", type: "category",
// show: false, show: false,
// data: ["2019", "2020", "2021", "2022", "2023"], data: data.month,
// }, },
// ], ],
// yAxis: [ yAxis: [
// { {
// type: "value", type: "value",
// scale: true, scale: true,
// name: "", name: "补贴人数",
// splitLine: { splitLine: {
// //线 //线
// show: false, show: false,
// lineStyle: { lineStyle: {
// color: "#ffffff", color: "#ffffff",
// fontSize: 14, fontSize: 14,
// width: 1, width: 1,
// }, },
// }, },
// axisLabel: { axisLabel: {
// //y //y
// textStyle: { textStyle: {
// color: "#ffffff", color: "#ffffff",
// fontSize: 14, fontSize: 14,
// }, },
// }, },
// axisLine: { axisLine: {
// //y线 //y线
// show: false, show: false,
// lineStyle: { lineStyle: {
// color: "#ffffff", color: "#ffffff",
// fontSize: 14, fontSize: 14,
// width: 1, width: 1,
// type: "solid", type: "solid",
// }, },
// }, },
// }, },
// { {
// type: "value", type: "value",
// scale: true, scale: true,
// min: 0, min: 0,
// name: "/", name: "救助金额/元",
// splitLine: { splitLine: {
// show: false, show: false,
// lineStyle: { lineStyle: {
// color: "rgba(226, 226, 226, 0.3)", color: "rgba(226, 226, 226, 0.3)",
// width: 1, width: 1,
// }, },
// }, },
// axisLabel: { axisLabel: {
// //y //y
// textStyle: { textStyle: {
// color: "#ffffff", color: "#ffffff",
// fontSize: 14, fontSize: 14,
// }, },
// }, },
// axisLine: { axisLine: {
// //y线 //y线
// show: false, show: false,
// lineStyle: { lineStyle: {
// color: "#ffffff", color: "#ffffff",
// fontSize: 14, fontSize: 14,
// width: 1, width: 1,
// type: "solid", type: "solid",
// }, },
// }, },
// }, },
// { {
// type: "value", type: "value",
// min: 0, min: 0,
// max: 100, max: 100,
// splitLine: { splitLine: {
// show: false, show: false,
// lineStyle: { lineStyle: {
// type: "solid", type: "solid",
// color: "rgb(221, 242, 255,0.1)", color: "rgb(221, 242, 255,0.1)",
// }, },
// }, },
// axisLine: { axisLine: {
// show: false, show: false,
// lineStyle: { lineStyle: {
// type: "dotted", type: "dotted",
// }, },
// }, },
// axisLabel: { axisLabel: {
// show: false, show: false,
// fontSize: 14, fontSize: 14,
// color: "#ffffff", color: "#ffffff",
// lineHeight: 19, lineHeight: 19,
// fontFamily: "MicrosoftYaHei", fontFamily: "MicrosoftYaHei",
// }, },
// }, },
// ], ],
// series: [ series: [
// { {
// yAxisIndex: 0, z: 1,
// name: "", yAxisIndex: 0,
// data: data1, name: "困难残疾人生活补贴人数",
// barWidth: 10, data: data.list1,
// type: "bar", barWidth: 18,
// itemStyle: { barGap: "-50%",
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ type: "bar",
// { itemStyle: {
// offset: 0, color: {
// color: "rgba(142, 187, 255, 1)", type: "linear",
// }, x: 0,
// { x2: 1,
// offset: 1, y: 0,
// color: "rgba(142, 187, 255, 0.20)", y2: 0,
// }, colorStops: [
// ]), { offset: 0, color: "rgba(142, 187, 255, .7)" },
// }, { offset: 0.5, color: "rgba(142, 187, 255, .7)" },
// }, { offset: 0.5, color: "rgba(142, 187, 255, .3)" },
{ offset: 1, color: "rgba(142, 187, 255, .5)" },
],
},
},
},
// { {
// yAxisIndex: 0, z: 2,
// name: "", yAxisIndex: 0,
// data: data2, name: "护理补贴人数",
// barWidth: 10, data: data.list2,
// type: "bar", barWidth: 18,
// itemStyle: { barGap: "-50%",
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ type: "bar",
// { itemStyle: {
// offset: 0, color: {
// color: "rgba(23, 237, 255, 1)", type: "linear",
// }, x: 0,
// { x2: 1,
// offset: 1, y: 0,
// color: "rgba(23, 237, 255, 0.20)", y2: 0,
// }, colorStops: [
// ]), { offset: 0, color: "rgba(23, 237, 255, .7)" },
// }, { offset: 0.5, color: "rgba(23, 237, 255, .7)" },
// }, { offset: 0.5, color: "rgba(23, 237, 255, .3)" },
// { { offset: 1, color: "rgba(23, 237, 255, .5)" },
// yAxisIndex: 1, ],
// name: "", },
// data: lineData, },
// type: "line", //线 },
// itemStyle: { {
// borderColor: "#00FCFF", yAxisIndex: 1,
// borderWidth: 1, name: "困难残疾人生活补贴金额",
// color: "#00FCFF", data: data.lineData,
// }, type: "line", //线
// }, itemStyle: {
// { borderColor: "#00FCFF",
// yAxisIndex: 1, borderWidth: 1,
// name: "", color: "#00FCFF",
// data: lineData2, },
// type: "line", //线 },
// itemStyle: { {
// borderColor: "#00FCFF", yAxisIndex: 1,
// borderWidth: 1, name: "护理补贴金额",
// color: "#2468FF", data: data.lineData2,
// }, type: "line", //线
// }, itemStyle: {
// { borderColor: "#00FCFF",
// yAxisIndex: 2, borderWidth: 1,
// xAxisIndex: 1, color: "#2468FF",
// itemStyle: { },
// color: "rgba(180, 180, 180, 0.2)", // },
// }, {
// data: data.map(() => 100), yAxisIndex: 2,
// barWidth: 60, // xAxisIndex: 1,
// emphasis: { itemStyle: {
// itemStyle: { color: "rgba(180, 180, 180, 0.2)", //
// color: { },
// type: "linear", data: data.month.map(() => 100),
// x: 0, barWidth: 60, //
// x2: 0, emphasis: {
// y: 0, itemStyle: {
// y2: 1, color: {
// colorStops: [ type: "linear",
// { x: 0,
// offset: 0, x2: 0,
// color: "rgba(64, 247, 176, 0.25)", y: 0,
// }, y2: 1,
// { colorStops: [
// offset: 1, {
// color: "rgba(17, 34, 64, 0.25)", offset: 0,
// }, color: "rgba(64, 247, 176, 0.25)",
// ], },
// }, {
// }, offset: 1,
// }, color: "rgba(17, 34, 64, 0.25)",
// type: "bar", },
// }, ],
// ], },
// }; },
// } },
type: "bar",
},
{
z: 1,
name: "上部1",
type: "pictorialBar",
symbolPosition: "end",
data: data.list1,
symbol: "diamond",
symbolOffset: ["-25%", "-50%"],
symbolSize: [18, 12],
itemStyle: {
borderColor: "#2fffa4",
color: "rgba(142, 187, 255, 1)",
},
},
{
z: 2,
name: "上部2",
type: "pictorialBar",
symbolPosition: "end",
data: data.list2,
symbol: "diamond",
symbolOffset: [4, "-50%"],
symbolSize: [18, 12],
itemStyle: {
borderColor: "#32ffee",
color: "rgba(23, 237, 255, 1)",
},
},
],
};
};
// 使 const setChart = () => {
// onMounted(() => { var myChart = echarts.init(chart.value);
// // domecharts myChart.setOption(data.option);
// // var myChart = echarts.init(document.getElementById('main')); };
// // Vue3
// var myChart = echarts.init(chart.value);
// // init(); // vue3.2this const setChart1 = () => {
// // 使 data.list1 = [];
// myChart.setOption(option); data.list2 = [];
data.lineData = [];
// // : data.lineData2 = [];
// // window.addEventListener("resize", () => { data.list.data.forEach((item) => {
// // myChart.resize(); data.list1.push(item.shbtrs); //
// // }); data.list2.push(item.hlbtrs); //
// }); data.lineData.push(item.shbtje); //
data.lineData2.push(item.hlbtje); //
// const setChart = () => { });
// var myChart = echarts.init(chart.value); data.month = data.list.month.map((item) => item + "月");
// myChart.setOption(data.option); // console.log("2", data.list1, data.list2);
// }; };
// const setChart1 = () => {
// data.list1 = [];
// data.list2 = [];
// data.list.data.forEach((item) => {
// data.list1.push(item.jzrs); //
// data.list2.push(item.jzje); //
// });
// // console.log("2", data.list1, data.list2);
// };
// watch(
// () => props.list,
// (newVal, oldVal) => {
// data.list = newVal;
// // console.log("1", data.list);
// setChart1();
// getOption();
// setChart();
// }
// );
// 使 // 使
onBeforeMount(() => { onBeforeMount(() => {
setTimeout(() => { setTimeout(() => {
data.list = props.list; data.list = props.list;
// setChart1(); setChart1();
console.log(data.list, "残疾人补助信息"); getOption();
// getOption(); setChart();
// setChart();
}, 600); }, 600);
}); });
</script> </script>

View File

@ -15,13 +15,16 @@
</div> </div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.zgylbxzsr }}万元</span> <span class="left">收入</span
</div> ><span class="right"
<div >{{ data.LivelihoodWelfare.zgylbxzsr }}万元</span
class="sr" >
style="margin-top: 5px" </div>
<div class="sr" style="margin-top: 5px">
<span class="left">支出</span
><span class="right"
>{{ data.LivelihoodWelfare.zgylbxzzc }}万元</span
> >
<span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.zgylbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -29,13 +32,16 @@
<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="right">{{ data.LivelihoodWelfare.gsbxzsr }}万元</span> <span class="left">收入</span
</div> ><span class="right"
<div >{{ data.LivelihoodWelfare.gsbxzsr }}万元</span
class="sr" >
style="margin-top: 5px" </div>
<div class="sr" style="margin-top: 5px">
<span class="left">支出</span
><span class="right"
>{{ data.LivelihoodWelfare.gsbxzzc }}万元</span
> >
<span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.gsbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -45,13 +51,16 @@
</div> </div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.cxylbxzsr }}万元</span> <span class="left">收入</span
</div> ><span class="right"
<div >{{ data.LivelihoodWelfare.cxylbxzsr }}万元</span
class="sr" >
style="margin-top: 5px" </div>
<div class="sr" style="margin-top: 5px">
<span class="left">支出</span
><span class="right"
>{{ data.LivelihoodWelfare.cxylbxzzc }}万元</span
> >
<span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.cxylbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -61,13 +70,16 @@
</div> </div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.zgyilbxzsr }}万元</span> <span class="left">收入</span
</div> ><span class="right"
<div >{{ data.LivelihoodWelfare.zgyilbxzsr }}万元</span
class="sr" >
style="margin-top: 5px" </div>
<div class="sr" style="margin-top: 5px">
<span class="left">支出</span
><span class="right"
>{{ data.LivelihoodWelfare.zgyilbxzzc }}万元</span
> >
<span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.zgyilbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -77,13 +89,16 @@
</div> </div>
<div class="item_content"> <div class="item_content">
<div class="sr"> <div class="sr">
<span class="left">收入</span><span class="right">{{ data.LivelihoodWelfare.cxyilbxzsr }}万元</span> <span class="left">收入</span
</div> ><span class="right"
<div >{{ data.LivelihoodWelfare.cxyilbxzsr }}万元</span
class="sr" >
style="margin-top: 5px" </div>
<div class="sr" style="margin-top: 5px">
<span class="left">支出</span
><span class="right"
>{{ data.LivelihoodWelfare.cxyilbxzzc }}万元</span
> >
<span class="left">支出</span><span class="right">{{ data.LivelihoodWelfare.cxyilbxzzc }}万元</span>
</div> </div>
</div> </div>
</div> </div>
@ -100,10 +115,7 @@
</div> </div>
</div> </div>
</div> </div>
<div <div class="flex1" style="margin-top: 10px">
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>
@ -128,41 +140,35 @@
<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>:{{ jysyList[0].student }} <span class="span1">{{ jysyList[0].teacher }}</span
>:{{ jysyList[0].student }}
</div> </div>
</div> </div>
<div class="left_2_bottom_item_xia"> <div class="left_2_bottom_item_xia">
<div <div class="csbl" :style="cs"></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 <div class="ncbl" :style="nc"></div>
class="ncbl"
:style="nc"
></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div <div class="flex1" style="margin-top: 10px">
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>
@ -207,47 +213,24 @@
/> />
<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 <img src="../assets/images/sy/man.png" alt="" />
src="../assets/images/sy/man.png"
alt=""
/>
<div class="sex">男性人口</div> <div class="sex">男性人口</div>
<img <img class="sexMove" src="../assets/images/sy/sexImg.png" alt="" />
class="sexMove"
src="../assets/images/sy/sexImg.png"
alt=""
/>
</div> </div>
<div class="people_total_item2 center"> <div class="people_total_item2 center">
<img <img src="../assets/images/sy/people_total.png" alt="" />
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 <img src="../assets/images/sy/woman.png" alt="" />
src="../assets/images/sy/woman.png"
alt=""
/>
<div class="sex">女性人口</div> <div class="sex">女性人口</div>
<img <img class="sexMove" src="../assets/images/sy/sexImg.png" alt="" />
class="sexMove"
src="../assets/images/sy/sexImg.png"
alt=""
/>
</div> </div>
</div> </div>
<ePie2 <ePie2 style="margin-top: 20px" :list="data.ageRatio"></ePie2>
style="margin-top: 20px" <ePie style="margin-bottom: 20px" :list="data.ageGroup"></ePie>
: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
@ -277,20 +260,13 @@
:header-cell-style="tableHeaderColor" :header-cell-style="tableHeaderColor"
v-if="choose == '1'" v-if="choose == '1'"
> >
<el-table-column <el-table-column prop="company" label="企业名称" width="200" />
prop="company"
label="企业名称"
width="200"
/>
<el-table-column <el-table-column
prop="address" prop="address"
label="项目事项牵头单位" label="项目事项牵头单位"
width="200" width="200"
/> />
<el-table-column <el-table-column prop="finish" label="完成情况">
prop="finish"
label="完成情况"
>
<template #default="scope"> <template #default="scope">
<div <div
style="letter-spacing: 3px" style="letter-spacing: 3px"
@ -301,10 +277,24 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="qyfw" v-if="choose == '2'">
<div <div
class="zwfw" class="qyfw_item"
v-if="choose == '3'" v-for="(item, index) in qyfyList"
:key="index"
> >
<img class="qyfw_item_left" :src="item.img" />
<div class="qyfw_item_right">
<div class="name">{{ item.name }}</div>
<img class="line" src="@/assets/images/sy/zwfw_line.png" />
<div class="number">
<span>{{ item.value }}</span
>{{ item.dw }}
</div>
</div>
</div>
</div>
<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>
@ -327,31 +317,19 @@
</div> </div>
<div class="xia"> <div class="xia">
<div class="xia_item"> <div class="xia_item">
<img <img class="left" src="@/assets/images/sy/zwfw_sl.png" />
class="left"
src="@/assets/images/sy/zwfw_sl.png"
/>
<div class="right"> <div class="right">
<div class="name">平均受理时长</div> <div class="name">平均受理时长</div>
<img <img class="line" src="@/assets/images/sy/zwfw_line.png" />
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 <img class="left" src="@/assets/images/sy/zwfw_bl.png" />
class="left"
src="@/assets/images/sy/zwfw_bl.png"
/>
<div class="right"> <div class="right">
<div class="name">平均办理时长</div> <div class="name">平均办理时长</div>
<img <img class="line" src="@/assets/images/sy/zwfw_line.png" />
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>
@ -379,10 +357,7 @@
</div> </div>
</div> </div>
</div> </div>
<div <div class="flex1" style="margin-top: 10px">
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>
@ -402,10 +377,7 @@
</div> </div>
</div> </div>
</div> </div>
<div <div class="flex1" style="margin-top: 10px">
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>
@ -430,10 +402,7 @@
</div> </div>
</div> </div>
</div> </div>
<div <div class="flex1" style="margin-top: 10px">
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>
@ -462,15 +431,8 @@
<div class="jtsyBox"> <div class="jtsyBox">
<div class="jtsyBoxtop"> <div class="jtsyBoxtop">
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img <img :src="data.jtsyList[0].img" alt="" />
:src="data.jtsyList[0].img" <img src="../assets/images/sy/jtsy.gif" class="turn" alt="" />
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">
@ -484,15 +446,8 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img <img :src="data.jtsyList[1].img" alt="" />
:src="data.jtsyList[1].img" <img src="../assets/images/sy/jtsy.gif" class="turn" alt="" />
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">
@ -508,15 +463,8 @@
</div> </div>
<div class="jtsyBoxbot"> <div class="jtsyBoxbot">
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img <img :src="data.jtsyList[2].img" alt="" />
:src="data.jtsyList[2].img" <img src="../assets/images/sy/jtsy.gif" class="turn" alt="" />
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">
@ -530,15 +478,8 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img <img :src="data.jtsyList[3].img" alt="" />
:src="data.jtsyList[3].img" <img src="../assets/images/sy/jtsy.gif" class="turn" alt="" />
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">
@ -552,15 +493,8 @@
</div> </div>
</div> </div>
<div class="jtsyBoxtop1"> <div class="jtsyBoxtop1">
<img <img :src="data.jtsyList[4].img" alt="" />
:src="data.jtsyList[4].img" <img src="../assets/images/sy/jtsy.gif" class="turn" alt="" />
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">
@ -627,7 +561,10 @@ import { ref, reactive, onMounted, onBeforeMount, computed } from "vue";
import http from "@/utils/request.js"; import http from "@/utils/request.js";
import { CircleCloseFilled } from "@element-plus/icons-vue"; import { CircleCloseFilled } from "@element-plus/icons-vue";
import { columns } from "element-plus/es/components/table-v2/src/common.mjs"; import { columns } from "element-plus/es/components/table-v2/src/common.mjs";
import qyfw1 from "../assets/images/sy/ljzcs.png";
import qyfw2 from "../assets/images/sy/rzbms.png";
import qyfw3 from "../assets/images/sy/shqys.png";
import qyfw4 from "../assets/images/sy/dxje.png";
// //
const dialogShow = ref(false); const dialogShow = ref(false);
// //
@ -1103,13 +1040,15 @@ const jtsyList = ref([
// //
const cs = computed(() => { const cs = computed(() => {
let str = `--teacher: ${jysyList.value[0].teacher}; --total: ${jysyList.value[0].teacher + jysyList.value[0].student let str = `--teacher: ${jysyList.value[0].teacher}; --total: ${
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: ${jysyList.value[1].teacher + jysyList.value[1].student let str = `--teacher: ${jysyList.value[1].teacher}; --total: ${
jysyList.value[1].teacher + jysyList.value[1].student
}`; }`;
return str; return str;
}); });
@ -1277,6 +1216,33 @@ const getTable = (url, currentPage) => {
} }
}); });
}; };
//
const qyfyList = reactive([
{
name: "累计政策数",
value: "273",
dw: "个",
img: qyfw1,
},
{
name: "入住部门数",
value: "35",
dw: "个",
img: qyfw2,
},
{
name: "受惠企业数",
value: "1084",
dw: "个",
img: qyfw3,
},
{
name: "累计已兑现资金额",
value: "18.54",
dw: "亿元",
img: qyfw4,
},
]);
onBeforeMount(async () => { onBeforeMount(async () => {
getData(); getData();
}); });
@ -2245,6 +2211,55 @@ onBeforeMount(async () => {
} }
} }
} }
//
.qyfw {
height: 272px;
height: 272px;
box-sizing: border-box;
background: rgba(255, 255, 255, 0.1);
border-radius: 4px;
border: 0px solid #7aceff;
padding: 16px 19px;
display: flex;
flex-wrap: wrap;
.qyfw_item {
width: 50%;
display: flex;
align-items: center;
// justify-content: center;
.qyfw_item_left {
width: 104px;
height: 72px;
}
.qyfw_item_right {
margin-top: 5px;
margin-left: 5px;
display: flex;
flex-direction: column;
.name {
font-weight: 400;
font-size: 16px;
color: #ffffff;
line-height: 20px;
}
.line {
margin: 10px 0;
width: 100px;
}
.number {
font-weight: 400;
font-size: 16px;
color: #ffffff;
line-height: 20px;
span {
font-size: 18px;
margin-right: 3px;
font-weight: 600;
}
}
}
}
}
// //
.zwfw { .zwfw {
height: 272px; height: 272px;

View File

@ -131,9 +131,8 @@
困难职工 困难职工
</div> </div>
</div> </div>
<eP4 :list="data.list1"></eP4> <eP6 v-if="jz[2].choose == '1'" :list="data.list1"></eP6>
<!-- <eP6 v-if="jz[2].choose == '1'" :list="data.difficultSoldiers"></eP6> <eP4 v-else :list="data.list1"></eP4>
<eP5 v-if="jz[2].choose == '2'" :list="data.difficultSoldiers"></eP5> -->
</div> </div>
<div class="flex1"> <div class="flex1">
<div class="yd_title right_2"> <div class="yd_title right_2">
@ -212,7 +211,7 @@ const jzChange = (index, value) => {
data.list = value === "1" ? data.housing : data.temporary; data.list = value === "1" ? data.housing : data.temporary;
} else if (index === 2) { } else if (index === 2) {
const listMap = { const listMap = {
1: data.needyWorkers1, 1: data.disabilitySubsidies,
2: data.difficultSoldiers, 2: data.difficultSoldiers,
3: data.needyWorkers, 3: data.needyWorkers,
}; };
@ -285,17 +284,19 @@ const data = reactive({
], ],
month: ["1"], month: ["1"],
}, // }, //
difficultSoldiers: { //
disabilitySubsidies: {
data: [ data: [
{ // {
nf: "2019", // // nf: "2019", //
jzrs: "62", // // jzrs: "62", //
jzje: "6.24", // // jzje: "6.24", //
}, // },
], ],
year: ["2019"], month: ["1"],
}, // },
needyWorkers1: { //
difficultSoldiers: {
data: [ data: [
{ {
nf: "2019", // nf: "2019", //
@ -304,7 +305,8 @@ const data = reactive({
}, },
], ],
year: ["2019"], year: ["2019"],
}, // },
//
needyWorkers: { needyWorkers: {
data: [ data: [
{ {
@ -314,7 +316,7 @@ const data = reactive({
}, },
], ],
year: ["2019"], year: ["2019"],
}, // },
diversification: { diversification: {
hszhxms: [ hszhxms: [
{ {
@ -372,15 +374,20 @@ const getData = async () => {
data.salvation = res.data.lifeAssistance.jz; data.salvation = res.data.lifeAssistance.jz;
// //
// && // &&
//
data.disabilitySubsidies.data =
res.data.underprivileged.disabilitySubsidies.data;
data.disabilitySubsidies.month =
res.data.underprivileged.disabilitySubsidies.month;
// //
data.difficultSoldiers.data = data.difficultSoldiers.data = res.data.underprivileged.difficultSoldiers.data;
res.data.underprivileged.difficultSoldiers.data;
data.difficultSoldiers.year = data.difficultSoldiers.year =
res.data.underprivileged.difficultSoldiers.year; res.data.underprivileged.difficultSoldiers.year;
// //
data.needyWorkers.data = res.data.underprivileged.needyWorkers.data; data.needyWorkers.data = res.data.underprivileged.needyWorkers.data;
data.needyWorkers.year = res.data.underprivileged.needyWorkers.year; data.needyWorkers.year = res.data.underprivileged.needyWorkers.year;
data.list1 = data.needyWorkers1; //
data.list1 = data.disabilitySubsidies;
// //
data.diversification.hszhxms = res.data.diversification.hszhxms; data.diversification.hszhxms = res.data.diversification.hszhxms;