You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

422 lines
13 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div>
<!-- 付款登记审核-->
<xy-dialog title="付款审核" :is-show.sync="isShow" type="form" class="payment-registration" :form="paymentRegistrationForm" :rules="paymentRegistrationRules" ref="paymentRegistration" @submit="editor">
<template v-slot:extraFormTop>
<div class="payment-registration-row">
<div class="payment-registration-row-title">受款单位</div>
<div class="payment-registration-row-content">{{contract.carry_department}}</div>
</div>
<div class="payment-registration-row">
<div class="payment-registration-row-title">合同名称</div>
<div class="payment-registration-row-content">{{contract.name}}</div>
</div>
<div class="payment-registration-row">
<div class="payment-registration-row-title">合同金额</div>
<div class="payment-registration-row-content">{{moneyFormat(contract.money)}} </div>
</div>
<div style="display: flex">
<div class="payment-registration-row">
<div class="payment-registration-row-title">已付金额</div>
<div class="payment-registration-row-content">{{totalMoney()}} </div>
</div>
<div class="payment-registration-row">
<div class="payment-registration-row-title">支付占比</div>
<div class="payment-registration-row-content">{{percentPay()}}%</div>
</div>
<div class="payment-registration-row">
<div class="payment-registration-row-title">已付笔数</div>
<div class="payment-registration-row-content">{{payment.length}}</div>
<div class="payment-registration-row-content" style="color: #ff0000;padding-left: 16px;cursor: pointer;">
<Poptip :transfer="true">
<div>点击查看列表</div>
<template v-slot:content>
<template v-if="payment&&payment.length>0">
<xy-table :height="200" :list="payment" :table-item="payTable">
<template v-slot:btns><p></p></template>
</xy-table>
</template>
<template v-else>
<div style="text-align: center">暂无已付笔数</div>
</template>
</template>
</Poptip>
</div>
</div>
</div>
</template>
<template v-slot:applyMoney>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>申请付款金额
</div>
<div class="xy-table-item-content xy-table-item-price">
<el-input readonly clearable placeholder="请填写付款金额" v-model="paymentRegistrationForm.applyMoney" style="width: 300px;"/>
</div>
</div>
</template>
<template v-slot:deductionMoney>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>本期扣款金额
</div>
<div class="xy-table-item-content xy-table-item-price">
<el-input readonly clearable placeholder="请填写扣款金额" v-model="paymentRegistrationForm.discountMoney" style="width: 300px;"/>
</div>
</div>
</template>
<template v-slot:type>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>款项类型
</div>
<div class="xy-table-item-content">
<!-- <el-input readonly clearable placeholder="选择款项类型或直接填写其他类型" v-model="paymentRegistrationForm.type" style="width: 300px;"/>-->
<el-select placeholder="选择款项类型或直接填写其他类型"
v-model="paymentRegistrationForm.type"
style="width: 200px;"
disabled
filterable
allow-create
clearable>
<el-option
v-for="item in paymentType"
:key="item"
:label="item"
:value="item">
</el-option>
</el-select>
</div>
</div>
</template>
<template v-slot:isLast>
<div class="xy-table-item">
<div class="xy-table-item-label" style="width: 200px;">
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>是否为预算内确定项目
</div>
<div class="xy-table-item-content">
<el-switch v-model="paymentRegistrationForm.isLast"/>
</div>
</div>
</template>
<template v-slot:actMoney>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>实际付款金额
</div>
<div class="xy-table-item-content xy-table-item-price">
<el-input placeholder="请填写实际付款金额" v-model="paymentRegistrationForm.actMoney" style="width: 300px;"/>
</div>
</div>
</template>
<template v-slot:moneyWay>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>资金列支渠道
</div>
<div class="xy-table-item-content">
<el-select multiple style="width: 300px;" v-model="paymentRegistrationForm.moneyWay" placeholder="请选择资金列支渠道">
<el-option v-for="item in planTypes" :value="item.id" :label="item.value"></el-option>
</el-select>
</div>
</div>
</template>
<template v-slot:extraFormBottom>
<Input search enter-button="搜 索" placeholder="搜索预算计划.." v-model="searchContent" @on-search="getBudgets"/>
<xy-table :list="plans" :show-index="false" :table-item="planTable" :height="310" style="margin-top: 10px;" ref="planTable" @select="selectPlan">
<template v-slot:btns>
<el-table-column label="使用金额" header-align="center">
<template slot-scope="scope">
<Input :value="scope.row.use_money" @input="inputMoney($event,scope.row)"/>
</template>
</el-table-column>
</template>
</xy-table>
<div style="display: flex;justify-content: flex-end;">
<Page :total="planTotal" show-elevator @on-change="pageChange"/>
</div>
</template>
</xy-dialog>
</div>
</template>
<script>
import {getparameter} from "@/api/system/dictionary"
import {getFundLog,detailFundLog,editorFundLog} from "@/api/paymentRegistration/fundLog"
import {getBudget} from "@/api/budget/budget";
import {detailContract} from "@/api/contract/contract";
import {Message} from "element-ui";
import {parseTime,moneyFormatter} from "@/utils";
export default {
data() {
return {
searchContent:"",
planTotal:0,
pageIndex:1,
//付款登记
plans:[],
contract:{},
payment:[],//合同关联的付款登记
planTypes:[],
payTable:[
{
label:'支付金额',
prop:'apply_money',
sortable:false,
align:'right'
},
{
label:'时间',
prop:'created_at',
sortable:false,
width:120,
formatter:(t1,t2,value)=>{
return parseTime(new Date(value),'{y}-{m}-{d}')
}
}
],
paymentType:["进度款","结算款","质保金"],
isShow:false,
registrationId:"",
paymentRegistrationForm:{
applyMoney:"",
deductionMoney:"",
type:"",
//isLast:false,
plan:[],
actMoney:'',
moneyWay:'',//资金列支渠道
},
paymentRegistrationRules:{
applyMoney:[
{required:true,message:"必填"},
{pattern:/^\d+(\.\d+)?$/, message: '必须为数字'}
],
deductionMoney:[
{required:true,message:"必填"},
{pattern:/^\d+(\.\d+)?$/, message: '必须为数字'}
],
type:[
{required:true,message:"必选"}
],
actMoney:[
{required:true,message:"必填"},
{pattern:/^\d+(\.\d+)?$/, message: '必须为数字'}
],
moneyWay:[
{required:true,message:"必填"}
]
},
planTable:[
{
sortable:false,
width:36,
type:'selection'
},
{
label:"分类",
prop:'type',
formatter: (cell, data, value) => {
let res = this.planTypes.filter(item => {
return item.id === value
})
return res[0]?.value || '未知'
}
},
{
label:"名称",
prop:'name',
align:'left'
},
{
label:"计划金额",
prop:'money',
align:'right'
}
],
}
},
methods: {
inputMoney(e,row){
row.use_money = e
this.paymentRegistrationForm.plan.forEach(item => {
if(item.plan_id == row.id){
item.use_money = e
}
})
},
async getPlanTypes(){
const res = await getparameter({number:'money_way'})
this.planTypes = res.detail
},
//翻页
pageChange(e){
this.pageIndex = e
this.getBudgets()
},
//合计金额
totalMoney(){
let total = 0.00
this.payment.map(item => {
total += Number(item.act_money)
})
return moneyFormatter(total)
},
//支付占比
percentPay(){
let total = this.totalMoney()
return ((total/this.contract.money)*100).toFixed(2) || 0
},
async getRegistration(id){
this.registrationId = id
const res = await detailFundLog({id})
this.paymentRegistrationForm.type = res.type
//this.paymentRegistrationForm.isLast = res.is_end === 1 ? true : false
this.paymentRegistrationForm.deductionMoney = res.apply_money
this.paymentRegistrationForm.applyMoney = res.apply_money
this.paymentRegistrationForm.plan = res.plan_link
this.paymentRegistrationForm.discountMoney = res.discount_money
await this.getContract(res.contract)
},
//获取合同信息
async getContract(info){
this.contract = info
const res = await getFundLog({contract_id:this.contract.id})
this.payment = res.data
this.toggleSelection(this.paymentRegistrationForm.plan.map(item => {
return item.plan_id
}))
},
//确认审核
editor(){
editorFundLog({
id:this.registrationId,
contract_id:this.contract.id,
act_money:this.paymentRegistrationForm.actMoney,
status:1,
money_way_id:this.paymentRegistrationForm.moneyWay.toString(),
contract_plan_links:this.paymentRegistrationForm.plan
}).then(res=>{
this.$emit('refresh')
this.isShow = false
Message({
type:'success',
message:'操作成功'
})
})
},
//计划
//获取预算计划
async getBudgets(){
let res = await getBudget({name:this.searchContent,page_size:10,page:this.plansPageIndex})
this.plans = res.list.data
this.planTotal = res.list.total
this.toggleSelection(this.paymentRegistrationForm.plan.map(item => {
return item.plan_id
}))
},
planPageChange(e){
this.plansPageIndex = e
this.getBudgets()
},
selectPlan(sel,row){
if(sel){
this.paymentRegistrationForm.plan = sel.map(item => {
return {
plan_id:item.id,
use_money:item.use_money,
new_money:item.money
}
})
}else{
this.paymentRegistrationForm.plan = []
}
},
//默认选择计划
toggleSelection(plans) {
if (plans) {
this.plans.filter(plan => {
if(plans.includes(plan.id)){
plan.use_money = this.paymentRegistrationForm.plan[plans.indexOf(plan.id)].use_money
return true
}
}).map(row => {
this.$refs.planTable.toggleRowSelection(row)
})
} else {
this.$refs.planTable.clearSelection()
}
},
},
computed:{
moneyFormat(){
return function (money){
return moneyFormatter(money)
}
}
},
watch:{
isShow(newVal){
if(!newVal){
this.paymentRegistrationForm.actMoney = ''
this.paymentRegistrationForm.moneyWay = ''
this.paymentRegistrationForm.plan = []
this.$refs.planTable.clearSelection()
}
}
},
async mounted() {
await this.getBudgets()
await this.getPlanTypes()
}
}
</script>
<style scoped lang="scss">
.payment-registration{
&-row{
display: flex;
padding: 6px 0;
&-title{
padding: 0 10px;
}
&-content{
}
}
}
.xy-table-item-label{
width: 140px;
}
.xy-table-item-price{
position: relative;
&::after{
z-index: 1;
position: absolute;
right: 0;
top: 0;
content:''
}
::v-deep .el-input__clear{
position: relative;
right: 30px;
z-index: 2;
}
}
</style>