ONE-OS/web端/车辆管理.jsx

// 【重要】必须使用 const Component 作为组件变量名
// 车辆资产管理 - 车辆管理模块（中后台 Ant Design 原型）
const Component = function () {
	var useState = React.useState;
	var useMemo = React.useMemo;
	var useCallback = React.useCallback;
	var antd = window.antd;

	var Breadcrumb = antd.Breadcrumb;
	var Cascader = antd.Cascader;
	var Select = antd.Select;
	var Input = antd.Input;
	var Button = antd.Button;
	var Table = antd.Table;
	var Space = antd.Space;
	var Dropdown = antd.Dropdown;
	var Modal = antd.Modal;
	var Upload = antd.Upload;
	var Card = antd.Card;
	var Tabs = antd.Tabs;
	var message = antd.message;
	var App = antd.App;

	// 筛选项状态
	var _region = useState([]);
	var _vehicleType = useState(undefined);
	var _brand = useState(undefined);
	var _model = useState(undefined);
	var _customer = useState(undefined);
	var _department = useState(undefined);
	var _contractNo = useState(undefined);
	var _ownership = useState(undefined);

	var _plateFilter = useState('');
	var _selectedRowKeys = useState([]);
	var _uploadModalVisible = useState(false);
	var _confirmModalVisible = useState(false);
	var _ocrLoadingVisible = useState(false);
	var _currentRow = useState(null);
	var _plateForm = useState({ vin: '', plateNo: '' });
	var _plateError = useState('');
	var _detailRecord = useState(null);
	var _detailCardExpanded = useState(false);
	var _detailTab = useState('型号参数');
	var _filterExpanded = useState(false);
	var _requirementModalVisible = useState(false);

	// 省-市 地区数据（示例）
	var regionOptions = [
		{ value: 'guangdong', label: '广东省', children: [{ value: 'guangzhou', label: '广州市' }, { value: 'shenzhen', label: '深圳市' }] },
		{ value: 'beijing', label: '北京市', children: [{ value: 'beijing', label: '北京市' }] },
		{ value: 'shanghai', label: '上海市', children: [{ value: 'shanghai', label: '上海市' }] }
	];

	// 车辆类型、品牌、型号、客户、部门、合同、登记所有权（模拟下拉数据）
	var vehicleTypeOptions = [{ label: '小型轿车', value: 'type1' }, { label: 'SUV', value: 'type2' }, { label: '厢式货车', value: 'type3' }];
	var brandOptions = [{ label: '比亚迪', value: 'byd' }, { label: '特斯拉', value: 'tsl' }, { label: '蔚来', value: 'nio' }];
	var modelOptions = [{ label: '汉EV', value: 'han' }, { label: 'Model 3', value: 'm3' }, { label: 'ET5', value: 'et5' }];
	var customerOptions = [{ label: '无', value: 'none' }, { label: '客户A', value: 'c1' }, { label: '客户B', value: 'c2' }];
	var departmentOptions = [{ label: '无', value: 'none' }, { label: '华南区', value: 'd1' }, { label: '华东区', value: 'd2' }];
	var contractOptions = [{ label: 'HT-2024-001', value: 'HT-2024-001' }, { label: 'HT-2024-002', value: 'HT-2024-002' }];
	var ownershipOptions = [{ label: '某某租赁公司', value: 'o1' }, { label: '某某科技有限公司', value: 'o2' }];

	// 表格数据（模拟 20 条，状态按产品枚举）
	// 运营状态: 待运营、库存、租赁、自营、退出运营
	// 库位状态: 新车入库-待验车、新车入库-证照办理、库存车-可交付车、库存车-不可交付车、库存车-呆滞车、已交付车-租赁交车、已交付车-自营交车、已交付车-替换交车、退出运营-报废车、退出运营-三方退租车、退出运营-过户售车
	// 出库状态: 异动出库、调拨出库、展示出库、租赁交车、自营交车、替换交车、过户售车、外租退车、报废出库、无
	// 预占状态: 331 后迭代，暂用「未预占」
	// 整备状态: 待整备、整备中、正常、无
	// 过户状态: 过户中、内部过户完成、销售过户完成、无
	// 维修状态: 待服务站接单、维修中、正常
	// 证照状态: 正常、异常
	// 报废状态: 报废中、已报废、无
	var rawData = [
		{ id: '1', region: '广东省/广州市', vin: 'LGWEF4A59NS123456', plateNo: '粤A12345', vehicleNo: 'V001', vehicleType: '小型轿车', brand: '比亚迪', model: '汉EV', color: '白色', parking: '天河停车场', customer: '客户A', department: '华南区', manager: '张三', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '在线', year: '2023', mileage: '12580.50', purchaseDate: '2023-06-15', regDate: '2023-07-01', inspectExpire: '2025-07', lastDeliveryTime: '2024-01-10', lastDeliveryMile: '12000.00', lastReturnTime: '2024-02-01', lastReturnMile: '12580.50', scrapDate: '2038-12-31', contractNo: 'HT-2024-001', location: '广东省广州市天河区天河路100号', gpsTime: '2024-02-12 14:30' },
		{ id: '2', region: '广东省/深圳市', vin: 'LGWEF4A59NS789012', plateNo: '粤B67890', vehicleNo: '-', vehicleType: 'SUV', brand: '特斯拉', model: 'Model 3', color: '黑色', parking: '-', customer: '客户B', department: '华南区', manager: '李四', operateStatus: '库存', storageStatus: '库存车-可交付车', outStatus: '无', preemptStatus: '未预占', prepareStatus: '待整备', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某科技有限公司', onlineStatus: '离线', year: '2022', mileage: '25600.00', purchaseDate: '2022-08-20', regDate: '2022-09-01', inspectExpire: '2024-09', lastDeliveryTime: '2024-01-05', lastDeliveryMile: '25500.00', lastReturnTime: '2024-01-20', lastReturnMile: '25600.00', scrapDate: '2037-09-30', contractNo: '-', location: '广东省深圳市南山区科技园南路', gpsTime: '2024-02-11 09:00' },
		{ id: '3', region: '广东省/广州市', vin: 'LSJA24U70PS001234', plateNo: '粤A88K88', vehicleNo: 'V003', vehicleType: '小型轿车', brand: '蔚来', model: 'ET5', color: '灰色', parking: '黄埔停车场', customer: '客户A', department: '华南区', manager: '王五', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '在线', year: '2023', mileage: '8320.00', purchaseDate: '2023-09-01', regDate: '2023-09-20', inspectExpire: '2025-09', lastDeliveryTime: '2024-02-05', lastDeliveryMile: '8100.00', lastReturnTime: '2024-02-10', lastReturnMile: '8320.00', scrapDate: '2039-09-30', contractNo: 'HT-2024-002', location: '广东省广州市黄埔区开泰大道200号', gpsTime: '2024-02-12 10:15' },
		{ id: '4', region: '北京市/北京市', vin: 'WVWZZZ3CZWE123456', plateNo: '京C12345', vehicleNo: '-', vehicleType: 'SUV', brand: '特斯拉', model: 'Model Y', color: '蓝色', parking: '朝阳停车场', customer: '无', department: '无', manager: '-', operateStatus: '自营', storageStatus: '已交付车-自营交车', outStatus: '自营交车', preemptStatus: '未预占', prepareStatus: '整备中', transferStatus: '无', repairStatus: '维修中', licenseStatus: '正常', scrapStatus: '无', ownership: '某某科技有限公司', onlineStatus: '离线', year: '2022', mileage: '18900.25', purchaseDate: '2022-11-10', regDate: '2022-12-01', inspectExpire: '2024-12', lastDeliveryTime: '2024-01-15', lastDeliveryMile: '18500.00', lastReturnTime: '2024-01-28', lastReturnMile: '18900.25', scrapDate: '2037-12-31', contractNo: '-', location: '北京市朝阳区望京街88号', gpsTime: '2024-02-10 16:00' },
		{ id: '5', region: '上海市/上海市', vin: 'LSVAU2BR3NS567890', plateNo: '沪D66666', vehicleNo: 'V005', vehicleType: '厢式货车', brand: '比亚迪', model: '汉EV', color: '白色', parking: '-', customer: '客户C', department: '华东区', manager: '赵六', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '异常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '在线', year: '2021', mileage: '45200.80', purchaseDate: '2021-05-20', regDate: '2021-06-15', inspectExpire: '2024-06', lastDeliveryTime: '2024-02-01', lastDeliveryMile: '44800.00', lastReturnTime: '2024-02-08', lastReturnMile: '45200.80', scrapDate: '2036-06-30', contractNo: 'HT-2024-003', location: '上海市浦东新区张江高科路500号', gpsTime: '2024-02-12 09:45' },
		{ id: '6', region: '广东省/深圳市', vin: '5YJ3E1EA1NF123456', plateNo: '粤B12345', vehicleNo: '-', vehicleType: '小型轿车', brand: '特斯拉', model: 'Model 3', color: '红色', parking: '福田停车场', customer: '客户B', department: '华南区', manager: '李四', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '在线', year: '2023', mileage: '5600.00', purchaseDate: '2023-03-08', regDate: '2023-04-01', inspectExpire: '2025-04', lastDeliveryTime: '2024-02-02', lastDeliveryMile: '5200.00', lastReturnTime: '2024-02-11', lastReturnMile: '5600.00', scrapDate: '2038-04-30', contractNo: 'HT-2024-004', location: '广东省深圳市福田区福华路188号', gpsTime: '2024-02-12 11:20' },
		{ id: '7', region: '广东省/广州市', vin: 'LGWEF4A59NS234567', plateNo: '粤A99A99', vehicleNo: 'V007', vehicleType: '小型轿车', brand: '比亚迪', model: '汉EV', color: '黑色', parking: '天河停车场', customer: '客户A', department: '华南区', manager: '张三', operateStatus: '库存', storageStatus: '库存车-不可交付车', outStatus: '无', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '离线', year: '2022', mileage: '22100.30', purchaseDate: '2022-07-15', regDate: '2022-08-01', inspectExpire: '2024-08', lastDeliveryTime: '2024-01-20', lastDeliveryMile: '21800.00', lastReturnTime: '2024-02-05', lastReturnMile: '22100.30', scrapDate: '2037-08-31', contractNo: '-', location: '广东省广州市天河区体育西路200号', gpsTime: '2024-02-11 18:30' },
		{ id: '8', region: '北京市/北京市', vin: 'WVWZZZ3CZWE789012', plateNo: '京E88888', vehicleNo: '-', vehicleType: 'SUV', brand: '蔚来', model: 'ET5', color: '绿色', parking: '-', customer: '客户D', department: '华北区', manager: '孙七', operateStatus: '自营', storageStatus: '已交付车-自营交车', outStatus: '自营交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某科技有限公司', onlineStatus: '在线', year: '2023', mileage: '11200.00', purchaseDate: '2023-01-12', regDate: '2023-02-01', inspectExpire: '2025-02', lastDeliveryTime: '2024-02-06', lastDeliveryMile: '11000.00', lastReturnTime: '2024-02-12', lastReturnMile: '11200.00', scrapDate: '2038-02-28', contractNo: 'HT-2024-005', location: '北京市海淀区中关村大街1号', gpsTime: '2024-02-12 08:00' },
		{ id: '9', region: '上海市/上海市', vin: 'LSVAU2BR3NS111222', plateNo: '沪A12345', vehicleNo: '-', vehicleType: '小型轿车', brand: '比亚迪', model: '汉EV', color: '银色', parking: '浦东停车场', customer: '无', department: '无', manager: '-', operateStatus: '库存', storageStatus: '库存车-呆滞车', outStatus: '无', preemptStatus: '未预占', prepareStatus: '待整备', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '离线', year: '2021', mileage: '38500.60', purchaseDate: '2021-10-05', regDate: '2021-11-01', inspectExpire: '2024-11', lastDeliveryTime: '2024-01-08', lastDeliveryMile: '38000.00', lastReturnTime: '2024-01-25', lastReturnMile: '38500.60', scrapDate: '2036-11-30', contractNo: '-', location: '上海市徐汇区漕溪路250号', gpsTime: '2024-02-09 14:00' },
		{ id: '10', region: '广东省/深圳市', vin: '5YJ3E1EA2NF333444', plateNo: '粤B55B55', vehicleNo: 'V010', vehicleType: 'SUV', brand: '特斯拉', model: 'Model Y', color: '白色', parking: '南山停车场', customer: '客户B', department: '华南区', manager: '李四', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某科技有限公司', onlineStatus: '在线', year: '2022', mileage: '16800.00', purchaseDate: '2022-04-18', regDate: '2022-05-10', inspectExpire: '2024-05', lastDeliveryTime: '2024-01-30', lastDeliveryMile: '16500.00', lastReturnTime: '2024-02-09', lastReturnMile: '16800.00', scrapDate: '2037-05-31', contractNo: 'HT-2024-006', location: '广东省深圳市南山区后海大道300号', gpsTime: '2024-02-12 13:10' },
		{ id: '11', region: '广东省/广州市', vin: 'LSJA24U70PS555666', plateNo: '粤A11B22', vehicleNo: '-', vehicleType: '小型轿车', brand: '蔚来', model: 'ET5', color: '蓝色', parking: '番禺停车场', customer: '客户A', department: '华南区', manager: '王五', operateStatus: '租赁', storageStatus: '已交付车-替换交车', outStatus: '替换交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '在线', year: '2023', mileage: '7200.50', purchaseDate: '2023-07-20', regDate: '2023-08-05', inspectExpire: '2025-08', lastDeliveryTime: '2024-02-03', lastDeliveryMile: '7000.00', lastReturnTime: '2024-02-11', lastReturnMile: '7200.50', scrapDate: '2038-08-31', contractNo: 'HT-2024-007', location: '广东省广州市番禺区市桥街100号', gpsTime: '2024-02-12 12:00' },
		{ id: '12', region: '北京市/北京市', vin: 'WVWZZZ3CZWE333555', plateNo: '京F33333', vehicleNo: '-', vehicleType: '厢式货车', brand: '比亚迪', model: '汉EV', color: '灰色', parking: '大兴停车场', customer: '客户D', department: '华北区', manager: '孙七', operateStatus: '库存', storageStatus: '库存车-不可交付车', outStatus: '无', preemptStatus: '未预占', prepareStatus: '待整备', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '离线', year: '2020', mileage: '52100.00', purchaseDate: '2020-09-01', regDate: '2020-10-01', inspectExpire: '2024-10', lastDeliveryTime: '2024-01-12', lastDeliveryMile: '51800.00', lastReturnTime: '2024-01-30', lastReturnMile: '52100.00', scrapDate: '2035-10-31', contractNo: '-', location: '北京市大兴区亦庄经济开发区', gpsTime: '2024-02-08 11:00' },
		{ id: '13', region: '上海市/上海市', vin: 'LSVAU2BR3NS777888', plateNo: '沪B99999', vehicleNo: 'V013', vehicleType: '小型轿车', brand: '特斯拉', model: 'Model 3', color: '黑色', parking: '-', customer: '客户C', department: '华东区', manager: '赵六', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '内部过户完成', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某科技有限公司', onlineStatus: '在线', year: '2022', mileage: '19800.00', purchaseDate: '2022-12-01', regDate: '2023-01-05', inspectExpire: '2025-01', lastDeliveryTime: '2024-02-07', lastDeliveryMile: '19500.00', lastReturnTime: '2024-02-12', lastReturnMile: '19800.00', scrapDate: '2038-01-31', contractNo: 'HT-2024-008', location: '上海市闵行区莘庄镇莘松路88号', gpsTime: '2024-02-12 15:45' },
		{ id: '14', region: '广东省/深圳市', vin: 'LGWEF4A59NS888999', plateNo: '粤B22C33', vehicleNo: '-', vehicleType: 'SUV', brand: '比亚迪', model: '汉EV', color: '白色', parking: '龙岗停车场', customer: '客户B', department: '华南区', manager: '李四', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '在线', year: '2023', mileage: '4200.00', purchaseDate: '2023-10-10', regDate: '2023-11-01', inspectExpire: '2025-11', lastDeliveryTime: '2024-02-04', lastDeliveryMile: '4000.00', lastReturnTime: '2024-02-10', lastReturnMile: '4200.00', scrapDate: '2038-11-30', contractNo: 'HT-2024-009', location: '广东省深圳市龙岗区龙城大道500号', gpsTime: '2024-02-12 10:30' },
		{ id: '15', region: '广东省/广州市', vin: 'LSJA24U70PS000111', plateNo: '粤A66D66', vehicleNo: 'V015', vehicleType: '小型轿车', brand: '蔚来', model: 'ET5', color: '红色', parking: '天河停车场', customer: '无', department: '无', manager: '-', operateStatus: '待运营', storageStatus: '新车入库-待验车', outStatus: '无', preemptStatus: '未预占', prepareStatus: '无', transferStatus: '无', repairStatus: '正常', licenseStatus: '异常', scrapStatus: '无', ownership: '某某科技有限公司', onlineStatus: '离线', year: '2021', mileage: '31200.40', purchaseDate: '2021-03-15', regDate: '2021-04-01', inspectExpire: '2024-04', lastDeliveryTime: '2024-01-18', lastDeliveryMile: '30800.00', lastReturnTime: '2024-02-02', lastReturnMile: '31200.40', scrapDate: '2036-04-30', contractNo: '-', location: '广东省广州市越秀区中山五路66号', gpsTime: '2024-02-07 09:00' },
		{ id: '16', region: '北京市/北京市', vin: '5YJ3E1EA3NF222333', plateNo: '京G12345', vehicleNo: '-', vehicleType: '小型轿车', brand: '特斯拉', model: 'Model 3', color: '银色', parking: '西城停车场', customer: '客户D', department: '华北区', manager: '孙七', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '在线', year: '2023', mileage: '9800.00', purchaseDate: '2023-05-01', regDate: '2023-05-20', inspectExpire: '2025-05', lastDeliveryTime: '2024-02-01', lastDeliveryMile: '9500.00', lastReturnTime: '2024-02-11', lastReturnMile: '9800.00', scrapDate: '2038-05-31', contractNo: 'HT-2024-010', location: '北京市西城区金融街28号', gpsTime: '2024-02-12 14:00' },
		{ id: '17', region: '上海市/上海市', vin: 'LGWEF4A59NS444555', plateNo: '沪C11111', vehicleNo: '-', vehicleType: '小型轿车', brand: '比亚迪', model: '汉EV', color: '黑色', parking: '虹口停车场', customer: '客户C', department: '华东区', manager: '赵六', operateStatus: '库存', storageStatus: '库存车-可交付车', outStatus: '无', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '离线', year: '2022', mileage: '24500.00', purchaseDate: '2022-02-28', regDate: '2022-03-15', inspectExpire: '2024-03', lastDeliveryTime: '2024-01-22', lastDeliveryMile: '24200.00', lastReturnTime: '2024-02-06', lastReturnMile: '24500.00', scrapDate: '2037-03-31', contractNo: '-', location: '上海市虹口区四川北路1688号', gpsTime: '2024-02-11 17:00' },
		{ id: '18', region: '广东省/深圳市', vin: 'LSVAU2BR3NS666777', plateNo: '粤B44E44', vehicleNo: 'V018', vehicleType: '厢式货车', brand: '比亚迪', model: '汉EV', color: '灰色', parking: '-', customer: '客户B', department: '华南区', manager: '李四', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '无', repairStatus: '待服务站接单', licenseStatus: '正常', scrapStatus: '无', ownership: '某某科技有限公司', onlineStatus: '在线', year: '2020', mileage: '67800.25', purchaseDate: '2020-06-10', regDate: '2020-07-01', inspectExpire: '2024-07', lastDeliveryTime: '2024-01-25', lastDeliveryMile: '67500.00', lastReturnTime: '2024-02-09', lastReturnMile: '67800.25', scrapDate: '2035-07-31', contractNo: 'HT-2024-011', location: '广东省深圳市宝安区新安街道创业路', gpsTime: '2024-02-12 08:20' },
		{ id: '19', region: '广东省/广州市', vin: '5YJ3E1EA4NF888999', plateNo: '粤A77F77', vehicleNo: '-', vehicleType: 'SUV', brand: '特斯拉', model: 'Model Y', color: '蓝色', parking: '白云停车场', customer: '客户A', department: '华南区', manager: '张三', operateStatus: '租赁', storageStatus: '已交付车-租赁交车', outStatus: '租赁交车', preemptStatus: '未预占', prepareStatus: '正常', transferStatus: '过户中', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '无', ownership: '某某租赁公司', onlineStatus: '在线', year: '2023', mileage: '3500.00', purchaseDate: '2023-11-05', regDate: '2023-11-25', inspectExpire: '2025-11', lastDeliveryTime: '2024-02-08', lastDeliveryMile: '3200.00', lastReturnTime: '2024-02-12', lastReturnMile: '3500.00', scrapDate: '2038-11-30', contractNo: 'HT-2024-012', location: '广东省广州市白云区白云大道南888号', gpsTime: '2024-02-12 16:00' },
		{ id: '20', region: '北京市/北京市', vin: 'LSJA24U70PS999000', plateNo: '京H88888', vehicleNo: '-', vehicleType: '小型轿车', brand: '蔚来', model: 'ET5', color: '白色', parking: '昌平停车场', customer: '客户D', department: '华北区', manager: '孙七', operateStatus: '退出运营', storageStatus: '退出运营-报废车', outStatus: '报废出库', preemptStatus: '未预占', prepareStatus: '无', transferStatus: '过户中', repairStatus: '正常', licenseStatus: '正常', scrapStatus: '报废中', ownership: '某某科技有限公司', onlineStatus: '离线', year: '2022', mileage: '15600.00', purchaseDate: '2022-06-20', regDate: '2022-07-10', inspectExpire: '2024-07', lastDeliveryTime: '2024-01-10', lastDeliveryMile: '15300.00', lastReturnTime: '2024-01-28', lastReturnMile: '15600.00', scrapDate: '2037-07-31', contractNo: '-', location: '北京市昌平区回龙观西大街100号', gpsTime: '2024-02-10 12:30' }
	];

	var dataSource = useMemo(function () {
		var plate = _plateFilter[0];
		if (!plate || plate.trim() === '') return rawData;
		return rawData.filter(function (row) {
			return row.plateNo && row.plateNo.indexOf(plate) !== -1;
		});
	}, [rawData, _plateFilter[0]]);

	var onPlateFilterChange = useCallback(function (e) {
		_plateFilter[1](e.target.value);
	}, []);

	var onSelectChange = useCallback(function (keys) {
		_selectedRowKeys[1](keys);
	}, []);

	var rowSelection = {
		selectedRowKeys: _selectedRowKeys[0],
		onChange: onSelectChange
	};

	var handleExport = useCallback(function () {
		if (_selectedRowKeys[0].length === 0) {
			message.warning('请先勾选要导出的记录');
			return;
		}
		message.success('导出功能（联动多选）：已选 ' + _selectedRowKeys[0].length + ' 条');
	}, []);

	var handleBatchImport = useCallback(function () {
		message.info('批量导入：请上传文件（原型演示）');
	}, []);

	var goDetail = useCallback(function (record) {
		_detailRecord[1](record);
	}, []);

	var backToList = useCallback(function () {
		_detailRecord[1](null);
	}, []);

	var openUploadModal = useCallback(function (record) {
		_currentRow[1](record);
		_uploadModalVisible[1](true);
		_confirmModalVisible[1](false);
		_plateForm[1]({ vin: record.vin || '', plateNo: record.plateNo || '' });
		_plateError[1]('');
	}, []);

	var closeUploadModal = useCallback(function () {
		_uploadModalVisible[1](false);
		_currentRow[1](null);
	}, []);

	var startOcrThenConfirm = useCallback(function () {
		_uploadModalVisible[1](false);
		_ocrLoadingVisible[1](true);
		setTimeout(function () {
			_ocrLoadingVisible[1](false);
			_confirmModalVisible[1](true);
		}, 1500);
	}, []);

	var closeConfirmModal = useCallback(function () {
		_confirmModalVisible[1](false);
		_currentRow[1](null);
		_plateForm[1]({ vin: '', plateNo: '' });
		_plateError[1]('');
	}, []);

	var onPlateFormChange = useCallback(function (field, value) {
		_plateError[1]('');
		_plateForm[1](function (prev) {
			var next = {};
			next[field] = value;
			return Object.assign({}, prev, next);
		});
	}, []);

	var confirmPlate = useCallback(function () {
		var row = _currentRow[0];
		var form = _plateForm[0];
		if (!row) return;
		var vinMatch = form.vin && row.vin && form.vin.trim() === row.vin.trim();
		if (!form.vin || !form.plateNo) {
			_plateError[1]('请填写车辆识别代号与车牌号');
			return;
		}
		if (!vinMatch) {
			_plateError[1]('车辆识别代号与该车辆不匹配');
			return;
		}
		message.success('上牌信息已更新（原型演示）');
		closeConfirmModal();
	}, []);

	var getMoreMenuItems = function (record) {
		return [
			{ key: 'plate', label: '车辆上牌', onClick: function () { openUploadModal(record); } },
			{ key: 'transfer', label: '车辆过户', onClick: function () { message.info('车辆过户（原型）'); } },
			{ key: 'move', label: '车辆异动', onClick: function () { message.info('车辆异动（原型）'); } },
			{ key: 'allocate', label: '车辆调拨', onClick: function () { message.info('车辆调拨（原型）'); } },
			{ key: 'scrap', label: '车辆报废', onClick: function () { message.info('车辆报废（原型）'); } },
			{ key: 'inspect', label: '车辆年审', onClick: function () { message.info('车辆年审（原型）'); } },
			{ key: 'sell', label: '车辆出售', onClick: function () { message.info('车辆出售（原型）'); } },
			{ key: 'fault', label: '故障提报', onClick: function () { message.info('故障提报（原型）'); } }
		];
	};

	var columns = [
		{ title: '运营城市', dataIndex: 'region', key: 'region', width: 140, fixed: 'left' },
		{ title: '车辆识别代号', dataIndex: 'vin', key: 'vin', width: 180, fixed: 'left' },
		{ title: '车牌号', dataIndex: 'plateNo', key: 'plateNo', width: 110, fixed: 'left' },
		{ title: '车辆编号', dataIndex: 'vehicleNo', key: 'vehicleNo', width: 100 },
		{ title: '车辆类型', dataIndex: 'vehicleType', key: 'vehicleType', width: 100 },
		{ title: '品牌', dataIndex: 'brand', key: 'brand', width: 90 },
		{ title: '型号', dataIndex: 'model', key: 'model', width: 100 },
		{ title: '车身颜色', dataIndex: 'color', key: 'color', width: 90 },
		{ title: '归属停车场', dataIndex: 'parking', key: 'parking', width: 120 },
		{ title: '客户名称', dataIndex: 'customer', key: 'customer', width: 100 },
		{ title: '业务部门', dataIndex: 'department', key: 'department', width: 100 },
		{ title: '业务负责人', dataIndex: 'manager', key: 'manager', width: 100 },
		{ title: '运营状态', dataIndex: 'operateStatus', key: 'operateStatus', width: 90 },
		{ title: '库位状态', dataIndex: 'storageStatus', key: 'storageStatus', width: 180 },
		{ title: '出库状态', dataIndex: 'outStatus', key: 'outStatus', width: 90 },
		{ title: '整备状态', dataIndex: 'prepareStatus', key: 'prepareStatus', width: 90 },
		{ title: '过户状态', dataIndex: 'transferStatus', key: 'transferStatus', width: 90 },
		{ title: '维修状态', dataIndex: 'repairStatus', key: 'repairStatus', width: 90 },
		{ title: '证照状态', dataIndex: 'licenseStatus', key: 'licenseStatus', width: 90 },
		{ title: '报废状态', dataIndex: 'scrapStatus', key: 'scrapStatus', width: 90 },
		{ title: '登记所有权', dataIndex: 'ownership', key: 'ownership', width: 160 },
		{ title: '在线状态', dataIndex: 'onlineStatus', key: 'onlineStatus', width: 90 },
		{ title: '出厂年份', dataIndex: 'year', key: 'year', width: 90 },
		{ title: '行驶公里数（KM）', dataIndex: 'mileage', key: 'mileage', width: 130 },
		{ title: '采购入库时间', dataIndex: 'purchaseDate', key: 'purchaseDate', width: 120 },
		{ title: '行驶证注册日期', dataIndex: 'regDate', key: 'regDate', width: 130 },
		{ title: '行驶证检验有效期', dataIndex: 'inspectExpire', key: 'inspectExpire', width: 130 },
		{ title: '上次交车时间', dataIndex: 'lastDeliveryTime', key: 'lastDeliveryTime', width: 120 },
		{ title: '上次交车里程（KM）', dataIndex: 'lastDeliveryMile', key: 'lastDeliveryMile', width: 140 },
		{ title: '上次还车时间', dataIndex: 'lastReturnTime', key: 'lastReturnTime', width: 120 },
		{ title: '上次还车里程（KM）', dataIndex: 'lastReturnMile', key: 'lastReturnMile', width: 140 },
		{ title: '强制报废日期', dataIndex: 'scrapDate', key: 'scrapDate', width: 120 },
		{ title: '合同编号', dataIndex: 'contractNo', key: 'contractNo', width: 120 },
		{ title: '当前位置', dataIndex: 'location', key: 'location', width: 300 },
		{ title: 'GPS最后上传时间', dataIndex: 'gpsTime', key: 'gpsTime', width: 160 },
		{
			title: '操作',
			key: 'action',
			width: 140,
			fixed: 'right',
			render: function (_, record) {
				return React.createElement(Space, null,
					React.createElement(Button, { type: 'link', size: 'small', onClick: function () { goDetail(record); } }, '查看'),
					React.createElement(Dropdown, { menu: { items: getMoreMenuItems(record) }, trigger: ['click'] },
						React.createElement(Button, { type: 'link', size: 'small' }, '更多')
					)
				);
			}
		}
	];

	var filterControlStyle = { width: '100%' };
	var layoutStyle = { padding: '16px 24px', background: '#fff', minHeight: '100vh' };
	var filterLabelStyle = { marginBottom: 6, fontSize: 14, color: 'rgba(0,0,0,0.65)' };
	var filterItemStyle = { marginBottom: 12 };
	var toolbarStyle = { marginBottom: 12, display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexWrap: 'wrap', gap: 8 };
	var tableSingleLineStyle = '.vehicle-mgmt-table .ant-table-thead th,.vehicle-mgmt-table .ant-table-tbody td{white-space:nowrap;}';

	// 车辆详情页：卡片标题、默认只显示前三列+收起/展开，下方 Tab+内容卡片
	var detailRecord = _detailRecord[0];
	if (detailRecord) {
		var r = detailRecord;
		var labelStyle = { color: 'rgba(0,0,0,0.45)', fontSize: 14, flexShrink: 0, minWidth: 100, textAlign: 'right' };
		var valueStyle = { color: 'rgba(0,0,0,0.85)', fontSize: 14, textAlign: 'left' };
		var linkStyle = { color: '#1890ff', cursor: 'pointer', fontSize: 14 };
		var cellStyle = { marginBottom: 16, minHeight: 22, display: 'flex', alignItems: 'center', gap: 8 };
		var link = function (text, onClick) { return React.createElement('a', { style: linkStyle, onClick: onClick }, text); };
		var detailCardStyle = { background: '#fff', borderRadius: 8, padding: 24, marginTop: 16, boxShadow: '0 1px 2px rgba(0,0,0,0.03)' };
		var gridColStyle = { flex: '1', minWidth: 180 };
		var field = function (label, val) { return React.createElement('div', { style: cellStyle }, React.createElement('span', { style: labelStyle }, label), React.createElement('span', { style: valueStyle }, val)); };
		var fieldLink = function (label, text, onClick) { return React.createElement('div', { style: cellStyle }, React.createElement('span', { style: labelStyle }, label), React.createElement('span', { style: valueStyle }, link(text, onClick))); };
		var detailFields = [
			{ label: '车架号', node: field('车架号', r.vin || '-') },
			{ label: '车辆编号', node: field('车辆编号', r.vehicleNo || '-') },
			{ label: '实际所有权', node: field('实际所有权', r.ownership || '-') },
			{ label: '合同编号', node: r.contractNo && r.contractNo !== '-' ? fieldLink('合同编号', r.contractNo, function () { message.info('合同详情（原型）'); }) : field('合同编号', r.contractNo || '-') },
			{ label: '出库状态', node: field('出库状态', r.outStatus || '-') },
			{ label: '过户状态', node: field('过户状态', r.transferStatus || '-') },
			{ label: '车身颜色', node: field('车身颜色', r.color || '-') },
			{ label: '采购交车日期', node: field('采购交车日期', r.purchaseDate || '-') },
			{ label: '登记所有权', node: field('登记所有权', r.ownership || '-') },
			{ label: '客户名称', node: field('客户名称', r.customer || '-') },
			{ label: '整备状态', node: field('整备状态', r.prepareStatus || '-') },
			{ label: '证照状态', node: field('证照状态', r.licenseStatus || '-') },
			{ label: '资源分类', node: field('资源分类', 'XXXXXXXXX') },
			{ label: '出厂年份', node: field('出厂年份', r.year || '-') },
			{ label: '库位状态', node: field('库位状态', r.storageStatus || '-') },
			{ label: '业务部门', node: field('业务部门', r.department || '-') },
			{ label: '上次整备时间', node: field('上次整备时间', r.lastDeliveryTime || '-') },
			{ label: '报废状态', node: field('报废状态', r.scrapStatus || '-') },
			{ label: '资产评级', node: field('资产评级', 'XXXXXXXXX') },
			{ label: '等评时间', node: field('等评时间', r.regDate || '-') },
			{ label: '强制报废期', node: field('强制报废期', r.scrapDate || '-') },
			{ label: '停车位置', node: field('停车位置', r.parking || '-') },
			{ label: '业务负责人', node: r.manager && r.manager !== '-' ? fieldLink('业务负责人', r.manager, function () { message.info('负责人（原型）'); }) : field('业务负责人', r.manager || '-') },
			{ label: '维修状态', node: field('维修状态', r.repairStatus || '-') },
			{ label: '运营城市', node: field('运营城市', r.region ? r.region.replace(/\//g, '-') : '-') },
			{ label: '下次年检时间', node: field('下次年检时间', r.inspectExpire || '-') },
			{ label: '上次维修时间', node: field('上次维修时间', r.lastDeliveryTime || '-') },
			{ label: 'GPS最后上传时间', node: field('GPS最后上传时间', r.gpsTime || '-') },
			{ label: '车辆当前位置', node: fieldLink('车辆当前位置', r.location || '-', function () { message.info('查看位置（原型）'); }) }
		];
		var rowCount = _detailCardExpanded[0] ? 8 : 3;
		var rows = [];
		for (var i = 0; i < rowCount; i++) {
			var rowCells = [];
			for (var j = 0; j < 4; j++) {
				var idx = i * 4 + j;
				rowCells.push(React.createElement('div', { key: idx, style: gridColStyle }, detailFields[idx] ? detailFields[idx].node : null));
			}
			rows.push(React.createElement('div', { key: i, style: { display: 'flex', gap: 24, marginBottom: i < rowCount - 1 ? 16 : 0 } }, rowCells));
		}
		var tabContentCardStyle = { background: '#fff', borderRadius: 8, padding: 24, marginTop: 0, boxShadow: '0 1px 2px rgba(0,0,0,0.03)' };
		var tabContent = function (text) { return React.createElement('div', { style: { padding: '8px 0', color: 'rgba(0,0,0,0.65)', fontSize: 14 } }, text); };
		var sectionTitleStyle = { display: 'flex', alignItems: 'center', gap: 8, marginBottom: 16, fontSize: 15, fontWeight: 600, color: 'rgba(0,0,0,0.85)' };
		var sectionIconStyle = { width: 6, height: 6, borderRadius: 3, backgroundColor: '#1890ff', flexShrink: 0 };
		var kvLabelStyle = { color: 'rgba(0,0,0,0.45)', fontSize: 14, flexShrink: 0, minWidth: 90, textAlign: 'right' };
		var kvValueStyle = { color: 'rgba(0,0,0,0.85)', fontSize: 14, textAlign: 'left' };
		var kvItem = function (label, value, badge) {
			var valNode = value;
			if (badge) valNode = React.createElement('span', null, value, React.createElement('span', { style: { marginLeft: 6, padding: '0 6px', fontSize: 12, background: '#faad14', color: '#fff', borderRadius: 2 } }, badge));
			return React.createElement('div', { key: label, style: { display: 'flex', alignItems: 'center', gap: 8 } }, React.createElement('span', { style: kvLabelStyle }, label), React.createElement('span', { style: kvValueStyle }, valNode));
		};
		var modelParamRowStyle = { display: 'flex', gap: 24, marginBottom: 16 };
		var fourColRows = function (nodes) {
			var out = [];
			for (var i = 0; i < nodes.length; i += 4) {
				var rowCells = [];
				for (var j = 0; j < 4; j++) {
					var idx = i + j;
					rowCells.push(React.createElement('div', { key: idx, style: gridColStyle }, nodes[idx] || null));
				}
				out.push(React.createElement('div', { key: i, style: modelParamRowStyle }, rowCells));
			}
			return out;
		};
		var maintenanceTableData = [
			{ key: '1', no: 1, item: '变速器油', kmCycle: '60000', monthCycle: '24', labor: '0', material: '571', total: '571', lastKm: '' },
			{ key: '2', no: 2, item: '变速器油', kmCycle: '60000', monthCycle: '24', labor: '0', material: '571', total: '571', lastKm: '' },
			{ key: '3', no: 3, item: '变速器油', kmCycle: '60000', monthCycle: '24', labor: '0', material: '571', total: '571', lastKm: '5000' },
			{ key: '4', no: 4, item: '变速器油', kmCycle: '60000', monthCycle: '24', labor: '0', material: '571', total: '571', lastKm: '5000' },
			{ key: '5', no: 5, item: '变速器油', kmCycle: '60000', monthCycle: '24', labor: '0', material: '571', total: '571', lastKm: '5000' }
		];
		var maintenanceColumns = [
			{ title: '序号', dataIndex: 'no', key: 'no', width: 60 },
			{ title: '养护项目', dataIndex: 'item', key: 'item', width: 120 },
			{ title: '保养公里周期(km)', dataIndex: 'kmCycle', key: 'kmCycle', width: 140 },
			{ title: '保养时间周期(月)', dataIndex: 'monthCycle', key: 'monthCycle', width: 130 },
			{ title: '工时费(元)', dataIndex: 'labor', key: 'labor', width: 100 },
			{ title: '材料费(元)', dataIndex: 'material', key: 'material', width: 100 },
			{ title: '合计', dataIndex: 'total', key: 'total', width: 80 },
			{ title: '上次保养公里数(KM)', dataIndex: 'lastKm', key: 'lastKm', width: 140 }
		];
		var modelParamContent = React.createElement('div', { style: tabContentCardStyle },
			React.createElement('div', { style: sectionTitleStyle }, React.createElement('span', { style: sectionIconStyle }), '型号参数'),
			React.createElement('div', { style: { marginBottom: 24 } }, fourColRows([
				kvItem('品牌', r.brand || '苏龙'),
				kvItem('型号', r.model || '海格牌KLQ5180XYKFCEV'),
				kvItem('车辆类型', r.vehicleType || '18吨双飞翼货车'),
				kvItem('燃料种类', '氢'),
				kvItem('整车尺寸', '5995mm x 2145mm x 3130mm'),
				kvItem('车牌颜色', '绿牌')
			])),
			React.createElement('div', { style: sectionTitleStyle }, React.createElement('span', { style: sectionIconStyle }), '轮胎情况'),
			React.createElement('div', { style: { marginBottom: 24 } }, fourColRows([
				kvItem('轮胎数量', '8'),
				kvItem('轮胎规格', '15/80R22.5')
			])),
			React.createElement('div', { style: sectionTitleStyle }, React.createElement('span', { style: sectionIconStyle }), '电气系统'),
			React.createElement('div', { style: { marginBottom: 24 } }, fourColRows([
				kvItem('电池类型', '磷酸铁锂'),
				kvItem('电池厂家', 'XXXXXXXXXXXXX企业名称'),
				kvItem('储电量', '100000 kWh'),
				kvItem('续航里程', '200 KM')
			])),
			React.createElement('div', { style: sectionTitleStyle }, React.createElement('span', { style: sectionIconStyle }), '供氢系统'),
			React.createElement('div', { style: { marginBottom: 24 } }, fourColRows([
				kvItem('氢瓶容量', 'xxx L'),
				kvItem('仪表盘模式', 'MPa'),
				kvItem('续航里程', '1000 KM'),
				kvItem('供氢系统厂家', 'XXXXXXXX企业')
			])),
			React.createElement('div', { style: sectionTitleStyle }, React.createElement('span', { style: sectionIconStyle }), '其他系统'),
			React.createElement('div', { style: { marginBottom: 24 } }, fourColRows([
				kvItem('冷机生产企业', 'XXXXXXXX企业'),
				kvItem('电堆生产企业', 'XXXXXXXX企业')
			])),
			React.createElement('div', { style: sectionTitleStyle }, React.createElement('span', { style: sectionIconStyle }), '保养参数'),
			React.createElement(Table, { size: 'small', rowKey: 'key', columns: maintenanceColumns, dataSource: maintenanceTableData, pagination: false })
		);
		var detailTabItems = [
			{ key: '型号参数', label: '型号参数', children: modelParamContent },
			{ key: '后装设备', label: '后装设备', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('后装设备列表（原型占位）')) },
			{ key: '证照信息', label: '证照信息', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('证照信息（原型占位）')) },
			{ key: '租赁记录', label: '租赁记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('租赁记录（原型占位）')) },
			{ key: '保险记录', label: '保险记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('保险记录（原型占位）')) },
			{ key: '维修记录', label: '维修记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('维修记录（原型占位）')) },
			{ key: '事故记录', label: '事故记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('事故记录（原型占位）')) },
			{ key: '故障记录', label: '故障记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('故障记录（原型占位）')) },
			{ key: '违章记录', label: '违章记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('违章记录（原型占位）')) },
			{ key: '异动记录', label: '异动记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('异动记录（原型占位）')) },
			{ key: '调拨记录', label: '调拨记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('调拨记录（原型占位）')) },
			{ key: '整备记录', label: '整备记录', children: React.createElement('div', { style: tabContentCardStyle }, tabContent('整备记录（原型占位）')) }
		];
		return React.createElement(App, null,
			React.createElement('div', { style: layoutStyle },
				React.createElement(Breadcrumb, {
					style: { marginBottom: 16 },
					items: [
						{ title: '运维管理' },
						{ title: React.createElement('a', { onClick: backToList, style: { color: '#1890ff' } }, '车辆管理') },
						{ title: '车辆详情' }
					]
				}),
				React.createElement('div', { style: detailCardStyle },
					React.createElement('div', { style: { fontSize: 16, fontWeight: 600, color: 'rgba(0,0,0,0.85)', marginBottom: 24 } }, '车辆详情'),
					React.createElement('div', { style: { display: 'flex', alignItems: 'center', gap: 12, marginBottom: 24 } },
						React.createElement('span', { style: { width: 8, height: 8, borderRadius: 4, backgroundColor: r.onlineStatus === '在线' ? '#52c41a' : '#d9d9d9', flexShrink: 0 } }),
						React.createElement('span', { style: { fontSize: 16, fontWeight: 600, color: 'rgba(0,0,0,0.85)' } }, r.plateNo || '-'),
						React.createElement(Button, { type: 'primary', size: 'small' }, r.operateStatus || '租赁')
					),
					React.createElement('div', { style: { marginBottom: 24 } }, rows),
					React.createElement('div', { style: { textAlign: 'center', paddingTop: 16, marginTop: 8, borderTop: '1px solid #f0f0f0' } },
						React.createElement(Button, { type: 'link', size: 'small', onClick: function () { _detailCardExpanded[1](!_detailCardExpanded[0]); } }, _detailCardExpanded[0] ? '收起' : '展开')
					)
				),
				React.createElement('div', { style: Object.assign({}, detailCardStyle, { marginTop: 24 }) },
					React.createElement(Tabs, {
						activeKey: _detailTab[0],
						onChange: function (key) { _detailTab[1](key); },
						items: detailTabItems
					})
				)
			)
		);
	}

	var requirementText = '# 车辆管理\n一个「车辆资产管理」后台的「车辆管理」模块，功能从上到下依次为：\n\n1.面包屑：\n运维管理-车辆管理\n\n2.筛选：\n2.1.运营城市：地区选择器，支持省-市2级地区选择；\n2.2.车辆类型：选择器，根据车辆类型表拉取；\n2.3.品牌：选择器，根据型号参数表拉取品牌字段；\n2.4.型号：选择器，根据型号参数表拉取型号字段；\n2.5.客户名称：选择器，根据租赁合同/自营合同对应客户名称拉取，并包含无；\n2.6.归属业务部门：选择器，根据租赁合同/自营合同对应归属业务部门拉取，并包含无；\n2.7.合同编号：选择器，支持输入框内输入内容模糊匹配选项；\n2.8.登记所有权：选择器，支持输入框内输入内容模糊匹配选项；\n\n3.列表：\n列表左上角为车牌号筛选框，输入车牌号可快速筛选列表内记录；右侧按钮为导出（联动多选）、批量导入，字段依次为运营城市、车辆识别代号、车牌号、车辆编号、车辆类型、品牌、型号、车身颜色、归属停车场、客户名称、业务部门、业务负责人、运营状态、库位状态、出库状态、预占状态、整备状态、过户状态、维修状态、证照状态、报废状态、登记所有权、在线状态、出厂年份、行驶公里数、采购入库时间、行驶证注册日期、行驶证检验有效期、上次交车时间、上次交车里程（KM）、上次还车时间、上次还车里程（KM）、强制报废日期、合同编号、当前位置、GPS最后上传时间、操作；\n3.1.运营城市：列固定在左侧，车辆实际运营城市，通过GPS当前位置获取，只显示至省-市2级；\n3.2.车辆识别代号：列固定在左侧，显示车辆识别代号（VIN码），为唯一值，采购、外部租赁等方式录入的车架号与系统现有车架号不能重复，导入亦然；\n3.3.车牌号：列固定在左侧，显示车牌号，主要通过上牌管理功能录入；\n3.4.车辆编号：显示车辆编号，主要由旧版迁移数据获取（这批车在港口需要单独以编号记录），其他车辆无此需求；\n3.5.车辆类型：显示车辆对应车辆类型，由车辆类型表中获取；\n3.6.品牌：显示车辆对应品牌，由型号参数表-品牌字段获取；\n3.7.型号：显示车辆对应型号，由型号参数表-型号字段获取；\n3.8.车身颜色：显示车辆对应颜色，由用户采购/外部租赁车辆合同时填写车身颜色（旧版迁移数据）字段获取；\n3.9.归属停车场：显示车辆归属停车场，交车出去租赁给客户的车辆显示为-，还车或发生异动时，根据运维记录，记录最后停放的停车场，停车场从停车场表中获取；\n3.10.客户名称：显示车辆租赁/自营合同发生时，该合同对应客户名称；\n3.11.业务部门：显示车辆租赁/自营合同发生时，该合同对应业务部门；\n3.12.业务负责人：显示车辆租赁/自营合同发生时，该合同对应业务负责人；\n3.13.运营状态：分为待运营、库存、租赁、自营、退出运营\n3.14.库位状态：分为新车入库-待验车、新车入库-证照办理、库存车-可交付车、库存车-不可交付车、库存车-呆滞车、已交付车-租赁交车、已交付车-自营交车、已交付车-替换交车、退出运营-报废车、退出运营-三方退租车、退出运营-过户售车；\n3.15.出库状态：分为异动出库、调拨出库、展示出库、租赁交车、自营交车、替换交车、过户售车、外租退车、报废出库、无；\n3.16.预占状态：331前占位，该功能331后迭代；\n3.17.整备状态：分为待整备、整备中、正常、无；\n3.18.过户状态：分为过户中、内部过户完成、销售过户完成、无；\n3.19.维修状态：分为待服务站接单、维修中、正常；\n3.20.证照状态：分为正常、异常；\n3.21.报废状态：分为报废中、已报废、无；\n3.22.登记所有权：行驶证对应所有人；\n3.23.在线状态：分为在线、离线，显示GPS在线状态，根据实际对接设备取状态；\n3.24.出厂年份：格式为YYYY，根据车辆采购合同时记录的出厂年份获取；\n3.25.行驶公里数（KM）：精确至2位小数，根据最近一次交车/还车/备车/异动/调拨记录时记录的行驶公里数获取；\n3.26.采购入库时间：格式为YYYY-MM-DD，根据采购合同时，采购完成车辆验车单提交时的时间；\n3.27.行驶证注册日期：格式为YYYY-MM-DD，根据上牌管理中，最后一次上传行驶证时的行驶证注册日期获取；\n3.28.行驶证检验有效期：根据行驶证（副联）中，检验记录中检验有效期获取；\n3.29.上次交车时间：格式为YYYY-MM-DD，根据最近一次交车记录完成时间获取；\n3.30.上次交车里程（KM）：精确至2位小数，根据最近一次交车记录中记录的里程获取；\n3.31.上次还车日期：格式为YYYY-MM-DD，根据最近一次还车记录完成时间获取；\n3.32.上次还车里程（KM）：精确至2位小数，根据最近一次还车记录中记录的里程获取；\n3.33.强制报废日期：格式为YYYY-MM-DD，根据行驶证（副联）中强制报废期获取；\n3.34.合同编号：显示当前租赁/自营合同合同编号，如无则显示为-；\n3.35.当前位置：根据车辆GPS当前定位获取，格式为xxx省xx市xx区/县xxxxx路xxxxx号xxxxxx\n3.36.GPS最后上传时间：格式为YYYY-MM-DD HH:MM，显示车辆GPS最后一次获取时间\n3.37.操作：操作列固定在右侧，显示查看、更多，悬浮更多时，显示车辆上牌、车辆过户、车辆异动、车辆调拨、车辆报废、车辆年审、车辆出售、故障提报；\n3.37.1.查看，点击跳转车辆详情页；\n3.38.2.车辆上牌，点击后上传照片，OCR识别过程中卡片提示：识别中，请勿关闭页面，之后弹出卡片，标题为确认上牌信息，左侧为行驶证照片，右侧为车辆识别代号（输入框，根据行驶证照片反写，可编辑）与车牌号（输入框，根据行驶证照片反写，可编辑），下侧为取消和确认按钮，点击确认，判断车辆识别代码与车牌号是否一致，如不一致提示车辆识别代号与该车辆不匹配，如一致则更新车牌号和行驶证照片（具体参考车辆业务-上牌管理）；\n3.38.3.车辆过户：\n3.38.4.车辆异动：\n3.38.5.车辆调拨：\n3.38.6.车辆报废：\n3.38.7.车辆年审：\n3.38.8.车辆出售；\n3.38.9.故障提报：';

	return React.createElement(App, null,
		React.createElement('div', { style: layoutStyle },
			React.createElement('div', { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 16 } },
				React.createElement(Breadcrumb, { items: [{ title: '运维管理' }, { title: '车辆管理' }] }),
				React.createElement(Button, { type: 'link', onClick: function () { _requirementModalVisible[1](true); } }, '查看需求说明')
			),

			React.createElement('div', { style: { marginBottom: 16, display: 'flex', gap: 24, alignItems: 'flex-start' } },
				React.createElement('div', {
					style: {
						display: 'grid',
						gridTemplateColumns: '1fr 1fr 1fr',
						gap: '16px 24px',
						alignItems: 'start',
						flex: 1,
						minWidth: 0
					}
				}, (function () {
					var filterItems = [
						React.createElement('div', { key: 'region', style: filterItemStyle }, React.createElement('div', { style: filterLabelStyle }, '运营城市'), React.createElement(Cascader, { options: regionOptions, placeholder: '请选择', style: filterControlStyle, value: _region[0].length ? _region[0] : undefined, onChange: function (v) { _region[1](v || []); } })),
						React.createElement('div', { key: 'type', style: filterItemStyle }, React.createElement('div', { style: filterLabelStyle }, '车辆类型'), React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, options: vehicleTypeOptions, value: _vehicleType[0], onChange: _vehicleType[1], allowClear: true })),
						React.createElement('div', { key: 'brand', style: filterItemStyle }, React.createElement('div', { style: filterLabelStyle }, '品牌'), React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, options: brandOptions, value: _brand[0], onChange: _brand[1], allowClear: true })),
						React.createElement('div', { key: 'model', style: filterItemStyle }, React.createElement('div', { style: filterLabelStyle }, '型号'), React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, options: modelOptions, value: _model[0], onChange: _model[1], allowClear: true })),
						React.createElement('div', { key: 'customer', style: filterItemStyle }, React.createElement('div', { style: filterLabelStyle }, '客户名称'), React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, options: customerOptions, value: _customer[0], onChange: _customer[1], allowClear: true })),
						React.createElement('div', { key: 'dept', style: filterItemStyle }, React.createElement('div', { style: filterLabelStyle }, '归属业务部门'), React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, options: departmentOptions, value: _department[0], onChange: _department[1], allowClear: true })),
						React.createElement('div', { key: 'contract', style: filterItemStyle }, React.createElement('div', { style: filterLabelStyle }, '合同编号'), React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, options: contractOptions, value: _contractNo[0], onChange: _contractNo[1], allowClear: true, showSearch: true, filterOption: function (input, opt) { return (opt.label || '').toString().toLowerCase().indexOf((input || '').toLowerCase()) !== -1; } })),
						React.createElement('div', { key: 'ownership', style: filterItemStyle }, React.createElement('div', { style: filterLabelStyle }, '登记所有权'), React.createElement(Select, { placeholder: '请选择', style: filterControlStyle, options: ownershipOptions, value: _ownership[0], onChange: _ownership[1], allowClear: true, showSearch: true, filterOption: function (input, opt) { return (opt.label || '').toString().toLowerCase().indexOf((input || '').toLowerCase()) !== -1; } }))
					];
					var limit = _filterExpanded[0] ? 8 : 6;
					var out = [];
					for (var i = 0; i < limit && i < filterItems.length; i++) {
						out.push(filterItems[i]);
					}
					return out;
				})()),
				React.createElement('div', { style: { display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 8, flexShrink: 0 } },
					React.createElement(Button, { type: 'primary', onClick: function () { message.info('查询（原型）'); } }, '查询'),
					React.createElement(Button, { onClick: function () {
						_region[1]([]);
						_vehicleType[1](undefined);
						_brand[1](undefined);
						_model[1](undefined);
						_customer[1](undefined);
						_department[1](undefined);
						_contractNo[1](undefined);
						_ownership[1](undefined);
					} }, '重置'),
					React.createElement(Button, { type: 'link', size: 'small', onClick: function () { _filterExpanded[1](!_filterExpanded[0]); } }, _filterExpanded[0] ? '收起' : '展开')
				)
			),

			React.createElement('div', { style: toolbarStyle },
				React.createElement(Input.Search, {
					placeholder: '输入车牌号筛选',
					allowClear: true,
					value: _plateFilter[0],
					onChange: onPlateFilterChange,
					onSearch: onPlateFilterChange,
					style: { width: 220 }
				}),
				React.createElement(Space, null,
					React.createElement(Button, { onClick: handleExport }, '导出'),
					React.createElement(Button, { onClick: handleBatchImport }, '批量导入')
				)
			),

			React.createElement(React.Fragment, null,
				React.createElement('style', null, tableSingleLineStyle),
				React.createElement('div', { className: 'vehicle-mgmt-table' },
					React.createElement(Table, {
						rowKey: 'id',
						columns: columns,
						dataSource: dataSource,
						rowSelection: rowSelection,
						scroll: { x: 3800 },
						size: 'small',
						pagination: { showSizeChanger: true, showQuickJumper: true, showTotal: function (t) { return '共 ' + t + ' 条'; } }
					})
				)
			),

			// 车辆上牌：上传/识别中
			React.createElement(Modal, {
				title: '上传行驶证',
				open: _uploadModalVisible[0],
				onCancel: closeUploadModal,
				footer: [
					React.createElement(Button, { key: 'cancel', onClick: closeUploadModal }, '取消'),
					React.createElement(Button, { key: 'ok', type: 'primary', onClick: startOcrThenConfirm }, '开始识别')
				]
			}, React.createElement(Upload.Dragger, { accept: 'image/*', multiple: false }, React.createElement('p', null, '点击或拖拽行驶证照片到此区域上传'))),

			React.createElement(Modal, {
				title: '识别中，请勿关闭页面',
				open: _ocrLoadingVisible[0],
				footer: null,
				closable: false,
				maskClosable: false
			}, React.createElement('div', { style: { textAlign: 'center', padding: '24px 0' } }, '正在识别行驶证信息...')),

			React.createElement(Modal, {
				title: '确认上牌信息',
				open: _confirmModalVisible[0],
				onCancel: closeConfirmModal,
				width: 640,
				footer: [
					React.createElement(Button, { key: 'cancel', onClick: closeConfirmModal }, '取消'),
					React.createElement(Button, { key: 'ok', type: 'primary', onClick: confirmPlate }, '确认')
				]
			}, React.createElement('div', { style: { display: 'flex', gap: 24 } },
				React.createElement('div', { style: { flex: '0 0 240px' } },
					React.createElement('div', { style: { marginBottom: 8, color: '#666' } }, '行驶证照片'),
					React.createElement('img', { src: 'https://picsum.photos/240/160', alt: '行驶证', style: { width: '100%', borderRadius: 8 } })
				),
				React.createElement('div', { style: { flex: 1 } },
					React.createElement('div', { style: { marginBottom: 12 } },
						React.createElement('span', { style: { marginRight: 8 } }, '车辆识别代号'),
						React.createElement(Input, {
							value: _plateForm[0].vin,
							onChange: function (e) { onPlateFormChange('vin', e.target.value); },
							placeholder: '根据行驶证反写，可编辑',
							style: { width: '100%' }
						})
					),
					React.createElement('div', { style: { marginBottom: 12 } },
						React.createElement('span', { style: { marginRight: 8 } }, '车牌号'),
						React.createElement(Input, {
							value: _plateForm[0].plateNo,
							onChange: function (e) { onPlateFormChange('plateNo', e.target.value); },
							placeholder: '根据行驶证反写，可编辑',
							style: { width: '100%' }
						})
					),
					_plateError[0] ? React.createElement('div', { style: { color: '#ff4d4f', fontSize: 12 } }, _plateError[0]) : null
				)
			)),
			React.createElement(Modal, {
				title: '需求说明',
				open: _requirementModalVisible[0],
				onCancel: function () { _requirementModalVisible[1](false); },
				width: 720,
				footer: React.createElement(Button, { onClick: function () { _requirementModalVisible[1](false); } }, '关闭')
			}, React.createElement('div', { style: { maxHeight: 560, overflow: 'auto', whiteSpace: 'pre-wrap', fontSize: 13, lineHeight: 1.6, color: 'rgba(0,0,0,0.85)' } }, requirementText))
		)
	);
};