Files
admin-vben5/apps/web-antd/src/views/demos/features/login-expired/index.vue
Vben 376fd17a61 feat: Feature/pro docs (#70)
* chore: merge main

* feat: update docs

* feat: remove coze-assistant

* feat: add watermark plugin

* feat: update preferences

* feat: update docs

---------

Co-authored-by: vince <vince292007@gmail.com>
2024-07-28 14:29:05 +08:00

43 lines
1.4 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 { preferences, updatePreferences } from '@vben/preferences';
import { Button } from 'ant-design-vue';
import { getMockStatus } from '#/api';
async function handleClick(type: LoginExpiredModeType) {
const loginExpiredMode = preferences.app.loginExpiredMode;
updatePreferences({ app: { loginExpiredMode: type } });
await getMockStatus('401');
updatePreferences({ app: { loginExpiredMode } });
}
</script>
<template>
<div class="p-5">
<div class="card-box p-5">
<h1 class="text-xl font-semibold">登录过期演示</h1>
<div class="text-foreground/80 mt-2">
接口请求遇到401状态码时需要重新登录有两种方式
<div>1.转到登录页登录成功后跳转回原页面</div>
<div>
2.弹出重新登录弹窗登录后关闭弹窗不进行任何页面跳转刷新后调整登录页面
</div>
</div>
</div>
<div class="card-box mt-5 p-5">
<div class="mb-3 text-lg font-semibold">跳转登录页面方式</div>
<Button type="primary" @click="handleClick('page')"> 点击触发 </Button>
</div>
<div class="card-box mt-5 p-5">
<div class="mb-3 text-lg font-semibold">登录弹窗方式</div>
<Button type="primary" @click="handleClick('modal')"> 点击触发 </Button>
</div>
</div>
</template>