From bca479d1713a6cb914711578251951522c0d1a2d Mon Sep 17 00:00:00 2001
From: yangfeng <wanwan926_4@163.com>
Date: 星期三, 11 十月 2023 17:36:12 +0800
Subject: [PATCH] 收款计划、销售发票样式调整及公共组件no-product清空下行高调整

---
 src/views/other/payment/collectionPlan/index.vue |  134 ++++++++++++++++++++++++++++++--------------
 1 files changed, 92 insertions(+), 42 deletions(-)

diff --git a/src/views/other/payment/collectionPlan/index.vue b/src/views/other/payment/collectionPlan/index.vue
index 4f5ffa8..b118f45 100644
--- a/src/views/other/payment/collectionPlan/index.vue
+++ b/src/views/other/payment/collectionPlan/index.vue
@@ -2,37 +2,44 @@
   <div class="collectionPlan">
     <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
+          ref="searchCommonView"
+          :query-class-options="queryClassOptions"
+          :search-options="searchOptions"
+          :search-sel="searchSel"
+          @searchClick="searchClick"
+          @resetClick="resetClick"
+        >
+          <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">
+    <div class="body">
+      <div class="body-card">
+        <div class="list-view">
+          <TableCommonView
+            ref="tableListRef"
+            v-loading="loading"
+            :table-list="tableList"
+            @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>
+          </TableCommonView>
+        </div>
+      </div>
+    </div>
     <!-- 鏂板缓/缂栬緫 -->
     <AddCollectionPlan v-if="editConfig.visible" :edit-common-config="editConfig" />
   </div>
@@ -107,7 +114,18 @@
         label: ""
       },
       search_map: {},
-      serviceContractId: 0
+      serviceContractId: 0,
+      tableColumn: [
+        { label: "鏀舵璁″垝缂栧彿", prop: "number", default: true },
+        { label: "瀹㈡埛鍚嶇О", prop: "client_name" },
+        { label: "鏈熸", prop: "term" },
+        { label: "璁″垝鏀舵鏃ユ湡", prop: "collectionDate" },
+        { label: "閲戦", prop: "amount" },
+        { label: "宸叉敹閲戦", prop: "amountReceived" },
+        { label: "搴旀敹閲戦", prop: "amountReceivable" },
+        { label: "璐熻矗浜�", prop: "member_name" }
+      ],
+      showCol: ["鏀舵璁″垝缂栧彿", "瀹㈡埛鍚嶇О", "鏈熸", "璁″垝鏀舵鏃ユ湡", "閲戦", "宸叉敹閲戦", "搴旀敹閲戦", "璐熻矗浜�"]
     }
   },
   created() {
@@ -118,29 +136,35 @@
     } else {
       this.serviceContractId = this.addConfig.id
     }
-    this.getData()
+    // this.getData()
   },
   methods: {
     setTable() {
       this.tableList = {
         tableInfomation: [],
-        tableColumn: [
-          { label: "鏀舵璁″垝缂栧彿", prop: "number" },
-          { label: "瀹㈡埛鍚嶇О", prop: "client_name" },
-          { label: "鏈熸", prop: "term" },
-          { label: "璁″垝鏀舵鏃ユ湡", prop: "collectionDate" },
-          { label: "閲戦", prop: "amount" },
-          { label: "宸叉敹閲戦", prop: "amountReceived" },
-          { label: "搴旀敹閲戦", prop: "amountReceivable" },
-          { label: "璐熻矗浜�", prop: "member_name" }
-        ]
+        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() {
@@ -215,19 +239,45 @@
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style lang="scss" scoped>
 .collectionPlan {
-  .top {
-    margin-bottom: 20px;
+  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