Merge pull request #652 from jschoiRR/mold-main#2025

[Mold UI] 클러스터 목록/상세, 호스트 목록/상세 화면에서 HA활성화 정보 표시

Author: jschoiRR

ui/public/locales/en.json

@@ -4465,6 +4465,7 @@
 "physical.ovscontroller.add": "PHYSICAL.OVSCONTROLLER.ADD",
 "physical.ovscontroller.delete": "PHYSICAL.OVSCONTROLLER.DELETE",
 "cluster.drs.generate": "CLUSTER.DRS.GENERATE",
+"cluster.drs": "CLUSTER.DRS",
 "counter.create": "COUNTER.CREATE",
 "counter.delete": "COUNTER.DELETE",
 "condition.create": "CONDITION.CREATE",

ui/public/locales/ko_KR.json

@@ -4465,6 +4465,7 @@
 "physical.ovscontroller.add": "\ubb3c\ub9ac OVS\ucee8\ud2b8\ub864\ub7ec \ucd94\uac00",
 "physical.ovscontroller.delete": "\ubb3c\ub9ac OVSC\ucee8\ud2b8\ub864\ub7ec \uc0ad\uc81c",
 "cluster.drs.generate": "\ud074\ub7ec\uc2a4\ud130 DRS \uc0dd\uc131",
+"cluster.drs": "\ud074\ub7ec\uc2a4\ud130 DRS",
 "counter.create": "\uce74\uc6b4\ud130 \uc0dd\uc131",
 "counter.delete": "\uce74\uc6b4\ud130 \uc0ad\uc81c",
 "condition.create": "\uc870\uac74 \uc0dd\uc131",

ui/src/components/view/DetailsTab.vue

@@ -167,6 +167,13 @@
           <div v-else>{{ dataResource[item] }}</div>
         </div>
       </a-list-item>
+      <a-list-item v-else-if="['cluster', 'zone'].includes($route.meta.name) && item === 'haenable'">
+        <div>
+          <strong>{{ $t('label.ha.enable') }}</strong>
+          <br/>
+          <div>{{ dataResource.resourcedetails.resourceHAEnabled }}</div>
+        </div>
+      </a-list-item>
       <a-list-item v-else-if="item === 'ip6address' && ipV6Address && ipV6Address.length > 0">
         <div>
           <strong>{{ $t('label.' + String(item).toLowerCase()) }}</strong>
@@ -420,6 +427,7 @@ export default {
     fetchDetails () {
       let details = this.$route.meta.details
 
+      console.log('details :>> ', details)
       if (!details) {
         return
       }

ui/src/components/view/InfoCard.vue

@@ -133,6 +133,19 @@
             <status class="status" :text="resource.resourcestate" displayText/>
           </div>
         </div>
+        <div class="resource-detail-item" v-if="['cluster', 'zone'].includes($route.meta.name) && resource.resourcedetails">
+          <div class="resource-detail-item__label">{{ $t('label.haenable') }}</div>
+          <div class="resource-detail-item__details">
+            <status class="status" :text="resource.resourcedetails.resourceHAEnabled === 'true' ? 'enabled' : 'disabled'" displayText/>
+          </div>
+        </div>
+        <div class="resource-detail-item" v-if="$route.meta.name === 'host' && resource.hostha">
+          <div class="resource-detail-item__label">{{ $t('label.haenable') }}</div>
+          <div class="resource-detail-item__details">
+            <status class="status" :text="resource.hostha.haenable === 'true' ? 'enabled' : 'disabled'" displayText/>
+            <a-tag style="margin-left: 5px; margin-bottom: 5px;">{{ resource.hostha.hastate }}</a-tag>
+          </div>
+        </div>
         <div class="resource-detail-item" v-if="('success' in resource) && $route.meta.name === 'webhookdeliveries'">
           <div class="resource-detail-item__label">{{ $t('label.success') }}</div>
           <div class="resource-detail-item__details">

ui/src/components/view/ListView.vue

@@ -476,10 +476,13 @@
           {{ isNaN(text) ? text : (parseFloat(parseFloat(text) / 1024.0 / 1024.0 / 1024.0).toFixed(2) + ' GiB') }}
         </span>
       </template>
+      <template v-if="['cluster', 'zone'].includes($route.meta.name) && column.key === 'haenable'">
+        <status :text="record.resourcedetails.resourceHAEnabled === 'true' ? 'enabled' : 'disabled'" displayText/>
+      </template>
       <template v-if="column.key === 'hastate'">
         <a-tag>{{ record.hostha.hastate }}</a-tag>
       </template>
-      <template v-if="column.key === 'haenable'">
+      <template v-if="$route.meta.name === 'host' && column.key === 'haenable'">
         <status :text="record.hostha.haenable ? 'enabled' : 'disabled'" displayText/>
       </template>
       <template v-if="['startdate', 'enddate'].includes(column.key) && ['quotasummary', 'usage'].includes($route.path.split('/')[1])">

ui/src/config/section/infra/clusters.js

@@ -26,7 +26,7 @@ export default {
   permission: ['listClustersMetrics'],
   searchFilters: ['name', 'zoneid', 'podid', 'hypervisor'],
   columns: () => {
-    const fields = ['name', 'state', 'allocationstate', 'clustertype', 'hypervisortype', 'hosts']
+    const fields = ['name', 'state', 'allocationstate', 'clustertype', 'hypervisortype', 'hosts', 'haenable']
     const metricsFields = ['cpuused', 'cpumaxdeviation', 'cpuallocated', 'cputotal', 'memoryused', 'memorymaxdeviation', 'memoryallocated', 'memorytotal', 'drsimbalance']
     if (store.getters.metrics) {
       fields.push(...metricsFields)
@@ -35,7 +35,7 @@ export default {
     fields.push('zonename')
     return fields
   },
-  details: ['name', 'id', 'allocationstate', 'clustertype', 'managedstate', 'arch', 'hypervisortype', 'podname', 'zonename', 'drsimbalance'],
+  details: ['name', 'id', 'allocationstate', 'clustertype', 'managedstate', 'arch', 'hypervisortype', 'podname', 'zonename', 'drsimbalance', 'haenable'],
   related: [{
     name: 'host',
     title: 'label.hosts',

ui/src/config/section/infra/zones.js

@@ -26,15 +26,15 @@ export default {
   permission: ['listZonesMetrics'],
   searchFilters: ['name', 'domainid', 'tags'],
   columns: () => {
-    const fields = ['name', 'allocationstate', 'type', 'networktype', 'clusters']
+    const fields = ['name', 'allocationstate', 'type', 'networktype', 'clusters', 'haenable']
     const metricsFields = ['cpuused', 'cpumaxdeviation', 'cpuallocated', 'cputotal', 'memoryused', 'memorymaxdeviation', 'memoryallocated', 'memorytotal']
     if (store.getters.metrics) {
       fields.push(...metricsFields)
     }
     fields.push('order')
     return fields
   },
-  details: ['name', 'id', 'allocationstate', 'type', 'networktype', 'guestcidraddress', 'localstorageenabled', 'securitygroupsenabled', 'dns1', 'dns2', 'internaldns1', 'internaldns2', 'asnrange'],
+  details: ['name', 'id', 'allocationstate', 'type', 'networktype', 'guestcidraddress', 'localstorageenabled', 'securitygroupsenabled', 'dns1', 'dns2', 'internaldns1', 'internaldns2', 'asnrange', 'haenable'],
   related: [{
     name: 'pod',
     title: 'label.pods',

ui/src/views/compute/wizard/SecurityGroupSelection.vue

@@ -19,7 +19,7 @@
   <div style="margin-top: 10px;">
     <label>{{ $t('message.select.security.groups') }}</label>
     <a-input-search
-      style="width: 25vw; float: right; margin-bottom: 10px; z-index: 8;"
+      style="float: right; margin-bottom: 10px; z-index: 8;"
       :placeholder="$t('label.search')"
       v-model:value="filter"
       @search="handleSearch" />