居民信息上方样式修改

src/assets/scss/modules/management/list-main.css

@@ -0,0 +1,144 @@
+.div_main {
+  width: 100%;
+}
+
+.div_main .marginl-20 {
+  margin-left: 16px;
+}
+
+.div_main .div_search {
+  padding: 10px;
+  background-color: #f6f6f6;
+  border: 1px solid #D3DCE6;
+  margin: 7px 7px;
+}
+
+.div_main .div_search .div_search_btn {
+  float: right;
+}
+
+.div_main .div_search .div_search_label {
+  line-height: 36px;
+  margin-left: 24px;
+  margin-right: 6px;
+  font-size: 14px;
+  color: #606266;
+  vertical-align: middle;
+}
+
+.div_main .data-tag {
+  margin-left: 10px;
+}
+
+.div_main .item_width_normal {
+  width: 138px;
+}
+
+.div_main .item_width_daterange {
+  width: 176px;
+}
+
+.div_main .item_width_buildcascader {
+  width: 151px;
+}
+
+.div_main .div_table {
+  margin: 15px 7px 7px;
+  position: relative;
+}
+
+.div_main .div_table .div_btn {
+  display: flex;
+  justify-content: space-between;
+}
+
+.div_main .div_table .div_btn .div_btn_left {
+  display: flex;
+}
+
+.div_main .div_table .div_btn .div_btn_left .btn_upload {
+  margin-left: 10px;
+  display: flex;
+}
+
+.div_main .div_table .div_table_item {
+  margin-top: 10px;
+  position: relative;
+}
+
+.div_main .item_width_2 {
+  width: 138px;
+}
+
+.div_main .item_width_1 {
+  width: 260px;
+}
+
+.div_main .item_width_3 {
+  width: 200px;
+}
+
+.div_main .list_item_width_1 {
+  width: 165px;
+}
+
+.div_main .list_item_width_2 {
+  width: 135px;
+}
+
+.div-mult-form {
+  margin-top: 20px;
+}
+
+.div-mult-form .div_person {
+  display: flex;
+  font-size: 14px;
+  padding-bottom: 20px;
+}
+
+.div-mult-form .div_person .person_title {
+  text-align: right;
+  flex: 0 0 100px;
+  line-height: 36px;
+  padding: 0 12px 0 0;
+}
+
+.div-mult-form .div_person .tag_item {
+  margin-right: 10px;
+  margin-top: 10px;
+}
+
+.div-mult-form .div_person .tag_tip {
+  margin-top: 10px;
+  color: #9c9c9c;
+}
+
+.div-mult-table {
+  position: relative;
+  padding: 0 20px;
+}
+
+.div-mult-table .div_selcount {
+  position: absolute;
+  bottom: 10px;
+  left: 30px;
+}
+
+.div_dialog_table {
+  padding: 10px;
+}
+
+.div_dialog_table .table {
+  margin-top: 20px;
+}
+
+.twoline {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+}
+
+.font_color_blue {
+  color: #0054d7;
+}

src/assets/scss/modules/management/list-main.min.css

@@ -0,0 +1 @@
+.div_main{width:100%}.div_main .marginl-20{margin-left:16px}.div_main .div_search{padding:10px;background-color:#f6f6f6;border:1px solid #D3DCE6;margin:7px 7px}.div_main .div_search .div_search_btn{float:right}.div_main .div_search .div_search_label{line-height:36px;margin-left:24px;margin-right:6px;font-size:14px;color:#606266;vertical-align:middle}.div_main .data-tag{margin-left:10px}.div_main .item_width_normal{width:138px}.div_main .item_width_daterange{width:176px}.div_main .item_width_buildcascader{width:151px}.div_main .div_table{margin:15px 7px 7px;position:relative}.div_main .div_table .div_btn{display:flex;justify-content:space-between}.div_main .div_table .div_btn .div_btn_left{display:flex}.div_main .div_table .div_btn .div_btn_left .btn_upload{margin-left:10px;display:flex}.div_main .div_table .div_table_item{margin-top:10px;position:relative}.div_main .item_width_2{width:138px}.div_main .item_width_1{width:260px}.div_main .item_width_3{width:200px}.div_main .list_item_width_1{width:165px}.div_main .list_item_width_2{width:135px}.div-mult-form{margin-top:20px}.div-mult-form .div_person{display:flex;font-size:14px;padding-bottom:20px}.div-mult-form .div_person .person_title{text-align:right;flex:0 0 100px;line-height:36px;padding:0 12px 0 0}.div-mult-form .div_person .tag_item{margin-right:10px;margin-top:10px}.div-mult-form .div_person .tag_tip{margin-top:10px;color:#9c9c9c}.div-mult-table{position:relative;padding:0 20px}.div-mult-table .div_selcount{position:absolute;bottom:10px;left:30px}.div_dialog_table{padding:10px}.div_dialog_table .table{margin-top:20px}.twoline{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.font_color_blue{color:#0054d7}

src/views/components/rangeInput.vue

@@ -127,5 +127,7 @@ export default {
 
 .div_middle {
   padding: 0 10px;
+  position: relative;
+    bottom: 10px;
 }
-</style>
+</style>

src/views/components/resiSearch.vue

@@ -1,101 +1,17 @@
 <template>
   <div class="resi-container">
     <!-- <el-card class="resi-card"> -->
-    <el-row>
-      <el-row v-if="showGrid"
-              class="resi-row">
-        <el-col :span="6">
-          <div class="resi-cell">
-            <div class="resi-cell-label">所属组织</div>
-            <div class="resi-cell-value">
-              <el-cascader class="customer_cascader"
-                           ref="myCascader"
-                           v-model="agencyIdArray"
-                           :options="orgOptions"
-                           :props="orgOptionProps"
-                           :show-all-levels="false"
-                           @change="handleChangeAgency"></el-cascader>
-            </div>
-          </div>
-        </el-col>
+    <div>
 
-        <el-col :span="18">
-          <div class="resi-cell">
-            <div class="resi-cell-label">所属房屋</div>
-            <div class="resi-cell-value">
-              <el-select v-model.trim="form.VILLAGE_ID"
-                         placeholder="请选择小区"
-                         size="small"
-                         filterable
-                         clearable
-                         class="resi-cell-select"
-                         @clear="handleClearVillage"
-                         @change="handleChangeV">
-                <el-option v-for="item in optionsV"
-                           :key="item.value"
-                           :label="item.label"
-                           :value="item.value">
-                </el-option>
-              </el-select>
-              <el-select v-model.trim="form.BUILD_ID"
-                         placeholder="楼号"
-                         size="small"
-                         filterable
-                         clearable
-                         style="width: 120px;"
-                         class="resi-cell-select"
-                         :disabled="changeVDisabled"
-                         @clear="handleClearBuild"
-                         @change="handleChangeB">
-                <el-option v-for="item in optionsB"
-                           :key="item.value"
-                           :label="item.label"
-                           :value="item.value">
-                </el-option>
-              </el-select>
-              <el-select v-model.trim="form.UNIT_ID"
-                         :disabled="changeBDisabled"
-                         placeholder="单元"
-                         size="small"
-                         filterable
-                         clearable
-                         style="width: 120px;"
-                         class="resi-cell-select"
-                         @click="handleClearDan"
-                         @change="handleChangeD">
-                <el-option v-for="item in optionsD"
-                           :key="item.value"
-                           :label="item.label"
-                           :value="item.value">
-                </el-option>
-              </el-select>
-              <el-select v-model.trim="form.HOME_ID"
-                         :disabled="changeDDisabled"
-                         placeholder="房号"
-                         size="small"
-                         filterable
-                         clearable
-                         style="width: 120px;"
-                         class="resi-cell-select">
-                <el-option v-for="item in optionsH"
-                           :key="item.value"
-                           :label="item.label"
-                           :value="item.value">
-                </el-option>
-              </el-select>
-            </div>
-          </div>
-        </el-col>
-      </el-row>
-      <el-row v-for="(item, index) in sliceList(itemList, 4)"
-              :key="index"
-              class="resi-row">
-        <el-col v-for="n in item"
+      <el-form :inline="true"  :label-width="'100px'" class="header_form_box" v-for="(item, index) in sliceList(itemList, 4)"
+              :key="index">
+        <el-form-item  v-for="n in item"
                 :key="n.id"
-                :span="computdSpan(item.length)">
+                :span="computdSpan(item.length)"
+              >
           <div class="resi-cell">
             <div class="resi-cell-label"
-                 :class="item.length != 4 && 'resi-cell-label1'">{{ n.label }}</div>
+                 :class="item.length != 4 && 'resi-cell-label1'">{{ n.label }}:</div>
             <div class="resi-cell-value"
                  :class="n.itemType === 'radio' && 'resi-cell-value-radio'">
               <el-input v-if="n.itemType === 'input' || n.itemType === 'textarea'"
@@ -169,14 +85,90 @@
                   <el-checkbox v-for="ns in n.options"
                                :key="ns.value"
                                :label="ns.value">{{ns.label}}</el-checkbox>
-
                 </el-checkbox-group>
               </template>
             </div>
           </div>
-        </el-col>
-      </el-row>
-    </el-row>
+        </el-form-item>
+
+        <el-form-item label="所属组织" prop="agencyIdArray">
+              <el-cascader class="item_width_normal"
+                           ref="myCascader"
+                           v-model="agencyIdArray"
+                           :options="orgOptions"
+                           :props="orgOptionProps"
+                           :show-all-levels="false"
+                           @change="handleChangeAgency"></el-cascader>
+        </el-form-item>
+
+        <el-form-item label="所属房屋" prop="VILLAGE_ID">
+          <div class="resi-cell">
+            <div class="resi-cell-value">
+              <el-select v-model.trim="form.VILLAGE_ID"
+                         placeholder="请选择小区"
+                         size="small"
+                         filterable
+                         clearable
+                         class="resi-cell-select"
+                         @clear="handleClearVillage"
+                         @change="handleChangeV">
+                <el-option v-for="item in optionsV"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+              <el-select v-model.trim="form.BUILD_ID"
+                         placeholder="楼号"
+                         size="small"
+                         filterable
+                         clearable
+                         style="width: 120px;"
+                         class="resi-cell-select"
+                         :disabled="changeVDisabled"
+                         @clear="handleClearBuild"
+                         @change="handleChangeB">
+                <el-option v-for="item in optionsB"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+              <el-select v-model.trim="form.UNIT_ID"
+                         :disabled="changeBDisabled"
+                         placeholder="单元"
+                         size="small"
+                         filterable
+                         clearable
+                         style="width: 120px;"
+                         class="resi-cell-select"
+                         @click="handleClearDan"
+                         @change="handleChangeD">
+                <el-option v-for="item in optionsD"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+              <el-select v-model.trim="form.HOME_ID"
+                         :disabled="changeDDisabled"
+                         placeholder="房号"
+                         size="small"
+                         filterable
+                         clearable
+                         style="width: 120px;"
+                         class="resi-cell-select">
+                <el-option v-for="item in optionsH"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+          </div>
+        </el-form-item>
+      </el-form>
+    </div>
 
     <el-row v-if="showSmartSearchForm"
             class="resi-row-more">
@@ -194,23 +186,23 @@
                            :formType="formType"></smart-search-rule>
       </el-col>
     </el-row>
-
     <el-row v-if="isArrow"
             class="resi-search">
 
       <el-col :span="24">
         <el-button type="primary"
                    size="small"
-                   class="diy-button--blue"
-                   @click="handleSearch">查询</el-button>
-        <el-button type="primary"
-                   size="small"
-                   class="diy-button--orange"
-                   @click="handleSmartSearch">智能查询</el-button>
+                   @click="handleSearch" plain>查询 </el-button>
         <el-button style="margin-left:10px"
                    size="small"
-                   class="diy-button--gray"
+                   type="primary"
+                   plain
                    @click="resetForm">重置</el-button>
+        <el-button type="primary"
+                   size="small"
+                   plain
+                   @click="handleSmartSearch">智能查询</el-button>
+        <span class="font_color_blue">收起 <i class="el-icon-arrow-up"></i></span>
       </el-col>
     </el-row>
 
@@ -262,6 +254,7 @@ export default {
       return _form
     }
     let itemList = this.formList.map(item => {
+      console.log(item);
       if (item.itemType == 'inputRange' && item.funType == 'agetoyear') {
         item.columnName = 'age'
       }
@@ -362,7 +355,7 @@ export default {
         'AGENCY_ID': 'like'
       },
 
-      showSmartSearchForm: true,
+      showSmartSearchForm: false,
       formType: 'add',
       selBtnIndex: 1,
       btnList: [
@@ -380,7 +373,7 @@ export default {
               nextLogicalRel: "",
               nextLogicalRelName: "",
               personRule: {
-                ruleDesc: '',//规则描述文字，例如：基础信息性别等于女	
+                ruleDesc: '',//规则描述文字，例如：基础信息性别等于女
                 itemGroupId: '',
                 itemId: '',
                 queryType: '',
@@ -466,12 +459,13 @@ export default {
           let index = 0
           let arrTemp = []
           for (let i = 0; i < data.length; i++) {
-            index = parseInt(i / count)
+            index = parseInt(0)
             if (arrTemp.length <= index) {
               arrTemp.push([])
             }
             arrTemp[index].push(data[i])
           }
+          console.log(arrTemp);
           return arrTemp
         }
       }
@@ -816,17 +810,11 @@ export default {
 </script>
 
 <style lang="scss" scope>
-.resi-row-more {
-  height: max-content;
-  transition: height 0.5s;
-  width: 100%;
+@import "@/assets/scss/modules/management/list-main.scss";
 
-  border-top: 1px dotted #8b8b8b;
-  margin-top: 5px;
-  padding-top: 15px;
-}
-.resi-row {
-  margin-bottom: 14px;
+.header_form_box{
+  display: flex;
+  flex-wrap: wrap;
 }
 .resi-search {
   // padding-right: 20px;

src/views/modules/base/resi.vue

@@ -27,7 +27,7 @@
       <!-- </template> -->
       <!-- <el-row v-if="openSearch"
               class="resi-search">
-       
+
         <el-col :span="24">
           <el-button size="small"
                      class="diy-button--blue"
@@ -52,20 +52,18 @@
         <div class="div_btn_left">
           <el-button v-if="btnAuths.ic_resi_add"
                      size="small"
-                     class="diy-button--purple"
-                     @click="handleAdd">新增</el-button>
+                     @click="handleAdd" plain type="primary"> <i class="el-icon-plus"></i> 新增小区</el-button>
           <el-button v-if="btnAuths.ic_resi_export"
                      style="margin-left:10px"
-                     class="diy-button--green"
                      size="small"
-                     @click="diyExport">导出</el-button>
+                     @click="diyExport" plain type="primary">导出</el-button>
 
-          <el-button v-if="btnAuths.ic_resi_import"
+          <!-- <el-button v-if="btnAuths.ic_resi_import"
                      style="margin-left:10px"
                      class="diy-button--blue"
                      size="small"
-                     @click="handleExportModule('room')">下载模板</el-button>
-          <el-upload v-if="btnAuths.ic_resi_import"
+                     @click="handleExportModule('room')">下载模板</el-button> -->
+          <!-- <el-upload v-if="btnAuths.ic_resi_import"
                      :headers="$getElUploadHeaders()"
                      ref="upload"
                      class="upload-demo"
@@ -83,20 +81,20 @@
                        class="diy-button--yellow"
                        size="small"
                        :loading="importLoading">{{ importBtnTitle }}</el-button>
-          </el-upload>
+          </el-upload> -->
+
+          <el-button v-if="btnAuths.ic_resi_smart_import && displayedBaobiaoBtn"
+                     style="margin-left:10px"
+                     size="small"
+                     @click="reportForm" plain type="primary">核对</el-button>
 
           <el-button style="margin-left:10px"
                      v-if="btnAuths.ic_resi_batch_del"
-                     class="diy-button--red"
                      size="small"
-                     @click="deleteBatch">批量删除</el-button>
+                     @click="deleteBatch" plain  type="primary">批量删除</el-button>
           <!-- <el-button type="primary" size="small">下载人口模板</el-button> -->
 
-          <el-button v-if="btnAuths.ic_resi_smart_import && displayedBaobiaoBtn"
-                     style="margin-left:10px"
-                     class="diy-button--orange"
-                     size="small"
-                     @click="reportForm">智能填报</el-button>
+
         </div>
       </div>
 
@@ -1456,6 +1454,7 @@ export default {
     background: #ebecf1;
     border-radius: 2px;
   }
+
   ::v-deep .el-tabs__nav-wrap::after,
   ::v-deep .el-tabs__active-bar {
     display: none;
@@ -1478,6 +1477,16 @@ export default {
   position: relative;
   overflow: visible;
 }
+::v-deep .el-button--primary.is-plain{
+    color: #0055d7;
+    background: #ffffff;
+    border-color: #0055d7;
+  }
+  ::v-deep .el-button--primary.is-plain:hover{
+    color: #fff;
+    background: #0055d7;
+    border-color: #0055d7;
+  }
 .resi-container .resi-card-table {
   ::v-deep .el-table th {
     color: #fff;