Update packages fix (#103)

Co-authored-by: AceDataCloud <[email protected]>
AceDataCloud · Aug 14, 2024 · 3f38a2b · 3f38a2b
1 parent 61af618
commit 3f38a2b
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 12 deletions.
diff --git a/change/@acedatacloud-nexior-54ad6e4e-b49a-424d-85d2-c3c42d8200ba.json b/change/@acedatacloud-nexior-54ad6e4e-b49a-424d-85d2-c3c42d8200ba.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix application packages options",
+  "packageName": "@acedatacloud/nexior",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}
diff --git a/src/pages/console/application/Buy.vue b/src/pages/console/application/Buy.vue
@@ -17,14 +17,8 @@
                     {{ application?.service?.title }}
                   </el-form-item>
                   <el-form-item :label="$t('application.field.package')">
-                    <el-radio-group v-if="application?.service?.packages" v-model="form.packageId">
-                      <el-radio-button
-                        v-for="(pkg, pkgIndex) in application?.service.packages"
-                        v-show="pkg.type === 'Usage'"
-                        :key="pkgIndex"
-                        :label="pkg.id"
-                        class="mb-2"
-                      >
+                    <el-radio-group v-if="packages" v-model="form.packageId">
+                      <el-radio-button v-for="(pkg, pkgIndex) in packages" :key="pkgIndex" :label="pkg.id" class="mb-2">
                         {{ pkg.amount }} {{ $t(`service.unit.${application?.service?.unit}s`) }}
                       </el-radio-button>
                     </el-radio-group>
@@ -73,7 +67,7 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { IApplication, IApplicationDetailResponse, IOrderDetailResponse } from '@/models';
+import { IApplication, IApplicationDetailResponse, IOrderDetailResponse, IPackageType } from '@/models';
 import {
   ElRow,
   ElCol,
@@ -138,9 +132,12 @@ export default defineComponent({
       }
       return 0;
     },
+    packages() {
+      return this.application?.service?.packages?.filter((pkg) => pkg.type === IPackageType.USAGE);
+    },
     package() {
-      if (this.application?.service?.packages && this.form.packageId) {
-        const filterPackages = this.application.service?.packages.filter((item) => item.id === this.form.packageId);
+      if (this.packages && this.form.packageId) {
+        const filterPackages = this.packages.filter((item) => item.id === this.form.packageId);
         if (filterPackages.length > 0) {
           return filterPackages[0];
         }
@@ -161,7 +158,7 @@ export default defineComponent({
           this.application = data;
           this.loading = false;
           // by default select first packageId
-          this.form.packageId = this.application?.service?.packages?.[0]?.id;
+          this.form.packageId = this.packages?.[0]?.id;
         })
         .catch(() => {
           this.loading = false;