318f7b195d
1. Remove useless component: NotFound, EmptyTable 2. Update asset path according to alias in webpack 3. Update page path according to alias in webpack 4. Remove useless image 5. Update image name Change-Id: I0c8fc48733d0a0f9df80e8cc37db63fdebaa166b
113 lines
2.9 KiB
JavaScript
113 lines
2.9 KiB
JavaScript
// Copyright 2021 99cloud
|
|
//
|
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
// you may not use this file except in compliance with the License.
|
|
// You may obtain a copy of the License at
|
|
//
|
|
// http://www.apache.org/licenses/LICENSE-2.0
|
|
//
|
|
// Unless required by applicable law or agreed to in writing, software
|
|
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
// See the License for the specific language governing permissions and
|
|
// limitations under the License.
|
|
|
|
import React, { Component } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import imageSvg from 'asset/image/image.svg';
|
|
import securityImg from 'asset/image/security-group.svg';
|
|
import lbImg from 'asset/image/load-balancer.png';
|
|
|
|
import {
|
|
DesktopOutlined,
|
|
BorderOuterOutlined,
|
|
SecurityScanOutlined,
|
|
InboxOutlined,
|
|
GlobalOutlined,
|
|
GatewayOutlined,
|
|
UserOutlined,
|
|
CameraOutlined,
|
|
SaveOutlined,
|
|
KeyOutlined,
|
|
ClusterOutlined,
|
|
TagOutlined,
|
|
HddOutlined,
|
|
CloudServerOutlined,
|
|
LoadingOutlined,
|
|
} from '@ant-design/icons';
|
|
import styles from './index.less';
|
|
|
|
const ImageIcon = (
|
|
<img src={imageSvg} alt="image_icon" style={{ width: '12px' }} />
|
|
);
|
|
|
|
const SecurityIcon = (
|
|
<img src={securityImg} alt="security_icon" style={{ width: '12px' }} />
|
|
);
|
|
|
|
const LBIcon = <img src={lbImg} alt="lb_icon" style={{ width: '12px' }} />;
|
|
|
|
const iconTypeMap = {
|
|
instance: <DesktopOutlined />,
|
|
router: <BorderOuterOutlined />,
|
|
externalNetwork: <GlobalOutlined />,
|
|
network: <GlobalOutlined />,
|
|
firewall: <SecurityScanOutlined />,
|
|
volume: <InboxOutlined />,
|
|
gateway: <GatewayOutlined />,
|
|
user: <UserOutlined />,
|
|
snapshot: <CameraOutlined />,
|
|
backup: <SaveOutlined />,
|
|
keypair: <KeyOutlined />,
|
|
image: ImageIcon,
|
|
aggregate: <ClusterOutlined />,
|
|
metadata: <TagOutlined />,
|
|
flavor: <HddOutlined />,
|
|
host: <CloudServerOutlined />,
|
|
security: SecurityIcon,
|
|
lb: LBIcon,
|
|
};
|
|
|
|
export default class index extends Component {
|
|
static propTypes = {
|
|
content: PropTypes.any,
|
|
value: PropTypes.any,
|
|
icon: PropTypes.node,
|
|
iconType: PropTypes.string,
|
|
};
|
|
|
|
static defaultProps = {
|
|
icon: null,
|
|
iconType: '',
|
|
content: '',
|
|
value: null,
|
|
};
|
|
|
|
renderIcon() {
|
|
const { icon, iconType } = this.props;
|
|
if (iconType) {
|
|
const iconComp = iconTypeMap[iconType] || null;
|
|
return <span className={styles.icon}>{iconComp}</span>;
|
|
}
|
|
return <span className={styles.icon}>{icon || null}</span>;
|
|
}
|
|
|
|
render() {
|
|
const { content, value, iconType, showLoading, ...rest } = this.props;
|
|
const failValues = [undefined, null, ''];
|
|
if (content) {
|
|
return content;
|
|
}
|
|
return (
|
|
<span {...rest}>
|
|
{this.renderIcon()}
|
|
{showLoading && failValues.includes(value) ? (
|
|
<LoadingOutlined />
|
|
) : (
|
|
value
|
|
)}
|
|
</span>
|
|
);
|
|
}
|
|
}
|