Easy_solution/assets/controllers/user_controller.js

78 lines
2.4 KiB
JavaScript

import {Controller} from '@hotwired/stimulus';
import Choices from 'choices.js';
/*
* The following line makes this controller "lazy": it won't be downloaded until needed
* See https://symfony.com/bundles/StimulusBundle/current/index.html#lazy-stimulus-controllers
*/
/* stimulusFetch: 'lazy' */
export default class extends Controller {
static values = {
rolesArray: Array,
selectedRoleIds: Array,
applicationsArray: Array,
selectedApplicationIds: Array
}
// {value: 'choice1', label: 'Choice 1'},
// {value: 'choice2', label: 'Choice 2'},
// {value: 'choice3', label: 'Choice 3'},
roleSelect() {
const element = document.getElementById('roles');
if (element) {
const choicesData = this.rolesArrayValue.map(role => ({
value: role.id,
label: role.name,
selected: this.selectedRoleIdsValue.includes(role.id)
}));
const choices = new Choices(element, {
choices: choicesData,
removeItemButton: true,
placeholder: true,
placeholderValue: 'Ajouter un ou plusieurs rôles'
});
}
}
appSelect() {
const element = document.getElementById('applications');
if (element) {
const choicesData = this.applicationsArrayValue.map(app => ({
value: app.id,
label: app.name,
customProperties: {icon: app.icon},
selected: this.selectedApplicationIdsValue.includes(app.id)
}));
const choices = new Choices(element, {
choices: choicesData,
removeItemButton: true,
placeholder: true,
placeholderValue: 'Ajouter une ou plusieurs applications',
});
}
}
connect() {
this.roleSelect();
this.appSelect();
// Set choices after initialization
// choices.setValue(choicesData);
}
// Add custom controller actions here
// fooBar() { this.fooTarget.classList.toggle(this.bazClass) }
disconnect() {
// Called anytime its element is disconnected from the DOM
// (on page change, when it's removed from or moved in the DOM, etc.)
// Here you should remove all event listeners added in "connect()"
// this.fooTarget.removeEventListener('click', this._fooBar)
}
}