Skip to content
Snippets Groups Projects
Commit 88449b98 authored by Sonia Zorba's avatar Sonia Zorba Committed by zonia3000
Browse files

Initial commit. Added GMS UI.

parents
No related branches found
No related tags found
No related merge requests found
<template>
<div>
<GroupsBreadcrumb v-bind:values="model.breadcrumbs" />
<div class="">
<button type="button" class="btn btn-primary float-right" v-if="model.permission === 'ADMIN'">Add member</button>
<button type="button" class="btn btn-primary float-right" v-if="model.permission === 'ADMIN'">Add group</button>
<button type="button" class="btn btn-primary float-right" v-if="model.permission === 'PI'">Add collaborator</button>
</div>
<b-tabs content-class="mt-3">
<GroupsPanel v-bind:model="model" />
<MembersPanel v-bind:model="model" />
</b-tab>
</b-tabs>
</div>
</template>
<script>
import GroupsBreadcrumb from './GroupsBreadcrumb.vue'
import GroupsPanel from './GroupsPanel.vue'
import MembersPanel from './MembersPanel.vue'
export default {
name: 'Main',
components: {
GroupsBreadcrumb,
GroupsPanel,
MembersPanel
},
props: {
model: Object
},
methods: {
addGroup: function() {
},
addMemeber: function() {
}
}
}
</script>
<template>
<b-tab title="Members">
<b-list-group v-for="member in model.membersPanel.members" id="members-list">
<b-list-group-item href="#">
{{member.label}}
<span v-if="model.permission === 'ADMIN'">
<a href="#" v-on:click="changeMemberPermission(member)">
<font-awesome-icon icon="edit"></font-awesome-icon>
</a>
<a href="#" v-on:click="deleteMember(member)">
<font-awesome-icon icon="trash"></font-awesome-icon>
</a>
</span>
</b-list-group-item>
</b-list-group>
<div class="text-center">
<b-pagination
v-model="model.membersPanel.paginator.page"
:total-rows="model.membersPanel.paginator.totalItems"
:per-page="model.membersPanel.paginator.pageSize"
aria-controls="members-list"
align="center"
v-on:change="setPage"
></b-pagination>
</div>
</b-tab>
</template>
<script>
export default {
name: 'MembersPanel',
props: {
model: Object
},
methods: {
deleteMember: function(member) {
console.log('deleteMember ' + member.id);
},
changeMemberPermission: function(member) {
console.log('changeMemberPermission ' + member.id);
},
setPage: function(page) {
console.log('setPage ', page);
}
}
}
</script>
<template>
<div>
<b-navbar toggleable="lg" type="dark" variant="info">
<b-navbar-brand href="#" class="d-none d-md-block">Group Membership Service</b-navbar-brand>
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
<b-collapse id="nav-collapse" is-nav>
<!-- Right aligned nav items -->
<b-navbar-nav class="ml-auto">
<b-nav-form>
<b-form-input size="sm" class="mr-sm-2" placeholder="Search"></b-form-input>
<b-button size="sm" class="my-2 my-sm-0" type="submit">Search</b-button>
</b-nav-form>
<b-nav-item-dropdown right v-if="user">
<template slot="button-content"><em>{{user}}</em></template>
<b-dropdown-item href="#">Preferences</b-dropdown-item>
</b-nav-item-dropdown>
</b-navbar-nav>
</b-collapse>
</b-navbar>
</div>
</template>
<script>
export default {
name: 'TopMenu',
props: {
user: String
}
}
</script>
import '@babel/polyfill'
import 'mutationobserver-shim'
import Vue from 'vue'
import './plugins/bootstrap-vue'
import App from './App.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faTrash, faEdit } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
library.add(faTrash, faEdit);
Vue.component('font-awesome-icon', FontAwesomeIcon);
Vue.config.productionTip = false;
new Vue({
render: h => h(App),
}).$mount('#app');
import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
Vue.use(BootstrapVue)
const path = require('path')
module.exports = {
chainWebpack: config => {
const apiClient = process.env.VUE_APP_API_CLIENT // mock or server
config.resolve.alias.set(
'api-client',
path.resolve(__dirname, `src/api/${apiClient}`)
)
}
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment