图表、报表筛选BUG

src/components/common/filterBox/filter.jsx

@@ -70,10 +70,10 @@ class Filter extends React.Component {
                 }}/>
             }else if(operator === 'contain' || operator === 'notContain') { // 包括/不包括
                 field = (<Select
-                    key={Math.random()}
+                    // key={Math.random()} // 这里使用随机数作为key会导致下拉框出现问题
                     value={commonProps.defaultValue} // 使用defaultValue不能及时响应全选/取消全选的操作
-                    open={dropdownOpen}
-                    onDropdownVisibleChange={this.onDropdownVisibleChange}
+                    // open={dropdownOpen}
+                    // onDropdownVisibleChange={this.onDropdownVisibleChange}
                     allowClear
                     mode='multiple'
                     maxTagCount={5}
@@ -83,25 +83,25 @@ class Filter extends React.Component {
                     onSearch={(value) => {this.fetchColumnData(filter, { keyword: value, mandatory: true })}}
                     onFocus={() => {this.fetchColumnData(filter)}}
                     onChange={(value) => {this.changeFilterValue(filter, value, index)}}
-                    dropdownRender={menu => (
-                        <div>
-                            {menu}
-                            {columnData.length > 0 && <Divider style={{ margin: '4px 0' }} />}
-                            {columnData.length > 0 && <div style={{ padding: '8px', cursor: 'pointer' }}>
-                                {/** https://github.com/ant-design/ant-design/issues/13448 */}
-                                <span onMouseDown={this.lockClose} onMouseUp={this.lockClose} onClick={() => {
-                                    if(commonProps.defaultValue && commonProps.defaultValue.length === columnData.length) {
-                                        this.changeFilterValue(filter, [], index)
-                                    }else {
-                                        this.changeFilterValue(filter, columnData, index)
-                                    }
-                                    this.setState({ dropdownOpen: false });
-                                }}>    
-                                    <Icon type={ commonProps.defaultValue && commonProps.defaultValue.length === columnData.length ? 'check-square' : 'border' } /> { commonProps.defaultValue && commonProps.defaultValue.length === columnData.length ? '取消全选' : '全选' }
-                                </span>
-                            </div>}
-                        </div>
-                    )}
+                    // dropdownRender={menu => (
+                    //     <div>
+                    //         {menu}
+                    //         {columnData.length > 0 && <Divider style={{ margin: '4px 0' }} />}
+                    //         {columnData.length > 0 && <div style={{ padding: '8px', cursor: 'pointer' }}>
+                    //             {/** https://github.com/ant-design/ant-design/issues/13448 */}
+                    //             <span onMouseDown={this.lockClose} onMouseUp={this.lockClose} onClick={() => {
+                    //                 if(commonProps.defaultValue && commonProps.defaultValue.length === columnData.length) {
+                    //                     this.changeFilterValue(filter, [], index)
+                    //                 }else {
+                    //                     this.changeFilterValue(filter, columnData, index)
+                    //                 }
+                    //                 this.setState({ dropdownOpen: false });
+                    //             }}>    
+                    //                 <Icon type={ commonProps.defaultValue && commonProps.defaultValue.length === columnData.length ? 'check-square' : 'border' } /> { commonProps.defaultValue && commonProps.defaultValue.length === columnData.length ? '取消全选' : '全选' }
+                    //             </span>
+                    //         </div>}
+                    //     </div>
+                    // )}
                 >
                     { columnData.map((s, i) => {
                         return <SelectOption key={i} value={s}>{s}</SelectOption>

src/components/common/filterBox/filter2.jsx

@@ -61,7 +61,7 @@ class Filter extends React.Component {
                 }}/>
             }else if(operator === 'contain' || operator === 'notContain') { // 包括/不包括
                 field = (<Select
-                    key={Math.random()}
+                    // key={Math.random()}
                     value={commonProps.defaultValue} // 使用defaultValue不能及时响应全选/取消全选的操作
                     allowClear
                     mode='multiple'
@@ -71,9 +71,9 @@ class Filter extends React.Component {
                     onDropdownVisibleChange={this.onDropdownVisibleChange}
                     dropdownMatchSelectWidth={false}
                     notFoundContent={fetching ? <Spin size="small" /> : '无'}
-                    onSearch={(value) => {this.fetchColumnData(filter, { keyword: value, mandatory: true })}}
+                    onSearch={(value) => {console.log(value);this.fetchColumnData(filter, { keyword: value, mandatory: true })}}
                     onFocus={() => {this.fetchColumnData(filter)}}
-                    onChange={(value) => {this.changeFilterValue(filter, value, index)}}
+                    onChange={(value) => {console.log(value);this.changeFilterValue(filter, value, index)}}
                     dropdownRender={menu => (
                         <div>
                             {menu}

src/components/common/filterBox/filterBox.jsx

@@ -238,36 +238,36 @@ class FilterBox extends React.Component {
                     allowClear
                     mode='multiple'
                     showSearch
-                    open={dropdownOpen}
-                    onDropdownVisibleChange={open => {
-                        this.onDropdownVisibleChange(filter, open);
-                    }}
+                    // open={dropdownOpen}
+                    // onDropdownVisibleChange={open => {
+                    //     this.onDropdownVisibleChange(filter, open);
+                    // }}
                     dropdownMatchSelectWidth={false}
                     notFoundContent={fetching ? <Spin size="small" /> : '无'}
                     onSearch={(value) => {this.fetchColumnData(column, value, true)}}
                     onFocus={() => {this.fetchColumnData(column)}}
                     onChange={(value) => {this.changeFilterValue(filter, value, index)}}
-                    dropdownRender={menu => (
-                        <div>
-                            {menu}
-                            {columnData.length > 0 && <Divider style={{ margin: '4px 0' }} />}
-                            {columnData.length > 0 && <div style={{ padding: '8px', cursor: 'pointer' }}>
-                                {/** https://github.com/ant-design/ant-design/issues/13448 */}
-                                <span onMouseDown={this.lockClose} onMouseUp={this.lockClose} onClick={() => {
-                                    if(commonProps.defaultValue && commonProps.defaultValue.length === columnData.length) {
-                                        this.changeFilterValue(filter, [], index)
-                                    }else {
-                                        this.changeFilterValue(filter, columnData, index)
-                                    }
-                                    let obj = {};
-                                    obj['dropdownOpen-' + filter.key] = false;
-                                    this.setState(obj);
-                                }}>    
-                                    <Icon type={ commonProps.defaultValue && commonProps.defaultValue.length === columnData.length ? 'check-square' : 'border' } /> { commonProps.defaultValue && commonProps.defaultValue.length === columnData.length ? '取消全选' : '全选' }
-                                </span>
-                            </div>}
-                        </div>
-                    )}
+                    // dropdownRender={menu => (
+                    //     <div>
+                    //         {menu}
+                    //         {columnData.length > 0 && <Divider style={{ margin: '4px 0' }} />}
+                    //         {columnData.length > 0 && <div style={{ padding: '8px', cursor: 'pointer' }}>
+                    //             {/** https://github.com/ant-design/ant-design/issues/13448 */}
+                    //             <span onMouseDown={this.lockClose} onMouseUp={this.lockClose} onClick={() => {
+                    //                 if(commonProps.defaultValue && commonProps.defaultValue.length === columnData.length) {
+                    //                     this.changeFilterValue(filter, [], index)
+                    //                 }else {
+                    //                     this.changeFilterValue(filter, columnData, index)
+                    //                 }
+                    //                 let obj = {};
+                    //                 obj['dropdownOpen-' + filter.key] = false;
+                    //                 this.setState(obj);
+                    //             }}>    
+                    //                 <Icon type={ commonProps.defaultValue && commonProps.defaultValue.length === columnData.length ? 'check-square' : 'border' } /> { commonProps.defaultValue && commonProps.defaultValue.length === columnData.length ? '取消全选' : '全选' }
+                    //             </span>
+                    //         </div>}
+                    //     </div>
+                    // )}
                 >
                     { columnData.map((s, i) => {
                         return <SelectOption key={i} value={s}>{s}</SelectOption>

src/components/common/filterBox/filterBox2.jsx

@@ -386,10 +386,10 @@ class FilterBox extends React.Component {
                     allowClear
                     mode='multiple'
                     showSearch
-                    open={dropdownOpen}
-                    onDropdownVisibleChange={(open) => {
-                        this.onDropdownVisibleChange(filter, open);
-                    }}
+                    // open={dropdownOpen}
+                    // onDropdownVisibleChange={(open) => {
+                    //     this.onDropdownVisibleChange(filter, open);
+                    // }}
                     dropdownMatchSelectWidth={false}
                     notFoundContent={fetching ? <Spin size="small" /> : '无'}
                     onSearch={(value) => {this.fetchColumnData(filter, { keyword: value, mandatory: true })}}