mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-08-27 15:59:33 +08:00
feat: And surface switching loading optimization
This commit is contained in:
@@ -6,13 +6,14 @@ import SwitchItem from '../switch-item.vue';
|
||||
defineOptions({
|
||||
name: 'PreferenceAnimation',
|
||||
});
|
||||
|
||||
const transitionProgress = defineModel<boolean>('transitionProgress', {
|
||||
// 默认值
|
||||
default: false,
|
||||
});
|
||||
|
||||
const transitionName = defineModel<string>('transitionName');
|
||||
const transitionEnable = defineModel<boolean>('transitionEnable');
|
||||
const transitionLoading = defineModel<boolean>('transitionLoading');
|
||||
|
||||
const transitionPreset = ['fade', 'fade-slide', 'fade-up', 'fade-down'];
|
||||
|
||||
@@ -23,10 +24,13 @@ function handleClick(value: string) {
|
||||
|
||||
<template>
|
||||
<SwitchItem v-model="transitionProgress">
|
||||
{{ $t('preferences.page-progress') }}
|
||||
{{ $t('preferences.animation.progress') }}
|
||||
</SwitchItem>
|
||||
<SwitchItem v-model="transitionLoading">
|
||||
{{ $t('preferences.animation.loading') }}
|
||||
</SwitchItem>
|
||||
<SwitchItem v-model="transitionEnable">
|
||||
{{ $t('preferences.page-transition') }}
|
||||
{{ $t('preferences.animation.transition') }}
|
||||
</SwitchItem>
|
||||
<div
|
||||
v-if="transitionEnable"
|
||||
|
@@ -42,6 +42,7 @@ import Preferences from './preferences.vue';
|
||||
:theme-mode="preferences.theme.mode"
|
||||
:theme-radius="preferences.theme.radius"
|
||||
:transition-enable="preferences.transition.enable"
|
||||
:transition-loading="preferences.transition.loading"
|
||||
:transition-name="preferences.transition.name"
|
||||
:transition-progress="preferences.transition.progress"
|
||||
@update:app-ai-assistant="
|
||||
@@ -143,6 +144,9 @@ import Preferences from './preferences.vue';
|
||||
@update:transition-enable="
|
||||
(val) => updatePreferences({ transition: { enable: val } })
|
||||
"
|
||||
@update:transition-loading="
|
||||
(val) => updatePreferences({ transition: { loading: val } })
|
||||
"
|
||||
@update:transition-name="
|
||||
(val) => updatePreferences({ transition: { name: val } })
|
||||
"
|
||||
|
@@ -64,6 +64,7 @@ const appContentCompact = defineModel<ContentCompactType>('appContentCompact');
|
||||
|
||||
const transitionProgress = defineModel<boolean>('transitionProgress');
|
||||
const transitionName = defineModel<string>('transitionName');
|
||||
const transitionLoading = defineModel<boolean>('transitionLoading');
|
||||
const transitionEnable = defineModel<boolean>('transitionEnable');
|
||||
|
||||
const themeColorPrimary = defineModel<string>('themeColorPrimary');
|
||||
@@ -209,9 +210,10 @@ function handleReset() {
|
||||
/>
|
||||
</Block>
|
||||
|
||||
<Block :title="$t('preferences.animation')">
|
||||
<Block :title="$t('preferences.animation.name')">
|
||||
<Animation
|
||||
v-model:transition-enable="transitionEnable"
|
||||
v-model:transition-loading="transitionLoading"
|
||||
v-model:transition-name="transitionName"
|
||||
v-model:transition-progress="transitionProgress"
|
||||
/>
|
||||
|
Reference in New Issue
Block a user