Merge branch 'main' of https://git.cityme.com.cn/xiangshan/ggfwjsc
This commit is contained in:
commit
2e9099e219
|
@ -3,12 +3,19 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { onMounted, reactive, ref } from "vue";
|
import { onMounted, reactive, ref ,onBeforeMount } from "vue";
|
||||||
// 局部引入echarts核心模块
|
// 局部引入echarts核心模块
|
||||||
import * as echarts from "echarts";
|
import * as echarts from "echarts";
|
||||||
|
const props = defineProps({
|
||||||
const chart = ref(); // 创建DOM引用
|
list: {
|
||||||
const dataList = [
|
type: Array,
|
||||||
|
default: () => {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const data = reactive({
|
||||||
|
dataList: [
|
||||||
{
|
{
|
||||||
name: "2.0收件数",
|
name: "2.0收件数",
|
||||||
value: 42277,
|
value: 42277,
|
||||||
|
@ -17,11 +24,16 @@ const dataList = [
|
||||||
name: "总收件数",
|
name: "总收件数",
|
||||||
value: 42632,
|
value: 42632,
|
||||||
},
|
},
|
||||||
];
|
],
|
||||||
|
percent: 0,
|
||||||
|
option: {},
|
||||||
|
});
|
||||||
|
const chart = ref(); // 创建DOM引用
|
||||||
|
|
||||||
//内圈数据
|
//内圈数据
|
||||||
var data = [
|
var data2 = [
|
||||||
{
|
{
|
||||||
value: dataList[0].value,
|
value: data.dataList[0].value,
|
||||||
name: "2.0收件数",
|
name: "2.0收件数",
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
normal: {
|
normal: {
|
||||||
|
@ -45,7 +57,7 @@ var data = [
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value: dataList[1].value - dataList[0].value,
|
value: data.dataList[1].value - data.dataList[0].value,
|
||||||
name: "",
|
name: "",
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
normal: {
|
normal: {
|
||||||
|
@ -63,7 +75,7 @@ var data = [
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value: dataList[1].value,
|
value: data.dataList[1].value,
|
||||||
name: "总收件数",
|
name: "总收件数",
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
normal: {
|
normal: {
|
||||||
|
@ -75,7 +87,7 @@ var data = [
|
||||||
//外圈数据
|
//外圈数据
|
||||||
const data1 = [
|
const data1 = [
|
||||||
{
|
{
|
||||||
value: dataList[1].value,
|
value: data.dataList[1].value,
|
||||||
name: "",
|
name: "",
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
normal: {
|
normal: {
|
||||||
|
@ -95,7 +107,7 @@ const data1 = [
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value: dataList[1].value,
|
value: data.dataList[1].value,
|
||||||
name: "",
|
name: "",
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
normal: {
|
normal: {
|
||||||
|
@ -105,7 +117,8 @@ const data1 = [
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
const option = {
|
const getOption = () => {
|
||||||
|
data.option = {
|
||||||
legend: {
|
legend: {
|
||||||
selectedMode: false,
|
selectedMode: false,
|
||||||
itemWidth: 10,
|
itemWidth: 10,
|
||||||
|
@ -120,18 +133,23 @@ const option = {
|
||||||
},
|
},
|
||||||
formatter: function (params) {
|
formatter: function (params) {
|
||||||
var num = "";
|
var num = "";
|
||||||
for (let i = 0; i < dataList.length; i++) {
|
for (let i = 0; i < data.dataList.length; i++) {
|
||||||
if (dataList[i].name == params) {
|
if (data.dataList[i].name == params) {
|
||||||
num = dataList[i].value;
|
num = data.dataList[i].value;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return params + " " + num;
|
if(params == "总收件数"){
|
||||||
|
return params + " " +num;
|
||||||
|
}else{
|
||||||
|
return params + " " +num;
|
||||||
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
title: [
|
title: [
|
||||||
{
|
{
|
||||||
text: `${((dataList[0].value / dataList[1].value)*100).toFixed(2)}%`,
|
text: `${data.percent}%`,
|
||||||
right: "18%",
|
right: "18%",
|
||||||
bottom: "40%",
|
bottom: "40%",
|
||||||
textStyle: {
|
textStyle: {
|
||||||
|
@ -154,7 +172,7 @@ const option = {
|
||||||
position: "center",
|
position: "center",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
data: data,
|
data: data2,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: "pie",
|
type: "pie",
|
||||||
|
@ -162,22 +180,6 @@ const option = {
|
||||||
radius: ["80%", "95%"],
|
radius: ["80%", "95%"],
|
||||||
hoverAnimation: false,
|
hoverAnimation: false,
|
||||||
startAngle: 180,
|
startAngle: 180,
|
||||||
// itemStyle: {
|
|
||||||
// normal: {
|
|
||||||
// borderWidth: 1,
|
|
||||||
// borderColor: "rgba(193, 229, 255, .1)",
|
|
||||||
// color: new echarts.graphic.LinearGradient(1, 1, 1, 0, [
|
|
||||||
// {
|
|
||||||
// offset: 1,
|
|
||||||
// color: "rgba(127, 242, 255, .2)",
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// offset: 0,
|
|
||||||
// color: "rgba(109, 195, 255, 0)",
|
|
||||||
// },
|
|
||||||
// ]),
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
label: {
|
label: {
|
||||||
normal: {
|
normal: {
|
||||||
show: false,
|
show: false,
|
||||||
|
@ -187,23 +189,25 @@ const option = {
|
||||||
data: data1,
|
data: data1,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
};
|
||||||
};
|
};
|
||||||
// 使用生命钩子
|
|
||||||
onMounted(() => {
|
const setChart = () => {
|
||||||
// 基于准备好的dom,初始化echarts实例
|
|
||||||
// var myChart = echarts.init(document.getElementById('main'));
|
|
||||||
// Vue3中: 需要引入
|
|
||||||
var myChart = echarts.init(chart.value);
|
var myChart = echarts.init(chart.value);
|
||||||
|
myChart.setOption(data.option);
|
||||||
|
};
|
||||||
|
|
||||||
// init(); // vue3.2没有this
|
// 使用生命钩子
|
||||||
// 使用刚指定的配置项和数据显示图表。
|
onBeforeMount(() => {
|
||||||
myChart.setOption(option);
|
setTimeout(() => {
|
||||||
|
data.dataList[0].value=props.list.finish;
|
||||||
// 单图表响应式: 跟随浏览器大小改变
|
data.dataList[1].value=props.list.total;
|
||||||
// window.addEventListener("resize", () => {
|
data.percent=props.list.percent;
|
||||||
// myChart.resize();
|
getOption();
|
||||||
// });
|
setChart();
|
||||||
|
}, 600);
|
||||||
});
|
});
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped></style>
|
<style scoped></style>
|
|
@ -372,7 +372,7 @@
|
||||||
<div class="shang_item">
|
<div class="shang_item">
|
||||||
<div class="title">一网通办事</div>
|
<div class="title">一网通办事</div>
|
||||||
<div class="i">
|
<div class="i">
|
||||||
<zwfw1 />
|
<zwfw1 :list="data.zwfw.list1" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="shang_item">
|
<div class="shang_item">
|
||||||
|
@ -658,6 +658,7 @@ import qyfw2 from "../assets/images/sy/rzbms.png";
|
||||||
import qyfw3 from "../assets/images/sy/shqys.png";
|
import qyfw3 from "../assets/images/sy/shqys.png";
|
||||||
import qyfw4 from "../assets/images/sy/dxje.png";
|
import qyfw4 from "../assets/images/sy/dxje.png";
|
||||||
import { useRouter, useRoute } from "vue-router";
|
import { useRouter, useRoute } from "vue-router";
|
||||||
|
import tools from "@/utils/tools";
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const routers = useRoute();
|
const routers = useRoute();
|
||||||
// 路由跳转
|
// 路由跳转
|
||||||
|
@ -851,6 +852,7 @@ const close = () => {
|
||||||
pagination.currentPage = 1;
|
pagination.currentPage = 1;
|
||||||
pagination.total = 100;
|
pagination.total = 100;
|
||||||
};
|
};
|
||||||
|
|
||||||
//医疗卫生
|
//医疗卫生
|
||||||
const showDialog2 = (title, url) => {
|
const showDialog2 = (title, url) => {
|
||||||
if (title == "医院卫生院") {
|
if (title == "医院卫生院") {
|
||||||
|
@ -980,6 +982,16 @@ const data = reactive({
|
||||||
// monthlyVisits1: "3565",
|
// monthlyVisits1: "3565",
|
||||||
// },
|
// },
|
||||||
],
|
],
|
||||||
|
//政务服务
|
||||||
|
zwfw: {
|
||||||
|
list1: {
|
||||||
|
finish: "",
|
||||||
|
total: "",
|
||||||
|
percent: "",
|
||||||
|
},
|
||||||
|
list2: {},
|
||||||
|
list3: {},
|
||||||
|
},
|
||||||
jysyList: [
|
jysyList: [
|
||||||
{
|
{
|
||||||
title: "县镇",
|
title: "县镇",
|
||||||
|
@ -1341,8 +1353,8 @@ const getData = async () => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
// 公共服务&企业服务&政府服务
|
// 公共服务&企业服务&政府服务
|
||||||
const getfw = async() => {
|
const getfw = async () => {
|
||||||
http.get("/api/ggfwyth/getLytAppData").then((res) => {
|
await http.get("/api/ggfwyth/getLytAppData").then((res) => {
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
data.lytAppDayActive = res.data.lytAppDayActive;
|
data.lytAppDayActive = res.data.lytAppDayActive;
|
||||||
data.tableData = res.data.lytApp.reduce((acc, _, i, arr) => {
|
data.tableData = res.data.lytApp.reduce((acc, _, i, arr) => {
|
||||||
|
@ -1356,13 +1368,18 @@ const getfw = async() => {
|
||||||
}
|
}
|
||||||
return acc;
|
return acc;
|
||||||
}, []);
|
}, []);
|
||||||
|
console.log(data.tableData);
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// http.get("/api/ggfwyth/getDataSharing").then((res) => {
|
await http.get("/api/ggfwyth/getDataSharing").then((res) => {
|
||||||
// if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
|
data.zwfw.list1.finish = Number(res.data.apply);
|
||||||
// }
|
data.zwfw.list1.total = Number(res.data.applyNum);
|
||||||
// });
|
data.zwfw.list1.percent = (Number(res.data.netRate) * 100).toFixed(2);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
console.log(data.zwfw.list1);
|
||||||
};
|
};
|
||||||
//获取表格数据
|
//获取表格数据
|
||||||
const getTable = (url, currentPage) => {
|
const getTable = (url, currentPage) => {
|
||||||
|
@ -1814,6 +1831,7 @@ const autoScroll = () => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
onBeforeMount(async () => {
|
onBeforeMount(async () => {
|
||||||
|
// tools.data.set("token", "6b0e380b4a8f46baae4923f83faf670d");
|
||||||
getData();
|
getData();
|
||||||
getfw();
|
getfw();
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
|
|
@ -15,8 +15,8 @@ export default defineConfig({
|
||||||
// 第一个代理
|
// 第一个代理
|
||||||
"/api": {
|
"/api": {
|
||||||
// 匹配到啥来进行方向代理
|
// 匹配到啥来进行方向代理
|
||||||
target: "http://10.0.0.65:8095/", //刘进
|
// target: "http://10.0.0.65:8095/", //刘进
|
||||||
// target: "http://220.191.238.50:996/", //线上
|
target: "http://220.191.238.50:996/", //线上
|
||||||
changeOrigin: true, //是否支持跨域
|
changeOrigin: true, //是否支持跨域
|
||||||
//rewrite: (path) => path.replace(/^\/api/, '') // 如果不需要api 直接把路径上的api 替换成空,这个
|
//rewrite: (path) => path.replace(/^\/api/, '') // 如果不需要api 直接把路径上的api 替换成空,这个
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue