考勤列表

pc4mobx/hrmSalary/components/customTab/index.js

@@ -12,15 +12,21 @@ export default class CustomTab extends React.Component {
     render() {
         return (<div className="tabWrapper">
             <div className="weaTab">
-            <WeaTab
-                datas={this.props.topTab}
-                keyParam="viewcondition" //主键
-                selectedKey={this.state.selectedKey}
-                onChange={(v) => {
-                    this.setState({selectedKey: v})
-                    this.props.onChange(v);
-                }}
-            />
+                {
+                    this.props.topTab && <WeaTab
+                    datas={this.props.topTab}
+                    keyParam="viewcondition" //主键
+                    selectedKey={this.state.selectedKey}
+                    onChange={(v) => {
+                        this.setState({selectedKey: v})
+                        this.props.onChange(v);
+                    }}
+                />
+                }
+                {
+                    this.props.leftOperation && this.props.leftOperation
+                }
+            
             </div>
             <div className="tabSearchWrapper">
                 {

pc4mobx/hrmSalary/components/monthRange/index.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { WeaDatePicker } from "ecCom";
+import "./index.less"
+
+export default class MonthRange extends React.Component {
+    render() {
+        return <div className="monthRange">
+        <span className="labelName">{this.props.label}:</span>
+        <WeaDatePicker
+            format="yyyy-MM"
+            value={this.props.startDate}
+            onChange={value => this.props.onStartDateChange(value)}
+        />
+        <span className="between"> 至 </span>
+        <WeaDatePicker
+            format="yyyy-MM"
+            value={this.props.endDate}
+            onChange={value => this.props.onEndDateChange(value)}
+        />
+      </div>
+    }
+}

pc4mobx/hrmSalary/components/monthRange/index.less

@@ -0,0 +1,11 @@
+.monthRange {
+    line-height: 47px;
+    .labelName {
+        margin-left: 10px;
+        margin-right: 10px;
+    }
+    .between {
+        margin-left: 10px;
+        margin-right: 10px;
+    }
+}

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

@@ -4,13 +4,14 @@ import { toJS } from 'mobx';
 
 import { Button, Table, DatePicker } from 'antd';
 
-import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaTable } from 'ecCom';
+import { WeaDatePicker, WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaTable } from 'ecCom';
 
 import { renderNoright, getSearchs } from '../../../util'; // 渲染form数据的方法：因为多个页面都会使用，所以抽的公共方法在util中
 import CustomTab from '../../../components/customTab';
 import ContentWrapper from '../../../components/contentWrapper';
 
 import { columns, dataSource } from './columns';
+import MonthRange from '../../../components/monthRange'
 
 const { MonthPicker } = DatePicker;
 
@@ -21,7 +22,9 @@ export default class Attendance extends React.Component {
     super(props);
     this.state = {
       value: "",
-      selectedKey: "0"
+      selectedKey: "0",
+      startDate: "",
+      endDate: ""
     }
   }
   render() {
@@ -57,10 +60,19 @@ export default class Attendance extends React.Component {
       ];
 
     const renderSearchOperationItem = () => {
-      return <div></div>
+      return <div>
+        <Button type="primary" style={{ marginRight: '10px' }} onClick={() => { this.setState({ slideVisiable: true }) }}>引用</Button>
+        <Button type="default" onClick={() => { this.setState({ slideVisiable: true }) }}>导入</Button>
+      </div>
      
     }
 
+    const renderLeftOperation = () => {
+      return <MonthRange 
+        label={"薪资所属月"}
+        />
+    }
+
     return (
       <div className="mySalaryBenefitsWrapper">
         <WeaRightMenu
@@ -75,6 +87,17 @@ export default class Attendance extends React.Component {
             dropMenuDatas={rightMenu} // 下拉菜单（和页面的右键菜单相同）
             dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
           >
+            <CustomTab 
+              leftOperation={
+                renderLeftOperation()
+              }
+              searchOperationItem={
+                renderSearchOperationItem()
+              }
+              onChange={(v) => {
+                
+              }}
+            />
             <WeaTable columns={columns} dataSource={dataSource}/>
           </WeaTop>
         </WeaRightMenu>

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

@@ -300,6 +300,7 @@ export default class CumDeduct extends React.Component {
               comsWeaTableStore={tableStore} // table store
               hasOrder={true} // 是否启用排序
               needScroll={true} // 是否启用table内部列表滚动，将自适应到父级高度
+              
               getColumns={this.getColumns}
               onOperatesClick={this.onOperatesClick.bind(this)}
             />