ONE-OS/web端/业务管理/交车任务.jsx

// 【重要】必须使用 const Component 作为组件变量名
// 数字化资产ONEOS运管平台 - 业务管理 - 交车任务

const Component = function () {
	var useState = React.useState;
	var useMemo = React.useMemo;

	var antd = window.antd;
	var Breadcrumb = antd.Breadcrumb;
	var Card = antd.Card;
	var Table = antd.Table;
	var Select = antd.Select;
	var Input = antd.Input;
	var Button = antd.Button;
	var Space = antd.Space;
	var Popover = antd.Popover;
	var Modal = antd.Modal;
	var DatePicker = antd.DatePicker;
	var message = antd.message;
	var RangePicker = DatePicker.RangePicker;

	// 筛选条件
	var filterDeliveryTaskCode = useState(undefined);
	var filterContractCode = useState(undefined);
	var filterProjectName = useState(undefined);
	var filterCustomerName = useState(undefined);

	// 分页（主表）
	var pageState = useState(1);
	var pageSizeState = useState(10);
	var currentPage = pageState[0];
	var setCurrentPage = pageState[1];
	var pageSize = pageSizeState[0];
	var setPageSize = pageSizeState[1];

	// 主表展开：只展开一行
	var expandedRowKeysState = useState([]);
	var expandedRowKeys = expandedRowKeysState[0];
	var setExpandedRowKeys = expandedRowKeysState[1];

	// 子表交车数量气泡（只开一个）
	var deliveryPopoverOpen = useState(null);

	// 筛选展开（默认显示一行）
	var filterExpanded = useState(false);

	// 需求说明弹窗
	var reqSpecOpen = useState(false);
	// 激活弹窗：重新设置预计交车日期、开始计费日期
	var activateModalOpen = useState(false);
	var activateRecord = useState(null);
	var activatePlanRange = useState(null);
	var activateBillingDate = useState(null);

	function buildDeliveryTaskCode(contractCode, seq) {
		var suffix = 'JC' + ('0000' + String(seq != null ? seq : '')).slice(-4);
		return String(contractCode || '') + suffix;
	}

	function getDeliveryStatus(detailRecord) {
		var vehicles = (detailRecord && detailRecord.vehicles) || [];
		if (!vehicles.length) return '未交车';
		var allDelivered = vehicles.every(function (v) { return v && v.actualDeliveryDate; });
		return allDelivered ? '已交车' : '未交车';
	}

	// 模拟：主表按合同聚合，子表为交车任务
	var initialMainList = useMemo(function () {
		return [
			{
				contractCode: 'JXZL20260216YW101235A',
				projectName: '嘉兴氢能运输项目',
				customerName: '嘉兴某某物流有限公司',
				businessDept: '业务1部',
				businessPerson: '张经理',
				contractEffectiveDate: '2026-02-16',
				contractEndDate: '2027-02-15',
				children: [
					{
						seq: 1,
						planDeliveryDisplay: '2026-03-01至2026-03-05',
						deliveryCount: 2,
						vehicles: [
							{ brand: '东风', model: 'DFH1180', plateNo: '浙A12345', actualDeliveryDate: '2026-03-02', deliverer: '运维李' },
							{ brand: '福田', model: 'BJ1180', plateNo: '浙A23456', actualDeliveryDate: '2026-03-03', deliverer: '运维王' }
						],
						billingStartDate: '2026-03-01',
						needReturnCar: '需要',
						creator: '张经理',
						createdAt: '2026-02-20',
						enabled: true
					},
					{
						seq: 2,
						planDeliveryDisplay: '2026-03-08',
						deliveryCount: 1,
						vehicles: [{ brand: '重汽', model: 'ZZ1187', plateNo: '浙A34567', actualDeliveryDate: '', deliverer: '' }],
						billingStartDate: '2026-03-08',
						needReturnCar: '不需要',
						creator: '张经理',
						createdAt: '2026-02-22',
						enabled: false
					}
				]
			},
			{
				contractCode: 'SHZL20260210YW101200A',
				projectName: '上海物流租赁项目',
				customerName: '上海某某运输公司',
				businessDept: '业务2部',
				businessPerson: '李专员',
				contractEffectiveDate: '2026-02-10',
				contractEndDate: '2027-02-09',
				children: [
					{
						seq: 1,
						planDeliveryDisplay: '2026-03-10',
						deliveryCount: 1,
						vehicles: [{ brand: '解放', model: 'JH6', plateNo: '沪A30003', actualDeliveryDate: '2026-03-10', deliverer: '运维李' }],
						billingStartDate: '2026-03-10',
						needReturnCar: '不需要',
						creator: '李专员',
						createdAt: '2026-02-21',
						enabled: true
					}
				]
			},
			{
				contractCode: 'JXZL20260215YW101234A',
				projectName: '杭州城配租赁项目',
				customerName: '杭州某某租赁有限公司',
				businessDept: '业务3部',
				businessPerson: '王专员',
				contractEffectiveDate: '2026-02-15',
				contractEndDate: '2027-02-14',
				children: [
					{
						seq: 1,
						planDeliveryDisplay: '2026-02-28至2026-03-02',
						deliveryCount: 3,
						vehicles: [
							{ brand: '品牌A', model: '型号A1', plateNo: '浙A10001', actualDeliveryDate: '2026-02-28', deliverer: '运维李' },
							{ brand: '品牌B', model: '型号B1', plateNo: '浙B20002', actualDeliveryDate: '2026-03-01', deliverer: '运维王' },
							{ brand: '品牌C', model: '型号C1', plateNo: '浙C50003', actualDeliveryDate: '2026-03-02', deliverer: '运维赵' }
						],
						billingStartDate: '2026-02-28',
						needReturnCar: '需要',
						creator: '王专员',
						createdAt: '2026-02-18',
						enabled: true
					}
				]
			}
		];
	}, []);

	var mainListState = useState(initialMainList);
	var mainList = mainListState[0];
	var setMainList = mainListState[1];

	// 下拉 options（合同编码/项目/客户）
	var filterOptions = useMemo(function () {
		var codes = [];
		var deliveryTaskCodes = [];
		var projects = [];
		var customers = [];
		mainList.forEach(function (r) {
			if (r.contractCode && codes.indexOf(r.contractCode) === -1) codes.push(r.contractCode);
			if (r.projectName && projects.indexOf(r.projectName) === -1) projects.push(r.projectName);
			if (r.customerName && customers.indexOf(r.customerName) === -1) customers.push(r.customerName);
			(r.children || []).forEach(function (c) {
				var full = buildDeliveryTaskCode(r.contractCode, c.seq);
				if (full && deliveryTaskCodes.indexOf(full) === -1) deliveryTaskCodes.push(full);
			});
		});
		return {
			deliveryTaskCode: deliveryTaskCodes.map(function (v) { return { value: v, label: v }; }),
			contractCode: codes.map(function (v) { return { value: v, label: v }; }),
			projectName: projects.map(function (v) { return { value: v, label: v }; }),
			customerName: customers.map(function (v) { return { value: v, label: v }; })
		};
	}, [mainList]);

	function selectFuzzy(input, opt) {
		return (opt.label || '').toString().toLowerCase().indexOf((input || '').toLowerCase()) !== -1;
	}

	function resetFilters() {
		filterDeliveryTaskCode[1](undefined);
		filterContractCode[1](undefined);
		filterProjectName[1](undefined);
		filterCustomerName[1](undefined);
		setCurrentPage(1);
	}

	function handleQuery() {
		setCurrentPage(1);
		message.info('已按筛选条件查询');
	}

	function goView(record) {
		message.info('查看交车任务（原型）');
	}

	function goEdit(record) {
		message.info('编辑交车任务（原型）');
	}

	function toggleEnable(record) {
		if (record.enabled) {
			Modal.confirm({
				title: '确认挂起',
				content: '挂起交车任务会释放清空该交车任务车牌号以释放车辆，是否确定',
				okText: '确定',
				cancelText: '取消',
				onOk: function () {
					var parent = record._parentRecord;
					setMainList(function (prev) {
						return prev.map(function (p) {
							if (!parent || p.contractCode !== parent.contractCode) return p;
							var next = {};
							for (var k in p) next[k] = p[k];
							next.children = (p.children || []).map(function (c) {
								if (c.seq !== record.seq) return c;
								var vehicles = (c.vehicles || []).map(function (v) {
									return Object.assign({}, v, { plateNo: '', actualDeliveryDate: '', deliverer: '' });
								});
								return Object.assign({}, c, { enabled: false, vehicles: vehicles });
							});
							return next;
						});
					});
					message.success('已挂起');
				}
			});
		} else {
			activateRecord[1](record);
			activatePlanRange[1](null);
			activateBillingDate[1](null);
			activateModalOpen[1](true);
		}
	}

	function handleActivateConfirm() {
		var record = activateRecord[0];
		var planRange = activatePlanRange[0];
		var billingDate = activateBillingDate[0];
		if (!record) { activateModalOpen[1](false); return; }
		var toDateStr = function (d) { return d && typeof d.format === 'function' ? d.format('YYYY-MM-DD') : (d && typeof d === 'string' ? d : ''); };
		var planStr = planRange && planRange.length >= 1 && planRange[0]
			? (planRange.length >= 2 && planRange[1] ? toDateStr(planRange[0]) + '至' + toDateStr(planRange[1]) : toDateStr(planRange[0]))
			: '';
		var billingStr = billingDate ? toDateStr(billingDate) : '';
		if (!planStr || !billingStr) { message.warning('请填写预计交车日期和开始计费日期'); return; }
		var parent = record._parentRecord;
		setMainList(function (prev) {
			return prev.map(function (p) {
				if (!parent || p.contractCode !== parent.contractCode) return p;
				var next = {};
				for (var k in p) next[k] = p[k];
				next.children = (p.children || []).map(function (c) {
					if (c.seq !== record.seq) return c;
					return Object.assign({}, c, { enabled: true, planDeliveryDisplay: planStr, billingStartDate: billingStr });
				});
				return next;
			});
		});
		activateModalOpen[1](false);
		activateRecord[1](null);
		message.success('已激活');
	}

	// 筛选后的主表
	var filteredMainList = useMemo(function () {
		var list = mainList.slice();
		var contractCode = filterContractCode[0];
		var projectName = filterProjectName[0];
		var customerName = filterCustomerName[0];
		var deliveryTaskCode = filterDeliveryTaskCode[0];

		if (contractCode) list = list.filter(function (r) { return r.contractCode === contractCode; });
		if (projectName) list = list.filter(function (r) { return r.projectName === projectName; });
		if (customerName) list = list.filter(function (r) { return r.customerName === customerName; });

		// 交车任务编码：选择器（同合同编码交互），筛选时命中任一子表编码即可
		if (deliveryTaskCode) {
			list = list.filter(function (r) {
				var children = r.children || [];
				return children.some(function (c) {
					return buildDeliveryTaskCode(r.contractCode, c.seq) === deliveryTaskCode;
				});
			});
		}

		return list;
	}, [mainList, filterContractCode[0], filterProjectName[0], filterCustomerName[0], filterDeliveryTaskCode[0]]);

	// 主表 dataSource 去掉 children，避免 Table 误用 treeData 产生空白行
	var mainTableDataSource = useMemo(function () {
		return filteredMainList.map(function (r) {
			var o = {};
			for (var k in r) if (k !== 'children') o[k] = r[k];
			o._detailList = r.children || [];
			return o;
		});
	}, [filteredMainList]);

	var paginatedMain = useMemo(function () {
		var start = (currentPage - 1) * pageSize;
		return mainTableDataSource.slice(start, start + pageSize);
	}, [mainTableDataSource, currentPage, pageSize]);

	function renderDeliveryPopover(record) {
		var vehicles = record.vehicles || [];
		var parentCode = (record._parentRecord && record._parentRecord.contractCode) || '';
		var key = parentCode + '-' + (record.seq != null ? record.seq : '');

		var listStyle = { width: '100%', borderCollapse: 'collapse', fontSize: 13 };
		var thStyle = { padding: '6px 10px', textAlign: 'left', borderBottom: '1px solid #f0f0f0', backgroundColor: '#fafafa', fontWeight: 600 };
		var tdStyle = { padding: '6px 10px', borderBottom: '1px solid #f0f0f0' };

		var content = vehicles.length === 0
			? React.createElement('div', { style: { padding: 8 } }, '—')
			: React.createElement('div', { style: { padding: 0, minWidth: 520 } },
				React.createElement('table', { style: listStyle },
					React.createElement('thead', null,
						React.createElement('tr', null,
							React.createElement('th', { style: thStyle }, '品牌'),
							React.createElement('th', { style: thStyle }, '型号'),
							React.createElement('th', { style: thStyle }, '车牌号'),
							React.createElement('th', { style: thStyle }, '实际交车日期'),
							React.createElement('th', { style: thStyle }, '交车人')
						)
					),
					React.createElement('tbody', null,
						vehicles.map(function (v, i) {
							return React.createElement('tr', { key: i },
								React.createElement('td', { style: tdStyle }, v.brand || '—'),
								React.createElement('td', { style: tdStyle }, v.model || '—'),
								React.createElement('td', { style: tdStyle }, v.plateNo || '—'),
								React.createElement('td', { style: tdStyle }, v.actualDeliveryDate ? v.actualDeliveryDate : '-'),
								React.createElement('td', { style: tdStyle }, v.deliverer ? v.deliverer : '-')
							);
						})
					)
				)
			);

		var count = record.deliveryCount != null ? Number(record.deliveryCount) : 0;
		return React.createElement(Popover, {
			content: content,
			title: '车辆明细',
			trigger: 'click',
			open: deliveryPopoverOpen[0] === key,
			onOpenChange: function (open) { deliveryPopoverOpen[1](open ? key : null); }
		}, React.createElement(Button, { type: 'link', size: 'small', style: { padding: 0 } }, (isNaN(count) ? 0 : count) + '辆'));
	}

	var layoutStyle = { padding: '16px 24px', background: '#f5f5f5', minHeight: '100vh' };
	var cardStyle = { marginBottom: 16 };
	var filterLabelStyle = { marginBottom: 6, fontSize: 14, color: 'rgba(0,0,0,0.65)' };
	var filterItemStyle = { marginBottom: 12 };
	var filterControlStyle = { width: '100%' };

	var expandColumnWidth = 48;

	var mainColumns = [
		{ title: '合同编码', dataIndex: 'contractCode', key: 'contractCode', width: 200, ellipsis: true, render: function (v) { return v || '—'; } },
		{ title: '项目名称', dataIndex: 'projectName', key: 'projectName', width: 160, ellipsis: true, render: function (v) { return v || '—'; } },
		{ title: '客户名称', dataIndex: 'customerName', key: 'customerName', width: 180, ellipsis: true, render: function (v) { return v || '—'; } },
		{ title: '业务部门', dataIndex: 'businessDept', key: 'businessDept', width: 110, render: function (v) { return v || '—'; } },
		{ title: '业务负责人', dataIndex: 'businessPerson', key: 'businessPerson', width: 110, render: function (v) { return v || '—'; } },
		{ title: '合同生效日期', dataIndex: 'contractEffectiveDate', key: 'contractEffectiveDate', width: 120, render: function (v) { return v || '—'; } },
		{ title: '合同结束日期', dataIndex: 'contractEndDate', key: 'contractEndDate', width: 120, render: function (v) { return v || '—'; } }
	];

	var subColumns = [
		{
			title: '交车任务编码',
			key: 'deliveryTaskCode',
			width: 260,
			ellipsis: true,
			render: function (_, record) {
				var p = record._parentRecord;
				return buildDeliveryTaskCode(p && p.contractCode, record.seq) || '—';
			}
		},
		{ title: '任务状态', key: 'taskStatus', width: 88, render: function (_, record) { return record.enabled !== false ? '激活' : '挂起'; } },
		{ title: '交车状态', key: 'deliveryStatus', width: 100, render: function (_, record) { return getDeliveryStatus(record); } },
		{ title: '预计交车日期', dataIndex: 'planDeliveryDisplay', key: 'planDeliveryDisplay', width: 160, render: function (v) { return v || '—'; } },
		{ title: '交车数量', key: 'deliveryCount', width: 100, render: function (_, record) { return renderDeliveryPopover(record); } },
		{ title: '开始计费日期', dataIndex: 'billingStartDate', key: 'billingStartDate', width: 120, render: function (v) { return v || '—'; } },
		{ title: '创建人', dataIndex: 'creator', key: 'creator', width: 100, render: function (v) { return v || '—'; } },
		{ title: '创建时间', dataIndex: 'createdAt', key: 'createdAt', width: 110, render: function (v) { return v || '—'; } },
		{
			title: '操作',
			key: 'action',
			width: 200,
			fixed: 'right',
			render: function (_, record) {
				return React.createElement(Space, { size: 'small' },
					React.createElement(Button, { type: 'link', size: 'small', onClick: function () { goView(record); } }, '查看'),
					React.createElement(Button, { type: 'link', size: 'small', onClick: function () { goEdit(record); } }, '编辑'),
					React.createElement(Button, { type: 'link', size: 'small', onClick: function () { toggleEnable(record); } }, record.enabled ? '挂起' : '激活')
				);
			}
		}
	];

	function expandRowRender(record) {
		var rows = (record._detailList || []).map(function (r) {
			var o = {};
			for (var k in r) o[k] = r[k];
			o._parentRecord = record;
			return o;
		});

		return React.createElement('div', { style: { marginBottom: 0, paddingLeft: expandColumnWidth, boxSizing: 'border-box' } },
			React.createElement(Table, {
				rowKey: function (r) { return (record.contractCode || '') + '-' + (r.seq != null ? r.seq : Math.random()); },
				columns: subColumns,
				dataSource: rows,
				pagination: false,
				size: 'small',
				bordered: true,
				scroll: { x: 1380 }
			})
		);
	}

	var reqSpecText =
		"交车任务\n" +
		"一个「数字化资产ONEOS运管平台」中的「交车任务」模块\n" +
		"1.面包屑：\n" +
		"1.1.业务管理-交车任务\n\n" +
		"2.筛选：\n" +
		"支持通过合同编码、项目名称、客户名称进行筛选，右侧为查询、重置按钮；\n" +
		"2.1.交车任务编码：选择器，默认所有交车任务编码，提示信息为：请输入或选择交车任务编码，支持从输入框输入内容进行模糊搜索，下拉显示结果；\n" +
		"          编码规则为：[合同编码][交车任务编码]，主要用于后期与用友YS系统打通时获取财务收款及发票相关数据；\n" +
		"          前缀为合同编码，后缀为交车任务编码，规则为：JC+4位编号，为该合同下第x份交车任务，例如：JC0001为该合同下第1份交车任务，依次类推；\n" +
		"          例如：JXZL20260216YW101235AJC0001即为JXZL20260216YW101235A合同下第1份账单；\n" +
		"2.2.合同编码：选择器，默认为所有合同；提示信息为：请输入或选择合同编码，支持从输入框输入内容进行模糊搜索，下拉显示结果；\n" +
		"2.3.项目名称：选择器，默认为所有项目；提示信息为：请输入或选择项目名称，支持从输入框输入内容进行模糊搜索，下拉显示结果；\n" +
		"2.4.客户名称：选择器，默认为所有客户；提示信息为：请输入或选择客户名称，支持从输入框输入内容进行模糊搜索，下拉显示结果；\n" +
		"2.5.查询：点击查询，根据单个或多个筛选条件（且）联动表格进行查询；\n" +
		"2.6.重置：点击清空查询条件至默认；\n\n" +
		"3.列表：\n" +
		"#嵌套子表格，分为主表和子表，右侧为新增按钮；\n" +
		"3.1.主表展示以下内容：合同编码、项目名称、客户名称、业务部门、业务负责人、合同生效日期、合同结束日期；\n" +
		"3.1.1合同编码：显示对应合同编码；\n" +
		"3.1.2.项目名称：显示对应项目名称；\n" +
		"3.1.3.客户名称：显示对应客户名称；\n" +
		"3.1.4.业务部门：显示业务部门名称；\n" +
		"3.1.5.业务负责人：显示业务负责人名称；\n" +
		"3.1.6.合同生效日期：显示合同生效日期，格式为：YYYY-MM-DD；\n" +
		"3.1.7.合同结束日期：显示合同结束日期，格式为：YYYY-MM-DD；\n\n" +
		"3.2.子表展示以下内容:交车任务编码、预计交车日期、交车数量、开始计费日期、是否需要退还车、创建人、创建时间；\n" +
		"3.2.1.交车任务编码：编码规则为：[合同编码][交车任务编码]，主要用于后期与用友YS系统打通时获取财务收款及发票相关数据；\n" +
		"          前缀为合同编码，后缀为交车任务编码，规则为：JC+4位编号，为该合同下第x份交车任务，例如：JC0001为该合同下第1份交车任务，依次类推；\n" +
		"          例如：JXZL20260216YW101235AJC0001即为JXZL20260216YW101235A合同下第1份账单；\n" +
		"3.2.2.任务状态：显示挂起/激活，挂起的数据操作列对应激活、激活的数据操作列对应挂起；\n" +
		"3.2.3.交车状态：显示交车任务状态，分为：已交车、未交车；\n" +
		"3.2.4.预计交车日期：显示该交车任务预计交车日期，可能是某天，也可能是开始-结束时间段，格式分别为：YYYY-MM-DD、YYYY-MM-DD至YYYY-MM-DD/；\n" +
		"3.2.5.交车数量：显示实际交车数量，格式为：xx辆，点击数量弹出气泡卡片，列表显示：品牌、型号、车牌号、实际交车日期、交车人，其中实际交车日期和交车人没交车时显示为-；\n" +
		"3.2.6.开始计费日期：显示该交车任务开始计费日期，格式为：YYYY-MM-DD；\n" +
		"3.2.7.创建人：显示交车任务的创建人用户姓名；\n" +
		"3.2.8.创建时间：显示交车任务的创建时间，格式为YYYY-MM-DD；\n" +
		"3.2.9.操作：支持查看、编辑、挂起/激活；\n" +
		"      3.2.9.1.查看：跳转交车任务-查看页；\n" +
		"      3.2.9.2.编辑：跳转交车任务-编辑页，已交车的任务不支持编辑；\n" +
		"      3.2.9.3.挂起/激活：点击挂起，进行二次确认提示，提示文案：挂起交车任务会释放清空该交车任务车牌号以释放车辆，是否确定？；点击激活，弹框中重新设置预计交车日期、开始计费日期，设置成功后提示交车任务激活成功；\n\n" +
		"4.列表右下方为分页功能，支持单页显示条目选择；";

	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: '交车任务' }] }),
			React.createElement(Button, { type: 'link', style: { padding: 0 }, onClick: function () { reqSpecOpen[1](true); } }, '查看需求说明')
		),
		React.createElement(Card, { title: '筛选', style: cardStyle },
			React.createElement('div', { style: { display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: '16px 24px', alignItems: 'start' } },
				React.createElement('div', { style: filterItemStyle },
					React.createElement('div', { style: filterLabelStyle }, '交车任务编码'),
					React.createElement(Select, {
						placeholder: '请输入交车任务编码',
						allowClear: true,
						showSearch: true,
						style: filterControlStyle,
						value: filterDeliveryTaskCode[0],
						onChange: function (v) { filterDeliveryTaskCode[1](v); },
						options: filterOptions.deliveryTaskCode,
						filterOption: selectFuzzy
					})
				),
				React.createElement('div', { style: filterItemStyle },
					React.createElement('div', { style: filterLabelStyle }, '合同编码'),
					React.createElement(Select, {
						placeholder: '请输入合同编码',
						allowClear: true,
						showSearch: true,
						style: filterControlStyle,
						value: filterContractCode[0],
						onChange: function (v) { filterContractCode[1](v); },
						options: filterOptions.contractCode,
						filterOption: selectFuzzy
					})
				),
				React.createElement('div', { style: filterItemStyle },
					React.createElement('div', { style: filterLabelStyle }, '项目名称'),
					React.createElement(Select, {
						placeholder: '请输入项目名称',
						allowClear: true,
						showSearch: true,
						style: filterControlStyle,
						value: filterProjectName[0],
						onChange: function (v) { filterProjectName[1](v); },
						options: filterOptions.projectName,
						filterOption: selectFuzzy
					})
				),
				filterExpanded[0] ? React.createElement('div', { style: filterItemStyle },
					React.createElement('div', { style: filterLabelStyle }, '客户名称'),
					React.createElement(Select, {
						placeholder: '请输入客户名称',
						allowClear: true,
						showSearch: true,
						style: filterControlStyle,
						value: filterCustomerName[0],
						onChange: function (v) { filterCustomerName[1](v); },
						options: filterOptions.customerName,
						filterOption: selectFuzzy
					})
				) : null
			),
			React.createElement('div', { style: { display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 16 } },
				React.createElement(Button, { type: 'link', onClick: function () { filterExpanded[1](!filterExpanded[0]); } }, filterExpanded[0] ? '收起' : '展开'),
				React.createElement(Button, { type: 'primary', onClick: handleQuery }, '查询'),
				React.createElement(Button, { onClick: resetFilters }, '重置')
			)
		),
		React.createElement(Card, {
			title: '交车任务',
			style: cardStyle,
			extra: React.createElement(Button, {
				type: 'primary',
				onClick: function () { message.info('请参照原型：业务管理-交车任务-新增交车任务'); }
			}, '新增')
		},
			React.createElement(Table, {
				rowKey: 'contractCode',
				columns: mainColumns,
				dataSource: paginatedMain,
				expandable: {
					expandedRowKeys: expandedRowKeys,
					onExpandedRowsChange: function (keys) { setExpandedRowKeys(keys && keys.length ? [keys[keys.length - 1]] : []); },
					expandedRowRender: expandRowRender,
					rowExpandable: function (record) { return record._detailList && record._detailList.length > 0; },
					columnWidth: expandColumnWidth
				},
				pagination: {
					current: currentPage,
					pageSize: pageSize,
					total: mainTableDataSource.length,
					showSizeChanger: true,
					showTotal: function (t) { return '共 ' + t + ' 条'; },
					pageSizeOptions: ['10', '20', '50', '100'],
					onChange: function (p, ps) { setCurrentPage(p); setPageSize(ps); },
					onShowSizeChange: function () { setCurrentPage(1); }
				},
				size: 'middle',
				bordered: true,
				scroll: { x: 1110 }
			})
		)
		,
		React.createElement(Modal, {
			title: '激活交车任务',
			open: activateModalOpen[0],
			onCancel: function () { activateModalOpen[1](false); activateRecord[1](null); },
			width: 520,
			okText: '确定',
			cancelText: '取消',
			onOk: handleActivateConfirm,
			destroyOnClose: true
		}, React.createElement('div', { style: { padding: '8px 0' } },
			React.createElement('div', { style: { marginBottom: 16 } },
				React.createElement('div', { style: { marginBottom: 6, fontSize: 14, color: 'rgba(0,0,0,0.65)' } }, '预计交车日期'),
				React.createElement(RangePicker, {
					style: { width: '100%' },
					format: 'YYYY-MM-DD',
					placeholder: ['请选择开始日期', '请选择结束日期（单日请选同一天）'],
					value: activatePlanRange[0],
					onChange: function (dates) { activatePlanRange[1](dates && dates.length === 2 ? dates : null); }
				}),
				React.createElement('div', { style: { marginTop: 4, fontSize: 12, color: '#999' } }, '支持单日或开始-结束时间段，单日时开始与结束选同一天即可')
			),
			React.createElement('div', { style: { marginBottom: 8 } },
				React.createElement('div', { style: { marginBottom: 6, fontSize: 14, color: 'rgba(0,0,0,0.65)' } }, '开始计费日期'),
				React.createElement(DatePicker, {
					style: { width: '100%' },
					format: 'YYYY-MM-DD',
					placeholder: '请选择日期',
					value: (function () {
						var v = activateBillingDate[0];
						if (v == null) return null;
						if (typeof v.isValid === 'function') return v;
						if (typeof v === 'string' && window.dayjs) return window.dayjs(v);
						return null;
					})(),
					onChange: function (date) { activateBillingDate[1](date); }
				})
			)
		)),
		React.createElement(Modal, {
			title: '需求说明',
			open: reqSpecOpen[0],
			onCancel: function () { reqSpecOpen[1](false); },
			width: 820,
			footer: React.createElement(Button, { onClick: function () { reqSpecOpen[1](false); } }, '关闭'),
			bodyStyle: { maxHeight: '70vh', overflow: 'auto' }
		}, React.createElement('div', { style: { whiteSpace: 'pre-wrap', lineHeight: 1.7, padding: '4px 2px' } }, reqSpecText))
	);
};

/*
// 【重要】必须使用 const Component 作为组件变量名
// 数字化资产ONEOS运管平台 - 业务管理 - 交车任务

const Component = function () {
	var useState = React.useState;
	var useMemo = React.useMemo;

	var antd = window.antd;
	var Breadcrumb = antd.Breadcrumb;
	var Card = antd.Card;
	var Table = antd.Table;
	var Select = antd.Select;
	var Input = antd.Input;
	var Button = antd.Button;
	var Space = antd.Space;
	var Popover = antd.Popover;
	var Modal = antd.Modal;
	var message = antd.message;

	// 筛选条件
	var filterDeliveryTaskCode = useState('');
	var filterContractCode = useState(undefined);
	var filterProjectName = useState(undefined);
	var filterCustomerName = useState(undefined);

	// 分页（主表）
	var pageState = useState(1);
	var pageSizeState = useState(10);
	var currentPage = pageState[0];
	var setCurrentPage = pageState[1];
	var pageSize = pageSizeState[0];
	var setPageSize = pageSizeState[1];

	// 主表展开：只展开一行
	var expandedRowKeysState = useState([]);
	var expandedRowKeys = expandedRowKeysState[0];
	var setExpandedRowKeys = expandedRowKeysState[1];

	// 子表交车数量气泡（只开一个）
	var deliveryPopoverOpen = useState(null);

	function buildDeliveryTaskCode(contractCode, seq) {
		var suffix = 'JC' + ('0000' + String(seq != null ? seq : '')).slice(-4);
		return String(contractCode || '') + suffix;
	}

	// 模拟：主表按合同聚合，子表为交车任务
	var initialMainList = useMemo(function () {
		return [
			{
				contractCode: 'JXZL20260216YW101235A',
				projectName: '嘉兴氢能运输项目',
				customerName: '嘉兴某某物流有限公司',
				businessDept: '业务1部',
				businessPerson: '张经理',
				contractEffectiveDate: '2026-02-16',
				contractEndDate: '2027-02-15',
				children: [
					{
						seq: 1,
						planDeliveryDisplay: '2026-03-01至2026-03-05',
						deliveryCount: 2,
						vehicles: [
							{ brand: '东风', model: 'DFH1180', plateNo: '浙A12345', actualDeliveryDate: '2026-03-02', deliverer: '运维李' },
							{ brand: '福田', model: 'BJ1180', plateNo: '浙A23456', actualDeliveryDate: '2026-03-03', deliverer: '运维王' }
						],
						billingStartDate: '2026-03-01',
						needReturnCar: '需要',
						creator: '张经理',
						createdAt: '2026-02-20',
						enabled: true
					},
					{
						seq: 2,
						planDeliveryDisplay: '2026-03-08',
						deliveryCount: 1,
						vehicles: [{ brand: '重汽', model: 'ZZ1187', plateNo: '浙A34567', actualDeliveryDate: '2026-03-08', deliverer: '运维赵' }],
						billingStartDate: '2026-03-08',
						needReturnCar: '不需要',
						creator: '张经理',
						createdAt: '2026-02-22',
						enabled: false
					}
				]
			},
			{
				contractCode: 'SHZL20260210YW101200A',
				projectName: '上海物流租赁项目',
				customerName: '上海某某运输公司',
				businessDept: '业务2部',
				businessPerson: '李专员',
				contractEffectiveDate: '2026-02-10',
				contractEndDate: '2027-02-09',
				children: [
					{
						seq: 1,
						planDeliveryDisplay: '2026-03-10',
						deliveryCount: 1,
						vehicles: [{ brand: '解放', model: 'JH6', plateNo: '沪A30003', actualDeliveryDate: '2026-03-10', deliverer: '运维李' }],
						billingStartDate: '2026-03-10',
						needReturnCar: '不需要',
						creator: '李专员',
						createdAt: '2026-02-21',
						enabled: true
					}
				]
			},
			{
				contractCode: 'JXZL20260215YW101234A',
				projectName: '杭州城配租赁项目',
				customerName: '杭州某某租赁有限公司',
				businessDept: '业务3部',
				businessPerson: '王专员',
				contractEffectiveDate: '2026-02-15',
				contractEndDate: '2027-02-14',
				children: [
					{
						seq: 1,
						planDeliveryDisplay: '2026-02-28至2026-03-02',
						deliveryCount: 3,
						vehicles: [
							{ brand: '品牌A', model: '型号A1', plateNo: '浙A10001', actualDeliveryDate: '2026-02-28', deliverer: '运维李' },
							{ brand: '品牌B', model: '型号B1', plateNo: '浙B20002', actualDeliveryDate: '2026-03-01', deliverer: '运维王' },
							{ brand: '品牌C', model: '型号C1', plateNo: '浙C50003', actualDeliveryDate: '2026-03-02', deliverer: '运维赵' }
						],
						billingStartDate: '2026-02-28',
						needReturnCar: '需要',
						creator: '王专员',
						createdAt: '2026-02-18',
						enabled: true
					}
				]
			}
		];
	}, []);

	var mainListState = useState(initialMainList);
	var mainList = mainListState[0];
	var setMainList = mainListState[1];

	// 下拉 options（合同编码/项目/客户）
	var filterOptions = useMemo(function () {
		var codes = [];
		var projects = [];
		var customers = [];
		mainList.forEach(function (r) {
			if (r.contractCode && codes.indexOf(r.contractCode) === -1) codes.push(r.contractCode);
			if (r.projectName && projects.indexOf(r.projectName) === -1) projects.push(r.projectName);
			if (r.customerName && customers.indexOf(r.customerName) === -1) customers.push(r.customerName);
		});
		return {
			contractCode: codes.map(function (v) { return { value: v, label: v }; }),
			projectName: projects.map(function (v) { return { value: v, label: v }; }),
			customerName: customers.map(function (v) { return { value: v, label: v }; })
		};
	}, [mainList]);

	function selectFuzzy(input, opt) {
		return (opt.label || '').toString().toLowerCase().indexOf((input || '').toLowerCase()) !== -1;
	}

	function resetFilters() {
		filterDeliveryTaskCode[1]('');
		filterContractCode[1](undefined);
		filterProjectName[1](undefined);
		filterCustomerName[1](undefined);
		setCurrentPage(1);
	}

	function handleQuery() {
		setCurrentPage(1);
		message.info('已按筛选条件查询');
	}

	function goView(record) {
		message.info('查看交车任务（原型）');
	}

	function goEdit(record) {
		message.info('编辑交车任务（原型）');
	}

	function toggleEnable(record) {
		if (record.enabled) {
			Modal.confirm({
				title: '确认挂起',
				content: '挂起交车任务会释放清空该交车任务车牌号以释放车辆，是否确定',
				okText: '确定',
				cancelText: '取消',
				onOk: function () {
					var parent = record._parentRecord;
					setMainList(function (prev) {
						return prev.map(function (p) {
							if (!parent || p.contractCode !== parent.contractCode) return p;
							var next = {};
							for (var k in p) next[k] = p[k];
							next.children = (p.children || []).map(function (c) {
								if (c.seq !== record.seq) return c;
								var vehicles = (c.vehicles || []).map(function (v) {
									return Object.assign({}, v, { plateNo: '', actualDeliveryDate: '', deliverer: '' });
								});
								return Object.assign({}, c, { enabled: false, vehicles: vehicles });
							});
							return next;
						});
					});
					message.success('已挂起');
				}
			});
		} else {
			activateRecord[1](record);
			activatePlanRange[1](null);
			activateBillingDate[1](null);
			activateModalOpen[1](true);
		}
	}

	function handleActivateConfirm() {
		var record = activateRecord[0];
		var planRange = activatePlanRange[0];
		var billingDate = activateBillingDate[0];
		if (!record) { activateModalOpen[1](false); return; }
		var toDateStr = function (d) { return d && typeof d.format === 'function' ? d.format('YYYY-MM-DD') : (d && typeof d === 'string' ? d : ''); };
		var planStr = planRange && planRange.length >= 1 && planRange[0]
			? (planRange.length >= 2 && planRange[1] ? toDateStr(planRange[0]) + '至' + toDateStr(planRange[1]) : toDateStr(planRange[0]))
			: '';
		var billingStr = billingDate ? toDateStr(billingDate) : '';
		if (!planStr || !billingStr) { message.warning('请填写预计交车日期和开始计费日期'); return; }
		var parent = record._parentRecord;
		setMainList(function (prev) {
			return prev.map(function (p) {
				if (!parent || p.contractCode !== parent.contractCode) return p;
				var next = {};
				for (var k in p) next[k] = p[k];
				next.children = (p.children || []).map(function (c) {
					if (c.seq !== record.seq) return c;
					return Object.assign({}, c, { enabled: true, planDeliveryDisplay: planStr, billingStartDate: billingStr });
				});
				return next;
			});
		});
		activateModalOpen[1](false);
		activateRecord[1](null);
		message.success('已激活');
	}

	// 筛选后的主表
	var filteredMainList = useMemo(function () {
		var list = mainList.slice();
		var contractCode = filterContractCode[0];
		var projectName = filterProjectName[0];
		var customerName = filterCustomerName[0];
		var taskCodeKw = (filterDeliveryTaskCode[0] || '').trim().toLowerCase();

		if (contractCode) list = list.filter(function (r) { return r.contractCode === contractCode; });
		if (projectName) list = list.filter(function (r) { return r.projectName === projectName; });
		if (customerName) list = list.filter(function (r) { return r.customerName === customerName; });

		// 交车任务编码：支持模糊搜索（匹配完整编码：合同编码 + JCxxxx）
		if (taskCodeKw) {
			list = list.filter(function (r) {
				var children = r.children || [];
				return children.some(function (c) {
					var full = buildDeliveryTaskCode(r.contractCode, c.seq);
					return full.toLowerCase().indexOf(taskCodeKw) !== -1;
				});
			});
		}
		return list;
	}, [mainList, filterContractCode[0], filterProjectName[0], filterCustomerName[0], filterDeliveryTaskCode[0]]);

	// 主表 dataSource 去掉 children，避免 Table 误用 treeData 产生空白行
	var mainTableDataSource = useMemo(function () {
		return filteredMainList.map(function (r) {
			var o = {};
			for (var k in r) if (k !== 'children') o[k] = r[k];
			o._detailList = r.children || [];
			return o;
		});
	}, [filteredMainList]);

	var paginatedMain = useMemo(function () {
		var start = (currentPage - 1) * pageSize;
		return mainTableDataSource.slice(start, start + pageSize);
	}, [mainTableDataSource, currentPage, pageSize]);

	function renderDeliveryPopover(record) {
		var vehicles = record.vehicles || [];
		var parentCode = (record._parentRecord && record._parentRecord.contractCode) || '';
		var key = parentCode + '-' + (record.seq != null ? record.seq : '');

		var listStyle = { width: '100%', borderCollapse: 'collapse', fontSize: 13 };
		var thStyle = { padding: '6px 10px', textAlign: 'left', borderBottom: '1px solid #f0f0f0', backgroundColor: '#fafafa', fontWeight: 600 };
		var tdStyle = { padding: '6px 10px', borderBottom: '1px solid #f0f0f0' };

		var content = vehicles.length === 0
			? React.createElement('div', { style: { padding: 8 } }, '—')
			: React.createElement('div', { style: { padding: 0, minWidth: 520 } },
				React.createElement('table', { style: listStyle },
					React.createElement('thead', null,
						React.createElement('tr', null,
							React.createElement('th', { style: thStyle }, '品牌'),
							React.createElement('th', { style: thStyle }, '型号'),
							React.createElement('th', { style: thStyle }, '车牌号'),
							React.createElement('th', { style: thStyle }, '实际交车日期'),
							React.createElement('th', { style: thStyle }, '交车人')
						)
					),
					React.createElement('tbody', null,
						vehicles.map(function (v, i) {
							return React.createElement('tr', { key: i },
								React.createElement('td', { style: tdStyle }, v.brand || '—'),
								React.createElement('td', { style: tdStyle }, v.model || '—'),
								React.createElement('td', { style: tdStyle }, v.plateNo || '—'),
								React.createElement('td', { style: tdStyle }, v.actualDeliveryDate || '—'),
								React.createElement('td', { style: tdStyle }, v.deliverer || '—')
							);
						})
					)
				)
			);

		var count = record.deliveryCount != null ? Number(record.deliveryCount) : 0;
		return React.createElement(Popover, {
			content: content,
			title: '车辆明细',
			trigger: 'click',
			open: deliveryPopoverOpen[0] === key,
			onOpenChange: function (open) { deliveryPopoverOpen[1](open ? key : null); }
		}, React.createElement(Button, { type: 'link', size: 'small', style: { padding: 0 } }, (isNaN(count) ? 0 : count) + '辆'));
	}

	var layoutStyle = { padding: '16px 24px', background: '#f5f5f5', minHeight: '100vh' };
	var cardStyle = { marginBottom: 16 };
	var filterLabelStyle = { marginBottom: 6, fontSize: 14, color: 'rgba(0,0,0,0.65)' };
	var filterItemStyle = { marginBottom: 12 };
	var filterControlStyle = { width: '100%' };

	var expandColumnWidth = 48;

	var mainColumns = [
		{ title: '合同编码', dataIndex: 'contractCode', key: 'contractCode', width: 200, ellipsis: true, render: function (v) { return v || '—'; } },
		{ title: '项目名称', dataIndex: 'projectName', key: 'projectName', width: 160, ellipsis: true, render: function (v) { return v || '—'; } },
		{ title: '客户名称', dataIndex: 'customerName', key: 'customerName', width: 180, ellipsis: true, render: function (v) { return v || '—'; } },
		{ title: '业务部门', dataIndex: 'businessDept', key: 'businessDept', width: 110, render: function (v) { return v || '—'; } },
		{ title: '业务负责人', dataIndex: 'businessPerson', key: 'businessPerson', width: 110, render: function (v) { return v || '—'; } },
		{ title: '合同生效日期', dataIndex: 'contractEffectiveDate', key: 'contractEffectiveDate', width: 120, render: function (v) { return v || '—'; } },
		{ title: '合同结束日期', dataIndex: 'contractEndDate', key: 'contractEndDate', width: 120, render: function (v) { return v || '—'; } }
	];

	var subColumns = [
		{
			title: '交车任务编码',
			key: 'deliveryTaskCode',
			width: 260,
			ellipsis: true,
			render: function (_, record) {
				var p = record._parentRecord;
				return buildDeliveryTaskCode(p && p.contractCode, record.seq) || '—';
			}
		},
		{ title: '预计交车日期', dataIndex: 'planDeliveryDisplay', key: 'planDeliveryDisplay', width: 160, render: function (v) { return v || '—'; } },
		{ title: '交车数量', key: 'deliveryCount', width: 100, render: function (_, record) { return renderDeliveryPopover(record); } },
		{ title: '开始计费日期', dataIndex: 'billingStartDate', key: 'billingStartDate', width: 120, render: function (v) { return v || '—'; } },
		{ title: '是否需要退还车', dataIndex: 'needReturnCar', key: 'needReturnCar', width: 120, render: function (v) { return v || '—'; } },
		{ title: '创建人', dataIndex: 'creator', key: 'creator', width: 100, render: function (v) { return v || '—'; } },
		{ title: '创建时间', dataIndex: 'createdAt', key: 'createdAt', width: 110, render: function (v) { return v || '—'; } },
		{
			title: '操作',
			key: 'action',
			width: 200,
			fixed: 'right',
			render: function (_, record) {
				return React.createElement(Space, { size: 'small' },
					React.createElement(Button, { type: 'link', size: 'small', onClick: function () { goView(record); } }, '查看'),
					React.createElement(Button, { type: 'link', size: 'small', onClick: function () { goEdit(record); } }, '编辑'),
					React.createElement(Button, { type: 'link', size: 'small', onClick: function () { toggleEnable(record); } }, record.enabled ? '挂起' : '激活')
				);
			}
		}
	];

	function expandRowRender(record) {
		var rows = (record._detailList || []).map(function (r) {
			var o = {};
			for (var k in r) o[k] = r[k];
			o._parentRecord = record;
			return o;
		});

		return React.createElement('div', { style: { marginBottom: 0, paddingLeft: expandColumnWidth, boxSizing: 'border-box' } },
			React.createElement(Table, {
				rowKey: function (r) { return (record.contractCode || '') + '-' + (r.seq != null ? r.seq : Math.random()); },
				columns: subColumns,
				dataSource: rows,
				pagination: false,
				size: 'small',
				bordered: true,
				scroll: { x: 1400 }
			})
		);
	}

	return React.createElement('div', { style: layoutStyle },
		React.createElement('div', { style: { marginBottom: 16 } },
			React.createElement(Breadcrumb, { items: [{ title: '业务管理' }, { title: '交车任务' }] })
		),
		React.createElement(Card, { title: '筛选', style: cardStyle },
			React.createElement('div', { style: { display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: '16px 24px', alignItems: 'start' } },
				React.createElement('div', { style: filterItemStyle },
					React.createElement('div', { style: filterLabelStyle }, '交车任务编码'),
					React.createElement(Input, {
						placeholder: '请输入交车任务编码，支持模糊搜索',
						allowClear: true,
						style: filterControlStyle,
						value: filterDeliveryTaskCode[0],
						onChange: function (e) { filterDeliveryTaskCode[1](e.target.value); }
					})
				),
				React.createElement('div', { style: filterItemStyle },
					React.createElement('div', { style: filterLabelStyle }, '合同编码'),
					React.createElement(Select, {
						placeholder: '请输入或选择合同编码，支持从输入框输入内容进行模糊搜索',
						allowClear: true,
						showSearch: true,
						style: filterControlStyle,
						value: filterContractCode[0],
						onChange: function (v) { filterContractCode[1](v); },
						options: filterOptions.contractCode,
						filterOption: selectFuzzy
					})
				),
				React.createElement('div', { style: filterItemStyle },
					React.createElement('div', { style: filterLabelStyle }, '项目名称'),
					React.createElement(Select, {
						placeholder: '请输入或选择项目名称，支持从输入框输入内容进行模糊搜索',
						allowClear: true,
						showSearch: true,
						style: filterControlStyle,
						value: filterProjectName[0],
						onChange: function (v) { filterProjectName[1](v); },
						options: filterOptions.projectName,
						filterOption: selectFuzzy
					})
				),
				React.createElement('div', { style: filterItemStyle },
					React.createElement('div', { style: filterLabelStyle }, '客户名称'),
					React.createElement(Select, {
						placeholder: '请输入或选择客户名称，支持从输入框输入内容进行模糊搜索',
						allowClear: true,
						showSearch: true,
						style: filterControlStyle,
						value: filterCustomerName[0],
						onChange: function (v) { filterCustomerName[1](v); },
						options: filterOptions.customerName,
						filterOption: selectFuzzy
					})
				)
			),
			React.createElement('div', { style: { display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 16 } },
				React.createElement(Button, { type: 'primary', onClick: handleQuery }, '查询'),
				React.createElement(Button, { onClick: resetFilters }, '重置')
			)
		),
		React.createElement(Card, { title: '列表', style: cardStyle },
			React.createElement(Table, {
				rowKey: 'contractCode',
				columns: mainColumns,
				dataSource: paginatedMain,
				expandable: {
					expandedRowKeys: expandedRowKeys,
					onExpandedRowsChange: function (keys) { setExpandedRowKeys(keys && keys.length ? [keys[keys.length - 1]] : []); },
					expandedRowRender: expandRowRender,
					rowExpandable: function (record) { return record._detailList && record._detailList.length > 0; },
					columnWidth: expandColumnWidth
				},
				pagination: {
					current: currentPage,
					pageSize: pageSize,
					total: mainTableDataSource.length,
					showSizeChanger: true,
					showTotal: function (t) { return '共 ' + t + ' 条'; },
					pageSizeOptions: ['10', '20', '50', '100'],
					onChange: function (p, ps) { setCurrentPage(p); setPageSize(ps); },
					onShowSizeChange: function () { setCurrentPage(1); }
				},
				size: 'middle',
				bordered: true,
				scroll: { x: 1110 }
			})
		)
	);
};

// 【重要】必须使用 const Component 作为组件变量名
// 数字化资产ONEOS运管平台 - 业务管理 - 交车任务

const Component = function() {
	var useState = React.useState;
	var useMemo = React.useMemo;
	var antd = window.antd;
	var Breadcrumb = antd.Breadcrumb;
	var Select = antd.Select;
	var Button = antd.Button;
	var Table = antd.Table;
	var Card = antd.Card;
	var Tabs = antd.Tabs;
	var DatePicker = antd.DatePicker;
	var Popover = antd.Popover;
	var Modal = antd.Modal;
	var message = antd.message;
	var App = antd.App;
	var RangePicker = DatePicker.RangePicker;

	// 筛选条件（表单输入）
	var _contractCode = useState(undefined);
	var _projectName = useState(undefined);
	var _customerName = useState(undefined);
	var _planDateRange = useState(null);
	var _creator = useState(undefined);
	// 已应用的筛选条件（点击查询后生效）
	var _applied = useState({
		contractCode: undefined,
		projectName: undefined,
		customerName: undefined,
		planDateRange: null,
		creator: undefined
	});

	// Tab：进行中 / 已完成
	var _activeTab = useState('ongoing');

	// 筛选展开（默认显示前 3 项，与车辆租赁合同一致）
	var _filterExpanded = useState(false);

	// 需求说明弹窗
	var _reqSpecOpen = useState(false);

	// 停用/启用：重新选择预计交车日期弹窗
	var _rescheduleModalVisible = useState(false);
	var _rescheduleTask = useState(null);
	var _rescheduleDateRange = useState(null);

	// 模拟选项（可模糊搜索）
	var contractOptions = [
		{ value: 'JXZL20260216YW101235A', label: 'JXZL20260216YW101235A' },
		{ value: 'JXZL20260216YW101236A', label: 'JXZL20260216YW101236A' },
		{ value: 'JXZL20260215YW101234A', label: 'JXZL20260215YW101234A' },
		{ value: 'SHZL20260210YW101200A', label: 'SHZL20260210YW101200A' }
	];
	var projectOptions = [
		{ value: 'p1', label: '嘉兴氢能运输项目' },
		{ value: 'p2', label: '上海物流租赁项目' },
		{ value: 'p3', label: '杭州城配租赁项目' }
	];
	var customerOptions = [
		{ value: 'c1', label: '嘉兴某某物流有限公司' },
		{ value: 'c2', label: '上海某某运输公司' },
		{ value: 'c3', label: '杭州某某租赁有限公司' }
	];
	var creatorOptions = [
		{ value: 'u1', label: '张经理' },
		{ value: 'u2', label: '李专员' },
		{ value: 'u3', label: '王专员' }
	];

	// 进行中列表数据（未完成交车单提交），用 state 以便停用/启用后刷新
	var _ongoingList = useState([
		{ id: 'o1', contractCode: 'JXZL20260216YW101235A', projectName: '嘉兴氢能运输项目', customerName: '嘉兴某某物流有限公司', deliveryCount: 2, deliveryRegion: '浙江省-嘉兴市', deliveryLocation: '嘉兴市南湖区科技大道1号', planDeliveryDisplay: '2026-03-01至2026-03-05', planDeliveryEnd: '2026-03-05', billingStartDate: '2026-03-01', creator: '张经理', createdAt: '2026-02-20', lastUpdater: '张经理', lastUpdatedAt: '2026-02-24', enabled: true },
		{ id: 'o2', contractCode: 'JXZL20260216YW101236A', projectName: '上海物流租赁项目', customerName: '上海某某运输公司', deliveryCount: 1, deliveryRegion: '上海市-上海市', deliveryLocation: '上海市浦东新区张江高科技园区', planDeliveryDisplay: '2026-03-10', planDeliveryEnd: '2026-03-10', billingStartDate: '-', creator: '李专员', createdAt: '2026-02-21', lastUpdater: '李专员', lastUpdatedAt: '2026-02-22', enabled: false },
		{ id: 'o3', contractCode: 'JXZL20260215YW101234A', projectName: '杭州城配租赁项目', customerName: '杭州某某租赁有限公司', deliveryCount: 3, deliveryRegion: '浙江省-杭州市', deliveryLocation: '杭州市余杭区未来科技城', planDeliveryDisplay: '2026-02-28至2026-03-02', planDeliveryEnd: '2026-03-02', billingStartDate: '2026-02-28', creator: '王专员', createdAt: '2026-02-18', lastUpdater: '王专员', lastUpdatedAt: '2026-02-25', enabled: true },
		{ id: 'o4', contractCode: 'JXZL20260101YW101200A', projectName: '嘉兴氢能运输项目', customerName: '嘉兴某某物流有限公司', deliveryCount: 1, deliveryRegion: '浙江省-嘉兴市', deliveryLocation: '嘉兴市秀洲区洪兴西路288号', planDeliveryDisplay: '2026-01-05至2026-01-10', planDeliveryEnd: '2026-01-10', billingStartDate: '-', creator: '张经理', createdAt: '2026-01-02', lastUpdater: '张经理', lastUpdatedAt: '2026-01-15', enabled: false },
		{ id: 'o5', contractCode: 'JXZL20260218YW101237A', projectName: '嘉兴氢能运输项目', customerName: '嘉兴某某物流有限公司', deliveryCount: 2, deliveryRegion: '浙江省-嘉兴市', deliveryLocation: '嘉兴市南湖区广益路与亚中路交叉口', planDeliveryDisplay: '2026-03-08至2026-03-12', planDeliveryEnd: '2026-03-12', billingStartDate: '-', creator: '张经理', createdAt: '2026-02-22', lastUpdater: '张经理', lastUpdatedAt: '2026-02-26', enabled: true },
		{ id: 'o6', contractCode: 'SHZL20260210YW101201A', projectName: '上海物流租赁项目', customerName: '上海某某运输公司', deliveryCount: 1, deliveryRegion: '上海市-上海市', deliveryLocation: '上海市闵行区申滨路1051号', planDeliveryDisplay: '2026-03-15', planDeliveryEnd: '2026-03-15', billingStartDate: '-', creator: '李专员', createdAt: '2026-02-19', lastUpdater: '李专员', lastUpdatedAt: '2026-02-23', enabled: true },
		{ id: 'o7', contractCode: 'JXZL20260220YW101238A', projectName: '杭州城配租赁项目', customerName: '杭州某某租赁有限公司', deliveryCount: 4, deliveryRegion: '浙江省-杭州市', deliveryLocation: '杭州市萧山区市心北路与建设一路交叉口', planDeliveryDisplay: '2026-03-20至2026-03-25', planDeliveryEnd: '2026-03-25', billingStartDate: '-', creator: '王专员', createdAt: '2026-02-23', lastUpdater: '王专员', lastUpdatedAt: '2026-02-27', enabled: true },
		{ id: 'o8', contractCode: 'JXZL20260214YW101233A', projectName: '嘉兴氢能运输项目', customerName: '嘉兴某某物流有限公司', deliveryCount: 1, deliveryRegion: '浙江省-嘉兴市', deliveryLocation: '嘉兴市经开区昌盛路与文昌路交叉口', planDeliveryDisplay: '2026-03-05', planDeliveryEnd: '2026-03-05', billingStartDate: '-', creator: '张经理', createdAt: '2026-02-17', lastUpdater: '李专员', lastUpdatedAt: '2026-02-24', enabled: true },
		{ id: 'o9', contractCode: 'SHZL20260212YW101202A', projectName: '上海物流租赁项目', customerName: '上海某某运输公司', deliveryCount: 2, deliveryRegion: '上海市-上海市', deliveryLocation: '上海市嘉定区安亭镇墨玉南路与博园路交叉口', planDeliveryDisplay: '2026-03-18至2026-03-22', planDeliveryEnd: '2026-03-22', billingStartDate: '-', creator: '李专员', createdAt: '2026-02-24', lastUpdater: '李专员', lastUpdatedAt: '2026-02-28', enabled: true },
		{ id: 'o10', contractCode: 'JXZL20260222YW101239A', projectName: '杭州城配租赁项目', customerName: '杭州某某租赁有限公司', deliveryCount: 3, deliveryRegion: '浙江省-杭州市', deliveryLocation: '杭州市西湖区文三路与古翠路交叉口', planDeliveryDisplay: '2026-03-25至2026-03-30', planDeliveryEnd: '2026-03-30', billingStartDate: '-', creator: '王专员', createdAt: '2026-02-25', lastUpdater: '王专员', lastUpdatedAt: '2026-02-28', enabled: true }
	]);
	var ongoingList = _ongoingList[0];
	var setOngoingList = _ongoingList[1];

	// 已完成列表数据（已提交交车单），交车数量可点开气泡
	var completedList = [
		{ id: 'c1', contractCode: 'JXZL20260215YW101234A', projectName: '杭州城配租赁项目', customerName: '杭州某某租赁有限公司', deliveryCount: 2, deliveryRegion: '浙江省-杭州市', deliveryLocation: '杭州市余杭区未来科技城', vehicles: [{ vehicleType: '4.5吨冷链车-轻型厢式货车', brand: '品牌A', model: '型号A1', plateNo: '浙A10001', actualDeliveryDate: '2026-02-28', deliverer: '运维李' }, { vehicleType: '18吨厢式货车-重型厢式货车', brand: '品牌B', model: '型号B1', plateNo: '浙B20002', actualDeliveryDate: '2026-03-01', deliverer: '运维王' }], planDeliveryDisplay: '2026-02-28至2026-03-01', billingStartDate: '2026-02-28', creator: '王专员', createdAt: '2026-02-18', lastUpdater: '王专员', lastUpdatedAt: '2026-03-01' },
		{ id: 'c2', contractCode: 'SHZL20260210YW101200A', projectName: '上海物流租赁项目', customerName: '上海某某运输公司', deliveryCount: 1, deliveryRegion: '上海市-上海市', deliveryLocation: '上海市浦东新区张江高科技园区', vehicles: [{ vehicleType: '18吨厢式货车-重型厢式货车', brand: '品牌B', model: '型号B1', plateNo: '沪A30003', actualDeliveryDate: '2026-02-25', deliverer: '运维赵' }], planDeliveryDisplay: '2026-02-25', billingStartDate: '2026-02-25', creator: '李专员', createdAt: '2026-02-15', lastUpdater: '李专员', lastUpdatedAt: '2026-02-25' },
		{ id: 'c3', contractCode: 'JXZL20260208YW101231A', projectName: '嘉兴氢能运输项目', customerName: '嘉兴某某物流有限公司', deliveryCount: 2, deliveryRegion: '浙江省-嘉兴市', deliveryLocation: '嘉兴市南湖区科技大道1号', vehicles: [{ vehicleType: '4.5吨冷链车-轻型厢式货车', brand: '品牌A', model: '型号A1', plateNo: '浙A10002', actualDeliveryDate: '2026-02-20', deliverer: '运维李' }, { vehicleType: '18吨厢式货车-重型厢式货车', brand: '品牌B', model: '型号B1', plateNo: '浙A10003', actualDeliveryDate: '2026-02-21', deliverer: '运维王' }], planDeliveryDisplay: '2026-02-20至2026-02-21', billingStartDate: '2026-02-20', creator: '张经理', createdAt: '2026-02-10', lastUpdater: '张经理', lastUpdatedAt: '2026-02-21' },
		{ id: 'c4', contractCode: 'SHZL20260205YW101198A', projectName: '上海物流租赁项目', customerName: '上海某某运输公司', deliveryCount: 1, deliveryRegion: '上海市-上海市', deliveryLocation: '上海市闵行区申滨路1051号', vehicles: [{ vehicleType: '18吨厢式货车-重型厢式货车', brand: '品牌B', model: '型号B2', plateNo: '沪B40004', actualDeliveryDate: '2026-02-18', deliverer: '运维赵' }], planDeliveryDisplay: '2026-02-18', billingStartDate: '2026-02-18', creator: '李专员', createdAt: '2026-02-08', lastUpdater: '李专员', lastUpdatedAt: '2026-02-18' },
		{ id: 'c5', contractCode: 'JXZL20260212YW101232A', projectName: '杭州城配租赁项目', customerName: '杭州某某租赁有限公司', deliveryCount: 3, deliveryRegion: '浙江省-杭州市', deliveryLocation: '杭州市萧山区市心北路与建设一路交叉口', vehicles: [{ vehicleType: '4.5吨冷链车-轻型厢式货车', brand: '品牌A', model: '型号A2', plateNo: '浙C50001', actualDeliveryDate: '2026-02-22', deliverer: '运维李' }, { vehicleType: '18吨厢式货车-重型厢式货车', brand: '品牌B', model: '型号B1', plateNo: '浙C50002', actualDeliveryDate: '2026-02-23', deliverer: '运维王' }, { vehicleType: '4.5吨货车-轻型厢式货车', brand: '品牌C', model: '型号C1', plateNo: '浙C50003', actualDeliveryDate: '2026-02-24', deliverer: '运维赵' }], planDeliveryDisplay: '2026-02-22至2026-02-24', billingStartDate: '2026-02-22', creator: '王专员', createdAt: '2026-02-14', lastUpdater: '王专员', lastUpdatedAt: '2026-02-24' },
		{ id: 'c6', contractCode: 'JXZL20260201YW101228A', projectName: '嘉兴氢能运输项目', customerName: '嘉兴某某物流有限公司', deliveryCount: 1, deliveryRegion: '浙江省-嘉兴市', deliveryLocation: '嘉兴市秀洲区洪兴西路288号', vehicles: [{ vehicleType: '4.5吨冷链车-轻型厢式货车', brand: '品牌A', model: '型号A1', plateNo: '浙A10004', actualDeliveryDate: '2026-02-15', deliverer: '运维李' }], planDeliveryDisplay: '2026-02-15', billingStartDate: '2026-02-15', creator: '张经理', createdAt: '2026-02-05', lastUpdater: '张经理', lastUpdatedAt: '2026-02-15' },
		{ id: 'c7', contractCode: 'SHZL20260203YW101199A', projectName: '上海物流租赁项目', customerName: '上海某某运输公司', deliveryCount: 2, deliveryRegion: '上海市-上海市', deliveryLocation: '上海市嘉定区安亭镇墨玉南路与博园路交叉口', vehicles: [{ vehicleType: '18吨厢式货车-重型厢式货车', brand: '品牌B', model: '型号B1', plateNo: '沪A30005', actualDeliveryDate: '2026-02-16', deliverer: '运维赵' }, { vehicleType: '4.5吨冷链车-轻型厢式货车', brand: '品牌A', model: '型号A1', plateNo: '沪A30006', actualDeliveryDate: '2026-02-17', deliverer: '运维李' }], planDeliveryDisplay: '2026-02-16至2026-02-17', billingStartDate: '2026-02-16', creator: '李专员', createdAt: '2026-02-06', lastUpdater: '李专员', lastUpdatedAt: '2026-02-17' },
		{ id: 'c8', contractCode: 'JXZL20260128YW101227A', projectName: '杭州城配租赁项目', customerName: '杭州某某租赁有限公司', deliveryCount: 2, deliveryRegion: '浙江省-杭州市', deliveryLocation: '杭州市西湖区文三路与古翠路交叉口', vehicles: [{ vehicleType: '18吨厢式货车-重型厢式货车', brand: '品牌B', model: '型号B2', plateNo: '浙B20004', actualDeliveryDate: '2026-02-10', deliverer: '运维王' }, { vehicleType: '4.5吨货车-轻型厢式货车', brand: '品牌C', model: '型号C1', plateNo: '浙B20005', actualDeliveryDate: '2026-02-11', deliverer: '运维赵' }], planDeliveryDisplay: '2026-02-10至2026-02-11', billingStartDate: '2026-02-10', creator: '王专员', createdAt: '2026-01-30', lastUpdater: '王专员', lastUpdatedAt: '2026-02-11' },
		{ id: 'c9', contractCode: 'JXZL20260206YW101230A', projectName: '嘉兴氢能运输项目', customerName: '嘉兴某某物流有限公司', deliveryCount: 1, deliveryRegion: '浙江省-嘉兴市', deliveryLocation: '嘉兴市经开区昌盛路与文昌路交叉口', vehicles: [{ vehicleType: '4.5吨冷链车-轻型厢式货车', brand: '品牌A', model: '型号A2', plateNo: '浙A10005', actualDeliveryDate: '2026-02-19', deliverer: '运维李' }], planDeliveryDisplay: '2026-02-19', billingStartDate: '2026-02-19', creator: '张经理', createdAt: '2026-02-09', lastUpdater: '张经理', lastUpdatedAt: '2026-02-19' },
		{ id: 'c10', contractCode: 'SHZL20260215YW101203A', projectName: '上海物流租赁项目', customerName: '上海某某运输公司', deliveryCount: 2, deliveryRegion: '上海市-上海市', deliveryLocation: '上海市浦东新区金桥镇金海路1000号', vehicles: [{ vehicleType: '18吨厢式货车-重型厢式货车', brand: '品牌B', model: '型号B1', plateNo: '沪C60001', actualDeliveryDate: '2026-02-26', deliverer: '运维赵' }, { vehicleType: '4.5吨冷链车-轻型厢式货车', brand: '品牌A', model: '型号A1', plateNo: '沪C60002', actualDeliveryDate: '2026-02-27', deliverer: '运维李' }], planDeliveryDisplay: '2026-02-26至2026-02-27', billingStartDate: '2026-02-26', creator: '李专员', createdAt: '2026-02-18', lastUpdater: '李专员', lastUpdatedAt: '2026-02-27' }
	];

	var applied = _applied[0];
	var setApplied = _applied[1];

	var getProjectLabel = function(v) { var o = projectOptions.find(function(x) { return x.value === v; }); return o ? o.label : v; };
	var getCustomerLabel = function(v) { var o = customerOptions.find(function(x) { return x.value === v; }); return o ? o.label : v; };
	var getCreatorLabel = function(v) { var o = creatorOptions.find(function(x) { return x.value === v; }); return o ? o.label : v; };

	var filterOngoing = function(list) {
		var a = applied;
		if (a.contractCode) list = list.filter(function(r) { return r.contractCode === a.contractCode; });
		if (a.projectName) { var pl = getProjectLabel(a.projectName); if (pl) list = list.filter(function(r) { return r.projectName === pl; }); }
		if (a.customerName) { var cl = getCustomerLabel(a.customerName); if (cl) list = list.filter(function(r) { return r.customerName === cl; }); }
		if (a.creator) { var ul = getCreatorLabel(a.creator); if (ul) list = list.filter(function(r) { return r.creator === ul; }); }
		if (a.planDateRange && a.planDateRange.length === 2 && window.dayjs) {
			var start = window.dayjs(a.planDateRange[0]).startOf('day');
			var end = window.dayjs(a.planDateRange[1]).endOf('day');
			list = list.filter(function(r) {
				var d = r.planDeliveryEnd ? window.dayjs(r.planDeliveryEnd) : null;
				return d && !d.isBefore(start) && !d.isAfter(end);
			});
		}
		return list;
	};

	var filteredOngoing = useMemo(function() {
		return filterOngoing(ongoingList.slice());
	}, [ongoingList, applied.contractCode, applied.projectName, applied.customerName, applied.creator, applied.planDateRange]);

	var filteredCompleted = useMemo(function() {
		var list = completedList.slice();
		if (applied.contractCode) list = list.filter(function(r) { return r.contractCode === applied.contractCode; });
		if (applied.projectName) { var pl = getProjectLabel(applied.projectName); if (pl) list = list.filter(function(r) { return r.projectName === pl; }); }
		if (applied.customerName) { var cl = getCustomerLabel(applied.customerName); if (cl) list = list.filter(function(r) { return r.customerName === cl; }); }
		if (applied.creator) { var ul = getCreatorLabel(applied.creator); if (ul) list = list.filter(function(r) { return r.creator === ul; }); }
		if (applied.planDateRange && applied.planDateRange.length === 2 && window.dayjs) {
			var start = window.dayjs(applied.planDateRange[0]).startOf('day');
			var end = window.dayjs(applied.planDateRange[1]).endOf('day');
			list = list.filter(function(r) {
				var planEnd = r.planDeliveryDisplay && r.planDeliveryDisplay.indexOf('至') >= 0
					? r.planDeliveryDisplay.split('至')[1]
					: r.planDeliveryDisplay;
				var d = planEnd ? window.dayjs(planEnd) : null;
				return d && !d.isBefore(start) && !d.isAfter(end);
			});
		}
		return list;
	}, [applied.contractCode, applied.projectName, applied.customerName, applied.creator, applied.planDateRange]);

	var handleQuery = function() {
		setApplied({
			contractCode: _contractCode[0],
			projectName: _projectName[0],
			customerName: _customerName[0],
			planDateRange: _planDateRange[0] && _planDateRange[0].length === 2 ? _planDateRange[0] : null,
			creator: _creator[0]
		});
		message.info('已按筛选条件查询');
	};

	var handleReset = function() {
		_contractCode[1](undefined);
		_projectName[1](undefined);
		_customerName[1](undefined);
		_planDateRange[1](null);
		_creator[1](undefined);
		setApplied({
			contractCode: undefined,
			projectName: undefined,
			customerName: undefined,
			planDateRange: null,
			creator: undefined
		});
	};

	var handleDisableEnable = function(record) {
		if (record.enabled) {
			Modal.confirm({
				title: '是否确认停用该交车任务？',
				okText: '确定',
				cancelText: '取消',
				onOk: function() {
					setOngoingList(function(prev) {
						return prev.map(function(r) { return r.id === record.id ? Object.assign({}, r, { enabled: false }) : r; });
					});
					message.success('已停用');
				}
			});
			return;
		}
		// 启用：判断预计交车结束日期是否已过期
		var dayjs = window.dayjs;
		var endDate = record.planDeliveryEnd ? (dayjs ? dayjs(record.planDeliveryEnd) : null) : null;
		var now = dayjs ? dayjs() : null;
		if (endDate && now && endDate.isBefore(now, 'day')) {
			_rescheduleTask[1](record);
			_rescheduleDateRange[1](null);
			_rescheduleModalVisible[1](true);
			return;
		}
		Modal.confirm({
			title: '是否确认启用该交车任务？',
			okText: '确定',
			cancelText: '取消',
			onOk: function() {
				setOngoingList(function(prev) {
					return prev.map(function(r) { return r.id === record.id ? Object.assign({}, r, { enabled: true }) : r; });
				});
				message.success('已启用');
			}
		});
	};

	var handleRescheduleConfirm = function() {
		var task = _rescheduleTask[0];
		var range = _rescheduleDateRange[0];
		if (!task || !range || range.length !== 2) {
			message.warning('请选择预计交车日期（单日请选择同一天为开始和结束）');
			return;
		}
		var dayjs = window.dayjs;
		var startStr = dayjs ? dayjs(range[0]).format('YYYY-MM-DD') : String(range[0]);
		var endStr = dayjs ? dayjs(range[1]).format('YYYY-MM-DD') : String(range[1]);
		var planDisplay = startStr === endStr ? startStr : startStr + '至' + endStr;
		setOngoingList(function(prev) {
			return prev.map(function(r) {
				if (r.id !== task.id) return r;
				return Object.assign({}, r, { planDeliveryDisplay: planDisplay, planDeliveryEnd: endStr, enabled: true });
			});
		});
		message.success('已重新选择预计交车日期并启用');
		_rescheduleModalVisible[1](false);
		_rescheduleTask[1](null);
		_rescheduleDateRange[1](null);
	};

	// 进行中表格列
	var ongoingColumns = [
		{ title: '合同编码', dataIndex: 'contractCode', key: 'contractCode', width: 180, ellipsis: true, fixed: 'left' },
		{ title: '项目名称', dataIndex: 'projectName', key: 'projectName', width: 140, ellipsis: true, fixed: 'left' },
		{ title: '客户名称', dataIndex: 'customerName', key: 'customerName', width: 160, ellipsis: true, fixed: 'left' },
		{ title: '交车数量', dataIndex: 'deliveryCount', key: 'deliveryCount', width: 100 },
		{ title: '交车区域', dataIndex: 'deliveryRegion', key: 'deliveryRegion', width: 140 },
		{ title: '交车地点', dataIndex: 'deliveryLocation', key: 'deliveryLocation', width: 200, ellipsis: true },
		{ title: '预计交车日期', dataIndex: 'planDeliveryDisplay', key: 'planDeliveryDisplay', width: 180 },
		{ title: '开始计费日期', dataIndex: 'billingStartDate', key: 'billingStartDate', width: 120 },
		{ title: '创建人', dataIndex: 'creator', key: 'creator', width: 100 },
		{ title: '创建时间', dataIndex: 'createdAt', key: 'createdAt', width: 120 },
		{ title: '最后更新人', dataIndex: 'lastUpdater', key: 'lastUpdater', width: 100 },
		{ title: '最后更新时间', dataIndex: 'lastUpdatedAt', key: 'lastUpdatedAt', width: 120 },
		{
			title: '操作',
			key: 'action',
			width: 180,
			fixed: 'right',
			render: function(_, record) {
				return React.createElement('span', null,
					React.createElement(Button, { type: 'link', size: 'small', onClick: function() { message.info('请参照原型业务管理-交车任务页面'); } }, '查看'),
					React.createElement(Button, { type: 'link', size: 'small', onClick: function() { message.info('请参照原型业务管理-交车任务-编辑交车任务页面'); } }, '编辑'),
					React.createElement(Button, {
						type: 'link',
						size: 'small',
						onClick: function() { handleDisableEnable(record); }
					}, record.enabled ? '停用' : '启用')
				);
			}
		}
	];

	// 已完成表格列（交车数量重点色+气泡）
	var vehiclePopoverContent = function(vehicles) {
		if (!vehicles || !vehicles.length) return React.createElement('span', null, '-');
		var headers = ['车辆类型', '品牌', '型号', '车牌号', '实际交车日期', '交车人'];
		return React.createElement('div', { style: { padding: 4, minWidth: 420 } },
			React.createElement('table', { style: { width: '100%', borderCollapse: 'collapse', fontSize: 12 } },
				React.createElement('thead', null,
					React.createElement('tr', null,
						headers.map(function(h) { return React.createElement('th', { key: h, style: { padding: '6px 8px', textAlign: 'left', borderBottom: '1px solid #eee', fontWeight: 600 } }, h); })
					)
				),
				React.createElement('tbody', null,
					vehicles.map(function(v, i) {
						return React.createElement('tr', { key: i },
							React.createElement('td', { style: { padding: '6px 8px', borderBottom: '1px solid #f0f0f0' } }, v.vehicleType || '-'),
							React.createElement('td', { style: { padding: '6px 8px', borderBottom: '1px solid #f0f0f0' } }, v.brand || '-'),
							React.createElement('td', { style: { padding: '6px 8px', borderBottom: '1px solid #f0f0f0' } }, v.model || '-'),
							React.createElement('td', { style: { padding: '6px 8px', borderBottom: '1px solid #f0f0f0' } }, v.plateNo || '-'),
							React.createElement('td', { style: { padding: '6px 8px', borderBottom: '1px solid #f0f0f0' } }, v.actualDeliveryDate || '-'),
							React.createElement('td', { style: { padding: '6px 8px', borderBottom: '1px solid #f0f0f0' } }, v.deliverer || '-')
						);
					})
				)
			)
		);
	};

	var completedColumns = [
		{ title: '合同编码', dataIndex: 'contractCode', key: 'contractCode', width: 180, ellipsis: true, fixed: 'left' },
		{ title: '项目名称', dataIndex: 'projectName', key: 'projectName', width: 140, ellipsis: true, fixed: 'left' },
		{ title: '客户名称', dataIndex: 'customerName', key: 'customerName', width: 160, ellipsis: true, fixed: 'left' },
		{
			title: '交车数量',
			dataIndex: 'deliveryCount',
			key: 'deliveryCount',
			width: 100,
			render: function(count, record) {
				var content = vehiclePopoverContent(record.vehicles);
				return React.createElement(Popover, { content: content, title: '交车车辆明细', trigger: 'click' },
					React.createElement('span', { style: { color: '#1890ff', cursor: 'pointer', fontWeight: 500 } }, count)
				);
			}
		},
		{ title: '交车区域', dataIndex: 'deliveryRegion', key: 'deliveryRegion', width: 140 },
		{ title: '交车地点', dataIndex: 'deliveryLocation', key: 'deliveryLocation', width: 200, ellipsis: true },
		{ title: '预计交车日期', dataIndex: 'planDeliveryDisplay', key: 'planDeliveryDisplay', width: 180 },
		{ title: '开始计费日期', dataIndex: 'billingStartDate', key: 'billingStartDate', width: 120 },
		{ title: '创建人', dataIndex: 'creator', key: 'creator', width: 100 },
		{ title: '创建时间', dataIndex: 'createdAt', key: 'createdAt', width: 120 },
		{ title: '最后更新人', dataIndex: 'lastUpdater', key: 'lastUpdater', width: 100 },
		{ title: '最后更新时间', dataIndex: 'lastUpdatedAt', key: 'lastUpdatedAt', width: 120 },
		{
			title: '操作',
			key: 'action',
			width: 80,
			fixed: 'right',
			render: function(_, record) {
				return React.createElement(Button, { type: 'link', size: 'small', onClick: function() { message.info('请参照原型业务管理-交车任务页面'); } }, '查看');
			}
		}
	];

	var filterOption = function(input, option) {
		var label = (option && option.label) ? String(option.label) : '';
		return label.toLowerCase().indexOf((input || '').toLowerCase()) >= 0;
	};

	var filterLabelStyle = { marginBottom: 6, fontSize: 14, color: 'rgba(0,0,0,0.65)' };
	var filterItemStyle = { marginBottom: 12 };
	var filterControlStyle = { width: '100%' };

	var filterItems = [
		React.createElement('div', { key: 'contractCode', style: filterItemStyle },
			React.createElement('div', { style: filterLabelStyle }, '合同编码'),
			React.createElement(Select, {
				placeholder: '请输入或选择合同编码',
				style: filterControlStyle,
				value: _contractCode[0],
				onChange: function(v) { _contractCode[1](v); },
				options: contractOptions,
				showSearch: true,
				allowClear: true,
				filterOption: filterOption
			})),
		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); },
				options: projectOptions,
				showSearch: true,
				allowClear: true,
				filterOption: filterOption
			})),
		React.createElement('div', { key: 'customerName', style: filterItemStyle },
			React.createElement('div', { style: filterLabelStyle }, '客户名称'),
			React.createElement(Select, {
				placeholder: '请输入或选择客户名称',
				style: filterControlStyle,
				value: _customerName[0],
				onChange: function(v) { _customerName[1](v); },
				options: customerOptions,
				showSearch: true,
				allowClear: true,
				filterOption: filterOption
			})),
		React.createElement('div', { key: 'planDate', style: filterItemStyle },
			React.createElement('div', { style: filterLabelStyle }, '预计交车日期'),
			React.createElement(RangePicker, {
				style: filterControlStyle,
				placeholder: ['请选择预计交车开始时间', '请选择预计交车结束时间'],
				value: _planDateRange[0] && _planDateRange[0].length === 2 && window.dayjs ? [_planDateRange[0][0], _planDateRange[0][1]] : null,
				onChange: function(dates) { _planDateRange[1](dates && dates.length === 2 ? dates : null); }
			})),
		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); },
				options: creatorOptions,
				showSearch: true,
				allowClear: true,
				filterOption: filterOption
			}))
	];

	var filterCount = _filterExpanded[0] ? 5 : 3;
	var filterNodes = [];
	for (var i = 0; i < filterCount && i < filterItems.length; i++) {
		filterNodes.push(filterItems[i]);
	}

	// 表格单元格一行显示、根据内容适应宽度
	var cellNoWrap = function() { return { style: { whiteSpace: 'nowrap' } }; };
	var ongoingColumnsWithNowrap = ongoingColumns.map(function(col) { return Object.assign({}, col, { onCell: cellNoWrap }); });
	var completedColumnsWithNowrap = completedColumns.map(function(col) { return Object.assign({}, col, { onCell: cellNoWrap }); });

	var layoutStyle = { padding: '16px 24px 48px', backgroundColor: '#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 reqSubStyle = { fontSize: 14, fontWeight: 500, marginLeft: 16, marginTop: 8, marginBottom: 4, 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)' };
	var reqSubItemStyle = { fontSize: 13, marginLeft: 48, marginTop: 2, marginBottom: 2, lineHeight: 1.6, color: 'rgba(0,0,0,0.7)' };
	var reqBlockStyle = { marginBottom: 8 };

	var reqSpecContent = React.createElement('div', { style: { padding: '0 4px' } },
		React.createElement('div', { style: reqTitleStyle }, '交车任务'),
		React.createElement('div', { style: reqBlockStyle },
			React.createElement('div', { style: reqSectionStyle }, '1.面包屑：'),
			React.createElement('div', { style: reqSubStyle }, '1.1.业务管理-交车任务')
		),
		React.createElement('div', { style: reqBlockStyle },
			React.createElement('div', { style: reqSectionStyle }, '2.筛选：'),
			React.createElement('div', { style: reqItemStyle }, '支持通过合同编码、项目名称、客户名称、预计交车日期、创建人进行筛选，右侧为查询、重置按钮；'),
			React.createElement('div', { style: reqItemStyle }, '2.1.合同编码：选择器，默认为所有合同；提示信息为：请输入或选择合同编码，支持从输入框输入内容进行模糊搜索，下拉显示结果；'),
			React.createElement('div', { style: reqItemStyle }, '2.2.项目名称：选择器，默认为所有项目；提示信息为：请输入或选择项目名称，支持从输入框输入内容进行模糊搜索，下拉显示结果；'),
			React.createElement('div', { style: reqItemStyle }, '2.3.客户名称：选择器，默认为所有客户；提示信息为：请输入或选择客户名称，支持从输入框输入内容进行模糊搜索，下拉显示结果；'),
			React.createElement('div', { style: reqItemStyle }, '2.4.预计交车日期：日期选择器，默认提示信息为：请选择预计交车开始时间 请选择预计交车结束时间，单输入框，双日历，支持时间段选择，精确至天，格式为：YYYY-MM-DD - YYYY-MM-DD；'),
			React.createElement('div', { style: reqItemStyle }, '2.5.创建人：选择器，默认为所有创建人；提示信息为：请输入或选择创建人，支持从输入框输入内容进行模糊搜索，下拉显示结果；'),
			React.createElement('div', { style: reqItemStyle }, '2.6.查询：点击查询，根据单个或多个筛选条件（且）联动表格进行查询；'),
			React.createElement('div', { style: reqItemStyle }, '2.7.重置：点击清空查询条件至默认')
		),
		React.createElement('div', { style: reqBlockStyle },
			React.createElement('div', { style: reqSectionStyle }, '3.列表：分为2个tab：进行中、已完成，右侧为新增；'),
			React.createElement('div', { style: reqSubStyle }, '3.1进行中：显示所有已新增成功，但未完成交车单提交的任务；列表展示以下内容：合同编码、项目名称、客户名称、交车数量、预计交车日期、开始计费日期、创建人、创建时间、最后更新人、最后更新时间、操作；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.1合同编码：显示对应合同编码；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.2.项目名称：显示对应项目名称；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.3.客户名称：显示对应客户名称；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.4.交车数量：显示交车数；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.5.交车区域：显示交车省-市；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.6.交车地点：显示交车详细地址；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.7.预计交车日期：显示预计交车日期，支持某天或某个时间段，格式为YYYY-MM-DD或YYYY-MM-DD至YYYY-MM-DD；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.8.开始计费日期：显示开始计费日期，格式为YYYY-MM-DD，在交车单完成电子签章后开始生效；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.9.创建人：显示交车任务的创建人用户姓名；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.10.创建时间：显示交车任务的创建时间，格式为YYYY-MM-DD；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.11.最后更新人：显示交车任务的最后一次更新人用户姓名；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.12.最后更新时间：显示交车任务的最后一次更新时间，格式为YYYY-MM-DD；'),
			React.createElement('div', { style: reqItemStyle }, '3.1.13.操作：支持查看、编辑、停用/启用；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.1.13.1.查看：跳转查看交车任务；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.1.13.2.编辑：跳转编辑交车任务；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.1.13.3.停用/启用：任务创建后为启用状态，此处为停用，点击停用后，变为启用。停用状态的交车任务不会推送给对应区域运维人员，重新启用时判断预计交车结束日期是否已经过期，如已过期则启用时需要在弹出卡片中重新选择预计交车日期；'),
			React.createElement('div', { style: reqSubStyle }, '3.2.已完成：显示所有已新增成功并完成交车单提交的任务，列表展示以下内容：合同编码、项目名称、客户名称、交车数量、预计交车日期、开始计费日期、创建人、创建时间、最后更新人、最后更新时间、操作；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.1.合同编码：显示对应合同编码；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.2.项目名称：显示对应项目名称；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.3.客户名称：显示对应客户名称；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.4.交车数量：显示交车数，重点色显示，点击弹出气泡卡片，列表显示：车辆类型、品牌、型号、车牌号、实际交车日期、交车人；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.2.4.1.车辆类型：显示车辆类型；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.2.4.2.品牌：显示车辆品牌；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.2.4.3.型号：显示车辆型号；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.2.4.4.车牌号：显示交车车辆车牌号，如果该车还未交车则显示为-；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.2.4.5.实际交车日期：显示实际交车日期，与列表中显示相同，格式为YYYY-MM-DD，如该车还未交车则显示为-；'),
			React.createElement('div', { style: reqSubItemStyle }, '3.2.4.6.交车人：显示实际交车人用户姓名，如该车还未还车则显示为-；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.5.预计交车日期：显示预计交车日期，支持某天或某个时间段，格式为YYYY-MM-DD或YYYY-MM-DD至YYYY-MM-DD；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.6.开始计费日期：显示开始计费日期，格式为YYYY-MM-DD，在交车单完成电子签章后开始生效；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.7.创建人：显示交车任务的创建人用户姓名；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.8.创建时间：显示交车任务的创建时间，格式为YYYY-MM-DD；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.9.最后更新人：显示交车任务的最后一次更新人用户姓名；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.10.最后更新时间：显示交车任务的最后一次更新时间，格式为YYYY-MM-DD；'),
			React.createElement('div', { style: reqItemStyle }, '3.2.11.操作：支持查看；')
		),
		React.createElement('div', { style: reqBlockStyle },
			React.createElement('div', { style: reqSectionStyle }, '4.列表右下方为分页功能，支持单页显示条目选择；')
		)
	);

	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', style: { padding: 0 }, onClick: function() { _reqSpecOpen[1](true); } }, '查看需求说明')
			),
			React.createElement(Card, { style: { marginBottom: 16 } },
				React.createElement('div', {
					style: {
						display: 'grid',
						gridTemplateColumns: '1fr 1fr 1fr',
						gap: '16px 24px',
						alignItems: 'start',
						flex: 1,
						minWidth: 0
					}
				}, 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: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 16 } },
					React.createElement(Tabs, {
						activeKey: _activeTab[0],
						onChange: function(k) { _activeTab[1](k); },
						items: [
							{ key: 'ongoing', label: '进行中' },
							{ key: 'completed', label: '已完成' }
						]
					}),
					React.createElement(Button, { type: 'primary', onClick: function() { message.info('请参照原型业务管理-交车任务-新增交车任务页面'); } }, '新增')
				),
				_activeTab[0] === 'ongoing'
					? React.createElement(Table, {
						rowKey: 'id',
						columns: ongoingColumnsWithNowrap,
						dataSource: filteredOngoing,
						scroll: { x: 1860 },
						size: 'small',
						pagination: {
							showSizeChanger: true,
							showTotal: function(t) { return '共 ' + t + ' 条'; },
							pageSizeOptions: ['10', '20', '50', '100']
						}
					})
					: React.createElement(Table, {
						rowKey: 'id',
						columns: completedColumnsWithNowrap,
						dataSource: filteredCompleted,
						scroll: { x: 1860 },
						size: 'small',
						pagination: {
							showSizeChanger: true,
							showTotal: function(t) { return '共 ' + t + ' 条'; },
							pageSizeOptions: ['10', '20', '50', '100']
						}
					})
			),
			React.createElement(Modal, {
				title: '需求说明',
				open: _reqSpecOpen[0],
				onCancel: function() { _reqSpecOpen[1](false); },
				width: 720,
				footer: React.createElement(Button, { onClick: function() { _reqSpecOpen[1](false); } }, '关闭'),
				bodyStyle: { maxHeight: '70vh', overflow: 'auto' }
			}, reqSpecContent),
			React.createElement(Modal, {
				title: '预计交车日期已过期，请重新选择预计交车日期',
				open: _rescheduleModalVisible[0],
				onCancel: function() {
					_rescheduleModalVisible[1](false);
					_rescheduleTask[1](null);
					_rescheduleDateRange[1](null);
				},
				onOk: handleRescheduleConfirm,
				okText: '确定',
				cancelText: '取消'
			}, React.createElement('div', { style: { padding: '8px 0' } },
				React.createElement('div', { style: { marginBottom: 8, color: '#666', fontSize: 13 } }, '支持选择单日或开始-结束时间段，单日时开始与结束选同一天即可。'),
				React.createElement('span', { style: { marginRight: 8 } }, '预计交车日期：'),
				React.createElement(RangePicker, {
					placeholder: ['请选择开始日期', '请选择结束日期（单日请选同一天）'],
					value: _rescheduleDateRange[0] && _rescheduleDateRange[0].length === 2 && window.dayjs ? [_rescheduleDateRange[0][0], _rescheduleDateRange[0][1]] : null,
					onChange: function(dates) { _rescheduleDateRange[1](dates && dates.length === 2 ? dates : null); }
				})
			))
		)
	);
};
*/