fix

src/pages/user/login/index.tsx

@@ -1,7 +1,7 @@
 import { Button, message, Radio, Spin } from 'antd';
 import React, { useCallback, useEffect, useState } from 'react';
 import { useModel, useRequest } from 'umi';
-import { getCode, getDingKey, ddlogin, phoneLogin, getNoteCode } from '@/services/login';
+import { getCode, getDingKey, ddlogin, phoneLogin, getNoteCode, getEmailNoteCodeApi, emailLoginApi } from '@/services/login';
 import styles from './style.less';
 import { CopyrightOutlined, SwapRightOutlined } from '@ant-design/icons';
 import { useBase64 } from '@/Hook/useBase64';
@@ -19,18 +19,18 @@ const Login: React.FC<{}> = () => {
 	const { setInitialState, initialState } = useModel('@@initialState');
 	const codeRes = useRequest((phone) => getCode(phone), { manual: true, formatResult: (res: any) => res })//钉钉验证码
 	const noteCode = useRequest((phone) => getNoteCode(phone), { manual: true, formatResult: (res: any) => res })//短信验证码
-	const getKey = useRequest(() => getDingKey(), { manual: true, formatResult: (res: any) => res })//获取服务器KEY
+	const getEmailNoteCode = useRequest((phone) => getEmailNoteCodeApi(phone), { manual: true, formatResult: (res: any) => res })//短信验证码
 	const Ddlogin = useRequest((params: any) => ddlogin(params), { manual: true, formatResult: (res: any) => res })//用钉钉登录
 	const phone_login = useRequest((params: any) => phoneLogin(params), { manual: true, formatResult: (res: any) => res })//用手机登录
+	const emailLogin = useRequest((params: any) => emailLoginApi(params), { manual: true, formatResult: (res: any) => res })//用邮箱登录
 	let phone = decode('phone')
 	let code = decode('code')
 	const [values, setValues] = useState<{ phone: string, code: string }>({ phone: phone || '', code: code || '' })
+	const [emailData, setEmailData] = useState<{ email: string, code: string }>({ email: '', code: '' })
 	const [isLogin, setIsLogin] = useState<boolean>(false)
 	const [videoMenu, setVideoMenu] = useState<{ visible: boolean, left?: number, top?: number }>({ visible: false, left: 0, top: 0 })
 	const [show, setShow] = useState<boolean>(false)
 	const [tab, setTab] = useState<1 | 2>(1)
-	const [APPID,] = useState<string>('dingwfmhucedfluenpuj')//测试 dingdsfuoevmawlyyrjx 线上dingwfmhucedfluenpuj
-	const [REDIRECT_URI,] = useState<string>(encodeURIComponent(location.href?.split('?')[0]))
 	const [companyList, setCompanyList] = useState<any[]>([])
 	const [loading, setLoading] = useState<boolean>(false)
 	const [isMobile, setIsMobile] = useState<boolean>(false)
@@ -105,46 +105,10 @@ const Login: React.FC<{}> = () => {
 						}, 2000)
 					}
 				})
-			} else {
-				if (tab === 2) {
-					let state = ''
-					getKey.run().then((res) => {
-						if (res?.code === 200) {
-							let strArr = res?.data?.split('_')
-							sessionStorage.setItem('DDK', strArr[0])
-							state = strArr[1]
-						}
-					});
-					(window as any).DDLogin({
-						id: "login_container",
-						goto: encodeURIComponent(`https://oapi.dingtalk.com/connect/qrconnect?appid=${APPID}&response_type=code&scope=snsapi_login&state=STATE&redirect_uri=${REDIRECT_URI}`),
-						style: "border:none;padding:0 0 20px 0;background-color:rgba(255,255,255,0.7);",
-						width: "100%",
-						height: "400"
-					});
-					const handleMessage = (event: { data: any; origin: any; }) => {
-						// 获取loginTempCode
-						const loginTempCode = event.data;
-						// 获取消息来源
-						const origin = event.origin;
-						// 拼接 url
-						const url = `https://oapi.dingtalk.com/connect/oauth2/sns_authorize?appid=${APPID}&response_type=code&scope=snsapi_login&state=${encodeURIComponent(state)}&redirect_uri=${REDIRECT_URI}&loginTmpCode=${loginTempCode}`
-						// 如果来源为https://login.dingtalk.com，则在当前窗口打开回调链接
-						if (origin === 'https://login.dingtalk.com') {
-							window.open(encodeURI(url), '_parent')
-						}
-					}
-					// 监听iframe的消息
-					if (typeof window.addEventListener != 'undefined') {
-						window.addEventListener('message', handleMessage, false);
-					} else if (typeof (window as any).attachEvent != 'undefined') {
-						(window as any).attachEvent('onmessage', handleMessage);
-					}
-				}
 			}
 		}
 
-	}, [tab, localStorage.getItem('Admin-Token')])
+	}, [localStorage.getItem('Admin-Token')])
 	// 选择公司
 	const setCompanyHandle = (companyId: number) => {
 		setLoading(() => true)
@@ -217,6 +181,60 @@ const Login: React.FC<{}> = () => {
 			message.error('请输入正确的手机号！！！')
 		}
 	}
+
+	// 获取游戏验证码
+	const getEmailCode = () => {
+		const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
+		if (emailData?.email && !regex.test(emailData.email)) {
+			message.error('请输入正确的邮箱！！！')
+			return 
+		}
+		if (emailData) {
+			setM(30)
+			getEmailNoteCode.run(emailData?.email).then(res => {
+				if (res.code === 200) {
+					message.success('获取成功，请查看你的邮箱！验证码将以邮件的形式发送到您的邮箱！')
+					timeOut(30)
+				} else {
+					timeOut(0)
+				}
+			}).catch(() => timeOut(0))
+		} else {
+			message.error('请输入邮箱地址！！！')
+		}
+	}
+
+	// 邮箱登录
+	const emailSubmit = () => {
+		if (emailData?.code) {
+			emailLogin.run(emailData).then(res => {
+				try {
+					if (res.code === 200) {
+						setIsLogin(false)
+						localStorage.setItem('Admin-Token', res?.data?.token)
+						let companyInfo = res?.data?.companyRelationInfo?.filter((item: { companyId: number }) => item.companyId !== 4 && item.companyId !== 3)
+						if (companyInfo?.length === 0) {
+							localStorage.removeItem('Admin-Token')
+							message.error('登录失败，请用趣程运营平台账号登录')
+							return
+						} else if (companyInfo?.length === 1) {
+							setCompanyHandle(res?.data?.companyRelationInfo[0].companyId)
+						} else {
+							setCompanyList(companyInfo)
+						}
+						return;
+					} else {
+						setIsLogin(false)
+					}
+				} catch (error) {
+					setIsLogin(false)
+					message.error('登录失败，请重试！');
+				}
+			})
+		}
+	}
+	
+
 	// 倒计时
 	const timeOut = useCallback((num) => {
 		let timer: any = null
@@ -294,10 +312,10 @@ const Login: React.FC<{}> = () => {
 							</div> : <div className={`${styles.main}  ${isMobile ? '' : show ? '' : styles.login_hide}`}>
 								<h1>趣程集团IAA业务应用数据系统</h1>
 								{/*  (isMobile || location.origin === 'http://localhost:8000' || location.origin.includes('test')) */}
-								{/* {true && <div className={styles.tabs}>
+								<div className={styles.tabs}>
 									<span onClick={() => { setTab(1) }} style={tab === 1 ? { color: localStorage.getItem('color') || '#24DB95' } : {}}>手机</span>
-									<span onClick={() => { setTab(2) }} style={tab === 2 ? { color: localStorage.getItem('color') || '#24DB95' } : {}}>钉钉</span>
-								</div>} */}
+									<span onClick={() => { setTab(2) }} style={tab === 2 ? { color: localStorage.getItem('color') || '#24DB95' } : {}}>邮箱</span>
+								</div>
 
 								{
 									tab === 1 ? <>
@@ -350,7 +368,49 @@ const Login: React.FC<{}> = () => {
 											style={{ background: localStorage.getItem('color') || '#24DB95' }}
 										>登录</button>
 									</> :
-										<div id='login_container' />
+										<>
+											<div>
+												<input
+													placeholder='Email'
+													value={emailData?.email}
+													onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+														let value = e.target.value
+														if (value === '背景') {
+															setVideoMenu({ visible: true })
+														}
+														setEmailData({ ...values, email: value })
+													}}
+												/>
+											</div>
+											<div>
+												<input
+													placeholder='Code'
+													style={{ width: '60%' }}
+													onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+														let value = e.target.value
+														setEmailData({ ...emailData, code: value })
+													}}
+													onKeyUp={(event: React.KeyboardEvent<HTMLInputElement>) => {
+														if (event.key === 'Enter') {
+															phoneSubmit()
+														}
+													}}
+												/>
+												<button
+													className={styles.btn}
+													style={!m ? { background: localStorage.getItem('color') || '#24DB95' } : { background: '#999' }}
+													onClick={getEmailCode}
+													disabled={!!m}
+												>
+													{!m ? '获取验证码' : m + '秒再次获取'}
+												</button>
+											</div>
+											<button
+												onClick={emailSubmit}
+												disabled={isLogin}
+												style={{ background: localStorage.getItem('color') || '#24DB95' }}
+											>登录</button>
+										</>
 								}
 							</div>}
 						</div>

src/services/login.ts

@@ -66,14 +66,24 @@ export async function getCode(phone: string) {
 export async function getNoteCode(phone: string) {
   return request(api + `/erp/user/smsCodeLoginState/${phone}`)
 }
+// 邮箱code
+export async function getEmailNoteCodeApi(email: string) {
+  return request(api + `/erp/user/emailCodeLoginState/${email}`)
+}
 // 手机登录
 export async function phoneLogin(params: { phone: string, code: string }) {
-  console.log('------------>', params)
   return request(api + `/erp/user/dCodeLogin`, {
     method: 'POST',
     data: params
   })
 }
+// 邮箱登录
+export async function emailLoginApi(params: { email: string, code: string }) {
+  return request(api + `/erp/user/emailCodeLogin`, {
+    method: 'POST',
+    data: params
+  })
+}
 // 查询是否在更新
 export async function isPreserve() {
   return request(api + '/erp/config/sysVersion/preserve')