oadp-material
Version:
oadp-material
315 lines • 12 kB
JavaScript
import _Select from "@alifd/next/es/select";
import _Divider from "@alifd/next/es/divider";
import _Box from "@alifd/next/es/box";
import _Search from "@alifd/next/es/search";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import _extends from "@babel/runtime/helpers/extends";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
var _excluded = ["name", "attribute", "value", "defaultValue", "field", "label", "placeholder", "size", "mode", "hasBorder", "hasArrow", "hasClear", "required", "readOnly", "disabled"];
import _regeneratorRuntime from "@babel/runtime/regenerator";
import * as React from 'react';
import "./index.scss";
import { entityDataUtil, entityMetadataUtil } from 'oadp-common';
export var OadpSelect = /*#__PURE__*/function (_React$Component) {
function OadpSelect(props) {
var _this;
_this = _React$Component.call(this, props) || this;
_this.initDataSoure = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
var _this$props, attribute, value, attributeWithRefer, response, dataSourceArray;
return _regeneratorRuntime.wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
_this$props = _this.props, attribute = _this$props.attribute, value = _this$props.value;
console.log('initDataSoure this.props', _this.props);
_context.prev = 2;
if (_this.state.needInitDataSource) {
_context.next = 5;
break;
}
return _context.abrupt("return");
case 5:
if (attribute) {
_context.next = 8;
break;
}
console.error('attribute is required');
return _context.abrupt("return");
case 8:
_context.next = 10;
return entityMetadataUtil.asyncSelectAttributeWithReferById(attribute);
case 10:
attributeWithRefer = _context.sent;
if (attributeWithRefer) {
_context.next = 14;
break;
}
console.error('attributeWithRefer is required');
return _context.abrupt("return");
case 14:
_this.setState({
attributeWithRefer: attributeWithRefer,
needInitDataSource: false
});
if (value) {
_context.next = 18;
break;
}
console.warn('value is required');
return _context.abrupt("return");
case 18:
_context.next = 20;
return entityDataUtil.asyncSelectOneByPrimaryKey(attributeWithRefer.referEntity.logicalName, attributeWithRefer.referAttribute.logicalName, value);
case 20:
response = _context.sent;
if (response.data) {
_context.next = 24;
break;
}
console.error('response.data is required', response);
return _context.abrupt("return");
case 24:
dataSourceArray = [];
dataSourceArray.push({
label: response.data.name,
value: response.data[attributeWithRefer.referAttribute.logicalName]
});
_this.setState({
dataSource: dataSourceArray
});
_context.next = 32;
break;
case 29:
_context.prev = 29;
_context.t0 = _context["catch"](2);
console.error("加载初始数据时发生错误：", _context.t0);
case 32:
case "end":
return _context.stop();
}
}, _callee, null, [[2, 29]]);
}));
// 递归函数来处理 filterRule
_this.handleFilterRuleToCondition = function (filterCondition, field) {
console.log('handleFilterRuleToCondition begin with filterCondition', filterCondition, field);
if (!filterCondition) return;
var newFilterCondition = _extends({}, filterCondition);
if (filterCondition.operator === 'or' || filterCondition.operator === 'and') {
newFilterCondition.value = filterCondition.value.map(function (item) {
return _this.handleFilterRuleToCondition(item, field);
});
} else {
if (filterCondition.valueType === 'ATTRIBUTE') {
var attributeValueLogicalName = filterCondition.value;
newFilterCondition.value = field.getValue(attributeValueLogicalName);
}
}
console.log('handleFilterRuleToCondition end with newFilterCondition', newFilterCondition);
return newFilterCondition;
};
_this.handleFocus = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
var _this$props2, attribute, filterRule, field, attributeWithRefer, condition, query, response, dataSourceArray;
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
_this.setState({
searchValue: ''
});
_this$props2 = _this.props, attribute = _this$props2.attribute, filterRule = _this$props2.filterRule, field = _this$props2.field;
console.log('handleFocus begin with ', attribute, filterRule, field);
attributeWithRefer = _this.state.attributeWithRefer;
condition = null;
if (filterRule) {
condition = _this.handleFilterRuleToCondition(filterRule, field);
}
console.log('handleFocus condition', condition);
query = {
"model": attributeWithRefer.referEntity.logicalName,
condition: condition,
"orderBy": [{
"attribute": "updateAt",
"operator": "desc"
}],
"pageNum": 1,
"pageSize": 1000
};
_context2.next = 10;
return entityDataUtil.asyncSelectPageListByCondition(attributeWithRefer.referEntity.logicalName, query);
case 10:
response = _context2.sent;
console.log('response', response);
dataSourceArray = [];
response.data.list.forEach(function (item) {
dataSourceArray.push({
label: item.name,
value: item[attributeWithRefer.referAttribute.logicalName]
});
});
_this.setState({
dataSource: dataSourceArray
});
console.log("dataSourceArray return", dataSourceArray);
case 16:
case "end":
return _context2.stop();
}
}, _callee2);
}));
_this.handleSearch = /*#__PURE__*/function () {
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(value) {
var searchValue, attributeWithRefer, condition, response, dataSourceArray;
return _regeneratorRuntime.wrap(function _callee3$(_context3) {
while (1) switch (_context3.prev = _context3.next) {
case 0:
// const{ searchValue } = this.state;
searchValue = value;
if (!(searchValue === '')) {
_context3.next = 3;
break;
}
return _context3.abrupt("return");
case 3:
attributeWithRefer = _this.state.attributeWithRefer;
console.log('Select onFocus begin ', attributeWithRefer.referEntity.logicalName, searchValue);
condition = {
"model": attributeWithRefer.referEntity.logicalName,
"condition": {
"attribute": "name",
"operator": "like",
"value": searchValue
},
"orderBy": [{
"attribute": "updateAt",
"operator": "desc"
}],
"pageNum": 1,
"pageSize": 1000
};
_context3.next = 8;
return entityDataUtil.asyncSelectPageListByCondition(attributeWithRefer.referEntity.logicalName, condition);
case 8:
response = _context3.sent;
console.log('response', response);
dataSourceArray = [];
response.data.list.forEach(function (item) {
dataSourceArray.push({
label: item.name,
value: item[attributeWithRefer.referAttribute.logicalName]
});
});
_this.setState({
dataSource: dataSourceArray
});
console.log("dataSourceArray return", dataSourceArray);
case 14:
case "end":
return _context3.stop();
}
}, _callee3);
}));
return function (_x) {
return _ref3.apply(this, arguments);
};
}();
_this.state = {
dataSource: [],
needInitDataSource: true,
searchValue: '',
attributeWithRefer: null
};
return _this;
}
_inheritsLoose(OadpSelect, _React$Component);
var _proto = OadpSelect.prototype;
_proto.componentDidMount = function componentDidMount() {
// this.initDataSoure();
};
_proto.render = function render() {
var _this2 = this;
var _this$props3 = this.props,
name = _this$props3.name,
attribute = _this$props3.attribute,
value = _this$props3.value,
defaultValue = _this$props3.defaultValue,
field = _this$props3.field,
label = _this$props3.label,
placeholder = _this$props3.placeholder,
size = _this$props3.size,
mode = _this$props3.mode,
hasBorder = _this$props3.hasBorder,
hasArrow = _this$props3.hasArrow,
hasClear = _this$props3.hasClear,
required = _this$props3.required,
readOnly = _this$props3.readOnly,
disabled = _this$props3.disabled,
otherProps = _objectWithoutPropertiesLoose(_this$props3, _excluded);
var menuProps = {
focusable: false,
header: /*#__PURE__*/React.createElement(_Box, {
style: {
padding: '0 4px',
textAlign: 'center'
}
}, /*#__PURE__*/React.createElement(_Box, {
style: {
paddingBottom: 4
}
}, /*#__PURE__*/React.createElement(_Search, {
shape: "simple",
onSearch: this.handleSearch,
style: {
width: '100%'
},
placeholder: "\u8F93\u5165\u5173\u952E\u5B57\u67E5\u8BE2",
hasClear: true
})), /*#__PURE__*/React.createElement(_Divider, {
style: {
marginTop: 0,
marginBottom: 4
}
})),
footer: /*#__PURE__*/React.createElement(_Box, {
style: {
padding: '0 4px',
textAlign: 'center'
}
}, /*#__PURE__*/React.createElement(_Divider, {
style: {
marginBottom: 0,
marginTop: 4
}
}))
};
this.initDataSoure();
return /*#__PURE__*/React.createElement(_Select, _extends({
name: name,
value: value,
dataSource: this.state.dataSource,
onFocus: this.handleFocus,
onBlur: function onBlur() {
return _this2.setState({
searchValue: ''
});
},
showSearch: true,
onSearch: this.handleSearch,
filterLocal: false,
popupAutoFocus: true,
menuProps: menuProps,
defaultValue: defaultValue,
label: label,
placeholder: placeholder,
size: size,
mode: mode,
hasBorder: hasBorder,
hasArrow: hasArrow,
hasClear: hasClear,
required: required,
readOnly: readOnly,
disabled: disabled
}, otherProps));
};
return OadpSelect;
}(React.Component);
;
export default OadpSelect;