FIX: Renamed tokens.vue to Tokens.vue; added individual role selection

role selection is WIP, API not working rn

frontend/src/views/netdb/tokens.vue → frontend/src/views/netdb/Tokens.vue

@@ -12,14 +12,32 @@
                     />
                 </b-form-group>
                 <template v-if="roles_by_account != null && roles_by_account[$store.state.user.login_name] != null">
-                    <b-form-group label="Rollen" label-for="input-account-create-do-copy-roles">
-                        <b-form-checkbox id="input-account-create-do-copy-roles"
-                                         v-model="new_account.do_copy_roles">
-                            Parent-Rollen übernehmen
-                        </b-form-checkbox>
+                    <b-form-group label="Rollen">
+                        <b-form-radio v-model="new_account.do_copy_roles" :value="true">von Parent-Account übernehmen
+                        </b-form-radio>
+                        <b-form-radio v-model="new_account.do_copy_roles" :value="false">individuell zuweisen
+                        </b-form-radio>
                     </b-form-group>
                     <template v-if="!new_account.do_copy_roles">
-                        TODO: Rollen zuweisen <!-- TODO: look to the left-->
+                        <template v-for="role in roles_by_account[$store.state.user.login_name]">
+                            <b-button
+                                    :key="'role-badge-' + role.mgr_login_name + '-' + role.role_fq_name"
+                                    :id="'account-create-role-badge-' + role.mgr_login_name + '-' + role.role_fq_name"
+                                    :style="{background: role.role_fq_name.toHSL({lit: [30, 40]}), border: 'none'}"
+                                    class="mr-1 mb-1 badge">
+                                {{role.system.toUpperCase()}}<br>{{role.role}}
+                                <b-checkbox/>
+                            </b-button>
+                            <b-popover
+                                    :key="'role-badge-tooltip' + role.mgr_login_name + '-' + role.role_fq_name"
+                                    :target="'account-create-role-badge-' + role.mgr_login_name + '-' + role.role_fq_name"
+                                    triggers="focus"
+                                    placement="bottom">
+                                <b-table :fields="permission_list_fields"
+                                         :items="role.contained_permissions"
+                                         sticky-header/>
+                            </b-popover>
+                        </template>
                     </template>
                 </template>
             </b-form>
@@ -60,6 +78,29 @@
                             placeholder="Beschreibung eingeben"
                     />
                 </b-form-group>
+                <b-form-group label="Rollen">
+                    <template v-if="roles_by_account != null && roles_by_account[$store.state.user.login_name] != null">
+                        <template v-for="role in roles_by_account[$store.state.user.login_name]">
+                            <b-button
+                                    :key="'role-badge-' + role.mgr_login_name + '-' + role.role_fq_name"
+                                    :id="'account-create-role-badge-' + role.mgr_login_name + '-' + role.role_fq_name"
+                                    :style="{background: role.role_fq_name.toHSL({lit: [30, 40]}), border: 'none'}"
+                                    class="mr-1 mb-1 badge">
+                                {{role.system.toUpperCase()}}<br>{{role.role}}
+                                <b-checkbox/>
+                            </b-button>
+                            <b-popover
+                                    :key="'role-badge-tooltip' + role.mgr_login_name + '-' + role.role_fq_name"
+                                    :target="'account-create-role-badge-' + role.mgr_login_name + '-' + role.role_fq_name"
+                                    triggers="focus"
+                                    placement="bottom">
+                                <b-table :fields="permission_list_fields"
+                                         :items="role.contained_permissions"
+                                         sticky-header/>
+                            </b-popover>
+                        </template>
+                    </template>
+                </b-form-group>
             </b-form>
             <template v-slot:modal-footer="{cancel}">
                 <b-alert id="alert-edit-account" v-model="show_modal_alert"
@@ -232,7 +273,7 @@
                                         <b-popover
                                                 :key="'role-badge-tooltip' + role.mgr_login_name + '-' + role.role_fq_name"
                                                 :target="account.login_name + '-role-badge-' + role.mgr_login_name + '-' + role.role_fq_name"
-                                                triggers="click blur"
+                                                triggers="focus"
                                                 placement="bottom">
                                             <b-table :fields="permission_list_fields"
                                                      :items="role.contained_permissions"
@@ -316,7 +357,7 @@
     import TokenService from '@/api-services.gen/cntl.wapi_auth'
     import ApiUtil from '@/util/apiutil'
     import '@/util/colorutil'
-    import DateTimePicker from "../../components/date-time-picker";
+    import DateTimePicker from "../../components/DateTimePicker";
 
     export default {
         name: 'tokens',
@@ -331,7 +372,8 @@
                     description: '',
                     login_name: '',
                     expiration_date: null,
-                    do_copy_roles: true
+                    do_copy_roles: true,
+                    role_selection: []
                 },
                 new_token: {
                     description: '',
@@ -444,6 +486,7 @@
                 this.new_account.login_name = ''
                 this.new_account.expiration_date = null
                 this.new_account.do_copy_roles = true
+                this.new_account.role_selection = []
             },
             resetTokenData() {
                 this.new_token.description = ''
@@ -485,6 +528,7 @@
                     login_name_old: this.new_account.login_name
                 }).then(() => {
                     this.$bvModal.hide('modal-edit-account')
+                    this.fetchData()
                 }).catch(error => {
                     this.modal_alert_content = error.response.data.error.type.text_descr
                     this.show_modal_alert = true