箱管-下线审核_基础页面 往来单位-校验按钮
parent
fd0c8d4533
commit
443c732f75
@ -0,0 +1,98 @@
|
|||||||
|
// @ts-ignore
|
||||||
|
import { request } from '/@/utils/request'
|
||||||
|
import { DataResult, PageRequest } from '/@/api/model/baseModel'
|
||||||
|
enum Api {
|
||||||
|
list = '/containerManagementApi/CM_State_Change/GetCM_State_ChangeList',
|
||||||
|
edit = '/containerManagementApi/CM_State_Change/EditCM_State_Change',
|
||||||
|
multiEdit = '/containerManagementApi/CM_State_Change/CM_State_Change_Multi',
|
||||||
|
Changeinfo = '/containerManagementApi/CM_State_Change/GetCM_State_Change',
|
||||||
|
Changedel = '/containerManagementApi/CM_State_Change/DeleteCM_State_Change',
|
||||||
|
|
||||||
|
info = '/containerManagementApi/CM_CurrentState/GetCM_CurrentStateInfo',
|
||||||
|
del = '/mainApi/CodeCtn/BatchDelCodeCtn',
|
||||||
|
BasicsList = '/mainApi/CodeCtn/GetBasicsCodeCtnList',
|
||||||
|
ExistList = '/mainApi/CodeCtn/GetExistCodeCtnList',
|
||||||
|
Import = '/mainApi/CodeCtn/ImportCodeCtn',
|
||||||
|
}
|
||||||
|
// 列表 (Auth)
|
||||||
|
export function ApiChangeList(data: PageRequest) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.list,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 批量编辑状态 (Auth)
|
||||||
|
export function ApiMultiEdit(data: PageRequest) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.multiEdit,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 编辑 (Auth)
|
||||||
|
export function ApiEdit(data: PageRequest) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.edit,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 详情 (Auth)
|
||||||
|
export function ApiChangeInfo(query) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.Changeinfo,
|
||||||
|
method: 'get',
|
||||||
|
params: query,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 详情 (Auth)
|
||||||
|
export function ApiInfo(query) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.info,
|
||||||
|
method: 'get',
|
||||||
|
params: query,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 批量删除 (Auth)
|
||||||
|
export function ApiChangeDel(data: PageRequest) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.Changedel,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 批量删除 (Auth)
|
||||||
|
export function ApiDel(data: PageRequest) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.del,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 获取商品类型列表-基础库 (Auth)
|
||||||
|
export function ApiBasicsList(data: PageRequest) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.BasicsList,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 获取当前租户已有的商品类型 (Auth)
|
||||||
|
export function ApiExistList() {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.ExistList,
|
||||||
|
method: 'get',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 导入商品类型列表-基础库 (Auth)
|
||||||
|
export function ApiImport(data: PageRequest) {
|
||||||
|
return request<DataResult>({
|
||||||
|
url: Api.Import,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
@ -0,0 +1,778 @@
|
|||||||
|
import { ref } from 'vue'
|
||||||
|
import { BasicColumn, FormSchema } from '/@/components/Table'
|
||||||
|
import { Tag } from 'ant-design-vue'
|
||||||
|
import { GetCtnSelectList, GetClientListByCode } from '/@/api/common'
|
||||||
|
import { GetDeptList } from '/@/views/operation/seaexport/api/BookingLedger'
|
||||||
|
import { useOptionsStore } from '/@/store/modules/options'
|
||||||
|
const optionsStore = useOptionsStore()
|
||||||
|
// 字典
|
||||||
|
import { getDictOption } from '/@/utils/dictUtil'
|
||||||
|
// 新旧箱数据
|
||||||
|
const usedStateList = [
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
value: '',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'USED',
|
||||||
|
value: 'USED',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'NEW',
|
||||||
|
value: 'NEW',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export const columns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '箱号',
|
||||||
|
dataIndex: 'cntrno',
|
||||||
|
sorter: true,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '箱型',
|
||||||
|
dataIndex: 'ctnall',
|
||||||
|
sorter: true,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '序号',
|
||||||
|
dataIndex: 'index',
|
||||||
|
width: 50,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '箱状态',
|
||||||
|
dataIndex: 'ctnState',
|
||||||
|
sorter: true,
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '箱流转状态',
|
||||||
|
dataIndex: 'ctnFlowState',
|
||||||
|
sorter: true,
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '船名',
|
||||||
|
dataIndex: 'vessel',
|
||||||
|
sorter: true,
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '航次',
|
||||||
|
dataIndex: 'voyno',
|
||||||
|
sorter: true,
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '提单号',
|
||||||
|
dataIndex: 'mblno',
|
||||||
|
sorter: true,
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '发生日期',
|
||||||
|
dataIndex: 'changeTime',
|
||||||
|
sorter: true,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '空重箱',
|
||||||
|
dataIndex: 'isHeavy',
|
||||||
|
sorter: true,
|
||||||
|
width: 80,
|
||||||
|
customRender: ({ text }) => {
|
||||||
|
if (text) {
|
||||||
|
return <Tag color="success">重箱</Tag>
|
||||||
|
} else {
|
||||||
|
return <Tag color="error">空箱</Tag>
|
||||||
|
}
|
||||||
|
return text
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '始发港',
|
||||||
|
dataIndex: 'portLoad',
|
||||||
|
sorter: true,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '目的港',
|
||||||
|
dataIndex: 'portDelivery',
|
||||||
|
sorter: true,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '预抵港',
|
||||||
|
dataIndex: 'portDischarge',
|
||||||
|
sorter: true,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '码头或场站',
|
||||||
|
dataIndex: 'depot',
|
||||||
|
sorter: true,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '关联合同号',
|
||||||
|
dataIndex: 'ctnReleaseNo',
|
||||||
|
sorter: true,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '备注',
|
||||||
|
dataIndex: 'remark',
|
||||||
|
sorter: true,
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '录入时间',
|
||||||
|
dataIndex: 'createTime',
|
||||||
|
sorter: true,
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// title: '当前港口',
|
||||||
|
// dataIndex: 'port',
|
||||||
|
// sorter: true,
|
||||||
|
// width: 150,
|
||||||
|
// },
|
||||||
|
|
||||||
|
// {
|
||||||
|
// title: '变动来源',
|
||||||
|
// dataIndex: 'changeSource',
|
||||||
|
// sorter: true,
|
||||||
|
// width: 150,
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// title: '状态变动',
|
||||||
|
// dataIndex: 'ctnFlowState',
|
||||||
|
// sorter: true,
|
||||||
|
// width: 200,
|
||||||
|
// },
|
||||||
|
|
||||||
|
// {
|
||||||
|
// title: '新旧箱',
|
||||||
|
// dataIndex: 'usedState',
|
||||||
|
// sorter: true,
|
||||||
|
// width: 200,
|
||||||
|
// },
|
||||||
|
|
||||||
|
// {
|
||||||
|
// title: '箱状态',
|
||||||
|
// dataIndex: 'ctnState',
|
||||||
|
// sorter: true,
|
||||||
|
// width: 200,
|
||||||
|
// },
|
||||||
|
]
|
||||||
|
|
||||||
|
export const searchFormSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
field: 'cntrno',
|
||||||
|
label: '箱号',
|
||||||
|
component: 'InputTextArea',
|
||||||
|
colProps: { span: 8 },
|
||||||
|
componentProps: {
|
||||||
|
validateOnRuleChange: false,
|
||||||
|
placeholder: '可输入多个箱号',
|
||||||
|
rows: 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// field: 'changeTime',
|
||||||
|
// label: '状态时间',
|
||||||
|
// component: 'RangePicker',
|
||||||
|
// required: false,
|
||||||
|
// dynamicDisabled: false,
|
||||||
|
// colProps: { span: 4 },
|
||||||
|
// componentProps: {
|
||||||
|
// allowClear: true,
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// field: 'ctnBizState',
|
||||||
|
// label: '箱业务状态',
|
||||||
|
// component: 'ApiSelect',
|
||||||
|
// colProps: { span: 4 },
|
||||||
|
// defaultValue: '',
|
||||||
|
// componentProps: ({ formModel }) => {
|
||||||
|
// return {
|
||||||
|
// api: () => {
|
||||||
|
// return new Promise((resolve) => {
|
||||||
|
// getDictOption('CM_CtnBizState').then((res) => {
|
||||||
|
// resolve(res)
|
||||||
|
// })
|
||||||
|
// })
|
||||||
|
// },
|
||||||
|
// labelField: 'label',
|
||||||
|
// valueField: 'label',
|
||||||
|
// resultField: 'data',
|
||||||
|
// filterOption: (input: string, option: any) => {
|
||||||
|
// return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
// },
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// field: 'changeSourceId',
|
||||||
|
// label: '变动来源',
|
||||||
|
// component: 'ApiSelect',
|
||||||
|
// colProps: { span: 4 },
|
||||||
|
// defaultValue: '',
|
||||||
|
// componentProps: ({ formModel }) => {
|
||||||
|
// return {
|
||||||
|
// api: () => {
|
||||||
|
// return new Promise((resolve) => {
|
||||||
|
// getDictOption('CM_ChangeSource').then((res) => {
|
||||||
|
// resolve(res)
|
||||||
|
// })
|
||||||
|
// })
|
||||||
|
// },
|
||||||
|
// labelField: 'label',
|
||||||
|
// valueField: 'value',
|
||||||
|
// resultField: 'data',
|
||||||
|
// filterOption: (input: string, option: any) => {
|
||||||
|
// return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
// },
|
||||||
|
// onChange: (v, obj) => {},
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// field: 'etd',
|
||||||
|
// label: 'ETD',
|
||||||
|
// component: 'DatePicker',
|
||||||
|
// colProps: { span: 4 },
|
||||||
|
// defaultValue: '',
|
||||||
|
// componentProps: {
|
||||||
|
// showTime: true,
|
||||||
|
// style: 'width:100%',
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// field: 'Space',
|
||||||
|
// label: '',
|
||||||
|
// component: 'Space',
|
||||||
|
// colProps: { span: 4 },
|
||||||
|
// defaultValue: '',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// field: 'eta',
|
||||||
|
// label: 'ETA',
|
||||||
|
// component: 'DatePicker',
|
||||||
|
// colProps: { span: 4 },
|
||||||
|
// defaultValue: '',
|
||||||
|
// componentProps: {
|
||||||
|
// showTime: true,
|
||||||
|
// style: 'width:100%',
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
]
|
||||||
|
export const formSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'id',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'cntrno',
|
||||||
|
label: '集装箱号',
|
||||||
|
component: 'InputTextArea',
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
trigger: 'blur',
|
||||||
|
message: '请输入集装箱号',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
colProps: { span: 24 },
|
||||||
|
componentProps: {
|
||||||
|
validateOnRuleChange: false,
|
||||||
|
placeholder: '请输入,多个箱号请以“,”逗号间隔',
|
||||||
|
rows: 3,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'isOnlineId',
|
||||||
|
label: '是否上线',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
defaultValue: '',
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
api: () => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
getDictOption('CM_IsOnlineEnum').then((res) => {
|
||||||
|
resolve(res)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
labelField: 'label',
|
||||||
|
valueField: 'value',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'changeSourceId',
|
||||||
|
label: '变动来源',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
defaultValue: '',
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
api: () => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
getDictOption('CM_ChangeSource').then((res) => {
|
||||||
|
resolve(res)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
labelField: 'label',
|
||||||
|
valueField: 'value',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'usedState',
|
||||||
|
label: '新旧箱',
|
||||||
|
component: 'Select',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
componentProps: {
|
||||||
|
options: usedStateList,
|
||||||
|
allowClear: true,
|
||||||
|
showSearch: true,
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnOwner',
|
||||||
|
label: '箱主',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
required: false,
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 6 },
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
allowClear: true,
|
||||||
|
showSearch: true,
|
||||||
|
api: GetClientListByCode,
|
||||||
|
params: { code: 'leasing' },
|
||||||
|
labelField: 'pinYinCode',
|
||||||
|
showName: 'shortName',
|
||||||
|
valueField: 'shortName',
|
||||||
|
resultField: 'data',
|
||||||
|
immediate: true,
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnSourceId',
|
||||||
|
label: '箱来源',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
defaultValue: '',
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
api: () => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
getDictOption('CM_CtnSource').then((res) => {
|
||||||
|
resolve(res)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
labelField: 'label',
|
||||||
|
valueField: 'value',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'ctnBizState',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnBizStateId',
|
||||||
|
label: '箱业务状态',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
defaultValue: '',
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
api: () => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
getDictOption('CM_CtnBizState').then((res) => {
|
||||||
|
resolve(res)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
labelField: 'label',
|
||||||
|
valueField: 'value',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {
|
||||||
|
formModel.ctnBizState = obj.label
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'billno',
|
||||||
|
label: '箱业务编号',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnReleaseNo',
|
||||||
|
label: '关联合同号',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
// required: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnStateId',
|
||||||
|
label: '箱状态',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
defaultValue: '',
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
api: () => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
getDictOption('CM_CtnState').then((res) => {
|
||||||
|
resolve(res)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
labelField: 'label',
|
||||||
|
valueField: 'value',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnBreakState',
|
||||||
|
label: '箱损坏',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'isHeavy',
|
||||||
|
label: '空重箱',
|
||||||
|
component: 'Switch',
|
||||||
|
defaultValue: false,
|
||||||
|
colProps: { span: 6 },
|
||||||
|
componentProps: {
|
||||||
|
checkedChildren: '重箱',
|
||||||
|
unCheckedChildren: '空箱',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'portLoadCode',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'portLoad',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'portLoadid',
|
||||||
|
label: '始发港',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
required: false,
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetClientPortSelectList'),
|
||||||
|
labelField: 'portName',
|
||||||
|
valueField: 'id',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {
|
||||||
|
console.log(v, obj)
|
||||||
|
formModel.portLoad = obj?.label || ''
|
||||||
|
formModel.portLoadCode = obj?.ediCode || ''
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'portDeliveryCode',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'portDelivery',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'portDeliveryid',
|
||||||
|
label: '目的港',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
required: false,
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetClientPortSelectList'),
|
||||||
|
labelField: 'portName',
|
||||||
|
valueField: 'id',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {
|
||||||
|
console.log(v, obj)
|
||||||
|
formModel.portDelivery = obj?.label || ''
|
||||||
|
formModel.portDeliveryCode = obj?.ediCode || ''
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'portDischargeCode',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'portDischarge',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'portDischargeid',
|
||||||
|
label: '预抵港',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
required: false,
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetClientPortSelectList'),
|
||||||
|
labelField: 'portName',
|
||||||
|
valueField: 'id',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {
|
||||||
|
console.log(v, obj)
|
||||||
|
formModel.portDischarge = obj?.label || ''
|
||||||
|
formModel.portDischargeCode = obj?.ediCode || ''
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'port',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'portid',
|
||||||
|
label: '当前港口',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
required: false,
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetClientPortSelectList'),
|
||||||
|
labelField: 'portName',
|
||||||
|
valueField: 'id',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {
|
||||||
|
formModel.port = obj?.label || ''
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'depot',
|
||||||
|
label: '码头或场站',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
required: false,
|
||||||
|
componentProps: ({}) => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetYardClientList'),
|
||||||
|
labelField: 'shortName',
|
||||||
|
valueField: 'shortName',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'vessel',
|
||||||
|
label: '船名',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'Voyno',
|
||||||
|
label: '航次',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'ctnall',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnCode',
|
||||||
|
label: '箱型',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
api: GetCtnSelectList,
|
||||||
|
labelField: 'ctnName',
|
||||||
|
valueField: 'ediCode',
|
||||||
|
resultField: 'data',
|
||||||
|
onChange: (e, obj) => {
|
||||||
|
if (e && obj) {
|
||||||
|
formModel.ctnall = obj.label
|
||||||
|
}
|
||||||
|
if (!e && !obj) {
|
||||||
|
formModel.ctnall = ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'mblno',
|
||||||
|
label: '提单号',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'customerName',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: '',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '业务委托单位',
|
||||||
|
field: 'customerId',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
required: false,
|
||||||
|
dynamicDisabled: false,
|
||||||
|
colProps: { span: 6 },
|
||||||
|
componentProps: ({ formModel }) => {
|
||||||
|
return {
|
||||||
|
option: optionsStore.getOptionsByCode('GetControllerClientList'),
|
||||||
|
labelField: 'shortName',
|
||||||
|
valueField: 'codeName',
|
||||||
|
resultField: 'data',
|
||||||
|
filterOption: (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
},
|
||||||
|
onChange: (v, obj) => {
|
||||||
|
formModel.customerName = obj?.label || ''
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'etd',
|
||||||
|
label: 'ETD',
|
||||||
|
component: 'DatePicker',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
defaultValue: '',
|
||||||
|
componentProps: {
|
||||||
|
showTime: true,
|
||||||
|
style: 'width:100%',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'eta',
|
||||||
|
label: 'ETA',
|
||||||
|
component: 'DatePicker',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
defaultValue: '',
|
||||||
|
componentProps: {
|
||||||
|
showTime: true,
|
||||||
|
style: 'width:100%',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'changeTime',
|
||||||
|
label: '状态时间',
|
||||||
|
component: 'DatePicker',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
defaultValue: '',
|
||||||
|
componentProps: {
|
||||||
|
showTime: true,
|
||||||
|
style: 'width:100%',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnWeight',
|
||||||
|
label: '箱皮重',
|
||||||
|
component: 'InputNumber',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ctnValue_Base',
|
||||||
|
label: '箱初期成本',
|
||||||
|
component: 'InputNumber',
|
||||||
|
colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
]
|
@ -0,0 +1,119 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<BasicTable class="ds-table" @register="registerTableTop"> </BasicTable>
|
||||||
|
<BasicTable class="ds-table" @register="registerTableBotton"> </BasicTable>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref } from 'vue'
|
||||||
|
import { BasicTable, useTable } from '/@/components/Table'
|
||||||
|
import { ApiChangeList, ApiChangeDel } from './api'
|
||||||
|
import { columns, searchFormSchema } from './columns'
|
||||||
|
import { useMessage } from '/@/hooks/web/useMessage'
|
||||||
|
const { notification } = useMessage()
|
||||||
|
// 引入处理入参方法
|
||||||
|
import { formatParams } from '/@/hooks/web/common'
|
||||||
|
const [registerTableTop, { reload, getForm, getSelectRows }] = useTable({
|
||||||
|
title: '',
|
||||||
|
api: async (p) => {
|
||||||
|
if (p.queryCondition == '[]') {
|
||||||
|
notification.warning({ message: '请输入查询条件!', duration: 3 })
|
||||||
|
} else {
|
||||||
|
const res: API.DataResult = await ApiChangeList(p)
|
||||||
|
res.data.forEach((item, index) => {
|
||||||
|
item.index = index + 1
|
||||||
|
})
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
resolve({ data: [...res.data], total: res.count })
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
beforeFetch: (p) => {
|
||||||
|
let Rdata = formatParams(p)
|
||||||
|
if (!!p.cntrno) {
|
||||||
|
let data = JSON.parse(Rdata.queryCondition)
|
||||||
|
data.forEach((item, index) => {
|
||||||
|
if (item.FieldName == 'cntrno') {
|
||||||
|
item.FieldValue = item.FieldValue.replace(/ {1,}/g, ',')
|
||||||
|
item.FieldValue = item.FieldValue.replace(/\n/g, ',')
|
||||||
|
item.ConditionalType = 15
|
||||||
|
}
|
||||||
|
})
|
||||||
|
Rdata.queryCondition = JSON.stringify(data)
|
||||||
|
}
|
||||||
|
return Rdata
|
||||||
|
},
|
||||||
|
columns,
|
||||||
|
rowSelection: { type: 'checkbox' },
|
||||||
|
formConfig: {
|
||||||
|
labelWidth: 120,
|
||||||
|
schemas: searchFormSchema,
|
||||||
|
},
|
||||||
|
isTreeTable: false,
|
||||||
|
pagination: true,
|
||||||
|
striped: true,
|
||||||
|
useSearchForm: true,
|
||||||
|
showTableSetting: true,
|
||||||
|
bordered: true,
|
||||||
|
showIndexColumn: true,
|
||||||
|
indexColumnProps: {
|
||||||
|
width: 60,
|
||||||
|
},
|
||||||
|
canResize: true,
|
||||||
|
resizeHeightOffset: 35,
|
||||||
|
immediate: false,
|
||||||
|
})
|
||||||
|
const [
|
||||||
|
registerTableBotton,
|
||||||
|
{ reload: reloadBotton, getForm: getFormBotton, getSelectRows: getSelectRowsBotton },
|
||||||
|
] = useTable({
|
||||||
|
title: '',
|
||||||
|
api: async (p) => {
|
||||||
|
if (p.queryCondition == '[]') {
|
||||||
|
notification.warning({ message: '请输入查询条件!', duration: 3 })
|
||||||
|
} else {
|
||||||
|
const res: API.DataResult = await ApiChangeList(p)
|
||||||
|
res.data.forEach((item, index) => {
|
||||||
|
item.index = index + 1
|
||||||
|
})
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
resolve({ data: [...res.data], total: res.count })
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
beforeFetch: (p) => {
|
||||||
|
let Rdata = formatParams(p)
|
||||||
|
if (!!p.cntrno) {
|
||||||
|
let data = JSON.parse(Rdata.queryCondition)
|
||||||
|
data.forEach((item, index) => {
|
||||||
|
if (item.FieldName == 'cntrno') {
|
||||||
|
item.FieldValue = item.FieldValue.replace(/ {1,}/g, ',')
|
||||||
|
item.FieldValue = item.FieldValue.replace(/\n/g, ',')
|
||||||
|
item.ConditionalType = 15
|
||||||
|
}
|
||||||
|
})
|
||||||
|
Rdata.queryCondition = JSON.stringify(data)
|
||||||
|
}
|
||||||
|
return Rdata
|
||||||
|
},
|
||||||
|
columns,
|
||||||
|
rowSelection: { type: 'checkbox' },
|
||||||
|
// formConfig: {
|
||||||
|
// labelWidth: 120,
|
||||||
|
// schemas: searchFormSchema,
|
||||||
|
// },
|
||||||
|
isTreeTable: false,
|
||||||
|
pagination: true,
|
||||||
|
striped: true,
|
||||||
|
useSearchForm: false,
|
||||||
|
showTableSetting: false,
|
||||||
|
bordered: true,
|
||||||
|
showIndexColumn: true,
|
||||||
|
indexColumnProps: {
|
||||||
|
width: 60,
|
||||||
|
},
|
||||||
|
canResize: true,
|
||||||
|
resizeHeightOffset: 35,
|
||||||
|
immediate: false,
|
||||||
|
})
|
||||||
|
</script>
|
Loading…
Reference in New Issue