登录功能

Web/src/views/SettingView.vue

@@ -18,14 +18,25 @@
     <van-cell-group inset>
       <van-cell title="智能分类" is-link />
     </van-cell-group>
+
+    <div class="detail-header">
+      <p>账户</p>
+    </div>
+    <van-cell-group inset>
+      <van-cell title="退出登录" is-link @click="handleLogout" />
+    </van-cell-group>
   </div>
 </template>
 
 <script setup>
 import { ref } from 'vue'
-import { showLoadingToast, showSuccessToast, showToast, closeToast } from 'vant'
+import { useRouter } from 'vue-router'
+import { showLoadingToast, showSuccessToast, showToast, closeToast, showConfirmDialog } from 'vant'
 import { uploadBillFile } from '@/api/billImport'
+import { useAuthStore } from '@/stores/auth'
 
+const router = useRouter()
+const authStore = useAuthStore()
 const fileInputRef = ref(null)
 const currentType = ref('')
 
@@ -89,6 +100,25 @@ const handleFileChange = async (event) => {
     event.target.value = ''
   }
 }
+
+/**
+ * 处理退出登录
+ */
+const handleLogout = async () => {
+  try {
+    await showConfirmDialog({
+      title: '提示',
+      message: '确定要退出登录吗？',
+    })
+    
+    authStore.logout()
+    showSuccessToast('已退出登录')
+    router.push({ name: 'login' })
+  } catch (error) {
+    console.error('取消退出登录:', error)
+    showToast('已取消退出登录')
+  }
+}
 </script>
 
 <style scoped>