Add user's avatar.

This commit is contained in:
Yang Luo 2021-02-13 14:49:31 +08:00
parent 4daa4416c1
commit 9677282017
3 changed files with 53 additions and 10 deletions

View File

@ -27,6 +27,7 @@ type User struct {
Password string `xorm:"varchar(100)" json:"password"`
PasswordType string `xorm:"varchar(100)" json:"passwordType"`
DisplayName string `xorm:"varchar(100)" json:"displayName"`
Avatar string `xorm:"varchar(100)" json:"avatar"`
Email string `xorm:"varchar(100)" json:"email"`
Phone string `xorm:"varchar(100)" json:"phone"`
}

View File

@ -17,6 +17,7 @@ import {Button, Card, Col, Input, Row, Select} from 'antd';
import * as UserBackend from "./backend/UserBackend";
import * as OrganizationBackend from "./backend/OrganizationBackend";
import * as Setting from "./Setting";
import {LinkOutlined} from "@ant-design/icons";
const { Option } = Select;
@ -102,6 +103,43 @@ class UserEditPage extends React.Component {
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={2}>
Display Name:
</Col>
<Col span={22} >
<Input value={this.state.user.displayName} onChange={e => {
this.updateUserField('displayName', e.target.value);
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={2}>
Avatar:
</Col>
<Col span={22} >
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={1}>
URL:
</Col>
<Col span={23} >
<Input prefix={<LinkOutlined/>} value={this.state.user.avatar} onChange={e => {
this.updateUserField('avatar', e.target.value);
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={1}>
Preview:
</Col>
<Col span={23} >
<a target="_blank" href={this.state.user.avatar}>
<img src={this.state.user.avatar} alt={this.state.user.avatar} height={90} style={{marginBottom: '20px'}}/>
</a>
</Col>
</Row>
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={2}>
Password Type:
@ -122,16 +160,6 @@ class UserEditPage extends React.Component {
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={2}>
Display Name:
</Col>
<Col span={22} >
<Input value={this.state.user.displayName} onChange={e => {
this.updateUserField('displayName', e.target.value);
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={2}>
Email:

View File

@ -49,6 +49,7 @@ class UserListPage extends React.Component {
password: "123456",
passwordType: "plain",
displayName: `New User - ${this.state.users.length}`,
avatar: "https://casbin.org/img/casbin.svg",
email: "user@example.com",
phone: "1-12345678",
}
@ -144,6 +145,19 @@ class UserListPage extends React.Component {
// width: '100px',
sorter: (a, b) => a.displayName.localeCompare(b.displayName),
},
{
title: 'Avatar',
dataIndex: 'avatar',
key: 'avatar',
width: '100px',
render: (text, record, index) => {
return (
<a target="_blank" href={text}>
<img src={text} alt={text} width={50} />
</a>
)
}
},
{
title: 'Email',
dataIndex: 'email',