diff --git a/pc4mobx/hrmSalary/apis/payroll.js b/pc4mobx/hrmSalary/apis/payroll.js index eaf11a11..6440ff2a 100644 --- a/pc4mobx/hrmSalary/apis/payroll.js +++ b/pc4mobx/hrmSalary/apis/payroll.js @@ -367,3 +367,7 @@ export const getAvailableSalaryItemSet = (params) => { export const salaryBillSendSum = (params) => { return postFetch("/api/bs/hrmsalary/salaryBill/send/sum", params); }; +//工资单-验证方式 +export const payrollCheckType = params => { + return WeaTools.callApi("/api/bs/hrmsalary/salaryBill/payrollCheckType", "GET", params); +}; diff --git a/pc4mobx/hrmSalary/components/captchaModal/index.js b/pc4mobx/hrmSalary/components/captchaModal/index.js new file mode 100644 index 00000000..9098df54 --- /dev/null +++ b/pc4mobx/hrmSalary/components/captchaModal/index.js @@ -0,0 +1,82 @@ +/* + * Author: 黎永顺 + * name: 验证码弹框 + * Description: + * Date: 2023/6/16 + */ +import React, { Component } from "react"; +import { WeaDialog, WeaError, WeaFormItem, WeaInput, WeaLocaleProvider, WeaSearchGroup } from "ecCom"; +import { Button } from "antd"; +import "./index.less"; + +const { getLabel } = WeaLocaleProvider; + +class Index extends Component { + constructor(props) { + super(props); + this.state = { + captcha: "", + time: 60 + }; + this.timeRef = null; + } + + componentWillUnmount() { + clearInterval(this.timeRef); + } + + componentWillReceiveProps(nextProps, nextContext) { + if (nextProps.visible !== this.props.visible && !nextProps.visible) { + this.setState({ captcha: "" }); + } else { + clearInterval(this.timeRef); + this.setState({ time: 60 }); + } + } + + handleSendCaptcha = () => { + this.timeRef = setInterval(() => { + const { time } = this.state; + this.setState({ time: time - 1 }, () => { + if (this.state.time === -1) { + clearInterval(this.timeRef); + this.setState({ time: 60 }); + } + }); + }, 1000); + }; + + render() { + const { captcha, time } = this.state; + return ( + {getLabel(826, "确定")} + ]} + > + + + +
+ this.setState({ captcha })}/> + +
+
+
+
+
+ ); + } +} + +export default Index; diff --git a/pc4mobx/hrmSalary/components/captchaModal/index.less b/pc4mobx/hrmSalary/components/captchaModal/index.less new file mode 100644 index 00000000..4f8d23b7 --- /dev/null +++ b/pc4mobx/hrmSalary/components/captchaModal/index.less @@ -0,0 +1,29 @@ +.captchaWrapper { + .wea-dialog-body { + padding: 30px 20px; + + .wea-form-item-wrapper { + .wea-error { + width: 100%; + + .captchaInputBox { + display: flex; + align-items: center; + + .wea-input-normal { + flex: 1; + } + + button { + padding: 8px 10px; + border-radius: 0; + min-width: 80px; + text-align: center; + height: 30px; + line-height: 15px; + } + } + } + } + } +} diff --git a/pc4mobx/hrmSalary/pages/mySalary/index.js b/pc4mobx/hrmSalary/pages/mySalary/index.js index 6902836e..da92ac0f 100644 --- a/pc4mobx/hrmSalary/pages/mySalary/index.js +++ b/pc4mobx/hrmSalary/pages/mySalary/index.js @@ -2,12 +2,14 @@ import React from "react"; import { inject, observer } from "mobx-react"; import { DatePicker } from "antd"; import { WeaNewScroll, WeaTop } from "ecCom"; -import { renderNoright } from "../../util"; // 渲染form数据的方法:因为多个页面都会使用,所以抽的公共方法在util中 +import { renderNoright } from "../../util"; import CustomTab from "../../components/customTab"; import moment from "moment"; import PayrollModal from "./payrollModal"; import Authority from "./authority"; import CustomPaginationTable from "../../components/customPaginationTable"; +import CaptchaModal from "../../components/captchaModal"; +import { payrollCheckType } from "../../apis/payroll"; import "./index.less"; const { RangePicker } = DatePicker; @@ -22,15 +24,19 @@ export default class MySalary extends React.Component { selectedKey: "0", salaryBillVisible: false, salaryInfoId: "", - salaryRange: [moment().startOf("year").format("YYYY-MM"), moment().format("YYYY-MM")] + salaryRange: [moment().startOf("year").format("YYYY-MM"), moment().format("YYYY-MM")], + captchaVisible: false }; this.pageInfo = { current: 1, pageSize: 10 }; this.historyPageInfo = { current: 1, pageSize: 10 }; } - componentWillMount() { + async componentWillMount() { const { mySalaryStore: { init } } = this.props; - init(); + const data = await payrollCheckType(); + console.log(data); + this.setState({ captchaVisible: true }); + // init(); } // 查看工资单 @@ -113,7 +119,7 @@ export default class MySalary extends React.Component { recordListPageInfo, myBillPageInfo } = mySalaryStore; - const { salaryBillVisible, salaryInfoId, salaryRange } = this.state; + const { salaryBillVisible, salaryInfoId, salaryRange, captchaVisible } = this.state; if (!hasRight && !loading) return renderNoright(); const topTab = [ @@ -210,6 +216,7 @@ export default class MySalary extends React.Component { }} /> } + this.setState({ captchaVisible: false })}/> ); }