supervision
/
supervision-vue
4
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

11/26/17：22 现场督察的一些代码

main
不爱学习的石同学 1 year ago
parent
ea741f29ad
commit
b57ec8f469
4 changed files with 194 additions and 150 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 32
      src/api/data/supervisionNotify.ts
  2. 284
      src/views/datav/Gobal.vue
  3. 2
      src/views/datav/Jwpy.vue
  4. 24
      src/views/datav/SceneInsp.vue

32
src/api/data/supervisionNotify.ts
Unescape View File

@ -8,6 +8,16 @@ export function getAllSupervisionNotifyCount(times) {
});
}
/**
* 问题类型占比
*/
export function getProblemTypeRate(times) {
return request.get({
url: `/datav/supervisonNotify/getProblemTypeRate?beginTime=${times[0]}&endTime=${times[1]}`
});
}
export function getChangedRank(times, groupType) {
@ -23,3 +33,25 @@ export function getSupervisionTrend(year) {
url: `/datav/supervisonNotify/getSupervisionTrend?year=${year}`
});
}
/**
* 获取地图数据
*/
export function getMap(times) {
return request.get({
url: `/datav/supervisonNotify/getMap?beginTime=${times[0]}&endTime=${times[1]}`
});
}
/**
* 黄赌毒数据
*/
export function getYellowBetDrug(times) {
return request.get({
url: `/datav/supervisonNotify/getYellowBetDrug?beginTime=${times[0]}&endTime=${times[1]}`
});
}

284
src/views/datav/Gobal.vue
Unescape View File

@ -139,14 +139,14 @@ import vCharts from "vue-echarts";
import changshaMap from "@/assets/data/changsha.json";
import * as echarts from "echarts/core";
import moment from "moment/moment";
import {getCaseVerifData} from "@/api/datav";
import {
getAllGobalCount,
getBusinessRate,
getGobalRecentlyTrendByMonth,
getOrganizationRank, getProblemBusinessRate, getStrongProblemRate, getGobalMap
} from "@/api/data/basicScreen.ts";
// region 各种数据变量
// region 各种变量
const activeOrgTab = ref("1");
const fxsjlist = ref([]); // 分县市区机构问题排名
const jsdwlist = ref([]); // 局属单位机构问题排名
@ -176,15 +176,137 @@ const gobalTempMapVoList = ref([
"reviewPro": 11
}
]); // 地图临时数据
const router = useRouter();
const years = ref(['2024', '2023', '2022']); // 年份列表
const selectedYear = ref('2024'); // 当前选中的年份
// endregion
function go() {
router.push("/datav/sub1")
}
// region 图表变量
// 业务类型占比
const zfbaPieOption = computed(() => {
return {
tooltip: {
trigger: "item",
},
series: [
{
type: "pie",
radius: ["40%", "70%"],
label: {
color: "#fff",
},
data: ywzblist.value,
},
],
};
});
// 问题类型占比
const wtlxPieOption = computed(() => {
return {
tooltip: {
trigger: "item",
},
series: [
{
type: "pie",
radius: ["40%", "70%"],
label: {
color: "#fff",
},
data: wtlxlist.value,
// region问题趋势线状图
},
],
};
});
// 地图
echarts.registerMap("changsha", changshaMap);
const option = ref({
geo: {
map: "changsha",
},
tooltip: {
trigger: 'item',
formatter: function (params) {
console.log(params);
const dataItem = gobalTempMapVoList.value.find(item => item.name.includes(params.name.substring(0, 2)));
if (dataItem) {
return `
<div class="tooltip">
<div class="tooltip-title">${dataItem.originalName}</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>
</ul>
</div>
</div>`;
} else {
return `<div class="tooltip">
<div class="tooltip-title">${dataItem.originalName}</div>
<div class="tooltip-content">
<ul class="tooltip-ul"">
<li>问题总数 <span>0</span></li>
<li>督察问题 <span>0</span></li>
<li>案件核查问题 <span>0</span></li>
<li>信访投诉问题 <span>0</span></li>
<li>民意感知问题 <span>0</span></li>
</ul>
</div>
</div>`;
}
},
},
visualMap: {
type: "piecewise",
bottom: 10,
pieces: [
{min: 0, max: 500, label: "问题数低于500", color: "#4987F6"},
{min: 501, max: 1000, label: "问题数介于500-1000", color: "#F6A149"},
{min: 1001, label: "问题数高于1000", color: "#D34343"},
],
right: 10,
realtime: false,
orient: "horizontal",
textStyle: {
color: "#fff",
},
calculable: true,
},
series: [
{
name: "长沙",
type: "map",
map: "changsha",
hoverAnimation: true,
label: {
show: true,
color: "white",
},
itemStyle: {
normal: {
areaColor: "#02215E",
borderColor: "#1773c3",
},
},
emphasis: {
areaColor: "#FFD700", // 高亮时区域颜色
borderColor: "#FF0000", // 高亮时边框颜色
borderWidth: 4 // 高亮时边框宽度
},
data: []
}
],
})
// 问题趋势线状图
const proTrend = ref({
grid: {
left: '10%', // 图表距离容器左边的距离
@ -243,60 +365,6 @@ const proTrend = ref({
},
],
});
const handleCommand = (year) => {
selectedYear.value = year; // 更新当前选中的年份
getGobalRecentlyTrendByMonth(year).then(res => {
proTrend.value.xAxis.data = res.monthList;
proTrend.value.series[0].data = res.totalList;
});
};
// endregion
function go() {
router.push("/datav/sub1")
}
// region 环形图
// 业务类型占比
const zfbaPieOption = computed(() => {
return {
tooltip: {
trigger: "item",
},
series: [
{
type: "pie",
radius: ["40%", "70%"],
label: {
color: "#fff",
},
data: ywzblist.value,
},
],
};
});
// 问题类型占比
const wtlxPieOption = computed(() => {
return {
tooltip: {
trigger: "item",
},
series: [
{
type: "pie",
radius: ["40%", "70%"],
label: {
color: "#fff",
},
data: wtlxlist.value,
},
],
};
});
// endregion
// region 初始化数据
@ -322,8 +390,7 @@ function getData() {
wtlxlist.value = res.wtlxlist;
});
getGobalMap(time.value).then(res => {
// 对返回的数据进行映射处理
// 对返回的数据映射处理
const mappedData = res.gobalTempMapVoList.map(item => {
let name;
switch (item.name) {
@ -372,100 +439,25 @@ function getData() {
option.value.series[0].data = mappedData;
})
}
onMounted(() => {
getData();
});
// endregion
// region 事件||监听
const handleCommand = (year) => {
selectedYear.value = year; // 更新当前选中的年份
getGobalRecentlyTrendByMonth(year).then(res => {
proTrend.value.xAxis.data = res.monthList;
proTrend.value.series[0].data = res.totalList;
});
};
watch(time, () => {
getData();
});
// endregion
// region 地图相关
echarts.registerMap("changsha", changshaMap);
const option = ref(
{
geo: {
map: "changsha",
},
tooltip: {
trigger: 'item',
formatter: function (params) {
console.log(params);
const dataItem = gobalTempMapVoList.value.find(item => item.name.includes(params.name.substring(0, 2)));
if (dataItem) {
return `
<div class="tooltip">
<div class="tooltip-title">${dataItem.originalName}</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>
</ul>
</div>
</div>`;
} else {
return `<div class="tooltip">
<div class="tooltip-title">${dataItem.originalName}</div>
<div class="tooltip-content">
<ul class="tooltip-ul"">
<li>问题总数 <span>0</span></li>
<li>督察问题 <span>0</span></li>
<li>案件核查问题 <span>0</span></li>
<li>信访投诉问题 <span>0</span></li>
<li>民意感知问题 <span>0</span></li>
</ul>
</div>
</div>`;
}
},
},
visualMap: {
type: "piecewise",
bottom: 10,
pieces: [
{min: 0, max: 500, label: "问题数低于500", color: "#4987F6"},
{min: 501, max: 1000, label: "问题数介于500-1000", color: "#F6A149"},
{min: 1001, label: "问题数高于1000", color: "#D34343"},
],
right: 10,
realtime: false,
orient: "horizontal",
textStyle: {
color: "#fff",
},
calculable: true,
},
series: [
{
name: "长沙",
type: "map",
map: "changsha",
hoverAnimation: true,
label: {
show: true,
color: "white",
},
itemStyle: {
normal: {
areaColor: "#02215E",
borderColor: "#1773c3",
},
},
emphasis: {
areaColor: "#FFD700", // 高亮时区域颜色
borderColor: "#FF0000", // 高亮时边框颜色
borderWidth: 4 // 高亮时边框宽度
},
data: []
}
],
})
// endregion
const colors = [
{

2
src/views/datav/Jwpy.vue
Unescape View File

@ -706,7 +706,7 @@ onMounted(async () => {
task.value = content.value[0].ID;
}
// 获取数据
// await getData();
await getData();
});

24
src/views/datav/SceneInsp.vue
Unescape View File

@ -257,7 +257,12 @@ import vCharts from "vue-echarts";
import changshaMap from "@/assets/data/changsha.json";
import * as echarts from "echarts/core";
import moment from "moment";
import {getAllSupervisionNotifyCount, getChangedRank, getSupervisionTrend} from "@/api/data/supervisionNotify.ts";
import {
getAllSupervisionNotifyCount,
getChangedRank,
getMap, getProblemTypeRate,
getSupervisionTrend, getYellowBetDrug
} from "@/api/data/supervisionNotify.ts";
import {getGobalRecentlyTrendByMonth} from "@/api/data/basicScreen.ts";
const data1 = ref([]);
@ -573,8 +578,8 @@ function getData() {
getChangedRank(time.value, 3).then((res) => {
rankOverview.value = res.rankOverview;
data1.value = res.changedRankList;
// option2.series[0].data = res.wtlxList;
});
getSupervisionTrend(new Date().getFullYear()).then((res) => {
const supervisionTrend = res.supervisionTrend;
const categories = supervisionTrend.map(item => item.name);
@ -585,6 +590,21 @@ function getData() {
});
// getMap(time.value).then((res)=> {
// superviseTempMapVoList = res.superviseTempMapVoList;
// })
//
//
// getProblemTypeRate(time.value).then((res) => {
// wtlxList.value = res.wtlxList
// });
//
//
// getYellowBetDrug().then((res) => {
// hddOverview.value = res.hddOverview;
// hddList.value = res.hddList
// });
}
watch(time, () => {

Write Preview
Loading…
Cancel
Save