@linkdesign/screen
Version:
屏组件库，但使用场景又不局限于屏。主要用于BI、大盘和屏
235 lines (219 loc) • 9.01 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _react = _interopRequireWildcard(require("react"));
var _rxjs = require("rxjs");
var _lodashEs = require("lodash-es");
var _operators = require("rxjs/operators");
var _Utils = require("../Utils");
var _excluded = ["component", "children", "filters"]; // import { v4 as uuidv4 } from 'uuid';
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
var Query = /*#__PURE__*/function (_PureComponent) {
(0, _inheritsLoose2["default"])(Query, _PureComponent);
function Query(props) {
var _this;
_this = _PureComponent.call(this, props) || this;
_this.subject$ = void 0;
_this.timeout = void 0;
_this.refetch = function (nextVariables) {
if (nextVariables === void 0) {
nextVariables = {};
}
var savedVariables = _this.state.savedVariables;
var flag = _this.props.flag;
var mergedVariables = (0, _extends2["default"])({}, savedVariables, nextVariables);
if (flag) _this.subject$.next(mergedVariables);
};
_this.state = {
data: null,
loading: false,
error: null,
savedVariables: props.variables
};
_this.subject$ = new _rxjs.Subject();
_this.subject$.asObservable().pipe((0, _operators.switchMap)(function (variables) {
// console.log('variables: ', variables);
var _this$props = _this.props,
query = _this$props.query,
onCompleted = _this$props.onCompleted,
onError = _this$props.onError,
interval = _this$props.interval,
flag = _this$props.flag;
var cb = function cb() {
if (interval && flag) {
_this.timeout = setTimeout(function () {
_this.subject$.next(variables);
}, interval);
}
};
_this.setState({
savedVariables: variables,
loading: true
});
var handleSuccess = function handleSuccess(data, callback) {
if (callback === void 0) {
callback = function callback() {};
}
if ((0, _lodashEs.isFunction)(onCompleted)) {
onCompleted(data);
}
_this.setState({
data: data,
error: null,
loading: false
}, callback);
};
var handleError = function handleError(err, callback) {
if (callback === void 0) {
callback = function callback() {};
}
if ((0, _lodashEs.isFunction)(onError)) {
onError(err);
}
_this.setState({
error: err,
loading: false
}, callback);
};
var request = query((0, _extends2["default"])({}, variables)).then(function (res) {
handleSuccess(res, cb);
})["catch"](function (err) {
handleError(err, cb);
});
return (0, _rxjs.from)(request);
})).subscribe();
return _this;
}
var _proto = Query.prototype;
_proto.componentDidMount = function componentDidMount() {
var _this$props2 = this.props,
_this$props2$variable = _this$props2.variables,
variables = _this$props2$variable === void 0 ? {} : _this$props2$variable,
flag = _this$props2.flag;
// let tmp = [], components: any[] = [];
// const childrenTmp = isFunction(children) ? children() : children;
// if (isArray(childrenTmp)) {
// // @ts-ignore
// tmp = childrenTmp.filter((child) => isValidElement(child)).map(({ type, props }, index) => {
// const { bizId } = get(props, 'requestParams', {});
// const { category, displayName } = type;
// const uuid = `${category}-${displayName}-${index}`;
// type.uuid = uuid;
// return {
// uuid: index, // uuidv4(),
// bizId,
// componentIds: [uuid],
// };
// });
// } else if (isValidElement(childrenTmp)) {
// const { type, props } = childrenTmp;
// const { bizId } = get(props, 'requestParams', {});
// // @ts-ignore
// const { category, displayName } = type;
// const uuid = `${category}-${displayName}-${uuidv4()}`;
// // @ts-ignore
// type.uuid = uuid;
// tmp = [{
// uuid: uuidv4(),
// bizId,
// componentIds: [uuid],
// }];
// }
// for (let i = 0; i < tmp.length; i++) {
// const el = tmp[i];
// const target = components.find((item) => item.bizId === el.bizId);
// if (!target) {
// components.push({
// ...el,
// componentIds: el.componentIds
// });
// } else {
// target.componentIds.push(...el.componentIds)
// }
// }
if (flag) this.subject$.next(variables);
// this.subject$.next({
// requestParamJsonStr: JSON.stringify(variables),
// components,
// });
};
_proto.componentDidUpdate = function componentDidUpdate(prevProps) {
var _this$props3 = this.props,
variables = _this$props3.variables,
flag = _this$props3.flag;
if (!(0, _lodashEs.isEqual)(prevProps.variables, variables) && flag) {
this.subject$.next(variables);
}
};
_proto.componentWillUnmount = function componentWillUnmount() {
clearTimeout(this.timeout);
this.subject$.unsubscribe();
};
_proto.render = function render() {
var _this$props4 = this.props,
Component = _this$props4.component,
children = _this$props4.children,
filters = _this$props4.filters,
others = (0, _objectWithoutPropertiesLoose2["default"])(_this$props4, _excluded);
var _this$state = this.state,
data = _this$state.data,
loading = _this$state.loading,
error = _this$state.error,
savedVariables = _this$state.savedVariables;
var filteredData = (0, _lodashEs.isArray)(filters) ? (0, _Utils.Compose)(filters)(data) : data;
var tmp = (0, _lodashEs.isFunction)(children) ? children({
data: filteredData,
loading: loading,
error: error,
variables: savedVariables,
refetch: this.refetch
}) : children;
// console.log('response: ', filteredData);
if ((0, _lodashEs.isArray)(tmp)) {
tmp = _react.Children.map(tmp, function (child) {
// console.log(i, child);
var props = child.props;
// const { uuid } = type;
var viewProps = (0, _lodashEs.get)(props, 'requestParams.props', []);
// const params = get(filteredData, key, {});
var params = {};
viewProps.forEach(function (_ref) {
var key = _ref.key,
value = _ref.value;
params[key] = value ? (0, _lodashEs.get)(filteredData, value) : filteredData;
});
// console.log('params', params);
return /*#__PURE__*/(0, _react.isValidElement)(child) ? /*#__PURE__*/(0, _react.cloneElement)(child, params) : child;
});
} else if ( /*#__PURE__*/(0, _react.isValidElement)(tmp)) {
var _tmp = tmp,
props = _tmp.props;
var viewProps = (0, _lodashEs.get)(props, 'requestParams.props', []);
// const params = get(filteredData, key, {});
var params = {};
viewProps.forEach(function (_ref2) {
var key = _ref2.key,
value = _ref2.value;
params[key] = value ? (0, _lodashEs.get)(filteredData, value) : filteredData;
});
// console.log('params', params);
tmp = /*#__PURE__*/(0, _react.cloneElement)(tmp, params);
}
if (Component === null) {
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, tmp);
}
return /*#__PURE__*/_react["default"].createElement(Component, others, /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, tmp));
};
return Query;
}(_react.PureComponent); // @ts-ignore
Query.defaultProps = {
component: null,
variables: {},
flag: true
};
var _default = exports["default"] = Query;