Refine order list layout and client card

This commit is contained in:
Ruslan Bakiev
2026-04-04 14:30:50 +07:00
parent 3bee6c370a
commit 254fa45ced
6 changed files with 66 additions and 115 deletions

View File

@@ -207,14 +207,26 @@ const calendarOptions = computed(() => ({
>
<template #controls>
<div class="flex w-full flex-col gap-3 md:w-auto md:flex-row">
<div class="tabs tabs-boxed w-fit bg-white">
<button class="tab" :class="{ 'tab-active': viewMode === 'cards' }" @click="setViewMode('cards')">
<div class="inline-flex w-fit rounded-full border border-[#d7e9de] bg-white p-1">
<button
class="rounded-full px-4 py-2 text-sm font-semibold text-[#355947] transition"
:class="viewMode === 'cards' ? 'bg-[#123824] text-white' : 'hover:bg-[#f4faf6]'"
@click="setViewMode('cards')"
>
Карточки
</button>
<button class="tab" :class="{ 'tab-active': viewMode === 'calendar' }" @click="setViewMode('calendar')">
<button
class="rounded-full px-4 py-2 text-sm font-semibold text-[#355947] transition"
:class="viewMode === 'calendar' ? 'bg-[#123824] text-white' : 'hover:bg-[#f4faf6]'"
@click="setViewMode('calendar')"
>
Календарь
</button>
<button class="tab" :class="{ 'tab-active': viewMode === 'kanban' }" @click="setViewMode('kanban')">
<button
class="rounded-full px-4 py-2 text-sm font-semibold text-[#355947] transition"
:class="viewMode === 'kanban' ? 'bg-[#123824] text-white' : 'hover:bg-[#f4faf6]'"
@click="setViewMode('kanban')"
>
Kanban
</button>
</div>
@@ -288,7 +300,6 @@ const calendarOptions = computed(() => ({
:created-at="order.createdAt"
:total-price="order.totalPrice"
:items="order.items"
:customer="customerCardMeta(order.customerId)"
/>
</div>
</div>
@@ -304,7 +315,6 @@ const calendarOptions = computed(() => ({
:created-at="order.createdAt"
:total-price="order.totalPrice"
:items="order.items"
:customer="customerCardMeta(order.customerId)"
/>
</div>
</section>