Commit b3e194fa authored by Sonia Zorba's avatar Sonia Zorba
Browse files

Implemented Add Permission modal and controller

parent d314eb43

gms-ui/src/api/server/index.js

+20 −0
Original line number Original line Diff line number Diff line
@@ -108,5 +108,25 @@ export default { 
        'Accept': 'application/json',

        'Accept': 'application/json',

      }

      }

    });

    });

  },

  addPermission (userId, permission, input) {

    let url = BASE_API_URL + 'permission';



    return apiRequest(url, {

      method: 'POST',

      cache: 'no-cache',

      credentials: 'include',

      headers: {

        'Content-Type': 'application/json',

        'Accept': 'application/json',

      },

      body: JSON.stringify({

        groupId: input.selectedGroupId,

        userId: userId,

        permission: permission,

        paginatorPageSize: input.paginatorPageSize,

        paginatorPage: input.paginatorPage

      })

    });

  }

  }

};
 
};

gms-ui/src/components/Main.vue

+2 −0
Original line number Original line Diff line number Diff line
@@ -25,6 +25,7 @@ import GroupsPanel from './GroupsPanel.vue' 
import MembersPanel from './MembersPanel.vue'

import MembersPanel from './MembersPanel.vue'

import PermissionsPanel from './PermissionsPanel.vue'

import PermissionsPanel from './PermissionsPanel.vue'

import NewGroupModal from './modals/NewGroupModal.vue'

import NewGroupModal from './modals/NewGroupModal.vue'

import AddMemberModal from './modals/AddMemberModal.vue'

import AddPermissionModal from './modals/AddPermissionModal.vue'

import AddPermissionModal from './modals/AddPermissionModal.vue'

import { mapState } from 'vuex';

import { mapState } from 'vuex';
@@ -36,6 +37,7 @@ export default { 
    MembersPanel,

    MembersPanel,

    PermissionsPanel,

    PermissionsPanel,

    NewGroupModal,

    NewGroupModal,

    AddMemberModal,

    AddPermissionModal

    AddPermissionModal

  },

  },

  computed: mapState({

  computed: mapState({

gms-ui/src/components/modals/AddMemberModal.vue

0 → 100644
+27 −0
Original line number Original line Diff line number Diff line 
<template>

  <b-modal id="add-member-modal" title="Add member" ok-title="Add" @ok="addMember">

    <SearchUser />

  </b-modal>

</template>



<script>

import client from 'api-client';

import SearchUser from './SearchUser.vue'



export default {

  name: 'AddMemberModal',

  components: {

    SearchUser

  },

  data: function() {

    return {

      permission: 'VIEW_MEMBERS'

    }

  },

  methods: {

    addMember: function() {



    }

  }

};

</script>

gms-ui/src/components/modals/AddPermissionModal.vue

+12 −3
Original line number Original line Diff line number Diff line 
<template>

<template>

  <b-modal id="add-permission-modal" title="Add permission" ok-title="Add" @ok="addPermission">

  <b-modal id="add-permission-modal" title="Add permission" ok-title="Add" @ok="addPermission">

    <SearchUser />

    <SearchUser ref="searchUser" />

  </b-modal>

  </b-modal>

</template>

</template>
@@ -15,12 +15,21 @@ export default { 
  },

  },

  data: function() {

  data: function() {

    return {

    return {



    }

    }

  },

  },

  methods: {

  methods: {

    addPermission: function() {

    addPermission: function(event) {

      // Prevent modal from closing

      event.preventDefault();



      let userId = this.$refs.searchUser.selectedUser;

      let permission = this.$refs.searchUser.permission;





      client.addPermission(userId, permission, this.$store.state.input)

        .then(res => {

          this.$store.commit('updatePermissionsPanel', res);

          this.$bvModal.hide('add-permission-modal');

        });

    }

    }

  }

  }

};

};

gms-ui/src/components/modals/SearchUser.vue

+8 −3
Original line number Original line Diff line number Diff line
@@ -11,12 +11,13 @@ 
    <label class="w-25" for="user-input" v-if="users.length > 0">Selected user:</label>

    <label class="w-25" for="user-input" v-if="users.length > 0">Selected user:</label>

    <b-form-select v-model="selectedUser" :options="users" class="w-75" v-if="users.length > 0"></b-form-select>

    <b-form-select v-model="selectedUser" :options="users" class="w-75" v-if="users.length > 0"></b-form-select>

    <div class="w-25"></div>

    <div class="w-25"></div>

    <b-form-group label="Permissions:" v-if="users.length > 0" class="w-75 mt-3">

    <b-form-group label="Permission:" v-if="users.length > 0 && model.permission === 'ADMIN'" class="w-75 mt-3">

      <b-form-radio-group

      <b-form-radio-group

        id="permissions-radio-group"

        id="permission-radio-group"

        v-model="permission">

        v-model="permission">

        <b-form-radio value="ADMIN">Admin</b-form-radio>

        <b-form-radio value="ADMIN">Admin</b-form-radio>

        <b-form-radio value="MANAGE_MEMBERS">Manage members</b-form-radio>

        <b-form-radio value="MANAGE_MEMBERS">Manage members</b-form-radio>

        <b-form-radio value="VIEW_MEMBERS">View members</b-form-radio>

      </b-form-radio-group>

      </b-form-radio-group>

    </b-form-group>

    </b-form-group>

  </b-form>

  </b-form>
@@ -24,15 +25,19 @@ 




<script>

<script>

import client from 'api-client';

import client from 'api-client';

import { mapState } from 'vuex';





export default {

export default {

  name: 'SearchUser',

  name: 'SearchUser',

  computed: mapState({

    model: state => state.model,

  }),

  data: function() {

  data: function() {

    return {

    return {

      searchInput: null,

      searchInput: null,

      users: [],

      users: [],

      selectedUser: null,

      selectedUser: null,

      permission: null

      permission: 'VIEW_MEMBERS'

    }

    }

  },

  },

  methods: {

  methods: {