diff --git a/myproject/orders/templates/orders/order_form.html b/myproject/orders/templates/orders/order_form.html
index 97bad49..6f599ac 100644
--- a/myproject/orders/templates/orders/order_form.html
+++ b/myproject/orders/templates/orders/order_form.html
@@ -1303,8 +1303,8 @@ document.getElementById('save-customer-btn').addEventListener('click', function(
document.getElementById('customer-form-errors').innerHTML = '';
document.getElementById('customer-form-errors').style.display = 'none';
- // Показываем успешное сообщение
- alert(`Клиент "${data.name}" успешно создан!`);
+ // Показываем успешное уведомление (автоисчезающее)
+ showNotification(`✓ Клиент "${data.name}" успешно создан!`, 'success');
} else {
const errorDiv = document.getElementById('customer-form-errors');
errorDiv.innerHTML = '
' + data.error + '
';
@@ -1318,6 +1318,89 @@ document.getElementById('save-customer-btn').addEventListener('click', function(
errorDiv.style.display = 'block';
});
});
+
+/**
+ * Показывает автоисчезающее уведомление в правом верхнем углу формы заказа
+ * @param {string} message - Текст сообщения
+ * @param {string} type - Тип: 'success', 'error', 'info' (по умолчанию 'info')
+ * @param {number} duration - Время показа в миллисекундах (по умолчанию 4000)
+ */
+function showNotification(message, type = 'info', duration = 4000) {
+ const alertClass = type === 'error' ? 'alert-danger' : type === 'success' ? 'alert-success' : 'alert-info';
+ const icon = type === 'error' ? '⚠️' : type === 'success' ? '✓' : 'ℹ️';
+
+ // Создаём контейнер для уведомлений, если его нет
+ let container = document.getElementById('notifications-container');
+ if (!container) {
+ container = document.createElement('div');
+ container.id = 'notifications-container';
+ container.style.cssText = `
+ position: fixed;
+ top: 80px;
+ right: 20px;
+ z-index: 1050;
+ max-width: 400px;
+ `;
+ document.body.appendChild(container);
+ }
+
+ // Создаём уведомление
+ const notification = document.createElement('div');
+ notification.className = `alert ${alertClass}`;
+ notification.style.cssText = `
+ margin-bottom: 10px;
+ padding: 12px 15px;
+ border-radius: 4px;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.15);
+ animation: slideIn 0.3s ease-in-out;
+ `;
+ notification.innerHTML = `
+
+ ${icon}
+ ${message}
+
+ `;
+
+ // Добавляем в контейнер
+ container.appendChild(notification);
+
+ // Удаляем через указанное время
+ setTimeout(() => {
+ notification.style.animation = 'slideOut 0.3s ease-in-out';
+ setTimeout(() => {
+ notification.remove();
+ }, 300);
+ }, duration);
+}
+
+// CSS для анимаций уведомлений
+if (!document.getElementById('notification-styles')) {
+ const style = document.createElement('style');
+ style.id = 'notification-styles';
+ style.textContent = `
+ @keyframes slideIn {
+ from {
+ transform: translateX(400px);
+ opacity: 0;
+ }
+ to {
+ transform: translateX(0);
+ opacity: 1;
+ }
+ }
+ @keyframes slideOut {
+ from {
+ transform: translateX(0);
+ opacity: 1;
+ }
+ to {
+ transform: translateX(400px);
+ opacity: 0;
+ }
+ }
+ `;
+ document.head.appendChild(style);
+}