feat: Adjust z-index values for map components, enhance ISBN validation message, and add dynamic placeholders for reference inputs, add additional mimetypes
All checks were successful
CI / container-job (push) Successful in 38s

This commit is contained in:
Kaimbacher 2025-02-17 16:08:36 +01:00
parent a3031169ca
commit a41b091214
9 changed files with 314 additions and 400 deletions

View file

@ -10,7 +10,6 @@ import BaseDivider from '@/Components/BaseDivider.vue';
import BaseButton from '@/Components/BaseButton.vue';
import BaseButtons from '@/Components/BaseButtons.vue';
import { stardust } from '@eidellev/adonis-stardust/client';
import mime from 'mime';
import FormField from '@/Components/FormField.vue';
import FormControl from '@/Components/FormControl.vue';
import standardTypes from 'mime/types/standard.js';
@ -24,10 +23,30 @@ defineProps({
ctrlKFocus: Boolean,
});
const customTypes: { [key: string]: string[] } = {
'application/vnd.opengeospatial.geopackage+sqlite3': ['gpkg'],
'text/plain': ['txt', 'asc', 'c', 'cc', 'h', 'srt'],
};
const isReadOnly: boolean = true;
const standardMimeTypes = Object.keys(standardTypes);
const otherMimeTypes = Object.keys(otherTypes);
const mimeTypes = [...standardMimeTypes, ...otherMimeTypes];
// const standardMimeTypes = Object.keys(standardTypes);
// const otherMimeTypes = Object.keys(otherTypes);
// const customMimeTypes = Object.keys(customTypes);
const mimeTypesMap = new Map<string, string[]>();
Object.entries(standardTypes).forEach(([mimeType, extensions]) => {
mimeTypesMap.set(mimeType, extensions);
});
Object.entries(otherTypes).forEach(([mimeType, extensions]) => {
mimeTypesMap.set(mimeType, extensions);
});
Object.entries(customTypes).forEach(([mimeType, extensions]) => {
mimeTypesMap.set(mimeType, extensions);
});
const mimeTypes = Array.from(mimeTypesMap.keys());
const file_extensions = reactive<Record<string, string>>({});
interface FormData {
@ -44,16 +63,8 @@ const form = useForm<FormData>({
enabled: true,
});
const mimetypeError = ref<string | null>(null);
// const newExtension = ref<string>('');
// const addFileExtension = () => {
// if (newExtension.value && !file_extensions[newExtension.value]) {
// file_extensions[newExtension.value] = newExtension.value;
// newExtension.value = '';
// }
// };
const addAlternateMimetype = () => {
form.alternate_mimetype.push("");
};
@ -68,7 +79,7 @@ function resetFileExtensions() {
}
const isValidMimeType = (mimeType: string): boolean => {
let extensions = mime.getExtension(mimeType)
let extensions = mimeTypesMap.get(mimeType) || null;
return extensions !== null;
};
@ -87,8 +98,9 @@ const selectResult = (mimeType: string) => {
// selectedIndex.value = -1;
if (form.name && isValidMimeType(form.name)) {
const extensions = mime.getAllExtensions(form.name) as Set<string>;
Array.from(extensions).forEach(extension => {
// const extensions = mime.getAllExtensions(form.name) as Set<string>;
const extensions = mimeTypesMap.get(mimeType);
extensions?.forEach(extension => {
file_extensions[extension] = extension;
});
} else {
@ -96,8 +108,6 @@ const selectResult = (mimeType: string) => {
}
};
const submit = async () => {
if (isValidForm()) {
await form.post(stardust.route('settings.mimetype.store'), {
@ -131,7 +141,7 @@ const isValidForm = (): boolean => {
<BaseButton :route-name="stardust.route('settings.mimetype.index')" :icon="mdiArrowLeftBoldOutline"
label="Back" color="white" rounded-full small />
</SectionTitleLineWithButton>
<CardBox form @submit.prevent="submit()">
<CardBox form>
<MimetypeInput @on-select-result="selectResult" @on-clear-input="clearInput" :transparent="transparent"
:borderless="borderless" :mimeTypes="mimeTypes" :isValidMimeType="isValidMimeType" />
<div v-if="mimetypeError" class="text-red-400 text-sm mt-1">
@ -162,18 +172,13 @@ const isValidForm = (): boolean => {
<BaseButton color="info" @click="addFileExtension" label="Add" />
</div> -->
<FormCheckRadioGroup v-model="form.file_extension" :options="file_extensions" name="file_extensions"
is-column allow-manual-adding manual-adding-placeholder="Enter file extension manually"/>
is-column allow-manual-adding manual-adding-placeholder="Enter additional file extension manually" />
</FormField>
<div class="text-red-400 text-sm" v-if="form.errors.file_extension">
{{ form.errors.file_extension }}
</div>
<!-- <FormField label="Add File Extension" wrap-body>
<FormControl v-model="newExtension" placeholder="Enter file extension" />
<BaseButton color="info" @click="addFileExtension" label="Add" />
</FormField> -->
<BaseDivider v-if="Object.keys(file_extensions).length > 0" />
<CardBox v-if="form.name" class="mb-6 shadow" has-table :icon="mdiImageText" title="Alternate Mimetypes"
@ -190,15 +195,6 @@ const isValidForm = (): boolean => {
'application/x-sqlite3'. Therefore, 'application/x-sqlite3' must be added as an alternate
mimetype.
</p>
<!-- <FormField label="Alias Mimetype" wrap-body>
<FormControl v-model="aliasMimetype" name="alias_mimetype" :error="form.errors.alias_mimetype"
:is-read-only=isReadOnly>
<div class="text-red-400 text-sm" v-if="form.errors.alias_mimetype">
{{ form.errors.alias_mimetype }}
</div>
</FormControl>
<BaseButton color="info" :icon="mdiEarthPlus" small @click.prevent="addAliasMimetype" />
</FormField> -->
</div>
<table class="table-fixed border-green-900" v-if="form.alternate_mimetype.length > 0">
<thead>
@ -234,7 +230,7 @@ const isValidForm = (): boolean => {
<template #footer>
<BaseButtons>
<BaseButton type="submit" color="info" label="Create" :class="{ 'opacity-25': form.processing }"
:disabled="form.processing" />
:disabled="form.processing" @click.prevent="submit()" />
</BaseButtons>
</template>
</CardBox>