完成订单相关UI

src/pages/user.vue

@@ -3,21 +3,35 @@ import AppBackground from "@/components/AppBackground.vue";
 import Header from "@/components/Header.vue";
 import UserHeader from "@/components/UserHeader.vue";
 import UserItem from "@/components/UserItem.vue";
+import Avatar from "@/components/Avatar.vue";
+import useStore from "@/store";
+import { storeToRefs } from "pinia";
+const store = useStore();
+const { user } = storeToRefs(store);
+
+const toOrderPage = () => {
+  uni.navigateTo({
+    url: "/pages/orders",
+  });
+};
 </script>
 
 <template>
   <view>
     <AppBackground />
     <Header title="用户信息" />
-    <UserHeader />
+    <UserHeader :user="user" />
     <view class="container">
-      <UserItem title="用户名" />
-      <UserItem title="头像" />
+      <UserItem title="用户名">{{ user.nickName }}</UserItem>
+      <UserItem title="头像">
+        <Avatar :src="user.avatarUrl" :size="35" />
+      </UserItem>
       <UserItem
         title="订单"
         :customStyle="{
           marginTop: '10px',
         }"
+        :onClick="toOrderPage"
       />
       <UserItem title="新手试炼场" />
       <UserItem title="会员" />