import { t as AdminLayout_default } from "./AdminLayout-CFTJa237.js";
import { Head, router, useForm } from "@inertiajs/vue3";
import { Fragment, computed, createBlock, createCommentVNode, createTextVNode, createVNode, defineComponent, openBlock, ref, renderList, toDisplayString, unref, useSSRContext, vModelSelect, vModelText, watch, withCtx, withDirectives, withModifiers } from "vue";
import { ssrIncludeBooleanAttr, ssrInterpolate, ssrLooseContain, ssrLooseEqual, ssrRenderAttr, ssrRenderClass, ssrRenderComponent, ssrRenderList } from "vue/server-renderer";
import { Edit2, Grid, Link as Link$1, Plus, 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 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 editingTable = ref(null);
		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) => {
			_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 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><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="${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"${_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="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(`<!---->`);
						_push(`</div>`);
					} 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 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]])
						]), 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 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" }, 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) => 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)
					])];
				}),
				_: 1
			}, _parent));
			_push(`<!--]-->`);
		};
	}
});
//#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 };
