MOC

master/src/main/java/com/ruoyi/project/process/controller/TMocController.java

@@ -13,8 +13,7 @@ import com.ruoyi.framework.config.RuoYiConfig;
 import com.ruoyi.project.common.domain.DataEntity;
 import com.ruoyi.project.common.domain.TCommonfile;
 import com.ruoyi.project.common.service.ITCommonfileService;
-import com.ruoyi.project.process.controller.vo.AreaVO;
-import com.ruoyi.project.process.controller.vo.DelayVO;
+import com.ruoyi.project.process.controller.vo.*;
 import com.ruoyi.project.process.mapper.TMocMapper;
 import com.ruoyi.project.system.domain.SysDept;
 import com.ruoyi.project.system.domain.SysDictData;
@@ -67,6 +66,125 @@ public class TMocController extends BaseController
     @Autowired
     private ITCommonfileService commonfileService;
 
+    // 堵漏日期统计
+    @GetMapping("/sealDateData")
+    public List<DataEntity> sealDateData(SealDateVO sealDateVO)
+    {
+        return tMocMapper.selectSealDateData(sealDateVO);
+    }
+
+    // 部门统计
+    @GetMapping("/departmentData")
+    public List<DataEntity> departmentData(DepartmentVO departmentVO)
+    {
+        return tMocMapper.selectDepartmentData(departmentVO);
+    }
+    // 泄露位置统计
+    @GetMapping("/leakLocationData")
+    public List<DataEntity> leakLocationData(LeakLocationVO leakLocationVO)
+    {
+        return tMocMapper.selectLeakLocationData(leakLocationVO);
+    }
+
+    // 介质类型统计
+    @GetMapping("/materialTypeData")
+    public List<DataEntity> materialTypeData(MaterialTypeVO materialTypeVO)
+    {
+        return tMocMapper.selectMaterialTypeData(materialTypeVO);
+    }
+
+    // 卡具状态统计
+    @GetMapping("/statusData")
+    public List<DataEntity> statusData(StatusVO statusVO)
+    {
+        List<DataEntity> statuslList = tMocMapper.selectStatusData(statusVO);
+        List<SysDictData> dictList = iSysDictTypeService.selectDictDataByType("MOC_STATUS");
+        for (DataEntity d: statuslList
+        ) {
+            for (SysDictData s: dictList
+            ) {
+                if (StringUtils.isBlank(d.getDataName())){
+                    d.setDataName("未知");
+                    break;
+                }
+                if (s.getDictValue().equals(d.getDataName())){
+                    d.setDataName(s.getDictLabel());
+                    break;
+                }
+            }
+        }
+        return statuslList;
+    }
+
+    // 临时MOC统计
+    @GetMapping("/tempStateData")
+    public List<DataEntity> tempStateData(TempStateVO tempStateVO)
+    {
+        List<DataEntity> riskLevelList = tMocMapper.selectTempStateData(tempStateVO);
+        List<SysDictData> dictList = iSysDictTypeService.selectDictDataByType("TEMP_STATE");
+        for (DataEntity d: riskLevelList
+        ) {
+            for (SysDictData s: dictList
+            ) {
+                if (StringUtils.isBlank(d.getDataName())){
+                    d.setDataName("未知");
+                    break;
+                }
+                if (s.getDictValue().equals(d.getDataName())){
+                    d.setDataName(s.getDictLabel());
+                    break;
+                }
+            }
+        }
+        return riskLevelList;
+    }
+
+    // 风险等级统计
+    @GetMapping("/riskLevelData")
+    public List<DataEntity> riskLevelData(RiskLevelVO riskLevelVO)
+    {
+        List<DataEntity> riskLevelList = tMocMapper.selectRiskLevelData(riskLevelVO);
+        List<SysDictData> dictList = iSysDictTypeService.selectDictDataByType("MOC_RISKLEVEL");
+        for (DataEntity d: riskLevelList
+        ) {
+            for (SysDictData s: dictList
+            ) {
+                if (StringUtils.isBlank(d.getDataName())){
+                    d.setDataName("未知");
+                    break;
+                }
+                if (s.getDictValue().equals(d.getDataName())){
+                    d.setDataName(s.getDictLabel());
+                    break;
+                }
+            }
+        }
+        return riskLevelList;
+    }
+
+    // MC情况统计
+    @GetMapping("/mcDetailData")
+    public List<DataEntity> mcDetailData(McDetailVO mcDetailVO)
+    {
+        List<DataEntity> mocDetailList = tMocMapper.selectMcDetailData(mcDetailVO);
+        List<SysDictData> dictList = iSysDictTypeService.selectDictDataByType("MC_DETAIL");
+        for (DataEntity d: mocDetailList
+        ) {
+            for (SysDictData s: dictList
+            ) {
+                if (StringUtils.isBlank(d.getDataName())){
+                    d.setDataName("未知");
+                    break;
+                }
+                if (s.getDictValue().equals(d.getDataName())){
+                    d.setDataName(s.getDictLabel());
+                    break;
+                }
+            }
+        }
+        return mocDetailList;
+    }
+
     // 区域统计
     @GetMapping("/areaData")
     public List<DataEntity> areaData(AreaVO areaVO)

master/src/main/java/com/ruoyi/project/process/controller/vo/DepartmentVO.java

@@ -0,0 +1,32 @@
+package com.ruoyi.project.process.controller.vo;
+
+/**
+ * @author Wang Zi Wen
+ * @email wangggziwen@163.com
+ * @date 2023/02/17 13:12:47
+ */
+public class DepartmentVO {
+    private static final long serialVersionUID = 1L;
+
+    /** 临时/永久 */
+    private String timeliness;
+
+    /** 临时MOC类别 */
+    private String tempCategory;
+
+    public String getTempCategory() {
+        return tempCategory;
+    }
+
+    public void setTempCategory(String tempCategory) {
+        this.tempCategory = tempCategory;
+    }
+
+    public String getTimeliness() {
+        return timeliness;
+    }
+
+    public void setTimeliness(String timeliness) {
+        this.timeliness = timeliness;
+    }
+}

master/src/main/java/com/ruoyi/project/process/controller/vo/LeakLocationVO.java

@@ -0,0 +1,32 @@
+package com.ruoyi.project.process.controller.vo;
+
+/**
+ * @author Wang Zi Wen
+ * @email wangggziwen@163.com
+ * @date 2023/02/17 13:12:47
+ */
+public class LeakLocationVO {
+    private static final long serialVersionUID = 1L;
+
+    /** 临时/永久 */
+    private String timeliness;
+
+    /** 临时MOC类别 */
+    private String tempCategory;
+
+    public String getTempCategory() {
+        return tempCategory;
+    }
+
+    public void setTempCategory(String tempCategory) {
+        this.tempCategory = tempCategory;
+    }
+
+    public String getTimeliness() {
+        return timeliness;
+    }
+
+    public void setTimeliness(String timeliness) {
+        this.timeliness = timeliness;
+    }
+}

master/src/main/java/com/ruoyi/project/process/controller/vo/MaterialTypeVO.java

@@ -0,0 +1,32 @@
+package com.ruoyi.project.process.controller.vo;
+
+/**
+ * @author Wang Zi Wen
+ * @email wangggziwen@163.com
+ * @date 2023/02/17 13:12:47
+ */
+public class MaterialTypeVO {
+    private static final long serialVersionUID = 1L;
+
+    /** 临时/永久 */
+    private String timeliness;
+
+    /** 临时MOC类别 */
+    private String tempCategory;
+
+    public String getTempCategory() {
+        return tempCategory;
+    }
+
+    public void setTempCategory(String tempCategory) {
+        this.tempCategory = tempCategory;
+    }
+
+    public String getTimeliness() {
+        return timeliness;
+    }
+
+    public void setTimeliness(String timeliness) {
+        this.timeliness = timeliness;
+    }
+}

master/src/main/java/com/ruoyi/project/process/controller/vo/McDetailVO.java

@@ -0,0 +1,21 @@
+package com.ruoyi.project.process.controller.vo;
+
+/**
+ * @author Wang Zi Wen
+ * @email wangggziwen@163.com
+ * @date 2023/02/17 13:12:47
+ */
+public class McDetailVO {
+    private static final long serialVersionUID = 1L;
+
+    /** 临时/永久 */
+    private String timeliness;
+
+    public String getTimeliness() {
+        return timeliness;
+    }
+
+    public void setTimeliness(String timeliness) {
+        this.timeliness = timeliness;
+    }
+}

master/src/main/java/com/ruoyi/project/process/controller/vo/RiskLevelVO.java

@@ -0,0 +1,21 @@
+package com.ruoyi.project.process.controller.vo;
+
+/**
+ * @author Wang Zi Wen
+ * @email wangggziwen@163.com
+ * @date 2023/02/17 13:12:47
+ */
+public class RiskLevelVO {
+    private static final long serialVersionUID = 1L;
+
+    /** 临时/永久 */
+    private String timeliness;
+
+    public String getTimeliness() {
+        return timeliness;
+    }
+
+    public void setTimeliness(String timeliness) {
+        this.timeliness = timeliness;
+    }
+}

master/src/main/java/com/ruoyi/project/process/controller/vo/SealDateVO.java

@@ -0,0 +1,32 @@
+package com.ruoyi.project.process.controller.vo;
+
+/**
+ * @author Wang Zi Wen
+ * @email wangggziwen@163.com
+ * @date 2023/02/17 13:12:47
+ */
+public class SealDateVO {
+    private static final long serialVersionUID = 1L;
+
+    /** 临时/永久 */
+    private String timeliness;
+
+    /** 临时MOC类别 */
+    private String tempCategory;
+
+    public String getTempCategory() {
+        return tempCategory;
+    }
+
+    public void setTempCategory(String tempCategory) {
+        this.tempCategory = tempCategory;
+    }
+
+    public String getTimeliness() {
+        return timeliness;
+    }
+
+    public void setTimeliness(String timeliness) {
+        this.timeliness = timeliness;
+    }
+}

master/src/main/java/com/ruoyi/project/process/controller/vo/StatusVO.java

@@ -0,0 +1,32 @@
+package com.ruoyi.project.process.controller.vo;
+
+/**
+ * @author Wang Zi Wen
+ * @email wangggziwen@163.com
+ * @date 2023/02/17 13:12:47
+ */
+public class StatusVO {
+    private static final long serialVersionUID = 1L;
+
+    /** 临时/永久 */
+    private String timeliness;
+
+    /** 临时MOC类别 */
+    private String tempCategory;
+
+    public String getTempCategory() {
+        return tempCategory;
+    }
+
+    public void setTempCategory(String tempCategory) {
+        this.tempCategory = tempCategory;
+    }
+
+    public String getTimeliness() {
+        return timeliness;
+    }
+
+    public void setTimeliness(String timeliness) {
+        this.timeliness = timeliness;
+    }
+}

master/src/main/java/com/ruoyi/project/process/controller/vo/TempStateVO.java

@@ -0,0 +1,21 @@
+package com.ruoyi.project.process.controller.vo;
+
+/**
+ * @author Wang Zi Wen
+ * @email wangggziwen@163.com
+ * @date 2023/02/17 13:12:47
+ */
+public class TempStateVO {
+    private static final long serialVersionUID = 1L;
+
+    /** 临时/永久 */
+    private String timeliness;
+
+    public String getTimeliness() {
+        return timeliness;
+    }
+
+    public void setTimeliness(String timeliness) {
+        this.timeliness = timeliness;
+    }
+}

master/src/main/java/com/ruoyi/project/process/mapper/TMocMapper.java

@@ -5,7 +5,7 @@ import java.util.Map;
 
 import com.ruoyi.framework.aspectj.lang.annotation.DataScope;
 import com.ruoyi.project.common.domain.DataEntity;
-import com.ruoyi.project.process.controller.vo.AreaVO;
+import com.ruoyi.project.process.controller.vo.*;
 import com.ruoyi.project.process.domain.TMoc;
 
 /**
@@ -77,5 +77,21 @@ public interface TMocMapper
 
     List<DataEntity> selectMocData();
 
+    List<DataEntity> selectDepartmentData(DepartmentVO departmentVO);
+
+    List<DataEntity> selectLeakLocationData(LeakLocationVO leakLocationVO);
+
+    List<DataEntity> selectMaterialTypeData(MaterialTypeVO materialTypeVO);
+
     List<DataEntity> selectAreaData(AreaVO areaVO);
+
+    List<DataEntity> selectMcDetailData(McDetailVO mcDetailVO);
+
+    List<DataEntity> selectRiskLevelData(RiskLevelVO riskLevelVO);
+
+    List<DataEntity> selectTempStateData(TempStateVO tempStateVO);
+
+    List<DataEntity> selectStatusData(StatusVO statusVO);
+
+    List<DataEntity> selectSealDateData(SealDateVO sealDateVO);
 }

master/src/main/resources/mybatis/process/TMocMapper.xml

@@ -469,11 +469,112 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             resultType="com.ruoyi.project.common.domain.DataEntity">
         SELECT count(1) as dataNum, area as dataName FROM t_moc d
         <where>
-            d.timeliness = #{timeliness}
+            and d.timeliness = #{timeliness}
             and d.del_flag = 0
         </where>
         GROUP BY area
         order by dataName
     </select>
 
+    <select id="selectMcDetailData"
+            parameterType="com.ruoyi.project.process.controller.vo.McDetailVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
+        SELECT count(1) as dataNum, MC_DETAIL as dataName FROM t_moc d
+        <where>
+            and d.timeliness = #{timeliness}
+            and d.del_flag = 0
+        </where>
+        GROUP BY MC_DETAIL
+        order by dataName
+    </select>
+
+    <select id="selectRiskLevelData"
+            parameterType="com.ruoyi.project.process.controller.vo.RiskLevelVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
+        SELECT count(1) as dataNum, RISK_LEVEL as dataName FROM t_moc d
+        <where>
+            and d.timeliness = #{timeliness}
+            and d.del_flag = 0
+        </where>
+        GROUP BY RISK_LEVEL
+        order by dataName
+    </select>
+
+    <select id="selectTempStateData"
+            parameterType="com.ruoyi.project.process.controller.vo.TempStateVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
+        SELECT count(1) as dataNum, TEMP_STATE as dataName FROM t_moc d
+        <where>
+            and d.timeliness = #{timeliness}
+            and d.del_flag = 0
+        </where>
+        GROUP BY TEMP_STATE
+        order by dataName
+    </select>
+
+    <select id="selectStatusData"
+            parameterType="com.ruoyi.project.process.controller.vo.StatusVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
+        SELECT count(1) as dataNum, status as dataName FROM t_moc d
+        <where>
+            and d.timeliness = #{timeliness}
+            and d.temp_category = #{tempCategory}
+            and d.del_flag = 0
+        </where>
+        GROUP BY status
+        order by dataName
+    </select>
+
+    <select id="selectDepartmentData"
+            parameterType="com.ruoyi.project.process.controller.vo.DepartmentVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
+        SELECT count(1) as dataNum, DEPARTMENT as dataName FROM t_moc d
+        <where>
+            and d.timeliness = #{timeliness}
+            and d.temp_category = #{tempCategory}
+            and d.del_flag = 0
+        </where>
+        GROUP BY DEPARTMENT
+        order by dataName
+    </select>
+
+    <select id="selectLeakLocationData"
+            parameterType="com.ruoyi.project.process.controller.vo.LeakLocationVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
+        SELECT count(1) as dataNum, LEAK_LOCATION as dataName FROM t_moc d
+        <where>
+            and d.timeliness = #{timeliness}
+            and d.temp_category = #{tempCategory}
+            and d.del_flag = 0
+        </where>
+        GROUP BY LEAK_LOCATION
+        order by dataName
+    </select>
+
+    <select id="selectMaterialTypeData"
+            parameterType="com.ruoyi.project.process.controller.vo.MaterialTypeVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
+        SELECT count(1) as dataNum, MATERIAL_TYPE as dataName FROM t_moc d
+        <where>
+            and d.timeliness = #{timeliness}
+            and d.temp_category = #{tempCategory}
+            and d.del_flag = 0
+        </where>
+        GROUP BY MATERIAL_TYPE
+        order by dataName
+    </select>
+
+    <select id="selectSealDateData"
+            parameterType="com.ruoyi.project.process.controller.vo.SealDateVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
+        SELECT count(1) as dataNum, extract(year from SEAL_DATE) as dataName FROM t_moc d
+        <where>
+            and d.timeliness = #{timeliness}
+            and d.temp_category = #{tempCategory}
+            and d.del_flag = 0
+        </where>
+        GROUP BY extract(year from SEAL_DATE)
+        order by dataName
+    </select>
+
 </mapper>

ui/src/api/process/moc.js

@@ -1,5 +1,77 @@
 import request from '@/utils/request'
 
+// 堵漏日期统计
+export function sealDateData(query) {
+  return request({
+    url: '/process/moc/sealDateData',
+    method: 'get',
+    params: query
+  })
+}
+
+// 介质类型统计
+export function materialTypeData(query) {
+  return request({
+    url: '/process/moc/materialTypeData',
+    method: 'get',
+    params: query
+  })
+}
+
+// 泄露位置统计
+export function leakLocationData(query) {
+  return request({
+    url: '/process/moc/leakLocationData',
+    method: 'get',
+    params: query
+  })
+}
+
+// 部门统计
+export function departmentData(query) {
+  return request({
+    url: '/process/moc/departmentData',
+    method: 'get',
+    params: query
+  })
+}
+
+// 卡具状态统计
+export function statusData(query) {
+  return request({
+    url: '/process/moc/statusData',
+    method: 'get',
+    params: query
+  })
+}
+
+// 临时MOC状态统计
+export function tempStateData(query) {
+  return request({
+    url: '/process/moc/tempStateData',
+    method: 'get',
+    params: query
+  })
+}
+
+// 风险等级统计
+export function riskLevelData(query) {
+  return request({
+    url: '/process/moc/riskLevelData',
+    method: 'get',
+    params: query
+  })
+}
+
+// MC情况统计
+export function mcDetailData(query) {
+  return request({
+    url: '/process/moc/mcDetailData',
+    method: 'get',
+    params: query
+  })
+}
+
 // 区域统计
 export function areaData(query) {
   return request({

ui/src/views/process/moc/aquifier/index.vue

@@ -46,25 +46,6 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <!--<el-form-item :label="$t('项目号')" label-width="50" prop="projectNo">-->
-        <!--<el-input-->
-          <!--v-model="queryParams.projectNo"-->
-          <!--:placeholder="$t('请输入') + $t('项目号')"-->
-          <!--clearable-->
-          <!--size="small"-->
-          <!--@keyup.enter.native="handleQuery"-->
-        <!--/>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('区域')" prop="area">-->
-        <!--<el-select v-model="queryParams.area" :placeholder="$t('请选择') + $t('区域')">-->
-          <!--<el-option-->
-            <!--v-for="dict in areaOptions"-->
-            <!--:key="dict.dictValue"-->
-            <!--:label="dict.dictLabel"-->
-            <!--:value="dict.dictValue"-->
-          <!--&gt;</el-option>-->
-        <!--</el-select>-->
-      <!--</el-form-item>-->
       <el-form-item :label="$t('标题')" prop="title">
         <el-input
           v-model="queryParams.title"
@@ -192,50 +173,6 @@
                         :placeholder="$t('请选择') + $t('到期时间')">
         </el-date-picker>
       </el-form-item>
-      <!--<el-form-item :label="$t('MOC类型')" prop="mocType">-->
-        <!--<el-select v-model="queryParams.mocType" :placeholder="$t('请选择') + $t('MOC类型')">-->
-          <!--<el-option-->
-            <!--v-for="dict in areaOptions"-->
-            <!--:key="dict.dictValue"-->
-            <!--:label="dict.dictLabel"-->
-            <!--:value="dict.dictValue"-->
-          <!--&gt;</el-option>-->
-        <!--</el-select>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('负责人')" prop="owner">-->
-        <!--<el-input-->
-          <!--v-model="queryParams.owner"-->
-          <!--:placeholder="$t('请输入') + $t('负责人')"-->
-          <!--clearable-->
-          <!--size="small"-->
-          <!--@keyup.enter.native="handleQuery"-->
-        <!--/>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('申请时间')" prop="approveTime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                        <!--v-model="queryParams.approveTime"-->
-                        <!--type="date"-->
-                        <!--value-format="yyyy-MM-dd"-->
-                        <!--:placeholder="$t('请选择') + $t('申请时间')">-->
-        <!--</el-date-picker>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('MC时间')" prop="mcTime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                        <!--v-model="queryParams.mcTime"-->
-                        <!--type="date"-->
-                        <!--value-format="yyyy-MM-dd"-->
-                        <!--:placeholder="$t('请选择') + $t('MC时间')">-->
-        <!--</el-date-picker>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('MC情况')" prop="mcDetail">-->
-        <!--<el-input-->
-          <!--v-model="queryParams.mcDetail"-->
-          <!--:placeholder="$t('请输入') + $t('MC情况')"-->
-          <!--clearable-->
-          <!--size="small"-->
-          <!--@keyup.enter.native="handleQuery"-->
-        <!--/>-->
-      <!--</el-form-item>-->
       <el-form-item :label="$t('备注')" prop="remarks">
         <el-input
           v-model="queryParams.remarks"
@@ -245,103 +182,6 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <!--<el-form-item :label="$t('风险等级')" prop="riskLevel">-->
-        <!--<el-input-->
-          <!--v-model="queryParams.riskLevel"-->
-          <!--:placeholder="$t('请输入') + $t('风险等级')"-->
-          <!--clearable-->
-          <!--size="small"-->
-          <!--@keyup.enter.native="handleQuery"-->
-        <!--/>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('EHS评估/审查')" prop="ehsCheck">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                        <!--v-model="queryParams.ehsCheck"-->
-                        <!--type="date"-->
-                        <!--value-format="yyyy-MM-dd"-->
-                        <!--:placeholder="$t('请选择') + $t('EHS评估/审查')">-->
-        <!--</el-date-picker>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('培训')" prop="training">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                        <!--v-model="queryParams.training"-->
-                        <!--type="date"-->
-                        <!--value-format="yyyy-MM-dd"-->
-                        <!--:placeholder="$t('请选择') + $t('培训')"-->
-                        <!--:picker-options="trainingDatePicker">-->
-        <!--</el-date-picker>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('PID更新')" prop="pidMaster">-->
-        <!--<el-select v-model="queryParams.pidMaster" :placeholder="$t('请选择') + $t('PID更新')">-->
-          <!--<el-option-->
-            <!--v-for="dict in pidMasterOptions"-->
-            <!--:key="dict.dictValue"-->
-            <!--:label="dict.dictLabel"-->
-            <!--:value="dict.dictValue"-->
-          <!--&gt;</el-option>-->
-        <!--</el-select>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('SOP更新')" prop="sopUpdate">-->
-        <!--<el-select v-model="queryParams.sopUpdate" :placeholder="$t('请选择') + $t('SOP更新')">-->
-          <!--<el-option-->
-            <!--v-for="dict in sopUpdateOptions"-->
-            <!--:key="dict.dictValue"-->
-            <!--:label="dict.dictLabel"-->
-            <!--:value="dict.dictValue"-->
-          <!--&gt;</el-option>-->
-        <!--</el-select>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('文档更新')" prop="docUpdate">-->
-        <!--<el-select v-model="queryParams.docUpdate" :placeholder="$t('请选择') + $t('文档更新')">-->
-          <!--<el-option-->
-            <!--v-for="dict in docUpdateOptions"-->
-            <!--:key="dict.dictValue"-->
-            <!--:label="dict.dictLabel"-->
-            <!--:value="dict.dictValue"-->
-          <!--&gt;</el-option>-->
-        <!--</el-select>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item label="PSSR" prop="pssr">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                        <!--v-model="queryParams.pssr"-->
-                        <!--type="date"-->
-                        <!--value-format="yyyy-MM-dd"-->
-                        <!--:placeholder="$t('请选择') + 'PSSR'"-->
-                        <!--:picker-options="pssrDatePicker">-->
-        <!--</el-date-picker>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('PSSR编号')" prop="pssrNo">-->
-        <!--<el-input v-model="queryParams.pssrNo" :placeholder="$t('请输入') + $t('PSSR编号')" />-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('CTE工作号')" label-width="120" prop="cteNo">-->
-      <!--<el-input-->
-      <!--v-model="queryParams.cteNo"-->
-      <!--:placeholder="$t('请输入') + $t('CTE工作号')"-->
-      <!--clearable-->
-      <!--size="small"-->
-      <!--@keyup.enter.native="handleQuery"-->
-      <!--/>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('实施情况')" prop="trueState" label-width="150">-->
-      <!--<el-select v-model="queryParams.trueState" :placeholder="$t('请选择') + $t('实施情况')" clearable size="small">-->
-      <!--<el-option-->
-      <!--v-for="dict in trueStateOptions"-->
-      <!--:key="dict.dictValue"-->
-      <!--:label="dict.dictLabel"-->
-      <!--:value="dict.dictValue"-->
-      <!--/>-->
-      <!--</el-select>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('变更性质')" prop="changeNature" label-width="150">-->
-      <!--<el-select v-model="queryParams.changeNature" :placeholder="$t('请选择') + $t('变更性质')" clearable size="small">-->
-      <!--<el-option-->
-      <!--v-for="dict in changeNatureOptions"-->
-      <!--:key="dict.dictValue"-->
-      <!--:label="dict.dictLabel"-->
-      <!--:value="dict.dictValue"-->
-      <!--/>-->
-      <!--</el-select>-->
-      <!--</el-form-item>-->
       <el-form-item>
         <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('搜索') }}</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{ $t('重置') }}</el-button>
@@ -396,38 +236,62 @@
       <!--v-hasPermi="['process:moc:export']"-->
       <!--&gt;{{ $t('导出') }}</el-button>-->
       <!--</el-col>-->
-      <!--<el-col :span="1.5">-->
-        <!--<el-button-->
-          <!--type="primary"-->
-          <!--icon="el-icon-s-data"-->
-          <!--size="mini"-->
-          <!--@click="handleData"-->
-        <!--&gt;{{ $t('数据分析') }}</el-button>-->
-      <!--</el-col>-->
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
     <el-table v-loading="loading" :data="mocList" @selection-change="handleSelectionChange" :cell-style="tableCellStyle" :cell-class-name="tableCellClassName" :height="clientHeight" border>
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column :label="$t('MOC编号')" align="center" width="120" prop="mocNo" :show-overflow-tooltip="true"/>
-      <!--<el-table-column :label="$t('装置编号')" align="center" width="120" prop="plantNumber" :show-overflow-tooltip="true"/>-->
       <el-table-column :label="$t('公司MOC编号')" align="center" width="120" prop="companyMocNo" :show-overflow-tooltip="true"/>
       <el-table-column :label="$t('工艺单元')" align="center" width="120" prop="processUnit" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('部门')" align="center" width="120" prop="department" :show-overflow-tooltip="true" />
-      <el-table-column :label="$t('泄露位置')" align="center" width="120" prop="leakLocation" :show-overflow-tooltip="true"/>
-      <!--<el-table-column :label="$t('项目号')" align="center" width="120" prop="projectNo" :show-overflow-tooltip="true"/>-->
-      <!--<el-table-column :label="$t('区域')" align="center" prop="area" :formatter="areaFormat" />-->
+      <el-table-column :label="$t('部门')" align="center" prop="department">
+        <template slot="header">
+          <span
+            @click="departmentChart.open = true"
+            id="department">
+            部门
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('泄露位置')" align="center" prop="leakLocation">
+        <template slot="header">
+          <span
+            @click="leakLocationChart.open = true"
+            id="leakLocation">
+            泄露位置
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('标题')" align="center" width="320" prop="title" :show-overflow-tooltip="true"/>
       <el-table-column :label="$t('操作压力 (MPaG)')" align="center" width="150" prop="pressure" :show-overflow-tooltip="true"/>
       <el-table-column :label="$t('操作温度 (℃)')" align="center" width="120" prop="temperature" :show-overflow-tooltip="true"/>
       <el-table-column :label="$t('泄露介质')" align="center" width="100" prop="leakFluid" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('介质类型')" align="center" width="100" prop="materialType" :show-overflow-tooltip="true"/>
+      <el-table-column :label="$t('介质类型')" align="center" prop="materialType">
+        <template slot="header">
+          <span
+            @click="materialTypeChart.open = true"
+            id="materialType">
+            介质类型
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('方案日期')" align="center" prop="planDate" width="100">
         <template slot-scope="scope">
         <span>{{ parseTime(scope.row.planDate, '{y}-{m}-{d}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column :label="$t('堵漏日期')" align="center" prop="sealDate" width="100">
+      <el-table-column :label="$t('堵漏日期')" align="center" prop="sealDate">
+        <template slot="header">
+          <span
+            @click="sealDateChart.open = true"
+            id="sealDate">
+            堵漏日期
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
         <template slot-scope="scope">
           <span>{{ parseTime(scope.row.sealDate, '{y}-{m}-{d}') }}</span>
         </template>
@@ -491,81 +355,17 @@
           <span>{{ parseTime(scope.row.expTime, '{y}-{m}-{d}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column :label="$t('卡具状态')" align="center" width="100" prop="status" :show-overflow-tooltip="true" :formatter="mocStatusFormat"/>
-      <!--<el-table-column prop="mocType" align="center" :show-overflow-tooltip="true" :formatter="mocTypeFormat" width="120">-->
-        <!--<template slot="header">-->
-          <!--MOC类型-->
-          <!--<span-->
-            <!--@click="mocTypeInfo.open = true"-->
-            <!--@click="mocTypeInfo.open = true"-->
-            <!--@click="mocTypeInfo.open = true"-->
-            <!--id="moc-type">-->
-            <!--<i class="el-icon-question"></i>-->
-          <!--</span>-->
-        <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('负责人')" align="center" prop="owner" :show-overflow-tooltip="true"/>-->
-      <!--<el-table-column :label="$t('申请时间')" align="center" prop="approveTime" width="100">-->
-        <!--<template slot-scope="scope">-->
-          <!--<span>{{ parseTime(scope.row.approveTime, '{y}-{m}-{d}') }}</span>-->
-        <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('完成时间')" align="center" prop="endtime" width="100">-->
-      <!--<template slot-scope="scope">-->
-      <!--<span>{{ parseTime(scope.row.endtime, '{y}-{m}-{d}') }}</span>-->
-      <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('实施情况')" align="center" prop="trueState" :formatter="trueStateFormat" />-->
-      <!--<el-table-column :label="$t('变更性质')" align="center" prop="changeNature" :formatter="changeNatureFormat" />-->
-      <!--<el-table-column :label="$t('到期时间')" align="center" prop="overTime" width="100">-->
-      <!--<template slot-scope="scope">-->
-      <!--<span v-if="scope.row.overTime !== 'N.A.'">{{ parseTime(scope.row.overTime, '{y}-{m}-{d}') }}</span>-->
-      <!--<span v-if="scope.row.overTime === 'N.A.'">{{ scope.row.overTime }}</span>-->
-      <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('临时MOC状态')" align="center" prop="temporaryState" :formatter="temporaryStateFormat" />-->
-      <!--<el-table-column :label="$t('MC时间')" align="center" prop="mcTime" :show-overflow-tooltip="true" width="100"/>-->
-      <!--<el-table-column :label="$t('MC情况')" align="center" prop="mcDetail" :show-overflow-tooltip="true" width="100" :formatter="mcDetailFormat" />-->
-      <el-table-column :label="$t('备注')" align="center" prop="remarks" :show-overflow-tooltip="true" width="130" />
-      <!--<el-table-column :label="$t('风险等级')" align="center" prop="riskLevel" :formatter="riskLevelFormat" />-->
-      <!--<el-table-column :label="$t('EHS评估/审查')" align="center" width="130" prop="ehsCheck" :show-overflow-tooltip="true">-->
-        <!--<template slot-scope="scope">-->
-          <!--<span> {{scope.row.ehsCheck}}</span>-->
-          <!--<el-button icon="el-icon-folder" style="color:#6e96fa" v-if="scope.row.ehsCheck !== null" @click="handleDoc(scope.row , 'moc-ehsCheck')"  circle></el-button>-->
-        <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('培训')" align="center" width="130" prop="training" :show-overflow-tooltip="true">-->
-        <!--<template slot-scope="scope">-->
-          <!--<span> {{scope.row.training}}</span>-->
-          <!--<el-button icon="el-icon-folder" style="color:#6e96fa;" v-if="scope.row.training !== null" @click="handleDoc(scope.row , 'moc-training')"  circle></el-button>-->
-        <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('SOP更新')" align="center" prop="sopUpdate" :formatter="sopUpdateFormat" />-->
-      <!--<el-table-column :label="$t('PID更新')" align="center" prop="pidMaster" :formatter="pidMasterFormat" />-->
-      <!--<el-table-column :label="$t('文档更新')" align="center" prop="docUpdate" :formatter="docUpdateFormat" />-->
-      <!--<el-table-column label="PSSR" align="center" width="130" prop="pssr" :show-overflow-tooltip="true">-->
-        <!--<template slot-scope="scope">-->
-          <!--<span> {{scope.row.pssr}}</span>-->
-          <!--<el-button icon="el-icon-folder" style="color:#6e96fa;" v-if="scope.row.pssr !== null" @click="handleDoc(scope.row , 'moc-pssr')"  circle></el-button>-->
-        <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('PSSR编号')" align="center" prop="pssrNo" width="130" />-->
-      <!--<el-table-column :label="$t('通知单')" align="center" prop="noticeLetter" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('工作单')" align="center" prop="workLetter" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('CTE工作号')" align="center" prop="cteNo" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('投资费用(RMB)')" align="center" prop="investCost" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('类别')" align="center" prop="category" :formatter="categoryFormat" />
-      <el-table-column :label="$t('重要性')" align="center" prop="significance" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('分类')" align="center" width="120" prop="classification" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('仪表控制')" align="center" prop="dashControl" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('预计完成时间')" align="center" prop="estimateEndtime" width="100">
-        <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.estimateEndtime, '{y}-{m}-{d}') }}</span>
+      <el-table-column :label="$t('卡具状态')" align="center" prop="status" :formatter="mocStatusFormat">
+        <template slot="header">
+          <span
+            @click="statusChart.open = true"
+            id="status">
+            卡具状态
+            <i class="el-icon-s-data"></i>
+          </span>
         </template>
       </el-table-column>
-      <el-table-column :label="$t('EHS审查数据库')" align="center" prop="ehsDb" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('PSSR数据库')" align="center" prop="pssrDb" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('CAPEX计划')" align="center" prop="capex" :show-overflow-tooltip="true"/>-->
+      <el-table-column :label="$t('备注')" align="center" prop="remarks" :show-overflow-tooltip="true" width="130" />
       <el-table-column :label="$t('操作')" align="center" fixed="right" width="240" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -627,7 +427,6 @@
         <el-button @click="cancelDelay">{{ $t('取 消') }}</el-button>
       </div>
     </el-dialog>
-
     <!-- 添加或修改MOC管理对话框 -->
     <el-dialog v-dialogDrag :title="title" :visible.sync="open" width="500px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
@@ -1119,6 +918,42 @@
         <el-button type="primary" @click="mocTypeInfo.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
+    <!-- 卡具状态对话框 -->
+    <el-dialog v-dialogDrag :title="statusChart.title" :visible.sync="statusChart.open" width="500px" append-to-body>
+      <status-chart :timeliness="2" :tempCategory="1"></status-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="statusChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+    <!-- 部门对话框 -->
+    <el-dialog v-dialogDrag :title="departmentChart.title" :visible.sync="departmentChart.open" width="500px" append-to-body>
+      <department-chart :timeliness="2" :tempCategory="1"></department-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="departmentChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+    <!-- 泄露位置对话框 -->
+    <el-dialog v-dialogDrag :title="leakLocationChart.title" :visible.sync="leakLocationChart.open" width="500px" append-to-body>
+      <leak-location-chart :timeliness="2" :tempCategory="1"></leak-location-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="leakLocationChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+    <!-- 介质类型对话框 -->
+    <el-dialog v-dialogDrag :title="materialTypeChart.title" :visible.sync="materialTypeChart.open" width="500px" append-to-body>
+      <material-type-chart :timeliness="2" :tempCategory="1"></material-type-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="materialTypeChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+    <!-- 堵漏日期对话框 -->
+    <el-dialog v-dialogDrag :title="sealDateChart.title" :visible.sync="sealDateChart.open" width="500px" append-to-body>
+      <seal-date-chart :timeliness="2" :tempCategory="1"></seal-date-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="sealDateChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+
     <el-drawer
       :title="$t('数据分析')"
       size="600px"
@@ -1211,17 +1046,16 @@
   import { getToken } from "@/utils/auth";
   import Treeselect from "@riophae/vue-treeselect";
   import "@riophae/vue-treeselect/dist/vue-treeselect.css";
-  // import YearChart from "./yearChart";
-  // import TrueStateData from "./trueStateData";
-  // import ChangeData from "./changeData";
-  // import CategoryData from "./categoryData";
-  // import RiskData from "./riskData";
-
   import {addCommonfile, allFileList, delCommonfile, updateCommonfile} from "@/api/common/commonfile";
+  import statusChart from "../chart/statusChart";
+  import departmentChart from "../chart/departmentChart";
+  import leakLocationChart from "../chart/leakLocationChart";
+  import materialTypeChart from "../chart/materialTypeChart";
+  import sealDateChart from "../chart/sealDateChart";
 
   export default {
     name: "Aquifier",
-    components: { Treeselect },
+    components: { sealDateChart, materialTypeChart, leakLocationChart, departmentChart, statusChart, Treeselect },
     data() {
       var validateDocUpdate = (rule, value, callback) => {
         if (value == 1) {
@@ -1235,6 +1069,26 @@
         }
       };
       return {
+        sealDateChart: {
+          open: false,
+          title: '堵漏日期数据统计'
+        },
+        materialTypeChart: {
+          open: false,
+            title: '介质类型数据统计'
+        },
+        leakLocationChart: {
+          open: false,
+            title: '泄露位置数据统计'
+        },
+        departmentChart: {
+          open: false,
+            title: '部门数据统计'
+        },
+        statusChart: {
+          open: false,
+          title: '卡具状态数据统计'
+        },
         delayForm: {
           id: null,
           extention: null,
@@ -2102,6 +1956,21 @@
   };
 </script>
 <style>
+  #sealDate:hover{
+    cursor: pointer;
+  }
+  #materialType:hover{
+    cursor: pointer;
+  }
+  #leakLocation:hover{
+    cursor: pointer;
+  }
+  #department:hover{
+    cursor: pointer;
+  }
+  #status:hover{
+    cursor: pointer;
+  }
   #moc-type:hover{
     cursor: pointer;
   }
@@ -2122,7 +1991,6 @@
   .clearfix:after {
     clear: both
   }
-
   .box-card {
     width: 100%;
   }

ui/src/views/process/moc/chart/departmentChart.vue

@@ -0,0 +1,107 @@
+<template>
+  <div>
+    <div id="departmentChart" :style="{width:width,height:height}"></div>
+  </div>
+</template>
+
+<script>
+  import { departmentData } from "@/api/process/moc";
+
+  export default {
+    props: {
+      timeliness: null,
+      tempCategory: null,
+      width: {
+        type: String,
+        default: '100%'
+      },
+      height: {
+        type: String,
+        default: '200px'
+      },
+    },
+    data() {
+      return {
+        option: {
+          title: {
+            left: 'center'
+          },
+          tooltip: {
+            trigger: 'item',
+            formatter: '{a} <br/>{b} : {c} ({d}%)'
+          },
+          legend: {
+            orient: 'vertical',
+            left: 'left',
+            data: []
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              mark: {show: true},
+              magicType: {
+                show: true,
+                type: ['pie', 'funnel']
+              },
+              restore: {show: true},
+              saveAsImage: {show: true}
+            }
+          },
+          series: [
+            {
+              label: {
+                formatter: '{b}: ({d}%)'
+              },
+              name: this.$t('区域'),
+              type: 'pie',
+              radius: ['50%', '70%'],
+              selectedMode: 'single',
+              data: [
+                {value: 335, name: this.$t('直接访问')},
+              ],
+              emphasis: {
+                label: {
+                  show: true,
+                  // fontSize: '21',
+                  fontWeight: 'bold'
+                }
+              },
+            }
+          ]
+        },
+        // 查询参数
+        queryParams: {
+          timeliness: null,
+          tempCategory: null,
+        },
+        chart: null,
+        chartData : []
+      }
+    },
+    mounted() {
+      this.$nextTick(() => {
+        this.queryParams.timeliness = this.timeliness;
+        this.queryParams.tempCategory = this.tempCategory;
+        departmentData(this.queryParams).then(response => {
+          this.chartData = response
+          for(let i = 0 ; i <this.chartData.length ; i++){
+            this.option.legend.data[i] = this.chartData[i].dataName
+            this.option.series[0].data[i] = {value:this.chartData[i].dataNum , name: this.chartData[i].dataName }
+          }
+          this.initChart()
+        });
+      })
+    },
+    methods: {
+      /** 获取当前年份 */
+      getNowTime() {
+        var now = new Date();
+      },
+      initChart() {
+        // 基于准备好的dom，初始化echarts实例
+        this.chart = this.echarts.init(document.getElementById('departmentChart'))
+        this.chart.setOption(this.option)
+      }
+    }
+  }
+</script>

ui/src/views/process/moc/chart/leakLocationChart.vue

@@ -0,0 +1,107 @@
+<template>
+  <div>
+    <div id="leakLocationChart" :style="{width:width,height:height}"></div>
+  </div>
+</template>
+
+<script>
+  import { leakLocationData } from "@/api/process/moc";
+
+  export default {
+    props: {
+      timeliness: null,
+      tempCategory: null,
+      width: {
+        type: String,
+        default: '100%'
+      },
+      height: {
+        type: String,
+        default: '200px'
+      },
+    },
+    data() {
+      return {
+        option: {
+          title: {
+            left: 'center'
+          },
+          tooltip: {
+            trigger: 'item',
+            formatter: '{a} <br/>{b} : {c} ({d}%)'
+          },
+          legend: {
+            orient: 'vertical',
+            left: 'left',
+            data: []
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              mark: {show: true},
+              magicType: {
+                show: true,
+                type: ['pie', 'funnel']
+              },
+              restore: {show: true},
+              saveAsImage: {show: true}
+            }
+          },
+          series: [
+            {
+              label: {
+                formatter: '{b}: ({d}%)'
+              },
+              name: this.$t('区域'),
+              type: 'pie',
+              radius: ['50%', '70%'],
+              selectedMode: 'single',
+              data: [
+                {value: 335, name: this.$t('直接访问')},
+              ],
+              emphasis: {
+                label: {
+                  show: true,
+                  // fontSize: '21',
+                  fontWeight: 'bold'
+                }
+              },
+            }
+          ]
+        },
+        // 查询参数
+        queryParams: {
+          timeliness: null,
+          tempCategory: null,
+        },
+        chart: null,
+        chartData : []
+      }
+    },
+    mounted() {
+      this.$nextTick(() => {
+        this.queryParams.timeliness = this.timeliness;
+        this.queryParams.tempCategory = this.tempCategory;
+        leakLocationData(this.queryParams).then(response => {
+          this.chartData = response
+          for(let i = 0 ; i <this.chartData.length ; i++){
+            this.option.legend.data[i] = this.chartData[i].dataName
+            this.option.series[0].data[i] = {value:this.chartData[i].dataNum , name: this.chartData[i].dataName }
+          }
+          this.initChart()
+        });
+      })
+    },
+    methods: {
+      /** 获取当前年份 */
+      getNowTime() {
+        var now = new Date();
+      },
+      initChart() {
+        // 基于准备好的dom，初始化echarts实例
+        this.chart = this.echarts.init(document.getElementById('leakLocationChart'))
+        this.chart.setOption(this.option)
+      }
+    }
+  }
+</script>

ui/src/views/process/moc/chart/materialTypeChart.vue

@@ -0,0 +1,107 @@
+<template>
+  <div>
+    <div id="materialTypeChart" :style="{width:width,height:height}"></div>
+  </div>
+</template>
+
+<script>
+  import { materialTypeData } from "@/api/process/moc";
+
+  export default {
+    props: {
+      timeliness: null,
+      tempCategory: null,
+      width: {
+        type: String,
+        default: '100%'
+      },
+      height: {
+        type: String,
+        default: '200px'
+      },
+    },
+    data() {
+      return {
+        option: {
+          title: {
+            left: 'center'
+          },
+          tooltip: {
+            trigger: 'item',
+            formatter: '{a} <br/>{b} : {c} ({d}%)'
+          },
+          legend: {
+            orient: 'vertical',
+            left: 'left',
+            data: []
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              mark: {show: true},
+              magicType: {
+                show: true,
+                type: ['pie', 'funnel']
+              },
+              restore: {show: true},
+              saveAsImage: {show: true}
+            }
+          },
+          series: [
+            {
+              label: {
+                formatter: '{b}: ({d}%)'
+              },
+              name: this.$t('区域'),
+              type: 'pie',
+              radius: ['50%', '70%'],
+              selectedMode: 'single',
+              data: [
+                {value: 335, name: this.$t('直接访问')},
+              ],
+              emphasis: {
+                label: {
+                  show: true,
+                  // fontSize: '21',
+                  fontWeight: 'bold'
+                }
+              },
+            }
+          ]
+        },
+        // 查询参数
+        queryParams: {
+          timeliness: null,
+          tempCategory: null,
+        },
+        chart: null,
+        chartData : []
+      }
+    },
+    mounted() {
+      this.$nextTick(() => {
+        this.queryParams.timeliness = this.timeliness;
+        this.queryParams.tempCategory = this.tempCategory;
+        materialTypeData(this.queryParams).then(response => {
+          this.chartData = response
+          for(let i = 0 ; i <this.chartData.length ; i++){
+            this.option.legend.data[i] = this.chartData[i].dataName
+            this.option.series[0].data[i] = {value:this.chartData[i].dataNum , name: this.chartData[i].dataName }
+          }
+          this.initChart()
+        });
+      })
+    },
+    methods: {
+      /** 获取当前年份 */
+      getNowTime() {
+        var now = new Date();
+      },
+      initChart() {
+        // 基于准备好的dom，初始化echarts实例
+        this.chart = this.echarts.init(document.getElementById('materialTypeChart'))
+        this.chart.setOption(this.option)
+      }
+    }
+  }
+</script>

ui/src/views/process/moc/chart/mcDetailChart.vue

@@ -0,0 +1,104 @@
+<template>
+  <div>
+    <div id="mcDetailChart" :style="{width:width,height:height}"></div>
+  </div>
+</template>
+
+<script>
+  import { mcDetailData } from "@/api/process/moc";
+
+  export default {
+    props: {
+      timeliness: null,
+      width: {
+        type: String,
+        default: '100%'
+      },
+      height: {
+        type: String,
+        default: '200px'
+      },
+    },
+    data() {
+      return {
+        option: {
+          title: {
+            left: 'center'
+          },
+          tooltip: {
+            trigger: 'item',
+            formatter: '{a} <br/>{b} : {c} ({d}%)'
+          },
+          legend: {
+            orient: 'vertical',
+            left: 'left',
+            data: []
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              mark: {show: true},
+              magicType: {
+                show: true,
+                type: ['pie', 'funnel']
+              },
+              restore: {show: true},
+              saveAsImage: {show: true}
+            }
+          },
+          series: [
+            {
+              label: {
+                formatter: '{b}: ({d}%)'
+              },
+              name: this.$t('区域'),
+              type: 'pie',
+              radius: ['50%', '70%'],
+              selectedMode: 'single',
+              data: [
+                {value: 335, name: this.$t('直接访问')},
+              ],
+              emphasis: {
+                label: {
+                  show: true,
+                  // fontSize: '21',
+                  fontWeight: 'bold'
+                }
+              },
+            }
+          ]
+        },
+        // 查询参数
+        queryParams: {
+          timeliness: null,
+        },
+        chart: null,
+        chartData : []
+      }
+    },
+    mounted() {
+      this.$nextTick(() => {
+        this.queryParams.timeliness = this.timeliness;
+        mcDetailData(this.queryParams).then(response => {
+          this.chartData = response
+          for(let i = 0 ; i <this.chartData.length ; i++){
+            this.option.legend.data[i] = this.chartData[i].dataName
+            this.option.series[0].data[i] = {value:this.chartData[i].dataNum , name: this.chartData[i].dataName }
+          }
+          this.initChart()
+        });
+      })
+    },
+    methods: {
+      /** 获取当前年份 */
+      getNowTime() {
+        var now = new Date();
+      },
+      initChart() {
+        // 基于准备好的dom，初始化echarts实例
+        this.chart = this.echarts.init(document.getElementById('mcDetailChart'))
+        this.chart.setOption(this.option)
+      }
+    }
+  }
+</script>

ui/src/views/process/moc/chart/riskLevelChart.vue

@@ -0,0 +1,104 @@
+<template>
+  <div>
+    <div id="riskLevelChart" :style="{width:width,height:height}"></div>
+  </div>
+</template>
+
+<script>
+  import { riskLevelData } from "@/api/process/moc";
+
+  export default {
+    props: {
+      timeliness: null,
+      width: {
+        type: String,
+        default: '100%'
+      },
+      height: {
+        type: String,
+        default: '200px'
+      },
+    },
+    data() {
+      return {
+        option: {
+          title: {
+            left: 'center'
+          },
+          tooltip: {
+            trigger: 'item',
+            formatter: '{a} <br/>{b} : {c} ({d}%)'
+          },
+          legend: {
+            orient: 'vertical',
+            left: 'left',
+            data: []
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              mark: {show: true},
+              magicType: {
+                show: true,
+                type: ['pie', 'funnel']
+              },
+              restore: {show: true},
+              saveAsImage: {show: true}
+            }
+          },
+          series: [
+            {
+              label: {
+                formatter: '{b}: ({d}%)'
+              },
+              name: this.$t('区域'),
+              type: 'pie',
+              radius: ['50%', '70%'],
+              selectedMode: 'single',
+              data: [
+                {value: 335, name: this.$t('直接访问')},
+              ],
+              emphasis: {
+                label: {
+                  show: true,
+                  // fontSize: '21',
+                  fontWeight: 'bold'
+                }
+              },
+            }
+          ]
+        },
+        // 查询参数
+        queryParams: {
+          timeliness: null,
+        },
+        chart: null,
+        chartData : []
+      }
+    },
+    mounted() {
+      this.$nextTick(() => {
+        this.queryParams.timeliness = this.timeliness;
+        riskLevelData(this.queryParams).then(response => {
+          this.chartData = response
+          for(let i = 0 ; i <this.chartData.length ; i++){
+            this.option.legend.data[i] = this.chartData[i].dataName
+            this.option.series[0].data[i] = {value:this.chartData[i].dataNum , name: this.chartData[i].dataName }
+          }
+          this.initChart()
+        });
+      })
+    },
+    methods: {
+      /** 获取当前年份 */
+      getNowTime() {
+        var now = new Date();
+      },
+      initChart() {
+        // 基于准备好的dom，初始化echarts实例
+        this.chart = this.echarts.init(document.getElementById('riskLevelChart'))
+        this.chart.setOption(this.option)
+      }
+    }
+  }
+</script>

ui/src/views/process/moc/permanentMoc/chartDemo/barDemo.vue → ui/src/views/process/moc/chart/sealDateChart.vue

@@ -1,14 +1,16 @@
 <template>
   <div>
-    <div id="yearChart" :style="{width:width,height:height}"></div>
+    <div id="sealDateChart" :style="{width:width,height:height}"></div>
   </div>
 </template>
 
 <script>
-  import { yearData } from "@/api/process/moc";
+  import { sealDateData } from "@/api/process/moc";
 
   export default {
     props: {
+      timeliness: null,
+      tempCategory: null,
       width: {
         type: String,
         default: '100%'
@@ -32,7 +34,7 @@
           },
           /* 标识 */
           legend: {
-            data: ['永久/临时MOC'],
+            data: ['数量'],
           },
           toolbox: {
             show: true,
@@ -63,16 +65,16 @@
           yAxis: {
           },
           series: [{
-            name: '永久/临时MOC',
+            name: '数量',
             type: 'bar',
             barWidth: '40%',
             data: []
           }]
         },
-
         // 查询参数
         queryParams: {
-          item: 1,
+          timeliness: null,
+          tempCategory: null,
         },
         chart: null,
         chartData : []
@@ -80,7 +82,9 @@
     },
     mounted() {
       this.$nextTick(() => {
-        yearData(this.queryParams).then(response => {
+        this.queryParams.timeliness = this.timeliness;
+        this.queryParams.tempCategory = this.tempCategory;
+        sealDateData(this.queryParams).then(response => {
           this.chartData = response
           for(let i = 0 ; i <this.chartData.length ; i++){
             if(this.chartData[i].dataName!= null && this.chartData[i].dataName!= ''){
@@ -99,7 +103,7 @@
       },
       initChart() {
         // 基于准备好的dom，初始化echarts实例
-        this.chart = this.echarts.init(document.getElementById('yearChart'))
+        this.chart = this.echarts.init(document.getElementById('sealDateChart'))
         this.chart.setOption(this.option)
       }
     }

ui/src/views/process/moc/permanentMoc/chartDemo/pieDemo.vue → ui/src/views/process/moc/chart/statusChart.vue

@@ -1,14 +1,16 @@
 <template>
   <div>
-    <div id="trueStateChart" :style="{width:width,height:height}"></div>
+    <div id="statusChart" :style="{width:width,height:height}"></div>
   </div>
 </template>
 
 <script>
-  import { trueStateData } from "@/api/process/moc";
+  import { statusData } from "@/api/process/moc";
 
   export default {
     props: {
+      timeliness: null,
+      tempCategory: null,
       width: {
         type: String,
         default: '100%'
@@ -67,23 +69,21 @@
             }
           ]
         },
-
         // 查询参数
         queryParams: {
-          item: 1,
+          timeliness: null,
+          tempCategory: null,
         },
         chart: null,
-        chartData : [
-          {dataName: '裂解', dataNum: '10'},
-          {dataName: '分离', dataNum: '21'},
-          {dataName: '压缩', dataNum: '7'},
-        ]
+        chartData : []
       }
     },
     mounted() {
       this.$nextTick(() => {
-        trueStateData(this.queryParams).then(response => {
-          // this.chartData = response
+        this.queryParams.timeliness = this.timeliness;
+        this.queryParams.tempCategory = this.tempCategory;
+        statusData(this.queryParams).then(response => {
+          this.chartData = response
           for(let i = 0 ; i <this.chartData.length ; i++){
             this.option.legend.data[i] = this.chartData[i].dataName
             this.option.series[0].data[i] = {value:this.chartData[i].dataNum , name: this.chartData[i].dataName }
@@ -99,7 +99,7 @@
       },
       initChart() {
         // 基于准备好的dom，初始化echarts实例
-        this.chart = this.echarts.init(document.getElementById('trueStateChart'))
+        this.chart = this.echarts.init(document.getElementById('statusChart'))
         this.chart.setOption(this.option)
       }
     }

ui/src/views/process/moc/chart/tempStateChart.vue

@@ -0,0 +1,104 @@
+<template>
+  <div>
+    <div id="tempStateChart" :style="{width:width,height:height}"></div>
+  </div>
+</template>
+
+<script>
+  import { tempStateData } from "@/api/process/moc";
+
+  export default {
+    props: {
+      timeliness: null,
+      width: {
+        type: String,
+        default: '100%'
+      },
+      height: {
+        type: String,
+        default: '200px'
+      },
+    },
+    data() {
+      return {
+        option: {
+          title: {
+            left: 'center'
+          },
+          tooltip: {
+            trigger: 'item',
+            formatter: '{a} <br/>{b} : {c} ({d}%)'
+          },
+          legend: {
+            orient: 'vertical',
+            left: 'left',
+            data: []
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              mark: {show: true},
+              magicType: {
+                show: true,
+                type: ['pie', 'funnel']
+              },
+              restore: {show: true},
+              saveAsImage: {show: true}
+            }
+          },
+          series: [
+            {
+              label: {
+                formatter: '{b}: ({d}%)'
+              },
+              name: this.$t('区域'),
+              type: 'pie',
+              radius: ['50%', '70%'],
+              selectedMode: 'single',
+              data: [
+                {value: 335, name: this.$t('直接访问')},
+              ],
+              emphasis: {
+                label: {
+                  show: true,
+                  // fontSize: '21',
+                  fontWeight: 'bold'
+                }
+              },
+            }
+          ]
+        },
+        // 查询参数
+        queryParams: {
+          timeliness: null,
+        },
+        chart: null,
+        chartData : []
+      }
+    },
+    mounted() {
+      this.$nextTick(() => {
+        this.queryParams.timeliness = this.timeliness;
+        tempStateData(this.queryParams).then(response => {
+          this.chartData = response
+          for(let i = 0 ; i <this.chartData.length ; i++){
+            this.option.legend.data[i] = this.chartData[i].dataName
+            this.option.series[0].data[i] = {value:this.chartData[i].dataNum , name: this.chartData[i].dataName }
+          }
+          this.initChart()
+        });
+      })
+    },
+    methods: {
+      /** 获取当前年份 */
+      getNowTime() {
+        var now = new Date();
+      },
+      initChart() {
+        // 基于准备好的dom，初始化echarts实例
+        this.chart = this.echarts.init(document.getElementById('tempStateChart'))
+        this.chart.setOption(this.option)
+      }
+    }
+  }
+</script>

ui/src/views/process/moc/permanentMoc/index.vue

@@ -168,35 +168,6 @@
       <el-form-item :label="$t('PSSR编号')" prop="pssrNo">
         <el-input v-model="queryParams.pssrNo" :placeholder="$t('请输入') + $t('PSSR编号')" />
       </el-form-item>
-      <!--<el-form-item :label="$t('CTE工作号')" label-width="120" prop="cteNo">-->
-        <!--<el-input-->
-          <!--v-model="queryParams.cteNo"-->
-          <!--:placeholder="$t('请输入') + $t('CTE工作号')"-->
-          <!--clearable-->
-          <!--size="small"-->
-          <!--@keyup.enter.native="handleQuery"-->
-        <!--/>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('实施情况')" prop="trueState" label-width="150">-->
-        <!--<el-select v-model="queryParams.trueState" :placeholder="$t('请选择') + $t('实施情况')" clearable size="small">-->
-          <!--<el-option-->
-            <!--v-for="dict in trueStateOptions"-->
-            <!--:key="dict.dictValue"-->
-            <!--:label="dict.dictLabel"-->
-            <!--:value="dict.dictValue"-->
-          <!--/>-->
-        <!--</el-select>-->
-      <!--</el-form-item>-->
-      <!--<el-form-item :label="$t('变更性质')" prop="changeNature" label-width="150">-->
-        <!--<el-select v-model="queryParams.changeNature" :placeholder="$t('请选择') + $t('变更性质')" clearable size="small">-->
-          <!--<el-option-->
-            <!--v-for="dict in changeNatureOptions"-->
-            <!--:key="dict.dictValue"-->
-            <!--:label="dict.dictLabel"-->
-            <!--:value="dict.dictValue"-->
-          <!--/>-->
-        <!--</el-select>-->
-      <!--</el-form-item>-->
       <el-form-item>
         <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('搜索') }}</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{ $t('重置') }}</el-button>
@@ -251,14 +222,14 @@
           <!--v-hasPermi="['process:moc:export']"-->
         <!--&gt;{{ $t('导出') }}</el-button>-->
       <!--</el-col>-->
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          icon="el-icon-s-data"
-          size="mini"
-          @click="handleData"
-        >{{ $t('数据分析') }}</el-button>
-      </el-col>
+      <!--<el-col :span="1.5">-->
+        <!--<el-button-->
+        <!--type="primary"-->
+        <!--icon="el-icon-s-data"-->
+        <!--size="mini"-->
+        <!--@click="handleData"-->
+        <!--&gt;{{ $t('数据分析') }}</el-button>-->
+      <!--</el-col>-->
 	  <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
@@ -274,7 +245,6 @@
           </span>
         </template>
       </el-table-column>
-      <!--<el-table-column :label="$t('装置编号')" align="center" width="120" prop="plantNumber" :show-overflow-tooltip="true"/>-->
       <el-table-column :label="$t('公司MOC编号')" align="center" width="120" prop="companyMocNo" :show-overflow-tooltip="true"/>
       <el-table-column :label="$t('项目号')" align="center" width="120" prop="projectNo" :show-overflow-tooltip="true"/>
       <el-table-column :label="$t('区域')" align="center" prop="area" :formatter="areaFormat">
@@ -288,7 +258,7 @@
         </template>
       </el-table-column>
       <el-table-column :label="$t('标题')" align="center" width="320" prop="title" :show-overflow-tooltip="true"/>
-      <el-table-column prop="mocType" align="center" :show-overflow-tooltip="true" :formatter="mocTypeFormat" width="120">
+      <el-table-column :label="$t('MOC类型')" prop="mocType" align="center" :show-overflow-tooltip="true" :formatter="mocTypeFormat" width="120">
         <template slot="header">
           <span id="moc-type">
             <span @click="mocTypeChart.open = true">
@@ -309,24 +279,28 @@
           <span>{{ parseTime(scope.row.approveTime, '{y}-{m}-{d}') }}</span>
         </template>
       </el-table-column>
-      <!--<el-table-column :label="$t('完成时间')" align="center" prop="endtime" width="100">-->
-        <!--<template slot-scope="scope">-->
-          <!--<span>{{ parseTime(scope.row.endtime, '{y}-{m}-{d}') }}</span>-->
-        <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('实施情况')" align="center" prop="trueState" :formatter="trueStateFormat" />-->
-      <!--<el-table-column :label="$t('变更性质')" align="center" prop="changeNature" :formatter="changeNatureFormat" />-->
-      <!--<el-table-column :label="$t('到期时间')" align="center" prop="overTime" width="100">-->
-        <!--<template slot-scope="scope">-->
-          <!--<span v-if="scope.row.overTime !== 'N.A.'">{{ parseTime(scope.row.overTime, '{y}-{m}-{d}') }}</span>-->
-          <!--<span v-if="scope.row.overTime === 'N.A.'">{{ scope.row.overTime }}</span>-->
-        <!--</template>-->
-      <!--</el-table-column>-->
-      <!--<el-table-column :label="$t('临时MOC状态')" align="center" prop="temporaryState" :formatter="temporaryStateFormat" />-->
       <el-table-column :label="$t('MC时间')" align="center" prop="mcTime" :show-overflow-tooltip="true" width="100"/>
-      <el-table-column :label="$t('MC情况')" align="center" prop="mcDetail" :show-overflow-tooltip="true" width="100" :formatter="mcDetailFormat" />
+      <el-table-column :label="$t('MC情况')" align="center" prop="mcDetail" :formatter="mcDetailFormat">
+        <template slot="header">
+          <span
+            @click="mcDetailChart.open = true"
+            id="mcDetail">
+            MC情况
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('备注')" align="center" prop="remarks" :show-overflow-tooltip="true" width="130" />
-      <el-table-column :label="$t('风险等级')" align="center" prop="riskLevel" :formatter="riskLevelFormat" />
+      <el-table-column :label="$t('风险等级')" align="center" prop="riskLevel" :formatter="riskLevelFormat">
+        <template slot="header">
+          <span
+            @click="riskLevelChart.open = true"
+            id="riskLevel">
+            风险等级
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('EHS评估/审查')" align="center" width="130" prop="ehsCheck" :show-overflow-tooltip="true">
         <template slot-scope="scope">
           <span> {{scope.row.ehsCheck}}</span>
@@ -349,22 +323,6 @@
         </template>
       </el-table-column>
       <el-table-column :label="$t('PSSR编号')" align="center" prop="pssrNo" width="130" />
-      <!--<el-table-column :label="$t('通知单')" align="center" prop="noticeLetter" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('工作单')" align="center" prop="workLetter" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('CTE工作号')" align="center" prop="cteNo" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('投资费用(RMB)')" align="center" prop="investCost" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('类别')" align="center" prop="category" :formatter="categoryFormat" />
-      <el-table-column :label="$t('重要性')" align="center" prop="significance" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('分类')" align="center" width="120" prop="classification" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('仪表控制')" align="center" prop="dashControl" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('预计完成时间')" align="center" prop="estimateEndtime" width="100">
-        <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.estimateEndtime, '{y}-{m}-{d}') }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column :label="$t('EHS审查数据库')" align="center" prop="ehsDb" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('PSSR数据库')" align="center" prop="pssrDb" :show-overflow-tooltip="true"/>
-      <el-table-column :label="$t('CAPEX计划')" align="center" prop="capex" :show-overflow-tooltip="true"/>-->
       <el-table-column :label="$t('操作')" align="center" fixed="right" width="120" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -645,8 +603,8 @@
         <el-button @click="cancel">{{ $t('取 消') }}</el-button>
       </div>
     </el-dialog>
-      <!-- 用户导入对话框 -->
-      <el-dialog v-dialogDrag :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
+    <!-- 用户导入对话框 -->
+    <el-dialog v-dialogDrag :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
           <el-upload
                   ref="upload"
                   :limit="1"
@@ -747,14 +705,28 @@
         <el-button @click="doc.open = false">{{ $t('返 回') }}</el-button>
       </div>
     </el-dialog>
-    <!-- 永久MOC类型统计对话框 -->
+    <!-- 风险等级统计对话框 -->
+    <el-dialog v-dialogDrag :title="riskLevelChart.title" :visible.sync="riskLevelChart.open" width="500px" append-to-body>
+      <risk-level-chart :timeliness="1"></risk-level-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="riskLevelChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+    <!-- MC情况统计对话框 -->
+    <el-dialog v-dialogDrag :title="mcDetailChart.title" :visible.sync="mcDetailChart.open" width="500px" append-to-body>
+      <mc-detail-chart :timeliness="1"></mc-detail-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="mcDetailChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+    <!-- 类型统计对话框 -->
     <el-dialog v-dialogDrag :title="mocTypeChart.title" :visible.sync="mocTypeChart.open" width="500px" append-to-body>
       <moc-type-chart :timeliness="1"></moc-type-chart>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="areaChart.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
-    <!-- 永久MOC区域统计对话框 -->
+    <!-- 区域统计对话框 -->
     <el-dialog v-dialogDrag :title="areaChart.title" :visible.sync="areaChart.open" width="500px" append-to-body>
       <area-chart :timeliness="1"></area-chart>
       <div slot="footer" class="dialog-footer">
@@ -778,6 +750,7 @@
         <el-button type="primary" @click="mocTypeInfo.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
+
     <el-drawer
       :title="$t('数据分析')"
       size="600px"
@@ -870,22 +843,21 @@ import { treeselect } from "@/api/system/dept";
 import { getToken } from "@/utils/auth";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
-import YearChart from "./yearChart";
-import TrueStateData from "./trueStateData";
-import ChangeData from "./changeData";
-import CategoryData from "./categoryData";
-import RiskData from "./riskData";
-import barDemo from "./chartDemo/barDemo";
-import pieDemo from "./chartDemo/pieDemo";
+import YearChart from "./chart/yearChart";
+import TrueStateData from "./chart/trueStateData";
+import ChangeData from "./chart/changeData";
+import CategoryData from "./chart/categoryData";
+import RiskData from "./chart/riskData";
+import { addCommonfile, allFileList, delCommonfile, updateCommonfile} from "@/api/common/commonfile";
 import mocNoChart from "../chart/mocNoChart";
 import areaChart from "../chart/areaChart";
 import mocTypeChart from "../chart/mocTypeChart";
-
-import {addCommonfile, allFileList, delCommonfile, updateCommonfile} from "@/api/common/commonfile";
+import mcDetailChart from "../chart/mcDetailChart";
+import riskLevelChart from "../chart/riskLevelChart";
 
 export default {
   name: "PermanentMoc",
-  components: { mocTypeChart, areaChart, mocNoChart, barDemo, pieDemo, RiskData, CategoryData, ChangeData, TrueStateData, YearChart, Treeselect },
+  components: { riskLevelChart, mcDetailChart, mocTypeChart, areaChart, mocNoChart, RiskData, CategoryData, ChangeData, TrueStateData, YearChart, Treeselect },
   data() {
     var validateDocUpdate = (rule, value, callback) => {
       if (value == 1) {
@@ -899,13 +871,21 @@ export default {
       }
     };
     return {
+      riskLevelChart: {
+        open: false,
+        title: '风险等级数据统计（永久）'
+      },
+      mcDetailChart: {
+        open: false,
+          title: 'MC情况数据统计（永久）'
+      },
       mocTypeChart: {
         open: false,
-        title: '永久MOC类型数据统计'
+        title: '类型数据统计（永久）'
       },
       areaChart: {
         open: false,
-        title: '永久MOC区域数据统计'
+        title: '区域数据统计（永久）'
       },
       mocNoChart: {
         open: false,
@@ -1078,131 +1058,14 @@ export default {
         mocNo: [
             { required: true, message: this.$t('MOC编号') + this.$t('不能为空'), trigger: "change" }
         ],
-        // companyMocNo: [
-        //   { required: true, message: this.$t('公司MOC编号') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // projectNo: [
-        //   { required: true, message: this.$t('项目号') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // area: [
-        //   { required: true, message: this.$t('区域') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // title: [
-        //   { required: true, message: this.$t('标题') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // mocType: [
-        //   { required: true, message: this.$t('MOC类型') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // owner: [
-        //   { required: true, message: this.$t('负责人') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // approveTime: [
-        //   { required: true, message: this.$t('申请时间') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // mcTime: [
-        //   { required: true, message: this.$t('MC时间') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // mcDetail: [
-        //   { required: true, message: this.$t('MC情况') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // remarks: [
-        //   { required: true, message: this.$t('备注') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // riskLevel: [
-        //   { required: true, message: this.$t('风险等级') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // ehsCheck: [
-        //   { required: true, message: this.$t('EHS评估/审查') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // training: [
-        //   { required: true, message: this.$t('培训') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // pidMaster: [
-        //   { required: true, message: this.$t('PID更新') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // sopUpdate: [
-        //   { required: true, message: this.$t('SOP更新') + this.$t('不能为空'), trigger: "change" }
-        // ],
         docUpdate: [
           // { required: true, message: this.$t('文档更新') + this.$t('不能为空'), trigger: "change" },
           { validator: validateDocUpdate, trigger: 'change' }
         ],
-        // pssr: [
-        //   { required: true, message: this.$t('PSSR') + this.$t('不能为空'), trigger: "change" }
-        // ],
-        // pssrNo: [
-        //   { required: true, message: this.$t('PSSR编号') + this.$t('不能为空'), trigger: "change" }
-        // ],
         deptId: [
           { required: true, message: this.$t('归属部门') + this.$t('不能为空'), trigger: "change" }
         ],
       },
-      // commonRules: {
-      //   plantCode: [
-      //     { required: true, message: this.$t('装置') + this.$t('不能为空'), trigger: "change" }
-      //   ],
-      //   trueState: [
-      //     { required: true, message: this.$t('实施情况') + this.$t('不能为空'), trigger: "change" }
-      //   ],
-      //   deptId: [
-      //     { required: true, message: this.$t('部门编号') + this.$t('不能为空'), trigger: "blur" }
-      //   ]
-      // },
-      // chooseRules: {
-      //   plantCode: [
-      //     { required: true, message: this.$t('装置') + this.$t('不能为空'), trigger: "change" }
-      //   ],
-      //   mocNo: [
-      //     { required: true, message: this.$t('MOC编号') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   area: [
-      //     { required: true, message: this.$t('区域') + this.$t('不能为空'), trigger: "change" }
-      //   ],
-      //   title: [
-      //     { required: true, message: this.$t('标题') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   owner: [
-      //     { required: true, message: this.$t('负责人') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   approveTime: [
-      //     { required: true, message: this.$t('申请时间') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   endtime: [
-      //     { required: true, message: this.$t('完成时间') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   trueState: [
-      //     { required: true, message: this.$t('实施情况') + this.$t('不能为空'), trigger: "change" }
-      //   ],
-      //   overTime: [
-      //     { required: true, message: this.$t('到期时间') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   riskLevel: [
-      //     { required: true, message: this.$t('风险等级') + this.$t('不能为空'), trigger: "change" }
-      //   ],
-      //   ehsCheck: [
-      //     { required: true, message: this.$t('EHS审查') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   pidMaster: [
-      //     { required: true, message: this.$t('PID更新') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   sopUpdate: [
-      //     { required: true, message: this.$t('SOP更新') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   docUpdate: [
-      //     { required: true, message: this.$t('SOP更新') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   deptId: [
-      //     { required: true, message: this.$t('部门编号') + this.$t('不能为空'), trigger: "blur" }
-      //   ]
-      // },
-      // temporaryRules: {
-      //   overTime: [
-      //     { required: true, message: this.$t('到期时间') + this.$t('不能为空'), trigger: "blur" }
-      //   ],
-      //   deptId: [
-      //     { required: true, message: this.$t('部门编号') + this.$t('不能为空'), trigger: "blur" }
-      //   ]
-      // },
     };
   },
   watch: {
@@ -1426,20 +1289,16 @@ export default {
     //实施情况Finished变更
     changeTrueState(val) {
       if (val == 10) {
-        // this.rules = this.chooseRules
       }else {
         this.$refs['form'].clearValidate();
-        // this.rules = this.commonRules
       }
     },
     changeChangeNature(val) {
       if (val == 10) {
-        // this.rules = this.temporaryRules
       }else if (val = 12) {
         this.$refs['form'].clearValidate();
         this.form.temporaryState = "14";
         this.form.overTime = "";
-        // this.rules = this.commonRules
       }
     },
     //根据分数显示颜色提示
@@ -1689,7 +1548,14 @@ export default {
   }
 };
 </script>
+
 <style>
+  #riskLevel:hover{
+    cursor: pointer;
+  }
+  #mcDetail:hover{
+    cursor: pointer;
+  }
   #area:hover{
     cursor: pointer;
   }
@@ -1716,7 +1582,6 @@ export default {
   .clearfix:after {
     clear: both
   }
-
   .box-card {
     width: 100%;
   }

ui/src/views/process/moc/temporaryMoc/index.vue

@@ -314,11 +314,16 @@
       <el-table-column :label="$t('标题')" align="center" width="320" prop="title" :show-overflow-tooltip="true"/>
       <el-table-column prop="mocType" align="center" :show-overflow-tooltip="true" :formatter="mocTypeFormat" width="120">
         <template slot="header">
-          <span
-            @click="mocTypeInfo.open = true"
-            id="moc-type">
-            MOC类型
-            <i class="el-icon-question"></i>
+          <span id="moc-type">
+            <span @click="mocTypeChart.open = true">
+              MOC类型
+            </span>
+            <span @click="mocTypeChart.open = true">
+              <i class="el-icon-s-data"></i>
+            </span>
+            <span @click="mocTypeInfo.open = true">
+              <i class="el-icon-question"></i>
+            </span>
           </span>
         </template>
       </el-table-column>
@@ -343,11 +348,38 @@
       <!--</el-table-column>-->
       <!--<el-table-column :label="$t('临时MOC状态')" align="center" prop="temporaryState" :formatter="temporaryStateFormat" />-->
       <el-table-column :label="$t('MC时间')" align="center" prop="mcTime" :show-overflow-tooltip="true" width="100"/>
-      <el-table-column :label="$t('MC情况')" align="center" prop="mcDetail" :show-overflow-tooltip="true" width="100" :formatter="mcDetailFormat" />
+      <el-table-column :label="$t('MC情况')" align="center" prop="mcDetail" :formatter="mcDetailFormat">
+        <template slot="header">
+          <span
+            @click="mcDetailChart.open = true"
+            id="mcDetail">
+            MC情况
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('到期时间')" align="center" prop="expTime" :show-overflow-tooltip="true" width="100"/>
-      <el-table-column :label="$t('临时MOC状态')" align="center" prop="mcDetail" :show-overflow-tooltip="true" width="100" :formatter="tempStateFormat" />
+      <el-table-column :label="$t('临时MOC状态')" align="center" prop="tempState" :formatter="tempStateFormat">
+        <template slot="header">
+          <span
+            @click="tempStateChart.open = true"
+            id="tempState">
+            临时MOC状态
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('备注')" align="center" prop="remarks" :show-overflow-tooltip="true" width="130" />
-      <el-table-column :label="$t('风险等级')" align="center" prop="riskLevel" :formatter="riskLevelFormat" />
+      <el-table-column :label="$t('风险等级')" align="center" prop="riskLevel" :formatter="riskLevelFormat">
+        <template slot="header">
+          <span
+            @click="riskLevelChart.open = true"
+            id="riskLevel">
+            风险等级
+            <i class="el-icon-s-data"></i>
+          </span>
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('EHS评估/审查')" align="center" width="130" prop="ehsCheck" :show-overflow-tooltip="true">
         <template slot-scope="scope">
           <span> {{scope.row.ehsCheck}}</span>
@@ -794,6 +826,13 @@
         <el-button @click="doc.open = false">{{ $t('返 回') }}</el-button>
       </div>
     </el-dialog>
+    <!-- 临时MOC状态统计对话框 -->
+    <el-dialog v-dialogDrag :title="tempStateChart.title" :visible.sync="tempStateChart.open" width="500px" append-to-body>
+      <temp-state-chart :timeliness="2"></temp-state-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="tempStateChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
     <!-- MOC类型说明对话框 -->
     <el-dialog v-dialogDrag :title="mocTypeInfo.title" :visible.sync="mocTypeInfo.open" width="1000px" append-to-body>
       <el-image
@@ -804,13 +843,34 @@
         <el-button type="primary" @click="mocTypeInfo.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
-    <!-- 临时MOC区域统计对话框 -->
+    <!-- 区域统计对话框 -->
     <el-dialog v-dialogDrag :title="areaChart.title" :visible.sync="areaChart.open" width="500px" append-to-body>
       <area-chart :timeliness="2"></area-chart>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="areaChart.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
+    <!-- 风险等级统计对话框 -->
+    <el-dialog v-dialogDrag :title="riskLevelChart.title" :visible.sync="riskLevelChart.open" width="500px" append-to-body>
+      <risk-level-chart :timeliness="2"></risk-level-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="riskLevelChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+    <!-- MC情况统计对话框 -->
+    <el-dialog v-dialogDrag :title="mcDetailChart.title" :visible.sync="mcDetailChart.open" width="500px" append-to-body>
+      <mc-detail-chart :timeliness="2"></mc-detail-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="mcDetailChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
+    <!-- 类型统计对话框 -->
+    <el-dialog v-dialogDrag :title="mocTypeChart.title" :visible.sync="mocTypeChart.open" width="500px" append-to-body>
+      <moc-type-chart :timeliness="2"></moc-type-chart>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="areaChart.open = false">{{ $t('确 定') }}</el-button>
+      </div>
+    </el-dialog>
     <!-- MOC编号统计对话框 -->
     <el-dialog v-dialogDrag :title="mocNoChart.title" :visible.sync="mocNoChart.open" width="500px" append-to-body>
       <moc-no-chart></moc-no-chart>
@@ -912,12 +972,16 @@
   import "@riophae/vue-treeselect/dist/vue-treeselect.css";
   import mocNoChart from "../chart/mocNoChart";
   import areaChart from "../chart/areaChart";
+  import mocTypeChart from "../chart/mocTypeChart";
+  import mcDetailChart from "../chart/mcDetailChart";
+  import riskLevelChart from "../chart/riskLevelChart";
+  import tempStateChart from "../chart/tempStateChart";
 
   import { addCommonfile, allFileList, delCommonfile, updateCommonfile} from "@/api/common/commonfile";
 
   export default {
     name: "TemporaryMoc",
-    components: { areaChart, mocNoChart, Treeselect },
+    components: { tempStateChart, mocTypeChart, mcDetailChart, riskLevelChart, areaChart, mocNoChart, Treeselect },
     data() {
       var validateDocUpdate = (rule, value, callback) => {
         if (value == 1) {
@@ -931,9 +995,25 @@
         }
       };
       return {
+        tempStateChart: {
+          open: false,
+          title: '临时MOC状态数据统计'
+        },
+        riskLevelChart: {
+          open: false,
+          title: '风险等级数据统计（临时）'
+        },
+        mcDetailChart: {
+          open: false,
+          title: 'MC情况数据统计（临时）'
+        },
+        mocTypeChart: {
+          open: false,
+          title: '类型数据统计（临时）'
+        },
         areaChart: {
           open: false,
-          title: '临时MOC区域数据统计'
+          title: '区域数据统计（临时）'
         },
         mocNoChart: {
           open: false,
@@ -1290,7 +1370,6 @@
         this.loading = true;
         let _this = this
         listTemporary(this.queryParams).then(response => {
-          console.log(response.rows)
           this.mocList = response.rows;
           this.mocList.forEach(function (value,key,arr) {
             if (value.overTime == null) {