refactor: 优化代码结构并修复类型问题
- 移除未使用的TabPane组件 - 修复类型定义和导入方式 - 优化mock数据源的环境变量判断逻辑 - 更新文档结构并归档旧文件 - 添加新的UI组件和Memo组件 - 调整API路径和响应处理
This commit is contained in:
@@ -5,7 +5,6 @@ import { useParams, useNavigate } from 'react-router-dom';
|
||||
import { suppliersDataSource, Supplier, SupplierProduct } from '@/services/suppliersDataSource';
|
||||
|
||||
const { Option } = Select;
|
||||
const { TabPane } = Tabs;
|
||||
|
||||
const SupplierDetail: React.FC = () => {
|
||||
const { id } = useParams<{ id: string }>();
|
||||
@@ -154,157 +153,157 @@ const SupplierDetail: React.FC = () => {
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<Tabs defaultActiveKey="info">
|
||||
<TabPane tab="基本信息" key="info">
|
||||
<Form
|
||||
form={form}
|
||||
layout="vertical"
|
||||
onFinish={handleSubmit}
|
||||
>
|
||||
<Row gutter={16}>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
name="name"
|
||||
label="供应商名称"
|
||||
rules={[{ required: true, message: '请输入供应商名称' }]}
|
||||
>
|
||||
<Input placeholder="请输入供应商名称" />
|
||||
</Form.Item>
|
||||
<Tabs
|
||||
defaultActiveKey="info"
|
||||
items={[
|
||||
{ key: 'info', label: '基本信息', children: (
|
||||
<Form
|
||||
form={form}
|
||||
layout="vertical"
|
||||
onFinish={handleSubmit}
|
||||
>
|
||||
<Row gutter={16}>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
name="name"
|
||||
label="供应商名称"
|
||||
rules={[{ required: true, message: '请输入供应商名称' }]}
|
||||
>
|
||||
<Input placeholder="请输入供应商名称" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
name="contactName"
|
||||
label="联系人"
|
||||
rules={[{ required: true, message: '请输入联系人' }]}
|
||||
>
|
||||
<Input placeholder="请输入联系人" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="contactName"
|
||||
label="联系人"
|
||||
rules={[{ required: true, message: '请输入联系人' }]}
|
||||
>
|
||||
<Input placeholder="请输入联系人" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
name="email"
|
||||
label="邮箱"
|
||||
rules={[{ required: true, message: '请输入邮箱' }]}
|
||||
>
|
||||
<Input placeholder="请输入邮箱" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="email"
|
||||
label="邮箱"
|
||||
rules={[{ required: true, message: '请输入邮箱' }]}
|
||||
>
|
||||
<Input placeholder="请输入邮箱" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
name="phone"
|
||||
label="电话"
|
||||
rules={[{ required: true, message: '请输入电话' }]}
|
||||
>
|
||||
<Input placeholder="请输入电话" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
name="address"
|
||||
label="地址"
|
||||
rules={[{ required: true, message: '请输入地址' }]}
|
||||
>
|
||||
<Input.TextArea rows={4} placeholder="请输入地址" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="phone"
|
||||
label="电话"
|
||||
rules={[{ required: true, message: '请输入电话' }]}
|
||||
>
|
||||
<Input placeholder="请输入电话" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
name="address"
|
||||
label="地址"
|
||||
rules={[{ required: true, message: '请输入地址' }]}
|
||||
>
|
||||
<Input.TextArea rows={4} placeholder="请输入地址" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
name="category"
|
||||
label="类别"
|
||||
rules={[{ required: true, message: '请选择类别' }]}
|
||||
>
|
||||
<Select placeholder="请选择类别">
|
||||
<Option value="Electronics">Electronics</Option>
|
||||
<Option value="Clothing">Clothing</Option>
|
||||
<Option value="Home Goods">Home Goods</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="category"
|
||||
label="类别"
|
||||
rules={[{ required: true, message: '请选择类别' }]}
|
||||
>
|
||||
<Select placeholder="请选择类别">
|
||||
<Option value="Electronics">Electronics</Option>
|
||||
<Option value="Clothing">Clothing</Option>
|
||||
<Option value="Home Goods">Home Goods</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
name="status"
|
||||
label="状态"
|
||||
rules={[{ required: true, message: '请选择状态' }]}
|
||||
>
|
||||
<Select placeholder="请选择状态">
|
||||
<Option value="active">活跃</Option>
|
||||
<Option value="inactive">非活跃</Option>
|
||||
<Option value="pending">待审核</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
<Form.Item
|
||||
name="status"
|
||||
label="状态"
|
||||
rules={[{ required: true, message: '请选择状态' }]}
|
||||
>
|
||||
<Select placeholder="请选择状态">
|
||||
<Option value="active">活跃</Option>
|
||||
<Option value="inactive">非活跃</Option>
|
||||
<Option value="pending">待审核</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Row gutter={16}>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
name="leadTime"
|
||||
label="交货期(天)"
|
||||
rules={[{ required: true, message: '请输入交货期' }]}
|
||||
>
|
||||
<Input type="number" placeholder="请输入交货期" />
|
||||
</Form.Item>
|
||||
<Row gutter={16}>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
name="leadTime"
|
||||
label="交货期(天)"
|
||||
rules={[{ required: true, message: '请输入交货期' }]}
|
||||
>
|
||||
<Input type="number" placeholder="请输入交货期" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
name="minOrder"
|
||||
label="最小订单量"
|
||||
rules={[{ required: true, message: '请输入最小订单量' }]}
|
||||
>
|
||||
<Input type="number" placeholder="请输入最小订单量" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
name="paymentTerms"
|
||||
label="付款条件"
|
||||
rules={[{ required: true, message: '请输入付款条件' }]}
|
||||
>
|
||||
<Input placeholder="请输入付款条件" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="minOrder"
|
||||
label="最小订单量"
|
||||
rules={[{ required: true, message: '请输入最小订单量' }]}
|
||||
>
|
||||
<Input type="number" placeholder="请输入最小订单量" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
name="paymentTerms"
|
||||
label="付款条件"
|
||||
rules={[{ required: true, message: '请输入付款条件' }]}
|
||||
>
|
||||
<Input placeholder="请输入付款条件" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
name="notes"
|
||||
label="备注"
|
||||
>
|
||||
<Input.TextArea rows={3} placeholder="请输入备注" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
<Form.Item
|
||||
name="notes"
|
||||
label="备注"
|
||||
>
|
||||
<Input.TextArea rows={3} placeholder="请输入备注" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Form.Item>
|
||||
<Button type="primary" htmlType="submit" loading={loading} icon={<SaveOutlined />}>
|
||||
保存
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</TabPane>
|
||||
|
||||
<TabPane tab="产品列表" key="products">
|
||||
<Card title="供应商产品">
|
||||
<Table
|
||||
columns={productColumns}
|
||||
dataSource={products}
|
||||
loading={loading}
|
||||
rowKey="id"
|
||||
pagination={{
|
||||
pageSize: 10,
|
||||
showSizeChanger: true,
|
||||
}}
|
||||
/>
|
||||
</Card>
|
||||
</TabPane>
|
||||
|
||||
<TabPane tab="历史订单" key="orders">
|
||||
<Card title="历史订单">
|
||||
<div style={{ textAlign: 'center', padding: '50px 0' }}>
|
||||
<p>历史订单列表</p>
|
||||
</div>
|
||||
</Card>
|
||||
</TabPane>
|
||||
|
||||
<TabPane tab="绩效评估" key="performance">
|
||||
<Card title="绩效评估">
|
||||
<div style={{ textAlign: 'center', padding: '50px 0' }}>
|
||||
<p>绩效评估图表</p>
|
||||
</div>
|
||||
</Card>
|
||||
</TabPane>
|
||||
</Tabs>
|
||||
<Form.Item>
|
||||
<Button type="primary" htmlType="submit" loading={loading} icon={<SaveOutlined />}>
|
||||
保存
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
)},
|
||||
{ key: 'products', label: '产品列表', children: (
|
||||
<Card title="供应商产品">
|
||||
<Table
|
||||
columns={productColumns}
|
||||
dataSource={products}
|
||||
loading={loading}
|
||||
rowKey="id"
|
||||
pagination={{
|
||||
pageSize: 10,
|
||||
showSizeChanger: true,
|
||||
}}
|
||||
/>
|
||||
</Card>
|
||||
)},
|
||||
{ key: 'orders', label: '历史订单', children: (
|
||||
<Card title="历史订单">
|
||||
<div style={{ textAlign: 'center', padding: '50px 0' }}>
|
||||
<p>历史订单列表</p>
|
||||
</div>
|
||||
</Card>
|
||||
)},
|
||||
{ key: 'performance', label: '绩效评估', children: (
|
||||
<Card title="绩效评估">
|
||||
<div style={{ textAlign: 'center', padding: '50px 0' }}>
|
||||
<p>绩效评估图表</p>
|
||||
</div>
|
||||
</Card>
|
||||
)},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -77,7 +77,7 @@ const Suppliers: React.FC = () => {
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
render: (status: string) => {
|
||||
const statusMap = {
|
||||
const statusMap: Record<string, string> = {
|
||||
active: '活跃',
|
||||
inactive: '非活跃',
|
||||
pending: '待审核',
|
||||
|
||||
Reference in New Issue
Block a user