oak-general-business/es/components/userRelation/list/web.pc.js

112 lines
4.3 KiB
JavaScript

import React, { useState } from 'react';
import { Table, Button, Avatar, Space, Tag, Modal, } from 'antd';
export default function Render(props) {
const { oakPagination, users = [], entity, entityId, oakLoading, } = props.data;
const { pageSize, total, currentPage } = oakPagination || {};
const { goCreate, t, setCurrentPage, setPageSize, confirmDelete, goUpdate, } = props.methods;
const [idRemove, setIdRemove] = useState(undefined);
const [inviteVisible, setInviteVisible] = useState(false);
return (<>
<Space style={{ marginBottom: 16 }}>
<Button type="primary" onClick={() => goCreate()}>
{t('common::action.add')}
</Button>
{/* <Button
onClick={() => setInviteVisible(true)}
>
邀请记录
</Button> */}
</Space>
<Table loading={oakLoading} rowKey="id" columns={[
{
width: 100,
dataIndex: 'index',
title: '#',
render: (value, record, index) => index + 1,
},
{
dataIndex: 'avatar',
title: t('avatar'),
render: (value, record, index) => {
return value ? (<Avatar src={value} shape="circle"/>) : (<span>{t('common::unset')}</span>);
},
},
{
dataIndex: 'name',
title: t('user:attr.name'),
},
{
dataIndex: 'nickname',
title: t('user:attr.nickname'),
},
{
dataIndex: 'mobile',
title: t('mobile:name'),
},
{
dataIndex: 'relations',
title: t('relations'),
render: (value, record, index) => {
return (<Space>
{record.userRelation$user?.map((ele, index) => (<Tag key={ele.id}>
{ele.relation.name
? t(entity + ':r.' + ele.relation.name)
: ele.relation.display}
</Tag>))}
</Space>);
},
},
{
title: t('common::operate'),
dataIndex: 'operate',
render: (value, record, index) => {
return (<Space>
<a onClick={(e) => goUpdate(record.id)}>
{!!record.userRelation$user?.length
? t('common::action.update')
: t('common::action.grant')}
</a>
{!!record.userRelation$user?.length && (<a style={{
color: 'var(--oak-color-error)',
}} onClick={() => setIdRemove(record.id)}>
{t('common::action.revoke')}
</a>)}
</Space>);
},
},
]} dataSource={users} pagination={{
total,
pageSize,
current: currentPage,
onShowSizeChange: (current, size) => {
setPageSize(current);
},
onChange: (page, pageSize) => {
setCurrentPage(page);
},
}}/>
<Modal title={t('common::areYouSure')} open={!!idRemove} onOk={async () => {
await confirmDelete(idRemove);
setIdRemove(undefined);
}} onCancel={() => setIdRemove(undefined)} cancelText={t('common::action.cancel')} okText={t('common::action.confirm')}>
<p>{t('confirmRevokeAll')}</p>
</Modal>
{/* <Modal
title="邀请记录"
open={inviteVisible}
onCancel={() => setInviteVisible(false)}
width="80%"
footer={null}
>
<UserEntityGrantList
entity={entity}
entityId={entityId}
variant="dialog"
oakPath="$userRelation/list-userEntityGrant/list"
/>
</Modal> */}
</>);
}