classroom-app/src/views/student-register/layout/auth.tsx

import { defineComponent } from 'vue';
import styles from './index.module.less';
import { state, setLogin, setLogout, setLoginError } from '@/state';
import { useStudentRegisterStore } from '@/store/modules/student-register-store';
import { RouterView } from 'vue-router';
import { storage } from '@/helpers/storage';
import { ACCESS_TOKEN } from '@/store/mutation-types';
import OEmpty from '@/components/m-empty';
import request from '@/helpers/request';

export default defineComponent({
  name: 'Auth-loayout',
  data() {
    return {
      loading: false as boolean
    };
  },
  computed: {
    isExternal() {
      // 该路由在外部连接打开是否需要登录
      // 只判断是否在学员端打开
      return this.$route.meta.isExternal || false;
    },
    isNeedView() {
      return (
        state.user.status === 'login' ||
        this.$route.path === '/student-register' ||
        (this as any).isExternal
      );
    }
  },
  mounted() {
    !this.isExternal && this.setAuth();
  },
  methods: {
    async setAuth() {
      const { query } = this.$route;
      const token = query.userInfo || query.Authorization;
      if (token) {
        storage.set(ACCESS_TOKEN, token);
      }
      if (this.loading) {
        return;
      }
      if (state.user.status === 'init' || state.user.status === 'error') {
        this.loading = true;
        try {
          const res = await request.get('/edu-app/user/getUserInfo', {
            initRequest: true, // 初始化接口
            requestType: 'form'
          });
          setLogin(res.data);
        } catch (e: any) {
          const message = e.message;
          if (
            message.indexOf('5000') === -1 &&
            message.indexOf('authentication') === -1
          ) {
            setLoginError();
          } else {
            setLogout();
          }
        }
        this.loading = false;
      }
      if (state.user.status === 'logout') {
        try {
          const studentRegisterStore = useStudentRegisterStore();
          const route = this.$route;
          const query = {
            sId: studentRegisterStore.getSchoolId,
            // returnUrl: this.$route.path,
            ...this.$route.query
          } as any;
          if (route.meta.isRegister) {
            query.isRegister = route.meta.isRegister;
          }
          this.$router.replace({
            path: '/student-register',
            query: query
          });
        } catch (error) {
          //
        }
      }
    }
  },
  render() {
    return (
      <>
        {state.user.status === 'error' ? (
          <div class={styles.error}>
            <OEmpty
              description="加载失败，请稍后重试"
              buttonText="重新加载"
              showButton
              onClick={this.setAuth}
            />
          </div>
        ) : this.isNeedView ? (
          <RouterView></RouterView>
        ) : null}
      </>
    );
  }
});