This is an automated email from the ASF dual-hosted git repository.
nvazquez pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/cloudstack.git
The following commit(s) were added to refs/heads/main by this push:
new 9eefc76 UI: Filter menu UX improvements (#5994)
9eefc76 is described below
commit 9eefc76fc5ef9abf3d74a5cc6c528ca404c707fd
Author: Hoang Nguyen <[email protected]>
AuthorDate: Fri Feb 18 09:19:59 2022 +0700
UI: Filter menu UX improvements (#5994)
* fix filter menu
* fixes
* fixes
* fixes
---
ui/src/components/view/SearchView.vue | 19 ++++++++++++++-----
1 file changed, 14 insertions(+), 5 deletions(-)
diff --git a/ui/src/components/view/SearchView.vue
b/ui/src/components/view/SearchView.vue
index 6876c20..76f5170 100644
--- a/ui/src/components/view/SearchView.vue
+++ b/ui/src/components/view/SearchView.vue
@@ -59,6 +59,7 @@
initialValue: fieldValues[field.name] || null
}]"
showSearch
+ :dropdownMatchSelectWidth="false"
optionFilterProp="children"
:filterOption="(input, option) => {
return
option.componentOptions.propsData.label.toLowerCase().indexOf(input.toLowerCase())
>= 0
@@ -82,7 +83,7 @@
</span>
<a-icon v-else type="block" style="margin-right: 5px"
/>
</span>
- {{ $t(opt.name) }}
+ {{ $t(opt.path || opt.name) }}
</div>
</a-select-option>
</a-select>
@@ -309,25 +310,25 @@ export default {
if (zoneIndex > -1) {
const zones = response.filter(item => item.type === 'zoneid')
if (zones && zones.length > 0) {
- this.fields[zoneIndex].opts = zones[0].data
+ this.fields[zoneIndex].opts = this.sortArray(zones[0].data)
}
}
if (domainIndex > -1) {
const domain = response.filter(item => item.type === 'domainid')
if (domain && domain.length > 0) {
- this.fields[domainIndex].opts = domain[0].data
+ this.fields[domainIndex].opts = this.sortArray(domain[0].data,
'path')
}
}
if (podIndex > -1) {
const pod = response.filter(item => item.type === 'podid')
if (pod && pod.length > 0) {
- this.fields[podIndex].opts = pod[0].data
+ this.fields[podIndex].opts = this.sortArray(pod[0].data)
}
}
if (clusterIndex > -1) {
const cluster = response.filter(item => item.type === 'clusterid')
if (cluster && cluster.length > 0) {
- this.fields[clusterIndex].opts = cluster[0].data
+ this.fields[clusterIndex].opts = this.sortArray(cluster[0].data)
}
}
this.$forceUpdate()
@@ -347,6 +348,14 @@ export default {
this.fillFormFieldValues()
})
},
+ sortArray (data, key = 'name') {
+ return data.sort(function (a, b) {
+ if (a[key] < b[key]) { return -1 }
+ if (a[key] > b[key]) { return 1 }
+
+ return 0
+ })
+ },
fillFormFieldValues () {
this.fieldValues = {}
if (Object.keys(this.$route.query).length > 0) {
