CreateAPModal.vue

<template>
  <div class="modal">
    <b-modal
      id="createAPModal"
      :title="$t('page.createResource.applicationProfile.createAp.title')"
      :hide-footer="true"
    >
      <!-- Body -->
      <i18n path="page.createResource.applicationProfile.createAp.body" tag="p">
        <template #br><br /></template>
      </i18n>

      <!-- Buttons -->
      <div class="mt-3">
        <!-- Confirm Button -->
        <b-button
          class="createAPModalRightBtn float-right"
          variant="primary"
          @click="toAIMS"
          >{{ $t("buttons.confirm") }}
        </b-button>

        <!-- Cancel Button -->
        <b-button
          class="createAPModalLeftBtn"
          variant="secondary"
          @click="$bvModal.hide('createAPModal')"
          >{{ $t("buttons.cancel") }}
        </b-button>
      </div>
    </b-modal>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import useProjectStore from "@/modules/project/store";
// import the main store
import useMainStore from "@/store/index";
import type { ProjectObject } from "@coscine/api-client/dist/types/Coscine.Api.Project";

export default defineComponent({
  setup() {
    const mainStore = useMainStore();
    const projectStore = useProjectStore();

    return { mainStore, projectStore };
  },

  computed: {
    project(): ProjectObject | null {
      return this.projectStore.currentProject;
    },
  },

  methods: {
    async toAIMS() {
      this.projectStore.retrieveApplicationProfileAnalytics(this.project);
      const accessToken = this.mainStore.coscine.authorization.bearer;
      const url = this.$router.resolve({
        path: "/coscine/apps/aimsfrontend/",
        query: { token: accessToken },
      }).href;
      window.open(url);
    },
  },
});
</script>

<style></style>