75 lines
2.6 KiB
JavaScript
75 lines
2.6 KiB
JavaScript
import React from 'react';
|
|
import { Tag, Card, Avatar } from 'antd';
|
|
import { UserOutlined } from '@ant-design/icons';
|
|
import FilterPanel from 'oak-frontend-base/es/components/filterPanel';
|
|
import ListPro from 'oak-frontend-base/es/components/listPro';
|
|
export default function Render(props) {
|
|
const { methods, data } = props;
|
|
const { t, setPageSize, setCurrentPage, gotoCreateUser, onCellClicked } = methods;
|
|
const { oakFullpath, oakLoading, userArr = [], isRoot, } = data;
|
|
return (<Card title={<FilterPanel entity="user" oakPath={oakFullpath} columns={[
|
|
{
|
|
attr: 'nickname',
|
|
op: '$includes',
|
|
},
|
|
{
|
|
attr: 'name',
|
|
op: '$includes',
|
|
},
|
|
{
|
|
attr: 'userState',
|
|
},
|
|
]}/>}>
|
|
<ListPro oakPath={`${oakFullpath}`} entity="user" buttonGroup={[{
|
|
label: `${t('common::action.add')}${t('user:name')}`,
|
|
show: isRoot,
|
|
type: 'primary',
|
|
onClick: () => gotoCreateUser()
|
|
}]} loading={oakLoading} data={userArr} attributes={[
|
|
{
|
|
width: 100,
|
|
path: 'avatar',
|
|
label: t('avatar'),
|
|
render: (row) => {
|
|
if (!row.avatar) {
|
|
return (<Avatar icon={<UserOutlined />}></Avatar>);
|
|
}
|
|
return <Avatar src={row.avatar} shape="circle"/>;
|
|
},
|
|
},
|
|
{
|
|
path: 'nickname',
|
|
label: t('user:attr.nickname'),
|
|
},
|
|
{
|
|
path: 'name',
|
|
label: t('user:attr.name'),
|
|
},
|
|
{
|
|
path: 'mobile',
|
|
label: t('mobile:name'),
|
|
},
|
|
{
|
|
path: 'userState',
|
|
label: t('user:attr.userState'),
|
|
render: (record) => {
|
|
return (<Tag color={record.userStateColor}>
|
|
{record.userStateStr}
|
|
</Tag>);
|
|
},
|
|
},
|
|
]} extraActions={[{
|
|
label: t('common::action.detail'),
|
|
action: 'detail',
|
|
show: true,
|
|
}]} onAction={(row, action) => {
|
|
switch (action) {
|
|
case 'detail': {
|
|
onCellClicked(row.id);
|
|
}
|
|
default: { }
|
|
}
|
|
}}/>
|
|
</Card>);
|
|
}
|