ztxkui 1.9.8 → 2.0.2

package/dist/Demo.js

@@ -6,7 +6,7 @@ var selectStyle = { width: '200px' };
 function request(options) {
     return fetch(options.url + "?" + stringify(options.params), {
         headers: {
-            'Zmdms-Auth': 'bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0ZW5hbnRfaWQiOiIwMDAwMDAiLCJtZW1iZXJfdHlwZSI6MSwidXNlcl9uYW1lIjoiY2hlbnl4IiwicmVhbF9uYW1lIjoi6ZmI5Lqa6ZuEMSIsImNsaWVudF90eXBlIjoid2ViIiwiZGF0YV9yb2xlX2lkIjoiMTQxMjYxNDExMDY0NzM4NjExNCIsImNsaWVudF9pZCI6InN3b3JkIiwidXNlcl90eXBlIjoid2ViIiwicm9sZV9pZCI6IjE0MTI2MTAwNzg0NzQyMDcyMzMiLCJzY29wZSI6WyJhbGwiXSwiZXhwIjoxNjMxNzYwNTE0LCJqdGkiOiJhNDZlMDc4ZC1mNTBmLTQ2MDEtODEyZC1mNDFiOTFlODg0ZTAiLCJtZW1iZXJfaWQiOjE0MTI5NTMyMDUyNjk1MTYyOTAsImNvbXBhbnlfaWQiOjEzOTcwNzQ2MDU0MTI2OTYwNjYsImRlcHRfbmFtZSI6IuS4muWKoeS4gOmDqCIsImF2YXRhciI6IiIsImRhdGFfcm9sZV9uYW1lIjoidXNlciIsImF1dGhvcml0aWVzIjpbInVzZXIiXSwicm9sZV9uYW1lIjoidXNlciIsImxpY2Vuc2UiOiJwb3dlcmVkIGJ5IHptZG1zIiwicG9zdF9pZCI6IiIsInVzZXJfaWQiOiIxNDEyOTUzODA0MzMzNTU1NzE0Iiwibmlja19uYW1lIjoi6ZmI5Lqa6ZuEIiwiY29tcGFueV9uYW1lIjoi5rWZ5ZWG5Lit5ouT6ZuG5Zui54mp5rWB56eR5oqA5pyJ6ZmQ5YWs5Y-4IiwiZGVwdF9pZCI6IjEzOTcwODE5MzAzMjg0MjQ0NDkiLCJhY2NvdW50IjoiY2hlbnl4In0.4_b7rGt1x6k7JuMQQasAGQlVNsnQXXq_9pOADGzJagQ',
+            'Zmdms-Auth': 'bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0ZW5hbnRfaWQiOiIwMDAwMDAiLCJtZW1iZXJfdHlwZSI6MSwiaGFuZGxlX2hyX3Bob25lIjpudWxsLCJyZXN1bWVfZGF0ZSI6bnVsbCwidXNlcl9uYW1lIjoiY2hlbnl4IiwiaW10X2lkIjpudWxsLCJyZWFsX25hbWUiOiLpmYjkuprpm4QiLCJjbGllbnRfdHlwZSI6IndlYiIsImRhdGFfcm9sZV9pZCI6IjEzNDU5Nzg1MDUzMDIwNTY5NjIsMTQxMjYxNDExMDY0NzM4NjExNCwxNDEyNjE1Njc3MTE5MjY2ODE3LDE0NDgxMjEwODY1MDQzMDA1NDYsMTQ1MjgyMDI5MzgwMjcxMzA5MCwxNDUzOTI1MDAxNTMxNDc4MDE3LDE0NTg3MTIwODIwODIzNTcyNTAsMTQ1ODgyNjIzODE4NTg4OTc5NCwxNDU4ODI3NzAxMDEyMzI0MzUzLDE0NTg4MjgzNjA4MDE1MDkzNzcsMTQ2MDA4OTI2MjAxMjAzMDk3NywxNDYxMTM3Nzg4NjQ1MTI2MTQ2IiwiY2xpZW50X2lkIjoic3dvcmQiLCJ1c2VyX3R5cGUiOiJ3ZWIiLCJyb2xlX2lkIjoiMTQxMjYwODc0Mjk1MzI4NzY4MiwxNDM4MzIyNTQzMjk1OTI2Mjc0LDE0NDM0NzU0NzU5NzI3MzQ5NzcsMTQ0NjgxOTQ2MzY5Mzg0NDQ4MiwxNDYwMDg1NDI2ODE1OTUwODQ5LDE0NjI2MjI5OTIzNzUyMDk5ODYiLCJwb3N0X25hbWUiOm51bGwsInNjb3BlIjpbImFsbCJdLCJpbnRlcnZpZXdfaWQiOm51bGwsImV4cCI6MTYzOTI3NTUxNiwib3JnX25hbWUiOiLmuZbljZfkuK3mi5Pkv6Hmga_np5HmioDmnInpmZDlhazlj7giLCJqdGkiOiJjOTM4ZmFlMy05YzA1LTQ1MzQtYTVhNy1mZjllY2VkMTFiOWIiLCJtZW1iZXJfaWQiOjE0MTI5NTMyMDUyNjk1MTYyOTAsImNvbXBhbnlfaWQiOjEzOTcwNzQ2MDU0MTI2OTYwNjYsInN5c3RlbV9pZCI6IjMiLCJkZXB0X25hbWUiOiLkuJrliqHkuIDpg6giLCJhdmF0YXIiOiIiLCJkYXRhX3JvbGVfbmFtZSI6ImFkbWluLHVzZXIsdXNlcixhZG1pbixhZG1pbixhZG1pbix1c2VyLHVzZXIsdXNlcix1c2VyLHVzZXIsdXNlciIsImF1dGhvcml0aWVzIjpbImFkbWluIiwidXNlciIsImFkbWluaXN0cmF0b3IiXSwicm9sZV9uYW1lIjoidXNlcixhZG1pbixhZG1pbixhZG1pbmlzdHJhdG9yLHVzZXIsdXNlciIsInJlc3VtZV90ZW1wbGF0ZSI6bnVsbCwibGljZW5zZSI6InBvd2VyZWQgYnkgem1kbXMiLCJwb3N0X2lkIjoiIiwidXNlcl9pZCI6IjE0MTI5NTM4MDQzMzM1NTU3MTQiLCJvcmdfaWQiOjE0NTc1Mjc3NjU5MTg1MTU1MzUsIm5pY2tfbmFtZSI6IumZiOS6mumbhCIsImNvbXBhbnlfbmFtZSI6Iua1meWVhuS4reaLk-mbhuWboueJqea1geenkeaKgOaciemZkOWFrOWPuCIsImRlcHRfaWQiOiIxMzk3MDgxOTMwMzI4NDI0NDQ5IiwiaGFuZGxlX2hyX25hbWUiOm51bGwsImFjY291bnQiOiJjaGVueXgiLCJyZXN1bWVfaWQiOm51bGx9.Moo8uYZzd7bNGw_jsydYQvyf5lVoJA8LLUNQdkPxXac',
         },
         method: options.method,
     }).then(function (response) { return response.json(); });
@@ -15,6 +15,7 @@ function Demo() {
     console.log('rerender');
     var _a = useState([]), list = _a[0], setList = _a[1];
     var _b = useState([]), defaultList = _b[0], setDefaultList = _b[1];
+    var _c = useState(''), value = _c[0], setValue = _c[1];
     // 模拟接口请求
     useEffect(function () {
         var timeoutId = setTimeout(function () {
@@ -46,6 +47,7 @@ function Demo() {
                     projectName: '项目12',
                 },
             ]);
+            // setValue('1462433051208761603');
         }, 2000);
         return function () {
             if (timeoutId) {
@@ -61,18 +63,10 @@ function Demo() {
                 console.log(value, option, fullData);
             } }),
         React.createElement("h2", null, "\u5F02\u6B65\u83B7\u53D6\u6570\u636E"),
-        React.createElement(EnhanceSelect, { style: selectStyle, url: "http://192.168.0.83:8000/api/zmdms-user/list", params: JSON.stringify({
-                status: 50,
-                companyId: '1397074605412696066',
-            }), request: request, joinKey: "depName" }),
         React.createElement("h2", null, "\u5F02\u6B65\u83B7\u53D6\u6570\u636E\uFF0C\u5E76\u7F13\u5B58\u6570\u636E"),
-        React.createElement(EnhanceSelect, { style: selectStyle, url: "http://192.168.0.83:8000/api/zmdms-user/list", params: JSON.stringify({
-                status: 50,
-                companyId: '1397074605412696066',
-            }), request: request, isCatch: true }),
         React.createElement("h2", null, "\u8FDC\u7A0B\u6A21\u7CCA\u641C\u7D22"),
-        React.createElement(EnhanceSelect, { style: selectStyle, placeholder: "\u53EF\u8FDC\u7A0B\u6A21\u7CCA\u641C\u7D22", url: "http://192.168.0.83:8000/api/zmdms-lms-busi/project/page", params: JSON.stringify({
-                depId: '1397081930328424449',
-            }), request: request, remoteSearch: true, titleKey: "projectName", defaultList: defaultList })));
+        React.createElement(EnhanceSelect, { style: selectStyle, placeholder: "\u53EF\u8FDC\u7A0B\u6A21\u7CCA\u641C\u7D22", url: "http://192.168.0.83:8000/api/zmdms-system/employee/page", request: request, remoteSearch: true, dataKey: "id", titleKey: "empName", 
+            // value={value}
+            mode: "multiple" })));
 }
 export default Demo;

package/dist/components/EnhanceSelect/index.d.ts

@@ -75,6 +75,10 @@ export interface IProps<T> extends Omit<SelectProps<T>, 'onChange'> {
      * 远程搜索Key值
      */
     remoteSearchKey?: string;
+    /**
+     * 远程搜索主键Key值
+     */
+    remoteSearchDataKey?: string;
     /**
      * 接口数据格式转换
      */
@@ -95,6 +99,6 @@ export interface IProps<T> extends Omit<SelectProps<T>, 'onChange'> {
  *    { code: 200, data: { records: [] } } || { status: 200, data: { code: 200, data: { records: [] } } }
  * 如果数据不能在接口层面满足以上形式，那么组件提供transformData属性，转换接口数据格式
  */
-declare function EnhanceSelect<VT extends SelectValue = SelectValue>({ list, defaultList, params, url, method, dataKey, componentKey, titleKey, showAll, isCatch, onCompleted, onChange, request, remoteSearch, remoteSearchKey, transformData, joinKey, joinStr, ...restProps }: IProps<VT>): JSX.Element;
+declare function EnhanceSelect<VT extends SelectValue = SelectValue>({ list, defaultList, params, url, method, dataKey, componentKey, titleKey, showAll, isCatch, onCompleted, onChange, request, remoteSearch, remoteSearchKey, remoteSearchDataKey, transformData, joinKey, joinStr, ...restProps }: IProps<VT>): JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof EnhanceSelect>;
 export default _default;

package/dist/components/EnhanceSelect/index.js

@@ -71,11 +71,14 @@ function getData(request, options) {
  * 如果数据不能在接口层面满足以上形式，那么组件提供transformData属性，转换接口数据格式
  */
 function EnhanceSelect(_a) {
-    var list = _a.list, defaultList = _a.defaultList, params = _a.params, url = _a.url, _b = _a.method, method = _b === void 0 ? 'GET' : _b, _c = _a.dataKey, dataKey = _c === void 0 ? 'id' : _c, componentKey = _a.componentKey, _d = _a.titleKey, titleKey = _d === void 0 ? 'name' : _d, showAll = _a.showAll, isCatch = _a.isCatch, onCompleted = _a.onCompleted, onChange = _a.onChange, request = _a.request, remoteSearch = _a.remoteSearch, remoteSearchKey = _a.remoteSearchKey, transformData = _a.transformData, joinKey = _a.joinKey, _e = _a.joinStr, joinStr = _e === void 0 ? '-' : _e, restProps = __rest(_a, ["list", "defaultList", "params", "url", "method", "dataKey", "componentKey", "titleKey", "showAll", "isCatch", "onCompleted", "onChange", "request", "remoteSearch", "remoteSearchKey", "transformData", "joinKey", "joinStr"]);
+    var list = _a.list, defaultList = _a.defaultList, params = _a.params, url = _a.url, _b = _a.method, method = _b === void 0 ? 'GET' : _b, _c = _a.dataKey, dataKey = _c === void 0 ? 'id' : _c, componentKey = _a.componentKey, _d = _a.titleKey, titleKey = _d === void 0 ? 'name' : _d, showAll = _a.showAll, isCatch = _a.isCatch, onCompleted = _a.onCompleted, onChange = _a.onChange, request = _a.request, remoteSearch = _a.remoteSearch, remoteSearchKey = _a.remoteSearchKey, remoteSearchDataKey = _a.remoteSearchDataKey, transformData = _a.transformData, joinKey = _a.joinKey, _e = _a.joinStr, joinStr = _e === void 0 ? '-' : _e, restProps = __rest(_a, ["list", "defaultList", "params", "url", "method", "dataKey", "componentKey", "titleKey", "showAll", "isCatch", "onCompleted", "onChange", "request", "remoteSearch", "remoteSearchKey", "remoteSearchDataKey", "transformData", "joinKey", "joinStr"]);
     // 下拉数据源
     var _f = useFetchState([]), selectList = _f[0], setSelectList = _f[1];
-    var _g = useFetchState(false), loading = _g[0], setLoading = _g[1];
+    // 多选时，自己需要合并的数据
+    var _g = useFetchState([]), multipleList = _g[0], setMultipleList = _g[1];
+    var _h = useFetchState(false), loading = _h[0], setLoading = _h[1];
     var fetchId = useRef(0); // 请求Id，每次请求都会加1
+    var _j = useFetchState(false), firstLoading = _j[0], setFirstLoading = _j[1];
     // 如果selectList 发生改变，那么触发onCompleted事件
     useEffect(function () {
         if (Array.isArray(selectList) && onCompleted) {
@@ -116,9 +119,9 @@ function EnhanceSelect(_a) {
         });
     }, [setSelectList, setLoading, transformData]);
     // 远程搜索
-    var getRemoteDataHandle = useCallback(function (value) {
-        var _a;
+    var getRemoteDataHandle = useCallback(function (value, dataKeyValue) {
         var searchKey = remoteSearchKey ? remoteSearchKey : titleKey;
+        var searchDataKey = remoteSearchDataKey ? remoteSearchDataKey : dataKey;
         var outParams = params;
         try {
             outParams = JSON.parse(params);
@@ -128,10 +131,17 @@ function EnhanceSelect(_a) {
         // 利用闭包，存到当前请求的id
         fetchId.current++;
         var fetchIdClosure = fetchId.current;
+        var searchParams = {};
+        if (value) {
+            searchParams[searchKey] = value;
+        }
+        if (dataKeyValue) {
+            searchParams[searchDataKey] = dataKeyValue + '';
+        }
         getData(request, {
             url: url,
             method: method,
-            params: __assign(__assign({ size: 50, page: 1 }, outParams), (_a = {}, _a[searchKey] = value, _a)),
+            params: __assign(__assign({ size: 50, page: 1 }, outParams), searchParams),
         })
             .then(function (resData) {
             var _a, _b, _c;
@@ -164,7 +174,9 @@ function EnhanceSelect(_a) {
         method,
         request,
         remoteSearchKey,
+        remoteSearchDataKey,
         titleKey,
+        dataKey,
         setSelectList,
         transformData,
         setLoading,
@@ -172,7 +184,7 @@ function EnhanceSelect(_a) {
     var searchHandle = function (value) {
         // 当value有值时才进行搜索
         if (value) {
-            getRemoteDataHandle(value);
+            getRemoteDataHandle(value, '');
         }
     };
     var onSearchHandle = debounce(searchHandle, 300);
@@ -230,8 +242,25 @@ function EnhanceSelect(_a) {
             return;
         }
         // console.log('TEST: 远程搜索');
-        getRemoteDataHandle('');
-    }, [url, remoteSearch, getRemoteDataHandle]);
+        if (!firstLoading) {
+            if (!restProps.value) {
+                getRemoteDataHandle('', '');
+            }
+            else {
+                if (typeof restProps.value === 'string') {
+                    setFirstLoading(true);
+                    getRemoteDataHandle('', restProps.value);
+                }
+            }
+        }
+    }, [
+        url,
+        remoteSearch,
+        getRemoteDataHandle,
+        restProps.value,
+        firstLoading,
+        setFirstLoading,
+    ]);
     // 数据合并
     function concatData(originalData, newData) {
         if (!newData) {
@@ -243,7 +272,7 @@ function EnhanceSelect(_a) {
                 // 如果源数组中找到了该条数据，那么不添加
                 // 否则添加
                 if (!resultData.find(function (resultItem) { return resultItem[dataKey] === item[dataKey]; })) {
-                    resultData.unshift(item);
+                    resultData.push(item);
                 }
             });
         }
@@ -255,7 +284,7 @@ function EnhanceSelect(_a) {
         return (React.createElement(React.Fragment, null,
             showAll && (React.createElement(Select.Option, { title: "\u5168\u90E8", value: "" }, "\u5168\u90E8")),
             Array.isArray(selectList) &&
-                concatData(selectList, _defaultList).map(function (item) {
+                concatData(concatData(selectList, _defaultList), multipleList).map(function (item) {
                     var key = componentKey ? item[componentKey] : item[dataKey];
                     var value = item[dataKey];
                     var title = item[titleKey];
@@ -283,17 +312,20 @@ function EnhanceSelect(_a) {
     };
     // onChange 方法
     var onChangeHandle = function (value, option) {
-        if (selectList && Array.isArray(selectList)) {
+        var _defaultList = Array.isArray(defaultList) ? defaultList : [];
+        var currentList = concatData(concatData(selectList || [], _defaultList), multipleList || []);
+        if (currentList && Array.isArray(currentList)) {
             var key_1 = dataKey;
             // 支持多选模式
             var currentData = void 0;
             if (Array.isArray(value)) {
                 currentData = value.map(function (valueItem) {
-                    return selectList.find(function (item) { return item[key_1] === valueItem; });
+                    return currentList.find(function (item) { return item[key_1] === valueItem; });
                 });
+                setMultipleList(currentData);
             }
             else {
-                currentData = selectList.find(function (item) { return item[key_1] === value; });
+                currentData = currentList.find(function (item) { return item[key_1] === value; });
             }
             onChange && onChange(value, option, currentData);
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ztxkui",
-  "version": "1.9.8",
+  "version": "2.0.2",
   "private": false,
   "description": "React components library",
   "author": "zt-front-end",