This is an automated email from the ASF dual-hosted git repository. machristie pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git
commit d66982b38441d51ffa9738ab57047d53f88383bf Author: Marcus Christie <[email protected]> AuthorDate: Wed Jul 17 16:33:52 2019 -0400 Show as disabled applications that can't be executed --- .../js/containers/DashboardContainer.vue | 37 +++++++++++++++++----- .../common/js/components/ApplicationCard.vue | 13 +++++--- 2 files changed, 38 insertions(+), 12 deletions(-) diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/DashboardContainer.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/DashboardContainer.vue index b3ec934..cdbc8af 100644 --- a/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/DashboardContainer.vue +++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/DashboardContainer.vue @@ -21,13 +21,15 @@ </div> <div class="row"> <application-card - v-for="item in applicationModules" - v-bind:appModule="item" - v-bind:key="item.appModuleId" + v-for="item in allApplicationData" + v-bind:appModule="item.appModule" + v-bind:key="item.appModule.appModuleId" @app-selected="handleAppSelected" + :disabled="item.disabled" > </application-card> </div> + </div> </div> </template> @@ -41,8 +43,9 @@ export default { name: "dashboard-container", data() { return { - applicationModules: null, - userProfile: null + accessibleAppModules: null, + userProfile: null, + allApplicationModules: null }; }, components: { @@ -65,18 +68,36 @@ export default { return ( this.isNewUser && this.userProfile && - this.applicationModules && - this.applicationModules.length === 0 + this.accessibleAppModules.length === 0 ); + }, + accessibleModuleIds() { + return this.accessibleAppModules + ? this.accessibleAppModules.map(a => a.appModuleId) + : []; + }, + allApplicationData() { + return this.allApplicationModules + ? this.allApplicationModules.map(app => { + return { + appModule: app, + disabled: this.accessibleModuleIds.indexOf(app.appModuleId) < 0 + }; + }) + : []; } }, beforeMount: function() { services.ApplicationModuleService.list().then( - result => (this.applicationModules = result) + result => (this.accessibleAppModules = result) ); services.UserProfileService.retrieve({ lookup: session.Session.username }).then(userProfile => (this.userProfile = userProfile)); + // Load all application, including ones that aren't accessible by this user + services.ApplicationModuleService.listAll().then( + result => (this.allApplicationModules = result) + ); } }; </script> diff --git a/django_airavata/static/common/js/components/ApplicationCard.vue b/django_airavata/static/common/js/components/ApplicationCard.vue index 531b931..5e2e4d8 100644 --- a/django_airavata/static/common/js/components/ApplicationCard.vue +++ b/django_airavata/static/common/js/components/ApplicationCard.vue @@ -1,14 +1,14 @@ <template> <div class="col-md-6 col-xl-4"> - <div class="card application-card"> - <a href="#" class="card-link text-dark" @click.prevent="handleAppClick"> + <div class="card application-card" :class="cardClasses"> + <b-link :disabled="disabled" class="card-link text-dark" @click.prevent="handleAppClick"> <div class="card-body" > <h2 class="card-title h5">{{appModule.appModuleName}}</h2> <span class="badge badge-primary mr-1" v-for="tag in appModule.tags" :key="tag">{{tag}}</span> <span class="badge badge-primary mr-1" v-if="appModule.appModuleVersion" >{{appModule.appModuleVersion}}</span> <p class="card-text card-text--small mt-3 text-secondary">{{appModule.appModuleDescription}}</p> </div> - </a> + </b-link> </div> </div> </template> @@ -16,7 +16,7 @@ <script> export default { name: 'application-card', - props: ['appModule'], + props: ['appModule', 'disabled'], data:function () { return { }; @@ -25,6 +25,11 @@ export default { handleAppClick: function() { this.$emit('app-selected', this.appModule); } + }, + computed: { + cardClasses() { + return this.disabled ? ['is-disabled'] : []; + }, } } </script>
