diff --git a/pc4mobx/hrmSalary/index.js b/pc4mobx/hrmSalary/index.js index 8351f046..52e80230 100644 --- a/pc4mobx/hrmSalary/index.js +++ b/pc4mobx/hrmSalary/index.js @@ -1,7 +1,7 @@ import React from "react"; import Route from "react-router/lib/Route"; import { WeaLocaleProvider } from "ecCom"; -// import MySalary from "./pages/mySalary"; +import MySalaryMobile from "./pages/mySalaryMobile"; import MySalary from "./pages/mySalaryBenefits"; import Programme from "./pages/socialSecurityBenefits/programme"; import Archives from "./pages/socialSecurityBenefits/archives"; @@ -72,6 +72,7 @@ const Home = (props) => props.children; const SocialSecurityBenefits = (props) => props.children; const DataAcquisition = (props) => props.children; +// mySalaryMobile 我的薪资福利-移动端 // mySalary 我的薪资福利 // mySalaryView 我的薪资福利-查看工资单 // socialSecurityBenefits 社保福利 @@ -118,6 +119,7 @@ const Routes = ( path="hrmSalary" onEnter={getLocaleLabel} component={Home}> + { + this.setState({ salaryYearMonth: { ...this.state.salaryYearMonth, year } }); + }; + handleChangeMonth = (month) => { + + this.setState({ salaryYearMonth: { ...this.state.salaryYearMonth, month: parseInt(month).toString() } }); + }; + handleCancel = () => { + this.setState({ visible: false }); + }; + handleConfirm = () => { + const { year, month } = this.state.salaryYearMonth; + this.setState({ visible: false }, () => { + this.props.onChange(moment(new Date(`${year}- ${month}`)).format("YYYY-MM")); + }); + }; + + render() { + const { value } = this.props; + const { visible } = this.state; + const [year, month] = value.split("-"); + return ( +
+ this.setState({ visible: true })}>{value} + + + + +
+ ); + } +} + +export default Index; +const YearFn = (lowEnd, highEnd) => { + let list = []; + for (let i = lowEnd; i <= highEnd; i++) { + list.push(i.toString()); + } + return list; +}; diff --git a/pc4mobx/hrmSalary/pages/mySalaryMobile/components/payrollList/index.js b/pc4mobx/hrmSalary/pages/mySalaryMobile/components/payrollList/index.js new file mode 100644 index 00000000..ae884bc6 --- /dev/null +++ b/pc4mobx/hrmSalary/pages/mySalaryMobile/components/payrollList/index.js @@ -0,0 +1,45 @@ +/* + * Author: 黎永顺 + * name: 我的薪资福利-移动端列表数据 + * Description: + * Date: 2023/11/13 + */ +import React, { Component } from "react"; +import { WeaLocaleProvider } from "ecCom"; +import moment from "moment"; + +const getLabel = WeaLocaleProvider.getLabel; + +class Index extends Component { + + render() { + const { dataSource, isMore, loading } = this.props; + return ( +
    + { + _.map(dataSource, it => { + return
  • +
    + {moment(it.salaryYearMonth).format("YYYY-MM")} + {`${getLabel(15323, "第")}${it.acctTimes}${getLabel(18929, "次")}`} +
    +
    + {getLabel(111, "发放时间")} + {moment(it.sendTime).format("YYYY-MM")} +
    + {`${getLabel(33564, "查看")}>`} +
    • ; + }) + } + { + loading &&
  • {getLabel(31230, "加载中")}
    • + } + { + !isMore &&
  • {getLabel(83553, "暂无数据")}
    • + } +
+ ); + } +} + +export default Index; diff --git a/pc4mobx/hrmSalary/pages/mySalaryMobile/index.js b/pc4mobx/hrmSalary/pages/mySalaryMobile/index.js new file mode 100644 index 00000000..e1fade72 --- /dev/null +++ b/pc4mobx/hrmSalary/pages/mySalaryMobile/index.js @@ -0,0 +1,101 @@ +/* + * Author: 黎永顺 + * name: 我的薪资福利-移动端列表 + * Description: + * Date: 2023/11/10 + */ +import React, { Component } from "react"; +import { WeaLocaleProvider, WeaTab } from "ecCom"; +import moment from "moment"; +import MobileDatePicker from "./components/mobileDatePicker"; +import PayrollList from "./components/payrollList"; +import { mySalaryBillList } from "../../apis/mySalaryBenefits"; +import "./index.less"; + +const getLabel = WeaLocaleProvider.getLabel; + +class Index extends Component { + constructor(props) { + super(props); + this.state = { + dataSource: [], loading: false, pageInfo: { current: 1, pageSize: 10, total: 0 }, + salaryYearMonth: [moment().startOf("year").format("YYYY-MM"), moment().startOf("month").format("YYYY-MM")], + isMore: true //是否还有更多数据 + }; + } + + componentDidMount() { + this.getMySalaryBillList(); + const mySalaryMobile = document.getElementById("mySalaryMobile"); + mySalaryMobile.addEventListener("scroll", this.handleScroll, true); + } + + handleScroll = () => { + this.isTouchBottom(this.handleLoadMore); + }; + + componentWillUnmount() { + const mySalaryMobile = document.getElementById("mySalaryMobile"); + mySalaryMobile.removeEventListener("scroll", this.handleScroll, true); + } + + getMySalaryBillList = () => { + const { salaryYearMonth, pageInfo } = this.state; + this.setState({ loading: true }); + mySalaryBillList({ salaryYearMonth, ...pageInfo }).then(({ status, data }) => { + this.setState({ loading: false }); + if (status) { + const { datas: dataSource, pageInfo: pageResult } = data; + const { pageNum: current, pageSize, total } = pageResult; + this.setState({ + dataSource: [...this.state.dataSource, ...dataSource], + pageInfo: { ...pageInfo, current, pageSize, total } + }, () => this.setState({ isMore: this.state.dataSource.length < total })); + } + }).catch(() => this.setState({ loading: false })); + }; + handleLoadMore = () => { + // 为测试效果临时使用 message + const { pageInfo, isMore } = this.state; + if (!isMore) return; + const { current } = pageInfo; + this.setState({ + pageInfo: { ...pageInfo, current: current + 1 } + }, () => this.getMySalaryBillList()); + }; + isTouchBottom = (handler) => { + const div = document.getElementById("mySalaryMobile"); + if ((div.scrollHeight - div.scrollTop) === div.clientHeight) handler(); + }; + handleChange = (type, val) => { + const { salaryYearMonth } = this.state; + const [salaryStartYearMonth, salaryEndYearMonth] = salaryYearMonth; + this.setState({ + salaryYearMonth: type === "salaryStartYearMonth" ? [val, salaryEndYearMonth] : [salaryStartYearMonth, val] + }, () => this.getMySalaryBillList()); + }; + + render() { + const { salaryYearMonth, dataSource, isMore, loading } = this.state; + const [salaryStartYearMonth, salaryEndYearMonth] = salaryYearMonth; + return ( +
+
+ +
+
+ this.handleChange("salaryStartYearMonth", v)}/> + {getLabel(15322, "至")} + this.handleChange("salaryEndYearMonth", v)}/> +
+ +
+ ); + } +} + +export default Index; diff --git a/pc4mobx/hrmSalary/pages/mySalaryMobile/index.less b/pc4mobx/hrmSalary/pages/mySalaryMobile/index.less new file mode 100644 index 00000000..9dd4d275 --- /dev/null +++ b/pc4mobx/hrmSalary/pages/mySalaryMobile/index.less @@ -0,0 +1,117 @@ +.salary-mobile-list-wrapper { + height: 100%; + overflow-y: auto; + background: #f6f6f6; + position: relative; + + .salary-mobile-list-tab { + background: #fff; + position: fixed; + width: 100%; + } + + .wea-tab { + display: flex; + justify-content: center; + } + + .searchWrapper { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + padding: 10px 0; + background: #fff; + height: 40px; + position: fixed; + top: 47px; + + .to { + margin: 0 10px; + color: #999; + } + } + + .ui-picker-address { + .date { + color: #333; + } + + .ui-popup-title { + font-size: 12px !important; + } + + .ui-popup-content { + display: flex; + + .ui-picker-wrapper { + flex: 1; + + .ui-picker-item { + font-size: 12px !important; + } + } + } + } +} + +.payrollList-wrapper { + padding: 8px 0; + margin-top: 87px; + + li.empty, li.more { + text-align: center; + color: #999; + } + + li.item { + display: flex; + flex-direction: column; + border-radius: 5px; + background: #FFF; + margin: 0 8px 8px; + + .salaryMonth { + display: flex; + padding: 10px; + justify-content: space-between; + align-items: center; + border-bottom: 1px solid #e5e5e5; + + & > span:first-child { + color: #2db7f5; + font-size: 14px; + } + + & > span:last-child { + background: rgba(45, 183, 245, .1); + color: #2db7f5; + font-size: 12px; + display: inline-block; + padding: 4px; + transform: scale(.8); + } + } + + .sendTime { + padding: 10px; + + & > span:first-child { + color: #999; + margin-right: 80px; + } + + & > span:last-child { + color: #333; + } + } + + a { + color: #2db7f5; + display: inline-block; + width: 100%; + text-align: center; + padding-bottom: 10px; + } + } +} diff --git a/pc4mobx/hrmSalary/util/index.js b/pc4mobx/hrmSalary/util/index.js index 019743c0..884cee80 100644 --- a/pc4mobx/hrmSalary/util/index.js +++ b/pc4mobx/hrmSalary/util/index.js @@ -132,17 +132,10 @@ export const padding0 = (num, length) => { } return "0." + num; }; -export const toDecimal_n = (x, num) => { - if (isNaN(parseFloat(x))) return false; - let f = Math.round(x * Math.pow(10, num)) / Math.pow(10, num); - let s = f.toString(); - let rs = s.indexOf("."); - if (rs < 0) { - rs = s.length; - s += "."; - } - while (s.length <= rs + num) { - s += "0"; - } - return s; +export const toDecimal_n = (num, decimalPlaces) => { + if (num === null || !isFinite(num)) return null + if (decimalPlaces < 0) return null; + const multiplier = Math.pow(10, decimalPlaces); + const roundedNum = Math.round(num * multiplier) / multiplier; + return roundedNum.toFixed(decimalPlaces); };