完善资产的授权功能
This commit is contained in:
dushixiang
@ -1,11 +1,13 @@
|
||||
import React, {Component} from 'react';
|
||||
|
||||
import {
|
||||
Alert,
|
||||
Badge,
|
||||
Button,
|
||||
Col,
|
||||
Divider,
|
||||
Dropdown,
|
||||
Form,
|
||||
Input,
|
||||
Layout,
|
||||
Menu,
|
||||
@ -17,6 +19,7 @@ import {
|
||||
Table,
|
||||
Tag,
|
||||
Tooltip,
|
||||
Transfer,
|
||||
Typography
|
||||
} from "antd";
|
||||
import qs from "qs";
|
||||
@ -36,6 +39,7 @@ import {
|
||||
} from '@ant-design/icons';
|
||||
import {PROTOCOL_COLORS} from "../../common/constants";
|
||||
import Logout from "../user/Logout";
|
||||
import {hasPermission, isAdmin} from "../../service/permission";
|
||||
|
||||
const confirm = Modal.confirm;
|
||||
const {Search} = Input;
|
||||
@ -55,6 +59,7 @@ const routes = [
|
||||
class Asset extends Component {
|
||||
|
||||
inputRefOfName = React.createRef();
|
||||
changeOwnerFormRef = React.createRef();
|
||||
|
||||
state = {
|
||||
items: [],
|
||||
@ -73,6 +78,13 @@ class Asset extends Component {
|
||||
model: {},
|
||||
selectedRowKeys: [],
|
||||
delBtnLoading: false,
|
||||
changeOwnerModalVisible: false,
|
||||
changeSharerModalVisible: false,
|
||||
changeOwnerConfirmLoading: false,
|
||||
changeSharerConfirmLoading: false,
|
||||
users: [],
|
||||
selected: {},
|
||||
selectedSharers: [],
|
||||
};
|
||||
|
||||
async componentDidMount() {
|
||||
@ -331,6 +343,49 @@ class Asset extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
handleSearchByNickname = async nickname => {
|
||||
const result = await request.get(`/users/paging?pageIndex=1&pageSize=100&nickname=${nickname}`);
|
||||
if (result.code !== 1) {
|
||||
message.error(result.message, 10);
|
||||
return;
|
||||
}
|
||||
|
||||
const items = result['data']['items'].map(item => {
|
||||
return {'key': item['id'], ...item}
|
||||
})
|
||||
|
||||
this.setState({
|
||||
users: items
|
||||
})
|
||||
}
|
||||
|
||||
handleSharersChange = async targetKeys => {
|
||||
this.setState({
|
||||
selectedSharers: targetKeys
|
||||
})
|
||||
}
|
||||
|
||||
handleShowSharer = async (record) => {
|
||||
let r1 = this.handleSearchByNickname('');
|
||||
let r2 = request.get(`/resources/${record['id']}/assign`);
|
||||
|
||||
await r1;
|
||||
let result = await r2;
|
||||
|
||||
let selectedSharers = [];
|
||||
if (result['code'] !== 1) {
|
||||
message.error(result['message']);
|
||||
} else {
|
||||
selectedSharers = result['data'];
|
||||
}
|
||||
|
||||
this.setState({
|
||||
selectedSharers: selectedSharers,
|
||||
selected: record,
|
||||
changeSharerModalVisible: true
|
||||
})
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
const columns = [{
|
||||
@ -408,6 +463,37 @@ class Asset extends Component {
|
||||
onClick={() => this.copy(record.id)}>复制</Button>
|
||||
</Menu.Item>
|
||||
|
||||
{isAdmin() ?
|
||||
<Menu.Item key="1">
|
||||
<Button type="text" size='small'
|
||||
disabled={!hasPermission(record['owner'])}
|
||||
onClick={() => {
|
||||
this.handleSearchByNickname('')
|
||||
.then(() => {
|
||||
this.setState({
|
||||
changeOwnerModalVisible: true,
|
||||
selected: record,
|
||||
})
|
||||
this.changeOwnerFormRef
|
||||
.current
|
||||
.setFieldsValue({
|
||||
owner: record['owner']
|
||||
})
|
||||
});
|
||||
|
||||
}}>更换所有者</Button>
|
||||
</Menu.Item> : undefined
|
||||
}
|
||||
|
||||
|
||||
<Menu.Item key="2">
|
||||
<Button type="text" size='small'
|
||||
disabled={!hasPermission(record['owner'])}
|
||||
onClick={async () => {
|
||||
await this.handleShowSharer(record);
|
||||
}}>更新授权人</Button>
|
||||
</Menu.Item>
|
||||
|
||||
<Menu.Divider/>
|
||||
<Menu.Item key="3">
|
||||
<Button type="text" size='small' danger
|
||||
@ -432,6 +518,19 @@ class Asset extends Component {
|
||||
}
|
||||
];
|
||||
|
||||
if (isAdmin()) {
|
||||
columns.splice(6, 0, {
|
||||
title: '授权人数',
|
||||
dataIndex: 'sharerCount',
|
||||
key: 'sharerCount',
|
||||
render: (text, record, index) => {
|
||||
return <Button type='link' onClick={async () => {
|
||||
await this.handleShowSharer(record, true);
|
||||
}}>{text}</Button>
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const selectedRowKeys = this.state.selectedRowKeys;
|
||||
const rowSelection = {
|
||||
selectedRowKeys: this.state.selectedRowKeys,
|
||||
@ -584,6 +683,113 @@ class Asset extends Component {
|
||||
: null
|
||||
}
|
||||
|
||||
|
||||
<Modal title={<text>更换资源「<strong style={{color: '#1890ff'}}>{this.state.selected['name']}</strong>」的所有者
|
||||
</text>}
|
||||
visible={this.state.changeOwnerModalVisible}
|
||||
confirmLoading={this.state.changeOwnerConfirmLoading}
|
||||
onOk={() => {
|
||||
this.setState({
|
||||
changeOwnerConfirmLoading: true
|
||||
});
|
||||
|
||||
let changeOwnerModalVisible = false;
|
||||
this.changeOwnerFormRef
|
||||
.current
|
||||
.validateFields()
|
||||
.then(async values => {
|
||||
let result = await request.post(`/assets/${this.state.selected['id']}/change-owner?owner=${values['owner']}`);
|
||||
if (result['code'] === 1) {
|
||||
message.success('操作成功');
|
||||
this.loadTableData();
|
||||
} else {
|
||||
message.success(result['message'], 10);
|
||||
changeOwnerModalVisible = true;
|
||||
}
|
||||
})
|
||||
.catch(info => {
|
||||
|
||||
})
|
||||
.finally(() => {
|
||||
this.setState({
|
||||
changeOwnerConfirmLoading: false,
|
||||
changeOwnerModalVisible: changeOwnerModalVisible
|
||||
})
|
||||
});
|
||||
}}
|
||||
onCancel={() => {
|
||||
this.setState({
|
||||
changeOwnerModalVisible: false
|
||||
})
|
||||
}}
|
||||
>
|
||||
|
||||
<Form ref={this.changeOwnerFormRef}>
|
||||
|
||||
<Form.Item name='owner' rules={[{required: true, message: '请选择所有者'}]}>
|
||||
<Select
|
||||
showSearch
|
||||
placeholder='请选择所有者'
|
||||
onSearch={this.handleSearchByNickname}
|
||||
filterOption={false}
|
||||
>
|
||||
{this.state.users.map(d => <Select.Option key={d.id}
|
||||
value={d.id}>{d.nickname}</Select.Option>)}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Alert message="更换资源所有者不会影响授权凭证的所有者" type="info" showIcon/>
|
||||
|
||||
</Form>
|
||||
</Modal>
|
||||
|
||||
<Modal title={<text>更新资源「<strong style={{color: '#1890ff'}}>{this.state.selected['name']}</strong>」的授权人
|
||||
</text>}
|
||||
visible={this.state.changeSharerModalVisible}
|
||||
confirmLoading={this.state.changeSharerConfirmLoading}
|
||||
onOk={async () => {
|
||||
this.setState({
|
||||
changeSharerConfirmLoading: true
|
||||
});
|
||||
|
||||
let changeSharerModalVisible = false;
|
||||
|
||||
let result = await request.post(`/resources/${this.state.selected['id']}/assign?type=asset&userIds=${this.state.selectedSharers.join(',')}`);
|
||||
if (result['code'] === 1) {
|
||||
message.success('操作成功');
|
||||
this.loadTableData();
|
||||
} else {
|
||||
message.error(result['message'], 10);
|
||||
changeSharerModalVisible = true;
|
||||
}
|
||||
|
||||
this.setState({
|
||||
changeSharerConfirmLoading: false,
|
||||
changeSharerModalVisible: changeSharerModalVisible
|
||||
})
|
||||
}}
|
||||
onCancel={() => {
|
||||
this.setState({
|
||||
changeSharerModalVisible: false
|
||||
})
|
||||
}}
|
||||
okButtonProps={{disabled: !hasPermission(this.state.selected['owner'])}}
|
||||
>
|
||||
|
||||
<Transfer
|
||||
dataSource={this.state.users}
|
||||
disabled={!hasPermission(this.state.selected['owner'])}
|
||||
showSearch
|
||||
titles={['未授权', '已授权']}
|
||||
operations={['授权', '移除']}
|
||||
listStyle={{
|
||||
width: 250,
|
||||
height: 300,
|
||||
}}
|
||||
targetKeys={this.state.selectedSharers}
|
||||
onChange={this.handleSharersChange}
|
||||
render={item => `${item.nickname}`}
|
||||
/>
|
||||
</Modal>
|
||||
</Content>
|
||||
</>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user