Merge remote-tracking branch 'origin/master'
# Conflicts: # src/views/business/contract-manage.vue # src/views/business/temporary-credit-limit.vue # src/views/transportCapacity/vehicle.vue
This commit is contained in:
@@ -13,6 +13,8 @@
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
|
||||
<meta name="format-detection" content="telephone=no" />
|
||||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||
<meta http-equiv="Pragma" content="no-cache" />
|
||||
<link rel="stylesheet" href="/iconfont/index.css" />
|
||||
<link rel="stylesheet" href="/iconfont/avue/iconfont.css" />
|
||||
<link rel="stylesheet" href="/iconfont/saber/iconfont.css" />
|
||||
|
||||
@@ -0,0 +1,52 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>oa登录</title>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.min.js">
|
||||
</script>
|
||||
<script>
|
||||
// 获取URL查询字符串
|
||||
const queryString = window.location.search;
|
||||
|
||||
// 使用URLSearchParams解析查询字符串
|
||||
const urlParams = new URLSearchParams(queryString);
|
||||
|
||||
// 获取特定的参数值
|
||||
var userid = urlParams.get('userid'); // 用户id
|
||||
var username = urlParams.get('username'); // 用户名
|
||||
var redirectUrl = urlParams.get('redirectUrl'); // 重定向地址
|
||||
|
||||
if(userid==null){
|
||||
userid="";
|
||||
}
|
||||
if(username==null){
|
||||
username="";
|
||||
}
|
||||
|
||||
$.get("/oaApi/getToken?userid="+userid+"&username="+username,function(result){
|
||||
debugger
|
||||
//成功返回token
|
||||
if(result.data.token){
|
||||
//设置系统的cookie
|
||||
document.cookie = "X-AUTH-TOKEN="+result.data.token;
|
||||
|
||||
if(redirectUrl==null){
|
||||
//如果是登录就跳转到系统首页
|
||||
window.location.href = "./";
|
||||
}else {
|
||||
//如果是待办有重定向就跳转
|
||||
window.location.href = redirectUrl;
|
||||
}
|
||||
}else {
|
||||
alert("该业务系统未同步当前oa用户");
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,52 @@
|
||||
import request from '@/axios';
|
||||
|
||||
export const getList = (current, size, params) => {
|
||||
return request({
|
||||
url: '/blade-system/measurement-unit/list',
|
||||
method: 'get',
|
||||
params: {
|
||||
...params,
|
||||
current,
|
||||
size,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export const getDetail = id => {
|
||||
return request({
|
||||
url: '/blade-system/measurement-unit/detail',
|
||||
method: 'get',
|
||||
params: {
|
||||
id,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export const remove = ids => {
|
||||
return request({
|
||||
url: '/blade-system/measurement-unit/remove',
|
||||
method: 'post',
|
||||
params: {
|
||||
ids,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export const submit = row => {
|
||||
return request({
|
||||
url: '/blade-system/measurement-unit/submit',
|
||||
method: 'post',
|
||||
data: row,
|
||||
});
|
||||
};
|
||||
|
||||
export const changeStatus = (id, status) => {
|
||||
return request({
|
||||
url: '/blade-system/measurement-unit/status',
|
||||
method: 'post',
|
||||
params: {
|
||||
id,
|
||||
status,
|
||||
},
|
||||
});
|
||||
};
|
||||
@@ -92,13 +92,12 @@ export const createCrudApi = baseUrl => ({
|
||||
data,
|
||||
});
|
||||
},
|
||||
reassign(id) {
|
||||
reassign(data) {
|
||||
const payload = data && typeof data === 'object' ? data : { id: data };
|
||||
return request({
|
||||
url: `${baseUrl}/reassign`,
|
||||
method: 'post',
|
||||
params: {
|
||||
id,
|
||||
},
|
||||
data: payload,
|
||||
});
|
||||
},
|
||||
batchComplete(ids) {
|
||||
|
||||
@@ -79,6 +79,15 @@ export const cancel = id =>
|
||||
},
|
||||
});
|
||||
|
||||
export const start = id =>
|
||||
request({
|
||||
url: `${baseUrl}/start`,
|
||||
method: 'post',
|
||||
params: {
|
||||
id,
|
||||
},
|
||||
});
|
||||
|
||||
export const complete = id =>
|
||||
request({
|
||||
url: `${baseUrl}/complete`,
|
||||
|
||||
@@ -6,6 +6,12 @@ const api = createCrudApi(baseUrl);
|
||||
|
||||
export const getList = api.getList;
|
||||
export const getDetail = api.getDetail;
|
||||
export const getChangeRecordDetail = (id, recordIndex) =>
|
||||
request({
|
||||
url: `${baseUrl}/change-record/detail`,
|
||||
method: 'get',
|
||||
params: { id, recordIndex },
|
||||
});
|
||||
export const submit = api.submit;
|
||||
export const remove = api.remove;
|
||||
|
||||
|
||||
@@ -26,6 +26,13 @@ export const maintainMileage = data =>
|
||||
method: 'post',
|
||||
data,
|
||||
});
|
||||
/** 运单打卡记录 + 司机上传凭证图 */
|
||||
export const getPunchRecords = waybillId =>
|
||||
request({
|
||||
url: `${baseUrl}/punch-records`,
|
||||
method: 'get',
|
||||
params: { waybillId },
|
||||
});
|
||||
export const roadLoading = ids =>
|
||||
request({
|
||||
url: `${baseUrl}/road-loading`,
|
||||
|
||||
@@ -41,6 +41,13 @@ export const add = row => {
|
||||
});
|
||||
};
|
||||
|
||||
export const syncIamOrganizations = () => {
|
||||
return request({
|
||||
url: '/blade-system/dept/sync-iam-organizations',
|
||||
method: 'post',
|
||||
});
|
||||
};
|
||||
|
||||
export const update = row => {
|
||||
return request({
|
||||
url: '/blade-system/dept/submit',
|
||||
@@ -78,3 +85,10 @@ export const getDeptLazyTree = parentId => {
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export const getPlatformCompanySelect = () => {
|
||||
return request({
|
||||
url: '/blade-system/dept/platform-company-select',
|
||||
method: 'get',
|
||||
});
|
||||
};
|
||||
|
||||
@@ -31,6 +31,13 @@ export const add = row => {
|
||||
});
|
||||
};
|
||||
|
||||
export const syncIamAccounts = () => {
|
||||
return request({
|
||||
url: '/blade-system/user/sync-iam-accounts',
|
||||
method: 'post',
|
||||
});
|
||||
};
|
||||
|
||||
export const update = row => {
|
||||
return request({
|
||||
url: '/blade-system/user/update',
|
||||
|
||||
@@ -0,0 +1,25 @@
|
||||
import request from '@/axios';
|
||||
|
||||
const baseUrl = '/blade-transport/vehicle-dispatch';
|
||||
|
||||
export const getList = (current, size, params) =>
|
||||
request({ url: `${baseUrl}/list`, method: 'get', params: { ...params, current, size } });
|
||||
|
||||
export const getDetail = id => request({ url: `${baseUrl}/detail`, method: 'get', params: { id } });
|
||||
|
||||
export const submit = row => request({ url: `${baseUrl}/submit`, method: 'post', data: row });
|
||||
|
||||
export const remove = ids => request({ url: `${baseUrl}/remove`, method: 'post', params: { ids } });
|
||||
|
||||
export const submitApproval = id =>
|
||||
request({ url: `${baseUrl}/submit-approval`, method: 'post', params: { id } });
|
||||
|
||||
export const approve = id => request({ url: `${baseUrl}/approve`, method: 'post', params: { id } });
|
||||
|
||||
export const exportVehicleDispatch = params =>
|
||||
request({
|
||||
url: `${baseUrl}/export-vehicle-dispatch`,
|
||||
method: 'get',
|
||||
params,
|
||||
responseType: 'blob',
|
||||
});
|
||||
@@ -47,3 +47,11 @@ export const update = row => {
|
||||
data: row,
|
||||
});
|
||||
};
|
||||
|
||||
export const getExpiryStat = params => {
|
||||
return request({
|
||||
url: '/blade-transport/annual-inspection-record/expiry-stat',
|
||||
method: 'get',
|
||||
params,
|
||||
});
|
||||
};
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
FROM nginx
|
||||
VOLUME /tmp
|
||||
ENV LANG en_US.UTF-8
|
||||
ADD ./src/docker/nginx.conf /etc/nginx/conf.d/default.conf
|
||||
ADD ./dist/ /usr/share/nginx/html/
|
||||
EXPOSE 80
|
||||
EXPOSE 443
|
||||
@@ -0,0 +1,19 @@
|
||||
server {
|
||||
listen 80;
|
||||
server_name localhost;
|
||||
root /usr/share/nginx/html;
|
||||
index index.html;
|
||||
|
||||
gzip on;
|
||||
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
|
||||
|
||||
location /assets/ {
|
||||
add_header Cache-Control "public, max-age=31536000, immutable";
|
||||
try_files $uri =404;
|
||||
}
|
||||
|
||||
location / {
|
||||
add_header Cache-Control "no-store, no-cache, must-revalidate";
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
}
|
||||
@@ -1,8 +1,12 @@
|
||||
import store from './store';
|
||||
import { isChunkLoadError, reloadForChunkError } from './utils/chunk-reload';
|
||||
|
||||
export default {
|
||||
install: app => {
|
||||
app.config.errorHandler = (err, vm, info) => {
|
||||
if (isChunkLoadError(err) && reloadForChunkError()) {
|
||||
return;
|
||||
}
|
||||
store.commit('ADD_LOGS', {
|
||||
type: 'error',
|
||||
message: err.message,
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { createApp } from 'vue';
|
||||
import { installChunkReload } from './utils/chunk-reload';
|
||||
import website from './config/website';
|
||||
import axios from './axios';
|
||||
import router from './router/';
|
||||
@@ -46,6 +47,7 @@ import sectionCard from './components/section-card/main.vue';
|
||||
import mapSearchResults from './components/map-search-results/main.vue';
|
||||
|
||||
window.$crudCommon = crudCommon;
|
||||
installChunkReload();
|
||||
debug();
|
||||
window.axios = axios;
|
||||
const app = createApp(App);
|
||||
|
||||
@@ -0,0 +1,133 @@
|
||||
const dimensionOptions = [
|
||||
{ label: '重量', value: '重量' },
|
||||
{ label: '体积', value: '体积' },
|
||||
{ label: '数量', value: '数量' },
|
||||
];
|
||||
|
||||
const statusOptions = [
|
||||
{ label: '启用', value: 1 },
|
||||
{ label: '停用', value: 2 },
|
||||
];
|
||||
|
||||
export const createOption = () => ({
|
||||
height: 'auto',
|
||||
calcHeight: 32,
|
||||
dialogWidth: 680,
|
||||
labelPosition: 'right',
|
||||
labelWidth: 'auto',
|
||||
tip: false,
|
||||
searchBtnText: '查询',
|
||||
emptyBtnText: '重置',
|
||||
saveBtnText: '提交',
|
||||
updateBtnText: '提交',
|
||||
searchShow: true,
|
||||
searchMenuSpan: 24,
|
||||
searchIcon: true,
|
||||
searchIndex: 4,
|
||||
searchMenuPosition: 'right',
|
||||
border: true,
|
||||
index: true,
|
||||
indexLabel: '序号',
|
||||
indexWidth: 70,
|
||||
addBtn: false,
|
||||
viewBtn: false,
|
||||
editBtn: false,
|
||||
delBtn: false,
|
||||
selection: true,
|
||||
dialogClickModal: false,
|
||||
menuWidth: 240,
|
||||
menuFixed: 'right',
|
||||
column: [
|
||||
{
|
||||
label: '计量单位',
|
||||
prop: 'unitName',
|
||||
minWidth: 150,
|
||||
search: true,
|
||||
searchOrder: 3,
|
||||
searchSpan: 6,
|
||||
maxlength: 50,
|
||||
showWordLimit: true,
|
||||
rules: [
|
||||
{ required: true, message: '请输入计量单位', trigger: 'blur' },
|
||||
{ max: 50, message: '计量单位不能超过50个字', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '计量维度',
|
||||
prop: 'dimension',
|
||||
type: 'select',
|
||||
minWidth: 130,
|
||||
search: true,
|
||||
searchOrder: 2,
|
||||
searchSpan: 6,
|
||||
dicData: dimensionOptions,
|
||||
rules: [{ required: true, message: '请选择计量维度', trigger: 'change' }],
|
||||
},
|
||||
{
|
||||
label: '备注',
|
||||
prop: 'remark',
|
||||
type: 'textarea',
|
||||
minRows: 2,
|
||||
span: 24,
|
||||
minWidth: 200,
|
||||
maxlength: 200,
|
||||
showWordLimit: true,
|
||||
overHidden: true,
|
||||
rules: [{ max: 200, message: '备注不能超过200个字', trigger: 'blur' }],
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
prop: 'status',
|
||||
type: 'select',
|
||||
search: true,
|
||||
searchOrder: 1,
|
||||
searchSpan: 6,
|
||||
slot: true,
|
||||
dataType: 'number',
|
||||
dicData: statusOptions,
|
||||
clearable: true,
|
||||
value: 1,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
label: '创建人',
|
||||
prop: 'createUserName',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: false,
|
||||
display: false,
|
||||
},
|
||||
{
|
||||
label: '更新人',
|
||||
prop: 'updateUserName',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: false,
|
||||
display: false,
|
||||
},
|
||||
{
|
||||
label: '创建时间',
|
||||
prop: 'createTime',
|
||||
type: 'datetime',
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
sortable: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
display: false,
|
||||
},
|
||||
{
|
||||
label: '更新时间',
|
||||
prop: 'updateTime',
|
||||
type: 'datetime',
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
sortable: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
display: false,
|
||||
},
|
||||
],
|
||||
});
|
||||
@@ -41,7 +41,7 @@ export const planStatusOptions = [
|
||||
export const waybillStatusOptions = [
|
||||
{ label: '草稿', value: 'draft' },
|
||||
{ label: '待执行', value: 'pending' },
|
||||
{ label: '进行中', value: 'processing' },
|
||||
{ label: '进行中', value: 'running' },
|
||||
{ label: '已完成', value: 'completed' },
|
||||
{ label: '已取消', value: 'cancelled' },
|
||||
];
|
||||
@@ -130,12 +130,18 @@ export const contractApprovalStatusOptions = [
|
||||
{ label: '草稿', value: 'draft' },
|
||||
{ label: '审批中', value: 'reviewing' },
|
||||
{ label: '已驳回', value: 'rejected' },
|
||||
{ label: '已撤回', value: 'withdrawn' },
|
||||
{ label: '审批通过', value: 'approved' },
|
||||
{ label: '变更审批中', value: 'change_reviewing' },
|
||||
{ label: '变更驳回', value: 'change_rejected' },
|
||||
{ label: '变更审批通过', value: 'change_approved' },
|
||||
];
|
||||
|
||||
export const contractArchiveStatusOptions = [
|
||||
{ label: '未归档', value: '未归档' },
|
||||
{ label: '已归档', value: '已归档' },
|
||||
];
|
||||
|
||||
export const nodeOptions = [
|
||||
{ label: '接单', value: '接单' },
|
||||
{ label: '到场', value: '到场' },
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import {
|
||||
auditColumns,
|
||||
contractApprovalStatusOptions,
|
||||
contractArchiveStatusOptions,
|
||||
contractCategoryOptions,
|
||||
contractStageOptions,
|
||||
createCrudOption,
|
||||
@@ -48,7 +49,7 @@ export const config = {
|
||||
batchDelete: false,
|
||||
enableProjectSelect: true,
|
||||
projectQueryParams: {
|
||||
approvalStatuses: 'approved,change_approved',
|
||||
contractSelectable: true,
|
||||
},
|
||||
actions: ['copy'],
|
||||
statusProp: 'approvalStatus',
|
||||
@@ -71,6 +72,10 @@ export const config = {
|
||||
['legalSealFlag', '是否需要加盖法人章'],
|
||||
['copyCount', '一式（份）'],
|
||||
['paymentDays', '回款账期（天）'],
|
||||
['contractAmount', '合同金额'],
|
||||
['templateFlag', '是否范本'],
|
||||
['originalContractNo', '原件合同编号'],
|
||||
['electronicSealFlag', '是否电子章'],
|
||||
['remark', '备注', 2],
|
||||
],
|
||||
},
|
||||
@@ -84,6 +89,7 @@ export const config = {
|
||||
['effectiveType', '生效类型'],
|
||||
['contractStage', '合同阶段'],
|
||||
['approvalStatus', '审核状态'],
|
||||
['archiveStatus', '归档状态'],
|
||||
['currentNode', '当前节点'],
|
||||
['currentProcessor', '当前处理人'],
|
||||
],
|
||||
@@ -104,7 +110,7 @@ export const config = {
|
||||
},
|
||||
deleteStatus: ['draft'],
|
||||
deleteStage: ['draft'],
|
||||
editStatus: ['draft', 'rejected', 'change_rejected'],
|
||||
editStatus: ['draft', 'withdrawn', 'rejected', 'change_rejected'],
|
||||
operations: [
|
||||
{
|
||||
action: 'flow',
|
||||
@@ -271,7 +277,7 @@ export const option = createCrudOption([
|
||||
formslot: true,
|
||||
order: 165,
|
||||
dicUrl:
|
||||
'/blade-transport/project-apply/list?current=1&size=9999&approvalStatuses=approved,change_approved',
|
||||
'/blade-transport/project-apply/list?current=1&size=9999&contractSelectable=true',
|
||||
dicFormatter: projectNameDicFormatter,
|
||||
props: {
|
||||
label: 'projectName',
|
||||
@@ -485,6 +491,47 @@ export const option = createCrudOption([
|
||||
order: 50,
|
||||
minWidth: 130,
|
||||
},
|
||||
{
|
||||
label: '合同金额',
|
||||
prop: 'contractAmount',
|
||||
type: 'number',
|
||||
min: 0,
|
||||
precision: 2,
|
||||
hide: true,
|
||||
order: 45,
|
||||
minWidth: 130,
|
||||
},
|
||||
{
|
||||
label: '是否范本',
|
||||
prop: 'templateFlag',
|
||||
type: 'select',
|
||||
dicData: [
|
||||
{ label: '否', value: 0 },
|
||||
{ label: '是', value: 1 },
|
||||
],
|
||||
hide: true,
|
||||
order: 40,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
label: '原件合同编号',
|
||||
prop: 'originalContractNo',
|
||||
hide: true,
|
||||
order: 35,
|
||||
minWidth: 160,
|
||||
},
|
||||
{
|
||||
label: '是否电子章',
|
||||
prop: 'electronicSealFlag',
|
||||
type: 'select',
|
||||
dicData: [
|
||||
{ label: '否', value: 0 },
|
||||
{ label: '是', value: 1 },
|
||||
],
|
||||
hide: true,
|
||||
order: 30,
|
||||
minWidth: 110,
|
||||
},
|
||||
{
|
||||
label: '创建时间',
|
||||
prop: 'createTime',
|
||||
@@ -522,6 +569,19 @@ export const option = createCrudOption([
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '归档状态',
|
||||
prop: 'archiveStatus',
|
||||
type: 'select',
|
||||
search: true,
|
||||
searchOrder: 5,
|
||||
searchPlaceholder: '请选择',
|
||||
slot: true,
|
||||
dicData: contractArchiveStatusOptions,
|
||||
minWidth: 110,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '当前节点',
|
||||
prop: 'currentNode',
|
||||
|
||||
@@ -169,16 +169,16 @@ export const option = createCrudOption([
|
||||
rules: textRule('业务部门', 50, true),
|
||||
},
|
||||
{
|
||||
label: '承办部门',
|
||||
label: '平台公司',
|
||||
prop: 'undertakeDeptName',
|
||||
search: true,
|
||||
searchPlaceholder: '请输入',
|
||||
searchOrder: 8,
|
||||
minWidth: 150,
|
||||
rules: textRule('承办部门', 50, true),
|
||||
rules: textRule('平台公司', 50, true),
|
||||
},
|
||||
{
|
||||
label: '承办部门ID',
|
||||
label: '平台公司ID',
|
||||
prop: 'undertakeDeptId',
|
||||
hide: true,
|
||||
},
|
||||
@@ -192,6 +192,15 @@ export const option = createCrudOption([
|
||||
formatter: row => formatUserRealName(row, 'principal'),
|
||||
rules: textRule('项目负责人', 50, true),
|
||||
},
|
||||
{
|
||||
label: '资金使用风险',
|
||||
prop: 'fundUseRisk',
|
||||
slot: true,
|
||||
minWidth: 150,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
hide: false,
|
||||
},
|
||||
{
|
||||
label: '项目负责人ID',
|
||||
prop: 'principalUserId',
|
||||
@@ -433,14 +442,5 @@ export const option = createCrudOption([
|
||||
span: 24,
|
||||
hide: true,
|
||||
},
|
||||
{
|
||||
label: '资金使用风险',
|
||||
prop: 'fundUseRisk',
|
||||
slot: true,
|
||||
minWidth: 130,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
hide: false,
|
||||
},
|
||||
...auditColumns.map(column => ({ ...column, hide: true })),
|
||||
]);
|
||||
|
||||
@@ -55,8 +55,8 @@ export const config = {
|
||||
'templateType',
|
||||
'transportType',
|
||||
'createUserName',
|
||||
'remark',
|
||||
'updateTime',
|
||||
'remark',
|
||||
'createTime',
|
||||
],
|
||||
exportColumns: [
|
||||
@@ -65,8 +65,8 @@ export const config = {
|
||||
{ prop: 'templateType', label: '模板类型' },
|
||||
{ prop: 'transportType', label: '运输方式' },
|
||||
{ prop: 'createUserName', label: '创建人' },
|
||||
{ prop: 'remark', label: '备注' },
|
||||
{ prop: 'updateTime', label: '更新时间' },
|
||||
{ prop: 'remark', label: '备注' },
|
||||
{ prop: 'createTime', label: '创建时间' },
|
||||
],
|
||||
enableAllDept: false,
|
||||
@@ -82,12 +82,14 @@ export const config = {
|
||||
detailAttachmentDescriptionPlain: true,
|
||||
enableTransportPlanForm: true,
|
||||
enableShippingTemplateFreight: true,
|
||||
editableRoadAddress: true,
|
||||
editableRoadAddress: false,
|
||||
fixedTransportAddressType: true,
|
||||
enableTemplateCodePreview: true,
|
||||
attachmentTitle: '附件',
|
||||
defaultForm: {
|
||||
templateType: '运输计划',
|
||||
transportType: '公路运输',
|
||||
transportTypeName: '公路运输',
|
||||
},
|
||||
transportFormRequiredFields: [
|
||||
['projectName', '项目'],
|
||||
@@ -119,15 +121,16 @@ export const option = {
|
||||
labelWidth: 0,
|
||||
},
|
||||
{
|
||||
label: '模板编号',
|
||||
prop: 'templateCode',
|
||||
label: '模板类型',
|
||||
prop: 'templateType',
|
||||
type: 'select',
|
||||
search: true,
|
||||
searchOrder: 4,
|
||||
searchOrder: 2,
|
||||
span: 8,
|
||||
order: 390,
|
||||
minWidth: 170,
|
||||
disabled: true,
|
||||
placeholder: '系统自动生成',
|
||||
dicData: templateTypeOptions,
|
||||
minWidth: 120,
|
||||
rules: selectRule('模板类型'),
|
||||
display: true,
|
||||
},
|
||||
{
|
||||
@@ -142,16 +145,15 @@ export const option = {
|
||||
display: true,
|
||||
},
|
||||
{
|
||||
label: '模板类型',
|
||||
prop: 'templateType',
|
||||
type: 'select',
|
||||
label: '模板编号',
|
||||
prop: 'templateCode',
|
||||
search: true,
|
||||
searchOrder: 2,
|
||||
searchOrder: 4,
|
||||
span: 8,
|
||||
order: 370,
|
||||
dicData: templateTypeOptions,
|
||||
minWidth: 120,
|
||||
rules: selectRule('模板类型'),
|
||||
minWidth: 170,
|
||||
disabled: true,
|
||||
placeholder: '系统自动生成',
|
||||
display: true,
|
||||
},
|
||||
{
|
||||
|
||||
@@ -2,7 +2,6 @@ import {
|
||||
approvalStatusOptions,
|
||||
auditColumns,
|
||||
createCrudOption,
|
||||
futureDateRule,
|
||||
nonNegativeRule,
|
||||
textRule,
|
||||
withSearchPlaceholders,
|
||||
@@ -58,30 +57,25 @@ export const config = {
|
||||
detailAlignCenter: true,
|
||||
detailSections: [
|
||||
{
|
||||
title: '申请信息',
|
||||
title: '项目额度信息',
|
||||
fields: [
|
||||
['applicationNo', '申请单号', 1],
|
||||
['projectName', '项目', 1],
|
||||
['projectName', '项目名称', 1],
|
||||
['projectCode', '项目编号', 1],
|
||||
['undertakeDeptName', '承办部门', 1],
|
||||
['applyDeptName', '申请部门', 1],
|
||||
['applicantName', '申请人', 1],
|
||||
['approvalStatus', '审批状态', 1],
|
||||
['currentNode', '当前节点', 1],
|
||||
['currentProcessor', '当前处理人', 1],
|
||||
['validUntil', '申请有效期至', 1],
|
||||
['remark', '备注', 1],
|
||||
],
|
||||
},
|
||||
{
|
||||
title: '额度信息',
|
||||
fields: [
|
||||
['projectFundLimit', '项目资金使用额度（万元）', 1],
|
||||
['usedFundLimit', '已使用项目资金使用额度（万元）', 1],
|
||||
['remainingFundLimit', '剩余项目资金使用额度（万元）', 1],
|
||||
['applyLimit', '申请临时额度（万元）', 1],
|
||||
],
|
||||
},
|
||||
{
|
||||
title: '临时额度信息',
|
||||
fields: [
|
||||
['applyLimit', '申请临时额度（万元）', 1],
|
||||
['validUntil', '申请有效期至', 1],
|
||||
['remark', '备注', 4],
|
||||
],
|
||||
showAttachment: true,
|
||||
},
|
||||
],
|
||||
operations: [
|
||||
{
|
||||
@@ -140,6 +134,14 @@ export const option = {
|
||||
editDisplay: false,
|
||||
editDisabled: true,
|
||||
},
|
||||
{
|
||||
label: '',
|
||||
prop: 'projectQuotaInfoTitle',
|
||||
formslot: true,
|
||||
span: 24,
|
||||
hide: true,
|
||||
labelWidth: 0,
|
||||
},
|
||||
{
|
||||
label: '项目名称',
|
||||
prop: 'projectName',
|
||||
@@ -216,6 +218,14 @@ export const option = {
|
||||
value: 0,
|
||||
rules: [nonNegativeRule('剩余项目资金使用额度')],
|
||||
},
|
||||
{
|
||||
label: '',
|
||||
prop: 'temporaryCreditInfoTitle',
|
||||
formslot: true,
|
||||
span: 24,
|
||||
hide: true,
|
||||
labelWidth: 0,
|
||||
},
|
||||
{
|
||||
label: '申请临时额度（万元）',
|
||||
prop: 'applyLimit',
|
||||
@@ -238,9 +248,27 @@ export const option = {
|
||||
minWidth: 140,
|
||||
rules: [
|
||||
{ required: true, message: '请选择申请有效期至', trigger: 'change' },
|
||||
futureDateRule('申请有效期至'),
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '备注',
|
||||
prop: 'remark',
|
||||
type: 'textarea',
|
||||
span: 24,
|
||||
minRows: 2,
|
||||
hide: true,
|
||||
placeholder: '请输入',
|
||||
maxlength: 200,
|
||||
showWordLimit: true,
|
||||
rules: textRule('备注', 200),
|
||||
},
|
||||
{
|
||||
label: '附件',
|
||||
prop: 'attachmentsJson',
|
||||
formslot: true,
|
||||
span: 24,
|
||||
hide: true,
|
||||
},
|
||||
{
|
||||
label: '申请部门',
|
||||
prop: 'applyDeptName',
|
||||
@@ -304,25 +332,6 @@ export const option = {
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '临时额度信息',
|
||||
prop: 'remark',
|
||||
type: 'textarea',
|
||||
span: 24,
|
||||
minRows: 2,
|
||||
hide: true,
|
||||
placeholder: '请输入',
|
||||
maxlength: 200,
|
||||
showWordLimit: true,
|
||||
rules: textRule('临时额度信息', 200),
|
||||
},
|
||||
{
|
||||
label: '附件',
|
||||
prop: 'attachmentsJson',
|
||||
formslot: true,
|
||||
span: 24,
|
||||
hide: true,
|
||||
},
|
||||
...auditColumns.map(column => ({ ...column, hide: true })),
|
||||
])),
|
||||
dialogWidth: '96%',
|
||||
|
||||
@@ -209,12 +209,12 @@ export const config = {
|
||||
attachmentTitle: '附件',
|
||||
searchRangeMap: {
|
||||
planStartDateRange: ['planStartDateStart', 'planStartDateEnd'],
|
||||
planEndDateRange: ['planEndDateStart', 'planEndDateEnd'],
|
||||
createTimeRange: ['createTimeStart', 'createTimeEnd', '00:00:00', '23:59:59'],
|
||||
},
|
||||
actions: ['copy', 'complete'],
|
||||
statusProp: 'businessStatus',
|
||||
statusTextProp: 'businessStatusName',
|
||||
deleteStatus: ['draft', 'waiting_dispatch'],
|
||||
deleteStatus: ['draft'],
|
||||
editStatus: ['draft', 'waiting_dispatch', 'dispatching'],
|
||||
detailButton: true,
|
||||
detailSections: [
|
||||
@@ -341,6 +341,7 @@ export const option = {
|
||||
{
|
||||
label: '发货地址',
|
||||
prop: 'departureAddress',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchOrder: 7,
|
||||
@@ -352,6 +353,7 @@ export const option = {
|
||||
{
|
||||
label: '到货地址',
|
||||
prop: 'arrivalAddress',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchOrder: 6,
|
||||
@@ -577,8 +579,8 @@ export const option = {
|
||||
viewDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '计划结束日期',
|
||||
prop: 'planEndDateRange',
|
||||
label: '创建时间',
|
||||
prop: 'createTimeRange',
|
||||
type: 'date',
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
|
||||
@@ -19,6 +19,12 @@ const transportTypeDict = {
|
||||
|
||||
const isEmpty = value => value === undefined || value === null || value === '';
|
||||
const normalizeNumericDisplayValue = value => (Number(value) === -1 ? '' : value);
|
||||
const formatMoneyDisplay = value => {
|
||||
if (isEmpty(value) || Number(value) === -1) return '';
|
||||
const number = Number(value);
|
||||
if (!Number.isFinite(number)) return '';
|
||||
return number.toFixed(2);
|
||||
};
|
||||
|
||||
const parseJsonArray = value => {
|
||||
if (Array.isArray(value)) return value;
|
||||
@@ -92,14 +98,32 @@ const getProcessConfigNodes = row => {
|
||||
|
||||
const isAcceptProcessNode = node => node.key === 'accept' || node.name === '接单';
|
||||
|
||||
const isTruthyFlag = value => {
|
||||
if (value === true || value === 1) return true;
|
||||
if (value === false || value === 0 || value === null || value === undefined || value === '') {
|
||||
return false;
|
||||
}
|
||||
return ['true', '1', 'yes'].includes(String(value).trim().toLowerCase());
|
||||
};
|
||||
|
||||
const requiresDriverAcceptConfirmation = row =>
|
||||
getProcessConfigNodes(row).some(
|
||||
node =>
|
||||
isAcceptProcessNode(node) &&
|
||||
node.enabled !== false &&
|
||||
node.confirmMode === 'yes' &&
|
||||
node.confirmDriver === true
|
||||
);
|
||||
getProcessConfigNodes(row).some(node => {
|
||||
if (!isAcceptProcessNode(node) || node.enabled === false) return false;
|
||||
if (node.confirmMode === 'no_confirm_accept') return false;
|
||||
// 与后端一致：是否确认=是 即需接单（不强制依赖 confirmDriver）
|
||||
return node.confirmMode === 'yes' || !node.confirmMode;
|
||||
});
|
||||
|
||||
const getDriverRejectReason = row => {
|
||||
if (!row) return '';
|
||||
const reason =
|
||||
row.driverRejectReason ||
|
||||
row.driverRefuseReason ||
|
||||
row.acceptRejectReason ||
|
||||
row.rejectReason ||
|
||||
'';
|
||||
return String(reason || '').trim();
|
||||
};
|
||||
|
||||
const isDriverRejectedStatus = value => {
|
||||
if (value === null || value === undefined || typeof value === 'boolean') return false;
|
||||
@@ -122,6 +146,7 @@ const isDriverRejectedStatus = value => {
|
||||
};
|
||||
|
||||
const hasDriverRejectRecord = row => {
|
||||
if (String(row.driverAcceptStatus || '').toLowerCase() === 'rejected') return true;
|
||||
const rejectRecordValues = [
|
||||
row.driverRejectTime,
|
||||
row.driverRejectedTime,
|
||||
@@ -161,9 +186,16 @@ const hasDriverRejectRecord = row => {
|
||||
};
|
||||
|
||||
const isDriverRejectedWaybill = row =>
|
||||
requiresDriverAcceptConfirmation(row) && hasDriverRejectRecord(row);
|
||||
(row.requireAccept === true ||
|
||||
row.requireAccept === 1 ||
|
||||
requiresDriverAcceptConfirmation(row)) &&
|
||||
hasDriverRejectRecord(row);
|
||||
|
||||
const hasDriverAcceptRecord = row => {
|
||||
if (String(row.driverAcceptStatus || '').toLowerCase() === 'accepted') return true;
|
||||
if (['rejected', 'pending'].includes(String(row.driverAcceptStatus || '').toLowerCase())) {
|
||||
return false;
|
||||
}
|
||||
const recordValues = [
|
||||
row.driverAcceptTime,
|
||||
row.driverAcceptedTime,
|
||||
@@ -172,6 +204,7 @@ const hasDriverAcceptRecord = row => {
|
||||
row.driverAcceptedBy,
|
||||
row.acceptUserId,
|
||||
row.acceptUserName,
|
||||
row.driverAcceptDriverId,
|
||||
];
|
||||
if (recordValues.some(value => value !== null && value !== undefined && value !== '')) {
|
||||
return true;
|
||||
@@ -315,10 +348,10 @@ const formatUnitPrice = row => {
|
||||
return billingUnit ? `${billingPrice}(${billingUnit})` : billingPrice;
|
||||
};
|
||||
|
||||
const formatAmount = (row, props) => getFirstValue(row, props);
|
||||
const formatAmount = (row, props) => formatMoneyDisplay(getFirstValue(row, props));
|
||||
|
||||
const sumAmount = list =>
|
||||
list.reduce((sum, item) => {
|
||||
const sumAmount = (rows = []) =>
|
||||
rows.reduce((sum, item) => {
|
||||
const value = getFirstValue(item, ['freightAmount', 'amount', 'totalAmount']);
|
||||
return isEmpty(value) ? sum : sum + Number(value || 0);
|
||||
}, 0);
|
||||
@@ -337,7 +370,7 @@ const calculateFreightTotal = rows => {
|
||||
return sum + Number(item.unitPrice || 0) * Number(item.quantity || 0);
|
||||
}, 0);
|
||||
if (!hasAmountField) return '';
|
||||
return Number.isFinite(total) ? Number(total.toFixed(2)).toString() : '';
|
||||
return Number.isFinite(total) ? total.toFixed(2) : '';
|
||||
};
|
||||
|
||||
const formatFreight = row => {
|
||||
@@ -345,9 +378,9 @@ const formatFreight = row => {
|
||||
if (!isEmpty(value)) return value;
|
||||
const freight = parseJsonObject(row.freightJson);
|
||||
const freightValue = getFirstValue(freight, ['freightAmount', 'transportFee']);
|
||||
if (!isEmpty(freightValue)) return freightValue;
|
||||
if (!isEmpty(freightValue)) return formatMoneyDisplay(freightValue);
|
||||
const total = sumAmount(Array.isArray(freight.freightItems) ? freight.freightItems : []);
|
||||
return total ? total : '';
|
||||
return total ? formatMoneyDisplay(total) : '';
|
||||
};
|
||||
|
||||
const formatOtherFeeTotal = row => {
|
||||
@@ -364,10 +397,10 @@ const formatFreightTotal = row => {
|
||||
const otherFeeTotal = !isEmpty(otherFee) ? otherFee : formatOtherFeeTotal(row);
|
||||
if (!isEmpty(calculated)) {
|
||||
const total = Number(calculated || 0) + Number(otherFeeTotal || 0);
|
||||
return Number.isFinite(total) ? Number(total.toFixed(2)).toString() : calculated;
|
||||
return Number.isFinite(total) ? total.toFixed(2) : calculated;
|
||||
}
|
||||
const value = getFirstValue(freight, ['totalFreightAmount', 'totalFreight', 'totalAmount']);
|
||||
if (!isEmpty(value)) return value;
|
||||
if (!isEmpty(value)) return formatMoneyDisplay(value);
|
||||
return formatAmount(row, ['freightTotal', 'totalFreight', 'totalAmount']);
|
||||
};
|
||||
|
||||
@@ -425,26 +458,26 @@ export const config = {
|
||||
statusProp: 'businessStatus',
|
||||
statusTextProp: 'businessStatusName',
|
||||
formatStatus(row, prop, defaultText) {
|
||||
if (
|
||||
prop === 'businessStatus' &&
|
||||
requiresDriverAcceptConfirmation(row) &&
|
||||
isInProgressStatus(row, defaultText) &&
|
||||
!hasDriverAcceptRecord(row)
|
||||
) {
|
||||
if (prop !== 'businessStatus') return defaultText;
|
||||
const status = String(row.businessStatus || '');
|
||||
const terminalStatuses = ['draft', 'completed', 'cancelled', 'waiting_dispatch', 'dispatching'];
|
||||
const needAccept =
|
||||
row.requireAccept === true ||
|
||||
row.requireAccept === 1 ||
|
||||
requiresDriverAcceptConfirmation(row);
|
||||
// 需司机接单且尚未接单 → 待执行（含库中仍为 running 的历史数据展示校正）
|
||||
if (needAccept && !hasDriverAcceptRecord(row) && !terminalStatuses.includes(status)) {
|
||||
return '待执行';
|
||||
}
|
||||
if (
|
||||
prop === 'businessStatus' &&
|
||||
row.businessStatus === 'pending' &&
|
||||
!requiresDriverAcceptConfirmation(row)
|
||||
) {
|
||||
return '进行中';
|
||||
}
|
||||
if (status === 'pending') return '待执行';
|
||||
if (status === 'running' || status === 'processing') return '进行中';
|
||||
return defaultText;
|
||||
},
|
||||
canReassign(row) {
|
||||
return isDriverRejectedWaybill(row);
|
||||
},
|
||||
getDriverRejectReason,
|
||||
isDriverRejectedWaybill,
|
||||
canEdit(row) {
|
||||
// 进行中的运单不允许编辑
|
||||
if (isInProgressStatus(row, row.businessStatusName)) {
|
||||
|
||||
@@ -0,0 +1,181 @@
|
||||
const approvalStatusOptions = [
|
||||
{ label: '草稿', value: 'draft' },
|
||||
{ label: '审批中', value: 'reviewing' },
|
||||
{ label: '已驳回', value: 'rejected' },
|
||||
{ label: '审批通过', value: 'approved' },
|
||||
];
|
||||
|
||||
export const statusName = status =>
|
||||
approvalStatusOptions.find(item => item.value === status)?.label || status || '-';
|
||||
|
||||
export const option = {
|
||||
height: 'auto',
|
||||
calcHeight: 32,
|
||||
dialogWidth: 1200,
|
||||
labelPosition: 'right',
|
||||
labelWidth: 'auto',
|
||||
tip: false,
|
||||
searchBtnText: '查询',
|
||||
emptyBtnText: '重置',
|
||||
saveBtnText: '提交',
|
||||
updateBtnText: '提交',
|
||||
searchShow: true,
|
||||
searchMenuSpan: 24,
|
||||
searchIndex: 4,
|
||||
searchMenuPosition: 'right',
|
||||
border: true,
|
||||
index: true,
|
||||
indexLabel: '序号',
|
||||
indexWidth: 70,
|
||||
addBtn: false,
|
||||
editBtn: false,
|
||||
delBtn: false,
|
||||
viewBtn: false,
|
||||
selection: false,
|
||||
dialogClickModal: false,
|
||||
menuFixed: 'right',
|
||||
menuWidth: 320,
|
||||
column: [
|
||||
// ========== 表格列（顺序固定）==========
|
||||
{
|
||||
label: '申请单号',
|
||||
prop: 'applicationNo',
|
||||
search: true,
|
||||
searchOrder: 5,
|
||||
searchPlaceholder: '请输入',
|
||||
minWidth: 180,
|
||||
slot: true,
|
||||
addDisplay: true,
|
||||
editDisabled: true,
|
||||
disabled: true,
|
||||
placeholder: '保存后自动生成',
|
||||
},
|
||||
{
|
||||
label: '车牌号',
|
||||
prop: 'plateNo',
|
||||
search: true,
|
||||
searchOrder: 4,
|
||||
searchPlaceholder: '请输入',
|
||||
minWidth: 120,
|
||||
formslot: true,
|
||||
rules: [{ required: true, message: '请选择车牌号', trigger: 'blur' }],
|
||||
},
|
||||
{
|
||||
label: '所属组织',
|
||||
prop: 'organizationName',
|
||||
search: true,
|
||||
searchOrder: 3,
|
||||
searchPlaceholder: '请输入',
|
||||
minWidth: 140,
|
||||
disabled: true,
|
||||
placeholder: '选择车牌号后自动填充',
|
||||
rules: [{ required: true, message: '请输入所属组织', trigger: 'blur' }],
|
||||
},
|
||||
{
|
||||
label: '使用部门',
|
||||
prop: 'useDepartment',
|
||||
search: true,
|
||||
searchOrder: 2,
|
||||
searchPlaceholder: '请输入',
|
||||
minWidth: 140,
|
||||
formslot: true,
|
||||
span: 12,
|
||||
rules: [{ required: true, message: '请选择使用部门', trigger: 'blur' }],
|
||||
},
|
||||
{
|
||||
label: '车辆类型',
|
||||
prop: 'vehicleType',
|
||||
minWidth: 110,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '审批状态',
|
||||
prop: 'approvalStatus',
|
||||
search: true,
|
||||
searchOrder: 1,
|
||||
type: 'select',
|
||||
dicData: approvalStatusOptions,
|
||||
slot: true,
|
||||
minWidth: 120,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '当前节点',
|
||||
prop: 'currentNode',
|
||||
minWidth: 120,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '当前处理人',
|
||||
prop: 'currentProcessor',
|
||||
minWidth: 130,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '创建人',
|
||||
prop: 'createUserName',
|
||||
minWidth: 120,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '创建时间',
|
||||
prop: 'createTime',
|
||||
type: 'datetime',
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
minWidth: 170,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
// ========== 新增/编辑表单专用（不进表格）==========
|
||||
{
|
||||
label: '申请人',
|
||||
prop: 'applicantName',
|
||||
hide: true,
|
||||
display: true,
|
||||
addDisplay: true,
|
||||
editDisplay: true,
|
||||
viewDisplay: true,
|
||||
disabled: true,
|
||||
span: 12,
|
||||
},
|
||||
{
|
||||
label: '申请时间',
|
||||
prop: 'applyTime',
|
||||
type: 'datetime',
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
hide: true,
|
||||
display: true,
|
||||
addDisplay: true,
|
||||
editDisplay: true,
|
||||
viewDisplay: true,
|
||||
disabled: true,
|
||||
span: 12,
|
||||
},
|
||||
{
|
||||
label: '备注',
|
||||
prop: 'remark',
|
||||
type: 'textarea',
|
||||
hide: true,
|
||||
span: 24,
|
||||
maxlength: 200,
|
||||
showWordLimit: true,
|
||||
rules: [{ max: 200, message: '备注不能超过200个字', trigger: 'blur' }],
|
||||
},
|
||||
{
|
||||
label: '附件',
|
||||
prop: 'attachments',
|
||||
hide: true,
|
||||
span: 24,
|
||||
minWidth: 100,
|
||||
formslot: true,
|
||||
},
|
||||
],
|
||||
};
|
||||
@@ -70,14 +70,16 @@ export const option = {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 140,
|
||||
span: 12,
|
||||
placeholder: '输入车牌号/船号查询选择',
|
||||
placeholder: '请选择车牌号/船号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号/船号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号/船号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
|
||||
@@ -75,14 +75,16 @@ export const option = {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 140,
|
||||
span: 12,
|
||||
placeholder: '输入车牌号/船号查询选择',
|
||||
placeholder: '请选择车牌号/船号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号/船号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号/船号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
@@ -105,6 +107,7 @@ export const option = {
|
||||
type: 'date',
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
slot: true,
|
||||
minWidth: 140,
|
||||
span: 12,
|
||||
placeholder: '请输入',
|
||||
@@ -191,23 +194,12 @@ export const option = {
|
||||
formslot: true,
|
||||
},
|
||||
{
|
||||
label: '检测评定开始日期',
|
||||
prop: 'inspectionAssessmentDateStart',
|
||||
type: 'date',
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
search: true,
|
||||
hide: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '检测评定结束日期',
|
||||
prop: 'inspectionAssessmentDateEnd',
|
||||
label: '检测评定日期',
|
||||
prop: 'inspectionAssessmentDateRange',
|
||||
type: 'date',
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
searchRange: true,
|
||||
search: true,
|
||||
hide: true,
|
||||
addDisplay: false,
|
||||
|
||||
@@ -54,9 +54,11 @@ export const option = {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
searchOrder: 4,
|
||||
span: 12,
|
||||
order: 10,
|
||||
|
||||
@@ -49,14 +49,16 @@ export const option = {
|
||||
{
|
||||
label: '车牌号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 140,
|
||||
span: 12,
|
||||
placeholder: '输入车牌号模糊查询选择',
|
||||
placeholder: '请选择车牌号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
|
||||
@@ -78,17 +78,20 @@ export const option = {
|
||||
prop: 'policyFile',
|
||||
formslot: true,
|
||||
hide: true,
|
||||
viewDisplay: false,
|
||||
span: 24,
|
||||
},
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 140,
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号/船号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号/船号', trigger: 'change' },
|
||||
{ max: 50, message: '最多 50 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
@@ -108,6 +111,7 @@ export const option = {
|
||||
rules: [
|
||||
{ required: true, message: '请输入保单号', trigger: 'blur' },
|
||||
{ max: 80, message: '最多 80 个字符', trigger: 'blur' },
|
||||
{ pattern: /^[a-zA-Z0-9]+$/, message: '保单号只能输入数字、字母', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
@@ -40,13 +40,15 @@ export const option = {
|
||||
{
|
||||
label: '车牌号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
searchSpan: 6,
|
||||
minWidth: 130,
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
|
||||
@@ -92,13 +92,15 @@ export const option = {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 150,
|
||||
placeholder: '输入车牌号/船号查询选择',
|
||||
placeholder: '请选择车牌号/船号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号/船号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号/船号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
|
||||
@@ -17,16 +17,6 @@ export const vehicleTypeDic = [
|
||||
{ label: '船舶', value: '船舶' },
|
||||
];
|
||||
|
||||
export const expenseTypeDic = [
|
||||
{ label: '过路费', value: '过路费' },
|
||||
{ label: '停车费', value: '停车费' },
|
||||
{ label: '维修费', value: '维修费' },
|
||||
{ label: '保险费', value: '保险费' },
|
||||
{ label: '年检费', value: '年检费' },
|
||||
{ label: '装卸费', value: '装卸费' },
|
||||
{ label: '其他', value: '其他' },
|
||||
];
|
||||
|
||||
export const option = {
|
||||
height: 'auto',
|
||||
calcHeight: 32,
|
||||
@@ -68,14 +58,16 @@ export const option = {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 150,
|
||||
span: 12,
|
||||
placeholder: '输入车牌号/船号查询选择',
|
||||
placeholder: '请选择车牌号/船号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号/船号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号/船号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
@@ -95,7 +87,7 @@ export const option = {
|
||||
label: '费用类型',
|
||||
prop: 'expenseType',
|
||||
type: 'select',
|
||||
dicData: expenseTypeDic,
|
||||
dicData: [],
|
||||
search: true,
|
||||
minWidth: 150,
|
||||
span: 12,
|
||||
|
||||
@@ -49,14 +49,16 @@ export const option = {
|
||||
{
|
||||
label: '车牌号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 130,
|
||||
span: 12,
|
||||
placeholder: '输入车牌号查询选择',
|
||||
placeholder: '请选择车牌号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
|
||||
@@ -47,11 +47,13 @@ export const option = {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 140,
|
||||
placeholder: '输入车牌号/船号模糊查询选择',
|
||||
placeholder: '请选择车牌号/船号',
|
||||
rules: [{ max: 30, message: '最多 30 个字符', trigger: 'blur' }],
|
||||
},
|
||||
{
|
||||
|
||||
@@ -70,14 +70,16 @@ export const option = {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 140,
|
||||
span: 12,
|
||||
placeholder: '输入车牌号/船号查询选择',
|
||||
placeholder: '请选择车牌号/船号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号/船号', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号/船号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
@@ -117,13 +119,13 @@ export const option = {
|
||||
{
|
||||
label: '日期',
|
||||
prop: 'violationTime',
|
||||
type: 'datetime',
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
type: 'date',
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
minWidth: 170,
|
||||
minWidth: 140,
|
||||
span: 12,
|
||||
placeholder: '请选择',
|
||||
rules: [{ required: true, message: '请选择时间', trigger: 'click' }],
|
||||
rules: [{ required: true, message: '请选择日期', trigger: 'click' }],
|
||||
},
|
||||
{
|
||||
label: '地点',
|
||||
|
||||
@@ -1,7 +1,18 @@
|
||||
<template>
|
||||
<router-view #="{ Component }">
|
||||
<keep-alive :include="$store.getters.tagsKeep">
|
||||
<component :is="Component" />
|
||||
<component :is="tabView($route, Component)" />
|
||||
</keep-alive>
|
||||
</router-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tabView } from '@/router/tab';
|
||||
|
||||
export default {
|
||||
name: 'layout',
|
||||
methods: {
|
||||
tabView,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
+28
-1
@@ -2,11 +2,38 @@ import router from './router/';
|
||||
import store from './store';
|
||||
import { tabKeyOf } from '@/router/tab';
|
||||
import { getToken } from '@/utils/auth';
|
||||
import {
|
||||
consumeReloadQuery,
|
||||
hasReloadQuery,
|
||||
isChunkLoadError,
|
||||
reloadForChunkError,
|
||||
setPendingRoutePath,
|
||||
} from '@/utils/chunk-reload';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import NProgress from 'nprogress'; // progress bar
|
||||
import 'nprogress/nprogress.css'; // progress bar style
|
||||
NProgress.configure({ showSpinner: false });
|
||||
const lockPage = '/lock'; //锁屏页
|
||||
|
||||
// 懒加载 chunk / CSS 失败时整页刷新，避免菜单点击后卡死
|
||||
router.onError(error => {
|
||||
if (!isChunkLoadError(error)) return;
|
||||
if (reloadForChunkError()) {
|
||||
ElMessage.warning('页面资源已更新，正在重新加载…');
|
||||
}
|
||||
});
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
if (hasReloadQuery(to.query)) {
|
||||
next({
|
||||
path: to.path,
|
||||
query: consumeReloadQuery(to.query),
|
||||
hash: to.hash,
|
||||
replace: true,
|
||||
});
|
||||
return;
|
||||
}
|
||||
setPendingRoutePath(to.fullPath);
|
||||
const meta = to.meta || {};
|
||||
const isMenu = meta.menu === undefined ? to.query.menu : meta.menu;
|
||||
store.commit('SET_IS_MENU', isMenu === undefined);
|
||||
@@ -35,7 +62,7 @@ router.beforeEach((to, from, next) => {
|
||||
fullPath: tabKeyOf(to),
|
||||
params: to.params,
|
||||
query: to.query,
|
||||
meta: meta,
|
||||
meta: { ...meta, keepAlive: true },
|
||||
});
|
||||
}
|
||||
next();
|
||||
|
||||
+13
-10
@@ -2,6 +2,7 @@ import website from '@/config/website';
|
||||
import { getToken } from '@/utils/auth';
|
||||
import store from '@/store';
|
||||
import { generateIframePath, processUrlForQuery, isURL } from './router';
|
||||
import { wrapViewLoader } from '@/utils/chunk-reload';
|
||||
const modules = import.meta.glob('../**/**/*.vue');
|
||||
|
||||
// 将多级路由扁平化为二级路由，支持 keep-alive 跨层级缓存
|
||||
@@ -96,21 +97,23 @@ RouterPlugin.install = function (option = {}) {
|
||||
component: (() => {
|
||||
// 判断是否为首路由
|
||||
if (first) {
|
||||
return modules[
|
||||
option.store.getters.isMacOs || !website.setting.menu
|
||||
? '../page/index/layout.vue'
|
||||
: '../page/index/index.vue'
|
||||
];
|
||||
return wrapViewLoader(
|
||||
modules[
|
||||
option.store.getters.isMacOs || !website.setting.menu
|
||||
? '../page/index/layout.vue'
|
||||
: '../page/index/index.vue'
|
||||
]
|
||||
);
|
||||
// 判断是否为多层路由
|
||||
} else if (isChild && !first) {
|
||||
return modules['../page/index/layout.vue'];
|
||||
return wrapViewLoader(modules['../page/index/layout.vue']);
|
||||
// 判断是否为最终的页面视图
|
||||
} else {
|
||||
let result = modules[`../${component}.vue`];
|
||||
if (!result) {
|
||||
isComponent = false;
|
||||
}
|
||||
return result;
|
||||
return wrapViewLoader(result);
|
||||
}
|
||||
})(),
|
||||
name,
|
||||
@@ -127,7 +130,7 @@ RouterPlugin.install = function (option = {}) {
|
||||
if (first) {
|
||||
oMenu[propsDefault.path] = `${path}`;
|
||||
let componentPath = oMenu.component || component;
|
||||
let result = modules[`../${componentPath}.vue`];
|
||||
let result = wrapViewLoader(modules[`../${componentPath}.vue`]);
|
||||
if (!result) {
|
||||
isComponent = false;
|
||||
}
|
||||
@@ -173,7 +176,7 @@ export const formatPath = (ele, first) => {
|
||||
const icon = ele[propsDefault.icon];
|
||||
ele[propsDefault.icon] = icon || '';
|
||||
ele.meta = {
|
||||
keepAlive: ele.isOpen === 2,
|
||||
keepAlive: true,
|
||||
};
|
||||
const iframeComponent = 'components/iframe/main';
|
||||
const iframeSrc = href => {
|
||||
@@ -215,7 +218,7 @@ export const formatPath = (ele, first) => {
|
||||
ele[propsDefault.children].forEach(child => {
|
||||
child.component = 'views' + child[propsDefault.path];
|
||||
child.meta = {
|
||||
keepAlive: child.isOpen === 2,
|
||||
keepAlive: true,
|
||||
};
|
||||
if (isURL(child[propsDefault.href])) {
|
||||
let href = child[propsDefault.href];
|
||||
|
||||
+1
-1
@@ -128,5 +128,5 @@ export function tabView(route, Component) {
|
||||
};
|
||||
wrapperMap.set(tabKey, wrapper);
|
||||
}
|
||||
return h(wrapper);
|
||||
return wrapper;
|
||||
}
|
||||
|
||||
@@ -155,6 +155,18 @@ export default [
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/business/contract-manage/detail',
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: '合同详情',
|
||||
meta: { keepAlive: false, activeMenu: '/business/contract-manage' },
|
||||
component: () => import('@/views/business/contract-manage.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/business/project-apply/form',
|
||||
component: Layout,
|
||||
|
||||
@@ -16,11 +16,8 @@ const getters = {
|
||||
lockPasswd: state => state.common.lockPasswd,
|
||||
tagList: state => state.tags.tagList,
|
||||
tagsKeep: (state, getters) => {
|
||||
return getters.tagList
|
||||
.filter(ele => {
|
||||
return (ele.meta || {}).keepAlive;
|
||||
})
|
||||
.map(ele => ele.fullPath);
|
||||
// 所有已打开标签均纳入 keep-alive，关闭标签后自动从白名单移除并释放实例
|
||||
return getters.tagList.map(ele => ele.fullPath).filter(Boolean);
|
||||
},
|
||||
tagWel: state => state.tags.tagWel,
|
||||
token: state => state.user.token,
|
||||
|
||||
@@ -0,0 +1,168 @@
|
||||
/**
|
||||
* 懒加载 chunk / CSS preload 失败后的整页恢复。
|
||||
* 常见于：部署后旧 hash 失效、静态服务空闲断连、代理 CONNECTION_RESET。
|
||||
*
|
||||
* 失败后必须整页刷新：旧入口里的 hashed 资源地址不会自行更新，
|
||||
* 仅捕获路由错误而不刷新时，未打开过的页面会一直无法进入。
|
||||
*/
|
||||
|
||||
const RELOAD_FLAG = 'app:chunk-reload-ts';
|
||||
const RELOAD_QUERY = '_chunkreload';
|
||||
const RELOAD_COOLDOWN_MS = 15000;
|
||||
|
||||
const CHUNK_ERROR_RE =
|
||||
/Failed to fetch dynamically imported module|Importing a module script failed|Unable to preload CSS|error loading dynamically imported module|Loading CSS chunk|Loading chunk .+ failed|ChunkLoadError|Unable to preload|error loading module|Load failed/i;
|
||||
|
||||
/** 最近一次路由跳转目标，供 onError 时整页落到正确地址 */
|
||||
let pendingFullPath = '';
|
||||
let installed = false;
|
||||
let reloading = false;
|
||||
|
||||
export function setPendingRoutePath(fullPath = '') {
|
||||
pendingFullPath = fullPath || '';
|
||||
}
|
||||
|
||||
function collectErrorText(error, depth = 0) {
|
||||
if (!error || depth > 3) return '';
|
||||
if (typeof error === 'string') return error;
|
||||
const parts = [
|
||||
error.message,
|
||||
error.msg,
|
||||
error.name,
|
||||
error.stack,
|
||||
error.error && collectErrorText(error.error, depth + 1),
|
||||
error.reason && collectErrorText(error.reason, depth + 1),
|
||||
error.cause && collectErrorText(error.cause, depth + 1),
|
||||
error.payload && collectErrorText(error.payload, depth + 1),
|
||||
];
|
||||
const target = error.target;
|
||||
if (target && (target.src || target.href)) {
|
||||
parts.push(target.src || target.href);
|
||||
}
|
||||
try {
|
||||
parts.push(String(error));
|
||||
} catch (e) {
|
||||
/* ignore */
|
||||
}
|
||||
return parts.filter(Boolean).join(' ');
|
||||
}
|
||||
|
||||
export function isChunkLoadError(error) {
|
||||
const text = collectErrorText(error);
|
||||
if (!text) return false;
|
||||
if (CHUNK_ERROR_RE.test(text)) return true;
|
||||
return /Failed to fetch/i.test(text) && /\.m?js(\?|$|:)/i.test(text);
|
||||
}
|
||||
|
||||
export function hasReloadQuery(query = {}) {
|
||||
return !!(query && query[RELOAD_QUERY] !== undefined);
|
||||
}
|
||||
|
||||
export function consumeReloadQuery(query = {}) {
|
||||
if (!hasReloadQuery(query)) return query;
|
||||
const next = { ...query };
|
||||
delete next[RELOAD_QUERY];
|
||||
return next;
|
||||
}
|
||||
|
||||
function buildReloadUrl(targetPath) {
|
||||
const url = new URL(targetPath, window.location.origin);
|
||||
url.searchParams.set(RELOAD_QUERY, String(Date.now()));
|
||||
return url.pathname + url.search + url.hash;
|
||||
}
|
||||
|
||||
/**
|
||||
* @returns {boolean} 是否已触发刷新（冷却期内返回 false，避免死循环）
|
||||
*/
|
||||
export function reloadForChunkError(targetPath) {
|
||||
if (reloading) return false;
|
||||
const now = Date.now();
|
||||
const last = Number(sessionStorage.getItem(RELOAD_FLAG) || 0);
|
||||
if (now - last < RELOAD_COOLDOWN_MS) {
|
||||
return false;
|
||||
}
|
||||
reloading = true;
|
||||
sessionStorage.setItem(RELOAD_FLAG, String(now));
|
||||
const path =
|
||||
targetPath ||
|
||||
pendingFullPath ||
|
||||
`${window.location.pathname}${window.location.search}${window.location.hash}`;
|
||||
const dest = buildReloadUrl(path);
|
||||
// cache: 'reload' 会回写 HTTP 缓存，降低 index.html 仍指向旧 hash 资源的概率
|
||||
fetch(`${window.location.pathname}?${RELOAD_QUERY}=${now}`, {
|
||||
cache: 'reload',
|
||||
credentials: 'same-origin',
|
||||
headers: {
|
||||
Pragma: 'no-cache',
|
||||
'Cache-Control': 'no-cache',
|
||||
},
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(() => {
|
||||
window.location.replace(dest);
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
export function wrapViewLoader(loader) {
|
||||
if (typeof loader !== 'function') return loader;
|
||||
return () =>
|
||||
Promise.resolve()
|
||||
.then(() => loader())
|
||||
.catch(error => {
|
||||
if (isChunkLoadError(error)) {
|
||||
reloadForChunkError();
|
||||
}
|
||||
throw error;
|
||||
});
|
||||
}
|
||||
|
||||
export function installChunkReload() {
|
||||
if (installed || typeof window === 'undefined') return;
|
||||
installed = true;
|
||||
|
||||
window.addEventListener('vite:preloadError', event => {
|
||||
if (reloadForChunkError()) {
|
||||
event.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
window.addEventListener('unhandledrejection', event => {
|
||||
if (!isChunkLoadError(event.reason)) return;
|
||||
if (reloadForChunkError()) {
|
||||
event.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
window.addEventListener(
|
||||
'error',
|
||||
event => {
|
||||
const el = event.target;
|
||||
const isAssetNode =
|
||||
el &&
|
||||
el !== window &&
|
||||
(el.tagName === 'SCRIPT' ||
|
||||
(el.tagName === 'LINK' && /modulepreload|stylesheet/i.test(el.rel || '')));
|
||||
if (isAssetNode || isChunkLoadError(event.error || event.message)) {
|
||||
if (reloadForChunkError()) {
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
},
|
||||
true
|
||||
);
|
||||
|
||||
document.addEventListener('visibilitychange', () => {
|
||||
if (document.visibilityState === 'visible') checkDeployedAssets();
|
||||
});
|
||||
}
|
||||
|
||||
function checkDeployedAssets() {
|
||||
const el = document.querySelector('script[type="module"][src*="/assets/"]');
|
||||
if (!el || !el.src) return;
|
||||
fetch(el.src, { method: 'HEAD', cache: 'no-store', credentials: 'same-origin' })
|
||||
.then(res => {
|
||||
if (res.status === 404) reloadForChunkError();
|
||||
})
|
||||
.catch(() => {});
|
||||
}
|
||||
@@ -20,6 +20,16 @@
|
||||
批量删除
|
||||
</el-button>
|
||||
<div class="insurance-ocr-template-page__search">
|
||||
<el-select
|
||||
v-model="query.vehicleType"
|
||||
clearable
|
||||
placeholder="车船类型"
|
||||
style="width: 140px"
|
||||
@change="search"
|
||||
>
|
||||
<el-option label="车辆" value="车辆" />
|
||||
<el-option label="船舶" value="船舶" />
|
||||
</el-select>
|
||||
<el-input
|
||||
v-model="query.name"
|
||||
clearable
|
||||
@@ -42,6 +52,7 @@
|
||||
<el-table-column type="selection" width="48" />
|
||||
<el-table-column type="index" label="序号" width="70" align="center" />
|
||||
<el-table-column prop="name" label="模板名称" min-width="220" show-overflow-tooltip />
|
||||
<el-table-column prop="vehicleType" label="车船类型" min-width="110" />
|
||||
<el-table-column label="已配置字段" min-width="150">
|
||||
<template #default="{ row }">{{ getMappingCount(row.mappingConfig) }}</template>
|
||||
</el-table-column>
|
||||
@@ -94,6 +105,12 @@
|
||||
<el-form-item label="模板名称" prop="name">
|
||||
<el-input v-model="form.name" maxlength="100" show-word-limit />
|
||||
</el-form-item>
|
||||
<el-form-item label="车船类型" prop="vehicleType">
|
||||
<el-radio-group v-model="form.vehicleType">
|
||||
<el-radio label="车辆">车辆</el-radio>
|
||||
<el-radio label="船舶">船舶</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="字段映射" required>
|
||||
<el-table :data="mappingRows" border class="insurance-ocr-template-page__mapping-table">
|
||||
<el-table-column prop="key" label="键名" width="180" align="center" />
|
||||
@@ -165,8 +182,8 @@ export default {
|
||||
readonly: false,
|
||||
data: [],
|
||||
selectionList: [],
|
||||
query: { name: '' },
|
||||
form: { id: '', name: '' },
|
||||
query: { name: '', vehicleType: '' },
|
||||
form: { id: '', name: '', vehicleType: '车辆' },
|
||||
mappingRows: createMappingRows(),
|
||||
page: {
|
||||
pageSize: 10,
|
||||
@@ -176,6 +193,7 @@ export default {
|
||||
},
|
||||
rules: {
|
||||
name: [{ required: true, message: '请输入模板名称', trigger: 'blur' }],
|
||||
vehicleType: [{ required: true, message: '请选择车船类型', trigger: 'change' }],
|
||||
},
|
||||
};
|
||||
},
|
||||
@@ -218,6 +236,7 @@ export default {
|
||||
},
|
||||
resetSearch() {
|
||||
this.query.name = '';
|
||||
this.query.vehicleType = '';
|
||||
this.search();
|
||||
},
|
||||
currentChange(currentPage) {
|
||||
@@ -235,18 +254,23 @@ export default {
|
||||
openDialog(row, readonly = false) {
|
||||
this.readonly = readonly;
|
||||
if (!row?.id) {
|
||||
this.form = { id: '', name: '', vehicleType: '车辆' };
|
||||
this.dialogVisible = true;
|
||||
return;
|
||||
}
|
||||
getDetail(row.id).then(res => {
|
||||
const detail = res.data.data || {};
|
||||
this.form = { id: detail.id, name: detail.name || '' };
|
||||
this.form = {
|
||||
id: detail.id,
|
||||
name: detail.name || '',
|
||||
vehicleType: detail.vehicleType || '车辆',
|
||||
};
|
||||
this.mappingRows = createMappingRows(detail.mappingConfig);
|
||||
this.dialogVisible = true;
|
||||
});
|
||||
},
|
||||
resetForm() {
|
||||
this.form = { id: '', name: '' };
|
||||
this.form = { id: '', name: '', vehicleType: '车辆' };
|
||||
this.mappingRows = createMappingRows();
|
||||
this.readonly = false;
|
||||
this.submitLoading = false;
|
||||
@@ -264,6 +288,7 @@ export default {
|
||||
submit({
|
||||
id: this.form.id || undefined,
|
||||
name: String(this.form.name || '').trim(),
|
||||
vehicleType: this.form.vehicleType || '车辆',
|
||||
mappingConfig: JSON.stringify(
|
||||
this.mappingRows.map(item => ({ key: item.key, value: String(item.value || '').trim() }))
|
||||
),
|
||||
@@ -311,7 +336,7 @@ export default {
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-left: auto;
|
||||
width: 380px;
|
||||
width: 520px;
|
||||
}
|
||||
|
||||
&__mapping-table {
|
||||
|
||||
@@ -0,0 +1,255 @@
|
||||
<template>
|
||||
<basic-container class="measurement-unit-page">
|
||||
<avue-crud
|
||||
:option="option"
|
||||
:table-loading="loading"
|
||||
:data="data"
|
||||
v-model:page="page"
|
||||
v-model="form"
|
||||
ref="crud"
|
||||
:permission="permissionList"
|
||||
:before-open="beforeOpen"
|
||||
@row-save="rowSave"
|
||||
@row-update="rowUpdate"
|
||||
@search-change="searchChange"
|
||||
@search-reset="searchReset"
|
||||
@selection-change="selectionChange"
|
||||
@current-change="currentChange"
|
||||
@size-change="sizeChange"
|
||||
@refresh-change="refreshChange"
|
||||
@on-load="onLoad"
|
||||
>
|
||||
<template #menu-left>
|
||||
<el-button
|
||||
v-if="hasPermission('measurement_unit_add')"
|
||||
type="primary"
|
||||
@click="$refs.crud.rowAdd()"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="hasPermission('measurement_unit_delete')"
|
||||
type="danger"
|
||||
plain
|
||||
:disabled="!selectionList.length"
|
||||
@click="handleDelete"
|
||||
>
|
||||
批量删除
|
||||
</el-button>
|
||||
</template>
|
||||
<template #dimension="{ row }">
|
||||
{{ row.dimension || '-' }}
|
||||
</template>
|
||||
<template #status="{ row }">
|
||||
<el-tag :type="row.status === 1 ? 'primary' : 'info'" class="status-text">
|
||||
{{ row.status === 1 ? '启用' : '停用' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
<template #menu="{ row, index }">
|
||||
<el-link
|
||||
v-if="hasPermission('measurement_unit_edit')"
|
||||
type="primary"
|
||||
@click="$refs.crud.rowEdit(row, index)"
|
||||
>
|
||||
编辑
|
||||
</el-link>
|
||||
<el-link
|
||||
v-if="hasPermission('measurement_unit_status')"
|
||||
type="primary"
|
||||
@click="handleStatus(row)"
|
||||
>
|
||||
{{ row.status === 1 ? '停用' : '启用' }}
|
||||
</el-link>
|
||||
<el-link
|
||||
v-if="hasPermission('measurement_unit_delete')"
|
||||
type="danger"
|
||||
@click="handleDelete(row.id)"
|
||||
>
|
||||
删除
|
||||
</el-link>
|
||||
</template>
|
||||
</avue-crud>
|
||||
<empty-pagination
|
||||
:page="page"
|
||||
@size-change="sizeChange"
|
||||
@current-change="currentChange"
|
||||
@load="onLoad(page, query)"
|
||||
/>
|
||||
</basic-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { changeStatus, getDetail, getList, remove, submit } from '@/api/base/measurement-unit';
|
||||
import { createOption } from '@/option/base/measurement-unit';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {},
|
||||
query: {},
|
||||
loading: true,
|
||||
data: [],
|
||||
page: {
|
||||
pageSize: 10,
|
||||
pageSizes: [10, 20, 50, 100],
|
||||
currentPage: 1,
|
||||
total: 0,
|
||||
},
|
||||
selectionList: [],
|
||||
option: createOption(),
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['permission', 'userInfo']),
|
||||
permissionList() {
|
||||
return {
|
||||
addBtn: this.hasPermission('measurement_unit_add'),
|
||||
};
|
||||
},
|
||||
ids() {
|
||||
return this.selectionList.map(item => item.id).join(',');
|
||||
},
|
||||
isAdmin() {
|
||||
return String(this.userInfo?.authority || '').includes('admin');
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
hasPermission(code) {
|
||||
return this.isAdmin || this.permission?.[code] === true;
|
||||
},
|
||||
normalizeRow(row) {
|
||||
row.unitName = String(row.unitName || '').trim();
|
||||
row.dimension = String(row.dimension || '').trim();
|
||||
row.remark = String(row.remark || '').trim();
|
||||
if (!row.status) row.status = 1;
|
||||
return row;
|
||||
},
|
||||
rowSave(row, done, loading) {
|
||||
submit(this.normalizeRow(row)).then(
|
||||
() => {
|
||||
this.onLoad(this.page, this.query);
|
||||
this.$message.success('操作成功');
|
||||
done();
|
||||
},
|
||||
() => loading()
|
||||
);
|
||||
},
|
||||
rowUpdate(row, index, done, loading) {
|
||||
submit(this.normalizeRow(row)).then(
|
||||
() => {
|
||||
this.onLoad(this.page, this.query);
|
||||
this.$message.success('操作成功');
|
||||
done();
|
||||
},
|
||||
() => loading()
|
||||
);
|
||||
},
|
||||
handleDelete(ids = '') {
|
||||
const targetIds = ids || this.ids;
|
||||
if (!targetIds) {
|
||||
this.$message.warning('请选择至少一条数据');
|
||||
return;
|
||||
}
|
||||
this.$confirm('确定删除所选数据，删除后不可恢复?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => remove(targetIds))
|
||||
.then(() => {
|
||||
this.onLoad(this.page, this.query);
|
||||
this.$message.success('操作成功');
|
||||
this.selectionList = [];
|
||||
});
|
||||
},
|
||||
handleStatus(row) {
|
||||
const nextStatus = row.status === 1 ? 2 : 1;
|
||||
const actionName = nextStatus === 1 ? '启用' : '停用';
|
||||
this.$confirm(`是否确认${actionName}该计量单位？`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => changeStatus(row.id, nextStatus))
|
||||
.then(() => {
|
||||
this.onLoad(this.page, this.query);
|
||||
this.$message.success('操作成功');
|
||||
});
|
||||
},
|
||||
beforeOpen(done, type) {
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
getDetail(this.form.id).then(res => {
|
||||
this.form = res.data.data || {};
|
||||
done();
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.form.status = 1;
|
||||
done();
|
||||
},
|
||||
searchReset() {
|
||||
this.query = {};
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad(this.page, this.query);
|
||||
},
|
||||
searchChange(params, done) {
|
||||
this.query = { ...params };
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad(this.page, this.query);
|
||||
done();
|
||||
},
|
||||
selectionChange(list) {
|
||||
this.selectionList = list;
|
||||
},
|
||||
currentChange(currentPage) {
|
||||
this.page.currentPage = currentPage;
|
||||
this.onLoad(this.page, this.query);
|
||||
},
|
||||
sizeChange(pageSize) {
|
||||
this.page.pageSize = pageSize;
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad(this.page, this.query);
|
||||
},
|
||||
refreshChange() {
|
||||
this.onLoad(this.page, this.query);
|
||||
},
|
||||
onLoad(page = this.page, params = this.query) {
|
||||
this.loading = true;
|
||||
return getList(page.currentPage, page.pageSize, params)
|
||||
.then(res => {
|
||||
const pageData = res.data.data || {};
|
||||
this.data = pageData.records || [];
|
||||
this.page.total = pageData.total || 0;
|
||||
this.selectionList = [];
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.measurement-unit-page {
|
||||
:deep(.avue-crud__menu) {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
:deep(.avue-crud__search .el-form-item__label) {
|
||||
min-width: 160px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
:deep(.avue-crud__menu-column) {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
:deep(.avue-crud__menu .el-link) {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -251,7 +251,12 @@ export default {
|
||||
prop: 'regionLevel',
|
||||
type: 'radio',
|
||||
dicUrl: '/blade-system/dict/dictionary?code=region',
|
||||
dicFormatter: list => list.filter(item => Number(item.dictKey) !== 0),
|
||||
dicFormatter: response => {
|
||||
const list = Array.isArray(response) ? response : response?.data;
|
||||
return (Array.isArray(list) ? list : [])
|
||||
.filter(item => Number(item.dictKey) !== 0)
|
||||
.map(item => ({ ...item, dictKey: Number(item.dictKey) }));
|
||||
},
|
||||
props: {
|
||||
label: 'dictValue',
|
||||
value: 'dictKey',
|
||||
|
||||
@@ -229,32 +229,38 @@
|
||||
</div></template
|
||||
></el-table-column
|
||||
>
|
||||
<el-table-column label="保底计费重量" width="240"
|
||||
<el-table-column width="240"
|
||||
><template #header
|
||||
><span class="billing-plan-editor__column-title"
|
||||
>保底计费重量<el-tooltip content="实际计量值小于保底数值时按保底计费" placement="top"
|
||||
><el-icon class="billing-plan-editor__default-tip"><InfoFilled /></el-icon></el-tooltip></span></template
|
||||
><template #default="{ row }"
|
||||
><div v-if="readonly && usesRangeMinimum(row)" class="limit-list">
|
||||
<span v-for="(item, rangeIndex) in getRanges(row)" :key="rangeIndex">{{
|
||||
displayValue(item.minimumBillingWeight)
|
||||
rangeIndex === 0
|
||||
? displayValue(item.minimumBillingWeight || row.minimumBillingWeight)
|
||||
: ''
|
||||
}}</span>
|
||||
</div>
|
||||
<span v-else-if="readonly">{{ displayValue(row.minimumBillingWeight) }}</span>
|
||||
<div v-else-if="usesRangeMinimum(row)" class="limit-list">
|
||||
<el-input
|
||||
v-for="(item, rangeIndex) in getRanges(row)"
|
||||
:key="rangeIndex"
|
||||
v-model="item.minimumBillingWeight"
|
||||
:disabled="!canEditMinimum(row)"
|
||||
:placeholder="canEditMinimum(row) ? '请输入保底计费重量' : '无需配置'"
|
||||
@input="value => rangeMinimumInput(row, rangeIndex, value)"
|
||||
/>
|
||||
<template v-for="(item, rangeIndex) in getRanges(row)" :key="rangeIndex">
|
||||
<el-input
|
||||
v-if="rangeIndex === 0"
|
||||
v-model="item.minimumBillingWeight"
|
||||
:disabled="!canEditMinimum(row)"
|
||||
:placeholder="canEditMinimum(row) ? '请输入' : '无需配置'"
|
||||
@input="value => rangeMinimumInput(row, rangeIndex, value)"
|
||||
/>
|
||||
<div v-else class="limit-placeholder" />
|
||||
</template>
|
||||
</div>
|
||||
<el-input
|
||||
v-else
|
||||
v-model="row.minimumBillingWeight"
|
||||
:disabled="!canEditMinimum(row)"
|
||||
:placeholder="
|
||||
canEditMinimum(row)
|
||||
? '实际计量值小于保底数值时按保底计费'
|
||||
: '仅按重量、按吨·公里可填写'
|
||||
canEditMinimum(row) ? '请输入' : '仅按重量、按吨·公里可填写'
|
||||
"
|
||||
@input="value => decimalInput(row, 'minimumBillingWeight', value)" /></template
|
||||
></el-table-column>
|
||||
@@ -297,9 +303,6 @@
|
||||
<el-descriptions-item label="目的地">{{
|
||||
displayValue(matchForm.destination)
|
||||
}}</el-descriptions-item>
|
||||
<el-descriptions-item label="运输方式">{{
|
||||
transportModeLabel(matchForm.transportMode)
|
||||
}}</el-descriptions-item>
|
||||
<el-descriptions-item label="货物类型">{{
|
||||
displayValue(matchForm.cargoType)
|
||||
}}</el-descriptions-item>
|
||||
@@ -334,21 +337,6 @@
|
||||
@visible-change="v => v && ensureRegions()"
|
||||
@change="v => matchRegionChange('destination', v)" /></el-form-item
|
||||
></el-col>
|
||||
<el-col :span="12"
|
||||
><el-form-item label="运输方式"
|
||||
><el-select
|
||||
v-model="matchForm.transportMode"
|
||||
:loading="transportModeLoading"
|
||||
:disabled="readonly"
|
||||
placeholder="请选择运输方式"
|
||||
clearable
|
||||
filterable
|
||||
><el-option
|
||||
v-for="item in transportModeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value" /></el-select></el-form-item
|
||||
></el-col>
|
||||
<el-col :span="12"
|
||||
><el-form-item label="货物类型"
|
||||
><el-cascader
|
||||
@@ -560,30 +548,24 @@ export default {
|
||||
return next;
|
||||
},
|
||||
normalizeRanges(row) {
|
||||
const ranges = Array.isArray(row.limitRanges)
|
||||
? row.limitRanges
|
||||
.map(item => ({
|
||||
lowerLimit: item?.lowerLimit ?? '',
|
||||
upperLimit: item?.upperLimit ?? '',
|
||||
unitPrice:
|
||||
item?.unitPrice === undefined || item?.unitPrice === ''
|
||||
? row.unitPrice ?? ''
|
||||
: item.unitPrice,
|
||||
minimumBillingWeight:
|
||||
item?.minimumBillingWeight === undefined || item?.minimumBillingWeight === ''
|
||||
? this.usesRangeMinimum(row)
|
||||
? row.minimumBillingWeight ?? ''
|
||||
: ''
|
||||
: item.minimumBillingWeight,
|
||||
}))
|
||||
.filter(
|
||||
item =>
|
||||
item.lowerLimit !== '' ||
|
||||
item.upperLimit !== '' ||
|
||||
item.unitPrice !== '' ||
|
||||
item.minimumBillingWeight !== ''
|
||||
)
|
||||
: [];
|
||||
const rawRanges = Array.isArray(row.limitRanges) ? row.limitRanges : [];
|
||||
const ranges = rawRanges
|
||||
.map((item, index) => ({
|
||||
lowerLimit: item?.lowerLimit ?? '',
|
||||
upperLimit: item?.upperLimit ?? '',
|
||||
unitPrice:
|
||||
item?.unitPrice === undefined || item?.unitPrice === ''
|
||||
? row.unitPrice ?? ''
|
||||
: item.unitPrice,
|
||||
minimumBillingWeight: this.resolveRangeMinimum(row, item, index),
|
||||
}))
|
||||
.filter(
|
||||
item =>
|
||||
item.lowerLimit !== '' ||
|
||||
item.upperLimit !== '' ||
|
||||
item.unitPrice !== '' ||
|
||||
item.minimumBillingWeight !== ''
|
||||
);
|
||||
if (
|
||||
!ranges.length &&
|
||||
(row.lowerLimit !== '' ||
|
||||
@@ -598,9 +580,23 @@ export default {
|
||||
minimumBillingWeight: this.usesRangeMinimum(row) ? row.minimumBillingWeight ?? '' : '',
|
||||
});
|
||||
return ranges.length
|
||||
? ranges
|
||||
? ranges.map((item, index) => ({
|
||||
...item,
|
||||
minimumBillingWeight: this.usesRangeMinimum(row)
|
||||
? index === 0
|
||||
? item.minimumBillingWeight
|
||||
: ''
|
||||
: '',
|
||||
}))
|
||||
: [{ lowerLimit: '', upperLimit: '', unitPrice: '', minimumBillingWeight: '' }];
|
||||
},
|
||||
resolveRangeMinimum(row, item, index) {
|
||||
if (!this.usesRangeMinimum(row) || index !== 0) return '';
|
||||
if (item?.minimumBillingWeight !== undefined && item?.minimumBillingWeight !== '') {
|
||||
return item.minimumBillingWeight;
|
||||
}
|
||||
return row.minimumBillingWeight ?? '';
|
||||
},
|
||||
syncLegacyLimit(row) {
|
||||
const first = row.limitRanges?.[0] || {};
|
||||
row.lowerLimit = first.lowerLimit ?? '';
|
||||
@@ -803,11 +799,16 @@ export default {
|
||||
if (index === 0) row.unitPrice = target.value;
|
||||
},
|
||||
rangeMinimumInput(row, index, value) {
|
||||
if (index !== 0) return;
|
||||
row.limitRanges = this.getRanges(row);
|
||||
const target = { value };
|
||||
this.decimalInput(target, 'value', value);
|
||||
row.limitRanges[index].minimumBillingWeight = target.value;
|
||||
if (index === 0) row.minimumBillingWeight = target.value;
|
||||
row.limitRanges[0].minimumBillingWeight = target.value;
|
||||
row.minimumBillingWeight = target.value;
|
||||
row.limitRanges = row.limitRanges.map((item, rangeIndex) => ({
|
||||
...item,
|
||||
minimumBillingWeight: rangeIndex === 0 ? target.value : '',
|
||||
}));
|
||||
},
|
||||
addRule() {
|
||||
this.draft.rules.push(defaultRule());
|
||||
@@ -929,15 +930,22 @@ export default {
|
||||
plan.transportModeLabel = transportMode?.label || plan.transportMode;
|
||||
plan.rules = plan.rules.map(rule => {
|
||||
const ranges = this.canEditLimit(rule) ? this.getRanges(rule) : [];
|
||||
const normalizedRanges = ranges.map((item, rangeIndex) => ({
|
||||
...item,
|
||||
minimumBillingWeight:
|
||||
this.usesRangeMinimum(rule) && rangeIndex === 0 ? item.minimumBillingWeight || '' : '',
|
||||
}));
|
||||
return {
|
||||
...rule,
|
||||
unitPrice: this.usesRangeUnitPrice(rule) ? ranges[0]?.unitPrice || '' : rule.unitPrice,
|
||||
limitRanges: ranges,
|
||||
lowerLimit: ranges[0]?.lowerLimit || '',
|
||||
upperLimit: ranges[0]?.upperLimit || '',
|
||||
unitPrice: this.usesRangeUnitPrice(rule)
|
||||
? normalizedRanges[0]?.unitPrice || ''
|
||||
: rule.unitPrice,
|
||||
limitRanges: normalizedRanges,
|
||||
lowerLimit: normalizedRanges[0]?.lowerLimit || '',
|
||||
upperLimit: normalizedRanges[0]?.upperLimit || '',
|
||||
minimumBillingWeight: this.canEditMinimum(rule)
|
||||
? this.usesRangeMinimum(rule)
|
||||
? ranges[0]?.minimumBillingWeight || ''
|
||||
? normalizedRanges[0]?.minimumBillingWeight || ''
|
||||
: rule.minimumBillingWeight
|
||||
: '',
|
||||
};
|
||||
@@ -950,9 +958,6 @@ export default {
|
||||
this.matchIndex = index;
|
||||
this.matchForm = { ...defaultRule().matchCondition, ...(row.matchCondition || {}) };
|
||||
this.matchVisible = true;
|
||||
this.ensureTransportModes().then(() => {
|
||||
this.matchForm.transportMode = this.normalizeTransportMode(this.matchForm.transportMode);
|
||||
});
|
||||
this.ensureRegions();
|
||||
this.ensureCargo().then(() => {
|
||||
const path = this.resolveCargoPath(this.matchForm);
|
||||
@@ -977,21 +982,6 @@ export default {
|
||||
});
|
||||
return this.transportModeRequest;
|
||||
},
|
||||
normalizeTransportMode(value) {
|
||||
const transportMode = String(value || '').trim();
|
||||
if (!transportMode) return '';
|
||||
const option = this.transportModeOptions.find(item => {
|
||||
const optionValue = String(item.value || '').trim();
|
||||
const optionLabel = String(item.label || '').trim();
|
||||
return (
|
||||
optionValue === transportMode ||
|
||||
optionLabel === transportMode ||
|
||||
optionLabel.includes(transportMode) ||
|
||||
transportMode.includes(optionLabel)
|
||||
);
|
||||
});
|
||||
return option?.value || transportMode;
|
||||
},
|
||||
ensureRegions() {
|
||||
if (this.regionOptions.length) return Promise.resolve(this.regionOptions);
|
||||
if (this.regionRequest) return this.regionRequest;
|
||||
@@ -1214,6 +1204,11 @@ export default {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.billing-plan-editor__column-title {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.limit-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -1229,4 +1224,8 @@ export default {
|
||||
.limit-row .el-input {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.limit-placeholder {
|
||||
height: 32px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1927,13 +1927,13 @@
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-if="showSettlementBillCycleType"
|
||||
label="账单周期类型"
|
||||
label="结算周期"
|
||||
required
|
||||
:error="settlementRuleErrors.billCycleType"
|
||||
>
|
||||
<el-select
|
||||
v-model="settlementRuleForm.billCycleType"
|
||||
placeholder="请选择账单周期类型"
|
||||
placeholder="请选择结算周期"
|
||||
:disabled="dialogReadonly"
|
||||
@change="handleSettlementBillCycleTypeChange"
|
||||
>
|
||||
@@ -1986,6 +1986,59 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div
|
||||
v-if="settlementRuleEnabled && showSettlementCustomPeriods"
|
||||
class="business-crud-page__custom-periods"
|
||||
>
|
||||
<el-table :data="settlementRuleForm.customPeriods || []" border>
|
||||
<el-table-column type="index" label="序号" width="80" align="center" />
|
||||
<el-table-column label="运单区间-开始日" min-width="180" align="center">
|
||||
<template #default="{ row, $index }">
|
||||
<el-select
|
||||
:model-value="row.startDay"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
:disabled="dialogReadonly"
|
||||
@update:model-value="value => handleCustomPeriodStartDayChange($index, value)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in billCutoffDayOptions"
|
||||
:key="`start-${item.value}`"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="运单区间-结束日" min-width="200" align="center">
|
||||
<template #default="{ row, $index }">
|
||||
<el-select
|
||||
:model-value="row.endDay"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
:disabled="dialogReadonly"
|
||||
@update:model-value="value => handleCustomPeriodEndDayChange($index, value)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in customPeriodEndDayOptions(row)"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="!dialogReadonly" label="操作" width="100" align="center">
|
||||
<template #default="{ $index }">
|
||||
<el-link v-if="$index === 0" type="primary" @click="addCustomPeriodRow">添加</el-link>
|
||||
<el-link v-else type="danger" @click="removeCustomPeriodRow($index)">删除</el-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template v-if="!dialogReadonly" #empty>
|
||||
<el-link type="primary" @click="addCustomPeriodRow">添加</el-link>
|
||||
</template>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -5412,13 +5465,19 @@ const defaultBillingPlan = () => ({
|
||||
});
|
||||
|
||||
const defaultSettlementRule = () => ({
|
||||
autoGenerate: 1,
|
||||
autoGenerate: '',
|
||||
billStartDate: '',
|
||||
settlementType: '月结',
|
||||
billCycleType: '固定截单日',
|
||||
billCutoffDay: 25,
|
||||
settlementType: '',
|
||||
billCycleType: '',
|
||||
billCutoffDay: '',
|
||||
cycleDays: '',
|
||||
customPeriods: [],
|
||||
});
|
||||
const normalizeCustomPeriods = (periods = []) =>
|
||||
(periods || []).map(item => ({
|
||||
startDay: Number(item?.startDay) > 0 ? Number(item.startDay) : '',
|
||||
endDay: Number(item?.endDay) > 0 ? Number(item.endDay) : '',
|
||||
}));
|
||||
|
||||
const defaultReconciliation = () => ({
|
||||
skipReconciliation: 1,
|
||||
@@ -5837,7 +5896,7 @@ export default {
|
||||
按数量: ['固定单价', '区间单价', '阶梯单价', '区间阶梯一口价'],
|
||||
},
|
||||
settlementTypeOptions: ['月结', '日结', '周结', '半月结', '固定天数周期结算'],
|
||||
billCycleTypeOptions: ['固定截单日', '自然月'],
|
||||
billCycleTypeOptions: ['固定截单日', '自然月', '自定义多周期'],
|
||||
reconciliationModeOptions: ['明细逐行核对', '按账单汇总核对', '跳过自动核对'],
|
||||
packageOptions,
|
||||
quantityUnitOptions: ['吨', '千克', '立方米', '件', '车', '箱', '托盘'],
|
||||
@@ -6448,6 +6507,11 @@ export default {
|
||||
this.showSettlementBillCycleType && this.settlementRuleForm.billCycleType === '固定截单日'
|
||||
);
|
||||
},
|
||||
showSettlementCustomPeriods() {
|
||||
return (
|
||||
this.showSettlementBillCycleType && this.settlementRuleForm.billCycleType === '自定义多周期'
|
||||
);
|
||||
},
|
||||
showSettlementCycleDays() {
|
||||
return this.settlementRuleForm.settlementType === '固定天数周期结算';
|
||||
},
|
||||
@@ -6874,7 +6938,7 @@ export default {
|
||||
const status = this.statusValue(row);
|
||||
return this.config.permission === 'transport_plan'
|
||||
? ['waiting_dispatch', 'dispatching'].includes(status)
|
||||
: ['pending', 'processing'].includes(status);
|
||||
: ['pending', 'processing', 'running'].includes(status);
|
||||
},
|
||||
canComplete(row) {
|
||||
if (
|
||||
@@ -6888,7 +6952,7 @@ export default {
|
||||
const status = this.statusValue(row);
|
||||
return this.config.permission === 'transport_plan'
|
||||
? status === 'dispatching'
|
||||
: status === 'processing';
|
||||
: status === 'processing' || status === 'running';
|
||||
},
|
||||
canMaintainMileage(row) {
|
||||
return (
|
||||
@@ -7025,7 +7089,7 @@ export default {
|
||||
if (!row) return '-';
|
||||
if (prop === 'businessStatus') return this.displayStatus(row, prop);
|
||||
if (prop === 'feeGenerationMode') {
|
||||
return row[prop] === 'manual' ? '手动生成' : '系统生成';
|
||||
return row[prop] === 'manual' ? '账单导入生成' : '系统生成';
|
||||
}
|
||||
const column = this.findColumn(this.option.column, prop);
|
||||
if (column?.formatter) return column.formatter(row, {}, row[prop]);
|
||||
@@ -7115,7 +7179,9 @@ export default {
|
||||
waybillAmountWithCurrency(row = {}, prop) {
|
||||
const value = this.formatDetailValue(row, prop);
|
||||
if (value === '-') return { value: '-' };
|
||||
return { value: `${this.waybillCurrencyRemark(row)}${value}` };
|
||||
const number = Number(value);
|
||||
const display = Number.isFinite(number) ? number.toFixed(2) : value;
|
||||
return { value: `${this.waybillCurrencyRemark(row)}${display}` };
|
||||
},
|
||||
normalizeTransportPlanWaybillRow(row = {}, index = 0) {
|
||||
const status = row.businessStatus || row.status || row.waybillStatus || '';
|
||||
@@ -7566,23 +7632,32 @@ export default {
|
||||
isFixedBillCutoffSettlement(rule = this.settlementRuleForm) {
|
||||
return this.isMonthlySettlement(rule) && rule.billCycleType === '固定截单日';
|
||||
},
|
||||
isCustomMultiPeriodSettlement(rule = this.settlementRuleForm) {
|
||||
return this.isMonthlySettlement(rule) && rule.billCycleType === '自定义多周期';
|
||||
},
|
||||
isFixedCycleSettlement(rule = this.settlementRuleForm) {
|
||||
return rule.settlementType === '固定天数周期结算';
|
||||
},
|
||||
handleSettlementTypeChange(value) {
|
||||
this.clearSettlementRuleError('settlementType');
|
||||
if (value === '月结') {
|
||||
if (!this.settlementRuleForm.billCycleType) {
|
||||
this.settlementRuleForm.billCycleType = '固定截单日';
|
||||
}
|
||||
if (this.settlementRuleForm.billCycleType === '固定截单日') {
|
||||
this.settlementRuleForm.billCutoffDay = this.settlementRuleForm.billCutoffDay || 25;
|
||||
this.settlementRuleForm.customPeriods = [];
|
||||
} else if (this.settlementRuleForm.billCycleType === '自定义多周期') {
|
||||
this.settlementRuleForm.billCutoffDay = '';
|
||||
this.settlementRuleForm.customPeriods = normalizeCustomPeriods(
|
||||
this.settlementRuleForm.customPeriods || []
|
||||
);
|
||||
} else {
|
||||
this.settlementRuleForm.billCutoffDay = '';
|
||||
this.settlementRuleForm.customPeriods = [];
|
||||
}
|
||||
this.settlementRuleForm.cycleDays = '';
|
||||
return;
|
||||
}
|
||||
this.settlementRuleForm.billCycleType = '';
|
||||
this.settlementRuleForm.billCutoffDay = '';
|
||||
this.settlementRuleForm.customPeriods = [];
|
||||
if (value !== '固定天数周期结算') {
|
||||
this.settlementRuleForm.cycleDays = '';
|
||||
}
|
||||
@@ -7590,10 +7665,17 @@ export default {
|
||||
handleSettlementBillCycleTypeChange(value) {
|
||||
this.clearSettlementRuleError('billCycleType');
|
||||
if (value === '固定截单日') {
|
||||
this.settlementRuleForm.billCutoffDay = this.settlementRuleForm.billCutoffDay || 25;
|
||||
this.settlementRuleForm.customPeriods = [];
|
||||
return;
|
||||
}
|
||||
this.settlementRuleForm.billCutoffDay = '';
|
||||
if (value === '自定义多周期') {
|
||||
this.settlementRuleForm.customPeriods = normalizeCustomPeriods(
|
||||
this.settlementRuleForm.customPeriods || []
|
||||
);
|
||||
return;
|
||||
}
|
||||
this.settlementRuleForm.customPeriods = [];
|
||||
},
|
||||
normalizeSettlementRule(rule = this.settlementRuleForm) {
|
||||
const nextRule = {
|
||||
@@ -7603,14 +7685,94 @@ export default {
|
||||
if (!this.isMonthlySettlement(nextRule)) {
|
||||
nextRule.billCycleType = '';
|
||||
nextRule.billCutoffDay = '';
|
||||
nextRule.customPeriods = [];
|
||||
} else if (!this.isFixedBillCutoffSettlement(nextRule)) {
|
||||
nextRule.billCutoffDay = '';
|
||||
}
|
||||
if (this.isCustomMultiPeriodSettlement(nextRule)) {
|
||||
nextRule.customPeriods = normalizeCustomPeriods(
|
||||
Array.isArray(nextRule.customPeriods) ? nextRule.customPeriods : []
|
||||
);
|
||||
} else {
|
||||
nextRule.customPeriods = [];
|
||||
}
|
||||
if (!this.isFixedCycleSettlement(nextRule)) {
|
||||
nextRule.cycleDays = '';
|
||||
}
|
||||
return nextRule;
|
||||
},
|
||||
customPeriodEndDayOptions(row) {
|
||||
const startDay = Number(row?.startDay);
|
||||
if (!Number.isFinite(startDay) || startDay < 1) return this.billCutoffDayOptions;
|
||||
return Array.from({ length: 31 - startDay + 1 }, (_, index) => {
|
||||
const value = startDay + index;
|
||||
return { label: `${value}日`, value };
|
||||
});
|
||||
},
|
||||
handleCustomPeriodStartDayChange(index, value) {
|
||||
const periods = normalizeCustomPeriods(this.settlementRuleForm.customPeriods || []);
|
||||
const row = periods[index];
|
||||
if (!row) return;
|
||||
row.startDay = value || '';
|
||||
const startDay = Number(row.startDay);
|
||||
const endDay = Number(row.endDay);
|
||||
if (
|
||||
Number.isFinite(startDay) &&
|
||||
Number.isFinite(endDay) &&
|
||||
(endDay < startDay || endDay > 31)
|
||||
) {
|
||||
row.endDay = '';
|
||||
}
|
||||
this.settlementRuleForm.customPeriods = periods;
|
||||
},
|
||||
handleCustomPeriodEndDayChange(index, value) {
|
||||
const periods = normalizeCustomPeriods(this.settlementRuleForm.customPeriods || []);
|
||||
const row = periods[index];
|
||||
if (!row) return;
|
||||
row.endDay = value || '';
|
||||
this.settlementRuleForm.customPeriods = periods;
|
||||
},
|
||||
addCustomPeriodRow() {
|
||||
const periods = normalizeCustomPeriods(this.settlementRuleForm.customPeriods || []);
|
||||
periods.push({ startDay: '', endDay: '' });
|
||||
this.settlementRuleForm.customPeriods = periods;
|
||||
},
|
||||
removeCustomPeriodRow(index) {
|
||||
if (index <= 0) return;
|
||||
const periods = [...(this.settlementRuleForm.customPeriods || [])];
|
||||
periods.splice(index, 1);
|
||||
this.settlementRuleForm.customPeriods = normalizeCustomPeriods(periods);
|
||||
},
|
||||
validateCustomPeriods(periods = [], label = '') {
|
||||
const rows = normalizeCustomPeriods(periods);
|
||||
const prefix = label ? `${label}：` : '';
|
||||
if (!rows.length) {
|
||||
this.$message.warning(`${prefix}请至少配置一段自定义周期`);
|
||||
return false;
|
||||
}
|
||||
for (let index = 0; index < rows.length; index += 1) {
|
||||
const row = rows[index];
|
||||
const startDay = Number(row.startDay);
|
||||
const endDay = Number(row.endDay);
|
||||
if (!Number.isFinite(startDay) || startDay < 1 || startDay > 31) {
|
||||
this.$message.warning(`${prefix}请选择第${index + 1}行运单区间开始日`);
|
||||
return false;
|
||||
}
|
||||
if (!Number.isFinite(endDay) || endDay < 1 || endDay > 31) {
|
||||
this.$message.warning(`${prefix}请选择第${index + 1}行运单区间结束日`);
|
||||
return false;
|
||||
}
|
||||
if (endDay < startDay) {
|
||||
this.$message.warning(`${prefix}第${index + 1}行结束日不能早于开始日`);
|
||||
return false;
|
||||
}
|
||||
if (index > 0 && startDay !== Number(rows[index - 1].endDay) + 1) {
|
||||
this.$message.warning(`${prefix}自定义多周期区间必须连续，不允许重叠或存在日期缺口`);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
clearSettlementRuleError(field) {
|
||||
if (!this.settlementRuleErrors[field]) return;
|
||||
this.settlementRuleErrors = {
|
||||
@@ -7632,8 +7794,8 @@ export default {
|
||||
return false;
|
||||
}
|
||||
if (this.isMonthlySettlement(rule) && this.isBillingFieldEmpty(rule.billCycleType)) {
|
||||
this.settlementRuleErrors = { billCycleType: '请选择账单周期类型' };
|
||||
this.$message.warning(`${label}${label ? '：' : ''}请选择账单周期类型`);
|
||||
this.settlementRuleErrors = { billCycleType: '请选择结算周期' };
|
||||
this.$message.warning(`${label}${label ? '：' : ''}请选择结算周期`);
|
||||
return false;
|
||||
}
|
||||
if (this.isFixedBillCutoffSettlement(rule)) {
|
||||
@@ -7649,6 +7811,9 @@ export default {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if (this.isCustomMultiPeriodSettlement(rule)) {
|
||||
return this.validateCustomPeriods(rule.customPeriods, label);
|
||||
}
|
||||
if (this.isFixedCycleSettlement(rule)) {
|
||||
const cycleDays = Number(rule.cycleDays);
|
||||
if (!Number.isInteger(cycleDays) || cycleDays < 1 || cycleDays > 365) {
|
||||
@@ -11239,8 +11404,10 @@ export default {
|
||||
if (!this.canEditBillingLimit(row)) {
|
||||
continue;
|
||||
}
|
||||
const key = row.billingElement || '';
|
||||
groups[key] = groups[key] || [];
|
||||
const feeItem = String(row.feeItem || '').trim();
|
||||
const billingElement = String(row.billingElement || '').trim();
|
||||
const key = JSON.stringify([feeItem, billingElement]);
|
||||
groups[key] = groups[key] || { feeItem, billingElement, ranges: [] };
|
||||
const ranges = this.getBillingLimitRanges(row);
|
||||
for (const range of ranges) {
|
||||
const lower = Number(range.lowerLimit);
|
||||
@@ -11258,14 +11425,14 @@ export default {
|
||||
this.$message.warning('计费要素下限不能大于上限');
|
||||
return false;
|
||||
}
|
||||
groups[key].push({ lower, upper });
|
||||
groups[key].ranges.push({ lower, upper });
|
||||
}
|
||||
}
|
||||
return this.validateBillingLimitRangeGroups(groups);
|
||||
},
|
||||
validateBillingLimitRangeGroups(groups) {
|
||||
const precision = 0.000001;
|
||||
for (const [billingElement, ranges] of Object.entries(groups)) {
|
||||
for (const { feeItem, billingElement, ranges } of Object.values(groups)) {
|
||||
if (ranges.length <= 1) continue;
|
||||
const sortedRanges = [...ranges].sort((prev, next) => {
|
||||
if (prev.lower !== next.lower) return prev.lower - next.lower;
|
||||
@@ -11275,11 +11442,13 @@ export default {
|
||||
const prevRange = sortedRanges[index - 1];
|
||||
const currentRange = sortedRanges[index];
|
||||
if (currentRange.lower < prevRange.upper - precision) {
|
||||
this.$message.warning(`${billingElement}的计费要素区间不能重叠`);
|
||||
this.$message.warning(`费用项“${feeItem}”${billingElement}的计费要素区间不能重叠`);
|
||||
return false;
|
||||
}
|
||||
if (currentRange.lower > prevRange.upper + precision) {
|
||||
this.$message.warning(`${billingElement}的计费要素区间必须连续，不能存在间隙`);
|
||||
this.$message.warning(
|
||||
`费用项“${feeItem}”${billingElement}的计费要素区间必须连续，不能存在间隙`
|
||||
);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,596 @@
|
||||
<template>
|
||||
<section
|
||||
class="contract-manage-form__section contract-manage-form__section--panel contract-manage-form__section--attachment"
|
||||
>
|
||||
<div class="contract-manage-form__attachment-head">
|
||||
<div class="dialog-section-title">{{ title }}</div>
|
||||
<el-button type="primary" :disabled="!rows.length" @click="batchDownload">批量下载</el-button>
|
||||
</div>
|
||||
<el-table
|
||||
:data="rows"
|
||||
border
|
||||
class="contract-manage-form__attachment-table"
|
||||
@selection-change="selected = $event"
|
||||
>
|
||||
<el-table-column v-if="!readonly" type="selection" width="55" align="center" />
|
||||
<el-table-column type="index" label="序号" width="70" align="center" />
|
||||
<el-table-column v-if="attachmentType" label="附件类型" min-width="160" align="center">
|
||||
<template #default="{ row }">
|
||||
<span v-if="readonly || isRowLocked(row)">{{ row.fileType || '-' }}</span>
|
||||
<el-select
|
||||
v-else
|
||||
:model-value="row.fileType"
|
||||
placeholder="请选择"
|
||||
:teleported="false"
|
||||
:fit-input-width="true"
|
||||
@update:model-value="value => updateRowFileType(row, value)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in contractAttachmentTypeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="文件名"
|
||||
min-width="240"
|
||||
align="left"
|
||||
header-align="left"
|
||||
show-overflow-tooltip
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<el-link type="primary" @click="preview?.(row, rows)">{{ attachmentName(row) }}</el-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="description" label="附件描述" min-width="220">
|
||||
<template #default="{ row }">
|
||||
<span v-if="readonly || isRowLocked(row)">{{ row.description || '-' }}</span>
|
||||
<el-input
|
||||
v-else
|
||||
:model-value="row.description"
|
||||
maxlength="200"
|
||||
@update:model-value="value => updateRowDescription(row, value)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="文件大小" width="120" align="center">
|
||||
<template #default="{ row }">{{ formatSize(row.size) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="uploadUserName" label="上传人" width="140" align="center" />
|
||||
<el-table-column prop="uploadTime" label="上传时间" width="180" align="center" sortable />
|
||||
<el-table-column v-if="!readonly" label="操作" width="100" align="center" fixed="right">
|
||||
<template #default="{ row, $index }">
|
||||
<span v-if="isRowLocked(row)">-</span>
|
||||
<el-link v-else type="danger" @click="remove($index)">删除</el-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<div v-if="!readonly" class="contract-manage-form__attachment-upload">
|
||||
<template v-if="useUploadDialog">
|
||||
<el-button type="primary" plain @click="openUploadDialog">上传附件</el-button>
|
||||
<span class="contract-manage-form__attachment-tip">
|
||||
支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过50M
|
||||
</span>
|
||||
</template>
|
||||
<vehicle-attachment-upload
|
||||
v-else
|
||||
:model-value="rows"
|
||||
:file-types="attachmentFileTypes"
|
||||
:max-size="50"
|
||||
show-tip
|
||||
tip="支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过50M"
|
||||
:show-file-list="false"
|
||||
button-text="上传附件"
|
||||
@update:model-value="handleChange"
|
||||
@change="handleChange"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<el-dialog
|
||||
v-model="uploadDialogVisible"
|
||||
title="附件上传"
|
||||
width="560px"
|
||||
append-to-body
|
||||
destroy-on-close
|
||||
:close-on-click-modal="false"
|
||||
class="contract-attachment-upload-dialog"
|
||||
@closed="resetUploadDialog"
|
||||
>
|
||||
<div class="contract-attachment-upload-dialog__body">
|
||||
<div class="contract-attachment-upload-dialog__field">
|
||||
<span class="contract-attachment-upload-dialog__label">附件位置</span>
|
||||
<el-select :model-value="attachmentLocation" disabled style="width: 100%">
|
||||
<el-option :label="attachmentLocation" :value="attachmentLocation" />
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="contract-attachment-upload-dialog__field">
|
||||
<span class="contract-attachment-upload-dialog__label">附件类型</span>
|
||||
<el-select v-model="uploadDialogType" placeholder="请选择附件类型" style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in contractAttachmentTypeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="contract-attachment-upload-dialog__uploader">
|
||||
<el-upload
|
||||
drag
|
||||
multiple
|
||||
:action="uploadAction"
|
||||
:headers="uploadHeaders"
|
||||
:accept="acceptText"
|
||||
:show-file-list="true"
|
||||
:before-upload="beforeUpload"
|
||||
:on-success="handleDialogSuccess"
|
||||
:on-error="handleDialogError"
|
||||
:on-remove="handleDialogRemove"
|
||||
:file-list="uploadDialogFileList"
|
||||
>
|
||||
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
||||
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||||
</el-upload>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="contract-attachment-upload-dialog__footer">
|
||||
<el-button type="primary" @click="confirmUploadDialog">确定</el-button>
|
||||
<el-button type="primary" @click="uploadDialogVisible = false">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { UploadFilled } from '@element-plus/icons-vue';
|
||||
import { baseUrl } from '@/config/env';
|
||||
import { getUploadHeaders } from '@/utils/upload';
|
||||
import { downloadFileByUrl } from '@/utils/util';
|
||||
import { getDictionary as getBizDictionary } from '@/api/system/dictbiz';
|
||||
|
||||
const CONTRACT_ATTACHMENT_TYPE_OTHER = '其它文件';
|
||||
export const defaultContractAttachmentTypeOptions = [
|
||||
{ label: '合同文件', value: '合同文件' },
|
||||
{ label: '双章归档文件', value: '双章归档文件' },
|
||||
{ label: '其它文件', value: CONTRACT_ATTACHMENT_TYPE_OTHER },
|
||||
];
|
||||
/** @deprecated 兼容旧引用，实际选项由业务字典 contract_attachment_type 动态加载 */
|
||||
export const contractAttachmentTypeOptions = defaultContractAttachmentTypeOptions;
|
||||
export const attachmentFileTypes = [
|
||||
'pdf',
|
||||
'bmp',
|
||||
'jpeg',
|
||||
'png',
|
||||
'jpg',
|
||||
'doc',
|
||||
'docx',
|
||||
'ppt',
|
||||
'pptx',
|
||||
'xlsx',
|
||||
'xls',
|
||||
'eml',
|
||||
'msg',
|
||||
'zip',
|
||||
];
|
||||
|
||||
export const attachmentName = row => row?.originalName || row?.name || row?.fileName || '附件';
|
||||
export const attachmentUrl = row =>
|
||||
row?.url || row?.link || row?.fileUrl || row?.downloadUrl || row?.domain || '';
|
||||
export const isAttachmentApproved = row =>
|
||||
row?.approved === true ||
|
||||
row?.approved === 1 ||
|
||||
row?.approved === '1' ||
|
||||
row?.approvalStatus === 'approved';
|
||||
|
||||
const normalizeAttachmentTypeText = value => {
|
||||
let text = String(value || '').split(/[?#]/)[0];
|
||||
try {
|
||||
text = decodeURIComponent(text);
|
||||
} catch (error) {
|
||||
// ignore decode error
|
||||
}
|
||||
return text
|
||||
.replace(/\.[^.\\/]+$/, '')
|
||||
.toLowerCase()
|
||||
.replace(/[\s_\-—–·•()（）\[\]【】{}《》<>“”"'、，,。.]/g, '');
|
||||
};
|
||||
|
||||
const attachmentTypeKeywords = fileType => {
|
||||
if (fileType === '双章归档文件') return ['双章归档文件', '双章归档', '双章'];
|
||||
if (fileType === '合同文件') return ['合同文件', '合同'];
|
||||
return [fileType];
|
||||
};
|
||||
|
||||
const resolveOtherAttachmentType = (options = []) => {
|
||||
const list = options.length ? options : defaultContractAttachmentTypeOptions;
|
||||
const matched = list.find(
|
||||
item =>
|
||||
String(item.value) === CONTRACT_ATTACHMENT_TYPE_OTHER ||
|
||||
String(item.label).includes('其它') ||
|
||||
String(item.label).includes('其他')
|
||||
);
|
||||
return matched?.value || list[list.length - 1]?.value || CONTRACT_ATTACHMENT_TYPE_OTHER;
|
||||
};
|
||||
|
||||
export const resolveContractAttachmentType = (
|
||||
row = {},
|
||||
options = defaultContractAttachmentTypeOptions
|
||||
) => {
|
||||
const list = options.length ? options : defaultContractAttachmentTypeOptions;
|
||||
const values = list.map(item => item.value);
|
||||
if (values.includes(row.fileType)) return row.fileType;
|
||||
const fileName = normalizeAttachmentTypeText(attachmentName(row));
|
||||
const otherType = resolveOtherAttachmentType(list);
|
||||
if (!fileName) return otherType;
|
||||
const matched = list
|
||||
.filter(item => item.value !== otherType)
|
||||
.flatMap(item =>
|
||||
attachmentTypeKeywords(item.value).map(keyword => ({
|
||||
value: item.value,
|
||||
keyword: normalizeAttachmentTypeText(keyword),
|
||||
}))
|
||||
)
|
||||
.filter(item => item.keyword)
|
||||
.sort((a, b) => b.keyword.length - a.keyword.length)
|
||||
.find(item => fileName.includes(item.keyword));
|
||||
return matched?.value || otherType;
|
||||
};
|
||||
|
||||
export const normalizeContractFileRows = (rows, options = defaultContractAttachmentTypeOptions) =>
|
||||
(rows || []).map(row => ({
|
||||
...row,
|
||||
fileType: resolveContractAttachmentType(row, options),
|
||||
description: row.description || '',
|
||||
}));
|
||||
|
||||
const mapDictOptions = response => {
|
||||
const data = response?.data?.data || response?.data || [];
|
||||
const records = Array.isArray(data) ? data : data.records || [];
|
||||
return records
|
||||
.map(item => ({
|
||||
label: item.dictValue,
|
||||
value: item.dictKey,
|
||||
}))
|
||||
.filter(item => item.label && item.value);
|
||||
};
|
||||
|
||||
export default {
|
||||
name: 'ContractAttachmentSection',
|
||||
components: { UploadFilled },
|
||||
props: {
|
||||
title: { type: String, required: true },
|
||||
rows: { type: Array, default: () => [] },
|
||||
description: Boolean,
|
||||
attachmentType: Boolean,
|
||||
readonly: Boolean,
|
||||
lockApproved: Boolean,
|
||||
markApprovedOnUpload: Boolean,
|
||||
useUploadDialog: Boolean,
|
||||
attachmentLocation: { type: String, default: '合同文件' },
|
||||
preview: { type: Function, default: null },
|
||||
},
|
||||
emits: ['update:rows'],
|
||||
data() {
|
||||
return {
|
||||
selected: [],
|
||||
attachmentFileTypes,
|
||||
contractAttachmentTypeOptions: [...defaultContractAttachmentTypeOptions],
|
||||
uploadDialogVisible: false,
|
||||
uploadDialogType: resolveOtherAttachmentType(defaultContractAttachmentTypeOptions),
|
||||
uploadDialogFiles: [],
|
||||
uploadDialogFileList: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
uploadAction() {
|
||||
return `${baseUrl}/blade-resource/oss/endpoint/put-file`;
|
||||
},
|
||||
uploadHeaders() {
|
||||
return getUploadHeaders();
|
||||
},
|
||||
acceptText() {
|
||||
return this.attachmentFileTypes.map(item => `.${item}`).join(',');
|
||||
},
|
||||
defaultAttachmentType() {
|
||||
return resolveOtherAttachmentType(this.contractAttachmentTypeOptions);
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.loadAttachmentTypeOptions();
|
||||
},
|
||||
methods: {
|
||||
attachmentName,
|
||||
loadAttachmentTypeOptions() {
|
||||
return getBizDictionary({ code: 'contract_attachment_type' })
|
||||
.then(res => {
|
||||
const options = mapDictOptions(res);
|
||||
if (options.length) {
|
||||
this.contractAttachmentTypeOptions = options;
|
||||
if (
|
||||
!options.some(item => String(item.value) === String(this.uploadDialogType))
|
||||
) {
|
||||
this.uploadDialogType = this.defaultAttachmentType;
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
// 字典加载失败时保留默认选项
|
||||
});
|
||||
},
|
||||
isRowLocked(row) {
|
||||
return this.lockApproved && isAttachmentApproved(row);
|
||||
},
|
||||
update(rows) {
|
||||
this.$emit('update:rows', rows);
|
||||
},
|
||||
updateRowFileType(row, value) {
|
||||
if (this.isRowLocked(row)) return;
|
||||
row.fileType = value;
|
||||
this.update([...this.rows]);
|
||||
},
|
||||
updateRowDescription(row, value) {
|
||||
if (this.isRowLocked(row)) return;
|
||||
row.description = value;
|
||||
this.update([...this.rows]);
|
||||
},
|
||||
openUploadDialog() {
|
||||
this.uploadDialogType = this.defaultAttachmentType;
|
||||
this.uploadDialogFiles = [];
|
||||
this.uploadDialogFileList = [];
|
||||
this.uploadDialogVisible = true;
|
||||
},
|
||||
resetUploadDialog() {
|
||||
this.uploadDialogFiles = [];
|
||||
this.uploadDialogFileList = [];
|
||||
this.uploadDialogType = this.defaultAttachmentType;
|
||||
},
|
||||
beforeUpload(file) {
|
||||
const extension = String(file.name || '')
|
||||
.split('.')
|
||||
.pop()
|
||||
?.toLowerCase();
|
||||
if (!this.attachmentFileTypes.includes(extension)) {
|
||||
this.$message.warning('文件类型不符合上传要求');
|
||||
return false;
|
||||
}
|
||||
if (file.size / 1024 / 1024 > 50) {
|
||||
this.$message.warning('单文件大小不能超过 50MB');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
normalizeUploadFile(file, response) {
|
||||
const data = response?.data || file.response?.data || {};
|
||||
const url = data.link || data.url || data.domain || file.url || '';
|
||||
const originalName =
|
||||
data.originalName || file.name || data.name || attachmentName({ url }) || '附件';
|
||||
return {
|
||||
uid: file.uid,
|
||||
originalName,
|
||||
name: originalName,
|
||||
url,
|
||||
link: data.link || url,
|
||||
size: data.size || data.attachSize || file.size || '',
|
||||
};
|
||||
},
|
||||
handleDialogSuccess(response, file, fileList) {
|
||||
if (!response || response.success === false || (response.code && response.code !== 200)) {
|
||||
this.$message.error(response?.msg || '上传失败');
|
||||
this.uploadDialogFileList = (fileList || []).filter(item => item.uid !== file.uid);
|
||||
return;
|
||||
}
|
||||
const normalized = this.normalizeUploadFile(file, response);
|
||||
this.uploadDialogFileList = fileList || [];
|
||||
this.uploadDialogFiles = [
|
||||
...this.uploadDialogFiles.filter(item => String(item.uid) !== String(file.uid)),
|
||||
normalized,
|
||||
];
|
||||
this.uploadDialogType = resolveContractAttachmentType(
|
||||
{
|
||||
...normalized,
|
||||
fileType: '',
|
||||
},
|
||||
this.contractAttachmentTypeOptions
|
||||
);
|
||||
this.$message.success('上传成功');
|
||||
},
|
||||
handleDialogError() {
|
||||
this.$message.error('上传失败');
|
||||
},
|
||||
handleDialogRemove(file) {
|
||||
this.uploadDialogFiles = this.uploadDialogFiles.filter(
|
||||
item => String(item.uid) !== String(file.uid)
|
||||
);
|
||||
this.uploadDialogFileList = this.uploadDialogFileList.filter(
|
||||
item => String(item.uid) !== String(file.uid)
|
||||
);
|
||||
},
|
||||
confirmUploadDialog() {
|
||||
if (!this.uploadDialogFiles.length) {
|
||||
this.$message.warning('请先上传附件');
|
||||
return;
|
||||
}
|
||||
if (!this.uploadDialogType) {
|
||||
this.$message.warning('请选择附件类型');
|
||||
return;
|
||||
}
|
||||
const uploadUserName = this.$store.getters.userInfo?.realName || '';
|
||||
const uploadTime = this.$dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
const appended = this.uploadDialogFiles.map(row => ({
|
||||
...row,
|
||||
fileType: this.uploadDialogType,
|
||||
description: row.description || '',
|
||||
uploadUserName: row.uploadUserName || uploadUserName,
|
||||
uploadTime: row.uploadTime || uploadTime,
|
||||
...(this.markApprovedOnUpload ? { approved: true } : {}),
|
||||
}));
|
||||
this.update([...(this.rows || []), ...appended]);
|
||||
this.uploadDialogVisible = false;
|
||||
},
|
||||
handleChange(rows) {
|
||||
const uploadUserName = this.$store.getters.userInfo?.realName || '';
|
||||
const uploadTime = this.$dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
const existingRows = this.rows || [];
|
||||
this.update(
|
||||
(rows || []).map(row => {
|
||||
const fileUrl = attachmentUrl(row);
|
||||
const existing = existingRows.find(item => {
|
||||
const sameUid = row.uid && item.uid && String(row.uid) === String(item.uid);
|
||||
const sameUrl = fileUrl && attachmentUrl(item) === fileUrl;
|
||||
return sameUid || sameUrl;
|
||||
});
|
||||
if (existing && this.isRowLocked(existing)) return { ...existing };
|
||||
const next = {
|
||||
...existing,
|
||||
...row,
|
||||
description: row.description || existing?.description || '',
|
||||
uploadUserName: existing?.uploadUserName || row.uploadUserName || uploadUserName,
|
||||
uploadTime: existing?.uploadTime || row.uploadTime || uploadTime,
|
||||
approved: existing?.approved || row.approved || false,
|
||||
};
|
||||
if (this.attachmentType) {
|
||||
next.fileType = resolveContractAttachmentType(
|
||||
{
|
||||
...next,
|
||||
fileType: existing?.fileType || row.fileType,
|
||||
},
|
||||
this.contractAttachmentTypeOptions
|
||||
);
|
||||
}
|
||||
if (this.markApprovedOnUpload && !existing) next.approved = true;
|
||||
return next;
|
||||
})
|
||||
);
|
||||
},
|
||||
remove(index) {
|
||||
const row = this.rows[index];
|
||||
if (this.isRowLocked(row)) {
|
||||
this.$message.warning('已审核通过的附件不允许删除');
|
||||
return;
|
||||
}
|
||||
const rows = [...this.rows];
|
||||
rows.splice(index, 1);
|
||||
this.update(rows);
|
||||
},
|
||||
download(row) {
|
||||
const url = attachmentUrl(row);
|
||||
if (!url) {
|
||||
this.$message.warning('附件地址为空，无法下载');
|
||||
return;
|
||||
}
|
||||
downloadFileByUrl(url, attachmentName(row));
|
||||
},
|
||||
batchDownload() {
|
||||
(this.selected.length ? this.selected : this.rows).forEach(this.download);
|
||||
},
|
||||
formatSize(size) {
|
||||
const value = Number(size);
|
||||
if (!value) return '';
|
||||
if (value < 1024) return `${value}B`;
|
||||
if (value < 1024 * 1024) return `${(value / 1024).toFixed(1)}KB`;
|
||||
return `${(value / 1024 / 1024).toFixed(1)}MB`;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.contract-manage-form__section {
|
||||
margin: 12px 0 0;
|
||||
padding: 14px 16px 16px;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
||||
|
||||
.dialog-section-title {
|
||||
margin-bottom: 20px;
|
||||
color: #303133;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
|
||||
&::before {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
margin-right: 8px;
|
||||
vertical-align: -2px;
|
||||
background: #409eff;
|
||||
content: '';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.contract-manage-form__attachment-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.dialog-section-title {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.contract-manage-form__attachment-upload {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.contract-manage-form__attachment-tip {
|
||||
margin-left: 30px;
|
||||
color: #909399;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.contract-attachment-upload-dialog {
|
||||
&__body {
|
||||
padding: 4px 8px 0;
|
||||
}
|
||||
|
||||
&__field {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
&__label {
|
||||
flex: none;
|
||||
width: 72px;
|
||||
color: #606266;
|
||||
text-align: right;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
&__uploader {
|
||||
margin-top: 8px;
|
||||
|
||||
:deep(.el-upload) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
:deep(.el-upload-dragger) {
|
||||
width: 100%;
|
||||
height: 180px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
&__footer {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,8 +1,51 @@
|
||||
<template>
|
||||
<div v-loading="loading" class="master-detail">
|
||||
<section v-if="master" class="detail-overview">
|
||||
<div class="detail-heading"><div><h2>多联总单详情 <span>|</span> {{ master.masterNo }}</h2><el-tag :type="statusType(master.businessStatus)" class="status-text">{{ statusName(master.businessStatus) }}</el-tag><el-tag v-if="transportFlowLabel" type="info" class="transport-flow-tag">{{ transportFlowLabel }}</el-tag></div><el-button @click="$emit('back')">取消</el-button></div>
|
||||
<dl class="detail-meta"><div><dt>客户</dt><dd>{{ master.customerName || '-' }}</dd></div><div><dt>合同编号</dt><dd>{{ master.contractNo || '-' }}</dd></div><div><dt>项目</dt><dd>{{ master.projectName || '-' }}</dd></div><div class="detail-meta__attachments"><dt>附件</dt><dd><template v-if="attachments.length"><el-link v-for="file in attachments" :key="file.url || file.link || file.name || file.originalName" type="primary" @click="previewAttachment(file)">{{ attachmentName(file) }}</el-link></template><span v-else>-</span></dd></div></dl>
|
||||
<div class="detail-heading"><div><h2>多联总单详情 <span>|</span> {{ master.masterNo }}</h2><el-tag :type="statusType(master.businessStatus)" class="status-text">{{ statusName(master.businessStatus) }}</el-tag><el-tag v-if="transportFlowLabel" type="info" class="transport-flow-tag">{{ transportFlowLabel }}</el-tag></div></div>
|
||||
<dl class="detail-meta">
|
||||
<div>
|
||||
<dt>客户</dt>
|
||||
<dd>
|
||||
<el-link v-if="master.customerName" type="primary" @click="openCustomer">{{
|
||||
master.customerName
|
||||
}}</el-link>
|
||||
<span v-else>-</span>
|
||||
</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>合同编号</dt>
|
||||
<dd>
|
||||
<el-link v-if="master.contractNo && master.contractId" type="primary" @click="openContract">{{
|
||||
master.contractNo
|
||||
}}</el-link>
|
||||
<span v-else>{{ master.contractNo || '-' }}</span>
|
||||
</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>项目</dt>
|
||||
<dd>
|
||||
<el-link v-if="master.projectName && master.projectId" type="primary" @click="openProject">{{
|
||||
master.projectName
|
||||
}}</el-link>
|
||||
<span v-else>{{ master.projectName || '-' }}</span>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="detail-meta__attachments">
|
||||
<dt>附件</dt>
|
||||
<dd>
|
||||
<template v-if="attachments.length">
|
||||
<el-link
|
||||
v-for="file in attachments"
|
||||
:key="file.url || file.link || file.name || file.originalName"
|
||||
type="primary"
|
||||
@click="previewAttachment(file)"
|
||||
>{{ attachmentName(file) }}</el-link
|
||||
>
|
||||
</template>
|
||||
<span v-else>-</span>
|
||||
</dd>
|
||||
</div>
|
||||
</dl>
|
||||
<div class="route-map"><template v-for="(route, index) in segments" :key="route.segmentNo"><div class="route-map__node"><span :class="['route-badge', index ? 'middle' : 'start']">{{ index ? '经' : '起' }}</span><strong>{{ segmentLocationName(route, 'departure') }}</strong><small>{{ route.departureAddress || '-' }}</small><small class="route-map__progress">{{ index ? `已到达 ${quantity(segments[index - 1].arrivedQuantity)}/${quantity(master.totalQuantity)} ${plannedUnit(segments[index - 1])}` : `已调度 ${quantity(route.dispatchedQuantity)}/${quantity(master.totalQuantity)} ${plannedUnit(route)}` }}</small><small v-if="index" class="route-map__progress">已调度 {{ quantity(route.dispatchedQuantity) }}/{{ quantity(master.totalQuantity) }} {{ plannedUnit(route) }}</small></div><div class="route-map__line"></div><div v-if="index === segments.length - 1" class="route-map__node"><span class="route-badge end">终</span><strong>{{ segmentLocationName(route, 'arrival') }}</strong><small>{{ route.arrivalAddress || '-' }}</small><small class="route-map__progress">已到达 {{ quantity(route.arrivedQuantity) }}/{{ quantity(master.totalQuantity) }} {{ plannedUnit(route) }}</small></div></template></div>
|
||||
</section>
|
||||
|
||||
@@ -42,6 +85,8 @@
|
||||
|
||||
<script>
|
||||
import * as api from '@/api/business/master-order';
|
||||
import { getDetail as getProjectDetail } from '@/api/business/project-apply';
|
||||
import { getList as getCustomerArchiveList } from '@/api/vehicle/customer-archive';
|
||||
import { CaretBottom, CaretTop } from '@element-plus/icons-vue';
|
||||
import { ElImageViewer } from 'element-plus';
|
||||
import { OpenFileViewer } from '@open-file-viewer/vue';
|
||||
@@ -51,10 +96,26 @@ import pdfWorkerSrc from 'pdfjs-dist/build/pdf.worker.mjs?url';
|
||||
|
||||
const viewerPlugins = [imagePlugin(), pdfPlugin({ workerSrc: pdfWorkerSrc, useFetchData: true }), officePlugin({ pdf: { workerSrc: pdfWorkerSrc, useFetchData: true } }), textPlugin(), fallbackPlugin()];
|
||||
|
||||
const parseJsonArray = value => {
|
||||
if (Array.isArray(value)) return value;
|
||||
if (!value) return [];
|
||||
try {
|
||||
const parsed = JSON.parse(value);
|
||||
if (Array.isArray(parsed)) return parsed;
|
||||
return parsed && typeof parsed === 'object' ? [parsed] : [];
|
||||
} catch (error) {
|
||||
return [];
|
||||
}
|
||||
};
|
||||
|
||||
const customerRowLabel = (row = {}) =>
|
||||
row.customer || row.fullName || row.shortName || row.customerName || row.customerCode || '';
|
||||
|
||||
const customerRowId = (row = {}) => row.id || row.customerId || '';
|
||||
|
||||
export default {
|
||||
components: { ElImageViewer, OpenFileViewer },
|
||||
props: { id: [String, Number] },
|
||||
emits: ['back'],
|
||||
data() { return { loading: false, master: null, expandedSegments: {}, CaretBottom, CaretTop, imagePreviewVisible: false, imagePreviewUrls: [], imagePreviewIndex: 0, documentPreviewVisible: false, previewFile: {}, viewerPlugins, viewerToolbar: { download: true, fullscreen: true, print: true, rotate: true, zoom: true } }; },
|
||||
computed: {
|
||||
segments() {
|
||||
@@ -148,6 +209,68 @@ export default {
|
||||
this.$router.push({ path: '/business/waybill-manage/detail', query: { id: row.id } });
|
||||
},
|
||||
openPlan(row) { this.$router.push({ path: '/business/transport-plan', query: { detailId: row.id } }); },
|
||||
openContract() {
|
||||
if (!this.master?.contractId) {
|
||||
this.$message.warning('合同信息缺失，无法打开');
|
||||
return;
|
||||
}
|
||||
this.$router.push({
|
||||
path: '/business/contract-manage/detail',
|
||||
query: { id: this.master.contractId, name: '合同详情' },
|
||||
});
|
||||
},
|
||||
openProject() {
|
||||
if (!this.master?.projectId) {
|
||||
this.$message.warning('项目信息缺失，无法打开');
|
||||
return;
|
||||
}
|
||||
this.$router.push({
|
||||
path: '/business/project-apply/form',
|
||||
query: { mode: 'view', id: this.master.projectId, name: '查看项目管理' },
|
||||
});
|
||||
},
|
||||
async resolveCustomerId() {
|
||||
if (this.master?.customerId) return this.master.customerId;
|
||||
const name = String(this.master?.customerName || '').trim();
|
||||
if (!name) return '';
|
||||
if (this.master?.projectId) {
|
||||
try {
|
||||
const res = await getProjectDetail(this.master.projectId);
|
||||
const rows = parseJsonArray(res.data?.data?.customerJson);
|
||||
const matched =
|
||||
rows.find(row => customerRowLabel(row) === name) ||
|
||||
rows.find(row => {
|
||||
const label = customerRowLabel(row);
|
||||
return label && (name.includes(label) || label.includes(name));
|
||||
});
|
||||
const id = customerRowId(matched);
|
||||
if (id) return id;
|
||||
} catch (error) {
|
||||
// 项目客户解析失败时回退到客商档案检索
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getCustomerArchiveList(1, 20, { fullName: name });
|
||||
const records = res.data?.data?.records || [];
|
||||
const exact =
|
||||
records.find(item => item.fullName === name || item.shortName === name) || records[0];
|
||||
return exact?.id || '';
|
||||
} catch (error) {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
async openCustomer() {
|
||||
if (!this.master?.customerName) return;
|
||||
const customerId = await this.resolveCustomerId();
|
||||
if (!customerId) {
|
||||
this.$message.warning('未找到对应客商档案，无法打开');
|
||||
return;
|
||||
}
|
||||
this.$router.push({
|
||||
path: '/vehicle/customer-archive/form',
|
||||
query: { id: String(customerId), name: '查看客商档案', view: '1' },
|
||||
});
|
||||
},
|
||||
waybillStatusName(value) { return ({ pending: '待执行', waiting: '待执行', running: '进行中', processing: '进行中', completed: '已完成', cancelled: '已取消' })[value] || value || '-'; },
|
||||
waybillStatusType(value) { return ({ pending: 'info', waiting: 'info', running: 'warning', processing: 'warning', completed: 'success', cancelled: 'danger' })[value] || 'info'; },
|
||||
statusName(value) { return ({ waiting_dispatch: '待调度', dispatching: '调度中', completed: '调度完成', closed: '调度关闭' })[value] || value || '-'; },
|
||||
@@ -161,7 +284,7 @@ export default {
|
||||
.detail-overview, .execution-detail-card { margin-bottom: 8px; border: 1px solid #eff1f7; background: #fff; }
|
||||
.detail-heading { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; h2 { display: inline-block; margin: 0 16px 0 0; font-size: 20px; } h2 span { margin: 0 8px; color: #909399; font-weight: 400; } }
|
||||
.transport-flow-tag { margin-left: 8px; }
|
||||
.detail-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 24px; margin: 0; padding: 0 24px 20px; dt { margin-bottom: 6px; color: #909399; font-size: 13px; } dd { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; color: #409eff; font-size: 14px; word-break: break-all; } }
|
||||
.detail-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 24px; margin: 0; padding: 0 24px 20px; dt { margin-bottom: 6px; color: #909399; font-size: 13px; } dd { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; color: #303133; font-size: 14px; word-break: break-all; } :deep(.el-link) { font-size: 14px; } }
|
||||
.route-map { display: flex; align-items: flex-start; padding: 16px 24px 20px; border-top: 1px solid #eff1f7; overflow-x: auto; }
|
||||
.route-map__node { display: grid; flex: 0 0 150px; justify-items: center; gap: 6px; text-align: center; strong { font-size: 16px; white-space: nowrap; } small { color: #606266; white-space: nowrap; } }
|
||||
.route-map__progress { color: #303133 !important; }
|
||||
|
||||
@@ -95,10 +95,51 @@
|
||||
<div class="goods-heading"><h3>货物信息</h3><div><el-link type="primary" @click="addGoods(route)">新增货物</el-link></div></div>
|
||||
<el-table :data="route.goods" border class="goods-table">
|
||||
<el-table-column type="index" label="序号" width="64" />
|
||||
<el-table-column min-width="180"><template #header><span>货物类型<span class="goods-required-mark">*</span></span></template><template #default="{ row }"><el-cascader v-model="row.cargoTypePath" class="goods-table__cargo-type" :options="cargoTypeOptions" :props="cargoTypeCascaderProps" placeholder="请选择货物类型" clearable filterable @change="value => handleCargoTypeChange(route, row, value)" /></template></el-table-column>
|
||||
<el-table-column min-width="180"><template #header><span>货物名称<span class="goods-required-mark">*</span></span></template><template #default="{ row }"><el-select v-model="row.sourceIndex" class="goods-table__cargo-name" placeholder="请选择总单货物" @change="selectGoods(route, row)"><el-option v-for="item in masterGoodsByCargoType(row)" :key="item.sourceIndex" :label="item.cargoName" :value="item.sourceIndex" /></el-select></template></el-table-column>
|
||||
<el-table-column prop="remainingQuantity" column-key="remainingQuantity" label="剩余数量" width="150" class-name="goods-table__remaining"><template #default="{ row }">{{ formatQuantity(goodsRemainingQuantity(route, row)) }}</template></el-table-column>
|
||||
<el-table-column prop="dispatchQuantity" column-key="dispatchQuantity" width="200" class-name="goods-table__dispatch"><template #header><span>本次数量<span class="goods-required-mark">*</span></span></template><template #default="{ row }"><el-input :model-value="row.dispatchQuantity" inputmode="decimal" placeholder="请输入" @input="value => handleDispatchQuantityInput(route, row, value)" /></template></el-table-column>
|
||||
<el-table-column min-width="180"
|
||||
><template #header
|
||||
><span>货物类型<span class="goods-required-mark">*</span></span></template
|
||||
><template #default="{ row }"
|
||||
><el-autocomplete
|
||||
v-model="row.cargoType"
|
||||
class="goods-table__cargo-type"
|
||||
clearable
|
||||
:debounce="300"
|
||||
placeholder="请输入货物类型"
|
||||
:fetch-suggestions="fetchCargoTypeSuggestions"
|
||||
@select="item => handleCargoTypeSelect(route, row, item)"
|
||||
@change="value => handleCargoTypeChange(route, row, value)"
|
||||
/></template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="180"
|
||||
><template #header
|
||||
><span>货物名称<span class="goods-required-mark">*</span></span></template
|
||||
><template #default="{ row }"
|
||||
><el-select
|
||||
v-model="row.sourceIndex"
|
||||
class="goods-table__cargo-name"
|
||||
placeholder="请选择总单货物"
|
||||
@change="selectGoods(route, row)"
|
||||
><el-option
|
||||
v-for="item in masterGoodsByCargoType(row)"
|
||||
:key="item.sourceIndex"
|
||||
:label="item.cargoName"
|
||||
:value="item.sourceIndex" /></el-select
|
||||
></template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="dispatchQuantity"
|
||||
column-key="dispatchQuantity"
|
||||
width="200"
|
||||
class-name="goods-table__dispatch"
|
||||
><template #header
|
||||
><span>本次数量<span class="goods-required-mark">*</span></span></template
|
||||
><template #default="{ row }"
|
||||
><el-input
|
||||
:model-value="row.dispatchQuantity"
|
||||
inputmode="decimal"
|
||||
placeholder="请输入"
|
||||
@input="value => handleDispatchQuantityInput(route, row, value)" /></template
|
||||
></el-table-column>
|
||||
<el-table-column prop="quantityUnit" width="110"><template #header><span>数量单位<span class="goods-required-mark">*</span></span></template></el-table-column>
|
||||
<el-table-column prop="packageType" label="包装" min-width="110" />
|
||||
<el-table-column prop="brand" label="品牌" min-width="110" />
|
||||
@@ -208,7 +249,7 @@ export default {
|
||||
props: { id: [String, Number] },
|
||||
emits: ['back'],
|
||||
data() {
|
||||
return { loading: false, submitting: false, master: null, routes: [], pending: [], pendingExpanded: false, editingId: null, driverInputs: {}, carrierOptions: [], driverOptions: [], carrierLoading: false, driverLoading: false, escortLoading: false, cargoTypeOptions: [], cargoTypeCascaderProps: { label: 'cargoName', value: 'id', children: 'children', emitPath: true }, quantityUnitOptions: ['吨', '千克', '立方米', '件', '车', '箱', '托盘'] };
|
||||
return { loading: false, submitting: false, master: null, routes: [], pending: [], pendingExpanded: false, editingId: null, driverInputs: {}, carrierOptions: [], driverOptions: [], carrierLoading: false, driverLoading: false, escortLoading: false, quantityUnitOptions: ['吨', '千克', '立方米', '件', '车', '箱', '托盘'] };
|
||||
},
|
||||
computed: {
|
||||
totalQuantity() { return (this.master?.goods || []).reduce((sum, item) => sum + Number(item.quantity || 0), 0); },
|
||||
@@ -216,6 +257,9 @@ export default {
|
||||
goodsNames() { return (this.master?.goods || []).map(item => item.cargoName).filter(Boolean).join('、') || '-'; },
|
||||
goodsTypes() { return [...new Set((this.master?.goods || []).map(item => item.cargoType).filter(Boolean))].join('、') || '-'; },
|
||||
masterGoods() { return (this.master?.goods || []).map((item, sourceIndex) => ({ ...item, sourceIndex, label: [item.cargoName, item.cargoType].filter(Boolean).join(' / ') })); },
|
||||
cargoTypeSelectOptions() {
|
||||
return [...new Set((this.master?.goods || []).map(item => item.cargoType).filter(Boolean))];
|
||||
},
|
||||
dateRange() { return this.master?.planStartTime && this.master?.planEndTime ? `${String(this.master.planStartTime).slice(0, 10)} ~ ${String(this.master.planEndTime).slice(0, 10)}` : '-'; },
|
||||
pendingGroups() {
|
||||
return this.pending.reduce((groups, item, index) => {
|
||||
@@ -256,7 +300,6 @@ export default {
|
||||
const res = await api.getDetail(this.id);
|
||||
this.master = res.data?.data || res.data || res;
|
||||
await this.loadContractCurrency();
|
||||
this.cargoTypeOptions = this.buildMasterCargoTypeOptions(this.master.goods || []);
|
||||
this.routes = this.dispatchRouteNodes().map((node, index) => this.createRoute(node, index));
|
||||
} finally { this.loading = false; }
|
||||
},
|
||||
@@ -318,46 +361,42 @@ export default {
|
||||
this.syncFreightItems(route);
|
||||
return route;
|
||||
},
|
||||
buildMasterCargoTypeOptions(goods = []) {
|
||||
return [...new Set(goods.map(item => item.cargoType).filter(Boolean))].map(cargoType => ({
|
||||
id: cargoType,
|
||||
cargoName: cargoType,
|
||||
}));
|
||||
},
|
||||
masterGoodsByCargoType(row = {}) {
|
||||
return this.masterGoods.filter(item => !row.cargoType || item.cargoType === row.cargoType);
|
||||
const cargoType = String(row.cargoType || '').trim();
|
||||
if (!cargoType) return this.masterGoods;
|
||||
const matched = this.masterGoods.filter(item => item.cargoType === cargoType);
|
||||
return matched.length ? matched : this.masterGoods;
|
||||
},
|
||||
findCargoTypeByPath(path = []) {
|
||||
let options = this.cargoTypeOptions;
|
||||
let selected;
|
||||
(path || []).forEach(id => {
|
||||
selected = (options || []).find(item => String(item.id) === String(id));
|
||||
options = selected?.children || [];
|
||||
});
|
||||
return selected;
|
||||
fetchCargoTypeSuggestions(queryString, callback) {
|
||||
const keyword = String(queryString || '').trim().toLowerCase();
|
||||
const options = this.cargoTypeSelectOptions.map(item => ({ value: item }));
|
||||
callback(
|
||||
keyword ? options.filter(item => String(item.value).toLowerCase().includes(keyword)) : options
|
||||
);
|
||||
},
|
||||
findCargoTypePath(cargoType, options = this.cargoTypeOptions, parentPath = []) {
|
||||
for (const option of options || []) {
|
||||
const path = [...parentPath, option.id];
|
||||
if (option.cargoName === cargoType) return path;
|
||||
if (option.children?.length) {
|
||||
const result = this.findCargoTypePath(cargoType, option.children, path);
|
||||
if (result.length) return result;
|
||||
}
|
||||
}
|
||||
return [];
|
||||
handleCargoTypeSelect(route, row, item = {}) {
|
||||
this.handleCargoTypeChange(route, row, item.value || '');
|
||||
},
|
||||
handleCargoTypeChange(route, row, value) {
|
||||
const path = Array.isArray(value) ? value : [];
|
||||
const cargoType = this.findCargoTypeByPath(path);
|
||||
row.cargoTypePath = path;
|
||||
row.cargoType = cargoType?.cargoName || '';
|
||||
const firstGoods = this.masterGoodsByCargoType(row)[0];
|
||||
row.cargoType = String(value ?? row.cargoType ?? '').trim();
|
||||
const matched = this.masterGoods.filter(item => item.cargoType === row.cargoType);
|
||||
const firstGoods = matched[0];
|
||||
if (firstGoods) {
|
||||
row.sourceIndex = firstGoods.sourceIndex;
|
||||
this.selectGoods(route, row);
|
||||
} else {
|
||||
Object.assign(row, {
|
||||
sourceIndex: undefined,
|
||||
cargoName: '',
|
||||
quantity: '',
|
||||
quantityUnit: '',
|
||||
packageType: '',
|
||||
brand: '',
|
||||
specification: '',
|
||||
model: '',
|
||||
materialCode: '',
|
||||
});
|
||||
}
|
||||
else Object.assign(row, { sourceIndex: undefined, cargoName: '', quantity: '', quantityUnit: '' });
|
||||
this.syncFreightItems(route);
|
||||
},
|
||||
isRoad(route) {
|
||||
@@ -542,53 +581,48 @@ export default {
|
||||
);
|
||||
return false;
|
||||
},
|
||||
pendingGoodsQuantity(route, row) {
|
||||
const goodsIndex = this.masterGoodsIndex(row);
|
||||
return this.pending.reduce((sum, item) => {
|
||||
if (!this.isSameRouteSegment(route, item)) return sum;
|
||||
const pendingGoodsIndex = this.masterGoodsIndex(item);
|
||||
if (
|
||||
(goodsIndex >= 0 && pendingGoodsIndex >= 0 && pendingGoodsIndex !== goodsIndex) ||
|
||||
(goodsIndex < 0 && !this.isSameGoods(item, row))
|
||||
) {
|
||||
return sum;
|
||||
}
|
||||
return sum + this.quantityNumber(item.quantity);
|
||||
}, 0);
|
||||
},
|
||||
isSameRouteSegment(route = {}, item = {}) {
|
||||
const routeSegment = route.segmentNo || route.relationNo || '';
|
||||
const itemSegment = item.segmentNo || item.relationNo || '';
|
||||
return String(routeSegment) === String(itemSegment);
|
||||
},
|
||||
editingGoodsQuantity(route, row) {
|
||||
return (route.goods || []).reduce((sum, item) => {
|
||||
if (item === row || !this.isSameGoods(item, row)) return sum;
|
||||
return sum + this.quantityNumber(item.dispatchQuantity);
|
||||
}, 0);
|
||||
},
|
||||
goodsRemainingQuantity(route, row) {
|
||||
return Math.max(
|
||||
0,
|
||||
this.baseGoodsRemainingQuantity(route, row) -
|
||||
this.pendingGoodsQuantity(route, row) -
|
||||
this.editingGoodsQuantity(route, row)
|
||||
);
|
||||
},
|
||||
availableDispatchQuantity(route, row) { return this.goodsRemainingQuantity(route, row); },
|
||||
handleDispatchQuantityInput(route, row, value) {
|
||||
const [integer = '', decimal = ''] = String(value || '').replace(/[^\d.]/g, '').split('.');
|
||||
const nextValue = decimal || String(value || '').includes('.') ? `${integer}.${decimal.slice(0, 3)}` : integer;
|
||||
const availableQuantity = this.availableDispatchQuantity(route, row);
|
||||
if (Number(nextValue || 0) > availableQuantity) {
|
||||
row.dispatchQuantity = this.formatQuantity(availableQuantity);
|
||||
this.syncFreightItems(route);
|
||||
this.$message.warning('本次数量不能超过剩余数量');
|
||||
return;
|
||||
}
|
||||
row.dispatchQuantity = nextValue;
|
||||
row.dispatchQuantity =
|
||||
decimal || String(value || '').includes('.') ? `${integer}.${decimal.slice(0, 3)}` : integer;
|
||||
this.syncFreightItems(route);
|
||||
},
|
||||
validatePendingTotals() {
|
||||
for (const route of this.routes) {
|
||||
const items = this.pending.filter(item => this.isSameRouteSegment(route, item));
|
||||
if (!items.length) continue;
|
||||
if (!this.validatePreviousSegmentCompletedQuantity(route, [])) return false;
|
||||
|
||||
const totals = new Map();
|
||||
for (const item of items) {
|
||||
const index = this.masterGoodsIndex(item);
|
||||
const key = index >= 0 ? `i:${index}` : this.goodsKey(item);
|
||||
totals.set(key, (totals.get(key) || 0) + this.quantityNumber(item.quantity));
|
||||
}
|
||||
for (const [key, qty] of totals.entries()) {
|
||||
if (!key.startsWith('i:')) continue;
|
||||
const sourceIndex = Number(key.slice(2));
|
||||
const masterGoods = this.master?.goods?.[sourceIndex];
|
||||
if (!masterGoods) continue;
|
||||
const available = this.baseGoodsRemainingQuantity(route, {
|
||||
...masterGoods,
|
||||
sourceIndex,
|
||||
});
|
||||
if (qty > available) {
|
||||
this.$message.warning(
|
||||
`${route.segmentNo}「${masterGoods.cargoName || ''}」调度总量不能超过剩余数量（${this.formatQuantity(available)} ${masterGoods.quantityUnit || this.quantityUnitLabel}）`
|
||||
);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
handleFreightUnitPriceInput(item, value) {
|
||||
const [integer = '', decimal = ''] = String(value || '').replace(/[^\d.]/g, '').split('.');
|
||||
item.unitPrice = decimal || String(value || '').includes('.') ? `${integer}.${decimal.slice(0, 2)}` : integer;
|
||||
@@ -618,7 +652,7 @@ export default {
|
||||
const index = (route.goods || []).indexOf(item) + 1;
|
||||
const fields = [
|
||||
[!String(item.cargoName || '').trim() || item.sourceIndex === undefined || item.sourceIndex === null || item.sourceIndex === '', '货物名称'],
|
||||
[!String(item.cargoType || '').trim() && !(item.cargoTypePath || []).length, '货物类型'],
|
||||
[!String(item.cargoType || '').trim(), '货物类型'],
|
||||
[item.dispatchQuantity === undefined || item.dispatchQuantity === null || item.dispatchQuantity === '' || Number(item.dispatchQuantity) <= 0, '本次数量'],
|
||||
[!String(item.quantityUnit || '').trim(), '数量单位'],
|
||||
];
|
||||
@@ -650,7 +684,6 @@ export default {
|
||||
return {
|
||||
...goods,
|
||||
sourceIndex,
|
||||
cargoTypePath: this.findCargoTypePath(goods.cargoType),
|
||||
dispatchQuantity: undefined,
|
||||
};
|
||||
},
|
||||
@@ -666,7 +699,8 @@ export default {
|
||||
selectGoods(route, row) {
|
||||
const source = (this.master.goods || [])[Number(row.sourceIndex)];
|
||||
if (!source) return;
|
||||
Object.assign(row, this.createGoodsRow(source, Number(row.sourceIndex)));
|
||||
const cargoType = String(row.cargoType || '').trim() || source.cargoType;
|
||||
Object.assign(row, this.createGoodsRow(source, Number(row.sourceIndex)), { cargoType });
|
||||
this.syncFreightItems(route);
|
||||
},
|
||||
removeGoods(route, index) { route.goods.splice(index, 1); this.syncFreightItems(route); },
|
||||
@@ -854,8 +888,6 @@ export default {
|
||||
const goods = route.goods.filter(item => Number(item.dispatchQuantity) > 0);
|
||||
if (!goods.length) return this.$message.warning('请填写本次数量');
|
||||
if (!this.validateDispatchGoods(route, goods)) return;
|
||||
if (goods.some(item => Number(item.dispatchQuantity) > this.availableDispatchQuantity(route, item))) return this.$message.warning('本次数量不能超过剩余数量');
|
||||
if (!this.validatePreviousSegmentCompletedQuantity(route, goods)) return;
|
||||
this.syncFreightItems(route);
|
||||
if (!this.validateFreightItems(route)) return;
|
||||
if (!this.validateRoutePhones(route)) return;
|
||||
@@ -954,6 +986,7 @@ export default {
|
||||
async submit() {
|
||||
if (!this.pending.length) return this.$message.warning('请加入待提交调度清单');
|
||||
if (this.pending.some(item => !this.validateRoutePhones(item))) return;
|
||||
if (!this.validatePendingTotals()) return;
|
||||
this.submitting = true;
|
||||
try { await api.dispatch({ id: this.master.id, dispatches: this.pending.map(({ id, ...item }) => ({ ...item, mileage: this.normalizeMileage(item.mileage) })) }); this.$message.success('调度成功'); this.$emit('back'); } finally { this.submitting = false; }
|
||||
},
|
||||
@@ -985,7 +1018,7 @@ export default {
|
||||
.transport-type-field :deep(.el-input) { width: 240px; }
|
||||
.goods-heading { display: flex; align-items: center; justify-content: space-between; margin: 0 -24px 12px; padding: 14px 24px; border-top: 1px solid #eff1f7; border-bottom: 1px solid #eff1f7; h3 { margin: 0; padding-left: 12px; border-left: 4px solid #409eff; font-size: 16px; } span { color: #909399; font-size: 13px; } }
|
||||
.freight-heading { margin: 16px 0 12px; h3 { margin: 0; padding-left: 12px; border-left: 4px solid #409eff; font-size: 16px; } }
|
||||
.goods-table { :deep(th.el-table__cell), :deep(td.el-table__cell) { border-color: #eff1f7; } :deep(.el-table__row--striped td.el-table__cell) { background: #fafafa; } :deep(.goods-table__remaining .cell) { white-space: nowrap; } :deep(.goods-table__dispatch .el-input) { width: 100%; min-width: 0; } :deep(.goods-table__cargo-type .el-input__inner), :deep(.goods-table__cargo-name .el-select__selected-item) { color: #303133; } }
|
||||
.goods-table { :deep(th.el-table__cell), :deep(td.el-table__cell) { border-color: #eff1f7; } :deep(.el-table__row--striped td.el-table__cell) { background: #fafafa; } :deep(.goods-table__dispatch .el-input) { width: 100%; min-width: 0; } :deep(.goods-table__cargo-type), :deep(.goods-table__cargo-name) { width: 100%; } :deep(.goods-table__cargo-type .el-input__inner), :deep(.goods-table__cargo-name .el-select__selected-item) { color: #303133; } }
|
||||
.goods-required-mark { margin-left: 2px; color: #f56c6c; }
|
||||
.freight-form { :deep(.freight-unit-select) { width: 92px; flex: 0 0 92px; min-width: 0; } }
|
||||
.carrier-type-form { margin-top: 16px; }
|
||||
|
||||
@@ -146,8 +146,9 @@
|
||||
/>
|
||||
<el-input
|
||||
v-model="form.departureAddress"
|
||||
placeholder="请输入发货地址"
|
||||
:readonly="transportStationMode || !config.editableRoadAddress"
|
||||
class="shipping-template-page__address-map-input"
|
||||
readonly
|
||||
placeholder="请选择发货地址"
|
||||
:disabled="transportAddressSelectDisabled"
|
||||
@click="handleTransportSecondaryAddressInputClick('departure')"
|
||||
>
|
||||
@@ -189,8 +190,9 @@
|
||||
/>
|
||||
<el-input
|
||||
v-model="form.arrivalAddress"
|
||||
placeholder="请输入收货地址"
|
||||
:readonly="transportStationMode || !config.editableRoadAddress"
|
||||
class="shipping-template-page__address-map-input"
|
||||
readonly
|
||||
placeholder="请选择收货地址"
|
||||
:disabled="transportAddressSelectDisabled"
|
||||
@click="handleTransportSecondaryAddressInputClick('arrival')"
|
||||
>
|
||||
@@ -1131,7 +1133,7 @@ const defaultCargo = () => ({
|
||||
cargoTypePath: [],
|
||||
packageType: '',
|
||||
quantity: '',
|
||||
quantityUnit: '',
|
||||
quantityUnit: '吨',
|
||||
brand: '',
|
||||
specification: '',
|
||||
model: '',
|
||||
@@ -1258,6 +1260,7 @@ export default {
|
||||
crudDialogType: '',
|
||||
standaloneFormKey: '',
|
||||
copyingRow: null,
|
||||
suppressTransportTypeClear: false,
|
||||
detailBox: false,
|
||||
detailLoading: false,
|
||||
detailRow: {},
|
||||
@@ -1511,10 +1514,10 @@ export default {
|
||||
},
|
||||
},
|
||||
'form.transportType'(value, oldValue) {
|
||||
if (value !== oldValue) {
|
||||
this.handleTransportTypeChange(value);
|
||||
this.syncFreightItems();
|
||||
}
|
||||
if (this.suppressTransportTypeClear) return;
|
||||
if (String(value ?? '') === String(oldValue ?? '')) return;
|
||||
this.handleTransportTypeChange(value);
|
||||
this.syncFreightItems();
|
||||
},
|
||||
},
|
||||
created() {
|
||||
@@ -1527,6 +1530,20 @@ export default {
|
||||
methods: {
|
||||
buildOption(option) {
|
||||
const next = { ...option, column: (option.column || []).map(column => ({ ...column })) };
|
||||
const tableOrder = this.config.tableColumnOrder || [];
|
||||
if (tableOrder.length) {
|
||||
const orderMap = new Map(tableOrder.map((prop, index) => [prop, index]));
|
||||
next.column.sort((left, right) => {
|
||||
const leftOrder = orderMap.has(left.prop) ? orderMap.get(left.prop) : tableOrder.length;
|
||||
const rightOrder = orderMap.has(right.prop)
|
||||
? orderMap.get(right.prop)
|
||||
: tableOrder.length;
|
||||
return leftOrder - rightOrder;
|
||||
});
|
||||
next.column.forEach(column => {
|
||||
if (column.prop) column.hide = !orderMap.has(column.prop);
|
||||
});
|
||||
}
|
||||
if (this.menuWidth != null) next.menuWidth = this.menuWidth;
|
||||
if (
|
||||
this.standaloneFormPage &&
|
||||
@@ -1790,6 +1807,7 @@ export default {
|
||||
console.log('进入复制模式分支');
|
||||
const copyData = { ...this.copyingRow };
|
||||
this.copyingRow = null;
|
||||
this.suppressTransportTypeClear = true;
|
||||
this.form = { ...(this.config.defaultForm || {}), ...copyData };
|
||||
console.log('合并后的 form:', this.form);
|
||||
// 删除模板编号，等待系统生成
|
||||
@@ -1842,7 +1860,11 @@ export default {
|
||||
done?.();
|
||||
},
|
||||
applyFormDetail(row) {
|
||||
this.suppressTransportTypeClear = true;
|
||||
this.form = { ...(row || {}) };
|
||||
this.$nextTick(() => {
|
||||
this.suppressTransportTypeClear = false;
|
||||
});
|
||||
this.selectedProjectId = this.form.projectId || '';
|
||||
this.transportCargoRows = this.parseJsonArray(this.form.goodsJson).map(item =>
|
||||
this.normalizeCargo(item)
|
||||
@@ -1924,14 +1946,6 @@ export default {
|
||||
this.$message.warning(`第${index + 1}行货物类型不能为空`);
|
||||
return false;
|
||||
}
|
||||
if (!String(row.cargoName || '').trim() || !row.quantity || !row.quantityUnit) {
|
||||
this.$message.warning(`第${index + 1}行货物信息不完整`);
|
||||
return false;
|
||||
}
|
||||
if (Number(row.quantity) <= 0) {
|
||||
this.$message.warning(`第${index + 1}行数量必须大于0`);
|
||||
return false;
|
||||
}
|
||||
if (String(row.remark || '').length > 200) {
|
||||
this.$message.warning(`第${index + 1}行备注不能超过200个字符`);
|
||||
return false;
|
||||
@@ -2013,6 +2027,8 @@ export default {
|
||||
delete detail.updateUser;
|
||||
delete detail.updateUserName;
|
||||
delete detail.status;
|
||||
// 模板名称追加「-副本」
|
||||
detail.templateName = `${detail.templateName || ''}-副本`;
|
||||
|
||||
console.log('处理后的数据:', detail);
|
||||
console.log('isStandaloneBusinessPage:', this.isStandaloneBusinessPage);
|
||||
@@ -2286,13 +2302,60 @@ export default {
|
||||
},
|
||||
handleTransportTypeChange(value) {
|
||||
this.form.transportTypeName = this.getTransportTypeLabel(value);
|
||||
this.clearTransportShippingInfo();
|
||||
},
|
||||
clearTransportShippingInfo() {
|
||||
[
|
||||
'departureName',
|
||||
'departureAddress',
|
||||
'departureAddressCode',
|
||||
'departureSiteCode',
|
||||
'departureLongitude',
|
||||
'departureLatitude',
|
||||
'departureContact',
|
||||
'departurePhone',
|
||||
'arrivalName',
|
||||
'arrivalAddress',
|
||||
'arrivalAddressCode',
|
||||
'arrivalSiteCode',
|
||||
'arrivalLongitude',
|
||||
'arrivalLatitude',
|
||||
'arrivalContact',
|
||||
'arrivalPhone',
|
||||
].forEach(prop => {
|
||||
this.form[prop] = '';
|
||||
});
|
||||
this.transportMapSelected = {};
|
||||
this.transportRouteBox = false;
|
||||
this.transportAddressBox = false;
|
||||
this.transportStationBox = false;
|
||||
this.transportMapBox = false;
|
||||
this.transportAddressTarget = '';
|
||||
this.transportStationTarget = '';
|
||||
this.transportMapTarget = '';
|
||||
this.transportMapKeyword = '';
|
||||
this.transportMapStatus = '可搜索地址或点击地图选点';
|
||||
if (this.transportAmapMarker) {
|
||||
this.transportAmapMarker.setMap(null);
|
||||
this.transportAmapMarker = null;
|
||||
}
|
||||
this.$refs.crud?.clearValidate?.([
|
||||
'departureAddress',
|
||||
'arrivalAddress',
|
||||
'departureName',
|
||||
'arrivalName',
|
||||
'departureContact',
|
||||
'departurePhone',
|
||||
'arrivalContact',
|
||||
'arrivalPhone',
|
||||
]);
|
||||
},
|
||||
openTransportPrimaryAddressPicker(target) {
|
||||
if (this.transportStationMode) this.openTransportStationDialog(target);
|
||||
},
|
||||
handleTransportSecondaryAddressInputClick(target) {
|
||||
if (this.transportStationMode || !this.config.editableRoadAddress)
|
||||
this.openTransportSecondaryAddressPicker(target);
|
||||
if (this.transportAddressSelectDisabled) return;
|
||||
this.openTransportSecondaryAddressPicker(target);
|
||||
},
|
||||
openTransportSecondaryAddressPicker(target) {
|
||||
this.transportStationMode
|
||||
@@ -3328,6 +3391,13 @@ export default {
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
}
|
||||
.shipping-template-page__address-map-input {
|
||||
cursor: pointer;
|
||||
:deep(.el-input__wrapper),
|
||||
:deep(.el-input__inner) {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.shipping-template-page__section-actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
|
||||
@@ -85,15 +85,23 @@
|
||||
</template>
|
||||
|
||||
<template #departureAddress="{ row }">
|
||||
<el-tooltip v-if="row.departureAddress" :content="row.departureAddress" placement="top">
|
||||
<span>{{ formatTransportPlanProvinceCityDistrict(row.departureAddress) }}</span>
|
||||
<el-tooltip
|
||||
v-if="row.departureAddress || row.departureName"
|
||||
:content="row.departureAddress || row.departureName"
|
||||
placement="top"
|
||||
>
|
||||
<span>{{ formatTransportPlanListAddress(row, 'departure') }}</span>
|
||||
</el-tooltip>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
|
||||
<template #arrivalAddress="{ row }">
|
||||
<el-tooltip v-if="row.arrivalAddress" :content="row.arrivalAddress" placement="top">
|
||||
<span>{{ formatTransportPlanProvinceCityDistrict(row.arrivalAddress) }}</span>
|
||||
<el-tooltip
|
||||
v-if="row.arrivalAddress || row.arrivalName"
|
||||
:content="row.arrivalAddress || row.arrivalName"
|
||||
placement="top"
|
||||
>
|
||||
<span>{{ formatTransportPlanListAddress(row, 'arrival') }}</span>
|
||||
</el-tooltip>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
@@ -574,7 +582,7 @@
|
||||
>
|
||||
<el-link
|
||||
type="primary"
|
||||
v-if="hasPermission(`${config.permission}_view`) && !showDetailButton(row)"
|
||||
v-if="showViewButton(row)"
|
||||
@click="$refs.crud.rowView(row, index)"
|
||||
>
|
||||
查看
|
||||
@@ -1492,27 +1500,38 @@
|
||||
<el-input
|
||||
v-model="dispatchItemForm.departureName"
|
||||
:placeholder="dispatchStationNamePlaceholder"
|
||||
:suffix-icon="dispatchStationMode ? Search : undefined"
|
||||
disabled
|
||||
/>
|
||||
:readonly="dispatchStationMode"
|
||||
@click="openDispatchPrimaryAddressPicker('departure')"
|
||||
>
|
||||
<template v-if="dispatchStationMode" #suffix>
|
||||
<el-icon
|
||||
class="transport-plan-page__map-suffix"
|
||||
@click.stop="openDispatchSecondaryAddressPicker('departure')"
|
||||
>
|
||||
<Search />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-input
|
||||
v-model="dispatchItemForm.departureAddress"
|
||||
:placeholder="dispatchAddressDetailPlaceholder"
|
||||
disabled
|
||||
:readonly="dispatchStationMode"
|
||||
@click="handleDispatchSecondaryAddressInputClick('departure')"
|
||||
>
|
||||
<template v-if="!dispatchStationMode" #suffix>
|
||||
<el-link
|
||||
type="primary"
|
||||
:underline="false"
|
||||
class="transport-plan-page__address-choose-link"
|
||||
@click.stop="openTransportMapDialog('departure')"
|
||||
>选择</el-link
|
||||
>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="transport-plan-page__route-label">联系人</span>
|
||||
<el-input v-model="dispatchItemForm.departureContact" placeholder="请输入" disabled />
|
||||
<el-input v-model="dispatchItemForm.departureContact" placeholder="请输入" />
|
||||
<span class="transport-plan-page__route-label">联系方式</span>
|
||||
<el-input v-model="dispatchItemForm.departurePhone" placeholder="请输入" disabled />
|
||||
<el-input v-model="dispatchItemForm.departurePhone" placeholder="请输入" />
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="收货地址" required>
|
||||
@@ -1520,27 +1539,38 @@
|
||||
<el-input
|
||||
v-model="dispatchItemForm.arrivalName"
|
||||
:placeholder="dispatchStationNamePlaceholder"
|
||||
:suffix-icon="dispatchStationMode ? Search : undefined"
|
||||
disabled
|
||||
/>
|
||||
:readonly="dispatchStationMode"
|
||||
@click="openDispatchPrimaryAddressPicker('arrival')"
|
||||
>
|
||||
<template v-if="dispatchStationMode" #suffix>
|
||||
<el-icon
|
||||
class="transport-plan-page__map-suffix"
|
||||
@click.stop="openDispatchSecondaryAddressPicker('arrival')"
|
||||
>
|
||||
<Search />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-input
|
||||
v-model="dispatchItemForm.arrivalAddress"
|
||||
:placeholder="dispatchAddressDetailPlaceholder"
|
||||
disabled
|
||||
:readonly="dispatchStationMode"
|
||||
@click="handleDispatchSecondaryAddressInputClick('arrival')"
|
||||
>
|
||||
<template v-if="!dispatchStationMode" #suffix>
|
||||
<el-link
|
||||
type="primary"
|
||||
:underline="false"
|
||||
class="transport-plan-page__address-choose-link"
|
||||
@click.stop="openTransportMapDialog('arrival')"
|
||||
>选择</el-link
|
||||
>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="transport-plan-page__route-label">联系人</span>
|
||||
<el-input v-model="dispatchItemForm.arrivalContact" placeholder="请输入" disabled />
|
||||
<el-input v-model="dispatchItemForm.arrivalContact" placeholder="请输入" />
|
||||
<span class="transport-plan-page__route-label">联系方式</span>
|
||||
<el-input v-model="dispatchItemForm.arrivalPhone" placeholder="请输入" disabled />
|
||||
<el-input v-model="dispatchItemForm.arrivalPhone" placeholder="请输入" />
|
||||
</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@@ -1576,20 +1606,15 @@
|
||||
><span class="transport-plan-page__required-column">货物类型</span></template
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<el-select
|
||||
<el-autocomplete
|
||||
v-model="row.cargoType"
|
||||
placeholder="请选择货物类型"
|
||||
placeholder="请输入货物类型"
|
||||
clearable
|
||||
filterable
|
||||
:debounce="300"
|
||||
:fetch-suggestions="fetchDispatchConfiguredCargoTypeSuggestions"
|
||||
@select="item => handleDispatchConfiguredCargoTypeSelect(row, item)"
|
||||
@change="value => handleDispatchConfiguredCargoTypeChange(row, value)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in getDispatchConfiguredCargoTypeOptions()"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="240" align="center">
|
||||
@@ -1597,20 +1622,18 @@
|
||||
><span class="transport-plan-page__required-column">货物名称</span></template
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<el-select
|
||||
<el-autocomplete
|
||||
v-model="row.cargoName"
|
||||
placeholder="请选择货物名称"
|
||||
placeholder="请输入货物名称"
|
||||
clearable
|
||||
filterable
|
||||
:debounce="300"
|
||||
:fetch-suggestions="
|
||||
(queryString, callback) =>
|
||||
fetchDispatchConfiguredCargoNameSuggestions(queryString, callback, row)
|
||||
"
|
||||
@select="item => handleDispatchConfiguredCargoNameSelect(row, item)"
|
||||
@change="value => handleDispatchConfiguredCargoNameChange(row, value)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in getDispatchConfiguredCargoNameOptions(row)"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="包装" min-width="130" align="center">
|
||||
@@ -1627,7 +1650,11 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="剩余数量" min-width="130" align="center">
|
||||
<template #default="{ row }">
|
||||
{{ formatDispatchQuantity(dispatchItemRemainingQuantity(row)) }}
|
||||
{{
|
||||
isDispatchPlanQuantityUnlimited(row)
|
||||
? '-'
|
||||
: formatDispatchQuantity(dispatchItemRemainingQuantity(row))
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="130" align="center">
|
||||
@@ -1848,36 +1875,33 @@
|
||||
<el-input v-model="dispatchItemForm.escortPhone" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="货物类型" required>
|
||||
<el-select
|
||||
<el-autocomplete
|
||||
v-model="dispatchItemForm.cargoType"
|
||||
placeholder="请选择货物类型"
|
||||
placeholder="请输入货物类型"
|
||||
clearable
|
||||
filterable
|
||||
@change="handleDispatchConfiguredCargoTypeChange(dispatchItemForm, $event)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in getDispatchConfiguredCargoTypeOptions()"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
:debounce="300"
|
||||
:fetch-suggestions="fetchDispatchConfiguredCargoTypeSuggestions"
|
||||
@select="item => handleDispatchConfiguredCargoTypeSelect(dispatchItemForm, item)"
|
||||
@change="value => handleDispatchConfiguredCargoTypeChange(dispatchItemForm, value)"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="货物名称" required>
|
||||
<el-select
|
||||
<el-autocomplete
|
||||
v-model="dispatchItemForm.cargoName"
|
||||
placeholder="请选择货物名称"
|
||||
placeholder="请输入货物名称"
|
||||
clearable
|
||||
filterable
|
||||
@change="handleDispatchConfiguredCargoNameChange(dispatchItemForm, $event)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in getDispatchConfiguredCargoNameOptions(dispatchItemForm)"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
:debounce="300"
|
||||
:fetch-suggestions="
|
||||
(queryString, callback) =>
|
||||
fetchDispatchConfiguredCargoNameSuggestions(
|
||||
queryString,
|
||||
callback,
|
||||
dispatchItemForm
|
||||
)
|
||||
"
|
||||
@select="item => handleDispatchConfiguredCargoNameSelect(dispatchItemForm, item)"
|
||||
@change="value => handleDispatchConfiguredCargoNameChange(dispatchItemForm, value)"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="规格">
|
||||
<el-input v-model="dispatchItemForm.specification" placeholder="请输入" />
|
||||
@@ -1902,7 +1926,10 @@
|
||||
</el-select>
|
||||
</template>
|
||||
</el-input>
|
||||
<div class="transport-plan-page__dispatch-quantity-hint">
|
||||
<div
|
||||
v-if="!isDispatchPlanQuantityUnlimited(dispatchItemForm)"
|
||||
class="transport-plan-page__dispatch-quantity-hint"
|
||||
>
|
||||
剩余数量：{{
|
||||
formatDispatchQuantity(dispatchItemRemainingQuantity(dispatchItemForm))
|
||||
}}
|
||||
@@ -3412,15 +3439,21 @@ export default {
|
||||
}));
|
||||
},
|
||||
dispatchHasAddableQuantity() {
|
||||
return this.dispatchTableQuantityItems.some(
|
||||
item => item.total > 0 && item.listed < item.total - 1e-8
|
||||
);
|
||||
const items = this.dispatchTableQuantityItems;
|
||||
if (!items.length) return true;
|
||||
// 计划总量为 0 时不限制新增调度
|
||||
if (items.every(item => item.total <= 0)) return true;
|
||||
return items.some(item => item.total > 0 && item.listed < item.total - 1e-8);
|
||||
},
|
||||
dispatchSummaryText() {
|
||||
const formatSummary = field =>
|
||||
this.dispatchSummaryItems
|
||||
.map(item => `${this.formatDispatchQuantity(item[field])}${item.unit}`)
|
||||
.join('、');
|
||||
const unlimited = this.dispatchSummaryItems.every(item => item.total <= 0);
|
||||
if (unlimited) {
|
||||
return `已调度 ${formatSummary('assigned') || `0${TRANSPORT_PLAN_QUANTITY_UNIT}`}`;
|
||||
}
|
||||
return `共${formatSummary('total')} | 已调度 ${formatSummary(
|
||||
'assigned'
|
||||
)}，剩余${formatSummary('remaining')}`;
|
||||
@@ -3606,12 +3639,13 @@ export default {
|
||||
return ['water', 'rail', 'air'].includes(this.transportMode);
|
||||
},
|
||||
transportStationTypeLabel() {
|
||||
const mode = this.dispatchItemBox ? this.dispatchTransportMode : this.transportMode;
|
||||
const labelMap = {
|
||||
water: '港口/码头',
|
||||
rail: '铁路车站',
|
||||
air: '空港机场',
|
||||
};
|
||||
return labelMap[this.transportMode] || '';
|
||||
return labelMap[mode] || '';
|
||||
},
|
||||
transportStationNamePlaceholder() {
|
||||
if (!this.transportStationMode) return '行政区划自动带出';
|
||||
@@ -3798,6 +3832,37 @@ export default {
|
||||
const cityMatch = text.match(/市/);
|
||||
return cityMatch ? text.slice(0, cityMatch.index + 1) : text;
|
||||
},
|
||||
formatTransportPlanListAddress(row = {}, field) {
|
||||
const address = String(row[`${field}Address`] || '').trim();
|
||||
const name = String(row[`${field}Name`] || '').trim();
|
||||
const fromAddress = this.extractTransportPlanProvinceCityDistrict(address);
|
||||
if (fromAddress) return fromAddress;
|
||||
const fromName = this.extractTransportPlanProvinceCityDistrict(name);
|
||||
if (fromName) return fromName;
|
||||
return name || address || '-';
|
||||
},
|
||||
extractTransportPlanProvinceCityDistrict(value) {
|
||||
const text = String(value || '')
|
||||
.trim()
|
||||
.replace(/[\\/|｜、,，\s]+/g, '');
|
||||
if (!text) return '';
|
||||
const districtPattern = '(?:自治县|自治旗|林区|矿区|新区|开发区|区|县|旗)';
|
||||
const parts = [];
|
||||
let remainder = text;
|
||||
const province = text.match(/^(.+?(?:省|自治区|特别行政区))/);
|
||||
if (province) {
|
||||
parts.push(province[1]);
|
||||
remainder = text.slice(province[1].length);
|
||||
}
|
||||
const city = remainder.match(/^(.+?市)/);
|
||||
if (city) {
|
||||
parts.push(city[1]);
|
||||
remainder = remainder.slice(city[1].length);
|
||||
}
|
||||
const district = remainder.match(new RegExp(`^(.+?${districtPattern})`));
|
||||
if (district) parts.push(district[1]);
|
||||
return parts.length ? parts.join('/') : '';
|
||||
},
|
||||
formatTransportPlanRoadCityDistrict(value) {
|
||||
const text = String(value || '').trim();
|
||||
if (!text) return '-';
|
||||
@@ -3955,6 +4020,11 @@ export default {
|
||||
const status = this.statusValue(row);
|
||||
return status !== 'draft';
|
||||
},
|
||||
showViewButton(row) {
|
||||
if (!this.hasPermission(`${this.config.permission}_view`)) return false;
|
||||
if (this.statusValue(row) === 'draft') return false;
|
||||
return !this.showDetailButton(row);
|
||||
},
|
||||
formatDetailValue(row, prop) {
|
||||
if (!row) return '-';
|
||||
if (prop === 'businessStatus') return this.displayStatus(row, prop);
|
||||
@@ -4540,6 +4610,37 @@ export default {
|
||||
getDispatchRemainingQuantity(unit) {
|
||||
return this.getDispatchSummaryItem(unit)?.remaining || 0;
|
||||
},
|
||||
/** 计划总量为 0 时不限制调度数量 */
|
||||
isDispatchPlanQuantityUnlimited(row = {}) {
|
||||
const unit = this.getDispatchQuantityUnit(row);
|
||||
const hasCargoIdentity = Boolean(
|
||||
String(row.cargoName || row.goodsName || row.name || '').trim() ||
|
||||
String(row.cargoType || row.secondCargoTypeName || row.goodsType || row.type || '').trim()
|
||||
);
|
||||
const planGoodsRows = this.dispatchPlanGoodsRows;
|
||||
if (planGoodsRows.length && hasCargoIdentity) {
|
||||
const cargoKey = this.getDispatchCargoIdentity(row);
|
||||
const matchedPlanRows = planGoodsRows.filter(
|
||||
goods => this.getDispatchCargoIdentity(goods) === cargoKey
|
||||
);
|
||||
if (!matchedPlanRows.length) {
|
||||
return (this.getDispatchSummaryItem(unit)?.total || 0) <= 0;
|
||||
}
|
||||
const total = matchedPlanRows.reduce(
|
||||
(sum, goods) =>
|
||||
sum +
|
||||
this.parseDispatchQuantity(
|
||||
goods.quantity || goods.cargoQuantity || goods.goodsQuantity
|
||||
),
|
||||
0
|
||||
);
|
||||
return total <= 0;
|
||||
}
|
||||
if (!planGoodsRows.length) {
|
||||
return Number(this.dispatchRow.totalQuantity || this.dispatchRow.quantity || 0) <= 0;
|
||||
}
|
||||
return (this.getDispatchSummaryItem(unit)?.total || 0) <= 0;
|
||||
},
|
||||
formatDispatchQuantity(value) {
|
||||
const number = Number(value || 0);
|
||||
if (!Number.isFinite(number)) return '0';
|
||||
@@ -5238,6 +5339,13 @@ export default {
|
||||
}
|
||||
},
|
||||
ensureTransportTypeBeforeAddress() {
|
||||
if (this.dispatchItemBox) {
|
||||
const transportType =
|
||||
this.dispatchItemForm.transportType || this.dispatchRow?.transportType || '';
|
||||
if (!this.isBillingFieldEmpty(transportType)) return true;
|
||||
this.$message.warning('请先选择运输方式');
|
||||
return false;
|
||||
}
|
||||
if (!this.shippingInfoFormEnabled || !this.isBillingFieldEmpty(this.form.transportType)) {
|
||||
return true;
|
||||
}
|
||||
@@ -5314,19 +5422,21 @@ export default {
|
||||
},
|
||||
openTransportStationDialog(target) {
|
||||
if (!this.ensureTransportTypeBeforeAddress()) return;
|
||||
if (!this.transportStationMode) return;
|
||||
const stationMode = this.dispatchItemBox ? this.dispatchStationMode : this.transportStationMode;
|
||||
if (!stationMode) return;
|
||||
this.transportStationTarget = target;
|
||||
this.transportStationQuery = {};
|
||||
this.transportStationPage.currentPage = 1;
|
||||
this.transportStationBox = true;
|
||||
},
|
||||
getTransportStationListRequest() {
|
||||
const mode = this.dispatchItemBox ? this.dispatchTransportMode : this.transportMode;
|
||||
const requestMap = {
|
||||
water: getPortTerminalList,
|
||||
rail: getRailwayStationList,
|
||||
air: getAirportMasterList,
|
||||
};
|
||||
return requestMap[this.transportMode];
|
||||
return requestMap[mode];
|
||||
},
|
||||
loadTransportStationList() {
|
||||
const request = this.getTransportStationListRequest();
|
||||
@@ -5436,7 +5546,28 @@ export default {
|
||||
water: '港口/码头',
|
||||
air: '空港机场',
|
||||
};
|
||||
return typeMap[this.transportMode] || '';
|
||||
const mode = this.dispatchItemBox ? this.dispatchTransportMode : this.transportMode;
|
||||
return typeMap[mode] || '';
|
||||
},
|
||||
getTransportAddressForm() {
|
||||
return this.dispatchItemBox ? this.dispatchItemForm : this.form;
|
||||
},
|
||||
openDispatchPrimaryAddressPicker(target) {
|
||||
if (this.dispatchStationMode) {
|
||||
this.openTransportStationDialog(target);
|
||||
}
|
||||
},
|
||||
openDispatchSecondaryAddressPicker(target) {
|
||||
if (this.dispatchStationMode) {
|
||||
this.openTransportStationDialog(target);
|
||||
return;
|
||||
}
|
||||
this.openTransportMapDialog(target);
|
||||
},
|
||||
handleDispatchSecondaryAddressInputClick(target) {
|
||||
if (this.dispatchStationMode) {
|
||||
this.openDispatchSecondaryAddressPicker(target);
|
||||
}
|
||||
},
|
||||
loadTransportAddressList() {
|
||||
this.transportAddressLoading = true;
|
||||
@@ -5487,35 +5618,39 @@ export default {
|
||||
},
|
||||
applyTransportAddress(target, address = {}) {
|
||||
const prefix = target === 'departure' ? 'departure' : 'arrival';
|
||||
this.form[`${prefix}Name`] = address.preferRegionName
|
||||
const addressForm = this.getTransportAddressForm();
|
||||
addressForm[`${prefix}Name`] = address.preferRegionName
|
||||
? address.regionName || address.addressName || ''
|
||||
: address.addressName || address.regionName || '';
|
||||
this.form[`${prefix}Address`] = address.detailAddress || address.address || '';
|
||||
this.form[`${prefix}AddressCode`] = address.addressCode || '';
|
||||
this.form[`${prefix}SiteCode`] =
|
||||
addressForm[`${prefix}Address`] = address.detailAddress || address.address || '';
|
||||
addressForm[`${prefix}AddressCode`] = address.addressCode || '';
|
||||
addressForm[`${prefix}SiteCode`] =
|
||||
address.addressType === '常规地址'
|
||||
? '/'
|
||||
: address.siteCodeDisplay || address.siteCode || '';
|
||||
this.form[`${prefix}Longitude`] = address.longitude || '';
|
||||
this.form[`${prefix}Latitude`] = address.latitude || '';
|
||||
this.form[`${prefix}Contact`] = address.contactName || this.form[`${prefix}Contact`] || '';
|
||||
this.form[`${prefix}Phone`] = address.contactPhone || this.form[`${prefix}Phone`] || '';
|
||||
addressForm[`${prefix}Longitude`] = address.longitude || '';
|
||||
addressForm[`${prefix}Latitude`] = address.latitude || '';
|
||||
addressForm[`${prefix}Contact`] =
|
||||
address.contactName || addressForm[`${prefix}Contact`] || '';
|
||||
addressForm[`${prefix}Phone`] = address.contactPhone || addressForm[`${prefix}Phone`] || '';
|
||||
// 地址值在本轮响应式更新后再清理校验状态，避免 Avue 以旧空值重新触发必填提示。
|
||||
this.$nextTick(() => {
|
||||
this.$refs.crud?.clearValidate?.([`${prefix}Address`]);
|
||||
});
|
||||
},
|
||||
openTransportMapDialog(target) {
|
||||
if (this.dialogReadonly) return;
|
||||
if (this.dialogReadonly && !this.dispatchItemBox) return;
|
||||
if (!this.ensureTransportTypeBeforeAddress()) return;
|
||||
const prefix = target === 'departure' ? 'departure' : 'arrival';
|
||||
const addressForm = this.getTransportAddressForm();
|
||||
this.transportMapTarget = prefix;
|
||||
this.transportMapKeyword = this.form[`${prefix}Address`] || this.form[`${prefix}Name`] || '';
|
||||
this.transportMapKeyword =
|
||||
addressForm[`${prefix}Address`] || addressForm[`${prefix}Name`] || '';
|
||||
this.transportMapSelected = this.buildTransportMapSelection({
|
||||
lng: this.form[`${prefix}Longitude`],
|
||||
lat: this.form[`${prefix}Latitude`],
|
||||
address: this.form[`${prefix}Address`],
|
||||
regionName: this.form[`${prefix}Name`],
|
||||
lng: addressForm[`${prefix}Longitude`],
|
||||
lat: addressForm[`${prefix}Latitude`],
|
||||
address: addressForm[`${prefix}Address`],
|
||||
regionName: addressForm[`${prefix}Name`],
|
||||
});
|
||||
this.transportMapStatus = this.transportMapSelected.longitude
|
||||
? '已加载当前选点，可重新选点'
|
||||
@@ -5673,12 +5808,13 @@ export default {
|
||||
return;
|
||||
}
|
||||
const prefix = this.transportMapTarget;
|
||||
this.form[`${prefix}Address`] =
|
||||
this.transportMapSelected.detailAddress || this.form[`${prefix}Address`];
|
||||
this.form[`${prefix}Name`] =
|
||||
this.transportMapSelected.regionName || this.form[`${prefix}Name`];
|
||||
this.form[`${prefix}Longitude`] = this.transportMapSelected.longitude;
|
||||
this.form[`${prefix}Latitude`] = this.transportMapSelected.latitude;
|
||||
const addressForm = this.getTransportAddressForm();
|
||||
addressForm[`${prefix}Address`] =
|
||||
this.transportMapSelected.detailAddress || addressForm[`${prefix}Address`];
|
||||
addressForm[`${prefix}Name`] =
|
||||
this.transportMapSelected.regionName || addressForm[`${prefix}Name`];
|
||||
addressForm[`${prefix}Longitude`] = this.transportMapSelected.longitude;
|
||||
addressForm[`${prefix}Latitude`] = this.transportMapSelected.latitude;
|
||||
this.transportMapBox = false;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.crud?.clearValidate?.([`${prefix}Address`]);
|
||||
@@ -7287,8 +7423,9 @@ export default {
|
||||
item.cargoTypePath.join('/') === rowTypePath.join('/')
|
||||
)
|
||||
: goodsOptions;
|
||||
const source = filtered.length ? filtered : goodsOptions;
|
||||
const options = new Map();
|
||||
filtered.forEach(item => {
|
||||
source.forEach(item => {
|
||||
if (!item.cargoName || options.has(item.cargoName)) return;
|
||||
options.set(item.cargoName, {
|
||||
label: item.cargoName,
|
||||
@@ -7302,26 +7439,73 @@ export default {
|
||||
});
|
||||
return Array.from(options.values());
|
||||
},
|
||||
handleDispatchConfiguredCargoTypeChange(row, value) {
|
||||
const option = this.getDispatchConfiguredCargoTypeOptions().find(
|
||||
item => String(item.value) === String(value || '')
|
||||
fetchDispatchConfiguredCargoTypeSuggestions(queryString, callback) {
|
||||
const keyword = String(queryString || '').trim().toLowerCase();
|
||||
const options = this.getDispatchConfiguredCargoTypeOptions().map(item => ({
|
||||
...item,
|
||||
value: item.label,
|
||||
}));
|
||||
callback(
|
||||
keyword
|
||||
? options.filter(item => String(item.value).toLowerCase().includes(keyword))
|
||||
: options
|
||||
);
|
||||
row.cargoType = option?.label || '';
|
||||
row.cargoTypeCode = option?.cargoTypeCode || '';
|
||||
row.cargoTypePath = option?.cargoTypePath || [];
|
||||
},
|
||||
fetchDispatchConfiguredCargoNameSuggestions(queryString, callback, row = {}) {
|
||||
const keyword = String(queryString || '').trim().toLowerCase();
|
||||
const options = this.getDispatchConfiguredCargoNameOptions(row).map(item => ({
|
||||
...item,
|
||||
value: item.label,
|
||||
}));
|
||||
callback(
|
||||
keyword
|
||||
? options.filter(item => String(item.value).toLowerCase().includes(keyword))
|
||||
: options
|
||||
);
|
||||
},
|
||||
handleDispatchConfiguredCargoTypeSelect(row, item = {}) {
|
||||
this.handleDispatchConfiguredCargoTypeChange(row, item.value || item.label || '');
|
||||
},
|
||||
handleDispatchConfiguredCargoNameSelect(row, item = {}) {
|
||||
this.handleDispatchConfiguredCargoNameChange(row, item.value || item.label || '');
|
||||
},
|
||||
handleDispatchConfiguredCargoTypeChange(row, value) {
|
||||
const nextValue = String(value ?? row.cargoType ?? '').trim();
|
||||
const option = this.getDispatchConfiguredCargoTypeOptions().find(
|
||||
item => String(item.value) === nextValue || item.label === nextValue
|
||||
);
|
||||
if (option) {
|
||||
row.cargoType = option.label || '';
|
||||
row.cargoTypeCode = option.cargoTypeCode || '';
|
||||
row.cargoTypePath = option.cargoTypePath || [];
|
||||
} else {
|
||||
row.cargoType = nextValue;
|
||||
row.cargoTypeCode = '';
|
||||
row.cargoTypePath = [];
|
||||
}
|
||||
row.cargoName = '';
|
||||
row.specification = '';
|
||||
row.model = '';
|
||||
},
|
||||
handleDispatchConfiguredCargoNameChange(row, value) {
|
||||
const nextValue = String(value ?? row.cargoName ?? '').trim();
|
||||
const option = this.getDispatchConfiguredCargoNameOptions(row).find(
|
||||
item => String(item.value) === String(value || '')
|
||||
item => String(item.value) === nextValue || item.label === nextValue
|
||||
);
|
||||
row.cargoName = option?.value || '';
|
||||
if (!option) return;
|
||||
row.cargoType = option.cargoTypeLabel || row.cargoType || '';
|
||||
row.cargoTypeCode = option.cargoTypeCode || row.cargoTypeCode || '';
|
||||
row.cargoTypePath = option.cargoTypePath || row.cargoTypePath || [];
|
||||
if (!option) {
|
||||
row.cargoName = nextValue;
|
||||
return;
|
||||
}
|
||||
const previousType = String(row.cargoType || '').trim();
|
||||
const isKnownType = this.getDispatchConfiguredCargoTypeOptions().some(
|
||||
item => item.label === previousType || String(item.value) === previousType
|
||||
);
|
||||
row.cargoName = option.value || '';
|
||||
if (!previousType || isKnownType) {
|
||||
row.cargoType = option.cargoTypeLabel || previousType;
|
||||
row.cargoTypeCode = option.cargoTypeCode || row.cargoTypeCode || '';
|
||||
row.cargoTypePath = option.cargoTypePath || row.cargoTypePath || [];
|
||||
}
|
||||
row.specification = option.specification || row.specification || '';
|
||||
row.model = option.model || row.model || '';
|
||||
},
|
||||
@@ -7345,10 +7529,7 @@ export default {
|
||||
vehicleNo: this.dispatchRow.vehicleNo || '',
|
||||
cargoName: defaultGoods.cargoName || this.dispatchRow.cargoName || '',
|
||||
cargoType: defaultGoods.cargoType || this.dispatchRow.cargoType || '',
|
||||
quantity:
|
||||
index >= 0
|
||||
? defaultGoods.quantity || ''
|
||||
: this.formatDispatchQuantity(this.getDispatchRemainingQuantity(defaultUnit)),
|
||||
quantity: '',
|
||||
quantityUnit: defaultUnit,
|
||||
specification: defaultGoods.specification || '',
|
||||
model: defaultGoods.model || '',
|
||||
@@ -8003,6 +8184,7 @@ export default {
|
||||
quantityGroups.set(key, group);
|
||||
});
|
||||
for (const { row: goods, quantity } of quantityGroups.values()) {
|
||||
if (this.isDispatchPlanQuantityUnlimited(goods)) continue;
|
||||
const unit = this.getDispatchQuantityUnit(goods);
|
||||
const remaining = this.dispatchItemRemainingQuantity(goods);
|
||||
if (quantity - remaining > 1e-8) {
|
||||
|
||||
@@ -10,107 +10,200 @@
|
||||
:class="{ 'waybill-import-page': standalone }"
|
||||
@closed="handleClosed"
|
||||
>
|
||||
<div class="waybill-import-toolbar">
|
||||
<div class="waybill-import-toolbar__search">
|
||||
<el-form :inline="true" :model="query" label-width="auto">
|
||||
<el-form-item label="运单批次号"
|
||||
><el-input v-model="query.batchNo" clearable
|
||||
/></el-form-item>
|
||||
<el-form-item label="承运商"
|
||||
><el-select v-model="query.carrierId" clearable filterable
|
||||
><el-option
|
||||
<section v-show="searchVisible" class="waybill-import-toolbar__search">
|
||||
<el-form :model="query" label-position="right" label-width="88px" @submit.prevent>
|
||||
<div class="waybill-import-toolbar__search-grid">
|
||||
<el-form-item label="运单批次号">
|
||||
<el-input v-model="query.batchNo" clearable placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="承运商">
|
||||
<el-select v-model="query.carrierId" clearable filterable placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in queryCarriers"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id" /></el-select
|
||||
></el-form-item>
|
||||
<el-form-item label="创建时间"
|
||||
><el-date-picker
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker
|
||||
v-model="query.createTimeRange"
|
||||
type="datetimerange"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
/></el-form-item>
|
||||
<el-form-item label="创建人"
|
||||
><el-select v-model="query.createUser" clearable filterable
|
||||
><el-option
|
||||
range-separator="~"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建人">
|
||||
<el-select v-model="query.createUser" clearable filterable placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in creators"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id" /></el-select
|
||||
></el-form-item>
|
||||
</el-form>
|
||||
<div class="waybill-import-toolbar__search-actions">
|
||||
<el-button type="primary" @click="loadBatches">查询</el-button
|
||||
><el-button @click="resetQuery">重置</el-button>
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</div>
|
||||
<div class="waybill-import-toolbar__actions">
|
||||
<el-button type="primary" @click="handleCreate">新建导入</el-button
|
||||
><el-button type="danger" plain :disabled="!selected.length" @click="removeBatches"
|
||||
<div class="waybill-import-toolbar__search-actions">
|
||||
<el-button type="primary" @click="loadBatches">查询</el-button>
|
||||
<el-button @click="resetQuery">重置</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</section>
|
||||
<div class="avue-crud__header waybill-import-toolbar__actions">
|
||||
<div class="avue-crud__left">
|
||||
<el-button type="primary" @click="handleCreate">新建导入</el-button>
|
||||
<el-button type="danger" plain :disabled="!selected.length" @click="removeBatches"
|
||||
>批量删除</el-button
|
||||
>
|
||||
</div>
|
||||
<div class="avue-crud__right">
|
||||
<el-button icon="el-icon-refresh" circle @click="loadBatches" />
|
||||
<el-button icon="el-icon-operation" circle @click="columnSettingVisible = true" />
|
||||
<el-button icon="el-icon-search" circle @click="searchVisible = !searchVisible" />
|
||||
<el-button icon="el-icon-grid" circle @click="toggleTableSize" />
|
||||
</div>
|
||||
</div>
|
||||
<el-table :data="batches" border @selection-change="selected = $event">
|
||||
<el-table-column type="selection" width="50" /><el-table-column
|
||||
type="index"
|
||||
label="序号"
|
||||
width="70"
|
||||
/>
|
||||
<el-table-column prop="batchNo" label="运单批次号" min-width="150" /><el-table-column
|
||||
prop="projectName"
|
||||
label="项目名称"
|
||||
min-width="150"
|
||||
/>
|
||||
<el-table-column prop="carrierName" label="承运商" min-width="140" /><el-table-column
|
||||
prop="carrierType"
|
||||
label="承运类型"
|
||||
min-width="120"
|
||||
/>
|
||||
<el-table-column prop="waybillCount" label="运单数" width="90" /><el-table-column
|
||||
prop="importTypeName"
|
||||
label="导入方式"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="createTime"
|
||||
label="创建时间"
|
||||
min-width="170"
|
||||
sortable
|
||||
/><el-table-column prop="updateTime" label="更新时间" min-width="170" sortable />
|
||||
<el-table-column prop="statusName" label="状态" width="100" /><el-table-column
|
||||
label="操作"
|
||||
width="180"
|
||||
fixed="right"
|
||||
<section class="waybill-import-toolbar__table-panel">
|
||||
<el-table
|
||||
:data="batches"
|
||||
:size="tableSize"
|
||||
border
|
||||
@selection-change="selected = $event"
|
||||
>
|
||||
<template #default="{ row }"
|
||||
><el-link type="primary" @click="openDetail(row)">查看</el-link
|
||||
><el-link
|
||||
v-if="row.importStatus === 'draft'"
|
||||
type="primary"
|
||||
@click="editBatch(row)"
|
||||
>编辑</el-link
|
||||
><el-link type="danger" @click="removeBatch(row)">删除</el-link></template
|
||||
<el-table-column type="selection" width="50" /><el-table-column
|
||||
type="index"
|
||||
label="序号"
|
||||
width="70"
|
||||
/>
|
||||
<el-table-column
|
||||
v-if="columnVisible.batchNo"
|
||||
prop="batchNo"
|
||||
label="运单批次号"
|
||||
min-width="150"
|
||||
/><el-table-column
|
||||
v-if="columnVisible.projectName"
|
||||
prop="projectName"
|
||||
label="项目名称"
|
||||
min-width="150"
|
||||
/>
|
||||
<el-table-column
|
||||
v-if="columnVisible.carrierName"
|
||||
prop="carrierName"
|
||||
label="承运商"
|
||||
min-width="140"
|
||||
/><el-table-column
|
||||
v-if="columnVisible.carrierType"
|
||||
prop="carrierType"
|
||||
label="承运类型"
|
||||
min-width="120"
|
||||
/>
|
||||
<el-table-column
|
||||
v-if="columnVisible.waybillCount"
|
||||
prop="waybillCount"
|
||||
label="运单数"
|
||||
width="90"
|
||||
/> <el-table-column
|
||||
v-if="columnVisible.importTypeName"
|
||||
prop="importTypeName"
|
||||
label="导入方式"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column
|
||||
v-if="columnVisible.createUserName"
|
||||
prop="createUserName"
|
||||
label="创建人"
|
||||
min-width="120"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
v-model:current-page="page.current"
|
||||
v-model:page-size="page.size"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
:total="page.total"
|
||||
@current-change="loadBatches"
|
||||
@size-change="loadBatches"
|
||||
/>
|
||||
<template #default="{ row }">{{ row.createUserName || '-' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-if="columnVisible.statusName"
|
||||
prop="statusName"
|
||||
label="状态"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column
|
||||
v-if="columnVisible.createTime"
|
||||
prop="createTime"
|
||||
label="创建时间"
|
||||
min-width="170"
|
||||
sortable
|
||||
/><el-table-column
|
||||
v-if="columnVisible.updateTime"
|
||||
prop="updateTime"
|
||||
label="更新时间"
|
||||
min-width="170"
|
||||
sortable
|
||||
/>
|
||||
<el-table-column
|
||||
label="操作"
|
||||
width="180"
|
||||
fixed="right"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<el-link
|
||||
v-if="row.importStatus !== 'draft'"
|
||||
type="primary"
|
||||
@click="openDetail(row)"
|
||||
>查看</el-link
|
||||
>
|
||||
<el-link
|
||||
v-if="row.importStatus === 'draft'"
|
||||
type="primary"
|
||||
@click="editBatch(row)"
|
||||
>编辑</el-link
|
||||
>
|
||||
<el-link
|
||||
v-if="row.importStatus === 'draft'"
|
||||
type="danger"
|
||||
@click="removeBatch(row)"
|
||||
>删除</el-link
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="waybill-import-toolbar__pagination">
|
||||
<el-pagination
|
||||
background
|
||||
v-model:current-page="page.current"
|
||||
v-model:page-size="page.size"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:total="page.total"
|
||||
@current-change="loadBatches"
|
||||
@size-change="loadBatches"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
</component>
|
||||
|
||||
<el-dialog
|
||||
v-model="columnSettingVisible"
|
||||
title="列设置"
|
||||
width="360px"
|
||||
append-to-body
|
||||
>
|
||||
<el-checkbox-group v-model="visibleColumnKeys" class="waybill-import-toolbar__column-setting">
|
||||
<el-checkbox v-for="item in columnOptions" :key="item.prop" :label="item.prop">
|
||||
{{ item.label }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<template #footer>
|
||||
<el-button @click="columnSettingVisible = false">关闭</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="detailVisible" title="导入运单详情" width="90%" append-to-body>
|
||||
<el-form :inline="true" :model="detailQuery"
|
||||
><el-form-item label="车牌号/船号"
|
||||
><el-input v-model="detailQuery.vehicleNo" clearable /></el-form-item
|
||||
><el-form-item label="货物名称"
|
||||
><el-input v-model="detailQuery.cargoName" clearable /></el-form-item
|
||||
><el-form-item label="司机/船长姓名"
|
||||
><el-input v-model="detailQuery.driverName" clearable placeholder="请输入" /></el-form-item
|
||||
><el-button type="primary" @click="loadDetails">查询</el-button></el-form
|
||||
>
|
||||
<el-table :data="details" border
|
||||
@@ -126,7 +219,10 @@
|
||||
prop="vehicleNo"
|
||||
label="车牌号/航班号/船号/班列号"
|
||||
min-width="190"
|
||||
/><el-table-column prop="transportType" label="运输方式" width="110" /><el-table-column
|
||||
/><el-table-column prop="transportType" label="运输方式" width="110">
|
||||
<template #default="{ row }">{{ transportTypeLabel(row.transportType) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="driverName"
|
||||
label="司机/船长姓名"
|
||||
min-width="120"
|
||||
@@ -200,17 +296,20 @@
|
||||
prop="waybillIdentifier"
|
||||
label="同一运单标识号"
|
||||
min-width="140"
|
||||
/><el-table-column label="操作" width="80">-</el-table-column></el-table
|
||||
/></el-table
|
||||
>
|
||||
<el-pagination
|
||||
v-model:current-page="detailPage.current"
|
||||
v-model:page-size="detailPage.size"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
:total="detailPage.total"
|
||||
@current-change="loadDetails"
|
||||
@size-change="loadDetails"
|
||||
/>
|
||||
<div class="waybill-import-toolbar__pagination">
|
||||
<el-pagination
|
||||
background
|
||||
v-model:current-page="detailPage.current"
|
||||
v-model:page-size="detailPage.size"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:total="detailPage.total"
|
||||
@current-change="loadDetails"
|
||||
@size-change="loadDetails"
|
||||
/>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<component
|
||||
@@ -506,8 +605,32 @@ const handleClosed = () => emit('closed');
|
||||
const createVisible = ref(props.createPage),
|
||||
detailVisible = ref(false),
|
||||
formRef = ref();
|
||||
const searchVisible = ref(true);
|
||||
const columnSettingVisible = ref(false);
|
||||
const tableSize = ref('default');
|
||||
const tableSizeOptions = ['default', 'large', 'small'];
|
||||
const columnOptions = [
|
||||
{ prop: 'batchNo', label: '运单批次号' },
|
||||
{ prop: 'projectName', label: '项目名称' },
|
||||
{ prop: 'carrierName', label: '承运商' },
|
||||
{ prop: 'carrierType', label: '承运类型' },
|
||||
{ prop: 'waybillCount', label: '运单数' },
|
||||
{ prop: 'importTypeName', label: '导入方式' },
|
||||
{ prop: 'createUserName', label: '创建人' },
|
||||
{ prop: 'statusName', label: '状态' },
|
||||
{ prop: 'createTime', label: '创建时间' },
|
||||
{ prop: 'updateTime', label: '更新时间' },
|
||||
];
|
||||
const visibleColumnKeys = ref(columnOptions.map(item => item.prop));
|
||||
const columnVisible = computed(() =>
|
||||
Object.fromEntries(columnOptions.map(item => [item.prop, visibleColumnKeys.value.includes(item.prop)]))
|
||||
);
|
||||
const toggleTableSize = () => {
|
||||
const index = tableSizeOptions.indexOf(tableSize.value);
|
||||
tableSize.value = tableSizeOptions[(index + 1) % tableSizeOptions.length];
|
||||
};
|
||||
const query = reactive({ batchNo: '', carrierId: '', createUser: '', createTimeRange: [] });
|
||||
const detailQuery = reactive({ vehicleNo: '', cargoName: '' });
|
||||
const detailQuery = reactive({ vehicleNo: '', driverName: '' });
|
||||
const createDefaultForm = () => ({
|
||||
id: '',
|
||||
batchNo: '',
|
||||
@@ -862,6 +985,20 @@ const loadEditorOptions = async () => {
|
||||
cargoTypeFlatOptions.value = flattenCargoTypeOptions(cargoTypeOptions.value);
|
||||
driverOptions.value = extractRecords(driverRes);
|
||||
};
|
||||
const ensureTransportTypeOptions = async () => {
|
||||
if (transportTypeOptions.value.length) return;
|
||||
const dictRes = await getDictionary({ code: 'transport_type' });
|
||||
transportTypeOptions.value = extractRecords(dictRes).map(item => ({
|
||||
label: item.dictValue || item.label,
|
||||
value: item.dictKey || item.value,
|
||||
}));
|
||||
};
|
||||
const transportTypeLabel = value => {
|
||||
if (value === null || value === undefined || value === '') return '-';
|
||||
return (
|
||||
transportTypeOptions.value.find(item => String(item.value) === String(value))?.label || value
|
||||
);
|
||||
};
|
||||
const loadBatches = async () => {
|
||||
const res = await api.getImportBatches({ ...query, current: page.current, size: page.size });
|
||||
batches.value = res.data?.data?.records || [];
|
||||
@@ -922,9 +1059,13 @@ const closeCreate = () => {
|
||||
}
|
||||
createVisible.value = false;
|
||||
};
|
||||
const openDetail = row => {
|
||||
const openDetail = async row => {
|
||||
detailQuery.batchId = row.id;
|
||||
detailQuery.vehicleNo = '';
|
||||
detailQuery.driverName = '';
|
||||
detailPage.current = 1;
|
||||
detailVisible.value = true;
|
||||
await ensureTransportTypeOptions();
|
||||
loadDetails();
|
||||
};
|
||||
// 草稿明细已落库为草稿运单，编辑时回填到明细表，避免重新上传附件。
|
||||
@@ -1329,34 +1470,81 @@ const confirmImport = async () => {
|
||||
|
||||
<style scoped lang="scss">
|
||||
.waybill-import-toolbar {
|
||||
margin-bottom: 12px;
|
||||
|
||||
&__search {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
padding: 18px 18px 8px;
|
||||
margin-bottom: 8px;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.el-form {
|
||||
flex: 1;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
&__search-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 8px 24px;
|
||||
}
|
||||
|
||||
&__search :deep(.el-form-item) {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
&__search :deep(.el-form-item__label) {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__search :deep(.el-input),
|
||||
&__search :deep(.el-select),
|
||||
&__search :deep(.el-date-editor),
|
||||
&__search :deep(.el-date-editor.el-input),
|
||||
&__search :deep(.el-date-editor.el-input__wrapper),
|
||||
&__search :deep(.el-date-editor--datetimerange) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&__search-actions {
|
||||
display: flex;
|
||||
flex: none;
|
||||
justify-content: flex-end;
|
||||
gap: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
&__actions {
|
||||
margin-top: 8px;
|
||||
margin-top: 12px;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
&__column-setting {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
&__table-panel {
|
||||
padding: 0 12px 12px;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
&__pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 16px 0;
|
||||
}
|
||||
|
||||
&__table-panel :deep(.el-table) {
|
||||
--el-table-border-color: #eff1f7;
|
||||
}
|
||||
|
||||
&__table-panel :deep(.el-table__body tr:nth-child(even) > td.el-table__cell),
|
||||
&__table-panel :deep(.el-table__body tr:nth-child(even) > td.el-table-fixed-column--left),
|
||||
&__table-panel :deep(.el-table__body tr:nth-child(even) > td.el-table-fixed-column--right) {
|
||||
background: #fafafa;
|
||||
}
|
||||
}
|
||||
|
||||
.waybill-import-page {
|
||||
min-height: calc(100vh - 120px);
|
||||
padding: 12px 24px 24px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.waybill-import-create {
|
||||
|
||||
@@ -100,9 +100,20 @@
|
||||
</template>
|
||||
|
||||
<template #businessStatus="{ row }">
|
||||
<el-tag :type="statusTagType(row.businessStatus)" class="status-text">
|
||||
{{ displayStatus(row, 'businessStatus') }}
|
||||
</el-tag>
|
||||
<span class="waybill-manage-page__status-cell">
|
||||
<el-tag :type="statusTagType(row.businessStatus)" class="status-text">
|
||||
{{ displayStatus(row, 'businessStatus') }}
|
||||
</el-tag>
|
||||
<el-tooltip
|
||||
v-if="driverRejectReasonText(row)"
|
||||
:content="driverRejectReasonText(row)"
|
||||
placement="top"
|
||||
>
|
||||
<el-icon class="waybill-manage-page__reject-tip-icon">
|
||||
<WarnTriangleFilled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<template #approvalStatus="{ row }">
|
||||
@@ -1569,7 +1580,7 @@
|
||||
<el-link type="primary" v-if="canEdit(row)" @click="openBusinessForm('edit', row)">
|
||||
编辑
|
||||
</el-link>
|
||||
<el-link type="primary" v-if="canReassign(row)" @click="handleAction('reassign', row)">
|
||||
<el-link type="primary" v-if="canReassign(row)" @click="openReassignDrawer(row)">
|
||||
重新派单
|
||||
</el-link>
|
||||
<el-link type="primary" v-if="canCopy(row)" @click="handleCopy(row)"> 复制 </el-link>
|
||||
@@ -1601,6 +1612,87 @@
|
||||
</template>
|
||||
</component>
|
||||
|
||||
<el-drawer
|
||||
v-model="reassignDrawer.visible"
|
||||
title="重新派单"
|
||||
direction="btt"
|
||||
size="280px"
|
||||
append-to-body
|
||||
destroy-on-close
|
||||
class="waybill-manage-page__reassign-drawer"
|
||||
@closed="resetReassignDrawer"
|
||||
>
|
||||
<el-form
|
||||
ref="reassignFormRef"
|
||||
:model="reassignForm"
|
||||
:rules="reassignRules"
|
||||
label-width="72px"
|
||||
class="waybill-manage-page__reassign-form"
|
||||
>
|
||||
<div class="waybill-manage-page__reassign-row">
|
||||
<div class="waybill-manage-page__reassign-meta">
|
||||
<span class="waybill-manage-page__reassign-meta-label">运单号</span>
|
||||
<span class="waybill-manage-page__reassign-meta-value">{{
|
||||
reassignDrawer.row?.waybillNo || '-'
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="waybill-manage-page__reassign-meta waybill-manage-page__reassign-meta--wide">
|
||||
<span class="waybill-manage-page__reassign-meta-label">拒绝原因</span>
|
||||
<span class="waybill-manage-page__reassign-meta-value">{{
|
||||
driverRejectReasonText(reassignDrawer.row) || '-'
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="waybill-manage-page__reassign-row">
|
||||
<el-form-item label="司机" prop="driverName" class="waybill-manage-page__reassign-span-1">
|
||||
<el-autocomplete
|
||||
v-model="reassignForm.driverName"
|
||||
placeholder="请输入"
|
||||
clearable
|
||||
:debounce="300"
|
||||
:fetch-suggestions="fetchReassignDriverSuggestions"
|
||||
:loading="reassignDrawer.driverLoading"
|
||||
style="width: 100%"
|
||||
@select="handleReassignDriverSelect"
|
||||
@change="handleReassignDriverChange"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="手机号"
|
||||
prop="driverPhone"
|
||||
class="waybill-manage-page__reassign-span-1"
|
||||
>
|
||||
<el-input
|
||||
v-model="reassignForm.driverPhone"
|
||||
placeholder="请输入"
|
||||
clearable
|
||||
maxlength="20"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="车牌号" prop="vehicleNo" class="waybill-manage-page__reassign-span-1">
|
||||
<el-input
|
||||
v-model="reassignForm.vehicleNo"
|
||||
placeholder="请输入车牌号"
|
||||
clearable
|
||||
maxlength="30"
|
||||
/>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="waybill-manage-page__reassign-footer">
|
||||
<el-button @click="reassignDrawer.visible = false">取消</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
:loading="reassignDrawer.submitting"
|
||||
@click="submitReassign"
|
||||
>
|
||||
确认派单
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-drawer>
|
||||
|
||||
<el-dialog
|
||||
v-model="mileageDialog.visible"
|
||||
width="520px"
|
||||
@@ -1934,15 +2026,88 @@
|
||||
<section-card title="执行详情">
|
||||
<el-tabs v-model="waybillProcessDetailTab" type="border-card">
|
||||
<el-tab-pane label="打卡详情" name="punch">
|
||||
<el-timeline v-if="waybillDetailProcessNodes.length">
|
||||
<el-timeline-item
|
||||
v-for="(node, index) in waybillDetailProcessNodes"
|
||||
:key="node.key || index"
|
||||
:timestamp="node.time || ''"
|
||||
>{{ node.name || node.nodeName || node.label }}</el-timeline-item
|
||||
>
|
||||
</el-timeline>
|
||||
<el-empty v-else description="暂无打卡详情" :image-size="50" />
|
||||
<div v-loading="waybillPunchRecordsLoading">
|
||||
<el-timeline v-if="waybillPunchRecords.length">
|
||||
<el-timeline-item
|
||||
v-for="(record, index) in waybillPunchRecords"
|
||||
:key="record.nodeCode || record.id || index"
|
||||
:timestamp="record.punchTime || record.statusName || '未打卡'"
|
||||
:type="record.punched ? 'primary' : 'info'"
|
||||
:color="record.punched ? '#2b6ce8' : '#c0c4cc'"
|
||||
placement="top"
|
||||
>
|
||||
<div class="waybill-manage-page__punch-record">
|
||||
<div class="waybill-manage-page__punch-record-title">
|
||||
{{ record.nodeName || record.nodeCode || '打卡' }}
|
||||
<el-tag
|
||||
:type="record.punched ? 'success' : 'info'"
|
||||
size="small"
|
||||
effect="plain"
|
||||
>{{ record.statusName || (record.punched ? '已打卡' : '未打卡') }}</el-tag
|
||||
>
|
||||
<el-tag
|
||||
v-if="record.type === 'enroute'"
|
||||
size="small"
|
||||
type="info"
|
||||
effect="plain"
|
||||
>在途</el-tag
|
||||
>
|
||||
<el-tag
|
||||
v-if="record.exceptionFlag"
|
||||
size="small"
|
||||
type="danger"
|
||||
effect="plain"
|
||||
>异常</el-tag
|
||||
>
|
||||
</div>
|
||||
<template v-if="record.punched">
|
||||
<div
|
||||
v-if="record.address"
|
||||
class="waybill-manage-page__punch-record-line"
|
||||
>
|
||||
地点：{{ record.address }}
|
||||
</div>
|
||||
<div
|
||||
v-if="record.weight || record.volume || record.quantity"
|
||||
class="waybill-manage-page__punch-record-line"
|
||||
>
|
||||
<span v-if="record.weight">重量 {{ record.weight }}吨</span>
|
||||
<span v-if="record.volume">体积 {{ record.volume }}方</span>
|
||||
<span v-if="record.quantity">数量 {{ record.quantity }}</span>
|
||||
</div>
|
||||
<div
|
||||
v-if="record.remark"
|
||||
class="waybill-manage-page__punch-record-line"
|
||||
>
|
||||
备注：{{ record.remark }}
|
||||
</div>
|
||||
<div
|
||||
v-if="record.photos && record.photos.length"
|
||||
class="waybill-manage-page__punch-record-photos"
|
||||
>
|
||||
<div
|
||||
v-for="(photo, pi) in record.photos"
|
||||
:key="`${record.nodeCode || index}-${pi}`"
|
||||
class="waybill-manage-page__driver-upload-item"
|
||||
@click="previewDriverUploadPhoto(record.photos, pi)"
|
||||
>
|
||||
<el-image :src="photo.url" fit="cover" lazy />
|
||||
<div class="waybill-manage-page__driver-upload-label">
|
||||
{{ photo.label || `${record.nodeName}-凭证` }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div v-else class="waybill-manage-page__punch-record-line">暂未打卡</div>
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
<el-empty
|
||||
v-else-if="!waybillPunchRecordsLoading"
|
||||
description="暂无打卡记录"
|
||||
:image-size="50"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane
|
||||
v-if="waybillHasRelatedVoucher"
|
||||
@@ -2012,9 +2177,30 @@
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<!-- <el-tab-pane label="司机上传" name="driverUpload">
|
||||
<el-empty description="暂无司机上传数据" :image-size="50" />
|
||||
</el-tab-pane> -->
|
||||
<el-tab-pane label="司机上传" name="driverUpload">
|
||||
<div
|
||||
v-loading="waybillPunchRecordsLoading"
|
||||
class="waybill-manage-page__driver-upload-grid"
|
||||
>
|
||||
<div
|
||||
v-for="(photo, index) in waybillDriverUploads"
|
||||
:key="`${photo.url}-${index}`"
|
||||
class="waybill-manage-page__driver-upload-item"
|
||||
:title="photo.label"
|
||||
@click="previewDriverUploadPhoto(waybillDriverUploads, index)"
|
||||
>
|
||||
<el-image :src="photo.url" fit="cover" lazy />
|
||||
<div class="waybill-manage-page__driver-upload-label">
|
||||
{{ photo.label || '凭证' }}
|
||||
</div>
|
||||
</div>
|
||||
<el-empty
|
||||
v-if="!waybillPunchRecordsLoading && !waybillDriverUploads.length"
|
||||
description="暂无司机上传数据"
|
||||
:image-size="50"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</section-card>
|
||||
<section-card title="物流轨迹">
|
||||
@@ -2837,6 +3023,7 @@ import {
|
||||
getList as getProcessConfigList,
|
||||
getVoucherImages as getProcessConfigVoucherImages,
|
||||
} from '@/api/business/process-config';
|
||||
import { getPunchRecords as getWaybillPunchRecords } from '@/api/business/waybill-manage';
|
||||
import { getList as getDriverList } from '@/api/transportCapacity/driver';
|
||||
import { getDictionary } from '@/api/system/dictbiz';
|
||||
import { getDictionary as getSystemDictionary } from '@/api/system/dict';
|
||||
@@ -2848,7 +3035,7 @@ import { openImportDialog } from '@/utils/import-excel';
|
||||
import { applyTableMenuWidth } from '@/utils/table-menu';
|
||||
import { downloadFileByUrl, downloadXls } from '@/utils/util';
|
||||
import { isMobile } from '@/utils/validate';
|
||||
import { InfoFilled, Location, OfficeBuilding, Rank, Search } from '@element-plus/icons-vue';
|
||||
import { InfoFilled, Location, OfficeBuilding, Rank, Search, WarnTriangleFilled } from '@element-plus/icons-vue';
|
||||
import { ElImageViewer } from 'element-plus';
|
||||
import { OpenFileViewer } from '@open-file-viewer/vue';
|
||||
import {
|
||||
@@ -3023,6 +3210,7 @@ export default {
|
||||
PageAvueForm,
|
||||
PageDetail,
|
||||
InfoFilled,
|
||||
WarnTriangleFilled,
|
||||
Rank,
|
||||
ElImageViewer,
|
||||
OpenFileViewer,
|
||||
@@ -3079,6 +3267,9 @@ export default {
|
||||
detailLoading: false,
|
||||
detailRow: {},
|
||||
waybillDetailProcessNodes: [],
|
||||
waybillPunchRecords: [],
|
||||
waybillDriverUploads: [],
|
||||
waybillPunchRecordsLoading: false,
|
||||
waybillProcessDetailTab: 'punch',
|
||||
waybillHasRelatedVoucher: false,
|
||||
waybillVoucherImages: [],
|
||||
@@ -3100,6 +3291,41 @@ export default {
|
||||
submitting: false,
|
||||
row: null,
|
||||
},
|
||||
reassignDrawer: {
|
||||
visible: false,
|
||||
submitting: false,
|
||||
driverLoading: false,
|
||||
row: null,
|
||||
},
|
||||
reassignForm: {
|
||||
id: '',
|
||||
driverId: '',
|
||||
driverName: '',
|
||||
driverPhone: '',
|
||||
vehicleNo: '',
|
||||
},
|
||||
reassignDriverOptions: [],
|
||||
reassignRules: {
|
||||
driverName: [{ required: true, message: '请选择司机', trigger: 'change' }],
|
||||
driverPhone: [
|
||||
{ required: true, message: '请输入手机号', trigger: 'blur' },
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value) {
|
||||
callback();
|
||||
return;
|
||||
}
|
||||
if (!isMobile(value)) {
|
||||
callback(new Error('请输入正确的手机号'));
|
||||
return;
|
||||
}
|
||||
callback();
|
||||
},
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
vehicleNo: [{ required: true, message: '请输入车牌号', trigger: 'blur' }],
|
||||
},
|
||||
mileageForm: {
|
||||
id: '',
|
||||
mileage: '',
|
||||
@@ -3602,6 +3828,7 @@ export default {
|
||||
},
|
||||
waybillProcessDetailTab(tab) {
|
||||
if (tab === 'batchSupplement') this.loadWaybillVoucherImages();
|
||||
if (tab === 'punch' || tab === 'driverUpload') this.loadWaybillPunchRecords();
|
||||
},
|
||||
'form.transportType'(value, oldValue) {
|
||||
if (!this.shippingInfoFormEnabled || this.suppressTransportTypeClear) return;
|
||||
@@ -3884,7 +4111,7 @@ export default {
|
||||
return false;
|
||||
}
|
||||
const status = this.statusValue(row);
|
||||
return ['pending', 'processing'].includes(status);
|
||||
return ['pending', 'processing', 'running'].includes(status);
|
||||
},
|
||||
canComplete(row) {
|
||||
if (
|
||||
@@ -3896,7 +4123,7 @@ export default {
|
||||
return false;
|
||||
}
|
||||
const status = this.statusValue(row);
|
||||
return status === 'processing';
|
||||
return status === 'processing' || status === 'running';
|
||||
},
|
||||
canMaintainMileage(row) {
|
||||
return (
|
||||
@@ -4060,7 +4287,7 @@ export default {
|
||||
if (!row) return '-';
|
||||
if (prop === 'businessStatus') return this.displayStatus(row, prop);
|
||||
if (prop === 'feeGenerationMode') {
|
||||
return row[prop] === 'manual' ? '手动生成' : '系统生成';
|
||||
return row[prop] === 'manual' ? '账单导入生成' : '系统生成';
|
||||
}
|
||||
const column = this.findColumn(this.option.column, prop);
|
||||
if (column?.formatter) return column.formatter(row, {}, row[prop]);
|
||||
@@ -4151,7 +4378,9 @@ export default {
|
||||
waybillAmountWithCurrency(row = {}, prop) {
|
||||
const value = this.formatDetailValue(row, prop);
|
||||
if (value === '-') return { value: '-' };
|
||||
return { value: `${this.waybillCurrencyRemark(row)}${value}` };
|
||||
const number = Number(value);
|
||||
const display = Number.isFinite(number) ? number.toFixed(2) : value;
|
||||
return { value: `${this.waybillCurrencyRemark(row)}${display}` };
|
||||
},
|
||||
openDetail(row) {
|
||||
if (!this.isStandaloneWaybillDetailPage) {
|
||||
@@ -4163,6 +4392,9 @@ export default {
|
||||
this.detailRow = { ...row };
|
||||
this.waybillProcessDetailTab = 'punch';
|
||||
this.waybillHasRelatedVoucher = false;
|
||||
this.waybillDetailProcessNodes = [];
|
||||
this.waybillPunchRecords = [];
|
||||
this.waybillDriverUploads = [];
|
||||
this.waybillVoucherImages = [];
|
||||
this.waybillVoucherFolders = [];
|
||||
this.waybillVoucherFolder = null;
|
||||
@@ -4176,6 +4408,7 @@ export default {
|
||||
.then(res => {
|
||||
const detail = res?.data?.data || res?.data || row;
|
||||
this.detailRow = detail;
|
||||
this.loadWaybillPunchRecords();
|
||||
this.loadWaybillVoucherImages();
|
||||
if (detail.contractId) {
|
||||
return getContractDetail(detail.contractId)
|
||||
@@ -4259,6 +4492,37 @@ export default {
|
||||
})
|
||||
.catch(() => []);
|
||||
},
|
||||
loadWaybillPunchRecords() {
|
||||
const waybillId = this.detailRow?.id;
|
||||
if (!waybillId || this.waybillPunchRecordsLoading) return;
|
||||
this.waybillPunchRecordsLoading = true;
|
||||
const request =
|
||||
typeof this.api.getPunchRecords === 'function'
|
||||
? this.api.getPunchRecords(waybillId)
|
||||
: getWaybillPunchRecords(waybillId);
|
||||
request
|
||||
.then(res => {
|
||||
const data = res?.data?.data || res?.data || {};
|
||||
this.waybillPunchRecords = Array.isArray(data.records) ? data.records : [];
|
||||
this.waybillDriverUploads = Array.isArray(data.driverUploads)
|
||||
? data.driverUploads
|
||||
: [];
|
||||
})
|
||||
.catch(() => {
|
||||
this.waybillPunchRecords = [];
|
||||
this.waybillDriverUploads = [];
|
||||
})
|
||||
.finally(() => {
|
||||
this.waybillPunchRecordsLoading = false;
|
||||
});
|
||||
},
|
||||
previewDriverUploadPhoto(photos, index) {
|
||||
const list = (photos || []).map(item => item?.url).filter(Boolean);
|
||||
if (!list.length) return;
|
||||
this.attachmentImagePreviewUrls = list;
|
||||
this.attachmentImagePreviewIndex = Math.min(Math.max(Number(index) || 0, 0), list.length - 1);
|
||||
this.attachmentImagePreviewVisible = true;
|
||||
},
|
||||
loadWaybillVoucherImages() {
|
||||
if (
|
||||
!this.detailRow.id ||
|
||||
@@ -4534,6 +4798,13 @@ export default {
|
||||
},
|
||||
normalizeRow(row, saveAsDraft = false) {
|
||||
const submitRow = { ...row };
|
||||
const isAddMode =
|
||||
this.crudDialogType === 'add' ||
|
||||
(this.isStandaloneWaybillFormPage && this.$route.query.mode === 'add');
|
||||
if (isAddMode) {
|
||||
delete submitRow.id;
|
||||
delete submitRow.waybillNo;
|
||||
}
|
||||
const skipValidation = saveAsDraft && this.config.skipDraftValidation === true;
|
||||
if (
|
||||
!skipValidation &&
|
||||
@@ -4901,18 +5172,28 @@ export default {
|
||||
if (type === 'add' && copyId) {
|
||||
this.api.getDetail(copyId).then(res => {
|
||||
const sourceData = res.data.data || {};
|
||||
// 清除不应该复制的字段
|
||||
// 清除不应该复制的字段（业务状态与原运单保持一致）
|
||||
delete sourceData.id;
|
||||
delete sourceData.code;
|
||||
delete sourceData.waybillNo;
|
||||
delete sourceData.waybillStatus;
|
||||
delete sourceData.driverAcceptStatus;
|
||||
delete sourceData.driverAcceptTime;
|
||||
delete sourceData.driverAcceptDriverId;
|
||||
delete sourceData.driverRejectTime;
|
||||
delete sourceData.driverRejectReason;
|
||||
delete sourceData.loadingNo;
|
||||
delete sourceData.masterNo;
|
||||
delete sourceData.createTime;
|
||||
delete sourceData.updateTime;
|
||||
delete sourceData.createUser;
|
||||
delete sourceData.updateUser;
|
||||
delete sourceData.createDept;
|
||||
delete sourceData.createUserName;
|
||||
delete sourceData.updateUserName;
|
||||
|
||||
this.applyFormDetail(sourceData);
|
||||
// 标记为手工创建
|
||||
// 标记为手工创建；业务状态沿用原运单
|
||||
this.form.dataSource = '手工创建';
|
||||
done();
|
||||
});
|
||||
@@ -4974,6 +5255,10 @@ export default {
|
||||
['quantity', 'mileage', 'unitPrice'].forEach(prop => {
|
||||
if (Number(this.form[prop]) === -1) this.form[prop] = '';
|
||||
});
|
||||
if ([this.form.planId, this.form.planName].some(value => Number(value) === -1)) {
|
||||
this.form.planId = '';
|
||||
this.form.planName = '';
|
||||
}
|
||||
this.form.mileage = this.normalizeMileageValue(this.form.mileage);
|
||||
this.$nextTick(() => {
|
||||
this.suppressTransportTypeClear = false;
|
||||
@@ -7813,6 +8098,10 @@ export default {
|
||||
this.$refs.mileageFormRef?.clearValidate();
|
||||
},
|
||||
handleAction(action, row) {
|
||||
if (action === 'reassign') {
|
||||
this.openReassignDrawer(row);
|
||||
return;
|
||||
}
|
||||
const actionName = {
|
||||
enable: '启用',
|
||||
disable: '停用',
|
||||
@@ -7831,6 +8120,113 @@ export default {
|
||||
this.onLoad(this.page, this.query);
|
||||
});
|
||||
},
|
||||
driverRejectReasonText(row) {
|
||||
if (!row) return '';
|
||||
if (typeof this.config.getDriverRejectReason === 'function') {
|
||||
return this.config.getDriverRejectReason(row) || '';
|
||||
}
|
||||
return String(
|
||||
row.driverRejectReason ||
|
||||
row.driverRefuseReason ||
|
||||
row.acceptRejectReason ||
|
||||
row.rejectReason ||
|
||||
''
|
||||
).trim();
|
||||
},
|
||||
openReassignDrawer(row) {
|
||||
if (!row?.id) return;
|
||||
this.reassignDrawer.row = row;
|
||||
this.reassignForm = {
|
||||
id: row.id,
|
||||
driverId: '',
|
||||
driverName: '',
|
||||
driverPhone: '',
|
||||
vehicleNo: '',
|
||||
};
|
||||
this.reassignDrawer.visible = true;
|
||||
this.$nextTick(() => this.$refs.reassignFormRef?.clearValidate());
|
||||
},
|
||||
resetReassignDrawer() {
|
||||
this.reassignDrawer.row = null;
|
||||
this.reassignDrawer.submitting = false;
|
||||
this.reassignDrawer.driverLoading = false;
|
||||
this.reassignForm = {
|
||||
id: '',
|
||||
driverId: '',
|
||||
driverName: '',
|
||||
driverPhone: '',
|
||||
vehicleNo: '',
|
||||
};
|
||||
this.reassignDriverOptions = [];
|
||||
this.$refs.reassignFormRef?.clearValidate();
|
||||
},
|
||||
fetchReassignDriverSuggestions(queryString, callback) {
|
||||
const keyword = String(queryString || '').trim();
|
||||
this.reassignDrawer.driverLoading = true;
|
||||
getDriverList(1, 20, { ...(keyword ? { driverName: keyword } : {}), posts: '司机' })
|
||||
.then(res => {
|
||||
const records = extractRecords(res);
|
||||
this.reassignDriverOptions = records;
|
||||
callback(
|
||||
records.map(item => ({
|
||||
...item,
|
||||
value: item.driverName || item.name || '',
|
||||
}))
|
||||
);
|
||||
})
|
||||
.catch(error => {
|
||||
window.console.log(error);
|
||||
callback([]);
|
||||
})
|
||||
.finally(() => {
|
||||
this.reassignDrawer.driverLoading = false;
|
||||
});
|
||||
},
|
||||
handleReassignDriverSelect(item = {}) {
|
||||
const value = item.driverName || item.name || '';
|
||||
const driverPhone = item.mobile || item.phone || item.driverPhone || '';
|
||||
const drivingVehicle = String(item.drivingVehicle || '').trim();
|
||||
this.reassignForm.driverId = item.id || '';
|
||||
this.reassignForm.driverName = value;
|
||||
if (driverPhone) this.reassignForm.driverPhone = driverPhone;
|
||||
if (drivingVehicle) this.reassignForm.vehicleNo = drivingVehicle;
|
||||
},
|
||||
handleReassignDriverChange(value) {
|
||||
const driver = this.reassignDriverOptions.find(item =>
|
||||
[item.driverName, item.name].some(name => String(name || '') === String(value || ''))
|
||||
);
|
||||
this.reassignForm.driverId = driver?.id || '';
|
||||
this.reassignForm.driverName = value || '';
|
||||
if (driver) {
|
||||
this.reassignForm.driverPhone =
|
||||
driver.mobile || driver.phone || driver.driverPhone || this.reassignForm.driverPhone || '';
|
||||
if (String(driver.drivingVehicle || '').trim()) {
|
||||
this.reassignForm.vehicleNo = String(driver.drivingVehicle).trim();
|
||||
}
|
||||
}
|
||||
},
|
||||
submitReassign() {
|
||||
this.$refs.reassignFormRef?.validate(valid => {
|
||||
if (!valid) return;
|
||||
this.reassignDrawer.submitting = true;
|
||||
this.api
|
||||
.reassign({
|
||||
id: this.reassignForm.id,
|
||||
driverId: this.reassignForm.driverId || null,
|
||||
driverName: String(this.reassignForm.driverName || '').trim(),
|
||||
driverPhone: String(this.reassignForm.driverPhone || '').trim(),
|
||||
vehicleNo: String(this.reassignForm.vehicleNo || '').trim(),
|
||||
})
|
||||
.then(() => {
|
||||
this.$message.success('重新派单成功');
|
||||
this.reassignDrawer.visible = false;
|
||||
this.onLoad(this.page, this.query);
|
||||
})
|
||||
.finally(() => {
|
||||
this.reassignDrawer.submitting = false;
|
||||
});
|
||||
});
|
||||
},
|
||||
handleCustomOperation(operation, row) {
|
||||
if (operation.action === 'createFromTemplate') {
|
||||
this.api.getDetail(row.id).then(res => {
|
||||
@@ -7933,7 +8329,7 @@ export default {
|
||||
}
|
||||
const unavailableWaybills = this.selectionList.filter(
|
||||
row =>
|
||||
this.statusValue(row) !== 'pending' ||
|
||||
!['processing', 'running'].includes(this.statusValue(row)) ||
|
||||
row.loadingId ||
|
||||
row.loadingManageId ||
|
||||
row.loadingNo
|
||||
@@ -9075,6 +9471,63 @@ export default {
|
||||
min-height: 120px;
|
||||
}
|
||||
|
||||
&__punch-record {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
&__punch-record-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
&__punch-record-line {
|
||||
font-size: 13px;
|
||||
color: #606266;
|
||||
|
||||
span + span {
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
&__punch-record-photos,
|
||||
&__driver-upload-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, minmax(0, 1fr));
|
||||
gap: 10px;
|
||||
margin-top: 4px;
|
||||
min-height: 80px;
|
||||
}
|
||||
|
||||
&__driver-upload-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
cursor: pointer;
|
||||
|
||||
.el-image {
|
||||
display: block;
|
||||
width: 100%;
|
||||
aspect-ratio: 1;
|
||||
border: 1px solid #eff1f7;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
&__driver-upload-label {
|
||||
font-size: 12px;
|
||||
line-height: 1.4;
|
||||
color: #606266;
|
||||
text-align: center;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
&__voucher-image-item {
|
||||
position: relative;
|
||||
aspect-ratio: 1;
|
||||
@@ -9456,6 +9909,78 @@ export default {
|
||||
:global(.waybill-manage-page__mileage-dialog .waybill-manage-page__mileage-form .el-textarea) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.waybill-manage-page__status-cell {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.waybill-manage-page__reject-tip-icon {
|
||||
color: #e6a23c;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
:global(.waybill-manage-page__reassign-drawer .el-drawer__body) {
|
||||
padding: 12px 20px 0;
|
||||
}
|
||||
|
||||
:global(.waybill-manage-page__reassign-drawer .waybill-manage-page__reassign-form) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.waybill-manage-page__reassign-row {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
column-gap: 16px;
|
||||
row-gap: 8px;
|
||||
margin-bottom: 12px;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.waybill-manage-page__reassign-span-1 {
|
||||
grid-column: span 1;
|
||||
margin-bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.waybill-manage-page__reassign-meta {
|
||||
grid-column: span 1;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
min-width: 0;
|
||||
line-height: 32px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.waybill-manage-page__reassign-meta--wide {
|
||||
grid-column: span 3;
|
||||
}
|
||||
|
||||
.waybill-manage-page__reassign-meta-label {
|
||||
flex: none;
|
||||
width: 72px;
|
||||
color: #606266;
|
||||
text-align: right;
|
||||
padding-right: 12px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.waybill-manage-page__reassign-meta-value {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
color: #303133;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.waybill-manage-page__reassign-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.el-input__icon {
|
||||
color: #1e90ff !important;
|
||||
}
|
||||
|
||||
@@ -1,48 +1,203 @@
|
||||
<template>
|
||||
<basic-container class="contract-change-page">
|
||||
<div class="archive-page-form__title">{{ pageTitle }}</div>
|
||||
<el-form ref="formRef" :model="form" :rules="rules" label-position="right" label-width="auto" class="contract-change-form">
|
||||
<section class="change-section contract-basic-section">
|
||||
<div class="dialog-section-title">基本信息</div>
|
||||
<div class="contract-basic-section__grid">
|
||||
<el-form-item label="变更类型" class="contract-basic-section__change-type"><el-radio-group v-model="form.changeType"><el-radio label="合同信息变更" /><el-radio label="终止合同" /></el-radio-group></el-form-item>
|
||||
<el-form-item label="合同编号"><el-input v-model="form.contractNo" disabled /></el-form-item>
|
||||
<el-form-item label="合同名称" prop="contractName"><el-input v-model="form.contractName" /></el-form-item>
|
||||
<el-form-item label="合同类型"><el-select v-model="form.contractCategory" disabled><el-option label="客户合同" value="客户合同" /><el-option label="承运商合同" value="承运商合同" /></el-select></el-form-item>
|
||||
<el-form-item label="甲方"><el-input v-model="form.partyA" disabled /></el-form-item>
|
||||
<el-form-item label="乙方"><el-input v-model="form.partyB" disabled /></el-form-item>
|
||||
<el-form-item label="所属项目"><el-input v-model="form.projectName" disabled /></el-form-item>
|
||||
<el-form-item label="变更类型" class="contract-basic-section__change-type">
|
||||
<el-radio-group v-model="form.changeType">
|
||||
<el-radio label="合同信息变更" />
|
||||
<el-radio label="终止合同" />
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="签约类型" prop="signType">
|
||||
<el-select v-model="form.signType" placeholder="请选择签约类型" clearable>
|
||||
<el-option
|
||||
v-for="item in signTypeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同编号">
|
||||
<el-input v-model="form.contractNo" disabled />
|
||||
</el-form-item>
|
||||
<el-form-item label="合同名称" prop="contractName">
|
||||
<el-input
|
||||
v-model="form.contractName"
|
||||
maxlength="100"
|
||||
show-word-limit
|
||||
placeholder="请输入合同名称"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同类型">
|
||||
<el-select v-model="form.contractCategory" disabled>
|
||||
<el-option
|
||||
v-for="item in contractCategoryOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="项目">
|
||||
<el-input v-model="form.projectName" disabled />
|
||||
</el-form-item>
|
||||
<el-form-item label="所属组织">
|
||||
<el-input v-model="form.organizationName" disabled />
|
||||
</el-form-item>
|
||||
<el-form-item label="甲方">
|
||||
<el-input v-model="form.partyA" disabled />
|
||||
</el-form-item>
|
||||
<el-form-item label="乙方">
|
||||
<el-input v-model="form.partyB" disabled />
|
||||
</el-form-item>
|
||||
<el-form-item label="签订日期">
|
||||
<el-date-picker
|
||||
v-model="form.signDate"
|
||||
type="date"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同期限">
|
||||
<div class="contract-basic-section__date-range">
|
||||
<el-date-picker v-model="period[0]" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="YYYY-MM-DD" />
|
||||
<el-date-picker
|
||||
v-model="period[0]"
|
||||
type="date"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="YYYY-MM-DD"
|
||||
/>
|
||||
<span>至</span>
|
||||
<el-date-picker v-model="period[1]" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="YYYY-MM-DD" />
|
||||
<el-date-picker
|
||||
v-model="period[1]"
|
||||
type="date"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="YYYY-MM-DD"
|
||||
/>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属组织"><el-input v-model="form.organizationName" disabled /></el-form-item>
|
||||
<el-form-item label="签订日期"><el-date-picker v-model="form.signDate" type="date" value-format="YYYY-MM-DD" disabled /></el-form-item>
|
||||
<el-form-item label="合同格式"><el-select v-model="form.contractFormat"><el-option label="电子合同" value="电子合同" /><el-option label="纸质合同" value="纸质合同" /></el-select></el-form-item>
|
||||
<el-form-item label="结算方式"><el-input v-model="form.settlementMode" /></el-form-item>
|
||||
<el-form-item label="是否需要加盖法人章"><el-select v-model="form.legalSealFlag"><el-option label="是" :value="1" /><el-option label="否" :value="0" /></el-select></el-form-item>
|
||||
<el-form-item label="一式（份）"><el-input v-model="form.copyCount" inputmode="numeric" maxlength="9" placeholder="请输入" @input="value => positiveIntegerInput('copyCount', value)" /></el-form-item>
|
||||
<el-form-item label="回款账期"><el-input v-model="form.paymentDays" inputmode="numeric" maxlength="9" placeholder="请输入" @input="value => positiveIntegerInput('paymentDays', value)" /></el-form-item>
|
||||
<el-form-item label="回款账期">
|
||||
<el-input
|
||||
v-model="form.paymentDays"
|
||||
placeholder="请输入"
|
||||
@input="value => positiveIntegerInput('paymentDays', value)"
|
||||
>
|
||||
<template #suffix>天</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同金额">
|
||||
<el-input-number
|
||||
v-model="form.contractAmount"
|
||||
:min="0"
|
||||
:precision="2"
|
||||
:controls="false"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否范本">
|
||||
<el-select v-model="form.templateFlag" placeholder="请选择">
|
||||
<el-option label="否" :value="0" />
|
||||
<el-option label="是" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="原件合同编号">
|
||||
<el-input v-model="form.originalContractNo" maxlength="100" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="是否电子章">
|
||||
<el-select v-model="form.electronicSealFlag" placeholder="请选择">
|
||||
<el-option label="否" :value="0" />
|
||||
<el-option label="是" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="开票周期">
|
||||
<el-input
|
||||
v-model="form.invoiceCycle"
|
||||
placeholder="请输入"
|
||||
@input="value => positiveIntegerInput('invoiceCycle', value)"
|
||||
>
|
||||
<template #suffix>天</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="结算币种" prop="settlementCurrency">
|
||||
<el-select v-model="form.settlementCurrency" placeholder="请选择结算币种" clearable>
|
||||
<el-option
|
||||
v-for="item in settlementCurrencyOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同格式">
|
||||
<el-select v-model="form.contractFormat" placeholder="请选择合同格式" clearable>
|
||||
<el-option
|
||||
v-for="item in contractFormatOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="一式">
|
||||
<el-input
|
||||
v-model="form.copyCount"
|
||||
placeholder="请输入"
|
||||
@input="value => positiveIntegerInput('copyCount', value)"
|
||||
>
|
||||
<template #suffix>份</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否需要加盖法人章">
|
||||
<el-select v-model="form.legalSealFlag" placeholder="请选择">
|
||||
<el-option label="否" :value="0" />
|
||||
<el-option label="是" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="结算方式">
|
||||
<el-select v-model="form.settlementMode" placeholder="请选择结算方式" clearable>
|
||||
<el-option
|
||||
v-for="item in settlementModeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="经办人">
|
||||
<el-input v-model="form.handlerUserName" disabled />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item label="备注" class="contract-basic-section__remark"><el-input v-model="form.remark" type="textarea" :rows="2" maxlength="2000" show-word-limit placeholder="请输入备注" /></el-form-item>
|
||||
<el-form-item label="备注" class="contract-basic-section__remark">
|
||||
<el-input
|
||||
v-model="form.remark"
|
||||
type="textarea"
|
||||
:rows="2"
|
||||
maxlength="200"
|
||||
show-word-limit
|
||||
placeholder="请输入备注"
|
||||
/>
|
||||
</el-form-item>
|
||||
</section>
|
||||
|
||||
<section class="change-section">
|
||||
<div class="section-head">
|
||||
<div class="dialog-section-title">合同文件</div>
|
||||
<el-button type="primary" :disabled="!contractFileRows.length" @click="handleContractFileBatchDownload">批量下载</el-button>
|
||||
</div>
|
||||
<el-table :data="contractFileRows" border class="change-table" @selection-change="selectedContractFiles = $event"><el-table-column type="selection" width="55" /><el-table-column type="index" label="序号" width="70" /><el-table-column label="文件名" min-width="240"><template #default="{ row }"><el-link type="primary" @click="previewAttachment(row, contractFileRows)">{{ row.originalName || row.name }}</el-link></template></el-table-column><el-table-column label="文件大小" width="120"><template #default="{ row }">{{ formatFileSize(row.size) }}</template></el-table-column><el-table-column prop="uploadUserName" label="上传人" width="140" /><el-table-column prop="uploadTime" label="上传时间" width="170" /><el-table-column label="操作" width="100"><template #default="{ $index }"><el-link type="danger" @click="removeContractFile($index)">删除</el-link></template></el-table-column></el-table>
|
||||
<div class="attachment-upload">
|
||||
<vehicle-attachment-upload v-model="contractFileRows" :readonly="false" :file-types="attachmentFileTypes" :max-size="50" :show-file-list="false" button-text="上传附件" @change="handleContractFileChange" />
|
||||
</div>
|
||||
</section>
|
||||
<contract-attachment-section
|
||||
title="合同文件"
|
||||
description
|
||||
attachment-type
|
||||
use-upload-dialog
|
||||
:rows="contractFileRows"
|
||||
:preview="previewAttachment"
|
||||
@update:rows="contractFileRows = $event"
|
||||
/>
|
||||
|
||||
<section class="change-section">
|
||||
<div class="section-head"><div class="dialog-section-title">计费信息</div><el-button type="primary" plain @click="addPlan">添加</el-button></div>
|
||||
<el-radio-group v-model="feeGenerationMode"><el-radio label="system">系统生成</el-radio><el-radio label="manual">手动生成</el-radio></el-radio-group>
|
||||
<el-radio-group v-model="feeGenerationMode"><el-radio label="system">系统生成</el-radio><el-radio label="manual">账单导入生成</el-radio></el-radio-group>
|
||||
<el-table :data="plans" border class="change-table"><el-table-column type="index" label="序号" width="70" /><el-table-column prop="planName" label="方案名称" min-width="220" /><el-table-column label="默认方案" min-width="120"><template #default="{ row }">{{ row.defaultPlan ? '是' : '否' }}</template></el-table-column><el-table-column prop="remark" label="备注" min-width="260" /><el-table-column label="操作" width="180"><template #default="{ row, $index }"><el-link type="primary" @click="editPlan(row, $index)">编辑</el-link><el-link type="danger" @click="plans.splice($index, 1)">删除</el-link></template></el-table-column></el-table>
|
||||
</section>
|
||||
|
||||
@@ -65,10 +220,17 @@
|
||||
<el-form v-if="settlementRule.autoGenerate === 1" :model="settlementRule" label-position="right" label-width="auto" class="settlement-form">
|
||||
<el-form-item label="账单起始日期" required><el-date-picker v-model="settlementRule.billStartDate" type="date" placeholder="请选择账单起始日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD" /></el-form-item>
|
||||
<el-form-item label="结算类型" required><el-select v-model="settlementRule.settlementType" placeholder="请选择结算类型" @change="handleSettlementTypeChange"><el-option v-for="item in settlementTypeOptions" :key="item" :label="item" :value="item" /></el-select></el-form-item>
|
||||
<el-form-item v-if="showSettlementBillCycleType" label="账单周期类型" required><el-select v-model="settlementRule.billCycleType" placeholder="请选择账单周期类型" @change="handleCycleTypeChange"><el-option v-for="item in billCycleTypeOptions" :key="item" :label="item" :value="item" /></el-select></el-form-item>
|
||||
<el-form-item v-if="showSettlementBillCycleType" label="结算周期" required><el-select v-model="settlementRule.billCycleType" placeholder="请选择结算周期" @change="handleCycleTypeChange"><el-option v-for="item in billCycleTypeOptions" :key="item" :label="item" :value="item" /></el-select></el-form-item>
|
||||
<el-form-item v-if="showSettlementBillCutoffDay" label="账单截单日" required><el-select v-model="settlementRule.billCutoffDay" placeholder="请选择账单截单日"><el-option v-for="item in billCutoffDayOptions" :key="item.value" :label="item.label" :value="item.value" /></el-select></el-form-item>
|
||||
<el-form-item v-if="showSettlementCycleDays" label="周期天数" required><el-select v-model="settlementRule.cycleDays" placeholder="请选择周期天数"><el-option v-for="item in cycleDayOptions" :key="item.value" :label="item.label" :value="item.value" /></el-select></el-form-item>
|
||||
</el-form>
|
||||
<el-table v-if="settlementRule.autoGenerate === 1 && showSettlementCustomPeriods" :data="settlementRule.customPeriods || []" border class="change-table custom-periods-table">
|
||||
<el-table-column type="index" label="序号" width="70" />
|
||||
<el-table-column label="运单区间-开始日" min-width="180"><template #default="{ row, $index }"><el-select :model-value="row.startDay" placeholder="请选择" clearable @update:model-value="value => handleCustomPeriodStartDayChange($index, value)"><el-option v-for="item in billCutoffDayOptions" :key="`start-${item.value}`" :label="item.label" :value="item.value" /></el-select></template></el-table-column>
|
||||
<el-table-column label="运单区间-结束日" min-width="200"><template #default="{ row, $index }"><el-select :model-value="row.endDay" placeholder="请选择" clearable @update:model-value="value => handleCustomPeriodEndDayChange($index, value)"><el-option v-for="item in customPeriodEndDayOptions(row)" :key="item.value" :label="item.label" :value="item.value" /></el-select></template></el-table-column>
|
||||
<el-table-column label="操作" width="100"><template #default="{ $index }"><el-link v-if="$index === 0" type="primary" @click="addCustomPeriodRow">添加</el-link><el-link v-else type="danger" @click="removeCustomPeriodRow($index)">删除</el-link></template></el-table-column>
|
||||
<template #empty><el-link type="primary" @click="addCustomPeriodRow">添加</el-link></template>
|
||||
</el-table>
|
||||
</section>
|
||||
|
||||
<section class="change-section">
|
||||
@@ -90,26 +252,41 @@
|
||||
|
||||
<billing-plan-editor v-model="planDialogVisible" :value="planEditor" :index="planEditorIndex" @save="savePlan" />
|
||||
|
||||
<section class="change-section attachment-section">
|
||||
<div class="section-head"><div class="dialog-section-title">其它附件</div><el-button type="primary" plain>批量下载</el-button></div>
|
||||
<el-table :data="attachments" border class="change-table"><el-table-column type="index" label="序号" width="70" /><el-table-column label="文件名" min-width="240"><template #default="{ row }"><el-link type="primary" @click="previewAttachment(row, attachments)">{{ row.originalName || row.name }}</el-link></template></el-table-column><el-table-column prop="description" label="附件描述" min-width="240" /><el-table-column prop="size" label="文件大小" width="120" /><el-table-column prop="uploadUserName" label="上传人" width="140" /><el-table-column prop="uploadTime" label="上传时间" width="180" /><el-table-column label="操作" width="100"><template #default="{ $index }"><el-link type="danger" @click="attachments.splice($index, 1)">删除</el-link></template></el-table-column></el-table>
|
||||
<el-upload action="#" :auto-upload="false" multiple :show-file-list="false" @change="handleAttachment"><el-button type="primary" plain icon="el-icon-upload">上传附件</el-button></el-upload>
|
||||
</section>
|
||||
<contract-attachment-section
|
||||
title="其它附件"
|
||||
description
|
||||
attachment-type
|
||||
use-upload-dialog
|
||||
attachment-location="其它附件"
|
||||
:rows="attachments"
|
||||
:preview="previewAttachment"
|
||||
@update:rows="attachments = $event"
|
||||
/>
|
||||
|
||||
<section class="change-section change-reason-section">
|
||||
<div class="dialog-section-title">变更内容</div>
|
||||
<el-form-item prop="changeContent"><el-input v-model="form.changeContent" type="textarea" :rows="3" maxlength="2000" show-word-limit placeholder="请输入变更内容" /></el-form-item>
|
||||
<div class="dialog-section-title is-required">变更原因</div>
|
||||
<el-form-item prop="changeReason"><el-input v-model="form.changeReason" type="textarea" :rows="3" maxlength="500" show-word-limit placeholder="请输入变更原因" /></el-form-item>
|
||||
<div class="dialog-section-title">变更材料</div>
|
||||
<el-table :data="changeMaterials" border class="change-table">
|
||||
<el-table-column type="index" label="序号" width="70" />
|
||||
<el-table-column label="文件名" min-width="240"><template #default="{ row }">{{ row.originalName || row.name }}</template></el-table-column>
|
||||
<el-table-column label="文件大小" width="120"><template #default="{ row }">{{ formatFileSize(row.size) }}</template></el-table-column>
|
||||
<el-table-column label="操作" width="100"><template #default="{ $index }"><el-link type="danger" @click="changeMaterials.splice($index, 1)">删除</el-link></template></el-table-column>
|
||||
</el-table>
|
||||
<div class="attachment-upload"><vehicle-attachment-upload v-model="changeMaterials" :readonly="false" :file-types="attachmentFileTypes" :max-size="50" :show-file-list="false" button-text="上传变更材料" /></div>
|
||||
<div class="dialog-section-title">变更原因</div>
|
||||
<el-form-item prop="changeReason" class="change-reason-section__input">
|
||||
<el-input
|
||||
v-model="form.changeReason"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
maxlength="500"
|
||||
show-word-limit
|
||||
placeholder="请输入变更原因"
|
||||
/>
|
||||
</el-form-item>
|
||||
</section>
|
||||
|
||||
<contract-attachment-section
|
||||
title="变更材料"
|
||||
description
|
||||
attachment-type
|
||||
use-upload-dialog
|
||||
attachment-location="变更材料"
|
||||
:rows="changeMaterials"
|
||||
:preview="previewAttachment"
|
||||
@update:rows="changeMaterials = $event"
|
||||
/>
|
||||
<div class="page-footer">
|
||||
<el-button @click="$router.back()">取消</el-button>
|
||||
<el-button type="primary" @click="submit">提交</el-button>
|
||||
@@ -126,6 +303,15 @@
|
||||
<script>
|
||||
import * as api from '@/api/business/contract-manage';
|
||||
import BillingPlanEditor from './components/billing-plan-editor.vue';
|
||||
import ContractAttachmentSection, {
|
||||
normalizeContractFileRows,
|
||||
} from './components/contract-attachment-section.vue';
|
||||
import { getDictionary as getSystemDictionary } from '@/api/system/dict';
|
||||
import { getDictionary as getBizDictionary } from '@/api/system/dictbiz';
|
||||
import {
|
||||
contractCategoryOptions as defaultContractCategoryOptions,
|
||||
signTypeOptions as defaultSignTypeOptions,
|
||||
} from '@/option/business/common';
|
||||
import { ElImageViewer } from 'element-plus';
|
||||
import { OpenFileViewer } from '@open-file-viewer/vue';
|
||||
import { fallbackPlugin, imagePlugin, officePlugin, pdfPlugin, textPlugin } from '@open-file-viewer/core';
|
||||
@@ -139,65 +325,294 @@ const viewerPlugins = [
|
||||
textPlugin(),
|
||||
fallbackPlugin(),
|
||||
];
|
||||
const defaultSettlementModeOptions = [
|
||||
{ label: '现结', value: '现结' },
|
||||
{ label: '日结', value: '日结' },
|
||||
{ label: '周结', value: '周结' },
|
||||
{ label: '月结', value: '月结' },
|
||||
{ label: '按固定天数周期', value: '按固定天数周期' },
|
||||
];
|
||||
const defaultContractFormatOptions = [
|
||||
{ label: '电子合同', value: '电子合同' },
|
||||
{ label: '纸质合同', value: '纸质合同' },
|
||||
];
|
||||
const normalizeOptionalPositiveInteger = value => {
|
||||
if (value === undefined || value === null || value === '') return null;
|
||||
const number = Number(value);
|
||||
return Number.isInteger(number) && number > 0 ? number : null;
|
||||
};
|
||||
const normalizeOptionalAmount = value => {
|
||||
if (value === undefined || value === null || value === '') return null;
|
||||
const number = Number(value);
|
||||
return Number.isFinite(number) && number >= 0 ? Number(number.toFixed(2)) : null;
|
||||
};
|
||||
|
||||
|
||||
const normalizeCustomPeriods = (periods = []) =>
|
||||
(periods || []).map(item => ({
|
||||
startDay: Number(item?.startDay) > 0 ? Number(item.startDay) : '',
|
||||
endDay: Number(item?.endDay) > 0 ? Number(item.endDay) : '',
|
||||
}));
|
||||
|
||||
export default {
|
||||
components: { BillingPlanEditor, ElImageViewer, OpenFileViewer },
|
||||
data() { return { form: {}, period: [], plans: [], attachments: [], contractFiles: [], contractFileRows: [], selectedContractFiles: [], paymentRatioRows: [], settlementConfigTab: 'pre', changeMaterials: [], imagePreviewVisible: false, imagePreviewUrls: [], imagePreviewIndex: 0, documentPreviewVisible: false, previewFile: {}, viewerPlugins, viewerToolbar: { zoom: true, rotate: true, download: true, fullscreen: true }, feeGenerationMode: 'system', settlementRule: { autoGenerate: 1, settlementType: '月结', billCycleType: '固定截单日', billCutoffDay: 25, cycleDays: '' }, preSettlementConfig: {}, formalSettlementConfig: {}, settlementTypeOptions: ['月结','日结','周结','半月结','固定天数周期结算'], billCycleTypeOptions: ['固定截单日','自然月'], billCutoffDayOptions: Array.from({ length: 31 }, (_, index) => ({ label: `${index + 1}日`, value: index + 1 })), cycleDayOptions: [7,15,30,60].map(value => ({ label: `${value}天`, value })), planDialogVisible: false, planEditor: { planName: '', defaultPlan: false, remark: '', rules: [] }, planEditorIndex: -1, billingElements: ['按重量','按体积','按车辆','按里程','按吨·公里','固定金额（整单一口价）','按数量'], attachmentFileTypes: ['pdf','bmp','jpeg','png','jpg','doc','docx','ppt','pptx','xlsx','xls','eml','msg','zip'], rules: { contractName: [{ required: true, message: '请输入合同名称', trigger: 'blur' }], changeReason: [{ required: true, message: '请输入变更原因', trigger: 'blur' }] } }; },
|
||||
computed: { showSettlementBillCycleType() { return this.settlementRule.settlementType === '月结'; }, showSettlementBillCutoffDay() { return this.showSettlementBillCycleType && this.settlementRule.billCycleType === '固定截单日'; }, showSettlementCycleDays() { return this.settlementRule.settlementType === '固定天数周期结算'; } },
|
||||
mounted() { this.load(); },
|
||||
watch: { settlementConfigTab(tab, oldTab) { if (tab === oldTab) return; if (oldTab === 'pre') this.preSettlementConfig = { ...this.settlementRule }; else this.formalSettlementConfig = { ...this.settlementRule }; this.settlementRule = { ...(tab === 'pre' ? this.preSettlementConfig : this.formalSettlementConfig) }; } },
|
||||
components: { BillingPlanEditor, ContractAttachmentSection, ElImageViewer, OpenFileViewer },
|
||||
data() {
|
||||
return {
|
||||
form: {},
|
||||
period: [],
|
||||
plans: [],
|
||||
attachments: [],
|
||||
contractFiles: [],
|
||||
contractFileRows: [],
|
||||
paymentRatioRows: [],
|
||||
settlementConfigTab: 'pre',
|
||||
changeMaterials: [],
|
||||
imagePreviewVisible: false,
|
||||
imagePreviewUrls: [],
|
||||
imagePreviewIndex: 0,
|
||||
documentPreviewVisible: false,
|
||||
previewFile: {},
|
||||
viewerPlugins,
|
||||
viewerToolbar: { zoom: true, rotate: true, download: true, fullscreen: true },
|
||||
feeGenerationMode: 'system',
|
||||
settlementRule: {
|
||||
autoGenerate: '',
|
||||
billStartDate: '',
|
||||
settlementType: '',
|
||||
billCycleType: '',
|
||||
billCutoffDay: '',
|
||||
cycleDays: '',
|
||||
customPeriods: [],
|
||||
},
|
||||
preSettlementConfig: {},
|
||||
formalSettlementConfig: {},
|
||||
settlementTypeOptions: ['月结', '日结', '周结', '半月结', '固定天数周期结算'],
|
||||
billCycleTypeOptions: ['固定截单日', '自然月', '自定义多周期'],
|
||||
billCutoffDayOptions: Array.from({ length: 31 }, (_, index) => ({
|
||||
label: `${index + 1}日`,
|
||||
value: index + 1,
|
||||
})),
|
||||
cycleDayOptions: [7, 15, 30, 60].map(value => ({ label: `${value}天`, value })),
|
||||
signTypeOptions: defaultSignTypeOptions,
|
||||
contractCategoryDictOptions: [],
|
||||
settlementCurrencyOptions: [],
|
||||
settlementModeDictOptions: [],
|
||||
contractFormatDictOptions: [],
|
||||
planDialogVisible: false,
|
||||
planEditor: { planName: '', defaultPlan: false, remark: '', rules: [] },
|
||||
planEditorIndex: -1,
|
||||
billingElements: [
|
||||
'按重量',
|
||||
'按体积',
|
||||
'按车辆',
|
||||
'按里程',
|
||||
'按吨·公里',
|
||||
'固定金额（整单一口价）',
|
||||
'按数量',
|
||||
],
|
||||
rules: {
|
||||
contractName: [{ required: true, message: '请输入合同名称', trigger: 'blur' }],
|
||||
changeReason: [{ max: 500, message: '变更原因不能超过500个字符', trigger: 'blur' }],
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
pageTitle() {
|
||||
return this.$route.query.name || '合同变更';
|
||||
},
|
||||
contractCategoryOptions() {
|
||||
return this.contractCategoryDictOptions.length
|
||||
? this.contractCategoryDictOptions
|
||||
: defaultContractCategoryOptions;
|
||||
},
|
||||
settlementModeOptions() {
|
||||
return this.settlementModeDictOptions.length
|
||||
? this.settlementModeDictOptions
|
||||
: defaultSettlementModeOptions;
|
||||
},
|
||||
contractFormatOptions() {
|
||||
return this.contractFormatDictOptions.length
|
||||
? this.contractFormatDictOptions
|
||||
: defaultContractFormatOptions;
|
||||
},
|
||||
showSettlementBillCycleType() {
|
||||
return this.settlementRule.settlementType === '月结';
|
||||
},
|
||||
showSettlementBillCutoffDay() {
|
||||
return this.showSettlementBillCycleType && this.settlementRule.billCycleType === '固定截单日';
|
||||
},
|
||||
showSettlementCustomPeriods() {
|
||||
return this.showSettlementBillCycleType && this.settlementRule.billCycleType === '自定义多周期';
|
||||
},
|
||||
showSettlementCycleDays() {
|
||||
return this.settlementRule.settlementType === '固定天数周期结算';
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.loadDictionaries();
|
||||
this.load();
|
||||
},
|
||||
watch: {
|
||||
settlementConfigTab(tab, oldTab) {
|
||||
if (tab === oldTab) return;
|
||||
if (oldTab === 'pre') this.preSettlementConfig = { ...this.settlementRule };
|
||||
else this.formalSettlementConfig = { ...this.settlementRule };
|
||||
this.settlementRule = {
|
||||
...(tab === 'pre' ? this.preSettlementConfig : this.formalSettlementConfig),
|
||||
};
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async load() { const id = this.$route.query.id; if (!id) return; const res = await api.getDetail(id); const data = res.data?.data || res.data || {}; this.form = { ...data, changeContent: '', changeReason: '', changeAttachmentsJson: '', copyCount: normalizeOptionalPositiveInteger(data.copyCount), paymentDays: normalizeOptionalPositiveInteger(data.paymentDays), changeType: '合同信息变更' }; this.changeMaterials = []; this.period = data.startDate && data.endDate ? [data.startDate, data.endDate] : []; this.plans = this.parse(data.billingPlanJson); this.attachments = this.mergeChangeAttachments(this.parse(data.attachmentsJson), this.parse(data.changeAttachmentsJson)); this.contractFileRows = this.parse(data.contractFileJson); const rules = this.parseObject(data.settlementRuleJson); const pre = this.parseObject(data.preSettlementConfigJson); const formal = this.parseObject(data.formalSettlementConfigJson); const legacy = Object.keys(rules).some(key => !['preSettlementConfig', 'formalSettlementConfig'].includes(key)) ? rules : {}; this.preSettlementConfig = rules.preSettlementConfig || (Object.keys(pre).length ? pre : legacy); this.formalSettlementConfig = rules.formalSettlementConfig || (Object.keys(formal).length ? formal : legacy); this.settlementRule = { ...this.preSettlementConfig }; this.feeGenerationMode = data.feeGenerationMode || (Number(data.billingEnabled) === 0 ? 'manual' : 'system'); this.paymentRatioRows = this.parse(data.paymentRatioJson); },
|
||||
parse(value) { try { const result = JSON.parse(value || '[]'); return Array.isArray(result) ? result : []; } catch { return []; } },
|
||||
loadDictionaries() {
|
||||
Promise.all([
|
||||
getSystemDictionary({ code: 'currency_type' }),
|
||||
getBizDictionary({ code: 'settle_method' }),
|
||||
getBizDictionary({ code: 'contractFormat' }),
|
||||
getBizDictionary({ code: 'contractCategory' }),
|
||||
]).then(([currencyRes, methodRes, formatRes, categoryRes]) => {
|
||||
const records = response => {
|
||||
const data = response?.data?.data || response?.data || [];
|
||||
return Array.isArray(data) ? data : data.records || [];
|
||||
};
|
||||
this.settlementCurrencyOptions = records(currencyRes).map(item => ({
|
||||
label: item.dictValue,
|
||||
value: item.dictKey,
|
||||
}));
|
||||
this.settlementModeDictOptions = records(methodRes).map(item => ({
|
||||
label: item.dictValue,
|
||||
value: item.dictKey,
|
||||
}));
|
||||
this.contractFormatDictOptions = records(formatRes).map(item => ({
|
||||
label: item.dictValue,
|
||||
value: item.dictKey,
|
||||
}));
|
||||
this.contractCategoryDictOptions = records(categoryRes).map(item => ({
|
||||
label: item.dictValue,
|
||||
value: item.dictKey,
|
||||
}));
|
||||
});
|
||||
},
|
||||
async load() {
|
||||
const id = this.$route.query.id;
|
||||
if (!id) return;
|
||||
const res = await api.getDetail(id);
|
||||
const data = res.data?.data || res.data || {};
|
||||
this.form = {
|
||||
...data,
|
||||
changeContent: '',
|
||||
changeReason: '',
|
||||
changeAttachmentsJson: '',
|
||||
copyCount: normalizeOptionalPositiveInteger(data.copyCount),
|
||||
invoiceCycle: normalizeOptionalPositiveInteger(data.invoiceCycle),
|
||||
paymentDays: normalizeOptionalPositiveInteger(data.paymentDays),
|
||||
contractAmount: normalizeOptionalAmount(data.contractAmount),
|
||||
templateFlag: data.templateFlag ?? 0,
|
||||
electronicSealFlag: data.electronicSealFlag ?? 0,
|
||||
archiveStatus: data.archiveStatus || '未归档',
|
||||
changeType: '合同信息变更',
|
||||
};
|
||||
this.changeMaterials = [];
|
||||
this.period = data.startDate && data.endDate ? [data.startDate, data.endDate] : [];
|
||||
this.plans = this.parse(data.billingPlanJson);
|
||||
this.attachments = this.mergeChangeAttachments(
|
||||
this.parse(data.attachmentsJson),
|
||||
this.parse(data.changeAttachmentsJson)
|
||||
);
|
||||
this.contractFileRows = normalizeContractFileRows(this.parse(data.contractFileJson));
|
||||
const rules = this.parseObject(data.settlementRuleJson);
|
||||
const pre = this.parseObject(data.preSettlementConfigJson);
|
||||
const formal = this.parseObject(data.formalSettlementConfigJson);
|
||||
const legacy = Object.keys(rules).some(
|
||||
key => !['preSettlementConfig', 'formalSettlementConfig'].includes(key)
|
||||
)
|
||||
? rules
|
||||
: {};
|
||||
const normalizeRule = rule => {
|
||||
const next = {
|
||||
autoGenerate: '',
|
||||
billStartDate: '',
|
||||
settlementType: '',
|
||||
billCycleType: '',
|
||||
billCutoffDay: '',
|
||||
cycleDays: '',
|
||||
customPeriods: [],
|
||||
...(rule || {}),
|
||||
};
|
||||
if (next.settlementType === '月结' && next.billCycleType === '自定义多周期') {
|
||||
next.customPeriods = normalizeCustomPeriods(
|
||||
Array.isArray(next.customPeriods) ? next.customPeriods : []
|
||||
);
|
||||
} else {
|
||||
next.customPeriods = [];
|
||||
}
|
||||
return next;
|
||||
};
|
||||
this.preSettlementConfig = normalizeRule(
|
||||
rules.preSettlementConfig || (Object.keys(pre).length ? pre : legacy)
|
||||
);
|
||||
this.formalSettlementConfig = normalizeRule(
|
||||
rules.formalSettlementConfig || (Object.keys(formal).length ? formal : legacy)
|
||||
);
|
||||
this.settlementRule = { ...this.preSettlementConfig };
|
||||
this.feeGenerationMode =
|
||||
data.feeGenerationMode || (Number(data.billingEnabled) === 0 ? 'manual' : 'system');
|
||||
this.paymentRatioRows = this.parse(data.paymentRatioJson);
|
||||
},
|
||||
parse(value) {
|
||||
try {
|
||||
const result = JSON.parse(value || '[]');
|
||||
return Array.isArray(result) ? result : [];
|
||||
} catch {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
// 审核通过后上一次的变更材料归集到「其它附件」，按文件地址/文件名去重，避免重复展示
|
||||
mergeChangeAttachments(attachments = [], changeAttachments = []) {
|
||||
const key = item => this.attachmentUrl(item) || this.attachmentName(item);
|
||||
const exists = new Set(attachments.map(key));
|
||||
const merged = changeAttachments
|
||||
.filter(item => !exists.has(key(item)))
|
||||
.map(item => ({ ...item, size: /^\d+$/.test(String(item.size ?? '')) ? this.formatFileSize(item.size) : item.size }));
|
||||
.map(item => ({
|
||||
...item,
|
||||
size: /^\d+$/.test(String(item.size ?? '')) ? this.formatFileSize(item.size) : item.size,
|
||||
}));
|
||||
return [...attachments, ...merged];
|
||||
},
|
||||
parseObject(value) { try { return { autoGenerate: 1, settlementType: '月结', billCycleType: '固定截单日', billCutoffDay: 25, cycleDays: 15, ...(JSON.parse(value || '{}') || {}) }; } catch { return { autoGenerate: 1, settlementType: '月结', billCycleType: '固定截单日', billCutoffDay: 25, cycleDays: 15 }; } },
|
||||
positiveIntegerInput(prop, value) { this.form[prop] = String(value ?? '').replace(/\D/g, '').replace(/^0+/, ''); },
|
||||
parseObject(value) {
|
||||
try {
|
||||
return {
|
||||
autoGenerate: '',
|
||||
billStartDate: '',
|
||||
settlementType: '',
|
||||
billCycleType: '',
|
||||
billCutoffDay: '',
|
||||
cycleDays: '',
|
||||
customPeriods: [],
|
||||
...(JSON.parse(value || '{}') || {}),
|
||||
};
|
||||
} catch {
|
||||
return {
|
||||
autoGenerate: '',
|
||||
billStartDate: '',
|
||||
settlementType: '',
|
||||
billCycleType: '',
|
||||
billCutoffDay: '',
|
||||
cycleDays: '',
|
||||
customPeriods: [],
|
||||
};
|
||||
}
|
||||
},
|
||||
positiveIntegerInput(prop, value) {
|
||||
this.form[prop] = String(value ?? '')
|
||||
.replace(/\D/g, '')
|
||||
.replace(/^0+/, '');
|
||||
},
|
||||
addPlan() { this.planEditorIndex = -1; this.planEditor = { planName: `计费方案${this.plans.length + 1}`, defaultPlan: !this.plans.length, remark: '', rules: [{}] }; this.planDialogVisible = true; },
|
||||
editPlan(row, index) { this.planEditorIndex = index; this.planEditor = JSON.parse(JSON.stringify(row)); this.planDialogVisible = true; },
|
||||
toggleDefaultPlan(value) { if (value) this.plans.forEach(item => { item.defaultPlan = false; }); },
|
||||
savePlan(value, index) { if (index < 0) this.plans.push(value); else this.plans.splice(index, 1, value); if (value.defaultPlan) this.plans.forEach((item, current) => { if (current !== (index < 0 ? this.plans.length - 1 : index)) item.defaultPlan = false; }); },
|
||||
handleSettlementTypeChange(value) { if (value !== '月结') { this.settlementRule.billCycleType = ''; this.settlementRule.billCutoffDay = ''; } else if (!this.settlementRule.billCycleType) this.settlementRule.billCycleType = '固定截单日'; if (value !== '固定天数周期结算') this.settlementRule.cycleDays = ''; },
|
||||
handleCycleTypeChange(value) { if (value === '固定截单日' && !this.settlementRule.billCutoffDay) this.settlementRule.billCutoffDay = 25; if (value !== '固定截单日') this.settlementRule.billCutoffDay = ''; },
|
||||
currentUploadUserName() {
|
||||
const userInfo = this.$store.getters.userInfo || {};
|
||||
return userInfo.realName || userInfo.userName || '';
|
||||
},
|
||||
handleAttachment(event) {
|
||||
const raw = event.raw;
|
||||
if (!raw) return;
|
||||
if (raw.size > 50 * 1024 * 1024) {
|
||||
this.$message.warning('单个文件大小不能超过50M');
|
||||
return;
|
||||
}
|
||||
this.attachments.push({
|
||||
name: raw.name,
|
||||
size: `${Math.ceil(raw.size / 1024)}KB`,
|
||||
uploadUserName: this.currentUploadUserName(),
|
||||
uploadTime: this.$dayjs().format('YYYY-MM-DD HH:mm:ss'),
|
||||
});
|
||||
},
|
||||
handleContractFileChange(list) {
|
||||
const uploadUserName = this.currentUploadUserName();
|
||||
const uploadTime = this.$dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
this.contractFileRows = (list || []).map(item => ({
|
||||
...item,
|
||||
uploadUserName: item.uploadUserName || uploadUserName,
|
||||
uploadTime: item.uploadTime || uploadTime,
|
||||
}));
|
||||
},
|
||||
handleSettlementTypeChange(value) { if (value !== '月结') { this.settlementRule.billCycleType = ''; this.settlementRule.billCutoffDay = ''; this.settlementRule.customPeriods = []; } else if (this.settlementRule.billCycleType === '自定义多周期') this.settlementRule.customPeriods = normalizeCustomPeriods(this.settlementRule.customPeriods || []); else this.settlementRule.customPeriods = []; if (value !== '固定天数周期结算') this.settlementRule.cycleDays = ''; },
|
||||
handleCycleTypeChange(value) { if (value !== '固定截单日') this.settlementRule.billCutoffDay = ''; if (value === '自定义多周期') this.settlementRule.customPeriods = normalizeCustomPeriods(this.settlementRule.customPeriods || []); else this.settlementRule.customPeriods = []; },
|
||||
attachmentUrl(row = {}) { return row.url || row.link || row.fileUrl || row.downloadUrl || row.domain || ''; },
|
||||
attachmentName(row = {}) { return row.originalName || row.name || row.fileName || '附件'; },
|
||||
attachmentExtension(row = {}) { const source = String(this.attachmentName(row) || this.attachmentUrl(row)).split('?')[0]; const index = source.lastIndexOf('.'); return index > -1 ? source.slice(index + 1).toLowerCase() : ''; },
|
||||
@@ -205,11 +620,16 @@ export default {
|
||||
previewAttachment(row, rows = this.attachments) { const url = this.attachmentUrl(row); if (!url) { this.$message.warning('附件地址为空，无法预览'); return; } if (this.isAttachmentImage(row)) { this.imagePreviewUrls = (rows || []).filter(item => this.isAttachmentImage(item) && this.attachmentUrl(item)).map(item => this.attachmentUrl(item)); this.imagePreviewIndex = Math.max(this.imagePreviewUrls.indexOf(url), 0); this.imagePreviewVisible = true; return; } this.previewFile = { name: this.attachmentName(row), url, mimeType: row.mimeType || row.contentType || '' }; this.documentPreviewVisible = true; },
|
||||
handlePreviewUnsupported() { this.$message.warning('当前文件暂不支持在线预览'); },
|
||||
handlePreviewError() { this.$message.error('附件预览失败'); },
|
||||
removeContractFile(index) { this.contractFileRows.splice(index, 1); },
|
||||
handleContractFileBatchDownload() { (this.selectedContractFiles.length ? this.selectedContractFiles : this.contractFileRows).forEach(row => { if (row.url) window.open(row.url, '_blank'); }); },
|
||||
formatFileSize(value) { const size = Number(value || 0); return size > 1024 * 1024 ? `${(size / 1024 / 1024).toFixed(2)}MB` : `${Math.max(1, Math.ceil(size / 1024))}KB`; },
|
||||
addPaymentRatioRow() { this.paymentRatioRows.push({ paymentTerm: `第${this.paymentRatioRows.length + 1}笔`, ratioLimit: '', remark: '' }); },
|
||||
async submit() { await this.$refs.formRef.validate(); const total = this.paymentRatioRows.reduce((sum, row) => sum + Number(row.ratioLimit || 0), 0); if (this.paymentRatioRows.length && Math.abs(total - 100) > 0.0001) { this.$message.warning('付款比例上限合计必须等于100%'); return; } const settlementRule = { preSettlementConfig: this.preSettlementConfig, formalSettlementConfig: this.formalSettlementConfig }; await api.submitChange({ ...this.form, settlementCurrency: String(this.form.settlementCurrency || '').trim() || 'RMB', copyCount: normalizeOptionalPositiveInteger(this.form.copyCount), paymentDays: normalizeOptionalPositiveInteger(this.form.paymentDays), startDate: this.period[0], endDate: this.period[1], feeGenerationMode: this.feeGenerationMode, billingEnabled: this.feeGenerationMode === 'system' ? 1 : 0, billingPlanJson: JSON.stringify(this.plans), settlementRuleJson: JSON.stringify(settlementRule), preSettlementConfigJson: JSON.stringify(this.preSettlementConfig), formalSettlementConfigJson: JSON.stringify(this.formalSettlementConfig), paymentRatioJson: JSON.stringify(this.paymentRatioRows), contractFileJson: JSON.stringify(this.contractFileRows), attachmentsJson: JSON.stringify(this.attachments), changeContent: this.form.changeContent, changeReason: this.form.changeReason, changeAttachmentsJson: JSON.stringify(this.changeMaterials) }); this.$message.success('变更已提交'); this.$router.back(); },
|
||||
customPeriodEndDayOptions(row) { const startDay = Number(row?.startDay); if (!Number.isFinite(startDay) || startDay < 1) return this.billCutoffDayOptions; return Array.from({ length: 31 - startDay + 1 }, (_, index) => ({ label: `${startDay + index}日`, value: startDay + index })); },
|
||||
handleCustomPeriodStartDayChange(index, value) { const periods = normalizeCustomPeriods(this.settlementRule.customPeriods || []); const row = periods[index]; if (!row) return; row.startDay = value || ''; const startDay = Number(row.startDay); const endDay = Number(row.endDay); if (Number.isFinite(startDay) && Number.isFinite(endDay) && (endDay < startDay || endDay > 31)) row.endDay = ''; this.settlementRule.customPeriods = periods; },
|
||||
handleCustomPeriodEndDayChange(index, value) { const periods = normalizeCustomPeriods(this.settlementRule.customPeriods || []); const row = periods[index]; if (!row) return; row.endDay = value || ''; this.settlementRule.customPeriods = periods; },
|
||||
addCustomPeriodRow() { const periods = normalizeCustomPeriods(this.settlementRule.customPeriods || []); periods.push({ startDay: '', endDay: '' }); this.settlementRule.customPeriods = periods; },
|
||||
removeCustomPeriodRow(index) { if (index <= 0) return; const periods = [...(this.settlementRule.customPeriods || [])]; periods.splice(index, 1); this.settlementRule.customPeriods = normalizeCustomPeriods(periods); },
|
||||
validateCustomPeriods(periods = [], label) { const rows = normalizeCustomPeriods(periods); if (!rows.length) { this.$message.warning(`${label}：请至少配置一段自定义周期`); return false; } for (let index = 0; index < rows.length; index += 1) { const row = rows[index]; const startDay = Number(row.startDay); const endDay = Number(row.endDay); if (!Number.isFinite(startDay) || startDay < 1 || startDay > 31) { this.$message.warning(`${label}：请选择第${index + 1}行运单区间开始日`); return false; } if (!Number.isFinite(endDay) || endDay < 1 || endDay > 31) { this.$message.warning(`${label}：请选择第${index + 1}行运单区间结束日`); return false; } if (endDay < startDay) { this.$message.warning(`${label}：第${index + 1}行结束日不能早于开始日`); return false; } if (index > 0 && startDay !== Number(rows[index - 1].endDay) + 1) { this.$message.warning(`${label}：自定义多周期区间必须连续，不允许重叠或存在日期缺口`); return false; } } return true; },
|
||||
validateSettlementRule(rule, label) { if (Number(rule.autoGenerate) !== 1) return true; if (!rule.billStartDate || !rule.settlementType) { this.$message.warning(`${label}：请完整填写账单起始日期和结算类型`); return false; } if (rule.settlementType === '月结' && !rule.billCycleType) { this.$message.warning(`${label}：请选择结算周期`); return false; } if (rule.settlementType === '月结' && rule.billCycleType === '固定截单日' && !rule.billCutoffDay) { this.$message.warning(`${label}：请选择账单截单日`); return false; } if (rule.settlementType === '月结' && rule.billCycleType === '自定义多周期') return this.validateCustomPeriods(rule.customPeriods, label); if (rule.settlementType === '固定天数周期结算' && !rule.cycleDays) { this.$message.warning(`${label}：请选择周期天数`); return false; } return true; },
|
||||
async submit() { await this.$refs.formRef.validate(); const total = this.paymentRatioRows.reduce((sum, row) => sum + Number(row.ratioLimit || 0), 0); if (this.paymentRatioRows.length && Math.abs(total - 100) > 0.0001) { this.$message.warning('付款比例上限合计必须等于100%'); return; } if (this.settlementConfigTab === 'pre') this.preSettlementConfig = { ...this.settlementRule }; else this.formalSettlementConfig = { ...this.settlementRule }; if (!this.validateSettlementRule(this.preSettlementConfig, '预结算配置') || !this.validateSettlementRule(this.formalSettlementConfig, '正式结算配置')) return; const settlementRule = { preSettlementConfig: this.preSettlementConfig, formalSettlementConfig: this.formalSettlementConfig }; await api.submitChange({ ...this.form, settlementCurrency: String(this.form.settlementCurrency || '').trim() || 'RMB', copyCount: normalizeOptionalPositiveInteger(this.form.copyCount), invoiceCycle: normalizeOptionalPositiveInteger(this.form.invoiceCycle), paymentDays: normalizeOptionalPositiveInteger(this.form.paymentDays), contractAmount: normalizeOptionalAmount(this.form.contractAmount), startDate: this.period[0], endDate: this.period[1], feeGenerationMode: this.feeGenerationMode, billingEnabled: this.feeGenerationMode === 'system' ? 1 : 0, billingPlanJson: JSON.stringify(this.plans), settlementRuleJson: JSON.stringify(settlementRule), preSettlementConfigJson: JSON.stringify(this.preSettlementConfig), formalSettlementConfigJson: JSON.stringify(this.formalSettlementConfig), paymentRatioJson: JSON.stringify(this.paymentRatioRows), contractFileJson: JSON.stringify(this.contractFileRows), attachmentsJson: JSON.stringify(this.attachments), changeContent: this.form.changeContent, changeReason: this.form.changeReason, changeAttachmentsJson: JSON.stringify(this.changeMaterials) }); this.$message.success('变更已提交'); this.$router.back(); },
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -235,7 +655,6 @@ export default {
|
||||
.contract-basic-section :deep(.el-date-editor) { width: 360px; max-width: 100%; }
|
||||
.dialog-section-title { margin-bottom: 18px; font-size: 16px; font-weight: 600; }
|
||||
.dialog-section-title::before { display: inline-block; width: 4px; height: 16px; margin-right: 8px; vertical-align: -2px; background: #409eff; content: ''; }
|
||||
.dialog-section-title.is-required::after { margin-left: 4px; color: #f56c6c; content: '*'; }
|
||||
.section-head { display: flex; align-items: center; justify-content: space-between; }
|
||||
.change-table { margin: 16px 0; }
|
||||
.ratio-tip { margin-bottom: 8px; color: #f56c6c; }
|
||||
@@ -249,6 +668,18 @@ export default {
|
||||
.settlement-switch-tip { margin: 0 32px 0 8px; color: #a8abb2; cursor: help; font-size: 14px; }
|
||||
.settlement-form { display: grid; grid-template-columns: repeat(3, minmax(240px, 1fr)); gap: 8px 28px; }
|
||||
.change-reason-section { margin: 20px 0; }
|
||||
.change-reason-section__input {
|
||||
width: 100%;
|
||||
:deep(.el-textarea__inner) {
|
||||
border-color: #f56c6c;
|
||||
box-shadow: 0 0 0 1px #f56c6c inset;
|
||||
}
|
||||
:deep(.el-textarea__inner:hover),
|
||||
:deep(.el-textarea__inner:focus) {
|
||||
border-color: #f56c6c;
|
||||
box-shadow: 0 0 0 1px #f56c6c inset;
|
||||
}
|
||||
}
|
||||
.page-footer {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -354,7 +354,7 @@
|
||||
<el-link
|
||||
v-for="action in rowActions(row)"
|
||||
:key="action.type"
|
||||
:type="action.type === 'delete' ? 'danger' : 'primary'"
|
||||
:type="['delete', 'cancel'].includes(action.type) ? 'danger' : 'primary'"
|
||||
@click="handleRowAction(action.type, row)"
|
||||
>{{ action.label }}</el-link
|
||||
>
|
||||
@@ -583,219 +583,219 @@
|
||||
label-width="auto"
|
||||
class="loading-manage-dialog__form archive-form"
|
||||
>
|
||||
<section-card title="筛选待配载运单">
|
||||
<template #extra>
|
||||
<el-link v-if="!dialogReadonly" type="primary" @click="openCandidateSearch"
|
||||
>筛选</el-link
|
||||
>
|
||||
</template>
|
||||
<div class="loading-manage-dialog__candidate-search">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="运单号">
|
||||
<el-input v-model="candidateQuery.waybillNo" clearable placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="项目名称">
|
||||
<el-select
|
||||
v-model="candidateQuery.projectName"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadProjectOptions"
|
||||
:loading="projectLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadProjectOptions(candidateQuery.projectName)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in projectOptions"
|
||||
:key="item.id || item.projectName"
|
||||
:label="item.projectName"
|
||||
:value="item.projectName"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="发货地址">
|
||||
<el-input
|
||||
v-model="candidateQuery.departureAddress"
|
||||
clearable
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<template v-if="candidateSearchVisible">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="货物名称">
|
||||
<el-input v-model="candidateQuery.cargoName" clearable placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="收货地址">
|
||||
<el-input
|
||||
v-model="candidateQuery.arrivalAddress"
|
||||
clearable
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="客户名称">
|
||||
<el-select
|
||||
v-model="candidateQuery.customerName"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadCustomerOptions"
|
||||
:loading="customerLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadCustomerOptions(candidateQuery.customerName)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in customerOptions"
|
||||
:key="item.id || item.customerName"
|
||||
:label="item.customerName"
|
||||
:value="item.customerName"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="货物类型">
|
||||
<el-select
|
||||
v-model="candidateQuery.cargoType"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadCargoTypeOptions"
|
||||
:loading="cargoTypeLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadCargoTypeOptions(candidateQuery.cargoType)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in cargoTypeOptions"
|
||||
:key="item.id || item.cargoName || item.cargoType"
|
||||
:label="item.cargoName || item.cargoType || item.label"
|
||||
:value="item.cargoName || item.cargoType || item.label"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="原始单号">
|
||||
<el-input
|
||||
v-model="candidateQuery.originalNo"
|
||||
clearable
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="车/船/航班/班列">
|
||||
<el-input v-model="candidateQuery.vehicleNo" clearable placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="承运商名称">
|
||||
<el-select
|
||||
v-model="candidateQuery.carrierName"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadCarrierOptions"
|
||||
:loading="carrierLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadCarrierOptions(candidateQuery.carrierName)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in carrierOptions"
|
||||
:key="item.id || item.fullName || item.customerName || item.carrierName"
|
||||
:label="
|
||||
item.fullName || item.customerName || item.carrierName || item.name
|
||||
"
|
||||
:value="
|
||||
item.fullName || item.customerName || item.carrierName || item.name
|
||||
"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="司机">
|
||||
<el-select
|
||||
v-model="candidateQuery.driverName"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadDriverOptions"
|
||||
:loading="driverLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadDriverOptions(candidateQuery.driverName)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in driverOptions"
|
||||
:key="item.id || item.driverName || item.name"
|
||||
:label="item.driverName || item.name"
|
||||
:value="item.driverName || item.name"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="运输方式">
|
||||
<el-select
|
||||
v-model="candidateQuery.transportType"
|
||||
clearable
|
||||
filterable
|
||||
placeholder="请选择"
|
||||
:disabled="dialogMode === 'add'"
|
||||
@visible-change="visible => visible && loadTransportTypeOptions()"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in transportTypeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</template>
|
||||
<el-col
|
||||
:span="candidateSearchVisible ? 24 : 6"
|
||||
class="loading-manage-dialog__candidate-actions"
|
||||
>
|
||||
<el-button type="primary" @click="handleCandidateSearch">查询</el-button>
|
||||
<el-button @click="handleCandidateReset">重置</el-button>
|
||||
<el-link
|
||||
type="primary"
|
||||
@click="candidateSearchVisible = !candidateSearchVisible"
|
||||
>{{ candidateSearchVisible ? '收起' : '展开' }}</el-link
|
||||
>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</section-card>
|
||||
|
||||
<div title="配载信息" class="loading-manage-dialog__load-info-card">
|
||||
<section-card title="待配载运单">
|
||||
<section-card>
|
||||
<div class="loading-manage-dialog__candidate-search">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="运单号">
|
||||
<el-input v-model="candidateQuery.waybillNo" clearable placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="项目名称">
|
||||
<el-select
|
||||
v-model="candidateQuery.projectName"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadProjectOptions"
|
||||
:loading="projectLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadProjectOptions(candidateQuery.projectName)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in projectOptions"
|
||||
:key="item.id || item.projectName"
|
||||
:label="item.projectName"
|
||||
:value="item.projectName"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="发货地址">
|
||||
<el-input
|
||||
v-model="candidateQuery.departureAddress"
|
||||
clearable
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<template v-if="candidateSearchVisible">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="货物名称">
|
||||
<el-input
|
||||
v-model="candidateQuery.cargoName"
|
||||
clearable
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="收货地址">
|
||||
<el-input
|
||||
v-model="candidateQuery.arrivalAddress"
|
||||
clearable
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="客户名称">
|
||||
<el-select
|
||||
v-model="candidateQuery.customerName"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadCustomerOptions"
|
||||
:loading="customerLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadCustomerOptions(candidateQuery.customerName)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in customerOptions"
|
||||
:key="item.id || item.customerName"
|
||||
:label="item.customerName"
|
||||
:value="item.customerName"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="货物类型">
|
||||
<el-select
|
||||
v-model="candidateQuery.cargoType"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadCargoTypeOptions"
|
||||
:loading="cargoTypeLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadCargoTypeOptions(candidateQuery.cargoType)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in cargoTypeOptions"
|
||||
:key="item.id || item.cargoName || item.cargoType"
|
||||
:label="item.cargoName || item.cargoType || item.label"
|
||||
:value="item.cargoName || item.cargoType || item.label"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="原始单号">
|
||||
<el-input
|
||||
v-model="candidateQuery.originalNo"
|
||||
clearable
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="车/船/航班/班列">
|
||||
<el-input
|
||||
v-model="candidateQuery.vehicleNo"
|
||||
clearable
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="承运商名称">
|
||||
<el-select
|
||||
v-model="candidateQuery.carrierName"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadCarrierOptions"
|
||||
:loading="carrierLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadCarrierOptions(candidateQuery.carrierName)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in carrierOptions"
|
||||
:key="item.id || item.fullName || item.customerName || item.carrierName"
|
||||
:label="
|
||||
item.fullName || item.customerName || item.carrierName || item.name
|
||||
"
|
||||
:value="
|
||||
item.fullName || item.customerName || item.carrierName || item.name
|
||||
"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="司机">
|
||||
<el-select
|
||||
v-model="candidateQuery.driverName"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="loadDriverOptions"
|
||||
:loading="driverLoading"
|
||||
placeholder="请输入"
|
||||
@visible-change="
|
||||
visible => visible && loadDriverOptions(candidateQuery.driverName)
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in driverOptions"
|
||||
:key="item.id || item.driverName || item.name"
|
||||
:label="item.driverName || item.name"
|
||||
:value="item.driverName || item.name"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="运输方式">
|
||||
<el-select
|
||||
v-model="candidateQuery.transportType"
|
||||
clearable
|
||||
filterable
|
||||
placeholder="请选择"
|
||||
:disabled="dialogMode === 'add'"
|
||||
@visible-change="visible => visible && loadTransportTypeOptions()"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in transportTypeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</template>
|
||||
<el-col
|
||||
:span="candidateSearchVisible ? 24 : 6"
|
||||
class="loading-manage-dialog__candidate-actions"
|
||||
>
|
||||
<el-button type="primary" @click="handleCandidateSearch">查询</el-button>
|
||||
<el-button @click="handleCandidateReset">重置</el-button>
|
||||
<el-link
|
||||
type="primary"
|
||||
@click="candidateSearchVisible = !candidateSearchVisible"
|
||||
>{{ candidateSearchVisible ? '收起' : '展开' }}</el-link
|
||||
>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-table
|
||||
ref="candidateTableRef"
|
||||
v-loading="candidateLoading"
|
||||
@@ -843,27 +843,43 @@
|
||||
show-overflow-tooltip
|
||||
>
|
||||
<template #default="{ row }">
|
||||
{{ formatCandidateWaybillValue(row, 'goodsInfo') }}
|
||||
{{ formatCandidateGoodsInfo(row) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="departureAddress"
|
||||
label="发货地址"
|
||||
min-width="220"
|
||||
show-overflow-tooltip
|
||||
>
|
||||
<template #default="{ row }">
|
||||
{{ formatCandidateAddress(row, 'departure') }}
|
||||
<el-tooltip
|
||||
v-if="formatCandidateAddressTooltip(row, 'departure')"
|
||||
:content="formatCandidateAddressTooltip(row, 'departure')"
|
||||
placement="top"
|
||||
>
|
||||
<div class="loading-manage-page__address-cell">
|
||||
{{ formatCandidateAddress(row, 'departure') }}
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<span v-else>{{ formatCandidateAddress(row, 'departure') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="arrivalAddress"
|
||||
label="收货地址"
|
||||
min-width="220"
|
||||
show-overflow-tooltip
|
||||
>
|
||||
<template #default="{ row }">
|
||||
{{ formatCandidateAddress(row, 'arrival') }}
|
||||
<el-tooltip
|
||||
v-if="formatCandidateAddressTooltip(row, 'arrival')"
|
||||
:content="formatCandidateAddressTooltip(row, 'arrival')"
|
||||
placement="top"
|
||||
>
|
||||
<div class="loading-manage-page__address-cell">
|
||||
{{ formatCandidateAddress(row, 'arrival') }}
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<span v-else>{{ formatCandidateAddress(row, 'arrival') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
@@ -995,20 +1011,36 @@
|
||||
prop="departureAddress"
|
||||
label="发货地"
|
||||
min-width="220"
|
||||
show-overflow-tooltip
|
||||
>
|
||||
<template #default="{ row }">
|
||||
{{ formatWaybillAddress(row, 'departure') }}
|
||||
<el-tooltip
|
||||
v-if="formatCandidateAddressTooltip(row, 'departure')"
|
||||
:content="formatCandidateAddressTooltip(row, 'departure')"
|
||||
placement="top"
|
||||
>
|
||||
<div class="loading-manage-page__address-cell">
|
||||
{{ formatCandidateAddress(row, 'departure') }}
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<span v-else>{{ formatCandidateAddress(row, 'departure') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="arrivalAddress"
|
||||
label="到货地"
|
||||
min-width="220"
|
||||
show-overflow-tooltip
|
||||
>
|
||||
<template #default="{ row }">
|
||||
{{ formatWaybillAddress(row, 'arrival') }}
|
||||
<el-tooltip
|
||||
v-if="formatCandidateAddressTooltip(row, 'arrival')"
|
||||
:content="formatCandidateAddressTooltip(row, 'arrival')"
|
||||
placement="top"
|
||||
>
|
||||
<div class="loading-manage-page__address-cell">
|
||||
{{ formatCandidateAddress(row, 'arrival') }}
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<span v-else>{{ formatCandidateAddress(row, 'arrival') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="110" fixed="right">
|
||||
@@ -1677,7 +1709,6 @@ export default {
|
||||
add: '新建配载',
|
||||
edit: '编辑配载单',
|
||||
view: '配载单详情',
|
||||
copy: '复制配载单',
|
||||
reassign: '重新派单',
|
||||
};
|
||||
return titleMap[this.dialogMode] || '配载管理';
|
||||
@@ -1826,6 +1857,7 @@ export default {
|
||||
if (!row) return '-';
|
||||
if (prop === 'businessStatus') return this.statusText(row);
|
||||
if (prop === 'transportType') return this.transportTypeLabel(row.transportType);
|
||||
if (prop === 'goodsInfo') return this.formatCandidateGoodsInfo(row);
|
||||
const column = waybillOption.column.find(item => item.prop === prop);
|
||||
if (column?.formatter) {
|
||||
const value = column.formatter(row, {}, row[prop]);
|
||||
@@ -1834,14 +1866,130 @@ export default {
|
||||
const value = row[prop];
|
||||
return value === undefined || value === null || value === '' ? '-' : value;
|
||||
},
|
||||
formatCandidateGoodsInfo(row = {}) {
|
||||
const goodsRows =
|
||||
[row.goodsJson, row.goodsList, row.goodsRows, row.cargoList, row.cargoRows, row.goods]
|
||||
.map(source => {
|
||||
if (source === undefined || source === null || source === '') return [];
|
||||
if (Array.isArray(source)) return source;
|
||||
if (typeof source === 'object') return [source];
|
||||
return parseJsonArray(source);
|
||||
})
|
||||
.filter(source => source.length)
|
||||
.sort((left, right) => right.length - left.length)[0] || [];
|
||||
if (!goodsRows.length) return String(row.goodsInfo || row.cargoInfo || '') || '-';
|
||||
const groups = goodsRows.reduce((result, item = {}) => {
|
||||
const unit = String(
|
||||
item.quantityUnit ||
|
||||
item.goodsQuantityUnit ||
|
||||
item.cargoUnit ||
|
||||
item.unit ||
|
||||
row.quantityUnit ||
|
||||
row.goodsQuantityUnit ||
|
||||
row.cargoUnit ||
|
||||
row.unit ||
|
||||
''
|
||||
).trim();
|
||||
const key = unit || '__empty__';
|
||||
if (!result[key]) {
|
||||
result[key] = {
|
||||
typeName:
|
||||
item.secondCargoTypeName ||
|
||||
item.secondCargoType ||
|
||||
item.cargoType ||
|
||||
item.goodsType ||
|
||||
item.typeName ||
|
||||
'货物',
|
||||
count: 0,
|
||||
quantity: 0,
|
||||
unit,
|
||||
};
|
||||
}
|
||||
result[key].count += 1;
|
||||
result[key].quantity += this.parseGoodsQuantity(
|
||||
item.quantity ?? item.cargoQuantity ?? item.goodsQuantity
|
||||
);
|
||||
return result;
|
||||
}, {});
|
||||
return (
|
||||
Object.values(groups)
|
||||
.map(group => {
|
||||
const quantity = this.formatGoodsQuantity(group.quantity);
|
||||
return `${group.typeName}等${group.count}种货物 | ${quantity}${
|
||||
group.unit ? ` ${group.unit}` : ''
|
||||
}`;
|
||||
})
|
||||
.join('； ') || '-'
|
||||
);
|
||||
},
|
||||
parseGoodsQuantity(value) {
|
||||
if (value === undefined || value === null || value === '') return 0;
|
||||
const text = String(value).replace(/,/g, '');
|
||||
const match = text.match(/-?\d+(\.\d+)?/);
|
||||
if (!match) return 0;
|
||||
const number = Number(match[0]);
|
||||
return Number.isFinite(number) ? number : 0;
|
||||
},
|
||||
formatGoodsQuantity(value) {
|
||||
const number = Number(value || 0);
|
||||
if (!Number.isFinite(number)) return '0';
|
||||
const fixed = Math.round((number + Number.EPSILON) * 1000) / 1000;
|
||||
return Number.isInteger(fixed) ? String(fixed) : String(fixed).replace(/\.?0+$/, '');
|
||||
},
|
||||
formatCandidateDate(value) {
|
||||
if (!value) return '-';
|
||||
const date = dayjs(value);
|
||||
return date.isValid() ? date.format('YYYY-MM-DD HH:mm:ss') : value;
|
||||
},
|
||||
formatCandidateAddress(row, type) {
|
||||
const value = row?.[`${type}Address`] || row?.[`${type}Name`] || '';
|
||||
return this.formatProvinceCityDistrict(value) || '-';
|
||||
const prefix = type === 'departure' ? 'departure' : 'arrival';
|
||||
const name = String(row?.[`${prefix}Name`] || '').trim();
|
||||
const address = String(row?.[`${prefix}Address`] || '').trim();
|
||||
if (!this.isRoadTransportType(row?.transportType)) {
|
||||
return name || address || '-';
|
||||
}
|
||||
const region = this.mergeRouteAddressParts(
|
||||
this.routeProvinceName(row, prefix),
|
||||
row[`${prefix}CityName`] || row[`${prefix}City`],
|
||||
row[`${prefix}DistrictName`] || row[`${prefix}District`]
|
||||
);
|
||||
const source = this.mergeRouteAddressParts(region, '', address || name);
|
||||
const parts = this.parseWaybillAddress(source);
|
||||
return (
|
||||
[parts.province, parts.city, parts.district]
|
||||
.map(value => String(value || '').trim())
|
||||
.filter(Boolean)
|
||||
.join('') ||
|
||||
this.formatProvinceCityDistrict(source) ||
|
||||
name ||
|
||||
address ||
|
||||
'-'
|
||||
);
|
||||
},
|
||||
formatCandidateAddressTooltip(row, type) {
|
||||
if (!this.isRoadTransportType(row?.transportType)) return '';
|
||||
const prefix = type === 'departure' ? 'departure' : 'arrival';
|
||||
const address = String(row?.[`${prefix}Address`] || '').trim();
|
||||
const name = String(row?.[`${prefix}Name`] || '').trim();
|
||||
const region = this.mergeRouteAddressParts(
|
||||
this.routeProvinceName(row, prefix),
|
||||
row[`${prefix}CityName`] || row[`${prefix}City`],
|
||||
row[`${prefix}DistrictName`] || row[`${prefix}District`]
|
||||
);
|
||||
const detailAddress =
|
||||
row[`${prefix}DetailAddress`] || row[`${prefix}AddressDetail`] || address;
|
||||
return this.mergeRouteAddressParts(region, '', detailAddress || name) || '';
|
||||
},
|
||||
isRoadTransportType(type) {
|
||||
const value = String(type || '')
|
||||
.trim()
|
||||
.toLowerCase();
|
||||
return (
|
||||
value === 'road' ||
|
||||
value.includes('公路') ||
|
||||
value.includes('道路') ||
|
||||
value.includes('highway')
|
||||
);
|
||||
},
|
||||
splitText(value) {
|
||||
if (!value) return [];
|
||||
@@ -2014,31 +2162,28 @@ export default {
|
||||
if (status === 'draft') {
|
||||
return [
|
||||
{ type: 'edit', label: '编辑' },
|
||||
{ type: 'copy', label: '复制' },
|
||||
{ type: 'delete', label: '删除' },
|
||||
];
|
||||
}
|
||||
if (status === 'pending') {
|
||||
return [
|
||||
const actions = [
|
||||
{ type: 'view', label: '详情' },
|
||||
{ type: 'reassign', label: '重新派单' },
|
||||
{ type: 'edit', label: '编辑' },
|
||||
{ type: 'copy', label: '复制' },
|
||||
{ type: 'cancel', label: '取消' },
|
||||
{ type: 'start', label: '改为进行中' },
|
||||
];
|
||||
if (row.driverRejected) {
|
||||
actions.push({ type: 'reassign', label: '重新派单' });
|
||||
}
|
||||
actions.push({ type: 'edit', label: '编辑' }, { type: 'cancel', label: '取消' });
|
||||
return actions;
|
||||
}
|
||||
if (status === 'running') {
|
||||
return [
|
||||
{ type: 'view', label: '详情' },
|
||||
{ type: 'copy', label: '复制' },
|
||||
{ type: 'complete', label: '完成' },
|
||||
];
|
||||
}
|
||||
if (status === 'completed' || status === 'cancelled') {
|
||||
return [
|
||||
{ type: 'view', label: '详情' },
|
||||
{ type: 'copy', label: '复制' },
|
||||
];
|
||||
return [{ type: 'view', label: '详情' }];
|
||||
}
|
||||
return [{ type: 'view', label: '详情' }];
|
||||
},
|
||||
@@ -2047,8 +2192,8 @@ export default {
|
||||
view: () => this.openLoadingDialog('view', row),
|
||||
edit: () => this.openLoadingDialog('edit', row),
|
||||
reassign: () => this.openLoadingDialog('reassign', row),
|
||||
copy: () => this.copyLoading(row),
|
||||
delete: () => this.deleteLoading(row),
|
||||
start: () => this.startLoading(row),
|
||||
cancel: () => this.cancelLoading(row),
|
||||
complete: () => this.completeLoading(row),
|
||||
};
|
||||
@@ -2466,10 +2611,6 @@ export default {
|
||||
if (['road', '公路运输'].includes(normalized)) return 'road,公路运输';
|
||||
return value || '';
|
||||
},
|
||||
openCandidateSearch() {
|
||||
this.candidateSearchVisible = true;
|
||||
this.loadCandidateWaybills();
|
||||
},
|
||||
handleCandidateSearch() {
|
||||
this.candidatePage.currentPage = 1;
|
||||
this.loadCandidateWaybills();
|
||||
@@ -2571,11 +2712,11 @@ export default {
|
||||
};
|
||||
rows.forEach((row, rowIndex) => {
|
||||
const departure = row.departureAddress || row.departureName;
|
||||
appendNode(departure, this.formatWaybillAddress(row, 'departure'), `装${rowIndex + 1}`);
|
||||
appendNode(departure, this.formatCandidateAddress(row, 'departure'), `装${rowIndex + 1}`);
|
||||
});
|
||||
rows.forEach((row, rowIndex) => {
|
||||
const arrival = row.arrivalAddress || row.arrivalName;
|
||||
appendNode(arrival, this.formatWaybillAddress(row, 'arrival'), `卸${rowIndex + 1}`);
|
||||
appendNode(arrival, this.formatCandidateAddress(row, 'arrival'), `卸${rowIndex + 1}`);
|
||||
});
|
||||
return [...nodeMap.values()].map((node, index) => ({
|
||||
...node,
|
||||
@@ -2784,16 +2925,6 @@ export default {
|
||||
this.dialogSaving = '';
|
||||
}
|
||||
},
|
||||
copyLoading(row) {
|
||||
this.$router.push({
|
||||
path: '/business/loading-manage/form',
|
||||
query: {
|
||||
mode: 'add',
|
||||
copyId: row.id,
|
||||
name: '新增配载管理',
|
||||
},
|
||||
});
|
||||
},
|
||||
deleteLoading(row) {
|
||||
ElMessageBox.confirm(`确定删除配载单 ${row.loadingNo}？`, '提示', { type: 'warning' })
|
||||
.then(async () => {
|
||||
@@ -2813,6 +2944,15 @@ export default {
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
startLoading(row) {
|
||||
ElMessageBox.confirm(`确定将配载单 ${row.loadingNo} 改为进行中？`, '提示', { type: 'warning' })
|
||||
.then(async () => {
|
||||
await loadingApi.start(row.id);
|
||||
ElMessage.success('已改为进行中');
|
||||
this.loadTable();
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
completeLoading(row) {
|
||||
ElMessageBox.confirm(`确定完成配载单 ${row.loadingNo}？`, '提示', { type: 'warning' })
|
||||
.then(async () => {
|
||||
@@ -3271,8 +3411,8 @@ export default {
|
||||
}
|
||||
|
||||
.loading-manage-dialog__candidate-search {
|
||||
padding: 4px 0;
|
||||
margin-bottom: 8px;
|
||||
padding: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.loading-manage-dialog__waybill-route-layout {
|
||||
|
||||
+215
-111
@@ -1,57 +1,58 @@
|
||||
<template>
|
||||
<basic-container class="master-order-page">
|
||||
<template v-if="mode === 'list'">
|
||||
<el-form :model="query" class="master-search" label-width="160px" @submit.prevent>
|
||||
<el-row :gutter="16">
|
||||
<el-col v-for="field in primaryFields" :key="field.prop" :span="6"
|
||||
><el-form-item :label="field.label"
|
||||
><el-input v-model="query[field.prop]" placeholder="请输入" /></el-form-item
|
||||
></el-col>
|
||||
<el-col :span="6"
|
||||
><el-form-item label="状态"
|
||||
><el-select v-model="query.businessStatus" placeholder="全部"
|
||||
><el-option label="全部" value="" /><el-option
|
||||
<div class="master-order-page__search">
|
||||
<el-form :model="query" label-position="right" label-width="88px" @submit.prevent>
|
||||
<div class="master-order-page__search-grid">
|
||||
<el-form-item v-for="field in primaryFields" :key="field.prop" :label="field.label">
|
||||
<el-input v-model="query[field.prop]" clearable placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态">
|
||||
<el-select v-model="query.businessStatus" clearable placeholder="全部">
|
||||
<el-option label="全部" value="" />
|
||||
<el-option
|
||||
v-for="item in statuses"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value" /></el-select></el-form-item
|
||||
></el-col>
|
||||
<template v-if="searchExpanded">
|
||||
<el-col v-for="field in secondaryFields" :key="field.prop" :span="6"
|
||||
><el-form-item :label="field.label"
|
||||
><el-input v-model="query[field.prop]" placeholder="请输入" /></el-form-item
|
||||
></el-col>
|
||||
<el-col :span="6"
|
||||
><el-form-item label="计划开始日期"
|
||||
><el-date-picker
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<template v-if="searchExpanded">
|
||||
<el-form-item v-for="field in secondaryFields" :key="field.prop" :label="field.label">
|
||||
<el-input v-model="query[field.prop]" clearable placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计划开始日期">
|
||||
<el-date-picker
|
||||
v-model="query.planStartRange"
|
||||
type="datetimerange"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
start-placeholder="请选择"
|
||||
end-placeholder="请选择" /></el-form-item
|
||||
></el-col>
|
||||
<el-col :span="6"
|
||||
><el-form-item label="计划结束日期"
|
||||
><el-date-picker
|
||||
end-placeholder="请选择"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="计划结束日期">
|
||||
<el-date-picker
|
||||
v-model="query.planEndRange"
|
||||
type="datetimerange"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
start-placeholder="请选择"
|
||||
end-placeholder="请选择" /></el-form-item
|
||||
></el-col>
|
||||
</template>
|
||||
<el-col :span="24" class="search-actions"
|
||||
><el-button type="primary" @click="search">查询</el-button
|
||||
><el-button @click="reset">重置</el-button
|
||||
><el-link type="primary" @click="searchExpanded = !searchExpanded"
|
||||
><el-icon><component :is="searchExpanded ? ArrowUp : ArrowDown" /></el-icon
|
||||
>{{ searchExpanded ? '折叠' : '展开' }}</el-link
|
||||
></el-col
|
||||
>
|
||||
</el-row>
|
||||
</el-form>
|
||||
end-placeholder="请选择"
|
||||
/>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<div class="master-order-page__search-actions">
|
||||
<el-button type="primary" @click="search">查询</el-button>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
<el-link type="primary" @click="searchExpanded = !searchExpanded">{{
|
||||
searchExpanded ? '收起' : '展开'
|
||||
}}</el-link>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
<section class="master-list-panel">
|
||||
<div class="toolbar">
|
||||
<el-button type="primary" @click="goCreate()">新建多联总单</el-button
|
||||
@@ -76,7 +77,13 @@
|
||||
<div class="route-point">
|
||||
<span :class="['route-node', node.type]">{{ node.text }}</span>
|
||||
<div class="route-detail">
|
||||
<el-tooltip placement="top"><template #content>{{ node.name }}</template><strong>{{ node.name }}</strong></el-tooltip>
|
||||
<el-tooltip
|
||||
:content="node.address || node.name || '-'"
|
||||
placement="top"
|
||||
:show-after="120"
|
||||
>
|
||||
<strong>{{ node.name }}</strong>
|
||||
</el-tooltip>
|
||||
<span v-for="line in node.lines" :key="line">{{ line }}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -125,7 +132,7 @@
|
||||
/>
|
||||
</template>
|
||||
<master-order-dispatch v-else-if="mode === 'dispatch'" :id="routeId" @back="goList" />
|
||||
<master-order-detail v-else :id="routeId" @back="goList" />
|
||||
<master-order-detail v-else :id="routeId" />
|
||||
<el-dialog v-model="confirm.visible" title="提示" width="400px"
|
||||
><span>{{ confirm.message }}</span
|
||||
><template #footer
|
||||
@@ -138,7 +145,6 @@
|
||||
|
||||
<script>
|
||||
import * as api from '@/api/business/master-order';
|
||||
import { ArrowDown, ArrowUp } from '@element-plus/icons-vue';
|
||||
import MasterOrderEditor from './components/master-order-editor.vue';
|
||||
import MasterOrderDispatch from './components/master-order-dispatch.vue';
|
||||
import MasterOrderDetail from './components/master-order-detail.vue';
|
||||
@@ -147,8 +153,6 @@ export default {
|
||||
components: { MasterOrderEditor, MasterOrderDispatch, MasterOrderDetail },
|
||||
data() {
|
||||
return {
|
||||
ArrowDown,
|
||||
ArrowUp,
|
||||
searchExpanded: false,
|
||||
loading: false,
|
||||
records: [],
|
||||
@@ -303,7 +307,7 @@ export default {
|
||||
},
|
||||
timeRange(row) {
|
||||
return row.planStartTime && row.planEndTime
|
||||
? `${String(row.planStartTime).slice(0, 16)} - ${String(row.planEndTime).slice(0, 16)}`
|
||||
? `${String(row.planStartTime).slice(0, 10)} - ${String(row.planEndTime).slice(0, 10)}`
|
||||
: '-';
|
||||
},
|
||||
goodsSummary(row) {
|
||||
@@ -334,6 +338,19 @@ export default {
|
||||
const value = String(type || '').trim().toLowerCase();
|
||||
return value === 'road' || value.includes('公路');
|
||||
},
|
||||
isStationLikeName(value) {
|
||||
const text = String(value || '').trim();
|
||||
if (!text) return false;
|
||||
return /(?:火车站|高铁站|客运站|货运站|港口|码头|机场|空港|航站楼)$/.test(text) || /(?<!市|州|盟|区|县|旗)站$/.test(text);
|
||||
},
|
||||
isNonRoadLocation({ name, siteCode, transportType, nextTransportType } = {}) {
|
||||
const code = String(siteCode || '').trim();
|
||||
if (code && code !== '/') return true;
|
||||
if (this.isStationLikeName(name)) return true;
|
||||
if (transportType && !this.isRoadTransportType(transportType)) return true;
|
||||
if (nextTransportType && !this.isRoadTransportType(nextTransportType)) return true;
|
||||
return false;
|
||||
},
|
||||
formatRoadAddress(value) {
|
||||
const text = String(value || '').replace(/\s+/g, '');
|
||||
if (!text) return '-';
|
||||
@@ -355,10 +372,16 @@ export default {
|
||||
routeNodeName(value, address, transportType, region = {}) {
|
||||
const text = String(value || '').trim();
|
||||
if (!text) return '-';
|
||||
const siteCode = String(region.siteCode || '').trim();
|
||||
// 运输方式切换不应改变地址本身的展示模式：有站点编码时显示站点名称，
|
||||
// 没有站点编码的区域地址统一按“市 区县”格式展示。
|
||||
if (siteCode && siteCode !== '/') return text;
|
||||
if (
|
||||
this.isNonRoadLocation({
|
||||
name: text,
|
||||
siteCode: region.siteCode,
|
||||
transportType,
|
||||
nextTransportType: region.nextTransportType,
|
||||
})
|
||||
) {
|
||||
return text;
|
||||
}
|
||||
// 优先从完整的地址名称/详细地址解析，避免后端只返回“梅州”等不完整的市名称时
|
||||
// 提前返回城市，导致区县被遗漏。
|
||||
const parsedText = this.formatRoadAddress(text);
|
||||
@@ -383,86 +406,149 @@ export default {
|
||||
const source = /省|自治区|特别行政区|市|州|盟/.test(text) ? text : address || text;
|
||||
const formatted = this.formatRoadAddress(source);
|
||||
if (/(?:区|县|旗)$/.test(text) && !formatted.includes(text)) {
|
||||
const city = formatted.split(' ')[0];
|
||||
return city && city !== formatted ? `${city} ${text}` : formatted;
|
||||
const cityName = formatted.split(' ')[0];
|
||||
return cityName && cityName !== formatted ? `${cityName} ${text}` : formatted;
|
||||
}
|
||||
return formatted;
|
||||
},
|
||||
resolveRouteNodeLocation({
|
||||
name,
|
||||
address,
|
||||
transportType,
|
||||
nextTransportType,
|
||||
cityName,
|
||||
districtName,
|
||||
siteCode,
|
||||
} = {}) {
|
||||
const rawName = String(name || '').trim();
|
||||
const rawAddress = String(address || '').trim();
|
||||
const regionText = [cityName, districtName].filter(Boolean).join(' ');
|
||||
const nonRoad = this.isNonRoadLocation({
|
||||
name: rawName,
|
||||
siteCode,
|
||||
transportType,
|
||||
nextTransportType,
|
||||
});
|
||||
if (nonRoad) {
|
||||
// 非公路：展示站点名称，悬停展示详细地址。
|
||||
// 兼容历史数据把站点名称写在 address、区域信息写在 name 的情况。
|
||||
if (this.isStationLikeName(rawAddress) && !this.isStationLikeName(rawName)) {
|
||||
return {
|
||||
name: rawAddress,
|
||||
address: rawName || regionText || rawAddress,
|
||||
};
|
||||
}
|
||||
const displayName = rawName || rawAddress || '-';
|
||||
const tipAddress =
|
||||
(rawAddress && rawAddress !== displayName ? rawAddress : '') ||
|
||||
regionText ||
|
||||
rawAddress ||
|
||||
displayName;
|
||||
return { name: displayName, address: tipAddress };
|
||||
}
|
||||
return {
|
||||
name: this.routeNodeName(rawName || rawAddress, rawAddress, transportType, {
|
||||
cityName,
|
||||
districtName,
|
||||
siteCode,
|
||||
nextTransportType,
|
||||
}),
|
||||
address: rawAddress || rawName || regionText || '-',
|
||||
};
|
||||
},
|
||||
routeNodes(row = {}) {
|
||||
const routes = row.routeProgress || [];
|
||||
const total = this.routeNumber(row.totalQuantity);
|
||||
const firstTransportType = routes[0]?.transportType || row.routes?.[0]?.transportType || row.transportType || '';
|
||||
if (!routes.length) {
|
||||
const start = this.resolveRouteNodeLocation({
|
||||
name: row.departureName || row.departureAddress,
|
||||
address: row.departureAddress,
|
||||
transportType: firstTransportType,
|
||||
cityName: row.departureCityName,
|
||||
districtName: row.departureDistrictName,
|
||||
siteCode: row.departureSiteCode,
|
||||
});
|
||||
const end = this.resolveRouteNodeLocation({
|
||||
name: row.arrivalName || row.arrivalAddress,
|
||||
address: row.arrivalAddress,
|
||||
transportType: row.finalTransportType || firstTransportType,
|
||||
cityName: row.arrivalCityName,
|
||||
districtName: row.arrivalDistrictName,
|
||||
siteCode: row.arrivalSiteCode,
|
||||
});
|
||||
return [
|
||||
{
|
||||
key: 'start',
|
||||
type: 'start',
|
||||
text: '起',
|
||||
name: this.routeNodeName(
|
||||
row.departureName || row.departureAddress,
|
||||
row.departureAddress,
|
||||
firstTransportType,
|
||||
{
|
||||
cityName: row.departureCityName,
|
||||
districtName: row.departureDistrictName,
|
||||
siteCode: row.departureSiteCode,
|
||||
}
|
||||
),
|
||||
...start,
|
||||
lines: [`已调度0/${total}吨`],
|
||||
},
|
||||
{
|
||||
key: 'end',
|
||||
type: 'end',
|
||||
text: '终',
|
||||
name: this.routeNodeName(
|
||||
row.arrivalName || row.arrivalAddress,
|
||||
row.arrivalAddress,
|
||||
row.finalTransportType || firstTransportType,
|
||||
{
|
||||
cityName: row.arrivalCityName,
|
||||
districtName: row.arrivalDistrictName,
|
||||
siteCode: row.arrivalSiteCode,
|
||||
}
|
||||
),
|
||||
...end,
|
||||
lines: [`到达0/${total}吨`],
|
||||
},
|
||||
];
|
||||
}
|
||||
const start = this.resolveRouteNodeLocation({
|
||||
name: row.departureName || row.departureAddress,
|
||||
address: row.departureAddress,
|
||||
transportType: firstTransportType,
|
||||
nextTransportType: firstTransportType,
|
||||
cityName: row.departureCityName,
|
||||
districtName: row.departureDistrictName,
|
||||
siteCode: row.departureSiteCode,
|
||||
});
|
||||
return [
|
||||
{
|
||||
key: 'start',
|
||||
type: 'start',
|
||||
text: '起',
|
||||
name: this.routeNodeName(
|
||||
row.departureName || row.departureAddress,
|
||||
row.departureAddress,
|
||||
firstTransportType,
|
||||
{
|
||||
cityName: row.departureCityName,
|
||||
districtName: row.departureDistrictName,
|
||||
siteCode: row.departureSiteCode,
|
||||
}
|
||||
),
|
||||
...start,
|
||||
lines: [`已调度${this.routeNumber(routes[0]?.dispatchedQuantity)}/${total}吨`],
|
||||
},
|
||||
...routes.map((route, index) => {
|
||||
const isEnd = index === routes.length - 1;
|
||||
const arrived = this.routeNumber(this.routeArrivedQuantity(route));
|
||||
const dispatched = this.routeNumber(routes[index + 1]?.dispatchedQuantity);
|
||||
const address =
|
||||
route.arrivalAddress ||
|
||||
route.departureAddress ||
|
||||
(isEnd ? row.arrivalAddress : '') ||
|
||||
'';
|
||||
const location = this.resolveRouteNodeLocation({
|
||||
name:
|
||||
route.arrivalName ||
|
||||
route.departureName ||
|
||||
(isEnd ? row.arrivalName : '') ||
|
||||
'',
|
||||
address,
|
||||
transportType: route.transportType,
|
||||
nextTransportType: isEnd
|
||||
? row.finalTransportType || route.transportType
|
||||
: routes[index + 1]?.transportType || '',
|
||||
cityName:
|
||||
route.arrivalCityName ||
|
||||
route.departureCityName ||
|
||||
(isEnd ? row.arrivalCityName : ''),
|
||||
districtName:
|
||||
route.arrivalDistrictName ||
|
||||
route.departureDistrictName ||
|
||||
(isEnd ? row.arrivalDistrictName : ''),
|
||||
siteCode:
|
||||
route.arrivalSiteCode ||
|
||||
route.departureSiteCode ||
|
||||
(isEnd ? row.arrivalSiteCode : ''),
|
||||
});
|
||||
return {
|
||||
key: route.segmentNo || `route-${index}`,
|
||||
type: isEnd ? 'end' : 'middle',
|
||||
text: isEnd ? '终' : '经',
|
||||
name: this.routeNodeName(
|
||||
route.arrivalName || route.departureName || row.arrivalName,
|
||||
route.arrivalAddress || route.departureAddress,
|
||||
route.transportType,
|
||||
{
|
||||
cityName: route.arrivalCityName || route.departureCityName,
|
||||
districtName: route.arrivalDistrictName || route.departureDistrictName,
|
||||
siteCode: route.arrivalSiteCode || route.departureSiteCode,
|
||||
}
|
||||
),
|
||||
...location,
|
||||
lines: isEnd
|
||||
? [`到达${arrived}/${total}吨`]
|
||||
: [`到达 ${arrived}/${total}吨`, `已调度 ${dispatched}/到达${arrived}/${total}吨`],
|
||||
@@ -494,31 +580,43 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.master-search {
|
||||
margin-bottom: 12px;
|
||||
padding: 12px 12px 4px;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
||||
.el-form-item {
|
||||
.master-order-page {
|
||||
&__search {
|
||||
padding: 12px 12px 4px;
|
||||
margin-bottom: 8px;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
&__search-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 8px 24px;
|
||||
}
|
||||
|
||||
&__search-actions {
|
||||
display: flex;
|
||||
grid-column: 1 / -1;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
min-height: 32px;
|
||||
}
|
||||
|
||||
:deep(.el-form-item) {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.el-input,
|
||||
.el-select,
|
||||
.el-date-editor {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
:deep(.el-form-item__label) {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.search-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
min-height: 40px;
|
||||
.el-icon {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
:deep(.el-input),
|
||||
:deep(.el-select),
|
||||
:deep(.el-date-editor.el-input),
|
||||
:deep(.el-date-editor.el-input__wrapper),
|
||||
:deep(.el-date-editor--datetimerange) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.master-list-panel {
|
||||
@@ -612,10 +710,16 @@ export default {
|
||||
line-height: 1.8;
|
||||
white-space: nowrap;
|
||||
strong {
|
||||
display: inline-block;
|
||||
max-width: 150px;
|
||||
overflow: hidden;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
line-height: 1.4;
|
||||
max-width: 180px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
vertical-align: bottom;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
.route-connector {
|
||||
|
||||
@@ -227,7 +227,7 @@
|
||||
<el-radio-group
|
||||
v-model="row.confirmMode"
|
||||
:disabled="dialogReadonly || !row.enabled"
|
||||
@change="syncNodeFields"
|
||||
@change="handleAcceptConfirmChange(row)"
|
||||
>
|
||||
<el-radio label="yes">是</el-radio>
|
||||
<el-radio label="no_confirm_accept">无需确认接单</el-radio>
|
||||
@@ -235,12 +235,7 @@
|
||||
</div>
|
||||
<div class="process-config-form__require-line">
|
||||
<span class="process-config-form__require-label">确认接单人</span>
|
||||
<el-checkbox
|
||||
v-model="row.confirmDriver"
|
||||
:disabled="dialogReadonly || !row.enabled || row.confirmMode !== 'yes'"
|
||||
@change="syncNodeFields"
|
||||
>司机</el-checkbox
|
||||
>
|
||||
<el-checkbox v-model="row.confirmDriver" :disabled="true">司机</el-checkbox>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -551,10 +546,19 @@ export default {
|
||||
hasPermission(code) {
|
||||
return this.isAdmin || this.validData(this.permission && this.permission[code], false);
|
||||
},
|
||||
handleAcceptConfirmChange(row) {
|
||||
row.confirmDriver = row.confirmMode === 'yes';
|
||||
this.syncNodeFields();
|
||||
},
|
||||
handleReturnConfirmChange(row) {
|
||||
row.confirmInternal = row.confirmMode === 'yes';
|
||||
this.syncNodeFields();
|
||||
},
|
||||
enforceAcceptDriver(node) {
|
||||
if (!node || (node.key !== 'accept' && node.name !== '接单')) return node;
|
||||
node.confirmDriver = node.confirmMode === 'yes';
|
||||
return node;
|
||||
},
|
||||
initDeptOptions() {
|
||||
getDeptTree(this.userInfo.tenantId).then(res => {
|
||||
const deptColumn = this.findColumn(this.option.column, 'searchDeptId');
|
||||
@@ -610,7 +614,7 @@ export default {
|
||||
return 'warning';
|
||||
},
|
||||
canEdit(row) {
|
||||
return this.hasPermission('process_config_edit') && !row.readonly;
|
||||
return this.hasPermission('process_config_edit') && !row.readonly && !row.hasRelatedWaybill;
|
||||
},
|
||||
canDelete(row) {
|
||||
return (
|
||||
@@ -626,7 +630,7 @@ export default {
|
||||
return this.hasPermission('process_config_disable') && !row.readonly && row.status === 1;
|
||||
},
|
||||
cloneNode(template) {
|
||||
return {
|
||||
const node = {
|
||||
enabled: false,
|
||||
punch: true,
|
||||
location: true,
|
||||
@@ -641,10 +645,16 @@ export default {
|
||||
supportVoucher: false,
|
||||
voucherOptions: [],
|
||||
confirmMode: 'yes',
|
||||
confirmDriver: false,
|
||||
confirmDriver: true,
|
||||
confirmInternal: false,
|
||||
...template,
|
||||
};
|
||||
if ((node.key === 'accept' || node.name === '接单') && node.confirmMode === 'yes') {
|
||||
node.confirmDriver = true;
|
||||
} else if ((node.key === 'accept' || node.name === '接单') && node.confirmMode !== 'yes') {
|
||||
node.confirmDriver = false;
|
||||
}
|
||||
return node;
|
||||
},
|
||||
resetNodeRows() {
|
||||
this.nodeRows = NODE_TEMPLATES.map(item => this.cloneNode(item));
|
||||
@@ -769,20 +779,28 @@ export default {
|
||||
this.syncNodeFields();
|
||||
},
|
||||
syncNodeFields() {
|
||||
this.nodeRows.forEach(item => this.enforceAcceptDriver(item));
|
||||
const enabledNodes = this.nodeRows.filter(item => item.enabled);
|
||||
this.form.includedNodes = enabledNodes.map(item => item.name).join(',');
|
||||
this.form.nodeConfigJson = JSON.stringify(
|
||||
this.nodeRows.map(item => ({
|
||||
key: item.key,
|
||||
name: item.name,
|
||||
type: item.type,
|
||||
enabled: item.enabled,
|
||||
confirmMode: item.confirmMode,
|
||||
confirmDriver: item.confirmDriver,
|
||||
confirmInternal: item.confirmInternal,
|
||||
punch: item.punch,
|
||||
location: item.location,
|
||||
uploadCargo: item.uploadCargo,
|
||||
cargoTypes: item.uploadCargo ? item.cargoTypes : [],
|
||||
// 在途不支持货量；其它节点按配置
|
||||
uploadCargo: item.type === 'transit' || item.key === 'transit' ? false : item.uploadCargo,
|
||||
cargoTypes:
|
||||
item.type === 'transit' || item.key === 'transit'
|
||||
? []
|
||||
: item.uploadCargo
|
||||
? item.cargoTypes
|
||||
: [],
|
||||
frequencyDays: item.frequencyDays,
|
||||
timeStart: item.timeStart,
|
||||
timeEnd: item.timeEnd,
|
||||
@@ -935,7 +953,7 @@ export default {
|
||||
);
|
||||
},
|
||||
openConfig(row, readonly = false) {
|
||||
this.dialogReadonly = readonly;
|
||||
this.dialogReadonly = readonly || !!(row && row.hasRelatedWaybill);
|
||||
if (!row || !row.id) {
|
||||
this.form = {
|
||||
configName: '',
|
||||
@@ -952,6 +970,7 @@ export default {
|
||||
}
|
||||
api.getDetail(row.id).then(res => {
|
||||
const detail = res.data.data || {};
|
||||
this.dialogReadonly = readonly || !!detail.hasRelatedWaybill;
|
||||
this.form = {
|
||||
...detail,
|
||||
defaultFinishDays:
|
||||
@@ -969,6 +988,10 @@ export default {
|
||||
},
|
||||
submitConfig(mode) {
|
||||
if (this.submitting) return;
|
||||
if (this.form.id && this.form.hasRelatedWaybill) {
|
||||
this.$message.warning('该项目已有运单，过程配置不可修改');
|
||||
return;
|
||||
}
|
||||
this.syncNodeFields();
|
||||
const submitRow = this.normalizeRow({
|
||||
...this.form,
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -50,7 +50,13 @@
|
||||
</el-tag>
|
||||
</template>
|
||||
|
||||
<template #projectName-label>项目额度信息</template>
|
||||
<template #projectQuotaInfoTitle-form>
|
||||
<div class="dialog-section-title">项目额度信息</div>
|
||||
</template>
|
||||
|
||||
<template #temporaryCreditInfoTitle-form>
|
||||
<div class="dialog-section-title">临时额度信息</div>
|
||||
</template>
|
||||
|
||||
<template #projectName-form>
|
||||
<el-select
|
||||
@@ -130,22 +136,19 @@
|
||||
</template>
|
||||
|
||||
<template #menu-form-before>
|
||||
<el-button
|
||||
v-if="!dialogReadonly"
|
||||
type="primary"
|
||||
plain
|
||||
:loading="draftLoading"
|
||||
@click="saveDraft"
|
||||
>
|
||||
保存
|
||||
</el-button>
|
||||
<template v-if="!dialogReadonly">
|
||||
<el-button @click="closeFormDialog">取消</el-button>
|
||||
<el-button type="primary" plain :loading="draftLoading" @click="saveDraft">
|
||||
保存
|
||||
</el-button>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<template #menu="{ row }">
|
||||
<el-link
|
||||
v-if="hasPermission(`${config.permission}_view`)"
|
||||
type="primary"
|
||||
@click="$refs.crud.rowView(row)"
|
||||
@click="openDetail(row)"
|
||||
>
|
||||
查看
|
||||
</el-link>
|
||||
@@ -164,6 +167,74 @@
|
||||
</template>
|
||||
</avue-crud>
|
||||
|
||||
<el-dialog
|
||||
v-model="detailVisible"
|
||||
title="查看临时额度申请"
|
||||
append-to-body
|
||||
destroy-on-close
|
||||
width="96%"
|
||||
class="temporary-credit-limit-dialog temporary-credit-limit-detail-dialog"
|
||||
>
|
||||
<div v-loading="detailLoading" class="business-crud-page__detail-content">
|
||||
<section
|
||||
v-for="section in detailSections"
|
||||
:key="section.title"
|
||||
class="temporary-credit-limit-detail-dialog__section"
|
||||
>
|
||||
<div class="dialog-section-title">{{ section.title }}</div>
|
||||
<el-descriptions :column="4" class="temporary-credit-limit-detail-dialog__descriptions">
|
||||
<el-descriptions-item
|
||||
v-for="field in section.fields"
|
||||
:key="field[0]"
|
||||
:label="field[1]"
|
||||
:span="field[2] || 1"
|
||||
>
|
||||
{{ formatDetailValue(field[0]) }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div
|
||||
v-if="section.showAttachment"
|
||||
class="temporary-credit-limit-detail-dialog__attachment"
|
||||
>
|
||||
<div class="temporary-credit-limit-page__attachment-head">
|
||||
<span class="temporary-credit-limit-detail-dialog__attachment-label">附件</span>
|
||||
<el-button type="primary" :disabled="!attachmentRows.length" @click="batchDownload">
|
||||
批量下载
|
||||
</el-button>
|
||||
</div>
|
||||
<el-table :data="attachmentRows" empty-text="暂无附件">
|
||||
<el-table-column type="index" label="序号" width="70" align="center" />
|
||||
<el-table-column label="文件名" min-width="240" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-link type="primary" @click="previewAttachment(row)">
|
||||
{{ attachmentName(row) }}
|
||||
</el-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="文件大小" width="120" align="center">
|
||||
<template #default="{ row }">{{ formatFileSize(row.size) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="uploadUserName" label="上传人" width="140" align="center" />
|
||||
<el-table-column
|
||||
prop="uploadTime"
|
||||
label="上传时间"
|
||||
:width="config.detailAttachmentUploadTimeWidth || 180"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column label="操作" width="100" align="center" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-link type="primary" @click="downloadAttachment(row)">下载</el-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<template #footer>
|
||||
<el-button @click="detailVisible = false">关闭</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<empty-pagination
|
||||
:page="page"
|
||||
@size-change="sizeChange"
|
||||
@@ -313,6 +384,9 @@ export default {
|
||||
zoom: true,
|
||||
},
|
||||
attachmentFileTypes,
|
||||
detailVisible: false,
|
||||
detailLoading: false,
|
||||
detailRow: {},
|
||||
flowBox: false,
|
||||
flowUrl: '',
|
||||
processInstanceId: '',
|
||||
@@ -323,6 +397,9 @@ export default {
|
||||
permissionList() {
|
||||
return { addBtn: this.canCreate };
|
||||
},
|
||||
detailSections() {
|
||||
return this.config.detailSections || [];
|
||||
},
|
||||
isAdmin() {
|
||||
const authority = this.userInfo?.authority;
|
||||
return Array.isArray(authority)
|
||||
@@ -341,14 +418,54 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
buildTableOption() {
|
||||
const columns = (option.column || []).map(column => ({ ...column }));
|
||||
const sectionTitleProps = ['projectQuotaInfoTitle', 'temporaryCreditInfoTitle'];
|
||||
const formGroups = [];
|
||||
let current = [];
|
||||
columns.forEach(col => {
|
||||
if (sectionTitleProps.includes(col.prop)) {
|
||||
if (current.length) formGroups.push(current);
|
||||
current = [col];
|
||||
return;
|
||||
}
|
||||
if (!current.length) return;
|
||||
// 列表/搜索专用字段不进入表单分组白卡
|
||||
if (col.addDisplay === false && col.editDisplay === false) return;
|
||||
current.push(col);
|
||||
});
|
||||
if (current.length) formGroups.push(current);
|
||||
|
||||
const formSectionProps = new Set();
|
||||
formGroups.forEach(group => {
|
||||
group.forEach(col => {
|
||||
if (col.prop) formSectionProps.add(col.prop);
|
||||
});
|
||||
});
|
||||
|
||||
// 表单字段全部进 group 拆白卡；Avue 会额外生成空的主列 group，由样式隐藏去掉顶部白横条
|
||||
return {
|
||||
...option,
|
||||
addBtn: false,
|
||||
viewBtn: false,
|
||||
editBtn: false,
|
||||
delBtn: false,
|
||||
// 隐藏 Avue 默认取消按钮，改由 menu-form-before 按「取消、保存、提交」顺序自定义
|
||||
cancelBtn: false,
|
||||
menuWidth: 320,
|
||||
column: (option.column || []).map(column => ({ ...column })),
|
||||
column: columns.map(col => {
|
||||
if (!formSectionProps.has(col.prop)) return col;
|
||||
return {
|
||||
...col,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: false,
|
||||
};
|
||||
}),
|
||||
group: formGroups.map(group => ({
|
||||
label: '',
|
||||
arrow: false,
|
||||
column: group,
|
||||
})),
|
||||
};
|
||||
},
|
||||
hasPermission(code) {
|
||||
@@ -451,6 +568,32 @@ export default {
|
||||
.then(res => this.applyDetail(res.data?.data || {}))
|
||||
.finally(done);
|
||||
},
|
||||
openDetail(row) {
|
||||
this.detailVisible = true;
|
||||
this.detailLoading = true;
|
||||
this.detailRow = { ...row };
|
||||
this.attachmentRows = [];
|
||||
this.selectedAttachments = [];
|
||||
this.api
|
||||
.getDetail(row.id)
|
||||
.then(res => {
|
||||
const detail = res.data?.data || {};
|
||||
this.detailRow = { ...detail };
|
||||
this.attachmentRows = this.parseJsonArray(detail.attachmentsJson);
|
||||
})
|
||||
.finally(() => {
|
||||
this.detailLoading = false;
|
||||
});
|
||||
},
|
||||
formatDetailValue(prop) {
|
||||
const row = this.detailRow || {};
|
||||
if (prop === 'approvalStatus') {
|
||||
return this.displayStatus(row, 'approvalStatus');
|
||||
}
|
||||
const value = row[prop];
|
||||
if (value === undefined || value === null || value === '') return '-';
|
||||
return value;
|
||||
},
|
||||
applyDetail(detail) {
|
||||
this.form = { ...detail };
|
||||
this.selectedProjectId = detail.projectId || '';
|
||||
@@ -459,9 +602,10 @@ export default {
|
||||
this.syncCurrentProjectOption();
|
||||
},
|
||||
normalizeForm(row = this.form) {
|
||||
const { projectQuotaInfoTitle, temporaryCreditInfoTitle, ...payload } = row || {};
|
||||
return {
|
||||
...row,
|
||||
applyLimit: row.applyLimit === '' ? '' : Number(row.applyLimit),
|
||||
...payload,
|
||||
applyLimit: payload.applyLimit === '' ? '' : Number(payload.applyLimit),
|
||||
attachmentsJson: JSON.stringify(this.attachmentRows),
|
||||
};
|
||||
},
|
||||
@@ -492,13 +636,20 @@ export default {
|
||||
.saveDraft(this.normalizeForm())
|
||||
.then(() => {
|
||||
this.$message.success('保存成功');
|
||||
this.$refs.crud?.closeDialog();
|
||||
this.closeFormDialog();
|
||||
this.onLoad(this.page, this.query);
|
||||
})
|
||||
.finally(() => {
|
||||
this.draftLoading = false;
|
||||
});
|
||||
},
|
||||
closeFormDialog() {
|
||||
if (typeof this.$refs.crud?.closeDialog === 'function') {
|
||||
this.$refs.crud.closeDialog();
|
||||
return;
|
||||
}
|
||||
this.$refs.crud?.$refs?.dialogForm?.hide?.();
|
||||
},
|
||||
rowDel(row) {
|
||||
this.removeRows([row]);
|
||||
},
|
||||
@@ -763,7 +914,6 @@ export default {
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 12px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
&__attachment-upload {
|
||||
@@ -825,7 +975,6 @@ export default {
|
||||
.el-form-item__label {
|
||||
height: auto !important;
|
||||
line-height: 18px;
|
||||
//padding-top: 7px; // 视觉补偿：让单行 label 仍接近 input 中线
|
||||
}
|
||||
|
||||
// 强制必填星号垂直居中于行盒，与第一行汉字字符中心同基线（关键）
|
||||
@@ -833,26 +982,257 @@ export default {
|
||||
display: inline-block;
|
||||
line-height: 18px;
|
||||
height: 18px;
|
||||
vertical-align: middle; // 关键：相对 baseline 上移，与汉字字符中心对齐
|
||||
vertical-align: middle;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
// 「项目额度信息 / 临时额度信息」小标题：对齐项目管理「项目基本信息」样式
|
||||
.avue-form__group:has(.dialog-section-title) {
|
||||
.dialog-section-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
padding: 14px 16px 4px;
|
||||
margin-bottom: 0;
|
||||
color: #303133;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.avue-form__group--flex:has(.dialog-section-title),
|
||||
.el-form-item:has(.dialog-section-title) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.el-form-item:has(.dialog-section-title) .el-form-item__content {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
// 分组白卡：Avue 实际结构为 .avue-form > .el-form > .el-row > .avue-group
|
||||
.avue-form {
|
||||
background: transparent !important;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
min-height: 0 !important;
|
||||
}
|
||||
|
||||
.avue-form > .el-form > .el-row {
|
||||
margin-left: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
// 无分区标题的空分组（Avue 主列残留）隐藏，去掉顶部白横条
|
||||
.avue-form > .el-form > .el-row > .avue-group:not(:has(.dialog-section-title)) {
|
||||
display: none !important;
|
||||
height: 0 !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
overflow: hidden !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
// 有分区标题的分组渲染为独立白卡
|
||||
.avue-form > .el-form > .el-row > .avue-group:has(.dialog-section-title) {
|
||||
background: #fff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
|
||||
margin-bottom: 12px;
|
||||
padding: 0 0 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.avue-form > .el-form > .el-row > .avue-group:has(.dialog-section-title):last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.avue-group .el-collapse {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.avue-group .el-collapse-item__header {
|
||||
display: none !important;
|
||||
height: 0 !important;
|
||||
min-height: 0 !important;
|
||||
line-height: 0 !important;
|
||||
padding: 0 !important;
|
||||
border: none !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.avue-group .avue-group__header {
|
||||
display: none !important;
|
||||
height: 0 !important;
|
||||
min-height: 0 !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.avue-group .el-collapse-item__wrap {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.avue-group .el-collapse-item__content {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
// 卡片视觉由外层 avue-group 承担，内层去白底，避免叠卡/顶条
|
||||
.avue-group .avue-form__group {
|
||||
display: flex !important;
|
||||
background: transparent !important;
|
||||
box-shadow: none !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.temporary-credit-limit-dialog .business-crud-page__detail-content .el-descriptions__label {
|
||||
width: 180px !important;
|
||||
}
|
||||
|
||||
// 仅查看（detail）态加宽 label 列：长字段名（如「剩余项目资金使用额度（万元）」）收敛为最多两行，
|
||||
// 避免撑坏详情表格。新增 / 编辑弹窗的 avue-form 无 .avue--detail 类，不受影响
|
||||
.temporary-credit-limit-dialog .avue--detail .el-form-item__label {
|
||||
width: 148px !important;
|
||||
flex: 0 0 148px !important;
|
||||
// 新增/编辑/查看：高度随内容自适应，超出时再滚动；去掉强制全屏导致的底部大片空白
|
||||
.temporary-credit-limit-dialog.el-dialog {
|
||||
margin-top: 20px !important;
|
||||
margin-bottom: 20px !important;
|
||||
height: auto !important;
|
||||
max-height: calc(100vh - 40px) !important;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.temporary-credit-limit-dialog .el-dialog__header {
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.temporary-credit-limit-dialog .el-dialog__body {
|
||||
flex: 0 1 auto;
|
||||
min-height: 0;
|
||||
max-height: calc(100vh - 140px) !important;
|
||||
display: block;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
// 覆盖全局 .el-dialog .avue-form 白底内边距，避免顶部出现白横条
|
||||
.temporary-credit-limit-dialog:not(.temporary-credit-limit-detail-dialog) .avue-form {
|
||||
background: transparent !important;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.temporary-credit-limit-dialog:not(.temporary-credit-limit-detail-dialog) .avue-dialog__footer,
|
||||
.temporary-credit-limit-detail-dialog .el-dialog__footer {
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
z-index: 5;
|
||||
flex: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 12px;
|
||||
margin-top: 0 !important;
|
||||
padding: 12px 20px !important;
|
||||
background: #fff;
|
||||
border-top: 1px solid var(--el-border-color-lighter, #ebeef5) !important;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
|
||||
.el-button + .el-button {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.temporary-credit-limit-detail-dialog {
|
||||
.business-crud-page__detail-content {
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
&__section {
|
||||
margin-bottom: 12px;
|
||||
padding: 0 0 4px;
|
||||
background: #fff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
|
||||
overflow: hidden;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&__descriptions {
|
||||
padding: 0 16px 8px;
|
||||
|
||||
// 取消 Descriptions 表格边框样式，改为纯文本描述列表
|
||||
.el-descriptions__body {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.el-descriptions__table {
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
.el-descriptions__cell {
|
||||
border: none !important;
|
||||
background: transparent !important;
|
||||
padding: 8px 12px 8px 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.el-descriptions__label {
|
||||
color: #606266;
|
||||
font-weight: 400;
|
||||
white-space: normal;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
.el-descriptions__content {
|
||||
color: #303133;
|
||||
line-height: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-section-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
padding: 14px 16px 4px;
|
||||
margin-bottom: 0;
|
||||
color: #303133;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&__attachment {
|
||||
padding: 8px 16px 16px;
|
||||
}
|
||||
|
||||
&__attachment-label {
|
||||
color: #606266;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.temporary-credit-limit-page__attachment-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-form-item--default .el-form-item__label {
|
||||
height: auto !important;
|
||||
}
|
||||
.el-dialog .avue-form{
|
||||
padding: 16px 16px 4px !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -1,116 +1,113 @@
|
||||
<template>
|
||||
<basic-container class="transport-plan-dispatch-page">
|
||||
<div v-loading="loading" class="transport-plan-dispatch-page__shell">
|
||||
<!-- 顶部信息区 -->
|
||||
<div class="transport-plan-dispatch-page__top">
|
||||
<!-- 顶部信息区：对齐运单详情汇总样式 -->
|
||||
<section-card class="transport-plan-dispatch-page__summary">
|
||||
<div class="transport-plan-dispatch-page__heading">
|
||||
<div class="transport-plan-dispatch-page__heading-title">
|
||||
<el-button icon="el-icon-arrow-left" text @click="handleBack">返回</el-button>
|
||||
<span class="transport-plan-dispatch-page__heading-name">计划调度</span>
|
||||
<span class="transport-plan-dispatch-page__heading-no">
|
||||
{{ planData.planNo || planData.loadingNo || '-' }}
|
||||
<el-button icon="el-icon-arrow-left" text @click="handleBack">返回</el-button>
|
||||
<strong>计划调度</strong>
|
||||
<span>{{ planData.planNo || planData.loadingNo || '-' }}</span>
|
||||
<span class="detail-status-text" :class="statusTextClass">
|
||||
{{ planData.businessStatusName || '-' }}
|
||||
</span>
|
||||
<span class="detail-status-text detail-transport-type">
|
||||
{{ planData.transportTypeName || '公路整车' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-grid">
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<span class="transport-plan-dispatch-page__summary-label">客户</span>
|
||||
<span class="transport-plan-dispatch-page__summary-value">
|
||||
{{ planData.customerName || '-' }}
|
||||
</span>
|
||||
<el-tag :type="getStatusTagType(planData.businessStatus)" effect="light" class="status-text">
|
||||
{{ planData.businessStatusName || '-' }}
|
||||
</el-tag>
|
||||
<el-tag type="primary" effect="light">
|
||||
{{ planData.transportTypeName || '公路整车' }}
|
||||
</el-tag>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<span class="transport-plan-dispatch-page__summary-label">合同编号</span>
|
||||
<span class="transport-plan-dispatch-page__summary-value is-link">
|
||||
{{ planData.contractNo || '-' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<span class="transport-plan-dispatch-page__summary-label">项目</span>
|
||||
<span class="transport-plan-dispatch-page__summary-value">
|
||||
{{ planData.projectName || '-' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<span class="transport-plan-dispatch-page__summary-label">计划执行时间</span>
|
||||
<span class="transport-plan-dispatch-page__summary-value">
|
||||
{{ formatDateRange(planData.planStartDate, planData.planEndDate) }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item is-goods">
|
||||
<span class="transport-plan-dispatch-page__summary-label">货物信息</span>
|
||||
<span class="transport-plan-dispatch-page__summary-value is-wrap">
|
||||
{{ planData.goodsInfo || formatGoodsInfo(planData) }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__route">
|
||||
<div class="transport-plan-dispatch-page__route-item is-start">
|
||||
<div class="transport-plan-dispatch-page__route-marker">起</div>
|
||||
<div class="transport-plan-dispatch-page__route-detail">
|
||||
<strong class="transport-plan-dispatch-page__route-name">
|
||||
{{
|
||||
formatRouteCityDistrict(planData.departureAddress || planData.departureName)
|
||||
}}
|
||||
</strong>
|
||||
<el-tooltip
|
||||
:content="planData.departureAddress || planData.departureName || '-'"
|
||||
placement="top"
|
||||
>
|
||||
<span class="transport-plan-dispatch-page__route-addr">
|
||||
{{ planData.departureAddress || planData.departureName || '-' }}
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<div class="transport-plan-dispatch-page__route-contact">
|
||||
<span>联系人：{{ planData.departureContact || '-' }}</span>
|
||||
<span>联系方式：{{ planData.departurePhone || '-' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="transport-plan-dispatch-page__route-line" aria-hidden="true" />
|
||||
<div class="transport-plan-dispatch-page__route-item is-end">
|
||||
<div class="transport-plan-dispatch-page__route-marker">终</div>
|
||||
<div class="transport-plan-dispatch-page__route-detail">
|
||||
<strong class="transport-plan-dispatch-page__route-name">
|
||||
{{ formatRouteCityDistrict(planData.arrivalAddress || planData.arrivalName) }}
|
||||
</strong>
|
||||
<el-tooltip
|
||||
:content="planData.arrivalAddress || planData.arrivalName || '-'"
|
||||
placement="top"
|
||||
>
|
||||
<span class="transport-plan-dispatch-page__route-addr">
|
||||
{{ planData.arrivalAddress || planData.arrivalName || '-' }}
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<div class="transport-plan-dispatch-page__route-contact">
|
||||
<span>联系人：{{ planData.arrivalContact || '-' }}</span>
|
||||
<span>联系方式：{{ planData.arrivalPhone || '-' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__attachments">
|
||||
<span class="transport-plan-dispatch-page__summary-label">附件</span>
|
||||
<div>
|
||||
<el-link
|
||||
v-for="(item, index) in attachmentList"
|
||||
:key="index"
|
||||
type="primary"
|
||||
:href="item.url"
|
||||
:underline="false"
|
||||
target="_blank"
|
||||
>
|
||||
{{ item.name || item.originalName || '附件' }}
|
||||
</el-link>
|
||||
<span v-if="!attachmentList.length">-</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="transport-plan-dispatch-page__summary">
|
||||
<section-card title="基本信息" class="transport-plan-dispatch-page__summary-card">
|
||||
<div class="transport-plan-dispatch-page__summary-grid">
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<div class="transport-plan-dispatch-page__summary-label">客户</div>
|
||||
<div class="transport-plan-dispatch-page__summary-value">
|
||||
{{ planData.customerName || '-' }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<div class="transport-plan-dispatch-page__summary-label">项目</div>
|
||||
<div class="transport-plan-dispatch-page__summary-value">
|
||||
{{ planData.projectName || '-' }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<div class="transport-plan-dispatch-page__summary-label">合同编号</div>
|
||||
<div class="transport-plan-dispatch-page__summary-value">
|
||||
{{ planData.contractNo || '-' }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<div class="transport-plan-dispatch-page__summary-label">计划执行时间</div>
|
||||
<div class="transport-plan-dispatch-page__summary-value">
|
||||
{{ formatDateRange(planData.planStartDate, planData.planEndDate) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item is-wide">
|
||||
<div class="transport-plan-dispatch-page__summary-label">货物信息</div>
|
||||
<div class="transport-plan-dispatch-page__summary-value">
|
||||
{{ planData.goodsInfo || formatGoodsInfo(planData) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__summary-item">
|
||||
<div class="transport-plan-dispatch-page__summary-label">附件</div>
|
||||
<div class="transport-plan-dispatch-page__summary-value">
|
||||
<template v-if="attachmentList.length">
|
||||
<el-link
|
||||
v-for="(item, index) in attachmentList"
|
||||
:key="index"
|
||||
type="primary"
|
||||
:href="item.url"
|
||||
:underline="false"
|
||||
target="_blank"
|
||||
class="transport-plan-dispatch-page__attachment-link"
|
||||
>
|
||||
{{ item.name || item.originalName || '附件' }}
|
||||
</el-link>
|
||||
</template>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section-card>
|
||||
|
||||
<section-card title="收发货路线" class="transport-plan-dispatch-page__route-card">
|
||||
<div class="transport-plan-dispatch-page__route">
|
||||
<div class="transport-plan-dispatch-page__route-item">
|
||||
<span class="transport-plan-dispatch-page__route-badge is-start">起</span>
|
||||
<div class="transport-plan-dispatch-page__route-body">
|
||||
<div class="transport-plan-dispatch-page__route-title">
|
||||
{{ planData.departureName || '-' }}
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__route-address">
|
||||
{{ formatAddress(planData.departureAddress) }}
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__route-contact">
|
||||
{{ formatContact(planData.departureContact, planData.departurePhone) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__route-vehicle">
|
||||
<el-icon><Van /></el-icon>
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__route-item">
|
||||
<span class="transport-plan-dispatch-page__route-badge is-end">终</span>
|
||||
<div class="transport-plan-dispatch-page__route-body">
|
||||
<div class="transport-plan-dispatch-page__route-title">
|
||||
{{ planData.arrivalName || '-' }}
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__route-address">
|
||||
{{ formatAddress(planData.arrivalAddress) }}
|
||||
</div>
|
||||
<div class="transport-plan-dispatch-page__route-contact">
|
||||
{{ formatContact(planData.arrivalContact, planData.arrivalPhone) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section-card>
|
||||
</div>
|
||||
</div>
|
||||
</section-card>
|
||||
|
||||
<!-- 调度列表 -->
|
||||
<section-card class="transport-plan-dispatch-page__list-card">
|
||||
@@ -204,7 +201,6 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Van } from '@element-plus/icons-vue';
|
||||
import { getDetail, dispatch } from '@/api/business/transport-plan';
|
||||
import SectionCard from '@/components/section-card/main.vue';
|
||||
import TransportPlanPage from './components/transport-plan-page.vue';
|
||||
@@ -216,7 +212,6 @@ const TRANSPORT_PLAN_QUANTITY_UNIT = '吨';
|
||||
export default {
|
||||
name: 'TransportPlanDispatch',
|
||||
components: {
|
||||
Van,
|
||||
SectionCard,
|
||||
TransportPlanPage,
|
||||
},
|
||||
@@ -237,11 +232,21 @@ export default {
|
||||
planId() {
|
||||
return this.$route.query.planId;
|
||||
},
|
||||
statusTextClass() {
|
||||
const status = this.planData.businessStatus;
|
||||
if (status === 2 || status === '2') return 'status-text-success';
|
||||
if (status === 1 || status === '1') return 'is-dispatching';
|
||||
if (status === 3 || status === '3') return 'is-danger';
|
||||
return 'is-info';
|
||||
},
|
||||
summaryText() {
|
||||
const goodsList = this.parseGoodsList(this.planData.goodsJson);
|
||||
if (!goodsList.length) {
|
||||
const total = Number(this.planData.totalQuantity || 0);
|
||||
const dispatched = this.calculateDispatchedQuantity();
|
||||
if (total <= 0) {
|
||||
return `已调度 ${dispatched.toFixed(2)}吨`;
|
||||
}
|
||||
const remaining = Math.max(total - dispatched, 0);
|
||||
return `共${total}吨 | 已调度 ${dispatched.toFixed(2)}吨，剩余${remaining.toFixed(2)}吨`;
|
||||
}
|
||||
@@ -264,6 +269,9 @@ export default {
|
||||
});
|
||||
|
||||
const parts = Object.entries(summary).map(([unit, data]) => {
|
||||
if (data.total <= 0) {
|
||||
return `已调度 ${data.dispatched.toFixed(2)}${unit}`;
|
||||
}
|
||||
const remaining = Math.max(data.total - data.dispatched, 0);
|
||||
return `${data.total}${unit} | 已调度 ${data.dispatched.toFixed(2)}${unit}，剩余${remaining.toFixed(
|
||||
2
|
||||
@@ -276,13 +284,20 @@ export default {
|
||||
const goodsList = this.parseGoodsList(this.planData.goodsJson);
|
||||
if (!goodsList.length) {
|
||||
const total = Number(this.planData.totalQuantity || 0);
|
||||
if (total <= 0) return true;
|
||||
const dispatched = this.calculateDispatchedQuantity();
|
||||
return dispatched < total;
|
||||
}
|
||||
|
||||
const hasPositiveTotal = goodsList.some(
|
||||
goods => Number(goods.quantity || 0) > 0
|
||||
);
|
||||
if (!hasPositiveTotal) return true;
|
||||
|
||||
return goodsList.some(goods => {
|
||||
const unit = goods.quantityUnit || TRANSPORT_PLAN_QUANTITY_UNIT;
|
||||
const totalQty = Number(goods.quantity || 0);
|
||||
if (totalQty <= 0) return true;
|
||||
const dispatchedQty = this.dispatchList
|
||||
.filter(item => item.quantityUnit === unit)
|
||||
.reduce((sum, item) => sum + Number(item.quantity || 0), 0);
|
||||
@@ -364,15 +379,6 @@ export default {
|
||||
calculateDispatchedQuantity() {
|
||||
return this.dispatchList.reduce((sum, item) => sum + Number(item.quantity || 0), 0);
|
||||
},
|
||||
getStatusTagType(status) {
|
||||
const statusMap = {
|
||||
0: 'info',
|
||||
1: 'warning',
|
||||
2: 'success',
|
||||
3: 'danger',
|
||||
};
|
||||
return statusMap[status] || 'info';
|
||||
},
|
||||
formatDateRange(startDate, endDate) {
|
||||
const dates = [startDate, endDate].filter(Boolean);
|
||||
return dates.length ? dates.join(' ~ ') : '-';
|
||||
@@ -382,9 +388,30 @@ export default {
|
||||
const match = address.match(/^(.*?省)?(.*?市)?(.*?区|.*?县)?/);
|
||||
return match ? match[0] || address : address;
|
||||
},
|
||||
formatContact(contact, phone) {
|
||||
const parts = [contact, phone].filter(Boolean);
|
||||
return parts.length ? parts.join(' / ') : '-';
|
||||
formatProvinceCityDistrict(value) {
|
||||
const text = String(value || '').trim();
|
||||
if (!text) return '-';
|
||||
const districtMatch = text.match(/(?:自治县|自治旗|林区|矿区|新区|开发区|区|县|旗)/);
|
||||
if (districtMatch) {
|
||||
return text.slice(0, districtMatch.index + districtMatch[0].length);
|
||||
}
|
||||
const cityMatch = text.match(/市/);
|
||||
return cityMatch ? text.slice(0, cityMatch.index + 1) : text;
|
||||
},
|
||||
formatRouteCityDistrict(value) {
|
||||
const text = String(value || '').trim();
|
||||
if (!text) return '-';
|
||||
const provinceMatch = text.match(/^.+?(?:省|自治区|特别行政区)/);
|
||||
const cityRegion = provinceMatch ? text.slice(provinceMatch[0].length) : text;
|
||||
const cityMatch = cityRegion.match(/^(.+?市)/);
|
||||
if (!cityMatch) return this.formatProvinceCityDistrict(text);
|
||||
const city = cityMatch[1];
|
||||
const remainder = cityRegion.slice(city.length);
|
||||
const districtMatch = remainder.match(
|
||||
/^(.+?(?:自治县|自治旗|林区|矿区|新区|开发区|区|县|旗){1,2})/
|
||||
);
|
||||
const district = districtMatch ? districtMatch[1] : '';
|
||||
return [city, district].filter(Boolean).join(' ');
|
||||
},
|
||||
formatDriver(row) {
|
||||
const parts = [row.driverName, row.driverPhone].filter(Boolean);
|
||||
@@ -419,32 +446,33 @@ export default {
|
||||
this.$message.warning('待调度列表货物总量已达到计划总量，不能新增调度明细');
|
||||
return;
|
||||
}
|
||||
|
||||
// 调用 transport-plan-page 组件的方法打开弹窗
|
||||
this.$nextTick(() => {
|
||||
const component = this.$refs.transportPlanPageRef;
|
||||
if (component) {
|
||||
// 设置调度数据
|
||||
component.dispatchRow = this.planData;
|
||||
component.dispatchRows = [...this.dispatchList];
|
||||
// 打开新增弹窗
|
||||
component.openDispatchItemDialog(-1);
|
||||
}
|
||||
});
|
||||
this.openPageDispatchItemDialog(-1);
|
||||
},
|
||||
handleEdit(row, index) {
|
||||
// 调用 transport-plan-page 组件的方法打开弹窗
|
||||
this.openPageDispatchItemDialog(index, row);
|
||||
},
|
||||
openPageDispatchItemDialog(index = -1, row) {
|
||||
this.$nextTick(() => {
|
||||
const component = this.$refs.transportPlanPageRef;
|
||||
if (component) {
|
||||
// 设置调度数据
|
||||
component.dispatchRow = this.planData;
|
||||
component.dispatchRows = [...this.dispatchList];
|
||||
// 打开编辑弹窗
|
||||
component.openDispatchItemDialog(index, row);
|
||||
}
|
||||
if (!component) return;
|
||||
component.dispatchRow = this.planData;
|
||||
component.dispatchRows = [...this.dispatchList];
|
||||
this.bindDispatchItemSaveSync(component);
|
||||
if (index >= 0) component.openDispatchItemDialog(index, row);
|
||||
else component.openDispatchItemDialog(-1);
|
||||
});
|
||||
},
|
||||
bindDispatchItemSaveSync(component) {
|
||||
if (component.__dispatchListSaveSynced) return;
|
||||
const originalSave = component.saveDispatchItem;
|
||||
component.saveDispatchItem = (...args) => {
|
||||
originalSave.apply(component, args);
|
||||
if (!component.dispatchItemBox) {
|
||||
this.dispatchList = [...(component.dispatchRows || [])];
|
||||
}
|
||||
};
|
||||
component.__dispatchListSaveSynced = true;
|
||||
},
|
||||
handleDelete(index) {
|
||||
this.$confirm('确定删除该调度明细?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
@@ -551,126 +579,189 @@ export default {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
&__top {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
&__summary {
|
||||
:deep(.el-card__body) {
|
||||
padding: 18px 22px;
|
||||
}
|
||||
}
|
||||
|
||||
&__heading {
|
||||
padding: 16px;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
|
||||
&-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
&-name {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
&-no {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
}
|
||||
}
|
||||
|
||||
&__summary {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
margin-bottom: 18px;
|
||||
|
||||
&-card {
|
||||
flex: 1;
|
||||
strong {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
&-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 16px;
|
||||
.detail-status-text {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 28px;
|
||||
padding: 0 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 13px;
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
&-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
|
||||
&.is-wide {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
.status-text-success,
|
||||
.is-dispatching {
|
||||
color: #67c23a;
|
||||
background: #e1f3d8;
|
||||
}
|
||||
|
||||
&-label {
|
||||
font-size: 14px;
|
||||
.detail-transport-type {
|
||||
color: #409eff;
|
||||
background: #ecf5ff;
|
||||
}
|
||||
|
||||
.is-danger {
|
||||
color: #f56c6c;
|
||||
background: #fef0f0;
|
||||
}
|
||||
|
||||
.is-info {
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
&-value {
|
||||
font-size: 14px;
|
||||
color: #303133;
|
||||
background: #f4f4f5;
|
||||
}
|
||||
}
|
||||
|
||||
&__route-card {
|
||||
flex: 1;
|
||||
&__summary-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(120px, 1fr)) minmax(360px, 1.5fr);
|
||||
gap: 16px 24px;
|
||||
}
|
||||
|
||||
&__summary-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
min-width: 0;
|
||||
|
||||
&.is-goods {
|
||||
grid-column: 1 / 5;
|
||||
}
|
||||
}
|
||||
|
||||
&__summary-label {
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
&__summary-value {
|
||||
overflow: hidden;
|
||||
color: #303133;
|
||||
font-weight: 500;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
||||
&.is-link {
|
||||
color: #409eff;
|
||||
}
|
||||
|
||||
&.is-wrap {
|
||||
white-space: normal;
|
||||
word-break: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
&__route {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(100px, 1fr) minmax(36px, 0.7fr) minmax(100px, 1fr);
|
||||
grid-row: 1 / span 3;
|
||||
grid-column: 5;
|
||||
align-items: start;
|
||||
min-width: 0;
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
&__route-item {
|
||||
display: flex;
|
||||
min-width: 0;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 24px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&-item {
|
||||
flex: 1;
|
||||
&__route-marker {
|
||||
display: inline-flex;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
border-radius: 8px;
|
||||
background: #409eff;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
|
||||
.is-end & {
|
||||
background: #67c23a;
|
||||
}
|
||||
}
|
||||
|
||||
&__route-line {
|
||||
width: 100%;
|
||||
height: 6px;
|
||||
margin-top: 15px;
|
||||
border-radius: 1px;
|
||||
background: #e4e7ed;
|
||||
}
|
||||
|
||||
&__route-detail {
|
||||
display: flex;
|
||||
min-width: 0;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
margin-top: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&__route-name {
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
color: #303133;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
line-height: 1.35;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__route-addr {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
color: #606266;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__route-contact {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 2px 8px;
|
||||
max-width: 100%;
|
||||
color: #909399;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
&__attachments {
|
||||
grid-column: 1 / 5;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
&-badge {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
flex-shrink: 0;
|
||||
|
||||
&.is-start {
|
||||
background: #67c23a;
|
||||
}
|
||||
|
||||
&.is-end {
|
||||
background: #409eff;
|
||||
}
|
||||
}
|
||||
|
||||
&-body {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
&-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
&-address,
|
||||
&-contact {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
&-vehicle {
|
||||
font-size: 24px;
|
||||
color: #909399;
|
||||
flex-wrap: wrap;
|
||||
gap: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -706,12 +797,42 @@ export default {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
&__attachment-link {
|
||||
margin-right: 12px;
|
||||
@media (max-width: 1200px) {
|
||||
&__summary-grid {
|
||||
grid-template-columns: repeat(4, minmax(130px, 1fr));
|
||||
}
|
||||
|
||||
&__summary-item.is-goods,
|
||||
&__attachments {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
&__route {
|
||||
grid-column: 1 / -1;
|
||||
grid-row: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
&__summary-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
&__route {
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
&__route-line {
|
||||
width: 10px;
|
||||
height: 32px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
&__summary-item.is-goods,
|
||||
&__attachments {
|
||||
grid-column: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.status-text {
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -16,7 +16,9 @@
|
||||
><el-select v-model="query.processStatus" clearable placeholder="全部"
|
||||
><el-option label="上传中" value="上传中" /><el-option
|
||||
label="处理中"
|
||||
value="处理中" /><el-option label="处理完成" value="处理完成" /></el-select
|
||||
value="处理中" /><el-option label="处理完成" value="处理完成" /><el-option
|
||||
label="处理失败"
|
||||
value="处理失败" /></el-select
|
||||
></el-form-item>
|
||||
<el-form-item label="运单批次号"
|
||||
><el-input v-model="query.waybillBatchNo" clearable placeholder="请输入"
|
||||
@@ -84,7 +86,14 @@
|
||||
min-width="160"
|
||||
><template #default="{ row }">{{ row.carrierName || '-' }}</template></el-table-column
|
||||
>
|
||||
<el-table-column prop="processStatus" label="处理状态" width="120" /><el-table-column
|
||||
<el-table-column prop="processStatus" label="处理状态" width="120"
|
||||
><template #default="{ row }"
|
||||
><span
|
||||
:class="{ 'voucher-manage-page__process-failed': row.processStatus === '处理失败' }"
|
||||
>{{ row.processStatus }}</span
|
||||
></template
|
||||
></el-table-column
|
||||
><el-table-column
|
||||
prop="voucherCount"
|
||||
label="凭证数量"
|
||||
width="100"
|
||||
@@ -109,7 +118,7 @@
|
||||
placement="top"
|
||||
><el-icon class="voucher-manage-page__audit-reject-icon"><WarnTriangleFilled /></el-icon
|
||||
></el-tooltip></span></template
|
||||
></el-table-column><el-table-column label="操作" width="320" fixed="right" align="center"
|
||||
></el-table-column><el-table-column label="操作" width="220" fixed="right" align="center"
|
||||
><template #default="{ row }"
|
||||
><div class="voucher-manage-page__actions">
|
||||
<el-link
|
||||
@@ -130,7 +139,7 @@
|
||||
@click="download(row)"
|
||||
>下载</el-link
|
||||
><el-link
|
||||
v-if="row.auditStatus === '审核驳回'"
|
||||
v-if="row.auditStatus === '审核驳回' || row.processStatus === '处理失败'"
|
||||
type="primary"
|
||||
@click="openUpload(row, 'reupload')"
|
||||
>重新上传</el-link
|
||||
@@ -145,7 +154,7 @@
|
||||
@click="openBatchDialog(row)"
|
||||
>更换运单批次</el-link
|
||||
><el-link
|
||||
v-if="row.processStatus === '上传中' || row.auditStatus === '审核驳回'"
|
||||
v-if="row.processStatus === '上传中' || row.processStatus === '处理失败' || row.auditStatus === '审核驳回'"
|
||||
type="danger"
|
||||
@click="removeRow(row)"
|
||||
>删除</el-link
|
||||
@@ -1238,7 +1247,15 @@ const view = async row => {
|
||||
query: { id: row.id, batchNo: row.voucherBatchNo },
|
||||
});
|
||||
};
|
||||
const download = row => window.open(row.fileUrl, '_blank');
|
||||
const download = row => {
|
||||
const url = row?.fileUrl;
|
||||
if (!url) {
|
||||
ElMessage.warning('附件地址为空，无法下载');
|
||||
return;
|
||||
}
|
||||
// 去掉 URL 中 ? 后的临时鉴权参数，避免签名过期导致无法下载
|
||||
window.open(String(url).split('?')[0], '_blank');
|
||||
};
|
||||
const handleAuditPass = row =>
|
||||
ElMessageBox.confirm(`确认审核通过凭证批次"${row.voucherBatchNo}"吗？`, '提示', {
|
||||
type: 'warning',
|
||||
@@ -1329,6 +1346,9 @@ load();
|
||||
color: #f56c6c;
|
||||
cursor: help;
|
||||
}
|
||||
&__process-failed {
|
||||
color: #f56c6c;
|
||||
}
|
||||
&__actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<basic-container class="waybill-import-page-container">
|
||||
<div class="waybill-import-page-title">导入运单</div>
|
||||
<waybill-import-dialog standalone />
|
||||
</basic-container>
|
||||
</template>
|
||||
@@ -11,28 +10,14 @@ import WaybillImportDialog from './components/waybill-import-dialog.vue';
|
||||
|
||||
<style scoped lang="scss">
|
||||
.waybill-import-page-container {
|
||||
:deep(.basic-container__card) {
|
||||
background: transparent;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
:deep(.basic-container__card > .el-card__body) {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.waybill-import-page-title {
|
||||
position: relative;
|
||||
padding: 16px 24px 12px 36px;
|
||||
border-bottom: 1px solid #eff1f7;
|
||||
color: #303133;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
left: 24px;
|
||||
width: 4px;
|
||||
height: 22px;
|
||||
border-radius: 2px;
|
||||
background: #409eff;
|
||||
content: '';
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -953,7 +953,10 @@ export default {
|
||||
this.receiverInvoiceOptions = Array.isArray(invoiceInfos) ? invoiceInfos : [];
|
||||
this.contactOptions = data.contacts || [];
|
||||
const invoiceInfoEmails = [
|
||||
...this.receiverInvoiceOptions.flatMap(item => this.parseEmails(item.email)),
|
||||
...this.receiverInvoiceOptions.flatMap(item => [
|
||||
...this.parseEmails(item.email),
|
||||
...(item.contacts || []).flatMap(contact => this.parseEmails(contact.email)),
|
||||
]),
|
||||
];
|
||||
this.departmentEmailOptions = invoiceInfoEmails.filter(Boolean).reduce((emails, email) => {
|
||||
if (!emails.some(item => item.toLowerCase() === email.toLowerCase())) emails.push(email);
|
||||
@@ -989,14 +992,19 @@ export default {
|
||||
handleReceiverChange(id) {
|
||||
const info = this.receiverInvoiceOptions.find(item => String(item.id) === String(id));
|
||||
if (!info) return;
|
||||
const invoiceContact = (info.contacts || []).find(item => item.contactName || item.email) || {};
|
||||
Object.assign(this.form, {
|
||||
receiverName: info.invoiceTitle,
|
||||
taxpayerNo: info.taxNo,
|
||||
bankName: info.bankName,
|
||||
bankAccount: info.bankAccount,
|
||||
registeredAddress: info.registeredAddress,
|
||||
email: info.email || '',
|
||||
email: invoiceContact.email || '',
|
||||
});
|
||||
if (invoiceContact.contactName) {
|
||||
this.form.contactName = invoiceContact.contactName;
|
||||
this.form.contactPhone = invoiceContact.contactPhone || '';
|
||||
}
|
||||
this.handleInvoiceTypeChange();
|
||||
},
|
||||
handleContactChange(name) {
|
||||
|
||||
@@ -1199,9 +1199,7 @@ export default {
|
||||
this.selectedAttachmentRows = [];
|
||||
this.invoices = data.invoices || [];
|
||||
this.sortAttachments();
|
||||
this.contracts = this.allContracts.filter(
|
||||
item => String(item.projectId) === String(this.form.projectId)
|
||||
);
|
||||
this.contracts = this.filterContracts(this.allContracts, this.form.projectId);
|
||||
},
|
||||
async initialize() {
|
||||
const newRecordAudit = this.recordId
|
||||
@@ -1211,6 +1209,11 @@ export default {
|
||||
createTime: this.$dayjs().format('YYYY-MM-DD HH:mm:ss'),
|
||||
};
|
||||
this.form = createFormalSettlementForm();
|
||||
if (['receivable', 'payable'].includes(this.initialData?.settlementType)) {
|
||||
this.form.settlementType = this.initialData.settlementType;
|
||||
this.form.settlementTypeName =
|
||||
this.initialData.settlementType === 'receivable' ? '应收' : '应付';
|
||||
}
|
||||
if (newRecordAudit) Object.assign(this.form, newRecordAudit);
|
||||
this.sources = [];
|
||||
this.details = [];
|
||||
@@ -1276,7 +1279,7 @@ export default {
|
||||
if (!rows.length) return;
|
||||
const first = rows[0];
|
||||
const settlementType = this.initialData.settlementType || first.settlementType || 'payable';
|
||||
const matchedContract = this.allContracts.find(
|
||||
const matchedContract = this.filterContracts(this.allContracts, null, settlementType).find(
|
||||
item =>
|
||||
(first.contractId && String(item.id) === String(first.contractId)) ||
|
||||
(first.contractNo && String(item.contractNo) === String(first.contractNo))
|
||||
@@ -1284,9 +1287,7 @@ export default {
|
||||
const contractId = first.contractId || matchedContract?.id || null;
|
||||
const projectId = first.projectId || matchedContract?.projectId || null;
|
||||
const projectName = first.projectName || matchedContract?.projectName || '';
|
||||
this.contracts = this.allContracts.filter(
|
||||
item => projectId && String(item.projectId) === String(projectId)
|
||||
);
|
||||
this.contracts = this.filterContracts(this.allContracts, projectId, settlementType);
|
||||
if (projectId && !this.projects.some(item => String(item.id) === String(projectId))) {
|
||||
this.projects.push({ id: projectId, name: projectName });
|
||||
}
|
||||
@@ -1404,6 +1405,25 @@ export default {
|
||||
this.projects = [...projectMap.values()];
|
||||
this.contracts = [];
|
||||
},
|
||||
contractCategory(settlementType = this.form.settlementType) {
|
||||
if (settlementType === 'receivable') return '客户合同';
|
||||
if (settlementType === 'payable') return '承运商合同';
|
||||
return '';
|
||||
},
|
||||
filterContracts(items, projectId, settlementType = this.form.settlementType) {
|
||||
const category = this.contractCategory(settlementType);
|
||||
return (items || []).filter(item => {
|
||||
if (projectId && String(item.projectId) !== String(projectId)) return false;
|
||||
if (!category) return true;
|
||||
const itemCategory = String(item.contractCategory || '').trim();
|
||||
if (itemCategory) return itemCategory === category;
|
||||
const itemSettlementType = String(item.settlementType || '').trim();
|
||||
return (
|
||||
(category === '客户合同' && itemSettlementType === 'receivable') ||
|
||||
(category === '承运商合同' && itemSettlementType === 'payable')
|
||||
);
|
||||
});
|
||||
},
|
||||
async loadContracts(keyword = '') {
|
||||
const projectId = this.form.projectId;
|
||||
if (!projectId) {
|
||||
@@ -1412,7 +1432,7 @@ export default {
|
||||
}
|
||||
const response = await getContractOptions(keyword, projectId);
|
||||
if (String(this.form.projectId) === String(projectId)) {
|
||||
this.contracts = this.unwrapData(response) || [];
|
||||
this.contracts = this.filterContracts(this.unwrapData(response), projectId);
|
||||
}
|
||||
},
|
||||
async loadFeeOptions() {
|
||||
@@ -1444,16 +1464,24 @@ export default {
|
||||
const contract = this.contracts.find(item => String(item.id) === String(id));
|
||||
if (!contract) return;
|
||||
const formalSettlementId = this.form.id;
|
||||
const settlementType =
|
||||
contract.settlementType ||
|
||||
(contract.contractCategory === '客户合同'
|
||||
? 'receivable'
|
||||
: contract.contractCategory === '承运商合同'
|
||||
? 'payable'
|
||||
: this.form.settlementType);
|
||||
Object.assign(this.form, contract, {
|
||||
id: formalSettlementId,
|
||||
contractId: contract.id,
|
||||
payerName:
|
||||
contract.payerName ||
|
||||
(contract.settlementType === 'receivable' ? contract.partyB : contract.partyA),
|
||||
(settlementType === 'receivable' ? contract.partyB : contract.partyA),
|
||||
payeeName:
|
||||
contract.payeeName ||
|
||||
(contract.settlementType === 'receivable' ? contract.partyA : contract.partyB),
|
||||
settlementTypeName: contract.settlementType === 'receivable' ? '应收' : '应付',
|
||||
(settlementType === 'receivable' ? contract.partyA : contract.partyB),
|
||||
settlementType,
|
||||
settlementTypeName: settlementType === 'receivable' ? '应收' : '应付',
|
||||
});
|
||||
this.sources = [];
|
||||
this.details = [];
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
page-mode
|
||||
:record-id="recordId"
|
||||
:readonly="readonly"
|
||||
:initial-data="transferPayload"
|
||||
:initial-data="editorInitialData"
|
||||
/>
|
||||
</basic-container>
|
||||
</template>
|
||||
@@ -35,6 +35,14 @@ export default {
|
||||
pageTitle() {
|
||||
return this.readonly ? '查看正式结算' : this.recordId ? '编辑正式结算' : '新增正式结算';
|
||||
},
|
||||
editorInitialData() {
|
||||
const settlementType = this.$route.query.settlementType;
|
||||
if (!this.transferPayload && !settlementType) return null;
|
||||
return {
|
||||
...(this.transferPayload || {}),
|
||||
...(settlementType ? { settlementType } : {}),
|
||||
};
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
editorVisible(value) {
|
||||
|
||||
@@ -299,7 +299,11 @@ export default {
|
||||
openCreate() {
|
||||
this.$router.push({
|
||||
path: '/settlement/formal-settlement/form',
|
||||
query: { mode: 'add', name: '新增正式结算' },
|
||||
query: {
|
||||
mode: 'add',
|
||||
name: '新增正式结算',
|
||||
settlementType: this.activeSettlementType,
|
||||
},
|
||||
});
|
||||
},
|
||||
openEdit(row) {
|
||||
|
||||
@@ -169,12 +169,6 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div
|
||||
v-if="!latestChangeLoading && !latestChangeRows.length"
|
||||
class="settlement-detail-page__empty"
|
||||
>
|
||||
暂无变更记录
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
@@ -2734,12 +2728,6 @@ export default {
|
||||
padding: 16px 0;
|
||||
}
|
||||
|
||||
.settlement-detail-page__empty {
|
||||
padding: 24px 0;
|
||||
color: #909399;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.settlement-detail-page__dialog-form {
|
||||
padding: 16px 20px;
|
||||
background: #fff;
|
||||
|
||||
+162
-32
@@ -22,6 +22,14 @@
|
||||
@tree-load="treeLoad"
|
||||
>
|
||||
<template #menu-left>
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
:loading="iamSyncLoading"
|
||||
v-if="userInfo.authority.includes('admin')"
|
||||
@click="handleIamOrganizationSync"
|
||||
>同步组织
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
@@ -42,12 +50,6 @@
|
||||
<template #deptCategory="{ row }">
|
||||
<el-tag>{{ getDeptCategoryLabel(row.deptCategory) }}</el-tag>
|
||||
</template>
|
||||
<template #leaderId="{ row }">
|
||||
{{ getLeaderValue(row.leaderId, 'realName') }}
|
||||
</template>
|
||||
<template #leaderPhone="{ row }">
|
||||
{{ getLeaderValue(row.leaderId, 'phone') }}
|
||||
</template>
|
||||
<template #status="{ row }">
|
||||
<el-tag :type="Number(row.status) === 1 ? 'success' : 'info'" class="status-text">
|
||||
{{ Number(row.status) === 1 ? '启用' : '停用' }}
|
||||
@@ -126,7 +128,15 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getLazyList, remove, update, add, getDept, getDeptTree } from '@/api/system/dept';
|
||||
import {
|
||||
getLazyList,
|
||||
remove,
|
||||
update,
|
||||
add,
|
||||
getDept,
|
||||
getDeptTree,
|
||||
syncIamOrganizations,
|
||||
} from '@/api/system/dept';
|
||||
import { getLeaderList } from '@/api/system/user';
|
||||
import { getList as getCustomerArchiveList } from '@/api/vehicle/customer-archive';
|
||||
import { mapGetters } from 'vuex';
|
||||
@@ -158,6 +168,7 @@ export default {
|
||||
selectionList: [],
|
||||
query: {},
|
||||
loading: true,
|
||||
iamSyncLoading: false,
|
||||
parentId: 0,
|
||||
page: {
|
||||
pageSize: 10,
|
||||
@@ -174,6 +185,7 @@ export default {
|
||||
searchIndex: 4,
|
||||
searchMenuPosition: 'right',
|
||||
tree: true,
|
||||
rowKey: 'id',
|
||||
border: true,
|
||||
index: true,
|
||||
selection: true,
|
||||
@@ -183,6 +195,8 @@ export default {
|
||||
dialogClickModal: false,
|
||||
labelPosition: 'right',
|
||||
labelWidth: 'auto',
|
||||
// 禁用 Avue 列状态持久化，避免增列后表头/单元格错位
|
||||
columnState: false,
|
||||
column: [
|
||||
{
|
||||
label: '组织名称',
|
||||
@@ -206,22 +220,32 @@ export default {
|
||||
maxlength: 30,
|
||||
showWordLimit: true,
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入组织编码',
|
||||
trigger: 'blur',
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
const deptCode = String(value || '').trim();
|
||||
// 组织编码非必填，为空直接通过
|
||||
if (!deptCode) {
|
||||
callback();
|
||||
return;
|
||||
}
|
||||
if (deptCode.length > 30) {
|
||||
callback(new Error('组织编码不能超过30个字符'));
|
||||
return;
|
||||
}
|
||||
if (!this.parentDeptCode) {
|
||||
const parentId = this.normalizeParentId(this.form?.parentId);
|
||||
if (!parentId) {
|
||||
callback(new Error('请先选择上级组织'));
|
||||
return;
|
||||
}
|
||||
if (!this.parentDept || String(this.parentDept.id) !== String(parentId)) {
|
||||
this.loadParentDeptCode(parentId);
|
||||
callback(new Error('正在加载上级组织编码，请稍后重试'));
|
||||
return;
|
||||
}
|
||||
if (!this.parentDeptCode) {
|
||||
callback(new Error('上级组织未配置组织编码，请先完善上级组织编码'));
|
||||
return;
|
||||
}
|
||||
const pattern = new RegExp(`^${escapeRegExp(this.parentDeptCode)}-\\d+$`);
|
||||
if (!pattern.test(deptCode)) {
|
||||
callback(new Error(`组织编码格式应为：${this.parentDeptCode}-分段数字`));
|
||||
@@ -239,6 +263,18 @@ export default {
|
||||
minWidth: 140,
|
||||
order: 60,
|
||||
},
|
||||
{
|
||||
label: '助记码',
|
||||
prop: 'mnemonicCode',
|
||||
minWidth: 120,
|
||||
order: 50,
|
||||
},
|
||||
{
|
||||
label: '拼音助记码',
|
||||
prop: 'pinyinMnemonic',
|
||||
minWidth: 140,
|
||||
order: 45,
|
||||
},
|
||||
{
|
||||
label: '组织类型',
|
||||
type: 'select',
|
||||
@@ -268,29 +304,40 @@ export default {
|
||||
label: '负责人',
|
||||
prop: 'leaderId',
|
||||
minWidth: 120,
|
||||
slot: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: false,
|
||||
formatter: row => this.getLeaderValue(row.leaderId, 'realName'),
|
||||
},
|
||||
{
|
||||
label: '联系电话',
|
||||
prop: 'leaderPhone',
|
||||
minWidth: 140,
|
||||
slot: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: false,
|
||||
formatter: row => this.getLeaderValue(row.leaderId, 'phone'),
|
||||
},
|
||||
{
|
||||
label: '助记码',
|
||||
prop: 'mnemonicCode',
|
||||
minWidth: 120,
|
||||
order: 40,
|
||||
},
|
||||
{
|
||||
label: '拼音助记码',
|
||||
prop: 'pinyinMnemonic',
|
||||
minWidth: 140,
|
||||
order: 50,
|
||||
label: '是否平台公司',
|
||||
prop: 'isPlatformCompany',
|
||||
type: 'select',
|
||||
dicData: [
|
||||
{ label: '否', value: 0 },
|
||||
{ label: '是', value: 1 },
|
||||
],
|
||||
dataType: 'number',
|
||||
value: 0,
|
||||
width: 120,
|
||||
order: 35,
|
||||
formatter: row => (Number(row.isPlatformCompany) === 1 ? '是' : '否'),
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择是否平台公司',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '排序',
|
||||
@@ -314,6 +361,7 @@ export default {
|
||||
slot: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: false,
|
||||
},
|
||||
{
|
||||
label: '上级组织',
|
||||
@@ -372,6 +420,20 @@ export default {
|
||||
};
|
||||
},
|
||||
created() {
|
||||
// 清除可能错乱的表格列顺序/列状态缓存，避免新增列后表头/单元格错位
|
||||
try {
|
||||
const path = this.$route?.path || '/system/dept';
|
||||
Object.keys(localStorage).forEach(key => {
|
||||
if (
|
||||
(key.startsWith('tms:table-column-order:') && key.includes(path)) ||
|
||||
(key.startsWith('AVUE_COLUMN_STATE:') && key.includes('dept'))
|
||||
) {
|
||||
localStorage.removeItem(key);
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
// ignore storage errors
|
||||
}
|
||||
this.loadLeaderOptions();
|
||||
},
|
||||
computed: {
|
||||
@@ -400,16 +462,47 @@ export default {
|
||||
});
|
||||
},
|
||||
handleParentChange(parentId) {
|
||||
this.loadParentDeptCode(parentId);
|
||||
// Avue tree 选择时可能先触发空值 change，避免把已加载的上级编码清掉
|
||||
const normalizedId = this.normalizeParentId(parentId);
|
||||
if (!normalizedId && this.form?.parentId) {
|
||||
return;
|
||||
}
|
||||
this.loadParentDeptCode(normalizedId || this.form?.parentId);
|
||||
},
|
||||
normalizeParentId(parentId) {
|
||||
if (Array.isArray(parentId)) {
|
||||
parentId = parentId[0];
|
||||
}
|
||||
if (parentId && typeof parentId === 'object') {
|
||||
parentId = parentId.value ?? parentId.id ?? parentId.key;
|
||||
}
|
||||
if (!parentId || String(parentId) === '0') {
|
||||
return '';
|
||||
}
|
||||
return parentId;
|
||||
},
|
||||
loadParentDeptCode(parentId) {
|
||||
this.parentDeptCode = '';
|
||||
this.parentDept = null;
|
||||
if (!parentId || String(parentId) === '0') return;
|
||||
getDept(parentId).then(res => {
|
||||
const normalizedId = this.normalizeParentId(parentId);
|
||||
if (!normalizedId) {
|
||||
this.parentDeptCode = '';
|
||||
this.parentDept = null;
|
||||
return;
|
||||
}
|
||||
getDept(normalizedId).then(res => {
|
||||
// 防止异步乱序：仅采纳当前表单上级对应的结果
|
||||
if (
|
||||
this.form?.parentId &&
|
||||
String(this.form.parentId) !== '0' &&
|
||||
String(this.form.parentId) !== String(normalizedId)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
this.parentDept = res.data.data || null;
|
||||
this.parentDeptCode = this.parentDept?.deptCode || '';
|
||||
this.updateDeptCategoryOptions();
|
||||
this.$nextTick(() => {
|
||||
this.$refs.crud?.clearValidate?.('deptCode');
|
||||
});
|
||||
});
|
||||
},
|
||||
updateDeptCategoryOptions() {
|
||||
@@ -496,6 +589,10 @@ export default {
|
||||
loadLeaderOptions(tenantId) {
|
||||
getLeaderList(tenantId).then(res => {
|
||||
this.leaderOptions = res.data.data || [];
|
||||
// formatter 依赖负责人字典，异步返回后触发表格重绘
|
||||
if (Array.isArray(this.data) && this.data.length) {
|
||||
this.data = [...this.data];
|
||||
}
|
||||
});
|
||||
},
|
||||
getDeptCategoryLabel(deptCategory) {
|
||||
@@ -510,7 +607,16 @@ export default {
|
||||
return categoryMap[Number(deptCategory)] || '-';
|
||||
},
|
||||
getLeaderValue(leaderId, field) {
|
||||
const values = func.split(leaderId);
|
||||
// func.split 空值时返回 ''，需兼容为数组，避免表格 formatter 渲染崩溃导致列错位
|
||||
const splitResult = func.split(leaderId);
|
||||
const values = Array.isArray(splitResult)
|
||||
? splitResult
|
||||
: String(splitResult || '')
|
||||
.split(',')
|
||||
.filter(Boolean);
|
||||
if (!values.length) {
|
||||
return '-';
|
||||
}
|
||||
const result = values
|
||||
.map(id => this.leaderOptions.find(item => String(item.id) === String(id))?.[field])
|
||||
.filter(Boolean);
|
||||
@@ -602,6 +708,26 @@ export default {
|
||||
done(row);
|
||||
});
|
||||
},
|
||||
handleIamOrganizationSync() {
|
||||
this.$confirm('确定从IAM同步组织信息?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
this.iamSyncLoading = true;
|
||||
return syncIamOrganizations();
|
||||
})
|
||||
.then(res => {
|
||||
const count = res?.data?.data ?? 0;
|
||||
this.$message.success(`IAM组织同步完成，共处理${count}条`);
|
||||
this.parentId = 0;
|
||||
this.onLoad(this.page, this.query);
|
||||
})
|
||||
.finally(() => {
|
||||
this.iamSyncLoading = false;
|
||||
});
|
||||
},
|
||||
handleDelete() {
|
||||
if (this.selectionList.length === 0) {
|
||||
this.$message.warning('请选择至少一条数据');
|
||||
@@ -660,6 +786,9 @@ export default {
|
||||
beforeOpen(done, type) {
|
||||
if (type === 'add') {
|
||||
this.form.tenantId = this.form.tenantId || this.userInfo.tenantId || website.tenantId;
|
||||
if (this.form.isPlatformCompany === undefined || this.form.isPlatformCompany === null) {
|
||||
this.form.isPlatformCompany = 0;
|
||||
}
|
||||
this.initData(this.form.tenantId);
|
||||
this.loadParentDeptCode(this.form.parentId);
|
||||
}
|
||||
@@ -676,7 +805,8 @@ export default {
|
||||
}
|
||||
this.loadParentDeptCode(this.form.parentId);
|
||||
if (this.form.hasOwnProperty('leaderId')) {
|
||||
this.form.leaderId = func.split(this.form.leaderId);
|
||||
const splitResult = func.split(this.form.leaderId);
|
||||
this.form.leaderId = Array.isArray(splitResult) ? splitResult : [];
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@@ -56,6 +56,14 @@
|
||||
@click="handleAudit"
|
||||
>审 核
|
||||
</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
:loading="iamSyncLoading"
|
||||
v-if="userInfo.authority.includes('admin') && !auditMode"
|
||||
@click="handleIamSync"
|
||||
>同步人员
|
||||
</el-button>
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
@@ -348,6 +356,7 @@ import {
|
||||
remove,
|
||||
update,
|
||||
add,
|
||||
syncIamAccounts,
|
||||
grant,
|
||||
resetPassword,
|
||||
setPassword,
|
||||
@@ -393,6 +402,7 @@ export default {
|
||||
selectionList: [],
|
||||
query: {},
|
||||
loading: true,
|
||||
iamSyncLoading: false,
|
||||
page: {
|
||||
pageSize: 10,
|
||||
currentPage: 1,
|
||||
@@ -553,6 +563,25 @@ export default {
|
||||
this.handleExport();
|
||||
}
|
||||
},
|
||||
handleIamSync() {
|
||||
this.$confirm('确定从IAM同步人员信息?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
this.iamSyncLoading = true;
|
||||
return syncIamAccounts();
|
||||
})
|
||||
.then(res => {
|
||||
const count = res?.data?.data ?? 0;
|
||||
this.$message.success(`IAM人员同步完成，共处理${count}条`);
|
||||
this.onLoad(this.page, this.query);
|
||||
})
|
||||
.finally(() => {
|
||||
this.iamSyncLoading = false;
|
||||
});
|
||||
},
|
||||
handleSetLeader(row) {
|
||||
const tip = row.isLeader === 1 ? '确定取消用户的主管职务?' : '确定设置用户为主管职务?';
|
||||
const message = row.isLeader === 1 ? '取消主管成功!' : '设置主管成功!';
|
||||
|
||||
@@ -120,6 +120,7 @@
|
||||
:model="driverForm"
|
||||
:rules="formRules"
|
||||
label-position="right"
|
||||
label-width="calc(4em + 24px)"
|
||||
:disabled="readonly"
|
||||
class="driver-form archive-form"
|
||||
>
|
||||
@@ -142,7 +143,7 @@
|
||||
maxlength="18"
|
||||
show-word-limit
|
||||
placeholder="请输入"
|
||||
@input="driverForm.idCardNo = String(driverForm.idCardNo || '').toUpperCase()"
|
||||
@input="handleIdCardInput"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@@ -158,7 +159,12 @@
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="性别" prop="gender">
|
||||
<el-select v-model="driverForm.gender" clearable placeholder="请选择">
|
||||
<el-select
|
||||
v-model="driverForm.gender"
|
||||
clearable
|
||||
placeholder="请选择"
|
||||
:validate-event="submitAttempted"
|
||||
>
|
||||
<el-option label="男" value="男" />
|
||||
<el-option label="女" value="女" />
|
||||
</el-select>
|
||||
@@ -302,6 +308,7 @@
|
||||
allow-create
|
||||
default-first-option
|
||||
placeholder="请选择"
|
||||
:validate-event="submitAttempted"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in drivingTypeOptions"
|
||||
@@ -321,7 +328,7 @@
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="有效期" prop="drivingLicenseEndDate">
|
||||
<div class="date-range">
|
||||
<el-date-picker
|
||||
@@ -343,7 +350,7 @@
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="长期有效" prop="drivingLicenseLongTerm">
|
||||
<el-checkbox
|
||||
v-model="driverForm.drivingLicenseLongTerm"
|
||||
@@ -395,6 +402,7 @@
|
||||
clearable
|
||||
filterable
|
||||
placeholder="请选择"
|
||||
:validate-event="submitAttempted"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in qualificationTypeOptions"
|
||||
@@ -414,7 +422,7 @@
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="有效期" prop="qualificationEndDate">
|
||||
<div class="date-range">
|
||||
<el-date-picker
|
||||
@@ -436,7 +444,7 @@
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="长期有效" prop="qualificationLongTerm">
|
||||
<el-checkbox
|
||||
v-model="driverForm.qualificationLongTerm"
|
||||
@@ -746,6 +754,7 @@ export default {
|
||||
total: 0,
|
||||
},
|
||||
readonly: false,
|
||||
submitAttempted: false,
|
||||
driverForm: emptyForm(),
|
||||
drivingLicenseUploads: {},
|
||||
uploadHeaders: getUploadHeaders(),
|
||||
@@ -1112,8 +1121,29 @@ export default {
|
||||
removeDigits(value = '') {
|
||||
return String(value).replace(/\d/g, '');
|
||||
},
|
||||
handleIdCardInput(value) {
|
||||
const idCardNo = String(value || '').toUpperCase();
|
||||
this.driverForm.idCardNo = idCardNo;
|
||||
const idCardInfo = this.parseIdCardInfo(idCardNo);
|
||||
if (idCardInfo.birthday) {
|
||||
this.driverForm.birthday = idCardInfo.birthday;
|
||||
} else {
|
||||
this.driverForm.birthday = '';
|
||||
}
|
||||
if (idCardInfo.gender) {
|
||||
this.driverForm.gender = idCardInfo.gender;
|
||||
} else {
|
||||
this.driverForm.gender = '';
|
||||
}
|
||||
if (this.submitAttempted) {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.driverForm?.validateField(['idCardNo', 'birthday', 'gender']);
|
||||
});
|
||||
}
|
||||
},
|
||||
openDriver(row, readonly = false) {
|
||||
this.readonly = readonly;
|
||||
this.submitAttempted = false;
|
||||
if (!row?.id) {
|
||||
this.driverForm = emptyForm();
|
||||
this.driverForm.organizationName = this.getCurrentOrganizationName();
|
||||
@@ -1138,6 +1168,7 @@ export default {
|
||||
this.driverForm = emptyForm();
|
||||
this.drivingLicenseUploads = {};
|
||||
this.readonly = false;
|
||||
this.submitAttempted = false;
|
||||
this.submitLoading = false;
|
||||
this.$refs.driverForm?.clearValidate();
|
||||
},
|
||||
@@ -1600,6 +1631,7 @@ export default {
|
||||
this.$refs.driverForm?.validateField(prop);
|
||||
},
|
||||
handleSubmit() {
|
||||
this.submitAttempted = true;
|
||||
this.$refs.driverForm.validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
@@ -1797,6 +1829,31 @@ export default {
|
||||
}
|
||||
|
||||
.driver-form {
|
||||
:deep(.el-form-item__label) {
|
||||
flex: 0 0 calc(4em + 24px) !important;
|
||||
width: calc(4em + 24px) !important;
|
||||
height: auto;
|
||||
white-space: normal !important;
|
||||
word-break: break-all;
|
||||
overflow-wrap: anywhere;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
:deep(.el-form-item) {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
:deep(.el-form-item.is-required .el-form-item__label) {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
:deep(.el-form-item.is-required .el-form-item__label::before) {
|
||||
display: inline-block;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
:deep(.el-date-editor.el-input),
|
||||
:deep(.el-date-editor.el-input__wrapper),
|
||||
:deep(.el-cascader),
|
||||
@@ -1809,6 +1866,12 @@ export default {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.date-range :deep(.el-date-editor) {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,430 @@
|
||||
<template>
|
||||
<basic-container class="vehicle-dispatch-page">
|
||||
<avue-crud
|
||||
ref="crud"
|
||||
v-model="form"
|
||||
v-model:page="page"
|
||||
:data="data"
|
||||
:option="option"
|
||||
:permission="permissionList"
|
||||
:table-loading="loading"
|
||||
:before-open="beforeOpen"
|
||||
@row-save="rowSave"
|
||||
@row-update="rowUpdate"
|
||||
@search-change="searchChange"
|
||||
@search-reset="searchReset"
|
||||
@selection-change="selectionChange"
|
||||
@current-change="currentChange"
|
||||
@size-change="sizeChange"
|
||||
@refresh-change="refreshChange"
|
||||
@on-load="onLoad"
|
||||
>
|
||||
<template #menu-left>
|
||||
<el-button
|
||||
v-if="hasPermission('vehicle_dispatch_add')"
|
||||
type="primary"
|
||||
@click="$refs.crud.rowAdd()"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="hasPermission('vehicle_dispatch_export')"
|
||||
type="primary"
|
||||
plain
|
||||
@click="handleExport"
|
||||
>
|
||||
导出
|
||||
</el-button>
|
||||
</template>
|
||||
<template #applicationNo="{ row }">
|
||||
<el-link type="primary" @click="$refs.crud.rowView(row)">{{ row.applicationNo }}</el-link>
|
||||
</template>
|
||||
<template #plateNo-form>
|
||||
<el-autocomplete
|
||||
class="vehicle-dispatch-form-control"
|
||||
v-model="form.plateNo"
|
||||
value-key="value"
|
||||
clearable
|
||||
:fetch-suggestions="fetchVehicleSuggestions"
|
||||
:disabled="dialogType === 'view'"
|
||||
placeholder="请选择车牌号"
|
||||
@input="handleVehicleInput"
|
||||
@select="handleVehicleSelect"
|
||||
@blur="handleVehicleBlur"
|
||||
/>
|
||||
</template>
|
||||
<template #useDepartment-form>
|
||||
<el-cascader
|
||||
class="vehicle-dispatch-form-control"
|
||||
v-model="deptCascaderValue"
|
||||
:options="deptOptions"
|
||||
:props="deptCascaderProps"
|
||||
:disabled="dialogType === 'view'"
|
||||
clearable
|
||||
filterable
|
||||
placeholder="请选择使用部门"
|
||||
@change="handleDepartmentChange"
|
||||
/>
|
||||
</template>
|
||||
<template #attachments-form>
|
||||
<vehicle-attachment-table v-model="form.attachments" :readonly="dialogType === 'view'" />
|
||||
</template>
|
||||
<template #approvalStatus="{ row }">
|
||||
<el-tag :type="statusTagType(row.approvalStatus)" class="status-text">
|
||||
{{ statusName(row.approvalStatus) }}
|
||||
</el-tag>
|
||||
</template>
|
||||
<template #menu="{ row }">
|
||||
<el-link
|
||||
v-if="hasPermission('vehicle_dispatch_view')"
|
||||
type="primary"
|
||||
@click="$refs.crud.rowView(row)"
|
||||
>
|
||||
查看
|
||||
</el-link>
|
||||
<el-link
|
||||
v-if="
|
||||
hasPermission('vehicle_dispatch_edit') &&
|
||||
['draft', 'rejected'].includes(row.approvalStatus)
|
||||
"
|
||||
type="primary"
|
||||
@click="$refs.crud.rowEdit(row)"
|
||||
>
|
||||
编辑
|
||||
</el-link>
|
||||
<el-link
|
||||
v-if="hasPermission('vehicle_dispatch_submit') && row.approvalStatus === 'draft'"
|
||||
type="primary"
|
||||
@click="handleSubmitApproval(row)"
|
||||
>
|
||||
提交
|
||||
</el-link>
|
||||
<el-link
|
||||
v-if="hasPermission('vehicle_dispatch_approve') && row.approvalStatus === 'reviewing'"
|
||||
type="success"
|
||||
@click="handleApprove(row)"
|
||||
>
|
||||
审核通过
|
||||
</el-link>
|
||||
<el-link
|
||||
v-if="
|
||||
hasPermission('vehicle_dispatch_delete') &&
|
||||
['draft', 'rejected'].includes(row.approvalStatus)
|
||||
"
|
||||
type="danger"
|
||||
@click="handleDelete(row.id)"
|
||||
>
|
||||
删除
|
||||
</el-link>
|
||||
</template>
|
||||
</avue-crud>
|
||||
<empty-pagination
|
||||
:page="page"
|
||||
@size-change="sizeChange"
|
||||
@current-change="currentChange"
|
||||
@load="onLoad(page, query)"
|
||||
/>
|
||||
</basic-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import {
|
||||
approve,
|
||||
exportVehicleDispatch,
|
||||
getDetail,
|
||||
getList,
|
||||
remove,
|
||||
submit,
|
||||
submitApproval,
|
||||
} from '@/api/transportCapacity/vehicle-dispatch';
|
||||
import { getList as getVehicleList } from '@/api/transportCapacity/transport-vehicle';
|
||||
import { getDeptTree } from '@/api/system/dept';
|
||||
import VehicleAttachmentTable from '@/components/vehicle-attachment-table/main.vue';
|
||||
import { option, statusName } from '@/option/transportCapacity/vehicle-dispatch';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
VehicleAttachmentTable,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
option,
|
||||
form: {},
|
||||
query: {},
|
||||
dialogType: '',
|
||||
deptOptions: [],
|
||||
deptCascaderValue: [],
|
||||
selectedVehicleValue: '',
|
||||
data: [],
|
||||
loading: false,
|
||||
selectionList: [],
|
||||
page: { pageSize: 10, pageSizes: [10, 20, 50, 100], currentPage: 1, total: 0 },
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.initDepartmentTree();
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['permission', 'userInfo']),
|
||||
permissionList() {
|
||||
return { addBtn: this.hasPermission('vehicle_dispatch_add') };
|
||||
},
|
||||
deptCascaderProps() {
|
||||
return { label: 'title', value: 'id', children: 'children', checkStrictly: true };
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
statusName,
|
||||
hasPermission(code) {
|
||||
return (
|
||||
String(this.userInfo?.authority || '').includes('admin') || this.permission?.[code] === true
|
||||
);
|
||||
},
|
||||
statusTagType(status) {
|
||||
return { approved: 'success', reviewing: 'warning', rejected: 'danger' }[status] || 'info';
|
||||
},
|
||||
formatAttachments(value) {
|
||||
if (!value) return '';
|
||||
if (Array.isArray(value)) return `${value.length} 个`;
|
||||
if (typeof value !== 'string') return '1 个';
|
||||
try {
|
||||
const attachments = JSON.parse(value);
|
||||
return Array.isArray(attachments) ? `${attachments.length} 个` : '1 个';
|
||||
} catch (error) {
|
||||
return `${value.split(',').filter(item => item.trim()).length} 个`;
|
||||
}
|
||||
},
|
||||
parseAttachments(value) {
|
||||
if (!value || Array.isArray(value)) return value || [];
|
||||
if (typeof value !== 'string') return [];
|
||||
try {
|
||||
const attachments = JSON.parse(value);
|
||||
return Array.isArray(attachments) ? attachments : [];
|
||||
} catch (error) {
|
||||
return value
|
||||
.split(',')
|
||||
.map(item => ({ name: item.trim(), url: item.trim() }))
|
||||
.filter(item => item.url);
|
||||
}
|
||||
},
|
||||
stringifyAttachments(value) {
|
||||
if (!value || typeof value === 'string') return value;
|
||||
return JSON.stringify(value);
|
||||
},
|
||||
normalizeRow(row) {
|
||||
const values = { ...row };
|
||||
values.attachments = this.stringifyAttachments(values.attachments);
|
||||
return values;
|
||||
},
|
||||
rowSave(row, done, loading) {
|
||||
if (!this.selectedVehicleValue || row.plateNo !== this.selectedVehicleValue) {
|
||||
this.$message.warning('请选择车牌号');
|
||||
loading();
|
||||
return;
|
||||
}
|
||||
submit(this.normalizeRow(row))
|
||||
.then(() => {
|
||||
this.onLoad();
|
||||
this.$message.success('操作成功');
|
||||
done();
|
||||
})
|
||||
.catch(() => loading());
|
||||
},
|
||||
rowUpdate(row, index, done, loading) {
|
||||
this.rowSave(row, done, loading);
|
||||
},
|
||||
beforeOpen(done, type) {
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
this.dialogType = type;
|
||||
getDetail(this.form.id)
|
||||
.then(res => {
|
||||
this.form = res.data.data || {};
|
||||
this.form.attachments = this.parseAttachments(this.form.attachments);
|
||||
this.form.applicantName = this.form.createUserName || '';
|
||||
this.form.applyTime = this.form.createTime || '';
|
||||
this.selectedVehicleValue = this.form.plateNo || '';
|
||||
this.deptCascaderValue = this.findDepartmentPath(this.form.useDepartment);
|
||||
done();
|
||||
})
|
||||
.catch(() => done());
|
||||
} else {
|
||||
this.dialogType = 'add';
|
||||
this.deptCascaderValue = [];
|
||||
this.selectedVehicleValue = '';
|
||||
this.form.attachments = [];
|
||||
this.form.approvalStatus = 'draft';
|
||||
this.form.vehicleType = '';
|
||||
this.form.applicantName =
|
||||
this.userInfo?.realName || this.userInfo?.userName || this.userInfo?.account || '';
|
||||
this.form.applyTime = this.$dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
done();
|
||||
}
|
||||
},
|
||||
initDepartmentTree() {
|
||||
getDeptTree(this.userInfo?.tenantId)
|
||||
.then(res => {
|
||||
this.deptOptions = this.filterExternalDepartments(res.data.data || []);
|
||||
})
|
||||
.catch(() => {
|
||||
this.deptOptions = [];
|
||||
});
|
||||
},
|
||||
filterExternalDepartments(tree) {
|
||||
return (tree || [])
|
||||
.filter(item => (item.title || item.deptName || item.name) !== '外部组织')
|
||||
.map(item => ({
|
||||
...item,
|
||||
children: this.filterExternalDepartments(item.children),
|
||||
}));
|
||||
},
|
||||
findDepartmentPath(departmentName, tree = this.deptOptions, parents = []) {
|
||||
if (!departmentName) return [];
|
||||
for (const item of tree || []) {
|
||||
const path = [...parents, item.id];
|
||||
const itemName = item.title || item.deptName || item.name;
|
||||
if (itemName === departmentName) return path;
|
||||
const matched = this.findDepartmentPath(departmentName, item.children, path);
|
||||
if (matched.length) return matched;
|
||||
}
|
||||
return [];
|
||||
},
|
||||
findDepartmentNode(id, tree = this.deptOptions) {
|
||||
for (const item of tree || []) {
|
||||
if (String(item.id) === String(id)) return item;
|
||||
const matched = this.findDepartmentNode(id, item.children);
|
||||
if (matched) return matched;
|
||||
}
|
||||
return null;
|
||||
},
|
||||
handleDepartmentChange(value) {
|
||||
const node = this.findDepartmentNode(value?.[value.length - 1]);
|
||||
this.form.useDepartment = node ? node.title || node.deptName || node.name || '' : '';
|
||||
},
|
||||
fetchVehicleSuggestions(queryString, callback) {
|
||||
getVehicleList(1, 9999, {
|
||||
plateNo: queryString || '',
|
||||
status: 1,
|
||||
})
|
||||
.then(res => {
|
||||
const records = res.data.data?.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: item.plateNo,
|
||||
organizationName: item.organizationName,
|
||||
vehicleType: item.vehicleType,
|
||||
}))
|
||||
);
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
},
|
||||
handleVehicleSelect(vehicle) {
|
||||
this.form.plateNo = vehicle.value;
|
||||
this.form.organizationName = vehicle.organizationName || '';
|
||||
this.form.vehicleType = vehicle.vehicleType || '';
|
||||
this.selectedVehicleValue = vehicle.value;
|
||||
},
|
||||
handleVehicleInput(value) {
|
||||
if (value !== this.selectedVehicleValue) {
|
||||
this.selectedVehicleValue = '';
|
||||
this.form.organizationName = '';
|
||||
this.form.vehicleType = '';
|
||||
}
|
||||
},
|
||||
handleVehicleBlur() {
|
||||
if (this.form.plateNo && this.form.plateNo !== this.selectedVehicleValue) {
|
||||
this.form.plateNo = '';
|
||||
this.form.organizationName = '';
|
||||
this.form.vehicleType = '';
|
||||
this.$message.warning('请从下拉列表中选择车牌号');
|
||||
}
|
||||
},
|
||||
handleSubmitApproval(row) {
|
||||
this.$confirm('确定提交该车辆调度申请吗？', '提示', { type: 'warning' })
|
||||
.then(() => submitApproval(row.id))
|
||||
.then(() => {
|
||||
this.$message.success('提交成功');
|
||||
this.onLoad();
|
||||
});
|
||||
},
|
||||
handleApprove(row) {
|
||||
this.$confirm('审核通过后将同步更新车辆使用部门，确认继续吗？', '提示', { type: 'warning' })
|
||||
.then(() => approve(row.id))
|
||||
.then(() => {
|
||||
this.$message.success('审核通过');
|
||||
this.onLoad();
|
||||
});
|
||||
},
|
||||
handleDelete(ids) {
|
||||
const targetIds = ids || this.selectionList.map(item => item.id).join(',');
|
||||
if (!targetIds) return this.$message.warning('请选择至少一条数据');
|
||||
this.$confirm('确定删除所选数据，删除后不可恢复?', '提示', { type: 'warning' })
|
||||
.then(() => remove(targetIds))
|
||||
.then(() => {
|
||||
this.$message.success('操作成功');
|
||||
this.onLoad();
|
||||
});
|
||||
},
|
||||
handleExport() {
|
||||
exportVehicleDispatch(this.query).then(res => {
|
||||
const blob = new Blob([res.data]);
|
||||
const link = document.createElement('a');
|
||||
link.href = URL.createObjectURL(blob);
|
||||
link.download = `车辆调度${this.$dayjs().format('YYYYMMDDHHmmss')}.xlsx`;
|
||||
link.click();
|
||||
URL.revokeObjectURL(link.href);
|
||||
});
|
||||
},
|
||||
searchChange(params, done) {
|
||||
this.query = { ...params };
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad();
|
||||
done();
|
||||
},
|
||||
searchReset() {
|
||||
this.query = {};
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad();
|
||||
},
|
||||
selectionChange(list) {
|
||||
this.selectionList = list;
|
||||
},
|
||||
currentChange(currentPage) {
|
||||
this.page.currentPage = currentPage;
|
||||
this.onLoad();
|
||||
},
|
||||
sizeChange(pageSize) {
|
||||
this.page.pageSize = pageSize;
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad();
|
||||
},
|
||||
refreshChange() {
|
||||
this.onLoad();
|
||||
},
|
||||
onLoad() {
|
||||
this.loading = true;
|
||||
return getList(this.page.currentPage, this.page.pageSize, this.query)
|
||||
.then(res => {
|
||||
const result = res.data.data || {};
|
||||
this.data = result.records || [];
|
||||
this.page.total = result.total || 0;
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.vehicle-dispatch-page :deep(.avue-crud__header) {
|
||||
margin-top: 12px;
|
||||
}
|
||||
.vehicle-dispatch-page :deep(.el-link + .el-link) {
|
||||
margin-left: 8px;
|
||||
}
|
||||
.vehicle-dispatch-page :deep(.vehicle-dispatch-form-control) {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@@ -127,7 +127,11 @@
|
||||
top="4vh"
|
||||
class="certification-audit-dialog"
|
||||
>
|
||||
<el-form label-position="right" label-width="auto" class="certification-audit archive-form">
|
||||
<el-form
|
||||
label-position="right"
|
||||
label-width="calc(7em + 24px)"
|
||||
class="certification-audit archive-form"
|
||||
>
|
||||
<section-card title="基础信息">
|
||||
<el-row :gutter="18">
|
||||
<el-col :span="6">
|
||||
@@ -353,7 +357,7 @@
|
||||
v-if="showRejectReason"
|
||||
class="certification-audit__reason"
|
||||
label-position="right"
|
||||
label-width="auto"
|
||||
label-width="calc(7em + 24px)"
|
||||
>
|
||||
<el-form-item label="驳回原因" required>
|
||||
<el-input
|
||||
@@ -385,6 +389,8 @@
|
||||
:model="vehicleForm"
|
||||
:rules="formRules"
|
||||
label-position="right"
|
||||
label-width="calc(4em + 24px)"
|
||||
:validate-on-rule-change="false"
|
||||
:disabled="readonly"
|
||||
class="vehicle-form archive-form"
|
||||
>
|
||||
@@ -396,7 +402,7 @@
|
||||
v-model="vehicleForm.plateNo"
|
||||
maxlength="8"
|
||||
show-word-limit
|
||||
placeholder="如：京A12345"
|
||||
placeholder="请输入"
|
||||
@input="handlePlateNoInput"
|
||||
@blur="validatePlateFormat"
|
||||
/>
|
||||
@@ -409,6 +415,7 @@
|
||||
filterable
|
||||
allow-create
|
||||
default-first-option
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleTypeOptions"
|
||||
@@ -427,6 +434,7 @@
|
||||
<el-input
|
||||
v-model="vehicleForm.outerLength"
|
||||
inputmode="numeric"
|
||||
placeholder="请输入"
|
||||
@input="vehicleForm.outerLength = digitsOnly($event)"
|
||||
/>
|
||||
</div>
|
||||
@@ -435,6 +443,7 @@
|
||||
<el-input
|
||||
v-model="vehicleForm.outerWidth"
|
||||
inputmode="numeric"
|
||||
placeholder="请输入"
|
||||
@input="vehicleForm.outerWidth = digitsOnly($event)"
|
||||
/>
|
||||
</div>
|
||||
@@ -443,6 +452,7 @@
|
||||
<el-input
|
||||
v-model="vehicleForm.outerHeight"
|
||||
inputmode="numeric"
|
||||
placeholder="请输入"
|
||||
@input="vehicleForm.outerHeight = digitsOnly($event)"
|
||||
/>
|
||||
</div>
|
||||
@@ -473,7 +483,7 @@
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="业务关系" prop="businessRelation">
|
||||
<el-select v-model="vehicleForm.businessRelation">
|
||||
<el-select v-model="vehicleForm.businessRelation" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in businessRelationOptions"
|
||||
:key="item"
|
||||
@@ -490,6 +500,7 @@
|
||||
filterable
|
||||
allow-create
|
||||
default-first-option
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in energyTypeOptions"
|
||||
@@ -509,6 +520,7 @@
|
||||
v-model="vehicleForm.compulsoryScrapDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择"
|
||||
:disabled="vehicleForm.compulsoryScrapLongTerm === 1"
|
||||
/>
|
||||
<el-checkbox
|
||||
@@ -524,7 +536,11 @@
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="海关备案号" prop="customsRecordNo">
|
||||
<el-input v-model="vehicleForm.customsRecordNo" maxlength="50" />
|
||||
<el-input
|
||||
v-model="vehicleForm.customsRecordNo"
|
||||
maxlength="50"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
@@ -563,6 +579,7 @@
|
||||
v-model="vehicleForm.drivingLicenseEndDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择"
|
||||
:disabled="vehicleForm.drivingLicenseLongTerm === 1"
|
||||
/>
|
||||
<el-checkbox
|
||||
@@ -578,7 +595,11 @@
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="道路运输证号" prop="roadTransportCertNo">
|
||||
<el-input v-model="vehicleForm.roadTransportCertNo" maxlength="50" />
|
||||
<el-input
|
||||
v-model="vehicleForm.roadTransportCertNo"
|
||||
maxlength="50"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
@@ -588,6 +609,7 @@
|
||||
v-model="vehicleForm.roadTransportCertEndDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择"
|
||||
:disabled="vehicleForm.roadTransportCertLongTerm === 1"
|
||||
/>
|
||||
<el-checkbox
|
||||
@@ -608,6 +630,7 @@
|
||||
v-model="vehicleForm.annualReviewEndDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择"
|
||||
:disabled="vehicleForm.annualReviewLongTerm === 1"
|
||||
/>
|
||||
<el-checkbox
|
||||
@@ -625,7 +648,11 @@
|
||||
<el-row :gutter="18">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="机动车登记编号" prop="registrationNo">
|
||||
<el-input v-model="vehicleForm.registrationNo" maxlength="50" />
|
||||
<el-input
|
||||
v-model="vehicleForm.registrationNo"
|
||||
maxlength="50"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
@@ -634,12 +661,17 @@
|
||||
v-model="vehicleForm.registrationDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="行驶证档案编号" prop="drivingLicenseNo">
|
||||
<el-input v-model="vehicleForm.drivingLicenseNo" maxlength="50" />
|
||||
<el-input
|
||||
v-model="vehicleForm.drivingLicenseNo"
|
||||
maxlength="50"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@@ -1632,6 +1664,50 @@ export default {
|
||||
}
|
||||
|
||||
// 车辆认证审核弹窗：与编辑弹窗一致，灰底 + section-card 白卡分组
|
||||
.certification-audit,
|
||||
.certification-audit__reason,
|
||||
.vehicle-form {
|
||||
:deep(.el-form-item__label) {
|
||||
height: auto;
|
||||
padding-right: 12px;
|
||||
white-space: normal !important;
|
||||
word-break: break-all;
|
||||
overflow-wrap: anywhere;
|
||||
line-height: 18px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
:deep(.el-form-item) {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
:deep(.el-form-item.is-required .el-form-item__label) {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
:deep(.el-form-item.is-required .el-form-item__label::before) {
|
||||
display: inline-block;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.certification-audit,
|
||||
.certification-audit__reason {
|
||||
:deep(.el-form-item__label) {
|
||||
flex: 0 0 calc(7em + 24px) !important;
|
||||
width: calc(7em + 24px) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.vehicle-form {
|
||||
:deep(.el-form-item__label) {
|
||||
flex: 0 0 calc(4em + 24px) !important;
|
||||
width: calc(4em + 24px) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.certification-audit {
|
||||
&__value {
|
||||
display: block;
|
||||
@@ -1679,6 +1755,7 @@ export default {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.dimension-group__item {
|
||||
@@ -1688,6 +1765,12 @@ export default {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.dimension-group__item :deep(.el-input) {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.dimension-group__label {
|
||||
flex-shrink: 0;
|
||||
color: #303133;
|
||||
@@ -1697,11 +1780,13 @@ export default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.date-with-flag :deep(.el-date-editor) {
|
||||
flex: 1;
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.date-with-flag :deep(.el-checkbox) {
|
||||
@@ -1719,14 +1804,12 @@ export default {
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
:deep(.el-form-item__label) {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
// 大尺寸证件照：按身份证 1.586:1 比例缩放（约真实尺寸 75%，240×151），左对齐显示
|
||||
// 证件照上传：宽度与同列表单项（输入框）对齐，高度按身份证 1.586:1 比例自适应
|
||||
:deep(.vehicle-uploader) {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
:deep(.vehicle-uploader .el-upload),
|
||||
@@ -1741,20 +1824,17 @@ export default {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// 大尺寸模式：跟随列宽自适应（最大 240px，约 1.586:1 证件比例），
|
||||
// 保证不同分辨率 / 系统缩放下都与上方输入框左右对齐
|
||||
:deep(.vehicle-uploader--large) {
|
||||
display: block;
|
||||
width: 100%;
|
||||
max-width: 240px;
|
||||
flex: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:deep(.vehicle-uploader--large .el-upload),
|
||||
:deep(.vehicle-uploader--large.el-upload) {
|
||||
width: 100%;
|
||||
height: 151px;
|
||||
height: auto;
|
||||
aspect-ratio: 1.586 / 1;
|
||||
}
|
||||
|
||||
:deep(.vehicle-uploader__image) {
|
||||
|
||||
@@ -60,15 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
clearable
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
value-key="value"
|
||||
class="accident-record-page__input"
|
||||
/>
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #directEconomicLossForm>
|
||||
<el-input
|
||||
@@ -162,6 +191,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
@@ -183,7 +215,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
const ids = [];
|
||||
@@ -215,27 +247,41 @@ export default {
|
||||
const vehicleTypeColumn = this.findColumn(this.option.column, 'vehicleType');
|
||||
const vehicleNoColumn = this.findColumn(this.option.column, 'vehicleNo');
|
||||
vehicleNoColumn.placeholder =
|
||||
vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
vehicleTypeColumn.disabled = Boolean(this.form.id);
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue && this.form.vehicleNo) {
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue) {
|
||||
this.form.vehicleNo = '';
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatAttachments(value) {
|
||||
if (!value) return '';
|
||||
@@ -392,6 +438,8 @@ export default {
|
||||
vehicleType: '车辆',
|
||||
};
|
||||
this.updateVehicleTypeDisplays('车辆');
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
this.isDetailLoading = true;
|
||||
@@ -402,6 +450,8 @@ export default {
|
||||
detail.vehicleType = detail.vehicleType || '车辆';
|
||||
this.form = detail;
|
||||
this.updateVehicleTypeDisplays(detail.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(detail.vehicleNo || '');
|
||||
})
|
||||
.finally(() => {
|
||||
this.isDetailLoading = false;
|
||||
|
||||
@@ -54,21 +54,70 @@
|
||||
>批量删除
|
||||
</el-button>
|
||||
</template>
|
||||
<template #header>
|
||||
<el-tabs
|
||||
v-model="query.expireStatus"
|
||||
type="card"
|
||||
class="annual-inspection-record-page__expiry-tabs"
|
||||
@tab-change="handleExpireChange"
|
||||
>
|
||||
<el-tab-pane
|
||||
v-for="item in expiryTagOptions"
|
||||
:key="item.value"
|
||||
:label="`${item.label}（${expiryStat[item.statKey] || 0}）`"
|
||||
:name="item.value"
|
||||
/>
|
||||
</el-tabs>
|
||||
</template>
|
||||
<template #vehicleNo="{ row, index }">
|
||||
<el-button type="primary" link @click="$refs.crud.rowView(row, index)">
|
||||
{{ row.vehicleNo }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #validUntilDate="{ row }">
|
||||
<span :class="{ 'annual-inspection-record-page__expiring': isValidUntilExpiringSoon(row) }">
|
||||
{{ row.validUntilDate || '' }}
|
||||
</span>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
placeholder="输入车牌号/船号查询选择"
|
||||
value-key="value"
|
||||
class="annual-inspection-record-page__input"
|
||||
/>
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #feeForm>
|
||||
<el-input
|
||||
@@ -93,7 +142,7 @@
|
||||
:page="page"
|
||||
@size-change="sizeChange"
|
||||
@current-change="currentChange"
|
||||
@load="onLoad(page, query)"
|
||||
@load="onLoad(page, searchForm)"
|
||||
/>
|
||||
<el-dialog title="年检记录数据导入" append-to-body v-model="excelBox" width="555px">
|
||||
<avue-form :option="excelOption" v-model="excelForm">
|
||||
@@ -108,7 +157,14 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { add, getDetail, getList, remove, update } from '@/api/vehicle/annual-inspection-record';
|
||||
import {
|
||||
add,
|
||||
getDetail,
|
||||
getExpiryStat,
|
||||
getList,
|
||||
remove,
|
||||
update,
|
||||
} from '@/api/vehicle/annual-inspection-record';
|
||||
import { getList as getVehicleList } from '@/api/transportCapacity/transport-vehicle';
|
||||
import { getList as getShipList } from '@/api/transportCapacity/transport-ship';
|
||||
import { getDeptTree } from '@/api/system/dept';
|
||||
@@ -129,7 +185,8 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
form: {},
|
||||
query: {},
|
||||
query: { expireStatus: 'all' },
|
||||
searchForm: {},
|
||||
loading: true,
|
||||
excelBox: false,
|
||||
excelForm: {},
|
||||
@@ -143,7 +200,11 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
expiryStat: { total: 0, within30: 0, expired: 0 },
|
||||
};
|
||||
},
|
||||
created() {
|
||||
@@ -170,6 +231,13 @@ export default {
|
||||
});
|
||||
return ids.join(',');
|
||||
},
|
||||
expiryTagOptions() {
|
||||
return [
|
||||
{ label: '全部', value: 'all', statKey: 'total' },
|
||||
{ label: '已过期', value: 'expired', statKey: 'expired' },
|
||||
{ label: '30天内', value: 'within30', statKey: 'within30' },
|
||||
];
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
'form.vehicleType': {
|
||||
@@ -183,6 +251,14 @@ export default {
|
||||
hasPermission(code) {
|
||||
return this.isAdmin || this.validData(this.permission[code], false);
|
||||
},
|
||||
isValidUntilExpiringSoon(row = {}) {
|
||||
if (!row.validUntilDate) return false;
|
||||
const endDate = this.$dayjs(row.validUntilDate);
|
||||
if (!endDate.isValid()) return false;
|
||||
const today = this.$dayjs().startOf('day');
|
||||
const expireSoonDate = today.add(30, 'day');
|
||||
return !endDate.isAfter(expireSoonDate, 'day');
|
||||
},
|
||||
initDeptTree() {
|
||||
getDeptTree(this.userInfo.tenantId).then(res => {
|
||||
const column = this.findColumn(this.option.column, 'createDept');
|
||||
@@ -204,25 +280,40 @@ export default {
|
||||
} else {
|
||||
this.form.shipInspectionType = undefined;
|
||||
}
|
||||
if (!this.form.id && this.form.vehicleNo) {
|
||||
if (!this.form.id) {
|
||||
this.form.vehicleNo = '';
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
// 编辑回显：确保当前值在选项中
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatAttachments(value) {
|
||||
if (!value) return '';
|
||||
@@ -365,9 +456,10 @@ export default {
|
||||
if (type === 'add') {
|
||||
this.form = {
|
||||
vehicleType: '车辆',
|
||||
inspectionAssessmentDate: this.$dayjs().format('YYYY-MM-DD'),
|
||||
};
|
||||
this.updateVehicleTypeDisplays('车辆');
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
getDetail(this.form.id).then(res => {
|
||||
@@ -375,16 +467,33 @@ export default {
|
||||
detail.attachments = this.parseAttachments(detail.attachments);
|
||||
this.form = detail;
|
||||
this.updateVehicleTypeDisplays(detail.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(detail.vehicleNo || '');
|
||||
});
|
||||
}
|
||||
done();
|
||||
},
|
||||
handleExpireChange(expireStatus) {
|
||||
this.query.expireStatus = expireStatus;
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad(this.page);
|
||||
},
|
||||
refreshStat() {
|
||||
getExpiryStat(this.buildQuery(false)).then(res => {
|
||||
this.expiryStat = {
|
||||
total: res.data.data?.total || 0,
|
||||
within30: res.data.data?.within30 || 0,
|
||||
expired: res.data.data?.expired || 0,
|
||||
};
|
||||
});
|
||||
},
|
||||
searchReset() {
|
||||
this.query = {};
|
||||
this.searchForm = {};
|
||||
this.query = { expireStatus: this.query.expireStatus || 'all' };
|
||||
this.onLoad(this.page);
|
||||
},
|
||||
searchChange(params, done) {
|
||||
this.query = params;
|
||||
this.searchForm = params;
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad(this.page, params);
|
||||
done();
|
||||
@@ -403,16 +512,34 @@ export default {
|
||||
this.page.pageSize = pageSize;
|
||||
},
|
||||
refreshChange() {
|
||||
this.onLoad(this.page, this.query);
|
||||
this.onLoad(this.page, this.searchForm);
|
||||
},
|
||||
buildQuery(includeExpire = true, params = {}) {
|
||||
const values = { ...params, ...this.searchForm };
|
||||
const { inspectionAssessmentDateRange } = values;
|
||||
if (Array.isArray(inspectionAssessmentDateRange) && inspectionAssessmentDateRange.length === 2) {
|
||||
values.inspectionAssessmentDateStart = inspectionAssessmentDateRange[0];
|
||||
values.inspectionAssessmentDateEnd = inspectionAssessmentDateRange[1];
|
||||
}
|
||||
values.inspectionAssessmentDateRange = null;
|
||||
if (
|
||||
includeExpire &&
|
||||
this.query.expireStatus &&
|
||||
this.query.expireStatus !== 'all'
|
||||
) {
|
||||
values.expireStatus = this.query.expireStatus;
|
||||
}
|
||||
return values;
|
||||
},
|
||||
onLoad(page, params = {}) {
|
||||
this.loading = true;
|
||||
getList(page.currentPage, page.pageSize, { ...params, ...this.query })
|
||||
getList(page.currentPage, page.pageSize, this.buildQuery(true, params))
|
||||
.then(res => {
|
||||
const data = res.data.data;
|
||||
this.page.total = data.total;
|
||||
this.data = data.records;
|
||||
this.selectionClear();
|
||||
this.refreshStat();
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
@@ -443,7 +570,7 @@ export default {
|
||||
},
|
||||
buildExportParams() {
|
||||
return {
|
||||
...this.query,
|
||||
...this.buildQuery(true),
|
||||
ids: this.ids,
|
||||
exportColumns: JSON.stringify(exportColumns),
|
||||
[this.website.tokenHeader]: getToken(),
|
||||
@@ -464,6 +591,42 @@ export default {
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.annual-inspection-record-page {
|
||||
:deep(.avue-crud__body > .el-card__body) {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
> * {
|
||||
order: 3;
|
||||
}
|
||||
|
||||
> .avue-crud__header {
|
||||
order: 1;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
> .annual-inspection-record-page__expiry-tabs {
|
||||
order: 2;
|
||||
}
|
||||
}
|
||||
|
||||
&__expiry-tabs {
|
||||
margin-top: 8px;
|
||||
margin-bottom: 0;
|
||||
|
||||
:deep(.el-tabs__header) {
|
||||
margin: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
:deep(.el-tabs__nav) {
|
||||
border-bottom-color: var(--el-border-color-light);
|
||||
}
|
||||
|
||||
:deep(.el-tabs__content) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table th .cell),
|
||||
:deep(.el-table td .cell) {
|
||||
white-space: nowrap;
|
||||
@@ -472,5 +635,9 @@ export default {
|
||||
&__input {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&__expiring {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -79,6 +79,27 @@
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
class="equipment-ledger-page__vehicle-select"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #equipmentCodeForm>
|
||||
<el-input v-model="form.equipmentCode" disabled />
|
||||
</template>
|
||||
@@ -167,7 +188,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
return this.selectionList.map(item => item.id).join(',');
|
||||
|
||||
@@ -60,15 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
placeholder="请选择车牌号"
|
||||
clearable
|
||||
placeholder="输入车牌号模糊查询选择"
|
||||
value-key="value"
|
||||
class="etc-record-page__input"
|
||||
/>
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
placeholder="请选择车牌号"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #transactionAmountForm>
|
||||
<el-input
|
||||
@@ -138,6 +167,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
@@ -176,17 +208,27 @@ export default {
|
||||
column.dicData = res.data.data;
|
||||
});
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
getVehicleList(1, 20, { plateNo: queryString })
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || []).map(item => item.plateNo).filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatAttachments(value) {
|
||||
if (!value) return '';
|
||||
@@ -341,6 +383,8 @@ export default {
|
||||
beforeOpen(done, type) {
|
||||
this.boxType = type;
|
||||
if (type === 'add') {
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
this.form = { dataSource: '手工录入' };
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
@@ -348,6 +392,8 @@ export default {
|
||||
const detail = res.data.data;
|
||||
detail.attachments = this.parseAttachments(detail.attachments);
|
||||
this.form = detail;
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(this.form.vehicleNo || '');
|
||||
});
|
||||
}
|
||||
done();
|
||||
|
||||
@@ -60,14 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
clearable
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
value-key="value"
|
||||
class="insurance-record-page__vehicle-input"
|
||||
/>
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #insuredAmountForm>
|
||||
<el-input
|
||||
@@ -211,6 +241,9 @@ export default {
|
||||
excelForm: {},
|
||||
isDetailLoading: false,
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
option,
|
||||
excelOption,
|
||||
page: {
|
||||
@@ -226,7 +259,7 @@ export default {
|
||||
},
|
||||
created() {
|
||||
this.initDeptTree();
|
||||
this.initOcrTemplateOptions();
|
||||
this.initOcrTemplateOptions('车辆');
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['permission', 'userInfo']),
|
||||
@@ -243,7 +276,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
const ids = [];
|
||||
@@ -271,9 +304,12 @@ export default {
|
||||
updateVehicleTypeDisplays(vehicleType, oldValue) {
|
||||
const vehicleNoColumn = this.findColumn(this.option.column, 'vehicleNo');
|
||||
vehicleNoColumn.placeholder =
|
||||
vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue && this.form.vehicleNo) {
|
||||
vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue) {
|
||||
this.form.vehicleNo = '';
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
this.initOcrTemplateOptions(vehicleType, true);
|
||||
}
|
||||
},
|
||||
initDeptTree() {
|
||||
@@ -282,8 +318,9 @@ export default {
|
||||
column.dicData = res.data.data;
|
||||
});
|
||||
},
|
||||
initOcrTemplateOptions() {
|
||||
getOcrTemplateList(1, 100, {})
|
||||
initOcrTemplateOptions(vehicleType = '车辆', resetSelected = false) {
|
||||
const type = vehicleType || '车辆';
|
||||
return getOcrTemplateList(1, 100, { vehicleType: type })
|
||||
.then(res => {
|
||||
const records = res.data.data?.records || [];
|
||||
this.ocrTemplateOptions = records.map(item => ({
|
||||
@@ -293,26 +330,44 @@ export default {
|
||||
}));
|
||||
const templateColumn = this.findColumn(this.option.column, 'ocrTemplate');
|
||||
if (templateColumn) templateColumn.dicData = this.ocrTemplateOptions;
|
||||
if (resetSelected || !this.ocrTemplateOptions.some(item => item.value === this.form.ocrTemplate)) {
|
||||
this.form.ocrTemplate = this.ocrTemplateOptions[0]?.value || '';
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.ocrTemplateOptions = [];
|
||||
const templateColumn = this.findColumn(this.option.column, 'ocrTemplate');
|
||||
if (templateColumn) templateColumn.dicData = [];
|
||||
if (resetSelected) this.form.ocrTemplate = '';
|
||||
});
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
normalizeRow(row) {
|
||||
const values = { ...row };
|
||||
@@ -421,8 +476,10 @@ export default {
|
||||
beforeOpen(done, type) {
|
||||
this.boxType = type;
|
||||
if (type === 'add') {
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
this.form.vehicleType = '车辆';
|
||||
this.form.ocrTemplate = this.ocrTemplateOptions[0]?.value || '';
|
||||
this.initOcrTemplateOptions('车辆', true);
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
this.isDetailLoading = true;
|
||||
@@ -432,6 +489,9 @@ export default {
|
||||
...res.data.data,
|
||||
vehicleType: res.data.data.vehicleType || '车辆',
|
||||
};
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(this.form.vehicleNo || '');
|
||||
return this.initOcrTemplateOptions(this.form.vehicleType);
|
||||
})
|
||||
.finally(() => {
|
||||
this.isDetailLoading = false;
|
||||
@@ -548,7 +608,7 @@ export default {
|
||||
if (filledCount > 0) {
|
||||
this.$message.success(`保单识别完成，已填充${filledCount}项`);
|
||||
} else {
|
||||
this.$message.warning('保单识别完成，未匹配到模板字段，请手动填写保险信息');
|
||||
this.$message.warning('未识别到相关字段，请手动填写保险信息');
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
|
||||
@@ -67,15 +67,44 @@
|
||||
</el-radio-group>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
clearable
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
value-key="value"
|
||||
class="maintenance-plan-page__input"
|
||||
/>
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #address-form>
|
||||
<el-input
|
||||
@@ -223,6 +252,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
option: {
|
||||
height: 'auto',
|
||||
calcHeight: 32,
|
||||
@@ -264,14 +296,17 @@ export default {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 130,
|
||||
span: 12,
|
||||
placeholder: '输入车牌号/船号查询选择',
|
||||
placeholder: '请选择车牌号/船号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号/船号', trigger: 'blur' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号/船号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'change' },
|
||||
],
|
||||
},
|
||||
{
|
||||
@@ -513,7 +548,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
let ids = [];
|
||||
@@ -537,9 +572,11 @@ export default {
|
||||
},
|
||||
handleVehicleTypeChange(vehicleType) {
|
||||
this.updateVehicleType(vehicleType);
|
||||
if (!this.form.id && this.form.vehicleNo) {
|
||||
if (!this.form.id) {
|
||||
this.form.vehicleNo = '';
|
||||
}
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
},
|
||||
updateVehicleType(vehicleType) {
|
||||
const mileageUnit = vehicleType === '船舶' ? '海里' : '公里';
|
||||
@@ -554,21 +591,33 @@ export default {
|
||||
mileageUnitColumn.value = mileageUnit;
|
||||
this.form.mileageUnit = mileageUnit;
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatMileage(value, unit) {
|
||||
if (value === undefined || value === null || value === '') return '';
|
||||
@@ -724,6 +773,8 @@ export default {
|
||||
this.form.vehicleType = '车辆';
|
||||
this.form.mileageUnit = '公里';
|
||||
this.updateVehicleType(this.form.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
getDetail(this.form.id).then(res => {
|
||||
@@ -739,6 +790,8 @@ export default {
|
||||
}
|
||||
this.form = detail;
|
||||
this.updateVehicleType(detail.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(detail.vehicleNo || '');
|
||||
});
|
||||
}
|
||||
done();
|
||||
|
||||
@@ -60,15 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
clearable
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
value-key="value"
|
||||
class="maintenance-record-page__input"
|
||||
/>
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #address-form>
|
||||
<el-input
|
||||
@@ -197,6 +226,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
option: {
|
||||
height: 'auto',
|
||||
calcHeight: 32,
|
||||
@@ -237,15 +269,17 @@ export default {
|
||||
{
|
||||
label: '车牌号/船号',
|
||||
prop: 'vehicleNo',
|
||||
type: 'select',
|
||||
slot: true,
|
||||
formslot: true,
|
||||
search: true,
|
||||
searchType: 'input',
|
||||
minWidth: 130,
|
||||
span: 12,
|
||||
placeholder: '输入车牌号/船号查询选择',
|
||||
placeholder: '请选择车牌号/船号',
|
||||
rules: [
|
||||
{ required: true, message: '请输入车牌号/船号', trigger: 'blur' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'blur' },
|
||||
{ required: true, message: '请选择车牌号/船号', trigger: 'change' },
|
||||
{ max: 30, message: '最多 30 个字符', trigger: 'change' },
|
||||
],
|
||||
},
|
||||
{
|
||||
@@ -487,7 +521,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
let ids = [];
|
||||
@@ -524,30 +558,44 @@ export default {
|
||||
const mileageColumn = this.findColumn(this.option.column, 'mileage');
|
||||
const mileageUnitColumn = this.findColumn(this.option.column, 'mileageUnit');
|
||||
vehicleNoColumn.placeholder =
|
||||
vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
vehicleTypeColumn.disabled = Boolean(this.form.id);
|
||||
mileageColumn.label = `里程/航程数（${mileageUnit}）`;
|
||||
mileageUnitColumn.value = mileageUnit;
|
||||
this.form.mileageUnit = mileageUnit;
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue && this.form.vehicleNo) {
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue) {
|
||||
this.form.vehicleNo = '';
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatMileage(value, unit) {
|
||||
if (this.normalizeMileageValue(value) === null) return '';
|
||||
@@ -681,6 +729,8 @@ export default {
|
||||
mileageUnit: '公里',
|
||||
};
|
||||
this.updateVehicleType('车辆');
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
this.isDetailLoading = true;
|
||||
@@ -693,6 +743,8 @@ export default {
|
||||
detail.mileage = this.normalizeMileageValue(detail.mileage);
|
||||
this.form = detail;
|
||||
this.updateVehicleType(detail.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(detail.vehicleNo || '');
|
||||
})
|
||||
.finally(() => {
|
||||
this.isDetailLoading = false;
|
||||
|
||||
@@ -72,15 +72,44 @@
|
||||
<span>{{ formatMileage(row.totalMileage) }}</span>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="Boolean(form.id)"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
placeholder="请选择车牌号"
|
||||
clearable
|
||||
placeholder="输入车牌号模糊查询选择"
|
||||
value-key="value"
|
||||
class="mileage-record-page__input"
|
||||
/>
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
placeholder="请选择车牌号"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #previousMonthMileageForm>
|
||||
<el-input
|
||||
@@ -213,6 +242,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
@@ -251,13 +283,27 @@ export default {
|
||||
column.dicData = res.data.data;
|
||||
});
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
getVehicleList(1, 20, { plateNo: queryString })
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(records.map(item => ({ value: item.plateNo })));
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || []).map(item => item.plateNo).filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatMileage(value) {
|
||||
if (this.isEmpty(value)) {
|
||||
@@ -446,6 +492,8 @@ export default {
|
||||
const vehicleNoColumn = this.findColumn(this.option.column, 'vehicleNo');
|
||||
vehicleNoColumn.disabled = type !== 'add';
|
||||
if (type === 'add') {
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
this.form.vehicleType = '车辆';
|
||||
this.form.mileageUnit = '公里';
|
||||
}
|
||||
@@ -456,6 +504,8 @@ export default {
|
||||
detail.vehicleType = '车辆';
|
||||
detail.mileageUnit = '公里';
|
||||
this.form = detail;
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(this.form.vehicleNo || '');
|
||||
});
|
||||
}
|
||||
done();
|
||||
|
||||
@@ -60,15 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
clearable
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
value-key="value"
|
||||
class="oil-electric-record-page__input"
|
||||
/>
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #quantityForm>
|
||||
<el-input
|
||||
@@ -171,6 +200,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
@@ -192,7 +224,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
const ids = [];
|
||||
@@ -229,9 +261,11 @@ export default {
|
||||
updateVehicleType(vehicleType, oldValue) {
|
||||
const vehicleNoColumn = this.findColumn(this.option.column, 'vehicleNo');
|
||||
vehicleNoColumn.placeholder =
|
||||
vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue && this.form.vehicleNo) {
|
||||
vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue) {
|
||||
this.form.vehicleNo = '';
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
},
|
||||
updateFeeType(feeType) {
|
||||
@@ -241,21 +275,33 @@ export default {
|
||||
this.form.oilProduct = undefined;
|
||||
}
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatAttachments(value) {
|
||||
if (!value) return '';
|
||||
@@ -415,6 +461,8 @@ export default {
|
||||
if (type === 'add') {
|
||||
this.form = { vehicleType: '车辆', feeType: '加油', dataSource: '手工录入' };
|
||||
this.updateVehicleType('车辆');
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
this.updateFeeType('加油');
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
@@ -426,6 +474,8 @@ export default {
|
||||
detail.vehicleType = detail.vehicleType || '车辆';
|
||||
this.form = detail;
|
||||
this.updateVehicleType(detail.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(detail.vehicleNo || '');
|
||||
this.updateFeeType(detail.feeType);
|
||||
})
|
||||
.finally(() => {
|
||||
|
||||
@@ -60,15 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
clearable
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
value-key="value"
|
||||
class="other-expense-record-page__input"
|
||||
/>
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #amountForm>
|
||||
<el-input
|
||||
@@ -108,6 +137,7 @@ import { add, getDetail, getList, remove, update } from '@/api/vehicle/other-exp
|
||||
import { getList as getVehicleList } from '@/api/transportCapacity/transport-vehicle';
|
||||
import { getList as getShipList } from '@/api/transportCapacity/transport-ship';
|
||||
import { getDeptTree } from '@/api/system/dept';
|
||||
import { getDictionary } from '@/api/system/dictbiz';
|
||||
import { exportBlob } from '@/api/common';
|
||||
import { downloadXls } from '@/utils/util';
|
||||
import { openImportDialog } from '@/utils/import-excel';
|
||||
@@ -140,11 +170,15 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.initDeptTree();
|
||||
this.initExpenseTypeOptions();
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['permission', 'userInfo']),
|
||||
@@ -161,7 +195,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
const ids = [];
|
||||
@@ -189,29 +223,52 @@ export default {
|
||||
column.dicData = res.data.data;
|
||||
});
|
||||
},
|
||||
initExpenseTypeOptions() {
|
||||
getDictionary({ code: 'other_fee_category' }).then(res => {
|
||||
const column = this.findColumn(this.option.column, 'expenseType');
|
||||
column.dicData = (res.data.data || []).map(item => ({
|
||||
label: item.dictValue,
|
||||
value: item.dictValue,
|
||||
}));
|
||||
});
|
||||
},
|
||||
updateVehicleType(vehicleType, oldValue) {
|
||||
const vehicleNoColumn = this.findColumn(this.option.column, 'vehicleNo');
|
||||
vehicleNoColumn.placeholder =
|
||||
vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue && this.form.vehicleNo) {
|
||||
vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue) {
|
||||
this.form.vehicleNo = '';
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatAttachments(value) {
|
||||
if (!value) return '';
|
||||
@@ -369,6 +426,8 @@ export default {
|
||||
dataSource: '手工录入',
|
||||
};
|
||||
this.updateVehicleType('车辆');
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
this.isDetailLoading = true;
|
||||
@@ -379,6 +438,8 @@ export default {
|
||||
detail.vehicleType = detail.vehicleType || '车辆';
|
||||
this.form = detail;
|
||||
this.updateVehicleType(detail.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(detail.vehicleNo || '');
|
||||
})
|
||||
.finally(() => {
|
||||
this.isDetailLoading = false;
|
||||
|
||||
@@ -60,15 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
placeholder="请选择车牌号"
|
||||
clearable
|
||||
placeholder="输入车牌号查询选择"
|
||||
value-key="value"
|
||||
class="tire-replacement-record-page__input"
|
||||
/>
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
placeholder="请选择车牌号"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #tireQuantityForm>
|
||||
<el-input
|
||||
@@ -158,6 +187,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
@@ -196,13 +228,27 @@ export default {
|
||||
column.dicData = res.data.data;
|
||||
});
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
getVehicleList(1, 20, { plateNo: queryString })
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(records.map(item => ({ value: item.plateNo })));
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || []).map(item => item.plateNo).filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatAttachments(value) {
|
||||
if (!value) return '';
|
||||
@@ -339,6 +385,8 @@ export default {
|
||||
beforeOpen(done, type) {
|
||||
this.boxType = type;
|
||||
if (type === 'add') {
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
this.form = {};
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
@@ -346,6 +394,8 @@ export default {
|
||||
const detail = res.data.data;
|
||||
detail.attachments = this.parseAttachments(detail.attachments);
|
||||
this.form = detail;
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(this.form.vehicleNo || '');
|
||||
});
|
||||
}
|
||||
done();
|
||||
|
||||
@@ -60,15 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
clearable
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
value-key="value"
|
||||
class="transport-change-record-page__input"
|
||||
/>
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #attachments="{ row }">
|
||||
<span>{{ formatAttachments(row.attachments) }}</span>
|
||||
@@ -134,6 +163,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
@@ -155,7 +187,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
const ids = [];
|
||||
@@ -186,26 +218,40 @@ export default {
|
||||
updateVehicleType(vehicleType, oldValue) {
|
||||
const vehicleNoColumn = this.findColumn(this.option.column, 'vehicleNo');
|
||||
vehicleNoColumn.placeholder =
|
||||
vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue && this.form.vehicleNo) {
|
||||
vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue) {
|
||||
this.form.vehicleNo = '';
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
formatAttachments(value) {
|
||||
if (!value) return '';
|
||||
@@ -333,6 +379,8 @@ export default {
|
||||
if (type === 'add') {
|
||||
this.form = { vehicleType: '车辆' };
|
||||
this.updateVehicleType('车辆');
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
this.isDetailLoading = true;
|
||||
@@ -343,6 +391,8 @@ export default {
|
||||
detail.vehicleType = detail.vehicleType || '车辆';
|
||||
this.form = detail;
|
||||
this.updateVehicleType(detail.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(detail.vehicleNo || '');
|
||||
})
|
||||
.finally(() => {
|
||||
this.isDetailLoading = false;
|
||||
|
||||
@@ -60,15 +60,44 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #vehicleNoForm>
|
||||
<el-autocomplete
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:fetch-suggestions="fetchVehicleOptions"
|
||||
:disabled="boxType === 'view'"
|
||||
clearable
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
value-key="value"
|
||||
class="violation-record-page__input"
|
||||
/>
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #vehicleNo-form>
|
||||
<el-select
|
||||
v-model="form.vehicleNo"
|
||||
:disabled="boxType === 'view'"
|
||||
:loading="vehicleOptionsLoading"
|
||||
:placeholder="vehicleNoPlaceholder"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="loadVehicleOptions"
|
||||
@visible-change="handleVehicleSelectVisible"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #driverNameForm>
|
||||
<el-autocomplete
|
||||
@@ -204,6 +233,9 @@ export default {
|
||||
},
|
||||
selectionList: [],
|
||||
boxType: '',
|
||||
vehicleOptions: [],
|
||||
vehicleOptionsLoading: false,
|
||||
vehicleOptionsRequestId: 0,
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
@@ -226,7 +258,7 @@ export default {
|
||||
};
|
||||
},
|
||||
vehicleNoPlaceholder() {
|
||||
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
},
|
||||
ids() {
|
||||
const ids = [];
|
||||
@@ -284,7 +316,7 @@ export default {
|
||||
const typeColumn = this.findColumn(this.option.column, 'violationType');
|
||||
const itemColumn = this.findColumn(this.option.column, 'violationItem');
|
||||
vehicleNoColumn.placeholder =
|
||||
vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
|
||||
vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
|
||||
driverColumn.label = vehicleType === '船舶' ? '船长' : '驾驶人';
|
||||
typeColumn.display = vehicleType !== '船舶';
|
||||
itemColumn.display = vehicleType === '船舶';
|
||||
@@ -303,6 +335,8 @@ export default {
|
||||
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue) {
|
||||
this.form.vehicleNo = '';
|
||||
this.form.driverName = '';
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
}
|
||||
if (vehicleType === '船舶') {
|
||||
this.form.violationType = undefined;
|
||||
@@ -317,21 +351,33 @@ export default {
|
||||
this.form.processResult = undefined;
|
||||
}
|
||||
},
|
||||
fetchVehicleOptions(queryString, callback) {
|
||||
handleVehicleSelectVisible(visible) {
|
||||
if (visible && !this.vehicleOptions.length) this.loadVehicleOptions('');
|
||||
},
|
||||
loadVehicleOptions(queryString = '') {
|
||||
const vehicleType = this.form.vehicleType || '车辆';
|
||||
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
|
||||
const params =
|
||||
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const isShip = vehicleType === '船舶';
|
||||
const request = isShip ? getShipList : getVehicleList;
|
||||
const params = isShip ? { shipIdentifierNo: queryString } : { plateNo: queryString };
|
||||
const requestId = ++this.vehicleOptionsRequestId;
|
||||
this.vehicleOptionsLoading = true;
|
||||
request(1, 20, params)
|
||||
.then(res => {
|
||||
const records = res.data.data.records || [];
|
||||
callback(
|
||||
records.map(item => ({
|
||||
value: vehicleType === '船舶' ? item.shipIdentifierNo || item.shipName : item.plateNo,
|
||||
}))
|
||||
);
|
||||
if (requestId !== this.vehicleOptionsRequestId) return;
|
||||
const values = (res.data.data.records || [])
|
||||
.map(item => (isShip ? item.shipIdentifierNo || item.shipName : item.plateNo))
|
||||
.filter(Boolean);
|
||||
this.vehicleOptions = [...new Set(values)].map(value => ({ label: value, value }));
|
||||
if (this.form.vehicleNo && !this.vehicleOptions.some(item => item.value === this.form.vehicleNo)) {
|
||||
this.vehicleOptions.unshift({ label: this.form.vehicleNo, value: this.form.vehicleNo });
|
||||
}
|
||||
})
|
||||
.catch(() => callback([]));
|
||||
.catch(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptions = [];
|
||||
})
|
||||
.finally(() => {
|
||||
if (requestId === this.vehicleOptionsRequestId) this.vehicleOptionsLoading = false;
|
||||
});
|
||||
},
|
||||
fetchDriverOptions(queryString, callback) {
|
||||
getDriverList(1, 20, { driverName: queryString })
|
||||
@@ -418,7 +464,7 @@ export default {
|
||||
row.violationTime &&
|
||||
new Date(row.violationTime.replace(/-/g, '/')).getTime() > Date.now()
|
||||
) {
|
||||
this.$message.warning('时间不能超过当前时间');
|
||||
this.$message.warning('日期不能超过当前时间');
|
||||
return false;
|
||||
}
|
||||
if (Number(row.fineAmount) < 0) {
|
||||
@@ -512,6 +558,8 @@ export default {
|
||||
attachments: [],
|
||||
};
|
||||
this.updateVehicleTypeDisplays('车辆');
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions('');
|
||||
this.updateProcessResultDisplay('已处理');
|
||||
}
|
||||
if (['edit', 'view'].includes(type)) {
|
||||
@@ -524,6 +572,8 @@ export default {
|
||||
detail.processStatus = detail.processStatus || '未处理';
|
||||
this.form = detail;
|
||||
this.updateVehicleTypeDisplays(detail.vehicleType);
|
||||
this.vehicleOptions = [];
|
||||
this.loadVehicleOptions(detail.vehicleNo || '');
|
||||
this.updateProcessResultDisplay(detail.processStatus);
|
||||
})
|
||||
.finally(() => {
|
||||
|
||||
Reference in New Issue
Block a user