diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2017-03-28 13:56:24 +0300 |
---|---|---|
committer | Filipa Lacerda <filipa@gitlab.com> | 2017-03-28 16:11:04 +0300 |
commit | b64555d36a0b931dc087ddb48674c0fe36581e8c (patch) | |
tree | bd1fbd68b975728be0d086958ad955f80486f9f0 /app/assets/javascripts/environments/components | |
parent | adec9194ef9b825a3a79dc262975987012639f23 (diff) |
Adds show all button
Diffstat (limited to 'app/assets/javascripts/environments/components')
3 files changed, 54 insertions, 16 deletions
diff --git a/app/assets/javascripts/environments/components/environment.js b/app/assets/javascripts/environments/components/environment.js index 57599876f5a..9760b30f30c 100644 --- a/app/assets/javascripts/environments/components/environment.js +++ b/app/assets/javascripts/environments/components/environment.js @@ -78,11 +78,11 @@ export default Vue.component('environment-component', { }, methods: { - toggleFolder(folder) { + toggleFolder(folder, folderUrl) { this.store.toggleFolder(folder); if (!folder.isOpen) { - this.fetchChildEnvironments(folder); + this.fetchChildEnvironments(folder, folderUrl); } }, @@ -125,14 +125,13 @@ export default Vue.component('environment-component', { }); }, - fetchChildEnvironments(folder) { + fetchChildEnvironments(folder, folderUrl) { this.isLoadingFolderContent = true; - this.service.getFolderContent(folder.folderName) + this.service.getFolderContent(folderUrl) .then(resp => resp.json()) .then((response) => { - console.log(response); - this.store.folderContent(folder, response.environments); + this.store.setfolderContent(folder, response.environments); }) .then(() => { this.isLoadingFolderContent = false; @@ -204,7 +203,8 @@ export default Vue.component('environment-component', { :environments="state.environments" :can-create-deployment="canCreateDeploymentParsed" :can-read-environment="canReadEnvironmentParsed" - :service="service"/> + :service="service" + :is-loading-folder-content="isLoadingFolderContent" /> </div> <table-pagination v-if="state.paginationInformation && state.paginationInformation.totalPages > 1" diff --git a/app/assets/javascripts/environments/components/environment_item.js b/app/assets/javascripts/environments/components/environment_item.js index 8cfaeb69233..3fe1042557e 100644 --- a/app/assets/javascripts/environments/components/environment_item.js +++ b/app/assets/javascripts/environments/components/environment_item.js @@ -392,6 +392,15 @@ export default { return ''; }, + + /** + * Constructs folder URL based on the current location and the folder id. + * + * @return {String} + */ + folderUrl() { + return `${window.location.pathname}/folders/${this.model.folderName}`; + }, }, /** @@ -411,12 +420,12 @@ export default { methods: { onClickFolder() { - eventHub.$emit('toggleFolder', this.model); + eventHub.$emit('toggleFolder', this.model, this.folderUrl); }, }, template: ` - <tr> + <tr :class="{ 'child-row': model.isChildren }"> <td> <a v-if="!model.isFolder" class="environment-name" diff --git a/app/assets/javascripts/environments/components/environments_table.js b/app/assets/javascripts/environments/components/environments_table.js index d59cb6500a2..5a1f28d0bdf 100644 --- a/app/assets/javascripts/environments/components/environments_table.js +++ b/app/assets/javascripts/environments/components/environments_table.js @@ -31,6 +31,18 @@ export default { type: Object, required: true, }, + + isLoadingFolderContent: { + type: Boolean, + required: false, + default: false, + }, + }, + + methods: { + folderUrl(model) { + return `${window.location.pathname}/folders/${model.folderName}`; + }, }, template: ` @@ -54,13 +66,30 @@ export default { :can-read-environment="canReadEnvironment" :service="service"></tr> - <tr v-if="model.isFolder && model.isOpen && model.children && model.children.length > 0" - is="environment-item" - v-for="children in model.children" - :model="children" - :can-create-deployment="canCreateDeploymentParsed" - :can-read-environment="canReadEnvironmentParsed" - :service="service"></tr> + <template v-if="model.isFolder && model.isOpen && model.children && model.children.length > 0"> + <tr v-if="isLoadingFolderContent"> + <td colspan="6" class="text-center"> + <i class="fa fa-spin fa-spinner" aria-hidden="true"/> + </td> + </tr> + + <tr v-if="!isLoadingFolderContent" + is="environment-item" + v-for="children in model.children" + :model="children" + :can-create-deployment="canCreateDeployment" + :can-read-environment="canReadEnvironment" + :service="service"></tr> + + <tr v-if="!isLoadingFolderContent"> + <td colspan="6" class="text-center"> + <a :href="folderUrl(model)" class="btn btn-default"> + Show all + </a> + </td> + </tr> + </template> + </template> </tbody> </table> |