From e730a60a3ecbd94bd785ce860761e05ff1e76d23 Mon Sep 17 00:00:00 2001
From: jiangyy <jiang478938504@126.com>
Date: Tue, 6 Dec 2022 09:03:42 +0800
Subject: [PATCH] 11

---
 src/assets/scss/buttonstyle.scss              |  62 +--
 .../scss/modules/management/list-main.scss    |  22 +-
 .../modules/base/community/community.vue      | 377 ++++++++++--------
 3 files changed, 259 insertions(+), 202 deletions(-)

diff --git a/src/assets/scss/buttonstyle.scss b/src/assets/scss/buttonstyle.scss
index 4d1da7f1c..1fb7e50a1 100644
--- a/src/assets/scss/buttonstyle.scss
+++ b/src/assets/scss/buttonstyle.scss
@@ -6,8 +6,8 @@
   color: #fff !important;
   font-size: 14px !important;
   border-color: #8C91FF !important;
-  min-width: 83px !important;
-  height: 29px !important;
+  min-width: 60px !important;
+  height: 32px !important;
   line-height: 2px !important;
   padding:0 8px  !important;
 }
@@ -18,8 +18,8 @@
   border-color: #29D2CE !important;
   font-size: 14px !important;
   color: #fff !important;
-  min-width: 83px !important;
-  height: 29px !important;
+  min-width: 60px !important;
+  height: 32px !important;
   line-height: 2px !important;
   padding:0 8px  !important;
 
@@ -28,14 +28,14 @@
 
 //蓝色
 .diy-button--blue {
-  background:  linear-gradient(0deg, #0062BB 0%, #0081EC 100%) !important;
-  border-color: #0081EC !important;
+  background: #0056D6 !important;
+  border-radius: 2px !important;
   font-size: 14px !important;
   color: #fff !important;
-  min-width: 83px !important;
-  height: 29px !important;
-  line-height: 2px !important;
-  padding:0 8px  !important;
+  min-width: 60px !important;
+  height: 32px !important;
+  // line-height: 22px !important;
+  // padding:0 8px  !important;
   
   
 }
@@ -46,8 +46,8 @@
   color: #fff !important;
   font-size: 14px !important;
   color: #fff !important;
-  min-width: 83px !important;
-  height: 29px !important;
+  min-width: 60px !important;
+  height: 32px !important;
   line-height: 2px !important;
   padding:0 8px  !important;
 }
@@ -58,8 +58,8 @@
   border-color: #FC8C6B !important;
   font-size: 14px !important;
   color: #fff !important;
-  min-width: 83px !important;
-  height: 29px !important;
+  min-width: 60px !important;
+  height: 32px !important;
   line-height: 2px !important;
   padding:0 8px  !important;
   
@@ -71,8 +71,8 @@
   border-color: #FF8080 !important;
   font-size: 14px !important;
   color: #fff !important;
-  min-width: 83px !important;
-  height: 29px !important;
+  min-width: 60px !important;
+  height: 32px !important;
   line-height: 2px !important;
   padding:0 8px  !important;
   
@@ -84,22 +84,26 @@
   border-color: #A6C3D0 !important;
   color: #002765 !important;
   font-size: 14px !important;
-  min-width: 83px !important;
-  height: 29px !important;
+  min-width: 60px !important;
+  height: 32px !important;
   line-height: 2px !important;
   padding:0 8px  !important;
  
 }
 //白色
 .diy-button--white {
-  background-color:#fff!important;
-  border: 1px solid #3D77FF !important;
-  color: #0153B2 !important;
-  font-size: 14px !important;
-  min-width: 83px !important;
-  height: 29px !important;
-  line-height: 2px !important;
-  padding:0 8px  !important;
+  font-size: 14px  !important;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #0056D6 !important;
+  // line-height: 22px  !important;
+  min-width: 60px !important;
+  height: 32px !important;
+
+  // padding:0 8px  !important;
+  background: #FFFFFF !important;
+  border-radius: 2px !important;
+  border: 1px solid #0056D6 !important;
 }
   
 //操作栏更多
@@ -107,8 +111,8 @@
   text-decoration: underline !important;
   color: #002765 !important;
   font-size: 14px !important;
-  // min-width: 83px !important;
-  // height: 29px !important;
+  // min-width: 60px !important;
+  // height: 32px !important;
   // line-height: 2px !important;
   // padding:0 8px  !important;
   
@@ -127,7 +131,7 @@
   font-size: 14px !important;
   font-family: Source Han Serif CN !important;
   font-weight: 600 !important;
-  color: #0153B2 !important;
+  color: #0056D6 !important;
 }
 .div-table-button--red {
   font-size: 14px !important;
diff --git a/src/assets/scss/modules/management/list-main.scss b/src/assets/scss/modules/management/list-main.scss
index 28c4f4e57..ff0c8ab48 100644
--- a/src/assets/scss/modules/management/list-main.scss
+++ b/src/assets/scss/modules/management/list-main.scss
@@ -9,11 +9,20 @@
   .div_search {
     padding: 10px;
     // box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
-    background-color: #f6f6f6;
-    border: 1px solid #D3DCE6;
+    background: #FFFFFF;
+    box-shadow: 0px 6px 16px 0px rgba(0,0,0,0.08), 0px 3px 6px -4px rgba(0,0,0,0.12);
     margin:7px 7px;
 
+    /deep/ .el-form-item{
+      margin-bottom:14px;
+    }
+
+    .search_form{
+      
+    }
+
     .div_search_btn{
+      margin-top:5px;
       float:right;
     }                                                                                                                                                                                                                                                                                                                          
 
@@ -33,15 +42,18 @@
 
    //查询栏---常规宽度
    .item_width_normal{
-    width: 138px;
+    width: 168px;
   }
    //查询栏---日期、时间范围的宽度
    .item_width_daterange{
-    width: 176px;
+    width: 206px;
   }
    //查询栏---小区、楼、单元、楼号，级联长度
+   .item_width_communitycascader{
+    width: 141px;
+  }
    .item_width_buildcascader{
-    width: 151px;
+    width: 96px;
   }
 
   .div_table{
diff --git a/src/views/modules/base/community/community.vue b/src/views/modules/base/community/community.vue
index 95584973d..f4e0fc8e9 100644
--- a/src/views/modules/base/community/community.vue
+++ b/src/views/modules/base/community/community.vue
@@ -33,112 +33,153 @@
          class=div_left>
 
       <div class="div_search">
-        <el-form :inline="true"
-                 ref="ref_searchform"
-                 :label-width="'100px'">
-
-          <el-form-item label="房主姓名"
-                        prop="ownerName">
-            <el-input v-model="ownerName"
-                      class="item_width_normal"
-                      size="small"
-                      clearable
-                      placeholder="请输入内容">
-
-            </el-input>
-          </el-form-item>
-          <el-form-item label="联系方式"
-                        prop="ownerPhone">
-            <el-input v-model="ownerPhone"
-                      class="item_width_normal"
-                      size="small"
-                      clearable
-                      placeholder="请输入手机">
-            </el-input>
-
-          </el-form-item>
-
-          <el-form-item label="房屋状态"
-                        prop="rentFlag">
-            <el-select class="item_width_normal"
-                       v-model="rentFlag"
-                       placeholder="请选择"
-                       size="small"
-                       clearable>
-              <el-option v-for="item in rentList"
-                         :key="item.value"
-                         :label="item.label"
-                         :value="item.value">
-              </el-option>
-            </el-select>
-          </el-form-item>
-
-          <el-form-item label="房屋用途"
-                        prop="purpose">
-            <el-select v-model="purpose"
-                       class="item_width_normal"
-                       placeholder="请选择"
-                       size="small"
-                       clearable>
-              <el-option v-for="item in purposeArr"
-                         :key="item.dictValue"
-                         :label="item.dictName"
-                         :value="item.dictValue">
-              </el-option>
-            </el-select>
-
-          </el-form-item>
-
-          <el-form-item label="备注"
-                        prop="remark">
-            <el-input v-model="remark"
-                      class="item_width_normal"
-                      size="small"
-                      clearable
-                      placeholder="请输入备注">
-            </el-input>
-          </el-form-item>
-          <el-form-item label="更新时间"
-                        prop="updateStartDate">
-            <el-date-picker v-model="updateStartDate"
-                            :picker-options="startPickerOptions"
-                            class="item_width_daterange"
-                            size="small"
-                            type="date"
-                            value-format="yyyyMMdd"
-                            value="yyyy-MM-dd"
-                            placeholder="开始时间">
-            </el-date-picker>
-            <span class="data-tag">至</span>
-            <el-date-picker v-model="updateEndDate"
-                            :picker-options="endPickerOptions"
-                            class="item_width_daterange data-tag"
-                            size="small"
-                            type="date"
-                            value-format="yyyyMMdd"
-                            value="yyyy-MM-dd"
-                            placeholder="结束时间">
-            </el-date-picker>
-          </el-form-item>
-          <span class="div_search_label">所属房屋：</span>
-          <!-- <el-form-item label="所属房屋"> -->
-
-          <el-form-item prop="neighborHoodId">
-            <el-select v-model.trim="neighborHoodId"
-                       :disabled="vDisabled"
-                       placeholder="小区"
-                       size="small"
-                       clearable
-                       class="item_width_buildcascader"
-                       @change="handleChangeV">
-              <el-option v-for="item in optionsV"
-                         :key="item.value"
-                         :label="item.label"
-                         :value="item.value">
-              </el-option>
-            </el-select>
-          </el-form-item>
-          <el-form-item prop="buildingId">
+        <div class="search_form">
+          <el-form :inline="true"
+                   ref="ref_searchform"
+                   :label-width="'100px'">
+
+            <el-form-item label="房主姓名"
+                          prop="ownerName">
+              <el-input v-model="ownerName"
+                        class="item_width_normal"
+                        size="small"
+                        clearable
+                        placeholder="请输入内容">
+
+              </el-input>
+            </el-form-item>
+            <el-form-item label="联系方式"
+                          prop="ownerPhone">
+              <el-input v-model="ownerPhone"
+                        class="item_width_normal"
+                        size="small"
+                        clearable
+                        placeholder="请输入手机">
+              </el-input>
+
+            </el-form-item>
+
+            <el-form-item label="房屋状态"
+                          prop="rentFlag">
+              <el-select class="item_width_normal"
+                         v-model="rentFlag"
+                         placeholder="请选择"
+                         size="small"
+                         clearable>
+                <el-option v-for="item in rentList"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+
+            <el-form-item label="房屋用途"
+                          prop="purpose">
+              <el-select v-model="purpose"
+                         class="item_width_normal"
+                         placeholder="请选择"
+                         size="small"
+                         clearable>
+                <el-option v-for="item in purposeArr"
+                           :key="item.dictValue"
+                           :label="item.dictName"
+                           :value="item.dictValue">
+                </el-option>
+              </el-select>
+
+            </el-form-item>
+
+            <el-form-item label="更新时间"
+                          prop="updateStartDate">
+              <el-date-picker v-model="updateStartDate"
+                              :picker-options="startPickerOptions"
+                              class="item_width_daterange"
+                              size="small"
+                              type="date"
+                              value-format="yyyyMMdd"
+                              value="yyyy-MM-dd"
+                              placeholder="开始时间">
+              </el-date-picker>
+              <span class="data-tag">至</span>
+              <el-date-picker v-model="updateEndDate"
+                              :picker-options="endPickerOptions"
+                              class="item_width_daterange data-tag"
+                              size="small"
+                              type="date"
+                              value-format="yyyyMMdd"
+                              value="yyyy-MM-dd"
+                              placeholder="结束时间">
+              </el-date-picker>
+            </el-form-item>
+            <el-form-item label="备注"
+                          prop="remark">
+              <el-input v-model="remark"
+                        class="item_width_normal"
+                        size="small"
+                        clearable
+                        placeholder="请输入备注">
+              </el-input>
+            </el-form-item>
+
+            <el-form-item label="所属房屋"
+                          prop="neighborHoodId">
+              <el-select v-model.trim="neighborHoodId"
+                         :disabled="vDisabled"
+                         placeholder="小区"
+                         size="small"
+                         clearable
+                         class="item_width_communitycascader"
+                         @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="buildingId"
+                         placeholder="楼号"
+                         :disabled="!neighborHoodId || bDisabled"
+                         size="small"
+                         clearable
+                         class="item_width_buildcascader"
+                         style="margin-left:5px"
+                         @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="buildingUnitId"
+                         placeholder="单元"
+                         size="small"
+                         :disabled="!buildingId"
+                         clearable
+                         class="item_width_buildcascader"
+                         style="margin-left:5px"
+                         @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="houseId"
+                         placeholder="房号"
+                         :disabled="!buildingUnitId"
+                         size="small"
+                         clearable
+                         class="item_width_buildcascader"
+                         style="margin-left:5px">
+                <el-option v-for="item in optionsH"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <!-- <el-form-item prop="buildingId">
             <el-select v-model.trim="buildingId"
                        placeholder="楼号"
                        :disabled="!neighborHoodId || bDisabled"
@@ -152,8 +193,8 @@
                          :value="item.value">
               </el-option>
             </el-select>
-          </el-form-item>
-          <el-form-item prop="buildingUnitId">
+          </el-form-item> -->
+            <!-- <el-form-item prop="buildingUnitId">
             <el-select v-model.trim="buildingUnitId"
                        placeholder="单元"
                        size="small"
@@ -167,8 +208,8 @@
                          :value="item.value">
               </el-option>
             </el-select>
-          </el-form-item>
-          <el-form-item prop="houseId">
+          </el-form-item> -->
+            <!-- <el-form-item prop="houseId">
             <el-select v-model.trim="houseId"
                        placeholder="房号"
                        :disabled="!buildingUnitId"
@@ -181,22 +222,29 @@
                          :value="item.value">
               </el-option>
             </el-select>
-          </el-form-item>
-
-          <!-- </el-form-item> -->
-          <div class="div_search_btn">
-            <el-button style="margin-left:30px"
-                       size="small"
-                       class="diy-button--blue"
-                       @click="handleSearch">查询</el-button>
-            <el-button style="margin-left:10px"
-                       size="small"
-                       class="diy-button--gray"
-                       @click="resetSearch">重置</el-button>
-          </div>
+          </el-form-item> -->
+
+            <!-- </el-form-item> -->
+        </div>
+        <div class="div_search_btn">
+          <el-button size="small"
+                     class="diy-button--white"
+                     @click="resetSearch">重置</el-button>
+          <el-button style="margin-left:10px"
+                     size="small"
+                     class="diy-button--blue"
+                     @click="handleSearch">查询</el-button>
+          <el-button style="margin-left:15px"
+                     size="small"
+                     class="div-table-button--blue"
+                     type="text"
+                     @click="handleSearch">展开<i class="el-icon-arrow-down el-icon--right"></i></el-button>
+
+        </div>
         </el-form>
 
       </div>
+
       <div class="div_table">
         <build-table v-if="selTreeObj.level==='neighborHood'&&!showRoomTable"
                      ref="ref_neighTable"
@@ -763,16 +811,7 @@ export default {
 </script>
 
 
-<style>
-/* .aui-content > .el-tabs > .el-tabs__content {
-    padding: 0px;
-  } */
 
-.el-tree-node:focus > .el-tree-node__content {
-  /* background-color: #ccc !important; */
-  color: #2195fe;
-}
-</style>
 
 <style lang="scss" scoped >
 @import "@/assets/scss/modules/visual/communityManage.scss";
@@ -789,22 +828,22 @@ export default {
     .el-tree--highlight-current
     .el-tree-node.is-current
     > .el-tree-node__content {
-    background-color: #e1ecff;
-    border-radius: 3px;
+    background: #e6f0ff;
+    border-radius: 2px;
   }
 
   /deep/ .el-tree-node:focus > .el-tree-node__content {
-    color: #0043c8;
-    // background-color: #fff;
-  }
-  /deep/ .el-tree-node__expand-icon {
-    color: #0043c8;
-    border: 1px solid #e1ecff;
-    background-color: #e1ecff;
-    padding: 0px;
-    margin-right: 8px;
-    font-size: 9px;
+    color: #0056d6;
+    // background-color: #e6f0ff;
   }
+  // /deep/ .el-tree-node__expand-icon {
+  //   color: #0043c8;
+  //   border: 1px solid #e1ecff;
+  //   background-color: #e1ecff;
+  //   padding: 0px;
+  //   margin-right: 8px;
+  //   font-size: 9px;
+  // }
 
   /deep/.el-tree {
     flex: 1;
@@ -814,27 +853,27 @@ export default {
     }
 
     //原有的箭头 去掉
-    .el-icon svg {
-      display: none;
-      height: 0;
-      width: 0;
-    }
+    // .el-icon svg {
+    //   display: none;
+    //   height: 0;
+    //   width: 0;
+    // }
     //引入图标的位置
-    .el-tree-node__expand-icon {
-      // position: absolute;
-      // left: 2px;
-      // 图标是否旋转，如果是箭头类型的，可以设置旋转90度。
-      .expanded {
-        transform: rotate(90deg);
-      }
-      // 未展开的节点
-      &:before {
-        // content: "\008B";
-        // content: "\008B";
-        font-size: 12px;
-        color: #0043c8;
-      }
-    }
+    // .el-tree-node__expand-icon {
+    //   // position: absolute;
+    //   // left: 2px;
+    //   // 图标是否旋转，如果是箭头类型的，可以设置旋转90度。
+    //   .expanded {
+    //     transform: rotate(90deg);
+    //   }
+    //   // 未展开的节点
+    //   &:before {
+    //     // content: "\008B";
+    //     // content: "\008B";
+    //     font-size: 12px;
+    //     color: #0043c8;
+    //   }
+    // }
     // 叶子节点（不显示图标）
     .is-leaf.el-tree-node__expand-icon::before {
       // display: none;
@@ -857,11 +896,13 @@ export default {
   //搜索输入框样式
   /deep/ .el-input--medium .el-input__inner {
     height: 27px;
-    border-radius: 0;
+    background: rgba(0, 0, 0, 0.05);
+    border-radius: 4px;
   }
   flex: 0 0 280px;
-  background-color: #f6f6f6;
-  border: 1px solid #d3dce6;
+  background: #ffffff;
+  box-shadow: 0px 6px 16px 0px rgba(0, 0, 0, 0.08),
+    0px 3px 6px -4px rgba(0, 0, 0, 0.12);
   // border-radius: 5px;
   padding: 19px 15px;
   overflow-y: hidden;
@@ -869,7 +910,7 @@ export default {
 
 .filter_tree {
   overflow-x: auto;
-  background-color: #f6f6f6;
+  // background-color: #f6f6f6;
   margin-top: 5px;
 }