modified: serv_nginx/bbvue/src/views/News.vue

add checkAuth in onMounted

serv_nginx/bbvue/src/views/News.vue

@@ -32,8 +32,7 @@
           <div class="news-controls">
             <div class="news-filters">
               <button v-for="filter in filters" :key="filter.value"
-                :class="['filter-btn', { 'active': activeFilter === filter.value }]" 
+                :class="['filter-btn', { 'active': activeFilter === filter.value }]" @click="setFilter(filter.value)">
-                @click="setFilter(filter.value)">
                 {{ filter.label }}
               </button>
             </div>
@@ -165,10 +164,9 @@
 
               <!-- Форма добавления комментария -->
               <div v-if="isAuthenticated" class="comment-form">
-                <textarea v-model="newComment" placeholder="Напишите ваш комментарий..." 
+                <textarea v-model="newComment" placeholder="Напишите ваш комментарий..." class="comment-input"
-                          class="comment-input" rows="3"></textarea>
+                  rows="3"></textarea>
-                <button class="btn btn-primary" @click="addComment" 
+                <button class="btn btn-primary" @click="addComment" :disabled="!newComment.trim() || commentLoading">
-                        :disabled="!newComment.trim() || commentLoading">
                   {{ commentLoading ? 'Отправка...' : '💬 Отправить комментарий' }}
                 </button>
               </div>
@@ -190,9 +188,8 @@
                       <span class="author-name">{{ comment.author.first_name }} {{ comment.author.last_name }}</span>
                       <span class="comment-date">{{ formatDate(comment.created_at) }}</span>
                     </div>
-                    <button v-if="isAuthenticated && isCommentAuthor(comment.author_id)" 
+                    <button v-if="isAuthenticated && isCommentAuthor(comment.author_id)" class="btn-delete-comment"
-                            class="btn-delete-comment" @click="deleteComment(comment.id)"
+                      @click="deleteComment(comment.id)" title="Удалить комментарий">
-                            title="Удалить комментарий">
                       🗑️
                     </button>
                   </div>
@@ -219,23 +216,22 @@
           <form @submit.prevent="submitNewsForm" class="news-form">
             <div class="form-group">
               <label>Заголовок *</label>
-              <input v-model="newsForm.title" type="text" required 
+              <input v-model="newsForm.title" type="text" required placeholder="Введите заголовок новости"
-                     placeholder="Введите заголовок новости" class="form-input">
+                class="form-input">
             </div>
 
             <div class="form-group">
               <label>Краткое описание *</label>
               <textarea v-model="newsForm.excerpt" required
-                        placeholder="Краткое описание новости (максимум 500 символов)"
+                placeholder="Краткое описание новости (максимум 500 символов)" class="form-textarea" rows="3"
-                        class="form-textarea" rows="3" maxlength="500"></textarea>
+                maxlength="500"></textarea>
               <div class="char-count">{{ newsForm.excerpt.length }}/500</div>
             </div>
 
             <div class="form-group">
               <label>Содержание *</label>
-              <textarea v-model="newsForm.content" required 
+              <textarea v-model="newsForm.content" required placeholder="Полное содержание новости"
-                        placeholder="Полное содержание новости"
+                class="form-textarea" rows="6"></textarea>
-                        class="form-textarea" rows="6"></textarea>
             </div>
 
             <div class="form-group">
@@ -251,8 +247,7 @@
 
             <div class="form-group">
               <label>Изображение (URL)</label>
-              <input v-model="newsForm.image" type="url" 
+              <input v-model="newsForm.image" type="url" placeholder="https://example.com/image.jpg" class="form-input">
-                     placeholder="https://example.com/image.jpg" class="form-input">
               <small>Оставьте пустым для изображения по умолчанию</small>
             </div>
 
@@ -430,12 +425,36 @@ export default {
       }
     },
 
+    async checkAuth() {
+      try {
+        const token = localStorage.getItem('auth_token')
+        if (token) {
+          try {
+            // Пытаемся получить профиль пользователя для проверки авторизации
+            const response = await apiClient.get('/user/profile')
+            this.isAuthenticated = true
+            this.currentUser = response.data
+          } catch (error) {
+            console.error('Токен невалиден:', error)
+            this.handleAuthError()
+          }
+        } else {
+          this.isAuthenticated = false
+          this.currentUser = null
+        }
+      } catch (error) {
+        console.error('Ошибка проверки авторизации:', error)
+        this.handleAuthError()
+      }
+    },
+
     async submitNewsForm() {
       this.newsLoading = true
       try {
         if (this.editingNews) {
           await apiClient.put(`/news/${this.editingNews.id}`, this.newsForm)
         } else {
+          console.log('News form data:', this.newsForm)
           await apiClient.post('/news', this.newsForm)
         }
 
@@ -549,6 +568,7 @@ export default {
     if (this.isAuthenticated) {
       await this.fetchProfile()
     }
+    this.checkAuth()
   },
   beforeUnmount() {
     document.removeEventListener('keydown', this.handleKeydown)
@@ -573,7 +593,9 @@ export default {
   gap: 0.5rem;
 }
 
-.btn-edit, .btn-delete, .btn-delete-comment {
+.btn-edit,
+.btn-delete,
+.btn-delete-comment {
   background: none;
   border: none;
   padding: 5px;
@@ -588,7 +610,8 @@ export default {
   transform: scale(1.1);
 }
 
-.btn-delete:hover, .btn-delete-comment:hover {
+.btn-delete:hover,
+.btn-delete-comment:hover {
   background: #ffebee;
   transform: scale(1.1);
 }
@@ -602,7 +625,9 @@ export default {
   background: #d32f2f;
 }
 
-.loading-state, .error-state, .empty-state {
+.loading-state,
+.error-state,
+.empty-state {
   text-align: center;
   padding: 3rem;
   color: #666;
@@ -619,8 +644,13 @@ export default {
 }
 
 @keyframes spin {
-  0% { transform: rotate(0deg); }
+  0% {
-  100% { transform: rotate(360deg); }
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
 }
 
 .error-state {
@@ -730,7 +760,9 @@ export default {
   color: #333;
 }
 
-.form-input, .form-textarea, .form-select {
+.form-input,
+.form-textarea,
+.form-select {
   width: 100%;
   padding: 0.75rem;
   border: 2px solid #e9ecef;
@@ -739,7 +771,9 @@ export default {
   font-size: 1rem;
 }
 
-.form-input:focus, .form-textarea:focus, .form-select:focus {
+.form-input:focus,
+.form-textarea:focus,
+.form-select:focus {
   outline: none;
   border-color: #2e8b57;
 }