Merge remote-tracking branch 'origin/master'

gassafetyprogress-admin/src/main/java/com/zehong/web/controller/operationMonitor/THiddenTroubleInfoController.java

+package com.zehong.web.controller.operationMonitor;
+
+import java.util.List;
+import org.springframework.security.access.prepost.PreAuthorize;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.PutMapping;
+import org.springframework.web.bind.annotation.DeleteMapping;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+import com.zehong.common.annotation.Log;
+import com.zehong.common.core.controller.BaseController;
+import com.zehong.common.core.domain.AjaxResult;
+import com.zehong.common.enums.BusinessType;
+import com.zehong.system.domain.THiddenTroubleInfo;
+import com.zehong.system.service.ITHiddenTroubleInfoService;
+import com.zehong.common.utils.poi.ExcelUtil;
+import com.zehong.common.core.page.TableDataInfo;
+
+/**
+ * 燃气隐患Controller
+ * 
+ * @author zehong
+ * @date 2022-03-24
+ */
+@RestController
+@RequestMapping("/system/info")
+public class THiddenTroubleInfoController extends BaseController
+{
+    @Autowired
+    private ITHiddenTroubleInfoService tHiddenTroubleInfoService;
+
+    /**
+     * 查询燃气隐患列表
+     */
+    @PreAuthorize("@ss.hasPermi('system:info:list')")
+    @GetMapping("/list")
+    public TableDataInfo list(THiddenTroubleInfo tHiddenTroubleInfo)
+    {
+        startPage();
+        List<THiddenTroubleInfo> list = tHiddenTroubleInfoService.selectTHiddenTroubleInfoList(tHiddenTroubleInfo);
+        return getDataTable(list);
+    }
+
+    @GetMapping("/hiddenTroubleList")
+    public AjaxResult hiddenTroubleList(THiddenTroubleInfo tHiddenTroubleInfo){
+        return AjaxResult.success(tHiddenTroubleInfoService.selectTHiddenTroubleInfoList(tHiddenTroubleInfo));
+    }
+
+    /**
+     * 导出燃气隐患列表
+     */
+    @PreAuthorize("@ss.hasPermi('system:info:export')")
+    @Log(title = "燃气隐患", businessType = BusinessType.EXPORT)
+    @GetMapping("/export")
+    public AjaxResult export(THiddenTroubleInfo tHiddenTroubleInfo)
+    {
+        List<THiddenTroubleInfo> list = tHiddenTroubleInfoService.selectTHiddenTroubleInfoList(tHiddenTroubleInfo);
+        ExcelUtil<THiddenTroubleInfo> util = new ExcelUtil<THiddenTroubleInfo>(THiddenTroubleInfo.class);
+        return util.exportExcel(list, "燃气隐患数据");
+    }
+
+    /**
+     * 获取燃气隐患详细信息
+     */
+    @PreAuthorize("@ss.hasPermi('system:info:query')")
+    @GetMapping(value = "/{hiddenTroubleId}")
+    public AjaxResult getInfo(@PathVariable("hiddenTroubleId") Long hiddenTroubleId)
+    {
+        return AjaxResult.success(tHiddenTroubleInfoService.selectTHiddenTroubleInfoById(hiddenTroubleId));
+    }
+
+    /**
+     * 新增燃气隐患
+     */
+    @PreAuthorize("@ss.hasPermi('system:info:add')")
+    @Log(title = "燃气隐患", businessType = BusinessType.INSERT)
+    @PostMapping
+    public AjaxResult add(@RequestBody THiddenTroubleInfo tHiddenTroubleInfo)
+    {
+        return toAjax(tHiddenTroubleInfoService.insertTHiddenTroubleInfo(tHiddenTroubleInfo));
+    }
+
+    /**
+     * 修改燃气隐患
+     */
+    @PreAuthorize("@ss.hasPermi('system:info:edit')")
+    @Log(title = "燃气隐患", businessType = BusinessType.UPDATE)
+    @PutMapping
+    public AjaxResult edit(@RequestBody THiddenTroubleInfo tHiddenTroubleInfo)
+    {
+        return toAjax(tHiddenTroubleInfoService.updateTHiddenTroubleInfo(tHiddenTroubleInfo));
+    }
+
+    /**
+     * 删除燃气隐患
+     */
+    @PreAuthorize("@ss.hasPermi('system:info:remove')")
+    @Log(title = "燃气隐患", businessType = BusinessType.DELETE)
+	@DeleteMapping("/{hiddenTroubleIds}")
+    public AjaxResult remove(@PathVariable Long[] hiddenTroubleIds)
+    {
+        return toAjax(tHiddenTroubleInfoService.deleteTHiddenTroubleInfoByIds(hiddenTroubleIds));
+    }
+}

gassafetyprogress-admin/src/main/java/com/zehong/web/controller/operationMonitor/TWorkOrderController.java

 package com.zehong.web.controller.operationMonitor;
 
-import java.util.List;
-
-import com.zehong.common.core.domain.entity.SysUser;
-import com.zehong.common.core.domain.model.LoginUser;
-import com.zehong.common.utils.SecurityUtils;
-import com.zehong.system.domain.SysPost;
-import com.zehong.system.service.ISysPostService;
-import org.springframework.security.access.prepost.PreAuthorize;
-import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.web.bind.annotation.GetMapping;
-import org.springframework.web.bind.annotation.PostMapping;
-import org.springframework.web.bind.annotation.PutMapping;
-import org.springframework.web.bind.annotation.DeleteMapping;
-import org.springframework.web.bind.annotation.PathVariable;
-import org.springframework.web.bind.annotation.RequestBody;
-import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RestController;
 import com.zehong.common.annotation.Log;
 import com.zehong.common.core.controller.BaseController;
 import com.zehong.common.core.domain.AjaxResult;
+import com.zehong.common.core.domain.entity.SysUser;
+import com.zehong.common.core.page.TableDataInfo;
 import com.zehong.common.enums.BusinessType;
+import com.zehong.common.utils.SecurityUtils;
+import com.zehong.common.utils.poi.ExcelUtil;
+import com.zehong.system.domain.SysPost;
+import com.zehong.system.domain.THiddenTroubleInfo;
 import com.zehong.system.domain.TWorkOrder;
+import com.zehong.system.service.ISysPostService;
+import com.zehong.system.service.ITHiddenTroubleInfoService;
 import com.zehong.system.service.ITWorkOrderService;
-import com.zehong.common.utils.poi.ExcelUtil;
-import com.zehong.common.core.page.TableDataInfo;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.security.access.prepost.PreAuthorize;
+import org.springframework.web.bind.annotation.*;
+
+import java.util.Collections;
+import java.util.List;
 
 /**
  * 燃气任务Controller
@@ -42,6 +37,9 @@ public class TWorkOrderController extends BaseController
     @Autowired
     private ISysPostService iSysPostService;
 
+    @Autowired
+    private ITHiddenTroubleInfoService troubleInfoService;
+
     /**
      * 查询燃气任务列表
      */
@@ -120,7 +118,13 @@ public class TWorkOrderController extends BaseController
     @PutMapping
     public AjaxResult edit(@RequestBody TWorkOrder tWorkOrder)
     {
-        return toAjax(tWorkOrderService.updateTWorkOrder(tWorkOrder));
+        int edit = tWorkOrderService.updateTWorkOrder(tWorkOrder);
+        if(1 == edit && null != tWorkOrder.getHiddenList() && !tWorkOrder.getHiddenList().isEmpty()){
+            for(THiddenTroubleInfo tHiddenTroubleInfo : tWorkOrder.getHiddenList()){
+                troubleInfoService.insertTHiddenTroubleInfo(tHiddenTroubleInfo);
+            }
+        }
+        return AjaxResult.success();
     }
 
     /**

gassafetyprogress-admin/src/main/java/com/zehong/web/controller/supervise/TProjectInfoController.java

@@ -5,7 +5,6 @@ import java.util.List;
 import com.zehong.common.config.GassafetyProgressConfig;
 import com.zehong.common.core.domain.entity.SysUser;
 import com.zehong.common.utils.SecurityUtils;
-import org.apache.commons.collections.CollectionUtils;
 import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.web.bind.annotation.GetMapping;

gassafetyprogress-system/src/main/java/com/zehong/system/domain/THiddenTroubleInfo.java

+package com.zehong.system.domain;
+
+import java.math.BigDecimal;
+import java.util.Date;
+import com.fasterxml.jackson.annotation.JsonFormat;
+import org.apache.commons.lang3.builder.ToStringBuilder;
+import org.apache.commons.lang3.builder.ToStringStyle;
+import com.zehong.common.annotation.Excel;
+import com.zehong.common.core.domain.BaseEntity;
+
+/**
+ * 燃气隐患对象 t_hidden_trouble_info
+ * 
+ * @author zehong
+ * @date 2022-03-24
+ */
+public class THiddenTroubleInfo extends BaseEntity
+{
+    private static final long serialVersionUID = 1L;
+
+    /** 隐患id */
+    private Long hiddenTroubleId;
+
+    /** 巡检任务id */
+    @Excel(name = "巡检任务id")
+    private Long workId;
+
+    /** 隐患名称 */
+    @Excel(name = "隐患名称")
+    private String hiddenTroubleName;
+
+    /** 隐患等级: 1.I级 2.II级 3.III级 */
+    @Excel(name = "隐患等级: 1.I级 2.II级 3.III级")
+    private String hiddenTroubleLevel;
+
+    /** 隐患类型: 1.漏气 2.腐蚀 3.裂缝 4.设备故障 5.安全距离不足 6.管道承重 7.其他 */
+    @Excel(name = "隐患类型: 1.漏气 2.腐蚀 3.裂缝 4.设备故障 5.安全距离不足 6.管道承重 7.其他")
+    private String hiddenTroubleType;
+
+    /** 经度 */
+    @Excel(name = "经度")
+    private BigDecimal longitude;
+
+    /** 纬度 */
+    @Excel(name = "纬度")
+    private BigDecimal latitude;
+
+    /** 图片地址 */
+    @Excel(name = "图片地址")
+    private String pictureUrl;
+
+    /** 隐患描述 */
+    @Excel(name = "隐患描述")
+    private String hiddenTroubleDescribe;
+
+    /** 上报时间 */
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    @Excel(name = "上报时间", width = 30, dateFormat = "yyyy-MM-dd HH:mm:ss")
+    private Date reportTime;
+
+    /** 上报人 */
+    @Excel(name = "上报人")
+    private String reportPerson;
+
+    /** 隐患处理状态: 1.待处理 2.处理中 3.已完成 */
+    @Excel(name = "隐患处理状态: 1.待处理 2.处理中 3.已完成")
+    private String hiddenTroubleDealStatus;
+
+    /** 隐患处理情况 */
+    @Excel(name = "隐患处理情况")
+    private String hiddenTroubleDealCondition;
+
+    /** 隐患处理完成时间 */
+    @JsonFormat(pattern = "yyyy-MM-dd")
+    @Excel(name = "隐患处理完成时间", width = 30, dateFormat = "yyyy-MM-dd")
+    private Date hiddenTroubleDealFinishTime;
+
+    /** 是否删除(0正常，1删除) */
+    @Excel(name = "是否删除(0正常，1删除)")
+    private String isDel;
+
+    /** 备注 */
+    @Excel(name = "备注")
+    private String remarks;
+
+    public void setHiddenTroubleId(Long hiddenTroubleId) 
+    {
+        this.hiddenTroubleId = hiddenTroubleId;
+    }
+
+    public Long getHiddenTroubleId() 
+    {
+        return hiddenTroubleId;
+    }
+    public void setWorkId(Long workId) 
+    {
+        this.workId = workId;
+    }
+
+    public Long getWorkId() 
+    {
+        return workId;
+    }
+    public void setHiddenTroubleName(String hiddenTroubleName) 
+    {
+        this.hiddenTroubleName = hiddenTroubleName;
+    }
+
+    public String getHiddenTroubleName() 
+    {
+        return hiddenTroubleName;
+    }
+    public void setHiddenTroubleLevel(String hiddenTroubleLevel) 
+    {
+        this.hiddenTroubleLevel = hiddenTroubleLevel;
+    }
+
+    public String getHiddenTroubleLevel() 
+    {
+        return hiddenTroubleLevel;
+    }
+    public void setHiddenTroubleType(String hiddenTroubleType) 
+    {
+        this.hiddenTroubleType = hiddenTroubleType;
+    }
+
+    public String getHiddenTroubleType() 
+    {
+        return hiddenTroubleType;
+    }
+    public void setLongitude(BigDecimal longitude) 
+    {
+        this.longitude = longitude;
+    }
+
+    public BigDecimal getLongitude() 
+    {
+        return longitude;
+    }
+    public void setLatitude(BigDecimal latitude) 
+    {
+        this.latitude = latitude;
+    }
+
+    public BigDecimal getLatitude() 
+    {
+        return latitude;
+    }
+    public void setPictureUrl(String pictureUrl) 
+    {
+        this.pictureUrl = pictureUrl;
+    }
+
+    public String getPictureUrl() 
+    {
+        return pictureUrl;
+    }
+    public void setHiddenTroubleDescribe(String hiddenTroubleDescribe) 
+    {
+        this.hiddenTroubleDescribe = hiddenTroubleDescribe;
+    }
+
+    public String getHiddenTroubleDescribe() 
+    {
+        return hiddenTroubleDescribe;
+    }
+    public void setReportTime(Date reportTime) 
+    {
+        this.reportTime = reportTime;
+    }
+
+    public Date getReportTime() 
+    {
+        return reportTime;
+    }
+    public void setReportPerson(String reportPerson) 
+    {
+        this.reportPerson = reportPerson;
+    }
+
+    public String getReportPerson() 
+    {
+        return reportPerson;
+    }
+    public void setHiddenTroubleDealStatus(String hiddenTroubleDealStatus) 
+    {
+        this.hiddenTroubleDealStatus = hiddenTroubleDealStatus;
+    }
+
+    public String getHiddenTroubleDealStatus() 
+    {
+        return hiddenTroubleDealStatus;
+    }
+    public void setHiddenTroubleDealCondition(String hiddenTroubleDealCondition) 
+    {
+        this.hiddenTroubleDealCondition = hiddenTroubleDealCondition;
+    }
+
+    public String getHiddenTroubleDealCondition() 
+    {
+        return hiddenTroubleDealCondition;
+    }
+    public void setHiddenTroubleDealFinishTime(Date hiddenTroubleDealFinishTime) 
+    {
+        this.hiddenTroubleDealFinishTime = hiddenTroubleDealFinishTime;
+    }
+
+    public Date getHiddenTroubleDealFinishTime() 
+    {
+        return hiddenTroubleDealFinishTime;
+    }
+    public void setIsDel(String isDel) 
+    {
+        this.isDel = isDel;
+    }
+
+    public String getIsDel() 
+    {
+        return isDel;
+    }
+    public void setRemarks(String remarks) 
+    {
+        this.remarks = remarks;
+    }
+
+    public String getRemarks() 
+    {
+        return remarks;
+    }
+
+    @Override
+    public String toString() {
+        return new ToStringBuilder(this,ToStringStyle.MULTI_LINE_STYLE)
+            .append("hiddenTroubleId", getHiddenTroubleId())
+            .append("workId", getWorkId())
+            .append("hiddenTroubleName", getHiddenTroubleName())
+            .append("hiddenTroubleLevel", getHiddenTroubleLevel())
+            .append("hiddenTroubleType", getHiddenTroubleType())
+            .append("longitude", getLongitude())
+            .append("latitude", getLatitude())
+            .append("pictureUrl", getPictureUrl())
+            .append("hiddenTroubleDescribe", getHiddenTroubleDescribe())
+            .append("reportTime", getReportTime())
+            .append("reportPerson", getReportPerson())
+            .append("hiddenTroubleDealStatus", getHiddenTroubleDealStatus())
+            .append("hiddenTroubleDealCondition", getHiddenTroubleDealCondition())
+            .append("hiddenTroubleDealFinishTime", getHiddenTroubleDealFinishTime())
+            .append("isDel", getIsDel())
+            .append("remarks", getRemarks())
+            .toString();
+    }
+}

gassafetyprogress-system/src/main/java/com/zehong/system/domain/TWorkOrder.java

 package com.zehong.system.domain;
 
 import java.util.Date;
+import java.util.List;
+
 import com.fasterxml.jackson.annotation.JsonFormat;
 import org.apache.commons.lang3.builder.ToStringBuilder;
 import org.apache.commons.lang3.builder.ToStringStyle;
@@ -106,7 +108,20 @@ public class TWorkOrder extends BaseEntity
     @Excel(name = "备注")
     private String remarks;
 
-    public void setWorkId(Long workId) 
+    /**
+     * 隐患信息
+     */
+    private List<THiddenTroubleInfo> hiddenList;
+
+    public List<THiddenTroubleInfo> getHiddenList() {
+        return hiddenList;
+    }
+
+    public void setHiddenList(List<THiddenTroubleInfo> hiddenList) {
+        this.hiddenList = hiddenList;
+    }
+
+    public void setWorkId(Long workId)
     {
         this.workId = workId;
     }

gassafetyprogress-system/src/main/java/com/zehong/system/mapper/THiddenTroubleInfoMapper.java

+package com.zehong.system.mapper;
+
+import java.util.List;
+import com.zehong.system.domain.THiddenTroubleInfo;
+
+/**
+ * 燃气隐患Mapper接口
+ * 
+ * @author zehong
+ * @date 2022-03-24
+ */
+public interface THiddenTroubleInfoMapper 
+{
+    /**
+     * 查询燃气隐患
+     * 
+     * @param hiddenTroubleId 燃气隐患ID
+     * @return 燃气隐患
+     */
+    public THiddenTroubleInfo selectTHiddenTroubleInfoById(Long hiddenTroubleId);
+
+    /**
+     * 查询燃气隐患列表
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 燃气隐患集合
+     */
+    public List<THiddenTroubleInfo> selectTHiddenTroubleInfoList(THiddenTroubleInfo tHiddenTroubleInfo);
+
+    /**
+     * 新增燃气隐患
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 结果
+     */
+    public int insertTHiddenTroubleInfo(THiddenTroubleInfo tHiddenTroubleInfo);
+
+    /**
+     * 修改燃气隐患
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 结果
+     */
+    public int updateTHiddenTroubleInfo(THiddenTroubleInfo tHiddenTroubleInfo);
+
+    /**
+     * 删除燃气隐患
+     * 
+     * @param hiddenTroubleId 燃气隐患ID
+     * @return 结果
+     */
+    public int deleteTHiddenTroubleInfoById(Long hiddenTroubleId);
+
+    /**
+     * 批量删除燃气隐患
+     * 
+     * @param hiddenTroubleIds 需要删除的数据ID
+     * @return 结果
+     */
+    public int deleteTHiddenTroubleInfoByIds(Long[] hiddenTroubleIds);
+}

gassafetyprogress-system/src/main/java/com/zehong/system/service/ITHiddenTroubleInfoService.java

+package com.zehong.system.service;
+
+import java.util.List;
+import com.zehong.system.domain.THiddenTroubleInfo;
+
+/**
+ * 燃气隐患Service接口
+ * 
+ * @author zehong
+ * @date 2022-03-24
+ */
+public interface ITHiddenTroubleInfoService 
+{
+    /**
+     * 查询燃气隐患
+     * 
+     * @param hiddenTroubleId 燃气隐患ID
+     * @return 燃气隐患
+     */
+    public THiddenTroubleInfo selectTHiddenTroubleInfoById(Long hiddenTroubleId);
+
+    /**
+     * 查询燃气隐患列表
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 燃气隐患集合
+     */
+    public List<THiddenTroubleInfo> selectTHiddenTroubleInfoList(THiddenTroubleInfo tHiddenTroubleInfo);
+
+    /**
+     * 新增燃气隐患
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 结果
+     */
+    public int insertTHiddenTroubleInfo(THiddenTroubleInfo tHiddenTroubleInfo);
+
+    /**
+     * 修改燃气隐患
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 结果
+     */
+    public int updateTHiddenTroubleInfo(THiddenTroubleInfo tHiddenTroubleInfo);
+
+    /**
+     * 批量删除燃气隐患
+     * 
+     * @param hiddenTroubleIds 需要删除的燃气隐患ID
+     * @return 结果
+     */
+    public int deleteTHiddenTroubleInfoByIds(Long[] hiddenTroubleIds);
+
+    /**
+     * 删除燃气隐患信息
+     * 
+     * @param hiddenTroubleId 燃气隐患ID
+     * @return 结果
+     */
+    public int deleteTHiddenTroubleInfoById(Long hiddenTroubleId);
+}

gassafetyprogress-system/src/main/java/com/zehong/system/service/impl/THiddenTroubleInfoServiceImpl.java

+package com.zehong.system.service.impl;
+
+import java.util.List;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+import com.zehong.system.mapper.THiddenTroubleInfoMapper;
+import com.zehong.system.domain.THiddenTroubleInfo;
+import com.zehong.system.service.ITHiddenTroubleInfoService;
+import org.springframework.transaction.annotation.Transactional;
+
+/**
+ * 燃气隐患Service业务层处理
+ * 
+ * @author zehong
+ * @date 2022-03-24
+ */
+@Service
+public class THiddenTroubleInfoServiceImpl implements ITHiddenTroubleInfoService 
+{
+    @Autowired
+    private THiddenTroubleInfoMapper tHiddenTroubleInfoMapper;
+
+    /**
+     * 查询燃气隐患
+     * 
+     * @param hiddenTroubleId 燃气隐患ID
+     * @return 燃气隐患
+     */
+    @Override
+    public THiddenTroubleInfo selectTHiddenTroubleInfoById(Long hiddenTroubleId)
+    {
+        return tHiddenTroubleInfoMapper.selectTHiddenTroubleInfoById(hiddenTroubleId);
+    }
+
+    /**
+     * 查询燃气隐患列表
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 燃气隐患
+     */
+    @Override
+    public List<THiddenTroubleInfo> selectTHiddenTroubleInfoList(THiddenTroubleInfo tHiddenTroubleInfo)
+    {
+        return tHiddenTroubleInfoMapper.selectTHiddenTroubleInfoList(tHiddenTroubleInfo);
+    }
+
+    /**
+     * 新增燃气隐患
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 结果
+     */
+    @Override
+    @Transactional(rollbackFor= Exception.class)
+    public int insertTHiddenTroubleInfo(THiddenTroubleInfo tHiddenTroubleInfo)
+    {
+        return tHiddenTroubleInfoMapper.insertTHiddenTroubleInfo(tHiddenTroubleInfo);
+    }
+
+    /**
+     * 修改燃气隐患
+     * 
+     * @param tHiddenTroubleInfo 燃气隐患
+     * @return 结果
+     */
+    @Override
+    public int updateTHiddenTroubleInfo(THiddenTroubleInfo tHiddenTroubleInfo)
+    {
+        return tHiddenTroubleInfoMapper.updateTHiddenTroubleInfo(tHiddenTroubleInfo);
+    }
+
+    /**
+     * 批量删除燃气隐患
+     * 
+     * @param hiddenTroubleIds 需要删除的燃气隐患ID
+     * @return 结果
+     */
+    @Override
+    public int deleteTHiddenTroubleInfoByIds(Long[] hiddenTroubleIds)
+    {
+        return tHiddenTroubleInfoMapper.deleteTHiddenTroubleInfoByIds(hiddenTroubleIds);
+    }
+
+    /**
+     * 删除燃气隐患信息
+     * 
+     * @param hiddenTroubleId 燃气隐患ID
+     * @return 结果
+     */
+    @Override
+    public int deleteTHiddenTroubleInfoById(Long hiddenTroubleId)
+    {
+        return tHiddenTroubleInfoMapper.deleteTHiddenTroubleInfoById(hiddenTroubleId);
+    }
+}

gassafetyprogress-system/src/main/resources/mapper/system/THiddenTroubleInfoMapper.xml

+<?xml version="1.0" encoding="UTF-8" ?>
+<!DOCTYPE mapper
+PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
+"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
+<mapper namespace="com.zehong.system.mapper.THiddenTroubleInfoMapper">
+    
+    <resultMap type="THiddenTroubleInfo" id="THiddenTroubleInfoResult">
+        <result property="hiddenTroubleId"    column="hidden_trouble_id"    />
+        <result property="workId"    column="work_id"    />
+        <result property="hiddenTroubleName"    column="hidden_trouble_name"    />
+        <result property="hiddenTroubleLevel"    column="hidden_trouble_level"    />
+        <result property="hiddenTroubleType"    column="hidden_trouble_type"    />
+        <result property="longitude"    column="longitude"    />
+        <result property="latitude"    column="latitude"    />
+        <result property="pictureUrl"    column="picture_url"    />
+        <result property="hiddenTroubleDescribe"    column="hidden_trouble_describe"    />
+        <result property="reportTime"    column="report_time"    />
+        <result property="reportPerson"    column="report_person"    />
+        <result property="hiddenTroubleDealStatus"    column="hidden_trouble_deal_status"    />
+        <result property="hiddenTroubleDealCondition"    column="hidden_trouble_deal_condition"    />
+        <result property="hiddenTroubleDealFinishTime"    column="hidden_trouble_deal_finish_time"    />
+        <result property="isDel"    column="is_del"    />
+        <result property="remarks"    column="remarks"    />
+    </resultMap>
+
+    <sql id="selectTHiddenTroubleInfoVo">
+        select hidden_trouble_id, work_id, hidden_trouble_name, hidden_trouble_level, hidden_trouble_type, longitude, latitude, picture_url, hidden_trouble_describe, report_time, (select u.user_name from sys_user u where u.user_id = report_person) AS report_person, hidden_trouble_deal_status, hidden_trouble_deal_condition, hidden_trouble_deal_finish_time, is_del, remarks from t_hidden_trouble_info
+    </sql>
+
+    <select id="selectTHiddenTroubleInfoList" parameterType="THiddenTroubleInfo" resultMap="THiddenTroubleInfoResult">
+        <include refid="selectTHiddenTroubleInfoVo"/>
+        <where>  
+            <if test="workId != null "> and work_id = #{workId}</if>
+            <if test="hiddenTroubleName != null  and hiddenTroubleName != ''"> and hidden_trouble_name like concat('%', #{hiddenTroubleName}, '%')</if>
+            <if test="hiddenTroubleLevel != null  and hiddenTroubleLevel != ''"> and hidden_trouble_level = #{hiddenTroubleLevel}</if>
+            <if test="hiddenTroubleType != null  and hiddenTroubleType != ''"> and hidden_trouble_type = #{hiddenTroubleType}</if>
+            <if test="longitude != null "> and longitude = #{longitude}</if>
+            <if test="latitude != null "> and latitude = #{latitude}</if>
+            <if test="pictureUrl != null  and pictureUrl != ''"> and picture_url = #{pictureUrl}</if>
+            <if test="hiddenTroubleDescribe != null  and hiddenTroubleDescribe != ''"> and hidden_trouble_describe = #{hiddenTroubleDescribe}</if>
+            <if test="reportTime != null "> and report_time = #{reportTime}</if>
+            <if test="reportPerson != null  and reportPerson != ''"> and report_person = #{reportPerson}</if>
+            <if test="hiddenTroubleDealStatus != null  and hiddenTroubleDealStatus != ''"> and hidden_trouble_deal_status = #{hiddenTroubleDealStatus}</if>
+            <if test="hiddenTroubleDealCondition != null  and hiddenTroubleDealCondition != ''"> and hidden_trouble_deal_condition = #{hiddenTroubleDealCondition}</if>
+            <if test="hiddenTroubleDealFinishTime != null "> and hidden_trouble_deal_finish_time = #{hiddenTroubleDealFinishTime}</if>
+            <if test="isDel != null  and isDel != ''"> and is_del = #{isDel}</if>
+            <if test="remarks != null  and remarks != ''"> and remarks = #{remarks}</if>
+        </where>
+    </select>
+    
+    <select id="selectTHiddenTroubleInfoById" parameterType="Long" resultMap="THiddenTroubleInfoResult">
+        <include refid="selectTHiddenTroubleInfoVo"/>
+        where hidden_trouble_id = #{hiddenTroubleId}
+    </select>
+        
+    <insert id="insertTHiddenTroubleInfo" parameterType="THiddenTroubleInfo" useGeneratedKeys="true" keyProperty="hiddenTroubleId">
+        insert into t_hidden_trouble_info
+        <trim prefix="(" suffix=")" suffixOverrides=",">
+            <if test="workId != null">work_id,</if>
+            <if test="hiddenTroubleName != null">hidden_trouble_name,</if>
+            <if test="hiddenTroubleLevel != null">hidden_trouble_level,</if>
+            <if test="hiddenTroubleType != null">hidden_trouble_type,</if>
+            <if test="longitude != null">longitude,</if>
+            <if test="latitude != null">latitude,</if>
+            <if test="pictureUrl != null">picture_url,</if>
+            <if test="hiddenTroubleDescribe != null">hidden_trouble_describe,</if>
+            <if test="reportTime != null">report_time,</if>
+            <if test="reportPerson != null">report_person,</if>
+            <if test="hiddenTroubleDealStatus != null">hidden_trouble_deal_status,</if>
+            <if test="hiddenTroubleDealCondition != null">hidden_trouble_deal_condition,</if>
+            <if test="hiddenTroubleDealFinishTime != null">hidden_trouble_deal_finish_time,</if>
+            <if test="isDel != null">is_del,</if>
+            <if test="remarks != null">remarks,</if>
+         </trim>
+        <trim prefix="values (" suffix=")" suffixOverrides=",">
+            <if test="workId != null">#{workId},</if>
+            <if test="hiddenTroubleName != null">#{hiddenTroubleName},</if>
+            <if test="hiddenTroubleLevel != null">#{hiddenTroubleLevel},</if>
+            <if test="hiddenTroubleType != null">#{hiddenTroubleType},</if>
+            <if test="longitude != null">#{longitude},</if>
+            <if test="latitude != null">#{latitude},</if>
+            <if test="pictureUrl != null">#{pictureUrl},</if>
+            <if test="hiddenTroubleDescribe != null">#{hiddenTroubleDescribe},</if>
+            <if test="reportTime != null">#{reportTime},</if>
+            <if test="reportPerson != null">#{reportPerson},</if>
+            <if test="hiddenTroubleDealStatus != null">#{hiddenTroubleDealStatus},</if>
+            <if test="hiddenTroubleDealCondition != null">#{hiddenTroubleDealCondition},</if>
+            <if test="hiddenTroubleDealFinishTime != null">#{hiddenTroubleDealFinishTime},</if>
+            <if test="isDel != null">#{isDel},</if>
+            <if test="remarks != null">#{remarks},</if>
+         </trim>
+    </insert>
+
+    <update id="updateTHiddenTroubleInfo" parameterType="THiddenTroubleInfo">
+        update t_hidden_trouble_info
+        <trim prefix="SET" suffixOverrides=",">
+            <if test="workId != null">work_id = #{workId},</if>
+            <if test="hiddenTroubleName != null">hidden_trouble_name = #{hiddenTroubleName},</if>
+            <if test="hiddenTroubleLevel != null">hidden_trouble_level = #{hiddenTroubleLevel},</if>
+            <if test="hiddenTroubleType != null">hidden_trouble_type = #{hiddenTroubleType},</if>
+            <if test="longitude != null">longitude = #{longitude},</if>
+            <if test="latitude != null">latitude = #{latitude},</if>
+            <if test="pictureUrl != null">picture_url = #{pictureUrl},</if>
+            <if test="hiddenTroubleDescribe != null">hidden_trouble_describe = #{hiddenTroubleDescribe},</if>
+            <if test="reportTime != null">report_time = #{reportTime},</if>
+            <if test="reportPerson != null">report_person = #{reportPerson},</if>
+            <if test="hiddenTroubleDealStatus != null">hidden_trouble_deal_status = #{hiddenTroubleDealStatus},</if>
+            <if test="hiddenTroubleDealCondition != null">hidden_trouble_deal_condition = #{hiddenTroubleDealCondition},</if>
+            <if test="hiddenTroubleDealFinishTime != null">hidden_trouble_deal_finish_time = #{hiddenTroubleDealFinishTime},</if>
+            <if test="isDel != null">is_del = #{isDel},</if>
+            <if test="remarks != null">remarks = #{remarks},</if>
+        </trim>
+        where hidden_trouble_id = #{hiddenTroubleId}
+    </update>
+
+    <delete id="deleteTHiddenTroubleInfoById" parameterType="Long">
+        delete from t_hidden_trouble_info where hidden_trouble_id = #{hiddenTroubleId}
+    </delete>
+
+    <delete id="deleteTHiddenTroubleInfoByIds" parameterType="String">
+        delete from t_hidden_trouble_info where hidden_trouble_id in 
+        <foreach item="hiddenTroubleId" collection="array" open="(" separator="," close=")">
+            #{hiddenTroubleId}
+        </foreach>
+    </delete>
+</mapper>
\ No newline at end of file

gassafetyprogress-web/src/api/operationMonitor/hiddenTrouble.js

+import request from '@/utils/request'
+
+// 查询燃气隐患列表
+export function listInfo(query) {
+  return request({
+    url: '/system/info/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询燃气隐患
+export function hiddenTroubleList(query) {
+  return request({
+    url: '/system/info/hiddenTroubleList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询燃气隐患详细
+export function getInfo(hiddenTroubleId) {
+  return request({
+    url: '/system/info/' + hiddenTroubleId,
+    method: 'get'
+  })
+}
+
+// 新增燃气隐患
+export function addInfo(data) {
+  return request({
+    url: '/system/info',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改燃气隐患
+export function updateInfo(data) {
+  return request({
+    url: '/system/info',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除燃气隐患
+export function delInfo(hiddenTroubleId) {
+  return request({
+    url: '/system/info/' + hiddenTroubleId,
+    method: 'delete'
+  })
+}
+
+// 导出燃气隐患
+export function exportInfo(query) {
+  return request({
+    url: '/system/info/export',
+    method: 'get',
+    params: query
+  })
+}

gassafetyprogress-web/src/assets/iconfont/monitorData/iconfont.css

+@font-face {
+  font-family: "iconfont"; /* Project id 3276749 */
+  src: url('iconfont.woff2?t=1648286292510') format('woff2'),
+       url('iconfont.woff?t=1648286292510') format('woff'),
+       url('iconfont.ttf?t=1648286292510') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-jt:before {
+  content: "\e8f1";
+}
+
+.icon-tcq:before {
+  content: "\e622";
+}
+
+.icon-ylb:before {
+  content: "\e623";
+}
+
+.icon-llj:before {
+  content: "\e624";
+}
+
+.icon-a:before {
+  content: "\e61e";
+}
+
+.icon-b:before {
+  content: "\e61f";
+}
+

gassafetyprogress-web/src/assets/styles/all.scss

@@ -675,3 +675,9 @@
 .amap-copyright {
   opacity:0;
 }
+
+.zzz {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
\ No newline at end of file

gassafetyprogress-web/src/components/FileInfoUpload/index.vue

@@ -19,7 +19,7 @@
       ref="upload"
     >
       <!-- 上传按钮 -->
-       <el-button plain type="primary">选取文件</el-button>
+       <el-button plain type="primary" @click="deleteFile()">选取文件</el-button>
       <!--<i class="el-icon-plus"></i>-->
       <!-- 上传提示 -->
       <div class="el-upload__tip" slot="tip" v-if="showTip">
@@ -109,6 +109,11 @@
       };
     },
     computed: {
+      deleteFile(){
+        this.fileList=[]
+        this.addShow =  false;
+        this.$emit("remove", 1);
+      },
       // 是否显示提示
       showTip() {
         return this.isShowTip && (this.fileType || this.fileSize);

gassafetyprogress-web/src/components/FileSuperviseUpload/index.vue

@@ -9,17 +9,17 @@
       :on-error="handleUploadError"
       :on-exceed="handleExceed"
       :on-success="handleUploadSuccess"
-      :on-remove="handleRemove"
       :on-preview="handleFileClick"
       :on-change="fileChange"
       :show-file-list="true"
+      :on-remove="handleRemove"
       :headers="headers"
       class="upload-file-uploader"
       :class="{ hide: fileArr.length>0 ||addShow }"
       ref="upload"
     >
       <!-- 上传按钮 -->
-       <el-button plain type="primary">选取文件</el-button>
+       <el-button plain type="primary" @click="deleteFile()">选取文件</el-button>
       <!--<i class="el-icon-plus"></i>-->
       <!-- 上传提示 -->
       <div class="el-upload__tip" slot="tip" v-if="showTip">
@@ -109,6 +109,11 @@
       };
     },
     computed: {
+      deleteFile(){
+        this.fileList=[]
+        this.addShow =  false;
+        this.$emit("remove", 1);
+      },
       // 是否显示提示
       showTip() {
         return this.isShowTip && (this.fileType || this.fileSize);

gassafetyprogress-web/src/components/GetPos/index.vue

@@ -13,6 +13,7 @@
     :visible.sync="dialogVisible"
     width="60%"
     :before-close="handleClose"
+    append-to-body
   >
     <template v-if="inputVisible">
       <div class="search-wrapper pos">

gassafetyprogress-web/src/layout/components/Navbar.vue

@@ -11,30 +11,11 @@
           <!--<img src="@/assets/xiaoxi.png" :hidden="xiaohidden" style="height: 40px;width: 40px;margin-top: 5px;cursor: pointer;">-->
         <!--</div>-->
         <!-- <search id="header-search" class="right-menu-item" /> -->
-<!--          <el-badge :value="total" :max="99" class="item" >-->
-<!--            <i class="el-icon-chat-dot-round" style="width: 10px;height: 10px;" ></i>-->
-<!--          </el-badge>-->
+          <el-badge :value="total" :max="99" class="item" >
+            <i class="el-icon-chat-dot-round" style="width: 10px;height: 10px;" @click="$router.push('/emergency/emergency')"></i>
+          </el-badge>
+
 
-        <el-dropdown class="avatar-container right-menu-item hover-effect" style="margin-right: 0px" trigger="click">
-          <div class="avatar-wrapper" >
-              <el-badge :value="total" :max="99" class="item" >
-               <i class="el-icon-chat-dot-round" style="width: 10px;height: 10px;" ></i>
-               </el-badge>
-          </div>
-          <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item v-if="total==0">
-              <span>暂无消息</span>
-            </el-dropdown-item>
-            <div v-for="(item,index) in receivedList" >
-              <el-dropdown-item v-if="index==0" @click.native="openMassage(item.id,item.eventName)">
-                  <span>您有新消息：{{item.eventName}}</span>
-              </el-dropdown-item>
-              <el-dropdown-item v-if="index>0"  divided @click.native="openMassage(item.id,item.eventName)">
-                <span>您有新消息：{{item.eventName}}</span>
-              </el-dropdown-item>
-            </div>
-          </el-dropdown-menu>
-        </el-dropdown>
         <screenfull id="screenfull" class="right-menu-item hover-effect" />
 
         <!-- <el-tooltip content="布局大小" effect="dark" placement="bottom">
@@ -65,7 +46,7 @@
 </template>
 
 <script>
-import { mapGetters,mapMutations  } from 'vuex'
+import { mapGetters } from 'vuex'
 import Breadcrumb from '@/components/Breadcrumb'
 import TopNav from '@/components/TopNav'
 import Hamburger from '@/components/Hamburger'
@@ -88,15 +69,13 @@ export default {
       userType:-2,
       total:null,
       xiaohidden:false,
-      receivedList:[],
-      routerPath:"",
     }
   },
   computed: {
     ...mapGetters([
       'sidebar',
       'avatar',
-      'device',
+      'device'
     ]),
     setting: {
       get() {
@@ -116,23 +95,34 @@ export default {
     }
   },
 mounted(){
-
-  getUserProfile().then(response => {
-    this.userType = response.data.deptId;
-    if(this.userType!=-2){
-      this.queryParams.enterpriseId = response.data.deptId;
-    }
-    this.getList();
-  });
-    this.socket();
+      getUserProfile().then(response => {
+        this.userType = response.data.deptId;
+      });
+    //定时检测新消息
+    setInterval(() => {
+            var params = {
+                  pageNum: 1,
+                    pageSize: 100,
+                    status:5,
+                    enterpriseId:this.userType
+                };
+          if(this.userType==-2){
+            params.governmentRead=0;
+            params.enterpriseId=null;
+          }else {
+            params.companyRead=0
+          }
+          listReceive(params).then(response => {
+              if(response.total!=0){
+                  this.total= response.total;
+              }else{
+                  this.total= "";
+              }
+
+          });
+      }, 5000);
   },
   methods: {
-  ...mapMutations({
-        SET_EMERGENCY:"bigWindowCompany/SET_EMERGENCY"
-    }
-
-    ),
-
     toggleSideBar() {
       this.$store.dispatch('app/toggleSideBar')
     },
@@ -146,61 +136,6 @@ mounted(){
           location.href = '/index';
         })
       }).catch(() => {});
-    },
-    openMassage(id,title){
-      //this.$router.push('/emergency/emergency?eventid='+id);
-      this.routerPath="/emergency/emergency";
-      if(window.location.pathname==this.routerPath){
-        // this.$parent.showDetail(id,title);
-        this.SET_EMERGENCY({
-          eventId:id,
-          eventName:title,
-        })
-      }else {
-        this.$router.push({path: this.routerPath,query:{eventId:id,eventName:title}});
-      }
-
-    },
-    socket() {
-      console.log("socket执行");
-      this.ws = new WebSocket(
-        "ws://192.168.2.17:8903/gassafety/websocketServer"
-      );
-      this.ws.onopen = (evt) => {
-        console.log("WebSockets开启");
-      };
-      this.ws.onmessage = (evt) => {
-        console.log("推送", evt);
-        const obj = JSON.parse(evt.data);
-        console.log("接受socketobj", obj);
-        this.getList();
-      };
-      this.ws.onclose = () => {
-        console.log("ws协议关闭");
-      };
-    },
-    getList(){
-      console.log(this.userType)
-      var params = {
-        pageNum: 1,
-        pageSize: 100,
-        status:5,
-        enterpriseId:this.userType
-      };
-      if(this.userType==-2){
-        params.governmentRead=0;
-        params.enterpriseId=null;
-      }else {
-        params.companyRead=0
-      }
-      listReceive(params).then(response => {
-          this.receivedList = response.rows;
-          if(response.total!=0){
-            this.total= response.total;
-          }else{
-            this.total= "";
-          }
-      });
     }
   }
 }

gassafetyprogress-web/src/views/inspectionWork/workOrder/components/HiddenTrouble.vue

+<template>
+  <div class="hidden">
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="small"
+          @click="handleAdd"
+          v-if="!isView"
+        >新增隐患信息</el-button>
+      </el-col>
+    </el-row>
+    <!--隐患信息-->
+    <el-table :data="hiddenList">
+      <el-table-column label="隐患名称" align="center" prop="hiddenTroubleName" />
+      <el-table-column label="隐患等级" align="center" prop="hiddenTroubleLevel">
+        <template slot-scope="scope">
+          <span v-if="scope.row.hiddenTroubleLevel == '1'">I级</span>
+          <span v-if="scope.row.hiddenTroubleLevel == '2'">II级</span>
+          <span v-if="scope.row.hiddenTroubleLevel == '3'">III级</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="隐患类型" align="center" prop="hiddenTroubleType">
+        <template slot-scope="scope">
+          <span v-if="item.dictValue == scope.row.hiddenTroubleType" v-for="item in hiddenTroubleOptions" :key="item.dictValue">
+            {{ item.dictLabel }}
+          </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="隐患图片" align="center" prop="pictureUrl">
+        <template slot-scope="scope">
+          <el-image :src="scope.row.pictureUrl"  :preview-src-list="[scope.row.pictureUrl]" v-if="scope.row.pictureUrl != '' && scope.row.pictureUrl != null" :z-index=5000 style="width: auto;height: auto;"></el-image>
+        </template>
+      </el-table-column>
+      <el-table-column label="上报时间" align="center" prop="reportTime" width="150">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.reportTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="上报人" align="center" prop="reportPersonName" />
+      <el-table-column label="处理状态" align="center" prop="hiddenTroubleDealStatus">
+        <template slot-scope="scope">
+          <span v-if="scope.row.hiddenTroubleDealStatus == '1'">待处理</span>
+          <span v-if="scope.row.hiddenTroubleDealStatus == '2'">处理中</span>
+          <span v-if="scope.row.hiddenTroubleDealStatus == '3'">已完成</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row,scope.$index)"
+            v-if="isView"
+          >详情</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row,scope.$index)"
+            v-if="!isView"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-if="!isView"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 添加或修改燃气隐患对话框 -->
+    <el-dialog :title="title" :visible.sync="hiddenOpen" width="900px" append-to-body destroy-on-close @close="cancel">
+      <el-form ref="hiddenForm" :model="hiddenForm" :rules="rules" label-width="100px">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="隐患名称" prop="hiddenTroubleName">
+              <el-input v-model="hiddenForm.hiddenTroubleName" placeholder="请输入隐患名称" :disabled="isView"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="隐患等级" prop="hiddenTroubleLevel">
+              <el-select v-model="hiddenForm.hiddenTroubleLevel" placeholder="请选择隐患类型" style="width: 330px" :disabled="isView">
+                <el-option label="I级" value="1" />
+                <el-option label="II级" value="2" />
+                <el-option label="III级" value="3" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="隐患类型" prop="hiddenTroubleType">
+          <el-select v-model="hiddenForm.hiddenTroubleType" placeholder="请选择隐患类型" style="width: 330px" :disabled="isView">
+            <el-option
+              v-for="dict in hiddenTroubleOptions"
+              :key="dict.dictValue"
+              :label="dict.dictLabel"
+              :value="dict.dictValue"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="经纬度坐标" prop="longitude">
+              <el-col :span="8">
+                <el-input v-model="hiddenForm.longitude" placeholder="请输入经度" :disabled="isView"/>
+              </el-col>
+              <el-col :span="8" style="margin-left: 20px">
+                <el-input v-model="hiddenForm.latitude" placeholder="请输入纬度" :disabled="isView"/>
+              </el-col>
+              <el-col :span="4" style="margin-left: 30px">
+                <el-button type="primary" plain @click="MapdialogFun" v-if="!isView">选择经纬度</el-button>
+              </el-col>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="图片地址" prop="pictureUrl">
+          <MyFileUpload
+            listType="picture-card"
+            @resFun="getFileInfo"
+            @remove="listRemove"
+            :fileArr="fileList"
+            v-if="!isView"
+          />
+          <div style="width: 20%;" v-if="isView">
+            <el-image :src="hiddenForm.pictureUrl" :preview-src-list="[hiddenForm.pictureUrl]" style="width: auto;height: auto;" :z-index= "3000"></el-image>
+          </div>
+          <el-input v-show="false" disabled v-model="hiddenForm.pictureUrl"></el-input>
+        </el-form-item>
+        <el-form-item label="隐患描述" prop="hiddenTroubleDescribe">
+          <el-input v-model="hiddenForm.hiddenTroubleDescribe" type="textarea" placeholder="请输入隐患描述" :disabled="isView"/>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm" v-if="!isView">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+    <GetPos
+      :dialogVisible.sync="dialogTableVisibles"
+      device=""
+      :devicePos="devicePos"
+      @close="dialogcancelFun"
+      @getPath="getPath"
+      style="z-index: 3000"
+    />
+  </div>
+</template>
+
+<script>
+import MyFileUpload from '@/components/MyFileUpload';
+import GetPos from '@/components/GetPos';
+import moment from "moment";
+export default {
+  name: "HiddenTrouble",
+  components: {
+    MyFileUpload,
+    GetPos
+  },
+  props:{
+    // 燃气隐患表格数据
+    hiddenList:{
+      type:Array
+    },
+    workId:{
+      type:Number
+    },
+    //是否为查看
+    isView:{
+      type:Boolean,
+      default:true
+    }
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 燃气隐患表格数据
+     /* infoList: [],*/
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      hiddenOpen: false,
+      // 表单参数
+      hiddenForm: {
+        pictureUrl: ""
+      },
+      // 表单校验
+      rules: {
+        hiddenTroubleName: [
+          { required: true, message: "请输入隐患名称", trigger: "blur" }
+        ],
+        hiddenTroubleLevel: [
+          { required: true, message: "请输入隐患等级", trigger: "blur" }
+        ],
+        hiddenTroubleType: [
+          { required: true, message: "请输入隐患类型", trigger: "blur" }
+        ],
+        longitude: [
+          { required: true, message: "请输入经纬度", trigger: ["blur","change"] }
+        ],
+        pictureUrl: [
+          { required: true, message: "请上传图片", trigger: "blur" }
+        ],
+        hiddenTroubleDescribe: [
+          { required: true, message: "请输入隐患描述", trigger: "blur" }
+        ]
+      },
+      fileList:[],
+      devicePos: [],
+      dialogTableVisibles: false,
+      hiddenTroubleOptions:[],
+      /**修改时当前数据下标*/
+      index: -1,
+    };
+  },
+  created(){
+    this.getDicts("t_hidden_trouble_type").then(response => {
+        this.hiddenTroubleOptions = response.data;
+    });
+  },
+  methods: {
+    // 取消按钮
+    cancel() {
+      this.hiddenOpen = false;
+      this.fileList = [];
+      this.reset();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.title = "新增隐患信息"
+      this.hiddenOpen = true;
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row,index) {
+      this.reset();
+      this.index = index;
+      this.hiddenForm = {...row};
+      this.title = "修改隐患信息"
+      this.hiddenOpen = true;
+      if (this.hiddenForm.pictureUrl) {
+        this.fileList.push({
+          url: this.hiddenForm.pictureUrl,
+        });
+      }
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["hiddenForm"].validate(valid => {
+        if (valid) {
+          const obj = {...this.hiddenForm};
+          if(this.index>=0){
+            this.hiddenList.splice(this.index, 1,obj);
+            this.index = -1;
+            this.hiddenOpen =false;
+            return;
+          }
+          obj.uniqueMark = this.uuidv1();
+          obj.workId = this.workId;
+          obj.reportTime = moment().format("YYYY-MM-DD HH:mm:ss");
+          obj.hiddenTroubleDealStatus = '1';
+          obj.reportPersonName = this.$store.state.user.name;
+          obj.reportPerson = this.$store.state.user.userId;
+          this.hiddenList.push(obj);
+          this.hiddenOpen = false;
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.hiddenList.splice(this.hiddenList.indexOf(row),1);
+    },
+    getFileInfo(res){
+      this.hiddenForm.pictureUrl = res.url;
+    },
+    listRemove(e) {
+      this.fileList = [];
+    },
+    // 表单重置
+    reset() {
+      this.hiddenForm = {
+        hiddenTroubleId: null,
+        workId: null,
+        hiddenTroubleName: null,
+        hiddenTroubleLevel: null,
+        hiddenTroubleType: null,
+        longitude: null,
+        latitude: null,
+        pictureUrl: null,
+        hiddenTroubleDescribe: null,
+        reportTime: null,
+        reportPerson: null,
+        hiddenTroubleDealStatus: "0",
+        hiddenTroubleDealCondition: null,
+        hiddenTroubleDealFinishTime: null,
+        isDel: null,
+        remarks: null,
+        uniqueMark: null,
+        reportPersonName:null
+      };
+      this.resetForm("hiddenForm");
+    },
+    /**
+     * 经纬度坐标方法
+     */
+    MapdialogFun() {
+      this.dialogTableVisibles = true;
+    },
+    /**
+     * 地图关闭方法
+     */
+    dialogcancelFun() {
+      this.dialogTableVisibles = false;
+    },
+    /**
+     * 经纬度 选择
+     * @param res
+     */
+    getPath(res){
+      //确认选择经纬度
+      this.hiddenForm.longitude = res[0];
+      this.hiddenForm.latitude = res[1];
+    },
+    /**生成唯一标识用于图片查看*/
+    uuidv1(){
+      this.formatDateTime() + Math.random().toString(36).substr(2);
+    },
+    formatDateTime() {
+      var date = new Date();
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? ('0' + m) : m;
+      var d = date.getDate();
+      d = d < 10 ? ('0' + d) : d;
+      var h = date.getHours();
+      var minute = date.getMinutes();
+      var second = date.getSeconds();
+      return y + m + d + h + minute + second;
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .hidden{
+    .el-dialog__header{
+      height: 52px;
+    }
+  }
+</style>

gassafetyprogress-web/src/views/inspectionWork/workOrder/index.vue

@@ -239,7 +239,7 @@
             <el-date-picker clearable size="small"
                             v-model="form.inspectionDate"
                             type="date"
-                            value-format="yyyy-MM-dd"
+                            value-format="yyyy-MM-dd HH:mm:ss"
                             placeholder="选择巡检时间" style="width: 350px" :disabled="isDetail">
             </el-date-picker>
           </el-form-item>
@@ -271,6 +271,10 @@
        <el-form-item label="反馈信息" prop="rectificationResult" v-show="isDetail && (form.workStatus =='2' || form.workStatus =='3')">
          <el-input v-model="form.rectificationResult" type="textarea" placeholder="请输入整改结果" :disabled="isDetail"/>
        </el-form-item>
+      <el-form-item label="隐患信息" prop="rectificationResult" v-show="isDetail && (form.workStatus =='2' || form.workStatus =='3')">
+        <HiddenTrouble
+          :hiddenList="hiddenInfoList"/>
+      </el-form-item>
       <el-row>
         <el-col :span="12">
           <el-form-item label="责任单位" prop="responsibleUnit">
@@ -353,7 +357,7 @@
       </div>
     </el-dialog>
     <!-- 反馈 -->
-    <el-dialog :title="title" :visible.sync="feedBookOpen" width="900px" append-to-body>
+    <el-dialog :title="title" :visible.sync="feedBookOpen" width="900px" append-to-body @close="cancelFeedBook">
       <el-form ref="feedBookForm" :model="feedBookForm" :rules="feedBookRules" label-width="80px">
         <el-row>
           <el-col :span="12">
@@ -389,6 +393,12 @@
          <el-form-item label="反馈信息" prop="rectificationResult">
            <el-input v-model="feedBookForm.rectificationResult" type="textarea" placeholder="反馈信息" />
          </el-form-item>
+        <el-form-item label="隐患信息" prop="hiddenInfo">
+          <HiddenTrouble
+            :hiddenList="feedBookForm.hiddenList"
+            :workId="feedBookForm.workId"
+            :isView="false"/>
+        </el-form-item>
 
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -401,17 +411,20 @@
 
 <script>
 import { listOrder, getOrder, delOrder, addOrder, updateOrder, exportOrder } from "@/api/operationMonitor/order";
+import { hiddenTroubleList } from "@/api/operationMonitor/hiddenTrouble"
 import Editor from '@/components/Editor';
 import MyFileUpload from '@/components/MyFileUpload';
 import { enterpriseLists } from "@/api/regulation/info";
 import { getInspectionUsers } from "@/api/system/user";
 import ScrollPane from "../../../layout/components/TagsView/ScrollPane";
+import HiddenTrouble from "./components/HiddenTrouble";
 export default {
   name: "Order",
   components: {
     ScrollPane,
     Editor,
-    MyFileUpload
+    MyFileUpload,
+    HiddenTrouble
   },
   data() {
     return {
@@ -515,9 +528,13 @@ export default {
       workForm:{},
       workOpen: false,
       feedBookForm: {
-        iconUrl: ""
+        iconUrl: "",
+        hiddenList:[]
       },
-      feedBookOpen: false
+      feedBookOpen: false,
+      //详情隐患信息
+      hiddenInfoList:[]
+
     };
   },
   created() {
@@ -760,6 +777,11 @@ export default {
         this.open = true;
         this.title = "燃气任务详情";
         this.form = response.data;
+        if(this.form.workStatus == '2' || this.form.workStatus == '3'){
+          const param = {};
+          param.workId = this.form.workId;
+          this.getHiddenInfos(param);
+        }
         this.getEnterpriseLists();
         this.getInspectionUserList(response.data.workAssignEnterproseId);
       });
@@ -887,7 +909,17 @@ export default {
     cancelFeedBook(){
       this.feedBookOpen = false;
       this.feedBookForm = {};
+      this.fileList = [];
     },
+    //获取隐患信息
+    getHiddenInfos(param){
+      hiddenTroubleList(param).then(res =>{
+        this.hiddenInfoList = res.data;
+        this.hiddenInfoList.forEach(item=>{
+          item.reportPersonName = item.reportPerson;
+        })
+      });
+    }
   }
 };
 </script>

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/Cg.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-25 17:15:31
+ * @LastEditTime: 2022-03-26 17:14:12
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
+-->
+
+<template>
+  <div class="czcard">
+    <my-collapse title="储罐" ref="myCollapse">
+      <template v-slot:chackbox>
+        <div
+          class="filter"
+          :class="`one-${item.state}`"
+          v-for="item in filterList"
+          :key="item.value"
+        >
+          <span
+            class="text"
+            :class="{ active: deviceTypeArr.indexOf(item.state) >= 0 }"
+            @click="fliterTypeChange(item)"
+            >{{ item.value }}</span
+          >
+          <span class="number">({{ item.count }})</span>
+        </div>
+      </template>
+      <template #container>
+        <div class="container flex">
+          <div
+            class="com"
+            v-for="item in czList"
+            :key="item.deviceName"
+            v-show="item.show"
+          >
+            <div :title="item.companyName" class="left zzz">{{ item.companyName }}</div>
+            <div :class="`one-${item.state}`" class="state">{{ typeState[item.state - 1] }}</div>
+          </div>
+        </div>
+      </template>
+    </my-collapse>
+  </div>
+</template>
+
+<script>
+import MyCollapse from "./MyCollapse";
+import CzItem from "./CzItem";
+
+export default {
+  components: {
+    MyCollapse,
+    CzItem,
+  },
+  data() {
+    return {
+      carHide: true,
+      addStartNum: 3,
+      filterList: [
+        { value: "正常", count: 100, state: 1 },
+        { value: "报警", count: 100, state: 2 },
+        { value: "离线", count: 100, state: 3 },
+      ],
+      typeState: ["正常", "报警", "离线"],
+      deviceTypeArr: [1, 2, 3],
+      czList: [
+        { companyName: "河北泽宏股份储罐", state: 1, show: true },
+        { companyName: "河北泽宏股份储罐", state: 2, show: true },
+        { companyName: "河北泽宏股份储罐", state: 3, show: true },
+        { companyName: "河北泽宏股份储罐", state: 1, show: true },
+        { companyName: "河北泽宏股份储罐", state: 2, show: true },
+        { companyName: "河北泽宏股份储罐", state: 3, show: true },
+        { companyName: "河北泽宏股份储罐", state: 1, show: true },
+        { companyName: "河北泽宏股份储罐", state: 2, show: true },
+        { companyName: "河北泽宏股份储罐", state: 3, show: true },
+        { companyName: "河北泽宏股份储罐", state: 1, show: true },
+        { companyName: "河北泽宏股份储罐", state: 2, show: true },
+        { companyName: "河北泽宏股份储罐", state: 3, show: true },
+        { companyName: "河北泽宏股份储罐", state: 1, show: true },
+        { companyName: "河北泽宏股份储罐", state: 2, show: true },
+        { companyName: "河北泽宏股份储罐", state: 3, show: true },
+        { companyName: "河北泽宏股份储罐", state: 1, show: true },
+        { companyName: "河北泽宏股份储罐", state: 2, show: true },
+        { companyName: "河北泽宏股份储罐", state: 3, show: true },
+      ],
+    };
+  },
+  computed: {
+    // 计算有多少个展示的对象,如果小于3个,就把justify-content: space-between;取消
+    getShowNum() {
+      return this.czList.filter((item) => item.show).length < this.addStartNum;
+    },
+  },
+  mounted() {
+    // this.changeAddStartNum();
+  },
+  methods: {
+    hide() {
+      this.carHide = !this.carHide;
+    },
+    // 根据父子元素自动计算是否需要添加值start
+    changeAddStartNum() {
+      const czItem = this.$refs.czItem;
+      let czItemWidth;
+      // 组件有可能是一个数组，所以要这样判断
+      if (Array.isArray(czItem)) {
+        const { width } = czItem[0].$el.getBoundingClientRect();
+        czItemWidth = width;
+      } else {
+        const { width } = czItem.$el.getBoundingClientRect();
+        czItemWidth = width;
+      }
+      // 取出collap的宽
+      const { width: CollapseWidth } =
+        this.$refs.myCollapse.$el.getBoundingClientRect();
+      // 得到最小的承载数量
+      this.addStartNum = Math.floor(CollapseWidth / czItemWidth);
+    },
+    //过滤选择
+    fliterTypeChange(data) {
+      const { state } = data;
+      const index = this.deviceTypeArr.indexOf(state);
+      if (index >= 0) {
+        this.deviceTypeArr.splice(index, 1);
+      } else {
+        this.deviceTypeArr.push(state);
+      }
+      this.filter(this.deviceTypeArr);
+      // 改变大小
+      this.$nextTick(() => {
+        this.$refs.myCollapse.getHeight();
+      });
+    },
+    // 过滤对象
+    filter(arr) {
+      this.czList.forEach((item) => {
+        const { state } = item;
+        if (arr.includes(state)) {
+          item.show = true;
+        } else {
+          item.show = false;
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+$one: #666666;
+$two: #ff6c68;
+$three: #bbbbbb;
+$active: #06d7b1 !important;
+
+.filter {
+  margin-right: 22px;
+  margin-top: 5px;
+  font-size: 14px;
+
+  .text {
+    position: relative;
+    cursor: pointer;
+    &::before {
+      content: "";
+      position: absolute;
+      border-radius: 50%;
+      width: 6px;
+      height: 6px;
+      left: -10px;
+      top: 50%;
+      margin-top: -3px;
+    }
+
+    &.active {
+      color: $active;
+    }
+    &:hover {
+      color: #06d7b189 !important;
+    }
+  }
+
+  .number {
+    font-weight: 500;
+  }
+
+  &.one-1 {
+    .number,
+    .text {
+      color: $one;
+    }
+    .text {
+      &:before {
+        background-color: $one;
+      }
+    }
+  }
+  &.one-2 {
+    .number,
+    .text {
+      color: $two;
+    }
+    .text {
+      &:before {
+        background-color: $two;
+      }
+    }
+  }
+  &.one-3 {
+    .number,
+    .text {
+      color: $three;
+    }
+    .text {
+      &:before {
+        background-color: $three;
+      }
+    }
+  }
+}
+.container {
+  width: 100%;
+  flex-wrap: wrap;
+  margin-left: 35px;
+
+  &.start {
+    justify-content: flex-start;
+    & > div {
+      // margin-right: 50px;
+    }
+  }
+  & > div {
+    margin-bottom: 20px;
+    display: flex;
+    justify-content: flex-start;
+    // margin-right: 45px;
+    width: 15%;
+    min-width: 190px;
+    margin-right: 1%;
+    .left {
+      margin-right: 4px;
+      font-size: 14px;
+      max-width: 112px;
+    }
+    .state {
+      font-size: 8px;
+      padding: 0px 4px;
+      box-sizing: border-box;
+      &.one-1 {
+        color: #fff;
+        border: 1px solid #6fffe5;
+        border-radius: 2px;
+        background-color: #06d7b1;
+      }
+      &.one-2 {
+        color: #fff;
+        border: 1px solid #ff9c99;
+        border-radius: 2px;
+        background-color: #ff6c68;
+      }
+      &.one-3{
+        color: #fff;
+        border: 1px solid #AAAAAA;
+        border-radius: 2px;
+        background-color: #bbbbbb;
+      }
+    }
+  }
+}
+.flex {
+  display: flex;
+  justify-content: flex-start;
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-25 17:15:31
+ * @LastEditTime: 2022-03-26 17:12:04
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
+-->
+
+<template>
+  <div class="czcard">
+    <my-collapse title="场站" ref="myCollapse">
+      <template v-slot:chackbox>
+        <div class="filter" v-for="item in filterList" :key="item.value">
+          <span
+            class="text"
+            :class="{ active: deviceTypeArr.indexOf(item.type) >= 0 }"
+            @click="fliterTypeChange(item)"
+            >{{ item.value }}</span
+          >
+          <span class="number">({{ item.count }})</span>
+        </div>
+      </template>
+      <template #container>
+        <div class="container" :class="{ start: getShowNum }">
+          <div v-for="item in czList" :key="item.deviceName" v-show="item.show">
+            <CzItem ref="czItem" :list="item" v-if="item.show" />
+          </div>
+        </div>
+      </template>
+    </my-collapse>
+  </div>
+</template>
+
+<script>
+import MyCollapse from "./MyCollapse";
+import CzItem from "./CzItem";
+
+export default {
+  components: {
+    MyCollapse,
+    CzItem,
+  },
+  data() {
+    return {
+      carHide: true,
+      addStartNum: 3,
+      filterList: [
+        { value: "加气站", count: 100, type: 1 },
+        { value: "加气站1", count: 100, type: 2 },
+        { value: "加气站2", count: 100, type: 3 },
+        { value: "加气站3", count: 100, type: 4 },
+        { value: "加气站4", count: 100, type: 5 },
+        { value: "加气站5", count: 100, type: 6 },
+        { value: "加气站7", count: 100, type: 7 },
+      ],
+      deviceTypeArr: [1, 2, 3, 4, 5, 6, 7],
+      czList: [
+        {
+          deviceName: "加气站a",
+          state: 1,
+          a: 25,
+          b: 56,
+          c: 54,
+          d: 15,
+          e: 56,
+          image: "",
+          show: true,
+          type: 1,
+        },
+        {
+          deviceName: "加气站b",
+          state: 1,
+          a: 25,
+          b: 56,
+          c: 54,
+          d: 15,
+          e: 56,
+          image: "",
+          show: true,
+          type: 2,
+        },
+        {
+          deviceName: "加气站c",
+          state: 1,
+          a: 25,
+          b: 56,
+          c: 54,
+          d: 15,
+          e: 56,
+          image: "",
+          show: true,
+          type: 3,
+        },
+        {
+          deviceName: "加气站d",
+          state: 1,
+          a: 25,
+          b: 56,
+          c: 54,
+          d: 15,
+          e: 56,
+          image: "",
+          show: true,
+          type: 4,
+        },
+        {
+          deviceName: "加气站e",
+          state: 1,
+          a: 25,
+          b: 56,
+          c: 54,
+          d: 15,
+          e: 56,
+          image: "",
+          show: true,
+          type: 4,
+        },
+        {
+          deviceName: "加气站f",
+          state: 1,
+          a: 25,
+          b: 56,
+          c: 54,
+          d: 15,
+          e: 56,
+          image: "",
+          show: true,
+          type: 4,
+        },
+        {
+          deviceName: "加气站g",
+          state: 1,
+          a: 25,
+          b: 56,
+          c: 54,
+          d: 15,
+          e: 56,
+          image: "",
+          show: true,
+          type: 4,
+        },
+       
+      ],
+    };
+  },
+  computed: {
+    // 计算有多少个展示的对象,如果小于3个,就把justify-content: space-between;取消
+    getShowNum() {
+      return this.czList.filter((item) => item.show).length < this.addStartNum;
+    },
+  },
+  mounted() {
+    this.changeAddStartNum();
+  },
+  methods: {
+    hide() {
+      this.carHide = !this.carHide;
+    },
+    // 根据父子元素自动计算是否需要添加值start
+    changeAddStartNum() {
+      const czItem = this.$refs.czItem;
+      let czItemWidth;
+      // 组件有可能是一个数组，所以要这样判断
+      if (Array.isArray(czItem)) {
+        const { width } = czItem[0].$el.getBoundingClientRect();
+        czItemWidth = width;
+      } else {
+        const { width } = czItem.$el.getBoundingClientRect();
+        czItemWidth = width;
+      }
+      // 取出collap的宽
+      const { width: CollapseWidth } =
+        this.$refs.myCollapse.$el.getBoundingClientRect();
+      // 得到最小的承载数量
+      this.addStartNum = Math.floor(CollapseWidth / czItemWidth);
+    },
+    //过滤选择
+    fliterTypeChange(data) {
+      const { type } = data;
+      const index = this.deviceTypeArr.indexOf(type);
+      if (index >= 0) {
+        this.deviceTypeArr.splice(index, 1);
+      } else {
+        this.deviceTypeArr.push(type);
+      }
+      this.filter(this.deviceTypeArr);
+      // 改变大小
+      this.$nextTick(() => {
+        this.$refs.myCollapse.getHeight();
+      });
+    },
+    // 过滤对象
+    filter(arr) {
+      this.czList.forEach((item) => {
+        const { type } = item;
+        if (arr.includes(type)) {
+          item.show = true;
+        } else {
+          item.show = false;
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.filter {
+  margin-right: 12px;
+  margin-top: 5px;
+  font-size: 14px;
+  .text {
+    cursor: pointer;
+    &:hover {
+      color: #06d7b189 !important;
+    }
+    &.active {
+      color: #06d7b1;
+    }
+  }
+  .number {
+    font-weight: 500;
+    color: #1890ff;
+  }
+}
+.container {
+  width: 100%;
+  flex-wrap: wrap;
+  display: flex;
+  &.start {
+    justify-content: flex-start;
+    & > div {
+      // margin-right: 50px;
+    }
+  }
+  & > div {
+    margin-bottom: 20px;
+    margin-left:1%;
+    width: 24%;
+    min-width: 295px;
+  }
+}
+.flex {
+  display: flex;
+  justify-content: space-between;
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzItem.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-26 10:27:00
+ * @LastEditTime: 2022-03-26 16:38:29
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzItem.vue
+-->
+<template>
+  <div class="czitem flex">
+    <div class="left">
+      <div class="img">
+        <div class="state">
+          {{ list.state == "0" ? "正常" : "报警" }}
+        </div>
+        <img v-if="list.src" src="" alt="" />
+        暂无图片
+      </div>
+      <div v-unValue class="device-name zzz">{{ list.deviceName }}</div>
+    </div>
+
+    <div class="right">
+      <div>温度：<span :class="{active:list.a>50}">{{list.a}}°C</span></div>
+      <div>水温：<span :class="{active:list.b>50}">{{list.b}}°C</span></div>
+      <div>压力：<span :class="{active:list.c>50}">{{list.c}}Pa</span></div>
+      <div>湿度：<span :class="{active:list.d>50}">{{list.d}}°C</span></div>
+      <div>水温：<span :class="{active:list.e>50}">{{list.e}}°C</span></div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    list: {
+      type: Object,
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.czitem {
+  // min-width: 324px;
+  width: 100%;
+  min-height: 191px;
+  padding: 14px 12px 18px 25px;
+  box-sizing: border-box;
+  border-radius: 4px;
+  border: 1px solid #e6ebf5;
+  // display: flex;
+  .left {
+    // margin-right: 48px;
+    .img {
+      width: 162px;
+      height: 120px;
+      border-radius: 4px;
+      line-height: 120px;
+      text-align: center;
+      position: relative;
+      box-sizing: border-box;
+      border: 1px solid #e6ebf5;
+      margin-bottom: 11px;
+      .state {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 162px;
+        height: 28px;
+        background-color: rgba(0, 0, 0, 0.6);
+        border-radius: 4px 4px 0px 0px;
+        text-align: center;
+        line-height: 28px;
+        color: #06d7b1;
+        font-size: 14px;
+      }
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .device-name {
+      font-size: 14px;
+      color: #666666;
+      font-weight: 500;
+    }
+  }
+  .right {
+    font-size: 14px;
+    min-width: 80px;
+    & > div {
+      margin-bottom: 10px;
+      span.active{
+        color: red;
+      }
+    }
+  }
+}
+.flex {
+  display: flex;
+  justify-content: space-between;
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/Fmj.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-25 17:15:31
+ * @LastEditTime: 2022-03-26 17:16:36
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
+-->
+
+<template>
+  <div class="czcard">
+    <my-collapse title="阀门井" ref="myCollapse">
+      <template v-slot:chackbox>
+        <div
+          class="filter"
+          :class="`one-${item.state}`"
+          v-for="item in filterList"
+          :key="item.value"
+        >
+          <span
+            class="text"
+            :class="{ active: deviceTypeArr.indexOf(item.state) >= 0 }"
+            @click="fliterTypeChange(item)"
+            >{{ item.value }}</span
+          >
+          <span class="number">({{ item.count }})</span>
+        </div>
+      </template>
+      <template #container>
+        <div class="container flex">
+          <div
+            class="com"
+            v-for="item in czList"
+            :key="item.deviceName"
+            v-show="item.show"
+          >
+            <div :title="item.companyName" class="left zzz">{{ item.companyName }}</div>
+            <div :class="`one-${item.state}`" class="state">{{ typeState[item.state - 1] }}</div>
+          </div>
+        </div>
+      </template>
+    </my-collapse>
+  </div>
+</template>
+
+<script>
+import MyCollapse from "./MyCollapse";
+import CzItem from "./CzItem";
+
+export default {
+  components: {
+    MyCollapse,
+    CzItem,
+  },
+  data() {
+    return {
+      carHide: true,
+      addStartNum: 3,
+      filterList: [
+        { value: "正常", count: 100, state: 1 },
+        { value: "报警", count: 100, state: 2 },
+        { value: "离线", count: 100, state: 3 },
+      ],
+      typeState: ["正常", "报警", "离线"],
+      deviceTypeArr: [1, 2, 3],
+      czList: [
+        { companyName: "河北泽宏股份阀门井", state: 1, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 2, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 3, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 1, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 2, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 3, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 1, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 2, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 3, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 1, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 2, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 3, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 1, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 2, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 3, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 1, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 2, show: true },
+        { companyName: "河北泽宏股份阀门井", state: 3, show: true },
+      ],
+    };
+  },
+  computed: {
+    // 计算有多少个展示的对象,如果小于3个,就把justify-content: space-between;取消
+    getShowNum() {
+      return this.czList.filter((item) => item.show).length < this.addStartNum;
+    },
+  },
+  mounted() {
+    // this.changeAddStartNum();
+  },
+  methods: {
+    hide() {
+      this.carHide = !this.carHide;
+    },
+    // 根据父子元素自动计算是否需要添加值start
+    changeAddStartNum() {
+      const czItem = this.$refs.czItem;
+      let czItemWidth;
+      // 组件有可能是一个数组，所以要这样判断
+      if (Array.isArray(czItem)) {
+        const { width } = czItem[0].$el.getBoundingClientRect();
+        czItemWidth = width;
+      } else {
+        const { width } = czItem.$el.getBoundingClientRect();
+        czItemWidth = width;
+      }
+      // 取出collap的宽
+      const { width: CollapseWidth } =
+        this.$refs.myCollapse.$el.getBoundingClientRect();
+      // 得到最小的承载数量
+      this.addStartNum = Math.floor(CollapseWidth / czItemWidth);
+    },
+    //过滤选择
+    fliterTypeChange(data) {
+      const { state } = data;
+      const index = this.deviceTypeArr.indexOf(state);
+      if (index >= 0) {
+        this.deviceTypeArr.splice(index, 1);
+      } else {
+        this.deviceTypeArr.push(state);
+      }
+      this.filter(this.deviceTypeArr);
+      // 改变大小
+      this.$nextTick(() => {
+        this.$refs.myCollapse.getHeight();
+      });
+    },
+    // 过滤对象
+    filter(arr) {
+      this.czList.forEach((item) => {
+        const { state } = item;
+        if (arr.includes(state)) {
+          item.show = true;
+        } else {
+          item.show = false;
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+$one: #666666;
+$two: #ff6c68;
+$three: #bbbbbb;
+$active: #06d7b1 !important;
+
+.filter {
+  margin-right: 22px;
+  margin-top: 5px;
+  font-size: 14px;
+
+  .text {
+    position: relative;
+    cursor: pointer;
+    &::before {
+      content: "";
+      position: absolute;
+      border-radius: 50%;
+      width: 6px;
+      height: 6px;
+      left: -10px;
+      top: 50%;
+      margin-top: -3px;
+    }
+
+    &.active {
+      color: $active;
+    }
+    &:hover {
+      color: #06d7b189 !important;
+    }
+  }
+
+  .number {
+    font-weight: 500;
+  }
+
+  &.one-1 {
+    .number,
+    .text {
+      color: $one;
+    }
+    .text {
+      &:before {
+        background-color: $one;
+      }
+    }
+  }
+  &.one-2 {
+    .number,
+    .text {
+      color: $two;
+    }
+    .text {
+      &:before {
+        background-color: $two;
+      }
+    }
+  }
+  &.one-3 {
+    .number,
+    .text {
+      color: $three;
+    }
+    .text {
+      &:before {
+        background-color: $three;
+      }
+    }
+  }
+}
+.container {
+  width: 100%;
+  flex-wrap: wrap;
+  margin-left: 35px;
+
+  &.start {
+    justify-content: flex-start;
+    & > div {
+      // margin-right: 50px;
+    }
+  }
+  & > div {
+    margin-bottom: 20px;
+    display: flex;
+    justify-content: flex-start;
+    // margin-right: 45px;
+    width: 15%;
+    min-width: 190px;
+    margin-right: 1%;
+    .left {
+      margin-right: 4px;
+      font-size: 14px;
+      max-width: 112px;
+    }
+    .state {
+      font-size: 8px;
+      padding: 0px 4px;
+      box-sizing: border-box;
+      &.one-1 {
+        color: #fff;
+        border: 1px solid #6fffe5;
+        border-radius: 2px;
+        background-color: #06d7b1;
+      }
+      &.one-2 {
+        color: #fff;
+        border: 1px solid #ff9c99;
+        border-radius: 2px;
+        background-color: #ff6c68;
+      }
+      &.one-3{
+        color: #fff;
+        border: 1px solid #AAAAAA;
+        border-radius: 2px;
+        background-color: #bbbbbb;
+      }
+    }
+  }
+}
+.flex {
+  display: flex;
+  justify-content: flex-start;
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/MyCollapse.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-25 17:15:31
+ * @LastEditTime: 2022-03-26 15:33:25
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
+-->
+
+<template>
+  <div class="czcard">
+    <div
+      class="card"
+      :style="{ height: transitionHeight }"
+      :class="{ hide: carHide }"
+    >
+      <div class="title flex">
+        <div class="left">
+          <div class="device">{{title}}</div>
+          <slot name="chackbox" />
+        </div>
+        <div class="right">
+          <i
+            class="iconfont icon-jt"
+            @click="hide"
+            :class="{ active: !carHide }"
+          ></i>
+        </div>
+      </div>
+      <div ref="container">
+        <slot name="container" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+  props:{
+    title:String,
+  },
+  data() {
+    return {
+      carHide: true,
+      transitionHeight: "60px",
+    };
+  },
+ 
+  computed: {
+    ...mapGetters(["sidebar"]),
+  },
+  watch: {
+    ["sidebar.opened"](val) {
+      setTimeout(this.getHeight, 200);
+      // this.getHeight();
+    },
+  },
+  mounted() {
+    this.getHeight();
+  },
+
+  methods: {
+    hide() {
+      this.carHide = !this.carHide;
+    },
+    getHeight() {
+      const { height } = this.$refs?.container?.getBoundingClientRect();
+      if(!height){
+        return;
+      }
+      // 高度必须是一个指定的值才能过渡变化，这样就计算出了整个元素的指定高度，然后赋值
+      if (height > 0) {
+        this.transitionHeight = height + 60 + 18 + "px";
+      }else{
+        this.transitionHeight="60px";
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.card {
+  transition: all 0.5s;
+  // height: 212px;
+  background: #ffffff;
+  box-shadow: 2px 0px 12px 1px rgba(0, 0, 0, 0.1);
+  border-radius: 4px 4px 4px 4px;
+  border: 1px solid #e6ebf5;
+  box-sizing: border-box;
+  padding: 15px 22px 18px 22px;
+  overflow: hidden;
+  margin-bottom:20px;
+  &.hide {
+    height: 60px !important;
+  }
+  .title {
+    margin-bottom: 12px;
+    margin-left: 40px;
+    .left {
+      display: flex;
+      .device {
+        font-size: 18px;
+        color: #666666;
+        font-weight: 500;
+        margin-right: 62px;
+      }
+    }
+    .right {
+      i {
+        transition: all 0.5s;
+        display: inline-block;
+        font-size: 30px;
+        color: #c4c4c4;
+        cursor: pointer;
+        &.active {
+          transform: rotate(90deg);
+        }
+      }
+    }
+  }
+}
+.flex {
+  display: flex;
+  justify-content: space-between;
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/TopCard.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-25 13:46:23
+ * @LastEditTime: 2022-03-25 17:18:05
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData.vue
+-->
+<template>
+  <div class="">
+    <div class="top-card flex">
+      <div
+        class="box-card"
+        v-for="(item, index) in cardList"
+        :key="item.deviceName"
+      >
+        <div class="top flex">
+          <div class="top-left">
+            <span
+              class="iconfont"
+              :class="`icon-` + deviceIconList[index]"
+            ></span>
+            <span class="text">{{ item.deviceName }}</span>
+          </div>
+          <div class="top-right flex">
+            <span class="text">总数</span>
+            <span class="count">{{ item.count }}</span>
+          </div>
+        </div>
+
+        <div class="middle flex">
+          <div class="first">正常</div>
+          <div>高爆</div>
+          <div>低爆</div>
+          <div class="last">离线数</div>
+        </div>
+
+        <div class="bottom flex">
+          <div class="first">1234</div>
+          <div>1234</div>
+          <div>1231</div>
+          <div class="last">534534</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "charsData",
+  props:{
+    cardList:{
+      type:Array,
+    }
+  },
+  data() {
+    return {
+      deviceIconList: ["ylb", "llj", "tcq"],
+    };
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+
+.top-card {
+  margin-bottom:22px;
+  & > div {
+    flex: 1;
+    margin-right: 20px;
+    height: 212px;
+    background: #ffffff;
+    box-shadow: 2px 0px 12px 1px rgba(0, 0, 0, 0.1);
+    border-radius: 4px 4px 4px 4px;
+    border: 1px solid #e6ebf5;
+    box-sizing: border-box;
+    padding: 34px 40px 38px;
+    .top {
+      font-size: 20px;
+      margin-bottom: 46px;
+
+      .top-left {
+        color: #1890ff;
+        .iconfont {
+          font-size: 20px;
+          margin-right: 4px;
+        }
+        .text {
+          font-weight: 500;
+        }
+      }
+
+      .top-right {
+        padding-top: 5px;
+        font-size: 16px;
+
+        .text {
+          font-size: 16px;
+          font-weight: 500;
+          margin-right: 2px;
+          padding-top: 3px;
+        }
+        .count {
+          color: #1890ff;
+          font-size: 22px;
+          letter-spacing: 1px;
+        }
+      }
+    }
+
+    &:last-child {
+      margin-right: 0;
+    }
+  }
+
+  .middle,
+  .bottom {
+    // justify-content: space-around;
+    & > div {
+      // flex: 1;
+      text-align: center;
+      font-size: 16px;
+      &.first {
+        text-align: left;
+      }
+      &.last {
+        text-align: right;
+      }
+    }
+  }
+  .middle {
+    margin-bottom: 20px;
+
+    & > div {
+      font-weight: 500;
+    }
+  }
+}
+.flex {
+  display: flex;
+  justify-content: space-between;
+}
+
+
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/Tyx.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-25 17:15:31
+ * @LastEditTime: 2022-03-26 17:16:52
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
+-->
+
+<template>
+  <div class="czcard">
+    <my-collapse title="调压箱" ref="myCollapse">
+      <template v-slot:chackbox>
+        <div
+          class="filter"
+          :class="`one-${item.state}`"
+          v-for="item in filterList"
+          :key="item.value"
+        >
+          <span
+            class="text"
+            :class="{ active: deviceTypeArr.indexOf(item.state) >= 0 }"
+            @click="fliterTypeChange(item)"
+            >{{ item.value }}</span
+          >
+          <span class="number">({{ item.count }})</span>
+        </div>
+      </template>
+      <template #container>
+        <div class="container flex">
+          <div
+            class="com"
+            v-for="item in czList"
+            :key="item.deviceName"
+            v-show="item.show"
+          >
+            <div :title="item.companyName" class="left zzz">{{ item.companyName }}</div>
+            <div :class="`one-${item.state}`" class="state">{{ typeState[item.state - 1] }}</div>
+          </div>
+        </div>
+      </template>
+    </my-collapse>
+  </div>
+</template>
+
+<script>
+import MyCollapse from "./MyCollapse";
+import CzItem from "./CzItem";
+
+export default {
+  components: {
+    MyCollapse,
+    CzItem,
+  },
+  data() {
+    return {
+      carHide: true,
+      addStartNum: 3,
+      filterList: [
+        { value: "正常", count: 100, state: 1 },
+        { value: "报警", count: 100, state: 2 },
+        { value: "离线", count: 100, state: 3 },
+      ],
+      typeState: ["正常", "报警", "离线"],
+      deviceTypeArr: [1, 2, 3],
+      czList: [
+        { companyName: "河北泽宏股份调压箱", state: 1, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 2, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 3, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 1, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 2, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 3, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 1, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 2, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 3, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 1, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 2, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 3, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 1, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 2, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 3, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 1, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 2, show: true },
+        { companyName: "河北泽宏股份调压箱", state: 3, show: true },
+      ],
+    };
+  },
+  computed: {
+    // 计算有多少个展示的对象,如果小于3个,就把justify-content: space-between;取消
+    getShowNum() {
+      return this.czList.filter((item) => item.show).length < this.addStartNum;
+    },
+  },
+  mounted() {
+    // this.changeAddStartNum();
+  },
+  methods: {
+    hide() {
+      this.carHide = !this.carHide;
+    },
+    // 根据父子元素自动计算是否需要添加值start
+    changeAddStartNum() {
+      const czItem = this.$refs.czItem;
+      let czItemWidth;
+      // 组件有可能是一个数组，所以要这样判断
+      if (Array.isArray(czItem)) {
+        const { width } = czItem[0].$el.getBoundingClientRect();
+        czItemWidth = width;
+      } else {
+        const { width } = czItem.$el.getBoundingClientRect();
+        czItemWidth = width;
+      }
+      // 取出collap的宽
+      const { width: CollapseWidth } =
+        this.$refs.myCollapse.$el.getBoundingClientRect();
+      // 得到最小的承载数量
+      this.addStartNum = Math.floor(CollapseWidth / czItemWidth);
+    },
+    //过滤选择
+    fliterTypeChange(data) {
+      const { state } = data;
+      const index = this.deviceTypeArr.indexOf(state);
+      if (index >= 0) {
+        this.deviceTypeArr.splice(index, 1);
+      } else {
+        this.deviceTypeArr.push(state);
+      }
+      this.filter(this.deviceTypeArr);
+      // 改变大小
+      this.$nextTick(() => {
+        this.$refs.myCollapse.getHeight();
+      });
+    },
+    // 过滤对象
+    filter(arr) {
+      this.czList.forEach((item) => {
+        const { state } = item;
+        if (arr.includes(state)) {
+          item.show = true;
+        } else {
+          item.show = false;
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+$one: #666666;
+$two: #ff6c68;
+$three: #bbbbbb;
+$active: #06d7b1 !important;
+
+.filter {
+  margin-right: 22px;
+  margin-top: 5px;
+  font-size: 14px;
+
+  .text {
+    position: relative;
+    cursor: pointer;
+    &::before {
+      content: "";
+      position: absolute;
+      border-radius: 50%;
+      width: 6px;
+      height: 6px;
+      left: -10px;
+      top: 50%;
+      margin-top: -3px;
+    }
+
+    &.active {
+      color: $active;
+    }
+    &:hover {
+      color: #06d7b189 !important;
+    }
+  }
+
+  .number {
+    font-weight: 500;
+  }
+
+  &.one-1 {
+    .number,
+    .text {
+      color: $one;
+    }
+    .text {
+      &:before {
+        background-color: $one;
+      }
+    }
+  }
+  &.one-2 {
+    .number,
+    .text {
+      color: $two;
+    }
+    .text {
+      &:before {
+        background-color: $two;
+      }
+    }
+  }
+  &.one-3 {
+    .number,
+    .text {
+      color: $three;
+    }
+    .text {
+      &:before {
+        background-color: $three;
+      }
+    }
+  }
+}
+.container {
+  width: 100%;
+  flex-wrap: wrap;
+  margin-left: 35px;
+
+  &.start {
+    justify-content: flex-start;
+    & > div {
+      // margin-right: 50px;
+    }
+  }
+  & > div {
+    margin-bottom: 20px;
+    display: flex;
+    justify-content: flex-start;
+    // margin-right: 45px;
+    width: 15%;
+    min-width: 190px;
+    margin-right: 1%;
+    .left {
+      margin-right: 4px;
+      font-size: 14px;
+      max-width: 112px;
+    }
+    .state {
+      font-size: 8px;
+      padding: 0px 4px;
+      box-sizing: border-box;
+      &.one-1 {
+        color: #fff;
+        border: 1px solid #6fffe5;
+        border-radius: 2px;
+        background-color: #06d7b1;
+      }
+      &.one-2 {
+        color: #fff;
+        border: 1px solid #ff9c99;
+        border-radius: 2px;
+        background-color: #ff6c68;
+      }
+      &.one-3{
+        color: #fff;
+        border: 1px solid #AAAAAA;
+        border-radius: 2px;
+        background-color: #bbbbbb;
+      }
+    }
+  }
+}
+.flex {
+  display: flex;
+  justify-content: flex-start;
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/index.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-25 13:46:23
+ * @LastEditTime: 2022-03-26 17:15:43
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData.vue
+-->
+<template>
+  <div class="chars-data">
+    <TopCard :cardList="cardList"/>
+    <CzCard/>
+    <Cg/>
+    <Fmj/>
+    <Tyx/>
+  </div>
+</template>
+
+<script>
+import TopCard from "./TopCard";
+import CzCard from "./CzCard";
+import Cg from "./Cg";
+import Fmj from "./Fmj";
+import Tyx from "./Tyx";
+export default {
+  name: "charsData",
+  components: {
+    TopCard,
+    CzCard,
+    Cg,
+    Fmj,
+    Tyx
+  },
+  data() {
+    return {
+      cardList: [
+        { deviceName: "压力表", count: 123123 },
+        { deviceName: "流量计", count: 123123 },
+        { deviceName: "探测器", count: 123123 },
+      ],
+      deviceIconList: ["ylb", "llj", "tcq"],
+    };
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.chars-data {
+  padding: 26px 108px 0 88px;
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/operationMonitor/monitorData/component/tableData/index.vue

+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="设备名称" prop="deviceName">
+        <el-input
+          v-model="queryParams.deviceName"
+          placeholder="请输入设备名称"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="设备编号" prop="deviceNum">
+        <el-input
+          v-model="queryParams.deviceNum"
+          placeholder="请输入设备编号"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="所属企业" prop="beyondEnterpriseId">
+        <el-select v-model="queryParams.beyondEnterpriseId" placeholder="请选择所属企业">
+          <el-option
+            v-for="item in enterprises"
+            :key="item.enterpriseId"
+            :label="item.enterpriseName"
+            :value="item.enterpriseId"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+
+    <el-tabs v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane label="压力表" name="first" key="first">
+        <pressureTab
+          :activeName="activeName"
+          :childrenQueryParams="queryParams"
+          v-if="activeName === 'first'"
+          ref="pressure"></pressureTab>
+      </el-tab-pane>
+
+      <el-tab-pane label="流量计" name="second" key="second">
+        <flowmeterTab
+          :activeName="activeName"
+          :childrenQueryParams="queryParams"
+          v-if="activeName === 'second'"
+          ref="flowmeter"></flowmeterTab>
+      </el-tab-pane>
+
+      <el-tab-pane label="探测器" name="third" key="third">
+        <detector-tab
+          :activeName="activeName"
+          :childrenQueryParams="queryParams"
+          v-if="activeName === 'third'"
+          ref="detector">
+        </detector-tab>
+      </el-tab-pane>
+
+    </el-tabs>
+
+  </div>
+</template>
+
+<script>
+import { listData, getData, delData, addData, updateData, exportData } from "@/api/operationMonitor/data";
+import { enterpriseLists } from "@/api/regulation/info";
+import detectorTab from "./detectorTab";
+import flowmeterTab from "./flowmeterTab";
+import pressureTab from "./pressureTab"
+export default {
+  name: "Data",
+  components: {
+    detectorTab,
+    flowmeterTab,
+    pressureTab
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 设备监控表格数据
+      dataList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        deviceNum: null,
+        standardConditionAccumulation: null,
+        workingConditionAccumulation: null,
+        backingStandardConditionAccumulation: null,
+        residualQuantity: null,
+        standardConditionFlow: null,
+        workingConditionFlow: null,
+        temperature: null,
+        pressure: null,
+        reportTime: null,
+        communicationStatus: null,
+        deviceStatus: null,
+        isDel: null,
+        remarks: null,
+        deviceType: "1"
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        deviceNum: [
+          { required: true, message: "设备id不能为空", trigger: "blur" }
+        ],
+      },
+      enterprises:[],
+      activeName: "first"
+    };
+  },
+  created() {
+    //this.getList();
+    this.getEnterpriseLists();
+  },
+  methods: {
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        deviceReportDataId: null,
+        deviceNum: null,
+        standardConditionAccumulation: null,
+        workingConditionAccumulation: null,
+        backingStandardConditionAccumulation: null,
+        residualQuantity: null,
+        standardConditionFlow: null,
+        workingConditionFlow: null,
+        temperature: null,
+        pressure: null,
+        reportTime: null,
+        communicationStatus: "0",
+        deviceStatus: "0",
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        isDel: null,
+        remarks: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      if("first" == this.activeName){
+        this.$refs.pressure.pressureHandleQuery();
+      }else if("second" == this.activeName){
+        this.$refs.flowmeter.flowmeterHandleQuery();
+      }else{
+        this.$refs.detector.detectorHandleQuery();
+      }
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    //所属单位
+    getEnterpriseLists(){
+      enterpriseLists().then(response => {
+          this.enterprises = response.rows;
+      });
+    },
+    //切换tag
+    handleClick(tab, event){
+      if("0" == tab.index){
+        this.activeName = "first"
+      }else if("1" == tab.index){
+        this.activeName = "second"
+      }else{
+        this.activeName = "third"
+      }
+    }
+  }
+};
+</script>
+<style>
+  .el-tag {
+    margin-left: 10px;
+    text-align: center;
+    width: 200px;
+  }
+</style>

gassafetyprogress-web/src/views/operationMonitor/monitorData/index.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-08 17:28:57
+ * @LastEditTime: 2022-03-25 15:27:44
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/index.vue
+-->
 <template>
-  <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="设备名称" prop="deviceName">
-        <el-input
-          v-model="queryParams.deviceName"
-          placeholder="请输入设备名称"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="设备编号" prop="deviceNum">
-        <el-input
-          v-model="queryParams.deviceNum"
-          placeholder="请输入设备编号"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="所属企业" prop="beyondEnterpriseId">
-        <el-select v-model="queryParams.beyondEnterpriseId" placeholder="请选择所属企业">
-          <el-option
-            v-for="item in enterprises"
-            :key="item.enterpriseId"
-            :label="item.enterpriseName"
-            :value="item.enterpriseId"
-          ></el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-
-
-    <el-tabs v-model="activeName" @tab-click="handleClick">
-      <el-tab-pane label="压力表" name="first" key="first">
-        <pressureTab
-          :activeName="activeName"
-          :childrenQueryParams="queryParams"
-          v-if="activeName === 'first'"
-          ref="pressure"></pressureTab>
-      </el-tab-pane>
-
-      <el-tab-pane label="流量计" name="second" key="second">
-        <flowmeterTab
-          :activeName="activeName"
-          :childrenQueryParams="queryParams"
-          v-if="activeName === 'second'"
-          ref="flowmeter"></flowmeterTab>
-      </el-tab-pane>
-
-      <el-tab-pane label="探测器" name="third" key="third">
-        <detector-tab
-          :activeName="activeName"
-          :childrenQueryParams="queryParams"
-          v-if="activeName === 'third'"
-          ref="detector">
-        </detector-tab>
-      </el-tab-pane>
-
-    </el-tabs>
-
+  <div class="monitorData">
+    <div class="iconfont">
+      <div
+        v-for="(item, index) in changeIcon"
+        :key="item.class"
+        :class="[item.class, { active: isCom == index }]"
+        @click="isComChange(index)"
+      ></div>
+    </div>
+    <component :is="currentTabComponent"></component>
   </div>
 </template>
 
 <script>
-import { listData, getData, delData, addData, updateData, exportData } from "@/api/operationMonitor/data";
-import { enterpriseLists } from "@/api/regulation/info";
-import detectorTab from "./component/detectorTab";
-import flowmeterTab from "./component/flowmeterTab";
-import pressureTab from "./component/pressureTab"
+import charsData from "./component/charsData";
+import tabledata from "./component/tableData";
 export default {
-  name: "Data",
-  components: {
-    detectorTab,
-    flowmeterTab,
-    pressureTab
-  },
   data() {
     return {
-      // 遮罩层
-      loading: true,
-      // 导出遮罩层
-      exportLoading: false,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 设备监控表格数据
-      dataList: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        deviceNum: null,
-        standardConditionAccumulation: null,
-        workingConditionAccumulation: null,
-        backingStandardConditionAccumulation: null,
-        residualQuantity: null,
-        standardConditionFlow: null,
-        workingConditionFlow: null,
-        temperature: null,
-        pressure: null,
-        reportTime: null,
-        communicationStatus: null,
-        deviceStatus: null,
-        isDel: null,
-        remarks: null,
-        deviceType: "1"
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-        deviceNum: [
-          { required: true, message: "设备id不能为空", trigger: "blur" }
-        ],
-      },
-      enterprises:[],
-      activeName: "first"
+      // currentTabComponent: tabledata,
+      changeIcon: [{ class: "icon-b" }, { class: "icon-a" }],
+      isCom: 1,
     };
   },
-  created() {
-    //this.getList();
-    this.getEnterpriseLists();
+  computed: {
+    currentTabComponent() {
+      return this.isCom == 0 ? tabledata : charsData;
+    },
   },
   methods: {
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-        deviceReportDataId: null,
-        deviceNum: null,
-        standardConditionAccumulation: null,
-        workingConditionAccumulation: null,
-        backingStandardConditionAccumulation: null,
-        residualQuantity: null,
-        standardConditionFlow: null,
-        workingConditionFlow: null,
-        temperature: null,
-        pressure: null,
-        reportTime: null,
-        communicationStatus: "0",
-        deviceStatus: "0",
-        createBy: null,
-        createTime: null,
-        updateBy: null,
-        updateTime: null,
-        isDel: null,
-        remarks: null
-      };
-      this.resetForm("form");
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      if("first" == this.activeName){
-        this.$refs.pressure.pressureHandleQuery();
-      }else if("second" == this.activeName){
-        this.$refs.flowmeter.flowmeterHandleQuery();
-      }else{
-        this.$refs.detector.detectorHandleQuery();
-      }
+    isComChange(index) {
+      this.isCom = index;
     },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    //所属单位
-    getEnterpriseLists(){
-      enterpriseLists().then(response => {
-          this.enterprises = response.rows;
-      });
-    },
-    //切换tag
-    handleClick(tab, event){
-      if("0" == tab.index){
-        this.activeName = "first"
-      }else if("1" == tab.index){
-        this.activeName = "second"
-      }else{
-        this.activeName = "third"
-      }
-    }
-  }
+  },
 };
 </script>
-<style>
-  .el-tag {
-    margin-left: 10px;
-    text-align: center;
-    width: 200px;
+
+<style lang="scss" scoped>
+@import url("~@/assets/iconfont/monitorData/iconfont.css");
+.iconfont {
+  display: flex;
+  justify-content: right;
+  margin-right: 37px;
+  padding-top: 38px;
+  div {
+    cursor: pointer;
+    padding: 4px;
+    &.active,
+    &:hover {
+      background-color: #666666;
+      color: #fff;
+    }
   }
-</style>
+  .icon-b {
+    margin-right: 23px;
+  }
+}
+</style>>
+

gassafetyprogress-web/src/views/regulation/device/index.vue

@@ -86,18 +86,37 @@
 <!--      <el-table-column label="设备id" align="center" prop="deviceId" />-->
       <el-table-column label="照片" align="center"  >
         <template scope="List">
-          <img  :src="List.row.iconUrl" width="100px">
+              <img :src="List.row.iconUrl" width="100px">
         </template>
       </el-table-column>
-      <el-table-column label="设备名称" align="center" prop="deviceName" />
-      <el-table-column label="设备编号" align="center" prop="deviceCode" />
-      <el-table-column label="所在地址" align="center" prop="deviceAddr" />
-      <el-table-column label="设备型号" align="center" prop="deviceModel" />
-      <el-table-column label="设备类型" align="center" prop="deviceType" />
-      <el-table-column label="权属单位名称" align="center" prop="beyondEnterpriseName" />
+      <el-table-column label="设备名称" align="center" prop="deviceName">
+        <span slot-scope="scope" v-if="scope.row.deviceName">{{scope.row.deviceName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="设备编号" align="center" prop="deviceCode">
+        <span slot-scope="scope" v-if="scope.row.deviceCode">{{scope.row.deviceCode}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="所在地址" align="center" prop="deviceAddr">
+        <span slot-scope="scope" v-if="scope.row.deviceAddr">{{scope.row.deviceAddr}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="设备型号" align="center" prop="deviceModel" >
+        <span slot-scope="scope" v-if="scope.row.deviceModel">{{scope.row.deviceModel}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="设备类型" align="center" prop="deviceType" >
+        <span slot-scope="scope" v-if="scope.row.deviceType">{{scope.row.deviceType}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="权属单位名称" align="center" prop="beyondEnterpriseName" >
+        <span slot-scope="scope" v-if="scope.row.beyondEnterpriseName">{{scope.row.beyondEnterpriseName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
       <el-table-column label="安装时间" align="center" prop="installationTime" width="180">
         <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.installationTime, '{y}-{m}-{d}') }}</span>
+          <span v-if="scope.row.installationTime">{{ parseTime(scope.row.installationTime, '{y}-{m}-{d}') }}</span>
+          <span v-else>-</span>
         </template>
       </el-table-column>
       <el-table-column label="照片" align="center"  >
@@ -105,7 +124,7 @@
           <span
             class="dbtn"
             @click="checkFile(List.row.iconUrl)"
-            v-if="List.row.iconUrl != ''"
+            v-if="List.row.iconUrl"
           >
             <i class="el-icon el-icon-view"></i>查看/下载
           </span>

gassafetyprogress-web/src/views/regulation/gasuser/index.vue

@@ -53,14 +53,38 @@
     <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <!--<el-table-column label="用户账号" align="center" prop="username" />-->
-      <el-table-column label="用户名称" align="center" prop="nickName" />
-      <el-table-column label="用户类型" align="center" prop="userType" />
-      <el-table-column label="地址" align="center" prop="address" />
-      <el-table-column label="经度" align="center" prop="longitude" />
-      <el-table-column label="纬度" align="center" prop="latitude" />
-      <el-table-column label="联系人" align="center" prop="linkman" />
-      <el-table-column label="电话" align="center" prop="phone" />
-      <el-table-column label="邮箱" align="center" prop="email" />
+      <el-table-column label="用户名称" align="center" prop="nickName" >
+        <span slot-scope="scope" v-if="scope.row.nickName">{{scope.row.nickName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="用户类型" align="center" prop="userType" >
+        <span slot-scope="scope" v-if="scope.row.userType">{{scope.row.userType}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="地址" align="center" prop="address" >
+        <span slot-scope="scope" v-if="scope.row.address">{{scope.row.address}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="经度" align="center" prop="longitude" >
+        <span slot-scope="scope" v-if="scope.row.longitude">{{scope.row.longitude}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="纬度" align="center" prop="latitude" >
+        <span slot-scope="scope" v-if="scope.row.latitude">{{scope.row.latitude}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="联系人" align="center" prop="linkman" >
+        <span slot-scope="scope" v-if="scope.row.linkman">{{scope.row.linkman}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="电话" align="center" prop="phone" >
+        <span slot-scope="scope" v-if="scope.row.phone">{{scope.row.phone}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="邮箱" align="center" prop="email" >
+        <span slot-scope="scope" v-if="scope.row.email">{{scope.row.email}}</span>
+        <span v-else>-</span>
+      </el-table-column>
       <!--<el-table-column label="备注" align="center" prop="remarks" />-->
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">

gassafetyprogress-web/src/views/regulation/info/index.vue

@@ -80,20 +80,44 @@
           <img  :src="List.row.doDusiness" width="100px">
         </template>
       </el-table-column>
-      <el-table-column label="企业名称" align="center" prop="enterpriseName" />
-      <el-table-column label="注册地址" align="center" prop="registerAddress" />
-      <el-table-column label="法定代表人" align="center" prop="legalRepresentative" />
-      <el-table-column label="经营区域" align="center" prop="businessArea" />
-      <el-table-column label="许可证编号" align="center" prop="licenseKey" />
-      <el-table-column label="许可证有效期" align="center" prop="licenseValidityTime" />
-      <el-table-column label="年度监督检查情况" align="center" prop="annualSupervisionInspection" />
-      <el-table-column label="备注" align="center" prop="remarks" />
+      <el-table-column label="企业名称" align="center" prop="enterpriseName" >
+        <span slot-scope="scope" v-if="scope.row.enterpriseName">{{scope.row.enterpriseName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="注册地址" align="center" prop="registerAddress" >
+        <span slot-scope="scope" v-if="scope.row.registerAddress">{{scope.row.registerAddress}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="法定代表人" align="center" prop="legalRepresentative" >
+        <span slot-scope="scope" v-if="scope.row.legalRepresentative">{{scope.row.legalRepresentative}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="经营区域" align="center" prop="businessArea">
+        <span slot-scope="scope" v-if="scope.row.businessArea">{{scope.row.businessArea}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="许可证编号" align="center" prop="licenseKey" >
+        <span slot-scope="scope" v-if="scope.row.licenseKey">{{scope.row.licenseKey}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="许可证有效期" align="center" prop="licenseValidityTime" >
+        <span slot-scope="scope" v-if="scope.row.licenseValidityTime">{{scope.row.licenseValidityTime}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="年度监督检查情况" align="center" prop="annualSupervisionInspection" >
+        <span slot-scope="scope" v-if="scope.row.annualSupervisionInspection">{{scope.row.annualSupervisionInspection}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remarks" >
+        <span slot-scope="scope" v-if="scope.row.remarks">{{scope.row.remarks}}</span>
+        <span v-else>-</span>
+      </el-table-column>
       <el-table-column label="营业执照" align="center"  >
         <template slot-scope="List">
           <span
             class="dbtn"
             @click="checkFile(List.row.doDusiness)"
-            v-if="List.row.doDusiness != ''"
+            v-if="List.row.doDusiness"
           >
             <i class="el-icon el-icon-view"></i>查看/下载
           </span>

gassafetyprogress-web/src/views/regulation/pipe/index.vue

@@ -92,16 +92,40 @@
 
     <el-table v-loading="loading" :data="pipeList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="管道长度(米)" align="center" prop="pipeLength" />
-      <el-table-column label="走向" align="center" prop="pipeTrend" />
-      <el-table-column label="管径(厘米)" align="center" prop="pipeDiameter" />
-      <el-table-column label="压力" align="center" prop="pipePressure" />
+      <el-table-column label="管道长度(米)" align="center" prop="pipeLength" >
+        <span slot-scope="scope" v-if="scope.row.pipeLength">{{scope.row.pipeLength}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="走向" align="center" prop="pipeTrend" >
+        <span slot-scope="scope" v-if="scope.row.pipeTrend">{{scope.row.pipeTrend}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="管径(厘米)" align="center" prop="pipeDiameter" >
+        <span slot-scope="scope" v-if="scope.row.pipeDiameter">{{scope.row.pipeDiameter}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="压力" align="center" prop="pipePressure" >
+        <span slot-scope="scope" v-if="scope.row.pipePressure">{{scope.row.pipePressure}}</span>
+        <span v-else>-</span>
+      </el-table-column>
 <!--      <el-table-column label="人员类型" align="center" prop="peopleOccupation" />-->
-      <el-table-column label="建设年代" align="center" prop="buildDate" />
-      <el-table-column label="建设单位" align="center" prop="buildUnit" />
-      <el-table-column label="权属单位" align="center" prop="beyondEnterpriseName" />
+      <el-table-column label="建设年代" align="center" prop="buildDate" >
+        <span slot-scope="scope" v-if="scope.row.buildDate">{{scope.row.buildDate}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="建设单位" align="center" prop="buildUnit" >
+        <span slot-scope="scope" v-if="scope.row.buildUnit">{{scope.row.buildUnit}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="权属单位" align="center" prop="beyondEnterpriseName" >
+        <span slot-scope="scope" v-if="scope.row.beyondEnterpriseName">{{scope.row.beyondEnterpriseName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
 <!--      <el-table-column label="坐标" align="center" prop="coordinates" />-->
-      <el-table-column label="备注" align="center" prop="remarks" />
+      <el-table-column label="备注" align="center" prop="remarks" >
+        <span slot-scope="scope" v-if="scope.row.remarks">{{scope.row.remarks}}</span>
+        <span v-else>-</span>
+      </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button

gassafetyprogress-web/src/views/regulation/station/index.vue

@@ -84,29 +84,53 @@
     <el-table v-loading="loading" :data="stationList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="照片" align="center"  >
-        <template scope="List">
+        <template slot-scope="List">
           <img  :src="List.row.pictureAddress" width="100px">
         </template>
       </el-table-column>
-      <el-table-column label="场站类型" align="center" prop="siteStationType" />
-      <el-table-column label="场站名称" align="center" prop="siteStationName" />
+      <el-table-column label="场站类型" align="center" prop="siteStationType" >
+        <span slot-scope="scope" v-if="scope.row.siteStationType">{{scope.row.siteStationType}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="场站名称" align="center" prop="siteStationName" >
+        <span slot-scope="scope" v-if="scope.row.siteStationName">{{scope.row.siteStationName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
       <el-table-column label="建设年代" align="center" prop="buildDate" width="180">
         <template slot-scope="scope">
           <span>{{ parseTime(scope.row.buildDate, '{y}-{m}-{d}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="建设单位" align="center" prop="buildUnit" />
-      <el-table-column label="权属单位" align="center" prop="beyondEnterpriseId" />
-      <el-table-column label="权属单位" align="center" prop="beyondEnterpriseName" />
-      <el-table-column label="经度" align="center" prop="longitude" />
-      <el-table-column label="纬度" align="center" prop="latitude" />
-      <el-table-column label="备注" align="center" prop="remarks" />
+      <el-table-column label="建设单位" align="center" prop="buildUnit" >
+        <span slot-scope="scope" v-if="scope.row.buildUnit">{{scope.row.buildUnit}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="权属单位" align="center" prop="beyondEnterpriseId" >
+        <span slot-scope="scope" v-if="scope.row.beyondEnterpriseId">{{scope.row.beyondEnterpriseId}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="权属单位" align="center" prop="beyondEnterpriseName" >
+        <span slot-scope="scope" v-if="scope.row.beyondEnterpriseName">{{scope.row.beyondEnterpriseName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="经度" align="center" prop="longitude" >
+        <span slot-scope="scope" v-if="scope.row.longitude">{{scope.row.longitude}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="纬度" align="center" prop="latitude" >
+        <span slot-scope="scope" v-if="scope.row.latitude">{{scope.row.latitude}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remarks" >
+        <span slot-scope="scope" v-if="scope.row.remarks">{{scope.row.remarks}}</span>
+        <span v-else>-</span>
+      </el-table-column>
       <el-table-column label="照片" align="center"  >
         <template slot-scope="List">
           <span
             class="dbtn"
             @click="checkFile(List.row.pictureAddress)"
-            v-if="List.row.pictureAddress != ''"
+            v-if="List.row.pictureAddress"
           >
             <i class="el-icon el-icon-view"></i>查看/下载
           </span>

gassafetyprogress-web/src/views/regulation/supervise/index.vue

@@ -88,21 +88,48 @@
           <img  :src="List.row.avatarAddress" width="100px">
         </template>
       </el-table-column>
-      <el-table-column label="姓名" align="center" prop="employedPeopleName" />
-      <el-table-column label="身份证号" align="center" prop="idCard" />
-      <el-table-column label="技能岗位证书编号" align="center" prop="certificateNum" />
-      <el-table-column label="受聘企业名称" align="center" prop="beyondEnterpriseName" />
-      <el-table-column label="发证部门" align="center" prop="registerExaminationType" />
-      <el-table-column label="任职岗位" align="center" prop="peopleOccupation" />
-      <el-table-column label="发证日期" align="center" prop="issueDate" />
-      <el-table-column label="复检日期" align="center" prop="certificateChange" />
-      <el-table-column label="备注" align="center" prop="remarks" />
+      <el-table-column label="姓名" align="center" prop="employedPeopleName" >
+        <span slot-scope="scope" v-if="scope.row.employedPeopleName">{{scope.row.employedPeopleName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="身份证号" align="center" prop="idCard" >
+        <span slot-scope="scope" v-if="scope.row.idCard">{{scope.row.idCard}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="技能岗位证书编号" align="center" prop="certificateNum" >
+        <span slot-scope="scope" v-if="scope.row.certificateNum">{{scope.row.certificateNum}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="受聘企业名称" align="center" prop="beyondEnterpriseName" >
+        <span slot-scope="scope" v-if="scope.row.beyondEnterpriseName">{{scope.row.beyondEnterpriseName}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="发证部门" align="center" prop="registerExaminationType" >
+        <span slot-scope="scope" v-if="scope.row.registerExaminationType">{{scope.row.registerExaminationType}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="任职岗位" align="center" prop="peopleOccupation" >
+        <span slot-scope="scope" v-if="scope.row.peopleOccupation">{{scope.row.peopleOccupation}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="发证日期" align="center" prop="issueDate" >
+        <span slot-scope="scope" v-if="scope.row.issueDate">{{scope.row.issueDate}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="复检日期" align="center" prop="certificateChange" >
+        <span slot-scope="scope" v-if="scope.row.certificateChange">{{scope.row.certificateChange}}</span>
+        <span v-else>-</span>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remarks" >
+        <span slot-scope="scope" v-if="scope.row.remarks">{{scope.row.remarks}}</span>
+        <span v-else>-</span>
+      </el-table-column>
       <el-table-column label="照片" align="center"  >
       <template slot-scope="List">
           <span
             class="dbtn"
             @click="checkFile(List.row.avatarAddress)"
-            v-if="List.row.avatarAddress != ''"
+            v-if="List.row.avatarAddress"
           >
             <i class="el-icon el-icon-view"></i>查看/下载
           </span>