Merge branch 'front-styles' of ssh://git.ma-al.com:8822/goc_daniel/b2b into translate

This commit is contained in:
2026-04-02 08:56:55 +02:00
3 changed files with 22 additions and 59 deletions

1
bo/components.d.ts vendored
View File

@@ -40,6 +40,7 @@ declare module 'vue' {
TopBar: typeof import('./src/components/TopBar.vue')['default']
TopBarLogin: typeof import('./src/components/TopBarLogin.vue')['default']
UAlert: typeof import('./node_modules/@nuxt/ui/dist/runtime/components/Alert.vue')['default']
UAvatar: typeof import('./node_modules/@nuxt/ui/dist/runtime/components/Avatar.vue')['default']
UButton: typeof import('./node_modules/@nuxt/ui/dist/runtime/components/Button.vue')['default']
UCard: typeof import('./node_modules/@nuxt/ui/dist/runtime/components/Card.vue')['default']
UCheckbox: typeof import('./node_modules/@nuxt/ui/dist/runtime/components/Checkbox.vue')['default']

View File

@@ -3,59 +3,21 @@
<p class="cursor-pointer" @click="backFromProduct()">Back to products</p>
<div class="container my-10 mx-auto ">
<div
class=" gap-4 mb-6 bg-(--second-light) dark:bg-(--main-dark) border border-(--border-light) dark:border-(--border-dark) p-4 rounded-md">
<div v-if="!isShowProductView" class="flex items-end justify-between">
<div class="flex items-center gap-3" v-if="!isTranslations">
<p class="text-red-500 text-md">Translate from Polish to</p>
<USelect v-model="toLangId" :items="availableLangs" variant="outline" class="w-40!" valueKey="id">
<template #default="{ modelValue }">
<div class="flex items-center gap-2">
<span v-if="!modelValue" class="text-gray-400">
Select language
</span>
<template v-else>
<span class="text-md">{{availableLangs.find(x => x.id === modelValue)?.flag}}</span>
<span class="font-medium dark:text-white text-black">
{{availableLangs.find(x => x.id === modelValue)?.name}}
</span>
</template>
</div>
</template>
<template #item-leading="{ item }">
<div class="flex items-center rounded-md cursor-pointer transition-colors">
<span class="text-md">{{ item.flag }}</span>
<span class="ml-2 dark:text-white text-black font-medium">{{ item.name }}</span>
</div>
</template>
</USelect>
</div>
<div class="flex gap-3 items-end justify-end">
<UButton @click="() => {
fetchForLanguage(toLangId)
isShowProductView = true
}" color="primary" v-if="isTranslations === false"
class="text-white bg-(--accent-blue-light) dark:bg-(--accent-blue-dark) px-12!">
Show product
</UButton>
<UButton @click="translateToSelectedLanguage" color="primary" :loading="translating"
v-if="isTranslations === false"
class="text-white bg-(--accent-blue-light) dark:bg-(--accent-blue-dark) px-12!">
Translate
</UButton>
<div v-else class="flex gap-3 items-end justify-end">
<UButton @click="() => {
toLangId = settingStore.shopDefaultLanguage
isTranslations = false
}" color="primary" class="text-white bg-(--accent-blue-light) dark:bg-(--accent-blue-dark) px-12!">
Cancel
</UButton>
<UButton color="primary" @click="saveDescription"
class="text-white bg-(--accent-blue-light) dark:bg-(--accent-blue-dark) px-12!">
Save
</UButton>
</div>
</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-center gap-3" v-if="!isTranslations">
<p class="text-red-500 text-md whitespace-nowrap">Translate from Polish to</p>
<USelect v-model="toLangId" :items="availableLangs" value-key="id" label-key="name"
placeholder="Select language" class="w-48">
<template #selected="{ modelValue }">
{{ modelValue }}
</template>
<template #item-label="{ item }">
<div class="flex items-center gap-2">
<span>{{ item.flag }}</span>
<span>{{ item.name }}</span>
</div>
</template>
</USelect>
</div>
<div v-else>
<UButton @click="isShowProductView = false" color="primary"
@@ -201,7 +163,7 @@ const settingStore = useSettingsStore()
const productStore = useProductStore()
const isTranslations = ref(false)
const toLangId = ref(settingStore.shopDefaultLanguage)
const toLangId = ref(null)
const availableLangs = computed(() => langs.filter(item => item.id !== settingStore.shopDefaultLanguage))
const productID = ref<number>(0)
@@ -232,8 +194,8 @@ const translateToSelectedLanguage = async () => {
}
}
const fetchForLanguage = async (langId: number) => {
if (langId && productID.value) {
const fetchForLanguage = async (langId: number | null) => {
if (productID.value) {
await productStore.getProductDescription(langId, productID.value)
}
}

View File

@@ -29,12 +29,12 @@ export const useProductStore = defineStore('product', () => {
const error = ref<string | null>(null)
const productDescription = ref()
async function getProductDescription(langId: number, productID: number) {
async function getProductDescription(langId: number | null, productID: number) {
loading.value = true
error.value = null
try {
const response = await useFetchJson<ProductDescription>(
`/api/v1/restricted/product-translation/get-product-description?productID=${productID}&productLangID=${langId}`
`/api/v1/restricted/product-translation/get-product-description?productID=${productID}&productLangID=${langId ? langId : settingStore.shopDefaultLanguage}`
)
productDescription.value = response.items