xiugai

马宇豪

2024-07-08 20b0ce2db27b64a60de60aee05dedd448099e330

 src/views/riskWarningSys/warningBigScreen/components/educate.vue

@@ -18,9 +18,11 @@
   import { workApplyApi } from '/@/api/specialWorkSystem/workApply';
   import * as echarts from 'echarts';
   import '/@/theme/bigScreen.css'
  import {riskWarningApi} from "/@/api/riskWarning";


   interface stateType {
    educateData: []
   }
   export default defineComponent({
      name: 'educate',
@@ -28,16 +30,32 @@
      props:{
         size: Number
      },
      setup(props) {
      setup(props,context) {
         const userInfo = useUserInfo()
         const { userInfos } = storeToRefs(userInfo);
         const educate = ref("eChartEdu" + Date.now() + Math.random())
         const state = reactive<stateType>({

        educateData: []
         })

      const getTrainInfo = async () => {
        let res = await riskWarningApi().getTrainInfo();
        if (res.data.code === '200') {
          state.educateData = res.data.data
          initEducate(state.educateData)
          context.emit('getData',state.educateData)
        } else {
          ElMessage({
            type: 'warning',
            message: res.data.msg
          });
        }
      }


         type EChartsOption = echarts.EChartsOption
         // 隐患整改情况
         const initEducate =()=>{
         const initEducate =(data)=>{
            let dom = document.getElementById(educate.value);
            let myChart = echarts.init(dom);

@@ -46,7 +64,6 @@
            option = {
               color: ['#67F9D8', '#FFE434', '#56A3F1', '#FF917C'],
               legend: {
                  top: '8%',
                  left: 'center',
                  itemWidth: fontSize(10),
                  itemHeight: fontSize(8),
@@ -57,12 +74,11 @@
               },
               radar: [
                  {
                     indicator: [
                        { name: '设计培训次数' },
                        { name: '培训时间（小时）' },
                        { name: '完成比例（%）' }
                     ],
                     center: ['50%', '60%'],
                     indicator: data.map(i=>{
                const {name} = i
                return {name}
              }),
                     center: ['50%', '50%'],
                     radius: fontSize(65),
                     startAngle: 90,
                     splitNumber: 4,
@@ -70,8 +86,8 @@
                     axisName: {
                        formatter: '{value}',
                        color: '#428BD4',
                        fontSize: fontSize(10),
                        width: 20,
                        fontSize: fontSize(9),
                        width: 10,
                        overflow: 'break'
                     },
                     splitArea: {
@@ -103,15 +119,7 @@
                     },
                     data: [
                        {
                           value: [100, 8, 0.4, -80, 2000],
                           name: '企业汇总'
                        },
                        {
                           value: [60, 5, 0.3, -100, 1500],
                           name: '事业部A',
                           areaStyle: {
                              color: 'rgba(255, 228, 52, 0.6)'
                           }
                           value: data.map(i=>i.count),
                        }
                     ]
                  },
@@ -130,7 +138,7 @@

         // 页面载入时执行方法
         onMounted(() => {
            initEducate();
        getTrainInfo()
         });

         return {