cumDeduct列表及查询

pc4mobx/hrmSalary/components/importModal/modalStep1.js

@@ -1,20 +1,30 @@
 import React from 'react'
-import { WeaSteps, WeaDatePicker, WeaInput } from 'ecCom';
+import { WeaSteps, WeaDatePicker, WeaInput, WeaSelect } from 'ecCom';
+import { inject, observer } from 'mobx-react';
 import { Upload, Icon, Row, Col, Button } from "antd";
 import uploadImg from './upload.svg'
 
 const Dragger = Upload.Dragger;
 
+@inject("taxAgentStore")
+@observer
 export default class ModalStep1 extends React.Component {
     constructor(props) {
         super(props)
         this.state = {
             datetime: "",
-            personValue: ""
+            taxAgentId: ""
         }
     }
+
+    componentWillMount() { // 初始化渲染页面
+        const { taxAgentStore: {fetchTaxAgentOption} } = this.props;
+        fetchTaxAgentOption();
+    }
+
     render() {
-        const { datetime, personValue } = this.state
+        const { datetime, taxAgentId } = this.state
+        const { taxAgentStore: {taxAgentOption} } = this.props;
         return (
             <div style={{ height: "550px", display: "flex", flexFlow: "column"}}>
                 <div style={{ flex: "1", overflow: "scroll" }}>
@@ -34,12 +44,13 @@ export default class ModalStep1 extends React.Component {
                                 </Col>
                                 <Col span={12}>
                                     <span className="formLabel" style={{ lineHeight: "30px", marginRight: "10px" }}>个税扣缴义务人</span>
-                                    <WeaInput
-                                        id="test"
+                                    <WeaSelect
+                                        showSearch // 设置select可搜索
                                         style={{ width: 200 }}
-                                        value={personValue}
-                                        onChange={value => {
-                                            this.setState({ personValue: value });
+                                        options={taxAgentOption}
+                                        value={taxAgentId}
+                                        onChange={v => {
+                                        this.setState({ taxAgentId: v });
                                         }}
                                     />
                                 </Col>

pc4mobx/hrmSalary/pages/dataAcquisition/cumDeduct/index.js

@@ -32,16 +32,17 @@ export default class CumDeduct extends React.Component {
       taxAgentId: ""
     }
   }
-  
+
   componentWillMount() { // 初始化渲染页面
-    const { cumDeductStore: { doInit }, taxAgentStore: {fetchTaxAgentOption} } = this.props;
+    const { cumDeductStore: { doInit }, taxAgentStore: { fetchTaxAgentOption } } = this.props;
     doInit();
     fetchTaxAgentOption();
   }
 
   getSearchsAdQuick() {
     const { monthValue, taxAgentId } = this.state;
-    const { taxAgentStore: {taxAgentOption }} = this.props;
+
+    const { taxAgentStore: { taxAgentOption }, cumDeductStore: {form, getTableDatas} } = this.props;
     return (
       <div className="searchConditionWrapper">
         <div className="searchConditionItem">
@@ -50,7 +51,10 @@ export default class CumDeduct extends React.Component {
             value={monthValue}
             format="YYYY-MM"
             width={200}
-            onChange={value => this.setState({ monthValue: value })}
+            onChange={v => {
+              this.setState({monthValue: v})
+              getTableDatas({ declareMonth: [v] })
+            }}
           />
         </div>
 
@@ -70,25 +74,26 @@ export default class CumDeduct extends React.Component {
             options={taxAgentOption}
             value={taxAgentId}
             onChange={v => {
-              this.setState({ taxAgentId: v });
+              this.setState({taxAgentId: v})
+              getTableDatas({ taxAgentId: v })
             }}
           />
         </div>
       </div>
-    )  
+    )
   }
 
   render() {
     const { cumDeductStore, taxAgentStore } = this.props;
-    const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd  } = cumDeductStore;
+    const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd } = cumDeductStore;
     const { taxAgentOption } = taxAgentStore
-    
+
     if (!hasRight && !loading) { // 无权限处理
       return renderNoright();
     }
 
     const rightMenu = [// 右键菜单
-      { 
+      {
         key: 'BTN_COLUMN',
         icon: <i className='icon-coms-Custom' />,
         content: '显示列定制',
@@ -127,7 +132,7 @@ export default class CumDeduct extends React.Component {
         visiable: true
       })
     }
-    
+
 
     const menu = (
       <Menu onClick={handleMenuClick}>
@@ -136,13 +141,13 @@ export default class CumDeduct extends React.Component {
     );
 
     const btns = [
-      <Button type="primary" onClick={() => {handleBtnImport()}}>导入</Button>,
+      <Button type="primary" onClick={() => { handleBtnImport() }}>导入</Button>,
       <Dropdown.Button onClick={handleButtonClick} overlay={menu} type="ghost">
         导出全部
       </Dropdown.Button>
     ]
 
-    
+
 
     return (
       <div className="cumDeductWrapper">
@@ -158,9 +163,9 @@ export default class CumDeduct extends React.Component {
             dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
             buttons={btns}
           >
-            
+
             <div className="weaTabWrapper">
-              
+
               <WeaTab
                 searchType={['base', 'advanced']} // base：基础搜索框 advanced：显示高级搜索按钮
                 showSearchAd={showSearchAd} // 是否展开高级搜索面板
@@ -174,13 +179,13 @@ export default class CumDeduct extends React.Component {
               />
             </div>
             <WeaTable // table内部做了loading加载处理，页面就不需要再加了
-                comsWeaTableStore={tableStore} // table store
-                hasOrder={true} // 是否启用排序
-                needScroll={true} // 是否启用table内部列表滚动，将自适应到父级高度
-              />
+              comsWeaTableStore={tableStore} // table store
+              hasOrder={true} // 是否启用排序
+              needScroll={true} // 是否启用table内部列表滚动，将自适应到父级高度
+            />
           </WeaTop>
         </WeaRightMenu>
-        <ImportModal visiable={this.state.visiable} onCancel={() => {this.setState({visiable: false})}}/>
+        <ImportModal visiable={this.state.visiable} onCancel={() => { this.setState({ visiable: false }) }} />
       </div>
     )
   }

pc4mobx/hrmSalary/stores/cumDeduct.js

@@ -38,12 +38,14 @@ export class CumDeductStore {
 
   // 渲染table数据
   @action
-  getTableDatas = (toFirstPage = true) => {
+  getTableDatas = (params) => {
+    params = params || {};
     this.loading = true;
-    let params = this.form.getFormParams() || {};
+    let requestParams = this.form.getFormParams() || {};
+    requestParams = {...requestParams, ...params}
     API.getCumDeductList(params).then(action(res => {
       if (res.status) { // 接口请求成功/失败处理
-        toFirstPage ? this.tableStore.getDatas(res.data.datas, 1) : this.tableStore.getDatas(res.data.datas); // table 请求数据
+        this.tableStore.getDatas(res.data.datas); // table 请求数据
       } else {
         message.error(res.msg || '接口调用失败！')
       }