登录

config/proxy.js

 /* eslint-disable */
 // const proxyURL = process.env.NODE_ENV !== 'production' ? 'http://192.168.10.150:8777' : window.location.origin;
-const proxyURL = 'https://panda-water.com';
+const proxyURL = 'http://192.168.10.156:8085';
 module.exports = {
   assetsRoot: process.env.NODE_ENV !== 'production' ? proxyURL : './',
   dev: {

src/index.ejs

@@ -12,7 +12,8 @@
 <!--    <link type="text/css" rel="stylesheet" id="theme-style" href="https://panda-water.cn/civbase/theme/sunset.css">-->
     <script src="//cdn-service.datav.aliyun.com/datav-static/2.37.6_4/libs/event.js"></script>
     <script crossorigin src="//g.alicdn.com/bone/libs/1.2.3/??isomorphic-fetch@2.js"></script>
-
+<script src="https://g.alicdn.com/dingding/dinglogin/0.0.5/ddLogin.js"></script>
+<script src="https://rescdn.qqmail.com/node/ww/wwopenmng/js/sso/wwLogin-1.0.0.js"></script>
     <script type="text/javascript">
       window.share = {
         event: new EventEmitter(),

src/pages/user/login/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 
 import BaseLogin from './template/baseLogin';
 import NewYear from './template/newYear';
-
+import InfoLogin from './template/infoLogin';
 /* eslint-disable */
 export default () => {
   const loginTemplate = window.globalConfig && window.globalConfig.loginTemplate;
@@ -12,6 +12,8 @@ export default () => {
     case 'Dark - IOTMultiLogin.html':
     case 'Dark.html':
       return <BaseLogin/>
+    case '信息化.html':
+      return <InfoLogin />
     default:
       return <BaseLogin/>;
   }

src/pages/user/login/login.js

@@ -48,6 +48,7 @@ class Login {
       self.getToweb(token);
       // eslint-disable-next-line no-empty
     } else if (ddCode) {
+      self.ddLoginIn(ddCode)
     } else if (!!loginName && !!password) {
       self.otherLoginIn(loginName, password);
     } else if (

src/pages/user/login/template/infoLogin.js

+/* eslint-disable */
+/*
+ * @Author: shangshunli;
+ * @Date: 2021-08-02 09:39:46;
+ * @LastEditTime: 2021-08-19 14:36:03
+ * @LastEditors: shangshunli
+ * @Description:信息化登录页;
+ */
+import React from 'react';
+import styles from './infoLogin.less'
+import { connect } from 'react-redux';
+import { withRouter } from 'react-router-dom';
+import Logo from '@/assets/oa/login/信息化logo.png'
+import Code from '@/assets/oa/login/扫码.png'
+import Web from '@/assets/oa/login/电脑.png'
+import TitleImg from '@/assets/oa/login/信息化panda图标.png'
+import MyHead from '@/assets/oa/login/我的.png'
+import PassWord from '@/assets/oa/login/密码.png'
+import Close from '@/assets/oa/login/close.png'
+import Open from '@/assets/oa/login/open.png'
+import Selected from '@/assets/oa/login/selected.jpg'
+import UnSelected from '@/assets/oa/login/unselected.jpg'
+import LoginAction from '../login';
+import { actionCreators } from '@/containers/App/store';
+const Logger = logger('login');
+// 、登录页
+class InfoLogin extends React.Component{
+  state={
+    loginStyle:false, //true  账号密码登录 false  扫码登录
+    isOpen:false,   //查看密码
+    isRember:false, //记住密码
+    ddOrWeixin:''
+  }
+  // 切换登录方式
+  changeloginStyle=()=>{
+    const {ddOrWeixin}=this.state
+    this.setState({
+      loginStyle:!this.state.loginStyle,
+      ddOrWeixin:ddOrWeixin== 'dingding' ? '':'dingding'
+    },()=>{
+      let action=new LoginAction(this.props,false,true)
+      action.loginByDD()
+    })
+  }
+// 切换二维码
+changeQrCode=(item)=>{
+  this.setState({
+    ddOrWeixin:item
+  },()=>{
+    if(item=='dingding'){
+      let action=new LoginAction(this.props,false,true)
+      action.loginByDD()
+    }else if(item=='weixin'){
+      this.loginByWeiXin()
+     
+    }
+  })
+}
+// 企业微信登录
+loginByWeiXin=()=>{
+  window.WwLogin({
+    "id": "wxlogin_container",
+    "appid": "wxec56ca668e7f9155",
+    "agentid": "1000083",
+    "redirect_uri": encodeURIComponent('http://172.16.30.77:8085'),
+    "href": "https://mis.panda-water.cn/web4/styles/wx.css"
+})
+}
+  // 查看密码
+  seePassWord=(e)=>{
+    this.setState({
+      isOpen:!this.state.isOpen
+    })
+  }
+  // 记住密码
+  remberWord=()=>{
+    this.setState({
+      isRember:!this.state.isRember
+    })
+  }
+  // 输入框变化
+  handleForm=(e)=>{
+    const target=e.target
+    // 判断事件类型，如果是checkbox返回checked值，不是返回文本框的value值
+        const value=target.type=='checkbox'?target.checked:target.value;
+    // 获取文本框的name值
+        const name=target.name
+        this.setState({
+          [name]:value
+        })
+  }
+  // 登录
+  loginToWeb5=()=>{
+    const {loginName,passWord,isRember}=this.state
+    let action=new LoginAction(this.props,false,true)
+    action.globalConfig = this.props.global;
+    action.loginHandler(loginName,passWord,null,isRember,false)
+    
+   this.props.updateCurrentIndex && this.props.updateCurrentIndex(-1);
+   action && action.events.on('loginSuccess', event => {
+     this.props.updateCurrentIndex && this.props.updateCurrentIndex(0);
+     this.props.history.push(`/?client=${this.props.global.client}`);
+     window.share.event.emit('triggerMicro', this.props.global);
+   });
+   action && action.events.on('loginError', event => {
+    
+   });
+   action && action.events.on('loginVisible', status => {
+     
+   });
+  }
+  render(){
+    const {loginStyle,isOpen,isRember,loginName,passWord,ddOrWeixin}=this.state
+    return(
+       <div className={styles.InfoBg}>
+         <div className={styles.loginBg}>
+           {/* 标题 */}
+          <span className={styles.title}>
+            <img  src={Logo} alt=""/>
+            {this.props.global.title}
+          </span>
+      {/* 登录切换 */}
+          <img role="ddCode" className={styles.ddCode} title={loginStyle?'账号密码登录':'扫码登录'} src={loginStyle?Web:Code} alt="gis" onClick={()=>this.changeloginStyle()}/>
+          <img role="logo" src={TitleImg} alt="gis" className={styles.titleImg} />
+          {/* 登录主题 */}
+          <div className={styles.login_container} id='login_container' style={{display:ddOrWeixin=='dingding'? '' :'none'}}></div>
+          <div className={styles.wxlogin_container} id='wxlogin_container' style={{display:ddOrWeixin=='weixin'? '' :'none'}}></div>
+          <div  className={styles.changeCode} style={{display:ddOrWeixin? '' :'none'}}>
+              <div style={{margin:'10px',cursor:'pointer',color:ddOrWeixin=='dingding'?'#25bc9e':''}} onClick={()=>this.changeQrCode('dingding')}  className={styles.ddLoginBtn}>钉钉登录</div>
+              <div  style={{margin:'10px',cursor:'pointer',color:ddOrWeixin=='weixin'?'#25bc9e':''}} onClick={()=>this.changeQrCode('weixin')}  className={styles.wxLoginBtn}>企业微信登录</div>
+          </div>
+          <form className={styles.loginForm} style={{display:loginStyle? 'none' :''}}>
+            <div className={styles.formgroup}>
+                <img src={MyHead} alt="" />
+                <input type="text" className={styles.inputLg} id='loginName' name='loginName' value={loginName} onChange={this.handleForm}  placeholder="请输入你的用户名"/>
+            </div>
+            <div className={styles.formgroup}>
+                <img src={PassWord} alt="" />
+                <input type={isOpen ? 'text':"password"} className={styles.inputLg} id='passWord' name='passWord' value={passWord} onChange={this.handleForm}  placeholder="请输入你的密码"  />
+                <img  className={styles.eyes} src={isOpen ? Open :Close} alt="" onMouseDown={(e)=>this.seePassWord(e)} onMouseUp={(e)=>this.seePassWord(e)}/>
+            </div>
+            <div className={styles.formgroup} style={{position: 'relative',marginTop:'20px'}}>
+              <img src={isRember ? Selected:UnSelected} alt="" onClick={()=>this.remberWord()} style={{width:'25px',height:'24px'}}/>
+              <span style={{color: '#9FA8B3',marginLeft: '35px',fontSize: '14px'}}>下次自动登录</span>
+            </div>
+            <div className={styles.submitBtn} onClick={this.loginToWeb5}>登录</div>
+          </form>
+         </div>
+       </div>
+
+    )
+  }
+}
+const mapStateToProps = state => ({
+  global: state.getIn(['global', 'globalConfig']),
+  loginMode: state.getIn(['global', 'loginMode']),
+});
+
+const mapDispatchToProps = dispatch => ({
+  updateConfig(config) {
+    dispatch(actionCreators.getConfig(config));
+  },
+  createContext(data) {
+    dispatch(actionCreators.createContext(data));
+  },
+  updateLoginMode(mode) {
+    dispatch(actionCreators.changeLoginMode(mode));
+  },
+  updateCurrentIndex(index) {
+    dispatch(actionCreators.updateCurrentIndex(index));
+  },
+});
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps,
+)(withRouter(InfoLogin));
+ 

src/pages/user/login/template/infoLogin.less

+
+.InfoBg{
+  width: 100%;
+  height: 100%;
+  background-image: url('../../../../assets/oa/login/oa背景.png');
+  background-size: cover;
+  background-repeat: no-repeat;
+  position: relative;
+  .loginBg{
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin-left: -550px;
+    margin-top: -275px;
+    width: 1100px;
+    height: 550px;
+    background-image: url('../../../../assets/oa/login/背景.png');
+    background-repeat: no-repeat;
+    background-position: center 0;
+    background-clip: border-box;
+    border-radius: 5px;
+    .title{
+          font-family: SourceHanSansCN-Medium;
+          font-weight: bold;
+          color: #43484D;
+          position: absolute;
+          top: 21px;
+          right: 50%;
+          margin-right: -285px;
+          line-height: 1;
+          width: 570px;
+          text-align: center;
+          overflow-wrap: break-word;
+          font-size: 24px;
+          img{
+            margin-right: 14px;
+          }
+    }
+    .ddCode{
+        position: absolute;
+        top: 50px;
+        right: -9px;
+        cursor: pointer;
+    }
+    .titleImg {
+      position: absolute;
+      top: 132px;
+      right: 133px;
+    }
+    .loginForm{
+      position: absolute;
+      right: 70px;
+      top: 249px;
+      width: 260px;
+      .formgroup{
+        // margin-bottom: 20px;
+        position: relative;
+        line-height: 1;
+        img{
+          position: absolute;
+          left: 10px;
+          top: 50%;
+        }
+        .eyes{
+          left: 89%;
+          margin-top: 10px;
+          cursor: pointer;
+        }
+        input[type="checkbox"] {
+          width: 12px;
+          height: 12px;
+        }
+        input {
+          font-size: 16px;
+          outline: 0;
+        }
+        span {
+          position: relative;
+          top: 10px;
+        }
+        .formControl{
+          display: block;
+          width: 100%;
+        }
+      .inputLg{
+        padding-left: 42px;
+        color: #2D3033;
+        border: none;
+        box-shadow: none;
+        border-bottom: 1px solid #D1DCEB;
+        border-radius: 0;
+        padding: 10px 50px;
+        line-height: 1.3333333;
+        margin-top: 21px;
+      } 
+      .inputLg:focus{
+        border-bottom: 1px solid #25bc9e;
+      }
+     
+      }
+      .submitBtn {
+        width: 100%;
+        background-color: #15CCB1 !important;
+        border: none !important;
+        color: #fff !important;
+        outline: none !important;
+        border-color: transparent !important;
+        border-radius: 20px;
+        height: 40px;
+        line-height: 40px;
+        font-size: 18px;
+        text-align: center;
+        margin-top: 25px;
+    }
+    }
+    .login_container {
+      position: absolute;
+      top: 59%;
+      left: 52%;
+      margin-left: 150px;
+      margin-top: -219px;
+      width: 400px;
+      height: 500px;
+  }
+  .wxlogin_container{
+    position: absolute;
+    top: 60%;
+    left: 55%;
+    margin-left: 150px;
+    margin-top: -219px;
+    width: 300px;
+    height: 300px;
+    background: #fff;
+  }
+  .changeCode {
+    position: absolute;
+    top: 80%;
+    left: 75%;
+    align-items: center;
+    font-size: 14px;
+    display: flex;
+}
+  }
+}
\ No newline at end of file