import { t as AdminLayout_default } from "./AdminLayout-DcKfAlG1.js";
import { Head, router, useForm } from "@inertiajs/vue3";
import { Fragment, computed, createBlock, createCommentVNode, createTextVNode, createVNode, defineComponent, openBlock, ref, renderList, resolveComponent, toDisplayString, unref, useSSRContext, vModelRadio, vModelSelect, vModelText, watch, withCtx, withDirectives, withModifiers } from "vue";
import { ssrIncludeBooleanAttr, ssrInterpolate, ssrLooseContain, ssrLooseEqual, ssrRenderAttr, ssrRenderClass, ssrRenderComponent, ssrRenderList, ssrRenderStyle } from "vue/server-renderer";
import { Edit2, Grid, Link as Link$1, Plus, QrCode, Store, Trash2, Unlink, X } from "lucide-vue-next";
//#region resources/js/Pages/CafePOS/Tables/Index.vue?vue&type=script&setup=true&lang.ts
var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
	__name: "Index",
	__ssrInlineRender: true,
	props: {
		tables: {},
		outlets: {},
		filters: {}
	},
	setup(__props) {
		const selectedTableIds = ref([]);
		const isBulkQrModalOpen = ref(false);
		const printScope = ref("selected");
		const printTemplate = ref("a4-3");
		const toggleSelectTable = (id) => {
			const idx = selectedTableIds.value.indexOf(id);
			if (idx > -1) selectedTableIds.value.splice(idx, 1);
			else selectedTableIds.value.push(id);
		};
		const isAllSelected = computed(() => {
			return props.tables.length > 0 && selectedTableIds.value.length === props.tables.length;
		});
		const toggleSelectAll = () => {
			if (isAllSelected.value) selectedTableIds.value = [];
			else selectedTableIds.value = props.tables.map((t) => t.id);
		};
		const openBulkQrModal = () => {
			if (selectedTableIds.value.length > 0) printScope.value = "selected";
			else printScope.value = "all";
			isBulkQrModalOpen.value = true;
		};
		const tablesToPrint = computed(() => {
			if (printScope.value === "selected") return props.tables.filter((t) => selectedTableIds.value.includes(t.id));
			return props.tables;
		});
		const triggerPrint = () => {
			window.print();
		};
		const props = __props;
		const selectedOutletId = ref(props.filters.outlet_id || (props.outlets[0] ? String(props.outlets[0].id) : ""));
		watch(selectedOutletId, (newVal) => {
			router.get(route("tables.index"), { outlet_id: newVal }, {
				preserveState: true,
				replace: true
			});
		});
		const isFormModalOpen = ref(false);
		const isMergeModalOpen = ref(false);
		const isQrModalOpen = ref(false);
		const editingTable = ref(null);
		const activeQrTable = ref(null);
		const openQrModal = (table) => {
			activeQrTable.value = table;
			isQrModalOpen.value = true;
		};
		const getQrCodeUrl = (table) => {
			const url = `${window.location.origin}/order/outlet/${table.outlet_id}/table/${table.id}`;
			return `https://api.qrserver.com/v1/create-qr-code/?size=350x350&data=${encodeURIComponent(url)}`;
		};
		const form = useForm({
			outlet_id: selectedOutletId.value ? Number(selectedOutletId.value) : 0,
			number: "",
			capacity: 2,
			status: "available"
		});
		const mergeForm = useForm({
			source_table_id: "",
			target_table_id: ""
		});
		const openCreateModal = () => {
			editingTable.value = null;
			form.clearErrors();
			form.reset();
			form.outlet_id = selectedOutletId.value ? Number(selectedOutletId.value) : 0;
			isFormModalOpen.value = true;
		};
		const openEditModal = (table) => {
			editingTable.value = table;
			form.clearErrors();
			form.outlet_id = table.outlet_id;
			form.number = table.number;
			form.capacity = table.capacity;
			form.status = table.status;
			isFormModalOpen.value = true;
		};
		const submitForm = () => {
			if (editingTable.value) form.put(route("tables.update", editingTable.value.id), { onSuccess: () => {
				isFormModalOpen.value = false;
				form.reset();
			} });
			else form.post(route("tables.store"), { onSuccess: () => {
				isFormModalOpen.value = false;
				form.reset();
			} });
		};
		const deleteTable = (table) => {
			if (confirm(`Apakah Anda yakin ingin menghapus ${table.number}?`)) router.delete(route("tables.destroy", table.id));
		};
		const openMergeModal = (table) => {
			mergeForm.reset();
			mergeForm.source_table_id = String(table.id);
			isMergeModalOpen.value = true;
		};
		const submitMerge = () => {
			mergeForm.post(route("tables.merge"), { onSuccess: () => {
				isMergeModalOpen.value = false;
				mergeForm.reset();
			} });
		};
		const splitTable = (table) => {
			if (confirm(`Apakah Anda yakin ingin memisahkan ${table.number}?`)) router.post(route("tables.split"), { table_id: table.id });
		};
		const mergeableTargets = computed(() => {
			if (!mergeForm.source_table_id) return [];
			const sourceId = Number(mergeForm.source_table_id);
			return props.tables.filter((t) => t.id !== sourceId && t.status === "available" && !t.merged_to_id);
		});
		const getStatusBadgeClass = (status) => {
			switch (status) {
				case "available": return "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400 border-emerald-500/20";
				case "occupied": return "bg-amber-500/10 text-amber-600 dark:text-amber-400 border-amber-500/20";
				case "reserved": return "bg-indigo-500/10 text-indigo-600 dark:text-indigo-400 border-indigo-500/20";
				default: return "bg-slate-500/10 text-slate-600 dark:text-slate-400 border-slate-500/20";
			}
		};
		return (_ctx, _push, _parent, _attrs) => {
			const _component_Info = resolveComponent("Info");
			_push(`<!--[-->`);
			_push(ssrRenderComponent(unref(Head), { title: "Table Management" }, null, _parent));
			_push(ssrRenderComponent(AdminLayout_default, null, {
				default: withCtx((_, _push, _parent, _scopeId) => {
					if (_push) {
						_push(`<div class="space-y-6"${_scopeId}><div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4"${_scopeId}><div${_scopeId}><h1 class="text-2xl font-extrabold text-slate-900 dark:text-slate-50 tracking-tight"${_scopeId}> Table Management </h1><p class="text-sm text-slate-500 dark:text-slate-400 mt-1"${_scopeId}> Kelola kapasitas, merge, status, dan okupansi meja restoran. </p></div><button class="flex items-center justify-center gap-2 px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-sm font-bold rounded-xl transition-all cursor-pointer shadow-lg shadow-[#8c5a3c]/10"${_scopeId}>`);
						_push(ssrRenderComponent(unref(Plus), { class: "h-4 w-4" }, null, _parent, _scopeId));
						_push(` Tambah Meja </button></div><div class="flex flex-wrap items-center justify-between gap-4 bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl px-5 py-4 shadow-sm"${_scopeId}><div class="flex flex-wrap items-center gap-5"${_scopeId}><div class="flex items-center gap-3"${_scopeId}>`);
						_push(ssrRenderComponent(unref(Store), { class: "h-5 w-5 text-slate-400" }, null, _parent, _scopeId));
						_push(`<span class="text-xs font-bold text-slate-500 uppercase tracking-wide"${_scopeId}>Cabang Outlet:</span><select class="h-9 px-3 border border-slate-200 dark:border-slate-700 rounded-lg bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 text-slate-900 dark:text-slate-100 cursor-pointer"${_scopeId}><!--[-->`);
						ssrRenderList(__props.outlets, (ot) => {
							_push(`<option${ssrRenderAttr("value", String(ot.id))}${ssrIncludeBooleanAttr(Array.isArray(selectedOutletId.value) ? ssrLooseContain(selectedOutletId.value, String(ot.id)) : ssrLooseEqual(selectedOutletId.value, String(ot.id))) ? " selected" : ""}${_scopeId}>${ssrInterpolate(ot.name)}</option>`);
						});
						_push(`<!--]--></select></div>`);
						if (__props.tables.length > 0) {
							_push(`<div class="flex items-center gap-4 pl-4 border-l border-slate-250 dark:border-slate-800"${_scopeId}><label class="flex items-center gap-2 text-xs font-semibold text-slate-700 dark:text-slate-300 cursor-pointer select-none"${_scopeId}><input type="checkbox"${ssrIncludeBooleanAttr(isAllSelected.value) ? " checked" : ""} class="h-4 w-4 rounded border-slate-300 text-[#8c5a3c] focus:ring-[#8c5a3c]"${_scopeId}><span${_scopeId}>Pilih Semua (${ssrInterpolate(selectedTableIds.value.length)}/${ssrInterpolate(__props.tables.length)})</span></label><button class="h-9 px-3 bg-[#8c5a3c]/10 hover:bg-[#8c5a3c]/20 text-[#8c5a3c] dark:text-[#a17150] text-xs font-bold rounded-lg transition-colors cursor-pointer flex items-center gap-1.5"${_scopeId}>`);
							_push(ssrRenderComponent(unref(QrCode), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
							_push(`<span${_scopeId}>Cetak QR Massal</span></button></div>`);
						} else _push(`<!---->`);
						_push(`</div><div class="flex items-center gap-4 text-xs font-semibold text-slate-500"${_scopeId}><span class="flex items-center gap-1.5"${_scopeId}><span class="h-2.5 w-2.5 rounded-full bg-emerald-500"${_scopeId}></span> Available: ${ssrInterpolate(__props.tables.filter((t) => t.status === "available").length)}</span><span class="flex items-center gap-1.5"${_scopeId}><span class="h-2.5 w-2.5 rounded-full bg-amber-500"${_scopeId}></span> Occupied: ${ssrInterpolate(__props.tables.filter((t) => t.status === "occupied").length)}</span><span class="flex items-center gap-1.5"${_scopeId}><span class="h-2.5 w-2.5 rounded-full bg-indigo-500"${_scopeId}></span> Reserved: ${ssrInterpolate(__props.tables.filter((t) => t.status === "reserved").length)}</span></div></div>`);
						if (__props.tables.length > 0) {
							_push(`<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-4 gap-6"${_scopeId}><!--[-->`);
							ssrRenderList(__props.tables, (table) => {
								_push(`<div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl p-4 shadow-sm hover:shadow-md transition-shadow relative flex flex-col justify-between"${_scopeId}><div class="absolute top-3.5 left-3.5 z-10"${_scopeId}><input type="checkbox"${ssrIncludeBooleanAttr(selectedTableIds.value.includes(table.id)) ? " checked" : ""} class="h-4 w-4 rounded border-slate-300 text-[#8c5a3c] focus:ring-[#8c5a3c] cursor-pointer"${_scopeId}></div><div class="${ssrRenderClass([[
									table.status === "available" ? "bg-emerald-500" : "",
									table.status === "occupied" ? "bg-amber-500" : "",
									table.status === "reserved" ? "bg-indigo-500" : ""
								], "absolute inset-x-0 top-0 h-1.5 rounded-t-2xl"])}"${_scopeId}></div><div class="space-y-3 pt-2"${_scopeId}><div class="flex items-start justify-between"${_scopeId}><span class="text-base font-extrabold text-slate-900 dark:text-slate-50 pl-6"${_scopeId}>${ssrInterpolate(table.number)}</span><span class="${ssrRenderClass(["px-2 py-0.5 border rounded-full text-[9px] font-extrabold uppercase tracking-wider", getStatusBadgeClass(table.status)])}"${_scopeId}>${ssrInterpolate(table.status)}</span></div><div class="text-[11px] text-slate-400"${_scopeId}> Kapasitas: <span class="font-bold text-slate-700 dark:text-slate-300"${_scopeId}>${ssrInterpolate(table.capacity)} kursi</span></div>`);
								if (table.merged_to_id) {
									_push(`<div class="flex items-center gap-1 px-2 py-1 rounded bg-amber-500/10 text-[9px] font-bold text-amber-700 dark:text-amber-400"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Link$1), { class: "h-3 w-3" }, null, _parent, _scopeId));
									_push(`<span${_scopeId}>Merged to ${ssrInterpolate(__props.tables.find((t) => t.id === table.merged_to_id)?.number)}</span></div>`);
								} else _push(`<!---->`);
								_push(`</div><div class="flex items-center justify-end gap-1.5 mt-4 pt-3 border-t border-slate-100 dark:border-slate-800"${_scopeId}>`);
								if (!table.merged_to_id && table.status === "available") {
									_push(`<button title="Gabung Meja" class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 rounded-lg transition-colors cursor-pointer"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Link$1), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
									_push(`</button>`);
								} else _push(`<!---->`);
								if (table.merged_to_id) {
									_push(`<button title="Pisah Meja" class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-500 hover:text-rose-600 rounded-lg transition-colors cursor-pointer"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Unlink), { class: "h-3.5 w-3.5 text-rose-500" }, null, _parent, _scopeId));
									_push(`</button>`);
								} else _push(`<!---->`);
								_push(`<button title="Tampilkan QR Code" class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-[#8c5a3c] hover:text-[#734a31] rounded-lg transition-colors cursor-pointer"${_scopeId}>`);
								_push(ssrRenderComponent(unref(QrCode), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
								_push(`</button><button title="Edit" class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 rounded-lg transition-colors cursor-pointer"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Edit2), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
								_push(`</button><button title="Hapus" class="p-1.5 hover:bg-slate-105 dark:hover:bg-slate-800 text-slate-550 hover:text-rose-600 rounded-lg transition-colors cursor-pointer"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Trash2), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
								_push(`</button></div></div>`);
							});
							_push(`<!--]--></div>`);
						} else {
							_push(`<div class="text-center py-16 bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-sm"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Grid), { class: "h-10 w-10 text-slate-350 dark:text-slate-600 mx-auto mb-3" }, null, _parent, _scopeId));
							_push(`<h3 class="text-sm font-bold text-slate-800 dark:text-slate-200"${_scopeId}>Belum ada meja</h3><p class="text-xs text-slate-400 mt-1"${_scopeId}>Silakan tambahkan meja pertama Anda di outlet ini.</p></div>`);
						}
						if (isFormModalOpen.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/60 backdrop-blur-sm"${_scopeId}><div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-md overflow-hidden transform transition-all"${_scopeId}><div class="px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between"${_scopeId}><h3 class="text-sm font-extrabold text-slate-900 dark:text-slate-100"${_scopeId}>${ssrInterpolate(editingTable.value ? "Edit Detail Meja" : "Tambah Meja Baru")}</h3><button class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"${_scopeId}>`);
							_push(ssrRenderComponent(unref(X), { class: "h-4 w-4" }, null, _parent, _scopeId));
							_push(`</button></div><form class="p-6 space-y-4"${_scopeId}><div${_scopeId}><label class="block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5"${_scopeId}>Nomor / Kode Meja</label><input type="text"${ssrRenderAttr("value", unref(form).number)} required placeholder="Contoh: Meja 12, VIP-1" class="w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 focus:border-[#8c5a3c]"${_scopeId}></div><div${_scopeId}><label class="block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5"${_scopeId}>Kapasitas (Kursi)</label><input type="number"${ssrRenderAttr("value", unref(form).capacity)} required min="1" class="w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 focus:border-[#8c5a3c]"${_scopeId}></div><div${_scopeId}><label class="block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5"${_scopeId}>Status</label><select required class="w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 focus:border-[#8c5a3c] cursor-pointer"${_scopeId}><option value="available"${ssrIncludeBooleanAttr(Array.isArray(unref(form).status) ? ssrLooseContain(unref(form).status, "available") : ssrLooseEqual(unref(form).status, "available")) ? " selected" : ""}${_scopeId}>Available (Kosong)</option><option value="occupied"${ssrIncludeBooleanAttr(Array.isArray(unref(form).status) ? ssrLooseContain(unref(form).status, "occupied") : ssrLooseEqual(unref(form).status, "occupied")) ? " selected" : ""}${_scopeId}>Occupied (Terisi)</option><option value="reserved"${ssrIncludeBooleanAttr(Array.isArray(unref(form).status) ? ssrLooseContain(unref(form).status, "reserved") : ssrLooseEqual(unref(form).status, "reserved")) ? " selected" : ""}${_scopeId}>Reserved (Dipesan)</option></select></div><div class="flex items-center justify-end gap-3 pt-4 border-t border-slate-100 dark:border-slate-800"${_scopeId}><button type="button" class="px-4 py-2 border border-slate-200 dark:border-slate-800 text-slate-700 dark:text-slate-350 text-xs font-bold rounded-xl hover:bg-slate-50 dark:hover:bg-slate-800 cursor-pointer"${_scopeId}> Batal </button><button type="submit"${ssrIncludeBooleanAttr(unref(form).processing) ? " disabled" : ""} class="px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-xs font-bold rounded-xl cursor-pointer disabled:opacity-50"${_scopeId}>${ssrInterpolate(unref(form).processing ? "Menyimpan..." : "Simpan")}</button></div></form></div></div>`);
						} else _push(`<!---->`);
						if (isMergeModalOpen.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/60 backdrop-blur-sm"${_scopeId}><div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-md overflow-hidden transform transition-all"${_scopeId}><div class="px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between"${_scopeId}><h3 class="text-sm font-extrabold text-slate-900 dark:text-slate-100 flex items-center gap-2"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Link$1), { class: "h-4 w-4 text-[#8c5a3c]" }, null, _parent, _scopeId));
							_push(`<span${_scopeId}>Gabungkan Meja</span></h3><button class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"${_scopeId}>`);
							_push(ssrRenderComponent(unref(X), { class: "h-4 w-4" }, null, _parent, _scopeId));
							_push(`</button></div><form class="p-6 space-y-4"${_scopeId}><div class="bg-slate-50 dark:bg-slate-800/40 p-4 rounded-xl text-xs space-y-1"${_scopeId}><p class="font-bold text-slate-700 dark:text-slate-300"${_scopeId}>Bagaimana cara kerjanya?</p><p class="text-slate-500"${_scopeId}>Meja asal (source) akan diarahkan/digabungkan ke meja tujuan (target). Meja asal akan berubah status menjadioccupied.</p></div><div${_scopeId}><label class="block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5"${_scopeId}>Meja Asal</label><input type="text"${ssrRenderAttr("value", __props.tables.find((t) => String(t.id) === unref(mergeForm).source_table_id)?.number)} readonly class="w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-100 dark:bg-slate-800 text-xs font-semibold focus:outline-none"${_scopeId}></div><div${_scopeId}><label class="block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5"${_scopeId}>Gabungkan ke Meja (Target)</label><select required class="w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 focus:border-[#8c5a3c] cursor-pointer"${_scopeId}><option value=""${ssrIncludeBooleanAttr(Array.isArray(unref(mergeForm).target_table_id) ? ssrLooseContain(unref(mergeForm).target_table_id, "") : ssrLooseEqual(unref(mergeForm).target_table_id, "")) ? " selected" : ""}${_scopeId}>Pilih meja tujuan...</option><!--[-->`);
							ssrRenderList(mergeableTargets.value, (t) => {
								_push(`<option${ssrRenderAttr("value", String(t.id))}${ssrIncludeBooleanAttr(Array.isArray(unref(mergeForm).target_table_id) ? ssrLooseContain(unref(mergeForm).target_table_id, String(t.id)) : ssrLooseEqual(unref(mergeForm).target_table_id, String(t.id))) ? " selected" : ""}${_scopeId}>${ssrInterpolate(t.number)} (Kapasitas: ${ssrInterpolate(t.capacity)} kursi)</option>`);
							});
							_push(`<!--]--></select></div><div class="flex items-center justify-end gap-3 pt-4 border-t border-slate-100 dark:border-slate-800"${_scopeId}><button type="button" class="px-4 py-2 border border-slate-200 dark:border-slate-800 text-slate-700 dark:text-slate-350 text-xs font-bold rounded-xl hover:bg-slate-50 dark:hover:bg-slate-800 cursor-pointer"${_scopeId}> Batal </button><button type="submit"${ssrIncludeBooleanAttr(unref(mergeForm).processing || !unref(mergeForm).target_table_id) ? " disabled" : ""} class="px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-xs font-bold rounded-xl cursor-pointer disabled:opacity-50"${_scopeId}>${ssrInterpolate(unref(mergeForm).processing ? "Menggabungkan Meja..." : "Gabungkan Meja")}</button></div></form></div></div>`);
						} else _push(`<!---->`);
						if (isQrModalOpen.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/60 backdrop-blur-sm animate-fade-in"${_scopeId}><div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-sm overflow-hidden p-6 text-center space-y-4 animate-in zoom-in-95 duration-200"${_scopeId}><div class="flex items-center justify-between border-b border-slate-100 dark:border-slate-800 pb-3"${_scopeId}><h3 class="text-sm font-extrabold text-slate-900 dark:text-slate-100"${_scopeId}> Self-Order QR Code </h3><button class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"${_scopeId}>`);
							_push(ssrRenderComponent(unref(X), { class: "h-4 w-4" }, null, _parent, _scopeId));
							_push(`</button></div><div class="space-y-1"${_scopeId}><h4 class="text-lg font-black text-[#8c5a3c]"${_scopeId}>Meja ${ssrInterpolate(activeQrTable.value?.number)}</h4><p class="text-xs text-slate-400"${_scopeId}>Scan QR Code untuk memesan menu secara mandiri.</p></div><div class="flex justify-center p-4 bg-slate-50 dark:bg-slate-950 rounded-2xl border border-slate-100 dark:border-slate-900"${_scopeId}>`);
							if (activeQrTable.value) _push(`<img${ssrRenderAttr("src", getQrCodeUrl(activeQrTable.value))} alt="Table QR Code" class="h-56 w-56 object-contain"${_scopeId}>`);
							else _push(`<!---->`);
							_push(`</div><div class="flex gap-3"${_scopeId}>`);
							if (activeQrTable.value) _push(`<a${ssrRenderAttr("href", getQrCodeUrl(activeQrTable.value))} target="_blank" class="flex-1 py-2 px-4 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-xs font-bold rounded-xl cursor-pointer shadow-md text-center block"${_scopeId}> Unduh Gambar </a>`);
							else _push(`<!---->`);
							_push(`<button class="flex-1 py-2 px-4 border border-slate-200 dark:border-slate-800 text-slate-500 rounded-xl text-xs font-bold hover:bg-slate-50 dark:hover:bg-slate-800 cursor-pointer"${_scopeId}> Tutup </button></div></div></div>`);
						} else _push(`<!---->`);
						_push(`</div>`);
						if (isBulkQrModalOpen.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/65 backdrop-blur-sm animate-fade-in"${_scopeId}><div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-4xl overflow-hidden flex flex-col transform transition-all font-sans max-h-[90vh]"${_scopeId}><div class="px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between"${_scopeId}><h3 class="text-sm font-extrabold text-slate-900 dark:text-slate-100 flex items-center gap-2"${_scopeId}>`);
							_push(ssrRenderComponent(unref(QrCode), { class: "h-4 w-4 text-[#8c5a3c]" }, null, _parent, _scopeId));
							_push(`<span${_scopeId}>Bulk Print QR Code Meja</span></h3><button class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"${_scopeId}>`);
							_push(ssrRenderComponent(unref(X), { class: "h-4 w-4" }, null, _parent, _scopeId));
							_push(`</button></div><div class="p-6 flex flex-col md:flex-row gap-6 overflow-hidden flex-1"${_scopeId}><div class="w-full md:w-80 space-y-5 flex-shrink-0"${_scopeId}><div class="space-y-2"${_scopeId}><label class="block text-xs font-bold text-slate-500 uppercase tracking-wider"${_scopeId}>Cakupan Cetak Meja</label><div class="grid grid-cols-2 gap-2"${_scopeId}><button type="button"${ssrIncludeBooleanAttr(selectedTableIds.value.length === 0) ? " disabled" : ""} class="${ssrRenderClass(["py-2 px-3 text-xs border rounded-xl font-bold cursor-pointer transition-all disabled:opacity-50 disabled:cursor-not-allowed", printScope.value === "selected" ? "bg-[#8c5a3c]/10 border-[#8c5a3c] text-[#8c5a3c]" : "border-slate-200 dark:border-slate-800 text-slate-600 dark:text-slate-400 hover:bg-slate-50 dark:hover:bg-slate-800/30"])}"${_scopeId}> Pilihan (${ssrInterpolate(selectedTableIds.value.length)}) </button><button type="button" class="${ssrRenderClass(["py-2 px-3 text-xs border rounded-xl font-bold cursor-pointer transition-all", printScope.value === "all" ? "bg-[#8c5a3c]/10 border-[#8c5a3c] text-[#8c5a3c]" : "border-slate-200 dark:border-slate-800 text-slate-600 dark:text-slate-400 hover:bg-slate-50 dark:hover:bg-slate-800/30"])}"${_scopeId}> Semua Meja (${ssrInterpolate(__props.tables.length)}) </button></div></div><div class="space-y-2"${_scopeId}><label class="block text-xs font-bold text-slate-500 uppercase tracking-wider"${_scopeId}>Template &amp; Kertas</label><div class="flex flex-col gap-2"${_scopeId}><label class="flex items-center gap-2.5 p-3 rounded-xl border border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900/30 text-xs font-bold text-slate-700 dark:text-slate-300 cursor-pointer select-none"${_scopeId}><input type="radio"${ssrIncludeBooleanAttr(ssrLooseEqual(printTemplate.value, "a4-3")) ? " checked" : ""} value="a4-3" class="text-[#8c5a3c] focus:ring-[#8c5a3c]"${_scopeId}><div class="flex flex-col"${_scopeId}><span${_scopeId}>Kertas A4 - 3 Kolom</span><span class="text-[10px] text-slate-400 leading-normal"${_scopeId}>Kecil, hemat kertas (3 QR per baris)</span></div></label><label class="flex items-center gap-2.5 p-3 rounded-xl border border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900/30 text-xs font-bold text-slate-700 dark:text-slate-300 cursor-pointer select-none"${_scopeId}><input type="radio"${ssrIncludeBooleanAttr(ssrLooseEqual(printTemplate.value, "a4-2")) ? " checked" : ""} value="a4-2" class="text-[#8c5a3c] focus:ring-[#8c5a3c]"${_scopeId}><div class="flex flex-col"${_scopeId}><span${_scopeId}>Kertas A4 - 2 Kolom</span><span class="text-[10px] text-slate-400 leading-normal"${_scopeId}>Ukuran sedang, mudah di-scan (2 QR per baris)</span></div></label><label class="flex items-center gap-2.5 p-3 rounded-xl border border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900/30 text-xs font-bold text-slate-700 dark:text-slate-300 cursor-pointer select-none"${_scopeId}><input type="radio"${ssrIncludeBooleanAttr(ssrLooseEqual(printTemplate.value, "thermal")) ? " checked" : ""} value="thermal" class="text-[#8c5a3c] focus:ring-[#8c5a3c]"${_scopeId}><div class="flex flex-col"${_scopeId}><span${_scopeId}>Thermal 80mm</span><span class="text-[10px] text-slate-400 leading-normal"${_scopeId}>Cetak satu per satu di printer kasir</span></div></label></div></div><div class="p-4 bg-slate-50 dark:bg-slate-900/40 rounded-xl border border-slate-200 dark:border-slate-800 text-[11px] leading-relaxed text-slate-500 space-y-1.5"${_scopeId}><div class="flex items-center gap-1 font-bold text-slate-700 dark:text-slate-300 text-xs mb-1"${_scopeId}>`);
							_push(ssrRenderComponent(_component_Info, { class: "h-4 w-4 text-[#8c5a3c]" }, null, _parent, _scopeId));
							_push(`<span${_scopeId}>Petunjuk Potong</span></div><p${_scopeId}>Lembar cetakan dilengkapi garis putus-putus untuk membantu pemotongan agar rapi.</p><p${_scopeId}>Tempelkan QR Code pada meja makan untuk memudahkan pelanggan memesan via smartphone.</p></div></div><div class="flex-1 flex flex-col border border-slate-200 dark:border-slate-800 rounded-2xl overflow-hidden bg-slate-100 dark:bg-slate-950 p-4"${_scopeId}><div class="flex items-center justify-between mb-3"${_scopeId}><span class="text-[11px] font-bold uppercase tracking-wider text-slate-400"${_scopeId}>Live Print Preview</span><span class="text-xs text-slate-500 font-bold"${_scopeId}>${ssrInterpolate(tablesToPrint.value.length)} Meja Terbuka</span></div><div class="flex-1 overflow-y-auto max-h-[50vh] p-6 bg-white dark:bg-slate-900 border border-slate-250 dark:border-slate-800 rounded-xl shadow-inner relative"${_scopeId}>`);
							if (tablesToPrint.value.length === 0) {
								_push(`<div class="absolute inset-0 flex flex-col items-center justify-center p-4 text-center"${_scopeId}>`);
								_push(ssrRenderComponent(unref(QrCode), { class: "h-8 w-8 text-slate-300 mb-2" }, null, _parent, _scopeId));
								_push(`<span class="text-xs font-bold text-slate-400"${_scopeId}>Silakan pilih meja terlebih dahulu.</span></div>`);
							} else {
								_push(`<div class="${ssrRenderClass([
									"gap-6",
									printTemplate.value === "a4-3" ? "grid grid-cols-3" : "",
									printTemplate.value === "a4-2" ? "grid grid-cols-2" : "",
									printTemplate.value === "thermal" ? "flex flex-col items-center max-w-[280px] mx-auto" : ""
								])}"${_scopeId}><!--[-->`);
								ssrRenderList(tablesToPrint.value, (t) => {
									_push(`<div class="border border-dashed border-slate-300 dark:border-slate-800 p-4 rounded-xl text-center space-y-3 bg-white dark:bg-slate-900/50 qr-print-card"${_scopeId}><div class="space-y-0.5 leading-none"${_scopeId}><span class="text-[9px] font-extrabold uppercase tracking-widest text-[#8c5a3c] block"${_scopeId}>${ssrInterpolate(t.outlet?.name || "CafePOS")}</span><span class="text-xs font-black text-slate-800 dark:text-slate-100"${_scopeId}> Meja ${ssrInterpolate(t.number)}</span></div><div class="flex justify-center p-2 bg-slate-50 dark:bg-slate-950 rounded-lg"${_scopeId}><img${ssrRenderAttr("src", getQrCodeUrl(t))} alt="QR Code" class="h-28 w-28 object-contain"${_scopeId}></div><span class="text-[8px] font-bold text-slate-400 block leading-tight"${_scopeId}> SCAN TO ORDER </span></div>`);
								});
								_push(`<!--]--></div>`);
							}
							_push(`</div></div></div><div class="px-6 py-4 border-t border-slate-200 dark:border-slate-800 bg-slate-50 dark:bg-slate-900/30 flex items-center justify-end gap-3"${_scopeId}><button type="button" class="px-4 py-2 border border-slate-200 dark:border-slate-800 text-slate-700 dark:text-slate-350 text-xs font-bold rounded-xl hover:bg-slate-50 dark:hover:bg-slate-800 cursor-pointer"${_scopeId}> Batal </button><button type="button"${ssrIncludeBooleanAttr(tablesToPrint.value.length === 0) ? " disabled" : ""} class="px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] disabled:opacity-50 text-white text-xs font-bold rounded-xl shadow-md cursor-pointer transition-all flex items-center gap-1.5"${_scopeId}><span${_scopeId}>Cetak Sekarang</span></button></div></div></div>`);
						} else _push(`<!---->`);
					} else return [createVNode("div", { class: "space-y-6" }, [
						createVNode("div", { class: "flex flex-col sm:flex-row sm:items-center justify-between gap-4" }, [createVNode("div", null, [createVNode("h1", { class: "text-2xl font-extrabold text-slate-900 dark:text-slate-50 tracking-tight" }, " Table Management "), createVNode("p", { class: "text-sm text-slate-500 dark:text-slate-400 mt-1" }, " Kelola kapasitas, merge, status, dan okupansi meja restoran. ")]), createVNode("button", {
							onClick: openCreateModal,
							class: "flex items-center justify-center gap-2 px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-sm font-bold rounded-xl transition-all cursor-pointer shadow-lg shadow-[#8c5a3c]/10"
						}, [createVNode(unref(Plus), { class: "h-4 w-4" }), createTextVNode(" Tambah Meja ")])]),
						createVNode("div", { class: "flex flex-wrap items-center justify-between gap-4 bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl px-5 py-4 shadow-sm" }, [createVNode("div", { class: "flex flex-wrap items-center gap-5" }, [createVNode("div", { class: "flex items-center gap-3" }, [
							createVNode(unref(Store), { class: "h-5 w-5 text-slate-400" }),
							createVNode("span", { class: "text-xs font-bold text-slate-500 uppercase tracking-wide" }, "Cabang Outlet:"),
							withDirectives(createVNode("select", {
								"onUpdate:modelValue": ($event) => selectedOutletId.value = $event,
								class: "h-9 px-3 border border-slate-200 dark:border-slate-700 rounded-lg bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 text-slate-900 dark:text-slate-100 cursor-pointer"
							}, [(openBlock(true), createBlock(Fragment, null, renderList(__props.outlets, (ot) => {
								return openBlock(), createBlock("option", {
									key: ot.id,
									value: String(ot.id)
								}, toDisplayString(ot.name), 9, ["value"]);
							}), 128))], 8, ["onUpdate:modelValue"]), [[vModelSelect, selectedOutletId.value]])
						]), __props.tables.length > 0 ? (openBlock(), createBlock("div", {
							key: 0,
							class: "flex items-center gap-4 pl-4 border-l border-slate-250 dark:border-slate-800"
						}, [createVNode("label", { class: "flex items-center gap-2 text-xs font-semibold text-slate-700 dark:text-slate-300 cursor-pointer select-none" }, [createVNode("input", {
							type: "checkbox",
							checked: isAllSelected.value,
							onChange: toggleSelectAll,
							class: "h-4 w-4 rounded border-slate-300 text-[#8c5a3c] focus:ring-[#8c5a3c]"
						}, null, 40, ["checked"]), createVNode("span", null, "Pilih Semua (" + toDisplayString(selectedTableIds.value.length) + "/" + toDisplayString(__props.tables.length) + ")", 1)]), createVNode("button", {
							onClick: openBulkQrModal,
							class: "h-9 px-3 bg-[#8c5a3c]/10 hover:bg-[#8c5a3c]/20 text-[#8c5a3c] dark:text-[#a17150] text-xs font-bold rounded-lg transition-colors cursor-pointer flex items-center gap-1.5"
						}, [createVNode(unref(QrCode), { class: "h-3.5 w-3.5" }), createVNode("span", null, "Cetak QR Massal")])])) : createCommentVNode("", true)]), createVNode("div", { class: "flex items-center gap-4 text-xs font-semibold text-slate-500" }, [
							createVNode("span", { class: "flex items-center gap-1.5" }, [createVNode("span", { class: "h-2.5 w-2.5 rounded-full bg-emerald-500" }), createTextVNode(" Available: " + toDisplayString(__props.tables.filter((t) => t.status === "available").length), 1)]),
							createVNode("span", { class: "flex items-center gap-1.5" }, [createVNode("span", { class: "h-2.5 w-2.5 rounded-full bg-amber-500" }), createTextVNode(" Occupied: " + toDisplayString(__props.tables.filter((t) => t.status === "occupied").length), 1)]),
							createVNode("span", { class: "flex items-center gap-1.5" }, [createVNode("span", { class: "h-2.5 w-2.5 rounded-full bg-indigo-500" }), createTextVNode(" Reserved: " + toDisplayString(__props.tables.filter((t) => t.status === "reserved").length), 1)])
						])]),
						__props.tables.length > 0 ? (openBlock(), createBlock("div", {
							key: 0,
							class: "grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-4 gap-6"
						}, [(openBlock(true), createBlock(Fragment, null, renderList(__props.tables, (table) => {
							return openBlock(), createBlock("div", {
								key: table.id,
								class: "bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl p-4 shadow-sm hover:shadow-md transition-shadow relative flex flex-col justify-between"
							}, [
								createVNode("div", { class: "absolute top-3.5 left-3.5 z-10" }, [createVNode("input", {
									type: "checkbox",
									checked: selectedTableIds.value.includes(table.id),
									onChange: ($event) => toggleSelectTable(table.id),
									class: "h-4 w-4 rounded border-slate-300 text-[#8c5a3c] focus:ring-[#8c5a3c] cursor-pointer"
								}, null, 40, ["checked", "onChange"])]),
								createVNode("div", { class: ["absolute inset-x-0 top-0 h-1.5 rounded-t-2xl", [
									table.status === "available" ? "bg-emerald-500" : "",
									table.status === "occupied" ? "bg-amber-500" : "",
									table.status === "reserved" ? "bg-indigo-500" : ""
								]] }, null, 2),
								createVNode("div", { class: "space-y-3 pt-2" }, [
									createVNode("div", { class: "flex items-start justify-between" }, [createVNode("span", { class: "text-base font-extrabold text-slate-900 dark:text-slate-50 pl-6" }, toDisplayString(table.number), 1), createVNode("span", { class: ["px-2 py-0.5 border rounded-full text-[9px] font-extrabold uppercase tracking-wider", getStatusBadgeClass(table.status)] }, toDisplayString(table.status), 3)]),
									createVNode("div", { class: "text-[11px] text-slate-400" }, [createTextVNode(" Kapasitas: "), createVNode("span", { class: "font-bold text-slate-700 dark:text-slate-300" }, toDisplayString(table.capacity) + " kursi", 1)]),
									table.merged_to_id ? (openBlock(), createBlock("div", {
										key: 0,
										class: "flex items-center gap-1 px-2 py-1 rounded bg-amber-500/10 text-[9px] font-bold text-amber-700 dark:text-amber-400"
									}, [createVNode(unref(Link$1), { class: "h-3 w-3" }), createVNode("span", null, "Merged to " + toDisplayString(__props.tables.find((t) => t.id === table.merged_to_id)?.number), 1)])) : createCommentVNode("", true)
								]),
								createVNode("div", { class: "flex items-center justify-end gap-1.5 mt-4 pt-3 border-t border-slate-100 dark:border-slate-800" }, [
									!table.merged_to_id && table.status === "available" ? (openBlock(), createBlock("button", {
										key: 0,
										onClick: ($event) => openMergeModal(table),
										title: "Gabung Meja",
										class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 rounded-lg transition-colors cursor-pointer"
									}, [createVNode(unref(Link$1), { class: "h-3.5 w-3.5" })], 8, ["onClick"])) : createCommentVNode("", true),
									table.merged_to_id ? (openBlock(), createBlock("button", {
										key: 1,
										onClick: ($event) => splitTable(table),
										title: "Pisah Meja",
										class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-500 hover:text-rose-600 rounded-lg transition-colors cursor-pointer"
									}, [createVNode(unref(Unlink), { class: "h-3.5 w-3.5 text-rose-500" })], 8, ["onClick"])) : createCommentVNode("", true),
									createVNode("button", {
										onClick: ($event) => openQrModal(table),
										title: "Tampilkan QR Code",
										class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-[#8c5a3c] hover:text-[#734a31] rounded-lg transition-colors cursor-pointer"
									}, [createVNode(unref(QrCode), { class: "h-3.5 w-3.5" })], 8, ["onClick"]),
									createVNode("button", {
										onClick: ($event) => openEditModal(table),
										title: "Edit",
										class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 rounded-lg transition-colors cursor-pointer"
									}, [createVNode(unref(Edit2), { class: "h-3.5 w-3.5" })], 8, ["onClick"]),
									createVNode("button", {
										onClick: ($event) => deleteTable(table),
										title: "Hapus",
										class: "p-1.5 hover:bg-slate-105 dark:hover:bg-slate-800 text-slate-550 hover:text-rose-600 rounded-lg transition-colors cursor-pointer"
									}, [createVNode(unref(Trash2), { class: "h-3.5 w-3.5" })], 8, ["onClick"])
								])
							]);
						}), 128))])) : (openBlock(), createBlock("div", {
							key: 1,
							class: "text-center py-16 bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-sm"
						}, [
							createVNode(unref(Grid), { class: "h-10 w-10 text-slate-350 dark:text-slate-600 mx-auto mb-3" }),
							createVNode("h3", { class: "text-sm font-bold text-slate-800 dark:text-slate-200" }, "Belum ada meja"),
							createVNode("p", { class: "text-xs text-slate-400 mt-1" }, "Silakan tambahkan meja pertama Anda di outlet ini.")
						])),
						isFormModalOpen.value ? (openBlock(), createBlock("div", {
							key: 2,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/60 backdrop-blur-sm"
						}, [createVNode("div", { class: "bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-md overflow-hidden transform transition-all" }, [createVNode("div", { class: "px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between" }, [createVNode("h3", { class: "text-sm font-extrabold text-slate-900 dark:text-slate-100" }, toDisplayString(editingTable.value ? "Edit Detail Meja" : "Tambah Meja Baru"), 1), createVNode("button", {
							onClick: ($event) => isFormModalOpen.value = false,
							class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"
						}, [createVNode(unref(X), { class: "h-4 w-4" })], 8, ["onClick"])]), createVNode("form", {
							onSubmit: withModifiers(submitForm, ["prevent"]),
							class: "p-6 space-y-4"
						}, [
							createVNode("div", null, [createVNode("label", { class: "block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5" }, "Nomor / Kode Meja"), withDirectives(createVNode("input", {
								type: "text",
								"onUpdate:modelValue": ($event) => unref(form).number = $event,
								required: "",
								placeholder: "Contoh: Meja 12, VIP-1",
								class: "w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 focus:border-[#8c5a3c]"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(form).number]])]),
							createVNode("div", null, [createVNode("label", { class: "block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5" }, "Kapasitas (Kursi)"), withDirectives(createVNode("input", {
								type: "number",
								"onUpdate:modelValue": ($event) => unref(form).capacity = $event,
								required: "",
								min: "1",
								class: "w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 focus:border-[#8c5a3c]"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(form).capacity]])]),
							createVNode("div", null, [createVNode("label", { class: "block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5" }, "Status"), withDirectives(createVNode("select", {
								"onUpdate:modelValue": ($event) => unref(form).status = $event,
								required: "",
								class: "w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 focus:border-[#8c5a3c] cursor-pointer"
							}, [
								createVNode("option", { value: "available" }, "Available (Kosong)"),
								createVNode("option", { value: "occupied" }, "Occupied (Terisi)"),
								createVNode("option", { value: "reserved" }, "Reserved (Dipesan)")
							], 8, ["onUpdate:modelValue"]), [[vModelSelect, unref(form).status]])]),
							createVNode("div", { class: "flex items-center justify-end gap-3 pt-4 border-t border-slate-100 dark:border-slate-800" }, [createVNode("button", {
								type: "button",
								onClick: ($event) => isFormModalOpen.value = false,
								class: "px-4 py-2 border border-slate-200 dark:border-slate-800 text-slate-700 dark:text-slate-350 text-xs font-bold rounded-xl hover:bg-slate-50 dark:hover:bg-slate-800 cursor-pointer"
							}, " Batal ", 8, ["onClick"]), createVNode("button", {
								type: "submit",
								disabled: unref(form).processing,
								class: "px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-xs font-bold rounded-xl cursor-pointer disabled:opacity-50"
							}, toDisplayString(unref(form).processing ? "Menyimpan..." : "Simpan"), 9, ["disabled"])])
						], 32)])])) : createCommentVNode("", true),
						isMergeModalOpen.value ? (openBlock(), createBlock("div", {
							key: 3,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/60 backdrop-blur-sm"
						}, [createVNode("div", { class: "bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-md overflow-hidden transform transition-all" }, [createVNode("div", { class: "px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between" }, [createVNode("h3", { class: "text-sm font-extrabold text-slate-900 dark:text-slate-100 flex items-center gap-2" }, [createVNode(unref(Link$1), { class: "h-4 w-4 text-[#8c5a3c]" }), createVNode("span", null, "Gabungkan Meja")]), createVNode("button", {
							onClick: ($event) => isMergeModalOpen.value = false,
							class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"
						}, [createVNode(unref(X), { class: "h-4 w-4" })], 8, ["onClick"])]), createVNode("form", {
							onSubmit: withModifiers(submitMerge, ["prevent"]),
							class: "p-6 space-y-4"
						}, [
							createVNode("div", { class: "bg-slate-50 dark:bg-slate-800/40 p-4 rounded-xl text-xs space-y-1" }, [createVNode("p", { class: "font-bold text-slate-700 dark:text-slate-300" }, "Bagaimana cara kerjanya?"), createVNode("p", { class: "text-slate-500" }, "Meja asal (source) akan diarahkan/digabungkan ke meja tujuan (target). Meja asal akan berubah status menjadioccupied.")]),
							createVNode("div", null, [createVNode("label", { class: "block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5" }, "Meja Asal"), createVNode("input", {
								type: "text",
								value: __props.tables.find((t) => String(t.id) === unref(mergeForm).source_table_id)?.number,
								readonly: "",
								class: "w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-100 dark:bg-slate-800 text-xs font-semibold focus:outline-none"
							}, null, 8, ["value"])]),
							createVNode("div", null, [createVNode("label", { class: "block text-[11px] font-bold text-slate-450 dark:text-slate-500 uppercase tracking-wider mb-1.5" }, "Gabungkan ke Meja (Target)"), withDirectives(createVNode("select", {
								"onUpdate:modelValue": ($event) => unref(mergeForm).target_table_id = $event,
								required: "",
								class: "w-full h-10 px-3 border border-slate-200 dark:border-slate-700 rounded-xl bg-slate-50 dark:bg-slate-800 text-xs font-semibold focus:outline-none focus:ring-2 focus:ring-[#8c5a3c]/20 focus:border-[#8c5a3c] cursor-pointer"
							}, [createVNode("option", { value: "" }, "Pilih meja tujuan..."), (openBlock(true), createBlock(Fragment, null, renderList(mergeableTargets.value, (t) => {
								return openBlock(), createBlock("option", {
									key: t.id,
									value: String(t.id)
								}, toDisplayString(t.number) + " (Kapasitas: " + toDisplayString(t.capacity) + " kursi)", 9, ["value"]);
							}), 128))], 8, ["onUpdate:modelValue"]), [[vModelSelect, unref(mergeForm).target_table_id]])]),
							createVNode("div", { class: "flex items-center justify-end gap-3 pt-4 border-t border-slate-100 dark:border-slate-800" }, [createVNode("button", {
								type: "button",
								onClick: ($event) => isMergeModalOpen.value = false,
								class: "px-4 py-2 border border-slate-200 dark:border-slate-800 text-slate-700 dark:text-slate-350 text-xs font-bold rounded-xl hover:bg-slate-50 dark:hover:bg-slate-800 cursor-pointer"
							}, " Batal ", 8, ["onClick"]), createVNode("button", {
								type: "submit",
								disabled: unref(mergeForm).processing || !unref(mergeForm).target_table_id,
								class: "px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-xs font-bold rounded-xl cursor-pointer disabled:opacity-50"
							}, toDisplayString(unref(mergeForm).processing ? "Menggabungkan Meja..." : "Gabungkan Meja"), 9, ["disabled"])])
						], 32)])])) : createCommentVNode("", true),
						isQrModalOpen.value ? (openBlock(), createBlock("div", {
							key: 4,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/60 backdrop-blur-sm animate-fade-in"
						}, [createVNode("div", { class: "bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-sm overflow-hidden p-6 text-center space-y-4 animate-in zoom-in-95 duration-200" }, [
							createVNode("div", { class: "flex items-center justify-between border-b border-slate-100 dark:border-slate-800 pb-3" }, [createVNode("h3", { class: "text-sm font-extrabold text-slate-900 dark:text-slate-100" }, " Self-Order QR Code "), createVNode("button", {
								onClick: ($event) => isQrModalOpen.value = false,
								class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"
							}, [createVNode(unref(X), { class: "h-4 w-4" })], 8, ["onClick"])]),
							createVNode("div", { class: "space-y-1" }, [createVNode("h4", { class: "text-lg font-black text-[#8c5a3c]" }, "Meja " + toDisplayString(activeQrTable.value?.number), 1), createVNode("p", { class: "text-xs text-slate-400" }, "Scan QR Code untuk memesan menu secara mandiri.")]),
							createVNode("div", { class: "flex justify-center p-4 bg-slate-50 dark:bg-slate-950 rounded-2xl border border-slate-100 dark:border-slate-900" }, [activeQrTable.value ? (openBlock(), createBlock("img", {
								key: 0,
								src: getQrCodeUrl(activeQrTable.value),
								alt: "Table QR Code",
								class: "h-56 w-56 object-contain"
							}, null, 8, ["src"])) : createCommentVNode("", true)]),
							createVNode("div", { class: "flex gap-3" }, [activeQrTable.value ? (openBlock(), createBlock("a", {
								key: 0,
								href: getQrCodeUrl(activeQrTable.value),
								target: "_blank",
								class: "flex-1 py-2 px-4 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-xs font-bold rounded-xl cursor-pointer shadow-md text-center block"
							}, " Unduh Gambar ", 8, ["href"])) : createCommentVNode("", true), createVNode("button", {
								onClick: ($event) => isQrModalOpen.value = false,
								class: "flex-1 py-2 px-4 border border-slate-200 dark:border-slate-800 text-slate-500 rounded-xl text-xs font-bold hover:bg-slate-50 dark:hover:bg-slate-800 cursor-pointer"
							}, " Tutup ", 8, ["onClick"])])
						])])) : createCommentVNode("", true)
					]), isBulkQrModalOpen.value ? (openBlock(), createBlock("div", {
						key: 0,
						class: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/65 backdrop-blur-sm animate-fade-in"
					}, [createVNode("div", { class: "bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-4xl overflow-hidden flex flex-col transform transition-all font-sans max-h-[90vh]" }, [
						createVNode("div", { class: "px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between" }, [createVNode("h3", { class: "text-sm font-extrabold text-slate-900 dark:text-slate-100 flex items-center gap-2" }, [createVNode(unref(QrCode), { class: "h-4 w-4 text-[#8c5a3c]" }), createVNode("span", null, "Bulk Print QR Code Meja")]), createVNode("button", {
							onClick: ($event) => isBulkQrModalOpen.value = false,
							class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"
						}, [createVNode(unref(X), { class: "h-4 w-4" })], 8, ["onClick"])]),
						createVNode("div", { class: "p-6 flex flex-col md:flex-row gap-6 overflow-hidden flex-1" }, [createVNode("div", { class: "w-full md:w-80 space-y-5 flex-shrink-0" }, [
							createVNode("div", { class: "space-y-2" }, [createVNode("label", { class: "block text-xs font-bold text-slate-500 uppercase tracking-wider" }, "Cakupan Cetak Meja"), createVNode("div", { class: "grid grid-cols-2 gap-2" }, [createVNode("button", {
								type: "button",
								onClick: ($event) => printScope.value = "selected",
								disabled: selectedTableIds.value.length === 0,
								class: ["py-2 px-3 text-xs border rounded-xl font-bold cursor-pointer transition-all disabled:opacity-50 disabled:cursor-not-allowed", printScope.value === "selected" ? "bg-[#8c5a3c]/10 border-[#8c5a3c] text-[#8c5a3c]" : "border-slate-200 dark:border-slate-800 text-slate-600 dark:text-slate-400 hover:bg-slate-50 dark:hover:bg-slate-800/30"]
							}, " Pilihan (" + toDisplayString(selectedTableIds.value.length) + ") ", 11, ["onClick", "disabled"]), createVNode("button", {
								type: "button",
								onClick: ($event) => printScope.value = "all",
								class: ["py-2 px-3 text-xs border rounded-xl font-bold cursor-pointer transition-all", printScope.value === "all" ? "bg-[#8c5a3c]/10 border-[#8c5a3c] text-[#8c5a3c]" : "border-slate-200 dark:border-slate-800 text-slate-600 dark:text-slate-400 hover:bg-slate-50 dark:hover:bg-slate-800/30"]
							}, " Semua Meja (" + toDisplayString(__props.tables.length) + ") ", 11, ["onClick"])])]),
							createVNode("div", { class: "space-y-2" }, [createVNode("label", { class: "block text-xs font-bold text-slate-500 uppercase tracking-wider" }, "Template & Kertas"), createVNode("div", { class: "flex flex-col gap-2" }, [
								createVNode("label", { class: "flex items-center gap-2.5 p-3 rounded-xl border border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900/30 text-xs font-bold text-slate-700 dark:text-slate-300 cursor-pointer select-none" }, [withDirectives(createVNode("input", {
									type: "radio",
									"onUpdate:modelValue": ($event) => printTemplate.value = $event,
									value: "a4-3",
									class: "text-[#8c5a3c] focus:ring-[#8c5a3c]"
								}, null, 8, ["onUpdate:modelValue"]), [[vModelRadio, printTemplate.value]]), createVNode("div", { class: "flex flex-col" }, [createVNode("span", null, "Kertas A4 - 3 Kolom"), createVNode("span", { class: "text-[10px] text-slate-400 leading-normal" }, "Kecil, hemat kertas (3 QR per baris)")])]),
								createVNode("label", { class: "flex items-center gap-2.5 p-3 rounded-xl border border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900/30 text-xs font-bold text-slate-700 dark:text-slate-300 cursor-pointer select-none" }, [withDirectives(createVNode("input", {
									type: "radio",
									"onUpdate:modelValue": ($event) => printTemplate.value = $event,
									value: "a4-2",
									class: "text-[#8c5a3c] focus:ring-[#8c5a3c]"
								}, null, 8, ["onUpdate:modelValue"]), [[vModelRadio, printTemplate.value]]), createVNode("div", { class: "flex flex-col" }, [createVNode("span", null, "Kertas A4 - 2 Kolom"), createVNode("span", { class: "text-[10px] text-slate-400 leading-normal" }, "Ukuran sedang, mudah di-scan (2 QR per baris)")])]),
								createVNode("label", { class: "flex items-center gap-2.5 p-3 rounded-xl border border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900/30 text-xs font-bold text-slate-700 dark:text-slate-300 cursor-pointer select-none" }, [withDirectives(createVNode("input", {
									type: "radio",
									"onUpdate:modelValue": ($event) => printTemplate.value = $event,
									value: "thermal",
									class: "text-[#8c5a3c] focus:ring-[#8c5a3c]"
								}, null, 8, ["onUpdate:modelValue"]), [[vModelRadio, printTemplate.value]]), createVNode("div", { class: "flex flex-col" }, [createVNode("span", null, "Thermal 80mm"), createVNode("span", { class: "text-[10px] text-slate-400 leading-normal" }, "Cetak satu per satu di printer kasir")])])
							])]),
							createVNode("div", { class: "p-4 bg-slate-50 dark:bg-slate-900/40 rounded-xl border border-slate-200 dark:border-slate-800 text-[11px] leading-relaxed text-slate-500 space-y-1.5" }, [
								createVNode("div", { class: "flex items-center gap-1 font-bold text-slate-700 dark:text-slate-300 text-xs mb-1" }, [createVNode(_component_Info, { class: "h-4 w-4 text-[#8c5a3c]" }), createVNode("span", null, "Petunjuk Potong")]),
								createVNode("p", null, "Lembar cetakan dilengkapi garis putus-putus untuk membantu pemotongan agar rapi."),
								createVNode("p", null, "Tempelkan QR Code pada meja makan untuk memudahkan pelanggan memesan via smartphone.")
							])
						]), createVNode("div", { class: "flex-1 flex flex-col border border-slate-200 dark:border-slate-800 rounded-2xl overflow-hidden bg-slate-100 dark:bg-slate-950 p-4" }, [createVNode("div", { class: "flex items-center justify-between mb-3" }, [createVNode("span", { class: "text-[11px] font-bold uppercase tracking-wider text-slate-400" }, "Live Print Preview"), createVNode("span", { class: "text-xs text-slate-500 font-bold" }, toDisplayString(tablesToPrint.value.length) + " Meja Terbuka", 1)]), createVNode("div", { class: "flex-1 overflow-y-auto max-h-[50vh] p-6 bg-white dark:bg-slate-900 border border-slate-250 dark:border-slate-800 rounded-xl shadow-inner relative" }, [tablesToPrint.value.length === 0 ? (openBlock(), createBlock("div", {
							key: 0,
							class: "absolute inset-0 flex flex-col items-center justify-center p-4 text-center"
						}, [createVNode(unref(QrCode), { class: "h-8 w-8 text-slate-300 mb-2" }), createVNode("span", { class: "text-xs font-bold text-slate-400" }, "Silakan pilih meja terlebih dahulu.")])) : (openBlock(), createBlock("div", {
							key: 1,
							class: [
								"gap-6",
								printTemplate.value === "a4-3" ? "grid grid-cols-3" : "",
								printTemplate.value === "a4-2" ? "grid grid-cols-2" : "",
								printTemplate.value === "thermal" ? "flex flex-col items-center max-w-[280px] mx-auto" : ""
							]
						}, [(openBlock(true), createBlock(Fragment, null, renderList(tablesToPrint.value, (t) => {
							return openBlock(), createBlock("div", {
								key: t.id,
								class: "border border-dashed border-slate-300 dark:border-slate-800 p-4 rounded-xl text-center space-y-3 bg-white dark:bg-slate-900/50 qr-print-card"
							}, [
								createVNode("div", { class: "space-y-0.5 leading-none" }, [createVNode("span", { class: "text-[9px] font-extrabold uppercase tracking-widest text-[#8c5a3c] block" }, toDisplayString(t.outlet?.name || "CafePOS"), 1), createVNode("span", { class: "text-xs font-black text-slate-800 dark:text-slate-100" }, " Meja " + toDisplayString(t.number), 1)]),
								createVNode("div", { class: "flex justify-center p-2 bg-slate-50 dark:bg-slate-950 rounded-lg" }, [createVNode("img", {
									src: getQrCodeUrl(t),
									alt: "QR Code",
									class: "h-28 w-28 object-contain"
								}, null, 8, ["src"])]),
								createVNode("span", { class: "text-[8px] font-bold text-slate-400 block leading-tight" }, " SCAN TO ORDER ")
							]);
						}), 128))], 2))])])]),
						createVNode("div", { class: "px-6 py-4 border-t border-slate-200 dark:border-slate-800 bg-slate-50 dark:bg-slate-900/30 flex items-center justify-end gap-3" }, [createVNode("button", {
							type: "button",
							onClick: ($event) => isBulkQrModalOpen.value = false,
							class: "px-4 py-2 border border-slate-200 dark:border-slate-800 text-slate-700 dark:text-slate-350 text-xs font-bold rounded-xl hover:bg-slate-50 dark:hover:bg-slate-800 cursor-pointer"
						}, " Batal ", 8, ["onClick"]), createVNode("button", {
							type: "button",
							onClick: triggerPrint,
							disabled: tablesToPrint.value.length === 0,
							class: "px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] disabled:opacity-50 text-white text-xs font-bold rounded-xl shadow-md cursor-pointer transition-all flex items-center gap-1.5"
						}, [createVNode("span", null, "Cetak Sekarang")], 8, ["disabled"])])
					])])) : createCommentVNode("", true)];
				}),
				_: 1
			}, _parent));
			_push(`<div id="bulk-qr-print-area"><div class="${ssrRenderClass([
				"gap-8 p-6",
				printTemplate.value === "a4-3" ? "grid grid-cols-3" : "",
				printTemplate.value === "a4-2" ? "grid grid-cols-2" : "",
				printTemplate.value === "thermal" ? "flex flex-col items-center max-w-[72mm] mx-auto space-y-12" : ""
			])}"><!--[-->`);
			ssrRenderList(tablesToPrint.value, (t) => {
				_push(`<div class="border border-dashed border-slate-400 p-6 rounded-2xl text-center space-y-4 bg-white text-black qr-print-card shadow-none" style="${ssrRenderStyle(printTemplate.value === "thermal" ? "page-break-after: always; break-after: page; width: 68mm; margin-bottom: 20px;" : "")}"><div class="space-y-0.5 leading-none"><span class="text-[10px] font-black uppercase tracking-widest text-[#8c5a3c] block">${ssrInterpolate(t.outlet?.name || "CafePOS")}</span><span class="text-base font-black text-black"> MEJA ${ssrInterpolate(t.number)}</span></div><div class="flex justify-center p-3 bg-slate-50 border border-slate-200 rounded-xl"><img${ssrRenderAttr("src", getQrCodeUrl(t))} alt="QR Code" class="h-36 w-36 object-contain"></div><span class="text-[9px] font-extrabold text-slate-500 block leading-tight"> SCAN ME TO SELF-ORDER </span></div>`);
			});
			_push(`<!--]--></div></div><!--]-->`);
		};
	}
});
//#endregion
//#region resources/js/Pages/CafePOS/Tables/Index.vue
var _sfc_setup = Index_vue_vue_type_script_setup_true_lang_default.setup;
Index_vue_vue_type_script_setup_true_lang_default.setup = (props, ctx) => {
	const ssrContext = useSSRContext();
	(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("resources/js/Pages/CafePOS/Tables/Index.vue");
	return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
var Index_default = Index_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { Index_default as default };
