CarList.tsx
3.75 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
import React from 'react';
import { Table, Divider } from 'antd';
import { useStore } from '../index';
import { history } from 'umi';
import style from '../index.less';
import defaultThum from '@/assets/defaultThum.png';
import { render } from 'react-dom';
export default function CarList() {
const { list, paginationConfig, loading, setCurrentItem, setVisible, setCopyVisible } = useStore();
const columns = [
{
title: '编号',
dataIndex: 'id',
align: "center"
},
{
title: '整车型号代码',
dataIndex: 'specCode',
align: "center",
},
{
title: '车型分类名称',
dataIndex: 'classifyName',
align: "center",
},
{
title: '配置名称',
dataIndex: 'name',
width: "13%",
align: "center"
}, {
title: '配置代码',
dataIndex: 'specCodeList',
align: "center",
render: (text:any, record:any) => (text ? text.map((res:any, index:any) => <div key={`item_${index}`}>{res}</div>) : '——'),
}, {
title: '品牌',
dataIndex: 'brandName',
align: "center"
}, {
title: '厂商',
width: "13%",
dataIndex: 'factoryName',
align: "center"
}, {
title: '车系',
dataIndex: 'seriesName',
align: "center"
}, {
title: '缩略图',
dataIndex: 'thumbnail',
width: 120,
align: "center",
render: (val: string) => <img style={{ objectFit: 'cover', width: 60, height: 30 }} src={val || defaultThum} alt="" />
}, {
title: '生产状态',
dataIndex: 'proStatus',
align: "center",
render: (val: any) => {
switch (val) {
case 1:
return (<div>在产</div>);
case 0:
return (<div>停产</div>);
default:
return (<div>未知</div>);
}
}
}, {
title: '销售状态',
dataIndex: 'saleStatus',
align: "center",
render: (val: any) => {
switch (val) {
case 2:
return (<div>预售</div>);
case 1:
return (<div>在售</div>);
case 0:
return (<div>停售</div>);
default:
return (<div>未知</div>);
}
}
},
// {
// title: '是否有效',
// dataIndex: 'yn',
// align: "center",
// render: (val: any) => {
// switch (val) {
// case true:
// return (<div>有效</div>);
// case false:
// return (<div>无效</div>);
// default:
// return (<div>未知</div>);
// }
// }
// },
{
title: '操作',
align: "center",
render: (text: any, row: any) => (
<React.Fragment key="key">
<a href="#" onClick={(e) => { e.preventDefault(); setCurrentItem(row); setVisible(true); }}>编辑 </a>
{/* <Divider type="vertical" />
<Popconfirm placement="top" title={`是否${row.yn ? '禁用' : '启用'}【${row.name}】?`} onConfirm={e => changeStatus(e, row)}>
<a href="#">{row.yn ? '禁用' : '启用'} </a>
</Popconfirm> */}
{/* <Divider type="vertical" />
<a onClick={() => { history.push(`/oop/carPara?id=${row.id}`); }}>参数</a> */}
<Divider type="vertical" />
<a onClick={() => { setCurrentItem(row); setCopyVisible(true); }}>复制</a>
<Divider type="vertical" />
<a onClick={() => history.push(`/oop/car/atlas/${row.seriesId}`)}>图集</a>
</React.Fragment>
)
}
];
return (
<Table
className={style.table}
loading={loading}
rowKey={record => record.id}
dataSource={list}
columns={columns}
pagination={paginationConfig}
size="small"
/>
);
}