43 lines
1.1 KiB
JavaScript
43 lines
1.1 KiB
JavaScript
import { Controller } from "@hotwired/stimulus"
|
|
|
|
export default class extends Controller {
|
|
static targets = ['active', 'tab', 'content'];
|
|
|
|
connect() {
|
|
console.log('#tabs controller connected');
|
|
}
|
|
/**
|
|
*
|
|
* @param {Event} event
|
|
*/
|
|
activate(event) {
|
|
event.preventDefault();
|
|
this.deactivate();
|
|
const activeId = event.currentTarget.dataset.id;
|
|
|
|
event.currentTarget.parentElement.classList.add('active');
|
|
this.contentTargets.find(c => c.dataset.id === activeId)
|
|
.classList.remove('d-hide');
|
|
}
|
|
|
|
reset() {
|
|
this.deactivate();
|
|
const activeId = this.activeTarget.dataset.id;
|
|
|
|
this.activeTarget.classList.add('active');
|
|
this.contentTargets.find(c => c.dataset.id === activeId)
|
|
.classList.remove('d-hide');
|
|
}
|
|
|
|
deactivate() {
|
|
this.tabTargets.forEach(tab => {
|
|
tab.classList.remove('active');
|
|
});
|
|
|
|
this.contentTargets.forEach(content => {
|
|
content.classList.add('d-hide');
|
|
});
|
|
}
|
|
}
|
|
|