toolbar fix and wishlist image notify
This commit is contained in:
@@ -38,9 +38,9 @@
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-2 p-2">
|
||||
<router-link to="/transactions" class="items-center flex flex-col gap-2">
|
||||
<router-link to="/wishlists" class="items-center flex flex-col gap-2">
|
||||
<i class="pi pi-star text-2xl" style="font-size: 1rem"></i>
|
||||
<p>Транзакции</p>
|
||||
<p>Вишлисты</p>
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
@@ -50,58 +50,64 @@
|
||||
<p>Настройки</p>
|
||||
</router-link>
|
||||
</div>
|
||||
<div class=" flex-col gap-2 p-2 flex">
|
||||
<button @click="router.go(0)" class="items-center flex flex-col gap-2">
|
||||
<i class="pi pi-refresh text-2xl" style="font-size: 1rem"></i>
|
||||
<p>Обновить</p>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Создать с подменю -->
|
||||
<div class="relative flex-col gap-2 p-2 items-center hidden sm:flex" @click="showSubmenu = !showSubmenu"
|
||||
@mouseenter="showSubmenu = true" @mouseleave="showSubmenu = false">
|
||||
<!-- <router-link to="/transactions/create" class="items-center flex flex-col gap-2">-->
|
||||
<i class="pi pi-cog text-2xl" style="font-size: 1rem"></i>
|
||||
<p>Создать</p>
|
||||
<!-- </router-link>-->
|
||||
<!-- <div class="relative flex-col gap-2 p-2 items-center hidden sm:flex" @click="showSubmenu = !showSubmenu"-->
|
||||
<!-- @mouseenter="showSubmenu = true" @mouseleave="showSubmenu = false">-->
|
||||
<!-- <!– <router-link to="/transactions/create" class="items-center flex flex-col gap-2">–>-->
|
||||
<!-- <i class="pi pi-cog text-2xl" style="font-size: 1rem"></i>-->
|
||||
<!-- <p>Создать</p>-->
|
||||
<!-- <!– </router-link>–>-->
|
||||
|
||||
<!-- Подменю для Создать -->
|
||||
<div v-if="showSubmenu" class="absolute bottom-full right-0 mb-2 w-48 p-2 bg-white shadow-lg rounded-lg z-50">
|
||||
<div class="flex flex-col gap-2 items-start">
|
||||
<button @click="openDrawer('INSTANT')" class="hover:bg-gray-100 p-2 rounded-lg">
|
||||
<p>Создать текущую</p>
|
||||
</button>
|
||||
<button @click="openDrawer('PLANNED', 'INCOME')" class="hover:bg-gray-100 p-2 rounded-lg">
|
||||
<p> Создать плановый расход</p>
|
||||
</button>
|
||||
<button @click=" openDrawer('PLANNED', 'EXPENSE')" class="hover:bg-gray-100 p-2 rounded-lg">
|
||||
Создать плановое поступление
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative flex-col gap-2 p-2 items-center flex sm:hidden" @click="showSubmenu = !showSubmenu"
|
||||
@mouseenter="showSubmenu = true" @mouseleave="showSubmenu = false">
|
||||
<!-- <router-link to="/transactions/create" class="items-center flex flex-col gap-2">-->
|
||||
<i class="pi pi-bars text-2xl" style="font-size: 1rem"></i>
|
||||
<p>Меню</p>
|
||||
<!-- </router-link>-->
|
||||
<!-- <!– Подменю для Создать –>-->
|
||||
<!-- <div v-if="showSubmenu" class="absolute bottom-full right-0 mb-2 w-48 p-2 bg-white shadow-lg rounded-lg z-50">-->
|
||||
<!-- <div class="flex flex-col gap-2 items-start">-->
|
||||
<!-- <button @click="openDrawer('INSTANT')" class="hover:bg-gray-100 p-2 rounded-lg">-->
|
||||
<!-- <p>Создать текущую</p>-->
|
||||
<!-- </button>-->
|
||||
<!-- <button @click="openDrawer('PLANNED', 'INCOME')" class="hover:bg-gray-100 p-2 rounded-lg">-->
|
||||
<!-- <p> Создать плановый расход</p>-->
|
||||
<!-- </button>-->
|
||||
<!-- <button @click=" openDrawer('PLANNED', 'EXPENSE')" class="hover:bg-gray-100 p-2 rounded-lg">-->
|
||||
<!-- Создать плановое поступление-->
|
||||
<!-- </button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="relative flex-col gap-2 p-2 items-center flex sm:hidden" @click="showSubmenu = !showSubmenu"-->
|
||||
<!-- @mouseenter="showSubmenu = true" @mouseleave="showSubmenu = false">-->
|
||||
<!-- <!– <router-link to="/transactions/create" class="items-center flex flex-col gap-2">–>-->
|
||||
<!-- <i class="pi pi-bars text-2xl" style="font-size: 1rem"></i>-->
|
||||
<!-- <p>Меню</p>-->
|
||||
<!-- <!– </router-link>–>-->
|
||||
|
||||
<!-- Подменю для Создать -->
|
||||
<div v-if="showSubmenu" class="absolute bottom-full right-0 w-48 p-2 bg-white shadow-lg rounded-lg z-50">
|
||||
<div class="flex flex-col-reverse gap-2 items-start">
|
||||
<button @click="openDrawer('INSTANT')" class="hover:bg-gray-100 p-2 rounded-lg">
|
||||
<p>Создать текущую</p>
|
||||
</button>
|
||||
<button @click="openDrawer('PLANNED', 'EXPENSE')" class="hover:bg-gray-100 p-2 rounded-lg">
|
||||
<p class="text-left"> Создать плановый расход</p>
|
||||
</button>
|
||||
<button @click=" openDrawer('PLANNED', 'INCOME')" class="hover:bg-gray-100 p-2 rounded-lg">
|
||||
<p class="text-left">Создать плановое поступление</p>
|
||||
</button>
|
||||
<router-link to="/settings" class="items-center flex flex-col gap-2 p-2">
|
||||
<!-- <i class="pi pi-check text-2xl" style="font-size: 1.5rem"></i>-->
|
||||
<p>Настройки</p>
|
||||
</router-link>
|
||||
<button @click="refreshPage"><p class="text-left"><i class="pi pi-refresh"/>Обновить страницу</p></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <!– Подменю для Создать –>-->
|
||||
<!-- <div v-if="showSubmenu" class="absolute bottom-full right-0 w-48 p-2 bg-white shadow-lg rounded-lg z-50">-->
|
||||
<!-- <div class="flex flex-col-reverse gap-2 items-start">-->
|
||||
<!-- <button @click="openDrawer('INSTANT')" class="hover:bg-gray-100 p-2 rounded-lg">-->
|
||||
<!-- <p>Создать текущую</p>-->
|
||||
<!-- </button>-->
|
||||
<!-- <button @click="openDrawer('PLANNED', 'EXPENSE')" class="hover:bg-gray-100 p-2 rounded-lg">-->
|
||||
<!-- <p class="text-left"> Создать плановый расход</p>-->
|
||||
<!-- </button>-->
|
||||
<!-- <button @click=" openDrawer('PLANNED', 'INCOME')" class="hover:bg-gray-100 p-2 rounded-lg">-->
|
||||
<!-- <p class="text-left">Создать плановое поступление</p>-->
|
||||
<!-- </button>-->
|
||||
<!-- <router-link to="/settings" class="items-center flex flex-col gap-2 p-2">-->
|
||||
<!-- <!– <i class="pi pi-check text-2xl" style="font-size: 1.5rem"></i>–>-->
|
||||
<!-- <p>Настройки</p>-->
|
||||
<!-- </router-link>-->
|
||||
<!-- <button @click="refreshPage"><p class="text-left"><i class="pi pi-refresh"/>Обновить страницу</p></button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
|
||||
@@ -114,6 +120,9 @@ import Button from 'primevue/button';
|
||||
import {TransactionType} from "@/models/Transaction";
|
||||
import {CategoryType} from "@/models/Category";
|
||||
import {useDrawerStore} from "@/stores/drawerStore";
|
||||
import {useRoute, useRouter} from "vue-router";
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
|
||||
const showSubmenu = ref(false);
|
||||
|
||||
|
||||
@@ -157,31 +157,38 @@ onMounted(async () => {
|
||||
<div class="grid grid-cols-1 lg:grid-cols-4 gap-2">
|
||||
<div v-for="item in wishlist.items"
|
||||
class=" bg-white flex flex-col p-4 flex-shrink-0 gap-4 shadow-md rounded-lg max-w-128 h-full">
|
||||
<div class="flex flex-col w-full justify-center gap-2">
|
||||
<div v-if="item.images.length > 0 && selectedImage.get(item.id)" class="flex flex-col w-full h-full justify-between">
|
||||
<div v-if="item.images.length > 0 && selectedImage.get(item.id)" class="flex w-full justify-center">
|
||||
<Image
|
||||
:src="selectedImage.get(item.id).startsWith('http') ? selectedImage.get(item.id) : apiClient.defaults.baseURL+'/'+selectedImage.get(item.id) "
|
||||
alt="Image"
|
||||
width="128" height="128" show="show" preview
|
||||
imageClass="h-64 w-64 object-cover items-center justify-center justify-items-center"/>
|
||||
</div>
|
||||
<div class="flex flex-row !h-12 gap-2">
|
||||
|
||||
<div v-for="(image, index) in item.images" class="group relative h-12 w-12 rounded-lg shadow-md ">
|
||||
<button @click="selectedImage.set(item.id, image)">
|
||||
<Image
|
||||
:src="image.startsWith('http') ? image : apiClient.defaults.baseURL+'/'+image " alt="Image"
|
||||
width="48" height="48" show="show"
|
||||
imageClass="w-12 h-12 object-cover"/>
|
||||
</button>
|
||||
<div class="flex flex-col w-full justify-center gap-2">
|
||||
|
||||
<div v-if="item.images.length > 0 && selectedImage.get(item.id)"
|
||||
class="flex flex-col w-full h-full justify-between gap-2">
|
||||
<i class="pi pi-info-circle w-full text-end " style="font-size: 0.7rem"
|
||||
v-tooltip="'Некоторые изображения могут быть недоступны при включенном VPN'" tabindex="1"/>
|
||||
<div v-if="item.images.length > 0 && selectedImage.get(item.id)" class="flex w-full justify-center">
|
||||
<Image
|
||||
:src="selectedImage.get(item.id).startsWith('http') ? selectedImage.get(item.id) : apiClient.defaults.baseURL+'/'+selectedImage.get(item.id) "
|
||||
alt="Image"
|
||||
width="128" height="128" show="show" preview
|
||||
imageClass="h-64 w-64 object-cover items-center justify-center justify-items-center"/>
|
||||
|
||||
</div>
|
||||
<div class="flex flex-row !h-12 gap-2">
|
||||
|
||||
<div v-for="(image, index) in item.images" class="group relative h-12 w-12 rounded-lg shadow-md ">
|
||||
<button @click="selectedImage.set(item.id, image)">
|
||||
<Image
|
||||
:src="image.startsWith('http') ? image : apiClient.defaults.baseURL+'/'+image " alt="Image"
|
||||
width="48" height="48" show="show"
|
||||
imageClass="w-12 h-12 object-cover"/>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="min-h-[304px] flex flex-col items-center w-full justify-center gap-2 bg-gray-100 rounded-lg max-w-128 h-full">
|
||||
<div v-else
|
||||
class="min-h-[304px] flex flex-col items-center w-full justify-center gap-2 bg-gray-100 rounded-lg max-w-128 h-full">
|
||||
<i class="pi pi-images !text-gray-400 z-50" style="font-size: 8rem"/>
|
||||
<span class="text-lg font-bold text-center text-gray-400">Изображение пока не загружено</span>
|
||||
|
||||
|
||||
@@ -281,6 +281,10 @@ onMounted(async () => {
|
||||
<label for="link">Ссылка</label>
|
||||
<InputText id="link" v-model="fileUploadLink" class="w-full"/>
|
||||
</FloatLabel>
|
||||
<div class="bg-orange-200 border-1 border-orange-500 rounded-l p-2 flex flex-row items-center gap-2">
|
||||
<i class="pi pi-exclamation-circle text-orange-500" style="font-size: 1.5rem;"/>
|
||||
<span class="text-orange-700 font-semibold">Некоторые изображения, полученные по ссылке могут быть недоступны при VPN или без VPN!</span>
|
||||
</div>
|
||||
<div class="flex justify-center">
|
||||
<Image v-if="fileUploadLink" :src="fileUploadLink" width="240" preview class="w-fit"/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user