import { Action, State } from 'vuex-class';
import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
import iView from 'iview';
import Raven from 'raven-js';
import RavenVue from 'raven-js/plugins/vue';
import { release } from '@/.sentryclirc';
import VueContextMenu from '@editor/component/Contextmenu/index';
import localStorage from '@/service/localStorage.service';
import '@/service/qg.service';
import 'iview/dist/styles/iview.css';

Vue.use(iView);
Vue.use(VueContextMenu);

// 初始化sentry
if (process.env.SENTRY_ENV !== 'test' && process.env.NODE_ENV === 'production') {
  Raven.config('http://0785298052fd46128e201f30ca649102@sentry.q-gp.com/64', {
    release,
    environment: 'production'
  })
    .addPlugin(RavenVue, Vue)
    .install();
}

@Component({
  name: 'Layout',
})
export default class Layout extends Vue {
  activeName: string = 'list';
  username: string = localStorage.get('user')?.name || '陌生人';
  @Action('fetchTenantAuthData') fetchTenantAuthData;
  @State(state => state.tenant) tenant;

  get isDashboard() {
    return this.activeName === 'detail';
  }

  @Watch('$route', { immediate: true })
  onRouteChange(to) {
    this.activeName = to.name;
  }

  select(name) {
    console.log();
    this.$router.push({
      name
    });
  }

  logOut() {
    localStorage.clear();
    window.location.href = '/editor/login';
  }

  async created() {
    await this.fetchTenantAuthData();
    console.log('>>EASY_ENV_IS_NODE create', EASY_ENV_IS_NODE);
  }
}