goc_daniel/b2b
2
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: layouts

Browse Source
This commit is contained in:
Valeriia Yakovenko
2026-03-24 12:26:23 +01:00
parent 78b32cbd9c
commit 0cee3e5cb7
16 changed files with 224 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
bo/src/components/admin/ProductDetailView.vue
View File

@@ -1,4 +1,6 @@
<template>
<component :is="Default || 'div'">
<div class="container my-10 mx-auto ">
<div
@@ -112,6 +114,7 @@
</div>
</div>
</div>
</component>
</template>
<script setup lang="ts">
@@ -120,6 +123,7 @@ import { useProductStore } from '@/stores/product'
import { useEditable } from '@/composable/useConteditable'
import { langs } from '@/router/langs'
import type { Language } from '@/types'
import Default from '@/layouts/default.vue'
const activeTab = ref('description')
const productStore = useProductStore()

60
bo/src/components/admin/ProductsView.vue
View File

@@ -6,6 +6,7 @@ import { useProductStore, type Product } from '@/stores/product'
import { useI18n } from 'vue-i18n'
import type { TableColumn } from '@nuxt/ui'
import { h } from 'vue'
import Default from '@/layouts/default.vue'
const router = useRouter()
const authStore = useAuthStore()
@@ -29,13 +30,13 @@ onMounted(() => {
// Filtered products
// const filteredProducts = computed(() => {
// console.log(productStore.products);
// return productStore.products.filter(product => {
// const matchesName = product.name.toLowerCase().includes(searchName.value.toLowerCase())
// const matchesCode = product.code.toLowerCase().includes(searchCode.value.toLowerCase())
// const matchesPriceFrom = priceFromFilter.value === null || product.priceFrom >= priceFromFilter.value
// const matchesPriceTo = priceToFilter.value === null || product.priceTo <= priceToFilter.value
// return matchesName && matchesCode && matchesPriceFrom && matchesPriceTo
// })
// })
@@ -153,13 +154,14 @@ function clearFilters() {
</script>
<template>
<component :is="Default || 'div'">
<div class="container">
<div class="p-6 bg-white dark:bg-(--black) min-h-screen font-sans">
<div >
<div>
<!-- v-html="productStore.products" -->
</div>
<h1 class="text-2xl font-bold mb-6 text-black dark:text-white">{{ t('products.title') }}</h1>
<div v-if="!authStore.isAuthenticated" class="mb-4 p-3 bg-yellow-100 text-yellow-700 rounded">
{{ t('products.login_to_view') }}
</div>
@@ -176,50 +178,33 @@ function clearFilters() {
<div v-if="authStore.isAuthenticated && !productStore.loading && !productStore.error" class="space-y-4">
<!-- Filter Block -->
<div class="flex flex-wrap gap-4 mb-4 p-4 border border-(--border-light) dark:border-(--border-dark) rounded bg-gray-50 dark:bg-gray-800">
<div
class="flex flex-wrap gap-4 mb-4 p-4 border border-(--border-light) dark:border-(--border-dark) rounded bg-gray-50 dark:bg-gray-800">
<div class="flex flex-col min-w-[180px]">
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ t('products.search_by_name') }}</label>
<UInput
v-model="searchName"
:placeholder="t('products.search_name_placeholder')"
@update:model-value="resetPage"
class="dark:text-white text-black"
/>
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ t('products.search_by_name')
}}</label>
<UInput v-model="searchName" :placeholder="t('products.search_name_placeholder')"
@update:model-value="resetPage" class="dark:text-white text-black" />
</div>
<div class="flex flex-col min-w-[180px]">
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ t('products.search_by_code') }}</label>
<UInput
v-model="searchCode"
:placeholder="t('products.search_code_placeholder')"
@update:model-value="resetPage"
class="dark:text-white text-black"
/>
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ t('products.search_by_code')
}}</label>
<UInput v-model="searchCode" :placeholder="t('products.search_code_placeholder')"
@update:model-value="resetPage" class="dark:text-white text-black" />
</div>
<div class="flex flex-col min-w-[120px]">
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ t('products.price_from') }}</label>
<UInput
v-model="priceFromFilter"
type="number"
:placeholder="t('products.price_from')"
@update:model-value="resetPage"
class="dark:text-white text-black"
/>
<UInput v-model="priceFromFilter" type="number" :placeholder="t('products.price_from')"
@update:model-value="resetPage" class="dark:text-white text-black" />
</div>
<div class="flex flex-col min-w-[120px]">
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ t('products.price_to') }}</label>
<UInput
v-model="priceToFilter"
type="number"
:placeholder="t('products.price_to')"
@update:model-value="resetPage"
class="dark:text-white text-black"
/>
<UInput v-model="priceToFilter" type="number" :placeholder="t('products.price_to')"
@update:model-value="resetPage" class="dark:text-white text-black" />
</div>
<div class="flex items-end">
<button
@click="clearFilters"
class="px-4 py-2 text-sm font-medium text-black dark:text-white bg-gray-200 dark:bg-gray-700 rounded-lg hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors"
>
<button @click="clearFilters"
class="px-4 py-2 text-sm font-medium text-black dark:text-white bg-gray-200 dark:bg-gray-700 rounded-lg hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors">
{{ t('products.clear_filters') }}
</button>
</div>
@@ -254,4 +239,5 @@ function clearFilters() {
</div>
</div>
</div>
</component>
</template>