feat: 添加二维码扫描页面，优化用户界面和扫描功能

src/components/qr-scanner/index.vue

@@ -93,7 +93,6 @@ function stop() {
   if (videoInst.value) {
     videoInst.value.srcObject = null;
   }
-  emit("close");
 }
 
 function handleSelectImage() {
@@ -182,7 +181,7 @@ defineExpose({
     >
 
     <div class="absolute left-0 top-0 z-10 p-4 pt-[calc(1rem+var(--ion-safe-area-top,0px))] pl-[calc(1rem+var(--ion-safe-area-left,0px))]">
-      <button class="z-1 flex items-center" @click="stop">
+      <button class="z-1 flex items-center" @click="emit('close')">
         <ion-icon :icon="chevronBackOutline" class="text-2xl text-white" />
       </button>
     </div>

src/router/index.ts

@@ -226,6 +226,11 @@ const routes: Array<RouteRecordRaw> = [
     path: "/pwa_download",
     component: () => import("@/views/pwa/download.vue"),
   },
+  {
+    path: "/scan_qr",
+    component: () => import("@/views/scan-qr/index.vue"),
+    meta: { requiresAuth: false },
+  },
 ];
 
 const router = createRouter({

src/views/scan-qr/index.vue

@@ -0,0 +1,49 @@
+<script lang='ts' setup>
+import { toastController } from "@ionic/vue";
+
+const router = useRouter();
+const scanner = useTemplateRef<InstanceType<typeof QrScanner>>("scanner");
+
+function handleSuccess(value: string) {
+  toastController.create({
+    message: String(value),
+    duration: 2000,
+    position: "bottom",
+    color: "success",
+  }).then(toast => toast.present());
+}
+
+function handleError(error: Error) {
+  toastController.create({
+    message: `扫描失败: ${error.message}`,
+    duration: 2000,
+    position: "bottom",
+    color: "danger",
+  }).then(toast => toast.present());
+}
+
+function handleClose() {
+  if (window.history.length > 1) {
+    router.back();
+  }
+  else {
+    router.replace("/");
+  }
+}
+
+onMounted(() => {
+  scanner.value?.start();
+});
+
+onBeforeRouteLeave(() => {
+  scanner.value?.stop();
+});
+</script>
+
+<template>
+  <ion-page>
+    <QrScanner ref="scanner" @success="handleSuccess" @error="handleError" @close="handleClose" />
+  </ion-page>
+</template>
+
+<style lang='css' scoped></style>

src/views/user/index.vue

@@ -12,9 +12,9 @@ import TradeSettings from "./components/trade-settings.vue";
 import UserInfo from "./components/user-info.vue";
 import WalletCard from "./components/wallet-card.vue";
 
+const router = useRouter();
 const { vibrate } = useHaptics();
 const walletStore = useWalletStore();
-const { open } = useQRScanner();
 
 async function handleRefresh(event: RefresherCustomEvent) {
   vibrate();
@@ -27,15 +27,7 @@ async function handleRefresh(event: RefresherCustomEvent) {
 // 处理扫描二维码
 async function handleScan() {
   vibrate();
-  const result = await open({
-    title: "扫描二维码",
-  });
-
-  if (result) {
-    console.log("扫描结果:", result);
-    // TODO: 根据扫描结果进行相应处理
-    // 例如：跳转到对应页面、显示信息等
-  }
+  router.push("/scan_qr");
 }
 </script>