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/other/payment/receipt/index.vue |  169 +++++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 111 insertions(+), 58 deletions(-)

diff --git a/src/views/other/payment/receipt/index.vue b/src/views/other/payment/receipt/index.vue
index c8fc457..87a0533 100644
--- a/src/views/other/payment/receipt/index.vue
+++ b/src/views/other/payment/receipt/index.vue
@@ -2,37 +2,51 @@
   <div class="receipt">
     <div v-if="isDetail" class="detail-top">
       <DetailListCommonBtn :query-class-options="queryClassOptions" />
-      <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
     </div>
-    <div v-else class="top">
-      <SearchCommonView
-        ref="searchCommonView"
-        :query-class-options="queryClassOptions"
-        :search-options="searchOptions"
-        :search-sel="searchSel"
-        @searchClick="searchClick"
-        @resetClick="resetClick"
-      />
-      <div class="btn-pager">
-        <PublicFunctionBtnView :statistics="true" :operates-list="operatesList" @batchDelete="delClick" />
-        <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+
+    <div v-else 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"
-      :select-box="!isDetail"
-      @getSelectArray="getSelectArray"
-    >
-      <!-- <template slot="tableButton">
-        <el-table-column label="鎿嶄綔" width="60" fixed="right">
-          <template slot-scope="scope">
-            <el-button @click="handleClick(scope.row)" 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"
+              :select-box="!isDetail"
+              @getSelectArray="getSelectArray"
+              @selTableCol="selTableCol"
+          >
+            <!-- <template slot="tableButton">
+              <el-table-column label="鎿嶄綔" width="60" fixed="right">
+                <template slot-scope="scope">
+                  <el-button @click="handleClick(scope.row)" 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>
     <!-- 鏂板缓/缂栬緫 -->
     <AddReceipt v-if="editConfig.visible" :edit-common-config="editConfig" />
   </div>
@@ -108,7 +122,17 @@
       },
       search_map: {},
       keyword: "",
-      keywordType: ""
+      keywordType: "",
+      tableColumn: [
+        { label: "鏀舵鍗曠紪鍙�", prop: "number", default: true},
+        { label: "瀹㈡埛鍚嶇О", prop: "client_name" },
+        { label: "閫夋嫨婧愬崟", prop: "sourceId" },
+        { label: "瀹為檯鏀舵閲戦", prop: "amount" },
+        { label: "鏀舵鏂瑰紡", prop: "paymentType_name" },
+        { label: "閿�鍞礋璐d汉", prop: "principal_name" },
+        { label: "鏀舵鏃ユ湡", prop: "receiptDate" }
+      ],
+      showCol:["鏀舵鍗曠紪鍙�", "瀹㈡埛鍚嶇О", "閫夋嫨婧愬崟", "瀹為檯鏀舵閲戦", "鏀舵鏂瑰紡", "閿�鍞礋璐d汉", "鏀舵鏃ユ湡"]
     }
   },
   created() {
@@ -126,22 +150,29 @@
     setTable() {
       this.tableList = {
         tableInfomation: [],
-        tableColumn: [
-          { label: "鏀舵鍗曠紪鍙�", prop: "number" },
-          { label: "瀹㈡埛鍚嶇О", prop: "client_name" },
-          { label: "閫夋嫨婧愬崟", prop: "sourceId" },
-          { label: "瀹為檯鏀舵閲戦", prop: "amount" },
-          { label: "鏀舵鏂瑰紡", prop: "paymentType_name" },
-          { label: "閿�鍞礋璐d汉", prop: "principal_name" },
-          { label: "鏀舵鏃ユ湡", prop: "receiptDate" }
-        ]
+        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() {
@@ -153,10 +184,10 @@
         pageSize: this.pagerOptions.pageSize
       })
         .then((res) => {
-          console.log(res)
           if (res.data.code === 200) {
-            if (res.data.data.data && res.data.data.data.length > 0) {
-              const list = res.data.data.data.map((item) => {
+            const resList = res?.data?.data?.data ?? []
+            if (resList.length > 0) {
+              const list = resList.map((item) => {
                 return {
                   ...item,
                   client_name: item.client.name,
@@ -181,14 +212,10 @@
         })
     },
     // 鎼滅储
-    searchClick(val, content) {
-      this.keyword = content
-      this.keywordType = val.label
-      this.getData()
-    },
-    resetClick() {
-      this.keyword = ""
-      this.keywordType = ""
+    onFilterSearch(searchText){
+      this.keyword = searchText ?? ""
+      this.keywordType = "鏀舵鍗曠紪鍙�"
+      this.pagerOptions.currPage = 1
       this.getData()
     },
     getSelectArray(val) {
@@ -212,20 +239,46 @@
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style lang="scss" scoped>
-.receipt {
-  .top {
-    margin-bottom: 20px;
+.receipt{
+  height: 100%;
+  overflow: hidden;
+  .filter{
+    height: 80px;
+    display: flex;
+    align-items: center;
+    padding: 12px 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% - 92px);
+    .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;
       }
-    }
-  }
-  .detail-top {
-    display: flex;
-    .page {
-      margin-left: auto;
     }
   }
 }

--
Gitblit v1.8.0