75 lines
4.0 KiB
PHP
75 lines
4.0 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ủ</title>
|
|
<style>
|
|
* { box-sizing: border-box; }
|
|
body { font-family: 'Segoe UI', Arial, sans-serif; background: #f0f4f8; margin: 0; padding: 0; }
|
|
.wrapper { max-width: 620px; margin: 30px auto; }
|
|
.card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
|
|
.header { background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%); padding: 36px 40px; text-align: center; }
|
|
.header .icon { font-size: 48px; margin-bottom: 12px; }
|
|
.header h1 { color: #fff; margin: 0 0 6px; font-size: 24px; font-weight: 700; }
|
|
.header p { color: #fecaca; margin: 0; font-size: 14px; }
|
|
.body { padding: 36px 40px; }
|
|
.greeting { font-size: 16px; color: #374151; margin-bottom: 20px; line-height: 1.6; }
|
|
.section-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #9ca3af; margin: 28px 0 10px; }
|
|
.info-table { width: 100%; border-collapse: collapse; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; }
|
|
.info-table td { padding: 10px 16px; font-size: 14px; border-bottom: 1px solid #f3f4f6; }
|
|
.info-table tr:last-child td { border-bottom: none; }
|
|
.info-table td:first-child { color: #6b7280; width: 45%; }
|
|
.info-table td:last-child { font-weight: 600; color: #111827; }
|
|
.error-box { background: #fef2f2; border: 1.5px solid #fca5a5; border-radius: 10px; padding: 16px 20px; margin-top: 12px; font-size: 14px; color: #991b1b; line-height: 1.6; }
|
|
.action-box { text-align: center; margin-top: 28px; }
|
|
.btn { display: inline-block; background: #2563eb; color: #fff; text-decoration: none; padding: 12px 28px; border-radius: 8px; font-weight: 600; font-size: 15px; }
|
|
.notice { background: #eff6ff; border-left: 3px solid #3b82f6; padding: 12px 16px; border-radius: 0 6px 6px 0; font-size: 13px; color: #1e40af; margin-top: 24px; line-height: 1.6; }
|
|
.footer { text-align: center; padding: 20px 40px; border-top: 1px solid #f3f4f6; font-size: 12px; color: #9ca3af; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="wrapper">
|
|
<div class="card">
|
|
<div class="header">
|
|
<div class="icon">⚠️</div>
|
|
<h1>Lỗi khởi tạo máy chủ ảo</h1>
|
|
<p>Đơn hàng #{{ $orderNum ?? 'N/A' }} - Cần xử lý</p>
|
|
</div>
|
|
|
|
<div class="body">
|
|
<p class="greeting">
|
|
Xin chào <strong>{{ $customerName ?? 'Quý khách' }}</strong>,<br>
|
|
Rất tiếc, hệ thống gặp sự cố khi khởi tạo máy chủ ảo cho đơn hàng của bạn. Đội ngũ kỹ thuật của chúng tôi đã được thông báo và sẽ xử lý sớm nhất có thể.
|
|
</p>
|
|
|
|
<div class="section-label">Thông tin đơn hàng</div>
|
|
<table class="info-table">
|
|
<tr><td>Mã đơn hàng</td><td>#{{ $orderNum ?? 'N/A' }}</td></tr>
|
|
<tr><td>Sản phẩm</td><td>{{ $productName ?? 'N/A' }}</td></tr>
|
|
</table>
|
|
|
|
<div class="section-label">Chi tiết lỗi</div>
|
|
<div class="error-box">
|
|
{{ $errorMessage ?? 'Lỗi không xác định' }}
|
|
</div>
|
|
|
|
<div class="action-box">
|
|
<a href="{{ $invoiceUrl ?? '#' }}" class="btn">Xem đơn hàng của bạn</a>
|
|
</div>
|
|
|
|
<div class="notice">
|
|
Nếu cần hỗ trợ khẩn cấp, vui lòng liên hệ:<br>
|
|
📧 Email: <strong>{{ $supportEmail ?? 'support@tgs.com.vn' }}</strong><br>
|
|
📞 Điện thoại: <strong>{{ $supportPhone ?? '' }}</strong>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
Email này được gửi tự động. Vui lòng không trả lời email này.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|