erp/web
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changes

Browse Source
This commit is contained in:
Viet An
2026-04-14 22:44:52 +07:00
parent 1d30ca3408
commit e5b80124fc
23 changed files with 1045 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
app/components/orders/SelectedOrder.vue
View File

@@ -1,10 +1,46 @@
<script setup>
import OrderDeliveryTab from '@/components/orders/OrderDeliveryTab.vue';
import OrderHistoryTab from '@/components/orders/OrderHistoryTab.vue';
import OrderPaymentTab from '@/components/orders/OrderPaymentTab.vue';
import OrderProductTab from '@/components/orders/OrderProductTab.vue';
import OrderReceiptTab from '@/components/orders/OrderReceiptTab.vue';
const props = defineProps({
order: Object
});
const { $dayjs, $numtoString } = useNuxtApp();
const emit = defineEmits(['unselect']);
const tabs = [
{
name: 'Chi tiết đơn',
heading: 'Chi tiết sản phẩm',
icon: 'material-symbols:deployed-code-outline'
},
{
name: 'Giao hàng',
heading: 'Thông tin giao hàng',
icon: 'material-symbols:delivery-truck-speed-outline-rounded'
},
{
name: 'Hoá đơn',
heading: 'Hoá đơn',
icon: 'material-symbols:receipt-long-outline-rounded'
},
{
name: 'Thanh toán',
heading: 'Thanh toán',
icon: 'material-symbols:credit-card-outline'
},
{
name: 'Lịch sử',
heading: 'Lịch sử đơn hàng',
icon: 'material-symbols:history-rounded'
},
];
const activeTab = ref(tabs[0]);
</script>
<template>
@@ -55,35 +91,32 @@ const emit = defineEmits(['unselect']);
<button class="button fs-14 is-flex-grow-1">Ghi thanh toán</button>
</div>
<hr class="m-0" />
<div class="tabs is-toggle fs-13">
<div class="tabs is-toggle m-0 fs-13">
<ul>
<li class="is-active">
<a>
<span>Chi tiết đơn</span>
</a>
</li>
<li>
<a>
<span>Giao hàng</span>
</a>
</li>
<li>
<a>
<span>Hoá đơn</span>
</a>
</li>
<li>
<a>
<span>Thanh toán</span>
</a>
</li>
<li>
<a>
<span>Lịch sử</span>
</a>
<li
v-for="tab in tabs"
:key="tab.name"
:class="activeTab.name === tab.name && 'is-active'"
@click="activeTab = tab"
>
<a>{{ tab.name }}</a>
</li>
</ul>
</div>
<hr class="m-0" />
<div id="tab-content">
<div class="is-flex is-gap-1 mb-4">
<Icon :name="activeTab.icon" :size="21" />
<span class="fs-15 font-semibold">{{ activeTab.heading }}</span>
</div>
<div>
<OrderProductTab v-if="activeTab.name === 'Chi tiết đơn'" :order="order" />
<OrderDeliveryTab v-else-if="activeTab.name === 'Giao hàng'" :order="order" />
<OrderReceiptTab v-else-if="activeTab.name === 'Hoá đơn'" :order="order" />
<OrderPaymentTab v-else-if="activeTab.name === 'Thanh toán'" :order="order" />
<OrderHistoryTab v-else-if="activeTab.name === 'Lịch sử'" :order="order" />
</div>
</div>
</div>
</div>
</div>