49 lines
2.2 KiB
JavaScript
49 lines
2.2 KiB
JavaScript
import React from 'react';
|
|
import { Tag, Avatar, Descriptions, Button } from 'antd';
|
|
import ActionPanel from 'oak-frontend-base/es/components/func/actionPanel';
|
|
export default function render(props) {
|
|
const { nickname, avatar, name, userState, idState, gender, idStateStr, idStateColor, userStateColor, userStateStr, mobileText, executableActions, actionDescriptions, birth, mobileUpdatable, } = props.data;
|
|
const { t, onActionClick, onMobileItemClicked } = props.methods;
|
|
return (<>
|
|
<Descriptions extra={<ActionPanel actions={executableActions} actionDescriptions={actionDescriptions} onActionClick={(action) => onActionClick(action)}/>}>
|
|
<Descriptions.Item label={t('avatar')}>
|
|
{avatar ? <Avatar src={avatar}/> : t('unset')}
|
|
</Descriptions.Item>
|
|
|
|
<Descriptions.Item label={t('user:attr.nickname')}>
|
|
{nickname || t('unset')}
|
|
</Descriptions.Item>
|
|
|
|
<Descriptions.Item label={t('user:attr.name')}>
|
|
{name || t('unset')}
|
|
</Descriptions.Item>
|
|
|
|
<Descriptions.Item label={t('user:attr.gender')}>
|
|
{gender ? t(`user:v.gender.${gender}`) : t('unset')}
|
|
</Descriptions.Item>
|
|
|
|
<Descriptions.Item label={t('user:attr.birth')}>
|
|
{birth || t('unset')}
|
|
</Descriptions.Item>
|
|
|
|
<Descriptions.Item label={t('mobile')}>
|
|
{mobileText || t('unset')}
|
|
{mobileUpdatable && <Button type="link" size="small" onClick={() => onMobileItemClicked()}>
|
|
{t('common::action.update')}
|
|
</Button>}
|
|
</Descriptions.Item>
|
|
|
|
<Descriptions.Item label={t('user:attr.userState')}>
|
|
<Tag color={userStateColor}>
|
|
{userStateStr}
|
|
</Tag>
|
|
</Descriptions.Item>
|
|
<Descriptions.Item label={t('user:attr.idState')}>
|
|
<Tag color={idStateColor}>
|
|
{idStateStr}
|
|
</Tag>
|
|
</Descriptions.Item>
|
|
</Descriptions>
|
|
</>);
|
|
}
|