changes
This commit is contained in:
@@ -11,7 +11,6 @@ function openModal() {
|
||||
component: "orders/SelectedOrder",
|
||||
title: "Chi tiết đơn hàng",
|
||||
width: "75%",
|
||||
height: "500px",
|
||||
vbind: {
|
||||
invoice: props.invoice,
|
||||
},
|
||||
|
||||
@@ -64,7 +64,7 @@ const historyItems = [
|
||||
:class="`has-text-${item.color}-40`"
|
||||
/>
|
||||
<div
|
||||
class="is-flex-grow-1 has-background-grey-lighter rounded-full"
|
||||
class="is-flex-grow-1 has-background-grey-85 rounded-full"
|
||||
style="width: 3px"
|
||||
></div>
|
||||
</div>
|
||||
|
||||
@@ -36,7 +36,7 @@ function openModal() {
|
||||
<div class="is-flex is-flex-direction-column is-gap-2">
|
||||
<!-- customer info -->
|
||||
<div>
|
||||
<p class="has-text-grey-darker">{{ order.customer__name }}</p>
|
||||
<p class="has-text-grey-20">{{ 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>
|
||||
@@ -44,12 +44,12 @@ function openModal() {
|
||||
</div>
|
||||
<!-- product info -->
|
||||
<div>
|
||||
<p class="fs-24 has-text-grey-darker font-bold">
|
||||
<p class="fs-24 has-text-grey-20 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 has-background-grey-lighter" />
|
||||
<hr class="m-0 has-background-grey-85" />
|
||||
<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
|
||||
|
||||
@@ -8,7 +8,7 @@ const { $formatNum } = useNuxtApp();
|
||||
<template>
|
||||
<div>
|
||||
<div class="is-flex is-gap-2">
|
||||
<div class="is-flex-grow-1 p-3 rounded-md has-background-white-bis">
|
||||
<div class="is-flex-grow-1 p-3 rounded-md has-background-white-100">
|
||||
<p class="fs-13 has-text-grey">Tổng tiền</p>
|
||||
<p class="font-bold">
|
||||
{{ $formatNum(invoice.total, { hasUnit: true }) }}
|
||||
|
||||
@@ -43,7 +43,7 @@ const phases = [
|
||||
v-bind="phase"
|
||||
/>
|
||||
</div>
|
||||
<hr class="has-background-grey-lighter" />
|
||||
<hr class="has-background-grey-85" />
|
||||
<div class="is-flex is-justify-content-space-between">
|
||||
<p>Tổng đơn hàng</p>
|
||||
<p class="fs-18 font-semibold">
|
||||
|
||||
@@ -27,12 +27,12 @@ const invoiceProducts = computed(() => {
|
||||
<div
|
||||
v-for="product in invoiceProducts"
|
||||
:key="product.id"
|
||||
class="p-3 has-background-white-ter rounded-md"
|
||||
class="p-3 has-background-white-95 rounded-md"
|
||||
>
|
||||
<div class="is-flex is-justify-content-space-between is-align-items-flex-end">
|
||||
<div>
|
||||
<p class="font-semibold">{{ product.variant__product__name }}</p>
|
||||
<div class="is-flex is-gap-8 fs-13 has-text-grey-dark mt-1">
|
||||
<div class="is-flex is-gap-8 fs-13 has-text-grey-30 mt-1">
|
||||
<p>SL: {{ product.amount }}</p>
|
||||
<p>Đơn giá: {{ $formatNum(product.price, { hasUnit: true }) }}</p>
|
||||
</div>
|
||||
@@ -47,15 +47,15 @@ const invoiceProducts = computed(() => {
|
||||
<table class="table is-fullwidth is-bordered fs-14 mb-8">
|
||||
<tbody class="has-text-right">
|
||||
<tr>
|
||||
<td class="has-text-grey-dark">Tổng tiền hàng</td>
|
||||
<td class="has-text-grey-30">Tổng tiền hàng</td>
|
||||
<td>{{ $formatNum(invoice.total_amount, { hasUnit: true }) }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="has-text-grey-dark">Phí vận chuyển</td>
|
||||
<td class="has-text-grey-30">Phí vận chuyển</td>
|
||||
<td>{{ $formatNum(invoice.shipping_fee, { hasUnit: true }) }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="has-text-grey-dark">Giảm giá</td>
|
||||
<td class="has-text-grey-30">Giảm giá</td>
|
||||
<td>{{ $formatNum(invoice.discount_amount, { hasUnit: true }) }}</td>
|
||||
</tr>
|
||||
<tr class="font-bold">
|
||||
|
||||
@@ -9,7 +9,7 @@ const props = defineProps({
|
||||
<Icon
|
||||
name="material-symbols:receipt-long-outline-rounded"
|
||||
:size="50"
|
||||
class="has-text-grey-light"
|
||||
class="has-text-grey-70"
|
||||
/>
|
||||
<p>Chưa có hoá đơn</p>
|
||||
<button class="button is-purple">Tạo hoá đơn</button>
|
||||
|
||||
@@ -25,7 +25,7 @@ const emit = defineEmits(["selectOrder", "unselect"]);
|
||||
`has-background-${status.color}-90`,
|
||||
]"
|
||||
>
|
||||
<p class="font-semibold has-text-grey-darker">{{ status.name }}</p>
|
||||
<p class="font-semibold has-text-grey-20">{{ 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-lighter" />
|
||||
<div class="has-background-white-bis p-4">
|
||||
<hr class="m-0 has-background-grey-85" />
|
||||
<div class="has-background-white-100 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)"
|
||||
|
||||
@@ -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-light"
|
||||
class="has-text-grey-70"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user