This commit is contained in:
Viet An
2026-05-22 09:57:12 +07:00
parent 58367a4793
commit 09b8a096d9
27 changed files with 74 additions and 1041 deletions

View File

@@ -12,10 +12,10 @@ const props = defineProps({
{{ order.delivery_status__name }}
</p>
</div>
<div class="p-4 rounded-md has-background-grey-95">
<div class="p-4 rounded-md has-background-white-bis">
<p class="has-text-grey">Địa chỉ giao hàng</p>
<p class="mt-1 has-text-grey-10">{{ order.customer__name }}</p>
<p class="has-text-grey-10">{{ order.customer__phone }}</p>
<p class="mt-1 has-text-grey-darker">{{ order.customer__name }}</p>
<p class="has-text-grey-darker">{{ order.customer__phone }}</p>
</div>
</div>
</template>

View File

@@ -79,7 +79,7 @@ const historyItems = [
</p>
</div>
<hr
class="mt-4 mb-0 has-background-grey-95"
class="mt-4 mb-0"
style="height: 2px"
/>
</div>

View File

@@ -23,7 +23,7 @@ const emit = defineEmits(["selectOrder", "unselect"]);
<div class="is-flex is-flex-direction-column is-gap-2">
<!-- customer info -->
<div>
<p class="has-text-grey-10">{{ order.customer__name }}</p>
<p class="has-text-grey-darker">{{ order.customer__name }}</p>
<div class="has-text-grey fs-13 mt-1 is-flex is-gap-1 is-align-items-center">
<Icon name="material-symbols:call-outline-rounded" />
<p>{{ order.customer__phone }}</p>
@@ -31,12 +31,12 @@ const emit = defineEmits(["selectOrder", "unselect"]);
</div>
<!-- product info -->
<div>
<p class="fs-24 has-text-grey-10 font-bold">
<p class="fs-24 has-text-grey-darker font-bold">
{{ $shortenCurrency(order.total) }}
</p>
<p class="fs-13 has-text-grey">{{ order.order__products.length }} sản phẩm</p>
</div>
<hr class="m-0" />
<hr class="m-0 has-background-grey-lighter" />
<div class="is-flex is-flex-direction-column is-gap-0.5 fs-13 has-text-grey">
<p class="is-flex is-align-items-center is-gap-0.5">
<Icon

View File

@@ -8,7 +8,7 @@ const { $numtoString } = useNuxtApp();
<template>
<div>
<div class="is-flex is-gap-2">
<div class="is-flex-grow-1 p-3 rounded-md has-background-grey-95">
<div class="is-flex-grow-1 p-3 rounded-md has-background-white-bis">
<p class="fs-13 has-text-grey">Tổng tiền</p>
<p class="font-bold">
{{ $numtoString(order.total, { hasUnit: true }) }}

View File

@@ -12,7 +12,7 @@ const { $numtoString } = useNuxtApp();
<div
v-for="product in order.order__products"
:key="product.id"
class="p-3 has-background-grey-95 rounded-md"
class="p-3 has-background-white-ter rounded-md"
>
<div class="fs-15 is-flex is-justify-content-space-between">
<p class="">{{ product.name }}</p>
@@ -20,7 +20,7 @@ const { $numtoString } = useNuxtApp();
{{ $numtoString(product.total, { hasUnit: true }) }}
</p>
</div>
<div class="is-flex is-gap-8 fs-13 has-text-grey-50 mt-1">
<div class="is-flex is-gap-8 fs-13 has-text-grey-dark mt-1">
<p>SL: {{ product.quantity }}</p>
<p>Đơn giá: {{ $numtoString(product.unit_price, { hasUnit: true }) }}</p>
<p>

View File

@@ -9,7 +9,7 @@ const props = defineProps({
<Icon
name="material-symbols:receipt-long-outline-rounded"
:size="50"
class="has-text-grey-70"
class="has-text-grey-light"
/>
<p>Chưa hoá đơn</p>
<button class="button is-purple">Tạo hoá đơn</button>

View File

@@ -25,7 +25,7 @@ const emit = defineEmits(["selectOrder", "unselect"]);
`has-background-${status.color}-90`,
]"
>
<p class="font-semibold has-text-grey-10">{{ status.name }}</p>
<p class="font-semibold has-text-grey-darker">{{ status.name }}</p>
<p
class="px-2 py-1 font-semibold rounded-lg has-background-white"
:style="{ border: `1px solid var(--bulma-${status.color}-60)` }"
@@ -33,8 +33,8 @@ const emit = defineEmits(["selectOrder", "unselect"]);
{{ orders.filter((o) => o.status === status.id).length }}
</p>
</div>
<hr class="m-0 has-background-grey-80" />
<div class="has-background-grey-95 p-4">
<hr class="m-0 has-background-grey-lighter" />
<div class="has-background-white-bis p-4">
<OrderKanbanCard
v-if="orders.filter((o) => o.status === status.id).length > 0"
v-for="order in orders.filter((o) => o.status === status.id)"

View File

@@ -29,7 +29,7 @@ const progressUnfilled = computed(() => `var(--bulma-${props.color}-85)`);
<Icon
name="material-symbols:arrow-forward-rounded"
:size="24"
class="has-text-grey-70"
class="has-text-grey-light"
/>
</div>
</template>