init

2026-08-28 17:31:02 +02:00
commit 2b30e8bd39
694 changed files with 49243 additions and 0 deletions
@@ -0,0 +1,134 @@
+<template>
+    <div>
+        <h3 class="m-0 mb-24">Orders</h3>
+
+        <div class="cms-table-scroll">
+            <el-table
+                v-loading="loading"
+                :data="orderList"
+                stripe
+                empty-text="No orders yet"
+                class="clickable-table"
+                @row-click="row => router.push({ name: ROUTE_NAMES.OrderDetail, params: { id: row.id } })"
+            >
+                <el-table-column label="Status" min-width="120">
+                    <template #default="{ row }">
+                        <el-tag :type="resolveOrderStatusTagType(row.status)" size="small">
+                            {{ capitalizeFirstLetter(row.status) }}
+                        </el-tag>
+                    </template>
+                </el-table-column>
+
+                <el-table-column label="Checkout" width="300">
+                    <template #default="{ row }">
+                        <el-tag
+                            v-if="row.checkoutPaymentLabel"
+                            :type="resolveInvoiceStatusTagType(row.checkoutPaymentLabel)"
+                            size="small"
+                        >
+                            {{ row.checkoutPaymentLabel }}
+                        </el-tag>
+                        <span v-else class="secondary-text">—</span>
+                    </template>
+                </el-table-column>
+
+                <el-table-column label="Shipping" width="300">
+                    <template #default="{ row }">
+                        <el-tag
+                            v-if="row.shippingPaymentLabel"
+                            :type="resolveInvoiceStatusTagType(row.shippingPaymentLabel)"
+                            size="small"
+                        >
+                            {{ row.shippingPaymentLabel }}
+                        </el-tag>
+                        <span v-else class="secondary-text">—</span>
+                    </template>
+                </el-table-column>
+
+                <el-table-column label="Total" width="120">
+                    <template #default="{ row }">
+                        {{ formatFiatPrice(row.grandTotalFiat ?? row.totalFiat, row.fiatCurrency) }}
+                    </template>
+                </el-table-column>
+
+                <el-table-column label="Items" width="80" align="center">
+                    <template #default="{ row }">
+                        {{ row.lineCount }}
+                    </template>
+                </el-table-column>
+
+                <el-table-column label="Unread" width="120" align="center">
+                    <template #default="{ row }">
+                        <el-badge v-if="row.unreadMessageCount > 0" :value="row.unreadMessageCount" />
+                        <span v-else class="secondary-text">—</span>
+                    </template>
+                </el-table-column>
+
+                <el-table-column label="Created" width="180">
+                    <template #default="{ row }">
+                        {{ formatDate(row.createdAt) }}
+                    </template>
+                </el-table-column>
+
+                <el-table-column width="100" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            link
+                            type="primary"
+                            @click.stop="router.push({ name: ROUTE_NAMES.OrderDetail, params: { id: row.id } })"
+                        >
+                            Open
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </div>
+
+        <cms-list-pagination v-model:page="page" v-model:limit="limit" :total="total" @change="loadOrders" />
+    </div>
+</template>
+
+<script setup lang="ts">
+import { onBeforeMount, ref } from 'vue';
+import { useRouter } from 'vue-router';
+import { storeToRefs } from 'pinia';
+import { ROUTE_NAMES } from '@/consts/routeNames';
+import { useOrdersStore } from '@/stores/orders';
+import { capitalizeFirstLetter } from '@/utils/capitalizeFirstLetter';
+import { formatDate } from '@/utils/formatDate';
+import { formatFiatPrice } from '@/utils/formatFiatPrice';
+import { resolveInvoiceStatusTagType } from '@/utils/order/resolveInvoiceStatusTagType';
+import { resolveOrderStatusTagType } from '@/utils/order/resolveOrderStatusTagType';
+
+const router = useRouter();
+
+const ordersStore = useOrdersStore();
+
+const { orderList } = storeToRefs(ordersStore);
+
+const loading = ref(false);
+const page = ref(1);
+const limit = ref(20);
+const total = ref(0);
+
+onBeforeMount(() => {
+    loadOrders();
+});
+
+const loadOrders = async (): Promise<void> => {
+    loading.value = true;
+
+    try {
+        const data = await ordersStore.fetchList({
+            page: page.value,
+            limit: limit.value
+        });
+
+        total.value = data.total;
+        page.value = data.page;
+        limit.value = data.limit;
+    } finally {
+        loading.value = false;
+    }
+};
+</script>