diff --git a/src/assets/images/data-statistics/left/-s-暴雨-红.png b/src/assets/images/data-statistics/left/-s-暴雨-红.png deleted file mode 100644 index 95817d7..0000000 Binary files a/src/assets/images/data-statistics/left/-s-暴雨-红.png and /dev/null differ diff --git a/src/assets/images/data-statistics/left/-s-暴雨-蓝.png b/src/assets/images/data-statistics/left/-s-暴雨-蓝.png deleted file mode 100644 index af70ccf..0000000 Binary files a/src/assets/images/data-statistics/left/-s-暴雨-蓝.png and /dev/null differ diff --git a/src/assets/images/data-statistics/left/-s-暴雨-黄.png b/src/assets/images/data-statistics/left/-s-暴雨-黄.png deleted file mode 100644 index 8db5bf4..0000000 Binary files a/src/assets/images/data-statistics/left/-s-暴雨-黄.png and /dev/null differ diff --git a/src/assets/images/data-statistics/left/-s-高温-橙.png b/src/assets/images/data-statistics/left/-s-高温-橙.png deleted file mode 100644 index dc07108..0000000 Binary files a/src/assets/images/data-statistics/left/-s-高温-橙.png and /dev/null differ diff --git a/src/assets/images/data-statistics/left/-s-高温-红.png b/src/assets/images/data-statistics/left/-s-高温-红.png deleted file mode 100644 index 4a58876..0000000 Binary files a/src/assets/images/data-statistics/left/-s-高温-红.png and /dev/null differ diff --git a/src/assets/images/data-statistics/left/-s-高温-蓝.png b/src/assets/images/data-statistics/left/-s-高温-蓝.png deleted file mode 100644 index 3a39023..0000000 Binary files a/src/assets/images/data-statistics/left/-s-高温-蓝.png and /dev/null differ diff --git a/src/assets/images/data-statistics/left/-s-高温-黄.png b/src/assets/images/data-statistics/left/-s-高温-黄.png deleted file mode 100644 index 6dfbfa0..0000000 Binary files a/src/assets/images/data-statistics/left/-s-高温-黄.png and /dev/null differ diff --git a/src/assets/images/data-statistics/left/rainstorm-orange.png b/src/assets/images/data-statistics/left/rainstorm-orange.png deleted file mode 100644 index caad5cd..0000000 Binary files a/src/assets/images/data-statistics/left/rainstorm-orange.png and /dev/null differ diff --git a/src/assets/images/data-statistics/left/screenIcon.png b/src/assets/images/data-statistics/left/screenIcon.png new file mode 100644 index 0000000..0c433b3 Binary files /dev/null and b/src/assets/images/data-statistics/left/screenIcon.png differ diff --git a/src/assets/images/emergency-map/left/cm_left_bg.png b/src/assets/images/emergency-map/left/cm_left_bg.png deleted file mode 100644 index 20b62af..0000000 Binary files a/src/assets/images/emergency-map/left/cm_left_bg.png and /dev/null differ diff --git a/src/assets/images/emergency-map/left/cm_left_bg_1.png b/src/assets/images/emergency-map/left/cm_left_bg_1.png deleted file mode 100644 index b429b8b..0000000 Binary files a/src/assets/images/emergency-map/left/cm_left_bg_1.png and /dev/null differ diff --git a/src/assets/images/emergency-map/left/cm_left_icon.png b/src/assets/images/emergency-map/left/cm_left_icon.png deleted file mode 100644 index 6927685..0000000 Binary files a/src/assets/images/emergency-map/left/cm_left_icon.png and /dev/null differ diff --git a/src/assets/images/emergency-map/left/cm_right_bg.png b/src/assets/images/emergency-map/left/cm_right_bg.png deleted file mode 100644 index 0b50ced..0000000 Binary files a/src/assets/images/emergency-map/left/cm_right_bg.png and /dev/null differ diff --git a/src/assets/images/emergency-map/left/cm_right_bg_1.png b/src/assets/images/emergency-map/left/cm_right_bg_1.png deleted file mode 100644 index 4beaaeb..0000000 Binary files a/src/assets/images/emergency-map/left/cm_right_bg_1.png and /dev/null differ diff --git a/src/assets/images/emergency-map/left/cm_right_icon.png b/src/assets/images/emergency-map/left/cm_right_icon.png deleted file mode 100644 index 4c74d41..0000000 Binary files a/src/assets/images/emergency-map/left/cm_right_icon.png and /dev/null differ diff --git a/src/assets/images/emergency-map/right/bg-circle-inside.png b/src/assets/images/emergency-map/right/bg-circle-inside.png deleted file mode 100644 index ca795e5..0000000 Binary files a/src/assets/images/emergency-map/right/bg-circle-inside.png and /dev/null differ diff --git a/src/assets/images/emergency-map/right/bg-video.png b/src/assets/images/emergency-map/right/bg-video.png deleted file mode 100644 index 28e7098..0000000 Binary files a/src/assets/images/emergency-map/right/bg-video.png and /dev/null differ diff --git a/src/assets/images/emergency-map/right/icon-around-video-.png b/src/assets/images/emergency-map/right/icon-around-video-.png deleted file mode 100644 index 35b16fa..0000000 Binary files a/src/assets/images/emergency-map/right/icon-around-video-.png and /dev/null differ diff --git a/src/assets/images/emergency-map/right/icon-around-video-checked.png b/src/assets/images/emergency-map/right/icon-around-video-checked.png deleted file mode 100644 index 7d6c3c1..0000000 Binary files a/src/assets/images/emergency-map/right/icon-around-video-checked.png and /dev/null differ diff --git a/src/assets/images/emergency-map/right/icon-line-legend.png b/src/assets/images/emergency-map/right/icon-line-legend.png deleted file mode 100644 index b620757..0000000 Binary files a/src/assets/images/emergency-map/right/icon-line-legend.png and /dev/null differ diff --git a/src/views/data-statistics/left-side/components/workSituation.vue b/src/views/data-statistics/left-side/components/workSituation.vue index d4b48af..e9dd18d 100644 --- a/src/views/data-statistics/left-side/components/workSituation.vue +++ b/src/views/data-statistics/left-side/components/workSituation.vue @@ -36,12 +36,33 @@ -
+
-
+
+
+
+ 时间筛选 +
-
111
+
@@ -88,18 +109,44 @@ const clickMenuOption = (id: any) => { }); label.value[id].check = true; labelId.value = id; + switch (labelId.value) { + case 1: + getjobType(); + break; + case 2: + getvillageWork(); + break; + case 3: + getsupervisionWork(); + break; + case 4: + getmediate(); + break; + default: + break; + } }; //工作类型折线图 -const jobTypeTenementRef = ref(); -let option = { - title: { - text: "Stacked Line", - }, +const tenementRef = ref(); +let jobTypeOption = { tooltip: { trigger: "axis", }, legend: { - data: ["Email", "Union Ads", "Video Ads", "Direct", "Search Engine"], + data: ["待完成", "已完成"], + top: "top", + left: "center", + orient: "horizontal", + itemWidth: 15, + itemHeight: 15, + itemGap: 15, + borderRadius: 0, + textStyle: { + color: "#D0DEEE", + fontFamily: "Source Han Sans CN, Source Han Sans CN", + fontSize: 15, + fontWeight: 400, + }, }, grid: { left: "3%", @@ -107,60 +154,402 @@ let option = { bottom: "3%", containLabel: true, }, - toolbox: { - feature: { - saveAsImage: {}, - }, - }, xAxis: { type: "category", - boundaryGap: false, - data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], - }, - yAxis: { - type: "value", + // boundaryGap: false, + data: [ + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + "某某工作类型", + ], }, + yAxis: [ + { + type: "value", + name: "数量", + nameTextStyle: { + //y轴上方单位的颜色 + color: "#6C8097", + }, + axisLine: { + show: true, + lineStyle: { + color: "#6C8097", + }, + }, + splitLine: { + show: true, + lineStyle: { + color: "#6C8097", + type: "dashed", + }, + }, + axisLabel: { + color: "rgb(139, 143, 147)", + textStyle: { + fontSize: 14, + }, + }, + axisTick: { + show: false, + }, + }, + ], series: [ { - name: "Email", + name: "待完成", type: "line", - stack: "Total", - data: [120, 132, 101, 134, 90, 230, 210], + data: [1, 4, 7, 4, 0, 4, 3, 1, 4, 7, 4, 0, 4, 3], + symbolSize: 10, + itemStyle: { + color: "#FFFFFF", // 折线点的颜色 + shadowColor: "#fff", + shadowBlur: 15, + borderColor: "#aaa", + }, }, { - name: "Union Ads", + name: "已完成", type: "line", - stack: "Total", - data: [220, 182, 191, 234, 290, 330, 310], - }, - { - name: "Video Ads", - type: "line", - stack: "Total", - data: [150, 232, 201, 154, 190, 330, 410], - }, - { - name: "Direct", - type: "line", - stack: "Total", - data: [320, 332, 301, 334, 390, 330, 320], - }, - { - name: "Search Engine", - type: "line", - stack: "Total", - data: [820, 932, 901, 934, 1290, 1330, 1320], + data: [0, 3, 4, 1, 7, 0, 1, 0, 3, 4, 1, 7, 2, 1], + symbolSize: 10, + itemStyle: { + color: "#66E1DF", // 折线点的颜色 + shadowColor: "#66E1DF", + shadowBlur: 15, + borderColor: "#66E1DF", + }, + // itemStyle: { + // color: "#66E1DF", + // borderColor: "red", + // borderWidth: 5, + // shadowColor: "red", + // shadowBlur: 10, + // shadowOffsetY: 0, + // shadowOffsetX: 0, + // }, }, ], }; //工作类型折线图数据处理 const getjobType = () => { - const airTenementChart = echarts.init(jobTypeTenementRef.value); - airTenementChart.setOption(option); + const tenementChart = echarts.init(tenementRef.value); + tenementChart.setOption(jobTypeOption, true); }; -onMounted(() => { - getjobType(); -}); +// 村庄工作分析折线图 +let villageWorkOption = { + tooltip: { + trigger: "axis", + }, + legend: { + data: [], + top: "top", + left: "center", + orient: "horizontal", + itemWidth: 15, + itemHeight: 15, + itemGap: 15, + borderRadius: 0, + textStyle: { + color: "#D0DEEE", + fontFamily: "Source Han Sans CN, Source Han Sans CN", + fontSize: 12, + fontWeight: 400, + }, + }, + grid: { + left: "3%", + right: "4%", + bottom: "0%", + top: "20%", + containLabel: true, + }, + xAxis: { + type: "category", + // boundaryGap: false, + data: ["类目一", "类目二", "类目三", "类目四", "类目五", "类目六"], + }, + yAxis: [ + { + type: "value", + name: " 已办工作(个)", + nameTextStyle: { + //y轴上方单位的颜色 + color: "#A4A6ABFF", + }, + axisLine: { + show: false, + }, + splitLine: { + show: true, + lineStyle: { + color: "#6C8097", + type: "dashed", + }, + }, + axisLabel: { + color: "rgb(139, 143, 147)", + textStyle: { + fontSize: 14, + }, + }, + axisTick: { + show: false, + }, + }, + ], + series: [ + { + name: "待完成", + type: "bar", + data: [1, 4, 7, 4, 0, 4], + symbolSize: 10, + barWidth: 35, + itemStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { offset: 0, color: "#003AFF00" }, + { offset: 1, color: "#159AFF" }, + ]), + }, + label: { + show: true, + position: "top", + color: "#1799FC", + }, + }, + ], +}; +//村庄工作分析折线图数据处理 +const getvillageWork = () => { + const tenementChart = echarts.init(tenementRef.value); + tenementChart.setOption(villageWorkOption, true); +}; +//督办工作统计分析 +let supervisionWorkOption = { + tooltip: { + trigger: "axis", + }, + legend: { + data: [], + top: "top", + left: "center", + orient: "horizontal", + itemWidth: 15, + itemHeight: 15, + itemGap: 15, + borderRadius: 0, + textStyle: { + color: "#D0DEEE", + fontFamily: "Source Han Sans CN, Source Han Sans CN", + fontSize: 12, + fontWeight: 400, + }, + }, + grid: { + left: "3%", + right: "4%", + bottom: "0%", + top: "20%", + containLabel: true, + }, + xAxis: { + type: "category", + // boundaryGap: false, + data: ["类目一", "类目二", "类目三", "类目四", "类目五", "类目六"], + }, + yAxis: [ + { + type: "value", + name: " 已办工作(个)", + nameTextStyle: { + //y轴上方单位的颜色 + color: "#A4A6ABFF", + }, + axisLine: { + show: false, + }, + splitLine: { + show: true, + lineStyle: { + color: "#6C8097", + type: "dashed", + }, + }, + axisLabel: { + color: "rgb(139, 143, 147)", + textStyle: { + fontSize: 14, + }, + }, + axisTick: { + show: false, + }, + }, + ], + series: [ + { + name: "待完成", + type: "bar", + data: [10, 25, 30, 20, 10, 30], + symbolSize: 10, + barWidth: 25, + itemStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { offset: 0, color: "#003AFF00" }, + { offset: 1, color: "#159AFF" }, + ]), + }, + label: { + show: true, + position: "top", + color: "#1799FC", + }, + }, + { + name: "待完成", + type: "bar", + data: [5, 5, 5, 5, 5, 10], + symbolSize: 10, + barWidth: 25, + itemStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { offset: 0, color: "#CFCFCF00" }, + { offset: 1, color: "#8A8A8AFF" }, + ]), + }, + label: { + show: true, + position: "top", + color: "#1799FC", + }, + }, + ], +}; +//督办工作统计分析折线图数据处理 +const getsupervisionWork = () => { + const tenementChart = echarts.init(tenementRef.value); + tenementChart.setOption(supervisionWorkOption, true); +}; +//调解分析 +let mediateOption = { + tooltip: { + trigger: "axis", + }, + legend: { + data: [], + top: "top", + left: "center", + orient: "horizontal", + itemWidth: 15, + itemHeight: 15, + itemGap: 15, + borderRadius: 0, + textStyle: { + color: "#D0DEEE", + fontFamily: "Source Han Sans CN, Source Han Sans CN", + fontSize: 12, + fontWeight: 400, + }, + }, + grid: { + left: "3%", + right: "4%", + bottom: "0%", + top: "20%", + containLabel: true, + }, + xAxis: { + type: "category", + // boundaryGap: false, + data: ["类目一", "类目二", "类目三", "类目四", "类目五", "类目六"], + }, + yAxis: [ + { + type: "value", + name: " 已办工作(个)", + nameTextStyle: { + //y轴上方单位的颜色 + color: "#A4A6ABFF", + }, + axisLine: { + show: false, + }, + splitLine: { + show: true, + lineStyle: { + color: "#6C8097", + type: "dashed", + }, + }, + axisLabel: { + color: "rgb(139, 143, 147)", + textStyle: { + fontSize: 14, + }, + }, + axisTick: { + show: false, + }, + }, + ], + series: [ + { + name: "待完成", + type: "bar", + data: [10, 25, 30, 20, 10, 30], + symbolSize: 10, + barWidth: 25, + itemStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { offset: 0, color: "#003AFF00" }, + { offset: 1, color: "#159AFF" }, + ]), + }, + label: { + show: true, + position: "top", + color: "#1799FC", + }, + }, + { + name: "待完成", + type: "bar", + data: [5, 5, 5, 5, 5, 30], + symbolSize: 10, + barWidth: 25, + itemStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { offset: 0, color: "#DBDBDBFF" }, + { offset: 0.01, color: "#DBDBDBFF" }, + { offset: 0.01, color: "#CFCFCF00" }, + { offset: 1, color: "#8A8A8AFF" }, + ]), + }, + label: { + show: true, + position: "top", + color: "#1799FC", + }, + }, + ], +}; +//调解分析折线图数据处理 +const getmediate = () => { + const tenementChart = echarts.init(tenementRef.value); + tenementChart.setOption(mediateOption, true); +}; +onMounted(() => {});