细节优化

src/components/UserHeader.vue

@@ -201,8 +201,10 @@ watch(
 .rank-tag-text {
   position: absolute;
   top: 0;
-  left: 5px;
+  left: 0;
   line-height: 16px;
+  width: 100%;
+  text-align: center;
 }
 
 .rank-info {

src/pages/my-growth.vue

@@ -59,7 +59,7 @@ const onPractiseLoading = async (page) => {
   <Container title="我的成长脚印" overflow="hidden">
     <view class="tabs">
       <view
-        v-for="(rankType, index) in ['排位赛', '好友约战', '箭馆练习']"
+        v-for="(rankType, index) in ['排位赛', '好友约战', '个人练习']"
         :key="index"
         :style="{
           color: index === selectedIndex ? '#000' : '#fff',

src/pages/order-detail.vue

@@ -1,9 +1,9 @@
 <script setup>
-import { ref, onMounted } from "vue";
+import { ref, onMounted, onUnmounted } from "vue";
 import Container from "@/components/Container.vue";
 import SButton from "@/components/SButton.vue";
 import { payOrderAPI, cancelOrderListAPI, getHomeData } from "@/apis";
-import { orderStatusNames, getStatusColor } from "@/constants";
+import { orderStatusNames, getStatusColor, MESSAGETYPES } from "@/constants";
 import useStore from "@/store";
 const store = useStore();
 const { updateUser } = store;
@@ -11,9 +11,27 @@ const { updateUser } = store;
 const data = ref({});
 const loading = ref(false);
 
+async function onReceiveMessage(messages = []) {
+  messages.forEach((msg) => {
+    if (
+      msg.constructor === MESSAGETYPES.PaySuccess &&
+      data.value.orderId === msg.orderID
+    ) {
+      data.value.orderStatus = 4;
+      data.value.paymentTime = msg.payTime;
+      uni.setStorageSync("order", data.value);
+    }
+  });
+}
+
 onMounted(() => {
   const order = uni.getStorageSync("order");
   data.value = order || {};
+  uni.$on("socket-inbox", onReceiveMessage);
+});
+
+onUnmounted(() => {
+  uni.$off("socket-inbox", onReceiveMessage);
 });
 
 const goPay = async () => {
@@ -46,6 +64,7 @@ const goPay = async () => {
 const cancelOrder = async () => {
   const result = await cancelOrderListAPI(data.value.orderId);
   data.value = result;
+  uni.setStorageSync("order", result);
 };
 </script>
 

src/pages/orders.vue

@@ -1,5 +1,6 @@
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
+import { onShow } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import ScrollList from "@/components/ScrollList.vue";
 import { getOrderListAPI } from "@/apis";
@@ -27,6 +28,19 @@ const onLoading = async (page) => {
   }
   return result.length;
 };
+
+onMounted(() => {
+  uni.removeStorageSync("order");
+});
+
+onShow(() => {
+  const order = uni.getStorageSync("order");
+  list.value.forEach((item, index) => {
+    if (item.orderId === order.orderId) {
+      list.value[index] = order;
+    }
+  });
+});
 </script>
 
 <template>

src/websocket.js

@@ -56,8 +56,6 @@ function createWebSocket(token, onMessage) {
       uni.setStorageSync("latestRank", msg.lvl);
     } else if (msg.constructor === MESSAGETYPES.LvlUpdate) {
       uni.setStorageSync("latestLvl", msg.lvl);
-    } else if (msg.constructor === MESSAGETYPES.PaySuccess) {
-      console.log(1111111, msg);
     }
   });