TALL-MUI-4/App.vue

<script>
import useGetToken from "@/hooks/user/useGetToken";

export default {
  async onLaunch(options) {
    console.log('onLaunch options: ', options);
    this.checkNetwork(); // 监听网络状态
    this.getSystemInfo(); // 获取系统设备信息、
    this.syncLocalDataToStore(options.query.u); // 将localStorage里的数据同步到store里

    const token = await useGetToken();
    if (!token) {
      this.$ui.showToast('获取用户信息失败, 请登录');
      // TODO: 跳转登录界面
      return;
    }
    this.noPhone(this.$store.state.user.phone);
    this.$store.dispatch('socket/initSocket');
  },

  methods: {
    /**
     * 将localStorage里的数据同步到store里
     * user, token, tokenExpiredTime
     */
    syncLocalDataToStore(urlUserId) {
      const localUser = uni.$storage.getStorageSync('user');
      const localToken = uni.$storage.getStorageSync('anyringToken');
      const tokenExpiredTime = uni.$storage.getStorageSync('tokenExpiredTime');
      if (!this.$store.state.user.user && localUser) {
        // 同步user信息
        const user = JSON.parse(localUser);
        if (!urlUserId || user.id === urlUserId) {
          this.$store.commit('user/setUser', user);
        } else {
          this.$store.commit('user/setUser', { id: urlUserId });
        }
      }
      if (this.$store.state.user.token && localToken) { // 同步token
        this.$store.commit('user/setToken', localToken);
      }
      if (this.$store.state.user.tokenExpiredTime && tokenExpiredTime) { // 同步tokenExpiredTime
        this.$store.commit('user/setTokenExpiredTime', +tokenExpiredTime);
      }
    },

    // 检查网络状态 设置store里的网络状态变量
    // 网络连接 且 不是2g 不是3g 才算是网络连接; 否则不是 将启用本地存储
    checkNetwork() {
      uni.getNetworkType({
        success: ({ networkType }) => {
          this.$store.commit('setNetworkConnected', !(networkType === 'none' || networkType === '2g' || networkType === '3g'));
        },
      });
      // 监听网络状态的变化
      uni.onNetworkStatusChange(({ isConnected, networkType }) => {
        this.$store.commit('setNetworkConnected', isConnected && !(networkType === '2g' || networkType === '3g'));
      });
    },

    // 获取系统设备信息
    getSystemInfo() {
      uni.getSystemInfo({
        success: result => {
          this.$store.commit('setSystemInfo', result);
        },
        fail: error => {
          console.error('getSystemInfo fail:', error);
        },
      });
    },

    // 登录
    async signin() {
      try {
        const data = await uni.$u.api.signin();
        if (data && data.token) {
          this.$store.commit('user/setUser', data);
          this.$store.commit('user/setToken', data.token);
          noPhone(data.phone);
        } else {
          uni.$ui.showToast('返回数据异常');
        }
      } catch (error) {
        console.error('error: ', error);
        uni.$ui.showToast(error || '登录失败');
      }
    },

    /**
			 * 没有手机号 跳转绑定手机号的界面
			 * @param {string} phone
			 */
    async noPhone(phone) {
      if (!phone) {
        uni.navigateTo({ title: '/pages/phone-bind/phone-bind' });
      }
    },
  },
};
</script>

<style lang="scss">
	/*每个页面公共css */
	@import "@/uni_modules/vk-uview-ui/index.scss";
	@import '@/common/styles/iconfont.scss';
	@import '@/common/styles/app.scss';
	@import '@/common/styles/tailwind.scss';

	page {
		height: 100%;
	}
</style>