1.手机端增加主表根据配置过滤从表数据功能

Min
1 parent 3f4f05b2
Showing 5 changed files with 69 additions and 50 deletions
src/assets/mobile/search.svg
src/mobile/common/CommobileComponent.js
src/mobile/common/CommobileSubBill.js
src/mobile/common/CommobileSubBillEvent.js
src/mobile/common/CommobileViewMaster.js
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1781587856458" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4456" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M802.133333 770.438095l-121.904762-121.904762c42.666667-47.542857 68.266667-109.714286 68.266667-177.980952 0-147.504762-120.685714-268.190476-268.190476-268.190476s-268.190476 120.685714-268.190476 268.190476 120.685714 268.190476 268.190476 268.190476c57.295238 0 110.933333-18.285714 154.819048-48.761905l124.342857 124.342858 42.666666-43.885715zM273.066667 470.552381c0-114.590476 92.647619-207.238095 207.238095-207.238095s207.238095 92.647619 207.238095 207.238095-92.647619 207.238095-207.238095 207.238095-207.238095-92.647619-207.238095-207.238095z" fill="#8a8a8a" p-id="4457"></path></svg>
 \ No newline at end of file
@@ -9,7 +9,7 @@ import * as commonUtils from &#39;../../utils/utils&#39;;
 import styles from '../mobile.less';
 import iconSetting from '../../assets/mobile/setting.png';
 import scan from '../../assets/mobile/scanning.svg';
-
+import search from '../../assets/mobile/search.svg';
 // eslint-disable-next-line prefer-destructuring
 const CheckboxItem = Checkbox.CheckboxItem;
@@ -386,6 +386,12 @@ export default class CommonComponent extends Component {
     this.props.onMobileScan(this.props.showConfig, this.props.name, this.props.record);
   }
+  /* 主表过滤从表  */
+  handleMobileFilterTable = () => {
+    console.log('主表过滤从表', this.props.record);
+    this.props.onMobileFilterTable(this.props.showConfig, this.props.name, this.props.record);
+  }
+
   /**   渲染   */
   render() {
     const { sDateFormat: sDateFormatOld, sFieldValidation, bNotEmpty, bOpenKeyboard } = this.props.showConfig;
@@ -435,7 +441,7 @@ export default class CommonComponent extends Component {
       //     </List.Item>
       //   </Picker>
       // );
-      
+
       input = (
         <SearchablePicker
           data={this.getSelectOption()}
@@ -465,11 +471,15 @@ export default class CommonComponent extends Component {
         const is_Pda = this.props.showConfig.sControlName && this.props.showConfig.sControlName.includes('_pda');
         const pdaInput = <InputItem id={this.props.showConfig.sName} {...pdaPro} ref={(el) => { this.inputRef = el; }} clear onChange={debounce(this.handleFieldScan, 1000)} >{sTitle}</InputItem>;
         const is_Scan = this.props.showConfig.sControlName && this.props.showConfig.sControlName.includes('_scan');
+        const is_Search = this.props.showConfig.sControlName && this.props.showConfig.sControlName.toLowerCase().includes('_search');
+
         if (is_Pda) {
           input = pdaInput;
         } else if (is_Scan) {
           input = <div style={{ position: 'relative' }}><InputItem clear {...outFormItemProps} >{sTitle}</InputItem><span className={styles.spanStyle} onClick={this.handleMobileScan}><img className={styles.scanStyle} src={scan} style={!this.state.enabled ? { opacity: 0.8 } : { opacity: 1 }} alt="scan" /></span></div>;
-        } else {
+        } else if (is_Search) {
+          input = <div style={{ position: 'relative' }}><InputItem clear {...outFormItemProps} >{sTitle}</InputItem><span className={styles.spanStyle} onClick={(e) => this.handleMobileFilterTable(e)}><img className={styles.scanStyle} src={search} style={!this.state.enabled ? { opacity: 0.8 } : { opacity: 1 }} alt="scan" /></span></div>;
+        }  else {
           input = (<InputItem id={this.props.showConfig.sName} clear {...outFormItemProps} >{sTitle}</InputItem>);
         }
       }
@@ -2256,10 +2256,13 @@ const CommobileBillComponent = createForm()(CommobileBill);
 const TabComponentSlave = (props) => {
-  const { masterConfig, masterData, slaveData: slaveDataOld, slaveConfig, sModelsId, enabled, app, sUseInfo } = props;
+  const { masterConfig, masterData, slaveData: slaveDataOld, slaveConfig, sModelsId, enabled, app, sUseInfo, searchSlaveData:searchSlaveDataOld = [] } = props;
   const slaveDataOld2 = slaveDataOld === undefined ? [] : slaveDataOld;
-  const slaveData = dataSource.cloneWithRows(slaveDataOld2);
+  let slaveData = dataSource.cloneWithRows(slaveDataOld2);
+  if(commonUtils.isNotEmptyArr(searchSlaveDataOld)){
+    slaveData =  dataSource.cloneWithRows(searchSlaveDataOld);
+  }
   const style = {
     display: 'flex',
@@ -2287,6 +2290,7 @@ const TabComponentSlave = (props) =&gt; {
     justifyContent: 'space-between',
     background: ' #f0f0f0',
   };
+  console.log('aaa', props);
   const row = (rowData, sectionID, rowID) => {
     return (
@@ -2578,53 +2582,9 @@ const TabComponentSlaveChild = (props) =&gt; {
   const f8 = commonUtils.isEmptyObject(masterConfig) ? {} : masterConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '' && item.iTag === 1)[7];
   const f9 = commonUtils.isEmptyObject(masterConfig) ? {} : masterConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '' && item.iTag === 1)[8];
   const f10 = commonUtils.isEmptyObject(masterConfig) ? {} : masterConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '' && item.iTag === 1)[9];
-
+  console.log('77777222', props);
   return (
     <div className="commobileBillContainer">
-      {/*<div style={{ padding: '5px 0' }} className={styles.onlyWordBg}>*/}
-        {/*<Flex style={{ padding: '0 15px 5px 15px' }}>*/}
-        {/*  {*/}
-        {/*    f1 ? <Flex.Item className={styles.wordsFlow} style={{ color: '#fff', fontWeight: 'bold', fontSize: '17px' }}>{f1.showName} : {_this.getViewValue(f1, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*  {*/}
-        {/*    f2 ? <Flex.Item className={`${styles.wordsFlow} ${styles.fr}`} style={{ fontSize: '17px' }}>{f2.showName} : {_this.getViewValue(f2, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*</Flex>*/}
-        {/*<Flex style={{ padding: '0 15px 5px 15px' }}>*/}
-        {/*  {*/}
-        {/*    f3 ? <Flex.Item className={styles.wordsFlow} style={{ fontSize: '17px' }}>{f3.showName} : {_this.getViewValue(f3, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*</Flex>*/}
-        {/*<Flex style={{ padding: '0 15px 5px 15px', fontSize: '17px' }} wrap={'wrap'} align='start'>*/}
-        {/*  {*/}
-        {/*    f4 ? <><div>{f4.showName} : </div><Flex.Item style={{ fontSize: '17px' }}> {_this.getViewValue(f4, masterData)}</Flex.Item></> : ''*/}
-        {/*  }*/}
-        {/*</Flex>*/}
-        {/*<Flex style={{ padding: '0 15px 5px 15px' }}>*/}
-        {/*  {*/}
-        {/*    f5 ? <Flex.Item className={styles.wordsFlow} style={{ fontSize: '17px' }}>{f5.showName} : {_this.getViewValue(f5, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*  {*/}
-        {/*    f6 ? <Flex.Item className={`${styles.wordsFlow} ${styles.fr}`} style={{ fontSize: '17px' }}>{f6.showName} : {_this.getViewValue(f6, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*</Flex>*/}
-        {/*<Flex style={{ padding: '0 15px 5px 15px' }}>*/}
-        {/*  {*/}
-        {/*    f7 ? <Flex.Item className={styles.wordsFlow} style={{ fontSize: '17px' }}>{f7.showName} : {_this.getViewValue(f7, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*  {*/}
-        {/*    f8 ? <Flex.Item className={`${styles.wordsFlow} ${styles.fr}`} style={{ fontSize: '17px' }}>{f8.showName} : {_this.getViewValue(f8, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*</Flex>*/}
-        {/*<Flex style={{ padding: '0 15px 0px 15px' }}>*/}
-        {/*  {*/}
-        {/*    f9 ? <Flex.Item className={styles.wordsFlow} style={{ fontSize: '17px' }}>{f9.showName} : {_this.getViewValue(f9, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*  {*/}
-        {/*    f10 ? <Flex.Item className={`${styles.wordsFlow} ${styles.fr}`} style={{ fontSize: '17px' }}>{f10.showName} : {_this.getViewValue(f10, masterData)}</Flex.Item> : ''*/}
-        {/*  }*/}
-        {/*</Flex>*/}
-      {/*</div>*/}
       <form style={{ paddingBottom: '47px' }} { ...props.formProps || {} } >
         <div className="flex-container" style={{ color: 'white' }}>
           <CommobileViewMaster {...props} iTag={1} />
@@ -1957,6 +1957,49 @@ export default (ChildComponent) =&gt; {
       }
     }
+    /**
+     * 子表多字段模糊过滤
+     * @param {Object} fieldConfig 列配置对象（包含sActiveKey）
+     * @param {Array} searchSlaveData 原始列表数据源
+     * @param {String} searchVal 输入框搜索值（如222）
+     * @returns {Array} 过滤后的新数组
+     */
+    handleFilterData = (fieldConfig, searchSlaveData, searchVal)=> {
+      // 1. 判空兜底
+      if (!fieldConfig?.sActiveKey || !searchSlaveData?.length || !searchVal?.trim()) {
+        return searchSlaveData || [];
+      }
+
+      // 2. 分割多搜索字段 sActiveKey:"sProductName,sDefineNo"
+      const searchKeys = fieldConfig.sActiveKey.split(',').map(key => key.trim());
+      const targetVal = searchVal.trim();
+
+      // 3. 过滤逻辑：任意字段包含搜索值即匹配（模糊查询）
+      const filterList = searchSlaveData.filter(item => {
+        return searchKeys.some(key => {
+          // 当前行该字段的值，转字符串防止数字/空报错
+          const cellVal = String(item[key] ?? '');
+          // 模糊匹配：包含搜索文本；需要精确匹配改为 cellVal === targetVal
+          return cellVal.includes(targetVal);
+        });
+      });
+
+      return filterList;
+    }
+
+    handleMobileFilterTable = (fieldConfig, tbName, record) => {
+       const{ slaveData = []}= this.props;
+      const fieldName = fieldConfig?.sName;
+      const inputVal = record?.[fieldName];
+      // 原始子表数据
+      // 执行过滤
+      const filterResult = this.handleFilterData(fieldConfig, slaveData, inputVal);
+      console.log('过滤后列表', filterResult);
+      // 更新视图
+      this.props.onSaveState({ searchSlaveData: filterResult });
+
+    }
+
     handleButtonClick = async (name ) => {
       if(name === 'BtnRefresh') {
         const { sModelsType, slaveConfig, masterConfig, employeeConfig, slave0Config, slaveChildConfig}= this.props;
@@ -1994,6 +2037,7 @@ export default (ChildComponent) =&gt; {
           onEdit={this.handleEdit}
           isOutsourcedProcesses={this.isOutsourcedProcesses}
           onMobileScan={this.handleMobileScan}
+          onMobileFilterTable={this.handleMobileFilterTable}
           handleNameToIndex={this.handleNameToIndex}
           onButtonClick = {this.handleButtonClick}
         />
@@ -15,6 +15,9 @@ export default class CommobileViewMaster extends Component {
   handleMobileScan = (fieldConfig, tbName, record, newValue, cancelValue) => {
     this.props.onMobileScan(fieldConfig, tbName, record, newValue, cancelValue);
   }
+  handleMobileFilterTable = (fieldConfig, tbName, record, newValue, cancelValue) => {
+    this.props.onMobileFilterTable(fieldConfig, tbName, record, newValue, cancelValue);
+  }
   handleFocus = (fieldConfig) => {
     this.props.onFocus(fieldConfig);
   }
@@ -76,6 +79,7 @@ export default class CommobileViewMaster extends Component {
               onSaveState: this.props.onSaveState,
               onFieldScan: this.handleMasterFieldScan,
               onMobileScan: this.handleMobileScan,
+              onMobileFilterTable:this.handleMobileFilterTable, /* 主表筛选从表 */
               bOpenKeyboard,
             };
             if (child.iTag === 1) {