|
|
|
|
@ -160,10 +160,15 @@
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
window.JSZip = require('jszip')
|
|
|
|
|
import { qlzxdtData } from './json'
|
|
|
|
|
import { getreportNum } from '@/api/common'
|
|
|
|
|
import { zhuanxiang, managescreen, zhuanxiangInfo, reportbyyear } from '@/api/zongzhi/manage.js'
|
|
|
|
|
window.JSZip = require("jszip");
|
|
|
|
|
import { qlzxdtData } from "./json";
|
|
|
|
|
import { getreportNum } from "@/api/common";
|
|
|
|
|
import {
|
|
|
|
|
zhuanxiang,
|
|
|
|
|
managescreen,
|
|
|
|
|
zhuanxiangInfo,
|
|
|
|
|
reportbyyear,
|
|
|
|
|
} from "@/api/zongzhi/manage.js";
|
|
|
|
|
import {
|
|
|
|
|
listJbsjndfltj,
|
|
|
|
|
listQlzxxddt,
|
|
|
|
|
@ -171,62 +176,62 @@ import {
|
|
|
|
|
listQlzxxdsjtj,
|
|
|
|
|
screenqinglang,
|
|
|
|
|
} from "@/api/netManage/index.js";
|
|
|
|
|
import { echartsJump } from '../../../../../public/static/echartsJump'
|
|
|
|
|
import { download } from "@/utils/safesoft"
|
|
|
|
|
import vueSeamlessScroll from 'vue-seamless-scroll'
|
|
|
|
|
import image from '../../../../assets/ecosphere/饼图标注.png'
|
|
|
|
|
import ModuleTitle from '../../common/ModuleTitle.vue'
|
|
|
|
|
import { echartsJump } from "../../../../../public/static/echartsJump";
|
|
|
|
|
import { download } from "@/utils/safesoft";
|
|
|
|
|
import vueSeamlessScroll from "vue-seamless-scroll";
|
|
|
|
|
import image from "../../../../assets/ecosphere/饼图标注.png";
|
|
|
|
|
import ModuleTitle from "../../common/ModuleTitle.vue";
|
|
|
|
|
export default {
|
|
|
|
|
components: {
|
|
|
|
|
vueSeamlessScroll,
|
|
|
|
|
ModuleTitle
|
|
|
|
|
ModuleTitle,
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
var ndate = new Date();
|
|
|
|
|
var nmonth = ndate.getMonth();
|
|
|
|
|
return {
|
|
|
|
|
imgList: [
|
|
|
|
|
{ url: require('@/assets/ecosphere/清朗专项行动图/1-1.png') },
|
|
|
|
|
{ url: require('@/assets/ecosphere/清朗专项行动图/1-2.png') },
|
|
|
|
|
{ url: require('@/assets/ecosphere/清朗专项行动图/1-3.png') },
|
|
|
|
|
{ url: require('@/assets/ecosphere/清朗专项行动图/1-4.png') }
|
|
|
|
|
{ url: require("@/assets/ecosphere/清朗专项行动图/1-1.png") },
|
|
|
|
|
{ url: require("@/assets/ecosphere/清朗专项行动图/1-2.png") },
|
|
|
|
|
{ url: require("@/assets/ecosphere/清朗专项行动图/1-3.png") },
|
|
|
|
|
{ url: require("@/assets/ecosphere/清朗专项行动图/1-4.png") },
|
|
|
|
|
],
|
|
|
|
|
qlzxdtList: [],
|
|
|
|
|
number: 0,
|
|
|
|
|
reportingTimer: null,
|
|
|
|
|
pieData: [
|
|
|
|
|
{ value: 25, name: '上级下发' },
|
|
|
|
|
{ value: 4, name: '部门转办' },
|
|
|
|
|
{ value: 8, name: '小程序' },
|
|
|
|
|
{ value: 4, name: '无效' }
|
|
|
|
|
{ value: 25, name: "上级下发" },
|
|
|
|
|
{ value: 4, name: "部门转办" },
|
|
|
|
|
{ value: 8, name: "小程序" },
|
|
|
|
|
{ value: 4, name: "无效" },
|
|
|
|
|
],
|
|
|
|
|
qlzfDataStatistics: [
|
|
|
|
|
{
|
|
|
|
|
title: '处理有害信息数量(条)',
|
|
|
|
|
title: "处理有害信息数量(条)",
|
|
|
|
|
data: [
|
|
|
|
|
{
|
|
|
|
|
name: nmonth + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 1) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 1 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 2) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 2 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 3) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 3 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 4) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 4 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 5) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 5 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
// {
|
|
|
|
|
// name: '8月',
|
|
|
|
|
@ -252,35 +257,34 @@ export default {
|
|
|
|
|
// name: '3月',
|
|
|
|
|
// num: 0
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
]
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '关闭直播平台违规账号(个)',
|
|
|
|
|
title: "关闭直播平台违规账号(个)",
|
|
|
|
|
data: [
|
|
|
|
|
{
|
|
|
|
|
name: nmonth + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 1) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 1 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 2) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 2 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 3) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 3 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 4) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 4 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: (nmonth - 5) + '月',
|
|
|
|
|
num: 0
|
|
|
|
|
name: nmonth - 5 + "月",
|
|
|
|
|
num: 0,
|
|
|
|
|
},
|
|
|
|
|
// {
|
|
|
|
|
// name: '8月',
|
|
|
|
|
@ -306,9 +310,8 @@ export default {
|
|
|
|
|
// name: '3月',
|
|
|
|
|
// num: 0
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
qlzfDialogFlag: false,
|
|
|
|
|
eldialogData: null,
|
|
|
|
|
@ -316,7 +319,7 @@ export default {
|
|
|
|
|
wgptTotal: 0,
|
|
|
|
|
imgUrl: null,
|
|
|
|
|
zhuanxiangTotal: 0,
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
computed: {
|
|
|
|
|
classOption() {
|
|
|
|
|
@ -328,23 +331,23 @@ export default {
|
|
|
|
|
openWatch: true, // 开启数据实时监控刷新dom
|
|
|
|
|
singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
|
|
|
|
|
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
|
|
|
|
|
waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
created() {},
|
|
|
|
|
destroyed() {
|
|
|
|
|
clearInterval(this.reportingTimer)
|
|
|
|
|
clearInterval(this.time)
|
|
|
|
|
clearInterval(this.reportingTimer);
|
|
|
|
|
clearInterval(this.time);
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
// this.qlzxdtList = qlzxdtDatas
|
|
|
|
|
this.imgUrl = process.env.VUE_APP_BASE_API2
|
|
|
|
|
this.imgUrl = process.env.VUE_APP_BASE_API2;
|
|
|
|
|
// 开启定时器旋转
|
|
|
|
|
this.reportingProcessTimer()
|
|
|
|
|
this.zhuanxiangList() // 清朗专项行动动态
|
|
|
|
|
this.managescreenData() // 行动数据统计
|
|
|
|
|
this.reportbyyearDate() // 举报事件年度分类统计
|
|
|
|
|
this.reportingProcessTimer();
|
|
|
|
|
this.zhuanxiangList(); // 清朗专项行动动态
|
|
|
|
|
this.managescreenData(); // 行动数据统计
|
|
|
|
|
this.reportbyyearDate(); // 举报事件年度分类统计
|
|
|
|
|
|
|
|
|
|
// getreportNum().then(res => {
|
|
|
|
|
// this.pieData[0].value = res.data.reportTotalCount - 12
|
|
|
|
|
@ -355,63 +358,66 @@ export default {
|
|
|
|
|
async itemClick(e) {
|
|
|
|
|
// console.log(this.qlzxdtList[e.target.dataset.curdata])
|
|
|
|
|
// let data = await zhuanxiangInfo(this.qlzxdtList[e.target.dataset.curdata].id)
|
|
|
|
|
getQlzxxddt(this.qlzxdtList[e.target.dataset.curdata].id).then(data=>{
|
|
|
|
|
let eldialogData = JSON.parse(JSON.stringify(data.data))
|
|
|
|
|
eldialogData.imageUrl = eldialogData.imageUrl.split(',')
|
|
|
|
|
this.eldialogData = eldialogData
|
|
|
|
|
this.qlzfDialogFlag = true
|
|
|
|
|
})
|
|
|
|
|
getQlzxxddt(this.qlzxdtList[e.target.dataset.curdata].id).then((data) => {
|
|
|
|
|
let eldialogData = JSON.parse(JSON.stringify(data.data));
|
|
|
|
|
eldialogData.imageUrl = eldialogData.imageUrl.split(",");
|
|
|
|
|
this.eldialogData = eldialogData;
|
|
|
|
|
this.qlzfDialogFlag = true;
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
changeImg(item, index) {
|
|
|
|
|
item.index = index
|
|
|
|
|
item.index = index;
|
|
|
|
|
},
|
|
|
|
|
// 清朗专项行动动态
|
|
|
|
|
async zhuanxiangList() {
|
|
|
|
|
// let res = await zhuanxiang();
|
|
|
|
|
listQlzxxddt({isStatus:1}).then(res=>{
|
|
|
|
|
let imgArr
|
|
|
|
|
this.qlzxdtList = JSON.parse(JSON.stringify(res.rows))
|
|
|
|
|
listQlzxxddt({ isStatus: 1 }).then((res) => {
|
|
|
|
|
let imgArr;
|
|
|
|
|
this.qlzxdtList = JSON.parse(JSON.stringify(res.rows));
|
|
|
|
|
for (let i = 0; i < this.qlzxdtList.length; i++) {
|
|
|
|
|
imgArr = this.qlzxdtList[i].imageUrl
|
|
|
|
|
imgArr = imgArr.split(',')
|
|
|
|
|
this.qlzxdtList[i].imageUrl = imgArr[0]
|
|
|
|
|
imgArr = this.qlzxdtList[i].imageUrl;
|
|
|
|
|
imgArr = imgArr.split(",");
|
|
|
|
|
this.qlzxdtList[i].imageUrl = imgArr[0];
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
// 行动数据统计
|
|
|
|
|
async managescreenData() {
|
|
|
|
|
// let res = await managescreen()
|
|
|
|
|
screenqinglang().then(res=>{
|
|
|
|
|
let data1 = res.data
|
|
|
|
|
let arr1 = [],arr2 = [];
|
|
|
|
|
data1.forEach(item=>{
|
|
|
|
|
screenqinglang()
|
|
|
|
|
.then((res) => {
|
|
|
|
|
let data1 = res.data;
|
|
|
|
|
let arr1 = [],
|
|
|
|
|
arr2 = [];
|
|
|
|
|
data1.forEach((item) => {
|
|
|
|
|
let obj = {};
|
|
|
|
|
let objTwo = {};
|
|
|
|
|
obj.name = this.getDate(item.dateTime)
|
|
|
|
|
obj.name = this.getDate(item.dateTime);
|
|
|
|
|
obj.num = item.count2;
|
|
|
|
|
objTwo.name = this.getDate(item.dateTime)
|
|
|
|
|
objTwo.name = this.getDate(item.dateTime);
|
|
|
|
|
objTwo.num = item.count1;
|
|
|
|
|
arr2.push(obj)
|
|
|
|
|
arr1.push(objTwo)
|
|
|
|
|
arr2.push(obj);
|
|
|
|
|
arr1.push(objTwo);
|
|
|
|
|
});
|
|
|
|
|
return { arr1, arr2 };
|
|
|
|
|
})
|
|
|
|
|
return {arr1,arr2}
|
|
|
|
|
}).then((res)=>{
|
|
|
|
|
.then((res) => {
|
|
|
|
|
// console.log(res,'res')
|
|
|
|
|
this.qlzfDataStatistics[1].data.map((item) => {
|
|
|
|
|
res.arr2.map((arr) => {
|
|
|
|
|
if (item.name == arr.name) {
|
|
|
|
|
item.num = arr.num
|
|
|
|
|
item.num = arr.num;
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
this.qlzfDataStatistics[0].data.map((item) => {
|
|
|
|
|
res.arr1.map((arr) => {
|
|
|
|
|
if (item.name == arr.name) {
|
|
|
|
|
item.num = arr.num
|
|
|
|
|
item.num = arr.num;
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
// listQlzxxdsjtj({isStatus:1}).then(res=>{
|
|
|
|
|
// let data = res.rows || []
|
|
|
|
|
// let arr1 = [],arr2 = []
|
|
|
|
|
@ -448,8 +454,9 @@ export default {
|
|
|
|
|
async reportbyyearDate() {
|
|
|
|
|
// let data = await reportbyyear();
|
|
|
|
|
// let arr = [{name:'上级下发',value:''},{name:'部门转发',value:''},{name:'无效',value:''},{name:'小程序',value:''}]
|
|
|
|
|
let arr = []
|
|
|
|
|
listJbsjndfltj().then(data=>{
|
|
|
|
|
let arr = [];
|
|
|
|
|
listJbsjndfltj()
|
|
|
|
|
.then((data) => {
|
|
|
|
|
data.rows.forEach((item, index) => {
|
|
|
|
|
// arr.forEach(item2=>{
|
|
|
|
|
// if(item.type == item2.name) {
|
|
|
|
|
@ -459,15 +466,18 @@ export default {
|
|
|
|
|
let obj = {};
|
|
|
|
|
obj.value = item.count;
|
|
|
|
|
obj.name = item.type;
|
|
|
|
|
arr.push(obj)
|
|
|
|
|
})
|
|
|
|
|
arr = arr.sort((a, b) => a.value < b.value ? 1 : a.value > b.value ? -1 : 0)
|
|
|
|
|
arr.push(obj);
|
|
|
|
|
});
|
|
|
|
|
arr = arr.sort((a, b) =>
|
|
|
|
|
a.value < b.value ? 1 : a.value > b.value ? -1 : 0
|
|
|
|
|
);
|
|
|
|
|
// obj.value = value;
|
|
|
|
|
// obj.name = '上级下发';
|
|
|
|
|
}).then(res=>{
|
|
|
|
|
this.pieData = arr;
|
|
|
|
|
this.inItPie()
|
|
|
|
|
})
|
|
|
|
|
.then((res) => {
|
|
|
|
|
this.pieData = arr;
|
|
|
|
|
this.inItPie();
|
|
|
|
|
});
|
|
|
|
|
// let arr = []
|
|
|
|
|
// for(let i = 0; i < data.data.length; i++){
|
|
|
|
|
// let obj = {}
|
|
|
|
|
@ -480,39 +490,39 @@ export default {
|
|
|
|
|
getDate(date) {
|
|
|
|
|
// 2023-10-17 15:14:07 截取月份
|
|
|
|
|
// const result = /-(\d{2})-/.exec(date);
|
|
|
|
|
const result = date.split("-")
|
|
|
|
|
const result = date.split("-");
|
|
|
|
|
if (result !== null && result.length > 1) {
|
|
|
|
|
const month = result[1];
|
|
|
|
|
switch (month) {
|
|
|
|
|
case '01':
|
|
|
|
|
return '1月';
|
|
|
|
|
case '02':
|
|
|
|
|
return '2月';
|
|
|
|
|
case '03':
|
|
|
|
|
return '3月';
|
|
|
|
|
case '04':
|
|
|
|
|
return '4月';
|
|
|
|
|
case '05':
|
|
|
|
|
return '5月';
|
|
|
|
|
case '06':
|
|
|
|
|
return '6月';
|
|
|
|
|
case '07':
|
|
|
|
|
return '7月';
|
|
|
|
|
case '08':
|
|
|
|
|
return '8月';
|
|
|
|
|
case '09':
|
|
|
|
|
return '9月';
|
|
|
|
|
case '10':
|
|
|
|
|
return '10月';
|
|
|
|
|
case '11':
|
|
|
|
|
return '11月';
|
|
|
|
|
case '12':
|
|
|
|
|
return '12月';
|
|
|
|
|
case "01":
|
|
|
|
|
return "1月";
|
|
|
|
|
case "02":
|
|
|
|
|
return "2月";
|
|
|
|
|
case "03":
|
|
|
|
|
return "3月";
|
|
|
|
|
case "04":
|
|
|
|
|
return "4月";
|
|
|
|
|
case "05":
|
|
|
|
|
return "5月";
|
|
|
|
|
case "06":
|
|
|
|
|
return "6月";
|
|
|
|
|
case "07":
|
|
|
|
|
return "7月";
|
|
|
|
|
case "08":
|
|
|
|
|
return "8月";
|
|
|
|
|
case "09":
|
|
|
|
|
return "9月";
|
|
|
|
|
case "10":
|
|
|
|
|
return "10月";
|
|
|
|
|
case "11":
|
|
|
|
|
return "11月";
|
|
|
|
|
case "12":
|
|
|
|
|
return "12月";
|
|
|
|
|
default:
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
console.log('没有找到月份');
|
|
|
|
|
console.log("没有找到月份");
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 计算时间
|
|
|
|
|
@ -548,51 +558,51 @@ export default {
|
|
|
|
|
// },
|
|
|
|
|
// 饼图
|
|
|
|
|
inItPie() {
|
|
|
|
|
const chartDom = document.getElementById('pie')
|
|
|
|
|
const myChart = this.$echarts.init(chartDom)
|
|
|
|
|
const chartDom = document.getElementById("pie");
|
|
|
|
|
const myChart = this.$echarts.init(chartDom);
|
|
|
|
|
const optionSecond = {
|
|
|
|
|
tooltip: {
|
|
|
|
|
trigger: 'item',
|
|
|
|
|
formatter: '{a} <br/>{b} : {c} ({d}%)'
|
|
|
|
|
trigger: "item",
|
|
|
|
|
formatter: "{a} <br/>{b} : {c} ({d}%)",
|
|
|
|
|
},
|
|
|
|
|
emphasis: {
|
|
|
|
|
show: true,
|
|
|
|
|
formatter: '{fz41|{a}\n{az24|{b}个}',
|
|
|
|
|
formatter: "{fz41|{a}\n{az24|{b}个}",
|
|
|
|
|
textStyle: {
|
|
|
|
|
rich: {
|
|
|
|
|
fz41: {
|
|
|
|
|
fontSize: 41,
|
|
|
|
|
padding: [0, 5, 0, 0]
|
|
|
|
|
padding: [0, 5, 0, 0],
|
|
|
|
|
},
|
|
|
|
|
fz24: {
|
|
|
|
|
fontSize: 24
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
fontSize: 24,
|
|
|
|
|
},
|
|
|
|
|
color: ['#6bd3ff', '#2590fd', '#f6ff00', '#ffd616'],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
color: ["#6bd3ff", "#2590fd", "#f6ff00", "#ffd616"],
|
|
|
|
|
legend: {
|
|
|
|
|
orient: 'vertical',
|
|
|
|
|
icon: 'circle',
|
|
|
|
|
left: '55%',
|
|
|
|
|
top: '10%',
|
|
|
|
|
orient: "vertical",
|
|
|
|
|
icon: "circle",
|
|
|
|
|
left: "55%",
|
|
|
|
|
top: "10%",
|
|
|
|
|
itemGap: 50,
|
|
|
|
|
padding: 5,
|
|
|
|
|
formatter: (name) => {
|
|
|
|
|
const data = this.pieData
|
|
|
|
|
let target
|
|
|
|
|
const data = this.pieData;
|
|
|
|
|
let target;
|
|
|
|
|
data.forEach((v) => {
|
|
|
|
|
if (v.name === name) {
|
|
|
|
|
target = v.value + '件'
|
|
|
|
|
target = v.value + "件";
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
const arr = [
|
|
|
|
|
`{a|${name}}{b|${String(target).replace(
|
|
|
|
|
/(\d)(?=(\d{3})+$)/g,
|
|
|
|
|
'$1,'
|
|
|
|
|
)}}`
|
|
|
|
|
]
|
|
|
|
|
return arr.join('\n')
|
|
|
|
|
"$1,"
|
|
|
|
|
)}}`,
|
|
|
|
|
];
|
|
|
|
|
return arr.join("\n");
|
|
|
|
|
},
|
|
|
|
|
textStyle: {
|
|
|
|
|
rich: {
|
|
|
|
|
@ -600,96 +610,96 @@ export default {
|
|
|
|
|
width: 180,
|
|
|
|
|
fontSize: 28,
|
|
|
|
|
// fontWeight: 'bold',
|
|
|
|
|
color: '#ffffff'
|
|
|
|
|
color: "#ffffff",
|
|
|
|
|
},
|
|
|
|
|
b: {
|
|
|
|
|
fontSize: 28,
|
|
|
|
|
color: 'rgba(251,232,79)',
|
|
|
|
|
color: "rgba(251,232,79)",
|
|
|
|
|
backgroundColor: {
|
|
|
|
|
image: image
|
|
|
|
|
image: image,
|
|
|
|
|
},
|
|
|
|
|
align: "center",
|
|
|
|
|
},
|
|
|
|
|
align: 'center'
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
fontSize: 18,
|
|
|
|
|
color: 'rgba(255, 255, 255, .5)'
|
|
|
|
|
}
|
|
|
|
|
color: "rgba(255, 255, 255, .5)",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
name: '举报事件年度分类统计',
|
|
|
|
|
type: 'pie',
|
|
|
|
|
radius: ['55%', '78%'],
|
|
|
|
|
name: "举报事件年度分类统计",
|
|
|
|
|
type: "pie",
|
|
|
|
|
radius: ["55%", "78%"],
|
|
|
|
|
avoidLabelOverlap: false,
|
|
|
|
|
center: ['24%', '48%'],
|
|
|
|
|
center: ["24%", "48%"],
|
|
|
|
|
label: {
|
|
|
|
|
show: false,
|
|
|
|
|
position: 'center',
|
|
|
|
|
position: "center",
|
|
|
|
|
formatter: (params) => {
|
|
|
|
|
return `{a| ${params.name}} \n {b|${params.value}}`
|
|
|
|
|
return `{a| ${params.name}} \n {b|${params.value}}`;
|
|
|
|
|
},
|
|
|
|
|
rich: {
|
|
|
|
|
a: {
|
|
|
|
|
fontFamily: 'SourceHanSansCN-Regular',
|
|
|
|
|
color: '#ffffff',
|
|
|
|
|
fontSize: 28
|
|
|
|
|
fontFamily: "SourceHanSansCN-Regular",
|
|
|
|
|
color: "#ffffff",
|
|
|
|
|
fontSize: 28,
|
|
|
|
|
},
|
|
|
|
|
b: {
|
|
|
|
|
fontFamily: 'DIN-Medium',
|
|
|
|
|
color: '#6ddefb',
|
|
|
|
|
fontFamily: "DIN-Medium",
|
|
|
|
|
color: "#6ddefb",
|
|
|
|
|
fontSize: 32,
|
|
|
|
|
lineHeight: 50
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
lineHeight: 50,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
emphasis: {
|
|
|
|
|
label: {
|
|
|
|
|
show: true,
|
|
|
|
|
fontSize: '25',
|
|
|
|
|
fontWeight: 'bold'
|
|
|
|
|
}
|
|
|
|
|
fontSize: "25",
|
|
|
|
|
fontWeight: "bold",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
labelLine: {
|
|
|
|
|
show: false
|
|
|
|
|
show: false,
|
|
|
|
|
},
|
|
|
|
|
data: this.pieData
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
myChart.setOption(optionSecond, true)
|
|
|
|
|
echartsJump(myChart, optionSecond)
|
|
|
|
|
data: this.pieData,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
};
|
|
|
|
|
myChart.setOption(optionSecond, true);
|
|
|
|
|
echartsJump(myChart, optionSecond);
|
|
|
|
|
},
|
|
|
|
|
// 定时器旋转+字体颜色变
|
|
|
|
|
reportingProcessTimer() {
|
|
|
|
|
let index = 0
|
|
|
|
|
let index = 0;
|
|
|
|
|
this.reportingTimer = setInterval(() => {
|
|
|
|
|
this.number += 60
|
|
|
|
|
const content = document.getElementById('processRotate')
|
|
|
|
|
content.style.transform = 'rotateZ(' + this.number + 'deg)'
|
|
|
|
|
this.number += 60;
|
|
|
|
|
const content = document.getElementById("processRotate");
|
|
|
|
|
content.style.transform = "rotateZ(" + this.number + "deg)";
|
|
|
|
|
if (index === 5) {
|
|
|
|
|
document.getElementsByClassName(
|
|
|
|
|
'processIcon'
|
|
|
|
|
)[0].children[0].children[1].style.color = '#fbe84f'
|
|
|
|
|
"processIcon"
|
|
|
|
|
)[0].children[0].children[1].style.color = "#fbe84f";
|
|
|
|
|
document.getElementsByClassName(
|
|
|
|
|
'processIcon'
|
|
|
|
|
)[0].children[5].children[1].style.color = '#ffffff'
|
|
|
|
|
"processIcon"
|
|
|
|
|
)[0].children[5].children[1].style.color = "#ffffff";
|
|
|
|
|
} else {
|
|
|
|
|
document.getElementsByClassName('processIcon')[0].children[
|
|
|
|
|
document.getElementsByClassName("processIcon")[0].children[
|
|
|
|
|
index + 1
|
|
|
|
|
].children[1].style.color = '#fbe84f'
|
|
|
|
|
document.getElementsByClassName('processIcon')[0].children[
|
|
|
|
|
].children[1].style.color = "#fbe84f";
|
|
|
|
|
document.getElementsByClassName("processIcon")[0].children[
|
|
|
|
|
index
|
|
|
|
|
].children[1].style.color = '#ffffff'
|
|
|
|
|
].children[1].style.color = "#ffffff";
|
|
|
|
|
}
|
|
|
|
|
if (index > 4) {
|
|
|
|
|
index = 0
|
|
|
|
|
index = 0;
|
|
|
|
|
} else {
|
|
|
|
|
index++
|
|
|
|
|
}
|
|
|
|
|
}, 4000)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
index++;
|
|
|
|
|
}
|
|
|
|
|
}, 4000);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
@ -1051,6 +1061,7 @@ export default {
|
|
|
|
|
margin-left: 61px;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
text-align: justify;
|
|
|
|
|
text-indent: 2em;
|
|
|
|
|
width: 736px;
|
|
|
|
|
padding-right: 23px;
|
|
|
|
|
height: 528px;
|
|
|
|
|
|
