From 36f49a3a51471441470020d4606c59414980fae4 Mon Sep 17 00:00:00 2001
From: "Jingwei.Zhang" <zhang.jingwei@99cloud.net>
Date: Wed, 20 Jul 2022 14:51:54 +0800
Subject: [PATCH] feat: support server group quota check when create instance

1. Support server group quota info when create instance
2. Disable click next button when the selected server group's remaining quota is insufficient

Change-Id: Iee8127292ad50564eff04e21f11b1c82355d3a7d
---
 .../actions/StepCreate/SystemStep/index.jsx   | 33 +++++++++----
 .../Instance/actions/StepCreate/index.jsx     | 46 +++++++++++++++++--
 2 files changed, 67 insertions(+), 12 deletions(-)

diff --git a/src/pages/compute/containers/Instance/actions/StepCreate/SystemStep/index.jsx b/src/pages/compute/containers/Instance/actions/StepCreate/SystemStep/index.jsx
index ff0c6259..d31051c9 100644
--- a/src/pages/compute/containers/Instance/actions/StepCreate/SystemStep/index.jsx
+++ b/src/pages/compute/containers/Instance/actions/StepCreate/SystemStep/index.jsx
@@ -29,6 +29,7 @@ import { physicalNodeTypes } from 'resources/nova/instance';
 import { getOptions } from 'utils';
 import CreateKeyPair from 'pages/compute/containers/Keypair/actions/Create';
 import ItemActionButtons from 'components/Tables/Base/ItemActionButtons';
+import { has } from 'lodash';
 import styles from '../index.less';
 
 export class SystemStep extends Base {
@@ -85,15 +86,10 @@ export class SystemStep extends Base {
   }
 
   get serverGroups() {
-    return (this.serverGroupStore.list.data || [])
-      .filter((it) => {
-        const { servergroup } = this.locationParams;
-        return servergroup ? it.id === servergroup : true;
-      })
-      .map((it) => ({
-        ...it,
-        key: it.id,
-      }));
+    return (this.serverGroupStore.list.data || []).filter((it) => {
+      const { servergroup } = this.locationParams;
+      return servergroup ? it.id === servergroup : true;
+    });
   }
 
   get serverGroupRequired() {
@@ -198,6 +194,10 @@ export class SystemStep extends Base {
   async getServerGroups() {
     await this.serverGroupStore.fetchList();
     this.updateDefaultValue();
+    const { servergroup } = this.locationParams;
+    if (servergroup) {
+      this.onServerGroupChange({ selectedRows: this.serverGroups });
+    }
   }
 
   get nameForStateUpdate() {
@@ -208,6 +208,7 @@ export class SystemStep extends Base {
       'confirmPassword',
       'more',
       'physicalNodeType',
+      'serverGroup',
     ];
   }
 
@@ -235,6 +236,19 @@ export class SystemStep extends Base {
     }
   };
 
+  onValuesChange = (changedFields) => {
+    if (has(changedFields, 'serverGroup')) {
+      this.onServerGroupChange(changedFields.serverGroup);
+    }
+  };
+
+  onServerGroupChange = (value) => {
+    const { selectedRows = [] } = value || {};
+    this.updateContext({
+      serverGroupRow: selectedRows[0] || null,
+    });
+  };
+
   getKeyPairHeader() {
     const { isLoading } = this.keyPairStore.list || {};
     if (isLoading) {
@@ -377,6 +391,7 @@ export class SystemStep extends Base {
         data: this.serverGroups,
         isLoading: this.serverGroupStore.list.isLoading,
         required: this.serverGroupRequired,
+        // onChange: this.onServerGroupChange,
         extra: t(
           'Using server groups, you can create cloud hosts on the same/different physical nodes as much as possible to meet the affinity/non-affinity requirements of business applications.'
         ),
diff --git a/src/pages/compute/containers/Instance/actions/StepCreate/index.jsx b/src/pages/compute/containers/Instance/actions/StepCreate/index.jsx
index c732a695..5c75472f 100644
--- a/src/pages/compute/containers/Instance/actions/StepCreate/index.jsx
+++ b/src/pages/compute/containers/Instance/actions/StepCreate/index.jsx
@@ -212,13 +212,18 @@ export class StepCreate extends StepAction {
       title: t('Volume Size'),
       type: 'line',
     };
-    return [
+    const serverGroupQuota = this.getServerGroupQuota();
+    const quotaInfo = [
       instanceQuotaInfo,
       cpuQuotaInfo,
       ramQuotaInfo,
       volumeQuotaInfo,
       volumeSizeQuotaInfo,
     ];
+    if (serverGroupQuota) {
+      quotaInfo.push(serverGroupQuota);
+    }
+    return quotaInfo;
   }
 
   get errorText() {
@@ -404,6 +409,40 @@ export class StepCreate extends StepAction {
     return '';
   }
 
+  getServerGroupQuota() {
+    const { data } = this.state;
+    const { serverGroupRow, count = 1 } = data;
+    if (!serverGroupRow) {
+      return null;
+    }
+    const { server_group_members: { limit = 0 } = {} } =
+      this.projectStore.novaQuota;
+    const { members = [] } = serverGroupRow || {};
+    const used = members.length;
+    const left = limit === -1 ? -1 : limit - used;
+    return {
+      add: count,
+      used,
+      limit,
+      left,
+      title: t('Server Group Member'),
+      name: 'serverGroupMember',
+      type: 'line',
+    };
+  }
+
+  checkSeverGroupQuota() {
+    const quota = this.getServerGroupQuota();
+    if (!quota) {
+      return '';
+    }
+    const { add, left } = quota || {};
+    if (left !== -1 && left < add) {
+      return this.getQuotaMessage(add, quota, t('Server Group Member'));
+    }
+    return '';
+  }
+
   get badgeStyle() {
     return { marginTop: 8, marginBottom: 8, marginLeft: 10, maxWidth: 600 };
   }
@@ -411,13 +450,14 @@ export class StepCreate extends StepAction {
   renderBadge() {
     const flavorMsg = this.checkFlavorQuota();
     const volumeMsg = this.checkVolumeQuota();
-    if (!flavorMsg && !volumeMsg) {
+    const serverGroupMsg = this.checkSeverGroupQuota();
+    if (!flavorMsg && !volumeMsg && !serverGroupMsg) {
       this.status = 'success';
       this.errorMsg = '';
       return null;
     }
     this.status = 'error';
-    const msg = flavorMsg || volumeMsg;
+    const msg = flavorMsg || volumeMsg || serverGroupMsg;
     if (this.errorMsg !== msg) {
       $message.error(msg);
     }