From 1b9fea7d4af68d8f933b2dc42bf6084b9646f64c Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期二, 04 三月 2025 08:39:55 +0800
Subject: [PATCH] 修改作业等级名称
---
src/views/riskWarningSys/warningBigScreen/components/profession.vue | 178 +++++++++++++++++++++++++++++------------------------------
1 files changed, 88 insertions(+), 90 deletions(-)
diff --git a/src/views/riskWarningSys/warningBigScreen/components/profession.vue b/src/views/riskWarningSys/warningBigScreen/components/profession.vue
index ed926bf..fcd1347 100644
--- a/src/views/riskWarningSys/warningBigScreen/components/profession.vue
+++ b/src/views/riskWarningSys/warningBigScreen/components/profession.vue
@@ -1,27 +1,27 @@
<template>
<div class="charts-cont">
-<!-- <div class="pro" :id="pro">-->
+ <div class="pro" :id="pro">
-<!-- </div>-->
- <dv-active-ring-chart :config="config" style="width:100%;height:100%" />
+ </div>
+<!-- <dv-active-ring-chart :config="config" style="width:100%;height:100%" />-->
</div>
</template>
<script lang="ts">
import {toRefs, reactive, defineComponent, ref, defineAsyncComponent, onMounted} from 'vue';
import { storeToRefs } from 'pinia';
- import { initBackEndControlRoutes } from '/@/router/backEnd';
import {useUserInfo} from "/@/stores/userInfo";
import { Session } from '/@/utils/storage';
import { Search } from '@element-plus/icons-vue'
import { ElMessage } from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus'
- import { workApplyApi } from '/@/api/specialWorkSystem/workApply';
import * as echarts from 'echarts';
import '/@/theme/bigScreen.css'
+ import {riskWarningApi} from "/@/api/riskWarning";
interface stateType {
+ proData: []
}
export default defineComponent({
name: 'profession',
@@ -29,96 +29,93 @@
props:{
size: Number
},
- setup(props) {
+ setup(props,context) {
const userInfo = useUserInfo()
const { userInfos } = storeToRefs(userInfo);
const pro = ref("eChartPro" + Date.now() + Math.random())
const state = reactive<stateType>({
- config:{
- data: [
- {
- name: '持证人员',
- value: 55
- },
- {
- name: '非持证人员',
- value: 120
+ proData: []
+ })
+
+ const getUserCount = async () => {
+ let res = await riskWarningApi().getUserCount();
+ if (res.data.code === '200') {
+ state.proData = res.data.data
+ initPro(state.proData)
+ context.emit('getData',state.proData)
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ type EChartsOption = echarts.EChartsOption
+ // 隐患整改情况
+ const initPro =(data)=>{
+ let dom = document.getElementById(pro.value);
+ let myChart = echarts.init(dom);
+ let option: EChartsOption;
+ option = {
+ tooltip: {
+ trigger: 'item'
+ },
+ legend: {
+ top: '0',
+ left: 'center',
+ textStyle:{
+ color: '#999',
+ fontSize: fontSize(11)
}
- ],
- radius: '65%',
- activeRadius: '60%',
- color: ['#FAC858','#EE6666'],
- lineWidth: fontSize(25),
- digitalFlopStyle: {
- fontSize: 16,
- fill: '#fff'
- }
- }
- })
- // type EChartsOption = echarts.EChartsOption
- // // 隐患整改情况
- // const initPro =()=>{
- // let dom = document.getElementById(pro.value);
- // let myChart = echarts.init(dom);
- //
- // let option: EChartsOption;
- //
- // option = {
- // tooltip: {
- // trigger: 'item'
- // },
- // legend: {
- // top: '0',
- // left: 'center',
- // textStyle:{
- // color: '#fff',
- // fontSize: fontSize(11)
- // }
- // },
- // series: [
- // {
- // name: 'Access From',
- // type: 'pie',
- // radius: ['45%', '70%'],
- // avoidLabelOverlap: false,
- // itemStyle: {
- // borderRadius: 4
- // },
- // label: {
- // show: true,
- // position: 'outer',
- // fontSize: fontSize(12),
- // color: '#ffffff',
- // textBorderWidth: 0,
- // width: 30,
- // overflow: 'break'
- // },
- // labelLine: {
- // show: true,
- // length: 10,
- // length2: 10
- // },
- // emphasis: {
- // label: {
- // show: true,
- // fontSize: fontSize(22),
- // fontWeight: 'bold'
- // }
- // },
- // data: [
- // { value: 1048, name: '持证人员' },
- // { value: 735, name: '非持证人员' }
- // ],
- // center: ['50%','55%']
- // }
- // ]
- // };
- //
- // option && myChart.setOption(option);
- // window.addEventListener("resize",function (){
- // myChart.resize();
- // });
- // }
+ },
+ series: [
+ {
+ name: '人员专业度分布',
+ type: 'pie',
+ radius: ['45%', '70%'],
+ avoidLabelOverlap: false,
+ itemStyle: {
+ borderRadius: 2
+ },
+ label: {
+ show: true,
+ position: 'outer',
+ fontSize: fontSize(8),
+ color: '#999',
+ textBorderWidth: 0,
+ width: 30,
+ overflow: 'break'
+ },
+ labelLine: {
+ show: true,
+ length: 10,
+ length2: 10
+ },
+ emphasis: {
+ label: {
+ show: true,
+ fontSize: fontSize(22),
+ fontWeight: 'bold'
+ }
+ },
+ data: data.map(i=>{
+ const obj = {
+ name: i.name,
+ value: i.count
+ }
+ return obj
+ }),
+ center: ['50%','55%']
+ }
+ ]
+ };
+
+ option && myChart.setOption(option);
+ window.addEventListener("resize",function (){
+ myChart.resize();
+ });
+ }
function fontSize(val){
let nowClientWidth = document.documentElement.clientWidth;
return val * (nowClientWidth/1920) * Number(props.size);
@@ -126,6 +123,7 @@
// 页面载入时执行方法
onMounted(() => {
+ getUserCount()
});
return {
--
Gitblit v1.9.2