<template>
|
<basicContainer>
|
<avue-crud :option="option" :table-loading="pageF.loading" :data="tableData" :page="page"
|
:permission="permissionList" :before-open="beforeOpen" v-model="form" v-model:search="queryParams" ref="crudRef"
|
@row-update="rowUpdate" @row-save="rowSave" @refresh-change="refreshChange" @row-del="rowDel"
|
@search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
|
@current-change="currentChange" @size-change="sizeChange" @on-load="onLoad">
|
<template #menu-left>
|
<!-- <el-button-->
|
<!-- type="success"-->
|
<!-- icon="Edit"-->
|
<!-- :disabled="pageF.single"-->
|
<!-- v-hasPermi="['tms:tmsApBill:edit']"-->
|
<!-- @click="handleUpdate">修改-->
|
<!-- </el-button>-->
|
<!-- <el-button-->
|
<!-- type="danger"-->
|
<!-- icon="Delete"-->
|
<!-- :disabled="pageF.multiple"-->
|
<!-- @click="handleDelete"-->
|
<!-- v-hasPermi="['tms:tmsApBill:remove']"-->
|
<!-- >删除-->
|
<!-- </el-button>-->
|
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['tms:tmsApBill:export']">导出
|
</el-button>
|
</template>
|
<template #menu="{ row }">
|
<!-- <el-link size="small" type="primary" v-if="row.status != 2"
|
@click="handleJs(row)" class="link-btn" :underline="false"
|
icon="el-icon-tickets">结算
|
</el-link> -->
|
<el-link size="small" type="primary" v-if="row.pushStatus == 3 || row.pushStatus == 4|| row.pushStatus == 0"
|
@click="handleManualPush(row)" class="link-btn" underline="never" icon="el-icon-upload">手动推送
|
</el-link>
|
<el-link size="small" type="primary" v-if="row.status == 0" @click="handleEdit(row)" class="link-btn"
|
:underline="false" icon="el-icon-edit">账单确认
|
</el-link>
|
<el-link size="small" type="primary" @click="handleView(row)" class="link-btn" :underline="false"
|
icon="el-icon-view">查看
|
</el-link>
|
<!-- <el-link size="small" type="primary" @click="handleLog(row)" class="link-btn" :underline="false"
|
icon="el-icon-tickets">日志
|
</el-link> -->
|
|
<el-link size="small" type="primary" @click="handleFlow(row)" class="link-btn" underline="never"
|
icon="el-icon-document">
|
审核日志
|
</el-link>
|
</template>
|
</avue-crud>
|
|
<el-dialog :title="pageF.title" v-model="pageF.open" class="avue-dialog avue-dialog--top" width="80%">
|
|
<avue-form v-if="opt == 'js'" v-model="boxForm" ref="boxFormRef" :option="boxFormOption">
|
<template #settleAmount>
|
<avue-input-number :min="0" :max="form.actualSettlementAmount" v-model="boxForm.settleAmount"
|
placeholder="请输入结算金额"></avue-input-number>
|
|
</template>
|
</avue-form>
|
<el-descriptions :column="3" title="账单基本信息" border>
|
<el-descriptions-item label="账单系统编号">{{ form.systemNo }}</el-descriptions-item>
|
<el-descriptions-item label="账单名称">
|
<div v-if="opt === 'edit'">
|
<el-input v-model="form.billName" placeholder="请输入账单名称" />
|
</div>
|
<div v-else>{{ form.billName }}</div>
|
</el-descriptions-item>
|
<el-descriptions-item label="客户名称">{{ form.customerName }}</el-descriptions-item>
|
<el-descriptions-item label="应结算金额">{{ form.settleAmount }}</el-descriptions-item>
|
<el-descriptions-item label="减免金额">
|
<div v-if="opt === 'edit'">
|
<el-input-number :max="form.settleAmount" v-model="form.deductionAmount" placeholder="请输入减免金额"
|
@change="deductionAmountChange" />
|
</div>
|
<div v-else>{{ form.deductionAmount }}</div>
|
</el-descriptions-item>
|
<el-descriptions-item label="实际结算金额" v-if="opt == 'edit'">{{ form.actualSettlementAmount }}</el-descriptions-item>
|
<el-descriptions-item label="减免原因" v-if="opt == 'edit'">
|
<div v-if="opt === 'edit'">
|
<el-input v-model="form.reasonReduction" placeholder="请输入减免原因" />
|
</div>
|
<div v-else>{{ form.reasonReduction }}</div>
|
</el-descriptions-item>
|
<el-descriptions-item label="已结算金额" v-if="opt == 'js'">{{ form.settledAmount }}</el-descriptions-item>
|
<el-descriptions-item label="待结算金额" v-if="opt == 'js'">{{ Number(form.settleAmount) -
|
Number(form.settledAmount)}}</el-descriptions-item>
|
</el-descriptions>
|
<h3>关联明细</h3>
|
<avue-crud :option="YSGenerateTableOption" ref="itemsTableRef" :data="form.items">
|
<template #menu="{ row }">
|
<el-link size="small" type="primary" @click="handleCancel(row)" class="link-btn" :underline="false"
|
icon="el-icon-close">取消关联
|
</el-link>
|
</template>
|
|
</avue-crud>
|
|
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button type="primary" :loading="pageF.isUploading" v-if="opt == 'js'" @click="jsSubmit">确定</el-button>
|
<el-button type="primary" :loading="pageF.isUploading" v-if="opt == 'edit'" @click="editSubmit">确定</el-button>
|
<el-button @click="pageF.open = false">取 消</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
<el-dialog :title="pageF.title" v-model="open2" class="avue-dialog avue-dialog--top" width="80%">
|
|
<avue-crud :option="logTableOption" ref="itemsTableRef2" :data="logTable">
|
|
</avue-crud>
|
|
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="open2 = false">取 消</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
|
|
</basicContainer>
|
<flowLogA ref="flowLogIshow" :isShow="true" title="审核日志" :flowParams="flowParams"></flowLogA>
|
</template>
|
|
<script setup name="tmsApBill" lang="ts">
|
import {
|
TmsApBillI,
|
addTmsApBill,
|
delTmsApBill,
|
exportTmsApBill,
|
getTmsApBill,
|
listTmsApBill,
|
updateTmsApBill, manualPushTmsApBill,getPayableAuditLog
|
} from "@/api/tms/tmsApBill";
|
import useCurrentInstance from "@/utils/useCurrentInstance";
|
import { computed, reactive, ref, toRefs } from "vue";
|
import { PagesInterface, PageQueryInterface } from "@/utils/globalInterface";
|
import { usePagePlus } from "@/hooks/usePagePlus";
|
import { hasPermission } from "@/utils/permissionUtils";
|
import { cancelArBill, getTmsArBill } from "@/api/tms/tmsArBill";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
|
const { proxy } = useCurrentInstance();
|
const crudRef = ref();
|
|
const permissionList = computed(() => {
|
return {
|
addBtn: hasPermission(["tms:tmsApBill:add"]),
|
delBtn: hasPermission(["tms:tmsApBill:remove"]),
|
editBtn: hasPermission(["tms:tmsApBill:edit"]),
|
viewBtn: hasPermission(["tms:tmsApBill:query"]),
|
}
|
})
|
|
const data = reactive({
|
form: <TmsApBillI>{},
|
queryParams: <TmsApBillI & PageQueryInterface>{},
|
page: <PagesInterface>{
|
pageSize: 10,
|
total: 0,
|
currentPage: 1,
|
},
|
selectionList: [],
|
opt: '',
|
boxForm: <any>{},
|
open2: false
|
})
|
const { queryParams, form, page, selectionList, opt, boxForm, open2 } = toRefs(data);
|
const option = ref({
|
pageKey: 'TmsApBill',
|
rowKey: 'id',
|
viewBtn: false,
|
addBtn: false,
|
editBtn: false,
|
delBtn: false,
|
searchLabelWidth: 120,
|
column: {
|
// id: {
|
// label: '',
|
// addDisplay: true,
|
// editDisplay: false,
|
// viewDisplay: false,
|
// hide: true,
|
// search: false,
|
// },
|
systemNo: {
|
label: '系统编号',
|
hide: false, minWidth: 150,
|
search: true,
|
},
|
billName: {
|
label: '账单名称',
|
hide: false,
|
search: true, minWidth: 220,
|
showOverflowTooltip: true
|
},
|
serviceProviderName: {
|
label: '供应商名称',
|
hide: false,
|
search: true, minWidth: 220,
|
showOverflowTooltip: true
|
|
},
|
dispatchCount: {
|
label: '调度单数量',
|
hide: false,
|
search: false, minWidth: 120,
|
},
|
settleAmount: {
|
label: '应结算金额', minWidth: 120,
|
hide: false,
|
search: false,
|
},
|
deductionAmount: {
|
label: '减免金额', minWidth: 120,
|
hide: false,
|
search: false,
|
},
|
actualSettlementAmount: {
|
label: '实际结算金额',
|
hide: false,
|
search: false, minWidth: 120,
|
},
|
settledAmount: {
|
label: '已结算金额',
|
hide: false,
|
search: false, minWidth: 120,
|
},
|
pushTime: {
|
label: '推送时间', display: false, searchRange: true, type: 'date',
|
format: 'YYYY-MM-DD', hide: false, searchSpan: 6, minWidth: 150,
|
valueFormat: 'YYYY-MM-DD',
|
},
|
invoiceStatus: {
|
label: '开票状态', minWidth: 120, fixed: 'right',
|
type: 'radio', dataType: 'string', dicUrl: '/system/dict/data/type/invoice_status',
|
|
hide: false,
|
search: true,
|
},
|
status: {
|
label: '状态', minWidth: 120, fixed: 'right',
|
type: 'radio', dataType: 'string', dicUrl: '/system/dict/data/type/ar_bill_status',
|
|
hide: false,
|
search: true,
|
},
|
pushStatus: {
|
label: '推送状态',
|
minWidth: 120,
|
type: 'radio', dataType: 'string', dicUrl: '/system/dict/data/type/sys_push_status',
|
hide: false,
|
search: true,
|
fixed: 'right'
|
}
|
|
}
|
})
|
|
const {
|
tableData,
|
pageF,
|
rowSave,
|
rowUpdate,
|
rowDel,
|
beforeOpen,
|
searchChange,
|
searchReset,
|
selectionChange,
|
onLoad,
|
currentChange,
|
sizeChange,
|
handleDelete,
|
handleExport,
|
handleUpdate,
|
refreshChange
|
} = usePagePlus({
|
form: form,
|
option: option,
|
queryParams: queryParams,
|
idKey: 'id',
|
page: page.value,
|
getListApi: listTmsApBill,
|
getDetailApi: getTmsApBill,
|
exportApi: exportTmsApBill,
|
deleteApi: delTmsApBill,
|
addApi: addTmsApBill,
|
updateApi: updateTmsApBill,
|
handleUpdateFunc: () => {
|
crudRef.value.rowEdit(selectionList.value[0]);
|
},
|
handleSelectionChangeFunc: (selection: any) => {
|
selectionList.value = selection;
|
}
|
})
|
|
const YSGenerateTableOption = ref({
|
menu: true,
|
add: false,
|
header: false,
|
selection: false,
|
rowKey: 'id',
|
editBtn: false,
|
viewBtn: false,
|
delBtn: false,
|
column: {
|
|
projectName: {
|
label: '项目名称',
|
},
|
dispatchNo: {
|
label: '调度单号',
|
},
|
orderTime: {
|
label: '下单时间',
|
},
|
|
estimateAmount: {
|
label: '预估应收金额',
|
},
|
currency: {
|
label: '币制',
|
}
|
}
|
})
|
|
|
const boxFormOption = ref({
|
menuBtn: false,
|
labelWidth: 120,
|
column: {
|
|
settleAmount: {
|
label: '本次结算金额',
|
type: 'number',
|
display: true,
|
rules: [
|
{
|
required: true,
|
message: "金额不能为空", trigger: "change"
|
}
|
],
|
},
|
remark: {
|
label: '备注',
|
display: true,
|
},
|
attachment: {
|
label: '附件',
|
display: true,
|
span: 24,
|
accept: 'string', dataType: 'string',
|
type: 'upload',
|
action: '/common/upload2',
|
},
|
|
}
|
})
|
const boxFormRef = ref();
|
const logTableOption = ref({
|
menu: false,
|
add: false,
|
header: false,
|
selection: false,
|
rowKey: 'id',
|
|
column: {
|
|
settleAmount: {
|
label: '结算金额',
|
},
|
createBy: {
|
label: '处理人员',
|
},
|
attachment: {
|
label: '附件下载',
|
dataType: 'string',
|
type: 'img'
|
},
|
|
remark: {
|
label: '备注',
|
},
|
createTime: {
|
label: '提交时间',
|
},
|
}
|
})
|
const logTable = ref<any>()
|
|
const handleJs = (row: any) => {
|
|
}
|
|
const handleView = (row: any) => {
|
form.value.items = [];
|
getTmsApBill(row.id).then((res: any) => {
|
form.value = res.data || {};
|
pageF.open = true;
|
pageF.title = '应付账单确认';
|
opt.value = 'edit'
|
})
|
}
|
const handleLog = (row: any) => {
|
|
}
|
const handleEdit = (row: any) => {
|
form.value.items = [];
|
getTmsApBill(row.id).then((res: any) => {
|
form.value = res.data || {};
|
pageF.open = true;
|
pageF.title = '应付账单确认';
|
opt.value = 'edit'
|
})
|
}
|
|
const jsSubmit = () => {
|
|
}
|
|
const editSubmit = () => {
|
|
}
|
const deductionAmountChange = (e: any) => {
|
form.value.actualSettlementAmount = (Number(form.value.settleAmount) || 0) - (Number(form.value.deductionAmount) || 0);
|
}
|
const handleCancel = (row: any) => {
|
ElMessageBox.confirm("是否对调度单号" + row.dispatchNo + "的应付费用取消关联？", '系统提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
return cancelArBill(row.id);
|
}).then(() => {
|
onLoad(page.value);
|
ElMessage({
|
message: "操作成功！",
|
type: 'success'
|
})
|
});
|
}
|
const handleManualPush = (row: any) => {
|
ElMessageBox.confirm(`确定要将账单【${row.billName}】手动推送到财务系统吗？`, '系统提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'info'
|
}).then(() => {
|
// 调用推送接口
|
return manualPushTmsApBill(row.id);
|
}).then((res) => {
|
proxy.$message.success(res.msg);
|
onLoad(page.value); // 刷新列表
|
}).catch(() => {
|
// 取消操作
|
});
|
}
|
|
const flowLogIshow = ref()
|
const flowParams = ref([])
|
|
const handleFlow = (row: any) => {
|
let data = {
|
headId: row.id,
|
}
|
getPayableAuditLog(data).then((res) => {
|
flowParams.value = res.rows
|
flowLogIshow.value.openModel()
|
|
})
|
}
|
</script>
|
