- ADD: Added primary contact flag to user permissions UI.

- CHG: Version bump.

Author: sebastian-raubach

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "gatekeeper",
-  "version": "4.8.4",
+  "version": "4.8.5",
   "description": "",
   "author": "Sebastian Raubach",
   "scripts": {
@@ -18,7 +18,7 @@
     "vue": "^2.6.14",
     "vue-flag-icon": "~1.0.6",
     "vue-i18n": "^8.27.1",
-    "vue-material-design-icons": "~3.2.0",
+    "vue-material-design-icons": "^5.3.1",
     "vue-router": "^3.5.1",
     "vuex": "^3.6.2",
     "vuex-persistedstate": "^4.1.0",

package.json

@@ -13,6 +13,14 @@
                   :options="userTypeOptions"
                   @change="setUserType(data.item, $event)" />
     </template>
+    <template #cell(userIsPrimaryContact)="data">
+      <b-form-checkbox
+        value="1"
+        unchecked-value="0"
+        switch
+        :checked="data.item.userIsPrimaryContact"
+        @change="setUserPrimary(data.item, $event)" />
+    </template>
   </BaseTable>
 </template>
 
@@ -65,6 +73,10 @@ export default {
         key: 'userTypeId',
         label: this.$t('tableColumnUserType'),
         sortable: true
+      }, {
+        key: 'userIsPrimaryContact',
+        label: this.$t('tableColumnUserIsPrimary'),
+        sortable: true
       }, {
         key: 'delete',
         label: this.$t('actionDelete'),
@@ -83,6 +95,11 @@ export default {
     refresh: function () {
       this.$refs.table.refresh()
     },
+    setUserPrimary: function (row, newValue) {
+      const payload = JSON.parse(JSON.stringify(row))
+      payload.userIsPrimaryContact = newValue
+      this.apiPatchUserPermission(payload, () => this.refresh())
+    },
     setUserType: function (row, newValue) {
       const payload = JSON.parse(JSON.stringify(row))
       payload.userTypeId = newValue

src/components/DatabasePermissionTable.vue

@@ -1,17 +1,26 @@
 <template>
   <BaseTable :columns="columns" :getData="getData" ref="table">
-    <template v-slot:cell(delete)="data">
+    <template #cell(delete)="data">
       <b-button variant="danger"
               size="sm"
               @click="deleteUserPermission(data.item)">
         <MdiIcon :path="mdiDelete" />
       </b-button>
     </template>
-    <template v-slot:cell(userTypeId)="data">
+    <template #cell(userTypeId)="data">
       <b-form-select
-                  :value="data.item.userTypeId"
-                  :options="userTypeOptions"
-                  @change="setUserType(data.item, $event)" />
+        class="user-type-select"
+        :value="data.item.userTypeId"
+        :options="userTypeOptions"
+        @change="setUserType(data.item, $event)" />
+    </template>
+    <template #cell(userIsPrimaryContact)="data">
+      <b-form-checkbox
+        value="1"
+        unchecked-value="0"
+        switch
+        :checked="data.item.userIsPrimaryContact"
+        @change="setUserPrimary(data.item, $event)" />
     </template>
   </BaseTable>
 </template>
@@ -59,6 +68,10 @@ export default {
         key: 'userTypeId',
         label: this.$t('tableColumnUserType'),
         sortable: true
+      }, {
+        key: 'userIsPrimaryContact',
+        label: this.$t('tableColumnUserIsPrimary'),
+        sortable: true
       }, {
         key: 'delete',
         label: this.$t('actionDelete'),
@@ -83,6 +96,11 @@ export default {
     refresh: function () {
       this.$refs.table.refresh()
     },
+    setUserPrimary: function (row, newValue) {
+      const payload = JSON.parse(JSON.stringify(row))
+      payload.userIsPrimaryContact = newValue
+      this.apiPatchUserPermission(payload, () => this.refresh())
+    },
     setUserType: function (row, newValue) {
       const payload = JSON.parse(JSON.stringify(row))
       payload.userTypeId = newValue
@@ -105,6 +123,8 @@ export default {
 }
 </script>
 
-<style>
-
+<style scoped>
+.user-type-select {
+  min-width: 100px;
+}
 </style>

src/components/UserPermissionTable.vue

@@ -116,6 +116,7 @@
   "tableColumnInstituteAddress": "Institutsadresse",
   "tableColumnLastLogin": "Letzte Anmeldung",
   "tableColumnUserType": "Benutzertyp",
+  "tableColumnUserIsPrimary": "Ist primärer Kontakt",
   "tableColumnRequestsAccessTo": "Fragt nach Zugriff auf",
   "tableColumnRequestsActivationKey": "Email-Aktivierung",
   "tableColumnRequestsOnServer": "Auf Server",

src/lang/de_DE.json

@@ -15,7 +15,7 @@
   "errorMessageInvalidUsernamePassword": "Invalid username or password",
   "errorMessageActivationInvalidKey": "Invalid activation key. This can happen if the account has already been activated.",
   "errorMessageNoActivationKey": "No activation key provided.",
-  "appVersion": "4.8.4",
+  "appVersion": "4.8.5",
   "formLabelEmail": "Email address",
   "formLabelCurrentPassword": "Old password",
   "formLabelUsername": "Username",
@@ -118,6 +118,7 @@
   "tableColumnInstituteAddress": "Institute address",
   "tableColumnLastLogin": "Last login",
   "tableColumnUserType": "User type",
+  "tableColumnUserIsPrimary": "Is primary contact",
   "tableColumnRequestsAccessTo": "Requests access to",
   "tableColumnRequestsActivationKey": "Email activation",
   "tableColumnRequestsOnServer": "On server",

src/lang/en_GB.json

@@ -7,7 +7,7 @@
             <template v-if="token && token.fullName">
               <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">{{ token.fullName }}</h6>
               <ul class="nav flex-column">
-                <b-nav-item to="/"><SettingsIcon class="mr-2" /><span>{{ $t('menuUserSettings') }}</span></b-nav-item>
+                <b-nav-item to="/"><CogIcon class="mr-2" /><span>{{ $t('menuUserSettings') }}</span></b-nav-item>
               </ul>
             </template>
             <template v-if="stats">
@@ -38,7 +38,7 @@
 import AccountGroupIcon from 'vue-material-design-icons/AccountGroup'
 import AccountQuestionIcon from 'vue-material-design-icons/AccountQuestion'
 import DatabaseIcon from 'vue-material-design-icons/Database'
-import SettingsIcon from 'vue-material-design-icons/Settings'
+import CogIcon from 'vue-material-design-icons/Cog'
 import { mapState } from 'vuex'
 import { EventBus } from '../event-bus.js'
 
@@ -53,7 +53,7 @@ export default {
     AccountGroupIcon,
     AccountQuestionIcon,
     DatabaseIcon,
-    SettingsIcon
+    CogIcon
   },
   computed: {
     ...mapState([

src/views/Main.vue

@@ -70,6 +70,17 @@
                                    :options="userTypeOptions"
                                    required />
                   </b-input-group>
+                  <b-input-group class="mt-3">
+                    <b-input-group-prepend is-text>
+                      <CardAccountMailIcon class="form-icon" />
+                    </b-input-group-prepend>
+                    <b-form-checkbox v-model="newPermission.userIsPrimaryContact"
+                                     value="1"
+                                     unchecked-value="0"
+                                     class="form-control form-checkbox"
+                                     switch
+                                     required>{{ $t('tableColumnUserIsPrimary') }}</b-form-checkbox>
+                  </b-input-group>
                   <b-button type="submit" variant="primary" class="mt-3">{{ $t('actionAdd') }}</b-button>
                 </b-form>
               </b-tab>
@@ -106,6 +117,17 @@
                                    :options="userTypeOptions"
                                    required />
                   </b-input-group>
+                  <b-input-group class="mt-3">
+                    <b-input-group-prepend is-text>
+                      <CardAccountMailIcon class="form-icon" />
+                    </b-input-group-prepend>
+                    <b-form-checkbox v-model="newPermission.userIsPrimaryContact"
+                                     value="1"
+                                     unchecked-value="0"
+                                     class="form-control form-checkbox"
+                                     switch
+                                     required>{{ $t('tableColumnUserIsPrimary') }}</b-form-checkbox>
+                  </b-input-group>
                   <b-button type="submit" variant="primary" class="mt-3">{{ $t('actionAdd') }}</b-button>
                 </b-form>
               </b-tab>
@@ -119,6 +141,7 @@
 
 <script>
 import AccountStarIcon from 'vue-material-design-icons/AccountStar.vue'
+import CardAccountMailIcon from 'vue-material-design-icons/CardAccountMail.vue'
 import DatabaseIcon from 'vue-material-design-icons/Database.vue'
 import PencilIcon from 'vue-material-design-icons/Pencil.vue'
 import ServerIcon from 'vue-material-design-icons/Server.vue'
@@ -137,7 +160,8 @@ export default {
         database: null,
         server: null,
         description: null,
-        userType: 2
+        userType: 2,
+        userIsPrimaryContact: false
       },
       userTypeOptions: [{
         value: 1,
@@ -160,7 +184,8 @@ export default {
     PencilIcon,
     ServerIcon,
     UserTable,
-    UserPermissionTable
+    UserPermissionTable,
+    CardAccountMailIcon
   },
   methods: {
     getInstitution: function () {
@@ -194,7 +219,8 @@ export default {
         database: null,
         server: null,
         description: null,
-        userType: 2
+        userType: 2,
+        userIsPrimaryContact: false
       }
     },
     onDeleteUserClicked: function () {
@@ -230,7 +256,8 @@ export default {
             const toSend = {
               userId: this.user.id,
               databaseId: result,
-              userTypeId: this.newPermission.userType
+              userTypeId: this.newPermission.userType,
+              userIsPrimaryContact: this.newPermission.userIsPrimaryContact
             }
 
             EventBus.$emit('stats-count-changed')
@@ -248,7 +275,8 @@ export default {
         const toSend = {
           userId: this.user.id,
           databaseId: this.newPermission.database,
-          userTypeId: this.newPermission.userType
+          userTypeId: this.newPermission.userType,
+          userIsPrimaryContact: this.newPermission.userIsPrimaryContact
         }
 
         this.apiPostUserPermission(toSend, result => {
@@ -273,4 +301,7 @@ export default {
 </script>
 
 <style>
+.form-checkbox .custom-control-label {
+  margin-left: 0.5rem !important;
+}
 </style>