Tree调整

operationSupport/src/components/common/buildingTree.vue

@@ -1,151 +1,158 @@
 <template>
-    <div class="organ-tree">
-        <div>
-            <el-input v-model="filterText" placeholder="请输入关键字" suffix-icon="el-icon-search"></el-input>
-        </div>
-        <div class="tree-style-box no-scrollbar" v-if="organList">
-            <el-tree
-                class="tree-style"
-                :data="organList"
-                ref="tree"
-                node-key="id"
-                :highlight-current="true"
-                :props="defaultProps"
-                :expand-on-click-node="false"
-                @node-click="treeClick"
-                @check="clickCheckTree"
-                :default-expand-all="defaultExpandAllTree"
-                :filter-node-method="filterNode"
-                :show-checkbox="showCheckboxTree"
-                :accordion="accordion"
-            >
-            </el-tree>
-        </div>
+  <div class="organ-tree">
+    <div>
+      <el-input
+        v-model="filterText"
+        placeholder="请输入关键字"
+        suffix-icon="el-icon-search"
+      ></el-input>
     </div>
+    <div
+      class="tree-style-box no-scrollbar"
+      v-if="organList"
+    >
+      <el-tree
+        class="tree-style"
+        :data="organList"
+        ref="tree"
+        node-key="id"
+        :highlight-current="true"
+        :props="defaultProps"
+        :expand-on-click-node="false"
+        @node-click="treeClick"
+        @check="clickCheckTree"
+        :default-expand-all="defaultExpandAllTree"
+        :filter-node-method="filterNode"
+        :show-checkbox="showCheckboxTree"
+        :accordion="accordion"
+      >
+      </el-tree>
+    </div>
+  </div>
 </template>
 
 <script>
 export default {
-    name: 'buildingTree',
-    props: {
-        buildingType: { type: String, default: 'buildingType' },
-        showCheckboxTree: {
-            //显示多选框
-            type: Boolean,
-            default: false
-        },
-        defaultExpandAllTree: {
-            //是否默认展开所有节点
-            type: Boolean,
-            default: true
-        },
-        accordion: {
-            //房间展开手风琴
-            type: Boolean,
-            default: false
-        },
-        accordionPeople: {
-            //人员展开手风琴
-            type: Boolean,
-            default: false
-        }
+  name: 'buildingTree',
+  props: {
+    buildingType: { type: String, default: 'buildingType' },
+    showCheckboxTree: {
+      //显示多选框
+      type: Boolean,
+      default: false
     },
-    data() {
-        return {
-            filterText: '',
-            organList: [],
-            defaultProps: {
-                children: 'children',
-                label: 'name'
-            }
-        };
+    defaultExpandAllTree: {
+      //是否默认展开所有节点
+      type: Boolean,
+      default: false
+    },
+    accordion: {
+      //房间展开手风琴
+      type: Boolean,
+      default: false
     },
-    watch: {
-        filterText(val) {
-            this.$refs.tree.filter(val);
+    accordionPeople: {
+      //人员展开手风琴
+      type: Boolean,
+      default: false
+    }
+  },
+  data () {
+    return {
+      filterText: '',
+      organList: [],
+      defaultProps: {
+        children: 'children',
+        label: 'name'
+      }
+    };
+  },
+  watch: {
+    filterText (val) {
+      this.$refs.tree.filter(val);
+    }
+  },
+  computed: {},
+  methods: {
+    dimension (arr) {
+      arr.map((item, index) => {
+        if (!!item.children) {
+          this.dimension(item.children);
+          if (item.type == 'unit') {
+            item.name = this.CheckChinese(item.name, '单元');
+          } else if (item.type == 'building') {
+            item.name = this.CheckChinese(item.name, '楼栋');
+          }
         }
+      });
     },
-    computed: {},
-    methods: {
-        dimension(arr) {
-            arr.map((item, index) => {
-                if (!!item.children) {
-                    this.dimension(item.children);
-                    if (item.type == 'unit') {
-                        item.name = this.CheckChinese(item.name, '单元');
-                    } else if (item.type == 'building') {
-                        item.name = this.CheckChinese(item.name, '楼栋');
-                    }
-                }
+    getOrgTreeList () {
+      this.$http
+        .get('/sc-community/assets/tree/community/find', { buildingType: this.buildingType })
+        .then(({ status, data, msg }) => {
+          if (status === 0 && data) {
+            this.organList = data;
+            this.dimension(data);
+            this.$nextTick().then(() => {
+              const firstNode = document.querySelector('.el-tree-node');
+              firstNode.click();
             });
-        },
-        getOrgTreeList() {
-            this.$http
-                .get('/sc-community/assets/tree/community/find', { buildingType: this.buildingType })
-                .then(({ status, data, msg }) => {
-                    if (status === 0 && data) {
-                        this.organList = data;
-                        this.dimension(data);
-                        this.$nextTick().then(() => {
-                            const firstNode = document.querySelector('.el-tree-node');
-                            firstNode.click();
-                        });
-                    }
-                });
-        },
-        filterNode(value, data) {
-            if (!value) return true;
-            return data.name.indexOf(value) !== -1;
-        },
-        filterNodePeople(value, data) {
-            if (!value) return true;
-            return data.label.indexOf(value) !== -1;
-        },
-        treeClick(e) {
-            if (e.value == 0) return;
-            let onData = '';
-            let newValueIds = e.id.split('-');
-            let thisE = this.$refs.tree.getNode(e);
-            if (e.type == 'building') {
-                onData = {
-                    communityId: thisE.parent.data.value,
-                    buildingId: e.value,
-                    unitId: '',
-                    roomId: ''
-                };
-                this.$emit('buildingInformation', onData);
-            } else if (e.type == 'unit') {
-                onData = {
-                    communityId: thisE.parent.parent.data.value,
-                    buildingId: thisE.parent.data.value,
-                    unitId: e.value,
-                    roomId: ''
-                };
-                this.$emit('buildingInformation', onData);
-            } else if (e.type == 'room') {
-                onData = {
-                    communityId: newValueIds.length == 4 ? thisE.parent.parent.parent.data.value : thisE.parent.parent.data.value,
-                    buildingId: newValueIds.length == 4 ? thisE.parent.parent.data.value : thisE.parent.data.value,
-                    unitId: newValueIds.length == 4 ? thisE.parent.data.value : '',
-                    roomId: e.value
-                };
-                this.$emit('buildingInformation', onData);
-            } else {
-                this.$emit('buildingInformation', e);
-            }
-        },
-        CheckChinese(val, name) {
-            var reg = new RegExp('[\\u4E00-\\u9FFF]+', 'g');
-            let newVal = val;
-            if (!reg.test(val)) {
-                newVal = val + name;
-            }
-            return newVal;
-        }
+          }
+        });
+    },
+    filterNode (value, data) {
+      if (!value) return true;
+      return data.name.indexOf(value) !== -1;
+    },
+    filterNodePeople (value, data) {
+      if (!value) return true;
+      return data.label.indexOf(value) !== -1;
+    },
+    treeClick (e) {
+      if (e.value == 0) return;
+      let onData = '';
+      let newValueIds = e.id.split('-');
+      let thisE = this.$refs.tree.getNode(e);
+      if (e.type == 'building') {
+        onData = {
+          communityId: thisE.parent.data.value,
+          buildingId: e.value,
+          unitId: '',
+          roomId: ''
+        };
+        this.$emit('buildingInformation', onData);
+      } else if (e.type == 'unit') {
+        onData = {
+          communityId: thisE.parent.parent.data.value,
+          buildingId: thisE.parent.data.value,
+          unitId: e.value,
+          roomId: ''
+        };
+        this.$emit('buildingInformation', onData);
+      } else if (e.type == 'room') {
+        onData = {
+          communityId: newValueIds.length == 4 ? thisE.parent.parent.parent.data.value : thisE.parent.parent.data.value,
+          buildingId: newValueIds.length == 4 ? thisE.parent.parent.data.value : thisE.parent.data.value,
+          unitId: newValueIds.length == 4 ? thisE.parent.data.value : '',
+          roomId: e.value
+        };
+        this.$emit('buildingInformation', onData);
+      } else {
+        this.$emit('buildingInformation', e);
+      }
     },
-    created() {
-        this.getOrgTreeList();
+    CheckChinese (val, name) {
+      var reg = new RegExp('[\\u4E00-\\u9FFF]+', 'g');
+      let newVal = val;
+      if (!reg.test(val)) {
+        newVal = val + name;
+      }
+      return newVal;
     }
+  },
+  created () {
+    this.getOrgTreeList();
+  }
 };
 </script>
 

operationSupport/src/components/common/organTree.vue

@@ -1,129 +1,133 @@
 <template>
-    <div class="organ-tree">
-        <el-input v-model="filterText" placeholder="请输入关键字" suffix-icon="el-icon-search"></el-input>
-        <div class="tree-style-box no-scrollbar">
-            <el-tree
-                class="tree-style"
-                :data="organList"
-                ref="tree"
-                node-key="id"
-                :highlight-current="true"
-                :props="defaultProps"
-                :expand-on-click-node="false"
-                @node-click="treeClick"
-                default-expand-all
-                :filter-node-method="filterNode"
-            >
-            </el-tree>
-        </div>
+  <div class="organ-tree">
+    <el-input
+      v-model="filterText"
+      placeholder="请输入关键字"
+      suffix-icon="el-icon-search"
+    ></el-input>
+    <div class="tree-style-box no-scrollbar">
+      <el-tree
+        class="tree-style"
+        :data="organList"
+        ref="tree"
+        node-key="id"
+        :highlight-current="true"
+        :props="defaultProps"
+        :expand-on-click-node="false"
+        @node-click="treeClick"
+        :default-expand-all="false"
+        :filter-node-method="filterNode"
+      >
+      </el-tree>
     </div>
+  </div>
 </template>
 
 <script>
 export default {
-    name: 'organTree',
-    props: ['buildingType'],
-    data() {
-        return {
-            filterText: '',
-            organList: [],
-            defaultProps: {
-                children: 'children',
-                label: 'name'
-            }
-        };
+  name: 'organTree',
+  props: ['buildingType'],
+  data () {
+    return {
+      filterText: '',
+      organList: [],
+      defaultProps: {
+        children: 'children',
+        label: 'name'
+      }
+    };
+  },
+  watch: {
+    filterText (val) {
+      this.$refs.tree.filter(val);
+    }
+  },
+  methods: {
+    getOrgTreeList () {
+      this.$http
+        .get('/sc-community/assets/tree/community/find', { buildingType: this.buildingType })
+        .then(({ status, data, msg }) => {
+          if (status === 0 && data) {
+            this.dimension(data);
+            this.organList = data;
+            this.$nextTick().then(() => {
+              const firstNode = document.querySelector('.el-tree-node');
+              firstNode.click();
+            });
+          }
+        });
     },
-    watch: {
-        filterText(val) {
-            this.$refs.tree.filter(val);
+    dimension (arr) {
+      arr.map((item, index) => {
+        if (!!item.children) {
+          this.dimension(item.children);
+          if (item.type == 'unit') {
+            item.name = this.CheckChinese(item.name, '单元');
+          } else if (item.type == 'building') {
+            item.name = this.CheckChinese(item.name, '楼栋');
+          }
         }
+      });
     },
-    methods: {
-        getOrgTreeList() {
-            this.$http
-                .get('/sc-community/assets/tree/community/find', { buildingType: this.buildingType })
-                .then(({ status, data, msg }) => {
-                    if (status === 0 && data) {
-                        this.dimension(data);
-                        this.organList = data;
-                        this.$nextTick().then(() => {
-                            const firstNode = document.querySelector('.el-tree-node');
-                            firstNode.click();
-                        });
-                    }
-                });
-        },
-        dimension(arr) {
-            arr.map((item, index) => {
-                if (!!item.children) {
-                    this.dimension(item.children);
-                    if (item.type == 'unit') {
-                        item.name = this.CheckChinese(item.name, '单元');
-                    } else if (item.type == 'building') {
-                        item.name = this.CheckChinese(item.name, '楼栋');
-                    }
-                }
-            });
-        },
-        filterNode(value, data) {
-            if (!value) return true;
-            return data.name.indexOf(value) !== -1;
-        },
-        treeClick(e) {
-            let unitPa = {
-                id: e.id,
-                communityName: '',
-                communityId: '',
-                buildingName: '',
-                buildingId: '',
-                unitName: '',
-                unitId: '',
-                houseName: '',
-                houseId: '',
-                type: e.type
-            };
-            let newValueIds = e.id.split('-');
-            let thisObj = this.$refs.tree.getNode(e);
-            if (e.type == 'building') {
-                unitPa.communityName = thisObj.parent.data.name;
-                unitPa.communityId = thisObj.parent.data.value;
-                unitPa.buildingName = e.name;
-                unitPa.buildingId = e.value;
-            } else if (e.type == 'unit') {
-                unitPa.communityName = thisObj.parent.parent.data.name;
-                unitPa.communityId = thisObj.parent.parent.data.value;
-                unitPa.buildingName = thisObj.parent.data.name;
-                unitPa.buildingId = thisObj.parent.data.value;
-                unitPa.unitName = e.name;
-                unitPa.unitId = e.value;
-            } else if (e.type == 'room') {
-                unitPa.communityName = newValueIds.length == 4 ? thisObj.parent.parent.parent.data.name : thisObj.parent.parent.data.name;
-                unitPa.communityId = newValueIds.length == 4 ? thisObj.parent.parent.parent.data.value : thisObj.parent.parent.data.value;
-                unitPa.buildingName = newValueIds.length == 4 ? thisObj.parent.parent.data.name : thisObj.parent.data.name;
-                unitPa.buildingId = newValueIds.length == 4 ? thisObj.parent.parent.data.value : thisObj.parent.data.value;
-                unitPa.unitName = newValueIds.length == 4 ? thisObj.parent.data.name : '';
-                unitPa.unitId = newValueIds.length == 4 ? thisObj.parent.data.value : '';
-                unitPa.houseName = e.name;
-                unitPa.houseId = e.value;
-            } else {
-                unitPa.communityName = e.name;
-                unitPa.communityId = e.value;
-            }
+    filterNode (value, data) {
+      if (!value) return true;
+      return data.name.indexOf(value) !== -1;
+    },
+    treeClick (e) {
+      let unitPa = {
+        id: e.id,
+        communityName: '',
+        communityId: '',
+        buildingName: '',
+        buildingId: '',
+        unitName: '',
+        unitId: '',
+        houseName: '',
+        houseId: '',
+        type: e.type
+      };
+      let newValueIds = e.id.split('-');
+      let thisObj = this.$refs.tree.getNode(e);
+      if (e.type == 'building') {
+        unitPa.communityName = thisObj.parent.data.name;
+        unitPa.communityId = thisObj.parent.data.value;
+        unitPa.buildingName = e.name;
+        unitPa.buildingId = e.value;
+      } else if (e.type == 'unit') {
+        unitPa.communityName = thisObj.parent.parent.data.name;
+        unitPa.communityId = thisObj.parent.parent.data.value;
+        unitPa.buildingName = thisObj.parent.data.name;
+        unitPa.buildingId = thisObj.parent.data.value;
+        unitPa.unitName = e.name;
+        unitPa.unitId = e.value;
+      } else if (e.type == 'room') {
+        unitPa.communityName = newValueIds.length == 4 ? thisObj.parent.parent.parent.data.name : thisObj.parent.parent.data.name;
+        unitPa.communityId = newValueIds.length == 4 ? thisObj.parent.parent.parent.data.value : thisObj.parent.parent.data.value;
+        unitPa.buildingName = newValueIds.length == 4 ? thisObj.parent.parent.data.name : thisObj.parent.data.name;
+        unitPa.buildingId = newValueIds.length == 4 ? thisObj.parent.parent.data.value : thisObj.parent.data.value;
+        unitPa.unitName = newValueIds.length == 4 ? thisObj.parent.data.name : '';
+        unitPa.unitId = newValueIds.length == 4 ? thisObj.parent.data.value : '';
+        unitPa.houseName = e.name;
+        unitPa.houseId = e.value;
+      } else {
+        unitPa.communityName = e.name;
+        unitPa.communityId = e.value;
+      }
 
-            this.$emit('organId', unitPa);
-        },
-        CheckChinese(val, name) {
-            var reg = new RegExp('[\\u4E00-\\u9FFF]+', 'g');
-            let newVal = val;
-            if (!reg.test(val)) {
-                newVal = val + name;
-            }
-            return newVal;
-        }
+      this.$emit('organId', unitPa);
     },
-    created() {
-        this.getOrgTreeList();
+    CheckChinese (val, name) {
+      var reg = new RegExp('[\\u4E00-\\u9FFF]+', 'g');
+      let newVal = val;
+      if (!reg.test(val)) {
+        newVal = val + name;
+      }
+      return newVal;
     }
+  },
+  created () {
+    this.getOrgTreeList();
+  }
 };
 </script>
 

operationSupport/src/views/assetManagement/housingManagement/index.vue

@@ -1,78 +1,164 @@
 <template>
-    <div class="content">
-        <building-tree @buildingInformation="buildingInformation" :buildingType="1" v-if="!showaddDialog"></building-tree>
-        <div class="content-right" v-if="!showaddDialog">
-            <div class="search">
-                <el-input clearable placeholder="房屋号" class="search-input" v-trim v-model="mixins_query.roomNumber"></el-input>
-                <el-select v-model="mixins_query.useStatus" clearable placeholder="使用状态">
-                    <el-option v-for="item in statusOptions" :label="item.label" :value="item.val" :key="item">{{ item.label }}</el-option>
-                </el-select>
-                <el-button
-                    class="search-btn"
-                    type="primary"
-                    @click="mixins_search"
-                    :disabled="mixins_onQuery"
-                    :loading="mixins_onQuery"
-                    icon="el-icon-search"
-                    >搜索
-                </el-button>
+  <div class="content">
+    <building-tree
+      @buildingInformation="buildingInformation"
+      :buildingType="1"
+      v-if="!showaddDialog"
+    ></building-tree>
+    <div
+      class="content-right"
+      v-if="!showaddDialog"
+    >
+      <div class="search">
+        <el-input
+          clearable
+          placeholder="房屋号"
+          class="search-input"
+          v-trim
+          v-model="mixins_query.roomNumber"
+        ></el-input>
+        <el-select
+          v-model="mixins_query.useStatus"
+          clearable
+          placeholder="使用状态"
+        >
+          <el-option
+            v-for="item in statusOptions"
+            :label="item.label"
+            :value="item.val"
+            :key="item"
+          >{{ item.label }}</el-option>
+        </el-select>
+        <el-button
+          class="search-btn"
+          type="primary"
+          @click="mixins_search"
+          :disabled="mixins_onQuery"
+          :loading="mixins_onQuery"
+          icon="el-icon-search"
+        >搜索
+        </el-button>
 
-                <div class="search-icon">
-                    <template>
-                        <el-dropdown type="primary" @command="addCommand">
-                            <span class="zoniot_font zoniot-icon-tianjia2"></span>
-                            <el-dropdown-menu slot="dropdown" hide-on-click="false" class="device-search-dropdown">
-                                <el-dropdown-item command="add">单个添加</el-dropdown-item>
-                                <el-dropdown-item command="batchAdd">
-                                    <div class="upload_div">
-                                        <xk-upload class="upload_class" @callback="mixins_search" :params="{ importType: 'HOUSE' }">
-                                            <span class="upload_text" slot="content">批量添加</span>
-                                        </xk-upload>
-                                    </div>
-                                </el-dropdown-item>
-                                <el-dropdown-item command="template">下载模板</el-dropdown-item>
-                            </el-dropdown-menu>
-                        </el-dropdown>
-                    </template>
-                    <el-tooltip class="item" effect="light" placement="bottom" content="删除">
-                        <i class="zoniot_font zoniot-icon-shanchu2" @click="deluserbyidsFn"></i>
-                    </el-tooltip>
-                    <el-tooltip class="item" effect="light" placement="bottom" content="导出">
-                        <i class="zoniot_font zoniot-icon-daochu2" @click="exportExcel()"></i>
-                    </el-tooltip>
-                </div>
-            </div>
-            <zz-table
-                :settings="{ showCheckbox: true, showIndex: true, stripe: true }"
-                :cols="cols"
-                :loading="mixins_onQuery"
-                :data="mixins_list"
-                :pageset="mixins_pageset"
-                @page-change="pageChange"
-                @selection-change="selectionChange"
+        <div class="search-icon">
+          <template>
+            <el-dropdown
+              type="primary"
+              @command="addCommand"
             >
-                <template slot-scope="scope" slot="useStatus">
-                    <span v-if="scope.row.useStatus == 0">空置</span>
-                    <span v-if="scope.row.useStatus == 1">居住</span>
-                </template>
-
-                <template slot-scope="scope" slot="opt" class="opt">
-                    <div class="opt">
-                        <el-tooltip effect="light" placement="bottom" content="编辑">
-                            <i class="zoniot_font zoniot-icon-bianji" @click="addOrEdit('edit', scope.row)"></i>
-                        </el-tooltip>
-                        <el-tooltip effect="light" placement="bottom" content="删除">
-                            <i class="zoniot_font zoniot-icon-shanchu redText" @click="deleteRow(scope.row)"></i>
-                        </el-tooltip>
-                        <el-tooltip class="item" effect="light" placement="bottom" content="查看">
-                            <i class="zoniot_font zoniot-icon-xiangqing" @click="lookPage(scope.row)"></i>
-                        </el-tooltip>
-                    </div>
-                </template>
-            </zz-table>
+              <span class="zoniot_font zoniot-icon-tianjia2"></span>
+              <el-dropdown-menu
+                slot="dropdown"
+                hide-on-click="false"
+                class="device-search-dropdown"
+              >
+                <el-dropdown-item command="add">单个添加</el-dropdown-item>
+                <el-dropdown-item command="batchAdd">
+                  <div class="upload_div">
+                    <xk-upload
+                      class="upload_class"
+                      @callback="mixins_search"
+                      :params="{ importType: 'HOUSE' }"
+                    >
+                      <span
+                        class="upload_text"
+                        slot="content"
+                      >批量添加</span>
+                    </xk-upload>
+                  </div>
+                </el-dropdown-item>
+                <el-dropdown-item command="template">下载模板</el-dropdown-item>
+              </el-dropdown-menu>
+            </el-dropdown>
+          </template>
+          <el-tooltip
+            class="item"
+            effect="light"
+            placement="bottom"
+            content="删除"
+          >
+            <i
+              class="zoniot_font zoniot-icon-shanchu2"
+              @click="deluserbyidsFn"
+            ></i>
+          </el-tooltip>
+          <el-tooltip
+            class="item"
+            effect="light"
+            placement="bottom"
+            content="导出"
+          >
+            <i
+              class="zoniot_font zoniot-icon-daochu2"
+              @click="exportExcel()"
+            ></i>
+          </el-tooltip>
         </div>
-        <save-edits v-else :params="activeData" @clerOwnerStatus="clerOwnerStatus" :isAdd="isAdd"></save-edits>
+      </div>
+      <zz-table
+        :settings="{ showCheckbox: true, showIndex: true, stripe: true }"
+        :cols="cols"
+        :loading="mixins_onQuery"
+        :data="mixins_list"
+        :pageset="mixins_pageset"
+        @page-change="pageChange"
+        @selection-change="selectionChange"
+      >
+        <template
+          slot-scope="scope"
+          slot="useStatus"
+        >
+          <span v-if="scope.row.useStatus == 0">空置</span>
+          <span v-if="scope.row.useStatus == 1">居住</span>
+        </template>
+
+        <template
+          slot-scope="scope"
+          slot="opt"
+          class="opt"
+        >
+          <div class="opt">
+            <el-tooltip
+              effect="light"
+              placement="bottom"
+              content="编辑"
+            >
+              <i
+                class="zoniot_font zoniot-icon-bianji"
+                @click="addOrEdit('edit', scope.row)"
+              ></i>
+            </el-tooltip>
+            <el-tooltip
+              effect="light"
+              placement="bottom"
+              content="删除"
+            >
+              <i
+                class="zoniot_font zoniot-icon-shanchu redText"
+                @click="deleteRow(scope.row)"
+              ></i>
+            </el-tooltip>
+            <el-tooltip
+              class="item"
+              effect="light"
+              placement="bottom"
+              content="查看"
+            >
+              <i
+                class="zoniot_font zoniot-icon-xiangqing"
+                @click="lookPage(scope.row)"
+              ></i>
+            </el-tooltip>
+          </div>
+        </template>
+      </zz-table>
     </div>
+    <save-edits
+      v-else
+      :params="activeData"
+      @clerOwnerStatus="clerOwnerStatus"
+      :isAdd="isAdd"
+    ></save-edits>
+  </div>
 </template>
 
 <script>
@@ -80,187 +166,187 @@ import list from '@utils/list.js';
 import saveEdits from './saveEdits.vue';
 
 export default {
-    mixins: [list],
-    name: 'housingManagement',
-    data() {
-        return {
-            statusOptions: [
-                { label: '空置', val: 0 },
-                { label: '居住', val: 1 }
-            ],
-            cols: [
-                {
-                    label: '所属社区',
-                    prop: 'communityName',
-                    width: 120
-                },
-                {
-                    label: '楼栋名称',
-                    prop: 'buildingName'
-                },
-                {
-                    label: '单元',
-                    prop: 'unitName'
-                },
-                {
-                    label: '房屋号',
-                    prop: 'roomNumber'
-                },
-                {
-                    label: '建筑面积',
-                    prop: 'buildingArea',
-                    format(val) {
-                        if (!!val) {
-                            return val + '㎡';
-                        } else {
-                            return '--';
-                        }
-                    }
-                },
-                {
-                    label: '使用面积',
-                    prop: 'useArea',
-                    format(val) {
-                        if (!!val) {
-                            return val + '㎡';
-                        } else {
-                            return '--';
-                        }
-                    }
-                },
-                {
-                    label: '房屋类型',
-                    prop: 'buildingTypeDict',
-                },
-                {
-                    label: '使用状态',
-                    slot: 'useStatus'
-                },
-                {
-                    label: '操作',
-                    slot: 'opt',
-                    width: 150
-                }
-            ],
-            showaddDialog: '',
-            selectRow: [],
-            mixins_post: 'post',
-            isAdd: true,
-            activeData: {}
-        };
-    },
-    components: {
-        saveEdits
-    },
-    methods: {
-        lookPage(row) {
-            this.$router.push({
-                path: '/housingManagement/details',
-                query: {
-                    id: row.id
-                }
-            });
+  mixins: [list],
+  name: 'housingManagement',
+  data () {
+    return {
+      statusOptions: [
+        { label: '空置', val: 0 },
+        { label: '居住', val: 1 }
+      ],
+      cols: [
+        {
+          label: '所属社区',
+          prop: 'communityName',
+          width: 120
         },
-        addCommand(command) {
-            if (command === 'add') {
-                this.addOrEdit('todo');
-            }
-            if (command === 'template') {
-                this.__exportExcel('/sc-community/excel/download/template', { importType: 'HOUSE' });
-                return;
-            }
+        {
+          label: '楼栋名称',
+          prop: 'buildingName'
         },
-        clerOwnerStatus() {
-            this.showaddDialog = '';
-            this.activeData = {};
-            this.isAdd = true;
-            this.mixins_search();
-        },
-        addOrEdit(todo, row) {
-            if (todo == 'edit') {
-                this.activeData = row;
-                this.isAdd = false;
-            }
-            this.showaddDialog = todo;
+        {
+          label: '单元',
+          prop: 'unitName'
         },
-        deleteRow(row) {
-            const { communityName, buildingName, unitName, roomNumber } = row;
-            let title = `您确定要删除“${communityName}${buildingName}${unitName}${roomNumber}”号房间`;
-            this.$msgBox(title)
-                .then(() => {
-                    this.$http
-                        .post('/sc-community/assets/house/delete', [row.id])
-                        .then(({ status, msg }) => {
-                            if (0 === status) {
-                                this.$message.success(msg);
-                                this.mixins_search();
-                            } else {
-                                this.$message.error(msg);
-                            }
-                        })
-                        .catch(() => {});
-                })
-                .catch(() => {});
+        {
+          label: '房屋号',
+          prop: 'roomNumber'
         },
-        selectionChange(val) {
-            this.selectRow = val;
-        },
-        deluserbyidsFn() {
-            //获取选中列表的ids
-            let ids = [];
-            if (!this.selectRow.length) {
-                this.$message.error('您尚未选择要删除的记录，请选择后再操作批量删除');
-                return;
+        {
+          label: '建筑面积',
+          prop: 'buildingArea',
+          format (val) {
+            if (!!val) {
+              return val + '㎡';
+            } else {
+              return '--';
             }
-            this.selectRow.forEach((v) => {
-                ids.push(v.id);
-            });
-            this.$msgBox(`删除`, '删除后将无法恢复，请问是否继续?')
-                .then(() => {
-                    this.$http.post('/sc-community/assets/house/delete', ids).then(({ status, data, msg }) => {
-                        if (0 === status) {
-                            this.$message({
-                                type: 'success',
-                                message: '删除成功!'
-                            });
-                            this.mixins_search();
-                        } else {
-                            this.$message.error(msg);
-                        }
-                    });
-                })
-                .catch(() => {});
+          }
         },
-        buildingInformation(data) {
-            if (!!data.type && data.type == 'community') {
-                this.mixins_query = { communityId: data.value, buildingType: 1 };
+        {
+          label: '使用面积',
+          prop: 'useArea',
+          format (val) {
+            if (!!val) {
+              return val + '㎡';
             } else {
-                this.mixins_query.communityId = data.communityId;
-                this.mixins_query.id = data.roomId;
-                this.mixins_query.buildingId = data.buildingId;
-                this.mixins_query.unitName = data.unitId;
+              return '--';
             }
-            this.mixins_search();
+          }
+        },
+        {
+          label: '房屋类型',
+          prop: 'buildingTypeDict',
         },
-        //导出
-        exportExcel() {
-            this.__exportExcel('/sc-community/assets/house/export/excel', this.mixins_query);
+        {
+          label: '使用状态',
+          slot: 'useStatus'
         },
-        communityNameList() {
-            this.$http.get('/sc-community/assets/community/list', {}).then((res) => {
-                this.$store.commit('setCommunityArray', res.data);
-            });
+        {
+          label: '操作',
+          slot: 'opt',
+          width: 150
         }
+      ],
+      showaddDialog: '',
+      selectRow: [],
+      mixins_post: 'post',
+      isAdd: true,
+      activeData: {}
+    };
+  },
+  components: {
+    saveEdits
+  },
+  methods: {
+    lookPage (row) {
+      this.$router.push({
+        path: '/housingManagement/details',
+        query: {
+          id: row.id
+        }
+      });
     },
-    created() {
-        this.mixins_dataUrl = '/sc-community/assets/house/page'; // 分页查询接口
-        this.mixins_query = {
-            buildingType: 1
-        };
-
-        this.communityNameList();
-        this.mixins_search('search');
+    addCommand (command) {
+      if (command === 'add') {
+        this.addOrEdit('todo');
+      }
+      if (command === 'template') {
+        this.__exportExcel('/sc-community/excel/download/template', { importType: 'HOUSE' });
+        return;
+      }
+    },
+    clerOwnerStatus () {
+      this.showaddDialog = '';
+      this.activeData = {};
+      this.isAdd = true;
+      this.mixins_search();
+    },
+    addOrEdit (todo, row) {
+      if (todo == 'edit') {
+        this.activeData = row;
+        this.isAdd = false;
+      }
+      this.showaddDialog = todo;
+    },
+    deleteRow (row) {
+      const { communityName, buildingName, unitName, roomNumber } = row;
+      let title = `您确定要删除“${communityName}${buildingName}${unitName}${roomNumber}”号房间`;
+      this.$msgBox(title)
+        .then(() => {
+          this.$http
+            .post('/sc-community/assets/house/delete', [row.id])
+            .then(({ status, msg }) => {
+              if (0 === status) {
+                this.$message.success(msg);
+                this.mixins_search();
+              } else {
+                this.$message.error(msg);
+              }
+            })
+            .catch(() => { });
+        })
+        .catch(() => { });
+    },
+    selectionChange (val) {
+      this.selectRow = val;
+    },
+    deluserbyidsFn () {
+      //获取选中列表的ids
+      let ids = [];
+      if (!this.selectRow.length) {
+        this.$message.error('您尚未选择要删除的记录，请选择后再操作批量删除');
+        return;
+      }
+      this.selectRow.forEach((v) => {
+        ids.push(v.id);
+      });
+      this.$msgBox(`删除`, '删除后将无法恢复，请问是否继续?')
+        .then(() => {
+          this.$http.post('/sc-community/assets/house/delete', ids).then(({ status, data, msg }) => {
+            if (0 === status) {
+              this.$message({
+                type: 'success',
+                message: '删除成功!'
+              });
+              this.mixins_search();
+            } else {
+              this.$message.error(msg);
+            }
+          });
+        })
+        .catch(() => { });
+    },
+    buildingInformation (data) {
+      if (!!data.type && data.type == 'community') {
+        this.mixins_query = { communityId: data.value, buildingType: 1 };
+      } else {
+        this.mixins_query.communityId = data.communityId;
+        this.mixins_query.id = data.roomId;
+        this.mixins_query.buildingId = data.buildingId;
+        this.mixins_query.unitName = data.unitId;
+      }
+      this.mixins_search();
+    },
+    //导出
+    exportExcel () {
+      this.__exportExcel('/sc-community/assets/house/export/excel', this.mixins_query);
+    },
+    communityNameList () {
+      this.$http.get('/sc-community/assets/community/list', {}).then((res) => {
+        this.$store.commit('setCommunityArray', res.data);
+      });
     }
+  },
+  created () {
+    this.mixins_dataUrl = '/sc-community/assets/house/page'; // 分页查询接口
+    this.mixins_query = {
+      buildingType: 1
+    };
+
+    this.communityNameList();
+    this.mixins_search('search');
+  }
 };
 </script>
 <style lang="scss" scoped>