修复绑定设备BUG

src/pages/my-device.vue

@@ -8,41 +8,28 @@ import useStore from "@/store";
 import { storeToRefs } from "pinia";
 const showTip = ref(false);
 const confirmBindTip = ref(false);
-const device = ref({
-  id: "wefefweee",
-  deviceName: "DS3F298SDfF",
-});
 const addDevice = ref();
-const loading = ref(true);
 const store = useStore();
-const { user } = storeToRefs(store);
+const { updateDevice } = store;
+const { user, device } = storeToRefs(store);
 const justBind = ref(false);
 
-const step = ref(1);
-
-onMounted(async () => {
-  const result = await getMyDevicesAPI();
-  loading.value = false;
-  device.value = result.bindings[0] || {};
-});
-
 // 扫描二维码方法
 const handleScan = () => {
-  const { user } = useStore();
-  if (!user.id) {
-    return uni.showToast({
-      title: "请先登录",
-      icon: "none",
-    });
-  }
   // 调用扫码API
   uni.scanCode({
     // 只支持扫码二维码
     onlyFromCamera: true,
     scanType: ["qrCode"],
     success: async (res) => {
-      addDevice.value = JSON.parse(atob(res.result));
-      confirmBindTip = true;
+      const base64Decode = (str) => {
+        // 将 base64 转换为 utf8 字符串
+        const bytes = wx.base64ToArrayBuffer(str);
+        return String.fromCharCode.apply(null, new Uint8Array(bytes));
+      };
+
+      addDevice.value = JSON.parse(base64Decode(res.result));
+      confirmBindTip.value = true;
     },
     fail: (err) => {
       console.error("扫码失败：", err);
@@ -55,14 +42,15 @@ const handleScan = () => {
 };
 
 const confirmBind = async () => {
-  if (addDevice.value.deviceId) {
+  if (addDevice.value.id) {
     await bindDeviceAPI(addDevice.value);
+    updateDevice(addDevice.value.id, addDevice.value.name);
+    confirmBindTip.value = false;
     justBind.value = true;
     uni.showToast({
       title: "绑定成功",
       icon: "success",
     });
-    step.value = 2;
   }
 };
 
@@ -86,11 +74,15 @@ const toDeviceIntroPage = () => {
     url: "/pages/device-intro",
   });
 };
+
+const backToHome = () => {
+  uni.navigateBack();
+};
 </script>
 
 <template>
   <Container title="弓箭绑定">
-    <view v-if="!loading && !device.deviceId" class="scan-code">
+    <view v-if="!device.deviceId" class="scan-code">
       <view @click="handleScan">
         <image src="../static/scan.png" mode="widthFix" />
         <text>扫码绑定弓箭</text>
@@ -155,8 +147,13 @@ const toDeviceIntroPage = () => {
         <text>赶快进入新手试炼场体验一下吧！</text>
       </view>
       <SButton :onClick="toFristTryPage">进入新手试炼</SButton>
+      <view :style="{ marginTop: '15px' }">
+        <SButton :onClick="backToHome" backgroundColor="#fff3" color="#fff"
+          >返回首页</SButton
+        >
+      </view>
     </view>
-    <view v-if="!loading && device.deviceId && !justBind" class="has-device">
+    <view v-if="device.deviceId && !justBind" class="has-device">
       <view class="device-binded">
         <view @click="toDeviceIntroPage">
           <image src="../static/device-icon.png" mode="widthFix" />
@@ -233,6 +230,8 @@ const toDeviceIntroPage = () => {
 }
 .confirm-bind {
   transform: translateY(36px);
+  color: #fff9;
+  font-size: 14px;
 }
 .confirm-bind > view:last-child {
   display: flex;
@@ -258,7 +257,7 @@ const toDeviceIntroPage = () => {
   justify-content: center;
   color: #fff;
   font-size: 14px;
-  margin: 75px 0;
+  margin: 100px 0;
 }
 .device-binded > view {
   display: flex;
@@ -267,6 +266,7 @@ const toDeviceIntroPage = () => {
 }
 .device-binded > view > image {
   width: 24vw;
+  height: 24vw;
   margin-bottom: 5px;
   border-radius: 10px;
 }