Selaa lähdekoodia

全流程管理详细页面开发

DESKTOP-6LTVLN7\Liumouren 2 vuotta sitten
vanhempi
commit
78e0504e1a

BIN
public/static/images/stepsIcon/0.png


BIN
public/static/images/stepsIcon/200.png


BIN
public/static/images/stepsIcon/400.png


BIN
public/static/images/stepsIcon/500.png


+ 6 - 6
public/static/json/home/layout_land.json

@@ -66,17 +66,17 @@
             {
                 "year": 2018,
                 "type": "土地资源面积",
-                "area": 22.64
+                "area": 66.73
             },
             {
                 "year": 2019,
                 "type": "土地资源面积",
-                "area": 22.66
+                "area": 66.74
             },
             {
                 "year": 2020,
                 "type": "土地资源面积",
-                "area": 22.66
+                "area": 66.72
             }
         ]
     },
@@ -147,17 +147,17 @@
             {
                 "year": 2018,
                 "type": "土地资源面积",
-                "area": 15.41
+                "area": 59.25
             },
             {
                 "year": 2019,
                 "type": "土地资源面积",
-                "area": 15.46
+                "area": 59.26
             },
             {
                 "year": 2020,
                 "type": "土地资源面积",
-                "area": 15.46
+                "area": 59.27
             }
         ]
     }

+ 103 - 121
public/static/json/home/layout_water.json

@@ -1,121 +1,103 @@
-[{
-    "name":"北蔡镇",
-    "pid":310115105000,
-    "data":[{
-        "year":2019,
-        "type":"水域面积",
-        "area":150
-    },{
-        "year":2020,
-        "type":"水域面积",
-        "area":160
-    },{
-        "year":2021,
-        "type":"水域面积",
-        "area":170
-    },{
-        "year":2019,
-        "type":"区管河道数量",
-        "area":170
-    },{
-        "year":2020,
-        "type":"区管河道数量",
-        "area":170
-    },{
-        "year":2021,
-        "type":"区管河道数量",
-        "area":170
-    },{
-        "year":2019,
-        "type":"镇管河道数量",
-        "area":170
-    },{
-        "year":2020,
-        "type":"镇管河道数量",
-        "area":170
-    },{
-        "year":2021,
-        "type":"镇管河道数量",
-        "area":170
-    }]
-},{
-    "name":"祝桥镇",
-    "pid":310115105000,
-    "data":[{
-        "year":2019,
-        "type":"水域面积",
-        "area":150
-    },{
-        "year":2020,
-        "type":"水域面积",
-        "area":160
-    },{
-        "year":2021,
-        "type":"水域面积",
-        "area":170
-    },{
-        "year":2019,
-        "type":"区管河道数量",
-        "area":170
-    },{
-        "year":2020,
-        "type":"区管河道数量",
-        "area":170
-    },{
-        "year":2021,
-        "type":"区管河道数量",
-        "area":170
-    },{
-        "year":2019,
-        "type":"镇管河道数量",
-        "area":170
-    },{
-        "year":2020,
-        "type":"镇管河道数量",
-        "area":170
-    },{
-        "year":2021,
-        "type":"镇管河道数量",
-        "area":170
-    }]
-},{
-    "name":"大团镇",
-    "pid":310115105000,
-    "data":[{
-        "year":2019,
-        "type":"水域面积",
-        "area":130
-    },{
-        "year":2020,
-        "type":"水域面积",
-        "area":160
-    },{
-        "year":2021,
-        "type":"水域面积",
-        "area":170
-    },{
-        "year":2019,
-        "type":"区管河道数量",
-        "area":170
-    },{
-        "year":2020,
-        "type":"区管河道数量",
-        "area":160
-    },{
-        "year":2021,
-        "type":"区管河道数量",
-        "area":170
-    },{
-        "year":2019,
-        "type":"镇管河道数量",
-        "area":170
-    },{
-        "year":2020,
-        "type":"镇管河道数量",
-        "area":170
-    },{
-        "year":2021,
-        "type":"镇管河道数量",
-        "area":170
-    }]
-}]
+[
+    {
+        "name": "老港镇",
+        "pid": 310115144000,
+        "data": [
+            {
+                "year": 2017,
+                "type": "水域面积",
+                "area": 6.89
+            },
+            {
+                "year": 2018,
+                "type": "水域面积",
+                "area": 6.89
+            },
+            {
+                "year": 2019,
+                "type": "水域面积",
+                "area": 6.90
+            },
+            {
+                "year": 2017,
+                "type": "区管河道数量",
+                "area": 1.74
+            },
+            {
+                "year": 2018,
+                "type": "区管河道数量",
+                "area": 1.74
+            },
+            {
+                "year": 2019,
+                "type": "区管河道数量",
+                "area": 1.74
+            },
+            {
+                "year": 2017,
+                "type": "镇管河道数量",
+                "area": 1.39
+            },
+            {
+                "year": 2018,
+                "type": "镇管河道数量",
+                "area": 1.40
+            },
+            {
+                "year": 2019,
+                "type": "镇管河道数量",
+                "area": 1.40
+            }
+        ]
+    },{
+        "name": "泥城镇",
+        "pid": 310115140000,
+        "data": [
+            {
+                "year": 2017,
+                "type": "水域面积",
+                "area": 4.34
+            },
+            {
+                "year": 2018,
+                "type": "水域面积",
+                "area": 4.34
+            },
+            {
+                "year": 2019,
+                "type": "水域面积",
+                "area": 4.35
+            },
+            {
+                "year": 2017,
+                "type": "区管河道数量",
+                "area": 1.00
+            },
+            {
+                "year": 2018,
+                "type": "区管河道数量",
+                "area": 1.00
+            },
+            {
+                "year": 2019,
+                "type": "区管河道数量",
+                "area": 1.02
+            },
+            {
+                "year": 2017,
+                "type": "镇管河道数量",
+                "area": 0.83
+            },
+            {
+                "year": 2018,
+                "type": "镇管河道数量",
+                "area": 0.84
+            },
+            {
+                "year": 2019,
+                "type": "镇管河道数量",
+                "area": 0.87
+            }
+        ]
+    }
+]

BIN
public/static/word/实施方案.pdf


BIN
public/static/word/审计意见.pdf


BIN
public/static/word/审计通知书.pdf


+ 21 - 9
src/components/common/BottomForm/SameScreenComparison.vue

@@ -174,10 +174,20 @@ export default {
       this.dialogVisible = true;
       this.$emit("changeShowBottomMenusStatus", false);
       // 打开弹窗前首先同步一下地图定位
-      this.centerZoomInit = {
-        center: map2DViewer.map.getCenter(),
-        zoom: map2DViewer.map.getZoom()
-      };
+      let mapCenter = map2DViewer.map.getCenter();
+      let mapZoom = map2DViewer.map.getZoom();
+      if (mapCenter.lat && mapCenter.lng && mapZoom != undefined) {
+        this.centerZoomInit = {
+          lat: mapCenter.lat,
+          lng: mapCenter.lng,
+          zoom: mapZoom
+        };
+      }
+      console.log("centerZoomInit", this.centerZoomInit);
+      // this.centerZoomInit = {
+      //   center: map2DViewer.map.getCenter(),
+      //   zoom: map2DViewer.map.getZoom()
+      // };
       this.handleCheckedCitiesChange();
     },
     // 弹窗关闭询问
@@ -312,12 +322,14 @@ export default {
     // 修改选中地图
     handleCheckedCitiesChange(e) {
       setTimeout(() => {
+        let mapCenter = map2DViewer.map.getCenter();
+        let mapZoom = map2DViewer.map.getZoom();
         this.checkedCities.forEach((item, index) => {
-          this.$nextTick(() => {
-            if (this.$refs["mapBox"][index]) {
-              this.$refs["mapBox"][index].changeMapSize();
-              this.$refs["mapBox"][index].addSinglePolygon(false);
-            }
+          this.$refs["mapBox"][index].$nextTick(() => {
+            // let center = L.latLng(mapCenter.lat, mapCenter.lng);
+            // this.$refs["mapBox"][index].setView(center, mapZoom);
+            this.$refs["mapBox"][index].changeMapSize();
+            this.$refs["mapBox"][index].addSinglePolygon(false);
           });
         });
       }, 300);

+ 1 - 1
src/components/common/FilePreView.vue

@@ -118,7 +118,7 @@ export default {
 </script>
 <style lang="less" scoped>
 .form {
-  height: 600px;
+  height: 100%;
   overflow: auto;
 }
 .pdf-layout-page {

+ 330 - 40
src/components/common/StepsMyBox.vue

@@ -1,6 +1,37 @@
 <template>
   <!-- 全流程管理组件 -->
   <div class="StepsMyBox">
+    <el-dialog
+      custom-class="myMission"
+      title="详细信息"
+      :append-to-body="true"
+      :modal="true"
+      :visible.sync="dialogVisible"
+      width="600px"
+      height="60%"
+      :before-close="handleClose"
+    >
+      <div>
+        <div class="dialog_title_info">
+          <div>立项年度:2021</div>
+          <div>被审计镇:周浦</div>
+        </div>
+        <div class="dialog_title_info">问题金额(万元):/</div>
+        <div class="dialog_title">按指引应纳分类情况</div>
+        <div v-for="(item, index) in dialogData" :key="index" class="dialog_table">
+          <div>{{ item.title }}</div>
+          <div>{{ item.info }}</div>
+        </div>
+        <div class="dialog_title">审计报告中的问题反映情况</div>
+        <div v-for="(item, index) in dialogData2" :key="index" class="dialog_table">
+          <div>{{ item.title }}</div>
+          <div>{{ item.info }}</div>
+        </div>
+        <div class="dialog_title2">边审边改情况:老港镇对29个案件问题进行了整改</div>
+        <div class="dialog_title2">使用法条:xxxxxx</div>
+        <div class="dialog_title3"><el-button size="mini" type="primary" class="infoBut">查看疑点图斑</el-button></div>
+      </div>
+    </el-dialog>
     <div style="padding: 10px">
       <el-button type="primary" icon="el-icon-arrow-left" @click="backEvent()">返回上级</el-button>
     </div>
@@ -23,21 +54,40 @@
             <div>涉及街镇:</div>
             <div>{{ clickData.c_owning_street_town_str ? clickData.c_owning_street_town_str : "" }}</div>
           </div>
+          <div class="StepsMyBox_main_left_main_info">
+            <div>牵头部门:</div>
+            <div>资环处</div>
+          </div>
+          <div class="StepsMyBox_main_left_main_info">
+            <div>项目组长:</div>
+            <div>谢康</div>
+          </div>
+          <div class="StepsMyBox_main_left_main_info">
+            <div>项目主审:</div>
+            <div>庞杰</div>
+          </div>
           <div class="StepsMyBox_main_left_main_info">
             <div>参与人员:</div>
-            <div>{{ countUser }}个</div>
+            <div>李同</div>
           </div>
           <div class="StepsMyBox_main_left_main_info">
             <div>追踪问题:</div>
-            <div>5个</div>
+            <div>29个</div>
           </div>
         </div>
       </div>
       <!-- 右侧流程明细 -->
       <div class="StepsMyBox_main_right">
         <div>
-          <el-steps :active="stepsIndex" style="margin: 40px 40px 40px 80px">
+          <el-steps :active="stepsIndexNow" style="margin: 40px 40px 40px 80px">
             <el-step v-for="(item, index) in stepsList" :key="index">
+              <template slot="icon">
+                <el-image
+                  style="width: 20px; height: 20px"
+                  :src="'/static/images/stepsIcon/' + item.status + '.png'"
+                  fit="cover"
+                ></el-image>
+              </template>
               <template slot="title">
                 <div
                   class="stepsTitle"
@@ -47,19 +97,36 @@
                   {{ item.title }}
                 </div>
               </template>
+              <template slot="description">
+                <div class="stepsDescription">
+                  {{ item.time ? item.time : "" }}
+                </div>
+              </template>
             </el-step>
           </el-steps>
         </div>
         <div class="stepsInfoBox">
           <!-- 流程明细文字描述 -->
-          <div>{{ stepsList[stepsIndex - 1].info.text }}</div>
+          <div>
+            {{ stepsList[stepsIndex - 1].info.text ? clickData.c_project_name + stepsList[stepsIndex - 1].info.text : "" }}
+          </div>
           <!-- 流程明细文件预览(通知和报告会用到文件预览) -->
-          <FilePreView ref="filePreview" v-show="fileView" />
+          <FilePreView ref="filePreview" v-show="fileView" style="height: calc(100% - 30px)" />
           <!-- 流程明细-实施列表 -->
           <div v-if="stepsList[stepsIndex - 1].info.infos">
-            <div v-for="item in stepsList[stepsIndex - 1].info.infos" :key="item.id" style="padding-bottom: 1rem">
-              <span>{{ item.title }}</span
-              ><el-button size="mini" type="primary" class="infoBut" style="margin-left: 2rem" @click="getInfoById(item.id)"
+            <div v-for="(item, index) in stepsList[stepsIndex - 1].info.infos" :key="item.index" style="padding-bottom: 1rem">
+              <span
+                :style="{ fontWeight: index != 0 ? 'none' : 'bold', paddingLeft: index != 0 ? '1rem' : '0px' }"
+                class="infoTitle"
+                ><div v-if="index != 0" class="infoIcon"></div>
+                {{ item.title }}</span
+              ><el-button
+                v-if="item.id"
+                size="mini"
+                type="primary"
+                class="infoBut"
+                style="margin-left: 2rem"
+                @click="getInfoById(item.id)"
                 >查看详情</el-button
               >
             </div>
@@ -84,7 +151,7 @@
                   size="mini"
                   type="primary"
                   class="infoBut"
-                  @click="getInfoById(stepsList[stepsIndex - 1].info.tableData[index].id)"
+                  @click="getInfoById(stepsList[stepsIndex - 1].info.tableData[index])"
                 >
                   查看详情
                 </el-button>
@@ -109,64 +176,221 @@ export default {
   data() {
     return {
       // 当前或默认选中的步骤条下标加一
-      stepsIndex: 1,
+      stepsIndex: 6,
+      stepsIndexNow: 6,
       // 是否显示在线文档预览
       fileView: false,
+      // 整改中的查看详情弹窗状态
+      dialogVisible: false,
       // 该项目关联任务列表
       tableData: [],
       // 参与人员
       countUser: 0,
+      dialogData: [
+        { title: "类别", info: "生态环境保护政策执行情况审计" },
+        { title: "重点审计事项", info: "环保督察、执法检查、信访投诉反映问题整治情况" },
+        { title: "参考问题定性", info: "发现问题整改不到位,存在长期……" }
+      ],
+      dialogData2: [
+        { title: "类别", info: "生态环境保护政策执行情况审计" },
+        { title: "重点审计事项", info: "环保督察、执法检查、信访投诉反映问题整治情况" },
+        { title: "参考问题定性", info: "发现问题整改不到位,存在长期……" }
+      ],
       // 步骤条列表
       stepsList: [
-        { title: "立项", info: { text: "--" } },
+        { title: "立项", info: { text: "完成立项!" }, status: 200, time: "2022-02-22" },
         {
           title: "通知",
-          info: { text: "2018年张江基本农田审计项目审计通知书.pdf", filePath: "./static/word/test.pdf" }
+          info: { text: "项目审计通知书.pdf", filePath: "./static/word/审计通知书.pdf" },
+          status: 200,
+          time: "2022-08-30"
         },
         {
           title: "方案",
-          info: { text: "2018年张江基本农田审计项目审计通知书.pdf", filePath: "./static/word/test.pdf" }
+          info: { text: "项目实施方案.pdf", filePath: "./static/word/实施方案.pdf" },
+          status: 200,
+          time: "2022-09-07"
         },
         {
           title: "实施",
           info: {
             infos: [
-              { title: "用户A 完成张江镇xxx片区的审计", id: "1" },
-              { title: "用户B 完成张江镇xxx片区的审计", id: "2" },
-              { title: "用户C 完成张江镇xxx片区的审计", id: "3" }
+              { title: "李同 共完成了248处疑点审计" },
+              { title: "2022.09.13 12:00 创建任务" },
+              { title: "2022.09.14 12:00 登录系统" },
+              { title: "2022.09.14 15:23 完成了疑点标记(打开图层:永久基本农田、2020年森林 底图:2022年一季度卫星影像图)" },
+              { title: "2022.09.14 15:24 完成了疑点标记(打开图层:永久基本农田,2020年森林 底图:2021年四季度卫星影像图)" },
+              { title: "2022.09.15 15:24 完成了疑点标记(打开图层:永久基本农田,2020年森林 底图:2021年四季度卫星影像图)" },
+              { title: "2022.09.15 16:00 完成了疑点审计(打开图层:永久基本农田、2018年森林)" },
+              { title: "2022.09.15 16:34 对2022年一季度及2019年四季度卫星影像图进行同屏比对,并打印结果" },
+              { title: "2022.09.15 09:34 对2022年一季度及2019年四季度卫星影像图进行卷帘比对" },
+              { title: "2022.09.16 15:34 发送了标记疑点给用户23452dddy的手机端" },
+              { title: "2022.09.16 08:45 上传了泥潭数据.geojson" }
             ]
-          }
+          },
+          status: 200,
+          time: ""
         },
         {
           title: "报告",
-          // info: { text: "2018年张江基本农田审计项目审计通知书.pdf", filePath: "/upload/20221128/20221128230553I6Nf00TN.docx" }
-          info: { text: "2018年张江基本农田审计项目审计通知书.docx", filePath: "./static/word/test.docx" }
+          info: { text: "项目审计意见.docx", filePath: "./static/word/审计意见.pdf" },
+          status: 200,
+          time: "2022-12-15"
         },
         {
           title: "整改",
           info: {
             tableData: [
               {
-                id: "1",
-                desc: "xxxxx问题",
-                status: "已完成",
-                endTime: "2023-01-12"
+                desc: "基本农田非粮化",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "一般耕地非粮化",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "河长巡河流于形式",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分河道监管不到位",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "个别生态环境督察事项整改机制落实不到位",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分监测不合格地块用作水稻种植等",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分地块抛荒闲置",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "复垦新增耕地地块面积较小,难以耕种",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "复垦新增耕地零碎化,难以耕种",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "复垦地块覆土质量不高",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "个别地块拆除整治不到位",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分地块拆后堆物等,环境效益低",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分已拆除复垦地块荒置",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分重大环保事项集体决策程序履行不到位",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "垃圾中转站选址决策不合理",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "工业节能目标任务未完成",
+                status: "整改中",
+                endTime: "2023-03-15"
               },
               {
-                id: "2",
-                desc: "xxxxx问题",
-                status: "未开始",
-                endTime: "2023-01-12"
+                desc: "个别单位建筑能耗超标",
+                status: "整改中",
+                endTime: "2023-03-15"
               },
               {
-                id: "3",
-                desc: "xxxxx问题",
-                status: "已完成",
-                endTime: "2023-01-12"
+                desc: "机关办公建筑能耗申报不完整",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "违规占用设置堆点",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "垃圾违规堆放、导致多支付处置费用",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "备案堆点监管不到位",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分泥库在基本农田内实施",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分泥库重复列入土地平整项目",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "拆分项目,规避公开招标",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "过程监管缺失,底泥来源及处置去向不明。",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "部分设施农用地备案过期",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "对项目招投标工作监管不到位,个别项目串通投标",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "建设程序管理不到位,部分项目先实施后签合同",
+                status: "整改中",
+                endTime: "2023-03-15"
+              },
+              {
+                desc: "个别地块公益林建后管理养护不到位",
+                status: "整改中",
+                endTime: "2023-03-15"
               }
             ],
             props: { desc: "问题描述", status: "当前状态", endTime: "整改期限", opt: "操作" }
-          }
+          },
+          status: 200,
+          time: "进行中"
         }
       ]
     };
@@ -189,6 +413,7 @@ export default {
             // 获取项目流程数据
             // console.log("全流程管理详情", newValue, oldValue);
           });
+          this.changeStepsIndex(6);
         }
       },
       deep: true,
@@ -198,7 +423,7 @@ export default {
   methods: {
     // 流程管理【实施】节点,根据id查看详情
     getInfoById(id) {
-      console.log("流程管理【实施】节点,根据id查看详情id:", id);
+      this.dialogVisible = true;
     },
     // 返回上级
     backEvent() {
@@ -217,7 +442,9 @@ export default {
         this.$refs.filePreview.showView(this.stepsList[this.stepsIndex - 1].info.filePath);
       }
     },
-
+    handleClose() {
+      this.dialogVisible = false;
+    },
     // 查询事件
     getAllTasks() {
       let params = new FormData();
@@ -284,13 +511,13 @@ export default {
   &_main {
     padding: 10px;
     width: calc(100% - 20px);
-    height: calc(100% - 20px);
+    height: calc(100% - 80px);
     display: flex;
     justify-content: space-between;
     &_left {
       width: calc(25% - 5px);
       height: 100%;
-      background: #00274d !important;
+      background: #001d3c !important;
       &_main {
         margin: 20px 30px;
         display: flex;
@@ -324,25 +551,34 @@ export default {
     &_right {
       width: calc(75% - 5px);
       height: 100%;
-      background: #00274d !important;
+      background: #001d3c !important;
       .stepsTitle {
         margin-top: 10px;
         transform: translate(-30%, 0%);
         width: 2rem;
         cursor: pointer;
         padding: 0px 20px;
-        border: 1px solid #00aaff;
+        // border: 1px solid #00aaff;
         border-radius: 3px;
         color: #ffffff;
         font-weight: bold;
       }
+      .stepsDescription {
+        margin-top: 10px;
+        transform: translateX(-40px);
+        padding: 0px 20px;
+        font-size: 16px;
+        color: #375787;
+        font-weight: bold;
+      }
       .stepsInfoBox {
         width: calc(100% - 80px);
-        height: calc(100% - 200px);
+        height: calc(100% - 220px);
         margin: 40px;
         margin-top: 0px;
         font-size: 18px;
-        font-weight: bold;
+        overflow-y: auto;
+        // font-weight: bold;
         font-family: pingfangSC;
         line-height: 30px;
         color: #ffffff;
@@ -369,4 +605,58 @@ export default {
     }
   }
 }
+
+.infoTitle {
+  position: relative;
+  .infoIcon {
+    position: absolute;
+    left: 2px;
+    top: 10px;
+    width: 7px;
+    height: 7px;
+    border-radius: 50%;
+    background: #fff;
+  }
+}
+.dialog_title {
+  font-size: 20px;
+  font-weight: bold;
+  color: #fff;
+  padding-bottom: 1.5rem;
+  &2 {
+    font-weight: 100;
+    font-size: 18px;
+    color: #fff;
+    padding-top: 1.5rem;
+  }
+  &3 {
+    display: flex;
+    justify-content: center;
+    padding-top: 1.5rem;
+  }
+  &_info {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 18px;
+    font-weight: 400px;
+    color: #dcdfe6;
+    padding: 1rem 0;
+  }
+}
+.dialog_table {
+  display: flex;
+  justify-content: space-between;
+  div {
+    width: 50%;
+    text-align: center;
+    background-color: #ffffff64 !important;
+    margin: 1px;
+    padding: 5px 10px;
+    display: flex;
+    justify-content: center;
+    color: #dcdfe6;
+    border: 1px solid #001d3c00;    
+  }
+}
 </style>

+ 2 - 1
src/components/common/TagTableCard.vue

@@ -161,7 +161,8 @@ export default {
       flex-wrap: nowrap;
       font-family: zhihun181;
       span {
-        font-size: 12px;
+        font-size: 16px;
+        margin: 0 4px;
         font-weight: bold;
         color: #00aaff;
       }

+ 7 - 16
src/components/map/Map.vue

@@ -2,20 +2,13 @@
   <div class="MapViewer" ref="map"></div>
 </template>
 <script>
-import transformCoord from "@/utils/coordinate";
 export default {
   name: "Map",
   data() {
     return {
       map: "",
       layers: "",
-      polygon: [],
-      minZoom: 10,
-      maxZoom: 16,
-      bound: [
-        [30.5, 121],
-        [31.5, 122]
-      ]
+      polygon: []
     };
   },
   mounted() {
@@ -89,12 +82,8 @@ export default {
         minZoom: 0,
         maxZoom: 6,
         attributionControl: false,
-        zoomControl: false,
-        // minZoom: this.minZoom,
-        // maxZoom: this.maxZoom,
-        // preferCanvas: true
-        // maxBounds: new L.LatLngBounds(this.bound[0], this.bound[1]),
-      }).setView(map2DViewer.map.getCenter(), map2DViewer.map.getZoom());
+        zoomControl: false
+      }).setView(L.latLng(31.46921085801776, 121.00402922590389), 6);
 
       //添加默认图层
       var layer = L.esri
@@ -108,6 +97,7 @@ export default {
       this.layers = layer;
     },
     setView: function (coord, zoom) {
+      console.log("setView", coord, zoom);
       let center = L.latLng(coord[0], coord[1]);
       this.map.setView(center, zoom);
     },
@@ -142,8 +132,9 @@ export default {
     },
     centerZoomInit: {
       handler(newValue, oldValue) {
-        if (newValue.center && newValue.zoom) {
-          let center = L.latLng(newValue.center.lat, newValue.center.lng);
+        if (newValue.lat && newValue.lng && newValue.zoom) {
+          console.log("newValue", newValue);
+          let center = L.latLng(newValue.lat, newValue.lng);
           this.map.setView(center, newValue.zoom);
         }
       },

+ 94 - 1
src/views/FrequencyView.vue

@@ -1,5 +1,37 @@
 <template>
   <div class="frenquency-container">
+    
+    <el-dialog
+      custom-class="myMission"
+      title="详细信息"
+      :append-to-body="true"
+      :modal="true"
+      :visible.sync="dialogVisible"
+      width="600px"
+      height="60%"
+      :before-close="handleClose"
+    >
+      <div>
+        <div class="dialog_title_info">
+          <div>立项年度:2021</div>
+          <div>被审计镇:周浦</div>
+        </div>
+        <div class="dialog_title_info">问题金额(万元):/</div>
+        <div class="dialog_title">按指引应纳分类情况</div>
+        <div v-for="(item, index) in dialogData" :key="index" class="dialog_table">
+          <div>{{ item.title }}</div>
+          <div>{{ item.info }}</div>
+        </div>
+        <div class="dialog_title">审计报告中的问题反映情况</div>
+        <div v-for="(item, index) in dialogData2" :key="index" class="dialog_table">
+          <div>{{ item.title }}</div>
+          <div>{{ item.info }}</div>
+        </div>
+        <div class="dialog_title2">边审边改情况:老港镇对29个案件问题进行了整改</div>
+        <div class="dialog_title2">使用法条:xxxxxx</div>
+        <!-- <div class="dialog_title3"><el-button size="mini" type="primary" class="infoBut">查看疑点图斑</el-button></div> -->
+      </div>
+    </el-dialog>
     <div class="frenquency-container-inner">
       <div class="header">
         <div class="header-title">频发问题</div>
@@ -42,7 +74,8 @@
         <div class="reset-btn" @click="resetEvent">重置</div>
       </div>
       <div class="center">
-        <el-table :data="tableData" style="width: 100%" max-height="600">
+        <el-table :data="tableData" style="width: 100%" max-height="600" 
+      @row-click="rowClick">
           <el-table-column type="index" width="70" align="center">
           </el-table-column>
           <el-table-column
@@ -99,6 +132,18 @@ export default {
       tableData: [],
       currentPage: 1,
       currentPageSize: 10,
+      // 整改中的查看详情弹窗状态
+      dialogVisible: false,
+      dialogData: [
+        { title: "类别", info: "生态环境保护政策执行情况审计" },
+        { title: "重点审计事项", info: "环保督察、执法检查、信访投诉反映问题整治情况" },
+        { title: "参考问题定性", info: "发现问题整改不到位,存在长期……" }
+      ],
+      dialogData2: [
+        { title: "类别", info: "生态环境保护政策执行情况审计" },
+        { title: "重点审计事项", info: "环保督察、执法检查、信访投诉反映问题整治情况" },
+        { title: "参考问题定性", info: "发现问题整改不到位,存在长期……" }
+      ],
       paginationData: {
         pageSize: 10,
         pagerCount: 5,
@@ -181,6 +226,12 @@ export default {
       this.getTableData(1);
       console.log("重置");
     },
+    rowClick(){
+      this.dialogVisible = true;
+    },
+    handleClose() {
+      this.dialogVisible = false;
+    },
     // 切换页
     getTableData(val) {
       this.tableData = [];
@@ -363,4 +414,46 @@ export default {
     }
   }
 }
+
+.dialog_title {
+  font-size: 20px;
+  font-weight: bold;
+  color: #fff;
+  padding-bottom: 1.5rem;
+  &2 {
+    font-weight: 100;
+    font-size: 18px;
+    color: #fff;
+    padding-top: 1.5rem;
+  }
+  &3 {
+    display: flex;
+    justify-content: center;
+    padding-top: 1.5rem;
+  }
+  &_info {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 18px;
+    font-weight: 400px;
+    color: #dcdfe6;
+    padding: 1rem 0;
+  }
+}
+.dialog_table {
+  display: flex;
+  justify-content: space-between;
+  div {
+    width: 50%;
+    text-align: center;
+    background-color: #ffffff64 !important;
+    margin: 1px;
+    padding: 5px 10px;
+    display: flex;
+    justify-content: center;
+    color: #dcdfe6;
+    border: 1px solid #001d3c00;    
+  }
+}
 </style>