[feat] authorisasi frontend
This commit is contained in:
Baghaztra
parent
4525444505
commit
e33805b18e
@ -1,12 +1,13 @@
|
||||
<template>
|
||||
<div class="flex justify-end mb-4">
|
||||
<input
|
||||
v-model="searchText"
|
||||
type="text"
|
||||
placeholder="Cari ..."
|
||||
class="border border-C bg-A rounded-md px-3 py-2 w-64 focus:outline-none focus:ring-2 focus:ring-blue-400"
|
||||
@input="$emit('update:search', searchText)"
|
||||
/>
|
||||
<div class="flex justify-end mb-3">
|
||||
<div class="border border-C bg-A rounded-md w-full sm:w-64 relative items-center">
|
||||
<input v-model="searchText" type="text" placeholder="Cari ..."
|
||||
class="focus:outline-none focus:ring-2 focus:ring-blue-400 rounded-md w-full px-3 py-2 "
|
||||
@input="$emit('update:search', searchText)" />
|
||||
<div class="absolute right-3 top-1/2 -translate-y-1/2 text-C">
|
||||
<i class="fas fa-search"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
||||
@ -6,13 +6,12 @@
|
||||
<BrankasList :search="searchQuery" />
|
||||
</div>
|
||||
</mainLayout>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import mainLayout from '../layouts/mainLayout.vue'
|
||||
import searchbar from '../components/searchbar.vue';
|
||||
import searchbar from '../components/Searchbar.vue';
|
||||
import BrankasList from '../components/BrankasList.vue';
|
||||
const searchQuery = ref("");
|
||||
</script>
|
||||
|
||||
@ -9,6 +9,7 @@
|
||||
<div class="flex justify-between items-center mb-6">
|
||||
|
||||
<button @click="tambahKategori"
|
||||
v-if="isAdmin"
|
||||
class="px-4 py-2 bg-C text-black rounded-md hover:bg-B transition duration-200 flex items-center gap-2">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
|
||||
@ -28,7 +29,7 @@
|
||||
<th class="px-6 py-4 text-center font-semibold border-r border-C">
|
||||
Nama Kategori
|
||||
</th>
|
||||
<th class="px-6 py-4 text-center font-semibold">
|
||||
<th v-if="isAdmin" class="px-6 py-4 text-center font-semibold">
|
||||
Aksi
|
||||
</th>
|
||||
</tr>
|
||||
@ -43,7 +44,7 @@
|
||||
<td class="px-6 py-4 border-r border-C text-center text-gray-800">
|
||||
{{ item.nama }}
|
||||
</td>
|
||||
<td class="px-6 py-4 text-center">
|
||||
<td class="px-6 py-4 text-center" v-if="isAdmin">
|
||||
<div class="flex justify-center gap-2">
|
||||
<button @click="ubahKategori(item)"
|
||||
class="px-3 py-1 bg-yellow-500 text-white text-sm rounded hover:bg-yellow-600 transition duration-200">
|
||||
@ -97,6 +98,8 @@ const detail = ref(null);
|
||||
const confirmDeleteOpen = ref(false);
|
||||
const kategoriToDelete = ref(null);
|
||||
|
||||
const isAdmin = localStorage.getItem("role") === "owner";
|
||||
|
||||
// Fetch data kategori dari API
|
||||
const fetchKategoris = async () => {
|
||||
loading.value = true;
|
||||
|
||||
@ -1,20 +1,11 @@
|
||||
<template>
|
||||
<mainLayout>
|
||||
<!-- Modal Buat Item -->
|
||||
<CreateItemModal
|
||||
:isOpen="creatingItem"
|
||||
:product="detail"
|
||||
@close="closeItemModal"
|
||||
/>
|
||||
<CreateItemModal :isOpen="creatingItem" :product="detail" @close="closeItemModal" />
|
||||
|
||||
<!-- Modal Konfirmasi Hapus Produk -->
|
||||
<ConfirmDeleteModal
|
||||
:isOpen="deleting"
|
||||
@cancel="deleting = false"
|
||||
@confirm="deleteProduk"
|
||||
title="Hapus Produk"
|
||||
message="Apakah Anda yakin ingin menghapus produk ini?"
|
||||
/>
|
||||
<ConfirmDeleteModal :isOpen="deleting" @cancel="deleting = false" @confirm="deleteProduk" title="Hapus Produk"
|
||||
message="Apakah Anda yakin ingin menghapus produk ini?" />
|
||||
|
||||
<div class="p-6 min-h-[75vh]">
|
||||
<!-- Judul -->
|
||||
@ -24,30 +15,13 @@
|
||||
<div class="mt-3">
|
||||
<!-- Mobile Layout -->
|
||||
<div class="flex flex-col gap-3 sm:hidden">
|
||||
<!-- Search -->
|
||||
<div class="w-full">
|
||||
<searchbar
|
||||
v-model:search="searchQuery"
|
||||
class="searchbar-mobile"
|
||||
/>
|
||||
<searchbar v-model:search="searchQuery" class="w-full" />
|
||||
<div class="flex flex-row justify-between items-center gap-3">
|
||||
<div class="shrink-0">
|
||||
<InputSelect v-model="selectedCategory" :options="kategori" />
|
||||
</div>
|
||||
|
||||
<!-- Filter + Tombol -->
|
||||
<div class="flex flex-row justify-between items-center">
|
||||
<!-- Filter Kategori -->
|
||||
<div class="w-40 shrink-0">
|
||||
<InputSelect
|
||||
v-model="selectedCategory"
|
||||
:options="kategori"
|
||||
class="w-full"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Tombol Tambah Produk -->
|
||||
<router-link
|
||||
to="/produk/baru"
|
||||
class="bg-C text-[#0a1a3c] px-4 py-2 rounded-md shadow hover:bg-C transition"
|
||||
>
|
||||
<router-link v-if="isAdmin" to="/produk/baru"
|
||||
class="bg-C text-D px-4 py-2 rounded-md shadow hover:bg-C transition">
|
||||
Tambah Produk
|
||||
</router-link>
|
||||
</div>
|
||||
@ -57,25 +31,15 @@
|
||||
<div class="hidden sm:flex flex-row gap-3 items-start">
|
||||
<!-- Filter -->
|
||||
<div class="w-40 sm:w-48 shrink-0">
|
||||
<InputSelect
|
||||
v-model="selectedCategory"
|
||||
:options="kategori"
|
||||
class="w-full"
|
||||
/>
|
||||
<InputSelect v-model="selectedCategory" :options="kategori" class="w-full" />
|
||||
</div>
|
||||
|
||||
<!-- Search -->
|
||||
<div class="flex-1 mt-[2px]">
|
||||
<div class="flex-1">
|
||||
<searchbar v-model:search="searchQuery" class="w-full" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tombol Tambah Produk (desktop) -->
|
||||
<div class="hidden sm:flex justify-end mt-3">
|
||||
<router-link
|
||||
to="/produk/baru"
|
||||
class="bg-C text-[#0a1a3c] px-4 py-2 rounded-md shadow hover:bg-C transition"
|
||||
>
|
||||
<router-link v-if="isAdmin" to="/produk/baru"
|
||||
class="bg-C text-D px-4 py-2 rounded-md shadow hover:bg-C transition">
|
||||
Tambah Produk
|
||||
</router-link>
|
||||
</div>
|
||||
@ -88,34 +52,14 @@
|
||||
</div>
|
||||
|
||||
<!-- 🔵 Grid Produk -->
|
||||
<div
|
||||
v-else
|
||||
class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-4 mt-4 relative z-0"
|
||||
>
|
||||
<ProductCard
|
||||
v-for="item in filteredProducts"
|
||||
:key="item.id"
|
||||
:product="item"
|
||||
@click="openOverlay(item.id)"
|
||||
/>
|
||||
<div v-else class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-4 mt-4 relative z-0">
|
||||
<ProductCard v-for="item in filteredProducts" :key="item.id" :product="item" @click="openOverlay(item.id)" />
|
||||
|
||||
<!-- 🔵 Empty State (sama kayak kategori) -->
|
||||
<div
|
||||
v-if="filteredProducts.length === 0"
|
||||
class="col-span-full flex flex-col items-center py-10 text-gray-500"
|
||||
>
|
||||
<svg
|
||||
class="w-12 h-12 text-gray-400 mb-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2 2v-5m16 0h-2M4 13h2"
|
||||
/>
|
||||
<div v-if="filteredProducts.length === 0" class="col-span-full flex flex-col items-center py-10 text-gray-500">
|
||||
<svg class="w-12 h-12 text-gray-400 mb-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2 2v-5m16 0h-2M4 13h2" />
|
||||
</svg>
|
||||
<p>Tidak ada data produk</p>
|
||||
</div>
|
||||
@ -123,47 +67,28 @@
|
||||
</div>
|
||||
|
||||
<!-- Overlay Detail Produk -->
|
||||
<div
|
||||
v-if="showOverlay"
|
||||
class="fixed inset-0 bg-black/30 flex justify-center items-center"
|
||||
@click.self="closeOverlay"
|
||||
>
|
||||
<div
|
||||
class="bg-white rounded-lg shadow-lg p-6 w-[450px] border-2 border-B relative flex flex-col items-center"
|
||||
>
|
||||
<div v-if="showOverlay" class="fixed inset-0 bg-black/30 flex justify-center items-center"
|
||||
@click.self="closeOverlay">
|
||||
<div class="bg-white rounded-lg shadow-lg p-6 w-[450px] border-2 border-B relative flex flex-col items-center">
|
||||
<!-- Foto Produk -->
|
||||
<div
|
||||
class="relative w-72 h-72 border border-B flex items-center justify-center mb-3 overflow-hidden rounded"
|
||||
>
|
||||
<img
|
||||
v-if="detail.foto && detail.foto.length > 0"
|
||||
:src="detail.foto[currentFotoIndex].url"
|
||||
:alt="detail.nama"
|
||||
class="w-full h-full object-contain"
|
||||
/>
|
||||
<div class="relative w-72 h-72 border border-B flex items-center justify-center mb-3 overflow-hidden rounded">
|
||||
<img v-if="detail.foto && detail.foto.length > 0" :src="detail.foto[currentFotoIndex].url" :alt="detail.nama"
|
||||
class="w-full h-full object-contain" />
|
||||
<span v-else class="text-gray-400 text-sm">[gambar]</span>
|
||||
|
||||
<!-- Stok (pcs) pojok kiri atas -->
|
||||
<div
|
||||
class="absolute top-1 left-1 bg-black/60 text-white text-xs px-2 py-1 rounded"
|
||||
>
|
||||
<div class="absolute top-1 left-1 bg-black/60 text-white text-xs px-2 py-1 rounded">
|
||||
{{ detail.items_count }} pcs
|
||||
</div>
|
||||
|
||||
<!-- Tombol Prev -->
|
||||
<button
|
||||
v-if="detail.foto && detail.foto.length > 1"
|
||||
@click.stop="prevFoto"
|
||||
class="absolute left-2 bg-white/80 hover:bg-white text-black px-2 py-1 rounded-full shadow"
|
||||
>
|
||||
<button v-if="detail.foto && detail.foto.length > 1" @click.stop="prevFoto"
|
||||
class="absolute left-2 bg-white/80 hover:bg-white text-black px-2 py-1 rounded-full shadow">
|
||||
‹
|
||||
</button>
|
||||
<!-- Tombol Next -->
|
||||
<button
|
||||
v-if="detail.foto && detail.foto.length > 1"
|
||||
@click.stop="nextFoto"
|
||||
class="absolute right-2 bg-white/80 hover:bg-white text-black px-2 py-1 rounded-full shadow"
|
||||
>
|
||||
<button v-if="detail.foto && detail.foto.length > 1" @click.stop="nextFoto"
|
||||
class="absolute right-2 bg-white/80 hover:bg-white text-black px-2 py-1 rounded-full shadow">
|
||||
›
|
||||
</button>
|
||||
</div>
|
||||
@ -174,9 +99,7 @@
|
||||
</p>
|
||||
|
||||
<!-- Detail Harga & Info -->
|
||||
<div
|
||||
class="grid grid-cols-2 gap-y-2 gap-x-4 text-sm w-full mb-6"
|
||||
>
|
||||
<div class="grid grid-cols-2 gap-y-2 gap-x-4 text-sm w-full mb-6">
|
||||
<p class="col-span-1">Harga Jual :</p>
|
||||
<p class="col-span-1 text-right">
|
||||
Rp. {{ formatNumber(detail.harga_jual) }}
|
||||
@ -195,24 +118,16 @@
|
||||
</div>
|
||||
|
||||
<!-- Tombol Aksi -->
|
||||
<div class="flex w-full gap-3">
|
||||
<button
|
||||
@click="$router.push(`/produk/${detail.id}/edit`)"
|
||||
class="flex-1 bg-yellow-400 text-black py-2 rounded font-bold"
|
||||
>
|
||||
<div v-if="isAdmin" class="flex w-full gap-3">
|
||||
<button @click="$router.push(`/produk/${detail.id}/edit`)"
|
||||
class="flex-1 bg-yellow-400 text-black py-2 rounded font-bold">
|
||||
Ubah
|
||||
</button>
|
||||
|
||||
<button
|
||||
@click="openItemModal"
|
||||
class="bg-green-400 text-black px-4 py-2 rounded font-bold"
|
||||
>
|
||||
<button @click="openItemModal" class="bg-green-400 text-black px-4 py-2 rounded font-bold">
|
||||
Tambah
|
||||
</button>
|
||||
<button
|
||||
@click="deleting = true"
|
||||
class="flex-1 bg-red-500 text-white py-2 rounded font-bold"
|
||||
>
|
||||
<button @click="deleting = true" class="flex-1 bg-red-500 text-white py-2 rounded font-bold">
|
||||
Hapus
|
||||
</button>
|
||||
</div>
|
||||
@ -226,11 +141,13 @@ import { ref, onMounted, computed } from "vue";
|
||||
import axios from "axios";
|
||||
import mainLayout from "../layouts/mainLayout.vue";
|
||||
import ProductCard from "../components/ProductCard.vue";
|
||||
import searchbar from "../components/searchbar.vue";
|
||||
import searchbar from "../components/Searchbar.vue";
|
||||
import CreateItemModal from "../components/CreateItemModal.vue";
|
||||
import ConfirmDeleteModal from "../components/ConfirmDeleteModal.vue";
|
||||
import InputSelect from "../components/InputSelect.vue";
|
||||
|
||||
const isAdmin = localStorage.getItem("role") == "owner";
|
||||
|
||||
const products = ref([]);
|
||||
const searchQuery = ref("");
|
||||
const selectedCategory = ref(0);
|
||||
@ -369,14 +286,3 @@ async function deleteProduk() {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 🔥 Tambahan agar searchbar mobile full */
|
||||
.searchbar-mobile:deep(div) {
|
||||
width: 100% !important;
|
||||
justify-content: flex-start !important;
|
||||
}
|
||||
.searchbar-mobile:deep(input) {
|
||||
width: 100% !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,123 +1,74 @@
|
||||
<template>
|
||||
<mainLayout>
|
||||
<!-- Modal Create/Edit Sales -->
|
||||
<CreateSales
|
||||
v-if="creatingSales"
|
||||
:isOpen="creatingSales"
|
||||
:sales="detail"
|
||||
@close="closeSales"
|
||||
/>
|
||||
<CreateSales v-if="creatingSales" :isOpen="creatingSales" :sales="detail" @close="closeSales" />
|
||||
|
||||
<EditSales
|
||||
v-if="editingSales"
|
||||
:isOpen="editingSales"
|
||||
:sales="detail"
|
||||
@close="closeEditSales"
|
||||
/>
|
||||
<EditSales v-if="editingSales" :isOpen="editingSales" :sales="detail" @close="closeEditSales" />
|
||||
|
||||
<!-- Modal Delete -->
|
||||
<ConfirmDeleteModal
|
||||
:isOpen="confirmDeleteOpen"
|
||||
title="Hapus Sales"
|
||||
message="Apakah Anda yakin ingin menghapus sales ini?"
|
||||
@confirm="confirmDelete"
|
||||
@cancel="closeDeleteModal"
|
||||
/>
|
||||
<ConfirmDeleteModal :isOpen="confirmDeleteOpen" title="Hapus Sales"
|
||||
message="Apakah Anda yakin ingin menghapus sales ini?" @confirm="confirmDelete" @cancel="closeDeleteModal" />
|
||||
|
||||
<div class="p-6 min-h-[75vh]">
|
||||
<p class="font-serif italic text-[25px] text-D">SALES</p>
|
||||
<div class="flex justify-between items-center mb-6">
|
||||
|
||||
<button
|
||||
@click="tambahSales"
|
||||
class="px-4 py-2 bg-C text-D rounded-md hover:bg-C/80 transition duration-200 flex items-center gap-2"
|
||||
>
|
||||
<svg
|
||||
class="w-4 h-4"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
<button @click="tambahSales"
|
||||
v-if="isAdmin"
|
||||
class="px-4 py-2 bg-C text-D rounded-md hover:bg-C/80 transition duration-200 flex items-center gap-2">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
|
||||
</svg>
|
||||
Tambah Sales
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Table Section -->
|
||||
<div
|
||||
class="bg-white rounded-lg shadow-md border border-gray-200\ overflow-hidden"
|
||||
>
|
||||
<table class="w-full">
|
||||
<div class="bg-white rounded-lg shadow-md border border-C overflow-x-auto">
|
||||
<table class="w-full ">
|
||||
<thead class="">
|
||||
<tr class="bg-C text-white">
|
||||
<th
|
||||
class="px-6 py-4 text-center text-D border-r border-[#b09065]"
|
||||
>
|
||||
<th class="px-6 py-4 text-center text-D">
|
||||
No
|
||||
</th>
|
||||
<th
|
||||
class="px-6 py-4 text-center text-D border-r border-[#b09065]"
|
||||
>
|
||||
<th class="px-6 py-4 text-center text-D">
|
||||
Nama Sales
|
||||
</th>
|
||||
<th
|
||||
class="px-6 py-4 text-center text-D border-r border-[#b09065]"
|
||||
>
|
||||
<th class="px-6 py-4 text-center text-D">
|
||||
No HP
|
||||
</th>
|
||||
<th
|
||||
class="px-6 py-4 text-center text-D border-r border-[#b09065]"
|
||||
>
|
||||
<th class="px-6 py-4 text-center text-D">
|
||||
Alamat
|
||||
</th>
|
||||
<th class="px-6 py-4 text-center text-D">Aksi</th>
|
||||
<th v-if="isAdmin" class="px-6 py-4 text-center text-D">
|
||||
Aksi
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
v-for="(item, index) in sales"
|
||||
:key="item.id"
|
||||
class="border-b border-gray-200\ hover:bg-gray-50 transition duration-150"
|
||||
:class="{ 'bg-gray-50': index % 2 === 1 }"
|
||||
>
|
||||
<td
|
||||
class="px-6 py-4 border-r border-gray-200\ text-center font-medium text-gray-900"
|
||||
>
|
||||
<tr v-for="(item, index) in sales" :key="item.id"
|
||||
class="border-b border-C hover:bg-gray-50 transition duration-150"
|
||||
:class="{ 'bg-gray-50': index % 2 === 1 }">
|
||||
<td class="px-6 py-4 border-r border-C text-center font-medium text-gray-900">
|
||||
{{ index + 1 }}
|
||||
</td>
|
||||
<td
|
||||
class="px-6 py-4 border-r border-gray-200\ text-D"
|
||||
>
|
||||
<td class="px-6 py-4 border-r border-C text-D">
|
||||
{{ item.nama }}
|
||||
</td>
|
||||
<td
|
||||
class="px-6 py-4 border-r border-gray-200\ text-gray-800"
|
||||
>
|
||||
<td class="px-6 py-4 border-r border-C text-gray-800">
|
||||
{{ item.no_hp }}
|
||||
</td>
|
||||
<td
|
||||
class="px-6 py-4 border-r border-gray-200\ text-gray-800"
|
||||
>
|
||||
<td class="px-6 py-4 border-r border-C text-gray-800">
|
||||
{{ item.alamat }}
|
||||
</td>
|
||||
<td class="px-6 py-4 text-center">
|
||||
<td class="px-6 py-4 text-center" v-if="isAdmin">
|
||||
<div class="flex justify-center gap-2">
|
||||
<button
|
||||
@click="ubahSales(item)"
|
||||
class="px-3 py-1 bg-yellow-500 text-white text-sm rounded hover:bg-yellow-600 transition duration-200"
|
||||
>
|
||||
<button @click="ubahSales(item)"
|
||||
class="px-3 py-1 bg-yellow-500 text-white text-sm rounded hover:bg-yellow-600 transition duration-200">
|
||||
Ubah
|
||||
</button>
|
||||
<button
|
||||
@click="hapusSales(item)"
|
||||
class="px-3 py-1 bg-red-500 text-white text-sm rounded hover:bg-red-600 transition duration-200"
|
||||
>
|
||||
<button @click="hapusSales(item)"
|
||||
class="px-3 py-1 bg-red-500 text-white text-sm rounded hover:bg-red-600 transition duration-200">
|
||||
Hapus
|
||||
</button>
|
||||
</div>
|
||||
@ -126,23 +77,11 @@
|
||||
|
||||
<!-- Empty State -->
|
||||
<tr v-if="sales.length === 0 && !loading">
|
||||
<td
|
||||
colspan="5"
|
||||
class="px-6 py-8 text-center text-gray-500"
|
||||
>
|
||||
<td colspan="5" class="px-6 py-8 text-center text-gray-500">
|
||||
<div class="flex flex-col items-center">
|
||||
<svg
|
||||
class="w-12 h-12 text-gray-400 mb-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2 2v-5m16 0h-2M4 13h2"
|
||||
/>
|
||||
<svg class="w-12 h-12 text-gray-400 mb-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2 2v-5m16 0h-2M4 13h2" />
|
||||
</svg>
|
||||
<p>Tidak ada data sales</p>
|
||||
</div>
|
||||
@ -154,9 +93,7 @@
|
||||
|
||||
<!-- Loading State -->
|
||||
<div v-if="loading" class="flex justify-center items-center py-8">
|
||||
<div
|
||||
class="animate-spin rounded-full h-8 w-8 border-b-2 border-[#c6a77d]"
|
||||
></div>
|
||||
<div class="animate-spin rounded-full h-8 w-8 border-b-2 border-[#c6a77d]"></div>
|
||||
<span class="ml-2 text-gray-600">Memuat data...</span>
|
||||
</div>
|
||||
</div>
|
||||
@ -171,6 +108,8 @@ import CreateSales from "../components/CreateSales.vue";
|
||||
import ConfirmDeleteModal from "../components/ConfirmDeleteModal.vue";
|
||||
import EditSales from "../components/EditSales.vue";
|
||||
|
||||
const isAdmin = localStorage.getItem("role") === "owner";
|
||||
|
||||
// State
|
||||
const sales = ref([]);
|
||||
const loading = ref(false);
|
||||
|
||||
@ -113,7 +113,7 @@
|
||||
import { ref } from "vue";
|
||||
import axios from "axios";
|
||||
import mainLayout from "../layouts/mainLayout.vue";
|
||||
import searchbar from "../components/searchbar.vue";
|
||||
import searchbar from "../components/Searchbar.vue";
|
||||
import TrayList from "../components/TrayList.vue";
|
||||
|
||||
const searchQuery = ref("");
|
||||
|
||||
Loading…
Reference in New Issue
Block a user