feat: 改版信用额度管理

src/api/finance/credit_list_v2.js

@@ -0,0 +1,17 @@
+import request, { postBlob } from '@/utils/request'
+
+export function getCreditList(data) {
+  return request({
+    url: `/credit/record/list/v2?moduleId=${data.moduleId}`,
+    method: 'post',
+    data
+  })
+}
+
+export function getCreditListExport(data, name) {
+  return postBlob({
+    url: '/credit/list/v2/export',
+    data,
+    name
+  })
+}

src/views/finance/credit_list.vue

@@ -1,130 +1,20 @@
 <template>
-  <div class="app-container">
-    <div v-if="showRecord">
-      <!-- 筛选条件 -->
-      <div>
-        <Collapse :screen-form="searchForm">
-          <template #right_btn>
-            <el-button size="mini" @click="clearFn">清空</el-button>
-            <el-button size="mini" type="primary" @click="searchFn">搜索</el-button>
-          </template>
-          <template #search>
-            <el-form ref="searchForm" :model="searchForm" label-width="100px" size="mini" label-position="left">
-              <el-row :gutter="20">
-                <el-col :xs="24" :sm="12" :lg="6">
-                  <el-form-item label="经销商名称" prop="customerId">
-                    <el-select class="selectStyle" v-model="searchForm.customerId" placeholder="请选择" filterable>
-                      <el-option v-for="v in customerList" :key="v.id" :label="v.name" :value="v.id"> </el-option>
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :lg="8">
-                    <el-form-item label="额度区间" style="margin-bottom: 0">
-                      <div class="fanwei">
-                        <el-form-item prop="minFreeAmount">
-                          <el-input v-model="searchForm.minFreeAmount" placeholder="最小可用信用额度" />
-                        </el-form-item>
-                        <span>-</span>
-                        <el-form-item prop="maxFreeAmount">
-                          <el-input v-model="searchForm.maxFreeAmount" placeholder="最大可用信用额度" />
-                        </el-form-item>
-                      </div>
-                    </el-form-item>
-                  </el-col>
-              </el-row>
-            </el-form>
-          </template>
-        </Collapse>
-      </div>
-      <!-- 按钮 -->
-      <div class="btn-group clearfix">
-        <div class="fr">
-          <ExportButton :exUrl="'wallet/customer/list/export'" :exParams="exParams" class="exportClass" />
-          <el-button type="primary" size="mini">打印</el-button>
-        </div>
-      </div>
-      <!-- 列表 -->
-      <div class="mymain-container">
-        <div class="table">
-          <el-table
-            v-loading="listLoading"
-            :data="dataList"
-            element-loading-text="Loading"
-            border
-            fit
-            highlight-current-row
-            stripe
-            show-summary
-            :summary-method="getSummaries"
-          >
-            <el-table-column label="序号" align="left" type="index" width="100" show-overflow-tooltip></el-table-column>
-            <el-table-column
-              align="left"
-              label="经销商编码"
-              prop="customerNumber"
-              min-width="160"
-              show-overflow-tooltip
-            >
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.customerNumber" />
-                <span>{{ scope.row.customerNumber }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column align="left" label="经销商名称" prop="customerName" min-width="160" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.customerName" />
-                <span>{{ scope.row.customerName }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column
-              align="left"
-              label="关联钱包"
-              prop="name"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-
-            <el-table-column align="right" label="总信用额度" prop="amount" min-width="160" show-overflow-tooltip>
-              <template slot-scope="scope">
-                {{ (scope.row.usedCreditAmount + scope.row.freeCreditAmount) | numToFixed }}
-              </template>
-            </el-table-column>
-            <el-table-column align="right" label="当前信用余额" prop="amount" min-width="160" show-overflow-tooltip>
-              <template slot-scope="scope">
-                {{ scope.row.freeCreditAmount | numToFixed }}
-              </template>
-            </el-table-column>
-            
-            <el-table-column align="center" label="操作" min-width="160" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <el-button
-                  type="text"
-                  class="textColor"
-                  v-if="$checkBtnRole('edit', $route.meta.roles)"
-                  @click="editFn(scope.row)"
-                  >设置额度</el-button
-                >
-                <el-button type="text" class="textColor" @click="recordFn(scope.row.customerWalletId)">记录</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-        </div>
-        <!-- 分页 -->
-        <div class="fr">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="listTotal"
-          >
-          </el-pagination>
-        </div>
-      </div>
+  <div style="width: 100%; height: 100%">
+    <template-page
+      v-if="showRecord"
+      ref="pageRef"
+      :operation="operation()"
+      :optionsEvensGroup="optionsEvensGroup"
+      :getList="getList"
+      :exportList="exportList"
+      :tableAttributes="tableAttributes"
+      :tableEvents="tableEvents"
+      :columnParsing="columnParsing"
+    >
+    </template-page>
+    <div class="app-container" v-else>
+      <CreditListDetail :recordsListId="recordsListId" />
     </div>
-    <CreditListDetail :recordsListId="recordsListId" v-else />
     <!-- 新增弹窗 -->
     <el-dialog
       title="经销商信用额度管理"
@@ -168,25 +58,18 @@
 </template>
 
 <script>
+import TemplatePage from '@/components/template/template-page-1.vue'
 import { getCreditListEdit, getWalletCustomerList, getCustomerList } from '@/api/finance/credit_list'
+import { getCreditList, getCreditListExport } from '@/api/finance/credit_list_v2'
 import CreditListDetail from './components/credit_list-detail'
 import { downloadFiles } from '@/utils/util'
 export default {
   components: {
-    CreditListDetail
+    CreditListDetail,
+    TemplatePage
   },
   data() {
     return {
-      currentPage: 1, // 当前页码
-      pageSize: 10, // 每页数量
-      listTotal: 0, // 列表总数
-      dataList: [], // 列表数据
-      searchForm: {
-        customerId: '',
-        minFreeAmount:'',
-        maxFreeAmount:''
-      }, //搜索表单
-      listLoading: false, // 列表加载loading
       showRecord: true,
       dialogForm: false, //弹窗表单
       addForm: {
@@ -197,7 +80,6 @@ export default {
       data: null,
       recordsListId: {}, //记录
       customerList: null,
-      isCollapse: true,
       rules: {
         startTime: [{ required: true, message: '请选择开始时间', trigger: 'blur' }],
         endTime: [{ required: true, message: '请选择结束时间', trigger: 'blur' }],
@@ -211,51 +93,63 @@ export default {
         ],
         customerId: [{ required: true, message: '请选择经销商', trigger: 'blur' }],
         customerWalletId: [{ required: true, message: '请选择钱包', trigger: 'blur' }]
-      }
-    }
-  },
-  computed: {
-    exParams() {
-      return {
-        customerId: this.searchForm.customerId,
-        type: 'COMMONLY'
-      }
+      },
+      optionsEvensGroup: [],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: false
+      },
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
+      recordSelected: []
     }
   },
   created() {
-    this.getDataList({
-      type: 'COMMONLY',
-      pageSize: this.pageSize,
-      pageNum: this.currentPage
-    })
     this.getCustomerData({ pageSize: -1, pageNum: 1 })
   },
   methods: {
-    //列表合计
-    getSummaries(param) {
-      const { columns, data } = param
-      const sums = []
-      columns.forEach((column, index) => {
-        if (index === 0) {
-          sums[index] = '合计'
-        }
-        if (index === 4) {
-          let map1 = data.map(v => {
-            return v.usedCreditAmount + v.freeCreditAmount
-          })
-          sums[index] = map1
-            .reduce((prev, curr) => {
-              const value = Number(curr)
-              if (!isNaN(value)) {
-                return prev + curr
-              } else {
-                return prev
-              }
-            }, 0)
-            .toFixed(2)
-        }
-      })
-      return sums
+    // 列表请求函数
+    getList: getCreditList,
+    // 列表导出函数
+    exportList: getCreditListExport,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {this.$checkBtnRole('edit', this.$route.meta.roles) ? (
+              <el-button
+                type="text"
+                class="textColor"
+                onClick={() => {
+                  this.editFn(row)
+                }}
+              >
+                设置额度
+              </el-button>
+            ) : null}
+            <el-button
+              type="text"
+              class="textColor"
+              onClick={() => {
+                this.recordFn(row.id)
+              }}
+            >
+              记录
+            </el-button>
+          </div>
+        )
+      }
     },
     //获取经销商列表
     async getCustomerData(data) {
@@ -271,40 +165,6 @@ export default {
       }
       this.dialogForm = true
     },
-    //清空
-    clearFn() {
-      this.$refs.searchForm.resetFields()
-      this.getCustomerData({ pageSize: -1, pageNum: 1 })
-
-    },
-    //搜索
-    searchFn() {
-      this.getDataList({
-        ...this.searchForm,
-        pageSize: this.pageSize,
-        pageNum: this.currentPage,
-        type: 'COMMONLY'
-      })
-    },
-    // 更改每页数量
-    handleSizeChange(val) {
-      this.pageSize = val
-      this.currentPage = 1
-      this.getDataList({ pageNum: 1, pageSize: this.pageSize })
-    },
-    // 更改当前页
-    handleCurrentChange(val) {
-      this.currentPage = val
-      this.getDataList({ pageNum: val, pageSize: 10 })
-    },
-    //列表数据
-    async getDataList(data) {
-      const res = await getWalletCustomerList(data)
-      // console.log(res);
-      this.dataList = res.data.records
-      this.listTotal = res.data.total
-    },
-
     //确定
     async addDataFn() {
       await this.$refs.addForm.validate()
@@ -324,7 +184,6 @@ export default {
     },
     //记录
     recordFn(id) {
-      console.log(id)
       this.recordsListId = id
       this.showRecord = false
     }
@@ -336,17 +195,4 @@ export default {
 .selectStyle {
   width: 100%;
 }
-.exportClass {
-  display: inline-block;
-  margin-right: 10px;
-}
-.fanwei {
-  display: flex;
-
-  span {
-    margin: 0 20px;
-    line-height: 28px;
-  }
-}
-
 </style>

src/views/supply/sales/sales_list.vue

@@ -482,7 +482,6 @@
     </div>
 
     <ExamineDialog :is-show.sync="isShowExamineDialog" :examine-form.sync="examineForm" />
-
     <SalesDetail v-if="isShowDetail" :list-item="queryItem" :edit="edit" @backListFormDetail="backList" />
     <SalesExamine v-if="isShowExamine" :list-item="queryItem" @backListFormExamine="backList" />
     <SalesReturnForm v-if="isShowReturnForm" :list-item="queryItem" @backListFormDetail="backList" />