Просмотр исходного кода

feat: add New Order button to user orders page

unknown 2 месяцев назад
Родитель
Сommit
51a40fd7d0
3 измененных файлов с 25 добавлено и 5 удалено
  1. 6 0
      src/locales/master_user/orders.json
  2. 6 0
      src/locales/translations.user.json
  3. 13 5
      src/pages/Orders.vue

+ 6 - 0
src/locales/master_user/orders.json

@@ -50,6 +50,12 @@
       "ru": "Загрузка истории заказов...",
       "ru": "Загрузка истории заказов...",
       "ua": "Завантаження історії замовлень..."
       "ua": "Завантаження історії замовлень..."
     },
     },
+    "newOrder": {
+      "en": "New Order",
+      "me": "Nova narudžba",
+      "ru": "Новый заказ",
+      "ua": "Нове замовлення"
+    },
     "noOrders": {
     "noOrders": {
       "en": "No orders yet",
       "en": "No orders yet",
       "me": "Još nema narudžbi",
       "me": "Još nema narudžbi",

+ 6 - 0
src/locales/translations.user.json

@@ -2542,6 +2542,12 @@
       "ru": "Загрузка истории заказов...",
       "ru": "Загрузка истории заказов...",
       "ua": "Завантаження історії замовлень..."
       "ua": "Завантаження історії замовлень..."
     },
     },
+    "newOrder": {
+      "en": "New Order",
+      "me": "Nova narudžba",
+      "ru": "Новый заказ",
+      "ua": "Нове замовлення"
+    },
     "noOrders": {
     "noOrders": {
       "en": "No orders yet",
       "en": "No orders yet",
       "me": "Još nema narudžbi",
       "me": "Još nema narudžbi",

+ 13 - 5
src/pages/Orders.vue

@@ -7,10 +7,18 @@
           <RouterLink to="/" class="inline-flex items-center text-sm text-muted-foreground hover:text-primary transition-colors mb-6 group">
           <RouterLink to="/" class="inline-flex items-center text-sm text-muted-foreground hover:text-primary transition-colors mb-6 group">
             <ArrowLeft class="w-4 h-4 mr-2 group-hover:-translate-x-1 transition-transform" />{{ t("auth.back") }}
             <ArrowLeft class="w-4 h-4 mr-2 group-hover:-translate-x-1 transition-transform" />{{ t("auth.back") }}
           </RouterLink>
           </RouterLink>
-          <h1 class="font-display text-4xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-foreground to-foreground/60">
-            {{ t("nav.myOrders") }}
-          </h1>
-          <p class="text-muted-foreground mt-2">{{ t("orders.titleSubtitle") }}</p>
+          <div class="flex flex-col sm:flex-row sm:items-end justify-between gap-6">
+            <div>
+              <h1 class="font-display text-4xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-foreground to-foreground/60">
+                {{ t("nav.myOrders") }}
+              </h1>
+              <p class="text-muted-foreground mt-2">{{ t("orders.titleSubtitle") }}</p>
+            </div>
+            <Button @click="router.push('/#upload')" class="bg-primary hover:bg-primary/90 text-primary-foreground px-6 py-2.5 rounded-xl font-bold shadow-lg shadow-primary/20 flex items-center gap-2 group shrink-0">
+              <Plus class="w-4 h-4 group-hover:rotate-90 transition-transform" />
+              {{ t("orders.newOrder") }}
+            </Button>
+          </div>
         </div>
         </div>
 
 
         <div v-if="isLoading" class="flex flex-col items-center justify-center py-20 gap-4">
         <div v-if="isLoading" class="flex flex-col items-center justify-center py-20 gap-4">
@@ -207,7 +215,7 @@
 import { ref, onMounted, defineComponent, h, watch, nextTick } from "vue";
 import { ref, onMounted, defineComponent, h, watch, nextTick } from "vue";
 import { RouterLink, useRouter, useRoute } from "vue-router";
 import { RouterLink, useRouter, useRoute } from "vue-router";
 import { useI18n } from "vue-i18n";
 import { useI18n } from "vue-i18n";
-import { Package, Clock, ShieldCheck, Truck, XCircle, ArrowLeft, Loader2, ExternalLink, Hash, FileText, Image as ImageIcon, MessageCircle, FileBox, Download } from "lucide-vue-next";
+import { Package, Clock, ShieldCheck, Truck, XCircle, ArrowLeft, Loader2, ExternalLink, Hash, FileText, Image as ImageIcon, MessageCircle, FileBox, Download, Plus } from "lucide-vue-next";
 import Button from "@/components/ui/button.vue";
 import Button from "@/components/ui/button.vue";
 import Header from "@/components/Header.vue";
 import Header from "@/components/Header.vue";
 import Footer from "@/components/Footer.vue";
 import Footer from "@/components/Footer.vue";