MOC

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

@@ -210,9 +210,9 @@ public class TMocController extends BaseController
 
     // MOC编号统计
     @GetMapping("/mocNoData")
-    public List<DataEntity> mocNoData()
+    public List<DataEntity> mocNoData(MocNoVO mocNoVO)
     {
-        return tMocMapper.selectMocData();
+        return tMocMapper.selectMocData(mocNoVO);
     }
 
     /**
@@ -508,6 +508,7 @@ public class TMocController extends BaseController
     @Log(title = "MOC管理", businessType = BusinessType.UPDATE)
     @PutMapping("/delay")
     public AjaxResult delay(@RequestBody DelayVO delayVo) throws ClassNotFoundException, NoSuchMethodException, IllegalAccessException, InvocationTargetException {
+
         return toAjax(tMocService.delay(delayVo));
     }
 

master/src/main/java/com/ruoyi/project/process/controller/vo/MocNoVO.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 MocNoVO {
+    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/domain/TMoc.java

@@ -311,6 +311,19 @@ public class TMoc extends BaseEntity
     @Excel(name = "卡具状态")
     private String status;
 
+    /** 移除时间 */
+    @JsonFormat(pattern = "yyyy-MM-dd" , timezone = "GMT+8")
+    @Excel(name = "移除时间", width = 30, dateFormat = "yyyy-MM-dd")
+    private Date removeTime;
+
+    public Date getRemoveTime() {
+        return removeTime;
+    }
+
+    public void setRemoveTime(Date removeTime) {
+        this.removeTime = removeTime;
+    }
+
     public String getStatus() {
         return status;
     }

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

@@ -75,7 +75,7 @@ public interface TMocMapper
 
     List<DataEntity> selectRiskData(Map param);
 
-    List<DataEntity> selectMocData();
+    List<DataEntity> selectMocData(MocNoVO mocNoVO);
 
     List<DataEntity> selectDepartmentData(DepartmentVO departmentVO);
 

master/src/main/java/com/ruoyi/project/process/service/impl/TMocServiceImpl.java

@@ -69,6 +69,24 @@ public class TMocServiceImpl implements ITMocService
     @Override
     public int updateTMoc(TMoc tMoc)
     {
+        // 历史MOC数据对象
+        TMoc history = tMocMapper.selectTMocById(tMoc.getId());
+
+        String tempState = tMoc.getTempState() == null ? "-1" : tMoc.getTempState();
+        String status = tMoc.getStatus() == null ? "-1" : tMoc.getStatus();
+        String historyTempState = history.getTempState() == null ? "-1" : history.getTempState();
+        String historyStatus = history.getStatus() == null ? "-1" : history.getStatus();
+
+        // 临时MOC状态/卡具状态为“0-移除”，并且与历史值不一致
+        if (tempState.equals("0") && !historyTempState.equals(tempState)
+            || status.equals("0") && !historyStatus.equals(status)) {
+            // 更新移除时间
+            tMoc.setRemoveTime(new Date());
+        } else {
+            // 清除移除时间
+            tMoc.setRemoveTime(null);
+        }
+
         return tMocMapper.updateTMoc(tMoc);
     }
 
@@ -80,23 +98,63 @@ public class TMocServiceImpl implements ITMocService
      */
     @Override
     public int delay(DelayVO delayVO) throws ClassNotFoundException, NoSuchMethodException, InvocationTargetException, IllegalAccessException {
-        Long id = delayVO.getId();
-        Date extention = delayVO.getExtention();
-        TMoc tMoc = this.selectTMocById(id);
-//        int count = 0;  // 第几次延期
-//        if (tMoc.getExtention1() != null) count++;
-//        if (tMoc.getExtention2() != null) count++;
-//        if (tMoc.getExtention3() != null) count++;
-//        if (tMoc.getExtention4() != null) count++;
-//        if (tMoc.getExtention5() != null) count++;
-//        if (tMoc.getExtention6() != null) count++;
-//        if (tMoc.getExtention7() != null) count++;
-//        if (tMoc.getExtention8() != null) count++;
-//        if (tMoc.getExtention9() != null) count++;
-//        Class clazz = Class.forName("com.ruoyi.project.process.domain.TMoc");
-//        Method method = clazz.getDeclaredMethod("extention" + (++count), String.class);
-//        method.invoke(tMoc, extention);
+        TMoc tMoc = tMocMapper.selectTMocById(delayVO.getId());
+
+        Date sealDate = tMoc.getSealDate();
+        Date extention1 = tMoc.getExtention1();
+        Date extention2 = tMoc.getExtention2();
+        Date extention3 = tMoc.getExtention3();
+        Date extention4 = tMoc.getExtention4();
+        Date extention5 = tMoc.getExtention5();
+        Date extention6 = tMoc.getExtention6();
+        Date extention7 = tMoc.getExtention7();
+        Date extention8 = tMoc.getExtention8();
+        Date extention9 = tMoc.getExtention9();
+
+        Date extention = null;
 
+        // 延期日期为空，自动延期六个月
+        if (delayVO.getExtention() == null) {
+            Date now = null;
+            if (extention9 != null) {
+                now = extention9;
+            } else if (extention8 != null) {
+                now = extention8;
+            } else if (extention7 != null) {
+                now = extention7;
+            } else if (extention6 != null) {
+                now = extention6;
+            } else if (extention5 != null) {
+                now = extention5;
+            } else if (extention4 != null) {
+                now = extention4;
+            } else if (extention3 != null) {
+                now = extention3;
+            } else if (extention2 != null) {
+                now = extention2;
+            } else if (extention1 != null) {
+                now = extention1;
+            } else if (sealDate != null) {
+                now = sealDate;
+            }
+            int month = now.getMonth();
+            int year = now.getYear();
+            int date = now.getDate();
+            if (month <= 5) {   // 延期后不跨年
+                month += 6;
+            } else {    // 延期后跨年
+                month -= 6;
+                year++;
+            }
+            extention = new Date(year, month, date);
+        } else {    // 手动延期
+            extention = delayVO.getExtention();
+        }
+
+        // 到期时间修改为延期时间
+        tMoc.setExpTime(extention);
+
+        // 判断第几次延期
         if (tMoc.getExtention1() == null) {
             tMoc.setExtention1(extention);
         } else {
@@ -132,6 +190,7 @@ public class TMocServiceImpl implements ITMocService
                 }
             }
         }
+
         return this.updateTMoc(tMoc);
     }
 

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

@@ -76,10 +76,11 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
         <result property="extention8"    column="extention8"    />
         <result property="extention9"    column="extention9"    />
         <result property="status"    column="status"    />
+        <result property="removeTime"    column="remove_time"    />
     </resultMap>
 
     <sql id="selectTMocVo">
-        select d.id, d.plant_code, d.moc_no, d.plant_number, d.notice_letter, d.work_letter, d.cte_no, d.invest_cost, d.category, d.significance, d.classification, d.area, d.dash_control, d.title, d.owner, d.approve_time, d.estimate_endtime, d.endtime, d.true_state, d.change_nature, d.over_time, d.risk_level, d.training, d.pssr, d.ehs_check, d.ehs_db, d.pid_master, d.pssr_db, d.capex, d.del_flag, d.creater_code, d.createdate, d.updater_code, d.updatedate, d.dept_id, d.remarks, d.temporary_state, d.sop_update, d.company_moc_no, d.project_no, d.moc_type, d.mc_time, d.mc_detail, d.doc_update, d.pssr_no, d.timeliness, d.temp_category, d.exp_time, d.temp_state, d.location, d.finish_date, d.process_unit, d.department, d.leak_location, d.pressure, d.temperature, d.leak_fluid, d.material_type, d.plan_date, d.seal_date, d.extention1, d.extention2, d.extention3, d.extention4, d.extention5, d.extention6, d.extention7, d.extention8, d.extention9, d.status ,s.dept_name from t_moc d
+        select d.id, d.plant_code, d.moc_no, d.plant_number, d.notice_letter, d.work_letter, d.cte_no, d.invest_cost, d.category, d.significance, d.classification, d.area, d.dash_control, d.title, d.owner, d.approve_time, d.estimate_endtime, d.endtime, d.true_state, d.change_nature, d.over_time, d.risk_level, d.training, d.pssr, d.ehs_check, d.ehs_db, d.pid_master, d.pssr_db, d.capex, d.del_flag, d.creater_code, d.createdate, d.updater_code, d.updatedate, d.dept_id, d.remarks, d.temporary_state, d.sop_update, d.company_moc_no, d.project_no, d.moc_type, d.mc_time, d.mc_detail, d.doc_update, d.pssr_no, d.timeliness, d.temp_category, d.exp_time, d.temp_state, d.location, d.finish_date, d.process_unit, d.department, d.leak_location, d.pressure, d.temperature, d.leak_fluid, d.material_type, d.plan_date, d.seal_date, d.extention1, d.extention2, d.extention3, d.extention4, d.extention5, d.extention6, d.extention7, d.extention8, d.extention9, d.status, d.remove_time ,s.dept_name from t_moc d
       left join sys_dept s on s.dept_id = d.dept_id
     </sql>
 
@@ -146,6 +147,7 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             <if test="extention8 != null "> and extention8 = #{extention8}</if>
             <if test="extention9 != null "> and extention9 = #{extention9}</if>
             <if test="status != null  and status != ''"> and status = #{status}</if>
+            <if test="removeTime != null "> and remove_time = #{removeTime}</if>
             and d.del_flag = 0
         </where>
         <!-- 数据范围过滤 -->
@@ -234,6 +236,7 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             <if test="extention8 != null">extention8,</if>
             <if test="extention9 != null">extention9,</if>
             <if test="status != null">status,</if>
+            <if test="removeTime != null">remove_time,</if>
          </trim>
         <trim prefix="values (" suffix=")" suffixOverrides=",">
             <if test="id != null">#{id},</if>
@@ -306,6 +309,7 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             <if test="extention8 != null">#{extention8},</if>
             <if test="extention9 != null">#{extention9},</if>
             <if test="status != null">#{status},</if>
+            <if test="removeTime != null">#{removeTime},</if>
          </trim>
     </insert>
 
@@ -385,6 +389,8 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             <if test="extention8 != null">extention8 = #{extention8},</if>
             <if test="extention9 != null">extention9 = #{extention9},</if>
             <if test="status != null">status = #{status},</if>
+            <if test="removeTime != null">remove_time = #{removeTime},</if>
+            <if test="removeTime == null">remove_time = null,</if>
         </trim>
         where id = #{id}
     </update>
@@ -455,9 +461,12 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
         order by dataName
     </select>
 
-    <select id="selectMocData" resultType="com.ruoyi.project.common.domain.DataEntity">
+    <select id="selectMocData"
+            parameterType="com.ruoyi.project.process.controller.vo.MocNoVO"
+            resultType="com.ruoyi.project.common.domain.DataEntity">
         SELECT count(1) as dataNum, substr(d.MOC_NO, 7, 4) as dataName FROM t_moc d
         <where>
+            and d.timeliness = #{timeliness}
             and d.del_flag = 0
         </where>
         GROUP BY substr(d.MOC_NO, 7, 4)

ui/src/api/process/moc.js

@@ -82,10 +82,11 @@ export function areaData(query) {
 }
 
 // MOC编号统计
-export function mocNoData() {
+export function mocNoData(query) {
   return request({
     url: '/process/moc/mocNoData',
     method: 'get',
+    params: query
   })
 }
 

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

@@ -1,42 +1,6 @@
 <template>
   <div class="app-container-list">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item :label="$t('MOC编号')" label-width="50" prop="mocNo">
-        <el-input
-          v-model="queryParams.mocNo"
-          :placeholder="$t('请输入') + $t('MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item :label="$t('公司MOC编号')" label-width="50" prop="companyMocNo">
-        <el-input
-          v-model="queryParams.companyMocNo"
-          :placeholder="$t('请输入') + $t('公司MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item :label="$t('工艺单元')" label-width="50" prop="processUnit">
-        <el-input
-          v-model="queryParams.processUnit"
-          :placeholder="$t('请输入') + $t('工艺单元')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item :label="$t('部门')" label-width="50" prop="department">
-        <el-input
-          v-model="queryParams.department"
-          :placeholder="$t('请输入') + $t('部门')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
       <el-form-item :label="$t('泄露位置')" label-width="50" prop="leakLocation">
         <el-input
           v-model="queryParams.leakLocation"
@@ -55,124 +19,6 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item :label="$t('操作压力')" prop="pressure">
-        <el-input v-model="queryParams.pressure" :placeholder="$t('请输入') + $t('操作压力')" />
-      </el-form-item>
-      <el-form-item :label="$t('操作温度')" prop="temperature">
-        <el-input v-model="queryParams.temperature" :placeholder="$t('请输入') + $t('操作温度')" />
-      </el-form-item>
-      <el-form-item :label="$t('泄露介质')" prop="leakFluid">
-        <el-input v-model="queryParams.leakFluid" :placeholder="$t('请输入') + $t('泄露介质')" />
-      </el-form-item>
-      <el-form-item :label="$t('介质类型')" prop="materialType">
-        <el-input v-model="queryParams.materialType" :placeholder="$t('请输入') + $t('介质类型')" />
-      </el-form-item>
-      <el-form-item :label="$t('方案日期')" prop="planDate">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.planDate"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('方案日期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('堵漏日期')" prop="sealDate">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.sealDate"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('堵漏日期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第一次延期')" prop="extention1">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention1"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第一次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第二次延期')" prop="extention2">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention2"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第二次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第三次延期')" prop="extention3">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention3"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第三次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第四次延期')" prop="extention4">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention4"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第四次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第五次延期')" prop="extention5">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention5"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第五次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第六次延期')" prop="extention6">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention6"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第六次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第七次延期')" prop="extention7">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention7"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第七次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第八次延期')" prop="extention8">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention8"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第八次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('第九次延期')" prop="extention9">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.extention9"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('第九次延期')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('卡具状态')" prop="area">
-        <el-select v-model="queryParams.status" :placeholder="$t('请选择') + $t('卡具状态')">
-          <el-option
-            v-for="dict in mocStatusOptions"
-            :key="dict.dictValue"
-            :label="dict.dictLabel"
-            :value="dict.dictValue"
-          ></el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item :label="$t('到期时间')" prop="extention9">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.expTime"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('到期时间')">
-        </el-date-picker>
-      </el-form-item>
       <el-form-item :label="$t('备注')" prop="remarks">
         <el-input
           v-model="queryParams.remarks"
@@ -239,9 +85,23 @@
       <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-row class="colorMark">
+      <svg-icon icon-class="rectangleLightgreen" class="rectangleLightgreen" style="fill:#000000;"></svg-icon>{{ $t('已移除') }}
+      <svg-icon icon-class="rectangleFlesh" class="rectangleFlesh"></svg-icon>{{ $t('7天内到期') }}
+      <svg-icon icon-class="rectangleYellow" class="rectangleYellow"></svg-icon>{{ $t('7-14天内到期') }}
+    </el-row>
+
+    <el-table
+        v-loading="loading"
+        :data="mocList"
+        @selection-change="handleSelectionChange"
+        :cell-style="tableCellStyle"
+        :cell-class-name="tableCellClassName"
+        :height="clientHeight"
+        border
+        :default-sort = "{prop: 'mocNo', order: 'descending'}">
       <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('MOC编号')" align="center" width="120" prop="mocNo" :show-overflow-tooltip="true" sortable/>
       <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" prop="department">
@@ -365,17 +225,26 @@
           </span>
         </template>
       </el-table-column>
+      <el-table-column :label="$t('移除时间')" align="center" prop="removeTime" :show-overflow-tooltip="true" width="100"/>
       <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">
+      <el-table-column :label="$t('操作')" align="center" fixed="right" width="180" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
             size="mini"
             type="text"
             icon="el-icon-s-release"
-            @click="handleDelay(scope.row)"
+            @click="handleDelay(scope.row, 1)"
             v-hasPermi="['process:moc:edit']"
             v-if="scope.row.extention9 == null && scope.row.status == 1"
-          >{{ $t('延期') }}</el-button>
+          >{{ $t('自动延期') }}</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-s-release"
+            @click="handleDelay(scope.row, 2)"
+            v-hasPermi="['process:moc:edit']"
+            v-if="scope.row.extention9 == null && scope.row.status == 1"
+          >{{ $t('手动延期') }}</el-button>
           <el-button
             size="mini"
             type="text"
@@ -427,6 +296,7 @@
         <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">
@@ -806,6 +676,7 @@
         <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-upload
@@ -839,6 +710,7 @@
         <el-button @click="upload.open = false">{{ $t('取 消') }}</el-button>
       </div>
     </el-dialog>
+
     <!-- 报告附件对话框 -->
     <el-dialog v-dialogDrag :title="doc.title" :visible.sync="doc.open" width="1000px" append-to-body >
       <el-upload v-hasPermi="['training:trainingrecords:file']"
@@ -908,6 +780,7 @@
         <el-button @click="doc.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
@@ -918,6 +791,7 @@
         <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>
@@ -925,6 +799,7 @@
         <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>
@@ -932,6 +807,7 @@
         <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>
@@ -939,13 +815,16 @@
         <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>
+      <material-type-chart2 :timeliness="2" :tempCategory="1"></material-type-chart2>
       <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>
@@ -953,90 +832,6 @@
         <el-button type="primary" @click="sealDateChart.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
-
-    <el-drawer
-      :title="$t('数据分析')"
-      size="600px"
-      :visible.sync="drawer"
-      :direction="direction">
-      <!--      <el-row style="padding-left: 20px;">-->
-      <!--      <el-form :model="chartParams" :inline="true"  label-width="68px">-->
-      <!--        <el-form-item :label="$t('年份')" label-width="50" prop="year">-->
-      <!--          <el-select v-model="chartParams.year" placeholder="请选择年份" clearable size="small">-->
-      <!--            <el-option-->
-      <!--              v-for="item in yearOption"-->
-      <!--              :key="item"-->
-      <!--              :label="item"-->
-      <!--              :value="item"-->
-      <!--            />-->
-      <!--          </el-select>-->
-      <!--        </el-form-item>-->
-      <!--        <el-form-item>-->
-      <!--          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('搜索') }}</el-button>-->
-      <!--        </el-form-item>-->
-      <!--      </el-form>-->
-      <!--      </el-row>-->
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('实施情况统计') }}</span>
-            </div>
-            <div class="text item">
-              <true-state-data> </true-state-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('申请统计') }}</span>
-            </div>
-            <div class="text item">
-              <year-chart> </year-chart>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('变更性质') +$t('空格')+ $t('统计') }}</span>
-            </div>
-            <div class="text item">
-              <change-data> </change-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('类别') +$t('空格')+ $t('统计') }}</span>
-            </div>
-            <div class="text item">
-              <category-data> </category-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('风险等级统计') }}</span>
-            </div>
-            <div class="text item">
-              <risk-data></risk-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </el-drawer>
   </div>
 </template>
 
@@ -1051,11 +846,12 @@
   import departmentChart from "../chart/departmentChart";
   import leakLocationChart from "../chart/leakLocationChart";
   import materialTypeChart from "../chart/materialTypeChart";
+  import materialTypeChart2 from "../chart/materialTypeChart2";
   import sealDateChart from "../chart/sealDateChart";
 
   export default {
     name: "Aquifier",
-    components: { sealDateChart, materialTypeChart, leakLocationChart, departmentChart, statusChart, Treeselect },
+    components: { sealDateChart, materialTypeChart, materialTypeChart2, leakLocationChart, departmentChart, statusChart, Treeselect },
     data() {
       var validateDocUpdate = (rule, value, callback) => {
         if (value == 1) {
@@ -1290,131 +1086,14 @@
           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: {
@@ -1499,15 +1178,17 @@
       tableCellStyle( {row, column, rowIndex, columnIndex} ) {
         let today = new Date(); // 当前时间
         let expTime = new Date(row.expTime);
-        let difference = expTime.getTime() - today.getTime(); // 时间差
-        if (row.tempState == 0 || row.status == 0) { // 移除的数据
-          return "background-color: rgba(0, 255, 0, 0.2);";
-        } else if (row.expTime != null && row.expTime != '') {
-          if (difference <= 7 * 24 * 60 * 60 * 1000) {  // 到期时间 - 当前时间 <= 7
-            return "background-color: rgba(255, 0, 0, 0.2);";
-          } else if (difference >= 7 * 24 * 60 * 60 * 1000
-            && difference <= 14 * 24 * 60 * 60 * 1000) {  // 7 <= 到期时间 - 当前时间 <= 14
-            return "background-color: rgba(255, 255, 0, 0.2);";
+        if (today.getTime() > expTime.getTime()) {
+          let difference = today.getTime() - expTime.getTime(); // 时间差
+          if (row.status == 0) { // 移除的数据
+            return "background-color: rgba(146, 208, 80, 1);";
+          } else if (row.expTime != null && row.expTime != '') {
+            if (difference <= 7 * 24 * 60 * 60 * 1000) {  // 到期时间 - 当前时间 <= 7
+              return "background-color: rgba(250, 191, 143, 1);";
+            } else if (difference >= 7 * 24 * 60 * 60 * 1000
+              && difference <= 14 * 24 * 60 * 60 * 1000) {  // 7 <= 到期时间 - 当前时间 <= 14
+              return "background-color: rgba(255, 255, 0, 1);";
+            }
           }
         }
       },
@@ -1677,20 +1358,16 @@
       //实施情况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
         }
       },
       //根据分数显示颜色提示
@@ -1711,15 +1388,31 @@
         }
       },
       /** 延期按钮操作 */
-      handleDelay(row) {
-        this.delayForm.id = row.id;
-        this.delayDialog.open = true;
-        this.delayDialog.title = row.mocNo.toString() + '延期操作';
+      handleDelay(row, type) {
+        if (type == 1) {  // 自动延期
+          if (row.sealDate == null) {
+            this.msgError(this.$t('未填写堵漏日期，不可执行延期操作。'));
+          } else {
+            this.$confirm(this.$t('是否确认延期?'), this.$t('警告'), {
+              confirmButtonText: this.$t('确定'),
+              cancelButtonText: this.$t('取消'),
+              type: "warning"
+            }).then(function() {
+              return delay({id: row.id, extention: null});
+            }).then(() => {
+              this.getList();
+              this.msgSuccess(this.$t('延期成功'));
+            })
+          }
+        } else if (type == 2) {  // 手动延期
+          this.delayForm.id = row.id;
+          this.delayDialog.open = true;
+          this.delayDialog.title = row.mocNo.toString() + '延期操作';
+        }
       },
       /** 修改按钮操作 */
       handleUpdate(row) {
         this.reset();
-        // this.rules = this.commonRules
         const id = row.id || this.ids
         getMoc(id).then(response => {
           this.form = response.data;
@@ -1956,6 +1649,25 @@
   };
 </script>
 <style>
+  .colorMark {
+    color: #6f6f6f;
+    text-align: right;
+    font-weight:bold;
+    font-size: 13px;
+    padding-bottom: 5px;
+  }
+  .rectangleLightgreen {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleFlesh {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleYellow {
+    width: 40px !important;
+    height: 20px !important;
+  }
   #sealDate:hover{
     cursor: pointer;
   }

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

@@ -0,0 +1,117 @@
+<template>
+  <div>
+    <div id="materialTypeChart2" :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 => {
+          let chartData = [];
+          let count = 0;
+          for (let i = 0; i < response.length; i++) {
+            if (response[i].dataName == "工艺") {
+              chartData.push({dataName: "工艺", dataNum: response[i].dataNum});
+            } else {
+              count += response[i].dataNum;
+            }
+          }
+          chartData.push({dataName: "非工艺", dataNum: count});
+          this.chartData = chartData;
+          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('materialTypeChart2'))
+        this.chart.setOption(this.option)
+      }
+    }
+  }
+</script>

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

@@ -21,7 +21,6 @@
     data() {
       return {
         option: {
-          color: ['#3398DB'],
           /* 周围边距 */
           grid: {
             left: '3%',
@@ -32,7 +31,7 @@
           },
           /* 标识 */
           legend: {
-            data: ['永久/临时MOC'],
+            data: ['永久MOC', '临时MOC'],
           },
           toolbox: {
             show: true,
@@ -63,33 +62,82 @@
           yAxis: {
           },
           series: [{
-            name: '永久/临时MOC',
+            name: '永久MOC',
             type: 'bar',
-            barWidth: '40%',
+            // barWidth: '40%',
+            stack: 'MOC',
             data: []
-          }]
+          },
+            {
+              name: '临时MOC',
+              type: 'bar',
+              // barWidth: '40%',
+              stack: 'MOC',
+              data: []
+            },
+          ]
         },
         // 查询参数
         queryParams: {},
         chart: null,
-        chartData : []
+        chartData1 : [],
+        chartData2 : [],
       }
     },
     mounted() {
       this.$nextTick(() => {
-        mocNoData().then(response => {
-          this.chartData = response
-          for(let i = 0 ; i <this.chartData.length ; i++){
-            if(this.chartData[i].dataName!= null && this.chartData[i].dataName!= ''){
-              this.option.xAxis.data.push(this.chartData[i].dataName)
-              this.option.series[0].data.push(this.chartData[i].dataNum)
+        mocNoData({timeliness: 1}).then(response => {
+          this.chartData1 = response;
+          mocNoData({timeliness: 2}).then(response => {
+            this.chartData2 = response;
+            let xData = [];
+            let yData1 = [];
+            let yData2 = [];
+            for(let i = 0 ; i < this.chartData1.length ; i++) {
+              xData.push(this.chartData1[i].dataName);
             }
-          }
-          this.initChart()
+            for(let i = 0 ; i < this.chartData2.length ; i++) {
+              xData.push(this.chartData2[i].dataName);
+            }
+            xData = this.unique(xData);
+            this.option.xAxis.data = xData;
+            for(let i = 0 ; i < xData.length ; i++) {
+              yData1[i] = 0;
+              yData2[i] = 0;
+              for(let j = 0 ; j < this.chartData1.length ; j++) {
+                if (xData[i] == this.chartData1[j].dataName) {
+                  yData1[i] = this.chartData1[j].dataNum;
+                }
+              }
+              for(let j = 0 ; j < this.chartData2.length ; j++) {
+                if (xData[i] == this.chartData2[j].dataName) {
+                  yData2[i] = this.chartData2[j].dataNum;
+                }
+              }
+            }
+            this.option.series[0].data = yData1;
+            this.option.series[1].data = yData2;
+            this.initChart();
+          });
         });
       })
     },
     methods: {
+      // 数组去重
+      unique(arr) {
+        if (!Array.isArray(arr)) {
+          console.log('type error!')
+          return;
+        }
+        arr = arr.sort()
+        var arrry= [arr[0]];
+        for (var i = 1; i < arr.length; i++) {
+          if (arr[i] !== arr[i-1]) {
+            arrry.push(arr[i]);
+          }
+        }
+        return arrry;
+      },
       /** 获取当前年份 */
       getNowTime() {
         var now = new Date();

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

@@ -1,52 +1,6 @@
 <template>
   <div class="app-container-list">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item :label="$t('MOC编号')" label-width="50" prop="mocNo">
-        <el-input
-          v-model="queryParams.mocNo"
-          :placeholder="$t('请输入') + $t('MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item :label="$t('公司MOC编号')" label-width="50" prop="companyMocNo">
-        <el-input
-          v-model="queryParams.companyMocNo"
-          :placeholder="$t('请输入') + $t('公司MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item :label="$t('位置')" label-width="50" prop="location">
-        <el-input
-          v-model="queryParams.location"
-          :placeholder="$t('请输入') + $t('位置')"
-          clearable
-          size="small"
-          @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"
@@ -56,174 +10,6 @@
           @keyup.enter.native="handleQuery"
         />
       </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="mcTime">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.expTime"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('到期时间')">
-        </el-date-picker>
-      </el-form-item>
-      <!--<el-form-item :label="$t('临时MOC状态')" prop="mocType">-->
-        <!--<el-select v-model="queryParams.tempState" :placeholder="$t('请选择') + $t('临时MOC状态')">-->
-          <!--<el-option-->
-            <!--v-for="dict in tempStateOptions"-->
-            <!--:key="dict.dictValue"-->
-            <!--:label="dict.dictLabel"-->
-            <!--:value="dict.dictValue"-->
-          <!--&gt;</el-option>-->
-        <!--</el-select>-->
-      <!--</el-form-item>-->
-      <el-form-item :label="$t('备注')" prop="remarks">
-        <el-input
-          v-model="queryParams.remarks"
-          :placeholder="$t('请输入') + $t('备注')"
-          clearable
-          size="small"
-          @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>
@@ -289,105 +75,48 @@
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
+    <el-row class="colorMark">
+      <svg-icon icon-class="rectangleLightgreen" class="rectangleLightgreen" style="fill:#000000;"></svg-icon>{{ $t('已移除') }}
+      <svg-icon icon-class="rectangleFlesh" class="rectangleFlesh"></svg-icon>{{ $t('7天内到期') }}
+      <svg-icon icon-class="rectangleYellow" class="rectangleYellow"></svg-icon>{{ $t('7-14天内到期') }}
+    </el-row>
+
     <el-table v-loading="loading"
               :data="mocList"
               @selection-change="handleSelectionChange"
               :cell-style="tableCellStyle"
               :cell-class-name="tableCellClassName"
               :height="clientHeight"
-              border>
+              border
+              :default-sort = "{prop: 'mocNo', order: 'descending'}">
       <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="mocNo" :show-overflow-tooltip="true" sortable/>
       <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="location" :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" 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">-->
-          <!--MOC类型-->
-          <!--<span-->
-            <!--@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="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('备注')" align="center" prop="remarks" :show-overflow-tooltip="true"/>
-      <!--<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('临时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('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="removeTime" :show-overflow-tooltip="true" width="100"/>
+      <el-table-column :label="$t('备注')" align="center" prop="remarks" :show-overflow-tooltip="true"/>
       <el-table-column :label="$t('操作')" align="center" fixed="right" width="180" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <!--<el-button-->
-            <!--size="mini"-->
-            <!--type="text"-->
-            <!--icon="el-icon-circle-close"-->
-            <!--@click="handleRemove(scope.row)"-->
-            <!--v-hasPermi="['process:moc:edit']"-->
-            <!--v-if="scope.row.tempState == 1"-->
-          <!--&gt;{{ $t('移除') }}</el-button>-->
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-circle-close"
+            @click="handleRemove(scope.row)"
+            v-hasPermi="['process:moc:edit']"
+            v-if="scope.row.tempState == 1"
+          >{{ $t('移除') }}</el-button>
           <el-button
             size="mini"
             type="text"
@@ -417,16 +146,7 @@
     <!-- 添加或修改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">
-        <!--<el-form-item :label="$t('装置名称')" prop="plantCode">-->
-        <!--<el-select v-model="form.plantCode" :placeholder="$t('请选择') + $t('装置名称')">-->
-        <!--<el-option-->
-        <!--v-for="dict in plantCodeOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
+
         <el-form-item :label="$t('MOC编号')" prop="mocNo">
           <el-input v-model="form.mocNo" :placeholder="$t('请输入') + $t('MOC编号')" />
         </el-form-item>
@@ -436,61 +156,9 @@
         <el-form-item :label="$t('位置')" prop="location">
           <el-input v-model="form.location" :placeholder="$t('请输入') + $t('位置')" />
         </el-form-item>
-        <!--<el-form-item :label="$t('项目号')" prop="projectNo">-->
-          <!--<el-input v-model="form.projectNo" :placeholder="$t('请输入') + $t('项目号')" />-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('区域')" prop="area">-->
-          <!--<el-select v-model="form.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="form.title" :placeholder="$t('请输入') + $t('标题')" />
         </el-form-item>
-        <!--<el-form-item :label="$t('MOC类型')" prop="mocType">-->
-          <!--<el-select v-model="form.mocType" :placeholder="$t('请选择') + $t('MOC类型')">-->
-            <!--<el-option-->
-              <!--v-for="dict in mocTypeOptions"-->
-              <!--: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="form.owner" :placeholder="$t('请输入') + $t('负责人')" />-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('申请时间')" prop="approveTime">-->
-          <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                          <!--v-model="form.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="form.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-select v-model="form.mcDetail" :placeholder="$t('请选择') + $t('MC情况')">-->
-            <!--<el-option-->
-              <!--v-for="dict in mcDetailOptions"-->
-              <!--:key="dict.dictValue"-->
-              <!--:label="dict.dictLabel"-->
-              <!--:value="dict.dictValue"-->
-            <!--&gt;</el-option>-->
-          <!--</el-select>-->
-        <!--</el-form-item>-->
         <el-form-item :label="$t('到期时间')" prop="mcTime">
           <el-date-picker clearable size="small" style="width: 200px"
                           v-model="form.expTime"
@@ -499,185 +167,19 @@
                           :placeholder="$t('请选择') + $t('到期时间')">
           </el-date-picker>
         </el-form-item>
-        <!--<el-form-item :label="$t('临时MOC状态')" prop="mocType">-->
-          <!--<el-select v-model="form.tempState" :placeholder="$t('请选择') + $t('临时MOC状态')">-->
-            <!--<el-option-->
-              <!--v-for="dict in tempStateOptions"-->
-              <!--:key="dict.dictValue"-->
-              <!--:label="dict.dictLabel"-->
-              <!--:value="dict.dictValue"-->
-            <!--&gt;</el-option>-->
-          <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('完成时间')" prop="endtime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-        <!--v-model="form.endtime"-->
-        <!--type="date"-->
-        <!--value-format="yyyy-MM-dd"-->
-        <!--:placeholder="$t('请选择') + $t('完成时间')">-->
-        <!--</el-date-picker>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('实施情况')" prop="trueState">-->
-        <!--<el-select v-model="form.trueState" :placeholder="$t('请选择') + $t('实施情况')" @change="changeTrueState($event)">-->
-        <!--<el-option-->
-        <!--v-for="dict in trueStateOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('变更性质')" prop="changeNature">-->
-        <!--<el-select v-model="form.changeNature" :placeholder="$t('请选择') + $t('变更性质')" @change="changeChangeNature($event)">-->
-        <!--<el-option-->
-        <!--v-for="dict in changeNatureOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('到期时间')" prop="overTime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-        <!--v-model="form.overTime"-->
-        <!--type="date"-->
-        <!--value-format="yyyy-MM-dd"-->
-        <!--:placeholder="$t('请选择') + $t('到期时间')">-->
-        <!--</el-date-picker>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('临时MOC状态')" prop="temporaryState">-->
-        <!--<el-select v-model="form.temporaryState" :placeholder="$t('请选择') + $t('临时MOC状态')">-->
-        <!--<el-option-->
-        <!--v-for="dict in temporaryStateOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <el-form-item :label="$t('备注')" prop="remarks">
-          <el-input v-model="form.remarks" type="textarea" :placeholder="$t('请输入') + $t('备注')" />
-        </el-form-item>
-        <!--<el-form-item :label="$t('风险等级')" prop="riskLevel">-->
-          <!--<el-select v-model="form.riskLevel" :placeholder="$t('请选择') + $t('风险等级')">-->
-            <!--<el-option-->
-              <!--v-for="dict in riskLevelOptions"-->
-              <!--:key="dict.dictValue"-->
-              <!--:label="dict.dictLabel"-->
-              <!--:value="dict.dictValue"-->
-            <!--&gt;</el-option>-->
-          <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('EHS评估/审查')" prop="ehsCheck">-->
-          <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                          <!--v-model="form.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="form.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="form.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="form.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="form.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="form.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="form.pssrNo" :placeholder="$t('请输入') + $t('PSSR编号')" />-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('装置编号')" prop="plantNumber">
-          <el-input v-model="form.plantNumber" :placeholder="$t('请输入') + $t('装置编号')" />
-        </el-form-item>
-        <el-form-item :label="$t('通知单')" prop="noticeLetter">
-          <el-input v-model="form.noticeLetter" :placeholder="$t('请输入') + $t('通知单')" />
-        </el-form-item>
-        <el-form-item :label="$t('工作单')" prop="workLetter">
-          <el-input v-model="form.workLetter" :placeholder="$t('请输入') + $t('工作单')" />
-        </el-form-item>
-        <el-form-item :label="$t('CTE工作号')" prop="cteNo">
-          <el-input v-model="form.cteNo" :placeholder="$t('请输入') + $t('CTE工作号')" />
-        </el-form-item>
-        <el-form-item :label="$t('投资费用(RMB)')" prop="investCost">
-          <el-input v-model="form.investCost" :placeholder="$t('请输入') + $t('投资费用(RMB)')" />
-        </el-form-item>
-        <el-form-item :label="$t('类别')" prop="category">
-          <el-select v-model="form.category" :placeholder="$t('请选择') + $t('类别')">
+        <el-form-item :label="$t('临时MOC状态')" prop="mocType">
+          <el-select v-model="form.tempState" :placeholder="$t('请选择') + $t('临时MOC状态')">
             <el-option
-              v-for="dict in categoryOptions"
+              v-for="dict in tempStateOptions"
               :key="dict.dictValue"
               :label="dict.dictLabel"
               :value="dict.dictValue"
             ></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item :label="$t('重要性')" prop="significance">
-          <el-input v-model="form.significance" :placeholder="$t('请输入') + $t('重要性')" />
-        </el-form-item>
-        <el-form-item :label="$t('分类')" prop="classification">
-          <el-input v-model="form.classification" :placeholder="$t('请输入') + $t('分类')" />
-        </el-form-item>
-        <el-form-item :label="$t('仪表控制')" prop="dashControl">
-          <el-input v-model="form.dashControl" :placeholder="$t('请输入') + $t('仪表控制')" />
-        </el-form-item>
-        <el-form-item :label="$t('预计完成时间')" prop="estimateEndtime">
-          <el-date-picker clearable size="small" style="width: 200px"
-                          v-model="form.estimateEndtime"
-                          type="date"
-                          value-format="yyyy-MM-dd"
-                          :placeholder="$t('请选择') + $t('预计完成时间')">
-          </el-date-picker>
-        </el-form-item>
-        <el-form-item :label="$t('EHS审查数据库')" prop="ehsDb">
-          <el-input v-model="form.ehsDb" :placeholder="$t('请输入') + $t('EHS审查数据库')" />
-        </el-form-item>
-        <el-form-item :label="$t('PSSR数据库')" prop="pssrDb">
-          <el-input v-model="form.pssrDb" :placeholder="$t('请输入') + $t('PSSR数据库')" />
+        <el-form-item :label="$t('备注')" prop="remarks">
+          <el-input v-model="form.remarks" type="textarea" :placeholder="$t('请输入') + $t('备注')" />
         </el-form-item>
-        <el-form-item :label="$t('CAPEX计划')" prop="capex">
-          <el-input v-model="form.capex" :placeholder="$t('请输入') + $t('CAPEX计划')" />
-        </el-form-item>-->
         <el-form-item :label="$t('归属部门')" prop="deptId">
           <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" :placeholder="$t('请选择') + $t('归属部门')" />
         </el-form-item>
@@ -687,6 +189,7 @@
         <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-upload
@@ -720,6 +223,7 @@
         <el-button @click="upload.open = false">{{ $t('取 消') }}</el-button>
       </div>
     </el-dialog>
+
     <!-- 报告附件对话框 -->
     <el-dialog v-dialogDrag :title="doc.title" :visible.sync="doc.open" width="1000px" append-to-body >
       <el-upload v-hasPermi="['training:trainingrecords:file']"
@@ -789,6 +293,7 @@
         <el-button @click="doc.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
@@ -799,89 +304,6 @@
         <el-button type="primary" @click="mocTypeInfo.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
-    <el-drawer
-      :title="$t('数据分析')"
-      size="600px"
-      :visible.sync="drawer"
-      :direction="direction">
-      <!--      <el-row style="padding-left: 20px;">-->
-      <!--      <el-form :model="chartParams" :inline="true"  label-width="68px">-->
-      <!--        <el-form-item :label="$t('年份')" label-width="50" prop="year">-->
-      <!--          <el-select v-model="chartParams.year" placeholder="请选择年份" clearable size="small">-->
-      <!--            <el-option-->
-      <!--              v-for="item in yearOption"-->
-      <!--              :key="item"-->
-      <!--              :label="item"-->
-      <!--              :value="item"-->
-      <!--            />-->
-      <!--          </el-select>-->
-      <!--        </el-form-item>-->
-      <!--        <el-form-item>-->
-      <!--          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('搜索') }}</el-button>-->
-      <!--        </el-form-item>-->
-      <!--      </el-form>-->
-      <!--      </el-row>-->
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('实施情况统计') }}</span>
-            </div>
-            <div class="text item">
-              <true-state-data> </true-state-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('申请统计') }}</span>
-            </div>
-            <div class="text item">
-              <year-chart> </year-chart>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('变更性质') +$t('空格')+ $t('统计') }}</span>
-            </div>
-            <div class="text item">
-              <change-data> </change-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('类别') +$t('空格')+ $t('统计') }}</span>
-            </div>
-            <div class="text item">
-              <category-data> </category-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('风险等级统计') }}</span>
-            </div>
-            <div class="text item">
-              <risk-data></risk-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </el-drawer>
   </div>
 </template>
 
@@ -1079,131 +501,14 @@
           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: {
@@ -1256,6 +561,19 @@
       });
     },
     methods: {
+      /** 移除按钮操作 */
+      handleRemove(row) {
+        this.$confirm(this.$t('是否确认移除?'), this.$t('警告'), {
+          confirmButtonText: this.$t('确定'),
+          cancelButtonText: this.$t('取消'),
+          type: "warning"
+        }).then(function() {
+          updateMoc({id: row.id, tempState: 0});
+        }).then(() => {
+          this.getList();
+          this.msgSuccess(this.$t('移除成功'));
+        })
+      },
       /** 查询MOC管理列表 */
       getList() {
         this.loading = true;
@@ -1275,15 +593,17 @@
       tableCellStyle( {row, column, rowIndex, columnIndex} ) {
         let today = new Date(); // 当前时间
         let expTime = new Date(row.expTime);
-        let difference = expTime.getTime() - today.getTime(); // 时间差
-        if (row.tempState == 0) { // 移除的数据
-          return "background-color: rgba(0, 255, 0, 0.2);";
-        } else if (row.expTime != null && row.expTime != '') {
-          if (difference <= 7 * 24 * 60 * 60 * 1000) {  // 到期时间 - 当前时间 <= 7
-            return "background-color: rgba(255, 0, 0, 0.2);";
-          } else if (difference >= 7 * 24 * 60 * 60 * 1000
-            && difference <= 14 * 24 * 60 * 60 * 1000) {  // 7 <= 到期时间 - 当前时间 <= 14
-            return "background-color: rgba(255, 255, 0, 0.2);";
+        if (today.getTime() > expTime.getTime()) {
+          let difference = today.getTime() - expTime.getTime(); // 时间差
+          if (row.tempState == 0) { // 移除的数据
+            return "background-color: rgba(146, 208, 80, 1);";
+          } else if (row.expTime != null && row.expTime != '') {
+            if (difference <= 7 * 24 * 60 * 60 * 1000) {  // 到期时间 - 当前时间 <= 7
+              return "background-color: rgba(250, 191, 143, 1);";
+            } else if (difference >= 7 * 24 * 60 * 60 * 1000
+              && difference <= 14 * 24 * 60 * 60 * 1000) {  // 7 <= 到期时间 - 当前时间 <= 14
+              return "background-color: rgba(255, 255, 0, 1);";
+            }
           }
         }
       },
@@ -1450,20 +770,16 @@
       //实施情况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
         }
       },
       //根据分数显示颜色提示
@@ -1486,7 +802,6 @@
       /** 修改按钮操作 */
       handleUpdate(row) {
         this.reset();
-        // this.rules = this.commonRules
         const id = row.id || this.ids
         getMoc(id).then(response => {
           this.form = response.data;
@@ -1729,6 +1044,25 @@
   };
 </script>
 <style>
+  .colorMark {
+    color: #6f6f6f;
+    text-align: right;
+    font-weight:bold;
+    font-size: 13px;
+    padding-bottom: 5px;
+  }
+  .rectangleLightgreen {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleFlesh {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleYellow {
+    width: 40px !important;
+    height: 20px !important;
+  }
   #moc-type:hover{
     cursor: pointer;
   }

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

@@ -1,52 +1,6 @@
 <template>
   <div class="app-container-list">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item :label="$t('MOC编号')" label-width="50" prop="mocNo">
-        <el-input
-          v-model="queryParams.mocNo"
-          :placeholder="$t('请输入') + $t('MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item :label="$t('公司MOC编号')" label-width="50" prop="companyMocNo">
-        <el-input
-          v-model="queryParams.companyMocNo"
-          :placeholder="$t('请输入') + $t('公司MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <!--<el-form-item :label="$t('位置')" label-width="50" prop="location">-->
-        <!--<el-input-->
-          <!--v-model="queryParams.location"-->
-          <!--:placeholder="$t('请输入') + $t('位置')"-->
-          <!--clearable-->
-          <!--size="small"-->
-          <!--@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"
@@ -56,182 +10,6 @@
           @keyup.enter.native="handleQuery"
         />
       </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="finishDate">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.finishDate"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('完成时间')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('到期时间')" prop="mcTime">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.expTime"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('到期时间')">
-        </el-date-picker>
-      </el-form-item>
-      <!--<el-form-item :label="$t('临时MOC状态')" prop="mocType">-->
-      <!--<el-select v-model="queryParams.tempState" :placeholder="$t('请选择') + $t('临时MOC状态')">-->
-      <!--<el-option-->
-      <!--v-for="dict in tempStateOptions"-->
-      <!--:key="dict.dictValue"-->
-      <!--:label="dict.dictLabel"-->
-      <!--:value="dict.dictValue"-->
-      <!--&gt;</el-option>-->
-      <!--</el-select>-->
-      <!--</el-form-item>-->
-      <el-form-item :label="$t('备注')" prop="remarks">
-        <el-input
-          v-model="queryParams.remarks"
-          :placeholder="$t('请输入') + $t('备注')"
-          clearable
-          size="small"
-          @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>
@@ -297,106 +75,48 @@
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
+    <el-row class="colorMark">
+      <svg-icon icon-class="rectangleLightgreen" class="rectangleLightgreen" style="fill:#000000;"></svg-icon>{{ $t('已移除') }}
+      <svg-icon icon-class="rectangleFlesh" class="rectangleFlesh"></svg-icon>{{ $t('7天内到期') }}
+      <svg-icon icon-class="rectangleYellow" class="rectangleYellow"></svg-icon>{{ $t('7-14天内到期') }}
+    </el-row>
+
     <el-table v-loading="loading"
               :data="mocList"
               @selection-change="handleSelectionChange"
               :cell-style="tableCellStyle"
               :cell-class-name="tableCellClassName"
               :height="clientHeight"
-              border>
+              border
+              :default-sort = "{prop: 'mocNo', order: 'descending'}">
       <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="mocNo" :show-overflow-tooltip="true" sortable/>
       <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="location" :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" 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">-->
-      <!--MOC类型-->
-      <!--<span-->
-      <!--@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="finishDate" :show-overflow-tooltip="true" width="100"/>
       <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('备注')" align="center" prop="remarks" :show-overflow-tooltip="true"/>
-      <!--<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('临时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('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="removeTime" :show-overflow-tooltip="true" width="100"/>
+      <el-table-column :label="$t('备注')" align="center" prop="remarks" :show-overflow-tooltip="true"/>
       <el-table-column :label="$t('操作')" align="center" fixed="right" width="180" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <!--<el-button-->
-          <!--size="mini"-->
-          <!--type="text"-->
-          <!--icon="el-icon-circle-close"-->
-          <!--@click="handleRemove(scope.row)"-->
-          <!--v-hasPermi="['process:moc:edit']"-->
-          <!--v-if="scope.row.tempState == 1"-->
-          <!--&gt;{{ $t('移除') }}</el-button>-->
+          <el-button
+          size="mini"
+          type="text"
+          icon="el-icon-circle-close"
+          @click="handleRemove(scope.row)"
+          v-hasPermi="['process:moc:edit']"
+          v-if="scope.row.tempState == 1"
+          >{{ $t('移除') }}</el-button>
           <el-button
             size="mini"
             type="text"
@@ -426,80 +146,15 @@
     <!-- 添加或修改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">
-        <!--<el-form-item :label="$t('装置名称')" prop="plantCode">-->
-        <!--<el-select v-model="form.plantCode" :placeholder="$t('请选择') + $t('装置名称')">-->
-        <!--<el-option-->
-        <!--v-for="dict in plantCodeOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
         <el-form-item :label="$t('MOC编号')" prop="mocNo">
           <el-input v-model="form.mocNo" :placeholder="$t('请输入') + $t('MOC编号')" />
         </el-form-item>
         <el-form-item :label="$t('公司MOC编号')" prop="companyMocNo">
           <el-input v-model="form.companyMocNo" :placeholder="$t('请输入') + $t('公司MOC编号')" />
         </el-form-item>
-        <!--<el-form-item :label="$t('位置')" prop="location">-->
-          <!--<el-input v-model="form.location" :placeholder="$t('请输入') + $t('位置')" />-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('项目号')" prop="projectNo">-->
-        <!--<el-input v-model="form.projectNo" :placeholder="$t('请输入') + $t('项目号')" />-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('区域')" prop="area">-->
-        <!--<el-select v-model="form.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="form.title" :placeholder="$t('请输入') + $t('标题')" />
         </el-form-item>
-        <!--<el-form-item :label="$t('MOC类型')" prop="mocType">-->
-        <!--<el-select v-model="form.mocType" :placeholder="$t('请选择') + $t('MOC类型')">-->
-        <!--<el-option-->
-        <!--v-for="dict in mocTypeOptions"-->
-        <!--: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="form.owner" :placeholder="$t('请输入') + $t('负责人')" />-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('申请时间')" prop="approveTime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-        <!--v-model="form.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="form.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-select v-model="form.mcDetail" :placeholder="$t('请选择') + $t('MC情况')">-->
-        <!--<el-option-->
-        <!--v-for="dict in mcDetailOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
         <el-form-item :label="$t('完成时间')" prop="mcTime">
           <el-date-picker clearable size="small" style="width: 200px"
                           v-model="form.finishDate"
@@ -516,185 +171,19 @@
                           :placeholder="$t('请选择') + $t('到期时间')">
           </el-date-picker>
         </el-form-item>
-        <!--<el-form-item :label="$t('临时MOC状态')" prop="mocType">-->
-        <!--<el-select v-model="form.tempState" :placeholder="$t('请选择') + $t('临时MOC状态')">-->
-        <!--<el-option-->
-        <!--v-for="dict in tempStateOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('完成时间')" prop="endtime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-        <!--v-model="form.endtime"-->
-        <!--type="date"-->
-        <!--value-format="yyyy-MM-dd"-->
-        <!--:placeholder="$t('请选择') + $t('完成时间')">-->
-        <!--</el-date-picker>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('实施情况')" prop="trueState">-->
-        <!--<el-select v-model="form.trueState" :placeholder="$t('请选择') + $t('实施情况')" @change="changeTrueState($event)">-->
-        <!--<el-option-->
-        <!--v-for="dict in trueStateOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('变更性质')" prop="changeNature">-->
-        <!--<el-select v-model="form.changeNature" :placeholder="$t('请选择') + $t('变更性质')" @change="changeChangeNature($event)">-->
-        <!--<el-option-->
-        <!--v-for="dict in changeNatureOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('到期时间')" prop="overTime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-        <!--v-model="form.overTime"-->
-        <!--type="date"-->
-        <!--value-format="yyyy-MM-dd"-->
-        <!--:placeholder="$t('请选择') + $t('到期时间')">-->
-        <!--</el-date-picker>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('临时MOC状态')" prop="temporaryState">-->
-        <!--<el-select v-model="form.temporaryState" :placeholder="$t('请选择') + $t('临时MOC状态')">-->
-        <!--<el-option-->
-        <!--v-for="dict in temporaryStateOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <el-form-item :label="$t('备注')" prop="remarks">
-          <el-input v-model="form.remarks" type="textarea" :placeholder="$t('请输入') + $t('备注')" />
-        </el-form-item>
-        <!--<el-form-item :label="$t('风险等级')" prop="riskLevel">-->
-        <!--<el-select v-model="form.riskLevel" :placeholder="$t('请选择') + $t('风险等级')">-->
-        <!--<el-option-->
-        <!--v-for="dict in riskLevelOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('EHS评估/审查')" prop="ehsCheck">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-        <!--v-model="form.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="form.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="form.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="form.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="form.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="form.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="form.pssrNo" :placeholder="$t('请输入') + $t('PSSR编号')" />-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('装置编号')" prop="plantNumber">
-          <el-input v-model="form.plantNumber" :placeholder="$t('请输入') + $t('装置编号')" />
-        </el-form-item>
-        <el-form-item :label="$t('通知单')" prop="noticeLetter">
-          <el-input v-model="form.noticeLetter" :placeholder="$t('请输入') + $t('通知单')" />
-        </el-form-item>
-        <el-form-item :label="$t('工作单')" prop="workLetter">
-          <el-input v-model="form.workLetter" :placeholder="$t('请输入') + $t('工作单')" />
-        </el-form-item>
-        <el-form-item :label="$t('CTE工作号')" prop="cteNo">
-          <el-input v-model="form.cteNo" :placeholder="$t('请输入') + $t('CTE工作号')" />
-        </el-form-item>
-        <el-form-item :label="$t('投资费用(RMB)')" prop="investCost">
-          <el-input v-model="form.investCost" :placeholder="$t('请输入') + $t('投资费用(RMB)')" />
-        </el-form-item>
-        <el-form-item :label="$t('类别')" prop="category">
-          <el-select v-model="form.category" :placeholder="$t('请选择') + $t('类别')">
+        <el-form-item :label="$t('临时MOC状态')" prop="mocType">
+          <el-select v-model="form.tempState" :placeholder="$t('请选择') + $t('临时MOC状态')">
             <el-option
-              v-for="dict in categoryOptions"
+              v-for="dict in tempStateOptions"
               :key="dict.dictValue"
               :label="dict.dictLabel"
               :value="dict.dictValue"
             ></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item :label="$t('重要性')" prop="significance">
-          <el-input v-model="form.significance" :placeholder="$t('请输入') + $t('重要性')" />
-        </el-form-item>
-        <el-form-item :label="$t('分类')" prop="classification">
-          <el-input v-model="form.classification" :placeholder="$t('请输入') + $t('分类')" />
-        </el-form-item>
-        <el-form-item :label="$t('仪表控制')" prop="dashControl">
-          <el-input v-model="form.dashControl" :placeholder="$t('请输入') + $t('仪表控制')" />
-        </el-form-item>
-        <el-form-item :label="$t('预计完成时间')" prop="estimateEndtime">
-          <el-date-picker clearable size="small" style="width: 200px"
-                          v-model="form.estimateEndtime"
-                          type="date"
-                          value-format="yyyy-MM-dd"
-                          :placeholder="$t('请选择') + $t('预计完成时间')">
-          </el-date-picker>
-        </el-form-item>
-        <el-form-item :label="$t('EHS审查数据库')" prop="ehsDb">
-          <el-input v-model="form.ehsDb" :placeholder="$t('请输入') + $t('EHS审查数据库')" />
-        </el-form-item>
-        <el-form-item :label="$t('PSSR数据库')" prop="pssrDb">
-          <el-input v-model="form.pssrDb" :placeholder="$t('请输入') + $t('PSSR数据库')" />
+        <el-form-item :label="$t('备注')" prop="remarks">
+          <el-input v-model="form.remarks" type="textarea" :placeholder="$t('请输入') + $t('备注')" />
         </el-form-item>
-        <el-form-item :label="$t('CAPEX计划')" prop="capex">
-          <el-input v-model="form.capex" :placeholder="$t('请输入') + $t('CAPEX计划')" />
-        </el-form-item>-->
         <el-form-item :label="$t('归属部门')" prop="deptId">
           <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" :placeholder="$t('请选择') + $t('归属部门')" />
         </el-form-item>
@@ -704,6 +193,7 @@
         <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-upload
@@ -737,6 +227,7 @@
         <el-button @click="upload.open = false">{{ $t('取 消') }}</el-button>
       </div>
     </el-dialog>
+
     <!-- 报告附件对话框 -->
     <el-dialog v-dialogDrag :title="doc.title" :visible.sync="doc.open" width="1000px" append-to-body >
       <el-upload v-hasPermi="['training:trainingrecords:file']"
@@ -806,6 +297,7 @@
         <el-button @click="doc.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
@@ -1096,131 +588,14 @@
           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: {
@@ -1273,6 +648,19 @@
       });
     },
     methods: {
+      /** 移除按钮操作 */
+      handleRemove(row) {
+        this.$confirm(this.$t('是否确认移除?'), this.$t('警告'), {
+          confirmButtonText: this.$t('确定'),
+          cancelButtonText: this.$t('取消'),
+          type: "warning"
+        }).then(function() {
+          updateMoc({id: row.id, tempState: 0});
+        }).then(() => {
+          this.getList();
+          this.msgSuccess(this.$t('移除成功'));
+        })
+      },
       /** 查询MOC管理列表 */
       getList() {
         this.loading = true;
@@ -1292,15 +680,17 @@
       tableCellStyle( {row, column, rowIndex, columnIndex} ) {
         let today = new Date(); // 当前时间
         let expTime = new Date(row.expTime);
-        let difference = expTime.getTime() - today.getTime(); // 时间差
-        if (row.tempState == 0) { // 移除的数据
-          return "background-color: rgba(0, 255, 0, 0.2);";
-        } else if (row.expTime != null && row.expTime != '') {
-          if (difference <= 7 * 24 * 60 * 60 * 1000) {  // 到期时间 - 当前时间 <= 7
-            return "background-color: rgba(255, 0, 0, 0.2);";
-          } else if (difference >= 7 * 24 * 60 * 60 * 1000
-            && difference <= 14 * 24 * 60 * 60 * 1000) {  // 7 <= 到期时间 - 当前时间 <= 14
-            return "background-color: rgba(255, 255, 0, 0.2);";
+        if (today.getTime() > expTime.getTime()) {
+          let difference = today.getTime() - expTime.getTime(); // 时间差
+          if (row.tempState == 0) { // 移除的数据
+            return "background-color: rgba(146, 208, 80, 1);";
+          } else if (row.expTime != null && row.expTime != '') {
+            if (difference <= 7 * 24 * 60 * 60 * 1000) {  // 到期时间 - 当前时间 <= 7
+              return "background-color: rgba(250, 191, 143, 1);";
+            } else if (difference >= 7 * 24 * 60 * 60 * 1000
+              && difference <= 14 * 24 * 60 * 60 * 1000) {  // 7 <= 到期时间 - 当前时间 <= 14
+              return "background-color: rgba(255, 255, 0, 1);";
+            }
           }
         }
       },
@@ -1467,20 +857,16 @@
       //实施情况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
         }
       },
       //根据分数显示颜色提示
@@ -1503,7 +889,6 @@
       /** 修改按钮操作 */
       handleUpdate(row) {
         this.reset();
-        // this.rules = this.commonRules
         const id = row.id || this.ids
         getMoc(id).then(response => {
           this.form = response.data;
@@ -1746,6 +1131,25 @@
   };
 </script>
 <style>
+  .colorMark {
+    color: #6f6f6f;
+    text-align: right;
+    font-weight:bold;
+    font-size: 13px;
+    padding-bottom: 5px;
+  }
+  .rectangleLightgreen {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleFlesh {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleYellow {
+    width: 40px !important;
+    height: 20px !important;
+  }
   #moc-type:hover{
     cursor: pointer;
   }

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

@@ -1,24 +1,6 @@
 <template>
   <div class="app-container-list">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item :label="$t('MOC编号')" label-width="50" prop="mocNo">
-        <el-input
-          v-model="queryParams.mocNo"
-          :placeholder="$t('请输入') + $t('MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item :label="$t('公司MOC编号')" label-width="50" prop="companyMocNo">
-        <el-input
-          v-model="queryParams.companyMocNo"
-          :placeholder="$t('请输入') + $t('公司MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
       <el-form-item :label="$t('项目号')" label-width="50" prop="projectNo">
         <el-input
           v-model="queryParams.projectNo"
@@ -28,16 +10,6 @@
           @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"
-          ></el-option>
-        </el-select>
-      </el-form-item>
       <el-form-item :label="$t('标题')" prop="title">
         <el-input
           v-model="queryParams.title"
@@ -47,16 +19,6 @@
           @keyup.enter.native="handleQuery"
         />
       </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"
-          ></el-option>
-        </el-select>
-      </el-form-item>
       <el-form-item :label="$t('负责人')" prop="owner">
         <el-input
           v-model="queryParams.owner"
@@ -66,108 +28,6 @@
           @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"
-          :placeholder="$t('请输入') + $t('备注')"
-          clearable
-          size="small"
-          @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"
-          ></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"
-          ></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"
-          ></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>
         <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>
@@ -233,9 +93,15 @@
 	  <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
+        v-loading="loading" :data="mocList"
+        @selection-change="handleSelectionChange"
+        :cell-style="tableCellStyle"
+        :cell-class-name="tableCellClassName"
+        :height="clientHeight" border
+        :default-sort = "{prop: 'mocNo', order: 'descending'}">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column align="center" width="120" prop="mocNo" :show-overflow-tooltip="true" >
+      <el-table-column align="center" width="120" prop="mocNo" :show-overflow-tooltip="true" sortable>
         <template slot="header">
           <span
             @click="mocNoChart.open = true"
@@ -354,16 +220,6 @@
     <!-- 添加或修改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">
-        <!--<el-form-item :label="$t('装置名称')" prop="plantCode">-->
-          <!--<el-select v-model="form.plantCode" :placeholder="$t('请选择') + $t('装置名称')">-->
-            <!--<el-option-->
-              <!--v-for="dict in plantCodeOptions"-->
-              <!--:key="dict.dictValue"-->
-              <!--:label="dict.dictLabel"-->
-              <!--:value="dict.dictValue"-->
-            <!--&gt;</el-option>-->
-          <!--</el-select>-->
-        <!--</el-form-item>-->
         <el-form-item :label="$t('MOC编号')" prop="mocNo">
           <el-input v-model="form.mocNo" :placeholder="$t('请输入') + $t('MOC编号')" />
         </el-form-item>
@@ -395,6 +251,9 @@
               :value="dict.dictValue"
             ></el-option>
           </el-select>
+          <span id="question" @click="mocTypeInfo.open = true" style="margin-left: 10px;">
+            <i class="el-icon-question"></i>
+          </span>
         </el-form-item>
         <el-form-item :label="$t('负责人')" prop="owner">
           <el-input v-model="form.owner" :placeholder="$t('请输入') + $t('负责人')" />
@@ -425,52 +284,6 @@
             ></el-option>
           </el-select>
         </el-form-item>
-        <!--<el-form-item :label="$t('完成时间')" prop="endtime">-->
-          <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                          <!--v-model="form.endtime"-->
-                          <!--type="date"-->
-                          <!--value-format="yyyy-MM-dd"-->
-                          <!--:placeholder="$t('请选择') + $t('完成时间')">-->
-          <!--</el-date-picker>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('实施情况')" prop="trueState">-->
-          <!--<el-select v-model="form.trueState" :placeholder="$t('请选择') + $t('实施情况')" @change="changeTrueState($event)">-->
-            <!--<el-option-->
-              <!--v-for="dict in trueStateOptions"-->
-              <!--:key="dict.dictValue"-->
-              <!--:label="dict.dictLabel"-->
-              <!--:value="dict.dictValue"-->
-            <!--&gt;</el-option>-->
-          <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('变更性质')" prop="changeNature">-->
-          <!--<el-select v-model="form.changeNature" :placeholder="$t('请选择') + $t('变更性质')" @change="changeChangeNature($event)">-->
-            <!--<el-option-->
-              <!--v-for="dict in changeNatureOptions"-->
-              <!--:key="dict.dictValue"-->
-              <!--:label="dict.dictLabel"-->
-              <!--:value="dict.dictValue"-->
-            <!--&gt;</el-option>-->
-          <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('到期时间')" prop="overTime">-->
-          <!--<el-date-picker clearable size="small" style="width: 200px"-->
-                          <!--v-model="form.overTime"-->
-                          <!--type="date"-->
-                          <!--value-format="yyyy-MM-dd"-->
-                          <!--:placeholder="$t('请选择') + $t('到期时间')">-->
-          <!--</el-date-picker>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('临时MOC状态')" prop="temporaryState">-->
-          <!--<el-select v-model="form.temporaryState" :placeholder="$t('请选择') + $t('临时MOC状态')">-->
-            <!--<el-option-->
-              <!--v-for="dict in temporaryStateOptions"-->
-              <!--:key="dict.dictValue"-->
-              <!--:label="dict.dictLabel"-->
-              <!--:value="dict.dictValue"-->
-            <!--&gt;</el-option>-->
-          <!--</el-select>-->
-        <!--</el-form-item>-->
         <el-form-item :label="$t('备注')" prop="remarks">
           <el-input v-model="form.remarks" type="textarea" :placeholder="$t('请输入') + $t('备注')" />
         </el-form-item>
@@ -543,57 +356,6 @@
         <el-form-item :label="$t('PSSR编号')" prop="pssrNo">
           <el-input v-model="form.pssrNo" :placeholder="$t('请输入') + $t('PSSR编号')" />
         </el-form-item>
-        <!--<el-form-item :label="$t('装置编号')" prop="plantNumber">
-          <el-input v-model="form.plantNumber" :placeholder="$t('请输入') + $t('装置编号')" />
-        </el-form-item>
-        <el-form-item :label="$t('通知单')" prop="noticeLetter">
-          <el-input v-model="form.noticeLetter" :placeholder="$t('请输入') + $t('通知单')" />
-        </el-form-item>
-        <el-form-item :label="$t('工作单')" prop="workLetter">
-          <el-input v-model="form.workLetter" :placeholder="$t('请输入') + $t('工作单')" />
-        </el-form-item>
-        <el-form-item :label="$t('CTE工作号')" prop="cteNo">
-          <el-input v-model="form.cteNo" :placeholder="$t('请输入') + $t('CTE工作号')" />
-        </el-form-item>
-        <el-form-item :label="$t('投资费用(RMB)')" prop="investCost">
-          <el-input v-model="form.investCost" :placeholder="$t('请输入') + $t('投资费用(RMB)')" />
-        </el-form-item>
-        <el-form-item :label="$t('类别')" prop="category">
-          <el-select v-model="form.category" :placeholder="$t('请选择') + $t('类别')">
-            <el-option
-              v-for="dict in categoryOptions"
-              :key="dict.dictValue"
-              :label="dict.dictLabel"
-              :value="dict.dictValue"
-            ></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item :label="$t('重要性')" prop="significance">
-          <el-input v-model="form.significance" :placeholder="$t('请输入') + $t('重要性')" />
-        </el-form-item>
-        <el-form-item :label="$t('分类')" prop="classification">
-          <el-input v-model="form.classification" :placeholder="$t('请输入') + $t('分类')" />
-        </el-form-item>
-        <el-form-item :label="$t('仪表控制')" prop="dashControl">
-          <el-input v-model="form.dashControl" :placeholder="$t('请输入') + $t('仪表控制')" />
-        </el-form-item>
-        <el-form-item :label="$t('预计完成时间')" prop="estimateEndtime">
-          <el-date-picker clearable size="small" style="width: 200px"
-                          v-model="form.estimateEndtime"
-                          type="date"
-                          value-format="yyyy-MM-dd"
-                          :placeholder="$t('请选择') + $t('预计完成时间')">
-          </el-date-picker>
-        </el-form-item>
-        <el-form-item :label="$t('EHS审查数据库')" prop="ehsDb">
-          <el-input v-model="form.ehsDb" :placeholder="$t('请输入') + $t('EHS审查数据库')" />
-        </el-form-item>
-        <el-form-item :label="$t('PSSR数据库')" prop="pssrDb">
-          <el-input v-model="form.pssrDb" :placeholder="$t('请输入') + $t('PSSR数据库')" />
-        </el-form-item>
-        <el-form-item :label="$t('CAPEX计划')" prop="capex">
-          <el-input v-model="form.capex" :placeholder="$t('请输入') + $t('CAPEX计划')" />
-        </el-form-item>-->
         <el-form-item :label="$t('归属部门')" prop="deptId">
           <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" :placeholder="$t('请选择') + $t('归属部门')" />
         </el-form-item>
@@ -603,6 +365,7 @@
         <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-upload
@@ -636,6 +399,7 @@
               <el-button @click="upload.open = false">{{ $t('取 消') }}</el-button>
           </div>
       </el-dialog>
+
     <!-- 报告附件对话框 -->
     <el-dialog v-dialogDrag :title="doc.title" :visible.sync="doc.open" width="1000px" append-to-body >
       <el-upload v-hasPermi="['training:trainingrecords:file']"
@@ -705,6 +469,7 @@
         <el-button @click="doc.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="1"></risk-level-chart>
@@ -712,6 +477,7 @@
         <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>
@@ -719,6 +485,7 @@
         <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>
@@ -726,6 +493,7 @@
         <el-button type="primary" @click="areaChart.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
+
     <!-- 区域统计对话框 -->
     <el-dialog v-dialogDrag :title="areaChart.title" :visible.sync="areaChart.open" width="500px" append-to-body>
       <area-chart :timeliness="1"></area-chart>
@@ -733,6 +501,7 @@
         <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>
@@ -740,6 +509,7 @@
         <el-button type="primary" @click="mocNoChart.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
@@ -750,90 +520,6 @@
         <el-button type="primary" @click="mocTypeInfo.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
-
-    <el-drawer
-      :title="$t('数据分析')"
-      size="600px"
-      :visible.sync="drawer"
-      :direction="direction">
-<!--      <el-row style="padding-left: 20px;">-->
-<!--      <el-form :model="chartParams" :inline="true"  label-width="68px">-->
-<!--        <el-form-item :label="$t('年份')" label-width="50" prop="year">-->
-<!--          <el-select v-model="chartParams.year" placeholder="请选择年份" clearable size="small">-->
-<!--            <el-option-->
-<!--              v-for="item in yearOption"-->
-<!--              :key="item"-->
-<!--              :label="item"-->
-<!--              :value="item"-->
-<!--            />-->
-<!--          </el-select>-->
-<!--        </el-form-item>-->
-<!--        <el-form-item>-->
-<!--          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('搜索') }}</el-button>-->
-<!--        </el-form-item>-->
-<!--      </el-form>-->
-<!--      </el-row>-->
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('实施情况统计') }}</span>
-            </div>
-            <div class="text item">
-              <true-state-data> </true-state-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('申请统计') }}</span>
-            </div>
-            <div class="text item">
-              <year-chart> </year-chart>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('变更性质') +$t('空格')+ $t('统计') }}</span>
-            </div>
-            <div class="text item">
-              <change-data> </change-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('类别') +$t('空格')+ $t('统计') }}</span>
-            </div>
-            <div class="text item">
-              <category-data> </category-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('风险等级统计') }}</span>
-            </div>
-            <div class="text item">
-              <risk-data></risk-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </el-drawer>
   </div>
 </template>
 
@@ -859,10 +545,10 @@ export default {
   name: "PermanentMoc",
   components: { riskLevelChart, mcDetailChart, mocTypeChart, areaChart, mocNoChart, RiskData, CategoryData, ChangeData, TrueStateData, YearChart, Treeselect },
   data() {
-    var validateDocUpdate = (rule, value, callback) => {
+    var validateMcDetailUpdate = (rule, value, callback) => {
       if (value == 1) {
-        if (this.form.pidMaster == 0 && this.form.sopUpdate == 0) {
-          return callback(new Error('PID/SOP未更新'));
+        if (this.form.docUpdate != 1) {
+          return callback(new Error('文档未更新'));
         } else {
           return callback();
         }
@@ -1056,11 +742,10 @@ export default {
       // 表单校验
       rules: {
         mocNo: [
-            { required: true, message: this.$t('MOC编号') + this.$t('不能为空'), trigger: "change" }
+          { required: true, message: this.$t('MOC编号') + this.$t('不能为空'), trigger: "change" }
         ],
-        docUpdate: [
-          // { required: true, message: this.$t('文档更新') + this.$t('不能为空'), trigger: "change" },
-          { validator: validateDocUpdate, trigger: 'change' }
+        mcDetail: [
+          { validator: validateMcDetailUpdate, trigger: 'change' }
         ],
         deptId: [
           { required: true, message: this.$t('归属部门') + this.$t('不能为空'), trigger: "change" }
@@ -1115,6 +800,12 @@ export default {
     });
   },
   methods: {
+    // 单元格样式
+    tableCellStyle( {row, column, rowIndex, columnIndex} ) {
+      if (row.mcDetail == 1) { // MC情况为Done的数据
+        return "background-color: rgba(146, 208, 80, 1);";
+      }
+    },
     /** 查询MOC管理列表 */
     getList() {
       this.loading = true;
@@ -1129,16 +820,6 @@ export default {
         this.total = response.total;
         this.loading = false;
       });
-    },
-    //根据分数显示颜色提示
-    tableCellStyle({ row, column, rowIndex, columnIndex }) {
-      if (columnIndex == 3 && row.trueState == 10){
-        return "color: rgba(45, 58, 79, 0.98) "
-      }else if (columnIndex == 3 && row.trueState == 12){
-        return "color: rgba(255, 26, 26, 0.98) "
-      }else if (columnIndex == 3 && row.trueState == 14){
-        return "color: rgba(95, 153, 248, 0.98) "
-      }
     },
      /** 查询部门下拉树结构 */
      getTreeselect() {
@@ -1321,7 +1002,6 @@ export default {
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset();
-      // this.rules = this.commonRules
       const id = row.id || this.ids
       getMoc(id).then(response => {
         this.form = response.data;
@@ -1550,6 +1230,25 @@ export default {
 </script>
 
 <style>
+  .colorMark {
+    color: #6f6f6f;
+    text-align: right;
+    font-weight:bold;
+    font-size: 13px;
+    padding-bottom: 5px;
+  }
+  .rectangleLightgreen {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleFlesh {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleYellow {
+    width: 40px !important;
+    height: 20px !important;
+  }
   #riskLevel:hover{
     cursor: pointer;
   }
@@ -1591,4 +1290,7 @@ export default {
   .el-drawer__container ::-webkit-scrollbar {
     display: none;
   }
+  #question:hover{
+    cursor: pointer;
+  }
 </style>

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

@@ -1,24 +1,6 @@
 <template>
   <div class="app-container-list">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item :label="$t('MOC编号')" label-width="50" prop="mocNo">
-        <el-input
-          v-model="queryParams.mocNo"
-          :placeholder="$t('请输入') + $t('MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item :label="$t('公司MOC编号')" label-width="50" prop="companyMocNo">
-        <el-input
-          v-model="queryParams.companyMocNo"
-          :placeholder="$t('请输入') + $t('公司MOC编号')"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
       <el-form-item :label="$t('项目号')" label-width="50" prop="projectNo">
         <el-input
           v-model="queryParams.projectNo"
@@ -28,16 +10,6 @@
           @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"
-          ></el-option>
-        </el-select>
-      </el-form-item>
       <el-form-item :label="$t('标题')" prop="title">
         <el-input
           v-model="queryParams.title"
@@ -47,16 +19,6 @@
           @keyup.enter.native="handleQuery"
         />
       </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"
-          ></el-option>
-        </el-select>
-      </el-form-item>
       <el-form-item :label="$t('负责人')" prop="owner">
         <el-input
           v-model="queryParams.owner"
@@ -66,155 +28,6 @@
           @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="mcTime">
-        <el-date-picker clearable size="small" style="width: 200px"
-                        v-model="queryParams.expTime"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        :placeholder="$t('请选择') + $t('到期时间')">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item :label="$t('临时MOC状态')" prop="mocType">
-        <el-select v-model="queryParams.tempState" :placeholder="$t('请选择') + $t('临时MOC状态')">
-          <el-option
-            v-for="dict in tempStateOptions"
-            :key="dict.dictValue"
-            :label="dict.dictLabel"
-            :value="dict.dictValue"
-          ></el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item :label="$t('备注')" prop="remarks">
-        <el-input
-          v-model="queryParams.remarks"
-          :placeholder="$t('请输入') + $t('备注')"
-          clearable
-          size="small"
-          @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>
@@ -280,15 +93,22 @@
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
+    <el-row class="colorMark">
+      <svg-icon icon-class="rectangleLightgreen" class="rectangleLightgreen" style="fill:#000000;"></svg-icon>{{ $t('已移除') }}
+      <svg-icon icon-class="rectangleFlesh" class="rectangleFlesh"></svg-icon>{{ $t('7天内到期') }}
+      <svg-icon icon-class="rectangleYellow" class="rectangleYellow"></svg-icon>{{ $t('7-14天内到期') }}
+    </el-row>
+
     <el-table v-loading="loading"
               :data="mocList"
               @selection-change="handleSelectionChange"
               :cell-style="tableCellStyle"
               :cell-class-name="tableCellClassName"
               :height="clientHeight"
-              border>
+              border
+              :default-sort = "{prop: 'mocNo', order: 'descending'}">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column align="center" width="120" prop="mocNo" :show-overflow-tooltip="true" >
+      <el-table-column align="center" width="120" prop="mocNo" :show-overflow-tooltip="true" sortable>
         <template slot="header">
           <span
             @click="mocNoChart.open = true"
@@ -298,7 +118,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">
@@ -333,20 +152,6 @@
           <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" :formatter="mcDetailFormat">
         <template slot="header">
@@ -369,6 +174,7 @@
           </span>
         </template>
       </el-table-column>
+      <el-table-column :label="$t('移除时间')" align="center" prop="removeTime" :show-overflow-tooltip="true" width="100"/>
       <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">
         <template slot="header">
@@ -392,9 +198,6 @@
           <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>
@@ -402,22 +205,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="180" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -426,7 +213,7 @@
             icon="el-icon-circle-close"
             @click="handleRemove(scope.row)"
             v-hasPermi="['process:moc:edit']"
-            v-if="scope.row.tempState == 1"
+            v-if="scope.row.tempState == 1 || scope.row.status == 1"
           >{{ $t('移除') }}</el-button>
           <el-button
             size="mini"
@@ -498,6 +285,9 @@
               :value="dict.dictValue"
             ></el-option>
           </el-select>
+          <span id="question" @click="mocTypeInfo.open = true" style="margin-left: 10px;">
+            <i class="el-icon-question"></i>
+          </span>
         </el-form-item>
         <el-form-item :label="$t('负责人')" prop="owner">
           <el-input v-model="form.owner" :placeholder="$t('请输入') + $t('负责人')" />
@@ -546,52 +336,6 @@
             ></el-option>
           </el-select>
         </el-form-item>
-        <!--<el-form-item :label="$t('完成时间')" prop="endtime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-        <!--v-model="form.endtime"-->
-        <!--type="date"-->
-        <!--value-format="yyyy-MM-dd"-->
-        <!--:placeholder="$t('请选择') + $t('完成时间')">-->
-        <!--</el-date-picker>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('实施情况')" prop="trueState">-->
-        <!--<el-select v-model="form.trueState" :placeholder="$t('请选择') + $t('实施情况')" @change="changeTrueState($event)">-->
-        <!--<el-option-->
-        <!--v-for="dict in trueStateOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('变更性质')" prop="changeNature">-->
-        <!--<el-select v-model="form.changeNature" :placeholder="$t('请选择') + $t('变更性质')" @change="changeChangeNature($event)">-->
-        <!--<el-option-->
-        <!--v-for="dict in changeNatureOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('到期时间')" prop="overTime">-->
-        <!--<el-date-picker clearable size="small" style="width: 200px"-->
-        <!--v-model="form.overTime"-->
-        <!--type="date"-->
-        <!--value-format="yyyy-MM-dd"-->
-        <!--:placeholder="$t('请选择') + $t('到期时间')">-->
-        <!--</el-date-picker>-->
-        <!--</el-form-item>-->
-        <!--<el-form-item :label="$t('临时MOC状态')" prop="temporaryState">-->
-        <!--<el-select v-model="form.temporaryState" :placeholder="$t('请选择') + $t('临时MOC状态')">-->
-        <!--<el-option-->
-        <!--v-for="dict in temporaryStateOptions"-->
-        <!--:key="dict.dictValue"-->
-        <!--:label="dict.dictLabel"-->
-        <!--:value="dict.dictValue"-->
-        <!--&gt;</el-option>-->
-        <!--</el-select>-->
-        <!--</el-form-item>-->
         <el-form-item :label="$t('备注')" prop="remarks">
           <el-input v-model="form.remarks" type="textarea" :placeholder="$t('请输入') + $t('备注')" />
         </el-form-item>
@@ -724,6 +468,7 @@
         <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-upload
@@ -757,6 +502,7 @@
         <el-button @click="upload.open = false">{{ $t('取 消') }}</el-button>
       </div>
     </el-dialog>
+
     <!-- 报告附件对话框 -->
     <el-dialog v-dialogDrag :title="doc.title" :visible.sync="doc.open" width="1000px" append-to-body >
       <el-upload v-hasPermi="['training:trainingrecords:file']"
@@ -826,6 +572,7 @@
         <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>
@@ -833,6 +580,7 @@
         <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
@@ -843,6 +591,7 @@
         <el-button type="primary" @click="mocTypeInfo.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
+
     <!-- 区域统计对话框 -->
     <el-dialog v-dialogDrag :title="areaChart.title" :visible.sync="areaChart.open" width="500px" append-to-body>
       <area-chart :timeliness="2"></area-chart>
@@ -850,6 +599,7 @@
         <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>
@@ -857,6 +607,7 @@
         <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>
@@ -864,6 +615,7 @@
         <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>
@@ -871,6 +623,7 @@
         <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>
@@ -878,89 +631,6 @@
         <el-button type="primary" @click="mocNoChart.open = false">{{ $t('确 定') }}</el-button>
       </div>
     </el-dialog>
-    <el-drawer
-      :title="$t('数据分析')"
-      size="600px"
-      :visible.sync="drawer"
-      :direction="direction">
-      <!--      <el-row style="padding-left: 20px;">-->
-      <!--      <el-form :model="chartParams" :inline="true"  label-width="68px">-->
-      <!--        <el-form-item :label="$t('年份')" label-width="50" prop="year">-->
-      <!--          <el-select v-model="chartParams.year" placeholder="请选择年份" clearable size="small">-->
-      <!--            <el-option-->
-      <!--              v-for="item in yearOption"-->
-      <!--              :key="item"-->
-      <!--              :label="item"-->
-      <!--              :value="item"-->
-      <!--            />-->
-      <!--          </el-select>-->
-      <!--        </el-form-item>-->
-      <!--        <el-form-item>-->
-      <!--          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('搜索') }}</el-button>-->
-      <!--        </el-form-item>-->
-      <!--      </el-form>-->
-      <!--      </el-row>-->
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('实施情况统计') }}</span>
-            </div>
-            <div class="text item">
-              <true-state-data> </true-state-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('申请统计') }}</span>
-            </div>
-            <div class="text item">
-              <year-chart> </year-chart>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('变更性质') +$t('空格')+ $t('统计') }}</span>
-            </div>
-            <div class="text item">
-              <change-data> </change-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('类别') +$t('空格')+ $t('统计') }}</span>
-            </div>
-            <div class="text item">
-              <category-data> </category-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col>
-          <el-card class="box-card" shadow="hover">
-            <div slot="header" class="clearfix">
-              <span>{{ $t('风险等级统计') }}</span>
-            </div>
-            <div class="text item">
-              <risk-data></risk-data>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </el-drawer>
   </div>
 </template>
 
@@ -1188,131 +858,14 @@
           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: {
@@ -1384,28 +937,20 @@
       tableCellStyle( {row, column, rowIndex, columnIndex} ) {
         let today = new Date(); // 当前时间
         let expTime = new Date(row.expTime);
-        let difference = expTime.getTime() - today.getTime(); // 时间差
-        if (row.tempState == 0) { // 移除的数据
-          return "background-color: rgba(0, 255, 0, 0.2);";
-        } else if (row.expTime != null && row.expTime != '') {
-          if (difference <= 7 * 24 * 60 * 60 * 1000) {  // 到期时间 - 当前时间 <= 7
-            return "background-color: rgba(255, 0, 0, 0.2);";
-          } else if (difference >= 7 * 24 * 60 * 60 * 1000
-            && difference <= 14 * 24 * 60 * 60 * 1000) {  // 7 <= 到期时间 - 当前时间 <= 14
-            return "background-color: rgba(255, 255, 0, 0.2);";
+        if (today.getTime() > expTime.getTime()) {
+          let difference = today.getTime() - expTime.getTime(); // 时间差
+          if (row.status == 0 || row.tempState == 0) { // 移除的数据
+            return "background-color: rgba(146, 208, 80, 1);";
+          } else if (row.expTime != null && row.expTime != '') {
+            if (difference <= 7 * 24 * 60 * 60 * 1000) {  // 到期时间 - 当前时间 <= 7
+              return "background-color: rgba(250, 191, 143, 1);";
+            } else if (difference >= 7 * 24 * 60 * 60 * 1000
+              && difference <= 14 * 24 * 60 * 60 * 1000) {  // 7 <= 到期时间 - 当前时间 <= 14
+              return "background-color: rgba(255, 255, 0, 1);";
+            }
           }
         }
       },
-      //根据分数显示颜色提示
-      // tableCellStyle({ row, column, rowIndex, columnIndex }) {
-      //   if (columnIndex == 3 && row.trueState == 10){
-      //     return "color: rgba(45, 58, 79, 0.98) "
-      //   }else if (columnIndex == 3 && row.trueState == 12){
-      //     return "color: rgba(255, 26, 26, 0.98) "
-      //   }else if (columnIndex == 3 && row.trueState == 14){
-      //     return "color: rgba(95, 153, 248, 0.98) "
-      //   }
-      // },
       /** 查询部门下拉树结构 */
       getTreeselect() {
         treeselect().then(response => {
@@ -1559,20 +1104,16 @@
       //实施情况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
         }
       },
       //根据分数显示颜色提示
@@ -1595,7 +1136,6 @@
       /** 修改按钮操作 */
       handleUpdate(row) {
         this.reset();
-        // this.rules = this.commonRules
         const id = row.id || this.ids
         getMoc(id).then(response => {
           this.form = response.data;
@@ -1610,7 +1150,11 @@
           cancelButtonText: this.$t('取消'),
           type: "warning"
         }).then(function() {
-          updateMoc({id: row.id, tempState: 0});
+          if (row.timeliness == 2 && row.tempCategory == 1) {
+            updateMoc({id: row.id, status: 0});
+          } else {
+            updateMoc({id: row.id, tempState: 0});
+          }
         }).then(() => {
           this.getList();
           this.msgSuccess(this.$t('移除成功'));
@@ -1836,6 +1380,28 @@
   };
 </script>
 <style>
+  .colorMark {
+    color: #6f6f6f;
+    text-align: right;
+    font-weight:bold;
+    font-size: 13px;
+    padding-bottom: 5px;
+  }
+  .rectangleLightgreen {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleFlesh {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  .rectangleYellow {
+    width: 40px !important;
+    height: 20px !important;
+  }
+  #question:hover{
+    cursor: pointer;
+  }
   #moc-type:hover{
     cursor: pointer;
   }
@@ -1856,7 +1422,6 @@
   .clearfix:after {
     clear: both
   }
-
   .box-card {
     width: 100%;
   }