Refactor feedback handling across components: Replace alert and confirm calls with centralized feedback functions for improved user experience. Update various components to utilize showError, showSuccess, and confirmAction for consistent messaging and confirmation dialogs. Enhance UI responsiveness and maintainability by streamlining feedback logic.
This commit is contained in:
@@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<div class="contenthidden">
|
||||
<div class="contentscroll">
|
||||
<div class="admin-minigames-view">
|
||||
<div class="admin-header">
|
||||
<h1>{{ $t('admin.match3.title') }}</h1>
|
||||
<p>Verwalte Minigames, Level und Konfigurationen</p>
|
||||
@@ -14,7 +13,7 @@
|
||||
<div>
|
||||
<span class="workflow-hero__eyebrow">Arbeitsfluss</span>
|
||||
<h2>{{ $t('admin.match3.title') }}</h2>
|
||||
<p>Erst Level waehlen, dann Spielfeld und Ziele anpassen und erst am Ende speichern.</p>
|
||||
<p>Erst Level wählen, dann Spielfeld und Ziele anpassen und erst am Ende speichern.</p>
|
||||
</div>
|
||||
<div class="workflow-hero__meta">
|
||||
<span class="workflow-pill">{{ currentModeLabel }}</span>
|
||||
@@ -26,12 +25,12 @@
|
||||
<article class="workflow-card surface-card">
|
||||
<span class="workflow-card__step">1</span>
|
||||
<h3>Level waehlen</h3>
|
||||
<p>Bestehendes Level oeffnen oder sofort mit einer neuen Vorlage starten.</p>
|
||||
<p>Bestehendes Level öffnen oder sofort mit einer neuen Vorlage starten.</p>
|
||||
</article>
|
||||
<article class="workflow-card surface-card">
|
||||
<span class="workflow-card__step">2</span>
|
||||
<h3>Spielfeld bauen</h3>
|
||||
<p>Groesse, Zuege, Kacheln und Layout zuerst festziehen, bevor Ziele folgen.</p>
|
||||
<p>Größe, Züge, Kacheln und Layout zuerst festziehen, bevor Ziele folgen.</p>
|
||||
</article>
|
||||
<article class="workflow-card surface-card">
|
||||
<span class="workflow-card__step">3</span>
|
||||
@@ -79,7 +78,7 @@
|
||||
<article class="admin-summary-card surface-card">
|
||||
<span class="admin-summary-card__label">Spielfeld</span>
|
||||
<strong>{{ levelForm.boardWidth }} x {{ levelForm.boardHeight }}</strong>
|
||||
<p>{{ levelForm.moveLimit }} Zuege, {{ levelForm.tileTypes.length }} aktive Tile-Typen.</p>
|
||||
<p>{{ levelForm.moveLimit }} Züge, {{ levelForm.tileTypes.length }} aktive Tile-Typen.</p>
|
||||
</article>
|
||||
<article class="admin-summary-card surface-card">
|
||||
<span class="admin-summary-card__label">Objectives</span>
|
||||
@@ -601,14 +600,13 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SimpleTabs from '../../components/SimpleTabs.vue';
|
||||
import apiClient from '../../utils/axios.js';
|
||||
import { showError, showSuccess } from '@/utils/feedback.js';
|
||||
import { confirmAction, showError, showSuccess } from '@/utils/feedback.js';
|
||||
|
||||
export default {
|
||||
name: 'AdminMinigamesView',
|
||||
@@ -1016,15 +1014,20 @@ export default {
|
||||
},
|
||||
|
||||
async deleteLevel(levelId) {
|
||||
if (confirm('Möchtest du dieses Level wirklich löschen?')) {
|
||||
try {
|
||||
await apiClient.delete(`/api/admin/minigames/match3/levels/${levelId}`);
|
||||
this.loadLevels();
|
||||
showSuccess(this, 'Level wurde geloescht.');
|
||||
} catch (error) {
|
||||
console.error('Fehler beim Löschen des Levels:', error);
|
||||
showError(this, 'Fehler beim Loeschen des Levels');
|
||||
}
|
||||
const confirmed = await confirmAction(this, {
|
||||
title: 'Level löschen',
|
||||
message: 'Möchtest du dieses Level wirklich löschen?'
|
||||
});
|
||||
if (!confirmed) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
await apiClient.delete(`/api/admin/minigames/match3/levels/${levelId}`);
|
||||
this.loadLevels();
|
||||
showSuccess(this, 'Level wurde gelöscht.');
|
||||
} catch (error) {
|
||||
console.error('Fehler beim Löschen des Levels:', error);
|
||||
showError(this, 'Fehler beim Löschen des Levels');
|
||||
}
|
||||
},
|
||||
|
||||
@@ -1047,14 +1050,20 @@ export default {
|
||||
},
|
||||
|
||||
removeObjective(index) {
|
||||
if (confirm('Möchtest du dieses Objective wirklich löschen?')) {
|
||||
confirmAction(this, {
|
||||
title: 'Ziel löschen',
|
||||
message: 'Möchtest du dieses Objective wirklich löschen?'
|
||||
}).then((confirmed) => {
|
||||
if (!confirmed) {
|
||||
return;
|
||||
}
|
||||
this.levelForm.objectives.splice(index, 1);
|
||||
|
||||
// Aktualisiere die Reihenfolge
|
||||
this.levelForm.objectives.forEach((objective, idx) => {
|
||||
objective.order = idx + 1;
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
async loadObjectivesForLevel(levelId) {
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<div class="contenthidden">
|
||||
<div class="contentscroll">
|
||||
<div class="services-status-view">
|
||||
<div class="admin-header">
|
||||
<h1>{{ $t('admin.servicesStatus.title') }}</h1>
|
||||
<p>{{ $t('admin.servicesStatus.description') }}</p>
|
||||
@@ -95,8 +94,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- WebSocket Log Dialog -->
|
||||
<WebSocketLogDialog ref="webSocketLogDialog" />
|
||||
</div>
|
||||
@@ -481,4 +479,3 @@ export default {
|
||||
color: #c62828;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<div class="contenthidden">
|
||||
<div class="contentscroll">
|
||||
<div class="admin-taxi-tools-view">
|
||||
<div class="admin-header">
|
||||
<h1>{{ $t('admin.taxiTools.title') }}</h1>
|
||||
<p>{{ $t('admin.taxiTools.description') }}</p>
|
||||
@@ -367,8 +366,7 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Message Dialog -->
|
||||
<MessageDialog ref="messageDialog" />
|
||||
</div>
|
||||
@@ -378,6 +376,7 @@
|
||||
import SimpleTabs from '../../components/SimpleTabs.vue';
|
||||
import MessageDialog from '../../dialogues/standard/MessageDialog.vue';
|
||||
import apiClient from '../../utils/axios.js';
|
||||
import { confirmAction, showError, showSuccess } from '@/utils/feedback.js';
|
||||
|
||||
// Matrix: erlaubte Haus-Tür-Richtungen je Tile-Typ und Ecke
|
||||
// Richtungen: bottom, right, top, left
|
||||
@@ -1216,10 +1215,10 @@ export default {
|
||||
|
||||
// Erfolgsmeldung anzeigen
|
||||
const message = isUpdate ? 'admin.taxiTools.mapEditor.updateSuccess' : 'admin.taxiTools.mapEditor.createSuccess';
|
||||
this.$refs.messageDialog.open(`tr:${message}`);
|
||||
showSuccess(this, `tr:${message}`);
|
||||
} catch (error) {
|
||||
console.error('Fehler beim Speichern der Map:', error);
|
||||
alert('Fehler beim Speichern der Map');
|
||||
showError(this, 'Fehler beim Speichern der Map');
|
||||
}
|
||||
},
|
||||
|
||||
@@ -1247,16 +1246,20 @@ export default {
|
||||
},
|
||||
|
||||
async deleteMap(mapId) {
|
||||
if (confirm('Möchtest du diese Map wirklich löschen?')) {
|
||||
try {
|
||||
await apiClient.delete(`/api/taxi-maps/maps/${mapId}`);
|
||||
this.loadMaps();
|
||||
|
||||
// Erfolgsmeldung anzeigen
|
||||
this.$refs.messageDialog.open('tr:admin.taxiTools.mapEditor.deleteSuccess');
|
||||
} catch (error) {
|
||||
console.error('Fehler beim Löschen der Map:', error);
|
||||
}
|
||||
const confirmed = await confirmAction(this, {
|
||||
title: 'Map löschen',
|
||||
message: 'Möchtest du diese Map wirklich löschen?'
|
||||
});
|
||||
if (!confirmed) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
await apiClient.delete(`/api/taxi-maps/maps/${mapId}`);
|
||||
this.loadMaps();
|
||||
showSuccess(this, 'tr:admin.taxiTools.mapEditor.deleteSuccess');
|
||||
} catch (error) {
|
||||
console.error('Fehler beim Löschen der Map:', error);
|
||||
showError(this, 'Fehler beim Löschen der Map');
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1692,4 +1695,4 @@ export default {
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<div class="contenthidden">
|
||||
<div class="contentscroll">
|
||||
<div class="create-npc-page">
|
||||
<div class="create-npc-view">
|
||||
<h1>{{ $t('admin.falukant.createNPC.title') }}</h1>
|
||||
|
||||
@@ -102,7 +101,6 @@
|
||||
<div v-if="error" class="error-message">
|
||||
{{ error }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<div class="contenthidden">
|
||||
<div class="contentscroll falukant-map-admin">
|
||||
<div class="falukant-map-admin">
|
||||
<div class="admin-header">
|
||||
<h1>{{ $t('admin.falukant.map.title') }}</h1>
|
||||
<p>{{ $t('admin.falukant.map.description') }}</p>
|
||||
@@ -212,13 +211,13 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import apiClient from '@/utils/axios.js';
|
||||
import SimpleTabs from '@/components/SimpleTabs.vue';
|
||||
import { confirmAction, showError } from '@/utils/feedback.js';
|
||||
|
||||
export default {
|
||||
name: 'AdminFalukantMapRegionsView',
|
||||
@@ -469,17 +468,21 @@ export default {
|
||||
await this.loadConnections();
|
||||
} catch (error) {
|
||||
console.error('Error saving region distance:', error);
|
||||
alert(this.$t('admin.falukant.map.errorSaveConnection'));
|
||||
showError(this, this.$t('admin.falukant.map.errorSaveConnection'));
|
||||
}
|
||||
},
|
||||
async deleteConnection(id) {
|
||||
if (!confirm(this.$t('admin.falukant.map.confirmDeleteConnection'))) return;
|
||||
const confirmed = await confirmAction(this, {
|
||||
title: this.$t('admin.falukant.map.connectionsTitle'),
|
||||
message: this.$t('admin.falukant.map.confirmDeleteConnection')
|
||||
});
|
||||
if (!confirmed) return;
|
||||
try {
|
||||
await apiClient.delete(`/api/admin/falukant/region-distances/${id}`);
|
||||
await this.loadConnections();
|
||||
} catch (error) {
|
||||
console.error('Error deleting region distance:', error);
|
||||
alert(this.$t('admin.falukant.map.errorDeleteConnection'));
|
||||
showError(this, this.$t('admin.falukant.map.errorDeleteConnection'));
|
||||
}
|
||||
},
|
||||
regionName(id) {
|
||||
@@ -635,5 +638,3 @@ export default {
|
||||
.btn.mini.icon {
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user