From 55ccd8391642bf448d9b1a3557e7fe3fa27ee3cf Mon Sep 17 00:00:00 2001
From: lys <971387674@qq.com>
Date: Wed, 16 Apr 2025 16:22:51 +0800
Subject: [PATCH] =?UTF-8?q?feature/2.19.1.2501.01-=E7=A7=BB=E5=8A=A8?=
 =?UTF-8?q?=E7=AB=AF=E6=9F=A5=E7=9C=8B=E5=B7=A5=E8=B5=84=E5=8D=95=E5=AF=86?=
 =?UTF-8?q?=E7=A0=81=E8=AE=BE=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../hrmSalary/pages/mobilePayroll/index.js    | 15 ++++--
 .../hrmSalary/pages/mobilePayroll/index.less  | 51 +++++++++++++++++++
 .../pages/mobilePayroll/mobileModal.js        | 33 ++++++++++++
 3 files changed, 94 insertions(+), 5 deletions(-)
 create mode 100644 pc4mobx/hrmSalary/pages/mobilePayroll/mobileModal.js

diff --git a/pc4mobx/hrmSalary/pages/mobilePayroll/index.js b/pc4mobx/hrmSalary/pages/mobilePayroll/index.js
index 69d84928..38f53195 100644
--- a/pc4mobx/hrmSalary/pages/mobilePayroll/index.js
+++ b/pc4mobx/hrmSalary/pages/mobilePayroll/index.js
@@ -1,4 +1,5 @@
 import React from "react";
+import ReactDom from "react-dom";
 import { inject, observer } from "mobx-react";
 import { toJS } from "mobx";
 import { getQueryString } from "../../util/url";
@@ -15,6 +16,7 @@ import { ConfirmBtns } from "../mySalary/mySalaryView";
 import Content from "../../components/pcTemplate/content";
 import MobileTemplate from "../../components/mobileTemplate";
 import "../mySalary/index.less";
+import MobileModal from "./mobileModal";
 
 const getLabel = WeaLocaleProvider.getLabel;
 
@@ -82,6 +84,8 @@ export default class MobilePayroll extends React.Component {
         API.isNeedSecondPwdVerify({ mouldCode: "HRM", itemCode: "SALARY" }, this.state.salaryBillToken)
           .then(({ status, isNeedSecondAuth }) => {
             if (status && isNeedSecondAuth) {
+              ReactDom.render(<MobileModal/>, document.body);
+              return;
               this.setState({ visible: true }, () => {
                 API.getSecondAuthForm({ mouldCode: "HRM", itemCode: "SALARY" }, this.state.salaryBillToken)
                   .then(({ status, notSetting }) => {
@@ -205,6 +209,12 @@ export default class MobilePayroll extends React.Component {
         }
       </WeaDialog>
       <PassSetDialog form={pwdForm} visible={pwdSetVisible} onCancel={() => this.setState({ pwdSetVisible: false })}/>
+      {/*发送验证码*/}
+      <CaptchaModal
+        visible={captchaVisible} id={getQueryString("id")}
+        onCancel={() => this.setState({ captchaVisible: false })}
+        onConfirm={() => this.props.mySalaryStore.setInitEmVerify()}
+      />
     </div>;
     const {
       salaryTemplate, salaryGroups, employeeInformation,
@@ -243,11 +253,6 @@ export default class MobilePayroll extends React.Component {
               </div>
             </Authority>
         }
-        <CaptchaModal
-          visible={captchaVisible} id={getQueryString("id")}
-          onCancel={() => this.setState({ captchaVisible: false })}
-          onConfirm={() => this.props.mySalaryStore.setInitEmVerify()}
-        />
       </React.Fragment>
     );
   }
diff --git a/pc4mobx/hrmSalary/pages/mobilePayroll/index.less b/pc4mobx/hrmSalary/pages/mobilePayroll/index.less
index 923d3d82..8726d37e 100644
--- a/pc4mobx/hrmSalary/pages/mobilePayroll/index.less
+++ b/pc4mobx/hrmSalary/pages/mobilePayroll/index.less
@@ -39,3 +39,54 @@
     }
   }
 }
+
+.am-modal-mask {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  height: 100%;
+  z-index: 999;
+  background-color: rgba(0, 0, 0, .4);
+}
+
+.am-modal {
+  position: relative;
+}
+
+.am-modal-transparent {
+  width: 270px;
+}
+
+.am-modal-transparent .am-modal-content {
+  border-radius: 7px;
+  padding-top: 15px;
+}
+
+.am-modal-content {
+  position: relative;
+  background-color: #fff;
+  border: 0;
+  background-clip: padding-box;
+  text-align: center;
+  height: 100%;
+  overflow: hidden;
+}
+
+.am-modal-wrap {
+  position: fixed;
+  overflow: auto;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  height: 100%;
+  z-index: 999;
+  -webkit-overflow-scrolling: touch;
+  outline: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transform: translateZ(1px);
+}
diff --git a/pc4mobx/hrmSalary/pages/mobilePayroll/mobileModal.js b/pc4mobx/hrmSalary/pages/mobilePayroll/mobileModal.js
new file mode 100644
index 00000000..493cb63a
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/mobilePayroll/mobileModal.js
@@ -0,0 +1,33 @@
+/*
+  *  自定义移动端弹框组件
+  *
+  * @Author:    黎永顺
+  * @Date:      2025/4/16
+  * @Wechat:
+  * @Email:     971387674@qq.com
+  * @description:
+*/
+import React, { Component } from "react";
+import { WeaLocaleProvider } from "ecCom";
+import "./index.less";
+
+const getLabel = WeaLocaleProvider.getLabel;
+
+class MobileModal extends Component {
+  render() {
+    return (
+      <div id="am-modal-container">
+        <div>
+          <div className="am-modal-mask"></div>
+          <div className="am-modal-wrap">
+            <div className="am-modal am-modal-transparent">
+              <div className="am-modal-content">123</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default MobileModal;