feature/2.19.1.2501.01-移动端查看工资单密码设置

pc4mobx/hrmSalary/pages/mobilePayroll/conditions.js

@@ -0,0 +1,21 @@
+export const secondaryVerifyConditions = [
+  {
+    items: [
+      {
+        conditionType: "INPUT",
+        domkey: ["authCode"],
+        fieldcol: 14,
+        label: "二次验证密码",
+        labelcol: 10,
+        value: "",
+        otherParams: {
+          type: "password"
+        },
+        rules: "required|string",
+        viewAttr: 3
+      }
+    ],
+    title: "",
+    defaultshow: true
+  }
+];

pc4mobx/hrmSalary/pages/mobilePayroll/index.js

@@ -17,6 +17,7 @@ import Content from "../../components/pcTemplate/content";
 import MobileTemplate from "../../components/mobileTemplate";
 import "../mySalary/index.less";
 import MobileModal from "./mobileModal";
+import SecondaryVerify from "./secondaryVerify";
 
 const getLabel = WeaLocaleProvider.getLabel;
 
@@ -84,7 +85,11 @@ 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);
+              ReactDom.render(
+                <MobileModal title={getLabel(111, "身份验证")} onConfirm={() => message.error("请输入密码")}>
+                  <SecondaryVerify/>
+                </MobileModal>,
+                document.body);
               return;
               this.setState({ visible: true }, () => {
                 API.getSecondAuthForm({ mouldCode: "HRM", itemCode: "SALARY" }, this.state.salaryBillToken)

pc4mobx/hrmSalary/pages/mobilePayroll/index.less

@@ -51,10 +51,6 @@
   background-color: rgba(0, 0, 0, .4);
 }
 
-.am-modal {
-  position: relative;
-}
-
 .am-modal-transparent {
   width: 270px;
 }
@@ -74,19 +70,103 @@
   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);
+.am-modal-header {
+  padding: 15px;
+}
+
+.am-modal-title {
+  margin: 0;
+  letter-spacing: -.1px;
+  color: #333;
+  font-size: 14px;
+  line-height: 20px;
+  text-align: center;
+  height: auto;
+  max-height: 150px;
+  overflow-y: auto;
+}
+
+.am-modal-body {
+  font-size: 14px;
+  color: #868686;
+  height: 100%;
+  line-height: 1.5;
+  overflow: auto;
+  padding: 0 15px 15px;
+
+  .wea-search-group, .wea-content, .wea-form-cell {
+    padding: 0;
+  }
+}
+
+.am-modal {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 1000;
+}
+
+.am-modal-wrap {
+  height: 100vh;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  //position: fixed;
+  //overflow: auto;
+  //top: 0;
+  //right: 0;
+  //bottom: 0;
+  //left: 0;
+  //height: 100%;
+  //z-index: 999;
+  //-webkit-overflow-scrolling: touch;
+  //outline: 0;
+  //display: -webkit-box;
+  //display: -webkit-flex;
+  //display: -ms-flexbox;
+  //display: flex;
+  //-webkit-box-align: center;
+  //-webkit-align-items: center;
+  //-ms-flex-align: center;
+  //align-items: center;
+  //-webkit-box-pack: center;
+  //-webkit-justify-content: center;
+  //-ms-flex-pack: center;
+  //justify-content: center;
+  //-webkit-transform: translateZ(1px);
+  //transform: translateZ(1px);
+}
+
+.am-modal-button-group-h {
+  position: relative;
+  border-top: 1px solid #ddd;
+  display: flex;
+}
+
+.am-modal-button-group-h .am-modal-button {
+  -webkit-touch-callout: none;
+  flex: 1 1;
+  box-sizing: border-box;
+  text-align: center;
+  text-decoration: none;
+  outline: none;
+  color: #55b1f9;
+  height: 50px;
+  line-height: 50px;
+  display: block;
+  width: auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: 14px;
+}
+
+.am-modal-button-group-h .am-modal-button:first-child {
+  color: #333;
+}
+
+.am-modal-button-group-h .am-modal-button:last-child {
+  position: relative;
+  border-left: 1px solid #ddd;
 }

pc4mobx/hrmSalary/pages/mobilePayroll/mobileModal.js

@@ -9,6 +9,7 @@
 */
 import React, { Component } from "react";
 import { WeaLocaleProvider } from "ecCom";
+import { removeElementById } from "../../util";
 import "./index.less";
 
 const getLabel = WeaLocaleProvider.getLabel;
@@ -17,11 +18,24 @@ class MobileModal extends Component {
   render() {
     return (
       <div id="am-modal-container">
-        <div>
+        <div style={{overflow: "hidden"}}>
           <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 className="am-modal-content">
+                <div className="am-modal-header">
+                  <div className="am-modal-title">{this.props.title}</div>
+                </div>
+                <div className="am-modal-body">{this.props.children}</div>
+                <div className="am-modal-footer">
+                  <div className="am-modal-button-group-h">
+                    <a href="javascript:void(0);" className="am-modal-button"
+                       onClick={() => removeElementById("am-modal-container")}>{getLabel(111, "取消")}</a>
+                    <a href="javascript:void(0);" className="am-modal-button"
+                       onClick={this.props.onConfirm}>{getLabel(111, "确定")}</a>
+                  </div>
+                </div>
+              </div>
             </div>
           </div>
         </div>

pc4mobx/hrmSalary/pages/mobilePayroll/secondaryVerify.js

@@ -0,0 +1,30 @@
+/*
+  * 二次验证密码
+  *
+  * @Author:    黎永顺
+  * @Date:      2025/4/16
+  * @Wechat:
+  * @Email:     971387674@qq.com
+  * @description:
+*/
+import React, { Component } from "react";
+import { WeaLocaleProvider } from "ecCom";
+import { WeaForm } from "comsMobx";
+import FormInfo from "../../components/FormInfo";
+import { secondaryVerifyConditions } from "./conditions";
+
+const form = new WeaForm();
+const getLabel = WeaLocaleProvider.getLabel;
+
+class SecondaryVerify extends Component {
+  componentDidMount() {
+    form.initFormFields(secondaryVerifyConditions);
+  }
+
+  render() {
+    const itemRender = {};
+    return (<FormInfo center={false} itemRender={itemRender} form={form} formFields={secondaryVerifyConditions}/>);
+  }
+}
+
+export default SecondaryVerify;

pc4mobx/hrmSalary/util/index.js

@@ -143,3 +143,7 @@ export const getIframeParentHeight = (selector, total, extraHeight) => {
   }
   return height;
 };
+export const removeElementById = (id) => {
+  const element = document.getElementById(id);
+  if (element) element.remove();
+};