@bit-sun/business-component 4.2.1-alpha.5-aiwei → 4.2.1-alpha.6-aiwei

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.esm.js +5 -46
  2. package/dist/index.js +1 -1
  3. package/package.json +1 -1
  4. package/src/components/Functional/SearchSelect/index.tsx +6 -37
package/dist/index.esm.js CHANGED
@@ -5514,12 +5514,6 @@ var SearchSelect = /*#__PURE__*/forwardRef(function (props, ref) {
5514
5514
  _useState44 = _slicedToArray(_useState43, 2),
5515
5515
  modalSearched = _useState44[0],
5516
5516
  setModalSearched = _useState44[1];
5517
- var _useState45 = useState(undefined),
5518
- _useState46 = _slicedToArray(_useState45, 2),
5519
- overScrollY = _useState46[0],
5520
- setOverScrollY = _useState46[1];
5521
- var topFormRef = useRef(null);
5522
- var bottomWrapRef = useRef(null);
5523
5517
  var setSelectDataSource = function setSelectDataSource(list, total) {
5524
5518
  setItems(list);
5525
5519
  setItemsTotal(total);
@@ -5755,9 +5749,6 @@ var SearchSelect = /*#__PURE__*/forwardRef(function (props, ref) {
5755
5749
  setSearchValue('');
5756
5750
  setModalSearched(false);
5757
5751
  setIsModalVisible(true);
5758
- setTimeout(function () {
5759
- return computeScrollY();
5760
- }, 0);
5761
5752
  // 回显
5762
5753
  if (value) {
5763
5754
  if (selectMode) {
@@ -5874,7 +5865,6 @@ var SearchSelect = /*#__PURE__*/forwardRef(function (props, ref) {
5874
5865
  var handleCancel = function handleCancel() {
5875
5866
  clearModalTable();
5876
5867
  setIsModalVisible(false);
5877
- setOverScrollY(undefined);
5878
5868
  };
5879
5869
  var refreshItems = function refreshItems() {
5880
5870
  // 查看是否存在关联值 如果有关联值 就查询 没有就不能查询
@@ -5912,9 +5902,6 @@ var SearchSelect = /*#__PURE__*/forwardRef(function (props, ref) {
5912
5902
  };
5913
5903
  var toggleCollapsed = function toggleCollapsed() {
5914
5904
  setCollapsed(!collapsed);
5915
- setTimeout(function () {
5916
- return computeScrollY();
5917
- }, 0);
5918
5905
  };
5919
5906
  var handleTableChange = function handleTableChange(pagination) {
5920
5907
  getData(_objectSpread2(_objectSpread2({}, tableFormParams), {}, {
@@ -6194,12 +6181,12 @@ var SearchSelect = /*#__PURE__*/forwardRef(function (props, ref) {
6194
6181
  };
6195
6182
  var renderShowTable = function renderShowTable(tableList, type) {
6196
6183
  var tableBoxHeighth = getTableHeigth(modalTableProps === null || modalTableProps === void 0 ? void 0 : modalTableProps.tableSearchForm);
6197
- var x = (tableList === null || tableList === void 0 ? void 0 : tableList.length) ? 82 : 28;
6198
- var oSY = overScrollY || "calc(100vh - ".concat(tableBoxHeighth, "px - ").concat(x, "px)");
6184
+ var x = (tableList === null || tableList === void 0 ? void 0 : tableList.length) ? 82 : 28; // 无数据没有分页，有数据计算减去：分页 24+16*2+10 「高 + margin * 2 + paddingBottom 10 」
6185
+ var oSY = "calc(100vh - ".concat(tableBoxHeighth, "px - ").concat(x, "px)");
6199
6186
  var mTB = "calc(50vh - ".concat(tableBoxHeighth / 2, "px - ").concat(x / 2, "px - 40px)");
6200
6187
  return /*#__PURE__*/React$1.createElement("div", {
6201
6188
  style: {
6202
- height: 'auto'
6189
+ height: "calc(100vh - ".concat(tableBoxHeighth, "px)")
6203
6190
  }
6204
6191
  }, /*#__PURE__*/React$1.createElement(Table, _objectSpread2(_objectSpread2({
6205
6192
  bordered: true,
@@ -6478,8 +6465,7 @@ var SearchSelect = /*#__PURE__*/forwardRef(function (props, ref) {
6478
6465
  }, (modalTableProps === null || modalTableProps === void 0 ? void 0 : modalTableProps.modalProps) || {}), /*#__PURE__*/React$1.createElement("div", {
6479
6466
  className: 'search_select_wrapper'
6480
6467
  }, /*#__PURE__*/React$1.createElement("div", {
6481
- className: 'search_select_wrapper_topForm',
6482
- ref: topFormRef
6468
+ className: 'search_select_wrapper_topForm'
6483
6469
  }, /*#__PURE__*/React$1.createElement("div", {
6484
6470
  className: 'select_list_columns'
6485
6471
  }, /*#__PURE__*/React$1.createElement(Form, {
@@ -6516,8 +6502,7 @@ var SearchSelect = /*#__PURE__*/forwardRef(function (props, ref) {
6516
6502
  },
6517
6503
  src: zhankaitiaojian
6518
6504
  }) : /*#__PURE__*/React$1.createElement(React$1.Fragment, null)))))))), /*#__PURE__*/React$1.createElement("div", {
6519
- className: 'search_select_wrapper_bottomTable',
6520
- ref: bottomWrapRef
6505
+ className: 'search_select_wrapper_bottomTable'
6521
6506
  }, /*#__PURE__*/React$1.createElement("div", {
6522
6507
  className: selectMode ? 'search_select_wrapper_bottomTable_wrapLeft2' : 'search_select_wrapper_bottomTable_wrapLeft1'
6523
6508
  }, /*#__PURE__*/React$1.createElement(Tabs, {
@@ -6533,32 +6518,6 @@ var SearchSelect = /*#__PURE__*/forwardRef(function (props, ref) {
6533
6518
  }, "\u6E05\u7A7A\u5DF2\u9009")
6534
6519
  })) : null)))));
6535
6520
  });
6536
- var computeScrollY = function computeScrollY() {
6537
- try {
6538
- var _topFormRef$current, _bottomWrapRef$curren;
6539
- var bodyEl = document.querySelector('.search_select_modal_wrapper .ant-modal-body');
6540
- var bodyH = (bodyEl === null || bodyEl === void 0 ? void 0 : bodyEl.clientHeight) || 0;
6541
- var topH = ((_topFormRef$current = topFormRef.current) === null || _topFormRef$current === void 0 ? void 0 : _topFormRef$current.clientHeight) || 0;
6542
- var navEl = (_bottomWrapRef$curren = bottomWrapRef.current) === null || _bottomWrapRef$curren === void 0 ? void 0 : _bottomWrapRef$curren.querySelector('.ant-tabs-nav');
6543
- var navH = (navEl === null || navEl === void 0 ? void 0 : navEl.offsetHeight) || 0;
6544
- var extra = 30; // paddings/margins buffer
6545
- var tableH = Math.max(160, bodyH - topH - navH - extra);
6546
- setOverScrollY(tableH);
6547
- } catch (e) {
6548
- // ignore
6549
- }
6550
- };
6551
- useEffect(function () {
6552
- if (!isModalVisible) return;
6553
- computeScrollY();
6554
- var onResize = function onResize() {
6555
- return computeScrollY();
6556
- };
6557
- window.addEventListener('resize', onResize);
6558
- return function () {
6559
- window.removeEventListener('resize', onResize);
6560
- };
6561
- }, [isModalVisible, collapsed, tableData, tablePagination]);
6562
6521
 
6563
6522
  var css_248z$8 = ".add_select_show {\n display: flex;\n}\n.add_select_expand_button {\n position: relative;\n width: 30px;\n color: #ffffff;\n cursor: pointer;\n}\n.add_select_expand_button span {\n position: absolute;\n height: 20px;\n line-height: 14px;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n}\n.add_select_header {\n border-bottom: 1px solid #D9D9D9;\n height: 24px;\n height: 40px;\n font-family: PingFangSC-Medium;\n font-weight: 500;\n font-size: 18px;\n color: #000000;\n letter-spacing: 0;\n line-height: 40px;\n margin-bottom: 10px;\n padding-left: 10px;\n}\n.add_select_header > span {\n margin-left: 20px;\n font-weight: 400;\n font-size: 12px;\n color: #666666;\n letter-spacing: 0;\n line-height: 40px;\n}\n.add_select_header > span > span {\n color: #ff0000;\n}\n.add_select_header_close span {\n position: absolute;\n color: black !important;\n right: 10px;\n top: 10px;\n}\n.add_select_quick_header {\n font-family: PingFangSC-Medium;\n font-weight: 500;\n font-size: 18px;\n color: #000000;\n letter-spacing: 0;\n}\n.add_select_quick_header_title {\n display: flex;\n justify-content: space-between;\n}\n.add_select_quick_header > span {\n font-weight: 400;\n font-size: 12px;\n color: #666666;\n letter-spacing: 0;\n line-height: 20px;\n}\n.add_select_quick_header > span > span {\n color: #ff0000;\n}\n.add_select_quick_header_close span {\n position: absolute;\n color: black !important;\n right: 10px;\n top: 10px;\n}\n.add_select_wrapper {\n position: relative;\n display: flex;\n max-height: 60vh;\n overflow: hidden;\n font-size: 14px;\n margin: 5px 10px;\n}\n.add_select_wrapper .ant-table-pagination.ant-pagination {\n margin: 5px;\n padding-right: 5px;\n}\n.add_select_wrapper .ant-checkbox-wrapper {\n justify-content: center;\n}\n.add_select_wrapper .ant-form-item-label {\n padding: 0PX;\n line-height: 23px !important;\n}\n.add_select_wrapper .ant-form-item-label > label {\n font-size: 12px;\n}\n.add_select_wrapper .ant-table-thead th {\n height: 20px !important;\n padding: 0px 8px !important;\n font-size: 12px !important;\n font-weight: 600 !important;\n line-height: 20px !important;\n}\n.add_select_wrapper .ant-modal-body {\n padding: 10px;\n}\n.add_select_wrapper .ant-table-wrapper {\n padding: 0px !important;\n}\n.add_select_wrapper .row-class {\n height: 24px;\n}\n.add_select_wrapper .row-class td {\n font-size: 12px !important;\n height: 24px !important;\n padding: 0px 8px !important;\n line-height: 20px !important;\n}\n.add_select_wrapper .ant-table-body {\n height: 240px;\n overflow-y: auto !important;\n}\n.add_select_wrapper .ant-row.ant-form-item {\n margin-bottom: 10px;\n}\n.add_select_wrapper_click_flag {\n position: absolute;\n z-index: 10;\n}\n.add_select_wrapper_click_flag_arrow {\n transform: rotate(0deg);\n transition: transform 0.5s;\n}\n.add_select_wrapper_click_flag_arrow_1 {\n transform: rotate(-180deg);\n transition: transform 0.5s;\n}\n.add_select_wrapper_left {\n flex-basis: 298px;\n width: 298px;\n overflow-y: hidden;\n transition: all 0.3s;\n margin-right: 10px;\n border: 1px solid #D9D9D9;\n border-radius: 5px;\n}\n.add_select_wrapper_left1 {\n width: 0;\n height: 0;\n transition: all 0.3s;\n display: none;\n}\n.add_select_wrapper_right {\n width: 872px;\n border: 1px solid #D9D9D9;\n border-radius: 5px;\n}\n.add_select_wrapper_right1 {\n width: 100%;\n margin-left: 10px;\n}\n.add_select_wrapper_right,\n.add_select_wrapper_right1 {\n overflow-x: auto;\n}\n.add_select_wrapper .select_list_columns {\n height: 272px;\n overflow-y: auto;\n border-bottom: 1px solid #D9D9D9;\n}\n.add_select_wrapper .select_list_columns_tips {\n background: #eee;\n padding: 6px 20px;\n margin-bottom: 10px;\n}\n.add_select_wrapper .select_list_columns_formItems {\n padding: 7px 10px;\n}\n.add_select_wrapper .select_list_searchButton {\n display: flex;\n margin: 10px;\n justify-content: flex-end;\n}\n.add_select_wrapper .select_list_button_space {\n margin-right: 10px;\n}\n.add_select_wrapper .select_list_selectTips {\n display: flex;\n justify-content: space-between;\n height: 24px;\n font-size: 12px;\n line-height: 24px;\n background: #F7F8FB;\n padding: 0 5px;\n border-bottom: 1px solid #D9D9D9;\n}\n.add_select_wrapper .select_list_selectAll {\n position: relative;\n top: -40px;\n left: 20px;\n width: 160px;\n}\n.add_select_wrapper_select {\n margin-top: 4px;\n border: 1px solid #D9D9D9;\n border-radius: 5px;\n margin: 5px 10px;\n}\n.add_select_wrapper_select .ant-table-pagination.ant-pagination {\n margin: 9px;\n padding-right: 5px;\n}\n.add_select_wrapper_select .ant-modal-body {\n padding: 10px;\n}\n.add_select_wrapper_select .ant-table-wrapper {\n padding: 0px !important;\n}\n.add_select_wrapper_select .ant-table-thead th {\n height: 23px !important;\n padding: 0px 8px !important;\n font-size: 12px !important;\n font-weight: 600 !important;\n line-height: 23px !important;\n}\n.add_select_wrapper_select .ant-modal-close-x {\n height: 30px;\n}\n.add_select_wrapper_select .row-class {\n height: 30px;\n}\n.add_select_wrapper_select .row-class td {\n font-size: 12px !important;\n height: 30px !important;\n padding: 4px 8px !important;\n}\n.add_select_wrapper_select .ant-table-body {\n height: 200px;\n overflow-y: auto !important;\n}\n.add_select_wrapper_select .ant-row.ant-form-item {\n margin-bottom: 10px;\n}\n.add_select_wrapper_select .ant-input-number-input,\n.add_select_wrapper_select .ant-input {\n height: auto;\n height: 22px;\n padding: 0px 10px;\n font-size: 12px;\n}\n.add_select_wrapper_select .ant-select-selection-search-input {\n height: auto;\n height: 22px !important;\n padding: 0px 10px;\n font-size: 12px;\n}\n.add_select_wrapper_select .ant-select .ant-select-arrow {\n top: 13px;\n}\n.add_select_wrapper_select .ant-select-selector {\n position: relative;\n top: 1px;\n height: 23px !important;\n line-height: 23px !important;\n}\n.add_select_wrapper_select .ant-select-selector .ant-select-selection-item,\n.add_select_wrapper_select .ant-select-selector ant-select-selection-search {\n height: 23px !important;\n line-height: 23px !important;\n font-size: 12px;\n}\n.add_select_wrapper_select .select_list_selectTips {\n display: flex;\n justify-content: space-between;\n height: 24px;\n font-size: 12px;\n line-height: 24px;\n background: #F7F8FB;\n padding: 0 3px;\n border-bottom: 1px solid #D9D9D9;\n}\n.add_select_wrapper_select_quick {\n margin: 0;\n}\n.react-resizable {\n position: relative;\n background-clip: padding-box;\n}\n.react-resizable-handle {\n position: absolute;\n width: 10px;\n height: 100%;\n bottom: 0;\n right: -5px;\n cursor: col-resize;\n z-index: 1;\n}\n";
6564
6523
  styleInject(css_248z$8);
package/dist/index.js CHANGED
@@ -4825,7 +4825,7 @@ function ToCDB$1(selectStr) {
4825
4825
  return tmp;
4826
4826
  }
4827
4827
 
4828
- var css_248z$6 = ".search_select .ant-select-selector {\n height: 24px;\n overflow: hidden;\n}\n.search_select .ant-select-selector .ant-select-selection-overflow {\n height: 40px;\n flex-wrap: nowrap;\n overflow-x: auto;\n}\n.search_select .ant-select-selector .ant-select-selection-overflow-item {\n align-self: auto;\n}\n.search_select_show {\n display: flex;\n}\n.search_select_show .ant-select-dropdown {\n top: 24px !important;\n width: calc(141%) !important;\n}\n.search_select_show .ant-select-clear {\n right: 33px;\n}\n.search_select_show .ant-select-multiple.ant-select-show-arrow .ant-select-selector,\n.search_select_show .ant-select-multiple.ant-select-allow-clear .ant-select-selector {\n padding-right: 28px;\n}\n.search_select_show.search_select_show_list .ant-select-dropdown {\n top: 24px !important;\n width: calc(100% + 110px) !important;\n}\n.search_select_expand_button {\n position: relative;\n right: -11px;\n width: 30px;\n border-left: 1px solid #d9d9d9;\n height: 24px;\n cursor: pointer;\n font-size: 14px;\n font-weight: bolder;\n}\n.search_select_expand_button span {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n}\n.search_select_expand_button:hover {\n background-color: #005cff;\n color: #fff;\n border-top-right-radius: 2px;\n border-bottom-right-radius: 2px;\n}\n.search_select_expand_button_disabled:hover {\n background-color: transparent;\n color: rgba(0, 0, 0, 0.25);\n cursor: not-allowed;\n}\n.search_select_dropdown_table .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table {\n font-family: MiSans-Regular;\n font-weight: 400;\n font-size: 12px;\n}\n.search_select_dropdown_table .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table thead > tr > th {\n color: #7F7F7F;\n}\n.search_select_dropdown_table .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table .ant-table-thead .ant-table-selection .ant-checkbox-wrapper {\n justify-content: center;\n}\n.search_select_dropdown_table .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table tbody > tr > td {\n color: #333333;\n}\n.search_select_dropdown_table1 .ant-table.ant-table-bordered > .ant-table-container .ant-table-body > table > tbody > tr > td.ant-table-selection-column,\n.search_select_dropdown_table1 .ant-table.ant-table-bordered > .ant-table-container .ant-table-header > table > thead > tr > th.ant-table-selection-column {\n visibility: hidden;\n padding: 0;\n margin: 0;\n width: 0;\n height: 0;\n min-width: 0;\n min-height: 0;\n border: none;\n}\n.search_select_dropdown_table1 .ant-table.ant-table-bordered > .ant-table-container .ant-table-body > table > tbody > tr > td.ant-table-selection-column .ant-radio-wrapper,\n.search_select_dropdown_table1 .ant-table.ant-table-bordered > .ant-table-container .ant-table-header > table > thead > tr > th.ant-table-selection-column .ant-radio-wrapper {\n display: none;\n}\n.search_select_modal_wrapper .ant-modal {\n top: 60px;\n}\n.search_select_modal_wrapper .ant-modal-header {\n padding: 6px 0px 6px 16px;\n}\n.search_select_modal_wrapper .ant-modal-header .ant-modal-title {\n height: 20px;\n color: #000000;\n line-height: 20px;\n}\n.search_select_modal_wrapper .ant-modal-close-x {\n width: 32px;\n height: 32px;\n line-height: 32px;\n}\n.search_select_modal_wrapper .ant-modal-body {\n padding: 0px;\n background: #F3F3F3;\n height: calc(100vh - 235px);\n overflow: auto;\n}\n.search_select_modal_wrapper .ant-modal-footer .ant-btn.ant-btn-default {\n color: #005cff;\n border-color: #005cff;\n}\n.search_select_modal_wrapper .ant-modal-footer .ant-btn-primary,\n.search_select_modal_wrapper .ant-modal-footer .ant-btn-primary[disabled] {\n background: #005cff;\n border-color: #005cff;\n}\n.search_select_modal_wrapper .ant-modal-footer .ant-btn-primary[disabled] {\n opacity: 0.5;\n color: #fff;\n}\n.search_select_wrapper {\n position: relative;\n font-size: 14px;\n}\n.search_select_wrapper_topForm .select_list_columns {\n width: 100%;\n padding: 10px 6px 2px 16px;\n background-color: #fff;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form {\n padding: 0;\n display: flex;\n align-items: flex-start;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item,\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-col .ant-space {\n font-size: 12px !important;\n margin-right: 0px !important;\n margin-bottom: 8px !important;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row.ant-form-item-row {\n background-color: #fafafa;\n border: 0.8px solid #D9D9D9;\n border-radius: 2px;\n font-size: 12px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row {\n width: 100%;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-label {\n width: 110px;\n order: 1;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-label label {\n width: 100%;\n text-align: left;\n padding: 0 10px;\n color: #333333;\n font-size: 12px;\n font-family: PingFangSC-Regular;\n font-weight: 400;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control {\n order: 2;\n width: 100px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control .ant-input-affix-wrapper {\n border: 0;\n font-size: 12px;\n background-color: #fafafa;\n padding: 0 11px;\n height: 24px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control .ant-input-affix-wrapper .ant-input {\n background-color: #fafafa !important;\n border: 0;\n font-size: 12px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control .ant-select-selector {\n border: 0 !important;\n background-color: #fafafa !important;\n font-size: 12px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control .query_input .ant-input {\n background-color: #fafafa !important;\n border: 0;\n font-size: 12px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-btn-primary {\n background: #005cff;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form > .ant-row > .ant-col {\n order: 2;\n padding-right: 10px;\n}\n.search_select_wrapper_topForm .select_list_button_space {\n margin-right: 10px;\n}\n.search_select_wrapper_bottomTable {\n margin: 10px;\n display: flex;\n justify-content: space-between;\n}\n.search_select_wrapper_bottomTable_wrapLeft1,\n.search_select_wrapper_bottomTable_wrapLeft2,\n.search_select_wrapper_bottomTable_wrapRight {\n background: #fff;\n width: calc(50% - 5px);\n}\n.search_select_wrapper_bottomTable_wrapLeft1 .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table .ant-table-thead .ant-table-selection .ant-checkbox-wrapper,\n.search_select_wrapper_bottomTable_wrapLeft2 .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table .ant-table-thead .ant-table-selection .ant-checkbox-wrapper,\n.search_select_wrapper_bottomTable_wrapRight .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table .ant-table-thead .ant-table-selection .ant-checkbox-wrapper {\n justify-content: center;\n}\n.search_select_wrapper_bottomTable_wrapLeft1 {\n width: 100%;\n}\n.search_select_wrapper_bottomTable_wrapRight {\n margin-left: 10px;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav {\n margin: 0;\n padding: 6px 18.5px;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav .ant-tabs-nav-wrap {\n height: 28px;\n font-size: 14px;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav .ant-tabs-tab {\n padding: 4px 0;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav .ant-tabs-ink-bar {\n left: 3px !important;\n width: 40px !important;\n background: #005cff;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav .ant-tabs-extra-content > span {\n color: #005cff;\n cursor: pointer;\n}\n.search_select_wrapper_bottomTable .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {\n color: #005cff;\n}\n.search_select_wrapper_bottomTable .ant-tabs-content-holder {\n padding: 10px 10px 7px;\n}\n.search_select_wrapper_bottomTable .ant-tabs-content-holder .ant-tabs-content .ant-table-wrapper .ant-table .ant-table-container .ant-table-content .ant-table-thead > tr > th {\n color: #7F7F7F;\n}\n.search_select_wrapper_bottomTable .ant-tabs-content-holder .ant-tabs-content .ant-table-wrapper .ant-table .ant-table-container .ant-table-content .ant-table-thead .ant-table-selection .ant-checkbox-wrapper {\n justify-content: center;\n}\n.search_select_wrapper_bottomTable .ant-tabs-content-holder .ant-tabs-content .ant-table-wrapper .ant-table .ant-table-container .ant-table-content .ant-table.ant-table-small .ant-table-tbody > tr > td {\n color: #333333;\n}\n.search_select_wrapper_bottomTable .ant-checkbox-checked .ant-checkbox-inner {\n color: #005cff;\n background: #005cff;\n}\n.search_select_wrapper_bottomTable .ant-pagination-item-active a {\n color: #005cff;\n}\n.search_select_wrapper_bottomTable .ant-pagination-item-active {\n border-color: #005cff;\n}\n.searchSelectSpin > div {\n height: 300px !important;\n}\n.searchSelectMaxTagToolTip .ant-tooltip-inner {\n max-height: 72px;\n overflow-x: auto;\n padding: 0px;\n}\n";
4828
+ var css_248z$6 = ".search_select .ant-select-selector {\n height: 24px;\n overflow: hidden;\n}\n.search_select .ant-select-selector .ant-select-selection-overflow {\n height: 40px;\n flex-wrap: nowrap;\n overflow-x: auto;\n}\n.search_select .ant-select-selector .ant-select-selection-overflow-item {\n align-self: auto;\n}\n.search_select_show {\n display: flex;\n}\n.search_select_show .ant-select-dropdown {\n top: 24px !important;\n width: calc(141%) !important;\n}\n.search_select_show .ant-select-clear {\n right: 33px;\n}\n.search_select_show .ant-select-multiple.ant-select-show-arrow .ant-select-selector,\n.search_select_show .ant-select-multiple.ant-select-allow-clear .ant-select-selector {\n padding-right: 28px;\n}\n.search_select_show.search_select_show_list .ant-select-dropdown {\n top: 24px !important;\n width: calc(100% + 110px) !important;\n}\n.search_select_expand_button {\n position: relative;\n right: -11px;\n width: 30px;\n border-left: 1px solid #d9d9d9;\n height: 24px;\n cursor: pointer;\n font-size: 14px;\n font-weight: bolder;\n}\n.search_select_expand_button span {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n}\n.search_select_expand_button:hover {\n background-color: #005cff;\n color: #fff;\n border-top-right-radius: 2px;\n border-bottom-right-radius: 2px;\n}\n.search_select_expand_button_disabled:hover {\n background-color: transparent;\n color: rgba(0, 0, 0, 0.25);\n cursor: not-allowed;\n}\n.search_select_dropdown_table .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table {\n font-family: MiSans-Regular;\n font-weight: 400;\n font-size: 12px;\n}\n.search_select_dropdown_table .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table thead > tr > th {\n color: #7F7F7F;\n}\n.search_select_dropdown_table .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table .ant-table-thead .ant-table-selection .ant-checkbox-wrapper {\n justify-content: center;\n}\n.search_select_dropdown_table .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table tbody > tr > td {\n color: #333333;\n}\n.search_select_dropdown_table1 .ant-table.ant-table-bordered > .ant-table-container .ant-table-body > table > tbody > tr > td.ant-table-selection-column,\n.search_select_dropdown_table1 .ant-table.ant-table-bordered > .ant-table-container .ant-table-header > table > thead > tr > th.ant-table-selection-column {\n visibility: hidden;\n padding: 0;\n margin: 0;\n width: 0;\n height: 0;\n min-width: 0;\n min-height: 0;\n border: none;\n}\n.search_select_dropdown_table1 .ant-table.ant-table-bordered > .ant-table-container .ant-table-body > table > tbody > tr > td.ant-table-selection-column .ant-radio-wrapper,\n.search_select_dropdown_table1 .ant-table.ant-table-bordered > .ant-table-container .ant-table-header > table > thead > tr > th.ant-table-selection-column .ant-radio-wrapper {\n display: none;\n}\n.search_select_modal_wrapper .ant-modal {\n top: 60px;\n}\n.search_select_modal_wrapper .ant-modal-header {\n padding: 6px 0px 6px 16px;\n}\n.search_select_modal_wrapper .ant-modal-header .ant-modal-title {\n height: 20px;\n color: #000000;\n line-height: 20px;\n}\n.search_select_modal_wrapper .ant-modal-close-x {\n width: 32px;\n height: 32px;\n line-height: 32px;\n}\n.search_select_modal_wrapper .ant-modal-body {\n padding: 0px;\n background: #F3F3F3;\n height: calc(100vh - 235px);\n overflow: hidden;\n}\n.search_select_modal_wrapper .ant-modal-footer .ant-btn.ant-btn-default {\n color: #005cff;\n border-color: #005cff;\n}\n.search_select_modal_wrapper .ant-modal-footer .ant-btn-primary,\n.search_select_modal_wrapper .ant-modal-footer .ant-btn-primary[disabled] {\n background: #005cff;\n border-color: #005cff;\n}\n.search_select_modal_wrapper .ant-modal-footer .ant-btn-primary[disabled] {\n opacity: 0.5;\n color: #fff;\n}\n.search_select_wrapper {\n position: relative;\n font-size: 14px;\n}\n.search_select_wrapper_topForm .select_list_columns {\n width: 100%;\n padding: 10px 6px 2px 16px;\n background-color: #fff;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form {\n padding: 0;\n display: flex;\n align-items: flex-start;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item,\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-col .ant-space {\n font-size: 12px !important;\n margin-right: 0px !important;\n margin-bottom: 8px !important;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row.ant-form-item-row {\n background-color: #fafafa;\n border: 0.8px solid #D9D9D9;\n border-radius: 2px;\n font-size: 12px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row {\n width: 100%;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-label {\n width: 110px;\n order: 1;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-label label {\n width: 100%;\n text-align: left;\n padding: 0 10px;\n color: #333333;\n font-size: 12px;\n font-family: PingFangSC-Regular;\n font-weight: 400;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control {\n order: 2;\n width: 100px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control .ant-input-affix-wrapper {\n border: 0;\n font-size: 12px;\n background-color: #fafafa;\n padding: 0 11px;\n height: 24px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control .ant-input-affix-wrapper .ant-input {\n background-color: #fafafa !important;\n border: 0;\n font-size: 12px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control .ant-select-selector {\n border: 0 !important;\n background-color: #fafafa !important;\n font-size: 12px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-row .ant-form-item-control .query_input .ant-input {\n background-color: #fafafa !important;\n border: 0;\n font-size: 12px;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form .ant-btn-primary {\n background: #005cff;\n}\n.search_select_wrapper_topForm .select_list_columns .ant-form > .ant-row > .ant-col {\n order: 2;\n padding-right: 10px;\n}\n.search_select_wrapper_topForm .select_list_button_space {\n margin-right: 10px;\n}\n.search_select_wrapper_bottomTable {\n margin: 10px;\n display: flex;\n justify-content: space-between;\n}\n.search_select_wrapper_bottomTable_wrapLeft1,\n.search_select_wrapper_bottomTable_wrapLeft2,\n.search_select_wrapper_bottomTable_wrapRight {\n background: #fff;\n width: calc(50% - 5px);\n}\n.search_select_wrapper_bottomTable_wrapLeft1 .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table .ant-table-thead .ant-table-selection .ant-checkbox-wrapper,\n.search_select_wrapper_bottomTable_wrapLeft2 .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table .ant-table-thead .ant-table-selection .ant-checkbox-wrapper,\n.search_select_wrapper_bottomTable_wrapRight .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table .ant-table-thead .ant-table-selection .ant-checkbox-wrapper {\n justify-content: center;\n}\n.search_select_wrapper_bottomTable_wrapLeft1 {\n width: 100%;\n}\n.search_select_wrapper_bottomTable_wrapRight {\n margin-left: 10px;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav {\n margin: 0;\n padding: 6px 18.5px;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav .ant-tabs-nav-wrap {\n height: 28px;\n font-size: 14px;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav .ant-tabs-tab {\n padding: 4px 0;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav .ant-tabs-ink-bar {\n left: 3px !important;\n width: 40px !important;\n background: #005cff;\n}\n.search_select_wrapper_bottomTable .ant-tabs-nav .ant-tabs-extra-content > span {\n color: #005cff;\n cursor: pointer;\n}\n.search_select_wrapper_bottomTable .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {\n color: #005cff;\n}\n.search_select_wrapper_bottomTable .ant-tabs-content-holder {\n padding: 10px 10px 7px;\n}\n.search_select_wrapper_bottomTable .ant-tabs-content-holder .ant-tabs-content .ant-table-wrapper .ant-table .ant-table-container .ant-table-content .ant-table-thead > tr > th {\n color: #7F7F7F;\n}\n.search_select_wrapper_bottomTable .ant-tabs-content-holder .ant-tabs-content .ant-table-wrapper .ant-table .ant-table-container .ant-table-content .ant-table-thead .ant-table-selection .ant-checkbox-wrapper {\n justify-content: center;\n}\n.search_select_wrapper_bottomTable .ant-tabs-content-holder .ant-tabs-content .ant-table-wrapper .ant-table .ant-table-container .ant-table-content .ant-table.ant-table-small .ant-table-tbody > tr > td {\n color: #333333;\n}\n.search_select_wrapper_bottomTable .ant-checkbox-checked .ant-checkbox-inner {\n color: #005cff;\n background: #005cff;\n}\n.search_select_wrapper_bottomTable .ant-pagination-item-active a {\n color: #005cff;\n}\n.search_select_wrapper_bottomTable .ant-pagination-item-active {\n border-color: #005cff;\n}\n.searchSelectSpin > div {\n height: 300px !important;\n}\n.searchSelectMaxTagToolTip .ant-tooltip-inner {\n max-height: 72px;\n overflow-x: auto;\n padding: 0px;\n}\n";
4829
4829
  styleInject(css_248z$6);
4830
4830
 
4831
4831
  var zhankaitiaojian = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%3Ctitle%3Ezhankaitiaojian-icon%3C%2Ftitle%3E%20%20%20%20%3Cdefs%3E%20%20%20%20%20%20%20%20%3Crect%20id%3D%22path-1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2224%22%20height%3D%2224%22%3E%3C%2Frect%3E%20%20%20%20%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22%E9%A1%B5%E9%9D%A2-1%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icon%22%20transform%3D%22translate%28-702.000000%2C%20-498.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22zhankaitiaojian-icon%22%20transform%3D%22translate%28702.000000%2C%20498.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cmask%20id%3D%22mask-2%22%20fill%3D%22white%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fmask%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20id%3D%22%E8%92%99%E7%89%88%22%20fill%3D%22%23D8D8D8%22%20opacity%3D%220%22%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M12.0142082%2C6%20L18%2C11.9972435%20L12.0142082%2C18%20L11.04209%2C17.0260337%20L16.0562218%2C11.9972435%20L11.04209%2C6.97396631%20L12.0142082%2C6%20Z%20M6.97257658%2C6%20L12.9583683%2C11.9972435%20L6.97257658%2C18%20L6.00091666%2C17.0260337%20L11.0150485%2C11.9972435%20L6%2C6.97396631%20L6.97257658%2C6%20Z%22%20id%3D%22%E5%BD%A2%E7%8A%B6%22%20fill%3D%22%23005CFF%22%20fill-rule%3D%22nonzero%22%20mask%3D%22url%28%23mask-2%29%22%20transform%3D%22translate%2812.000000%2C%2012.000000%29%20rotate%28-270.000000%29%20translate%28-12.000000%2C%20-12.000000%29%20%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bit-sun/business-component",
3
- "version": "4.2.1-alpha.5-aiwei",
3
+ "version": "4.2.1-alpha.6-aiwei",
4
4
  "scripts": {
5
5
  "start": "dumi dev",
6
6
  "docs:build": "dumi build",
package/src/components/Functional/SearchSelect/index.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  // @ts-nocheck
2
- import React, { useState, useEffect, forwardRef, useImperativeHandle, useRef } from 'react';
2
+ import React, { useState, useEffect, forwardRef, useImperativeHandle } from 'react';
3
3
  import { useDebounceFn } from 'ahooks';
4
4
  import { Input, Button, Modal, Select, Divider, message, Spin, Form, Table, Checkbox, TreeSelect, Tooltip, Tag, Row, Col, Space, Tabs, Empty, DatePicker } from 'antd';
5
5
  import { SearchOutlined, CopyOutlined, CaretLeftOutlined } from '@ant-design/icons';
@@ -148,10 +148,6 @@ const SearchSelect = forwardRef((props: any, ref: any) => {
148
148
  const [tableShowColumns, setTabletShowColumns] = useState(handleTableColumns(modalTableProps?.tableColumns)); // 默认展示表头-modalTableProps?.tableColumns
149
149
  const [confirmLoading, setConfirmLoading] = useState(false);
150
150
  const [modalSearched, setModalSearched]=useState(false);
151
- const [overScrollY, setOverScrollY] = useState<number | undefined>(undefined);
152
-
153
- const topFormRef = useRef<HTMLDivElement>(null);
154
- const bottomWrapRef = useRef<HTMLDivElement>(null);
155
151
 
156
152
  const setSelectDataSource = (list,total: number) => {
157
153
  setItems(list);
@@ -374,7 +370,6 @@ const SearchSelect = forwardRef((props: any, ref: any) => {
374
370
  setModalSearched(false);
375
371
 
376
372
  setIsModalVisible(true);
377
- setTimeout(() => computeScrollY(), 0);
378
373
  // 回显
379
374
  if (value) {
380
375
  if (selectMode) {
@@ -461,7 +456,6 @@ const SearchSelect = forwardRef((props: any, ref: any) => {
461
456
  const handleCancel = () => {
462
457
  clearModalTable();
463
458
  setIsModalVisible(false);
464
- setOverScrollY(undefined);
465
459
  };
466
460
 
467
461
  const refreshItems = () => {
@@ -498,7 +492,6 @@ const SearchSelect = forwardRef((props: any, ref: any) => {
498
492
 
499
493
  const toggleCollapsed = () => {
500
494
  setCollapsed(!collapsed);
501
- setTimeout(() => computeScrollY(), 0);
502
495
  };
503
496
 
504
497
  const handleTableChange = (pagination) => {
@@ -719,11 +712,11 @@ const SearchSelect = forwardRef((props: any, ref: any) => {
719
712
 
720
713
  const renderShowTable = (tableList, type) => {
721
714
  const tableBoxHeighth = getTableHeigth(modalTableProps?.tableSearchForm);
722
- const x = tableList?.length ? 82 : 28;
723
- const oSY = overScrollY || `calc(100vh - ${tableBoxHeighth}px - ${x}px)`;
715
+ const x = tableList?.length ? 82 : 28; // 无数据没有分页，有数据计算减去：分页 24+16*2+10 「高 + margin * 2 + paddingBottom 10 」
716
+ const oSY = `calc(100vh - ${tableBoxHeighth}px - ${x}px)`;
724
717
  const mTB = `calc(50vh - ${tableBoxHeighth/2}px - ${x/2}px - 40px)`
725
718
  return (
726
- <div style={{ height: 'auto' }}>
719
+ <div style={{ height: `calc(100vh - ${tableBoxHeighth}px)` }}>
727
720
  <Table
728
721
  bordered
729
722
  size="middle"
@@ -961,7 +954,7 @@ const SearchSelect = forwardRef((props: any, ref: any) => {
961
954
  {...(modalTableProps?.modalProps || {})}
962
955
  >
963
956
  <div className={'search_select_wrapper'}>
964
- <div className={'search_select_wrapper_topForm'} ref={topFormRef}>
957
+ <div className={'search_select_wrapper_topForm'}>
965
958
  <div className={'select_list_columns'}>
966
959
  <Form form={form} layout={'horizontal'} colon={false} key="modalForm">
967
960
  <Row>
@@ -992,7 +985,7 @@ const SearchSelect = forwardRef((props: any, ref: any) => {
992
985
  </div>
993
986
  </div>
994
987
 
995
- <div className={'search_select_wrapper_bottomTable'} ref={bottomWrapRef}>
988
+ <div className={'search_select_wrapper_bottomTable'}>
996
989
  <div className={selectMode ?'search_select_wrapper_bottomTable_wrapLeft2':'search_select_wrapper_bottomTable_wrapLeft1'}><Tabs items={tabsItems1} /></div>
997
990
  {selectMode ? <div className={'search_select_wrapper_bottomTable_wrapRight'}><Tabs items={tabsItems2} tabBarExtraContent={<span onClick={()=> onChangeSelectedKeys([], [])}>清空已选</span>} /></div> : null}
998
991
  </div>
@@ -1004,27 +997,3 @@ const SearchSelect = forwardRef((props: any, ref: any) => {
1004
997
  });
1005
998
 
1006
999
  export default SearchSelect;
1007
- const computeScrollY = () => {
1008
- try {
1009
- const bodyEl = document.querySelector('.search_select_modal_wrapper .ant-modal-body') as HTMLElement | null;
1010
- const bodyH = bodyEl?.clientHeight || 0;
1011
- const topH = topFormRef.current?.clientHeight || 0;
1012
- const navEl = bottomWrapRef.current?.querySelector('.ant-tabs-nav') as HTMLElement | null;
1013
- const navH = navEl?.offsetHeight || 0;
1014
- const extra = 30; // paddings/margins buffer
1015
- const tableH = Math.max(160, bodyH - topH - navH - extra);
1016
- setOverScrollY(tableH);
1017
- } catch (e) {
1018
- // ignore
1019
- }
1020
- };
1021
-
1022
- useEffect(() => {
1023
- if (!isModalVisible) return;
1024
- computeScrollY();
1025
- const onResize = () => computeScrollY();
1026
- window.addEventListener('resize', onResize);
1027
- return () => {
1028
- window.removeEventListener('resize', onResize);
1029
- };
1030
- }, [isModalVisible, collapsed, tableData, tablePagination]);