76 lines
3.7 KiB
JavaScript
76 lines
3.7 KiB
JavaScript
function DataEditor({ item, items, setItems, setRootNodeName }) {
|
|
|
|
if (!item) {
|
|
return React.createElement('div', { className: 'workspace-panel flex items-center justify-center h-full' },
|
|
React.createElement('p', { className: 'text-gray-500' }, '未选择任何件号')
|
|
);
|
|
}
|
|
|
|
const isRoot = item.isRoot;
|
|
|
|
if (isRoot) {
|
|
return React.createElement('div', { className: 'workspace-panel p-4 h-full' },
|
|
React.createElement('h2', { className: 'text-lg font-semibold mb-4' }, `编辑总装图`),
|
|
React.createElement('div', { className: 'space-y-4' },
|
|
React.createElement('div', {},
|
|
React.createElement('label', { className: 'block text-sm font-medium text-gray-700 mb-1' }, '总装图名称'),
|
|
React.createElement('input', {
|
|
type: 'text',
|
|
name: 'name',
|
|
value: item.name,
|
|
onChange: (e) => setRootNodeName(e.target.value),
|
|
className: 'form-input'
|
|
})
|
|
),
|
|
React.createElement('p', {className: 'text-xs text-gray-500 mt-1'}, '这是项目的根节点，只可修改名称。')
|
|
)
|
|
);
|
|
}
|
|
|
|
const handleInputChange = (e) => {
|
|
const { name, value } = e.target;
|
|
const isNumber = ['quantity', 'weight'].includes(name);
|
|
|
|
setItems(prevItems => ({
|
|
...prevItems,
|
|
[item.id]: {
|
|
...prevItems[item.id],
|
|
[name]: isNumber ? Number(value) : value
|
|
}
|
|
}));
|
|
};
|
|
|
|
const isParent = item.children && item.children.length > 0;
|
|
|
|
return React.createElement('div', { className: 'workspace-panel p-4 h-full' },
|
|
React.createElement('h2', { className: 'text-lg font-semibold mb-4' }, `编辑: ${item.id}`),
|
|
React.createElement('div', { className: 'space-y-4' },
|
|
React.createElement('div', {},
|
|
React.createElement('label', { className: 'block text-sm font-medium text-gray-700 mb-1' }, '件号 (不可修改)'),
|
|
React.createElement('input', { type: 'text', readOnly: true, value: item.id, className: 'form-input bg-gray-100' })
|
|
),
|
|
React.createElement('div', {},
|
|
React.createElement('label', { className: 'block text-sm font-medium text-gray-700 mb-1' }, '名称'),
|
|
React.createElement('input', { type: 'text', name: 'name', value: item.name, onChange: handleInputChange, className: 'form-input' })
|
|
),
|
|
React.createElement('div', {},
|
|
React.createElement('label', { className: 'block text-sm font-medium text-gray-700 mb-1' }, '数量'),
|
|
React.createElement('input', { type: 'number', name: 'quantity', value: item.quantity, onChange: handleInputChange, className: 'form-input' })
|
|
),
|
|
React.createElement('div', {},
|
|
React.createElement('label', { className: 'block text-sm font-medium text-gray-700 mb-1' }, '重量 (kg)'),
|
|
React.createElement('input', {
|
|
type: 'number',
|
|
name: 'weight',
|
|
value: item.weight,
|
|
onChange: handleInputChange,
|
|
className: 'form-input',
|
|
readOnly: isParent, // 如果是父项，重量由子项计算，不可直接编辑
|
|
title: isParent ? '父项重量由子项自动汇总' : ''
|
|
}),
|
|
isParent && React.createElement('p', {className: 'text-xs text-gray-500 mt-1'}, '父项重量由子项自动汇总，此处不可编辑。')
|
|
)
|
|
)
|
|
);
|
|
}
|