Доделал отмену бронирования, подогнал под мобилки

This commit is contained in:
p.belezov 2025-01-13 15:48:48 +08:00
parent 73f77d58f8
commit 990ff22376
6 changed files with 72 additions and 49 deletions

View File

@ -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);
}
}

View File

@ -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;
}
},
})

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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']);
});
});