add member status judgement

mock/api.ts

@@ -50,10 +50,16 @@ export default {
     data: {},
   },
   'POST /member/login': {
-    data: {},
+    success: true,
+    data: {
+      isMember: true,
+    },
   },
   'GET /member/tickets/uncompleted': {
     success: true,
     data: uncompleted,
   },
+  'POST /member/logout': {
+    success: true,
+  },
 };

src/custom-tab-bar/index.tsx

@@ -6,65 +6,85 @@ import wechatUser from '@/wechat';
 import 'taro-ui/dist/style/index.scss';
 import './index.scss';
 
-const navList: Array<Taro.TabBarItem> = [
+const navList: () => Array<Taro.TabBarItem> = () => {
-  {
+  return wechatUser.getAccess()
-    pagePath: '/pages/index/index',
+    ? [
-    text: pt.get().tabBar.indexText,
+        {
-  },
+          pagePath: '/pages/index/index',
-  {
+          text: pt.get().tabBar.indexText,
-    pagePath: '/pages/repair/repair',
+        },
-    text: pt.get().tabBar.repairText,
+        {
-  },
+          pagePath: '/pages/repair/repair',
-  {
+          text: pt.get().tabBar.repairText,
-    pagePath: '/pages/member/member',
+        },
-    text: pt.get().tabBar.memberText,
+        {
-  },
+          pagePath: '/pages/member/member',
-  {
+          text: pt.get().tabBar.memberText,
-    pagePath: '/pages/user/user',
+        },
-    text: pt.get().tabBar.userText,
+        {
-  },
+          pagePath: '/pages/user/user',
-];
+          text: pt.get().tabBar.userText,
+        },
+      ]
+    : [
+        {
+          pagePath: '/pages/index/index',
+          text: pt.get().tabBar.indexText,
+        },
+        {
+          pagePath: '/pages/repair/repair',
+          text: pt.get().tabBar.repairText,
+        },
+        {
+          pagePath: '/pages/user/user',
+          text: pt.get().tabBar.userText,
+        },
+      ];
+};
+
+const tabList = () => {
+  return wechatUser.getAccess()
+    ? [
+        {
+          title: pt.get().tabBar.indexText,
+          iconType: 'home',
+        },
+        {
+          title: pt.get().tabBar.repairText,
+          iconType: 'settings',
+        },
+        {
+          title: pt.get().tabBar.memberText,
+          iconType: 'sketch',
+        },
+        {
+          title: pt.get().tabBar.userText,
+          iconType: 'user',
+        },
+      ]
+    : [
+        {
+          title: pt.get().tabBar.indexText,
+          iconType: 'home',
+        },
+        {
+          title: pt.get().tabBar.repairText,
+          iconType: 'settings',
+        },
+        {
+          title: pt.get().tabBar.userText,
+          iconType: 'user',
+        },
+      ];
+};
 
 export default class Index extends Component {
   state = {
     selected: 0,
-    tabList: wechatUser.getAccess()
-      ? [
-          {
-            title: pt.get().tabBar.indexText,
-            iconType: 'home',
-          },
-          {
-            title: pt.get().tabBar.repairText,
-            iconType: 'settings',
-          },
-          {
-            title: pt.get().tabBar.memberText,
-            iconType: 'sketch',
-          },
-          {
-            title: pt.get().tabBar.userText,
-            iconType: 'user',
-          },
-        ]
-      : [
-          {
-            title: pt.get().tabBar.indexText,
-            iconType: 'home',
-          },
-          {
-            title: pt.get().tabBar.repairText,
-            iconType: 'settings',
-          },
-          {
-            title: pt.get().tabBar.userText,
-            iconType: 'user',
-          },
-        ],
   };
 
   handleClick(idx: number) {
-    this.switchTab(idx, navList[idx].pagePath);
+    this.switchTab(idx, navList()[idx].pagePath);
   }
 
   switchTab(idx: number, url: string) {
@@ -82,7 +102,7 @@ export default class Index extends Component {
     return (
       <AtTabBar
         fixed
-        tabList={this.state.tabList}
+        tabList={tabList()}
         onClick={this.handleClick.bind(this)}
         current={this.state.selected}
       />

src/pages/user/member/member.tsx

@@ -1,13 +1,12 @@
 import { Component, ReactNode } from 'react';
 import { AtForm, AtInput, AtButton, AtMessage } from 'taro-ui';
-import { getUrl } from '@/service';
 import Taro from '@tarojs/taro';
 import pt from '@/plain-text';
+import { memberLogin, memberLogout } from '@/service/memberLogin';
+import wechatUser from '@/wechat';
 import './member.scss';
 
-const loginInterval = 5000;
+export default class UserMemberPage extends Component {
-
-export default class MemberPage extends Component {
   state = {
     stuid: '',
     passwd: '',
@@ -32,46 +31,15 @@ export default class MemberPage extends Component {
     return passwd;
   }
   onSubmit() {
-    this.setState({
+    memberLogin(this);
-      isLoading: true,
+  }
-      isDisable: true,
+
-    });
+  onLogout() {
-    console.log([this.state.stuid, this.state.passwd]);
+    memberLogout(this);
-    Taro.request({
-      url: getUrl('/member/login'),
-      method: 'POST',
-      data: {
-        token: 'token_test',
-        name: this.state.stuid,
-        passwd: this.state.passwd,
-      },
-    })
-      .then((res) => {
-        console.log(res.data);
-        Taro.atMessage({
-          message: pt.get().button.loginText.success,
-          type: 'success',
-        });
-      })
-      .catch((err) => {
-        console.log(err);
-        Taro.atMessage({
-          message: pt.get().button.loginText.error + err.toString(),
-          type: 'error',
-        });
-      });
-    this.setState({
-      isLoading: false,
-    });
-    setTimeout(() => {
-      this.setState({
-        isDisable: false,
-      });
-    }, loginInterval);
   }
 
   render(): ReactNode {
-    return (
+    return !wechatUser.getAccess() ? (
       <AtForm onSubmit={this.onSubmit.bind(this)}>
         <AtMessage />
         <AtInput
@@ -103,6 +71,10 @@ export default class MemberPage extends Component {
           {pt.get().button.buttonText.login}
         </AtButton>
       </AtForm>
+    ) : (
+      <AtButton type='primary' onClick={this.onLogout.bind(this)}>
+        {pt.get().button.buttonText.logout}
+      </AtButton>
     );
   }
 }

src/pages/user/user.tsx

@@ -24,14 +24,13 @@ export default class UserPage extends Component {
     clicks: memberClickTimes,
     isToastOpen: false,
     toastText: '',
-    haveAccess: wechatUser.getAccess(),
   };
 
   // 以下是TabBar相关
   pageCtx = Taro.getCurrentInstance().page;
   componentDidShow() {
     const tabbar = Taro.getTabBar<CustomTabBar>(this.pageCtx);
-    tabbar?.setSelected(this.state.haveAccess ? 3 : 2);
+    tabbar?.setSelected(wechatUser.getAccess() ? 3 : 2);
   }
   // 以上是TabBar相关
 

src/plain-text/Button.ts

@@ -3,6 +3,7 @@ export interface ButtonText {
     submit: string;
     reset: string;
     login: string;
+    logout: string;
   };
   submitText: {
     success: string;
@@ -12,6 +13,10 @@ export interface ButtonText {
     success: string;
     error: string;
   };
+  logoutText: {
+    success: string;
+    error: string;
+  };
 }
 
 export const buttonZhCn: ButtonText = {
@@ -19,6 +24,7 @@ export const buttonZhCn: ButtonText = {
     submit: '提交',
     reset: '清空',
     login: '登录',
+    logout: '登出',
   },
   submitText: {
     success: '提交成功',
@@ -28,6 +34,10 @@ export const buttonZhCn: ButtonText = {
     success: '登录成功',
     error: '登录失败',
   },
+  logoutText: {
+    success: '登出成功',
+    error: '登出失败',
+  },
 };
 
 export const buttonEnUs: ButtonText = {
@@ -35,6 +45,7 @@ export const buttonEnUs: ButtonText = {
     submit: 'Submit',
     reset: 'Reset',
     login: 'Login',
+    logout: 'Logout',
   },
   submitText: {
     success: 'Success',
@@ -44,4 +55,8 @@ export const buttonEnUs: ButtonText = {
     success: 'Login Success',
     error: 'Login Failed',
   },
+  logoutText: {
+    success: 'Logout Success',
+    error: 'Logout Failed',
+  },
 };

src/service/memberLogin.ts

@@ -0,0 +1,93 @@
+import UserMemberPage from '@/pages/user/member/member';
+import Taro from '@tarojs/taro';
+import pt from '@/plain-text';
+import wechatUser from '@/wechat';
+import { getUrl } from '.';
+
+const logInterval = 5000;
+
+export function memberLogin(that: UserMemberPage) {
+  that.setState({
+    isLoading: true,
+  });
+  Taro.request({
+    url: getUrl('/member/login'),
+    method: 'POST',
+    data: {
+      token: 'token_test',
+      name: that.state.stuid,
+      phone: that.state.passwd,
+    },
+  })
+    .then((res) => {
+      console.log(res.data);
+      that.setState({
+        isLoading: false,
+      });
+      Taro.atMessage({
+        message: pt.get().button.loginText.success,
+        type: 'success',
+      });
+      wechatUser.setAccess(true);
+      Taro.reLaunch({
+        url: '/pages/member/member',
+      });
+    })
+    .catch((err) => {
+      console.log(err);
+      that.setState({
+        isLoading: false,
+      });
+      Taro.atMessage({
+        message: pt.get().button.loginText.error + err.toString(),
+        type: 'error',
+      });
+      setTimeout(() => {
+        this.setState({
+          isDisable: false,
+        });
+      }, logInterval);
+    });
+}
+
+export function memberLogout(that: UserMemberPage) {
+  that.setState({
+    isLoading: true,
+  });
+  Taro.request({
+    url: getUrl('/member/logout'),
+    method: 'POST',
+    data: {
+      token: 'token_test',
+    },
+  })
+    .then((res) => {
+      console.log(res.data);
+      that.setState({
+        isLoading: false,
+      });
+      Taro.atMessage({
+        message: pt.get().button.logoutText.success,
+        type: 'success',
+      });
+      wechatUser.setAccess(false);
+      Taro.reLaunch({
+        url: '/pages/index/index',
+      });
+    })
+    .catch((err) => {
+      console.log(err);
+      that.setState({
+        isLoading: false,
+      });
+      Taro.atMessage({
+        message: pt.get().button.logoutText.error + err.toString(),
+        type: 'error',
+      });
+      setTimeout(() => {
+        this.setState({
+          isDisable: false,
+        });
+      }, logInterval);
+    });
+}

src/wechat/index.ts

@@ -6,7 +6,7 @@ class WechatUser {
   constructor() {
     this.userInfo = '';
     this.hasUserInfo = false;
-    this.isMember = true;
+    this.isMember = false;
   }
 
   getAccess() {