fix(Dashboard widget Url): adds validation method for both input fields and fixes confirm delete dialog

This commit is contained in:
SimonGschnell
2024-11-05 11:32:02 +01:00
parent a9fe52d3c6
commit 37dffbba19
4 changed files with 109 additions and 36 deletions
+57 -27
View File
@@ -5,7 +5,10 @@ export default {
data: () => ({
title_input: "",
url_input: "",
invalidURL: false,
validation:{
invalidURL: false,
invalidTitel:false,
}
}),
mixins: [AbstractWidget],
computed: {
@@ -23,28 +26,37 @@ export default {
},
},
methods: {
isValidationSuccessfull(){
// validate the input fields
if (this.title_input.length === 0) {
this.$fhcAlert.alertError(this.$p.t("bookmark", "invalidTitel"));
this.validation.invalidTitel = true;
}
if (!URL.canParse(this.url_input)) {
this.$fhcAlert.alertError(this.$p.t("bookmark", "invalidUrl"));
this.validation.invalidURL = true;
}
return !Object.values(this.validation).some(value => value === true);
},
async fetchBookmarks() {
await this.$fhcApi.factory.bookmark
.getBookmarks()
.then((res) => res.data)
.then((result) => {
this.shared = result;
})
this.shared = result;
})
.catch(this.$fhcAlert.handleSystemError);
},
async confirmDelete() {
if ((await this.$fhcAlert.confirmDelete()) === false) return;
},
addLink() {
// reset is-invalid css on url input field
this.invalidURL = false;
if(!URL.canParse(this.url_input))
{
this.$fhcAlert.alertError(this.$p.t("bookmark", "invalidUrl"));
this.invalidURL = true;
return;
for(let key of Object.keys(this.validation)){
this.validation[key] = false;
}
// early return if validation failed
if (!this.isValidationSuccessfull()) return;
this.$fhcApi.factory.bookmark
.insert({
tag: this.config.tag,
@@ -54,28 +66,30 @@ export default {
.then((res) => res.data)
.then((result) => {
this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkAdded"));
// refetch the bookmarks to see the updates
this.fetchBookmarks();
})
.catch(this.$fhcAlert.handleSystemError);
// reset the values for the title and url inputs
this.title_input = "";
this.url_input = "";
// refetch the bookmarks to see the updates
this.fetchBookmarks();
},
async removeLink(bookmark_id) {
await this.confirmDelete();
this.$fhcApi.factory.bookmark
let isConfirmed = await this.$fhcAlert.confirmDelete();
// early return if the confirm dialog was not confirmed
if(!isConfirmed) return;
this.$fhcApi.factory.bookmark
.delete(bookmark_id)
.then((res) => res.data)
.then((result) => {
this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkDeleted"));
// refetch the bookmarks to see the updates
this.fetchBookmarks();
})
.catch(this.$fhcAlert.handleSystemError);
// refetch the bookmarks to see the updates
this.fetchBookmarks();
},
},
async mounted() {
@@ -92,11 +106,22 @@ export default {
<header><b>{{$p.t('bookmark','newLink')}}</b></header><br>
<div>
<input class="form-control form-control-sm" placeholder="Titel" type="text" v-model="title_input" name="title" maxlength="50" required>
<input required id="bookmark_link" class="form-control form-control-sm mt-2" :class="{'is-invalid':invalidURL}" type="url" placeholder="URL" v-model="url_input" name="url">
<div class="invalid-feedback">
{{$p.t("bookmark", "invalidUrl")}}.
<div class="form-group">
<input maxlength="255" required class="form-control form-control-sm" :class="{'is-invalid':validation.invalidTitel}" placeholder="Titel" type="text" v-model="title_input" name="title" >
<!-- validation html for titel -->
<div class="invalid-feedback">
{{$p.t("bookmark", "invalidTitel")}}.
</div>
</div>
<div class="form-group">
<input required id="bookmark_link" class="form-control form-control-sm mt-2" :class="{'is-invalid':validation.invalidURL}" type="url" placeholder="URL" v-model="url_input" name="url">
<!-- validation html for url -->
<div class="invalid-feedback">
{{$p.t("bookmark", "invalidUrl")}}.
</div>
</div>
<button class="btn btn-outline-secondary btn-sm w-100 mt-2" @click="addLink" type="button">{{$p.t('bookmark','saveLink')}}</button>
</div>
</div>
@@ -107,8 +132,13 @@ export default {
<header><b>{{ tagName }}</b></header>
<template v-if="!emptyBookmarks">
<div v-for="link in shared" :key="link.id" class="d-flex mt-2">
<a target="_blank" :href="link.url"><i class="fa fa-solid fa-arrow-up-right-from-square"></i> {{ link.title }}</a>
<a class="ms-auto" href="#" @click.prevent="removeLink(link.bookmark_id)" v-show="configMode"><i class="fa fa-regular fa-trash-can"></i></a>
<a target="_blank" :href="link.url">
<i class="fa fa-solid fa-arrow-up-right-from-square"></i>
{{ link.title }}
</a>
<a class="ms-auto" href="#" @click.prevent="removeLink(link.bookmark_id)" v-show="configMode">
<i class="fa fa-regular fa-trash-can" style="color: #e01b24;"></i>
</a>
</div>
</template>
<div v-else class="d-flex mt-2">
+1 -1
View File
@@ -59,7 +59,7 @@ require_once('dbupdate_3.4/25999_cis4_cms.php');
require_once('dbupdate_3.4/36530_bis_internationsalisierung_codextabelle_neuerungen.php');
require_once('dbupdate_3.4/34543_ux_template.php');
require_once('dbupdate_3.4/17513_Entwicklungsteam.php');
require_once('dbupdate_3.4/41134_bookmark_dashboardWidget.php');
require_once('dbupdate_3.4/41134_C4_bookmark_dashboardWidget.php');
require_once('dbupdate_3.4/28575_softwarebereitstellung.php');
require_once('dbupdate_3.4/41150_oe-pfad_db_view.php');
require_once('dbupdate_3.4/44031_stv_favorites.php');
@@ -2,8 +2,11 @@
if (!$result = @$db->db_query("SELECT to_regclass('dashboard.tbl_bookmark')"))
{
$qry = "BEGIN TRANSACTION;
if (!$db->db_query("BEGIN;"))
{
echo '<strong>wasnt able to start transaction for 41134_C4_bookmark_dashboardWidget: ' . $db->db_last_error() . '</strong><br>';
}
$qry = "
CREATE TABLE IF NOT EXISTS dashboard.tbl_bookmark(
bookmark_id BIGINT PRIMARY KEY,
uid VARCHAR(255) NOT NULL,
@@ -33,12 +36,32 @@ if (!$result = @$db->db_query("SELECT to_regclass('dashboard.tbl_bookmark')"))
GRANT SELECT, INSERT, UPDATE, DELETE ON dashboard.tbl_bookmark TO web;
GRANT SELECT, UPDATE ON dashboard.tbl_bookmark_sequence TO vilesci;
GRANT SELECT, UPDATE ON dashboard.tbl_bookmark_sequence TO web;
COMMIT TRANSACTION;";
";
if (!$db->db_query($qry))
echo '<strong>error occurred during tbl_bookmark creation: ' . $db->db_last_error() . '</strong><br>';
else
echo '<br>dashboard.tbl_bookmark and dashboard.tbl_bookmark_sequence was created';
{
// Rollback
if (!$db->db_query("ROLLBACK;"))
{
echo '<strong>wasnt able to rollback: ' . $db->db_last_error() . '</strong><br>';
}
else
{
echo '<strong>ROLLED BACK 41134_C4_bookmark_dashboardWidget</strong><br>';
}
echo '<strong>error occurred during tbl_bookmark creation: ' . $db->db_last_error() . '</strong><br>';
}
else
{
// Commit
if (!$db->db_query("COMMIT;"))
{
echo '<strong>wasnt able to commit: ' . $db->db_last_error() . '</strong><br>';
}
else
{
echo '<strong>COMMITED 41134_C4_bookmark_dashboardWidget</strong><br>';
}
echo '<br>dashboard.tbl_bookmark and dashboard.tbl_bookmark_sequence was created';
}
}
+20
View File
@@ -31524,6 +31524,26 @@ array(
)
)
),
array(
'app' => 'core',
'category' => 'bookmark',
'phrase' => 'invalidTitel',
'insertvon' => 'system',
'phrases' => array(
array(
'sprache' => 'German',
'text' => 'Ungültiger Titel',
'description' => '',
'insertvon' => 'system'
),
array(
'sprache' => 'English',
'text' => 'Invalid title',
'description' => '',
'insertvon' => 'system'
)
)
),
array(
'app' => 'core',
'category' => 'global',