85 lines
2.0 KiB
Markdown
85 lines
2.0 KiB
Markdown
# Common Features
|
|
|
|
A collection of some commonly used features.
|
|
|
|
## Login Authentication Expiry
|
|
|
|
When the interface returns a `401` status code, the framework will consider the login authentication to have expired. Upon login timeout, it will redirect to the login page or open a login popup. This can be configured in `preferences.ts` in the application directory:
|
|
|
|
### Redirect to Login Page
|
|
|
|
Upon login timeout, it will redirect to the login page.
|
|
|
|
```ts
|
|
import { defineOverridesPreferences } from '@vben/preferences';
|
|
|
|
export const overridesPreferences = defineOverridesPreferences({
|
|
// overrides
|
|
app: {
|
|
loginExpiredMode: 'page',
|
|
},
|
|
});
|
|
```
|
|
|
|
### Open Login Popup
|
|
|
|
When login times out, a login popup will open.
|
|
|
|
|
|
|
|
Configuration:
|
|
|
|
```ts
|
|
import { defineOverridesPreferences } from '@vben/preferences';
|
|
|
|
export const overridesPreferences = defineOverridesPreferences({
|
|
// overrides
|
|
app: {
|
|
loginExpiredMode: 'modal',
|
|
},
|
|
});
|
|
```
|
|
|
|
## Dynamic Title
|
|
|
|
- Default value: `true`
|
|
|
|
When enabled, the webpage title changes according to the route's `title`. You can enable or disable this in the `preferences.ts` file in your application directory.
|
|
|
|
```ts
|
|
export const overridesPreferences = defineOverridesPreferences({
|
|
// overrides
|
|
app: {
|
|
dynamicTitle: true,
|
|
},
|
|
});
|
|
```
|
|
|
|
## Page Watermark
|
|
|
|
- Default value: `false`
|
|
|
|
When enabled, the webpage will display a watermark. You can enable or disable this in the `preferences.ts` file in your application directory.
|
|
|
|
```ts
|
|
export const overridesPreferences = defineOverridesPreferences({
|
|
// overrides
|
|
app: {
|
|
watermark: true,
|
|
},
|
|
});
|
|
```
|
|
|
|
If you want to update the content of the watermark, you can do so. The parameters can be referred to [watermark-js-plus](https://zhensherlock.github.io/watermark-js-plus/):
|
|
|
|
```ts
|
|
import { useWatermark } from '@vben/hooks';
|
|
|
|
const { destroyWatermark, updateWatermark } = useWatermark();
|
|
|
|
await updateWatermark({
|
|
// watermark content
|
|
content: 'hello my watermark',
|
|
});
|
|
```
|