<template>
  <div id="app" :style="{ '--color': defaultTheme }" v-loading="defaultLoading">
    <theme-picker v-show="false" />

    <router-view />
  </div>
</template>
<script>
import ThemePicker from "@/components/ThemePicker";
import { login } from "@/api/login";
import { testApi } from "@/api/test";
import "@/assets/style/index.css";
export default {
  created() {},
  components: { ThemePicker },
  metaInfo() {
    return {
      title:
        this.$store.state.settings.dynamicTitle &&
        this.$store.state.settings.title,
      titleTemplate: (title) => {
        return title
          ? `${title} - ${process.env.VUE_APP_TITLE}`
          : process.env.VUE_APP_TITLE;
      },
    };
  },
  computed: {
    defaultTheme() {
      return this.$store.state.settings.theme;
    },
    defaultLoading() {
      return this.$store.state.settings.loading;
    },
  },
  methods: {
    // 调取后端api方法
    addLog() {
      const data = {
        userName: "测试1",
        password: "1111",
      };
      login(data).then((res) => {});
    },
    // 调取后端api方法
    test(id) {
      const data = {
        userName: "测试2",
        password: "1111",
      };
      testApi(data, id).then((res) => {
        console.log(res);
      });
    },
  },
};
</script>
<style lang="scss">
body {
  width: 100%;
  height: 100%;
}
</style>
<style scoped>
#app .theme-picker {
  display: none;
}
</style>
