fix: style

This commit is contained in:
2026-03-23 11:04:41 +01:00
parent 0853424c4e
commit 508418523f
4 changed files with 15 additions and 21 deletions

View File

@@ -9,21 +9,22 @@
<div v-if="cartStore.items.length > 0" class="divide-y divide-(--border-light) dark:divide-(--border-dark)">
<div v-for="item in cartStore.items" :key="item.id" class="flex items-center justify-between p-4 gap-4">
<div class="flex items-center gap-10 flex-1">
<div class="grid grid-cols-5 w-[100%]">
<div
class="w-20 bg-(--second-light) dark:bg-(--main-dark) rounded flex items-center justify-center overflow-hidden">
<img v-if="item.image" :src="item.image" :alt="item.name" class="w-full h-full object-cover" />
<UIcon v-else name="mdi:package-variant" class="text-xl text-gray-400" />
</div>
<div class="flex-1 min-w-0">
<p class="text-black dark:text-white text-sm font-medium truncate">{{ item.name }}</p>
<p class="text-gray-500 dark:text-gray-400 text-sm">
{{ t('Qty') }}: {{ item.quantity }} × ${{ item.price.toFixed(2) }}
</p>
</div>
</div>
<div class="text-right flex-shrink-0">
<p class="text-black dark:text-white text-sm font-medium truncate">{{ item.name }}</p>
<p class="text-black dark:text-white text-sm font-medium truncate">{{ item.product_number }}</p>
<p class="text-black dark:text-white font-medium">${{ (item.price * item.quantity).toFixed(2) }}</p>
<div class="flex items-center justify-end gap-10">
<UInputNumber v-model="item.quantity" class="text-gray-500 dark:text-gray-400 text-sm" />
<button size="sm" color="destructive" variant="outline" @click="confirmDelete(address.id)"
class="text-red-500 bg-red-100 dark:bg-red-900 dark:text-red-100 rounded transition-colors p-2">
<UIcon name="material-symbols:delete" class="text-[16px]" />
</button>
</div>
</div>
</div>
</div>

View File

@@ -161,14 +161,6 @@ function saveAddress() {
}
closeModal()
}
// const Lera = ref('')
// function run (){
// if(Lera.value==='lera'){
// console.log('Leraa okokok')
// }else{
// console.log('LEra nonono')
// }
// }
function confirmDelete(id: number) {
addressToDelete.value = id
showDeleteConfirm.value = true

View File

@@ -42,7 +42,7 @@
}}</span>
</div>
<div class="col-span-1 flex justify-center">
<button @click="removeItem(item.id)"
<button @click="removeItem(item.id)"
class="p-2 text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 rounded transition-colors"
:title="t('Remove')">
<UIcon name="material-symbols:delete" class="text-[20px]" />

View File

@@ -8,6 +8,7 @@ export interface CartItem {
image: string
price: number
quantity: number
product_number:string
}
export interface DeliveryMethod {
@@ -32,9 +33,9 @@ export const useCartStore = defineStore('cart', () => {
function initMockData() {
items.value = [
{ id: 1, productId: 101, name: 'Premium Widget Pro', image: '/img/product-1.jpg', price: 129.99, quantity: 2 },
{ id: 2, productId: 102, name: 'Ultra Gadget X', image: '/img/product-2.jpg', price: 89.50, quantity: 1 },
{ id: 3, productId: 103, name: 'Mega Tool Set', image: '/img/product-3.jpg', price: 249.00, quantity: 3 }
{ id: 1, productId: 101, name: 'Premium Widget Pro', product_number: 'NC209/7000', image: '/img/product-1.jpg', price: 129.99, quantity: 2 },
{ id: 2, productId: 102, name: 'Ultra Gadget X', product_number: 'NC234/6453', image: '/img/product-2.jpg', price: 89.50, quantity: 1 },
{ id: 3, productId: 103, name: 'Mega Tool Set', product_number: 'NC324/9030', image: '/img/product-3.jpg', price: 249.00, quantity: 3 }
]
}