UNPKG

yylib-quick-mobile

Version:

yylib-quick-mobile

711 lines (624 loc) 29.4 kB
'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _wingBlank = require('antd-mobile/lib/wing-blank'); var _wingBlank2 = _interopRequireDefault(_wingBlank); var _modal = require('antd-mobile/lib/modal'); var _modal2 = _interopRequireDefault(_modal); var _list = require('antd-mobile/lib/list'); var _list2 = _interopRequireDefault(_list); var _searchBar = require('antd-mobile/lib/search-bar'); var _searchBar2 = _interopRequireDefault(_searchBar); var _activityIndicator = require('antd-mobile/lib/activity-indicator'); var _activityIndicator2 = _interopRequireDefault(_activityIndicator); var _navBar = require('antd-mobile/lib/nav-bar'); var _navBar2 = _interopRequireDefault(_navBar); var _whiteSpace = require('antd-mobile/lib/white-space'); var _whiteSpace2 = _interopRequireDefault(_whiteSpace); var _icon = require('antd-mobile/lib/icon'); var _icon2 = _interopRequireDefault(_icon); var _toast = require('antd-mobile/lib/toast'); var _toast2 = _interopRequireDefault(_toast); var _radio = require('antd-mobile/lib/radio'); var _radio2 = _interopRequireDefault(_radio); var _checkbox = require('antd-mobile/lib/checkbox'); var _checkbox2 = _interopRequireDefault(_checkbox); 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/wing-blank/style/css'); require('antd-mobile/lib/modal/style/css'); require('antd-mobile/lib/list/style/css'); require('antd-mobile/lib/search-bar/style/css'); require('antd-mobile/lib/activity-indicator/style/css'); require('antd-mobile/lib/nav-bar/style/css'); require('antd-mobile/lib/white-space/style/css'); require('antd-mobile/lib/icon/style/css'); require('antd-mobile/lib/toast/style/css'); require('antd-mobile/lib/radio/style/css'); require('antd-mobile/lib/checkbox/style/css'); var _react = require('react'); var _react2 = _interopRequireDefault(_react); require('./refer.less'); var _SwipeNavBar = require('../swipeNavBar/SwipeNavBar'); var _SwipeNavBar2 = _interopRequireDefault(_SwipeNavBar); var _deleteTap = require('../delete-tap/deleteTap'); var _deleteTap2 = _interopRequireDefault(_deleteTap); var _RestUrl = require('../../common/RestUrl'); var _RestUrl2 = _interopRequireDefault(_RestUrl); var _FunctionUtil = require('../../utils/FunctionUtil'); 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 _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return 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 CheckboxItem = _checkbox2.default.CheckboxItem; var RadioItem = _radio2.default.RadioItem; var page = void 0; var referUrl = []; var treereferUrl = []; var relyfield = []; var referParams = void 0; var data = []; var YYReferTree = function (_React$Component) { _inherits(YYReferTree, _React$Component); function YYReferTree(props) { _classCallCheck(this, YYReferTree); var _this = _possibleConstructorReturn(this, (YYReferTree.__proto__ || Object.getPrototypeOf(YYReferTree)).call(this, props)); _this.onMultiChange = function (e, selectedNode) { var selectedNodes = _this.state.selectedNodes; if (!selectedNodes.some(function (item) { return item.id === selectedNode.id; })) { selectedNodes.push(selectedNode); selectedNode.checked = true; _this.setState({ changeOrNext: false, selectedNodes: selectedNodes, row: selectedNodes }); setTimeout(function () { _this.setState({ changeOrNext: true }); }, 10); } else { var newNodes = []; selectedNodes.map(function (item) { if (item.id !== selectedNode.id) { newNodes.push(item); } }); selectedNode.checked = false; _this.setState({ changeOrNext: false, selectedNodes: newNodes, row: newNodes }); setTimeout(function () { _this.setState({ changeOrNext: true }); }, 10); } }; _this.onSingleChange = function (e, selectedNode) { if (selectedNode[_this.props.id] === _this.state.selectedId) { _this.setState({ selectedId: null, selectedNode: {}, changeOrNext: false }); setTimeout(function () { _this.setState({ changeOrNext: true }); }, 10); } else { _this.setState({ selectedId: selectedNode[_this.props.id], selectedNode: selectedNode, changeOrNext: false }); setTimeout(function () { _this.setState({ changeOrNext: true }); }, 10); }; setTimeout(function () { var _self = _this; _this.setState({ pageNumber: 1, searchText: '', showList: false }); var referParams = {}; referParams.condition = _this.props.condition; if (_this.props.onOk && (0, _FunctionUtil.isFunction)(_this.props.onOk)) { if (!_this.props.multiMode) { _this.props.onOk(_this.state.selectedNode, _this.props.referName); _this.setState({ selectedId: null }); } else { _this.props.onOk(_this.state.selectedNodes, _this.props.referName); _this.setState({ selectedNodes: [] }); } } }, 0); }; _this.onClose = function (key) { return function (e) { var referParams = {}; referParams.condition = _this.props.condition; _this.setState({ showList: false }); _this.setState({ searchText: '' }); _this.props.onClose(key); }; }; _this.onOk = function (key) { return function (e) { var _self = _this; _this.setState({ pageNumber: 1, searchText: '', showList: false }); var referParams = {}; referParams.condition = _this.props.condition; if (_this.props.onOk && (0, _FunctionUtil.isFunction)(_this.props.onOk)) { if (!_this.props.multiMode) { _this.props.onOk(_this.state.selectedNode, key); _this.setState({ selectedId: null }); } else { _this.props.onOk(_this.state.selectedNodes, key); _this.setState({ selectedNodes: [] }); } } }; }; _this.onSearchSubmit = function (value) { if (value == '') { if (referParams.pid) { _this.getTreeData(referUrl[_this.props.referName], { pid: referParams.pid }, _this.props.referName); } else { _this.getTreeData(referUrl[_this.props.referName], {}, _this.props.referName); } } else { console.log(value); var currentData = data[_this.props.referName]; var searchData = []; var searchKey = _this.props.displayField; var search = function search(searchText, data) { for (var i = 0; i < data.length; i++) { if (data[i][searchKey].includes(searchText)) { searchData.push(data[i]); } if (data[i].children !== null) { search(searchText, data[i].children); } } }; search(value, currentData); data[_this.props.referName] = searchData; _this.setState({ animating: false }); } }; _this._clickItem = function (item) { var ajax = window.YYUtils.Ajax; _this.setState({ animating: true }); var _self = _this; var offline = _this.props.offline; var getText = offline ? ajax.getTextOffLine : ajax.getText; getText.call(ajax, referUrl[_self.props.referName], { referParams: referParams, pid: item.id }, function (result) { try { result = JSON.parse(result); } catch (e) { console.log("参照返回数据有异常!" + result); result = []; } item.children = result; if (item.open == null) { item.open = true; } else { item.open = !item.open; } _self.setState({ animating: false }); }, function (err) { _self.setState({ animating: false }); _toast2.default.info("服务器通讯异常!", 1); }); }; _this.treeContent = function (treeData, selectedId, show) { if (!_this.props.multiMode) { if (treeData) { return treeData.map(function (item, index) { var arrow = ''; if (!item.isLeaf && !item.open) { arrow = "right"; } else if (!item.isLeaf && item.open) { arrow = "down"; } if (show) { return _react2.default.createElement( 'div', { style: { position: 'relative', paddingLeft: '15px' } }, _react2.default.createElement( 'div', { className: 'refer-content', style: { borderBottom: '1px solid #CCCCCC' } }, _react2.default.createElement( RadioItem, { style: { width: '80vw' }, checked: false, onChange: function onChange(e) { return _this.onSingleChange(e, item); }, key: index }, _this.getItemContent(item) ), arrow !== '' && _react2.default.createElement( 'div', { className: 'yyrefer-tree-icon-openclose', onClick: function onClick() { _this._clickItem(item); } }, _react2.default.createElement(_icon2.default, { size: 'md', type: arrow, color: '#C7C7CC' }) ) ), _react2.default.createElement( 'div', { style: { paddingLeft: '10px' } }, _this.treeContent(item.children, selectedId, item.open) ) ); } }); } } else { if (treeData) { return treeData.map(function (item, index) { var arrow = ''; if (!item.isLeaf && !item.open) { arrow = "right"; } else if (!item.isLeaf && item.open) { arrow = "down"; } if (show) { return _react2.default.createElement( 'div', { style: { position: 'relative', paddingLeft: '15px' } }, _react2.default.createElement( 'div', { className: 'refer-content', style: { borderBottom: '1px solid #CCCCCC' } }, _react2.default.createElement( CheckboxItem, { style: { width: '85vw' }, checked: item.checked, onChange: function onChange(e) { return _this.onMultiChange(e, item); }, key: index }, _this.getItemContent(item) ), arrow !== '' && _react2.default.createElement( 'div', { className: 'yyrefer-tree-icon-openclose', onClick: function onClick() { _this._clickItem(item); } }, _react2.default.createElement(_icon2.default, { size: 'md', type: arrow, color: '#C7C7CC' }) ) ), _react2.default.createElement( 'div', { style: { paddingLeft: '10px' } }, _this.treeContent(item.children, selectedId, item.open) ) ); } }); } } }; _this.onChange = function () {}; _this.nextRefer = function (value) { setTimeout(function () { if (_this.state.changeOrNext) { if (!value.isLeaf) { _this.setState({ swiperNew: value }); _this.getTreeData(referUrl[_this.props.referName], { referParams: referParams, pid: value.id }, _this.props.referName); } } }, 10); }; _this.handleClick = function (value) { if (value.name == '首页') { _this.setState({ swiperow: [value] }); _this.getTreeData(value.url, value.referParams, _this.props.referName); } else { _this.state.swiperow.some(function (item, index) { if (item.id == value.id) { var name = _this.props.referName; var oldRow = _this.state.swiperow; var newRow = []; newRow = oldRow.splice(0, index + 1); _this.setState({ swiperow: newRow }); _this.getTreeData(referUrl[name], { pid: value.id }, _this.props.referName); } }); } }; _this.tapHandleClick = function (item) { var fulldata = data[_this.props.referName + 'fulldata']; var selectdata = _this.state.selectedNodes; for (var i = 0; i < selectdata.length; i++) { if (item === selectdata[i]) { if (i == 0) { selectdata.splice(0, 1); } else { selectdata.splice(i, 1); } _this.setState({ selectNodes: selectdata, row: selectdata }); } } var checkedfalse = function checkedfalse(fulldata) { for (var j = 0; j < fulldata.length; j++) { if (item.id == fulldata[j].id) { fulldata[j].checked = false; return; } else { if (Array.isArray(fulldata[j].children)) { checkedfalse(fulldata[j].children); } else { checkedfalse(fulldata[j]); } } } }; checkedfalse(fulldata); }; _this.state = { data: [], value: '', selectedId: null, selectedNode: {}, selectedNodes: [], animating: false, pageCount: '', searchText: '', showList: false, swiperow: [], changeOrNext: true, row: [], swiperNew: {} }; return _this; } _createClass(YYReferTree, [{ key: 'componentWillReceiveProps', value: function componentWillReceiveProps(nextprops) { var offline = nextprops.offline; var ajax = window.YYUtils.Ajax; var getJSON = offline ? ajax.getJSONOffLine : ajax.getJSON; if (nextprops.open !== this.props.open) { if (nextprops.open) { page = this; var name = this.props.referName; var open = this.props.open; page.setState(_defineProperty({}, name, open)); var referCode = page.props.referCode; var referStyle = page.props.referStyle; data[page.props.referName + 'fulldata'] = []; getJSON.call(ajax, _RestUrl2.default.REF_SERVER_URL + _RestUrl2.default.GET_REFINFO_BYCODE, { refCode: referCode }, function (result) { if (result.success) { if (result.data !== null) { referUrl[name] = result.data.dataurl; treereferUrl[name] = result.data.treerelyurl; relyfield[name] = result.data.relyfield; referParams = {}; referParams.condition = page.props.condition; referParams.pid = page.props.pid; var rows = [{ id: '001', name: '首页', url: referUrl[name], referParams: referParams }]; page.setState({ referName: result.data.refName, referUrl: referUrl, swiperow: rows, row: [] }); page.getTreeData(referUrl[name], referParams, name); } else { _toast2.default.info(result.msg, 2); } } else { _toast2.default.info("请检查参照编码!", 3); } }, function (err) { _toast2.default.info("服务器通讯异常!", 3); }); } } } }, { key: 'getTreeData', value: function getTreeData(referUrl, referParams, contentname) { var offline = this.props.offline; var ajax = window.YYUtils.Ajax; var getText = offline ? ajax.getTextOffLine : ajax.getText; var _self = this; _self.setState({ animating: true }); getText.call(ajax, referUrl, referParams, function (result) { if (result && result != "") { try { result = JSON.parse(result); } catch (e) { console.log("参照返回数据有异常!" + result); result = []; } if (result.length !== 0) { if (Object.keys(_self.state.swiperNew).length !== 0) { _self.setState({ swiperow: [].concat(_toConsumableArray(_self.state.swiperow), [_self.state.swiperNew]), swiperNew: {} }); } } var fulldata = data[contentname + 'fulldata']; for (var i = 0; i < fulldata.length; i++) { if (data[contentname + referParams.pid] == fulldata[i]) { data[contentname] = data[contentname + referParams.pid]; _self.setState({ animating: false }); return; } } data[contentname + referParams.pid] = result; data[contentname] = data[contentname + referParams.pid]; data[contentname + 'fulldata'].push(data[contentname + referParams.pid]); console.log(data[contentname + 'fulldata']); } _self.setState({ animating: false }); }, function (err) { _self.setState({ animating: false }); _toast2.default.info("服务器通讯异常!", 1); }); } }, { key: 'getItemContent', value: function getItemContent(item) { var displayField = this.props.displayField; if (this.props.renderRow) { var content = this.props.renderRow(item); if (content) { return content; } } return item[displayField]; } }, { key: 'render', value: function render() { var _state = this.state, value = _state.value, selectedId = _state.selectedId, animating = _state.animating, pageNumber = _state.pageNumber, showList = _state.showList; var _props = this.props, referlabel = _props.referlabel, referCode = _props.referCode, multiMode = _props.multiMode, displayField = _props.displayField, disabled = _props.disabled, referStyle = _props.referStyle, referName = _props.referName, open = _props.open, modalHeight = _props.modalHeight, isSearch = _props.isSearch; return _react2.default.createElement( _wingBlank2.default, null, _react2.default.createElement(_whiteSpace2.default, null), _react2.default.createElement( _modal2.default, { popup: true, visible: disabled ? '' : open, maskClosable: false, animationType: 'slide-up' }, _react2.default.createElement( 'div', { style: modalHeight == 'part' ? { height: '93vh', width: '100vw' } : { height: '100vh', width: '100vw', display: 'flex', flexDirection: 'column' } }, _react2.default.createElement( 'div', { className: 'Nav' }, _react2.default.createElement( _navBar2.default, { leftContent: '\u8FD4\u56DE', key: 'nav', mode: 'light', onLeftClick: this.onClose(referName), rightContent: [_react2.default.createElement( 'a', { key: 'nav', onClick: this.onOk(referName) }, '\u786E\u5B9A' )] }, referlabel ) ), _react2.default.createElement( 'div', null, _react2.default.createElement(_activityIndicator2.default, { toast: true, text: '\u52A0\u8F7D\u4E2D...', animating: animating }), _react2.default.createElement( 'div', { className: 'refer-lazytree-content' }, isSearch && _react2.default.createElement(_searchBar2.default, { placeholder: '\u641C\u7D22', onSubmit: this.onSearchSubmit }), _react2.default.createElement( _list2.default, null, this.treeContent(data[referName], selectedId, true) ) ) ), multiMode ? _react2.default.createElement( 'div', { className: 'yyrefer-tap' }, _react2.default.createElement( 'div', { style: { width: 'auto' } }, _react2.default.createElement(_deleteTap2.default, { rows: this.state.row, displayField: displayField, handleClick: this.tapHandleClick }) ) ) : '' ) ) ); } }]); return YYReferTree; }(_react2.default.Component); exports.default = YYReferTree; YYReferTree.defaultProps = { referlabel: '参照', referCode: '', modalHeight: 'all', displayField: 'name', referParams: {}, multiMode: true, disabled: false, open: false, onOk: {}, referName: 'key', referStyle: 'lazy-tree', condition: {}, pid: {}, listCondition: {} };