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

front-styles #44

Merged
yakovenko_arina merged 4 commits from front-styles into main 2026-04-01 07:32:27 +00:00
Conversation 1 Commits 4 Files Changed 11 +183 -163
7 changed files with 183 additions and 163 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit fb4f7048ab - Show all commits

98
bo/src/components/admin/PageProducts.vue
View File

@@ -1,24 +1,10 @@
<template>
<suspense>
<component :is="Default || 'div'">
<div class="container mx-auto mt-20">
<!-- <UNavigationMenu orientation="vertical" :items="listing" class="data-[orientation=vertical]:w-48">
<template #item="{ item, active }">
<div class="flex items-center gap-2 px-3 py-2">
<UIcon name="i-heroicons-book-open" />
<span>{{ item.name }}</span>
</div>
</template>
</UNavigationMenu> -->
<h1 class="text-2xl font-bold mb-6 text-gray-900 dark:text-white">Products</h1>
<div v-if="loading" class="text-center py-8">
<span class="text-gray-600 dark:text-gray-400">Loading products...</span>
</div>
<div v-else-if="error" class="mb-4 p-3 bg-red-100 text-red-700 rounded">
{{ error }}
</div>
<div v-else class="overflow-x-auto">
<div class="flex gap-2">
<!-- <div class="w-64 h-128">
<CategoryMenu />
</div> -->
<CategoryMenuListing />
<UTable :data="productsList" :columns="columns" class="flex-1">
<template #expanded="{ row }">
@@ -27,7 +13,52 @@
}" />
</template>
</UTable>
<div class="container mx-auto mt-20">
<h1 class="text-2xl font-bold mb-6 text-gray-900 dark:text-white">Products</h1>
<div v-if="loading" class="text-center py-8">
<span class="text-gray-600 dark:text-gray-400">Loading products...</span>
</div>
<div v-else-if="error" class="mb-4 p-3 bg-red-100 text-red-700 rounded">
{{ error }}
</div>
<div v-else class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-gray-800">
<tr>
<th
class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
Image</th>
<th
class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
Product Code</th>
<th
class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
Name</th>
<th
class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
Link</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-900 divide-y divide-gray-200 dark:divide-gray-700">
<tr v-for="product in productsList" :key="product.product_id"
class="hover:bg-gray-50 dark:hover:bg-gray-800"
@click="goToProduct(product.product_id)">
<td class="px-6 py-4 whitespace-nowrap">
<img :src="product.image_link" alt="product image"
class="w-16 h-16 object-cover rounded" />
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-white">{{
product.reference }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-white">{{
product.name }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-blue-600 dark:text-blue-400">
{{ product.link_rewrite }}
</td>
</tr>
</tbody>
</table>
<div class="flex justify-center items-center py-8">
<UPagination v-model:page="page" :total="total" :page-size="perPage" />
</div>
@@ -167,7 +198,7 @@ async function fetchProductList() {
if (value) params.append(key, String(value))
})
const url = `/api/v1/restricted/list-products/get-listing?${params}`
const url = `/api/v1/restricted/list/list-products?${params}`
try {
const response = await useFetchJson<ApiResponse>(url)
@@ -314,30 +345,6 @@ const columns: TableColumn<Payment>[] = [
},
cell: ({ row }) => row.getValue('quantity') as number
},
{
accessorKey: 'count',
header: 'Count',
cell: ({ row }) => {
return h(UInputNumber, {
modelValue: selectedCount.value.product_id === row.original.product_id ? selectedCount.value.count : 0,
'onUpdate:modelValue': (val: number) => {
if (val)
selectedCount.value = {
product_id: row.original.product_id,
count: val
}
else {
selectedCount.value = {
product_id: null,
count: 0
}
}
},
min: 0,
max: row.original.quantity
})
}
},
{
accessorKey: 'count',
header: '',
@@ -346,10 +353,9 @@ const columns: TableColumn<Payment>[] = [
onClick: () => {
console.log('Clicked', row.original)
},
color: selectedCount.value.product_id !== row.original.product_id ? 'info' : 'primary',
disabled: selectedCount.value.product_id !== row.original.product_id,
color: 'primary',
variant: 'solid'
}, 'Add to cart')
}, 'Show product')
},
}
]

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

@@ -5,7 +5,8 @@
<div
class="flex items-end justify-between gap-4 mb-6 bg-(--second-light) dark:bg-(--main-dark) border border-(--border-light) dark:border-(--border-dark) p-4 rounded-md">
<div class="flex items-end gap-3">
<USelect v-model="selectedLanguage" :items="availableLangs" variant="outline" class="w-40!" valueKey="iso_code">
<USelect v-model="selectedLanguage" :items="availableLangs" variant="outline" class="w-40!"
valueKey="iso_code">
<template #default="{ modelValue }">
<div class="flex items-center gap-2">
<span class="text-md">{{availableLangs.find(x => x.iso_code == modelValue)?.flag}}</span>
@@ -93,7 +94,8 @@
<UButton v-if="isEditing" @click="saveText" color="neutral" variant="outline" class="p-2.5 cursor-pointer">
<p class="dark:text-white text-black">Save the edited text</p>
</UButton>
<UButton v-if="isEditing" @click="cancelEdit" color="neutral" variant="outline" class="p-2.5 cursor-pointer">
<UButton v-if="isEditing" @click="cancelEdit" color="neutral" variant="outline"
class="p-2.5 cursor-pointer">
Cancel
</UButton>
</div>
@@ -110,10 +112,12 @@
<p class="text-white">Change Text</p>
<UIcon name="material-symbols-light:stylus-note-sharp" class="text-[30px] text-white!" />
</UButton>
<UButton v-if="descriptionEdit.isEditing.value" @click="saveDescription" color="neutral" variant="outline" class="p-2.5 cursor-pointer">
<UButton v-if="descriptionEdit.isEditing.value" @click="saveDescription" color="neutral" variant="outline"
class="p-2.5 cursor-pointer">
<p class="dark:text-white text-black ">Save the edited text</p>
</UButton>
<UButton v-if="descriptionEdit.isEditing.value" @click="cancelDescriptionEdit" color="neutral" variant="outline" class="p-2.5 cursor-pointer">Cancel</UButton>
<UButton v-if="descriptionEdit.isEditing.value" @click="cancelDescriptionEdit" color="neutral"
variant="outline" class="p-2.5 cursor-pointer">Cancel</UButton>
</div>
<div ref="descriptionRef" v-html="productStore.productDescription.description"
class="flex flex-col justify-center dark:text-white text-black">
@@ -142,7 +146,7 @@ const isEditing = ref(false)
const availableLangs = computed(() => langs)
const selectedLanguage = ref('pl')
const selectedLanguage = ref('en')
const currentLangId = ref(2)
const productID = ref<number>(0)
@@ -176,7 +180,7 @@ const translateToSelectedLanguage = async () => {
}
onMounted(async () => {
const id = route.params.id
const id = route.params.product_id
if (id) {
productID.value = Number(id)
await fetchForLanguage(selectedLanguage.value)

2
bo/src/components/customer/PageProducts.vue
View File

@@ -167,7 +167,7 @@ async function fetchProductList() {
if (value) params.append(key, String(value))
})
const url = `/api/v1/restricted/list-products/get-listing?${params}`
const url = `/api/v1/restricted/list/list-products?${params}`
try {
const response = await useFetchJson<ApiResponse>(url)

11
bo/src/router/menu.ts
View File

@@ -1,12 +1,19 @@
import { useFetchJson } from "@/composable/useFetchJson";
import type { MenuItem, Route } from "@/types/menu";
import { ref } from "vue";
import { settings } from "./settings";
const categoryId = ref()
export const getMenu = async () => {
const resp = await useFetchJson<MenuItem>('/api/v1/restricted/menu/get-menu');
if(!categoryId.value){
categoryId.value = settings['app'].category_tree_root_id
}
const resp = await useFetchJson<MenuItem>(`/api/v1/restricted/menu/get-category-tree?root_category_id=${categoryId.value}`);
return resp.items.children
}
export const getRoutes = async () => {
const resp = await useFetchJson<Route[]>('/api/v1/public/menu/get-routes');

2
bo/src/router/settings.ts
View File

@@ -8,4 +8,6 @@ export const settings = reactive({} as Settings)
export async function getSettings() {
const { items } = await useFetchJson<Resp<Settings>>('/api/v1/settings',)
Object.assign(settings, items)
console.log(settings['app'])
}

2
bo/src/stores/product.ts
View File

@@ -34,7 +34,7 @@ export const useProductStore = defineStore('product', () => {
try {
const response = await useFetchJson<ProductDescription>(
`/api/v1/restricted/product-description/get-product-description?productID=${productID}&productLangID=${langId}`
`/api/v1/restricted/product-translation/get-product-description?productID=${productID}&productLangID=${langId}`
)
console.log(response, 'dfsfsdf');
productDescription.value = response.items

1
bo/src/types/settings.d.ts vendored
View File

@@ -7,6 +7,7 @@ export interface Settings {
}
export interface App {
category_tree_root_id: number
name: string
environment: string
base_url: string