oak-general-business/app/pages/userRelation/listTwo/index.tsx

67 lines
2.4 KiB
TypeScript

import * as React from 'react';
import { Cell, Image, Tag, Fab } from 'tdesign-mobile-react';
import { Icon } from 'tdesign-icons-react';
export default function render() {
const { t } = this;
const { entity } = this.props;
const { users } = this.state;
return (
<div
style={{
height: '100vh',
}}
>
{users?.map((ele, index) => {
return (
<Cell
onClick={(e) => this.goDetail(ele.id)}
key={index}
title={ele.nickname || '未设置'}
image={
<Image
src={ele.avatar}
alt="头像"
style={{ width: 80, height: 80 }}
/>
}
description={
<div className="description">
<div className="name">
: {ele.name || '未设置'}
</div>
<div className="mobile">
: {ele.mobile || '未设置'}
</div>
<div className="relation">
{ele.relations?.map((relation, index) => (
<Tag
key={index}
variant="outline"
theme="primary"
>
{t(`${entity}:r.${relation}`)}
</Tag>
))}
</div>
</div>
}
/>
);
})}
<Fab
buttonProps={{
theme: 'primary',
shape: 'circle',
size: 'large',
}}
icon={<Icon name="add" />}
style={{ right: '16px', bottom: '32px' }}
onClick={() => {
this.goUpsert();
}}
/>
</div>
);
}