From 23ff5f831a8ebe05a6e4a4884fdff25824706aac Mon Sep 17 00:00:00 2001
From: Cristiano Magro <cristiano.magro@vola.it>
Date: Tue, 07 Jan 2025 17:35:45 +0100
Subject: [PATCH] add modal dialog
---
10 - course project/xno-prj-cmp-01-starting-setup/src/components/learning-resource/AddResource.vue | 27 ++++++++++++++++++++++++++-
1 files changed, 26 insertions(+), 1 deletions(-)
diff --git a/10 - course project/xno-prj-cmp-01-starting-setup/src/components/learning-resource/AddResource.vue b/10 - course project/xno-prj-cmp-01-starting-setup/src/components/learning-resource/AddResource.vue
index be52373..5ddea32 100644
--- a/10 - course project/xno-prj-cmp-01-starting-setup/src/components/learning-resource/AddResource.vue
+++ b/10 - course project/xno-prj-cmp-01-starting-setup/src/components/learning-resource/AddResource.vue
@@ -1,5 +1,13 @@
<template>
- <h2>Add Resource</h2>
+ <base-dialog v-if="inputIsInvalid" title="Invalid Input" @close="confirmError">
+ <template #default>
+ <p>Sfortunatamente un input รจ invalido</p>
+ <p>Controlla che tutti gli input contengano qualche carattere valido.</p>
+ </template>
+ <template #action>
+ <base-button @click="confirmError">Okay</base-button>
+ </template>
+ </base-dialog>
<base-card>
<form @submit.prevent="submitData">
<div class="form-control">
@@ -30,14 +38,31 @@
<script>
export default {
inject: ['addResource'],
+ data() {
+ return {
+ inputIsInvalid: false,
+ };
+ },
methods: {
submitData() {
const enteredTitle = this.$refs.titleInput.value;
const enteredDescription = this.$refs.descInput.value;
const enteredUrl = this.$refs.linkInput.value;
+ if (
+ enteredTitle.trim() === '' ||
+ enteredDescription.trim() ||
+ enteredUrl.trim()
+ ) {
+ this.inputIsInvalid = true;
+ return;
+ }
+
this.addResource(enteredTitle, enteredDescription, enteredUrl);
},
+ confirmError() {
+ this.inputIsInvalid = false;
+ },
},
};
</script>
--
Gitblit v1.8.0