fregat/web-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify manager section layouts

Browse Source
This commit is contained in:
Ruslan Bakiev
2026-04-04 08:45:53 +07:00
parent 26b44f30bf
commit 60f8b863a2
5 changed files with 111 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
app/pages/client-orders/index.vue
View File

@@ -59,19 +59,14 @@ const filteredOrders = computed(() => {
title="Заказы клиентов"
search-placeholder="Номер заказа, клиент, адрес или товар"
>
<div class="surface-card rounded-3xl p-4 md:p-5">
<div class="grid gap-3 md:grid-cols-[1fr_auto]">
<label class="form-control md:min-w-60">
<span class="label-text">Фильтр</span>
<select v-model="statusFilter" class="select manager-field w-full">
<option value="ALL">Все заказы</option>
<option value="WAITING">Ожидают подтверждения</option>
<option value="ACTIVE">Активные</option>
<option value="CLOSED">Закрытые</option>
</select>
</label>
</div>
</div>
<template #controls>
<select v-model="statusFilter" class="select select-bordered w-full rounded-full bg-white md:w-64">
<option value="ALL">Все заказы</option>
<option value="WAITING">Ожидают подтверждения</option>
<option value="ACTIVE">Активные</option>
<option value="CLOSED">Закрытые</option>
</select>
</template>
</UiSectionSearchHero>
<div v-if="ordersQuery.loading.value" class="manager-empty-state">
@@ -91,25 +86,22 @@ const filteredOrders = computed(() => {
<div class="flex flex-wrap items-start justify-between gap-3">
<div class="space-y-1">
<h2 class="text-lg font-bold text-[#123824]">{{ order.code }}</h2>
<div class="flex flex-wrap gap-3 text-sm text-[#5c7b69]">
<span>Клиент: {{ order.customerId }}</span>
<span>{{ new Date(order.createdAt).toLocaleString() }}</span>
</div>
<p class="text-sm text-[#5c7b69]">Клиент: {{ order.customerId }}</p>
<p class="text-sm text-[#5c7b69]">Создан: {{ new Date(order.createdAt).toLocaleString() }}</p>
<p v-if="order.deliveryAddress" class="text-sm text-[#5c7b69]">Адрес: {{ order.deliveryAddress }}</p>
</div>
<OrderStatusBadge :status="order.status" />
</div>
<div class="mt-4 grid gap-3 md:grid-cols-3">
<div class="manager-mini-card text-sm text-[#123824]">
Позиций: <span class="font-semibold">{{ order.items.length }}</span>
</div>
<div class="manager-mini-card text-sm text-[#123824]">
Итого: <span class="font-semibold">{{ order.totalPrice ?? 'без оффера' }}</span>
</div>
<div class="manager-mini-card text-sm text-[#123824]">
Адрес: <span class="font-semibold">{{ order.deliveryAddress || 'не выбран' }}</span>
</div>
</div>
<ul class="mt-4 grid gap-2 text-sm text-[#214735]">
<li
v-for="item in order.items"
:key="item.id"
class="rounded-2xl border border-[#d6ebde] bg-white px-4 py-3"
>
{{ item.productName }} × {{ item.quantity }}
</li>
</ul>
</NuxtLink>
</div>
</section>