124 lines
2.9 KiB
Vue
124 lines
2.9 KiB
Vue
<template>
|
|
<el-dialog title="测评统计" v-model="visible" width="800px" append-to-body :close-on-click-modal="false"
|
|
@close="handleClose">
|
|
<el-card>
|
|
<template #header>
|
|
图表统计
|
|
</template>
|
|
<v-chart style="height: 300px;" :option="barOption" autoresize />
|
|
<template #footer>此图表为当前学生所有测试量表的所有因子的风险的数量统计</template>
|
|
</el-card>
|
|
|
|
<el-card style="margin-top: 20px;">
|
|
<template #header>
|
|
列表统计
|
|
</template>
|
|
<el-table :data="tableData">
|
|
<el-table-column prop="name" label="姓名" />
|
|
<el-table-column prop="times" label="时间">
|
|
<template #default="scope">
|
|
<div v-for="item in scope.row.times.split(',')">
|
|
{{ item }}<br>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="value" label="测评次数" />
|
|
</el-table>
|
|
</el-card>
|
|
</el-dialog>
|
|
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { statisticScale, statisticWarn } from '@/api/archive/information'
|
|
|
|
import * as echarts from 'echarts';
|
|
import { use } from 'echarts/core'
|
|
import { CanvasRenderer } from "echarts/renderers";
|
|
import { PieChart, BarChart, LineChart } from "echarts/charts";
|
|
import { TitleComponent, TooltipComponent, LegendComponent, ToolboxComponent, GridComponent, VisualMapComponent } from "echarts/components";
|
|
import VChart from 'vue-echarts'
|
|
|
|
use([
|
|
CanvasRenderer,
|
|
PieChart,
|
|
BarChart,
|
|
LineChart,
|
|
TitleComponent,
|
|
TooltipComponent,
|
|
LegendComponent,
|
|
ToolboxComponent,
|
|
GridComponent,
|
|
VisualMapComponent
|
|
]);
|
|
|
|
const visible = ref(false)
|
|
const userId = ref()
|
|
const openStatistic = (row: any) => {
|
|
userId.value = row.userId
|
|
console.log('userId:', userId.value);
|
|
visible.value = true
|
|
}
|
|
|
|
const tableData = ref<any[]>([])
|
|
const statisticScaleData = async () => {
|
|
const { data } = await statisticScale({ userId: userId.value })
|
|
tableData.value = data
|
|
}
|
|
|
|
const barOption = ref({
|
|
xAxis: {
|
|
type: 'category',
|
|
data: ['未见异常', '低风险', '中风险', '高风险', '重大风险']
|
|
},
|
|
yAxis: {
|
|
type: 'value'
|
|
},
|
|
series: [
|
|
{
|
|
data: [],
|
|
type: 'bar'
|
|
}
|
|
]
|
|
})
|
|
const statisticWarnData = async () => {
|
|
const { data: { noneNum, lowNum, middleNum, highNum, majorNum } } = await statisticWarn({ userId: userId.value })
|
|
|
|
barOption.value.series[0].data = [
|
|
noneNum, lowNum, middleNum, highNum, majorNum
|
|
]
|
|
}
|
|
|
|
watch(visible, (newVal, oldVal) => {
|
|
if (newVal) {
|
|
statisticScaleData()
|
|
statisticWarnData()
|
|
}
|
|
})
|
|
|
|
const handleClose = () => {
|
|
barOption.value = {
|
|
xAxis: {
|
|
type: 'category',
|
|
data: ['未见异常', '低风险', '中风险', '高风险', '重大风险']
|
|
},
|
|
yAxis: {
|
|
type: 'value'
|
|
},
|
|
series: [
|
|
{
|
|
data: [],
|
|
type: 'bar'
|
|
}
|
|
]
|
|
}
|
|
|
|
tableData.value = []
|
|
}
|
|
|
|
defineExpose({ openStatistic })
|
|
|
|
</script>
|
|
|
|
<style scoped></style>
|