cnhis-design-vue 2.1.141 → 2.1.144

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cnhis-design-vue",
-  "version": "2.1.141",
+  "version": "2.1.144",
   "description": "前端业务UI库",
   "keyword": "cnhis-design-vue vue cnhis",
   "homepage": "http://dv.cnhis.com/",

package/packages/big-table/src/BigTable.vue

@@ -1717,7 +1717,7 @@ export default create({
     // 表头渲染逻辑
     formatterHeader(item) {
       let field = this.filterFields[item.columnName];
-      const {showfilterSearch, showSelectAll, filterOptions} = field.filterSettingMap || {} 
+      const {showfilterSearch, showSelectAll, filterOptions=[]} = field.filterSettingMap || {};
       return () => {
         return [
           <div class="filter-box">
@@ -1759,8 +1759,9 @@ export default create({
                       <a-input-search
                         placeholder="字段搜索"
                         class="check-seach-input"
+                        allowClear={true}
                         onSearch={val => {
-                          this.handleFilterSeach(val, field);
+                          this.handleFilterSeachDebounce(val, item);
                         }}
                       />
                     </div>
@@ -1770,7 +1771,7 @@ export default create({
                 )}
                 <div class="checkbox-box">
                   <div class="checkbox-wrap js-checkbox-wrap" style={{ height: this.filterHeight + this.distance + 'px' }}>
-                    {showSelectAll ? (
+                    {showSelectAll && !field.searchFilterText ? (
                       <div class="ant-checkbox-group">
                         <a-checkbox
                           indeterminate={field.indeterminate}
@@ -1790,7 +1791,7 @@ export default create({
                       <a-checkbox-group options={filterOptions} value={field.CONVERT} onChange={val => this.handleFilterChange(val, item.columnName, field)} />
                     ) : (
                       <a-checkbox-group
-                        options={filterOptions}
+                        options={field.filterSettingMap && field.filterSettingMap.filterOptions || []}
                         value={field.searchFilterCONVERT}
                         onChange={val => this.handleFilterSearchChange(val, item.columnName, field)}
                       />

package/packages/big-table/src/utils/headerFilter.js

@@ -30,6 +30,9 @@ export default {
       return this.tableDataType === 'API';
     }
   },
+  created() {
+    this.handleFilterSeachDebounce = vexutils.debounce(this.handleFilterSeach, 100);
+  },
   methods: {
     getOffsetLocation(element, cls, offsetKey) {
       let actualTop = element[offsetKey];
@@ -47,6 +50,22 @@ export default {
       let resHeight = target.offsetHeight;
       return { resTop, resLeft, resWidth, resHeight };
     },
+    handleShowFilterOptions(field) {
+      const { filterSettingMap = {}, setting } = field || {};
+      let originOptions = setting?.showSetting || [];
+      const { filterOptions } = filterSettingMap;
+      if (!filterOptions) return;
+      // 无搜索
+      if (filterOptions.length === originOptions.length) return;
+      filterSettingMap.filterOptions = originOptions;
+    },
+    handleShowFilterCheck(field, columnName) {
+      let { filterOptions } = field?.filterSettingMap || {};
+      let len = this.filterFields[columnName]?.CONVERT?.length;
+      let allLen = filterOptions?.length || field.setting?.showSetting?.length;
+      field.checkAll = len === allLen;
+      field.indeterminate = !!len && len !== allLen;
+    },
     showFilter(field, columnName, event) {
       if (this.isInlineOperating) return false;
       let target = event.target;
@@ -54,7 +73,6 @@ export default {
       let fontSize = this.styleSetting?.fontSize || 'small';
       let scaleNum = fontSizeMap[fontSize];
       let FILTER_BOX_TOP_OFFSET = filterTopOffsetMap[fontSize];
-      let { filterOptions } = field?.filterSettingMap || {};
 
       let transformWrap = document.body;
       let { left: btnRectLeft, right: btnRectRight, top: btnRectTop, width: btnWidth } = target.getBoundingClientRect();
@@ -101,12 +119,11 @@ export default {
       field.top = top / scaleNum + 'px';
 
       field.visible = !field.visible;
-
-      let len = this.filterFields[columnName]?.CONVERT?.length;
-      let allLen = filterOptions?.length || field.setting?.showSetting?.length;
-      field.checkAll = len === allLen;
-      field.indeterminate = !!len && len !== allLen;
       field.searchFilterText = '';
+
+      // field.filterSettingMap.filterOptions =field.setting?.showSetting || [];
+      this.handleShowFilterOptions(field);
+      this.handleShowFilterCheck(field, columnName);
     },
     handlefilterBoxClickSort(sort, field) {
       if (field.filterSort === sort) {
@@ -119,24 +136,41 @@ export default {
       field.visible = false;
       this.$emit('sortChange', { prop: field.columnName, order: sort });
     },
-    handleFilterSeach(val, field) {
+    handleFilterSeach(val, item) {
+      let field = this.filterFields[item.columnName];
+      if (!field) return;
       field.searchFilterText = val;
       let { filterOptions } = field?.filterSettingMap || {};
       let options = filterOptions || field.setting?.showSetting;
-      let allLen = options?.length;
+      let originOptions = field.setting?.showSetting || [];
+      let allLen = originOptions?.length;
       let cLen = field?.CONVERT?.length;
 
       if (val === '') {
         field.checkAll = cLen === allLen;
         field.indeterminate = !!cLen && cLen !== allLen;
+
+        field.filterSettingMap &&
+          Object.assign(field.filterSettingMap, {
+            filterOptions: originOptions
+          });
         return;
       }
 
-      field.searchFilterCONVERT = options
-        .filter(item => {
-          return field.searchFilterText === item.label && field.CONVERT.includes(item.value);
-        })
-        .map(item => item.value);
+      // 过滤options
+      let curFilterOptions =
+        originOptions.filter?.(item => {
+          if (!field.searchFilterText) return item;
+          let reg = new RegExp(field.searchFilterText);
+          return reg.test(item.label);
+        }) || [];
+
+      field.searchFilterCONVERT = curFilterOptions.filter(item => field.CONVERT.includes(item.value)).map(item => item.value);
+
+      field.filterSettingMap &&
+        Object.assign(field.filterSettingMap, {
+          filterOptions: curFilterOptions
+        });
 
       beforeSearchConvert = field.searchFilterCONVERT;
     },
@@ -155,6 +189,7 @@ export default {
           })
         : [];
     },
+
     handleFilterChange(newValue, name, field) {
       this.reScrollFilterWrap();
       let value = newValue;
@@ -169,22 +204,23 @@ export default {
     handleFilterSearchChange(value, columnName, field) {
       this.reScrollFilterWrap();
       /* filter-check-group value更新 触发 主check-group value同步更新 */
+      let curField = this.filterFields[columnName];
       let isAdd = beforeSearchConvert.length < value.length;
       if (isAdd) {
         let addItems = value.filter(item => {
           return !beforeSearchConvert.includes(item);
         });
-        if (field.advanceOptionSetting == '0' && this.filterFields[columnName]?.CONVERT) {
-          if (Array.isArray(this.filterFields[columnName].CONVERT)) {
-            this.filterFields[columnName].CONVERT.length = 0;
+        if (field.advanceOptionSetting == '0' && curField?.CONVERT) {
+          if (Array.isArray(curField.CONVERT)) {
+            curField.CONVERT.length = 0;
           }
         }
-        this.filterFields[columnName].CONVERT.push(...addItems);
+        curField.CONVERT.push(...addItems);
       } else {
         let removeItems = beforeSearchConvert.filter(item => {
           return !value.includes(item);
         });
-        this.filterFields[columnName].CONVERT = this.filterFields[columnName].CONVERT.filter(item => {
+        curField.CONVERT = curField.CONVERT.filter(item => {
           return !removeItems.includes(item);
         });
       }