-
-
- @foreach ($kategoriFiturs as $kategoriFitur)
-
-
- {{ $kategoriFitur->deskripsi }}
-
-
- @foreach ($fiturs->where('kategori_fitur_id', $kategoriFitur->id) as $fiturItem)
-
- @endforeach
-
+
+
+
Tambah Template
+
+
+
+
- @endforeach
+
+ @endif
+
+
+ @foreach ($templates as $template)
+
+
+
+
+
+
+
Edit Template
+
+
+
+
+
+
+
+
+
+
+
+ @endforeach
-
+
+ closeEditBtns.forEach(btn => {
+ btn.addEventListener('click', () => {
+ const id = btn.dataset.id;
+ const modal = document.getElementById('modalEdit' + id);
+ if (modal) {
+ modal.classList.add('hidden');
+ modal.classList.remove('flex');
+ }
+ });
+ });
+
+ closeEditOverlays.forEach(overlay => {
+ overlay.addEventListener('click', () => {
+ const id = overlay.dataset.id;
+ const modal = document.getElementById('modalEdit' + id);
+ if (modal) {
+ modal.classList.add('hidden');
+ modal.classList.remove('flex');
+ }
+ });
+ });
+
+ // =========================
+ // Modal Delete Template
+ // =========================
+ const deleteTemplateModal = document.getElementById('modalDeleteTemplate');
+ const deleteTemplateOverlay = document.getElementById('modalDeleteTemplateOverlay');
+ const closeDeleteTemplateModal = document.getElementById('closeDeleteTemplateModal');
+ const deleteTemplateForm = document.getElementById('deleteTemplateForm');
+ const deleteTemplateName = document.getElementById('deleteTemplateName');
+
+ document.querySelectorAll('.btn-delete-template').forEach(btn => {
+ btn.addEventListener('click', (e) => {
+ e.preventDefault(); // cegah form langsung submit
+ deleteTemplateForm.action = btn.dataset.action;
+ deleteTemplateName.textContent = btn.dataset.name || 'template ini';
+ deleteTemplateModal.classList.remove('hidden');
+ deleteTemplateModal.classList.add('flex');
+ });
+ });
+
+ const closeDeleteModalTemplate = () => {
+ deleteTemplateModal.classList.add('hidden');
+ deleteTemplateModal.classList.remove('flex');
+ };
+
+ if (closeDeleteTemplateModal) {
+ closeDeleteTemplateModal.addEventListener('click', closeDeleteModalTemplate);
+ }
+ if (deleteTemplateOverlay) {
+ deleteTemplateOverlay.addEventListener('click', closeDeleteModalTemplate);
+ }
+
+ // =========================
+ // Fitur: Hitung Harga Otomatis + Format ribuan
+ // =========================
+ function formatRibuan(x) {
+ if (!x) return '';
+ return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
+ }
+
+ function hitungHarga(container) {
+ let total = 0;
+
+ // Hitung checkbox (fitur tanpa kategori)
+ container.querySelectorAll('input[type="checkbox"][name="fitur_id[]"]:checked')
+ .forEach(cb => {
+ total += parseInt(cb.dataset.harga) || 0;
+ });
+
+ // Hitung radio (fitur per kategori)
+ container.querySelectorAll('input[type="radio"]:checked')
+ .forEach(radio => {
+ total += parseInt(radio.dataset.harga) || 0;
+ });
+
+ const inputHarga = container.querySelector('input[name="harga"]');
+ if (inputHarga && !inputHarga.dataset.manual) {
+ inputHarga.value = formatRibuan(total);
+ }
+ }
+
+ // Format harga manual + tetap auto ribuan
+ document.querySelectorAll('input[name="harga"]').forEach(input => {
+ input.classList.add("harga-input"); // pastikan ada class
+ input.addEventListener('input', (e) => {
+ let value = e.target.value.replace(/\D/g, ''); // hanya angka
+ e.target.value = formatRibuan(value);
+ e.target.dataset.manual = "true"; // flag manual
+ });
+ });
+
+ // Modal Tambah
+ if (modalTambah) {
+ const inputs = modalTambah.querySelectorAll('input[name="fitur_id[]"], input[type="radio"]');
+ const inputHarga = modalTambah.querySelector('input[name="harga"]');
+
+ inputs.forEach(input => {
+ input.addEventListener('change', () => hitungHarga(modalTambah));
+ });
+
+ if (inputHarga) {
+ inputHarga.addEventListener('input', () => {
+ inputHarga.dataset.manual = "true";
+ });
+ }
+
+ // Hitung awal kalau ada yang sudah tercentang
+ hitungHarga(modalTambah);
+ }
+
+ // Modal Edit (banyak)
+ document.querySelectorAll('[id^="modalEdit"]').forEach(modal => {
+ const inputs = modal.querySelectorAll('input[name="fitur_id[]"], input[type="radio"]');
+ const inputHarga = modal.querySelector('input[name="harga"]');
+
+ inputs.forEach(input => {
+ input.addEventListener('change', () => hitungHarga(modal));
+ });
+
+ if (inputHarga) {
+ inputHarga.addEventListener('input', () => {
+ inputHarga.dataset.manual = "true";
+ });
+ }
+
+ // Hitung awal kalau ada yang sudah tercentang
+ hitungHarga(modal);
+ });
+ });
+