|
|
|
|
@ -44,39 +44,39 @@
|
|
|
|
|
/> |
|
|
|
|
</datav-card> |
|
|
|
|
</el-col> |
|
|
|
|
|
|
|
|
|
<el-col :span="12"> |
|
|
|
|
<datav-date-picker v-model="time"/> |
|
|
|
|
<div class="flex gap-42"> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="overview.totalPro" |
|
|
|
|
title="问题总数" |
|
|
|
|
style="width: 13.66%; margin-left: 20px" |
|
|
|
|
:value="overviewData.supervisionPro" |
|
|
|
|
:title="`现场督察`" |
|
|
|
|
style="width: 20%;" |
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="overview.supervisionPro" |
|
|
|
|
title="督导检查问题" |
|
|
|
|
style="width: 13.66%; margin-left: 30px" |
|
|
|
|
:value="overviewData.numSupervisionPro" |
|
|
|
|
:title="`数字督察`" |
|
|
|
|
style="width: 20%;" |
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="overview.caseVerificationPro" |
|
|
|
|
title="案件核查问题" |
|
|
|
|
style="width: 13.66%; margin-left: 30px" |
|
|
|
|
:value="overviewData.caseVerificationPro" |
|
|
|
|
:title="`案件核查`" |
|
|
|
|
style="width: 20%; margin-left: 10px" |
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="overview.complaintPro" |
|
|
|
|
title="信访投诉问题" |
|
|
|
|
style="width: 13.66%; margin-left: 30px" |
|
|
|
|
:value="overviewData.mailboxNumber" |
|
|
|
|
:title="`局长信箱`" |
|
|
|
|
style="width: 20%; margin-left: 10px" |
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="overview.talkPro" |
|
|
|
|
title="民意感知问题" |
|
|
|
|
style="width: 13.66%; margin-left: 30px" |
|
|
|
|
:value="overviewData.complaintPro" |
|
|
|
|
:title="`信访投诉`" |
|
|
|
|
style="width: 20%; margin-left: 10px" |
|
|
|
|
|
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="overview.auditPro" |
|
|
|
|
title="审计监督问题" |
|
|
|
|
style="width: 13.66%; margin-left: 10px" |
|
|
|
|
:value="overviewData.auditPro" |
|
|
|
|
:title="`审计项目`" |
|
|
|
|
style="width: 20%; margin-left: 10px" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
<div id="map"> |
|
|
|
|
@ -172,15 +172,17 @@ const fxsjlist = ref([]); // 分县市区机构问题排名
|
|
|
|
|
const jsdwlist = ref([]); // 局属单位机构问题排名 |
|
|
|
|
const ywzblist = ref([]); // 业务类型占比 |
|
|
|
|
const wtlxlist = ref([]); // 问题涉及方面分布 |
|
|
|
|
const tcwtlist = ref([]); // 突出问题排名 |
|
|
|
|
const overview = ref({ |
|
|
|
|
const tcwtlist = ref([]);// 突出问题排名 |
|
|
|
|
let overviewData = ref({ |
|
|
|
|
totalPro: 0, |
|
|
|
|
supervisionPro: 0, |
|
|
|
|
numSupervisionPro:0, |
|
|
|
|
caseVerificationPro: 0, |
|
|
|
|
complaintPro: 0, |
|
|
|
|
talkPro: 0, |
|
|
|
|
auditPro: 0, |
|
|
|
|
}); // 中央的概况数据 |
|
|
|
|
mailboxNumber: 0 |
|
|
|
|
}) // 中央的概况数据 |
|
|
|
|
const time = ref([ |
|
|
|
|
moment().startOf("year").format("YYYY-MM-DD"), |
|
|
|
|
moment().format("YYYY-MM-DD"), |
|
|
|
|
@ -189,7 +191,7 @@ const globalTempMapVoList = ref([]); // 地图临时数据
|
|
|
|
|
|
|
|
|
|
const currentYear = new Date().getFullYear(); |
|
|
|
|
const years = ref([currentYear.toString(), (currentYear - 1).toString(), (currentYear - 2).toString()]); // 年份列表 |
|
|
|
|
const selectedYear = ref('2024'); // 当前选中的年份 |
|
|
|
|
const selectedYear = ref('2025'); // 当前选中的年份 |
|
|
|
|
const colors = [ |
|
|
|
|
{ |
|
|
|
|
color: "linear-gradient( 270deg, #FB002D 0%, #822232 100%)", |
|
|
|
|
@ -261,19 +263,19 @@ const option = ref({
|
|
|
|
|
position: 'bottom', |
|
|
|
|
formatter: function (params) { |
|
|
|
|
const dataItem = globalTempMapVoList.value.find(item => item.name === params.name) || {}; // 找到对应的数据项 |
|
|
|
|
// console.log("Data item:", dataItem); |
|
|
|
|
console.log("Data item:", dataItem); |
|
|
|
|
if (dataItem.name === params.name) { |
|
|
|
|
return ` |
|
|
|
|
<div class="tooltip"> |
|
|
|
|
<div class="tooltip-title">${params.name}</div> |
|
|
|
|
<div class="tooltip-content"> |
|
|
|
|
<ul class="tooltip-ul" > |
|
|
|
|
<li>问题总数 <span>${dataItem.totalPro}</span></li> |
|
|
|
|
<li>督导检查问题 <span>${dataItem.supervisePro}</span></li> |
|
|
|
|
<li>案件核查问题 <span>${dataItem.caseVerifyPro}</span></li> |
|
|
|
|
<li>信访投诉问题 <span>${dataItem.mailPro}</span></li> |
|
|
|
|
<li>民意感知问题 <span>${dataItem.policePro}</span></li> |
|
|
|
|
<li>审计监督问题 <span>${dataItem.reviewPro}</span></li> |
|
|
|
|
<li>现场督察 <span>${dataItem.supervisePro || 0}</span></li> |
|
|
|
|
<li>数字督察 <span>${dataItem.numSupervisionPro || 0}</span></li> |
|
|
|
|
<li>案件核查<span>${dataItem.caseVerificationPro || 0}</span></li> |
|
|
|
|
<li>局长信箱 <span>${dataItem.mailboxNumber || 0}</span></li> |
|
|
|
|
<li>信访投诉 <span>${dataItem.complaintPro || 0}</span></li> |
|
|
|
|
<li>审计项目 <span>${dataItem.auditPro || 0}</span></li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
@ -283,13 +285,13 @@ const option = ref({
|
|
|
|
|
<div class="tooltip"> |
|
|
|
|
<div class="tooltip-title">${params.name}</div> |
|
|
|
|
<div class="tooltip-content"> |
|
|
|
|
<ul class="tooltip-ul""> |
|
|
|
|
<li>问题总数 <span>-</span></li> |
|
|
|
|
<li>督导检查问题 <span>-</span></li> |
|
|
|
|
<li>案件核查问题 <span>-</span></li> |
|
|
|
|
<li>信访投诉问题 <span>-</span></li> |
|
|
|
|
<li>民意感知问题 <span>-</span></li> |
|
|
|
|
<li>审计监督问题 <span>-</span></li> |
|
|
|
|
<ul class="tooltip-ul" > |
|
|
|
|
<li>现场督察 <span>-</span></li> |
|
|
|
|
<li>数字督察 <span>-</span></li> |
|
|
|
|
<li>案件核查<span>-</span></li> |
|
|
|
|
<li>局长信箱 <span>-</span></li> |
|
|
|
|
<li>信访投诉 <span>-</span></li> |
|
|
|
|
<li>审计项目 <span>-</span></li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
@ -429,11 +431,11 @@ const getOrganizationProRankData = async (departId = currentDepartId, timeValue
|
|
|
|
|
} |
|
|
|
|
const getBusinessRateData = async (departId = currentDepartId, timeValue = time.value) => { |
|
|
|
|
const res = await getSubOneBusinessRate(departId, timeValue); |
|
|
|
|
ywzblist.value = res.ywzblist; |
|
|
|
|
ywlxPieOption.value.series[0].data = res.ywzblist; |
|
|
|
|
} |
|
|
|
|
const getAllGlobalCountData = async (departId = currentDepartId, timeValue = time.value) => { |
|
|
|
|
const res = await getSubOneAllCount(departId, timeValue); |
|
|
|
|
overview.value = res.overview; |
|
|
|
|
overviewData.value = res.overview; |
|
|
|
|
} |
|
|
|
|
const getSubOneGlobalMapIcon = async (departId = currentDepartId, timeValue = time.value) => { |
|
|
|
|
const res = await getSubOneGlobalMap(departId, timeValue) |
|
|
|
|
@ -443,10 +445,12 @@ const getSubOneGlobalMapIcon = async (departId = currentDepartId, timeValue = ti
|
|
|
|
|
value: item.totalPro, |
|
|
|
|
}; |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
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; |
|
|
|
|
console.log('globalTempMapVoList', globalTempMapVoList.value) |
|
|
|
|
option.value.series[0].data = globalTempMapVoList; |
|
|
|
|
option.value.visualMap.pieces = [ |
|
|
|
|
{gte: 0, lte: range60Percent, label: "低于最大问题的60%", color: "#4987F6"}, |
|
|
|
|
@ -497,11 +501,14 @@ const handleMouseLeave = () => {
|
|
|
|
|
}, 3000); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 业务类型占比环形图 |
|
|
|
|
//todo 业务类型占比环形图 |
|
|
|
|
const subOneYwlxzbCircularAnimation = () => { |
|
|
|
|
const ywlxzbOptionTemp = subOneYwlxzbOption?.value?.chart; |
|
|
|
|
// ywzblist.value |
|
|
|
|
if (!ywlxzbOptionTemp) return; |
|
|
|
|
const length = ywlxPieOption.value.series[0].data.length; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const randomNum = Math.floor(Math.random() * length); |
|
|
|
|
ywlxzbOptionTemp?.dispatchAction({type: 'downplay', seriesIndex: 0}); |
|
|
|
|
ywlxzbOptionTemp?.dispatchAction({type: 'highlight', seriesIndex: 0, dataIndex: randomNum}); // 显示 |
|
|
|
|
@ -562,6 +569,7 @@ subOneWtlxPieCircularIntervalId = setInterval(subOneWtlxzbCircularAnimation, 200
|
|
|
|
|
onMounted(() => { |
|
|
|
|
getData(); |
|
|
|
|
setupEventListeners(); |
|
|
|
|
selectedYear.value= currentYear.toString() |
|
|
|
|
}); |
|
|
|
|
// endregion |
|
|
|
|
|
|
|
|
|
@ -663,8 +671,9 @@ const handleClick = (params) => {
|
|
|
|
|
|
|
|
|
|
.tooltip-content { |
|
|
|
|
width: 160px; |
|
|
|
|
height: 150px; |
|
|
|
|
background: linear-gradient(180deg, #010457 0%, #031577 100%) |
|
|
|
|
height: 155px; |
|
|
|
|
background: linear-gradient(180deg, #010457 0%, #031577 100%); |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.tooltip-content ul { |
|
|
|
|
@ -672,23 +681,21 @@ const handleClick = (params) => {
|
|
|
|
|
padding-left: 5px; |
|
|
|
|
margin: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.tooltip-content ul li { |
|
|
|
|
height: 24px; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-around; |
|
|
|
|
height: 26px; |
|
|
|
|
color: #597AE9; |
|
|
|
|
font-weight: 400; |
|
|
|
|
font-size: 14px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//// 数字的span |
|
|
|
|
.tooltip-ul span { |
|
|
|
|
display: inline-block; |
|
|
|
|
float: right; |
|
|
|
|
width: 55px; |
|
|
|
|
color: #fff; |
|
|
|
|
font-size: 14px; |
|
|
|
|
text-align: center; /* 水平居中 */ |
|
|
|
|
|
|
|
|
|
//text-align: center; /* 水平居中 */ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
