e-cosplay/assets/admin.js

import './admin.scss'
import * as Turbo from "@hotwired/turbo"
import {AutoSubmit} from './class/AutoSubmit'
import {ServerCard} from './class/ServerCard'
import {AutoCustomer} from './class/AutoCustomer'
import {RepeatLine} from './class/RepeatLine'
import {OrderCtrl} from './class/OrderCtrl'


function script() {
    customElements.define('auto-submit',AutoSubmit,{extends:'form'})
    customElements.define('server-card',ServerCard,{extends:'div'})
    customElements.define('auto-customer',AutoCustomer,{extends:'button'})
    customElements.define('repeat-line',RepeatLine,{extends:'div'})
    customElements.define('order-ctrl',OrderCtrl,{extends:'div'})

}

function full() {
    const sidebar = document.getElementById('sidebar');
    const sidebarToggle = document.getElementById('sidebar-toggle');

    sidebarToggle.addEventListener('click', function () {
        sidebar.classList.toggle('-translate-x-full');
    });
    const submenuToggles = document.querySelectorAll('[data-submenu-toggle]');

    submenuToggles.forEach(button => {
        button.addEventListener('click', function () {
            const targetId = this.dataset.submenuToggle;
            const submenu = document.getElementById(`submenu-${targetId}`);
            const arrowIcon = this.querySelector('.arrow-icon');

            if (submenu && arrowIcon) {
                // Toggle the 'active' class on the submenu
                submenu.classList.toggle('active');
                // Toggle the 'rotate' class on the arrow icon
                arrowIcon.classList.toggle('rotate');
            }
        });
    });
}

document.addEventListener('DOMContentLoaded', ()=>{
    script();
});
document.addEventListener("turbo:load", ()=> {
    full()
});