-破锁管理看板页面

-申请单关联破锁管理

master/src/main/java/com/ruoyi/project/apply/controller/TApplyLockController.java

@@ -5,11 +5,16 @@ import com.ruoyi.common.utils.file.ExcelUtils;
 import com.ruoyi.common.utils.poi.ExcelUtil;
 import com.ruoyi.framework.aspectj.lang.annotation.Log;
 import com.ruoyi.framework.aspectj.lang.enums.BusinessType;
+import com.ruoyi.framework.interceptor.annotation.RepeatSubmit;
 import com.ruoyi.framework.web.controller.BaseController;
 import com.ruoyi.framework.web.domain.AjaxResult;
 import com.ruoyi.framework.web.page.TableDataInfo;
 import com.ruoyi.project.apply.domain.TApplyLock;
+import com.ruoyi.project.apply.domain.TApplyOfflinevalve;
+import com.ruoyi.project.apply.domain.TApplySafetychange;
 import com.ruoyi.project.apply.service.ITApplyLockService;
+import com.ruoyi.project.apply.service.ITApplyOfflinevalveService;
+import com.ruoyi.project.apply.service.ITApplySafetychangeService;
 import com.ruoyi.project.system.domain.SysDept;
 import com.ruoyi.project.system.service.ISysDeptService;
 import org.apache.poi.ss.usermodel.Cell;
@@ -39,6 +44,30 @@ public class TApplyLockController extends BaseController {
     @Autowired
     private ISysDeptService iSysDeptService;
 
+
+    @Autowired
+    private ITApplyOfflinevalveService tApplyOfflinevalveService;
+
+    @Autowired
+    private ITApplySafetychangeService tApplySafetychangeService;
+
+    @GetMapping(value = "/getInfoByLock/{lockNo}")
+    public AjaxResult getInfoByLock(@PathVariable("lockNo") String lockNo) {
+        TApplyOfflinevalve lock = tApplyOfflinevalveService.selectTApplyOfflinevalveByLock(lockNo);
+        TApplySafetychange lock1 = tApplySafetychangeService.selectTApplySafetychangeByLock(lockNo);
+        Map<String, Object> map = new HashMap<>();
+        if (lock != null) {
+            map.put("type", 1);
+            map.put("data", lock);
+        } else if (lock1 != null) {
+            map.put("type", 2);
+            map.put("data", lock1);
+        } else {
+            map.put("type", 3);
+        }
+       return AjaxResult.success(map);
+    }
+
     /**
      * 查询破锁管理列表
      */
@@ -51,8 +80,8 @@ public class TApplyLockController extends BaseController {
     }
 
     @PreAuthorize("@ss.hasPermi('apply:lock:list')")
-    @GetMapping("/listAllLock")
-    public AjaxResult listAllLock(TApplyLock tApplyLock) {
+    @GetMapping("/listLockBranch")
+    public AjaxResult listLockBranch(TApplyLock tApplyLock) {
         List<TApplyLock> list = tApplyLockService.selectTApplyLockList(tApplyLock);
         List<List<TApplyLock>> result = new ArrayList<>();
         List<TApplyLock> item = new ArrayList<>();
@@ -72,6 +101,11 @@ public class TApplyLockController extends BaseController {
         return AjaxResult.success(result);
     }
 
+    @GetMapping("/listAllLock")
+    public AjaxResult listAllLock(TApplyLock tApplyLock) {
+        return AjaxResult.success(tApplyLockService.selectTApplyLockList(tApplyLock));
+    }
+
     /**
      * 导出破锁管理列表
      */
@@ -98,6 +132,7 @@ public class TApplyLockController extends BaseController {
      */
     @PreAuthorize("@ss.hasPermi('apply:lock:add')")
     @Log(title = "破锁管理", businessType = BusinessType.INSERT)
+    @RepeatSubmit
     @PostMapping
     public AjaxResult add(@RequestBody TApplyLock tApplyLock) {
         tApplyLock.setCreaterCode(getUserId().toString());
@@ -110,6 +145,7 @@ public class TApplyLockController extends BaseController {
      */
     @PreAuthorize("@ss.hasPermi('apply:lock:edit')")
     @Log(title = "破锁管理", businessType = BusinessType.UPDATE)
+    @RepeatSubmit
     @PutMapping
     public AjaxResult edit(@RequestBody TApplyLock tApplyLock) {
         return toAjax(tApplyLockService.updateTApplyLock(tApplyLock));
@@ -152,27 +188,27 @@ public class TApplyLockController extends BaseController {
                     String cellValue = ExcelUtils.getCellValue(cell);
                     logger.info("cellValue:" + cellValue);
                     if (j == 0) {
-                        entity.setUnit(cellValue);
+                        entity.setUnit(cellValue.trim());
                     } else if (j == 1) {
-                        entity.setLockPost(cellValue);
+                        entity.setLockPost(cellValue.trim());
                     } else if (j == 2) {
-                        entity.setPidNo(cellValue);
+                        entity.setPidNo(cellValue.trim());
                     } else if (j == 3) {
-                        entity.setLockCode(cellValue);
+                        entity.setLockCode(cellValue.trim());
                     } else if (j == 4) {
-                        entity.setMedium(cellValue);
+                        entity.setMedium(cellValue.trim());
                     } else if (j == 5) {
-                        entity.setPosition(cellValue);
+                        entity.setPosition(cellValue.trim());
                     } else if (j == 6) {
-                        entity.setReason(cellValue);
+                        entity.setReason(cellValue.trim());
                     } else if (j == 7) {
-                        entity.setTechnology(cellValue);
+                        entity.setTechnology(cellValue.trim());
                     } else if (j == 8) {
-                        entity.setRiskLevel(cellValue);
+                        entity.setRiskLevel(cellValue.trim());
                     } else if (j == 9) {
-                        entity.setLockSize(cellValue);
+                        entity.setLockSize(cellValue.trim());
                     } else if (j == 10) {
-                        entity.setValveStatus(cellValue);
+                        entity.setValveStatus(cellValue.trim());
                     } else if (j == 11) {
                         for (SysDept d : dept) {
                             if (d.getDeptName().equals(cellValue.trim())) {

master/src/main/java/com/ruoyi/project/apply/controller/TApplyOfflinevalveController.java

@@ -16,7 +16,9 @@ import com.ruoyi.framework.interceptor.annotation.RepeatSubmit;
 import com.ruoyi.framework.web.controller.BaseController;
 import com.ruoyi.framework.web.domain.AjaxResult;
 import com.ruoyi.framework.web.page.TableDataInfo;
+import com.ruoyi.project.apply.domain.TApplyLock;
 import com.ruoyi.project.apply.domain.TApplyOfflinevalve;
+import com.ruoyi.project.apply.service.ITApplyLockService;
 import com.ruoyi.project.apply.service.ITApplyOfflinevalveService;
 import com.ruoyi.project.approve.damain.DevTask;
 import com.ruoyi.project.listener.apply.valve.EndFailListener;
@@ -67,6 +69,9 @@ public class TApplyOfflinevalveController extends BaseController {
     @Autowired
     private TaskService taskService;
 
+    @Autowired
+    private ITApplyLockService tApplyLockService;
+
     /**
      * 查询安全阀离线切出申请列表
      */
@@ -108,6 +113,10 @@ public class TApplyOfflinevalveController extends BaseController {
     @PostMapping
     public AjaxResult add(@RequestBody TApplyOfflinevalve tApplyOfflinevalve) {
         Long userId = getUserId();
+        TApplyLock tApplyLock = tApplyLockService.selectTApplyLockByLockCode(tApplyOfflinevalve.getLockNo());
+        if (tApplyLock.getStatus()==1||tApplyLock.getStatus()==2){
+            return AjaxResult.error("该锁不可用。");
+        }
         // 新增申请数据
         tApplyOfflinevalve.setApplicant(userId.toString());
         tApplyOfflinevalve.setApplicantName(getNickName());
@@ -186,6 +195,7 @@ public class TApplyOfflinevalveController extends BaseController {
         String processInstancesId = task.getProcessInstanceId();
         // 旧数据
         TApplyOfflinevalve tApplyOfflinevalve = tApplyOfflinevalveService.selectTApplyOfflinevalveById(form.getId());
+        TApplyLock tApplyLock = tApplyLockService.selectTApplyLockByLockCode(tApplyOfflinevalve.getLockNo());
         String taskName = task.getName();//实例名
         // 添加备注
         String remarks = StringUtils.isEmpty(tApplyOfflinevalve.getRemarks()) ? "" : tApplyOfflinevalve.getRemarks();
@@ -243,8 +253,14 @@ public class TApplyOfflinevalveController extends BaseController {
                 form.setApprover(getUserId().toString());
                 form.setApproverName(getNickName());
                 form.setApproveTime(new Date());
-                if ("1".equals(devTask.getCondition()))//只有通过时审批状态才会变为已通过
+                if ("1".equals(devTask.getCondition())) {//只有通过时审批状态才会变为已通过
                     form.setApproveStatus("2");
+                    //修改锁状态
+                    if (tApplyLock != null) {
+                        tApplyLock.setStatus(1L);//将锁状态改为已拆锁
+                        tApplyLockService.updateTApplyLock(tApplyLock);
+                    }
+                }
                 break;
             case "信息确认人":
                 tStaffmgr = new TStaffmgr();
@@ -271,6 +287,11 @@ public class TApplyOfflinevalveController extends BaseController {
                 } else {
                     form.setLockConfirm("NA");//否则确认是否已上锁为NA
                 }
+                //修改锁状态
+                if (tApplyLock != null) {
+                    tApplyLock.setStatus(0L);//将锁状态改为挂锁
+                    tApplyLockService.updateTApplyLock(tApplyLock);
+                }
                 break;
             case "上锁人":
                 form.setLockConfirmer1(getUserId().toString());

master/src/main/java/com/ruoyi/project/apply/controller/TApplySafetychangeController.java

@@ -16,7 +16,9 @@ import com.ruoyi.framework.interceptor.annotation.RepeatSubmit;
 import com.ruoyi.framework.web.controller.BaseController;
 import com.ruoyi.framework.web.domain.AjaxResult;
 import com.ruoyi.framework.web.page.TableDataInfo;
+import com.ruoyi.project.apply.domain.TApplyLock;
 import com.ruoyi.project.apply.domain.TApplySafetychange;
+import com.ruoyi.project.apply.service.ITApplyLockService;
 import com.ruoyi.project.apply.service.ITApplySafetychangeService;
 import com.ruoyi.project.approve.damain.DevTask;
 import com.ruoyi.project.listener.apply.change.ChangeEndFailListener;
@@ -58,6 +60,9 @@ public class TApplySafetychangeController extends BaseController {
     @Autowired
     private ITApplySafetychangeService tApplySafetychangeService;
 
+    @Autowired
+    private ITApplyLockService tApplyLockService;
+
 
     @Autowired
     private RuntimeService runtimeService;
@@ -116,6 +121,10 @@ public class TApplySafetychangeController extends BaseController {
     @PostMapping
     public AjaxResult add(@RequestBody TApplySafetychange tApplySafetychange) {
         String userId = getUserId().toString();
+        TApplyLock tApplyLock = tApplyLockService.selectTApplyLockByLockCode(tApplySafetychange.getLockNo());
+        if (tApplyLock.getStatus()==1||tApplyLock.getStatus()==2){
+            return AjaxResult.error("该锁不可用。");
+        }
         tApplySafetychange.setApplicant(userId);
         tApplySafetychange.setApplicantName(getNickName());
         tApplySafetychange.setApplicationTime(new Date());
@@ -205,6 +214,7 @@ public class TApplySafetychangeController extends BaseController {
         //利用任务对象，获取流程实例id
         String processInstancesId = task.getProcessInstanceId();
         TApplySafetychange tApplySafetychange = tApplySafetychangeService.selectTApplySafetychangeById(form.getId());
+        TApplyLock tApplyLock = tApplyLockService.selectTApplyLockByLockCode(tApplySafetychange.getLockNo());
         String taskName = task.getName();//实例名
         // 添加备注
         String remarks = StringUtils.isEmpty(tApplySafetychange.getRemarks()) ? "" : tApplySafetychange.getRemarks();
@@ -257,6 +267,11 @@ public class TApplySafetychangeController extends BaseController {
                 form.setChangeExecutor(getUserId().toString());
                 form.setChangeExecutorName(getNickName());
                 form.setChangeExecutorTime(new Date());
+                //修改锁状态
+                if (tApplyLock != null) {
+                    tApplyLock.setStatus(1L);//将锁状态改为已拆锁
+                    tApplyLockService.updateTApplyLock(tApplyLock);
+                }
                 break;
             case "安全评估人2":
                 TStaffmgr tStaffmgr = new TStaffmgr();
@@ -280,6 +295,11 @@ public class TApplySafetychangeController extends BaseController {
                 form.setResetConfirmTime2(new Date());
                 form.setResetConfirmerName2(getNickName());
                 form.setStatus(1L);
+                //修改锁状态
+                if (tApplyLock != null) {
+                    tApplyLock.setStatus(0L);//将锁状态改为已拆锁
+                    tApplyLockService.updateTApplyLock(tApplyLock);
+                }
                 break;
         }
         param.put("condition", devTask.getCondition());

master/src/main/java/com/ruoyi/project/apply/domain/TApplyLock.java

@@ -83,6 +83,12 @@ public class TApplyLock extends BaseEntity {
     @Excel(name = "尺寸")
     private String lockSize;
 
+    /**
+     * 阀门状态
+     */
+    @Excel(name = "阀门状态")
+    private String valveStatus;
+
     /**
      * 备注
      */
@@ -92,7 +98,7 @@ public class TApplyLock extends BaseEntity {
     /**
      * 状态
      */
-    @Excel(name = "状态")
+    @Excel(name = "状态",readConverterExp = "1=已拆锁,2=已删除,0=挂锁")
     private Long status;
 
     /**
@@ -103,19 +109,11 @@ public class TApplyLock extends BaseEntity {
     /**
      * 创建人
      */
-    @Excel(name = "创建人")
     private String createrCode;
 
-    /**
-     * 阀门状态
-     */
-    @Excel(name = "阀门状态")
-    private String valveStatus;
-
     /**
      * 部门名称
      */
-    @Excel(name = "部门名称")
     @TableField(exist = false)
     private String deptName;
 
@@ -123,26 +121,22 @@ public class TApplyLock extends BaseEntity {
      * 创建时间
      */
     @JsonFormat(pattern = "yyyy-MM-dd", timezone = "GMT+8")
-    @Excel(name = "创建时间", width = 30, dateFormat = "yyyy-MM-dd")
     private Date createdate;
 
     /**
      * 修改人
      */
-    @Excel(name = "修改人")
     private Long updaterCode;
 
     /**
      * 修改时间
      */
     @JsonFormat(pattern = "yyyy-MM-dd", timezone = "GMT+8")
-    @Excel(name = "修改时间", width = 30, dateFormat = "yyyy-MM-dd")
     private Date updatedate;
 
     /**
      * 部门id
      */
-    @Excel(name = "部门id")
     private Long deptId;
 
     public String getDeptName() {

master/src/main/java/com/ruoyi/project/apply/mapper/TApplyLockMapper.java

@@ -1,28 +1,30 @@
 package com.ruoyi.project.apply.mapper;
 
-import java.util.List;
 import com.ruoyi.framework.aspectj.lang.annotation.DataScope;
 import com.ruoyi.project.apply.domain.TApplyLock;
 
+import java.util.List;
+
 /**
  * 破锁管理Mapper接口
- * 
+ *
  * @author ruoyi
  * @date 2023-03-06
  */
-public interface TApplyLockMapper 
+public interface TApplyLockMapper
 {
     /**
      * 查询破锁管理
-     * 
+     *
      * @param id 破锁管理ID
      * @return 破锁管理
      */
     public TApplyLock selectTApplyLockById(Long id);
+    public TApplyLock selectTApplyLockByLockCode(String lockCode);
 
     /**
      * 查询破锁管理列表
-     * 
+     *
      * @param tApplyLock 破锁管理
      * @return 破锁管理集合
      */
@@ -31,7 +33,7 @@ public interface TApplyLockMapper
 
     /**
      * 新增破锁管理
-     * 
+     *
      * @param tApplyLock 破锁管理
      * @return 结果
      */
@@ -39,7 +41,7 @@ public interface TApplyLockMapper
 
     /**
      * 修改破锁管理
-     * 
+     *
      * @param tApplyLock 破锁管理
      * @return 结果
      */
@@ -47,7 +49,7 @@ public interface TApplyLockMapper
 
     /**
      * 删除破锁管理
-     * 
+     *
      * @param id 破锁管理ID
      * @return 结果
      */
@@ -55,7 +57,7 @@ public interface TApplyLockMapper
 
     /**
      * 批量删除破锁管理
-     * 
+     *
      * @param ids 需要删除的数据ID
      * @return 结果
      */

master/src/main/java/com/ruoyi/project/apply/mapper/TApplyOfflinevalveMapper.java

@@ -1,20 +1,21 @@
 package com.ruoyi.project.apply.mapper;
 
-import java.util.List;
 import com.ruoyi.framework.aspectj.lang.annotation.DataScope;
 import com.ruoyi.project.apply.domain.TApplyOfflinevalve;
 
+import java.util.List;
+
 /**
  * 安全阀离线切出申请Mapper接口
- * 
+ *
  * @author ruoyi
  * @date 2023-02-08
  */
-public interface TApplyOfflinevalveMapper 
+public interface TApplyOfflinevalveMapper
 {
     /**
      * 查询安全阀离线切出申请
-     * 
+     *
      * @param id 安全阀离线切出申请ID
      * @return 安全阀离线切出申请
      */
@@ -22,7 +23,7 @@ public interface TApplyOfflinevalveMapper
 
     /**
      * 查询安全阀离线切出申请列表
-     * 
+     *
      * @param tApplyOfflinevalve 安全阀离线切出申请
      * @return 安全阀离线切出申请集合
      */
@@ -31,7 +32,7 @@ public interface TApplyOfflinevalveMapper
 
     /**
      * 新增安全阀离线切出申请
-     * 
+     *
      * @param tApplyOfflinevalve 安全阀离线切出申请
      * @return 结果
      */
@@ -39,7 +40,7 @@ public interface TApplyOfflinevalveMapper
 
     /**
      * 修改安全阀离线切出申请
-     * 
+     *
      * @param tApplyOfflinevalve 安全阀离线切出申请
      * @return 结果
      */
@@ -47,7 +48,7 @@ public interface TApplyOfflinevalveMapper
 
     /**
      * 删除安全阀离线切出申请
-     * 
+     *
      * @param id 安全阀离线切出申请ID
      * @return 结果
      */
@@ -55,9 +56,11 @@ public interface TApplyOfflinevalveMapper
 
     /**
      * 批量删除安全阀离线切出申请
-     * 
+     *
      * @param ids 需要删除的数据ID
      * @return 结果
      */
     public int deleteTApplyOfflinevalveByIds(Long[] ids);
+
+    public TApplyOfflinevalve selectTApplyOfflinevalveByLock(String lockNo);
 }

master/src/main/java/com/ruoyi/project/apply/mapper/TApplySafetychangeMapper.java

@@ -64,4 +64,6 @@ public interface TApplySafetychangeMapper
      * @return 结果
      */
     public int deleteTApplySafetychangeByIds(Long[] ids);
+
+    TApplySafetychange selectTApplySafetychangeByLock(String lockNo);
 }

master/src/main/java/com/ruoyi/project/apply/service/ITApplyLockService.java

@@ -1,19 +1,20 @@
 package com.ruoyi.project.apply.service;
 
-import java.util.List;
 import com.ruoyi.project.apply.domain.TApplyLock;
 
+import java.util.List;
+
 /**
  * 破锁管理Service接口
- * 
+ *
  * @author ruoyi
  * @date 2023-03-06
  */
-public interface ITApplyLockService 
+public interface ITApplyLockService
 {
     /**
      * 查询破锁管理
-     * 
+     *
      * @param id 破锁管理ID
      * @return 破锁管理
      */
@@ -21,7 +22,7 @@ public interface ITApplyLockService
 
     /**
      * 查询破锁管理列表
-     * 
+     *
      * @param tApplyLock 破锁管理
      * @return 破锁管理集合
      */
@@ -29,7 +30,7 @@ public interface ITApplyLockService
 
     /**
      * 新增破锁管理
-     * 
+     *
      * @param tApplyLock 破锁管理
      * @return 结果
      */
@@ -37,7 +38,7 @@ public interface ITApplyLockService
 
     /**
      * 修改破锁管理
-     * 
+     *
      * @param tApplyLock 破锁管理
      * @return 结果
      */
@@ -45,7 +46,7 @@ public interface ITApplyLockService
 
     /**
      * 批量删除破锁管理
-     * 
+     *
      * @param ids 需要删除的破锁管理ID
      * @return 结果
      */
@@ -53,9 +54,11 @@ public interface ITApplyLockService
 
     /**
      * 删除破锁管理信息
-     * 
+     *
      * @param id 破锁管理ID
      * @return 结果
      */
     public int deleteTApplyLockById(Long id);
+
+    public TApplyLock selectTApplyLockByLockCode(String lockCode);
 }

master/src/main/java/com/ruoyi/project/apply/service/ITApplyOfflinevalveService.java

@@ -1,19 +1,20 @@
 package com.ruoyi.project.apply.service;
 
-import java.util.List;
 import com.ruoyi.project.apply.domain.TApplyOfflinevalve;
 
+import java.util.List;
+
 /**
  * 安全阀离线切出申请Service接口
- * 
+ *
  * @author ruoyi
  * @date 2023-02-08
  */
-public interface ITApplyOfflinevalveService 
+public interface ITApplyOfflinevalveService
 {
     /**
      * 查询安全阀离线切出申请
-     * 
+     *
      * @param id 安全阀离线切出申请ID
      * @return 安全阀离线切出申请
      */
@@ -21,7 +22,7 @@ public interface ITApplyOfflinevalveService
 
     /**
      * 查询安全阀离线切出申请列表
-     * 
+     *
      * @param tApplyOfflinevalve 安全阀离线切出申请
      * @return 安全阀离线切出申请集合
      */
@@ -29,7 +30,7 @@ public interface ITApplyOfflinevalveService
 
     /**
      * 新增安全阀离线切出申请
-     * 
+     *
      * @param tApplyOfflinevalve 安全阀离线切出申请
      * @return 结果
      */
@@ -37,7 +38,7 @@ public interface ITApplyOfflinevalveService
 
     /**
      * 修改安全阀离线切出申请
-     * 
+     *
      * @param tApplyOfflinevalve 安全阀离线切出申请
      * @return 结果
      */
@@ -45,7 +46,7 @@ public interface ITApplyOfflinevalveService
 
     /**
      * 批量删除安全阀离线切出申请
-     * 
+     *
      * @param ids 需要删除的安全阀离线切出申请ID
      * @return 结果
      */
@@ -53,9 +54,11 @@ public interface ITApplyOfflinevalveService
 
     /**
      * 删除安全阀离线切出申请信息
-     * 
+     *
      * @param id 安全阀离线切出申请ID
      * @return 结果
      */
     public int deleteTApplyOfflinevalveById(Long id);
+
+    public TApplyOfflinevalve selectTApplyOfflinevalveByLock(String lockNo);
 }

master/src/main/java/com/ruoyi/project/apply/service/ITApplySafetychangeService.java

@@ -19,6 +19,7 @@ public interface ITApplySafetychangeService
      * @return 组织保护措施状态变更申请
      */
     public TApplySafetychange selectTApplySafetychangeById(Long id);
+    public TApplySafetychange selectTApplySafetychangeByLock(String lockNo);
 
     /**
      * 查询组织保护措施状态变更申请列表

master/src/main/java/com/ruoyi/project/apply/service/impl/TApplyLockServiceImpl.java

@@ -1,11 +1,12 @@
 package com.ruoyi.project.apply.service.impl;
 
-import java.util.List;
-import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.stereotype.Service;
-import com.ruoyi.project.apply.mapper.TApplyLockMapper;
 import com.ruoyi.project.apply.domain.TApplyLock;
+import com.ruoyi.project.apply.mapper.TApplyLockMapper;
 import com.ruoyi.project.apply.service.ITApplyLockService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+
+import java.util.List;
 
 /**
  * 破锁管理Service业务层处理
@@ -30,6 +31,10 @@ public class TApplyLockServiceImpl implements ITApplyLockService
     {
         return tApplyLockMapper.selectTApplyLockById(id);
     }
+    public TApplyLock selectTApplyLockByLockCode(String lockCode)
+    {
+        return tApplyLockMapper.selectTApplyLockByLockCode(lockCode);
+    }
 
     /**
      * 查询破锁管理列表

master/src/main/java/com/ruoyi/project/apply/service/impl/TApplyOfflinevalveServiceImpl.java

@@ -91,4 +91,10 @@ public class TApplyOfflinevalveServiceImpl implements ITApplyOfflinevalveService
     {
         return tApplyOfflinevalveMapper.deleteTApplyOfflinevalveById(id);
     }
+
+    @Override
+    public TApplyOfflinevalve selectTApplyOfflinevalveByLock(String lockNo)
+    {
+        return tApplyOfflinevalveMapper.selectTApplyOfflinevalveByLock(lockNo);
+    }
 }

master/src/main/java/com/ruoyi/project/apply/service/impl/TApplySafetychangeServiceImpl.java

@@ -31,6 +31,11 @@ public class TApplySafetychangeServiceImpl implements ITApplySafetychangeService
     {
         return tApplySafetychangeMapper.selectTApplySafetychangeById(id);
     }
+    @Override
+    public TApplySafetychange selectTApplySafetychangeByLock(String lockNo)
+    {
+        return tApplySafetychangeMapper.selectTApplySafetychangeByLock(lockNo);
+    }
 
     /**
      * 查询组织保护措施状态变更申请列表

master/src/main/resources/mybatis/apply/TApplyLockMapper.xml

@@ -36,18 +36,18 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
     <select id="selectTApplyLockList" parameterType="TApplyLock" resultMap="TApplyLockResult">
         <include refid="selectTApplyLockVo"/>
         <where>
-            <if test="unit != null  and unit != ''"> and unit = #{unit}</if>
-            <if test="lockPost != null  and lockPost != ''"> and lock_post like concat(concat('%',#{lockPost}),'%')</if>
-            <if test="pidNo != null  and pidNo != ''"> and pid_no = #{pidNo}</if>
-            <if test="lockCode != null  and lockCode != ''"> and lock_code = #{lockCode}</if>
-            <if test="medium != null  and medium != ''"> and medium = #{medium}</if>
-            <if test="position != null  and position != ''"> and position = #{position}</if>
+            <if test="unit != null  and unit != ''"> and unit  like concat(concat('%',#{unit}),'%')</if>
+            <if test="lockPost != null  and lockPost != ''"> and lock_post = #{lockPost}</if>
+            <if test="pidNo != null  and pidNo != ''"> and pid_no  like concat(concat('%', #{pidNo}),'%')</if>
+            <if test="lockCode != null  and lockCode != ''"> and lock_code  like concat(concat('%',#{lockCode}),'%')</if>
+            <if test="medium != null  and medium != ''"> and medium  like concat(concat('%',#{medium}),'%')</if>
+            <if test="position != null  and position != ''"> and position  like concat(concat('%',#{position}),'%')</if>
             <if test="reason != null  and reason != ''"> and reason = #{reason}</if>
             <if test="technology != null  and technology != ''"> and technology = #{technology}</if>
             <if test="riskLevel != null  and riskLevel != ''"> and risk_level = #{riskLevel}</if>
             <if test="lockSize != null  and lockSize != ''"> and lock_size = #{lockSize}</if>
-            <if test="remarks != null  and remarks != ''"> and remarks = #{remarks}</if>
-            <if test="status != null "> and status = #{status}</if>
+            <if test="remarks != null  and remarks != ''"> and d.remarks = #{remarks}</if>
+            <if test="status != null "> and d.status = #{status}</if>
             <if test="valveStatus != null "> and valve_status = #{valveStatus}</if>
             <if test="createrCode != null  and createrCode != ''"> and creater_code = #{createrCode}</if>
             <if test="createdate != null "> and createdate = #{createdate}</if>
@@ -66,6 +66,11 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
         where id = #{id}
     </select>
 
+    <select id="selectTApplyLockByLockCode" parameterType="String" resultMap="TApplyLockResult">
+        <include refid="selectTApplyLockVo"/>
+        where lock_code =#{lockCode}
+    </select>
+
     <insert id="insertTApplyLock" parameterType="TApplyLock">
         <selectKey keyProperty="id" resultType="long" order="BEFORE">
             SELECT seq_t_apply_lock.NEXTVAL as id FROM DUAL
@@ -144,11 +149,11 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
     </update>
 
     <update id="deleteTApplyLockById" parameterType="Long">
-        update t_apply_lock set del_flag = 2 where id = #{id}
+        update t_apply_lock set status = 2 where id = #{id}
     </update>
 
     <update id="deleteTApplyLockByIds" parameterType="String">
-        update t_apply_lock set del_flag = 2 where id in
+        update t_apply_lock set status = 2 where id in
         <foreach item="id" collection="array" open="(" separator="," close=")">
             #{id}
         </foreach>

master/src/main/resources/mybatis/apply/TApplyOfflinevalveMapper.xml

@@ -249,4 +249,9 @@
         </foreach>
     </update>
 
+    <select id="selectTApplyOfflinevalveByLock" parameterType="string" resultMap="TApplyOfflinevalveResult">
+        <include refid="selectTApplyOfflinevalveVo"/>
+        where lock_no = #{lockNo} and d.status=0 and d.approve_status=2
+    </select>
+
 </mapper>

master/src/main/resources/mybatis/apply/TApplySafetychangeMapper.xml

@@ -119,6 +119,11 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
         where id = #{id}
     </select>
 
+    <select id="selectTApplySafetychangeByLock" parameterType="String" resultMap="TApplySafetychangeResult">
+        <include refid="selectTApplySafetychangeVo"/>
+        where lock_no = #{lockNo} and d.status=0 and d.approve_status=2
+    </select>
+
     <insert id="insertTApplySafetychange" parameterType="TApplySafetychange">
         <selectKey keyProperty="id" resultType="long" order="BEFORE">
             SELECT seq_t_apply_safetychange.NEXTVAL as id FROM DUAL

ui/src/api/apply/lock.js

@@ -16,6 +16,23 @@ export function listAllLock(query) {
     params: query
   })
 }
+export function listLockBranch(query) {
+  return request({
+    url: '/apply/lock/listLockBranch',
+    method: 'get',
+    params: query
+  })
+}
+
+
+// 查询安全阀离线切出申请详细
+export function getInfoByLock(lockNo) {
+  return request({
+    url: '/apply/lock/getInfoByLock/' + lockNo,
+    method: 'get'
+  })
+}
+
 
 // 查询破锁管理详细
 export function getLock(id) {

ui/src/views/apply/lock/index.vue

@@ -7,7 +7,16 @@
           placeholder="请输入单元"
           clearable
           size="small"
-          @keyup.enter.native="handleQuery"
+          @input="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="岗位" prop="lockPost">
+        <el-input
+          v-model="queryParams.lockPost"
+          placeholder="请输入岗位"
+          clearable
+          size="small"
+          @input="handleQuery"
         />
       </el-form-item>
       <el-form-item label="编号" prop="lockCode">
@@ -16,7 +25,7 @@
           placeholder="请输入编号"
           clearable
           size="small"
-          @keyup.enter.native="handleQuery"
+          @input="handleQuery"
         />
       </el-form-item>
       <el-form-item label="介质" prop="medium">
@@ -25,7 +34,7 @@
           placeholder="请输入介质"
           clearable
           size="small"
-          @keyup.enter.native="handleQuery"
+          @input="handleQuery"
         />
       </el-form-item>
       <el-form-item label="位置描述" prop="position">
@@ -34,12 +43,15 @@
           placeholder="请输入位置描述"
           clearable
           size="small"
-          @keyup.enter.native="handleQuery"
+          @input="handleQuery"
         />
       </el-form-item>
       <el-form-item label="状态" prop="status">
-        <el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">
-          <el-option label="请选择字典生成" value="" />
+        <el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small" @change="handleQuery">
+          <el-option v-for="dict in statusList"
+                     :label="dict.dictLabel"
+                     :value="dict.dictValue"
+                     :key="dict.dictValue"/>
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -56,7 +68,8 @@
           size="mini"
           @click="handleAdd"
           v-hasPermi="['apply:lock:add']"
-        >新增</el-button>
+        >新增
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -66,7 +79,8 @@
           :disabled="single"
           @click="handleUpdate"
           v-hasPermi="['apply:lock:edit']"
-        >修改</el-button>
+        >修改
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -76,7 +90,8 @@
           :disabled="multiple"
           @click="handleDelete"
           v-hasPermi="['apply:lock:remove']"
-        >删除</el-button>
+        >删除
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -85,7 +100,8 @@
           size="mini"
           @click="handleImport"
           v-hasPermi="['apply:lock:edit']"
-        >导入</el-button>
+        >导入
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -94,22 +110,26 @@
           size="mini"
           @click="handleExport"
           v-hasPermi="['apply:lock:export']"
-        >导出</el-button>
+        >导出
+        </el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
-    <el-table v-loading="loading" :data="lockList" @selection-change="handleSelectionChange" :height="clientHeight" border>
-      <el-table-column type="selection" width="55" align="center" />
+    <el-table v-loading="loading" :data="lockList" @selection-change="handleSelectionChange" :height="clientHeight"
+              border>
+      <el-table-column type="selection" width="55" align="center"/>
       <el-table-column label="单元" align="center" prop="unit" :show-overflow-tooltip="true" width="130px"/>
       <el-table-column label="岗位" align="center" prop="lockPost" :show-overflow-tooltip="true" width="130px"/>
       <el-table-column label="P&ID图号" align="center" prop="pidNo" :show-overflow-tooltip="true" width="130px"/>
-      <el-table-column label="状态" align="center" prop="status" :show-overflow-tooltip="true" width="130px" :formatter="statusFormat"/>
+      <el-table-column label="状态" align="center" prop="status" :show-overflow-tooltip="true" width="130px"
+                       :formatter="statusFormat"/>
       <el-table-column label="编号" align="center" prop="lockCode" :show-overflow-tooltip="true" width="130px"/>
       <el-table-column label="介质" align="center" prop="medium" :show-overflow-tooltip="true" width="130px"/>
       <el-table-column label="位置描述" align="center" prop="position" :show-overflow-tooltip="true" width="200px"/>
       <el-table-column label="锁开锁关原因" align="center" prop="reason" :show-overflow-tooltip="true" width="200px"/>
-      <el-table-column label="安全阀/工艺" align="center" prop="technology" :show-overflow-tooltip="true" width="130px"/>
+      <el-table-column label="安全阀/工艺" align="center" prop="technology" :show-overflow-tooltip="true"
+                       width="130px"/>
       <el-table-column label="风险等级" align="center" prop="riskLevel" :show-overflow-tooltip="true" width="130px"/>
       <el-table-column label="尺寸" align="center" prop="lockSize" :show-overflow-tooltip="true" width="130px"/>
       <el-table-column label="阀门状态" align="center" prop="valveStatus" :show-overflow-tooltip="true" width="130px"/>
@@ -122,14 +142,16 @@
             icon="el-icon-edit"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['apply:lock:edit']"
-          >修改</el-button>
+          >修改
+          </el-button>
           <el-button
             size="mini"
             type="text"
             icon="el-icon-delete"
             @click="handleDelete(scope.row)"
             v-hasPermi="['apply:lock:remove']"
-          >删除</el-button>
+          >删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -146,43 +168,43 @@
     <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="110px">
         <el-form-item label="单元" prop="unit">
-          <el-input v-model="form.unit" placeholder="请输入单元" />
+          <el-input v-model="form.unit" placeholder="请输入单元"/>
         </el-form-item>
         <el-form-item label="岗位" prop="lockPost">
-          <el-input v-model="form.lockPost" placeholder="请输入岗位" />
+          <el-input v-model="form.lockPost" placeholder="请输入岗位"/>
         </el-form-item>
         <el-form-item label="P&ID图号" prop="pidNo">
-          <el-input v-model="form.pidNo" placeholder="请输入P&ID图号" />
+          <el-input v-model="form.pidNo" placeholder="请输入P&ID图号"/>
         </el-form-item>
         <el-form-item label="编号" prop="lockCode">
-          <el-input v-model="form.lockCode" placeholder="请输入编号" />
+          <el-input v-model="form.lockCode" placeholder="请输入编号"/>
         </el-form-item>
         <el-form-item label="介质" prop="medium">
-          <el-input v-model="form.medium" placeholder="请输入介质" />
+          <el-input v-model="form.medium" placeholder="请输入介质"/>
         </el-form-item>
         <el-form-item label="位置描述" prop="position">
-          <el-input v-model="form.position" placeholder="请输入位置描述" />
+          <el-input v-model="form.position" placeholder="请输入位置描述"/>
         </el-form-item>
         <el-form-item label="锁开锁关原因" prop="reason">
-          <el-input v-model="form.reason" placeholder="请输入锁开锁关原因" />
+          <el-input v-model="form.reason" placeholder="请输入锁开锁关原因"/>
         </el-form-item>
         <el-form-item label="安全阀/工艺" prop="technology">
-          <el-input v-model="form.technology" placeholder="请输入安全阀/工艺" />
+          <el-input v-model="form.technology" placeholder="请输入安全阀/工艺"/>
         </el-form-item>
         <el-form-item label="风险等级" prop="riskLevel">
-          <el-input v-model="form.riskLevel" placeholder="请输入风险等级" />
+          <el-input v-model="form.riskLevel" placeholder="请输入风险等级"/>
         </el-form-item>
         <el-form-item label="尺寸" prop="lockSize">
-          <el-input v-model="form.lockSize" placeholder="请输入尺寸" />
+          <el-input v-model="form.lockSize" placeholder="请输入尺寸"/>
         </el-form-item>
         <el-form-item label="阀门状态" prop="valveStatus">
-          <el-input v-model="form.valveStatus" placeholder="请输入阀门状态" />
+          <el-input v-model="form.valveStatus" placeholder="请输入阀门状态"/>
         </el-form-item>
         <el-form-item label="备注" prop="remarks">
-          <el-input v-model="form.remarks" placeholder="请输入备注" />
+          <el-input v-model="form.remarks" placeholder="请输入备注"/>
         </el-form-item>
         <el-form-item label="归属部门" prop="deptId">
-          <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门" />
+          <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门"/>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -213,7 +235,7 @@
           <el-link type="info" style="font-size:12px" @click="importTemplate">下载模板</el-link>
         </div>
         <form ref="downloadFileForm" :action="upload.downloadAction" target="FORMSUBMIT">
-          <input name="type" :value="upload.type" hidden />
+          <input name="type" :value="upload.type" hidden/>
         </form>
         <div class="el-upload__tip" style="color:red" slot="tip">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
       </el-upload>
@@ -226,15 +248,15 @@
 </template>
 
 <script>
-import { listLock, getLock, delLock, addLock, updateLock, exportLock, importTemplate} from "@/api/apply/lock";
-import { treeselect } from "@/api/system/dept";
-import { getToken } from "@/utils/auth";
+import {listLock, getLock, delLock, addLock, updateLock, exportLock, importTemplate} from "@/api/apply/lock";
+import {treeselect} from "@/api/system/dept";
+import {getToken} from "@/utils/auth";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 
 export default {
   name: "Lock",
-  components: { Treeselect },
+  components: {Treeselect},
   data() {
     return {
       // 遮罩层
@@ -256,7 +278,7 @@ export default {
       title: "",
       // 部门树选项
       deptOptions: undefined,
-      clientHeight:300,
+      clientHeight: 300,
       // 是否显示弹出层
       open: false,
       // 用户导入参数
@@ -274,7 +296,7 @@ export default {
         // 是否更新已经存在的用户数据
         updateSupport: 0,
         // 设置上传的请求头部
-        headers: { Authorization: "Bearer " + getToken() },
+        headers: {Authorization: "Bearer " + getToken()},
         // 上传的地址
         url: process.env.VUE_APP_BASE_API + "/apply/lock/importData"
       },
@@ -305,6 +327,21 @@ export default {
       form: {},
       // 表单校验
       rules: {
+        lockCode: [
+          {required: true, message: "请输入编号", trigger: "blur"}
+        ],
+        unit: [
+          {required: true, message: "请输入单元", trigger: "blur"}
+        ],
+        lockPost: [
+          {required: true, message: "请输入岗位", trigger: "blur"}
+        ],
+        pidNo: [
+          {required: true, message: "请输入P&ID图号", trigger: "blur"}
+        ],
+        deptId: [
+          {required: true, message: "请选择归属部门", trigger: "blur"}
+        ],
       }
     };
   },
@@ -317,7 +354,7 @@ export default {
   created() {
     //设置表格高度对应屏幕高度
     this.$nextTick(() => {
-      this.clientHeight = document.body.clientHeight -250
+      this.clientHeight = document.body.clientHeight - 250
     })
     this.getList();
     this.getTreeselect();
@@ -332,9 +369,9 @@ export default {
       let type = '';
       if (row.status === 0) {
         type = 'success';
-      }else if (row.status === 1) {
+      } else if (row.status === 1) {
         type = 'danger';
-      }else if (row.status === 1) {
+      } else if (row.status === 2) {
         type = 'info';
       }
       return <el-tag type={type}>{s}</el-tag>;
@@ -398,7 +435,7 @@ export default {
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.id)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
       this.multiple = !selection.length
     },
     /** 新增按钮操作 */
@@ -440,12 +477,12 @@ export default {
     /** 删除按钮操作 */
     handleDelete(row) {
       const ids = row.id || this.ids;
-      this.$confirm('是否确认删除?', "警告", {
+      this.$prompt('请输入删除原因', "警告", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning"
-      }).then(function() {
-        return delLock(ids);
+      }).then(({ value }) => {
+        return updateLock({id:row.id,status:2,remarks:value});
       }).then(() => {
         this.getList();
         this.msgSuccess("删除成功");
@@ -458,7 +495,7 @@ export default {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning"
-      }).then(function() {
+      }).then(function () {
         return exportLock(queryParams);
       }).then(response => {
         this.download(response.msg);

ui/src/views/apply/lock/lock-aeu.vue

@@ -0,0 +1,492 @@
+<template>
+  <div class="app-container" :style="`height:${height}px`" id="parent">
+    <el-row :gutter="10" class="mb8" style="z-index: 10;">
+      <el-tooltip class="top-right-btn" effect="dark" :content="$t('tagsView.refresh')" placement="top">
+        <el-button size="mini" circle icon="el-icon-refresh" @click="getList"/>
+      </el-tooltip>
+    </el-row>
+    <vue-draggable-resizable v-drag
+                             w="auto" h="auto" :draggable="dragMove" style="background-color:#fff;padding: 0px 20px">
+      <div class="zoom" @wheel.prevent="handleTableWheel($event)" ref="branch">
+        <table v-if="!loading&&data.length>0">
+          <tr>
+            <th colspan="5">
+            </th>
+            <th colspan="25">
+              <span style="font-size: 40px">锁开&锁关摆放看板（AEU）</span><br/>
+            </th>
+            <th colspan="5">
+              <el-tag type="success" style="font-size: 20px;margin: 0px 10px;background-color: #67C23A" size="medium"
+                      effect="dark">已挂锁
+              </el-tag>
+              <el-tag type="danger" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已拆锁
+              </el-tag>
+              <el-tag type="info" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已删除</el-tag>
+            </th>
+          </tr>
+          <tr v-for="(list) in data">
+            <td v-for="(item) in list">
+              <el-button type="text" @click="handleClick,openDialog(item.id,item.status,item.lockCode)"
+                         style="color: #fff;padding: 5px;height: 100%;font-weight: bold"
+                         :class=" item.status===2? 'grey' : (item.status===1 ? 'red':'green')">
+                <svg-icon icon-class="key" style="font-size: 300%" v-if="item.status===1"/>
+                <i class="el-icon-circle-close" style="font-size: 300%" v-else-if="item.status===2"/>
+                <svg-icon icon-class="key" style="font-size: 300%" v-else/>
+                <br/>
+                <br/>
+                <span>{{ item.lockCode.substring(0, item.lockCode.indexOf('-')) }}</span>
+                <br><br>
+                <span>{{ item.lockCode.substring(item.lockCode.indexOf('-'), item.lockCode.length) }}</span>
+              </el-button>
+            </td>
+          </tr>
+        </table>
+        <el-empty v-else-if="loading" description="数据加载中..."></el-empty>
+        <el-empty v-else description=""></el-empty>
+      </div>
+    </vue-draggable-resizable>
+    <el-dialog :visible.sync="visible" title="锁详情">
+      <el-descriptions class="margin-top" :column="3" size="medium" border>
+        <el-descriptions-item label-style="width:200px">
+          <template slot="label">
+            删除原因
+          </template>
+          {{ this.lockData.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="visible = false">返 回</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog title="申请单详情" :visible.sync="detail.open1" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="安全阀位号" :label-style="labelStyle">{{ this.detail.data.devNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="单元" :label-style="labelStyle">{{ this.detail.data.unit }}</el-descriptions-item>
+        <el-descriptions-item label="离线原因" :span="2">{{ this.detail.data.offlineReason }}</el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估以及临时措施执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全阀锁开是否拆解" :label-style="labelStyle">
+          {{ this.detail.data.disassembly }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.temporaryTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀是否已经复位" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀复位后现场是否存在泄漏" :label-style="labelStyle">
+          {{ this.detail.data.leakConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，之前采取的安全措施是否已撤销" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，是否已经重新上锁" :label-style="labelStyle">
+          {{ this.detail.data.lockConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认上锁人员" :label-style="labelStyle" :span="2">
+          {{ this.detail.data.lockConfirmer1Name }} {{ this.detail.data.lockConfirmer2Name }}
+        </el-descriptions-item>
+        <el-descriptions-item label="上述信息确认人" :label-style="labelStyle">
+          {{ this.detail.data.infoConfirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.confirmTime }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open2" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="组织保护措施变更播述" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeDescribe }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态变更的原因" span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeReason }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估及临时的安全措施" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估人" :label-style="labelStyle">
+          {{ this.detail.data.safaerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.safaTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.confirmTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施状态变更执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeExecution }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行人" :label-style="labelStyle">
+          {{ this.detail.data.changeExecutorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.changeExecutorTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施是否已经恢复至变更前的状态" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人1" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人2" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复后，之前采取的安全措施是否已撤销" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open3" width="50%" append-to-body>
+      <el-empty description=""></el-empty>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import VueDraggableResizable from 'vue-draggable-resizable'
+import {getLock, listLockBranch, updateLock, getInfoByLock} from "@/api/apply/lock";
+import OfflinevalveDetail from "@/views/approve/approveDetail/offlinevalve-detail";
+
+export default {
+  components: {OfflinevalveDetail, VueDraggableResizable},
+  name: "lock-aeu",
+  directives: {
+    drag(el) {
+      const oDiv = el
+      // 拖拽时间标识
+      let firstTime = ''
+      let lastTime = ''
+      document.onselectstart = function () {
+        return false
+      }
+      oDiv.onmousedown = function (e) {
+        // 为了区分点击还是拖拽，使用时间差来判断，200毫秒内为点击，200毫秒外为拖拽，初始化为点击
+        document.getElementById('parent').setAttribute('drag-flag', false)
+        firstTime = new Date().getTime()
+        // 判断下当前时间与初始时间差，大于200毫秒则判断状态为拖拽
+
+
+        // 鼠标抬起时清除事件
+        document.onmouseup = function (e) {
+          lastTime = new Date().getTime()
+          console.log("firstTime:::" + firstTime)
+          console.log("lastTime:::" + lastTime)
+          console.log("lastTime-firstTime:::" + (lastTime - firstTime))
+          if (lastTime - firstTime > 150) {
+            document.getElementById('parent').setAttribute('drag-flag', true)
+          }
+          document.onmousemove = null
+          document.onmouseup = null
+        }
+        return false
+      }
+    }
+  },
+  data() {
+    return {// 详情对象
+      detail: {
+        open1: false,
+        open2: false,
+        open3: false,
+        data: {}
+      },
+      applyStatus: {0: "未完成", 1: "已完成"},
+      approveStatus: {1: "申请中", 2: "已通过", 3: "已拒绝"},
+      statusFlag: '',
+      approveStatusFlag: '',
+      //label样式
+      labelStyle: {'width': '200px'},
+      lockData: {},
+      clientHeight: 300,
+      dragMove: true,
+      drawer: false,
+      data: [],
+      status: 0,
+      id: null,
+      loading: true,
+      visible: false,
+      height: document.body.clientHeight - 155,
+      clickFlag: true,// 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 20,
+        unit: null,
+        lockPost: 'AEU',
+        pidNo: null,
+        lockCode: null,
+        medium: null,
+        position: null,
+        reason: null,
+        technology: null,
+        riskLevel: null,
+        lockSize: null,
+        remarks: null,
+        status: null,
+        createrCode: null,
+        createdate: null,
+        updaterCode: null,
+        updatedate: null,
+        valveStatus: null,
+        deptId: null
+      },
+    }
+  },
+  created() {
+    this.getList();
+  },
+  mounted() {
+    window.onresize = () => {    //写在mounted中,onresize事件会在页面大小被调整时触发
+      return (() => {
+        window.screenHeight = document.body.clientHeight - 155;
+        this.height = window.screenHeight;
+      })();
+    };
+
+  },
+  watch: {
+    height(val) {        //在watch中监听height,浏览器窗口大小变动时自适应高度。
+      this.height = val;
+      console.log(this.height, "新的高度");
+    },
+  },
+  methods: {
+    /** 查询破锁管理列表 */
+    getList() {
+      this.loading = true;
+      listLockBranch(this.queryParams).then(response => {
+        this.data = response.data;
+        this.loading = false;
+      });
+    },
+    handleClick() {
+      setTimeout(function () {
+        // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
+        const isDrag = document.getElementById('parent').getAttribute('drag-flag')
+        if (isDrag == 'true') {
+          return
+        }
+      }, 50)
+    },
+    handleTableWheel(event) {
+      let obj = this.$refs['branch']
+      return this.tableZoom(obj, event)
+    },
+    tableZoom(obj, event) {
+      // 一开始默认是100%
+      let zoom = parseInt(obj.style.zoom, 10) || 100
+      // 滚轮滚一下wheelDelta的值增加或减少120
+      zoom += event.wheelDelta / 12
+      if (zoom > 25) {
+        obj.style.zoom = zoom + '%'
+      }
+      return false
+    },
+    openDialog(id, status, lockCode) {
+      // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
+      const isDrag = document.getElementById('parent').getAttribute('drag-flag')
+      if (isDrag === 'true') {
+        return
+      }
+      this.id = id
+      this.status = status
+      if (status == 2) {
+        this.visible = true;
+        this.lockData = {};
+        getLock(id).then(res => {
+          this.lockData = res.data
+        })
+      }
+      if (status == 1) {
+        this.statusFlag = '';
+        this.approveStatusFlag = '';
+        this.detail.open = true;
+        this.detail.data = {};
+        getInfoByLock(lockCode).then(res => {
+          if (res.data.type == 1) {
+            this.detail.open1 = true
+          }
+          if (res.data.type == 2) {
+            this.detail.open2 = true
+          }
+          if (res.data.type == 3) {
+            this.detail.open3 = true
+            return
+          }
+          this.detail.data = res.data.data
+          if (this.detail.data.status === 1) {
+            this.statusFlag = 'success';
+          }
+          if (this.detail.data.approveStatus === '2') {
+            this.approveStatusFlag = 'success';
+          } else if (this.detail.data.approveStatus === '1') {
+            this.approveStatusFlag = 'warning';
+          } else if (this.detail.data.approveStatus === '3') {
+            this.approveStatusFlag = 'danger';
+          }
+        })
+
+      }
+    },
+    changeColor(type) {
+      updateLock({id: this.id, status: type}).then(response => {
+        this.msgSuccess("修改成功");
+        this.visible = false;
+        this.getList();
+      });
+    }
+  }
+}
+</script>
+
+<style scoped>
+table {
+  width: auto;
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+}
+
+th {
+  height: 80px;
+  color: #4b4b4b;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+tr {
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+}
+
+td {
+  height: 200px;
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+  vertical-align: middle;
+  text-align: center;
+  padding: 20px 10px 20px 10px;
+}
+
+i {
+  font-size: 200%;
+  padding-bottom: 10px;
+}
+
+el-button {
+  width: 140px;
+  height: auto;
+}
+
+.green {
+  background-color: #67C23A;
+}
+
+.red {
+  background-color: #F56C6C;
+}
+
+.yellow {
+  background-color: #E6A23C;
+}
+
+.grey {
+  background-color: #909399;
+}
+</style>

ui/src/views/apply/lock/lock-dashboard.vue

@@ -5,16 +5,16 @@
           <lock-eu item="1" typename="" v-if="isFirst"></lock-eu>
         </el-tab-pane>
         <el-tab-pane label="AEU" name="second">
-          <lock-xx item="2" typename="" v-if="isSecond"></lock-xx>
+          <lock-aeu item="2" typename="" v-if="isSecond"></lock-aeu>
         </el-tab-pane>
         <el-tab-pane label="PGU" name="third">
-          <lock-xx item="3" typename="" v-if="isThird"></lock-xx>
+          <lock-pgu item="3" typename="" v-if="isThird"></lock-pgu>
         </el-tab-pane>
         <el-tab-pane label="SCTU" name="fourth">
-          <lock-xx item="4" typename="" v-if="isFourth"></lock-xx>
+          <lock-sctu item="4" typename="" v-if="isFourth"></lock-sctu>
         </el-tab-pane>
         <el-tab-pane label="SUB" name="fifth">
-          <lock-xx item="5" typename="" v-if="isFifth"></lock-xx>
+          <lock-sub item="5" typename="" v-if="isFifth"></lock-sub>
         </el-tab-pane>
       </el-tabs>
     </div>
@@ -22,10 +22,13 @@
 
 <script>
 import LockEu from "@/views/apply/lock/lock-eu";
-import LockXx from "@/views/apply/lock/lock-xx";
+import LockAeu from "@/views/apply/lock/lock-aeu";
+import LockPgu from "@/views/apply/lock/lock-pgu";
+import LockSctu from "@/views/apply/lock/lock-sctu";
+import LockSub from "@/views/apply/lock/lock-sub";
 export default {
   name: "lock-dashboard",
-  components: {LockXx, LockEu},
+  components: {LockSub, LockSctu, LockPgu, LockAeu, LockEu},
   data() {
     return {
       // 默认第一个Tab

ui/src/views/apply/lock/lock-eu.vue

@@ -1,23 +1,33 @@
 <template>
   <div class="app-container" :style="`height:${height}px`" id="parent">
-    <el-row :gutter="10" class="mb8" style="z-index: 10;flex: right">
+    <el-row :gutter="10" class="mb8" style="z-index: 10;">
       <el-tooltip class="top-right-btn" effect="dark" :content="$t('tagsView.refresh')" placement="top">
-        <el-button size="mini" circle icon="el-icon-refresh" @click="getList" />
+        <el-button size="mini" circle icon="el-icon-refresh" @click="getList"/>
       </el-tooltip>
     </el-row>
     <vue-draggable-resizable v-drag
                              w="auto" h="auto" :draggable="dragMove" style="background-color:#fff;padding: 0px 20px">
       <div class="zoom" @wheel.prevent="handleTableWheel($event)" ref="branch">
-        <table v-loading="loading">
+        <table v-if="!loading&&data.length>0">
           <tr>
-            <th :colspan="colspan">
-              <span v-if="!loading" style="font-size: 40px">蒸汽裂解装置锁开&锁关摆放看板（EU）</span><br/>
+            <th colspan="5">
+            </th>
+            <th colspan="25">
+              <span style="font-size: 40px">蒸汽裂解装置锁开&锁关摆放看板（EU）</span><br/>
               <!--              <span style="font-size: 18px">LO&LC display board of Steam Cracker plant(EU)</span>-->
             </th>
+            <th colspan="5">
+              <el-tag type="success" style="font-size: 20px;margin: 0px 10px;background-color: #67C23A" size="medium"
+                      effect="dark">已挂锁
+              </el-tag>
+              <el-tag type="danger" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已拆锁
+              </el-tag>
+              <el-tag type="info" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已删除</el-tag>
+            </th>
           </tr>
           <tr v-for="(list) in data">
             <td v-for="(item) in list">
-              <el-button type="text" @click="handleClick,openDialog(item.id,item.status)"
+              <el-button type="text" @click="handleClick,openDialog(item.id,item.status,item.lockCode)"
                          style="color: #fff;padding: 5px;height: 100%;font-weight: bold"
                          :class=" item.status===2? 'grey' : (item.status===1 ? 'red':'green')">
                 <svg-icon icon-class="key" style="font-size: 300%" v-if="item.status===1"/>
@@ -28,41 +38,214 @@
                 <span>{{ item.lockCode.substring(0, item.lockCode.indexOf('-')) }}</span>
                 <br><br>
                 <span>{{ item.lockCode.substring(item.lockCode.indexOf('-'), item.lockCode.length) }}</span>
-
               </el-button>
             </td>
           </tr>
         </table>
+        <el-empty v-else-if="loading" description="数据加载中..."></el-empty>
+        <el-empty v-else description=""></el-empty>
       </div>
     </vue-draggable-resizable>
     <el-dialog :visible.sync="visible" title="锁详情">
       <el-descriptions class="margin-top" :column="3" size="medium" border>
-        <el-descriptions-item>
+        <el-descriptions-item label-style="width:200px">
           <template slot="label">
-            <i style="font-size: 100%" class="el-icon-edit"></i>
-            修改锁状态
+            删除原因
           </template>
-          <el-button :disabled="status==0" size="medium" type="success" plain round @click="changeColor(0)">挂锁
-          </el-button>
-          <el-button :disabled="status==1" size="medium" type="danger" plain round @click="changeColor(1)">拆锁
-          </el-button>
-          <el-button :disabled="status==2" size="medium" type="info" plain round @click="changeColor(2)">删除
-          </el-button>
+          {{ this.lockData.remarks }}
         </el-descriptions-item>
       </el-descriptions>
       <div slot="footer" class="dialog-footer">
         <el-button @click="visible = false">返 回</el-button>
       </div>
     </el-dialog>
+
+    <el-dialog title="申请单详情" :visible.sync="detail.open1" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="安全阀位号" :label-style="labelStyle">{{ this.detail.data.devNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="单元" :label-style="labelStyle">{{ this.detail.data.unit }}</el-descriptions-item>
+        <el-descriptions-item label="离线原因" :span="2">{{ this.detail.data.offlineReason }}</el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估以及临时措施执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全阀锁开是否拆解" :label-style="labelStyle">
+          {{ this.detail.data.disassembly }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.temporaryTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀是否已经复位" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀复位后现场是否存在泄漏" :label-style="labelStyle">
+          {{ this.detail.data.leakConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，之前采取的安全措施是否已撤销" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，是否已经重新上锁" :label-style="labelStyle">
+          {{ this.detail.data.lockConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认上锁人员" :label-style="labelStyle" :span="2">
+          {{ this.detail.data.lockConfirmer1Name }} {{ this.detail.data.lockConfirmer2Name }}
+        </el-descriptions-item>
+        <el-descriptions-item label="上述信息确认人" :label-style="labelStyle">
+          {{ this.detail.data.infoConfirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.confirmTime }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open2" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="组织保护措施变更播述" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeDescribe }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态变更的原因" span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeReason }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估及临时的安全措施" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估人" :label-style="labelStyle">
+          {{ this.detail.data.safaerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.safaTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.confirmTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施状态变更执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeExecution }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行人" :label-style="labelStyle">
+          {{ this.detail.data.changeExecutorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.changeExecutorTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施是否已经恢复至变更前的状态" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人1" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人2" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复后，之前采取的安全措施是否已撤销" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open3" width="50%" append-to-body>
+      <el-empty description=""></el-empty>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import VueDraggableResizable from 'vue-draggable-resizable'
-import {listAllLock, updateLock} from "@/api/apply/lock";
+import {getLock, listLockBranch, updateLock, getInfoByLock} from "@/api/apply/lock";
+import OfflinevalveDetail from "@/views/approve/approveDetail/offlinevalve-detail";
 
 export default {
-  components: {VueDraggableResizable},
+  components: {OfflinevalveDetail, VueDraggableResizable},
   name: "lock-eu",
   directives: {
     drag(el) {
@@ -86,7 +269,7 @@ export default {
           console.log("firstTime:::" + firstTime)
           console.log("lastTime:::" + lastTime)
           console.log("lastTime-firstTime:::" + (lastTime - firstTime))
-          if (lastTime - firstTime > 100) {
+          if (lastTime - firstTime > 150) {
             document.getElementById('parent').setAttribute('drag-flag', true)
           }
           document.onmousemove = null
@@ -97,23 +280,35 @@ export default {
     }
   },
   data() {
-    return {
+    return {// 详情对象
+      detail: {
+        open1: false,
+        open2: false,
+        open3: false,
+        data: {}
+      },
+      applyStatus: {0: "未完成", 1: "已完成"},
+      approveStatus: {1: "申请中", 2: "已通过", 3: "已拒绝"},
+      statusFlag: '',
+      approveStatusFlag: '',
+      //label样式
+      labelStyle: {'width': '200px'},
+      lockData: {},
       clientHeight: 300,
       dragMove: true,
       drawer: false,
       data: [],
       status: 0,
-      index: null,
+      id: null,
       loading: true,
       visible: false,
       height: document.body.clientHeight - 155,
-      colspan: 35,
       clickFlag: true,// 查询参数
       queryParams: {
         pageNum: 1,
         pageSize: 20,
         unit: null,
-        lockPost: '裂解',
+        lockPost: 'EU',
         pidNo: null,
         lockCode: null,
         medium: null,
@@ -155,7 +350,7 @@ export default {
     /** 查询破锁管理列表 */
     getList() {
       this.loading = true;
-      listAllLock(this.queryParams).then(response => {
+      listLockBranch(this.queryParams).then(response => {
         this.data = response.data;
         this.loading = false;
       });
@@ -183,18 +378,54 @@ export default {
       }
       return false
     },
-    openDialog(index, status) {
+    openDialog(id, status, lockCode) {
       // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
       const isDrag = document.getElementById('parent').getAttribute('drag-flag')
       if (isDrag === 'true') {
         return
       }
-      this.visible = true;
-      this.index = index
+      this.id = id
       this.status = status
+      if (status == 2) {
+        this.visible = true;
+        this.lockData = {};
+        getLock(id).then(res => {
+          this.lockData = res.data
+        })
+      }
+      if (status == 1) {
+        this.statusFlag = '';
+        this.approveStatusFlag = '';
+        this.detail.open = true;
+        this.detail.data = {};
+        getInfoByLock(lockCode).then(res => {
+          if (res.data.type == 1) {
+            this.detail.open1 = true
+          }
+          if (res.data.type == 2) {
+            this.detail.open2 = true
+          }
+          if (res.data.type == 3) {
+            this.detail.open3 = true
+            return
+          }
+          this.detail.data = res.data.data
+          if (this.detail.data.status === 1) {
+            this.statusFlag = 'success';
+          }
+          if (this.detail.data.approveStatus === '2') {
+            this.approveStatusFlag = 'success';
+          } else if (this.detail.data.approveStatus === '1') {
+            this.approveStatusFlag = 'warning';
+          } else if (this.detail.data.approveStatus === '3') {
+            this.approveStatusFlag = 'danger';
+          }
+        })
+
+      }
     },
     changeColor(type) {
-      updateLock({id: this.index, status: type}).then(response => {
+      updateLock({id: this.id, status: type}).then(response => {
         this.msgSuccess("修改成功");
         this.visible = false;
         this.getList();

ui/src/views/apply/lock/lock-pgu.vue

@@ -0,0 +1,492 @@
+<template>
+  <div class="app-container" :style="`height:${height}px`" id="parent">
+    <el-row :gutter="10" class="mb8" style="z-index: 10;">
+      <el-tooltip class="top-right-btn" effect="dark" :content="$t('tagsView.refresh')" placement="top">
+        <el-button size="mini" circle icon="el-icon-refresh" @click="getList"/>
+      </el-tooltip>
+    </el-row>
+    <vue-draggable-resizable v-drag
+                             w="auto" h="auto" :draggable="dragMove" style="background-color:#fff;padding: 0px 20px">
+      <div class="zoom" @wheel.prevent="handleTableWheel($event)" ref="branch">
+        <table v-if="!loading&&data.length>0">
+          <tr>
+            <th colspan="5">
+            </th>
+            <th colspan="25">
+              <span style="font-size: 40px">锁开&锁关摆放看板（PGU）</span><br/>
+            </th>
+            <th colspan="5">
+              <el-tag type="success" style="font-size: 20px;margin: 0px 10px;background-color: #67C23A" size="medium"
+                      effect="dark">已挂锁
+              </el-tag>
+              <el-tag type="danger" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已拆锁
+              </el-tag>
+              <el-tag type="info" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已删除</el-tag>
+            </th>
+          </tr>
+          <tr v-for="(list) in data">
+            <td v-for="(item) in list">
+              <el-button type="text" @click="handleClick,openDialog(item.id,item.status,item.lockCode)"
+                         style="color: #fff;padding: 5px;height: 100%;font-weight: bold"
+                         :class=" item.status===2? 'grey' : (item.status===1 ? 'red':'green')">
+                <svg-icon icon-class="key" style="font-size: 300%" v-if="item.status===1"/>
+                <i class="el-icon-circle-close" style="font-size: 300%" v-else-if="item.status===2"/>
+                <svg-icon icon-class="key" style="font-size: 300%" v-else/>
+                <br/>
+                <br/>
+                <span>{{ item.lockCode.substring(0, item.lockCode.indexOf('-')) }}</span>
+                <br><br>
+                <span>{{ item.lockCode.substring(item.lockCode.indexOf('-'), item.lockCode.length) }}</span>
+              </el-button>
+            </td>
+          </tr>
+        </table>
+        <el-empty v-else-if="loading" description="数据加载中..."></el-empty>
+        <el-empty v-else description=""></el-empty>
+      </div>
+    </vue-draggable-resizable>
+    <el-dialog :visible.sync="visible" title="锁详情">
+      <el-descriptions class="margin-top" :column="3" size="medium" border>
+        <el-descriptions-item label-style="width:200px">
+          <template slot="label">
+            删除原因
+          </template>
+          {{ this.lockData.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="visible = false">返 回</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog title="申请单详情" :visible.sync="detail.open1" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="安全阀位号" :label-style="labelStyle">{{ this.detail.data.devNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="单元" :label-style="labelStyle">{{ this.detail.data.unit }}</el-descriptions-item>
+        <el-descriptions-item label="离线原因" :span="2">{{ this.detail.data.offlineReason }}</el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估以及临时措施执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全阀锁开是否拆解" :label-style="labelStyle">
+          {{ this.detail.data.disassembly }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.temporaryTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀是否已经复位" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀复位后现场是否存在泄漏" :label-style="labelStyle">
+          {{ this.detail.data.leakConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，之前采取的安全措施是否已撤销" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，是否已经重新上锁" :label-style="labelStyle">
+          {{ this.detail.data.lockConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认上锁人员" :label-style="labelStyle" :span="2">
+          {{ this.detail.data.lockConfirmer1Name }} {{ this.detail.data.lockConfirmer2Name }}
+        </el-descriptions-item>
+        <el-descriptions-item label="上述信息确认人" :label-style="labelStyle">
+          {{ this.detail.data.infoConfirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.confirmTime }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open2" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="组织保护措施变更播述" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeDescribe }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态变更的原因" span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeReason }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估及临时的安全措施" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估人" :label-style="labelStyle">
+          {{ this.detail.data.safaerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.safaTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.confirmTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施状态变更执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeExecution }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行人" :label-style="labelStyle">
+          {{ this.detail.data.changeExecutorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.changeExecutorTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施是否已经恢复至变更前的状态" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人1" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人2" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复后，之前采取的安全措施是否已撤销" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open3" width="50%" append-to-body>
+      <el-empty description=""></el-empty>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import VueDraggableResizable from 'vue-draggable-resizable'
+import {getLock, listLockBranch, updateLock, getInfoByLock} from "@/api/apply/lock";
+import OfflinevalveDetail from "@/views/approve/approveDetail/offlinevalve-detail";
+
+export default {
+  components: {OfflinevalveDetail, VueDraggableResizable},
+  name: "lock-pgu",
+  directives: {
+    drag(el) {
+      const oDiv = el
+      // 拖拽时间标识
+      let firstTime = ''
+      let lastTime = ''
+      document.onselectstart = function () {
+        return false
+      }
+      oDiv.onmousedown = function (e) {
+        // 为了区分点击还是拖拽，使用时间差来判断，200毫秒内为点击，200毫秒外为拖拽，初始化为点击
+        document.getElementById('parent').setAttribute('drag-flag', false)
+        firstTime = new Date().getTime()
+        // 判断下当前时间与初始时间差，大于200毫秒则判断状态为拖拽
+
+
+        // 鼠标抬起时清除事件
+        document.onmouseup = function (e) {
+          lastTime = new Date().getTime()
+          console.log("firstTime:::" + firstTime)
+          console.log("lastTime:::" + lastTime)
+          console.log("lastTime-firstTime:::" + (lastTime - firstTime))
+          if (lastTime - firstTime > 150) {
+            document.getElementById('parent').setAttribute('drag-flag', true)
+          }
+          document.onmousemove = null
+          document.onmouseup = null
+        }
+        return false
+      }
+    }
+  },
+  data() {
+    return {// 详情对象
+      detail: {
+        open1: false,
+        open2: false,
+        open3: false,
+        data: {}
+      },
+      applyStatus: {0: "未完成", 1: "已完成"},
+      approveStatus: {1: "申请中", 2: "已通过", 3: "已拒绝"},
+      statusFlag: '',
+      approveStatusFlag: '',
+      //label样式
+      labelStyle: {'width': '200px'},
+      lockData: {},
+      clientHeight: 300,
+      dragMove: true,
+      drawer: false,
+      data: [],
+      status: 0,
+      id: null,
+      loading: true,
+      visible: false,
+      height: document.body.clientHeight - 155,
+      clickFlag: true,// 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 20,
+        unit: null,
+        lockPost: 'PGU',
+        pidNo: null,
+        lockCode: null,
+        medium: null,
+        position: null,
+        reason: null,
+        technology: null,
+        riskLevel: null,
+        lockSize: null,
+        remarks: null,
+        status: null,
+        createrCode: null,
+        createdate: null,
+        updaterCode: null,
+        updatedate: null,
+        valveStatus: null,
+        deptId: null
+      },
+    }
+  },
+  created() {
+    this.getList();
+  },
+  mounted() {
+    window.onresize = () => {    //写在mounted中,onresize事件会在页面大小被调整时触发
+      return (() => {
+        window.screenHeight = document.body.clientHeight - 155;
+        this.height = window.screenHeight;
+      })();
+    };
+
+  },
+  watch: {
+    height(val) {        //在watch中监听height,浏览器窗口大小变动时自适应高度。
+      this.height = val;
+      console.log(this.height, "新的高度");
+    },
+  },
+  methods: {
+    /** 查询破锁管理列表 */
+    getList() {
+      this.loading = true;
+      listLockBranch(this.queryParams).then(response => {
+        this.data = response.data;
+        this.loading = false;
+      });
+    },
+    handleClick() {
+      setTimeout(function () {
+        // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
+        const isDrag = document.getElementById('parent').getAttribute('drag-flag')
+        if (isDrag == 'true') {
+          return
+        }
+      }, 50)
+    },
+    handleTableWheel(event) {
+      let obj = this.$refs['branch']
+      return this.tableZoom(obj, event)
+    },
+    tableZoom(obj, event) {
+      // 一开始默认是100%
+      let zoom = parseInt(obj.style.zoom, 10) || 100
+      // 滚轮滚一下wheelDelta的值增加或减少120
+      zoom += event.wheelDelta / 12
+      if (zoom > 25) {
+        obj.style.zoom = zoom + '%'
+      }
+      return false
+    },
+    openDialog(id, status, lockCode) {
+      // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
+      const isDrag = document.getElementById('parent').getAttribute('drag-flag')
+      if (isDrag === 'true') {
+        return
+      }
+      this.id = id
+      this.status = status
+      if (status == 2) {
+        this.visible = true;
+        this.lockData = {};
+        getLock(id).then(res => {
+          this.lockData = res.data
+        })
+      }
+      if (status == 1) {
+        this.statusFlag = '';
+        this.approveStatusFlag = '';
+        this.detail.open = true;
+        this.detail.data = {};
+        getInfoByLock(lockCode).then(res => {
+          if (res.data.type == 1) {
+            this.detail.open1 = true
+          }
+          if (res.data.type == 2) {
+            this.detail.open2 = true
+          }
+          if (res.data.type == 3) {
+            this.detail.open3 = true
+            return
+          }
+          this.detail.data = res.data.data
+          if (this.detail.data.status === 1) {
+            this.statusFlag = 'success';
+          }
+          if (this.detail.data.approveStatus === '2') {
+            this.approveStatusFlag = 'success';
+          } else if (this.detail.data.approveStatus === '1') {
+            this.approveStatusFlag = 'warning';
+          } else if (this.detail.data.approveStatus === '3') {
+            this.approveStatusFlag = 'danger';
+          }
+        })
+
+      }
+    },
+    changeColor(type) {
+      updateLock({id: this.id, status: type}).then(response => {
+        this.msgSuccess("修改成功");
+        this.visible = false;
+        this.getList();
+      });
+    }
+  }
+}
+</script>
+
+<style scoped>
+table {
+  width: auto;
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+}
+
+th {
+  height: 80px;
+  color: #4b4b4b;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+tr {
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+}
+
+td {
+  height: 200px;
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+  vertical-align: middle;
+  text-align: center;
+  padding: 20px 10px 20px 10px;
+}
+
+i {
+  font-size: 200%;
+  padding-bottom: 10px;
+}
+
+el-button {
+  width: 140px;
+  height: auto;
+}
+
+.green {
+  background-color: #67C23A;
+}
+
+.red {
+  background-color: #F56C6C;
+}
+
+.yellow {
+  background-color: #E6A23C;
+}
+
+.grey {
+  background-color: #909399;
+}
+</style>

ui/src/views/apply/lock/lock-sctu.vue

@@ -0,0 +1,492 @@
+<template>
+  <div class="app-container" :style="`height:${height}px`" id="parent">
+    <el-row :gutter="10" class="mb8" style="z-index: 10;">
+      <el-tooltip class="top-right-btn" effect="dark" :content="$t('tagsView.refresh')" placement="top">
+        <el-button size="mini" circle icon="el-icon-refresh" @click="getList"/>
+      </el-tooltip>
+    </el-row>
+    <vue-draggable-resizable v-drag
+                             w="auto" h="auto" :draggable="dragMove" style="background-color:#fff;padding: 0px 20px">
+      <div class="zoom" @wheel.prevent="handleTableWheel($event)" ref="branch">
+        <table v-if="!loading&&data.length>0">
+          <tr>
+            <th colspan="5">
+            </th>
+            <th colspan="25">
+              <span style="font-size: 40px">锁开&锁关摆放看板（SCTU）</span><br/>
+            </th>
+            <th colspan="5">
+              <el-tag type="success" style="font-size: 20px;margin: 0px 10px;background-color: #67C23A" size="medium"
+                      effect="dark">已挂锁
+              </el-tag>
+              <el-tag type="danger" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已拆锁
+              </el-tag>
+              <el-tag type="info" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已删除</el-tag>
+            </th>
+          </tr>
+          <tr v-for="(list) in data">
+            <td v-for="(item) in list">
+              <el-button type="text" @click="handleClick,openDialog(item.id,item.status,item.lockCode)"
+                         style="color: #fff;padding: 5px;height: 100%;font-weight: bold"
+                         :class=" item.status===2? 'grey' : (item.status===1 ? 'red':'green')">
+                <svg-icon icon-class="key" style="font-size: 300%" v-if="item.status===1"/>
+                <i class="el-icon-circle-close" style="font-size: 300%" v-else-if="item.status===2"/>
+                <svg-icon icon-class="key" style="font-size: 300%" v-else/>
+                <br/>
+                <br/>
+                <span>{{ item.lockCode.substring(0, item.lockCode.indexOf('-')) }}</span>
+                <br><br>
+                <span>{{ item.lockCode.substring(item.lockCode.indexOf('-'), item.lockCode.length) }}</span>
+              </el-button>
+            </td>
+          </tr>
+        </table>
+        <el-empty v-else-if="loading" description="数据加载中..."></el-empty>
+        <el-empty v-else description=""></el-empty>
+      </div>
+    </vue-draggable-resizable>
+    <el-dialog :visible.sync="visible" title="锁详情">
+      <el-descriptions class="margin-top" :column="3" size="medium" border>
+        <el-descriptions-item label-style="width:200px">
+          <template slot="label">
+            删除原因
+          </template>
+          {{ this.lockData.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="visible = false">返 回</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog title="申请单详情" :visible.sync="detail.open1" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="安全阀位号" :label-style="labelStyle">{{ this.detail.data.devNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="单元" :label-style="labelStyle">{{ this.detail.data.unit }}</el-descriptions-item>
+        <el-descriptions-item label="离线原因" :span="2">{{ this.detail.data.offlineReason }}</el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估以及临时措施执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全阀锁开是否拆解" :label-style="labelStyle">
+          {{ this.detail.data.disassembly }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.temporaryTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀是否已经复位" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀复位后现场是否存在泄漏" :label-style="labelStyle">
+          {{ this.detail.data.leakConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，之前采取的安全措施是否已撤销" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，是否已经重新上锁" :label-style="labelStyle">
+          {{ this.detail.data.lockConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认上锁人员" :label-style="labelStyle" :span="2">
+          {{ this.detail.data.lockConfirmer1Name }} {{ this.detail.data.lockConfirmer2Name }}
+        </el-descriptions-item>
+        <el-descriptions-item label="上述信息确认人" :label-style="labelStyle">
+          {{ this.detail.data.infoConfirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.confirmTime }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open2" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="组织保护措施变更播述" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeDescribe }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态变更的原因" span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeReason }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估及临时的安全措施" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估人" :label-style="labelStyle">
+          {{ this.detail.data.safaerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.safaTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.confirmTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施状态变更执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeExecution }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行人" :label-style="labelStyle">
+          {{ this.detail.data.changeExecutorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.changeExecutorTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施是否已经恢复至变更前的状态" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人1" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人2" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复后，之前采取的安全措施是否已撤销" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open3" width="50%" append-to-body>
+      <el-empty description=""></el-empty>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import VueDraggableResizable from 'vue-draggable-resizable'
+import {getLock, listLockBranch, updateLock, getInfoByLock} from "@/api/apply/lock";
+import OfflinevalveDetail from "@/views/approve/approveDetail/offlinevalve-detail";
+
+export default {
+  components: {OfflinevalveDetail, VueDraggableResizable},
+  name: "lock-sctu",
+  directives: {
+    drag(el) {
+      const oDiv = el
+      // 拖拽时间标识
+      let firstTime = ''
+      let lastTime = ''
+      document.onselectstart = function () {
+        return false
+      }
+      oDiv.onmousedown = function (e) {
+        // 为了区分点击还是拖拽，使用时间差来判断，200毫秒内为点击，200毫秒外为拖拽，初始化为点击
+        document.getElementById('parent').setAttribute('drag-flag', false)
+        firstTime = new Date().getTime()
+        // 判断下当前时间与初始时间差，大于200毫秒则判断状态为拖拽
+
+
+        // 鼠标抬起时清除事件
+        document.onmouseup = function (e) {
+          lastTime = new Date().getTime()
+          console.log("firstTime:::" + firstTime)
+          console.log("lastTime:::" + lastTime)
+          console.log("lastTime-firstTime:::" + (lastTime - firstTime))
+          if (lastTime - firstTime > 150) {
+            document.getElementById('parent').setAttribute('drag-flag', true)
+          }
+          document.onmousemove = null
+          document.onmouseup = null
+        }
+        return false
+      }
+    }
+  },
+  data() {
+    return {// 详情对象
+      detail: {
+        open1: false,
+        open2: false,
+        open3: false,
+        data: {}
+      },
+      applyStatus: {0: "未完成", 1: "已完成"},
+      approveStatus: {1: "申请中", 2: "已通过", 3: "已拒绝"},
+      statusFlag: '',
+      approveStatusFlag: '',
+      //label样式
+      labelStyle: {'width': '200px'},
+      lockData: {},
+      clientHeight: 300,
+      dragMove: true,
+      drawer: false,
+      data: [],
+      status: 0,
+      id: null,
+      loading: true,
+      visible: false,
+      height: document.body.clientHeight - 155,
+      clickFlag: true,// 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 20,
+        unit: null,
+        lockPost: 'SCTU',
+        pidNo: null,
+        lockCode: null,
+        medium: null,
+        position: null,
+        reason: null,
+        technology: null,
+        riskLevel: null,
+        lockSize: null,
+        remarks: null,
+        status: null,
+        createrCode: null,
+        createdate: null,
+        updaterCode: null,
+        updatedate: null,
+        valveStatus: null,
+        deptId: null
+      },
+    }
+  },
+  created() {
+    this.getList();
+  },
+  mounted() {
+    window.onresize = () => {    //写在mounted中,onresize事件会在页面大小被调整时触发
+      return (() => {
+        window.screenHeight = document.body.clientHeight - 155;
+        this.height = window.screenHeight;
+      })();
+    };
+
+  },
+  watch: {
+    height(val) {        //在watch中监听height,浏览器窗口大小变动时自适应高度。
+      this.height = val;
+      console.log(this.height, "新的高度");
+    },
+  },
+  methods: {
+    /** 查询破锁管理列表 */
+    getList() {
+      this.loading = true;
+      listLockBranch(this.queryParams).then(response => {
+        this.data = response.data;
+        this.loading = false;
+      });
+    },
+    handleClick() {
+      setTimeout(function () {
+        // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
+        const isDrag = document.getElementById('parent').getAttribute('drag-flag')
+        if (isDrag == 'true') {
+          return
+        }
+      }, 50)
+    },
+    handleTableWheel(event) {
+      let obj = this.$refs['branch']
+      return this.tableZoom(obj, event)
+    },
+    tableZoom(obj, event) {
+      // 一开始默认是100%
+      let zoom = parseInt(obj.style.zoom, 10) || 100
+      // 滚轮滚一下wheelDelta的值增加或减少120
+      zoom += event.wheelDelta / 12
+      if (zoom > 25) {
+        obj.style.zoom = zoom + '%'
+      }
+      return false
+    },
+    openDialog(id, status, lockCode) {
+      // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
+      const isDrag = document.getElementById('parent').getAttribute('drag-flag')
+      if (isDrag === 'true') {
+        return
+      }
+      this.id = id
+      this.status = status
+      if (status == 2) {
+        this.visible = true;
+        this.lockData = {};
+        getLock(id).then(res => {
+          this.lockData = res.data
+        })
+      }
+      if (status == 1) {
+        this.statusFlag = '';
+        this.approveStatusFlag = '';
+        this.detail.open = true;
+        this.detail.data = {};
+        getInfoByLock(lockCode).then(res => {
+          if (res.data.type == 1) {
+            this.detail.open1 = true
+          }
+          if (res.data.type == 2) {
+            this.detail.open2 = true
+          }
+          if (res.data.type == 3) {
+            this.detail.open3 = true
+            return
+          }
+          this.detail.data = res.data.data
+          if (this.detail.data.status === 1) {
+            this.statusFlag = 'success';
+          }
+          if (this.detail.data.approveStatus === '2') {
+            this.approveStatusFlag = 'success';
+          } else if (this.detail.data.approveStatus === '1') {
+            this.approveStatusFlag = 'warning';
+          } else if (this.detail.data.approveStatus === '3') {
+            this.approveStatusFlag = 'danger';
+          }
+        })
+
+      }
+    },
+    changeColor(type) {
+      updateLock({id: this.id, status: type}).then(response => {
+        this.msgSuccess("修改成功");
+        this.visible = false;
+        this.getList();
+      });
+    }
+  }
+}
+</script>
+
+<style scoped>
+table {
+  width: auto;
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+}
+
+th {
+  height: 80px;
+  color: #4b4b4b;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+tr {
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+}
+
+td {
+  height: 200px;
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+  vertical-align: middle;
+  text-align: center;
+  padding: 20px 10px 20px 10px;
+}
+
+i {
+  font-size: 200%;
+  padding-bottom: 10px;
+}
+
+el-button {
+  width: 140px;
+  height: auto;
+}
+
+.green {
+  background-color: #67C23A;
+}
+
+.red {
+  background-color: #F56C6C;
+}
+
+.yellow {
+  background-color: #E6A23C;
+}
+
+.grey {
+  background-color: #909399;
+}
+</style>

ui/src/views/apply/lock/lock-sub.vue

@@ -0,0 +1,492 @@
+<template>
+  <div class="app-container" :style="`height:${height}px`" id="parent">
+    <el-row :gutter="10" class="mb8" style="z-index: 10;">
+      <el-tooltip class="top-right-btn" effect="dark" :content="$t('tagsView.refresh')" placement="top">
+        <el-button size="mini" circle icon="el-icon-refresh" @click="getList"/>
+      </el-tooltip>
+    </el-row>
+    <vue-draggable-resizable v-drag
+                             w="auto" h="auto" :draggable="dragMove" style="background-color:#fff;padding: 0px 20px">
+      <div class="zoom" @wheel.prevent="handleTableWheel($event)" ref="branch">
+        <table v-if="!loading&&data.length>0">
+          <tr>
+            <th colspan="5">
+            </th>
+            <th colspan="25">
+              <span style="font-size: 40px">锁开&锁关摆放看板（SUB）</span><br/>
+            </th>
+            <th colspan="5">
+              <el-tag type="success" style="font-size: 20px;margin: 0px 10px;background-color: #67C23A" size="medium"
+                      effect="dark">已挂锁
+              </el-tag>
+              <el-tag type="danger" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已拆锁
+              </el-tag>
+              <el-tag type="info" style="font-size: 20px;margin: 0px 10px;" size="medium" effect="dark">已删除</el-tag>
+            </th>
+          </tr>
+          <tr v-for="(list) in data">
+            <td v-for="(item) in list">
+              <el-button type="text" @click="handleClick,openDialog(item.id,item.status,item.lockCode)"
+                         style="color: #fff;padding: 5px;height: 100%;font-weight: bold"
+                         :class=" item.status===2? 'grey' : (item.status===1 ? 'red':'green')">
+                <svg-icon icon-class="key" style="font-size: 300%" v-if="item.status===1"/>
+                <i class="el-icon-circle-close" style="font-size: 300%" v-else-if="item.status===2"/>
+                <svg-icon icon-class="key" style="font-size: 300%" v-else/>
+                <br/>
+                <br/>
+                <span>{{ item.lockCode.substring(0, item.lockCode.indexOf('-')) }}</span>
+                <br><br>
+                <span>{{ item.lockCode.substring(item.lockCode.indexOf('-'), item.lockCode.length) }}</span>
+              </el-button>
+            </td>
+          </tr>
+        </table>
+        <el-empty v-else-if="loading" description="数据加载中..."></el-empty>
+        <el-empty v-else description=""></el-empty>
+      </div>
+    </vue-draggable-resizable>
+    <el-dialog :visible.sync="visible" title="锁详情">
+      <el-descriptions class="margin-top" :column="3" size="medium" border>
+        <el-descriptions-item label-style="width:200px">
+          <template slot="label">
+            删除原因
+          </template>
+          {{ this.lockData.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="visible = false">返 回</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog title="申请单详情" :visible.sync="detail.open1" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="安全阀位号" :label-style="labelStyle">{{ this.detail.data.devNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="单元" :label-style="labelStyle">{{ this.detail.data.unit }}</el-descriptions-item>
+        <el-descriptions-item label="离线原因" :span="2">{{ this.detail.data.offlineReason }}</el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估以及临时措施执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全阀锁开是否拆解" :label-style="labelStyle">
+          {{ this.detail.data.disassembly }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.temporaryTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀是否已经复位" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全阀复位后现场是否存在泄漏" :label-style="labelStyle">
+          {{ this.detail.data.leakConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，之前采取的安全措施是否已撤销" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离线安全复位后，是否已经重新上锁" :label-style="labelStyle">
+          {{ this.detail.data.lockConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认上锁人员" :label-style="labelStyle" :span="2">
+          {{ this.detail.data.lockConfirmer1Name }} {{ this.detail.data.lockConfirmer2Name }}
+        </el-descriptions-item>
+        <el-descriptions-item label="上述信息确认人" :label-style="labelStyle">
+          {{ this.detail.data.infoConfirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.confirmTime }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open2" width="50%" append-to-body>
+      <el-descriptions :column="2" border size="medium">
+        <el-descriptions-item label="组织保护措施变更播述" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeDescribe }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态变更的原因" span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeReason }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请人" :label-style="labelStyle">
+          {{ this.detail.data.applicantName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="申请时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="状态" :label-style="labelStyle">
+          <el-tag size="small" :type="statusFlag">{{ applyStatus[this.detail.data.status] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="申请状态">
+          <el-tag size="small" :type="approveStatusFlag">{{ approveStatus[this.detail.data.approveStatus] }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估及临时的安全措施" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.safa }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估人" :label-style="labelStyle">
+          {{ this.detail.data.safaerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="安全评估时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.safaTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="批准人" :label-style="labelStyle">
+          {{ this.detail.data.approverName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="批准时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
+          {{ this.detail.data.executorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认人" :label-style="labelStyle">
+          {{ this.detail.data.confirmerName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="临时措施确认时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.confirmTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施状态变更执行" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.changeExecution }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行人" :label-style="labelStyle">
+          {{ this.detail.data.changeExecutorName }}
+        </el-descriptions-item>
+        <el-descriptions-item label="执行时间" :label-style="labelStyle">
+          <template>
+            <span>{{ parseTime(this.detail.data.changeExecutorTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          </template>
+        </el-descriptions-item>
+        <el-descriptions-item label="组织保护措施是否已经恢复至变更前的状态" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人1" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime1 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复，确认人2" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmerName2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="确认时间" :label-style="labelStyle">
+          {{ this.detail.data.resetConfirmTime2 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="状态恢复后，之前采取的安全措施是否已撤销" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.revokeConfirm }}
+        </el-descriptions-item>
+        <el-descriptions-item label="备注" :span="2" :label-style="labelStyle">
+          {{ this.detail.data.remarks }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+    <el-dialog title="申请单详情" :visible.sync="detail.open3" width="50%" append-to-body>
+      <el-empty description=""></el-empty>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import VueDraggableResizable from 'vue-draggable-resizable'
+import {getLock, listLockBranch, updateLock, getInfoByLock} from "@/api/apply/lock";
+import OfflinevalveDetail from "@/views/approve/approveDetail/offlinevalve-detail";
+
+export default {
+  components: {OfflinevalveDetail, VueDraggableResizable},
+  name: "lock-sub",
+  directives: {
+    drag(el) {
+      const oDiv = el
+      // 拖拽时间标识
+      let firstTime = ''
+      let lastTime = ''
+      document.onselectstart = function () {
+        return false
+      }
+      oDiv.onmousedown = function (e) {
+        // 为了区分点击还是拖拽，使用时间差来判断，200毫秒内为点击，200毫秒外为拖拽，初始化为点击
+        document.getElementById('parent').setAttribute('drag-flag', false)
+        firstTime = new Date().getTime()
+        // 判断下当前时间与初始时间差，大于200毫秒则判断状态为拖拽
+
+
+        // 鼠标抬起时清除事件
+        document.onmouseup = function (e) {
+          lastTime = new Date().getTime()
+          console.log("firstTime:::" + firstTime)
+          console.log("lastTime:::" + lastTime)
+          console.log("lastTime-firstTime:::" + (lastTime - firstTime))
+          if (lastTime - firstTime > 150) {
+            document.getElementById('parent').setAttribute('drag-flag', true)
+          }
+          document.onmousemove = null
+          document.onmouseup = null
+        }
+        return false
+      }
+    }
+  },
+  data() {
+    return {// 详情对象
+      detail: {
+        open1: false,
+        open2: false,
+        open3: false,
+        data: {}
+      },
+      applyStatus: {0: "未完成", 1: "已完成"},
+      approveStatus: {1: "申请中", 2: "已通过", 3: "已拒绝"},
+      statusFlag: '',
+      approveStatusFlag: '',
+      //label样式
+      labelStyle: {'width': '200px'},
+      lockData: {},
+      clientHeight: 300,
+      dragMove: true,
+      drawer: false,
+      data: [],
+      status: 0,
+      id: null,
+      loading: true,
+      visible: false,
+      height: document.body.clientHeight - 155,
+      clickFlag: true,// 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 20,
+        unit: null,
+        lockPost: 'SUB',
+        pidNo: null,
+        lockCode: null,
+        medium: null,
+        position: null,
+        reason: null,
+        technology: null,
+        riskLevel: null,
+        lockSize: null,
+        remarks: null,
+        status: null,
+        createrCode: null,
+        createdate: null,
+        updaterCode: null,
+        updatedate: null,
+        valveStatus: null,
+        deptId: null
+      },
+    }
+  },
+  created() {
+    this.getList();
+  },
+  mounted() {
+    window.onresize = () => {    //写在mounted中,onresize事件会在页面大小被调整时触发
+      return (() => {
+        window.screenHeight = document.body.clientHeight - 155;
+        this.height = window.screenHeight;
+      })();
+    };
+
+  },
+  watch: {
+    height(val) {        //在watch中监听height,浏览器窗口大小变动时自适应高度。
+      this.height = val;
+      console.log(this.height, "新的高度");
+    },
+  },
+  methods: {
+    /** 查询破锁管理列表 */
+    getList() {
+      this.loading = true;
+      listLockBranch(this.queryParams).then(response => {
+        this.data = response.data;
+        this.loading = false;
+      });
+    },
+    handleClick() {
+      setTimeout(function () {
+        // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
+        const isDrag = document.getElementById('parent').getAttribute('drag-flag')
+        if (isDrag == 'true') {
+          return
+        }
+      }, 50)
+    },
+    handleTableWheel(event) {
+      let obj = this.$refs['branch']
+      return this.tableZoom(obj, event)
+    },
+    tableZoom(obj, event) {
+      // 一开始默认是100%
+      let zoom = parseInt(obj.style.zoom, 10) || 100
+      // 滚轮滚一下wheelDelta的值增加或减少120
+      zoom += event.wheelDelta / 12
+      if (zoom > 25) {
+        obj.style.zoom = zoom + '%'
+      }
+      return false
+    },
+    openDialog(id, status, lockCode) {
+      // 点击事件触发时，判断当前状态是拖拽还是点击，若是拖拽，直接返回不继续执行
+      const isDrag = document.getElementById('parent').getAttribute('drag-flag')
+      if (isDrag === 'true') {
+        return
+      }
+      this.id = id
+      this.status = status
+      if (status == 2) {
+        this.visible = true;
+        this.lockData = {};
+        getLock(id).then(res => {
+          this.lockData = res.data
+        })
+      }
+      if (status == 1) {
+        this.statusFlag = '';
+        this.approveStatusFlag = '';
+        this.detail.open = true;
+        this.detail.data = {};
+        getInfoByLock(lockCode).then(res => {
+          if (res.data.type == 1) {
+            this.detail.open1 = true
+          }
+          if (res.data.type == 2) {
+            this.detail.open2 = true
+          }
+          if (res.data.type == 3) {
+            this.detail.open3 = true
+            return
+          }
+          this.detail.data = res.data.data
+          if (this.detail.data.status === 1) {
+            this.statusFlag = 'success';
+          }
+          if (this.detail.data.approveStatus === '2') {
+            this.approveStatusFlag = 'success';
+          } else if (this.detail.data.approveStatus === '1') {
+            this.approveStatusFlag = 'warning';
+          } else if (this.detail.data.approveStatus === '3') {
+            this.approveStatusFlag = 'danger';
+          }
+        })
+
+      }
+    },
+    changeColor(type) {
+      updateLock({id: this.id, status: type}).then(response => {
+        this.msgSuccess("修改成功");
+        this.visible = false;
+        this.getList();
+      });
+    }
+  }
+}
+</script>
+
+<style scoped>
+table {
+  width: auto;
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+}
+
+th {
+  height: 80px;
+  color: #4b4b4b;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+tr {
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+}
+
+td {
+  height: 200px;
+  border: 1px solid #d0d0d0;
+  border-collapse: collapse;
+  vertical-align: middle;
+  text-align: center;
+  padding: 20px 10px 20px 10px;
+}
+
+i {
+  font-size: 200%;
+  padding-bottom: 10px;
+}
+
+el-button {
+  width: 140px;
+  height: auto;
+}
+
+.green {
+  background-color: #67C23A;
+}
+
+.red {
+  background-color: #F56C6C;
+}
+
+.yellow {
+  background-color: #E6A23C;
+}
+
+.grey {
+  background-color: #909399;
+}
+</style>

ui/src/views/apply/lock/lock-xx.vue

@@ -1,34 +0,0 @@
-<template>
-<div class="app-container"  :style="`height:${height}px`">
-  <el-empty description="页面开发中..."></el-empty>
-</div>
-</template>
-
-<script>
-export default {
-  name: "lock-xx",
-  data(){
-    return{
-      height: document.body.clientHeight - 155,
-    }
-  },mounted() {
-    window.onresize = () => {    //写在mounted中,onresize事件会在页面大小被调整时触发
-      return (() => {
-        window.screenHeight = document.body.clientHeight - 155;
-        this.height = window.screenHeight;
-      })();
-    };
-
-  },
-  watch: {
-    height(val) {        //在watch中监听height,浏览器窗口大小变动时自适应高度。
-      this.height = val;
-      console.log(this.height, "新的高度");
-    },
-  },
-}
-</script>
-
-<style scoped>
-
-</style>

ui/src/views/apply/offlinevalve/index.vue

@@ -53,7 +53,8 @@
         </el-select>
       </el-form-item>
       <el-form-item label="申请状态" prop="approveStatus">
-        <el-select v-model="queryParams.approveStatus" placeholder="请选择申请状态" clearable size="small" @change="handleQuery">
+        <el-select v-model="queryParams.approveStatus" placeholder="请选择申请状态" clearable size="small"
+                   @change="handleQuery">
           <el-option
             v-for="item in approveStatusList"
             :key="item.dictValue"
@@ -79,48 +80,48 @@
         >新增
         </el-button>
       </el-col>
-<!--      <el-col :span="1.5">
-        <el-button
-          type="success"
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['apply:offlinevalve:edit']"
-        >修改
-        </el-button>
-      </el-col>-->
-<!--      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['apply:offlinevalve:remove']"
-        >删除
-        </el-button>
-      </el-col>-->
-<!--      <el-col :span="1.5">
-        <el-button
-          type="info"
-          icon="el-icon-upload2"
-          size="mini"
-          @click="handleImport"
-          v-hasPermi="['apply:offlinevalve:edit']"
-        >导入
-        </el-button>
-      </el-col>-->
-<!--      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['apply:offlinevalve:export']"
-        >导出
-        </el-button>
-      </el-col>-->
+      <!--      <el-col :span="1.5">
+              <el-button
+                type="success"
+                icon="el-icon-edit"
+                size="mini"
+                :disabled="single"
+                @click="handleUpdate"
+                v-hasPermi="['apply:offlinevalve:edit']"
+              >修改
+              </el-button>
+            </el-col>-->
+      <!--      <el-col :span="1.5">
+              <el-button
+                type="danger"
+                icon="el-icon-delete"
+                size="mini"
+                :disabled="multiple"
+                @click="handleDelete"
+                v-hasPermi="['apply:offlinevalve:remove']"
+              >删除
+              </el-button>
+            </el-col>-->
+      <!--      <el-col :span="1.5">
+              <el-button
+                type="info"
+                icon="el-icon-upload2"
+                size="mini"
+                @click="handleImport"
+                v-hasPermi="['apply:offlinevalve:edit']"
+              >导入
+              </el-button>
+            </el-col>-->
+      <!--      <el-col :span="1.5">
+              <el-button
+                type="warning"
+                icon="el-icon-download"
+                size="mini"
+                @click="handleExport"
+                v-hasPermi="['apply:offlinevalve:export']"
+              >导出
+              </el-button>
+            </el-col>-->
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
@@ -132,19 +133,23 @@
       <el-table-column label="单元" align="center" prop="unit" :show-overflow-tooltip="true" width="85" fixed="left"/>
       <el-table-column label="申请状态" align="center" prop="approveStatus" :show-overflow-tooltip="true" width="85"
                        fixed="left" :formatter="approveStatusFormat"/>
-      <el-table-column label="状态" align="center" prop="status" :show-overflow-tooltip="true" width="90" fixed="left" :formatter="statusFormat"/>
+      <el-table-column label="状态" align="center" prop="status" :show-overflow-tooltip="true" width="90" fixed="left"
+                       :formatter="statusFormat"/>
+      <el-table-column label="破锁编号" align="center" prop="lockNo" :show-overflow-tooltip="true" width="140"/>
       <el-table-column label="离线原因" align="center" prop="offlineReason" :show-overflow-tooltip="true" width="185"/>
       <el-table-column label="安全阀锁开是否拆解" align="center" prop="disassembly" :show-overflow-tooltip="true"
                        width="185"/>
-      <el-table-column label="临时措施执行人(执行时间)" align="center" prop="executorName" :show-overflow-tooltip="true" width="270">
+      <el-table-column label="临时措施执行人(执行时间)" align="center" prop="executorName" :show-overflow-tooltip="true"
+                       width="270">
         <template slot-scope="scope">
-          <span>{{scope.row.executorName}} {{ parseTime(scope.row.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          <span>{{ scope.row.executorName }} {{ parseTime(scope.row.executionTime, '{y}-{m}-{d} {h}:{i}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="临时措施确认人(确认时间)" align="center" prop="confirmerName" :show-overflow-tooltip="true"
+      <el-table-column label="临时措施确认人(确认时间)" align="center" prop="confirmerName"
+                       :show-overflow-tooltip="true"
                        width="270">
         <template slot-scope="scope">
-          <span>{{scope.row.confirmerName}} {{ parseTime(scope.row.temporaryTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          <span>{{ scope.row.confirmerName }} {{ parseTime(scope.row.temporaryTime, '{y}-{m}-{d} {h}:{i}') }}</span>
         </template>
       </el-table-column>
       <el-table-column label="申请人" align="center" prop="applicantName" :show-overflow-tooltip="true" width="90"/>
@@ -153,9 +158,10 @@
           <span>{{ parseTime(scope.row.applicationTime, '{y}-{m}-{d} {h}:{i}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="批准人(时间)" align="center" prop="approverName" :show-overflow-tooltip="true" width="190">
+      <el-table-column label="批准人(时间)" align="center" prop="approverName" :show-overflow-tooltip="true"
+                       width="190">
         <template slot-scope="scope">
-          <span>{{scope.row.approverName}} {{ parseTime(scope.row.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
+          <span>{{ scope.row.approverName }} {{ parseTime(scope.row.approveTime, '{y}-{m}-{d} {h}:{i}') }}</span>
         </template>
       </el-table-column>
       />
@@ -177,10 +183,10 @@
           >流转详情
           </el-button>
           <el-button v-if="scope.row.approveStatus == 2"
-            size="mini"
-            type="text"
-            icon="el-icon-document"
-            @click="wordView(scope.row)"
+                     size="mini"
+                     type="text"
+                     icon="el-icon-document"
+                     @click="wordView(scope.row)"
           >预览
           </el-button>
         </template>
@@ -210,7 +216,7 @@
           </el-select>
         </el-form-item>
         <el-form-item label="单元" prop="unit">
-          <el-select v-model="form.unit" placeholder="请选择单元" clearable size="small" filterable style="width: 100%">
+          <el-select v-model="form.unit" placeholder="请选择单元" clearable size="small" filterable style="width: 100%" @change="getLocks(form.unit)">
             <el-option
               v-for="dict in unitOptions"
               :key="dict.name"
@@ -222,21 +228,30 @@
         <el-form-item label="离线原因" prop="offlineReason">
           <el-input type="textarea" v-model="form.offlineReason" placeholder="请输入离线原因"/>
         </el-form-item>
-<!--        <el-form-item label="临时措施执行人" prop="executor">
-          <el-select v-model="form.executor" placeholder="请选择临时措施执行人" clearable size="small" filterable style="width: 100%" @change="getExecutorName(form.executor)">
+        <!--        <el-form-item label="临时措施执行人" prop="executor">
+                  <el-select v-model="form.executor" placeholder="请选择临时措施执行人" clearable size="small" filterable style="width: 100%" @change="getExecutorName(form.executor)">
+                    <el-option
+                      v-for="item in executorList"
+                      :key="item.userId"
+                      :label="item.nickName"
+                      :value="item.userId"
+                    ></el-option>
+                  </el-select>
+                </el-form-item>-->
+        <el-form-item label="破锁编号" prop="lockNo">
+          <el-select v-model="form.lockNo" placeholder="请选择锁编号" clearable size="small" filterable
+                     style="width: 100%">
             <el-option
-              v-for="item in executorList"
-              :key="item.userId"
-              :label="item.nickName"
-              :value="item.userId"
+              v-for="item in lockList"
+              :key="item.lockCode"
+              :label="item.lockCode"
+              :value="item.lockCode"
             ></el-option>
           </el-select>
-        </el-form-item>-->
-        <el-form-item label="破锁编号" prop="lockNo">
-          <el-input  v-model="form.lockNo" placeholder="请输入破锁编号"/>
         </el-form-item>
         <el-form-item label="临时措施确认人" prop="confirmer">
-          <el-select v-model="form.confirmer" placeholder="请选择临时措施确认人" clearable size="small" filterable style="width: 100%">
+          <el-select v-model="form.confirmer" placeholder="请选择临时措施确认人" clearable size="small" filterable
+                     style="width: 100%">
             <el-option
               v-for="item in confirmerList"
               :key="item.USERID"
@@ -301,9 +316,12 @@
         <el-descriptions-item label="安全评估以及临时措施执行" :span="2" :label-style="labelStyle">
           {{ this.detail.data.safa }}
         </el-descriptions-item>
-        <el-descriptions-item label="安全阀锁开是否拆解" :span="2" :label-style="labelStyle">
+        <el-descriptions-item label="安全阀锁开是否拆解" :label-style="labelStyle">
           {{ this.detail.data.disassembly }}
         </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
         <el-descriptions-item label="临时措施执行人" :label-style="labelStyle">
           {{ this.detail.data.executorName }}
         </el-descriptions-item>
@@ -405,15 +423,16 @@ import {listPostUser, listUserByMgrRegion, listUserPost} from "@/api/system/user
 import OfflinevalveDetail from "@/views/approve/approveDetail/offlinevalve-detail";
 import {listRegionalHead} from "@/api/invoice/device";
 import {listSysPlantByParentId} from "@/api/system/plant";
+import {listAllLock} from "@/api/apply/lock";
 
 export default {
   name: "Offlinevalve",
   components: {OfflinevalveDetail, Treeselect},
   data() {
     return {
-      offlinevalveDetailVisible:false,
-      executorList:[],
-      confirmerList:[],
+      offlinevalveDetailVisible: false,
+      executorList: [],
+      confirmerList: [],
       status: {0: "未完成", 1: "已完成"},
       approveStatus: {1: "申请中", 2: "已通过", 3: "已拒绝"},
       statusFlag: '',
@@ -437,6 +456,7 @@ export default {
       total: 0,
       // 安全阀离线切出申请表格数据
       offlinevalveList: [],
+      lockList: [],
       // 安全阀清单
       safetyvavleList: [],
       // 字典
@@ -510,7 +530,7 @@ export default {
         confirmerName: null,
         approverName: null,
         applicantName: null,
-        lockNo:null
+        lockNo: null
       },
       pdf: {
         title: '',
@@ -540,6 +560,9 @@ export default {
         confirmer: [
           {required: true, message: "请选择临时措施确认人", trigger: "blur"}
         ],
+        lockNo: [
+          {required: true, message: "请选择锁编号", trigger: "blur"}
+        ],
       }
     };
   },
@@ -551,8 +574,8 @@ export default {
   },
   created() {
     listUserPost({
-      actualposts:"20,36,10,11,28,30,32,38,15,12,34",
-      deptId:103
+      actualposts: "20,36,10,11,28,30,32,38,15,12,34",
+      deptId: 103
     }).then(response => {
       this.executorList = response;
     });
@@ -568,7 +591,7 @@ export default {
     allSafetyvavle().then(res => {
       this.safetyvavleList = res.data
     });
-    listSysPlantByParentId({parentId:6}).then(response => {
+    listSysPlantByParentId({parentId: 6}).then(response => {
       this.unitOptions = response.data;
     });
     this.getDicts("apply_status").then(response => {
@@ -579,17 +602,23 @@ export default {
     });
   },
   methods: {
-    getUnit(){
+    getLocks(unit) {
+      listAllLock({lockPost: unit,status:0}).then(res => {
+        this.lockList = res.data;
+      })
+    },
+    getUnit() {
       for (const valve of this.safetyvavleList) {
-        if (this.form.devNo==valve.tagno){
-          this.form.unit=valve.unit;
+        if (this.form.devNo == valve.tagno) {
+          this.form.unit = valve.unit;
+          this.getLocks(this.form.unit);
         }
       }
     },
     openApproveDetail(row) {
       this.offlinevalveDetailVisible = true
       this.$nextTick(() => {
-        this.$refs.offlinevalveDetail.init(row.id, '',row.processId,'','',true)
+        this.$refs.offlinevalveDetail.init(row.id, '', row.processId, '', '', true)
       })
     },
     // 字典翻译
@@ -614,19 +643,19 @@ export default {
       }
       return <el-tag type={type}>{s}</el-tag>;
     },
-    getExecutorName(userId){
+    getExecutorName(userId) {
       for (let item of this.executorList) {
-        if (userId===item.userId){
-          this.form.executorName=item.nickName;
+        if (userId === item.userId) {
+          this.form.executorName = item.nickName;
           break;
         }
       }
       console.log(this.form.executorName)
     },
-    getConfirmerName(userId){
+    getConfirmerName(userId) {
       for (const item of this.confirmerList) {
-        if (userId===item.userId){
-          this.form.confirmerName=item.nickName;
+        if (userId === item.userId) {
+          this.form.confirmerName = item.nickName;
           break;
         }
       }
@@ -708,7 +737,7 @@ export default {
         executorName: null,
         confirmerName: null,
         approverName: null,
-        lockNo:null,
+        lockNo: null,
         applicantName: null
       };
       this.resetForm("form");
@@ -820,57 +849,56 @@ export default {
     submitFileForm() {
       this.$refs.upload.submit();
     },
-    wordView(row){
+    wordView(row) {
       wordView(row.id).then(response => {
         console.log(response.msg)
-        this.handleSee("申请单",response.msg )
+        this.handleSee("申请单", response.msg)
       });
     },
-    handleSee (fileName , url){
+    handleSee(fileName, url) {
       //office预览
-      this.loadingFlash=true
-      this.pdf.open =true
+      this.loadingFlash = true
+      this.pdf.open = true
       this.pdf.title = fileName
-      this.pdf.pdfUrl =""
-      this.pptView=false
-      this.ppt=true
+      this.pdf.pdfUrl = ""
+      this.pptView = false
+      this.ppt = true
       //如果是PDF等直接可以打开的就不调接口，否则调用接口
-      if(fileName.endsWith('pdf')){
+      if (fileName.endsWith('pdf')) {
         this.pdf.pdfUrl = process.env.VUE_APP_BASE_API + '/pdf/web/viewer.html?file=' + process.env.VUE_APP_BASE_API + url
-        this.loadingFlash=false
-      }
-      else{
-        const formatDate =new FormData();
-        formatDate.append("filepath",url)
+        this.loadingFlash = false
+      } else {
+        const formatDate = new FormData();
+        formatDate.append("filepath", url)
         //调用文件预览api
-        let res= this.officeConvert.bookConvertCommon(formatDate)
+        let res = this.officeConvert.bookConvertCommon(formatDate)
         //查看接受全局方法的返回结果 console.log(res)
         //利用.then方法接受Promise对象
-        res.then((result)=>{
+        res.then((result) => {
           //关闭加载中
-          this.loadingFlash=false
-          if(result.msg.includes("csv")){
-            this.pdf.pdfUrl =process.env.VUE_APP_BASE_API+ result.data
-            this.$alert(result.msg, this.$t('检查乱码'), { dangerouslyUseHTMLString: true });
+          this.loadingFlash = false
+          if (result.msg.includes("csv")) {
+            this.pdf.pdfUrl = process.env.VUE_APP_BASE_API + result.data
+            this.$alert(result.msg, this.$t('检查乱码'), {dangerouslyUseHTMLString: true});
             //    this.$message({message: result.msg, center: true,type:'warning',  offset:400, });
-          }else if(result.msg.includes("不存在")){
+          } else if (result.msg.includes("不存在")) {
             //文件不存在时提示
-            this.pdf.pdfUrl =""
-            this.$alert(result.msg, this.$t('预览失败'), { dangerouslyUseHTMLString: true });
+            this.pdf.pdfUrl = ""
+            this.$alert(result.msg, this.$t('预览失败'), {dangerouslyUseHTMLString: true});
             //    this.$message({message: result.msg, center: true,type:'warning',  offset:400, });
-            this.pdf.open =false
-          }else if(result.msg.includes("不支持此格式")){
-            this.pdf.pdfUrl =""
-            this.$alert(result.msg, this.$t('预览失败'), { dangerouslyUseHTMLString: true });
+            this.pdf.open = false
+          } else if (result.msg.includes("不支持此格式")) {
+            this.pdf.pdfUrl = ""
+            this.$alert(result.msg, this.$t('预览失败'), {dangerouslyUseHTMLString: true});
             //    this.$message({message: result.msg, center: true,type:'warning',  offset:400, });
-            this.pdf.open =false
-          } else{
+            this.pdf.open = false
+          } else {
             //成功时直接给地址
-            this.pdf.pdfUrl =process.env.VUE_APP_BASE_API+ result.data
+            this.pdf.pdfUrl = process.env.VUE_APP_BASE_API + result.data
           }
         }).catch(result => {
           //请求失败，关闭loading，pdf地址直接为为空，不显示
-          this.pdf.pdfUrl =""
+          this.pdf.pdfUrl = ""
           this.loadingFlash = false;
         })
       }

ui/src/views/apply/safetychange/index.vue

@@ -108,6 +108,7 @@
                        fixed="left" width="160"/>
       <el-table-column label="状态变更的原因" align="center" prop="changeReason" :show-overflow-tooltip="true"
                        width="160"/>
+      <el-table-column label="破锁编号" align="center" prop="lockNo" :show-overflow-tooltip="true" width="140"/>
       <el-table-column label="申请人" align="center" prop="applicantName" :show-overflow-tooltip="true" width="160"/>
       <el-table-column label="申请时间" align="center" prop="applicationTime" width="140">
         <template slot-scope="scope">
@@ -210,7 +211,15 @@
           <el-input type="textarea" v-model="form.changeReason" placeholder="请输入状态变更的原因"/>
         </el-form-item>
         <el-form-item label="破锁编号" prop="lockNo">
-          <el-input  v-model="form.lockNo" placeholder="请输入破锁编号"/>
+          <el-select v-model="form.lockNo" placeholder="请选择锁编号" clearable size="small" filterable
+                     style="width: 100%">
+            <el-option
+              v-for="item in lockList"
+              :key="item.lockCode"
+              :label="item.lockCode"
+              :value="item.lockCode"
+            ></el-option>
+          </el-select>
         </el-form-item>
         <el-form-item label="安全评估人" prop="safaer">
           <el-select v-model="form.safaer" placeholder="请选择临时措施执行人" clearable size="small" filterable
@@ -343,9 +352,12 @@
             <span>{{ parseTime(this.detail.data.changeExecutorTime, '{y}-{m}-{d} {h}:{i}') }}</span>
           </template>
         </el-descriptions-item>
-        <el-descriptions-item label="组织保护措施是否已经恢复至变更前的状态" :span="2" :label-style="labelStyle">
+        <el-descriptions-item label="组织保护措施是否已经恢复至变更前的状态" :label-style="labelStyle">
           {{ this.detail.data.resetConfirm }}
         </el-descriptions-item>
+        <el-descriptions-item label="破锁编号" :label-style="labelStyle">
+          {{ this.detail.data.lockNo }}
+        </el-descriptions-item>
         <el-descriptions-item label="状态恢复，确认人1" :label-style="labelStyle">
           {{ this.detail.data.resetConfirmerName1 }}
         </el-descriptions-item>
@@ -409,6 +421,7 @@ import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import {listPostUser, listUserByMgrRegion, listUserPost} from "@/api/system/user";
 import SafetychangeDetail from "@/views/approve/approveDetail/safetychange-detail";
 import {listRegionalHead} from "@/api/invoice/device";
+import {listAllLock} from "@/api/apply/lock";
 
 export default {
   name: "Safetychange",
@@ -431,6 +444,7 @@ export default {
       // 字典
       statusList: [],
       approveStatusList: [],
+      lockList: [],
       // 遮罩层
       loading: true,
       loadingFlash: false,
@@ -540,6 +554,9 @@ export default {
         executor: [
           {required: true, message: "请选择临时措施执行人", trigger: "blur"}
         ],
+        lockNo: [
+          {required: true, message: "请选择锁编号", trigger: "blur"}
+        ],
       }
     };
   },
@@ -550,6 +567,9 @@ export default {
     }
   },
   created() {
+    listAllLock({status:0}).then(res => {
+      this.lockList = res.data;
+    })
     //设置表格高度对应屏幕高度
     this.$nextTick(() => {
       this.clientHeight = document.body.clientHeight - 250