<?php
$pageTitle = '我的电话套餐';
require_once dirname(__DIR__) . '/config.php';
requireLogin();

$pdo = getDB();
$stmt = $pdo->prepare("SELECT po.*, pp.name as package_name FROM phone_orders po LEFT JOIN phone_packages pp ON po.package_id = pp.id WHERE po.user_id = ? ORDER BY po.created_at DESC");
$stmt->execute([$_SESSION['user_id']]);
$orders = $stmt->fetchAll();

$site_url = rtrim(getSetting('site_url') ?? '', '/');

require_once dirname(__DIR__) . '/includes/header.php';
?>
<style>
.user-layout{display:flex;gap:28px;max-width:960px;margin:0 auto;padding:32px 16px}
.user-main{flex:1;min-width:0}
.order-card{background:#fff;border:1px solid #e8e0f5;border-radius:16px;margin-bottom:22px;overflow:hidden;box-shadow:0 2px 12px rgba(80,40,120,.07);transition:box-shadow .2s}
.order-card:hover{box-shadow:0 6px 28px rgba(80,40,120,.15)}
.order-header{background:linear-gradient(135deg,#1a0533 0%,#4a1080 100%);color:#fff;padding:14px 22px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.order-header .order-num{font-family:monospace;font-size:.88rem;opacity:.8}
.order-header .order-date{font-size:.78rem;opacity:.65}
.order-body{padding:22px}
.status-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 14px;border-radius:20px;font-size:.8rem;font-weight:600}
.status-pending{background:#fff3cd;color:#856404}
.status-paid{background:#cff4fc;color:#055160}
.status-completed{background:#d1e7dd;color:#0a3622}
.status-refunded{background:#f8d7da;color:#842029}
.status-failed{background:#f8d7da;color:#842029}
.info-section{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:1px solid #86efac;border-radius:14px;padding:22px;margin-top:18px}
.info-section .info-title{font-weight:700;font-size:1rem;color:#14532d;margin-bottom:4px;text-align:center;}
.info-section .info-hint{font-size:.8rem;color:#16a34a;margin-bottom:16px;text-align:center;}
.info-section img{max-width:200px;width:100%;border-radius:12px;border:4px solid #fff;box-shadow:0 4px 20px rgba(0,0,0,.15);margin:0 auto 16px;display:block}
.btn-dl{background:linear-gradient(135deg,#15803d,#16a34a);color:#fff;border:none;border-radius:8px;padding:8px 20px;font-weight:600;font-size:.85rem;text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:.2s;margin:4px}
.btn-dl:hover{background:linear-gradient(135deg,#14532d,#15803d);color:#fff;transform:translateY(-1px)}
.install-steps{background:#fff;border:1px solid #bbf7d0;border-radius:10px;padding:14px 18px;margin-top:14px;text-align:left}
.install-steps ol, .install-steps ul{margin:0;padding-left:20px;font-size:.82rem;color:#374151}
.empty-state{text-align:center;padding:60px 20px;color:#aaa}
.empty-state i{font-size:3rem;margin-bottom:16px;display:block;color:#e0d0ff}
.manual-info-box{background:#f8f9fa;border:1px solid #dee2e6;border-radius:8px;padding:16px;margin-top:18px;}
.manual-info-box .info-title{text-align:left;}
.manual-info-content{font-family:monospace;font-size:0.9rem;color:#333;word-break:break-all;padding:12px;background:#fff;border-radius:4px;white-space:pre-wrap;}
</style>

<div class="container py-4">
    <div class="row">
        <div class="col-md-3"><?php include 'sidebar.php'; ?></div>
        <div class="col-md-9">
            <div class="card border-0 shadow-sm">
                <div class="card-body p-4">
                    <h5 class="fw-bold mb-4"><i class="fas fa-phone me-2 text-primary"></i>我的电话套餐</h5>
                    <?php if (empty($orders)): ?>
                    <div class="empty-state">
                        <i class="fas fa-phone fa-3x mb-3 opacity-25"></i>
                        <p>暂无电话套餐订单</p>
                        <a href="/phone-packages.php" class="btn btn-primary">浏览套餐</a>
                    </div>
                    <?php else: ?>
                    <div class="row g-4">
                        <?php foreach ($orders as $order): ?>
                        <div class="col-12">
                            <div class="order-card">
                                <div class="order-header">
                                    <div>
                                        <div class="fw-bold"><?php echo htmlspecialchars($order['package_name'] ?? '套餐已下架'); ?></div>
                                        <div class="order-num"># <?php echo htmlspecialchars($order['order_number']); ?></div>
                                    </div>
                                    <div class="text-end">
                                        <span class="badge status-<?php echo $order['status']; ?>"><?php $sm = ['pending'=>'待支付','paid'=>'已支付','failed'=>'失败','completed'=>'已完成','refunded'=>'已退款']; echo $sm[$order['status']] ?? $order['status']; ?></span>
                                        <div class="order-date mt-1"><?php echo date('Y-m-d H:i', strtotime($order['created_at'])); ?></div>
                                    </div>
                                </div>
                                <div class="order-body">
                                    <div class="row align-items-center mb-3">
                                        <div class="col-md-6">
                                            <?php if ($order['phone_number']): ?>
                                            <div><i class="fas fa-phone me-1 text-success"></i> <?php echo htmlspecialchars($order['phone_number']); ?></div>
                                            <?php endif; ?>
                                        </div>
                                        <div class="col-md-6 text-end">
                                            <div class="fw-bold">$<?php echo number_format($order['amount'], 2); ?></div>
                                        </div>
                                    </div>

                                    <?php if ($order['status'] === 'completed'): ?>
                                        <?php if (!empty($order['qrcode_info'])): 
                                            $is_image = (filter_var($order['qrcode_info'], FILTER_VALIDATE_URL) || strpos($order['qrcode_info'], '/uploads/qrcodes/') === 0);
                                        ?>
                                            <div class="info-section">
                                                <?php if ($is_image): ?>
                                                    <div class="info-title"><i class="fas fa-qrcode me-2"></i>eSIM 二维码</div>
                                                    <div class="info-hint">请用手机相机扫描下方二维码，按提示安装 eSIM</div>
                                                    <img src="<?php echo htmlspecialchars($order['qrcode_info']); ?>" alt="eSIM 二维码">
                                                    <div>
                                                        <a href="<?php echo htmlspecialchars($order['qrcode_info']); ?>" download="Phone_eSIM_<?php echo htmlspecialchars($order['order_number']); ?>.png" class="btn-dl"><i class="fas fa-download"></i>下载二维码</a>
                                                        <a href="<?php echo htmlspecialchars($order['qrcode_info']); ?>" target="_blank" class="btn btn-sm btn-outline-success" style="margin:4px;"><i class="fas fa-external-link-alt me-1"></i>新窗口查看</a>
                                                    </div>
                                                <?php else: ?>
                                                    <div class="info-title"><i class="fas fa-keyboard me-2"></i>eSIM 激活信息</div>
                                                    <div class="manual-info-box" style="text-align:left;">
                                                        <div class="manual-info-content"><?php echo htmlspecialchars($order['qrcode_info']); ?></div>
                                                    </div>
                                                <?php endif; ?>
                                                <div class="install-steps">
                                                    <div class="fw-bold small mb-2 text-success"><i class="fas fa-info-circle me-1"></i>二维码安装说明</div>
                                                    <ol>
                                                        <li>确认您的设备支持 eSIM 功能（iPhone XS 及以上、部分 Android 旗舰机型）</li>
                                                        <li>进入手机"设置 → 蜂窝网络 / 移动网络 → 添加 eSIM / 添加移动套餐"</li>
                                                        <li>选择"扫描二维码"，对准上方二维码完成扫描</li>
                                                        <li>按照提示完成 eSIM 安装和激活，激活后即可使用</li>
                                                    </ol>
                                                </div>
                                            </div>
                                        <?php endif; ?>

                                        <?php if (!empty($order['card_number'])): ?>
                                            <div class="manual-info-box mt-3">
                                                <div class="info-title"><i class="fas fa-pencil-alt me-2"></i>手动安装eSIM信息</div>
                                                <div class="manual-info-content mt-2"><?php echo nl2br(htmlspecialchars($order['card_number'])); ?></div>
                                                <div class="install-steps">
                                                    <div class="fw-bold small mb-2 text-success"><i class="fas fa-info-circle me-1"></i>手动安装说明</div>
                                                    <ul>
                                                        <li>如果无法扫描二维码，您可以手动输入信息进行安装。</li>
                                                        <li>进入手机"设置 → 蜂窝网络 / 移动网络 → 添加 eSIM / 添加移动套餐"</li>
                                                        <li>选择"手动输入详细信息"或类似选项。</li>
                                                        <li>根据上方提供的信息，复制并粘贴到对应的输入框中（如 SM-DP+ 地址和激活码）。</li>
                                                        <li>按照提示完成 eSIM 安装和激活。</li>
                                                    </ul>
                                                </div>
                                            </div>
                                        <?php endif; ?>

                                    <?php elseif ($order['status'] === 'paid'): ?>
                                        <div class="alert alert-info mt-2 mb-0 py-2 px-3 small"><i class="fas fa-hourglass-half me-1"></i>已支付成功，管理员正在处理您的电话 eSIM，发货后将通过邮件通知您。</div>
                                    <?php elseif ($order['status'] === 'pending'): ?>
                                        <div class="mt-2"><a href="/checkout.php?order=<?php echo urlencode($order['order_number']); ?>" class="btn btn-primary btn-sm"><i class="fas fa-credit-card me-1"></i>立即支付</a></div>
                                    <?php endif; ?>
                                </div>
                            </div>
                        </div>
                        <?php endforeach; ?>
                    </div>
                    <?php endif; ?>
                </div>
            </div>
        </div>
    </div>
</div>

<?php require_once dirname(__DIR__) . '/includes/footer.php'; ?>
