BookStack Code Mirror - bookstack/blob - resources/js/components/entity-permissions.js

   1 import {htmlToDom} from "../services/dom";
   2 import {Component} from "./component";
   3
   4 export class EntityPermissions extends Component {
   5
   6     setup() {
   7         this.container = this.$el;
   8         this.entityType = this.$opts.entityType;
   9
  10         this.everyoneInheritToggle = this.$refs.everyoneInherit;
  11         this.roleSelect = this.$refs.roleSelect;
  12         this.roleContainer = this.$refs.roleContainer;
  13
  14         this.setupListeners();
  15     }
  16
  17     setupListeners() {
  18         // "Everyone Else" inherit toggle
  19         this.everyoneInheritToggle.addEventListener('change', event => {
  20             const inherit = event.target.checked;
  21             const permissions = document.querySelectorAll('input[name^="permissions[0]["]');
  22             for (const permission of permissions) {
  23                 permission.disabled = inherit;
  24                 permission.checked = false;
  25             }
  26         });
  27
  28         // Remove role row button click
  29         this.container.addEventListener('click', event => {
  30             const button = event.target.closest('button');
  31             if (button && button.dataset.roleId) {
  32                 this.removeRowOnButtonClick(button)
  33             }
  34         });
  35
  36         // Role select change
  37         this.roleSelect.addEventListener('change', event => {
  38             const roleId = this.roleSelect.value;
  39             if (roleId) {
  40                 this.addRoleRow(roleId);
  41             }
  42         });
  43     }
  44
  45     async addRoleRow(roleId) {
  46         this.roleSelect.disabled = true;
  47
  48         // Remove option from select
  49         const option = this.roleSelect.querySelector(`option[value="${roleId}"]`);
  50         if (option) {
  51             option.remove();
  52         }
  53
  54         // Get and insert new row
  55         const resp = await window.$http.get(`/permissions/form-row/${this.entityType}/${roleId}`);
  56         const row = htmlToDom(resp.data);
  57         this.roleContainer.append(row);
  58
  59         this.roleSelect.disabled = false;
  60     }
  61
  62     removeRowOnButtonClick(button) {
  63         const row = button.closest('.item-list-row');
  64         const roleId = button.dataset.roleId;
  65         const roleName = button.dataset.roleName;
  66
  67         const option = document.createElement('option');
  68         option.value = roleId;
  69         option.textContent = roleName;
  70
  71         this.roleSelect.append(option);
  72         row.remove();
  73     }
  74
  75 }