/** * Admin Framework * Version: 1.0.0 */ // 引入核心依赖 import Vue from 'vue' import VueRouter from 'vue-router' import Vuex from 'vuex' import ViewUI from 'view-design' // 引入样式 import 'view-design/dist/styles/iview.css' import './assets/css/animate.css' import './assets/css/base.less' import './assets/css/ivewExpand.less' import './assets/icons/iconfont.css' import uiTool from './utils/uiTool' import http from './utils/http' import * as tools from './utils/tools' import storeModules, { createStore } from './store' import { createBaseRoutes, setupRouterGuards, createRouter, getRoutes } from './router' import components ,{ registerGlobalComponents, registerComponents} from './components/index' import pages from './views/index' const { LoginPage, Page401, Page404, Page500, setupComponentMap } = pages // 导入页面组件 import Main from './components/main' import ParentView from './components/parent-view' import * as systemApi from './api/system' class AdminFramework { constructor() { this.version = '1.0.0' this.config = {} this.store = null this.router = null this.HomePage = pages.HomePage // 默认使用框架内置的 HomePage this.tools = tools this.uiTool = uiTool this.http = http this.storeModules = storeModules this.createBaseRoutes = createBaseRoutes this.setupRouterGuards = setupRouterGuards this.registerComponents = registerComponents this.pages = pages this.components = components this.systemApi = systemApi } /** * Add custom component map * @param {Object} customMap - custom component map * @example * AdminFramework.addComponentMap({ * 'ball/games.vue': GamesComponent, * 'order/pay_orders.vue': PayOrdersComponent * }) */ addComponentMap(customMap) { setupComponentMap(customMap, uiTool) } /** * Init HTTP config * @param {Object} config - HTTP config * @param {Object} store - Vuex Store instance */ initHttp(config, store) { http.init(config, store) this.store = store } /** * Create app with simplified API (推荐使用) * @param {Object} config - application config * @param {String} config.title - application title * @param {String} config.apiUrl - API base URL * @param {String} config.uploadUrl - upload URL (可选,默认为 apiUrl + 'upload') * @param {Object} config.componentMap - custom component map (optional) * @param {Component} config.HomePage - custom home page component (optional) * @param {Function} config.onReady - callback when app is ready (optional) * @returns {Object} Vue instance */ createApp(config = {}) { // 如果没有提供 uploadUrl,自动从 apiUrl 推导 if (!config.uploadUrl && config.apiUrl) { config.uploadUrl = config.apiUrl + (config.apiUrl.endsWith('/') ? 'upload' : '/upload') } // 如果提供了自定义 HomePage,使用自定义的,否则使用默认的 if (config.HomePage) { this.HomePage = config.HomePage } // 设置配置 this.config = config // 初始化 Vue 插件 Vue.use(ViewUI) Vue.use(VueRouter) Vue.use(Vuex) // 设置全局属性 Vue.prototype.$config = config Vue.prototype.$http = http Vue.prototype.$tools = tools Vue.prototype.$uiTool = uiTool Vue.prototype.$framework = this // 注册全局组件 registerGlobalComponents(Vue) // 设置组件映射 setupComponentMap(config.componentMap || {}, uiTool) // 创建 Store if (!this.store) { this.store = createStore(Vuex, {}, null) http.init(config, this.store) } // 创建 Router if (!this.router) { const mainRoute = getRoutes({ Main, ParentView, Page404, HomePage: this.HomePage }, uiTool) this.router = createRouter(VueRouter, { Main, ParentView, LoginPage, Page401, Page404, Page500 }, mainRoute ? [mainRoute] : [], ViewUI) } // Create Vue instance with auto menu/title restoration const app = new Vue({ router: this.router, store: this.store, render: h => h('router-view'), async created() { // 初始化响应式 rem 设置 uiTool.setRem() // 监听窗口大小变化,重新设置 rem window.addEventListener('resize', () => { uiTool.setRem() }) console.log('=== Admin Framework App Started ===') console.log('Framework Version:', framework.version) console.log('Config:', this.$config) // Auto restore menu and title on refresh const token = this.$store.state.user.token const authorityMenus = localStorage.getItem('authorityMenus') if (token && authorityMenus) { console.log('Restoring menu and title...') try { // Restore menu await this.$store.dispatch('user/setAuthorityMenus', { Main: framework.Main, ParentView: framework.ParentView, Page404: framework.Page404, authorityMenus: authorityMenus }) console.log('Menu restored') // Get system title await this.$store.dispatch('app/getSysTitle', { defaultTitle: this.$config.title, defaultLogo: '' }) } catch (error) { console.error('Restore failed:', error) } } else { // Not logged in, use default title console.log('Not logged in, using default title') document.title = this.$config.title } // Call user callback if provided if (config.onReady && typeof config.onReady === 'function') { config.onReady.call(this) } } }) // Expose to global for debugging if (typeof window !== 'undefined') { window.rootVue = app window.framework = framework } return app } } const framework = new AdminFramework() // 【关键】框架实例创建后立即暴露到全局,确保在任何地方都能访问 if (typeof window !== 'undefined') { window.framework = framework } export default framework