czh-20260603-前端界面美化,添加背景图片

This commit is contained in:
zhihao
2026-06-03 16:56:38 +08:00
parent c22da8a67a
commit 3cfbd1d465
15 changed files with 130 additions and 77 deletions
+39 -40
View File
@@ -23,23 +23,23 @@
<!-- action -->
<div :class="`${prefixCls}-action`">
<AppSearch :class="`${prefixCls}-action__item `" v-if="getShowSearch" />
<AppSearch :class="`${prefixCls}-action__item `" v-if="false" />
<ErrorAction v-if="getUseErrorHandle" :class="`${prefixCls}-action__item error-action`" />
<Notify v-if="getShowNotice" :class="`${prefixCls}-action__item notify-item`" />
<Notify v-if="false" :class="`${prefixCls}-action__item notify-item`" />
<FullScreen v-if="getShowFullScreen" :class="`${prefixCls}-action__item fullscreen-item`" />
<LockScreen v-if="getUseLockPage" />
<AppLocalePicker v-if="getShowLocalePicker" :reload="true" :showText="false" :class="`${prefixCls}-action__item`" />
<AppLocalePicker v-if="false" :reload="true" :showText="false" :class="`${prefixCls}-action__item`" />
<SettingDrawer v-if="false" :class="`${prefixCls}-action__item`" />
<!-- ai助手 -->
<Aide v-if="false"></Aide>
<UserDropDown :theme="getHeaderTheme" />
<SettingDrawer v-if="getShowSetting" :class="`${prefixCls}-action__item`" />
<!-- ai助手 -->
<Aide v-if="getAiIconShow"></Aide>
</div>
</Header>
<LoginSelect ref="loginSelectRef" @success="loginSelectOk"></LoginSelect>
@@ -54,7 +54,7 @@
import LayoutMenu from '../menu/index.vue';
import LayoutTrigger from '../trigger/index.vue';
import { AppSearch } from '/@/components/Application';
// import { AppSearch } from '/@/components/Application';
import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting';
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
@@ -62,19 +62,19 @@
import { MenuModeEnum, MenuSplitTyeEnum } from '/@/enums/menuEnum';
import { SettingButtonPositionEnum } from '/@/enums/appEnum';
import { AppLocalePicker } from '/@/components/Application';
// import { AppLocalePicker } from '/@/components/Application';
import { UserDropDown, LayoutBreadcrumb, FullScreen, Notify, ErrorAction, LockScreen } from './components';
import { UserDropDown, LayoutBreadcrumb, FullScreen, ErrorAction, LockScreen } from './components';
import { useAppInject } from '/@/hooks/web/useAppInject';
import { useDesign } from '/@/hooks/web/useDesign';
import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
import { useLocale } from '/@/locales/useLocale';
// import { useLocale } from '/@/locales/useLocale';
import LoginSelect from '/@/views/sys/login/LoginSelect.vue';
import { useUserStore } from '/@/store/modules/user';
import { useI18n } from '/@/hooks/web/useI18n';
import Aide from "@/views/dashboard/ai/components/aide/index.vue"
// import Aide from "@/views/dashboard/ai/components/aide/index.vue"
const { t } = useI18n();
export default defineComponent({
@@ -86,17 +86,17 @@
LayoutBreadcrumb,
LayoutMenu,
UserDropDown,
AppLocalePicker,
// AppLocalePicker,
FullScreen,
Notify,
AppSearch,
// Notify,
// AppSearch,
ErrorAction,
LockScreen,
LoginSelect,
SettingDrawer: createAsyncComponent(() => import('/@/layouts/default/setting/index.vue'), {
loading: true,
}),
Aide
// SettingDrawer: createAsyncComponent(() => import('/@/layouts/default/setting/index.vue'), {
// loading: true,
// }),
// Aide
},
props: {
fixed: propTypes.bool,
@@ -105,23 +105,23 @@
const { prefixCls } = useDesign('layout-header');
const userStore = useUserStore();
const { getShowTopMenu, getShowHeaderTrigger, getSplit, getIsMixMode, getMenuWidth, getIsMixSidebar } = useMenuSetting();
const { getUseErrorHandle, getShowSettingButton, getSettingButtonPosition, getAiIconShow } = useRootSetting();
const { getUseErrorHandle, /* getShowSettingButton, getSettingButtonPosition, getAiIconShow */ } = useRootSetting();
const { title } = useGlobSetting();
const {
getHeaderTheme,
getShowFullScreen,
getShowNotice,
// getShowNotice,
getShowContent,
getShowBread,
getShowHeaderLogo,
getShowHeader,
getShowSearch,
// getShowSearch,
getUseLockPage,
getShowBreadTitle,
} = useHeaderSetting();
const { getShowLocalePicker } = useLocale();
// const { getShowLocalePicker } = useLocale();
const { getIsMobile } = useAppInject();
@@ -137,17 +137,16 @@
];
});
const getShowSetting = computed(() => {
if (!unref(getShowSettingButton)) {
return false;
}
const settingButtonPosition = unref(getSettingButtonPosition);
if (settingButtonPosition === SettingButtonPositionEnum.AUTO) {
return unref(getShowHeader);
}
return settingButtonPosition === SettingButtonPositionEnum.HEADER;
});
// const getShowSetting = computed(() => {
// if (!unref(getShowSettingButton)) {
// return false;
// }
// const settingButtonPosition = unref(getSettingButtonPosition);
// if (settingButtonPosition === SettingButtonPositionEnum.AUTO) {
// return unref(getShowHeader);
// }
// return settingButtonPosition === SettingButtonPositionEnum.HEADER;
// });
const getLogoWidth = computed(() => {
if (!unref(getIsMixMode) || unref(getIsMobile)) {
@@ -202,21 +201,21 @@
getSplit,
getMenuMode,
getShowTopMenu,
getShowLocalePicker,
// getShowLocalePicker,
getShowFullScreen,
getShowNotice,
// getShowNotice,
getUseErrorHandle,
getLogoWidth,
getIsMixSidebar,
getShowSettingButton,
getShowSetting,
getShowSearch,
// getShowSettingButton,
// getShowSetting,
// getShowSearch,
getUseLockPage,
loginSelectOk,
loginSelectRef,
title,
t,
getAiIconShow
// getAiIconShow
};
},
});