diff --git a/app/app.vue b/app/app.vue index 203dee9..bc6e7eb 100644 --- a/app/app.vue +++ b/app/app.vue @@ -49,7 +49,7 @@ const managerPageTabs = computed(() => { { key: 'balances', label: 'Балансы', - active: route.query.tab !== 'withdrawals' && route.query.tab !== 'manager', + active: route.query.tab !== 'withdrawals' && route.query.tab !== 'products' && route.query.tab !== 'manager', to: { path: '/bonus-system', query: { @@ -71,14 +71,14 @@ const managerPageTabs = computed(() => { }, }, { - key: 'manager', - label: 'Менеджеру', - active: route.query.tab === 'manager', + key: 'products', + label: 'Товары', + active: route.query.tab === 'products' || route.query.tab === 'manager', to: { path: '/bonus-system', query: { ...route.query, - tab: 'manager', + tab: 'products', }, }, }, diff --git a/app/pages/bonus-system/index.vue b/app/pages/bonus-system/index.vue index 58c2ccb..13539f7 100644 --- a/app/pages/bonus-system/index.vue +++ b/app/pages/bonus-system/index.vue @@ -20,6 +20,15 @@ type BalanceItem = ManagerBonusBalancesQuery['managerBonusBalances'][number]; type ReferralLinkItem = ManagerReferralLinksQuery['managerReferralLinks'][number]; type ManagerUserItem = ManagerUsersQuery['managerUsers'][number]; type WithdrawalItem = ManagerWithdrawalRequestsQuery['managerWithdrawalRequests'][number]; +type ProductCard = { + id: string; + store: string; + title: string; + amount: number; + subtitle: string; + gradient: string; + tags: string[]; +}; const route = useRoute(); const search = ref(''); @@ -30,21 +39,77 @@ const withdrawalsQuery = useQuery(ManagerWithdrawalRequestsDocument, { status: 'PENDING', }); -const activeTab = computed<'balances' | 'withdrawals' | 'manager'>(() => { +const activeTab = computed<'balances' | 'withdrawals' | 'products'>(() => { if (route.query.tab === 'withdrawals') { return 'withdrawals'; } - if (route.query.tab === 'manager') { - return 'manager'; + if (route.query.tab === 'products' || route.query.tab === 'manager') { + return 'products'; } return 'balances'; }); +const productCards: ProductCard[] = [ + { + id: 'ozon-3000', + store: 'Ozon', + title: 'Подарочная карта Ozon', + amount: 3000, + subtitle: 'Универсальная карта для маркетплейса: техника, дом и повседневные покупки.', + gradient: 'linear-gradient(135deg, #38b6ff 0%, #1369ff 55%, #0b2f72 100%)', + tags: ['Маркетплейс', 'Электронная карта', '3 000 ₽'], + }, + { + id: 'ozon-5000', + store: 'Ozon', + title: 'Подарочная карта Ozon', + amount: 5000, + subtitle: 'Крупный номинал для заметных подарков и сезонных закупок.', + gradient: 'linear-gradient(135deg, #65d0ff 0%, #247bff 52%, #12315e 100%)', + tags: ['Маркетплейс', 'Топ-номинал', '5 000 ₽'], + }, + { + id: 'wildberries-3000', + store: 'Wildberries', + title: 'Подарочная карта Wildberries', + amount: 3000, + subtitle: 'Подходит для одежды, дома и повседневных мелочей в одном каталоге.', + gradient: 'linear-gradient(135deg, #d84dff 0%, #8b27ff 52%, #39006a 100%)', + tags: ['Fashion', 'Маркетплейс', '3 000 ₽'], + }, + { + id: 'wildberries-4000', + store: 'Wildberries', + title: 'Подарочная карта Wildberries', + amount: 4000, + subtitle: 'Средний номинал для fashion-покупок и товаров для дома.', + gradient: 'linear-gradient(135deg, #ef7cff 0%, #a12dff 50%, #4c0b7d 100%)', + tags: ['Одежда', 'Дом', '4 000 ₽'], + }, + { + id: 'mvideo-4000', + store: 'М.Видео', + title: 'Подарочная карта М.Видео', + amount: 4000, + subtitle: 'Для техники, аксессуаров и бытовой электроники.', + gradient: 'linear-gradient(135deg, #ff9461 0%, #ff5630 48%, #821414 100%)', + tags: ['Техника', 'Электроника', '4 000 ₽'], + }, + { + id: 'mvideo-5000', + store: 'М.Видео', + title: 'Подарочная карта М.Видео', + amount: 5000, + subtitle: 'Максимальный номинал для заметных подарков и апгрейдов рабочего места.', + gradient: 'linear-gradient(135deg, #ffb17e 0%, #ff6842 50%, #8f1818 100%)', + tags: ['Электроника', 'Подарок', '5 000 ₽'], + }, +]; + const balances = computed(() => balancesQuery.result.value?.managerBonusBalances ?? []); const referralLinks = computed(() => referralLinksQuery.result.value?.managerReferralLinks ?? []); const users = computed(() => usersQuery.result.value?.managerUsers ?? []); const withdrawals = computed(() => withdrawalsQuery.result.value?.managerWithdrawalRequests ?? []); - const usersById = computed(() => new Map(users.value.map((user) => [user.id, user]))); const referralLinksByReferrer = computed(() => { @@ -120,6 +185,27 @@ const filteredWithdrawals = computed(() => { }); }); +const filteredProducts = computed(() => { + const query = search.value.trim().toLowerCase(); + + return productCards.filter((item) => { + if (!query) { + return true; + } + + return [ + item.store, + item.title, + item.subtitle, + String(item.amount), + ...item.tags, + ] + .join(' ') + .toLowerCase() + .includes(query); + }); +}); + const { canLoadMore: canLoadMoreBalances, loadMore: loadMoreBalances, @@ -175,7 +261,7 @@ function formatAmount(value: number) { ? 'Клиент, связанный клиент, email или процент' : activeTab === 'withdrawals' ? 'Пользователь, сумма или статус' - : 'Сценарии для менеджера'" + : 'Магазин, номинал или тип карты'" /> -