06/26
张同海
5 months ago
commit
9bafebac15
@ -0,0 +1,416 @@
|
|||||||
|
/*
|
||||||
|
* @Description: 费用代码设置tsx
|
||||||
|
* @Author: lijj
|
||||||
|
* @Date: 2024-04-25 15:48:33
|
||||||
|
*/
|
||||||
|
import { ref, h, ComponentOptions, resolveComponent } from 'vue'
|
||||||
|
import { BasicColumn, FormSchema } from '/@/components/Table'
|
||||||
|
import { useOptionsStore } from '/@/store/modules/options'
|
||||||
|
const optionsStore = useOptionsStore()
|
||||||
|
// 引入字典数据
|
||||||
|
import { getDictOption } from '/@/utils/dictUtil'
|
||||||
|
|
||||||
|
// 业务表格列
|
||||||
|
export const businessColumns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '委托编号',
|
||||||
|
dataIndex: 'customerNo',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '主提单号',
|
||||||
|
dataIndex: 'mblno',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '结算单位',
|
||||||
|
dataIndex: 'customerName',
|
||||||
|
width: 150,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'RMB未付',
|
||||||
|
dataIndex: 'unpaidRMB',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'USD未付',
|
||||||
|
dataIndex: 'unpaidUSD',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '其他未付',
|
||||||
|
dataIndex: 'unpaidOther',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'RMB未收',
|
||||||
|
dataIndex: 'unpaidOther',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'USD未收',
|
||||||
|
dataIndex: 'unpaidOther',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '其他未收',
|
||||||
|
dataIndex: 'unpaidOther',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '订舱编号',
|
||||||
|
dataIndex: 'unpaidOther',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'RMB付未开票',
|
||||||
|
dataIndex: 'unBilledRMB',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'USD付未开票',
|
||||||
|
dataIndex: 'unBilledUSD',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '合计未收',
|
||||||
|
dataIndex: 'unreceivedTotal',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '业务类别',
|
||||||
|
dataIndex: 'businessType',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '分提单号',
|
||||||
|
dataIndex: 'hblno',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{/////////////
|
||||||
|
title: '委托单位',
|
||||||
|
dataIndex: 'unreceivedTotal',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '开船日期',
|
||||||
|
dataIndex: 'etd',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '揽货人',
|
||||||
|
dataIndex: 'saleName',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '更改单',
|
||||||
|
dataIndex: 'changeOrder',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{/////////////
|
||||||
|
title: '会计日期',
|
||||||
|
dataIndex: 'changeOrder',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'operator',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '集装箱',
|
||||||
|
dataIndex: 'cntrTotal',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{////////////////
|
||||||
|
title: 'RMB收费状态',
|
||||||
|
dataIndex: 'cntrTotal',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{//////////////////
|
||||||
|
title: 'USD收费状态',
|
||||||
|
dataIndex: 'cntrTotal',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '起运港',
|
||||||
|
dataIndex: 'loadPort',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '卸货港',
|
||||||
|
dataIndex: 'dischargePort',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '船名',
|
||||||
|
dataIndex: 'vessel',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '航次',
|
||||||
|
dataIndex: 'voyage',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '结费方式',
|
||||||
|
dataIndex: 'stlName',
|
||||||
|
width: 120,
|
||||||
|
align: 'left'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
export const formSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
field: 'applicationNO',
|
||||||
|
label: '申请编号',
|
||||||
|
component: 'Input',
|
||||||
|
dynamicDisabled: true,
|
||||||
|
colProps: { span: 3 },
|
||||||
|
// render: ({ model, field }) => {
|
||||||
|
// return h(resolveComponent('span') as ComponentOptions, {
|
||||||
|
// value: model[field]
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'statusText',
|
||||||
|
label: '状态',
|
||||||
|
component: 'Input',
|
||||||
|
dynamicDisabled: true,
|
||||||
|
colProps: { span: 3 },
|
||||||
|
// render: ({ model, field }) => {
|
||||||
|
// return h(resolveComponent('span') as ComponentOptions, {
|
||||||
|
// value: model[field]
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'customerId',
|
||||||
|
label: '结算对象',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
required: false,
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 3 },
|
||||||
|
componentProps: () => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetClientListByCode'),
|
||||||
|
labelField: 'shortName',
|
||||||
|
valueField: 'id',
|
||||||
|
resultField: 'data',
|
||||||
|
immediate: false,
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'customerBankId',
|
||||||
|
label: '结算对象账户',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
required: false,
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 3 },
|
||||||
|
componentProps: () => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('getClientBankList'),
|
||||||
|
labelField: 'bankName',
|
||||||
|
valueField: 'id',
|
||||||
|
resultField: 'data',
|
||||||
|
immediate: false,
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'customerBank',
|
||||||
|
label: '结算对象账号',
|
||||||
|
component: 'Input',
|
||||||
|
required: false,
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 3 }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'createTime',
|
||||||
|
label: '申请日期',
|
||||||
|
component: 'DatePicker',
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 3 }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'currency',
|
||||||
|
label: '币别',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
required: false,
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 3 },
|
||||||
|
componentProps: () => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetFeeCurrencySelectList'),
|
||||||
|
labelField: 'name',
|
||||||
|
valueField: 'codeName',
|
||||||
|
resultField: 'data',
|
||||||
|
immediate: false,
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'amountRMB',
|
||||||
|
label: 'RMB金额',
|
||||||
|
component: 'InputNumber',
|
||||||
|
colProps: { span: 3 },
|
||||||
|
componentProps: {
|
||||||
|
min: 0,
|
||||||
|
precision: 6
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'amountUSD',
|
||||||
|
label: 'USD金额',
|
||||||
|
component: 'InputNumber',
|
||||||
|
colProps: { span: 3 },
|
||||||
|
componentProps: {
|
||||||
|
min: 0,
|
||||||
|
precision: 6
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'amountOther',
|
||||||
|
label: '其他外币金额',
|
||||||
|
component: 'InputNumber',
|
||||||
|
colProps: { span: 3 },
|
||||||
|
componentProps: {
|
||||||
|
min: 0,
|
||||||
|
precision: 6
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'amountUSD',
|
||||||
|
label: '计划结算RMB',
|
||||||
|
component: 'InputNumber',
|
||||||
|
colProps: { span: 3 }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'amountOther',
|
||||||
|
label: '计划结算USD',
|
||||||
|
component: 'InputNumber',
|
||||||
|
colProps: { span: 3 }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'settlementType',
|
||||||
|
label: '结算方式',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
required: false,
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 3 },
|
||||||
|
componentProps: () => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetClientStlModeSelectList'),
|
||||||
|
labelField: 'stlName',
|
||||||
|
valueField: 'id',
|
||||||
|
resultField: 'data',
|
||||||
|
immediate: false,
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'paymentDate',
|
||||||
|
label: '申请支付日期',
|
||||||
|
component: 'DatePicker',
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 3 }
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// field: 'createBy',
|
||||||
|
// label: '申请人',
|
||||||
|
// component: 'Input',
|
||||||
|
// dynamicDisabled: false,
|
||||||
|
// colProps: { span: 3 }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// field: 'createBy',
|
||||||
|
// label: '计划结算其他',
|
||||||
|
// component: 'Input',
|
||||||
|
// dynamicDisabled: false,
|
||||||
|
// colProps: { span: 3 }
|
||||||
|
// },
|
||||||
|
]
|
||||||
|
export const searchFormSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
label: '结算单位',
|
||||||
|
field: 'customerId',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 4 },
|
||||||
|
componentProps: () => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetClientListByCode'),
|
||||||
|
immediate: false,
|
||||||
|
labelField: 'shortName',
|
||||||
|
valueField: 'codeName',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '主提单号',
|
||||||
|
field: 'mblno',
|
||||||
|
component: 'Input',
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 4 }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '分提单号',
|
||||||
|
field: 'hblno',
|
||||||
|
component: 'Input',
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 4 }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '对账编号',
|
||||||
|
field: 'debitNo',
|
||||||
|
component: 'Input',
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 4 }
|
||||||
|
}
|
||||||
|
]
|
||||||
@ -0,0 +1,127 @@
|
|||||||
|
<!--
|
||||||
|
* @Description: 操作管理 -> 付费申请 -> 申请明细
|
||||||
|
* @Author: lijj
|
||||||
|
* @Date: 2024-06-20 11:54:04
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="ds-pay-apply-detail-fee-info">
|
||||||
|
<a-tabs v-model:activeKey="activeKey">
|
||||||
|
<a-tab-pane key="2" tab="费用明细">
|
||||||
|
<div>
|
||||||
|
<BasicTable @register="registerTable">
|
||||||
|
<template #toolbar>
|
||||||
|
<a-button type="link" @click="add"> 添加申请明细 </a-button>
|
||||||
|
</template>
|
||||||
|
</BasicTable>
|
||||||
|
</div>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="3" tab="附件上传" force-render>
|
||||||
|
<div style="width: 400px;">
|
||||||
|
<DsFile
|
||||||
|
ref="dsFile"
|
||||||
|
:id='route?.query?.id'
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { onMounted, ref, defineEmits, defineProps, watch, defineExpose } from 'vue'
|
||||||
|
import { BasicTable, useTable } from '/@/components/Table'
|
||||||
|
import { useMessage } from '/@/hooks/web/useMessage'
|
||||||
|
import { columns, searchFormSchema } from './applyInfoColumns'
|
||||||
|
// 引入附近上传组件
|
||||||
|
import DsFile from "/@/components/File/index.vue"
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
const route = useRoute()
|
||||||
|
const { createMessage } = useMessage()
|
||||||
|
const emit = defineEmits(['add'])
|
||||||
|
const activeKey = ref('2')
|
||||||
|
const props = defineProps({
|
||||||
|
feeData: {
|
||||||
|
type: Array
|
||||||
|
},
|
||||||
|
// 业务id
|
||||||
|
id: {
|
||||||
|
type: String
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const [registerTable, { reload, getForm, getPaginationRef, getSelectRows, getDataSource, setTableData }] = useTable({
|
||||||
|
title: '',
|
||||||
|
api: async (p) => {
|
||||||
|
const res = await GetList(p)
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
resolve({ data: [...res.data], total: res.count })
|
||||||
|
})
|
||||||
|
},
|
||||||
|
beforeFetch: () => {
|
||||||
|
var currentPageInfo: any = getPaginationRef()
|
||||||
|
var data = getForm().getFieldsValue()
|
||||||
|
const postParam = {
|
||||||
|
queryCondition: '',
|
||||||
|
pageCondition: {
|
||||||
|
pageIndex: currentPageInfo.current,
|
||||||
|
pageSize: currentPageInfo.pageSize,
|
||||||
|
sortConditions: [],
|
||||||
|
},
|
||||||
|
}
|
||||||
|
let condition: API.ConditionItem[] = []
|
||||||
|
if (!!data.UserName) {
|
||||||
|
condition.push({
|
||||||
|
FieldName: 'UserName',
|
||||||
|
FieldValue: data.UserName,
|
||||||
|
ConditionalType: 1,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (!!data.UserCode) {
|
||||||
|
condition.push({
|
||||||
|
FieldName: 'UserCode',
|
||||||
|
FieldValue: data.UserCode,
|
||||||
|
ConditionalType: 1,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
postParam.queryCondition = JSON.stringify(condition)
|
||||||
|
// console.log(postParam);
|
||||||
|
return postParam
|
||||||
|
},
|
||||||
|
columns,
|
||||||
|
isTreeTable: false,
|
||||||
|
pagination: true,
|
||||||
|
striped: false,
|
||||||
|
useSearchForm: false,
|
||||||
|
showTableSetting: true,
|
||||||
|
bordered: true,
|
||||||
|
showIndexColumn: true,
|
||||||
|
canResize: false,
|
||||||
|
rowSelection: { type: 'checkbox' },
|
||||||
|
immediate: false
|
||||||
|
})
|
||||||
|
// 添加明细
|
||||||
|
const add = () => {
|
||||||
|
emit('add')
|
||||||
|
}
|
||||||
|
const tableData = ref([])
|
||||||
|
watch(
|
||||||
|
() => props.feeData,
|
||||||
|
(list) => {
|
||||||
|
console.log(list)
|
||||||
|
setTableData([...list])
|
||||||
|
}
|
||||||
|
)
|
||||||
|
onMounted(() => {
|
||||||
|
//初始化
|
||||||
|
reload()
|
||||||
|
})
|
||||||
|
defineExpose({
|
||||||
|
reload
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less">
|
||||||
|
.ds-pay-apply-detail-fee-info {
|
||||||
|
.vben-basic-table-header__toolbar {
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,97 @@
|
|||||||
|
/*
|
||||||
|
* @Author: lijingjia lijj_xl@163.com
|
||||||
|
* @Date: 2024-06-21 16:59:01
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
import { BasicColumn, FormSchema } from '/@/components/Table'
|
||||||
|
export const columns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '委托编号',
|
||||||
|
dataIndex: 'customerNo',
|
||||||
|
width: 130,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '主提单号',
|
||||||
|
dataIndex: 'mblno',
|
||||||
|
width: 130,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '委托单位',
|
||||||
|
dataIndex: 'customerName',
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '开船日期',
|
||||||
|
dataIndex: 'etd',
|
||||||
|
width: 120,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '业务来源',
|
||||||
|
dataIndex: 'sourceName',
|
||||||
|
width: 130,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '费用名称',
|
||||||
|
dataIndex: 'feeName',
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '收付',
|
||||||
|
dataIndex: 'billType',
|
||||||
|
width: 120,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '费用对象',
|
||||||
|
dataIndex: 'customerName',
|
||||||
|
width: 110,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '申请金额',
|
||||||
|
dataIndex: 'amount',
|
||||||
|
width: 100,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '原始币别',
|
||||||
|
dataIndex: 'originalCurrency',
|
||||||
|
width: 100,
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// title: '原始汇率',
|
||||||
|
// dataIndex: 'originalCurrency',
|
||||||
|
// width: 200,
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
title: '折算汇率',
|
||||||
|
dataIndex: 'exchangeRate',
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '原始金额',
|
||||||
|
dataIndex: 'originalAmount',
|
||||||
|
width: 100,
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// title: '进项/销项税率',
|
||||||
|
// dataIndex: 'originalCurrency',
|
||||||
|
// width: 200,
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
title: '揽货人',
|
||||||
|
dataIndex: 'note',
|
||||||
|
width: 110,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '所属分部',
|
||||||
|
dataIndex: 'createTime',
|
||||||
|
width: 120,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
export const searchFormSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
field: 'CountryName',
|
||||||
|
label: '国家名称',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 6 }
|
||||||
|
}
|
||||||
|
]
|
||||||
@ -0,0 +1,243 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: lijingjia lijj_xl@163.com
|
||||||
|
* @Date: 2024-06-24 10:08:36
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="ds-bus-table">
|
||||||
|
<BasicTable
|
||||||
|
:canRowSelect="true"
|
||||||
|
:scroll="{ x: '100%', y: 188 }"
|
||||||
|
:row-selection="{ selectedRowKeys: state.historyRowKeys, onChange: historyChange }"
|
||||||
|
rowKey="id"
|
||||||
|
@register="registerTable"
|
||||||
|
@row-click="onRowClick"
|
||||||
|
>
|
||||||
|
<template #toolbar>
|
||||||
|
<a-button type="link" @click="addInfos">增加结算明细</a-button>
|
||||||
|
</template>
|
||||||
|
</BasicTable>
|
||||||
|
<div class="info">
|
||||||
|
<div>
|
||||||
|
<a-button @click="save" type="link">添加申请费用明细</a-button>
|
||||||
|
</div>
|
||||||
|
<feeTable
|
||||||
|
ref="feeTabel"
|
||||||
|
></feeTable>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { onMounted, ref, reactive, watch, defineExpose, defineProps, defineEmits } from 'vue'
|
||||||
|
import { BasicTable, useTable } from '/@/components/Table'
|
||||||
|
import { GetBizList } from '../../api'
|
||||||
|
import { businessColumns, searchFormSchema } from '../columns'
|
||||||
|
import feeTable from '/@/components/CostEntry/components/feeTable.vue'
|
||||||
|
// 引入提示信息
|
||||||
|
import { useMessage } from '/@/hooks/web/useMessage'
|
||||||
|
const emit = defineEmits(['save'])
|
||||||
|
const { createMessage } = useMessage()
|
||||||
|
const props = defineProps({
|
||||||
|
// 表单数据
|
||||||
|
formData: {
|
||||||
|
type: Object
|
||||||
|
},
|
||||||
|
// 设置表单数据
|
||||||
|
setFieldsValue: {
|
||||||
|
type: Function
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const [registerTable, { reload, getForm, getPaginationRef, getSelectRows, setSelectedRows }] = useTable({
|
||||||
|
api: async (p) => {
|
||||||
|
const res = await GetBizList(p)
|
||||||
|
if (res?.data?.length) state.historyRowKeys = [res.data[0].id]
|
||||||
|
setSelectedRows([res.data[0]])
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
resolve({ data: [...res.data], total: res.count })
|
||||||
|
})
|
||||||
|
},
|
||||||
|
beforeFetch: () => {
|
||||||
|
var currentPageInfo: any = getPaginationRef()
|
||||||
|
var data = getForm().getFieldsValue()
|
||||||
|
const postParam = {
|
||||||
|
queryCondition: '',
|
||||||
|
pageCondition: {
|
||||||
|
pageIndex: currentPageInfo.current,
|
||||||
|
pageSize: currentPageInfo.pageSize,
|
||||||
|
sortConditions: [],
|
||||||
|
},
|
||||||
|
}
|
||||||
|
let condition: API.ConditionItem[] = []
|
||||||
|
if (!!data.customerNo) {
|
||||||
|
condition.push({
|
||||||
|
FieldName: 'customerNo',
|
||||||
|
FieldValue: data.customerNo,
|
||||||
|
ConditionalType: 1
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (!!data.Etd) {
|
||||||
|
condition.push({
|
||||||
|
FieldName: 'Etd',
|
||||||
|
FieldValue: data.Etd[0],
|
||||||
|
ConditionalType: 3
|
||||||
|
})
|
||||||
|
condition.push({
|
||||||
|
FieldName: 'Etd',
|
||||||
|
FieldValue: data.Etd[1],
|
||||||
|
ConditionalType: 5
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (!!data.loadPort) {
|
||||||
|
condition.push({
|
||||||
|
FieldName: 'loadPort',
|
||||||
|
FieldValue: data.loadPort,
|
||||||
|
ConditionalType: 1
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (!!data.dischargePort) {
|
||||||
|
condition.push({
|
||||||
|
FieldName: 'dischargePort',
|
||||||
|
FieldValue: data.dischargePort,
|
||||||
|
ConditionalType: 1
|
||||||
|
})
|
||||||
|
}
|
||||||
|
postParam.queryCondition = JSON.stringify(condition)
|
||||||
|
return postParam
|
||||||
|
},
|
||||||
|
columns: businessColumns,
|
||||||
|
formConfig: {
|
||||||
|
labelWidth: 120,
|
||||||
|
schemas: searchFormSchema
|
||||||
|
},
|
||||||
|
isTreeTable: false,
|
||||||
|
pagination: true,
|
||||||
|
striped: false,
|
||||||
|
useSearchForm: true,
|
||||||
|
showTableSetting: false,
|
||||||
|
bordered: true,
|
||||||
|
showIndexColumn: true,
|
||||||
|
canResize: false,
|
||||||
|
immediate: false
|
||||||
|
})
|
||||||
|
// 费用信息已选项
|
||||||
|
const state = reactive({
|
||||||
|
historyRowKeys: []
|
||||||
|
})
|
||||||
|
// 找出2个数组不同的元素
|
||||||
|
const findDifferentElements = (arr1, arr2) => {
|
||||||
|
return [
|
||||||
|
...arr1.filter(item => !arr2.includes(item)),
|
||||||
|
...arr2.filter(item => !arr1.includes(item))
|
||||||
|
]
|
||||||
|
}
|
||||||
|
// 根据选择的业务id存储费用数据
|
||||||
|
const allFeeData = {}
|
||||||
|
const feeTabel = ref(null)
|
||||||
|
const historyChange = async (v) => {
|
||||||
|
state.historyRowKeys = v
|
||||||
|
}
|
||||||
|
// 行点击事件
|
||||||
|
const onRowClick = (record) => {
|
||||||
|
state.historyRowKeys = [record?.id]
|
||||||
|
setSelectedRows([record])
|
||||||
|
}
|
||||||
|
const feeData = () => {
|
||||||
|
return feeTabel.value.selectfeeData
|
||||||
|
}
|
||||||
|
// 添加申请费用明细
|
||||||
|
const save = () => {
|
||||||
|
const data = feeTabel.value.selectfeeData
|
||||||
|
emit('save', data)
|
||||||
|
}
|
||||||
|
const addInfos = () => {
|
||||||
|
const selectRows = getSelectRows()
|
||||||
|
console.log(selectRows)
|
||||||
|
// console.log(props.formData.currency)
|
||||||
|
return
|
||||||
|
if (props.formData.customerId) {
|
||||||
|
let flag = false
|
||||||
|
selectRows.forEach(item => {
|
||||||
|
if (item.customerId == props.formData.customerId) {
|
||||||
|
flag = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if (!flag) {
|
||||||
|
return createMessage.warning('没有选择要添加的业务!')
|
||||||
|
}
|
||||||
|
selectRows
|
||||||
|
} else {
|
||||||
|
if (state.historyRowKeys.length == 0 ) {
|
||||||
|
return createMessage.warning('没有选择要添加的业务!')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log(allFeeData)
|
||||||
|
// 合并所有选择过的费用明细
|
||||||
|
let feeList = []
|
||||||
|
for(var key in allFeeData) {
|
||||||
|
feeList = [...feeList, ...allFeeData[key]]
|
||||||
|
}
|
||||||
|
console.log(props.formData)
|
||||||
|
|
||||||
|
feeList.forEach(item => {
|
||||||
|
if (props.formData.currency && props.formData.currency != item.currency) {
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
watch(
|
||||||
|
() => state.historyRowKeys, (v, old) => {
|
||||||
|
// 勾选前后同的id
|
||||||
|
const diffIds = findDifferentElements(v, old)
|
||||||
|
const rows = getSelectRows()
|
||||||
|
if (v.length > old.length) {
|
||||||
|
// 增加勾选
|
||||||
|
diffIds.forEach(item => {
|
||||||
|
// 获取业务类型传给下个子组件
|
||||||
|
let btype = rows.filter(row => {
|
||||||
|
return item == row.id
|
||||||
|
})
|
||||||
|
btype = btype[0]?.businessType
|
||||||
|
feeTabel.value.init([item], 'apply', btype).then(res => {
|
||||||
|
allFeeData[item] = res
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else if (v.length < old.length) {
|
||||||
|
// 减少勾选
|
||||||
|
diffIds.forEach(item => {
|
||||||
|
delete allFeeData[item]
|
||||||
|
})
|
||||||
|
if (v.length) {
|
||||||
|
// 获取业务类型传给下个子组件
|
||||||
|
let btype = rows[0].businessType
|
||||||
|
feeTabel.value.init([v[v.length - 1]], 'apply', btype)
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 点击单行平行切换
|
||||||
|
let btype = rows[0].businessType
|
||||||
|
feeTabel.value.init(v, 'apply', btype)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
//初始化
|
||||||
|
reload()
|
||||||
|
})
|
||||||
|
defineExpose({
|
||||||
|
feeData
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less">
|
||||||
|
.ds-bus-table {
|
||||||
|
.vben-basic-table-header__toolbar {
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.vben-basic-table {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.ant-form {
|
||||||
|
margin-bottom: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,179 @@
|
|||||||
|
<!--
|
||||||
|
* @Description: 操作管理 -> 付费申请 -> 详情布局
|
||||||
|
* @Author: lijj
|
||||||
|
* @Date: 2024-06-20 11:54:04
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="ds-pay-apply-detail ds-detail-box">
|
||||||
|
<a-spin :spinning="dloading">
|
||||||
|
<div>
|
||||||
|
<a-button @click="save">保存</a-button>
|
||||||
|
</div>
|
||||||
|
<!-- 表单区域 -->
|
||||||
|
<div class="form-area">
|
||||||
|
<BasicForm @register="registerForm" />
|
||||||
|
</div>
|
||||||
|
<!-- 申请明细 -->
|
||||||
|
<div>
|
||||||
|
<ApplyInfo
|
||||||
|
ref="applyInfo"
|
||||||
|
@add="add"
|
||||||
|
:feeData="feeData"
|
||||||
|
></ApplyInfo>
|
||||||
|
</div>
|
||||||
|
</a-spin>
|
||||||
|
<a-modal
|
||||||
|
class="fee-modal"
|
||||||
|
v-model:visible="visible"
|
||||||
|
title="添加支付结算明细"
|
||||||
|
width="90%"
|
||||||
|
@ok="handleOk"
|
||||||
|
>
|
||||||
|
<a-spin :spinning="loading">
|
||||||
|
<!-- 业务表格 -->
|
||||||
|
<BusinessTable
|
||||||
|
ref="busTable"
|
||||||
|
:formData="getFieldsValue()"
|
||||||
|
:setFieldsValue="setFieldsValue"
|
||||||
|
@save="save"
|
||||||
|
></BusinessTable>
|
||||||
|
</a-spin>
|
||||||
|
</a-modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { onMounted, ref } from 'vue'
|
||||||
|
import { BasicTable, useTable } from '/@/components/Table'
|
||||||
|
import { useMessage } from '/@/hooks/web/useMessage'
|
||||||
|
import { BasicForm, useForm } from '/@/components/Form'
|
||||||
|
import ApplyInfo from './components/applyInfo.vue'
|
||||||
|
// 业务表格
|
||||||
|
import BusinessTable from './components/businessTable.vue'
|
||||||
|
const { createMessage } = useMessage()
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
const route = useRoute()
|
||||||
|
const visible = ref(false)
|
||||||
|
import { formSchema } from './columns'
|
||||||
|
import { Save, Get } from '../api'
|
||||||
|
const [registerForm, { validate, getFieldsValue, setFieldsValue }] = useForm({
|
||||||
|
labelWidth: 150,
|
||||||
|
schemas: formSchema,
|
||||||
|
showActionButtonGroup: false
|
||||||
|
})
|
||||||
|
// 业务表loading
|
||||||
|
const loading = ref(false)
|
||||||
|
// 详情页面loading
|
||||||
|
const dloading = ref(false)
|
||||||
|
const busTable = ref(null)
|
||||||
|
const feeData = ref([])
|
||||||
|
const handleOk = () => {
|
||||||
|
feeData.value = busTable.value.feeData()
|
||||||
|
visible.value = false
|
||||||
|
}
|
||||||
|
// const [registerTable, { reload, getForm, getPaginationRef, getSelectRows }] = useTable({
|
||||||
|
// title: '',
|
||||||
|
// api: async (p) => {
|
||||||
|
// const res = await GetList(p)
|
||||||
|
// return new Promise((resolve) => {
|
||||||
|
// resolve({ data: [...res.data], total: res.count })
|
||||||
|
// })
|
||||||
|
// },
|
||||||
|
// beforeFetch: () => {
|
||||||
|
// var currentPageInfo: any = getPaginationRef()
|
||||||
|
// var data = getForm().getFieldsValue()
|
||||||
|
// const postParam = {
|
||||||
|
// queryCondition: '',
|
||||||
|
// pageCondition: {
|
||||||
|
// pageIndex: currentPageInfo.current,
|
||||||
|
// pageSize: currentPageInfo.pageSize,
|
||||||
|
// sortConditions: [],
|
||||||
|
// },
|
||||||
|
// }
|
||||||
|
// let condition: API.ConditionItem[] = []
|
||||||
|
// if (!!data.UserName) {
|
||||||
|
// condition.push({
|
||||||
|
// FieldName: 'UserName',
|
||||||
|
// FieldValue: data.UserName,
|
||||||
|
// ConditionalType: 1,
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
// if (!!data.UserCode) {
|
||||||
|
// condition.push({
|
||||||
|
// FieldName: 'UserCode',
|
||||||
|
// FieldValue: data.UserCode,
|
||||||
|
// ConditionalType: 1,
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
// postParam.queryCondition = JSON.stringify(condition)
|
||||||
|
// // console.log(postParam);
|
||||||
|
// return postParam
|
||||||
|
// },
|
||||||
|
// columns,
|
||||||
|
// formConfig: {
|
||||||
|
// labelWidth: 120,
|
||||||
|
// schemas: searchFormSchema,
|
||||||
|
// },
|
||||||
|
// isTreeTable: false,
|
||||||
|
// pagination: true,
|
||||||
|
// striped: false,
|
||||||
|
// useSearchForm: true,
|
||||||
|
// showTableSetting: true,
|
||||||
|
// bordered: true,
|
||||||
|
// showIndexColumn: true,
|
||||||
|
// canResize: false,
|
||||||
|
// rowSelection: { type: 'checkbox' },
|
||||||
|
// immediate: false
|
||||||
|
// })
|
||||||
|
// 打开添加明细弹窗
|
||||||
|
const add = () => {
|
||||||
|
visible.value = true
|
||||||
|
}
|
||||||
|
const applyInfo = ref(null)
|
||||||
|
// 保存
|
||||||
|
const save = async (feeInfo) => {
|
||||||
|
const postData = await validate()
|
||||||
|
postData['details'] = feeInfo
|
||||||
|
loading.value = true
|
||||||
|
Save(postData).then(res => {
|
||||||
|
console.log(res)
|
||||||
|
loading.value = false
|
||||||
|
applyInfo.value.reload()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 详情页面初始化
|
||||||
|
const init = () => {
|
||||||
|
const id = route.query.id
|
||||||
|
if (id) {
|
||||||
|
dloading.value = true
|
||||||
|
Get({ id }).then(res => {
|
||||||
|
dloading.value = false
|
||||||
|
setFieldsValue(res.data)
|
||||||
|
feeData.value = res.data.details
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
//初始化
|
||||||
|
// reload()
|
||||||
|
init()
|
||||||
|
})
|
||||||
|
function handleSuccess() {
|
||||||
|
// reload()
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less">
|
||||||
|
.form-area {
|
||||||
|
padding: 10px;
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
.fee-modal {
|
||||||
|
.ant-modal-body {
|
||||||
|
padding-top: 0 10px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
.ant-modal-footer {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue