You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cloudstack.apache.org by ro...@apache.org on 2020/05/21 07:05:02 UTC
[cloudstack-primate] branch master updated: header: fix project
dropdown lifecycle
This is an automated email from the ASF dual-hosted git repository.
rohit pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/cloudstack-primate.git
The following commit(s) were added to refs/heads/master by this push:
new 45a2ff2 header: fix project dropdown lifecycle
45a2ff2 is described below
commit 45a2ff2a2f4b1dcbc3394c039ab744c25b062a3c
Author: Rohit Yadav <ro...@shapeblue.com>
AuthorDate: Thu May 21 12:32:32 2020 +0530
header: fix project dropdown lifecycle
Fixes #342
- Fix the project name to show currently selected project
- Reload project list of focus/clicking
- Fix icon size
- Remove code
Signed-off-by: Rohit Yadav <ro...@shapeblue.com>
---
src/components/header/ProjectMenu.vue | 35 +++++++++++++----------------------
1 file changed, 13 insertions(+), 22 deletions(-)
diff --git a/src/components/header/ProjectMenu.vue b/src/components/header/ProjectMenu.vue
index f3ea38b..d0a6b4d 100644
--- a/src/components/header/ProjectMenu.vue
+++ b/src/components/header/ProjectMenu.vue
@@ -20,12 +20,20 @@
<a-select
class="project-select"
defaultValue="Default View"
- :value="selectedProject"
+ :value="$store.getters.project.displaytext || $store.getters.project.name || 'Default View'"
:disabled="isDisabled()"
:filterOption="filterProject"
@change="changeProject"
+ @focus="fetchData"
showSearch>
- <a-icon slot="suffixIcon" style="font-size:14px" type="project" />
+
+ <a-tooltip placement="bottom" slot="suffixIcon">
+ <template slot="title">
+ <span>{{ $t('projects') }}</span>
+ </template>
+ <a-icon style="font-size: 20px; color: #999; margin-top: -5px" type="project" />
+ </a-tooltip>
+
<a-select-option v-for="(project, index) in projects" :key="index">
{{ project.displaytext || project.name }}
</a-select-option>
@@ -34,18 +42,14 @@
</template>
<script>
-import Vue from 'vue'
import store from '@/store'
import { api } from '@/api'
-import { CURRENT_PROJECT } from '@/store/mutation-types'
export default {
name: 'ProjectMenu',
data () {
return {
- visible: false,
- projects: [],
- selectedProject: 'Default View'
+ projects: []
}
},
mounted () {
@@ -56,24 +60,15 @@ export default {
if (this.isDisabled()) {
return
}
- // TODO: refactor fetching project list for project selector
- this.projects = []
var page = 1
const getNextPage = () => {
api('listProjects', { listAll: true, details: 'min', page: page, pageSize: 500 }).then(json => {
- if (this.projects.length === 0) {
- this.projects.push({ name: 'Default View' })
+ if (page === 1) {
+ this.projects = [{ name: 'Default View' }]
}
if (json && json.listprojectsresponse && json.listprojectsresponse.project) {
this.projects.push(...json.listprojectsresponse.project)
}
- const currentProject = Vue.ls.get(CURRENT_PROJECT) || {}
- for (var project of this.projects) {
- if (project && currentProject && project.id === currentProject.id) {
- this.setSelectedProject(project)
- break
- }
- }
if (this.projects.length - 1 < json.listprojectsresponse.count) {
page++
getNextPage()
@@ -85,12 +80,8 @@ export default {
isDisabled () {
return !Object.prototype.hasOwnProperty.call(store.getters.apis, 'listProjects')
},
- setSelectedProject (project) {
- this.selectedProject = project.displaytext || project.name
- },
changeProject (index) {
const project = this.projects[index]
- this.setSelectedProject(project)
this.$store.dispatch('SetProject', project)
this.$store.dispatch('ToggleTheme', project.id === undefined ? 'light' : 'dark')
this.$message.success(`Switched to "${project.name}"`)