联系人弹窗，运输条款必填问题修复
parent
4688b82bd2
commit
c78a23babd
@ -0,0 +1,528 @@
|
||||
/*
|
||||
* @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 { useRoute } from 'vue-router'
|
||||
const route = useRoute()
|
||||
import { GetClientListByCode, getOrgList, GetClientBank, GetFeeCurrencySelectList } from '/@/api/common'
|
||||
// 引入字典数据
|
||||
import { getDictOption } from '/@/utils/dictUtil'
|
||||
import { placeholderSign } from 'element-plus/es/components/table-v2/src/private'
|
||||
|
||||
// 业务表格列
|
||||
export const businessColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '申请单号',
|
||||
dataIndex: 'applicationNO',
|
||||
width: 120,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'statusText',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '结算单位',
|
||||
dataIndex: 'customerName',
|
||||
width: 120,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '客户银行',
|
||||
dataIndex: 'customerBankName',
|
||||
width: 120,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '银行账号',
|
||||
dataIndex: 'customerAccount',
|
||||
width: 120,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: 'RMB申请金额',
|
||||
dataIndex: 'amountRMB',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: 'RMB未结金额',
|
||||
dataIndex: 'unSettledRMB',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: 'RMB本次结算',
|
||||
dataIndex: 'settlementRMB',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: 'USD申请金额',
|
||||
dataIndex: 'amountUSD',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: 'USD未结金额',
|
||||
dataIndex: 'unSettledUSD',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: 'USD本次结算',
|
||||
dataIndex: 'settlementUSD',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '申请日期',
|
||||
dataIndex: 'createTime',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '申请人',
|
||||
dataIndex: 'createByName',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '申请支付日期',
|
||||
dataIndex: 'paymentDate',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '结算方式',
|
||||
dataIndex: 'settlementTypeName',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '审核实付金额',
|
||||
dataIndex: 'payAmount',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '审核时间',
|
||||
dataIndex: 'auditTime',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '审核人',
|
||||
dataIndex: 'auditerName',
|
||||
width: 100,
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
title: '所属分部',
|
||||
dataIndex: 'saleDeptName',
|
||||
width: 120,
|
||||
align: 'left'
|
||||
}
|
||||
]
|
||||
|
||||
// 费用表格
|
||||
export const feeColumns: BasicColumn[] = [
|
||||
|
||||
]
|
||||
|
||||
export const formSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'id',
|
||||
label: 'id',
|
||||
component: 'Input',
|
||||
show: false
|
||||
},
|
||||
{
|
||||
field: 'customerName',
|
||||
label: '结算单位',
|
||||
component: 'ApiSelect',
|
||||
required: false,
|
||||
dynamicDisabled: ({ values }) => {
|
||||
return !!values.id
|
||||
},
|
||||
colProps: { span: 4 },
|
||||
componentProps: ({ formModel }) => {
|
||||
return {
|
||||
api: GetClientListByCode,
|
||||
labelField: 'pinYinCode',
|
||||
valueField: 'shortName',
|
||||
showName: 'shortName',
|
||||
resultField: 'data',
|
||||
immediate: false,
|
||||
onChange: (e, obj) => {
|
||||
if (e && obj) {
|
||||
formModel.customerId = obj.id
|
||||
}
|
||||
if (!e && !obj) {
|
||||
formModel.customerId = ''
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '',
|
||||
field: 'customerId',
|
||||
component: 'Input',
|
||||
show: false
|
||||
},
|
||||
{
|
||||
field: 'settlementDate',
|
||||
label: '结算日期',
|
||||
component: 'DatePicker',
|
||||
required: false,
|
||||
dynamicDisabled: false,
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '结算人id',
|
||||
field: 'settlerId',
|
||||
component: 'Input',
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
label: '结算人',
|
||||
field: 'settlerName',
|
||||
component: 'Input',
|
||||
required: false,
|
||||
colProps: { span: 4 },
|
||||
dynamicDisabled: true
|
||||
},
|
||||
{
|
||||
field: 'currency',
|
||||
label: '币别/金额',
|
||||
component: 'Input',
|
||||
dynamicDisabled: true,
|
||||
colProps: { span: 4 }
|
||||
},
|
||||
{
|
||||
field: 'settlementTypeId',
|
||||
label: '结算方式',
|
||||
component: 'ApiSelect',
|
||||
required: false,
|
||||
dynamicDisabled: false,
|
||||
colProps: { span: 4 },
|
||||
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: 'exchangeRate',
|
||||
label: '汇率',
|
||||
component: 'InputNumber',
|
||||
dynamicDisabled: true,
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
min: 0,
|
||||
precision: 6
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'line1',
|
||||
component: 'Divider',
|
||||
colProps: {
|
||||
span: 24
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'customerBankName',
|
||||
label: '客户银行',
|
||||
component: 'ApiSelect',
|
||||
required: false,
|
||||
dynamicDisabled: false,
|
||||
colProps: { span: 4 },
|
||||
componentProps: ({ formModel }) => {
|
||||
return {
|
||||
api: GetClientBank,
|
||||
params: {
|
||||
id: formModel.customerId
|
||||
},
|
||||
labelField: 'bankName',
|
||||
valueField: 'id',
|
||||
resultField: 'data',
|
||||
immediate: false,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
},
|
||||
onChange: (e, obj) => {
|
||||
console.log(obj)
|
||||
if (e && obj) {
|
||||
formModel.customerBankId = obj.value
|
||||
formModel.customerAccount = obj.bankAccountNo
|
||||
}
|
||||
if (!e && !obj) {
|
||||
formModel.customerBankId = null
|
||||
formModel.customerBankName = null
|
||||
formModel.customerAccount = null
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'customerBankId',
|
||||
label: '',
|
||||
component: 'Input',
|
||||
show: false
|
||||
},
|
||||
{
|
||||
field: 'customerAccount',
|
||||
label: '银行账号',
|
||||
component: 'Input',
|
||||
required: false,
|
||||
dynamicDisabled: false,
|
||||
colProps: { span: 4 }
|
||||
},
|
||||
{
|
||||
field: 'relativeNO',
|
||||
label: '相关号码',
|
||||
component: 'InputNumber',
|
||||
dynamicDisabled: true,
|
||||
colProps: { span: 4 }
|
||||
},
|
||||
{
|
||||
field: 'ledgerVoucherNO',
|
||||
label: '总账凭证号',
|
||||
component: 'InputNumber',
|
||||
dynamicDisabled: true,
|
||||
colProps: { span: 4 }
|
||||
},
|
||||
{
|
||||
label: '所属分部',
|
||||
field: 'saleOrgName',
|
||||
component: 'ApiSelect',
|
||||
required: false,
|
||||
colProps: { span: 4 },
|
||||
calssName: 'saleOrgId',
|
||||
componentProps: ({ formModel }) => {
|
||||
return {
|
||||
api: getOrgList,
|
||||
labelField: 'label',
|
||||
valueField: 'id',
|
||||
resultField: 'data',
|
||||
immediate: false,
|
||||
onChange: (e, obj) => {
|
||||
if (e && obj) {
|
||||
formModel.saleOrgName = obj.label
|
||||
formModel.saleOrgId = obj.id
|
||||
}
|
||||
if (!e && !obj) {
|
||||
formModel.saleOrgName = null
|
||||
formModel.saleOrgId = null
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'saleDeptId',
|
||||
label: '',
|
||||
component: 'Input',
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
field: 'invoiceNO',
|
||||
label: '发票号',
|
||||
component: 'InputNumber',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
min: 0,
|
||||
precision: 2
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'invoiceDate',
|
||||
label: '发票日期',
|
||||
component: 'DatePicker',
|
||||
dynamicDisabled: false,
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
showTime: true,
|
||||
allowClear: true,
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'invoiceAmount',
|
||||
label: '发票金额',
|
||||
component: 'InputNumber',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
min: 0,
|
||||
precision: 2
|
||||
}
|
||||
},
|
||||
// {
|
||||
// field: 'currency',
|
||||
// label: '币别',
|
||||
// component: 'ApiSelect',
|
||||
// required: false,
|
||||
// dynamicDisabled: ({ values }) => {
|
||||
// return !!values.id
|
||||
// },
|
||||
// defaultValue: null,
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: () => {
|
||||
// return {
|
||||
// option: optionsStore.getOptionsByCode('GetFeeCurrencySelectList'),
|
||||
// labelField: 'name',
|
||||
// valueField: 'codeName',
|
||||
// placeholder: '原币申请',
|
||||
// resultField: 'data',
|
||||
// immediate: false,
|
||||
// filterOption: (input: string, option: any) => {
|
||||
// return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
{
|
||||
field: 'line2',
|
||||
component: 'Divider',
|
||||
colProps: {
|
||||
span: 24
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'note',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
required: false,
|
||||
// defaultValue: '',
|
||||
colProps: { span: 12 },
|
||||
componentProps: {
|
||||
autoSize: { minRows: 3, maxRows: 3 },
|
||||
}
|
||||
}
|
||||
]
|
||||
export const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
label: '费用对象',
|
||||
field: 'customerId',
|
||||
component: 'ApiSelect',
|
||||
dynamicDisabled: false,
|
||||
colProps: { span: 4 },
|
||||
componentProps: () => {
|
||||
return {
|
||||
api: GetClientListByCode,
|
||||
labelField: 'pinYinCode',
|
||||
showName: 'shortName',
|
||||
valueField: 'id',
|
||||
resultField: 'data',
|
||||
immediate: false
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '编号查询',
|
||||
field: 'mblno:hblno:debitNo:hblno:bookingNO:customerNo',
|
||||
component: 'Input',
|
||||
dynamicDisabled: false,
|
||||
colProps: { span: 4 }
|
||||
},
|
||||
{
|
||||
label: '编号查询',
|
||||
field: 'mblno:hblno:debitNo',
|
||||
component: 'Input',
|
||||
dynamicDisabled: false,
|
||||
colProps: { span: 4 }
|
||||
},
|
||||
{
|
||||
field: 'accountDate',
|
||||
label: '会计期间',
|
||||
component: 'DatePicker',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
valueFormat: 'YYYY-MM'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isInvoice',
|
||||
label: '是否开票',
|
||||
component: 'Select',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
options: [
|
||||
{ label: '是', value: true },
|
||||
{ label: '否', value: false }
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isAdvancedPay',
|
||||
label: '是否垫付',
|
||||
component: 'Select',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
options: [
|
||||
{ label: '是', value: true },
|
||||
{ label: '否', value: false }
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '所属分部',
|
||||
field: 'saleOrgId',
|
||||
component: 'ApiSelect',
|
||||
required: false,
|
||||
colProps: { span: 4 },
|
||||
componentProps: () => {
|
||||
return {
|
||||
api: getOrgList,
|
||||
labelField: 'label',
|
||||
valueField: 'id',
|
||||
resultField: 'data',
|
||||
immediate: false
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
export const currencyFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'currency',
|
||||
label: '结算币别:',
|
||||
defaultValue: null,
|
||||
component: 'ApiSelect',
|
||||
colProps: { span: 5 },
|
||||
placeholder: '原币结算',
|
||||
componentProps: () => {
|
||||
return {
|
||||
allowClear: true,
|
||||
showSearch: true,
|
||||
option: optionsStore.getOptionsByCode('GetFeeCurrencySelectList'),
|
||||
labelField: 'codeName',
|
||||
valueField: 'codeName',
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,193 @@
|
||||
<!--
|
||||
* @Description: 操作管理 -> 付费申请 -> 申请明细
|
||||
* @Author: lijj
|
||||
* @Date: 2024-06-20 11:54:04
|
||||
-->
|
||||
<template>
|
||||
<div class="ds-settle-apply-detail-fee-info">
|
||||
<BasicTable @register="registerTable">
|
||||
<template #tableTitle>
|
||||
<div class="flex">
|
||||
<h4>结算明细</h4>
|
||||
<div>
|
||||
<a-button class="ml15" type="link" @click="add">
|
||||
<span class="iconfont icon-zengjiatianjiajiajian" :style="{ fontSize: '12px' }"></span>
|
||||
添加
|
||||
</a-button>
|
||||
<a-popconfirm
|
||||
:visible="deleteFlag"
|
||||
title="确定要删除勾选的数据?"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="del"
|
||||
@cancel="cancelDel"
|
||||
@click="checkDel"
|
||||
>
|
||||
<a-button type="link" >
|
||||
<span class="iconfont icon-shanchu1" :style="{ fontSize: '12px' }"></span>
|
||||
删除
|
||||
</a-button>
|
||||
</a-popconfirm>
|
||||
<!-- <a-button style="margin-left: 100px;" type="link" @click="exportExcel">
|
||||
<span class="iconfont icon-fujian" :style="{ fontSize: '12px' }"></span>
|
||||
导出
|
||||
</a-button> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #right>
|
||||
<Divider
|
||||
type="vertical"
|
||||
/>
|
||||
<div class="info">
|
||||
<feeTable
|
||||
style="width: 350px;"
|
||||
:tHeight="364"
|
||||
ref="feeTabel"
|
||||
></feeTable>
|
||||
</div>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<!-- <a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="2" tab="费用明细">
|
||||
<div>
|
||||
|
||||
</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 { columns } from './applyInfoColumns'
|
||||
// 引入附近上传组件
|
||||
import DsFile from "/@/components/File/index.vue"
|
||||
import { BatchDelMappingYard } from '../../api'
|
||||
import { exportExcelByData } from '/@/hooks/web/common'
|
||||
import { useMessage } from '/@/hooks/web/useMessage'
|
||||
import feeTable from '/@/components/CostEntry/components/feeTable.vue'
|
||||
const { createMessage } = useMessage()
|
||||
import { useRoute } from 'vue-router'
|
||||
const route = useRoute()
|
||||
const emit = defineEmits(['add', 'del'])
|
||||
const activeKey = ref('2')
|
||||
const props = defineProps({
|
||||
feeData: {
|
||||
type: Array
|
||||
},
|
||||
// 明细统计数据
|
||||
additionalData: {
|
||||
type: Object,
|
||||
default: {}
|
||||
},
|
||||
// 业务id
|
||||
id: {
|
||||
type: String
|
||||
},
|
||||
// 申请状态
|
||||
status: {
|
||||
type: [String, Number]
|
||||
}
|
||||
})
|
||||
const [registerTable, { reload, setTableData, getSelectRows, getColumns }] = useTable({
|
||||
title: '',
|
||||
columns,
|
||||
isTreeTable: false,
|
||||
pagination: false,
|
||||
striped: false,
|
||||
useSearchForm: false,
|
||||
showTableSetting: true,
|
||||
bordered: true,
|
||||
showIndexColumn: true,
|
||||
canResize: true,
|
||||
resizeHeightOffset: 15,
|
||||
rowSelection: { type: 'checkbox' },
|
||||
immediate: false,
|
||||
id: '1'
|
||||
})
|
||||
// 添加明细
|
||||
const add = () => {
|
||||
emit('add')
|
||||
}
|
||||
const deleteFlag = ref(false)
|
||||
// 删除
|
||||
const del = () => {
|
||||
const ids = getSelectRows().map(res => {
|
||||
return res.id
|
||||
})
|
||||
const postData = {
|
||||
id: props.id,
|
||||
ids
|
||||
}
|
||||
deleteFlag.value = false
|
||||
BatchDelMappingYard(postData).then(res => {
|
||||
if (res.succeeded) {
|
||||
createMessage.success('删除成功！')
|
||||
emit('del')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 导出
|
||||
const exportExcel = () => {
|
||||
exportExcelByData(props.feeData, getColumns(), '费用明细')
|
||||
}
|
||||
// 取消删除
|
||||
const cancelDel = () => {
|
||||
deleteFlag.value = false
|
||||
}
|
||||
// 校验是否选中行
|
||||
const checkDel = () => {
|
||||
if (props.status != 0) {
|
||||
return createMessage.warning('只能删除申请状态为[未提交]的数据，请重新选择！')
|
||||
}
|
||||
deleteFlag.value = true
|
||||
}
|
||||
watch(
|
||||
() => props.feeData,
|
||||
(list) => {
|
||||
if (list && list.length) {
|
||||
list.forEach(item => {
|
||||
if (item.amount) item.amount = item.amount.toLocaleString()
|
||||
if (item.originalAmount) item.originalAmount = item.originalAmount.toLocaleString()
|
||||
})
|
||||
}
|
||||
setTableData([...list])
|
||||
}
|
||||
)
|
||||
onMounted(() => {
|
||||
//初始化
|
||||
reload()
|
||||
})
|
||||
defineExpose({
|
||||
reload
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.ds-settle-apply-detail-fee-info {
|
||||
h4 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.flex {
|
||||
align-items: center;
|
||||
}
|
||||
.items-center {
|
||||
justify-content: space-between;
|
||||
}
|
||||
.vben-basic-table .ant-table-wrapper {
|
||||
padding: 0;
|
||||
.ant-table-title {
|
||||
padding: 4px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,106 @@
|
||||
/*
|
||||
* @Author: lijingjia lijj_xl@163.com
|
||||
* @Date: 2024-06-21 16:59:01
|
||||
* @Description:
|
||||
*/
|
||||
import { commentProps } from 'ant-design-vue/lib/comment'
|
||||
import { BasicColumn, FormSchema } from '/@/components/Table'
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '委托编号',
|
||||
dataIndex: 'customerNo',
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
title: '主提单号',
|
||||
dataIndex: 'mblno',
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
title: '委托单位',
|
||||
dataIndex: 'customerName',
|
||||
width: 140,
|
||||
},
|
||||
{
|
||||
title: '开船日期',
|
||||
dataIndex: 'etd',
|
||||
width: 90,
|
||||
},
|
||||
{
|
||||
title: '业务来源',
|
||||
dataIndex: 'sourceName',
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
title: '费用名称',
|
||||
dataIndex: 'feeName',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: '收付',
|
||||
dataIndex: 'feeType',
|
||||
width: 80,
|
||||
customRender: ({ text }) => {
|
||||
if (text === 1) {
|
||||
return '应收'
|
||||
} else if (text === 2) {
|
||||
return '应付'
|
||||
}
|
||||
return text
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '费用对象',
|
||||
dataIndex: 'customerName',
|
||||
width: 110,
|
||||
},
|
||||
{
|
||||
title: '申请金额',
|
||||
dataIndex: 'amount',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '原始币别',
|
||||
dataIndex: 'originalCurrency',
|
||||
width: 100,
|
||||
},
|
||||
// {
|
||||
// title: '原始汇率',
|
||||
// dataIndex: 'originalCurrency',
|
||||
// width: 200,
|
||||
// },
|
||||
{
|
||||
title: '折算汇率',
|
||||
dataIndex: 'exchangeRate',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
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,88 @@
|
||||
<!--
|
||||
* @Description: 引入抽屉组件
|
||||
* @Author: lijj
|
||||
* @Date: 2024-05-07 15:19:07
|
||||
-->
|
||||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<BasicTable
|
||||
style="width: 440px;"
|
||||
class="ds-table-detail"
|
||||
:scroll="{ x: '100%', y: 400 }"
|
||||
@register="registerTable"
|
||||
>
|
||||
</BasicTable>
|
||||
</a-spin>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, defineExpose, watch, defineProps } from 'vue'
|
||||
// 费用信息表格
|
||||
import { feeColumns } from '../columns'
|
||||
// 根据记录id查询费用
|
||||
import { GetApplicationDetailsById } from '../../api'
|
||||
// 模版id查询费用
|
||||
import { GetFeeTemplateDetailList } from '/@/views/fee/template/api'
|
||||
import { BasicTable, useTable } from '/@/components/Table'
|
||||
// 付费申请id, 根据id查费用详细信息
|
||||
const id = ref(null)
|
||||
const [registerTable, { reload, getForm, getSelectRowKeys, getPaginationRef, getSelectRows, setSelectedRows, getDataSource }] = useTable({
|
||||
api: async (p) => {
|
||||
const res = await GetApplicationDetailsById(p)
|
||||
res.data.forEach((item, index) => {
|
||||
item['idIndex'] = item.id + index
|
||||
})
|
||||
return new Promise((resolve) => {
|
||||
resolve({ data: [...res.data], total: res.count })
|
||||
})
|
||||
},
|
||||
beforeFetch: () => {
|
||||
return { id: id.value }
|
||||
},
|
||||
columns: feeColumns,
|
||||
pagination: false,
|
||||
striped: false,
|
||||
useSearchForm: false,
|
||||
showTableSetting: true,
|
||||
bordered: true,
|
||||
showIndexColumn: false,
|
||||
canResize: false,
|
||||
immediate: false
|
||||
})
|
||||
const init = (id) => {
|
||||
id.value = id
|
||||
reload()
|
||||
}
|
||||
const loading = ref(false)
|
||||
defineExpose({
|
||||
init
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.ds-fee-table {
|
||||
padding: 0;
|
||||
.ant-table-cell {
|
||||
padding: 5px 12px;
|
||||
}
|
||||
.count-calc {
|
||||
background: #ffffff;
|
||||
font-size: 12px;
|
||||
height: 34px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.count {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #257AFA;
|
||||
}
|
||||
.ml10 {
|
||||
background: #F5F9FC;
|
||||
padding: 0 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue