个人资料

src/pages/user/components/UserCard.tsx

@@ -1,6 +1,6 @@
 import {Button} from '@nutui/nutui-react-taro'
 import {Avatar, Tag} from '@nutui/nutui-react-taro'
-import {View, Text} from '@tarojs/components'
+import {View, Text, Image} from '@tarojs/components'
 import {Scan} from '@nutui/icons-react-taro';
 import {getUserInfo, getWxOpenId} from '@/api/layout';
 import Taro from '@tarojs/taro';
@@ -16,7 +16,7 @@ const UserCard = forwardRef<any, any>((_, ref) => {
   const {
     isAdmin
   } = useUser();
-  const { data, refresh } = useUserData()
+  const {data, refresh} = useUserData()
   const {getDisplayName, getRoleName} = useUser();
   const [IsLogin, setIsLogin] = useState<boolean>(false)
   const [userInfo, setUserInfo] = useState<User>()
@@ -119,7 +119,7 @@ const UserCard = forwardRef<any, any>((_, ref) => {
   };
 
   /* 获取用户手机号 */
-  const handleGetPhoneNumber = ({detail}: {detail: {code?: string, encryptedData?: string, iv?: string}}) => {
+  const handleGetPhoneNumber = ({detail}: { detail: { code?: string, encryptedData?: string, iv?: string } }) => {
     const {code, encryptedData, iv} = detail
 
     // 获取存储的邀请参数
@@ -171,14 +171,13 @@ const UserCard = forwardRef<any, any>((_, ref) => {
   return (
     <View className={'header-bg pt-20'}>
       <View className={'p-4'}>
+        {/* 使用相对定位容器，让个人资料图片可以绝对定位在右上角 */}
+        <View className="relative">
           <View
-          className={'user-card w-full flex flex-col justify-around rounded-xl shadow-sm'}
+            className={'user-card w-full flex flex-col justify-around rounded-xl'}
             style={{
-            background: 'linear-gradient(to bottom, #ffffff, #ffffff)', // 这种情况建议使用类名来控制样式（引入外联样式）
-            // width: '720rpx',
-            // margin: '10px auto 0px auto',
+              background: 'linear-gradient(to bottom, #ffffff, #ffffff)',
               height: '170px',
-            // borderRadius: '22px 22px 0 0',
             }}
           >
             <View className={'user-card-header flex w-full justify-between items-center pt-4'}>
@@ -205,11 +204,8 @@ const UserCard = forwardRef<any, any>((_, ref) => {
                   ) : ''}
                 </View>
               </View>
-            {isAdmin() && <Scan className={'text-gray-900'} size={24} onClick={() => navTo('/user/store/verification', true)} />}
-            <View className={'mr-4 text-sm px-3 py-1 text-black border-gray-400 border-solid border-2 rounded-3xl'}
-                 onClick={() => navTo('/user/profile/profile', true)}>
-              {'个人资料'}
-            </View>
+              {isAdmin() &&
+              <Scan className={'text-gray-900'} size={24} onClick={() => navTo('/user/store/verification', true)}/>}
             </View>
             <View className={'flex justify-around mt-1'}>
               <View className={'item flex justify-center flex-col items-center'}
@@ -233,9 +229,27 @@ const UserCard = forwardRef<any, any>((_, ref) => {
               </View>
             </View>
           </View>
+
+          {/* 个人资料图片，定位在右上角 */}
+          <View
+            className="absolute top-0 right-0 overflow-hidden"
+            style={{
+             borderRadius:"0 0.75rem 0 0"
+            }}
+            onClick={() => navTo('/user/profile/profile', true)}
+          >
+            <Image
+              src="https://oss.wsdns.cn/20250913/7c3de38b377344b89131aba40214f63f.png"
+              alt="个人资料"
+              style={{
+                width:"200rpx"
+              }}
+              mode="widthFix"
+            />
+          </View>
+        </View>
       </View>
     </View>
-
   )
 })
 

src/pages/user/user.scss

@@ -3,3 +3,7 @@
   background: linear-gradient(to bottom, #03605c, #18ae4f);
   background-size: 100%;
 }
+
+.my-bg{
+  background: url('https://oss.wsdns.cn/20250913/5ae575a50dbb4ccaab086c3679c5e2c3.png') no-repeat top center;
+}