feat: 修改威信登录页

src/pages/user/login/template/project/weixin/index.js

@@ -13,16 +13,14 @@ import { defaultApp } from '../../../../../../micro';
 import QRCode from 'qrcode.react';
 import classnames from 'classnames';
 import moment from 'moment';
-
-const renderQRCode = props => {
-    const qrcodes = props.qrcode.split('|') || [];
-    if (qrcodes.length > 0 && qrcodes[0]) {
-        let value = qrcodes[0].replace(/{ip}/gi, props.ip || window.location.host).split('=')[1];
-        return <QRCode value={value} />;
+const renderQRCode = () => {
+    const qrcodes = window.globalConfig && window.globalConfig.qrcode;
+    console.log('qrcodes', qrcodes)
+    if (qrcodes) {
+        return <div><QRCode value={qrcodes} /><p>扫码下载APP</p></div>;
     }
     return <span>手持APP下载未配置</span>;
 };
-
 const Login = forwardRef((props, _ref) => {
     const sliVerify = useRef();
     const loginFormRef = useRef();
@@ -159,6 +157,10 @@ const Login = forwardRef((props, _ref) => {
                         <div className={classnames(styles['inner-bg'], styles['login-part'])} ref={loginFormRef}>
                             {renderPlatform()}
                         </div>
+                        <div className={styles.WXqrcodeBox}>
+                            <p className={styles.WXimg}></p>
+                            <div className={styles.WXbigImg}>{renderQRCode()}</div>
+                        </div>
                     </div>
                 </div>
                 <div className={styles['login-header']}>

src/pages/user/login/template/project/weixin/index.less

@@ -127,6 +127,44 @@
     flex-flow: column;
     align-items: center;
     border-radius: 0 10px 10px 0;
+    position: relative;
+}
+
+.WXqrcodeBox {
+    position: absolute;
+    background: rgba(255, 255, 255, 0.5);
+    border-radius: 0px 5px 5px 0px;
+    padding: 7px;
+    bottom: 20px;
+    right: -36px;
+}
+
+.WXimg {
+    width: 22px;
+    height: 22px;
+    background: url('./images/8.png');
+    background-size: 100%;
+    background-repeat: no-repeat;
+    margin: 0;
+}
+
+.WXbigImg {
+    width: 128px;
+    height: 144px;
+    text-align: center;
+    display: none;
+}
+
+.WXqrcodeBox:hover {
+    right: -142px;
+}
+
+.WXqrcodeBox:hover .WXimg {
+    display: none;
+}
+
+.WXqrcodeBox:hover .WXbigImg {
+    display: block;
 }
 
 .welcome-title {