add /member/login service; beautify member page with name&avatar

mock/api.ts

@@ -65,7 +65,10 @@ export default {
   'POST /member/login': {
     success: true,
     data: {
-      isMember: true,
+      avatar:
+        'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png',
+      name: '宇航员',
+      phone: '13311451419',
     },
   },
   'GET /tickets/uncompleted': {

src/pages/member/MemberTitleCard.tsx

@@ -1,23 +1,23 @@
 import React from 'react';
 import { View, Image } from '@tarojs/components';
 import pt from '@/plain-text';
-import logo from '@/assets/images/UserPage/logo.png';
+import wechatUser from '@/wechat';
 
 export default class MemberTitleCard extends React.Component {
   render(): React.ReactNode {
     const memberPage = pt.get().memberPage;
     return (
-      <View className='at-row at-row__align--center'>
+      <View className='at-row at-row__align--end'>
         <View className='at-col at-col-1 at-col--auto'>
           <Image
-            style='width: 100rpx; height: 100rpx; margin-left: 30rpx;'
-            src={logo}
+            style='width: 150rpx; height: 150rpx; margin-left: 60rpx;'
+            src={wechatUser.getInfo().avatar}
             mode='aspectFit'
           />
         </View>
-        <View className='page-title'>
+        <View className='page-title' style={{ marginLeft: '30rpx' }}>
           <View className='at-article__h1' style={{ fontWeight: 'bold' }}>
-            {memberPage.mainTitleLine}
+            {memberPage.mainTitleLine + wechatUser.getInfo().name}
           </View>
           <View className='at-article__h2'>{memberPage.subTitleLine}</View>
         </View>

src/plain-text/Button.ts

@@ -13,6 +13,7 @@ export interface ButtonText {
   loginText: {
     success: string;
     error: string;
+    fail: string;
   };
   logoutText: {
     success: string;
@@ -35,6 +36,7 @@ export const buttonZhCn: ButtonText = {
   loginText: {
     success: '登录成功',
     error: '登录失败',
+    fail: '请检查用户名或密码！',
   },
   logoutText: {
     success: '登出成功',
@@ -57,6 +59,7 @@ export const buttonEnUs: ButtonText = {
   loginText: {
     success: 'Login Success',
     error: 'Login Failed',
+    fail: 'Please check username or password!',
   },
   logoutText: {
     success: 'Logout Success',

src/plain-text/MemberPage.ts

@@ -38,7 +38,7 @@ export interface MemberPageText {
 }
 
 export const memberPageZhCn: MemberPageText = {
-  mainTitleLine: '您好，这里是E志者协会',
+  mainTitleLine: '您好，',
   subTitleLine: '祝你满绩每一天',
   dutyCount: {
     button: '更新值班人数',
@@ -100,7 +100,7 @@ export const memberPageZhCn: MemberPageText = {
 };
 
 export const memberPageEnUs: MemberPageText = {
-  mainTitleLine: 'Hi! This is EVA.',
+  mainTitleLine: 'Hi! ',
   subTitleLine: 'Have a great day!',
   dutyCount: {
     button: 'Update Duty Count',

src/service/memberLogin.ts

@@ -1,7 +1,7 @@
 import UserMemberPage from '@/pages/user/member/member';
 import Taro from '@tarojs/taro';
 import pt from '@/plain-text';
-import wechatUser from '@/wechat';
+import wechatUser, { UserInfo } from '@/wechat';
 import { getUrl } from '.';
 
 export function memberLogin(that: UserMemberPage) {
@@ -22,14 +22,22 @@ export function memberLogin(that: UserMemberPage) {
       that.setState({
         isLoading: false,
       });
-      Taro.atMessage({
-        message: pt.get().button.loginText.success,
-        type: 'success',
-      });
-      wechatUser.setAccess(true);
-      Taro.reLaunch({
-        url: '/pages/member/member',
-      });
+      if (res.data.success) {
+        Taro.atMessage({
+          message: pt.get().button.loginText.success,
+          type: 'success',
+        });
+        wechatUser.setInfo(res.data.data as UserInfo);
+        wechatUser.setAccess(true);
+        Taro.reLaunch({
+          url: '/pages/member/member',
+        });
+      } else {
+        Taro.atMessage({
+          message: pt.get().button.loginText.fail,
+          type: 'error',
+        });
+      }
     })
     .catch((err) => {
       console.log(err);

src/wechat/index.ts

@@ -1,11 +1,20 @@
+export interface UserInfo {
+  name: string;
+  phone: string;
+  avatar: string;
+}
+
 class WechatUser {
-  private userInfo: any;
+  private userInfo: UserInfo;
   private isMember: boolean;
-  hasUserInfo: boolean;
 
   constructor() {
-    this.userInfo = '';
-    this.hasUserInfo = false;
+    this.userInfo = {
+      name: '亦可',
+      phone: '12345678901',
+      avatar:
+        'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png',
+    };
     this.isMember = false;
   }
 
@@ -17,9 +26,8 @@ class WechatUser {
     return this.userInfo;
   }
 
-  setInfo(userInfo: any) {
+  setInfo(userInfo: UserInfo) {
     this.userInfo = userInfo;
-    this.hasUserInfo = true;
   }
 
   setAccess(isMember: boolean) {