88 lines
2.5 KiB
JavaScript
88 lines
2.5 KiB
JavaScript
import {EpMenu} from "vue-icons-plus/ep";
|
|
|
|
import {computed, ref, onMounted, onUnmounted} from 'vue'
|
|
|
|
import SecuritySettings from '@/views/components/SecuritySettings/SecuritySettings.vue'
|
|
|
|
import ThirdPartyAuthorization from '@/views/components/ThirdPartyAuthorization/ThirdPartyAuthorization.vue'
|
|
|
|
import ConfigSettings from '@/views/components/ConfigSettings/ConfigSettings.vue'
|
|
|
|
import lang from '../../../i18n/i18n';
|
|
|
|
import GroupSettings from '../GroupSettings/GroupSettings.vue';
|
|
|
|
import RuleSettings from '../RuleSettings/RuleSettings.vue';
|
|
|
|
import UserManagement from '../UserManagement/UserManagement.vue';
|
|
|
|
import PluginSettings from '../PluginSettings/PluginSettings.vue';
|
|
|
|
import {useGlobalStatusStore} from "@/stores/useGlobalStatusStore";
|
|
|
|
import BrandLogo from '../BrandLogo/BrandLogo.vue';
|
|
|
|
export function usePage() {
|
|
const globalStatus = useGlobalStatusStore();
|
|
|
|
const userInfos = globalStatus.userInfos;
|
|
|
|
const isMobile = ref(window.innerWidth <= 768);
|
|
|
|
const handleResize = () => {
|
|
isMobile.value = window.innerWidth <= 768;
|
|
};
|
|
|
|
onMounted(() => {
|
|
window.addEventListener('resize', handleResize);
|
|
});
|
|
|
|
onUnmounted(() => {
|
|
window.removeEventListener('resize', handleResize);
|
|
});
|
|
|
|
const settingsMenu = computed(() => [
|
|
{ key: 'security', label: lang.security, component: SecuritySettings, capability: 'password.change_own' },
|
|
{ key: 'third-party', label: '第三方授权', component: ThirdPartyAuthorization, capability: 'plugin.write_own' },
|
|
{ key: 'config', label: '配置管理', component: ConfigSettings, capability: 'config.read' },
|
|
{ key: 'group', label: lang.group_settings, component: GroupSettings, capability: 'user.read' },
|
|
{ key: 'rule', label: lang.rule_setting, component: RuleSettings, capability: 'user.read' },
|
|
{ key: 'users', label: lang.user_management, component: UserManagement, capability: 'user.manage' },
|
|
{ key: 'plugins', label: lang.plugin_settings, component: PluginSettings, capability: 'plugin.read' },
|
|
].filter(item => globalStatus.hasCapability(item.capability)))
|
|
|
|
return {
|
|
EpMenu,
|
|
ref,
|
|
onMounted,
|
|
onUnmounted,
|
|
SecuritySettings,
|
|
ThirdPartyAuthorization,
|
|
ConfigSettings,
|
|
lang,
|
|
GroupSettings,
|
|
RuleSettings,
|
|
UserManagement,
|
|
PluginSettings,
|
|
useGlobalStatusStore,
|
|
BrandLogo,
|
|
globalStatus,
|
|
userInfos,
|
|
isMobile,
|
|
handleResize,
|
|
settingsMenu
|
|
}
|
|
}
|
|
|
|
export {
|
|
EpMenu,
|
|
BrandLogo,
|
|
SecuritySettings,
|
|
ThirdPartyAuthorization,
|
|
ConfigSettings,
|
|
GroupSettings,
|
|
RuleSettings,
|
|
UserManagement,
|
|
PluginSettings
|
|
}
|