From 474e49046d2d90075bc3035989b2b792477e5d3e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=8D=E7=88=B1=E5=AD=A6=E4=B9=A0=E7=9A=84=E7=9F=B3?= =?UTF-8?q?=E5=90=8C=E5=AD=A6?= <2936013465@qq.com> Date: Wed, 8 Jan 2025 23:20:55 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/datav/chart-bar.vue | 2 +- src/views/data/Mail12337.vue | 1098 +++++++++-------- src/views/datav/CaseVerif.vue | 18 +- src/views/datav/Gobal.vue | 16 +- src/views/datav/Lmgz.vue | 2 +- src/views/datav/MailVisits.vue | 22 +- src/views/datav/SceneInsp.vue | 23 +- src/views/datav/VideoInsp.vue | 19 +- .../datav/subonedatav/SubOneCaseVerif.vue | 16 +- src/views/datav/subonedatav/SubOneGlobal.vue | 16 +- .../datav/subonedatav/SubOneMailVisits.vue | 20 +- .../datav/subonedatav/SubOneSceneInsp.vue | 20 +- .../datav/subonedatav/SubOneVideoInsp.vue | 18 +- 13 files changed, 677 insertions(+), 613 deletions(-) diff --git a/src/components/datav/chart-bar.vue b/src/components/datav/chart-bar.vue index 98fce4c..4af2fa0 100644 --- a/src/components/datav/chart-bar.vue +++ b/src/components/datav/chart-bar.vue @@ -105,6 +105,7 @@ function getColor(val) { if (props.color instanceof String) { return props.color; } + console.log(val) if (props.color instanceof Array) { const colors = [...props.color]; // percentage降序 @@ -116,7 +117,6 @@ function getColor(val) { } } return "linear-gradient(270deg, #63e700 0%, #19674c 100%)"; - } \ No newline at end of file diff --git a/src/views/datav/CaseVerif.vue b/src/views/datav/CaseVerif.vue index 9698288..b0b216f 100644 --- a/src/views/datav/CaseVerif.vue +++ b/src/views/datav/CaseVerif.vue @@ -222,11 +222,7 @@ const colors = [ { color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", percentage: 60, - }, - { - color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", - percentage: 40, - }, + } ]; // region 所有图表 @@ -575,15 +571,15 @@ const getCaseVerificationMapData = async (timeValue) => { value: item.total, }; }); + const maxItem = mappedData.reduce((max, item) => (Number(item.value) > Number(max.value) ? item : max), mappedData[0]); + const range60Percent = maxItem.value * 0.6 // 不用取整，小数也可以 + const range80Percent = maxItem.value * 0.8 // 不用取整，小数也可以 globalTempMapVoList.value = mappedData - const total = mappedData.reduce((sum, item) => sum + Number(item.value), 0); - const avg = total / mappedData.length; // 计算平均值 - const range30Percent = avg * 0.3 // 不用取整，小数也可以 option.value.series[0].data = mappedData; option.value.visualMap.pieces = [ - {gte: 0, lte: avg - range30Percent, label: "低于平均问题30%", color: "#4987F6"}, - {gte: avg - range30Percent, lte: avg + range30Percent + 0.1, label: "平均问题上下浮动30%内", color: "#F6A149"}, - {gte: avg + range30Percent, label: "高于平均问题30%", color: "#D34343"}, + {gte: 0, lte: range60Percent, label: "低于最大问题的60%", color: "#4987F6"}, + {gte: range60Percent, lte: range80Percent, label: "介于最大问题的60%~80%", color: "#F6A149"}, + {gte: range80Percent, label: "高于最大问题80%", color: "#D34343"}, ]; } const getCaseVerificationTrendData = async (year) => { diff --git a/src/views/datav/Gobal.vue b/src/views/datav/Gobal.vue index cd9b311..ee23f1c 100644 --- a/src/views/datav/Gobal.vue +++ b/src/views/datav/Gobal.vue @@ -197,11 +197,7 @@ const colors = [ { color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", percentage: 60, - }, - { - color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", - percentage: 40, - }, + } ]; const activeOrgTab = ref("1"); @@ -416,6 +412,8 @@ const proTrend = ref({ const getOrganizationRankData = async (timeValue = time.value) => { const res = await getOrganizationRank(timeValue); fxsjlist.value = res.fxsjlist; + // 5, 3, 2, 1 + // console.log(fxsjlist.value); jsdwlist.value = res.jsdwlist; } const getBusinessRateData = async (timeValue = time.value) => { @@ -474,16 +472,14 @@ const getGlobalMapData = async (timeValue = time.value) => { }); // 总数 const maxItem = mappedData.reduce((max, item) => (Number(item.value) > Number(max.value) ? item : max), mappedData[0]); - const range40Percent = maxItem.value * 0.4 // 不用取整，小数也可以 const range60Percent = maxItem.value * 0.6 // 不用取整，小数也可以 const range80Percent = maxItem.value * 0.8 // 不用取整，小数也可以 globalTempMapVoList.value = mappedData; option.value.series[0].data = globalTempMapVoList; - console.log(range40Percent, range60Percent, range80Percent); option.value.visualMap.pieces = [ - {gte: 0, lte: range40Percent, label: "低于最大问题的40%", color: "#4987F6"}, - {gte: range40Percent, lte: range60Percent, label: "平均问题上下浮动30%内", color: "#F6A149"}, - {gte: range80Percent, label: "高于平均问题30%", color: "#D34343"}, + {gte: 0, lte: range60Percent, label: "低于最大问题的60%", color: "#4987F6"}, + {gte: range60Percent, lte: range80Percent, label: "介于最大问题的60%~80%", color: "#F6A149"}, + {gte: range80Percent, label: "高于最大问题80%", color: "#D34343"}, ]; } const getGlobalTrendData = async (year = selectedYear.value) => { diff --git a/src/views/datav/Lmgz.vue b/src/views/datav/Lmgz.vue index 49b865b..d4cc7e5 100644 --- a/src/views/datav/Lmgz.vue +++ b/src/views/datav/Lmgz.vue @@ -347,7 +347,7 @@ let orgRateList = ref([]) let orgCarRateList = ref([]) const time = ref([ - moment().startOf("year").format("YYYY-MM-DD"), + moment().subtract(1, "year").format("YYYY-MM-DD"), moment().format("YYYY-MM-DD"), ]); diff --git a/src/views/datav/MailVisits.vue b/src/views/datav/MailVisits.vue index f827077..32aad0a 100644 --- a/src/views/datav/MailVisits.vue +++ b/src/views/datav/MailVisits.vue @@ -71,6 +71,7 @@ :data="fxsjLeaderViewMailList" :max="11" size="large" + :color="leaderViewColors" /> @@ -104,6 +105,7 @@ :data="bwzdLeaderViewMailList" :max="11" size="large" + :color="leaderViewColors" /> @@ -256,7 +258,7 @@ :data="fxsjLeaderReviewMailList" size="large" :max="11" - :color="colors" + :color="leaderViewColors" /> @@ -291,6 +293,7 @@ @@ -422,6 +425,21 @@ const colors = [ percentage: 40, }, ]; +const leaderViewColors = [ + { + color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", + percentage: 80, + }, + { + color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", + percentage: 60, + }, + { + color: "linear-gradient( 270deg, #FB002D 0%, #822232 100%)", + percentage: 0, + }, +]; + //endregion // region 所有函数 @@ -699,7 +717,7 @@ const option = ref({ borderColor: "#FF0000", // 高亮时边框颜色 borderWidth: 4 // 高亮时边框宽度 }, - data:[] + data: [] } ], }) diff --git a/src/views/datav/SceneInsp.vue b/src/views/datav/SceneInsp.vue index fc51308..f84a000 100644 --- a/src/views/datav/SceneInsp.vue +++ b/src/views/datav/SceneInsp.vue @@ -62,6 +62,7 @@ title="整改率排名" sub-title="已整改/问题数" unit="%" + :color="dayTimeColors" /> @@ -115,6 +116,7 @@ title="整改率排名" sub-title="已整改/问题数" unit="%" + :color="dayTimeColors" /> @@ -938,9 +940,28 @@ const colors = [ }, { color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", - percentage: 40, + percentage: 0, }, ]; + +const dayTimeColors = [ + { + color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", + + percentage: 80, + }, + { + color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", + percentage: 75, + }, + { + color: "linear-gradient( 270deg, #FB002D 0%, #822232 100%)", + percentage: 0, + }, +]; + + + // endregion // region 所有图表 diff --git a/src/views/datav/VideoInsp.vue b/src/views/datav/VideoInsp.vue index ce6189a..d73386b 100644 --- a/src/views/datav/VideoInsp.vue +++ b/src/views/datav/VideoInsp.vue @@ -243,11 +243,7 @@ const colors = [ { color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", percentage: 60, - }, - { - color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", - percentage: 40, - }, + } ]; const videoUrl = 'webrtc://47.121.143.167/live/livestream'; // endregion @@ -478,15 +474,16 @@ const getVideoSuperviseMapData = async (timeValue) => { value: item.discoverProblem, }; }); - const total = mappedData.reduce((sum, item) => sum + Number(item.value), 0); - const avg = total / mappedData.length; // 计算平均值 - const range30Percent = avg * 0.3 // 不用取整，小数也可以 + // 总数 + const maxItem = mappedData.reduce((max, item) => (Number(item.value) > Number(max.value) ? item : max), mappedData[0]); + const range60Percent = maxItem.value * 0.6 // 不用取整，小数也可以 + const range80Percent = maxItem.value * 0.8 // 不用取整，小数也可以 mapIconList.value = mappedData option.value.series[0].data = mapIconList option.value.visualMap.pieces = [ - {gte: 0, lte: avg - range30Percent, label: "低于平均问题30%", color: "#4987F6"}, - {gte: avg - range30Percent, lte: avg + range30Percent + 0.1, label: "平均问题上下浮动30%内", color: "#F6A149"}, - {gte: avg + range30Percent, label: "高于平均问题30%", color: "#D34343"}, + {gte: 0, lte: range60Percent, label: "低于最大问题的60%", color: "#4987F6"}, + {gte: range60Percent, lte: range80Percent, label: "介于最大问题的60%~80%", color: "#F6A149"}, + {gte: range80Percent, label: "高于最大问题80%", color: "#D34343"}, ]; } const getVideoSuperviseTrendData = async (year) => { diff --git a/src/views/datav/subonedatav/SubOneCaseVerif.vue b/src/views/datav/subonedatav/SubOneCaseVerif.vue index a2a5799..1296651 100644 --- a/src/views/datav/subonedatav/SubOneCaseVerif.vue +++ b/src/views/datav/subonedatav/SubOneCaseVerif.vue @@ -213,10 +213,6 @@ const colors = [ color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", percentage: 60, }, - { - color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", - percentage: 40, - }, ]; // endregion @@ -518,14 +514,14 @@ const getMapIcon = async(departId, timeValue)=> { }; }); gobalTempMapVoList.value = mappedData - const total = mappedData.reduce((sum, item) => sum + Number(item.value), 0); - const avg = total / mappedData.length; // 计算平均值 - const range30Percent = avg*0.3 // 不用取整，小数也可以 + const maxItem = mappedData.reduce((max, item) => (Number(item.value) > Number(max.value) ? item : max), mappedData[0]); + const range60Percent = maxItem.value * 0.6 // 不用取整，小数也可以 + const range80Percent = maxItem.value * 0.8 // 不用取整，小数也可以 option.value.series[0].data = mappedData; option.value.visualMap.pieces = [ - {gte: 0, lte: avg - range30Percent, label: "低于平均问题30%", color: "#4987F6"}, - {gte: avg - range30Percent, lte: avg + range30Percent+0.1, label: "平均问题上下浮动30%内", color: "#F6A149"}, - {gte: avg + range30Percent, label: "高于平均问题30%", color: "#D34343"}, + {gte: 0, lte: range60Percent, label: "低于最大问题的60%", color: "#4987F6"}, + {gte: range60Percent, lte: range80Percent, label: "介于最大问题的60%~80%", color: "#F6A149"}, + {gte: range80Percent, label: "高于最大问题80%", color: "#D34343"}, ]; } const getProTrendList= async(departId, year) => { diff --git a/src/views/datav/subonedatav/SubOneGlobal.vue b/src/views/datav/subonedatav/SubOneGlobal.vue index 006b1c8..53bdbba 100644 --- a/src/views/datav/subonedatav/SubOneGlobal.vue +++ b/src/views/datav/subonedatav/SubOneGlobal.vue @@ -10,7 +10,7 @@ v-model="activeOrgTab" type="bottom-button" > - + - + sum + Number(item.value), 0); - const avg = total / mappedData.length; // 计算平均值 - const range30Percent = avg * 0.3 // 不用取整，小数也可以 + const maxItem = mappedData.reduce((max, item) => (Number(item.value) > Number(max.value) ? item : max), mappedData[0]); + const range60Percent = maxItem.value * 0.6 // 不用取整，小数也可以 + const range80Percent = maxItem.value * 0.8 // 不用取整，小数也可以 globalTempMapVoList.value = mappedData; option.value.series[0].data = globalTempMapVoList; option.value.visualMap.pieces = [ - {gte: 0, lte: avg - range30Percent, label: "低于平均问题30%", color: "#4987F6"}, - {gte: avg - range30Percent, lte: avg + range30Percent + 0.1, label: "平均问题上下浮动30%内", color: "#F6A149"}, - {gte: avg + range30Percent, label: "高于平均问题30%", color: "#D34343"}, + {gte: 0, lte: range60Percent, label: "低于最大问题的60%", color: "#4987F6"}, + {gte: range60Percent, lte: range80Percent, label: "介于最大问题的60%~80%", color: "#F6A149"}, + {gte: range80Percent, label: "高于最大问题80%", color: "#D34343"}, ]; } const getSubOneGlobalTrendData = async (departId = currentDepartId, year) => { diff --git a/src/views/datav/subonedatav/SubOneMailVisits.vue b/src/views/datav/subonedatav/SubOneMailVisits.vue index 4ef8d50..0d4cfbe 100644 --- a/src/views/datav/subonedatav/SubOneMailVisits.vue +++ b/src/views/datav/subonedatav/SubOneMailVisits.vue @@ -74,6 +74,7 @@ :max="11" size="large" label-width="110" + :color="leaderViewColors" /> @@ -110,6 +111,7 @@ :max="11" size="large" label-width="110" + :color="leaderViewColors" /> @@ -262,7 +264,7 @@ :data="fxsjLeaderReviewMailList" size="large" :max="11" - :color="colors" + :color="leaderViewColors" label-width="110" /> @@ -301,6 +303,7 @@ :data="bwzdLeaderReviewMailList" size="large" label-width="110" + :color="leaderViewColors" /> @@ -442,6 +445,21 @@ const colors = [ }, ]; +const leaderViewColors = [ + { + color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", + percentage: 80, + }, + { + color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", + percentage: 60, + }, + { + color: "linear-gradient( 270deg, #FB002D 0%, #822232 100%)", + percentage: 0, + }, +]; + //endregion // region 所有函数 diff --git a/src/views/datav/subonedatav/SubOneSceneInsp.vue b/src/views/datav/subonedatav/SubOneSceneInsp.vue index 313dd43..6e4713b 100644 --- a/src/views/datav/subonedatav/SubOneSceneInsp.vue +++ b/src/views/datav/subonedatav/SubOneSceneInsp.vue @@ -63,6 +63,7 @@ sub-title="已整改/问题数" unit="%" :label-width="110" + :color="dayTimeColors" /> @@ -117,6 +118,7 @@ sub-title="已整改/问题数" unit="%" :label-width="110" + :color="dayTimeColors" /> @@ -938,7 +940,23 @@ const colors = [ }, { color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", - percentage: 40, + percentage: 0, + }, +]; + +const dayTimeColors = [ + { + color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", + + percentage: 80, + }, + { + color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", + percentage: 75, + }, + { + color: "linear-gradient( 270deg, #FB002D 0%, #822232 100%)", + percentage: 0, }, ]; diff --git a/src/views/datav/subonedatav/SubOneVideoInsp.vue b/src/views/datav/subonedatav/SubOneVideoInsp.vue index d763b6b..388f569 100644 --- a/src/views/datav/subonedatav/SubOneVideoInsp.vue +++ b/src/views/datav/subonedatav/SubOneVideoInsp.vue @@ -242,10 +242,6 @@ const colors = [ color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)", percentage: 60, }, - { - color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)", - percentage: 40, - }, ]; // endregion @@ -433,23 +429,21 @@ const getSubOneAllVideoSuperviseCountData = async (departId, timeValue) => { const getSubOneVideoSuperviseMapData = async (departId, timeValue) => { const res = await getSubOneVideoSuperviseMap(departId, timeValue); - console.log(res.videoSuperviseMapIconVoList) - console.log("地图数据来了"); const mappedData = res.videoSuperviseMapIconVoList.map(item => { return { ...item, value: item.discoverProblem, }; }); - const total = mappedData.reduce((sum, item) => sum + Number(item.value), 0); - const avg = total / mappedData.length; // 计算平均值 - const range30Percent = avg * 0.3 // 不用取整，小数也可以 + const maxItem = mappedData.reduce((max, item) => (Number(item.value) > Number(max.value) ? item : max), mappedData[0]); + const range60Percent = maxItem.value * 0.6 // 不用取整，小数也可以 + const range80Percent = maxItem.value * 0.8 // 不用取整，小数也可以 mapIconList.value = mappedData option.value.series[0].data = mapIconList option.value.visualMap.pieces = [ - {gte: 0, lte: avg - range30Percent, label: "低于平均问题30%", color: "#4987F6"}, - {gte: avg - range30Percent, lte: avg + range30Percent + 0.1, label: "平均问题上下浮动30%内", color: "#F6A149"}, - {gte: avg + range30Percent, label: "高于平均问题30%", color: "#D34343"}, + {gte: 0, lte: range60Percent, label: "低于最大问题的60%", color: "#4987F6"}, + {gte: range60Percent, lte: range80Percent, label: "介于最大问题的60%~80%", color: "#F6A149"}, + {gte: range80Percent, label: "高于最大问题80%", color: "#D34343"}, ]; } From 962a8a9654c2f805850dadbcb00b81abc3804f72 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=8D=E7=88=B1=E5=AD=A6=E4=B9=A0=E7=9A=84=E7=9F=B3?= =?UTF-8?q?=E5=90=8C=E5=AD=A6?= <2936013465@qq.com> Date: Thu, 9 Jan 2025 11:15:05 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E5=9B=BE=E6=A0=87=E6=B5=AE=E5=8A=A8?= =?UTF-8?q?=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/datav/subonedatav/SubOneGlobal.vue | 43 ++++++++++++-------- 1 file changed, 26 insertions(+), 17 deletions(-) diff --git a/src/views/datav/subonedatav/SubOneGlobal.vue b/src/views/datav/subonedatav/SubOneGlobal.vue index 53bdbba..fbe958a 100644 --- a/src/views/datav/subonedatav/SubOneGlobal.vue +++ b/src/views/datav/subonedatav/SubOneGlobal.vue @@ -75,14 +75,15 @@ style="width: 13.66%; margin-left: 10px" /> - - +
+ +
- + @@ -151,7 +152,7 @@ import { } from "@/api/screen/subScreen/subOneGlobal.ts"; // region 各种变量 -const show = ref(false); // 负面信息弹窗显示 +const showDialog = ref(false); // 负面信息弹窗显示 const tempDepartId = ref(0); // 临时部门id const router = useRouter(); @@ -196,7 +197,7 @@ const colors = [ percentage: 40, }, ]; -let subOneGlobalMapIntervalId ; +let subOneGlobalMapIntervalId; // endregion @@ -439,7 +440,7 @@ const getSubOneGlobalMapIcon = async (departId = currentDepartId, timeValue = ti {gte: range80Percent, label: "高于最大问题80%", color: "#D34343"}, ]; } -const getSubOneGlobalTrendData = async (departId = currentDepartId, year) => { +const getSubOneGlobalTrendData = async (departId = currentDepartId, year) => { const res = await getSubOneGlobalTrend(departId, year); const categories = res.globalRecentlyTrendList.map(item => item.name); const values = res.globalRecentlyTrendList.map(item => item.value); @@ -476,7 +477,7 @@ const mapAnimation = () => { const mySubOneGlobalMap = subOneGlobalMap?.value?.chart; if (!mySubOneGlobalMap) return; // 来个随机数，9个图 0~8的整数就ok - const tempNum = currentMapData?.value?.geoJson?.features?.length + const tempNum = currentMapData?.value?.geoJson?.features?.length const randomNum = Math.floor(Math.random() * tempNum); mySubOneGlobalMap.dispatchAction({ type: "downplay", //downplay 取消高亮 @@ -515,6 +516,8 @@ watch(time, () => { }); const setupEventListeners = () => { const mySubOneGlobalMap = subOneGlobalMap?.value?.chart; + const map = document.getElementById("map"); + console.log(map) // 鼠标移入 mySubOneGlobalMap.on('mousemove', (e) => { // console.log(e.dataIndex); @@ -525,15 +528,20 @@ const setupEventListeners = () => { }); // 鼠标移出 mySubOneGlobalMap.on('mouseout', () => { - clearInterval(subOneGlobalMapIntervalId); // 确保没有多个定时器同时运行 - subOneGlobalMapIntervalId = setInterval(mapAnimation, 2000); + // 如果有弹窗 + if (showDialog.value) { + clearInterval(subOneGlobalMapIntervalId); // 确保没有多个定时器同时运行 + } else { + clearInterval(subOneGlobalMapIntervalId); // 确保没有多个定时器同时运行 + subOneGlobalMapIntervalId = setInterval(mapAnimation, 2000); + } }); }; const handleClick = (params) => { const departId = params.data.departId; - show.value = true; - tempDepartId.value=2661 + showDialog.value = true; + tempDepartId.value = departId clearInterval(subOneGlobalMapIntervalId); // alert(departId) } @@ -556,6 +564,7 @@ const handleClick = (params) => { background: linear-gradient(180deg, rgba(1, 4, 87, 0.8) 0%, rgba(3, 21, 119, 0.8) 100%); border: 1px solid #4E8FFF; margin: -10px -10px -10px -10px; + } ////浏阳市局