react-admin-component
Version:
react library
44 lines • 2.24 kB
JavaScript
import * as tslib_1 from "tslib";
import React, { useState, useEffect, useRef } from 'react';
import { debounce } from 'lodash';
import { AutoComplete } from 'antd';
import { InputSearchTable } from '..';
var TdAutoRender = function (props) {
var _a = useState([]), options = _a[0], setOptions = _a[1];
var _b = useState(), inputValue = _b[0], setInputValue = _b[1];
var tableRef = useRef();
var onSearch = debounce(function (value) {
props.tableConfig && openTable();
value &&
props.fetchApi &&
props
.fetchApi(props.apiParamsCb ? props.apiParamsCb(value) : value)
.then(function (res) {
setOptions(res.map(function (data) { return (React.createElement(AutoComplete.Option, tslib_1.__assign({ key: data.key || data.value, value: data.value }, { data: data }), props.optionRender ? props.optionRender(data) : data.value)); }));
});
}, 500);
function onSelect(value, option) {
props.onSelect && props.onSelect(value, option);
setInputValue(value);
}
function onChange(value) {
setInputValue(value);
!props.tableConfig && props.onChange && props.onChange(value);
}
function onRowCB(normalizeValue, record, inputValue) {
if (inputValue)
setInputValue(inputValue);
props.onChange && props.onChange(normalizeValue ? normalizeValue(record) : record);
}
function openTable() {
tableRef.current.setTableVisible(true);
}
useEffect(function () {
props.value && setInputValue(props.value);
}, [props.value]);
return (React.createElement("div", { style: { position: 'relative' } },
React.createElement(AutoComplete, { className: props.className, style: props.style, onSelect: onSelect, onSearch: onSearch, onChange: onChange, placeholder: props.placeholder || '请输入值', value: inputValue }, options),
props.tableConfig && (React.createElement(InputSearchTable, { onRowCB: onRowCB, inputValue: inputValue, tableConfig: tslib_1.__assign({}, props.tableConfig), ref: tableRef }))));
};
export default TdAutoRender;
//# sourceMappingURL=index.js.map