Generate question bank domain model from JDL
This commit is contained in:
jieun committed
1 parent
1d97cc4e31
commit
1d74d8f04b
160 files changed
+26900
-2
No files matched your search
@@ -0,0 +1,91 @@
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
import { type RouteLocation } from 'vue-router';
|
||||
|
||||
import { type MountingOptions, shallowMount } from '@vue/test-utils';
|
||||
|
||||
import AlertService from '@/shared/alert/alert.service';
|
||||
|
||||
import ExamAttemptDetails from './exam-attempt-details.vue';
|
||||
|
||||
type ExamAttemptDetailsComponentType = InstanceType<typeof ExamAttemptDetails>;
|
||||
|
||||
let route: Partial<RouteLocation>;
|
||||
const routerGoMock = vi.fn();
|
||||
|
||||
vi.mock('vue-router', () => ({
|
||||
useRoute: () => route,
|
||||
useRouter: () => ({ go: routerGoMock }),
|
||||
}));
|
||||
|
||||
const examAttemptSample = { id: 123 };
|
||||
|
||||
describe('Component Tests', () => {
|
||||
let alertService: AlertService;
|
||||
|
||||
afterEach(() => {
|
||||
vi.resetAllMocks();
|
||||
});
|
||||
|
||||
describe('ExamAttempt Management Detail Component', () => {
|
||||
let examAttemptServiceStub: any;
|
||||
let mountOptions: MountingOptions<ExamAttemptDetailsComponentType>['global'];
|
||||
|
||||
beforeEach(() => {
|
||||
route = {};
|
||||
examAttemptServiceStub = {
|
||||
find: vi.fn(),
|
||||
};
|
||||
|
||||
alertService = new AlertService({
|
||||
i18n: { t: vi.fn() } as any,
|
||||
toast: {
|
||||
create: vi.fn(),
|
||||
} as any,
|
||||
});
|
||||
|
||||
mountOptions = {
|
||||
stubs: {
|
||||
'font-awesome-icon': true,
|
||||
'router-link': true,
|
||||
},
|
||||
provide: {
|
||||
alertService,
|
||||
examAttemptService: () => examAttemptServiceStub,
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
describe('Navigate to details', () => {
|
||||
it('Should call load all on init', async () => {
|
||||
// GIVEN
|
||||
examAttemptServiceStub.find.mockResolvedValue(examAttemptSample);
|
||||
route = {
|
||||
params: {
|
||||
examAttemptId: `${123}`,
|
||||
},
|
||||
};
|
||||
const wrapper = shallowMount(ExamAttemptDetails, { global: mountOptions });
|
||||
const comp = wrapper.vm;
|
||||
// WHEN
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(comp.examAttempt).toMatchObject(examAttemptSample);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Previous state', () => {
|
||||
it('Should go previous state', async () => {
|
||||
examAttemptServiceStub.find.mockResolvedValue(examAttemptSample);
|
||||
const wrapper = shallowMount(ExamAttemptDetails, { global: mountOptions });
|
||||
const comp = wrapper.vm;
|
||||
await comp.$nextTick();
|
||||
|
||||
comp.previousState();
|
||||
await comp.$nextTick();
|
||||
|
||||
expect(routerGoMock).toHaveBeenCalledWith(-1);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,45 @@
|
||||
import { type Ref, defineComponent, inject, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
import { useAlertService } from '@/shared/alert/alert.service';
|
||||
import { useDateFormat } from '@/shared/composables';
|
||||
import { type IExamAttempt } from '@/shared/model/exam-attempt.model';
|
||||
|
||||
import ExamAttemptService from './exam-attempt.service';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'ExamAttemptDetails',
|
||||
setup() {
|
||||
const dateFormat = useDateFormat();
|
||||
const examAttemptService = inject('examAttemptService', () => new ExamAttemptService());
|
||||
const alertService = inject('alertService', () => useAlertService(), true);
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const previousState = () => router.go(-1);
|
||||
const examAttempt: Ref<IExamAttempt> = ref({});
|
||||
|
||||
const retrieveExamAttempt = async examAttemptId => {
|
||||
try {
|
||||
const res = await examAttemptService().find(examAttemptId);
|
||||
examAttempt.value = res;
|
||||
} catch (error) {
|
||||
alertService.showHttpError(error.response);
|
||||
}
|
||||
};
|
||||
|
||||
if (route.params?.examAttemptId) {
|
||||
retrieveExamAttempt(route.params.examAttemptId);
|
||||
}
|
||||
|
||||
return {
|
||||
...dateFormat,
|
||||
examAttempt,
|
||||
|
||||
previousState,
|
||||
t$: useI18n().t,
|
||||
};
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div class="d-flex justify-content-center">
|
||||
<div class="col-8">
|
||||
<div v-if="examAttempt">
|
||||
<h2 class="jh-entity-heading" data-cy="examAttemptDetailsHeading">
|
||||
<span>{{ t$('questionBankApp.examAttempt.detail.title') }}</span> {{ examAttempt.id }}
|
||||
</h2>
|
||||
<dl class="row-md jh-entity-details">
|
||||
<dt>
|
||||
<span>{{ t$('questionBankApp.examAttempt.startedAt') }}</span>
|
||||
</dt>
|
||||
<dd>
|
||||
<span v-if="examAttempt.startedAt">{{ formatDateLong(examAttempt.startedAt) }}</span>
|
||||
</dd>
|
||||
<dt>
|
||||
<span>{{ t$('questionBankApp.examAttempt.submittedAt') }}</span>
|
||||
</dt>
|
||||
<dd>
|
||||
<span v-if="examAttempt.submittedAt">{{ formatDateLong(examAttempt.submittedAt) }}</span>
|
||||
</dd>
|
||||
<dt>
|
||||
<span>{{ t$('questionBankApp.examAttempt.status') }}</span>
|
||||
</dt>
|
||||
<dd>
|
||||
<span>{{ t$('questionBankApp.AttemptStatus.' + examAttempt.status) }}</span>
|
||||
</dd>
|
||||
<dt>
|
||||
<span>{{ t$('questionBankApp.examAttempt.score') }}</span>
|
||||
</dt>
|
||||
<dd>
|
||||
<span>{{ examAttempt.score }}</span>
|
||||
</dd>
|
||||
<dt>
|
||||
<span>{{ t$('questionBankApp.examAttempt.subject') }}</span>
|
||||
</dt>
|
||||
<dd>
|
||||
<div v-if="examAttempt.subject">
|
||||
<router-link :to="{ name: 'SubjectView', params: { subjectId: examAttempt.subject.id } }">{{
|
||||
examAttempt.subject.name
|
||||
}}</router-link>
|
||||
</div>
|
||||
</dd>
|
||||
<dt>
|
||||
<span>{{ t$('questionBankApp.examAttempt.user') }}</span>
|
||||
</dt>
|
||||
<dd>
|
||||
{{ examAttempt.user ? examAttempt.user.login : '' }}
|
||||
</dd>
|
||||
</dl>
|
||||
<button type="submit" @click.prevent="previousState()" class="btn btn-info" data-cy="entityDetailsBackButton">
|
||||
<font-awesome-icon icon="arrow-left"></font-awesome-icon> <span>{{ t$('entity.action.back') }}</span>
|
||||
</button>
|
||||
<router-link
|
||||
v-if="examAttempt.id"
|
||||
:to="{ name: 'ExamAttemptEdit', params: { examAttemptId: examAttempt.id } }"
|
||||
custom
|
||||
v-slot="{ navigate }"
|
||||
>
|
||||
<button @click="navigate" class="btn btn-primary">
|
||||
<font-awesome-icon icon="pencil-alt"></font-awesome-icon> <span>{{ t$('entity.action.edit') }}</span>
|
||||
</button>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" src="./exam-attempt-details.component.ts"></script>
|
||||
@@ -0,0 +1,166 @@
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
import { type RouteLocation } from 'vue-router';
|
||||
|
||||
import { type MountingOptions, shallowMount } from '@vue/test-utils';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
import AlertService from '@/shared/alert/alert.service';
|
||||
import { DATE_TIME_LONG_FORMAT } from '@/shared/composables/date-format';
|
||||
|
||||
import ExamAttemptUpdate from './exam-attempt-update.vue';
|
||||
|
||||
type ExamAttemptUpdateComponentType = InstanceType<typeof ExamAttemptUpdate>;
|
||||
|
||||
let route: Partial<RouteLocation>;
|
||||
const routerGoMock = vi.fn();
|
||||
|
||||
vi.mock('vue-router', () => ({
|
||||
useRoute: () => route,
|
||||
useRouter: () => ({ go: routerGoMock }),
|
||||
}));
|
||||
|
||||
const examAttemptSample = { id: 123 };
|
||||
|
||||
describe('Component Tests', () => {
|
||||
let mountOptions: MountingOptions<ExamAttemptUpdateComponentType>['global'];
|
||||
let alertService: AlertService;
|
||||
|
||||
describe('ExamAttempt Management Update Component', () => {
|
||||
let comp: ExamAttemptUpdateComponentType;
|
||||
let examAttemptServiceStub: any;
|
||||
|
||||
beforeEach(() => {
|
||||
route = {};
|
||||
examAttemptServiceStub = {
|
||||
retrieve: vi.fn(),
|
||||
find: vi.fn(),
|
||||
update: vi.fn(),
|
||||
create: vi.fn(),
|
||||
};
|
||||
examAttemptServiceStub.retrieve.mockResolvedValueOnce([]);
|
||||
|
||||
alertService = new AlertService({
|
||||
i18n: { t: vi.fn() } as any,
|
||||
toast: {
|
||||
create: vi.fn(),
|
||||
} as any,
|
||||
});
|
||||
|
||||
mountOptions = {
|
||||
stubs: {
|
||||
'font-awesome-icon': true,
|
||||
'b-input-group': true,
|
||||
'b-input-group-prepend': true,
|
||||
'b-form-datepicker': true,
|
||||
'b-form-input': true,
|
||||
},
|
||||
provide: {
|
||||
alertService,
|
||||
examAttemptService: () => examAttemptServiceStub,
|
||||
subjectService: () => ({
|
||||
retrieve: vi.fn().mockResolvedValue({}),
|
||||
}),
|
||||
|
||||
userService: () => ({
|
||||
retrieve: vi.fn().mockResolvedValue({}),
|
||||
}),
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vi.resetAllMocks();
|
||||
});
|
||||
|
||||
describe('load', () => {
|
||||
beforeEach(() => {
|
||||
const wrapper = shallowMount(ExamAttemptUpdate, { global: mountOptions });
|
||||
comp = wrapper.vm;
|
||||
});
|
||||
it('Should convert date from string', () => {
|
||||
// GIVEN
|
||||
const date = new Date('2019-10-15T11:42:02Z');
|
||||
|
||||
// WHEN
|
||||
const convertedDate = comp.convertDateTimeFromServer(date);
|
||||
|
||||
// THEN
|
||||
expect(convertedDate).toEqual(dayjs(date).format(DATE_TIME_LONG_FORMAT));
|
||||
});
|
||||
|
||||
it('Should not convert date if date is not present', () => {
|
||||
expect(comp.convertDateTimeFromServer(null)).toBeNull();
|
||||
});
|
||||
});
|
||||
|
||||
describe('save', () => {
|
||||
it('Should call update service on save for existing entity', async () => {
|
||||
// GIVEN
|
||||
const wrapper = shallowMount(ExamAttemptUpdate, { global: mountOptions });
|
||||
comp = wrapper.vm;
|
||||
comp.examAttempt = examAttemptSample;
|
||||
examAttemptServiceStub.update.mockResolvedValue(examAttemptSample);
|
||||
|
||||
// WHEN
|
||||
comp.save();
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(examAttemptServiceStub.update).toHaveBeenCalledWith(examAttemptSample);
|
||||
expect(comp.isSaving).toEqual(false);
|
||||
});
|
||||
|
||||
it('Should call create service on save for new entity', async () => {
|
||||
// GIVEN
|
||||
const entity = {};
|
||||
examAttemptServiceStub.create.mockResolvedValue(entity);
|
||||
const wrapper = shallowMount(ExamAttemptUpdate, { global: mountOptions });
|
||||
comp = wrapper.vm;
|
||||
comp.examAttempt = entity;
|
||||
|
||||
// WHEN
|
||||
comp.save();
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(examAttemptServiceStub.create).toHaveBeenCalledWith(entity);
|
||||
expect(comp.isSaving).toEqual(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Before route enter', () => {
|
||||
it('Should retrieve data', async () => {
|
||||
// GIVEN
|
||||
examAttemptServiceStub.find.mockResolvedValue(examAttemptSample);
|
||||
examAttemptServiceStub.retrieve.mockResolvedValue([examAttemptSample]);
|
||||
|
||||
// WHEN
|
||||
route = {
|
||||
params: {
|
||||
examAttemptId: `${examAttemptSample.id}`,
|
||||
},
|
||||
};
|
||||
const wrapper = shallowMount(ExamAttemptUpdate, { global: mountOptions });
|
||||
comp = wrapper.vm;
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(comp.examAttempt).toMatchObject(examAttemptSample);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Previous state', () => {
|
||||
it('Should go previous state', async () => {
|
||||
examAttemptServiceStub.find.mockResolvedValue(examAttemptSample);
|
||||
const wrapper = shallowMount(ExamAttemptUpdate, { global: mountOptions });
|
||||
comp = wrapper.vm;
|
||||
await comp.$nextTick();
|
||||
|
||||
comp.previousState();
|
||||
await comp.$nextTick();
|
||||
|
||||
expect(routerGoMock).toHaveBeenCalledWith(-1);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,140 @@
|
||||
import { type Ref, computed, defineComponent, inject, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
import { useVuelidate } from '@vuelidate/core';
|
||||
|
||||
import SubjectService from '@/entities/subject/subject.service';
|
||||
import UserService from '@/entities/user/user.service';
|
||||
import { useAlertService } from '@/shared/alert/alert.service';
|
||||
import { useDateFormat, useValidation } from '@/shared/composables';
|
||||
import { AttemptStatus } from '@/shared/model/enumerations/attempt-status.model';
|
||||
import { ExamAttempt, type IExamAttempt } from '@/shared/model/exam-attempt.model';
|
||||
import { type ISubject } from '@/shared/model/subject.model';
|
||||
|
||||
import ExamAttemptService from './exam-attempt.service';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'ExamAttemptUpdate',
|
||||
setup() {
|
||||
const examAttemptService = inject('examAttemptService', () => new ExamAttemptService());
|
||||
const alertService = inject('alertService', () => useAlertService(), true);
|
||||
|
||||
const examAttempt: Ref<IExamAttempt> = ref(new ExamAttempt());
|
||||
|
||||
const subjectService = inject('subjectService', () => new SubjectService());
|
||||
|
||||
const subjects: Ref<ISubject[]> = ref([]);
|
||||
const userService = inject('userService', () => new UserService());
|
||||
const users: Ref<Array<any>> = ref([]);
|
||||
const attemptStatusValues: Ref<string[]> = ref(Object.keys(AttemptStatus));
|
||||
const isSaving = ref(false);
|
||||
const currentLanguage = inject('currentLanguage', () => computed(() => navigator.language ?? 'en'), true);
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const previousState = () => router.go(-1);
|
||||
|
||||
const retrieveExamAttempt = async examAttemptId => {
|
||||
try {
|
||||
const res = await examAttemptService().find(examAttemptId);
|
||||
res.startedAt = new Date(res.startedAt);
|
||||
res.submittedAt = new Date(res.submittedAt);
|
||||
examAttempt.value = res;
|
||||
} catch (error) {
|
||||
alertService.showHttpError(error.response);
|
||||
}
|
||||
};
|
||||
|
||||
if (route.params?.examAttemptId) {
|
||||
retrieveExamAttempt(route.params.examAttemptId);
|
||||
}
|
||||
|
||||
const initRelationships = () => {
|
||||
subjectService()
|
||||
.retrieve()
|
||||
.then(res => {
|
||||
subjects.value = res.data;
|
||||
});
|
||||
userService()
|
||||
.retrieve()
|
||||
.then(res => {
|
||||
users.value = res.data;
|
||||
});
|
||||
};
|
||||
|
||||
initRelationships();
|
||||
|
||||
const { t: t$ } = useI18n();
|
||||
const validations = useValidation();
|
||||
const validationRules = {
|
||||
startedAt: {
|
||||
required: validations.required(t$('entity.validation.required').toString()),
|
||||
},
|
||||
submittedAt: {},
|
||||
status: {
|
||||
required: validations.required(t$('entity.validation.required').toString()),
|
||||
},
|
||||
score: {
|
||||
integer: validations.integer(t$('entity.validation.number').toString()),
|
||||
min: validations.minValue(t$('entity.validation.min', { min: 0 }).toString(), 0),
|
||||
},
|
||||
answers: {},
|
||||
subject: {
|
||||
required: validations.required(t$('entity.validation.required').toString()),
|
||||
},
|
||||
user: {
|
||||
required: validations.required(t$('entity.validation.required').toString()),
|
||||
},
|
||||
};
|
||||
const v$ = useVuelidate(validationRules, examAttempt as any);
|
||||
v$.value.$validate();
|
||||
|
||||
return {
|
||||
examAttemptService,
|
||||
alertService,
|
||||
examAttempt,
|
||||
previousState,
|
||||
attemptStatusValues,
|
||||
isSaving,
|
||||
currentLanguage,
|
||||
subjects,
|
||||
users,
|
||||
v$,
|
||||
...useDateFormat({ entityRef: examAttempt }),
|
||||
t$,
|
||||
};
|
||||
},
|
||||
created(): void {},
|
||||
methods: {
|
||||
save(): void {
|
||||
this.isSaving = true;
|
||||
if (this.examAttempt.id) {
|
||||
this.examAttemptService()
|
||||
.update(this.examAttempt)
|
||||
.then(param => {
|
||||
this.isSaving = false;
|
||||
this.previousState();
|
||||
this.alertService.showInfo(this.t$('questionBankApp.examAttempt.updated', { param: param.id }));
|
||||
})
|
||||
.catch(error => {
|
||||
this.isSaving = false;
|
||||
this.alertService.showHttpError(error.response);
|
||||
});
|
||||
} else {
|
||||
this.examAttemptService()
|
||||
.create(this.examAttempt)
|
||||
.then(param => {
|
||||
this.isSaving = false;
|
||||
this.previousState();
|
||||
this.alertService.showSuccess(this.t$('questionBankApp.examAttempt.created', { param: param.id }).toString());
|
||||
})
|
||||
.catch(error => {
|
||||
this.isSaving = false;
|
||||
this.alertService.showHttpError(error.response);
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,137 @@
|
||||
<template>
|
||||
<div class="d-flex justify-content-center">
|
||||
<div class="col-8">
|
||||
<form name="editForm" novalidate @submit.prevent="save()">
|
||||
<h2 id="questionBankApp.examAttempt.home.createOrEditLabel" data-cy="ExamAttemptCreateUpdateHeading">
|
||||
{{ t$('questionBankApp.examAttempt.home.createOrEditLabel') }}
|
||||
</h2>
|
||||
<div>
|
||||
<div class="mb-3" v-if="examAttempt.id">
|
||||
<label for="id">{{ t$('global.field.id') }}</label>
|
||||
<input type="text" class="form-control" id="id" name="id" v-model="examAttempt.id" readonly />
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-control-label" for="exam-attempt-startedAt">{{ t$('questionBankApp.examAttempt.startedAt') }}</label>
|
||||
<div class="d-flex">
|
||||
<input
|
||||
id="exam-attempt-startedAt"
|
||||
data-cy="startedAt"
|
||||
type="datetime-local"
|
||||
class="form-control"
|
||||
name="startedAt"
|
||||
:class="{ valid: !v$.startedAt.$invalid, invalid: v$.startedAt.$invalid }"
|
||||
required
|
||||
:value="convertDateTimeFromServer(v$.startedAt.$model)"
|
||||
@change="updateInstantField('startedAt', $event)"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="v$.startedAt.$anyDirty && v$.startedAt.$invalid">
|
||||
<small class="form-text text-danger" v-for="error of v$.startedAt.$errors" :key="error.$uid">{{ error.$message }}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-control-label" for="exam-attempt-submittedAt">{{ t$('questionBankApp.examAttempt.submittedAt') }}</label>
|
||||
<div class="d-flex">
|
||||
<input
|
||||
id="exam-attempt-submittedAt"
|
||||
data-cy="submittedAt"
|
||||
type="datetime-local"
|
||||
class="form-control"
|
||||
name="submittedAt"
|
||||
:class="{ valid: !v$.submittedAt.$invalid, invalid: v$.submittedAt.$invalid }"
|
||||
:value="convertDateTimeFromServer(v$.submittedAt.$model)"
|
||||
@change="updateInstantField('submittedAt', $event)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-control-label" for="exam-attempt-status">{{ t$('questionBankApp.examAttempt.status') }}</label>
|
||||
<select
|
||||
class="form-control"
|
||||
name="status"
|
||||
:class="{ valid: !v$.status.$invalid, invalid: v$.status.$invalid }"
|
||||
v-model="v$.status.$model"
|
||||
id="exam-attempt-status"
|
||||
data-cy="status"
|
||||
required
|
||||
>
|
||||
<option
|
||||
v-for="attemptStatus in attemptStatusValues"
|
||||
:key="attemptStatus"
|
||||
:value="attemptStatus"
|
||||
:label="t$('questionBankApp.AttemptStatus.' + attemptStatus)"
|
||||
>
|
||||
{{ attemptStatus }}
|
||||
</option>
|
||||
</select>
|
||||
<div v-if="v$.status.$anyDirty && v$.status.$invalid">
|
||||
<small class="form-text text-danger" v-for="error of v$.status.$errors" :key="error.$uid">{{ error.$message }}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-control-label" for="exam-attempt-score">{{ t$('questionBankApp.examAttempt.score') }}</label>
|
||||
<input
|
||||
type="number"
|
||||
class="form-control"
|
||||
name="score"
|
||||
id="exam-attempt-score"
|
||||
data-cy="score"
|
||||
:class="{ valid: !v$.score.$invalid, invalid: v$.score.$invalid }"
|
||||
v-model.number="v$.score.$model"
|
||||
/>
|
||||
<div v-if="v$.score.$anyDirty && v$.score.$invalid">
|
||||
<small class="form-text text-danger" v-for="error of v$.score.$errors" :key="error.$uid">{{ error.$message }}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-control-label" for="exam-attempt">{{ t$('questionBankApp.examAttempt.subject') }}</label>
|
||||
<select class="form-control" id="exam-attempt-subject" data-cy="subject" name="subject" v-model="examAttempt.subject" required>
|
||||
<option v-if="!examAttempt.subject" :value="null" selected></option>
|
||||
<option
|
||||
:value="examAttempt.subject && subjectOption.id === examAttempt.subject.id ? examAttempt.subject : subjectOption"
|
||||
v-for="subjectOption in subjects"
|
||||
:key="subjectOption.id"
|
||||
>
|
||||
{{ subjectOption.name }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div v-if="v$.subject.$anyDirty && v$.subject.$invalid">
|
||||
<small class="form-text text-danger" v-for="error of v$.subject.$errors" :key="error.$uid">{{ error.$message }}</small>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-control-label" for="exam-attempt">{{ t$('questionBankApp.examAttempt.user') }}</label>
|
||||
<select class="form-control" id="exam-attempt-user" data-cy="user" name="user" v-model="examAttempt.user" required>
|
||||
<option v-if="!examAttempt.user" :value="null" selected></option>
|
||||
<option
|
||||
:value="examAttempt.user && userOption.id === examAttempt.user.id ? examAttempt.user : userOption"
|
||||
v-for="userOption in users"
|
||||
:key="userOption.id"
|
||||
>
|
||||
{{ userOption.login }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div v-if="v$.user.$anyDirty && v$.user.$invalid">
|
||||
<small class="form-text text-danger" v-for="error of v$.user.$errors" :key="error.$uid">{{ error.$message }}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<button type="button" id="cancel-save" data-cy="entityCreateCancelButton" class="btn btn-secondary" @click="previousState()">
|
||||
<font-awesome-icon icon="ban"></font-awesome-icon> <span>{{ t$('entity.action.cancel') }}</span>
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
id="save-entity"
|
||||
data-cy="entityCreateSaveButton"
|
||||
:disabled="v$.$invalid || isSaving"
|
||||
class="btn btn-primary"
|
||||
>
|
||||
<font-awesome-icon icon="save"></font-awesome-icon> <span>{{ t$('entity.action.save') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" src="./exam-attempt-update.component.ts"></script>
|
||||
@@ -0,0 +1,167 @@
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { type MountingOptions, shallowMount } from '@vue/test-utils';
|
||||
|
||||
import AlertService from '@/shared/alert/alert.service';
|
||||
|
||||
import ExamAttempt from './exam-attempt.vue';
|
||||
|
||||
type ExamAttemptComponentType = InstanceType<typeof ExamAttempt>;
|
||||
|
||||
const bModalStub = {
|
||||
render: () => {},
|
||||
methods: {
|
||||
hide: () => {},
|
||||
show: () => {},
|
||||
},
|
||||
};
|
||||
|
||||
describe('Component Tests', () => {
|
||||
let alertService: AlertService;
|
||||
|
||||
describe('ExamAttempt Management Component', () => {
|
||||
let examAttemptServiceStub: any;
|
||||
let mountOptions: MountingOptions<ExamAttemptComponentType>['global'];
|
||||
|
||||
beforeEach(() => {
|
||||
examAttemptServiceStub = {
|
||||
retrieve: vi.fn(),
|
||||
delete: vi.fn(),
|
||||
};
|
||||
examAttemptServiceStub.retrieve.mockResolvedValue({ headers: {} });
|
||||
|
||||
alertService = new AlertService({
|
||||
i18n: { t: vi.fn() } as any,
|
||||
toast: {
|
||||
create: vi.fn(),
|
||||
} as any,
|
||||
});
|
||||
|
||||
mountOptions = {
|
||||
stubs: {
|
||||
jhiItemCount: true,
|
||||
bPagination: true,
|
||||
bModal: bModalStub as any,
|
||||
'font-awesome-icon': true,
|
||||
'b-badge': true,
|
||||
'jhi-sort-indicator': true,
|
||||
'b-button': true,
|
||||
'router-link': true,
|
||||
},
|
||||
directives: {
|
||||
'b-modal': {},
|
||||
},
|
||||
provide: {
|
||||
alertService,
|
||||
examAttemptService: () => examAttemptServiceStub,
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
describe('Mount', () => {
|
||||
it('Should call load all on init', async () => {
|
||||
// GIVEN
|
||||
examAttemptServiceStub.retrieve.mockResolvedValue({ headers: {}, data: [{ id: 123 }] });
|
||||
|
||||
// WHEN
|
||||
const wrapper = shallowMount(ExamAttempt, { global: mountOptions });
|
||||
const comp = wrapper.vm;
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(examAttemptServiceStub.retrieve).toHaveBeenCalledOnce();
|
||||
expect(comp.examAttempts[0]).toEqual(expect.objectContaining({ id: 123 }));
|
||||
});
|
||||
|
||||
it('should calculate the sort attribute for an id', async () => {
|
||||
// WHEN
|
||||
const wrapper = shallowMount(ExamAttempt, { global: mountOptions });
|
||||
const comp = wrapper.vm;
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(examAttemptServiceStub.retrieve.mock.lastCall?.[0]).toMatchObject({
|
||||
sort: ['id,asc'],
|
||||
});
|
||||
});
|
||||
});
|
||||
describe('Handles', () => {
|
||||
let comp: ExamAttemptComponentType;
|
||||
|
||||
beforeEach(async () => {
|
||||
const wrapper = shallowMount(ExamAttempt, { global: mountOptions });
|
||||
comp = wrapper.vm;
|
||||
await comp.$nextTick();
|
||||
examAttemptServiceStub.retrieve.mockReset();
|
||||
examAttemptServiceStub.retrieve.mockResolvedValue({ headers: {}, data: [] });
|
||||
});
|
||||
|
||||
it('should load a page', async () => {
|
||||
// GIVEN
|
||||
examAttemptServiceStub.retrieve.mockResolvedValue({ headers: {}, data: [{ id: 123 }] });
|
||||
|
||||
// WHEN
|
||||
comp.page = 2;
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(examAttemptServiceStub.retrieve).toHaveBeenCalled();
|
||||
expect(comp.examAttempts[0]).toEqual(expect.objectContaining({ id: 123 }));
|
||||
});
|
||||
|
||||
it('should not load a page if the page is the same as the previous page', () => {
|
||||
// WHEN
|
||||
comp.page = 1;
|
||||
|
||||
// THEN
|
||||
expect(examAttemptServiceStub.retrieve).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('should re-initialize the page', async () => {
|
||||
// GIVEN
|
||||
comp.page = 2;
|
||||
await comp.$nextTick();
|
||||
examAttemptServiceStub.retrieve.mockReset();
|
||||
examAttemptServiceStub.retrieve.mockResolvedValue({ headers: {}, data: [{ id: 123 }] });
|
||||
|
||||
// WHEN
|
||||
comp.clear();
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(comp.page).toEqual(1);
|
||||
expect(examAttemptServiceStub.retrieve).toHaveBeenCalledTimes(1);
|
||||
expect(comp.examAttempts[0]).toEqual(expect.objectContaining({ id: 123 }));
|
||||
});
|
||||
|
||||
it('should calculate the sort attribute for a non-id attribute', async () => {
|
||||
// WHEN
|
||||
comp.propOrder = 'name';
|
||||
await comp.$nextTick();
|
||||
|
||||
// THEN
|
||||
expect(examAttemptServiceStub.retrieve.mock.lastCall?.[0]).toMatchObject({
|
||||
sort: ['name,asc', 'id'],
|
||||
});
|
||||
});
|
||||
|
||||
it('Should call delete service on confirmDelete', async () => {
|
||||
// GIVEN
|
||||
examAttemptServiceStub.delete.mockResolvedValue({});
|
||||
|
||||
// WHEN
|
||||
comp.prepareRemove({ id: 123 });
|
||||
|
||||
comp.removeExamAttempt();
|
||||
await comp.$nextTick(); // clear components
|
||||
|
||||
// THEN
|
||||
expect(examAttemptServiceStub.delete).toHaveBeenCalled();
|
||||
|
||||
// THEN
|
||||
await comp.$nextTick(); // handle component clear watch
|
||||
expect(examAttemptServiceStub.retrieve).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,137 @@
|
||||
import { type Ref, defineComponent, inject, onMounted, ref, watch } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import { useAlertService } from '@/shared/alert/alert.service';
|
||||
import { useDateFormat } from '@/shared/composables';
|
||||
import { type IExamAttempt } from '@/shared/model/exam-attempt.model';
|
||||
|
||||
import ExamAttemptService from './exam-attempt.service';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'ExamAttempt',
|
||||
setup() {
|
||||
const { t: t$ } = useI18n();
|
||||
const dateFormat = useDateFormat();
|
||||
const examAttemptService = inject('examAttemptService', () => new ExamAttemptService());
|
||||
const alertService = inject('alertService', () => useAlertService(), true);
|
||||
|
||||
const itemsPerPage = ref(20);
|
||||
const queryCount: Ref<number> = ref(null);
|
||||
const page: Ref<number> = ref(1);
|
||||
const propOrder = ref('id');
|
||||
const reverse = ref(false);
|
||||
const totalItems = ref(0);
|
||||
|
||||
const examAttempts: Ref<IExamAttempt[]> = ref([]);
|
||||
|
||||
const isFetching = ref(false);
|
||||
|
||||
const clear = () => {
|
||||
page.value = 1;
|
||||
};
|
||||
|
||||
const sort = (): Array<any> => {
|
||||
const result = [`${propOrder.value},${reverse.value ? 'desc' : 'asc'}`];
|
||||
if (propOrder.value !== 'id') {
|
||||
result.push('id');
|
||||
}
|
||||
return result;
|
||||
};
|
||||
|
||||
const retrieveExamAttempts = async () => {
|
||||
isFetching.value = true;
|
||||
try {
|
||||
const paginationQuery = {
|
||||
page: page.value - 1,
|
||||
size: itemsPerPage.value,
|
||||
sort: sort(),
|
||||
};
|
||||
const res = await examAttemptService().retrieve(paginationQuery);
|
||||
totalItems.value = Number(res.headers['x-total-count']);
|
||||
queryCount.value = totalItems.value;
|
||||
examAttempts.value = res.data;
|
||||
} catch (err) {
|
||||
alertService.showHttpError(err.response);
|
||||
} finally {
|
||||
isFetching.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const handleSyncList = () => {
|
||||
retrieveExamAttempts();
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
await retrieveExamAttempts();
|
||||
});
|
||||
|
||||
const removeId: Ref<number> = ref(null);
|
||||
const removeEntity = ref<any>(null);
|
||||
const prepareRemove = (instance: IExamAttempt) => {
|
||||
removeId.value = instance.id;
|
||||
removeEntity.value.show();
|
||||
};
|
||||
const closeDialog = () => {
|
||||
removeEntity.value.hide();
|
||||
};
|
||||
const removeExamAttempt = async () => {
|
||||
try {
|
||||
await examAttemptService().delete(removeId.value);
|
||||
const message = t$('questionBankApp.examAttempt.deleted', { param: removeId.value }).toString();
|
||||
alertService.showInfo(message, { variant: 'danger' });
|
||||
removeId.value = null;
|
||||
retrieveExamAttempts();
|
||||
closeDialog();
|
||||
} catch (error) {
|
||||
alertService.showHttpError(error.response);
|
||||
}
|
||||
};
|
||||
|
||||
const changeOrder = (newOrder: string) => {
|
||||
if (propOrder.value === newOrder) {
|
||||
reverse.value = !reverse.value;
|
||||
} else {
|
||||
reverse.value = false;
|
||||
}
|
||||
propOrder.value = newOrder;
|
||||
};
|
||||
|
||||
// Whenever order changes, reset the pagination
|
||||
watch([propOrder, reverse], async () => {
|
||||
if (page.value === 1) {
|
||||
// first page, retrieve new data
|
||||
await retrieveExamAttempts();
|
||||
} else {
|
||||
// reset the pagination
|
||||
clear();
|
||||
}
|
||||
});
|
||||
|
||||
// Whenever page changes, switch to the new page.
|
||||
watch(page, async () => {
|
||||
await retrieveExamAttempts();
|
||||
});
|
||||
|
||||
return {
|
||||
examAttempts,
|
||||
handleSyncList,
|
||||
isFetching,
|
||||
retrieveExamAttempts,
|
||||
clear,
|
||||
...dateFormat,
|
||||
removeId,
|
||||
removeEntity,
|
||||
prepareRemove,
|
||||
closeDialog,
|
||||
removeExamAttempt,
|
||||
itemsPerPage,
|
||||
queryCount,
|
||||
page,
|
||||
propOrder,
|
||||
reverse,
|
||||
totalItems,
|
||||
changeOrder,
|
||||
t$,
|
||||
};
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,186 @@
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import axios from 'axios';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
import { DATE_TIME_FORMAT } from '@/shared/composables/date-format';
|
||||
import { ExamAttempt } from '@/shared/model/exam-attempt.model';
|
||||
|
||||
import ExamAttemptService from './exam-attempt.service';
|
||||
|
||||
const error = {
|
||||
response: {
|
||||
status: null,
|
||||
data: {
|
||||
type: null,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const axiosStub = {
|
||||
get: vi.spyOn(axios, 'get'),
|
||||
post: vi.spyOn(axios, 'post'),
|
||||
put: vi.spyOn(axios, 'put'),
|
||||
patch: vi.spyOn(axios, 'patch'),
|
||||
delete: vi.spyOn(axios, 'delete'),
|
||||
};
|
||||
|
||||
describe('Service Tests', () => {
|
||||
describe('ExamAttempt Service', () => {
|
||||
let service: ExamAttemptService;
|
||||
let elemDefault;
|
||||
let currentDate: Date;
|
||||
|
||||
beforeEach(() => {
|
||||
service = new ExamAttemptService();
|
||||
currentDate = new Date();
|
||||
elemDefault = new ExamAttempt(123, currentDate, currentDate, 'IN_PROGRESS', 0);
|
||||
});
|
||||
|
||||
describe('Service methods', () => {
|
||||
it('should find an element', async () => {
|
||||
const returnedFromService = {
|
||||
startedAt: dayjs(currentDate).format(DATE_TIME_FORMAT),
|
||||
submittedAt: dayjs(currentDate).format(DATE_TIME_FORMAT),
|
||||
...elemDefault,
|
||||
};
|
||||
axiosStub.get.mockResolvedValue({ data: returnedFromService });
|
||||
|
||||
return service.find(123).then(res => {
|
||||
expect(res).toMatchObject(elemDefault);
|
||||
});
|
||||
});
|
||||
|
||||
it('should not find an element', async () => {
|
||||
axiosStub.get.mockRejectedValue(error);
|
||||
return service
|
||||
.find(123)
|
||||
.then()
|
||||
.catch(err => {
|
||||
expect(err).toMatchObject(error);
|
||||
});
|
||||
});
|
||||
|
||||
it('should create a ExamAttempt', async () => {
|
||||
const returnedFromService = {
|
||||
id: 123,
|
||||
startedAt: dayjs(currentDate).format(DATE_TIME_FORMAT),
|
||||
submittedAt: dayjs(currentDate).format(DATE_TIME_FORMAT),
|
||||
...elemDefault,
|
||||
};
|
||||
const expected = { startedAt: currentDate, submittedAt: currentDate, ...returnedFromService };
|
||||
|
||||
axiosStub.post.mockResolvedValue({ data: returnedFromService });
|
||||
return service.create({}).then(res => {
|
||||
expect(res).toMatchObject(expected);
|
||||
});
|
||||
});
|
||||
|
||||
it('should not create a ExamAttempt', async () => {
|
||||
axiosStub.post.mockRejectedValue(error);
|
||||
|
||||
return service
|
||||
.create({})
|
||||
.then()
|
||||
.catch(err => {
|
||||
expect(err).toMatchObject(error);
|
||||
});
|
||||
});
|
||||
|
||||
it('should update a ExamAttempt', async () => {
|
||||
const returnedFromService = {
|
||||
startedAt: dayjs(currentDate).format(DATE_TIME_FORMAT),
|
||||
submittedAt: dayjs(currentDate).format(DATE_TIME_FORMAT),
|
||||
status: 'BBBBBB',
|
||||
score: 1,
|
||||
...elemDefault,
|
||||
};
|
||||
|
||||
const expected = { startedAt: currentDate, submittedAt: currentDate, ...returnedFromService };
|
||||
axiosStub.put.mockResolvedValue({ data: returnedFromService });
|
||||
|
||||
return service.update(expected).then(res => {
|
||||
expect(res).toMatchObject(expected);
|
||||
});
|
||||
});
|
||||
|
||||
it('should not update a ExamAttempt', async () => {
|
||||
axiosStub.put.mockRejectedValue(error);
|
||||
|
||||
return service
|
||||
.update({})
|
||||
.then()
|
||||
.catch(err => {
|
||||
expect(err).toMatchObject(error);
|
||||
});
|
||||
});
|
||||
|
||||
it('should partial update a ExamAttempt', async () => {
|
||||
const patchObject = { status: 'BBBBBB', score: 1, ...new ExamAttempt() };
|
||||
const returnedFromService = Object.assign(patchObject, elemDefault);
|
||||
|
||||
const expected = { startedAt: currentDate, submittedAt: currentDate, ...returnedFromService };
|
||||
axiosStub.patch.mockResolvedValue({ data: returnedFromService });
|
||||
|
||||
return service.partialUpdate(patchObject).then(res => {
|
||||
expect(res).toMatchObject(expected);
|
||||
});
|
||||
});
|
||||
|
||||
it('should not partial update a ExamAttempt', async () => {
|
||||
axiosStub.patch.mockRejectedValue(error);
|
||||
|
||||
return service
|
||||
.partialUpdate({})
|
||||
.then()
|
||||
.catch(err => {
|
||||
expect(err).toMatchObject(error);
|
||||
});
|
||||
});
|
||||
|
||||
it('should return a list of ExamAttempt', async () => {
|
||||
const returnedFromService = {
|
||||
startedAt: dayjs(currentDate).format(DATE_TIME_FORMAT),
|
||||
submittedAt: dayjs(currentDate).format(DATE_TIME_FORMAT),
|
||||
status: 'BBBBBB',
|
||||
score: 1,
|
||||
...elemDefault,
|
||||
};
|
||||
const expected = { startedAt: currentDate, submittedAt: currentDate, ...returnedFromService };
|
||||
axiosStub.get.mockResolvedValue([returnedFromService]);
|
||||
return service.retrieve({ sort: {}, page: 0, size: 10 }).then(res => {
|
||||
expect(res).toContainEqual(expected);
|
||||
});
|
||||
});
|
||||
|
||||
it('should not return a list of ExamAttempt', async () => {
|
||||
axiosStub.get.mockRejectedValue(error);
|
||||
|
||||
return service
|
||||
.retrieve()
|
||||
.then()
|
||||
.catch(err => {
|
||||
expect(err).toMatchObject(error);
|
||||
});
|
||||
});
|
||||
|
||||
it('should delete a ExamAttempt', async () => {
|
||||
axiosStub.delete.mockResolvedValue({ ok: true });
|
||||
return service.delete(123).then(res => {
|
||||
expect(res.ok).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
||||
it('should not delete a ExamAttempt', async () => {
|
||||
axiosStub.delete.mockRejectedValue(error);
|
||||
|
||||
return service
|
||||
.delete(123)
|
||||
.then()
|
||||
.catch(err => {
|
||||
expect(err).toMatchObject(error);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,86 @@
|
||||
import axios from 'axios';
|
||||
|
||||
import { type IExamAttempt } from '@/shared/model/exam-attempt.model';
|
||||
import buildPaginationQueryOpts from '@/shared/sort/sorts';
|
||||
|
||||
const baseApiUrl = 'api/exam-attempts';
|
||||
|
||||
export default class ExamAttemptService {
|
||||
find(id: number): Promise<IExamAttempt> {
|
||||
return new Promise<IExamAttempt>((resolve, reject) => {
|
||||
axios
|
||||
.get(`${baseApiUrl}/${id}`)
|
||||
.then(res => {
|
||||
resolve(res.data);
|
||||
})
|
||||
.catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
retrieve(paginationQuery?: any): Promise<any> {
|
||||
return new Promise<any>((resolve, reject) => {
|
||||
axios
|
||||
.get(`${baseApiUrl}?${buildPaginationQueryOpts(paginationQuery)}`)
|
||||
.then(res => {
|
||||
resolve(res);
|
||||
})
|
||||
.catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
delete(id: number): Promise<any> {
|
||||
return new Promise<any>((resolve, reject) => {
|
||||
axios
|
||||
.delete(`${baseApiUrl}/${id}`)
|
||||
.then(res => {
|
||||
resolve(res);
|
||||
})
|
||||
.catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
create(entity: IExamAttempt): Promise<IExamAttempt> {
|
||||
return new Promise<IExamAttempt>((resolve, reject) => {
|
||||
axios
|
||||
.post(baseApiUrl, entity)
|
||||
.then(res => {
|
||||
resolve(res.data);
|
||||
})
|
||||
.catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
update(entity: IExamAttempt): Promise<IExamAttempt> {
|
||||
return new Promise<IExamAttempt>((resolve, reject) => {
|
||||
axios
|
||||
.put(`${baseApiUrl}/${entity.id}`, entity)
|
||||
.then(res => {
|
||||
resolve(res.data);
|
||||
})
|
||||
.catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
partialUpdate(entity: IExamAttempt): Promise<IExamAttempt> {
|
||||
return new Promise<IExamAttempt>((resolve, reject) => {
|
||||
axios
|
||||
.patch(`${baseApiUrl}/${entity.id}`, entity)
|
||||
.then(res => {
|
||||
resolve(res.data);
|
||||
})
|
||||
.catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,140 @@
|
||||
<template>
|
||||
<div>
|
||||
<h2 id="page-heading" data-cy="ExamAttemptHeading">
|
||||
<span id="exam-attempt">{{ t$('questionBankApp.examAttempt.home.title') }}</span>
|
||||
<div class="d-flex justify-content-end">
|
||||
<button class="btn btn-info me-2" @click="handleSyncList" :disabled="isFetching">
|
||||
<font-awesome-icon icon="sync" :spin="isFetching"></font-awesome-icon>
|
||||
<span>{{ t$('questionBankApp.examAttempt.home.refreshListLabel') }}</span>
|
||||
</button>
|
||||
<router-link :to="{ name: 'ExamAttemptCreate' }" custom v-slot="{ navigate }">
|
||||
<button
|
||||
@click="navigate"
|
||||
id="jh-create-entity"
|
||||
data-cy="entityCreateButton"
|
||||
class="btn btn-primary jh-create-entity create-exam-attempt"
|
||||
>
|
||||
<font-awesome-icon icon="plus"></font-awesome-icon>
|
||||
<span>{{ t$('questionBankApp.examAttempt.home.createLabel') }}</span>
|
||||
</button>
|
||||
</router-link>
|
||||
</div>
|
||||
</h2>
|
||||
<br />
|
||||
<div class="alert alert-warning" v-if="!isFetching && examAttempts?.length === 0">
|
||||
<span>{{ t$('questionBankApp.examAttempt.home.notFound') }}</span>
|
||||
</div>
|
||||
<div class="table-responsive" v-if="examAttempts?.length > 0">
|
||||
<table class="table table-striped" aria-describedby="examAttempts">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" @click="changeOrder('id')">
|
||||
<span>{{ t$('global.field.id') }}</span>
|
||||
<jhi-sort-indicator :current-order="propOrder" :reverse="reverse" :field-name="'id'"></jhi-sort-indicator>
|
||||
</th>
|
||||
<th scope="col" @click="changeOrder('startedAt')">
|
||||
<span>{{ t$('questionBankApp.examAttempt.startedAt') }}</span>
|
||||
<jhi-sort-indicator :current-order="propOrder" :reverse="reverse" :field-name="'startedAt'"></jhi-sort-indicator>
|
||||
</th>
|
||||
<th scope="col" @click="changeOrder('submittedAt')">
|
||||
<span>{{ t$('questionBankApp.examAttempt.submittedAt') }}</span>
|
||||
<jhi-sort-indicator :current-order="propOrder" :reverse="reverse" :field-name="'submittedAt'"></jhi-sort-indicator>
|
||||
</th>
|
||||
<th scope="col" @click="changeOrder('status')">
|
||||
<span>{{ t$('questionBankApp.examAttempt.status') }}</span>
|
||||
<jhi-sort-indicator :current-order="propOrder" :reverse="reverse" :field-name="'status'"></jhi-sort-indicator>
|
||||
</th>
|
||||
<th scope="col" @click="changeOrder('score')">
|
||||
<span>{{ t$('questionBankApp.examAttempt.score') }}</span>
|
||||
<jhi-sort-indicator :current-order="propOrder" :reverse="reverse" :field-name="'score'"></jhi-sort-indicator>
|
||||
</th>
|
||||
<th scope="col" @click="changeOrder('subject.name')">
|
||||
<span>{{ t$('questionBankApp.examAttempt.subject') }}</span>
|
||||
<jhi-sort-indicator :current-order="propOrder" :reverse="reverse" :field-name="'subject.name'"></jhi-sort-indicator>
|
||||
</th>
|
||||
<th scope="col" @click="changeOrder('user.login')">
|
||||
<span>{{ t$('questionBankApp.examAttempt.user') }}</span>
|
||||
<jhi-sort-indicator :current-order="propOrder" :reverse="reverse" :field-name="'user.login'"></jhi-sort-indicator>
|
||||
</th>
|
||||
<th scope="col"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="examAttempt in examAttempts" :key="examAttempt.id" data-cy="entityTable">
|
||||
<td>
|
||||
<router-link :to="{ name: 'ExamAttemptView', params: { examAttemptId: examAttempt.id } }">{{ examAttempt.id }}</router-link>
|
||||
</td>
|
||||
<td>{{ formatDateShort(examAttempt.startedAt) || '' }}</td>
|
||||
<td>{{ formatDateShort(examAttempt.submittedAt) || '' }}</td>
|
||||
<td>{{ t$('questionBankApp.AttemptStatus.' + examAttempt.status) }}</td>
|
||||
<td>{{ examAttempt.score }}</td>
|
||||
<td>
|
||||
<div v-if="examAttempt.subject">
|
||||
<router-link :to="{ name: 'SubjectView', params: { subjectId: examAttempt.subject.id } }">{{
|
||||
examAttempt.subject.name
|
||||
}}</router-link>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
{{ examAttempt.user ? examAttempt.user.login : '' }}
|
||||
</td>
|
||||
<td class="text-end">
|
||||
<div class="btn-group">
|
||||
<router-link :to="{ name: 'ExamAttemptView', params: { examAttemptId: examAttempt.id } }" custom v-slot="{ navigate }">
|
||||
<button @click="navigate" class="btn btn-info btn-sm details" data-cy="entityDetailsButton">
|
||||
<font-awesome-icon icon="eye"></font-awesome-icon>
|
||||
<span class="d-none d-md-inline">{{ t$('entity.action.view') }}</span>
|
||||
</button>
|
||||
</router-link>
|
||||
<router-link :to="{ name: 'ExamAttemptEdit', params: { examAttemptId: examAttempt.id } }" custom v-slot="{ navigate }">
|
||||
<button @click="navigate" class="btn btn-primary btn-sm edit" data-cy="entityEditButton">
|
||||
<font-awesome-icon icon="pencil-alt"></font-awesome-icon>
|
||||
<span class="d-none d-md-inline">{{ t$('entity.action.edit') }}</span>
|
||||
</button>
|
||||
</router-link>
|
||||
<b-button @click="prepareRemove(examAttempt)" variant="danger" class="btn btn-sm" data-cy="entityDeleteButton">
|
||||
<font-awesome-icon icon="times"></font-awesome-icon>
|
||||
<span class="d-none d-md-inline">{{ t$('entity.action.delete') }}</span>
|
||||
</b-button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<b-modal ref="removeEntity" id="removeEntity">
|
||||
<template #title>
|
||||
<span id="questionBankApp.examAttempt.delete.question" data-cy="examAttemptDeleteDialogHeading">{{
|
||||
t$('entity.delete.title')
|
||||
}}</span>
|
||||
</template>
|
||||
<div class="modal-body">
|
||||
<p id="jhi-delete-examAttempt-heading">{{ t$('questionBankApp.examAttempt.delete.question', { id: removeId }) }}</p>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div>
|
||||
<button type="button" class="btn btn-secondary" @click="closeDialog()">{{ t$('entity.action.cancel') }}</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
id="jhi-confirm-delete-examAttempt"
|
||||
data-cy="entityConfirmDeleteButton"
|
||||
@click="removeExamAttempt"
|
||||
>
|
||||
{{ t$('entity.action.delete') }}
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
</b-modal>
|
||||
<div v-show="examAttempts?.length > 0">
|
||||
<div class="d-flex justify-content-center">
|
||||
<jhi-item-count :page="page" :total="queryCount" :items-per-page="itemsPerPage"></jhi-item-count>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
<b-pagination size="md" :total-rows="totalItems" v-model="page" :per-page="itemsPerPage"></b-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" src="./exam-attempt.component.ts"></script>
|
||||
Reference in new issue
Block a user