Merge branch 'master' of ssh://111.61.77.35:15/gengdidi/gassafety-progress

gassafetyprogress-admin/src/main/java/com/zehong/web/controller/complainDeal/TComplainDealController.java

 package com.zehong.web.controller.complainDeal;
 
 import java.util.List;
+
+import com.zehong.common.core.domain.model.LoginUser;
+import com.zehong.framework.web.service.SysLoginService;
+import com.zehong.framework.web.service.TokenService;
 import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.web.bind.annotation.GetMapping;
@@ -20,6 +24,8 @@ import com.zehong.system.service.ITComplainDealService;
 import com.zehong.common.utils.poi.ExcelUtil;
 import com.zehong.common.core.page.TableDataInfo;
 
+import javax.servlet.http.HttpServletRequest;
+
 /**
  * 投诉处置Controller
  * 
@@ -32,14 +38,20 @@ public class TComplainDealController extends BaseController
 {
     @Autowired
     private ITComplainDealService tComplainDealService;
+    @Autowired
+    private TokenService tokenService;
 
     /**
      * 查询投诉处置列表
      */
     @PreAuthorize("@ss.hasPermi('complainDeal:complainDeal:list')")
     @GetMapping("/list")
-    public TableDataInfo list(TComplainDeal tComplainDeal)
+    public TableDataInfo list(TComplainDeal tComplainDeal, HttpServletRequest request)
     {
+        LoginUser loginUser = tokenService.getLoginUser(request);
+        if(loginUser.getUser().getDeptId()!=-2){
+            tComplainDeal.setComplainAssignEnterproseId(loginUser.getUser().getDeptId());
+        }
         startPage();
         List<TComplainDeal> list = tComplainDealService.selectTComplainDealList(tComplainDeal);
         return getDataTable(list);
@@ -100,4 +112,12 @@ public class TComplainDealController extends BaseController
     {
         return toAjax(tComplainDealService.deleteTComplainDealByIds(complainDealIds));
     }
+
+
+    @GetMapping("/getuserList/{enterproseId}")
+    public AjaxResult selectUserByenterproseId(@PathVariable("enterproseId") String enterproseId)
+    {
+        return AjaxResult.success(tComplainDealService.selectUserByenterproseId(enterproseId));
+    }
+
 }

gassafetyprogress-admin/src/main/java/com/zehong/web/controller/statistic/StatisticController.java

+package com.zehong.web.controller.statistic;
+
+import com.zehong.common.config.GassafetyProgressConfig;
+import com.zehong.common.constant.Constants;
+import com.zehong.common.core.domain.AjaxResult;
+import com.zehong.common.utils.StringUtils;
+import com.zehong.common.utils.file.FileUploadUtils;
+import com.zehong.common.utils.file.FileUtils;
+import com.zehong.framework.config.ServerConfig;
+import com.zehong.system.domain.THiddenDangerStandingBook;
+import com.zehong.system.domain.TTroubleStandingBook;
+import com.zehong.system.domain.form.THiddenDangerStandingBookForm;
+import com.zehong.system.domain.form.TTroubleStandingBookForm;
+import com.zehong.system.domain.vo.THiddenDangerStandingBookVo;
+import com.zehong.system.domain.vo.TTroubleStandingBookVo;
+import com.zehong.system.service.ITHiddenDangerStandingBookService;
+import com.zehong.system.service.ITTroubleStandingBookService;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.http.MediaType;
+import org.springframework.ui.ModelMap;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.multipart.MultipartFile;
+
+import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
+import java.util.List;
+
+/**
+ * 统计分析
+ * 
+ * @author zehong
+ */
+@RestController
+@RequestMapping("/statistic")
+public class StatisticController
+{
+    private static final Logger log = LoggerFactory.getLogger(StatisticController.class);
+
+    @Autowired
+    private ITTroubleStandingBookService tTroubleStandingBookService;
+    @Autowired
+    private ITHiddenDangerStandingBookService tHiddenDangerStandingBookService;
+
+    /**
+     * 燃气事故台账统计
+     */
+    @GetMapping("/troubleStatistic")
+    public AjaxResult troubleStatistic()
+    {
+        return AjaxResult.success(tTroubleStandingBookService.selectTTroubleStandingBookStatistic());
+    }
+
+    /**
+     * 隐患整治台账统计
+     */
+    @GetMapping("/hiddenStatistic")
+    public AjaxResult hiddenStatistic()
+    {
+        return AjaxResult.success(tHiddenDangerStandingBookService.selectTHiddenDangerStandingBookStatistic());
+    }
+
+}

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

@@ -47,12 +47,12 @@ public class TComplainDeal extends BaseEntity
     private Long complainAssignEnterproseId;
 
     /** 指派人 */
-    @Excel(name = "指派人")
-    private String complainAssignManId;
+    @Excel(name = "指派人id")
+    private Long complainAssignManId;
 
     /** 指派人id */
-    @Excel(name = "指派人id")
-    private Long complainAssignMan;
+    @Excel(name = "指派人")
+    private String complainAssignMan;
 
     /** 任务状态：1.派发中 2.反馈 3.归档 */
     @Excel(name = "任务状态：1.派发中 2.反馈 3.归档")
@@ -138,21 +138,21 @@ public class TComplainDeal extends BaseEntity
     {
         return complainAssignEnterproseId;
     }
-    public void setComplainAssignManId(String complainAssignManId) 
+    public void setComplainAssignManId(Long complainAssignManId)
     {
         this.complainAssignManId = complainAssignManId;
     }
 
-    public String getComplainAssignManId() 
+    public Long getComplainAssignManId()
     {
         return complainAssignManId;
     }
-    public void setComplainAssignMan(Long complainAssignMan) 
+    public void setComplainAssignMan(String complainAssignMan)
     {
         this.complainAssignMan = complainAssignMan;
     }
 
-    public Long getComplainAssignMan() 
+    public String getComplainAssignMan()
     {
         return complainAssignMan;
     }

gassafetyprogress-system/src/main/java/com/zehong/system/domain/vo/THiddenDangerStandingBookVo.java

+package com.zehong.system.domain.vo;
+
+import lombok.Data;
+
+@Data
+public class THiddenDangerStandingBookVo
+{
+    // 隐患总数
+    private int hiddenTotal;
+
+    // 一级隐患总数
+    private int oneLevelTotal;
+
+    // 二级隐患总数
+    private int twoLevelTotal;
+
+    // 三级隐患总数
+    private int threeLevelTotal;
+
+    // 已完成总数
+    private int completedTotal;
+
+    // 未完成总数
+    private int incompleteTotal;
+}

gassafetyprogress-system/src/main/java/com/zehong/system/domain/vo/TTroubleStandingBookVo.java

+package com.zehong.system.domain.vo;
+
+import lombok.Data;
+
+@Data
+public class TTroubleStandingBookVo
+{
+    // 事故总数
+    private int troubleTotal;
+
+    // 受伤总数
+    private int injuryTotal;
+
+    // 死亡总数
+    private int deathTotal;
+
+    // 事故处理办结率
+    private String completionRate;
+}

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

 package com.zehong.system.mapper;
 
 import java.util.List;
+import java.util.Map;
+import java.util.Objects;
+
 import com.zehong.system.domain.TComplainDeal;
+import org.apache.ibatis.annotations.Param;
 
 /**
  * 投诉处置Mapper接口
@@ -58,4 +62,11 @@ public interface TComplainDealMapper
      * @return 结果
      */
     public int deleteTComplainDealByIds(Long[] complainDealIds);
+
+    /**
+     * 查询公司下用户
+     * @param enterproseId
+     * @return
+     */
+    public List<Map<String,Object>> selectUserByenterproseId(@Param("enterproseId")String enterproseId);
 }

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

@@ -3,6 +3,7 @@ package com.zehong.system.mapper;
 import java.util.List;
 import com.zehong.system.domain.THiddenDangerStandingBook;
 import com.zehong.system.domain.form.THiddenDangerStandingBookForm;
+import com.zehong.system.domain.vo.THiddenDangerStandingBookVo;
 
 /**
  * 隐患整治台账Mapper接口
@@ -28,6 +29,13 @@ public interface THiddenDangerStandingBookMapper
      */
     public List<THiddenDangerStandingBook> selectTHiddenDangerStandingBookList(THiddenDangerStandingBookForm tHiddenDangerStandingBook);
 
+    /**
+     *  隐患台账统计
+     *
+     * @return 隐患整治台账集合
+     */
+    public THiddenDangerStandingBookVo selectTHiddenDangerStandingBookStatistic();
+
     /**
      * 新增隐患整治台账
      * 

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

@@ -3,6 +3,7 @@ package com.zehong.system.mapper;
 import java.util.List;
 import com.zehong.system.domain.TTroubleStandingBook;
 import com.zehong.system.domain.form.TTroubleStandingBookForm;
+import com.zehong.system.domain.vo.TTroubleStandingBookVo;
 
 /**
  * 事故台账Mapper接口
@@ -28,6 +29,13 @@ public interface TTroubleStandingBookMapper
      */
     public List<TTroubleStandingBook> selectTTroubleStandingBookList(TTroubleStandingBookForm tTroubleStandingBook);
 
+    /**
+     * 事故台账统计
+     *
+     * @return 事故台账统计
+     */
+    public TTroubleStandingBookVo selectTTroubleStandingBookStatistic();
+
     /**
      * 新增事故台账
      * 

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

 package com.zehong.system.service;
 
 import java.util.List;
+import java.util.Map;
+
 import com.zehong.system.domain.TComplainDeal;
 
 /**
@@ -58,4 +60,6 @@ public interface ITComplainDealService
      * @return 结果
      */
     public int deleteTComplainDealById(Long complainDealId);
+
+    public List<Map<String,Object>> selectUserByenterproseId(String enterproseId);
 }

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

@@ -3,6 +3,7 @@ package com.zehong.system.service;
 import java.util.List;
 import com.zehong.system.domain.THiddenDangerStandingBook;
 import com.zehong.system.domain.form.THiddenDangerStandingBookForm;
+import com.zehong.system.domain.vo.THiddenDangerStandingBookVo;
 
 /**
  * 隐患整治台账Service接口
@@ -28,6 +29,13 @@ public interface ITHiddenDangerStandingBookService
      */
     public List<THiddenDangerStandingBook> selectTHiddenDangerStandingBookList(THiddenDangerStandingBookForm tHiddenDangerStandingBook);
 
+    /**
+     *  隐患台账统计
+     *
+     * @return 隐患整治台账集合
+     */
+    public THiddenDangerStandingBookVo selectTHiddenDangerStandingBookStatistic();
+
     /**
      * 新增隐患整治台账
      * 

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

@@ -3,6 +3,7 @@ package com.zehong.system.service;
 import java.util.List;
 import com.zehong.system.domain.TTroubleStandingBook;
 import com.zehong.system.domain.form.TTroubleStandingBookForm;
+import com.zehong.system.domain.vo.TTroubleStandingBookVo;
 
 /**
  * 事故台账Service接口
@@ -28,6 +29,13 @@ public interface ITTroubleStandingBookService
      */
     public List<TTroubleStandingBook> selectTTroubleStandingBookList(TTroubleStandingBookForm tTroubleStandingBook);
 
+    /**
+     * 事故台账统计
+     *
+     * @return 事故台账统计
+     */
+    public TTroubleStandingBookVo selectTTroubleStandingBookStatistic();
+
     /**
      * 新增事故台账
      * 

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

 package com.zehong.system.service.impl;
 
 import java.util.List;
+import java.util.Map;
+
 import com.zehong.common.utils.DateUtils;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
@@ -93,4 +95,8 @@ public class TComplainDealServiceImpl implements ITComplainDealService
     {
         return tComplainDealMapper.deleteTComplainDealById(complainDealId);
     }
+    @Override
+    public  List<Map<String,Object>> selectUserByenterproseId(String enterproseId){
+        return tComplainDealMapper.selectUserByenterproseId(enterproseId);
+    }
 }

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

@@ -3,6 +3,7 @@ package com.zehong.system.service.impl;
 import java.util.List;
 import com.zehong.common.utils.DateUtils;
 import com.zehong.system.domain.form.THiddenDangerStandingBookForm;
+import com.zehong.system.domain.vo.THiddenDangerStandingBookVo;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 import com.zehong.system.mapper.THiddenDangerStandingBookMapper;
@@ -45,6 +46,16 @@ public class THiddenDangerStandingBookServiceImpl implements ITHiddenDangerStand
         return tHiddenDangerStandingBookMapper.selectTHiddenDangerStandingBookList(tHiddenDangerStandingBook);
     }
 
+    /**
+     *  隐患台账统计
+     *
+     * @return 隐患整治台账集合
+     */
+    public THiddenDangerStandingBookVo selectTHiddenDangerStandingBookStatistic()
+    {
+        return tHiddenDangerStandingBookMapper.selectTHiddenDangerStandingBookStatistic();
+    }
+
     /**
      * 新增隐患整治台账
      * 

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

@@ -3,6 +3,7 @@ package com.zehong.system.service.impl;
 import java.util.List;
 import com.zehong.common.utils.DateUtils;
 import com.zehong.system.domain.form.TTroubleStandingBookForm;
+import com.zehong.system.domain.vo.TTroubleStandingBookVo;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 import com.zehong.system.mapper.TTroubleStandingBookMapper;
@@ -45,6 +46,17 @@ public class TTroubleStandingBookServiceImpl implements ITTroubleStandingBookSer
         return tTroubleStandingBookMapper.selectTTroubleStandingBookList(tTroubleStandingBook);
     }
 
+    /**
+     * 事故台账统计
+     *
+     * @return 事故台账统计
+     */
+    @Override
+    public TTroubleStandingBookVo selectTTroubleStandingBookStatistic()
+    {
+        return tTroubleStandingBookMapper.selectTTroubleStandingBookStatistic();
+    }
+
     /**
      * 新增事故台账
      * 

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

@@ -124,4 +124,8 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             #{complainDealId}
         </foreach>
     </delete>
+    <select id="selectUserByenterproseId" resultType="java.util.HashMap">
+        SELECT user_id as id ,nick_name as nickName FROM sys_user
+        WHERE del_flag!=2 and  dept_id = #{enterproseId}
+    </select>
 </mapper>
\ No newline at end of file

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

@@ -38,6 +38,17 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             <if test="hiddenFindDateStart != null "> and hidden_find_date &gt;= #{hiddenFindDateStart}</if>
             <if test="hiddenFindDateEnd != null "> and hidden_find_date &lt;= #{hiddenFindDateEnd}</if>
         </where>
+        order by create_time desc
+    </select>
+
+    <select id="selectTHiddenDangerStandingBookStatistic" resultType="THiddenDangerStandingBookVo">
+        select COUNT(t.hidden_id) AS hiddenTotal,
+               SUM(CASE t.hidden_type WHEN '1' THEN 1 ELSE 0 END) AS oneLevelTotal,
+			   SUM(CASE t.hidden_type WHEN '2' THEN 1 ELSE 0 END) AS twoLevelTotal,
+			   SUM(CASE t.hidden_type WHEN '3' THEN 1 ELSE 0 END) AS threeLevelTotal,
+			   SUM(CASE t.remediation WHEN '1' THEN 1 ELSE 0 END) AS completedTotal,
+			   SUM(CASE t.remediation WHEN '2' THEN 1 ELSE 0 END) AS incompleteTotal
+        from (select * from t_hidden_danger_standing_book where is_del = '0') t
     </select>
     
     <select id="selectTHiddenDangerStandingBookById" parameterType="Long" resultMap="THiddenDangerStandingBookResult">

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

@@ -33,6 +33,7 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             <if test="installTimeStart != null "> and install_time &gt;= #{installTimeStart}</if>
             <if test="installTimeEnd != null "> and install_time &lt;= #{installTimeEnd}</if>
         </where>
+        order by create_time desc
     </select>
     
     <select id="selectTSafeEquipmentStandingBookById" parameterType="Long" resultMap="TSafeEquipmentStandingBookResult">

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

@@ -44,6 +44,15 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             <if test="dealDateStart != null "> and deal_date &gt;= #{dealDateStart}</if>
             <if test="dealDateEnd != null "> and deal_date &lt;= #{dealDateEnd}</if>
         </where>
+        order by create_time desc
+    </select>
+
+    <select id="selectTTroubleStandingBookStatistic" resultType="TTroubleStandingBookVo">
+        select COUNT(t.trouble_id) AS troubleTotal,
+			 SUM(t.injury_num) AS injutyTotal,
+			 SUM(t.death_num) AS deathTotal,
+			 ROUND(SUM(CASE t.is_deal WHEN '1' THEN 1 ELSE 0 END)/COUNT(t.trouble_id)*100, 1) AS completionRate
+        from (select * from t_trouble_standing_book where is_del = '0') t
     </select>
     
     <select id="selectTTroubleStandingBookById" parameterType="Long" resultMap="TTroubleStandingBookResult">

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

@@ -40,7 +40,7 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
     <select id="selectTWorkOrderList" parameterType="TWorkOrder" resultMap="TWorkOrderResult">
         <include refid="selectTWorkOrderVo"/>
         <where>  
-            <if test="workTitle != null  and workTitle != ''"> and work_title = #{workTitle}</if>
+            <if test="workTitle != null  and workTitle != ''"> and work_title like concat('%', #{workTitle}, '%')</if>
             <if test="workType != null  and workType != ''"> and work_type = #{workType}</if>
             <if test="workContent != null  and workContent != ''"> and work_content = #{workContent}</if>
             <if test="workCreateEnterpriseName != null  and workCreateEnterpriseName != ''"> and work_create_enterprise_name like concat('%', #{workCreateEnterpriseName}, '%')</if>

gassafetyprogress-web/package.json

@@ -33,11 +33,12 @@
   ],
   "repository": {},
   "dependencies": {
+    "@easydarwin/easywasmplayer": "^4.0.13",
     "@riophae/vue-treeselect": "0.4.0",
     "axios": "0.21.0",
     "clipboard": "2.0.6",
     "core-js": "^3.19.1",
-    "echarts": "4.9.0",
+    "echarts": "^5.3.0",
     "element-ui": "2.15.0",
     "file-saver": "2.0.4",
     "fuse.js": "6.4.3",

gassafetyprogress-web/public/index.html

@@ -8,7 +8,8 @@
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title><%= webpackConfig.name %></title>
     <!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
-    <script src="https://webapi.amap.com/maps?v=2.0&key=eed7ca3167f765467aa377fa78e61ece&plugin=Map3D,AMap.DistrictSearch,AMap.Scale,AMap.OverView,AMap.ToolBar,AMap.MouseTool,AMap.ControlBar,AMap.CircleEditor,AMap.PolyEditor"></script>
+    <script src="https://webapi.amap.com/maps?v=2.0&key=49fcb156d466062435d7d33437099582&plugin=Map3D,AMap.DistrictSearch,AMap.Scale,AMap.OverView,AMap.ToolBar,AMap.MouseTool,AMap.ControlBar,AMap.CircleEditor,AMap.PolyEditor"></script>
+
 	  <script src="h5player/h5player.min.js"></script>
     <style>
     html,

gassafetyprogress-web/src/api/complainDeal/complainDeal.js

@@ -51,3 +51,10 @@ export function exportComplainDeal(query) {
     params: query
   })
 }
+
+export function getUserList(cId) {
+  return request({
+    url: '/complainDeal/getuserList/' + cId,
+    method: 'get'
+  })
+}

gassafetyprogress-web/src/api/statistic/statisticAnalysis.js

+import request from '@/utils/request'
+
+// 燃气事故台账统计
+export function troubleStatistic(query) {
+  return request({
+    url: '/statistic/troubleStatistic',
+    method: 'get',
+    params: query
+  })
+}
+
+// 隐患整治台账统计
+export function hiddenStatistic(query) {
+  return request({
+    url: '/statistic/hiddenStatistic',
+    method: 'get',
+    params: query
+  })
+}

gassafetyprogress-web/src/assets/css/font.css

+@font-face {
+    font-family: "arialbd";
+    src: url('~@/assets/fonts/UnidreamLED.ttf') format('truetype');
+    font-weight: normal;
+    font-style: normal;
+}
\ No newline at end of file

gassafetyprogress-web/src/assets/fonts/font.css

+
+@font-face {
+  font-family: 'UnidreamLED';
+  src: url('UnidreamLED.ttf');
+  font-weight: normal;
+  font-style: normal;
+}
\ No newline at end of file

gassafetyprogress-web/src/assets/mapImages/changzhan.svg

+<svg id="组_2445" data-name="组 2445" xmlns="http://www.w3.org/2000/svg" width="18" height="25" viewBox="0 0 23 34.049">
+  <path id="路径_169" data-name="路径 169" d="M-2160.2,287.287a9.537,9.537,0,0,1,9.538,9.537,9.537,9.537,0,0,1-9.538,9.537,9.538,9.538,0,0,1-9.537-9.537A9.538,9.538,0,0,1-2160.2,287.287Zm0,1.467a8.069,8.069,0,0,0-8.069,8.07,8.069,8.069,0,0,0,8.069,8.07,8.069,8.069,0,0,0,8.07-8.07A8.069,8.069,0,0,0-2160.2,288.754Zm-.109,1.485a6.691,6.691,0,0,1,6.681,6.68,6.691,6.691,0,0,1-6.681,6.68,6.691,6.691,0,0,1-6.68-6.68A6.691,6.691,0,0,1-2160.309,290.239Zm.144,11.685h-.276v1.1h.276Zm-3.65-1.433-.771.772.2.2.772-.772-.2-.2Zm6.748,0-.2.2.771.772.2-.2Zm-1.874-6.328-1.808,2.094a.671.671,0,0,0-.265.286.825.825,0,0,0,.375,1.081.831.831,0,0,0,1.08-.375.723.723,0,0,0,.089-.375l.529-2.711Z" transform="translate(2171.7 -284.903)" fill="#7bf8f4"/>
+  <g id="路径_188" data-name="路径 188" fill="none">
+    <path d="M11.5,0A11.5,11.5,0,0,1,23,11.5c0,6.351-11.6,18.226-11.5,18.3S0,17.851,0,11.5A11.5,11.5,0,0,1,11.5,0Z" stroke="none"/>
+    <path d="M 11.5 0.9999980926513672 C 5.71027946472168 0.9999980926513672 1 5.710289001464844 1 11.50002861022949 C 1 15.44052600860596 6.295671463012695 22.62869071960449 11.47669506072998 28.3024730682373 C 12.68497657775879 26.95182228088379 15.33078575134277 23.97880554199219 17.65543937683105 20.72857856750488 C 19.63740921020508 17.95747756958008 22 14.10697841644287 22 11.50002861022949 C 22 5.710289001464844 17.28972053527832 0.9999980926513672 11.5 0.9999980926513672 M 11.5 -1.9073486328125e-06 C 17.85127067565918 -1.9073486328125e-06 23 5.148738861083984 23 11.50002861022949 C 23 17.82768249511719 11.48916530609131 29.63789749145508 11.49940204620361 29.80171585083008 C 11.36462783813477 29.63818168640137 0 17.7873649597168 0 11.50002861022949 C 0 5.148738861083984 5.14872932434082 -1.9073486328125e-06 11.5 -1.9073486328125e-06 Z M 11.49940204620361 29.80171585083008 C 11.50076866149902 29.80337524414062 11.50098419189453 29.8038387298584 11.5 29.80305862426758 C 11.49963855743408 29.80277252197266 11.49944019317627 29.80232810974121 11.49940204620361 29.80171585083008 Z" stroke="none" fill="#7bf8f4"/>
+  </g>
+  <path id="多边形_35" data-name="多边形 35" d="M4.524,0,9.049,6.033H0Z" transform="translate(16.59 29.951) rotate(180)" fill="#7bf8f4"/>
+</svg>

gassafetyprogress-web/src/assets/mapImages/famen.svg

+<svg id="组_2447" data-name="组 2447" xmlns="http://www.w3.org/2000/svg" width="18" height="25" viewBox="0 0 23.304 34.295">
+  <path id="路径_168" data-name="路径 168" d="M-1603.123-57.691a9.445,9.445,0,0,0-9.234-8.255,9.5,9.5,0,0,0-9.333,9.663,9.5,9.5,0,0,0,9.333,9.663,9.445,9.445,0,0,0,9.234-8.255h.76v-2.817Zm-16.383.73a7.312,7.312,0,0,1,6.469-6.722v1.475a5.871,5.871,0,0,0-5.045,5.246Zm6.469,8.079a7.311,7.311,0,0,1-6.465-6.67h1.425a5.869,5.869,0,0,0,5.039,5.2Zm-.242-6.99v3.214h-1.149v-7.262h4.784V-58.9h-3.635v2.014h3.429v1.017Zm1.6,6.99v-1.475a5.869,5.869,0,0,0,5.039-5.2h1.425A7.311,7.311,0,0,1-1611.677-48.883Zm5.045-8.079a5.871,5.871,0,0,0-5.045-5.246v-1.475a7.313,7.313,0,0,1,6.469,6.722Z" transform="translate(1624.104 68.362)" fill="#7bf8f4"/>
+  <g id="路径_185" data-name="路径 185" fill="none">
+    <path d="M11.652,0A11.652,11.652,0,0,1,23.3,11.652c0,6.435-11.75,18.467-11.652,18.545S0,18.087,0,11.652A11.652,11.652,0,0,1,11.652,0Z" stroke="none"/>
+    <path d="M 11.65185546875 0.9999942779541016 C 5.77839469909668 0.9999942779541016 0.9999961853027344 5.778413772583008 0.9999961853027344 11.65188407897949 C 0.9999961853027344 15.65063667297363 6.374073028564453 22.94361305236816 11.62834739685059 28.69588470458984 C 12.84814071655273 27.33243751525879 15.5371789932251 24.3126106262207 17.89928436279297 21.01001358032227 C 19.90856552124023 18.20073509216309 22.3037052154541 14.29677486419678 22.3037052154541 11.65188407897949 C 22.3037052154541 5.778413772583008 17.52530479431152 0.9999942779541016 11.65185546875 0.9999942779541016 M 11.65185546875 -5.7220458984375e-06 C 18.08699607849121 -5.7220458984375e-06 23.3037052154541 5.216724395751953 23.3037052154541 11.65188407897949 C 23.3037052154541 18.06309509277344 11.64087867736816 30.02925682067871 11.65124988555908 30.19523429870605 C 11.5146951675415 30.02953720092773 -3.814697265625e-06 18.02224731445312 -3.814697265625e-06 11.65188407897949 C -3.814697265625e-06 5.216724395751953 5.216714859008789 -5.7220458984375e-06 11.65185546875 -5.7220458984375e-06 Z M 11.65124988555908 30.19523429870605 C 11.65263366699219 30.19691467285156 11.65285301208496 30.19738388061523 11.65185546875 30.19659423828125 C 11.6514892578125 30.19630432128906 11.65128803253174 30.19585609436035 11.65124988555908 30.19523429870605 Z" stroke="none" fill="#7bf8f4"/>
+  </g>
+  <path id="多边形_32" data-name="多边形 32" d="M4.53,0l4.53,6.039H0Z" transform="translate(16.306 30.197) rotate(180)" fill="#7bf8f4"/>
+</svg>

gassafetyprogress-web/src/assets/mapImages/jiankong.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="18" height="25" viewBox="0 0 23 34.049">
+  <g id="组_2451" data-name="组 2451" transform="translate(7189 23993)">
+    <g id="路径_188" data-name="路径 188" transform="translate(-7189 -23993)" fill="none">
+      <path d="M11.5,0A11.5,11.5,0,0,1,23,11.5c0,6.351-11.6,18.226-11.5,18.3S0,17.851,0,11.5A11.5,11.5,0,0,1,11.5,0Z" stroke="none"/>
+      <path d="M 11.5 0.9999980926513672 C 5.71027946472168 0.9999980926513672 1 5.710289001464844 1 11.50002861022949 C 1 15.44052600860596 6.295671463012695 22.62869071960449 11.47669506072998 28.3024730682373 C 12.68497657775879 26.95182228088379 15.33078575134277 23.97880554199219 17.65543937683105 20.72857856750488 C 19.63740921020508 17.95747756958008 22 14.10697841644287 22 11.50002861022949 C 22 5.710289001464844 17.28972053527832 0.9999980926513672 11.5 0.9999980926513672 M 11.5 -1.9073486328125e-06 C 17.85127067565918 -1.9073486328125e-06 23 5.148738861083984 23 11.50002861022949 C 23 17.82768249511719 11.48916530609131 29.63789749145508 11.49940204620361 29.80171585083008 C 11.36462783813477 29.63818168640137 0 17.7873649597168 0 11.50002861022949 C 0 5.148738861083984 5.14872932434082 -1.9073486328125e-06 11.5 -1.9073486328125e-06 Z M 11.49940204620361 29.80171585083008 C 11.50076866149902 29.80337524414062 11.50098419189453 29.8038387298584 11.5 29.80305862426758 C 11.49963855743408 29.80277252197266 11.49944019317627 29.80232810974121 11.49940204620361 29.80171585083008 Z" stroke="none" fill="#7bf8f4"/>
+    </g>
+    <path id="多边形_35" data-name="多边形 35" d="M4.524,0,9.049,6.033H0Z" transform="translate(-7172.411 -23963.049) rotate(180)" fill="#7bf8f4"/>
+    <path id="路径_1298" data-name="路径 1298" d="M21.1,8.659v7.97l-2.46-.621V13.532l-5.534-1.863V9.8h-.613V8.563l-3.428.807,1.315-1.4-.129-.791c-.1.323-.282.54-.508.573-.476.081-.992-.67-1.154-1.67-.145-.928.065-1.75.484-1.92L7.742,2.577l-.1-.04-1.888.307.016.452,1.3-.21L7.4,5.191l-.694.1L5.168,3.593,5.12,2.327,6.5,2.109l.9-.145.791-.129L16.51.512l.976.371,1.452,2.549L10.025,4.86a3.109,3.109,0,0,1,.21.549L18.2,4.134,18.624,6.8,17.285,8.062l-2.323.508V9.813h-.613v1.242L18.656,12.3V9.2ZM9.323,5.175c-.21.032-.315.411-.25.839s.29.758.5.726.315-.411.25-.839S9.532,5.142,9.323,5.175ZM7.943,8.119l-.411-2.6-.6.1.46,2.864,1.549.96.46-.419Z" transform="translate(-7191.327 -23989.652)" fill="#7bf8f4"/>
+  </g>
+</svg>

gassafetyprogress-web/src/assets/mapImages/tiaoyaxiang.svg

+<svg id="组_2448" data-name="组 2448" xmlns="http://www.w3.org/2000/svg" width="18" height="25" viewBox="0 0 23 33.9">
+  <path id="路径_173" data-name="路径 173" d="M-1877.09-49.461a9.537,9.537,0,0,0-9.537,9.537,9.537,9.537,0,0,0,9.537,9.537,9.537,9.537,0,0,0,9.537-9.537A9.537,9.537,0,0,0-1877.09-49.461Zm5.722,12.875h-.954v1.431h-1.43v.954h-1.907v-.954h-2.384v.954h-1.907v-.954h-1.431v-1.431h-.954v-6.676h.954v-1.431h1.431v-.477h1.431v.477h.953v-.477h1.431v.477h.954v-.477h1.431v.477h1.43v1.431h.954Zm-9.537,0h8.107v-7.153h-8.107Zm7.153-6.676h.477v6.2h-.477Zm-.954,0h.477v6.2h-.477Zm-.953,0h.477v6.2h-.477Zm-.954,0h.477v6.2h-.477Zm-.954,0h.477v6.2h-.477Zm-.953,0h.477v6.2h-.477Zm-.954,0h.477v6.2h-.477Zm-.954,0h.477v6.2h-.477Z" transform="translate(1888.59 51.845)" fill="#7bf8f4"/>
+  <g id="路径_186" data-name="路径 186" fill="none">
+    <path d="M11.5,0A11.5,11.5,0,0,1,23,11.5c0,6.351-11.6,18.226-11.5,18.3S0,17.851,0,11.5A11.5,11.5,0,0,1,11.5,0Z" stroke="none"/>
+    <path d="M 11.5 0.9999942779541016 C 5.71027946472168 0.9999942779541016 1 5.710294723510742 1 11.50003433227539 C 1 15.44047451019287 6.295700073242188 22.62868881225586 11.47670364379883 28.30246925354004 C 12.68497562408447 26.95181846618652 15.33078575134277 23.97880172729492 17.65543937683105 20.72857475280762 C 19.63740921020508 17.95747375488281 22 14.10698509216309 22 11.50003433227539 C 22 5.710294723510742 17.28972053527832 0.9999942779541016 11.5 0.9999942779541016 M 11.5 -5.7220458984375e-06 C 17.85128021240234 -5.7220458984375e-06 23 5.148744583129883 23 11.50003433227539 C 23 17.82767868041992 11.48916530609131 29.63789367675781 11.49940204620361 29.80171203613281 C 11.36462783813477 29.63816833496094 0 17.78736114501953 0 11.50003433227539 C 0 5.148744583129883 5.14872932434082 -5.7220458984375e-06 11.5 -5.7220458984375e-06 Z M 11.49940204620361 29.80171203613281 C 11.50076866149902 29.80337142944336 11.50098419189453 29.80383491516113 11.5 29.80305480957031 C 11.49963855743408 29.80276870727539 11.49944019317627 29.80232429504395 11.49940204620361 29.80171203613281 Z" stroke="none" fill="#7bf8f4"/>
+  </g>
+  <path id="多边形_33" data-name="多边形 33" d="M4.471,0,8.941,5.961H0Z" transform="translate(16.094 29.803) rotate(180)" fill="#7bf8f4"/>
+</svg>

gassafetyprogress-web/src/assets/mapImages/user.svg

+<svg id="组_2446" data-name="组 2446" xmlns="http://www.w3.org/2000/svg" width="18" height="25" viewBox="0 0 23 33.9">
+  <path id="路径_170" data-name="路径 170" d="M-1583.57,295.955a3.719,3.719,0,0,0-3.714,3.713,3.719,3.719,0,0,0,3.714,3.713,3.719,3.719,0,0,0,3.713-3.713,3.719,3.719,0,0,0-3.713-3.713Zm2.287,4.15a.608.608,0,0,1-.437.184h-1.862a.618.618,0,0,1-.621-.621V297.2a.618.618,0,0,1,.621-.621.608.608,0,0,1,.437.184.608.608,0,0,1,.184.437v1.862h1.242a.618.618,0,0,1,.621.621.6.6,0,0,1-.184.425Zm-8.966-5.047a4.143,4.143,0,0,0,4.161,0,4.166,4.166,0,0,0,2.081-3.61,4.161,4.161,0,0,0-4.162-4.161,4.16,4.16,0,0,0-4.161,4.161A4.179,4.179,0,0,0-1590.249,295.058Zm1.724,4.61a4.872,4.872,0,0,1,.391-1.931,5.639,5.639,0,0,1,.54-.966,4.67,4.67,0,0,1-.575.035,5.145,5.145,0,0,1-2.081-.425,5.006,5.006,0,0,1-.943-.517,1.2,1.2,0,0,0-1.345-.011,7.8,7.8,0,0,0-3.414,6.265v.069a.6.6,0,0,0,.6.575h7.92a5.215,5.215,0,0,1-.7-1.161,5.035,5.035,0,0,1-.391-1.931Z" transform="translate(1599.528 -284.903)" fill="#7bf8f4" opacity="0.996"/>
+  <g id="路径_190" data-name="路径 190" fill="none">
+    <path d="M11.5,0A11.5,11.5,0,0,1,23,11.5c0,6.351-11.6,18.226-11.5,18.3S0,17.851,0,11.5A11.5,11.5,0,0,1,11.5,0Z" stroke="none"/>
+    <path d="M 11.5 1.000003814697266 C 5.71027946472168 1.000003814697266 1 5.710294723510742 1 11.50003433227539 C 1 15.44052124023438 6.295677185058594 22.62869262695312 11.47670078277588 28.30246353149414 C 12.68496322631836 26.95182609558105 15.33070659637451 23.97891044616699 17.65538024902344 20.72865295410156 C 19.63738059997559 17.95753479003906 22 14.10700416564941 22 11.50003433227539 C 22 5.710294723510742 17.28972053527832 1.000003814697266 11.5 1.000003814697266 M 11.5 3.814697265625e-06 C 17.85128021240234 3.814697265625e-06 23 5.148744583129883 23 11.50003433227539 C 23 17.82767677307129 11.48916530609131 29.63790130615234 11.49940204620361 29.80170249938965 C 11.36462783813477 29.63816833496094 0 17.78736114501953 0 11.50003433227539 C 0 5.148744583129883 5.14872932434082 3.814697265625e-06 11.5 3.814697265625e-06 Z M 11.49940204620361 29.80170249938965 C 11.50076866149902 29.80335998535156 11.50098419189453 29.80382347106934 11.5 29.80304336547852 C 11.49963855743408 29.80275726318359 11.49944019317627 29.80231475830078 11.49940204620361 29.80170249938965 Z" stroke="none" fill="#7bf8f4"/>
+  </g>
+  <path id="多边形_37" data-name="多边形 37" d="M4.471,0,8.941,5.961H0Z" transform="translate(16.094 29.803) rotate(180)" fill="#7bf8f4"/>
+</svg>

gassafetyprogress-web/src/assets/mapImages/yalibiao.svg

+<svg id="组_2449" data-name="组 2449" xmlns="http://www.w3.org/2000/svg" width="18" height="25" viewBox="0 0 23 33.9">
+  <g id="路径_186" data-name="路径 186" fill="none">
+    <path d="M11.5,0A11.5,11.5,0,0,1,23,11.5c0,6.351-11.6,18.226-11.5,18.3S0,17.851,0,11.5A11.5,11.5,0,0,1,11.5,0Z" stroke="none"/>
+    <path d="M 11.5 0.9999942779541016 C 5.71027946472168 0.9999942779541016 1 5.710294723510742 1 11.50003433227539 C 1 15.44047451019287 6.295700073242188 22.62868881225586 11.47670364379883 28.30246925354004 C 12.68497562408447 26.95181846618652 15.33078575134277 23.97880172729492 17.65543937683105 20.72857475280762 C 19.63740921020508 17.95747375488281 22 14.10698509216309 22 11.50003433227539 C 22 5.710294723510742 17.28972053527832 0.9999942779541016 11.5 0.9999942779541016 M 11.5 -5.7220458984375e-06 C 17.85127067565918 -5.7220458984375e-06 23 5.148744583129883 23 11.50003433227539 C 23 17.82767868041992 11.48916530609131 29.63789367675781 11.49940204620361 29.80171203613281 C 11.36462783813477 29.63816833496094 0 17.78736114501953 0 11.50003433227539 C 0 5.148744583129883 5.14872932434082 -5.7220458984375e-06 11.5 -5.7220458984375e-06 Z M 11.49940204620361 29.80171203613281 C 11.50076866149902 29.80337142944336 11.50098419189453 29.80383491516113 11.5 29.80305480957031 C 11.49963855743408 29.80276870727539 11.49944019317627 29.80232429504395 11.49940204620361 29.80171203613281 Z" stroke="none" fill="#7bf8f4"/>
+  </g>
+  <path id="多边形_33" data-name="多边形 33" d="M4.471,0,8.941,5.961H0Z" transform="translate(16.094 29.804) rotate(180)" fill="#7bf8f4"/>
+  <path id="路径_966" data-name="路径 966" d="M99.476,156.616a6.028,6.028,0,0,1-1.622,2.267.9.9,0,0,1-.583.252.8.8,0,0,1-.567-.236.765.765,0,0,1-.236-.535.705.705,0,0,1,.236-.535,6.035,6.035,0,0,0,1.748-4.377A5.726,5.726,0,0,0,96.7,149.2a6.645,6.645,0,0,0-9.085.016,5.836,5.836,0,0,0-1.763,4.283,6.134,6.134,0,0,0,1.952,4.346.765.765,0,0,1,.236.535.705.705,0,0,1-.236.535.748.748,0,0,1-.567.236.8.8,0,0,1-.567-.236,7.414,7.414,0,0,1-2.047-2.724,7.528,7.528,0,0,1,1.748-8.266,7.836,7.836,0,0,1,2.629-1.685,9.392,9.392,0,0,1,6.361-.063,6.113,6.113,0,0,1,2.141,1.26c2.866,2.425,3.023,5.9,2.047,8.943Zm-7.337-7.684a4.366,4.366,0,0,0-4.377,4.267.5.5,0,0,1-.236.5.527.527,0,0,1-.567,0,.513.513,0,0,1-.236-.5,5.254,5.254,0,0,1,1.575-3.684,5.533,5.533,0,0,1,7.7,0,5.208,5.208,0,0,1,1.606,3.732.5.5,0,0,1-.236.5.527.527,0,0,1-.567,0,.513.513,0,0,1-.236-.5,4.382,4.382,0,0,0-4.424-4.314Zm.913,5.4a1.113,1.113,0,0,1-1.559-.047,1.054,1.054,0,0,1-.268-1.149l-1.212-1.2a.418.418,0,0,1,0-.6.479.479,0,0,1,.63,0l1.228,1.2a1.162,1.162,0,0,1,1.2.268,1.024,1.024,0,0,1,.331.771A1.093,1.093,0,0,1,93.052,154.333Zm.016-.016" transform="translate(-80.582 -142.727)" fill="#7bf8f4"/>
+</svg>

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

+/**
+ * 通用css样式布局处理
+ * Copyright (c) 2019 gassafety
+ */
+
+/** 基础通用 **/
+.pt5 {
+  padding-top: 5px;
+}
+.pr5 {
+  padding-right: 5px;
+}
+.pb5 {
+  padding-bottom: 5px;
+}
+.mt5 {
+  margin-top: 5px;
+}
+.mr5 {
+  margin-right: 5px;
+}
+.mb5 {
+  margin-bottom: 5px;
+}
+.mb8 {
+  margin-bottom: 8px;
+}
+.ml5 {
+  margin-left: 5px;
+}
+.mt10 {
+  margin-top: 10px;
+}
+.mr10 {
+  margin-right: 10px;
+}
+.mb10 {
+  margin-bottom: 10px;
+}
+.ml0 {
+  margin-left: 10px;
+}
+.mt20 {
+  margin-top: 20px;
+}
+.mr20 {
+  margin-right: 20px;
+}
+.mb20 {
+  margin-bottom: 20px;
+}
+.m20 {
+  margin-left: 20px;
+}
+
+.el-dialog:not(.is-fullscreen) {
+  margin-top: 6vh !important;
+}
+.bigwindow {
+  // 全局表格样式
+  .el-table {
+    .el-table__header-wrapper,
+    .el-table__fixed-header-wrapper {
+      th {
+        word-break: break-word;
+        background-color: #053b6a;
+        color: #fff;
+        height: 40px;
+        font-size: 13px;
+      }
+    }
+    .el-table__body-wrapper {
+      .el-table__row:nth-child(2n + 1) {
+        background-color: #e6e6e6;
+        // &:hover {
+        //   td {
+        //     background-color: #f4f4f4;
+        //   }
+        // }
+        td {
+          .cell {
+            color: #525252;
+          }
+        }
+      }
+      .el-table__row:nth-child(2n) {
+        background-color: #f4f4f4;
+        // &:hover {
+        //   td {
+        //     background-color: #e6e6e6;
+        //   }
+        // }
+        td {
+          .cell {
+            color: #053b6a;
+          }
+        }
+      }
+    }
+    .el-table__body-wrapper {
+      .el-button [class*="el-icon-"] + span {
+        margin-left: 1px;
+      }
+    }
+  }
+
+  // gis地图中底部table样式
+  .drawer {
+    .el-button {
+      color: #ffffff;
+      &:not(.is-disabled):hover {
+        color: rgb(46, 231, 231);
+      }
+      &.is-disabled {
+        border-color: #ccccccc3 !important;
+        color: #ccccccc3;
+      }
+    }
+  }
+  .right-bottom-data-left {
+    .el-table {
+      background-color: rgba(0, 0, 0, 0) !important;
+      .el-table__body {
+        width: 100% !important;
+      }
+      &::before {
+        height: 0px !important;
+      }
+      td {
+        border-bottom: none !important;
+      }
+
+      .el-table__header-wrapper,
+      .el-table__fixed-header-wrapper {
+        tr {
+          background-color: #213b52 !important;
+        }
+        th {
+          word-break: break-word;
+          background-color: #213b52 !important;
+          color: rgba(123, 248, 244, 1);
+          height: 30px;
+          font-size: 13px;
+          padding: 0;
+          &.is-leaf {
+            border-bottom: none;
+          }
+        }
+      }
+      .el-table__body-wrapper {
+        .el-table__row:nth-child(2n + 1) {
+          background-color: #063157;
+          &:hover td {
+            background-color: #7bf8f430 !important;
+          }
+          td {
+            .cell {
+              // color: #525252;
+              color: rgba(123, 248, 244, 1);
+            }
+          }
+        }
+        .el-table__row:nth-child(2n) {
+          background-color: #213b52;
+          &:hover td {
+            background-color: #7bf8f430 !important;
+          }
+          td {
+            .cell {
+              color: #fff;
+            }
+          }
+        }
+      }
+      .el-table__body-wrapper {
+        .el-button [class*="el-icon-"] + span {
+          // margin-left: 1px;
+        }
+      }
+    }
+    // 滚动条样式
+    .el-table--scrollable-y {
+      .el-table__body-wrapper {
+        &::-webkit-scrollbar {
+          width: 10px;
+          background: #012a53;
+          position: absolute;
+          top: 0;
+        }
+        &::-webkit-scrollbar-thumb {
+          /*滚动条里面小方块*/
+          // border-radius: 10px;
+          // box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+          background: #00000052;
+          border-radius: 8px;
+        }
+        &::-webkit-scrollbar-track {
+          /*滚动条里面轨道*/
+          // box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+          // border-radius: 10px;
+          // background-color: red;
+        }
+
+        &::-webkit-scrollbar-button:start {
+          // overflow: hidden;
+        }
+        &::-webkit-scrollbar-button:end {
+          // overflow: hidden;
+        }
+
+        // overflow-y: none !important;
+      }
+    }
+  }
+  // gis地图右上角的滚动条隐藏
+  .rightPic {
+    .el-table {
+      .el-table__body-wrapper {
+        overflow-y: hidden;
+        overflow-x: hidden;
+      }
+    }
+  }
+  .videoView {
+    .el-dialog__body {
+      padding: 0;
+    }
+  }
+  // center下的分页
+  .myCenter {
+    .el-pagination {
+      button:disabled {
+        background-color: rgba(0, 0, 0, 0);
+      }
+      .el-pager li {
+        background-color: rgba(0, 0, 0, 0);
+        color: #fff;
+        cursor: pointer;
+        &.active {
+          color: #1890ff;
+        }
+        &:hover {
+          color: #7bf8f4;
+        }
+      }
+      .btn-prev,
+      .el-pagination .btn-next {
+        background-color: rgba(0, 0, 0, 0);
+      }
+    }
+    .el-pagination .btn-prev,
+    .el-pagination .btn-next {
+      background-color: rgba(0, 0, 0, 0);
+    }
+    // 禁用状态的左箭头
+    button[disabled] {
+      &:hover {
+        .el-icon-arrow-left,
+        .el-icon-arrow-right {
+          &::before {
+            color: #909399 !important;
+          }
+        }
+      }
+      .el-icon-arrow-left,
+      .el-icon-arrow-right {
+        &::before {
+          color: #909399;
+        }
+      }
+    }
+    button {
+      &:hover {
+        .el-icon-arrow-left,
+        .el-icon-arrow-right {
+          &::before {
+            color: #7bf8f4 !important;
+          }
+        }
+      }
+    }
+    // 平常状态下的
+    .el-icon-arrow-left,
+    .el-icon-arrow-right {
+      &::before {
+        color: #ffffff;
+      }
+    }
+    .el-pagination__jump {
+      color: #fff;
+    }
+    .el-input__inner {
+      background-color: rgba(0, 0, 0, 0);
+      border-color: #1890ff;
+      color: #fff;
+    }
+  }
+  // gis地图里抽屉的搜索样式
+  .search-input {
+    .el-input__inner {
+      height: 28px;
+      min-height: 28px;
+      outline: #053b6a;
+      background: none !important;
+      color: #fff;
+      &:focus {
+        // outline: #053b6a;
+        border-color: #fff;
+      }
+    }
+  }
+  /** 表单布局 **/
+  .form-header {
+    font-size: 15px;
+    color: #6379bb;
+    border-bottom: 1px solid #ddd;
+    margin: 8px 10px 25px 10px;
+    padding-bottom: 5px;
+  }
+
+  /** 表格布局 **/
+  .pagination-container {
+    position: relative;
+    height: 25px;
+    margin-bottom: 10px;
+    margin-top: 15px;
+    padding: 10px 20px !important;
+  }
+
+  /* tree border */
+  .tree-border {
+    margin-top: 5px;
+    border: 1px solid #e5e6e7;
+    background: #ffffff none;
+    border-radius: 4px;
+  }
+
+  .pagination-container .el-pagination {
+    right: 0;
+    position: absolute;
+  }
+
+  .el-table .fixed-width .el-button--mini {
+    padding-left: 0;
+    padding-right: 0;
+    width: inherit;
+  }
+
+  .el-tree-node__content > .el-checkbox {
+    margin-right: 8px;
+  }
+
+  .list-group-striped > .list-group-item {
+    border-left: 0;
+    border-right: 0;
+    border-radius: 0;
+    padding-left: 0;
+    padding-right: 0;
+  }
+
+  .list-group {
+    padding-left: 0px;
+    list-style: none;
+  }
+
+  .list-group-item {
+    border-bottom: 1px solid #e7eaec;
+    border-top: 1px solid #e7eaec;
+    margin-bottom: -1px;
+    padding: 11px 0px;
+    font-size: 13px;
+  }
+
+  .pull-right {
+    float: right !important;
+  }
+
+  .el-card__header {
+    padding: 14px 15px 7px;
+    min-height: 40px;
+  }
+
+  .el-card__body {
+    padding: 15px 20px 20px 20px;
+  }
+
+  .card-box {
+    padding-right: 15px;
+    padding-left: 15px;
+    margin-bottom: 10px;
+  }
+
+  /* button color */
+  .el-button--cyan.is-active,
+  .el-button--cyan:active {
+    background: #20b2aa;
+    border-color: #20b2aa;
+    color: #ffffff;
+  }
+
+  .el-button--cyan:focus,
+  .el-button--cyan:hover {
+    background: #48d1cc;
+    border-color: #48d1cc;
+    color: #ffffff;
+  }
+
+  .el-button--cyan {
+    background-color: #20b2aa;
+    border-color: #20b2aa;
+    color: #ffffff;
+  }
+
+  /* text color */
+  .text-navy {
+    color: #1ab394;
+  }
+
+  .text-primary {
+    color: inherit;
+  }
+
+  .text-success {
+    color: #1c84c6;
+  }
+
+  .text-info {
+    color: #23c6c8;
+  }
+
+  .text-warning {
+    color: #f8ac59;
+  }
+
+  .text-danger {
+    color: #ed5565;
+  }
+
+  .text-muted {
+    color: #888888;
+  }
+
+  /* image */
+  .img-circle {
+    border-radius: 50%;
+  }
+
+  .img-lg {
+    width: 120px;
+    height: 120px;
+  }
+
+  .avatar-upload-preview {
+    position: absolute;
+    top: 50%;
+    transform: translate(50%, -50%);
+    width: 200px;
+    height: 200px;
+    border-radius: 50%;
+    box-shadow: 0 0 4px #ccc;
+    overflow: hidden;
+  }
+
+  /* 拖拽列样式 */
+  .sortable-ghost {
+    opacity: 0.8;
+    color: #fff !important;
+    background: #42b983 !important;
+  }
+
+  .top-right-btn {
+    position: relative;
+    float: right;
+  }
+  // 上传按钮
+  .hide {
+    .el-upload--picture-card {
+      display: none;
+    }
+  }
+  // 所有的提示框标题
+  .el-dialog__header {
+    padding-bottom: 0;
+    padding: 0px;
+    height: 51px;
+    line-height: 50px;
+    background-color: #053b6a;
+    .el-dialog__title {
+      display: inline-block;
+      margin-left: 22px;
+      color: #fff;
+    }
+    .el-dialog__headerbtn {
+      i {
+        color: #fff;
+      }
+    }
+    // background-color: ;
+  }
+
+  // gis地图内的bottom列表，如果隐藏在出现会有一个bug，这样可以解决
+  .b {
+    & > .el-bottom {
+      .el-table__body-wrapper {
+        height: 140px !important;
+      }
+    }
+  }
+
+  // center
+  .myCenter {
+    .el-bottom {
+      .el-table__body-wrapper {
+        max-height: 600px !important;
+      }
+    }
+  }
+
+  .rightPic {
+    .el-bottom {
+      .el-table__body-wrapper {
+        max-height: 250px !important;
+      }
+    }
+  }
+  // 设备巡检详情页表格样式
+  .inspectiondetail {
+    .el-table {
+      .el-table__header-wrapper,
+      .el-table__fixed-header-wrapper {
+        th {
+          word-break: break-word;
+          background-color: #1181e8;
+          color: #fff;
+          height: 40px;
+          font-size: 14px;
+        }
+      }
+      .el-table__body-wrapper {
+        .el-table__row:nth-child(2n + 1) {
+          background-color: #e6e6e6;
+          // &:hover {
+          //   td {
+          //     background-color: #f4f4f4;
+          //   }
+          // }
+          td {
+            .cell {
+              color: #053b6a;
+            }
+          }
+        }
+        .el-table__row:nth-child(2n) {
+          background-color: #f4f4f4;
+          // &:hover {
+          //   td {
+          //     background-color: #e6e6e6;
+          //   }
+          // }
+          td {
+            .cell {
+              color: #053b6a;
+            }
+          }
+        }
+      }
+      .el-table__body-wrapper {
+        .el-button [class*="el-icon-"] + span {
+          margin-left: 1px;
+        }
+      }
+    }
+  }
+  .zzz {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  // 滚动条公共样式
+  .scrollStyle {
+    &::-webkit-scrollbar {
+      width: 10px;
+      background: rgba(6, 29, 51, 0.8);
+
+      // position: absolute;
+      // top: 0;
+    }
+    &::-webkit-scrollbar-thumb {
+      /*滚动条里面小方块*/
+      // border-radius: 10px;
+      // box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+      background: #00000053;
+
+      border-radius: 8px;
+    }
+    &::-webkit-scrollbar-track {
+      /*滚动条里面轨道*/
+      // box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+      // border-radius: 10px;
+      // background-color: red;
+    }
+
+    &::-webkit-scrollbar-button:start {
+      // overflow: hidden;
+    }
+    &::-webkit-scrollbar-button:end {
+      // overflow: hidden;
+    }
+
+    // overflow-y: none !important;
+  }
+  .amap-info {
+    position: fixed !important;
+    z-index: 999 !important;
+  }
+}

gassafetyprogress-web/src/components/bigWindow/Center.vue

+<template>
+  <div v-if="show" class="myCenter">
+    <div class="left">
+      <div class="title-wrapper">
+        <div class="title">报警器列表</div>
+        <div class="close" @click="close">
+          <img src="@/assets/mapImages/closeBtn.png" alt="" />
+        </div>
+      </div>
+
+      <div class="bottom right-bottom-data-left">
+
+        <el-table
+          size="mini"
+          :data="tableData"
+          class="el-bottom"
+        >
+        <!-- :height="tableHeight" -->
+        <el-table-column prop="detectorCode" label="设备编号" width="">
+            <template slot-scope="scope">
+              <div :title="scope.row.deviceNo" class="zzz">
+                {{ scope.row.deviceNo }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column prop="deviceType" label="设备类型" width="">
+            <template slot-scope="scope">
+              <div :title="scope.row.deviceType" class="zzz">
+                {{ scope.row.deviceType == 1 ? "流量计" : "压力表" }}
+              </div>
+            </template>
+          </el-table-column>
+
+          <el-table-column prop="deviceState" label="设备状态" width="">
+            <template slot-scope="scope">
+              <div v-if="scope.row.deviceState == 1">正常</div>
+              <div style="color: red" v-else-if="scope.row.deviceState == 2">
+                报警
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column prop="reportTime" label="报警时间" width="">
+            <template slot-scope="scope">
+              <div>{{ scope.row.reportTime }}</div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div>
+          <el-pagination
+            @current-change="handleCurrentChangvale"
+            :page-size="pageSize"
+            :current-page="pageCurrent"
+            layout="prev, pager, next, jumper"
+            :total="total"
+            :hide-on-single-page="total < pageSize"
+          >
+          </el-pagination>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    centerData: {
+      type: Array,
+    },
+    show: {
+      type: Boolean,
+    },
+  },
+  data() {
+    return {
+      // 动画效果的切换
+      tableHeight: 600,
+      pageSize: 16,
+      pageCurrent: 1,
+    };
+  },
+  created() {
+    // this.getList();
+  },
+
+  watch: {
+    // 当组件显示的时候
+    show(newVal) {
+      if (newVal) {
+        this.pageCurrent = 1;
+      }
+    },
+  },
+  computed: {
+    total() {
+      return this.centerData.length;
+    },
+    tableData() {
+      return this.centerData.filter((item, index) => {
+        return (
+          index < this.pageCurrent * this.pageSize &&
+          index >= (this.pageCurrent - 1) * this.pageSize
+        );
+      });
+    },
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(val);
+      this.pageCurrent = val;
+    },
+    handleCurrentChangvale(val) {
+      console.log(val);
+      this.pageCurrent = val;
+    },
+    close() {
+      this.$parent.centerShow(false);
+    },
+  },
+};
+</script>
+
+<style lang="scss" >
+.myCenter {
+  // width: 978px;
+  max-height: 600px;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  margin-top: -300px;
+  margin-left: -500px;
+  // background-color: #fff;
+  display: flex;
+  justify-content: space-between;
+  z-index: 9999;
+
+  & > div {
+  }
+  .left {
+    // width: 100px;
+    max-height: 598px;
+    margin-right: 12px;
+    // box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.16);
+    // background-color: #fff;
+    // color: #fff;
+    font-size: 14px;
+    font-weight: 400;
+    .title-wrapper {
+      // width: 99%;
+      width: 100%;
+      height: 30px;
+      display: flex;
+      justify-content: space-between;
+      background: #1890ff;
+      padding: 5px;
+      .title {
+        width: 100%;
+        color: #fff;
+        text-align: center;
+        line-height: 30px;
+      }
+      .close {
+        box-sizing: border-box;
+        padding-top: 5px;
+        padding-right: 5px;
+        cursor: pointer;
+      }
+    }
+    .el-table__body-wrappe {
+      height: 140px !important;
+    }
+    .top {
+      height: 19px;
+      // background-color: #053b6a;
+      color: #fff;
+      // line-height: 32px;
+      // padding-left: 12px;
+      position: relative;
+
+      .title {
+        position: absolute;
+        left: 50%;
+        margin-left: -92px;
+        top: -5px;
+      }
+      .repeat {
+        position: absolute;
+        top: -5px;
+        right: 160px;
+        color: #fff;
+        cursor: pointer;
+        &:hover {
+          color: #2788ea;
+        }
+      }
+      .repeat2 {
+        position: absolute;
+        right: 206px;
+        color: #67c23a;
+      }
+      .more {
+        position: absolute;
+        right: 38px;
+        top: -5px;
+        color: #fff;
+        float: right;
+        margin-right: 20px;
+        cursor: pointer;
+        &:hover {
+          color: #2788ea;
+        }
+      }
+    }
+    .bottom {
+      width: 1000px;
+      margin: 0 auto;
+      position: relative;
+    }
+  }
+  .right {
+    width: 740px;
+    display: flex;
+    flex-wrap: wrap;
+    // justify-content: space-between;
+    align-content: flex-start;
+    // margin-top: 7px;
+    & > .right-content {
+      background-color: #fff;
+      width: 238px;
+      height: 82px;
+      margin-bottom: 29px;
+      box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.16);
+      margin-right: 10px;
+      display: flex;
+      &.three {
+        margin-right: 0px;
+      }
+      // align-items: center;
+      .text-icon {
+        line-height: 82px;
+        padding-left: 22px;
+        margin-right: 22px;
+        i {
+          color: #053b6a;
+          font-size: 60px;
+        }
+      }
+      .text {
+        font-size: 14px;
+        padding-top: 16px;
+        .top {
+          color: #000;
+          margin-bottom: 10px;
+          font-weight: 600;
+        }
+        .bottom {
+          color: #2788ea;
+        }
+      }
+    }
+  }
+
+  .iconfont {
+    cursor: pointer;
+  }
+  // 单独调整下最后一个icon的大小
+  .iconFontSize {
+    font-size: 50px !important;
+  }
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/components/bigWindow/DeviceA.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-01-26 20:07:52
+ * @LastEditTime: 2022-02-17 10:13:02
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+
+ * @FilePath: /test/hello-world/src/views/components/deviceA.vue
+-->
+<template>
+  <div class="devicea-wrapper">
+    <div class="title">
+      {{
+        deviceData.deviceName ? deviceData.deviceName : deviceData.stationName
+      }}
+    </div>
+    <div class="close" @click="close">
+      <img src="@/assets/mapImages/closeBtn.png" alt="" />
+    </div>
+
+    <div class="top flex">
+      <div class="group">
+        <div class="left">所属公司：</div>
+        <div class="right zzz">{{ companyType[deviceData.companyType] }}</div>
+      </div>
+      <div class="group">
+        <div class="left">设备类型：</div>
+        <div class="right zzz">
+          {{ deviceType[deviceData.type] }}
+        </div>
+      </div>
+      <div class="group">
+        <div class="left">设备地址：</div>
+        <div
+          v-if="deviceData.deviceAddr"
+          :title="deviceData.deviceAddr"
+          class="right last zzz"
+        >
+          {{ deviceData.deviceAddr || "-" }}
+        </div>
+        <div
+          v-else-if="deviceData.stationAddr"
+          :title="deviceData.stationAddr"
+          class="right last zzz"
+        >
+          {{ deviceData.stationAddr || "-" }}
+        </div>
+      </div>
+    </div>
+
+    <div class="middle">{{ profile }}</div>
+
+    <div class="foot">
+      <div class="thead flex">
+        <div class="first">设备类型</div>
+        <div>设备数量</div>
+        <div>在线设备</div>
+        <div>离线设备</div>
+        <div>历史报警</div>
+        <div>已处理报警</div>
+        <div class="last">报警中</div>
+      </div>
+      <div class="tbody flex">
+        <div class="first zzz">{{ "流量计与压力表" }}</div>
+        <div class="">{{ deviceData.pressureFlow.length }}</div>
+        <div class="">
+          {{ (Math.random() * deviceData.pressureFlow.length) >> 1 }}
+        </div>
+        <div class="">
+          {{ (Math.random() * deviceData.pressureFlow.length) >> 1 }}
+        </div>
+        <div class="">
+          {{ (Math.random() * deviceData.pressureFlow.length) >> 1 }}
+        </div>
+        <div class="">
+          {{ (Math.random() * deviceData.pressureFlow.length) >> 1 }}
+        </div>
+        <div class="last zzz">
+          {{
+            deviceData.pressureFlow.filter((item) => {
+              return item.deviceState == 2;
+            }).length
+          }}
+        </div>
+      </div>
+    </div>
+
+    <div class="btn">
+      <div @click="btnClick">感知设备</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { companyType, deviceType } from "@/utils/mapClass/config.js";
+export default {
+  data() {
+    return {
+      companyType,
+      deviceType,
+      profile:
+        "公司位于长江三角洲经济快速增长、风景秀丽的太湖之畔——无锡。 公司自1984年成立至今，已经过了3次跨越式的发展。2004年至今公司投入5000多万元资金建设新的生产基地，目前已竣工并投入生产，占地面积达40000m2，厂房面积近15000m2。公司2004年的年产值达4350多万元，并且每年以平均30%的速度快速增长。",
+    };
+  },
+  methods: {
+    close() {
+      this.mapClass.infowindowClose();
+    },
+    btnClick() {
+      this.vueRoot.centerDataFunc(this.deviceData.pressureFlow);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.devicea-wrapper {
+  background-color: rgba(9, 18, 32, 0.6);
+  padding: 10px;
+  position: relative;
+  width: 700px;
+  .title {
+    // padding-top: 10px;
+    // padding-left: 10px;
+    font-size: 14px;
+    line-height: 14px;
+    color: #ffffff;
+  }
+  .close {
+    position: absolute;
+    right: 10px;
+    top: 5px;
+    cursor: pointer;
+  }
+
+  .top {
+    margin-top: 10px;
+    margin-bottom: 10px;
+    border: 1px solid #cccccc;
+    box-sizing: border-box;
+    .group {
+      height: 30px;
+      flex: 1;
+      display: flex;
+      justify-content: space-between;
+      box-sizing: border-box;
+      div {
+        flex: 1;
+        box-sizing: border-box;
+        border-right: 1px solid #cccccc;
+        text-align: center;
+        font-size: 14px;
+        color: #ffffff;
+        line-height: 30px;
+        padding: 0 5px;
+        &.last {
+          border-right: none;
+        }
+      }
+      .left {
+        text-align: right;
+        background-color: rgba(255, 255, 255, 0.1);
+      }
+    }
+  }
+  .middle {
+    width: 100%;
+    padding: 5px;
+    border: 1px solid #ffffff;
+    box-sizing: border-box;
+    font-size: 14px;
+    color: #ffffff;
+    text-indent: 2em;
+    margin-bottom: 10px;
+  }
+  .foot {
+    font-size: 14px;
+    color: #ffffff;
+    .thead,
+    .tbody {
+      border: 1px solid #cccccc;
+      div {
+        flex: 1;
+        text-align: left;
+        border-right: 1px solid #cccccc;
+        box-sizing: border-box;
+        padding: 0 5px;
+      }
+      .first {
+        flex: 2;
+      }
+      .last {
+        border-right: none;
+      }
+    }
+    .tbody {
+      border-top: none;
+    }
+    .thead {
+      div {
+        background-color: rgba(255, 255, 255, 0.1);
+      }
+    }
+  }
+
+  .btn {
+    position: relative;
+    margin-top: 10px;
+    text-align: right;
+    div {
+      font-size: 14px;
+      color: #ffffff;
+      padding: 2px 4px;
+      box-sizing: border-box;
+      display: inline-block;
+      cursor: pointer;
+      border: 1px solid #cccccc;
+      background-color: #1890ff;
+
+      &:hover {
+        // background: rgba(9, 18, 32, 0.6);
+        background-color: #18baff;
+      }
+    }
+  }
+  .flex {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/components/bigWindow/Line.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-01-27 14:25:45
+ * @LastEditTime: 2022-02-17 10:11:42
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /hello-world/src/views/components/User.vue
+-->
+<template>
+  <div class="user-wrapper">
+    <div class="title">{{ companyType[deviceData.companyType] }}</div>
+    <div class="close" @click="close">
+      <img src="@/assets/mapImages/closeBtn.png" alt="" />
+    </div>
+
+    <div class="group flex first">
+      <div class="left first">管道长度：</div>
+      <div class="right zzz">{{ deviceData.pipeLength }}米</div>
+      <div class="left">管径：</div>
+      <div class="right last">{{ deviceData.pipeDiameter }}米</div>
+    </div>
+
+    <!-- <div class="group flex">
+      
+    </div> -->
+
+    <div class="group flex">
+      <div class="left first">管道压力：</div>
+      <div :title="deviceData.address" class="right zzz">
+        {{ pipePressure[deviceData.pipePressure] }}
+      </div>
+      <div class="left">所属公司：</div>
+      <div class="right last">{{ companyType[deviceData.companyType] }}</div>
+    </div>
+
+    <div class="group flex">
+      <div class="first left">管道材质：</div>
+      <div class="right">{{ deviceData.pipeMaterial }}</div>
+      <div class="left">管道埋深：</div>
+      <div class="right last">{{ deviceData.pipeDepth }}米</div>
+    </div>
+
+    <div class="group flex">
+      <div class="left first">管道走向：</div>
+      <div class="right">{{ deviceData.pipeTrend }}</div>
+      <div class="left">权属单位：</div>
+      <div :title="deviceData.powerCompany" class="right last zzz">{{ deviceData.powerCompany }}</div>
+    </div>
+    <div class="group flex">
+      <div class="first left">建设年代：</div>
+      <div class="right">{{ deviceData.buildyear }}</div>
+      <div class="left">建设单位：</div>
+      <div class="last right">{{ deviceData.buildCompany }}</div>
+    </div>
+
+
+    <div class="group flex">
+      <div class="first once left">管道位置：</div>
+      <div :title="deviceData.pipeAddr" class=" last pipeAddr right zzz">
+        {{ deviceData.pipeAddr }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { companyType, pipePressure } from "@/utils/mapClass/config.js";
+
+export default {
+  data() {
+    return {
+      companyType,
+      pipePressure,
+    };
+  },
+  methods: {
+    close() {
+      this.mapClass.infowindowClose();
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.user-wrapper {
+  background-color: rgba(9, 18, 32, 0.6);
+  padding: 10px;
+  position: relative;
+  width: 400px;
+  .title {
+    font-size: 14px;
+    line-height: 14px;
+    color: #ffffff;
+  }
+  .close {
+    position: absolute;
+    right: 10px;
+    top: 5px;
+    cursor: pointer;
+  }
+  .group {
+    border: 1px solid #cccccc;
+    border-top: none;
+    height: 28px;
+    font-size: 14px;
+    line-height: 28px;
+    color: #ffffff;
+    &.first {
+      border-top: 1px solid #cccccc;
+      margin-top: 10px;
+    }
+    div {
+      flex: 1;
+      border-right: 1px solid #cccccc;
+    }
+    .left {
+      background-color: rgba(255, 255, 255, 0.1);
+      text-align: right;
+    }
+    .right {
+      box-sizing: border-box;
+      text-align: left;
+      padding: 0 1em;
+    }
+    .last {
+      border: none;
+    }
+    .once{
+      flex:1;
+    }
+    .pipeAddr{
+      flex:3;
+      padding:0 3em 0 1em;
+    }
+  }
+  .flex {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/components/bigWindow/PipeColor.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-01-26 10:52:10
+ * @LastEditTime: 2022-02-17 10:11:35
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /test/hello-world/src/components/PipeColor.vue
+-->
+<template>
+  <div>
+    <div class="pipePressure">
+      <!-- <div>管道压力</div> -->
+      <div class="hasColorBox" :style="{ color: pipeColor[`1`] }">
+        <div :style="{ backgroundColor: pipeColor[`1`] }"></div>
+        低压
+      </div>
+      <div class="hasColorBox" :style="{ color: pipeColor[`2`] }">
+        <div :style="{ backgroundColor: pipeColor[`2`] }"></div>
+        中压
+      </div>
+      <div class="hasColorBox" :style="{ color: pipeColor[`3`] }">
+        <div :style="{ backgroundColor: pipeColor[`3`] }"></div>
+        次高压
+      </div>
+      <div class="hasColorBox" :style="{ color: pipeColor[`4`] }">
+        <div :style="{ backgroundColor: pipeColor[`4`] }"></div>
+        高压
+      </div>
+    </div>
+    <div class="mapChange">
+      <div :class="{ active: !mapStyle }" @click="mapChange(1)">卫星地图</div>
+      <div :class="{ active: mapStyle }" @click="mapChange(2)">全景地图</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { pipeColor } from "@/utils/mapClass/config.js";
+export default {
+  data() {
+    return {
+      pipeColor,
+      mapStyle:true
+    };
+  },
+  methods: {
+    // 更改卫星图
+    mapChange(num) {
+      if (num == 1) {
+        this.mapStyle = false;
+      } else {
+        this.mapStyle = true;
+      }
+      this.$parent.map.changeMap(this.mapStyle);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.pipePressure {
+  position: fixed;
+  color: #fff;
+  left: 460px;
+  top: 120px;
+  padding: 1px;
+  // background: rgba(6, 29, 51, 0.8);
+  .hasColorBox {
+    // border: 1px solid #053b6a;
+    padding: 2px 5px;
+    margin-bottom: 5px;
+    & > div {
+      display: inline-block;
+      width: 10px;
+      height: 10px;
+    }
+  }
+}
+.mapChange {
+  left: 460px;
+  top: 76px;
+  color: #fff;
+  position: absolute;
+  display: flex;
+  div {
+    padding: 4px 8px;
+    border: 1px solid #fff;
+    margin-left: 8px;
+    cursor: pointer;
+    &.active,
+    &:hover {
+      background-color: #053b6a;
+      color: #31eaea;
+    }
+  }
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/components/bigWindow/PipeVue.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-01-11 13:44:17
+ * @LastEditTime: 2022-01-20 14:30:03
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /hello-world/src/views/About.vue
+-->
+<template>
+  <div class="wrapper">
+    <div @click="click">点我</div>
+    <div>{{deviceData.lat}}</div>
+    <div>{{deviceData.id}}</div>
+    <div>{{deviceData.type}}</div>
+    <div>{{deviceData.lng}}</div>
+    <div>12312312321{{a}}</div>
+  </div>
+</template>
+
+<script>
+  //这个东西是用新的实例创建的，跟主vue没有关联，必须传进来才可以
+  // vueRoot,
+  //   // 自己写的map类
+  //   mapClass,
+  //   // 数据
+  //   deviceData,
+export default {
+    name: "Pipe",
+    data() {
+      return {
+        a:123
+      };
+    },
+    // props: {
+    //   // 代表地图页面的vue
+    //   vueRoot: {
+    //     type: Object,
+    //     default: () => null,
+    //   },
+    //   // 数据
+    //   deviceData: {
+    //     type: Object,
+    //     default: () => null,
+    //   },
+    // },
+    mounted(){
+      console.log(this.deviceData)
+    },
+    methods: {
+      click() {
+
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .wrapper {
+    width: 200px;
+    height: 200px;
+    background: red;
+  }
+</style>
\ No newline at end of file

gassafetyprogress-web/src/components/bigWindow/User.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-01-27 14:25:45
+ * @LastEditTime: 2022-02-17 10:12:02
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /hello-world/src/views/components/User.vue
+-->
+<template>
+  <div class="user-wrapper">
+    <div class="title">{{ deviceData.usrName }}</div>
+    <div class="close" @click="close">
+      <img src="@/assets/mapImages/closeBtn.png" alt="" />
+    </div>
+
+    <div class="group flex first">
+      <div class="left">用户姓名：</div>
+      <div :title="deviceData.usrName" class="right zzz">{{ deviceData.usrName }}</div>
+    </div>
+
+    <div class="group flex">
+      <div class="left">联系方式：</div>
+      <div class="right">{{ deviceData.phone }}</div>
+    </div>
+
+    <div class="group flex">
+      <div class="left">用户地址：</div>
+      <div :title="deviceData.address" class="right zzz">
+        {{ deviceData.address }}
+      </div>
+    </div>
+
+    <div class="group flex">
+      <div class="left">所属公司：</div>
+      <div class="right">{{ companyType[deviceData.companyType] }}</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { companyType } from "@/utils/mapClass/config.js";
+
+export default {
+  data() {
+    return {
+      companyType,
+    };
+  },
+  methods: {
+    close() {
+      this.mapClass.infowindowClose();
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.user-wrapper {
+  background-color: rgba(9, 18, 32, 0.6);
+  padding: 10px;
+  position: relative;
+  width: 300px;
+  .title {
+    font-size: 14px;
+    line-height: 14px;
+    color: #ffffff;
+  }
+  .close {
+    position: absolute;
+    right: 10px;
+    top: 5px;
+    cursor: pointer;
+  }
+  .group {
+    border: 1px solid #cccccc;
+    border-top:none;
+    height: 28px;
+    font-size: 14px;
+    line-height: 28px;
+    color: #ffffff;
+    &.first {
+      border-top:1px solid #cccccc;
+      margin-top: 10px;
+    }
+    div {
+      flex: 1;
+      
+    }
+    .left {
+      border-right: 1px solid #cccccc;
+      background-color: rgba(255, 255, 255, 0.1);
+      text-align: right;
+    }
+    .right {
+      box-sizing: border-box;
+      text-align: left;
+      padding:0 1em;
+    }
+  }
+  .flex {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/components/bigWindow/VideoView.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-01-26 22:44:02
+ * @LastEditTime: 2022-01-27 10:12:46
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /test/hello-world/src/views/components/videoView.vue
+-->
+<template>
+  <div class="box-wrapper">
+    <div class="title">{{ deviceData.videoName }}</div>
+    <div class="close" @click="close">
+      <img src="@/assets/mapImages/closeBtn.png" alt="" />
+    </div>
+    <div class="box videoBox">
+      <div id="video"></div>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <!-- <el-button type="primary" @click="dialogVisible = false"
+        >确 定
+      </el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button> -->
+    </span>
+  </div>
+</template>
+<script>
+import WasmPlayer from "@easydarwin/easywasmplayer"; //导入WasmPlayer.js
+
+export default {
+  data() {
+    return {
+      // dialogVisible: true,
+      // AfterClose: true,
+    };
+  },
+  watch: {},
+  mounted() {
+    setTimeout(() => {
+      this.player = new WasmPlayer(null, "video", this.callBack, {
+        Height: true,
+      });
+      this.player.play(this.deviceData.usr, 1);
+    }, 1);
+  },
+  methods: {
+    show() {
+      this.dialogVisible = true;
+    },
+    handleClose() {
+      console.log("关闭");
+      this.player.destroy(this.deviceData.usr);
+      // document.body.removeChild(this.$refs.videoBox.$el);
+    },
+    callBack() {},
+    close() {
+      this.handleClose();
+      this.mapClass.infowindowClose();
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.box-wrapper {
+  background-color: rgba(9, 18, 32, 0.6);
+  position: relative;
+  .title {
+    padding-top: 10px;
+    padding-left: 10px;
+    font-size: 14px;
+    line-height: 14px;
+    color: #ffffff;
+  }
+  .close {
+    position: absolute;
+    right: 10px;
+    top: 5px;
+    cursor: pointer;
+  }
+  .box {
+    padding: 5px 12px 10px 10px;
+    width: 350px;
+    height: 200px;
+    #video {
+      height: 100%;
+    }
+  }
+}
+</style>
+

gassafetyprogress-web/src/components/bigWindow/leftBar.vue

+<template>
+  <div> 
+    <div class="left-top" style="margin-top: 70px;width: 430px;margin-left: 10px;display: flex;justify-content: space-around;">
+      <div style="width: 40%;text-align: center;color: #00ffff;">
+        <p>从业人员数</p>
+        <span style="font-family: 'arialbd';font-size: 30px;background-image:-webkit-linear-gradient(bottom,#f0c41b,#e4dbb7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;  ">{{datanow.congyeNum}}</span>
+      </div>
+      <div style="width: 40%;text-align: center;color: #00ffff;">
+        <p>管道长度(m)</p>
+        <span style="font-family: 'arialbd';font-size: 30px;background-image:-webkit-linear-gradient(bottom,#f86742,#f0c41b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;  ">{{datanow.guandaoNum}}</span>
+      </div>
+    </div>
+    
+    <div>
+      <div class="item1" style="margin-top: 40px;">
+        <span class="dot">
+          <span class="dot-inner"></span>
+        </span>
+        <span>安全监管</span>
+        <div class="fong-div" style="width: 8px;height: 12px;background-color: #2c888899;float: right;margin-top: 10px;transform: skewX(-25deg)"></div> 
+        <div class="fong-div" style="width: 8px;height: 12px;background-color: #24b1b1b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+        <div class="fong-div" style="width: 8px;height: 12px;background-color: #11e9e9b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+      </div>
+  </div>
+  <div id="main1" style="width: 100%;height: 280px;"></div>
+    <div class="echarts-two" style="margin-top: 30px;width: 430px;margin-left: 10px;">
+      <div>
+        <div class="item1">
+          <span class="dot">
+            <span class="dot-inner"></span>
+          </span>
+          <span>任务完成率</span>
+          <div class="fong-div" style="width: 8px;height: 12px;background-color: #2c888899;float: right;margin-top: 10px;transform: skewX(-25deg)"></div> 
+          <div class="fong-div" style="width: 8px;height: 12px;background-color: #24b1b1b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+          <div class="fong-div" style="width: 8px;height: 12px;background-color: #11e9e9b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+        </div>
+      </div>
+      <div id="myCharttwo" :style="{width: '450px', height: '300px'}"></div>
+      <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 15px;">
+        ● 已完成数量:{{datanow.renwu[1]}}
+      </div>
+      <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 15px;color: #0099ff">
+        ● 未成数量:{{datanow.renwu[0]}}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  // 引入基本模板
+  let echarts = require('echarts/lib/echarts')
+  // 引入柱状图组件
+  require('echarts/lib/chart/bar')
+  // 引入提示框和title组件
+  require('echarts/lib/component/tooltip')
+  require('echarts/lib/component/title')
+  export default {
+    data () {
+    　　return {
+          dataAll:{
+              congyeNum:1544,
+              guandaoNum:3658495,
+              shigu1:[820, 932, 901, 934, 1290, 1330, 1320,820, 932, 901, 934, 1290],
+              shigu2:[452, 786, 456, 732, 458, 165, 198,489, 158, 358, 345, 675],
+              shigu3:[ 932, 901, 198,489, 158, 358, 345, 675,  901, 934, 1290, 888],
+              renwu:[50,92],
+              renwuzong:142
+          },
+          dataone:{
+              congyeNum:521,
+              guandaoNum:1254848,
+              shigu1:[223, 44, 332, 321, 458, 456, 653,122, 345, 133, 421, 123],
+              shigu2:[123, 234, 456, 567, 235, 12,89, 158, 158, 145, 175,224],
+              shigu3:[ 432, 301, 108,189, 18, 158, 145, 175,  401, 334, 590, 388],
+              renwu:[4,27],
+              renwuzong:31
+          },
+          datatwo:{
+              congyeNum:488,
+              guandaoNum:1244495,
+              shigu1:[653,122, 345, 133, 456, 653,122, 345, 133, 421, 123,500],
+              shigu2:[432, 301, 456, 567, 235, 12, 145, 175,  401, 334, 590, 388],
+              shigu3:[ 123, 234, 108,189, 18, 158, 123, 234, 456, 567, 235, 12],
+              renwu:[8,25],
+              renwuzong:33
+          },
+          datathree:{
+              congyeNum:535,
+              guandaoNum:1189492,
+              shigu1:[653,122, 345, 133, 456, 653,122, 345, 133, 421, 123,500],
+              shigu2:[432, 301, 456, 567, 456, 653,122, 175,  401, 334, 590, 388],
+              shigu3:[ 334, 590, 388, 133, 456, 123, 234, 653,122, 345, 133],
+              renwu:[38,40],
+              renwuzong:78
+          },
+          datanow:{
+              renwu:[0,0]
+          }
+      };
+    　},
+     mounted(){
+        this.datanow = this.dataAll;
+        this.drawLine(this.datanow);
+        this.initdata(this.datanow);
+      },
+    methods: {
+        choice(index){
+            console.log("-----"+index)
+            if(index==0){
+                this.datanow = this.dataAll;
+                this.drawLine(this.datanow);
+                this.initdata(this.datanow);
+            }else
+            if(index==1){
+                this.datanow = this.dataone;
+                this.drawLine(this.datanow);
+                this.initdata(this.datanow);
+            }else if(index==2){
+                this.datanow = this.datatwo;
+                this.drawLine(this.datanow);
+                this.initdata(this.datanow);
+            }else if(index==3){
+                this.datanow = this.datathree;
+                this.drawLine(this.datanow);
+                this.initdata(this.datanow);
+            }
+        },
+      drawLine(data){
+                // 基于准备好的dom，初始化echarts实例
+                let myChart = echarts.init(document.getElementById('main1'))
+                // 绘制图表
+                myChart.setOption({
+                    legend: {
+                        top:20,
+                        textStyle:{
+                            color:"#fff"
+                        },
+                    },
+                    
+                    grid: {  
+                            left: '5%',  
+                            right: '7%',  
+                            bottom: '4%', 
+                            containLabel: true  
+                        },
+                    xAxis: {
+                        axisLine: {
+                            show: true,
+                            lineStyle: {
+                                color: '#bbb6b6',
+                            },
+                        },
+                        axisTick: {           //去掉坐标轴刻线
+                            show: false
+                        },
+                        type: 'category',
+                        data: ['1', '2', '3', '4', '5', '6', '7','8', '9', '10', '11', '12']
+                    },
+                    yAxis: {
+                        axisLine: {
+                            show: true,
+                            lineStyle: {
+                                color: '#bbb6b6'
+                            },
+                        },
+                        splitLine: {
+                            show:true,
+                            lineStyle:{
+                                type:"dashed",
+                                color: '#bbb6b6',
+                            }
+                        },
+                        type: 'value'
+                    },
+                    series: [
+                        {
+                            name:"事故数量",
+                            data: data.shigu1,
+                            type: 'line',
+                            smooth: true
+                        },
+                        {
+                            data: data.shigu2,
+                            type: 'line',
+                            smooth: true,
+                            name:"隐患整治数"
+                        },
+                        {
+                            data: data.shigu3,
+                            type: 'line',
+                            smooth: true,
+                            name:"预警数量"
+                        }
+                    ]
+                });
+            },
+      initdata(data){
+          // 基于准备好的dom，初始化echarts实例
+          //console.log(data.renwu[0]+"=-=-=-"+data.renwu[1])
+          let myChart2 = this.$echarts.init(document.getElementById('myCharttwo'))
+          // 绘制图表
+          myChart2.setOption({
+              title: {
+                  text: '任务总数量:'+data.renwuzong,
+                  left: 'center',
+                  top :20,
+                  textStyle:{
+                      color: "#00ffff"
+                  }
+              },
+            tooltip: {
+              trigger: 'item',
+            },
+            series: [
+              {
+                name: '任务概况',
+                type: 'pie',
+                radius: '70%',
+                center: ['50%','58%'],
+                data: [
+                  { 
+                    value: data.renwu[0],
+                    name: '未完成',
+                    itemStyle: { color: '#09f' }
+                },
+                  { 
+                    value: data.renwu[1],
+                      name: '已完成' ,
+                    itemStyle: { color: '#00ffff' }
+                  },
+                ],
+                  label:{
+                    color:'#fff',
+                      fontSize: 18
+                  },
+                emphasis: {
+                  itemStyle: {
+                    shadowBlur: 10,
+                    shadowOffsetX: 0,
+                    shadowColor: 'rgba(0, 0, 0, 0.5)'
+                  }
+                }
+              }
+            ]
+          });
+      },
+
+
+
+
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  
+/* @font-face {
+  font-family: 'arialbd';
+} */
+.item1{
+    width: 95%;
+    height: 30px;
+    font-size: 18px;
+    line-height: 30px;
+    color: #ffffff;
+    padding-left: 10px;
+    margin-top: 10px;
+    font-weight: 700;
+    font-style: italic;
+    margin-left: 10px;
+    background-image: linear-gradient(to left, #122033, rgb(51 152 243 / 50%) 50%, #111a22);
+}
+.dot {
+        display: inline-block;
+        position: relative;
+        width: 10px;
+        height: 10px;
+        background: rgb(30, 185, 190);
+        border-radius: 50%;
+        margin-right: 10px;
+        margin-left: 10px;
+        margin-bottom: 2px;
+    }
+
+    .dot-inner {
+        background: #44d7dc;
+        position: absolute;
+        top: 0;
+        left: 0;
+        box-sizing: border-box;
+        display: block;
+        width: 100%;
+        height: 100%;
+        border-radius: 50%;
+        -webkit-animation: vabDot 1.2s ease-in-out infinite;
+        animation: vabDot 1.2s ease-in-out infinite;
+    }
+
+    @-webkit-keyframes vabDot {
+        0% {
+            opacity: .6;
+            transform: scale(.8)
+        }
+
+        to {
+            opacity: 0;
+            transform: scale(2.4)
+        }
+    }
+
+    @keyframes vabDot {
+        0% {
+            opacity: .6;
+            transform: scale(.8)
+        }
+
+        to {
+            opacity: 0;
+            transform: scale(2.4)
+        }
+    }
+</style>

gassafetyprogress-web/src/components/bigWindow/markerInfoWindow.vue

+<template>
+    <div id="">
+      qqqq
+    </div>
+</template>
+
+<script>
+// import moment from "moment";
+//line移入时的的infowindow
+// export default {
+//   props: {
+//     obj: { typs: Object },
+//     title: "",
+//     data: {},
+//     map: null,
+//   },
+//   methods: {
+//     moment,
+//     deviceMore() {
+//       this.data.class.view.$router.push({
+//         // path: "/dataMonitoring/realtimedetail",
+//         path: "/device/deviceInfoDetail",
+//         query: {
+//           deviceId: this.data.deviceId,
+//           // deviceType: this.data.deviceType,
+//         },
+//       });
+//     },
+//     close() {
+//       this.map.clearInfoWindow();
+//       this.data.class.view.domAllShow()
+//     },
+//   },
+// };
+</script>
+
+
+</style>

gassafetyprogress-web/src/components/bigWindow/rightBar.vue

+<template>
+
+    <div style="height: 100%">
+        <div>
+            <div class="item1" style="margin-top: 60px;">
+              <span class="dot">
+                <span class="dot-inner"></span>
+              </span>
+              <span>用户安全监控设备</span>
+              <div class="fong-div" style="width: 8px;height: 12px;background-color: #2c888899;float: right;margin-top: 10px;transform: skewX(-25deg)"></div> 
+              <div class="fong-div" style="width: 8px;height: 12px;background-color: #24b1b1b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+              <div class="fong-div" style="width: 8px;height: 12px;background-color: #11e9e9b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+            </div>
+        </div>
+        <div class="divfen" style="width: 100%;height: 30%;">
+            <div class ="divall" style="width: 50%">
+                <div class="titleTex">属地巡查</div>
+                <div class="titleTex divfen" style="height: 50px;margin-top: 0px">
+                    <div class="numdiv">{{datanow.xunchaAllOne1}}</div>
+                    <div class="numdiv" style="margin-left: 5px">{{datanow.xunchaAllOne2}}</div>
+                    <div class="numdiv" style="margin-left: 5px">{{datanow.xunchaAllOne3}}</div>
+                    <div class="numdiv" style="margin-left: 5px">{{datanow.xunchaAllOne4}}</div>
+                </div>
+                <div id="main21" style="height: 50%;width: 100%"></div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;">
+                    ● 巡查次数:{{datanow.xunoneevery1}}
+                </div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;color: #f0c41b">
+                    ● 发现问题数:{{datanow.xunoneevery2}}
+                </div>
+            </div>
+            <div style="width:14px;height: 100%;color: white;font-size: 13px;margin-top: 150px;">
+                <div style="width: 100%;height: 10px;background: #188df0"></div>
+                已整改
+                <div style="width: 100%;height: 10px;background: #f0c41b;margin-top: 15px;"></div>
+                未整改
+            </div>
+            <div class="divall" style="width: 50%" >
+                <div class="titleTex">行业检查</div>
+                <div class="titleTex divfen" style="height: 50px;margin-top: 0px">
+                    <div class="numdiv">{{datanow.xunchaAllTwo1}}</div>
+                    <div class="numdiv" style="margin-left: 5px">{{datanow.xunchaAllTwo2}}</div>
+                    <div class="numdiv" style="margin-left: 5px">{{datanow.xunchaAllTwo3}}</div>
+                    <div class="numdiv" style="margin-left: 5px">{{datanow.xunchaAllTwo4}}</div>
+                </div>
+                <div id="main22" style="height: 50%;width: 100%"></div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;">
+                    ● 巡查次数：{{datanow.xuntwoevery1}}
+                </div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;color: #f0c41b">
+                    ● 发现问题数：{{datanow.xuntwoevery2}}
+                </div>
+            </div>
+        </div>
+        <div class="echarts-one" style="margin-top: 10px;width: 430px;margin-left: 10px;">
+            <div>
+              <div class="item1">
+                <span class="dot">
+                  <span class="dot-inner"></span>
+                </span>
+                <span>资源统计</span>
+                <div class="fong-div" style="width: 8px;height: 12px;background-color: #2c888899;float: right;margin-top: 10px;transform: skewX(-25deg)"></div> 
+                <div class="fong-div" style="width: 8px;height: 12px;background-color: #24b1b1b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+                <div class="fong-div" style="width: 8px;height: 12px;background-color: #11e9e9b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+              </div>
+            </div>
+            <div id="myChartone" :style="{width: '420px', height: '250px'}"></div>
+          </div>
+        <div>
+            <div class="item1">
+              <span class="dot">
+                <span class="dot-inner"></span>
+              </span>
+              <span>投诉统计</span>
+              <div class="fong-div" style="width: 8px;height: 12px;background-color: #2c888899;float: right;margin-top: 10px;transform: skewX(-25deg)"></div> 
+              <div class="fong-div" style="width: 8px;height: 12px;background-color: #24b1b1b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+              <div class="fong-div" style="width: 8px;height: 12px;background-color: #11e9e9b3;float: right;margin-top: 10px;margin-right: 10px;transform: skewX(-25deg)"></div> 
+            </div>
+        </div>
+        <div class="divfen" style="width: 100%;height: 280px;margin-top: 10px">
+            <div style="width: 50%;height: 100%">
+                <div id="main31" style="width: 100%;height: 66%"></div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;">
+                    ● 已处理：{{datanow.tousuevery1}}
+                </div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;color: #ff4040">
+                    ● 未处理：{{datanow.tousuevery2}}
+                </div>
+            </div>
+            <div style="width: 50%;height: 100%">
+                <div id="main32" style="width: 100%;height: 66%"></div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;color: #0000ff">
+                    ● 在线数量：{{datanow.deviceevery1}}
+                </div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;color: #ffff00">
+                    ● 离线数量：{{datanow.deviceevery2}}
+                </div>
+                <div class="titleTex" style="height: 20px;margin-top: 0px;font-size: 10px;color: #ff4040">
+                    ● 报警数量：{{datanow.deviceevery3}}
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    // 引入基本模板
+    import * as echarts from 'echarts';
+    export default {
+        data () {
+            return {
+                dataall:{
+                    xunchaAllOne1: 1,
+                    xunchaAllOne2: 3,
+                    xunchaAllOne3: 8,
+                    xunchaAllOne4: 3,
+                    xunchaAllTwo1: 2,
+                    xunchaAllTwo2: 2,
+                    xunchaAllTwo3: 2,
+                    xunchaAllTwo4: 6,
+                    xunList1:[
+                        { value: 678,name: '30.4%' },
+                        { value: 1548,name: '69.6%' }
+                    ],
+                    xunList11:[
+                        { value: 1048 },
+                        { value: 335}
+                    ],
+                    xunoneevery1:1048,
+                    xunoneevery2:355,
+                    xunList2:[
+                        { value: 678,name: '28.5%' },
+                        { value: 1548,name: '71.5%' }
+                    ],
+                    xunList22:[
+                        { value: 1048 },
+                        { value: 335}
+                    ],
+                    xuntwoevery1:1674,
+                    xuntwoevery2:552,
+                    shigu1:[820, 932, 901, 934, 1290, 1330, 1320,820, 932, 901, 934, 1290],
+                    shigu2:[452, 786, 456, 732, 458, 165, 198,489, 158, 358, 345, 675],
+                    shigu3:[ 932, 901, 198,489, 158, 358, 345, 675,  901, 934, 1290, 888],
+                    tousu:[{ value: 1048, name: '已处理' },
+                        { value: 255, name: '未处理' }
+                    ],
+                    tousuNum:1303,
+                    tousuevery1:1048,
+                    tousuevery2:255,
+                    divice:[
+                        { value: 31, name: '在线数量' },
+                        { value: 19, name: '离线数量' },
+                        { value: 1, name: '报警数量' }
+                    ],
+                    deviceNum:51,
+                    deviceevery1:31,
+                    deviceevery2:19,
+                    deviceevery3:1,
+                    zhuzhuang:[16,13,27,2]
+                },
+                dataone:{
+                    xunchaAllOne1: 0,
+                    xunchaAllOne2: 3,
+                    xunchaAllOne3: 8,
+                    xunchaAllOne4: 3,
+                    xunchaAllTwo1: 0,
+                    xunchaAllTwo2: 7,
+                    xunchaAllTwo3: 2,
+                    xunchaAllTwo4: 6,
+                    xunList1:[
+                        { value: 224,name: '32.3%' },
+                        { value: 641,name: '67.7%' }
+                    ],
+                    xunList11:[
+                        { value: 338 },
+                        { value: 112}
+                    ],
+                    xunoneevery1:335,
+                    xunoneevery2:141,
+                    xunList2:[
+                        { value: 224,name: '29.1%' },
+                        { value: 544,name: '78.9%' }
+                    ],
+                    xunList22:[
+                        { value: 354 },
+                        { value: 111}
+                    ],
+                    xuntwoevery1:511,
+                    xuntwoevery2:199,
+                    shigu1:[223, 44, 332, 321, 458, 456, 653,122, 345, 133, 421, 123],
+                    shigu2:[123, 234, 456, 567, 235, 12,89, 158, 158, 145, 175,224],
+                    shigu3:[ 432, 301, 108,189, 18, 158, 145, 175,  401, 334, 590, 388],
+                    tousu:[{ value: 322, name: '已处理' },
+                        { value: 181, name: '未处理' }
+                    ],
+                    tousuNum:503,
+                    tousuevery1:322,
+                    tousuevery2:181,
+                    divice:[
+                        { value: 11, name: '在线数量' },
+                        { value: 8, name: '离线数量' },
+                        { value: 1, name: '报警数量' }
+                    ],
+                    deviceNum:21,
+                    deviceevery1:11,
+                    deviceevery2:8,
+                    deviceevery3:1,
+                    zhuzhuang:[8,3,11,1]
+                },
+                datatwo:{
+                    xunchaAllOne1: 0,
+                    xunchaAllOne2: 4,
+                    xunchaAllOne3: 2,
+                    xunchaAllOne4: 1,
+                    xunchaAllTwo1: 0,
+                    xunchaAllTwo2: 6,
+                    xunchaAllTwo3: 7,
+                    xunchaAllTwo4: 5,
+                    xunList1:[
+                        { value: 224,name: '30.4%' },
+                        { value: 400,name: '69.6%' }
+                    ],
+                    xunList11:[
+                        { value: 212 },
+                        { value: 209}
+                    ],
+                    xunoneevery1:335,
+                    xunoneevery2:141,
+                    xunList2:[
+                        { value: 224,name: '28.5%' },
+                        { value: 300,name: '71.5%' }
+                    ],
+                    xunList22:[
+                        { value: 475 },
+                        { value: 200}
+                    ],
+                    xuntwoevery1:475,
+                    xuntwoevery2:200,
+                    shigu1:[653,122, 345, 133, 456, 653,122, 345, 133, 421, 123,500],
+                    shigu2:[432, 301, 456, 567, 235, 12, 145, 175,  401, 334, 590, 388],
+                    shigu3:[ 123, 234, 108,189, 18, 158, 123, 234, 456, 567, 235, 12],
+                    tousu:[{ value: 344, name: '已处理' },
+                        { value: 121, name: '未处理' }
+                    ],
+                    tousuNum:322,
+                    tousuevery1:211,
+                    tousuevery2:111,
+                    divice:[
+                        { value: 2, name: '在线数量' },
+                        { value: 4, name: '离线数量' },
+                        { value: 0, name: '报警数量' }
+                    ],
+                    deviceNum:6,
+                    deviceevery1:2,
+                    deviceevery2:4,
+                    deviceevery3:0,
+                    zhuzhuang:[2,5,7,1]
+                },
+                datathree:{
+                    xunchaAllOne1: 0,
+                    xunchaAllOne2: 5,
+                    xunchaAllOne3: 7,
+                    xunchaAllOne4: 9,
+                    xunchaAllTwo1: 0,
+                    xunchaAllTwo2: 8,
+                    xunchaAllTwo3: 8,
+                    xunchaAllTwo4: 9,
+                    xunList1:[
+                        { value: 124,name: '30.4%' },
+                        { value: 400,name: '69.6%' }
+                    ],
+                    xunList11:[
+                        { value: 212 },
+                        { value: 309}
+                    ],
+                    xunoneevery1:335,
+                    xunoneevery2:141,
+                    xunList2:[
+                        { value: 224,name: '28.5%' },
+                        { value: 300,name: '71.5%' }
+                    ],
+                    xunList22:[
+                        { value: 475 },
+                        { value: 200}
+                    ],
+                    xuntwoevery1:475,
+                    xuntwoevery2:200,
+                    shigu1:[653,122, 345, 133, 456, 653,122, 345, 133, 421, 123,500],
+                    shigu2:[432, 301, 456, 567, 456, 653,122, 175,  401, 334, 590, 388],
+                    shigu3:[ 334, 590, 388, 133, 456, 123, 234, 653,122, 345, 133],
+                    tousu:[{ value: 124, name: '已处理' },
+                        { value: 111, name: '未处理' }
+                    ],
+                    tousuNum:335,
+                    tousuevery1:124,
+                    tousuevery2:111,
+                    divice:[
+                        { value: 12, name: '在线数量' },
+                        { value: 6, name: '离线数量' },
+                        { value: 0, name: '报警数量' }
+                    ],
+                    deviceNum:24,
+                    deviceevery1:12,
+                    deviceevery2:6,
+                    deviceevery3:0,
+                    zhuzhuang:[6,5,9,0]
+                },
+                datanow:{}
+            };
+        },
+        mounted(){
+            this.datanow = this.dataall;
+            this.drawLine(this.datanow);
+            this.drawLine2(this.datanow);
+            this.drawLine3(this.datanow);
+        },
+        methods: {
+            choice(index){
+                console.log("===="+index)
+                if(index==0){
+                    this.datanow = this.dataall;
+                    this.drawLine(this.datanow);
+                    this.drawLine2(this.datanow);
+                    this.drawLine3(this.datanow);
+                }else
+                if(index==1){
+                    this.datanow = this.dataone;
+                    this.drawLine(this.datanow);
+                    this.drawLine2(this.datanow);
+                    this.drawLine3(this.datanow);
+                }else if(index==2){
+                    this.datanow = this.datatwo;
+                    this.drawLine(this.datanow);
+                    this.drawLine2(this.datanow);
+                    this.drawLine3(this.datanow);
+                }else if(index==3){
+                    this.datanow = this.datathree;
+                    this.drawLine(this.datanow);
+                    this.drawLine2(this.datanow);
+                    this.drawLine3(this.datanow);
+                }
+            },
+            drawLine(data){
+          // 基于准备好的dom，初始化echarts实例
+          let myChart1 = this.$echarts.init(document.getElementById('myChartone'))
+          // 绘制图表
+          myChart1.setOption({
+              grid:{
+                  x:30,
+                  y:30,
+                  x2:30,
+                  y2:30
+              },
+              title: {
+                // text: '资源统计',
+                textStyle:{
+                    //文字颜色
+                    color:'#ccc',
+                    //字体风格,'normal','italic','oblique'
+                    fontStyle:'normal',
+                    //字体粗细 'normal','bold','bolder','lighter',100 | 200 | 300 | 400...
+                    fontWeight:'bold',
+                    //字体系列
+                    fontFamily:'sans-serif',
+                    //字体大小
+            　　　　 fontSize:18
+                }
+               },
+              tooltip: {},
+              xAxis: {
+                  data: ["阀井","调压箱","场站","监控"],
+                  splitLine: {
+                            show: false
+                        },
+                  axisLabel: {
+                      show: true,
+                      textStyle: {
+                          color: '#bbb6b6'
+                      }
+                  }
+              },
+              yAxis: {
+                splitLine: {
+                            show: false
+                        },
+                axisLabel: {
+                    show: true,
+                    textStyle: {
+                        color: '#bbb6b6'
+                    }
+                }
+              },
+              series: [{
+                  name: '',
+                  type: 'bar',
+                  data: data.zhuzhuang,
+                  barWidth: 20,
+                  itemStyle: {
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                      { offset: 0, color: '#83bff6' },
+                      { offset: 0.5, color: '#188df0' },
+                      { offset: 1, color: '#188df0' }
+                    ])
+                }
+              }]
+          });
+      },
+            drawLine2(data){
+                // 基于准备好的dom，初始化echarts实例
+                let myChart2 = echarts.init(document.getElementById('main21'));
+                let myChart22 = echarts.init(document.getElementById('main22'));
+                // 绘制图表
+                myChart2.setOption({
+                    // tooltip: {
+                    //     trigger: 'item',
+                    //     formatter: '{a} <br/>{b}: {c} ({d}%)'
+                    // },
+                    series: [
+                        {
+                            name: 'Access From',
+                            type: 'pie',
+                            selectedMode: 'single',
+                            radius: [0, '55%'],
+                            label: {
+                                position: 'inner',
+                                fontSize: 14
+                            },
+                            labelLine: {
+                                show: false
+                            },
+                            data:data.xunList1,
+                            color:['#f0c41b','#188df0']
+                        },
+                        {
+                            name: 'Access From',
+                            type: 'pie',
+                            radius: ['70%', '80%'],
+                            label: {
+                                position: 'inner',
+                                fontSize: 14
+                            },
+                            center: ['50%', '50%'],
+                            data:data.xunList11,
+                            color:['#00ffff','#f0c41b']
+                        }
+                    ]
+                });
+                myChart22.setOption({
+                    // tooltip: {
+                    //     trigger: 'item',
+                    //     formatter: '{a} <br/>{b}: {c} ({d}%)'
+                    // },
+                    series: [
+                        {
+                            name: 'Access From',
+                            type: 'pie',
+                            selectedMode: 'single',
+                            radius: [0, '55%'],
+                            label: {
+                                position: 'inner',
+                                fontSize: 14
+                            },
+                            labelLine: {
+                                show: false
+                            },
+                            data: data.xunList2,
+                            color:['#f0c41b','#188df0']
+                        },
+                        {
+                            name: 'Access From',
+                            type: 'pie',
+                            radius: ['70%', '80%'],
+                            label: {
+                                position: 'inner',
+                                fontSize: 14
+                            },
+                            center: ['50%', '50%'],
+                            data:data.xunList22,
+                            color:['#00ffff','#f0c41b']
+                        }
+                    ]
+                });
+            },
+            drawLine3(data){
+                // 基于准备好的dom，初始化echarts实例
+                let myChart31 = echarts.init(document.getElementById('main31'))
+                let myChart32 = echarts.init(document.getElementById('main32'))
+                // 绘制图表
+                myChart31.setOption({
+                    title: {
+                        text: '投诉统计:'+data.tousuNum,
+                        left: 'center',
+                        textStyle: {
+                            color: "#0ff"
+                        }
+                    },
+                    tooltip: {
+                        trigger: 'item'
+                    },
+                    series: [
+                        {
+                            name: '投诉统计',
+                            type: 'pie',
+                            radius: ['50%', '70%'],
+                            center: ['50%', '60%'],
+                            avoidLabelOverlap: false,
+                            label: {
+                                show: false,
+                                position: 'center'
+                            },
+                            emphasis: {
+                                label: {
+                                    show: true,
+                                    fontSize: '40',
+                                    fontWeight: 'bold'
+                                }
+                            },
+                            labelLine: {
+                                show: false
+                            },
+                            data: data.tousu,
+                            color:["#00ffff","#FF4040"]
+                        }
+                    ]
+                });
+                myChart32.setOption({
+                    title: {
+                        text: '设备数量:'+data.deviceNum,
+                        left: 'center',
+                        textStyle: {
+                            color: "#0ff"
+                        }
+                    },
+                    tooltip: {
+                        trigger: 'item'
+                    },
+                    series: [
+                        {
+                            name: '设备概况',
+                            type: 'pie',
+                            radius: ['50%', '70%'],
+                            center: ['50%', '60%'],
+                            avoidLabelOverlap: false,
+                            label: {
+                                show: false,
+                                position: 'center'
+                            },
+                            emphasis: {
+                                label: {
+                                    show: true,
+                                    fontSize: '40',
+                                    fontWeight: 'bold'
+                                }
+                            },
+                            labelLine: {
+                                show: false
+                            },
+                            data:data.divice,
+                            color:["#188df0","#ffff00","#FF4040"]
+                        }
+                    ]
+                });
+            }
+        }
+    }
+</script>
+
+<style>
+.titleTex{
+    height: 30px;
+    width: 100%;
+    color: aqua;
+    text-align: center;
+    line-height: 30px;
+    margin-top: 10px;
+}
+.divall{
+    height: 100%;
+    width: 100%;
+}
+.divfen{
+    display:flex;
+    justify-content:center;
+    align-items:center;
+}
+.numdiv{
+    background: #47aed5;
+    color: white;
+    width: 27px;
+    font-size: 30px;
+}
+.item1{
+    width: 90%;
+    height: 30px;
+    font-size: 18px;
+    line-height: 30px;
+    color: #ffffff;
+    padding-left: 10px;
+    margin-top: 10px;
+    font-weight: 700;
+    font-style: italic;
+    margin-left: 10px;
+    background-image: linear-gradient(to left, #121a22, rgb(51 152 243 / 50%) 50%, #112238);
+}
+.dot {
+        display: inline-block;
+        position: relative;
+        width: 10px;
+        height: 10px;
+        background: rgb(30, 185, 190);
+        border-radius: 50%;
+        margin-right: 10px;
+        margin-left: 10px;
+        margin-bottom: 2px;
+    }
+
+    .dot-inner {
+        background: #44d7dc;
+        position: absolute;
+        top: 0;
+        left: 0;
+        box-sizing: border-box;
+        display: block;
+        width: 100%;
+        height: 100%;
+        border-radius: 50%;
+        -webkit-animation: vabDot 1.2s ease-in-out infinite;
+        animation: vabDot 1.2s ease-in-out infinite;
+    }
+    @-webkit-keyframes vabDot {
+        0% {
+            opacity: .6;
+            transform: scale(.8)
+        }
+
+        to {
+            opacity: 0;
+            transform: scale(2.4)
+        }
+    }
+
+    @keyframes vabDot {
+        0% {
+            opacity: .6;
+            transform: scale(.8)
+        }
+
+        to {
+            opacity: 0;
+            transform: scale(2.4)
+        }
+    }
+</style>

gassafetyprogress-web/src/main.js

+/*
+ * @Author: your name
+ * @Date: 2022-01-07 11:29:13
+ * @LastEditTime: 2022-02-17 11:35:38
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/main.js
+ */
 import Vue from 'vue'
 
 import Cookies from 'js-cookie'
@@ -7,11 +15,14 @@ import './assets/styles/element-variables.scss'
 
 import '@/assets/styles/index.scss' // global css
 import '@/assets/styles/zehong.scss' // zehong css
+import './assets/css/font.css'
+import './assets/styles/all.scss'
+
 import App from './App'
 import store from './store'
 import router from './router'
 import permission from './directive/permission'
-
+import * as echarts from 'echarts'
 import './assets/icons' // icon
 import './permission' // permission control
 import { getDicts } from "@/api/system/dict/data";
@@ -21,7 +32,10 @@ import Pagination from "@/components/Pagination";
 // 自定义表格工具扩展
 import RightToolbar from "@/components/RightToolbar"
 
+
 // 全局方法挂载
+Vue.prototype.$echarts = echarts
+Vue.prototype.$Vue = Vue;
 Vue.prototype.getDicts = getDicts
 Vue.prototype.getConfigKey = getConfigKey
 Vue.prototype.parseTime = parseTime

gassafetyprogress-web/src/utils/mapClass/getPath.js

 /*
  * @Author: your name
  * @Date: 2022-01-11 13:45:12
- * @LastEditTime: 2022-02-12 15:13:52
+ * @LastEditTime: 2022-02-17 10:10:11
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
- * @FilePath: /test/hello-world/src/untils/mapClass.js
+ * @FilePath: /test/hello-world/src/utils/mapClass.js
  */
 
 // 编辑类

gassafetyprogress-web/src/utils/mapClass/map.js

+/*
+ * @Author: your name
+ * @Date: 2022-01-11 13:45:12
+ * @LastEditTime: 2022-02-17 10:12:27
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /test/hello-world/src/utils/mapClass.js
+ */
+import { pipeColor, svgUrl } from "@/utils/mapClass/config.js";
+
+// 编辑类
+// 在地图上新增的设备可以直接编辑，
+// 已经保存完成的设备需要点编辑才可以编辑
+export class EditorMap {
+  // 地图的对象实例
+  map = null;
+  // 父vue的实例
+  vue = null;
+  // 操作 新建，编辑，删除，编辑跟删除只对已经在图上的设备有效 默认值：0， 新建：1，编辑：2, 删除: 3。
+  // 新建的时候会把未保存的线条清空
+  control = 0;
+  // 鼠标事件对象，用来将点跟线上图
+  mousetool = null;
+  // 当前正在手动绘制的对象
+  nowMouseTarget = null;
+  // 当线mousetool线被按下的时候的flag 当线被按下的时候为true，就不询问是否删除了
+  mosueToolPolineDownFlag = false;
+  // 绘制marer的时候的配置，在绘制完挂载事件的时候需要使用
+  mouseToolMarkerOptions = null;
+  // 绘制poline的时候的配置，在绘制完挂载事件的时候需要使用
+  mouseToolPolineOptions = null;
+
+  // 存放所有的设备的数组集合，这是一个对象，对象里面是各种设备的数组
+  allDevic = {};
+  // 存放所有的管道
+  pipeArr = {};
+  // 当前的infowindow的组件
+  infowindowComponent = null;
+  // infowindow本身
+  infowindow = null;
+
+  constructor(contaienr, config = {}, vue) {
+    this.map = new AMap.Map(contaienr, {
+      viewMode: "3D",
+      center: [114.196007, 38.260288],
+      layers: [AMap.createDefaultLayer()], // layers 字段为空或者不赋值将会自动创建默认底图。
+      zoom: 14,
+      ...config,
+    });
+    this.vue = vue;
+    this.init();
+  }
+
+  init() {
+    // 地图事件
+    this.mapEvent();
+    // 手动点线上图准备,编辑模式
+    this.mouseAddDevice();
+    // this.mouseAddMarker();
+    // this.mouseAddPipeline();
+  }
+  // map的事件监听
+  mapEvent() {
+    this.map.on("click", () => {
+      // mousetool对象画出的对象的操作
+      // 如果有手动绘制对象，要手动清楚一下，因为画线的时候不好清除旧线，这其实是用来清楚旧线的
+      // 当画出来的线被mousedown，不删除，但是mouseToolPipeLineFlag要归位，在移出线的时候统一归位
+      // 如果对象是marker，直接删除
+      if (this.nowMouseTarget?.type == "AMap.Marker") {
+        this.mouseToolDrawClear();
+      } else {
+        // 当地图上已经画了线，并且没有点在线上，询问是否删除
+        if (this.nowMouseTarget && !this.mosueToolPolineDownFlag) {
+          this.confirm("是否重新绘制管道", { type: "warning" })
+            .then(() => {
+              // 删除原来的线
+              this.mouseToolDrawClear();
+              // 鼠标事件开启，并且赋值原来的属性，this.mouseToolMarkerOptions是开启绘制的时候记录的
+              this.mousetool.polyline(this.mouseToolPolineOptions);
+            })
+            .catch(() => {});
+        }
+      }
+    });
+    this.map.on("moveend", () => {
+      console.log("地图停止移动");
+      if (this.flag) {
+        console.log("弹框");
+        this.flag = false;
+      }
+    });
+    window.panTo = () => {
+      this.flag = true;
+      this.map.panTo([116.428285, 39.886129]);
+    };
+  }
+  // 弹框工具
+  confirm(message, obj) {
+    return this.vue.$confirm(message, obj);
+  }
+
+  // 改变操作状态
+  changeControl(num) {
+    this.control = num;
+  }
+
+  // 点线编辑上图准备
+  mouseAddDevice() {
+    this.map.plugin(["AMap.MouseTool"], () => {
+      this.mousetool = new AMap.MouseTool(this.map);
+    });
+    // 挂载绘制结束的事件
+    this.mouseDrawEvent();
+  }
+
+  // 点或者线上图结束后触发的事件
+  mouseDrawEvent() {
+    this.mousetool.on("draw", (e) => {
+      const target = e.obj;
+      // console.log([target._position.lng, target._position.lat]);
+      const { type: targetType } = target;
+      // 当这个点是marker的时候
+      if (targetType == "AMap.Marker") {
+        this.mouseToolMarkerEvent(target);
+      } else {
+        // 如果是线,挂上编辑
+        this.lineEditor(target);
+        this.mousetool.close();
+        this.mouseToolPolineEvent(target);
+        console.log(targetType, "当前对象是管道");
+      }
+      this.nowMouseTarget = target;
+    });
+  }
+
+  // 绘制marker结束后，在marker身上添加的事件
+  mouseToolMarkerEvent(target) {
+    // 由于画出来的marker点击会换位置，所以当移入的时候删除绘制事件，移出去在增加绘制事件
+    target.on("mouseover", (e) => {
+      // 鼠标事件关闭
+      this.mousetool.close(false);
+    });
+    target.on("mouseout", (e) => {
+      // 这里不方便获取原来的属性，因为position不好解决，还是设置一个值吧
+      // 鼠标事件开启，并且赋值原来的属性，this.mouseToolMarkerOptions是开启绘制的时候记录的
+      this.mousetool.marker(this.mouseToolMarkerOptions);
+    });
+    // 点
+    target.on("click", (e) => {
+      // 弹框
+    });
+  }
+  // 挂上线以及线的事件
+  lineEditor(line) {
+    // line.editor && line.editor.close();
+    // 当前点击次数，1次为编辑，2次为弹框
+    line.editorNum = 0;
+    line.editor = new AMap.PolyEditor(this.map, line);
+  }
+  // 绘制管道的时候，挂载的事件
+  mouseToolPolineEvent(target) {
+    // 线按下的时候会变成编辑，mousetool事件会清空 移出线的时候 在把polyline事件加上
+    target.on("mouseover", (e) => {
+      // 鼠标事件关闭
+      // this.mousetool.close(false);
+    });
+    target.on("mouseout", (e) => {
+      // 有时候按在线上移动地图，map点击事件中mosueToolPolineDownFlag无法归位，在这里归位
+      this.mosueToolPolineDownFlag = false;
+      // 鼠标事件开启，并且赋值原来的属性，this.mouseToolMarkerOptions是开启绘制的时候记录的
+      // this.mousetool.polyline(this.mouseToolPolineOptions);
+    });
+    // 线
+    target.on("mousedown", (e) => {
+      const line = e.target;
+      // mosueTool按下的flag,按在线上，不询问是否删除
+      this.mosueToolPolineDownFlag = true;
+      // 按下的时候要关闭事件
+      this.mousetool.close(false);
+      // 如果当前状态不是编辑，则进入编辑状态
+      if (line.editorNum < 1) {
+        // 打开并且++
+        line.editor.open();
+        line.editorNum++;
+      } else {
+        // 这里就要弹框了
+        console.log(line.getPath());
+      }
+    });
+  }
+  // 设备点击上图开启
+  mouseAddMarker(markerObj = {}) {
+    // 清空已经绘制完的对象
+    this.mousetoolClose(true);
+    // 记录一下配置项，在挂载点击的时候，需要使用
+    this.mouseToolMarkerOptions = {
+      draggable: true,
+      ...markerObj,
+    };
+    this.mousetool.marker(this.mouseToolMarkerOptions);
+  }
+  // 管线点击上图开启
+  mouseAddPipeline(pipeObj = {}) {
+    this.mousetoolClose(true);
+    // 开始画线
+    this.mosuetoolPolineFlag = true;
+    this.mouseToolPolineOptions = {
+      strokeWeight: 5,
+      ...pipeObj,
+    };
+    this.mousetool.polyline(this.mouseToolPolineOptions);
+  }
+
+  // 手动清除map上绘制的对象
+  mouseToolDrawClear() {
+    if (this.nowMouseTarget) {
+      this.map.remove(this.nowMouseTarget);
+      // 如果有editor,则关闭
+      this.nowMouseTarget.editor && this.nowMouseTarget.editor.close();
+      this.nowMouseTarget = null;
+    }
+  }
+  // 关闭点击上图事件 true清除之前绘制的图像，false 仅关闭上图事件
+  mousetoolClose(boolean) {
+    //  清空地图上的绘制对象的同时,也要清楚这个nowMouseTarget控制对象
+    if (this.nowMouseTarget) {
+      // 如果有editor,则关闭
+      this.nowMouseTarget.editor && this.nowMouseTarget.editor.close();
+      this.nowMouseTarget = null;
+    }
+    this.mousetool.close(boolean);
+  }
+
+  /**
+   *
+   *
+   *
+   *
+   *
+   *
+   * 地图上add设备
+   *
+   *
+   * @description:
+   * @param {*} deviceData marker的数据
+   * @param {*} compontent marker点击弹出的infowindow的组件
+   * @return {*}
+   */
+  addDevice(deviceData, compontent) {
+    const { longitude: lng, latitude: lat, type, companyType } = deviceData;
+    const icon = svgUrl[type];
+    let device = this.createMarker({
+      map: this.map,
+      anchor: "bottom-center",
+      icon,
+      position: [lng, lat],
+      extData: deviceData,
+    });
+    // device.hide();
+    // 如果没有有这个公司的数组，就创建，有就直接push
+    if (!Array.isArray(this.allDevic[companyType])) {
+      this.allDevic[companyType] = [];
+    }
+    this.allDevic[companyType].push(device);
+
+    // 设备的事件函数
+    this.deviceEvent(device, compontent);
+  }
+  deviceEvent(device, compontent) {
+    device.on("click", (e) => {
+      const target = e.target;
+      // 如果control==0就是默认值，没有使用123功能，就显示infowindow
+      if (this.control == 0) {
+        this.markerClick(target, compontent);
+      } else if (this.control == 2) {
+        // 2是已经上图的设备拥有的编辑功能
+      } else if (this.control == 3) {
+        // 3是删除操作
+      }
+    });
+  }
+  /** 点击marker出现infowindow
+   * @description:
+   * @param {*} target 点击的对象
+   * @param {*} compontent marker点击弹出的infowindow的组件
+   * @return {*}
+   */
+  markerClick(target, compontent) {
+    const deviceExtData = target.getExtData();
+    const { longitude: lng, latitude: lat } = deviceExtData;
+    // 创建一个可以控制的组件，将其dom插入infowindow
+    this.infowindowComponent = this.createInfowindowDom(
+      this.vue,
+      this,
+      deviceExtData,
+      compontent
+    );
+    // 没恩么用，控制台测试的时候用着玩的
+    window.func = () => {
+      const { longitude: lng, latitude: lat } = target.getExtData();
+      const cd = {
+        id: 1,
+        name: "9",
+        lng,
+        lat,
+      };
+      this.infowindowComponentChange(cd);
+      target.setExtData(cd);
+    };
+    this.infowindow = new AMap.InfoWindow({
+      isCustom: true,
+      content: this.infowindowComponent.$el,
+      position: [lng, lat],
+      // anchor: "top-left",
+      // offset: [20, -45],
+      anchor: "middle-left",
+      offset: [20, -10],
+    });
+    this.infowindow.open(this.map);
+  }
+  // 创建要加入到infowindow里的
+  createInfowindowDom(vueRoot, mapClass, deviceData, compontent) {
+    const Component = this.vue.$Vue.extend(compontent, {});
+    return new Component({
+      data() {
+        return {
+          // 当前vue实例
+          vueRoot,
+          // 自己写的map类
+          mapClass,
+          // 数据
+          deviceData,
+        };
+      },
+    }).$mount();
+  }
+  // 当前显示的infowindow内部的数据发生变化，一般在socket传回数据的时候使用
+  infowindowComponentChange(data) {
+    this.infowindowComponent.deviceData = data;
+  }
+  // 创建marker
+  createMarker(MarkerOptions) {
+    return new AMap.Marker(MarkerOptions);
+  }
+  // 地图上add管道
+  addPipeLine(objData, component) {
+    const { path, pipePressure, companyType } = objData;
+    // 根据压力获取颜色
+    const color = pipeColor[pipePressure];
+    const pipe = this.createPipeLine({
+      path,
+      strokeWeight: 4,
+      strokeColor: color,
+      extData: objData,
+      cursor: "pointer",
+    });
+    this.map.add(pipe);
+    // pipe.hide();
+    if (!Array.isArray(this.pipeArr[companyType])) {
+      this.pipeArr[companyType] = [];
+    }
+    this.pipeArr[companyType].push(pipe);
+    // console.log(this.pipeArr);
+    // this.map.panTo([path[0][0], path[0][1]]);
+    this.pipeEvent(pipe, component);
+  }
+  createPipeLine(pipeLineOptions) {
+    return new AMap.Polyline(pipeLineOptions);
+  }
+  pipeEvent(pipe, compontent) {
+    pipe.on("mouseover", (e) => {
+      const target = e.target;
+      // 获取当前颜色
+      const options = target.getOptions();
+      options.strokeColor = "blue";
+      target.setOptions(options);
+    });
+
+    pipe.on("mouseout", (e) => {
+      const target = e.target;
+      // 根据管道压力获取颜色
+      const { pipePressure } = target.getExtData();
+      const color = pipeColor[pipePressure];
+      // 获取当前颜色
+      const options = target.getOptions();
+      options.strokeColor = color;
+      target.setOptions(options);
+    });
+    pipe.on("click", (e) => {
+      const target = e.target;
+      target.lnglat = e.lnglat;
+      // 如果control==0就是默认值，没有使用123功能，就显示infowindow
+      if (this.control == 0) {
+        this.pipeClick(target, compontent);
+      } else if (this.control == 2) {
+        // 2是已经上图的设备拥有的编辑功能
+      } else if (this.control == 3) {
+        // 3是删除操作
+      }
+    });
+  }
+
+  pipeClick(target, compontent) {
+    const deviceExtData = target.getExtData();
+    const { lng, lat } = target.lnglat;
+    // 创建一个可以控制的组件，将其dom插入infowindow
+    this.infowindowComponent = this.createInfowindowDom(
+      this.vue,
+      this,
+      deviceExtData,
+      compontent
+    );
+    // 没恩么用，控制台测试的时候用着玩的
+    // window.func = () => {
+    //   const { lng, lat } = target.getExtData();
+    //   const cd = {
+    //     id: 1,
+    //     name: "9",
+    //     lng,
+    //     lat,
+    //   };
+    //   this.infowindowComponentChange(cd);
+    //   target.setExtData(cd);
+    // };
+    this.infowindow = new AMap.InfoWindow({
+      isCustom: true,
+      content: this.infowindowComponent.$el,
+      position: [lng, lat],
+      // anchor: "top-left",
+      // offset: [20, -15],
+      anchor: "middle-left",
+      offset: [20, 0],
+    });
+    this.infowindow.open(this.map);
+  }
+  infowindowClose() {
+      if(!this.infowindow) return;
+    this.infowindow.close();
+  }
+  // 根据公司过滤是否显示 公司由一个数组传过来
+  companyFilter(companyArr) {
+    for (let pipeItem in this.pipeArr) {
+      // 如果item属于数组说明要显示，凑则就是隐藏
+      if (companyArr.indexOf(+pipeItem) >= 0) {
+        this.pipeArr[pipeItem].forEach((pipe) => {
+          pipe.show();
+        });
+      } else {
+        this.pipeArr[pipeItem].forEach((pipe) => {
+          pipe.hide();
+        });
+      }
+    }
+    for (let deviceItem in this.allDevic) {
+      if (companyArr.indexOf(+deviceItem) >= 0) {
+        this.allDevic[deviceItem].forEach((device) => {
+          device.show();
+        });
+      } else {
+        this.allDevic[deviceItem].forEach((device) => {
+          device.hide();
+        });
+      }
+    }
+  }
+  // 卫星图切换
+  satellite = null;
+  changeMap(bool) {
+    // 卫星图
+    if (!bool) {
+      if (this.satellite) return;
+      this.satellite = new AMap.TileLayer.Satellite();
+      this.map.addLayer(this.satellite);
+    } else {
+      if (this.satellite) {
+        this.map.removeLayer(this.satellite);
+        this.satellite = null;
+      }
+    }
+  }
+}

gassafetyprogress-web/src/views/bigWindow/index.vue

 <!--
  * @Author: your name
- * @Date: 2022-01-07 13:36:55
- * @LastEditTime: 2022-01-07 14:32:07
+ * @Date: 2022-01-11 13:44:17
+ * @LastEditTime: 2022-02-17 11:47:53
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
- * @FilePath: /gassafetyprogress-web/src/views/bigWindow/index.vue
+ * @FilePath: /test/hello-world/src/views/Home.vue
 -->
 <template>
-  <div >
-    <div>big window</div>
-    <button class="go" @click="goIndex">go index</button>
+  <div class="home bigwindow">
+    <div class="goSystem" @click="$router.push('/index')">进入管理系统</div>
+    <div id="map"></div>
+    <Center :show="show" :centerData="centerData" />
+    <PipeColor />
+    <div class="home-div">
+      <img
+        src="@/assets/mapImages/bottom.png"
+        alt=""
+        style="width: 100%; height: 100%; z-index: 999"
+      />
+      <div class="listingsSty fangy">
+        <div
+          @click="allCompany"
+          :class="selarr.length == 3 ? 'active' : ''"
+          class="firsty"
+        >
+          全部
+        </div>
+        <div
+          class="firsty"
+          :class="selarr.indexOf(item.val) >= 0 ? 'active' : ''"
+          v-for="(item, index) in typeList"
+          :key="item.val"
+          @click="sel(index, item)"
+        >
+          {{ item.name }}
+        </div>
+      </div>
+    </div>
+    <!-- 弹框 -->
+    <div
+      id=""
+      style="position: fixed; top: 0; right: 0; width: 100px; height: 100px"
+    >
+      <!-- <markerInfoWindow></markerInfoWindow> -->
+    </div>
+
+    <!-- 头部 -->
+    <div class="banner-test">
+      <!-- <dv-decoration-5 style="width:100%;height:100%;" /> -->
+      <img src="@/assets/mapImages/top-banner.png" alt="" />
+      <div
+        style="
+          color: #fff;
+          width: 100%;
+          text-align: center;
+          font-weight: 700;
+          font-size: 32px;
+          position: fixed;
+          top: 0;
+          margin-top: 10px;
+          font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
+        "
+      >
+        <span class="tttt" style="">智慧管网安全监管平台</span>
+      </div>
+    </div>
+
+    <!-- 左边 -->
+    <div class="leftbar">
+      <leftBar ref="mychild2"></leftBar>
+    </div>
+    <!-- 右边 -->
+    <div class="rightbar">
+      <rightBar ref="mychild"></rightBar>
+    </div>
+
+    <!-- 左上角天气 -->
+    <div
+      class="weather"
+      style="
+        position: fixed;
+        top: 0;
+        margin-top: 5px;
+        margin-left: 10px;
+        left: 0;
+        z-index: 999;
+        width: 100px;
+        height: 50px;
+      "
+    >
+      <!-- <iframe src="../../static/weather.html" frameborder="0"></iframe> -->
+      <iframe
+        scrolling="no"
+        src="https://yiketianqi.com/api.php?style=ty&skin=pitaya&color=fff"
+        frameborder="0"
+        width="200"
+        height="55"
+        allowtransparency="true"
+      ></iframe>
+      <!-- <iframe scrolling="no" src="https://yiketianqi.com/api.php?style=ty&skin=pitaya" frameborder="0" width="300" height="75" allowtransparency="true"></iframe> -->
+    </div>
+
+    <!-- 右上角时间 -->
+    <div
+      class="right-time"
+      style="
+        position: fixed;
+        top: 0;
+        margin-top: 10px;
+        margin-right: 5px;
+        right: 0;
+        z-index: 999;
+        width: 190px;
+        height: 50px;
+        color: #fff;
+      "
+    >
+      <div style="height: 50px; width: 49%; float: right; font-size: 14px">
+        <div>{{ nowweek }}</div>
+        <div>{{ nowDate }}</div>
+      </div>
+      <div style="height: 50px; width: 45%; line-height: 47px; font-size: 20px">
+        {{ nowtime }}
+      </div>
+    </div>
+    <div style="height: 50px; width: 45%; line-height: 47px; font-size: 20px">
+      {{ nowtime }}
+    </div>
   </div>
 </template>
 
 <script>
+// @ is an alias to /src
+import { EditorMap } from "@/utils/mapClass/map";
+import {
+  pipeData,
+  tiaoyaxiang,
+  famen,
+  changzhan,
+  jiankong,
+  user,
+} from "@/utils/mapClass/config.js";
+import Line from "@/components/bigWindow/Line.vue";
+import VideoView from "@/components/bigWindow/VideoView.vue";
+import DeviceA from "@/components/bigWindow/DeviceA.vue";
+import User from "@/components/bigWindow/User.vue";
+import Center from "@/components/bigWindow/Center.vue";
+import PipeColor from "@/components/bigWindow/PipeColor.vue";
+
+// import markerInfoWindow from './components/markerInfoWindow.vue'
+import leftBar from "@/components/bigWindow/leftBar.vue";
+import rightBar from "@/components/bigWindow/rightBar.vue";
 export default {
-  methods:{
-    goIndex(){
-      this.$router.push('/index')
+  name: "Home",
+  components: {
+    leftBar,
+    rightBar,
+    Center,
+    PipeColor,
+  },
+  data() {
+    return {
+      map: null,
+      show: false,
+      centerData: null,
+      selarr: [1, 2, 3],
+      weather: "",
+      lower: "",
+      higher: "",
+      nowDate: "",
+      nowweek: "",
+      nowtime: "", // 当前日期
+
+      typeList: [
+        {
+          val: 1,
+          name: "中燃祥科",
+        },
+        {
+          val: 2,
+          name: "中诚然气",
+        },
+        {
+          val: 3,
+          name: "中燃韵科",
+        },
+      ],
+    };
+  },
+  watch: {
+    selarr(newValue) {
+      if (newValue.length == 3) {
+        this.$refs.mychild.choice(0);
+        this.$refs.mychild2.choice(0);
+      }
+    },
+  },
+  mounted() {
+    this.map = new EditorMap(
+      "map",
+      {
+        mapStyle: "amap://styles/f71d3a3d73e14f5b2bf5508bf1411758",
+        zoom: 14.5,
+      },
+      this
+    );
+    this.addPipeLine();
+    this.addDevice(tiaoyaxiang, DeviceA);
+    this.addDevice(famen, DeviceA);
+    this.addDevice(changzhan, DeviceA);
+    this.addDevice(user, User);
+    this.addDevice(jiankong, VideoView);
+
+    this.currentTime();
+    this.$refs.mychild.choice(0);
+    this.$refs.mychild2.choice(0);
+  },
+  methods: {
+    addPipeLine() {
+      for (let comp in pipeData) {
+        pipeData[comp].forEach((pipe) => {
+          this.map.addPipeLine(pipe, Line);
+        });
+      }
+    },
+    // 设备上图
+    addDevice(data, component) {
+      for (let comp in data) {
+        data[comp].forEach((pipe) => {
+          this.map.addDevice(pipe, component);
+        });
+      }
+    },
+    centerShow(boolean) {
+      this.show = boolean;
+    },
+    centerDataFunc(centerData) {
+      this.centerData = centerData;
+      console.log(centerData);
+      this.show = true;
+    },
+
+    allCompany() {
+      if (this.selarr.length == 3) {
+        this.selarr = [];
+      } else {
+        this.selarr = [1, 2, 3];
+      }
+
+      this.map.companyFilter(this.selarr);
+      this.map.infowindowClose();
+      this.show = false;
+    },
+    sel(index, item) {
+      this.map.infowindowClose();
+      this.show = false;
+      const ind = this.selarr.indexOf(item.val);
+      if (ind >= 0) {
+        this.selarr.splice(ind, 1);
+        if (item.val == 3) {
+          this.$refs.mychild.choice(1);
+          this.$refs.mychild2.choice(1);
+        } else {
+          this.$refs.mychild.choice(item.val + 1);
+          this.$refs.mychild2.choice(item.val + 1);
+        }
+      } else {
+        this.selarr.push(item.val);
+        this.$refs.mychild.choice(item.val);
+        this.$refs.mychild2.choice(item.val);
+      }
+      this.map.companyFilter(this.selarr);
+    },
+    currentTime() {
+      setInterval(() => {
+        this.formatDate();
+      }, 1000);
+    },
+    formatDate() {
+      let date = new Date();
+      let year = date.getFullYear(); // 年
+      let month = date.getMonth() + 1; // 月
+      let day = date.getDate(); // 日
+      let week = date.getDay(); // 星期
+      let weekArr = [
+        "星期日",
+        "星期一",
+        "星期二",
+        "星期三",
+        "星期四",
+        "星期五",
+        "星期六",
+      ];
+      let hour = date.getHours(); // 时
+      hour = hour < 10 ? "0" + hour : hour; // 如果只有一位，则前面补零
+      let minute = date.getMinutes(); // 分
+      minute = minute < 10 ? "0" + minute : minute; // 如果只有一位，则前面补零
+      let second = date.getSeconds(); // 秒
+      second = second < 10 ? "0" + second : second; // 如果只有一位，则前面补零
+      this.nowtime = `${hour}:${minute}:${second}`;
+      this.nowweek = `${weekArr[week]}`;
+      this.nowDate = `${year}/${month}/${day}`;
+    },
+  },
+  // 销毁定时器
+  beforeDestroy() {
+    if (this.formatDate) {
+      clearInterval(this.formatDate); // 在Vue实例销毁前，清除时间定时器
     }
+  },
+};
+</script>
+<style lang="scss" scoped>
+.home {
+  position: relative;
+  height: 100vh;
+}
+.goSystem {
+  position: fixed;
+  z-index: 9999;
+  top: 20px;
+  right: 210px;
+  font-size: 18px;
+  color: #18baff;
+  cursor: pointer;
+  &:hover {
+    color: #1890ff;
   }
 }
-</script>
+#map {
+  position: absolute;
+  top: 0px;
+  bottom: 0;
+  width: 100%;
+}
+.banner-test {
+  width: 100%;
+  height: 70px;
+  position: relative;
+  top: 0;
+  z-index: 999;
+}
+.banner-test img {
+  width: 100%;
+  height: 100%;
+}
 
-<style lang="scss" scoped>
-.go{
-cursor: pointer;
+.leftbar {
+  width: 450px;
+  height: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  background-image: -webkit-gradient(
+    linear,
+    right top,
+    left top,
+    color-stop(20%, rgb(17 34 56 / 90%)),
+    color-stop(80%, rgb(18 24 29))
+  );
+}
+.rightbar {
+  width: 450px;
+  height: 100%;
+  position: fixed;
+  top: 0;
+  right: 0;
+  background-image: -webkit-gradient(
+    linear,
+    left top,
+    right top,
+    color-stop(20%, rgb(17 34 56 / 90%)),
+    color-stop(80%, rgb(18 24 29))
+  );
 }
-</style>>
+.home-div {
+  width: 70%;
+  height: 70px;
+  position: fixed;
+  bottom: 0;
+  margin-left: 15%;
+  z-index: 1000;
+}
+.listingsSty {
+  // width: 24%;
+  /* height: 25px; */
+  position: fixed;
+  /* border: 1px solid #fff; */
+  bottom: 0;
+  margin-bottom: 10px;
+  left: 37%;
+}
+.firsty {
+  width: 90px;
+  height: 35px;
+  text-align: center;
+  line-height: 35px;
+  /* border: 1px solid #fff; */
+  color: #fff;
+  font-size: 17px;
+  float: left;
+  margin-left: 20px;
+  cursor: pointer;
+}
+.active {
+  text-shadow: 0 0 10px #2ee7e7, 0 0 10px #2ee7e7, 0 0 15px #2ee7e7,
+    0 0 20px #2ee7e7;
 
+  /*position:relative;*/
+  /*&::after{
+    width: 80px;
+    height: 50px;
+    z-index: -1;
+    content: " ";
+    position: absolute;
+    top: -7px;
+    left: 50%;
+    margin-left:-40px;
+    background: url(/img/bac1.0ec28f27.png);
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+    background-position: center;
+    color: aquamarine;
+  }*/
+}
+.weather-icon {
+  float: left;
+  width: 30px !important;
+  height: 30px !important;
+  margin-top: 10px !important;
+  margin-left: 10px !important;
+  padding-right: 5px;
+}
+.tttt {
+  background-image: -webkit-linear-gradient(
+    bottom,
+    rgb(134, 185, 233),
+    #ffffff
+  );
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+</style>
\ No newline at end of file

gassafetyprogress-web/src/views/complainDeal/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="complainName">
+      <el-form-item label="投诉人" prop="complainName">
         <el-input
           v-model="queryParams.complainName"
           placeholder="请输入投诉人姓名"
@@ -10,101 +10,40 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="投诉人电话" prop="complainPhone">
-        <el-input
-          v-model="queryParams.complainPhone"
-          placeholder="请输入投诉人电话"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="投诉事项" prop="complainMatter">
-        <el-input
-          v-model="queryParams.complainMatter"
-          placeholder="请输入投诉事项"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="转办记录" prop="transferRecord">
-        <el-input
-          v-model="queryParams.transferRecord"
-          placeholder="请输入转办记录"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="办理情况" prop="dealCondition">
-        <el-input
-          v-model="queryParams.dealCondition"
-          placeholder="请输入办理情况"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="指派单位名称" prop="complainAssignEnterproseName">
-        <el-input
-          v-model="queryParams.complainAssignEnterproseName"
-          placeholder="请输入指派单位名称"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="指派单位id" prop="complainAssignEnterproseId">
-        <el-input
-          v-model="queryParams.complainAssignEnterproseId"
-          placeholder="请输入指派单位id"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="指派人" prop="complainAssignManId">
-        <el-input
-          v-model="queryParams.complainAssignManId"
-          placeholder="请输入指派人"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="指派人id" prop="complainAssignMan">
-        <el-input
-          v-model="queryParams.complainAssignMan"
-          placeholder="请输入指派人id"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="任务状态：1.派发中 2.反馈 3.归档" prop="complainStatus">
-        <el-select v-model="queryParams.complainStatus" placeholder="请选择任务状态：1.派发中 2.反馈 3.归档" clearable size="small">
-          <el-option label="请选择字典生成" value="" />
+
+      <el-form-item label="指派单位" prop="complainAssignEnterproseId">
+        <el-select v-model="queryParams.complainAssignEnterproseId" placeholder="请选择预案等级" clearable size="small">
+          <el-option
+            v-for = "dict in enterpriseList"
+            :key = "dict.enterpriseId"
+            :label = "dict.enterpriseName"
+            :value = "dict.enterpriseId"
+          />
         </el-select>
       </el-form-item>
-      <el-form-item label="是否删除(0正常，1删除)" prop="isDel">
-        <el-input
-          v-model="queryParams.isDel"
-          placeholder="请输入是否删除(0正常，1删除)"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remarks">
-        <el-input
-          v-model="queryParams.remarks"
-          placeholder="请输入备注"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
+
+      <!--<el-form-item label="指派人" prop="complainAssignManId">-->
+        <!--<el-select v-model="queryParams.complainAssignManId" placeholder="请选择预案等级" clearable size="small">-->
+          <!--<el-option-->
+            <!--v-for = "dict in userList"-->
+            <!--:key = "dict.id"-->
+            <!--:label = "dict.nickName"-->
+            <!--:value = "dict.id"-->
+          <!--/>-->
+        <!--</el-select>-->
+      <!--</el-form-item>-->
+      <el-form-item label="任务状态" prop="complainStatus">
+        <el-select v-model="queryParams.complainStatus" placeholder="请选择任务状态" clearable size="small">
+            <el-option
+              v-for="dict in taskStateOptions"
+              :key="dict.dictValue"
+              :label="dict.dictLabel"
+              :value="dict.dictValue"
+            ></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>
@@ -122,28 +61,7 @@
           v-hasPermi="['complainDeal:complainDeal:add']"
         >新增</el-button>
       </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['complainDeal:complainDeal:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['complainDeal:complainDeal:remove']"
-        >删除</el-button>
-      </el-col>
+
       <el-col :span="1.5">
         <el-button
           type="warning"
@@ -159,19 +77,14 @@
     </el-row>
 
     <el-table v-loading="loading" :data="complainDealList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="投诉处置id" align="center" prop="complainDealId" />
+      <!--<el-table-column label="投诉处置id" align="center" prop="complainDealId" />-->
       <el-table-column label="投诉人姓名" align="center" prop="complainName" />
       <el-table-column label="投诉人电话" align="center" prop="complainPhone" />
       <el-table-column label="投诉事项" align="center" prop="complainMatter" />
-      <el-table-column label="转办记录" align="center" prop="transferRecord" />
       <el-table-column label="办理情况" align="center" prop="dealCondition" />
       <el-table-column label="指派单位名称" align="center" prop="complainAssignEnterproseName" />
-      <el-table-column label="指派单位id" align="center" prop="complainAssignEnterproseId" />
-      <el-table-column label="指派人" align="center" prop="complainAssignManId" />
-      <el-table-column label="指派人id" align="center" prop="complainAssignMan" />
-      <el-table-column label="任务状态：1.派发中 2.反馈 3.归档" align="center" prop="complainStatus" />
-      <el-table-column label="是否删除(0正常，1删除)" align="center" prop="isDel" />
+      <el-table-column label="指派人" align="center" prop="complainAssignMan" />
+      <el-table-column label="任务状态" align="center" prop="complainStatus" :formatter="taskStateFormat" />
       <el-table-column label="备注" align="center" prop="remarks" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
@@ -182,6 +95,12 @@
             @click="handleUpdate(scope.row)"
             v-hasPermi="['complainDeal:complainDeal:edit']"
           >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-document-copy"
+            @click="handleDtail(scope.row)"
+          >详情</el-button>
           <el-button
             size="mini"
             type="text"
@@ -202,45 +121,64 @@
     />
 
     <!-- 添加或修改投诉处置对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="投诉人姓名" prop="complainName">
-          <el-input v-model="form.complainName" placeholder="请输入投诉人姓名" />
-        </el-form-item>
-        <el-form-item label="投诉人电话" prop="complainPhone">
-          <el-input v-model="form.complainPhone" placeholder="请输入投诉人电话" />
-        </el-form-item>
-        <el-form-item label="投诉事项" prop="complainMatter">
-          <el-input v-model="form.complainMatter" placeholder="请输入投诉事项" />
-        </el-form-item>
+    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+        <div class="division">
+          <div style="width: 50%;">
+            <el-form-item label="投诉人姓名" prop="complainName">
+              <el-input v-model="form.complainName" placeholder="请输入投诉人姓名" :disabled="readonly"/>
+            </el-form-item>
+            <el-form-item label="投诉人电话" prop="complainPhone">
+              <el-input v-model="form.complainPhone" placeholder="请输入投诉人电话" :disabled="readonly"/>
+            </el-form-item>
+            <el-form-item label="投诉事项" prop="complainMatter">
+              <el-input v-model="form.complainMatter" placeholder="请输入投诉事项" :disabled="readonly"/>
+            </el-form-item>
+          </div>
+          <div style="width: 50%;">
+            <el-form-item label="指派单位" prop="complainAssignEnterproseId" >
+              <el-select style="width: 100%" v-model="form.complainAssignEnterproseName" placeholder="请选择预案等级"  @change="qiyechang" :disabled="readonly">
+                <el-option
+                  v-for = "dict in enterpriseList"
+                  :key = "dict.enterpriseId"
+                  :label = "dict.enterpriseName"
+                  :value = "dict.enterpriseId"
+                />
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="指派人" prop="complainAssignManId">
+              <el-select v-model="form.complainAssignMan" placeholder="请选择预案等级" clearable style = "width: 100%" @change="manChang" :disabled="readonly">
+                <el-option
+                  v-for = "dict in peopleList"
+                  :key = "dict.id"
+                  :label = "dict.nickName"
+                  :value = "dict.id"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="办理情况" prop="dealCondition">
+              <el-input v-model="form.dealCondition" placeholder="请输入办理情况" :disabled="readonly"/>
+            </el-form-item>
+
+          </div>
+        </div>
+
         <el-form-item label="转办记录" prop="transferRecord">
-          <el-input v-model="form.transferRecord" placeholder="请输入转办记录" />
-        </el-form-item>
-        <el-form-item label="办理情况" prop="dealCondition">
-          <el-input v-model="form.dealCondition" placeholder="请输入办理情况" />
-        </el-form-item>
-        <el-form-item label="指派单位名称" prop="complainAssignEnterproseName">
-          <el-input v-model="form.complainAssignEnterproseName" placeholder="请输入指派单位名称" />
-        </el-form-item>
-        <el-form-item label="指派单位id" prop="complainAssignEnterproseId">
-          <el-input v-model="form.complainAssignEnterproseId" placeholder="请输入指派单位id" />
-        </el-form-item>
-        <el-form-item label="指派人" prop="complainAssignManId">
-          <el-input v-model="form.complainAssignManId" placeholder="请输入指派人" />
-        </el-form-item>
-        <el-form-item label="指派人id" prop="complainAssignMan">
-          <el-input v-model="form.complainAssignMan" placeholder="请输入指派人id" />
+          <el-input v-model="form.transferRecord" type="textarea"  placeholder="请输入转办记录" :disabled="readonly"/>
         </el-form-item>
-        <el-form-item label="任务状态：1.派发中 2.反馈 3.归档">
-          <el-radio-group v-model="form.complainStatus">
-            <el-radio label="1">请选择字典生成</el-radio>
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item label="是否删除(0正常，1删除)" prop="isDel">
-          <el-input v-model="form.isDel" placeholder="请输入是否删除(0正常，1删除)" />
+        <el-form-item label="任务状态">
+          <el-select v-model="form.complainStatus" placeholder="请选择任务状态"  size="small" :disabled="readonly">
+            <el-option
+              v-for="dict in taskStateOptions"
+              :key="dict.dictValue"
+              :label="dict.dictLabel"
+              :value="dict.dictValue"
+            ></el-option>
+          </el-select>
         </el-form-item>
         <el-form-item label="备注" prop="remarks">
-          <el-input v-model="form.remarks" placeholder="请输入备注" />
+          <el-input v-model="form.remarks" placeholder="请输入备注" :disabled="readonly"/>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -252,8 +190,8 @@
 </template>
 
 <script>
-import { listComplainDeal, getComplainDeal, delComplainDeal, addComplainDeal, updateComplainDeal, exportComplainDeal } from "@/api/complainDeal/complainDeal";
-
+import { listComplainDeal, getComplainDeal, delComplainDeal, addComplainDeal, updateComplainDeal, exportComplainDeal,getUserList } from "@/api/complainDeal/complainDeal";
+import {enterpriseList} from "@/api/system/eventInfo";
 export default {
   name: "ComplainDeal",
   components: {
@@ -276,6 +214,11 @@ export default {
       total: 0,
       // 投诉处置表格数据
       complainDealList: [],
+      enterpriseList:[],
+      peopleList:[],
+      readonly:false,
+      // 投书状态类型：1.派发中 2.反馈 3.归档
+      taskStateOptions: [],
       // 弹出层标题
       title: "",
       // 是否显示弹出层
@@ -298,7 +241,9 @@ export default {
         remarks: null
       },
       // 表单参数
-      form: {},
+      form: {
+        peopleList:[]
+      },
       // 表单校验
       rules: {
       }
@@ -306,7 +251,10 @@ export default {
   },
   created() {
     this.getList();
-    console.log("===============================")
+    this.getEnterpriseList();
+    this.getDicts("task_state").then(response => {
+      this.taskStateOptions = response.data;
+    });
   },
   methods: {
     /** 查询投诉处置列表 */
@@ -318,6 +266,36 @@ export default {
         this.loading = false;
       });
     },
+    //公司列表
+    getEnterpriseList() {
+      console.log(this.uploadImgUrl)
+      enterpriseList(this.queryParams).then(response => {
+        this.enterpriseList = response.data;
+      });
+    },
+    qiyechang(value){
+      this.form.complainAssignMan="";
+      let obj = {};
+      obj = this.enterpriseList.find((item)=>{
+        return item.enterpriseId === value;
+      });
+      this.form.complainAssignEnterproseName = obj.enterpriseName;
+      this.form.complainAssignEnterproseId = value;
+      getUserList(value).then(response => {
+        console.log(response.data)
+        //console.log(this.peopleList)
+        this.peopleList=response.data;
+      });
+    },
+    manChang(value){
+      let obj = {};
+      obj = this.peopleList.find((item)=>{
+        return item.id === value;
+      });
+      this.form.complainAssignManId === value;
+      this.form.complainAssignMan = obj.nickName;
+      console.log(this.form);
+    },
     // 取消按钮
     cancel() {
       this.open = false;
@@ -362,14 +340,29 @@ export default {
       this.single = selection.length!==1
       this.multiple = !selection.length
     },
+    taskStateFormat(row, column) {
+      var status = this.selectDictLabel(this.taskStateOptions, row.complainStatus);
+      if(status=='派发中'){
+        return <p style='color: #ff4949'>派发中</p>
+      }else if("反馈"){
+        return <p style='color: #1890ff'>派发中</p>
+      }else{
+        return <p style='color: #30B46B'>派发中</p>
+      }
+      return this.selectDictLabel(this.taskStateOptions, row.complainStatus);
+    },
     /** 新增按钮操作 */
     handleAdd() {
+      this.readonly = false;
+      this.peopleList=[];
       this.reset();
       this.open = true;
       this.title = "添加投诉处置";
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
+      this.readonly = false;
+      this.peopleList=[];
       this.reset();
       const complainDealId = row.complainDealId || this.ids
       getComplainDeal(complainDealId).then(response => {
@@ -398,6 +391,16 @@ export default {
         }
       });
     },
+    handleDtail(row) {
+      this.readonly = true;
+      this.reset();
+      const complainDealId = row.complainDealId || this.ids
+      getComplainDeal(complainDealId).then(response => {
+        this.form = response.data;
+      this.open = true;
+      this.title = "修改投诉处置";
+    });
+    },
     /** 删除按钮操作 */
     handleDelete(row) {
       const complainDealIds = row.complainDealId || this.ids;
@@ -430,3 +433,10 @@ export default {
   }
 };
 </script>
+<style>
+  .division{
+    display:flex;
+    flex-direction:row;
+    justify-content:flex-start;
+  }
+</style>

gassafetyprogress-web/src/views/index.vue

 <template>
-  <div class="app-container home">
+  <div class="app-container homeA">
     <el-row :gutter="20">
       <el-col :sm="24" :lg="24">
         <blockquote class="text-warning" style="font-size: 14px">
@@ -581,7 +581,7 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.home {
+.homeA {
   blockquote {
     padding: 10px 20px;
     margin: 0 0 20px;

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

 <template>
 
-  <div class="app-container">
-    <el-row>
-      <el-col :span="5">
+  <div class="app-container" style="">
+    <div style="height: 100%;">
+      <el-col style="border:1px solid #cccccc;height: 100%;" :span="4">
         <el-tree :data="videoData" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
       </el-col>
-      <el-col :span="19">
-        <div id="player" style="width: calc(67vw - 8px);height: calc((67vw - 8px) * 5 / 8)"></div>
+      <el-col :span="20" style="height: 100%;">
+        <div id="player"></div>
       </el-col>
-    </el-row>
-
-
-
+    </div>
   </div>
 </template>
-<!--<script src="@api/video/h5player.js"></script>-->
 <script>
 import { getVideoTree } from "@/api/video/manager";
 import { getPreviewURLs } from "@/api/video/artemis"
@@ -116,3 +112,15 @@ export default {
   }
 };
 </script>
+<style scoped lang="scss">
+  .app-container{
+    position:absolute;
+    top:0;
+    bottom:0;
+    width: 100%;
+  }
+  #player{
+     width: 100% ;
+     height: 100% ;
+  }
+</style>

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

@@ -147,7 +147,7 @@
             @click="handleDelete(scope.row)"
             v-hasPermi="['system:order:remove']"
           >删除</el-button>
-          <el-button v-if="'inpector'!= roleType && (scope.row.workAssignManId == '' || scope.row.workAssignManId == null) && scope.row.workStatus == '0'"
+          <el-button v-if=" (('enterprise'== roleType && (scope.row.workAssignManId == '' || scope.row.workAssignManId == null)) || ('zhengfu'== roleType && (scope.row.workAssignEnterproseId == '' || scope.row.workAssignEnterproseId == null))) && scope.row.workStatus == '0'"
                      size="mini"
                      type="text"
                      icon="el-icon-edit"
@@ -184,7 +184,7 @@
     />
 
     <!-- 添加或修改燃气任务对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="900px" @closed="dialogClose" @open="dialogOpen">
+    <el-dialog :title="title" :visible.sync="open" width="900px" @closed="dialogClose" @open="dialogOpen" :close-on-click-modal="false">
     <el-form ref="form" :model="form" :rules="rules" label-width="80px">
       <el-row>
         <el-col :span="12">
@@ -225,7 +225,7 @@
         <el-col :span="12">
           <el-form-item label="指派人" prop="workAssignMan">
             <!--<el-input v-model="form.workAssignManId" placeholder="请输入指派人" />-->
-            <el-select v-model="form.workAssignManId" placeholder="请输入指派人" style="width: 350px" @change="selectInspection($event,'edit')" :disabled="isDetail">
+            <el-select v-model="form.workAssignManId" placeholder="请输入指派人" style="width: 350px" @change="selectInspection($event,'edit')" :disabled="isDetail" clearable>
               <el-option
                 v-for="item in inspectors"
                 :key="item.userId "
@@ -257,7 +257,7 @@
       <el-form-item label="巡检路线" prop="inspectionRoute" v-show="form.workType=='2'">
         <el-input v-model="form.inspectionRoute" type="textarea" placeholder="请输入巡检路线" :disabled="isDetail"/>
       </el-form-item>
-      <el-form-item label="问题描述" prop="problemDescription">
+      <el-form-item label="问题描述" prop="problemDescription" v-show="form.workType=='3'">
         <el-input v-model="form.problemDescription" type="textarea" placeholder="请输入问题描述" :disabled="isDetail"/>
       </el-form-item>
       <el-form-item label="整改方案" prop="rectificationPlan" v-show="form.workType=='3' && isDetail && (form.workStatus =='2' || form.workStatus =='3')">
@@ -626,9 +626,10 @@ export default {
         this.form = response.data;
         this.open = true;
         this.title = "修改燃气任务";
+        this.getEnterpriseLists();
+        this.getInspectionUserList(response.data.workAssignEnterproseId);
       });
-      this.getEnterpriseLists();
-      this.getInspectionUserList(row.workAssignEnterproseId);
+
     },
     /** 提交按钮 */
     submitForm() {
@@ -705,6 +706,8 @@ export default {
     selectworkAssignEnterprose(enterpriseId){
       this.form.workAssignManId = "";
       this.workForm.workAssignManId = "";
+      this.workForm.workAssignMan="";
+      this.form.workAssignMan = "";
       this.getInspectionUserList(enterpriseId);
       let enterpriseName = this.enterprises.find(val=>val.enterpriseId == enterpriseId).enterpriseName;
       this.form.workAssignEnterproseName = enterpriseName;
@@ -740,6 +743,7 @@ export default {
     //任务下发
     workIssue(row){
       this.title = "任务下发";
+      this.workForm = {};
       this.workForm.workId = row.workId;
       this.workForm.workTitle = row.workTitle;
       this.workForm.workType = row.workType;
@@ -747,10 +751,10 @@ export default {
         this.workForm.workAssignEnterproseId = row.workAssignEnterproseId;
         this.workForm.workAssignEnterproseName = row.workAssignEnterproseName;
       }
-      if(row.workAssignManId){
+     /* if(row.workAssignManId){
         this.workForm.workAssignManId =  row.workAssignManId;
         this.workForm.workAssignMan = row.workAssignMan;
-      }
+      }*/
       //this.workForm = row;
       this.workForm.workStatus = '1';
       this.workOpen = true;

gassafetyprogress-web/src/views/statistic/hiddenStatisticAnalysis/index.vue

+<template>
+  <div class="app-container">
+    <div style="width: 100%;height: 10em;">
+      <div class="second-div">
+        <div style="width: 50%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/hidden.png" width="40%" style="margin-top: 2rem;">
+          <p>隐患数量</p>
+        </div>
+        <div style="width: 50%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{hiddenObj.hiddenTotal}}</div>
+      </div>
+      <div class="second-div">
+        <div style="width: 50%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/hidden.png" width="40%" style="margin-top: 2rem;">
+          <p>已完成数量</p>
+        </div>
+        <div style="width: 50%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{hiddenObj.completedTotal}}</div>
+      </div>
+      <div class="second-div">
+        <div style="width: 50%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/hidden.png" width="40%" style="margin-top: 2rem;">
+          <p>未完成数量</p>
+        </div>
+        <div style="width: 50%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{hiddenObj.incompleteTotal}}</div>
+      </div>
+      <div class="second-div">
+        <div style="width: 50%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/yh1.png" width="40%" style="margin-top: 2rem;">
+          <p>一级隐患</p>
+        </div>
+        <div style="width: 50%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{hiddenObj.oneLevelTotal}}</div>
+      </div>
+      <div class="second-div">
+        <div style="width: 50%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/yh2.png" width="40%" style="margin-top: 2rem;">
+          <p>二级隐患</p>
+        </div>
+        <div style="width: 50%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{hiddenObj.twoLevelTotal}}</div>
+      </div>
+      <div class="second-div">
+        <div style="width: 50%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/yh3.png" width="40%" style="margin-top: 2rem;">
+          <p>三级隐患</p>
+        </div>
+        <div style="width: 50%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{hiddenObj.threeLevelTotal}}</div>
+      </div>
+    </div>
+
+    <div style="width: 100%; padding: 30px 10px 0px 15px;">
+      <el-table v-loading="loading" :data="hiddenList" >
+        <el-table-column label="隐患名称" align="center" prop="hiddenTitle" width="200px"/>
+        <el-table-column label="隐患等级" align="center" prop="hiddenType">
+          <template slot-scope="scope">
+            <span v-if="scope.row.hiddenType == '1'">一级隐患</span>
+            <span v-if="scope.row.hiddenType == '2'">二级隐患</span>
+            <span v-if="scope.row.hiddenType == '3'">三级隐患</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="隐患位置" align="center" prop="hiddenLocation" width="300px"/>
+        <el-table-column label="隐患发现人员" align="center" prop="hiddenFindPeople"/>
+        <el-table-column label="发现时间" align="center" prop="hiddenFindDate" width="150px"/>
+        <el-table-column label="处理方案" align="center" prop="dealPlanUrl" width="150px">
+          <template slot-scope="scope">
+          <span
+            class="dbtn"
+            @click="checkFile(scope.row.dealPlanUrl)"
+            v-if="scope.row.dealPlan != ''"
+          >
+            <i class="el-icon el-icon-view"></i>查看/下载
+          </span>
+            <span v-else>-</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="整治情况" align="center" prop="remediation" width="120px">
+          <template slot-scope="scope">
+            <span v-if="scope.row.remediation == '1'">已完成</span>
+            <span v-if="scope.row.remediation == '2'">未完成</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" width="120px">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-edit"
+              @click="showDetail(scope.row)"
+              v-hasPermi="['standingBook:hidden:query']"
+            >详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+      <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body @cancel="cancel" @close="cancel">
+        <el-row>
+          <el-col :span="14">
+            <el-form ref="detailForm" :model="detailForm" label-width="120px">
+              <el-row>
+                <el-col :span="10">
+                  <el-form-item label="隐患名称:">
+                    <font>{{detailForm.hiddenTitle}}</font>
+                  </el-form-item>
+                  <el-form-item label="隐患发现人员:">
+                    <font>{{detailForm.hiddenFindPeople}}</font>
+                  </el-form-item>
+                  <el-form-item label="发现时间:">
+                    <font>{{detailForm.hiddenFindDate}}</font>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="13">
+                  <el-form-item label="隐患等级:">
+                    <font v-if="detailForm.hiddenType == '1'">一级隐患</font>
+                    <font v-if="detailForm.hiddenType == '2'">二级隐患</font>
+                    <font v-if="detailForm.hiddenType == '3'">三级隐患</font>
+                  </el-form-item>
+                  <el-form-item label="隐患位置:">
+                    <font>{{detailForm.hiddenLocation}}</font>
+                  </el-form-item>
+                  <el-form-item label="处理方案:">
+                    <span class="dbtn" @click="checkFile(detailForm.dealPlanUrl)" v-if="detailForm.dealPlan != ''">
+                      <i class="el-icon el-icon-view"></i>查看/下载
+                    </span>
+                    <span v-else>-</span>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row>
+                <el-form-item label="隐患内容:">
+                  <font>{{detailForm.hiddenContent}}</font>
+                </el-form-item>
+              </el-row>
+              <el-row>
+                <el-form-item label="整治情况:">
+                  <font v-if="detailForm.remediation == '1'">已完成</font>
+                  <font v-if="detailForm.remediation == '2'">未完成</font>
+                </el-form-item>
+              </el-row>
+              <el-row>
+                <el-form-item label="备注信息:">
+                  <font v-if="detailForm.remarks != '' && detailForm.remarks != null">{{detailForm.remarks}}</font>
+                  <font v-else> - </font>
+                </el-form-item>
+              </el-row>
+            </el-form>
+          </el-col>
+
+          <el-col :span="9">
+            <div style="width: 100%;height: 390px;margin-top: -25px; border: 1px solid rgb(218, 213, 213);margin-bottom: 10px;">
+              <div style="width: 100%;height: 100%" id="hiddenContainer"></div>
+            </div>
+          </el-col>
+        </el-row>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { hiddenStatistic } from "@/api/statistic/statisticAnalysis";
+  import { listHidden, getHidden } from "@/api/standingBook/hidden";
+  import { EditorMap } from "@/utils/mapClass/getPath.js";
+
+  export default {
+    name: "HiddenStatisticAnalysis",
+    components: {
+    },
+    data() {
+      return {
+        // 统计数据
+        hiddenObj: {},
+        // 遮罩层
+        loading: true,
+        // 隐患台账表格数据
+        hiddenList: [],
+        // 总条数
+        total: 0,
+        // 地图
+        map: null,
+        devicePos: [],
+        // 弹出层标题
+        title: "",
+        // 是否显示弹出层
+        open: false,
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+        },
+        // 表单参数
+        detailForm: {},
+      };
+    },
+    created() {
+    },
+    mounted() {
+      this.getStatiData();
+      this.getList();
+    },
+    methods: {
+      getStatiData() {
+        hiddenStatistic().then(response => {
+          this.hiddenObj = response.data;
+          console.log("this.hiddenObj",this.hiddenObj)
+        });
+      },
+      getList() {
+        this.loading = true;
+        listHidden(this.queryParams).then(response => {
+          this.hiddenList = response.rows;
+          this.total = response.total;
+          this.loading = false;
+        });
+      },
+      checkFile(url) {
+        window.open(url,'_blank');
+      },
+      reset() {
+        this.detailForm = {
+          hiddenId: null,
+          hiddenTitle: null,
+          hiddenContent: null,
+          hiddenLocation: null,
+          longitude:null,
+          latitude: null,
+          hiddenType: null,
+          hiddenFindPeople: null,
+          hiddenFindDate: null,
+          dealPlan: null,
+          remediation: null,
+          createBy: null,
+          createTime: null,
+          updateBy: null,
+          updateTime: null,
+          isDel: null,
+          remarks: null
+        };
+        this.resetForm("detailForm");
+        this.devicePos = [];
+      },
+      /** 详细信息跳转 */
+      showDetail(row) {
+        this.reset();
+        getHidden(row.hiddenId).then(response => {
+          this.detailForm = response.data;
+          this.devicePos = [this.detailForm.longitude, this.detailForm.latitude];
+          console.log("this.devicePos",this.devicePos);
+          this.open = true;
+          this.title = "隐患整治台账详情";
+
+          this.$nextTick(() => {
+            this.map = new EditorMap("hiddenContainer", {}, this);
+            this.map.addDevice({ path: this.devicePos });
+            this.map.nowMouseTarget = null;
+            this.map.mousetoolClose(false);
+          });
+        });
+      },
+      cancel() {
+        this.open = false;
+        this.reset();
+        this.map.destroy();
+      },
+    }
+  };
+</script>
+<style>
+  .second-div{
+    margin-top: 20px;
+    width: 15%;
+    float: left;
+    margin-left: 1.5%;
+    height: 9rem;
+    color: #515a6e;
+    background-color: #FFF;
+    border-radius: 5px;
+    border: 2px solid rgb(22, 151, 207, 0.3);
+    box-shadow:  0 0 8px 8px rgba(131, 229, 255, 0.1)inset, 0 0 7px 7px rgba(22, 151, 207, 0.2);
+  }
+  .dbtn {
+    display: inline-block;
+    line-height: normal;
+    padding-left: 2px;
+    padding-right: 2px;
+    cursor: pointer;
+    border-radius: 3px;
+    border-style: solid;
+    border-width: 0;
+    color: rgb(48, 180, 107);
+  }
+  .dbtn:hover {
+    border-width: 1px;
+    border-color: rgb(48, 180, 107);
+  }
+</style>

gassafetyprogress-web/src/views/statistic/troubleStatisticAnalysis/index.vue

+<template>
+  <div class="app-container">
+    <div style="width: 100%;height: 10em;">
+      <div class="first-div">
+        <div style="width: 40%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/trouble.png" width="25%" style="margin-top: 2rem;">
+          <p>事故发生数</p>
+        </div>
+        <div style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{troubleObj.troubleTotal}}</div>
+      </div>
+      <div class="first-div">
+        <div style="width: 40%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/trouble.png" width="25%" style="margin-top: 2rem;">
+          <p>伤亡人数</p>
+        </div>
+        <div style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{troubleObj.injuryTotal+troubleObj.deathTotal}}</div>
+      </div>
+      <div class="first-div">
+        <div style="width: 40%;height: 100%; text-align: center;float: left;font-size: 15px;">
+          <img src="../../../assets/trouble.png" width="25%" style="margin-top: 2rem;">
+          <p>事故处理办结率</p>
+        </div>
+        <div style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{troubleObj.completionRate}}%</div>
+      </div>
+    </div>
+
+    <div style="width: 100%; padding: 30px;">
+      <el-table v-loading="loading" :data="troubleList" >
+        <el-table-column label="事故名称" align="center" prop="troubleName" width="200px"/>
+        <el-table-column label="事故类型" align="center" prop="troubleType" width="130px">
+          <template slot-scope="scope">
+            <span v-if="scope.row.troubleType == 1">生产安全事故</span>
+            <span v-if="scope.row.troubleType == 2">非生产安全事故</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="事故地点" align="center" prop="troubleLocation" width="300px"/>
+        <el-table-column label="事故发生时间" align="center" prop="happenDate" width="150px"/>
+        <el-table-column label="是否人员伤亡" align="center" prop="isCasualties" width="150px">
+          <template slot-scope="scope">
+            <span v-if="scope.row.isCasualties == 1">是</span>
+            <span v-if="scope.row.isCasualties == 2">否</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="责任单位" align="center" prop="responsibleUnit" width="180px"/>
+        <el-table-column label="责任人员" align="center" prop="responsiblePeople"/>
+        <el-table-column label="是否处理" align="center" prop="isDeal">
+          <template slot-scope="scope">
+            <span v-if="scope.row.isDeal == 1">已处理</span>
+            <span v-if="scope.row.isDeal == 2">未处理</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" width="120px">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-edit"
+              @click="showDetail(scope.row)"
+              v-hasPermi="['standingBook:trouble:query']"
+            >详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+      <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body @cancel="cancel" @close="cancel">
+        <el-row>
+          <el-col :span="14">
+            <el-form ref="detailForm" :model="detailForm" label-width="120px">
+              <el-row>
+                <el-col :span="10">
+                  <el-form-item label="事故名称:">
+                    <font>{{detailForm.troubleName}}</font>
+                  </el-form-item>
+                  <el-form-item label="事故原因:">
+                    <font>{{detailForm.troubleReason}}</font>
+                  </el-form-item>
+                  <el-form-item label="责任单位:">
+                    <font v-if="detailForm.responsibleUnit != '' && detailForm.responsibleUnit != null">{{detailForm.responsibleUnit}}</font>
+                    <font v-else> - </font>
+                  </el-form-item>
+                  <el-form-item label="是否人员伤亡:">
+                    <font v-if="detailForm.isCasualties == '1'">是</font>
+                    <font v-if="detailForm.isCasualties == '2'">否</font>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="13">
+                  <el-form-item label="事故类型:">
+                    <font v-if="detailForm.troubleType == '1'">安全生产事故</font>
+                    <font v-if="detailForm.troubleType == '2'">非生产安全事故</font>
+                  </el-form-item>
+                  <el-form-item label="事故地点:">
+                    <font>{{detailForm.troubleLocation}}</font>
+                  </el-form-item>
+                  <el-form-item label="责任人员:">
+                    <font v-if="detailForm.responsiblePeople != '' && detailForm.responsiblePeople != null">{{detailForm.responsiblePeople}}</font>
+                    <font v-else> - </font>
+                  </el-form-item>
+                  <el-form-item label="是否处理:">
+                    <font v-if="detailForm.isDeal == '1'">已处理</font>
+                    <font v-if="detailForm.isDeal == '2'">未处理</font>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row v-if="detailForm.isCasualties == '1'">
+                <el-col :span="11">
+                  <el-form-item label="受伤人数:">
+                    <font>{{detailForm.injuryNum}}</font>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                  <el-form-item label="死亡人数:">
+                    <font>{{detailForm.deathNum}}</font>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row>
+                <el-form-item label="处理完成时间:">
+                  <font v-if="detailForm.dealDate != '' && detailForm.dealDate != null">{{detailForm.dealDate}}</font>
+                  <font v-else> - </font>
+                </el-form-item>
+              </el-row>
+              <el-row>
+                <el-form-item label="简要经过:">
+                  <font v-if="detailForm.briefProcess != '' && detailForm.briefProcess != null">{{detailForm.briefProcess}}</font>
+                  <font v-else> - </font>
+                </el-form-item>
+              </el-row>
+              <el-row>
+                <el-form-item label="备注信息:">
+                  <font v-if="detailForm.remarks != '' && detailForm.remarks != null">{{detailForm.remarks}}</font>
+                  <font v-else> - </font>
+                </el-form-item>
+              </el-row>
+            </el-form>
+          </el-col>
+
+          <el-col :span="9">
+            <div style="width: 100%;height: 390px;margin-top: -25px; border: 1px solid rgb(218, 213, 213);margin-bottom: 10px;">
+              <div style="width: 100%;height: 100%" id="troubleContainer"></div>
+            </div>
+          </el-col>
+        </el-row>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { troubleStatistic } from "@/api/statistic/statisticAnalysis";
+  import { listTrouble, getTrouble } from "@/api/standingBook/trouble";
+  import { EditorMap } from "@/utils/mapClass/getPath.js";
+
+  export default {
+    name: "TroubleStatisticAnalysis",
+    components: {
+    },
+    data() {
+      return {
+        // 统计数据
+        troubleObj: {},
+        // 遮罩层
+        loading: true,
+        // 事故台账表格数据
+        troubleList: [],
+        // 总条数
+        total: 0,
+        // 地图
+        map: null,
+        devicePos: [],
+        // 弹出层标题
+        title: "",
+        // 是否显示弹出层
+        open: false,
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+        },
+        // 表单参数
+        detailForm: {},
+      };
+    },
+    created() {
+    },
+    mounted() {
+      this.getStatiData();
+      this.getList();
+    },
+    methods: {
+      getStatiData() {
+        troubleStatistic().then(response => {
+          this.troubleObj = response.data;
+        });
+      },
+      getList() {
+        this.loading = true;
+        listTrouble(this.queryParams).then(response => {
+          this.troubleList = response.rows;
+          this.total = response.total;
+          this.loading = false;
+        });
+      },
+      reset() {
+        this.detailForm = {
+          troubleId: null,
+          troubleName: null,
+          troubleLocation: null,
+          longitude: null,
+          latitude: null,
+          troubleType: null,
+          briefProcess: null,
+          troubleReason: null,
+          isCasualties: null,
+          injuryNum: null,
+          deathNum: null,
+          responsibleUnit: null,
+          responsiblePeople: null,
+          isDeal: null,
+          happenDate: null,
+          dealDate: null,
+          createBy: null,
+          createTime: null,
+          updateBy: null,
+          updateTime: null,
+          isDel: null,
+          remarks: null
+        };
+        this.resetForm("detailForm");
+        this.devicePos = [];
+      },
+      /** 详细信息跳转 */
+      showDetail(row) {
+        this.reset();
+        getTrouble(row.troubleId).then(response => {
+          this.detailForm = response.data;
+          this.devicePos = [this.detailForm.longitude, this.detailForm.latitude];
+          console.log("this.devicePos",this.devicePos);
+          this.open = true;
+          this.title = "燃气事故台账详情";
+
+          this.$nextTick(() => {
+            this.map = new EditorMap("troubleContainer", {}, this);
+            this.map.addDevice({ path: this.devicePos });
+            this.map.nowMouseTarget = null;
+            this.map.mousetoolClose(false);
+          });
+        });
+      },
+      cancel() {
+        this.open = false;
+        this.reset();
+        this.map.destroy();
+      },
+    }
+  };
+</script>
+<style>
+  .first-div{
+    margin-top: 20px;
+    width: 30%;
+    float: left;
+    margin-left: 2.5%;
+    height: 9rem;
+    color: #515a6e;
+    background-color: #FFF;
+    border-radius: 5px;
+    border: 2px solid rgb(22, 151, 207, 0.3);
+    box-shadow:  0 0 8px 8px rgba(131, 229, 255, 0.1)inset, 0 0 7px 7px rgba(22, 151, 207, 0.2);
+  }
+</style>

gassafetyprogress-web/src/views/system/eventInfo/index.vue

@@ -66,28 +66,6 @@
           v-hasPermi="['system:eventInfo:add']"
         >新增</el-button>
       </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['system:eventInfo:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['system:eventInfo:remove']"
-        >删除</el-button>
-      </el-col>
       <el-col :span="1.5">
         <el-button
           type="warning"
@@ -103,7 +81,7 @@
     </el-row>
 
     <el-table v-loading="loading" :data="eventInfoList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
+      <!--<el-table-column type="selection" width="55" align="center" />-->
       <!--<el-table-column label="事件id" align="center" prop="eventId" />-->
       <el-table-column label="事件名称" align="center" prop="eventTitle" />
       <el-table-column label="所属企业" align="center" prop="beyondEnterpriseName" />
@@ -116,9 +94,21 @@
         </template>
       </el-table-column>
       <el-table-column label="报案人" align="center" prop="reportPerson" />
-      <el-table-column label="事件处置信息" align="center" prop="eventDeal" />
-      <el-table-column label="事件评估信息" align="center" prop="eventAssessment" />
-      <el-table-column label="备注" align="center" prop="remarks" />
+      <el-table-column label="附件" align="center" prop="iconUrl" width="150px">
+        <template slot-scope="scope">
+          <span
+            class="dbtn"
+            @click="checkFile(scope.row.iconUrl)"
+            v-if="scope.row.iconUrl != null && scope.row.iconUrl!=''"
+          >
+            <i class="el-icon el-icon-view"></i>查看/下载
+          </span>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
+      <!--<el-table-column label="事件处置信息" align="center" prop="eventDeal" />-->
+      <!--<el-table-column label="事件评估信息" align="center" prop="eventAssessment" />-->
+      <!--<el-table-column label="备注" align="center" prop="remarks" />-->
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -134,7 +124,6 @@
             icon="el-icon-document-copy"
             @click="handleDtail(scope.row)"
           >详情</el-button>
-          <el-button
           <el-button
             size="mini"
             type="text"
@@ -216,10 +205,10 @@
               </el-form-item>
             </div>
           </div>
-          <el-form-item label="事件处置信息" prop="eventDeal" style="width: 60%">
+          <el-form-item label="事件处置信息" prop="eventDeal" style="width: 95%">
             <el-input v-model="form.eventDeal" type="textarea" placeholder="请输入事件处置信息" :disabled="readonly"/>
           </el-form-item>
-          <el-form-item label="事件评估信息" prop="eventAssessment" style="width: 60%">
+          <el-form-item label="事件评估信息" prop="eventAssessment" style="width: 95%">
             <el-input v-model="form.eventAssessment" type="textarea" placeholder="请输入事件评估信息" :disabled="readonly"/>
           </el-form-item>
           <el-form-item label="事件附件" prop="iconUrl" :style="display" >
@@ -234,14 +223,14 @@
             <!--<el-input v-model="form.iconUrl" type="textarea" placeholder="请输入内容" />-->
           </el-form-item>
           <el-form-item label="事件附件" prop="iconUrl" :style="display1">
-            <span
-              class="dbtn"
-              @click="checkFile(form.iconUrl)"
-              v-if="form.iconUrl != ''"
-            >
+              <span
+                class="dbtn"
+                @click="checkFile(form.iconUrl)"
+                v-if="form.iconUrl!=null && form.iconUrl != ''"
+              >
                 <i class="el-icon el-icon-view"></i>查看/下载
               </span>
-            <span v-else>-</span>
+              <span v-else>-</span>
           </el-form-item>
             <!--<el-form-item label="所属企业名称" prop="beyondEnterpriseName">-->
               <!--<el-input v-model="form.beyondEnterpriseName" placeholder="请输入所属企业名称" />-->
@@ -382,7 +371,7 @@ export default {
       let obj = {};
       obj = this.enterpriseList.find((item)=>{
         return item.enterpriseId === value;
-    });
+    ``});
       this.form.beyondEnterpriseName = obj.enterpriseName;
       this.form.beyondEnterpriseId = value;
     },

gassafetyprogress-web/src/views/system/planInfo/index.vue

@@ -57,28 +57,28 @@
           v-hasPermi="['system:planInfo:add']"
         >新增</el-button>
       </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['system:planInfo:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['system:planInfo:remove']"
-        >删除</el-button>
-      </el-col>
+      <!--<el-col :span="1.5">-->
+        <!--<el-button-->
+          <!--type="success"-->
+          <!--plain-->
+          <!--icon="el-icon-edit"-->
+          <!--size="mini"-->
+          <!--:disabled="single"-->
+          <!--@click="handleUpdate"-->
+          <!--v-hasPermi="['system:planInfo:edit']"-->
+        <!--&gt;修改</el-button>-->
+      <!--</el-col>-->
+      <!--<el-col :span="1.5">-->
+        <!--<el-button-->
+          <!--type="danger"-->
+          <!--plain-->
+          <!--icon="el-icon-delete"-->
+          <!--size="mini"-->
+          <!--:disabled="multiple"-->
+          <!--@click="handleDelete"-->
+          <!--v-hasPermi="['system:planInfo:remove']"-->
+        <!--&gt;删除</el-button>-->
+      <!--</el-col>-->
       <el-col :span="1.5">
         <el-button
           type="warning"
@@ -94,7 +94,7 @@
     </el-row>
 
     <el-table v-loading="loading" :data="planInfoList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
+      <!--<el-table-column type="selection" width="25" align="center" />-->
       <!--<el-table-column label="预案id" align="center" prop="planId" />-->
       <el-table-column label="预案标题" align="center" prop="planTitle" />
       <el-table-column label="所属企业名称" align="center" prop="beyondEnterpriseName" />
@@ -102,12 +102,12 @@
       <el-table-column label="预案等级" align="center" prop="planLevel"  :formatter="planLevelFormat"/>
       <!--<el-table-column label="应急方案" align="center" prop="planContents" />-->
       <el-table-column label="应急设备及车辆" align="center" prop="planEquipment" />
-      <el-table-column label="方案附件" align="center" prop="dealPlanUrl" width="150px">
+      <el-table-column label="方案附件" align="center" prop="iconUrl" width="150px">
         <template slot-scope="scope">
           <span
             class="dbtn"
             @click="checkFile(scope.row.iconUrl)"
-            v-if="scope.row.iconUrl != ''"
+            v-if="scope.row.iconUrl != null && scope.row.iconUrl!=''"
           >
             <i class="el-icon el-icon-view"></i>查看/下载
           </span>
@@ -216,7 +216,7 @@
               <span
                 class="dbtn"
                 @click="checkFile(form.iconUrl)"
-                v-if="form.iconUrl != ''"
+                v-if="form.iconUrl!=null && form.iconUrl != ''"
               >
                 <i class="el-icon el-icon-view"></i>查看/下载
               </span>
@@ -346,7 +346,6 @@ export default {
       });
     },
     qiyechang(value){
-      console.log(value)
       let obj = {};
        obj = this.enterpriseList.find((item)=>{
              return item.enterpriseId === value;
@@ -475,11 +474,8 @@ export default {
         this.title = "修改应急预案";
         if(this.form.iconUrl!=null||this.form.iconUrl==""){
           this.fileList = [{name: 'file', url:uploadfile}];
-          this.$nextTick(()=>{
-            document.getElementsByClassName("el-upload--picture-card")[0].style.display="none"
-          document.getElementById("yesbutton").style.display="" ;
-        })
         }
+        document.getElementById("yesbutton").style.display="" ;
         document.getElementById("fujian").style.display=""
         document.getElementById("fujianxia").style.display="none"
       });