From d0f926159bd2c47d619a1a1bd343f2ffd8e2c8a7 Mon Sep 17 00:00:00 2001
From: jiangyy <jiang478938504@126.com>
Date: Fri, 18 Nov 2022 17:29:53 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../scss/modules/management/edit-main.scss    |  90 +++
 .../base/community/communityForm copy.vue     | 575 ++++++++++++++++++
 .../modules/base/community/communityForm.vue  | 120 ++--
 3 files changed, 723 insertions(+), 62 deletions(-)
 create mode 100644 src/assets/scss/modules/management/edit-main.scss
 create mode 100644 src/views/modules/base/community/communityForm copy.vue

diff --git a/src/assets/scss/modules/management/edit-main.scss b/src/assets/scss/modules/management/edit-main.scss
new file mode 100644
index 000000000..679eae0aa
--- /dev/null
+++ b/src/assets/scss/modules/management/edit-main.scss
@@ -0,0 +1,90 @@
+
+@import "@/assets/scss/c/config.scss";
+@import "@/assets/scss/c/function.scss";
+
+
+.m-edit{
+
+  .m-form{
+    padding-left:20px;
+    padding-right:25px;
+  }
+  
+
+  /deep/ .el-form .el-form-item{
+    border: 1px solid #D3DCE6;
+    margin-bottom: 0;
+    margin-top:2px;
+    height:47px;
+    // line-height: 40px;
+  }
+
+
+  .item-map{
+    /deep/ .el-form-item{
+      height:350px;
+      // line-height: 40px;
+    }
+  }
+
+  .item-textarea{
+    /deep/ .el-form-item{
+      height:89px;
+      // line-height: 40px;
+    }
+
+    /deep/ .el-input__countx {
+      background:none;
+    }
+  }
+
+  /deep/ .el-form-item__label{
+    background: #D6E2F8;
+    height:100%;
+    line-height: 40px;
+  }
+  /deep/ .el-form-item__content{
+    width:660px;
+    margin:5px 6px;
+    background: #F6F6F6;
+    padding:0 16px;
+    line-height: 36px
+  }
+  /deep/ .el-input__inner{
+    width:100%;
+    background-color: #F6F6F6;
+    border:0px;
+    line-height: 26px;
+    padding:0px;
+  }
+  /deep/ .el-textarea__inner {
+    
+    width:100%;
+    background-color: #F6F6F6;
+    border:0px;
+    line-height: 26px;
+    padding:0px;
+  }
+  /deep/ .el-input__icon{
+    // line-height: 5px
+  }
+
+  /deep/ .el-input .el-input__count .el-input__count-inner {
+    background:none;
+  }
+
+}
+
+.edit_item_width_1{
+  width:100%;
+}
+//带着按钮
+.edit_item_btn_width_1{
+  width:550px;
+}
+
+.edit-btn-1{
+  float:right;
+  margin-right:10px;
+}
+
diff --git a/src/views/modules/base/community/communityForm copy.vue b/src/views/modules/base/community/communityForm copy.vue
new file mode 100644
index 000000000..9a0d1418c
--- /dev/null
+++ b/src/views/modules/base/community/communityForm copy.vue	
@@ -0,0 +1,575 @@
+<template>
+  <div>
+    <div class="dialog-h-content scroll-h">
+      <div v-show="!propertyFormShow">
+        <el-form ref="ref_form"
+                 :inline="true"
+                 :model="dataForm"
+                 :rules="dataRule"
+                 :disabled="formType === 'detail'"
+                 class="form">
+
+          <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="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="coding"
+                        label-width="150px"
+                        style="display: block">
+            <el-input class="item_width_2"
+                      maxlength="50"
+                      placeholder="请输入楼栋编码"
+                      v-model="dataForm.coding">
+
+            </el-input>
+            <el-button style="margin-left: 10px"
+                       type="primary"
+                       size="small"
+                       @click="handleCode">生成</el-button>
+          </el-form-item>
+
+          <div v-if="dataForm.qrcodeUrl"
+               style="display: flex;flex-direction: column;">
+            <img style="margin-left: 70px;width: 200px;"
+                 :src="dataForm.qrcodeUrl">
+            <a style="margin-left: 80px"
+               :href="dataForm.qrcodeUrl"
+               target="_blank">下载</a>
+          </div>
+          <el-form-item label="关联物业"
+                        prop="propertyId"
+                        label-width="150px"
+                        style="display: block">
+            <el-select class="item_width_2"
+                       v-model="dataForm.propertyId"
+                       placeholder="请选择"
+                       filterable
+                       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="实有楼栋"
+                        style="display: block"
+                        prop="realBuilding"
+                        label-width="150px">
+            <el-input-number class="item_width_4"
+                             v-model="dataForm.realBuilding"
+                             :min="0"
+                             :max="9999"
+                             label="总户数"></el-input-number>
+          </el-form-item>
+
+          <el-form-item label="地图位置"
+                        prop="longitude"
+                        label-width="150px"
+                        style="display: block">
+            <div style="width: 500px">
+              <el-select v-model="searchValue"
+                         filterable
+                         style="width: 500px"
+                         remote
+                         :reserve-keyword="true"
+                         placeholder="请输入关键词"
+                         :remote-method="remoteMethod"
+                         :loading="loading">
+                <el-option v-for="(item,index) in searchOptions"
+                           @click.native="handleClickKey(index)"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+              <div id="app_community"
+                   class="div_map"></div>
+            </div>
+          </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>
+      </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="10"
+                      placeholder="请输入小区名称"
+                      v-model="propertyForm.name">
+            </el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+    </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 daiMap from "@/utils/dai-map";
+var map
+var search
+var markers
+var infoWindowList
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      formType: 'add', //表单操作类型 add新增，edit编辑，detail详情
+      searchOptions: [],
+      searchValue: '',
+      resultList: [],
+      loading: false,
+
+
+      gridList: [],
+      propertyList: [],
+      btnDisable: false,
+
+      neighborHoodId: '', //小区ID
+      dataForm: {
+        neighborHoodName: '', // 小区名称【不超过50字】
+        agencyId: '', // 所属组织ID
+        agencyName: '',
+        gridId: '', //所属网格ID
+        propertyId: '', //关联物业
+        address: '', //详细地址
+        remark: '', //备注【最大500字】
+        location: '', //坐标位置
+        longitude: '', //经度
+        latitude: '', //纬度
+        realBuilding: 0,
+        coding: '',
+        sysCoding: ''
+      },
+
+      propertyFormShow: false,
+      propertyForm: {
+        name: ''
+      },
+
+      keyWords: '',
+      agencyObj: {}
+    }
+  },
+  components: {},
+  mounted () {
+
+  },
+
+  methods: {
+    async initForm (type, row, agencyObj) {
+      this.$refs.ref_form.resetFields();
+      this.agencyObj = agencyObj
+      let { latitude, longitude } = this.$store.state.user;
+      this.formType = type
+      if (row) {
+        this.dataForm = JSON.parse(JSON.stringify(row))
+        this.dataForm.neighborHoodId = this.dataForm.id
+        this.neighborHoodId = this.dataForm.neighborHoodId
+
+      } else {
+        this.dataForm.latitude = latitude
+        this.dataForm.longitude = longitude
+      }
+      if (!map) {
+        this.initMap(this.dataForm.latitude, this.dataForm.longitude);
+      } else {
+        map.setCenter(this.dataForm.latitude, this.dataForm.longitude);
+        map.setMarker(this.dataForm.latitude, this.dataForm.longitude);
+      }
+      await this.loadAgency()
+      await this.loadGrid()
+      await this.loadProperty()
+    },
+    // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
+    initMap (latitude, longitude) {
+
+      map = new daiMap(
+        document.getElementById("app_community"),
+        { latitude, longitude },
+        {
+          zoom: 16.2, // 设置地图缩放级别
+          pitch: 43.5, // 设置俯仰角
+          rotation: 45, // 设置地图旋转角度
+        }
+      );
+
+      // 监听地图平移结束
+      map.on("dragend", (e) => {
+        this.handleMoveCenter(e);
+      });
+
+      map.setCenter(latitude, longitude);
+      map.setMarker(latitude, longitude);
+
+    },
+
+
+    async handleMoveCenter () {
+      //修改地图中心点
+      const { lat, lng } = map.getCenter();
+      this.dataForm.latitude = lat;
+      this.dataForm.longitude = lng;
+      map.setMarker(lat, lng);
+
+      let { msg, data } = await map.getAddress(lat, lng);
+      if (msg == "success") {
+        this.dataForm.address = data.address
+        this.searchValue = data.address
+        this.searchOptions = []
+
+      }
+    },
+
+    async remoteMethod (query) {
+
+      if (query !== '') {
+        this.loading = true;
+
+        const { msg, data } = await map.searchNearby(query);
+        this.loading = false;
+        this.resultList = []
+
+        if (msg == "success" && data.resultList && data.resultList.length > 0) {
+
+          if (data.resultList && data.resultList.length > 0) {
+            this.resultList = data.resultList
+            this.searchOptions = this.resultList.map(item => {
+              return { value: `${item.hotPointID}`, label: `${item.address + item.name}` };
+
+            });
+          }
+        } else {
+          this.searchOptions = [
+            {
+              value: '0',
+              label: '未检索到结果'
+            }
+          ]
+        }
+      } else {
+        this.searchOptions = [];
+      }
+    },
+
+    handleClickKey (index) {
+      let selPosition = this.resultList[index]
+      let lonlat = selPosition.lonlat.split(" ")
+      map.setCenter(lonlat[1], lonlat[0]);
+      map.setMarker(lonlat[1], lonlat[0]);
+      this.dataForm.latitude = lonlat[1];
+      this.dataForm.longitude = lonlat[0];
+      this.dataForm.address = selPosition.address + selPosition.name
+    },
+
+
+    async handleCode () {
+      if (!this.dataForm.gridId) return this.$message.error('请选择网格')
+      const { data, code, msg } = await requestPost(
+        "/gov/org/houseInformation/getNeighborHoodCoding/" + this.dataForm.gridId);
+      if (msg == "success" && code == 0) {
+        this.dataForm.coding = data.coding
+        this.dataForm.sysCoding = data.sysCoding
+
+      }
+    },
+    //加载组织
+    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/allgridsnopermission '
+      // 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.btnDisable = true
+        setTimeout(() => {
+          this.btnDisable = false
+        }, 10000)
+        this.$refs['ref_form'].validate((valid, messageObj) => {
+          if (!valid) {
+            app.util.validateRule(messageObj)
+            this.btnDisable = false
+          } 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.resetData()
+        this.$emit('dialogOk')
+        this.btnDisable = false
+      } else {
+        this.btnDisable = false
+        this.$message.error(msg)
+      }
+
+    },
+    async addProperty () {
+      if (!this.propertyForm.name || this.propertyForm.name === '') {
+        this.$message({
+          type: 'error',
+          message: '物业名称不能为空'
+        })
+        return false
+      }
+      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.dataForm.propertyId = data.propertyId
+        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.resetData()
+        this.$emit('dialogCancle')
+      }
+    },
+    resetData () {
+      this.searchValue = ''
+      this.searchOptions = []
+      this.resultList = []
+      this.neighborHoodId = '' //小区ID
+      this.dataForm = {
+        neighborHoodName: '', // 小区名称【不超过50字】
+        agencyId: '', // 所属组织ID
+        agencyName: '',
+        gridId: '', //所属网格ID
+        propertyId: '', //关联物业
+        address: '', //详细地址
+        remark: '', //备注【最大500字】
+        location: '', //坐标位置
+        longitude: '', //经度
+        latitude: '', //纬度
+        realBuilding: 0,
+        coding: '',
+        sysCoding: ''
+      }
+      this.propertyFormShow = false
+    },
+    // 开启加载动画
+    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' }
+        ],
+        coding: [
+          { 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 lang="scss" scoped >
+@import "@/assets/scss/modules/visual/communityManageForm.scss";
+</style>
+
+
+
diff --git a/src/views/modules/base/community/communityForm.vue b/src/views/modules/base/community/communityForm.vue
index 9a0d1418c..042a85705 100644
--- a/src/views/modules/base/community/communityForm.vue
+++ b/src/views/modules/base/community/communityForm.vue
@@ -1,24 +1,22 @@
 <template>
   <div>
-    <div class="dialog-h-content scroll-h">
+    <div class="dialog-h-content scroll-h m-edit">
       <div v-show="!propertyFormShow">
         <el-form ref="ref_form"
                  :inline="true"
                  :model="dataForm"
                  :rules="dataRule"
-                 :disabled="formType === 'detail'"
-                 class="form">
+                 label-width="90px"
+                 class="m-form">
 
           <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"
+            <el-select class="edit_item_width_1"
                        v-model="dataForm.gridId"
                        placeholder="请选择"
                        clearable>
@@ -32,9 +30,8 @@
 
           <el-form-item label="小区名称"
                         prop="neighborHoodName"
-                        label-width="150px"
                         style="display: block">
-            <el-input class="item_width_1"
+            <el-input class="edit_item_width_1"
                       maxlength="50"
                       show-word-limit
                       placeholder="请输入小区名称"
@@ -43,17 +40,16 @@
           </el-form-item>
           <el-form-item label="小区编码"
                         prop="coding"
-                        label-width="150px"
                         style="display: block">
-            <el-input class="item_width_2"
+            <el-input class="edit_item_btn_width_1"
                       maxlength="50"
                       placeholder="请输入楼栋编码"
                       v-model="dataForm.coding">
 
             </el-input>
-            <el-button style="margin-left: 10px"
-                       type="primary"
+            <el-button type="text"
                        size="small"
+                       class="div-table-button--blue edit-btn-1"
                        @click="handleCode">生成</el-button>
           </el-form-item>
 
@@ -67,9 +63,8 @@
           </div>
           <el-form-item label="关联物业"
                         prop="propertyId"
-                        label-width="150px"
                         style="display: block">
-            <el-select class="item_width_2"
+            <el-select class="edit_item_btn_width_1"
                        v-model="dataForm.propertyId"
                        placeholder="请选择"
                        filterable
@@ -81,15 +76,14 @@
               </el-option>
             </el-select>
 
-            <el-button style="margin-left: 10px"
-                       type="primary"
+            <el-button type="text"
                        size="small"
+                       class="div-table-button--blue  edit-btn-1"
                        @click="handleAddProperty">添加物业</el-button>
           </el-form-item>
           <el-form-item label="实有楼栋"
                         style="display: block"
-                        prop="realBuilding"
-                        label-width="150px">
+                        prop="realBuilding">
             <el-input-number class="item_width_4"
                              v-model="dataForm.realBuilding"
                              :min="0"
@@ -97,55 +91,57 @@
                              label="总户数"></el-input-number>
           </el-form-item>
 
-          <el-form-item label="地图位置"
-                        prop="longitude"
-                        label-width="150px"
-                        style="display: block">
-            <div style="width: 500px">
-              <el-select v-model="searchValue"
-                         filterable
-                         style="width: 500px"
-                         remote
-                         :reserve-keyword="true"
-                         placeholder="请输入关键词"
-                         :remote-method="remoteMethod"
-                         :loading="loading">
-                <el-option v-for="(item,index) in searchOptions"
-                           @click.native="handleClickKey(index)"
-                           :key="item.value"
-                           :label="item.label"
-                           :value="item.value">
-                </el-option>
-              </el-select>
-              <div id="app_community"
-                   class="div_map"></div>
-            </div>
-          </el-form-item>
+          <div class="item-map">
+            <el-form-item label="地图位置"
+                          prop="longitude"
+                          style="display: block">
+              <div style="width: 500px">
+                <el-select v-model="searchValue"
+                           filterable
+                           style="width: 500px"
+                           remote
+                           :reserve-keyword="true"
+                           placeholder="请输入关键词"
+                           :remote-method="remoteMethod"
+                           :loading="loading">
+                  <el-option v-for="(item,index) in searchOptions"
+                             @click.native="handleClickKey(index)"
+                             :key="item.value"
+                             :label="item.label"
+                             :value="item.value">
+                  </el-option>
+                </el-select>
+                <div id="app_community"
+                     class="div_map"></div>
+              </div>
+            </el-form-item>
+
+          </div>
 
           <el-form-item label="详细地址"
                         prop="address"
-                        label-width="150px"
                         style="display: block">
-            <el-input class="item_width_1"
+            <el-input class="edit_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>
+          <div class="item-textarea">
+            <el-form-item label="备注"
+                          prop="remark"
+                          style="display: block">
+              <el-input class="edit_item_width_1"
+                        type="textarea"
+                        maxlength="500"
+                        show-word-limit
+                        resize="none"
+                        :rows="3"
+                        placeholder="请输入备注，不超过500字"
+                        v-model="dataForm.remark"></el-input>
+            </el-form-item>
+          </div>
         </el-form>
       </div>
 
@@ -153,12 +149,11 @@
         <el-form :inline="false"
                  :model="propertyForm"
                  :rules="propertyRule"
-                 class="form">
+                 class="m-form">
           <el-form-item label="物业名称"
                         prop="name"
-                        label-width="150px"
                         style="display: block">
-            <el-input class="item_width_1"
+            <el-input class="edit_item_width_1"
                       maxlength="10"
                       placeholder="请输入小区名称"
                       v-model="propertyForm.name">
@@ -169,10 +164,10 @@
     </div>
     <div class="div_btn">
       <el-button size="small"
+                 class="diy-button--other"
                  @click="handleCancle">取 消</el-button>
       <el-button size="small"
-                 v-if="formType != 'detail'"
-                 type="primary"
+                 class="diy-button--blue"
                  :disabled="btnDisable"
                  @click="handleComfirm">确 定</el-button>
     </div>
@@ -569,6 +564,7 @@ export default {
 </script>
 <style lang="scss" scoped >
 @import "@/assets/scss/modules/visual/communityManageForm.scss";
+@import "@/assets/scss/modules/management/edit-main.scss";
 </style>