Files
ONE-OS/web端/运维管理/车辆业务/替换车管理.jsx
王冕 e70342e8fe web端:财务管理提车应收款-收款、车辆租赁合同与替换车管理改动同步
- 财务管理:新增提车应收款-收款.jsx,移除旧提车应收款/收费明细/首付款页面;项目信息与开票信息改为直接展示
- 车辆租赁合同:列表租赁车辆数/已交车辆数及气泡列调整;续签/转正式合同去除合同编码,交车区域·交车地点·合同原件布局调整
- 运维-车辆业务:新增替换车管理、替换车管理-新增/查看/编辑

Made-with: Cursor
2026-03-04 20:38:06 +08:00

494 lines
42 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
// 【重要】必须使用 const Component 作为组件变量名
// 运维管理 - 车辆业务 - 替换车管理2026年3月3日版本
const Component = function () {
var useState = React.useState;
var useCallback = React.useCallback;
var useMemo = React.useMemo;
var antd = window.antd;
var Breadcrumb = antd.Breadcrumb;
var Card = antd.Card;
var DatePicker = antd.DatePicker;
var Select = antd.Select;
var Button = antd.Button;
var Table = antd.Table;
var Tabs = antd.Tabs;
var Modal = antd.Modal;
var Input = antd.Input;
var message = antd.message;
var RangePicker = DatePicker.RangePicker;
// 筛选展开(默认一行 3 列)
var _filterExpanded = useState(false);
var _replaceDateRange = useState(null);
var _replaceType = useState(undefined);
var _projectName = useState(undefined);
var _approvalStatus = useState(['全部']);
var _originalPlate = useState(undefined);
var _replacePlate = useState(undefined);
var _replaceReason = useState(undefined);
var _creator = useState(undefined);
var _createTimeRange = useState(null);
var _appliedFilter = useState({
replaceDateRange: null,
replaceType: undefined,
projectName: undefined,
approvalStatus: ['全部'],
originalPlate: undefined,
replacePlate: undefined,
replaceReason: undefined,
creator: undefined,
createTimeRange: null
});
var _activeTab = useState('ongoing');
var _selectedRowKeys = useState([]);
var _withdrawModalVisible = useState(false);
var _withdrawModalRecord = useState(null);
var _toPermanentModalVisible = useState(false);
var _toPermanentModalRecord = useState(null);
var _requirementModalVisible = useState(false);
var replaceTypeOptions = [
{ value: '永久替换', label: '永久替换' },
{ value: '临时替换', label: '临时替换' }
];
var projectNameOptions = [
{ value: 'p1', label: '嘉兴氢能示范项目' },
{ value: 'p2', label: '上海物流租赁项目' },
{ value: 'p3', label: '杭州城配租赁项目' }
];
var approvalStatusOptions = [
{ value: '全部', label: '全部' },
{ value: '待审批', label: '待审批' },
{ value: '审批中', label: '审批中' },
{ value: '审批驳回', label: '审批驳回' },
{ value: '未提交', label: '未提交' },
{ value: '撤回', label: '撤回' }
];
var plateOptions = [
{ value: '浙A12345', label: '浙A12345' },
{ value: '浙A67890', label: '浙A67890' },
{ value: '浙B11111', label: '浙B11111' },
{ value: '浙B22222', label: '浙B22222' },
{ value: '浙C33333', label: '浙C33333' }
];
var replaceReasonOptions = [
{ value: '全部', label: '全部' },
{ value: '客户原因', label: '客户原因' },
{ value: '车辆原因', label: '车辆原因' }
];
var creatorOptions = [
{ value: '张三', label: '张三' },
{ value: '李四', label: '李四' },
{ value: '王五', label: '王五' },
{ value: '赵六', label: '赵六' }
];
// 进行中:未结束、暂存,审批状态为 待审批、审批中、审批驳回、未提交、撤回
var ongoingList = [
{ id: 'o1', replaceDate: '2025-03-05', replaceType: '临时替换', projectName: '嘉兴氢能示范项目', approvalStatus: '待审批', originalPlate: '浙A12345', originalBrand: '东风', originalModel: 'DFH1180', replacePlate: '浙A67890', replaceBrand: '福田', replaceModel: 'BJ1180', replaceReason: '车辆原因', replaceReasonDesc: '原车维修', creator: '张三', createTime: '2025-03-01 10:00' },
{ id: 'o2', replaceDate: '2025-03-06', replaceType: '永久替换', projectName: '上海物流租赁项目', approvalStatus: '审批中', originalPlate: '浙B11111', originalBrand: '江淮', originalModel: 'HFC1180', replacePlate: '浙B22222', replaceBrand: '重汽', replaceModel: 'ZZ1180', replaceReason: '客户原因', replaceReasonDesc: '客户要求换型', creator: '李四', createTime: '2025-03-01 14:30' },
{ id: 'o3', replaceDate: '2025-03-07', replaceType: '临时替换', projectName: '杭州城配租赁项目', approvalStatus: '审批驳回', originalPlate: '浙C33333', originalBrand: '东风', originalModel: 'DFH1190', replacePlate: '浙C44444', replaceBrand: '福田', replaceModel: 'BJ1190', replaceReason: '车辆原因', replaceReasonDesc: '事故替换', creator: '王五', createTime: '2025-03-02 09:15' },
{ id: 'o4', replaceDate: '2025-03-08', replaceType: '永久替换', projectName: '嘉兴氢能示范项目', approvalStatus: '未提交', originalPlate: '浙A55555', originalBrand: '重汽', originalModel: 'ZZ1160', replacePlate: '浙A66666', replaceBrand: '江淮', replaceModel: 'HFC1190', replaceReason: '车辆原因', replaceReasonDesc: '保养替换', creator: '赵六', createTime: '2025-03-02 16:00' },
{ id: 'o5', replaceDate: '2025-03-09', replaceType: '临时替换', projectName: '上海物流租赁项目', approvalStatus: '撤回', originalPlate: '浙F77777', originalBrand: '福田', originalModel: 'BJ1180', replacePlate: '浙F88888', replaceBrand: '东风', replaceModel: 'DFH1180', replaceReason: '客户原因', replaceReasonDesc: '年检替换', creator: '张三', createTime: '2025-03-03 11:20' },
{ id: 'o6', replaceDate: '2025-03-10', replaceType: '永久替换', projectName: '杭州城配租赁项目', approvalStatus: '待审批', originalPlate: '浙A11201', originalBrand: '江淮', originalModel: 'HFC1160', replacePlate: '浙A11202', replaceBrand: '东风', replaceModel: 'DFH1160', replaceReason: '车辆原因', replaceReasonDesc: '发动机故障', creator: '李四', createTime: '2025-03-04 08:45' },
{ id: 'o7', replaceDate: '2025-03-11', replaceType: '临时替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批中', originalPlate: '浙B22301', originalBrand: '重汽', originalModel: 'ZZ1160', replacePlate: '浙B22302', replaceBrand: '福田', replaceModel: 'BJ1160', replaceReason: '客户原因', replaceReasonDesc: '临时增运力', creator: '王五', createTime: '2025-03-04 13:00' },
{ id: 'o8', replaceDate: '2025-03-12', replaceType: '永久替换', projectName: '上海物流租赁项目', approvalStatus: '审批驳回', originalPlate: '浙C33401', originalBrand: '东风', originalModel: 'DFH1190', replacePlate: '浙C33402', replaceBrand: '江淮', replaceModel: 'HFC1190', replaceReason: '车辆原因', replaceReasonDesc: '底盘大修', creator: '赵六', createTime: '2025-03-05 10:20' },
{ id: 'o9', replaceDate: '2025-03-13', replaceType: '临时替换', projectName: '杭州城配租赁项目', approvalStatus: '未提交', originalPlate: '浙D44501', originalBrand: '福田', originalModel: 'BJ1180', replacePlate: '浙D44502', replaceBrand: '重汽', replaceModel: 'ZZ1180', replaceReason: '客户原因', replaceReasonDesc: '线路调整', creator: '张三', createTime: '2025-03-05 15:30' },
{ id: 'o10', replaceDate: '2025-03-14', replaceType: '永久替换', projectName: '嘉兴氢能示范项目', approvalStatus: '撤回', originalPlate: '浙E55601', originalBrand: '江淮', originalModel: 'HFC1180', replacePlate: '浙E55602', replaceBrand: '东风', replaceModel: 'DFH1180', replaceReason: '车辆原因', replaceReasonDesc: '轮胎更换', creator: '李四', createTime: '2025-03-06 09:00' },
{ id: 'o11', replaceDate: '2025-03-15', replaceType: '临时替换', projectName: '上海物流租赁项目', approvalStatus: '待审批', originalPlate: '浙F66701', originalBrand: '重汽', originalModel: 'ZZ1190', replacePlate: '浙F66702', replaceBrand: '福田', replaceModel: 'BJ1190', replaceReason: '车辆原因', replaceReasonDesc: '电瓶更换', creator: '王五', createTime: '2025-03-06 14:15' },
{ id: 'o12', replaceDate: '2025-03-16', replaceType: '永久替换', projectName: '杭州城配租赁项目', approvalStatus: '审批中', originalPlate: '浙A77801', originalBrand: '东风', originalModel: 'DFH1160', replacePlate: '浙A77802', replaceBrand: '江淮', replaceModel: 'HFC1160', replaceReason: '客户原因', replaceReasonDesc: '合同到期换车', creator: '赵六', createTime: '2025-03-07 11:00' },
{ id: 'o13', replaceDate: '2025-03-17', replaceType: '临时替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批驳回', originalPlate: '浙B88901', originalBrand: '福田', originalModel: 'BJ1160', replacePlate: '浙B88902', replaceBrand: '重汽', replaceModel: 'ZZ1160', replaceReason: '车辆原因', replaceReasonDesc: '制动系统检修', creator: '张三', createTime: '2025-03-07 16:45' },
{ id: 'o14', replaceDate: '2025-03-18', replaceType: '永久替换', projectName: '上海物流租赁项目', approvalStatus: '未提交', originalPlate: '浙C99001', originalBrand: '江淮', originalModel: 'HFC1190', replacePlate: '浙C99002', replaceBrand: '东风', replaceModel: 'DFH1190', replaceReason: '客户原因', replaceReasonDesc: '运量增加', creator: '李四', createTime: '2025-03-08 08:30' },
{ id: 'o15', replaceDate: '2025-03-19', replaceType: '临时替换', projectName: '杭州城配租赁项目', approvalStatus: '撤回', originalPlate: '浙D10101', originalBrand: '重汽', originalModel: 'ZZ1180', replacePlate: '浙D10102', replaceBrand: '福田', replaceModel: 'BJ1180', replaceReason: '车辆原因', replaceReasonDesc: '空调维修', creator: '王五', createTime: '2025-03-08 12:00' },
{ id: 'o16', replaceDate: '2025-03-20', replaceType: '永久替换', projectName: '嘉兴氢能示范项目', approvalStatus: '待审批', originalPlate: '浙E20201', originalBrand: '东风', originalModel: 'DFH1180', replacePlate: '浙E20202', replaceBrand: '江淮', replaceModel: 'HFC1180', replaceReason: '车辆原因', replaceReasonDesc: '变速箱故障', creator: '赵六', createTime: '2025-03-09 10:20' },
{ id: 'o17', replaceDate: '2025-03-21', replaceType: '临时替换', projectName: '上海物流租赁项目', approvalStatus: '审批中', originalPlate: '浙F30301', originalBrand: '福田', originalModel: 'BJ1190', replacePlate: '浙F30302', replaceBrand: '重汽', replaceModel: 'ZZ1190', replaceReason: '客户原因', replaceReasonDesc: '区域调配', creator: '张三', createTime: '2025-03-09 15:00' },
{ id: 'o18', replaceDate: '2025-03-22', replaceType: '永久替换', projectName: '杭州城配租赁项目', approvalStatus: '审批驳回', originalPlate: '浙A40401', originalBrand: '江淮', originalModel: 'HFC1160', replacePlate: '浙A40402', replaceBrand: '东风', replaceModel: 'DFH1160', replaceReason: '车辆原因', replaceReasonDesc: '车身锈蚀', creator: '李四', createTime: '2025-03-10 09:45' },
{ id: 'o19', replaceDate: '2025-03-23', replaceType: '临时替换', projectName: '嘉兴氢能示范项目', approvalStatus: '未提交', originalPlate: '浙B50501', originalBrand: '重汽', originalModel: 'ZZ1160', replacePlate: '浙B50502', replaceBrand: '福田', replaceModel: 'BJ1160', replaceReason: '客户原因', replaceReasonDesc: '试运行换车', creator: '王五', createTime: '2025-03-10 14:30' },
{ id: 'o20', replaceDate: '2025-03-24', replaceType: '永久替换', projectName: '上海物流租赁项目', approvalStatus: '撤回', originalPlate: '浙C60601', originalBrand: '东风', originalModel: 'DFH1190', replacePlate: '浙C60602', replaceBrand: '江淮', replaceModel: 'HFC1190', replaceReason: '车辆原因', replaceReasonDesc: '排放升级', creator: '赵六', createTime: '2025-03-11 11:15' }
];
// 历史记录:审批完成,审批状态均为审批完成
var historyList = [
{ id: 'h1', replaceDate: '2025-02-15', replaceType: '永久替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批完成', originalPlate: '浙A10001', originalBrand: '东风', originalModel: 'DFH1180', replacePlate: '浙A10002', replaceBrand: '福田', replaceModel: 'BJ1180', replaceReason: '车辆原因', replaceReasonDesc: '原车报废', creator: '张三', createTime: '2025-02-10 09:00' },
{ id: 'h2', replaceDate: '2025-02-14', replaceType: '临时替换', projectName: '上海物流租赁项目', approvalStatus: '审批完成', originalPlate: '浙B20001', originalBrand: '江淮', originalModel: 'HFC1180', replacePlate: '浙B20002', replaceBrand: '重汽', replaceModel: 'ZZ1180', replaceReason: '客户原因', replaceReasonDesc: '客户临时需求', creator: '李四', createTime: '2025-02-09 14:00' },
{ id: 'h3', replaceDate: '2025-02-13', replaceType: '永久替换', projectName: '杭州城配租赁项目', approvalStatus: '审批完成', originalPlate: '浙C30001', originalBrand: '重汽', originalModel: 'ZZ1160', replacePlate: '浙C30002', replaceBrand: '东风', replaceModel: 'DFH1160', replaceReason: '车辆原因', replaceReasonDesc: '使用年限到期', creator: '王五', createTime: '2025-02-08 10:30' },
{ id: 'h4', replaceDate: '2025-02-12', replaceType: '临时替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批完成', originalPlate: '浙A40001', originalBrand: '福田', originalModel: 'BJ1180', replacePlate: '浙A40002', replaceBrand: '江淮', replaceModel: 'HFC1180', replaceReason: '客户原因', replaceReasonDesc: '旺季加车', creator: '赵六', createTime: '2025-02-07 15:20' },
{ id: 'h5', replaceDate: '2025-02-11', replaceType: '永久替换', projectName: '上海物流租赁项目', approvalStatus: '审批完成', originalPlate: '浙B50001', originalBrand: '东风', originalModel: 'DFH1190', replacePlate: '浙B50002', replaceBrand: '重汽', replaceModel: 'ZZ1190', replaceReason: '车辆原因', replaceReasonDesc: '事故车置换', creator: '张三', createTime: '2025-02-06 08:45' },
{ id: 'h6', replaceDate: '2025-02-10', replaceType: '临时替换', projectName: '杭州城配租赁项目', approvalStatus: '审批完成', originalPlate: '浙C60001', originalBrand: '江淮', originalModel: 'HFC1160', replacePlate: '浙C60002', replaceBrand: '福田', replaceModel: 'BJ1160', replaceReason: '客户原因', replaceReasonDesc: '临时项目', creator: '李四', createTime: '2025-02-05 11:00' },
{ id: 'h7', replaceDate: '2025-02-09', replaceType: '永久替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批完成', originalPlate: '浙A70001', originalBrand: '重汽', originalModel: 'ZZ1180', replacePlate: '浙A70002', replaceBrand: '东风', replaceModel: 'DFH1180', replaceReason: '车辆原因', replaceReasonDesc: '维修成本过高', creator: '王五', createTime: '2025-02-04 14:15' },
{ id: 'h8', replaceDate: '2025-02-08', replaceType: '临时替换', projectName: '上海物流租赁项目', approvalStatus: '审批完成', originalPlate: '浙B80001', originalBrand: '福田', originalModel: 'BJ1190', replacePlate: '浙B80002', replaceBrand: '江淮', replaceModel: 'HFC1190', replaceReason: '客户原因', replaceReasonDesc: '车型升级', creator: '赵六', createTime: '2025-02-03 09:30' },
{ id: 'h9', replaceDate: '2025-02-07', replaceType: '永久替换', projectName: '杭州城配租赁项目', approvalStatus: '审批完成', originalPlate: '浙C90001', originalBrand: '东风', originalModel: 'DFH1160', replacePlate: '浙C90002', replaceBrand: '重汽', replaceModel: 'ZZ1160', replaceReason: '车辆原因', replaceReasonDesc: '年检未过', creator: '张三', createTime: '2025-02-02 16:00' },
{ id: 'h10', replaceDate: '2025-02-06', replaceType: '临时替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批完成', originalPlate: '浙A01001', originalBrand: '江淮', originalModel: 'HFC1180', replacePlate: '浙A01002', replaceBrand: '福田', replaceModel: 'BJ1180', replaceReason: '客户原因', replaceReasonDesc: '运力不足', creator: '李四', createTime: '2025-02-01 10:45' },
{ id: 'h11', replaceDate: '2025-02-05', replaceType: '永久替换', projectName: '上海物流租赁项目', approvalStatus: '审批完成', originalPlate: '浙B02001', originalBrand: '重汽', originalModel: 'ZZ1190', replacePlate: '浙B02002', replaceBrand: '东风', replaceModel: 'DFH1190', replaceReason: '车辆原因', replaceReasonDesc: '尾气不达标', creator: '王五', createTime: '2025-01-31 13:20' },
{ id: 'h12', replaceDate: '2025-02-04', replaceType: '临时替换', projectName: '杭州城配租赁项目', approvalStatus: '审批完成', originalPlate: '浙C03001', originalBrand: '福田', originalModel: 'BJ1160', replacePlate: '浙C03002', replaceBrand: '江淮', replaceModel: 'HFC1160', replaceReason: '客户原因', replaceReasonDesc: '线路拓展', creator: '赵六', createTime: '2025-01-30 08:00' },
{ id: 'h13', replaceDate: '2025-02-03', replaceType: '永久替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批完成', originalPlate: '浙A04001', originalBrand: '东风', originalModel: 'DFH1180', replacePlate: '浙A04002', replaceBrand: '重汽', replaceModel: 'ZZ1180', replaceReason: '车辆原因', replaceReasonDesc: '核心部件损坏', creator: '张三', createTime: '2025-01-29 11:30' },
{ id: 'h14', replaceDate: '2025-02-02', replaceType: '临时替换', projectName: '上海物流租赁项目', approvalStatus: '审批完成', originalPlate: '浙B05001', originalBrand: '江淮', originalModel: 'HFC1190', replacePlate: '浙B05002', replaceBrand: '福田', replaceModel: 'BJ1190', replaceReason: '客户原因', replaceReasonDesc: '季节性需求', creator: '李四', createTime: '2025-01-28 15:45' },
{ id: 'h15', replaceDate: '2025-02-01', replaceType: '永久替换', projectName: '杭州城配租赁项目', approvalStatus: '审批完成', originalPlate: '浙C06001', originalBrand: '重汽', originalModel: 'ZZ1160', replacePlate: '浙C06002', replaceBrand: '东风', replaceModel: 'DFH1160', replaceReason: '车辆原因', replaceReasonDesc: '保险拒保', creator: '王五', createTime: '2025-01-27 09:15' },
{ id: 'h16', replaceDate: '2025-01-31', replaceType: '临时替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批完成', originalPlate: '浙A07001', originalBrand: '福田', originalModel: 'BJ1180', replacePlate: '浙A07002', replaceBrand: '江淮', replaceModel: 'HFC1180', replaceReason: '客户原因', replaceReasonDesc: '合作试运行', creator: '赵六', createTime: '2025-01-26 12:00' },
{ id: 'h17', replaceDate: '2025-01-30', replaceType: '永久替换', projectName: '上海物流租赁项目', approvalStatus: '审批完成', originalPlate: '浙B08001', originalBrand: '东风', originalModel: 'DFH1190', replacePlate: '浙B08002', replaceBrand: '重汽', replaceModel: 'ZZ1190', replaceReason: '车辆原因', replaceReasonDesc: '油耗过高', creator: '张三', createTime: '2025-01-25 14:30' },
{ id: 'h18', replaceDate: '2025-01-29', replaceType: '临时替换', projectName: '杭州城配租赁项目', approvalStatus: '审批完成', originalPlate: '浙C09001', originalBrand: '江淮', originalModel: 'HFC1160', replacePlate: '浙C09002', replaceBrand: '福田', replaceModel: 'BJ1160', replaceReason: '客户原因', replaceReasonDesc: '活动保障', creator: '李四', createTime: '2025-01-24 10:20' },
{ id: 'h19', replaceDate: '2025-01-28', replaceType: '永久替换', projectName: '嘉兴氢能示范项目', approvalStatus: '审批完成', originalPlate: '浙A10003', originalBrand: '重汽', originalModel: 'ZZ1180', replacePlate: '浙A10004', replaceBrand: '东风', replaceModel: 'DFH1180', replaceReason: '车辆原因', replaceReasonDesc: '配件停产', creator: '王五', createTime: '2025-01-23 16:45' },
{ id: 'h20', replaceDate: '2025-01-27', replaceType: '临时替换', projectName: '上海物流租赁项目', approvalStatus: '审批完成', originalPlate: '浙B11001', originalBrand: '福田', originalModel: 'BJ1190', replacePlate: '浙B11002', replaceBrand: '江淮', replaceModel: 'HFC1190', replaceReason: '客户原因', replaceReasonDesc: '新业务启动', creator: '赵六', createTime: '2025-01-22 08:30' }
];
var appliedFilter = _appliedFilter[0];
var filteredOngoing = useMemo(function () {
var list = ongoingList.filter(function (r) {
if (appliedFilter.replaceDateRange && appliedFilter.replaceDateRange.length === 2) {
var start = appliedFilter.replaceDateRange[0] && appliedFilter.replaceDateRange[0].format ? appliedFilter.replaceDateRange[0].format('YYYY-MM-DD') : '';
var end = appliedFilter.replaceDateRange[1] && appliedFilter.replaceDateRange[1].format ? appliedFilter.replaceDateRange[1].format('YYYY-MM-DD') : '';
if (start && (r.replaceDate || '') < start) return false;
if (end && (r.replaceDate || '') > end) return false;
}
if (appliedFilter.replaceType && r.replaceType !== appliedFilter.replaceType) return false;
if (appliedFilter.projectName && r.projectName !== appliedFilter.projectName) return false;
var approval = appliedFilter.approvalStatus;
if (approval && approval.length > 0 && approval.indexOf('全部') === -1 && approval.indexOf(r.approvalStatus) === -1) return false;
if (appliedFilter.originalPlate && (r.originalPlate || '').indexOf(appliedFilter.originalPlate) === -1) return false;
if (appliedFilter.replacePlate && (r.replacePlate || '').indexOf(appliedFilter.replacePlate) === -1) return false;
if (appliedFilter.replaceReason && appliedFilter.replaceReason !== '全部' && r.replaceReason !== appliedFilter.replaceReason) return false;
if (appliedFilter.creator && r.creator !== appliedFilter.creator) return false;
if (appliedFilter.createTimeRange && appliedFilter.createTimeRange.length === 2) {
var cs = appliedFilter.createTimeRange[0] && appliedFilter.createTimeRange[0].format ? appliedFilter.createTimeRange[0].format('YYYY-MM-DD') : '';
var ce = appliedFilter.createTimeRange[1] && appliedFilter.createTimeRange[1].format ? appliedFilter.createTimeRange[1].format('YYYY-MM-DD') : '';
var ct = (r.createTime || '').slice(0, 10);
if (cs && ct < cs) return false;
if (ce && ct > ce) return false;
}
return true;
});
return list;
}, [appliedFilter]);
var filteredHistory = useMemo(function () {
var list = historyList.filter(function (r) {
if (appliedFilter.replaceDateRange && appliedFilter.replaceDateRange.length === 2) {
var start = appliedFilter.replaceDateRange[0] && appliedFilter.replaceDateRange[0].format ? appliedFilter.replaceDateRange[0].format('YYYY-MM-DD') : '';
var end = appliedFilter.replaceDateRange[1] && appliedFilter.replaceDateRange[1].format ? appliedFilter.replaceDateRange[1].format('YYYY-MM-DD') : '';
if (start && (r.replaceDate || '') < start) return false;
if (end && (r.replaceDate || '') > end) return false;
}
if (appliedFilter.replaceType && r.replaceType !== appliedFilter.replaceType) return false;
if (appliedFilter.projectName && r.projectName !== appliedFilter.projectName) return false;
if (appliedFilter.originalPlate && (r.originalPlate || '').indexOf(appliedFilter.originalPlate) === -1) return false;
if (appliedFilter.replacePlate && (r.replacePlate || '').indexOf(appliedFilter.replacePlate) === -1) return false;
if (appliedFilter.replaceReason && appliedFilter.replaceReason !== '全部' && r.replaceReason !== appliedFilter.replaceReason) return false;
if (appliedFilter.creator && r.creator !== appliedFilter.creator) return false;
if (appliedFilter.createTimeRange && appliedFilter.createTimeRange.length === 2) {
var cs = appliedFilter.createTimeRange[0] && appliedFilter.createTimeRange[0].format ? appliedFilter.createTimeRange[0].format('YYYY-MM-DD') : '';
var ce = appliedFilter.createTimeRange[1] && appliedFilter.createTimeRange[1].format ? appliedFilter.createTimeRange[1].format('YYYY-MM-DD') : '';
var ct = (r.createTime || '').slice(0, 10);
if (cs && ct < cs) return false;
if (ce && ct > ce) return false;
}
return true;
});
return list;
}, [appliedFilter]);
var handleQuery = useCallback(function () {
_appliedFilter[1]({
replaceDateRange: _replaceDateRange[0],
replaceType: _replaceType[0],
projectName: _projectName[0],
approvalStatus: _approvalStatus[0] ? _approvalStatus[0].slice() : ['全部'],
originalPlate: _originalPlate[0],
replacePlate: _replacePlate[0],
replaceReason: _replaceReason[0],
creator: _creator[0],
createTimeRange: _createTimeRange[0]
});
}, []);
var handleReset = useCallback(function () {
_replaceDateRange[1](null);
_replaceType[1](undefined);
_projectName[1](undefined);
_approvalStatus[1](['全部']);
_originalPlate[1](undefined);
_replacePlate[1](undefined);
_replaceReason[1](undefined);
_creator[1](undefined);
_createTimeRange[1](null);
_appliedFilter[1]({
replaceDateRange: null,
replaceType: undefined,
projectName: undefined,
approvalStatus: ['全部'],
originalPlate: undefined,
replacePlate: undefined,
replaceReason: undefined,
creator: undefined,
createTimeRange: null
});
}, []);
var handleApprovalStatusChange = useCallback(function (v) {
if (!v || v.length === 0) { _approvalStatus[1](['全部']); return; }
if (v.indexOf('全部') !== -1 && v.length > 1) {
var prev = _approvalStatus[0] || [];
var hadAllOnly = prev.length === 1 && prev.indexOf('全部') !== -1;
_approvalStatus[1](hadAllOnly ? v.filter(function (x) { return x !== '全部'; }) : ['全部']);
return;
}
_approvalStatus[1](v);
}, []);
var filterLabelStyle = { marginBottom: 6, fontSize: 14, color: 'rgba(0,0,0,0.65)' };
var filterItemStyle = { marginBottom: 12 };
var filterControlStyle = { width: '100%' };
function getOperationButtons(record, isHistory) {
if (isHistory) {
var viewBtn = React.createElement(Button, { key: 'view', type: 'link', size: 'small', onClick: function () { message.info('查看(跳转替换车管理-查看)'); } }, '查看');
var toPermanentBtn = record.replaceType === '临时替换' ? React.createElement(Button, { key: 'toPermanent', type: 'link', size: 'small', onClick: function () { _toPermanentModalRecord[1](record); _toPermanentModalVisible[1](true); } }, '转永久替换') : null;
return React.createElement('div', { style: { display: 'flex', gap: 4, flexWrap: 'wrap' } }, viewBtn, toPermanentBtn);
}
var status = record.approvalStatus;
var items = [];
if (['待审批', '审批中', '审批驳回', '未提交', '撤回'].indexOf(status) !== -1) {
items.push(React.createElement(Button, { key: 'view', type: 'link', size: 'small', onClick: function () { message.info('查看(跳转替换车管理-查看)'); } }, '查看'));
}
if (['未提交', '审批驳回', '撤回'].indexOf(status) !== -1) {
items.push(React.createElement(Button, { key: 'edit', type: 'link', size: 'small', onClick: function () { message.info('编辑(跳转替换车管理-编辑)'); } }, '编辑'));
}
if (status === '审批中') {
items.push(React.createElement(Button, { key: 'withdraw', type: 'link', size: 'small', danger: true, onClick: function () { _withdrawModalRecord[1](record); _withdrawModalVisible[1](true); } }, '撤回'));
}
return React.createElement('div', { style: { display: 'flex', gap: 4, flexWrap: 'wrap' } }, items);
}
var tableColumns = [
{ title: '替换日期', dataIndex: 'replaceDate', key: 'replaceDate', width: 110, fixed: 'left' },
{ title: '替换类型', dataIndex: 'replaceType', key: 'replaceType', width: 100, fixed: 'left' },
{ title: '项目名称', dataIndex: 'projectName', key: 'projectName', width: 140, fixed: 'left' },
{ title: '审批状态', dataIndex: 'approvalStatus', key: 'approvalStatus', width: 100 },
{ title: '被替换车车牌号', dataIndex: 'originalPlate', key: 'originalPlate', width: 120 },
{ title: '被替换车品牌', dataIndex: 'originalBrand', key: 'originalBrand', width: 100 },
{ title: '被替换车型号', dataIndex: 'originalModel', key: 'originalModel', width: 110 },
{ title: '替换车车牌号', dataIndex: 'replacePlate', key: 'replacePlate', width: 120 },
{ title: '替换车品牌', dataIndex: 'replaceBrand', key: 'replaceBrand', width: 100 },
{ title: '替换车型号', dataIndex: 'replaceModel', key: 'replaceModel', width: 110 },
{ title: '替换原因', dataIndex: 'replaceReason', key: 'replaceReason', width: 100 },
{ title: '替换原因说明', dataIndex: 'replaceReasonDesc', key: 'replaceReasonDesc', width: 120, ellipsis: true },
{ title: '创建人', dataIndex: 'creator', key: 'creator', width: 90 },
{ title: '创建时间', dataIndex: 'createTime', key: 'createTime', width: 150 },
{ title: '操作', key: 'action', width: 160, fixed: 'right', render: function (_, record) { return getOperationButtons(record, _activeTab[0] === 'history'); } }
];
var filterItems = [
React.createElement('div', { key: 'replaceDate', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '替换日期'),
React.createElement(RangePicker, { style: filterControlStyle, placeholder: ['请选择开始时间', '请选择结束时间'], value: _replaceDateRange[0], onChange: function (v) { _replaceDateRange[1](v); } })),
React.createElement('div', { key: 'replaceType', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '替换类型'),
React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, value: _replaceType[0], onChange: function (v) { _replaceType[1](v); }, allowClear: true, options: replaceTypeOptions })),
React.createElement('div', { key: 'projectName', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '项目名称'),
React.createElement(Select, { placeholder: '请输入或选择项目名称', style: filterControlStyle, value: _projectName[0], onChange: function (v) { _projectName[1](v); }, allowClear: true, showSearch: true, options: projectNameOptions, filterOption: function (input, opt) { return (opt.label || '').toString().toLowerCase().indexOf((input || '').toLowerCase()) !== -1; } })),
React.createElement('div', { key: 'approvalStatus', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '审批状态'),
React.createElement(Select, { mode: 'multiple', placeholder: '请选择', style: filterControlStyle, value: _approvalStatus[0], onChange: handleApprovalStatusChange, options: approvalStatusOptions })),
React.createElement('div', { key: 'originalPlate', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '被替换车车牌号'),
React.createElement(Select, { placeholder: '请输入或选择车牌号', style: filterControlStyle, value: _originalPlate[0], onChange: function (v) { _originalPlate[1](v); }, allowClear: true, showSearch: true, options: plateOptions, filterOption: function (input, opt) { return (opt.label || '').toString().toLowerCase().indexOf((input || '').toLowerCase()) !== -1; } })),
React.createElement('div', { key: 'replacePlate', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '替换车车牌号'),
React.createElement(Select, { placeholder: '请输入或选择车牌号', style: filterControlStyle, value: _replacePlate[0], onChange: function (v) { _replacePlate[1](v); }, allowClear: true, showSearch: true, options: plateOptions, filterOption: function (input, opt) { return (opt.label || '').toString().toLowerCase().indexOf((input || '').toLowerCase()) !== -1; } })),
React.createElement('div', { key: 'replaceReason', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '替换原因'),
React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, value: _replaceReason[0], onChange: function (v) { _replaceReason[1](v); }, allowClear: true, options: replaceReasonOptions })),
React.createElement('div', { key: 'creator', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '创建人'),
React.createElement(Select, { placeholder: '请选择创建人', style: filterControlStyle, value: _creator[0], onChange: function (v) { _creator[1](v); }, allowClear: true, options: creatorOptions })),
React.createElement('div', { key: 'createTime', style: filterItemStyle },
React.createElement('div', { style: filterLabelStyle }, '创建时间'),
React.createElement(RangePicker, { style: filterControlStyle, placeholder: ['请选择开始时间', '请选择结束时间'], value: _createTimeRange[0], onChange: function (v) { _createTimeRange[1](v); } }))
];
var filterCount = _filterExpanded[0] ? 9 : 3;
var filterNodes = [];
for (var i = 0; i < filterCount && i < filterItems.length; i++) {
filterNodes.push(filterItems[i]);
}
var _page = useState(1);
var _pageSize = useState(10);
var page = _page[0];
var setPage = _page[1];
var pageSize = _pageSize[0];
var setPageSize = _pageSize[1];
var currentList = _activeTab[0] === 'ongoing' ? filteredOngoing : filteredHistory;
var displayList = useMemo(function () {
var start = (page - 1) * pageSize;
return currentList.slice(start, start + pageSize);
}, [currentList, page, pageSize]);
var rowSelection = {
selectedRowKeys: _selectedRowKeys[0],
onChange: function (keys) { _selectedRowKeys[1](keys); },
fixed: true
};
var requirementContent = `替换车管理2026年3月3日版本
一个「数字化资产ONEOS运管平台」中的「运维管理」「车辆业务」「替换车管理」模块
1.面包屑:
1.1.运维管理-车辆业务-替换车管理
筛选与列表分为2个卡片
2.筛选:
支持通过替换日期、替换类型、项目名称、审批状态、被替换车车牌号、替换车车牌号、替换原因、创建人、创建时间进行筛选,右侧为重置、查询、展开/收起筛选条件以3列显示默认显示一行点击展开/收起对筛选栏卡片进行展开/收起所有筛选条件),点击查询后,筛选条件与列表内容联动。点击重置会回到默认筛选条件并在列表展示结果:
2.1.替换日期:日期选择器,支持单输入框内双日历选择开始-结束时间,默认提示文本为:请选择开始时间、请选择结束时间;
2.2.替换类型:选择器,分为永久替换、临时替换两种方式;
2.3.项目名称:选择器,支持输入框中输入关键内容进行搜索,下拉匹配相应项;
2.4.审批状态:选择器,分为全部、待审批、审批中、审批驳回、未提交、撤回;
2.5.被替换车车牌号:选择器,支持输入框中输入关键内容进行搜索,下拉匹配相应项;
2.6.替换车车牌号:选择器,支持输入框中输入关键内容进行搜索,下拉匹配相应项;
2.7.替换原因:选择器,分为全部、客户原因、车辆原因;
2.8.创建人:选择器,下拉选择所有创建人;
2.9.创建时间:日期选择器,支持单输入框内双日历选择开始-结束时间,默认提示文本为:请选择开始时间、请选择结束时间;
3.列表:列表右上角为新增、导出,首列为多选,支持多选后导出对应条目;
列表展示所有替换车记录分为进行中、历史记录两个tab字段依次为替换日期、替换类型、项目名称、审批状态、被替换车车牌号、被替换车品牌、被替换车型号、替换车车牌号、替换车品牌、替换车型号、替换原因、替换原因说明、创建人、创建时间、操作
3.1.进行中:显示替换车申请流程未结束、暂存的记录;
3.1.1.替换日期显示格式为YYYY-MM-DD显示替换车申请表单中设置的替换日期
3.1.2.替换类型:分为:临时替换、永久替换两种,根据替换车申请表单中设置的替换类型显示;
3.1.3.项目名称:显示替换车申请表单中设置的项目名称;
3.1.4.审批状态:显示替换车申请当前审批状态,分为待审批、审批中、审批驳回、未提交、撤回;
3.1.4.1.待审批:发起人已提交,但还没有任何流程节点完成审批;
3.1.4.2.审批中发起人已提交已有1个以上节点完成审批但未完成最终节点审批
3.1.4.3.审批驳回:发起人已提交,任意流程节点驳回,该状态下操作列支持编辑和重新提交;
3.1.4.4.未提交:发起人仅保存,但未提交审批;
3.1.4.5.撤回:发起人主动撤回审批流程;
3.1.5.被替换车车牌号:显示替换车申请表单中被替换车车牌号;
3.1.6.被替换车品牌:显示替换车申请表单中被替换车品牌;
3.1.7.被替换车型号:显示替换车申请表单中被替换车型号;
3.1.8.替换车车牌号:显示替换车申请表单中替换车车牌号;
3.1.9.替换车品牌:显示替换车申请表单中替换车品牌;
3.1.10.替换车型号:显示替换车申请表单中替换车型号;
3.1.11.替换原因:显示替换车申请表单中替换原因;
3.1.12.替换原因说明:显示替换车申请表单中替换原因说明;
3.1.13.创建人:显示替换车申请表单中创建人;
3.1.14.创建时间显示替换车申请表单中创建时间显示格式为YYYY-MM-DD HH:MM
3.1.15.操作:查看、编辑、撤回;
3.1.15.1.查看:当「审批状态」为「待审批」「审批中」「审批驳回」「未提交」「撤回」时显示,点击跳转替换车管理-查看页面;
3.1.15.2.编辑:当「审批状态」为「未提交」「审批驳回」「撤回」时显示,点击跳转替换车管理-编辑页面;
3.1.15.3.撤回:当「审批状态」为「审批中」时显示,点击撤回合同时进行二次确认,提示语:是否确认撤回该替换车申请;
3.2.历史记录:显示替换车申请流程已结束的记录;
3.2.1.替换日期显示格式为YYYY-MM-DD显示替换车申请表单中设置的替换日期
3.2.2.替换类型:分为:临时替换、永久替换两种,根据替换车申请表单中设置的替换类型显示;
3.2.3.项目名称:显示替换车申请表单中设置的项目名称;
3.2.4.审批状态:历史记录中所有审批状态为审批完成;
3.2.5.被替换车车牌号:显示替换车申请表单中被替换车车牌号;
3.2.6.被替换车品牌:显示替换车申请表单中被替换车品牌;
3.2.7.被替换车型号:显示替换车申请表单中被替换车型号;
3.2.8.替换车车牌号:显示替换车申请表单中替换车车牌号;
3.2.9.替换车品牌:显示替换车申请表单中替换车品牌;
3.2.10.替换车型号:显示替换车申请表单中替换车型号;
3.2.11.替换原因:显示替换车申请表单中替换原因;
3.2.12.替换原因说明:显示替换车申请表单中替换原因说明;
3.2.13.创建人:显示替换车申请表单中创建人;
3.2.14.创建时间显示替换车申请表单中创建时间显示格式为YYYY-MM-DD HH:MM
3.2.15.操作:查看、转永久替换;
3.2.15.1.查看:点击跳转替换车管理-查看页面;
3.2.15.2.转永久替换:点击转永久替换,进行二次确认,提示语:是否确认转永久替换,点击提交直接转为永久替换;
列表右下方为分页符。`;
var layoutStyle = { padding: '16px 24px', background: '#f5f5f5', minHeight: '100vh' };
var reqTitleStyle = { fontSize: 18, fontWeight: 600, marginBottom: 16, color: 'rgba(0,0,0,0.85)' };
var reqSectionStyle = { fontSize: 15, fontWeight: 600, marginTop: 16, marginBottom: 8, color: 'rgba(0,0,0,0.85)' };
var reqItemStyle = { fontSize: 13, marginLeft: 32, marginTop: 4, marginBottom: 2, lineHeight: 1.6, color: 'rgba(0,0,0,0.75)' };
return React.createElement('div', { style: layoutStyle },
React.createElement('div', { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 16 } },
React.createElement(Breadcrumb, {
items: [
{ title: '运维管理' },
{ title: '车辆业务' },
{ title: '替换车管理' }
]
}),
React.createElement(Button, { type: 'link', style: { padding: 0 }, onClick: function () { _requirementModalVisible[1](true); } }, '查看需求说明')
),
React.createElement(Card, { style: { marginBottom: 16 } },
React.createElement('div', { style: { display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: '16px 24px', alignItems: 'start' } }, filterNodes),
React.createElement('div', { style: { display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 16 } },
React.createElement(Button, { onClick: handleReset }, '重置'),
React.createElement(Button, { type: 'primary', onClick: handleQuery }, '查询'),
React.createElement(Button, { type: 'link', size: 'small', onClick: function () { _filterExpanded[1](!_filterExpanded[0]); } }, _filterExpanded[0] ? '收起' : '展开')
)
),
React.createElement(Card, null,
React.createElement('div', { style: { marginBottom: 16, display: 'flex', justifyContent: 'space-between', alignItems: 'center' } },
React.createElement(Tabs, {
activeKey: _activeTab[0],
onChange: function (k) { _activeTab[1](k); _selectedRowKeys[1]([]); setPage(1); },
items: [
{ key: 'ongoing', label: '进行中' },
{ key: 'history', label: '历史记录' }
]
}),
React.createElement('div', { style: { display: 'flex', gap: 8 } },
React.createElement(Button, { type: 'primary', onClick: function () { message.info('新增替换车申请(原型)'); } }, '新增'),
React.createElement(Button, { onClick: function () { message.info('导出选中记录(原型)'); } }, '导出')
)
),
React.createElement(Table, {
rowKey: 'id',
rowSelection: rowSelection,
columns: tableColumns,
dataSource: displayList,
size: 'small',
scroll: { x: 1600 },
pagination: {
current: page,
pageSize: pageSize,
total: currentList.length,
showSizeChanger: true,
showQuickJumper: true,
showTotal: function (t) { return '共 ' + t + ' 条'; },
onChange: function (p, ps) { setPage(p); if (ps) setPageSize(ps); }
}
})
),
React.createElement(Modal, {
title: '是否确认撤回该替换车申请',
open: _withdrawModalVisible[0],
onCancel: function () { _withdrawModalVisible[1](false); _withdrawModalRecord[1](null); },
onOk: function () { message.success('已撤回(原型)'); _withdrawModalVisible[1](false); _withdrawModalRecord[1](null); },
okText: '确定',
cancelText: '取消'
}),
React.createElement(Modal, {
title: '是否确认转永久替换',
open: _toPermanentModalVisible[0],
onCancel: function () { _toPermanentModalVisible[1](false); _toPermanentModalRecord[1](null); },
onOk: function () { message.success('已转为永久替换(原型)'); _toPermanentModalVisible[1](false); _toPermanentModalRecord[1](null); },
okText: '提交',
cancelText: '取消'
}),
React.createElement(Modal, {
title: '需求说明',
open: _requirementModalVisible[0],
onCancel: function () { _requirementModalVisible[1](false); },
width: 720,
footer: React.createElement(Button, { onClick: function () { _requirementModalVisible[1](false); } }, '关闭'),
bodyStyle: { maxHeight: '70vh', overflow: 'auto' }
}, React.createElement('div', { style: { padding: '8px 0' } },
React.createElement('div', { style: { whiteSpace: 'pre-wrap', fontSize: 13, lineHeight: 1.6 } }, requirementContent))
)
);
};