codebadge-backend/src/views/HomeView.vue at master · codeuino/codebadge-backend · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<template>
  <div>
    <v-layout class="ma-5" justify-center>
      <div v-if="!isLoading">
        <v-btn @click="newBadge" style="margin-bottom: 30px;"
          >Create a New Badge</v-btn
        >
        <UserDetails />
        <div class="mt-5 orgs">Organizations</div>
        <OrgList />
        <div>
          <v-btn @click="addOrganization">Add access to an Organization</v-btn>
        </div>
        <div class="mt-5 orgs">Upload Template</div>
        <v-btn @click="upload">Upload</v-btn>
      </div>
      <div v-if="isLoading">
        <img src="@/assets/loaders/block.svg" alt="loading..." />
      </div>
    </v-layout>
  </div>
</template>

<script>
import UserDetails from "../components/home/UserDetails";
import OrgList from "../components/home/OrgList";

export default {
  name: "HomeView",
  computed: {
    isLoading() {
      return this.$store.state.user == "" && this.$store.state.userOrgs == "";
    }
  },
  components: {
    UserDetails,
    OrgList
  },
  created() {
    this.$store.dispatch("loadUser");
    this.$store.dispatch("loadUserOrgs");
  },
  methods: {

    addOrganization() {
      window.open(
        "https://github.com/settings/connections/applications/" +
          process.env.VUE_APP_CLIENT_ID,
        "_blank"
      );
    },
    newBadge() {
      window.location.href = "#/newbadge";
    },
      upload() {
      window.location.href = "#/upload";
    },
  }
};
</script>

<style lang="scss" scoped>
.orgs {
  font-size: 20px;
}
</style>