diff --git a/src/pages/container-service/containers/Containers/Detail/BaseDetail.jsx b/src/pages/container-service/containers/Containers/Detail/BaseDetail.jsx index e71f85ef..493c7d66 100644 --- a/src/pages/container-service/containers/Containers/Detail/BaseDetail.jsx +++ b/src/pages/container-service/containers/Containers/Detail/BaseDetail.jsx @@ -156,15 +156,47 @@ export class BaseDetail extends Base { dataIndex: 'addresses', render: this.stringifyContent, }, + { + label: t('Networks'), + dataIndex: 'networks', + render: (value = []) => ( + <> + {value.map((it) => { + const link = this.getLinkRender('networkDetail', it, { + id: it, + }); + return
{link}
; + })} + + ), + }, { label: t('Ports'), dataIndex: 'ports', - render: this.stringifyContent, + render: (value = []) => ( + <> + {value.map((it) => { + const link = this.getLinkRender('virtualAdapterDetail', it, { + id: it, + }); + return
{link}
; + })} + + ), }, { label: t('Security Groups'), dataIndex: 'security_groups', - render: this.stringifyContent, + render: (value = []) => ( + <> + {value.map((it) => { + const link = this.getLinkRender('securityGroupDetail', it, { + id: it, + }); + return
{link}
; + })} + + ), }, ]; diff --git a/src/stores/zun/containers.js b/src/stores/zun/containers.js index 041bfedd..f9510344 100644 --- a/src/stores/zun/containers.js +++ b/src/stores/zun/containers.js @@ -15,6 +15,7 @@ import Base from 'stores/base'; import client from 'client'; import { action } from 'mobx'; +import { isEmpty } from 'lodash'; export class ContainersStore extends Base { get client() { @@ -77,12 +78,22 @@ export class ContainersStore extends Base { } async detailDidFetch(item) { - const { uuid, status } = item; + const { uuid, status, addresses = {} } = item; let stats = {}; if (status === 'Running') { stats = (await this.client.stats.list(uuid)) || {}; } - return { ...item, stats }; + const networks = Object.keys(addresses); + let { ports = [] } = item; + if (isEmpty(ports)) { + ports = Object.values(addresses) + .reduce((ret, cur) => { + ret = ret.concat(cur); + return ret; + }, []) + .map((it) => it.port); + } + return { ...item, stats, networks, ports }; } async fetchLogs(id) {