Skip to content

Commit

Permalink
BC-9137 - Update vue and vuetify (#3580)
Browse files Browse the repository at this point in the history 
* update vue
* update vuetify from 3.7.12 to 3.7.14
* fix file inputs for school policy and school terms forms dialogs because vuetify changed validation value from array to file or null
  • Loading branch information
@NFriedo
NFriedo authored Mar 7, 2025
1 parent dc70cb6 commit 85d3af8
Show file tree
Hide file tree
Showing 4 changed files with 35 additions and 49 deletions.
8 changes: 5 additions & 3 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,13 +37,13 @@
"socket.io-client": "^4.7.5",
"sortablejs": "^1.15.2",
"sortablejs-vue3": "^1.2.11",
"vue": "^3.4.21",
"vue": "^3.5.13",
"vue-dompurify-html": "^4.1.4",
"vue-i18n": "^9.14.2",
"vue-router": "^4.5.0",
"vue3-mq": "^3.1.3",
"vuedraggable": "^4.1.0",
"vuetify": "^3.7.12",
"vuetify": "^3.7.14",
"vuex": "^4.0.2"
},
"devDependencies": {
Expand Down
36 changes: 14 additions & 22 deletions src/components/organisms/administration/SchoolPolicyFormDialog.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@
</div>
</v-alert>
<v-file-input
v-model="file"
ref="input-file"
class="input-file mb-2"
data-testid="input-file"
Expand All @@ -41,9 +42,8 @@
t('pages.administration.school.index.schoolPolicy.hints.uploadFile')
"
:persistent-hint="true"
:rules="[rules.required, rules.mustBePdf, rules.maxSize(4194304)]"
:rules="[rules.required, rules.mustBePdf, rules.maxSize]"
@blur="onBlur"
@update:modelValue="onFileChange"
>
<template v-slot:append-inner>
<v-icon
Expand Down Expand Up @@ -96,33 +96,24 @@ export default defineComponent({
const policyForm: Ref<File[]> = ref([]);
const isValid: Ref<boolean> = ref(false);
const isTouched: Ref<boolean> = ref(false);
const files: Ref<File[]> = ref([]);
const file: Ref<File | null> = ref(null);
const school: ComputedRef<School> = computed(() => schoolsModule.getSchool);
const maxFileUploadSizeInKb = 4194304;
const rules = {
required: (value: File[]) =>
!(value.length === 0) || t("common.validation.required"),
mustBePdf: (value: File[]) =>
!(value.length === 0) ||
value[0].type === "application/pdf" ||
required: (value: File | null) =>
!!value || t("common.validation.required"),
mustBePdf: (value: File | null) =>
value?.type === "application/pdf" ||
t("pages.administration.school.index.schoolPolicy.validation.notPdf"),
maxSize: (bytes: number) => (value: File[]) =>
!(value.length === 0) ||
value[0].size <= bytes ||
maxSize: (value: File | null) =>
(!!value && value.size <= maxFileUploadSizeInKb) ||
t(
"pages.administration.school.index.schoolPolicy.validation.fileTooBig"
),
};
const onFileChange = (_files: File[] | File) => {
if (Array.isArray(_files)) {
files.value = _files;
} else {
files.value = [_files];
}
};
const onBlur = () => {
isTouched.value = true;
};
Expand All @@ -131,6 +122,7 @@ export default defineComponent({
policyForm.value = [];
isValid.value = false;
isTouched.value = false;
file.value = null;
};
const cancel = () => {
Expand All @@ -139,14 +131,14 @@ export default defineComponent({
};
const submit = async () => {
if (isValid.value) {
if (isValid.value && file.value) {
const newConsentVersion: CreateConsentVersionPayload = {
schoolId: school.value.id,
title: t("pages.administration.school.index.schoolPolicy.fileName"),
consentText: "",
consentTypes: ["privacy"],
publishedAt: currentDate().toString(),
consentData: (await toBase64(files.value[0])) as string,
consentData: (await toBase64(file.value)) as string,
};
emit("close");
Expand All @@ -168,13 +160,13 @@ export default defineComponent({
cancel,
submit,
onBlur,
onFileChange,
isValid,
isTouched,
policyForm,
school,
mdiAlert,
mdiFileReplaceOutline,
file,
};
},
});
Expand Down
36 changes: 14 additions & 22 deletions src/components/organisms/administration/SchoolTermsFormDialog.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@
</div>
</v-alert>
<v-file-input
v-model="file"
ref="input-file"
class="input-file mb-2"
data-testid="input-file"
Expand All @@ -40,9 +41,8 @@
t('pages.administration.school.index.termsOfUse.hints.uploadFile')
"
:persistent-hint="true"
:rules="[rules.required, rules.mustBePdf, rules.maxSize(4194304)]"
:rules="[rules.required, rules.mustBePdf, rules.maxSize]"
@blur="onBlur"
@update:modelValue="onFileChange"
>
<template v-slot:append-inner>
<v-icon
Expand Down Expand Up @@ -95,39 +95,31 @@ export default defineComponent({
const termsForm: Ref<File[]> = ref([]);
const isFormValid: Ref<boolean> = ref(false);
const isFormTouched: Ref<boolean> = ref(false);
const files: Ref<File[]> = ref([]);
const file: Ref<File | null> = ref(null);
const school: ComputedRef<School> = computed(() => schoolsModule.getSchool);
const maxFileUploadSizeInKb = 4194304;
const validationRules = {
required: (value: File[]) =>
!(value.length === 0) || t("common.validation.required"),
mustBePdf: (value: File[]) =>
!(value.length === 0) ||
value[0].type === "application/pdf" ||
required: (value: File | null) =>
!!value || t("common.validation.required"),
mustBePdf: (value: File | null) =>
value?.type === "application/pdf" ||
t("pages.administration.school.index.termsOfUse.validation.notPdf"),
maxSize: (bytes: number) => (value: File[]) =>
!(value.length === 0) ||
value[0].size <= bytes ||
maxSize: (value: File | null) =>
(!!value && value.size <= maxFileUploadSizeInKb) ||
t("pages.administration.school.index.termsOfUse.validation.fileTooBig"),
};
const onBlur = () => {
isFormTouched.value = true;
};
const onFileChange = (_files: File[] | File) => {
if (Array.isArray(_files)) {
files.value = _files;
} else {
files.value = [_files];
}
};
const resetForm = () => {
termsForm.value = [];
isFormValid.value = false;
isFormTouched.value = false;
file.value = null;
};
const cancel = () => {
Expand All @@ -136,14 +128,14 @@ export default defineComponent({
};
const submit = async () => {
if (isFormValid.value) {
if (isFormValid.value && file.value) {
const newConsentVersion: CreateConsentVersionPayload = {
schoolId: school.value.id,
title: t("pages.administration.school.index.termsOfUse.fileName"),
consentText: "",
consentTypes: ["termsOfUse"],
publishedAt: currentDate().toString(),
consentData: (await toBase64(files.value[0])) as string,
consentData: (await toBase64(file.value)) as string,
};
emit("close");
Expand All @@ -165,13 +157,13 @@ export default defineComponent({
cancel,
submit,
onBlur,
onFileChange,
isValid: isFormValid,
isTouched: isFormTouched,
termsForm,
school,
mdiAlert,
mdiFileReplaceOutline,
file,
};
},
});
Expand Down

0 comments on commit 85d3af8

Please sign in to comment.