From 990ff223767e2152ffb7f7da3e2486780ee8f271 Mon Sep 17 00:00:00 2001
From: "p.belezov" <p.belezov@mfc38.ru>
Date: Mon, 13 Jan 2025 15:48:48 +0800
Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B4=D0=B5=D0=BB=D0=B0=D0=BB=20?=
 =?UTF-8?q?=D0=BE=D1=82=D0=BC=D0=B5=D0=BD=D1=83=20=D0=B1=D1=80=D0=BE=D0=BD?=
 =?UTF-8?q?=D0=B8=D1=80=D0=BE=D0=B2=D0=B0=D0=BD=D0=B8=D1=8F,=20=D0=BF?=
 =?UTF-8?q?=D0=BE=D0=B4=D0=BE=D0=B3=D0=BD=D0=B0=D0=BB=20=D0=BF=D0=BE=D0=B4?=
 =?UTF-8?q?=20=D0=BC=D0=BE=D0=B1=D0=B8=D0=BB=D0=BA=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/Http/Controllers/WishesController.php     | 11 +++++
 resources/store/wish.js                       | 19 ++++++++
 resources/views/Public.vue                    | 18 +++++---
 .../views/PublicWishlist/ShowWhishlist.vue    | 29 ++++++++-----
 resources/views/Wishlist/Wishlist.vue         | 43 ++++---------------
 routes/api.php                                |  1 +
 6 files changed, 72 insertions(+), 49 deletions(-)

diff --git a/app/Http/Controllers/WishesController.php b/app/Http/Controllers/WishesController.php
index f7a0828..984ef1b 100644
--- a/app/Http/Controllers/WishesController.php
+++ b/app/Http/Controllers/WishesController.php
@@ -99,4 +99,15 @@ class WishesController extends Controller
         $wish->save();
         return response()->json($wish, 200);
     }
+
+    public function unbook(Request $request)
+    {
+        $request->validate([
+            'id' => 'required|exists:wishes,id'
+        ]);
+        $wish = Wish::find($request->get('id'));
+        $wish->book_user_id = null;
+        $wish->save();
+        return response()->json($wish, 200);
+    }
 }
diff --git a/resources/store/wish.js b/resources/store/wish.js
index 5fcbabe..5291ce0 100644
--- a/resources/store/wish.js
+++ b/resources/store/wish.js
@@ -103,6 +103,25 @@ export const useWishStore = defineStore('wish', {
                 result = error;
             });
             return result;
+        },
+        async unbook(id, token){
+            let result = null;
+            await axios.post(`/api/wish/unbook`,
+                {
+                    id: id
+                },
+                {
+                    headers: {
+                        Authorization: `Bearer ${token}`,
+                        token: token
+                    },
+                }
+            ).then((response)=>{
+                result = response;
+            }).catch((error)=>{
+                result = error;
+            });
+            return result;
         }
     },
 })
diff --git a/resources/views/Public.vue b/resources/views/Public.vue
index b195dc6..1330cbd 100644
--- a/resources/views/Public.vue
+++ b/resources/views/Public.vue
@@ -1,19 +1,27 @@
 <template>
-    <v-card class="bg-gradient" style="height: 100%">
+    <v-card class="bg-gradient" style="height: 100%" :class="isWide ? '' : 'd-flex justify-center align-center'">
         <v-card-text class="d-flex justify-center align-center">
             <v-card class="align-center justify-center h-auto card-bg" :class="isWide ? 'w-66' : 'w-100'">
-                <v-card-title class="d-flex justify-space-between">
-                    <div>
+                <v-card-title class="d-flex justify-space-between" :class="isWide ? '' : 'text-subtitle-1'">
+                    <div v-if="isWide">
                         <span>Добро пожаловать в </span>
                         <span><a href="/" class="link-no-decor">Wishlist</a>,&nbsp;</span>
                         <span v-if="userStore.user !== null">{{ userStore.user['name'] }}</span>
                         <span v-else>Гость</span>
                     </div>
+                    <div v-if="!isWide">
+                        <p>Добро пожаловать в </p>
+                        <p><a href="/" class="link-no-decor">Wishlist</a>, {{ isAuthenticated ? userStore.user['name'] : 'Гость' }}!</p>
+                    </div>
                     <span v-if="isAuthenticated" class="link-no-decor align-end" @click="logout">Выйти</span>
                     <div v-else>
-                        <a class="link-no-decor align-end" @click="showAuthDialog = true">Вход/Регистрация</a>
+                        <div v-if="isWide"><a class="link-no-decor align-end" @click="showAuthDialog = true">Вход/Регистрация</a></div>
+                        <div v-else class="d-flex flex-column justify-center align-end" @click="showAuthDialog = true">
+                            <a class="link-no-decor">Вход/</a>
+                            <a class="link-no-decor">Регистрация</a>
+                        </div>
                     </div>
-                    <v-dialog v-model="showAuthDialog" class="w-66">
+                    <v-dialog v-model="showAuthDialog" :class="isWide ? 'w-66' : 'w-100'">
                         <v-card class="card-bg">
                             <v-card-title class="d-flex justify-end">
                                 <v-icon @click="showAuthDialog = false" class="cursor-pointer" color="white" icon="mdi-close-thick"></v-icon>
diff --git a/resources/views/PublicWishlist/ShowWhishlist.vue b/resources/views/PublicWishlist/ShowWhishlist.vue
index a6691ac..be9ce40 100644
--- a/resources/views/PublicWishlist/ShowWhishlist.vue
+++ b/resources/views/PublicWishlist/ShowWhishlist.vue
@@ -33,6 +33,15 @@ export default {
         closeBookDialog(){
             this.bookConfirmationDialog = false;
         },
+        updateFrontWishes(){
+            this.fetching = true;
+            let urlArray = window.location.href.split('/');
+            let user_id = urlArray[urlArray.length - 1];
+            this.wishStore.getUserWishes(user_id).then((res)=>{
+                this.wishes = res;
+                this.fetching = false;
+            });
+        },
         book(){
             this.bookLoading = true;
             this.wishStore.book(this.bookItemId, this.userStore.user["id"], this.userStore.token).then((response)=>{
@@ -42,18 +51,17 @@ export default {
                     this.bookError = true;
                 } else {
                     this.bookConfirmationDialog = false;
-                    this.fetching = true;
-                    let urlArray = window.location.href.split('/');
-                    let user_id = urlArray[urlArray.length - 1];
-                    this.wishStore.getUserWishes(user_id).then((res)=>{
-                        this.wishes = res;
-                        this.fetching = false;
-                    });
+                    this.updateFrontWishes();
                 }
                 this.bookLoading = false;
             }).catch(()=>{
                 this.bookLoading = false;
             });
+        },
+        unbook(id){
+            this.wishStore.unbook(id, this.userStore.token).then(()=>{
+                this.updateFrontWishes();
+            });
         }
     },
     mounted() {
@@ -101,7 +109,8 @@ export default {
                         <v-btn v-if="isAuthenticated && !isSameUser" @click="bookDialog(wish['id'], wish['name'])">Забронировать</v-btn>
                         <span v-else>Нет</span>
                     </span>
-                    <span v-else><v-icon color="green" icon="mdi-check-bold"></v-icon></span>
+                    <span v-else>Да <v-icon @click="unbook(wish['id'])" v-if="isAuthenticated && userStore.user['id'] == wish['book_user']['id']" class="cursor-pointer" icon="mdi-close-thick" color="red"></v-icon></span>
+<!--                    <span v-else><v-icon color="green" icon="mdi-check-bold"></v-icon></span>-->
                 </td>
             </tr>
         </tbody>
@@ -132,10 +141,10 @@ export default {
                 <v-label class="mr-3 ml-5 text-body-1">Цена: {{ wish['price'] }}₽</v-label>
                 <v-label class="mr-3 ml-5 text-body-1">Забронировано:&nbsp;
                     <span v-if="wish['book_user'] === null">
-                        <v-btn v-if="isAuthenticated && !isSameUser" @click="bookDialog(wish['id'], wish['name'])">Забронировать</v-btn>
+                        <v-btn v-if="isAuthenticated && !isSameUser" @click="bookDialog(wish['id'], wish['name'])" :size="isWide ? '' : 'small'">Забронировать</v-btn>
                         <span v-else>Нет</span>
                     </span>
-                    <span v-else> Да</span>
+                    <span v-else> Да <v-icon @click="unbook(wish['id'])" v-if="isAuthenticated && userStore.user['id'] == wish['book_user']['id']" class="cursor-pointer" icon="mdi-close-thick" color="red"></v-icon></span>
                 </v-label>
             </div>
         </div>
diff --git a/resources/views/Wishlist/Wishlist.vue b/resources/views/Wishlist/Wishlist.vue
index beb2867..4e0f00d 100644
--- a/resources/views/Wishlist/Wishlist.vue
+++ b/resources/views/Wishlist/Wishlist.vue
@@ -60,6 +60,11 @@ export default {
         copyLink(){
             navigator.clipboard.writeText(this.wishlistLink);
             this.snackbar = true;
+        },
+        unbook(id){
+            this.wishStore.unbook(id, this.userStore.token).then(()=>{
+                this.updateFrontWishes();
+            });
         }
     }
 }
@@ -96,7 +101,7 @@ export default {
                     <td>{{ wish['name'] }}</td>
                     <td>{{ wish['price'] }}</td>
                     <td><a target="_blank" :href="wish['url']">{{ wish['url'] }}</a></td>
-                    <td>{{ wish['book_user'] === null ? 'Нет' : wish['book_user']['name'] }}</td>
+                    <td>{{ wish['book_user'] === null ? 'Нет' : wish['book_user']['name'] }}<v-icon v-if="wish['book_user'] !== null" @click="unbook(wish['id'])" class="cursor-pointer" icon="mdi-close-thick" color="red"></v-icon></td>
                     <td><v-icon @click="editWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-pencil"></v-icon></td>
                     <td><v-icon @click="deleteWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-trash-can"></v-icon></td>
                 </tr>
@@ -124,7 +129,9 @@ export default {
                 </div>
                 <div class="d-flex flex-column">
                     <v-label class="mr-3 ml-5 text-body-1">Цена: {{ wish['price'] }}₽</v-label>
-                    <v-label class="mr-3 ml-5 text-body-1">Забронировано: {{ wish['book_user'] === null ? 'Нет' : wish['book_user']['name'] }}</v-label>
+                    <v-label class="mr-3 ml-5 text-body-1">Забронировано: {{ wish['book_user'] === null ? 'Нет' : wish['book_user']['name'] }}
+                        <v-icon v-if="wish['book_user'] !== null" @click="unbook(wish['id'])" class="cursor-pointer" icon="mdi-close-thick" color="red"></v-icon>
+                    </v-label>
                 </div>
             </div>
             <div class="w-100 mt-3">
@@ -140,38 +147,6 @@ export default {
                 <DeleteWish :dialogDelete="dialogDeleteClose" :updateFrontWishes="updateFrontWishes" :wish_id="wishToDelete"/>
             </v-dialog>
         </div>
-<!--        <v-table v-if="!fetching && !isWide" class="card-bg w-100 h-auto mt-5 pa-3">-->
-<!--            <thead>-->
-<!--                <tr>-->
-<!--                    <th class="text-subtitle-1">Наименование</th>-->
-<!--                    <th class="text-subtitle-1">Цена</th>-->
-<!--                    <th class="text-subtitle-1">Забронировано</th>-->
-<!--                    <th class="text-subtitle-1"></th>-->
-<!--                    <th class="text-subtitle-1"></th>-->
-<!--                </tr>-->
-<!--            </thead>-->
-<!--            <tbody>-->
-<!--                <tr v-for="wish in wishesList">-->
-<!--                    <td><a target="_blank" :href="wish['url']">{{ wish['name'] }}</a></td>-->
-<!--                    <td>{{ wish['price'] }}</td>-->
-<!--                    <td>{{ wish['book_user'] === null ? 'Нет' : wish['book_user']['name'] }}</td>-->
-<!--                    <td><v-icon @click="editWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-pencil"></v-icon></td>-->
-<!--                    <td><v-icon @click="deleteWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-trash-can"></v-icon></td>-->
-<!--                </tr>-->
-<!--                <tr class="text-center">-->
-<!--                    <td colspan="6"><v-btn @click="dialogCreate = true" color="#212022" elevation="0" block><v-icon class="cursor-pointer" icon="mdi-plus-thick"></v-icon></v-btn></td>-->
-<!--                </tr>-->
-<!--            </tbody>-->
-<!--            <v-dialog v-model="dialogCreate" :class="isWide ? 'w-66' : 'w-100'">-->
-<!--                <CreateWish :dialogCreate="dialogCreateClose" :updateFrontWishes="updateFrontWishes"/>-->
-<!--            </v-dialog>-->
-<!--            <v-dialog v-model="dialogEdit" :class="isWide ? 'w-66' : 'w-100'">-->
-<!--                <EditWish :dialogEdit="dialogEditClose" :updateFrontWishes="updateFrontWishes" :wish_id="wishToEditId"/>-->
-<!--            </v-dialog>-->
-<!--            <v-dialog v-model="dialogDelete" :class="isWide ? 'w-66' : 'w-100'">-->
-<!--                <DeleteWish :dialogDelete="dialogDeleteClose" :updateFrontWishes="updateFrontWishes" :wish_id="wishToDelete"/>-->
-<!--            </v-dialog>-->
-<!--        </v-table>-->
     </div>
 </template>
 
diff --git a/routes/api.php b/routes/api.php
index 95e146d..05b25f9 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -39,5 +39,6 @@ Route::group(['prefix' => 'wish'], function () {
         Route::post('destroy', [WishesController::class, 'destroy']);
         Route::get('by_id/{id}', [WishesController::class, 'getWishById']);
         Route::post('book', [WishesController::class, 'book']);
+        Route::post('unbook', [WishesController::class, 'unbook']);
     });
 });