30 Commits

Author SHA1 Message Date
b2894lxlx 50ab33f369 Merge remote-tracking branch 'websoft/master'
# Conflicts:
#	src/views/business/project-apply.vue
2026-09-18 18:26:13 +08:00
b2894lxlx bcbc45bb03 调整 用户 2026-09-18 18:25:52 +08:00
gxwebsoft ff9fb9168b fix(router): 修复运单管理详情路由及合同详情路由重复定义问题
- 为 waybill-manage-page、transport-plan-page 等组件增加 routePathLocked 变量锁定路由路径
- 添加 isOwnedRouteActive 计算属性,防止缓存实例错误读取其它路由的 detailId 导致误请求
- watcher 和 openDetail 方法中添加路由守卫,避免多余的请求和误开详情标签
- 修改宿主视图绑定 detailId,避免直接绑定全局 $route.query 导致缓存污染
- 删除 router/views/index.js 中合同管理详情路由重复定义,防止内容区空白问题
- 优化 waybill-import-dialog 组件样式和结构,增加 section-card 包裹表单区域
- 调整相关组件 data、computed、watch 使用,确保第一次立即 watcher 正确读取路由数据
- 验证所有改动后相关页面 HTTP 200,标签页行为正常,解决「运单管理不存在」和合同详情空白问题
2026-09-18 12:22:25 +08:00
gxwebsoft 986feff7b7 fix(waybill-manage): 修复运单详情弹窗残留问题
- 页面形态状态(列表/独立表单页/独立详情页)在实例创建时锁定,避免随路由变化切换导致弹窗残留
- 模板中形态相关所有判定改为使用锁定状态变量,保证渲染一致性
- 修改 detailContainer、crudContainer、pageFormOption 等方法使用锁定状态,避免缓存实例 option 变形
- 新增 closeInnerDialogs 方法,在组件 deactivated 和 beforeUnmount 生命周期关闭所有 append-to-body 弹窗
- 解决标签页 keep-alive 机制下弹窗 Teleport 持续遗留导致界面异常的问题
- 对运单管理页面多处弹窗和视图控制做统一修复,提升页面稳定性和体验
2026-09-18 11:29:52 +08:00
gxwebsoft 3e7110ca8c fix(waybill-manage): 修复运单详情弹窗残留问题
- 页面形态状态(列表/独立表单页/独立详情页)在实例创建时锁定,避免随路由变化切换导致弹窗残留
- 模板中形态相关所有判定改为使用锁定状态变量,保证渲染一致性
- 修改 detailContainer、crudContainer、pageFormOption 等方法使用锁定状态,避免缓存实例 option 变形
- 新增 closeInnerDialogs 方法,在组件 deactivated 和 beforeUnmount 生命周期关闭所有 append-to-body 弹窗
- 解决标签页 keep-alive 机制下弹窗 Teleport 持续遗留导致界面异常的问题
- 对运单管理页面多处弹窗和视图控制做统一修复,提升页面稳定性和体验
2026-09-18 11:17:50 +08:00
gxwebsoft b4e12a671f fix(views): 修复独立页切换时弹窗残留问题
- 独立整页固定使用普通 div 容器,取消动态切换 el-dialog 避免切换时弹窗 DOM 残留
- 删除相关 dialogVisible、dialogTitle、页脚弹窗动态分支代码以简化逻辑
- watch $route 调整,优化独立页初始化流程,避免不必要的关闭弹窗操作
- 新增 closeInnerDialogs 方法,页面卸载或 keep-alive deactivate 时关闭所有二级弹窗
- 对 loading-manage 与 project-apply 两个模块同步改造,统一处理弹窗状态和容器渲染
- 解决 keep-alive 缓存导致旧弹窗一直挂载在 body 上的问题,改善用户切换体验
2026-09-18 10:17:48 +08:00
gxwebsoft 5bb072223f feat(loading-manage): 配载管理详情及重新派单改用独立页面
- 新增 `/business/loading-manage/detail` 路由,详情页由独立页面承载
- 统一将新增、编辑、详情和重新派单均采用独立表单页/详情页显示
- 修改组件内逻辑,新增 `isStandalonePage` 计算属性统一控制页面与弹窗切换
- 修改列表页链接及操作行为,详情和重新派单按钮跳转至对应独立页面
- 去除旧详情弹窗模式,相关样式调整支持独立页面自然滚动
- 添加路由监听,支持页面刷新和切换时正确初始化详情或表单数据
- 兼容老链接 `/business/loading-manage?detailId=x` 自动跳详情新路由
- 修正弹窗底栏样式,去除写死间距,统一由全局规则控制
- 代码中禁止顶层 scoped style 使用 `//` 注释,改用 `/* */` 避免编译错误
2026-09-17 22:40:41 +08:00
gxwebsoft 3d6e297147 feat(vehicle): 归一化保险记录导入日期格式,修复设备台账批量删除按钮
- 保险记录批量导入时,前端读取 Excel 并规范日期格式为 YYYY-MM-DD,兼容多种日期写法
- 重写 `handleImport` 支持自定义上传逻辑,调用归一化处理后再上传文件
- 添加日期归一化相关方法,确保不合法或已标准格式保持原值
- 设备台账界面新增批量删除按钮及相关逻辑,支持多选数据批量删除并提示确认
- 补充导出含创建时间和更新时间的后端修复说明,避免导出时间字段为空问题
- 说明后端导出分配逻辑,强调导出字段由后端控制,前端修改导出列无效
2026-09-17 21:21:33 +08:00
gxwebsoft 82fbb99593 fix(payment): 优化发票申请及收据表单提示和样式
- 简化合并开票结算单的合同限制提示文案
- 调整发票申请表单搜索区域的内容左对齐样式
- 修正发票收据表单关键词输入框的占位符文字错误
2026-09-17 14:59:26 +08:00
gxwebsoft 17c482e21a feat(waybill): 优化打卡时间轴按打卡时间排序展示
- 新增 computed 属性 orderedWaybillPunchRecords,按打卡时间升序排序已打卡记录
- 未打卡记录保持后端返回的节点顺序,排在已打卡记录之后
- 引入方法 waybillPunchRecordTimestamp 解析打卡时间,支持多种日期格式
- 修正 el-timeline v-for 使用 orderedWaybillPunchRecords 避免 key 冲突
- 保持原有流程节点顺序不变,仅调整时间轴展示顺序
2026-09-17 14:47:29 +08:00
gxwebsoft 2684624979 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
2026-09-17 14:42:33 +08:00
b2894lxlx 84d9e098ba 调整 业务 2026-09-16 23:43:12 +08:00
b2894lxlx c1c4fa18c9 调整 iam 2026-09-16 06:30:30 +08:00
b2894lxlx 6a87066097 调整 合同、运力、客商、项目 2026-09-15 11:59:55 +08:00
b2894lxlx 79aa4f9fae 调整 合同、运力、基础配置、客商 2026-09-14 23:43:20 +08:00
b2894lxlx f1e2313e4c 调整 合同 2026-09-14 15:01:13 +08:00
b2894lxlx acbc9d3322 调整 基础数据、运力、车船务 2026-09-14 01:49:23 +08:00
b2894lxlx dbeb174ae2 调整项目 2026-09-13 01:01:24 +08:00
b2894lxlx 764c0f4581 运单调整 2026-09-11 14:39:30 +08:00
gxwebsoft 2131e99ec4 feat(contract-manage): 将合同详情由弹窗改为独立页面
- 新增路由 /business/contract-manage/detail,详情页共享合同管理组件
- 列表、表单、详情三分支用 isFormPage 和 isDetailPage 控制
- openDetail 方法改为跳转详情路由,initDetailPage 获取详情数据
- 新增 resetDetailState 和 closeDetailPage 方法,复用关闭逻辑
- 详情页去除弹窗高度限制,样式改为页面自滚动
- 详情页底栏使用固定位置关闭按钮,保持页面布局一致
- watch 和 created 中添加对 isDetailPage 的初始化调用和监听
2026-09-11 12:30:05 +08:00
gxwebsoft 6e5b15f203 Merge remote-tracking branch 'origin/master' 2026-09-11 10:41:13 +08:00
gxwebsoft fbfd5cde89 fix(api): 移除项目资金风险统计请求调用
- 由于后端/fund-risk-stats端点尚未实现,删除列表页中refreshFundRiskStats调用
- 从data中移除fundRiskStats相关数据,避免接口请求报错
- 列表头部风险筛选标签调整,仅显示“高风险/中风险”,去掉数量显示
- api/business/project-apply.js中保留getFundRiskStats定义,并添加注释说明后端就绪后恢复调用
2026-09-11 10:41:09 +08:00
b2894lxlx 1a9cd55d66 1、调整导入运单
2、调整对账
2026-09-10 22:50:18 +08:00
b2894lxlx 38e53e01af Merge remote-tracking branch 'websoft/master' 2026-09-10 02:01:42 +08:00
b2894lxlx 6ff672211f 1、调整导入运单
2、调整对账
2026-09-10 02:01:28 +08:00
gxwebsoft 1bbc97758d fix(contract-manage-change): 修正自动生成结算单问号提示图标位置
- 解决图标夹在开启/关闭 radio 按钮之间,开启按钮右侧多余间距问题
- 清除开启 radio 默认 margin-right,调整提示图标左右间距
- 提示图标紧靠开启按钮一侧,关闭按钮保持较大间距
- 优化样式,使布局更美观一致
2026-09-09 19:25:06 +08:00
gxwebsoft c1813e308f feat(vehicle): 重构车辆认证审核弹窗布局与验证规则
- 新增车辆认证审核弹窗,取消独立尺寸重量卡片,外廓尺寸改为长/宽/高组合布局
- 基础信息调整为3行4列,证件信息新增车辆资质图片行,所属组织标签更名为所有组织
- 行驶证有效期必填星号动态显示,长期有效时不显示且不校验,删除旧校验方法
- driver.vue中从业资格证有效期改为起止日期区间,新增起始日期字段,调整验证规则
- 驾驶证和从业资格证长期有效时禁用起止日期输入,校验逻辑同步调整,提交保留旧值
- contract-manage-change.vue合同文件批量下载按钮移入标题栏,与其它附件分区样式统一
- 样式更新,新增 dimension-group 用于外廓尺寸排版复用及其他局部样式调整
- 修复因后端未实现接口导致的降级方案预留,等待后端补充支持
2026-09-09 19:06:26 +08:00
gxwebsoft 716ce43862 feat(driver): 优化驾驶证信息必填规则和表单placeholder统一
- 驾驶证有效期必填加红星,长期有效去除必填红星,保持校验逻辑不变
- 统一司机弹窗所有输入框和选择框的placeholder为“请输入”或“请选择”,去除字段名
- 保留复合操作、日期范围起止及默认值说明的特例placeholder不变
- 新增3处自动生成结算单开关后悬浮问号图标和提示,增强用户理解
- customer-archive中新增customerKindOptions和映射,用于客户类别选择
- 提升archive-form label与控件垂直居中样式至全局,修正多页标签顶置问题
2026-09-09 17:35:19 +08:00
gxwebsoft 14c6ad0a31 feat(vehicle): 优化车辆管理相关表单布局和字段
- 车牌号组件改为单一输入框,去除省简称和颜色选择,实现完整车牌号输入
- 重写车牌号校验逻辑,校验完整车牌号格式,错误提示更加明确
- 车辆新增/编辑弹窗输入框宽度统一调整,基础信息和资质图片区按四列布局排列
- 修复所有组织字段宽度不一致问题,补充级联选择器样式支持
- 司机新增/编辑弹窗调整为四列布局,调整字段排列顺序,提升界面整洁度
- 客商档案中「客商类型」改名为「客商分类」,新增「客商类型」字段支持外部客商和内部组织区分
- 上传证件项 label 贴顶问题修复,统一提升到全局样式实现垂直居中
- 移除车牌颜色只读展示,审核弹窗同步删除车牌颜色字段
- 保持后端接口兼容,数据库字段未变,OCR同步调用链路无影响
2026-09-09 17:19:33 +08:00
gxwebsoft 1972115173 feat(transportCapacity): 优化车辆与司机弹窗布局并新增字段支持
- 车辆新增弹窗:所有组织移至基础车辆信息区末尾,新增使用部门字段,使用部门复用部门下拉
- 车牌号三段合并为整体输入框,优化样式为flex布局,去除多余边框及阴影,统一视觉
- 长期有效勾选时清空对应日期且禁用输入,新增handleLongTermChange方法,表单校验支持长期有效跳过必填
- 司机弹窗基础身份信息新增placeholder,调整布局,基础身份三列保持不变,其他信息行按需求拆分重排为一致三列
- 后端新增use_department字段,相关mapper、service及校验同步更新,新增增量迁移脚本支持
- 车辆表单相关输入控件宽度统一调整为6列布局,保持与其它区块一致,提升整体UI协调性
- 移除车辆车牌号拆分相关字段及逻辑,车牌号统一管理为单个字段,简化处理流程
- 代码中新增校验规则validateDrivingLicenseEndDate及validateRoadTransportCertEndDate,支持长期有效逻辑
- 优化图片上传区和证件信息区表单字段排列,提升表单整体易用性与规范性
2026-09-09 15:37:40 +08:00
110 changed files with 11124 additions and 3450 deletions
+130
View File
@@ -83,3 +83,133 @@
3. `loadSettlementDictionaries``Promise.all` 追加 `getBizDictionary({ code: 'contractCategory' })`,映射填充后**条件覆盖** `contractCategory` 列 dicData(仅非空时)。
- 列表页列显示/搜索下拉、详情页(detailValue 已有 `prop==='contractCategory'` 分支走 displayStatus)均因 column.dicData 覆盖而自动跟随业务字典。
- 注意:`config.defaultForm.contractCategory: '客户合同'`option/contract-manage.js)为硬编码中文默认值,若业务字典 dictKey 非中文需同步调整。
## 车辆新增弹窗:所有组织移位 + 使用部门 + 长期有效清空(vehicle.vue + 后端)
- 需求(transportCapacity/vehicle):①所有组织移到「基础车辆信息」区末尾;②新增「使用部门」字段(后端 transport_vehicle 无该字段,需加);③车牌号三段(省/号码/颜色)包成整体输入框+减宽;④勾选「长期有效」清空对应日期且不可编辑。
- 用户确认:所有组织+使用部门放「基础车辆信息」区末尾;使用部门用部门下拉(复用 getDeptTree→organizationOptions,存部门名,仅部门名非级联);车牌号包成整体输入框+减宽;长期有效 4 组全部统一清空(强制报废/行驶证/道路运输证/年审)。
- 前端(vehicle.vue):
1. emptyForm 加 `useDepartment: ''`
2. 删「基础车辆信息」首行的「所有组织」(原 span24),在区末新增一行:`使用部门`(span8, el-select+organizationOptions, 存 rawLabel) + `所有组织`(span8, el-cascader)。organizationOptions 由 initDeptTree 填充。
3. `.plate-group` 由 grid(112px 1fr 112px) 改为 flex 整体输入框:外层 border+radius+focus-within 变化;内部 el-select/el-input 去 box-shadow、无边框,第一/最后 select flex 0 0 30%、中间 input flex 1,子项间用 `::before` 竖线分隔。
4. 4 组 date-picker 加 `:disabled="xxxLongTerm === 1"`(行驶证/道路运输证原缺,补上),checkbox 加 `@change="handleLongTermChange(日期prop, longterm prop)"`;新增方法 handleLongTermChange(勾选时清空日期并 validateField)。
5. formRulesdrivingLicenseEndDate / roadTransportCertEndDate 由 required 改为 validator(新增 validateDrivingLicenseEndDate / validateRoadTransportCertEndDatelongTerm===1 时跳过必填),annualReview 原 validator 已支持。
- 后端(tms-erp-api-ws,新增 use_department 列):
- `TransportVehicle.java``private String useDepartment`
- `blade_transport_vehicle.sql` 建表加 `use_department varchar(50)`
- `TransportVehicleExcel.java``使用部门` 列。
- `TransportVehicleMapper.xml` resultMap + BaseColumn + QueryCondition(useDepartment LIKE) 各加。
- `TransportVehicleServiceImpl.prepare()` trim useDepartmentvalidate() 加长度≤50 校验。
- 新增增量迁移 `doc/sql/transport/blade_transport_vehicle_use_department_patch_20260909.sql`ALTER ADD use_department AFTER organization_name)。
- 注意:VO 继承 entity 无需改;Wrapper BeanUtil 同名透传。已上线库须执行 patch SQL(建表脚本是 DROP+CREATE,勿直接跑)。
- 后续补充(vehicle.vue「车辆资质图片」区输入框对齐):第一行原 span `6/8/10` 不等宽(行驶证档案编号 6 / 行驶证有效期 8 / 道路运输证号 10)导致输入框宽度不齐,统一改为 `8/8/8`,与下方各行 span=8 一致。仅改 2 处 span,无逻辑改动。
## 车辆车牌号:改为单一 input 输入框(vehicle.vue3 段 → 1 段)
- 需求:基础车辆信息区「车牌号」原本是「省简称 select + 号码 input + 车牌颜色 select」三段拼装(plateProvince/plateNoBody/plateColor),改为**单个 el-input** 直接输入完整车牌号(如 京A12345)。
- 改动(vehicle.vue):
1. 模板:`plate-group` 三段 → `<el-input v-model="vehicleForm.plateNo" maxlength="8" show-word-limit placeholder="如:京A12345" @input="handlePlateNoInput" @blur="validatePlateFormat">`。删除 `.plate-group` 样式(含 focus-within、竖线分隔、child flex 占比等整段)。
2. emptyForm:删 `plateProvince``plateNoBody`,保留 `plateNo``plateColor`(后端字段继续存历史车牌颜色)。
3. data:删 `plateProvinceOptions``plateColorOptions` 暴露;常量 `plateProvinceOptions`31 省简称数组)整段删除;`plateColorOptions` 常量删除。
4. validatePlateNo 重写:直接校验 `value`(完整车牌号),正则 `/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼港澳]{1}[A-Z][A-Z0-9挂学警港澳]{5,6}$/`,错误提示改为「请输入标准车牌号(如:京A12345)」。
5. syncPlateNo / splitPlateNo 重写:splitPlateNo 改为 noop(保留以兼容 OCR 后回调链路);syncPlateNo 改为 trim+upperCase 单一字段。
6. handlePlateBodyInput 改名为 handlePlateNoInput,新增 validatePlateFormat 失焦校验。
7. 车辆认证审核弹窗只读详情同步删「车牌颜色」展示(与录入表单一致)。
- 后端不动:`plate_no` / `plate_color` 字段保留(数据库兼容历史车牌颜色),Service 无强制校验。
- 受影响:OCR 自动识别(行驶证/机动车销售统一发票)后续调用链路无需改,因 syncPlateNo 仍对 plateNo 做归一化。
## 车辆新增/编辑弹窗:输入框宽度统一(vehicle.vue,前后两区)
- 需求(transportCapacity/vehicle):新增/编辑弹窗「基础车辆信息」+「车辆资质图片」两个 section 各输入框宽度要一致;截图红框重点为车牌号、外廓尺寸、所有组织/使用部门。
- 根因:基础区原本列宽混乱(车牌号 span10 / 车辆类型 span6 / 外廓尺寸 span6,其余 span6),行内 3 列与 2 列混排;图片区文本字段全 span6,与基础区不一致。
- 改动(vehicle.vue 仅模板 el-col span):
1. 「基础车辆信息」区所有字段统一为 **span=83 列布局)**:车牌号、车辆类型、外廓尺寸、核定载质量、准牵引总质量、业务关系、能源类型、强制报废日期、海关备案号、所有组织、使用部门。
2. 「车辆资质图片」区文本/日期字段(行驶证档案编号、行驶证有效期、道路运输证号、道路运输证有效期、道路运输年审有效期、机动车登记编号、机动车登记日期)统一为 **span=8**
- 不改:只读「车辆认证审核」弹窗(L140 起的 span6 只读详情 + large 图片上传)与新增弹窗内「证件图片」上传控件(固定尺寸)保持 span6。外廓尺寸为复合控件(长/宽/高三 input),口径同 span8。
- ⚠️ 注意:操作中曾误删核定载质量 el-col 标签(453-460 行开始时少 el-col、尾部多一个 `</el-col>`),已修复为完整 `<el-col :span="8">...`
- 后续纠偏(2026-09-09 傍晚):主人反馈「为什么不是按4列显示」——上一步把"基础车辆信息/车辆资质图片"两区误改成 3 列(span8)。同项目惯例 driver.vue/customer-archive.vue 全为 **4 列(span6,仅复合长字段 span12**,故统一重排为 4 列:
- 基础车辆信息:`车牌号(6)+车辆类型(6)+外廓尺寸(12)``核定载质量/准牵引总质量/业务关系/能源类型(4×6)``强制报废日期/海关备案号/所有组织/使用部门(4×6)`
- 车辆资质图片:`行驶证有效期/道路运输证号/道路运输证有效期/道路运输年审有效期(4×6)``机动车登记编号/机动车登记日期/行驶证档案编号(3×6)`,图片上传控件仍 span6
- 该区 span8 已全部移除,编辑表单区仅剩外廓尺寸 span12(复合控件长/宽/高)+ 图片上传 span6。
- 宽度微调(2026-09-09 傍晚2):主人圈出「所有组织」字段宽度与同行不一致。根因:`.vehicle-form` 里的 `:deep(...){width:100%}` 选择器只列了 `el-select / el-input / el-input-number / el-date-editor`**漏了 `el-cascader`**(所有组织用的就是级联选择器,默认不撑满整列)。已补 `:deep(.el-cascader)` 进该规则,全表单仅此一处用到 el-cascader,故所有组织与同行等宽。
## 司机弹窗:补 placeholder + 每行统一 3 列(transportCapacity/driver.vue
- 需求:新增/编辑司机弹窗 ①输入框无提示文案;②基础身份信息 3 列,其它 4 列 / 6 列行不统一。
- 改动(仅 1819 行 driver.vue 的 126-540 行 `<driver-dialog>` 模板,script/style 不动):
1. **基础身份信息**:行结构不动,7 个 el-form-item 控件补 placeholder(司机姓名/身份证号/出生年月/性别/民族/学历/详细地址)。住址已有「请选择省市区」、驾驶车辆已有「请输入或选择车辆」,不动。
2. **驾驶证信息**:第一行 4 列(:span=6)拆为两行 — 行 1(准驾车型 / 档案编号 / 有效期 date-range:span=8+ 行 2(长期有效,:span=8)。起/止 placeholder 保留简短「起」「止」,符合主人 1.B 偏好(保留原 date-range 二联结构,不改 daterange)。
3. **从业资格证信息**:第一行 4 列拆为两行 — 行 1(从业资格认证类型 / 资格证号 / 有效期,:span=8+ 行 2(长期有效,:span=8)。资格证号 placeholder 保留「默认身份证号」不动。
4. **司机联系信息**:一行 6 列拆为两行 — 行 1(司机类型 / 手机号 / 紧急联系人姓名,:span=8)+ 行 2(紧急联系人手机号 / 与联系人关系 / 所属组织,:span=8)。所属组织已有 placeholder,不动。
- 决策点(主人确认):1.B(保留原 date-range 二联 + 第三列留空后拆行的方案);2 保留;3.A(驾驶证主页/副页、封面页/内容页两组上传图仍 :span=12,与占整行宽的原貌一致)。
- 校验:node 脚本统计 4 个 section-card / 13 个 el-row / 31 个 el-col / 24 个 el-form-item,全平衡。改动只在 driver.vue 一文件,~25 处 Edit 调用。
## 新增/修改司机弹窗改为 4 列布局(driver.vue16:xx
- 主人要求 /transportCapacity/driver 新增司机弹窗改 4 列显示。原文件各分组已是 span=6(4 列栅格)但每行只放 3 个字段,第 4 列空置。
- 重排结果(仅删行断 + 移动字段顺序,字段/校验/逻辑零改动):
1. 基础身份信息:行1 司机姓名/身份证号/出生年月/性别;行2 民族/学历/住址/详细地址;行3 驾驶车辆/岗位;行4 三张证件照(不变)。
2. 驾驶证信息:行1 准驾车型/档案编号/有效期/长期有效;上传主页/副页 span 12→6。
3. 从业资格证信息:行1 类型/资格证号/有效期/长期有效;上传封面页/内容页 span 12→6。
4. 司机联系信息:行1 司机类型/手机号/紧急联系人姓名/紧急联系人手机号;行2 与联系人关系/所属组织。
- 注意:此前日志记录的「3 列 span=8」方案已被后续改动覆盖为 span=6,本次以当前文件实际状态为准。
## 客商档案:客商类型→客商分类 + 新增客商类型(customer-archive.vue
- ⚠️ 补救(17:34):data 里的 `customerKindOptions`/`customerKindMap` 定义一度丢失(模板 v-for 空 → 下拉显示「无数据」,主人截图反馈),已补回 datacustomerTypeOptions 之后)。其余 8 处改动经 grep 确认完好。
- 需求:原「客商类型」(prop `customerType`,字典 customer_type:客户/承运商,多选)改名「客商分类」;另新增「客商类型」字段,取值为 外部客商 / 内部组织。
- 约定:prop `customerType` 不动(其它页面 loading-manage / dept / business-crud-page 都以 `customerType:'承运商'` 作为后端查询参数),只改中文标签。
- 新增字段 prop = **`customerKind`**(前端自定义命名,后端尚无对应字段,需后端在客商表加列并透传),值 `external`(外部客商) / `internal`(内部组织),单选下拉,默认 `external`
- 改动点(8 处,全在 `src/views/vehicle/customer-archive.vue`):
1. 表单:227 行 label 改「客商分类」;其后新增一个 `el-col :span="6"` 表单项「客商类型」prop `customerKind`el-select + `customerKindOptions`)。
2. data 新增 `customerKindOptions` / `customerKindMap`external/internal ↔ 中文)。
3. formRules`customerType` 提示文案改「请选择客商分类」。
4. 列表列:「客户类型」label 改「客商分类」;新增「客商类型」列(prop customerKindtype selectdicData 内外部,minWidth 120**未加 search**)。
5. `emptyArchive()``customerKind: 'external'`
6. `normalizeDetail()``customerKind: detail.customerKind || 'external'`
7. 变更记录 `getChangeFieldLabel``customerType:'客商分类'`,新增 `customerKind:'客商类型'`
8. `formatChangeFieldValue`:别名映射加 `客商分类/客户类型 → customerType``客商类型 → customerKind`valueMap 加 `customerKind:{external:'外部客商',internal:'内部组织'}`
- 校验:用 @vue/compiler-sfc 编译模板,0 错误。
## 上传证件项 label 贴顶修复(全局 archive-form 垂直居中提升)
- 症状:driver.vue 司机弹窗「驾驶证主页/副页」「封面页/内容页」等证件上传项(el-form-item 内容高 151pxlabel 文字贴顶,普通 32px 控件行看不出来。
- 根因:`archive-form` class 被 driver / vehicle / ship / credit-score-quantification / loading-manage / waybill-import-dialog 等 8+ 页面复用,但「label 与控件垂直居中」规则 `.archive-form :deep(.el-form-item){align-items:center}` 锁在 customer-archive.vue 的 scoped 样式里,其它页面拿不到;flex 容器默认 stretchlabel(32px) 在高控件行内贴顶。
- 修复:规则提升到 `src/styles/element-ui.scss` 全局(紧跟 is-required 星号配套规则之后):`.archive-form .el-form-item { align-items:center }`。全站 archive-form 表单一并生效,label 与控件垂直居中。SCSS 编译通过。
## 司机弹窗「驾驶证信息」:有效期必填、长期有效不必填(transportCapacity/driver.vue
- 需求:驾驶证信息区「有效期」(起/止,prop `drivingLicenseEndDate`)要必填(显示红*),「长期有效」复选框(prop `drivingLicenseLongTerm`)不必填(去掉红*)。
- 改动(formRules 两处):
1. `drivingLicenseEndDate` 规则加 `required: true``{ required: true, validator: this.validateDrivingLicenseEndDate, trigger: 'change' }`)——仅用于渲染红*,实际校验仍走自定义 validator。
2. 删除 `drivingLicenseLongTerm``{ required: true, message: '请选择驾驶证是否长期有效' }` 规则块。
- 关键机制(Element Plus 2.14 + async-validator 4.2.5 已核实):
- 红* 由 `form-item``isRequired = normalizedRules.some(rule => rule.required)` 决定,只要规则对象带 `required` 就显示。
- async-validator 的 `rule.validate` 中,若存在 `rule.validator`,直接走自定义 validator 并 return**不会**再执行 required 空值检查 → 勾「长期有效」时止日被清空/disabled 也不会误报必填。
- 校验逻辑保持原样:起始日期恒必填;`longTerm !== 1` 时止日必填。
- 未同步:「从业资格证信息」区仍是「有效期无红* + 长期有效有红*」的旧形态(待主人确认是否一并统一)。
## 司机弹窗 placeholder 统一为「请输入/请选择」(transportCapacity/driver.vue
- 需求:新增/修改司机弹窗输入框 placeholder 去掉后面的字段名称,只保留「请输入」「请选择」。
- 改动:18 处 placeholder 简化(7 处 → `请输入`10 处 → `请选择`1 处动态 cascader `driverForm.addressRegion || '请选择省市区'``|| '请选择'`)。
- **保留 4 处**(主人明确确认):
1. 驾驶车辆 `请输入或选择车辆` —— 复合操作(既可输入又可点按钮选车),去掉会丢语义。
2. 日期范围 `起` / `止` —— 起止标记,非字段提示。
3. 资格证号 `默认身份证号` —— 默认值说明,非「请输入」格式。
- 未动:表单**校验错误提示 message 仍带字段名**(如「请选择准驾车型」),因报错需指明具体字段,与 placeholder 定位不同;主人未要求,暂保持。
- 做法:Python 脚本按完整 placeholder 字符串精确替换(18 规则全命中,未匹配即 exit 1 中断),比逐个 Edit 高效且不会误伤。
- 校验:`@vue/compiler-sfc` parse + compileTemplate + compileScript 三项全通过。注意脚本必须放在**项目根目录**下运行(放 /tmp 解析不到 node_modules 里的 @vue/compiler-sfc)。
- ⚠️ git diff 显示的 `drivingLicenseLongTerm` 校验规则变动是**本次之前工作区已有的未提交改动**(见上一条日志),非本次引入,勿混淆。
## 「自动生成结算单」开关加 ? 悬浮提示(3 处)
- 需求:开关「开启」后面加问号图标,hover 提示「开启时,系统根据配置规则归集运单,定时生成结算单」。
- 改动文件(同一文案,为保持全站一致):
1. `src/views/business/components/business-crud-page.vue`1884 行附近,`.business-crud-page__settlement-switch`
2. `src/views/business/contract-manage.vue`357 行附近,`.contract-manage-form__settlement-switch`
3. `src/views/business/contract-manage-change.vue`55 行,`.settlement-switch`,原为单行长标签已拆行)
- 写法:`<el-radio :label="1">开启</el-radio>` 后插 `<el-tooltip content="..." placement="top"><el-icon class="settlement-switch-tip"><QuestionFilled /></el-icon></el-tooltip>`,再接「关闭」radio。
- 样式:`.settlement-switch-tip { margin:0 4px; color:#a8abb2; cursor:help; font-size:14px }`,各文件 scoped 样式内一份(contract-manage 写在 `&__settlement-switch` 内)。
- 注意:图标走 main.js 全局注册(@element-plus/icons-vue 全量注册),无需 import;写法与 `project-apply.vue``__label-tip` 一致。
- 这三个大文件本身已存在 prettier 格式问题(改动前 git HEAD 版本同样 fail),非本次引入。
## 车辆认证审核弹窗排版对齐新增弹窗(vehicle.vue
- 诊断 `/project-apply/fund-risk-stats` No endpoint:前端已定义 getFundRiskStatsapi/business/project-apply.js:13),后端未实现;方案已给(后端补 R<{high,medium}> / 前端 catch 降级),待主人选。
- vehicle.vue 认证审核弹窗重排对齐新增弹窗:取消独立「尺寸重量」卡片,外廓尺寸改长/宽/高组合(span12dimension-group);基础信息 3 行×4 列(车牌号/车辆类型/外廓尺寸;载质量/牵引质量/业务关系/能源类型;强制报废日期/海关备案号/所有组织/使用部门);证件信息按新增「车辆资质图片」行分布(止+运输证号+止+年审 / 登记编号+登记日期+档案编号+行驶证起 / 运输证起 / 备注整行);label「所属组织」改「所有组织」对齐新增;dimension-group 样式复制进 .certification-audit 作用域。@vue/compiler-sfc 编译校验通过。
- vehicle.vue 行驶证有效期必填星号:原规则是纯 validatorElement Plus 不渲染星号),改为 data 内 baseRules + computed formRulesdrivingLicenseEndDate 动态返回 required 规则(长期有效=1 时返回 [],星号与校验同步消失);删除 validateDrivingLicenseEndDate。经验:Element Plus 星号只在规则含 required:true 时渲染,且 el-form-item 的 :required 属性会被注入为 {required} 规则并产生英文默认提示,不宜用它控制星号。
- 备注:车辆保存的「车牌颜色不能为空」「行驶证有效期:必填」均为后端校验(前端无对应规则),需后端改。
- driver.vue 从业资格证有效期对齐驾驶证:单日期改 date-range 起/止(列宽 6+6+6+6 → 6+6+8+4),新增 qualificationStartDate 字段(emptyForm + handleSubmit normalize);qualificationEndDate 规则加 required:true(渲染星号,validator 豁免长期);删除 qualificationLongTerm 的 required 规则(长期有效不必填);勾长期后起止均 disabled(比驾驶证更严,驾驶证起仍可编辑)。⚠️ 后端需新增 qualification_start_date 字段否则起日期无法存取。
- driver.vue 补充:驾驶证「有效期起」加 :disabled(长期=1 时禁用);驾驶证与从业资格证两个 validator 统一在「长期有效=1」时直接 callback() 放行(起止都不校验、不提示)。禁用不清空旧值,提交时保留原日期(后端以 longTerm 为准)。
- contract-manage-change.vue「合同文件」批量下载按钮上移:标题与按钮合并进 .section-headflex space-between 同排),与「其它附件/计费信息」分区一致;删除无引用的 .attachment-head 样式。
- contract-manage-change.vue「自动生成结算单」问号提示图标位置:原 icon 夹在开启/关闭 radio 之间,因 .el-radio 默认 margin-right:32px 导致离开启远、贴关闭;修复 = 开启 radio margin-right 清零 + icon margin 改 0 32px 0 8px。
+6
View File
@@ -0,0 +1,6 @@
# 2026-09-10
- 移除 project-apply 的 fund-risk-stats 请求(后端未实现端点,每次列表加载都弹 No endpoint 报错):删除 onLoad 内 refreshFundRiskStats 调用与该方法、data 中 fundRiskStats;头部风险标签去掉「(数量)」只留「高风险/中风险」;api/business/project-apply.js 保留 getFundRiskStats 定义并注释「后端就绪后恢复」。
EOF2
}
cat >> /Users/gxwebsoft/VUE/tms-erp-web-ws/.workbuddy/memory/2026-09-10.md <<'EOF'
+28
View File
@@ -0,0 +1,28 @@
# 2026-09-11
## 上传证件区域固定宽度导致跨机器错位(transportCapacity
- 现象:driver.vue 新增弹窗的身份证/大头照上传框在本机对齐,他人电脑不对齐。
- 根因:`--large` 上传框写死 `width:240px`ship 写 248px),而弹窗 `width:90%` + `el-col :span=6` 列宽是弹性的、上方输入框 `width:100%`;列宽随分辨率 / Windows 系统缩放 / 浏览器缩放变化,240px 只在特定宽度下恰好等于列宽。叠加 `labelWidth:auto` 靠 JS 实测字体(苹方 vs 微软雅黑)宽度,label 列宽也不同 → 起始位置漂移。
- 修复:三个文件改为 `width:100%; max-width:240px; flex:none`ship 保留 248px 上限),窄屏跟随列宽、宽屏保持比例上限,左边缘恒与输入框对齐。
- `src/views/transportCapacity/driver.vue`.driver-uploader--large
- `src/views/transportCapacity/vehicle.vue`.vehicle-uploader--large
- `src/views/transportCapacity/ship.vue`.ship-uploader--large
-@vue/compiler-sfc(脚本放项目根目录)验证三个 SFC 编译通过。
- 教训:本项目所有「固定 px 宽度的上传/控件」都要配 `max-width` + `width:100%`,否则高分屏/低分屏下必然错位。
## 合同详情由弹窗改为独立页面(contract-manage
- 路由:新增 `/business/contract-manage/detail``src/router/views/index.js`name『合同详情』,meta `keepAlive:false` + `activeMenu:'/business/contract-manage'`),组件仍复用 `contract-manage.vue`(与 form 页同一套路)。
- 页面内三分支:`v-if="!isFormPage && !isDetailPage"`(列表)/ `v-else-if="isFormPage"`(表单)/ `v-else`(详情)。**v-else 必须紧邻 form 分支的 `</template>`**,中间不能插其它组件,否则 Vue 编译报「v-else 无相邻 v-if」——弹窗类组件(billing-plan-editor / 附件预览 / 变更记录详情 / 流程)放在三个分支之后。
- 关键改动:`openDetail``router.push({ path:'/business/contract-manage/detail', query:{ id, name } })`;新增 `initDetailPage()`(按 query.id 拉详情,`resetDetailState()` 先清空)、`closeDetailPage()`closeTag + 回列表)、`isDetailPage` / `detailPageTitle` computed`created``$route.fullPath` watch 都要加 `else if (this.isDetailPage)`
- 样式:`.contract-manage-detail--page { max-height:none; overflow:visible }`,去掉弹窗的 74vh 限制;底栏复用 `.contract-manage-page__footer`(fixed 浮动),只读详情页按钮保留「关闭」。
- 校验方式:dev server 已运行时 `curl "http://localhost:2889/src/views/business/contract-manage.vue"` 返回 200 即 Vite 编译通过(比整包 build 快)。
## 只给「查看弹窗」加宽 labeltemporary-credit-limit
- 场景:详情页长 label(「剩余项目资金使用额度(万元)」)换行超 2 行撑坏详情表格,但又不能影响新增/编辑页。
- **关键发现:Avue 的 `avue-form` 在 detail 模式下根节点会挂 `.avue--detail` 类**(源码 `node_modules/@smallwei/avue/lib/packages/element-plus/form/index3.js``class: normalizeClass([b(), { 'avue--detail': isDetail }])`)。所以「只针对详情态」的选择器就是:
```scss
.temporary-credit-limit-dialog .avue--detail .el-form-item__label { width:210px !important; flex:0 0 210px !important; }
```
新增/编辑弹窗无 `.avue--detail`,天然不受影响,不需要在 option 里做 mode 判断。
- 校验样式块编译:dev server 请求 `?vue&type=style&index=1&lang.scss`**lang 必须写 scss,写 css 会 500**),grep 规则确认产物。
- 结论备忘:长 label 优先「加宽 + 换行 ≤2 行」,不要用单行省略 + tooltip —— 详情是纯阅读场景,hover 才能看全字段名的可发现性差。
+63
View File
@@ -0,0 +1,63 @@
# 2026-09-17 工作日志
## 配载管理(loading-manage):弹窗全部改为独立表单页/详情页
- 需求:`/business/loading-manage` 不再用弹窗,改成与新增合同(`/business/contract-manage/form?mode=add&name=新增合同管理`)一致的独立页面。
- 现状:新增/编辑**已经**是独立页(组件内 `isStandaloneFormPage` + `/business/loading-manage/form` 路由),但「详情」和「重新派单」仍是 el-dialog(用户截图即详情弹窗)。
- 改动(3 个文件):
1. `src/router/views/index.js`:新增 `/business/loading-manage/detail`name 配载单详情,`meta.keepAlive:false, activeMenu:'/business/loading-manage'`),组件仍是 `loading-manage.vue`
2. `src/views/business/loading-manage.vue`
- computed 新增 `isStandaloneDetailPage`path==='/business/loading-manage/detail')、`isStandalonePage`form|detail 并集,作为隐藏列表容器的统一开关)、`detailPageTitle``formPageDefaultTitle`add/edit/reassign 映射);`isStandaloneFormPage` 放行 `mode=reassign`
- 模板中所有控制「是否独立页/是否弹窗」的 `isStandaloneFormPage` 改为 `isStandalonePage`;顶部标题按详情/表单取 `detailPageTitle`/`formPageTitle`
- 新增 `gotoLoadingDetail(row)`push `/detail?id=&name=配载单详情`,替换「配载单号」链接与操作列「详情」)、`gotoLoadingReassign(row)`push `/form?mode=reassign&id=&name=重新派单`)、`initStandaloneDetailPage()``initStandaloneFormPage` 模式透传 edit/reassign`openLoadingDialog` 对 add/edit/reassign 一律转独立页;`closeLoadingDialog` 判据改 `isStandalonePage`
- `mounted` / `watch $route` 增加详情页分支(直接打开与页内切换都要 init);detail 分支除 id 变化外,`dialogMode !== 'view'` 也重新 init(防止从表单页切详情时残留表单态)。
- 兼容旧链接:`/business/loading-manage?detailId=x` 仍可用,会 replace 到详情页。
- 样式:底栏去掉写死的 `gap:8px`(全站统一 12px);页面模式的内容区解除 `max-height:78vh` 内嵌滚动盒 —— 原 `:global(.loading-manage-form-page .loading-manage-dialog__body)` 权重 (0,2,0) 低于 scoped 规则 (0,3,0) 一直没生效,改为 `.loading-manage-page .loading-manage-form-dialog.loading-manage-form-page .loading-manage-dialog__body` (0,4,0),内容改随 `#avue-view` 自然滚动(与合同页一致)。
3. `src/views/business/components/waybill-manage-page.vue``openLoadingDetail``/business/loading-manage?detailId=` 改为 push `/business/loading-manage/detail?id=&name=配载单详情`
- 校验:dev server2889)单独编译 4 个模块均 HTTP 200(含 scoped scss);`vite build` 仍会在无关文件 `src/page/login/facelogin.vue` 被沙箱敏感内容保护中断。
- 踩坑:**`<style scoped lang="scss">` 顶层写 `//` 注释**会让该样式模块编译 500`Unexpected '/'. Escaping special characters with \ may help.`),已实测确认;顶层必须用 `/* */`
- 未做:登录态无法在浏览器实测(无测试账号),需用户点 `/business/loading-manage` → 详情/重新派单 自测;`voucher-manage-detail` 跳配载时带的 `?loadingNo=` 参数本来就未被列表消费(历史遗留)。
## 运单管理详情:打卡时间轴改为按打卡顺序展示
- 文件:`src/views/business/components/waybill-manage-page.vue`(详情页「执行详情 → 打卡详情」tab)
- 需求:时间轴不再固定按流程节点顺序(发货/在途/到货/卸货/签收/回单),改为按打卡时间先后展示。
- 实现(不改后端、不改原始数据):
1. 新增 computed `orderedWaybillPunchRecords`:映射出 `punchedAt`(毫秒时间戳)后排序 —— **已打卡记录按打卡时间升序排在前**,未打卡记录保持后端返回的节点顺序排在其后;时间相同用原索引稳定排序。
2. 新增 method `waybillPunchRecordTimestamp(record)``punched === false``statusName === '未打卡'` 直接返回 null(防止后端返回计划时间造成误序);优先 `this.$dayjs(text).valueOf()`,失败兜底 `new Date(text.replace(/-/g,'/'))`(兼容 Safari)。
3. 模板 `el-timeline``v-for` 改用 `orderedWaybillPunchRecords``key``record.nodeCode || record.id || index` 改为 `${nodeCode||id||'punch'}-${index}`,避免同节点多次打卡(在途)时 key 重复。
- 校验:项目根目录临时脚本 `_verify-sfc.mjs`@vue/compiler-sfc parse + compileScript + compileTemplate)通过,已删除脚本。
- 注意:`getPunchRecords``src/api/business/waybill-manage.js``/punch-records`)后端未提供节点排序字段,排序只能在前端做。
## 保险记录批量导入:前端归一化日期格式
- 文件:`src/views/vehicle/insurance-record.vue`(仅此一个文件)
- 背景:保险记录批量导入是**后端驱动**——前端 `handleImport``importBlob` 把原始 Excel 直接 POST 到 `/blade-transport/insurance-record/import-insurance-record`,前端不解析行。后端只认 `2026-09-01``2026-9-1` 导入失败。
- 决策:用户选择**前端归一化**(不动后端)。把 `openImportDialog` 改为自写 `httpRequest`:用 `xlsx` 读取 Excel → 把日期列(开始日期/结束日期/开票日期)`2026-9-1` 归一为 `2026-09-01` → 重写成新 File 再交给 `handleImportExcel` 上传;复用其失败明细下载与成功刷新逻辑。无日期列时回退为原文件(行为不变)。
- 关键方法:`normalizeExcelDates` / `readExcelRows` / `writeExcelFile` / `normalizeDateString`(正则 `^(\d{4})[-/.年](\d{1,2})[-/.月](\d{1,2})日?$`,用 `new Date` 校验合法性后补零;非法/已标准格式返回 null 保持原值)。
- 校验:本机 devlocalhost:2889)待用户部署自测。注意所有单元格经 `sheet_to_json(raw:false)` 后均为字符串,与 transport-plan-import 的客户端解析模式一致。
## 车/船务模块导出 xlsx「创建时间/更新时间」为空(后端 tms-api 修复)
- 现象:`/vehicle/insurance-record` 批量导出的 xlsx 里「创建时间」「更新时间」两列空白,「更新人」有值。用户要求车/船务模块所有页面统一修。
- 定位:导出由**后端**生成(前端只传查询参数,`exportColumns` 参数后端未使用)。实测 `~/Downloads/保险记录2026-09-17 20_46_08.xlsx`K/M 列单元格无 `<v>` 节点(值 null),E/F/J 日期列是数值 46266.0(带 numFmt `yyyy-MM-dd`WPS 显示为日期)。
- 根因:Service 用 BladeX `org.springblade.core.tool.utils.BeanUtil`**继承 Spring `BeanUtils`**)做 `copyProperties`。实体 `TenantEntity.createTime/updateTime``java.util.Date`,导出类字段是 `java.time.LocalDateTime` → Spring BeanUtils **类型不兼容静默跳过**,值为 null。而「更新人」是手动 `UserCache.getUserRealName(...)` 赋值的,所以有值。(Hutool 的 BeanUtil 能转 Date→LocalDateTime,但本项目用的是 BladeX 版本,不能。)
- 佐证:项目里正常的导出(Waybill / LoadingManage / CustomerArchive / CommonCargo)时间字段一律用 `java.util.Date`,并在 Service 里手动 `excel.setCreateTime(record.getCreateTime())`
- 修复(后端仓库 `/Users/gxwebsoft/JAVA/tms-api`blade-transport 模块):在 13 个导出方法里补显式赋值(Date→LocalDateTime 用 BladeX `DateUtil.fromDate``Func.isEmpty` 判空),不改 Excel 类字段类型(避免影响自定义 converter 与导入模板)。
```java
excel.setCreateTime(Func.isEmpty(x.getCreateTime()) ? null : DateUtil.fromDate(x.getCreateTime()));
excel.setUpdateTime(Func.isEmpty(x.getUpdateTime()) ? null : DateUtil.fromDate(x.getUpdateTime()));
```
- 涉及文件(13 个 Service + 1 新建 Excel 类 + 设备台账 controller/接口):InsuranceRecord / ViolationRecord / MaintenanceRecord / MaintenancePlan / TireReplacementRecord / AccidentRecord / AnnualInspectionRecord / MileageRecord / TransportChangeRecord / EtcRecord / OilElectricRecord / OtherExpenseRecord / EquipmentLedger。
- 设备台账特殊:原 `EquipmentLedgerExcel` 根本没有审计列(前端列表有),新建 `EquipmentLedgerExportExcel extends EquipmentLedgerExcel`(创建时间/更新人/更新时间),导出链路改用新类,**导入模板仍用旧类不受影响**。
- 未验证:本机无 mvn(仅 IDEA 内置),且离线模式缺 `blade-bom` 无法编译;用 javap 确认 `DateUtil.fromDate(Date)` 存在 + 逐行 grep 复核代替。需用户在 IDEA 里编译并重新部署后自测。
- 同类隐患(本次未改,其他模块):TemporaryCreditLimit、ProcessConfig、CommonRoute、CommonAddress、ContractManage、ProjectApply、ShippingTemplate 的导出 Excel 也是 LocalDateTime 且未手动 set 时间。
## 保险记录保额 -1 问题排查(未结案,待用户验证 DB 环境)
- 症状:新增弹窗保额不填 → 再开编辑弹窗显示 -1,触发「不能小于 0」校验。
- 已排除:前端(源码/dist 构建/git 全历史)、后端 tms-api + tms-erp-api-ws(源码/编译产物 javap/git 历史)均无任何 -1 赋值逻辑;保额为 formslot el-input,空值传 ''。
- 关键链路:编辑弹窗 beforeOpen 走 `/detail` 接口(getOne 原生查询),**不经过**列表 SQL 的 `CASE WHEN insured_amount<0 THEN 0` 兜底——所以表格显示 0、弹窗显示原始值。
- 数据库截图(用户 Navicat):该行 insured_amount=NULL,全表无负数 → 说明用户浏览的库与后端实际连接的库**不是同一个/DDL 不一致**。系统存在「空数值=-1」惯例(MaintenanceRecordMapper 里程 `CASE WHEN mileage=-1 THEN NULL`;前端 waybill-manage.js/process-config.js 均有 `Number(v)===-1?'':v` 掩码)→ 后端真实库的 insured_amount 列默认值很可能是 -1,MP 插入排除 null 列 → 默认值 -1 入库。
- 待验证:在后端 Nacos 数据源指向的库执行 `SHOW CREATE TABLE blade_insurance_record` + `SELECT insured_amount FROM blade_insurance_record WHERE policy_no='11111' AND vehicle_no='沪AE31312'`。
- 修复方案(待确认):1) ALTER 列默认值改 NULL + UPDATE 存量负数为 NULL2) 前端 beforeOpen 对 insuredAmount/premium 做 null/-1 → '' 归一(参照 waybill-manage normalizeNumericDisplayValue);3) 列表 SQL 的 CASE 兜底与 detail 不一致,可顺手统一。
+122
View File
@@ -0,0 +1,122 @@
# 2026-09-18
## 修复:改成独立整页后点左侧菜单仍弹出旧弹窗(loading-manage / project-apply
**现象**:配载单管理、项目管理已改为「新增/编辑/详情走独立整页」,但从独立页返回或直接点左侧菜单时,页面上仍会盖出一个老的 `el-dialog`(新增项目管理 / 配载单)。
**根因**(已读 Vue runtime-core 源码确认):
- `src/router/tab.js``tabKey`(默认 fullPath)为每个标签建一个具名 wrapper 组件放进 `wrapperMap``src/page/index/layout.vue``<keep-alive :include="$store.getters.tagsKeep">` 缓存 —— 每个标签页一个实例,全部缓存不销毁。
- 组件被 deactivate 后**仍会随 `$route`(全局响应式)重新渲染**;此时 `isStandalonePage` 变 false`<component :is="isStandalonePage ? 'div' : 'el-dialog'">` 由 div 翻回 `el-dialog`,而 `v-model``projectBox`/`dialogVisible`)仍是 true`append-to-body` 使弹窗 Teleport 到 body。
- `KeepAlive.deactivate``move(vnode, storageContainer, ..., moveType=OUT)`,但 `TeleportImpl.move``moveTeleport`)忽略传入的 moveType、一律按 REORDER 处理 → **teleport 出去的 DOM 不会被搬回 storage container**,永久残留在 `document.body` 上并显示出来。
**修法**(不回退 tab.js 的 `return wrapper` 提交 c1c4fa1,改修根因):
- 独立页容器固定为 `<div v-if="isXxxPage">`,不再按路由回退成 `el-dialog`
- 页内其它 `append-to-body` 二级弹窗加 `deactivated()` / `beforeUnmount()``closeInnerDialogs()` 把 v-model 置 false。
**改动文件**
- `src/views/business/loading-manage.vue`:容器改 `<div v-if="isStandalonePage">`;删 `dialogVisible``dialogTitle``resetLoadingDialog``clearLoadingDialog`、页脚弹窗分支(含「清空」);`watch.$route` 简化;新增 `closeInnerDialogs()`routeChange / commonAddress / candidateSearch+ `deactivated`/`beforeUnmount`
- `src/views/business/project-apply.vue`:容器改 `<div v-if="isProjectFormPage">`;删 `projectFormContainer`/`projectFormContainerProps``projectBox``resetProjectDialog``handleCancelProject``closeProjectForm` 简化为直接 push 列表;新增 `closeInnerDialogs()`changeRecordDetail / 附件文档预览 / 图片预览 / 选人)+ `deactivated`/`beforeUnmount`
**校验**dev server(2889) curl 两个 .vue 及其 scoped style 模块,均 HTTP 200500 才是编译失败)。`vite build` 因沙箱敏感内容保护会在 facelogin.vue 中断,未用。
**遗留同类风险(未改,已告知用户)**`business/components/waybill-manage-page.vue``detailContainer` 在 PageDetail / el-dialog 间切)、`settlement/components/{pre,formal}-settlement-editor.vue``transport-reconciliation-editor.vue``pageMode ? 'div':'el-dialog'`)、`business/components/waybill-import-dialog.vue``standalone`/`createPage`)。统一修法:容器类型在 `created()` 锁定,不随路由/prop 翻转。
---
## 追加修复:运单详情弹窗残留(waybill-manage-page.vue
用户复现路径:打开 `/business/waybill-manage/detail?id=xxx` → 点「配载管理」菜单 → 页面上又冒出运单详情弹窗。与上面同一根因:`detailContainer()``isStandaloneWaybillDetailPage` 在 PageDetail / el-dialog 间翻转,`:append-to-body="!isStandaloneWaybillDetailPage"` 随之为 true`v-model="detailBox"` 仍 true → Teleport 进 body 搬不回来。
**改动**`src/views/business/components/waybill-manage-page.vue`):
- data 新增三个锁定标志 `formPageLocked` / `detailPageLocked` / `formModeLocked`,在 `created()` 一次性从 `isStandaloneWaybillFormPage` / `isStandaloneWaybillDetailPage` / `$route.query.mode` 取值。
- 模板里所有形态判定(根 class、`v-if="!detailPageLocked"` 的列表容器、`form-page-title``status`、独立表单页按钮块、分页 `v-show``:append-to-body`、detail-page class、内容 `v-if="detailBox || detailPageLocked"`、独立页 footer / 弹窗 footer slot)全部改读锁定标志。
- `detailContainer()` / `crudContainer()` / `pageFormOption()`(含 `boxType`)改读锁定标志,避免缓存实例的 option 变形。
- 新增 `closeInnerDialogs()`(关 detailBox、里程补录、附件文档/图片预览、变更路线、常用地址、流程图、运输路线/地址/站点/地图、常用货物、货物导入、过程配置、Excel 导入)+ `deactivated()` / `beforeUnmount()`
**关键验证**`onDeactivated` 在子组件里也会触发 —— apiLifecycle 的 `injectHook` 会向上遍历父链,发现 KeepAlive 父级就把钩子注入到根实例(runtime-core 的 `injectToKeepAliveRoot`),所以写在子组件 waybill-manage-page 上的 `deactivated` 有效。
**校验**dev server curl 该 .vue 与 scoped style 均 200。仍未 commit。
**未提交**:上述改动 + 上一轮 loading-manage 独立页改造均未 commit。
---
## 排查(未改码):配载单详情页反复弹「运单管理不存在」
用户截图:打开 `/business/loading-manage/detail?id=2097607162718441474&name=配载单详情`,连续弹出 6-7 条红色「运单管理不存在」,标签栏堆了一串「运单管理详情」。
**文案来源**:前端 src 里没有这句话,是后端 `BusinessException` 的 msg,被 `src/axios.js` 的响应拦截器(`status !== 200``ElMessage.error(message)`)统一弹出。
**主因(通道 A**`views/business/waybill-manage-detail.vue` 只有 23 行,写了 `:detail-id="$route.query.id"` —— 直接绑全局 `$route`**没有路径守卫**。`waybill-manage-page.vue``detailId` watcher 是 `immediate` 且对任何非空 id 都 `openDetail({id})`。于是:
1. 之前打开过的每个运单详情标签(`/business/waybill-manage/detail?id=A``?id=B`…)各是一个被 keep-alive 缓存的独立实例;
2. 跳到配载单详情后,这些实例被 deactivate 但仍随 `$route` 重渲染 → `$route.query.id` 变成配载单 id
3. prop 变化 → `openDetail({id: 配载单id})``getDetail(配载单id)` 去查运单 → 后端「运单管理不存在」→ 拦截器弹一次。**几个旧标签就几条提示**;
4. 且被污染实例的 `isStandaloneWaybillDetailPage` 仍是 live computed(false) → `openDetail``$router.push` 分支 → 又生成新的「运单管理详情」标签(标签栏那串的来源)。
同理风险:`waybill-manage.vue:6``transport-plan.vue:6``:detail-id="$route.query.detailId"``business-crud-page.vue:7356` 会 push `/business/loading-manage?detailId=id`,正好会污染运单列表实例)。
**次因(通道 B**`loading-manage.vue``restoreWaybillRows` 会用 `waybillIdsJson` 里的每个运单 id 并发 `getWaybillDetail(id)`,若历史运单已被删/失效,也会报同一句文案且并发多条。单条 `.catch(() => null)` 挡不住拦截器已弹出的提示。
**区分方法**Network 里看报错请求的 `id` —— 等于 `2097607162718441474`(配载单 id)→ 通道 A;是别的数字(运单 id)→ 通道 B。或先关掉所有「运单管理详情」标签再复现,通道 A 会消失。
**待确认的修法**(用户要求先报不改):
1. `waybill-manage-page.vue``created()``routePathLocked = this.$route.path``detailId` watcher 首行加 `if (this.$route.path !== this.routePathLocked) return;`
2. `openDetail()` 的 push 分支加同样守卫(防其它调用路径)。
3. 宿主 view 绑定加路径守卫(`waybill-manage-detail.vue` / `waybill-manage.vue` / `transport-plan.vue`)双保险。
4. 可选:`getWaybillDetail` 支持静默模式,供 `restoreWaybillRows` 用,避免历史脏数据刷屏。
## 修复(已执行):「运单管理不存在」误报 + 误开标签
用户确认后按上方案落地,5 个文件:
1. `src/views/business/components/waybill-manage-page.vue`
- `data()` 新增 `routePathLocked: this.$route.path` —— **必须放 data,不能放 created**Vue Options API 顺序是 data → computed → watch(immediate) → created(已在 runtime-core `applyOptions` 源码中核实)。放 created 会让首个 immediate watcher 读到空值。
- 新增 computed `isOwnedRouteActive() { return this.$route.path === this.routePathLocked; }`
- `detailId` watcher 首行加 `if (!this.isOwnedRouteActive) return;`
- `openDetail``$router.push` 分支同样加守卫。
2. `src/views/business/components/transport-plan-page.vue`:完全同构的写法(`:detail-id` host 一致),加同样的 `routePathLocked` + `isOwnedRouteActive` + watcher 守卫。
3. `src/views/business/waybill-manage-detail.vue``:detail-id="$route.query.id"``:detail-id="detailId"`computed 做 `this.$route.path === '/business/waybill-manage/detail'` 守卫。
4. `src/views/business/waybill-manage.vue`:同上,守卫 `/business/waybill-manage`(保留旧链接 `?detailId=` 兼容)。
5. `src/views/business/transport-plan.vue`:同上,守卫 `/business/transport-plan`
**验证**
- dev server curl 5 个 .vue + 2 个 scoped style 全部 HTTP 200。
-`@vue/server-renderer` 写了临时 mjs(已删)模拟带 `$route` 的 app,确认 **data() 里访问 `this.$route` 可行**immediate watcher 触发时 `routePathLocked` 已是正确路径、首次加载不被拦截。
- `$route` 是 vue-router 挂在 `app.config.globalProperties` 上的 gettervue-router.mjs:1498),组件实例化时已就绪。
**未做(第 4 条可选)**:给 `getWaybillDetail` 加静默模式供 `restoreWaybillRows` 使用(历史失效运单仍会刷多条红字),待用户定夺。
**另注**`business-crud-page.vue:6651` 有同构的 `detailId` immediate watcher,但全项目只有上述 3 个宿主 view 传 `:detail-id`,它暂无调用方,未动。
**仍未 commit。**
## 修复(已执行):合同详情页整页空白 —— 路由表重复定义
**现象**:主订单详情点合同编号 → `/business/contract-manage/detail?id=...&name=合同详情` 内容区空白(侧栏/标签正常)。
**定位过程(关键:真实浏览器复现,不猜)**
1. 静态排查全部排除:`contract-manage.vue` 及其 26 个依赖 HTTP 200、模块 `import()` 成功、无循环依赖、详情分支引用的 24 个成员全部有定义。
2. dev 环境登录态无法直接拿(验证码 + `admin/admin``error_code 2004 用户密码强度过低`),改为**注入式复现**
- `agent-browser open <目标 URL>`(落 `/login`);
- eval 取 `document.getElementById('app').__vue_app__.config.globalProperties``$router` / `$store`
- 写 cookie `saber3-access-token`(注意 token 走 **js-cookie**,不是 localStorage+ `$store.state.user.token`
- 覆写 `XMLHttpRequest.prototype.open/send` 让所有 `/api/**` 返回 `{code:200,data:{...}}`defineProperty 伪造 readyState/status/responseText 后手动触发 `onloadend`)。
-`$router.push(...)` 做 SPA 跳转。
3. 复现出空白,并拿到决定性证据:
- `/business/contract-manage/detail``$route.matched.length === 1`(只有 Layoutname undefined),`#avue-view.children.length === 0`innerHTML 为 `<!---->`
- 对照 `/business/contract-manage/change`(结构相同但未重复定义)→ `matched.length === 2`(Layout + 合同变更),内容完整渲染。
- `$router.getRoutes()` 里 detail 有 **3 条**记录:2 个 Layout 父记录 + 1 个子记录(`合同详情`)。
**根因**`src/router/views/index.js``/business/contract-manage/detail` **被复制粘贴定义了两次**,两次的子路由都叫 `合同详情`。vue-router 的 `addRoute` 遇到重名会 `removeRoute(name)` 把先注册的子记录删掉,但**不会把它从父记录的 `children` 数组里摘除**;于是第一条 Layout 壳记录留在 matcher 列表里且排在前面,`resolve('/business/contract-manage/detail')` 命中这个"无有效子路由"的壳 → matched 只有 1 层 → `page/index/index.vue``#avue-view` 的二级 `<router-view>` 无匹配 → 内容区空白。
`getRoutes()` 计数是判据:form / change 都是 2 条 = 父 + 子(健康),detail 是 3 条 = 2 父 + 1 子(坏)。)
**修复**:删除重复块(原 314-325 行),只保留 159-169 行那一份。
**验证**
- 重复扫描脚本(正则匹配「顶层 path + `component: Layout` + 首个子路由 name」):views/index.js 27 条 Layout 子路由中仅 `合同详情` 重复;page/index.js 无重复 → 已清零。
- 修复后浏览器复验:detail → `matched.length === 2`Layout + 合同详情)、`#avue-view.children.length === 1`,正文完整渲染「基本信息 / 签约类型 / 合同编号 HT-2026-001 / … / 变更记录」。
- 全量回归:48 条 business/vehicle/payment/settlement 路由 `resolve()``matched.length` 全部 ≥ 2`bad: []`
- `curl` 校验:`views/index.js``contract-manage.vue` 均 200。
- 残留报错均为 mock 数据形状不符所致(所有接口都返回同一个合同对象,导致 `tree.reduce` / `feeCategories.find` 之类失败),非真实缺陷。
**未 commit**(连同 1、2 轮改动一起待确认)。
+19 -89
View File
@@ -1,97 +1,27 @@
# 项目长期记忆(tms-erp-web-ws / Saber3 客商模块
# 项目长期记忆(tms-erp-web-ws / Saber3
## 设计约定(已确认)
后端:`/Users/gxwebsoft/JAVA/tms-api``tms-erp-api-ws` 滞后,别看错仓库)。
### 弹窗分组:统一用全局 `<section-card>`
- 弹窗 body 背景由 `src/styles/element-ui.scss` 全局 `.el-dialog__body { background:#f5f6fa; padding:16px }` 统一灰底
- 每组 = 白底卡片:4px 主色竖条 + 8px 间距 + 圆角 6px + 淡阴影。组件全局注册 `<section-card title="...">`,支持 `#title` / `#extra` slot。
- 仅 3 项的小分组用 `el-col :span="8"` 均分一行。
## 列表 / 表单 / 详情三态同组件分流
`/xxx``/xxx/form``/xxx/detail` 指向同一 `.vue`form/detail 在 `src/router/views/index.js``component: Layout` + 空 `children.path` + `meta:{keepAlive:false}`detail 另带 `activeMenu`)。组件内按 `$route.path` 分流,必须 `watch:{$route}` 重新 init;标签标题取 `query.name`;独立页容器固定 `<div v-if>`,不用 `el-dialog`
### Avue 内置弹窗用 section-carddialogCustomClass 透明化 avue-form
- option 顶层加 `dialogCustomClass:'xxx-dialog'`,再在 `element-ui.scss` 写三条:
1. `.xxx-dialog .avue-form { background:transparent; box-shadow:none; padding:0 }`
2. `.xxx-dialog .avue-form__group > .el-col > .el-form-item { margin-bottom:0 }`
3. `.xxx-dialog .avue-dialog__footer, .avue-crud__dialog .xxx-dialog .avue-dialog__footer { margin-top:0 !important }`
## ⚠️ keep-alive 三坑
背景(`router/tab.js` + `page/index/index.vue`):按 `fullPath` 建 wrapper`<keep-alive :include="tagsKeep">` 缓存,**每标签一实例、永不销毁**,deactivate 后**仍随全局 `$route` 重渲染**。
### 弹窗底部操作栏浮动(全局 CSS)
- `.el-dialog__body { max-height:calc(100vh - 200px); overflow-y:auto; overflow-x:hidden }`
- `.el-dialog__footer { margin:0; padding:12px 20px; background:#fff; border-top:1px solid #ebeef5; box-shadow:0 -2px 8px rgba(0,0,0,.04) }`
- Avue 内置弹窗 footer 真实 class 是 `.avue-dialog__footer`,须 `position:sticky; bottom:0; flex:none; background:#fff` 贴底。
**坑一:独立页容器禁用 `<component :is>` 在 div / el-dialog 间切换。** `append-to-body` 走 Teleport`TeleportImpl.move` 忽略 `moveType`,不会把 DOM 搬回缓存容器 → 切菜单冒出旧弹窗。修法:固定 `<div v-if>` + `deactivated(){closeInnerDialogs()}` + `beforeUnmount()`(写在子组件也生效)。已修 loading-manage / project-apply / waybill-manage-page;未修 `settlement/components/{pre,formal}-settlement-editor.vue``transport-reconciliation-editor.vue``waybill-import-dialog.vue`
### 上传证件区域尺寸(transportCapacity
- 身份证/行驶证/道路运输证等固定 **240×151px**1.586:1)。
- scoped 覆盖 `.xxx-uploader--large { width:240px }``--large .el-upload { width:100%; height:151px }`
**坑二:宿主 view 直绑全局 `$route.query.*` 给子组件 prop。** 缓存实例被灌入当前页 id → 拿错 id 查后端(批量弹「运单管理不存在」),live computed 还会误 push 标签。修法:`routePathLocked` 锁路径 + watcher / push 前判 `isOwnedRouteActive` + 宿主绑定加路径守卫。⚠️ `routePathLocked` **必须放 `data()`**Options API 顺序 data → computed → watch(immediate) → created;放 created 会读到空值、挡掉首次加载)。已修 waybill-manage-page / transport-plan-page + 三个宿主 view。
### 上传图片点击放大预览
- `src/components/image-upload-field/main.vue``<el-image preview-src-list fit="contain" preview-teleported :z-index="3000" @click.stop>`,阻止冒泡到 el-upload。
**坑三:路由表重复定义 → 内容区整页空白(2026-09-18)。** `/business/contract-manage/detail``router/views/index.js` 定义两次、子路由同名 `合同详情`。重名 `addRoute``removeRoute(name)` 移除旧子记录,但**不从父记录 children 里摘除**,第一条 Layout 壳记录留在 matcher 且靠前 → `resolve()` 命中它 → `$route.matched.length === 1` → 二级 router-view 无匹配 → 侧栏/标签正常但内容空白。修法:删重复定义。排查:扫「顶层 path + 首个子路由 name」重复项。
### 独立表单页标题 `archive-page-form__title`
- 样式全局化到 `src/styles/element-ui.scss`18px/600/#303133 + margin-bottom:20px + 4px 主色竖条 + 8px 间距
- business-crud-page 系列通过 `formPageTitle` prop 注入;loading-manage / master-order 手写前置标题
## 样式硬规则
- 底栏 `flex; justify-content:flex-end`**不写 gap**(靠 EP 默认 `.el-button+.el-button{margin-left:12px}`);浮动底栏必须 `position:fixed`(祖先 overflow:hidden 使 sticky 失效)+ `:global(.avue--collapse .x){left:60px}``:global(.avue-layout--horizontal .x){left:0}``:global()` 要包整个选择器
- 按钮层级:次要=无 type;中间步骤=`primary plain`;主操作=`primary`(禁绿、禁两个蓝实心)。顺序 `[辅助][取消][保存草稿][提交]`
- 独立页标题 `.archive-page-form__title`;分组用全局 `<section-card>`;上传证件区 `width:100%; max-width:240px` + `.el-upload{height:151px}`
- ⚠️ `<style scoped lang="scss">` 顶层禁 `//` 注释(Vite5 + sass `Unexpected '/'` → 500),顶层用 `/* */`。其余见 `src/styles/element-ui.scss``AGENTS.md` 4.4。
###格列内嵌输入控件全宽
- `element-ui.scss` 全局兜底:`.el-table .el-table__body td.el-table__cell .cell > .el-input-number/.el-input/.el-select/.el-date-editor/.el-cascader { width:100% }`
### 业务状态标签文字化
- 全站"状态语义"的 `el-tag` `class="status-text"`,转为普通文字,不带颜色/背景/边框/圆点
- 实现:`element-ui.scss` 末尾 `.el-tag.status-text { ... }`
### 弹窗 / 独立表单页底栏按钮统一规则
- **排序**:从左到右按次→主排(次要居左、主操作居右),主操作永远放最后。
- 顺序模板:`[可选辅助工具(如同步/导入)][取消][保存草稿][提交/确认]`
- **容器布局(2026-08-27 改为「去 gap」)**`display:flex; justify-content:flex-end;`**不写 `gap`**)。按钮间距统一由 Element Plus 全局默认的相邻按钮 `.el-button+.el-button{margin-left:12px}` 提供,全站恒为 12px。原各 footer 写死的 `gap:8/12px` 已全部移除。`src/styles/element-ui.scss``.el-dialog__footer .el-button + .el-button` 也已从 `8px``12px`,与之一致。弹窗关闭按钮继承 Element Plus 自带 `.el-dialog__footer` 全局规则(见上条),独立页用 `.archive-form__footer``.archive-page-form & { position:fixed; right:0; left:230px; bottom:0; z-index:10; margin:0; padding:12px 24px; border-top:1px solid #eff1f7; background:#fff; box-shadow:0 -2px 8px rgba(0,0,0,.06); }`
- **⚠️ 浮动底部必须用 `position:fixed`,不能用 `position:sticky`**:本项目布局 `.app-main` / `.basic-container` 祖先带 `overflow:hidden`,会导致 `sticky` 永不触发(footer 不吸底)。固定写法照搬 customer-archive
```scss
.xxx-actions {
position: fixed; right: 0; left: 230px; bottom: 0; margin: 0; z-index: 10;
/* flex-end + padding + border-top + 白底 + 上投影 */
}
:global(.avue--collapse .xxx-actions) { left: 60px; } /* 侧栏折叠 */
:global(.avue-layout--horizontal .xxx-actions) { left: 0; } /* 横向布局 */
```
注意 `:global()` 要把「整个选择器」包进去(customer-archive 写法),不要只包前缀,否则 scoped 会在中间选择器上追加 data 属性导致不匹配。
- **颜色层级 3 档**
| 语义 | type | 备注 |
| --- | --- | --- |
| 次要(取消 / 关闭) | 不写 type(默认) | 灰描边 |
- **全站底部操作栏「返回」已统一改为「取消」**:独立表单页返回列表、弹窗关闭、主从编辑器返回等场景一律写「取消」;仅只读查看 / 纯关闭场景保留「关闭」。
| 中间步骤(保存草稿 / 按匹配结果更新) | `type="primary" plain` | 蓝描边 |
| 主操作(提交 / 完成对账 / 复评确认) | `type="primary"` | 蓝实心 |
- **禁区**
- 保存草稿和主操作不允许同为 `type="primary"`,否则两个蓝实心无视觉层级。
- 主操作禁止用 `type="success"`(绿)。全站统一深蓝实心。
- **生效页面(已按规则统一)**:
- `business/project-apply.vue`footer + 变更 footer
- `vehicle/customer-archive.vue` 全部 5 处 footer`archive-form__footer` 主表单页 + `contact-dialog`/`receipt-dialog`/`invoice-dialog` 子弹窗 + `score-detail-dialog` 含总分合计)
- `business/components/business-crud-page.vue` 的 PageAvueForm 独立表单页(`#menu-form-before` slot 新增 `取消` 按钮,shipping-template 模式验证通过;影响 `/business/waybill-manage/form`、`/business/transport-plan/form`、`/business/shipping-template/form` 三处独立表单页)
- `business/components/master-order-editor.vue` 主 `<footer>`(取消 default + 暂存/确认创建 plain + 创建并调度 primary`position:fixed` 浮动,含 `avue--collapse`/`avue-layout--horizontal` 左偏移)
- **payment 模块**表单页(`__actions` 均 `flex-end` + `position:fixed` 浮动,含 `avue--collapse`/`avue-layout--horizontal` 左偏移):
- `payment-application-form.vue``[取消][保存 plain][提交]`
- `invoice-application-form.vue` / `invoice-receipt-form.vue``[取消][同步 plain][保存 plain][提交]`
- `bill-ledger-form.vue``[取消][确认 primary]`
- `bill-payment-form.vue``[取消][保存 plain][提交]`
- `receipt-flow-form.vue``[取消][确认 primary]`
- `receipt-claim-record-form.vue`(单「关闭」按钮,居中→右对齐浮动)
- **settlement 模块**
- `settlement/components/pre-settlement-editor.vue`(弹窗 + pageMode 两处 footer:保存加 `plain``&__page-actions` 加 `position:fixed` 浮动,含 `avue--collapse`/`avue-layout--horizontal` 左偏移)
- `settlement/components/formal-settlement-editor.vue``.formal-editor__page-actions` 加 `position:fixed` 浮动,含 `avue--collapse`/`avue-layout--horizontal` 左偏移;按钮已 `[取消][提交]` 合规)
- `settlement/receivable-payable-detail.vue`(生成费用弹窗「上一步」改 `plain`
- **已合规未动**`settlement/components/transport-reconciliation-editor.vue``[取消][保存草稿 plain][按匹配结果更新账单 plain][完成对账 primary]`)、`settlement/components/settlement-adjustment-editor.vue`(弹窗 `[取消][保存 primary]`)、`business/temporary-credit-limit.vue`。
- **Avue-form footer 结构注意**`#menu-form-before` slot 内容在 Avue 内置按钮之**左**;`#menu-form` slot 在 Avue 内置按钮之**右**。要实现 `[次要][Avue 主操作]` 顺序,把次要按钮放进 `#menu-form-before`,主操作保留 Avue 内置即可。
- **Avue 表单 footer 按钮去图标(统一纯文字)**:Avue 的 `avue-form` 提交/清空按钮内置图标(`submitIcon: 'el-icon-check'`、`emptyIcon: 'el-icon-delete'`),且 Avue 源码用 `|| 'el-icon-xxx'` 兜底,无法通过 option 配置去掉。已在 `business-crud-page.vue` 样式里用 `:global(.business-crud-form-page-dialog .avue-form__menu .el-icon){display:none}` 统一隐藏,仅作用于独立表单页(PageAvueForm 容器),不影响其它弹窗。新增/编辑弹窗内的 Avue 表单若也要去图标,复用此选择器即可。
- **复杂 footer 例外**:当 footer 需要在按钮组左侧展示「总分合计 / 数量统计」等聚合信息时,块用 `flex:1` 推自己到最左,按钮组按上述规则排在右半边(参考 `score-detail-dialog`)。
## 关键文件
- `src/components/section-card/main.vue`
- `src/styles/element-ui.scss`
- `src/views/vehicle/customer-archive.vue`
- `src/views/transportCapacity/{driver,vehicle,ship}.vue`
- `src/views/business/project-apply.vue`
## 环境注意
- Vite 代理跨域:`axios.withCredentials=true`,改 `.env`/`vite.config.mjs` 须重启 dev。
## business-crud-page 复用模式
- option 由 prop `crudOption` 经 `cloneOption` 克隆。
- 独立表单页走 `PageAvueForm`,不包 el-dialog。
- 自定义详情弹窗:`config.detailButton=true` + `detailSections:[{title, fields}]`。
## 表单 / 自检 / 导出
- placeholder 只写 `请输入`/`请选择`;例外:`请输入或选择车辆`、日期区间 `起`/`止`、示例值。校验 message 须带字段名
- `business-crud-page.vue`option 经 `cloneOption` 克隆,独立表单页走 `PageAvueForm`
- 自检:`curl "localhost:2889/src/xxx.vue"``"...?vue&type=style&index=0&scoped=true&lang.scss"`200 / 500)。`vite build``facelogin.vue` 被沙箱中断,不能作唯一校验。dev `VITE_APP_API=/api` 代理 `172.16.203.228:8000`
- 导出:前端 `exportColumns` 后端未用,以 `XxxExportExcel.java` 为准;BladeX `BeanUtil` 类型不兼容静默跳过(`Date` `LocalDateTime` 丢值,用 `DateUtil.fromDate`
+2
View File
@@ -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" />
+52
View File
@@ -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>
Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

+52
View File
@@ -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,
},
});
};
+3 -4
View File
@@ -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) {
+9
View File
@@ -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`,
+5 -2
View File
@@ -13,11 +13,14 @@ export const getDetail = (id, waybillId) =>
...(waybillId === undefined ? {} : { waybillId }),
},
});
export const getVoucherImages = waybillId =>
export const getVoucherImages = (waybillId, params = {}) =>
request({
url: '/blade-transport/process-config/voucher-images',
method: 'get',
params: { waybillId },
params: {
waybillId,
...params,
},
});
export const submit = api.submit;
export const remove = api.remove;
+7
View File
@@ -6,10 +6,17 @@ 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;
// 项目资金使用风险统计(高风险 / 中风险数量),供列表头部快速筛选标签使用
// 暂未启用:后端 /fund-risk-stats 端点尚未实现,列表页已移除调用,等后端就绪后恢复
export const getFundRiskStats = params =>
request({
url: `${baseUrl}/fund-risk-stats`,
+2
View File
@@ -26,6 +26,8 @@ export const replaceFolderByObject = (voucherId, plateNo, fileInfo) =>
export const removeFolder = (voucherId, plateNo) =>
request({ url: `${baseUrl}/folder-remove`, method: 'post', params: { voucherId, plateNo } });
export const submit = data => request({ url: `${baseUrl}/submit`, method: 'post', data });
export const changeWaybillBatch = data =>
request({ url: `${baseUrl}/change-waybill-batch`, method: 'post', data });
export const createUploadDraft = data =>
request({ url: `${baseUrl}/upload-draft`, method: 'post', data });
export const completeUploadFile = data =>
+8
View File
@@ -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`,
@@ -36,6 +43,7 @@ export const roadLoading = ids =>
});
export const getImportBatches = params => request({ url: `${baseUrl}/import-batch/list`, method: 'get', params });
export const getImportBatchNextCode = () => request({ url: `${baseUrl}/import-batch/next-code`, method: 'get' });
export const getImportDetails = params => request({ url: `${baseUrl}/import-batch/details`, method: 'get', params });
export const removeImportBatches = ids => request({ url: `${baseUrl}/import-batch/remove`, method: 'post', params: { ids } });
export const getImportOptions = () => request({ url: `${baseUrl}/import-batch/options`, method: 'get' });
@@ -29,8 +29,8 @@ export const complete = id =>
request({ url: `${baseUrl}/complete`, method: 'post', params: { id } });
export const completeWithData = data =>
request({ url: `${baseUrl}/complete-with-data`, method: 'post', data });
export const template = mode =>
request({ url: `${baseUrl}/template`, method: 'get', params: { mode }, responseType: 'blob' });
export const template = (mode, params) =>
request({ url: `${baseUrl}/template`, method: 'get', params: { mode, ...params }, responseType: 'blob' });
const importFile = (url, id, file) => {
const data = new FormData();
+14
View File
@@ -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',
});
};
+13
View File
@@ -31,6 +31,19 @@ export const add = row => {
});
};
export const syncIamAccounts = (current = 1, size = 50, signal) => {
return request({
url: '/blade-system/user/sync-iam-accounts',
method: 'post',
params: {
current,
size,
},
timeout: 60000,
signal,
});
};
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
View File
@@ -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
+19
View File
@@ -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;
}
}
+4
View File
@@ -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,
+2
View File
@@ -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);
+133
View File
@@ -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,
},
],
});
+12 -1
View File
@@ -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' },
];
@@ -97,6 +97,11 @@ export const businessTypeOptions = [
{ label: '普通业务', value: '普通业务' },
];
export const businessModeOptions = [
{ label: '国内运输', value: '国内运输' },
{ label: '跨境运输', value: '跨境运输' },
];
export const settlementModeOptions = [
{ label: '先票后款', value: '先票后款' },
{ label: '先款后票', value: '先款后票' },
@@ -125,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: '到场' },
+63 -3
View File
@@ -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',
+32 -13
View File
@@ -1,5 +1,6 @@
import {
auditColumns,
businessModeOptions,
businessTypeOptions,
createCrudOption,
nonNegativeRule,
@@ -129,7 +130,7 @@ export const option = createCrudOption([
hide: true,
minWidth: 140,
maxlength: 20,
rules: textRule('项目简称', 20, true),
rules: textRule('项目简称', 20),
},
{
label: '项目类型',
@@ -168,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,
},
@@ -191,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',
@@ -305,6 +315,15 @@ export const option = createCrudOption([
hide: true,
minWidth: 130,
},
{
label: '业务模式',
prop: 'businessMode',
type: 'select',
dicData: businessModeOptions,
hide: true,
minWidth: 120,
rules: [selectRule('业务模式')],
},
{
label: '项目规模(万元)',
prop: 'projectScale',
@@ -323,6 +342,15 @@ export const option = createCrudOption([
minWidth: 150,
rules: [nonNegativeRule('预计利润')],
},
{
label: '利润率(%',
prop: 'profitRate',
type: 'number',
precision: 2,
hide: true,
minWidth: 120,
rules: [nonNegativeRule('利润率')],
},
{
label: '资金需求(万元)',
prop: 'fundDemand',
@@ -414,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 })),
]);
+18 -16
View File
@@ -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,
},
{
+46 -37
View File
@@ -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%',
+6 -4
View File
@@ -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',
+62 -29
View File
@@ -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)) {
@@ -67,9 +67,7 @@ export const feeDetailBaseColumns = [
];
export const feeDetailTailColumns = [
{ label: '原总金额', prop: 'originalAmountText', minWidth: 120 },
{ label: '调整金额', prop: 'adjustAmountText', minWidth: 120 },
{ label: '调整后总金额', prop: 'afterAmountText', minWidth: 140 },
{ label: '结算金额', prop: 'originalAmountText', minWidth: 120 },
{ label: '备注', prop: 'remark', minWidth: 160 },
{ label: '最后录入人', prop: 'updateUserName', minWidth: 120 },
{ label: '最后录入时间', prop: 'updateTime', minWidth: 170 },
+5
View File
@@ -76,6 +76,11 @@ export const option = {
prop: 'posts',
minWidth: 150,
},
{
label: '驾驶车辆',
prop: 'drivingVehicle',
minWidth: 130,
},
{
label: '所属组织',
prop: 'organizationName',
@@ -21,7 +21,7 @@ export const option = {
label: '车牌号',
prop: 'plateNo',
search: true,
searchOrder: 6,
searchOrder: 7,
slot: true,
minWidth: 120,
},
@@ -29,7 +29,7 @@ export const option = {
label: '业务关系',
prop: 'businessRelation',
search: true,
searchOrder: 5,
searchOrder: 6,
searchValue: '',
type: 'select',
dicData: [
@@ -50,11 +50,18 @@ export const option = {
slot: true,
minWidth: 150,
},
{
label: '使用部门',
prop: 'useDepartment',
search: true,
searchOrder: 3,
minWidth: 140,
},
{
label: '车辆类型',
prop: 'vehicleType',
search: true,
searchOrder: 4,
searchOrder: 5,
type: 'select',
dicData: [
{ label: '全部', value: '' },
@@ -108,7 +115,7 @@ export const option = {
label: '车辆状态',
prop: 'status',
search: true,
searchOrder: 3,
searchOrder: 4,
type: 'select',
slot: true,
dicData: [
@@ -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,
},
],
};
+4 -2
View File
@@ -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' },
],
},
+8 -16
View File
@@ -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,
+2
View File
@@ -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,
+4 -2
View File
@@ -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' },
],
},
+5 -1
View File
@@ -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' },
],
},
{
+3 -1
View File
@@ -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' },
],
},
+4 -2
View File
@@ -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' },
],
},
+5 -13
View File
@@ -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' }],
},
{
+8 -6
View File
@@ -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: '地点',
+12 -1
View File
@@ -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
View File
@@ -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();
+12 -7
View File
@@ -2,6 +2,9 @@ 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';
// 保持懒加载,避免 eager 与 store 循环依赖(Cannot access 'store' before initialization
const modules = import.meta.glob('../**/**/*.vue');
// 将多级路由扁平化为二级路由,支持 keep-alive 跨层级缓存
@@ -96,21 +99,23 @@ RouterPlugin.install = function (option = {}) {
component: (() => {
// 判断是否为首路由
if (first) {
return modules[
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 +132,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 +178,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 +220,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
View File
@@ -128,5 +128,5 @@ export function tabView(route, Component) {
};
wrapperMap.set(tabKey, wrapper);
}
return h(wrapper);
return wrapper;
}
+69 -37
View File
@@ -1,5 +1,8 @@
import Layout from '@/page/index/index.vue';
import Store from '@/store/';
import { wrapViewLoader } from '@/utils/chunk-reload';
const loadView = loader => wrapViewLoader(loader);
export default [
{
@@ -10,7 +13,7 @@ export default [
path: '',
name: '汇票付款表单',
meta: { keepAlive: false, activeMenu: '/payment/bill-payment' },
component: () => import('@/views/payment/bill-payment-form.vue'),
component: loadView(() => import('@/views/payment/bill-payment-form.vue')),
},
],
},
@@ -22,7 +25,7 @@ export default [
path: '',
name: '汇票台账表单',
meta: { keepAlive: false, activeMenu: '/payment/bill-ledger' },
component: () => import('@/views/payment/bill-ledger-form.vue'),
component: loadView(() => import('@/views/payment/bill-ledger-form.vue')),
},
],
},
@@ -34,7 +37,7 @@ export default [
path: '',
name: '认领记录详情',
meta: { keepAlive: false, activeMenu: '/payment/receipt-claim-record' },
component: () => import('@/views/payment/receipt-claim-record-form.vue'),
component: loadView(() => import('@/views/payment/receipt-claim-record-form.vue')),
},
],
},
@@ -46,7 +49,7 @@ export default [
path: '',
name: '收款流水认领',
meta: { keepAlive: false, activeMenu: '/payment/receipt-flow' },
component: () => import('@/views/payment/receipt-flow-form.vue'),
component: loadView(() => import('@/views/payment/receipt-flow-form.vue')),
},
],
},
@@ -58,7 +61,7 @@ export default [
path: '',
name: '收票登记',
meta: { keepAlive: false, activeMenu: '/payment/invoice-receipt' },
component: () => import('@/views/payment/invoice-receipt-form.vue'),
component: loadView(() => import('@/views/payment/invoice-receipt-form.vue')),
},
],
},
@@ -70,7 +73,7 @@ export default [
path: '',
name: '开票申请',
meta: { keepAlive: false, activeMenu: '/payment/invoice-application' },
component: () => import('@/views/payment/invoice-application-form.vue'),
component: loadView(() => import('@/views/payment/invoice-application-form.vue')),
},
],
},
@@ -82,7 +85,7 @@ export default [
path: '',
name: '付款申请',
meta: { keepAlive: false, activeMenu: '/payment/payment-application' },
component: () => import('@/views/payment/payment-application-form.vue'),
component: loadView(() => import('@/views/payment/payment-application-form.vue')),
},
],
},
@@ -97,7 +100,7 @@ export default [
keepAlive: false,
activeMenu: '/settlement/pre-settlement',
},
component: () => import('@/views/settlement/pre-settlement-form.vue'),
component: loadView(() => import('@/views/settlement/pre-settlement-form.vue')),
},
],
},
@@ -112,7 +115,7 @@ export default [
keepAlive: false,
activeMenu: '/settlement/formal-settlement',
},
component: () => import('@/views/settlement/formal-settlement-form.vue'),
component: loadView(() => import('@/views/settlement/formal-settlement-form.vue')),
},
],
},
@@ -127,7 +130,7 @@ export default [
keepAlive: false,
activeMenu: '/settlement/transport-reconciliation',
},
component: () => import('@/views/settlement/transport-reconciliation-form.vue'),
component: loadView(() => import('@/views/settlement/transport-reconciliation-form.vue')),
},
],
},
@@ -139,7 +142,7 @@ export default [
path: '',
name: '执行凭证批次详情',
meta: { keepAlive: false, activeMenu: '/business/voucher-manage' },
component: () => import('@/views/business/voucher-manage-detail.vue'),
component: loadView(() => import('@/views/business/voucher-manage-detail.vue')),
},
],
},
@@ -151,7 +154,19 @@ export default [
path: '',
name: '新增合同管理',
meta: { keepAlive: false },
component: () => import('@/views/business/contract-manage.vue'),
component: loadView(() => import('@/views/business/contract-manage.vue')),
},
],
},
{
path: '/business/contract-manage/detail',
component: Layout,
children: [
{
path: '',
name: '合同详情',
meta: { keepAlive: false, activeMenu: '/business/contract-manage' },
component: loadView(() => import('@/views/business/contract-manage.vue')),
},
],
},
@@ -163,7 +178,7 @@ export default [
path: '',
name: '新增项目申请',
meta: { keepAlive: false },
component: () => import('@/views/business/project-apply.vue'),
component: loadView(() => import('@/views/business/project-apply.vue')),
},
],
},
@@ -175,7 +190,7 @@ export default [
path: '',
name: '新增编辑运单管理',
meta: { keepAlive: false },
component: () => import('@/views/business/waybill-manage.vue'),
component: loadView(() => import('@/views/business/waybill-manage.vue')),
},
],
},
@@ -187,7 +202,7 @@ export default [
path: '',
name: '运单管理详情',
meta: { keepAlive: false, activeMenu: '/business/waybill-manage' },
component: () => import('@/views/business/waybill-manage-detail.vue'),
component: loadView(() => import('@/views/business/waybill-manage-detail.vue')),
},
],
},
@@ -199,7 +214,7 @@ export default [
path: '',
name: '导入运单',
meta: { keepAlive: false, activeMenu: '/business/waybill-import' },
component: () => import('@/views/business/waybill-import.vue'),
component: loadView(() => import('@/views/business/waybill-import.vue')),
},
],
},
@@ -211,7 +226,7 @@ export default [
path: '',
name: '新建导入运单',
meta: { keepAlive: false, activeMenu: '/business/waybill-import' },
component: () => import('@/views/business/waybill-import-form.vue'),
component: loadView(() => import('@/views/business/waybill-import-form.vue')),
},
],
},
@@ -223,6 +238,18 @@ export default [
path: '',
name: '新增编辑配载管理',
meta: { keepAlive: false },
component: loadView(() => import('@/views/business/loading-manage.vue')),
},
],
},
{
path: '/business/loading-manage/detail',
component: Layout,
children: [
{
path: '',
name: '配载单详情',
meta: { keepAlive: false, activeMenu: '/business/loading-manage' },
component: () => import('@/views/business/loading-manage.vue'),
},
],
@@ -235,7 +262,7 @@ export default [
path: '',
name: '新增编辑运输计划',
meta: { keepAlive: false },
component: () => import('@/views/business/transport-plan.vue'),
component: loadView(() => import('@/views/business/transport-plan.vue')),
},
],
},
@@ -247,7 +274,7 @@ export default [
path: '',
name: '导入运输计划',
meta: { keepAlive: false, activeMenu: '/business/transport-plan' },
component: () => import('@/views/business/transport-plan-import.vue'),
component: loadView(() => import('@/views/business/transport-plan-import.vue')),
},
],
},
@@ -259,7 +286,7 @@ export default [
path: '',
name: '计划调度',
meta: { keepAlive: false, activeMenu: '/business/transport-plan' },
component: () => import('@/views/business/transport-plan-dispatch.vue'),
component: loadView(() => import('@/views/business/transport-plan-dispatch.vue')),
},
],
},
@@ -271,7 +298,7 @@ export default [
path: '',
name: '新增编辑运单模板',
meta: { keepAlive: false },
component: () => import('@/views/business/shipping-template.vue'),
component: loadView(() => import('@/views/business/shipping-template.vue')),
},
],
},
@@ -283,7 +310,7 @@ export default [
path: '',
name: '新增客商档案',
meta: { keepAlive: false },
component: () => import('@/views/vehicle/customer-archive.vue'),
component: loadView(() => import('@/views/vehicle/customer-archive.vue')),
},
],
},
@@ -295,7 +322,7 @@ export default [
path: '',
name: '合同变更',
meta: { keepAlive: false },
component: () => import('@/views/business/contract-manage-change.vue'),
component: loadView(() => import('@/views/business/contract-manage-change.vue')),
},
],
},
@@ -311,7 +338,7 @@ export default [
meta: {
i18n: 'dashboard',
},
component: () => import(/* webpackChunkName: "views" */ '@/views/wel/index.vue'),
component: loadView(() => import(/* webpackChunkName: "views" */ '@/views/wel/index.vue')),
},
{
path: 'dashboard',
@@ -320,7 +347,7 @@ export default [
i18n: 'dashboard',
menu: false,
},
component: () => import(/* webpackChunkName: "views" */ '@/views/wel/dashboard.vue'),
component: loadView(() => import(/* webpackChunkName: "views" */ '@/views/wel/dashboard.vue')),
},
],
},
@@ -335,7 +362,7 @@ export default [
meta: {
i18n: 'test',
},
component: () => import(/* webpackChunkName: "views" */ '@/views/util/test.vue'),
component: loadView(() => import(/* webpackChunkName: "views" */ '@/views/util/test.vue')),
},
],
},
@@ -350,8 +377,9 @@ export default [
meta: {
i18n: 'dict',
},
component: () =>
import(/* webpackChunkName: "views" */ '@/views/util/demo/dict-horizontal.vue'),
component: loadView(() =>
import(/* webpackChunkName: "views" */ '@/views/util/demo/dict-horizontal.vue')
),
},
],
},
@@ -366,8 +394,9 @@ export default [
meta: {
i18n: 'dict',
},
component: () =>
import(/* webpackChunkName: "views" */ '@/views/util/demo/dict-vertical.vue'),
component: loadView(() =>
import(/* webpackChunkName: "views" */ '@/views/util/demo/dict-vertical.vue')
),
},
],
},
@@ -382,7 +411,7 @@ export default [
meta: {
i18n: 'info',
},
component: () => import(/* webpackChunkName: "views" */ '@/views/system/userinfo.vue'),
component: loadView(() => import(/* webpackChunkName: "views" */ '@/views/system/userinfo.vue')),
},
],
},
@@ -397,8 +426,9 @@ export default [
meta: {
i18n: 'work',
},
component: () =>
import(/* webpackChunkName: "views" */ '@/views/work/process/leave/form.vue'),
component: loadView(() =>
import(/* webpackChunkName: "views" */ '@/views/work/process/leave/form.vue')
),
},
{
path: 'handle/:taskId/:processInstanceId/:businessId',
@@ -406,8 +436,9 @@ export default [
meta: {
i18n: 'work',
},
component: () =>
import(/* webpackChunkName: "views" */ '@/views/work/process/leave/handle.vue'),
component: loadView(() =>
import(/* webpackChunkName: "views" */ '@/views/work/process/leave/handle.vue')
),
},
{
path: 'detail/:processInstanceId/:businessId',
@@ -415,8 +446,9 @@ export default [
meta: {
i18n: 'work',
},
component: () =>
import(/* webpackChunkName: "views" */ '@/views/work/process/leave/detail.vue'),
component: loadView(() =>
import(/* webpackChunkName: "views" */ '@/views/work/process/leave/detail.vue')
),
},
],
},
+2 -5
View File
@@ -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,
+8
View File
@@ -1085,6 +1085,14 @@ td.el-table-fixed-column--right {
line-height: inherit;
margin-right: 4px;
}
// ============ archive-formlabel 与控件垂直居中全站复用 ============
// archive-form class driver / vehicle / ship / credit-score-quantification / loading-manage
// 多个页面复用垂直居中规则原本锁在 customer-archive.vue scoped 样式里
// 其它页面拿不到 高控件行证件上传 151pxlabel 贴顶提升为全局统一生效
.archive-form .el-form-item {
align-items: center;
}
//.el-form-item {
// margin-bottom: 15px !important;
//}
+168
View File
@@ -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(() => {});
}
+30 -5
View File
@@ -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 {
+255
View File
@@ -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>
+6 -1
View File
@@ -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">
<template v-for="(item, rangeIndex) in getRanges(row)" :key="rangeIndex">
<el-input
v-for="(item, rangeIndex) in getRanges(row)"
:key="rangeIndex"
v-if="rangeIndex === 0"
v-model="item.minimumBillingWeight"
:disabled="!canEditMinimum(row)"
:placeholder="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,21 +548,16 @@ export default {
return next;
},
normalizeRanges(row) {
const ranges = Array.isArray(row.limitRanges)
? row.limitRanges
.map(item => ({
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:
item?.minimumBillingWeight === undefined || item?.minimumBillingWeight === ''
? this.usesRangeMinimum(row)
? row.minimumBillingWeight ?? ''
: ''
: item.minimumBillingWeight,
minimumBillingWeight: this.resolveRangeMinimum(row, item, index),
}))
.filter(
item =>
@@ -582,8 +565,7 @@ export default {
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>
@@ -1883,6 +1883,12 @@
<span>自动生成结算单</span>
<el-radio-group v-model="settlementRuleForm.autoGenerate" :disabled="dialogReadonly">
<el-radio :label="1">开启</el-radio>
<el-tooltip
content="开启时,系统根据配置规则归集运单,定时生成结算单"
placement="top"
>
<el-icon class="settlement-switch-tip"><QuestionFilled /></el-icon>
</el-tooltip>
<el-radio :label="0">关闭</el-radio>
</el-radio-group>
</div>
@@ -1921,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"
>
@@ -1980,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>
@@ -5406,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,
@@ -5831,7 +5896,7 @@ export default {
按数量: ['固定单价', '区间单价', '阶梯单价', '区间阶梯一口价'],
},
settlementTypeOptions: ['月结', '日结', '周结', '半月结', '固定天数周期结算'],
billCycleTypeOptions: ['固定截单日', '自然月'],
billCycleTypeOptions: ['固定截单日', '自然月', '自定义多周期'],
reconciliationModeOptions: ['明细逐行核对', '按账单汇总核对', '跳过自动核对'],
packageOptions,
quantityUnitOptions: ['吨', '千克', '立方米', '件', '车', '箱', '托盘'],
@@ -6442,6 +6507,11 @@ export default {
this.showSettlementBillCycleType && this.settlementRuleForm.billCycleType === '固定截单日'
);
},
showSettlementCustomPeriods() {
return (
this.showSettlementBillCycleType && this.settlementRuleForm.billCycleType === '自定义多周期'
);
},
showSettlementCycleDays() {
return this.settlementRuleForm.settlementType === '固定天数周期结算';
},
@@ -6868,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 (
@@ -6882,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 (
@@ -7019,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]);
@@ -7109,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 || '';
@@ -7560,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 = '';
}
@@ -7584,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 = {
@@ -7597,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 = {
@@ -7626,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)) {
@@ -7643,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) {
@@ -11233,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);
@@ -11252,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;
@@ -11269,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;
}
}
@@ -14453,6 +14628,13 @@ export default {
color: #303133;
}
.settlement-switch-tip {
margin: 0 4px;
color: #a8abb2;
cursor: help;
font-size: 14px;
}
&__module-form {
width: 100%;
@@ -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">
支持pdfbmpjpegpngjpgdocdocxpptpptxxlsxxlsemlmsgzip的文件格式单个文件不超过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,52 +581,47 @@ 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);
row.dispatchQuantity =
decimal || String(value || '').includes('.') ? `${integer}.${decimal.slice(0, 3)}` : integer;
this.syncFreightItems(route);
this.$message.warning('本次数量不能超过剩余数量');
return;
},
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));
}
row.dispatchQuantity = nextValue;
this.syncFreightItems(route);
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('.');
@@ -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) {
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,12 +2302,59 @@ 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)
if (this.transportAddressSelectDisabled) return;
this.openTransportSecondaryAddressPicker(target);
},
openTransportSecondaryAddressPicker(target) {
@@ -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"
:debounce="300"
:fetch-suggestions="fetchDispatchConfiguredCargoTypeSuggestions"
@select="item => handleDispatchConfiguredCargoTypeSelect(dispatchItemForm, item)"
@change="value => handleDispatchConfiguredCargoTypeChange(dispatchItemForm, value)"
/>
</el-select>
</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"
:debounce="300"
:fetch-suggestions="
(queryString, callback) =>
fetchDispatchConfiguredCargoNameSuggestions(
queryString,
callback,
dispatchItemForm
)
"
@select="item => handleDispatchConfiguredCargoNameSelect(dispatchItemForm, item)"
@change="value => handleDispatchConfiguredCargoNameChange(dispatchItemForm, value)"
/>
</el-select>
</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))
}}
@@ -2993,6 +3020,10 @@ export default {
Location,
OfficeBuilding,
Search,
// watcher /
// dataOptions API data computed watch(immediate) created
// created immediate watcher
routePathLocked: this.$route.path,
form: {},
suppressTransportTypeClear: false,
query: {},
@@ -3412,15 +3443,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')}`;
@@ -3563,6 +3600,11 @@ export default {
!this.dialogReadonly
);
},
// tab.js fullPath path
// keep-alive $route id
isOwnedRouteActive() {
return this.$route.path === this.routePathLocked;
},
billingCargoTypeCascaderProps() {
return {
label: 'cargoName',
@@ -3606,12 +3648,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 '行政区划自动带出';
@@ -3639,6 +3682,9 @@ export default {
detailId: {
immediate: true,
handler(id) {
// 宿 view $route.query.detailId
// id
if (!this.isOwnedRouteActive) return;
if (id !== undefined && id !== null && id !== '') {
this.$nextTick(() => this.openDetail({ id }));
}
@@ -3798,6 +3844,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 +4032,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 +4622,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 +5351,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 +5434,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 +5558,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 +5630,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 +5820,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 +7435,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 +7451,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 || '';
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 +7541,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 +8196,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,109 +10,206 @@
: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>
:value="item.id"
/>
</el-select>
</el-form-item>
</div>
<div class="waybill-import-toolbar__search-actions">
<el-button type="primary" @click="loadBatches">查询</el-button
><el-button @click="resetQuery">重置</el-button>
<el-button type="primary" @click="loadBatches">查询</el-button>
<el-button @click="resetQuery">重置</el-button>
</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"
</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>
<el-table :data="batches" border @selection-change="selected = $event">
</div>
<section class="waybill-import-toolbar__table-panel">
<el-table
:data="batches"
:size="tableSize"
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
<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 prop="carrierName" label="承运商" min-width="140" /><el-table-column
<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 prop="waybillCount" label="运单数" width="90" /><el-table-column
<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"
>
<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 prop="updateTime" label="更新时间" min-width="170" sortable />
<el-table-column prop="statusName" label="状态" width="100" /><el-table-column
/><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 type="primary" @click="openDetail(row)">查看</el-link
><el-link
<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 type="danger" @click="removeBatch(row)">删除</el-link></template
>
<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, prev, pager, next, sizes"
:page-sizes="[10, 20, 50]"
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>
<section-card class="waybill-search">
<el-form :inline="true" :model="detailQuery"
><el-form-item label="车牌号/船号"
>
<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
>
</section-card>
<el-table :data="details" border
><el-table-column type="index" label="序号" width="65" /><el-table-column
prop="batchNo"
@@ -126,7 +223,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 +300,20 @@
prop="waybillIdentifier"
label="同一运单标识号"
min-width="140"
/><el-table-column label="" width="80">-</el-table-column></el-table
/></el-table
>
<div class="waybill-import-toolbar__pagination">
<el-pagination
background
v-model:current-page="detailPage.current"
v-model:page-size="detailPage.size"
layout="total, prev, pager, next, sizes"
:page-sizes="[10, 20, 50]"
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
@@ -494,6 +597,7 @@ import { getList as getDriverList } from '@/api/transportCapacity/driver';
import { getDictionary } from '@/api/system/dictbiz';
import * as api from '@/api/business/waybill-manage';
import { downloadXls } from '@/utils/util';
import SectionCard from '@/components/section-card/main.vue';
const props = defineProps({ modelValue: Boolean, standalone: Boolean, createPage: Boolean });
const emit = defineEmits(['update:modelValue', 'closed']);
@@ -506,8 +610,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: '',
@@ -655,23 +783,10 @@ const extractRecords = res => {
if (Array.isArray(data?.data?.records)) return data.data.records;
return [];
};
// PC + + 4 PC202606010001
const batchNoPrefix = 'PC';
const batchNoSequenceLength = 4;
// PC + +
const generateBatchNo = async () => {
const prefix = `${batchNoPrefix}${dayjs().format('YYYYMMDD')}`;
let maxSequence = 0;
try {
const res = await api.getImportBatches({ current: 1, size: 9999 });
extractRecords(res).forEach(item => {
const no = String(item.batchNo || '').trim();
if (!no.startsWith(prefix)) return;
maxSequence = Math.max(maxSequence, Number(no.slice(prefix.length)) || 0);
});
} catch (error) {
maxSequence = 0;
}
return `${prefix}${String(maxSequence + 1).padStart(batchNoSequenceLength, '0')}`;
const res = await api.getImportBatchNextCode();
return res?.data?.data || '';
};
// waybill-manage-page
const getCarrierContractPartyName = (contract = {}) =>
@@ -875,6 +990,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 || [];
@@ -935,9 +1064,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();
};
// 稿稿
@@ -1342,34 +1475,81 @@ const confirmImport = async () => {
<style scoped lang="scss">
.waybill-import-toolbar {
margin-bottom: 12px;
&__search {
display: flex;
align-items: flex-start;
gap: 12px;
.el-form {
flex: 1;
margin-bottom: 0;
padding: 18px 18px 8px;
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 :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 {
@@ -1442,4 +1622,7 @@ const confirmImport = async () => {
:global(.avue-layout--horizontal .waybill-import-create__footer) {
left: 0;
}
.waybill-search .el-form-item{
margin-bottom: 0 !important;
}
</style>
File diff suppressed because it is too large Load Diff
+533 -66
View File
@@ -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="dialog-section-title">合同文件</div>
<div class="attachment-head">
<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>
@@ -52,14 +207,30 @@
<el-tab-pane label="预结算配置" name="pre" />
<el-tab-pane label="正式结算配置" name="formal" />
</el-tabs>
<div class="settlement-switch"><span>自动生成结算单</span><el-radio-group v-model="settlementRule.autoGenerate"><el-radio :label="1">开启</el-radio><el-radio :label="0">关闭</el-radio></el-radio-group></div>
<div class="settlement-switch">
<span>自动生成结算单</span>
<el-radio-group v-model="settlementRule.autoGenerate">
<el-radio :label="1">开启</el-radio>
<el-tooltip content="开启时,系统根据配置规则归集运单,定时生成结算单" placement="top">
<el-icon class="settlement-switch-tip"><QuestionFilled /></el-icon>
</el-tooltip>
<el-radio :label="0">关闭</el-radio>
</el-radio-group>
</div>
<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">
@@ -81,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="userName" 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>
@@ -117,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';
@@ -130,40 +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 = ''; },
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`, uploadTime: this.$dayjs().format('YYYY-MM-DD HH:mm:ss') }); },
handleContractFileChange(list) { this.contractFileRows = (list || []).map(item => ({ ...item, uploadTime: item.uploadTime || this.$dayjs().format('YYYY-MM-DD HH:mm:ss') })); },
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() : ''; },
@@ -171,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>
@@ -201,18 +655,31 @@ 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; }
.unit { margin-left: 8px; }
.attachment-head { display: flex; align-items: center; justify-content: flex-end; margin-bottom: 12px; }
.attachment-upload { display: flex; justify-content: flex-start; margin-top: 12px; }
.attachment-upload .vehicle-attachment-upload { width: auto; }
.attachment-upload .el-upload { display: inline-flex; }
.settlement-switch { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
// radio
.settlement-switch :deep(.el-radio:first-child) { margin-right: 0; }
.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
+310 -141
View File
@@ -1,6 +1,6 @@
<template>
<basic-container class="loading-manage-page">
<div v-if="!isStandaloneFormPage" class="loading-manage-page__search">
<div v-if="!isStandalonePage" class="loading-manage-page__search">
<el-form :model="searchForm" label-position="right" label-width="88px">
<div class="loading-manage-page__search-grid">
<el-form-item label="配载单号">
@@ -222,7 +222,7 @@
</el-form>
</div>
<div v-if="!isStandaloneFormPage" class="loading-manage-page__toolbar">
<div v-if="!isStandalonePage" class="loading-manage-page__toolbar">
<div class="loading-manage-page__toolbar-left">
<el-button type="primary" @click="openLoadingDialog('add')">新建配载</el-button>
<el-button type="primary" plain @click="handleExport">批量导出</el-button>
@@ -242,7 +242,7 @@
</div>
<el-table
v-if="!isStandaloneFormPage"
v-if="!isStandalonePage"
ref="tableRef"
v-loading="loading"
:data="tableData"
@@ -259,7 +259,7 @@
<el-link
type="primary"
class="loading-manage-page__link"
@click="openLoadingDialog('view', row)"
@click="gotoLoadingDetail(row)"
>{{ row.loadingNo }}</el-link
>
</template>
@@ -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
>
@@ -363,7 +363,7 @@
</el-table-column>
</el-table>
<div v-if="!isStandaloneFormPage" class="loading-manage-page__pagination">
<div v-if="!isStandalonePage" class="loading-manage-page__pagination">
<el-pagination
v-model:current-page="page.currentPage"
v-model:page-size="page.pageSize"
@@ -376,27 +376,19 @@
/>
</div>
<component
:is="isStandaloneFormPage ? 'div' : 'el-dialog'"
:model-value="isStandaloneFormPage ? undefined : dialogVisible"
:title="isStandaloneFormPage ? undefined : dialogTitle"
:append-to-body="isStandaloneFormPage ? undefined : true"
:destroy-on-close="isStandaloneFormPage ? undefined : true"
:width="isStandaloneFormPage ? undefined : '96%'"
:top="isStandaloneFormPage ? undefined : '3vh'"
:class="[
'loading-manage-dialog',
{ 'loading-manage-form-dialog': isStandaloneFormPage },
{ 'loading-manage-form-page': isStandaloneFormPage },
]"
:modal="isStandaloneFormPage ? undefined : true"
:show-close="isStandaloneFormPage ? undefined : true"
:close-on-click-modal="isStandaloneFormPage ? undefined : true"
:close-on-press-escape="isStandaloneFormPage ? undefined : true"
@update:model-value="value => !isStandaloneFormPage && (dialogVisible = value)"
@closed="resetLoadingDialog"
<!--
配载单的新增/编辑/重新派单/详情全部是独立整页这里固定渲染普通容器不再按路由切换 el-dialog
原因标签页 keep-alive 会把本页实例缓存下来若容器随 $route div 变回 el-dialog
被缓存的实例会在离开本页后渲染出 append-to-body 的弹窗并永久停留在 body Vue
KeepAlive.deactivate Teleport.move 不会搬走 append-to-body 的弹窗 DOM表现为点左侧菜单又弹出弹窗
-->
<div
v-if="isStandalonePage"
class="loading-manage-dialog loading-manage-form-dialog loading-manage-form-page"
>
<div v-if="isStandaloneFormPage" class="archive-page-form__title">{{ formPageTitle }}</div>
<div class="archive-page-form__title">{{
isStandaloneDetailPage ? detailPageTitle : formPageTitle
}}</div>
<div v-loading="dialogLoading" class="loading-manage-dialog__body">
<div v-if="dialogReadonly" class="loading-detail">
<section-card title="配载单详情">
@@ -583,12 +575,8 @@
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 title="配载信息" class="loading-manage-dialog__load-info-card">
<section-card>
<div class="loading-manage-dialog__candidate-search">
<el-row :gutter="16">
<el-col :span="6">
@@ -632,7 +620,11 @@
<template v-if="candidateSearchVisible">
<el-col :span="6">
<el-form-item label="货物名称">
<el-input v-model="candidateQuery.cargoName" clearable placeholder="请输入" />
<el-input
v-model="candidateQuery.cargoName"
clearable
placeholder="请输入"
/>
</el-form-item>
</el-col>
<el-col :span="6">
@@ -703,7 +695,11 @@
</el-col>
<el-col :span="6">
<el-form-item label="车/船/航班/班列">
<el-input v-model="candidateQuery.vehicleNo" clearable placeholder="请输入" />
<el-input
v-model="candidateQuery.vehicleNo"
clearable
placeholder="请输入"
/>
</el-form-item>
</el-col>
<el-col :span="6">
@@ -792,10 +788,6 @@
</el-col>
</el-row>
</div>
</section-card>
<div title="配载信息" class="loading-manage-dialog__load-info-card">
<section-card title="待配载运单">
<el-table
ref="candidateTableRef"
v-loading="candidateLoading"
@@ -843,27 +835,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 }">
<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 }">
<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 +1003,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">
@@ -1197,27 +1221,12 @@
</el-form>
</div>
<div v-if="isStandaloneFormPage" class="loading-manage-dialog__footer">
<template v-if="dialogReadonly">
<el-button @click="closeLoadingDialog">关闭</el-button>
</template>
<template v-else>
<el-button @click="closeLoadingDialog">关闭</el-button>
<el-button type="primary" plain :loading="dialogSaving === 'draft'" @click="saveDraft">
暂存
</el-button>
<el-button type="primary" :loading="dialogSaving === 'submit'" @click="submitLoading">
{{ dialogMode === 'reassign' ? '确认派单' : '确认' }}
</el-button>
</template>
</div>
<template v-if="!isStandaloneFormPage" #footer>
<div class="loading-manage-dialog__footer">
<template v-if="dialogReadonly">
<el-button @click="closeLoadingDialog">关闭</el-button>
</template>
<template v-else>
<el-button @click="clearLoadingDialog">清空</el-button>
<el-button @click="closeLoadingDialog">关闭</el-button>
<el-button type="primary" plain :loading="dialogSaving === 'draft'" @click="saveDraft">
暂存
</el-button>
@@ -1226,8 +1235,7 @@
</el-button>
</template>
</div>
</template>
</component>
</div>
<el-dialog
v-model="routeChangeVisible"
title="变更运输路线"
@@ -1236,7 +1244,7 @@
width="78%"
class="loading-route-change-dialog"
>
<el-tabs v-model="routeChangeTab">
<el-tabs type="border-card" v-model="routeChangeTab">
<el-tab-pane label="变更路线" name="change">
<section-card title="关联子运单地址">
<el-table :data="routeChangeRows" border>
@@ -1602,7 +1610,6 @@ export default {
searchExpanded: false,
searchForm: createSearchForm(),
selectionRows: [],
dialogVisible: false,
dialogMode: 'add',
dialogLoading: false,
dialogSaving: '',
@@ -1672,16 +1679,6 @@ export default {
if (!this.taskCarrierLoading && !this.taskCarrierOptions.length) return '暂无可用承运商合同';
return '请选择';
},
dialogTitle() {
const titleMap = {
add: '新建配载',
edit: '编辑配载单',
view: '配载单详情',
copy: '复制配载单',
reassign: '重新派单',
};
return titleMap[this.dialogMode] || '配载管理';
},
detailStatusType() {
const typeMap = {
pending: 'success',
@@ -1710,32 +1707,65 @@ export default {
}
);
},
// /business/loading-manage/form?mode=add|edit|reassign
isStandaloneFormPage() {
return (
this.$route.path === '/business/loading-manage/form' &&
['add', 'edit'].includes(this.$route.query.mode)
['add', 'edit', 'reassign'].includes(this.$route.query.mode)
);
},
// /business/loading-manage/detail?id=xxx
isStandaloneDetailPage() {
return this.$route.path === '/business/loading-manage/detail';
},
// / / /
isStandalonePage() {
return this.isStandaloneFormPage || this.isStandaloneDetailPage;
},
formPageDefaultTitle() {
const titleMap = {
add: '新增配载管理',
edit: '编辑配载管理',
reassign: '重新派单',
};
return titleMap[this.$route.query.mode] || '新增配载管理';
},
formPageTitle() {
return (
this.$route.query.name || `${this.$route.query.mode === 'edit' ? '编辑' : '新增'}配载管理`
);
return this.$route.query.name || this.formPageDefaultTitle;
},
detailPageTitle() {
return this.$route.query.name || '配载单详情';
},
},
mounted() {
this.loadTransportTypeOptions();
this.loadTable();
if (this.isStandaloneFormPage) {
if (this.isStandalonePage) {
this.syncStandaloneTagTitle();
this.initStandaloneFormPage();
if (this.isStandaloneDetailPage) this.initStandaloneDetailPage();
else this.initStandaloneFormPage();
}
// /business/loading-manage?detailId=xxx
const detailId = this.$route.query.detailId;
if (detailId) this.openLoadingDialog('view', { id: detailId });
if (detailId) this.gotoLoadingDetail({ id: detailId });
},
// keep-alive
deactivated() {
this.closeInnerDialogs();
},
beforeUnmount() {
this.closeInnerDialogs();
},
watch: {
$route(to, from) {
if (this.isStandaloneFormPage) {
if (!this.isStandalonePage) return;
this.syncStandaloneTagTitle();
if (this.isStandaloneDetailPage) {
// /
const idChanged = String(to.query.id || '') !== String(from?.query?.id || '');
if (idChanged || this.dialogMode !== 'view') this.initStandaloneDetailPage();
return;
}
if (
to.query.mode !== from?.query?.mode ||
String(to.query.id || '') !== String(from?.query.id || '') ||
@@ -1743,18 +1773,15 @@ export default {
) {
this.initStandaloneFormPage();
}
} else if (from?.query?.mode && this.dialogVisible) {
this.closeLoadingDialog();
}
},
'$route.query.detailId'(detailId) {
if (detailId) this.openLoadingDialog('view', { id: detailId });
if (detailId) this.gotoLoadingDetail({ id: detailId });
},
},
methods: {
syncStandaloneTagTitle() {
if (!this.isStandaloneFormPage) return;
const title = this.$route.query.mode === 'edit' ? '编辑配载管理' : '新增配载管理';
if (!this.isStandalonePage) return;
const title = this.isStandaloneDetailPage ? this.detailPageTitle : this.formPageDefaultTitle;
if (this.$route.query.name === title) return;
this.$store.commit('SET_TAG', {
fullPath: this.$route.fullPath,
@@ -1826,6 +1853,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 +1862,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,49 +2158,81 @@ 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: '详情' }];
},
handleRowAction(type, row) {
const actionMap = {
view: () => this.openLoadingDialog('view', row),
view: () => this.gotoLoadingDetail(row),
edit: () => this.openLoadingDialog('edit', row),
reassign: () => this.openLoadingDialog('reassign', row),
copy: () => this.copyLoading(row),
reassign: () => this.gotoLoadingReassign(row),
delete: () => this.deleteLoading(row),
start: () => this.startLoading(row),
cancel: () => this.cancelLoading(row),
complete: () => this.completeLoading(row),
};
actionMap[type]?.();
},
// /
gotoLoadingDetail(row = {}) {
const id = row.id || row.loadingId || row.loadingManageId;
if (!id) {
ElMessage.info('当前配载单暂无详情数据');
return;
}
if (this.isStandaloneDetailPage && String(this.$route.query.id || '') === String(id)) return;
this.$router.push({
path: '/business/loading-manage/detail',
query: { id, name: '配载单详情' },
});
},
//
gotoLoadingReassign(row = {}) {
if (!row.id) {
ElMessage.warning('配载单不存在,无法重新派单');
return;
}
this.$router.push({
path: '/business/loading-manage/form',
query: { mode: 'reassign', id: row.id, name: '重新派单' },
});
},
async initStandaloneDetailPage() {
if (!this.isStandaloneDetailPage) return;
const id = this.$route.query.id;
if (!id) {
ElMessage.warning('缺少配载单参数,无法查看详情');
this.closeLoadingDialog();
return;
}
await this.openLoadingDialog('view', { id });
},
async initStandaloneFormPage() {
if (!this.isStandaloneFormPage) return;
const mode = this.$route.query.mode === 'edit' ? 'edit' : 'add';
const queryMode = this.$route.query.mode;
const mode = ['edit', 'reassign'].includes(queryMode) ? queryMode : 'add';
const copyId = mode === 'add' ? this.$route.query.copyId : '';
await this.openLoadingDialog(mode, {
id: copyId || this.$route.query.id,
@@ -2077,7 +2253,12 @@ export default {
}
},
async openLoadingDialog(mode, row) {
if (['add', 'edit'].includes(mode) && !this.isStandaloneFormPage) {
// //
if (['add', 'edit', 'reassign'].includes(mode) && !this.isStandaloneFormPage) {
if (mode === 'reassign') {
this.gotoLoadingReassign(row || {});
return;
}
this.$router.push({
path: '/business/loading-manage/form',
query: {
@@ -2089,7 +2270,6 @@ export default {
return;
}
this.dialogMode = mode;
this.dialogVisible = true;
this.dialogLoading = true;
this.resetDialogData();
if (mode === 'add') this.candidateQuery.transportType = 'road';
@@ -2122,17 +2302,9 @@ export default {
}
},
closeLoadingDialog() {
if (this.isStandaloneFormPage) {
if (!this.isStandalonePage) return;
this.$router.$avueRouter?.closeTag?.();
this.$router.push({ path: '/business/loading-manage', query: {} });
return;
}
this.dialogVisible = false;
},
resetLoadingDialog() {
this.resetDialogData();
this.dialogSaving = '';
this.dialogLoading = false;
},
resetDialogData() {
this.detailAmap?.destroy?.();
@@ -2154,10 +2326,11 @@ export default {
this.processProjectId = '';
this.processProjectOptions = [];
},
clearLoadingDialog() {
this.resetDialogData();
if (this.dialogMode === 'add') this.candidateQuery.transportType = 'road';
this.loadCandidateWaybills();
// / append-to-body DOM body
closeInnerDialogs() {
this.routeChangeVisible = false;
this.commonAddressVisible = false;
this.candidateSearchVisible = false;
},
restoreRouteAndCargo() {
const routeRows = parseJsonArray(this.dialogForm.routeJson);
@@ -2466,10 +2639,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 +2740,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 +2953,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 +2972,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 +3439,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 {
@@ -3293,7 +3461,6 @@ export default {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
}
.loading-manage-dialog__table-toolbar {
@@ -3627,7 +3794,9 @@ export default {
box-sizing: border-box;
background: #f5f6fa;
}
:global(.loading-manage-form-page .loading-manage-dialog__body) {
/* /// #avue-view 78vh
此处权重必须高于 .loading-manage-dialog .loading-manage-dialog__body故带上 .loading-manage-page 外壳 */
:global(.loading-manage-page .loading-manage-form-dialog.loading-manage-form-page .loading-manage-dialog__body) {
max-height: none;
overflow: visible;
padding-right: 0;
+209 -105
View File
@@ -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>
:value="item.value"
/>
</el-select>
</el-form-item>
<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
<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>
end-placeholder="请选择"
/>
</el-form-item>
</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>
<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;
.master-order-page {
&__search {
padding: 12px 12px 4px;
margin-bottom: 8px;
background: #fff;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
.el-form-item {
}
&__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 {
+36 -13
View File
@@ -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
+406 -18
View File
@@ -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"
>
<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]);
},
@@ -824,7 +975,6 @@ export default {
.el-form-item__label {
height: auto !important;
line-height: 18px;
//padding-top: 7px; // label input 线
}
// 线
@@ -832,19 +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;
}
// //
.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>
+333 -212
View File
@@ -1,61 +1,98 @@
<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 || '-' }}
</span>
<el-tag :type="getStatusTagType(planData.businessStatus)" effect="light" class="status-text">
<strong>计划调度</strong>
<span>{{ planData.planNo || planData.loadingNo || '-' }}</span>
<span class="detail-status-text" :class="statusTextClass">
{{ planData.businessStatusName || '-' }}
</el-tag>
<el-tag type="primary" effect="light">
</span>
<span class="detail-status-text detail-transport-type">
{{ planData.transportTypeName || '公路整车' }}
</el-tag>
</span>
</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">
<span class="transport-plan-dispatch-page__summary-label">客户</span>
<span class="transport-plan-dispatch-page__summary-value">
{{ planData.customerName || '-' }}
</div>
</span>
</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">
<span class="transport-plan-dispatch-page__summary-label">合同编号</span>
<span class="transport-plan-dispatch-page__summary-value is-link">
{{ planData.contractNo || '-' }}
</div>
</span>
</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">
<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>
<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">
<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 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">
</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"
@@ -63,55 +100,15 @@
: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>
<span v-if="!attachmentList.length">-</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 class="transport-plan-dispatch-page__list-card">
<template #title>
@@ -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) {
//
if (!component) return;
component.dispatchRow = this.planData;
component.dispatchRows = [...this.dispatchList];
//
component.openDispatchItemDialog(index, row);
}
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;
flex-wrap: wrap;
gap: 12px;
margin-bottom: 18px;
strong {
font-size: 20px;
}
.detail-status-text {
display: inline-flex;
align-items: center;
height: 28px;
padding: 0 12px;
border-radius: 8px;
font-size: 13px;
line-height: 28px;
}
.status-text-success,
.is-dispatching {
color: #67c23a;
background: #e1f3d8;
}
.detail-transport-type {
color: #409eff;
background: #ecf5ff;
}
.is-danger {
color: #f56c6c;
background: #fef0f0;
}
.is-info {
color: #909399;
background: #f4f4f5;
}
}
&__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;
text-align: center;
}
&__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;
}
&-name {
font-size: 18px;
}
&-no {
font-size: 14px;
color: #606266;
.is-end & {
background: #67c23a;
}
}
&__summary {
&__route-line {
width: 100%;
height: 6px;
margin-top: 15px;
border-radius: 1px;
background: #e4e7ed;
}
&__route-detail {
display: flex;
gap: 16px;
&-card {
flex: 1;
min-width: 0;
flex-direction: column;
align-items: center;
gap: 5px;
margin-top: 8px;
width: 100%;
}
&-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
&__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;
}
&-item {
&__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;
&.is-wide {
grid-column: 1 / -1;
}
}
&-label {
font-size: 14px;
color: #909399;
}
&-value {
font-size: 14px;
color: #303133;
}
}
&__route-card {
flex: 1;
}
&__route {
div {
display: flex;
align-items: center;
gap: 24px;
&-item {
flex: 1;
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;
}
}
.status-text {
font-size: 12px;
@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;
}
}
}
</style>
+10 -1
View File
@@ -1,9 +1,11 @@
<template>
<!-- waybill-manage-detail.vue只在当前路由属于本页时才透传 detailId
避免标签页缓存的实例被其它页面的 detailId 污染后误开详情 -->
<transport-plan-page
:api="api"
:config="config"
:crud-option="option"
:detail-id="$route.query.detailId"
:detail-id="detailId"
:menu-width="220"
standalone-form-page
/>
@@ -14,6 +16,8 @@ import TransportPlanPage from './components/transport-plan-page.vue';
import * as api from '@/api/business/transport-plan';
import { config, option } from '@/option/business/transport-plan';
const listRoutePath = '/business/transport-plan';
export default {
components: { TransportPlanPage },
data() {
@@ -23,5 +27,10 @@ export default {
option,
};
},
computed: {
detailId() {
return this.$route.path === listRoutePath ? this.$route.query.detailId : '';
},
},
};
</script>
+10 -2
View File
@@ -22,7 +22,7 @@
<el-table-column prop="processStatus" label="处理状态" width="130" />
<el-table-column prop="createTime" label="创建时间" min-width="180" />
<el-table-column prop="updateTime" label="更新时间" min-width="180" />
<el-table-column label="操作" width="220" fixed="right"><template #default="{ row }"><div class="voucher-folder-page__actions"><el-link v-if="row.matched !== 1" type="primary" @click="openReplace(row)">单个上传</el-link><el-link type="primary" @click="openViewer(row)">查看</el-link><el-link type="danger" @click="removeFolder(row)">删除</el-link></div></template></el-table-column>
<el-table-column label="操作" width="220" fixed="right"><template #default="{ row }"><div class="voucher-folder-page__actions"><el-link v-if="isSuperAdmin && row.matched !== 1" type="primary" @click="openReplace(row)">单个上传</el-link><el-link type="primary" @click="openViewer(row)">查看</el-link><el-link type="danger" @click="removeFolder(row)">删除</el-link></div></template></el-table-column>
</el-table>
<div class="voucher-folder-page__pagination"><el-pagination v-model:current-page="page.current" v-model:page-size="page.size" :total="page.total" :page-sizes="[10, 20, 50]" layout="total, prev, pager, next, sizes" @current-change="load" @size-change="load" /></div>
</section>
@@ -39,15 +39,23 @@
</template>
<script setup>
import { onMounted, reactive, ref } from 'vue';
import { computed, onMounted, reactive, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { useStore } from 'vuex';
import { ElMessage, ElMessageBox } from 'element-plus';
import md5 from 'js-md5';
import * as api from '@/api/business/voucher-manage';
const route = useRoute();
const router = useRouter();
const store = useStore();
const voucherId = route.query.id;
const isSuperAdmin = computed(() => {
const authority = store.getters.userInfo?.authority;
return Array.isArray(authority)
? authority.includes('admin')
: String(authority || '').includes('admin');
});
const loading = ref(false), rows = ref([]), voucher = ref({ voucherBatchNo: route.query.batchNo || '' });
const page = reactive({ current: 1, size: 10, total: 0 });
const query = reactive({ plateNo: '', matched: undefined });
+128 -18
View File
@@ -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,15 +86,22 @@
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"
/><el-table-column
prop="relatedWaybillCount"
label="已关联运单"
width="115"
/><el-table-column prop="unRelatedWaybillCount" label="未关联运单" width="115" />
label="凭证已关联数量"
width="125"
/><el-table-column prop="unRelatedWaybillCount" label="凭证未关联数量" width="125" />
<el-table-column prop="createTime" label="创建时间" min-width="170" />
<el-table-column
prop="auditStatus"
@@ -100,7 +109,16 @@
width="120"
fixed="right"
align="center"
/><el-table-column label="" width="320" fixed="right" align="left"
><template #default="{ row }"
><span class="voucher-manage-page__audit-status"
><span>{{ row.auditStatus }}</span
><el-tooltip
v-if="row.auditStatus === '审核驳回' && hasRejectReason(row)"
:content="row.rejectReason"
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="220" fixed="right" align="center"
><template #default="{ row }"
><div class="voucher-manage-page__actions">
<el-link
@@ -121,22 +139,22 @@
@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
><el-link
v-if="row.auditStatus === '审核驳回'"
type="primary"
@click="openUpload(row, 'changeBatch')"
@click="openBatchDialog(row)"
>更换运单批次</el-link
><el-link
v-if="row.processStatus !== '处理完成' || row.auditStatus === '待审核'"
v-if="(row.processStatus !== '处理完成' || row.auditStatus === '待审核') && row.auditStatus !== '审核驳回'"
type="primary"
@click="openUpload(row)"
@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
@@ -270,7 +288,7 @@
class="voucher-manage-page__upload-progress"
/></el-form-item>
<el-form-item label="关联运输批次" prop="waybillImportBatchIds"
><el-button type="primary" @click="openBatchDialog">选择</el-button></el-form-item
><el-button type="primary" @click="openBatchDialog()">选择</el-button></el-form-item
>
</el-form>
</section-card>
@@ -328,7 +346,11 @@
placeholder="请输入" /></el-form-item></el-col
><el-col :span="12"
><el-form-item label="运单数"
><el-input-number v-model="batchQuery.waybillCount" :min="0" /></el-form-item></el-col
><el-input
v-model="batchQuery.waybillCount"
clearable
placeholder="请输入"
@input="handleWaybillCountInput" /></el-form-item></el-col
></el-row>
<div class="voucher-manage-page__search-actions">
<el-button type="primary" @click="loadBatches">查询</el-button
@@ -373,7 +395,7 @@
</div>
<template #footer
><el-button @click="batchVisible = false">取消</el-button
><el-button type="primary" @click="confirmBatches">确认</el-button></template
><el-button type="primary" :loading="batchSaving" @click="confirmBatches">确认</el-button></template
>
</el-dialog>
@@ -484,6 +506,7 @@ import { useRouter } from 'vue-router';
import { useStore } from 'vuex';
import md5 from 'js-md5';
import { ElMessage, ElMessageBox } from 'element-plus';
import { WarnTriangleFilled } from '@element-plus/icons-vue';
import { getList as getProjectList } from '@/api/business/project-apply';
import * as api from '@/api/business/voucher-manage';
import SectionCard from '@/components/section-card/main.vue';
@@ -499,6 +522,12 @@ const hasPermission = code => {
if (isAdmin.value) return true;
return permission.value?.[code] === true;
};
const hasRejectReason = row => {
const reason = row?.rejectReason;
return typeof reason === 'string'
? reason.trim().length > 0
: reason !== undefined && reason !== null;
};
// ""
const isCarrier = ref(false);
@@ -521,6 +550,9 @@ const loading = ref(false),
detailRow = ref({}),
uploadVisible = ref(false),
batchVisible = ref(false),
batchDialogMode = ref('upload'),
batchTarget = ref(),
batchSaving = ref(false),
progressVisible = ref(false),
uploadFormRef = ref(),
uploading = ref(false),
@@ -862,9 +894,18 @@ watch(uploadVisible, visible => {
// Esc v-model
if (!visible && !closingUploadDialog.value) void stopCurrentUpload(editing.fileTaskId);
});
const openBatchDialog = async () => {
const openBatchDialog = async row => {
// @click MouseEvent
const voucher = row instanceof Event ? undefined : row;
batchDialogMode.value = voucher?.id ? 'change' : 'upload';
batchTarget.value = voucher?.id ? voucher : undefined;
batchSelection.value = [];
batchVisible.value = true;
await loadBatches();
if (voucher?.waybillBatchNo) {
const currentBatch = batchRows.value.find(item => item.batchNo === voucher.waybillBatchNo);
if (currentBatch) batchSelection.value = [currentBatch];
}
};
const loadBatches = async () => {
const res = await api.getWaybillBatches(batchPage.current, batchPage.size, {
@@ -878,13 +919,56 @@ const loadBatches = async () => {
batchRows.value = data.records || [];
batchPage.total = data.total || 0;
};
const handleWaybillCountInput = value => {
//
const filtered = value.replace(/[^\d]/g, '');
if (filtered !== value) {
batchQuery.waybillCount = filtered;
}
//
if (filtered.length > 1 && filtered.startsWith('0')) {
batchQuery.waybillCount = filtered.replace(/^0+/, '');
}
};
const resetBatchQuery = () => {
Object.assign(batchQuery, { batchNo: '', createUser: '', waybillCount: undefined });
batchCreateRange.value = [];
batchPage.current = 1;
loadBatches();
};
const selectBatch = row => {
const updateWaybillBatch = async (target, selected) => {
if (!target?.id) {
ElMessage.error('缺少凭证批次信息');
return false;
}
if (!selected?.batchNo) {
ElMessage.warning('请选择运单批次');
return false;
}
batchSaving.value = true;
try {
await api.changeWaybillBatch({
voucherId: target.id,
waybillImportBatchIds: [selected.id],
});
target.waybillBatchNo = selected.batchNo;
batchVisible.value = false;
ElMessage.success('运单批次更换成功,已提交重新匹配任务');
await load();
return true;
} catch (error) {
ElMessage.error(error.message || '运单批次更换失败');
return false;
} finally {
batchSaving.value = false;
}
};
const selectBatch = async row => {
if (batchDialogMode.value === 'change') {
batchSelection.value = [row];
await updateWaybillBatch(batchTarget.value, row);
return;
}
const batches = new Map();
selectedBatches.value.forEach(item => {
if (!batches.has(item.batchNo)) batches.set(item.batchNo, item);
@@ -894,7 +978,12 @@ const selectBatch = row => {
editing.waybillImportBatchIds = selectedBatches.value.map(item => item.id);
batchVisible.value = false;
};
const confirmBatches = () => {
const confirmBatches = async () => {
if (batchDialogMode.value === 'change') {
const selected = batchSelection.value[0];
await updateWaybillBatch(batchTarget.value, selected);
return;
}
const batches = new Map();
batchSelection.value.forEach(item => {
if (!batches.has(item.batchNo)) batches.set(item.batchNo, item);
@@ -1158,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',
@@ -1240,9 +1337,22 @@ load();
padding: 0;
min-height: auto;
}
&__audit-status {
display: inline-flex;
align-items: center;
}
&__audit-reject-icon {
margin-left: 4px;
color: #f56c6c;
cursor: help;
}
&__process-failed {
color: #f56c6c;
}
&__actions {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 2px 12px;
}
&__pagination {
+6 -21
View File
@@ -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>
+14 -1
View File
@@ -1,9 +1,15 @@
<template>
<!--
detailId 必须做路由守卫本组件对应 /business/waybill-manage/detail
$route 是全局响应式的标签页 keep-alive 会缓存本实例路由切到别的详情页后
实例仍会重渲染若无守卫就会把当前页面的 id灌进子组件导致它拿别的单据 id
去查运单 运单管理不存在并误生成一个又一个运单详情标签
-->
<waybill-manage-page
:api="api"
:config="config"
:crud-option="option"
:detail-id="$route.query.id"
:detail-id="detailId"
:menu-width="250"
standalone-detail-page
/>
@@ -14,10 +20,17 @@ import WaybillManagePage from './components/waybill-manage-page.vue';
import * as api from '@/api/business/waybill-manage';
import { config, option } from '@/option/business/waybill-manage';
const detailRoutePath = '/business/waybill-manage/detail';
export default {
components: { WaybillManagePage },
data() {
return { api, config, option };
},
computed: {
detailId() {
return this.$route.path === detailRoutePath ? this.$route.query.id : '';
},
},
};
</script>
+10 -1
View File
@@ -1,9 +1,11 @@
<template>
<!-- waybill-manage-detail.vue保留旧链接 /business/waybill-manage?detailId=xxx 的能力
但只在当前路由确实属于本页时才透传避免被其它页面的 detailId 污染 -->
<waybill-manage-page
:api="api"
:config="config"
:crud-option="option"
:detail-id="$route.query.detailId"
:detail-id="detailId"
:menu-width="250"
standalone-form-page
/>
@@ -14,6 +16,8 @@ import WaybillManagePage from './components/waybill-manage-page.vue';
import * as api from '@/api/business/waybill-manage';
import { config, option } from '@/option/business/waybill-manage';
const listRoutePath = '/business/waybill-manage';
export default {
components: { WaybillManagePage },
data() {
@@ -23,5 +27,10 @@ export default {
option,
};
},
computed: {
detailId() {
return this.$route.path === listRoutePath ? this.$route.query.detailId : '';
},
},
};
</script>
+12 -4
View File
@@ -882,7 +882,7 @@ export default {
item.receiverName !== first.receiverName
);
if (incompatible) {
this.$message.warning('合并开票的结算单必须属于同一合同、项目、组织及收付款方');
this.$message.warning('合并开票的结算单必须属于同一合同');
return;
}
this.form.settlements = rows.map(item => ({
@@ -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) {
@@ -1252,7 +1260,7 @@ export default {
}
.invoice-form-page__dialog-search {
display: flex;
justify-content: flex-end;
justify-content: flex-start;
gap: 8px;
margin-bottom: 12px;
}
+1 -1
View File
@@ -216,7 +216,7 @@
<el-input
v-model="settlementDialog.keyword"
clearable
placeholder="结算单号、项目或合同"
placeholder="3结算单号、项目或合同"
@keyup.enter="loadSettlementCandidates"
/>
<el-button type="primary" @click="loadSettlementCandidates">查询</el-button>
@@ -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 = [];
@@ -565,7 +565,7 @@
/>
</el-form-item>
<el-form-item label="合同类别">
<el-select v-model="contractDialog.query.contractCategory" clearable placeholder="请选择">
<el-select :model-value="contractDialogCategory" disabled placeholder="请选择">
<el-option
v-for="item in contractCategoryOptions"
:key="item.value"
@@ -1027,7 +1027,7 @@ export default {
contractName: '',
projectName: '',
organizationName: '',
contractCategory: '',
contractCategory: '承运商合同',
signType: '',
effectiveType: '',
contractStage: '',
@@ -1161,6 +1161,9 @@ export default {
settlementTypeName() {
return this.form.settlementType === 'receivable' ? '应收' : '应付';
},
contractDialogCategory() {
return '承运商合同';
},
summaryTotal() {
//
if (this.summaryFees.length) {
@@ -1257,8 +1260,8 @@ export default {
deptId: first.deptId,
deptName: first.deptName,
settlementType,
partyA: settlementType === 'receivable' ? first.payeeName : first.payerName,
partyB: settlementType === 'receivable' ? first.payerName : first.payeeName,
partyA: first.payerName,
partyB: first.payeeName,
});
}
this.handleContractChange(contractId);
@@ -1415,7 +1418,10 @@ export default {
const { data } = await getContractList(
this.contractDialog.page.current,
this.contractDialog.page.size,
{ ...this.contractDialog.query }
{
...this.contractDialog.query,
contractCategory: this.contractDialogCategory,
}
);
const page = data?.data || {};
this.contractDialog.rows = page.records || [];
@@ -1434,7 +1440,7 @@ export default {
contractName: '',
projectName: '',
organizationName: '',
contractCategory: '',
contractCategory: this.contractDialogCategory,
signType: '',
effectiveType: '',
contractStage: '',
@@ -1519,13 +1525,8 @@ export default {
this.form.deptId = contract.deptId;
this.form.deptName = contract.deptName;
this.form.settlementType = contract.settlementType || 'payable';
if (this.form.settlementType === 'receivable') {
this.form.payerName = contract.partyB;
this.form.payeeName = contract.partyA;
} else {
this.form.payerName = contract.partyA;
this.form.payeeName = contract.partyB;
}
this.summaryFees = [];
},
async saveDraft(shouldSubmit) {
@@ -50,6 +50,9 @@
:precision="2"
disabled
/>
<span v-else-if="field.prop === 'reconciliationMode'">
{{ reconciliationModeLabel }}
</span>
<span v-else>{{ displayValue(form[field.prop]) }}</span>
</el-form-item>
</el-col>
@@ -202,10 +205,18 @@
<section-card title="导入外部账单">
<template #extra>
<div class="reconciliation-editor__actions" v-if="editable">
<el-button type="primary" plain @click="downloadTemplate('vehicle')"
<el-button
v-if="form.reconciliationMode === 'vehicle'"
type="primary"
plain
@click="downloadTemplate('vehicle')"
>下载整车对账模板</el-button
>
<el-button type="primary" plain @click="downloadTemplate('cargo')"
<el-button
v-if="form.reconciliationMode === 'cargo'"
type="primary"
plain
@click="downloadTemplate('cargo')"
>下载货物明细对账模板</el-button
>
<el-button type="primary" plain @click="chooseImport">导入</el-button>
@@ -371,6 +382,11 @@
formatMoney(row.settlementAmount, row.currency)
}}</template></el-table-column
>
<el-table-column label="审批状态" width="110"
><template #default="{ row }">{{
formalApprovalStatusLabel(row.approvalStatus)
}}</template></el-table-column
>
<el-table-column label="操作" width="100" fixed="right" align="center">
<template #default="{ row }">
<el-link type="primary" @click="selectFormal(row)">选择</el-link>
@@ -1078,12 +1094,26 @@ export default {
getFeeItemAmount(row, name) {
return (row.feeItems || this.parseFeeItems(row.feeItemsJson))[name] ?? 0;
},
formalApprovalStatusLabel(value) {
return (
{
draft: '草稿',
reviewing: '审批中',
approved: '审批通过',
returned: '已驳回',
voided: '已作废',
}[value] ||
value ||
'-'
);
},
async loadFormalOptions() {
this.formalDialog.loading = true;
try {
const params = {
settlementType: this.settlementType,
keyword: this.formalDialog.query.keyword,
approvalStatus: 'draft',
};
const data = this.unwrapData(
await api.getFormalOptions(
@@ -1092,20 +1122,8 @@ export default {
params
)
);
let rows = data.records || [];
let total = data.total || 0;
if (!rows.length) {
const fallback = await formalSettlementApi.getList(
this.formalDialog.page.current,
this.formalDialog.page.size,
{ ...params, approvalStatus: 'approved' }
);
const fallbackData = this.unwrapData(fallback);
rows = fallbackData.records || [];
total = fallbackData.total || 0;
}
this.formalDialog.rows = rows;
this.formalDialog.page.total = total;
this.formalDialog.rows = data.records || [];
this.formalDialog.page.total = data.total || 0;
} finally {
this.formalDialog.loading = false;
}
@@ -1116,6 +1134,9 @@ export default {
await this.selectFormal(this.formalDialog.selected[0]);
},
async selectFormal(selected) {
if (selected?.approvalStatus && selected.approvalStatus !== 'draft') {
return this.$message.warning('只能选择草稿状态的正式结算单');
}
const formalSettlementChanged = this.form.formalSettlementId !== selected.id;
this.form = {
...this.form,
@@ -1485,7 +1506,14 @@ export default {
}
},
async downloadTemplate(mode) {
const response = await api.template(mode);
if (!this.form.formalSettlementId) {
return this.$message.warning('请先选择正式结算单');
}
const response = await api.template(mode, {
id: this.currentId,
formalSettlementId: this.form.formalSettlementId,
feeItems: this.internalFeeItemNames.join(','),
});
downloadXls(
response.data,
`${mode === 'cargo' ? '货物明细对账模板' : '整车总额对账模板'}.xlsx`
@@ -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) {
+5 -1
View File
@@ -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) {
@@ -145,7 +145,9 @@
:align="column.align || 'center'"
show-overflow-tooltip
>
<template #default="{ row }">{{ formatDetailCell(row, column.prop) }}</template>
<template #default="{ row }">
{{ formatFeeDetailCell(row, column.prop) }}
</template>
</el-table-column>
</el-table>
</el-tab-pane>
@@ -167,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>
@@ -398,12 +394,14 @@
maxlength="300"
placeholder="请输入调整原因"
/>
<span v-else-if="column.prop === 'adjustAmountText'">
{{ fixedTwoDecimals(row.adjustAmount) }}
</span>
<span v-else-if="column.prop === 'afterAmountText'">
{{ fixedTwoDecimals(row.afterAmount) }}
<span v-else-if="column.prop === 'originalAmountText'">
{{
Number(row.adjustAmount || 0) !== 0
? fixedTwoDecimals(row.afterAmount)
: fixedTwoDecimals(row.originalAmount)
}}
</span>
<span v-else>{{ formatDetailCell(row, column.prop) }}</span>
</template>
</el-table-column>
@@ -1135,7 +1133,13 @@ export default {
},
feeDetailColumns() {
const baseColumns = feeDetailBaseColumns.filter(column => column.prop !== 'freightAmount');
return [...baseColumns, ...this.dynamicFeeColumns, ...feeDetailTailColumns];
const hasAdjustment = this.feeRows.some(row => Number(row.adjustAmount || 0) !== 0);
const tailColumns = feeDetailTailColumns.map(col =>
col.prop === 'originalAmountText' && hasAdjustment
? { ...col, label: '调整后金额' }
: col
);
return [...baseColumns, ...this.dynamicFeeColumns, ...tailColumns];
},
displayTableColumns() {
const columns = this.tableColumns.filter(
@@ -1181,7 +1185,7 @@ export default {
adjustFeeColumns() {
const baseColumns = feeDetailBaseColumns.filter(column => column.prop !== 'freightAmount');
const tailColumns = feeDetailTailColumns.filter(column => column.prop !== 'remark');
const afterAmountIndex = tailColumns.findIndex(column => column.prop === 'afterAmountText');
const afterAmountIndex = tailColumns.findIndex(column => column.prop === 'originalAmountText');
tailColumns.splice(afterAmountIndex + 1, 0, {
label: '调整原因',
prop: 'changeReason',
@@ -2596,6 +2600,22 @@ export default {
}
return this.formatCell(row?.[prop]);
},
formatFeeDetailCell(row, prop) {
if (prop !== 'originalAmountText') return this.formatDetailCell(row, prop);
const adjustAmount = Number(row?.adjustAmount || 0);
if (adjustAmount === 0) return this.formatDetailCell(row, prop);
const adjustedAmount = Number(
row?.afterAmount ?? row?.adjustedAmount ?? row?.settlementAmount
);
if (Number.isFinite(adjustedAmount)) return this.fixedTwoDecimals(adjustedAmount);
const originalAmount = Number(row?.originalAmount ?? row?.originalAmountText);
return Number.isFinite(originalAmount)
? this.fixedTwoDecimals(originalAmount + adjustAmount)
: this.formatCell(row?.afterAmountText);
},
formatCell(value) {
return value === null || value === undefined || value === '' ? '-' : value;
},
@@ -2708,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;
+129 -29
View File
@@ -42,12 +42,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 +120,14 @@
</template>
<script>
import { getLazyList, remove, update, add, getDept, getDeptTree } from '@/api/system/dept';
import {
getLazyList,
remove,
update,
add,
getDept,
getDeptTree,
} from '@/api/system/dept';
import { getLeaderList } from '@/api/system/user';
import { getList as getCustomerArchiveList } from '@/api/vehicle/customer-archive';
import { mapGetters } from 'vuex';
@@ -174,6 +175,7 @@ export default {
searchIndex: 4,
searchMenuPosition: 'right',
tree: true,
rowKey: 'id',
border: true,
index: true,
selection: true,
@@ -183,6 +185,8 @@ export default {
dialogClickModal: false,
labelPosition: 'right',
labelWidth: 'auto',
// Avue /
columnState: false,
column: [
{
label: '组织名称',
@@ -206,22 +210,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 +253,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 +294,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: '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: [
{
label: '拼音助记码',
prop: 'pinyinMnemonic',
minWidth: 140,
order: 50,
required: true,
message: '请选择是否平台公司',
trigger: 'change',
},
],
},
{
label: '排序',
@@ -314,6 +351,7 @@ export default {
slot: true,
addDisplay: false,
editDisplay: false,
viewDisplay: false,
},
{
label: '上级组织',
@@ -372,6 +410,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 +452,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) {
const normalizedId = this.normalizeParentId(parentId);
if (!normalizedId) {
this.parentDeptCode = '';
this.parentDept = null;
if (!parentId || String(parentId) === '0') return;
getDept(parentId).then(res => {
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 +579,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 +597,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);
@@ -660,6 +756,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 +775,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 : [];
}
});
}
+234 -2
View File
@@ -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
@@ -332,6 +340,45 @@
</template>
</el-dialog>
<el-dialog
v-model="oaSyncVisible"
width="480px"
append-to-body
:close-on-click-modal="false"
:close-on-press-escape="!oaSyncRunning"
:show-close="!oaSyncRunning"
class="oa-sync-dialog"
@close="closeOaSyncDialog"
>
<template #header>
<span class="dialog-title">{{ oaSyncDialogTitle }}</span>
</template>
<div class="oa-sync-body">
<el-progress
:percentage="oaSyncPercent"
:status="oaSyncProgressStatus"
:stroke-width="12"
/>
<div class="oa-sync-meta">当前进度 {{ oaSyncProgress.current || 0 }} / {{ oaSyncTotalPage }} </div>
<div class="oa-sync-stats">
<div class="oa-sync-stat">
<span class="oa-sync-stat__label">同步成功</span>
<span class="oa-sync-stat__value oa-sync-stat__value--success">{{ oaSyncProgress.synced }}</span>
</div>
<div class="oa-sync-stat">
<span class="oa-sync-stat__label">跳过</span>
<span class="oa-sync-stat__value oa-sync-stat__value--skip">{{ oaSyncProgress.skipped }}</span>
</div>
</div>
</div>
<template #footer>
<span class="dialog-footer">
<el-button v-if="oaSyncRunning" @click="cancelOaSync">取消</el-button>
<el-button v-else type="primary" @click="closeOaSyncDialog">关闭</el-button>
</span>
</template>
</el-dialog>
<!-- 认证日志组件 -->
<auth-log ref="authLog" />
<!-- 认证锁定配置组件 -->
@@ -348,6 +395,7 @@ import {
remove,
update,
add,
syncIamAccounts,
grant,
resetPassword,
setPassword,
@@ -393,6 +441,19 @@ export default {
selectionList: [],
query: {},
loading: true,
iamSyncLoading: false,
oaSyncVisible: false,
oaSyncRunning: false,
oaSyncCancelled: false,
oaSyncStatus: 'running',
oaSyncController: null,
oaSyncProgress: {
current: 0,
size: 50,
total: 0,
synced: 0,
skipped: 0,
},
page: {
pageSize: 10,
currentPage: 1,
@@ -443,6 +504,46 @@ export default {
},
computed: {
...mapGetters(['userInfo', 'permission']),
oaSyncDialogTitle() {
if (this.oaSyncStatus === 'done') {
return '同步完成';
}
if (this.oaSyncStatus === 'cancelled') {
return '已取消同步';
}
if (this.oaSyncStatus === 'error') {
return '同步失败';
}
return '同步人员';
},
oaSyncTotalPage() {
const total = Number(this.oaSyncProgress.total) || 0;
const size = Number(this.oaSyncProgress.size) || 50;
if (total <= 0) {
return this.oaSyncProgress.current || 0;
}
return Math.max(1, Math.ceil(total / size));
},
oaSyncPercent() {
if (this.oaSyncStatus === 'done') {
return 100;
}
const totalPage = this.oaSyncTotalPage;
const current = Number(this.oaSyncProgress.current) || 0;
if (totalPage <= 0) {
return 0;
}
return Math.min(100, Math.round((current / totalPage) * 100));
},
oaSyncProgressStatus() {
if (this.oaSyncStatus === 'done') {
return 'success';
}
if (this.oaSyncStatus === 'error') {
return 'exception';
}
return undefined;
},
// checkStrictly false
deptCascaderProps() {
return {
@@ -553,6 +654,89 @@ export default {
this.handleExport();
}
},
handleIamSync() {
this.$confirm('确定从OA同步人员及组织信息?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(() => {
this.startOaSync();
});
},
startOaSync() {
this.iamSyncLoading = true;
this.oaSyncVisible = true;
this.oaSyncRunning = true;
this.oaSyncCancelled = false;
this.oaSyncStatus = 'running';
this.oaSyncController = new AbortController();
this.oaSyncProgress = {
current: 0,
size: 50,
total: 0,
synced: 0,
skipped: 0,
};
this.runOaSyncPages();
},
isOaSyncCanceledError(error) {
return (
this.oaSyncCancelled ||
error?.code === 'ERR_CANCELED' ||
error?.name === 'CanceledError' ||
error?.name === 'AbortError'
);
},
async runOaSyncPages() {
const size = 50;
let current = 1;
try {
while (!this.oaSyncCancelled) {
const res = await syncIamAccounts(current, size, this.oaSyncController?.signal);
const page = res?.data?.data || {};
this.oaSyncProgress.current = page.current || current;
this.oaSyncProgress.size = page.size || size;
this.oaSyncProgress.total = page.total || 0;
this.oaSyncProgress.synced += page.syncedCount || 0;
this.oaSyncProgress.skipped += page.skippedCount || 0;
if (page.finished) {
this.oaSyncStatus = 'done';
break;
}
current += 1;
}
if (this.oaSyncCancelled && this.oaSyncStatus === 'running') {
this.oaSyncStatus = 'cancelled';
}
} catch (error) {
if (this.isOaSyncCanceledError(error)) {
this.oaSyncStatus = 'cancelled';
} else {
this.oaSyncStatus = 'error';
this.$message.error(error?.message || 'OA人员同步失败');
}
} finally {
this.oaSyncRunning = false;
this.iamSyncLoading = false;
if (this.oaSyncStatus === 'done' || this.oaSyncStatus === 'cancelled') {
this.onLoad(this.page, this.query);
}
}
},
cancelOaSync() {
if (!this.oaSyncRunning) {
return;
}
this.oaSyncCancelled = true;
this.oaSyncController?.abort();
},
closeOaSyncDialog() {
if (this.oaSyncRunning) {
this.cancelOaSync();
return;
}
this.oaSyncVisible = false;
},
handleSetLeader(row) {
const tip = row.isLeader === 1 ? '确定取消用户的主管职务?' : '确定设置用户为主管职务?';
const message = row.isLeader === 1 ? '取消主管成功!' : '设置主管成功!';
@@ -1121,14 +1305,16 @@ export default {
margin-top: 8px;
}
.user-edit-dialog .dialog-title {
.user-edit-dialog .dialog-title,
.oa-sync-dialog .dialog-title {
display: inline-flex;
align-items: center;
font-size: 16px;
font-weight: 600;
}
.user-edit-dialog .dialog-title::before {
.user-edit-dialog .dialog-title::before,
.oa-sync-dialog .dialog-title::before {
width: 4px;
height: 18px;
margin-right: 8px;
@@ -1136,6 +1322,52 @@ export default {
content: '';
}
.oa-sync-body {
padding: 8px 4px 0;
}
.oa-sync-meta {
margin-top: 12px;
color: #606266;
font-size: 13px;
}
.oa-sync-stats {
display: flex;
gap: 16px;
margin-top: 16px;
}
.oa-sync-stat {
flex: 1;
padding: 12px 16px;
background: #fafafa;
border: 1px solid #eff1f7;
border-radius: 4px;
}
.oa-sync-stat__label {
display: block;
color: #909399;
font-size: 12px;
}
.oa-sync-stat__value {
display: block;
margin-top: 6px;
font-size: 22px;
font-weight: 600;
line-height: 1.2;
}
.oa-sync-stat__value--success {
color: #409eff;
}
.oa-sync-stat__value--skip {
color: #909399;
}
.user-edit-dialog .el-form-item {
margin-bottom: 14px;
}
+170 -47
View File
@@ -120,48 +120,59 @@
:model="driverForm"
:rules="formRules"
label-position="right"
label-width="calc(4em + 24px)"
:disabled="readonly"
class="driver-form archive-form"
>
<section-card title="基础身份信息">
<el-row :gutter="18">
<el-col :span="8">
<el-col :span="6">
<el-form-item label="司机姓名" prop="driverName">
<el-input v-model="driverForm.driverName" maxlength="10" show-word-limit />
<el-input
v-model="driverForm.driverName"
maxlength="10"
show-word-limit
placeholder="请输入"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-col :span="6">
<el-form-item label="身份证号" prop="idCardNo">
<el-input
v-model="driverForm.idCardNo"
maxlength="18"
show-word-limit
@input="driverForm.idCardNo = String(driverForm.idCardNo || '').toUpperCase()"
placeholder="请输入"
@input="handleIdCardInput"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-col :span="6">
<el-form-item label="出生年月" prop="birthday">
<el-date-picker
v-model="driverForm.birthday"
type="date"
value-format="YYYY-MM-DD"
placeholder="请选择"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="18">
<el-col :span="8">
<el-col :span="6">
<el-form-item label="性别" prop="gender">
<el-select v-model="driverForm.gender" clearable>
<el-select
v-model="driverForm.gender"
clearable
placeholder="请选择"
:validate-event="submitAttempted"
>
<el-option label="男" value="男" />
<el-option label="女" value="女" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-col :span="6">
<el-form-item label="民族" prop="nation">
<el-select v-model="driverForm.nation" clearable filterable>
<el-select v-model="driverForm.nation" clearable filterable placeholder="请选择">
<el-option
v-for="item in nationOptions"
:key="item"
@@ -171,9 +182,14 @@
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-col :span="6">
<el-form-item label="学历" prop="education">
<el-select v-model="driverForm.education" clearable filterable>
<el-select
v-model="driverForm.education"
clearable
filterable
placeholder="请选择"
>
<el-option
v-for="item in educationOptions"
:key="item"
@@ -183,36 +199,43 @@
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="18">
<el-col :span="8">
<el-col :span="6">
<el-form-item label="住址" prop="addressRegion">
<el-cascader
ref="addressRegionCascader"
v-model="driverForm.addressRegionPath"
:options="regionOptions"
:props="regionCascaderProps"
:placeholder="driverForm.addressRegion || '请选择省市区'"
:placeholder="driverForm.addressRegion || '请选择'"
clearable
filterable
@change="handleAddressRegionChange"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-col :span="6">
<el-form-item label="详细地址" prop="address">
<el-input v-model="driverForm.address" maxlength="200" show-word-limit />
<el-input
v-model="driverForm.address"
maxlength="200"
show-word-limit
placeholder="请输入"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="18">
<el-col :span="8">
<el-col :span="6">
<el-form-item label="驾驶车辆" prop="drivingVehicle">
<el-input
v-model="driverForm.drivingVehicle"
maxlength="30"
clearable
placeholder="请输入或选择车辆"
readonly
placeholder="请选择车辆"
:disabled="readonly"
@clear="driverForm.drivingVehicle = ''"
@click="!readonly && openVehicleSelector()"
>
<template #append>
<el-tooltip content="选择车辆" placement="top">
@@ -238,7 +261,7 @@
</el-col>
</el-row>
<el-row :gutter="18">
<el-col :span="8">
<el-col :span="6">
<image-upload-field
label="身份证正面照"
prop="idCardFront"
@@ -249,7 +272,7 @@
@success="url => handleIdCardUploadSuccess('idCardFront', url)"
/>
</el-col>
<el-col :span="8">
<el-col :span="6">
<image-upload-field
label="身份证反面照"
prop="idCardBack"
@@ -260,7 +283,7 @@
@success="url => handleIdCardUploadSuccess('idCardBack', url)"
/>
</el-col>
<el-col :span="8">
<el-col :span="6">
<image-upload-field
label="大头照"
prop="headPhoto"
@@ -284,6 +307,8 @@
filterable
allow-create
default-first-option
placeholder="请选择"
:validate-event="submitAttempted"
>
<el-option
v-for="item in drivingTypeOptions"
@@ -296,7 +321,11 @@
</el-col>
<el-col :span="6">
<el-form-item label="档案编号" prop="drivingLicenseNo">
<el-input v-model="driverForm.drivingLicenseNo" maxlength="50" />
<el-input
v-model="driverForm.drivingLicenseNo"
maxlength="50"
placeholder="请输入"
/>
</el-form-item>
</el-col>
<el-col :span="6">
@@ -307,6 +336,7 @@
type="date"
value-format="YYYY-MM-DD"
placeholder="起"
:disabled="driverForm.drivingLicenseLongTerm === 1"
@change="validateFormField('drivingLicenseEndDate')"
/>
<el-date-picker
@@ -334,7 +364,7 @@
</el-col>
</el-row>
<el-row :gutter="18">
<el-col :span="12">
<el-col :span="6">
<image-upload-field
label="驾驶证主页"
prop="drivingLicenseFront"
@@ -347,7 +377,7 @@
"
/>
</el-col>
<el-col :span="12">
<el-col :span="6">
<image-upload-field
label="驾驶证副页"
prop="drivingLicenseBack"
@@ -371,6 +401,8 @@
v-model="driverForm.qualificationType"
clearable
filterable
placeholder="请选择"
:validate-event="submitAttempted"
>
<el-option
v-for="item in qualificationTypeOptions"
@@ -392,13 +424,24 @@
</el-col>
<el-col :span="6">
<el-form-item label="有效期" prop="qualificationEndDate">
<div class="date-range">
<el-date-picker
v-model="driverForm.qualificationStartDate"
type="date"
value-format="YYYY-MM-DD"
placeholder="起"
:disabled="driverForm.qualificationLongTerm === 1"
@change="validateFormField('qualificationEndDate')"
/>
<el-date-picker
v-model="driverForm.qualificationEndDate"
type="date"
value-format="YYYY-MM-DD"
placeholder="止"
:disabled="driverForm.qualificationLongTerm === 1"
@change="validateFormField('qualificationEndDate')"
/>
</div>
</el-form-item>
</el-col>
<el-col :span="6">
@@ -415,7 +458,7 @@
</el-col>
</el-row>
<el-row :gutter="18">
<el-col :span="12">
<el-col :span="6">
<image-upload-field
label="封面页"
prop="qualificationFront"
@@ -426,7 +469,7 @@
@success="url => handleQualificationUploadSuccess('qualificationFront', url)"
/>
</el-col>
<el-col :span="12">
<el-col :span="6">
<image-upload-field
label="内容页"
prop="qualificationBack"
@@ -444,7 +487,7 @@
<el-row :gutter="18">
<el-col :span="6">
<el-form-item label="司机类型" prop="driverType">
<el-select v-model="driverForm.driverType" filterable>
<el-select v-model="driverForm.driverType" filterable placeholder="请选择">
<el-option label="自有" value="自有" />
<el-option label="外协" value="外协" />
<el-option label="承运管理员" value="承运管理员" />
@@ -453,7 +496,11 @@
</el-col>
<el-col :span="6">
<el-form-item label="手机号" prop="mobile">
<el-input v-model="driverForm.mobile" maxlength="20" />
<el-input
v-model="driverForm.mobile"
maxlength="20"
placeholder="请输入"
/>
</el-form-item>
</el-col>
<el-col :span="6">
@@ -461,13 +508,18 @@
<el-input
v-model="driverForm.emergencyContactName"
maxlength="20"
placeholder="请输入"
@input="driverForm.emergencyContactName = removeDigits($event)"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="紧急联系人手机号" prop="emergencyContactMobile">
<el-input v-model="driverForm.emergencyContactMobile" maxlength="20" />
<el-input
v-model="driverForm.emergencyContactMobile"
maxlength="20"
placeholder="请输入"
/>
</el-form-item>
</el-col>
<el-col :span="6">
@@ -478,6 +530,7 @@
filterable
allow-create
default-first-option
placeholder="请选择"
>
<el-option
v-for="item in relationOptions"
@@ -496,7 +549,7 @@
:props="organizationCascaderProps"
filterable
clearable
placeholder="请选择 所属组织"
placeholder="请选择"
/>
</el-form-item>
</el-col>
@@ -541,8 +594,8 @@
<template #organizationName="{ row }">
{{ String(row.organizationName || '').replace(/^[\s\u3000]+/, '') }}
</template>
<template #boundDriver>
<span>-</span>
<template #boundDriver="{ row }">
<span>{{ row.boundDriver || '-' }}</span>
</template>
<template #certificationStatus="{ row }">
<el-tag :type="getVehicleCertificationStatus(row).type" class="status-text">
@@ -645,6 +698,7 @@ const emptyForm = () => ({
drivingLicenseBack: '',
qualificationType: '',
qualificationNo: '',
qualificationStartDate: '',
qualificationEndDate: '',
qualificationLongTerm: 0,
qualificationFront: '',
@@ -700,6 +754,7 @@ export default {
total: 0,
},
readonly: false,
submitAttempted: false,
driverForm: emptyForm(),
drivingLicenseUploads: {},
uploadHeaders: getUploadHeaders(),
@@ -783,18 +838,14 @@ export default {
drivingType: [{ required: true, message: '请选择准驾车型', trigger: 'change' }],
drivingLicenseNo: [{ required: true, message: '请输入档案编号', trigger: 'blur' }],
drivingLicenseEndDate: [
{ validator: this.validateDrivingLicenseEndDate, trigger: 'change' },
],
drivingLicenseLongTerm: [
{ required: true, message: '请选择驾驶证是否长期有效', trigger: 'change' },
{ required: true, validator: this.validateDrivingLicenseEndDate, trigger: 'change' },
],
qualificationType: [
{ required: true, message: '请选择从业资格认证类型', trigger: 'change' },
],
qualificationNo: [{ required: true, message: '请输入资格证号', trigger: 'blur' }],
qualificationEndDate: [{ validator: this.validateQualificationEndDate, trigger: 'change' }],
qualificationLongTerm: [
{ required: true, message: '请选择从业资格证是否长期有效', trigger: 'change' },
qualificationEndDate: [
{ required: true, validator: this.validateQualificationEndDate, trigger: 'change' },
],
driverType: [{ required: true, message: '请选择司机类型', trigger: 'change' }],
mobile: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
@@ -1029,19 +1080,33 @@ export default {
}
},
validateDrivingLicenseEndDate(rule, value, callback) {
//
if (this.driverForm.drivingLicenseLongTerm === 1) {
callback();
return;
}
if (!this.driverForm.drivingLicenseStartDate) {
callback(new Error('请选择驾驶证有效期起'));
return;
}
if (this.driverForm.drivingLicenseLongTerm !== 1 && !value) {
if (!value) {
callback(new Error('请选择驾驶证有效期止'));
return;
}
callback();
},
validateQualificationEndDate(rule, value, callback) {
if (this.driverForm.qualificationLongTerm !== 1 && !value) {
callback(new Error('请选择从业资格证有效期'));
//
if (this.driverForm.qualificationLongTerm === 1) {
callback();
return;
}
if (!this.driverForm.qualificationStartDate) {
callback(new Error('请选择从业资格证有效期起'));
return;
}
if (!value) {
callback(new Error('请选择从业资格证有效期止'));
return;
}
callback();
@@ -1056,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();
@@ -1082,6 +1168,7 @@ export default {
this.driverForm = emptyForm();
this.drivingLicenseUploads = {};
this.readonly = false;
this.submitAttempted = false;
this.submitLoading = false;
this.$refs.driverForm?.clearValidate();
},
@@ -1544,6 +1631,7 @@ export default {
this.$refs.driverForm?.validateField(prop);
},
handleSubmit() {
this.submitAttempted = true;
this.$refs.driverForm.validate(valid => {
if (!valid) {
return;
@@ -1553,6 +1641,7 @@ export default {
birthday: this.normalizeBirthday(this.driverForm.birthday),
drivingLicenseStartDate: this.normalizeBirthday(this.driverForm.drivingLicenseStartDate),
drivingLicenseEndDate: this.normalizeBirthday(this.driverForm.drivingLicenseEndDate),
qualificationStartDate: this.normalizeBirthday(this.driverForm.qualificationStartDate),
qualificationEndDate: this.normalizeBirthday(this.driverForm.qualificationEndDate),
qualificationNo: this.driverForm.qualificationNo || this.driverForm.idCardNo,
posts: this.driverForm.postList.join(','),
@@ -1740,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),
@@ -1752,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;
}
}
@@ -1772,10 +1892,13 @@ export default {
overflow: hidden;
}
// 1.586:1 100%
// 240px 1.586:1
// /
:deep(.driver-uploader--large) {
display: block;
width: 240px;
width: 100%;
max-width: 240px;
flex: none;
margin: 0;
}
+5 -1
View File
@@ -1349,9 +1349,13 @@ export default {
height: 151px;
}
// 248px
// /
:deep(.ship-uploader--large) {
display: block;
width: 248px;
width: 100%;
max-width: 248px;
flex: none;
margin: 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>
File diff suppressed because it is too large Load Diff
+69 -19
View File
@@ -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;
+193 -26
View File
@@ -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
+48 -1
View File
@@ -21,6 +21,15 @@
@on-load="onLoad"
>
<template #menu-left>
<el-button
v-if="hasPermission('equipment_ledger_delete')"
type="danger"
icon="el-icon-delete"
plain
@click="handleDelete"
>
批量删除
</el-button>
<el-button
v-if="hasPermission('equipment_ledger_import')"
type="primary"
@@ -79,6 +88,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 +197,7 @@ export default {
};
},
vehicleNoPlaceholder() {
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
return this.form.vehicleType === '船舶' ? '请选择船号' : '请选择车牌号';
},
ids() {
return this.selectionList.map(item => item.id).join(',');
@@ -289,6 +319,23 @@ export default {
this.$message.success('操作成功');
});
},
handleDelete() {
if (this.selectionList.length === 0) {
this.$message.warning('请选择至少一条数据');
return;
}
this.$confirm('确认删除选中的数据?删除后将不可恢复!', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => remove(this.ids))
.then(() => {
this.onLoad(this.page);
this.$message.success('操作成功');
this.$refs.crud.toggleSelection();
});
},
beforeOpen(done, type) {
this.boxType = type;
if (type === 'add') {

Some files were not shown because too many files have changed in this diff Show More