Kaynağa Gözat

付款接口对接

lilei 4 yıl önce
ebeveyn
işleme
ec48e266a1

+ 107 - 84
src/views/financialManagement/financialPayment/list.vue

@@ -1,8 +1,10 @@
 <template>
-  <a-card size="small" :bordered="false" class="financialPaymentList-wrap">
+  <a-card size="small" :bordered="false" class="finacialPay-wrap">
     <!-- 标签页 -->
-    <a-tabs type="card" @change="handleTabChange" class="financialPaymentList-tabs">
-      <a-tab-pane v-for="item in tabPaneData" :key="item.id" :tab="item.name"></a-tab-pane>
+    <a-tabs type="card" default-active-key="0" @change="handleTabChange" class="finacialPay-tabs">
+      <a-tab-pane v-for="item in tabPaneData" :key="item.bizType">
+        <span slot="tab">{{ item.bizName }}({{ item.countNum }})</span>
+      </a-tab-pane>
     </a-tabs>
     <!-- 搜索条件 -->
     <div class="table-page-search-wrapper">
@@ -10,41 +12,41 @@
         <a-row :gutter="15">
           <a-col :md="6" :sm="24">
             <a-form-item label="付款单号">
-              <a-input id="financialPaymentList-purchaseNo" v-model.trim="queryParam.purchaseNo" allowClear placeholder="请输入付款单号"/>
+              <a-input id="finacialPay-settleNo" v-model.trim="queryParam.settleNo" allowClear placeholder="请输入付款单号"/>
             </a-form-item>
           </a-col>
           <a-col :md="6" :sm="24">
             <a-form-item label="关联单号">
-              <a-input id="financialPaymentList-purchaseNo" v-model.trim="queryParam.purchaseNo" allowClear placeholder="请输入关联单号"/>
+              <a-input id="finacialPay-bizNo" v-model.trim="queryParam.bizNo" allowClear placeholder="请输入关联单号"/>
             </a-form-item>
           </a-col>
           <a-col :md="6" :sm="24">
             <a-form-item label="商户名称">
-              <a-input id="financialPaymentList-purchaseNo" v-model.trim="queryParam.purchaseNo" allowClear placeholder="请输入商户名称"/>
+              <a-input id="finacialPay-settleClientName" v-model.trim="queryParam.settleClientName" allowClear placeholder="请输入商户名称"/>
             </a-form-item>
           </a-col>
           <template v-if="advanced">
             <a-col :md="6" :sm="24">
               <a-form-item label="单据状态">
                 <v-select
-                  v-model="queryParam.billStatus"
-                  ref="billStatus"
-                  id="financialPaymentList-billStatus"
-                  code="PAYMENT_TYPE"
+                  v-model="queryParam.billState"
+                  ref="settleState"
+                  id="finacialPay-settleState"
+                  code="BILL_STATUS"
                   placeholder="请选择单据状态"
                   allowClear></v-select>
               </a-form-item>
             </a-col>
             <a-col :md="6" :sm="24">
               <a-form-item label="审核时间">
-                <a-range-picker v-model="queryParam.creatDate" id="financialPaymentList-creatDate"/>
+                <a-range-picker v-model="queryParam.auditDate" id="finacialPay-auditDate"/>
               </a-form-item>
             </a-col>
           </template>
           <a-col :md="6" :sm="24">
             <span class="table-page-search-submitButtons">
-              <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="financialPaymentList-refresh">查询</a-button>
-              <a-button style="margin-left: 8px" @click="resetSearchForm()" :disabled="disabled" id="financialPaymentList-reset">重置</a-button>
+              <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="finacialPay-refresh">查询</a-button>
+              <a-button style="margin-left: 8px" @click="resetSearchForm()" :disabled="disabled" id="finacialPay-reset">重置</a-button>
               <a @click="advanced=!advanced" style="margin-left: 8px">
                 {{ advanced ? '收起' : '展开' }}
                 <a-icon :type="advanced ? 'up' : 'down'"/>
@@ -59,7 +61,7 @@
       <div slot="message">共 <strong>6</strong> 条记录,付款金额合计 <strong>¥14</strong> ,其中已付 <strong>¥14</strong> ,未付 <strong>¥14</strong> </div>
     </a-alert>
     <div style="margin-bottom: 15px">
-      <a-button type="primary" id="financialPaymentList-export" :disabled="!hasSelected" :loading="loading" @click="handlePayment">
+      <a-button type="primary" id="finacialPay-export" :disabled="!hasSelected" :loading="loading" @click="handlePayment">
         批量付款
       </a-button>
       <span style="margin-left: 8px">
@@ -79,17 +81,16 @@
       :data="loadData"
       :scroll="{ x: 1280 }"
       bordered>
-      <!-- 结算单号 -->
-      <template slot="purchaseNo" slot-scope="text, record">
-        <span style="color: #ed1c24;cursor: pointer;" @click="handleDetail(record)">{{ record.purchaseNo }}</span>
-      </template>
-      <!-- 结算方式 -->
-      <template slot="sss" slot-scope="text, record">
-        <span>{{ record.state == 1 ? '现金' : '微信' }}</span>
-      </template>
       <!-- 操作 -->
       <template slot="action" slot-scope="text, record">
-        <a-button size="small" type="link" @click="handleVoucher(record)" id="financialPaymentList-voucher-btn">凭证</a-button>
+        <a-button size="small" type="link" v-if="record.settleState == 'FINISH'" @click="handleVoucher(record)" id="finacialPay-voucher-btn">凭证</a-button>
+        <a-button
+          size="small"
+          type="danger"
+          :loading="loading"
+          v-else
+          @click="handlePay(record)"
+          id="finacialPay-pay-btn">付款</a-button>
       </template>
     </s-table>
   </a-card>
@@ -97,26 +98,37 @@
 
 <script>
 import { STable, VSelect } from '@/components'
-// import { getRoleList, getServiceList } from '@/api/manage'
+import { settlePayQuery, queryByTypeSum, settlePayMoney, findPayDetail } from '@/api/settlePay.js'
+import moment from 'moment'
 export default {
   components: { STable, VSelect },
   data () {
     return {
       advanced: false, //  高级搜索 展开/关闭
       disabled: false, //  查询、重置按钮是否可操作
+      curBizType: '',
       // 查询参数
-      queryParam: {},
+      queryParam: {
+        bizType: 'ALL',
+        settleNo: '',
+        bizNo: '',
+        settleClientName: '',
+        billState: '',
+        auditDate: [],
+        auditBeginDate: '',
+        auditEndDate: ''
+      },
       // 表头
       columns: [
         { title: '序号', dataIndex: 'no', width: 80, align: 'center' },
-        { title: '付款单号', dataIndex: 'nos', width: 140, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '关联单号', dataIndex: 'name', width: 140, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '商户名称', dataIndex: 'pssayType', align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '付款金额', dataIndex: 'paddyType', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
-        { title: '付款类型', scopedSlots: { customRender: 'purchaseNo' }, width: 100, align: 'center' },
-        { title: '付款方式', dataIndex: 'totalP', width: 100, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '付款时间', dataIndex: 'creatDate', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '审核时间', dataIndex: 'payType', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '付款单号', dataIndex: 'settleNo', width: 140, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '关联单号', dataIndex: 'bizNo', width: 140, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '商户名称', dataIndex: 'settleClientName', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '付款金额', dataIndex: 'totalAmount', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '付款类型', dataIndex: 'bizName', width: 100, align: 'center' },
+        { title: '付款方式', dataIndex: 'settleStyleName', width: 100, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '付款时间', dataIndex: 'settleTime', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '审核时间', dataIndex: 'auditTime', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
         { title: '操作', scopedSlots: { customRender: 'action' }, width: 100, align: 'center', fixed: 'right' }
       ],
       selectedRowKeys: [], // Check here to configure the default column
@@ -124,44 +136,21 @@ export default {
       // 加载数据方法 必须为 Promise 对象
       loadData: parameter => {
         this.disabled = true
-        // return customerBundleDelayList( Object.assign(parameter, this.queryParam) ).then(res => {
-        //   const data = res.data
-        //   const no = (data.pageNo - 1) * data.pageSize
-        //   for (var i = 0; i < data.list.length; i++) {
-        //     data.list[i].no = no + i + 1
-        //   }
-        //   this.disabled = false
-        //   return data
-        // })
-        const _this = this
-        return new Promise(function (resolve, reject) {
-          const data = {
-            pageNo: 1,
-            pageSize: 10,
-            list: [
-              { id: '1', purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' }
-            ],
-            count: 10
-          }
+        if (this.queryParam.auditDate.length > 0) {
+          this.queryParam.auditBeginDate = moment(this.queryParam.auditDate[0]).format('YYYY-MM-DD HH:mm:ss')
+          this.queryParam.auditEndDate = moment(this.queryParam.auditDate[1]).format('YYYY-MM-DD HH:mm:ss')
+        }
+        return settlePayQuery(Object.assign(parameter, this.queryParam)).then(res => {
+          const data = res.data
           const no = (data.pageNo - 1) * data.pageSize
           for (var i = 0; i < data.list.length; i++) {
             data.list[i].no = no + i + 1
           }
-          _this.disabled = false
-          resolve(data)
+          this.disabled = false
+          return data
         })
       },
-      tabPaneData: [
-        { id: 1, name: '全部' },
-        { id: 2, name: '采购入库' },
-        { id: 3, name: '散件入库' },
-        { id: 4, name: '销售退货' },
-        { id: 5, name: '连锁调入' },
-        { id: 6, name: '急件' },
-        { id: 7, name: '费用' },
-        { id: 8, name: '资产' },
-        { id: 9, name: '盘点付款' }
-      ]
+      tabPaneData: []
     }
   },
   computed: {
@@ -172,56 +161,90 @@ export default {
       return {
         selectedRowKeys: this.selectedRowKeys,
         onChange: (selectedRowKeys, selectedRows) => {
-          console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows)
-          console.log('selectedRowKeys changed: ', selectedRowKeys)
           this.selectedRowKeys = selectedRowKeys
         },
         getCheckboxProps: record => ({
           props: {
-            disabled: record.name === 'Disabled User', // Column configuration not to be checked
-            name: record.name
+            disabled: record.settleState == 'FINISH'
           }
         })
       }
     }
   },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {
+      vm.queryByTypeSum()
+    })
+  },
   methods: {
+    // 获取类型
+    queryByTypeSum () {
+      queryByTypeSum({}).then(res => {
+        if (res.data && res.status == 200) {
+          this.tabPaneData = res.data
+          this.queryParam.bizType = res.data[0].bizType
+        }
+      })
+    },
     //  凭证
     handleVoucher (row) {
-
+      findPayDetail({ id: row.id }).then(res => {
+        console.log(res, '凭证')
+      })
+    },
+    // 付款
+    handlePay (row) {
+      this.loading = true
+      settlePayMoney({ id: row.id }).then(res => {
+        this.loading = false
+        this.$message.success(res.message)
+        if (res.status == 200) {
+          this.selectedRowKeys = []
+          this.$refs.table.refresh()
+        }
+      })
     },
-    //  tabs  change
+    // 选择类型
     handleTabChange (key) {
-      console.log(key)
+      this.queryParam.bizType = key
+      this.$refs.table.refresh(true)
+      this.curBizType = key
     },
     // 批量付款
     handlePayment () {
       this.loading = true
-      // ajax request after empty completing
-      setTimeout(() => {
+      settlePayMoney({ settleChangeIds: this.selectedRowKeys }).then(res => {
         this.loading = false
-        this.selectedRowKeys = []
-      }, 1000)
+        this.$message.success(res.message)
+        if (res.status == 200) {
+          this.selectedRowKeys = []
+          this.$refs.table.refresh()
+        }
+      })
     },
     //  重置
     resetSearchForm () {
-      this.queryParam.orderBundleNo = ''
-      this.queryParam.orderBundle.custMobile = ''
-      this.queryParam.bundleName = ''
-      this.queryParam.itemName = ''
-      this.oldTime = undefined
-      this.newTime = undefined
+      this.queryParam = {
+        bizType: this.curBizType,
+        settleNo: '',
+        bizNo: '',
+        settleClientName: '',
+        billState: '',
+        auditDate: [],
+        auditBeginDate: '',
+        auditEndDate: ''
+      }
       this.$refs.table.refresh(true)
     }
   }
 }
 </script>
 <style lang="less">
-  .financialPaymentList-wrap{
+  .finacialPay-wrap{
     .sTable{
       margin-top: 15px;
     }
-    .financialPaymentList-tabs{
+    .finacialPay-tabs{
       margin-bottom: 15px;
     }
   }