From f1ec81a250efbc4c9d506089c433f170ae85b131 Mon Sep 17 00:00:00 2001
From: Hoang Nguyen <hoangnm@unitech.vn>
Date: Mon, 7 Dec 2020 20:14:17 +0700
Subject: [PATCH] Fixes ostype combobox not respond (#890)

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
---
 ui/src/views/image/RegisterOrUploadIso.vue      |  7 +++----
 ui/src/views/image/RegisterOrUploadTemplate.vue | 15 ++++++++-------
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/ui/src/views/image/RegisterOrUploadIso.vue b/ui/src/views/image/RegisterOrUploadIso.vue
index d70d282fb22..a5b2a6afd2d 100644
--- a/ui/src/views/image/RegisterOrUploadIso.vue
+++ b/ui/src/views/image/RegisterOrUploadIso.vue
@@ -118,7 +118,7 @@
             }"
             :loading="osTypeLoading"
             :placeholder="apiParams.ostypeid.description">
-            <a-select-option :value="opt.description" v-for="(opt, optIndex) in osTypes" :key="optIndex">
+            <a-select-option :value="opt.id" v-for="(opt, optIndex) in osTypes" :key="optIndex">
               {{ opt.name || opt.description }}
             </a-select-option>
           </a-select>
@@ -244,7 +244,7 @@ export default {
         this.osTypes = this.osTypes.concat(listOsTypes)
       }).finally(() => {
         this.osTypeLoading = false
-        this.defaultOsType = this.osTypes[0].description
+        this.defaultOsType = this.osTypes[0].id
       })
     },
     handleRemove (file) {
@@ -320,8 +320,7 @@ export default {
               params[key] = zone[0].id
               break
             case 'ostypeid':
-              var os = this.osTypes.filter(osType => osType.description === input)
-              params[key] = os[0].id
+              params[key] = input
               break
             default:
               params[key] = input
diff --git a/ui/src/views/image/RegisterOrUploadTemplate.vue b/ui/src/views/image/RegisterOrUploadTemplate.vue
index 597685cb688..c55410ff0bc 100644
--- a/ui/src/views/image/RegisterOrUploadTemplate.vue
+++ b/ui/src/views/image/RegisterOrUploadTemplate.vue
@@ -252,8 +252,12 @@
             <a-form-item :label="$t('label.ostypeid')">
               <a-select
                 showSearch
+                optionFilterProp="children"
+                :filterOption="(input, option) => {
+                  return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+                }"
                 v-decorator="['ostypeid', {
-                  initialValue: defaultOsType,
+                  initialValue: defaultOsId,
                   rules: [
                     {
                       required: true,
@@ -263,7 +267,7 @@
                 }]"
                 :loading="osTypes.loading"
                 :placeholder="apiParams.ostypeid.description">
-                <a-select-option v-for="opt in osTypes.opts" :key="opt.name || opt.description">
+                <a-select-option v-for="opt in osTypes.opts" :key="opt.id">
                   {{ opt.name || opt.description }}
                 </a-select-option>
               </a-select>
@@ -792,12 +796,9 @@ export default {
             }
             params[key] = input.join()
           } else if (key === 'zoneid') {
-            params[key] = values[key]
+            params[key] = input
           } else if (key === 'ostypeid') {
-            const osTypeSelected = this.osTypes.opts.filter(item => item.description === input)
-            if (osTypeSelected && osTypeSelected[0]) {
-              params[key] = osTypeSelected[0].id
-            }
+            params[key] = input
           } else if (key === 'hypervisor') {
             params[key] = this.hyperVisor.opts[input].name
           } else if (key === 'groupenabled') {