Lab 6 MVC + SPA (axios умер, да здравствует axios!)

This commit is contained in:
Данила Мочалов 2023-05-15 23:08:26 +04:00
parent a08e69ee77
commit 7a293630a4
4 changed files with 58 additions and 35 deletions

Binary file not shown.

View File

@ -4,7 +4,6 @@
</div> </div>
<div> <div>
<p class='h4 text-center' v-if="isAuthorized() == true"> <p class='h4 text-center' v-if="isAuthorized() == true">
<router-link to="/profiles" class="text-decoration-none m-3" v-if="isAdminFlag == true">Профили</router-link>
<router-link to="/" class="text-decoration-none m-3">Лента</router-link> <router-link to="/" class="text-decoration-none m-3">Лента</router-link>
<a class="text-blue text-decoration-none" @click="logout">Выход</a> <a class="text-blue text-decoration-none" @click="logout">Выход</a>
</p> </p>

View File

@ -18,6 +18,8 @@
<p>Вы вошли как: {{ selectedProfileLogin }}</p> <p>Вы вошли как: {{ selectedProfileLogin }}</p>
<router-link to="/profiles" class="text-decoration-none m-3" v-if="isAdminFlag == true">Админ-панель</router-link>
<div class='h3 m-3 d-flex justify-content-between text-center mx-auto w-25'> <div class='h3 m-3 d-flex justify-content-between text-center mx-auto w-25'>
Лента Лента
<button type='button' class="btn btn-primary ms-5 mb-3 " data-bs-toggle="modal" data-bs-target="#postCreate"> <button type='button' class="btn btn-primary ms-5 mb-3 " data-bs-toggle="modal" data-bs-target="#postCreate">
@ -126,19 +128,8 @@
<h5 class="modal-title" id="postCreateLabel">Создать пост</h5> <h5 class="modal-title" id="postCreateLabel">Создать пост</h5>
</div> </div>
<div class="modal-body text-center"> <div class="modal-body text-center">
<p>Пользователь:</p> <p>Под именем:</p>
<div class="dropdown"> <p>{{ selectedProfileLogin }}</p>
<button class="btn btn-secondary dropdown-toggle ms-3 mb-3" type="button" data-bs-toggle="dropdown" aria-expanded="false">
{{selectedProfileLogin}}
</button>
<ul class="dropdown-menu" >
<li v-for="profile in profiles">
<a class="dropdown-item" href="#" v-on:click="getSelectedProfile(profile)">
{{ profile['login'] }}
</a>
</li>
</ul>
</div>
<p>Текст поста:</p> <p>Текст поста:</p>
<textarea v-model='textModal' id="modalText" cols="30" rows="1"></textarea> <textarea v-model='textModal' id="modalText" cols="30" rows="1"></textarea>
</div> </div>
@ -158,6 +149,7 @@
<h5 class="modal-title" id="postEditLabel">Редактировать пост</h5> <h5 class="modal-title" id="postEditLabel">Редактировать пост</h5>
</div> </div>
<div class="modal-body text-center"> <div class="modal-body text-center">
<p>Под именем:</p>
<p>{{ selectedProfileLogin }}</p> <p>{{ selectedProfileLogin }}</p>
<p>Текст</p> <p>Текст</p>
<textarea v-model='textModal' id="editModalText" cols="30" rows="1"></textarea> <textarea v-model='textModal' id="editModalText" cols="30" rows="1"></textarea>
@ -183,7 +175,8 @@ export default {
selectedPostText: '', selectedPostText: '',
textModal: '', textModal: '',
selectedCommentId: 0, selectedCommentId: 0,
textFinder: '' textFinder: '',
isAdminFlag: false
} }
}, },
methods: { methods: {
@ -283,12 +276,18 @@ export default {
}, },
async createComment() { async createComment() {
await axios.post('http://localhost:8080/api/1.0/comment/?text=' + this.textModal + '&ownerId=' + this.selectedProfileId + '&postId=' + this.selectedPostId, // await axios.post('http://localhost:8080/api/1.0/comment/?text=' + this.textModal + '&ownerId=' + this.selectedProfileId + '&postId=' + this.selectedPostId,
{ // {
// headers: {
// 'Authorization':'Bearer ' + localStorage.token
// }
// });
await fetch('http://localhost:8080/api/1.0/comment/?text=' + this.textModal + '&ownerId=' + this.selectedProfileId + '&postId=' + this.selectedPostId, {
method: 'POST',
headers: { headers: {
'Authorization': 'Bearer ' + localStorage.token 'Authorization':'Bearer ' + localStorage['token']
} },
}); })
this.refreshList(); this.refreshList();
}, },
async deleteComment(commentId) { async deleteComment(commentId) {
@ -302,12 +301,20 @@ export default {
this.refreshList(); this.refreshList();
}, },
async editComment(){ async editComment(){
await axios.put('http://localhost:8080/api/1.0/comment/' + this.selectedCommentId + '?text=' + this.textModal, // await axios.put('http://localhost:8080/api/1.0/comment/' + this.selectedCommentId + '?text=' + this.textModal,
{ // {
// headers: {
// 'Authorization': 'Bearer ' + localStorage.token
// }
// });
await fetch('http://localhost:8080/api/1.0/comment/' + this.selectedCommentId + '?text=' + this.textModal, {
method: 'PUT',
headers: { headers: {
'Authorization': 'Bearer ' + localStorage.token 'Authorization':'Bearer ' + localStorage['token']
} },
}); })
this.refreshList(); this.refreshList();
}, },
async refreshList(){ async refreshList(){
@ -335,12 +342,20 @@ export default {
}); });
}, },
async createPost() { async createPost() {
const response = await axios.post('http://localhost:8080/api/api/1.0/post/?text=' + this.textModal + '&authorId=' + this.selectedProfileId, console.log('Authorization '+ 'Bearer ' + localStorage['token'])
{ // const response = await axios.post('http://localhost:8080/api/1.0/post/?text=' + this.textModal + '&authorId=' + this.selectedProfileId,
// {
// headers: {
// 'Authorization': 'Bearer ' + localStorage['token']
// }
// });
await fetch('http://localhost:8080/api/1.0/post/?text=' + this.textModal + '&authorId=' + this.selectedProfileId, {
method: 'POST',
headers: { headers: {
'Authorization': 'Bearer ' + localStorage.token 'Authorization':'Bearer ' + localStorage['token']
} },
}); })
this.refreshList(); this.refreshList();
}, },
@ -374,6 +389,19 @@ export default {
) )
} }
var a = await axios.get('http://localhost:8080/api/1.0/profile/role/' + localStorage.token,
{
headers: {
'Authorization': 'Bearer ' + localStorage.token
}
}
)
console.log('role')
console.log(a.data)
if (a.data == 'ADMIN'){
this.isAdminFlag = true
}
const responseProfile = await axios.get('http://localhost:8080/api/1.0/profile/', const responseProfile = await axios.get('http://localhost:8080/api/1.0/profile/',
{ {

View File

@ -7,10 +7,6 @@
<body> <body>
<div layout:fragment="content" class="text-center"> <div layout:fragment="content" class="text-center">
<button class="btn btn-info w-25 mb-3" data-bs-toggle="modal" data-bs-target="#profileCreate">
Регистрация профиля
</button>
<div th:each="profile: ${profiles}" class="mb-2"> <div th:each="profile: ${profiles}" class="mb-2">
<div class="text-center"> <div class="text-center">
<div class="text-start mx-auto w-25 border p-3"> <div class="text-start mx-auto w-25 border p-3">