feat(projects): add configurable user name watermark option
This commit is contained in:
parent
39b89a1234
commit
7c3dac4212
@ -4,6 +4,7 @@ import { NConfigProvider, darkTheme } from 'naive-ui';
|
|||||||
import type { WatermarkProps } from 'naive-ui';
|
import type { WatermarkProps } from 'naive-ui';
|
||||||
import { useAppStore } from './store/modules/app';
|
import { useAppStore } from './store/modules/app';
|
||||||
import { useThemeStore } from './store/modules/theme';
|
import { useThemeStore } from './store/modules/theme';
|
||||||
|
import { useAuthStore } from './store/modules/auth';
|
||||||
import { naiveDateLocales, naiveLocales } from './locales/naive';
|
import { naiveDateLocales, naiveLocales } from './locales/naive';
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
@ -12,6 +13,7 @@ defineOptions({
|
|||||||
|
|
||||||
const appStore = useAppStore();
|
const appStore = useAppStore();
|
||||||
const themeStore = useThemeStore();
|
const themeStore = useThemeStore();
|
||||||
|
const authStore = useAuthStore();
|
||||||
|
|
||||||
const naiveDarkTheme = computed(() => (themeStore.darkMode ? darkTheme : undefined));
|
const naiveDarkTheme = computed(() => (themeStore.darkMode ? darkTheme : undefined));
|
||||||
|
|
||||||
@ -24,8 +26,13 @@ const naiveDateLocale = computed(() => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
const watermarkProps = computed<WatermarkProps>(() => {
|
const watermarkProps = computed<WatermarkProps>(() => {
|
||||||
|
const content =
|
||||||
|
themeStore.watermark.enableUserName && authStore.userInfo.userName
|
||||||
|
? authStore.userInfo.userName
|
||||||
|
: themeStore.watermark.text;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
content: themeStore.watermark.text,
|
content,
|
||||||
cross: true,
|
cross: true,
|
||||||
fullscreen: true,
|
fullscreen: true,
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
|
@ -117,7 +117,10 @@ const isWrapperScrollMode = computed(() => themeStore.layout.scrollMode === 'wra
|
|||||||
<SettingItem key="8" :label="$t('theme.watermark.visible')">
|
<SettingItem key="8" :label="$t('theme.watermark.visible')">
|
||||||
<NSwitch v-model:value="themeStore.watermark.visible" />
|
<NSwitch v-model:value="themeStore.watermark.visible" />
|
||||||
</SettingItem>
|
</SettingItem>
|
||||||
<SettingItem v-if="themeStore.watermark.visible" key="8-1" :label="$t('theme.watermark.text')">
|
<SettingItem v-if="themeStore.watermark.visible" key="8-1" :label="$t('theme.watermark.enableUserName')">
|
||||||
|
<NSwitch v-model:value="themeStore.watermark.enableUserName" />
|
||||||
|
</SettingItem>
|
||||||
|
<SettingItem v-if="themeStore.watermark.visible" key="8-2" :label="$t('theme.watermark.text')">
|
||||||
<NInput
|
<NInput
|
||||||
v-model:value="themeStore.watermark.text"
|
v-model:value="themeStore.watermark.text"
|
||||||
autosize
|
autosize
|
||||||
|
@ -143,7 +143,8 @@ const local: App.I18n.Schema = {
|
|||||||
},
|
},
|
||||||
watermark: {
|
watermark: {
|
||||||
visible: 'Watermark Full Screen Visible',
|
visible: 'Watermark Full Screen Visible',
|
||||||
text: 'Watermark Text'
|
text: 'Watermark Text',
|
||||||
|
enableUserName: 'Enable User Name Watermark'
|
||||||
},
|
},
|
||||||
themeDrawerTitle: 'Theme Configuration',
|
themeDrawerTitle: 'Theme Configuration',
|
||||||
pageFunTitle: 'Page Function',
|
pageFunTitle: 'Page Function',
|
||||||
|
@ -143,7 +143,8 @@ const local: App.I18n.Schema = {
|
|||||||
},
|
},
|
||||||
watermark: {
|
watermark: {
|
||||||
visible: '显示全屏水印',
|
visible: '显示全屏水印',
|
||||||
text: '水印文本'
|
text: '水印文本',
|
||||||
|
enableUserName: '启用用户名水印'
|
||||||
},
|
},
|
||||||
themeDrawerTitle: '主题配置',
|
themeDrawerTitle: '主题配置',
|
||||||
pageFunTitle: '页面功能',
|
pageFunTitle: '页面功能',
|
||||||
|
@ -58,7 +58,8 @@ export const themeSettings: App.Theme.ThemeSetting = {
|
|||||||
},
|
},
|
||||||
watermark: {
|
watermark: {
|
||||||
visible: false,
|
visible: false,
|
||||||
text: 'SoybeanAdmin'
|
text: 'SoybeanAdmin',
|
||||||
|
enableUserName: false
|
||||||
},
|
},
|
||||||
tokens: {
|
tokens: {
|
||||||
light: {
|
light: {
|
||||||
|
3
src/typings/app.d.ts
vendored
3
src/typings/app.d.ts
vendored
@ -112,6 +112,8 @@ declare namespace App {
|
|||||||
visible: boolean;
|
visible: boolean;
|
||||||
/** Watermark text */
|
/** Watermark text */
|
||||||
text: string;
|
text: string;
|
||||||
|
/** Whether to use user name as watermark text */
|
||||||
|
enableUserName: boolean;
|
||||||
};
|
};
|
||||||
/** define some theme settings tokens, will transform to css variables */
|
/** define some theme settings tokens, will transform to css variables */
|
||||||
tokens: {
|
tokens: {
|
||||||
@ -408,6 +410,7 @@ declare namespace App {
|
|||||||
watermark: {
|
watermark: {
|
||||||
visible: string;
|
visible: string;
|
||||||
text: string;
|
text: string;
|
||||||
|
enableUserName: string;
|
||||||
};
|
};
|
||||||
themeDrawerTitle: string;
|
themeDrawerTitle: string;
|
||||||
pageFunTitle: string;
|
pageFunTitle: string;
|
||||||
|
Loading…
Reference in New Issue
Block a user