yyuap-ref/dist2/main.js

cloud os fe ref project which is based on tinper

'use strict';

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

var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();

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 _reactDom = require('react-dom');

var _reactDom2 = _interopRequireDefault(_reactDom);

var _Ref = require('./components/ref/Ref');

var _Ref2 = _interopRequireDefault(_Ref);

var _modal = require('./bee/modal');

var _modal2 = _interopRequireDefault(_modal);

require('./assets/index.css');

var _api = require('./api.js');

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

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

var op = {
  title: '弹窗标题',
  RefSearch: true,
  RefList: false,
  isTab: true,
  RefTree: false,
  isTable: true,
  RefButton: true,
  code: 'test_common', //test_common||test_grid
  checkedArray: ['857c41b7-e1a3-11e5-aa70-0242ac11001d', 'xxcc0']
};

var RefGlobal = function (_Component) {
  _inherits(RefGlobal, _Component);

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

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

    _this.onClickBtn = function (type) {
      //console.log(type,this.state.RefListSelectArray)
      switch (type) {
        case 'save':
          console.log(_this.state.selectedArray);
          _this.props.option.onSave(_this.state.selectedArray);
          break;
        case 'cancel':
          _this.setState({
            selectedArray: [],
            isShowModal: false
          }, function () {
            console.log(_this.state.selectedArray);
          });
          break;
        default:
          _this.setState({ selectedArray: [] }, function () {
            console.log(_this.state.selectedArray);
            //this.props.options.onSave(this.state.RefListSelectArray)
          });
      }
      //this.props.options.onSave(this.state.RefListSelectArray)
    };

    _this.onSearchClick = function (value) {
      //搜索点击发请求
      console.log(value);
      if (op.RefList || op.isTable) {
        _this.getSearchListFun(value);
      }
    };

    _this.onSearchChange = function (value) {
      console.log(value);
    };

    _this.RefSelectedChecked = function (selectedArray) {
      console.log(selectedArray);
      _this.setState({
        selectedArray: selectedArray
      });
    };

    var option = _this.props.option;

    _this.state = {
      List: [],
      tableData: {}, //存放表格数据
      tabData: {}, //存放tab标签的数据
      selectedArray: option.checkedArray || [], //记录保存的选择项
      tabActiveKey: null, //记录当前激活tab
      originKey: null, //保留tab点击已选择的前一tab的key
      isShowModal: true, //是否显示弹窗
      pageCount: 0, //下拉加载数据使用--请求数据的总页数
      curPage: 0, //下拉加载数据使用--请求数据的当前页
      ifScroll: false, //下拉加载数据使用--控制滚动事件
      refTable: null //下拉加载数据使用--事件绑定对象
    };
    return _this;
  }

  //列表接口


  _createClass(RefGlobal, [{
    key: 'getRefList',
    value: function getRefList(value) {
      var _this2 = this;

      var option = this.props.option;

      (0, _api.getList)(option.code).then(function (_ref) {
        var data = _ref.data;

        if (data) {
          _this2.setState({
            List: data
          });
        }
      });
    }

    //搜索接口

  }, {
    key: 'getSearchListFun',
    value: function getSearchListFun(value) {
      var _this3 = this;

      var option = this.props.option;

      (0, _api.getSearchList)(option.code, value).then(function (_ref2) {
        var data = _ref2.data;

        if (data) {
          _this3.setState({
            List: data,
            tableData: {
              listData: data
            }
          });
        }
      });
    }

    //use to refresh tab data

  }, {
    key: 'getRefTabData',
    value: function getRefTabData(value) {
      this.setState({
        tabData: {
          dataSource: this.props.option.tabData
        }
      });
    }
    // 获取树组件数据

  }, {
    key: 'getRefTreeData',
    value: function getRefTreeData(value) {
      var _this4 = this;

      (0, _api.getTreeList)(value).then(function (_ref3) {
        var data = _ref3.data;

        if (data) {
          _this4.setState({
            treeData: data
          });
        }
      });
    }

    //use to refresh table data

  }, {
    key: 'getRefTableData',
    value: function getRefTableData(value) {
      var _this5 = this;

      if (value.activepage && value.activepage > 0) {
        (0, _api.getTableData)(value).then(function (_ref4) {
          var _ref5 = _slicedToArray(_ref4, 2),
              barData = _ref5[0],
              bodyData = _ref5[1];

          var tempData = [];
          if (bodyData) {
            tempData = bodyData.data.map(function (v, k) {
              v.key = v.refpk;
              return v;
            });
          }
          _this5.setState(function (prevData) {
            return {
              curPage: prevData.curPage + 1,
              tableData: {
                listData: prevData.tableData.listData.concat(tempData),
                cols: prevData.tableData.cols
              },
              ifScroll: false
            };
          });
        });
      } else {
        (0, _api.getTableData)(value).then(function (_ref6) {
          var _ref7 = _slicedToArray(_ref6, 2),
              barData = _ref7[0],
              bodyData = _ref7[1];

          var nameArr = barData.strFieldName;
          var barArr = barData.strFieldCode;
          var colsArr = barArr.map(function (v, k) {
            return {
              'title': nameArr[k],
              'dataIndex': v,
              'key': v,
              'width': 150
            };
          });
          var listArr = bodyData.data.map(function (v, k) {
            v.key = v.refpk;
            return v;
          });
          _this5.setState({
            tableData: {
              listData: listArr,
              cols: colsArr
            },
            curPage: 0,
            pageCount: bodyData.page.pageCount
          });
        });
      }
    }
  }, {
    key: 'componentWillMount',
    value: function componentWillMount() {
      var option = this.props.option;
      var activepage = this.state.activepage;

      if (option.RefList) {
        this.getRefList();
      }
      if (option.isTab) {
        this.getRefTabData({ refCode: option.code });
      }
      if (option.isTable) {
        this.getRefTableData({ refCode: option.code, activepage: 0 });
      }
      if (option.isTree) {
        this.getRefTreeData();
      }
    }
    //按钮点击

    //搜索输入变化触发

    //选中数组保存回调

  }, {
    key: 'onTabSelect',


    /* tab与table的回调函数 ---start */
    value: function onTabSelect(_ref8) {
      var activeKey = _ref8.activeKey,
          originKey = _ref8.originKey;
      var option = this.props.option;

      this.setState({
        tabActiveKey: activeKey,
        originKey: originKey
      });

      if (this.props.option.isTable) {
        this.state.refTable.scrollTop = 0;
        this.getRefTableData({ refCode: option.code, activekey: originKey || activeKey });
        console.log(originKey || activeKey);
      }
    }
  }, {
    key: 'onSendData',
    value: function onSendData(refTable) {
      var _this6 = this;

      this.setState({ refTable: refTable });
      var initScroll = function initScroll() {
        var _state = _this6.state,
            pageCount = _state.pageCount,
            curPage = _state.curPage,
            ifScroll = _state.ifScroll,
            originKey = _state.originKey,
            tabActiveKey = _state.tabActiveKey;
        var code = _this6.props.option.code;

        if (ifScroll) return;
        console.log('发送');
        var scrollerscrollHeight = refTable.scrollHeight; // 容器滚动总高度
        var scrollerHeight = refTable.getBoundingClientRect().height; // 容器滚动可见高度
        var scrollerTop = refTable.scrollTop; //滚过的高度
        if (scrollerscrollHeight - scrollerHeight - scrollerTop <= 10) {
          if (curPage + 1 < pageCount) {
            _this6.setState({ ifScroll: true });
            _this6.getRefTableData({ refCode: code, activepage: curPage + 1, activekey: originKey || tabActiveKey });
          } else {
            // scrollerLoading = true;
          }
        }
      };
      refTable.addEventListener('scroll', initScroll, false);
    }
    /* tree的回调函数 ---end */

  }, {
    key: 'onCheck',
    value: function onCheck(selectedKeys, event) {
      debugger;
      this.setState({
        selectedArray: selectedKeys
      });
    }
  }, {
    key: 'onSelect',
    value: function onSelect(selectedKeys, event) {
      debugger;
      this.setState({
        selectedArray: selectedKeys
      });
    }
    //tree EventHandler

  }, {
    key: 'render',
    value: function render() {
      var option = this.props.option;
      var isShowModal = this.state.isShowModal;

      return _react2.default.createElement(
        'div',
        null,
        isShowModal ? _react2.default.createElement(
          _modal2.default,
          {
            show: true
          },
          _react2.default.createElement(
            _modal2.default.Body,
            null,
            _react2.default.createElement(
              _Ref2.default,
              null,
              _react2.default.createElement(
                'div',
                null,
                option.title ? _react2.default.createElement(
                  'div',
                  { className: 'Reftitle' },
                  option.title
                ) : _react2.default.createElement('div', null),
                option.RefSearch ? _react2.default.createElement('div', { is: 'RefSearch',
                  onSearch: this.onSearchClick,
                  onChange: this.onSearchChange
                  // onGetSearchResult={this.onSearchGetResult}
                  // url={'www.baidu.com'}
                }) : _react2.default.createElement('div', null),
                option.RefList ? _react2.default.createElement('div', { is: 'RefList', data: this.state.List, SelectArray: this.state.selectedArray,
                  RefListChecked: this.RefSelectedChecked }) : _react2.default.createElement('div', null),
                option.RefTree ? _react2.default.createElement('div', { is: 'RefTree' }) : _react2.default.createElement('div', null),
                option.isTree ? _react2.default.createElement('div', { is: 'Tree',
                  data: this.state.treeData //
                  , multiple: false //是否允许选择多个树节点
                  , checkable: true //是否支持添加在树节点前添加Checkbox
                  , defaultExpandAll: true //默认是否展开所有节点
                  , onCheck: this.onCheck.bind(this) //
                  , onSelect: this.onSelect.bind(this) //
                  , refCode: option.code
                }) : _react2.default.createElement('div', null),
                option.isTab ? _react2.default.createElement('div', { is: 'Tab',
                  data: this.state.tabData,
                  selectedArray: this.state.selectedArray,
                  ifNeedSelect: 'true',
                  ifOnlyNeedSelect: 'false',
                  onTabSelect: this.onTabSelect.bind(this),
                  tabActiveKey: this.state.tabActiveKey,
                  originKey: this.state.originKey
                }) : _react2.default.createElement('div', null),
                option.isTable ? _react2.default.createElement('div', { is: 'RefTable',
                  data: this.state.tableData,
                  onTableSelect: this.RefSelectedChecked.bind(this),
                  onSendData: this.onSendData.bind(this),
                  tabActiveKey: this.state.tabActiveKey,
                  selectedArray: this.state.selectedArray
                }) : _react2.default.createElement('div', null),
                option.RefButton ? _react2.default.createElement('div', { is: 'RefButton', onClickBtn: this.onClickBtn }) : _react2.default.createElement('div', null)
              )
            )
          )
        ) : null
      );
    }
  }]);

  return RefGlobal;
}(_react.Component);

// ReactDOM.render(
//   (
//     <RefGlobal option={op}/>
//   ),
//   document.getElementById('root'),
// );


exports.default = RefGlobal;
module.exports = exports['default'];