import { Component, Vue } from 'vue-property-decorator';
import { ModelerService } from '@/services/modeler';
import { DocumentType } from '@typegoose/typegoose';
import { Service } from '@devsun/arm-bff/dist/lib/database/models/mongo/pgs-schema-util/Services';

@Component({})
export default class CommonPage extends Vue {
  modelerService = new ModelerService();
  service: DocumentType<Service> | null = null;

  get fallBackRoute() {
    return {
      name: 'cards',
      params: {
        id: this.$route?.params?.serviceId,
        path: 'services',
      },
      query: {
        active: 'basic',
        components: this.$store.getters['cardComponents/services/components'],
      },
    };
  }

  async created() {
    const serviceId = this.$route?.params?.serviceId;

    this.service = await this.modelerService.getServiceById(serviceId);
  }

  get apiBase(): string {
    const base = (location.origin || '').replace(/\/$/, '');

    return base + process.env.VUE_APP_PROJECT_PATH + '/service/';
  }
}
