From 74fae92c3fd076359385d27c5ac4e769a38522ab Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期二, 10 十月 2023 15:41:15 +0800
Subject: [PATCH] feat: 销售机会/报价单销售总单/销售子单 列表添加序号

---
 src/views/client/client/index.vue |  225 +++++++++++++++++++++++++++++++++-----------------------
 1 files changed, 132 insertions(+), 93 deletions(-)

diff --git a/src/views/client/client/index.vue b/src/views/client/client/index.vue
index 5aaf4b2..357b5fc 100644
--- a/src/views/client/client/index.vue
+++ b/src/views/client/client/index.vue
@@ -15,47 +15,58 @@
         </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"
+              @selTableCol="selTableCol"
+          >
+            <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" />
     <!-- 瀹㈡埛璇︽儏 -->
@@ -139,7 +150,18 @@
         visible: false,
         infomation: {}
       },
-      not_admin: 2
+      not_admin: 2,
+      tableColumn:[
+        { label: "瀹㈡埛鍚嶇О", prop: "name", min: 100, isClientClick: true, default:true}, // 瀹㈡埛鍚嶇О
+        { label: "閿�鍞礋璐d汉", prop: "member_name" }, // 閿�鍞礋璐d汉
+        { label: "閲嶈绾у埆", prop: "client_level" }, // 閲嶈绾у埆
+        { label: "涓嬫鍥炶鏃ユ湡", prop: "next_visit_time", min: 90 }, // 涓嬫鍥炶鏃ユ湡
+        { label: "璇︾粏鍦板潃", prop: "detail_address", min: 200 }, // 璇︾粏鍦板潃
+        { label: "瀹㈡埛鐘舵��", prop: "client_status" }, // 瀹㈡埛鐘舵��
+        { label: "鑱旂郴浜哄鍚�", prop: "contact_name", isContactClick: true }, // 鑱旂郴浜哄鍚�
+        { label: "鑱旂郴浜烘墜鏈哄彿鐮�", prop: "contact_phone" } // 鎵嬫満鍙风爜
+      ],
+      showCol:['瀹㈡埛鍚嶇О','閿�鍞礋璐d汉','閲嶈绾у埆','涓嬫鍥炶鏃ユ湡','璇︾粏鍦板潃','瀹㈡埛鐘舵��','鑱旂郴浜哄鍚�','鑱旂郴浜烘墜鏈哄彿鐮�']
     }
   },
   created() {
@@ -153,23 +175,29 @@
     setTable() {
       this.tableList = {
         tableInfomation: [],
-        tableColumn: [
-          { label: "瀹㈡埛鍚嶇О", prop: "name", min: 100, isClientClick: true }, // 瀹㈡埛鍚嶇О
-          { label: "閿�鍞礋璐d汉", prop: "member_name" }, // 閿�鍞礋璐d汉
-          { label: "閲嶈绾у埆", prop: "client_level" }, // 閲嶈绾у埆
-          { label: "涓嬫鍥炶鏃ユ湡", prop: "next_visit_time", min: 90 }, // 涓嬫鍥炶鏃ユ湡
-          { label: "璇︾粏鍦板潃", prop: "detail_address", min: 200 }, // 璇︾粏鍦板潃
-          { label: "瀹㈡埛鐘舵��", prop: "client_status" }, // 瀹㈡埛鐘舵��
-          { label: "鑱旂郴浜哄鍚�", prop: "contact_name", isContactClick: true }, // 鑱旂郴浜哄鍚�
-          { label: "鑱旂郴浜烘墜鏈哄彿鐮�", prop: "contact_phone" } // 鎵嬫満鍙风爜
-        ]
+        allcol: [],
+        showcol: this.showCol,
+        tableColumn:this.setColumnVisible(this.showCol)
       }
+      this.tableList.allcol = this.tableList.tableColumn.filter(ele=>!ele.default).map(ele=>ele.label);
       this.searchOptions = []
       for (let i = 0; i < this.tableList.tableColumn.length; i++) {
         const label = this.tableList.tableColumn[i].label
         const value = this.tableList.tableColumn[i].prop
         this.searchOptions.push({ value: value, label: label })
       }
+    },
+    setColumnVisible(showCol){
+      return  this.tableColumn.map(ele=>{
+        return {
+          ...ele,
+          isShowColumn:showCol.includes(ele.label)
+        }
+      })
+    },
+    selTableCol(val) {
+      this.showcol = val;
+      this.tableList.tableColumn = this.setColumnVisible(val);
     },
     // 璇锋眰鏁版嵁
     async getData() {
@@ -238,21 +266,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 +397,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 +406,48 @@
     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;
+    }
+    .list-view {
+      height: calc(100% - 60px);
+      overflow: hidden;
+    }
+    .btn-pager {
+      display: flex;
+      margin-top: 10px;
+      .page {
+        margin-left: auto;
+      }
+    }
+  }
+}
 </style>

--
Gitblit v1.8.0