Files
portal-api/resources/views/emails/customer/vm-creation-failed.blade.php
T
2025-07-24 16:18:27 +07:00

243 lines
12 KiB
PHP

<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Thông báo lỗi khởi tạo máy chủ ảo</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
color: #333;
margin: 0;
padding: 0;
background-color: #f4f4f4;
}
.container {
max-width: 600px;
margin: 0 auto;
}
.header {
text-align: center;
border-bottom: 2px solid #e74c3c;
padding-bottom: 20px;
margin-bottom: 30px;
}
.logo {
max-width: 150px;
margin-bottom: 15px;
}
.title {
color: #e74c3c;
font-size: 24px;
font-weight: bold;
margin: 0;
}
.alert-box {
background-color: #fdf2f2;
border: 1px solid #fecaca;
border-radius: 8px;
padding: 20px;
margin: 20px 0;
}
.alert-icon {
color: #e74c3c;
font-size: 24px;
margin-right: 10px;
}
.order-info {
background-color: #f8f9fa;
border-radius: 8px;
padding: 20px;
margin: 20px 0;
}
.info-row {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
padding: 8px 0;
border-bottom: 1px solid #e9ecef;
}
.info-row:last-child {
border-bottom: none;
}
.label {
font-weight: bold;
color: #495057;
}
.value {
color: #6c757d;
}
.support-section {
background-color: #e8f5e8;
border: 1px solid #c3e6c3;
border-radius: 8px;
padding: 20px;
margin: 20px 0;
text-align: center;
}
.support-title {
color: #28a745;
font-size: 18px;
font-weight: bold;
margin-bottom: 15px;
}
.contact-info {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
gap: 20px;
}
.contact-item {
text-align: center;
}
.contact-icon {
font-size: 24px;
margin-bottom: 5px;
}
.footer {
text-align: center;
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid #e9ecef;
color: #6c757d;
font-size: 14px;
}
.btn {
display: inline-block;
padding: 12px 24px;
background-color: #007bff;
color: white;
text-decoration: none;
border-radius: 5px;
margin: 10px 5px;
transition: background-color 0.3s;
}
.btn:hover {
background-color: #0056b3;
}
.btn-danger {
background-color: #e74c3c;
}
.btn-danger:hover {
background-color: #c0392b;
}
</style>
</head>
<body>
<table style="width: 100%; font-family: Montserrat,-apple-system;" role="presentation" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="background-color: #eceff1; font-family: Montserrat,-apple-system,sans-serif;" align="center">
<table style="width: 600px;" role="presentation" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td align="center">
<table style="width: 100%;" role="presentation" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="padding: 48px; text-align: center;"> </td>
</tr>
<tr style="background-color: #fff;">
<td style="text-align: center; padding: 20px; border-bottom: .5px solid #ececec;">
<img style="max-height: 100px;" src="{{ asset('images/logo.png') }}" alt="Logo">
</td>
</tr>
<tr>
<td style="border-radius: 4px; background-color: #fff; padding: 48px; text-align: left; font-family: Montserrat,-apple-system,sans-serif; font-size: 16px; line-height: 24px; color: #626262;">
<div class="header">
<h1 class="title">⚠️ Thông báo lỗi khởi tạo máy chủ ảo</h1>
</div>
<p>Xin chào <strong>{{ $customerName }}</strong>,</p>
<div class="alert-box">
<div style="display: flex; align-items: center;">
<span class="alert-icon">⚠️</span>
<div>
<h3 style="margin: 0; color: #e74c3c;">Rất tiếc, chúng tôi không thể khởi tạo máy chủ ảo cho đơn hàng của bạn.</h3>
</div>
</div>
</div>
<p>Chúng tôi đã nhận được thanh toán của bạn và đang cố gắng khởi tạo máy chủ ảo, tuy nhiên đã xảy ra lỗi trong quá trình này. Đội ngũ kỹ thuật của chúng tôi đã được thông báo và đang xử lý vấn đề.</p>
<div class="order-info">
<h3 style="margin-top: 0; color: #495057;">📋 Thông tin đơn hàng</h3>
<div class="info-row">
<span class="label">Mã đơn hàng:</span>
<span class="value">#{{ $orderNum }}</span>
</div>
<div class="info-row">
<span class="label">Sản phẩm:</span>
<span class="value">{{ $productName }}</span>
</div>
<div class="info-row">
<span class="label">Thời gian:</span>
<span class="value">{{ now()->format('d/m/Y H:i:s') }}</span>
</div>
</div>
<div class="support-section">
<h3 class="support-title">🆘 Cần hỗ trợ?</h3>
<p>Nếu bạn cần hỗ trợ hoặc có câu hỏi, vui lòng liên hệ với chúng tôi:</p>
<div class="contact-info">
<div class="contact-item">
<div class="contact-icon">📧</div>
<div><strong>Email:</strong></div>
<div>{{ $supportEmail }}</div>
</div>
<div class="contact-item">
<div class="contact-icon">📞</div>
<div><strong>Điện thoại:</strong></div>
<div>{{ $supportPhone }}</div>
</div>
</div>
<div style="margin-top: 20px;">
<a href="mailto:{{ $supportEmail }}?subject=Hỗ trợ đơn hàng #{{ $orderNum }}" class="btn">
📧 Gửi email hỗ trợ
</a>
<a href="{{ route('invoice.show', ['invoice_id' => $orderId, 'order_num' => $orderNum]) }}" class="btn btn-danger">
📋 Xem chi tiết đơn hàng
</a>
</div>
</div>
<div style="background-color: #fff3cd; border: 1px solid #ffeaa7; border-radius: 8px; padding: 15px; margin: 20px 0;">
<h4 style="margin: 0; color: #856404;">💡 Lưu ý quan trọng:</h4>
<ul style="margin: 10px 0; padding-left: 20px;">
<li>Tiền của bạn sẽ <strong>KHÔNG bị trừ</strong> cho đến khi máy chủ ảo được khởi tạo thành công</li>
<li>Chúng tôi sẽ tự động thử lại việc khởi tạo máy chủ ảo</li>
<li>Bạn sẽ nhận được email thông báo khi máy chủ ảo được khởi tạo thành công</li>
<li>Nếu vấn đề vẫn tiếp tục, chúng tôi sẽ liên hệ với bạn để hỗ trợ</li>
</ul>
</div>
<p>Cảm ơn bạn đã tin tưởng sử dụng dịch vụ của chúng tôi. Chúng tôi xin lỗi vì sự bất tiện này và sẽ cố gắng khắc phục sớm nhất có thể.</p>
<p>Trân trọng,<br>
<strong>Đội ngũ hỗ trợ kỹ thuật</strong></p>
<div class="footer">
<p>Email này được gửi tự động, vui lòng không trả lời email này.</p>
<p>Nếu bạn có câu hỏi, vui lòng liên hệ với chúng tôi qua email hoặc điện thoại.</p>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="padding: 48px; text-align: center;"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>