kin: KIN-108-frontend_dev

web/frontend/src/views/ChatView.vue

@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import { ref, watch, nextTick, onUnmounted } from 'vue'
 import { useRouter } from 'vue-router'
+import { useI18n } from 'vue-i18n'
 import { api, ApiError, type ChatMessage } from '../api'
 import Badge from '../components/Badge.vue'
 
 const props = defineProps<{ projectId: string }>()
 const router = useRouter()
+const { t, locale } = useI18n()
 
 const messages = ref<ChatMessage[]>([])
 const input = ref('')
@@ -43,9 +45,9 @@ function checkAndPoll() {
       if (!hasRunningTasks(updated)) stopPoll()
     } catch (e: any) {
       consecutiveErrors.value++
-      console.warn(`[polling] ошибка #${consecutiveErrors.value}:`, e)
+      console.warn('[polling] error #' + consecutiveErrors.value + ':', e)
       if (consecutiveErrors.value >= 3) {
-        error.value = 'Сервер недоступен. Проверьте подключение.'
+        error.value = t('chat.server_unavailable')
         stopPoll()
       }
     }
@@ -134,7 +136,7 @@ function taskStatusColor(status: string): string {
 }
 
 function formatTime(dt: string) {
-  return new Date(dt).toLocaleTimeString('ru-RU', { hour: '2-digit', minute: '2-digit' })
+  return new Date(dt).toLocaleTimeString(locale.value === 'ru' ? 'ru-RU' : 'en-US', { hour: '2-digit', minute: '2-digit' })
 }
 </script>
 
@@ -145,12 +147,12 @@ function formatTime(dt: string) {
       <router-link
         :to="`/project/${projectId}`"
         class="text-gray-400 hover:text-gray-200 text-sm no-underline"
-      >← Проект</router-link>
+      >{{ t('chat.back_to_project') }}</router-link>
       <span class="text-gray-600">|</span>
       <h1 class="text-base font-semibold text-gray-100">
         {{ projectName || projectId }}
       </h1>
-      <span class="text-xs text-gray-500 ml-1">— чат</span>
+      <span class="text-xs text-gray-500 ml-1">{{ t('chat.chat_label') }}</span>
     </div>
 
     <!-- Error -->
@@ -160,7 +162,7 @@ function formatTime(dt: string) {
 
     <!-- Loading -->
     <div v-if="loading" class="flex-1 flex items-center justify-center">
-      <span class="text-gray-500 text-sm">Загрузка...</span>
+      <span class="text-gray-500 text-sm">{{ t('chat.loading') }}</span>
     </div>
 
     <!-- Messages -->
@@ -170,7 +172,7 @@ function formatTime(dt: string) {
       class="flex-1 overflow-y-auto py-4 flex flex-col gap-3 min-h-0"
     >
       <div v-if="messages.length === 0" class="text-center text-gray-500 text-sm mt-8">
-        Опишите задачу или спросите о статусе проекта
+        {{ t('chat.empty_hint') }}
       </div>
 
       <div
@@ -209,7 +211,7 @@ function formatTime(dt: string) {
       <textarea
         v-model="input"
         :disabled="sending || loading"
-        placeholder="Опишите задачу или вопрос... (Enter — отправить, Shift+Enter — перенос)"
+        :placeholder="t('chat.input_placeholder')"
         rows="2"
         class="flex-1 bg-gray-800/60 border border-gray-700 rounded-xl px-4 py-2.5 text-sm text-gray-100 placeholder-gray-500 resize-none focus:outline-none focus:border-indigo-600 disabled:opacity-50"
         @keydown="onKeydown"
@@ -219,7 +221,7 @@ function formatTime(dt: string) {
         class="px-4 py-2.5 bg-indigo-600 hover:bg-indigo-500 disabled:opacity-40 disabled:cursor-not-allowed text-white text-sm rounded-xl font-medium transition-colors"
         @click="send"
       >
-        {{ sending ? '...' : 'Отправить' }}
+        {{ sending ? t('chat.sending') : t('chat.send') }}
       </button>
     </div>
   </div>