Notes on Background Response
@@ -55,52 +42,30 @@
-
+
-
+
-
+
-
+
-
+
@@ -114,7 +79,7 @@ import * as echarts from 'echarts';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
-import {statistics} from '/@/api/disasterInfo/index.js';
+import { statistics } from '/@/api/disasterInfo/index.js';
// 定义变量内容
const homeLineRef = ref();
const homePieRef = ref();
@@ -138,7 +103,7 @@ const state = reactive({
num1: '',
num2: '',
num3: 'Number of Disaster Response Applications',
- num4: 'fa fa-meetup',
+ num4: 'iconfont',
color1: '#FF6462',
color2: '--next-color-primary-lighter',
color3: '--el-color-primary',
@@ -147,7 +112,7 @@ const state = reactive({
num1: '',
num2: '',
num3: 'Actual times of disaster response',
- num4: 'iconfont icon-ditu',
+ num4: 'iconfont',
color1: '#6690F9',
color2: '--next-color-success-lighter',
color3: '--el-color-success',
@@ -156,7 +121,7 @@ const state = reactive({
num1: '',
num2: '',
num3: 'User Visits',
- num4: 'iconfont icon-zaosheng',
+ num4: 'iconfont',
color1: '#6690F9',
color2: '--next-color-warning-lighter',
color3: '--el-color-warning',
@@ -165,7 +130,7 @@ const state = reactive({
num1: '',
num2: '',
num3: 'Data downloads',
- num4: 'fa fa-github-alt',
+ num4: 'iconfont',
color1: '#FF6462',
color2: '--next-color-danger-lighter',
color3: '--el-color-danger',
@@ -236,7 +201,7 @@ const state = reactive({
});
// 折线图
-const initLineChart = (xData,data) => {
+const initLineChart = (xData, data) => {
console.log(xData)
console.log(data)
if (!state.global.dispose.some((b) => b === state.global.homeChartOne)) state.global.homeChartOne.dispose();
@@ -365,7 +330,7 @@ const initPieChart = (data) => {
};
//homePieRef2 灾害类型占比 饼图
const initPieChart2 = (data) => {
- console.log("pie2",data)
+ console.log("pie2", data)
if (!state.global.dispose.some((b) => b === state.global.homeChartFour)) state.global.homeChartFour.dispose();
state.global.homeChartFour = markRaw(echarts.init(homePieRef2.value, state.charts.theme));
// var getname = ['房屋及结构物', '专用设备', '通用设备', '文物和陈列品', '图书、档案'];
@@ -445,7 +410,7 @@ const initPieChart2 = (data) => {
state.myCharts.push(state.global.homeChartFour);
};
// 柱状图
-const initBarChart = (xData,yData) => {
+const initBarChart = (xData, yData) => {
if (!state.global.dispose.some((b) => b === state.global.homeCharThree)) state.global.homeCharThree.dispose();
state.global.homeCharThree = echarts.init(homeBarRef.value, state.charts.theme);
const option = {
@@ -523,8 +488,8 @@ const setHeadData = (data) => {
*/
const setDisasterArea = (data) => {
let arr = [];
- for(let [k , v] of Object.entries(data)){
- arr.push({ name: k, value: v});
+ for (let [k, v] of Object.entries(data)) {
+ arr.push({ name: k, value: v });
}
initPieChart(arr);
}
@@ -535,13 +500,13 @@ const setDisasterArea = (data) => {
const setResponseDisaster = (data) => {
let xData = [];
let yData = [];
- data.forEach(item=>{
- for(let [k , v] of Object.entries(item)){
+ data.forEach(item => {
+ for (let [k, v] of Object.entries(item)) {
xData.push(k);
yData.push(v.value);
}
})
- initLineChart(xData,yData);
+ initLineChart(xData, yData);
}
/**
* 设置灾害申请月份分布量
@@ -550,14 +515,14 @@ const setResponseDisaster = (data) => {
const setApplyDisaster = (data) => {
let xData = [];
let yData = [];
- data.forEach(item=>{
- for(let [k , v] of Object.entries(item)){
+ data.forEach(item => {
+ for (let [k, v] of Object.entries(item)) {
xData.push(k);
yData.push(v.value);
}
})
setTimeout(() => {
- initBarChart(xData,yData);
+ initBarChart(xData, yData);
}, 700);
}
/**
@@ -566,14 +531,14 @@ const setApplyDisaster = (data) => {
*/
const setDisasterType = (data) => {
let arr = [];
- for(let [k , v] of Object.entries(data)){
- arr.push({ name: k, value: v});
+ for (let [k, v] of Object.entries(data)) {
+ arr.push({ name: k, value: v });
}
initPieChart2(arr)
}
//获取控制台数据
const getDashBoradData = () => {
- statistics().then(res=>{
+ statistics().then(res => {
console.log(res);
setHeadData(res.header);
setDisasterArea(res.country);
@@ -633,90 +598,103 @@ watch(