From 86daf79a775defa347dc5e913510376c79590e43 Mon Sep 17 00:00:00 2001
From: Hoang Nguyen <hoangnm@unitech.vn>
Date: Tue, 25 Aug 2020 14:37:42 +0700
Subject: [PATCH] Fixes an issue that could not search on zone select (#602)

* Fixes an issue that could not search on zone select

* Fixes show error from console

* add search zone for Upload ISO

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

diff --git a/ui/src/views/image/RegisterOrUploadIso.vue b/ui/src/views/image/RegisterOrUploadIso.vue
index 501d52848cc..b244a2bda52 100644
--- a/ui/src/views/image/RegisterOrUploadIso.vue
+++ b/ui/src/views/image/RegisterOrUploadIso.vue
@@ -91,14 +91,7 @@
             :loading="zoneLoading"
             :placeholder="apiParams.zoneid.description">
             <a-select-option :value="opt.id" v-for="opt in zones" :key="opt.id">
-              <div v-if="currentForm === 'Upload'">
-                <div v-if="opt.name !== $t('label.all.zone')">
-                  {{ opt.name || opt.description }}
-                </div>
-              </div>
-              <div v-else>
-                {{ opt.name || opt.description }}
-              </div>
+              {{ opt.name || opt.description }}
             </a-select-option>
           </a-select>
         </a-form-item>
@@ -205,7 +198,7 @@ export default {
   },
   created () {
     this.zones = []
-    if (this.$store.getters.userInfo.roletype === 'Admin') {
+    if (this.$store.getters.userInfo.roletype === 'Admin' && this.currentForm === 'Create') {
       this.zones = [
         {
           id: '-1',
@@ -235,7 +228,7 @@ export default {
         this.zones = this.zones.concat(listZones)
       }).finally(() => {
         this.zoneLoading = false
-        this.selectedZone = this.currentForm === 'Create' ? (this.zones[0].id ? this.zones[0].id : '') : ((this.zones[1].id) ? this.zones[1].id : '')
+        this.selectedZone = (this.zones[0].id ? this.zones[0].id : '')
       })
     },
     fetchOsType () {
diff --git a/ui/src/views/image/RegisterOrUploadTemplate.vue b/ui/src/views/image/RegisterOrUploadTemplate.vue
index 19d85fc4e8d..d0b46892bc7 100644
--- a/ui/src/views/image/RegisterOrUploadTemplate.vue
+++ b/ui/src/views/image/RegisterOrUploadTemplate.vue
@@ -95,6 +95,10 @@
                   }]"
                   :loading="zones.loading"
                   mode="multiple"
+                  optionFilterProp="children"
+                  :filterOption="(input, option) => {
+                    return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+                  }"
                   :placeholder="apiParams.zoneids.description"
                   @change="handlerSelectZone">
                   <a-select-option v-for="opt in zones.opts" :key="opt.id">
@@ -122,13 +126,16 @@
                       }
                     ]
                   }]"
+                  showSearch
+                  optionFilterProp="children"
+                  :filterOption="(input, option) => {
+                    return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+                  }"
                   @change="handlerSelectZone"
                   :placeholder="apiParams.zoneid.description"
                   :loading="zones.loading">
                   <a-select-option :value="zone.id" v-for="zone in zones.opts" :key="zone.id">
-                    <div v-if="zone.name !== $t('label.all.zone')">
-                      {{ zone.name || zone.description }}
-                    </div>
+                    {{ zone.name || zone.description }}
                   </a-select-option>
                 </a-select>
               </a-form-item>
@@ -517,7 +524,7 @@ export default {
 
       this.allowed = false
 
-      if (store.getters.userInfo.roletype === this.rootAdmin) {
+      if (store.getters.userInfo.roletype === this.rootAdmin && this.currentForm === 'Create') {
         this.allowed = true
         listZones.push({
           id: this.$t('label.all.zone'),