Penyesuaian tabel dan SEO
This commit is contained in:
parent
8ad64a986d
commit
9ccc26455e
@ -52,45 +52,52 @@
|
||||
{{ props.search ? 'Item tidak ditemukan.' : 'Brankas kosong.' }}
|
||||
</div>
|
||||
|
||||
<div v-else class="overflow-x-auto border border-C rounded-lg shadow-sm">
|
||||
<table class="min-w-full divide-y divide-C">
|
||||
<thead class="bg-A">
|
||||
<tr>
|
||||
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-D uppercase tracking-wider">
|
||||
Gambar
|
||||
</th>
|
||||
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-D uppercase tracking-wider">
|
||||
Nama Produk
|
||||
</th>
|
||||
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-D uppercase tracking-wider">
|
||||
Kode Item
|
||||
</th>
|
||||
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-D uppercase tracking-wider">
|
||||
Berat
|
||||
</th>
|
||||
<div class="bg-white rounded-lg shadow-md overflow-x-auto">
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
<tr class="bg-C text-white border-D border">
|
||||
<th class="px-6 py-4 text-center border-r border-D text-D">No</th>
|
||||
<th class="px-6 py-4 text-center border-r border-D text-D">Nama Produk</th>
|
||||
<th class="px-6 py-4 text-center border-r border-D text-D">Kode Item</th>
|
||||
<th class="px-6 py-4 text-center border-r border-D text-D">Berat</th>
|
||||
<th class="px-6 py-4 text-center text-D">Aksi</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="bg-white divide-y divide-gray-200">
|
||||
<tr v-for="item in filteredItems" :key="item.id"
|
||||
class="hover:bg-gray-50 transition cursor-pointer"
|
||||
@click="openMovePopup(item)">
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<img v-if="item.produk?.foto?.length" :src="item.produk?.foto[0].url"
|
||||
class="size-12 object-cover rounded"
|
||||
@error="handleImageError" />
|
||||
<div class="size-12 bg-gray-200 rounded flex items-center justify-center" v-else>
|
||||
<i class="fas fa-image text-gray-400"></i>
|
||||
<tbody>
|
||||
<tr v-for="(item, index) in filteredItems" :key="item.id"
|
||||
class="border-b border-C border-t-0 border-x 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-C text-D font-semibold">
|
||||
{{ item.produk?.nama }}
|
||||
</td>
|
||||
<td class="px-6 py-4 border-r border-C text-gray-800 font-semibold">
|
||||
{{ item.kode_item }}
|
||||
</td>
|
||||
<td class="px-6 py-4 border-r border-C text-D font-medium">
|
||||
{{ item.produk?.berat }}g
|
||||
</td>
|
||||
<td class="px-6 py-4 text-center">
|
||||
<button @click="openMovePopup(item)"
|
||||
class="px-3 py-1 bg-blue-500 text-white text-sm rounded hover:bg-blue-600 transition duration-200">
|
||||
Detail
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Empty State -->
|
||||
<tr v-if="filteredItems.length === 0">
|
||||
<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>
|
||||
<p>Tidak ada data item di brankas</p>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<p class="font-semibold text-D">{{ item.produk?.nama }}</p>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<p class="text-sm text-gray-500 font-semibold">{{ item.kode_item }}</p>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<span class="font-medium text-D">{{ item.produk?.berat }}g</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@ -202,7 +209,7 @@ const selectedItem = ref(null);
|
||||
const selectedTrayId = ref("");
|
||||
const errorMove = ref("");
|
||||
const isMoving = ref(false);
|
||||
const isAdmin = localStorage.getItem('role') == 'admin'
|
||||
const isAdmin = localStorage.getItem('role') == 'owner'
|
||||
|
||||
const showDeleteConfirm = ref(false);
|
||||
|
||||
|
||||
@ -91,17 +91,17 @@
|
||||
<!-- Dropdown -->
|
||||
<div class="mb-4">
|
||||
<label for="tray-select" class="block text-sm font-medium mb-1">Nama Nampan</label>
|
||||
<InputSelect v-if="isAdmin" v-model="selectedTrayId"
|
||||
<InputSelect v-model="selectedTrayId"
|
||||
:options="[ { label: 'Brankas', value: 0 }, ...trays.map(tray => ({ label: tray.nama, value: tray.id })) ]" placeholder="Pilih Nampan"
|
||||
class="mt-2" />
|
||||
<div class="bg-A px-3 py-2 rounded text-D font-medium" v-else>
|
||||
<!-- <div class="bg-A px-3 py-2 rounded text-D font-medium" v-else>
|
||||
{{trays.find(tray => tray.id === selectedTrayId)?.nama}}
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end gap-2">
|
||||
<button @click="closePopup" class="px-4 py-2 rounded bg-gray-400 hover:bg-gray-500 text-white transition">
|
||||
{{ isAdmin ? 'Batal' : 'Tutup' }}
|
||||
Batal
|
||||
</button>
|
||||
|
||||
<!-- Tombol Hapus hanya muncul kalau Admin -->
|
||||
@ -110,7 +110,7 @@
|
||||
<i class="fas fa-trash mr-2"></i>Hapus
|
||||
</button>
|
||||
|
||||
<button v-if="isAdmin" @click="saveMove" :disabled="!selectedTrayId" class="px-4 py-2 rounded transition"
|
||||
<button @click="saveMove" :disabled="!selectedTrayId" class="px-4 py-2 rounded transition"
|
||||
:class="selectedTrayId ? 'bg-C hover:bg-C/80 text-D' : 'bg-gray-400 cursor-not-allowed'">
|
||||
Simpan
|
||||
</button>
|
||||
|
||||
@ -5,21 +5,21 @@
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<title>@yield('title', config('app.name', 'Abbauf App'))</title>
|
||||
<title>@yield('title', 'Kasir Toko Mas Jakarta Citayam')</title>
|
||||
|
||||
<meta name="description" content="@yield('description', 'Deskripsi default untuk aplikasi Abbauf.')">
|
||||
<meta name="author" content="Nama Anda atau Perusahaan Anda">
|
||||
<meta name="description" content="@yield('description', 'Aplikasi kasir internal untuk pengelolaan transaksi dan stok emas di Toko Mas Jakarta Citayam.')">
|
||||
<meta name="author" content="Abbauf Tech">
|
||||
|
||||
<meta property="og:title" content="@yield('title', config('app.name', 'Abbauf App'))" />
|
||||
<meta property="og:description" content="@yield('description', 'Deskripsi default untuk aplikasi Abbauf.')" />
|
||||
<meta property="og:title" content="@yield('title', 'Kasir Toko Mas Jakarta Citayam')" />
|
||||
<meta property="og:description" content="@yield('description', 'Aplikasi kasir internal untuk pengelolaan transaksi dan stok emas di Toko Mas Jakarta Citayam.')" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:url" content="{{ url()->current() }}" />
|
||||
<meta property="og:image" content="@yield('og_image', asset('images/default-social-image.jpg'))" />
|
||||
<meta property="og:image" content="@yield('og_image', asset('build/assets/logo-BATkcDH-.png'))" />
|
||||
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:title" content="@yield('title', config('app.name', 'Abbauf App'))">
|
||||
<meta name="twitter:description" content="@yield('description', 'Deskripsi default untuk aplikasi Abbauf.')">
|
||||
<meta name="twitter:image" content="@yield('og_image', asset('images/default-social-image.jpg'))">
|
||||
<meta name="twitter:title" content="@yield('title', 'Kasir Toko Mas Jakarta Citayam')">
|
||||
<meta name="twitter:description" content="@yield('description', 'Aplikasi kasir internal untuk pengelolaan transaksi dan stok emas di Toko Mas Jakarta Citayam.')">
|
||||
<meta name="twitter:image" content="@yield('og_image', asset('build/assets/logo-BATkcDH-.png'))">
|
||||
|
||||
<link rel="icon" href="{{ asset('logo.ico') }}" type="image/x-icon">
|
||||
<link rel="apple-touch-icon" href="{{ asset('apple-touch-icon.png') }}">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user