From 6f6a738920aa7597e08cc0133b9eccc6cd59413f Mon Sep 17 00:00:00 2001 From: HH <2454517719@qq.com> Date: Thu, 11 Jul 2024 17:23:28 +0800 Subject: [PATCH] =?UTF-8?q?fix:=E7=B3=BB=E7=BB=9F=E8=BF=AD=E4=BB=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/homePage.ts | 23 +- src/api/statistics.ts | 26 +- .../right-side/components/command.vue | 256 ++++++++++++------ .../right-side/components/early-warning.vue | 34 ++- .../right-side/dialog/emeEventDetalis.vue | 2 +- .../right-side/dialog/emeMaterialsDetails.vue | 21 +- .../right-side/dialog/emeSystemDetails.vue | 2 +- 7 files changed, 263 insertions(+), 101 deletions(-) diff --git a/src/api/homePage.ts b/src/api/homePage.ts index 1e715fb..e6e75ee 100644 --- a/src/api/homePage.ts +++ b/src/api/homePage.ts @@ -16,7 +16,7 @@ export function wkTypes(params) { return request({ url: `/screen/index/wkTypes`, method: "GET", - params:params, + params: params, }); } //工作动态分类型开展情况-前五条 @@ -42,7 +42,7 @@ export function riskPoolPage(params) { return request({ url: `/screen/index/riskPoolPage`, method: "GET", - params:params, + params: params, }); } /** @@ -54,7 +54,7 @@ export function othteamPage(params) { return request({ url: `/screen/index/getOthteamPage`, method: "GET", - params:params + params: params }); } //应急仓库分页 @@ -62,7 +62,14 @@ export function otheWareHousePage(params) { return request({ url: `/screen/index/getOtheWareHousePage`, method: "GET", - params:params + params: params + }); +} +//应急仓库详情 +export function emerWareHouseDetail(wareHouseId: any) { + return request({ + url: `/screen/index/emerWareHouseDetail/${wareHouseId}`, + method: "GET", }); } //应急通讯录体系 @@ -70,7 +77,7 @@ export function performUserPage(params) { return request({ url: `/screen/index/performUserPage`, method: "GET", - params:params + params: params }); } //分页查看应急上报事件 @@ -78,7 +85,7 @@ export function emerEventPage(params) { return request({ url: `/screen/index/emerEventPage`, method: "GET", - params:params + params: params }); } //值守人员 @@ -86,7 +93,7 @@ export function dutyList(params) { return request({ url: `/screen/index/dutyList`, method: "GET", - params:params + params: params }); } /** @@ -97,6 +104,6 @@ export function workPerformProgress(params) { return request({ url: `/screen/index/workPerformProgress`, method: "GET", - params:params + params: params }); } diff --git a/src/api/statistics.ts b/src/api/statistics.ts index f5bb734..1fa3388 100644 --- a/src/api/statistics.ts +++ b/src/api/statistics.ts @@ -23,7 +23,7 @@ export function riskPoolPage(params) { return request({ url: `/screen/index/riskPoolPage`, method: "GET", - params:params, + params: params, }); } /** @@ -35,7 +35,7 @@ export function othteamPage(params) { return request({ url: `/screen/index/getOthteamPage`, method: "GET", - params:params + params: params }); } //应急仓库分页 @@ -43,7 +43,7 @@ export function otheWareHousePage(params) { return request({ url: `/screen/index/getOtheWareHousePage`, method: "GET", - params:params + params: params }); } //应急通讯录体系 @@ -51,7 +51,7 @@ export function performUserPage(params) { return request({ url: `/screen/index/performUserPage`, method: "GET", - params:params + params: params }); } //分页查看应急上报事件 @@ -59,7 +59,7 @@ export function emerEventPage(params) { return request({ url: `/screen/index/emerEventPage`, method: "GET", - params:params + params: params }); } /** @@ -70,7 +70,7 @@ export function latestWork(params) { return request({ url: `/screen/statistic/latestWork`, method: "GET", - params:params, + params: params, }); } //工作类型分析 @@ -78,7 +78,7 @@ export function workTypeStatistic(params) { return request({ url: `/screen/statistic/workTypeStatistic`, method: "GET", - params:params, + params: params, }); } //村庄工作分析 @@ -86,7 +86,7 @@ export function villageWorkStatistic(params) { return request({ url: `/screen/statistic/villageWorkStatistic`, method: "GET", - params:params, + params: params, }); } //工作类型列表 @@ -94,7 +94,7 @@ export function wkTypes(params) { return request({ url: `/screen/statistic/wkTypes`, method: "GET", - params:params, + params: params, }); } //工作分类型统计分析 @@ -102,7 +102,7 @@ export function workStatisticByType(params) { return request({ url: `/screen/statistic/workStatisticByType`, method: "GET", - params:params, + params: params, }); } //风险池分类型统计 @@ -110,14 +110,14 @@ export function rkStatByType(params) { return request({ url: `/screen/statistic/rkStatByType`, method: "GET", - params:params, + params: params, }); } //应急数据统计 export function emerStat(params) { return request({ - url: `/screen/statistic/emerStat`, + url: `/screen/statistic/emerTeamStat`, method: "GET", - params:params, + params: params, }); } \ No newline at end of file diff --git a/src/views/data-statistics/right-side/components/command.vue b/src/views/data-statistics/right-side/components/command.vue index f7c7996..ba2924c 100644 --- a/src/views/data-statistics/right-side/components/command.vue +++ b/src/views/data-statistics/right-side/components/command.vue @@ -26,98 +26,202 @@ import { emerStat } from "@/api/statistics"; //工作类型折线图 const tenementRef = ref(); let jobTypeOption = { - 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: 15, - fontWeight: 400, + backgroundColor: '#031245', + color: [ + '#63caff', + '#49beff', + '#03387a', + '#03387a', + '#03387a', + '#6c93ee', + '#a9abff', + '#f7a23f', + '#27bae7', + '#ff6d9d', + '#cb79ff', + '#f95b5a', + '#ccaf27', + '#38b99c', + '#93d0ff', + '#bd74e0', + '#fd77da', + '#dea700', + ], + grid: { + containLabel: true, + left: 20, + right: 20, + bottom: 10, + top: 40, }, - }, - grid: { - left: "3%", - right: "4%", - bottom: "3%", - containLabel: true, - }, - xAxis: { - type: "category", - // boundaryGap: false, - data: [], - }, - yAxis: [ - { - type: "value", - name: "数量", - nameTextStyle: { - //y轴上方单位的颜色 - color: "#6C8097", - }, - axisLine: { - show: true, - lineStyle: { - color: "#6C8097", + xAxis: { + axisLabel: { + color: '#c0c3cd', + fontSize: 14, + interval: 0, }, - }, - splitLine: { - show: true, - lineStyle: { - color: "#6C8097", - type: "dashed", + axisTick: { + lineStyle: { + color: '#384267', + }, + show: true, }, - }, - axisLabel: { - color: "rgb(139, 143, 147)", - textStyle: { - fontSize: 14, + splitLine: { + show: false, }, - }, - axisTick: { + axisLine: { + lineStyle: { + color: '#384267', + width: 1, + type: 'dashed', + }, + show: true, + }, + data: [], + type: 'category', + }, + yAxis: { + axisLabel: { + color: '#c0c3cd', + fontSize: 14, + }, + axisTick: { + lineStyle: { + color: '#384267', + width: 1, + }, + show: true, + }, + splitLine: { + show: true, + lineStyle: { + color: '#384267', + type: 'dashed', + }, + }, + axisLine: { + lineStyle: { + color: '#384267', + width: 1, + type: 'dashed', + }, + show: true, + }, + name: '', + }, + series: [ + { + data: [200, 85, 112, 275, 305, 415, 741, 405], + type: 'bar', + barMaxWidth: 'auto', + barWidth: 30, + itemStyle: { + color: { + x: 0, + y: 0, + x2: 0, + y2: 1, + type: 'linear', + global: false, + colorStops: [ + { + offset: 0, + color: '#0b9eff', + }, + { + offset: 1, + color: '#63caff', + }, + ], + }, + }, + label: { + show: true, + position: 'top', + distance: 10, + color: '#fff', + }, + }, + { + data: [1, 1, 1, 1, 1, 1, 1, 1], + type: 'pictorialBar', + barMaxWidth: '20', + symbol: 'diamond', + symbolOffset: [0, '50%'], + symbolSize: [30, 15], + }, + { + data: [200, 85, 112, 275, 305, 415, 741, 405], + type: 'pictorialBar', + barMaxWidth: '20', + symbolPosition: 'end', + symbol: 'diamond', + symbolOffset: [0, '-50%'], + symbolSize: [30, 12], + zlevel: 2, + }, + { + data: [741, 741, 741, 741, 741, 741, 741, 741], + type: 'bar', + barMaxWidth: 'auto', + barWidth: 30, + barGap: '-100%', + zlevel: -1, + }, + { + data: [1, 1, 1, 1, 1, 1, 1, 1], + type: 'pictorialBar', + barMaxWidth: '20', + symbol: 'diamond', + symbolOffset: [0, '50%'], + symbolSize: [30, 15], + zlevel: -2, + }, + ], + dataZoom: [ + { + type: "slider", + show: false, + endValue: 50, + bottom: "3%", + zoomLock: true, + showDataShadow: false, + showDetail: false, + }, + { + type: "inside", + show: true, + xAxisIndex: [0], + moveOnMouseWheel: false, + preventDefaultMouseMove: false, + }, + ], + tooltip: { + trigger: 'axis', show: false, - }, }, - ], - series: [ - { - name: "数量", - type: "line", - data: [], - symbolSize: 10, - itemStyle: { - color: "#FFFFFF", // 折线点的颜色 - shadowColor: "#fff", - shadowBlur: 15, - borderColor: "#aaa", - }, - }, - ], }; //工作类型折线图数据处理 const getemerStat = () => { let params = { - startTime: "", - endTime: "", + startTime: null, + endTime: null, }; emerStat(params).then((res: any) => { - console.log(res, "res"); - jobTypeOption.xAxis.data = []; jobTypeOption.series[0].data = []; + jobTypeOption.series[2].data = []; + jobTypeOption.series[3].data = []; res.data.forEach((item) => { - jobTypeOption.xAxis.data.push(item.typeName); - jobTypeOption.series[0].data.push(item.typeNum); + jobTypeOption.xAxis.data.push(item.orgName); + jobTypeOption.series[0].data.push(item.teamNum); + jobTypeOption.series[2].data.push(item.teamNum); + }); + let max = Math.max(...jobTypeOption.series[0].data); + for (let i = 0; i < res.data.length; i++) { + jobTypeOption.series[3].data.push(max); + } const tenementChart = echarts.init(tenementRef.value); tenementChart.setOption(jobTypeOption, true); }); diff --git a/src/views/data-statistics/right-side/components/early-warning.vue b/src/views/data-statistics/right-side/components/early-warning.vue index 798f923..1cd6b11 100644 --- a/src/views/data-statistics/right-side/components/early-warning.vue +++ b/src/views/data-statistics/right-side/components/early-warning.vue @@ -90,7 +90,19 @@ let jobTypeOption = { ], series: [ { - name: "数量", + name: "类型总数量", + type: "line", + data: [], + symbolSize: 10, + itemStyle: { + color: "#FFFFFF", // 折线点的颜色 + shadowColor: "#fff", + shadowBlur: 15, + borderColor: "#aaa", + }, + }, + { + name: "预警数量", type: "line", data: [], symbolSize: 10, @@ -102,6 +114,24 @@ let jobTypeOption = { }, }, ], + dataZoom: [ + { + type: "slider", + show: false, + endValue: 50, + bottom: "3%", + zoomLock: true, + showDataShadow: false, + showDetail: false, + }, + { + type: "inside", + show: true, + xAxisIndex: [0], + moveOnMouseWheel: false, + preventDefaultMouseMove: false, + }, + ], }; //工作类型折线图数据处理 const getrkStatByType = () => { @@ -112,9 +142,11 @@ const getrkStatByType = () => { rkStatByType(params).then((res: any) => { jobTypeOption.xAxis.data = []; jobTypeOption.series[0].data = []; + jobTypeOption.series[1].data = []; res.data.forEach((item) => { jobTypeOption.xAxis.data.push(item.typeName); jobTypeOption.series[0].data.push(item.typeCount); + jobTypeOption.series[1].data.push(item.warningCount); }); const tenementChart = echarts.init(tenementRef.value); tenementChart.setOption(jobTypeOption, true); diff --git a/src/views/home-page/right-side/dialog/emeEventDetalis.vue b/src/views/home-page/right-side/dialog/emeEventDetalis.vue index 14939c0..c5e457c 100644 --- a/src/views/home-page/right-side/dialog/emeEventDetalis.vue +++ b/src/views/home-page/right-side/dialog/emeEventDetalis.vue @@ -3,7 +3,7 @@ + + + + + + @@ -91,6 +102,7 @@ import { reactive, ref, onMounted, watch } from "vue"; import { ElMessage, FormInstance, FormRules } from "element-plus"; import { areaTree, riskTypeList } from "@/api/account"; +import { emerWareHouseDetail } from "@/api/homePage"; const formRef = ref(); const props = defineProps({ visible: { @@ -105,6 +117,7 @@ const props = defineProps({ id: String, }); const form = ref({ content: "" }); +const tableData = ref([]) const emits = defineEmits(["close", "onSubmit"]); const handleSubmit = () => { onclone(); @@ -127,6 +140,11 @@ const getRiskTypeList = () => { types.value = res.data; }); }; +const getemerWareHouseDetail = (id) => { + emerWareHouseDetail(id).then((res: any) => { + tableData.value = res.data.equipList + }) +} onMounted(() => { getareaTree(); getRiskTypeList(); @@ -136,6 +154,7 @@ watch( () => props.visible, () => { form.value = props.form; + if(form.value.houseId)getemerWareHouseDetail(form.value.houseId) } ); diff --git a/src/views/home-page/right-side/dialog/emeSystemDetails.vue b/src/views/home-page/right-side/dialog/emeSystemDetails.vue index 79a5de8..49da127 100644 --- a/src/views/home-page/right-side/dialog/emeSystemDetails.vue +++ b/src/views/home-page/right-side/dialog/emeSystemDetails.vue @@ -3,7 +3,7 @@