368 lines
13 KiB
Vue
368 lines
13 KiB
Vue
<template>
|
|
<div>
|
|
<page-header-title :img-for-icon="IconImg"></page-header-title>
|
|
|
|
<a-card :bordered="false">
|
|
<!-- 查询区域-start -->
|
|
<div class="table-page-search-wrapper">
|
|
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
|
<a-row>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<a-form-item label="类型项目" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<j-dict-select-tag v-model="queryParam.projectType" placeholder="请选择类型项目"
|
|
dictCode="project_type"/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<a-form-item label="项目负责人" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<select-principal placeholder="请选择负责人" v-model="queryParam.principalId"></select-principal>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<a-form-item label="项目名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<a-input placeholder="请输入项目名称" v-model="queryParam.chargeProject"></a-input>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<a-form-item label="来款单位" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<a-input placeholder="请输入来款单位" v-model="queryParam.chargeCompanyTemporaryName"></a-input>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<a-form-item label="来款年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<j-year-date style="width:100%" placeholder="请选择来款年份" v-model="queryParam.paymentDate"></j-year-date>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<span class="table-page-search-submitButtons">
|
|
<a-button type="primary" icon="search" @click="searchQuery" v-has="'incomePaymentAndInvoiving:search'">查询</a-button>
|
|
<a-button icon="reload" @click="searchReset" class="reset-button">重置</a-button>
|
|
</span>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</div>
|
|
<!-- /查询区域-->
|
|
|
|
<!-- 操作按钮区域-->
|
|
<div class="table-operator">
|
|
<a-button type="primary" icon="export" @click="handleExportXls('到账开票')" v-has="'incomePaymentAndInvoiving:export'">导出</a-button>
|
|
<a-button type="primary" icon="file-text" @click="batchInvoicing" v-has="'incomePaymentAndInvoiving:batchInvoicing'">合并开票</a-button>
|
|
</div>
|
|
<!-- 操作按钮区域-end-->
|
|
|
|
<!-- table表格区域-->
|
|
<div>
|
|
<a-table
|
|
ref="table"
|
|
size="middle"
|
|
bordered
|
|
rowKey="id"
|
|
:columns="columns"
|
|
:scroll="{x: 1500}"
|
|
:dataSource="dataSource"
|
|
:pagination="ipagination"
|
|
:loading="loading"
|
|
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
|
@change="handleTableChange"
|
|
class="j-table-force-nowrap">
|
|
|
|
<!-- 项目名称-->
|
|
<template slot="projectName" slot-scope="text, record">
|
|
<j-ellipsis :value="text" :length="18" class="primary-color"
|
|
@click="openDetailModal(record)"></j-ellipsis>
|
|
</template>
|
|
|
|
<template slot="text" slot-scope="text">
|
|
<j-ellipsis :value="text" :length="18"></j-ellipsis>
|
|
</template>
|
|
|
|
<!-- 打包、需要发票、到账、开票、邮寄状态-->
|
|
<template slot="status" slot-scope="text,record">
|
|
<status-slot :statu-obj="record" :status-no="text" :status-type="true"></status-slot>
|
|
</template>
|
|
|
|
<!-- 开票-->
|
|
<template slot="status-bill" slot-scope="text,record">
|
|
<status-slot :statu-obj="record" :status-no="text" :status-type="true" status-key="bill"></status-slot>
|
|
</template>
|
|
|
|
<!-- 邮寄-->
|
|
<template slot="status-mail" slot-scope="text,record">
|
|
<status-slot :statu-obj="record" :status-no="text" :status-type="true" status-key="mail"></status-slot>
|
|
</template>
|
|
|
|
<template slot="status-pack" slot-scope="text,record">
|
|
<status-slot :statu-obj="record" :status-no="text"></status-slot>
|
|
</template>
|
|
|
|
<span slot="action" class="action-span-cell" slot-scope="text, record">
|
|
<a @click="incomePayment(record)" v-has="'incomePaymentAndInvoiving:incomePayment'">来款</a>
|
|
<a @click="invoicing(record)" :disabled="record.needInvoice === 0" v-has="'incomePaymentAndInvoiving:invoicing'">开票</a>
|
|
</span>
|
|
</a-table>
|
|
</div>
|
|
</a-card>
|
|
<!-- 来款阶段-->
|
|
<arrive-stage-module
|
|
ref="arriveStage"
|
|
@ok="modalFormOk"
|
|
:project-id="selectProjectId"
|
|
:project-type="selectProjectType"
|
|
:visible.sync="arriveVisible"></arrive-stage-module>
|
|
|
|
<!-- 开票阶段-->
|
|
<invoicing-stage-module
|
|
ref="invoicingStage"
|
|
@ok="modalFormOk"
|
|
:project-id="selectProjectId"
|
|
:project-type="selectProjectType"
|
|
:project-name="selectProjectName"
|
|
:visible.sync="invoicingVisible"
|
|
:mail-contacts-id="mailContactsId"
|
|
:charge-company-name="selectProjectChargeCompanyName"></invoicing-stage-module>
|
|
|
|
<!-- 批量开票-->
|
|
<batch-invoicing-module
|
|
:selected-data="selectedProject"
|
|
:selected-company="selectedCompany"
|
|
is-financial
|
|
@ok="modalFormOk"
|
|
:visible.sync="batchInvoicingVisible">
|
|
</batch-invoicing-module>
|
|
|
|
<project-detail-modal ref="projectDetail"></project-detail-modal>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import PageHeaderTitle from '../../../components/layouts/PageHeaderTitle'
|
|
import IconImg from '@/assets/imgs/icon/icon_financial.png'
|
|
import { JeroListMixin } from '../../../mixins/JeroListMixin'
|
|
import JYearDate from '../../../components/jero/JYearDate'
|
|
import StatusSlot from '../../../components/tools/StatusSlot'
|
|
import ArriveStageModule from './modules/ArriveStageModule'
|
|
import InvoicingStageModule from './modules/InvoicingStageModule'
|
|
import SelectPrincipal from '../../../components/company/SelectPrincipal'
|
|
import ProjectDetailModal from '../../../components/ProjectDetailModal'
|
|
import BatchInvoicingModule from '../../packManagement/modules/BatchInvoicingModule'
|
|
import { isAllEqual } from '../../../utils/util'
|
|
|
|
export default {
|
|
name: 'ArriveAndInvoivingList',
|
|
components: {
|
|
PageHeaderTitle,
|
|
JYearDate,
|
|
StatusSlot,
|
|
ArriveStageModule,
|
|
InvoicingStageModule,
|
|
SelectPrincipal,
|
|
ProjectDetailModal,
|
|
BatchInvoicingModule
|
|
},
|
|
mixins: [JeroListMixin],
|
|
data() {
|
|
return {
|
|
IconImg,
|
|
labelCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 5 }
|
|
},
|
|
wrapperCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 10 }
|
|
},
|
|
columns: [
|
|
{
|
|
title: '序号',
|
|
dataIndex: '',
|
|
key: 'rowIndex',
|
|
width: 60,
|
|
align: 'center',
|
|
customRender: function (t, r, index) {
|
|
return parseInt(index) + 1
|
|
}
|
|
}, {
|
|
title: '来款项目',
|
|
align: 'center',
|
|
width: 280,
|
|
dataIndex: 'chargeProject',
|
|
scopedSlots: { customRender: 'projectName' }
|
|
}, {
|
|
title: '来款用途',
|
|
align: 'center',
|
|
width: 180,
|
|
dataIndex: 'chargeUse_dictText',
|
|
scopedSlots: { customRender: 'text' }
|
|
}, {
|
|
title: '项目负责人',
|
|
align: 'center',
|
|
width: 140,
|
|
dataIndex: 'principalName',
|
|
scopedSlots: { customRender: 'text' }
|
|
}, {
|
|
title: '来款单位',
|
|
align: 'center',
|
|
width: 280,
|
|
dataIndex: 'chargeCompanyTemporaryName',
|
|
scopedSlots: { customRender: 'text' }
|
|
}, {
|
|
title: '应收金额',
|
|
align: 'center',
|
|
width: 120,
|
|
dataIndex: 'receivableAmount',
|
|
scopedSlots: { customRender: 'text' }
|
|
}, {
|
|
title: '实收金额',
|
|
align: 'center',
|
|
width: 100,
|
|
dataIndex: 'paidAmount',
|
|
scopedSlots: { customRender: 'text' }
|
|
}, {
|
|
title: '需要发票',
|
|
align: 'center',
|
|
width: 80,
|
|
dataIndex: 'needInvoice',
|
|
scopedSlots: { customRender: 'status-pack' }
|
|
}, {
|
|
title: '打包',
|
|
align: 'center',
|
|
width: 70,
|
|
dataIndex: 'pack',
|
|
scopedSlots: { customRender: 'status-pack' }
|
|
}, {
|
|
title: '到账',
|
|
align: 'center',
|
|
width: 70,
|
|
dataIndex: 'inAccount',
|
|
scopedSlots: { customRender: 'status' }
|
|
}, {
|
|
title: '开票',
|
|
align: 'center',
|
|
width: 70,
|
|
dataIndex: 'makeInvoice',
|
|
scopedSlots: { customRender: 'status-bill' }
|
|
}, {
|
|
title: '邮寄',
|
|
align: 'center',
|
|
width: 70,
|
|
dataIndex: 'mail',
|
|
scopedSlots: { customRender: 'status-mail' }
|
|
}, {
|
|
title: '操作',
|
|
dataIndex: 'action',
|
|
align: 'center',
|
|
fixed: 'right',
|
|
width: 160,
|
|
scopedSlots: { customRender: 'action' }
|
|
}
|
|
],
|
|
url: {
|
|
list: '/paymentRecord/payPaymentRecord/mainList',
|
|
exportXlsUrl: '/paymentRecord/payPaymentRecord/exportXls'
|
|
},
|
|
selectProjectId: null, // 选中项目id
|
|
selectProjectType: null, // 选中项目类型
|
|
selectProjectName: null, // 选中项目名称open
|
|
selectProjectChargeCompanyName: null, // 选中项目来款企业
|
|
invoicingVisible: false,
|
|
arriveVisible: false,
|
|
selectedProject: [],
|
|
batchInvoicingVisible: false,
|
|
selectedCompany: {}, // 选中项目的企业信息
|
|
mailContactsId: null, // 项目邮寄联系人id
|
|
}
|
|
},
|
|
methods: {
|
|
/**
|
|
* 来款
|
|
* @param record
|
|
*/
|
|
incomePayment(record) {
|
|
this.selectProjectType = record.projectType
|
|
this.selectProjectId = record.id
|
|
this.arriveVisible = true
|
|
},
|
|
/**
|
|
* 开票
|
|
* @param record
|
|
*/
|
|
invoicing(record) {
|
|
console.log(record)
|
|
this.mailContactsId = record.mailContactsId
|
|
this.selectProjectId = record.id
|
|
this.selectProjectType = record.projectType
|
|
this.selectProjectName = record.chargeProject
|
|
this.selectProjectChargeCompanyName = record.chargeCompanyTemporaryName
|
|
this.invoicingVisible = true
|
|
},
|
|
/**
|
|
* 批量开票
|
|
*/
|
|
batchInvoicing() {
|
|
this.selectedProject = []
|
|
if (this.selectedRowKeys.length === 0) {
|
|
this.$message.warn('请选择至少一个项目')
|
|
return
|
|
}
|
|
this.getProjectListBySelectedKeys(this.selectedRowKeys, 'invoic').then(res => {
|
|
this.selectedProject = res
|
|
this.batchInvoicingVisible = true
|
|
}).catch((message) => {
|
|
this.$message.warn(message)
|
|
}).finally(() => {
|
|
this.onClearSelected()
|
|
})
|
|
},
|
|
/**
|
|
* 通过选中项目id获取数据，并进行相应提示
|
|
* @param selectedKeys
|
|
* @param operateType
|
|
* @returns {Promise<unknown>}
|
|
*/
|
|
getProjectListBySelectedKeys(selectedKeys, operateType) {
|
|
return new Promise((resolve, reject) => {
|
|
let arr = []
|
|
// 获取选中的数据
|
|
arr = this.dataSource.filter(tt => selectedKeys.indexOf(tt.id) > -1)
|
|
// 开票
|
|
if (operateType === 'invoic') {
|
|
// 是否存在不需要发票的项目
|
|
if (arr.some(item => item.needInvoice === 0 || Number(item.receivableAmount) === 0)){
|
|
reject('存在不需要发票的项目！')
|
|
}
|
|
// 是否存在企业不同的项目
|
|
let companyArr = []
|
|
arr.forEach(item => {
|
|
companyArr.push(item.chargeCompanyTemporaryName)
|
|
})
|
|
// 选中项目非同一企业
|
|
if (!isAllEqual(companyArr)) {
|
|
reject('请选择来款单位为同一企业的项目合并开票！')
|
|
}
|
|
if (arr.some(item => item.invoiceAmount && Number(item.invoiceAmount) === Number(item.receivableAmount))) {
|
|
reject('存在已完成开票的项目！')
|
|
}
|
|
this.selectedCompany = {
|
|
id: arr[0].chargeCompanyId,
|
|
companyName: arr[0].chargeCompanyTemporaryName
|
|
}
|
|
}
|
|
// 来款
|
|
if (operateType === 'incomePayment') {
|
|
// 是否存在应收金额为0的项目
|
|
if (arr.some(item => Number(item.receivableAmount) === 0)) {
|
|
reject('存在应收金额为0的项目！')
|
|
}
|
|
}
|
|
resolve(arr)
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
@import '~@assets/less/common.less';
|
|
</style> |