@flatbiz/antd
Version:
191 lines (187 loc) • 7.89 kB
JavaScript
/*! @flatjs/forge MIT @flatbiz/antd */
import _RedoOutlined from '@ant-design/icons/es/icons/RedoOutlined.js';
import { _ as _objectWithoutProperties, a as _slicedToArray, b as _objectSpread2, i as _defineProperty } from './_rollupPluginBabelHelpers-BspM60Sw.js';
import { isArray } from '@dimjs/lang/is-array';
import { get } from '@dimjs/utils/get/get';
import { useState, useMemo } from 'react';
import { useDebounceFn } from 'ahooks';
import { Select, Button } from 'antd';
import { isUndefinedOrNull } from '@flatbiz/utils';
import { fbaHooks } from './fba-hooks/index.js';
import { R as RequestStatus } from './request-status-Cjtei7Bl.js';
import { jsx } from 'react/jsx-runtime';
var _excluded = ["showAllOption", "serviceConfig", "onSelectorListChange", "onSelectorRequestError", "requestMessageConfig", "fieldNames", "onLabelRenderAdapter"];
/**
* 选择器简单包装组件
* @param props
* @returns
* ```
* 1. 只支持 search + 服务 功能
* 2. 不会缓存接口数据
* 3. 不会对value、onChange做任何处理
* 4. 修改文案【未获取到必要的查询条件】，通过参数 requestMessageConfig={{'no-dependencies-params': '自定义文案'}} 配置
* 5. 通过设置 fieldNames.searchKeyword 可修改关键字key值，默认值：searchKeyword
* ```
*/
var SelectorWrapperSearch = function SelectorWrapperSearch(props) {
var showAllOption = props.showAllOption,
serviceConfig = props.serviceConfig,
onSelectorListChange = props.onSelectorListChange,
onSelectorRequestError = props.onSelectorRequestError,
requestMessageConfig = props.requestMessageConfig,
fieldNames = props.fieldNames,
onLabelRenderAdapter = props.onLabelRenderAdapter,
otherProps = _objectWithoutProperties(props, _excluded);
var _useState = useState('request-init'),
_useState2 = _slicedToArray(_useState, 2),
requestStatus = _useState2[0],
setRequestStatus = _useState2[1];
var _useState3 = useState(),
_useState4 = _slicedToArray(_useState3, 2),
dataSource = _useState4[0],
setDataSource = _useState4[1];
var optionsItemLabelField = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label) || 'label';
var optionsItemValueField = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.value) || 'value';
var optionsItemDisabledField = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.disabled) || 'disabled';
var searchKeyword = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.searchKeyword) || 'searchKeyword';
var serviceParams = serviceConfig.params;
var requiredParamsKeys = serviceConfig.requiredParamsKeys || [];
var allOptionConfig = useMemo(function () {
var isTrue = showAllOption === true;
if (showAllOption) {
return {
label: isTrue ? '全部' : showAllOption.label,
value: isTrue ? '' : showAllOption.value
};
}
return null;
}, [showAllOption]);
var serviceRespDataAdapter = function serviceRespDataAdapter(respData) {
var result = respData;
if (serviceConfig.onRequestResultAdapter) {
result = serviceConfig.onRequestResultAdapter(respData);
} else if (fieldNames !== null && fieldNames !== void 0 && fieldNames.list) {
result = get(respData, fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.list);
}
if (result && !isArray(result)) {
console.warn('待渲染数据为非数组结构', result);
return [];
}
return result || [];
};
var startDataSourceRequest = function startDataSourceRequest(keyword) {
return new Promise(function ($return, $error) {
var _serviceConfig$onRequ, isEmpty, respData, respAdapterData;
var $Try_1_Post = function () {
try {
return $return();
} catch ($boundEx) {
return $error($boundEx);
}
};
var $Try_1_Catch = function (error) {
try {
setRequestStatus('request-error');
onSelectorRequestError === null || onSelectorRequestError === void 0 || onSelectorRequestError(error);
return $Try_1_Post();
} catch ($boundEx) {
return $error($boundEx);
}
};
try {
if (requiredParamsKeys.length) {
isEmpty = serviceParams ? requiredParamsKeys.find(function (key) {
return isUndefinedOrNull(serviceParams[key]);
}) : true;
if (isEmpty) {
// 当依赖项查询条件为空时，清空当前缓存数据
setDataSource([]);
setRequestStatus('no-dependencies-params');
return $return();
}
}
if (!keyword) {
setRequestStatus('request-search-keyword-empty');
return $return();
}
setRequestStatus('request-progress');
return Promise.resolve((_serviceConfig$onRequ = serviceConfig.onRequest) === null || _serviceConfig$onRequ === void 0 ? void 0 : _serviceConfig$onRequ.call(serviceConfig, _objectSpread2(_objectSpread2({}, serviceParams), {}, _defineProperty({}, searchKeyword, keyword)))).then(function ($await_2) {
try {
respData = $await_2;
respAdapterData = serviceRespDataAdapter(respData);
onSelectorListChange === null || onSelectorListChange === void 0 || onSelectorListChange(respAdapterData);
if (optionsItemLabelField && optionsItemValueField) {
respAdapterData = respAdapterData.map(function (item) {
return _objectSpread2(_objectSpread2({}, item), {}, {
label: item[optionsItemLabelField],
value: item[optionsItemValueField],
disabled: item[optionsItemDisabledField || 'disabled']
});
});
}
respAdapterData.forEach(function (item) {
if (onLabelRenderAdapter) {
item.label = onLabelRenderAdapter(item);
}
});
if (allOptionConfig) {
respAdapterData.unshift(allOptionConfig);
}
setDataSource(respAdapterData);
setRequestStatus('request-success');
return $Try_1_Post();
} catch ($boundEx) {
return $Try_1_Catch($boundEx);
}
}, $Try_1_Catch);
} catch (error) {
$Try_1_Catch(error);
}
});
};
var _useDebounceFn = useDebounceFn(function (value) {
setDataSource([]);
void startDataSourceRequest(value);
}, {
wait: 300,
leading: false,
trailing: true
}),
onSearch = _useDebounceFn.run;
fbaHooks.useEffectCustom(function () {
void startDataSourceRequest(props.customKeyword);
}, [props.customKeyword]);
var loading = requestStatus === 'request-progress';
return /*#__PURE__*/jsx(Select, _objectSpread2(_objectSpread2({
showSearch: true,
allowClear: true,
popupMatchSelectWidth: false,
placeholder: '输入关键字搜索'
}, otherProps), {}, {
style: _objectSpread2({
width: '100%'
}, props.style),
options: dataSource,
filterOption: false,
onSearch: onSearch,
notFoundContent: /*#__PURE__*/jsx(RequestStatus, {
status: requestStatus,
loading: loading,
messageConfig: _objectSpread2({
'request-init': '请输入搜索关键字'
}, requestMessageConfig),
errorButton: /*#__PURE__*/jsx(Button, {
type: "primary",
onClick: startDataSourceRequest,
children: "\u91CD\u65B0\u83B7\u53D6\u6570\u636E"
})
}),
suffixIcon: requestStatus === 'request-error' ? /*#__PURE__*/jsx(_RedoOutlined, {
spin: loading,
onClick: startDataSourceRequest
}) : undefined,
loading: loading
}));
};
export { SelectorWrapperSearch as S };
//# sourceMappingURL=selector-wrapper-search-LtjeLAG8.js.map