|
|
|
@ -14,17 +14,25 @@
|
|
|
|
|
<div class="TableBox">
|
|
|
|
|
<div class="BoxUnit">
|
|
|
|
|
<div class="model-botton-box">
|
|
|
|
|
<a-button class="btn" type="primary" @click="AddLlist">新增费用字段</a-button>
|
|
|
|
|
<a-button class="btn btn-delete" @click="DelLlist">删除费用字段</a-button>
|
|
|
|
|
<a-upload
|
|
|
|
|
:file-list="fileList"
|
|
|
|
|
:before-upload="beforeUpload"
|
|
|
|
|
name="file"
|
|
|
|
|
:custom-request="uploadFile"
|
|
|
|
|
>
|
|
|
|
|
<a-button class="btn" type="primary">导入对账excel</a-button>
|
|
|
|
|
</a-upload>
|
|
|
|
|
<!-- <a-button class="btn" type="primary" @click="Addlist">新增费用字段</a-button> -->
|
|
|
|
|
<!-- <a-button class="btn btn-delete" @click="Dellist">删除费用字段</a-button> -->
|
|
|
|
|
</div>
|
|
|
|
|
<div style="position: relative">
|
|
|
|
|
<input
|
|
|
|
|
class="ds-tb-check"
|
|
|
|
|
type="checkbox"
|
|
|
|
|
v-model="allCheckL"
|
|
|
|
|
:indeterminate="someCheckL"
|
|
|
|
|
v-model="allCheck"
|
|
|
|
|
:indeterminate="someCheck"
|
|
|
|
|
/>
|
|
|
|
|
<hot-table :data="Llist" :settings="Lsettings"> </hot-table>
|
|
|
|
|
<hot-table ref="hotTb" :data="list" :settings="Lsettings"> </hot-table>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -58,7 +66,8 @@
|
|
|
|
|
</template>
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
|
import { ref, computed, unref, watchEffect, watch } from 'vue'
|
|
|
|
|
import { ApiEdit, ApiInfo } from './api'
|
|
|
|
|
import { ApiEdit, ApiInfo, ApiBasicsList, ApiImport } from './api'
|
|
|
|
|
import { GetClientListByCode } from '/@/api/common'
|
|
|
|
|
import { BasicForm, useForm } from '/@/components/Form/index'
|
|
|
|
|
import { formSchema } from './columns'
|
|
|
|
|
import { useMessage } from '/@/hooks/web/useMessage'
|
|
|
|
@ -68,6 +77,8 @@
|
|
|
|
|
import { registerAllModules } from 'handsontable/registry'
|
|
|
|
|
import 'handsontable/dist/handsontable.full.min.css'
|
|
|
|
|
registerAllModules()
|
|
|
|
|
import { useOptionsStore } from '/@/store/modules/options'
|
|
|
|
|
const optionsStore = useOptionsStore()
|
|
|
|
|
// ------------------------------------弹窗------------------------------------------
|
|
|
|
|
const getTitle = computed(() => (!unref(isUpdate) ? '新增对账模板' : '编辑对账模板'))
|
|
|
|
|
const emit = defineEmits(['success'])
|
|
|
|
@ -76,8 +87,8 @@
|
|
|
|
|
const rowId = ref('')
|
|
|
|
|
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
|
|
|
|
resetFields()
|
|
|
|
|
allCheckL.value = false
|
|
|
|
|
someCheckL.value = false
|
|
|
|
|
allCheck.value = false
|
|
|
|
|
someCheck.value = false
|
|
|
|
|
setModalProps({ confirmLoading: false, loading: true })
|
|
|
|
|
isUpdate.value = !!data?.isUpdate
|
|
|
|
|
if (unref(isUpdate)) {
|
|
|
|
@ -88,7 +99,24 @@
|
|
|
|
|
setFieldsValue({
|
|
|
|
|
...res.data,
|
|
|
|
|
})
|
|
|
|
|
Llist.value.push(...res.data)
|
|
|
|
|
let ApiData = {
|
|
|
|
|
queryCondition: JSON.stringify({
|
|
|
|
|
FieldName: 'checkId',
|
|
|
|
|
FieldValue: rowId.value,
|
|
|
|
|
ConditionalType: 1,
|
|
|
|
|
}),
|
|
|
|
|
pageCondition: {
|
|
|
|
|
pageIndex: 1,
|
|
|
|
|
pageSize: 9999,
|
|
|
|
|
sortConditions: [],
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
const e: API.DataResult = await ApiBasicsList(ApiData)
|
|
|
|
|
if (e.succeeded) {
|
|
|
|
|
list.value.push(...e.data)
|
|
|
|
|
} else {
|
|
|
|
|
setModalProps({ confirmLoading: false })
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
setModalProps({ confirmLoading: false })
|
|
|
|
|
} else {
|
|
|
|
@ -102,15 +130,15 @@
|
|
|
|
|
setFieldsValue({
|
|
|
|
|
...res.data,
|
|
|
|
|
})
|
|
|
|
|
Llist.value.splice(0)
|
|
|
|
|
Llist.value.push(...res.data)
|
|
|
|
|
list.value.splice(0)
|
|
|
|
|
list.value.push(...res.data)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 保存
|
|
|
|
|
async function handleSave(exit) {
|
|
|
|
|
try {
|
|
|
|
|
const values = await validate()
|
|
|
|
|
values.feeList = Llist.value
|
|
|
|
|
values.feeList = list.value
|
|
|
|
|
setModalProps({ confirmLoading: true, loading: true })
|
|
|
|
|
const res: API.DataResult = await ApiEdit(values)
|
|
|
|
|
console.log(res)
|
|
|
|
@ -138,7 +166,7 @@
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
function FnClose() {
|
|
|
|
|
Llist.value.splice(0)
|
|
|
|
|
list.value.splice(0)
|
|
|
|
|
closeModal()
|
|
|
|
|
}
|
|
|
|
|
async function refresh() {
|
|
|
|
@ -157,25 +185,25 @@
|
|
|
|
|
})
|
|
|
|
|
// ------------------------------------左侧表------------------------------------------
|
|
|
|
|
// 全部勾选
|
|
|
|
|
const allCheckL = ref(false)
|
|
|
|
|
const allCheck = ref(false)
|
|
|
|
|
// 部分勾选
|
|
|
|
|
const someCheckL = ref(false)
|
|
|
|
|
const Llist = ref<any>([])
|
|
|
|
|
const someCheck = ref(false)
|
|
|
|
|
const list = ref<any>([])
|
|
|
|
|
watchEffect(() => {
|
|
|
|
|
// 全选
|
|
|
|
|
if (allCheckL.value) {
|
|
|
|
|
Llist.value.forEach((item) => {
|
|
|
|
|
if (allCheck.value) {
|
|
|
|
|
list.value.forEach((item) => {
|
|
|
|
|
item.selected = true
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
// 取消全选
|
|
|
|
|
Llist.value.forEach((item) => {
|
|
|
|
|
list.value.forEach((item) => {
|
|
|
|
|
item.selected = false
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
watch(
|
|
|
|
|
Llist.value,
|
|
|
|
|
list.value,
|
|
|
|
|
(val) => {
|
|
|
|
|
let a = 0
|
|
|
|
|
let b = 0
|
|
|
|
@ -187,23 +215,37 @@
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
if (a == 0) {
|
|
|
|
|
allCheckL.value = false
|
|
|
|
|
allCheck.value = false
|
|
|
|
|
}
|
|
|
|
|
if (b == 0) {
|
|
|
|
|
allCheckL.value = true
|
|
|
|
|
allCheck.value = true
|
|
|
|
|
}
|
|
|
|
|
if (a != 0 && b != 0) {
|
|
|
|
|
someCheckL.value = true
|
|
|
|
|
someCheck.value = true
|
|
|
|
|
} else {
|
|
|
|
|
someCheckL.value = false
|
|
|
|
|
someCheck.value = false
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
deep: true,
|
|
|
|
|
},
|
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
const LColumns = [
|
|
|
|
|
const hotTb = ref()
|
|
|
|
|
// 结算单位字典数据
|
|
|
|
|
const companyDict = ref([])
|
|
|
|
|
// 船名字典数据
|
|
|
|
|
const vesselDict = ref([])
|
|
|
|
|
const isEqualData = ref([
|
|
|
|
|
{
|
|
|
|
|
name: '是',
|
|
|
|
|
value: true,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: '否',
|
|
|
|
|
value: false,
|
|
|
|
|
},
|
|
|
|
|
])
|
|
|
|
|
const Columns = [
|
|
|
|
|
{
|
|
|
|
|
data: 'selected',
|
|
|
|
|
type: 'checkbox',
|
|
|
|
@ -218,84 +260,158 @@
|
|
|
|
|
data: 'id',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '模板Id',
|
|
|
|
|
title: '对账Id',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'checkId',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '结算单位Id',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'templateId',
|
|
|
|
|
data: 'customerId',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '船名Id',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'vesselId',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '操作员Id',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'operatorId',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '揽货人Id',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'saleId',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '主提单号',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'feeName',
|
|
|
|
|
data: 'mblno',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '本地RMB金额',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
type: 'numeric',
|
|
|
|
|
data: 'rmbLocalAmount',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '本地USD金额',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
type: 'numeric',
|
|
|
|
|
data: 'usdLocalAmount',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '对账RMB金额',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
type: 'numeric',
|
|
|
|
|
data: 'rmbCheckAmount',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '对账USD金额',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
type: 'numeric',
|
|
|
|
|
data: 'usdCheckAmount',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: 'RMB差异',
|
|
|
|
|
title: 'RMB差异金额',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
type: 'numeric',
|
|
|
|
|
data: 'rmbDifferenceAmount',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '委托单位',
|
|
|
|
|
title: 'USD差异金额',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
type: 'numeric',
|
|
|
|
|
data: 'usdDifferenceAmount',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '结算USD',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
title: '结算单位',
|
|
|
|
|
width: 130,
|
|
|
|
|
data: 'customerName',
|
|
|
|
|
type: 'dropdown',
|
|
|
|
|
source: async (query, process) => {
|
|
|
|
|
const rowIndex = hotTb.value.hotInstance.getActiveEditor().row
|
|
|
|
|
const code = list.value[rowIndex]?.customerType || null
|
|
|
|
|
GetClientListByCode({ code }).then((res) => {
|
|
|
|
|
const { data } = res
|
|
|
|
|
data.forEach((item) => {
|
|
|
|
|
item['label'] = item.shortName
|
|
|
|
|
item['value'] = item.codeName
|
|
|
|
|
})
|
|
|
|
|
companyDict.value = data
|
|
|
|
|
const dict = data.map((item) => {
|
|
|
|
|
return item.codeName + '-' + item.shortName
|
|
|
|
|
})
|
|
|
|
|
process(dict)
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '船名',
|
|
|
|
|
title: '开船日期',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
data: 'etd',
|
|
|
|
|
type: 'date',
|
|
|
|
|
dateFormat: 'YYYY-MM-DD',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '航次',
|
|
|
|
|
title: '船名',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
data: 'vessel',
|
|
|
|
|
type: 'dropdown',
|
|
|
|
|
source: async (query, process) => {
|
|
|
|
|
let data = optionsStore.getOptionsByCode('GetVesselSelectList')
|
|
|
|
|
vesselDict.value = data
|
|
|
|
|
const dict = data.map((item) => {
|
|
|
|
|
return item.vesselName
|
|
|
|
|
})
|
|
|
|
|
process(dict)
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '开船日期',
|
|
|
|
|
title: '海关航次',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
data: 'voyno',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '操作员',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
data: 'operatorName',
|
|
|
|
|
type: 'dropdown',
|
|
|
|
|
source: async (query, process) => {
|
|
|
|
|
let data = optionsStore.getOptionsByCode('GetCustomerServiceList')
|
|
|
|
|
vesselDict.value = data
|
|
|
|
|
const dict = data.map((item) => {
|
|
|
|
|
return item.userName
|
|
|
|
|
})
|
|
|
|
|
process(dict)
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '揽货人',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '说明',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
data: 'saleName',
|
|
|
|
|
type: 'dropdown',
|
|
|
|
|
source: async (query, process) => {
|
|
|
|
|
let data = optionsStore.getOptionsByCode('GetSaleList')
|
|
|
|
|
vesselDict.value = data
|
|
|
|
|
const dict = data.map((item) => {
|
|
|
|
|
return item.userName
|
|
|
|
|
})
|
|
|
|
|
process(dict)
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '一致',
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'currency',
|
|
|
|
|
title: '是否一致',
|
|
|
|
|
width: 80,
|
|
|
|
|
data: 'isEqual',
|
|
|
|
|
type: 'dropdown',
|
|
|
|
|
source: async (query, process) => {
|
|
|
|
|
const dict = isEqualData.value.map((res) => {
|
|
|
|
|
return res.name
|
|
|
|
|
})
|
|
|
|
|
process(dict)
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
]
|
|
|
|
|
const Lsettings = {
|
|
|
|
@ -308,7 +424,7 @@
|
|
|
|
|
fixedColumnsLeft: 1,
|
|
|
|
|
// 需要隐藏的列
|
|
|
|
|
hiddenColumns: {
|
|
|
|
|
columns: [1, 2],
|
|
|
|
|
columns: [1, 2, 3, 4, 5, 6],
|
|
|
|
|
indicators: true,
|
|
|
|
|
},
|
|
|
|
|
columnSorting: true,
|
|
|
|
@ -323,29 +439,88 @@
|
|
|
|
|
// hotTb.value.hotInstance.setDataAtRowProp(row, prop, '')
|
|
|
|
|
// }
|
|
|
|
|
// },
|
|
|
|
|
columns: LColumns,
|
|
|
|
|
columns: Columns,
|
|
|
|
|
// 此行直接复制,必须(非商用)
|
|
|
|
|
licenseKey: 'non-commercial-and-evaluation',
|
|
|
|
|
enterMoves: 'row',
|
|
|
|
|
// 定义所有单元格发生变化的回调处理
|
|
|
|
|
afterChange(changes, source) {},
|
|
|
|
|
afterChange(changes, source) {
|
|
|
|
|
if (source === 'edit' || source === 'Autofill.fill' || source === 'CopyPaste.paste') {
|
|
|
|
|
let dict = {}
|
|
|
|
|
changes.forEach((res) => {
|
|
|
|
|
// 修改结算单位
|
|
|
|
|
if (res[1] === 'customerName') {
|
|
|
|
|
const item: any = companyDict.value.filter((item: any) => {
|
|
|
|
|
return changes[0][3].includes(item.codeName + '-' + item.shortName)
|
|
|
|
|
})
|
|
|
|
|
if (item) dict = item[0]
|
|
|
|
|
list.value[res[0]]['customerId'] = dict['id']
|
|
|
|
|
}
|
|
|
|
|
// 修改船名
|
|
|
|
|
if (res[1] === 'vessel') {
|
|
|
|
|
const item: any = vesselDict.value.filter((item: any) => {
|
|
|
|
|
return changes[0][3].includes(item.vesselName)
|
|
|
|
|
})
|
|
|
|
|
if (item) dict = item[0]
|
|
|
|
|
list.value[res[0]]['vesselId'] = dict['id']
|
|
|
|
|
}
|
|
|
|
|
// 修改操作
|
|
|
|
|
if (res[1] === 'operatorName') {
|
|
|
|
|
const item: any = vesselDict.value.filter((item: any) => {
|
|
|
|
|
return changes[0][3].includes(item.userName)
|
|
|
|
|
})
|
|
|
|
|
if (item) dict = item[0]
|
|
|
|
|
list.value[res[0]]['operatorId'] = dict['id']
|
|
|
|
|
}
|
|
|
|
|
// 修改揽货人
|
|
|
|
|
if (res[1] === 'saleName') {
|
|
|
|
|
const item: any = vesselDict.value.filter((item: any) => {
|
|
|
|
|
return changes[0][3].includes(item.userName)
|
|
|
|
|
})
|
|
|
|
|
if (item) dict = item[0]
|
|
|
|
|
list.value[res[0]]['saleId'] = dict['id']
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
// 导入 EXCEL
|
|
|
|
|
const fileList = ref([])
|
|
|
|
|
function beforeUpload(file) {
|
|
|
|
|
console.log(file)
|
|
|
|
|
}
|
|
|
|
|
function uploadFile(file) {
|
|
|
|
|
const formData = new FormData()
|
|
|
|
|
let Did: any = rowId.value
|
|
|
|
|
formData.append('id', Did)
|
|
|
|
|
formData.append('file', file.file)
|
|
|
|
|
ApiImport({
|
|
|
|
|
data: formData,
|
|
|
|
|
// parameter: { LinkId: Did, TypeCode: 'other', TypeName: '其他' },
|
|
|
|
|
}).then((res) => {
|
|
|
|
|
if (res.succeeded) {
|
|
|
|
|
list.value.push(...res.data)
|
|
|
|
|
} else {
|
|
|
|
|
notification.error({ message: res.message, duration: 3 })
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
function AddLlist() {
|
|
|
|
|
Llist.value.push({})
|
|
|
|
|
function Addlist() {
|
|
|
|
|
list.value.push({})
|
|
|
|
|
}
|
|
|
|
|
async function DelLlist() {
|
|
|
|
|
async function Dellist() {
|
|
|
|
|
const data = await validate()
|
|
|
|
|
if (data.id) {
|
|
|
|
|
let ApiData: any = { id: data.id, ids: [] }
|
|
|
|
|
Llist.value.forEach((e, i) => {
|
|
|
|
|
list.value.forEach((e, i) => {
|
|
|
|
|
if (e.selected && e.id) {
|
|
|
|
|
ApiData.ids.push(e.id)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
Llist.value.forEach((e, i) => {
|
|
|
|
|
list.value.forEach((e, i) => {
|
|
|
|
|
if (e.selected) {
|
|
|
|
|
Llist.value.splice(i, 1)
|
|
|
|
|
list.value.splice(i, 1)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|