fix: Update Table component && update stack codes

1. Update Table component
2. Remove useless action: extend root volume
3. Update export of stack codes
4. Remove useless func of stack codes

Change-Id: I47b9aaa92d0cc8fa6cf8d00ebc185e6b15bd2568

src/components/Tables/Base/index.jsx

@@ -18,7 +18,7 @@ import classnames from 'classnames';
 import isEqual from 'react-fast-compare';
 import { toJS } from 'mobx';
 import { Link } from 'react-router-dom';
-import { includes, get, isArray } from 'lodash';
+import { includes, get, isArray, isString } from 'lodash';
 import { Button, Table, Dropdown, Input, Typography, Tooltip } from 'antd';
 import MagicInput from 'components/MagicInput';
 import Pagination from 'components/Pagination';
@@ -408,6 +408,17 @@ export default class BaseTable extends React.Component {
     };
   };
 
+  // eslint-disable-next-line no-unused-vars
+  getPriceRender = (render, column) => {
+    if (render) {
+      return render;
+    }
+    return (value) => {
+      const valueStr = isString(value) ? value : (value || 0).toFixed(2);
+      return <span style={{ color: '#f50' }}>{valueStr}</span>;
+    };
+  };
+
   getTipRender = (tip, render, dataIndex, Icon = FileTextOutlined) => {
     const newRender = (value, record) => {
       const tipValue = tip(value, record);
@@ -456,6 +467,7 @@ export default class BaseTable extends React.Component {
         tip,
         isStatus,
         isName,
+        isPrice,
         ...rest
       } = column;
       const newSorter = getColumnSorter(column, this.props);
@@ -474,6 +486,9 @@ export default class BaseTable extends React.Component {
       if (dataIndex === 'name' || isName) {
         newRender = this.getNameRender(newRender, column);
       }
+      if (dataIndex === 'cost' || isPrice) {
+        newRender = this.getPriceRender(newRender, column);
+      }
       if (copyable) {
         newRender = (value) => {
           if (value && value !== '-') {
@@ -922,6 +937,7 @@ export default class BaseTable extends React.Component {
       expandable,
       isPageByBack = true,
       isCourier,
+      childrenColumnName,
       // scrollX,
     } = this.props;
 
@@ -983,6 +999,7 @@ export default class BaseTable extends React.Component {
           showSorterTooltip={false}
           expandable={expandable}
           footer={footer}
+          childrenColumnName={childrenColumnName}
         />
       </div>
     );

src/components/Tables/Base/index.less

@@ -15,7 +15,7 @@
     }
     .ant-table-pagination.ant-pagination{
       margin: 0;
-      padding: 8px 16px;;
+      padding: 8px 16px;
     }
   }
 }

src/locales/en.json

@@ -21,7 +21,6 @@
   "A snapshot is an image which preserves the disk state of a running instance, which can be used to start a new instance.": "A snapshot is an image which preserves the disk state of a running instance, which can be used to start a new instance.",
   "A template is a YAML file that contains configuration information, please enter the correct format.": "A template is a YAML file that contains configuration information, please enter the correct format.",
   "A template is a YAML file that contains configuration information.": "A template is a YAML file that contains configuration information.",
-  "A template is used to automate the deployment of infrastructure, services, and applications.": "A template is used to automate the deployment of infrastructure, services, and applications.",
   "ADMINISTRATOR": "ADMINISTRATOR",
   "AH": "AH",
   "AKI - Amazon kernel image format": "AKI - Amazon kernel image format",
@@ -371,7 +370,6 @@
   "Creation Timeout (Minutes)": "Creation Timeout (Minutes)",
   "Credential Type": "Credential Type",
   "Current Availability Zones": "Current Availability Zones",
-  "Current Capacity (GB)": "Current Capacity (GB)",
   "Current Compute Host": "Current Compute Host",
   "Current Flavor": "Current Flavor",
   "Current Host": "Current Host",
@@ -619,7 +617,6 @@
   "Expires At": "Expires At",
   "Extend Root Volume": "Extend Root Volume",
   "Extend Volume": "Extend Volume",
-  "Extend root volume": "Extend root volume",
   "Extend volume": "Extend volume",
   "Extending": "Extending",
   "External": "External",
@@ -1730,7 +1727,6 @@
   "Value": "Value",
   "Vendor Interface": "Vendor Interface",
   "Verifying": "Verifying",
-  "Version Count": "Version Count",
   "View": "View",
   "View Detail": "View Detail",
   "View Rules": "View Rules",

src/locales/zh.json

@@ -21,7 +21,6 @@
   "A snapshot is an image which preserves the disk state of a running instance, which can be used to start a new instance.": "云主机当前状态的磁盘数据保存，创建镜像文件，以备将来启动新的云主机使用。",
   "A template is a YAML file that contains configuration information, please enter the correct format.": "模板是包含配置信息的YAML文件， 请输入正确的格式。",
   "A template is a YAML file that contains configuration information.": "模板是包含配置信息的YAML文件。",
-  "A template is used to automate the deployment of infrastructure, services, and applications.": "模板用于自动化基础结构，服务和应用程序的部署。",
   "ADMINISTRATOR": "管理员",
   "AH": "",
   "AKI - Amazon kernel image format": "AKI - Amazon 内核图像格式",
@@ -371,7 +370,6 @@
   "Creation Timeout (Minutes)": "创建超时（分钟）",
   "Credential Type": "凭证类型",
   "Current Availability Zones": "当前可用域",
-  "Current Capacity (GB)": "当前容量(GB)",
   "Current Compute Host": "当前计算节点",
   "Current Flavor": "当前配置",
   "Current Host": "当前主机",
@@ -619,7 +617,6 @@
   "Expires At": "到期时间",
   "Extend Root Volume": "扩容根硬盘",
   "Extend Volume": "扩容云硬盘",
-  "Extend root volume": "扩容根硬盘",
   "Extend volume": "扩容云硬盘",
   "Extending": "扩展中",
   "External": "外部网络",
@@ -1730,7 +1727,6 @@
   "Value": "值",
   "Vendor Interface": "",
   "Verifying": "验证",
-  "Version Count": "版本数",
   "View": "查看",
   "View Detail": "查看详情",
   "View Rules": "查看规则",

src/pages/compute/containers/Instance/actions/ExtendRootVolume.jsx

@@ -1,120 +0,0 @@
-// 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 { inject, observer } from 'mobx-react';
-import { toJS } from 'mobx';
-import globalServerStore from 'stores/nova/instance';
-import globalVolumeStore from 'stores/cinder/volume';
-import { InstanceVolumeStore } from 'stores/nova/instance-volume';
-import { ModalAction } from 'containers/Action';
-import { isNotLocked, checkStatus, isIronicInstance } from 'resources/instance';
-import { isOsDisk } from 'resources/volume';
-
-export class ExtendRootVolume extends ModalAction {
-  static id = 'extend-root-volume';
-
-  static title = t('Extend Root Volume');
-
-  init() {
-    this.store = globalServerStore;
-    this.volumeStore = new InstanceVolumeStore();
-    this.getVolumes();
-  }
-
-  async getVolumes() {
-    const { id } = this.item;
-    await this.volumeStore.fetchList({ serverId: id });
-    this.updateDefaultValue();
-  }
-
-  get rootVolume() {
-    const item = (this.volumeStore.list.data || []).find((it) => isOsDisk(it));
-    return toJS(item) || {};
-  }
-
-  get name() {
-    return t('Extend root volume');
-  }
-
-  getMinSize() {
-    const { size = 1 } = this.rootVolume || {};
-    return size + 1;
-  }
-
-  get defaultValue() {
-    const { id, size = 1, name } = this.rootVolume || {};
-    const { name: instance } = this.item;
-    const value = {
-      instance,
-      volume: name || id,
-      size: this.getMinSize(),
-      oldSize: size,
-    };
-    return value;
-  }
-
-  static policy = 'volume:extend_attached_volume';
-
-  static isAtiveOrShutOff = (item) => checkStatus(['active', 'shutoff'], item);
-
-  static allowed = (item) =>
-    Promise.resolve(
-      isNotLocked(item) &&
-        this.isAtiveOrShutOff(item) &&
-        !isIronicInstance(item)
-    );
-
-  get formItems() {
-    const minSize = this.getMinSize();
-    return [
-      {
-        name: 'instance',
-        label: t('Instance'),
-        type: 'label',
-        iconType: 'instance',
-      },
-      {
-        name: 'volume',
-        label: t('Volume'),
-        type: 'label',
-        iconType: 'volume',
-      },
-      {
-        name: 'oldSize',
-        label: t('Current Capacity (GB)'),
-        type: 'label',
-      },
-      {
-        name: 'size',
-        label: t('Capacity (GB)'),
-        type: 'slider-input',
-        max: 500,
-        min: minSize,
-        description: `${minSize}GB-500GB`,
-        required: true,
-      },
-    ];
-  }
-
-  onSubmit = (values) => {
-    const { id } = this.rootVolume;
-    const { size } = values;
-    const body = {
-      new_size: size,
-    };
-    return globalVolumeStore.extendSize(id, body);
-  };
-}
-
-export default inject('rootStore')(observer(ExtendRootVolume));

src/pages/compute/containers/Instance/actions/index.jsx

@@ -34,7 +34,6 @@ import AttachVolume from './AttachVolume';
 import AttachIsoVolume from './AttachIsoVolume';
 import DetachIsoVolume from './DetachIsoVolume';
 import DetachVolume from './DetachVolume';
-import ExtendRootVolume from './ExtendRootVolume';
 import Resize from './Resize';
 import ResizeOnline from './ResizeOnline';
 import MigrateAction from './Migrate';
@@ -78,13 +77,7 @@ const resourceActions = [
   ManageSecurityGroup,
 ];
 
-const configActions = [
-  Resize,
-  ResizeOnline,
-  ExtendRootVolume,
-  ChangePassword,
-  Rebuild,
-];
+const configActions = [Resize, ResizeOnline, ChangePassword, Rebuild];
 
 const batchActions = [
   StartAction,

src/pages/heat/containers/Stack/actions/Create/Parameter.jsx

@@ -22,9 +22,7 @@ import {
   rollbackTip,
 } from 'resources/stack';
 
-@inject('rootStore')
-@observer
-export default class Parameter extends Base {
+export class Parameter extends Base {
   get isStep() {
     return true;
   }
@@ -123,3 +121,5 @@ export default class Parameter extends Base {
     return formItems;
   }
 }
+
+export default inject('rootStore')(observer(Parameter));

src/pages/heat/containers/Stack/actions/Create/Template.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import Base from 'components/Form';
 import { yamlTip, validateYaml, paramTip } from 'resources/stack';
 
-@inject('rootStore')
-@observer
-export default class Template extends Base {
+export class Template extends Base {
   get isStep() {
     return true;
   }
@@ -38,7 +36,6 @@ export default class Template extends Base {
   get defaultValue() {
     const { versionContent = '' } = this.state;
     return {
-      source: 'manually',
       versionContent,
       name: this.isEdit ? this.props.extra.stack_name : '',
     };
@@ -79,3 +76,5 @@ export default class Template extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(Template));

src/pages/heat/containers/Stack/actions/Create/index.jsx

@@ -20,9 +20,7 @@ import { toJS } from 'mobx';
 import Parameter from './Parameter';
 import Template from './Template';
 
-@inject('rootStore')
-@observer
-export default class StepCreate extends StepAction {
+export class StepCreate extends StepAction {
   static id = 'stack-create';
 
   static title = t('Create Stack');
@@ -107,3 +105,5 @@ export default class StepCreate extends StepAction {
     return this.store.create(body);
   };
 }
+
+export default inject('rootStore')(observer(StepCreate));

src/pages/heat/containers/Stack/index.jsx

@@ -18,9 +18,7 @@ import globalStackStore, { StackStore } from 'stores/heat/stack';
 import { stackStatus } from 'resources/stack';
 import actionConfigs from './actions';
 
-@inject('rootStore')
-@observer
-export default class Stack extends Base {
+export class Stack extends Base {
   init() {
     this.store = globalStackStore;
     this.downloadStore = new StackStore();
@@ -128,3 +126,5 @@ export default class Stack extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(Stack));

src/resources/stack.js

@@ -83,49 +83,12 @@ export const paramTip = t(
   'When your Yaml file is a fixed template, variable variables can be stored in an environment variable file to implement template deployment. The parameters in the environment variable file need to match the parameters defined in the template file.'
 );
 
-export const templateTip = t(
-  'A template is used to automate the deployment of infrastructure, services, and applications.'
-);
-
 export const rollbackTip = t(
   'If "Enable" fails to roll back, the resource will be deleted after the creation fails; if "Disable" fails to roll back, the resource will be retained after the creation fails.'
 );
 
-export const templateColumns = (self) => [
-  {
-    title: t('ID/Name'),
-    dataIndex: 'name',
-    linkPrefix: `/heat/${self.getUrl('template')}/detail/`,
-  },
-  {
-    title: t('Project ID/Name'),
-    dataIndex: 'project_name',
-    hidden: !self.isAdminPage,
-  },
-  {
-    title: t('Description'),
-    dataIndex: 'description',
-    isHideable: true,
-  },
-  {
-    title: t('Version Count'),
-    dataIndex: 'contents',
-    render: (value) => value.length,
-  },
-];
-
-export const templateFilters = [
-  {
-    label: t('Name'),
-    name: 'template_name',
-  },
-];
-
 export const getTemplate = (context = {}) => {
-  const { source, content, versionContent } = context;
-  if (source === 'platform') {
-    return versionContent;
-  }
+  const { content } = context;
   return content;
 };