From 8e958228c457a13d5d1ac7498917e206998c1947 Mon Sep 17 00:00:00 2001
From: jiangyy <jiang478938504@126.com>
Date: Fri, 29 Oct 2021 15:37:11 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B0=8F=E5=8C=BA=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 epmet-oper-web/public/index.html              |   1 +
 .../modules/base/community/buildForm.vue      | 403 +++++++++++++++
 .../modules/base/community/buildTable.vue     | 365 +++++++++++++
 .../modules/base/community/community.vue      | 169 ++++++
 .../modules/base/community/communityForm.vue  | 484 ++++++++++++++++++
 .../modules/base/community/communityTable.vue | 374 ++++++++++++++
 .../views/modules/base/community/roomForm.vue | 403 +++++++++++++++
 .../modules/base/community/roomTable.vue      | 383 ++++++++++++++
 .../views/modules/workSys/basicInfoMap.vue    |  91 +---
 .../src/views/modules/workSys/mapConfig.vue   |  23 +-
 10 files changed, 2607 insertions(+), 89 deletions(-)
 create mode 100644 epmet-oper-web/src/views/modules/base/community/buildForm.vue
 create mode 100644 epmet-oper-web/src/views/modules/base/community/buildTable.vue
 create mode 100644 epmet-oper-web/src/views/modules/base/community/community.vue
 create mode 100644 epmet-oper-web/src/views/modules/base/community/communityForm.vue
 create mode 100644 epmet-oper-web/src/views/modules/base/community/communityTable.vue
 create mode 100644 epmet-oper-web/src/views/modules/base/community/roomForm.vue
 create mode 100644 epmet-oper-web/src/views/modules/base/community/roomTable.vue

diff --git a/epmet-oper-web/public/index.html b/epmet-oper-web/public/index.html
index 74c8614..2d6e6f3 100644
--- a/epmet-oper-web/public/index.html
+++ b/epmet-oper-web/public/index.html
@@ -5,6 +5,7 @@
   <meta charset="UTF-8" />
   <meta http-equiv="X-UA-Compatible" content="ie=edge" />
   <link rel="shortcut icon" href="<%= BASE_URL %>favicon.ico" />
+  <script charset="utf-8" src="https://map.qq.com/api/gljs?v=1.exp&libraries=service&key=XCUBZ-UYXCP-XZNDB-VI5P3-2Y3RO-6WBYO"></script>
 
   <!-- 站点配置 -->
   <script>
diff --git a/epmet-oper-web/src/views/modules/base/community/buildForm.vue b/epmet-oper-web/src/views/modules/base/community/buildForm.vue
new file mode 100644
index 0000000..d44fa75
--- /dev/null
+++ b/epmet-oper-web/src/views/modules/base/community/buildForm.vue
@@ -0,0 +1,403 @@
+<template>
+  <div>
+    <div>
+      <div v-show="!propertyFormShow">
+        <el-form :inline="false"
+                 :model="dataForm"
+                 :rules="dataRule"
+                 :disabled="formType==='detail'"
+                 class="form">
+          <el-form-item label="小区名称"
+                        prop="neighborHoodName"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入小区名称'
+                      v-model="dataForm.neighborHoodName">
+            </el-input>
+
+          </el-form-item>
+          <el-form-item label="所属组织"
+                        prop="agencyId"
+                        label-width="150px"
+                        style="display:block">
+            <el-select class="item_width_1"
+                       v-model="dataForm.agencyId"
+                       placeholder="请选择"
+                       @change="handleAgencyChanged"
+                       clearable>
+              <el-option v-for="item in agencyList"
+                         :key="item.agencyId"
+                         :label="item.agencyName"
+                         :value="item.agencyId">
+              </el-option>
+            </el-select>
+
+          </el-form-item>
+          <el-form-item label="所属网格"
+                        prop="gridId"
+                        label-width="150px"
+                        style="display:block">
+            <el-select class="item_width_1"
+                       v-model="dataForm.gridId"
+                       placeholder="请选择"
+                       clearable>
+              <el-option v-for="item in gridList"
+                         :key="item.gridId"
+                         :label="item.gridName"
+                         :value="item.gridId">
+              </el-option>
+            </el-select>
+
+          </el-form-item>
+          <el-form-item label="关联物业"
+                        prop="propertyId"
+                        label-width="150px"
+                        style="display:block">
+            <el-select class="item_width_2"
+                       v-model="dataForm.propertyId"
+                       placeholder="请选择"
+                       clearable>
+              <el-option v-for="item in propertyList"
+                         :key="item.propertyId"
+                         :label="item.propertyName"
+                         :value="item.propertyId">
+              </el-option>
+            </el-select>
+
+            <el-button style="margin-left:10px"
+                       type="primary"
+                       size="small"
+                       @click="handleAddProperty">添加物业</el-button>
+
+          </el-form-item>
+          <el-form-item label="详细地址"
+                        prop="address"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入详细地址'
+                      v-model="dataForm.address">
+            </el-input>
+
+          </el-form-item>
+          <el-form-item label="备注"
+                        prop="remark"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      type="textarea"
+                      maxlength="500"
+                      :rows="3"
+                      placeholder='请输入备注，不超过500字'
+                      v-model="dataForm.remark"></el-input>
+
+          </el-form-item>
+          <!-- <el-form-item label="位置坐标"
+                    prop="neighborHoodName"
+                    label-width="150px"
+                    style="display:block">
+        <el-input class="item_width_1"
+                  maxlength="50"
+                  show-word-limit
+                  placeholder='请输入小区名称'
+                  v-model="dataForm.neighborHoodName">
+        </el-input>
+
+      </el-form-item> -->
+
+        </el-form>
+      </div>
+
+      <div v-show="propertyFormShow">
+        <el-form :inline="false"
+                 :model="propertyForm"
+                 :rules="propertyRule"
+                 class="form">
+          <el-form-item label="物业名称"
+                        prop="name"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入小区名称'
+                      v-model="propertyForm.name">
+            </el-input>
+
+          </el-form-item>
+
+        </el-form>
+
+      </div>
+    </div>
+    <div class="div_btn">
+      <el-button @click="handleCancle">取 消</el-button>
+      <el-button v-if="formType!='detail'"
+                 type="primary"
+                 @click="handleComfirm">确 定</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 {
+      formType: 'add',//表单操作类型 add新增，edit编辑，detail详情
+
+      agencyList: [],
+      gridList: [],
+      propertyList: [],
+
+      neighborHoodId: '',//小区ID	
+      dataForm: {
+        neighborHoodName: '', // 小区名称【不超过50字】
+        agencyId: '', // 所属组织ID	
+        gridId: '', //所属网格ID	
+        propertyId: '', //关联物业	
+        address: '', //详细地址	
+        remark: '', //备注【最大500字】	
+        location: '', //坐标位置	
+        longitude: '', //经度
+        latitude: '', //纬度	
+      },
+
+      propertyFormShow: false,
+      propertyForm: {
+        name: ''
+      }
+
+    }
+  },
+  components: {
+
+  },
+  mounted () {
+  },
+
+  methods: {
+    async initForm (type, row) {
+      this.formType = type
+      if (row) {
+        this.neighborHoodId = row.neighborHoodId
+        this.dataForm = row
+      }
+
+      await this.loadAgency()
+      await this.loadProperty()
+    },
+
+    async handleAgencyChanged () {
+      await this.loadGrid()
+    },
+
+    //加载组织
+    async loadAgency () {
+      // const url = "/gov/org/agency/belongOrg"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/agency/belongOrg"
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.agencyList = data
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    //加载网格
+    async loadGrid () {
+      // const url = "/gov/org/grid/allgrids"
+      const url = "https://epmet-dev.elinkservice.cn:7082/api/apimock-v2/95518686fa128a53f64c678906848062/gov/org/grid/allgrids"
+      let params = {
+        agencyId: this.dataForm.agencyId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.gridList = data
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    //加载物业
+    async loadProperty () {
+      // const url = "/gov/org/propertymanagement/list"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/propertymanagement/list"
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.propertyList = data
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleAddProperty () {
+      this.propertyForm.name = ''
+      this.propertyFormShow = true
+    },
+
+    async handleComfirm () {
+      if (this.propertyFormShow) {
+
+        this.addProperty()
+      } else {
+        this.addCommunity()
+      }
+    },
+    async addCommunity () {
+      // let url = "/gov/org/neighborhood/neighborhoodadd"
+      let url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodadd"
+      if (this.formType === 'add') {
+        // url = "/gov/org/neighborhood/neighborhoodadd"
+        url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodadd"
+      } else {
+        // url = "/gov/org/neighborhood/neighborhoodadd"
+        url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodadd"
+        this.dataForm.neighborHoodId = this.neighborHoodId
+      }
+
+      const { data, code, msg } = await requestPost(url, this.dataForm)
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "添加小区成功"
+        });
+
+        this.propertyFormShow = false
+
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+    async addProperty () {
+      // const url = "/gov/org/propertymanagement/add"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/propertymanagement/add"
+      let params = {
+        name: this.propertyForm.name
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.$message({
+          type: "success",
+          message: "添加物业成功"
+        });
+        this.propertyForm.name = ''
+        this.propertyFormShow = false
+        this.loadProperty()
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+    handleCancle () {
+      if (this.propertyFormShow) {
+        this.propertyForm.name = ''
+        this.propertyFormShow = false
+      } else {
+        this.$emit('dialogCancle')
+      }
+
+
+    },
+    resetData () {
+
+
+    },
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    dataRule () {
+      return {
+        neighborHoodName: [
+          { required: true, message: '小区名称不能为空', trigger: 'blur' },
+          { min: 1, max: 50, message: '小区名称长度在 1 到 50个字符', trigger: 'blur' }
+        ],
+        agencyId: [
+          { required: true, message: '所属组织不能为空', trigger: 'blur' }
+        ],
+        gridId: [
+          { required: true, message: '所属网格不能为空', trigger: 'blur' }
+        ],
+        address: [
+          { required: true, message: '详细地址不能为空', trigger: 'blur' }
+        ],
+        location: [
+          { required: true, message: '上架状态不能为空', trigger: 'blur' }
+        ]
+
+      }
+    },
+    propertyRule () {
+      name: [
+        { required: true, message: '物业名称不能为空', trigger: 'blur' },
+        // { min: 1, max: 50, message: '小区名称长度在 1 到 50个字符', trigger: 'blur' }
+      ]
+    }
+  },
+  props: {
+
+  }
+}
+</script>
+<style scoped >
+.item_width_1 {
+  width: 500px;
+}
+.item_width_2 {
+  width: 400px;
+}
+
+.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;
+}
+</style>
diff --git a/epmet-oper-web/src/views/modules/base/community/buildTable.vue b/epmet-oper-web/src/views/modules/base/community/buildTable.vue
new file mode 100644
index 0000000..587f513
--- /dev/null
+++ b/epmet-oper-web/src/views/modules/base/community/buildTable.vue
@@ -0,0 +1,365 @@
+<template>
+  <div>
+    <div class="div_search">
+      <div class="resi-cell">
+        <div class="resi-cell-label">房主姓名</div>
+        <div class="resi-cell-value">
+          <el-input v-model="ownerName"
+                    class="resi-cell-input"
+                    size="small"
+                    clearable
+                    placeholder="请输入内容">
+          </el-input>
+
+        </div>
+      </div>
+      <div class="resi-cell">
+        <div class="resi-cell-label">房主手机</div>
+        <div class="resi-cell-value">
+          <el-input v-model="ownerPhone"
+                    class="resi-cell-input"
+                    size="small"
+                    clearable
+                    placeholder="请输入内容">
+          </el-input>
+
+        </div>
+      </div>
+      <el-button style="margin-left:10px"
+                 type="primary"
+                 size="small"
+                 @click="handleSearch">查询</el-button>
+    </div>
+    <div class="div_btn">
+      <el-button type="warning"
+                 size="small"
+                 @click="handleExport">导出</el-button>
+      <el-button type="success"
+                 size="small"
+                 @click="handleAdd">新增楼宇</el-button>
+      <el-button type="primary"
+                 size="small"
+                 @click="handleExportModule">下载楼宇模板</el-button>
+      <el-button type="danger"
+                 size="small"
+                 @click="handleInport">导入楼宇数据</el-button>
+    </div>
+
+    <div class="div_table">
+      <el-table :data="tableData"
+                border
+                style="width: 100%">
+        <el-table-column prop="neighborHoodName"
+                         label="小区名称"
+                         width="180">
+        </el-table-column>
+        <el-table-column prop="orgName"
+                         label="所属组织"
+                         width="160">
+        </el-table-column>
+        <el-table-column prop="gridName"
+                         label="所属网格"
+                         width="140">
+        </el-table-column>
+        <el-table-column prop="address"
+                         label="详细地址">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="备注">
+        </el-table-column>
+        <el-table-column label="操作"
+                         fixed="right"
+                         width="140"
+                         header-align="center"
+                         align="center"
+                         class="operate">
+          <template slot-scope="scope">
+
+            <el-button type="text"
+                       style="color:#1C6AFD;text-decoration: underline;"
+                       size="small"
+                       @click="handleDetail(scope.row)">查看</el-button>
+            <el-button type="text"
+                       style="color:#00A7A9;text-decoration: underline;"
+                       size="small"
+                       @click="handleEdit(scope.row)">修改</el-button>
+
+            <el-button type="text"
+                       style="color:#D51010;text-decoration: underline;"
+                       size="small"
+                       @click="handleDelete(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination @size-change="handleSizeChange"
+                       @current-change="handleCurrentChange"
+                       :current-page.sync="params.pageNo"
+                       :page-sizes="[20, 30, 50]"
+                       :page-size="params.pageSize"
+                       layout="sizes, prev, pager, next"
+                       :total="total">
+        </el-pagination>
+      </div>
+    </div>
+
+    <!-- 修改弹出框 -->
+    <el-dialog :visible.sync="formShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="formTitle"
+               width="800px"
+               @closed="diaClose">
+      <community-form ref="ref_form"
+                      @dialogCancle="addFormCancle"
+                      @dialogOk="addFormOk"></community-form>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+
+import CommunityForm from './communityForm'
+
+import { requestPost } from "@/js/dai/request";
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      loading: false,
+      total: 0,
+      params: {
+        pageSize: 20,
+        pageNo: 0,
+        ownerName: '',
+        ownerPhone: ''
+      },
+
+      ownerName: '',
+      ownerPhone: '',
+      tableData: [],
+
+      //form相关
+      formShow: false,
+      formTitle: '新增小区'
+
+    }
+  },
+  components: {
+    CommunityForm
+  },
+  async mounted () {
+
+  },
+  computed: {
+    rowHeight () {
+      return (this.clientHeight - 200) + 'px'
+    },
+    ...mapGetters(['clientHeight'])
+  },
+  methods: {
+    handleSearch () {
+      this.loadTable()
+    },
+    async loadTable () {
+      // const url = "/gov/org/neighborhood/neighborhoodlist"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodlist"
+      let params = {
+        pageSize: this.pageSize,
+        pageNo: this.pageNo,
+        ownerName: this.ownerName,
+        ownerPhone: this.ownerPhone
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.total = data.total
+        this.tableData = data.list
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    diaClose () {
+      this.formShow = false
+    },
+
+    handleDetail (row) {
+      this.formTitle = '小区详情'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('detail', row)
+      })
+    },
+
+    handleAdd () {
+      this.formTitle = '新增小区'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('add')
+      })
+    },
+
+    handleEdit (row) {
+      this.formTitle = '修改小区'
+      this.formShow = true
+      this.$refs.ref_form.initForm('edit', row)
+    },
+
+    addFormCancle () {
+      this.formShow = false
+    },
+    addFormOk () {
+      this.formShow = false
+      this.loadTable()
+    },
+
+    async handleDelete (row) {
+
+      this.$confirm("确认删除?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          this.deleteCommunity(row)
+        })
+        .catch(err => {
+          if (err == "cancel") {
+            // this.$message({
+            //   type: "info",
+            //   message: "已取消删除"
+            // });
+          }
+
+        });
+
+
+    },
+
+    async deleteCommunity (row) {
+      // const url = "/gov/org/neighborhood/neighborhooddel"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhooddel"
+      let params = {
+        neighborHoodId: row.neighborHoodId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "删除成功"
+        });
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleExport () {
+
+    },
+
+
+    handleExportModule () {
+
+    },
+    handleInport () {
+
+    },
+
+
+    handleSizeChange (val) {
+      console.log(`每页 ${val} 条`)
+    },
+    handleCurrentChange (val) {
+      console.log(`当前页: ${val}`)
+    },
+
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  watch: {
+    filterText (val) {
+      this.$refs.tree.filter(val);
+    }
+  },
+  props: {
+
+  }
+}
+</script>
+<style lang="scss" scoped >
+.div_search {
+  display: flex;
+
+  .resi-cell {
+    display: flex;
+    align-items: center;
+    .resi-cell-label {
+      width: 70px;
+      box-sizing: border-box;
+      margin-right: 15px;
+      text-align: right;
+      // line-height: 32;
+    }
+
+    .resi-cell-input {
+      width: 180px;
+    }
+  }
+}
+
+.div_table {
+  margin-top: 20px;
+}
+.div_search {
+  display: flex;
+
+  .resi-cell {
+    display: flex;
+    align-items: center;
+    .resi-cell-label {
+      width: 70px;
+      box-sizing: border-box;
+      margin-right: 15px;
+      text-align: right;
+      // line-height: 32;
+    }
+
+    .resi-cell-input {
+      width: 180px;
+    }
+  }
+}
+
+.div_btn {
+  margin-top: 20px;
+}
+
+.el-row {
+  /* margin-bottom: 20px; */
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 10px;
+  margin-right: 50px;
+}
+</style>
diff --git a/epmet-oper-web/src/views/modules/base/community/community.vue b/epmet-oper-web/src/views/modules/base/community/community.vue
new file mode 100644
index 0000000..2efa749
--- /dev/null
+++ b/epmet-oper-web/src/views/modules/base/community/community.vue
@@ -0,0 +1,169 @@
+<template>
+  <div>
+
+    <el-row class="row"
+            :gutter="10">
+      <el-col :span="5">
+        <el-card>
+
+          <div :style="{height:rowHeight}"
+               class="div_tree">
+            <el-input placeholder="输入关键字进行过滤"
+                      v-model="filterText">
+            </el-input>
+
+            <el-tree ref="ref_tree"
+                     class="filter-tree"
+                     :data="treeData"
+                     :props="defaultProps"
+                     node-key="id"
+                     :expand-on-click-node="false"
+                     default-expand-all
+                     :filter-node-method="filterNode"
+                     @node-click="handleNodeClick">
+            </el-tree>
+
+          </div>
+
+        </el-card>
+      </el-col>
+
+      <el-col :span="19">
+        <el-card>
+          <div :style="{height:rowHeight}">
+
+            <build-table v-if="selTreeLevel==='neighbourHood'"
+                         ref="ref_communityTable"></build-table>
+            <room-table v-else-if="selTreeLevel==='building'"
+                        ref="ref_communityTable"></room-table>
+            <community-table v-else
+                             ref="ref_communityTable"></community-table>
+
+          </div>
+        </el-card>
+      </el-col>
+
+    </el-row>
+
+  </div>
+</template>
+
+<script>
+import CDialog from '@c/CDialog'
+import communityTable from './communityTable'
+import buildTable from './buildTable'
+import roomTable from './roomTable'
+import { requestPost } from "@/js/dai/request";
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      filterText: '',
+      treeData: [],
+      defaultProps: {
+        children: 'children',
+        label: 'label'
+      },
+
+      selTreeId: '',
+      selTreeLevel: ''
+
+    }
+  },
+  components: {
+    CDialog
+  },
+  async mounted () {
+    await this.loadTree()
+
+    await this.$refs['ref_communityTable'].loadTable(this.selTreeId, this.selTreeLevel)
+  },
+  computed: {
+    rowHeight () {
+      return (this.clientHeight - 200) + 'px'
+    },
+    ...mapGetters(['clientHeight'])
+  },
+  methods: {
+    async loadTree () {
+      const url = "/gov/org/building/treelist"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/building/treelist"
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.treeData = data
+        if (data.length > 0) {
+          this.selTreeId = data[0].id
+          this.selTreeLevel = data[0].level
+        }
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleNodeClick (obj) {
+      this.$refs['ref_communityTable'].loadTable(obj.id, obj.level)
+    },
+
+    handleSizeChange (val) {
+      console.log(`每页 ${val} 条`)
+    },
+    handleCurrentChange (val) {
+      console.log(`当前页: ${val}`)
+    },
+
+    filterNode (value, data) {
+      if (!value) return true;
+      return data.label.indexOf(value) !== -1;
+    },
+
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  watch: {
+    filterText (val) {
+      this.$refs.tree.filter(val);
+    }
+  },
+  components: {
+    communityTable, buildTable, roomTable
+  }
+}
+</script>
+<style lang="scss" scoped >
+.div_tree {
+  overflow-y: auto;
+}
+
+.div_btn {
+  margin-top: 20px;
+}
+
+.el-row {
+  /* margin-bottom: 20px; */
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 10px;
+  margin-right: 50px;
+}
+</style>
diff --git a/epmet-oper-web/src/views/modules/base/community/communityForm.vue b/epmet-oper-web/src/views/modules/base/community/communityForm.vue
new file mode 100644
index 0000000..1f4b69c
--- /dev/null
+++ b/epmet-oper-web/src/views/modules/base/community/communityForm.vue
@@ -0,0 +1,484 @@
+<template>
+  <div>
+    <div>
+      <div v-show="!propertyFormShow">
+        <el-form :inline="false"
+                 :model="dataForm"
+                 :rules="dataRule"
+                 :disabled="formType==='detail'"
+                 class="form">
+          <el-form-item label="小区名称"
+                        prop="neighborHoodName"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入小区名称'
+                      v-model="dataForm.neighborHoodName">
+            </el-input>
+
+          </el-form-item>
+          <el-form-item label="所属组织"
+                        label-width="150px"
+                        style="display:block">
+            <span>{{dataForm.agencyName}}</span>
+
+          </el-form-item>
+          <el-form-item label="所属网格"
+                        prop="gridId"
+                        label-width="150px"
+                        style="display:block">
+            <el-select class="item_width_1"
+                       v-model="dataForm.gridId"
+                       placeholder="请选择"
+                       clearable>
+              <el-option v-for="item in gridList"
+                         :key="item.gridId"
+                         :label="item.gridName"
+                         :value="item.gridId">
+              </el-option>
+            </el-select>
+
+          </el-form-item>
+          <el-form-item label="关联物业"
+                        prop="propertyId"
+                        label-width="150px"
+                        style="display:block">
+            <el-select class="item_width_2"
+                       v-model="dataForm.propertyId"
+                       placeholder="请选择"
+                       clearable>
+              <el-option v-for="item in propertyList"
+                         :key="item.propertyId"
+                         :label="item.propertyName"
+                         :value="item.propertyId">
+              </el-option>
+            </el-select>
+
+            <el-button style="margin-left:10px"
+                       type="primary"
+                       size="small"
+                       @click="handleAddProperty">添加物业</el-button>
+
+          </el-form-item>
+          <el-form-item label="详细地址"
+                        prop="address"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入详细地址'
+                      v-model="dataForm.address">
+            </el-input>
+
+          </el-form-item>
+          <el-form-item label="备注"
+                        prop="remark"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      type="textarea"
+                      maxlength="500"
+                      show-word-limit
+                      :rows="3"
+                      placeholder='请输入备注，不超过500字'
+                      v-model="dataForm.remark"></el-input>
+
+          </el-form-item>
+          <el-form-item label="位置坐标"
+                        prop="longitude"
+                        label-width="150px"
+                        style="display:block">
+
+            <el-input class="item_width_3"
+                      maxlength="50"
+                      placeholder='请输入关键字'
+                      v-model="keyWords">
+
+            </el-input>
+            <el-button style="margin-left:10px"
+                       type="primary"
+                       size="small"
+                       @click="handleSearchMap">查询</el-button>
+            <div id="app"
+                 class="div_map">
+            </div>
+            <div style="margin-top:10px">
+              <span>经度</span>
+              <el-input class="item_width_3"
+                        maxlength="50"
+                        placeholder='请输入经度'
+                        v-model="dataForm.longitude">
+              </el-input>
+              <span style="margin-left:20px">纬度</span>
+              <el-input class="item_width_3"
+                        maxlength="50"
+                        placeholder='请输入纬度'
+                        v-model="dataForm.latitude">
+              </el-input>
+            </div>
+
+          </el-form-item>
+
+        </el-form>
+
+      </div>
+
+      <div v-show="propertyFormShow">
+        <el-form :inline="false"
+                 :model="propertyForm"
+                 :rules="propertyRule"
+                 class="form">
+          <el-form-item label="物业名称"
+                        prop="name"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入小区名称'
+                      v-model="propertyForm.name">
+            </el-input>
+
+          </el-form-item>
+
+        </el-form>
+
+      </div>
+    </div>
+    <div class="div_btn">
+      <el-button @click="handleCancle">取 消</el-button>
+      <el-button v-if="formType!='detail'"
+                 type="primary"
+                 @click="handleComfirm">确 定</el-button>
+    </div>
+
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+import { requestPost } from "@/js/dai/request";
+var map;
+var search;
+var markers;
+var infoWindowList
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      formType: 'add',//表单操作类型 add新增，edit编辑，detail详情
+
+      gridList: [],
+      propertyList: [],
+
+      neighborHoodId: '',//小区ID	
+      dataForm: {
+        neighborHoodName: '', // 小区名称【不超过50字】
+        agencyId: '', // 所属组织ID	
+        agencyName: '',
+        gridId: '', //所属网格ID	
+        propertyId: '', //关联物业	
+        address: '', //详细地址	
+        remark: '', //备注【最大500字】	
+        location: '', //坐标位置	
+        longitude: '', //经度
+        latitude: '', //纬度	
+      },
+
+      propertyFormShow: false,
+      propertyForm: {
+        name: ''
+      },
+
+      keyWords: ''
+
+
+    }
+  },
+  components: {
+
+  },
+  mounted () {
+    this.initMap()
+  },
+
+  methods: {
+    // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
+    initMap () {
+      // 定义地图中心点坐标
+      var center = new window.TMap.LatLng(39.984120, 116.307484)
+      // 定义map变量，调用 TMap.Map() 构造函数创建地图
+      map = new window.TMap.Map(document.getElementById('app'), {
+        center: center, // 设置地图中心点坐标
+        zoom: 17.2, // 设置地图缩放级别
+        pitch: 43.5, // 设置俯仰角
+        rotation: 45 // 设置地图旋转角度
+      })
+      console.log(map)
+      console.log(window)
+      search = new window.TMap.service.Search({ pageSize: 10 });
+      // 新建一个地点搜索类
+      markers = new TMap.MultiMarker({
+        map: map,
+        geometries: [],
+      });
+      infoWindowList = Array(10);
+    },
+
+    handleSearchMap () {
+      infoWindowList.forEach((infoWindow) => {
+        infoWindow.close();
+      });
+      infoWindowList.length = 0;
+      markers.setGeometries([]);
+      // 在地图显示范围内以给定的关键字搜索地点
+      search
+        .searchRectangle({
+          keyword: this.keyWords,
+          bounds: map.getBounds(),
+        })
+        .then((result) => {
+          result.data.forEach((item, index) => {
+            var geometries = markers.getGeometries();
+            var infoWindow = new window.TMap.InfoWindow({
+              map: map,
+              position: item.location,
+              content: `<h3>${item.title}</h3><p>地址：${item.address}</p><p>电话：${item.tel}</p>`,
+              offset: { x: 0, y: -50 },
+            }); // 新增信息窗体显示地标的名称与地址、电话等信息
+            infoWindow.close();
+            infoWindowList[index] = infoWindow;
+            geometries.push({
+              id: String(index), // 点标注数据数组
+              position: item.location,
+            });
+            markers.updateGeometries(geometries); // 绘制地点标注
+            markers.on('click', (e) => {
+              infoWindowList[Number(e.geometry.id)].open();
+            }); // 点击标注显示信息窗体
+          });
+        });
+    },
+    async initForm (type, row) {
+      this.formType = type
+      if (row) {
+        this.neighborHoodId = row.neighborHoodId
+        this.dataForm = row
+      }
+
+      await this.loadAgency()
+      await this.loadGrid()
+      // await this.loadProperty()
+    },
+
+    //加载组织
+    async loadAgency () {
+      const url = "/epmetuser/customerstaff/staffbasicinfo"
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.dataForm.agencyId = data.agencyId
+        this.dataForm.agencyName = data.agencyName
+
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    //加载网格
+    async loadGrid () {
+      const url = "/gov/org/grid/allgrids"
+      // const url = "https://epmet-dev.elinkservice.cn:7082/api/apimock-v2/95518686fa128a53f64c678906848062/gov/org/grid/allgrids"
+      let params = {
+        agencyId: this.dataForm.agencyId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.gridList = data
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    //加载物业
+    async loadProperty () {
+      const url = "/gov/org/propertymanagement/list"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/propertymanagement/list"
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.propertyList = data
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleAddProperty () {
+      this.propertyForm.name = ''
+      this.propertyFormShow = true
+    },
+
+    async handleComfirm () {
+      if (this.propertyFormShow) {
+
+        this.addProperty()
+      } else {
+        this.addCommunity()
+      }
+    },
+    async addCommunity () {
+
+      let url = ""
+      if (this.formType === 'add') {
+        url = "/gov/org/neighborhood/neighborhoodadd"
+        // url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodadd"
+      } else {
+        url = "/gov/org/neighborhood/neighborhoodupdate"
+
+        this.dataForm.neighborHoodId = this.neighborHoodId
+      }
+
+      const { data, code, msg } = await requestPost(url, this.dataForm)
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "添加小区成功"
+        });
+
+        this.propertyFormShow = false
+
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+    async addProperty () {
+      const url = "/gov/org/propertymanagement/add"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/propertymanagement/add"
+      let params = {
+        name: this.propertyForm.name
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.$message({
+          type: "success",
+          message: "添加物业成功"
+        });
+        this.propertyForm.name = ''
+        this.propertyFormShow = false
+        this.loadProperty()
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+    handleCancle () {
+      if (this.propertyFormShow) {
+        this.propertyForm.name = ''
+        this.propertyFormShow = false
+      } else {
+        this.$emit('dialogCancle')
+      }
+
+
+    },
+    resetData () {
+
+
+    },
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    dataRule () {
+      return {
+        neighborHoodName: [
+          { required: true, message: '小区名称不能为空', trigger: 'blur' },
+          { min: 1, max: 50, message: '小区名称长度在 1 到 50个字符', trigger: 'blur' }
+        ],
+        agencyId: [
+          { required: true, message: '所属组织不能为空', trigger: 'blur' }
+        ],
+        gridId: [
+          { required: true, message: '所属网格不能为空', trigger: 'blur' }
+        ],
+        address: [
+          { required: true, message: '详细地址不能为空', trigger: 'blur' }
+        ],
+        longitude: [
+          { required: true, message: '坐标不能为空', trigger: 'blur' }
+        ]
+
+      }
+    },
+    propertyRule () {
+      name: [
+        { required: true, message: '物业名称不能为空', trigger: 'blur' },
+        // { min: 1, max: 50, message: '小区名称长度在 1 到 50个字符', trigger: 'blur' }
+      ]
+    }
+  },
+  props: {
+
+  }
+}
+</script>
+<style scoped >
+.item_width_1 {
+  width: 500px;
+}
+.item_width_2 {
+  width: 400px;
+}
+.item_width_3 {
+  margin-left: 10px;
+  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;
+}
+</style>
diff --git a/epmet-oper-web/src/views/modules/base/community/communityTable.vue b/epmet-oper-web/src/views/modules/base/community/communityTable.vue
new file mode 100644
index 0000000..9ae55cd
--- /dev/null
+++ b/epmet-oper-web/src/views/modules/base/community/communityTable.vue
@@ -0,0 +1,374 @@
+<template>
+  <div>
+    <div class="div_search">
+      <div class="resi-cell">
+        <div class="resi-cell-label">房主姓名</div>
+        <div class="resi-cell-value">
+          <el-input v-model="ownerName"
+                    class="resi-cell-input"
+                    size="small"
+                    clearable
+                    placeholder="请输入内容">
+          </el-input>
+
+        </div>
+      </div>
+      <div class="resi-cell">
+        <div class="resi-cell-label">房主手机</div>
+        <div class="resi-cell-value">
+          <el-input v-model="ownerPhone"
+                    class="resi-cell-input"
+                    size="small"
+                    clearable
+                    placeholder="请输入内容">
+          </el-input>
+
+        </div>
+      </div>
+      <el-button style="margin-left:10px"
+                 type="primary"
+                 size="small"
+                 @click="handleSearch">查询</el-button>
+    </div>
+    <div class="div_btn">
+      <el-button type="warning"
+                 size="small"
+                 @click="handleExport">导出</el-button>
+      <el-button type="success"
+                 size="small"
+                 @click="handleAdd">新增小区</el-button>
+      <el-button type="primary"
+                 size="small"
+                 @click="handleExportModule">下载小区模板</el-button>
+      <el-button type="danger"
+                 size="small"
+                 @click="handleInport">导入小区数据</el-button>
+    </div>
+
+    <div class="div_table">
+      <el-table :data="tableData"
+                border
+                style="width: 100%">
+        <el-table-column prop="neighborHoodName"
+                         label="小区名称"
+                         width="180">
+        </el-table-column>
+        <el-table-column prop="orgName"
+                         label="所属组织"
+                         width="160">
+        </el-table-column>
+        <el-table-column prop="gridName"
+                         label="所属网格"
+                         width="140">
+        </el-table-column>
+        <el-table-column prop="address"
+                         label="详细地址">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="备注">
+        </el-table-column>
+        <el-table-column label="操作"
+                         fixed="right"
+                         width="140"
+                         header-align="center"
+                         align="center"
+                         class="operate">
+          <template slot-scope="scope">
+
+            <el-button type="text"
+                       style="color:#1C6AFD;text-decoration: underline;"
+                       size="small"
+                       @click="handleDetail(scope.row)">查看</el-button>
+            <el-button type="text"
+                       style="color:#00A7A9;text-decoration: underline;"
+                       size="small"
+                       @click="handleEdit(scope.row)">修改</el-button>
+
+            <el-button type="text"
+                       style="color:#D51010;text-decoration: underline;"
+                       size="small"
+                       @click="handleDelete(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination @size-change="handleSizeChange"
+                       @current-change="handleCurrentChange"
+                       :current-page.sync="params.pageNo"
+                       :page-sizes="[20, 30, 50]"
+                       :page-size="params.pageSize"
+                       layout="sizes, prev, pager, next"
+                       :total="total">
+        </el-pagination>
+      </div>
+    </div>
+
+    <!-- 修改弹出框 -->
+    <el-dialog :visible.sync="formShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="formTitle"
+               width="800px"
+               top='5'
+               @closed="diaClose">
+      <community-form ref="ref_form"
+                      @dialogCancle="addFormCancle"
+                      @dialogOk="addFormOk"></community-form>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+
+import CommunityForm from './communityForm'
+
+import { requestPost } from "@/js/dai/request";
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      loading: false,
+      total: 0,
+      params: {
+        pageSize: 20,
+        pageNo: 0,
+        ownerName: '',
+        ownerPhone: ''
+      },
+
+      selTreeId: '',
+      selTreeLevel: '',
+      ownerName: '',
+      ownerPhone: '',
+      tableData: [],
+
+      //form相关
+      formShow: false,
+      formTitle: '新增小区'
+
+    }
+  },
+  components: {
+    CommunityForm
+  },
+  async mounted () {
+
+  },
+  computed: {
+    rowHeight () {
+      return (this.clientHeight - 200) + 'px'
+    },
+    ...mapGetters(['clientHeight'])
+  },
+  methods: {
+    handleSearch () {
+      this.loadTable()
+    },
+    async loadTable (selTreeId, selTreeLevel) {
+      if (selTreeId && selTreeLevel) {
+        this.selTreeId = selTreeId
+        this.selTreeLevel = selTreeLevel
+      }
+      const url = "/gov/org/neighborhood/neighborhoodlist"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodlist"
+      let params = {
+        pageSize: this.pageSize,
+        pageNo: this.pageNo,
+        ownerName: this.ownerName,
+        ownerPhone: this.ownerPhone,
+        level: this.selTreeId,
+        id: this.selTreeLevel
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.total = data.total
+        this.tableData = data.list
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    diaClose () {
+      this.formShow = false
+    },
+
+    handleDetail (row) {
+      this.formTitle = '小区详情'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('detail', row)
+      })
+    },
+
+    handleAdd () {
+      this.formTitle = '新增小区'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('add')
+      })
+    },
+
+    handleEdit (row) {
+      this.formTitle = '修改小区'
+      this.formShow = true
+      this.$refs.ref_form.initForm('edit', row)
+    },
+
+    addFormCancle () {
+      this.formShow = false
+    },
+    addFormOk () {
+      this.formShow = false
+      this.loadTable()
+    },
+
+    async handleDelete (row) {
+
+      this.$confirm("确认删除?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          this.deleteCommunity(row)
+        })
+        .catch(err => {
+          if (err == "cancel") {
+            // this.$message({
+            //   type: "info",
+            //   message: "已取消删除"
+            // });
+          }
+
+        });
+
+
+    },
+
+    async deleteCommunity (row) {
+      const url = "/gov/org/neighborhood/neighborhooddel"
+      // const url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhooddel"
+      let params = {
+        neighborHoodId: row.neighborHoodId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "删除成功"
+        });
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleExport () {
+
+    },
+
+
+    handleExportModule () {
+
+    },
+    handleInport () {
+
+    },
+
+
+    handleSizeChange (val) {
+      console.log(`每页 ${val} 条`)
+    },
+    handleCurrentChange (val) {
+      console.log(`当前页: ${val}`)
+    },
+
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  watch: {
+    filterText (val) {
+      this.$refs.tree.filter(val);
+    }
+  },
+  props: {
+
+  }
+}
+</script>
+<style lang="scss" scoped >
+.div_search {
+  display: flex;
+
+  .resi-cell {
+    display: flex;
+    align-items: center;
+    .resi-cell-label {
+      width: 70px;
+      box-sizing: border-box;
+      margin-right: 15px;
+      text-align: right;
+      // line-height: 32;
+    }
+
+    .resi-cell-input {
+      width: 180px;
+    }
+  }
+}
+
+.div_table {
+  margin-top: 20px;
+}
+.div_search {
+  display: flex;
+
+  .resi-cell {
+    display: flex;
+    align-items: center;
+    .resi-cell-label {
+      width: 70px;
+      box-sizing: border-box;
+      margin-right: 15px;
+      text-align: right;
+      // line-height: 32;
+    }
+
+    .resi-cell-input {
+      width: 180px;
+    }
+  }
+}
+
+.div_btn {
+  margin-top: 20px;
+}
+
+.el-row {
+  /* margin-bottom: 20px; */
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 10px;
+  margin-right: 50px;
+}
+</style>
diff --git a/epmet-oper-web/src/views/modules/base/community/roomForm.vue b/epmet-oper-web/src/views/modules/base/community/roomForm.vue
new file mode 100644
index 0000000..d44fa75
--- /dev/null
+++ b/epmet-oper-web/src/views/modules/base/community/roomForm.vue
@@ -0,0 +1,403 @@
+<template>
+  <div>
+    <div>
+      <div v-show="!propertyFormShow">
+        <el-form :inline="false"
+                 :model="dataForm"
+                 :rules="dataRule"
+                 :disabled="formType==='detail'"
+                 class="form">
+          <el-form-item label="小区名称"
+                        prop="neighborHoodName"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入小区名称'
+                      v-model="dataForm.neighborHoodName">
+            </el-input>
+
+          </el-form-item>
+          <el-form-item label="所属组织"
+                        prop="agencyId"
+                        label-width="150px"
+                        style="display:block">
+            <el-select class="item_width_1"
+                       v-model="dataForm.agencyId"
+                       placeholder="请选择"
+                       @change="handleAgencyChanged"
+                       clearable>
+              <el-option v-for="item in agencyList"
+                         :key="item.agencyId"
+                         :label="item.agencyName"
+                         :value="item.agencyId">
+              </el-option>
+            </el-select>
+
+          </el-form-item>
+          <el-form-item label="所属网格"
+                        prop="gridId"
+                        label-width="150px"
+                        style="display:block">
+            <el-select class="item_width_1"
+                       v-model="dataForm.gridId"
+                       placeholder="请选择"
+                       clearable>
+              <el-option v-for="item in gridList"
+                         :key="item.gridId"
+                         :label="item.gridName"
+                         :value="item.gridId">
+              </el-option>
+            </el-select>
+
+          </el-form-item>
+          <el-form-item label="关联物业"
+                        prop="propertyId"
+                        label-width="150px"
+                        style="display:block">
+            <el-select class="item_width_2"
+                       v-model="dataForm.propertyId"
+                       placeholder="请选择"
+                       clearable>
+              <el-option v-for="item in propertyList"
+                         :key="item.propertyId"
+                         :label="item.propertyName"
+                         :value="item.propertyId">
+              </el-option>
+            </el-select>
+
+            <el-button style="margin-left:10px"
+                       type="primary"
+                       size="small"
+                       @click="handleAddProperty">添加物业</el-button>
+
+          </el-form-item>
+          <el-form-item label="详细地址"
+                        prop="address"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入详细地址'
+                      v-model="dataForm.address">
+            </el-input>
+
+          </el-form-item>
+          <el-form-item label="备注"
+                        prop="remark"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      type="textarea"
+                      maxlength="500"
+                      :rows="3"
+                      placeholder='请输入备注，不超过500字'
+                      v-model="dataForm.remark"></el-input>
+
+          </el-form-item>
+          <!-- <el-form-item label="位置坐标"
+                    prop="neighborHoodName"
+                    label-width="150px"
+                    style="display:block">
+        <el-input class="item_width_1"
+                  maxlength="50"
+                  show-word-limit
+                  placeholder='请输入小区名称'
+                  v-model="dataForm.neighborHoodName">
+        </el-input>
+
+      </el-form-item> -->
+
+        </el-form>
+      </div>
+
+      <div v-show="propertyFormShow">
+        <el-form :inline="false"
+                 :model="propertyForm"
+                 :rules="propertyRule"
+                 class="form">
+          <el-form-item label="物业名称"
+                        prop="name"
+                        label-width="150px"
+                        style="display:block">
+            <el-input class="item_width_1"
+                      maxlength="50"
+                      show-word-limit
+                      placeholder='请输入小区名称'
+                      v-model="propertyForm.name">
+            </el-input>
+
+          </el-form-item>
+
+        </el-form>
+
+      </div>
+    </div>
+    <div class="div_btn">
+      <el-button @click="handleCancle">取 消</el-button>
+      <el-button v-if="formType!='detail'"
+                 type="primary"
+                 @click="handleComfirm">确 定</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 {
+      formType: 'add',//表单操作类型 add新增，edit编辑，detail详情
+
+      agencyList: [],
+      gridList: [],
+      propertyList: [],
+
+      neighborHoodId: '',//小区ID	
+      dataForm: {
+        neighborHoodName: '', // 小区名称【不超过50字】
+        agencyId: '', // 所属组织ID	
+        gridId: '', //所属网格ID	
+        propertyId: '', //关联物业	
+        address: '', //详细地址	
+        remark: '', //备注【最大500字】	
+        location: '', //坐标位置	
+        longitude: '', //经度
+        latitude: '', //纬度	
+      },
+
+      propertyFormShow: false,
+      propertyForm: {
+        name: ''
+      }
+
+    }
+  },
+  components: {
+
+  },
+  mounted () {
+  },
+
+  methods: {
+    async initForm (type, row) {
+      this.formType = type
+      if (row) {
+        this.neighborHoodId = row.neighborHoodId
+        this.dataForm = row
+      }
+
+      await this.loadAgency()
+      await this.loadProperty()
+    },
+
+    async handleAgencyChanged () {
+      await this.loadGrid()
+    },
+
+    //加载组织
+    async loadAgency () {
+      // const url = "/gov/org/agency/belongOrg"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/agency/belongOrg"
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.agencyList = data
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    //加载网格
+    async loadGrid () {
+      // const url = "/gov/org/grid/allgrids"
+      const url = "https://epmet-dev.elinkservice.cn:7082/api/apimock-v2/95518686fa128a53f64c678906848062/gov/org/grid/allgrids"
+      let params = {
+        agencyId: this.dataForm.agencyId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.gridList = data
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+    //加载物业
+    async loadProperty () {
+      // const url = "/gov/org/propertymanagement/list"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/propertymanagement/list"
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.propertyList = data
+
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleAddProperty () {
+      this.propertyForm.name = ''
+      this.propertyFormShow = true
+    },
+
+    async handleComfirm () {
+      if (this.propertyFormShow) {
+
+        this.addProperty()
+      } else {
+        this.addCommunity()
+      }
+    },
+    async addCommunity () {
+      // let url = "/gov/org/neighborhood/neighborhoodadd"
+      let url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodadd"
+      if (this.formType === 'add') {
+        // url = "/gov/org/neighborhood/neighborhoodadd"
+        url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodadd"
+      } else {
+        // url = "/gov/org/neighborhood/neighborhoodadd"
+        url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodadd"
+        this.dataForm.neighborHoodId = this.neighborHoodId
+      }
+
+      const { data, code, msg } = await requestPost(url, this.dataForm)
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "添加小区成功"
+        });
+
+        this.propertyFormShow = false
+
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+    async addProperty () {
+      // const url = "/gov/org/propertymanagement/add"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/propertymanagement/add"
+      let params = {
+        name: this.propertyForm.name
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+
+        this.$message({
+          type: "success",
+          message: "添加物业成功"
+        });
+        this.propertyForm.name = ''
+        this.propertyFormShow = false
+        this.loadProperty()
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+    handleCancle () {
+      if (this.propertyFormShow) {
+        this.propertyForm.name = ''
+        this.propertyFormShow = false
+      } else {
+        this.$emit('dialogCancle')
+      }
+
+
+    },
+    resetData () {
+
+
+    },
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    dataRule () {
+      return {
+        neighborHoodName: [
+          { required: true, message: '小区名称不能为空', trigger: 'blur' },
+          { min: 1, max: 50, message: '小区名称长度在 1 到 50个字符', trigger: 'blur' }
+        ],
+        agencyId: [
+          { required: true, message: '所属组织不能为空', trigger: 'blur' }
+        ],
+        gridId: [
+          { required: true, message: '所属网格不能为空', trigger: 'blur' }
+        ],
+        address: [
+          { required: true, message: '详细地址不能为空', trigger: 'blur' }
+        ],
+        location: [
+          { required: true, message: '上架状态不能为空', trigger: 'blur' }
+        ]
+
+      }
+    },
+    propertyRule () {
+      name: [
+        { required: true, message: '物业名称不能为空', trigger: 'blur' },
+        // { min: 1, max: 50, message: '小区名称长度在 1 到 50个字符', trigger: 'blur' }
+      ]
+    }
+  },
+  props: {
+
+  }
+}
+</script>
+<style scoped >
+.item_width_1 {
+  width: 500px;
+}
+.item_width_2 {
+  width: 400px;
+}
+
+.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;
+}
+</style>
diff --git a/epmet-oper-web/src/views/modules/base/community/roomTable.vue b/epmet-oper-web/src/views/modules/base/community/roomTable.vue
new file mode 100644
index 0000000..a30e328
--- /dev/null
+++ b/epmet-oper-web/src/views/modules/base/community/roomTable.vue
@@ -0,0 +1,383 @@
+<template>
+  <div>
+    <div class="div_search">
+      <div class="resi-cell">
+        <div class="resi-cell-label">房主姓名</div>
+        <div class="resi-cell-value">
+          <el-input v-model="ownerName"
+                    class="resi-cell-input"
+                    size="small"
+                    clearable
+                    placeholder="请输入内容">
+          </el-input>
+
+        </div>
+      </div>
+      <div class="resi-cell">
+        <div class="resi-cell-label">房主手机</div>
+        <div class="resi-cell-value">
+          <el-input v-model="ownerPhone"
+                    class="resi-cell-input"
+                    size="small"
+                    clearable
+                    placeholder="请输入内容">
+          </el-input>
+
+        </div>
+      </div>
+      <el-button style="margin-left:10px"
+                 type="primary"
+                 size="small"
+                 @click="handleSearch">查询</el-button>
+    </div>
+    <div class="div_btn">
+      <el-button type="warning"
+                 size="small"
+                 @click="handleExport">导出</el-button>
+      <el-button type="success"
+                 size="small"
+                 @click="handleAdd">新增房屋</el-button>
+      <el-button type="primary"
+                 size="small"
+                 @click="handleExportModule">下载房屋模板</el-button>
+      <el-button type="danger"
+                 size="small"
+                 @click="handleInport">导入房屋数据</el-button>
+    </div>
+
+    <div class="div_table">
+      <el-table :data="tableData"
+                border
+                style="width: 100%">
+        <el-table-column prop="neighborHoodName"
+                         label="房屋名称"
+                         width="180">
+        </el-table-column>
+        <el-table-column prop="orgName"
+                         label="所属小区"
+                         width="160">
+        </el-table-column>
+        <el-table-column prop="gridName"
+                         label="所属楼栋"
+                         width="140">
+        </el-table-column>
+        <el-table-column prop="address"
+                         label="单元号">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="门牌号">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="房屋类型">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="房屋用途">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="是否出租">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="房主姓名">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="房主电话">
+        </el-table-column>
+        <el-table-column prop="remark"
+                         label="身份证号码">
+        </el-table-column>
+        <el-table-column label="操作"
+                         fixed="right"
+                         width="140"
+                         header-align="center"
+                         align="center"
+                         class="operate">
+          <template slot-scope="scope">
+
+            <el-button type="text"
+                       style="color:#1C6AFD;text-decoration: underline;"
+                       size="small"
+                       @click="handleDetail(scope.row)">查看</el-button>
+            <el-button type="text"
+                       style="color:#00A7A9;text-decoration: underline;"
+                       size="small"
+                       @click="handleEdit(scope.row)">修改</el-button>
+
+            <el-button type="text"
+                       style="color:#D51010;text-decoration: underline;"
+                       size="small"
+                       @click="handleDelete(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination @size-change="handleSizeChange"
+                       @current-change="handleCurrentChange"
+                       :current-page.sync="params.pageNo"
+                       :page-sizes="[20, 30, 50]"
+                       :page-size="params.pageSize"
+                       layout="sizes, prev, pager, next"
+                       :total="total">
+        </el-pagination>
+      </div>
+    </div>
+
+    <!-- 修改弹出框 -->
+    <el-dialog :visible.sync="formShow"
+               :close-on-click-modal="false"
+               :close-on-press-escape="false"
+               :title="formTitle"
+               width="800px"
+               @closed="diaClose">
+      <community-form ref="ref_form"
+                      @dialogCancle="addFormCancle"
+                      @dialogOk="addFormOk"></community-form>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+
+import CommunityForm from './communityForm'
+
+import { requestPost } from "@/js/dai/request";
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      loading: false,
+      total: 0,
+      params: {
+        pageSize: 20,
+        pageNo: 0,
+        ownerName: '',
+        ownerPhone: ''
+      },
+
+      ownerName: '',
+      ownerPhone: '',
+      tableData: [],
+
+      //form相关
+      formShow: false,
+      formTitle: '新增小区'
+
+    }
+  },
+  components: {
+    CommunityForm
+  },
+  async mounted () {
+
+  },
+  computed: {
+    rowHeight () {
+      return (this.clientHeight - 200) + 'px'
+    },
+    ...mapGetters(['clientHeight'])
+  },
+  methods: {
+    handleSearch () {
+      this.loadTable()
+    },
+    async loadTable () {
+      // const url = "/gov/org/neighborhood/neighborhoodlist"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhoodlist"
+      let params = {
+        pageSize: this.pageSize,
+        pageNo: this.pageNo,
+        ownerName: this.ownerName,
+        ownerPhone: this.ownerPhone
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.total = data.total
+        this.tableData = data.list
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    diaClose () {
+      this.formShow = false
+    },
+
+    handleDetail (row) {
+      this.formTitle = '小区详情'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('detail', row)
+      })
+    },
+
+    handleAdd () {
+      this.formTitle = '新增小区'
+      this.formShow = true
+      this.$nextTick(() => {
+        this.$refs.ref_form.initForm('add')
+      })
+    },
+
+    handleEdit (row) {
+      this.formTitle = '修改小区'
+      this.formShow = true
+      this.$refs.ref_form.initForm('edit', row)
+    },
+
+    addFormCancle () {
+      this.formShow = false
+    },
+    addFormOk () {
+      this.formShow = false
+      this.loadTable()
+    },
+
+    async handleDelete (row) {
+
+      this.$confirm("确认删除?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          this.deleteCommunity(row)
+        })
+        .catch(err => {
+          if (err == "cancel") {
+            // this.$message({
+            //   type: "info",
+            //   message: "已取消删除"
+            // });
+          }
+
+        });
+
+
+    },
+
+    async deleteCommunity (row) {
+      // const url = "/gov/org/neighborhood/neighborhooddel"
+      const url = "http://yapi.elinkservice.cn/mock/245/gov/org/neighborhood/neighborhooddel"
+      let params = {
+        neighborHoodId: row.neighborHoodId
+      }
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        this.$message({
+          type: "success",
+          message: "删除成功"
+        });
+      } else {
+        this.$message.error(msg)
+      }
+    },
+
+    handleExport () {
+
+    },
+
+
+    handleExportModule () {
+
+    },
+    handleInport () {
+
+    },
+
+
+    handleSizeChange (val) {
+      console.log(`每页 ${val} 条`)
+    },
+    handleCurrentChange (val) {
+      console.log(`当前页: ${val}`)
+    },
+
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      // clearTimeout(timer);
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  watch: {
+    filterText (val) {
+      this.$refs.tree.filter(val);
+    }
+  },
+  props: {
+
+  }
+}
+</script>
+<style lang="scss" scoped >
+.div_search {
+  display: flex;
+
+  .resi-cell {
+    display: flex;
+    align-items: center;
+    .resi-cell-label {
+      width: 70px;
+      box-sizing: border-box;
+      margin-right: 15px;
+      text-align: right;
+      // line-height: 32;
+    }
+
+    .resi-cell-input {
+      width: 180px;
+    }
+  }
+}
+
+.div_table {
+  margin-top: 20px;
+}
+.div_search {
+  display: flex;
+
+  .resi-cell {
+    display: flex;
+    align-items: center;
+    .resi-cell-label {
+      width: 70px;
+      box-sizing: border-box;
+      margin-right: 15px;
+      text-align: right;
+      // line-height: 32;
+    }
+
+    .resi-cell-input {
+      width: 180px;
+    }
+  }
+}
+
+.div_btn {
+  margin-top: 20px;
+}
+
+.el-row {
+  /* margin-bottom: 20px; */
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 10px;
+  margin-right: 50px;
+}
+</style>
diff --git a/epmet-oper-web/src/views/modules/workSys/basicInfoMap.vue b/epmet-oper-web/src/views/modules/workSys/basicInfoMap.vue
index 21e995c..8f7f67e 100644
--- a/epmet-oper-web/src/views/modules/workSys/basicInfoMap.vue
+++ b/epmet-oper-web/src/views/modules/workSys/basicInfoMap.vue
@@ -5,18 +5,11 @@
     <div>组织路由</div>
 
     <div class="div_search">
-      <el-select v-model="selAgencyId"
-                 placeholder="请选择未添加标注的组织">
-        <el-option @click.native="orgChange(index)"
-                   v-for="(item,index) in subAgencyArray"
-                   :key="item.id"
-                   :label="item.name"
-                   :value="item.id">
-        </el-option>
-      </el-select>
-
-      <el-button v-if="showBtn&&!hasPolygon"
-                 style="margin-left:10px"
+      <el-input style="width:200px"
+                v-model="selAgencyId"
+                placeholder="请输入姓名"></el-input>
+
+      <el-button style="margin-left:10px"
                  type="primary"
                  icon="el-icon-plus"
                  @click="handleSearch">搜索</el-button>
@@ -28,7 +21,9 @@
       <div id="map"
            class="div_map"
            :style="{height:mapHeight+'px'}"></div>
-      <div class="div_data"></div>
+      <div class="div_data">
+
+      </div>
     </div>
 
   </div>
@@ -38,46 +33,30 @@
 <script>
 import 'ol/ol.css'
 import { Map, View } from 'ol'
-import { ZoomSlider, Zoom } from 'ol/control.js';
-import ImageLayer from 'ol/layer/Image.js';
-import Static from 'ol/source/ImageStatic.js';
+
 import TileLayer from 'ol/layer/Tile.js';
 import XYZ from 'ol/source/XYZ.js';
 import VectorLayer from 'ol/layer/Vector.js';
 import VectorSource from 'ol/source/Vector.js';
 import Projection from 'ol/proj/Projection.js';
 import GeoJSON from 'ol/format/GeoJSON.js';
-import { defaults as defaultControls, ZoomToExtent } from 'ol/control.js';
-import { defaults as defaultInteractions, Modify, Select, DoubleClickZoom } from 'ol/interaction.js';
-import { getCenter } from 'ol/extent.js';
-import { Circle as CircleStyle, Fill, Stroke, Style, Text } from 'ol/style.js';
-import Draw from 'ol/interaction/Draw.js';
+import { defaults as Select, DoubleClickZoom } from 'ol/interaction.js';
+import { Circle as Fill, Stroke, Style, Text } from 'ol/style.js';
+
 import { mapGetters } from "vuex";
 import { Loading } from 'element-ui'; //引入Loading服务
 import { requestPost } from "@/js/dai/request";
-import { transform } from 'ol/proj'
-import { altKeyOnly, click, pointerMove } from 'ol/events/condition';
 
+import { altKeyOnly, click } from 'ol/events/condition';
 
 let loading;//加载动画
 
-let x = 1500
-let y = 700
-let size = [x, y]
-let extent = [-x, -y, x, y]
-let projection = new Projection({
-  code: 'xkcd-image',
-  units: 'pixels',
-  extent: extent
-});
-
 let map;
 let mapView;
 let gaodeMapLayer;//背景地图图层
 let polygonLayer;//变电站标注图层
 let polygonSource;//变电站标注多边形
 
-let draw;//绘制handle
 let select;//选中标注
 let selectAltClick;
 let selectedFeatures;
@@ -489,34 +468,6 @@ const vueGis = {
 
 
 
-    //点击【重新绘制】
-    handleEditPolygon () {
-      if (this.method === 'mEditPolygon') {
-        this.method = ""
-        map.removeInteraction(draw);
-      } else {
-        this.method = 'mEditPolygon';
-        draw = new Draw({
-          source: polygonSource,
-          type: "Polygon"
-        });
-        map.addInteraction(draw);
-        draw.on('drawend', feature => {
-          this.polygonCoor = feature.feature.values_.geometry.flatCoordinates
-
-          var coorString = ""
-          for (var i = 0; i < this.polygonCoor.length; i++) {
-            coorString = coorString + this.polygonCoor[i] + ","
-          }
-          if (this.polygonCoor.length > 0) {
-            coorString = coorString.substring(0, coorString.length - 1)
-          }
-          console.log(coorString)
-
-        });
-      }
-
-    },
 
 
     //开启加载动画
@@ -564,7 +515,7 @@ const vueGis = {
     },
     mapHeight () {
 
-      return this.clientHeight - 220;
+      return this.clientHeight - 240;
 
     },
 
@@ -579,14 +530,15 @@ export default vueGis;
 <style >
 .div_search {
   text-align: center;
-  height: 50px;
-  width: 100px;
+  margin-top: 20px;
+  width: 100%;
   display: flex;
+  justify-content: center;
 }
 
 .div_content {
-  margin-top: 30px;
-  padding: 20px 30px;
+  margin-top: 10px;
+  padding: 10px 10px;
   display: flex;
 }
 
@@ -594,7 +546,10 @@ export default vueGis;
   width: 100%;
 }
 .div_data {
-  width: 300px;
+  flex: 0 0 400px;
+  margin-left: 20px;
+  background-color: rgb(233, 235, 235);
+  border-radius: 5px;
 }
 .ol-overlaycontainer-stopevent {
   display: none;
diff --git a/epmet-oper-web/src/views/modules/workSys/mapConfig.vue b/epmet-oper-web/src/views/modules/workSys/mapConfig.vue
index cd16d9d..ce983d2 100644
--- a/epmet-oper-web/src/views/modules/workSys/mapConfig.vue
+++ b/epmet-oper-web/src/views/modules/workSys/mapConfig.vue
@@ -503,27 +503,8 @@ const vueGis = {
         map.removeInteraction(draw);
       } else if (this.selAgency) {
         this.method = 'mAddPolygon';
-        draw = new Draw({
-          source: polygonSource,
-          type: "Polygon"
-        });
-        map.addInteraction(draw);
-        draw.on('drawend', feature => {
-          this.polygonCoor = feature.feature.values_.geometry.flatCoordinates
-
-          var coorString = ""
-          for (var i = 0; i < this.polygonCoor.length; i++) {
-            coorString = coorString + this.polygonCoor[i] + ","
-          }
-          if (this.polygonCoor.length > 0) {
-            coorString = coorString.substring(0, coorString.length - 1)
-          }
-          console.log(coorString)
-          this.method = ""
-          map.removeInteraction(draw);
-          this.addPolygon(coorString)
-
-        });
+        //绘制
+        this.drawPolygon()
       } else {
         this.$message({
           type: "warning",