<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="primary"
|
icon="Edit"
|
:disabled="singleType"
|
v-hasPermi="['tms:tmsPayableFee:edit']"
|
@click="handleGen">生成账单
|
</el-button>
|
<!-- <el-button-->
|
<!-- type="success"-->
|
<!-- icon="Edit"-->
|
<!-- :disabled="pageF.single"-->
|
<!-- v-hasPermi="['tms:tmsPayableFee:edit']"-->
|
<!-- @click="handleUpdate">修改-->
|
<!-- </el-button>-->
|
<!-- <el-button-->
|
<!-- type="danger"-->
|
<!-- icon="Delete"-->
|
<!-- :disabled="pageF.multiple"-->
|
<!-- @click="handleDelete"-->
|
<!-- v-hasPermi="['tms:tmsPayableFee:remove']"-->
|
<!-- >删除-->
|
<!-- </el-button>-->
|
<!-- <el-button-->
|
<!-- type="warning"-->
|
<!-- plain-->
|
<!-- icon="Download"-->
|
<!-- @click="handleExport"-->
|
<!-- v-hasPermi="['tms:tmsPayableFee:export']"-->
|
<!-- >导出-->
|
<!-- </el-button>-->
|
</template>
|
<template #menu="{row}">
|
|
<el-link size="small" type="primary"
|
@click="handleView(row)" class="link-btn" :underline="false"
|
icon="el-icon-tickets">费用明细
|
</el-link><el-link size="small" type="primary" v-if="row.status == 0"
|
@click="handleClose(row)" class="link-btn" :underline="false"
|
icon="el-icon-close">作废
|
</el-link>
|
</template>
|
<template #payableAmount="{row}">
|
<div v-if="row.payableRmbAmount > 0">{{row.payableRmbAmount}}人民币</div>
|
<div v-if="row.payableHkbAmount > 0">{{row.payableHkbAmount}}港币</div>
|
</template>
|
</avue-crud>
|
|
<el-dialog :title="pageF.title" v-model="pageF.open" class="avue-dialog avue-dialog--top" width="80%">
|
<el-descriptions :column="3" border>
|
<el-descriptions-item label="系统编号">{{form.systemNo}}</el-descriptions-item>
|
<el-descriptions-item label="调度单号">{{form.dispatchNo}}</el-descriptions-item>
|
<el-descriptions-item label="供应商名称">{{form.serviceProviderName}}</el-descriptions-item>
|
<el-descriptions-item label="调度单确定时间">{{form.dispatchConfirmTime}}</el-descriptions-item>
|
<el-descriptions-item label="费用生成时间">{{form.costGenerateTime}}</el-descriptions-item>
|
<el-descriptions-item label="关联账单编号">{{form.billPayableNo}}</el-descriptions-item>
|
<el-descriptions-item label="应付金额人民币">{{form.payableRmbAmount}}</el-descriptions-item>
|
<el-descriptions-item label="应付金额港币">{{form.payableHkbAmount}}</el-descriptions-item>
|
</el-descriptions>
|
<h3>费用明细</h3>
|
<avue-crud
|
:option="YSGenerateItemTableOption" ref="itemsTableRef"
|
:data="form.payableFeeItems"
|
>
|
</avue-crud>
|
|
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="pageF.open = false">取 消</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
<el-dialog title="生成应付账单" v-model="open2" class="avue-dialog avue-dialog--top" width="80%">
|
<h3>是否根据以下数据生成应付账单</h3>
|
<el-descriptions :column="3" border>
|
<el-descriptions-item label="调度单数量">{{formData.dispatchCount}}</el-descriptions-item>
|
<el-descriptions-item label="汇率（港币兑人民币）">{{formData.settleRate}}</el-descriptions-item>
|
<el-descriptions-item label="应付费用（以人民币计）">{{formData.settleAmount}}</el-descriptions-item>
|
</el-descriptions>
|
<h3>费用明细</h3>
|
<avue-crud
|
:option="YSGenerateTableOption" ref="itemsTableRef"
|
:data="formData.tmsPayableFeeList"
|
>
|
<template #payableAmount="{row}">
|
<div v-if="row.payableRmbAmount > 0">{{row.payableRmbAmount}}人民币</div>
|
<div v-if="row.payableHkbAmount > 0">{{row.payableHkbAmount}}港币</div>
|
</template>
|
</avue-crud>
|
|
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button type="primary" :loading="pageF.isUploading" @click="generateSubmit">生成账单</el-button>
|
<el-button @click="open2 = false">取 消</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</basicContainer>
|
</template>
|
|
<script setup name="tmsPayableFee" lang="ts">
|
import {
|
TmsPayableFeeI,
|
addTmsPayableFee,
|
delTmsPayableFee,
|
exportTmsPayableFee,
|
getTmsPayableFee,
|
listTmsPayableFee,
|
updateTmsPayableFee,closeTmsPayableFee,
|
initApGenerate,
|
apGenerate,
|
} from "@/api/tms/tmsPayableFee";
|
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 {ElMessage, ElMessageBox} from "element-plus";
|
|
const {proxy} = useCurrentInstance();
|
const crudRef = ref();
|
|
const permissionList = computed(() => {
|
return {
|
addBtn: hasPermission(["tms:tmsPayableFee:add"]),
|
delBtn: hasPermission(["tms:tmsPayableFee:remove"]),
|
editBtn: hasPermission(["tms:tmsPayableFee:edit"]),
|
viewBtn: hasPermission(["tms:tmsPayableFee:query"]),
|
}
|
})
|
|
const data = reactive({
|
form: <TmsPayableFeeI>{},
|
queryParams: <TmsPayableFeeI & PageQueryInterface>{},
|
page: <PagesInterface>{
|
pageSize: 10,
|
total: 0,
|
currentPage: 1,
|
},
|
selectionList: [],
|
singleType:true,
|
open2:false,
|
formData: <any>{}
|
})
|
const {queryParams, form, page, selectionList,singleType,open2,formData} = toRefs(data);
|
const option = ref({
|
pageKey: 'TmsPayableFee',
|
rowKey: 'id',
|
addBtn: false,
|
editBtn: false,
|
delBtn: false,
|
viewBtn: false,
|
column: {
|
systemNo: {
|
label: '系统编号',
|
hide: false,
|
search: true,minWidth: 150,
|
},
|
|
billPayableNo: {
|
label: '关联账单编号',
|
hide: false,minWidth: 150,
|
search: false,
|
},
|
dispatchNo: {
|
label: '调度单号',
|
hide: false,minWidth: 150,
|
search: true,
|
},
|
serviceProviderName: {
|
label: '供应商名称',
|
minWidth: 150,
|
hide: false,
|
search: true,
|
},
|
payableAmount: {
|
label: '应付金额',
|
hide: false,minWidth: 150,
|
search: false,fixed: 'right',
|
},
|
dispatchConfirmTime: {
|
label: '调度单确定时间',
|
hide: false,
|
search: false,minWidth: 180,
|
},
|
costGenerateTime: {
|
label: '费用生成时间',
|
hide: false,minWidth: 180,
|
search: false,
|
},
|
status: {
|
label: '状态',
|
type: 'select', dataType: 'string', dicUrl: '/system/dict/data/type/receivable_free_status',
|
hide: false,minWidth: 130,fixed: 'right', search: true,
|
},
|
|
}
|
})
|
const YSGenerateItemTableOption = ref({
|
menu: false,
|
add: false,
|
header:false,
|
selection: false,
|
rowKey:'rowKey',
|
|
column:{
|
feeType:{
|
label: '费用类型',
|
type: 'radio', dataType: 'string', dicUrl: '/system/dict/data/type/receivable_fee_type',
|
|
},
|
feeName:{
|
label: '费用名称',
|
},
|
registerTime:{
|
label: '登记时间',
|
},
|
registerAmount:{
|
label: '登记金额',
|
},
|
currency:{
|
label: '币制',
|
type: 'radio', dataType: 'string', dicUrl: '/system/dict/data/type/sys_currency',
|
|
}
|
}
|
})
|
const YSGenerateTableOption= ref({
|
menu: false,
|
add: false,
|
header:false,
|
selection: false,
|
rowKey:'id',
|
|
column:{
|
|
systemNo:{
|
label: '系统编号',
|
},
|
dispatchNo:{
|
label: '调度单号',
|
},
|
serviceProviderName:{
|
label: '供应商',
|
},
|
projectName:{
|
label: '项目名称',
|
},
|
payableAmount:{
|
label: '应付金额',
|
},
|
payableRmbSumAmount:{
|
label: '应付金额(以人民币计)',
|
}
|
}
|
})
|
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: listTmsPayableFee,
|
getDetailApi: getTmsPayableFee,
|
exportApi: exportTmsPayableFee,
|
deleteApi: delTmsPayableFee,
|
addApi: addTmsPayableFee,
|
updateApi: updateTmsPayableFee,
|
handleUpdateFunc: () => {
|
crudRef.value.rowEdit(selectionList.value[0]);
|
},
|
handleSelectionChangeFunc: (selection: any) => {
|
selectionList.value = selection;
|
singleType.value = true;
|
if (selection.length > 0){
|
singleType.value = selection.filter((item:any)=> item.status != 0).length > 0;
|
}
|
}
|
})
|
const handleGen = () => {
|
let ids = selectionList.value.map((item: any) => item.id);
|
formData.value.payableFeeItems = [];
|
initApGenerate(ids).then(res=>{
|
formData.value = res.data || {};
|
open2.value = true
|
})
|
}
|
|
const generateSubmit = () => {
|
pageF.isUploading = true;
|
let ids = selectionList.value.map((item: any) => item.id);
|
|
apGenerate(ids).then(res => {
|
pageF.isUploading = false;
|
ElMessage({
|
message: "生成成功！",
|
type: 'success'
|
})
|
open2.value = false;
|
onLoad(page.value);
|
}).finally(() => {
|
pageF.isUploading = false;
|
})
|
|
}
|
|
const handleView = (row: any) => {
|
form.value.payableFeeItems = [];
|
getTmsPayableFee(row.id).then(res=>{
|
form.value = res.data || {};
|
pageF.open = true;
|
pageF.title = '应付费用明细';
|
|
})
|
}
|
|
const handleClose = (row: any) => {
|
ElMessageBox.confirm("是否对调度单号" + row.dispatchNo + "进行作废？", '系统提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
return closeTmsPayableFee(row.id);
|
}).then(() => {
|
onLoad(page.value);
|
ElMessage({
|
message: "操作成功！",
|
type: 'success'
|
})
|
});
|
}
|
|
</script>
|
