wiz-frameworks/es/components/WizContainer.js

wizlong react framework

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

/**
 * 页面容器父类，封装redux、navigation跳转等方法
 * 一、redux 封装
 * 1、发送请求封装
 * 2、redux 请求数据卸载
 * 二、路由 封装
 * 1、提供公共调用路由方法
 * 三、公共会话周期事件
 * 1、异常捕获处理
 * 2、回退事件处理
 * @author sin
 * @date   2017-12-22
 */

import { actionUtils } from '../utils';
import { routerRedux } from 'dva/router';

import { component_tool, utils_tool } from '../tool';
var WizComponent = component_tool.WizComponent;
var Session = utils_tool.Session,
    isType = utils_tool.isType;


export var WizContainer = function (_WizComponent) {
    _inherits(WizContainer, _WizComponent);

    function WizContainer(props) {
        _classCallCheck(this, WizContainer);

        var _this = _possibleConstructorReturn(this, (WizContainer.__proto__ || Object.getPrototypeOf(WizContainer)).call(this, props));

        _this.componentName = '';

        _this.getMenuBtn = function (callback) {
            var btns = [];
            var nowPath = Session.get(constants.env.app_storage_key + '@nowPath');
            var menus = Session.get(constants.env.app_storage_key + '@menu');
            menus && menus.forEach(function (menu) {
                var url = menu['url'].split('/:')[0];
                if (url === nowPath) {
                    btns = menu['elementsList'] || [];
                }
            });
            if (!menus) {
                var count = 0;
                var wizContainerSetInterval = setInterval(function () {
                    var _menus = Session.get(constants.env.app_storage_key + '@menu');
                    if (_menus) {
                        _menus && _menus.forEach(function (menu) {
                            var url = menu['url'].split('/:')[0];
                            if (url === nowPath) {
                                btns = menu['elementsList'] || [];
                            }
                        });
                        callback && callback(btns);
                        clearInterval(wizContainerSetInterval);
                    }
                    ++count;
                    if (count > 10) {
                        clearInterval(wizContainerSetInterval);
                    }
                }, 1000);
            }
            return btns;
        };

        _this.checkOssToken = function () {
            if (location.href.indexOf('/sign/login') !== -1) {
                return;
            } else {
                var check = global.checkOssToken;
                if (check) {
                    return;
                }
                _this.doAction({
                    path: 'upload/getAliParam',
                    payload: {}
                });
                global.checkOssToken = setInterval(function () {
                    _this.doAction({
                        path: 'upload/checkAliOvertime',
                        payload: {
                            callback: function callback(e) {
                                if (!e) {
                                    _this.doAction({
                                        path: 'upload/getAliParam',
                                        payload: {}
                                    });
                                }
                            }
                        }
                    });
                }, 1000 * 60 * 3);
            }
        };

        _this.jumpPage = function (key, pathname) {
            var record = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
            var other = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};

            var _other = _extends({}, other);
            if (other['search']) {
                var search = other['search'];
                if (isType(search, 'Object')) {
                    var _search = '';
                    for (var _key in search) {
                        if (search.hasOwnProperty(_key)) {
                            _search += (_search === '' ? '?' : '&') + _key + '=' + search[_key];
                        }
                    }
                    _other['search'] = _search;
                }
            }
            _this.dispatch(routerRedux[key](_extends({ pathname: pathname, record: record }, _other)));
        };

        _this._actionKey = '';
        _this.containerActions = []; //当前已运行的action
        return _this;
    }

    /**
     * 获取当前路由下的按钮
     */


    /**
     * oss授权检查
     */


    _createClass(WizContainer, [{
        key: 'componentWillMount',
        value: function componentWillMount() {
            if (this.checkLogin() && this._componentWillMount) {
                this.checkOssToken();
                this._componentWillMount();
            }
        }
    }, {
        key: 'componentDidMount',
        value: function componentDidMount() {
            if (this.checkLogin() && this._componentDidMount) {
                this._componentDidMount();
            }
        }

        /**
         * 检查登陆状态和解析自动登陆参数情况
         */

    }, {
        key: 'checkLogin',
        value: function checkLogin() {
            //移动端的路径不检查
            if (location.hash.indexOf('/mobile/') !== -1) {
                return;
            }
            var r = true;
            var sl = void 0,
                path = void 0;
            if (location.hash && location.hash.indexOf('?sl=') !== -1) {
                sl = location.hash.split("?sl=")[1];
                //path = location.hash.split("?sl=")[0].replace("#", "")
            }
            var user = storage.getStorage('user');
            if (user && user['personId']) {
                if (sl) {
                    var _sl = Base64.decode(sl).split("base64Salt");
                    if (!_sl) {
                        return r;
                    };
                    var value = { userName: _sl[0], accountPassword: _sl[1], personId: _sl[2], params: _sl[3], path: location.hash.split("?sl=")[0].replace("#", "") };
                    if (user['personId'] !== value['personId']) {
                        sl && storage.setStorage('sl', location.hash);
                        r = false;
                    } else {
                        var _p = value['path'].split('/');
                        var record = _extends({}, value['params']);
                        record['personId'] = value['personId'];
                        Session.add(_p[_p.length ? _p.length - 1 : 0], record);
                    }
                }
            } else {
                sl && storage.setStorage('sl', location.hash);
                r = false;
            }
            if (!r) {
                if (location.href.indexOf('/sign/login') === -1) {
                    this.jumpPage('replace', '/sign/login');
                }
            }
            return r;
        }

        // /**
        //  * render 完视图结构后调用方法，可以获取第一次render的视图。
        //  * 考虑将方法移到wizComponent
        //  * @param {object} prevProps 
        //  * @param {object} prevState 
        //  */
        // getSnapshotBeforeUpdate(prevProps, prevState) {
        //     if (this._getSnapshotBeforeUpdate) {
        //         return this._getSnapshotBeforeUpdate();
        //     }
        //     return null;
        // }

    }, {
        key: 'componentDidUpdate',
        value: function componentDidUpdate() {
            if (this._componentDidUpdate) {
                this._componentDidUpdate();
            }
        }
    }, {
        key: 'componentWillUpdate',
        value: function componentWillUpdate(nextProps, nextState) {
            if (this._componentWillUpdate) {
                this._componentWillUpdate(nextProps, nextState);
            }
        }
    }, {
        key: 'componentWillReceiveProps',
        value: function componentWillReceiveProps(nextProps) {
            if (this._componentWillReceiveProps) {
                this._componentWillReceiveProps(nextProps);
            }
        }
    }, {
        key: 'componentWillUnmount',
        value: function componentWillUnmount() {
            if (this._componentWillUnmount) {
                this._componentWillUnmount();
            }
            this._doInitActionsData();
        }
    }, {
        key: 'render',
        value: function render() {
            if (this._render) {
                return this._render();
            }
            return null;
        }

        /**
         * 卸载需要init的Action数据
         */

    }, {
        key: '_doInitActionsData',
        value: function _doInitActionsData() {
            var _this2 = this;

            this.containerActions.forEach(function (action) {
                if (action.needInit) {
                    var businessModel = action.type.split('/')[0];
                    var init_action = {
                        type: businessModel + '/init',
                        payload: {
                            key: action.payload.key
                        }
                    };
                    _this2.dispatch(init_action);
                }
            });
            this.containerActions = [];
        }

        /**
         * 统一控制向redux发出的请求
         * 如：this.doAction({
         *            path:'commonUser/getUser',//请求模型／请求方法
         *            payload:{
         *                   key:'test',//模型数据标识key
         *                   page:{loadMore:true,field:'data'},//分页参数配置
         *                   apiParams:{}//请求参数配置
         *            },
         *            autoInit : false,//是否需要在组件卸载时初始化数据
         *           
         *    },'example_actionKey')
         * @param {Object}   action       请求对象参数
         * @param {string}   actionkey    请求标识，未传入则系统自动生成
         *
        */

    }, {
        key: 'doAction',
        value: function doAction(action) {
            var actionKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';

            actionKey = this._getActionKey(actionKey);
            var dispatch_action = {
                type: action.path,
                payload: _extends({}, action.payload, {
                    'actionKey': actionKey
                }),
                autoInit: action.autoInit !== undefined ? action.autoInit : true
            };
            this.dispatch(dispatch_action);
            this._pushAction(dispatch_action);
        }

        /**
         * 将当前运行的action存放置全局变量
         * @param {object} dispatch_action 
         */

    }, {
        key: '_pushAction',
        value: function _pushAction(dispatch_action) {
            var model_split = dispatch_action.type.split('/');
            var modelName = model_split[0];
            var methodName = model_split[1];
            var payloadKey = dispatch_action.payload.key;
            var isHasAction = this.containerActions.find(function (action) {
                var businessModelName = action.type.split('/')[0];
                return action.payload.key === payloadKey && businessModelName === modelName;
            });
            if (!isHasAction) {
                var needInit = this._checkActionNeedInit(modelName, methodName, payloadKey, dispatch_action.autoInit);
                this.containerActions.push(_extends({}, dispatch_action, { needInit: needInit }));
            }
        }

        /**
         * 判断请求的模型是否已经加载或是init方法。如是需要标记action为不可init
         * @param {string} modelName 
         * @param {string} methodName 
         * @param {string} payloadKey 
         */

    }, {
        key: '_checkActionNeedInit',
        value: function _checkActionNeedInit(modelName, methodName, payloadKey, autoInit) {
            var _this3 = this;

            if (methodName === 'init') {
                return false;
            }
            var modelVar = Object.keys(this.props).find(function (key) {
                var entity = _this3.props[key];
                return entity && entity['@namespace'] && entity['@namespace'] === modelName && entity['@payloadKey'] === payloadKey && !entity['@default'];
            });
            return !modelVar && autoInit;
        }

        /**
         * 向redux批量发出请求，并管控所有请求状态
         * @param {Array}   actions
         * @param {string}  key 默认为空
        */

    }, {
        key: 'doActions',
        value: function doActions(actions) {
            var actionKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';

            //生成actionKey
            if (actions instanceof Array) {
                var _iteratorNormalCompletion = true;
                var _didIteratorError = false;
                var _iteratorError = undefined;

                try {
                    for (var _iterator = actions[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
                        var action = _step.value;

                        this.doAction(action, actionKey);
                    }
                } catch (err) {
                    _didIteratorError = true;
                    _iteratorError = err;
                } finally {
                    try {
                        if (!_iteratorNormalCompletion && _iterator['return']) {
                            _iterator['return']();
                        }
                    } finally {
                        if (_didIteratorError) {
                            throw _iteratorError;
                        }
                    }
                }
            }
        }
    }, {
        key: '_getActionKey',


        /**
        * 获取业务请求标识
        * @return {string} actionKey
        */
        value: function _getActionKey(key) {
            if (key === '') {
                return this.actionKey;
            } else {
                return this.buildActionKey(key);
            }
        }

        /**
        * 构造redux请求的标识.
        * 格式：'componentName@customerKey' 或者 'componentName@uuid'
        * @return {string} actionKey
        */

    }, {
        key: 'buildActionKey',
        value: function buildActionKey() {
            var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';

            this.actionKey = actionUtils.generateActionKey(this.componentName, key);
            return this.actionKey;
        }
    }, {
        key: '_actionsMonitor',
        value: function _actionsMonitor(nextProps, nextState) {}

        /**
         * 封装dispatch方法。
         */

    }, {
        key: 'receiveMessage',


        // get naviParams() {
        //     let _naviParams = {};
        //     log.info('this.props.navigation:',this.props.navigation)
        //     if (this.props.navigation) {
        //         _naviParams = this.props.navigation.state.params ? this.props.navigation.state.params : {};
        //     } else {
        //         log.error(`The ${this.componentName} component has no navigation!`);
        //     }
        //     return _naviParams;
        // }


        /**
         * 接收动态模块反馈的消息处理
         *
         */
        value: function receiveMessage(nextProps, nextState) {
            if (nextProps.reduxMessage) {
                this._doMessage(nextProps.reduxMessage);
            }
        }
    }, {
        key: '_doMessage',
        value: function _doMessage(message) {}

        /**
         * 跳转方法
         * @param {*} key 
         *   push: push('/sgin/login') 普通的跳转方法
         *   replace: replace ('/sgin/login') 替换当前路由
         *   go: go(1)/go(-1) 控制前进/后退 
         *   goForward: goForward() 相当于 go(1)
         *   goBack: goBack() 相当于 go(-1)
         * @param {*} params 
         * @param {*} other {search}
         * @author mll
         * 
         */

    }, {
        key: 'actionKey',
        get: function get() {
            return this._actionKey;
        },
        set: function set(key) {
            this._actionKey = key;
        }
    }, {
        key: 'dispatch',
        get: function get() {
            var dispatch = void 0;
            if (this.props.dispatch) {
                dispatch = this.props.dispatch;
            } else {
                log.error('The ' + this.componentName + ' component has no dispatch!');
            }
            return dispatch;
        }
    }]);

    return WizContainer;
}(WizComponent);