dlt-for-react 1.0.23 → 1.1.0

package/lib/components/StuSelector/index.js

@@ -0,0 +1,611 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _drawer = require("antd-mobile/lib/drawer");
+
+var _drawer2 = _interopRequireDefault(_drawer);
+
+var _button = require("antd-mobile/lib/button");
+
+var _button2 = _interopRequireDefault(_button);
+
+var _searchBar = require("antd-mobile/lib/search-bar");
+
+var _searchBar2 = _interopRequireDefault(_searchBar);
+
+var _listView = require("antd-mobile/lib/list-view");
+
+var _listView2 = _interopRequireDefault(_listView);
+
+var _checkbox = require("antd-mobile/lib/checkbox");
+
+var _checkbox2 = _interopRequireDefault(_checkbox);
+
+var _radio = require("antd-mobile/lib/radio");
+
+var _radio2 = _interopRequireDefault(_radio);
+
+var _list = require("antd-mobile/lib/list");
+
+var _list2 = _interopRequireDefault(_list);
+
+var _toast = require("antd-mobile/lib/toast");
+
+var _toast2 = _interopRequireDefault(_toast);
+
+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; }; }();
+
+require("antd-mobile/lib/drawer/style/css");
+
+require("antd-mobile/lib/button/style/css");
+
+require("antd-mobile/lib/search-bar/style/css");
+
+require("antd-mobile/lib/list-view/style/css");
+
+require("antd-mobile/lib/checkbox/style/css");
+
+require("antd-mobile/lib/radio/style/css");
+
+require("antd-mobile/lib/list/style/css");
+
+require("antd-mobile/lib/toast/style/css");
+
+var _react = require("react");
+
+var _react2 = _interopRequireDefault(_react);
+
+var _propTypes = require("prop-types");
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
+var _NHFetch = require("../../utils/NHFetch");
+
+var _NHFetch2 = _interopRequireDefault(_NHFetch);
+
+var _index = require("../NHTreeMenu/index");
+
+var _index2 = _interopRequireDefault(_index);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
+
+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 smMobileUrl = "api/sm-mobile";
+
+var StuSelector = function (_Component) {
+  _inherits(StuSelector, _Component);
+
+  // 学生选择器
+  function StuSelector(props) {
+    _classCallCheck(this, StuSelector);
+
+    var _this = _possibleConstructorReturn(this, (StuSelector.__proto__ || Object.getPrototypeOf(StuSelector)).call(this, props));
+
+    _this.queryStudents = function () {
+      var _this$state = _this.state,
+          isLoading = _this$state.isLoading,
+          pageSize = _this$state.pageSize,
+          page = _this$state.page,
+          keyword = _this$state.keyword,
+          selectedData = _this$state.selectedData;
+
+      var params = {
+        pageSize: pageSize,
+        page: page,
+        keyword: keyword,
+        rangeFilter: _this.props.rangeFilter,
+        tier: selectedData
+      };
+      _this.setState({ isLoading: true });
+      (0, _NHFetch2.default)(smMobileUrl + "/openapi/stuSelector", "POST", params).then(function (res) {
+        if (res && res.code === 200) {
+          var newData = [].concat(_toConsumableArray(_this.state.data), _toConsumableArray(res.data.list));
+          _this.setState({
+            data: newData,
+            total: res.data.total,
+            dataSource: _this.state.dataSource.cloneWithRows(newData),
+            isLoading: false,
+            hasMore: res.data.pageCount > res.data.pageNum
+          });
+        } else {
+          _toast2.default.fail("查询数据失败");
+          _this.setState({ isLoading: false });
+        }
+      }).catch(function (err) {
+        _toast2.default.fail("查询数据失败");
+        _this.setState({ isLoading: false });
+      });
+    };
+
+    _this.querySchoolTierInfo = function () {
+      var params = {
+        rangeFilter: _this.props.rangeFilter
+      };
+      (0, _NHFetch2.default)(smMobileUrl + "/openapi/getSchoolTierInfo", "GET", params).then(function (res) {
+        if (res && res.code === 200) {
+          _this.setState({
+            selectorData: res.data
+          });
+        } else {
+          _toast2.default.fail("查询筛选数据失败");
+        }
+      }).catch(function (err) {
+        _toast2.default.fail("查询筛选数据失败");
+      });
+    };
+
+    _this.renderFooter = function () {
+      if (_this.state.isLoading) {
+        return _react2.default.createElement(
+          "div",
+          { style: { padding: 30, textAlign: "center" } },
+          "\u52A0\u8F7D\u4E2D..."
+        );
+      }
+      return null;
+    };
+
+    _this.handelRadioChange = function (newuser) {
+      var _this$state2 = _this.state,
+          dataSource = _this$state2.dataSource,
+          data = _this$state2.data,
+          _this$state2$user = _this$state2.user,
+          user = _this$state2$user === undefined ? {} : _this$state2$user;
+
+      var index = data.findIndex(function (row) {
+        return row.xsid === user.xsid;
+      });
+      var newData = [].concat(_toConsumableArray(data));
+      if (index > -1) {
+        // 改变row的引用，使其重新渲染
+        newData[index] = JSON.parse(JSON.stringify(user));
+      }
+      var index2 = data.findIndex(function (row) {
+        return row.xsid === newuser.xsid;
+      });
+      if (index2 > -1) {
+        // 改变row的引用，使其重新渲染
+        newData[index2] = JSON.parse(JSON.stringify(newuser));
+      }
+      _this.setState({
+        user: newuser,
+        dataSource: dataSource.cloneWithRows(newData)
+      });
+    };
+
+    _this.handelCheckboxChange = function (newuser) {
+      var _this$state3 = _this.state,
+          dataSource = _this$state3.dataSource,
+          data = _this$state3.data,
+          _this$state3$user = _this$state3.user,
+          user = _this$state3$user === undefined ? [] : _this$state3$user;
+      // const index = data.findIndex( )
+
+      var newData = [].concat(_toConsumableArray(data));
+      var userIndex = user.findIndex(function (item) {
+        return item.xsid == newuser.xsid;
+      });
+      if (userIndex > -1) {
+        user.splice(userIndex, 1);
+      } else {
+        user.push(newuser);
+      }
+      // const index = data.findIndex(row => row.xsid === user.xsid);
+      // if( index > -1 ) {
+      //     // 改变row的引用，使其重新渲染
+      //     newData[index] = JSON.parse(JSON.stringify(user));
+      // }
+      var index2 = data.findIndex(function (row) {
+        return row.xsid === newuser.xsid;
+      });
+      if (index2 > -1) {
+        // 改变row的引用，使其重新渲染
+        newData[index2] = JSON.parse(JSON.stringify(newuser));
+      }
+
+      _this.setState({
+        user: user,
+        dataSource: dataSource.cloneWithRows(newData)
+      });
+    };
+
+    _this.renderRow = function (rowData, sectionID, rowID) {
+      var selectType = _this.props.selectType;
+
+      if (selectType == "single") {
+        // 单选
+        var _this$state$user = _this.state.user,
+            user = _this$state$user === undefined ? {} : _this$state$user;
+
+        return _react2.default.createElement(
+          "div",
+          { onChange: function onChange() {
+              return _this.handelRadioChange(rowData);
+            } },
+          _react2.default.createElement(
+            _radio2.default.RadioItem,
+            {
+              key: rowData.xsid,
+              checked: user.xsid === rowData.xsid
+            },
+            rowData.xm,
+            "-",
+            rowData.xh,
+            _react2.default.createElement(
+              _list2.default.Item.Brief,
+              null,
+              rowData.bmmc,
+              "/",
+              rowData.zymc,
+              "/",
+              rowData.bjmc
+            )
+          )
+        );
+      } else if (selectType == "multi") {
+        var _this$state$user2 = _this.state.user,
+            _user = _this$state$user2 === undefined ? [] : _this$state$user2;
+        // 多选
+
+
+        return _react2.default.createElement(
+          "div",
+          { onChange: function onChange() {
+              return _this.handelCheckboxChange(rowData);
+            } },
+          _react2.default.createElement(
+            _checkbox2.default.CheckboxItem,
+            {
+              key: rowData.xsid,
+              checked: _user.filter(function (item) {
+                return item.xsid == rowData.xsid;
+              }).length > 0,
+              multipleLine: true
+            },
+            rowData.xm,
+            "-",
+            rowData.xh,
+            _react2.default.createElement(
+              _list2.default.Item.Brief,
+              null,
+              rowData.bmmc,
+              "/",
+              rowData.zymc,
+              "/",
+              rowData.bjmc
+            )
+          )
+        );
+      }
+    };
+
+    _this.onEndReached = function (event) {
+      var hasMore = _this.state.hasMore;
+
+      if (hasMore) {
+        _this.loadMore();
+      } else {
+        _toast2.default.info("已加载所有数据", 1);
+      }
+    };
+
+    _this.loadMore = function () {
+      var page = _this.state.page;
+
+      _this.setState({
+        page: page + 1
+      }, function () {
+        _this.queryStudents();
+      });
+    };
+
+    _this.onSearch = function (value) {
+      var page = _this.state.page;
+
+      _this.setState({
+        keyword: value,
+        page: 1,
+        data: []
+      }, function () {
+        _this.queryStudents();
+      });
+    };
+
+    _this.handleSearchClear = function () {
+      _this.setState({
+        page: 1,
+        data: []
+      }, function () {
+        _this.queryStudents();
+      });
+    };
+
+    _this.onOpenChange = function () {
+      var _this$state4 = _this.state,
+          ifDrawerOpen = _this$state4.ifDrawerOpen,
+          disabledSearchBar = _this$state4.disabledSearchBar;
+
+      _this.setState({
+        ifDrawerOpen: !ifDrawerOpen,
+        disabledSearchBar: !disabledSearchBar
+      });
+    };
+
+    _this.onTreeSelect = function (item) {
+      /* let newSelected = {
+          id: "",
+          type: "",
+        };
+        let { selectedData } = this.props;
+        if (selectedData && selectedData.id == item.id) {
+          newSelected.id = "";
+          newSelected.type = "";
+        } else {
+          newSelected.id = item.id;
+          newSelected.type = item.type;
+        }
+        this.setState({
+          selectedData: newSelected,
+        }); */
+      var defaultValue = _this.state.defaultValue;
+
+      var newSelected = [];
+      var _this$state$selectedD = _this.state.selectedData,
+          selectedData = _this$state$selectedD === undefined ? [] : _this$state$selectedD;
+
+      if (selectedData.length > 0 && selectedData.findIndex(function (row) {
+        return row.id == item.id;
+      }) !== -1) {
+        newSelected.push(defaultValue);
+      } else {
+        newSelected.push({
+          type: item.type,
+          id: item.id
+        });
+      }
+      console.log("树选择的值", newSelected);
+      _this.setState({
+        selectedData: newSelected
+      });
+    };
+
+    _this.onComfirm = function () {
+      // 关闭抽屉
+      _this.onOpenChange();
+      _this.setState({
+        data: []
+      });
+      // 重新刷新学生列表数据
+      _this.queryStudents();
+    };
+
+    _this.onReset = function () {
+      // 重置
+      var defaultValue = _this.state.defaultValue;
+
+      var newSelected = [];
+      newSelected.push(defaultValue);
+      _this.setState({
+        selectedData: newSelected,
+        data: []
+      }, function () {
+        // 重新刷新学生列表数据
+        _this.queryStudents();
+      });
+    };
+
+    _this.handleOkClick = function () {
+      var handleOkClick = _this.props.handleOkClick;
+      var user = _this.state.user;
+
+      if (handleOkClick && typeof handleOkClick == "function") {
+        // 将所选中的user传给父组件
+        handleOkClick(user);
+      }
+    };
+
+    _this.state = {
+      dataSource: new _listView2.default.DataSource({
+        rowHasChanged: function rowHasChanged(row1, row2) {
+          return row1 !== row2;
+        }
+      }),
+      isLoading: false,
+      total: 0,
+      pageSize: 20, //当前页默认多少条数据
+      page: 1,
+      pageCount: 0,
+      data: [],
+      hasMore: false,
+      user: props.user,
+      keyword: "",
+      ifDrawerOpen: false, //是否展示筛选抽屉
+      selectorData: [], //Tree筛选器的数据
+      selectedData: [
+      //Tree选中的数据
+      {
+        type: "",
+        id: ""
+      }],
+      disabledSearchBar: false, //是否禁用SearchBar
+      defaultValue: {
+        id: "",
+        type: ""
+      }
+    };
+    return _this;
+  }
+
+  _createClass(StuSelector, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.queryStudents();
+      this.props.ifShowFilter && this.querySchoolTierInfo();
+    }
+
+    // 查询学生列表
+
+
+    // 查询学生列表
+
+
+    // 单选
+
+    // 多选
+
+    // 所有数据已经渲染完，需要获取新的数据
+
+    // 打开/关闭筛选抽屉
+
+    // 树筛选器选择
+
+  }, {
+    key: "render",
+    value: function render() {
+      var _state = this.state,
+          dataSource = _state.dataSource,
+          ifDrawerOpen = _state.ifDrawerOpen,
+          selectorData = _state.selectorData,
+          _state$selectedData = _state.selectedData,
+          selectedData = _state$selectedData === undefined ? [] : _state$selectedData,
+          disabledSearchBar = _state.disabledSearchBar,
+          height = _state.height;
+      var ifShowFilter = this.props.ifShowFilter;
+
+      var ifShowHeader = sessionStorage.getItem("showHeaderConfig");
+      var fullHeight = document.body.clientHeight;
+      var sidebar = _react2.default.createElement(
+        "div",
+        { className: "dropContainer" },
+        _react2.default.createElement(_index2.default, {
+          dataList: selectorData,
+          onSelected: this.onTreeSelect,
+          onComfirm: this.onComfirm,
+          onReset: this.onReset,
+          selectedData: selectedData,
+          height: fullHeight
+        })
+      );
+      return _react2.default.createElement(
+        "div",
+        null,
+        _react2.default.createElement(
+          "div",
+          {
+            style: {
+              display: "flex",
+              justifyContent: "center",
+              alignItems: "center",
+              height: "0.88rem"
+            }
+          },
+          _react2.default.createElement(_searchBar2.default, {
+            style: { flex: "1 1" },
+            placeholder: "\u8BF7\u8F93\u5165\u5B66\u53F7\u6216\u59D3\u540D",
+            onSubmit: this.onSearch,
+            onClear: this.handleSearchClear,
+            disabled: disabledSearchBar
+          }),
+          ifShowFilter &&
+          // <Icon
+          //   type="ellipsis"
+          //   onClick={this.onOpenChange}
+          //   style={{ margin: "0px 5px" }}
+          // />
+          _react2.default.createElement("img", {
+            style: { width: "0.4rem", height: "0.4rem", margin: "0px 5px" },
+            src: require("../../../assets/NHTreeMenu/Selector.svg"),
+            onClick: this.onOpenChange
+          })
+          // <Selector
+          //   style={{ margin: "0px 5px", width: "24px", height: "24px" }}
+          //   onClick={this.onOpenChange}
+          // />
+
+        ),
+        _react2.default.createElement(
+          _drawer2.default,
+          {
+            className: "my-drawer",
+            style: {
+              minHeight: ifShowHeader ? "calc(" + fullHeight + "px - 0.88rem - 0.88rem)" : "calc(" + fullHeight + "px - 0.88rem)"
+            },
+            sidebarStyle: { width: "80%" },
+            enableDragHandle: true,
+            contentStyle: {
+              color: "#666666",
+              textAlign: "center",
+              paddingTop: 0
+            },
+            sidebar: sidebar,
+            position: "right",
+            open: ifDrawerOpen,
+            touch: false,
+            onOpenChange: this.onOpenChange
+          },
+          _react2.default.createElement(_listView2.default, {
+            style: {
+              height: ifShowHeader ? "calc(" + fullHeight + "px - 0.88rem - 0.88rem - 0.88rem)" : "calc(" + fullHeight + "px - 0.88rem - 0.88rem)",
+              overflow: "auto"
+            },
+            dataSource: dataSource
+            // renderHeader={renderHeader}
+            , renderFooter: this.renderFooter,
+            renderRow: this.renderRow,
+            className: "am-list",
+            pageSize: 20,
+            onEndReached: this.onEndReached
+          }),
+          _react2.default.createElement(
+            "div",
+            { style: { width: "100%", height: "0.88rem" } },
+            _react2.default.createElement(
+              _button2.default,
+              {
+                style: { height: "100%" },
+                type: "primary",
+                onClick: this.handleOkClick
+              },
+              "\u786E\u5B9A"
+            )
+          )
+        ),
+        _react2.default.createElement(
+          "style",
+          { global: "true", jsx: "true" },
+          "\n            .my-drawer {\n              position: relative;\n              overflow-y: auto;\n              -webkit-overflow-scrolling: touch;\n            }\n            .my-drawer .am-drawer-sidebar {\n              background-color: #fff;\n              overflow: auto;\n              -webkit-overflow-scrolling: touch;\n            }\n            .my-drawer .am-drawer-sidebar .am-list {\n              width: 100%;\n              padding: 0;\n            }\n          "
+        )
+      );
+    }
+  }]);
+
+  return StuSelector;
+}(_react.Component);
+
+//属性默认值
+
+
+exports.default = StuSelector;
+StuSelector.defaultProps = {
+  selectType: "single", //单选或多选，单选singel/多选multi
+  user: undefined, //当前所选用户
+  ifShowFilter: false, //是否展示抽屉筛选项， 默认为false
+  rangeFilter: false //接口查询是否开启职务过滤
+};
+
+StuSelector.propTypes = {
+  selectType: _propTypes2.default.string, //单选或多选，单选singel/多选multi
+  ifShowFilter: _propTypes2.default.bool, //是否展示抽屉筛选项， 默认为false
+  handleOkClick: _propTypes2.default.func, //当前选择器的确定按钮事件
+  rangeFilter: _propTypes2.default.bool //接口查询是否开启职务过滤
+};