<template>
<div style="padding: 20px">
<el-card class="box-card">
<div slot="header" class="clearfix" style="font-size: 20px;">
{{$t('佣金付款单')}}
</div>
<el-form label-width="80px" label-position="left">
<el-row :gutter="30">
<el-col :span="7">
<el-form-item :label="$t('付款单号')">
<el-input :placeholder="$t('请输入付款单号')" v-model="queryParams.paymentNo"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('客户')">
<el-input :placeholder="$t('请输入客户')" v-model="queryParams.searchKey"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('状态')">
<dict-selector clearable :type="DICT_TYPE.ECW_PAYMENT_STATE" v-model="queryParams.state" />
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item :label="$t('业务员')">
<el-select v-model="queryParams.salesmanName" :placeholder="$t('请选择业务员')">
<el-option
v-for="item in creatorData"
:key="item.id"
:label="item.nickname"
:value="item.nickname"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="30">
<el-col :span="7">
<el-form-item :label="$t('创建时间')">
<el-date-picker
style="width:100%;"
v-model="selectDate"
type="datetimerange"
value-format="yyyy-MM-dd HH:mm:ss"
range-separator="至"
:start-placeholder="$t('开始日期')"
:end-placeholder="$t('结束日期')">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('发票状态')">
<el-select
clearable
v-model="queryParams.invoiceStatus"
:placeholder="$t('请选择是否开票')">
<el-option :label="$t('未开票')" value="0" />
<el-option :label="$t('已开票')" value="1" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('账单号')">
<el-input :placeholder="$t('请输入账单号')" v-model="queryParams.accountNumber"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-button size="mini" type="primary" @click="queryParams.page = 1;getList()">{{$t('查找')}}</el-button>
<el-button type="success" size="mini" @click="$router.push({path:'/financial/commission-requestFunds',query:{payableId:0}})" v-has-permi="['ecw:commission-Payment:add']" >{{$t('新增请款单')}}</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
<el-table border :data="list" style="margin-top: 30px">
<el-table-column align="center" type="index" :label="$t('序号')"></el-table-column>
<el-table-column align="center" prop="paymentNo" :label="$t('付款单号')">
<template v-slot="{row}">
<router-link :to="{path:'/financial/commission-requestFunds',query:{[[0].includes(row.state) ? 'id' : 'lookId' ]:row.id}}">{{row.paymentNo}} </router-link>
</template>
</el-table-column>
<el-table-column align="center" prop="customerName" :label="$t('客户')"></el-table-column>
<el-table-column align="center" :label="$t('创建时间')">
<template v-slot="{row}">
{{parseTime(row.createTime)}}
</template>
</el-table-column>
<el-table-column align="center" :label="$t('最后付款时间')">
<template v-slot="{row}">
{{parseTime(row.latestPayAt)}}
</template>
</el-table-column>
<el-table-column align="center" prop="invoiceStatus" :label="$t('发票')">
<template v-slot="{row}">
{{row.invoiceStatus ? $t('已开票') : $t('未开票')}}
</template>
</el-table-column>
<el-table-column align="center" :label="$t('状态')" prop="state" >
<template slot-scope="scope">
<dict-tag
:type="DICT_TYPE.ECW_PAYMENT_STATE"
:value="scope.row.state"
/>
<span v-if="[2,4,6].includes(scope.row.state) && scope.row.comment" :title="scope.row.comment"><i class="el-icon-question"></i></span>
</template>
</el-table-column>
<el-table-column :label="$t('操作')">
<template v-slot="{row}">
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:edit']" v-if="[0,2].includes(row.state)" @click="$router.push({path:'/financial/commission-requestFunds',query:{id:row.id}})" >{{$t('编辑')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:delete']" @click="deleteFn(row)" v-if="[0,2].includes(row.state)" > {{$t('删除')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:details']" v-if="[7,3,1,5].includes(row.state)" @click="$router.push({path:'/bpm/process-instance/detail',query:{id:row.bmpId}})" >{{$t('审核详情')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:Unapprove']" v-if="[1].includes(row.state)" @click="bridgeFn($t('取消审核'),7, row, $t('取消审核') )" >{{$t('取消审核')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:De-approval']" v-if="[4,].includes(row.state)" @click="bridgeFn($t('佣金付款单反审核'), 1, row, $t('提交反审核'),)" >{{$t('反审核')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:Write-off']" v-if="[4,].includes(row.state)" @click="bridgeFn($t('佣金付款单核销申请'), 2, row, $t('提交核销'))" >{{$t('核销')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:print']" v-if="[4,6].includes(row.state)" @click="$router.push({path:'/financial/printPaymentVoucherCommission',query:{id:row.id}})" >{{$t('打印')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:CancelWrite-off']" v-if="[6,].includes(row.state)" @click="bridgeFn($t('佣金付款单反核销申请'), 3, row, $t('提交反核销'))" >{{$t('反核销')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:CancelDe-approval']" v-if="[3].includes(row.state)" @click="bridgeFn($t('取消佣金付款单反审核'),4, row, $t('提交取消反审核') )" >{{$t('取消反审核')}}</el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:CancelWrite-off']" v-if="[5].includes(row.state)" @click="bridgeFn($t('取消佣金付款单核销'),5, row, $t('取消付款单核销') )" > {{$t('取消核销')}} </el-button>
<el-button type="text" size="mini" v-has-permi="['ecw:commission-Payment:CancelCancellingWrite-off']" v-if="[7].includes(row.state)" @click="bridgeFn($t('取消佣金付款单反核销'),6, row, $t('取消付款单反核销') )" > {{$t('取消反核销')}} </el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
/>
<!--对话框 审核 -->
<el-dialog @close="paymentValue = ''" width="30%" :title="paymentTitle" :visible.sync="paymentShow">
<div class="cancel_content">
<span>{{ $t('申请理由') }}</span>
<el-input type="textarea" :rows="6" v-model="paymentValue" :placeholder="[1,2,3].includes(paymentIndex) ? $t('请输入申请理由') : $t('请输入取消理由')"></el-input>
</div>
<span slot="footer" class="dialog-footers">
<el-button type="primary" @click="cancelWriteOffClick()">{{ $t(butTitle) }}</el-button>
<el-button @click="paymentShow = false; paymentValue = ''">{{ $t('取消') }}</el-button>
</span>
</el-dialog>
<!-- <commission-payment-details :id="6"></commission-payment-details>-->
</div>
</template>
<script>
import {listSimpleUsers} from "@/api/system/user";
import {
commissionPaymentCancelFinancePaymentApproval,
commissionPaymentCancelFinancePaymentApprovalNo,
commissionPaymentCancelFinancePaymentWriteOff,
commissionPaymentCancelFinancePaymentWriteOffNo,
commissionPaymentDelete,
commissionPaymentPage,
commissionPaymentVerification,
commissionPaymentVerificationCancel,
commissionPaymentVerifyCancel
} from "@/api/ecw/financial";
import {parseTime} from "../../../utils/ruoyi";
import Template from "@/views/cms/template/index.vue";
import commissionPaymentDetails from "@/views/ecw/financial/components/commissionPaymentDetails.vue";
export default {
name: "EcwFinancialCommission-payment",
components: {Template,commissionPaymentDetails},
activated(){
this.getList()
},
created() {
// 业务员
listSimpleUsers().then((res) => (this.creatorData = res.data));
this.getList();
},
watch:{
selectDate(val){
if(val !== null && val.length){
this.queryParams.beginCreateTime = val[0]
this.queryParams.endCreateTime = val[1]
}else {
this.queryParams.beginCreateTime = null;
this.queryParams.endCreateTime = null;
}
}
},
data(){
return {
queryParams:{
accountNumber:null,
invoiceStatus:null,
state:null,
salesmanName:null,
searchKey:null,
paymentNo:null,
beginCreateTime:null,
endCreateTime:null,
page:1,
rows:10,
},
selectDate:[],
creatorData:[],
list:[],
total:0,
paymentRow:{},
paymentIndex:0,
paymentTitle:'',
butTitle:'',
paymentShow:false,
paymentValue:''
}
},
methods:{
parseTime,
getList(){
commissionPaymentPage(this.queryParams).then(r => {
this.list = r.data.list
this.total = r.data.total
})
},
// 删除
deleteFn(row){
this.$confirm(this.$t('是否删除此条佣金付款单'), this.$t('提示'), {
confirmButtonText: this.$t('确定'),
cancelButtonText: this.$t('取消'),
type: 'warning'
}).then(() => {
commissionPaymentDelete({id:row.id}).then(r => {
this.$message({
type: 'success',
message:this.$t('删除成功!')
});
this.getList();
})
}).catch(() => {
this.$message({
type: 'info',
message: this.$t('已取消删除')
});
});
},
bridgeFn(title, index ,row, butTitle = '提交'){
this.paymentTitle = title;
this.butTitle = butTitle;
this.paymentIndex = index;
this.paymentRow = row;
this.paymentShow = true;
},
//提交
cancelWriteOffClick(){
if(!this.paymentValue) return this.$message.warning(this.$t('请输入理由！'))
let resolve = (val = '操作成功')=>{
this.getList();
this.paymentShow = false;
this.paymentValue = ''
this.$message.success(val);
}
let reject = ()=>{
this.paymentShow = false;
this.paymentValue = ''
}
let p = {
"paymentId": this.paymentRow.id,
"paymentNo": this.paymentRow.paymentNo,
"remark":this.paymentValue,
"reason":this.paymentValue
}
switch (this.paymentIndex){
case 1:
// 反审核佣金付款单
commissionPaymentVerifyCancel(p).then(()=>resolve(this.$t('提交佣金付款单反审核成功，请耐心等待审核结果!')), reject)
break;
case 2:
// 佣金付款单核销
commissionPaymentVerification(p).then(() =>resolve(this.$t('提交佣金付款单核销成功，请耐心等待审核结果!')), reject)
break;
case 3:
// 付款单反核销申请
commissionPaymentVerificationCancel(p).then(() =>resolve(this.$t('提交佣金付款单反核销申请成功，请耐心等待审核结果')), reject)
break;
case 4:
// 取消付款单反审核
commissionPaymentCancelFinancePaymentApprovalNo(p).then(() =>resolve(this.$t('取消佣金付款单反审核成功！')), reject)
break;
case 5:
// 取消付款单核销
commissionPaymentCancelFinancePaymentWriteOff(p).then(() =>resolve(this.$t('取消佣金付款单核销成功！')), reject)
break
case 6:
// 取消付款单反核销
commissionPaymentCancelFinancePaymentWriteOffNo(p).then(() =>resolve(this.$t('取消佣金付款单反核销成功！')), reject)
break;
case 7:
// 取消付款单审核
commissionPaymentCancelFinancePaymentApproval(p).then(() =>resolve(this.$t('取消佣金付款单审核成功！')), reject)
break;
}
}
}
}
</script>
<style scoped>
</style>