完善个人中心及退出登录

pages/mall/admin/userCenter/index.uvue

@@ -9,14 +9,14 @@
         <text class="form-label">头像</text>
         <view class="form-content avatar-uploader">
           <!-- 默认使用一个占位头像或 Logo -->
-          <image class="avatar-img" src="/static/logo.png" mode="aspectFill"></image>
+          <image class="avatar-img" :src="avatarUrl" mode="aspectFill"></image>
         </view>
       </view>
 
       <view class="form-item">
         <text class="form-label">账号</text>
         <view class="form-content">
-          <input class="uni-input disabled" value="demo" disabled placeholder="请输入账号" />
+          <input class="uni-input disabled" :value="userAccount" disabled placeholder="请输入账号" />
         </view>
       </view>
 
@@ -56,34 +56,134 @@
 </template>
 
 <script setup lang="uts">
-import { reactive } from 'vue'
+import { reactive, computed, onMounted } from 'vue'
+import { state, logout } from '@/utils/store.uts'
+import supa from '@/components/supadb/aksupainstance.uts'
+
+const userAccount = computed((): string => state.userProfile.email || 'demo@example.com')
+const avatarUrl = computed((): string => state.userProfile.avatar_url || '/static/logo.png')
 
 const formData = reactive({
-  name: 'demo',
+  name: '',
   oldPassword: '',
   newPassword: '',
   confirmPassword: ''
 })
 
-const onSubmit = () => {
-  if (formData.newPassword && formData.newPassword !== formData.confirmPassword) {
-    uni.showToast({ title: '两次输入的新密码不一致', icon: 'none' })
-    return
-  }
-  if (!formData.name) {
+onMounted(() => {
+  formData.name = state.userProfile.username || ''
+})
+
+const onSubmit = async () => {
+  if (formData.name.trim() == '') {
     uni.showToast({ title: '姓名不能为空', icon: 'none' })
     return
   }
-  
-  uni.showLoading({ title: '保存中...' })
-  setTimeout(() => {
-    uni.hideLoading()
-    uni.showToast({ title: '保存成功(演示)', icon: 'success' })
-    // 清空密码框
-    formData.oldPassword = ''
-    formData.newPassword = ''
-    formData.confirmPassword = ''
-  }, 500)
+
+  // 修改密码逻辑
+  if (formData.oldPassword != '' || formData.newPassword != '' || formData.confirmPassword != '') {
+    if (formData.oldPassword == '') {
+      uni.showToast({ title: '需要输入原始密码', icon: 'none' })
+      return
+    }
+    if (formData.newPassword == '') {
+      uni.showToast({ title: '新密码不能为空', icon: 'none' })
+      return
+    }
+    if (formData.newPassword !== formData.confirmPassword) {
+      uni.showToast({ title: '两次输入的新密码不一致', icon: 'none' })
+      return
+    }
+    if (formData.newPassword === formData.oldPassword) {
+      uni.showToast({ title: '新密码不能与原始密码相同', icon: 'none' })
+      return
+    }
+
+    uni.showLoading({ title: '验证并提交中...' })
+
+    try {
+      const email = state.userProfile.email
+      if (email == '') {
+        uni.hideLoading()
+        uni.showToast({ title: '账号缺失，无法验证', icon: 'none' })
+        return
+      }
+      
+      // 1. 验证原密码
+      const resSignIn = await supa.auth.signInWithPassword({
+        email: email,
+        password: formData.oldPassword
+      })
+
+      if (resSignIn.error != null) {
+        uni.hideLoading()
+        uni.showToast({ title: '原密码错误', icon: 'none' })
+        return
+      }
+
+      // 2. 更新新密码
+      const resUpdate = await supa.auth.updateUser({
+        password: formData.newPassword
+      })
+
+      if (resUpdate.error != null) {
+        uni.hideLoading()
+        uni.showToast({ title: '密码更新失败', icon: 'none' })
+        return
+      }
+
+      // 3. 同时更新姓名
+      if (formData.name !== state.userProfile.username) {
+        await supa.from('ak_users').update({
+          username: formData.name
+        }).eq('id', state.userProfile.id)
+      }
+
+      uni.hideLoading()
+      uni.showToast({ title: '修改成功, 请重新登录', icon: 'success' })
+      
+      // 退出登录
+      setTimeout(() => {
+        logout()
+        uni.removeStorageSync('adminRole')
+        uni.removeStorageSync('token')
+        uni.reLaunch({
+          url: '/pages/user/login'
+        })
+      }, 1500)
+
+      return 
+    } catch (e) {
+      uni.hideLoading()
+      uni.showToast({ title: '网络异常', icon: 'none' })
+      return
+    }
+  }
+
+  // 仅修改基本信息
+  if (formData.name !== state.userProfile.username) {
+    uni.showLoading({ title: '保存中...' })
+    try {
+      const res = await supa.from('ak_users').update({
+        username: formData.name
+      }).eq('id', state.userProfile.id)
+
+      if (res.error != null) {
+        uni.hideLoading()
+        uni.showToast({ title: '保存失败', icon: 'none' })
+        return
+      }
+      
+      state.userProfile.username = formData.name
+      uni.hideLoading()
+      uni.showToast({ title: '保存成功', icon: 'success' })
+    } catch (e) {
+      uni.hideLoading()
+      uni.showToast({ title: '网络异常', icon: 'none' })
+    }
+  } else {
+    uni.showToast({ title: '无修改内容', icon: 'none' })
+  }
 }
 </script>
 

pages/mall/admin/错误信息.txt

@@ -1,4 +1,4 @@
-GET http://localhost:5173/layouts/admin/AdminLayout.uvue?t=1773216297014&import net::ERR_ABORTED 500 (Internal Server Error)
+index.uvue:1  GET http://localhost:5173/pages/mall/admin/userCenter/index.uvue?t=1773217839799&import&vue&type=script&setup=true&lang.uts net::ERR_ABORTED 500 (Internal Server Error)
 main.uts:16 [Vue warn]: Unhandled error during execution of async component loader 
  at <AsyncComponentWrapper>
 at <PageBody>
@@ -97,4 +97,4 @@ initRouter @ uni-h5.es.js:19886
 install @ uni-h5.es.js:19955
 use @ vue.runtime.esm.js:5190
 (anonymous) @ main.uts:16
-main.uts:16 TypeError: Failed to fetch dynamically imported module: http://localhost:5173/pages/mall/admin/homePage/index.uvue?t=1773216297014&import
+main.uts:16 TypeError: Failed to fetch dynamically imported module: http://localhost:5173/pages/mall/admin/homePage/index.uvue?t=1773218041262&import