日期区间

2022-04-25 10:03:07 +08:00 · 2022-04-25 10:03:07 +08:00 · 3fbfa85d34
parent fa0ff1d9b8
commit 3fbfa85d34
5 changed files with 37 additions and 124 deletions
--- a/pc4mobx/hrmSalary/pages/calculate/index.js
+++ b/pc4mobx/hrmSalary/pages/calculate/index.js
@ -14,7 +14,7 @@ import { columns, dataSource } from './columns';
 import moment from 'moment';
 import BaseFormModal from './baseFormModal'

-const { MonthPicker } = DatePicker;
+const { RangePicker } = DatePicker;

@inject('calculateStore')
@observer
@ -24,8 +24,6 @@ export default class Calculate extends React.Component {
    this.state = {
      value: "",
      selectedKey: "0",
-      startDate: moment(new Date()).format("YYYY-MM"),
-      endDate: moment(new Date()).format("YYYY-MM"),
      searchValue: "",
      columns: columns.map(item => {
        if(item.dataIndex == 'cz') {
@ -46,11 +44,10 @@ export default class Calculate extends React.Component {
    const { calculateStore } = this.props;
    const { getSalaryAcctList } = calculateStore
    getSalaryAcctList({
-        name:'',
-        startMonthStr: moment(new Date()).format("YYYY-MM"),
-        endMonthStr: moment(new Date()).format("YYYY-MM")
+      name: "",
+      startMonthStr: moment(new Date()).format("YYYY-MM"),
+      endMonthStr: moment(new Date()).format("YYYY-MM")
    })
-
  }


@ -65,29 +62,13 @@ export default class Calculate extends React.Component {
    })
  }

-  // 开始日期变化监听
-  handleStartDateChange(value) {
-    const { calculateStore } = this.props;
-    const { getSalaryAcctList } = calculateStore
-    this.setState({startDate: value})
+  handleRangePickerChange(value) {
+    let range = value.map(item => moment(item).format("YYYY-MM"))
+    const { calculateStore: {getSalaryAcctList} } = this.props;
    getSalaryAcctList({
      name: this.state.searchValue,
-      startMonthStr: value,
-      endMonthStr: this.state.endDate
-    })
-  }
-
-  // 结束日期变化监听
-  handleEndDataChange(value) {
-    const { calculateStore } = this.props;
-    const { getSalaryAcctList } = calculateStore
-    this.setState({
-      endDate: value
-    })
-    getSalaryAcctList({
-      name: this.state.searchValue,
-      startMonthStr: this.state.startDate,
-      endMonthStr: value
+      startMonthStr: range[0],
+      endMonthStr: range[1]
    })
  }

@ -214,22 +195,9 @@ export default class Calculate extends React.Component {
          onClick={() => {this.setState({baseFormVisible: true})}}
           >核算</Button>
          <div style={{display: "inline-block"}}>
-              <WeaDatePicker
-                format="yyyy-MM"
-                value={startDate}
-                onChange={value => 
-                  this.handleStartDateChange(value)
-                  }
-              />
-              {' '}
-              至
-              {' '}
-              <WeaDatePicker
-                style={{marginLeft:"10px"}}
-                format="yyyy-MM"
-                value={endDate}
-                onChange={value => this.handleEndDataChange(value)}
-              />
+            <RangePicker defaultValue={[moment(new Date()).format("YYYY-MM"), moment(new Date()).format("YYYY-MM")]} picker="month" format="yyyy-MM" 
+              onChange={(value) => this.handleRangePickerChange(value)}
+            />
          </div>
          <WeaInputSearch style={{marginLeft: "10px"}} value={this.state.searchValue} onChange={(value) => {this.setState({ searchValue:value })}} onSearch={(value) => {this.handleSearch(value)}}/>
        </div>
--- a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js
+++ b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js
@ -166,12 +166,12 @@ export default class Attendance extends React.Component {

    const renderLeftOperation = () => {
      const { attendanceStore: {getAttendanceList}} = this.props;
-      return <span style={{marginLeft: "20px"}}>薪资所属月: <RangePicker picker="month" format="yyyy-MM" onChange={(range) => {
+      return <div style={{marginLeft: "20px", marginTop: "10px"}}>薪资所属月: <RangePicker picker="month" format="yyyy-MM" onChange={(range) => {
        this.listSearch = {
          salaryYearMonth: range.map(item => moment(item).format("YYYY-MM"))
        }
        getAttendanceList(this.listSearch)
-      }}/></span>
+      }}/></div>
    }


--- a/pc4mobx/hrmSalary/pages/declare/index.js
+++ b/pc4mobx/hrmSalary/pages/declare/index.js
@ -14,7 +14,7 @@ import { columns, dataSource } from './columns';
 import GenerateModal from './generateModal'
 import moment from 'moment'

-const { MonthPicker } = DatePicker;
+const { RangePicker } = DatePicker;

@inject('declareStore')
@observer
@ -25,8 +25,8 @@ export default class Declare extends React.Component {
      value: "",
      selectedKey: "0",
      declarationModalVisible: false,
-      startDate: moment(new Date()).format("YYYY-MM"),
-      endDate: moment(new Date()).format("YYYY-MM")
+      startDate: "",
+      endDate: ""
    }
    this.searchParams = {current: 1}
    columns.map(item => {
@ -44,30 +44,20 @@ export default class Declare extends React.Component {
    this.handleSearch()
  }

-  // 开始月份改变
-  handleStartDateChange(value) {
+  // 日期区间改变事件
+  handleRangePickerChange(value) {
+    let range = value.map(item => moment(item).format("YYYY-MM"))
+    const { declareStore : {getDeclareList} } = this.props;
    this.setState({
-      startDate: value
+      startDate: range[0],
+      endDate: range[1]
    })
-    const { declareStore } = this.props;
-    const { getDeclareList } = declareStore
    getDeclareList({
-      fromSalaryMonthStr: value,
-      endSalaryMonthStr: this.state.endDate
+      fromSalaryMonthStr: range[0],
+      endSalaryMonthStr: range[1]
    })
  }
-
-  // 结束月份改变
-  handleEndDateChange(value) {
-    this.setState({
-      endDate: value
-    })
-    const { declareStore } = this.props;
-    const { getDeclareList } = declareStore
-    this.searchParams.fromSalaryMonthStr = this.state.startDate
-    this.searchParams.endSalaryMonthStr = value
-    getDeclareList(this.searchParams)
-  }
+  

  // 查询列表
  handleSearch() {
@ -138,18 +128,10 @@ export default class Declare extends React.Component {

    const renderRightOperation = () => {
      return <div style={{display: "inline-block"}}>
-        <WeaDatePicker
-            format="yyyy-MM"
-            value={this.state.startDate}
-            onChange={value => this.handleStartDateChange(value)}
-        />
-        <span className="between"> 至 </span>
-        <WeaDatePicker
-            format="yyyy-MM"
-            value={this.state.endDate}
-            onChange={value => this.handleEndDateChange(value)}
-        />

+        <RangePicker picker="month" format="yyyy-MM" 
+          onChange={(value) => this.handleRangePickerChange(value)}
+        />
        <Button type="primary" style={{marginLeft: "10px"}} onClick={() => {
          this.setState({declarationModalVisible: true})
        }}>生成申报单</Button>
--- a/pc4mobx/hrmSalary/pages/ledger/step3/canMoveItem.js
+++ b/pc4mobx/hrmSalary/pages/ledger/step3/canMoveItem.js
@ -1,5 +1,6 @@
 import React from 'react'
 import { Icon, Table, message, Modal } from 'antd'
+import { WeaTable } from 'ecCom'
 import { slideStep3Columns } from '../columns'
 import AddSalaryItemModal from './AddSalaryItemModal'
 import { inject, observer } from 'mobx-react';
--- a/pc4mobx/hrmSalary/pages/payroll/index.js
+++ b/pc4mobx/hrmSalary/pages/payroll/index.js
@ -6,7 +6,6 @@ import { Button, Table, DatePicker, message, Modal } from 'antd';
 import moment from 'moment'

 import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaTable,WeaDatePicker, WeaHelpfulTip, WeaSelect, WeaInputSearch, WeaSlideModal } from 'ecCom';
-
 import { renderNoright, getSearchs } from '../../util'; // 渲染form数据的方法：因为多个页面都会使用，所以抽的公共方法在util中
 import CustomTab from '../../components/customTab';
 import ContentWrapper from '../../components/contentWrapper';
@ -22,7 +21,7 @@ import { notNull } from '../../util/validate';
 import CopyModal from './copyModal';
 import SalarySendList from './SalarySendList'

-const { MonthPicker } = DatePicker;
+const { RangePicker } = DatePicker;

@inject('payrollStore')
@observer
@ -32,8 +31,6 @@ export default class Payroll extends React.Component {
    this.state = {
      value: "",
      selectedKey: "0",
-      startDate: "",
-      endDate: "",
      currentStep: 0,
      stepSlideVisible: false,
      selectedTab: 0,
@ -177,41 +174,14 @@ export default class Payroll extends React.Component {
    });
  }

-  // 开始日期修改
-  handleStartDateChange(value) {
-    this.setState({
-      startDate: value
-    })

-    const { payrollStore } = this.props;
-    const { getPayrollList } = payrollStore;
-    let salaryYearMonth = []
-    if(value != "") {
-      salaryYearMonth.push(value)
-    }
-    if(this.state.endDate != "") {
-      salaryYearMonth.push(this.state.endDate);
-    }
-    getPayrollList({salaryYearMonth})

-  } 
-
-  // 结束日期修改
-  handleEndDateChange(value) {
-    this.setState({endDate: value})
-    const { payrollStore } = this.props;
-    const { getPayrollList } = payrollStore;
-    let salaryYearMonth = []
-    if(this.state.startDate != "") {
-      salaryYearMonth.push(this.state.startDate)
-    }
-    if(value != "") {
-      salaryYearMonth.push(value)
-    }
-    getPayrollList({salaryYearMonth})
+  handleRangePickerChange(value) {
+    let range = value.map(item => moment(item).format("YYYY-MM"))
+    const { payrollStore: { getPayrollList } } = this.props;
+    getPayrollList({salaryYearMonth: range})
  }

-
  // 预览
  handlePreview() {
    window.open("/spa/hrmSalary/static/index.html#/main/hrmSalary/templatePreview")
@ -265,16 +235,8 @@ export default class Payroll extends React.Component {
            placement="topLeft"
          />
          <div style={{display: "inline-block", marginLeft: "10px"}}>
-            <WeaDatePicker
-                format="yyyy-MM"
-                value={this.state.startDate}
-                onChange={value => this.handleStartDateChange(value)}
-            />
-            <span className="between"> 至 </span>
-            <WeaDatePicker
-                format="yyyy-MM"
-                value={this.state.endDate}
-                onChange={value => this.handleEndDateChange(value)}
+            <RangePicker picker="month" format="yyyy-MM" 
+              onChange={(value) => this.handleRangePickerChange(value)}
            />
          </div>
        </div>