头像上传、账户名称更新、手机号绑定

acdr-ui/src/pages.json

@@ -299,7 +299,10 @@
     {
       "path": "pages/settings/index",
       "type": "page",
-      "style": {}
+      "layout": "default",
+      "style": {
+        "navigationBarTitleText": "设置"
+      }
     },
     {
       "path": "pages/space/index",

acdr-ui/src/pages/settings/index.vue

@@ -1,5 +1,31 @@
+<route lang="json5" type="page">
+{
+  layout: 'default',
+  style: {
+    navigationBarTitleText: '设置',
+  },
+}
+</route>
 <template>
-  <view class="setting-root bg-[#F5F5F5] h-full p-5">
+  <view class="setting-root h-full p-5">
+    <!-- 用户头像 如果不存在头像就访问占位符，函数imgUrl默认为占位符 -->
+    <view class="flex items-center justify-center mb-6 pos-relative">
+      <wd-img
+        v-if="sinfo.userAvatar != undefined"
+        :width="100"
+        :height="100"
+        round
+        mode="aspectFill"
+        :src="sinfo.userAvatar ? imgUrl(sinfo.userAvatar) : imgUrl('')"
+      ></wd-img>
+      <view
+        @click="updateAvatar"
+        class="text-white pos-absolute bottom-[-10px] right-[33%] bg-[#ff7f50] rounded p-[2px]"
+      >
+        修改
+      </view>
+    </view>
+
     <!-- 国际化设置 -->
     <view class="card mb-4 p-4 bg-white rounded-lg shadow">
       <view class="text-gray-800 text-lg mb-2">国际化设置</view>
@@ -58,7 +84,9 @@ import { useConfigStore } from '@/store/config'
 import { useUserStore } from '@/store'
 import { httpPost, httpGet } from '@/utils/http'
 import LoadingAnimation from '@/components/LoadingAnimation.vue'
-import { toast } from '@/utils/commUtils'
+import { imgUrl, toast } from '@/utils/commUtils'
+import { chooseImage } from '@/service/fileservice'
+import { getUserInfo } from '@/service/userService'
 
 const configStore = useConfigStore()
 const userStore = useUserStore()
@@ -120,11 +148,38 @@ const updateUserName = async () => {
     sinfo.value.userName = newUserName.value
     toast('用户名修改成功')
     showUserNamePopup.value = false
+    // 更新设置页面信息
+    await getSettingInfo()
+    // 更新用户信息
+    await getUserInfo()
   } else {
     toast(response.message)
   }
 }
 
+// 更新用户头像
+const updateAvatar = async () => {
+  // 选择并上传图片,返回上传后的path
+  try {
+    const path = await chooseImage()
+    if (!path || path == '') {
+      toast('图片上传失败，请检查你的网络情况！')
+      return
+    }
+    const res = await httpPost('/setting/updateUserAvatar', {}, { userAvatar: path })
+    if (res.code == 200 && res.data) {
+      toast('头像更新成功')
+      // 更新设置页面信息
+      await getSettingInfo()
+      // 更新用户信息
+      await getUserInfo()
+    }
+  } catch (e) {
+    console.log(e)
+    toast('头像更新失败')
+  }
+}
+
 const logout = async () => {
   const logRes = await httpGet('/user/logout')
   if (logRes.code == 200) {

acdr-ui/src/service/fileservice.js

@@ -0,0 +1,40 @@
+import { httpUploadFile } from "@/utils/http";
+
+// 选择并上传图片
+export const chooseImage = () => {
+  return new Promise((resolve, reject) => {
+    uni.chooseImage({
+      count: 1,
+      success: async (res) => {
+        try {
+          const filePath = res.tempFilePaths[0]; // 获取第一张图片路径
+          const uploadedUrl = await uploadImage(filePath); // 异步上传图片
+          resolve(uploadedUrl); // 成功上传后返回 URL
+        } catch (error) {
+          reject(error); // 上传失败时返回错误
+        }
+      },
+      fail: () => {
+        uni.showToast({ title: '图片选择失败', icon: 'none' });
+        reject(new Error('图片选择失败'));
+      },
+    })
+  })
+}
+
+// 上传图片到服务器
+export const uploadImage = async (filePath) => {
+  try {
+    const uploadResult = await httpUploadFile('/file/upload', filePath)
+    if (uploadResult && uploadResult.data && uploadResult.data.url) {
+      return uploadResult.data.url
+    } else {
+      uni.showToast({ title: '图片上传失败', icon: 'none' })
+      return ''
+    }
+  } catch (error) {
+    console.error(error)
+    uni.showToast({ title: '图片上传失败', icon: 'none' })
+    return ''
+  }
+}

acdr-ui/src/service/userService.js

@@ -0,0 +1,18 @@
+import { useUserStore } from "@/store"
+
+// 获取用户信息并且更新缓存
+// 返回用户详细信息
+// 如果获取失败返回为空
+export const getUserInfo = async () => {
+  try {
+    const userRes = await httpGet('/user/userinfo')
+    if (userRes.code == 200) {
+      useUserStore().setUserInfo(userRes.data)
+      return userRes.data
+    }
+    return null
+  } catch (e) {
+    console.log(e)
+    return null
+  }
+}

acdr/src/main/java/com/yskj/acdr/master/common/FileUploadController.java

@@ -6,7 +6,6 @@ import com.yskj.acdr.master.file.service.FileMapService;
 import jakarta.annotation.Resource;
 import jakarta.validation.constraints.NotNull;
 import org.springframework.validation.annotation.Validated;
-import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;

acdr/src/main/java/com/yskj/acdr/master/setting/controller/SettingController.java

@@ -37,7 +37,9 @@ public class SettingController {
     public GlobalResponse<AccountInfo> info() {
         Users users = usersService.getById(StpUtil.getLoginIdAsLong());
         return GlobalResponse.success(
-                new AccountInfo().setIsAuth(authService.isRealName())
+                new AccountInfo()
+                        .setUserAvatar(users.getAvatar())
+                        .setIsAuth(authService.isRealName())
                         .setPhone(users.getPhone())
                         .setUserName(users.getNickname())
         );
@@ -63,6 +65,17 @@ public class SettingController {
     /**
      * 修改用户名称
      */
+    @PostMapping("/updateUserAvatar")
+    @Transactional
+    public GlobalResponse<Boolean> updateUserAvatar(String userAvatar) {
+        Users users = usersService.getById(StpUtil.getLoginIdAsLong());
+        users.setAvatar(userAvatar);
+        return GlobalResponse.success(usersService.updateById(users));
+    }
+
+    /**
+     * 修改用户头像
+     */
     @PostMapping("/updateUserName")
     @Transactional
     public GlobalResponse<Boolean> updateUserName(String userName) {

acdr/src/main/java/com/yskj/acdr/master/setting/entity/AccountInfo.java

@@ -9,6 +9,9 @@ import lombok.experimental.Accessors;
 @ApiModel(value = "AccountInfo", description = "账户信息类")
 public class AccountInfo {
 
+    // 用户头像
+    private String userAvatar;
+
     // 手机号信息
     private String phone;