94 lines
3.7 KiB
JavaScript
94 lines
3.7 KiB
JavaScript
import React, { createContext, useEffect, useState } from 'react';
|
||
import { translateAttributes } from '../../utils/usefulFn';
|
||
import List from '../list';
|
||
import ToolBar from '../list/toolBar';
|
||
import ButtonGroup from '../list/buttonGroup';
|
||
import Style from './index.module.less';
|
||
import { useWidth } from '../../platforms/web/responsive/useWidth';
|
||
import { useFeatures } from '../../platforms/web';
|
||
export const TableContext = createContext({
|
||
tableAttributes: undefined,
|
||
entity: undefined,
|
||
schema: undefined,
|
||
setTableAttributes: undefined,
|
||
setSchema: undefined,
|
||
onReset: undefined,
|
||
});
|
||
const ProList = (props) => {
|
||
const { title, buttonGroup, entity, extraActions, onAction, disabledOp, attributes, data, loading, tablePagination, rowSelection, onReload, disableSerialNumber, } = props;
|
||
const features = useFeatures();
|
||
const [tableAttributes, setTableAttributes] = useState([]);
|
||
const [schema, setSchema] = useState(undefined);
|
||
const width = useWidth();
|
||
const isMobile = width === 'xs';
|
||
const initTableAttributes = () => {
|
||
if (schema) {
|
||
const judgeAttributes = translateAttributes(schema, entity, attributes);
|
||
const newTableAttributes = judgeAttributes.map((ele) => ({
|
||
attribute: ele,
|
||
show: true,
|
||
}));
|
||
if (tablePagination && !disableSerialNumber) {
|
||
// 存在分页配置 启用#序号
|
||
newTableAttributes.unshift({
|
||
attribute: {
|
||
path: '#',
|
||
attribute: {
|
||
label: '#',
|
||
path: '#',
|
||
width: 100,
|
||
},
|
||
attrType: 'number',
|
||
attr: '#',
|
||
entity: entity,
|
||
},
|
||
show: true,
|
||
disabled: true,
|
||
disableCheckbox: true,
|
||
});
|
||
}
|
||
setTableAttributes(newTableAttributes);
|
||
}
|
||
};
|
||
useEffect(() => {
|
||
initTableAttributes();
|
||
}, [attributes, schema]);
|
||
const showTotal = (total) => {
|
||
const totalStr = features.locales.t('total number of rows');
|
||
return `${totalStr}：${total > 999 ? `${total} +` : total}`;
|
||
};
|
||
return (<TableContext.Provider value={{
|
||
tableAttributes,
|
||
entity: entity,
|
||
schema,
|
||
setTableAttributes,
|
||
setSchema,
|
||
onReset: () => {
|
||
initTableAttributes();
|
||
},
|
||
}}>
|
||
<div className={Style.container}>
|
||
{!isMobile && (<ToolBar title={title} buttonGroup={buttonGroup} reload={() => {
|
||
onReload && onReload();
|
||
}}/>)}
|
||
{isMobile && <ButtonGroup items={buttonGroup}/>}
|
||
<List entity={entity} extraActions={extraActions} onAction={onAction} disabledOp={disabledOp} attributes={attributes} data={!disableSerialNumber
|
||
? data?.map((ele, index) => {
|
||
if (tablePagination) {
|
||
const total = tablePagination.total || 0;
|
||
const pageSize = tablePagination.pageSize || 20; //条数
|
||
const current = tablePagination.current || 1; //当前页
|
||
ele['#'] =
|
||
pageSize * (current - 1) +
|
||
(index + 1);
|
||
}
|
||
return ele;
|
||
})
|
||
: data} loading={loading} tablePagination={Object.assign({
|
||
showTotal,
|
||
}, tablePagination)} rowSelection={rowSelection}/>
|
||
</div>
|
||
</TableContext.Provider>);
|
||
};
|
||
export default ProList;
|