diff --git a/web/src/components/user/UserShareAsset.js b/web/src/components/user/UserShareAsset.js index e412e71..8ed6e77 100644 --- a/web/src/components/user/UserShareAsset.js +++ b/web/src/components/user/UserShareAsset.js @@ -25,6 +25,8 @@ import {message} from "antd/es"; import {DeleteOutlined, ExclamationCircleOutlined, PlusOutlined, SyncOutlined, UndoOutlined} from '@ant-design/icons'; import {PROTOCOL_COLORS} from "../../common/constants"; import UserShareSelectedAsset from "./UserShareSelectedAsset"; +import {isEmpty} from "../../utils/utils"; +import dayjs from "dayjs"; const confirm = Modal.confirm; const {Search} = Input; @@ -34,6 +36,7 @@ const {Title, Text} = Typography; class UserShareAsset extends Component { inputRefOfName = React.createRef(); + inputRefOfIp = React.createRef(); changeOwnerFormRef = React.createRef(); state = { @@ -132,6 +135,17 @@ class UserShareAsset extends Component { this.loadTableData(query); }; + handleSearchByIp = ip => { + let query = { + ...this.state.queryParams, + 'pageIndex': 1, + 'pageSize': this.state.queryParams.pageSize, + 'ip': ip, + } + + this.loadTableData(query); + }; + handleTagsChange = tags => { let query = { ...this.state.queryParams, @@ -177,31 +191,53 @@ class UserShareAsset extends Component { ); } - }, { - title: '网络', - dataIndex: 'ip', - key: 'ip', - render: (text, record) => { - - return record['ip'] + ':' + record['port']; - } }, { title: '连接协议', dataIndex: 'protocol', key: 'protocol', render: (text, record) => { - - return ({text}); + const title = `${record['ip'] + ':' + record['port']}` + return ( + + {text} + + ) + } + }, { + title: '标签', + dataIndex: 'tags', + key: 'tags', + render: tags => { + if (!isEmpty(tags)) { + let tagDocuments = [] + let tagArr = tags.split(','); + for (let i = 0; i < tagArr.length; i++) { + if (tags[i] === '-') { + continue; + } + tagDocuments.push({tagArr[i]}) + } + return tagDocuments; + } } }, { title: '状态', dataIndex: 'active', key: 'active', render: text => { + if (text) { - return (); + return ( + + + + ) } else { - return (); + return ( + + + + ) } } }, { @@ -211,8 +247,15 @@ class UserShareAsset extends Component { }, { title: '创建日期', dataIndex: 'created', - key: 'created' - } + key: 'created', + render: (text, record) => { + return ( + + {dayjs(text).fromNow()} + + ) + } + }, ]; const selectedRowKeys = this.state.selectedRowKeys; @@ -229,10 +272,10 @@ class UserShareAsset extends Component { - + 授权资产列表 - + + + } onClick={() => { this.inputRefOfName.current.setValue(''); + this.inputRefOfIp.current.setValue(''); this.loadTableData({ ...this.state.queryParams, pageIndex: 1, diff --git a/web/src/components/user/UserShareSelectedAsset.js b/web/src/components/user/UserShareSelectedAsset.js index 4364b30..8522dfd 100644 --- a/web/src/components/user/UserShareSelectedAsset.js +++ b/web/src/components/user/UserShareSelectedAsset.js @@ -8,6 +8,8 @@ import {message} from "antd/es"; import {PlusOutlined, SyncOutlined, UndoOutlined} from '@ant-design/icons'; import {PROTOCOL_COLORS} from "../../common/constants"; +import {isEmpty} from "../../utils/utils"; +import dayjs from "dayjs"; const {Search} = Input; const {Content} = Layout; @@ -16,6 +18,7 @@ const {Title} = Typography; class UserShareSelectedAsset extends Component { inputRefOfName = React.createRef(); + inputRefOfIp = React.createRef(); changeOwnerFormRef = React.createRef(); state = { @@ -150,6 +153,17 @@ class UserShareSelectedAsset extends Component { this.loadTableData(query); }; + handleSearchByIp = ip => { + let query = { + ...this.state.queryParams, + 'pageIndex': 1, + 'pageSize': this.state.queryParams.pageSize, + 'ip': ip, + } + + this.loadTableData(query); + }; + handleTagsChange = tags => { console.log(tags) // this.setState({ @@ -222,31 +236,53 @@ class UserShareSelectedAsset extends Component { ); } - }, { - title: '网络', - dataIndex: 'ip', - key: 'ip', - render: (text, record) => { - - return record['ip'] + ':' + record['port']; - } }, { title: '连接协议', dataIndex: 'protocol', key: 'protocol', render: (text, record) => { - - return ({text}); + const title = `${record['ip'] + ':' + record['port']}` + return ( + + {text} + + ) + } + }, { + title: '标签', + dataIndex: 'tags', + key: 'tags', + render: tags => { + if (!isEmpty(tags)) { + let tagDocuments = [] + let tagArr = tags.split(','); + for (let i = 0; i < tagArr.length; i++) { + if (tags[i] === '-') { + continue; + } + tagDocuments.push({tagArr[i]}) + } + return tagDocuments; + } } }, { title: '状态', dataIndex: 'active', key: 'active', render: text => { + if (text) { - return (); + return ( + + + + ) } else { - return (); + return ( + + + + ) } } }, { @@ -256,8 +292,15 @@ class UserShareSelectedAsset extends Component { }, { title: '创建日期', dataIndex: 'created', - key: 'created' - } + key: 'created', + render: (text, record) => { + return ( + + {dayjs(text).fromNow()} + + ) + } + }, ]; const selectedRowKeys = this.state.selectedRowKeys; @@ -300,10 +343,10 @@ class UserShareSelectedAsset extends Component { - + 全部资产列表 - + + + } onClick={() => { this.inputRefOfName.current.setValue(''); + this.inputRefOfIp.current.setValue(''); this.loadTableData({ ...this.state.queryParams, pageIndex: 1,