evan/next-terminal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完善资产的授权功能

Browse Source
This commit is contained in:
dushixiang
2021-01-15 22:13:46 +08:00
parent f38c77c202
commit 1a3f7acd1e
11 changed files with 390 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

206
web/src/components/asset/Asset.js
View File

@ -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>
</>
);

95
web/src/components/credential/Credential.js
View File

@ -34,7 +34,7 @@ import {
} from '@ant-design/icons';
import {itemRender} from "../../utils/utils";
import Logout from "../user/Logout";
import {hasPermission} from "../../service/permission";
import {hasPermission, isAdmin} from "../../service/permission";
const confirm = Modal.confirm;
const {Search} = Input;
@ -55,7 +55,6 @@ class Credential extends Component {
inputRefOfName = React.createRef();
changeOwnerFormRef = React.createRef();
changeSharerFormRef = React.createRef();
state = {
items: [],
@ -173,26 +172,32 @@ class Credential extends Component {
showModal = async (title, id = null, index) => {
let items = this.state.items;
items[index].updateBtnLoading = true;
this.setState({
items: items
});
let result = await request.get('/credentials/' + id);
if (result['code'] !== 1) {
message.error(result['message']);
items[index].updateBtnLoading = false;
let model = {}
if (id) {
items[index].updateBtnLoading = true;
this.setState({
items: items
});
return;
let result = await request.get('/credentials/' + id);
if (result['code'] !== 1) {
message.error(result['message']);
items[index].updateBtnLoading = false;
this.setState({
items: items
});
return;
}
items[index].updateBtnLoading = false;
model = result['data']
}
items[index].updateBtnLoading = false;
this.setState({
modalTitle: title,
modalVisible: true,
model: result['data'],
model: model,
items: items
});
};
@ -287,7 +292,7 @@ class Credential extends Component {
})
}
handleShowSharer = async (record, disabled) => {
handleShowSharer = async (record) => {
let r1 = this.handleSearchByNickname('');
let r2 = request.get(`/resources/${record['id']}/assign`);
@ -368,32 +373,35 @@ class Credential extends Component {
const menu = (
<Menu>
<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']
{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
}
}}>更换所有者</Button>
</Menu.Item>
<Menu.Item key="2">
<Button type="text" size='small'
disabled={!hasPermission(record['owner'])}
onClick={async () => {
await this.handleShowSharer(record, false);
}}>授权</Button>
await this.handleShowSharer(record);
}}>更新授权人</Button>
</Menu.Item>
<Menu.Divider/>
@ -421,14 +429,14 @@ class Credential extends Component {
}
];
if(hasPermission()){
columns.splice(5,0,{
if (isAdmin()) {
columns.splice(5, 0, {
title: '授权人数',
dataIndex: 'sharerCount',
key: 'sharerCount',
render: (text, record, index) => {
return <Button type='link' onClick={async () => {
await this.handleShowSharer(record, true);
await this.handleShowSharer(record);
}}>{text}</Button>
}
});
@ -490,7 +498,7 @@ class Credential extends Component {
<Tooltip title="新增">
<Button type="dashed" icon={<PlusOutlined/>}
onClick={() => this.showModal('新增凭证', null)}>
onClick={() => this.showModal('新增凭证')}>
</Button>
</Tooltip>
@ -559,14 +567,13 @@ class Credential extends Component {
handleCancel={this.handleCancelModal}
confirmLoading={this.state.modalConfirmLoading}
model={this.state.model}
footer={this.state.modalTitle.indexOf('查看') > -1 ? null : undefined}
>
</CredentialModal>
: null
}
<Modal title={`更换授权凭证「${this.state.selected['name']}」的所有者`}
<Modal title={<text>更换资源「<strong style={{color: '#1890ff'}}>{this.state.selected['name']}</strong>」的所有者</text>}
visible={this.state.changeOwnerModalVisible}
confirmLoading={this.state.changeOwnerConfirmLoading}
onOk={() => {
@ -620,7 +627,7 @@ class Credential extends Component {
</Form>
</Modal>
<Modal title={`授权凭证「${this.state.selected['name']}」的授权者`}
<Modal title={<text>更新资源「<strong style={{color: '#1890ff'}}>{this.state.selected['name']}</strong>」的授权人</text>}
visible={this.state.changeSharerModalVisible}
confirmLoading={this.state.changeSharerConfirmLoading}
onOk={async () => {
@ -630,12 +637,12 @@ class Credential extends Component {
let changeSharerModalVisible = false;
let result = await request.post(`/resources/${this.state.selected['id']}/assign?userIds=${this.state.selectedSharers.join(',')}`);
let result = await request.post(`/resources/${this.state.selected['id']}/assign?type=credential&userIds=${this.state.selectedSharers.join(',')}`);
if (result['code'] === 1) {
message.success('操作成功');
this.loadTableData();
} else {
message.success(result['message'], 10);
message.error(result['message'], 10);
changeSharerModalVisible = true;
}
@ -658,6 +665,10 @@ class Credential extends Component {
showSearch
titles={['未授权', '已授权']}
operations={['授权', '移除']}
listStyle={{
width: 250,
height: 300,
}}
targetKeys={this.state.selectedSharers}
onChange={this.handleSharersChange}
render={item => `${item.nickname}`}

7
web/src/service/permission.js
View File

@ -6,4 +6,11 @@ export function hasPermission(owner) {
}
return user['id'] === owner;
}
export function isAdmin(){
let userJsonStr = sessionStorage.getItem('user');
let user = JSON.parse(userJsonStr);
return user['role'] === 'admin';
}