Files
ruoyi-plus-vben5/playground/src/views/demos/features/login-expired/index.vue
米山 cd7c11c7d0 fix: run 'pnpm format' update various components and improve layout structure
- Updated demo-preview and preview-group components for better error handling and layout.
- Enhanced drawer and modal components for improved auto-height functionality.
- Refactored layout components including header, footer, sidebar, and tabbar for better responsiveness and usability.
- Adjusted tooltip and help tooltip components for better user guidance.
- Fixed issues in various UI components to ensure consistent styling and functionality across the application.
2025-11-19 10:14:04 +08:00

40 lines
1.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<script lang="ts" setup>
import type { LoginExpiredModeType } from '@vben/types';
import { Page } from '@vben/common-ui';
import { preferences, updatePreferences } from '@vben/preferences';
import { Button, Card } from 'ant-design-vue';
import { getMockStatusApi } from '#/api';
async function handleClick(type: LoginExpiredModeType) {
const loginExpiredMode = preferences.app.loginExpiredMode;
updatePreferences({ app: { loginExpiredMode: type } });
await getMockStatusApi('401');
updatePreferences({ app: { loginExpiredMode } });
}
</script>
<template>
<Page title="登录过期演示">
<template #description>
<div class="mt-2 text-foreground/80">
接口请求遇到401状态码时需要重新登录有两种方式
<p>1.转到登录页登录成功后跳转回原页面</p>
<p>
2.弹出重新登录弹窗登录后关闭弹窗不进行任何页面跳转刷新后还是会跳转登录页面
</p>
</div>
</template>
<Card class="mb-5" title="跳转登录页面方式">
<Button type="primary" @click="handleClick('page')"> 点击触发 </Button>
</Card>
<Card class="mb-5" title="登录弹窗方式">
<Button type="primary" @click="handleClick('modal')"> 点击触发 </Button>
</Card>
</Page>
</template>