<template>
  <div class="manual">
    <div
      class="flex justify-start items-center bg-white q-pa-md q-mt-md q-mx-md rounded-borders"
    >
      <q-btn
        padding="xs"
        class="text-grey-7 q-mr-md"
        color="grey-3"
        icon="arrow_back"
        @click="$router.push({ name: 'criteria-directory' })"
      />
      <span class="text-h5">{{ $t('criteriaDirectory.deleteCriterion') }}</span>
      </div>
    <div
      class="q-gutter-y-md row bg-white q-px-lg q-pb-md q-pt-sm q-mt-md q-mx-md rounded-borders"
     >
      <div class="col text-primary q-pa-sm">
        <div class="q-gutter-y-md">
      <q-card class="full-width no-shadow">
        <q-card-section class="text-h5 q-px-md" align="center">
          {{ $t('criteriaDirectory.questionToDelete') }}
        </q-card-section>
        <q-card-actions align="center">
          <q-btn
            :label="$t('criteriaDirectory.yes')"
            color="primary"
            icon="done"
            @click="deleteResource"
          />
          <q-btn
            :label="$t('criteriaDirectory.no')"
            color="red"
            icon="delete" 
            @click="$router.push({ name: 'criteria-directory' })"
          />
        </q-card-actions>
      </q-card>
       </div>
      </div>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import { notifyError, notifySuccess } from '@utils/notify';
import { CriteriaApi, Criteria } from '@openapi/personal-accounts';

const criteriaApi = new CriteriaApi();

@Component({
  components: {},
})
export default class deleteCriteriaCategoryDialog extends Vue {
  id='';
  loading = false;

  async deleteResource(): Promise<void> {
    this.loading = false;
    if (!this.id) return;
    try {
      const { data: { success }} = await criteriaApi.deleteCriteria(
        [this.id], 
        'kILL',
        {}
      )
      if (success) {
        notifySuccess('Успешно удалено.');
      }
      
    } catch (error) {
      if (error instanceof Error) notifyError(error.message);
    }
    this.loading = true;
    this.$router.push({ name: 'criteria-directory' })
  }

  created(): void {
    this.id=this.$route.params.id;
  }
}

</script>
