Bot Discord - Commit completo con todos los cambios
This commit is contained in:
209
templates/admin/translations.php
Executable file
209
templates/admin/translations.php
Executable file
@@ -0,0 +1,209 @@
|
||||
<?php
|
||||
$pageTitle = 'Traducciones: ' . htmlspecialchars($language['name']);
|
||||
require_once __DIR__ . '/../../includes/url_helper.php';
|
||||
require_once __DIR__ . '/../header.php';
|
||||
?>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h1 class="h3 mb-0">
|
||||
<span data-translate="edit_translations">Editar Traducciones</span>:
|
||||
<?php echo htmlspecialchars($language['native_name'] . ' ' . $language['flag_emoji']); ?>
|
||||
</h1>
|
||||
<div>
|
||||
<a href="languages.php" class="btn btn-outline-secondary me-2" data-translate="back_to_languages">Volver a Idiomas</a>
|
||||
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addTranslationModal">
|
||||
<i class="bi bi-plus-lg"></i> <span data-translate="add_translation">Agregar Traducción</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if (!empty($message)): ?>
|
||||
<div class="alert alert-success"><?php echo htmlspecialchars($message); ?></div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($error)): ?>
|
||||
<div class="alert alert-danger"><?php echo htmlspecialchars($error); ?></div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="card shadow-sm mb-4">
|
||||
<div class="card-body">
|
||||
<form method="POST" action="?action=translations&code=<?php echo urlencode($language['code']); ?>">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 40%;" data-translate="translation_key">Clave</th>
|
||||
<th style="width: 55%;" data-translate="translation_value">Valor</th>
|
||||
<th style="width: 5%;" data-translate="actions">Acciones</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php if (empty($translations)): ?>
|
||||
<tr>
|
||||
<td colspan="3" class="text-center py-4 text-muted" data-translate="no_translations_found">
|
||||
No se encontraron traducciones para este idioma.
|
||||
</td>
|
||||
</tr>
|
||||
<?php else: ?>
|
||||
<?php foreach ($translations as $translation): ?>
|
||||
<tr>
|
||||
<td>
|
||||
<input type="text" class="form-control form-control-sm"
|
||||
value="<?php echo htmlspecialchars($translation['key']); ?>"
|
||||
readonly>
|
||||
</td>
|
||||
<td>
|
||||
<input type="text" class="form-control"
|
||||
name="translations[<?php echo $translation['id']; ?>]"
|
||||
value="<?php echo htmlspecialchars($translation['value']); ?>">
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<a href="?action=delete_translation&code=<?php echo urlencode($language['code']); ?>&id=<?php echo $translation['id']; ?>"
|
||||
class="btn btn-sm btn-outline-danger delete-translation"
|
||||
title="Eliminar traducción">
|
||||
<i class="bi bi-trash"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<?php if (!empty($translations)): ?>
|
||||
<div class="d-grid gap-2 d-md-flex justify-content-md-end mt-3">
|
||||
<button type="submit" name="update_translations" class="btn btn-primary" data-translate="save_changes">
|
||||
Guardar Cambios
|
||||
</button>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sección de ayuda -->
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-header" data-translate="help_section">Ayuda</div>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" data-translate="how_to_use">¿Cómo usar las traducciones?</h5>
|
||||
<p data-translate="translation_help_1">
|
||||
Las claves de traducción se utilizan en todo el sistema para mostrar textos en diferentes idiomas.
|
||||
</p>
|
||||
<p data-translate="translation_help_2">
|
||||
Para usar una traducción en el código, utiliza la función <code>__('clave_de_traduccion')</code>.
|
||||
</p>
|
||||
<p data-translate="translation_help_3">
|
||||
En las plantillas, usa el atributo <code>data-translate="clave_de_traduccion"</code> en cualquier elemento HTML.
|
||||
</p>
|
||||
<div class="alert alert-info mt-3">
|
||||
<i class="bi bi-info-circle-fill me-2"></i>
|
||||
<span data-translate="translation_tip">
|
||||
Consejo: Usa nombres descriptivos para las claves de traducción, como 'welcome_message' o 'save_button'.
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal para agregar nueva traducción -->
|
||||
<div class="modal fade" id="addTranslationModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<form method="POST" action="?action=translations&code=<?php echo urlencode($language['code']); ?>">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" data-translate="add_translation">Agregar Traducción</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="mb-3">
|
||||
<label for="new_key" class="form-label" data-translate="translation_key">Clave</label>
|
||||
<input type="text" class="form-control" id="new_key" name="key" required
|
||||
placeholder="Ej: welcome_message" pattern="[a-z0-9_]+(\.?[a-z0-9_]+)*"
|
||||
title="Usa solo letras minúsculas, números y guiones bajos">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="new_value" class="form-label" data-translate="translation_value">Valor</label>
|
||||
<input type="text" class="form-control" id="new_value" name="value" required
|
||||
placeholder="Ingresa el texto traducido">
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" data-translate="cancel">Cancelar</button>
|
||||
<button type="submit" name="add_translation" class="btn btn-primary" data-translate="add">Agregar</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal de confirmación para eliminar traducción -->
|
||||
<div class="modal fade" id="deleteTranslationModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" data-translate="confirm_delete">Confirmar eliminación</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body" data-translate="are_you_sure_delete_translation">
|
||||
¿Estás seguro de que deseas eliminar esta traducción?
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" data-translate="cancel">Cancelar</button>
|
||||
<a href="#" id="confirmDeleteBtn" class="btn btn-danger" data-translate="delete">Eliminar</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Manejar clic en botón de eliminar traducción
|
||||
document.querySelectorAll('.delete-translation').forEach(button => {
|
||||
button.addEventListener('click', function(e) {
|
||||
e.preventDefault();
|
||||
const deleteUrl = this.getAttribute('href');
|
||||
const modal = new bootstrap.Modal(document.getElementById('deleteTranslationModal'));
|
||||
|
||||
// Actualizar el enlace de confirmación
|
||||
document.getElementById('confirmDeleteBtn').href = deleteUrl;
|
||||
|
||||
// Mostrar el modal
|
||||
modal.show();
|
||||
});
|
||||
});
|
||||
|
||||
// Validar formulario de agregar traducción
|
||||
const addTranslationForm = document.querySelector('#addTranslationModal form');
|
||||
if (addTranslationForm) {
|
||||
addTranslationForm.addEventListener('submit', function(e) {
|
||||
const keyInput = this.querySelector('input[name="key"]');
|
||||
if (keyInput && !/^[a-z0-9_]+(\.[a-z0-9_]+)*$/.test(keyInput.value)) {
|
||||
e.preventDefault();
|
||||
alert('La clave solo puede contener letras minúsculas, números, puntos y guiones bajos.');
|
||||
keyInput.focus();
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
});
|
||||
}
|
||||
|
||||
// Traducir elementos con el atributo data-translate
|
||||
const elements = document.querySelectorAll('[data-translate]');
|
||||
elements.forEach(element => {
|
||||
const key = element.getAttribute('data-translate');
|
||||
if (translations[key]) {
|
||||
if (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA' || element.tagName === 'SELECT') {
|
||||
element.placeholder = translations[key];
|
||||
} else if (element.tagName === 'BUTTON' || element.tagName === 'A') {
|
||||
element.textContent = translations[key];
|
||||
} else {
|
||||
element.textContent = translations[key];
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<?php require_once __DIR__ . '/../footer.php'; ?>
|
||||
Reference in New Issue
Block a user