diff --git a/src/assets/img/shuju/grid/pos-green2.png b/src/assets/img/shuju/grid/pos-green2.png
new file mode 100644
index 000000000..7162005f5
Binary files /dev/null and b/src/assets/img/shuju/grid/pos-green2.png differ
diff --git a/src/assets/img/shuju/grid/pos-red2.png b/src/assets/img/shuju/grid/pos-red2.png
new file mode 100644
index 000000000..1f2faa80d
Binary files /dev/null and b/src/assets/img/shuju/grid/pos-red2.png differ
diff --git a/src/assets/img/shuju/grid/pos-yellow2.png b/src/assets/img/shuju/grid/pos-yellow2.png
new file mode 100644
index 000000000..7050f2604
Binary files /dev/null and b/src/assets/img/shuju/grid/pos-yellow2.png differ
diff --git a/src/js/dai/request.js b/src/js/dai/request.js
index 92fb78314..709895d60 100644
--- a/src/js/dai/request.js
+++ b/src/js/dai/request.js
@@ -4,6 +4,7 @@
 import axios from "axios";
 import curry from "dai-js/tools/curry";
 import { Message } from "element-ui";
+import { clearLoginInfo } from "@/utils";
 
 const request = curry(
   (method, url, data = {}, headers = {}, progress = () => {}) => {
@@ -42,6 +43,7 @@ const request = curry(
           // 10005 token为空  10006登陆超时 10007别处登录
           console.log("登录失效");
           Message.error(res.data.msg);
+          clearLoginInfo();
           return next({
             name: "login",
           });
diff --git a/src/js/dai/request2.js b/src/js/dai/request2.js
index 92fb78314..709895d60 100644
--- a/src/js/dai/request2.js
+++ b/src/js/dai/request2.js
@@ -4,6 +4,7 @@
 import axios from "axios";
 import curry from "dai-js/tools/curry";
 import { Message } from "element-ui";
+import { clearLoginInfo } from "@/utils";
 
 const request = curry(
   (method, url, data = {}, headers = {}, progress = () => {}) => {
@@ -42,6 +43,7 @@ const request = curry(
           // 10005 token为空  10006登陆超时 10007别处登录
           console.log("登录失效");
           Message.error(res.data.msg);
+          clearLoginInfo();
           return next({
             name: "login",
           });
diff --git a/src/mixins/view-module.js b/src/mixins/view-module.js
index 079ac1386..dcfabd2ed 100644
--- a/src/mixins/view-module.js
+++ b/src/mixins/view-module.js
@@ -102,6 +102,14 @@ export default {
       this.page = 1
       this.query()
     },
+    // 新增 / 修改
+    addOrUpdateHandle (id) {
+      this.addOrUpdateVisible = true
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.dataForm.id = id
+        this.$refs.addOrUpdate.init()
+      })
+    },
     // 删除
     deleteHandle (id) {
       if (this.mixinViewModuleOptions.deleteIsBatch && !id && this.dataListSelections.length <= 0) {
diff --git a/src/router/index.js b/src/router/index.js
index ad6160919..9f87613e6 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -94,6 +94,16 @@ export const moduleRoutes = {
         isTab: true,
       },
     },
+    {
+      path: "404",
+      props: true,
+      component: () => import("@/views/modules/404"),
+      name: "main-404",
+      meta: {
+        title: "页面未找到或无权访问",
+        isTab: false,
+      },
+    },
   ],
 };
 
@@ -129,6 +139,16 @@ export const moduleShujuRoutes = {
         isTab: false,
       },
     },
+    {
+      path: "404",
+      props: true,
+      component: () => import("@/views/modules/visual/404"),
+      name: "main-shuju-404",
+      meta: {
+        title: "页面未找到或无权访问",
+        isTab: false,
+      },
+    },
   ],
 };
 
@@ -193,194 +213,8 @@ router.beforeEach((to, from, next) => {
   const customerId = localStorage.getItem("customerId");
   console.log("customerId：", customerId);
 
-  window.SITE_CONFIG["menuShujuList"] = [
-    // {
-    //   url: "/visual/plugin/power/organization",
-    //   name: "动力主轴",
-    //   id: "5feawfwaefwa577",
-    // },
-    {
-      id: "22213213",
-      name: "基础信息",
-      // url: "visual/basicinfo/basicInfoMain",
-      children: [
-        {
-          url: "/visual/basicinfo/basicInfoMain",
-          name: "人房信息统计",
-          id: "5feawfwaefwa5",
-        },
-        {
-          url: "/visual/basicinfo/personCategory/index",
-          name: "人员类别分析",
-          id: "5fwaefwaefawef5",
-        },
-        {
-          url: "/visual/basicinfo/houseStatic/houseStatic",
-          name: "人房概览统计",
-          id: "5fwaefwaefawef6",
-        },
-      ],
-    },
-    {
-      icon: "icon-setting",
-      id: "2",
-      name: "人员图谱",
-      url: "visual/basicinfo/peopleSearch",
-    },
-    {
-      icon: "icon-setting",
-      id: "3",
-      name: "人员预警",
-      url: "visual/warning/index",
-    },
-    {
-      icon: "icon-setting",
-      id: "2221321001",
-      name: "社区党建",
-      // url: "visual/basicinfo/basicInfoMain",
-      children: [
-        {
-          url: "/visual/communityParty/gridParty",
-          name: "网格党建平面图",
-          id: "5feawfwaefwa579",
-        },
-        {
-          url: "/visual/communityParty/party",
-          name: "党员信息统计",
-          id: "5feawfwaefwa578",
-        },
-        {
-          url: "/visual/communityParty/community",
-          name: "联建单位分析",
-          id: "5fwaefwaefawef588",
-        },
-        {
-          url: "/visual/communityParty/elegant",
-          name: "党员风采榜",
-          id: "5fwaefwaefawef589",
-        },
-      ],
-    },
-    {
-      icon: "icon-setting",
-      id: "2221321123",
-      name: "社区服务",
-      // url: "visual/basicinfo/basicInfoMain",
-      children: [
-        {
-          url: "/visual/measure/service",
-          name: "需求服务分析",
-          id: "5feawfwaefwa57",
-        },
-        {
-          url: "/visual/measure/volunteer",
-          name: "志愿服务分析",
-          id: "5fwaefwaefawef58",
-        },
-      ],
-    },
-    {
-      icon: "icon-setting",
-      id: "6",
-      name: "社区治理",
-      children: [
-        {
-          url: "visual/communityGovern/shijianchuli/shijianchulifenxi",
-          name: "事件处理分析",
-          id: "shijianchulifenxi",
-        },
-        // {
-        //   url: "visual/communityGovern/processAnalyze",
-        //   name: "事件处置分析",
-        //   id: "processAnalyze",
-        // },
-        {
-          url: "/visual/communityGovern/shijianfenlei/shijianfenleifenxi",
-          name: "事件分类分析",
-          id: "shijianfenleifenxi",
-        },
-        {
-          url: "/visual/communityGovern/duoyuanfuwu/duoyuanfuwufenxi",
-          name: "多元服务分析",
-          id: "duoyuanfuwufenxi",
-        },
-        // {
-        //   url: "/visual/communityGovern/typeAnalyze",
-        //   name: "事件分类分析",
-        //   id: "typeAnalyze",
-        // },
-        // {
-        //   url: "/visual/communityGovern/resibuzz",
-        //   name: "居民热议分析",
-        //   id: "resibuzz",
-        // },
-        // {
-        //   url: "/visual/communityGovern/distributionAnalyze",
-        //   name: "事件分布分析",
-        //   id: "distributionAnalyze",
-        // },
-      ],
-    },
-
-    {
-      icon: "icon-setting",
-      id: "2221321fefefaewfa123",
-      name: "初心互助",
-      url: "visual/heart/index",
-      children: [],
-    },
-    {
-      icon: "icon-setting",
-      id: "2221321fefefaewfa122223",
-      name: "疫情防控",
-      url: "",
-      children: [],
-    },
-    {
-      icon: "icon-setting",
-      id: "44rq22222q2222",
-      name: "智慧安防",
-      // url: "visual/basicinfo/basicInfoMain",
-      children: [
-        {
-          url: "https://test-rxs-job.elinkservice.cn/haiqin-ai/aisecurity.html#/monitor-panel",
-          // url: "/visual/ai/index",
-          name: "视频监控",
-          id: "5feawfwa111111efwa57",
-        },
-        /*{
-      url: "/visual/ai/renliu",
-      name: "人流数据",
-      id: "5fwaefwae222112fawef58",
-    },
-    {
-      url: "/visual/ai/cheliu",
-      name: "车流数据",
-      id: "erawerwecsxefwaw",
-    },
-    {
-      url: "/visual/ai/shebei",
-      name: "设备数据",
-      id: "zfzffewaf",
-    },
-    {
-      url: "/visual/ai/gongdan",
-      name: "工单数据",
-      id: "fewafwafewaefddd",
-    },*/
-        {
-          // url: "/visual/ai/yujing",
-          url: "https://test-rxs-job.elinkservice.cn/haiqin-ai/aisecurity.html#/data-analysis",
-          name: "预警分析",
-          id: "545345fdsfs",
-        },
-      ],
-    },
-  ];
-  // fnAddDynamicMenuRoutes2(window.SITE_CONFIG["menuShujuList"]);
-
   http
-    .get("/gov/access/menu/nav?tableName=data_menu")
+    .get("gov/access/menu/navDigitalCommunity?tableName=data_menu")
     .then(({ data: res }) => {
       if (res.code == 10005 || res.code == 10006 || res.code == 10007) {
         // 10005 token为空  10006登陆超时 10007别处登录
@@ -406,7 +240,7 @@ router.beforeEach((to, from, next) => {
     });
 
   http
-    .get("/gov/access/menu/nav")
+    .get("gov/access/menu/navDigitalCommunity")
     .then(({ data: res }) => {
       if (res.code == 10005 || res.code == 10006 || res.code == 10007) {
         // 10005 token为空  10006登陆超时 10007别处登录
@@ -519,10 +353,10 @@ function fnAddDynamicMenuRoutes(menuList = [], routes = []) {
       children: routes,
     },
     {
-      path: "*",
-      // redirect: {
-      //   name: "404",
-      // },
+      path: "/main/*",
+      redirect: {
+        path: "/main/404",
+      },
     },
   ]);
   window.SITE_CONFIG["dynamicMenuRoutes"] = routes;
@@ -593,10 +427,10 @@ function fnAddDynamicMenuRoutes2(menuList = [], routes = []) {
       children: routes,
     },
     {
-      path: "*",
-      // redirect: {
-      //   name: "404",
-      // },
+      path: "/main-shuju/*",
+      redirect: {
+        path: "/main-shuju/404",
+      },
     },
   ]);
   window.SITE_CONFIG["dynamicMenuRoutesShuju"] = routes;
diff --git a/src/utils/index.js b/src/utils/index.js
index b2b65d7b2..c129bea9d 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -45,6 +45,7 @@ export function getDictLabel(dictType, dictValue) {
 export function clearLoginInfo() {
   store.commit('resetStore')
   Cookies.remove('token')
+  localStorage.setItem("token", '');
   window.SITE_CONFIG['dynamicMenuRoutesHasAdded'] = false
 }
 
diff --git a/src/views/modules/404.vue b/src/views/modules/404.vue
new file mode 100644
index 000000000..33682a332
--- /dev/null
+++ b/src/views/modules/404.vue
@@ -0,0 +1,16 @@
+<template>
+  <div class="m-404">页面未找到或无权访问</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style lang="scss" scoped>
+.m-404 {
+  margin-top: 200px;
+  font-size: 60px;
+  color: rgba(#000, 0.3);
+  text-align: center;
+}
+</style>
diff --git a/src/views/modules/plugins/change/changewelfare.vue b/src/views/modules/plugins/change/changewelfare.vue
index 921f93f3d..fe4ecbd6e 100644
--- a/src/views/modules/plugins/change/changewelfare.vue
+++ b/src/views/modules/plugins/change/changewelfare.vue
@@ -54,8 +54,11 @@
       </el-form>
       </el-card>
       <el-card class="resi-card-table">
+<!--        <div class="resi-row-btn">-->
+<!--          <el-button type="warning" size="small" class="diy-button&#45;&#45;add" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>-->
+<!--        </div>-->
         <div class="resi-row-btn">
-          <el-button type="warning" size="small" class="diy-button--add" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
+          <el-button type="warning" size="small" class="diy-button--reset" @click="exportHandle()">{{ $t('export') }}</el-button>
         </div>
       <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%">
         <!--<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>-->
@@ -145,7 +148,8 @@ export default {
         getDataListURL: '/epmetuser/changeWelfare/page',
         getDataListIsPage: true,
         deleteURL: '/epmetuser/changeWelfare',
-        deleteIsBatch: true
+        deleteIsBatch: true,
+        exportURL: '/epmetuser/changeWelfare/export'
       },
       dataForm: {
         id: ''
@@ -178,6 +182,34 @@ export default {
         }
     },
     methods: {
+      exportHandle () {
+        const url = this.mixinViewModuleOptions.exportURL
+        this.$http({
+          method: 'GET',
+          url,
+          responseType: 'blob',
+          params: this.dataForm
+        }).then(res => {
+          // this.download(res.data, title + '.xls')
+          if (res.headers["content-disposition"]) {
+            let fileName = window.decodeURI(res.headers["content-disposition"].split(";")[1].split("=")[1])
+            console.log('filename', fileName)
+            let blob = new Blob([res.data], { type: 'application/vnd.ms-excel' })
+            var url = window.URL.createObjectURL(blob)
+            var aLink = document.createElement('a')
+            aLink.style.display = 'none'
+            aLink.href = url
+            aLink.setAttribute('download', fileName)
+            document.body.appendChild(aLink)
+            aLink.click()
+            document.body.removeChild(aLink) //下载完成移除元素
+            window.URL.revokeObjectURL(url) //释放掉blob对象
+          } else this.$message.error('下载失败')
+        }).catch(err => {
+          console.log('err', err)
+          return this.$message.error('网络错误')
+        })
+      },
         resetForm(formName) {
             for(const n in this.dataForm) {
                 this.dataForm[n] = ''
diff --git a/src/views/modules/plugins/visit/visitvisitor-add-or-update.vue b/src/views/modules/plugins/visit/visitvisitor-add-or-update.vue
new file mode 100644
index 000000000..528af1fb9
--- /dev/null
+++ b/src/views/modules/plugins/visit/visitvisitor-add-or-update.vue
@@ -0,0 +1,144 @@
+<template>
+  <el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false">
+    <el-form disabled :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'">
+          <el-form-item label="姓名" prop="name">
+          <el-input v-model="dataForm.name" placeholder="姓名"></el-input>
+      </el-form-item>
+          <el-form-item label="身份证" prop="idCard">
+          <el-input v-model="dataForm.idCard" placeholder="身份证"></el-input>
+      </el-form-item>
+          <el-form-item label="性别" prop="gender">
+              <el-radio-group v-model="dataForm.gender">
+                  <el-radio :label="'0'">{{ $t('user.gender1') }}</el-radio>
+                  <el-radio :label="'1'">{{ $t('user.gender0') }}</el-radio>
+              </el-radio-group>
+      </el-form-item>
+          <el-form-item label="手机号" prop="mobile">
+          <el-input v-model="dataForm.mobile" placeholder="手机号"></el-input>
+      </el-form-item>
+          <el-form-item label="人员类型" prop="type">
+              <el-radio-group v-model="dataForm.gender">
+                  <el-radio :label="'0'">{{ '访客' }}</el-radio>
+                  <el-radio :label="'1'">{{ '租客' }}</el-radio>
+              </el-radio-group>
+      </el-form-item>
+          <el-form-item label="来访事由" prop="visitReason">
+          <el-input type="textarea" v-model="dataForm.visitReason" placeholder="来访事由"></el-input>
+      </el-form-item>
+          <el-form-item label="头像" prop="faceImg">
+              <el-image :src="dataForm.faceImg" @click="imgShow(dataForm.faceImg)" style="width: 100px; height: 100px" />
+      </el-form-item>
+          <el-form-item label="小区" prop="residential">
+          <el-input v-model="dataForm.residential" placeholder="小区"></el-input>
+      </el-form-item>
+          <el-form-item label="楼栋" prop="building">
+          <el-input v-model="dataForm.building" placeholder="楼栋"></el-input>
+      </el-form-item>
+          <el-form-item label="单元" prop="unit">
+          <el-input v-model="dataForm.unit" placeholder="单元"></el-input>
+      </el-form-item>
+          <el-form-item label="房屋" prop="room">
+          <el-input v-model="dataForm.room" placeholder="房屋"></el-input>
+      </el-form-item>
+      </el-form>
+    <template slot="footer">
+      <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
+<!--      <el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button>-->
+    </template>
+      <el-dialog :visible.sync="dialogVisible" :modal="false">
+          <el-image width="100%" :src="dialogImageUrl" alt=""/>
+      </el-dialog>
+  </el-dialog>
+</template>
+
+<script>
+import debounce from 'lodash/debounce'
+export default {
+  data () {
+    return {
+      visible: false,
+      dialogVisible: false,
+      dialogImageUrl: '',
+      dataForm: {
+        id: '',
+        name: '',
+        idCard: '',
+        gender: '',
+        mobile: '',
+        type: '',
+        state: '',
+        reason: '',
+        delFlag: '',
+        revision: '',
+        createdBy: '',
+        createdTime: '',
+        updatedBy: '',
+        updatedTime: '',
+        customerId: '',
+        visitReason: '',
+        faceImg: '',
+        residential: '',
+        building: '',
+        unit: '',
+        room: ''
+      }
+    }
+  },
+  computed: {
+    dataRule () {
+      return {
+      }
+    }
+  },
+  methods: {
+    init () {
+      this.visible = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].resetFields()
+        if (this.dataForm.id) {
+          this.getInfo()
+        }
+      })
+    },
+    // 查看大图
+    imgShow(url){
+      this.dialogImageUrl = url
+      this.dialogVisible = true
+    },
+    // 获取信息
+    getInfo () {
+      this.$http.get(`/pli/power/visitVisitor/${this.dataForm.id}`).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.dataForm = {
+          ...this.dataForm,
+          ...res.data
+        }
+      }).catch(() => {})
+    },
+    // 表单提交
+    dataFormSubmitHandle: debounce(function () {
+      this.$refs['dataForm'].validate((valid) => {
+        if (!valid) {
+          return false
+        }
+        this.$http[!this.dataForm.id ? 'post' : 'put']('/pli/power/visitVisitor/', this.dataForm).then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg)
+          }
+          this.$message({
+            message: this.$t('prompt.success'),
+            type: 'success',
+            duration: 500,
+            onClose: () => {
+              this.visible = false
+              this.$emit('refreshDataList')
+            }
+          })
+        }).catch(() => {})
+      })
+    }, 1000, { 'leading': true, 'trailing': false })
+  }
+}
+</script>
diff --git a/src/views/modules/plugins/visit/visitvisitor.vue b/src/views/modules/plugins/visit/visitvisitor.vue
new file mode 100644
index 000000000..d65d03916
--- /dev/null
+++ b/src/views/modules/plugins/visit/visitvisitor.vue
@@ -0,0 +1,349 @@
+<template>
+  <el-card shadow="never" class="aui-card--fill">
+    <div class="mod-__visitVisitor} resi-container">
+      <el-card ref="searchCard" class="search-card">
+      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+        <el-form-item label="姓名" label-width="100px">
+          <el-input v-model="dataForm.name" placeholder='姓名' clearable></el-input>
+        </el-form-item>
+        <el-form-item label="身份证" label-width="100px">
+          <el-input v-model="dataForm.idCard" placeholder='身份证' clearable></el-input>
+        </el-form-item>
+        <el-form-item label="联系方式" label-width="100px">
+          <el-input v-model="dataForm.mobile" placeholder='联系方式' clearable></el-input>
+        </el-form-item>
+        <br/>
+        <el-form-item label="来访时间" prop="startTime" label-width="100px">
+          <el-date-picker v-model="dataForm.startTime"
+                          type="datetime"
+                          :picker-options="pickerBeginDateBefore"
+                          value-format="yyyy-MM-dd HH:mm:ss"
+                          format="yyyy-MM-dd HH:mm:ss"
+                          placeholder="选择日期时间"
+                          style="width:200px" @change="changeTime">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="至" prop="endTime">
+          <el-date-picker v-model="dataForm.endTime"
+                          type="datetime"
+                          :picker-options="pickerBeginDateAfter"
+                          value-format="yyyy-MM-dd HH:mm:ss"
+                          format="yyyy-MM-dd HH:mm:ss"
+                          placeholder="选择日期时间"
+                          style="width:200px" @change="changeTime">
+          </el-date-picker>
+        </el-form-item>
+        <br/>
+        <el-form-item label="所属小区"
+                      prop="neighborhoodId" label-width="100px">
+          <el-select
+                  v-model.trim="dataForm.neighborhoodId"
+                  placeholder="请选择"
+                  clearable
+                  @change="getBuildingList"
+          >
+            <el-option
+                    v-for="item in neighborhoodArr"
+                    :key="item.id"
+                    :label="item.neighborHoodName"
+                    :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="所属楼栋"
+                      prop="buildingId" label-width="100px">
+          <el-select
+                  v-model.trim="dataForm.buildingId"
+                  placeholder="请选择"
+                  clearable
+                  @change="getUnitList"
+          >
+            <el-option
+                    v-for="item in buildingArr"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="所属单元"
+                      prop="unitId" label-width="100px">
+          <el-select
+                  v-model.trim="dataForm.unitId"
+                  placeholder="请选择"
+                  clearable
+                  @change="getHouseList"
+          >
+            <el-option
+                    v-for="item in unitArr"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="所属房屋"
+                      prop="houseId" label-width="100px">
+          <el-select
+                  v-model.trim="dataForm.houseId"
+                  placeholder="请选择"
+                  clearable
+                  @change="getHouseList"
+          >
+            <el-option
+                    v-for="item in houseArr"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="getDataList()">{{ $t('query') }}</el-button>
+        </el-form-item>
+      </el-form>
+      </el-card>
+      <el-card class="resi-card-table">
+      <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%">
+        <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
+        <el-table-column prop="name" label="姓名" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="idCard" label="身份证" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="gender" label="性别" header-align="center" align="center">
+          <template slot-scope="scope">{{scope.row.gender === '0' ? '女' : scope.row.gender === '1' ? '男' : '未知'}}</template>
+        </el-table-column>
+        <el-table-column prop="mobile" label="手机号" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="type" label="人员类型" header-align="center" align="center">
+          <template slot-scope="scope">{{scope.row.type === '0' ? '访客' : '租客'}}</template>
+        </el-table-column>
+        <el-table-column prop="createdTime" label="来访时间" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="visitReason" show-overflow-tooltip label="来访事由" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="faceImg" label="头像" header-align="center" align="center">
+          <template slot-scope="scope">
+              <el-image :src="scope.row.faceImg" @click="imgShow(scope.row.faceImg)" style="width: 100px; height: 100px" />
+          </template>
+        </el-table-column>
+        <el-table-column prop="residential" label="小区" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="building" label="楼栋" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="unit" label="单元" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="room" label="房屋" header-align="center" align="center"></el-table-column>
+        <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
+          <template slot-scope="scope">
+            <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id, $t('update'))">{{ $t('update') }}</el-button>
+            <el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        :current-page="page"
+        :page-sizes="[10, 20, 50, 100]"
+        :page-size="limit"
+        :total="total"
+        layout="total, sizes, prev, pager, next, jumper"
+        @size-change="pageSizeChangeHandle"
+        @current-change="pageCurrentChangeHandle">
+      </el-pagination>
+      </el-card>
+      <!-- 弹窗, 新增 / 修改 -->
+      <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
+      <el-dialog :visible.sync="dialogVisible" :modal="false">
+        <el-image width="100%" :src="dialogImageUrl" alt=""/>
+      </el-dialog>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import mixinViewModule from '@/mixins/view-module'
+import AddOrUpdate from './visitvisitor-add-or-update'
+export default {
+  mixins: [mixinViewModule],
+  data () {
+    return {
+      mixinViewModuleOptions: {
+        getDataListURL: '/pli/power/visitVisitor/page',
+        getDataListIsPage: true,
+        deleteURL: '/pli/power/visitVisitor',
+        deleteIsBatch: true
+      },
+      dialogVisible: false,
+      dialogImageUrl: '',
+      neighborhoodArr: [],
+      buildingArr: [],
+      unitArr: [],
+      houseArr: [],
+      dataForm: {
+        id: '',
+        agencyId: '1550309684605952002'
+      }
+    }
+  },
+  components: {
+    AddOrUpdate
+  },
+  mounted() {
+    this.getNeighborhoodList()
+  },
+  methods: {
+    addOrUpdateHandle(id, title) {
+      this.dialogTitle = title
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.dataForm.id = id
+        this.$refs.addOrUpdate.init()
+      });
+      this.addOrUpdateVisible = true;
+    },
+    getNeighborhoodList() {
+      this.buildingArr = []
+      this.unitArr = []
+      this.houseArr = []
+      this.$http
+              .post('/gov/org/icneighborhood/open/list', { agencyId: this.dataForm.agencyId})
+              .then(({ data: res }) => {
+                if (res.code !== 0) {
+                  return this.$message.error(res.msg)
+                } else {
+                  console.log('获取查询详情成功', res.data)
+                  this.neighborhoodArr = res.data.list
+                }
+              })
+              .catch(() => {
+                return this.$message.error('网络错误')
+              })
+    },
+    getBuildingList() {
+      this.unitArr = []
+      this.houseArr = []
+      this.$http
+              .post('/gov/org/icbuilding/buildingoption', { neighborHoodId: this.dataForm.neighborhoodIdoodId})
+              .then(({ data: res }) => {
+                if (res.code !== 0) {
+                  return this.$message.error(res.msg)
+                } else {
+                  console.log('获取查询详情成功', res.data)
+                  this.builidingArr = res.data
+                }
+              })
+              .catch(() => {
+                return this.$message.error('网络错误')
+              })
+    },
+    getUnitList() {
+      this.houseArr = []
+      this.$http
+              .post('/gov/org/icbuildingunit/unitoption', { buildingId: this.dataForm.buildingId})
+              .then(({ data: res }) => {
+                if (res.code !== 0) {
+                  return this.$message.error(res.msg)
+                } else {
+                  console.log('获取查询详情成功', res.data)
+                  this.unitArr = res.data
+                }
+              })
+              .catch(() => {
+                return this.$message.error('网络错误')
+              })
+    },
+    getHouseList() {
+      this.$http
+              .post('/gov/org/ichouse/houseoption', { unitId: this.dataForm.unitId})
+              .then(({ data: res }) => {
+                if (res.code !== 0) {
+                  return this.$message.error(res.msg)
+                } else {
+                  console.log('获取查询详情成功', res.data)
+                  this.houseArr = res.data
+                }
+              })
+              .catch(() => {
+                return this.$message.error('网络错误')
+              })
+    },
+    // 查看大图
+    imgShow(url){
+      this.dialogImageUrl = url
+      this.dialogVisible = true
+    },
+    pickerBeginDateBefore: {
+      disabledDate: (time) => {
+        let beginDateVal = this.dataForm.endTime
+        if (beginDateVal) {
+          return time.getTime() > new Date(beginDateVal + ' 00:00:00').getTime()
+        }
+      }
+    },
+    pickerBeginDateAfter: {
+      disabledDate: (time) => {
+        let EndDateVal = this.dataForm.startTime
+        if (EndDateVal) {
+          return time.getTime() < new Date(EndDateVal + ' 00:00:00').getTime()
+        }
+      }
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+  @import "@/assets/scss/buttonstyle.scss";
+
+  .resi-container .resi-card-table {
+    ::v-deep .el-table th {
+      color: #fff;
+      background-color: rgba(33, 149, 254, 1);
+      // border-right: 1px solid rgba(33, 149, 254, 1);
+    }
+  }
+  .resi-table {
+    ::v-deep .el-button--text {
+      text-decoration: underline;
+    }
+    ::v-deep .btn-color-del {
+      margin-left: 10px;
+      color: rgba(213, 16, 16, 1);
+    }
+    ::v-deep .btn-color-edit {
+      color: rgba(0, 167, 169, 1);
+    }
+  }
+  .form-wr {
+    .input-width {
+      width: 260px;
+
+    }
+    .input-width-textarea {
+      width: 500px;
+    }
+    .imsg-list {
+      display: flex;
+      align-items: center;
+      .imgs-item {
+        position: relative;
+        margin-right: 10px;
+        .el-icon-delete {
+          position: absolute;
+          top: 0;
+          right: 0;
+          font-size: 18px;
+          color: red;
+          z-index: 3;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+  .div-content {
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+</style>
+
+<style>
+  .el-table .warning-row {
+    background: #ffe168;
+  }
+</style>
diff --git a/src/views/modules/visual/404.vue b/src/views/modules/visual/404.vue
new file mode 100644
index 000000000..047aec709
--- /dev/null
+++ b/src/views/modules/visual/404.vue
@@ -0,0 +1,16 @@
+<template>
+  <div class="m-404">页面未找到或无权访问</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style lang="scss" scoped>
+.m-404 {
+  margin-top: 200px;
+  font-size: 60px;
+  color: rgba(#fff, 0.6);
+  text-align: center;
+}
+</style>
diff --git a/src/views/modules/visual/basicinfo/basicInfoMain-备份.vue b/src/views/modules/visual/basicinfo/basicInfoMain-备份.vue
new file mode 100644
index 000000000..c57aaef37
--- /dev/null
+++ b/src/views/modules/visual/basicinfo/basicInfoMain-备份.vue
@@ -0,0 +1,1017 @@
+<template>
+  <div style="position: relative">
+
+    <!-- 组织路由 -->
+    <div class="div_top">
+      <div class="router_line"></div>
+      <div class="div_router">
+        <span class="router_parents"
+              v-for="(item,index) in runAgencyArray"
+              @click="handleClickAgency(index)"
+              :key="index">{{item.name}}<span class="arrow">></span></span>
+
+        <span class="router_child">{{orgData.name}}</span>
+      </div>
+    </div>
+
+    <people v-if="orgLevel==='people'"
+            :uid="selUserId"
+            ref="ref_people"></people>
+
+    <div v-show="orgLevel!=='people' "
+         class="div_content">
+
+      <basic-info-community v-show="orgLevel==='neighborHood'"
+                            @toSubAgency="toSubAgency"
+                            ref="ref_community"
+                            @refreshInfoList="refreshInfoList"></basic-info-community>
+
+      <div v-show="orgLevel!=='people'  && orgLevel!=='neighborHood'"
+           class="div_map"
+           id="map"
+           ref="map">
+
+        <div class="m-sidebar">
+          <div class="wrap"
+               :class="[{'wrap-hidden':!showAgencyList}]">
+            <div @click="hideAgencyList"
+                 class="arrow_tip">
+              <img src="@/assets/img/modules/visual/popup.png"
+                   alt />
+            </div>
+
+            <div class="div_agency_list">
+              <div class="agency_main">
+                <el-scrollbar style="height:98%"
+                              wrap-style="overflow-x:hidden">
+
+                  <div v-if="subAgencyArray.length>0"
+                       class="agency_list">
+                    <div v-for="(item,index) in subAgencyArray"
+                         :key="index"
+                         @click="clickAgencyItem(item,index)"
+                         :class="['agency_item',{'agency_item_on':index%2 ==0}]">
+                      <div class="agency_item_name">{{item.name}}</div>
+
+                    </div>
+                  </div>
+                  <div v-else>
+                    <img src="@/assets/img/modules/visual/noData.png"
+                         alt=""
+                         srcset=""
+                         class="no-data-img" />
+                  </div>
+                </el-scrollbar>
+
+              </div>
+            </div>
+          </div>
+        </div>
+
+      </div>
+
+      <div class="div_data">
+        <!-- <div @click="handleSearch"
+             class="div_search">
+          <div class="div_search_left">
+            <i slot="prefix"
+               class="icon">
+              <img src="../../../../assets/img/modules/visual/sousuo.png"
+                   alt />
+            </i>
+            <span>请输入姓名</span>
+          </div>
+
+          <div class="btn">搜索</div>
+
+        </div> -->
+
+        <div class="div_info">
+          <el-scrollbar style="height:98%">
+            <div class="info_tip">
+              <img src="../../../../assets/img/shuju/title-tip.png"
+                   alt />
+              <div class="tip_title">分类列表</div>
+            </div>
+
+            <div class="info_loading"
+                 v-if="infoLoading">
+              <screen-loading>加载中</screen-loading>
+            </div>
+
+            <div v-if="!infoLoading"
+                 class="info_list">
+              <div v-for="(item,index) in listDatashow"
+                   :key="index"
+                   class="item">
+                <div class="list_item">
+                  <div v-for="(colItem,colIndex) in item"
+                       :key="colIndex"
+                       class="list_item_col"
+                       @click="handleTo(colItem)">
+                    <img :src="colItem.dataIcon"
+                         alt />
+                    <div class="item_content">
+                      <div class="item_label">{{colItem.label}}</div>
+                      <div class="item_count">{{colItem.count}}</div>
+                    </div>
+
+                  </div>
+                </div>
+                <div :class="['item_line',{'last_line':index==(listDatashow.length-1)}]"></div>
+              </div>
+
+            </div>
+          </el-scrollbar>
+        </div>
+
+      </div>
+    </div>
+
+  </div>
+
+</template>
+
+<script>
+import 'ol/ol.css'
+import { Map, View } from 'ol'
+import TileLayer from 'ol/layer/Tile.js';
+import XYZ from 'ol/source/XYZ.js';
+import VectorLayer from 'ol/layer/Vector.js';
+import VectorSource from 'ol/source/Vector.js';
+import GeoJSON from 'ol/format/GeoJSON.js';
+import Point from "ol/geom/Point.js";
+import Feature from "ol/Feature.js";
+import Overlay from 'ol/Overlay';
+import { defaults as defaultInteractions, Select, DoubleClickZoom } from 'ol/interaction.js';
+import { getCenter, boundingExtent } from 'ol/extent.js';
+import { Circle as CircleStyle, Icon, Fill, Stroke, Style, Text } from 'ol/style.js';
+
+import nextTick from 'dai-js/tools/nextTick'
+import { mapGetters } from "vuex";
+import { Loading } from 'element-ui'; //引入Loading服务
+import { requestPost } from "@/js/dai/request";
+import BasicInfoCommunity from "./basicInfoCommunity";
+
+import People from "./people";
+import cptCard from "@/views/modules/visual/cpts/card";
+import ScreenLoading from "@/views/modules/visual/cpts/loading";
+
+var centerPointGlobal = [120.664619, 36.504963]
+
+let loading;//加载动画
+
+let map;
+let mapView;
+let gaodeMapLayer;//背景地图图层
+let parentLayer;//上级组织图层
+let parentSource;//上级组织多边形
+let polygonLayer;//变电站标注图层
+let iconLayer; // icon标注图层
+let iconSource; // icon
+let polygonSource;//变电站标注多边形
+let select;//选中标注
+
+let xoffset = 0
+let yoffset = 0
+
+
+//url图标
+
+let iconUrlArray = [
+  'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/a219130b6bc74b0b80b5ddb0fce0892a.png',
+  'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/a775d15e62374350b80e5cdf1912a4eb.png',
+  'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/884efcf6d6b44224a7fda599dd1b14cb.png'
+];
+let textColorArray = [
+  'rgba(236, 69, 4, 0.66)',
+  'rgba(0, 146, 238, 0.75)',
+  'rgba(238, 151, 0, 0.8)'
+];
+let polygonColorArray = [
+  'rgba(210, 2, 2, 0.24)',
+  'rgba(43, 231, 253, 0.25)',
+  'rgba(183, 185, 0, 0.16)'
+];
+//变电站标注的文字样式
+var createTextStyle = function (feature) {
+  return new Text({
+    textAlign: undefined,
+    font: "18px Arial",
+    //fontFamily: "Courier New, monospace",
+    // fontWeight: "bold",
+    text: feature.values_.name,
+    backgroundFill: new Fill({
+      // color: 'rgba(0, 146, 238, 0.75)'
+      color: textColorArray[feature.values_.colorIndex]
+    }),
+    padding: [4, 10, 4, 10],
+    //text: "变电站名称",
+    fill: new Fill({ color: "#ffffff" }),
+    // stroke: new Stroke({ color: "#ffffff", width: 3 }),
+    offsetY: -30,
+    offsetX: -50,
+    overflow: true,
+  });
+};
+
+//上级组织标注样式
+var parentStyleFunction = (function () {
+  return function (feature) {
+    return new Style({
+      // fill: new Fill({
+      //   color: [255, 255, 255, 0.3]
+      // }),
+      stroke: new Stroke({
+        color: [0, 103, 182, 1],
+        width: 2
+      }),
+
+      // text: createTextStyle(feature)
+    });;
+  };
+})()
+
+
+//变电站标注样式
+var polygonStyleFunction = (function () {
+  return function (feature) {
+    return new Style({
+      fill: new Fill({
+        // color: [255, 255, 255, 0.3]
+        color: polygonColorArray[feature.values_.colorIndex]
+      }),
+      stroke: new Stroke({
+        color: polygonColorArray[feature.values_.colorIndex],
+        width: 3
+      }),
+
+      text: createTextStyle(feature)
+    });;
+  };
+})()
+
+const vueGis = {
+  name: 'HomeMap',
+  data () {
+    return {
+      showAgencyList: false,
+      agencyFadeIn: true,
+      centerPoint: [],//中心点位置
+      zoom: 14,//缩放范围：区14
+      minZoom: 1,//最小缩放
+
+      orgData: {},//当前组织对象
+      orgId: '',
+      orgLevel: '',
+
+      subAgencyArray: [],//下拉框数据
+      iconCoordinators: [],
+      currentCoordinate: null,
+      overlay: null,
+
+      //右侧搜索
+      searchName: "",
+
+      //右侧列表
+      infoLoading: true,
+      listData: [],//得到的数据
+      listDatashow: [],//处理成一行两列的数据
+
+      //下钻层级记录
+      runNum: 0,
+      runAgencyArray: [],
+      selUserId: '',
+      center: [],
+      zoom: null,
+      parentPolygon: [],
+
+      centerFlag: 'point',//定义中心点的flag  point点 fit 自适应
+
+    }
+  },
+  async mounted () {
+
+    //加载组织数据
+    await this.loadOrgData()
+
+    //初始化地图
+    this.initMap()
+
+    await nextTick(300)
+    this.addParentLayer()
+    this.loadParentPolygon()
+    //添加标注图层
+    this.addPolygonLayer()
+
+    //添加icontuceng
+    this.addIconLayer()
+
+    //加载当前园区的标注
+    this.loadPolygon(this.subAgencyArray)
+    this.setMapLocation()
+    await this.loadList()
+
+  },
+  methods: {
+    handleTo (item) {
+      this.$router.push({
+        path: `/main-shuju/visual-basicinfo-people-list`,
+        query: {
+          columnName: item.columnName,
+          label: item.label,
+          id: this.orgId,
+          level: this.orgLevel
+        }
+      });
+    },
+    hideAgencyList () {
+      this.showAgencyList = !this.showAgencyList
+      // if (this.showAgencyList) {
+      //   this.agencyFadeIn = false
+      //   setTimeout(() => {
+      //     this.showAgencyList = false
+      //   }, 1000)
+
+      // } else {
+      //   this.agencyFadeIn = true
+      //   this.showAgencyList = true
+      // }
+
+
+    },
+
+    //获取右侧infolist数据
+    async loadList () {
+      this.infoLoading = true
+      const url = "/epmetuser/statsresiwarn/list"
+      // const url = "http://yapi.elinkservice.cn/mock/245/epmetuser/statsresiwarn/list"
+      let params = {
+        id: this.orgId,
+        level: this.orgLevel
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+      this.infoLoading = false
+      if (code === 0) {
+
+        this.listData = data
+        // this.listData = this.listData1
+        this.listDatashow = []
+        let itemArray = []
+        this.listData.forEach((item, index) => {
+          if (!item.dataIcon) {
+            item.dataIcon = require('../../../../assets/img/modules/visual/dibao.png')
+          }
+
+          if (index % 2 === 0) {//偶数
+            itemArray.push(item)
+            if ((index + 1) === this.listData.length) {
+              this.listDatashow.push(itemArray)
+            }
+          } else {
+            itemArray.push(item)
+            this.listDatashow.push(itemArray)
+            itemArray = []
+          }
+
+        });
+
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    //子组件点击房间，刷新右侧list
+    refreshInfoList (selId, type) {
+      this.orgId = selId
+      this.level = ''
+    },
+
+    //点击组织列表数据
+    clickAgencyItem (item, index) {
+
+      let e = {
+        selected: []
+      }
+      let one = {
+        values_: item
+      }
+      e.selected.push(one)
+
+      this.toSubAgency('polygon', e)
+    },
+
+    //下钻到下一级 type点击的类型:polygon 点击多边形（分为点击组织/小区）    people 点击详情
+    async toSubAgency (type, e, searchName) {
+
+      //点击小区neighborHood显示楼栋，点击非小区，进入下一级地图
+      if (type === 'people') {
+        this.runNum++
+        this.runAgencyArray.push(this.orgData)
+        this.orgLevel = 'people'
+        this.selUserId = e
+        this.orgId = ''
+        this.orgData = {
+          id: '',
+          level: 'people',
+          name: '人员档案'
+        }
+        this.searchName = searchName
+
+      } else {
+
+        if (!e) {
+          return false
+        }
+        if (!e.selected[0]) {
+          return false
+        }
+        this.runNum++
+        this.orgData.center = map.getView().getCenter()
+        this.orgData.zoom = map.getView().getZoom()
+        console.log('center', map.getView().getCenter())
+        console.log('zoom', map.getView().getZoom())
+
+        this.runAgencyArray.push(this.orgData)
+
+        this.subAgencyArray.forEach(item => {
+          if (item.id === e.selected[0].values_.id) {
+            this.orgId = item.id
+            this.orgLevel = item.level
+            this.orgData = item
+          }
+        });
+
+        if (this.orgLevel === 'neighborHood') {
+          this.loadList()
+          this.$nextTick(() => {
+            // 小区id，小区名称
+            this.$refs.ref_community.initData(this.orgData.id, this.orgData.name);
+          });
+
+        } else {
+          this.refreshMap(true)
+        }
+
+      }
+
+    },
+
+    //刷新地图
+    async refreshMap (isRefreshView) {
+
+      //加载组织数据
+      await this.loadOrgData()
+
+      //绘制父级组织数据
+      this.loadParentPolygon()
+      //绘制本级组织数据
+      this.loadPolygon(this.subAgencyArray)
+
+      //重置地图中心点
+
+      // if (isRefreshView) {
+      this.setMapLocation()
+
+      // }
+
+      await this.loadList()
+
+    },
+
+    //设置地图定位的中心点和缩放级别
+    setMapLocation () {
+      if (!this.zoom) {
+        this.setZoom(this.orgData.agencyLevel)
+      }
+      this.centerPoint = []
+
+
+      //如果存在中心点（返回时赋值）
+      if (this.center && this.center.length > 0) {
+        this.centerPoint = this.center
+        this.centerFlag = 'point'
+        this.center = []
+
+      } else if (parentLayer.getSource().getFeatures()[0]) {//如果是初次进入，不存在下级组织，用父级组织
+        this.centerFlag = 'flag_parent'
+
+
+      } else if (polygonLayer.getSource().getFeatures()[0]) {//如果是初次进入,存在下级组织
+        this.centerFlag = 'flag_polygon'
+
+      } else if (this.orgData.longitude && this.orgData.latitude) {
+        this.centerPoint.push(this.orgData.longitude)
+        this.centerPoint.push(this.orgData.latitude)
+        this.centerFlag = 'point'
+
+      } else {
+        this.centerPoint = centerPointGlobal
+        this.centerFlag = 'point'
+      }
+      // debugger
+      if (this.centerFlag === 'flag_parent') {
+        let parentFeatures = parentLayer.getSource().getFeatures()[0]
+        let polygon = parentFeatures.getGeometry();
+        map.getView().fit(polygon, map.getSize());
+        this.zoom = map.getView().getZoom() - 1
+
+      } else if (this.centerFlag === 'flag_polygon') {
+        let polygonFeatures = polygonLayer.getSource().getFeatures()[0]
+        let polygon = polygonFeatures.getGeometry();
+        map.getView().fit(polygon, map.getSize());
+        this.zoom = map.getView().getZoom() - 1
+
+      } else {
+        mapView.setCenter(this.centerPoint);
+
+      }
+      mapView.setZoom(this.zoom);
+
+
+
+    },
+
+    //返回所选组织
+    handleClickAgency (index) {
+      //如果是从小区返回，清空一下小区的人员显示列表
+      if (this.orgLevel === 'neighborHood') {
+
+        this.$nextTick(() => {
+          // 小区id，小区名称
+          this.$refs.ref_community.handleCloseAllUser();
+        });
+
+      }
+      const cutNum = this.runAgencyArray.length - index//要减去的长度
+      this.runNum = this.runNum - cutNum
+
+      this.orgData = this.runAgencyArray[index]
+
+      for (let i = 0; i < cutNum; i++) {
+        this.runAgencyArray.pop()
+      }
+
+      this.orgId = this.orgData.id
+      this.orgLevel = this.orgData.level
+      this.center = this.orgData.center
+      this.zoom = this.orgData.zoom
+
+      if (this.orgLevel === 'people') {
+
+      }
+
+      else if (this.orgLevel === 'neighborHood') {//显示小区
+
+      } else {
+
+        this.$nextTick(() => {
+          this.refreshMap(true)
+          this.$forceUpdate()
+        });
+
+      }
+
+    },
+
+    //加载组织数据
+    async loadOrgData () {
+
+      const url = "/gov/org/agency/maporg"
+      let params = {
+        orgId: this.orgId,
+        level: this.orgLevel
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.orgData = data
+        this.orgId = this.orgData.id
+        this.orgLevel = this.orgData.level
+        this.parentPolygon = []
+        this.parentPolygon.push(data)
+        if (data.children && data.children.length > 0) {
+          this.subAgencyArray = data.children
+        } else {
+          this.subAgencyArray = []
+        }
+
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+
+    //加载父级组织多边形
+    loadParentPolygon () {
+      parentSource.clear()//清空变电站标注
+
+      let featureData = []//标注数据
+      if (this.parentPolygon && this.parentPolygon.length > 0) {//判断是否存在下级标注
+        let oneData = {}
+
+        this.parentPolygon.forEach(agencyItem => {
+
+          if (agencyItem.coordinates && agencyItem.coordinates !== '') {//如果有坐标
+            oneData = {
+              type: 'Feature',
+              id: agencyItem.id,
+              properties: {
+                id: agencyItem.id,
+                level: agencyItem.level,
+                name: agencyItem.name
+              },
+              geometry: {
+                type: 'Polygon',
+                coordinates: [],
+              },
+            }
+            let coorArray = agencyItem.coordinates.split(',')//坐标数组
+
+            let itemArray = []//单个点位的[lon,lat]，数组
+            let polygonArray = []//整个多边形的[[lon,lat],[lon,lat],[lon,lat]]数组
+
+            coorArray.forEach((item, index) => {
+
+              if (index % 2 == 0) {//偶
+                item = (parseFloat(item) + parseFloat(xoffset)) + ''
+                itemArray.push(item)
+              } else {//奇
+                item = (parseFloat(item) + parseFloat(yoffset)) + ''
+                itemArray.push(item)
+
+                polygonArray.push(itemArray)
+                itemArray = []
+              }
+
+            });
+            oneData.geometry.coordinates.push(polygonArray)
+            featureData.push(oneData)
+          }
+        });
+      }
+
+      if (featureData && featureData.length > 0) {
+        var geojsonObject = {
+          'type': 'FeatureCollection',
+          'features': featureData
+        };
+        let feature = (new GeoJSON()).readFeatures(geojsonObject)
+        parentSource.addFeatures(feature)
+
+      }
+
+    },
+
+    //加载当前园区的标注
+    loadPolygon (subAgencyArray) {
+      polygonSource.clear()//清空多边形标注
+      iconSource.clear()//清空多边形标注
+
+      let featureData = []//标注数据
+      if (subAgencyArray && subAgencyArray.length > 0) {//判断是否存在下级标注
+        let oneData = {}
+
+        let count = 0
+        for (let i = 0; i < subAgencyArray.length; i++) {
+          const agencyItem = subAgencyArray[i]
+
+
+          if (agencyItem.coordinates && agencyItem.coordinates !== '') {//如果有坐标
+            let urlNum = count % 3
+            count++
+
+            oneData = {
+              type: 'Feature',
+              id: agencyItem.id,
+              properties: {
+                id: agencyItem.id,
+                level: agencyItem.level,
+                name: agencyItem.name,
+                colorIndex: urlNum//颜色随机的索引
+              },
+              geometry: {
+                type: 'Polygon',
+                coordinates: [],
+              },
+            }
+            let coorArray = agencyItem.coordinates.split(',')//坐标数组
+
+            let itemArray = []//单个点位的[lon,lat]，数组
+            let polygonArray = []//整个多边形的[[lon,lat],[lon,lat],[lon,lat]]数组
+
+            coorArray.forEach((item, index) => {
+              // itemArray.push(item)
+              if (index % 2 == 0) {//偶
+                item = (parseFloat(item) + parseFloat(xoffset)) + ''
+                itemArray.push(item)
+
+              } else {//奇
+
+                item = (parseFloat(item) + parseFloat(yoffset)) + ''
+                itemArray.push(item)
+                polygonArray.push(itemArray)
+                itemArray = []
+              }
+
+            });
+            oneData.geometry.coordinates.push(polygonArray)
+            featureData.push(oneData)
+          }
+        }
+      }
+
+      if (featureData && featureData.length > 0) {
+        var geojsonObject = {
+          'type': 'FeatureCollection',
+          'features': featureData
+        };
+        let feature = (new GeoJSON()).readFeatures(geojsonObject)
+        console.log(geojsonObject)
+
+        polygonSource.addFeatures(feature)
+
+        let iconFeatures = [];
+        feature.forEach(oneIcon => {
+          var extent = boundingExtent(oneIcon.getGeometry().getCoordinates()[0]); //获取一个坐标数组的边界，格式为[minx,miny,maxx,maxy]
+          // var center = getCenter(extent);   //获取边界区域的中心位置
+          //添加标注
+          let x = (parseFloat(extent[0]) + parseFloat(extent[2])) / 2
+          let y = (parseFloat(extent[1]) + parseFloat(extent[3])) / 2
+
+          let oneArray = [x, y]
+          this.iconCoordinators.push(oneArray)
+          // debugger
+          //地图icon样式
+          let oneCctv = new Feature({
+            geometry: new Point([x, y]),
+            id: oneIcon.id_,
+            properties: {
+              type: "icon",
+              id: oneIcon.id_
+            }
+          });
+
+          let iconStyle = new Style({
+            image: new Icon({
+              // anchor: [0.5, 0.5],
+              // imgSize: [32, 32],
+              scale: 0.5,
+              // src: "/img/largeScreen/icon_camra.png"
+              // src: "https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/a219130b6bc74b0b80b5ddb0fce0892a.png"
+              src: iconUrlArray[oneIcon.values_.colorIndex]
+            })
+          });
+
+          oneCctv.setStyle(iconStyle);
+          iconFeatures.push(oneCctv);
+
+        });
+
+        iconSource.addFeatures(iconFeatures);
+      }
+
+    },
+
+
+    //根据组织层级设置缩放级别
+    setZoom (agencyLevel) {
+      if (agencyLevel === 'district') {
+        this.zoom = 12
+      } else if (agencyLevel === 'street') {
+        this.zoom = 13
+      } else if (agencyLevel === 'community') {
+        this.zoom = 14
+      } else {
+        this.zoom = 11
+      }
+
+    },
+
+    firstCenterMap () {
+      this.centerPoint = []
+      if (this.orgData.longitude && this.orgData.latitude) {
+        this.centerPoint.push(this.orgData.longitude)
+        this.centerPoint.push(this.orgData.latitude)
+
+      } else {
+        this.centerPoint = centerPointGlobal
+      }
+
+      if (!this.zoom) {
+        this.setZoom(this.orgData.agencyLevel)
+      }
+    },
+
+    initMap () {
+      this.firstCenterMap()
+
+      gaodeMapLayer = new TileLayer({
+        title: "地图",
+        source: new XYZ({
+          //指定url瓦片
+          url: 'http://wprd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}',
+          wrapX: true//x方向平铺，也可以选择false
+        }),
+        zIndex: 20
+      });
+
+      mapView = new View({
+        //中心点坐标
+        center: this.centerPoint,
+        // projection: 'EPSG:3857',
+        projection: 'EPSG:4326',
+        zoom: this.zoom,
+        minZoom: this.minZoom
+      })
+
+      //初始化map和地图底图
+      //创建地图容器
+      map = new Map({
+        layers: [gaodeMapLayer],
+        //加载瓦片图层数据
+        view: mapView,
+        target: 'map'
+        //目标加载到map中
+      })
+
+      map.on('singleclick', function (e) {
+        // console.log(e.coordinate)
+        // console.log(transform(e.coordinate, 'EPSG:3857', 'EPSG:4326'));
+      })
+
+      //去除双击放大效果
+      const dblClickInteraction = map
+        .getInteractions()
+        .getArray()
+        .find(interaction => {
+          return interaction instanceof DoubleClickZoom;
+        });
+      map.removeInteraction(dblClickInteraction);
+
+    },
+    //添加变电站标注图层
+    addParentLayer () {
+      parentSource = new VectorSource({
+        //features: (new GeoJSON()).readFeatures(geojsonObject)
+      });
+
+      parentLayer = new VectorLayer({
+        source: parentSource,
+        style: parentStyleFunction,
+        zIndex: 50
+      });
+
+
+      map.addLayer(parentLayer)
+
+
+    },
+
+    //添加变电站标注图层
+    addPolygonLayer () {
+      polygonSource = new VectorSource({
+        //features: (new GeoJSON()).readFeatures(geojsonObject)
+      });
+
+      polygonLayer = new VectorLayer({
+        source: polygonSource,
+        style: polygonStyleFunction,
+        zIndex: 50
+      });
+
+      //选中多边形后的样式
+      var overlayStyle = (function () {
+
+        return function (feature) {
+          var styles = {};
+          styles['Polygon'] = [
+            new Style({
+              stroke: new Stroke({
+                color: '#ec9000',
+                width: 2
+              })
+            }),
+
+            new Style({
+              fill: new Fill({
+                color: 'rgba(0, 0, 255, 0.1)'
+              })
+            }),
+            new Style({
+              text: createTextStyle(feature)
+            })
+          ];
+          styles['MultiPolygon'] = styles['Polygon'];
+          return styles[feature.getGeometry().getType()];
+        };
+      })();
+
+      select = new Select({
+        style: overlayStyle
+      });
+
+
+      map.addLayer(polygonLayer)
+      map.addInteraction(select);
+
+      select.on('select', e => {
+        this.toSubAgency('polygon', e)
+      });
+
+    },
+
+    addIconLayer () {
+      iconSource = new VectorSource({
+        //features: (new GeoJSON()).readFeatures(geojsonObject)
+      });
+
+      iconLayer = new VectorLayer({
+        source: iconSource,
+        zIndex: 70
+      });
+
+      map.addLayer(iconLayer);
+
+    },
+
+    //取随机数
+    getRndBetween (lowerLimit, upperLimit) {
+      return Math.floor(Math.random() * (upperLimit - lowerLimit + 1)) + lowerLimit;
+    },
+
+    //开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, //是否锁定
+        text: '正在加载……', //加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' //背景颜色
+      });
+
+    },
+
+    //结束加载动画
+    endLoading () {
+      //clearTimeout(timer);
+      if (loading) {
+        loading.close();
+      }
+    },
+  },
+  props: {
+
+    // vueFlag: {
+    //   type: String,
+    //   default: "alarm"
+    // }
+  },
+  computed: {
+
+    mapHeight () {
+
+      return this.clientHeight - 120;
+
+    },
+    // zoom: {
+    //   get () {
+    //     //根据不同屏幕分辨率，控制zoom大小
+    //     if (this.clientHeight < 900) {
+    //       return 2.3
+    //     } else {
+    //       return 2.8
+    //     }
+    //   },
+    //   set (value) {
+    //   }
+    // },
+    ...mapGetters(["clientHeight"])
+
+  },
+  components: { BasicInfoCommunity, People, cptCard, ScreenLoading },
+}
+export default vueGis;
+</script>
+
+<style
+  lang="scss"
+  src="@/assets/scss/modules/visual/basicInfoMain.scss"
+  scoped
+></style>
+
+<style lang="scss" >
+.div_content {
+  .ol-viewport {
+    border-radius: 5px;
+  }
+}
+.ol-overlaycontainer-stopevent {
+  display: none;
+}
+</style>  
+
+<style lang="scss" scoped>
+</style>
\ No newline at end of file
diff --git a/src/views/modules/visual/basicinfo/basicInfoMain.vue b/src/views/modules/visual/basicinfo/basicInfoMain.vue
index c57aaef37..3a0e2ccee 100644
--- a/src/views/modules/visual/basicinfo/basicInfoMain.vue
+++ b/src/views/modules/visual/basicinfo/basicInfoMain.vue
@@ -1,271 +1,171 @@
 <template>
   <div style="position: relative">
-
     <!-- 组织路由 -->
     <div class="div_top">
       <div class="router_line"></div>
       <div class="div_router">
-        <span class="router_parents"
-              v-for="(item,index) in runAgencyArray"
-              @click="handleClickAgency(index)"
-              :key="index">{{item.name}}<span class="arrow">></span></span>
-
-        <span class="router_child">{{orgData.name}}</span>
+        <span
+          class="router_parents"
+          v-for="(item, index) in runAgencyArray"
+          @click="handleClickAgency(index)"
+          :key="index"
+          >{{ item.name }}<span class="arrow">></span></span
+        >
+
+        <span class="router_child">{{ orgData.name }}</span>
       </div>
     </div>
 
-    <people v-if="orgLevel==='people'"
-            :uid="selUserId"
-            ref="ref_people"></people>
-
-    <div v-show="orgLevel!=='people' "
-         class="div_content">
-
-      <basic-info-community v-show="orgLevel==='neighborHood'"
-                            @toSubAgency="toSubAgency"
-                            ref="ref_community"
-                            @refreshInfoList="refreshInfoList"></basic-info-community>
-
-      <div v-show="orgLevel!=='people'  && orgLevel!=='neighborHood'"
-           class="div_map"
-           id="map"
-           ref="map">
-
+    <people
+      v-if="orgLevel === 'people'"
+      :uid="selUserId"
+      ref="ref_people"
+    ></people>
+
+    <div v-show="orgLevel !== 'people'" class="div_content">
+      <basic-info-community
+        v-show="orgLevel === 'neighborHood'"
+        @toSubAgency="toSubAgency"
+        ref="ref_community"
+        @refreshInfoList="refreshInfoList"
+      ></basic-info-community>
+
+      <div
+        v-show="orgLevel !== 'people' && orgLevel !== 'neighborHood'"
+        class="div_map"
+      >
+        <grid-map
+          v-if="orgData.id"
+          @clickAgency="clickAgencyItem"
+          :srcGridData="orgData"
+        />
         <div class="m-sidebar">
-          <div class="wrap"
-               :class="[{'wrap-hidden':!showAgencyList}]">
-            <div @click="hideAgencyList"
-                 class="arrow_tip">
-              <img src="@/assets/img/modules/visual/popup.png"
-                   alt />
+          <div class="wrap" :class="[{ 'wrap-hidden': !showAgencyList }]">
+            <div @click="hideAgencyList" class="arrow_tip">
+              <img src="@/assets/img/modules/visual/popup.png" alt />
             </div>
 
             <div class="div_agency_list">
               <div class="agency_main">
-                <el-scrollbar style="height:98%"
-                              wrap-style="overflow-x:hidden">
-
-                  <div v-if="subAgencyArray.length>0"
-                       class="agency_list">
-                    <div v-for="(item,index) in subAgencyArray"
-                         :key="index"
-                         @click="clickAgencyItem(item,index)"
-                         :class="['agency_item',{'agency_item_on':index%2 ==0}]">
-                      <div class="agency_item_name">{{item.name}}</div>
-
+                <el-scrollbar
+                  style="height: 98%"
+                  wrap-style="overflow-x:hidden"
+                >
+                  <div v-if="subAgencyArray.length > 0" class="agency_list">
+                    <div
+                      v-for="(item, index) in subAgencyArray"
+                      :key="index"
+                      @click="clickAgencyItem(item, index)"
+                      :class="[
+                        'agency_item',
+                        { agency_item_on: index % 2 == 0 },
+                      ]"
+                    >
+                      <div class="agency_item_name">{{ item.name }}</div>
                     </div>
                   </div>
                   <div v-else>
-                    <img src="@/assets/img/modules/visual/noData.png"
-                         alt=""
-                         srcset=""
-                         class="no-data-img" />
+                    <img
+                      src="@/assets/img/modules/visual/noData.png"
+                      alt=""
+                      srcset=""
+                      class="no-data-img"
+                    />
                   </div>
                 </el-scrollbar>
-
               </div>
             </div>
           </div>
         </div>
-
       </div>
 
       <div class="div_data">
-        <!-- <div @click="handleSearch"
-             class="div_search">
-          <div class="div_search_left">
-            <i slot="prefix"
-               class="icon">
-              <img src="../../../../assets/img/modules/visual/sousuo.png"
-                   alt />
-            </i>
-            <span>请输入姓名</span>
-          </div>
-
-          <div class="btn">搜索</div>
-
-        </div> -->
-
         <div class="div_info">
-          <el-scrollbar style="height:98%">
+          <el-scrollbar style="height: 98%">
             <div class="info_tip">
-              <img src="../../../../assets/img/shuju/title-tip.png"
-                   alt />
+              <img src="../../../../assets/img/shuju/title-tip.png" alt />
               <div class="tip_title">分类列表</div>
             </div>
 
-            <div class="info_loading"
-                 v-if="infoLoading">
+            <div class="info_loading" v-if="infoLoading">
               <screen-loading>加载中</screen-loading>
             </div>
 
-            <div v-if="!infoLoading"
-                 class="info_list">
-              <div v-for="(item,index) in listDatashow"
-                   :key="index"
-                   class="item">
+            <div v-if="!infoLoading" class="info_list">
+              <div
+                v-for="(item, index) in listDatashow"
+                :key="index"
+                class="item"
+              >
                 <div class="list_item">
-                  <div v-for="(colItem,colIndex) in item"
-                       :key="colIndex"
-                       class="list_item_col"
-                       @click="handleTo(colItem)">
-                    <img :src="colItem.dataIcon"
-                         alt />
+                  <div
+                    v-for="(colItem, colIndex) in item"
+                    :key="colIndex"
+                    class="list_item_col"
+                    @click="handleTo(colItem)"
+                  >
+                    <img :src="colItem.dataIcon" alt />
                     <div class="item_content">
-                      <div class="item_label">{{colItem.label}}</div>
-                      <div class="item_count">{{colItem.count}}</div>
+                      <div class="item_label">{{ colItem.label }}</div>
+                      <div class="item_count">{{ colItem.count }}</div>
                     </div>
-
                   </div>
                 </div>
-                <div :class="['item_line',{'last_line':index==(listDatashow.length-1)}]"></div>
+                <div
+                  :class="[
+                    'item_line',
+                    { last_line: index == listDatashow.length - 1 },
+                  ]"
+                ></div>
               </div>
-
             </div>
           </el-scrollbar>
         </div>
-
       </div>
     </div>
-
   </div>
-
 </template>
 
 <script>
-import 'ol/ol.css'
-import { Map, View } from 'ol'
-import TileLayer from 'ol/layer/Tile.js';
-import XYZ from 'ol/source/XYZ.js';
-import VectorLayer from 'ol/layer/Vector.js';
-import VectorSource from 'ol/source/Vector.js';
-import GeoJSON from 'ol/format/GeoJSON.js';
-import Point from "ol/geom/Point.js";
-import Feature from "ol/Feature.js";
-import Overlay from 'ol/Overlay';
-import { defaults as defaultInteractions, Select, DoubleClickZoom } from 'ol/interaction.js';
-import { getCenter, boundingExtent } from 'ol/extent.js';
-import { Circle as CircleStyle, Icon, Fill, Stroke, Style, Text } from 'ol/style.js';
-
-import nextTick from 'dai-js/tools/nextTick'
+import nextTick from "dai-js/tools/nextTick";
 import { mapGetters } from "vuex";
-import { Loading } from 'element-ui'; //引入Loading服务
+import { Loading } from "element-ui"; //引入Loading服务
 import { requestPost } from "@/js/dai/request";
 import BasicInfoCommunity from "./basicInfoCommunity";
 
 import People from "./people";
 import cptCard from "@/views/modules/visual/cpts/card";
+import gridMap from "@/views/modules/visual/basicinfo/cpts/grid-map";
 import ScreenLoading from "@/views/modules/visual/cpts/loading";
 
-var centerPointGlobal = [120.664619, 36.504963]
-
-let loading;//加载动画
-
-let map;
-let mapView;
-let gaodeMapLayer;//背景地图图层
-let parentLayer;//上级组织图层
-let parentSource;//上级组织多边形
-let polygonLayer;//变电站标注图层
-let iconLayer; // icon标注图层
-let iconSource; // icon
-let polygonSource;//变电站标注多边形
-let select;//选中标注
-
-let xoffset = 0
-let yoffset = 0
-
-
-//url图标
-
-let iconUrlArray = [
-  'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/a219130b6bc74b0b80b5ddb0fce0892a.png',
-  'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/a775d15e62374350b80e5cdf1912a4eb.png',
-  'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/884efcf6d6b44224a7fda599dd1b14cb.png'
-];
-let textColorArray = [
-  'rgba(236, 69, 4, 0.66)',
-  'rgba(0, 146, 238, 0.75)',
-  'rgba(238, 151, 0, 0.8)'
-];
-let polygonColorArray = [
-  'rgba(210, 2, 2, 0.24)',
-  'rgba(43, 231, 253, 0.25)',
-  'rgba(183, 185, 0, 0.16)'
-];
-//变电站标注的文字样式
-var createTextStyle = function (feature) {
-  return new Text({
-    textAlign: undefined,
-    font: "18px Arial",
-    //fontFamily: "Courier New, monospace",
-    // fontWeight: "bold",
-    text: feature.values_.name,
-    backgroundFill: new Fill({
-      // color: 'rgba(0, 146, 238, 0.75)'
-      color: textColorArray[feature.values_.colorIndex]
-    }),
-    padding: [4, 10, 4, 10],
-    //text: "变电站名称",
-    fill: new Fill({ color: "#ffffff" }),
-    // stroke: new Stroke({ color: "#ffffff", width: 3 }),
-    offsetY: -30,
-    offsetX: -50,
-    overflow: true,
-  });
-};
+let loading; //加载动画
+
+export default {
+  name: "HomeMap",
+
+  components: { BasicInfoCommunity, People, cptCard, ScreenLoading, gridMap },
+
+  props: {
+    // vueFlag: {
+    //   type: String,
+    //   default: "alarm"
+    // }
+  },
 
-//上级组织标注样式
-var parentStyleFunction = (function () {
-  return function (feature) {
-    return new Style({
-      // fill: new Fill({
-      //   color: [255, 255, 255, 0.3]
-      // }),
-      stroke: new Stroke({
-        color: [0, 103, 182, 1],
-        width: 2
-      }),
-
-      // text: createTextStyle(feature)
-    });;
-  };
-})()
-
-
-//变电站标注样式
-var polygonStyleFunction = (function () {
-  return function (feature) {
-    return new Style({
-      fill: new Fill({
-        // color: [255, 255, 255, 0.3]
-        color: polygonColorArray[feature.values_.colorIndex]
-      }),
-      stroke: new Stroke({
-        color: polygonColorArray[feature.values_.colorIndex],
-        width: 3
-      }),
-
-      text: createTextStyle(feature)
-    });;
-  };
-})()
-
-const vueGis = {
-  name: 'HomeMap',
-  data () {
+  computed: {
+    ...mapGetters(["clientHeight"]),
+  },
+
+  data() {
     return {
       showAgencyList: false,
       agencyFadeIn: true,
-      centerPoint: [],//中心点位置
-      zoom: 14,//缩放范围：区14
-      minZoom: 1,//最小缩放
 
-      orgData: {},//当前组织对象
-      orgId: '',
-      orgLevel: '',
+      orgData: {}, //当前组织对象
+      orgId: "",
+      orgLevel: "",
 
-      subAgencyArray: [],//下拉框数据
+      subAgencyArray: [], //下拉框数据
       iconCoordinators: [],
       currentCoordinate: null,
       overlay: null,
@@ -275,725 +175,232 @@ const vueGis = {
 
       //右侧列表
       infoLoading: true,
-      listData: [],//得到的数据
-      listDatashow: [],//处理成一行两列的数据
+      listData: [], //得到的数据
+      listDatashow: [], //处理成一行两列的数据
 
       //下钻层级记录
       runNum: 0,
       runAgencyArray: [],
-      selUserId: '',
+      selUserId: "",
       center: [],
       zoom: null,
       parentPolygon: [],
 
-      centerFlag: 'point',//定义中心点的flag  point点 fit 自适应
-
-    }
+      centerFlag: "point", //定义中心点的flag  point点 fit 自适应
+    };
   },
-  async mounted () {
 
+  async mounted() {
     //加载组织数据
-    await this.loadOrgData()
-
-    //初始化地图
-    this.initMap()
-
-    await nextTick(300)
-    this.addParentLayer()
-    this.loadParentPolygon()
-    //添加标注图层
-    this.addPolygonLayer()
-
-    //添加icontuceng
-    this.addIconLayer()
-
-    //加载当前园区的标注
-    this.loadPolygon(this.subAgencyArray)
-    this.setMapLocation()
-    await this.loadList()
-
+    await this.loadOrgData();
+    await this.loadList();
   },
+
   methods: {
-    handleTo (item) {
+    handleTo(item) {
       this.$router.push({
         path: `/main-shuju/visual-basicinfo-people-list`,
         query: {
           columnName: item.columnName,
           label: item.label,
           id: this.orgId,
-          level: this.orgLevel
-        }
+          level: this.orgLevel,
+        },
       });
     },
-    hideAgencyList () {
-      this.showAgencyList = !this.showAgencyList
-      // if (this.showAgencyList) {
-      //   this.agencyFadeIn = false
-      //   setTimeout(() => {
-      //     this.showAgencyList = false
-      //   }, 1000)
+    hideAgencyList() {
+      this.showAgencyList = !this.showAgencyList;
+    },
 
-      // } else {
-      //   this.agencyFadeIn = true
-      //   this.showAgencyList = true
-      // }
+    //加载组织数据
+    async loadOrgData() {
+      const url = "/gov/org/agency/maporg";
+      let params = {
+        orgId: this.orgId,
+        level: this.orgLevel,
+      };
 
+      const { data, code, msg } = await requestPost(url, params);
 
+      if (code === 0) {
+        this.orgData = data;
+        this.orgId = this.orgData.id;
+        this.orgLevel = this.orgData.level;
+        if (data.children && data.children.length > 0) {
+          this.subAgencyArray = data.children;
+        } else {
+          this.subAgencyArray = [];
+        }
+      } else {
+        this.$message.error(msg);
+      }
     },
 
     //获取右侧infolist数据
-    async loadList () {
-      this.infoLoading = true
-      const url = "/epmetuser/statsresiwarn/list"
+    async loadList() {
+      this.infoLoading = true;
+      const url = "/epmetuser/statsresiwarn/list";
       // const url = "http://yapi.elinkservice.cn/mock/245/epmetuser/statsresiwarn/list"
       let params = {
         id: this.orgId,
-        level: this.orgLevel
-      }
+        level: this.orgLevel,
+      };
 
-      const { data, code, msg } = await requestPost(url, params)
-      this.infoLoading = false
+      const { data, code, msg } = await requestPost(url, params);
+      this.infoLoading = false;
       if (code === 0) {
-
-        this.listData = data
+        this.listData = data;
         // this.listData = this.listData1
-        this.listDatashow = []
-        let itemArray = []
+        this.listDatashow = [];
+        let itemArray = [];
         this.listData.forEach((item, index) => {
           if (!item.dataIcon) {
-            item.dataIcon = require('../../../../assets/img/modules/visual/dibao.png')
+            item.dataIcon = require("../../../../assets/img/modules/visual/dibao.png");
           }
 
-          if (index % 2 === 0) {//偶数
-            itemArray.push(item)
-            if ((index + 1) === this.listData.length) {
-              this.listDatashow.push(itemArray)
+          if (index % 2 === 0) {
+            //偶数
+            itemArray.push(item);
+            if (index + 1 === this.listData.length) {
+              this.listDatashow.push(itemArray);
             }
           } else {
-            itemArray.push(item)
-            this.listDatashow.push(itemArray)
-            itemArray = []
+            itemArray.push(item);
+            this.listDatashow.push(itemArray);
+            itemArray = [];
           }
-
         });
-
-
       } else {
-        this.$message.error(msg)
+        this.$message.error(msg);
       }
     },
 
     //子组件点击房间，刷新右侧list
-    refreshInfoList (selId, type) {
-      this.orgId = selId
-      this.level = ''
-    },
-
-    //点击组织列表数据
-    clickAgencyItem (item, index) {
-
-      let e = {
-        selected: []
-      }
-      let one = {
-        values_: item
-      }
-      e.selected.push(one)
-
-      this.toSubAgency('polygon', e)
-    },
-
-    //下钻到下一级 type点击的类型:polygon 点击多边形（分为点击组织/小区）    people 点击详情
-    async toSubAgency (type, e, searchName) {
-
-      //点击小区neighborHood显示楼栋，点击非小区，进入下一级地图
-      if (type === 'people') {
-        this.runNum++
-        this.runAgencyArray.push(this.orgData)
-        this.orgLevel = 'people'
-        this.selUserId = e
-        this.orgId = ''
-        this.orgData = {
-          id: '',
-          level: 'people',
-          name: '人员档案'
-        }
-        this.searchName = searchName
-
-      } else {
-
-        if (!e) {
-          return false
-        }
-        if (!e.selected[0]) {
-          return false
-        }
-        this.runNum++
-        this.orgData.center = map.getView().getCenter()
-        this.orgData.zoom = map.getView().getZoom()
-        console.log('center', map.getView().getCenter())
-        console.log('zoom', map.getView().getZoom())
-
-        this.runAgencyArray.push(this.orgData)
-
-        this.subAgencyArray.forEach(item => {
-          if (item.id === e.selected[0].values_.id) {
-            this.orgId = item.id
-            this.orgLevel = item.level
-            this.orgData = item
-          }
-        });
-
-        if (this.orgLevel === 'neighborHood') {
-          this.loadList()
-          this.$nextTick(() => {
-            // 小区id，小区名称
-            this.$refs.ref_community.initData(this.orgData.id, this.orgData.name);
-          });
-
-        } else {
-          this.refreshMap(true)
-        }
-
-      }
-
-    },
-
-    //刷新地图
-    async refreshMap (isRefreshView) {
-
-      //加载组织数据
-      await this.loadOrgData()
-
-      //绘制父级组织数据
-      this.loadParentPolygon()
-      //绘制本级组织数据
-      this.loadPolygon(this.subAgencyArray)
-
-      //重置地图中心点
-
-      // if (isRefreshView) {
-      this.setMapLocation()
-
-      // }
-
-      await this.loadList()
-
-    },
-
-    //设置地图定位的中心点和缩放级别
-    setMapLocation () {
-      if (!this.zoom) {
-        this.setZoom(this.orgData.agencyLevel)
-      }
-      this.centerPoint = []
-
-
-      //如果存在中心点（返回时赋值）
-      if (this.center && this.center.length > 0) {
-        this.centerPoint = this.center
-        this.centerFlag = 'point'
-        this.center = []
-
-      } else if (parentLayer.getSource().getFeatures()[0]) {//如果是初次进入，不存在下级组织，用父级组织
-        this.centerFlag = 'flag_parent'
-
-
-      } else if (polygonLayer.getSource().getFeatures()[0]) {//如果是初次进入,存在下级组织
-        this.centerFlag = 'flag_polygon'
-
-      } else if (this.orgData.longitude && this.orgData.latitude) {
-        this.centerPoint.push(this.orgData.longitude)
-        this.centerPoint.push(this.orgData.latitude)
-        this.centerFlag = 'point'
-
-      } else {
-        this.centerPoint = centerPointGlobal
-        this.centerFlag = 'point'
-      }
-      // debugger
-      if (this.centerFlag === 'flag_parent') {
-        let parentFeatures = parentLayer.getSource().getFeatures()[0]
-        let polygon = parentFeatures.getGeometry();
-        map.getView().fit(polygon, map.getSize());
-        this.zoom = map.getView().getZoom() - 1
-
-      } else if (this.centerFlag === 'flag_polygon') {
-        let polygonFeatures = polygonLayer.getSource().getFeatures()[0]
-        let polygon = polygonFeatures.getGeometry();
-        map.getView().fit(polygon, map.getSize());
-        this.zoom = map.getView().getZoom() - 1
-
-      } else {
-        mapView.setCenter(this.centerPoint);
-
-      }
-      mapView.setZoom(this.zoom);
-
-
-
+    refreshInfoList(selId, type) {
+      this.orgId = selId;
+      this.level = "";
     },
 
     //返回所选组织
-    handleClickAgency (index) {
+    handleClickAgency(index) {
       //如果是从小区返回，清空一下小区的人员显示列表
-      if (this.orgLevel === 'neighborHood') {
-
+      if (this.orgLevel === "neighborHood") {
         this.$nextTick(() => {
           // 小区id，小区名称
           this.$refs.ref_community.handleCloseAllUser();
         });
-
       }
-      const cutNum = this.runAgencyArray.length - index//要减去的长度
-      this.runNum = this.runNum - cutNum
+      const cutNum = this.runAgencyArray.length - index; //要减去的长度
+      this.runNum = this.runNum - cutNum;
 
-      this.orgData = this.runAgencyArray[index]
+      this.orgData = this.runAgencyArray[index];
 
       for (let i = 0; i < cutNum; i++) {
-        this.runAgencyArray.pop()
-      }
-
-      this.orgId = this.orgData.id
-      this.orgLevel = this.orgData.level
-      this.center = this.orgData.center
-      this.zoom = this.orgData.zoom
-
-      if (this.orgLevel === 'people') {
-
+        this.runAgencyArray.pop();
       }
 
-      else if (this.orgLevel === 'neighborHood') {//显示小区
+      this.orgId = this.orgData.id;
+      this.orgLevel = this.orgData.level;
 
+      if (this.orgLevel === "people") {
+      } else if (this.orgLevel === "neighborHood") {
+        //显示小区
       } else {
-
         this.$nextTick(() => {
-          this.refreshMap(true)
-          this.$forceUpdate()
+          this.refreshMap(true);
+          this.$forceUpdate();
         });
-
       }
-
     },
 
-    //加载组织数据
-    async loadOrgData () {
-
-      const url = "/gov/org/agency/maporg"
-      let params = {
-        orgId: this.orgId,
-        level: this.orgLevel
-      }
-
-      const { data, code, msg } = await requestPost(url, params)
-
-      if (code === 0) {
-
-        this.orgData = data
-        this.orgId = this.orgData.id
-        this.orgLevel = this.orgData.level
-        this.parentPolygon = []
-        this.parentPolygon.push(data)
-        if (data.children && data.children.length > 0) {
-          this.subAgencyArray = data.children
-        } else {
-          this.subAgencyArray = []
-        }
-
-      } else {
-        this.$message.error(msg)
-      }
+    //点击组织列表数据
+    clickAgencyItem(item, index) {
+      let e = {
+        selected: [],
+      };
+      let one = {
+        values_: item,
+      };
+      e.selected.push(one);
 
+      this.toSubAgency("polygon", e);
     },
 
-    //加载父级组织多边形
-    loadParentPolygon () {
-      parentSource.clear()//清空变电站标注
-
-      let featureData = []//标注数据
-      if (this.parentPolygon && this.parentPolygon.length > 0) {//判断是否存在下级标注
-        let oneData = {}
-
-        this.parentPolygon.forEach(agencyItem => {
-
-          if (agencyItem.coordinates && agencyItem.coordinates !== '') {//如果有坐标
-            oneData = {
-              type: 'Feature',
-              id: agencyItem.id,
-              properties: {
-                id: agencyItem.id,
-                level: agencyItem.level,
-                name: agencyItem.name
-              },
-              geometry: {
-                type: 'Polygon',
-                coordinates: [],
-              },
-            }
-            let coorArray = agencyItem.coordinates.split(',')//坐标数组
-
-            let itemArray = []//单个点位的[lon,lat]，数组
-            let polygonArray = []//整个多边形的[[lon,lat],[lon,lat],[lon,lat]]数组
-
-            coorArray.forEach((item, index) => {
-
-              if (index % 2 == 0) {//偶
-                item = (parseFloat(item) + parseFloat(xoffset)) + ''
-                itemArray.push(item)
-              } else {//奇
-                item = (parseFloat(item) + parseFloat(yoffset)) + ''
-                itemArray.push(item)
-
-                polygonArray.push(itemArray)
-                itemArray = []
-              }
-
-            });
-            oneData.geometry.coordinates.push(polygonArray)
-            featureData.push(oneData)
-          }
-        });
-      }
-
-      if (featureData && featureData.length > 0) {
-        var geojsonObject = {
-          'type': 'FeatureCollection',
-          'features': featureData
+    //下钻到下一级 type点击的类型:polygon 点击多边形（分为点击组织/小区）    people 点击详情
+    async toSubAgency(type, e, searchName) {
+      //点击小区neighborHood显示楼栋，点击非小区，进入下一级地图
+      if (type === "people") {
+        this.runNum++;
+        this.runAgencyArray.push(this.orgData);
+        this.orgLevel = "people";
+        this.selUserId = e;
+        this.orgId = "";
+        this.orgData = {
+          id: "",
+          level: "people",
+          name: "人员档案",
         };
-        let feature = (new GeoJSON()).readFeatures(geojsonObject)
-        parentSource.addFeatures(feature)
-
-      }
-
-    },
-
-    //加载当前园区的标注
-    loadPolygon (subAgencyArray) {
-      polygonSource.clear()//清空多边形标注
-      iconSource.clear()//清空多边形标注
-
-      let featureData = []//标注数据
-      if (subAgencyArray && subAgencyArray.length > 0) {//判断是否存在下级标注
-        let oneData = {}
-
-        let count = 0
-        for (let i = 0; i < subAgencyArray.length; i++) {
-          const agencyItem = subAgencyArray[i]
-
-
-          if (agencyItem.coordinates && agencyItem.coordinates !== '') {//如果有坐标
-            let urlNum = count % 3
-            count++
-
-            oneData = {
-              type: 'Feature',
-              id: agencyItem.id,
-              properties: {
-                id: agencyItem.id,
-                level: agencyItem.level,
-                name: agencyItem.name,
-                colorIndex: urlNum//颜色随机的索引
-              },
-              geometry: {
-                type: 'Polygon',
-                coordinates: [],
-              },
-            }
-            let coorArray = agencyItem.coordinates.split(',')//坐标数组
-
-            let itemArray = []//单个点位的[lon,lat]，数组
-            let polygonArray = []//整个多边形的[[lon,lat],[lon,lat],[lon,lat]]数组
-
-            coorArray.forEach((item, index) => {
-              // itemArray.push(item)
-              if (index % 2 == 0) {//偶
-                item = (parseFloat(item) + parseFloat(xoffset)) + ''
-                itemArray.push(item)
-
-              } else {//奇
-
-                item = (parseFloat(item) + parseFloat(yoffset)) + ''
-                itemArray.push(item)
-                polygonArray.push(itemArray)
-                itemArray = []
-              }
-
-            });
-            oneData.geometry.coordinates.push(polygonArray)
-            featureData.push(oneData)
-          }
+        this.searchName = searchName;
+      } else {
+        if (!e) {
+          return false;
         }
-      }
-
-      if (featureData && featureData.length > 0) {
-        var geojsonObject = {
-          'type': 'FeatureCollection',
-          'features': featureData
-        };
-        let feature = (new GeoJSON()).readFeatures(geojsonObject)
-        console.log(geojsonObject)
-
-        polygonSource.addFeatures(feature)
-
-        let iconFeatures = [];
-        feature.forEach(oneIcon => {
-          var extent = boundingExtent(oneIcon.getGeometry().getCoordinates()[0]); //获取一个坐标数组的边界，格式为[minx,miny,maxx,maxy]
-          // var center = getCenter(extent);   //获取边界区域的中心位置
-          //添加标注
-          let x = (parseFloat(extent[0]) + parseFloat(extent[2])) / 2
-          let y = (parseFloat(extent[1]) + parseFloat(extent[3])) / 2
-
-          let oneArray = [x, y]
-          this.iconCoordinators.push(oneArray)
-          // debugger
-          //地图icon样式
-          let oneCctv = new Feature({
-            geometry: new Point([x, y]),
-            id: oneIcon.id_,
-            properties: {
-              type: "icon",
-              id: oneIcon.id_
-            }
-          });
-
-          let iconStyle = new Style({
-            image: new Icon({
-              // anchor: [0.5, 0.5],
-              // imgSize: [32, 32],
-              scale: 0.5,
-              // src: "/img/largeScreen/icon_camra.png"
-              // src: "https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/a219130b6bc74b0b80b5ddb0fce0892a.png"
-              src: iconUrlArray[oneIcon.values_.colorIndex]
-            })
-          });
+        if (!e.selected[0]) {
+          return false;
+        }
+        this.runNum++;
 
-          oneCctv.setStyle(iconStyle);
-          iconFeatures.push(oneCctv);
+        this.runAgencyArray.push(this.orgData);
 
+        this.subAgencyArray.forEach((item) => {
+          if (item.id === e.selected[0].values_.id) {
+            this.orgId = item.id;
+            this.orgLevel = item.level;
+            this.orgData = item;
+          }
         });
 
-        iconSource.addFeatures(iconFeatures);
-      }
-
-    },
-
-
-    //根据组织层级设置缩放级别
-    setZoom (agencyLevel) {
-      if (agencyLevel === 'district') {
-        this.zoom = 12
-      } else if (agencyLevel === 'street') {
-        this.zoom = 13
-      } else if (agencyLevel === 'community') {
-        this.zoom = 14
-      } else {
-        this.zoom = 11
-      }
-
-    },
-
-    firstCenterMap () {
-      this.centerPoint = []
-      if (this.orgData.longitude && this.orgData.latitude) {
-        this.centerPoint.push(this.orgData.longitude)
-        this.centerPoint.push(this.orgData.latitude)
-
-      } else {
-        this.centerPoint = centerPointGlobal
-      }
-
-      if (!this.zoom) {
-        this.setZoom(this.orgData.agencyLevel)
+        if (this.orgLevel === "neighborHood") {
+          this.loadList();
+          this.$nextTick(() => {
+            // 小区id，小区名称
+            this.$refs.ref_community.initData(
+              this.orgData.id,
+              this.orgData.name
+            );
+          });
+        } else {
+          this.refreshMap(true);
+        }
       }
     },
 
-    initMap () {
-      this.firstCenterMap()
-
-      gaodeMapLayer = new TileLayer({
-        title: "地图",
-        source: new XYZ({
-          //指定url瓦片
-          url: 'http://wprd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}',
-          wrapX: true//x方向平铺，也可以选择false
-        }),
-        zIndex: 20
-      });
-
-      mapView = new View({
-        //中心点坐标
-        center: this.centerPoint,
-        // projection: 'EPSG:3857',
-        projection: 'EPSG:4326',
-        zoom: this.zoom,
-        minZoom: this.minZoom
-      })
-
-      //初始化map和地图底图
-      //创建地图容器
-      map = new Map({
-        layers: [gaodeMapLayer],
-        //加载瓦片图层数据
-        view: mapView,
-        target: 'map'
-        //目标加载到map中
-      })
-
-      map.on('singleclick', function (e) {
-        // console.log(e.coordinate)
-        // console.log(transform(e.coordinate, 'EPSG:3857', 'EPSG:4326'));
-      })
-
-      //去除双击放大效果
-      const dblClickInteraction = map
-        .getInteractions()
-        .getArray()
-        .find(interaction => {
-          return interaction instanceof DoubleClickZoom;
-        });
-      map.removeInteraction(dblClickInteraction);
-
-    },
-    //添加变电站标注图层
-    addParentLayer () {
-      parentSource = new VectorSource({
-        //features: (new GeoJSON()).readFeatures(geojsonObject)
-      });
-
-      parentLayer = new VectorLayer({
-        source: parentSource,
-        style: parentStyleFunction,
-        zIndex: 50
-      });
-
-
-      map.addLayer(parentLayer)
-
-
-    },
-
-    //添加变电站标注图层
-    addPolygonLayer () {
-      polygonSource = new VectorSource({
-        //features: (new GeoJSON()).readFeatures(geojsonObject)
-      });
-
-      polygonLayer = new VectorLayer({
-        source: polygonSource,
-        style: polygonStyleFunction,
-        zIndex: 50
-      });
-
-      //选中多边形后的样式
-      var overlayStyle = (function () {
-
-        return function (feature) {
-          var styles = {};
-          styles['Polygon'] = [
-            new Style({
-              stroke: new Stroke({
-                color: '#ec9000',
-                width: 2
-              })
-            }),
-
-            new Style({
-              fill: new Fill({
-                color: 'rgba(0, 0, 255, 0.1)'
-              })
-            }),
-            new Style({
-              text: createTextStyle(feature)
-            })
-          ];
-          styles['MultiPolygon'] = styles['Polygon'];
-          return styles[feature.getGeometry().getType()];
-        };
-      })();
-
-      select = new Select({
-        style: overlayStyle
-      });
-
-
-      map.addLayer(polygonLayer)
-      map.addInteraction(select);
-
-      select.on('select', e => {
-        this.toSubAgency('polygon', e)
-      });
-
-    },
-
-    addIconLayer () {
-      iconSource = new VectorSource({
-        //features: (new GeoJSON()).readFeatures(geojsonObject)
-      });
-
-      iconLayer = new VectorLayer({
-        source: iconSource,
-        zIndex: 70
-      });
-
-      map.addLayer(iconLayer);
-
-    },
+    //刷新地图
+    async refreshMap(isRefreshView) {
+      //加载组织数据
+      await this.loadOrgData();
 
-    //取随机数
-    getRndBetween (lowerLimit, upperLimit) {
-      return Math.floor(Math.random() * (upperLimit - lowerLimit + 1)) + lowerLimit;
+      await this.loadList();
     },
 
     //开启加载动画
-    startLoading () {
+    startLoading() {
       loading = Loading.service({
         lock: true, //是否锁定
-        text: '正在加载……', //加载中需要显示的文字
-        background: 'rgba(0,0,0,.7)' //背景颜色
+        text: "正在加载……", //加载中需要显示的文字
+        background: "rgba(0,0,0,.7)", //背景颜色
       });
-
     },
 
     //结束加载动画
-    endLoading () {
+    endLoading() {
       //clearTimeout(timer);
       if (loading) {
         loading.close();
       }
     },
   },
-  props: {
-
-    // vueFlag: {
-    //   type: String,
-    //   default: "alarm"
-    // }
-  },
-  computed: {
-
-    mapHeight () {
-
-      return this.clientHeight - 120;
-
-    },
-    // zoom: {
-    //   get () {
-    //     //根据不同屏幕分辨率，控制zoom大小
-    //     if (this.clientHeight < 900) {
-    //       return 2.3
-    //     } else {
-    //       return 2.8
-    //     }
-    //   },
-    //   set (value) {
-    //   }
-    // },
-    ...mapGetters(["clientHeight"])
-
-  },
-  components: { BasicInfoCommunity, People, cptCard, ScreenLoading },
-}
-export default vueGis;
+};
 </script>
 
 <style
@@ -1002,7 +409,7 @@ export default vueGis;
   scoped
 ></style>
 
-<style lang="scss" >
+<style lang="scss">
 .div_content {
   .ol-viewport {
     border-radius: 5px;
@@ -1011,7 +418,6 @@ export default vueGis;
 .ol-overlaycontainer-stopevent {
   display: none;
 }
-</style>  
+</style>
 
-<style lang="scss" scoped>
-</style>
\ No newline at end of file
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/visual/basicinfo/cpts/grid-map.vue b/src/views/modules/visual/basicinfo/cpts/grid-map.vue
new file mode 100644
index 000000000..b830be4c8
--- /dev/null
+++ b/src/views/modules/visual/basicinfo/cpts/grid-map.vue
@@ -0,0 +1,371 @@
+<template>
+  <div class="m-map">
+    <div id="map"></div>
+    <div
+      class="btn"
+      v-if="mapStyleType == 'light'"
+      @click="shiftMapStyle('dark')"
+    >
+      切换深色模式
+    </div>
+    <div class="btn" v-else @click="shiftMapStyle('light')">切换浅色模式</div>
+  </div>
+</template>
+
+<script>
+import { requestPost } from "@/js/dai/request";
+import cptCard from "@/views/modules/visual/cpts/card";
+import cptTb from "@/views/modules/visual/cpts/tb";
+import nextTick from "dai-js/tools/nextTick";
+import { Scene, PolygonLayer, LineLayer } from "@antv/l7";
+import { GaodeMap, Map } from "@antv/l7-maps";
+import { spliceIntoChunks } from "@/utils/index";
+
+let scene;
+let polygonLayer;
+let lineLayer;
+let textLayer;
+let posLayer;
+let circleLayer;
+
+export default {
+  name: "l7",
+  inject: ["refresh"],
+
+  data() {
+    return {
+      mapStyleType: localStorage.getItem("mapStyle") || "dark",
+      //   srcGridData: {},
+      darkStyle: {
+        style: "amap://styles/blue",
+        polygonColor: [
+          "rgba(255, 100, 60, 0.5)",
+          "rgba(43, 231, 253, 0.35)",
+          "rgba(255, 255, 50, 0.35)",
+        ],
+        lineColor: [
+          "rgba(255, 180, 150, 0.9)",
+          "rgba(43, 231, 253, 0.7)",
+          "rgba(255, 255, 50, 0.7)",
+        ],
+        circleColor: [
+          "rgba(255, 180, 150, 0.99)",
+          "rgba(43, 231, 253, 0.99)",
+          "rgba(255, 255, 50, 0.99)",
+        ],
+        textColor: [
+          "rgba(255, 100, 60, 0.99)",
+          "rgba(43, 231, 253, 0.99)",
+          "rgba(255, 255, 50, 0.99)",
+        ],
+        textStrokeColor: "#fff",
+      },
+
+      lightStyle: {
+        style: "amap://styles/whitesmoke",
+        polygonColor: [
+          "rgba(255, 100, 60, 0.3)",
+          "rgba(43, 231, 253, 0.3)",
+          "rgba(255, 255, 50, 0.3)",
+        ],
+        lineColor: [
+          "rgba(220, 150, 120, 0.9)",
+          "rgba(33, 201, 223, 0.8)",
+          "rgba(200, 200, 50, 0.9)",
+        ],
+        circleColor: [
+          "rgba(255, 180, 150, 0.99)",
+          "rgba(13, 181, 203, 0.8)",
+          "rgba(255, 255, 50, 0.99)",
+        ],
+        textColor: [
+          "rgba(200, 50, 10, 0.99)",
+          "rgba(0, 130, 153, 0.99)",
+          "rgba(120, 120, 0, 0.99)",
+        ],
+        textStrokeColor: "#666",
+      },
+    };
+  },
+
+  props: {
+    srcGridData: {
+      type: Object,
+      default: null,
+    },
+  },
+
+  computed: {},
+
+  components: {
+    cptCard,
+    cptTb,
+  },
+
+  watch: {},
+
+  async mounted() {
+    // 临时这么用吧
+    window._AMapSecurityConfig = {
+      securityJsCode: "92ea2c965c6cf1ba7ee3a8fe01449ef2",
+    };
+
+    // await this.getMapData();
+    this.iniMap();
+  },
+
+  computed: {
+    polygonData() {
+      const { srcGridData } = this;
+      if (
+        !srcGridData ||
+        !srcGridData.children ||
+        !Array.isArray(srcGridData.children)
+      ) {
+        return { type: "FeatureCollection", features: [] };
+      }
+      const polygon = [
+        ...srcGridData.children
+          .filter((item) => item.coordinates.length > 0)
+          .map((item) => ({
+            type: "Feature",
+            properties: {
+              //   id: item.id,
+              //   name: item.name,
+              //   level: item.level,
+              center: [item.longitude, item.latitude],
+              ...item,
+            },
+            geometry: {
+              type: "Polygon",
+              coordinates: [
+                spliceIntoChunks(
+                  item.coordinates.split(",").map((item) => parseFloat(item)),
+                  2
+                ).filter((item) => item.length == 2),
+              ],
+            },
+          })),
+      ];
+      return { type: "FeatureCollection", features: polygon };
+    },
+  },
+
+  watch: {
+    srcGridData(val, oldValue) {
+      if (oldValue == null) {
+        this.iniMap();
+      } else {
+        this.updateMap();
+      }
+    },
+  },
+
+  methods: {
+    iniMap() {
+      const { darkStyle, lightStyle, srcGridData, polygonData } = this;
+      if (!srcGridData) return false;
+
+      let styleConfig = darkStyle;
+      if (this.mapStyleType == "light") {
+        styleConfig = lightStyle;
+      }
+
+      console.log("地图初始化数据", polygonData);
+
+      scene = new Scene({
+        id: "map",
+        logoVisible: false,
+        map: new GaodeMap({
+          pitch: 60,
+          style: styleConfig.style,
+          center: [
+            srcGridData.longitude || this.$store.state.user.longitude,
+            srcGridData.latitude || this.$store.state.user.latitude,
+          ],
+          token: "fc14b42e0ca18387866d68ebd4f150c1",
+          zoom: 18,
+          minZoom: 10,
+          isHotspot: false,
+          resizeEnable: true,
+          doubleClickZoom: false,
+        }),
+      });
+
+      scene.on("loaded", () => {
+        polygonLayer = new PolygonLayer({
+          autoFit: true,
+        })
+          // .size(0)
+          .source(polygonData)
+          .color("name", styleConfig.polygonColor)
+          //   .shape("extrude")
+          .shape("fill")
+          .style({
+            opacityLinear: {
+              enable: true, // true - false
+              dir: "out", // in - out
+            },
+            opacity: 1,
+            // heightfixed: true,
+            // pickLight: true,
+            raisingHeight: 0,
+            // sourceColor: "#333",
+            // targetColor: "rgba(255,255,255, 0.5)",
+          });
+
+        scene.addLayer(polygonLayer);
+
+        lineLayer = new LineLayer({
+          zIndex: 2,
+          name: "line2",
+        })
+          .source(polygonData)
+          .shape("line")
+          .size(1)
+          .color("name", styleConfig.lineColor)
+          .style({
+            opacity: 1,
+          })
+          .animate({
+            interval: 1, // 间隔
+            duration: 2, // 持续时间，延时
+            trailLength: 2, // 流线长度
+          });
+        scene.addLayer(lineLayer);
+
+        circleLayer = new PolygonLayer({
+          zIndex: 3,
+        })
+          .source(polygonData)
+          .color("name", styleConfig.circleColor)
+          .shape("circle")
+          .active(true)
+          .animate(true)
+          .size(50)
+          .style({
+            offsets: [0, -10], // 文本相对锚点的偏移量 [水平, 垂直]
+            opacity: 1,
+          });
+        scene.addLayer(circleLayer);
+
+        scene.addImage(
+          "pos-red",
+          require("@/assets/img/shuju/grid/pos-red.png")
+        );
+        scene.addImage(
+          "pos-green",
+          require("@/assets/img/shuju/grid/pos-green.png")
+        );
+        scene.addImage(
+          "pos-yellow",
+          require("@/assets/img/shuju/grid/pos-yellow.png")
+        );
+        posLayer = new PolygonLayer({
+          zIndex: 4,
+        })
+          .source(polygonData)
+          .shape("name", ["pos-red", "pos-green", "pos-yellow"])
+          .size(12)
+          .style({
+            offsets: [0, 8], // 文本相对锚点的偏移量 [水平, 垂直]
+            // rotation: 60,
+            layerType: "fillImage",
+          });
+        scene.addLayer(posLayer);
+
+        textLayer = new PolygonLayer({
+          zIndex: 20,
+        })
+          .source(polygonData)
+          .color("name", styleConfig.textColor)
+          .shape("name", "text")
+          .size(16)
+          .style({
+            textAnchor: "center", // 文本相对锚点的位置 center|left|right|top|bottom|top-left
+            textOffset: [0, 40], // 文本相对锚点的偏移量 [水平, 垂直]
+            spacing: 2, // 字符间距
+            padding: [2, 2], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
+            stroke: styleConfig.textStrokeColor, // 描边颜色
+            strokeWidth: 0.1, // 描边宽度
+            strokeOpacity: 0.8,
+            textAllowOverlap: true,
+          })
+          .active(true);
+        scene.addLayer(textLayer);
+
+        polygonLayer.on("mousemove", (e) => {
+          polygonLayer.style({
+            raisingHeight: 0,
+          });
+        });
+
+        polygonLayer.on("click", (e) => {
+          console.log(e.feature.properties);
+          this.$emit("clickAgency", e.feature.properties);
+        });
+
+        polygonLayer.on("unmousemove", (e) => {
+          polygonLayer.style({
+            raisingHeight: 0,
+          });
+        });
+      });
+    },
+
+    shiftMapStyle(type) {
+      this.mapStyleType = type;
+      localStorage.setItem("mapStyle", type);
+      this.refresh();
+    },
+
+    updateMap() {
+      const { polygonData } = this;
+      if (polygonLayer) {
+        polygonLayer.setData(polygonData);
+        lineLayer.setData(polygonData);
+        textLayer.setData(polygonData);
+        posLayer.setData(polygonData);
+        circleLayer.setData(polygonData);
+      }
+    },
+
+    async getMapData() {
+      const { data, code, msg } = await requestPost("/gov/org/agency/maporg", {
+        level: "",
+        orgId: "",
+      });
+      if (msg === "success" && code === 0) {
+        this.srcGridData = data;
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.m-map {
+  position: relative;
+  height: 100%;
+  border-radius: 10px;
+  overflow: hidden;
+
+  #app {
+    width: 100%;
+    height: 100%;
+  }
+  .btn {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100px;
+    line-height: 36px;
+    height: 36px;
+    text-align: center;
+    color: #ffffff;
+    font-size: 14px;
+    background-color: rgba(#000, 0.2);
+    cursor: pointer;
+  }
+}
+</style>
diff --git a/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy.vue b/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy.vue
index f2834df4d..2c84054ed 100644
--- a/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy.vue	
+++ b/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy.vue	
@@ -923,7 +923,7 @@ const vueGis = {
       // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icDangerousChemicals/detail"
 
       let params = {
-        icSuperiorResourceId: info.id
+        icDangerousChemicalsId: info.id
       }
 
       const { data, code, msg } = await requestPost(url, params)
diff --git a/src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue b/src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue
index 0128dd051..117deb9af 100644
--- a/src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue
+++ b/src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue
@@ -922,7 +922,7 @@ const vueGis = {
       // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icDangerousChemicals/detail"
 
       let params = {
-        icSuperiorResourceId: info.id
+        icDangerousChemicalsId: info.id
       }
 
       const { data, code, msg } = await requestPost(url, params)
diff --git a/src/views/modules/visual/test/l7.vue b/src/views/modules/visual/test/l7.vue
index 9d362327d..951fd7b71 100644
--- a/src/views/modules/visual/test/l7.vue
+++ b/src/views/modules/visual/test/l7.vue
@@ -21,12 +21,16 @@ import {
   LineLayer,
   CityBuildingLayer,
   RasterLayer,
+  Popup,
 } from "@antv/l7";
 import { GaodeMap, Map } from "@antv/l7-maps";
 // import { DrawEvent, DrawPolygon } from "@antv/l7-draw";
 import { spliceIntoChunks } from "@/utils/index";
 
 let scene;
+// window._AMapSecurityConfig = {
+//   securityJsCode: "您申请的安全密钥",
+// };
 
 export default {
   name: "l7",
@@ -116,18 +120,70 @@ export default {
       const { srcMapData } = this;
       scene = new Scene({
         id: "map",
+        logoVisible: false,
         map: new GaodeMap({
-          pitch: 45,
-          style: "dark",
-          //   style: "light",
+          // viewMode: "3D",
+          pitch: 35.210526315789465,
+        //   style: "dark",
+            style: "light",
           center: [srcMapData.longitude, srcMapData.latitude],
-          //   token: "xxxx - token",
+        //   token: "77e4e81967f342b3e7b81ad1d0411224",
           zoom: 18,
           minZoom: 10,
         }),
       });
 
+      //   scene = new Scene({
+      //     id: "map",
+      //     map: new Map({
+      //       pitch: 35.210526315789465,
+      //       style: "dark",
+      //       //   style: "light",
+      //       center: [srcMapData.longitude, srcMapData.latitude],
+      //       //   token: "xxxx - token",
+      //       zoom: 18,
+      //       minZoom: 10,
+      //     }),
+      //   });
+
       scene.on("loaded", () => {
+        // 底图服务
+        // const baseLayer = new RasterLayer({
+        //   zIndex: 1,
+        // });
+        // baseLayer.source(
+        //   "https://t1.tianditu.gov.cn/DataServer?T=vec_w&X={x}&Y={y}&L={z}&tk=6557fd8a19b09d6e91ae6abf9d13ccbd",
+        //   {
+        //     parser: {
+        //       type: "rasterTile",
+        //       tileSize: 256,
+        //       // minZoom: 6,
+        //       // maxZoom: 15,
+        //       zoomOffset: 0,
+        //     },
+        //   }
+        // );
+
+        // // 注记服务
+        // const annotionLayer = new RasterLayer({
+        //   zIndex: 2,
+        // });
+        // annotionLayer.source(
+        //   "https://t1.tianditu.gov.cn/DataServer?T=cva_w&X={x}&Y={y}&L={z}&tk=6557fd8a19b09d6e91ae6abf9d13ccbd",
+        //   {
+        //     parser: {
+        //       type: "rasterTile",
+        //       tileSize: 256,
+        //       // minZoom: 6,
+        //       // maxZoom: 15,
+        //       zoomOffset: 0,
+        //     },
+        //   }
+        // );
+
+        // scene.addLayer(baseLayer);
+        // scene.addLayer(annotionLayer);
+
         const polygon = [
           ...srcMapData.children
             .filter((item) => item.coordinates.length > 0)
@@ -235,9 +291,9 @@ export default {
         })
           .source({ type: "FeatureCollection", features: polygon })
           .shape("name", ["pos-red", "pos-green", "pos-yellow"])
-          .size(14)
+          .size(12)
           .style({
-            offsets: [0, 10], // 文本相对锚点的偏移量 [水平, 垂直]
+            offsets: [0, 8], // 文本相对锚点的偏移量 [水平, 垂直]
             // rotation: 60,
             layerType: "fillImage",
           });
@@ -256,7 +312,7 @@ export default {
           .size(16)
           .style({
             textAnchor: "center", // 文本相对锚点的位置 center|left|right|top|bottom|top-left
-            textOffset: [0, 45], // 文本相对锚点的偏移量 [水平, 垂直]
+            textOffset: [0, 40], // 文本相对锚点的偏移量 [水平, 垂直]
             spacing: 2, // 字符间距
             padding: [1, 1], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
             stroke: "#ffffff", // 描边颜色
@@ -312,7 +368,7 @@ export default {
                 sweepCenter: [120.145319, 30.238915],
               },
             });
-        //   scene.addLayer(pointLayer);
+          //   scene.addLayer(pointLayer);
         });
 
         // const textFeatures = [
@@ -389,6 +445,17 @@ export default {
           rotation: 0,
           layerType: "fillImage",
         });
+
+      dotLayer.on("mousemove", (e) => {
+        console.log(e);
+        const popup = new Popup({
+          offsets: [0, -0],
+          closeButton: false,
+        })
+          .setLnglat(e.feature.geometry.coordinates)
+          .setHTML(`<span>类型: ${e.feature.properties.categoryKey}</span>`);
+        scene.addPopup(popup);
+      });
       scene.addLayer(dotLayer);
     },
 
diff --git a/src/views/modules/workSys/role/role.vue b/src/views/modules/workSys/role/role.vue
index c6b03d012..da7d11f58 100644
--- a/src/views/modules/workSys/role/role.vue
+++ b/src/views/modules/workSys/role/role.vue
@@ -242,7 +242,7 @@ export default {
     },
 
     diaClose () {
-
+      this.$refs.ref_form.resetData()
       this.formShow = false
 
     },
@@ -317,17 +317,13 @@ export default {
     //重置搜索条件
     resetSearch () {
       this.formData = {
-        orgType: 'current',//当前组织:current 根组织：all		
+
         name: '',//姓名	
-        mobile: '',//手机号	
-        idCard: '',//身份证号码	
-        startTime: '',//检测开始时间yyyy-MM-dd HH:mm	
-        endTime: '',//检测结束时间yyyy-MM-dd HH:mm
+
       }
-      this.timeRange = []
 
       this.pageNo = 0
-      // this.loadTable()
+      this.loadTable()
     },
 
     handleSizeChange (val) {
diff --git a/src/views/modules/workSys/role/roleForm.vue b/src/views/modules/workSys/role/roleForm.vue
index 753a1ce0f..0e0304a2a 100644
--- a/src/views/modules/workSys/role/roleForm.vue
+++ b/src/views/modules/workSys/role/roleForm.vue
@@ -91,8 +91,6 @@ export default {
     return {
       formType: 'add', //表单操作类型 add新增，edit编辑，detail详情
 
-
-
       btnDisable: false,
 
       roleId: '',
@@ -126,7 +124,6 @@ export default {
       await this.getMenuList()
       await this.getMenuShujuList()
 
-
       this.$refs.menuListTree.setCheckedKeys([])
       this.$refs.menuListShujuTree.setCheckedKeys([])
 
@@ -231,19 +228,7 @@ export default {
 
     async addNat () {
 
-      // let menuList1 = [
-      //   ...this.$refs.menuListTree.getCheckedKeys(),
-      //   ...this.$refs.menuListTree.getHalfCheckedKeys(),
-      // ]
-      // let menuList2 = [
-      //   ...this.$refs.menuListShujuTree.getCheckedKeys(),
-      //   ...this.$refs.menuListShujuTree.getHalfCheckedKeys()
-      // ]
-
-      //   console.log('menuList1', menuList1)
-      //   console.log('menuList2', menuList2)
-      // let menuAll=menuList1.concat(menuList2)
-      // console.log('menuAll',menuAll)
+
       this.formData.menuIdList = []
       this.formData.menuIdList = [
         ...this.$refs.menuListTree.getCheckedKeys(),
@@ -298,6 +283,7 @@ export default {
     },
 
     resetData () {
+
       this.roleId = ''
 
       this.formData = {
@@ -308,6 +294,7 @@ export default {
         customerId: ''
 
       }
+      this.$refs['ref_form'].resetFields()
     },
     // 开启加载动画
     startLoading () {
@@ -329,7 +316,7 @@ export default {
     dataRule () {
       return {
         name: [
-          { required: true, message: '姓名不能为空', trigger: 'blur' }
+          { required: true, message: '角色名称不能为空', trigger: 'change' }
         ],
 
 
@@ -340,11 +327,6 @@ export default {
   props: {
 
 
-
-    // serviceList: {
-    //   type: Array,
-    //   default: []
-    // },
   }
 }
 </script>
diff --git a/src/views/pages/404.vue b/src/views/pages/404.vue
index 5d49d6434..e7796ec66 100644
--- a/src/views/pages/404.vue
+++ b/src/views/pages/404.vue
@@ -2,11 +2,11 @@
   <div class="aui-wrapper aui-page__not-found">
     <div class="aui-content__wrapper">
       <div class="aui-content">
-        <h2 class="title">404</h2>
+        <h2 class="title" style="font-size: 60px">页面未找到或无权访问</h2>
         <p class="desc" v-html="$t('notFound.desc')"></p>
         <div class="btn-bar">
           <el-button @click="$router.go(-1)">{{ $t('notFound.back') }}</el-button>
-          <el-button type="primary" @click="$router.push({ name: 'home' })">{{ $t('notFound.home') }}</el-button>
+          <el-button type="primary" @click="$router.push({ name: 'index' })">{{ $t('notFound.home') }}</el-button>
         </div>
       </div>
     </div>
diff --git a/src/views/pages/index.vue b/src/views/pages/index.vue
index 056814c60..19ec9d88f 100644
--- a/src/views/pages/index.vue
+++ b/src/views/pages/index.vue
@@ -5,14 +5,14 @@
         <div class="list">
           <div class="item" @click="handleClickItem(1)">
             <img class="logo" src="@/assets/img/index/logo-1.png" alt="" />
-             <!-- 党建引领基层治理互联管理平台 -->
+            <!-- 党建引领基层治理互联管理平台 -->
             <div class="name">数字社区管理平台</div>
             <img src="@/assets/img/index/zhuangshi.png" class="tip" />
           </div>
 
           <div class="item z-on" @click="handleClickItem(2)">
             <img class="logo" src="@/assets/img/index/logo-2.png" alt="" />
-             <!-- 数据分析可视化平台 -->
+            <!-- 数据分析可视化平台 -->
             <div class="name">数字社区可视化平台</div>
             <img src="@/assets/img/index/zhuangshi.png" class="tip" />
           </div>
@@ -21,7 +21,9 @@
       <div class="m-footer">
         <div class="login-footer">
           <p>
-            <a href="http://www.elinkchina.com.cn/" target="_blank">{{ $t('login.copyright') }}</a>
+            <a href="http://www.elinkchina.com.cn/" target="_blank">{{
+              $t("login.copyright")
+            }}</a>
           </p>
         </div>
       </div>
@@ -29,60 +31,69 @@
   </div>
 </template>
 <script>
-import Cookies from 'js-cookie'
-import debounce from 'lodash/debounce'
-import { messages } from '@/i18n'
-import { getUUID } from '@/utils'
-import { Loading } from 'element-ui' // 引入Loading服务
-import JSEncrypt from 'jsencrypt' //引入加密
+import Cookies from "js-cookie";
+import debounce from "lodash/debounce";
+import { messages } from "@/i18n";
+import { getUUID } from "@/utils";
+import { Loading } from "element-ui"; // 引入Loading服务
+import JSEncrypt from "jsencrypt"; //引入加密
 
-let loading // 加载动画
+let loading; // 加载动画
 export default {
   data() {
     return {
       pubKey: null, // 获取到公钥
       isShowLogin: true,
-      i18nMessages: messages
-    }
+      i18nMessages: messages,
+    };
   },
   components: {},
   computed: {},
   created() {},
   mounted() {},
 
+  beforeRouteEnter(to, from, next) {
+    console.log(from);
+    if (from.name == "login") {
+      next();
+      location.reload();
+    }
+    next();
+  },
+
   methods: {
     handleClickItem(k) {
       if (k == 1) {
-        this.$router.replace({ name: 'main' })
+        this.$router.replace({ name: "main" });
       } else if (k == 2) {
-        this.$router.replace({ name: 'main-shuju' })
+        this.$router.replace({ name: "main-shuju" });
       }
     },
 
     // 平阴联动 自动登录接口
     getAutoLogin(platformToken) {
-      this.dataForm.thirdToken = platformToken
-      this.dataForm.platform = 'pyld'
+      this.dataForm.thirdToken = platformToken;
+      this.dataForm.platform = "pyld";
       this.$http
         .post(`/auth/sso/oper/third/login`, this.dataForm)
         .then(({ data: res }) => {
           if (res.code !== 0) {
             if (res.code == 8302) {
-              return this.$message.error(res.msg)
+              return this.$message.error(res.msg);
             }
-            return this.$message.error(res.msg)
+            return this.$message.error(res.msg);
           }
-          localStorage.setItem('customerId', res.data.customerId)
-          localStorage.setItem('userType', 'work')
-          localStorage.setItem('showHeader', '0')
-          localStorage.setItem('token', res.data.token)
-          this.$router.replace({ name: 'home' })
+          localStorage.setItem("customerId", res.data.customerId);
+          localStorage.setItem("userType", "work");
+          localStorage.setItem("showHeader", "0");
+          localStorage.setItem("token", res.data.token);
+          this.$router.replace({ name: "home" });
         })
-        .catch(() => {})
+        .catch(() => {});
       // epmet-ext9.elinkservice.cn/platform-admin
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
 <style lang="scss" src="@/assets/scss/pages/indexWork.scss" scoped></style>
diff --git a/src/views/pages/login.vue b/src/views/pages/login.vue
index 6db09b136..10cf96a93 100644
--- a/src/views/pages/login.vue
+++ b/src/views/pages/login.vue
@@ -247,7 +247,7 @@ export default {
           localStorage.setItem("userType", "work");
           localStorage.setItem("showHeader", "0");
           localStorage.setItem("token", res.data.token);
-          this.$router.replace({ name: "home" });
+          this.$router.replace({ name: "index" });
         })
         .catch(() => {});
       // epmet-ext9.elinkservice.cn/platform-admin