From c2dde74cf1067543999993b397475a5f6f32852e Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期一, 25 九月 2023 14:40:54 +0800
Subject: [PATCH] style: 客户管理模块样式调整; 分页组件样式调整

---
 src/views/client/client/index.vue |  194 ++++++++++++++++++++++++++++--------------------
 1 files changed, 112 insertions(+), 82 deletions(-)

diff --git a/src/views/client/client/index.vue b/src/views/client/client/index.vue
index 5aaf4b2..50d9c17 100644
--- a/src/views/client/client/index.vue
+++ b/src/views/client/client/index.vue
@@ -15,47 +15,57 @@
         </div>
       </div> -->
     </div>
-    <div class="top">
-      <SearchCommonView
-        ref="searchCommonView"
-        :query-class-options="queryClassOptions"
-        :search-options="searchOptions"
-        @searchClick="searchClick"
-        @resetClick="resetClick"
-      />
-      <div class="btn-pager">
-        <PublicFunctionBtnView
-          :list-button="true"
-          :map-button="true"
-          :statistics="true"
-          :operates-list="operatesList"
-          @batchDelete="delClick"
-        />
-        <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+
+    <div class="filter">
+      <div class="filter-card">
+        <CommonSearch
+            :show-add="false"
+            :show-download="false"
+            :amount-view="false"
+            :show-action-btn="false"
+            placeholder="璇疯緭鍏ュ鎴峰悕绉�"
+            @searchClick="onFilterSearch"
+        >
+          <template slot="leftButton">
+            <el-button size="small" type="primary"  @click="addBtnClick">鏂板缓</el-button>
+            <el-button size="small"  @click="delClick">鍒犻櫎</el-button>
+          </template>
+        </CommonSearch>
       </div>
     </div>
-    <TableCommonView
-      ref="tableListRef"
-      v-loading="loading"
-      :table-list="tableList"
-      @selClientClick="selClientClick"
-      @selContactsClick="selContactsClick"
-      @getSelectArray="getSelectArray"
-    >
-      <template slot="tableButton">
-        <el-table-column label="鎿嶄綔" width="150">
-          <template slot-scope="scope">
-            <el-button v-if="activeName === 'first'" type="text" size="small" @click="allocationBtnClick(scope.row)"
-              >鍒嗛厤</el-button
-            >
-            <el-button v-else type="text" size="small" @click="changeHighSeasClick(scope.row)">鍙樻洿鍏捣</el-button>
-            <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button>
-            <el-button @click="followupClick(scope.row)" type="text" size="small">璺熻繘</el-button>
-            <!-- <el-button @click="delClick(scope.row.id)" type="text" size="small">鍒犻櫎</el-button> -->
-          </template>
-        </el-table-column>
-      </template>
-    </TableCommonView>
+
+    <div class="body">
+      <div class="body-card">
+        <div class="list-view">
+          <TableCommonView
+              ref="tableListRef"
+              v-loading="loading"
+              :table-list="tableList"
+              @selClientClick="selClientClick"
+              @selContactsClick="selContactsClick"
+              @getSelectArray="getSelectArray"
+          >
+            <template slot="tableButton">
+              <el-table-column label="鎿嶄綔" width="150">
+                <template slot-scope="scope">
+                  <el-button v-if="activeName === 'first'" type="text" size="small" @click="allocationBtnClick(scope.row)"
+                  >鍒嗛厤</el-button
+                  >
+                  <el-button v-else type="text" size="small" @click="changeHighSeasClick(scope.row)">鍙樻洿鍏捣</el-button>
+                  <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button>
+                  <el-button @click="followupClick(scope.row)" type="text" size="small">璺熻繘</el-button>
+                  <!-- <el-button @click="delClick(scope.row.id)" type="text" size="small">鍒犻櫎</el-button> -->
+                </template>
+              </el-table-column>
+            </template>
+          </TableCommonView>
+        </div>
+        <div class="btn-pager">
+          <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+        </div>
+      </div>
+    </div>
+
     <!-- 鏂板缓/缂栬緫瀹㈡埛绠$悊 -->
     <AddClientManageDialog v-if="editConfig.visible" :edit-client-manage-config="editConfig" />
     <!-- 瀹㈡埛璇︽儏 -->
@@ -238,21 +248,19 @@
       } else {
         this.not_admin = 1
       }
-      this.resetClick()
-    },
-    // 鎼滅储
-    searchClick(val, content) {
-      console.log(val, content)
-      this.search_map = {
-        not_admin: this.not_admin,
-        [val.value]: content
-      }
-      this.getData()
-    },
-    resetClick() {
       this.search_map = {
         not_admin: this.not_admin
       }
+      this.pagerOptions.currPage = 1
+      this.getData()
+    },
+    // 鎼滅储
+    onFilterSearch(searchText){
+      this.search_map = {
+        not_admin: this.not_admin,
+        name: searchText
+      }
+      this.pagerOptions.currPage = 1
       this.getData()
     },
     // 鏂板缓
@@ -371,37 +379,6 @@
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style lang="scss" scoped>
-.custom-manage {
-  .tab-view {
-    position: relative;
-    .sel-gonghai {
-      display: flex;
-      position: absolute;
-      top: 5px;
-      left: 660px;
-      height: 35px;
-      line-height: 35px;
-      .query-class-sel {
-        width: 165px;
-        margin-left: 10px;
-      }
-      .query-class-btn {
-        font-size: 16px;
-        margin-left: 10px;
-        color: #bebebe;
-      }
-    }
-  }
-  .top {
-    margin-bottom: 20px;
-    .btn-pager {
-      display: flex;
-      .page {
-        margin-left: auto;
-      }
-    }
-  }
-}
 ::v-deep {
   .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
     padding-left: 25px;
@@ -411,4 +388,57 @@
     height: 45px;
   }
 }
+
+.custom-manage{
+  height: 100%;
+  overflow: hidden;
+  .filter{
+    height: 80px;
+    display: flex;
+    align-items: center;
+    padding: 0 20px 0 20px;
+    &-card{
+      height: 80px;
+      display: flex;
+      align-items: center;
+      box-sizing: border-box;
+      padding: 10px 20px;
+      flex: 1;
+      border-radius: 12px;
+      background-color: #fff;
+    }
+  }
+  .body{
+    box-sizing: border-box;
+    padding: 10px 20px;
+    border-radius: 12px;
+    height: calc(100% - 139px);
+    .body-card {
+      background-color: #fff;
+      border-radius: 12px;
+      height: 100%;
+      overflow: hidden;
+    }
+
+    .supplier-search {
+      display: flex;
+      align-items: center;
+      .add-view {
+        margin-left: auto;
+        margin-right: 20px;
+      }
+    }
+    .list-view {
+      height: calc(100% - 60px);
+      overflow: hidden;
+    }
+    .btn-pager {
+      display: flex;
+      margin-top: 10px;
+      .page {
+        margin-left: auto;
+      }
+    }
+  }
+}
 </style>

--
Gitblit v1.8.0