tethys.backend/resources/js/Pages/Reviewer/Dataset/Review.vue

96 lines
3.5 KiB
Vue
Raw Normal View History

<script setup lang="ts">
import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
import SectionMain from '@/Components/SectionMain.vue';
import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
import { router, Head, usePage } from '@inertiajs/vue3';
import { computed, Ref } from 'vue';
import CardBox from '@/Components/CardBox.vue';
import BaseButton from '@/Components/BaseButton.vue';
import BaseButtons from '@/Components/BaseButtons.vue';
import { stardust } from '@eidellev/adonis-stardust/client';
import { mdiArrowLeftBoldOutline, mdiGlasses } from '@mdi/js';
import FormValidationErrors from '@/Components/FormValidationErrors.vue';
const props = defineProps({
dataset: {
type: Object,
default: () => ({}),
},
fields: {
type: Object,
required: true,
},
});
const flash: Ref<any> = computed(() => {
return usePage().props.flash;
});
const errors: Ref<any> = computed(() => {
return usePage().props.errors;
});
// const form = useForm({
// preferred_reviewer: '',
// preferred_reviewer_email: '',
// preferation: 'yes_preferation',
// // preferation: '',
// // isPreferationRequired: false,
// });
// const isPreferationRequired = computed(() => form.preferation === 'yes_preferation');
const handleSubmit = async (e) => {
e.preventDefault();
await router.put(stardust.route('reviewer.dataset.reviewUpdate', [props.dataset.id]));
// await form.put(stardust.route('dataset.releaseUpdate', [props.dataset.id]));
// // await form.put(stardust.route('editor.dataset.update', [props.dataset.id]));
};
</script>
<template>
<LayoutAuthenticated>
<Head title="Review dataset" />
<SectionMain>
<SectionTitleLineWithButton :icon="mdiGlasses" title="Review approved dataset" main>
<BaseButton :route-name="stardust.route('reviewer.dataset.list')" :icon="mdiArrowLeftBoldOutline" label="Back"
color="white" rounded-full small />
</SectionTitleLineWithButton>
<CardBox form @submit.prevent="handleSubmit">
<FormValidationErrors v-bind:errors="errors" />
<div v-if="flash && flash.warning" class="flex flex-col mt-6 animate-fade-in">
<div class="bg-yellow-500 border-l-4 border-orange-400 text-white p-4" role="alert">
<p class="font-bold">Be Warned</p>
<p>{{ flash.warning }}</p>
</div>
</div>
<div class="flex flex-col">
<div class="flex flex-row items-center justify-between dark:bg-slate-900 bg-gray-200 p-2 mb-2"
v-for="(fieldValue, field) in fields" :key="field">
<label :for="field" class="font-bold h-6 mt-3 text-xs leading-8 uppercase">{{ field }}</label>
<span class="text-sm text-gray-600" v-html="fieldValue"></span>
</div>
</div>
<template #footer>
<BaseButtons>
<!-- <BaseButton type="submit" color="info" label="Receive"
:class="{ 'opacity-25': router.processing }" :disabled="form.processing" /> -->
<BaseButton type="submit" color="info" label="Review" />
</BaseButtons>
</template>
</CardBox>
</SectionMain>
</LayoutAuthenticated>
</template>