<?php
$title = '空间秒赞';
include __DIR__ . '/head.php';

if (($conf['qzone_open'] ?? ($conf['qzone_enabled'] ?? '0')) != '1') {
    include __DIR__ . '/foot.php';
    exit;
}

$qzone_manage_subtitle = trim($conf['qzone_manage_subtitle'] ?? '');

$user_id = intval($userrow['zid'] ?? 0);
// 仅当对应业务开启且账号库内已有 QQ 时，才提供该导入来源（无号不显示）
$cloudImportEnabled = false;
$dgImportEnabled = false;
if ($CLOUD_ENABLED) {
    $cloudImportEnabled = intval($DB->getColumn("SELECT COUNT(*) FROM pre_qq WHERE zid='{$user_id}'")) > 0;
}
if ($DG_ENABLED) {
    $dgImportEnabled = intval($DB->getColumn("SELECT COUNT(*) FROM pre_dg_qq WHERE zid='{$user_id}'")) > 0;
}
$importSourceCount = ($cloudImportEnabled ? 1 : 0) + ($dgImportEnabled ? 1 : 0);

$qqList = $DB->getAll("SELECT * FROM " . DBQZ . "qzone_qq WHERE user_id='{$user_id}' ORDER BY id DESC");
?>

<div class="space-y-4">
    <div class="bg-white rounded-2xl border border-indigo-100 shadow-sm p-4 md:p-5">
        <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3">
            <div>
                <h1 class="text-xl font-bold text-gray-800"><i class="fas fa-bolt text-yellow-500 mr-2"></i>空间秒赞管理</h1>
                <p class="text-sm text-gray-500 mt-1"><?php echo $qzone_manage_subtitle !== '' ? $qzone_manage_subtitle : '自动点赞、评论、签到、发说说，管理秒赞账号状态'; ?></p>
            </div>
            <div class="flex flex-wrap items-center gap-2">
                <button onclick="showLoginModal()" class="px-4 py-2 bg-indigo-600 hover:bg-indigo-700 text-white rounded-lg text-sm font-medium transition-colors shadow-sm">
                    <i class="fas fa-plus mr-1"></i>扫码添加QQ
                </button>
                <?php if ($importSourceCount > 0): ?>
                <button onclick="showImportSourceModal()" class="px-4 py-2 bg-sky-600 hover:bg-sky-700 text-white rounded-lg text-sm font-medium transition-colors shadow-sm">
                    <i class="fas fa-cloud-download-alt mr-1"></i>从账号库添加
                </button>
                <?php endif; ?>
                <button onclick="showImportCkModal()" class="px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-white rounded-lg text-sm font-medium transition-colors shadow-sm">
                    <i class="fas fa-key mr-1"></i>手动导入CK
                </button>
            </div>
        </div>
    </div>

    <div id="qq_list_container" class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-3">
            <?php if (empty($qqList)): ?>
                <div class="col-span-full p-10 text-center text-gray-400">
                    <i class="fab fa-qq text-4xl mb-2 text-indigo-500"></i>
                    <p>暂无QQ账号，点击上方按钮添加</p>
                </div>
            <?php else: ?>
                <?php foreach ($qqList as $qq): ?>
                    <?php
                    $isVip = strtotime($qq['vip_time']) > time();
                    ?>
                    <div class="relative bg-white rounded-2xl border border-indigo-100 shadow-sm overflow-hidden hover:shadow-lg hover:-translate-y-0.5 transition-all" id="qq_item_<?php echo $qq['id']; ?>">
                        <div class="px-3 py-2 bg-gradient-to-r from-indigo-50 to-white border-b border-indigo-100 flex items-center justify-between min-h-[72px]">
                            <div class="flex items-center gap-3 min-w-0">
                                <div class="relative flex-shrink-0">
                                    <img src="https://q1.qlogo.cn/g?b=qq&nk=<?php echo $qq['qq']; ?>&s=100" class="w-14 h-14 rounded-full border-2 border-indigo-100 object-cover shadow-sm" onerror="this.src='https://q1.qlogo.cn/g?b=qq&nk=0&s=100'">
                                    <div class="absolute -bottom-1 -right-1 w-4 h-4 <?php echo $qq['login_status'] == 0 ? 'bg-green-500' : 'bg-gray-400'; ?> rounded-full border-2 border-white"></div>
                                </div>
                                <div class="min-w-0">
                                    <div class="font-semibold text-gray-900 text-base truncate"><?php echo $qq['qq']; ?></div>
                                    <div class="mt-1">
                                        <?php if ($qq['login_status'] == 0): ?>
                                            <span class="px-2.5 py-1 inline-flex items-center text-xs font-medium rounded-full bg-gradient-to-r from-green-400 to-green-500 text-white shadow-sm">
                                                <span class="w-1.5 h-1.5 bg-white rounded-full mr-1.5 animate-pulse"></span>在线
                                            </span>
                                        <?php else: ?>
                                            <span class="px-2.5 py-1 inline-flex items-center text-xs font-medium rounded-full bg-gradient-to-r from-gray-400 to-gray-500 text-white shadow-sm">
                                                <span class="w-1.5 h-1.5 bg-white rounded-full mr-1.5"></span>离线
                                            </span>
                                        <?php endif; ?>
                                    </div>
                                </div>
                            </div>
                            <div class="flex items-center gap-1.5 ml-2">
                                <?php if ($isVip): ?>
                                    <span class="official_vip_text">VIP</span></p>
                                <?php endif; ?>
                            </div>
                        </div>

                        <div class="flex min-h-[70px]">
                            <div class="w-2/3 border-t border-gray-100">
                                <div class="px-3 py-2 text-xs text-gray-500 border-b border-gray-100">
                                    <i class="fas fa-user mr-1"></i>昵称: <span class="text-gray-700"><?php echo htmlspecialchars($qq['nickname']); ?></span>
                                </div>
                                <div class="px-3 py-2 text-xs text-gray-500">
                                    <i class="fas fa-crown mr-1"></i>VIP: <span class="<?php echo $isVip ? 'text-yellow-700' : 'text-gray-600'; ?>"><?php echo $isVip ? htmlspecialchars($qq['vip_time']) : '未开通'; ?></span>
                                </div>
                            </div>
                            <div class="flex-1 border-t border-l border-gray-100 flex flex-col items-center justify-center text-xs text-gray-700 bg-gray-50/60">
                                <div class="text-[11px] text-gray-400 mb-0.5">状态</div>
                                <?php if ($qq['login_status'] == 0): ?>
                                    <?php
                                    $login_time = strtotime($qq['login_time']);
                                    $expire_time = $login_time + (48 * 3600); // 48小时
                                    $remaining = $expire_time - time();
                                    if ($remaining > 0) {
                                        $hours = floor($remaining / 3600);
                                        $mins = floor(($remaining % 3600) / 60);
                                        $time_text = $hours > 0 ? "约{$hours}小时失效" : ($mins > 0 ? "约{$mins}分钟失效" : "即将失效");
                                        echo '<span class="font-medium text-green-600">在线 · ' . $time_text . '</span>';
                                    } else {
                                        echo '<span class="font-medium text-yellow-600">在线 · <i class="fas fa-sync-alt mr-0.5"></i>建议更新</span>';
                                    }
                                    ?>
                                <?php else: ?>
                                    <span class="font-medium text-red-500">离线失效</span>
                                <?php endif; ?>
                            </div>
                        </div>

                        <div class="border-t border-gray-100 flex justify-around py-1.5 px-2 bg-white">
                            <a href="qzone_config.php?qid=<?php echo $qq['id']; ?>" class="flex-1 flex flex-col items-center justify-center py-2 hover:bg-indigo-50 rounded-lg transition-colors group">
                                <i class="fas fa-cog text-indigo-500 text-sm mb-0.5 group-hover:scale-110 transition-transform"></i>
                                <span class="text-xs text-gray-600 group-hover:text-indigo-600">配置</span>
                            </a>
                            <button onclick="showLogModal(<?php echo $qq['id']; ?>)" class="flex-1 flex flex-col items-center justify-center py-2 hover:bg-blue-50 rounded-lg transition-colors group">
                                <i class="fas fa-list-alt text-blue-500 text-sm mb-0.5 group-hover:scale-110 transition-transform"></i>
                                <span class="text-xs text-gray-600 group-hover:text-blue-600">日志</span>
                            </button>
                            <?php
                            $cloudFeatureEnabled = (($conf['qzone_cloud_update_status'] ?? '1') == '1');
                            $cloudVipRequired = (($conf['qzone_cloud_cookie'] ?? '0') == '1');
                            $canCloudSync = $cloudFeatureEnabled && (!$cloudVipRequired || $isVip);
                            ?>
                            <button onclick="showUpdateLoginModal(<?php echo $qq['id']; ?>, '<?php echo $qq['qq']; ?>', <?php echo $canCloudSync ? 'true' : 'false'; ?>)" class="flex-1 flex flex-col items-center justify-center py-2 hover:bg-emerald-50 rounded-lg transition-colors group">
                                <i class="fas fa-sync-alt text-emerald-500 text-sm mb-0.5 group-hover:scale-110 transition-transform"></i>
                                <span class="text-xs text-gray-600 group-hover:emerald-600">更新状态</span>
                            </button>
                            <button onclick="deleteQQ(<?php echo $qq['id']; ?>)" class="flex-1 flex flex-col items-center justify-center py-2 hover:bg-red-50 rounded-lg transition-colors group">
                                <i class="fas fa-trash-alt text-red-500 text-sm mb-0.5 group-hover:scale-110 transition-transform"></i>
                                <span class="text-xs text-gray-600 group-hover:text-red-600">删除</span>
                            </button>
                        </div>
                    </div>
                <?php endforeach; ?>
            <?php endif; ?>
    </div>

    <div class="bg-white rounded-2xl border border-indigo-100 shadow-sm p-4 md:p-5">
        <h3 class="font-bold text-gray-800 mb-2"><i class="fas fa-info-circle text-blue-500 mr-1"></i>使用说明</h3>
        <ul class="text-sm text-gray-600 space-y-1">
            <li>1. 点击"添加QQ账号"，使用手机QQ扫码登录</li>
            <li>2. 登录成功后，点击"配置"开启需要的功能</li>
            <li>3. Cookie有效期约两天，失效后需重新登录</li>
            <li>4. VIP用户可使用更多高级功能</li>
        </ul>
    </div>
</div>

<style>
.official_vip_text {
    display: inline-block;
    font-size: 11px;
    font-weight: bold;
    color: #FFFFFF;
    background: linear-gradient(90deg, #FFB400, #FFD100, #FFB400);
    background-size: 200% 100%;
    height: 16px;
    line-height: 16px;
    padding: 0 5px;
    border-radius: 2px;
    vertical-align: middle;
    margin-left: 4px;
    animation: official_flow 1.2s linear infinite;
}

@keyframes official_flow {
    0% { background-position: 0 0; }
    100% { background-position: 200% 0; }
}
</style>

<div id="login_modal" class="fixed inset-0 bg-black/50 hidden items-center justify-center z-50">
    <div class="bg-white rounded-2xl w-full max-w-sm mx-4 shadow-2xl">
        <div class="p-4 border-b flex justify-between items-center">
            <h3 class="font-bold" id="login_modal_title">添加QQ账号</h3>
            <button onclick="hideLoginModal()" class="text-gray-500 hover:text-gray-700 text-xl">&times;</button>
        </div>
        <div class="p-4 text-center">
            <div class="mb-3">
                <div class="flex items-center border border-gray-200 rounded-lg overflow-hidden">
                    <button id="tab_qr" class="flex-1 py-2 text-sm bg-gray-100" onclick="switchLoginTab('qr')">扫码</button>
                    <button id="tab_pwd" class="flex-1 py-2 text-sm" onclick="switchLoginTab('pwd')">密码</button>
                </div>
            </div>
            <div id="login_node_wrap" class="text-left hidden">
                <label class="text-sm text-gray-600">登录节点</label>
                <select id="login_node" class="mt-1 w-full border border-gray-200 rounded-lg px-3 py-2 text-sm">
                    <option value="0">主站</option>
                </select>
                <p class="text-xs text-amber-600 mt-1 text-center" id="login_node_hint">若环境异常请更换节点尝试</p>
            </div>
            <div id="qr_container" class="space-y-3">
                <div id="qr_img_wrap">
                    <p class="text-gray-500 mb-4">正在获取二维码...</p>
                </div>
            </div>
            <div id="pwd_container" class="hidden space-y-3">
                <div>
                    <label class="block text-sm text-gray-700 mb-1">QQ</label>
                    <input id="pwd_qq" type="text" class="w-full border border-gray-200 rounded-lg px-3 py-2 text-sm" placeholder="请输入QQ">
                </div>
                <div>
                    <label class="block text-sm text-gray-700 mb-1">密码</label>
                    <input id="pwd_pwd" type="password" class="w-full border border-gray-200 rounded-lg px-3 py-2 text-sm" placeholder="请输入密码">
                </div>
                <div id="sms_container" class="hidden">
                    <label class="block text-sm text-gray-700 mb-1" id="sms_label">验证码</label>
                    <div class="flex space-x-2">
                        <input id="pwd_sms" type="text" class="flex-1 border border-gray-200 rounded-lg px-3 py-2 text-sm" placeholder="短信验证码">
                        <button id="sms_send_btn" class="px-3 py-2 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-lg text-xs" onclick="sendSmsCode()">获取验证码</button>
                    </div>
                </div>
                <button id="pwd_submit_btn" class="w-full py-2 bg-indigo-600 hover:bg-indigo-700 text-white rounded-lg text-sm" onclick="submitPwdFlow()">开始</button>
            </div>
            <p class="text-sm text-gray-500 mt-2" id="login_modal_tip">请使用手机QQ扫一扫对准二维码（不支持相册识别）</p>
        </div>
        <div class="p-4 border-t text-center">
            <div id="login_modal_cloud_wrap" class="hidden mb-2">
                <button id="login_modal_cloud_btn" onclick="syncCloudStatusFromModal()" class="w-full py-2 bg-sky-600 hover:bg-sky-700 text-white rounded-lg text-sm font-medium transition-colors">
                    <i class="fas fa-cloud-download-alt mr-1"></i>从云端版更新状态
                </button>
            </div>
            <button id="qr_refresh_btn" onclick="refreshQR()" class="text-blue-600 hover:text-blue-800">
                <i class="fas fa-sync-alt mr-1"></i>刷新二维码
            </button>
        </div>
    </div>
</div>

<div id="cap_modal" class="fixed inset-0 z-50 hidden">
    <div class="fixed inset-0 bg-black/50 backdrop-blur-sm" onclick="hideCapModal()"></div>
    <div class="fixed inset-0 flex items-center justify-center p-4 pointer-events-none">
        <div class="bg-white rounded-2xl shadow-2xl w-full max-w-md max-h-[85vh] flex flex-col pointer-events-auto">
            <div class="flex items-center justify-between px-5 py-4 border-b border-gray-100 bg-gray-50/50 rounded-t-2xl">
                <h3 class="text-lg font-semibold text-gray-800">安全验证</h3>
                <button onclick="hideCapModal()" class="w-8 h-8 flex items-center justify-center rounded-full hover:bg-gray-200 text-gray-400 hover:text-gray-600 transition-colors"><i class="fas fa-times"></i></button>
            </div>
            <div id="cap_modal_body" class="p-0 overflow-hidden text-center"></div>
        </div>
    </div>
</div>

<div id="log_modal" class="fixed inset-0 bg-black/50 hidden items-center justify-center z-50">
    <div class="bg-white rounded-2xl w-full max-w-2xl mx-4 shadow-2xl">
        <div class="p-4 border-b flex justify-between items-center">
            <h3 class="font-bold">操作日志</h3>
            <button onclick="hideLogModal()" class="text-gray-500 hover:text-gray-700 text-xl">&times;</button>
        </div>
        <div class="px-4 pt-3">
            <div class="relative">
                <input type="text" id="log_search_kw" class="w-full border border-gray-200 rounded-lg pl-9 pr-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="模糊搜索：类型/内容/时间" oninput="filterLogList()">
                <i class="fas fa-search absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 text-xs"></i>
            </div>
        </div>
        <div class="p-4 max-h-96 overflow-y-auto" id="log_modal_content">
            <p class="text-center text-gray-400">加载中...</p>
        </div>
    </div>
</div>

<div id="import_ck_modal" class="fixed inset-0 bg-black/50 hidden items-center justify-center z-50">
    <div class="bg-white rounded-2xl w-full max-w-md mx-4 shadow-2xl">
        <div class="p-4 border-b flex justify-between items-center">
            <h3 class="font-bold">手动导入CK</h3>
            <button onclick="hideImportCkModal()" class="text-gray-500 hover:text-gray-700 text-xl">&times;</button>
        </div>
        <div class="p-4 space-y-4">
            <div class="flex items-center justify-between mb-2">
                <label class="text-sm font-medium text-gray-700">导入模式</label>
                <div class="flex items-center space-x-2">
                    <span class="text-sm text-gray-500">单账号</span>
                    <label class="relative inline-flex items-center cursor-pointer">
                        <input type="checkbox" id="import_batch_mode" class="sr-only peer" onchange="toggleBatchMode()">
                        <div class="w-9 h-5 bg-gray-200 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-emerald-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-emerald-600"></div>
                    </label>
                    <span class="text-sm text-gray-500">批量</span>
                </div>
            </div>

            <div id="import_single_mode">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Cookie</label>
                    <textarea id="import_cookie" rows="4" class="w-full border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500" placeholder="请粘贴Cookie内容"></textarea>
                    <p class="text-xs text-gray-500 mt-1">需要 skey、p_skey，并自动从 uin/p_uin/pt2gguin 识别QQ号</p>
                </div>
            </div>

            <div id="import_batch_mode_content" class="hidden">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">批量数据 <span class="text-red-500">*</span></label>
                    <textarea id="import_batch_data" rows="6" class="w-full border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500 font-mono whitespace-nowrap" placeholder="格式1：QQ----Cookie&#10;2444444----skey=@xxx; p_skey=xxx;&#10;&#10;格式2：Cookie（自动识别QQ号）&#10;pt2gguin=o2444444; uin=o2444444; skey=@xxx; p_skey=xxx;"></textarea>
                    <p class="text-xs text-gray-500 mt-2 flex items-center">
                        <i class="fas fa-info-circle mr-1.5 text-emerald-400"></i>
                        每行一条数据；可用 <span class="font-mono bg-gray-200 px-1 rounded mx-1">QQ----Cookie</span> 或直接粘贴 Cookie
                    </p>
                </div>
                
                <div id="import_batch_progress" class="hidden mt-4">
                    <div class="flex justify-between text-xs mb-1">
                        <span class="text-gray-600">导入进度 <span id="batch_progress_text">0/0</span></span>
                        <span class="text-gray-600" id="batch_progress_percent">0%</span>
                    </div>
                    <div class="w-full bg-gray-200 rounded-full h-2">
                        <div class="bg-emerald-600 h-2 rounded-full transition-all duration-300" id="batch_progress_bar" style="width: 0%"></div>
                    </div>
                    <div id="batch_result_msg" class="text-xs mt-2 max-h-24 overflow-y-auto font-mono bg-gray-50 p-2 rounded border border-gray-100 text-gray-600">
                    </div>
                </div>
            </div>

            <button onclick="submitImportCk()" class="w-full py-2.5 bg-emerald-600 hover:bg-emerald-700 text-white rounded-lg font-medium transition-colors">
                <i class="fas fa-save mr-1"></i>保存CK
            </button>
        </div>
    </div>
</div>

<div id="import_src_modal" class="fixed inset-0 bg-black/50 hidden items-center justify-center z-50">
    <div class="bg-white rounded-2xl w-full max-w-md mx-4 shadow-2xl">
        <div class="p-4 border-b flex justify-between items-center">
            <h3 class="font-bold">从账号库添加</h3>
            <button onclick="hideImportSourceModal()" class="text-gray-500 hover:text-gray-700 text-xl">&times;</button>
        </div>
        <div class="p-4 space-y-4">
            <div id="import_src_type_wrap" class="<?php echo $importSourceCount <= 1 ? 'hidden' : ''; ?>">
                <label class="block text-sm font-medium text-gray-700 mb-1">账号来源</label>
                <select id="import_src_type" class="w-full border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-sky-500" onchange="onImportSourceTypeChange()">
                    <?php if ($cloudImportEnabled): ?>
                    <option value="cloud">云端版</option>
                    <?php endif; ?>
                    <?php if ($dgImportEnabled): ?>
                    <option value="dg">代挂版</option>
                    <?php endif; ?>
                </select>
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1" id="import_src_qq_label">选择QQ</label>
                <select id="import_src_qq" class="w-full border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-sky-500">
                    <option value="">请选择QQ</option>
                </select>
                <p class="text-xs text-gray-500 mt-1" id="import_src_hint">仅展示你账号库内的QQ</p>
            </div>
            <button onclick="submitImportSourceQQ()" class="w-full py-2.5 bg-sky-600 hover:bg-sky-700 text-white rounded-lg font-medium transition-colors">
                <i class="fas fa-download mr-1"></i>导入到秒赞版
            </button>
        </div>
    </div>
</div>

<script src="./assets/js/qzone.js?ver=<?php echo VERSION ?>"></script>
<script>
initQzone(<?php echo $cloudImportEnabled ? 'true' : 'false'; ?>, <?php echo $dgImportEnabled ? 'true' : 'false'; ?>);
</script>

<?php include __DIR__ . '/foot.php'; ?>
