refactor: update import paths to use alias and improve layout in result components for better readability

front/components/Result/FileShareResult.vue

@@ -5,12 +5,12 @@ import { Input } from "@/components/ui/input";
 import { useClipboard } from "@vueuse/core";
 import { toast } from "vue-sonner";
 import { useQuery } from "@tanstack/vue-query";
-import useMyAppShare from "~/composables/useMyAppShare";
+import useMyAppShare from "@/composables/useMyAppShare";
 import useMyAppConfig from "@/composables/useMyAppConfig";
 import dayjs from "dayjs";
 import relativeTime from "dayjs/plugin/relativeTime";
 import "dayjs/locale/zh-cn"; // 导入中文语言包
-import showDrawer from "~/lib/showDrawer";
+import showDrawer from "@/lib/showDrawer";
 import QrCoreDrawer from "@/components/Drawer/QrCoreDrawer.vue";
 dayjs.extend(relativeTime); // 扩展 relativeTime 插件
 dayjs.locale("zh-cn"); // 设置语言为中文
@@ -121,9 +121,9 @@ const { copy } = useClipboard();
               class="bg-white/70"
               size="icon"
               @click="
-                ({ ...rest }) => {
+                () => {
                   showDrawer({
-                    render: () =>
+                    render: ({ ...rest }) =>
                       h(QrCoreDrawer, {
                         ...rest,
                         data: url,

front/components/Result/ImageCompressResult.vue

@@ -3,7 +3,7 @@ import { useQuery } from "@tanstack/vue-query";
 import { AsyncButton, Button } from "@/components/ui/button";
 import { Skeleton } from "@/components/ui/skeleton";
 import { filesize } from "filesize";
-import useMyAppShare from "~/composables/useMyAppShare";
+import useMyAppShare from "@/composables/useMyAppShare";
 import { toast } from "vue-sonner";
 const emit = defineEmits<{
   (e: "change", key: string): void;

front/components/Result/TextShareResult.vue

@@ -4,8 +4,10 @@ import { Input } from "@/components/ui/input";
 import { useClipboard } from "@vueuse/core";
 import { toast } from "vue-sonner";
 import { useQuery } from "@tanstack/vue-query";
-import useMyAppShare from "~/composables/useMyAppShare";
+import useMyAppShare from "@/composables/useMyAppShare";
 import useMyAppConfig from "@/composables/useMyAppConfig";
+import showDrawer from "@/lib/showDrawer";
+import QrCoreDrawer from "@/components/Drawer/QrCoreDrawer.vue";
 
 const props = defineProps<{
   data: { text: string; config: any; handle_type: string };
@@ -38,9 +40,9 @@ const { copy } = useClipboard();
 
 <template>
   <div class="flex flex-col gap-3">
-    <div class="flex flex-row justify-between">
-      <h2 class="text-lg">分享成功</h2>
-      <div class="flex flex-row gap-2 basis-1/2">
+    <div class="flex flex-col md:flex-row gap-2">
+      <div class="flex flex-row justify-between md:basis-1/2">
+        <h2 class="text-lg">分享成功</h2>
         <Button
           variant="outline"
           class="bg-white/70"
@@ -53,7 +55,9 @@ const { copy } = useClipboard();
         >
           <LucideHome />
         </Button>
-        <Input v-model="url" class="bg-white/70" />
+      </div>
+      <div class="flex flex-row gap-2 flex-1">
+        <Input v-model="url" class="bg-white/70" readonly />
         <Button
           variant="outline"
           class="bg-white/70"
@@ -67,13 +71,28 @@ const { copy } = useClipboard();
         >
           <LucideCopy />
         </Button>
-        <Button variant="outline" class="bg-white/70" size="icon">
+        <Button
+          variant="outline"
+          class="bg-white/70"
+          size="icon"
+          @click="
+            () => {
+              showDrawer({
+                render: ({ ...rest }) =>
+                  h(QrCoreDrawer, {
+                    ...rest,
+                    data: url,
+                  }),
+              });
+            }
+          "
+        >
           <LucideQrCode />
         </Button>
       </div>
     </div>
     <div
-      class="prose rounded-md bg-white/70 p-3 w-full max-w-full"
+      class="prose rounded-md bg-white/70 p-3 w-full max-w-full min-h-[30vh]"
       v-html="props?.data?.text"
     />
   </div>

front/error.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { NuxtError } from "#app";
 import { useI18n } from "vue-i18n";
-import { Button } from "~/components/ui/button";
+import { Button } from "@/components/ui/button";
 
 const { t } = useI18n();
 

front/nuxt.config.ts

@@ -3,7 +3,7 @@ import tailwindcss from "@tailwindcss/vite";
 export default defineNuxtConfig({
   compatibilityDate: "2024-04-03",
   devtools: { enabled: true },
-  css: ["~/assets/css/main.css"],
+  css: ["@/assets/css/main.css"],
   modules: [
     // '@serwist/nuxt',
     "@vueuse/nuxt",
@@ -35,7 +35,6 @@ export default defineNuxtConfig({
     },
   },
   devServer: {
-    port: parseInt(process.env.PORT || "5000"),
-    host: process.env.HOST || "0.0.0.0",
+    port: 5000,
   },
 });