-
标题名称
+ 量表使用统计
-
@@ -28,18 +28,18 @@
@@ -132,7 +132,7 @@
标题名称
+ 年级统计
-
-
- 50 -
- 164 -
- 87 -
- 1 +
- {{ userNum }} +
- {{ evaluationNum }} +
- {{ warnNum }} +
- {{ interveneNum }}
-
-
- 总人数 -
- 总采集人数 -
- 预警人数 -
- 干预人数 +
- 总用户数 +
- 总测评数 +
- 总预警数 +
- 总干预数
-
@@ -154,6 +154,8 @@ import { PieChart, BarChart } from "echarts/charts";
import { TitleComponent, TooltipComponent, LegendComponent, GridComponent } from "echarts/components";
import VChart from 'vue-echarts'
+import { getUserNum, getEvaluationNum, getWarnNum, getInterveneNum, getWarn4All, getPublishNum, getGrade } from '@/api/index'
+
use([
CanvasRenderer,
PieChart,
@@ -217,10 +219,43 @@ const list = ref([
},
]);
+const userNum = ref(0)
+async function getUserNumData() {
+ const res = await getUserNum()
+ userNum.value = res.data
+}
+
+const evaluationNum = ref(0)
+async function getEvaluationNumData() {
+ const res = await getEvaluationNum()
+ evaluationNum.value = res.data
+}
+
+const warnNum = ref(0)
+async function getWarnNumData() {
+ const res = await getWarnNum()
+ warnNum.value = res.data
+}
+
+const interveneNum = ref(0)
+async function getInterveneNumData() {
+ const res = await getInterveneNum()
+ interveneNum.value = res.data
+}
+
onMounted(() => {
time()
timer = setInterval(time, 1000);
+
+ getUserNumData()
+ getEvaluationNumData()
+ getWarnNumData()
+ getInterveneNumData()
+
+ getPublishNumData()
+ getGradeData()
+ getWarn4AllData()
});
@@ -232,7 +267,7 @@ const leftBar1Option = ref({
grid: {
left: '2%',
top: '1%',
- right: '5%',
+ right: '7%',
bottom: '0%',
containLabel: true
},
@@ -249,45 +284,17 @@ const leftBar1Option = ref({
fontSize: '14',
}
},
- data: ['字段1', '字段2', '字段3', '字段4', '字段5', '字段6', '字段7', '字段8', '字段9']
-
- }, {
- axisTick: 'none',
- axisLine: 'none',
- axisLabel: {
- textStyle: {
- color: 'rgba(255,255,255,.6)',
- fontSize: '14',
- }
- },
- data: [1514, 1619, 1623, 1968, 2158, 2456, 3506, 4664, 8390]
-
- }, {
- name: '单位:件',
- nameGap: '50',
- nameTextStyle: {
- color: 'rgba(255,255,255,.6)',
- fontSize: '16',
- },
- axisLine: {
- lineStyle: {
- color: 'rgba(0,0,0,0)'
- }
- },
- data: [],
+ data: []
}],
series: [{
- name: '条',
+ name: '量表使用统计',
type: 'bar',
yAxisIndex: 0,
- data: [25, 30, 34, 40, 43, 48, 52, 56, 70],
+ data: [],
label: {
normal: {
show: true,
position: 'right',
- formatter: function (param) {
- return param.value + '%';
- },
textStyle: {
color: 'rgba(255,255,255,.8)',
fontSize: '12',
@@ -310,23 +317,22 @@ const leftBar1Option = ref({
}
},
z: 2
- }, {
- name: '白框',
- type: 'bar',
- yAxisIndex: 1,
- barGap: '-100%',
- data: [99.5, 99.5, 99.5, 99.5, 99.5, 99.5, 99.5, 99.5, 99.5, 99.5],
- barWidth: 15,
- itemStyle: {
- normal: {
- color: 'rgba(0,0,0,.2)',
- barBorderRadius: 15,
- }
- },
- z: 1
}]
});
+async function getPublishNumData() {
+ const res = await getPublishNum()
+ let yAxisData: any[] = []
+ let data: any[] = []
+ res.data.forEach((v: any) => {
+ yAxisData.push(v.name)
+ data.push(v.value)
+ });
+
+ leftBar1Option.value.yAxis[0].data = yAxisData
+ leftBar1Option.value.series[0].data = data
+}
+
const leftBar2Option = ref({
tooltip: {
trigger: 'axis',
@@ -335,7 +341,7 @@ const leftBar2Option = ref({
}
},
legend: {
- data: ['字段1', '字段2', '字段3'],
+ data: ['发布数', '测评数'],
right: 'center',
top: 0,
textStyle: {
@@ -354,7 +360,7 @@ const leftBar2Option = ref({
},
xAxis: {
type: 'category',
- data: ['字段1', '字段2', '字段3', '字段3', '字段4', '字段5', '字段6', '字段7', '字段8', '字段9'],
+ data: [],
axisLine: {
lineStyle: {
color: 'white'
@@ -393,47 +399,25 @@ const leftBar2Option = ref({
axisLine: { show: false },
},
- series: [{
- name: '字段1',
- type: 'bar',
- stack: 'a',
- barWidth: '30', barGap: 0,
- itemStyle: {
- normal: {
- color: '#8bd46e',
- }
- },
- data: [331, 497, 440, 81, 163, 366, 57, 188, 172, 2295]
- },
- {
- name: '字段2',
- type: 'bar',
- stack: 'a',
- barWidth: '30', barGap: 0,
- itemStyle: {
- normal: {
- color: '#f5804d',
- barBorderRadius: 0,
- }
- },
- data: [48, -97, 56, -59, 90, 98, 64, 61, -8, 253]
- },
- {
- name: '字段3',
- type: 'bar',
- stack: 'a',
- barWidth: '30', barGap: 0,
- itemStyle: {
- normal: {
- color: '#248ff7',
- barBorderRadius: 0,
- }
- },
- data: [-13, -21, -112, 5, 0, -5, 72, -3, 8, -69]
- }
- ]
+ series: []
})
+async function getGradeData() {
+ const res = await getGrade()
+ let xAxisData: any[] = []
+ let seriesPublishData: any[] = []
+ let seriesEvaluationData: any[] = []
+
+ res.data.forEach((v: any) => {
+ xAxisData.push(v.name)
+ seriesPublishData.push(v.value)
+ seriesEvaluationData.push(v.spareValue)
+ });
+
+ const seriesData = [{ name: '发布数', data: seriesPublishData, type: 'bar' }, { name: '测评数', data: seriesEvaluationData, type: 'bar' }]
+ leftBar2Option.value.xAxis.data = xAxisData
+ leftBar2Option.value.series = seriesData
+}
const centerBar1Option = ref({
tooltip: {
@@ -881,10 +865,10 @@ const rightBar1Option = ref({
const rightPie2Option = ref({
title: {
- text: '5132',
- subtext: '总体',
+ text: '',
+ subtext: '',
x: 'center',
- y: '40%',
+ y: '50%',
textStyle: {
color: '#fff',
fontSize: 22,
@@ -911,29 +895,16 @@ const rightPie2Option = ref({
}
},
series: [{
- name: '访问来源',
+ name: '预警统计',
type: 'pie',
radius: ['50%', '70%'],
center: ['50%', '50%'],
color: ['rgb(131,249,103)', '#FBFE27', '#FE5050', '#1DB7E5'], //'#FBFE27','rgb(11,228,96)','#FE5050'
- data: [{
- "value": 1924,
- "name": "字段名称1"
- }, {
- "value": 1055,
- "name": "字段名称2"
- }, {
- "value": 1532,
- "name": "字段名称3"
- }
- ].sort(function (a, b) {
- return a.value - b.value
- }),
+ data: [],
roseType: 'radius',
-
label: {
normal: {
- formatter: ['{c|{c}万}', '{b|{b}}'].join('\n'),
+ formatter: ['{c|{c}人}', '{b|{b}}'].join('\n'),
rich: {
c: {
color: 'rgb(241,246,104)',
@@ -962,6 +933,20 @@ const rightPie2Option = ref({
}
}]
})
+
+async function getWarn4AllData() {
+ const res = await getWarn4All()
+
+ const data = [
+ { name: '未见异常', value: res.data.noneNum },
+ { name: '低风险', value: res.data.lowNum },
+ { name: '中风险', value: res.data.middleNum },
+ { name: '高风险', value: res.data.highNum },
+ { name: '重大风险', value: res.data.majorNum }
+ ]
+
+ rightPie2Option.value.series[0].data = data
+}
标题名称
+ 预警统计