sx_yjb_vue/src/views/index/components/risk_classification.vue

119 lines
2.8 KiB
Vue

<template>
<el-card>
<div id="main2" />
</el-card>
</template>
<script setup>
import { onBeforeUnmount, onMounted } from "vue";
// import * as echarts from "echarts";
// import { getRiskManagement } from "@/request/large_screen_data_display.js";
let myChart2;
const fnGetData = async () => {
// const { riskAll } = await getRiskManagement();
// fnInitEcharts(riskAll);
};
// const fnInitEcharts = (data) => {
// myChart2 = echarts.init(document.querySelector("#main2"));
// let acount = 0;
// let bcount = 0;
// let ccount = 0;
// let dcount = 0;
// for (let i = 0; data.length > i; i++) {
// if (data[i].LEVELID) {
// if (data[i].LEVELID === "levelA") acount = data[i].COUNT;
// if (data[i].LEVELID === "levelB") bcount = data[i].COUNT;
// if (data[i].LEVELID === "levelC") ccount = data[i].COUNT;
// if (data[i].LEVELID === "levelD") dcount = data[i].COUNT;
// }
// }
// const option = {
// title: {
// text: "风险分级统计",
// textStyle: {
// fontSize: "14",
// color: "#fff",
// fontWeight: "700",
// },
// },
// color: ["#10b9f8", "#ffc600", "#f49545", "#ec2c26"],
// tooltip: {
// trigger: "item",
// },
// grid: {},
// legend: {
// orient: "vertical",
// left: "6%",
// top: "20%",
// textStyle: {
// color: "#fff",
// },
// },
// series: [
// {
// name: "风险类型",
// type: "pie",
// radius: ["30%", "70%"],
// center: ["64%", "49%"],
// avoidLabelOverlap: false,
// itemStyle: {
// borderColor: "rgb(8, 24, 58)",
// borderWidth: 2,
// },
// label: {
// show: false,
// position: "center",
// },
// emphasis: {
// label: {
// show: true,
// fontSize: "18",
// fontWeight: "bold",
// color: "#fff",
// },
// },
// labelLine: {
// show: false,
// },
// data: [
// {
// value: dcount,
// name: "低风险",
// },
// {
// value: ccount,
// name: "一般风险",
// },
// {
// value: bcount,
// name: "较大风险",
// },
// {
// value: acount,
// name: "重大风险",
// },
// ],
// },
// ],
// };
// myChart2.setOption(option);
// };
onMounted(() => {
fnGetData();
window.onresize = function () {
myChart2 && myChart2.resize();
};
});
onBeforeUnmount(() => {
myChart2 = null;
});
</script>
<style scoped lang="scss">
#main2 {
width: 100%;
height: 305px;
}
</style>