|
@@ -1,53 +1,50 @@
|
|
|
<template>
|
|
|
<a-card size="small" :bordered="false" class="financialCollectionList-wrap">
|
|
|
<!-- 标签页 -->
|
|
|
- <a-tabs type="card" @change="handleTabChange" class="financialCollectionList-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="ALL" @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">
|
|
|
<a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
|
|
|
<a-row :gutter="15">
|
|
|
<a-col :md="6" :sm="24">
|
|
|
- <a-form-item label="收款单号">
|
|
|
- <a-input id="financialCollectionList-purchaseNo" v-model.trim="queryParam.purchaseNo" allowClear placeholder="请输入收款单号"/>
|
|
|
- </a-form-item>
|
|
|
+ <a-form-item label="收款单号"><a-input id="financialCollectionList-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="financialCollectionList-purchaseNo" v-model.trim="queryParam.purchaseNo" allowClear placeholder="请输入关联单号"/>
|
|
|
- </a-form-item>
|
|
|
+ <a-form-item label="关联单号"><a-input id="financialCollectionList-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="financialCollectionList-purchaseNo" v-model.trim="queryParam.purchaseNo" allowClear placeholder="请输入商户名称"/>
|
|
|
+ <a-input id="financialCollectionList-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="financialCollectionList-billStatus"
|
|
|
- code="PAYMENT_TYPE"
|
|
|
+ v-model="queryParam.billState"
|
|
|
+ ref="settleState"
|
|
|
+ id="financialCollectionList-settleState"
|
|
|
+ code="BILL_STATUS"
|
|
|
placeholder="请选择单据状态"
|
|
|
- allowClear></v-select>
|
|
|
+ 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="financialCollectionList-creatDate"/>
|
|
|
- </a-form-item>
|
|
|
+ <a-form-item label="审核时间"><a-range-picker v-model="queryParam.auditDate" id="financialCollectionList-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="financialCollectionList-refresh">查询</a-button>
|
|
|
<a-button style="margin-left: 8px" @click="resetSearchForm()" :disabled="disabled" id="financialCollectionList-reset">重置</a-button>
|
|
|
- <a @click="advanced=!advanced" style="margin-left: 8px">
|
|
|
+ <a @click="advanced = !advanced" style="margin-left: 8px">
|
|
|
{{ advanced ? '收起' : '展开' }}
|
|
|
- <a-icon :type="advanced ? 'up' : 'down'"/>
|
|
|
+ <a-icon :type="advanced ? 'up' : 'down'" />
|
|
|
</a>
|
|
|
</span>
|
|
|
</a-col>
|
|
@@ -56,12 +53,19 @@
|
|
|
</div>
|
|
|
<!-- alert -->
|
|
|
<a-alert type="info" showIcon style="margin-bottom:15px">
|
|
|
- <div slot="message">共 <strong>6</strong> 条记录,收款金额合计 <strong>¥14</strong> ,其中已收 <strong>¥14</strong> ,未收 <strong>¥14</strong> </div>
|
|
|
+ <div slot="message">
|
|
|
+ 共
|
|
|
+ <strong>{{ totalData.count }}</strong>
|
|
|
+ 条记录,收款金额合计
|
|
|
+ <strong>¥{{ totalData.totalAmount }}</strong>
|
|
|
+ ,其中已收
|
|
|
+ <strong>¥{{ totalData.settledAmount }}</strong>
|
|
|
+ ,未收
|
|
|
+ <strong>¥{{ totalData.unsettleAmount }}</strong>
|
|
|
+ </div>
|
|
|
</a-alert>
|
|
|
<div style="margin-bottom: 15px">
|
|
|
- <a-button type="primary" id="financialCollectionList-export" :disabled="!hasSelected" :loading="loading" @click="handleCollection">
|
|
|
- 批量收款
|
|
|
- </a-button>
|
|
|
+ <a-button type="primary" id="financialCollectionList-export" :disabled="!hasSelected" :loading="loading" @click="handleCollection">批量收款</a-button>
|
|
|
<span style="margin-left: 8px">
|
|
|
<template v-if="hasSelected">
|
|
|
{{ `已选 ${selectedRowKeys.length} 项` }}
|
|
@@ -74,49 +78,138 @@
|
|
|
ref="table"
|
|
|
size="default"
|
|
|
:row-selection="rowSelection"
|
|
|
- :rowKey="(record) => record.id"
|
|
|
+ :rowKey="record => record.id"
|
|
|
:columns="columns"
|
|
|
:data="loadData"
|
|
|
:scroll="{ x: 1290 }"
|
|
|
- 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>
|
|
|
+ bordered
|
|
|
+ >
|
|
|
<!-- 操作 -->
|
|
|
<template slot="action" slot-scope="text, record">
|
|
|
- <a-button size="small" type="link" @click="handleVoucher(record)" id="financialCollectionList-voucher-btn">凭证</a-button>
|
|
|
+ <a-button
|
|
|
+ size="small"
|
|
|
+ type="link"
|
|
|
+ v-if="record.settleState == 'FINISH'"
|
|
|
+ @click="handleVoucher(record)"
|
|
|
+ id="financialCollectionList-voucher-btn">凭证</a-button>
|
|
|
+ <a-button
|
|
|
+ size="small"
|
|
|
+ type="danger"
|
|
|
+ :loading="loading"
|
|
|
+ v-else
|
|
|
+ @click="handleCollectionSing(record)"
|
|
|
+ id="financialCollectionList-pay-btn">收款</a-button>
|
|
|
</template>
|
|
|
</s-table>
|
|
|
+ <!-- 详情 -->
|
|
|
+ <detail-modal :openModal="openModal" ref="detailModal" @close="openModal = false" />
|
|
|
</a-card>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { STable, VSelect } from '@/components'
|
|
|
-// import { getRoleList, getServiceList } from '@/api/manage'
|
|
|
+import detailModal from './detailModal.vue'
|
|
|
+import { settleReceiptQuery, queryByTypeSum, settleReceiptMoney, settleReceiptQuerySum } from '@/api/settleReceipt'
|
|
|
+import moment from 'moment'
|
|
|
export default {
|
|
|
- components: { STable, VSelect },
|
|
|
+ components: { STable, VSelect, detailModal },
|
|
|
data () {
|
|
|
return {
|
|
|
- advanced: false, // 高级搜索 展开/关闭
|
|
|
+ advanced: false, // 高级搜索 展开/关闭
|
|
|
disabled: false, // 查询、重置按钮是否可操作
|
|
|
+ openModal: false, // 详情弹框
|
|
|
// 查询参数
|
|
|
- queryParam: {},
|
|
|
+ queryParam: {
|
|
|
+ bizType: 'ALL',
|
|
|
+ settleNo: '',
|
|
|
+ bizNo: '',
|
|
|
+ settleClientName: '',
|
|
|
+ billState: '',
|
|
|
+ auditDate: [],
|
|
|
+ auditBeginDate: '',
|
|
|
+ auditEndDate: ''
|
|
|
+ },
|
|
|
+ // 总计
|
|
|
+ totalData: {
|
|
|
+ settledAmount: 0,
|
|
|
+ totalAmount: 0,
|
|
|
+ unsettleAmount: 0,
|
|
|
+ count: 0
|
|
|
+ },
|
|
|
// 表头
|
|
|
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: 'payType', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
- { title: '收款时间', dataIndex: 'creatDate', 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',
|
|
|
+ customRender: function (text) {
|
|
|
+ return text || '--'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ 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,104 +217,127 @@ 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 settleReceiptQuery(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
|
|
|
+ this.totalData.count = data.count
|
|
|
+ // 查询总计
|
|
|
+ this.settleReceiptQuerySum(Object.assign(parameter, this.queryParam))
|
|
|
+ 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: '营业外收入' },
|
|
|
- ]
|
|
|
+ tabPaneData: []
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
hasSelected () {
|
|
|
return this.selectedRowKeys.length > 0
|
|
|
},
|
|
|
- rowSelection() {
|
|
|
+ rowSelection () {
|
|
|
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: {
|
|
|
- // 凭证
|
|
|
- handleVoucher(row){
|
|
|
-
|
|
|
+ // 总计
|
|
|
+ settleReceiptQuerySum (params) {
|
|
|
+ settleReceiptQuerySum(params).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ if (res.status == 200) {
|
|
|
+ this.totalData = Object.assign(this.totalData, res.data)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取类型
|
|
|
+ queryByTypeSum () {
|
|
|
+ queryByTypeSum({}).then(res => {
|
|
|
+ if (res.data && res.status == 200) {
|
|
|
+ this.tabPaneData = res.data
|
|
|
+ this.queryParam.bizType = res.data[0].bizType
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- // tabs change
|
|
|
- handleTabChange(key){
|
|
|
- console.log(key)
|
|
|
+ // 凭证弹框
|
|
|
+ handleVoucher (row) {
|
|
|
+ this.$refs.detailModal.getDetail(row.id)
|
|
|
+ this.openModal = true
|
|
|
+ },
|
|
|
+ // 收款
|
|
|
+ handleCollectionSing (row) {
|
|
|
+ this.loading = true
|
|
|
+ settleReceiptMoney({ id: row.id }).then(res => {
|
|
|
+ this.loading = false
|
|
|
+ this.$message.success(res.message)
|
|
|
+ if (res.status == 200) {
|
|
|
+ this.selectedRowKeys = []
|
|
|
+ this.$refs.table.refresh()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 选择类型
|
|
|
+ handleTabChange (key) {
|
|
|
+ this.queryParam.bizType = key
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
+ this.curBizType = key
|
|
|
},
|
|
|
// 批量收款
|
|
|
handleCollection () {
|
|
|
this.loading = true
|
|
|
- // ajax request after empty completing
|
|
|
- setTimeout(() => {
|
|
|
+ settleReceiptMoney({ 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">
|
|
|
- .financialCollectionList-wrap{
|
|
|
- .sTable{
|
|
|
- margin-top: 15px;
|
|
|
- }
|
|
|
- .financialCollectionList-tabs{
|
|
|
- margin-bottom: 15px;
|
|
|
- }
|
|
|
+.financialCollectionList-wrap {
|
|
|
+ .sTable {
|
|
|
+ margin-top: 15px;
|
|
|
}
|
|
|
-</style>
|
|
|
+ .financialCollectionList-tabs {
|
|
|
+ margin-bottom: 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|