ttk-app-core
Version:
enterprise develop framework
492 lines (462 loc) • 14 kB
JavaScript
import React from 'react';
import { Menu } from 'edf-component';
import { action as MetaAction, AppLoader } from 'edf-meta-engine';
import { fromJS } from 'immutable';
import { history, fetch, environment } from 'edf-utils';
import config from './config';
import { log } from 'util';
import beta_top from './img/beta_top.png';
import beta_right from './img/beta_right.png';
class action {
constructor(option) {
this.metaAction = option.metaAction;
this.config = config.current;
this.webapi = this.config.webapi;
}
onInit = ({ component, injections }) => {
this.component = component;
this.injections = injections;
injections.reduce('init');
//没有token跳转到登录
if (!sessionStorage.getItem('_accessToken')) {
this.component.props.onRedirect(this.config.goAfterLogout);
return;
}
// //根据账号下企业list的情况做跳转
// let availableOrg = sessionStorage.getItem('currentOrgStatus');
// if (availableOrg == 1 || availableOrg == 2) {
// this.metaAction.sf('data.headCtrl', false);
// return;
// }
let ompArgs = JSON.parse(sessionStorage.getItem('ompArgs'));
if (ompArgs) {
if (Object.keys(ompArgs).includes('isOnlyContent')) {
ompArgs.isOnlyContent = !ompArgs.isOnlyContent;
}
this.metaAction.sf('data.app', fromJS(ompArgs));
}
this.load();
//history增加
history.listen('ttk-edf-app-simple-portal', this.listen);
};
//history增加
listen = (childApp, location, action) => {
const currentAppName = this.metaAction.gf('data.content.appName');
const targetAppName = childApp;
if (!targetAppName) {
this.injections.reduce('closeAll');
return;
}
if (targetAppName == currentAppName) {
return;
}
};
componentWillUnmount = () => {
history.unlisten('ttk-edf-app-simple-portal', this.listen);
};
windowClick = (e) => {
if (!document.getElementById('ttk-edf-app-simple-portal-search-id')) return;
const dom = document.getElementById('ttk-edf-app-simple-portal-search-id').parentNode;
if (!dom.contains(e.target)) {
this.metaAction.sf('data.animation1', 'out');
this.metaAction.sf('data.showPanel', 'none');
}
};
componentDidMount = () => {
//IE中无CustomEvent
(function () {
if (typeof window.CustomEvent === 'function') return false;
function CustomEvent(event, params) {
params = params || { bubbles: false, cancelable: false, detail: undefined };
var evt = document.createEvent('CustomEvent');
evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
return evt;
}
CustomEvent.prototype = window.Event.prototype;
window.CustomEvent = CustomEvent;
})();
(function () {
var throttle = function (type, name, obj) {
obj = obj || window;
var running = false;
var func = function () {
if (running) {
return;
}
running = true;
requestAnimationFrame(function () {
obj.dispatchEvent(new CustomEvent(name));
running = false;
});
};
if (obj.addEventListener) {
obj.addEventListener(type, func);
}
else if (obj.attachEvent) {
obj.attachEvent(type, func);
}
};
throttle('resize', 'optimizedResize');
})();
//注册 resize 事件
if (window.addEventListener) {
window.addEventListener('optimizedResize', this.resize);
} else if (window.attachEvent) {
window.attachEvent('optimizedResize', this.resize);
}
};
load = async (option) => {
let response = await this.webapi.portal.portal();
if (option) {
response.org = Object.assign(response.org, option);
}
if (response.user) {
this.metaAction.context.set('currentUser', response.user);
}
if (response.org) {
this.metaAction.context.set('currentOrg', response.org);
}
if (response.menu) {
this.injections.reduce('load', { menu: response.menu });
}
};
getOrgs = async () => {
let manageList = await this.webapi.org.queryList();
this.injections.reduce('manageList', { manageList });
};
handleVisibleChange = (visible) => {
this.metaAction.sf('data.visible', visible);
};
animationEnd = () => {
this.metaAction.gf('data.animation') == 'out' && this.metaAction.sf('data.showPanel', 'none');
};
getCurrentUser = () => this.metaAction.context.get('currentUser') || {};
getCurrentOrg = () => this.metaAction.context.get('currentOrg') || {};
getOrgName = () => {
const org = this.getCurrentOrg();
if (org) {
return org.name;
}
return '';
};
resize = () => {
this.injections.reduce('resize');
let data = this.metaAction.gf('data') && this.metaAction.gf('data')
.toJS();
window.onresize = () => {
if (data.widthPersonStatus == false) {
let width = window.innerWidth > 1024 ? true : false;
this.metaAction.sf('data.width', width);
}
};
this.metaAction.sf('data.service.mathRandom', Math.random());
};
switchMenu = () => {
let flag = this.metaAction.gf('data')
.toJS();
this.metaAction.sf('data.width', !flag.width);
this.metaAction.sf('data.widthPersonStatus', true);
};
getMenuChildren = () => {
const menu = this.metaAction.gf('data.menu')
.toJS();
const loop = (children, num) => {
const ret = [];
if (num == 1) {
children.forEach(child => {
if (child.id != '1') {
ret.push({
name: child.key,
key: child.key,
className: '{{data.width ? \'level-first show-content\' : \'level-first hide-content\'}}',
title: child.children.length !== 0 && [{
name: 'title',
component: '::span',
className: 'leftNavMenu',
children: [{
name: 'icon',
component: 'Icon',
fontFamily: 'edficon',
className: 'menu-icon',
type: child.iconFont
}, {
name: 'title',
component: '::span',
className: 'menu-content',
children: child.name
}, {
name: 'badgeImg',
component: '::img',
_visible: child.versionTag == 1,
className: '{{data.width ? \'right_beta\' : \'top_beta\'}}',
src: '{{$getBeta()}}'
}]
}],
component: child.children.length == 0 ? 'Menu.Item' : 'Menu.SubMenu',
children: child.children.length == 0 ? [{
name: 'icon',
component: 'Icon',
fontFamily: 'edficon',
className: 'menu-icon',
type: child.iconFont //'link'
}, {
name: 'title',
component: '::span',
className: 'menu-content',
children: child.name
}] : loop(child.children, 2)
});
}
});
} else {
children.forEach(child => {
if (!child.children || child.children.length == 0) {
ret.push({
name: child.key,
key: child.key,
className: 'left-menu-submenu-menuitem',
component: 'Menu.Item',
children: child.name
});
} else {
ret.push({
name: child.key,
key: child.key,
className: 'left-menu-itemgroup',
title: {
name: 'title',
component: '::span',
children: child.name
},
component: 'Menu.ItemGroup',
children: loop(child.children, 2)
});
}
});
}
return ret;
};
return {
_isMeta: true,
value: loop(menu, 1)
};
};
//获取beta图片
// getBeta = () => {
// return this.metaAction.gf('data.width') ? beta_right : beta_top;
// };
createLink = () => {
let element = document.head.querySelector('.el-element');
let origin = location.origin;
let link = document.createElement('link');
link.className = 'el-element';
link.rel = 'stylesheet';
link.type = 'text/css';
link.id = 'skin';
return link;
};
topMenuClick = async (e) => {
this.metaAction.sf('data.userMenuVisible', false);
switch (e.key) {
case 'logout':
if (this.component.props.onRedirect && this.config.goAfterLogout) {
let res = await this.webapi.user.logout();
if (res) {
this.metaAction.context.set('currentUser', undefined);
this.metaAction.context.set('currentOrg', undefined);
sessionStorage.removeItem('mobile');
sessionStorage.removeItem('username');
sessionStorage.removeItem('_accessToken');
sessionStorage.removeItem('password');
this.component.props.onRedirect(this.config.goAfterLogout, localStorage && localStorage['ompKey'] && JSON.parse(localStorage['ompKey']));
}
}
break;
}
let selectedKeys = this.metaAction.gf('data.selectedKeys');
if (selectedKeys) {
selectedKeys = selectedKeys.toJS();
selectedKeys[0] = e.key;
this.metaAction.sf('data.selectedKeys', fromJS(selectedKeys));
}
};
menuClick = (e) => {
if (e.domEvent) {
e.domEvent.stopPropagation();
}
const menu = this.metaAction.gf('data.menu')
.toJS();
const find = (children) => {
for (let child of children) {
if (child.key == e.key) {
return child;
}
if (child.children) {
let o = find(child.children);
if (o) return o;
}
}
};
const hit = find(menu);
if (hit.appParams) {
hit.appParams.accessType = 0;
hit.appParams.isFolded = hit.isFolded;
} else {
hit.appParams = {
accessType: 0,
isFolded: hit.isFolded
};
}
hit.isFolded && hit.isFolded == 1 ? this.metaAction.sf('data.width', false) : this.metaAction.sf('data.width', true);
if (hit) {
this.setContent(hit.name, hit.appName, hit.appParams);
}
};
getMenuSelectKeys = () => {
return ['50'];
};
tabChange = (key) => {
if (key == 'more') return;
const openTabs = this.metaAction.gf('data.openTabs');
let curr = openTabs.find(o => o.get('name') == key);
let _app = curr.toJS();
if (_app.appProps) {
_app.appProps.accessType = 0;
} else {
_app.appProps = {
accessType: 0
};
}
_app.appProps.isFolded && _app.appProps.isFolded == 1 ? this.metaAction.sf('data.width', false) : this.metaAction.sf('data.width', true);
curr = fromJS(_app);
this.setContent(curr.get('name'), curr.get('appName'), curr.get('appProps'));
};
tabEdit = async (key, action) => {
if (key == 'more') return;
let that = this;
let status = false;
let openTabs = this.metaAction.gf('data.openTabs').toJS();
openTabs.forEach(o => {
if (o.name == key) {
status = o.editing;
}
});
if (action == 'remove') {
if (status) {
const ret = this.metaAction.modal('confirm', {
title: '是否离开',
content: `${key}尚未保存，还要离开吗？`,
onOk() {
that.injections.reduce('closeContent', key);
that.metaAction.sf('data.mathRandom', Math.random());
// that.reInitContent()
return;
},
onCancel() {
return;
}
});
} else {
this.injections.reduce('closeContent', key);
this.metaAction.sf('data.mathRandom', Math.random());
// this.reInitContent()
}
}
};
closeTabs = (e) => {
let key = e.key,
name = null,
status = false,
that = this,
content = this.metaAction.gf('data.content')
.toJS(),
openTabs = this.metaAction.gf('data.openTabs')
.toJS();
for (let i = 0; i < openTabs.length; i++) {
if (key == 'all') {
if (openTabs[i].editing) {
status = true;
name = openTabs[i].name;
break;
}
} else {
if (openTabs[i].appName == content.appName) {
status = openTabs[i].editing;
if (status) name = content.name;
break;
}
}
}
if (status) {
const ret = this.metaAction.modal('confirm', {
title: '是否离开',
content: `${name}尚未保存，还要离开吗？`,
onOk() {
if (key == 'all') {
that.injections.reduce('closeContent', 'all');
that.metaAction.sf('data.mathRandom', Math.random());
} else {
that.injections.reduce('closeContent', content.name);
that.metaAction.sf('data.mathRandom', Math.random());
}
return;
},
onCancel() {
return;
}
});
} else {
if (e.key == 'all') {
this.injections.reduce('closeContent', 'all');
this.metaAction.sf('data.mathRandom', Math.random());
} else {
this.injections.reduce('closeContent', content.name);
this.metaAction.sf('data.mathRandom', Math.random());
}
}
};
/**
* reinit时调用
* 记录当前打开的所有页签
* 关闭所有后重新打开
*/
reInitContent = async () => {
let content = this.metaAction.gf('data.content');
let openTabs = this.metaAction.gf('data.openTabs');
this.injections.reduce('closeAll');
setTimeout(() => {
this.injections.reduce('reInit', content, openTabs);
}, 0);
};
//从企业管理和创建企业返回时调用
setContent = (name, appName, appProps = {}) => {
this.injections.reduce('setContent', name, appName, appProps);
};
//关闭popover时取消选中menu
cancelCheckStatus = (visible) => {
if (!visible) {
this.metaAction.sf('data.selectedKeys', fromJS([]));
}
};
foldMenu = () => {
this.metaAction.sf('data.isShowMenu', !this.metaAction.gf('data.isShowMenu'));
setTimeout(function () {
var event = document.createEvent('HTMLEvents');
event.initEvent('resize', true, true);
window.dispatchEvent(event);
}, 0);
};
addEventListener = (eventName, handler) => {
this.injections.reduce('addEventListener', eventName, handler);
};
removeEventListener = (eventName) => {
this.injections.reduce('removeEventListener', eventName);
};
}
export default function creator(option) {
const metaAction = new MetaAction(option),
o = new action({ ...option, metaAction }),
ret = { ...metaAction, ...o };
metaAction.config({ metaHandlers: ret });
return ret;
}