From 4480fc8e198746541da49bbd0b50e27733306c6c Mon Sep 17 00:00:00 2001 From: Limo Saplf Date: Sun, 1 Sep 2019 21:56:21 +0800 Subject: [PATCH] Login & Register --- src/components/AccountItem/index.tsx | 2 +- src/components/AccountItem/style.less | 3 ++ src/locales/en-US.ts | 12 +++++ src/locales/zh-CN.ts | 12 +++++ src/pages/check/index.tsx | 23 ++++++++-- src/pages/check/login.tsx | 2 +- src/pages/check/model.ts | 66 ++++++++++++++++++++++++--- src/pages/check/register.tsx | 61 +++++++++++++++++++++++-- src/pages/check/service.ts | 30 ++++++++++++ src/pages/check/style.less | 9 +++- src/services/common.ts | 7 ++- src/utils/http.ts | 27 +++++++++-- 12 files changed, 231 insertions(+), 23 deletions(-) diff --git a/src/components/AccountItem/index.tsx b/src/components/AccountItem/index.tsx index b89301d..5b400f8 100644 --- a/src/components/AccountItem/index.tsx +++ b/src/components/AccountItem/index.tsx @@ -26,7 +26,7 @@ const AccountItem: React.FC = ({
{titleText} {message} - {preview} + {preview && {preview}} {showGo && }
); diff --git a/src/components/AccountItem/style.less b/src/components/AccountItem/style.less index d055678..5883535 100644 --- a/src/components/AccountItem/style.less +++ b/src/components/AccountItem/style.less @@ -26,6 +26,9 @@ flex-basis: 0; margin: 0 10px; color: @primary-color; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .preview { diff --git a/src/locales/en-US.ts b/src/locales/en-US.ts index 09232de..2be23a8 100644 --- a/src/locales/en-US.ts +++ b/src/locales/en-US.ts @@ -8,6 +8,7 @@ export default { 'common.phoneHolder': 'Please input phone number', 'common.pwdHolder': 'Please input password', + 'common.codeHolder': '请输入验证码', 'common.next': 'Next', 'common.pullToRefresh': 'Pull to refresh', 'common.releaseToRefresh': 'Release to refresh', @@ -24,6 +25,17 @@ export default { 'check.msgArea': 'Please select area', 'check.msgPhone': 'Please input correct phone number', 'check.msgPwd': '请输入正确的密码', + 'check.msgCode': '请输入验证码', + 'check.msgConfirm': '两次输入密码不一致', + 'check.msgInviter': '请输入邀请码', + 'check.titleRegister': '新用户注册', + 'check.titleReset': '重置密码', + 'check.getCode1': '获取验证码', + 'check.getCode2': '{time}秒', + 'check.getCode3': '重新获取', + 'check.setPwd': '设置登录密码', + 'check.confirmPwd': '确认登录密码', + 'check.invite': '邀请码', 'home.tabHome': 'Home', 'home.tabEstate': '矿场', diff --git a/src/locales/zh-CN.ts b/src/locales/zh-CN.ts index c23c99d..3148618 100644 --- a/src/locales/zh-CN.ts +++ b/src/locales/zh-CN.ts @@ -8,6 +8,7 @@ export default { 'common.phoneHolder': '请输入手机号', 'common.pwdHolder': '请输入密码', + 'common.codeHolder': '请输入验证码', 'common.next': '下一步', 'common.pullToRefresh': '下拉刷新', 'common.releaseToRefresh': '释放以刷新', @@ -24,6 +25,17 @@ export default { 'check.msgArea': '请选择区号', 'check.msgPhone': '请输入正确的手机号', 'check.msgPwd': '请输入正确的密码', + 'check.msgCode': '请输入验证码', + 'check.msgConfirm': '两次输入密码不一致', + 'check.msgInviter': '请输入邀请码', + 'check.titleRegister': '新用户注册', + 'check.titleReset': '重置密码', + 'check.getCode1': '获取验证码', + 'check.getCode2': '{time} 秒后重新发送', + 'check.getCode3': '重新获取', + 'check.setPwd': '设置登录密码', + 'check.confirmPwd': '确认登录密码', + 'check.invite': '邀请码', 'home.tabHome': '首页', 'home.tabEstate': '矿场', diff --git a/src/pages/check/index.tsx b/src/pages/check/index.tsx index db3b6da..53afc9e 100644 --- a/src/pages/check/index.tsx +++ b/src/pages/check/index.tsx @@ -40,22 +40,35 @@ const Page: React.FC = ({ ); } + let title; + if (pageStep === PageStep.Register) { + title = formatMessage({ id: 'check.titleRegister' }); + } else if (pageStep === PageStep.Reset || pageStep === PageStep.ResetSuccess) { + title = formatMessage({ id: 'check.titleReset' }); + } + return (
{ pageStep !== PageStep.Check &&
dispatch({ type: 'check/back' })} /> } -
-
- + {( + pageStep === PageStep.Check || + pageStep === PageStep.Login + ) && ( +
+
+ +
+ {formatMessage({ id: 'app.name' })}
- {formatMessage({ id: 'app.name' })} -
+ )} {{ [PageStep.Check]: , diff --git a/src/pages/check/login.tsx b/src/pages/check/login.tsx index 8676180..d2617d8 100644 --- a/src/pages/check/login.tsx +++ b/src/pages/check/login.tsx @@ -21,7 +21,7 @@ const LoginPage: React.FC = ({ /> + + dispatch({ type: 'check/onUpdatePassword', payload: e.target.value })} size="large" type="password" /> + dispatch({ type: 'check/onUpdateState', pwdConfirm: e.target.value })} + size="large" + type="password" + /> + + dispatch({ type: 'check/onUpdateState', inviter: e.target.value })} + size="large" + /> + - +
); } diff --git a/src/pages/check/service.ts b/src/pages/check/service.ts index b54f39d..49f3232 100644 --- a/src/pages/check/service.ts +++ b/src/pages/check/service.ts @@ -28,3 +28,33 @@ export async function signIn(areacode: AreaCode, phone: string, password: string } return data.token; } + +export async function signUp(areacode: AreaCode, phone: string, password: string, code: string, inviter: string): Promise { + const { ok, msg, data } = await http.post( + '/sign/up', + { + phone: encodePhone(areacode, phone), + password, + inviter, + code, + }, + ); + if (!ok || !data || !data.token) { + throw Error(msg); + } + return data.token; +} + +export async function sendCode(areacode: AreaCode, phone: string) { + const { ok, msg } = await http.post( + '/sign/send', + { + phone: encodePhone(areacode, phone), + type: 'signUp', + }, + ); + if (ok) { + return true; + } + throw Error(msg); +} diff --git a/src/pages/check/style.less b/src/pages/check/style.less index 77b523a..45b94a4 100644 --- a/src/pages/check/style.less +++ b/src/pages/check/style.less @@ -11,7 +11,7 @@ width: auto; } - .ant-btn { + .submit { margin-top: 30px; } @@ -54,3 +54,10 @@ line-height: 30; line-height: 80vh; } + +.register { + height: 100%; + padding-top: 160px; + display: flex; + flex-direction: column; +} diff --git a/src/services/common.ts b/src/services/common.ts index 8031287..0626c88 100644 --- a/src/services/common.ts +++ b/src/services/common.ts @@ -14,6 +14,11 @@ export async function getAreaCodes(): Promise { const res = await http.get('/sign/code'); if (res.ok && res.data) { + res.data = res.data.map((it: any) => ({ + id: it.id || it.pode, + areacode: it.areacode || it.itc.match(/\d+/)[0], + areaname: it.areaname || it.name_native || it.name_en, + })); storeAreaCode(res.data); return res.data; } @@ -24,7 +29,7 @@ export async function getAreaCodes(): Promise { export async function getUserInfo(refresh = false): Promise { if (!refresh) { const userCache = loadUser() as User; - if (userCache) { + if (userCache && userCache.id) { return userCache; } } diff --git a/src/utils/http.ts b/src/utils/http.ts index 3fbd539..d7372c4 100644 --- a/src/utils/http.ts +++ b/src/utils/http.ts @@ -15,11 +15,29 @@ const successLabel = 'color:white;background-color:green;padding: 1px 2px'; const failureLabel = 'color:white;background-color:red;padding: 1px 2px'; const originLabel = 'color:unset;background-color:unset;padding:unset'; -const baseURL = 'http://yapi.faronear.org/mock/35'; +const baseURL = 'https://server.fiv.tacever.org/v1'; +// const baseURL = '//yapi.faronear.org/mock/20/v1'; const instance = axios.create({ baseURL, }); +function replaceId(obj: any) { + if (obj instanceof Array) { + obj.forEach(replaceId); + } else if (typeof obj === 'object') { + const id = obj['_id']; + if (id) { + delete obj['_id']; + obj.id = id; + } + _.entries(obj).forEach(([_, value]) => { + if (typeof value === 'object') { + replaceId(value); + } + }); + } +} + async function filter( method: keyof AxiosInstance, ...args: any[] @@ -29,13 +47,14 @@ async function filter( const { user } = globalState().user; if (user && user.token) { instance.defaults.headers = { - ...instance(instance.defaults.headers), - Authorization: user.token, + ...(instance.defaults.headers || {}), + token: user.token, }; } else { - instance.defaults.headers = _.omit(instance.defaults.headers, 'Authorization'); + instance.defaults.headers = _.omit(instance.defaults.headers, 'token'); } const { status, data } = await (instance[method] as (...args: any[]) => Promise>)(...args); + replaceId(data); ret = { ok: status >= 200 && status < 300 && data && data.code === 0, code: data && data.code,