Мобильная версия

1. Адаптация и разработка мобильного варианта.

front_vue/src/components/TaskPanel/TaskPanel.vue

@@ -4,10 +4,12 @@
     @close="tryClose"
   >
     <template #header>
-      <h2>{{ panelTitle }}</h2>
-      <span v-if="!isNew && card?.dateCreate" class="header-date">
-        Создано: {{ formatDate(card.dateCreate) }}
-      </span>
+      <div class="header-title-block">
+        <h2>{{ panelTitle }}</h2>
+        <span v-if="!isNew && card?.dateCreate" class="header-date">
+          Создано: {{ formatDate(card.dateCreate) }}
+        </span>
+      </div>
       
       <!-- Вкладки (только для существующих задач) -->
       <TabsPanel
@@ -43,7 +45,8 @@
       />
     </template>
 
-    <template #footer>
+    <!-- Footer: скрываем на вкладке комментариев -->
+    <template #footer v-if="activeTab !== 'comments'">
       <div class="footer-left">
         <IconButton 
           v-if="!isNew" 
@@ -146,6 +149,9 @@ import ConfirmDialog from '../ConfirmDialog.vue'
 import TaskEditTab from './TaskEditTab.vue'
 import TaskCommentsTab from './TaskCommentsTab.vue'
 import { taskImageApi, commentImageApi, getFullUrl } from '../../api'
+import { useMobile } from '../../composables/useMobile'
+
+const { isMobile } = useMobile()
 
 const props = defineProps({
   show: Boolean,
@@ -402,7 +408,7 @@ watch(() => props.show, async (newVal) => {
     
     await nextTick()
     editTabRef.value?.saveInitialForm()
-    editTabRef.value?.focusTitle()
+    // Не фокусируем поле автоматически, чтобы не открывалась клавиатура
     refreshIcons()
   }
 })
@@ -412,13 +418,22 @@ onUpdated(refreshIcons)
 </script>
 
 <style scoped>
+.header-title-block {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.header-title-block h2 {
+  margin: 0;
+}
+
 .header-date {
-  font-size: 13px;
+  font-size: 12px;
   color: var(--text-muted);
 }
 
 .header-tabs {
-  margin-left: auto;
   margin-right: 12px;
 }