react-person-y/lib/person/personnel/index.js

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

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; }; }();

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactRedux = require('react-redux');

var _redux = require('redux');

var _themeY = require('theme-y');

var _reactScrollY = require('react-scroll-y');

var _reactScrollY2 = _interopRequireDefault(_reactScrollY);

var _reactUtilsY = require('react-utils-y');

var _reactDialogY = require('react-dialog-y');

var _reactDialogY2 = _interopRequireDefault(_reactDialogY);

var _reactButtonY = require('react-button-y');

var _reactButtonY2 = _interopRequireDefault(_reactButtonY);

var _reactSvgY = require('react-svg-y');

var _reactSvgY2 = _interopRequireDefault(_reactSvgY);

var _index = require('../../actions/index');

var actions = _interopRequireWildcard(_index);

var _style = require('./style');

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

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; }
// import PropTypes from "prop-types"


// const propTypes = {
//     // designationTheme: PropTypes.string,
// };

//获取主题的方法
var getTheme = function getTheme(_this) {
    // designationTheme  指定的主题，  theme  redux设置的全局主题,
    var themeName = _this.props.designationTheme || _this.props.theme || "default";
    var _theme = _this.state.theme[themeName].personnel;
    return _theme;
};

var Personnel = function (_Theme) {
    _inherits(Personnel, _Theme);

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

        var _this2 = _possibleConstructorReturn(this, (Personnel.__proto__ || Object.getPrototypeOf(Personnel)).call(this, props));

        _this2.initScrollChoose = function () {
            _this2.setState({ shouldUpdateChoose: false });
        };

        _this2.initScrollList = function () {
            _this2.setState({ shouldUpdateList: false });
        };

        _this2.handleCheck = function (item) {
            _this2.props.dispatch.updatePersonnelList(item);
            _this2.props.dispatch.setChoosePerson(item);
        };

        _this2.handleDelete = function (item) {
            _this2.props.dispatch.deleteChoosePerson(item);
            _this2.props.dispatch.updatePersonnelList(item);
        };

        _this2.handleChange = function (e) {
            _this2.setState({
                inputValue: e.target.value
            });
        };

        var _state = {
            shouldUpdateChoose: true, // 初始化为true
            shouldUpdateList: true, // 初始化为true
            //组件的state
            inputValue: ""
        };
        _this2.state = _reactUtilsY._Object.merge(_this2.state || {}, _state);
        return _this2;
    }

    _createClass(Personnel, [{
        key: 'componentWillMount',
        value: function componentWillMount() {}
    }, {
        key: 'componentDidMount',
        value: function componentDidMount() {}
    }, {
        key: 'componentWillReceiveProps',
        value: function componentWillReceiveProps(nextProps) {
            if (this.props.choosePerson.length != nextProps.choosePerson.length) {
                this.setState({ shouldUpdateChoose: true });
            }
            if (this.props.personnelList.length != nextProps.personnelList.length) {
                this.setState({ shouldUpdateList: true });
            }
        }
    }, {
        key: 'render',
        value: function render() {
            var _this3 = this;

            // console.log("personnel",this);
            var props = _objectWithoutProperties(this.props, []);

            var theme = getTheme(this);
            var styles = _reactUtilsY._Object.merge({}, (0, _style.personnelSty)(this));
            var personnelList = props.personnelList || [];
            var choosePerson = props.choosePerson || [];
            return _react2.default.createElement(
                'div',
                null,
                _react2.default.createElement(
                    _reactDialogY2.default,
                    {
                        open: props.open,
                        onRequestClose: this.handleClose,
                        bodyStyle: props.open ? styles.bodyStyle : {},
                        contentStyle: props.open ? styles.contentStyle : {}
                    },
                    props.open ? [_react2.default.createElement(
                        'div',
                        null,
                        _react2.default.createElement(
                            'div',
                            { style: styles.chooseHeader },
                            '\u4EBA\u5458\u9009\u62E9'
                        ),
                        _react2.default.createElement(
                            'div',
                            { style: styles.chooseBox },
                            _react2.default.createElement(
                                _reactScrollY2.default,
                                { shouldUpdate: this.state.shouldUpdateChoose,
                                    initScroll: this.initScrollChoose,
                                    maxHeight: '5rem',
                                    width: '33.75rem'
                                },
                                _react2.default.createElement(
                                    'div',
                                    { style: styles.chooseCont },
                                    choosePerson.map(function (item, index) {
                                        return _react2.default.createElement(
                                            'div',
                                            { key: index, onClick: _this3.handleDelete.bind(_this3, item),
                                                style: styles.chooseItem },
                                            _react2.default.createElement('img', { style: styles.chooseItemImage, src: item.userImage }),
                                            _react2.default.createElement(
                                                'div',
                                                { style: styles.chooseItemName },
                                                item.zhName
                                            ),
                                            _react2.default.createElement(_reactSvgY2.default, { type: 'Error', width: '1rem', height: '1rem', fill: 'red' })
                                        );
                                    })
                                )
                            )
                        )
                    ), _react2.default.createElement(
                        'div',
                        { style: styles.searchBox },
                        _react2.default.createElement('input', { style: styles.searchInput, type: 'text', onChange: this.handleChange.bind(this),
                            defaultValue: this.state.inputValue }),
                        _react2.default.createElement(
                            'div',
                            { style: styles.searchBtn,
                                onClick: props.requestDataBack.bind(this, "search", this.state.inputValue ? this.state.inputValue.trim() : "") },
                            _react2.default.createElement(_reactSvgY2.default, { type: 'Query', width: '1.5rem', height: '1.5rem', fill: '#cccccc' })
                        )
                    ), _react2.default.createElement(
                        'div',
                        null,
                        _react2.default.createElement(
                            'div',
                            { style: styles.personnelTitle },
                            '30PG1 \u90E8\u95E8\u4EBA\u5458\u9009\u62E9'
                        ),
                        _react2.default.createElement(
                            'div',
                            { style: styles.personnelList },
                            _react2.default.createElement(
                                _reactScrollY2.default,
                                { shouldUpdate: this.state.shouldUpdateList,
                                    initScroll: this.initScrollList,
                                    requestFlag: props.requestFlag,
                                    requestDataBack: props.requestDataBack.bind(this, "page", this.state.inputValue ? this.state.inputValue.trim() : ""),
                                    maxHeight: '17.5rem',
                                    width: '33.75rem'
                                },
                                _react2.default.createElement(
                                    'div',
                                    { style: styles.personnelCont },
                                    personnelList.map(function (item, index) {
                                        return _react2.default.createElement(
                                            'div',
                                            { key: index, onClick: _this3.handleCheck.bind(_this3, item),
                                                style: styles.personItem },
                                            _react2.default.createElement('img', { style: styles.personItemImage, src: item.userImage }),
                                            _react2.default.createElement(
                                                'div',
                                                { style: styles.personItemName },
                                                item.zhName
                                            ),
                                            _react2.default.createElement(
                                                'div',
                                                { style: { paddingTop: "0.5rem" } },
                                                item.check ? _react2.default.createElement(_reactSvgY2.default, { type: 'CheckboxOn', width: '1.5rem', height: '1.5rem',
                                                    fill: '#4aa5fe' }) : _react2.default.createElement(_reactSvgY2.default, { type: 'CheckboxUp', width: '1.5rem', height: '1.5rem',
                                                    fill: '#4aa5fe' })
                                            )
                                        );
                                    }),
                                    personnelList.length == 0 ? _react2.default.createElement(
                                        'div',
                                        { style: styles.personEmpty },
                                        '\u7A7A\u7A7A\u5982\u4E5F'
                                    ) : ""
                                )
                            )
                        )
                    ), _react2.default.createElement(
                        'div',
                        { style: styles.buttonBox },
                        _react2.default.createElement(
                            'div',
                            { style: styles.submitBtn },
                            _react2.default.createElement(_reactButtonY2.default, { scenesType: 'submit', handleBtn: props.handleClose.bind(this, 'submit'),
                                btnText: '\u786E\u8BA4' })
                        ),
                        _react2.default.createElement(_reactButtonY2.default, { scenesType: 'back', handleBtn: props.handleClose.bind(this, "back"), btnText: '\u53D6\u6D88' })
                    )] : null
                )
            );
        }
    }]);

    return Personnel;
}(_themeY.Theme);

// Personnel.propTypes = propTypes;

var mapStateToProps = function mapStateToProps(state) {
    return {
        personnelList: state.personnelList,
        choosePerson: state.choosePerson,
        theme: state.theme
    };
};

var mapDispatchToProps = function mapDispatchToProps(dispatch) {
    return {
        dispatch: (0, _redux.bindActionCreators)(actions, dispatch)
    };
};

exports.default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(Personnel);
//# sourceMappingURL=index.js.map