feat:增加主应用用户信息下发
This commit is contained in:
parent
8174af4413
commit
90ad8a972f
|
|
@ -8,12 +8,12 @@
|
||||||
"start:base": "cd platform/base && pnpm start",
|
"start:base": "cd platform/base && pnpm start",
|
||||||
"start:workbench": "cd platform/workbench && pnpm start",
|
"start:workbench": "cd platform/workbench && pnpm start",
|
||||||
"build": "npm-run-all build:* && bash ./scripts/bundle.sh",
|
"build": "npm-run-all build:* && bash ./scripts/bundle.sh",
|
||||||
"build:main": "cd platform/main && pnpm run build",
|
"build:main": "cd platformconsole.log(modules.user.token)/main && pnpm run build",
|
||||||
"build:base": "cd platform/base && pnpm run build",
|
"build:base": "cd platform/base && pnpm run build",
|
||||||
"build:workbench": "cd platform/workbench && pnpm run build"
|
"build:workbench": "cd platform/workbench && pnpm run build"
|
||||||
},
|
},
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"author": "",
|
"author": "quality",
|
||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"eslint-plugin-vue": "^9.9.0",
|
"eslint-plugin-vue": "^9.9.0",
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,7 @@
|
||||||
"axios": "^1.3.4",
|
"axios": "^1.3.4",
|
||||||
"js-md5": "^0.7.3",
|
"js-md5": "^0.7.3",
|
||||||
"lodash": "^4.17.21",
|
"lodash": "^4.17.21",
|
||||||
|
"qiankun": "^2.0.22",
|
||||||
"qs": "^6.11.1"
|
"qs": "^6.11.1"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,53 +2,11 @@
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @param {vuex实例} store
|
* @param {Store} store
|
||||||
* @param {qiankun下发的props} props
|
* @param {Store} props
|
||||||
*/
|
*/
|
||||||
function registerGlobalModule (store, props = {}) {
|
function registerGlobalModule (store, props = {}) {
|
||||||
if (!store || !store.hasModule) {
|
|
||||||
return
|
|
||||||
}
|
}
|
||||||
// 获取初始化的state
|
|
||||||
const initState = props.getGlobalState && props.getGlobalState() || {
|
|
||||||
menu: [],
|
|
||||||
user: {}
|
|
||||||
}
|
|
||||||
// 将父应用的数据存储到子应用中,命名空间固定为global
|
|
||||||
if (!store.hasModule('global')) {
|
|
||||||
const globalModule = {
|
|
||||||
namespaced: true,
|
|
||||||
state: initState,
|
|
||||||
actions: {
|
|
||||||
// 子应用改变state并通知父应用
|
|
||||||
setGlobalState ({ commit }, payload) {
|
|
||||||
commit('setGlobalState', payload)
|
|
||||||
commit('emitGlobalState', payload)
|
|
||||||
},
|
|
||||||
// 初始化,只用于mount时同步父应用的数据
|
|
||||||
initGlobalState ({ commit }, payload) {
|
|
||||||
commit('setGlobalState', payload)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mutations: {
|
|
||||||
// 设置全局状态
|
|
||||||
setGlobalState (state, payload) {
|
|
||||||
// eslint-disable-next-line
|
|
||||||
state = Object.assign(state, payload);
|
|
||||||
},
|
|
||||||
// 通知父应用
|
|
||||||
emitGlobalState (state) {
|
|
||||||
if (props.setGlobalState) {
|
|
||||||
props.setGlobalState(state)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
store.registerModule('global', globalModule)
|
|
||||||
} else {
|
|
||||||
// 每次mount时,都同步一次父应用数据
|
|
||||||
store.dispatch('global/initGlobalState', initState)
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
export default registerGlobalModule
|
export default registerGlobalModule
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,23 @@
|
||||||
export type Props = {
|
|
||||||
|
interface Store{
|
||||||
routerBase:string,
|
routerBase:string,
|
||||||
getGlobalState:(key:string)=>BaseStore
|
getGlobalState:(key:keyof Userinfo)=>keyof Userinfo
|
||||||
|
onGlobalStateChange:(callback,prev)=>void
|
||||||
}
|
}
|
||||||
export interface BaseStore {
|
|
||||||
[key:string]:any
|
type User = {
|
||||||
|
name: string
|
||||||
|
nickname:string
|
||||||
|
active:number
|
||||||
}
|
}
|
||||||
|
type Userinfo = {
|
||||||
|
user:User
|
||||||
|
token:string
|
||||||
|
access:string,
|
||||||
|
apps:string[]
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export function getGlobalState(key:string);
|
export function getGlobalState(key:string);
|
||||||
|
|
|
||||||
|
|
@ -15,6 +15,7 @@ import i18n from './locale'
|
||||||
import SvgIcon from './components/svgIcon.vue'
|
import SvgIcon from './components/svgIcon.vue'
|
||||||
import draggable from 'vuedraggable'
|
import draggable from 'vuedraggable'
|
||||||
import {renderWithQiankun,qiankunWindow,QiankunProps} from "vite-plugin-qiankun/dist/helper"
|
import {renderWithQiankun,qiankunWindow,QiankunProps} from "vite-plugin-qiankun/dist/helper"
|
||||||
|
import {initQiankun} from "@/utils/app/qiankun";
|
||||||
let instance:any = null
|
let instance:any = null
|
||||||
const render = (props:QiankunProps={})=>{
|
const render = (props:QiankunProps={})=>{
|
||||||
const {container} = props
|
const {container} = props
|
||||||
|
|
@ -38,14 +39,17 @@ const initQianKun = ()=>{
|
||||||
bootstrap(){
|
bootstrap(){
|
||||||
console.log("bootstrap")
|
console.log("bootstrap")
|
||||||
},
|
},
|
||||||
mount(props){
|
mount(props:QiankunProps){
|
||||||
console.log("mount")
|
console.log('基座下发的能力:', props);
|
||||||
|
initQiankun(props.getGlobalState())
|
||||||
render(props)
|
render(props)
|
||||||
},
|
},
|
||||||
unmount(props) {
|
unmount(props) {
|
||||||
console.log('微应用:unmount', props)
|
console.log('微应用:unmount', props)
|
||||||
|
instance.unmount()
|
||||||
},
|
},
|
||||||
update(props) {
|
update(props) {
|
||||||
|
initQiankun(props.getGlobalState())
|
||||||
console.log('微应用:update', props)
|
console.log('微应用:update', props)
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
@ -53,16 +57,7 @@ const initQianKun = ()=>{
|
||||||
|
|
||||||
qiankunWindow.__POWERED_BY_QIANKUN__ ? initQianKun() : render()
|
qiankunWindow.__POWERED_BY_QIANKUN__ ? initQianKun() : render()
|
||||||
console.log('__POWERED_BY_QIANKUN__:',qiankunWindow.__POWERED_BY_QIANKUN__);
|
console.log('__POWERED_BY_QIANKUN__:',qiankunWindow.__POWERED_BY_QIANKUN__);
|
||||||
export function mount(props:any){
|
|
||||||
console.log('基座下发的能力:', props);
|
|
||||||
render(props)
|
|
||||||
// return new Promise(((resolve, reject) => {
|
|
||||||
// render(props)
|
|
||||||
// reject(new Error('hi'));
|
|
||||||
// // resolve()
|
|
||||||
// }))
|
|
||||||
|
|
||||||
}
|
|
||||||
export async function unmount(){
|
export async function unmount(){
|
||||||
instance.unmount()
|
instance.unmount()
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -39,4 +39,3 @@ export default createStore<RootState>({
|
||||||
strict: debug,
|
strict: debug,
|
||||||
plugins: debug ? [createLogger(), persistent] : [persistent],
|
plugins: debug ? [createLogger(), persistent] : [persistent],
|
||||||
});
|
});
|
||||||
console.log(modules.user.token)
|
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
import {loginApi, getInfoApi, loginOutApi, login} from "@/api/user";
|
import {loginApi, getInfoApi, loginOutApi, login} from "@/api/user";
|
||||||
import { ActionContext } from "vuex";
|
import { ActionContext } from "vuex";
|
||||||
import {logout, userInfo} from "@/api/work";
|
import {logout, userInfo} from "@/api/work";
|
||||||
|
import {QiankunProps} from "vite-plugin-qiankun/dist/helper";
|
||||||
|
|
||||||
export interface Info{
|
export interface Info{
|
||||||
abandon_flag:number,
|
abandon_flag:number,
|
||||||
|
|
@ -41,6 +42,13 @@ const mutations = {
|
||||||
infoChange(state: userState, info: Info) {
|
infoChange(state: userState, info: Info) {
|
||||||
state.info = info;
|
state.info = info;
|
||||||
},
|
},
|
||||||
|
// 初始化用户数据
|
||||||
|
init(state: userState, qiankun: QiankunProps) {
|
||||||
|
state.token = qiankun.token
|
||||||
|
Object.keys(qiankun.user).forEach(key=>{
|
||||||
|
state.info[key] = qiankun.user[key]
|
||||||
|
})
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
// actions
|
// actions
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
import {QiankunProps} from "vite-plugin-qiankun/dist/helper";
|
||||||
|
import Store from "@/store/index"
|
||||||
|
const qiankun:QiankunProps = {}
|
||||||
|
|
||||||
|
|
||||||
|
export const initQiankun = (props:QiankunProps) =>{
|
||||||
|
Store.commit("user/init",props)
|
||||||
|
Object.keys(props).forEach(key=>{
|
||||||
|
qiankun[key] = props[key]
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
export const setQiankun = (data:object)=>{
|
||||||
|
qiankun.onGlobalStateChange(data)
|
||||||
|
}
|
||||||
|
export default qiankun
|
||||||
|
|
@ -202,7 +202,6 @@ export default defineComponent({
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
clearInterval(time)
|
clearInterval(time)
|
||||||
console.log(localStorage.getItem('endTime'))
|
|
||||||
},
|
},
|
||||||
onBeforeUnmount() {
|
onBeforeUnmount() {
|
||||||
clearInterval(time)
|
clearInterval(time)
|
||||||
|
|
|
||||||
|
|
@ -198,7 +198,6 @@ export default defineComponent({
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
clearInterval(time)
|
clearInterval(time)
|
||||||
console.log(localStorage.getItem('endTime'))
|
|
||||||
},
|
},
|
||||||
onBeforeUnmount() {
|
onBeforeUnmount() {
|
||||||
clearInterval(time)
|
clearInterval(time)
|
||||||
|
|
|
||||||
|
|
@ -173,7 +173,6 @@ export default defineComponent({
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
clearInterval(time)
|
clearInterval(time)
|
||||||
console.log(localStorage.getItem('endTime'))
|
|
||||||
},
|
},
|
||||||
onBeforeUnmount() {
|
onBeforeUnmount() {
|
||||||
clearInterval(time)
|
clearInterval(time)
|
||||||
|
|
|
||||||
|
|
@ -239,7 +239,6 @@ export default defineComponent({
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
clearInterval(time)
|
clearInterval(time)
|
||||||
console.log(localStorage.getItem('endTime'))
|
|
||||||
},
|
},
|
||||||
onBeforeUnmount() {
|
onBeforeUnmount() {
|
||||||
clearInterval(time)
|
clearInterval(time)
|
||||||
|
|
|
||||||
|
|
@ -49,7 +49,7 @@ class HttpEditComponent extends Component<stepProps, State> {
|
||||||
state.data.url.method = value
|
state.data.url.method = value
|
||||||
this.setState(state)
|
this.setState(state)
|
||||||
}
|
}
|
||||||
onChange = (key:keyof HttpData,data: allData) => {
|
onChange = (key:keyof allData,data: allData) => {
|
||||||
console.log(key,data);
|
console.log(key,data);
|
||||||
const state = this.state.data
|
const state = this.state.data
|
||||||
state[key] = data
|
state[key] = data
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,7 @@ interface ParamsDict {
|
||||||
[key:string]:string
|
[key:string]:string
|
||||||
}
|
}
|
||||||
type allData = HostData|HeaderData|ParamsData|BeforeRequestData|ResponseData|CheckData|OptionsData|ExtractData
|
type allData = HostData|HeaderData|ParamsData|BeforeRequestData|ResponseData|CheckData|OptionsData|ExtractData
|
||||||
|
type a = keyof HttpData
|
||||||
interface HttpMethod{
|
interface HttpMethod{
|
||||||
type:string
|
type:string
|
||||||
data:allData
|
data:allData
|
||||||
|
|
@ -18,7 +19,7 @@ interface HttpChilProps{
|
||||||
}
|
}
|
||||||
interface HttpProps<T extends allData>{
|
interface HttpProps<T extends allData>{
|
||||||
data:T
|
data:T
|
||||||
onchange:(key:string,data:T)=>void
|
onchange:(key:keyof T,data:T)=>void
|
||||||
}
|
}
|
||||||
interface HttpState<T extends allData>{
|
interface HttpState<T extends allData>{
|
||||||
options:T
|
options:T
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,6 @@ import "./assets/icons/svg/index"
|
||||||
import microApps from './micro-app'
|
import microApps from './micro-app'
|
||||||
import 'nprogress/nprogress.css'
|
import 'nprogress/nprogress.css'
|
||||||
|
|
||||||
import registerGlobalModule from "@quality/common/store/global-register";
|
|
||||||
|
|
||||||
Vue.config.productionTip = false
|
Vue.config.productionTip = false
|
||||||
|
|
||||||
|
|
@ -22,9 +21,9 @@ console.log(microApps.apps)
|
||||||
// 子应用统一由后台管理,
|
// 子应用统一由后台管理,
|
||||||
// 给子应用配置加上loader方法
|
// 给子应用配置加上loader方法
|
||||||
const apps = microApps.apps.map(item => {
|
const apps = microApps.apps.map(item => {
|
||||||
|
console.log(item)
|
||||||
return {
|
return {
|
||||||
...item,
|
...item,
|
||||||
props:{},
|
|
||||||
loader
|
loader
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,7 @@ import store from './store'
|
||||||
const micro = {
|
const micro = {
|
||||||
apps:[],
|
apps:[],
|
||||||
getApps: ()=>{
|
getApps: ()=>{
|
||||||
micro.apps = microApps
|
micro.apps = apps
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -13,14 +13,12 @@ const microApps = [
|
||||||
name: 'base',
|
name: 'base',
|
||||||
title: '工作台',
|
title: '工作台',
|
||||||
entry: process.env.VUE_APP_SUB_BASE,
|
entry: process.env.VUE_APP_SUB_BASE,
|
||||||
container:"#subapp-viewport",
|
|
||||||
activeRule: '/base'
|
activeRule: '/base'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'workbench',
|
name: 'workbench',
|
||||||
title: '工作台2',
|
title: '工作台2',
|
||||||
entry: process.env.VUE_APP_SUB_WORKBENCH,
|
entry: process.env.VUE_APP_SUB_WORKBENCH,
|
||||||
container:"#subapp-viewport",
|
|
||||||
activeRule: '/workbench'
|
activeRule: '/workbench'
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
|
|
|
||||||
|
|
@ -4,11 +4,19 @@ import Vue from 'vue'
|
||||||
// 父应用的初始state
|
// 父应用的初始state
|
||||||
// Vue.observable是为了让initialState变成可响应:https://cn.vuejs.org/v2/api/#Vue-observable。
|
// Vue.observable是为了让initialState变成可响应:https://cn.vuejs.org/v2/api/#Vue-observable。
|
||||||
const initialState = Vue.observable({
|
const initialState = Vue.observable({
|
||||||
|
// 用户信息
|
||||||
user: {
|
user: {
|
||||||
name: '',
|
name: null,
|
||||||
token:"",
|
nickname:null,
|
||||||
loginTime:null
|
active:0
|
||||||
}
|
},
|
||||||
|
// token
|
||||||
|
token:null,
|
||||||
|
// 默认访问
|
||||||
|
access:null,
|
||||||
|
// 可访问的应用
|
||||||
|
apps:[]
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
36614
pnpm-lock.yaml
36614
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue