<template>
  <router-view :key="route.fullPath" v-if="showApp" />
  <NoLookTip
    v-else-if="forbidLogin"
    text="暂无观看权限，请联系小助理开通"
  ></NoLookTip>
</template>

<script setup>
import { computed } from "vue";
import { useRoute } from "vue-router";
import { terminalType } from "@/utils/index";
import { userLogin, appLogin } from "@/utils/login";
import { useStore } from "vuex";
import NoLookTip from "@/components/NoLookTip.vue";
const route = useRoute();
const store = useStore();

const showApp = computed(() => {
  return (
    store.state.token ||
    route.meta.noLogin ||
    (route.path === "/page" && route.query.preview)
  );
});

const forbidLogin = computed(() => {
  return store.state.forbidLogin;
});

if (terminalType === "App") {
  window.upNativeComm.addEventListener("UPUser", (opt) => {
    if (opt.action == "userChange" && store.state.userInfo.userId) {
      console.log("userChange-->", opt);
      // app里监听用户资金账号切换
      userLogin();
    }
  });
  window.upNativeComm.addEventListener("WebView", async (opt) => {
    if (opt.action == "visible") {
      // 唤起app登录，用户取消登录或者登录成功会触发
      appLogin(true);
    }
  });
}
</script>
<style lang="scss">
#app {
  position: relative;
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  height: 100%;
  background: #fff;
}

nav {
  padding: 30px;
  width: 750px;
  box-sizing: border-box;

  a {
    font-weight: bold;
    color: #2c3e50;

    &.router-link-exact-active {
      color: #42b983;
    }
  }
}
</style>
