@cloudbase/weda-ui 3.4.11 → 3.4.12

package/dist/web/components/form/selectMultiple/dropdown-select/index.css

@@ -0,0 +1,270 @@
+.weda-ui-custom-search {
+  display: flex;
+  align-items: center;
+  height: 40px;
+  margin: 8px 16px;
+}
+
+.weda-ui-custom-search-box {
+  display: flex;
+  align-items: center;
+  flex: 1 1 0px;
+  background-color: #f1f2f5;
+  border-radius: 4px;
+  height: 100%;
+  position: relative;
+  transition: all 0.5s linear;
+}
+
+.weda-ui-custom-search .weda-ui-input {
+  display: block;
+  width: 100%;
+  height: 100%;
+  border: 0;
+  font-size: 16px;
+  line-height: 24px;
+  background-color: inherit;
+  padding: 0 40px 0 40px;
+  caret-color: #0052d9;
+  color: rgba(0, 0, 0, 0.9);
+  border-radius: 4px;
+}
+
+.weda-ui-custom-search-box__label.multiple {
+  position: absolute;
+  top: 0;
+  left: 10%;
+  transform: translateX(-50%);
+  height: 100%;
+  display: flex;
+  align-items: center;
+  color: rgba(0, 0, 0, 0.4);
+}
+
+.weda-ui-custom-search-box__search-icon {
+  width: 24px;
+  height: 24px;
+  margin-right: 4px;
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNSAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE0Ljc2NTUgMTUuMzI3OUMxMy41Mzc4IDE2LjMyMjEgMTEuOTc0MSAxNi45MTc2IDEwLjI3MTQgMTYuOTE3NkM2LjMyNDUzIDE2LjkxNzYgMy4xMjUgMTMuNzE4MSAzLjEyNSA5Ljc3MTMyQzMuMTI1IDUuODI0NTEgNi4zMjQ1MyAyLjYyNSAxMC4yNzE0IDIuNjI1QzE0LjIxODIgMi42MjUgMTcuNDE3NyA1LjgyNDUxIDE3LjQxNzcgOS43NzEzMkMxNy40MTc3IDExLjQ3NDEgMTYuODIyMSAxMy4wMzc4IDE1LjgyOCAxNC4yNjU1TDIxLjEyNSAxOS41NjI1TDIwLjA2MjYgMjAuNjI1TDE0Ljc2NTUgMTUuMzI3OVpNMTUuOTE1MiA5Ljc3MTMyQzE1LjkxNTIgNi42NTQzNCAxMy4zODg0IDQuMTI3NTIgMTAuMjcxNCA0LjEyNzUyQzcuMTU0MzUgNC4xMjc1MiA0LjYyNzUyIDYuNjU0MzQgNC42Mjc1MiA5Ljc3MTMyQzQuNjI3NTIgMTIuODg4MyA3LjE1NDM1IDE1LjQxNTEgMTAuMjcxNCAxNS40MTUxQzEzLjM4ODQgMTUuNDE1MSAxNS45MTUyIDEyLjg4ODMgMTUuOTE1MiA5Ljc3MTMyWiIgZmlsbD0iYmxhY2siIGZpbGwtb3BhY2l0eT0iMC40Ii8+Cjwvc3ZnPgo=);
+  background-repeat: no-repeat;
+}
+
+.weda-ui-custom-search-box__dismiss-icon {
+  position: absolute;
+  right: 12px;
+  width: 24px;
+  height: 24px;
+  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4IiBmaWxsPSJub25lIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNy43NSA5QzE3Ljc1IDQuMTY3NTEgMTMuODMyNSAwLjI1MDAwMSA5IDAuMjVDNC4xNjc1MSAwLjI0OTk5NyAwLjI1MDAwMSA0LjE2NzUxIDAuMjUgOUMwLjI0OTk5NyAxMy44MzI1IDQuMTY3NTEgMTcuNzUgOSAxNy43NUMxMy44MzI1IDE3Ljc1IDE3Ljc1IDEzLjgzMjUgMTcuNzUgOVpNNi4wODg2MyA1LjE4NDQyTDkuMDAwMDIgOC4xMTM0NEwxMS45MTE0IDUuMTg0NDJMMTIuNzk3OSA2LjA2NTYzTDkuODgxMjQgOUwxMi43OTc5IDExLjkzNDRMMTEuOTExNCAxMi44MTU2TDkuMDAwMDEgOS44ODY1N0w2LjA4ODY0IDEyLjgxNTZMNS4yMDIxIDExLjkzNDRMOC4xMTg3OSA5TDUuMjAyMDggNi4wNjU2M0w2LjA4ODYzIDUuMTg0NDJaIiBmaWxsPSJibGFjayIgZmlsbC1vcGFjaXR5PSIwLjkiLz4KPC9zdmc+)
+    no-repeat center;
+}
+
+.weda-ui-custom-search__btn-cancle {
+  flex: 0 0 auto;
+  display: none;
+  margin-left: 16px;
+  color: #0052d9;
+  background-color: transparent;
+  border: none;
+}
+
+/* 获取焦点后 */
+.weda-ui-custom-search.is-focused .weda-ui-custom-search__btn-cancle {
+  display: inline-flex;
+}
+
+.weda-ui-custom-search.is-focused .weda-ui-custom-search-box__label {
+  left: 12px;
+  transform: translateX(0);
+}
+
+.weda-ui-custom-search.is-focused
+  .weda-ui-custom-search-box__search-placeholder {
+  display: none;
+}
+
+.weda-ui-custom-picker__cloumn-item.is-current {
+  color: rgba(0, 0, 0, 0.9);
+}
+
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple
+  .weda-ui-custom-picker__cloumn-item {
+  height: 56px;
+  justify-content: flex-start;
+  color: rgba(0, 0, 0, 0.9);
+  position: relative;
+}
+
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple
+  .weda-ui-custom-picker__cloumn-item::before {
+  content: '';
+  position: absolute;
+  bottom: 0;
+  background-color: #e7e7e7;
+  width: 100%;
+  height: 1px;
+  transform: scaleY(0.5);
+}
+
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple
+  .weda-ui-custom-picker__cloumn-item.is-selected {
+  color: rgba(0, 0, 0, 0.9);
+}
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple
+  .weda-ui-custom-picker__cloumn-item::after {
+  content: '';
+  width: 20px;
+  height: 20px;
+  border: 1px solid #dcdcdc;
+  border-radius: 3px;
+  display: block;
+  position: absolute;
+  left: 0px;
+}
+
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple
+  .weda-ui-custom-picker__cloumn-item.is-selected::after {
+  content: '';
+  width: 21px;
+  height: 21px;
+  border: none;
+  border-radius: 3px;
+  display: block;
+  position: absolute;
+  left: 0px;
+  background-color: #0052d9;
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxNCAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNDAxNDYgNy45NDI3QzMuNDAxNCA3Ljk0MjY0IDMuNDAxNTMgNy45NDI3NiAzLjQwMTQ2IDcuOTQyN0wwLjc1IDUuMjkxMjNMMi41NDM0OSAzLjU0OTE5TDUuMTcyMSA2LjE3NzhMMTEuMzY4NyAwTDEzLjEyNDQgMS43NTU3TDYuOTI3OCA3LjkzMzVMNi45MzcxOCA3Ljk0Mjg5TDYuOTExMDkgNy45NjgyM0M2Ljg1NyA4LjAyMDc3IDYuODAxMTQgOC4wNzAzNyA2Ljc0MzcxIDguMTE3MDRMNi4wNDEyMyA4LjgxNzM4QzUuNTUyODYgOS4zMDQyNyA0Ljc2MjQ0IDkuMzAzNjcgNC4yNzQ4MSA4LjgxNjA0TDMuNDAxNDYgNy45NDI3WiIgZmlsbD0id2hpdGUiIGZpbGwtb3BhY2l0eT0iMC45Ii8+Cjwvc3ZnPg==);
+  background-repeat: no-repeat;
+  background-position: center;
+}
+
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple
+  .weda-ui-custom-picker__cloumn-item.is-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+/* 下拉选择类型 */
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple {
+  padding: 0 0 0 16px;
+  height: 280px;
+}
+
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple::before,
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple::after {
+  display: none;
+}
+
+.weda-ui-custom-picker__cloumns--select-multiple
+  .weda-ui-custom-picker__cloumn {
+  height: 250px;
+}
+
+.form-select-multiple-pc {
+  position: relative;
+}
+
+.form-select-multiple-pc .pc-clear {
+  position: absolute;
+  right: 22px;
+  top: 25%;
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZmlsbD0iIzg4OCIgZD0iTTggMWE3IDcgMCAxIDAgMCAxNEE3IDcgMCAwIDAgOCAxem0zLjUzNiA5LjEyMWwtMS40MTQgMS40MTRMOCA5LjQxNGwtMi4xMjEgMi4xMjEtMS40MTQtMS40MTRMNi41ODYgOCA0LjQ2NCA1Ljg3OWwxLjQxNC0xLjQxNEw4IDYuNTg2bDIuMTIxLTIuMTIxIDEuNDE0IDEuNDE0TDkuNDE0IDhsMi4xMjIgMi4xMjF6Ii8+PC9zdmc+) !important;
+  background-repeat: no-repeat;
+}
+
+.wedatea2td-search--simple .wedatea2td-input--search {
+  caret-color: #000000;
+}
+
+.weda-ui-custom-picker__cloumn-item-text-multiple {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin-left: 30px;
+}
+
+.weda-ui input.weui-input .multiple {
+  color: transparent;
+}
+.weui-tag {
+  height: 56px;
+  position: relative;
+  line-height: 56px;
+  width: 100%;
+}
+.weui-tag span {
+  position: relative;
+  background-color: #eee;
+  color: rgba(0, 0, 0, 0.9);
+  margin: 0px 4px 0 0;
+  padding: 5px 10px 5px 10px;
+  height: auto;
+  line-height: 18px;
+  vertical-align: middle;
+  border: 1px solid #eee;
+  border-radius: 3px;
+}
+.weui-tag span {
+  display: inline-block;
+  white-space: nowrap;
+  word-wrap: break-word;
+  word-break: break-word;
+}
+
+.weda-ui-show-label {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.weda-ui-custom-picker__header {
+  justify-content: space-between;
+}
+
+.wedatea2td-list.wedatea2td-list--option.wedatea2td-list--checkoption
+  .wedatea2td-list__status
+  .wedatea2td-action-state
+  .wedatea2td-action-state__text {
+  display: none;
+}
+
+.wedatea2td-list.wedatea2td-list--option.wedatea2td-list--checkoption
+  .wedatea2td-list__status
+  .weda-ui-custom-picker__status--empty {
+  margin: 0 0 10px 10px;
+}
+
+.select-picker .weui-input-clear {
+  margin: auto 0;
+  width: 24px;
+  height: 24px;
+  background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4IiBmaWxsPSJub25lIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNy43NSA5QzE3Ljc1IDQuMTY3NTEgMTMuODMyNSAwLjI1MDAwMSA5IDAuMjVDNC4xNjc1MSAwLjI0OTk5NyAwLjI1MDAwMSA0LjE2NzUxIDAuMjUgOUMwLjI0OTk5NyAxMy44MzI1IDQuMTY3NTEgMTcuNzUgOSAxNy43NUMxMy44MzI1IDE3Ljc1IDE3Ljc1IDEzLjgzMjUgMTcuNzUgOVpNNi4wODg2MyA1LjE4NDQyTDkuMDAwMDIgOC4xMTM0NEwxMS45MTE0IDUuMTg0NDJMMTIuNzk3OSA2LjA2NTYzTDkuODgxMjQgOUwxMi43OTc5IDExLjkzNDRMMTEuOTExNCAxMi44MTU2TDkuMDAwMDEgOS44ODY1N0w2LjA4ODY0IDEyLjgxNTZMNS4yMDIxIDExLjkzNDRMOC4xMTg3OSA5TDUuMjAyMDggNi4wNjU2M0w2LjA4ODYzIDUuMTg0NDJaIiBmaWxsPSJibGFjayIgZmlsbC1vcGFjaXR5PSIwLjkiLz4KPC9zdmc+')
+    no-repeat center;
+}
+
+.is-disabled
+  .wedatea2td-dropdown-link
+  .wedatea2td-dropdown__value
+  .wedatea2td-icon-arrowdown,
+.is-disabled .wedatea2td-dropdown__header .wedatea2td-icon-arrowdown {
+  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTZweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8dGl0bGU+Y2hldnJvbi1kb3duPC90aXRsZT4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJJY29ucyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIyNC4wMDAwMDAsIC05NTEuMDAwMDAwKSI+CiAgICAgICAgICAgIDxnIGlkPSJjaGV2cm9uLWRvd24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIyNC4wMDAwMDAsIDk1MS4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0xNiwwIEwxNiwxNiBMMCwxNiBMMCwwIEwxNiwwIFoiIGlkPSLnn6nlvaIiIG9wYWNpdHk9IjAuNjAwMDAwMDI0Ij48L3BhdGg+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNNC40NTk2MTM1Niw1LjU0MDQwNTI3IEw3Ljk5OTk5NDI4LDkuMDgwNzg1NzUgTDExLjU0MDM3NDgsNS41NDA0MDUyNyBMMTIuNDU5NjEzOCw2LjQ1OTY0NDA4IEw3Ljk5OTk5NDI4LDEwLjkxOTI2MzQgTDMuNTQwMzc0NzYsNi40NTk2NDQwOCBMNC40NTk2MTM1Niw1LjU0MDQwNTI3IFoiIGlkPSLot6/lvoQtNC0oU3Ryb2tlKSIgZmlsbD0iIzAwMDAwMCI+PC9wYXRoPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
+}
+
+.weda-ui-custom-picker__header-confirm {
+  flex: 0 0 auto;
+  padding: 0 20px;
+  font-size: 16px;
+  color: #0052d9;
+  cursor: pointer;
+}
+
+.form-select-multiple-pc .wedatea2td-tag {
+  margin: 2px 4px 0 0;
+}
+
+.weda-ui-tag-close-icon {
+  margin: 5px 0;
+  width: 8px;
+  height: 8px;
+  margin-left: 6px;
+  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4IiBoZWlnaHQ9IjgiIHZpZXdCb3g9IjAgMCA4IDgiIGZpbGw9Im5vbmUiPgo8cGF0aCBkPSJNNC4wMDAwMSA0LjgwNTMxTDYuNjk0NjkgNy40OTk5OEw3LjUgNi42OTQ2N0w0LjgwNTMyIDRMNy41IDEuMzA1MzNMNi42OTQ2OSAwLjUwMDAyM0w0LjAwMDAxIDMuMTk0NjlMMS4zMDUzMSAwLjVMMC41IDEuMzA1MzFMMy4xOTQ3IDRMMC41IDYuNjk0NjlMMS4zMDUzMSA3LjVMNC4wMDAwMSA0LjgwNTMxWiIgZmlsbD0iYmxhY2siIGZpbGwtb3BhY2l0eT0iMC45Ii8+Cjwvc3ZnPg==)
+    no-repeat center;
+}

package/dist/web/components/form/selectMultiple/dropdown-select/index.js

@@ -0,0 +1,206 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { SelectPickerH5 } from './h5';
+import { formatNeedDataFetch, PAGE_SIZE, requestFatherRelatedOption, RequestOptionType, transFormatTeaSelectKey, } from '../request';
+import SelectPickerPc from './pc';
+import { usePlatform } from '../../../../utils/platform';
+import { Status } from '../status';
+import { useDeepCompareEffect } from '@react-hookz/web';
+export function PureSelect({ params, selectedValue, updateValue, placeholder, size, disabled, isShow, closeModal, allOption, }) {
+    const isRequestingRef = useRef(false);
+    const [status, setStatus] = useState(Status.ALl_EMPTY);
+    const [options, setOptions] = useState([]);
+    const [page, setPage] = useState(1);
+    const [searchOptions, setSearchOptions] = useState([]);
+    const [searchPage, setSearchPage] = useState(1);
+    const [searchValue, setSearchValue] = useState('');
+    const [searchStatus, setSearchStatus] = useState(Status.FINISH);
+    const [format, setFormat] = useState('');
+    const [isTurnPages, setIsTurnPages] = useState(false);
+    const platform = usePlatform();
+    const isSearch = useMemo(() => searchValue !== '', [searchValue]);
+    useDeepCompareEffect(() => {
+        const { format, controlledValue } = params || {
+            format: '',
+            controlledValue: [],
+        };
+        const isTurnPages = format === 'one-many' || format === 'many-many';
+        setFormat(format);
+        setIsTurnPages(isTurnPages);
+        // 手动配置
+        if (!formatNeedDataFetch.includes(format)) {
+            if (controlledValue.length === 0) {
+                setStatus(Status.ALl_EMPTY);
+            }
+            else {
+                setStatus(Status.FINISH);
+            }
+            setOptions(controlledValue);
+            return;
+        }
+        // 接口请求
+        if (isTurnPages) {
+            setStatus(Status.LOADING);
+            requestFatherRelatedOption(params, 1, RequestOptionType.ALL)
+                .then((value) => {
+                setOptions(value.option);
+                if (value.option.length === 0) {
+                    setStatus(platform === 'pc' ? Status.EMPTY : Status.ALl_EMPTY);
+                }
+                else {
+                    setStatus(value.isLoadMore ? Status.LOADING : Status.FINISH);
+                }
+            })
+                .catch(() => {
+                setStatus(Status.ERROR);
+            })
+                .finally(() => (isRequestingRef.current = false));
+        }
+    }, [params]);
+    useEffect(() => {
+        if (page > 1) {
+            requestFatherRelated(page);
+        }
+    }, [page]);
+    useEffect(() => {
+        if (searchPage > 1) {
+            requestFatherRelated(searchPage, searchValue);
+        }
+    }, [searchPage]);
+    const requestFatherRelated = (pageNo, searchValue) => {
+        requestFatherRelatedOption(params, pageNo, RequestOptionType.SEARCH, searchValue)
+            .then((value) => {
+            if (isSearch) {
+                setSearchOptions((opt) => opt.concat(value.option));
+                if (pageNo === 1 && value.option.length === 0) {
+                    setSearchStatus(Status.EMPTY);
+                }
+                else {
+                    setSearchStatus(value.isLoadMore ? Status.LOADING : Status.FINISH);
+                }
+            }
+            else {
+                setOptions((opt) => opt.concat(value.option));
+                if (pageNo === 1 && value.option.length === 0) {
+                    setStatus(Status.EMPTY);
+                }
+                else {
+                    setStatus(value.isLoadMore ? Status.LOADING : Status.FINISH);
+                }
+            }
+        })
+            .catch(() => isSearch ? setSearchStatus(Status.ERROR) : setStatus(Status.ERROR))
+            .finally(() => (isRequestingRef.current = false));
+    };
+    const currentStatus = useMemo(() => {
+        return isSearch ? searchStatus : status;
+    }, [isSearch, searchStatus, status]);
+    const currentOption = useMemo(() => {
+        const option = isSearch ? searchOptions : options;
+        return platform === 'h5' ? option : transFormatTeaSelectKey(option);
+    }, [isSearch, searchOptions, options, platform]);
+    const allOptions = useMemo(() => {
+        return transFormatTeaSelectKey(options);
+    }, [options]);
+    useEffect(() => {
+        allOption(options);
+    }, [options]);
+    useEffect(() => {
+        // 本地搜索
+        if (!isTurnPages || options.length < PAGE_SIZE) {
+            const searchOpt = options.filter((item) => {
+                if (item.label) {
+                    return item.label.toString().includes(searchValue);
+                }
+                return false;
+            });
+            if (searchOpt.length > 0) {
+                setSearchOptions(searchOpt);
+                setSearchStatus(Status.FINISH);
+            }
+            else {
+                setSearchOptions([]);
+                setSearchStatus(Status.EMPTY);
+            }
+            return;
+        }
+        // 远程搜索
+        if (searchValue.trim().length > 0) {
+            // eslint-disable-next-line rulesdir/no-timer
+            const timer = setTimeout(() => {
+                requestFatherRelated(1, searchValue);
+            }, 1000);
+            return () => clearTimeout(timer);
+        }
+    }, [searchValue]);
+    // 加载更多
+    const loadMore = () => {
+        if (!isRequestingRef.current &&
+            isTurnPages &&
+            currentStatus !== Status.FINISH) {
+            if (isSearch) {
+                if (searchOptions.length >= PAGE_SIZE) {
+                    isRequestingRef.current = true;
+                    setSearchPage((page) => page + 1);
+                }
+            }
+            else {
+                if (options.length >= PAGE_SIZE) {
+                    isRequestingRef.current = true;
+                    setPage((page) => page + 1);
+                }
+            }
+        }
+    };
+    // 重试
+    const reTry = () => {
+        if (!isRequestingRef.current) {
+            isRequestingRef.current = true;
+            if (isSearch) {
+                setSearchStatus(Status.LOADING);
+                requestFatherRelated(searchPage, searchValue);
+            }
+            else {
+                setStatus(Status.LOADING);
+                requestFatherRelated(page);
+            }
+        }
+    };
+    const onSearchValue = (value) => {
+        setSearchPage(1);
+        setSearchStatus(Status.LOADING);
+        setSearchOptions([]);
+        setSearchValue(value);
+    };
+    /**
+     * 精确查找
+     */
+    // const findData = async () => {
+    //   if (params?.dataSourceName === undefined || params?.viewId === undefined) {
+    //     return undefined;
+    //   }
+    //   return requestFatherRelatedOption(
+    //     params,
+    //     1,
+    //     RequestOptionType.EQUAL,
+    //     selectedValue
+    //   ).then((value) => {
+    //     if (value && value.option.length > 0) {
+    //       if (
+    //         platform === 'pc' &&
+    //         options.length > 0 &&
+    //         options[0].value != selectedValue
+    //       ) {
+    //         setOptions((opt) => value.option.concat(opt));
+    //       }
+    //       return options[0].value;
+    //     } else {
+    //       return undefined;
+    //     }
+    //   });
+    // };
+    const getIsShow = () => {
+        closeModal();
+    };
+    return platform === 'h5' ? (_jsx(SelectPickerH5, { updateValue: updateValue, options: currentOption, loadMore: loadMore, reTry: reTry, isTurnPages: isTurnPages, status: currentStatus, onSearchValue: onSearchValue, isShow: isShow, selectedValue: selectedValue, getIsShow: getIsShow })) : (_jsx(SelectPickerPc, { placeholder: placeholder, size: size, selectedValue: selectedValue, disabled: disabled, updateValue: updateValue, reTry: reTry, loadMore: loadMore, format: format, status: currentStatus, options: currentOption, allOptions: allOptions, onSearchValue: onSearchValue, defaultSearchValue: '' }));
+}

package/dist/web/components/form/selectMultiple/dropdown-select/pc.js

@@ -0,0 +1,115 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useMemo, useState, useRef } from 'react';
+import { useDeepCompareEffect } from '@react-hookz/web';
+import { SelectMultiple, ConfigProvider } from 'tea-component';
+import Loading from '../status/loading';
+import Retry from '../status/retry';
+import { Status } from '../status';
+import Empty from '../status/empty';
+import './index.css';
+export default function SelectPickerPc({ format, selectedValue, updateValue, placeholder, size, disabled, reTry, loadMore, status, options, allOptions, onSearchValue, defaultSearchValue, }) {
+    const [optList, setOptList] = useState(options);
+    const findDataRef = useRef(undefined);
+    useEffect(() => {
+        if (findDataRef.current && findDataRef.current.value) {
+            const opt = options.filter((item, index) => {
+                if (index === 0) {
+                    // 有回显的数据，回显数据通过findData插入在第一个，所以第一个不能过滤掉
+                    return true;
+                }
+                else {
+                    // 如果是第一个后面的数据，发现和选中项的 value 一样，则忽略，因为index === 0已经加进去了
+                    return item.value !== findDataRef.current.value;
+                }
+            });
+            setOptList(opt);
+        }
+        else {
+            setOptList(options);
+        }
+    }, [options]);
+    useDeepCompareEffect(() => {
+        if (status === Status.ALl_EMPTY) {
+            return;
+        }
+        // // 没有数据
+        // if (optList?.length === 0) {
+        //   updateValue && updateValue(undefined);
+        //   return;
+        // }
+        //有数据
+        if (selectedValue) {
+            updateValue(selectedValue);
+        }
+        else {
+            // 用户自动输入 '' ， undefined , null三种状态清空
+            updateValue && updateValue(selectedValue);
+        }
+    }, [optList, selectedValue, status]);
+    const isShowBottomTips = useMemo(() => {
+        if (status === Status.LOADING) {
+            return _jsx(Loading, {});
+        }
+        else if (status === Status.ERROR) {
+            return _jsx(Retry, { reTry: reTry });
+        }
+        else if (status === Status.EMPTY) {
+            return _jsx(Empty, {});
+        }
+        else {
+            return '';
+        }
+    }, [format, status, optList]);
+    return (_jsx(ConfigProvider, { classPrefix: "wedatea2td", children: _jsx("div", { className: 'form-select-multiple-pc', "data-testid": "form-item-select-multiple-pc", children: _jsx(SelectMultiple, { searchable: true, staging: false, autoClearSearchValue: true, clearable: true, matchButtonWidth: true, defaultSearchValue: defaultSearchValue, value: selectedValue, placeholder: placeholder, appearance: 'button', bottomTips: isShowBottomTips, size: size, disabled: disabled, options: optList, onChange: updateValue, onScrollBottom: loadMore, button: (selectedValue) => {
+                    let str = '';
+                    selectedValue.forEach((item) => {
+                        const obj = allOptions.find((el) => el.value === item.value);
+                        (obj === null || obj === void 0 ? void 0 : obj.text) ? (str = `${str},${obj.text}`) : null;
+                    });
+                    return selectedValue.length ? (_jsx("div", { className: 'weda-ui-show-label', children: str.substring(1, str.length) })) : (
+                    // <div>
+                    //   <Tag.Group>
+                    //     {selectedValue.length > 0 &&
+                    //       [selectedValue[0]].map((o) => {
+                    //         const obj = allOptions.find(
+                    //           (item) => item.value === o.value
+                    //         );
+                    //         return (
+                    //           <Tag key="0">
+                    //             <span>
+                    //               {obj?.text}
+                    //               {/* <span className="weda-ui-tag-close-icon"></span> */}
+                    //             </span>
+                    //           </Tag>
+                    //         );
+                    //       })}
+                    //     {selectedValue.length > 1 && (
+                    //       <Tag key="1">+{selectedValue.length - 1}</Tag>
+                    //     )}
+                    //   </Tag.Group>
+                    // </div>
+                    _jsx("div", { style: { color: 'rgba(0,0,0,.26)' }, children: placeholder }));
+                }, onOpen: () => {
+                    onSearchValue('');
+                }, onSearch: (value, context) => {
+                    const tValue = value.trim();
+                    if (context.event.type === 'click') {
+                        if (tValue !== '') {
+                            // 手动点击搜索
+                            onSearchValue(tValue);
+                        }
+                        else {
+                            // 清空
+                            onSearchValue('');
+                        }
+                    }
+                    else if (tValue !== '') {
+                        // 动态输入搜索
+                        onSearchValue(tValue);
+                    }
+                    else {
+                        // 逐个删除
+                        onSearchValue('');
+                    }
+                } }) }) }));
+}