ZheJiangNingBo
/
pingAnQiYeWeb
7
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

update

Browse Source
master
loveflow 11 months ago
parent 0487f16885
commit 4e054d4831
18 changed files with 1087 additions and 799 deletions
Show Stats Download Patch File Download Diff File

BIN
src/assets/images/risk/body.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 34 KiB

BIN
src/assets/images/risk/head.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
src/assets/images/risk/icon.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
src/assets/images/risk/tab.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 786 B

9
src/loveflow/components/echart/bar/one.vue
Unescape View File

@ -28,7 +28,7 @@ export default {
show: false, show: false,
}, },
grid: { grid: {
top: this.chartObj.gridTop || "20%", top: this.chartObj.gridTop || "15%",
bottom: this.chartObj.gridBtm || "10%", bottom: this.chartObj.gridBtm || "10%",
left: this.chartObj.gridLeft || "6%", left: this.chartObj.gridLeft || "6%",
right: "5%", right: "5%",
@ -66,6 +66,13 @@ export default {
color: "#6C8097", color: "#6C8097",
fontSize: 12, fontSize: 12,
interval: 0, interval: 0,
formatter: function (value) {
if (value >= 1000) {
return (value / 1000).toFixed(1) + "k";
} else {
return value;
}
},
}, },
}, },
series: [ series: [

17
src/loveflow/components/echart/bar/two.vue
Unescape View File

@ -19,6 +19,7 @@ export default {
}; };
}, },
mounted() { mounted() {
console.log("。。。。。:", this.chartObj);
this.setOption(); this.setOption();
}, },
methods: { methods: {
@ -67,6 +68,13 @@ export default {
color: "#6C8097", color: "#6C8097",
fontSize: 12, fontSize: 12,
interval: 0, interval: 0,
formatter: function (value) {
if (value >= 1000) {
return (value / 1000).toFixed(1) + "k";
} else {
return value;
}
},
}, },
}, },
series: [ series: [
@ -119,5 +127,14 @@ export default {
}; };
}, },
}, },
watch: {
chartObj: {
handler(newval) {
this.setOption();
},
deep: true,
// immediate: true,
},
},
}; };
</script> </script>

7
src/loveflow/components/echart/line/one.vue
Unescape View File

@ -113,6 +113,13 @@ export default {
color: "#6C8097", color: "#6C8097",
fontSize: 12, fontSize: 12,
interval: 0, interval: 0,
formatter: function (value) {
if (value >= 1000) {
return (value / 1000).toFixed(1) + "k";
} else {
return value;
}
},
}, },
}, },
series: seriesArr, series: seriesArr,

7
src/loveflow/components/echart/line/three.vue
Unescape View File

@ -67,6 +67,13 @@ export default {
color: "#6C8097", color: "#6C8097",
fontSize: 12, fontSize: 12,
interval: 0, interval: 0,
formatter: function (value) {
if (value >= 1000) {
return (value / 1000).toFixed(1) + "k";
} else {
return value;
}
},
}, },
}, },
series: [ series: [

7
src/loveflow/components/echart/line/two.vue
Unescape View File

@ -68,6 +68,13 @@ export default {
color: "#6C8097", color: "#6C8097",
fontSize: 12, fontSize: 12,
interval: 0, interval: 0,
formatter: function (value) {
if (value >= 1000) {
return (value / 1000).toFixed(1) + "k";
} else {
return value;
}
},
}, },
}, },
series: [ series: [

14
src/loveflow/components/echart/radar/one.vue
Unescape View File

@ -28,7 +28,8 @@ export default {
show: false, show: false,
}, },
tooltip: { tooltip: {
show: false, show: true,
position: ["50%", "20px"],
}, },
radar: { radar: {
center: ["50%", "50%"], // 外圆的位置 center: ["50%", "50%"], // 外圆的位置
@ -80,15 +81,8 @@ export default {
}, },
data: [ data: [
{ {
value: [80, 80, 80, 70, 60, 50], value: this.chartObj.yData,
name: "男", name: this.chartObj.name,
areaStyle: {
color: "transparent",
},
},
{
value: [40, 70, 50, 60, 30, 80],
name: "女",
itemStyle: { itemStyle: {
borderColor: "rgba(245, 196, 85, 1)", borderColor: "rgba(245, 196, 85, 1)",
color: "#fff", color: "#fff",

688
src/views/enterpriseRiskIndex/abnormal.vue
Unescape View File

@ -1,40 +1,44 @@
<template> <template>
<div class="abnormalWrap"> <div class="abnormalWrap">
<div class="riskRow mb18"> <div class="leftCol">
<div class="riskCol leftCol mr18"> <div class="screenRow pb14">
<div class="riskName"> <div class="screenCol mr14">
<div class="riskIcon"></div> <colWrap title="企业风险项趋势分析图" @changeTime="tlTime">
<div class="riskNameText">企业风险项趋势分析图</div>
</div>
<div class="riskTotal"> <div class="riskTotal">
<div>{{ total.name }}</div> <div>{{ total.name }}</div>
<div class="totalText">{{ total.value }}</div> <div class="totalText">{{ total.value }}</div>
</div> </div>
<div class="chartPanel" style="height: calc(100% - 136px)"> <div class="chartPanel">
<div class="chartOpt"> <barOne :chartObj="tlObj"></barOne>
<div </div>
@click="changeTime('day')" </colWrap>
:class="{ active: curTime == 'day' }"
>
当日
</div> </div>
<div
@click="changeTime('month')"
:class="{ active: curTime == 'month' }"
>
近三月
</div> </div>
<div <div class="screenRow pb14">
@click="changeTime('year')" <div class="screenCol mr14">
:class="{ active: curTime == 'year' }" <colWrap title="流口人员管理异常" @changeTime="ttlTime">
> <lineThree :chartObj="ttlObj"></lineThree>
本年度 </colWrap>
</div> </div>
</div> </div>
<barOne :chartObj="tlObj"></barOne> <div class="screenRow pb14">
<div class="screenCol mr14">
<colWrap title="人员涉警(案)情况异常分析" @changeTime="bblTime">
<lineTwo :chartObj="bblObj"></lineTwo>
</colWrap>
</div>
</div> </div>
<div class="screenRow pb14">
<div class="screenCol mr14">
<colWrap title="运输车辆异常预警" @changeTime="blTime">
<barTwo ref="blObjRef" :chartObj="blObj"></barTwo>
</colWrap>
</div> </div>
<div class="riskCol rightCol"> </div>
</div>
<div class="rightCol">
<div class="screenRow pb14">
<div class="screenCol rightCardCol">
<div class="riskLine" v-for="(line, index) in dataList" :key="index"> <div class="riskLine" v-for="(line, index) in dataList" :key="index">
<div class="riskItem" v-for="item in line" :key="item.name"> <div class="riskItem" v-for="item in line" :key="item.name">
<div class="riskItemLeft"> <div class="riskItemLeft">
@ -50,96 +54,48 @@
</div> </div>
</div> </div>
</div> </div>
<div class="riskRow mb18"> <div class="screenRow pb14">
<div class="riskCol mr18"> <div class="screenCol mr14">
<div class="riskName"> <colWrap title="人员背景审核异常分析" @changeTime="ttmTime">
<div class="riskIcon"></div> <lineThree :chartObj="ttmObj"></lineThree>
<div class="riskNameText">流口人员管理异常</div> </colWrap>
</div> </div>
<div class="chartPanel"> <div class="screenCol">
<lineThree :chartObj="tmlObj"></lineThree> <colWrap title="重点岗位资质核查异常分析" @changeTime="ttrTime">
<lineThree :chartObj="ttmObj"></lineThree>
</colWrap>
</div> </div>
</div> </div>
<div class="riskCol mr18"> <div class="screenRow pb14">
<div class="riskName"> <div class="screenCol mr14">
<div class="riskIcon"></div> <colWrap title="装卸量差异分析" @changeTime="bbmTime">
<div class="riskNameText">人员背景审核异常分析</div> <lineTwo :chartObj="bbmObj"></lineTwo>
</colWrap>
</div> </div>
<div class="chartPanel"> <div class="screenCol">
<lineThree :chartObj="tmmObj"></lineThree> <colWrap title="运输车辆背景异常分析" @changeTime="bbrTime">
<lineTwo :chartObj="bblObj"></lineTwo>
</colWrap>
</div> </div>
</div> </div>
<div class="riskCol"> <div class="screenRow pb14">
<div class="riskName"> <div class="screenCol mr14">
<div class="riskIcon"></div> <colWrap title="驾驶员押运员资质异常分析" @changeTime="bmTime">
<div class="riskNameText">重点岗位资质核查异常分析</div> <barTwo ref="bmObjRef" :chartObj="bmObj"></barTwo>
</colWrap>
</div> </div>
<div class="chartPanel"> <div class="screenCol">
<lineThree :chartObj="tmrObj"></lineThree> <colWrap title="单位检查情况异常分析" @changeTime="brTime">
</div> <barTwo ref="brObjRef" :chartObj="brObj"></barTwo>
</div> </colWrap>
</div>
<div class="riskRow mb18">
<div class="riskCol mr18">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">人员涉警(案)情况异常分析</div>
</div>
<div class="chartPanel">
<lineTwo :chartObj="mtlObj"></lineTwo>
</div>
</div>
<div class="riskCol mr18">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">装卸量差异分析</div>
</div>
<div class="chartPanel">
<lineTwo :chartObj="mtmObj"></lineTwo>
</div>
</div>
<div class="riskCol">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">运输车辆背景异常分析</div>
</div>
<div class="chartPanel">
<lineTwo :chartObj="mtrObj"></lineTwo>
</div>
</div>
</div>
<div class="riskRow mb18">
<div class="riskCol mr18">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">运输车辆异常预警</div>
</div>
<div class="chartPanel">
<barTwo :chartObj="mlObj"></barTwo>
</div>
</div>
<div class="riskCol mr18">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">驾驶员押运员资质异常分析</div>
</div>
<div class="chartPanel">
<barTwo :chartObj="mmObj"></barTwo>
</div>
</div>
<div class="riskCol">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">单位检查情况异常分析</div>
</div>
<div class="chartPanel">
<barTwo :chartObj="mrObj"></barTwo>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import colWrap from "./components/col.vue";
import barOne from "@/loveflow/components/echart/bar/one.vue"; import barOne from "@/loveflow/components/echart/bar/one.vue";
import barTwo from "@/loveflow/components/echart/bar/two.vue"; import barTwo from "@/loveflow/components/echart/bar/two.vue";
import lineTwo from "@/loveflow/components/echart/line/two.vue"; import lineTwo from "@/loveflow/components/echart/line/two.vue";
@ -159,12 +115,11 @@ import {
} from "@/api/enterpriseRiskIndex/abnormal/index.js"; } from "@/api/enterpriseRiskIndex/abnormal/index.js";
export default { export default {
components: { barOne, barTwo, lineTwo, lineThree }, components: { colWrap, barOne, barTwo, lineTwo, lineThree },
data() { data() {
return { return {
curTime: "day",
total: { total: {
name: "今日企业风险项量", name: "企业风险总量",
value: 0, value: 0,
}, },
tlObj: { tlObj: {
@ -172,9 +127,9 @@ export default {
xData: [], xData: [],
yData: [], yData: [],
list: [], list: [],
name: "风险标签排行", name: "企业风险项趋势",
}, },
tmlObj: { ttlObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "流口人员管理异常", name: "流口人员管理异常",
@ -184,8 +139,9 @@ export default {
"rgba(30,147,255,0.3)", "rgba(30,147,255,0.3)",
"#1E93FF", "#1E93FF",
], ],
list: [],
}, },
tmmObj: { ttmObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "人员背景审核异常分析", name: "人员背景审核异常分析",
@ -195,8 +151,9 @@ export default {
"rgba(30,147,255,0.3)", "rgba(30,147,255,0.3)",
"#1E93FF", "#1E93FF",
], ],
list: [],
}, },
tmrObj: { ttrObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "重点岗位资质核查异常分析", name: "重点岗位资质核查异常分析",
@ -206,9 +163,10 @@ export default {
"rgba(30,147,255,0.3)", "rgba(30,147,255,0.3)",
"#1E93FF", "#1E93FF",
], ],
list: [],
}, },
mtlObj: { bblObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "人员涉警(案)情况异常分析", name: "人员涉警(案)情况异常分析",
@ -217,8 +175,9 @@ export default {
"rgba(255,61,61,0.8)", "rgba(255,61,61,0.8)",
"rgba(255,61,61,0)", "rgba(255,61,61,0)",
], ],
list: [],
}, },
mtmObj: { bbmObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "装卸量差异分析", name: "装卸量差异分析",
@ -227,8 +186,9 @@ export default {
"rgba(255,61,61,0.8)", "rgba(255,61,61,0.8)",
"rgba(255,61,61,0)", "rgba(255,61,61,0)",
], ],
list: [],
}, },
mtrObj: { bbrObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "运输车辆背景异常分析", name: "运输车辆背景异常分析",
@ -237,21 +197,25 @@ export default {
"rgba(255,61,61,0.8)", "rgba(255,61,61,0.8)",
"rgba(255,61,61,0)", "rgba(255,61,61,0)",
], ],
list: [],
}, },
mlObj: { blObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "运输车辆异常预警", name: "运输车辆异常预警",
list: [],
}, },
mmObj: { bmObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "驾驶员押运员资质异常分析", name: "驾驶员押运员资质异常分析",
list: [],
}, },
mrObj: { brObj: {
xData: [], xData: [],
yData: [], yData: [],
name: "单位检查情况异常分析", name: "单位检查情况异常分析",
list: [],
}, },
dataList: [ dataList: [
[ [
@ -312,27 +276,93 @@ export default {
this.getData(); this.getData();
}, },
methods: { methods: {
changeTime(val) { getData() {
this.curTime = val; enterpriseComprehensiveRisk().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.tlObj.list = data;
this.tlTime("day");
}
});
abnormalFloatingPopulation().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.ttlObj.list = data;
this.ttlTime("day");
}
});
personnelBackground().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.ttmObj.list = data;
this.ttmTime("day");
}
});
keyPosition().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.ttrObj.list = data;
this.ttrTime("day");
}
});
policeInvolvement().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.bblObj.list = data;
this.bblTime("day");
}
});
zXDifference().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.bbmObj.list = data;
this.bbmTime("day");
}
});
transportVehicleBj().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.bbrObj.list = data;
this.bbrTime("day");
}
});
transportVehicleAnomaly().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.blObj.list = data;
this.blTime("day");
}
});
transportVehicle().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.bmObj.list = data;
this.bmTime("day");
}
});
unitInspection().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.brObj.list = data;
this.brTime("day");
}
});
},
tlTime(val) {
this.tlObj.yData = []; this.tlObj.yData = [];
this.tlObj.xData = []; this.tlObj.xData = [];
let list = []; let list = [];
if (val == "day") { if (val == "day") {
this.total.name = "今日企业风险项量";
list = this.tlObj.list[0]; list = this.tlObj.list[0];
} }
if (val == "month") { if (val == "month") {
this.total.name = "近三月企业风险项量";
list = this.tlObj.list[1]; list = this.tlObj.list[1];
} }
if (val == "year") { if (val == "year") {
this.total.name = "本年度企业风险项量";
list = this.tlObj.list[2]; list = this.tlObj.list[2];
} }
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
if (list[i]["riskName"] == "企业风险项量") { if (list[i]["riskName"] == "企业风险项量") {
this.total.value = list[i]["score"]; this.total.value = list[i]["score"];
@ -344,124 +374,268 @@ export default {
} }
} }
}, },
ttlTime(val) {
getData() { this.ttlObj.yData = [];
enterpriseComprehensiveRisk().then((res) => { this.ttlObj.xData = [];
if (res.code == 200) { let list = [];
let data = res.data || []; let index = 0;
this.tlObj.list = data; if (val == "day") {
this.changeTime("day"); index = 0;
} }
}); if (val == "week") {
abnormalFloatingPopulation().then((res) => { index = 1;
if (res.code == 200) { }
let list = res.data || []; if (val == "month") {
index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.ttlObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.tmlObj.xData.push(list[i]["month"] + "月"); this.ttlObj.xData.push(list[i]["month"]);
this.tmlObj.yData.push(list[i]["score"]); this.ttlObj.yData.push(list[i]["score"]);
} }
this.dataList[0][0]["value"] = total; this.dataList[0][0]["value"] = total;
},
ttmTime(val) {
this.ttmObj.yData = [];
this.ttmObj.xData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
} }
}); if (val == "week") {
personnelBackground().then((res) => { index = 1;
if (res.code == 200) { }
let list = res.data || []; if (val == "month") {
index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.ttmObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.tmmObj.xData.push(list[i]["month"] + "月"); this.ttmObj.xData.push(list[i]["month"]);
this.tmmObj.yData.push(list[i]["score"]); this.ttmObj.yData.push(list[i]["score"]);
} }
this.dataList[0][1]["value"] = total; this.dataList[0][1]["value"] = total;
},
ttrTime(val) {
this.ttrObj.yData = [];
this.ttrObj.xData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
} }
}); if (val == "week") {
keyPosition().then((res) => { index = 1;
if (res.code == 200) { }
let list = res.data || []; if (val == "month") {
index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.ttrObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.tmrObj.xData.push(list[i]["month"] + "月"); this.ttrObj.xData.push(list[i]["month"]);
this.tmrObj.yData.push(list[i]["score"]); this.ttrObj.yData.push(list[i]["score"]);
} }
this.dataList[0][2]["value"] = total; this.dataList[0][2]["value"] = total;
},
bblTime(val) {
this.bblObj.yData = [];
this.bblObj.xData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
} }
}); if (val == "week") {
policeInvolvement().then((res) => { index = 1;
if (res.code == 200) { }
let list = res.data || []; if (val == "month") {
index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.bblObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.mtlObj.xData.push(list[i]["month"] + "月"); this.bblObj.xData.push(list[i]["month"]);
this.mtlObj.yData.push(list[i]["score"]); this.bblObj.yData.push(list[i]["score"]);
} }
this.dataList[1][0]["value"] = total; this.dataList[1][0]["value"] = total;
},
bbmTime(val) {
this.bbmObj.yData = [];
this.bbmObj.xData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
} }
}); if (val == "week") {
zXDifference().then((res) => { index = 1;
if (res.code == 200) { }
let list = res.data || []; if (val == "month") {
index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.bbmObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.mtmObj.xData.push(list[i]["month"] + "月"); this.bbmObj.xData.push(list[i]["month"]);
this.mtmObj.yData.push(list[i]["score"]); this.bbmObj.yData.push(list[i]["score"]);
} }
this.dataList[1][1]["value"] = total; this.dataList[1][1]["value"] = total;
},
bbrTime(val) {
this.bblObj.yData = [];
this.bblObj.xData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
} }
}); if (val == "week") {
transportVehicleBj().then((res) => { index = 1;
if (res.code == 200) { }
let list = res.data || []; if (val == "month") {
index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.bblObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.mtrObj.xData.push(list[i]["month"] + "月"); this.bblObj.xData.push(list[i]["month"]);
this.mtrObj.yData.push(list[i]["score"]); this.bblObj.yData.push(list[i]["score"]);
} }
this.dataList[1][2]["value"] = total; this.dataList[1][2]["value"] = total;
},
blTime(val) {
this.blObj.yData = [];
this.blObj.xData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
} }
}); if (val == "week") {
index = 1;
transportVehicleAnomaly().then((res) => { }
if (res.code == 200) { if (val == "month") {
let list = res.data || []; index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.blObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.mlObj.xData.push(list[i]["month"] + "月"); this.blObj.xData.push(list[i]["month"]);
this.mlObj.yData.push(list[i]["score"]); this.blObj.yData.push(list[i]["score"]);
} }
this.dataList[2][0]["value"] = total; this.dataList[2][0]["value"] = total;
},
bmTime(val) {
this.bmObj.yData = [];
this.bmObj.xData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
} }
}); if (val == "week") {
transportVehicle().then((res) => { index = 1;
if (res.code == 200) { }
let list = res.data || []; if (val == "month") {
index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.bmObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.mmObj.xData.push(list[i]["month"] + "月"); this.bmObj.xData.push(list[i]["month"]);
this.mmObj.yData.push(list[i]["score"]); this.bmObj.yData.push(list[i]["score"]);
} }
this.dataList[2][1]["value"] = total; this.dataList[2][1]["value"] = total;
},
brTime(val) {
this.brObj.yData = [];
this.brObj.xData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
} }
}); if (val == "week") {
unitInspection().then((res) => { index = 1;
if (res.code == 200) { }
let list = res.data || []; if (val == "month") {
index = 2;
}
if (val == "season") {
index = 3;
}
if (val == "year") {
index = 4;
}
list = this.brObj.list;
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
total = total + list[i]["score"]; total = total + list[i]["score"];
this.mrObj.xData.push(list[i]["month"] + "月"); this.brObj.xData.push(list[i]["month"]);
this.mrObj.yData.push(list[i]["score"]); this.brObj.yData.push(list[i]["score"]);
} }
this.dataList[2][2]["value"] = total; this.dataList[2][2]["value"] = total;
}
});
}, },
}, },
}; };
@ -469,46 +643,21 @@ export default {
<style lang="less"> <style lang="less">
.abnormalWrap { .abnormalWrap {
height: 100%; height: 100%;
padding: 18px; padding: 14px;
box-sizing: border-box; box-sizing: border-box;
display: flex;
flex-direction: column;
overflow-y: scroll; overflow-y: scroll;
overflow-x: hidden; overflow-x: hidden;
display: flex;
&::-webkit-scrollbar { &::-webkit-scrollbar {
display: none; display: none;
} }
.riskRow {
flex: 1;
display: flex;
.riskCol {
position: relative;
padding-left: 8px;
height: 456px;
flex: 1;
background: url("~@/assets/images/screen/line.png") no-repeat center
center;
background-size: 100% 100%;
.riskName { .leftCol {
height: 40px; width: 34%;
display: flex;
margin-top: 6px;
color: #d9e7ff;
.riskIcon {
width: 24px;
height: 24px;
background: url("~@/assets/images/screen/riskIcon.png") no-repeat
center center;
background-size: 100% 100%;
}
}
.riskTotal { .riskTotal {
margin-top: 40px;
margin-left: 2%; margin-left: 2%;
width: 93%; width: 96%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -528,63 +677,20 @@ export default {
text-shadow: 0px 0px 9px #159aff; text-shadow: 0px 0px 9px #159aff;
} }
} }
.chartOpt {
position: absolute;
z-index: 12;
right: 5%;
top: 46px;
display: flex;
div {
display: flex;
justify-content: center;
align-items: center;
width: 68px;
height: 30px;
color: #8fabbf;
font-size: 14px;
background: linear-gradient(
0deg,
rgba(122, 163, 204, 0.3) 0%,
rgba(122, 163, 204, 0) 100%
);
&:hover {
cursor: pointer;
background: linear-gradient(
0deg,
#3cc7b0 0%,
rgba(51, 204, 204, 0) 100%
);
}
&.active {
color: #ffffff;
border-bottom: solid 2px #33cccc;
background: linear-gradient(
0deg,
rgba(60, 199, 176, 0.3) 0%,
rgba(51, 204, 204, 0) 100%
);
}
}
}
.chartPanel { .chartPanel {
height: calc(100% - 50px); height: calc(100% - 50px);
} }
} }
.leftCol {
flex: auto;
width: calc(33.33% - 18px);
}
.rightCol { .rightCol {
padding: 24px 4px 8px 24px; width: 66%;
flex: auto; }
width: calc(66.66% - 12px);
background: url("~@/assets/images/screen/right.png") no-repeat center
center;
background-size: 100% 100%;
.screenRow {
display: flex; display: flex;
flex-direction: column; .screenCol {
justify-content: space-evenly; flex: 1;
height: 456px;
.riskLine { .riskLine {
display: flex; display: flex;
@ -631,6 +737,54 @@ export default {
} }
} }
} }
.rightCardCol {
padding: 24px 4px 8px 24px;
flex: auto;
width: calc(66.66% - 12px);
background: url("~@/assets/images/screen/right.png") no-repeat center
center;
background-size: 100% 100%;
display: flex;
flex-direction: column;
justify-content: space-evenly;
.cardTimeOpt {
display: flex;
.timeBtn {
font-size: vw(14);
padding: 0 12px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
color: #8fabbf;
background: linear-gradient(
0deg,
rgba(122, 163, 204, 0.3) 0%,
rgba(122, 163, 204, 0) 100%
);
&:hover {
cursor: pointer;
color: #ffffff;
background: linear-gradient(
0deg,
#3cc7b0 0%,
rgba(51, 204, 204, 0) 100%
);
}
&.active {
color: #ffffff;
border-bottom: solid 2px #33cccc;
background: linear-gradient(
0deg,
rgba(60, 199, 176, 0.3) 0%,
rgba(51, 204, 204, 0) 100%
);
}
}
}
}
} }
} }
</style> </style>

333
src/views/enterpriseRiskIndex/analysis.vue
Unescape View File

@ -1,86 +1,43 @@
<template> <template>
<div class="analysisWrap"> <div class="analysisWrap">
<div class="riskRow mb14"> <div class="screenRow pb14">
<div class="riskCol leftCol mr14"> <div class="screenCol mr14">
<div class="riskName"> <colWrap title="风险监测项评分排行" @changeTime="tlTime">
<div class="riskIcon"></div>
<div class="riskNameText">风险监测项评分排行</div>
</div>
<div class="chartPanel">
<div class="chartOpt">
<div
@click="changeTime('day')"
:class="{ active: curTime == 'day' }"
>
当日
</div>
<div
@click="changeTime('month')"
:class="{ active: curTime == 'month' }"
>
近三月
</div>
<div
@click="changeTime('year')"
:class="{ active: curTime == 'year' }"
>
本年度
</div>
</div>
<barOne :chartObj="tlObj"></barOne> <barOne :chartObj="tlObj"></barOne>
</colWrap>
</div> </div>
<div class="screenCol mr14">
<colWrap title="频繁变化风险监测信息变化趋势图" @changeTime="tmTime">
<lineOne :chartObj="tmObj"></lineOne
></colWrap>
</div> </div>
<div class="riskCol midCol mr14"> <div class="screenCol">
<div class="riskName"> <colWrap title="异常风险项得分占比" @changeTime="trTime">
<div class="riskIcon"></div>
<div class="riskNameText">频繁变化风险监测信息近一年变化趋势图</div>
</div>
<div class="chartPanel">
<lineOne :chartObj="tmObj"></lineOne>
</div>
</div>
<div class="riskCol rightCol">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">异常风险项得分占比</div>
</div>
<div class="chartPanel flex-center">
<dPie :chartObj="trObj"></dPie> <dPie :chartObj="trObj"></dPie>
</colWrap>
</div> </div>
</div> </div>
</div> <div class="screenRow">
<div class="riskRow"> <div class="screenCol mr14">
<div class="riskCol leftCol mr14"> <colWrap title="风险标签排行" @changeTime="blTime">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">风险标签排行</div>
</div>
<div class="chartPanel">
<barOne :chartObj="blObj"></barOne> <barOne :chartObj="blObj"></barOne>
</colWrap>
</div> </div>
</div> <div class="screenCol mr14">
<div class="riskCol midCol mr14"> <colWrap title="风险总量分析变化趋势图" @changeTime="bmTime">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">风险总量分析变化趋势图</div>
</div>
<div class="chartPanel">
<lineOne :chartObj="bmObj"></lineOne> <lineOne :chartObj="bmObj"></lineOne>
</colWrap>
</div> </div>
</div> <div class="screenCol">
<div class="riskCol rightCol canvasDefault"> <colWrap title="异常风险得分对比" @changeTime="brTime">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">风险标签排行</div>
</div>
<div class="chartPanel">
<barThree :chartObj="brObj"></barThree> <barThree :chartObj="brObj"></barThree>
</div> </colWrap>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import colWrap from "./components/col.vue";
import barOne from "@/loveflow/components/echart/bar/one.vue"; import barOne from "@/loveflow/components/echart/bar/one.vue";
import barThree from "@/loveflow/components/echart/bar/three.vue"; import barThree from "@/loveflow/components/echart/bar/three.vue";
import dPie from "@/loveflow/components/echart/pie/dPie.vue"; import dPie from "@/loveflow/components/echart/pie/dPie.vue";
@ -98,7 +55,7 @@ import {
} from "@/api/enterpriseRiskIndex/analysis/index.js"; } from "@/api/enterpriseRiskIndex/analysis/index.js";
export default { export default {
components: { barOne, lineOne, barThree, dPie }, components: { colWrap, barOne, lineOne, barThree, dPie },
data() { data() {
return { return {
curTime: "", curTime: "",
@ -119,6 +76,7 @@ export default {
["#48EEBD", "rgba(72,238,189,0.1)", "rgba(72,238,189,0.1)"], ["#48EEBD", "rgba(72,238,189,0.1)", "rgba(72,238,189,0.1)"],
["#FFD16A", "rgba(255,209,106,0.1)", "rgba(255,209,106,0.1)"], ["#FFD16A", "rgba(255,209,106,0.1)", "rgba(255,209,106,0.1)"],
], ],
list: [],
}, },
blObj: { blObj: {
xData: [ xData: [
@ -133,6 +91,7 @@ export default {
], ],
yData: [212, 211, 313, 149, 195, 11, 164, 172], yData: [212, 211, 313, 149, 195, 11, 164, 172],
name: "风险标签排行", name: "风险标签排行",
list: [],
}, },
bmObj: { bmObj: {
xData: [], xData: [],
@ -145,6 +104,7 @@ export default {
["#FFD16A", "rgba(255,209,106,0.1)", "rgba(255,209,106,0.1)"], ["#FFD16A", "rgba(255,209,106,0.1)", "rgba(255,209,106,0.1)"],
["#FF3B3B", "rgba(255,59,59,0.1)", "rgba(255,59,59,0.1)"], ["#FF3B3B", "rgba(255,59,59,0.1)", "rgba(255,59,59,0.1)"],
], ],
list: [],
}, },
brObj: { brObj: {
data: [ data: [
@ -166,6 +126,7 @@ export default {
}, },
], ],
name: "风险标签排行", name: "风险标签排行",
list: [],
}, },
}; };
}, },
@ -173,7 +134,40 @@ export default {
this.getData(); this.getData();
}, },
methods: { methods: {
changeTime(val) { //注释看api文件接口
getData() {
riskDetection().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.tlObj.list = data;
this.tlTime("day");
}
});
riskLabelRanking().then((res) => {});
frequentChangeRisk().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.tmObj.list = data;
this.tmTime("day");
}
});
aggregateRiskAnalysis().then((res) => {
if (res.code == 200) {
let data = res.data || [];
this.bmObj.list = data;
this.bmTime("day");
}
});
riskItemScore().then((res) => {});
abnormalRiskScore().then((res) => {});
},
tlTime(val) {
this.curTime = val; this.curTime = val;
if (this.tlObj.list.length < 2) { if (this.tlObj.list.length < 2) {
return; return;
@ -182,170 +176,123 @@ export default {
this.tlObj.xData = []; this.tlObj.xData = [];
let list = []; let list = [];
let index = 0;
if (val == "day") { if (val == "day") {
list = this.tlObj.list[0]; index = 0;
}
if (val == "week") {
index = 0;
} }
if (val == "month") { if (val == "month") {
list = this.tlObj.list[1]; index = 1;
}
if (val == "season") {
index = 1;
} }
if (val == "year") { if (val == "year") {
list = this.tlObj.list[2]; index = 2;
} }
list = this.tlObj.list[index];
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
this.tlObj.yData.push(list[i]["score"]); this.tlObj.yData.push(list[i]["score"]);
this.tlObj.xData.push(list[i]["riskName"]); this.tlObj.xData.push(list[i]["riskName"]);
} }
}, },
tmTime(val) {
this.tmObj.yData = [];
this.tmObj.xData = [];
this.tmObj.legend = [];
//注释看api文件接口 let list = [];
getData() { let index = 0;
riskDetection().then((res) => { if (val == "day") {
if (res.code == 200) { index = 0;
let data = res.data || [];
this.tlObj.list = data;
this.changeTime("day");
}
});
riskLabelRanking().then((res) => {});
frequentChangeRisk().then((res) => {
if (res.code == 200) {
let data = res.data || [];
for (let i = 0; i < data.length; i++) {
if (!this.tmObj.xData.includes(data[i]["month"] + "月")) {
this.tmObj.xData.push(data[i]["month"] + "月");
} }
if (!this.tmObj.legend.includes(data[i]["riskName"])) { if (val == "week") {
this.tmObj.legend.push(data[i]["riskName"]); index = 0;
} }
if (val == "month") {
index = 1;
} }
let temp = groupByReduce(data, "riskName", "score"); if (val == "season") {
for (let i = 0; i < this.tmObj.legend.length; i++) { index = 1;
this.tmObj.yData.push(temp[this.tmObj.legend[i]]);
} }
if (val == "year") {
index = 2;
} }
}); list = this.tmObj.list;
aggregateRiskAnalysis().then((res) => { for (let i = 0; i < list.length; i++) {
if (res.code == 200) { if (!this.tmObj.xData.includes(list[i]["month"] + "月")) {
let data = res.data || []; this.tmObj.xData.push(list[i]["month"] + "月");
console.log(data);
for (let i = 0; i < data.length; i++) {
if (!this.bmObj.xData.includes(data[i]["month"] + "月")) {
this.bmObj.xData.push(data[i]["month"] + "月");
} }
if (!this.bmObj.legend.includes(data[i]["riskName"])) { if (!this.tmObj.legend.includes(list[i]["riskName"])) {
this.bmObj.legend.push(data[i]["riskName"]); this.tmObj.legend.push(list[i]["riskName"]);
} }
} }
let temp = groupByReduce(data, "riskName", "score"); let temp = groupByReduce(list, "riskName", "score");
for (let i = 0; i < this.bmObj.legend.length; i++) { for (let i = 0; i < this.tmObj.legend.length; i++) {
this.bmObj.yData.push(temp[this.bmObj.legend[i]]); this.tmObj.yData.push(temp[this.tmObj.legend[i]]);
}
} }
});
riskItemScore().then((res) => {});
abnormalRiskScore().then((res) => {});
}, },
}, trTime(val) {},
}; blTime(val) {},
</script> bmTime(val) {
<style lang="less"> this.bmObj.yData = [];
.analysisWrap { this.bmObj.xData = [];
height: 100%; this.bmObj.legend = [];
padding: 14px;
box-sizing: border-box;
display: flex;
flex-direction: column;
.riskRow {
flex: 1;
display: flex;
.riskCol {
background: url("~@/assets/images/screen/line.png") no-repeat center
center;
background-size: 100% 100%;
.chartPanel { let list = [];
position: relative; let index = 0;
height: calc(100% - 40px); if (val == "day") {
.chartOpt { index = 0;
position: absolute;
z-index: 12;
right: 5%;
display: flex;
div {
display: flex;
justify-content: center;
align-items: center;
width: 68px;
height: 30px;
color: #8fabbf;
font-size: 14px;
background: linear-gradient(
0deg,
rgba(122, 163, 204, 0.3) 0%,
rgba(122, 163, 204, 0) 100%
);
&:hover {
cursor: pointer;
background: linear-gradient(
0deg,
#3cc7b0 0%,
rgba(51, 204, 204, 0) 100%
);
}
&.active {
color: #ffffff;
border-bottom: solid 2px #33cccc;
background: linear-gradient(
0deg,
rgba(60, 199, 176, 0.3) 0%,
rgba(51, 204, 204, 0) 100%
);
}
} }
if (val == "week") {
index = 0;
} }
if (val == "month") {
index = 1;
} }
if (val == "season") {
index = 1;
} }
.rightCol { if (val == "year") {
flex: 1; index = 2;
} }
.midCol { list = this.bmObj.list;
flex: 1.4; for (let i = 0; i < list.length; i++) {
margin-right: 14px; if (!this.bmObj.xData.includes(list[i]["month"] + "月")) {
this.bmObj.xData.push(list[i]["month"] + "月");
} }
.leftCol { if (!this.bmObj.legend.includes(list[i]["riskName"])) {
flex: 1.2; this.bmObj.legend.push(list[i]["riskName"]);
margin-right: 14px;
} }
} }
let temp = groupByReduce(list, "riskName", "score");
for (let i = 0; i < this.bmObj.legend.length; i++) {
this.bmObj.yData.push(temp[this.bmObj.legend[i]]);
} }
</style> console.log(this.bmObj);
},
brTime(val) {},
},
};
</script>
<style lang="scss"> <style lang="scss">
@import "@/loveflow/assets/index.scss"; @import "@/loveflow/assets/index.scss";
.analysisWrap { .analysisWrap {
.riskCol { height: 100%;
padding-left: vw(8); padding: 14px;
font-size: vw(16); box-sizing: border-box;
overflow: hidden;
.riskName { .screenRow {
height: 30px; height: 50%;
display: flex; display: flex;
margin-top: vw(6); .screenCol {
color: #d9e7ff; flex: 1;
height: 100%;
.riskIcon {
width: vw(24);
height: vw(24);
background: url("~@/assets/images/screen/riskIcon.png") no-repeat center
center;
background-size: 100% 100%;
}
} }
} }
} }

154
src/views/enterpriseRiskIndex/components/col.vue
Unescape View File

@ -0,0 +1,154 @@
<template>
<div class="screenColWrap">
<div class="headWrap">
<div class="screenName">
<div class="screenIcon"></div>
<div class="screenNameText">{{ title }}</div>
</div>
<div class="optTimeWrap" v-if="time">
<div
class="timeBtn"
v-for="item in timeList"
:key="item.value"
@click="changeTime(item.value)"
:class="{ active: curTime == item.value }"
>
{{ item.name }}
</div>
</div>
</div>
<div class="screenChart">
<slot></slot>
</div>
</div>
</template>
<script>
export default {
props: {
title: {
type: String,
default: () => {
return "";
},
},
time: {
type: Boolean,
default: () => {
return true;
},
},
url: {
type: String,
default: () => {
return "";
},
},
},
data() {
return {
curTime: "day",
timeList: [
{
name: "当天",
value: "day",
},
{
name: "本周",
value: "week",
},
{
name: "本月",
value: "month",
},
{
name: "本季度",
value: "season",
},
{
name: "本年",
value: "year",
},
],
};
},
methods: {
changeTime(val) {
this.curTime = val;
this.$emit("changeTime", val);
},
},
};
</script>
<style lang="scss">
@import "@/loveflow/assets/index.scss";
.screenColWrap {
height: 100%;
.headWrap {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 0 0 6px;
height: 30px;
color: #d9e7ff;
background: url("~@/assets/images/risk/head.png") no-repeat center center;
background-size: 100% 100%;
}
.screenName {
display: flex;
align-items: center;
font-size: vw(16);
.screenIcon {
width: 24px;
height: 24px;
background: url("~@/assets/images/risk/icon.png") no-repeat center center;
background-size: 100% 100%;
}
}
.optTimeWrap {
display: flex;
.timeBtn {
font-size: vw(14);
padding: 0 12px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
color: #8fabbf;
background: linear-gradient(
0deg,
rgba(122, 163, 204, 0.3) 0%,
rgba(122, 163, 204, 0) 100%
);
&:hover {
cursor: pointer;
color: #ffffff;
background: linear-gradient(
0deg,
#3cc7b0 0%,
rgba(51, 204, 204, 0) 100%
);
}
&.active {
color: #ffffff;
border-bottom: solid 2px #33cccc;
background: linear-gradient(
0deg,
rgba(60, 199, 176, 0.3) 0%,
rgba(51, 204, 204, 0) 100%
);
}
}
}
.screenChart {
padding: vw(10) vw(10) 0;
height: calc(100% - 30px);
box-sizing: border-box;
background: url("~@/assets/images/risk/body.png") no-repeat center center;
background-size: 100% 100%;
}
}
</style>

3
src/views/enterpriseRiskIndex/components/leftCard.vue
Unescape View File

@ -32,8 +32,7 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
margin-right: 20px; margin: vw(6);
margin-left: 3%;
padding-left: 20px; padding-left: 20px;
flex: 1; flex: 1;
height: vw(80); height: vw(80);

3
src/views/enterpriseRiskIndex/components/rightCard.vue
Unescape View File

@ -34,9 +34,8 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
margin-right: 20px; margin: vw(6);
padding-left: 20px; padding-left: 20px;
margin-right: 5%;
flex: 2; flex: 2;
height: vw(80); height: vw(80);
background: url("~@/assets/images/screen/zz.png") no-repeat center center; background: url("~@/assets/images/screen/zz.png") no-repeat center center;

339
src/views/enterpriseRiskIndex/synthetical.vue
Unescape View File

@ -1,81 +1,56 @@
<template> <template>
<div class="syntheticalWrap"> <div class="syntheticalWrap">
<div class="riskRow mb18"> <div class="screenRow pb14">
<div class="riskCol leftCol mr18"> <div class="screenCol mr14">
<div class="riskName"> <colWrap title="企业综合风险雷达图" @changeTime="tlTime">
<div class="riskIcon"></div>
<div class="riskNameText">企业综合风险雷达图</div>
</div>
<div class="chartPanel">
<radarOne :chartObj="tlObj"></radarOne> <radarOne :chartObj="tlObj"></radarOne>
</colWrap>
</div> </div>
</div> <div class="screenCol mr14">
<div class="riskCol midCol mr18"> <colWrap title="企业综合风险趋势图" @changeTime="tmTime">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">企业综合风险趋势图</div>
</div>
<div class="totalWrap"> <div class="totalWrap">
<left-card :dataObj="leftData"></left-card> <left-card :dataObj="leftData"></left-card>
<right-card :dataObj="rightData"></right-card> <right-card :dataObj="rightData"></right-card>
</div> </div>
<time-select @ok="tmTime"></time-select> <div class="chartPanel">
<div class="chartPanel" style="height: 26vh">
<barOne :chartObj="tmObj"></barOne> <barOne :chartObj="tmObj"></barOne>
</div> </div>
</colWrap>
</div> </div>
<div class="riskCol rightCol"> <div class="screenCol">
<div class="riskName"> <colWrap title="高风险企业增长趋势分析" @changeTime="trTime">
<div class="riskIcon"></div>
<div class="riskNameText">高风险企业增长趋势分析</div>
</div>
<div class="totalWrap"> <div class="totalWrap">
<left-card :dataObj="lefData"></left-card> <left-card :dataObj="lefData"></left-card>
<right-card :dataObj="righData"></right-card> <right-card :dataObj="righData"></right-card>
</div> </div>
<time-select @ok="trTime"></time-select> <div class="chartPanel">
<div class="chartPanel" style="height: 26vh">
<pieOne :chartObj="trObj"></pieOne> <pieOne :chartObj="trObj"></pieOne>
</div> </div>
</colWrap>
</div> </div>
</div> </div>
<div class="riskRow"> <div class="screenRow">
<div class="riskCol leftCol mr18"> <div class="screenCol mr14">
<div class="riskName"> <colWrap title="风险标签排行" @changeTime="blTime">
<div class="riskIcon"></div>
<div class="riskNameText">全区企业风险预警总量</div>
</div>
<div class="riskTotalPanel"> <div class="riskTotalPanel">
<total-card :dataObj="totalData"></total-card> <total-card :dataObj="totalData"></total-card>
</div> </div>
<!-- <div class="chartPanelBg"></div> --> <div class="chartPanel">
<div
class="chartPanel"
style="height: calc(100% - 12vh); width: 88%; margin-left: 2%"
>
<time-select @ok="blTime"></time-select>
<pieOne :chartObj="blObj"></pieOne> <pieOne :chartObj="blObj"></pieOne>
</div> </div>
</colWrap>
</div> </div>
<div class="riskCol midCol mr18"> <div class="screenCol mr14">
<div class="riskName"> <colWrap title="风险总量分析变化趋势图" @changeTime="bmTime">
<div class="riskIcon"></div>
<div class="riskNameText">全区企业风险标签数量变化趋势</div>
</div>
<div class="chartPanel">
<time-select @ok="bmTime"></time-select>
<lineOne :chartObj="bmObj"></lineOne> <lineOne :chartObj="bmObj"></lineOne>
</colWrap>
</div> </div>
</div> <div class="screenCol">
<div class="riskCol rightCol"> <colWrap title="异常风险得分对比" :time="false">
<div class="riskName">
<div class="riskIcon"></div>
<div class="riskNameText">全区企业风险标签增长趋势</div>
</div>
<div class="riskUpWrap"> <div class="riskUpWrap">
<div class="totalTop"> <div class="totalTop">
<div class="left"> <div class="left">
<div class="totalName fontsize16">本年度风险标签总量</div> <div class="totalName fontsize16">本年风险标签总量</div>
<div class="totalValue"> <div class="totalValue">
<div class="item"> <div class="item">
<div class="value fontsize22"> <div class="value fontsize22">
@ -100,7 +75,7 @@
</div> </div>
<div class="totalMid"> <div class="totalMid">
<div class="left"> <div class="left">
<div class="totalName fontsize16">近三月风险标签总量</div> <div class="totalName fontsize16">本季度风险标签总量</div>
<div class="totalValue"> <div class="totalValue">
<div class="item"> <div class="item">
<div class="value fontsize22"> <div class="value fontsize22">
@ -148,13 +123,60 @@
</div> </div>
</div> </div>
</div> </div>
<div class="totalBtm">
<div class="left">
<div class="totalName fontsize16">本周风险标签总量</div>
<div class="totalValue">
<div class="item">
<div class="value fontsize22">32</div>
</div> </div>
</div> </div>
</div> </div>
<div class="right">
<div class="totalName fontsize16">增长趋势</div>
<div class="totalValue">
<div class="item">
<div class="label fontsize14">同比增长</div>
<div class="value fontsize22">2%</div>
</div>
<div class="item">
<div class="label fontsize14">环比增长</div>
<div class="value fontsize22">1%</div>
</div>
</div>
</div>
</div>
<div class="totalBtm">
<div class="left">
<div class="totalName fontsize16">当日风险标签总量</div>
<div class="totalValue">
<div class="item">
<div class="value fontsize22">12</div>
</div>
</div>
</div>
<div class="right">
<div class="totalName fontsize16">增长趋势</div>
<div class="totalValue">
<div class="item">
<div class="label fontsize14">同比增长</div>
<div class="value fontsize22">2%</div>
</div>
<div class="item">
<div class="label fontsize14">环比增长</div>
<div class="value fontsize22">1%</div>
</div>
</div>
</div>
</div>
</div>
</colWrap>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import timeSelect from "./components/timeSelect.vue"; import colWrap from "./components/col.vue";
import barOne from "@/loveflow/components/echart/bar/one.vue"; import barOne from "@/loveflow/components/echart/bar/one.vue";
import lineOne from "@/loveflow/components/echart/line/one.vue"; import lineOne from "@/loveflow/components/echart/line/one.vue";
import radarOne from "@/loveflow/components/echart/radar/one.vue"; import radarOne from "@/loveflow/components/echart/radar/one.vue";
@ -176,9 +198,9 @@ import { groupByReduce } from "@/loveflow/util.js";
export default { export default {
components: { components: {
colWrap,
barOne, barOne,
lineOne, lineOne,
timeSelect,
radarOne, radarOne,
pieOne, pieOne,
leftCard, leftCard,
@ -204,37 +226,17 @@ export default {
hb: 2, hb: 2,
}, },
totalData: { totalData: {
name: "今日企业风险项量", name: "风险标签总量",
value: 7, value: 7,
}, },
total: 21345, total: 1345,
total1: 198, total1: 198,
total2: 879, total2: 879,
tlObj: { tlObj: {
indicator: [ indicator: [],
{ yData: [],
name: "人员安全", name: "企业综合风险",
max: 100, list: [],
},
{
name: "道路安全",
max: 100,
},
{
name: "列管物品",
max: 100,
},
{
name: "消防安全",
max: 100,
},
{
name: "危化品运输",
max: 100,
},
],
yData: [12, 13, 14, 15, 11, 14],
name: "风险监测项评分排行",
}, },
tmObj: { tmObj: {
gridTop: "15%", gridTop: "15%",
@ -309,6 +311,8 @@ export default {
enterpriseComprehensiveRisk().then((res) => { enterpriseComprehensiveRisk().then((res) => {
if (res.code == 200) { if (res.code == 200) {
let data = res.data || []; let data = res.data || [];
this.tlObj.list = data;
this.tlTime("day");
} }
}); });
tendencyChart().then((res) => { tendencyChart().then((res) => {
@ -341,7 +345,40 @@ export default {
} }
}); });
}, },
tlTime(val) {
this.tlObj.indicator = [];
this.tlObj.yData = [];
let list = [];
let index = 0;
if (val == "day") {
index = 0;
}
if (val == "week") {
index = 0;
}
if (val == "month") {
index = 2;
}
if (val == "season") {
index = 2;
}
if (val == "year") {
index = 2;
}
list = this.tlObj.list[index];
for (let i = 0; i < list.length; i++) {
let name = list[i]["riskName"].replace(/分析/, "");
name = name.replace(/异常/, "");
name = name.replace(/情况/, "");
if (name.indexOf("企业风险") == -1) {
this.tlObj.yData.push(list[i]["score"]);
this.tlObj.indicator.push({
name: name,
});
}
}
},
tmTime(val) { tmTime(val) {
if (val == "day") { if (val == "day") {
this.leftData.value = 78; this.leftData.value = 78;
@ -380,24 +417,25 @@ export default {
} }
}, },
blTime(val) { blTime(val) {
if (this.blObj.list.length < 2) {
return;
}
console.log(val)
this.blObj.data = []; this.blObj.data = [];
let list = []; let list = [];
let index = 0;
if (val == "day") { if (val == "day") {
this.totalData.name = "今日企业风险项量"; index = 0;
list = this.blObj.list[0]; }
if (val == "week") {
index = 0;
} }
if (val == "month") { if (val == "month") {
this.totalData.name = "近三月企业风险项量"; index = 2;
list = this.blObj.list[1]; }
if (val == "season") {
index = 2;
} }
if (val == "year") { if (val == "year") {
this.totalData.name = "本年度企业风险项量"; index = 2;
list = this.blObj.list[2];
} }
list = this.blObj.list[index];
let total = 0; let total = 0;
for (let i = 0; i < list.length; i++) { for (let i = 0; i < list.length; i++) {
@ -410,77 +448,78 @@ export default {
this.totalData.value = total; this.totalData.value = total;
}, },
bmTime(val) { bmTime(val) {
if (this.bmObj.list.length < 2) {
return;
}
this.bmObj.yData = []; this.bmObj.yData = [];
this.bmObj.xData = []; this.bmObj.xData = [];
this.bmObj.legend = []; this.bmObj.legend = [];
let data = []; let list = [];
let index = 0;
if (val == "day") { if (val == "day") {
data = this.bmObj.list[0]; index = 0;
}
if (val == "week") {
index = 0;
} }
if (val == "month") { if (val == "month") {
data = this.bmObj.list[1]; index = 1;
}
if (val == "season") {
index = 1;
} }
if (val == "year") { if (val == "year") {
data = this.bmObj.list[2]; index = 2;
} }
list = this.bmObj.list[index];
for (let i = 0; i < data.length; i++) { for (let i = 0; i < list.length; i++) {
if (!this.bmObj.xData.includes(data[i]["month"] + "月")) { if (!this.bmObj.xData.includes(list[i]["month"] || i + "月")) {
this.bmObj.xData.push(data[i]["month"] + "月"); this.bmObj.xData.push(list[i]["month"] || i + "月");
} }
if (!this.bmObj.legend.includes(data[i]["riskName"])) { if (!this.bmObj.legend.includes(list[i]["riskName"])) {
this.bmObj.legend.push(data[i]["riskName"]); this.bmObj.legend.push(list[i]["riskName"]);
} }
} }
let temp = groupByReduce(data, "riskName", "score"); let temp = groupByReduce(list, "riskName", "score");
console.log(temp);
for (let i = 0; i < this.bmObj.legend.length; i++) { for (let i = 0; i < this.bmObj.legend.length; i++) {
this.bmObj.yData.push(temp[this.bmObj.legend[i]]); this.bmObj.yData.push(temp[this.bmObj.legend[i]]);
} }
console.log(this.bmObj);
}, },
}, },
}; };
</script> </script>
<style lang="less">
<style lang="scss">
@import "@/loveflow/assets/index.scss";
.syntheticalWrap { .syntheticalWrap {
height: 100%; height: 100%;
padding: 18px; padding: 14px;
box-sizing: border-box; box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden; overflow: hidden;
.screenRow {
.riskRow { height: 50%;
flex: 1;
display: flex; display: flex;
.riskCol { .screenCol {
position: relative; flex: 1;
background: url("~@/assets/images/screen/line.png") no-repeat center height: 100%;
center;
background-size: 100% 100%;
.chartPanel {
height: calc(100% - 40px);
}
.chartPanelBg {
position: absolute;
width: 60%;
height: 28px;
top: calc(50% - 44px);
left: 30%;
background-color: rgba(108, 128, 151, 0.1);
}
.totalWrap { .totalWrap {
display: flex; display: flex;
} }
.chartPanel {
height: calc(100% - 4.5vw);
}
.riskTotalPanel {
margin-top: 10px;
}
.riskUpWrap { .riskUpWrap {
height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-around;
height: calc(100% - 4vh);
display: flex;
.left { .left {
width: 220px; width: 220px;
} }
@ -491,9 +530,9 @@ export default {
justify-content: center; justify-content: center;
} }
.totalTop { .totalTop {
flex: 1;
display: flex; display: flex;
padding-left: 20px; padding-left: 20px;
flex: 1;
background: url("~@/assets/images/screen/zb1.png") no-repeat center background: url("~@/assets/images/screen/zb1.png") no-repeat center
center; center;
background-size: 100% 100%; background-size: 100% 100%;
@ -503,9 +542,9 @@ export default {
} }
} }
.totalMid { .totalMid {
flex: 1;
display: flex; display: flex;
padding-left: 20px; padding-left: 20px;
flex: 1;
background: url("~@/assets/images/screen/zb2.png") no-repeat center background: url("~@/assets/images/screen/zb2.png") no-repeat center
center; center;
background-size: 100% 100%; background-size: 100% 100%;
@ -515,9 +554,9 @@ export default {
} }
} }
.totalBtm { .totalBtm {
flex: 1;
display: flex; display: flex;
padding-left: 20px; padding-left: 20px;
flex: 1;
background: url("~@/assets/images/screen/zb3.png") no-repeat center background: url("~@/assets/images/screen/zb3.png") no-repeat center
center; center;
background-size: 100% 100%; background-size: 100% 100%;
@ -551,48 +590,6 @@ export default {
} }
} }
} }
.rightCol {
flex: 1;
}
.midCol {
flex: 1.3;
margin-right: 18px;
}
.leftCol {
flex: 1;
margin-right: 18px;
}
}
}
</style>
<style lang="scss">
@import "@/loveflow/assets/index.scss";
.syntheticalWrap {
.riskCol {
padding-left: vw(8);
font-size: vw(16);
.riskName {
height: vw(30);
display: flex;
margin-top: vw(6);
color: #d9e7ff;
.riskIcon {
width: vw(24);
height: vw(24);
background: url("~@/assets/images/screen/riskIcon.png") no-repeat center
center;
background-size: 100% 100%;
}
}
.totalWrap {
display: flex;
margin-top: vw(40);
}
.riskTotalPanel {
margin-top: vw(40);
}
} }
} }
</style> </style>

2
src/views/enterpriseTopic/personSafety/keyPerson.vue
Unescape View File

@ -79,7 +79,7 @@ export default {
total: 12, total: 12,
}, },
{ {
name: "非防人员", name: "非法上访人员",
value: "3", value: "3",
total: 123, total: 123,
}, },

5
src/views/home/workspace.vue
Unescape View File

@ -52,7 +52,7 @@
<script> <script>
import rotateWrap from "@/loveflow/components/animate/rotate.vue"; import rotateWrap from "@/loveflow/components/animate/rotate.vue";
import { getCheckCode } from "@/utils/login"; import { getInfo } from "@/utils/login";
import headWrap from "./head.vue"; import headWrap from "./head.vue";
export default { export default {
components: { headWrap, rotateWrap }, components: { headWrap, rotateWrap },
@ -60,8 +60,7 @@ export default {
return {}; return {};
}, },
created() { created() {
let random = Math.random(); getInfo();
getCheckCode({ type: "math", s: random });
}, },
mounted() { mounted() {
let items = document.getElementsByClassName("ball"); let items = document.getElementsByClassName("ball");

Write Preview
Loading…
Cancel
Save