diff --git a/src/assets/scss/modules/management/form-main.scss b/src/assets/scss/modules/management/form-main.scss
index 6e0cfa6fa..60f243942 100644
--- a/src/assets/scss/modules/management/form-main.scss
+++ b/src/assets/scss/modules/management/form-main.scss
@@ -21,6 +21,18 @@
   .list_item_width_2 {
     width: 135px;
   }
+
+  .list_item_width_3 {
+    width: 185px;
+  }
+
+
+  .item_width_5{
+    width: 320px;
+  }
+  .item_width_6{
+    width: 404px;
+  }
 }
 
 
@@ -51,7 +63,14 @@
   }
 }
 
+.form_flex{
+  display:flex;
+  justify-content: space-around;
 
+  .form_item{
+width:50%;
+  }
+}
 
 .twoline {
   display: -webkit-box;
diff --git a/src/assets/scss/modules/management/list-main.scss b/src/assets/scss/modules/management/list-main.scss
index 922bfaf71..c752e60c4 100644
--- a/src/assets/scss/modules/management/list-main.scss
+++ b/src/assets/scss/modules/management/list-main.scss
@@ -19,6 +19,9 @@
   .item_width_1{
     width: 260px;
   }
+  .item_width_3{
+    width: 200px;
+  }
   .item_width_2{
     width: 160px;
   }
diff --git a/src/utils/cascader.js b/src/utils/cascader.js
new file mode 100644
index 000000000..3ab33ae07
--- /dev/null
+++ b/src/utils/cascader.js
@@ -0,0 +1,36 @@
+export function getItemByIdInCascader(arr, vals, idName, childName) {
+  let item = arr.find((v) => v[idName] == vals[0]);
+  if (vals.length > 1) {
+    return [
+      item,
+      ...getItemByIdInCascader(
+        item[childName],
+        vals.slice(1),
+        idName,
+        childName
+      ),
+    ];
+  } else {
+    return [item];
+  }
+}
+
+export function collapse(arr, childName) {
+  if (arr.length > 0) {
+    let ret = [...arr];
+    arr.forEach((element) => {
+      let childs = element[childName];
+      if (childs && Array.isArray(childs)) {
+        ret.push(...collapse(childs, childName));
+      }
+    });
+    return ret;
+  } else {
+    return [];
+  }
+}
+
+export default {
+  getItemByIdInCascader,
+  collapse,
+};
diff --git a/src/views/modules/base/collect.vue b/src/views/modules/base/collect.vue
index bd19c5e0a..3d6cdb81a 100644
--- a/src/views/modules/base/collect.vue
+++ b/src/views/modules/base/collect.vue
@@ -110,7 +110,7 @@
           prop="houseType"
           align="center"
           width="100"
-          label="自有/租住"
+          label="房屋状态"
         >
           <template slot-scope="scope">
             <span v-if="scope.row.houseType == 1">出租</span>
diff --git a/src/views/modules/base/epidemic/antiInfo.vue b/src/views/modules/base/epidemic/antiInfo.vue
index dc93596d1..8e4645251 100644
--- a/src/views/modules/base/epidemic/antiInfo.vue
+++ b/src/views/modules/base/epidemic/antiInfo.vue
@@ -152,6 +152,7 @@
       <el-table class="table"
                 :data="tableData"
                 border
+                ref="ref_table"
                 :height="tableHeight"
                 v-loading="tableLoading"
                 :header-cell-style="{background:'#2195FE',color:'#FFFFFF'}"
@@ -554,6 +555,9 @@ export default {
     await this.loadTable()
     this.sHeight = this.$refs.div_search.offsetHeight + 230
   },
+  activated () {
+    this.$refs['ref_table'].doLayout()
+  },
 
   methods: {
     handleCnalceForm () {
diff --git a/src/views/modules/base/epidemic/natInfo/natList.vue b/src/views/modules/base/epidemic/natInfo/natList.vue
index f269abefb..25cbcd3ed 100644
--- a/src/views/modules/base/epidemic/natInfo/natList.vue
+++ b/src/views/modules/base/epidemic/natInfo/natList.vue
@@ -332,6 +332,10 @@ export default {
     await this.loadTable()
   },
 
+  activated () {
+    this.$refs['ref_table'].doLayout()
+  },
+
   methods: {
 
     async handleSearch () {
diff --git a/src/views/modules/base/epidemic/veroFocus/veroFocusList.vue b/src/views/modules/base/epidemic/veroFocus/veroFocusList.vue
index 5dd83f001..603f42a0b 100644
--- a/src/views/modules/base/epidemic/veroFocus/veroFocusList.vue
+++ b/src/views/modules/base/epidemic/veroFocus/veroFocusList.vue
@@ -756,14 +756,14 @@ export default {
     async deleteFocus (row) {
       const url = "/epmetuser/icEpidemicSpecialAttention/cancel-attention";
       // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/placepatrolteam/del"
-      let idCards = [];
+      let ids = [];
 
       this.selectionAll.forEach((element) => {
-        idCards.push(element.idCard);
+        ids.push(element.id);
       });
       let params = {
         attentionType: 1,
-        idCards: idCards,
+        ids: ids,
       };
 
       const { data, code, msg } = await requestPost(url, params);
diff --git a/src/views/modules/communityParty/article/cpts/offline.vue b/src/views/modules/communityParty/article/cpts/offline.vue
new file mode 100644
index 000000000..8a5eee901
--- /dev/null
+++ b/src/views/modules/communityParty/article/cpts/offline.vue
@@ -0,0 +1,221 @@
+<template>
+  <div>
+    <div class="dialog-h-content scroll-h">
+      <el-form
+        ref="ref_form"
+        :inline="true"
+        :model="fmData"
+        :rules="dataRule"
+        class="form"
+      >
+        <el-form-item
+          label="文章名称"
+          prop="title"
+          label-width="150px"
+          style="display: block"
+        >
+          <div style="width: 610px">
+            {{ fmData.title || "--" }}
+          </div>
+        </el-form-item>
+
+        <el-form-item
+          label="下线网格	"
+          prop="gridIdList"
+          label-width="150px"
+          style="display: block"
+        >
+          <el-cascader
+            v-model="fmData.gridIdList"
+            placeholder="请选择"
+            :options="gridOptions"
+            :props="{
+              multiple: true,
+              value: 'value',
+              label: 'label',
+              children: 'children',
+              checkStrictly: false,
+              emitPath: false,
+            }"
+            :show-all-levels="false"
+            size="small"
+            clearable
+            class="item-select"
+            style="width: 500px"
+            @change="handleChangeCascader"
+          >
+          </el-cascader>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="div_btn resi-btns">
+      <el-button size="small" @click="handleCancle">取 消</el-button>
+      <el-button
+        type="primary"
+        size="small"
+        :disabled="btnDisable"
+        @click="handleComfirm"
+        >确 定</el-button
+      >
+    </div>
+  </div>
+</template>
+
+<script>
+import { requestPost } from "@/js/dai/request";
+
+export default {
+  props: {},
+
+  data() {
+    return {
+      btnDisable: false,
+
+      fmData: {
+        articleId: "",
+        title: "",
+        gridIdList: [],
+      },
+
+      gridOptions: [],
+    };
+  },
+  components: {},
+  computed: {
+    dataRule() {
+      return {
+        gridIdList: [
+          { required: true, message: "下线网格不能为空", trigger: "blur" },
+        ],
+      };
+    },
+  },
+  watch: {},
+
+  async mounted() {},
+
+  methods: {
+    handleChangeCascader(e) {
+      console.log(e);
+    },
+    async initForm({ articleId, title }) {
+      this.fmData.articleId = articleId;
+      this.fmData.title = title;
+      this.fmData.gridIdList = [];
+      this.gridOptions = [];
+      this.getGridOpitons(articleId);
+    },
+
+    async getGridOpitons(articleId) {
+      const url = "/gov/voice/article/publishgridlist";
+      const params = {
+        articleId,
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+      if (code === 0) {
+        function poll(list) {
+          return list.map((item) => {
+            return {
+              label: item.agencyName,
+              value: item.agencyId,
+              type: "agency",
+              children: [
+                ...poll(item.subAgencyGridList),
+                ...item.gridList.map((grid) => ({
+                  label: grid.gridName,
+                  value: grid.gridId,
+                  type: "grid",
+                })),
+              ],
+            };
+          });
+        }
+        let gridOptions = poll([data.agencyGridList]);
+        console.log(gridOptions);
+        this.gridOptions = gridOptions;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    async handleComfirm() {
+      this.btnDisable = true;
+      setTimeout(() => {
+        this.btnDisable = false;
+      }, 5000);
+      this.$refs["ref_form"].validate((valid, messageObj) => {
+        if (!valid) {
+          app.util.validateRule(messageObj);
+          this.btnDisable = false;
+        } else {
+          this.submit();
+        }
+      });
+    },
+
+    async submit() {
+      let url = "/gov/voice/article/offlinearticle";
+
+      let params = { ...this.fmData };
+
+      const { data, code, msg } = await requestPost(url, params);
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "操作成功",
+        });
+        this.$emit("afterOffline");
+        this.btnDisable = false;
+      } else {
+        this.btnDisable = false;
+        this.$message.error(msg);
+      }
+    },
+
+    handleCancle() {
+      this.$emit("close");
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.item_width_1 {
+  width: 500px;
+}
+.item_width_2 {
+  width: 400px;
+}
+.item_width_3 {
+  margin-left: 10px;
+  width: 200px;
+}
+.item_width_4 {
+  width: 200px;
+}
+
+.div_map {
+  margin-top: 10px;
+}
+
+.div_btn {
+  // display: flex;
+  // justify-content: flex-end;
+}
+.el-tabs {
+  margin: 0 20px;
+}
+.el-upload__tip {
+  color: rgb(155, 155, 155);
+  margin: 0;
+}
+.form {
+  margin-top: 30px;
+}
+
+.attachement-list {
+}
+</style>
diff --git a/src/views/modules/communityParty/article/drafts.vue b/src/views/modules/communityParty/article/drafts.vue
new file mode 100644
index 000000000..eb9eda4d3
--- /dev/null
+++ b/src/views/modules/communityParty/article/drafts.vue
@@ -0,0 +1,394 @@
+<template>
+  <div>
+    <base-page
+      ref="basePage"
+      :searchParams="searchParams"
+      :tableParams="tableParams"
+      :tableUrl="tableUrl"
+      :addUrl="addUrl"
+      :editUrl="editUrl"
+      :delUrl="delUrl"
+      :editAuth="editAuth"
+      :delAuth="delAuth"
+      :infoUrl="infoUrl"
+      :exportUrl="exportUrl"
+      :importUrl="importUrl"
+      :mubanUrl="mubanUrl"
+      :editParams="editParams"
+      :editFixedParams="editFixedParams"
+      :editElseRules="editElseRules"
+      :editConfig="editConfig"
+      :editParamsDiv="5"
+      :infoAuth="() => false"
+      :formBtnFixed="true"
+      idName="draftId"
+    >
+      <template v-slot:editOperateSup="{ id, formType, info }">
+        <el-button
+          v-if="formType != 'watch' && info.richTextFlag == '1'"
+          type="warning"
+          size="small"
+          :disabled="draftBtnDisable"
+          @click="handleClickDraft(info)"
+          >存草稿</el-button
+        >
+      </template>
+    </base-page>
+  </div>
+</template>
+
+<script>
+import basePage from "@/views/modules/cpts/base/index";
+import { getItemByIdInCascader, collapse } from "@/utils/cascader";
+import { requestPost } from "@/js/dai/request";
+import dateFormat from "dai-js/tools/dateFormat.js";
+
+export default {
+  props: {},
+
+  data() {
+    return {
+      draftBtnDisable: false,
+
+      searchParams: [
+        { field: "文章标题", keyName: "title", type: "input" },
+        {
+          field: "创建时间",
+          keyName: "createdTime",
+          type: "date-range",
+          supKeys: ["startDate", "endDate"],
+          supValues: ["", ""],
+        },
+      ],
+
+      tableParams: [
+        { field: "序号", keyName: "", type: "no" },
+        { field: "文章标题", keyName: "title", type: "text" },
+        { field: "创建时间", keyName: "createdTime", type: "text" },
+      ],
+      tableUrl: "/gov/voice/draft/draftListV2",
+      mubanUrl: "",
+      importUrl: "",
+      exportUrl: "",
+
+      addUrl: "",
+      editUrl: "/gov/voice/article/addOrSaveDraft",
+      infoUrl: "/gov/voice/draft/detailV2",
+      delUrl: "/gov/voice/draft/deletedraft",
+      editAuth(item) {
+        return true;
+      },
+      delAuth(item) {
+        return true;
+      },
+
+      editParams: [
+        {
+          field: "文章标题",
+          keyName: "title",
+          type: "input",
+          maxlength: 50,
+          editDisabled: true,
+          rules: [
+            {
+              required: true,
+              message: "文章标题不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "封面图片",
+          keyName: "imgArr",
+          type: "upload",
+          limit: 1,
+          listType: "picture-card",
+          editDisabled: true,
+          rules: [],
+          value: () => [],
+          uploadUrl: window.SITE_CONFIG["apiURL"] + "/oss/file/article/upload",
+          supKeys: ["imgUrlArr", "imgUrl"],
+          supValues: [() => [], ""],
+          beforeImgUpload(file, item, that) {
+            console.log(file);
+            const isLt1M = file.size / 1024 / 1024 < 10;
+            const srcType = file.type;
+
+            if (!isLt1M) {
+              that.$message.error("上传文件大小不能超过 10MB!");
+              return false;
+            }
+            if (srcType.indexOf("image") == -1) {
+              that.$message.error("仅限图片格式");
+              return false;
+            }
+            return true;
+          },
+        },
+        {
+          field: "发布范围",
+          keyName: "gridIdList",
+          type: "cascader",
+          value: [],
+          supKeys: ["publishRangeDesc"],
+          supValues: [""],
+          optionUrl: "/gov/org/customeragency/agencygridtree",
+          optionUrlParams: {
+            agencyId: this.$store.state.user.agencyId,
+          },
+          optionList: [],
+          optionProps: {
+            multiple: true,
+            value: "agencyId",
+            label: "agencyName",
+            children: "subAgencyList",
+            checkStrictly: false,
+            emitPath: false,
+          },
+          optionCook(obj) {
+            return [obj];
+          },
+          handleChangeFn(vals, item, that) {
+            console.log("handleChangeFn", vals);
+            const { optionList } = item;
+            const optionPlaneList = collapse(optionList, "subAgencyList");
+            if (vals.length > 0) {
+              let selectedList = vals.map(
+                (v) =>
+                  getItemByIdInCascader(
+                    optionPlaneList,
+                    [v],
+                    "agencyId",
+                    "subAgencyList"
+                  )[0]
+              );
+              console.log("handleChangeFn", selectedList);
+              let selectedFilterList = selectedList.filter(
+                (a) => a.level == "grid"
+              );
+              that.fmData[item["keyName"]] = selectedFilterList.map(
+                (a) => a.agencyId
+              );
+              that.fmData[item["supKeys"][0]] = selectedFilterList
+                .map((a) => a.agencyName)
+                .join("、");
+            } else {
+            }
+          },
+          rules: [
+            {
+              required: true,
+              message: "发布范围不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "发布时间",
+          keyName: "publishDate",
+          type: "date",
+          value: dateFormat(new Date(), "yyyy-MM-dd"),
+          pickerOptions: {
+            disabledDate(time) {
+              return time.getTime() > Date.now();
+            },
+          },
+          rules: [
+            {
+              required: true,
+              message: "发布时间不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "发布单位",
+          keyName: "publisher",
+          type: "select",
+          optionUrl: "/gov/voice/article/publishagencylist",
+          optionList: [],
+          optionType: "group",
+          supKeys: ["publisherName", "publisherType"],
+          supValues: ["", ""],
+          optionCook(data) {
+            let ret = [];
+            const { agencyDeptList, agencyGridList, agencyId, agencyName } =
+              data;
+            if (agencyId) {
+              ret.push({
+                label: "以组织名义",
+                optionList: [
+                  {
+                    label: agencyName,
+                    value: agencyId,
+                    type: "agency",
+                  },
+                ],
+              });
+            }
+            if (Array.isArray(agencyDeptList) && agencyDeptList.length > 0) {
+              ret.push({
+                label: "以部门名义",
+                optionList: [
+                  ...agencyDeptList.map((d) => ({
+                    label: d.agencyDeptName,
+                    value: d.departmentId,
+                    type: "department",
+                  })),
+                ],
+              });
+            }
+            if (Array.isArray(agencyGridList) && agencyGridList.length > 0) {
+              ret.push({
+                label: "以网格名义",
+                optionList: [
+                  ...agencyGridList.map((d) => ({
+                    label: d.agencyGridName,
+                    value: d.gridId,
+                    type: "grid",
+                  })),
+                ],
+              });
+            }
+            return ret;
+          },
+          handleChangeFn(vals, item, that) {
+            const { optionList } = item;
+            let opts = [];
+            optionList.forEach((g) => {
+              opts = [...opts, ...g.optionList];
+            });
+            let publisher = opts.find((p) => vals == p.value);
+            that.fmData[item["supKeys"][0]] = publisher.label;
+            that.fmData[item["supKeys"][1]] = publisher.type;
+          },
+          rules: [
+            {
+              required: true,
+              message: "发布单位不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "文章标签",
+          keyName: "tagNameList",
+          type: "select",
+          multiple: true,
+          filterable: true,
+          allowCreate: true,
+          optionUrl: "/gov/voice/tag/taglist",
+          optionUrlParams: {},
+          optionList: [],
+          optionCook(list) {
+            return list.map((item) => ({
+              label: item.tagName,
+              value: item.tagName,
+            }));
+          },
+        },
+        {
+          field: "内容",
+          keyName: "content",
+          type: "rich-text",
+          rules: [
+            {
+              required: true,
+              message: "内容不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "置顶",
+          keyName: "isTop",
+          type: "switch",
+          activeValue: "1",
+          inactiveValue: "0",
+        },
+      ],
+      editFixedParams: {
+        type: "article",
+      },
+      editElseRules: {},
+      editConfig: {
+        confirmBtnName: "发布",
+        cookInfoFn(data) {
+          if (data.richTextFlag == "0") {
+            data.content = data.contentList
+              .map((item) => {
+                if (item.contentType == "text") {
+                  return `<p>${item.content}</p>`;
+                } else if (item.contentType == "img") {
+                  return `<img src="${item.content}" style="max-width:100%"></img>`;
+                } else if (item.contentType == "video") {
+                  return `<video src="${item.content}" style="max-width:100%" controls></video>`;
+                } else if (item.contentType == "file") {
+                  return `<a src="${item.content}" target="_blank">附件：${item.fileName}</a>`;
+                }
+              })
+              .join(" ");
+          } else {
+            data.content =
+              Array.isArray(data.contentList) && data.contentList.length > 0
+                ? data.contentList[0].content
+                : "";
+          }
+          if (data.imgUrl) {
+            data.imgArr = [
+              {
+                name: "封面",
+                url: data.imgUrl,
+              },
+            ];
+            data.imgUrlArr = [data.imgUrl];
+          }
+
+          return data;
+        },
+
+        beforeSubmit(formType, fmData, that) {
+          if (fmData.isTop == "1" && !fmData.imgUrl) {
+            that.$message.error("请上传封面图片");
+            return false;
+          }
+          return true;
+        },
+      },
+    };
+  },
+  components: { basePage },
+  computed: {},
+  watch: {},
+
+  async mounted() {},
+
+  methods: {
+    async handleClickDraft(fmData) {
+      let url = this.addUrl;
+      let params = {
+        ...fmData,
+        type: "draft",
+      };
+      params = this.$refs.basePage.$refs.editForm.cookBeforeSubmit(params);
+      if (!params.title && !params.content) {
+        return this.$message.error("标题或内容不能为空");
+      }
+
+      const { data, code, msg } = await requestPost(url, params);
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "保存成功",
+        });
+        this.$refs.basePage.handleClose();
+      } else {
+        this.$message.error(msg);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/communityParty/article/index.vue b/src/views/modules/communityParty/article/index.vue
new file mode 100644
index 000000000..f0530a571
--- /dev/null
+++ b/src/views/modules/communityParty/article/index.vue
@@ -0,0 +1,524 @@
+<template>
+  <div>
+    <base-page
+      ref="basePage"
+      :searchParams="searchParams"
+      :tableParams="tableParams"
+      :tableUrl="tableUrl"
+      :addUrl="addUrl"
+      :editUrl="editUrl"
+      :delUrl="delUrl"
+      :editAuth="editAuth"
+      :delAuth="delAuth"
+      :infoUrl="infoUrl"
+      :exportUrl="exportUrl"
+      :importUrl="importUrl"
+      :mubanUrl="mubanUrl"
+      :editParams="editParams"
+      :editFixedParams="editFixedParams"
+      :editElseRules="editElseRules"
+      :editConfig="editConfig"
+      :editParamsDiv="5"
+      :editBtnName="(item) => (!item.latitude ? '待完善' : '修改')"
+      :formBtnFixed="true"
+      idName="articleId"
+    >
+      <template v-slot:editOperateSup="{ id, formType, info }">
+        <el-button
+          v-if="formType != 'watch'"
+          type="warning"
+          size="small"
+          :disabled="draftBtnDisable"
+          @click="handleClickDraft(info)"
+          >存草稿</el-button
+        >
+      </template>
+
+      <template v-slot:listBtnSup="{ item }">
+        <el-button
+          v-if="
+            item.statusFlag == 'published' &&
+            item.agencyId == $store.state.user.agencyId
+          "
+          @click="handleOfflineShow(item)"
+          type="text"
+          size="small"
+          style="color: #666"
+          >下线</el-button
+        >
+      </template>
+    </base-page>
+
+    <el-dialog
+      :visible.sync="offlineShowed"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      title="下线"
+      width="850px"
+      top="5vh"
+      class="dialog-h"
+      @closed="offlineShowed = false"
+    >
+      <offline
+        ref="offlineForm"
+        @close="offlineShowed = false"
+        @afterOffline="handleOfflineSuccess"
+      ></offline>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import basePage from "@/views/modules/cpts/base/index";
+import { getItemByIdInCascader, collapse } from "@/utils/cascader";
+import { requestPost } from "@/js/dai/request";
+import dateFormat from "dai-js/tools/dateFormat.js";
+import offline from "./cpts/offline";
+import nextTick from "dai-js/tools/nextTick";
+
+export default {
+  props: {},
+
+  data() {
+    return {
+      offlineShowed: false,
+
+      draftBtnDisable: false,
+
+      searchParams: [
+        { field: "文章标题", keyName: "title", type: "input" },
+        {
+          field: "标签",
+          keyName: "tagIds",
+          type: "select",
+          multiple: true,
+          optionUrl: "/gov/voice/tag/taglist",
+          optionUrlParams: {},
+          optionList: [],
+          optionCook(list) {
+            return list.map((item) => ({
+              label: item.tagName,
+              value: item.tagId,
+            }));
+          },
+        },
+        {
+          field: "状态",
+          keyName: "statusFlag",
+          value: "",
+          type: "select",
+          optionUrl: "",
+          optionUrlParams: {},
+          optionList: [
+            {
+              label: "已发布",
+              value: "published",
+            },
+            {
+              label: "已下线",
+              value: "offline",
+            },
+          ],
+        },
+        {
+          field: "发布范围",
+          keyName: "publishRangeIds",
+          type: "cascader",
+          optionUrl: "/gov/org/customeragency/agencygridtree",
+          optionUrlParams: {
+            agencyId: this.$store.state.user.agencyId,
+          },
+          optionList: [],
+          optionProps: {
+            multiple: false,
+            value: "agencyId",
+            label: "agencyName",
+            children: "subAgencyList",
+            checkStrictly: true,
+          },
+          optionCook(obj) {
+            return [obj];
+          },
+          supKeys: ["publishRangeId", "publishRangeType"],
+          supValues: ["", ""],
+          handleChangeFn(vals, item) {
+            const { optionList } = item;
+            if (vals.length > 0) {
+              item["supValues"][0] = vals[vals.length - 1];
+              item["supValues"][1] = getItemByIdInCascader(
+                optionList,
+                vals,
+                "agencyId",
+                "subAgencyList"
+              )[vals.length - 1]["level"];
+              item["supValues"][1] =
+                item["supValues"][1] == "grid" ? "grid" : "agency";
+            } else {
+              item["supValues"][0] = "";
+              item["supValues"][1] = "";
+            }
+          },
+        },
+        {
+          field: "发布时间",
+          keyName: "publishTime",
+          type: "date-range",
+          supKeys: ["startDate", "endDate"],
+          supValues: ["", ""],
+        },
+      ],
+
+      tableParams: [
+        { field: "序号", keyName: "", type: "no" },
+        { field: "文章标题", keyName: "title", type: "text" },
+        {
+          field: "标签",
+          keyName: "tagNameList",
+          type: "array",
+          arrayDiv: "、",
+        },
+        { field: "状态", keyName: "statusFlagName", type: "text" },
+        { field: "发布单位", keyName: "publisherName", type: "text" },
+        { field: "发布时间", keyName: "publishDate", type: "text" },
+        {
+          field: "发布范围",
+          keyName: "publishRangeDesc",
+          type: "text",
+        },
+        { field: "置顶", keyName: "isTopName", type: "text" },
+      ],
+      tableUrl: "/gov/voice/article/articleListV2",
+      mubanUrl: "",
+      importUrl: "",
+      exportUrl: "",
+
+      addUrl: "/gov/voice/article/addOrSaveDraft",
+      editUrl: "",
+      infoUrl: "/gov/voice/article/detailV2",
+      delUrl: "",
+      editAuth(item) {
+        return false;
+      },
+      delAuth(item) {
+        return false;
+      },
+
+      editParams: [
+        {
+          field: "文章标题",
+          keyName: "title",
+          type: "input",
+          maxlength: 50,
+          editDisabled: true,
+          rules: [
+            {
+              required: true,
+              message: "文章标题不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "封面图片",
+          keyName: "imgArr",
+          type: "upload",
+          limit: 1,
+          listType: "picture-card",
+          editDisabled: true,
+          rules: [],
+          value: () => [],
+          uploadUrl: window.SITE_CONFIG["apiURL"] + "/oss/file/article/upload",
+          supKeys: ["imgUrlArr", "imgUrl"],
+          supValues: [() => [], ""],
+          beforeImgUpload(file, item, that) {
+            console.log(file);
+            const isLt1M = file.size / 1024 / 1024 < 10;
+            const srcType = file.type;
+
+            if (!isLt1M) {
+              that.$message.error("上传文件大小不能超过 10MB!");
+              return false;
+            }
+            if (srcType.indexOf("image") == -1) {
+              that.$message.error("仅限图片格式");
+              return false;
+            }
+            return true;
+          },
+        },
+        {
+          field: "发布范围",
+          keyName: "gridIdList",
+          type: "cascader",
+          value: () => [],
+          supKeys: ["publishRangeDesc"],
+          supValues: [""],
+          optionUrl: "/gov/org/customeragency/agencygridtree",
+          optionUrlParams: {
+            agencyId: this.$store.state.user.agencyId,
+          },
+          optionList: [],
+          optionProps: {
+            multiple: true,
+            value: "agencyId",
+            label: "agencyName",
+            children: "subAgencyList",
+            checkStrictly: false,
+            emitPath: false,
+          },
+          optionCook(obj) {
+            return [obj];
+          },
+          handleChangeFn(vals, item, that) {
+            console.log("handleChangeFn", vals);
+            const { optionList } = item;
+            const optionPlaneList = collapse(optionList, "subAgencyList");
+            if (vals.length > 0) {
+              let selectedList = vals.map(
+                (v) =>
+                  getItemByIdInCascader(
+                    optionPlaneList,
+                    [v],
+                    "agencyId",
+                    "subAgencyList"
+                  )[0]
+              );
+              console.log("handleChangeFn", selectedList);
+              let selectedFilterList = selectedList.filter(
+                (a) => a.level == "grid"
+              );
+              that.fmData[item["keyName"]] = selectedFilterList.map(
+                (a) => a.agencyId
+              );
+              that.fmData[item["supKeys"][0]] = selectedFilterList
+                .map((a) => a.agencyName)
+                .join("、");
+            } else {
+            }
+          },
+          rules: [
+            {
+              required: true,
+              message: "发布范围不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "发布时间",
+          keyName: "publishDate",
+          type: "date",
+          value: dateFormat(new Date(), "yyyy-MM-dd"),
+          pickerOptions: {
+            disabledDate(time) {
+              return time.getTime() > Date.now();
+            },
+          },
+          rules: [
+            {
+              required: true,
+              message: "发布时间不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "发布单位",
+          keyName: "publisher",
+          type: "select",
+          optionUrl: "/gov/voice/article/publishagencylist",
+          optionList: [],
+          optionType: "group",
+          supKeys: ["publisherName", "publisherType"],
+          supValues: ["", ""],
+          optionCook(data) {
+            let ret = [];
+            const { agencyDeptList, agencyGridList, agencyId, agencyName } =
+              data;
+            if (agencyId) {
+              ret.push({
+                label: "以组织名义",
+                optionList: [
+                  {
+                    label: agencyName,
+                    value: agencyId,
+                    type: "agency",
+                  },
+                ],
+              });
+            }
+            if (Array.isArray(agencyDeptList) && agencyDeptList.length > 0) {
+              ret.push({
+                label: "以部门名义",
+                optionList: [
+                  ...agencyDeptList.map((d) => ({
+                    label: d.agencyDeptName,
+                    value: d.departmentId,
+                    type: "department",
+                  })),
+                ],
+              });
+            }
+            if (Array.isArray(agencyGridList) && agencyGridList.length > 0) {
+              ret.push({
+                label: "以网格名义",
+                optionList: [
+                  ...agencyGridList.map((d) => ({
+                    label: d.agencyGridName,
+                    value: d.gridId,
+                    type: "grid",
+                  })),
+                ],
+              });
+            }
+            return ret;
+          },
+          handleChangeFn(vals, item, that) {
+            const { optionList } = item;
+            let opts = [];
+            optionList.forEach((g) => {
+              opts = [...opts, ...g.optionList];
+            });
+            let publisher = opts.find((p) => vals == p.value);
+            that.fmData[item["supKeys"][0]] = publisher.label;
+            that.fmData[item["supKeys"][1]] = publisher.type;
+          },
+          rules: [
+            {
+              required: true,
+              message: "发布单位不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "文章标签",
+          keyName: "tagNameList",
+          type: "select",
+          multiple: true,
+          filterable: true,
+          allowCreate: true,
+          optionUrl: "/gov/voice/tag/taglist",
+          optionUrlParams: {},
+          optionList: [],
+          optionCook(list) {
+            return list.map((item) => ({
+              label: item.tagName,
+              value: item.tagName,
+            }));
+          },
+        },
+        {
+          field: "内容",
+          keyName: "content",
+          type: "rich-text",
+          rules: [
+            {
+              required: true,
+              message: "内容不能为空",
+              trigger: "blur",
+            },
+          ],
+        },
+        {
+          field: "置顶",
+          keyName: "isTop",
+          type: "switch",
+          activeValue: "1",
+          inactiveValue: "0",
+        },
+      ],
+      editFixedParams: {
+        type: "article",
+      },
+      editElseRules: {},
+      editConfig: {
+        confirmBtnName: "发布",
+        cookInfoFn(data) {
+          if (data.richTextFlag == "0") {
+            data.content = data.contentList
+              .map((item) => {
+                if (item.contentType == "text") {
+                  return `<p>${item.content}</p>`;
+                } else if (item.contentType == "img") {
+                  return `<img src="${item.content}" style="max-width:100%"></img>`;
+                } else if (item.contentType == "video") {
+                  return `<video src="${item.content}" style="max-width:100%" controls></video>`;
+                } else if (item.contentType == "file") {
+                  return `<a src="${item.content}" target="_blank">附件：${item.fileName}</a>`;
+                }
+              })
+              .join(" ");
+          } else {
+            data.content = data.contentList[0].content;
+          }
+          if (data.imgUrl) {
+            data.imgArr = [
+              {
+                name: "封面",
+                url: data.imgUrl,
+              },
+            ];
+            data.imgUrlArr = [data.imgUrl];
+          }
+
+          return data;
+        },
+
+        beforeSubmit(formType, fmData, that) {
+          if (fmData.isTop == "1" && !fmData.imgUrl) {
+            that.$message.error("请上传封面图片");
+            return false;
+          }
+          return true;
+        },
+      },
+    };
+  },
+  components: { basePage, offline },
+  computed: {},
+  watch: {},
+
+  async mounted() {},
+
+  methods: {
+    async handleOfflineShow(item) {
+      console.log(item);
+      this.offlineShowed = true;
+      await nextTick(100);
+      this.$refs.offlineForm.initForm(item);
+    },
+
+    handleOfflineSuccess() {
+      this.$refs.basePage.refresh();
+      this.offlineShowed = false;
+    },
+
+    async handleClickDraft(fmData) {
+      let url = this.addUrl;
+      let params = {
+        ...fmData,
+        type: "draft",
+      };
+      params = this.$refs.basePage.$refs.editForm.cookBeforeSubmit(params);
+      if (!params.title && !params.content) {
+        return this.$message.error("标题或内容不能为空");
+      }
+
+      const { data, code, msg } = await requestPost(url, params);
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "保存成功",
+        });
+        this.$refs.basePage.handleClose();
+      } else {
+        this.$message.error(msg);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/communityParty/heart/heartAudit.vue b/src/views/modules/communityParty/heart/heartAudit.vue
new file mode 100644
index 000000000..d8361e867
--- /dev/null
+++ b/src/views/modules/communityParty/heart/heartAudit.vue
@@ -0,0 +1,354 @@
+<template>
+  <div class="dialog-h-content scroll-h">
+    <div class="div_table">
+      <el-button size="small"
+                 class="diy-button--add"
+                 @click="handleReject">审核拒绝</el-button>
+      <el-button size="small"
+                 class="diy-button--add"
+                 @click="handleAudit('passed')">审核通过</el-button>
+
+      <el-table class="table"
+                :data="tableData"
+                border
+                @selection-change="selectionChange"
+                :height="tableHeight"
+                v-loading="tableLoading"
+                :header-cell-style="{background:'#2195FE',color:'#FFFFFF'}"
+                style="width: 100%">
+        <el-table-column type="selection"
+                         :selectable="checkSelect"
+                         width="55">
+        </el-table-column>
+        <el-table-column label="序号"
+                         header-align="center"
+                         align="center"
+                         type="index"
+                         width="50">
+        </el-table-column>
+
+        <el-table-column prop="realName"
+                         header-align="center"
+                         align="center"
+                         label="姓名"
+                         :show-overflow-tooltip="true"
+                         min-width="100">
+
+        </el-table-column>
+        <el-table-column prop="mobile"
+                         header-align="center"
+                         align="center"
+                         label="手机"
+                         min-width="120">
+
+        </el-table-column>
+
+        <el-table-column prop="idNum"
+                         header-align="center"
+                         align="center"
+                         label="身份证"
+                         width="180">
+
+        </el-table-column>
+        <el-table-column prop="nickName"
+                         header-align="center"
+                         align="center"
+                         label="昵称"
+                         :show-overflow-tooltip="true"
+                         min-width="100">
+
+        </el-table-column>
+        <el-table-column prop="signUpActNum"
+                         header-align="center"
+                         align="center"
+                         label="报名活动个数"
+                         width="120">
+
+        </el-table-column>
+        <el-table-column prop="signInActNum"
+                         header-align="center"
+                         align="center"
+                         label="实际参加活动个数"
+                         width="140">
+
+        </el-table-column>
+        <el-table-column prop="obtainPointsActNum"
+                         header-align="center"
+                         align="center"
+                         label="获得积分活动个数"
+                         width="140">
+
+        </el-table-column>
+        <el-table-column prop="signUpTime"
+                         header-align="center"
+                         align="center"
+                         label="报名时间"
+                         width="180">
+
+        </el-table-column>
+        <el-table-column prop="statusShow"
+                         header-align="center"
+                         align="center"
+                         label="状态"
+                         width="90">
+
+        </el-table-column>
+
+      </el-table>
+
+    </div>
+
+    <!-- 拒绝理由 -->
+
+    <el-dialog :visible.sync="cancleShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :append-to-body="true"
+               :title="'拒绝理由'"
+               width="550px"
+               top="5vh"
+               class="dialog-h"
+               @closed="cancleDiaClose">
+      <div style="padding:30px">
+
+        <el-input class="item_width_5"
+                  type="textarea"
+                  maxlength="100"
+                  show-word-limit
+                  :rows="4"
+                  placeholder="请输入拒绝理由"
+                  v-model="cancelReason"></el-input>
+        <div style="display:flex;  justify-content: center;margin-top:20px">
+          <el-button style="margin-left:30px"
+                     size="small"
+                     class="diy-button--search"
+                     @click="cancleDiaClose">取消</el-button>
+          <el-button style="margin-left:10px"
+                     size="small"
+                     class="diy-button--reset"
+                     @click="handleAudit('refused')">确定</el-button>
+        </div>
+      </div>
+
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+import { requestPost } from '@/js/dai/request'
+
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      tableLoading: false,
+      actId: '',
+      tableData: [],
+      actUserRelationIdList: [],
+
+      auditList: [],
+
+      cancelReason: '',
+      cancleShow: false,//拒绝审核
+
+    }
+  },
+  components: {},
+  mounted () {
+
+  },
+
+  methods: {
+
+    async initTable (actId) {
+      this.actId = actId
+      await this.loadTable()
+
+    },
+
+    checkSelect (row, index) {
+      //待审核：auditing；已通过：passed；已拒绝：refused；已取消：canceled
+      let isChecked = false;
+      if (row.status === 'auditing') { // 判断里面是否存在某个参数
+        isChecked = true
+      } else {
+        isChecked = false
+      }
+      return isChecked
+    },
+
+    selectionChange (selection) {
+      this.actUserRelationIdList = []
+      this.actUserRelationIdList = selection
+
+    },
+
+    //加载form
+    async loadTable () {
+      this.tableLoading = true
+      const url = '/heart/work/actuser/userlist'
+      // const url = 'http://yapi.elinkservice.cn/mock/245/heart/work/actuser/userlist'
+      let params = {
+        actId: this.actId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+      this.tableLoading = false
+      if (code === 0) {
+
+        if (data.list && data.list.length > 0) {
+          data.list.forEach(item => {
+            //待审核：auditing；已通过：passed；已拒绝：refused；已取消：canceled
+            if (item.status === 'auditing') {
+              item.statusShow = '待审核'
+            } else if (item.status === 'passed') {
+              item.statusShow = '已通过'
+            } else if (item.status === 'refused') {
+              item.statusShow = '已拒绝'
+            } else if (item.status === 'canceled') {
+              item.statusShow = '已取消'
+            } else {
+              item.statusShow = ''
+            }
+
+          });
+
+          this.tableData = [...data.list]
+        } else {
+          this.tableData = []
+        }
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleReject () {
+      if (this.actUserRelationIdList.length === 0) {
+        this.$message({
+          type: "info",
+          message: "请选择人员"
+        });
+        return false
+      }
+      this.cancleShow = true
+
+    },
+
+    async handleAudit (type) {
+      if (this.actUserRelationIdList.length === 0) {
+        this.$message({
+          type: "info",
+          message: "请选择人员"
+        });
+        return false
+      }
+      if (type === 'refused' && !this.cancelReason) {
+        this.$message({
+          type: "info",
+          message: "请填写拒绝理由"
+        });
+        return false
+      }
+
+      this.auditList = []
+      this.actUserRelationIdList.forEach(item => {
+        let obj = {
+          type: type,
+          actUserRelationId: item.actUserRelationId,
+          rejectReason: this.cancelReason
+        }
+
+        this.auditList.push(obj)
+      });
+      const url = "/heart/work/actuser/audit-user"
+      // const url = "http://yapi.elinkservice.cn/mock/245/heart/work/actuser/audit-user"
+
+      let params = [...this.auditList]
+
+      console.log(params)
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.$message({
+          type: "success",
+          message: "操作成功"
+        });
+        this.cancelReason = ''
+        this.cancleShow = false
+        this.loadTable()
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    cancleDiaClose () {
+      this.cancelReason = ''
+      this.cancleShow = false//审核拒绝
+    },
+
+    handleCancle () {
+      this.$emit('dialogCancle')
+
+    },
+
+
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    tableHeight () {
+
+      return (this.clientHeight - 360)
+
+    },
+
+    ...mapGetters(['clientHeight'])
+
+  },
+  props: {
+
+  }
+}
+</script>
+
+
+<style lang="scss" scoped >
+@import "@/assets/scss/buttonstyle.scss";
+.item_width_1 {
+  width: 250px;
+}
+.item_width_2 {
+  width: 100px;
+}
+.div_table {
+  margin-top: 10px;
+
+  .table {
+    margin-top: 10px;
+  }
+}
+.div_btn {
+  margin-top: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
diff --git a/src/views/modules/communityParty/heart/heartFinish.vue b/src/views/modules/communityParty/heart/heartFinish.vue
new file mode 100644
index 000000000..bdf0a988b
--- /dev/null
+++ b/src/views/modules/communityParty/heart/heartFinish.vue
@@ -0,0 +1,376 @@
+<template>
+  <div class="dialog-h-content scroll-h">
+    <div>
+      <el-form ref="ref_form"
+               :inline="false"
+               :label-position="'left'"
+               :model="formData"
+               :rules="dataRule"
+               class="div_form mgl10">
+        <el-form-item label="实际活动时间"
+                      label-width="150px"
+                      style="display: block"
+                      prop="actualStartTime">
+          <el-date-picker v-model="formData.actualStartTime"
+                          class="list_item_width_3"
+                          type="datetime"
+                          value-format="yyyy-MM-dd HH:mm"
+                          format="yyyy-MM-dd HH:mm"
+                          placeholder="开始时间">
+          </el-date-picker>
+          <span class="data-tag">至</span>
+          <el-date-picker v-model="formData.actualEndTime"
+                          class="list_item_width_3 data-tag"
+                          type="datetime"
+                          value-format="yyyy-MM-dd HH:mm"
+                          format="yyyy-MM-dd HH:mm"
+                          placeholder="结束时间">
+          </el-date-picker>
+        </el-form-item>
+
+        <el-form-item label="积分发放"
+                      label-width="150px"
+                      style="display: block"
+                      prop="actualStartTime">
+
+        </el-form-item>
+
+        <div class="div_table">
+          <el-table class="m_table"
+                    :data="tableData"
+                    border
+                    :height="tableHeight"
+                    v-loading="tableLoading"
+                    :header-cell-style="{background:'#2195FE',color:'#FFFFFF'}">
+            <el-table-column label="序号"
+                             header-align="center"
+                             align="center"
+                             type="index"
+                             width="50">
+            </el-table-column>
+
+            <el-table-column prop="realName"
+                             header-align="center"
+                             align="center"
+                             label="姓名"
+                             width="120">
+
+            </el-table-column>
+
+            <el-table-column prop="nickName"
+                             header-align="center"
+                             align="center"
+                             label="昵称"
+                             width="120">
+
+            </el-table-column>
+            <el-table-column prop="signUpTime"
+                             header-align="center"
+                             align="center"
+                             label="报名时间"
+                             width="180">
+
+            </el-table-column>
+            <el-table-column prop="signInFlagShow"
+                             header-align="center"
+                             align="center"
+                             label="是否签到"
+                             width="100">
+
+            </el-table-column>
+
+            <el-table-column prop="grantPointShow"
+                             header-align="center"
+                             align="center"
+                             label="操作"
+                             min-width="200">
+
+              <template slot-scope="scope">
+
+                <el-radio v-model="scope.row.grantPointShow"
+                          label="1">给分</el-radio>
+                <el-radio v-model="scope.row.grantPointShow"
+                          label="2">不给分</el-radio>
+
+              </template>
+            </el-table-column>
+
+            <el-table-column prop="denyRewardReason"
+                             header-align="center"
+                             align="center"
+                             label="理由"
+                             min-width="320">
+
+              <template slot-scope="scope">
+
+                <el-input class="item_width_5"
+                          placeholder="请输入理由"
+                          v-model="scope.row.denyRewardReason">
+                </el-input>
+
+              </template>
+            </el-table-column>
+
+          </el-table>
+        </div>
+      </el-form>
+
+    </div>
+    <div class="div_btn">
+      <el-button size="small"
+                 @click="handleCancle">关 闭</el-button>
+      <el-button type="primary"
+                 size="small"
+                 @click="handleConfirm">确 定</el-button>
+
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+import { requestPost } from '@/js/dai/request'
+
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      tableLoading: false,
+      actId: '',
+      tableData: [],
+
+      formData: {
+        actId: '',
+        actualStartTime: '',
+        actualEndTime: '',
+      }
+
+
+    }
+  },
+  components: {},
+  mounted () {
+
+  },
+
+  methods: {
+
+    async initTable (actId) {
+      this.actId = actId
+      this.formData.actId = actId
+      this.formData.actualStartTime = this.actStartTime
+      this.formData.actualEndTime = this.actEndTime
+      this.formData.reward = this.reward
+
+      await this.loadTable()
+
+    },
+
+
+    //加载form
+    async loadTable () {
+      this.tableLoading = true
+      const url = '/heart/work/actuser/userlist'
+      // const url = 'http://yapi.elinkservice.cn/mock/245/heart/work/actuser/userlist'
+      let params = {
+        actId: this.actId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+      this.tableLoading = false
+      if (code === 0) {
+        let arr = []
+
+        if (data.list && data.list.length > 0) {
+          arr = data.list.filter(item => item.status === 'passed')
+          arr.forEach(item => {
+            if (item.signInFlag === 'signed_in') {
+              item.signInFlagShow = '是'
+              item.grantPointShow = '1'
+              item.grantPoint = true
+
+              item.denyRewardReason = ''
+            } else {
+              item.signInFlagShow = '否'
+              item.grantPointShow = '2'
+              item.grantPoint = false
+              item.denyRewardReason = '活动未签到'
+            }
+
+          });
+
+          this.tableData = [...arr]
+        } else {
+          this.tableData = []
+        }
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async handleConfirm () {
+      if (!this.formData.actualStartTime || !this.formData.actualEndTime) {
+        this.$message({
+          type: "info",
+          message: '请填写实际活动时间'
+        });
+        return false
+      }
+      let errBeforeSubmit = ''
+      if (
+        new Date(this.formData.actualEndTime).getTime() <=
+        new Date(this.formData.actualStartTime).getTime()
+      ) {
+        errBeforeSubmit = "活动实际开始时间应早于活动实际结束时间";
+      }
+
+      if (errBeforeSubmit) {
+        this.$message({
+          type: 'info',
+          message: errBeforeSubmit
+        })
+        return false
+      }
+
+
+      let userList = []
+      let reqmsg = ''
+      // actUserRelationId	grantPoint	true:给分；false：不给分	denyRewardReason	拒绝理由
+      this.tableData.forEach(item => {
+        let obj = {}
+        obj.actUserRelationId = item.actUserRelationId
+        obj.denyRewardReason = item.denyRewardReason
+
+        if (item.grantPointShow === '1') {
+          obj.grantPoint = true
+        } else {
+          obj.grantPoint = false
+          if (!item.denyRewardReason) {
+            reqmsg = '不给分的理由必填'
+          }
+
+        }
+        userList.push(obj)
+      });
+
+      if (reqmsg) {
+        this.$message({
+          type: "info",
+          message: reqmsg
+        });
+        return false
+      } else {
+
+        this.finishAct(userList)
+
+      }
+
+
+
+    },
+    async finishAct (userList) {
+
+      let url = "/heart/work/act/finish"
+      // let url = "http://yapi.elinkservice.cn/mock/245/heart/work/act/finish"
+
+      let params = {
+        userList: userList,
+        ...this.formData
+      }
+      console.log(params)
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: '操作成功'
+        });
+        this.$emit('finishDiaOk')
+
+      } else {
+
+        this.$message.error(msg)
+      }
+
+    },
+
+    handleCancle () {
+      this.$emit('finishDiaClose')
+    },
+
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    dataRule () {
+      return {
+        actualStartTime: [
+          { required: true, message: '活动时间不能为空', trigger: 'blur' }
+        ],
+
+
+      }
+    },
+    tableHeight () {
+      return (this.clientHeight - 440)
+
+    },
+
+    ...mapGetters(['clientHeight'])
+
+  },
+  props: {
+
+
+    reward: {
+      type: Number,
+      default: undefined
+    },
+    actStartTime: {
+      type: String,
+      default: ''
+    },
+    actEndTime: {
+      type: String,
+      default: ''
+    },
+  }
+}
+</script>
+
+
+<style lang="scss" scoped >
+@import "@/assets/scss/modules/management/form-main.scss";
+
+.div_table {
+  display: flex;
+  justify-content: flex-start;
+  .m_table {
+    flex: 0 0 1200px;
+    // padding: 20px;
+  }
+}
+.div_form {
+  width: 90%;
+  margin-top: 20px;
+}
+.mgl10 {
+  margin-left: 20px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/communityParty/heart/heartForm.vue b/src/views/modules/communityParty/heart/heartForm.vue
new file mode 100644
index 000000000..8f3c9bfe5
--- /dev/null
+++ b/src/views/modules/communityParty/heart/heartForm.vue
@@ -0,0 +1,1067 @@
+<template>
+  <div>
+    <div class="dialog-h-content scroll-h">
+
+      <el-form ref="ref_form"
+               :inline="true"
+               :model="formData"
+               :rules="dataRule"
+               :disabled="formType === 'detail'"
+               class="div_form ">
+        <div class="form_flex">
+
+          <div class="form_item">
+            <el-form-item label="主办方"
+                          prop="sponsorId"
+                          label-width="150px">
+
+              <el-cascader v-if="formData.richTextFlag||formType==='add'"
+                           class="item_width_6"
+                           ref="myCascader"
+                           v-model="agencyIdArray"
+                           :options="orgOptions"
+                           :props="orgOptionProps"
+                           :show-all-levels="false"
+                           @change="handleChangeAgency"></el-cascader>
+              <el-input v-else
+                        class="item_width_6"
+                        v-model="formData.sponsorName"></el-input>
+            </el-form-item>
+
+            <el-form-item label="活动标题"
+                          prop="title"
+                          label-width="150px"
+                          style="display: block">
+              <el-input class="item_width_6"
+                        type="textarea"
+                        maxlength="50"
+                        show-word-limit
+                        :rows="2"
+                        placeholder="请输入活动标题，不超过50字"
+                        v-model="formData.title"></el-input>
+            </el-form-item>
+
+            <el-form-item label="封面"
+                          prop="coverPic"
+                          label-width="150px"
+                          style="display:block">
+              <el-upload :class="['avatar-uploader', {'hide': hideUploadBtn}] "
+                         ref="uploadPic"
+                         :action="uploadUlr"
+                         list-type="picture-card"
+                         :on-exceed="exceedPic"
+                         :before-upload="beforeAvatarUpload"
+                         :on-remove="removePic"
+                         :file-list="replayImgList"
+                         :on-change="handleEditChange"
+                         :on-success="handleSuccess"
+                         :limit="1">
+                <span class="font-14">选择图片</span>
+
+              </el-upload>
+            </el-form-item>
+
+            <el-form-item label="活动时间"
+                          label-width="150px"
+                          prop="actStartTime">
+              <el-date-picker v-model="formData.actStartTime"
+                              class="list_item_width_3"
+                              type="datetime"
+                              value-format="yyyy-MM-dd HH:mm"
+                              format="yyyy-MM-dd HH:mm"
+                              placeholder="开始时间">
+              </el-date-picker>
+              <span class="data-tag">至</span>
+              <el-date-picker v-model="formData.actEndTime"
+                              class="list_item_width_3 data-tag"
+                              type="datetime"
+                              value-format="yyyy-MM-dd HH:mm"
+                              format="yyyy-MM-dd HH:mm"
+                              placeholder="结束时间">
+              </el-date-picker>
+            </el-form-item>
+
+            <el-form-item label="活动人数"
+                          prop="actQuota"
+                          style="display: block"
+                          label-width="150px">
+              <el-input-number class="item_width_2"
+                               :min="0"
+                               v-model="formData.actQuota"
+                               label="活动人数"></el-input-number>
+            </el-form-item>
+
+            <el-form-item label="活动积分"
+                          prop="reward"
+                          style="display: block"
+                          label-width="150px">
+              <el-input-number class="item_width_2"
+                               :min="0"
+                               v-model="formData.reward"
+                               label="活动积分"></el-input-number>
+            </el-form-item>
+            <el-form-item label="联系人"
+                          prop="sponsorContacts"
+                          label-width="150px"
+                          style="display: block">
+              <el-input class="item_width_6"
+                        maxlength="20"
+                        placeholder="请输入联系人"
+                        v-model="formData.sponsorContacts">
+              </el-input>
+            </el-form-item>
+          </div>
+          <div class="form_item">
+
+            <el-form-item label="联系电话"
+                          prop="sponsorTel"
+                          label-width="150px"
+                          style="display: block">
+              <el-input class="item_width_6"
+                        maxlength="20"
+                        placeholder="请输入联系电话"
+                        v-model="formData.sponsorTel">
+              </el-input>
+            </el-form-item>
+            <el-form-item label="报名仅限志愿者"
+                          prop="volunteerLimit"
+                          label-width="150px"
+                          style="display: block">
+              <el-checkbox v-model="formData.volunteerLimit"></el-checkbox>
+
+            </el-form-item>
+
+            <el-form-item label="报名无需审核"
+                          prop="auditSwitch"
+                          label-width="150px"
+                          style="display: block">
+              <el-checkbox v-model="noauditSwitch"></el-checkbox>
+              <span class="div-tooltip">（选中后报名参加活动人员可以直接审核通过）</span>
+
+            </el-form-item>
+
+            <el-form-item label="报名截止时间"
+                          style="display: block"
+                          prop="signUpEndTime"
+                          label-width="150px">
+              <el-date-picker class="item_width_2"
+                              v-model="formData.signUpEndTime"
+                              value-format="yyyy-MM-dd HH:mm"
+                              format="yyyy-MM-dd HH:mm"
+                              type="datetime"
+                              placeholder="选择时间">
+              </el-date-picker>
+            </el-form-item>
+
+            <el-form-item label="报名条件"
+                          prop="requirement"
+                          label-width="150px"
+                          style="display: block">
+              <el-input class="item_width_6"
+                        type="textarea"
+                        maxlength="200"
+                        show-word-limit
+                        :rows="7"
+                        placeholder="请输入报名条件，不超过200字"
+                        v-model="formData.requirement"></el-input>
+            </el-form-item>
+
+            <el-form-item label="签到时间"
+                          label-width="150px"
+                          prop="signInStartTime">
+              <el-date-picker v-model="formData.signInStartTime"
+                              class="list_item_width_3"
+                              type="datetime"
+                              value-format="yyyy-MM-dd HH:mm"
+                              format="yyyy-MM-dd HH:mm"
+                              placeholder="开始时间">
+              </el-date-picker>
+              <span class="data-tag">至</span>
+              <el-date-picker v-model="formData.signInEndTime"
+                              class="list_item_width_3 data-tag"
+                              type="datetime"
+                              value-format="yyyy-MM-dd HH:mm"
+                              format="yyyy-MM-dd HH:mm"
+                              placeholder="结束时间">
+              </el-date-picker>
+            </el-form-item>
+
+            <el-form-item label="签到有效范围（米）"
+                          prop="signInRadius"
+                          style="display: block"
+                          label-width="150px">
+              <el-input-number class="item_width_2"
+                               :min="0"
+                               v-model="formData.signInRadius"
+                               label="签到有效范围"></el-input-number>
+            </el-form-item>
+          </div>
+        </div>
+        <div class="form_flex">
+          <div class="form_item">
+            <el-form-item label="活动地点"
+                          prop="actAddress"
+                          label-width="150px">
+              <div style="width: 400px">
+                <el-input class="item_width_4"
+                          maxlength="100"
+                          style="width: 330px"
+                          show-word-limit
+                          placeholder="请输入所在地址"
+                          v-model="formData.actAddress">
+                </el-input>
+                <el-button style="margin-left: 10px"
+                           type="default"
+                           size="small"
+                           @click="handleSearchMapAct">查询</el-button>
+                <div id="map_act_id"
+                     class="div_map"></div>
+                <!-- <div style="margin-top: 10px">
+                  <span>经度</span>
+                  <el-input class="item_width_3"
+                            maxlength="50"
+                            placeholder="请输入经度"
+                            v-model="formData.actLatitude">
+                  </el-input>
+                  <span style="margin-left: 20px">纬度</span>
+                  <el-input class="item_width_3"
+                            maxlength="50"
+                            placeholder="请输入纬度"
+                            v-model="formData.actLongitude">
+                  </el-input>
+                </div> -->
+              </div>
+            </el-form-item>
+          </div>
+          <div class="form_item">
+            <el-form-item label="签到地点"
+                          prop="signInAddress"
+                          label-width="150px">
+              <div style="width: 400px">
+                <el-input class="item_width_4"
+                          maxlength="100"
+                          style="width: 330px"
+                          show-word-limit
+                          placeholder="请输入所在地址"
+                          v-model="formData.signInAddress">
+                </el-input>
+                <el-button style="margin-left: 10px"
+                           type="default"
+                           size="small"
+                           @click="handleSearchMapSignin">查询</el-button>
+                <div id="map_signin_id"
+                     class="div_map"></div>
+                <!-- <div style="margin-top: 10px">
+                  <span>经度</span>
+                  <el-input class="item_width_3"
+                            maxlength="50"
+                            placeholder="请输入经度"
+                            v-model="formData.signInLatitude">
+                  </el-input>
+                  <span style="margin-left: 20px">纬度</span>
+                  <el-input class="item_width_3"
+                            maxlength="50"
+                            placeholder="请输入纬度"
+                            v-model="formData.signInLongitude">
+                  </el-input>
+                </div> -->
+              </div>
+            </el-form-item>
+          </div>
+        </div>
+        <el-form-item label="活动详情"
+                      prop="actContentHtml"
+                      label-width="150px"
+                      style="display: block">
+
+          <div v-if="formData.richTextFlag||formType === 'add'">
+            <Tinymce class="tinymce_view"
+                     v-if="formType!='detail'"
+                     v-model="formData.actContentHtml"
+                     :height="250"
+                     style="width:1000px"
+                     :customerId="customerId"
+                     placeholder="在这里输入文字" />
+            <p v-else
+               class="text_p"
+               v-html="formData.actContentHtml"></p>
+          </div>
+          <div class="div_content"
+               v-else>
+            <div v-for="(item,index) in formData.actContent"
+                 :key="index">
+              <div v-if="item.contentType==='text'">{{item.content}}</div>
+              <img v-if="item.contentType==='img'"
+                   class="img_icon"
+                   :src="item.content">
+            </div>
+          </div>
+        </el-form-item>
+
+        <el-form-item v-if="formData.summaryFlag"
+                      label="活动回顾"
+                      prop="summaryContentHtml"
+                      label-width="150px"
+                      style="display: block">
+
+          <div v-if="formData.richTextFlag">
+
+            <p class="text_p"
+               v-html="formData.summaryContentHtml"></p>
+          </div>
+          <div class="div_content"
+               v-else>
+            <div v-for="(item,index) in formData.summaryContent"
+                 :key="index">
+              <div v-if="item.contentType==='text'">{{item.content}}</div>
+              <img v-if="item.contentType==='img'"
+                   class="img_icon"
+                   :src="item.content">
+              <p v-if="item.contentType==='rich_text'"
+                 class="text_p"
+                 v-html="item.content"></p>
+            </div>
+          </div>
+        </el-form-item>
+      </el-form>
+
+    </div>
+    <div class="div_btn">
+      <el-button size="small"
+                 @click="handleCancle">取 消</el-button>
+      <el-button size="small"
+                 v-if="formType != 'detail'"
+                 type="primary"
+                 :disabled="btnDisable"
+                 @click="handleComfirm">确 定</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+import { requestPost } from '@/js/dai/request'
+
+import Tinymce from '@c/tinymce2/index.vue'
+
+let loading // 加载动画
+
+var map_act;
+var search_act;
+var markers_act;
+var infoWindowList_act;
+var geocoder_act; // 新建一个正逆地址解析类
+
+var map_signin;
+var search_signin;
+var markers_signin;
+var infoWindowList_signin;
+var geocoder_signin; // 新建一个正逆地址解析类
+
+export default {
+  data () {
+    let endDisabledDate = (time) => {//这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键
+      let nowData = Date.now()
+      if (this.formData.actStartTime) {
+        let startTime = new Date(this.formData.actStartTime + ':00')
+        return time.getTime() < startTime
+      } else {
+        return ''
+      }
+
+    }
+    let startDisabledDate = (time) => {//这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键
+      let nowData = Date.now()
+      return time.getTime() > nowData
+    }
+    const valActTime = (rule, value, callback) => {
+      if (value === '' || value === null) {
+        callback(new Error('请选择活动开始时间'))
+      } else if (!this.formData.actEndTime) {
+        callback(new Error('请选择活动结束时间'))
+      } else {
+        callback()
+      }
+    }
+    const valSigninTime = (rule, value, callback) => {
+      if (value === '' || value === null) {
+        callback(new Error('请选择签到开始时间'))
+      } else if (!this.formData.signInEndTime) {
+        callback(new Error('请选择签到结束时间'))
+      } else {
+        callback()
+      }
+    }
+    return {
+      formType: 'add', //表单操作类型 add新增，edit编辑，detail详情
+      btnDisable: false,
+      customerId: '',
+      actId: '',
+      valActTime: valActTime,
+      valSigninTime: valSigninTime,
+
+      noauditSwitch: false,
+      formData: {
+        actAddress: "",
+        actContentHtml: "",
+        actContent: {},
+        actDraftId: "",
+        actEndTime: "",
+        actId: "",
+        actLatitude: null,
+        actLongitude: null,
+        actQuota: 0,
+        actStartTime: "",
+        actType: "heart",
+
+        auditSwitch: true,
+        coverPic: "",
+        coverPicAuditStatus: "",
+        customerId: "",
+
+        noticePassedPeople: false,
+        requirement: "",
+        reward: 0,
+
+        signInAddress: "",
+        signInEndTime: "",
+        signInLatitude: null,
+        signInLongitude: null,
+        signInRadius: 200,
+        signInStartTime: "",
+        signUpEndTime: "",
+        sponsorContacts: "",
+        sponsorId: "",
+        sponsorPath: '',
+        sponsorName: "",
+        sponsorTel: "",
+        sponsorType: "",
+        target: "",
+        title: "",
+
+        volunteerLimit: false,
+      },
+
+      orgOptions: [],
+      orgOptionProps: {
+        multiple: false,
+        value: 'gridId',
+        label: 'agencyGridName',
+        children: 'agencyGridList',
+        checkStrictly: true
+      },
+      agencyIdArray: [],
+
+      endPickerOptions: {
+        disabledDate: endDisabledDate
+      },
+      startPickerOptions: {
+        disabledDate: startDisabledDate
+      },
+
+      //图片相关  oss/file/uploadvariedfile
+      uploadUlr: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadvariedfile',
+      //  upload_url: '', // 上传URL
+      upload_name: '', // 图片或视频名称
+      replayImgList: [
+        // {
+        //   id: '1',
+        //   url: 'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20220629/db05fed5cc56417299364ab8362ac9a0.png'
+        // }
+      ],
+      hideUploadBtn: false
+
+    }
+  },
+  components: { Tinymce },
+  mounted () {
+    this.customerId = localStorage.getItem('customerId')
+    this.loadSponsorlist()
+    this.initMap()
+
+
+
+    // this.replayImgList.push()
+  },
+
+  methods: {
+
+    async initForm (type, actId) {
+      this.$refs.ref_form.resetFields();
+
+      this.formType = type
+      if (actId) {
+        this.startLoading()
+        this.actId = actId
+        this.formData.actId = actId
+        await this.loadFormData()
+        this.endLoading()
+
+      } else {
+        this.actId = ''
+        this.formData.actId = ''
+        // this.formData = JSON.parse(JSON.stringify(this.formDataTemp));
+        // this.agencyIdArray = this.formData.sponsorPath.split(',')
+      }
+
+    },
+
+    //获取主办方
+    async loadSponsorlist () {
+      const url = "/heart/work/act/sponsorlist"
+
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        data.agencyGridName = data.agencyName
+        data.gridId = data.agencyId
+        data.level = 'agency'
+        this.orgOptions.push(data)
+
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+
+    handleChangeAgency (val) {
+      let obj = this.$refs["myCascader"].getCheckedNodes()[0].data
+      if (obj) {
+
+        this.formData.sponsorId = obj.gridId
+        this.formData.sponsorName = obj.agencyGridName
+        this.formData.sponsorPath = this.agencyIdArray.join(',')
+
+
+        if (obj.level === 'agency') {
+          this.formData.sponsorType = 'agency'
+        } else {
+          this.formData.sponsorType = 'grid'
+        }
+
+      } else {
+        this.formData.sponsorId = ''
+        this.formData.sponsorPath = ''
+        this.formData.sponsorName = ''
+        this.formData.sponsorType = ''
+      }
+
+    },
+
+    //加载form
+    async loadFormData () {
+      const url = '/heart/work/act/detail'
+
+      let params = {
+        actId: this.actId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.formData = JSON.parse(JSON.stringify(data));
+        if (this.formData.richTextFlag) {
+          this.agencyIdArray = this.formData.sponsorPath.split(',')
+          if (this.formData.actContent && this.formData.actContent.length > 0) {
+            this.formData.actContentHtml = this.formData.actContent[0].content
+          }
+          if (this.formData.summaryContent && this.formData.summaryContent.length > 0) {
+            this.formData.summaryContentHtml = this.formData.summaryContent[0].content
+          }
+        }
+
+        this.noauditSwitch = !this.formData.auditSwitch
+
+
+
+        if (this.formData.coverPic) {
+          let obj = {
+            id: '111',
+            url: this.formData.coverPic
+          }
+
+          this.replayImgList = []
+          this.replayImgList.push(obj)
+
+          this.hideUploadBtn = true
+        }
+
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async handleComfirm () {
+      console.log(this.formData)
+
+      this.btnDisable = true
+      setTimeout(() => {
+        this.btnDisable = false
+      }, 3000)
+
+      this.$refs['ref_form'].validate((valid, messageObj) => {
+
+        if (!valid) {
+
+          app.util.validateRule(messageObj)
+          this.btnDisable = false
+        } else {
+          let errBeforeSubmit = ''
+
+          if (
+            new Date(this.formData.actEndTime).getTime() <=
+            new Date(this.formData.actStartTime).getTime()
+          ) {
+            errBeforeSubmit = "活动预计开始时间应早于活动预计结束时间";
+          } else if (
+            new Date(this.formData.signInEndTime).getTime() <=
+            new Date(this.formData.signInStartTime).getTime()
+          ) {
+            errBeforeSubmit = "签到开始时间应早于签到结束时间";
+          }
+
+          if (errBeforeSubmit) {
+            this.$message({
+              type: 'info',
+              message: errBeforeSubmit
+            })
+            return false
+          }
+
+          this.addHeartAct()
+        }
+
+      })
+
+    },
+    async addHeartAct () {
+      let obj = {
+        contentType: 'rich_text',
+        content: this.dormatHtml(this.formData.actContentHtml)
+      }
+      this.formData.actContent = []
+      this.formData.actContent.push(obj)
+
+      this.formData.customerId = this.customerId
+      this.formData.noticePassedPeople = false
+
+      this.formData.auditSwitch = !this.noauditSwitch
+
+      let url = "/heart/work/act/publishV2"
+      if (this.actId) {
+        this.formData.actId = this.actId
+        url = '/heart/work/act/republishV2'
+      } else {
+        url = "/heart/work/act/publishV2"
+      }
+
+      // let url = "http://yapi.elinkservice.cn/mock/245/gov/org/placepatrolrecord/add"
+
+      this.startLoading()
+      const { data, code, msg } = await requestPost(url, this.formData)
+      this.endLoading()
+      if (code === 0) {
+        this.$message({
+          type: 'success',
+          message: '操作成功'
+        })
+        this.resetData()
+        this.$emit('dialogOk')
+        this.btnDisable = false
+      } else {
+        this.btnDisable = false
+        this.$message.error(msg)
+      }
+
+    },
+
+    dormatHtml (content) {
+      let c = ''
+      if (content.indexOf('DOCTYPE') != -1) {
+        c = content.slice(45, -16);
+      }
+      console.log('content', typeof content)
+      return c || content
+    },
+
+    removePic (file, fileList) {
+
+      this.formData.coverPic = ''
+      this.replayImgList = []
+      this.hideUploadBtn = fileList.length >= 1;
+
+    },
+    // 最多上传3张图，超过时隐藏上传按钮
+    handleEditChange (file, fileList) {
+
+      this.hideUploadBtn = fileList.length >= 1;
+    },
+    exceedPic () {
+      this.$message.warning("只能上传1张封面图")
+
+    },
+    beforeAvatarUpload (file) {
+      const isJPG = file.type === 'image/jpeg';
+      const isLt2M = file.size / 1024 / 1024 < 10;
+
+
+      if (!isLt2M) {
+        this.$message.error('上传图片大小不能超过 10MB!');
+      }
+      return isLt2M;
+    },
+    handleSuccess (response, file, fileList) {
+      this.replayImgList.push(file)
+      this.formData.coverPic = response.data.url
+
+    },
+
+    // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
+    initMap () {
+      // 定义地图中心点坐标
+      var center = new window.TMap.LatLng(36.0722275, 120.38945519);
+      // 定义map变量，调用 TMap.Map() 构造函数创建地图
+      map_act = new window.TMap.Map(document.getElementById("map_act_id"), {
+        center: center, // 设置地图中心点坐标
+        zoom: 17.2, // 设置地图缩放级别
+        pitch: 43.5, // 设置俯仰角
+        rotation: 45, // 设置地图旋转角度
+      });
+      map_signin = new window.TMap.Map(document.getElementById("map_signin_id"), {
+        center: center, // 设置地图中心点坐标
+        zoom: 17.2, // 设置地图缩放级别
+        pitch: 43.5, // 设置俯仰角
+        rotation: 45, // 设置地图旋转角度
+      });
+
+      search_act = new window.TMap.service.Search({ pageSize: 10 });
+      // 新建一个地点搜索类
+      markers_act = new TMap.MultiMarker({
+        map: map_act,
+        geometries: [],
+      });
+      infoWindowList_act = Array(10);
+
+      geocoder_act = new TMap.service.Geocoder(); // 新建一个正逆地址解析类
+
+      search_signin = new window.TMap.service.Search({ pageSize: 10 });
+      // 新建一个地点搜索类
+      markers_signin = new TMap.MultiMarker({
+        map: map_signin,
+        geometries: [],
+      });
+      infoWindowList_signin = Array(10);
+
+      geocoder_signin = new TMap.service.Geocoder(); // 新建一个正逆地址解析类
+
+      // 监听地图平移结束
+      map_act.on("panend", (e) => {
+        this.handleMoveCenterAct(e);
+      });
+      this.handleMoveCenterAct();
+
+      // 监听地图平移结束
+      map_signin.on("panend", (e) => {
+        this.handleMoveCenterSignin(e);
+      });
+      this.handleMoveCenterSignin();
+    },
+
+    setMarkerAct (lat, lng) {
+      markers_act.setGeometries([]);
+      markers_act.add([
+        {
+          id: "4",
+          styleId: "marker",
+          position: new TMap.LatLng(lat, lng),
+          properties: {
+            title: "marker4",
+          },
+        },
+      ]);
+    },
+
+    handleSearchMapAct () {
+      infoWindowList_act.forEach((infoWindow) => {
+        infoWindow.close();
+      });
+      infoWindowList_act.length = 0;
+      markers_act.setGeometries([]);
+      // 在地图显示范围内以给定的关键字搜索地点
+      search_act
+        .searchRectangle({
+          keyword: this.formData.actAddress,
+          bounds: map_act.getBounds(),
+        })
+        .then((result) => {
+          let { data } = result;
+          if (Array.isArray(data) && data.length > 0) {
+            const {
+              location: { lat, lng },
+            } = data[0];
+            map_act.setCenter(new TMap.LatLng(lat, lng));
+            this.setMarkerAct(lat, lng);
+            this.formData.actLatitude = lat;
+            this.formData.actLongitude = lng;
+          } else {
+            this.$message.error("未检索到相关位置坐标");
+          }
+        });
+    },
+
+    handleMoveCenterAct (e) {
+      //修改地图中心点
+      const center = map_act.getCenter();
+      const lat = center.getLat();
+      const lng = center.getLng();
+      this.formData.actLatitude = lat;
+      this.formData.actLongitude = lng;
+      this.setMarkerAct(lat, lng);
+
+      if (e && e.originalEvent) {
+        geocoder_act
+          .getAddress({ location: new TMap.LatLng(lat, lng) }) // 将给定的坐标位置转换为地址
+          .then((result) => {
+            this.formData.actAddress = result.result.address;
+          });
+      }
+    },
+    setMarkerSignin (lat, lng) {
+      markers_signin.setGeometries([]);
+      markers_signin.add([
+        {
+          id: "4",
+          styleId: "marker",
+          position: new TMap.LatLng(lat, lng),
+          properties: {
+            title: "marker4",
+          },
+        },
+      ]);
+    },
+
+    handleSearchMapSignin () {
+      infoWindowList_signin.forEach((infoWindow) => {
+        infoWindow.close();
+      });
+      infoWindowList_signin.length = 0;
+      markers_signin.setGeometries([]);
+      // 在地图显示范围内以给定的关键字搜索地点
+      search_signin
+        .searchRectangle({
+          keyword: this.formData.signInAddress,
+          bounds: map_signin.getBounds(),
+        })
+        .then((result) => {
+          let { data } = result;
+          if (Array.isArray(data) && data.length > 0) {
+            const {
+              location: { lat, lng },
+            } = data[0];
+            map_signin.setCenter(new TMap.LatLng(lat, lng));
+            this.setMarkerSignin(lat, lng);
+            this.formData.signInLatitude = lat;
+            this.formData.signInLongitude = lng;
+          } else {
+            this.$message.error("未检索到相关位置坐标");
+          }
+        });
+    },
+
+    handleMoveCenterSignin (e) {
+      //修改地图中心点
+      const center = map_signin.getCenter();
+      const lat = center.getLat();
+      const lng = center.getLng();
+      this.formData.signInLatitude = lat;
+      this.formData.signInLongitude = lng;
+      this.setMarkerSignin(lat, lng);
+
+      if (e && e.originalEvent) {
+        geocoder_signin
+          .getAddress({ location: new TMap.LatLng(lat, lng) }) // 将给定的坐标位置转换为地址
+          .then((result) => {
+            this.formData.signInAddress = result.result.address;
+          });
+      }
+    },
+
+    handleCancle () {
+
+      this.resetData()
+      this.$emit('dialogCancle')
+
+    },
+
+    resetData () {
+      this.actId = ''
+      this.replayImgList = []
+      this.agencyIdArray = []
+      this.hideUploadBtn = false
+      this.noauditSwitch = false
+      this.formData = {
+        actAddress: "",
+        actContentHtml: "",
+        actContent: {},
+        actDraftId: "",
+        actEndTime: "",
+        actId: "",
+        actLatitude: null,
+        actLongitude: null,
+        actQuota: 0,
+        actStartTime: "",
+        actType: "heart",
+
+        auditSwitch: true,
+        coverPic: "",
+        coverPicAuditStatus: "",
+        customerId: "",
+
+        noticePassedPeople: false,
+        requirement: "",
+        reward: 0,
+
+        signInAddress: "",
+        signInEndTime: "",
+        signInLatitude: null,
+        signInLongitude: null,
+        signInRadius: 200,
+        signInStartTime: "",
+        signUpEndTime: "",
+        sponsorContacts: "",
+        sponsorId: "",
+        sponsorPath: '',
+        sponsorName: "",
+        sponsorTel: "",
+        sponsorType: "",
+        target: "",
+        title: "",
+
+        volunteerLimit: false,
+      }
+    },
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    dataRule () {
+      return {
+
+        sponsorId: [
+          { required: true, message: '主办方不能为空', trigger: 'change' }
+        ],
+        title: [
+          { required: true, message: '活动标题不能为空', trigger: 'change' },
+        ],
+
+        coverPic: [
+          { required: true, message: '封面图不能为空', trigger: 'change' }
+        ],
+
+        actContentHtml: [
+          { required: true, message: '活动详情不能为空', trigger: 'change' }
+        ],
+        actAddress: [
+          { required: true, message: '活动地点不能为空', trigger: 'change' }
+        ],
+        actStartTime: [
+          { required: true, validator: this.valActTime, message: '活动时间不能为空', trigger: 'change' }
+        ],
+        actQuota: [
+          { required: true, message: '活动人数不能为空', trigger: 'change' }
+        ],
+        reward: [
+          { required: true, message: '活动积分不能为空', trigger: 'change' }
+        ],
+        signUpEndTime: [
+          { required: true, message: '报名截止时间不能为空', trigger: 'change' }
+        ],
+        signInStartTime: [
+          { required: true, validator: this.valSigninTime, message: '签到时间不能为空', trigger: 'change' }
+        ],
+        signInAddress: [
+          { required: true, message: '签到地点不能为空', trigger: 'change' }
+        ],
+        signInRadius: [
+          { required: true, message: '签到有效范围不能为空', trigger: 'change' }
+        ],
+        sponsorContacts: [
+          { required: true, message: '联系人不能为空', trigger: 'change' }
+        ],
+        sponsorTel: [
+          { required: true, message: '联系电话不能为空', trigger: 'change' }
+        ],
+      }
+    },
+
+  },
+  props: {
+
+
+  }
+}
+</script>
+
+<style lang="scss" scoped >
+@import "@/assets/scss/modules/management/form-main.scss";
+
+.avatar-uploader {
+  margin: 0 0 0 20px;
+}
+.div-tooltip {
+  margin-left: 10px;
+  color: red;
+}
+
+.text_p {
+  width: 1000px;
+  margin: 0 0;
+  border: 3px;
+
+  p {
+    margin: 0;
+    padding: 0;
+    -webkit-margin-start: 0;
+    -webkit-margin-end: 0;
+  }
+}
+.div_content {
+  width: 1000px;
+}
+.img_icon {
+  width: 200px;
+  height: 200px;
+}
+</style>
+
+<style lang="scss">
+.el-dialog__body {
+  padding: 0 10px 20px !important;
+}
+
+.hide {
+  .el-upload--picture-card {
+    display: none !important;
+  }
+}
+</style>
+
diff --git a/src/views/modules/communityParty/heart/heartList.vue b/src/views/modules/communityParty/heart/heartList.vue
new file mode 100644
index 000000000..3a99cd0c7
--- /dev/null
+++ b/src/views/modules/communityParty/heart/heartList.vue
@@ -0,0 +1,680 @@
+<template>
+  <div class="div_main">
+    <div class="div_search">
+      <el-form :inline="true"
+               :model="formData"
+               ref="ref_searchform"
+               :label-width="'100px'">
+
+        <el-form-item label="活动标题"
+                      prop="title">
+          <el-input v-model="formData.title"
+                    size="small"
+                    class="item_width_3"
+                    clearable
+                    placeholder="请输入活动标题">
+          </el-input>
+
+        </el-form-item>
+
+        <el-form-item label="活动时间"
+                      prop="actStartTime">
+          <el-date-picker v-model="formData.actStartTime"
+                          :picker-options="startPickerOptions"
+                          class="item_width_2"
+                          size="small"
+                          type="datetime"
+                          value-format="yyyy-MM-dd HH:mm:ss"
+                          format="yyyy-MM-dd"
+                          placeholder="开始时间">
+          </el-date-picker>
+          <span class="data-tag">至</span>
+          <el-date-picker v-model="formData.actEndTime"
+                          :picker-options="endPickerOptions"
+                          class="item_width_2 data-tag"
+                          size="small"
+                          type="datetime"
+                          value-format="yyyy-MM-dd HH:mm:ss"
+                          format="yyyy-MM-dd"
+                          placeholder="结束时间">
+          </el-date-picker>
+        </el-form-item>
+
+        <el-form-item label="状态"
+                      prop="status">
+          <el-select class="item_width_3"
+                     v-model="formData.status"
+                     size="small"
+                     placeholder="请选择"
+                     clearable>
+            <el-option v-for="item in statusList"
+                       :key="item.value"
+                       :label="item.label"
+                       :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-button style="margin-left:30px"
+                   size="small"
+                   class="diy-button--search"
+                   @click="handleSearch">查询</el-button>
+        <el-button style="margin-left:10px"
+                   size="small"
+                   class="diy-button--reset"
+                   @click="resetSearch">重置</el-button>
+
+      </el-form>
+    </div>
+    <div class="div_table">
+      <el-button class="diy-button--add"
+                 size="small"
+                 @click="handleAdd">新增</el-button>
+
+      <el-table class="table"
+                :data="tableData"
+                border
+                :height="tableHeight"
+                v-loading="tableLoading"
+                :header-cell-style="{background:'#2195FE',color:'#FFFFFF'}"
+                style="width: 100%">
+        <el-table-column label="序号"
+                         header-align="center"
+                         align="center"
+                         type="index"
+                         width="50"></el-table-column>
+
+        <el-table-column prop="title"
+                         header-align="center"
+                         align="center"
+                         label="活动标题"
+                         :show-overflow-tooltip="true"
+                         min-width="180">
+        </el-table-column>
+        <el-table-column prop="actAddress"
+                         header-align="center"
+                         align="center"
+                         :show-overflow-tooltip="true"
+                         label="活动地址"
+                         min-width="180">
+        </el-table-column>
+
+        <el-table-column prop="actStartTime"
+                         header-align="center"
+                         align="center"
+                         :show-overflow-tooltip="true"
+                         label="活动时间"
+                         min-width="180">
+          <template slot-scope="scope">
+            <span>{{scope.row.actStartTime+'至'+scope.row.actEndTime}}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column prop="signUpEndTime"
+                         header-align="center"
+                         align="center"
+                         :show-overflow-tooltip="true"
+                         label="报名截止时间"
+                         min-width="110">
+        </el-table-column>
+        <el-table-column prop="statusShow"
+                         header-align="center"
+                         align="center"
+                         label="状态"
+                         :show-overflow-tooltip="true"
+                         min-width="100">
+        </el-table-column>
+        <el-table-column prop="richTextFlagShow"
+                         header-align="center"
+                         align="center"
+                         label="来源"
+                         :show-overflow-tooltip="true"
+                         width="100">
+        </el-table-column>
+
+        <el-table-column label="操作"
+                         fixed="right"
+                         width="220"
+                         header-align="center"
+                         align="center"
+                         class="operate">
+          <template slot-scope="scope">
+            <el-button type="text"
+                       class="div-table-button--detail"
+                       size="small"
+                       @click="handleDetail(scope.row)">查看</el-button>
+
+            <el-button v-if="scope.row.isMyPublish&&(scope.row.status==='signing_up' || scope.row.status==='end_sign_up' || scope.row.status==='enough')&&scope.row.richTextFlag"
+                       type="text"
+                       class="div-table-button--edit"
+                       size="small"
+                       @click="handleEdit(scope.row)">修改</el-button>
+
+            <el-button v-if="scope.row.isMyPublish&&(scope.row.status==='signing_up' || scope.row.status==='end_sign_up' || scope.row.status==='enough')&& scope.row.auditSwitch"
+                       type="text"
+                       class="div-table-button--edit"
+                       size="small"
+                       @click="handleAudit(scope.row)">报名审核</el-button>
+
+            <el-button v-if="scope.row.isMyPublish&&((scope.row.status==='in_progress' || scope.row.status==='finished')||!scope.row.auditSwitch)"
+                       type="text"
+                       class="div-table-button--edit"
+                       size="small"
+                       @click="handlePerson(scope.row)">查看人员</el-button>
+
+            <el-button v-if="scope.row.isMyPublish&&(scope.row.status==='signing_up' || scope.row.status==='end_sign_up' || scope.row.status==='enough')"
+                       type="text"
+                       class="div-table-button--delete"
+                       size="small"
+                       @click="handleCancleAct(scope.row)">取消活动</el-button>
+
+            <el-button v-if="scope.row.isMyPublish&&scope.row.status==='in_progress'"
+                       type="text"
+                       class="div-table-button--delete"
+                       size="small"
+                       @click="handleFinishAct(scope.row)">结束活动</el-button>
+
+            <el-button v-if="scope.row.isMyPublish&&(scope.row.status==='finished' && !scope.row.summaryFlag)"
+                       type="text"
+                       class="div-table-button--edit"
+                       size="small"
+                       @click="handleReview(scope.row)">添加回顾</el-button>
+
+            <!-- <el-popover popper-class="btn-popper"
+                        placement="bottom"
+                        style="margin-left:10px"
+                        width="20"
+                        trigger="click">
+              <div class="table-more-btn">
+                <el-button type="text"
+                           class="div-table-button--edit"
+                           size="small"
+                           @click="handleReview(scope.row)">报名审核</el-button>
+              </div>
+
+              <div class="table-more-btn">
+                <el-button type="text"
+                           class="div-table-button--delete"
+                           size="small"
+                           @click="handleDelete(scope.row)">删除</el-button>
+              </div>
+
+              <el-button type="text"
+                         size="small"
+                         class="div-table-button--more"
+                         slot="reference">更多<i class="el-icon-caret-bottom"></i></el-button>
+            </el-popover> -->
+
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination @size-change="handleSizeChange"
+                       @current-change="handleCurrentChange"
+                       :current-page.sync="pageNo"
+                       :page-sizes="[20, 50, 100, 200]"
+                       :page-size="pageSize"
+                       layout="sizes, prev, pager, next, total"
+                       :total="total">
+        </el-pagination>
+      </div>
+    </div>
+
+    <!-- 修改弹出框 -->
+    <el-dialog :visible.sync="formShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="formTitle"
+               width="1350px"
+               top="5vh"
+               class="dialog-h"
+               @closed="diaClose">
+      <heart-form ref="ref_form"
+                  @dialogCancle="addFormCancle"
+                  @dialogOk="addFormOk"></heart-form>
+    </el-dialog>
+
+    <!-- 活动取消原因 -->
+
+    <el-dialog :visible.sync="cancleShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="'活动取消原因'"
+               width="550px"
+               top="5vh"
+               class="dialog-h"
+               @closed="cancleDiaClose">
+      <div style="padding:30px">
+
+        <el-input class="item_width_5"
+                  type="textarea"
+                  maxlength="100"
+                  show-word-limit
+                  :rows="4"
+                  placeholder="请输入取消理由"
+                  v-model="cancelReason"></el-input>
+        <div style="display:flex;  justify-content: center;margin-top:20px">
+          <el-button style="margin-left:30px"
+                     size="small"
+                     class="diy-button--search"
+                     @click="cancleDiaClose">取消</el-button>
+          <el-button style="margin-left:10px"
+                     size="small"
+                     class="diy-button--reset"
+                     @click="cancleAct">确定</el-button>
+        </div>
+      </div>
+
+    </el-dialog>
+
+    <!-- 报名审核弹出框 -->
+    <el-dialog :visible.sync="auditShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="'报名审核'"
+               width="90%"
+               top="5vh"
+               class="dialog-h"
+               @closed="auditDiaClose">
+      <heart-audit ref="ref_audit"></heart-audit>
+    </el-dialog>
+
+    <!-- 查看人员弹出框 -->
+    <el-dialog :visible.sync="personShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="'查看人员'"
+               width="90%"
+               top="5vh"
+               class="dialog-h"
+               @closed="personDiaClose">
+      <heart-person ref="ref_person"
+                    @personDiaClose="personDiaClose"
+                    :status="status"></heart-person>
+    </el-dialog>
+
+    <!-- 活动结束弹出框 -->
+    <el-dialog :visible.sync="finishShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="'活动结束'"
+               width="1250px"
+               top="5vh"
+               class="dialog-h"
+               @closed="finishDiaClose">
+      <heart-finish ref="ref_finish"
+                    :actStartTime="actStartTime"
+                    :actEndTime="actEndTime"
+                    :reward="reward"
+                    @finishDiaClose="finishDiaClose"
+                    @finishDiaOk="finishDiaOk"></heart-finish>
+    </el-dialog>
+
+    <!-- 活动回顾弹出框 -->
+    <el-dialog :visible.sync="reviewShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="'活动回顾'"
+               width="1150px"
+               top="5vh"
+               class="dialog-h"
+               @closed="reviewDiaClose">
+      <heart-review ref="ref_review"
+                    @reviewDiaClose="reviewDiaClose"
+                    @reviewDiaOk="reviewDiaOk"></heart-review>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+
+import heartForm from './heartForm'
+import heartAudit from './heartAudit'
+import heartPerson from './heartPerson'
+import heartFinish from './heartFinish'
+import heartReview from './heartReview'
+
+import { requestPost } from "@/js/dai/request";
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+
+let loading // 加载动画
+export default {
+  data () {
+    let endDisabledDate = (time) => {//这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键
+      let nowData = Date.now()
+      if (this.formData.actactStartTime) {
+        let actStartTime = new Date(this.formData.actactStartTime + ':00')
+        return time.getTime() < actStartTime || time.getTime() === actStartTime
+      } else {
+        return time.getTime() > nowData
+      }
+
+    }
+    let startDisabledDate = (time) => {//这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键
+      let nowData = Date.now()
+      return time.getTime() > nowData
+    }
+    return {
+      loading: false,
+      total: 0,
+      pageSize: 20,
+      pageNo: 0,
+      tableLoading: false,
+      endPickerOptions: {
+        disabledDate: endDisabledDate
+      },
+      startPickerOptions: {
+        disabledDate: startDisabledDate
+      },
+
+      agencyId: '',
+
+      statusList: [
+        {
+          value: 'published',
+          label: '进行中'
+        },
+        {
+          value: 'finished',
+          label: '已结束'
+        },
+        {
+          value: 'canceled',
+          label: '已取消'
+        }
+      ],//是否合格list
+
+      formData: {
+        title: '',//活动标题
+        actStartTime: '',
+        actEndTime: '',
+        status: ''
+      },
+
+      tableData: [],
+
+      //form相关
+      formShow: false,
+      formTitle: '新增爱心互助',
+      actId: '',
+      actStartTime: '',
+      actEndTime: '',
+      reward: null,
+      status: '',
+
+      cancelReason: '',
+      cancleShow: false,//活动取消
+      auditShow: false,//报名审核
+      personShow: false,//查看人员
+      finishShow: false,//活动结束
+      reviewShow: false,//添加回顾
+
+    }
+  },
+  components: {
+    heartForm, heartAudit, heartPerson, heartFinish, heartReview
+  },
+  async created () {
+
+  },
+  async mounted () {
+
+    this.customerId = localStorage.getItem('customerId')
+    const { user } = this.$store.state
+    this.agencyId = user.agencyId
+
+    await this.loadTable()
+  },
+
+  methods: {
+    handleSearch () {
+      this.loadTable()
+    },
+
+    async loadTable () {
+      this.tableLoading = true
+
+      const url = "/heart/work/act/pagelist"
+      // const url = "http://yapi.elinkservice.cn/mock/245/heart/work/act/pagelist"
+      let params = {
+
+        pageSize: this.pageSize,
+        pageNo: this.pageNo,
+        ...this.formData
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.total = data.total
+        this.tableData = data.list
+        if (this.tableData && this.tableData.length > 0) {
+          this.tableData.forEach(element => {
+            if (element.richTextFlag) {
+              element.richTextFlagShow = '管理平台'
+            } else {
+              element.richTextFlagShow = '小程序'
+            }
+            //活动状态：报名中：signing_up；截止报名: end_sign_up; 已开始： in_progress; 已报满： enough；已取消：canceled; 已结束：finished
+            if (element.status === 'signing_up') {
+              element.statusShow = '报名中'
+            } else if (element.status === 'end_sign_up') {
+              element.statusShow = '截止报名'
+            } else if (element.status === 'in_progress') {
+              element.statusShow = '已开始'
+            } else if (element.status === 'enough') {
+              element.statusShow = '已报满'
+            } else if (element.status === 'canceled') {
+              element.statusShow = '已取消'
+            } else if (element.status === 'finished') {
+              element.statusShow = '已结束'
+            } else {
+              element.statusShow = ''
+            }
+          });
+        }
+
+      } else {
+        this.$message.error(msg)
+      }
+      this.tableLoading = false
+    },
+
+    diaClose () {
+      this.$refs.ref_form.resetData()
+      this.formShow = false
+    },
+
+    reviewDiaClose () {
+      this.reviewShow = false
+    },
+
+
+    handleDetail (row) {
+      this.formTitle = '详情'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('detail', row.actId)
+      })
+    },
+
+    handleAdd () {
+      this.formTitle = '新增'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('add', null)
+      })
+    },
+
+    handleEdit (row) {
+      this.formTitle = '编辑'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('edit', row.actId)
+      })
+    },
+
+    handleAudit (row) {
+      this.auditShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_audit.initTable(row.actId)
+      })
+    },
+    handlePerson (row) {
+      this.status = row.status
+      this.personShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_person.initTable(row.actId)
+      })
+    },
+    handleReview (row) {
+      this.reviewShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_review.initForm(row.actId)
+      })
+
+    },
+    handleFinishAct (row) {
+      this.finishShow = true
+      this.actStartTime = row.actStartTime
+      this.actEndTime = row.actEndTime
+      this.reward = row.reward
+
+      this.$nextTick(() => {
+        this.$refs.ref_finish.initTable(row.actId)
+      })
+    },
+
+    addFormCancle () {
+      this.formShow = false
+    },
+
+    addFormOk () {
+      this.formShow = false
+      this.loadTable()
+    },
+
+    async handleCancleAct (row) {
+      this.cancleShow = true
+      this.actId = row.actId
+    },
+
+    async cancleAct () {
+      const url = "/heart/work/act/cancelact"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/placepatrolrecord/del"
+
+      let params = {
+        actId: this.actId,
+        cancelReason: this.cancelReason,
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.cancleShow = false
+        this.$message({
+          type: "success",
+          message: "取消成功"
+        });
+
+        this.loadTable()
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    auditDiaClose () {
+
+      this.auditShow = false//
+    },
+    personDiaClose () {
+
+      this.personShow = false//
+    },
+    personDiaClose () {
+
+      this.personShow = false//
+    },
+    finishDiaClose () {
+
+      this.finishShow = false//
+    },
+    finishDiaOk () {
+
+      this.finishShow = false//
+      this.loadTable()
+    },
+    reviewDiaOk () {
+
+      this.reviewShow = false//
+      this.loadTable()
+    },
+    cancleDiaClose () {
+      this.cancelReason = ''
+      this.cancleShow = false//活动取消
+    },
+
+
+    //重置搜索条件
+    resetSearch () {
+      this.formData = {
+        title: '',//活动标题
+
+        actStartTime: '',
+        actEndTime: '',
+        status: ''
+      }
+      this.pageSize = 20
+      this.pageNo = 0
+      this.loadTable()
+    },
+
+
+    handleSizeChange (val) {
+      this.pageSize = val
+      this.pageNo = 1
+      this.loadTable()
+    },
+    handleCurrentChange (val) {
+      this.pageNo = val
+      this.loadTable()
+    },
+
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    tableHeight () {
+
+      return this.$store.state.inIframe ? this.clientHeight - 340 + this.iframeHeight : this.clientHeight - 340
+
+    },
+
+    ...mapGetters(['clientHeight', 'iframeHeight'])
+  },
+  watch: {
+
+  },
+  props: {
+
+  }
+}
+</script>
+<style lang="scss" scoped >
+@import "@/assets/scss/modules/management/list-main.scss";
+</style>
diff --git a/src/views/modules/communityParty/heart/heartPerson.vue b/src/views/modules/communityParty/heart/heartPerson.vue
new file mode 100644
index 000000000..68cc71308
--- /dev/null
+++ b/src/views/modules/communityParty/heart/heartPerson.vue
@@ -0,0 +1,291 @@
+<template>
+  <div class="dialog-h-content scroll-h">
+    <div class="div_table">
+
+      <el-table class="table"
+                :data="tableData"
+                border
+                :height="tableHeight"
+                v-loading="tableLoading"
+                :header-cell-style="{background:'#2195FE',color:'#FFFFFF'}"
+                style="width: 100%">
+
+        <el-table-column label="序号"
+                         header-align="center"
+                         align="center"
+                         type="index"
+                         width="50">
+        </el-table-column>
+
+        <el-table-column prop="realName"
+                         header-align="center"
+                         align="center"
+                         label="姓名"
+                         :show-overflow-tooltip="true"
+                         min-width="100">
+
+        </el-table-column>
+        <el-table-column prop="mobile"
+                         header-align="center"
+                         align="center"
+                         label="手机"
+                         width="120">
+
+        </el-table-column>
+
+        <el-table-column prop="idNum"
+                         header-align="center"
+                         align="center"
+                         label="身份证"
+                         width="180">
+
+        </el-table-column>
+        <el-table-column prop="nickName"
+                         header-align="center"
+                         align="center"
+                         label="昵称"
+                         :show-overflow-tooltip="true"
+                         min-width="100">
+
+        </el-table-column>
+        <el-table-column prop="signUpActNum"
+                         header-align="center"
+                         align="center"
+                         label="报名活动个数"
+                         width="120">
+
+        </el-table-column>
+        <el-table-column prop="signInActNum"
+                         header-align="center"
+                         align="center"
+                         label="实际参加活动个数"
+                         width="140">
+
+        </el-table-column>
+        <el-table-column prop="obtainPointsActNum"
+                         header-align="center"
+                         align="center"
+                         label="获得积分活动个数"
+                         width="140">
+
+        </el-table-column>
+        <el-table-column prop="signUpTime"
+                         header-align="center"
+                         align="center"
+                         label="报名时间"
+                         width="180">
+
+        </el-table-column>
+
+        <el-table-column v-if="status==='finished'"
+                         prop="signInFlagShow"
+                         header-align="center"
+                         align="center"
+                         label="是否签到"
+                         width="90">
+
+        </el-table-column>
+        <el-table-column v-if="status==='finished'"
+                         prop="rewardFlagShow"
+                         header-align="center"
+                         align="center"
+                         label="是否给分"
+                         width="90">
+
+        </el-table-column>
+        <el-table-column prop="statusShow"
+                         header-align="center"
+                         align="center"
+                         label="状态"
+                         width="90">
+
+        </el-table-column>
+
+      </el-table>
+
+    </div>
+    <div class="div_btn">
+      <el-button size="small"
+                 @click="handleCancle">关 闭</el-button>
+
+    </div>
+
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+import { requestPost } from '@/js/dai/request'
+
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      tableLoading: false,
+      actId: '',
+      tableData: [],
+      actUserRelationIdList: [],
+
+      cancelReason: '',
+      cancleShow: false,//拒绝审核
+
+    }
+  },
+  components: {},
+  mounted () {
+
+  },
+
+  methods: {
+
+    async initTable (actId) {
+      this.actId = actId
+      await this.loadTable()
+
+    },
+
+    checkSelect (row, index) {
+      //待审核：auditing；已通过：passed；已拒绝：refused；已取消：canceled
+      let isChecked = false;
+      if (row.status === 'auditing') { // 判断里面是否存在某个参数
+        isChecked = true
+      } else {
+        isChecked = false
+      }
+      return isChecked
+    },
+
+    selectionChange (selection) {
+      this.actUserRelationIdList = []
+      this.actUserRelationIdList = selection
+
+    },
+
+    //加载form
+    async loadTable () {
+      this.tableLoading = true
+      const url = '/heart/work/actuser/userlist'
+      // const url = 'http://yapi.elinkservice.cn/mock/245/heart/work/actuser/userlist'
+      let params = {
+        actId: this.actId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+      this.tableLoading = false
+      if (code === 0) {
+
+        if (data.list && data.list.length > 0) {
+          data.list.forEach(item => {
+            //待审核：auditing；已通过：passed；已拒绝：refused；已取消：canceled
+            if (item.status === 'auditing') {
+              item.statusShow = '待审核'
+            } else if (item.status === 'passed') {
+              item.statusShow = '已通过'
+            } else if (item.status === 'refused') {
+              item.statusShow = '已拒绝'
+            } else if (item.status === 'canceled') {
+              item.statusShow = '已取消'
+            } else {
+              item.statusShow = ''
+            }
+
+            if (item.rewardFlag === 'agree') {
+              item.rewardFlagShow = '已发放'
+            } else {
+              item.rewardFlagShow = '未发放'
+            }
+
+            if (item.signInFlag === 'signed_in') {
+              item.signInFlagShow = '是'
+            } else {
+              item.signInFlagShow = '否'
+            }
+
+          });
+
+          this.tableData = [...data.list]
+        } else {
+          this.tableData = []
+        }
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleReject () {
+      // if (this.actUserRelationIdList.length === 0) {
+      //   this.$message({
+      //     type: "info",
+      //     message: "请选择人员"
+      //   });
+      //   return false
+      // }
+      this.cancleShow = true
+
+    },
+    handleCancle () {
+      this.$emit('personDiaClose')
+    },
+
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    tableHeight () {
+
+      return (this.clientHeight - 360)
+
+    },
+
+    ...mapGetters(['clientHeight'])
+
+  },
+  props: {
+
+
+    status: {
+      type: String,
+      default: ''
+    },
+
+  }
+}
+</script>
+
+
+<style lang="scss" scoped >
+@import "@/assets/scss/buttonstyle.scss";
+.item_width_1 {
+  width: 250px;
+}
+.item_width_2 {
+  width: 100px;
+}
+.div_table {
+  margin-top: 10px;
+
+  .table {
+    margin-top: 10px;
+  }
+}
+.div_btn {
+  margin-top: 10px;
+  display: flex;
+  justify-content: center;
+}
+</style>
diff --git a/src/views/modules/communityParty/heart/heartReview.vue b/src/views/modules/communityParty/heart/heartReview.vue
new file mode 100644
index 000000000..fa0ab0752
--- /dev/null
+++ b/src/views/modules/communityParty/heart/heartReview.vue
@@ -0,0 +1,214 @@
+<template>
+  <div>
+    <div class="dialog-h-content scroll-h">
+
+      <div class="div_tinymce">
+        <Tinymce class="tinymce_view"
+                 v-model="actContent"
+                 :height="450"
+                 style="width:1000px"
+                 :customerId="customerId"
+                 placeholder="在这里输入文字" />
+
+      </div>
+
+    </div>
+    <div class="div_btn">
+      <el-button size="small"
+                 @click="handleCancle">取 消</el-button>
+      <el-button size="small"
+                 type="primary"
+                 :disabled="btnDisable"
+                 @click="handleComfirm">确 定</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+import { requestPost } from '@/js/dai/request'
+
+import Tinymce from '@c/tinymce2/index.vue'
+
+let loading // 加载动画
+
+
+export default {
+  data () {
+
+    return {
+      formType: 'add', //表单操作类型 add新增，edit编辑，detail详情
+      btnDisable: false,
+      customerId: '',
+      actId: '',
+      actSummary: [],
+      actContent: '',
+
+
+
+    }
+  },
+  components: { Tinymce },
+  mounted () {
+    this.customerId = localStorage.getItem('customerId')
+
+  },
+
+  methods: {
+
+    async initForm (actId) {
+
+      this.startLoading()
+
+
+      if (actId) {
+        this.actId = actId
+
+      }
+      this.endLoading()
+    },
+
+
+
+    async handleComfirm () {
+      if (!this.actContent) {
+        this.$message({
+          type: 'info',
+          message: '活动回顾不能为空'
+        })
+        return false
+      }
+      this.actSummary = [{
+        contentType: 'rich_text',
+        content: this.dormatHtml(this.actContent)
+      }]
+
+      let url = "/heart/work/act/summaryact"
+      // let url = "http://yapi.elinkservice.cn/mock/245/gov/org/placepatrolrecord/add"
+      let params = {
+        actId: this.actId,
+        actSummary: this.actSummary
+      }
+
+      console.log(params)
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.$message({
+          type: 'success',
+          message: '操作成功'
+        })
+        this.actContent = ''
+        this.$emit('reviewDiaOk')
+
+      } else {
+
+        this.$message.error(msg)
+      }
+
+    },
+
+    dormatHtml (content) {
+      let c = ''
+      if (content.indexOf('DOCTYPE') != -1) {
+        c = content.slice(45, -16);
+      }
+      console.log('content', typeof content)
+      return c || content
+    },
+
+
+
+
+    handleCancle () {
+      this.$emit('reviewDiaClose')
+
+    },
+
+    resetData () {
+      this.formData = {
+        actContent: '',
+      }
+    },
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    dataRule () {
+      return {
+
+        gridId: [
+          { required: true, message: '场所网格不能为空', trigger: 'blur' }
+        ],
+        ninePlaceVal: [
+          { required: true, message: '场所类型不能为空', trigger: 'blur' },
+        ],
+        placeOrgId: [
+          { required: true, message: '场所名称不能为空', trigger: 'blur' }
+        ],
+        placePatrolTeamId: [
+          { required: true, message: '分队不能为空', trigger: 'blur' }
+        ],
+
+        inspectorArray: [
+          { required: true, message: '巡检人员不能为空', trigger: 'blur' }
+        ],
+        firstTime: [
+          { required: true, message: '首次巡查时间不能为空', trigger: 'blur' }
+        ],
+        detailed: [
+          { required: true, message: '隐患明细不能为空', trigger: 'blur' }
+        ],
+        firstResult: [
+          { required: true, message: '首次巡查结果不能为空', trigger: 'blur' }
+        ]
+      }
+    },
+
+  },
+  props: {
+
+
+  }
+}
+</script>
+
+<style lang="scss" scoped >
+@import "@/assets/scss/modules/management/form-main.scss";
+
+.div_tinymce {
+  display: flex;
+  justify-content: center;
+}
+.avatar-uploader {
+  margin: 0 0 0 20px;
+}
+</style>
+
+<style lang="scss">
+.el-dialog__body {
+  padding: 0 10px 20px !important;
+}
+
+.hide {
+  .el-upload--picture-card {
+    display: none !important;
+  }
+}
+</style>
+
diff --git a/src/views/modules/cpts/base/cpts/edit.vue b/src/views/modules/cpts/base/cpts/edit.vue
index 4738fa870..f68dc9f78 100644
--- a/src/views/modules/cpts/base/cpts/edit.vue
+++ b/src/views/modules/cpts/base/cpts/edit.vue
@@ -12,14 +12,27 @@
       >
         <div class="list">
           <el-form-item
-            v-for="item in editParams1"
-            label-width="150px"
+            v-for="item in editParams"
+            class="item"
+            label-width="140px"
             style="display: block"
             :key="'edit' + item.keyName"
             :label="item.field"
             :prop="item.keyName"
             :rules="item.rules || []"
           >
+            <template v-if="item.type == 'switch'">
+              <el-switch
+                v-model="fmData[item.keyName]"
+                size="small"
+                :active-text="item.activeText || ''"
+                :inactive-text="item.inactiveText || ''"
+                :active-value="item.activeValue || true"
+                :inactive-value="item.inactiveValue || false"
+              >
+              </el-switch>
+            </template>
+
             <template v-if="item.type == 'input'">
               <el-input
                 v-if="
@@ -62,6 +75,27 @@
               </div>
             </template>
 
+            <template v-if="item.type == 'date'">
+              <el-date-picker
+                v-if="
+                  formType == 'add' || (formType == 'edit' && !item.editDisable)
+                "
+                v-model="fmData[item.keyName]"
+                :picker-options="item.pickerOptions"
+                class="item-input"
+                size="small"
+                clearable
+                show-word-limit
+                :value-format="item.format || 'yyyy-MM-dd'"
+                :placeholder="item.placeholder || '请输入'"
+              >
+              </el-date-picker>
+
+              <div class="item-show" v-else>
+                {{ fmData[item.keyName] || "--" }}
+              </div>
+            </template>
+
             <template v-if="item.type == 'number'">
               <el-input-number
                 v-model="fmData[item.keyName]"
@@ -85,143 +119,110 @@
                 size="small"
                 clearable
                 class="item-select"
+                :multiple="item.multiple || false"
+                :filterable="item.filterable || false"
+                :allowCreate="item.allowCreate || false"
+                :collapse-tags="item.collapseTags || false"
+                default-first-option
+                @change="(e) => handleChangeSelect(e, item)"
               >
-                <el-option
-                  v-for="subItem in item.optionList"
-                  :key="subItem.value"
-                  :label="subItem.label"
-                  :value="subItem.value"
-                >
-                </el-option>
-              </el-select>
-            </template>
-
-            <template v-else-if="item.type == 'address'">
-              <div class="address-item">
-                <el-input
-                  class="address-item-input"
-                  :placeholder="item.placeholder || '请输入所在地址'"
-                  v-model="fmData[item.keyName]"
-                  :maxlength="item.maxlength || ''"
-                  show-word-limit
-                >
-                </el-input>
-                <el-button
-                  style="margin-left: 10px"
-                  type="default"
-                  size="small"
-                  ref="mapSearch"
-                  @click="handleSearchMap(item)"
-                  >查询</el-button
-                >
-                <div id="app" class="div_map"></div>
-                <div style="margin-top: 10px" v-show="false">
-                  <span>经度</span>
-                  <el-input
-                    class="address-item-input2"
-                    maxlength="50"
-                    placeholder="请输入经度"
-                    v-model="fmData[item.supKeys[0]]"
+                <template v-if="item.optionType == 'group'">
+                  <el-option-group
+                    v-for="group in item.optionList"
+                    :key="group.label"
+                    :label="group.label"
                   >
-                  </el-input>
-                  <span style="margin-left: 20px">纬度</span>
-                  <el-input
-                    class="address-item-input2"
-                    maxlength="50"
-                    placeholder="请输入纬度"
-                    v-model="fmData[item.supKeys[1]]"
+                    <el-option
+                      v-for="subItem in group.optionList"
+                      :key="subItem.value"
+                      :label="subItem.label"
+                      :value="subItem.value"
+                    >
+                    </el-option>
+                  </el-option-group>
+                </template>
+                <template v-else>
+                  <el-option
+                    v-for="(subItem, subIndex) in item.optionList"
+                    :key="subItem.value + subIndex"
+                    :label="subItem.label"
+                    :value="subItem.value"
                   >
-                  </el-input>
-                </div>
-              </div>
+                  </el-option>
+                </template>
+              </el-select>
             </template>
-          </el-form-item>
-        </div>
 
-        <div class="list" v-if="editParams2.length > 0">
-          <el-form-item
-            v-for="item in editParams2"
-            label-width="150px"
-            style="display: block"
-            :key="'edit' + item.keyName"
-            :label="item.field"
-            :prop="item.keyName"
-            :rules="item.rules || []"
-          >
-            <template v-if="item.type == 'input'">
-              <el-input
+            <template v-else-if="item.type == 'rich-text'">
+              <div
                 v-if="
                   formType == 'add' || (formType == 'edit' && !item.editDisable)
                 "
-                v-model="fmData[item.keyName]"
-                class="item-input"
-                size="small"
-                clearable
-                show-word-limit
-                :maxlength="item.maxlength || ''"
-                :placeholder="item.placeholder || '请输入'"
+                class="item-rich-text"
               >
-              </el-input>
-
-              <div class="item-show" v-else>
-                {{ fmData[item.keyName] || "--" }}
+                <Tinymce
+                  :ref="'richText' + item.keyName"
+                  v-model="fmData[item.keyName]"
+                  :customerId="customerId"
+                  :placeholder="item.placeholder || '请输入'"
+                  :height="500"
+                />
               </div>
-            </template>
-
-            <template v-if="item.type == 'textarea'">
-              <el-input
-                v-if="
-                  formType == 'add' || (formType == 'edit' && !item.editDisable)
-                "
-                v-model="fmData[item.keyName]"
-                type="textarea"
-                class="item-input"
-                size="small"
-                clearable
-                show-word-limit
-                :rows="3"
-                :maxlength="item.maxlength || ''"
-                :placeholder="item.placeholder || '请输入'"
+              <div
+                v-else
+                class="item-rich-text z-show"
+                @click="handleClickHtmlNode"
               >
-              </el-input>
-
-              <div class="item-show" v-else>
-                {{ fmData[item.keyName] || "--" }}
+                <div v-html="fmData[item.keyName]"></div>
               </div>
             </template>
 
-            <template v-if="item.type == 'number'">
-              <el-input-number
+            <template v-else-if="item.type == 'cascader'">
+              <el-cascader
                 v-model="fmData[item.keyName]"
-                class="item-number"
+                :placeholder="item.placeholder || '请选择'"
+                :options="item.optionList"
+                :props="item.optionProps || {}"
+                :show-all-levels="false"
+                :collapse-tags="item.collapseTags || false"
                 size="small"
                 clearable
-                :precision="item.precision || 0"
-                :step="item.step || 1"
-                :min="item.min || 0"
-                :max="item.max || 999999999999"
-                :placeholder="item.placeholder || '请输入'"
+                class="item-select"
+                @change="(e) => handleChangeCascader(e, item)"
               >
-              </el-input-number>
-              <span v-if="item.unitName">（{{ item.unitName }}）</span>
+              </el-cascader>
             </template>
 
-            <template v-else-if="item.type == 'select'">
-              <el-select
-                v-model="fmData[item.keyName]"
-                :placeholder="item.placeholder || '请选择'"
-                size="small"
-                clearable
-                class="item-select"
+            <template v-else-if="item.type == 'upload'">
+              <el-upload
+                v-if="
+                  formType == 'add' || (formType == 'edit' && !item.editDisable)
+                "
+                ref="upload"
+                class="avatar-uploader"
+                :class="{ 'z-full': fmData[item.keyName].length >= item.limit }"
+                :action="item.uploadUrl || uploadUrl"
+                :data="{ customerId: customerId }"
+                :show-file-list="true"
+                :list-type="item.listType || 'picture'"
+                :limit="item.limit || 100"
+                :file-list="fmData[item.keyName]"
+                :on-success="(res, file) => handleImgSuccess(res, file, item)"
+                :on-error="(res, file) => handleImgError(res, file, item)"
+                :on-remove="(res) => handleImgRemove(res, item)"
+                :on-exceed="(res) => handleImgExceed(res, item)"
+                :before-upload="(file) => beforeImgUpload(file, item)"
               >
-                <el-option
-                  v-for="subItem in item.optionList"
-                  :key="subItem.value"
-                  :label="subItem.label"
-                  :value="subItem.value"
-                >
-                </el-option>
-              </el-select>
+                <a><i class="el-icon-plus"></i> 点击上传</a>
+              </el-upload>
+              <el-image
+                v-else-if="fmData[item.keyName].length > 0"
+                style="width: 100px; height: 100px"
+                :src="fmData[item.keyName][0].url"
+                fit="cover"
+                :preview-src-list="fmData[item.keyName].map((item) => item.url)"
+              ></el-image>
+              <span v-else>--</span>
             </template>
 
             <template v-else-if="item.type == 'address'">
@@ -232,12 +233,14 @@
                   v-model="fmData[item.keyName]"
                   :maxlength="item.maxlength || ''"
                   show-word-limit
+                  size="small"
                 >
                 </el-input>
                 <el-button
                   style="margin-left: 10px"
                   type="default"
                   size="small"
+                  ref="mapSearch"
                   @click="handleSearchMap(item)"
                   >查询</el-button
                 >
@@ -267,18 +270,27 @@
       </el-form>
 
       <div class="div_btn resi-btns" v-if="!formBtnFixed">
-        <el-button size="small" @click="handleCancle">取 消</el-button>
+        <el-button size="small" @click="handleCancle">{{
+          editConfig.cancelBtnName || "取消"
+        }}</el-button>
         <el-button
           v-if="formType != 'watch'"
           type="primary"
           size="small"
           :disabled="btnDisable"
           @click="handleComfirm"
-          >确 定</el-button
+          >{{ editConfig.confirmBtnName || "确定" }}</el-button
         >
+        <slot
+          name="operateSup"
+          v-bind:id="formId"
+          v-bind:info="fmData"
+          v-bind:formType="formType"
+        ></slot>
       </div>
 
       <slot
+        name="bottomSup"
         v-bind:id="formId"
         v-bind:info="fmData"
         v-bind:formType="formType"
@@ -286,15 +298,23 @@
     </div>
 
     <div class="div_btn resi-btns" v-if="formBtnFixed">
-      <el-button size="small" @click="handleCancle">取 消</el-button>
+      <el-button size="small" @click="handleCancle">{{
+        editConfig.cancelBtnName || "取消"
+      }}</el-button>
       <el-button
         v-if="formType != 'watch'"
         type="primary"
         size="small"
         :disabled="btnDisable"
         @click="handleComfirm"
-        >确 定</el-button
+        >{{ editConfig.confirmBtnName || "确定" }}</el-button
       >
+      <slot
+        name="operateSup"
+        v-bind:id="formId"
+        v-bind:info="fmData"
+        v-bind:formType="formType"
+      ></slot>
     </div>
   </div>
 </template>
@@ -303,6 +323,7 @@
 import { requestPost } from "@/js/dai/request";
 import nextTick from "dai-js/tools/nextTick";
 import Schema from "async-validator";
+import Tinymce from "@c/tinymce2/index.vue";
 
 var map;
 var search;
@@ -311,6 +332,8 @@ var infoWindowList;
 var geocoder; // 新建一个正逆地址解析类
 
 export default {
+  components: { Tinymce },
+
   props: {
     formId: {
       type: String,
@@ -361,6 +384,10 @@ export default {
       type: Object,
       default: () => ({}),
     },
+    editConfig: {
+      type: Object,
+      default: () => ({}),
+    },
   },
 
   data() {
@@ -373,9 +400,11 @@ export default {
 
       editParams1: [],
       editParams2: [],
+
+      uploadUrl: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadqrcodeV2",
+      customerId: localStorage.getItem("customerId"),
     };
   },
-  components: {},
   computed: {},
   watch: {
     editParams: {
@@ -406,19 +435,53 @@ export default {
     iniFmData() {
       const { editParams, fmData, editParamsDiv } = this;
       editParams.forEach((item, index) => {
-        fmData[item.keyName] = item.value || "";
+        if (typeof item.value == "function") {
+          fmData[item.keyName] = item.value();
+        } else if (
+          typeof item.value == "string" ||
+          typeof item.value == "number" ||
+          typeof item.value == "boolean"
+        ) {
+          fmData[item.keyName] = item.value;
+        } else if (typeof item.value == "undefined") {
+          fmData[item.keyName] = "";
+        } else {
+          fmData[item.keyName] = item.value || "";
+          console.error(
+            "不应该直接传入数组或对象的值，这样会导致传入的值被子组件修改。editParams-------------cpts/base/cpts/edit.vue",
+            item
+          );
+        }
+
         if (item.supValues) {
           item.supValues.forEach((value, index) => {
-            fmData[item.supKeys[index]] = value;
+            if (typeof value == "function") {
+              fmData[item.supKeys[index]] = value();
+            } else if (
+              typeof value == "string" ||
+              typeof value == "number" ||
+              typeof value == "boolean"
+            ) {
+              fmData[item.supKeys[index]] = value;
+            } else if (typeof value == "undefined") {
+              fmData[item.supKeys[index]] = "";
+            } else {
+              fmData[item.supKeys[index]] = value;
+              console.error(
+                "不应该直接传入数组或对象的值，这样会导致传入的值被子组件修改。editParams-------------cpts/base/cpts/edit.vue",
+                item
+              );
+            }
           });
         }
 
-        if (item.type == "select") {
+        if (item.type == "select" || item.type == "cascader") {
           if (item.optionUrl) {
             this.getFmOptions(
               index,
               item.optionUrl,
-              item.optionUrlParams || {}
+              item.optionUrlParams || {},
+              item.optionCook || null
             );
           }
         } else if (item.type == "address") {
@@ -440,18 +503,119 @@ export default {
       this.iniLoaded = true;
     },
 
-    async getFmOptions(index, url, params) {
+    handleClickHtmlNode(e) {
+      //在判断事件目标节点的时候，考虑到兼容性应该统一转换成大写或小写进行判断
+      if (e.target.localName.toLowerCase() === "a") {
+        // 通过判端目标节点以后，就能在这里对其进行操作啦。
+        let url = e.target.getAttribute("src"); //获取a标签属性，我这里自定义了一个属性data-id并将id赋值给了该属性，如何需要获取click方法的参数，需要获取a标签的click属性，并手动解析获取里面的参数
+        window.open(url);
+      }
+    },
+
+    async getFmOptions(index, url, params, cookFn) {
       const { data, code, msg } = await requestPost(url, {
         ...params,
       });
 
       if (code === 0) {
-        this.editParams[index].optionList = data || [];
+        this.editParams[index].optionList =
+          typeof cookFn == "function" ? cookFn(data) : data || [];
       } else {
         this.$message.error("请求检索基础数据失败！");
       }
     },
 
+    handleChangeCascader(vals, item) {
+      this.fmData[item["keyName"]] = vals;
+      if (typeof item.handleChangeFn == "function") {
+        item.handleChangeFn(vals, item, this);
+      }
+    },
+    handleChangeSelect(vals, item) {
+      console.log(vals, item);
+      this.fmData[item["keyName"]] = vals;
+      if (typeof item.handleChangeFn == "function") {
+        item.handleChangeFn(vals, item, this);
+      }
+    },
+
+    beforeImgUpload(file, item) {
+      if (typeof item.beforeImgUpload == "function") {
+        if (!item.beforeImgUpload(file, item, this)) return false;
+      }
+      return true;
+    },
+
+    handleImgRemove(file, item) {
+      console.log("handleImgRemove", file);
+      let url = file.response ? file.response.data.url : file.url;
+      if (url) {
+        let { fmData } = this;
+        this.fmData[item.keyName] = fmData[item.keyName].filter(
+          (item) => item.url !== url
+        );
+        if (item.supKeys && Array.isArray(item.supKeys)) {
+          if (item.supKeys.length > 0) {
+            this.fmData[item.supKeys[0]] = fmData[item.keyName].map(
+              (item) => item.url
+            );
+          }
+          if (item.supKeys.length > 1) {
+            this.fmData[item.supKeys[1]] =
+              this.fmData[item.supKeys[0]][0] || "";
+          }
+        }
+      }
+    },
+
+    handleImgExceed(res, item) {
+      console.log(res);
+      // this.$message({
+      //   type: "warning",
+      //   message: "文件数量最多不超过三个",
+      // });
+    },
+
+    handleImgSuccess(res, file, item) {
+      console.log("handleImgSuccess", res);
+      if (res.code === 0 && res.msg === "success") {
+        let { fmData } = this;
+        // let picItem = {
+        //   url: res.data.url,
+        //   name: file.name,
+        //   size: file.size,
+        //   type: file.type,
+        //   format: file.name.split(".").pop(),
+        // };
+        let picItem = file;
+        picItem.url = res.data.url;
+        picItem.format = file.name.split(".").pop();
+
+        if (Array.isArray(this.fmData[item.keyName])) {
+          this.fmData[item.keyName].push(picItem);
+        } else {
+          this.fmData[item.keyName] = [picItem];
+        }
+        if (item.supKeys && Array.isArray(item.supKeys)) {
+          if (item.supKeys.length > 0) {
+            this.fmData[item.supKeys[0]] = fmData[item.keyName].map(
+              (item) => item.url
+            );
+          }
+          if (item.supKeys.length > 1) {
+            this.fmData[item.supKeys[1]] =
+              this.fmData[item.supKeys[0]][0] || "";
+          }
+        }
+      } else {
+        this.$message.error(res.msg);
+      }
+    },
+
+    handleImgError(res, file, item) {
+      console.log(res);
+    },
+
     // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
     initMap(item) {
       let { latitude, longitude } = this.$store.state.user;
@@ -564,8 +728,13 @@ export default {
         [idName]: formId,
       };
 
-      const { data, code, msg } = await requestPost(url, params);
+      let { data, code, msg } = await requestPost(url, params);
       if (code === 0) {
+        const { editConfig } = this;
+        console.log("xxxxxxxxxxxxxxxxxxxxxx", editConfig);
+        if (editConfig && typeof editConfig.cookInfoFn == "function") {
+          data = editConfig.cookInfoFn(data);
+        }
         this.fmData = {
           ...this.fmData,
           ...data,
@@ -590,6 +759,28 @@ export default {
       window.open(src);
     },
 
+    // 过滤文本
+    dormatHtml(content) {
+      if (
+        content.startsWith(
+          "<!DOCTYPE html>\n<html>\n<head>\n</head>\n<body>\n"
+        ) &&
+        content.endsWith("\n</body>\n</html>")
+      ) {
+        content = content.slice(45, -16);
+      }
+      return content;
+    },
+
+    cookBeforeSubmit(data) {
+      Object.keys(data).forEach((k) => {
+        if (typeof data[k] == "string") {
+          data[k] = this.dormatHtml(data[k]);
+        }
+      });
+      return data;
+    },
+
     async handleComfirm() {
       this.btnDisable = true;
       setTimeout(() => {
@@ -623,13 +814,23 @@ export default {
     },
 
     async submit() {
+      const { editConfig, fmData, formType, editFixedParams } = this;
+      if (
+        typeof editConfig.beforeSubmit == "function" &&
+        !editConfig.beforeSubmit(formType, fmData, this)
+      ) {
+        return;
+      }
+
       let url = "";
       let params = {
-        ...this.fmData,
-        ...this.editFixedParams,
+        ...fmData,
+        ...editFixedParams,
         // serviceType: this.fmData.serviceTypeArr.join(","),
       };
 
+      params = this.cookBeforeSubmit(params);
+
       if (this.formType === "add") {
         url = this.addUrl;
       } else {
@@ -643,6 +844,7 @@ export default {
           type: "success",
           message: "操作成功",
         });
+        this.handleCancle();
         this.$emit("afterEdit");
         this.btnDisable = false;
       } else {
@@ -663,23 +865,50 @@ export default {
   margin-top: 30px;
 
   &.z-div {
-    display: flex;
+    .list {
+      display: flex;
+      flex-wrap: wrap;
+
+      .item {
+        min-width: 45%;
+
+        .item-rich-text {
+          width: 817px;
+          max-height: 500px;
+          overflow: auto;
+
+          img {
+            max-width: 100%;
+          }
+          &.z-show {
+            box-sizing: border-box;
+            padding: 15px;
+            border: 1px solid #eee;
+            height: auto;
+          }
+        }
+      }
+    }
+
+    .item-show {
+      width: 324px;
+    }
 
     .item-input {
-      width: 225px;
+      width: 324px;
     }
     .item-select {
-      width: 225px;
+      width: 324px;
     }
     .item-number {
-      width: 125px;
+      width: 180px;
     }
 
     .address-item {
-      width: 450px;
+      width: 350px;
 
       .address-item-input {
-        width: 85%;
+        width: 74%;
       }
       .address-item-input2 {
         margin-left: 5px;
@@ -687,12 +916,44 @@ export default {
       }
     }
   }
+  .avatar-uploader {
+    &.z-full {
+      /deep/ .el-upload.el-upload--picture-card {
+        display: none !important;
+      }
+    }
+
+    a {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: #65a5f9;
+      i {
+        margin-right: 4px;
+        color: #65a5f9;
+        font-size: 18px;
+      }
+      &:hover {
+        text-decoration: none;
+      }
+    }
+  }
+  .item-rich-text {
+    width: 600px;
+    height: 500px;
+    img {
+      max-width: 100%;
+    }
+    .item-show {
+      width: 100%;
+    }
+  }
+
+  .item-select,
+  .item-show,
   .item-input {
     width: 450px;
   }
-  .item-select {
-    width: 225px;
-  }
   .item-number {
     width: 225px;
   }
diff --git a/src/views/modules/cpts/base/index.vue b/src/views/modules/cpts/base/index.vue
index 3c8250b48..d6660da39 100644
--- a/src/views/modules/cpts/base/index.vue
+++ b/src/views/modules/cpts/base/index.vue
@@ -13,7 +13,7 @@
               <template v-if="item.type == 'input'">
                 <el-input
                   v-model="item.value"
-                  class="item_width_1"
+                  style="width: 240px"
                   size="small"
                   clearable
                   :placeholder="item.placeholder || '请输入'"
@@ -26,7 +26,8 @@
                   :placeholder="item.placeholder || '请选择'"
                   size="small"
                   clearable
-                  class="item_width_2"
+                  style="width: 240px"
+                  :multiple="item.multiple || false"
                 >
                   <el-option
                     v-for="item in item.optionList"
@@ -37,6 +38,41 @@
                   </el-option>
                 </el-select>
               </template>
+              <template v-else-if="item.type == 'cascader'">
+                <el-cascader
+                  v-model="item.value"
+                  :placeholder="item.placeholder || '请选择'"
+                  :options="item.optionList"
+                  :props="item.optionProps"
+                  :show-all-levels="false"
+                  size="small"
+                  clearable
+                  style="width: 240px"
+                  @change="(e) => handleChangeCascader(e, item)"
+                >
+                </el-cascader>
+              </template>
+              <template v-if="item.type == 'date-range'">
+                <el-date-picker
+                  v-model="item.supValues[0]"
+                  type="date"
+                  placeholder="开始时间"
+                  style="width: 150px"
+                  value-format="yyyy-MM-dd"
+                  clearable
+                >
+                </el-date-picker>
+                <span style="display: inline-block; margin: 0 10px">至</span>
+                <el-date-picker
+                  v-model="item.supValues[1]"
+                  type="date"
+                  placeholder="结束时间"
+                  style="width: 150px"
+                  value-format="yyyy-MM-dd"
+                  clearable
+                >
+                </el-date-picker>
+              </template>
             </el-form-item>
 
             <el-button
@@ -57,7 +93,7 @@
         </el-form>
       </div>
 
-      <div class="div_table">
+      <div class="div_table" :style="{ height: maxTableHeight + 130 + 'px' }">
         <div class="div_btn">
           <el-button
             class="diy-button--add"
@@ -103,6 +139,7 @@
         </div>
 
         <el-table
+          ref="ref_table"
           :data="tableData"
           border
           :header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }"
@@ -131,6 +168,20 @@
               :show-overflow-tooltip="true"
             >
             </el-table-column>
+
+            <el-table-column
+              v-else-if="item.type == 'array'"
+              :key="'table-array' + item.keyName"
+              :prop="item.keyName"
+              :label="item.field"
+              align="center"
+              :width="item.width || ''"
+              :show-overflow-tooltip="true"
+            >
+              <template slot-scope="scope">
+                {{ scope.row[item.keyName].join(item.arrayDiv || ",") }}
+              </template>
+            </el-table-column>
           </template>
 
           <el-table-column
@@ -141,6 +192,7 @@
           >
             <template slot-scope="scope">
               <el-button
+                v-if="infoUrl && infoAuth(scope.row)"
                 @click="handleWatch(scope.row)"
                 type="text"
                 size="small"
@@ -170,6 +222,8 @@
                   >删除</el-button
                 >
               </el-popconfirm>
+
+              <slot name="listBtnSup" v-bind:item="scope.row"></slot>
             </template>
           </el-table-column>
         </el-table>
@@ -202,7 +256,8 @@
       @closed="handleClose"
     >
       <edit-form
-        ref="eleEditForm"
+        v-if="formShow"
+        ref="editForm"
         :idName="idName"
         :formId="formId"
         :formType="formType"
@@ -214,12 +269,21 @@
         :editElseRules="editElseRules"
         :editFixedParams="editFixedParams"
         :formBtnFixed="formBtnFixed"
+        :editConfig="editConfig"
         @close="handleClose"
         @afterEdit="handleEditSuccess"
       >
-        <template v-slot="{ id, formType, info }">
+        <template v-slot:bottomSup="{ id, formType, info }">
           <slot
-            name="editElse"
+            name="editBottomSup"
+            v-bind:id="id"
+            v-bind:formType="formType"
+            v-bind:info="info"
+          ></slot>
+        </template>
+        <template v-slot:operateSup="{ id, formType, info }">
+          <slot
+            name="editOperateSup"
             v-bind:id="id"
             v-bind:formType="formType"
             v-bind:info="info"
@@ -289,13 +353,17 @@ export default {
       default: "",
     },
 
+    infoAuth: {
+      type: Function,
+      default: () => true,
+    },
     editAuth: {
       type: Function,
       default: () => true,
     },
     editBtnName: {
       type: Function,
-      default: () => "编辑",
+      default: () => "修改",
     },
     delAuth: {
       type: Function,
@@ -310,6 +378,10 @@ export default {
       type: Object,
       default: () => ({}),
     },
+    editConfig: {
+      type: Object,
+      default: () => ({}),
+    },
     editFixedParams: {
       type: Object,
       default: () => ({}),
@@ -351,8 +423,8 @@ export default {
     maxTableHeight() {
       const { ref_search_height } = this;
       return this.$store.state.inIframe
-        ? this.clientHeight - ref_search_height - 260 + this.iframeHeight
-        : this.clientHeight - ref_search_height - 260;
+        ? this.clientHeight - ref_search_height - 265 + this.iframeHeight
+        : this.clientHeight - ref_search_height - 265;
     },
     ...mapGetters(["clientHeight", "iframeHeight"]),
   },
@@ -372,6 +444,12 @@ export default {
     await nextTick(100);
     this.computeSearchHeight();
   },
+
+  activated() {
+    console.log("-------------activated");
+    this.$refs["ref_table"].doLayout();
+  },
+
   methods: {
     computeSearchHeight() {
       this.ref_search_height = this.$refs["ref_search"].clientHeight;
@@ -382,30 +460,38 @@ export default {
     iniSearchData() {
       const { searchParams } = this;
       searchParams.forEach((item, index) => {
-        if (item.type == "select") {
+        if (item.type == "select" || item.type == "cascader") {
           if (item.optionUrl) {
             this.getFmOptions(
               index,
               item.optionUrl,
-              item.optionUrlParams || {}
+              item.optionUrlParams || {},
+              item.optionCook || null
             );
           }
         }
       });
     },
 
-    async getFmOptions(index, url, params) {
+    async getFmOptions(index, url, params, cookFn) {
       const { data, code, msg } = await requestPost(url, {
         ...params,
       });
 
       if (code === 0) {
-        this.searchParams[index].optionList = data || [];
+        this.searchParams[index].optionList =
+          typeof cookFn == "function" ? cookFn(data) : data || [];
       } else {
         this.$message.error("请求检索基础数据失败！");
       }
     },
 
+    handleChangeCascader(vals, item) {
+      if (typeof item.handleChangeFn == "function") {
+        item.handleChangeFn(vals, item);
+      }
+    },
+
     handleSearch(val) {
       this.pageNo = 1;
 
@@ -429,6 +515,7 @@ export default {
       }
       return fileType && isLt1M;
     },
+
     async uploadHttpRequest(file) {
       let { importUrl: url } = this;
       if (!url) return;
@@ -592,12 +679,21 @@ export default {
       let fmData = {};
       this.searchParams.forEach((item) => {
         fmData[item.keyName] = item.value;
+        if (item.supValues) {
+          item.supValues.forEach((value, index) => {
+            fmData[item.supKeys[index]] = value;
+          });
+        }
       });
       return fmData;
     },
 
+    refresh() {
+      this.getTableData();
+    },
+
     async getTableData() {
-      const { tableUrl: url, searchParams } = this;
+      const { tableUrl: url } = this;
       if (!url) return;
 
       const { pageSize, pageNo } = this;
@@ -630,8 +726,23 @@ export default {
     },
 
     resetSearch() {
+      console.log("----------------resetSearch", this.searchParams);
       this.searchParams.forEach((item) => {
-        item.value = "";
+        if (typeof item.value == "string") {
+          item.value = "";
+        } else if (Array.isArray(item.value)) {
+          item.value = [];
+        }
+        if (item.supValues) {
+          item.supValues = item.supValues.map((value, index) => {
+            if (typeof value == "string") {
+              return "";
+            } else if (Array.isArray(value)) {
+              return [];
+            }
+            return value;
+          });
+        }
       });
     },
   },
diff --git a/src/views/modules/plugins/rent/rentcontractinfo-add-or-update.vue b/src/views/modules/plugins/rent/rentcontractinfo-add-or-update.vue
index 2cad16bd8..7dae7f23b 100644
--- a/src/views/modules/plugins/rent/rentcontractinfo-add-or-update.vue
+++ b/src/views/modules/plugins/rent/rentcontractinfo-add-or-update.vue
@@ -70,6 +70,10 @@
             </el-select>
         </el-form-item>
         <br/>
+        <el-form-item label="出租人现居住地" prop="lessorLiveAddress">
+            <el-input v-model="dataForm.lessorLiveAddress" placeholder="出租人现居住地" disabled></el-input>
+        </el-form-item>
+        <br/>
         <el-form-item label="中介合同附件" prop="agencyImgList" v-if="dataForm.lessorRelation ==='中介'">
             <template>
                 <label v-for="(item,index) in dataForm.agencyImgList" :key="index">
@@ -94,6 +98,10 @@
             <el-input v-model="dataForm.lesseeUnit" placeholder="工作单位" disabled></el-input>
         </el-form-item>
         <br/>
+        <el-form-item label="承租人户籍地" prop="lesseeHouseAddress">
+            <el-input v-model="dataForm.lesseeHouseAddress" placeholder="承租人户籍地" disabled></el-input>
+        </el-form-item>
+        <br/>
 
 
         <div style="margin-left: 50px;height: 30px;font-weight: bold;">合同内容</div>
@@ -116,18 +124,32 @@
                 </label>
             </template>
         </el-form-item>
+        <el-form-item label="审核原因" prop="reason" v-if="dataForm.flag === '1' && dataForm.state === '2'">
+            <el-input v-model="dataForm.reason" placeholder="审核原因" disabled></el-input>
+        </el-form-item>
 
       </el-form>
     <template slot="footer">
         <div class="resi-btns">
         <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-        <el-button v-if="dataForm.state === '0'" type="danger" @click="checkHandle('2')">{{ $t('checkBTGBtn') }}</el-button>
+        <el-button v-if="dataForm.state === '0'" type="danger" @click="openCheckReasonDialog">{{ $t('checkBTGBtn') }}</el-button>
         <el-button v-if="dataForm.state === '0'" type="primary" @click="checkHandle('1')">{{ $t('checkTGBtn') }}</el-button>
         </div>
     </template>
       <el-dialog :visible.sync="dialogVisible" :modal="false">
           <img width="100%" :src="dialogImageUrl" alt="">
       </el-dialog>
+      <el-dialog
+              title="审核不通过原因"
+              :visible.sync="checkVisible"
+              width="30%"
+              append-to-body>
+          <el-input v-model="checkReason" placeholder="请输入审核不通过原因"></el-input>
+          <span slot="footer" class="dialog-footer">
+            <el-button @click="checkVisible = false">取 消</el-button>
+            <el-button type="primary" @click="dialogCheckHandle" :disabled="disabledBtn">确 定</el-button>
+          </span>
+      </el-dialog>
   </el-dialog>
 </template>
 
@@ -154,10 +176,12 @@ export default {
         lessorIdCard: '',
         lessorMobile: '',
         lessorRelation: '',
+          lessorLiveAddress: '',
         lesseeName: '',
         lesseeIdCard: '',
         lesseeMobile: '',
         lesseeUnit: '',
+          lesseeHouseAddress: '',
         signDate: '',
         startDate: '',
         endDate: ''
@@ -176,7 +200,10 @@ export default {
             { dictValue: '孙子女', dictName: '孙子女' },
             { dictValue: '兄弟姐妹', dictName: '兄弟姐妹' },
             { dictValue: '中介', dictName: '中介' }
-        ]
+        ],
+        checkReason: '',
+        checkVisible: false,
+        disabledBtn: false
     }
   },
   computed: {
@@ -269,13 +296,28 @@ export default {
         }
       }).catch(() => {})
     },
+      // 打开审核不通过对话框
+      openCheckReasonDialog(){
+        this.checkVisible = true
+          this.checkReason = ''
+          this.disabledBtn = false
+      },
+      // 不通过审核意见提交
+      dialogCheckHandle(){
+        if(this.checkReason === ''){
+            return this.$message.error('请填写不通过原因')
+        }
+        this.checkHandle('2')
+          this.disabledBtn = true
+      },
       // 审核提交方法
       checkHandle: function (type) {
         const params = {
           id: this.dataForm.id,
           state: type,
           homeId: this.dataForm.homeId,
-          lessorRelation: this.dataForm.lessorRelation
+          lessorRelation: this.dataForm.lessorRelation,
+          reason: this.checkReason
         }
         this.$http.post('/pli/power/rentContractInfo/review', params).then(({ data: res }) => {
           if (res.code !== 0) {
@@ -296,6 +338,8 @@ export default {
                   type: 'success',
                   duration: 500,
                   onClose: () => {
+                      this.disabledBtn = false
+                      this.checkVisible = false
                       this.visible = false
                       this.$emit('refreshDataList')
                   }
diff --git a/src/views/modules/shequzhili/tuceng/anquan/xuncha/index.vue b/src/views/modules/shequzhili/tuceng/anquan/xuncha/index.vue
index b3af35076..e67bcc553 100644
--- a/src/views/modules/shequzhili/tuceng/anquan/xuncha/index.vue
+++ b/src/views/modules/shequzhili/tuceng/anquan/xuncha/index.vue
@@ -21,7 +21,7 @@
       :formBtnFixed="false"
       idName="enterpriseId"
     >
-      <template v-slot:editElse="{ id, formType, info }">
+      <template v-slot:editBottomSup="{ id, formType, info }">
         <record
           v-if="formType != 'add' && id"
           :formType="formType"
diff --git a/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy 2.vue b/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy 2.vue
new file mode 100644
index 000000000..7ee8f5f85
--- /dev/null
+++ b/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy 2.vue	
@@ -0,0 +1,2063 @@
+<template>
+  <div style="position: relative">
+
+    <!-- 组织路由 -->
+
+    <div class="div_top">
+      <div class="router_line"></div>
+      <div class="div_router">
+        <div v-if="!showPeopleInfo">
+          <span class="router_child">五大图层</span>
+        </div>
+        <div v-if="showPeopleInfo"> <span class="router_parents"
+                @click="handleClickRouter">五大图层<span class="arrow">></span></span>
+
+          <span class="router_child">个人档案</span>
+        </div>
+      </div>
+    </div>
+
+    <div v-show="!showPeopleInfo"
+         class="div_content">
+
+      <div class="div_map"
+           id="map"
+           ref="map">
+      </div>
+
+      <div class="div_data">
+
+        <div class="div_tips">
+
+          <div class="div_coverage">
+
+            <div class="coverage_item"
+                 @click="handleClickCoverage(index)"
+                 v-for="(item,index) in coverageTypesList"
+                 :key="index">
+              <img :src="item.select?selImg:noSelImg" />
+              <span>{{item.label}}</span>
+            </div>
+          </div>
+          <div class="div_category">
+            <el-scrollbar style="height:98%">
+
+              <div v-for="(item,index) in categoryListshow"
+                   :key="index"
+                   class="category_item">
+
+                <div v-for="(colItem,colIndex) in item"
+                     :key="colIndex"
+                     class="list_item"
+                     @click="handleClickCategory(index,colIndex)">
+                  <img :src="colItem.dataIcon"
+                       alt />
+                  <div :class="['item_content',colItem.sel?'item_content_sel':'']">{{colItem.categoryName}}
+
+                  </div>
+
+                </div>
+
+              </div>
+
+            </el-scrollbar>
+          </div>
+        </div>
+
+        <div class="div_info">
+          <div class="div_search_list">
+            <el-input size="mini"
+                      WarningColor='warning'
+                      placeholder="请输入搜索内容"
+                      v-model="search">
+              <i slot="prefix"
+                 class="icon">
+                <img src="../../../../../assets/img/modules/visual/sousuo.png"
+                     alt />
+              </i>
+            </el-input>
+
+            <div class="btn"
+                 @click="handleSearch">搜索</div>
+
+          </div>
+          <div class="m-tb">
+
+            <div class="tb">
+              <cpt-tb :col-list="demand.colList"
+                      :loading="demand.loading"
+                      :header="demand.header"
+                      :list="demand.list"
+                      @handleClickRow="handleClickRow"></cpt-tb>
+
+            </div>
+            <div class="m-pagination">
+              <el-pagination :current-page="demand.pageNo"
+                             :page-size="demand.pageSize"
+                             :total="demand.total"
+                             background
+                             layout="prev, pager, next,total"
+                             @current-change="handlePageNoChange_demand">
+              </el-pagination>
+            </div>
+          </div>
+
+        </div>
+
+      </div>
+    </div>
+    <div id="popup"
+         style="display: none;"
+         class="ol-popup">
+      <a href="#"
+         id="popup-closer"
+         class="ol-popup-closer"></a>
+
+      <div id="popup-content"
+           class="popup-content">
+        <div class="div-pop"
+             v-show="selPlaceType==='resi'|| selPlaceType === 'special_resi'">
+          <div class="popTitle">居民信息</div>
+          <div class="popContentTitle">姓名：
+            <span>{{ selInfo.icUserName }}</span>
+          </div>
+          <div class="popContentTitle">所属网格：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">所属小区：
+            <span>{{ selInfo.villageName }}</span>
+          </div>
+          <div class="popContentTitle">本地户籍：
+            <span>{{ selInfo.isBdhjShow }}</span>
+          </div>
+
+          <div class="popContentTitle">手机：
+            <span>{{ selInfo.mobile }}</span>
+          </div>
+          <div class="popContentTitle">性别：
+            <span>{{ selInfo.genderShow }}</span>
+          </div>
+          <div class="popContentTitle">身份证号：
+            <span>{{ selInfo.idCard }}</span>
+          </div>
+
+          <div class="popContentTitle">工作单位：
+            <span>{{ selInfo.gzdw?selInfo.gzdw:'--' }}</span>
+          </div>
+          <div class="popContentTitle">人户状况：
+            <span>{{ selInfo.rhzkShow }}</span>
+          </div>
+          <div class="div_resi_more">
+            <div @click="toPeople"
+                 class="span_resi_more">更多</div>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='dangerous_chemicals'">
+          <div class="popTitle">企业信息</div>
+          <div class="popContentTitle">企业名称：
+            <span>{{ selInfo.name }}</span>
+          </div>
+          <div class="popContentTitle">企业类型：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">周边安全距离：
+            <span>{{ selInfo.safeDistance }}</span>
+          </div>
+          <div class="popContentTitle">危化品种类：
+            <span>{{ selInfo.dangerTypeName }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.principalName }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.principalMobile }}</span>
+          </div>
+          <div class="popContentTitle">经营地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+          <div class="popContentTitle">备注：
+            <span>{{ selInfo.remark }}</span>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='public_service'||selPlaceType==='city_management'||selPlaceType==='superior_resource'">
+          <div class="popTitle">场所信息</div>
+          <div class="popContentTitle">场所名称：
+            <span>{{ selInfo.name }}</span>
+          </div>
+          <div class="popContentTitle">场所分类：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">占地面积：
+            <span>{{ selInfo.areaCovered }}</span>
+          </div>
+          <div class="popContentTitle">容纳人数：
+            <span>{{ selInfo.capacity }}</span>
+          </div>
+          <div class="popContentTitle">地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='event'">
+          <div class="popTitle">难点痛点</div>
+          <div class="popContentTitle">所属网格：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">发生时间：
+            <span>{{ selInfo.happenTime }}</span>
+          </div>
+          <div class="popContentTitle">事件内容：
+            <span>{{ selInfo.eventContent }}</span>
+          </div>
+
+          <div v-if="selInfo.imageList&&selInfo.imageList.length>0"
+               class="info-prop">
+            <span>图片：</span>
+            <div class="info-pics">
+              <img :src="src"
+                   :key="src"
+                   style="width:100px;height:100px;padding-right:10px"
+                   v-for="src in eventInfo.imageList"
+                   @click="watchImg(src)" />
+
+            </div>
+          </div>
+
+          <div v-if="selInfo.voiceList&&selInfo.voiceList.length>0"
+               class="info-prop">
+            <span>音频：</span>
+            <div class="info-pics">
+              <audio controls>
+                <source :src="item.url"
+                        type=""
+                        :key="item.url"
+                        v-for="item in eventInfo.voiceList" />
+              </audio>
+
+            </div>
+
+          </div>
+          <div class="popContentTitle">反映渠道：
+            <span>{{ selInfo.sourceTypeName|| "--" }}</span>
+          </div>
+          <div class="popContentTitle">地址：
+            <span>{{ selInfo.address || "--" }}</span>
+          </div>
+          <div class="popContentTitle">报事人：
+            <span>{{selInfo.name || "--" }}</span>
+          </div>
+          <div class="popContentTitle">手机号：
+            <span>{{ selInfo.mobile || "--" }}</span>
+          </div>
+          <div class="popContentTitle">身份证号：
+            <span>{{ selInfo.idCard || "--" }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='community_org'">
+          <div class="popTitle">组织信息</div>
+          <div class="popContentTitle">组织名称：
+            <span>{{ selInfo.organizationName }}</span>
+          </div>
+          <div class="popContentTitle">组织分类：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">组织人数：
+            <span>{{ selInfo.organizationPersonCount }}</span>
+          </div>
+          <div class="popContentTitle">组织成员：
+            <span>{{ selInfo.organizationPersonnelShow }}</span>
+          </div>
+          <div class="popContentTitle">服务事项：
+            <span>{{ selInfo.serviceItem }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.principalName }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.principalPhone }}</span>
+          </div>
+          <div class="popContentTitle">创建时间：
+            <span>{{ selInfo.organizationCreatedTime }}</span>
+          </div>
+        </div>
+
+        <div v-show="selPlaceType==='group_rent'">
+          <div class="popTitle">房屋信息</div>
+          <div class="popContentTitle">房屋名称：
+            <span>{{ selInfo.houseName }}</span>
+          </div>
+          <div class="popContentTitle">房屋类型：
+            <span>{{ selInfo.houseTypeName }}</span>
+          </div>
+          <div class="popContentTitle">房屋用途：
+            <span>{{ selInfo.purposeName }}</span>
+          </div>
+          <div class="popContentTitle">房屋状态：
+            <span>{{ selInfo.rentName }}</span>
+          </div>
+          <div class="popContentTitle">房主姓名：
+            <span>{{ selInfo.ownerName }}</span>
+          </div>
+          <div class="popContentTitle">联系方式：
+            <span>{{ selInfo.ownerPhone }}</span>
+          </div>
+          <div class="popContentTitle">房主身份证：
+            <span>{{ selInfo.ownerIdCard }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='enterprise_patrol'">
+          <div class="popTitle">企事业信息</div>
+          <div class="popContentTitle">场所类型：
+            <span>{{ selInfo.placeTypeName }}</span>
+          </div>
+          <div class="popContentTitle">场所区域：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">场所名称：
+            <span>{{ selInfo.placeOrgName }}</span>
+          </div>
+          <div class="popContentTitle">场所地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+          <div class="popContentTitle">规模：
+            <span>{{ selInfo.scale }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.personInCharge }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.mobile }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='party_unit'">
+          <div class="popTitle">联建单位信息</div>
+          <div class="popContentTitle">单位名称：
+            <span>{{ selInfo.unitName }}</span>
+          </div>
+          <div class="popContentTitle">分类：
+            <span>{{ selInfo.typeName }}</span>
+          </div>
+          <div class="popContentTitle">服务事项：
+            <span>{{ selInfo.serviceMatterListShow }}</span>
+          </div>
+          <div class="popContentTitle">联系人：
+            <span>{{ selInfo.contact }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.contactMobile }}</span>
+          </div>
+          <div class="popContentTitle">在职党员：
+            <span>{{ selInfo.memberCount }}</span>
+          </div>
+          <div class="popContentTitle">备注：
+            <span>{{ selInfo.remark }}</span>
+          </div>
+          <div class="popContentTitle">地理位置：
+            <span>{{ selInfo.address }}</span>
+          </div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <people v-if="showPeopleInfo"
+            :uid="selUserId"
+            ref="ref_people"></people>
+  </div>
+
+</template>
+
+<script>
+import 'ol/ol.css'
+import { Map, View } from 'ol'
+import TileLayer from 'ol/layer/Tile.js';
+import ImageLayer from 'ol/layer/Image';
+import { Raster as RasterSource } from 'ol/source';
+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, requestGet } from "@/js/dai/request";
+
+
+import cptTb from "@/views/modules/visual/cpts/tb";
+import cptCard from "@/views/modules/visual/cpts/card";
+import ScreenLoading from "@/views/modules/visual/cpts/loading";
+import People from "../../basicinfo/people";
+
+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 iconUrlArray = [
+  require('../../../../../assets/img/shuju/measure/lxdj.png'),
+  require('../../../../../assets/img/shuju/measure/qydw.png'),
+  require('../../../../../assets/img/shuju/measure/lxzz.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 {
+      centerPoint: [],//中心点位置
+      zoom: 14,//缩放范围：区14
+      minZoom: 1,//最小缩放
+
+      orgData: {},//当前组织对象
+      orgId: '',
+      orgLevel: '',
+
+      subAgencyArray: [],//下拉框数据
+      iconCoordinators: [],
+      currentCoordinate: null,
+      overlay: null,
+
+      //右侧搜索
+      searchName: "",
+
+      //右侧列表
+      infoLoading: true,
+      listData: [],//得到的数据
+      listDatashow: [],//处理成一行两列的数据
+
+      //下钻层级记录
+      runNum: 0,
+      routerArray: [],
+      center: [],
+      zoom: null,
+      parentPolygon: [],
+
+      centerFlag: 'point',//定义中心点的flag  point点 fit 自适应
+
+      coverageTypesList: [//图层类型。五大图层：zhzl：综合治理图层；yjcl：应急处置图层；aqsc：安全生产图层；csgl：城市管理图层；ggfw：公共服务图层
+        {
+          select: true,
+          label: '综合治理图层',
+          value: 'zhzl'
+        },
+        {
+          select: false,
+          label: '应急处置图层',
+          value: 'yjcl'
+        },
+        {
+          select: false,
+          label: '安全生产图层',
+          value: 'aqsc'
+        },
+        {
+          select: false,
+          label: '城市管理图层',
+          value: 'csgl'
+        },
+        {
+          select: false,
+          label: '公共服务图层',
+          value: 'ggfw'
+        },
+      ],
+      categoryList: [],//分类列表
+      categoryListshow: [],//处理成一行四列的数据
+
+      selImg: require('../../../../../assets/img/shuju/xuanzhong.png'),
+      noSelImg: require('../../../../../assets/img/shuju/weixuan.png'),
+
+      coverageTypes: ['zhzl'],
+      categoryKeys: [],
+      search: '',
+      pageNo: 1,
+      pageSize: 10,
+
+      demand: {
+        loading: false,
+        colList: [
+          {
+            align: "center",
+            width: "15%",
+          },
+          {
+            align: "center",
+            width: "25%",
+          },
+          {
+            align: "center",
+            width: "60%",
+          },
+
+        ],
+        header: ["图例", "分类", "名称"],
+        list: [],
+        pageSize: 50,
+        pageNo: 1,
+        total: 0,
+      },
+
+      iconUrlArray: {
+
+        'anzhibangjiao': require('../../../../../assets/img/shuju/fiveLayer/anzhibangjiao.png'),
+        'buliangqingshaonian': require('../../../../../assets/img/shuju/fiveLayer/buliangqingshaonian.png'),
+        'shequjiaozheng': require('../../../../../assets/img/shuju/fiveLayer/shequjiaozheng.png'),
+        'resi_xfry': require('../../../../../assets/img/shuju/fiveLayer/resi_xfry.png'),
+        'xidurenyuan': require('../../../../../assets/img/shuju/fiveLayer/xidurenyuan.png'),
+        'xiejiaorenyuan': require('../../../../../assets/img/shuju/fiveLayer/xiejiaorenyuan.png'),
+        'zhaoshizhaohuojingshenbing': require('../../../../../assets/img/shuju/fiveLayer/zhaoshizhaohuojingshenbing.png'),
+
+
+        'yjdw': require('../../../../../assets/img/shuju/fiveLayer/yjdw.png'),
+        'sr_gy': require('../../../../../assets/img/shuju/fiveLayer/sr_gy.png'),
+        'sr_gc': require('../../../../../assets/img/shuju/fiveLayer/sr_gc.png'),
+        'whdw': require('../../../../../assets/img/shuju/fiveLayer/whdw.png'),
+        'sr_ggld': require('../../../../../assets/img/shuju/fiveLayer/sr_ggld.png'),
+        'lwh': require('../../../../../assets/img/shuju/fiveLayer/lwh.png'),
+        'sr_tyc': require('../../../../../assets/img/shuju/fiveLayer/sr_tyc.png'),
+        'lyjlb': require('../../../../../assets/img/shuju/fiveLayer/lyjlb.png'),
+        'sr_yjy': require('../../../../../assets/img/shuju/fiveLayer/sr_yjy.png'),
+        'zaxld': require('../../../../../assets/img/shuju/fiveLayer/zaxld.png'),
+        'other': require('../../../../../assets/img/shuju/fiveLayer/other.png'),
+        'sr_jzz': require('../../../../../assets/img/shuju/fiveLayer/sr_jzz.png'),
+        'sr_djc': require('../../../../../assets/img/shuju/fiveLayer/sr_djc.png'),
+        'sr_rfqck': require('../../../../../assets/img/shuju/fiveLayer/sr_rfqck.png'),
+        'ep_lg': require('../../../../../assets/img/shuju/fiveLayer/ep_lg.png'),
+        'sr_xfz': require('../../../../../assets/img/shuju/fiveLayer/sr_xfz.png'),
+        'pu_jgzsbm': require('../../../../../assets/img/shuju/fiveLayer/pu_jgzsbm.png'),
+
+        'gr_czw': require('../../../../../assets/img/shuju/fiveLayer/gr_czw.png'),
+        'ep_cycs': require('../../../../../assets/img/shuju/fiveLayer/ep_cycs.png'),
+        'dc_jyz': require('../../../../../assets/img/shuju/fiveLayer/dc_jyz.png'),
+        'ep_gwylcs': require('../../../../../assets/img/shuju/fiveLayer/ep_gwylcs.png'),
+        'dc_jqz': require('../../../../../assets/img/shuju/fiveLayer/dc_jqz.png'),
+        'dc_whpdw': require('../../../../../assets/img/shuju/fiveLayer/dc_whpdw.png'),
+        'ep_wb': require('../../../../../assets/img/shuju/fiveLayer/ep_wb.png'),
+        'ep_mrxycs': require('../../../../../assets/img/shuju/fiveLayer/ep_mrxycs.png'),
+        'dc_yqhjz': require('../../../../../assets/img/shuju/fiveLayer/dc_yqhjz.png'),
+        'dc_jzgd': require('../../../../../assets/img/shuju/fiveLayer/dc_jzgd.png'),
+        'ep_scjgqy': require('../../../../../assets/img/shuju/fiveLayer/ep_scjgqy.png'),
+
+        'cm_nmsc': require('../../../../../assets/img/shuju/fiveLayer/cm_nmsc.png'),
+        'event_tdnd': require('../../../../../assets/img/shuju/fiveLayer/event_tdnd.png'),
+        'cm_bhsc': require('../../../../../assets/img/shuju/fiveLayer/cm_bhsc.png'),
+        'cm_cjsc': require('../../../../../assets/img/shuju/fiveLayer/cm_cjsc.png'),
+        'ep_lssd': require('../../../../../assets/img/shuju/fiveLayer/ep_lssd.png'),
+
+
+        'resi_szry': require('../../../../../assets/img/shuju/fiveLayer/resi_szry.png'),
+        'ps_lyy': require('../../../../../assets/img/shuju/fiveLayer/ps_lyy.png'),
+        'resi_snry': require('../../../../../assets/img/shuju/fiveLayer/resi_snry.png'),
+        'ps_mzb': require('../../../../../assets/img/shuju/fiveLayer/ps_mzb.png'),
+        'ps_zs': require('../../../../../assets/img/shuju/fiveLayer/ps_zs.png'),
+        'ps_wss': require('../../../../../assets/img/shuju/fiveLayer/ps_wss.png'),
+        'ps_jjz': require('../../../../../assets/img/shuju/fiveLayer/ps_jjz.png'),
+        'ep_xx': require('../../../../../assets/img/shuju/fiveLayer/ep_xx.png'),
+        'ep_yy': require('../../../../../assets/img/shuju/fiveLayer/ep_yy.png'),
+
+      },
+      iconArrays: [],
+      overlay: null,
+      showPopup: false,
+
+      selPlaceType: '',
+      selInfo: {},
+      selUserId: '',
+      showPeopleInfo: false
+
+    }
+  },
+  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.loadCategoryList()
+    this.getTable();
+    await this.getMapTable();
+
+
+    //初始化icon图层
+    this.addOverlay()
+
+    this.addMapClick()
+
+  },
+  methods: {
+
+    toPeople () {
+      this.showPeopleInfo = true
+    },
+
+    //添加覆盖层
+    addOverlay () {
+      // 使用变量存储弹窗所需的 DOM 对象
+      var container = document.getElementById("popup");
+      var closer = document.getElementById("popup-closer");
+      var content = document.getElementById("popup-content");
+
+
+      // 创建一个弹窗 Overlay 对象
+      this.overlay = new Overlay({
+        element: container, //绑定 Overlay 对象和 DOM 对象的
+        autoPan: true, // 定义弹出窗口在边缘点击时候可能不完整 设置自动平移效果
+        autoPanAnimation: {
+          duration: 250 //自动平移效果的动画时间 9毫秒
+        },
+        zIndex: 100
+      });
+      // 将弹窗添加到 map 地图中
+      map.addOverlay(this.overlay);
+      let _that = this;
+
+      /**
+       * 为弹窗添加一个响应关闭的函数
+       */
+      closer.onclick = function () {
+        _that.overlay.setPosition(undefined);
+        closer.blur();
+        return false;
+      };
+
+    },
+
+    //注册地图点击事件
+    addMapClick () {
+      let _that = this
+
+      map.on("click", function (evt) {
+        const feature = map.forEachFeatureAtPixel(evt.pixel, function (feature) {
+          return feature;
+        });
+        if (feature) {
+          // console.log(feature)
+          _that.clickMapVolunteer(feature.values_.properties.info)
+
+        }
+
+      });
+    },
+
+    //点击项目
+    async clickMapVolunteer (info) {
+
+      if (!info.id) {
+        return false
+      }
+      if (!info.latitude || !info.longitude) {
+        this.$message.warning("请先完善坐标位置")
+        return false
+      }
+      this.selPlaceType = info.placeType
+      if (info.placeType === 'resi' || info.placeType === 'special_resi') {//综合治理图层和公共服务图层中的失能人员、失智人员
+        // info.id = "dd0bd55db0ca4b629c40bc914a08368e"
+        this.selUserId = info.id
+        this.loadResi(info)
+      }
+      if (info.placeType === 'public_service') {//公共服务图层
+        this.loadPublicService(info)
+      }
+      if (info.placeType === 'dangerous_chemicals') {//重点危化品企业
+        this.loadDangerousChemicals(info)
+      }
+      if (info.placeType === 'event') {//难点痛点
+        this.loadEvent(info)
+      }
+      if (info.placeType === 'city_management') {//城市管理图层
+        this.loadCityManagement(info)
+      }
+      if (info.placeType === 'community_org') {//社区自组织
+        this.loadCommunityOrg(info)
+      }
+      if (info.placeType === 'superior_resource') {//优势资源
+        this.loadSuperiorResource(info)
+      }
+      if (info.placeType === 'group_rent') {//群租房
+        this.loadGroupRent(info)
+      }
+
+
+      if (info.placeType === 'party_unit') {//来自联建单位的机关直属部门
+        this.loadPartyUnit(info)
+      }
+      if (info.placeType === 'enterprise_patrol') {//来自企事业查询的
+        this.loadEnterprisePartrol(info)
+      }
+
+
+    },
+
+    async loadResi (info) {
+      const url = "/epmetuser/icresiuser/resi-brief/" + info.id
+      // const url = "http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/distribution"
+
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.icUserName = data.icUserName ? data.icUserName : '--'
+        data.gridName = data.gridName ? data.gridName : '--'
+        data.villageName = data.villageName ? data.villageName : '--'
+        data.mobile = data.mobile ? data.mobile : '--'
+        data.idCard = data.idCard ? data.idCard : '--'
+        data.birthday = data.birthday ? data.birthday : '--'
+        data.contacts = data.contacts ? data.contacts : '--'
+        data.contactsMobile = data.contactsMobile ? data.contactsMobile : '--'
+
+        data.isBdhjShow = data.isBdhj ? data.isBdhj === '0' ? '否' : '是' : '--'
+        data.genderShow = data.gender ? data.gender === '0' ? '女' : '男' : '--'
+        if (data.rhzk === 'rhyz') {
+          data.rhzkShow = '人户一致'
+        } else if (data.rhzk === 'rzhbz') {
+          data.rhzkShow = '人在户不在'
+        } else if (data.rhzk === 'hzrbz') {
+          data.rhzkShow = '户在人不在'
+        } else {
+          data.rhzkShow = '--'
+        }
+
+        let categoriesArray = []
+
+        for (let key in data.volunteerCategories) {
+          categoriesArray.push(data.volunteerCategories[key])
+
+        }
+
+        if (categoriesArray.length > 0) {
+          data.categories = categoriesArray.join(',')
+        } else {
+          data.categories = '--'
+        }
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadPublicService (info) {
+      const url = "/gov/org/icPublicService/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icPublicService/detail"
+
+      let params = {
+        icPublicServiceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadEvent (info) {
+      const url = "/gov/project/icEvent/detail";
+      //const url = "http://yapi.elinkservice.cn/mock/245/api/gov/project/icEvent/processAnalysis/eventDetail/" + this.eventId;
+
+      const { data, code, msg } = await requestPost(url, {
+        icEventId: info.id,
+      });
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+        this.handleShowPopup(coordinate)
+
+
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadDangerousChemicals (info) {
+      const url = "/gov/org/icDangerousChemicals/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icDangerousChemicals/detail"
+
+      let params = {
+        icSuperiorResourceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.safeDistance = data.safeDistance ? data.safeDistance : '--'
+        data.dangerTypeName = data.dangerTypeName ? data.dangerTypeName : '--'
+        data.principalName = data.principalName ? data.principalName : '--'
+        data.principalMobile = data.principalMobile ? data.principalMobile : '--'
+        data.address = data.address ? data.address : '--'
+        data.remark = data.remark ? data.remark : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadCityManagement (info) {
+      const url = "/gov/org/icCityManagement/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icCityManagement/detail"
+
+      let params = {
+        icCityManagementId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadCommunityOrg (info) {
+      // const url = "/gov/org/icCityManagement/detail"
+      const url = "/heart/iccommunityselforganization/community-self-org-detail/" + info.id
+
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.orgPersonArray = []
+        data.organizationPersonnel.forEach(element => {
+          let orgPersonnel = element.personName + "(" + element.personPhone + ")"
+          data.orgPersonArray.push(orgPersonnel)
+        });
+
+        data.organizationPersonnelShow = data.orgPersonArray.join(",")
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadSuperiorResource (info) {
+      const url = "/gov/org/icSuperiorResource/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icSuperiorResource/detail"
+
+      let params = {
+        icSuperiorResourceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadEnterprisePartrol (info) {
+      const url = "/gov/org/enterprise/detail/" + info.id
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/enterprise/detail"
+
+      const { data, code, msg } = await requestPost(url)
+
+      if (code === 0) {
+        // debugger
+        let coordinate = [info.longitude, info.latitude]
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    async loadGroupRent (info) {
+      const url = "/gov/org/ichouse/" + info.id
+
+      const { data, code, msg } = await requestGet(url)
+
+      if (code === 0) {
+        // debugger
+        let coordinate = [info.longitude, info.latitude]
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    async loadPartyUnit (info) {
+      const url = '/heart/icpartyunit/detail'
+      // const url = 'http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/detail'
+      let params = {
+        id: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        if (!data.serviceMatterList || !Array.isArray(data.serviceMatterList)) {
+          data.serviceMatterList = []
+        } else {
+          data.serviceMatterListShow = data.serviceMatterNameList.join(',')
+        }
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+
+    handleShowPopup (coordinate) {
+
+      // console.log(this.overlay.getElement())
+      let content = document.getElementById("popup-content");
+      this.overlay.getElement().style.display = 'block'
+      this.overlay.getElement().parentNode.style.display = 'block'
+      this.overlay.getElement().parentNode.parentNode.style.display = 'block'
+      // content.innerHTML = showData;
+      this.overlay.setPosition(coordinate);
+      //把 overlay 显示到指定的 x,y坐标
+
+    },
+    // 关闭弹窗
+    handleClosePopup () {
+      this.overlay.setPosition(undefined);
+      document.getElementById("popup-closer").blur();
+      return false;
+    },
+
+    //点击图层
+    async handleClickCoverage (index) {
+      this.demand.pageNo = 1
+      this.coverageTypesList[index].select = !this.coverageTypesList[index].select
+      let item = this.coverageTypesList[index]
+
+      this.$set(this.coverageTypesList, index, item)
+
+      this.coverageTypes = []
+
+      this.coverageTypesList.forEach(element => {
+        if (element.select) {
+          this.coverageTypes.push(element.value)
+        }
+      });
+
+      await this.loadCategoryList()
+      this.getTable();
+      this.getMapTable();
+    },
+
+    //点击类别
+    async handleClickCategory (index, colIndex) {
+      this.demand.pageNo = 1
+      this.categoryListshow[index][colIndex].sel = !this.categoryListshow[index][colIndex].sel
+
+      // this.categoryList[index * 4 + colIndex].sel = !this.categoryList[index * 4 + colIndex].sel
+
+      let array = this.categoryListshow[index]
+      let item = this.categoryListshow[index][colIndex]
+
+
+      this.$set(this.categoryListshow[index], colIndex, item)
+      this.$set(this.categoryListshow, index, array)
+
+      this.categoryKeys = []
+
+      this.categoryList.forEach(element => {
+        if (element.sel) {
+          this.categoryKeys.push(element.categoryKey)
+        }
+      });
+
+      this.getTable();
+      this.getMapTable();
+    },
+    handleSearch () {
+      this.demand.pageNo = 1
+      this.getTable();
+      this.getMapTable();
+    },
+    //
+    handleClickRow (index) {
+      let selData = this.tableList[index]
+      if (selData.longitude && selData.latitude) {
+        mapView.setCenter([selData.longitude, selData.latitude]);
+      }
+
+      this.clickMapVolunteer(selData)
+
+      // alert(index)
+    },
+
+    handlePageNoChange_demand (val) {
+      this.demand.pageNo = val;
+      this.getTable();
+    },
+
+    async loadCategoryList () {
+      const url = "/gov/org/coverage/categoryList"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/coverage/categoryList"
+      let params = {
+        coverageTypes: this.coverageTypes,
+
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.categoryList = data
+
+        this.categoryKeys = []
+
+        this.categoryListshow = []
+        let itemArray = []
+
+        this.categoryList.forEach((item, index) => {
+
+          item.dataIcon = this.iconUrlArray[item.categoryKey]
+
+
+          item.sel = true
+          this.categoryKeys.push(item.categoryKey)
+
+        });
+
+        let chunk = 4
+        for (let i = 0, j = this.categoryList.length; i < j; i += chunk) {
+          this.categoryListshow.push(this.categoryList.slice(i, i + chunk))
+        }
+
+
+        // console.log(this.categoryListshow)
+        // console.log(this.categoryList)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    //加载组织数据
+    async getTable () {
+      this.demand.loading = true
+      const url = "/data/aggregator/coverage/dataList";
+      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
+      let params = {
+        coverageTypes: this.coverageTypes,
+        categoryKeys: this.categoryKeys,
+        search: this.search,
+        pageNo: this.demand.pageNo,
+        pageSize: this.demand.pageSize,
+        isPage: true
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+      this.demand.loading = false;
+
+      if (code === 0) {
+
+        this.demand.total = data.total;
+
+        this.tableList = data.list
+        this.demand.list = data.list
+        this.demand.list.forEach(item => {
+          item.imgObj = {
+            type: 'img',
+            src: this.iconUrlArray[item.categoryKey]
+          }
+        });
+
+
+        this.demand.list = this.demand.list.map((item) => {
+          return [
+            // item.categoryKey ? item.categoryKey : '--',
+
+            item.imgObj,
+            item.categoryName,
+            item.content ? item.content : '',
+
+          ];
+        });
+        console.log(this.demand.list)
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    //加载组织数据
+    async getMapTable () {
+
+      const url = "/data/aggregator/coverage/dataList";
+      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
+      let params = {
+        coverageTypes: this.coverageTypes,
+        categoryKeys: this.categoryKeys,
+        search: this.search,
+        // pageNo: 1,
+        // pageSize: 2000,
+        isPage: false
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+
+      if (code === 0) {
+
+        this.demand.total = data.total;
+
+        this.iconArrays = data.list
+
+        this.iconArrays.forEach((item, index) => {
+          item.url = this.iconUrlArray[item.categoryKey]
+
+        });
+        // console.log(this.iconArrays)
+        this.loadIcon()
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载icon图标
+    loadIcon () {
+
+      iconSource.clear()//清空多边形标注
+      if (this.iconArrays && this.iconArrays.length > 0) {
+
+        let iconFeatures = [];
+
+        this.iconArrays.forEach((oneIcon, index) => {
+          //添加标注
+
+          let iconItem = new Feature({
+            geometry: new Point([oneIcon.longitude, oneIcon.latitude]),
+            id: oneIcon.id,
+            properties: {
+              type: "icon",
+              info: { ...oneIcon }
+            }
+          });
+          // console.log('oneIcon----', this.iconUrlArray[oneIcon.urlIndex])
+          let iconStyle = new Style({
+            image: new Icon({
+              // anchor: [0.5, 0.5],
+              imgSize: [60, 60],
+              // scale: 0.5,
+              // src: oneIcon.urlIndex && this.iconUrlArray[oneIcon.urlIndex] || this.iconUrlArray[0] || this.iconUrlArray[0]
+              src: oneIcon.url
+            }),
+            // text: createTextStyle(oneIcon)
+          });
+
+          iconItem.setStyle(iconStyle);
+
+          // if (this.distanceMax) {
+          //   if (this.computedDistance(oneIcon.longitude, oneIcon.latitude, this.distanceMax)) {
+          //     iconFeatures.push(iconItem);
+          //   }
+          // } else {
+          iconFeatures.push(iconItem);
+          // }
+
+
+        });
+
+        iconSource.addFeatures(iconFeatures);
+      }
+    },
+
+    //刷新地图
+    async refreshMap (isRefreshView) {
+
+      //加载组织数据
+      await this.loadOrgData()
+
+      //绘制父级组织数据
+      this.loadParentPolygon()
+      //绘制本级组织数据
+      this.loadPolygon(this.subAgencyArray)
+
+      //重置地图中心点
+
+      // if (isRefreshView) {
+      // this.setMapLocation()
+
+      // }
+
+      await this.getTable(false);
+
+    },
+
+    //设置地图定位的中心点和缩放级别
+    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);
+
+    },
+
+    //返回所选组织
+    handleClickRouter (index) {
+
+      this.showPeopleInfo = false
+
+
+
+    },
+
+    //加载组织数据
+    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
+      }
+
+    },
+
+    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()
+
+      let layerOrigin = 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: false,
+          crossOrigin: 'anonymous'
+        }),
+        // zIndex: 20,
+
+      });
+
+
+      //openlayer 像素转换类，可以直接当做source使用
+      const raster = new RasterSource({
+        sources: [
+          //传入图层，这里是天地图矢量图或者天地图矢量注记
+          layerOrigin,
+        ],
+        //这里设置为image类型，与官方示例不同，优化速度
+        operationType: 'image',
+        operation: function (pixels, data) {
+          //执行颜色转换方法，注意，这里的方法需要使用lib引入进来才可以使用
+          // reverseFunc(pixels[0].data)
+          // debugger
+          // let pixelsTemp = pixels[0].data
+          //蓝色
+
+
+          for (var i = 0; i < pixels[0].data.length; i += 4) {
+            var r = pixels[0].data[i];
+            var g = pixels[0].data[i + 1];
+            var b = pixels[0].data[i + 2];
+            //运用图像学公式，设置灰度值
+            var grey = r * 0.3 + g * 0.59 + b * 0.11;
+            //将rgb的值替换为灰度值
+            pixels[0].data[i] = grey;
+            pixels[0].data[i + 1] = grey;
+            pixels[0].data[i + 2] = grey;
+
+            //基于灰色，设置为蓝色，这几个数值是我自己试出来的，可以根据需求调整
+            pixels[0].data[i] = 55 - pixels[0].data[i];
+            pixels[0].data[i + 1] = 255 - pixels[0].data[i + 1];
+            pixels[0].data[i + 2] = 305 - pixels[0].data[i + 2];
+          }
+
+          return pixels[0];
+        },
+        //线程数量
+        threads: 10,
+        //允许operation使用外部方法
+        // lib: {
+        //   reverseFunc: reverseFunc,
+        // }
+      });
+
+
+      mapView = new View({
+        //中心点坐标
+        center: this.centerPoint,
+        // projection: 'EPSG:3857',
+        projection: 'EPSG:4326',
+        zoom: this.zoom,
+        minZoom: this.minZoom
+      })
+
+      //初始化map和地图底图
+      //创建地图容器
+      map = new Map({
+        layers: [layerOrigin],
+        //加载瓦片图层数据
+        view: mapView,
+        target: 'map'
+        //目标加载到map中
+      })
+
+      //创建新图层，注意，必须使用 ImageLayer
+      let layer = new ImageLayer({
+        name: "天地图矢量图层",
+        source: raster
+      });
+      //添加到地图
+      map.addLayer(layer)
+
+      // //标注图层
+      // var sourceMark = new XYZ({
+      //   url: 'http://t2.tianditu.com/DataServer?T=cva_w&tk=8a08c117ab9ee45d508686b01cc8d397&x={x}&y={y}&l={z}',
+      //   crossOrigin: 'anonymous'
+      // });
+      // var tileMark = new TileLayer({
+      //   id: "tileMark",
+      //   title: "标注图层",
+      //   layerName: "baseMap",
+      //   source: sourceMark,
+
+      // });
+
+      // map.addLayer(tileMark)
+
+      // mapView.setCenter([120.32283313, 36.11188423])
+      // mapView.setZoom(13)
+
+    },
+
+    reverseFunc (pixelsTemp) {
+      //蓝色
+      for (var i = 0; i < pixelsTemp.length; i += 4) {
+        var r = pixelsTemp[i];
+        var g = pixelsTemp[i + 1];
+        var b = pixelsTemp[i + 2];
+        //运用图像学公式，设置灰度值
+        var grey = r * 0.3 + g * 0.59 + b * 0.11;
+        //将rgb的值替换为灰度值
+        pixelsTemp[i] = grey;
+        pixelsTemp[i + 1] = grey;
+        pixelsTemp[i + 2] = grey;
+
+        //基于灰色，设置为蓝色，这几个数值是我自己试出来的，可以根据需求调整
+        pixelsTemp[i] = 55 - pixelsTemp[i];
+        pixelsTemp[i + 1] = 255 - pixelsTemp[i + 1];
+        pixelsTemp[i + 2] = 305 - pixelsTemp[i + 2];
+      }
+    },
+    //添加标注图层
+    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 => {
+
+      // });
+
+    },
+
+    addIconLayer () {
+      iconSource = new VectorSource({
+
+        //features: (new GeoJSON()).readFeatures(geojsonObject)
+      });
+
+      iconLayer = new VectorLayer({
+        source: iconSource,
+        zIndex: 70
+      });
+
+      map.addLayer(iconLayer);
+
+    },
+
+    //开启加载动画
+    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: { cptTb, cptCard, ScreenLoading, People },
+}
+export default vueGis;
+</script>
+
+<style
+  lang="scss"
+  src="@/assets/scss/modules/visual/fiveLayerMap.scss"
+  scoped
+></style>
+
+<style lang="scss" >
+.div_content {
+  .ol-viewport {
+    border-radius: 5px;
+  }
+}
+.ol-overlaycontainer-stopevent {
+  display: none;
+}
+</style> 
+
+<style lang="scss" scoped>
+.popTitle {
+  font-size: 16px;
+  color: #ffffff;
+  padding-bottom: 5px;
+}
+
+.info-prop {
+  position: relative;
+  margin: 10px 0;
+  display: flex;
+  padding-left: 15px;
+  font-size: 12px;
+
+  .info-pics {
+    display: flex;
+    margin: 10px 0;
+    img {
+      display: block;
+      width: 32%;
+      height: 90px;
+      margin-right: 9px;
+      object-fit: cover;
+    }
+  }
+  > span,
+  > div {
+    display: block;
+    max-width: 300px;
+  }
+}
+
+.popContentTitle {
+  font-size: 14px;
+  color: #ffffff;
+  margin-top: 5px;
+  line-height: 20px;
+}
+
+.div_resi_more {
+  display: flex;
+  justify-content: center;
+  margin-top: 20px;
+}
+
+.span_resi_more {
+  font-size: 16px;
+  text-decoration: underline;
+}
+.span_resi_more:hover {
+  cursor: pointer;
+}
+</style>
+
+<style lang="scss" >
+.div_search_list {
+  .el-input__inner[WarningColor="warning"] {
+    border-radius: 8px 0 0 8px;
+    height: 48px;
+    background-color: #01106800;
+    border: 0px solid #0082fb;
+    padding: 0 0 0 70px;
+    font-size: 18px;
+    font-family: PingFang SC;
+    font-weight: 400;
+    color: #ffffff;
+  }
+  .el-input__inner {
+    &::placeholder {
+      padding: 0;
+      margin: 0;
+
+      font-size: 18px;
+    }
+  }
+}
+
+.ol-popup {
+  position: absolute;
+  background-color: #1258c9da;
+  -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+  padding: 15px;
+  border-radius: 10px;
+  border: 1px solid #1257c9;
+  bottom: 12px;
+  left: -50px;
+  text-align: left;
+}
+.ol-popup:after,
+.ol-popup:before {
+  top: 100%;
+  border: solid transparent;
+  content: " ";
+  height: 0;
+  width: 0;
+  position: absolute;
+  pointer-events: none;
+}
+.ol-popup:after {
+  border-top-color: 1257c9;
+  border-width: 10px;
+  left: 48px;
+  margin-left: -10px;
+}
+.ol-popup:before {
+  border-top-color: #1257c9;
+  border-width: 11px;
+  left: 48px;
+  margin-left: -11px;
+}
+.ol-popup-closer {
+  text-decoration: none;
+  position: absolute;
+  top: 2px;
+  right: 8px;
+}
+.popup-content {
+  width: 300px;
+
+  .div-pop {
+  }
+}
+
+.ol-popup-closer:after {
+  content: "✖";
+  // color: rgba(1, 17, 104, 1);
+  color: #fff;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy.vue b/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy.vue
new file mode 100644
index 000000000..efc340ebf
--- /dev/null
+++ b/src/views/modules/visual/communityGovern/fivelayers/mapIndex copy.vue	
@@ -0,0 +1,1987 @@
+<template>
+  <div style="position: relative">
+
+    <!-- 组织路由 -->
+
+    <div class="div_top">
+      <div class="router_line"></div>
+      <div class="div_router">
+        <div v-if="!showPeopleInfo">
+          <span class="router_child">五大图层</span>
+        </div>
+        <div v-if="showPeopleInfo"> <span class="router_parents"
+                @click="handleClickRouter">五大图层<span class="arrow">></span></span>
+
+          <span class="router_child">个人档案</span>
+        </div>
+      </div>
+    </div>
+
+    <div v-show="!showPeopleInfo"
+         class="div_content">
+
+      <div class="div_map"
+           id="map"
+           ref="map">
+      </div>
+
+      <div class="div_data">
+
+        <div class="div_tips">
+
+          <div class="div_coverage">
+
+            <div class="coverage_item"
+                 @click="handleClickCoverage(index)"
+                 v-for="(item,index) in coverageTypesList"
+                 :key="index">
+              <img :src="item.select?selImg:noSelImg" />
+              <span>{{item.label}}</span>
+            </div>
+          </div>
+          <div class="div_category">
+            <el-scrollbar style="height:98%">
+
+              <div v-for="(item,index) in categoryListshow"
+                   :key="index"
+                   class="category_item">
+
+                <div v-for="(colItem,colIndex) in item"
+                     :key="colIndex"
+                     class="list_item"
+                     @click="handleClickCategory(index,colIndex)">
+                  <img :src="colItem.dataIcon"
+                       alt />
+                  <div :class="['item_content',colItem.sel?'item_content_sel':'']">{{colItem.categoryName}}
+
+                  </div>
+
+                </div>
+
+              </div>
+
+            </el-scrollbar>
+          </div>
+        </div>
+
+        <div class="div_info">
+          <div class="div_search_list">
+            <el-input size="mini"
+                      WarningColor='warning'
+                      placeholder="请输入搜索内容"
+                      v-model="search">
+              <i slot="prefix"
+                 class="icon">
+                <img src="../../../../../assets/img/modules/visual/sousuo.png"
+                     alt />
+              </i>
+            </el-input>
+
+            <div class="btn"
+                 @click="handleSearch">搜索</div>
+
+          </div>
+          <div class="m-tb">
+
+            <div class="tb">
+              <cpt-tb :col-list="demand.colList"
+                      :loading="demand.loading"
+                      :header="demand.header"
+                      :list="demand.list"
+                      @handleClickRow="handleClickRow"></cpt-tb>
+
+            </div>
+            <div class="m-pagination">
+              <el-pagination :current-page="demand.pageNo"
+                             :page-size="demand.pageSize"
+                             :total="demand.total"
+                             background
+                             layout="prev, pager, next,total"
+                             @current-change="handlePageNoChange_demand">
+              </el-pagination>
+            </div>
+          </div>
+
+        </div>
+
+      </div>
+    </div>
+    <div id="popup"
+         style="display: none;"
+         class="ol-popup">
+      <a href="#"
+         id="popup-closer"
+         class="ol-popup-closer"></a>
+
+      <div id="popup-content"
+           class="popup-content">
+        <div v-show="selPlaceType==='resi'|| selPlaceType === 'special_resi'">
+          <div class="popTitle">居民信息</div>
+          <div class="popContentTitle">姓名：
+            <span>{{ selInfo.icUserName }}</span>
+          </div>
+          <div class="popContentTitle">所属网格：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">所属小区：
+            <span>{{ selInfo.villageName }}</span>
+          </div>
+          <div class="popContentTitle">本地户籍：
+            <span>{{ selInfo.isBdhjShow }}</span>
+          </div>
+
+          <div class="popContentTitle">手机：
+            <span>{{ selInfo.mobile }}</span>
+          </div>
+          <div class="popContentTitle">性别：
+            <span>{{ selInfo.genderShow }}</span>
+          </div>
+          <div class="popContentTitle">身份证号：
+            <span>{{ selInfo.idCard }}</span>
+          </div>
+
+          <div class="popContentTitle">工作单位：
+            <span>{{ selInfo.gzdw?selInfo.gzdw:'--' }}</span>
+          </div>
+          <div class="popContentTitle">人户状况：
+            <span>{{ selInfo.rhzkShow }}</span>
+          </div>
+          <div class="div_resi_more">
+            <div @click="toPeople"
+                 class="span_resi_more">更多</div>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='dangerous_chemicals'">
+          <div class="popTitle">企业信息</div>
+          <div class="popContentTitle">企业名称：
+            <span>{{ selInfo.name }}</span>
+          </div>
+          <div class="popContentTitle">企业类型：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">周边安全距离：
+            <span>{{ selInfo.safeDistance }}</span>
+          </div>
+          <div class="popContentTitle">危化品种类：
+            <span>{{ selInfo.dangerTypeName }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.principalName }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.principalMobile }}</span>
+          </div>
+          <div class="popContentTitle">经营地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+          <div class="popContentTitle">备注：
+            <span>{{ selInfo.remark }}</span>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='public_service'||selPlaceType==='city_management'||selPlaceType==='superior_resource'">
+          <div class="popTitle">场所信息</div>
+          <div class="popContentTitle">场所名称：
+            <span>{{ selInfo.name }}</span>
+          </div>
+          <div class="popContentTitle">场所分类：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">占地面积：
+            <span>{{ selInfo.areaCovered }}</span>
+          </div>
+          <div class="popContentTitle">容纳人数：
+            <span>{{ selInfo.capacity }}</span>
+          </div>
+          <div class="popContentTitle">地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='event'">
+          <div class="popTitle">难点痛点</div>
+          <div class="popContentTitle">所属网格：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">发生时间：
+            <span>{{ selInfo.happenTime }}</span>
+          </div>
+          <div class="popContentTitle">事件内容：
+            <span>{{ selInfo.eventContent }}</span>
+          </div>
+
+          <div v-if="selInfo.imageList&&selInfo.imageList.length>0"
+               class="info-prop">
+            <span>图片：</span>
+            <div class="info-pics">
+              <img :src="src"
+                   :key="src"
+                   style="width:100px;height:100px;padding-right:10px"
+                   v-for="src in eventInfo.imageList"
+                   @click="watchImg(src)" />
+
+            </div>
+          </div>
+
+          <div v-if="selInfo.voiceList&&selInfo.voiceList.length>0"
+               class="info-prop">
+            <span>音频：</span>
+            <div class="info-pics">
+              <audio controls>
+                <source :src="item.url"
+                        type=""
+                        :key="item.url"
+                        v-for="item in eventInfo.voiceList" />
+              </audio>
+
+            </div>
+
+          </div>
+          <div class="popContentTitle">反映渠道：
+            <span>{{ selInfo.sourceTypeName|| "--" }}</span>
+          </div>
+          <div class="popContentTitle">地址：
+            <span>{{ selInfo.address || "--" }}</span>
+          </div>
+          <div class="popContentTitle">报事人：
+            <span>{{selInfo.name || "--" }}</span>
+          </div>
+          <div class="popContentTitle">手机号：
+            <span>{{ selInfo.mobile || "--" }}</span>
+          </div>
+          <div class="popContentTitle">身份证号：
+            <span>{{ selInfo.idCard || "--" }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='community_org'">
+          <div class="popTitle">组织信息</div>
+          <div class="popContentTitle">组织名称：
+            <span>{{ selInfo.organizationName }}</span>
+          </div>
+          <div class="popContentTitle">组织分类：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">组织人数：
+            <span>{{ selInfo.organizationPersonCount }}</span>
+          </div>
+          <div class="popContentTitle">组织成员：
+            <span>{{ selInfo.organizationPersonnelShow }}</span>
+          </div>
+          <div class="popContentTitle">服务事项：
+            <span>{{ selInfo.serviceItem }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.principalName }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.principalPhone }}</span>
+          </div>
+          <div class="popContentTitle">创建时间：
+            <span>{{ selInfo.organizationCreatedTime }}</span>
+          </div>
+        </div>
+
+        <div v-show="selPlaceType==='group_rent'">
+          <div class="popTitle">房屋信息</div>
+          <div class="popContentTitle">房屋名称：
+            <span>{{ selInfo.houseName }}</span>
+          </div>
+          <div class="popContentTitle">房屋类型：
+            <span>{{ selInfo.houseTypeName }}</span>
+          </div>
+          <div class="popContentTitle">房屋用途：
+            <span>{{ selInfo.purposeName }}</span>
+          </div>
+          <div class="popContentTitle">房屋状态：
+            <span>{{ selInfo.rentName }}</span>
+          </div>
+          <div class="popContentTitle">房主姓名：
+            <span>{{ selInfo.ownerName }}</span>
+          </div>
+          <div class="popContentTitle">联系方式：
+            <span>{{ selInfo.ownerPhone }}</span>
+          </div>
+          <div class="popContentTitle">房主身份证：
+            <span>{{ selInfo.ownerIdCard }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='enterprise_patrol'">
+          <div class="popTitle">企事业信息</div>
+          <div class="popContentTitle">场所类型：
+            <span>{{ selInfo.placeTypeName }}</span>
+          </div>
+          <div class="popContentTitle">场所区域：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">场所名称：
+            <span>{{ selInfo.placeOrgName }}</span>
+          </div>
+          <div class="popContentTitle">场所地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+          <div class="popContentTitle">规模：
+            <span>{{ selInfo.scale }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.personInCharge }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.mobile }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='party_unit'">
+          <div class="popTitle">联建单位信息</div>
+          <div class="popContentTitle">单位名称：
+            <span>{{ selInfo.unitName }}</span>
+          </div>
+          <div class="popContentTitle">分类：
+            <span>{{ selInfo.typeName }}</span>
+          </div>
+          <div class="popContentTitle">服务事项：
+            <span>{{ selInfo.serviceMatterListShow }}</span>
+          </div>
+          <div class="popContentTitle">联系人：
+            <span>{{ selInfo.contact }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.contactMobile }}</span>
+          </div>
+          <div class="popContentTitle">在职党员：
+            <span>{{ selInfo.memberCount }}</span>
+          </div>
+          <div class="popContentTitle">备注：
+            <span>{{ selInfo.remark }}</span>
+          </div>
+          <div class="popContentTitle">地理位置：
+            <span>{{ selInfo.address }}</span>
+          </div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <people v-if="showPeopleInfo"
+            :uid="selUserId"
+            ref="ref_people"></people>
+  </div>
+
+</template>
+
+<script>
+import 'ol/ol.css'
+import { Map, View } from 'ol'
+import TileLayer from 'ol/layer/Tile.js';
+import ImageLayer from 'ol/layer/Image';
+import { Raster as RasterSource } from 'ol/source';
+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, requestGet } from "@/js/dai/request";
+
+
+import cptTb from "@/views/modules/visual/cpts/tb";
+import cptCard from "@/views/modules/visual/cpts/card";
+import ScreenLoading from "@/views/modules/visual/cpts/loading";
+import People from "../../basicinfo/people";
+
+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)
+    });;
+  };
+})()
+
+//定义颜色转换方法
+let reverseFunc = function (pixelsTemp) {
+  //蓝色
+  for (var i = 0; i < pixelsTemp.length; i += 4) {
+    var r = pixelsTemp[i];
+    var g = pixelsTemp[i + 1];
+    var b = pixelsTemp[i + 2];
+    //运用图像学公式，设置灰度值
+    var grey = r * 0.3 + g * 0.59 + b * 0.11;
+    //将rgb的值替换为灰度值
+    pixelsTemp[i] = grey;
+    pixelsTemp[i + 1] = grey;
+    pixelsTemp[i + 2] = grey;
+
+    //基于灰色，设置为蓝色，这几个数值是我自己试出来的，可以根据需求调整
+    pixelsTemp[i] = 55 - pixelsTemp[i];
+    pixelsTemp[i + 1] = 255 - pixelsTemp[i + 1];
+    pixelsTemp[i + 2] = 305 - pixelsTemp[i + 2];
+  }
+};
+
+
+const vueGis = {
+  name: 'HomeMap',
+  data () {
+    return {
+      centerPoint: [],//中心点位置
+      zoom: 14,//缩放范围：区14
+      minZoom: 1,//最小缩放
+
+      orgData: {},//当前组织对象
+      orgId: '',
+      orgLevel: '',
+
+      subAgencyArray: [],//下拉框数据
+      iconCoordinators: [],
+      currentCoordinate: null,
+      overlay: null,
+
+      //右侧搜索
+      searchName: "",
+
+      //右侧列表
+      infoLoading: true,
+      listData: [],//得到的数据
+      listDatashow: [],//处理成一行两列的数据
+
+      //下钻层级记录
+      runNum: 0,
+      routerArray: [],
+      center: [],
+      zoom: null,
+      parentPolygon: [],
+
+      centerFlag: 'point',//定义中心点的flag  point点 fit 自适应
+
+      coverageTypesList: [//图层类型。五大图层：zhzl：综合治理图层；yjcl：应急处置图层；aqsc：安全生产图层；csgl：城市管理图层；ggfw：公共服务图层
+        {
+          select: true,
+          label: '综合治理图层',
+          value: 'zhzl'
+        },
+        {
+          select: false,
+          label: '应急处置图层',
+          value: 'yjcl'
+        },
+        {
+          select: false,
+          label: '安全生产图层',
+          value: 'aqsc'
+        },
+        {
+          select: false,
+          label: '城市管理图层',
+          value: 'csgl'
+        },
+        {
+          select: false,
+          label: '公共服务图层',
+          value: 'ggfw'
+        },
+      ],
+      categoryList: [],//分类列表
+      categoryListshow: [],//处理成一行四列的数据
+
+      selImg: require('../../../../../assets/img/shuju/xuanzhong.png'),
+      noSelImg: require('../../../../../assets/img/shuju/weixuan.png'),
+
+      coverageTypes: ['zhzl'],
+      categoryKeys: [],
+      search: '',
+      pageNo: 1,
+      pageSize: 10,
+
+      demand: {
+        loading: false,
+        colList: [
+          {
+            align: "center",
+            width: "15%",
+          },
+          {
+            align: "center",
+            width: "25%",
+          },
+          {
+            align: "center",
+            width: "60%",
+          },
+
+        ],
+        header: ["图例", "分类", "名称"],
+        list: [],
+        pageSize: 50,
+        pageNo: 1,
+        total: 0,
+      },
+
+      iconUrlArray: {
+
+        'anzhibangjiao': require('../../../../../assets/img/shuju/fiveLayer/anzhibangjiao.png'),
+        'buliangqingshaonian': require('../../../../../assets/img/shuju/fiveLayer/buliangqingshaonian.png'),
+        'shequjiaozheng': require('../../../../../assets/img/shuju/fiveLayer/shequjiaozheng.png'),
+        'resi_xfry': require('../../../../../assets/img/shuju/fiveLayer/resi_xfry.png'),
+        'xidurenyuan': require('../../../../../assets/img/shuju/fiveLayer/xidurenyuan.png'),
+        'xiejiaorenyuan': require('../../../../../assets/img/shuju/fiveLayer/xiejiaorenyuan.png'),
+        'zhaoshizhaohuojingshenbing': require('../../../../../assets/img/shuju/fiveLayer/zhaoshizhaohuojingshenbing.png'),
+
+
+        'yjdw': require('../../../../../assets/img/shuju/fiveLayer/yjdw.png'),
+        'sr_gy': require('../../../../../assets/img/shuju/fiveLayer/sr_gy.png'),
+        'sr_gc': require('../../../../../assets/img/shuju/fiveLayer/sr_gc.png'),
+        'whdw': require('../../../../../assets/img/shuju/fiveLayer/whdw.png'),
+        'sr_ggld': require('../../../../../assets/img/shuju/fiveLayer/sr_ggld.png'),
+        'lwh': require('../../../../../assets/img/shuju/fiveLayer/lwh.png'),
+        'sr_tyc': require('../../../../../assets/img/shuju/fiveLayer/sr_tyc.png'),
+        'lyjlb': require('../../../../../assets/img/shuju/fiveLayer/lyjlb.png'),
+        'sr_yjy': require('../../../../../assets/img/shuju/fiveLayer/sr_yjy.png'),
+        'zaxld': require('../../../../../assets/img/shuju/fiveLayer/zaxld.png'),
+        'other': require('../../../../../assets/img/shuju/fiveLayer/other.png'),
+        'sr_jzz': require('../../../../../assets/img/shuju/fiveLayer/sr_jzz.png'),
+        'sr_djc': require('../../../../../assets/img/shuju/fiveLayer/sr_djc.png'),
+        'sr_rfqck': require('../../../../../assets/img/shuju/fiveLayer/sr_rfqck.png'),
+        'ep_lg': require('../../../../../assets/img/shuju/fiveLayer/ep_lg.png'),
+        'sr_xfz': require('../../../../../assets/img/shuju/fiveLayer/sr_xfz.png'),
+        'pu_jgzsbm': require('../../../../../assets/img/shuju/fiveLayer/pu_jgzsbm.png'),
+
+        'gr_czw': require('../../../../../assets/img/shuju/fiveLayer/gr_czw.png'),
+        'ep_cycs': require('../../../../../assets/img/shuju/fiveLayer/ep_cycs.png'),
+        'dc_jyz': require('../../../../../assets/img/shuju/fiveLayer/dc_jyz.png'),
+        'ep_gwylcs': require('../../../../../assets/img/shuju/fiveLayer/ep_gwylcs.png'),
+        'dc_jqz': require('../../../../../assets/img/shuju/fiveLayer/dc_jqz.png'),
+        'dc_whpdw': require('../../../../../assets/img/shuju/fiveLayer/dc_whpdw.png'),
+        'ep_wb': require('../../../../../assets/img/shuju/fiveLayer/ep_wb.png'),
+        'ep_mrxycs': require('../../../../../assets/img/shuju/fiveLayer/ep_mrxycs.png'),
+        'dc_yqhjz': require('../../../../../assets/img/shuju/fiveLayer/dc_yqhjz.png'),
+        'dc_jzgd': require('../../../../../assets/img/shuju/fiveLayer/dc_jzgd.png'),
+        'ep_scjgqy': require('../../../../../assets/img/shuju/fiveLayer/ep_scjgqy.png'),
+
+        'cm_nmsc': require('../../../../../assets/img/shuju/fiveLayer/cm_nmsc.png'),
+        'event_tdnd': require('../../../../../assets/img/shuju/fiveLayer/event_tdnd.png'),
+        'cm_bhsc': require('../../../../../assets/img/shuju/fiveLayer/cm_bhsc.png'),
+        'cm_cjsc': require('../../../../../assets/img/shuju/fiveLayer/cm_cjsc.png'),
+        'ep_lssd': require('../../../../../assets/img/shuju/fiveLayer/ep_lssd.png'),
+
+
+        'resi_szry': require('../../../../../assets/img/shuju/fiveLayer/resi_szry.png'),
+        'ps_lyy': require('../../../../../assets/img/shuju/fiveLayer/ps_lyy.png'),
+        'resi_snry': require('../../../../../assets/img/shuju/fiveLayer/resi_snry.png'),
+        'ps_mzb': require('../../../../../assets/img/shuju/fiveLayer/ps_mzb.png'),
+        'ps_zs': require('../../../../../assets/img/shuju/fiveLayer/ps_zs.png'),
+        'ps_wss': require('../../../../../assets/img/shuju/fiveLayer/ps_wss.png'),
+        'ps_jjz': require('../../../../../assets/img/shuju/fiveLayer/ps_jjz.png'),
+        'ep_xx': require('../../../../../assets/img/shuju/fiveLayer/ep_xx.png'),
+        'ep_yy': require('../../../../../assets/img/shuju/fiveLayer/ep_yy.png'),
+
+      },
+      iconArrays: [],
+      overlay: null,
+      showPopup: false,
+
+      selPlaceType: '',
+      selInfo: {},
+      selUserId: '',
+      showPeopleInfo: false
+
+    }
+  },
+  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.loadCategoryList()
+    this.getTable();
+    await this.getMapTable();
+
+
+    //初始化icon图层
+    this.addOverlay()
+
+    this.addMapClick()
+
+  },
+  methods: {
+
+    toPeople () {
+      this.showPeopleInfo = true
+    },
+
+    //添加覆盖层
+    addOverlay () {
+      // 使用变量存储弹窗所需的 DOM 对象
+      var container = document.getElementById("popup");
+      var closer = document.getElementById("popup-closer");
+      var content = document.getElementById("popup-content");
+
+
+      // 创建一个弹窗 Overlay 对象
+      this.overlay = new Overlay({
+        element: container, //绑定 Overlay 对象和 DOM 对象的
+        autoPan: true, // 定义弹出窗口在边缘点击时候可能不完整 设置自动平移效果
+        autoPanAnimation: {
+          duration: 250 //自动平移效果的动画时间 9毫秒
+        },
+        zIndex: 100
+      });
+      // 将弹窗添加到 map 地图中
+      map.addOverlay(this.overlay);
+      let _that = this;
+
+      /**
+       * 为弹窗添加一个响应关闭的函数
+       */
+      closer.onclick = function () {
+        _that.overlay.setPosition(undefined);
+        closer.blur();
+        return false;
+      };
+
+    },
+
+    //注册地图点击事件
+    addMapClick () {
+      let _that = this
+
+      map.on("click", function (evt) {
+        const feature = map.forEachFeatureAtPixel(evt.pixel, function (feature) {
+          return feature;
+        });
+        if (feature) {
+          // console.log(feature)
+          _that.clickMapVolunteer(feature.values_.properties.info)
+
+        }
+
+      });
+    },
+
+    //点击项目
+    async clickMapVolunteer (info) {
+
+      if (!info.id) {
+        return false
+      }
+      if (!info.latitude || !info.longitude) {
+        this.$message.warning("请先完善坐标位置")
+        return false
+      }
+      this.selPlaceType = info.placeType
+      if (info.placeType === 'resi' || info.placeType === 'special_resi') {//综合治理图层和公共服务图层中的失能人员、失智人员
+        // info.id = "dd0bd55db0ca4b629c40bc914a08368e"
+        this.selUserId = info.id
+        this.loadResi(info)
+      }
+      if (info.placeType === 'public_service') {//公共服务图层
+        this.loadPublicService(info)
+      }
+      if (info.placeType === 'dangerous_chemicals') {//重点危化品企业
+        this.loadDangerousChemicals(info)
+      }
+      if (info.placeType === 'event') {//难点痛点
+        this.loadEvent(info)
+      }
+      if (info.placeType === 'city_management') {//城市管理图层
+        this.loadCityManagement(info)
+      }
+      if (info.placeType === 'community_org') {//社区自组织
+        this.loadCommunityOrg(info)
+      }
+      if (info.placeType === 'superior_resource') {//优势资源
+        this.loadSuperiorResource(info)
+      }
+      if (info.placeType === 'group_rent') {//群租房
+        this.loadGroupRent(info)
+      }
+
+
+      if (info.placeType === 'party_unit') {//来自联建单位的机关直属部门
+        this.loadPartyUnit(info)
+      }
+      if (info.placeType === 'enterprise_patrol') {//来自企事业查询的
+        this.loadEnterprisePartrol(info)
+      }
+
+
+    },
+
+    async loadResi (info) {
+      const url = "/epmetuser/icresiuser/resi-brief/" + info.id
+      // const url = "http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/distribution"
+
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.icUserName = data.icUserName ? data.icUserName : '--'
+        data.gridName = data.gridName ? data.gridName : '--'
+        data.villageName = data.villageName ? data.villageName : '--'
+        data.mobile = data.mobile ? data.mobile : '--'
+        data.idCard = data.idCard ? data.idCard : '--'
+        data.birthday = data.birthday ? data.birthday : '--'
+        data.contacts = data.contacts ? data.contacts : '--'
+        data.contactsMobile = data.contactsMobile ? data.contactsMobile : '--'
+
+        data.isBdhjShow = data.isBdhj ? data.isBdhj === '0' ? '否' : '是' : '--'
+        data.genderShow = data.gender ? data.gender === '0' ? '女' : '男' : '--'
+        if (data.rhzk === 'rhyz') {
+          data.rhzkShow = '人户一致'
+        } else if (data.rhzk === 'rzhbz') {
+          data.rhzkShow = '人在户不在'
+        } else if (data.rhzk === 'hzrbz') {
+          data.rhzkShow = '户在人不在'
+        } else {
+          data.rhzkShow = '--'
+        }
+
+        let categoriesArray = []
+
+        for (let key in data.volunteerCategories) {
+          categoriesArray.push(data.volunteerCategories[key])
+
+        }
+
+        if (categoriesArray.length > 0) {
+          data.categories = categoriesArray.join(',')
+        } else {
+          data.categories = '--'
+        }
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadPublicService (info) {
+      const url = "/gov/org/icPublicService/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icPublicService/detail"
+
+      let params = {
+        icPublicServiceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadEvent (info) {
+      const url = "/gov/project/icEvent/detail";
+      //const url = "http://yapi.elinkservice.cn/mock/245/api/gov/project/icEvent/processAnalysis/eventDetail/" + this.eventId;
+
+      const { data, code, msg } = await requestPost(url, {
+        icEventId: info.id,
+      });
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+        this.handleShowPopup(coordinate)
+
+
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadDangerousChemicals (info) {
+      const url = "/gov/org/icDangerousChemicals/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icDangerousChemicals/detail"
+
+      let params = {
+        icSuperiorResourceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.safeDistance = data.safeDistance ? data.safeDistance : '--'
+        data.dangerTypeName = data.dangerTypeName ? data.dangerTypeName : '--'
+        data.principalName = data.principalName ? data.principalName : '--'
+        data.principalMobile = data.principalMobile ? data.principalMobile : '--'
+        data.address = data.address ? data.address : '--'
+        data.remark = data.remark ? data.remark : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadCityManagement (info) {
+      const url = "/gov/org/icCityManagement/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icCityManagement/detail"
+
+      let params = {
+        icCityManagementId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadCommunityOrg (info) {
+      // const url = "/gov/org/icCityManagement/detail"
+      const url = "/heart/iccommunityselforganization/community-self-org-detail/" + info.id
+
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.orgPersonArray = []
+        data.organizationPersonnel.forEach(element => {
+          let orgPersonnel = element.personName + "(" + element.personPhone + ")"
+          data.orgPersonArray.push(orgPersonnel)
+        });
+
+        data.organizationPersonnelShow = data.orgPersonArray.join(",")
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadSuperiorResource (info) {
+      const url = "/gov/org/icSuperiorResource/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icSuperiorResource/detail"
+
+      let params = {
+        icSuperiorResourceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadEnterprisePartrol (info) {
+      const url = "/gov/org/enterprise/detail/" + info.id
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/enterprise/detail"
+
+      const { data, code, msg } = await requestPost(url)
+
+      if (code === 0) {
+        // debugger
+        let coordinate = [info.longitude, info.latitude]
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    async loadGroupRent (info) {
+      const url = "/gov/org/ichouse/" + info.id
+
+      const { data, code, msg } = await requestGet(url)
+
+      if (code === 0) {
+        // debugger
+        let coordinate = [info.longitude, info.latitude]
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    async loadPartyUnit (info) {
+      const url = '/heart/icpartyunit/detail'
+      // const url = 'http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/detail'
+      let params = {
+        id: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        if (!data.serviceMatterList || !Array.isArray(data.serviceMatterList)) {
+          data.serviceMatterList = []
+        } else {
+          data.serviceMatterListShow = data.serviceMatterNameList.join(',')
+        }
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+
+    handleShowPopup (coordinate) {
+
+      // console.log(this.overlay.getElement())
+      let content = document.getElementById("popup-content");
+      this.overlay.getElement().style.display = 'block'
+      this.overlay.getElement().parentNode.style.display = 'block'
+      this.overlay.getElement().parentNode.parentNode.style.display = 'block'
+      // content.innerHTML = showData;
+      this.overlay.setPosition(coordinate);
+      //把 overlay 显示到指定的 x,y坐标
+
+    },
+    // 关闭弹窗
+    handleClosePopup () {
+      this.overlay.setPosition(undefined);
+      document.getElementById("popup-closer").blur();
+      return false;
+    },
+
+    //点击图层
+    async handleClickCoverage (index) {
+      this.demand.pageNo = 1
+      this.coverageTypesList[index].select = !this.coverageTypesList[index].select
+      let item = this.coverageTypesList[index]
+
+      this.$set(this.coverageTypesList, index, item)
+
+      this.coverageTypes = []
+
+      this.coverageTypesList.forEach(element => {
+        if (element.select) {
+          this.coverageTypes.push(element.value)
+        }
+      });
+
+      await this.loadCategoryList()
+      this.getTable();
+      this.getMapTable();
+    },
+
+    //点击类别
+    async handleClickCategory (index, colIndex) {
+      this.demand.pageNo = 1
+      this.categoryListshow[index][colIndex].sel = !this.categoryListshow[index][colIndex].sel
+
+      // this.categoryList[index * 4 + colIndex].sel = !this.categoryList[index * 4 + colIndex].sel
+
+      let array = this.categoryListshow[index]
+      let item = this.categoryListshow[index][colIndex]
+
+
+      this.$set(this.categoryListshow[index], colIndex, item)
+      this.$set(this.categoryListshow, index, array)
+
+      this.categoryKeys = []
+
+      this.categoryList.forEach(element => {
+        if (element.sel) {
+          this.categoryKeys.push(element.categoryKey)
+        }
+      });
+
+      this.getTable();
+      this.getMapTable();
+    },
+    handleSearch () {
+      this.demand.pageNo = 1
+      this.getTable();
+      this.getMapTable();
+    },
+    //
+    handleClickRow (index) {
+      let selData = this.tableList[index]
+      if (selData.longitude && selData.latitude) {
+        mapView.setCenter([selData.longitude, selData.latitude]);
+      }
+
+      this.clickMapVolunteer(selData)
+
+      // alert(index)
+    },
+
+    handlePageNoChange_demand (val) {
+      this.demand.pageNo = val;
+      this.getTable();
+    },
+
+    async loadCategoryList () {
+      const url = "/gov/org/coverage/categoryList"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/coverage/categoryList"
+      let params = {
+        coverageTypes: this.coverageTypes,
+
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.categoryList = data
+
+        this.categoryKeys = []
+
+        this.categoryListshow = []
+        let itemArray = []
+
+        this.categoryList.forEach((item, index) => {
+
+          item.dataIcon = this.iconUrlArray[item.categoryKey]
+
+
+          item.sel = true
+          this.categoryKeys.push(item.categoryKey)
+
+        });
+
+        let chunk = 4
+        for (let i = 0, j = this.categoryList.length; i < j; i += chunk) {
+          this.categoryListshow.push(this.categoryList.slice(i, i + chunk))
+        }
+
+
+        // console.log(this.categoryListshow)
+        // console.log(this.categoryList)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    //加载组织数据
+    async getTable () {
+      this.demand.loading = true
+      const url = "/data/aggregator/coverage/dataList";
+      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
+      let params = {
+        coverageTypes: this.coverageTypes,
+        categoryKeys: this.categoryKeys,
+        search: this.search,
+        pageNo: this.demand.pageNo,
+        pageSize: this.demand.pageSize,
+        isPage: true
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+      this.demand.loading = false;
+
+      if (code === 0) {
+
+        this.demand.total = data.total;
+
+        this.tableList = data.list
+        this.demand.list = data.list
+        this.demand.list.forEach(item => {
+          item.imgObj = {
+            type: 'img',
+            src: this.iconUrlArray[item.categoryKey]
+          }
+        });
+
+
+        this.demand.list = this.demand.list.map((item) => {
+          return [
+            // item.categoryKey ? item.categoryKey : '--',
+
+            item.imgObj,
+            item.categoryName,
+            item.content ? item.content : '',
+
+          ];
+        });
+        console.log(this.demand.list)
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    //加载组织数据
+    async getMapTable () {
+
+      const url = "/data/aggregator/coverage/dataList";
+      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
+      let params = {
+        coverageTypes: this.coverageTypes,
+        categoryKeys: this.categoryKeys,
+        search: this.search,
+        // pageNo: 1,
+        // pageSize: 2000,
+        isPage: false
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+
+      if (code === 0) {
+
+        this.demand.total = data.total;
+
+        this.iconArrays = data.list
+
+        this.iconArrays.forEach((item, index) => {
+          item.url = this.iconUrlArray[item.categoryKey]
+
+        });
+        // console.log(this.iconArrays)
+        this.loadIcon()
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载icon图标
+    loadIcon () {
+
+      iconSource.clear()//清空多边形标注
+      if (this.iconArrays && this.iconArrays.length > 0) {
+
+        let iconFeatures = [];
+
+        this.iconArrays.forEach((oneIcon, index) => {
+          //添加标注
+
+          let iconItem = new Feature({
+            geometry: new Point([oneIcon.longitude, oneIcon.latitude]),
+            id: oneIcon.id,
+            properties: {
+              type: "icon",
+              info: { ...oneIcon }
+            }
+          });
+          // console.log('oneIcon----', this.iconUrlArray[oneIcon.urlIndex])
+          let iconStyle = new Style({
+            image: new Icon({
+              // anchor: [0.5, 0.5],
+              // imgSize: [32, 32],
+              // scale: 0.5,
+              // src: oneIcon.urlIndex && this.iconUrlArray[oneIcon.urlIndex] || this.iconUrlArray[0] || this.iconUrlArray[0]
+              src: oneIcon.url
+            }),
+            // text: createTextStyle(oneIcon)
+          });
+
+          iconItem.setStyle(iconStyle);
+
+          // if (this.distanceMax) {
+          //   if (this.computedDistance(oneIcon.longitude, oneIcon.latitude, this.distanceMax)) {
+          //     iconFeatures.push(iconItem);
+          //   }
+          // } else {
+          iconFeatures.push(iconItem);
+          // }
+
+
+        });
+
+        iconSource.addFeatures(iconFeatures);
+      }
+    },
+
+    //刷新地图
+    async refreshMap (isRefreshView) {
+
+      //加载组织数据
+      await this.loadOrgData()
+
+      //绘制父级组织数据
+      this.loadParentPolygon()
+      //绘制本级组织数据
+      this.loadPolygon(this.subAgencyArray)
+
+      //重置地图中心点
+
+      // if (isRefreshView) {
+      // this.setMapLocation()
+
+      // }
+
+      await this.getTable(false);
+
+    },
+
+    //设置地图定位的中心点和缩放级别
+    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);
+
+    },
+
+    //返回所选组织
+    handleClickRouter (index) {
+
+      this.showPeopleInfo = false
+
+
+
+    },
+
+    //加载组织数据
+    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
+      }
+
+    },
+
+    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,
+        crossOrigin: 'anonymous'
+      });
+
+
+
+
+      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中
+      })
+
+
+      //去除双击放大效果
+      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 => {
+
+      // });
+
+    },
+
+    addIconLayer () {
+      iconSource = new VectorSource({
+        //features: (new GeoJSON()).readFeatures(geojsonObject)
+      });
+
+      iconLayer = new VectorLayer({
+        source: iconSource,
+        zIndex: 70
+      });
+
+      map.addLayer(iconLayer);
+
+    },
+
+    //开启加载动画
+    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: { cptTb, cptCard, ScreenLoading, People },
+}
+export default vueGis;
+</script>
+
+<style
+  lang="scss"
+  src="@/assets/scss/modules/visual/fiveLayerMap.scss"
+  scoped
+></style>
+
+<style lang="scss" >
+.div_content {
+  .ol-viewport {
+    border-radius: 5px;
+  }
+}
+.ol-overlaycontainer-stopevent {
+  display: none;
+}
+</style> 
+
+<style lang="scss" scoped>
+.popTitle {
+  font-size: 16px;
+  color: #ffffff;
+  padding-bottom: 5px;
+}
+
+.info-prop {
+  position: relative;
+  margin: 10px 0;
+  display: flex;
+  padding-left: 15px;
+  font-size: 12px;
+
+  .info-pics {
+    display: flex;
+    margin: 10px 0;
+    img {
+      display: block;
+      width: 32%;
+      height: 90px;
+      margin-right: 9px;
+      object-fit: cover;
+    }
+  }
+  > span,
+  > div {
+    display: block;
+    max-width: 300px;
+  }
+}
+
+.popContentTitle {
+  font-size: 12px;
+  color: #ffffff;
+  margin-top: 5px;
+}
+
+.div_resi_more {
+  display: flex;
+  justify-content: center;
+  margin-top: 20px;
+}
+
+.span_resi_more {
+  font-size: 16px;
+  text-decoration: underline;
+}
+.span_resi_more:hover {
+  cursor: pointer;
+}
+</style>
+
+<style lang="scss" >
+.div_search_list {
+  .el-input__inner[WarningColor="warning"] {
+    border-radius: 8px 0 0 8px;
+    height: 48px;
+    background-color: #01106800;
+    border: 0px solid #0082fb;
+    padding: 0 0 0 70px;
+    font-size: 18px;
+    font-family: PingFang SC;
+    font-weight: 400;
+    color: #ffffff;
+  }
+  .el-input__inner {
+    &::placeholder {
+      padding: 0;
+      margin: 0;
+
+      font-size: 18px;
+    }
+  }
+}
+
+.ol-popup {
+  position: absolute;
+  background-color: #1257c9;
+  -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+  padding: 15px;
+  border-radius: 10px;
+  border: 1px solid #1257c9;
+  bottom: 12px;
+  left: -50px;
+  text-align: left;
+}
+.ol-popup:after,
+.ol-popup:before {
+  top: 100%;
+  border: solid transparent;
+  content: " ";
+  height: 0;
+  width: 0;
+  position: absolute;
+  pointer-events: none;
+}
+.ol-popup:after {
+  border-top-color: 1257c9;
+  border-width: 10px;
+  left: 48px;
+  margin-left: -10px;
+}
+.ol-popup:before {
+  border-top-color: #1257c9;
+  border-width: 11px;
+  left: 48px;
+  margin-left: -11px;
+}
+.ol-popup-closer {
+  text-decoration: none;
+  position: absolute;
+  top: 2px;
+  right: 8px;
+}
+.popup-content {
+  width: 300px;
+}
+
+.ol-popup-closer:after {
+  content: "✖";
+  // color: rgba(1, 17, 104, 1);
+  color: #fff;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/visual/communityGovern/fivelayers/mapIndex-baidu.vue b/src/views/modules/visual/communityGovern/fivelayers/mapIndex-baidu.vue
new file mode 100644
index 000000000..049037cdb
--- /dev/null
+++ b/src/views/modules/visual/communityGovern/fivelayers/mapIndex-baidu.vue
@@ -0,0 +1,2071 @@
+<template>
+  <div style="position: relative">
+
+    <!-- 组织路由 -->
+
+    <div class="div_top">
+      <div class="router_line"></div>
+      <div class="div_router">
+        <div v-if="!showPeopleInfo">
+          <span class="router_child">五大图层</span>
+        </div>
+        <div v-if="showPeopleInfo"> <span class="router_parents"
+                @click="handleClickRouter">五大图层<span class="arrow">></span></span>
+
+          <span class="router_child">个人档案</span>
+        </div>
+      </div>
+    </div>
+
+    <div v-show="!showPeopleInfo"
+         class="div_content">
+
+      <div class="div_map"
+           id="map"
+           ref="map">
+      </div>
+
+      <div class="div_data">
+
+        <div class="div_tips">
+
+          <div class="div_coverage">
+
+            <div class="coverage_item"
+                 @click="handleClickCoverage(index)"
+                 v-for="(item,index) in coverageTypesList"
+                 :key="index">
+              <img :src="item.select?selImg:noSelImg" />
+              <span>{{item.label}}</span>
+            </div>
+          </div>
+          <div class="div_category">
+            <el-scrollbar style="height:98%">
+
+              <div v-for="(item,index) in categoryListshow"
+                   :key="index"
+                   class="category_item">
+
+                <div v-for="(colItem,colIndex) in item"
+                     :key="colIndex"
+                     class="list_item"
+                     @click="handleClickCategory(index,colIndex)">
+                  <img :src="colItem.dataIcon"
+                       alt />
+                  <div :class="['item_content',colItem.sel?'item_content_sel':'']">{{colItem.categoryName}}
+
+                  </div>
+
+                </div>
+
+              </div>
+
+            </el-scrollbar>
+          </div>
+        </div>
+
+        <div class="div_info">
+          <div class="div_search_list">
+            <el-input size="mini"
+                      WarningColor='warning'
+                      placeholder="请输入搜索内容"
+                      v-model="search">
+              <i slot="prefix"
+                 class="icon">
+                <img src="../../../../../assets/img/modules/visual/sousuo.png"
+                     alt />
+              </i>
+            </el-input>
+
+            <div class="btn"
+                 @click="handleSearch">搜索</div>
+
+          </div>
+          <div class="m-tb">
+
+            <div class="tb">
+              <cpt-tb :col-list="demand.colList"
+                      :loading="demand.loading"
+                      :header="demand.header"
+                      :list="demand.list"
+                      @handleClickRow="handleClickRow"></cpt-tb>
+
+            </div>
+            <div class="m-pagination">
+              <el-pagination :current-page="demand.pageNo"
+                             :page-size="demand.pageSize"
+                             :total="demand.total"
+                             background
+                             layout="prev, pager, next,total"
+                             @current-change="handlePageNoChange_demand">
+              </el-pagination>
+            </div>
+          </div>
+
+        </div>
+
+      </div>
+    </div>
+    <div id="popup"
+         style="display: none;"
+         class="ol-popup">
+      <a href="#"
+         id="popup-closer"
+         class="ol-popup-closer"></a>
+
+      <div id="popup-content"
+           class="popup-content">
+        <div class="div-pop"
+             v-show="selPlaceType==='resi'|| selPlaceType === 'special_resi'">
+          <div class="popTitle">居民信息</div>
+          <div class="popContentTitle">姓名：
+            <span>{{ selInfo.icUserName }}</span>
+          </div>
+          <div class="popContentTitle">所属网格：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">所属小区：
+            <span>{{ selInfo.villageName }}</span>
+          </div>
+          <div class="popContentTitle">本地户籍：
+            <span>{{ selInfo.isBdhjShow }}</span>
+          </div>
+
+          <div class="popContentTitle">手机：
+            <span>{{ selInfo.mobile }}</span>
+          </div>
+          <div class="popContentTitle">性别：
+            <span>{{ selInfo.genderShow }}</span>
+          </div>
+          <div class="popContentTitle">身份证号：
+            <span>{{ selInfo.idCard }}</span>
+          </div>
+
+          <div class="popContentTitle">工作单位：
+            <span>{{ selInfo.gzdw?selInfo.gzdw:'--' }}</span>
+          </div>
+          <div class="popContentTitle">人户状况：
+            <span>{{ selInfo.rhzkShow }}</span>
+          </div>
+          <div class="div_resi_more">
+            <div @click="toPeople"
+                 class="span_resi_more">更多</div>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='dangerous_chemicals'">
+          <div class="popTitle">企业信息</div>
+          <div class="popContentTitle">企业名称：
+            <span>{{ selInfo.name }}</span>
+          </div>
+          <div class="popContentTitle">企业类型：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">周边安全距离：
+            <span>{{ selInfo.safeDistance }}</span>
+          </div>
+          <div class="popContentTitle">危化品种类：
+            <span>{{ selInfo.dangerTypeName }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.principalName }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.principalMobile }}</span>
+          </div>
+          <div class="popContentTitle">经营地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+          <div class="popContentTitle">备注：
+            <span>{{ selInfo.remark }}</span>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='public_service'||selPlaceType==='city_management'||selPlaceType==='superior_resource'">
+          <div class="popTitle">场所信息</div>
+          <div class="popContentTitle">场所名称：
+            <span>{{ selInfo.name }}</span>
+          </div>
+          <div class="popContentTitle">场所分类：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">占地面积：
+            <span>{{ selInfo.areaCovered }}</span>
+          </div>
+          <div class="popContentTitle">容纳人数：
+            <span>{{ selInfo.capacity }}</span>
+          </div>
+          <div class="popContentTitle">地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+        </div>
+        <div v-show="selPlaceType==='event'">
+          <div class="popTitle">难点痛点</div>
+          <div class="popContentTitle">所属网格：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">发生时间：
+            <span>{{ selInfo.happenTime }}</span>
+          </div>
+          <div class="popContentTitle">事件内容：
+            <span>{{ selInfo.eventContent }}</span>
+          </div>
+
+          <div v-if="selInfo.imageList&&selInfo.imageList.length>0"
+               class="info-prop">
+            <span>图片：</span>
+            <div class="info-pics">
+              <img :src="src"
+                   :key="src"
+                   style="width:100px;height:100px;padding-right:10px"
+                   v-for="src in eventInfo.imageList"
+                   @click="watchImg(src)" />
+
+            </div>
+          </div>
+
+          <div v-if="selInfo.voiceList&&selInfo.voiceList.length>0"
+               class="info-prop">
+            <span>音频：</span>
+            <div class="info-pics">
+              <audio controls>
+                <source :src="item.url"
+                        type=""
+                        :key="item.url"
+                        v-for="item in eventInfo.voiceList" />
+              </audio>
+
+            </div>
+
+          </div>
+          <div class="popContentTitle">反映渠道：
+            <span>{{ selInfo.sourceTypeName|| "--" }}</span>
+          </div>
+          <div class="popContentTitle">地址：
+            <span>{{ selInfo.address || "--" }}</span>
+          </div>
+          <div class="popContentTitle">报事人：
+            <span>{{selInfo.name || "--" }}</span>
+          </div>
+          <div class="popContentTitle">手机号：
+            <span>{{ selInfo.mobile || "--" }}</span>
+          </div>
+          <div class="popContentTitle">身份证号：
+            <span>{{ selInfo.idCard || "--" }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='community_org'">
+          <div class="popTitle">组织信息</div>
+          <div class="popContentTitle">组织名称：
+            <span>{{ selInfo.organizationName }}</span>
+          </div>
+          <div class="popContentTitle">组织分类：
+            <span>{{ selInfo.categoryName }}</span>
+          </div>
+          <div class="popContentTitle">组织人数：
+            <span>{{ selInfo.organizationPersonCount }}</span>
+          </div>
+          <div class="popContentTitle">组织成员：
+            <span>{{ selInfo.organizationPersonnelShow }}</span>
+          </div>
+          <div class="popContentTitle">服务事项：
+            <span>{{ selInfo.serviceItem }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.principalName }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.principalPhone }}</span>
+          </div>
+          <div class="popContentTitle">创建时间：
+            <span>{{ selInfo.organizationCreatedTime }}</span>
+          </div>
+        </div>
+
+        <div v-show="selPlaceType==='group_rent'">
+          <div class="popTitle">房屋信息</div>
+          <div class="popContentTitle">房屋名称：
+            <span>{{ selInfo.houseName }}</span>
+          </div>
+          <div class="popContentTitle">房屋类型：
+            <span>{{ selInfo.houseTypeName }}</span>
+          </div>
+          <div class="popContentTitle">房屋用途：
+            <span>{{ selInfo.purposeName }}</span>
+          </div>
+          <div class="popContentTitle">房屋状态：
+            <span>{{ selInfo.rentName }}</span>
+          </div>
+          <div class="popContentTitle">房主姓名：
+            <span>{{ selInfo.ownerName }}</span>
+          </div>
+          <div class="popContentTitle">联系方式：
+            <span>{{ selInfo.ownerPhone }}</span>
+          </div>
+          <div class="popContentTitle">房主身份证：
+            <span>{{ selInfo.ownerIdCard }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='enterprise_patrol'">
+          <div class="popTitle">企事业信息</div>
+          <div class="popContentTitle">场所类型：
+            <span>{{ selInfo.placeTypeName }}</span>
+          </div>
+          <div class="popContentTitle">场所区域：
+            <span>{{ selInfo.gridName }}</span>
+          </div>
+          <div class="popContentTitle">场所名称：
+            <span>{{ selInfo.placeOrgName }}</span>
+          </div>
+          <div class="popContentTitle">场所地址：
+            <span>{{ selInfo.address }}</span>
+          </div>
+          <div class="popContentTitle">规模：
+            <span>{{ selInfo.scale }}</span>
+          </div>
+          <div class="popContentTitle">负责人：
+            <span>{{ selInfo.personInCharge }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.mobile }}</span>
+          </div>
+
+        </div>
+        <div v-show="selPlaceType==='party_unit'">
+          <div class="popTitle">联建单位信息</div>
+          <div class="popContentTitle">单位名称：
+            <span>{{ selInfo.unitName }}</span>
+          </div>
+          <div class="popContentTitle">分类：
+            <span>{{ selInfo.typeName }}</span>
+          </div>
+          <div class="popContentTitle">服务事项：
+            <span>{{ selInfo.serviceMatterListShow }}</span>
+          </div>
+          <div class="popContentTitle">联系人：
+            <span>{{ selInfo.contact }}</span>
+          </div>
+          <div class="popContentTitle">联系电话：
+            <span>{{ selInfo.contactMobile }}</span>
+          </div>
+          <div class="popContentTitle">在职党员：
+            <span>{{ selInfo.memberCount }}</span>
+          </div>
+          <div class="popContentTitle">备注：
+            <span>{{ selInfo.remark }}</span>
+          </div>
+          <div class="popContentTitle">地理位置：
+            <span>{{ selInfo.address }}</span>
+          </div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <people v-if="showPeopleInfo"
+            :uid="selUserId"
+            ref="ref_people"></people>
+  </div>
+
+</template>
+
+<script>
+import 'ol/ol.css'
+import { Map, View } from 'ol'
+import TileLayer from 'ol/layer/Tile.js';
+import ImageLayer from 'ol/layer/Image';
+import { Raster as RasterSource } from 'ol/source';
+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 TileGrid from "ol/tilegrid/TileGrid";
+import TileImage from "ol/source/TileImage";
+import Tile from "ol/layer/Tile";
+
+import nextTick from 'dai-js/tools/nextTick'
+import { mapGetters } from "vuex";
+import { Loading } from 'element-ui'; //引入Loading服务
+import { requestPost, requestGet } from "@/js/dai/request";
+
+
+import cptTb from "@/views/modules/visual/cpts/tb";
+import cptCard from "@/views/modules/visual/cpts/card";
+import ScreenLoading from "@/views/modules/visual/cpts/loading";
+import People from "../../basicinfo/people";
+
+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 iconUrlArray = [
+  require('../../../../../assets/img/shuju/measure/lxdj.png'),
+  require('../../../../../assets/img/shuju/measure/qydw.png'),
+  require('../../../../../assets/img/shuju/measure/lxzz.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 {
+      centerPoint: [],//中心点位置
+      zoom: 14,//缩放范围：区14
+      minZoom: 1,//最小缩放
+
+      orgData: {},//当前组织对象
+      orgId: '',
+      orgLevel: '',
+
+      subAgencyArray: [],//下拉框数据
+      iconCoordinators: [],
+      currentCoordinate: null,
+      overlay: null,
+
+      //右侧搜索
+      searchName: "",
+
+      //右侧列表
+      infoLoading: true,
+      listData: [],//得到的数据
+      listDatashow: [],//处理成一行两列的数据
+
+      //下钻层级记录
+      runNum: 0,
+      routerArray: [],
+      center: [],
+      zoom: null,
+      parentPolygon: [],
+
+      centerFlag: 'point',//定义中心点的flag  point点 fit 自适应
+
+      coverageTypesList: [//图层类型。五大图层：zhzl：综合治理图层；yjcl：应急处置图层；aqsc：安全生产图层；csgl：城市管理图层；ggfw：公共服务图层
+        {
+          select: true,
+          label: '综合治理图层',
+          value: 'zhzl'
+        },
+        {
+          select: false,
+          label: '应急处置图层',
+          value: 'yjcl'
+        },
+        {
+          select: false,
+          label: '安全生产图层',
+          value: 'aqsc'
+        },
+        {
+          select: false,
+          label: '城市管理图层',
+          value: 'csgl'
+        },
+        {
+          select: false,
+          label: '公共服务图层',
+          value: 'ggfw'
+        },
+      ],
+      categoryList: [],//分类列表
+      categoryListshow: [],//处理成一行四列的数据
+
+      selImg: require('../../../../../assets/img/shuju/xuanzhong.png'),
+      noSelImg: require('../../../../../assets/img/shuju/weixuan.png'),
+
+      coverageTypes: ['zhzl'],
+      categoryKeys: [],
+      search: '',
+      pageNo: 1,
+      pageSize: 10,
+
+      demand: {
+        loading: false,
+        colList: [
+          {
+            align: "center",
+            width: "15%",
+          },
+          {
+            align: "center",
+            width: "25%",
+          },
+          {
+            align: "center",
+            width: "60%",
+          },
+
+        ],
+        header: ["图例", "分类", "名称"],
+        list: [],
+        pageSize: 50,
+        pageNo: 1,
+        total: 0,
+      },
+
+      iconUrlArray: {
+
+        'anzhibangjiao': require('../../../../../assets/img/shuju/fiveLayer/anzhibangjiao.png'),
+        'buliangqingshaonian': require('../../../../../assets/img/shuju/fiveLayer/buliangqingshaonian.png'),
+        'shequjiaozheng': require('../../../../../assets/img/shuju/fiveLayer/shequjiaozheng.png'),
+        'resi_xfry': require('../../../../../assets/img/shuju/fiveLayer/resi_xfry.png'),
+        'xidurenyuan': require('../../../../../assets/img/shuju/fiveLayer/xidurenyuan.png'),
+        'xiejiaorenyuan': require('../../../../../assets/img/shuju/fiveLayer/xiejiaorenyuan.png'),
+        'zhaoshizhaohuojingshenbing': require('../../../../../assets/img/shuju/fiveLayer/zhaoshizhaohuojingshenbing.png'),
+
+
+        'yjdw': require('../../../../../assets/img/shuju/fiveLayer/yjdw.png'),
+        'sr_gy': require('../../../../../assets/img/shuju/fiveLayer/sr_gy.png'),
+        'sr_gc': require('../../../../../assets/img/shuju/fiveLayer/sr_gc.png'),
+        'whdw': require('../../../../../assets/img/shuju/fiveLayer/whdw.png'),
+        'sr_ggld': require('../../../../../assets/img/shuju/fiveLayer/sr_ggld.png'),
+        'lwh': require('../../../../../assets/img/shuju/fiveLayer/lwh.png'),
+        'sr_tyc': require('../../../../../assets/img/shuju/fiveLayer/sr_tyc.png'),
+        'lyjlb': require('../../../../../assets/img/shuju/fiveLayer/lyjlb.png'),
+        'sr_yjy': require('../../../../../assets/img/shuju/fiveLayer/sr_yjy.png'),
+        'zaxld': require('../../../../../assets/img/shuju/fiveLayer/zaxld.png'),
+        'other': require('../../../../../assets/img/shuju/fiveLayer/other.png'),
+        'sr_jzz': require('../../../../../assets/img/shuju/fiveLayer/sr_jzz.png'),
+        'sr_djc': require('../../../../../assets/img/shuju/fiveLayer/sr_djc.png'),
+        'sr_rfqck': require('../../../../../assets/img/shuju/fiveLayer/sr_rfqck.png'),
+        'ep_lg': require('../../../../../assets/img/shuju/fiveLayer/ep_lg.png'),
+        'sr_xfz': require('../../../../../assets/img/shuju/fiveLayer/sr_xfz.png'),
+        'pu_jgzsbm': require('../../../../../assets/img/shuju/fiveLayer/pu_jgzsbm.png'),
+
+        'gr_czw': require('../../../../../assets/img/shuju/fiveLayer/gr_czw.png'),
+        'ep_cycs': require('../../../../../assets/img/shuju/fiveLayer/ep_cycs.png'),
+        'dc_jyz': require('../../../../../assets/img/shuju/fiveLayer/dc_jyz.png'),
+        'ep_gwylcs': require('../../../../../assets/img/shuju/fiveLayer/ep_gwylcs.png'),
+        'dc_jqz': require('../../../../../assets/img/shuju/fiveLayer/dc_jqz.png'),
+        'dc_whpdw': require('../../../../../assets/img/shuju/fiveLayer/dc_whpdw.png'),
+        'ep_wb': require('../../../../../assets/img/shuju/fiveLayer/ep_wb.png'),
+        'ep_mrxycs': require('../../../../../assets/img/shuju/fiveLayer/ep_mrxycs.png'),
+        'dc_yqhjz': require('../../../../../assets/img/shuju/fiveLayer/dc_yqhjz.png'),
+        'dc_jzgd': require('../../../../../assets/img/shuju/fiveLayer/dc_jzgd.png'),
+        'ep_scjgqy': require('../../../../../assets/img/shuju/fiveLayer/ep_scjgqy.png'),
+
+        'cm_nmsc': require('../../../../../assets/img/shuju/fiveLayer/cm_nmsc.png'),
+        'event_tdnd': require('../../../../../assets/img/shuju/fiveLayer/event_tdnd.png'),
+        'cm_bhsc': require('../../../../../assets/img/shuju/fiveLayer/cm_bhsc.png'),
+        'cm_cjsc': require('../../../../../assets/img/shuju/fiveLayer/cm_cjsc.png'),
+        'ep_lssd': require('../../../../../assets/img/shuju/fiveLayer/ep_lssd.png'),
+
+
+        'resi_szry': require('../../../../../assets/img/shuju/fiveLayer/resi_szry.png'),
+        'ps_lyy': require('../../../../../assets/img/shuju/fiveLayer/ps_lyy.png'),
+        'resi_snry': require('../../../../../assets/img/shuju/fiveLayer/resi_snry.png'),
+        'ps_mzb': require('../../../../../assets/img/shuju/fiveLayer/ps_mzb.png'),
+        'ps_zs': require('../../../../../assets/img/shuju/fiveLayer/ps_zs.png'),
+        'ps_wss': require('../../../../../assets/img/shuju/fiveLayer/ps_wss.png'),
+        'ps_jjz': require('../../../../../assets/img/shuju/fiveLayer/ps_jjz.png'),
+        'ep_xx': require('../../../../../assets/img/shuju/fiveLayer/ep_xx.png'),
+        'ep_yy': require('../../../../../assets/img/shuju/fiveLayer/ep_yy.png'),
+
+      },
+      iconArrays: [],
+      overlay: null,
+      showPopup: false,
+
+      selPlaceType: '',
+      selInfo: {},
+      selUserId: '',
+      showPeopleInfo: false
+
+    }
+  },
+  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.loadCategoryList()
+    // this.getTable();
+    // await this.getMapTable();
+
+
+    // //初始化icon图层
+    // this.addOverlay()
+
+    // this.addMapClick()
+
+  },
+  methods: {
+
+    toPeople () {
+      this.showPeopleInfo = true
+    },
+
+    //添加覆盖层
+    addOverlay () {
+      // 使用变量存储弹窗所需的 DOM 对象
+      var container = document.getElementById("popup");
+      var closer = document.getElementById("popup-closer");
+      var content = document.getElementById("popup-content");
+
+
+      // 创建一个弹窗 Overlay 对象
+      this.overlay = new Overlay({
+        element: container, //绑定 Overlay 对象和 DOM 对象的
+        autoPan: true, // 定义弹出窗口在边缘点击时候可能不完整 设置自动平移效果
+        autoPanAnimation: {
+          duration: 250 //自动平移效果的动画时间 9毫秒
+        },
+        zIndex: 100
+      });
+      // 将弹窗添加到 map 地图中
+      map.addOverlay(this.overlay);
+      let _that = this;
+
+      /**
+       * 为弹窗添加一个响应关闭的函数
+       */
+      closer.onclick = function () {
+        _that.overlay.setPosition(undefined);
+        closer.blur();
+        return false;
+      };
+
+    },
+
+    //注册地图点击事件
+    addMapClick () {
+      let _that = this
+
+      map.on("click", function (evt) {
+        const feature = map.forEachFeatureAtPixel(evt.pixel, function (feature) {
+          return feature;
+        });
+        if (feature) {
+          // console.log(feature)
+          _that.clickMapVolunteer(feature.values_.properties.info)
+
+        }
+
+      });
+    },
+
+    //点击项目
+    async clickMapVolunteer (info) {
+
+      if (!info.id) {
+        return false
+      }
+      if (!info.latitude || !info.longitude) {
+        this.$message.warning("请先完善坐标位置")
+        return false
+      }
+      this.selPlaceType = info.placeType
+      if (info.placeType === 'resi' || info.placeType === 'special_resi') {//综合治理图层和公共服务图层中的失能人员、失智人员
+        // info.id = "dd0bd55db0ca4b629c40bc914a08368e"
+        this.selUserId = info.id
+        this.loadResi(info)
+      }
+      if (info.placeType === 'public_service') {//公共服务图层
+        this.loadPublicService(info)
+      }
+      if (info.placeType === 'dangerous_chemicals') {//重点危化品企业
+        this.loadDangerousChemicals(info)
+      }
+      if (info.placeType === 'event') {//难点痛点
+        this.loadEvent(info)
+      }
+      if (info.placeType === 'city_management') {//城市管理图层
+        this.loadCityManagement(info)
+      }
+      if (info.placeType === 'community_org') {//社区自组织
+        this.loadCommunityOrg(info)
+      }
+      if (info.placeType === 'superior_resource') {//优势资源
+        this.loadSuperiorResource(info)
+      }
+      if (info.placeType === 'group_rent') {//群租房
+        this.loadGroupRent(info)
+      }
+
+
+      if (info.placeType === 'party_unit') {//来自联建单位的机关直属部门
+        this.loadPartyUnit(info)
+      }
+      if (info.placeType === 'enterprise_patrol') {//来自企事业查询的
+        this.loadEnterprisePartrol(info)
+      }
+
+
+    },
+
+    async loadResi (info) {
+      const url = "/epmetuser/icresiuser/resi-brief/" + info.id
+      // const url = "http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/distribution"
+
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.icUserName = data.icUserName ? data.icUserName : '--'
+        data.gridName = data.gridName ? data.gridName : '--'
+        data.villageName = data.villageName ? data.villageName : '--'
+        data.mobile = data.mobile ? data.mobile : '--'
+        data.idCard = data.idCard ? data.idCard : '--'
+        data.birthday = data.birthday ? data.birthday : '--'
+        data.contacts = data.contacts ? data.contacts : '--'
+        data.contactsMobile = data.contactsMobile ? data.contactsMobile : '--'
+
+        data.isBdhjShow = data.isBdhj ? data.isBdhj === '0' ? '否' : '是' : '--'
+        data.genderShow = data.gender ? data.gender === '0' ? '女' : '男' : '--'
+        if (data.rhzk === 'rhyz') {
+          data.rhzkShow = '人户一致'
+        } else if (data.rhzk === 'rzhbz') {
+          data.rhzkShow = '人在户不在'
+        } else if (data.rhzk === 'hzrbz') {
+          data.rhzkShow = '户在人不在'
+        } else {
+          data.rhzkShow = '--'
+        }
+
+        let categoriesArray = []
+
+        for (let key in data.volunteerCategories) {
+          categoriesArray.push(data.volunteerCategories[key])
+
+        }
+
+        if (categoriesArray.length > 0) {
+          data.categories = categoriesArray.join(',')
+        } else {
+          data.categories = '--'
+        }
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadPublicService (info) {
+      const url = "/gov/org/icPublicService/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icPublicService/detail"
+
+      let params = {
+        icPublicServiceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadEvent (info) {
+      const url = "/gov/project/icEvent/detail";
+      //const url = "http://yapi.elinkservice.cn/mock/245/api/gov/project/icEvent/processAnalysis/eventDetail/" + this.eventId;
+
+      const { data, code, msg } = await requestPost(url, {
+        icEventId: info.id,
+      });
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+        this.handleShowPopup(coordinate)
+
+
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadDangerousChemicals (info) {
+      const url = "/gov/org/icDangerousChemicals/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icDangerousChemicals/detail"
+
+      let params = {
+        icSuperiorResourceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.safeDistance = data.safeDistance ? data.safeDistance : '--'
+        data.dangerTypeName = data.dangerTypeName ? data.dangerTypeName : '--'
+        data.principalName = data.principalName ? data.principalName : '--'
+        data.principalMobile = data.principalMobile ? data.principalMobile : '--'
+        data.address = data.address ? data.address : '--'
+        data.remark = data.remark ? data.remark : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadCityManagement (info) {
+      const url = "/gov/org/icCityManagement/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icCityManagement/detail"
+
+      let params = {
+        icCityManagementId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadCommunityOrg (info) {
+      // const url = "/gov/org/icCityManagement/detail"
+      const url = "/heart/iccommunityselforganization/community-self-org-detail/" + info.id
+
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.orgPersonArray = []
+        data.organizationPersonnel.forEach(element => {
+          let orgPersonnel = element.personName + "(" + element.personPhone + ")"
+          data.orgPersonArray.push(orgPersonnel)
+        });
+
+        data.organizationPersonnelShow = data.orgPersonArray.join(",")
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadSuperiorResource (info) {
+      const url = "/gov/org/icSuperiorResource/detail"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/icSuperiorResource/detail"
+
+      let params = {
+        icSuperiorResourceId: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.name = data.name ? data.name : '--'
+        data.categoryName = data.categoryName ? data.categoryName : '--'
+        data.areaCovered = data.areaCovered ? data.areaCovered + '平方公里' : '--'
+        data.capacity = data.capacity ? data.capacity : '--'
+        data.address = data.address ? data.address : '--'
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+
+
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    async loadEnterprisePartrol (info) {
+      const url = "/gov/org/enterprise/detail/" + info.id
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/enterprise/detail"
+
+      const { data, code, msg } = await requestPost(url)
+
+      if (code === 0) {
+        // debugger
+        let coordinate = [info.longitude, info.latitude]
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    async loadGroupRent (info) {
+      const url = "/gov/org/ichouse/" + info.id
+
+      const { data, code, msg } = await requestGet(url)
+
+      if (code === 0) {
+        // debugger
+        let coordinate = [info.longitude, info.latitude]
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    async loadPartyUnit (info) {
+      const url = '/heart/icpartyunit/detail'
+      // const url = 'http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/detail'
+      let params = {
+        id: info.id
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        if (!data.serviceMatterList || !Array.isArray(data.serviceMatterList)) {
+          data.serviceMatterList = []
+        } else {
+          data.serviceMatterListShow = data.serviceMatterNameList.join(',')
+        }
+
+        this.selInfo = JSON.parse(JSON.stringify(data))
+        this.handleShowPopup(coordinate)
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+
+    handleShowPopup (coordinate) {
+
+      // console.log(this.overlay.getElement())
+      let content = document.getElementById("popup-content");
+      this.overlay.getElement().style.display = 'block'
+      this.overlay.getElement().parentNode.style.display = 'block'
+      this.overlay.getElement().parentNode.parentNode.style.display = 'block'
+      // content.innerHTML = showData;
+      this.overlay.setPosition(coordinate);
+      //把 overlay 显示到指定的 x,y坐标
+
+    },
+    // 关闭弹窗
+    handleClosePopup () {
+      this.overlay.setPosition(undefined);
+      document.getElementById("popup-closer").blur();
+      return false;
+    },
+
+    //点击图层
+    async handleClickCoverage (index) {
+      this.demand.pageNo = 1
+      this.coverageTypesList[index].select = !this.coverageTypesList[index].select
+      let item = this.coverageTypesList[index]
+
+      this.$set(this.coverageTypesList, index, item)
+
+      this.coverageTypes = []
+
+      this.coverageTypesList.forEach(element => {
+        if (element.select) {
+          this.coverageTypes.push(element.value)
+        }
+      });
+
+      await this.loadCategoryList()
+      this.getTable();
+      this.getMapTable();
+    },
+
+    //点击类别
+    async handleClickCategory (index, colIndex) {
+      this.demand.pageNo = 1
+      this.categoryListshow[index][colIndex].sel = !this.categoryListshow[index][colIndex].sel
+
+      // this.categoryList[index * 4 + colIndex].sel = !this.categoryList[index * 4 + colIndex].sel
+
+      let array = this.categoryListshow[index]
+      let item = this.categoryListshow[index][colIndex]
+
+
+      this.$set(this.categoryListshow[index], colIndex, item)
+      this.$set(this.categoryListshow, index, array)
+
+      this.categoryKeys = []
+
+      this.categoryList.forEach(element => {
+        if (element.sel) {
+          this.categoryKeys.push(element.categoryKey)
+        }
+      });
+
+      this.getTable();
+      this.getMapTable();
+    },
+    handleSearch () {
+      this.demand.pageNo = 1
+      this.getTable();
+      this.getMapTable();
+    },
+    //
+    handleClickRow (index) {
+      let selData = this.tableList[index]
+      if (selData.longitude && selData.latitude) {
+        mapView.setCenter([selData.longitude, selData.latitude]);
+      }
+
+      this.clickMapVolunteer(selData)
+
+      // alert(index)
+    },
+
+    handlePageNoChange_demand (val) {
+      this.demand.pageNo = val;
+      this.getTable();
+    },
+
+    async loadCategoryList () {
+      const url = "/gov/org/coverage/categoryList"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/coverage/categoryList"
+      let params = {
+        coverageTypes: this.coverageTypes,
+
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.categoryList = data
+
+        this.categoryKeys = []
+
+        this.categoryListshow = []
+        let itemArray = []
+
+        this.categoryList.forEach((item, index) => {
+
+          item.dataIcon = this.iconUrlArray[item.categoryKey]
+
+
+          item.sel = true
+          this.categoryKeys.push(item.categoryKey)
+
+        });
+
+        let chunk = 4
+        for (let i = 0, j = this.categoryList.length; i < j; i += chunk) {
+          this.categoryListshow.push(this.categoryList.slice(i, i + chunk))
+        }
+
+
+        // console.log(this.categoryListshow)
+        // console.log(this.categoryList)
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    //加载组织数据
+    async getTable () {
+      this.demand.loading = true
+      const url = "/data/aggregator/coverage/dataList";
+      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
+      let params = {
+        coverageTypes: this.coverageTypes,
+        categoryKeys: this.categoryKeys,
+        search: this.search,
+        pageNo: this.demand.pageNo,
+        pageSize: this.demand.pageSize,
+        isPage: true
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+      this.demand.loading = false;
+
+      if (code === 0) {
+
+        this.demand.total = data.total;
+
+        this.tableList = data.list
+        this.demand.list = data.list
+        this.demand.list.forEach(item => {
+          item.imgObj = {
+            type: 'img',
+            src: this.iconUrlArray[item.categoryKey]
+          }
+        });
+
+
+        this.demand.list = this.demand.list.map((item) => {
+          return [
+            // item.categoryKey ? item.categoryKey : '--',
+
+            item.imgObj,
+            item.categoryName,
+            item.content ? item.content : '',
+
+          ];
+        });
+        console.log(this.demand.list)
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    //加载组织数据
+    async getMapTable () {
+
+      const url = "/data/aggregator/coverage/dataList";
+      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
+      let params = {
+        coverageTypes: this.coverageTypes,
+        categoryKeys: this.categoryKeys,
+        search: this.search,
+        // pageNo: 1,
+        // pageSize: 2000,
+        isPage: false
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+
+      if (code === 0) {
+
+        this.demand.total = data.total;
+
+        this.iconArrays = data.list
+
+        this.iconArrays.forEach((item, index) => {
+          item.url = this.iconUrlArray[item.categoryKey]
+
+        });
+        // console.log(this.iconArrays)
+        this.loadIcon()
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载icon图标
+    loadIcon () {
+
+      iconSource.clear()//清空多边形标注
+      if (this.iconArrays && this.iconArrays.length > 0) {
+
+        let iconFeatures = [];
+
+        this.iconArrays.forEach((oneIcon, index) => {
+          //添加标注
+
+          let iconItem = new Feature({
+            geometry: new Point([oneIcon.longitude, oneIcon.latitude]),
+            id: oneIcon.id,
+            properties: {
+              type: "icon",
+              info: { ...oneIcon }
+            }
+          });
+          // console.log('oneIcon----', this.iconUrlArray[oneIcon.urlIndex])
+          let iconStyle = new Style({
+            image: new Icon({
+              // anchor: [0.5, 0.5],
+              imgSize: [60, 60],
+              // scale: 0.5,
+              // src: oneIcon.urlIndex && this.iconUrlArray[oneIcon.urlIndex] || this.iconUrlArray[0] || this.iconUrlArray[0]
+              src: oneIcon.url
+            }),
+            // text: createTextStyle(oneIcon)
+          });
+
+          iconItem.setStyle(iconStyle);
+
+          // if (this.distanceMax) {
+          //   if (this.computedDistance(oneIcon.longitude, oneIcon.latitude, this.distanceMax)) {
+          //     iconFeatures.push(iconItem);
+          //   }
+          // } else {
+          iconFeatures.push(iconItem);
+          // }
+
+
+        });
+
+        iconSource.addFeatures(iconFeatures);
+      }
+    },
+
+    //刷新地图
+    async refreshMap (isRefreshView) {
+
+      //加载组织数据
+      await this.loadOrgData()
+
+      //绘制父级组织数据
+      this.loadParentPolygon()
+      //绘制本级组织数据
+      this.loadPolygon(this.subAgencyArray)
+
+      //重置地图中心点
+
+      // if (isRefreshView) {
+      // this.setMapLocation()
+
+      // }
+
+      await this.getTable(false);
+
+    },
+
+    //设置地图定位的中心点和缩放级别
+    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);
+
+    },
+
+    //返回所选组织
+    handleClickRouter (index) {
+
+      this.showPeopleInfo = false
+
+
+
+    },
+
+    //加载组织数据
+    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
+      }
+
+    },
+
+    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()
+
+      let center = [108.946994, 34.261361];
+
+      let resolutions = [];
+      for (let i = 0; i < 19; i++) {
+        resolutions[i] = Math.pow(2, 18 - i);
+      }
+      let tilegrid = new TileGrid({
+        origin: [0, 0],
+        resolutions: resolutions,
+      });
+
+      let baidu_source = new TileImage({
+        projection: "EPSG:3857",
+        tileGrid: tilegrid,
+        tileUrlFunction: function (tileCoord, pixelRatio, proj) {
+          if (!tileCoord) {
+            return "";
+          }
+          let z = tileCoord[0];
+          let x = tileCoord[1];
+          let y = tileCoord[2];
+
+          if (x < 0) {
+            x = "M" + -x;
+          }
+          if (y < 0) {
+            y = "M" + -y;
+          }
+
+          return (
+            // "http://online3.map.bdimg.com/onlinelabel/?qt=tile&x=" +
+            // x +
+            // "&y=" +
+            // y +
+            // "&z=" +
+            // z +
+            // "&styles=pl&udt=20151021&scaler=1&p=1"
+
+            "https://api.map.baidu.com/customimage/tile?qt=customimage&x=" +
+            x +
+            "&y=" +
+            y +
+            "&z=" +
+            z +
+            "&udt=20220705&scale=1&ak=h545cBO3zBG6PVXXvgKk1Y62eLyPoV5r&customid=midnight&seckey=7mo7uokeuuSYSXBThubJv1wWUWZLQ%2BCFxpFo%2Bt3y1rM%3D%2CbELjeNo5q-rZRoiC0gZxzrafOR2x1_NVp-mbyyRLchUx3GxWiQDuqWwU8YZU7MX1_fQCBC-H0ndXSZERCJ4GUs1M_Du1W612O-mSvpoMJUM_eUldLmbnL6MZrEYh0Fn5AOkZbsixA0yxkyNs27XmkOLWIatiyJAPTb2UhHWQrrt1gdWxYOgU_-Hz3ew57LwR&timeStamp=1657075934987&sign=5844425d9505"
+            // "https://api.map.baidu.com/?&x=" +
+            // x +
+            // "&y=" +
+            // y +
+            // "&z=" +
+            // z +
+            // "qt=cen&b=12865848.400077064%2C4765973.39070826%3B13101597.15004244%2C4881023.692123655&l=11.06&ie=utf-8&oue=1&fromproduct=jsapi&callback=BMapGL._rd._cbk61206&ak=E4805d16520de693a3fe707cdc962045&v=gl&seckey=7mo7uokeuuSYSXBThubJvwVur%2FSrRbWUKztth1roL6w%3D%2CbELjeNo5q-rZRoiC0gZxzrs3Kh7S8yKY5monqdyjDlzAQBufM6Wic6Bsh2m4RPVAu6POlFIFz6N4Wx8nKFAoC41k3mM5wz8jHFW6pjkg2spPlrWJDfb2ukkFyuCclAQd4bt9EwBZVnLC1EOAPoaEhBqJCrI_1nYWhbNKQacJhdEf7HxsW6FkjP7tv3P_ohX1&timeStamp=1657071639838&sign=edcb728195ef"
+
+            // "http://online3.map.bdimg.com/onlinelabel/?qt=tile&x=" + x + "&y=" + y + "&z=" + z + "&styles=pl&udt=20170809&scaler=1&p=1"
+
+            // "https://api.map.baidu.com/customimage/tile?&x=" +
+            // x +
+            // "&y=" +
+            // y +
+            // "&z=" +
+            // z +
+            // "&udt=20201022&scale=1&styles=t%3Aland%7Ce%3Aall%7Cc%3A%2300121cff%2Ct%3Awater%7Ce%3Aall%7Cc%3A%2300445dff%2Ct%3Ahighway%7Ce%3Aall%7Cc%3A%2307313fff%2Ct%3Asubway%7Ce%3Aall%7Cv%3Aoff%2Ct%3Aarterial%7Ce%3Aall%7Cv%3Aon%7Cc%3A%23003242ff%2Ct%3Agreen%7Ce%3Aall%7Cv%3Aoff%2Ct%3Alabel%7Ce%3Al.t.s%7Cv%3Aon%7Cc%3A%2335bd8500%2Ct%3Arailway%7Ce%3Aall%7Cv%3Aoff%2Ct%3Alabel%7Ce%3Al.t.f%7Cv%3Aon%7Cc%3A%2335bd85ff%7Cw%3A1%2Ct%3Abuilding%7Ce%3Aall%7Cv%3Aon%7Cc%3A%231692beff%2Ct%3Amanmade%7Ce%3Aall%7Cv%3Aoff%2Ct%3Agreen%7Ce%3Aall%7Cv%3Aoff%2Ct%3Apoi%7Ce%3Al.t.f%7Cv%3Aon%7Cc%3A%2335bd85ff%2Ct%3Apoi%7Ce%3Al.t.s%7Cv%3Aon%7Cc%3A%2335bd8500%2Ct%3Apoi%7Ce%3Al.i%7Cv%3Aoff%2Ct%3Alocal%7Ce%3Aall%7Cv%3Aoff%2Ct%3Aroad%7Ce%3Al.i%7Cv%3Aoff"
+          );
+        },
+      });
+
+      let baidu_layer = new Tile({
+        source: baidu_source,
+      });
+
+      let iconFeature = new Feature({
+        geometry: new Point(center),
+        name: "Null Island",
+        population: 4000,
+        rainfall: 500,
+      });
+
+      let iconStyle = new Style({
+        image: new Icon({
+          scale: 1,
+          // anchorXUnits: 'fraction',
+          // anchorYUnits: 'pixels',
+          src: require("../../../../../assets/img/shuju/fiveLayer/ep_yy.png"),
+        }),
+      });
+
+      iconFeature.setStyle(iconStyle);
+
+      let vectorSource = new VectorSource({
+        features: [iconFeature],
+      });
+
+      let vectorLayer = new VectorLayer({
+        source: vectorSource,
+      });
+
+      map = new Map({
+        target: "map",
+        layers: [baidu_layer, vectorLayer],
+        view: new View({
+          center: center,
+          zoom: 11,
+          projection: "EPSG:4326",
+        }),
+      });
+
+
+    },
+
+    reverseFunc (pixelsTemp) {
+      //蓝色
+      for (var i = 0; i < pixelsTemp.length; i += 4) {
+        var r = pixelsTemp[i];
+        var g = pixelsTemp[i + 1];
+        var b = pixelsTemp[i + 2];
+        //运用图像学公式，设置灰度值
+        var grey = r * 0.3 + g * 0.59 + b * 0.11;
+        //将rgb的值替换为灰度值
+        pixelsTemp[i] = grey;
+        pixelsTemp[i + 1] = grey;
+        pixelsTemp[i + 2] = grey;
+
+        //基于灰色，设置为蓝色，这几个数值是我自己试出来的，可以根据需求调整
+        pixelsTemp[i] = 55 - pixelsTemp[i];
+        pixelsTemp[i + 1] = 255 - pixelsTemp[i + 1];
+        pixelsTemp[i + 2] = 305 - pixelsTemp[i + 2];
+      }
+    },
+    //添加标注图层
+    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 => {
+
+      // });
+
+    },
+
+    addIconLayer () {
+      iconSource = new VectorSource({
+
+        //features: (new GeoJSON()).readFeatures(geojsonObject)
+      });
+
+      iconLayer = new VectorLayer({
+        source: iconSource,
+        zIndex: 70
+      });
+
+      map.addLayer(iconLayer);
+
+    },
+
+    //开启加载动画
+    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: { cptTb, cptCard, ScreenLoading, People },
+}
+export default vueGis;
+</script>
+
+<style
+  lang="scss"
+  src="@/assets/scss/modules/visual/fiveLayerMap.scss"
+  scoped
+></style>
+
+<style lang="scss" >
+.div_content {
+  .ol-viewport {
+    border-radius: 5px;
+  }
+}
+.ol-overlaycontainer-stopevent {
+  display: none;
+}
+</style> 
+
+<style lang="scss" scoped>
+.popTitle {
+  font-size: 16px;
+  color: #ffffff;
+  padding-bottom: 5px;
+}
+
+.info-prop {
+  position: relative;
+  margin: 10px 0;
+  display: flex;
+  padding-left: 15px;
+  font-size: 12px;
+
+  .info-pics {
+    display: flex;
+    margin: 10px 0;
+    img {
+      display: block;
+      width: 32%;
+      height: 90px;
+      margin-right: 9px;
+      object-fit: cover;
+    }
+  }
+  > span,
+  > div {
+    display: block;
+    max-width: 300px;
+  }
+}
+
+.popContentTitle {
+  font-size: 14px;
+  color: #ffffff;
+  margin-top: 5px;
+  line-height: 20px;
+}
+
+.div_resi_more {
+  display: flex;
+  justify-content: center;
+  margin-top: 20px;
+}
+
+.span_resi_more {
+  font-size: 16px;
+  text-decoration: underline;
+}
+.span_resi_more:hover {
+  cursor: pointer;
+}
+</style>
+
+<style lang="scss" >
+.div_search_list {
+  .el-input__inner[WarningColor="warning"] {
+    border-radius: 8px 0 0 8px;
+    height: 48px;
+    background-color: #01106800;
+    border: 0px solid #0082fb;
+    padding: 0 0 0 70px;
+    font-size: 18px;
+    font-family: PingFang SC;
+    font-weight: 400;
+    color: #ffffff;
+  }
+  .el-input__inner {
+    &::placeholder {
+      padding: 0;
+      margin: 0;
+
+      font-size: 18px;
+    }
+  }
+}
+
+.ol-popup {
+  position: absolute;
+  background-color: #1258c9da;
+  -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+  padding: 15px;
+  border-radius: 10px;
+  border: 1px solid #1257c9;
+  bottom: 12px;
+  left: -50px;
+  text-align: left;
+}
+.ol-popup:after,
+.ol-popup:before {
+  top: 100%;
+  border: solid transparent;
+  content: " ";
+  height: 0;
+  width: 0;
+  position: absolute;
+  pointer-events: none;
+}
+.ol-popup:after {
+  border-top-color: 1257c9;
+  border-width: 10px;
+  left: 48px;
+  margin-left: -10px;
+}
+.ol-popup:before {
+  border-top-color: #1257c9;
+  border-width: 11px;
+  left: 48px;
+  margin-left: -11px;
+}
+.ol-popup-closer {
+  text-decoration: none;
+  position: absolute;
+  top: 2px;
+  right: 8px;
+}
+.popup-content {
+  width: 300px;
+
+  .div-pop {
+  }
+}
+
+.ol-popup-closer:after {
+  content: "✖";
+  // color: rgba(1, 17, 104, 1);
+  color: #fff;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue b/src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue
index 194a4d761..5cacfc92e 100644
--- a/src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue
+++ b/src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue
@@ -373,6 +373,8 @@
 import 'ol/ol.css'
 import { Map, View } from 'ol'
 import TileLayer from 'ol/layer/Tile.js';
+import ImageLayer from 'ol/layer/Image';
+import { Raster as RasterSource } from 'ol/source';
 import XYZ from 'ol/source/XYZ.js';
 import VectorLayer from 'ol/layer/Vector.js';
 import VectorSource from 'ol/source/Vector.js';
@@ -489,6 +491,28 @@ var polygonStyleFunction = (function () {
   };
 })()
 
+//定义颜色转换方法
+let reverseFunc = function (pixelsTemp) {
+  //蓝色
+  for (var i = 0; i < pixelsTemp.length; i += 4) {
+    var r = pixelsTemp[i];
+    var g = pixelsTemp[i + 1];
+    var b = pixelsTemp[i + 2];
+    //运用图像学公式，设置灰度值
+    var grey = r * 0.3 + g * 0.59 + b * 0.11;
+    //将rgb的值替换为灰度值
+    pixelsTemp[i] = grey;
+    pixelsTemp[i + 1] = grey;
+    pixelsTemp[i + 2] = grey;
+
+    //基于灰色，设置为蓝色，这几个数值是我自己试出来的，可以根据需求调整
+    pixelsTemp[i] = 55 - pixelsTemp[i];
+    pixelsTemp[i + 1] = 255 - pixelsTemp[i + 1];
+    pixelsTemp[i + 2] = 305 - pixelsTemp[i + 2];
+  }
+};
+
+
 const vueGis = {
   name: 'HomeMap',
   data () {
@@ -1644,9 +1668,13 @@ const vueGis = {
           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
+        zIndex: 20,
+        crossOrigin: 'anonymous'
       });
 
+
+
+
       mapView = new View({
         //中心点坐标
         center: this.centerPoint,
@@ -1676,6 +1704,8 @@ const vueGis = {
         });
       map.removeInteraction(dblClickInteraction);
 
+
+
     },
     //添加标注图层
     addParentLayer () {
diff --git a/src/views/modules/visual/communityGovern/shijianchuli/lineOption.js b/src/views/modules/visual/communityGovern/shijianchuli/lineOption.js
index e9790c278..dc12db801 100644
--- a/src/views/modules/visual/communityGovern/shijianchuli/lineOption.js
+++ b/src/views/modules/visual/communityGovern/shijianchuli/lineOption.js
@@ -25,6 +25,13 @@ export function lineOption () {
         }
 
     },
+    // grid: {
+    //   left: '5%',
+    //   right: '5%',
+    //   bottom: '5%',
+    //   top: '10%',
+    //   containLabel: true
+    // },
     xAxis: {
       type: 'category',
       // boundaryGap: false,
diff --git a/src/views/modules/visual/components/screen-map/index.vue b/src/views/modules/visual/components/screen-map/index.vue
index 496f3e1c4..766f61e70 100644
--- a/src/views/modules/visual/components/screen-map/index.vue
+++ b/src/views/modules/visual/components/screen-map/index.vue
@@ -422,7 +422,7 @@ const vueGis = {
               // imgSize: [32, 32],
               // scale: 0.5,
               // src: oneIcon.urlIndex && this.iconUrlArray[oneIcon.urlIndex] || this.iconUrlArray[0] || this.iconUrlArray[0]
-              src: (oneIcon.urlIndex && this.iconUrlArray[oneIcon.urlIndex]) || (oneIcon.index &&this.iconUrlArray[oneIcon.index]) || this.iconUrlArray[0]
+              src: (oneIcon.urlIndex && this.iconUrlArray[oneIcon.urlIndex]) || (oneIcon.index && this.iconUrlArray[oneIcon.index]) || this.iconUrlArray[0]
             }),
             // text: createTextStyle(oneIcon)
           });
@@ -627,6 +627,8 @@ const vueGis = {
         this.zoom = 13
       } else if (level === 'community') {
         this.zoom = 14
+      } else {
+        this.zoom = 12
       }
 
     },
diff --git a/src/views/modules/workPc/guidance/DetailForm.vue b/src/views/modules/workPc/guidance/DetailForm.vue
index 8b878642b..8bea54ce7 100644
--- a/src/views/modules/workPc/guidance/DetailForm.vue
+++ b/src/views/modules/workPc/guidance/DetailForm.vue
@@ -334,7 +334,7 @@ export default {
         this.$message.error(msg)
       }
     },
-    dormatHtml(content) {
+    dormatHtml (content) {
       let c = ''
       if (content.indexOf('DOCTYPE') != -1) {
         c = content.slice(45, -16);