add tabs

2024-12-06 21:20:27 +02:00
parent 58a5c378ca
commit ef977f5742
17 changed files with 542 additions and 444 deletions
@@ -1,52 +1,48 @@
 <template>
-  <MetaHead>
-    <title>Создание QR-кода — НаСвязи</title>
-    <meta
-      name="description"
-      content="Создайте свой QR-код для безопасного и конфиденциального взаимодействия"
-    />
-  </MetaHead>
+  <LayoutWithTabs>
+    <MetaHead>
+      <title>Создание QR-кода — НаСвязи</title>
+      <meta
+        name="description"
+        content="Создайте свой QR-код для безопасного и конфиденциального взаимодействия"
+      />
+    </MetaHead>

-  <div class="max-w-prose mx-auto py-6 px-4 md:px-6">
-    <section class="content">
-      <div class="max-w-prose mx-auto py-8">
-        <CreateSectionManager
-          :placement="placement"
-          :selectedActions="selectedActions"
-          :messageDeliveryMethod="messageDeliveryMethod"
-        >
-          <template #placement>
-            <CreatePlacementSection v-model="placement" />
-          </template>
+    <CreateSectionManager
+      :placement="placement"
+      :selectedActions="selectedActions"
+      :messageDeliveryMethod="messageDeliveryMethod"
+    >
+      <template #placement>
+        <CreatePlacementSection v-model="placement" />
+      </template>

-          <template #actions>
-            <CreateActionsSection v-model="selectedActions" />
-          </template>
+      <template #actions>
+        <CreateActionsSection v-model="selectedActions" />
+      </template>

-          <template #delivery>
-            <CreateMessageDeliveryMethodSection v-model="messageDeliveryMethod" />
-          </template>
+      <template #delivery>
+        <CreateMessageDeliveryMethodSection v-model="messageDeliveryMethod" />
+      </template>

-          <template #messages>
-            <CreatePredefinedMessagesSection :placement v-model="messages" />
-          </template>
+      <template #messages>
+        <CreatePredefinedMessagesSection :placement v-model="messages" />
+      </template>

-          <template #summary>
-            <CreateSummarySection
-              v-model:name="name"
-              buttonLabel="Создать QR‑код"
-              :isPending
-              @nextStep="createQrCode"
-            />
-          </template>
-        </CreateSectionManager>
+      <template #summary>
+        <CreateSummarySection
+          v-model:name="name"
+          buttonLabel="Создать QR‑код"
+          :isPending
+          @nextStep="createQrCode"
+        />
+      </template>
+    </CreateSectionManager>

-        <p v-if="isError" class="text-red-500 mt-4">Ошибка создания QR‑кода: {{ error }}</p>
+    <p v-if="isError" class="text-red-500 mt-4">Ошибка создания QR‑кода: {{ error }}</p>

-        <div class="h-[30dvh] md:h-[10dvh] overflow-hidden"></div>
-      </div>
-    </section>
-  </div>
+    <div class="h-[30dvh] md:h-[10dvh] overflow-hidden"></div>
+  </LayoutWithTabs>
 </template>

 <script setup lang="ts">