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.
cz-hjjc-ht/src/views/contract/paymentRegistrationList cop...

519 lines
14 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 style="padding: 0 20px">
<lx-header
icon="md-apps"
text="付款登记"
style="margin-bottom: 10px; border: 0px; margin-top: 15px"
>
<div slot="content" />
<slot>
<span style="padding: 0 6px; word-break: keep-all">创建日期</span>
<span>
<DatePicker
:value="selectDate"
placeholder="请选择日期"
type="date"
placement="bottom-start"
style="width: 180px"
@on-change="(e) => (selectDate = e)"
/>
</span>
<span style="padding: 0 6px; word-break: keep-all">关键字</span>
<span>
<Input
v-model="keywords"
placeholder="请输入关键字"
style="width: 180px"
/>
</span>
<span style="padding: 0 6px; word-break: keep-all"> 状态 </span>
<Select
v-model="status"
clearable
placeholder="请选择"
style="width: 100px"
>
<Option
v-for="item in [
{ label: '待审核', value: 0 },
{ label: '已审核', value: 1 },
]"
:key="item.value"
:value="item.value"
>
{{ item.label }}
</Option>
</Select>
<Button
type="primary"
style="margin-left: 10px"
ghost
@click="
(contractId = ''),
(pageIndex = 1),
(keywords = ''),
(selectDate = '')
"
>重置</Button>
<Button
type="primary"
style="margin-left: 10px"
@click="getFundLogs(false)"
>查询</Button>
</slot>
</lx-header>
<xy-table :list="list" :table-item="table">
<template v-slot:btns>
<el-table-column
label="操作"
:fixed="$store.getters.device === 'mobile'?false:'right'"
width="300"
header-align="center"
>
<template slot-scope="scope">
<template v-if="scope.row.status === 0 && type === 1 && scope.row.fund_log_collect && scope.row.fund_log_collect.flow_links && scope.row.fund_log_collect.flow_links.length === 0">
<Poptip
placement="bottom"
confirm
:transfer="true"
title="确认要删除吗"
@on-ok="deleteFundLog(scope.row)"
>
<Button
size="small"
type="error"
style="margin-left: 10px; margin-bottom: 4px"
ghost
>删除</Button>
</Poptip>
<Button
size="small"
type="primary"
style="margin-left: 10px; margin-bottom: 4px"
@click="
$refs['detailPaymentRegistration'].getFundLog(scope.row.id),
($refs['detailPaymentRegistration'].isShow = true)
"
>编辑</Button>
</template>
<!-- <Button
v-if="false"
size="small"
type="primary"
style="margin-left: 10px; margin-bottom: 4px"
@click="
$refs['printRegistration'].getDetailFundLog(scope.row.id),
($refs['printRegistration'].isShow = true)
"
>打印</Button> -->
<!-- 申请金额是否为0 -->
<template v-if="authOa(scope.row) && scope.row.status===0">
<Poptip
v-if="parseFloat(scope.row.apply_money) === 0"
placement="bottom"
confirm
:transfer="true"
title="该申请付款金额为0,是否直接审核"
@on-ok="saveFundLog(scope.row)"
>
<Button
size="small"
type="primary"
style="margin-left: 10px; margin-bottom: 4px"
>
支付审批
</Button>
</Poptip>
<Button
v-else
size="small"
type="primary"
style="margin-left: 10px; margin-bottom: 4px"
@click="toOutPay(scope.row)"
>
支付审批
</Button>
</template>
<Button
v-if="scope.row.property && scope.row.property_type_id"
size="small"
type="primary"
style="margin-left: 10px; margin-bottom: 4px"
@click="toOutAsset(scope.row)"
>
资产申请
</Button>
<Button
v-if="
scope.row.fund_log_collect &&
scope.row.fund_log_collect.flow_links &&
scope.row.fund_log_collect.flow_links.find(i => i.tag === 'pay') &&
scope.row.fund_log_collect.flow_links.find(i => i.tag === 'pay').flow_status === 1
"
size="small"
type="primary"
style="margin-left: 10px; margin-bottom: 4px"
@click="toOaDetail(scope.row)"
>查看</Button>
</template>
</el-table-column>
</template>
</xy-table>
<div style="display: flex; justify-content: flex-end">
<Page
:total="total"
show-elevator
show-sizer
@on-change="pageChange"
@on-page-size-change="pageSizeChange"
/>
</div>
<printRegistration ref="printRegistration" />
<detailPaymentRegistration
ref="detailPaymentRegistration"
@success="getFundLogs"
/>
<!-- oa办理-->
<Modal
v-model="isShowOaModal"
:width="86"
class-name="oa-modal"
title="流程办理"
fullscreen
:mask-closable="false"
footer-hide
>
<div style="width: 100%;height: 100%;">
<iframe style="width: 100%;height: 100%;border-radius: 0 0 6px 6px;" :src="oaUrl" frameborder="0" />
</div>
</Modal>
</div>
</template>
<script>
import { detailContract } from '@/api/contract/contract'
// import { fundlogFlow, httpCurl } from '@/api/out'
import { getFundLog, delFundLog, editorFundLog } from '@/api/paymentRegistration/fundLog'
import { getCollect} from '@/api/paymentRegistration/collect'
import { parseTime } from '@/utils'
import { Message } from 'element-ui'
import { show } from '@/api/away'
import printRegistration from './components/printRegistration'
import detailPaymentRegistration from './components/detailPaymentRegistration'
import { getToken } from '@/utils/auth'
export default {
components: {
printRegistration,
detailPaymentRegistration
},
data() {
return {
isShowOaModal: false,
oaUrl: '',
selectDate: '',
keywords: '',
list: [],
contractId: '',
total: 0,
pageIndex: 1,
pageSize: 10,
is_auth: 1,
status: '',
table: [
{
label: '项目名称',
minWidth: 250,
prop: 'contract.name',
align: 'left',
// fixed: this.$store.getters.device === 'mobile' ? false : 'left',
customFn: row => {
return (<span>{ row.contract_id ? (row.contract ? row.contract.name : '') : row.away.title }</span>)
}
},
{
label: '付款申请金额(元)',
prop: 'apply_money',
align: 'right',
width: 180,
formatter: (v1, v2, value) => {
return Number(value)
.toFixed(2)
.replace(/(\d)(?=(\d{3})+\.)/g, '$1,')
}
},
{
label: '实际支付金额(元)',
prop: 'act_money',
align: 'right',
width: 180,
formatter: (v1, v2, value) => {
return Number(value)
.toFixed(2)
.replace(/(\d)(?=(\d{3})+\.)/g, '$1,')
}
},
{
label: '款项类型',
prop: 'type',
width: 120
},
{
label: '预算计划',
width: 330,
align: 'left',
customFn: (row) => {
if (row.plan_link && row.plan_link.length > 0) {
return row.plan_link.map((item) => {
return (
<div>
[{item.plan?.year}] {(item.plan && item.plan.pid_info) ? item.plan.pid_info.name : ''} - {item.plan?.name}
<br/>
[使用金额] {item.use_money}元{' '}
</div>
)
})
}
}
},
{
prop: 'status',
label: '审核状态',
width: 120,
formatter: (cell, data, value) => {
if (value === 0) return '待审核'
else return '已审核'
}
},
{
prop: 'fund_log_collect.flow_links',
label: '流程状态',
formatter: (cell, data, value) => {
const map = new Map([
[-1, '已退回'],
[0, '办理中'],
[1, '已完成']
])
return map.get(value?.find(i => i.tag === 'pay')?.flow_status)
}
},
{
label: '次数',
prop: 'pay_count',
width: 95,
customFn: row => {
return (<span>{ row.contract_id ? row.pay_count : row.pay_count_away }</span>)
}
},
{
label: '是否为最后一笔',
prop: 'is_end',
width: 145,
formatter: (cell, data, value) => {
return value === 1 ? '是' : '否'
}
},
{
label: '经办人',
minWidth: 160,
prop: 'admin.name',
align: 'center'
},
{
label: '业务科室',
minWidth: 160,
prop: 'department.name',
align: 'center'
},
{
label: '备注',
minWidth: 460,
prop: 'remark',
align: 'left'
},
{
label: '创建信息',
prop: 'created_at',
width: 160,
formatter: (cell, data, value) => {
return parseTime(new Date(value), '{y}-{m}-{d}')
}
}
]
}
},
computed: {
authOa() {
return function(row) {
return !row.fund_log_collect?.flow_links?.find(i => i.tag === 'pay')?.flow_id
}
}
},
watch: {
isShowOaModal(newVal) {
if (newVal) {
// Modal opened
} else {
this.oaUrl = ''
}
}
},
mounted() {
this.getFdCollect()
this.getFundLogs()
window.onfocus = () => {
this.getFundLogs(true)
}
},
destroyed() {
window.onfocus = null
},
created() {
const type = parseInt(this.$route.path.split('_')[1])
this.type = this.is_auth = type
},
methods: {
async toOaDetail(row) {
let url = `${process.env.VUE_APP_OUT_URL}/#/flow/detail?auth_token=${window.encodeURIComponent(getToken())}&isSinglePage=1&flow_id=`
const pay = row.fund_log_collect?.flow_links?.find(i => i.tag === 'pay')
// url += `&to=/flow/detail?flow_id=${caigou.id}`
url += pay?.flow_id
this.oaUrl = url
this.isShowOaModal = true
},
async toOutAsset(row) {
try {
const flow_id = JSON.parse(row.property_type_detail.remark).flow_id
const url = `${process.env.VUE_APP_OUT_OLD}/flow/create/${flow_id}?auth_token=${this.$store.getters.oa_token}`
window.open(
url,
'signProcess',
`top=${this.window.top},left=${this.window.left},width=${this.window.width},height=${this.window.height},location=0`
)
} catch (e) {
// ignore
}
},
saveFundLog(row) {
editorFundLog({
...row,
status: 1
}).then(res => {
this.getFundLogs()
})
},
async toOutPay(row) {
let payments = []
const actNumsTotal = () => {
return payments.reduce((pre, cur) => {
return pre + (Number(cur.act_money) ? Number(cur.act_money) : 0)
}, 0)
}
let contract
if (row.contract_id) {
contract = await detailContract({ id: row.contract_id })
} else {
contract = await show({ id: row.away_id })
}
payments =
(
await getFundLog({
contract_id: row.contract_id,
show_type: 1
})
)?.data || []
const baseInfo = {
'oaUrl': row?.contract?.number,
'zhifutitle': contract?.name,
out_pay_id: row?.id,
'xiangxishuoming': row?.remark,
'yifujine': actNumsTotal(),
'xiangmuzonge': contract.money,
'zhifucishu': contract?.sign_plan?.length,
'cishu': payments.length,
'amt': row?.apply_money,
'liezhiqudao': contract?.plans.map(i => i.name)?.toString(),
'contractno': contract?.number,
'guanlianliucheng': contract?.contract_flow_links?.map(i => i.flow_id)?.toString()
}
console.log(baseInfo)
const url = `${process.env.VUE_APP_OUT_OLD}/#/flow/create?auth_token=${window.encodeURIComponent(getToken())}&module_name=oa&isSinglePage=1&module_id=75&out_pay_id=${row.id}&default_json=${window.encodeURIComponent(JSON.stringify(baseInfo))}`
this.oaUrl = url
this.isShowOaModal = true
},
pageSizeChange(e) {
this.pageSize = e
this.pageIndex = 1
this.getFundLogs()
},
pageChange(e) {
this.pageIndex = e
this.getFundLogs()
},
async getFdCollect(){
const res = await getCollect({
})
},
async getFundLogs(noloading = false) {
// await fundlogFlow();
const res = await getFundLog({
page_size: this.pageSize,
page: this.pageIndex,
contract_id: this.contractId,
keyword: this.keywords,
date: this.selectDate,
is_auth: this.is_auth,
status: this.status,
show_type: 1
}, noloading)
this.list = res.data
this.total = res.total
},
deleteFundLog(row) {
delFundLog({
id: row.id
}).then((res) => {
Message({
type: 'success',
message: '操作成功'
})
this.getFundLogs()
})
}
}
}
</script>
<style scoped lang="scss"></style>
<style lang="scss">
.oa-modal {
.ivu-modal-body {
max-height: calc(100vh - 51px)!important;
padding: 0 !important;
overflow: hidden;
}
}
</style>