<?php
ob_start();
requireAdmin();

$success = '';
$error = '';

// 获取当前配置
$qq_app_id = getSiteConfig('oauth_qq_app_id') ?: '';
$qq_app_key = getSiteConfig('oauth_qq_app_key') ?: '';
$qq_callback = getSiteConfig('oauth_qq_callback') ?: SITE_URL . 'api/qq_callback.php';

$gitee_client_id = getSiteConfig('oauth_gitee_client_id') ?: '';
$gitee_client_secret = getSiteConfig('oauth_gitee_client_secret') ?: '';
$gitee_callback = getSiteConfig('oauth_gitee_callback') ?: SITE_URL . 'api/gitee_callback.php';

$union_api_url = getSiteConfig('oauth_union_api_url') ?: '';
$union_app_id = getSiteConfig('oauth_union_app_id') ?: '';
$union_app_key = getSiteConfig('oauth_union_app_key') ?: '';
$union_callback = getSiteConfig('oauth_union_callback') ?: SITE_URL . 'api/union_callback.php';

// 获取当前激活的 Tab
$active_tab = $_GET['tab'] ?? 'qq';

// 处理表单提交
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $action = $_POST['action'] ?? '';
    
    if ($action === 'save_qq') {
        $app_id = trim($_POST['qq_app_id'] ?? '');
        $app_key = trim($_POST['qq_app_key'] ?? '');
        $redirect_uri = trim($_POST['qq_redirect_uri'] ?? '');
        
        updateSiteConfig('oauth_qq_app_id', $app_id);
        updateSiteConfig('oauth_qq_app_key', $app_key);
        updateSiteConfig('oauth_qq_callback', $redirect_uri);
        
        $success = 'QQ 配置保存成功';
        $qq_app_id = $app_id;
        $qq_app_key = $app_key;
        $qq_callback = $redirect_uri;
    }
    
    if ($action === 'save_gitee') {
        $client_id = trim($_POST['gitee_client_id'] ?? '');
        $client_secret = trim($_POST['gitee_client_secret'] ?? '');
        $redirect_uri = trim($_POST['gitee_redirect_uri'] ?? '');
        
        updateSiteConfig('oauth_gitee_client_id', $client_id);
        updateSiteConfig('oauth_gitee_client_secret', $client_secret);
        updateSiteConfig('oauth_gitee_callback', $redirect_uri);
        
        $success = 'Gitee 配置保存成功';
        $gitee_client_id = $client_id;
        $gitee_client_secret = $client_secret;
        $gitee_callback = $redirect_uri;
    }
    
    if ($action === 'save_union') {
        $api_url = trim($_POST['union_api_url'] ?? '');
        $app_id = trim($_POST['union_app_id'] ?? '');
        $app_key = trim($_POST['union_app_key'] ?? '');
        $callback_url = trim($_POST['union_callback_url'] ?? '');
        
        updateSiteConfig('oauth_union_api_url', $api_url);
        updateSiteConfig('oauth_union_app_id', $app_id);
        updateSiteConfig('oauth_union_app_key', $app_key);
        updateSiteConfig('oauth_union_callback', $callback_url);
        
        $success = '彩虹聚合登录配置保存成功';
        $union_api_url = $api_url;
        $union_app_id = $app_id;
        $union_app_key = $app_key;
        $union_callback = $callback_url;
    }
}
?>
<div class="quick-login-config-container">
    <!-- 页面头部 -->
    <div class="page-header">
        <div>
            <h2>
                <img src="https://api.iconify.design/mdi:cog.svg?color=%23667eea" width="26" height="26" style="vertical-align: middle; margin-right: 10px;" alt="">
                登录配置
            </h2>
            <p class="page-desc">配置第三方登录的 App ID、App Secret 等参数</p>
        </div>
        <div class="header-actions">
            <a href="?page=quick_login" class="btn btn-secondary">
                <img src="https://api.iconify.design/mdi:arrow-left.svg?color=currentColor" width="18" height="18" style="margin-right: 6px;" alt="">
                返回管理
            </a>
        </div>
    </div>
    
    <?php if ($success): ?>
        <div class="alert alert-success">
            <img src="https://api.iconify.design/mdi:check-circle.svg?color=%2310b981" width="20" height="20" style="margin-right: 8px;" alt="">
            <?php echo $success; ?>
        </div>
    <?php endif; ?>
    <?php if ($error): ?>
        <div class="alert alert-error">
            <img src="https://api.iconify.design/mdi:alert-circle.svg?color=%23ef4444" width="20" height="20" style="margin-right: 8px;" alt="">
            <?php echo $error; ?>
        </div>
    <?php endif; ?>
    
    <!-- Tab 切换 -->
    <div class="config-tabs">
        <a href="?page=quick_login_config&tab=qq" class="tab-item <?php echo $active_tab == 'qq' ? 'active' : ''; ?>">
            <img src="https://api.iconify.design/mdi:qqchat.svg?color=<?php echo $active_tab == 'qq' ? 'white' : '%236b7280'; ?>" width="18" height="18" style="margin-right: 6px;" alt="">
            QQ登录
        </a>
        <a href="?page=quick_login_config&tab=gitee" class="tab-item <?php echo $active_tab == 'gitee' ? 'active' : ''; ?>">
            <img src="https://api.iconify.design/mdi:git.svg?color=<?php echo $active_tab == 'gitee' ? 'white' : '%236b7280'; ?>" width="18" height="18" style="margin-right: 6px;" alt="">
            Gitee登录
        </a>
        <a href="?page=quick_login_config&tab=union" class="tab-item <?php echo $active_tab == 'union' ? 'active' : ''; ?>">
            <img src="https://api.iconify.design/mdi:puzzle.svg?color=<?php echo $active_tab == 'union' ? 'white' : '%236b7280'; ?>" width="18" height="18" style="margin-right: 6px;" alt="">
            彩虹聚合登录
        </a>
    </div>
    
    <div class="form-card">
        <?php if ($active_tab == 'qq'): ?>
            <!-- QQ 登录配置 -->
            <form method="POST">
                <input type="hidden" name="action" value="save_qq">
                
                <div class="section-title">
                    <img src="https://api.iconify.design/mdi:qqchat.svg?color=%2312B7F5" width="20" height="20" style="margin-right: 8px;" alt="">
                    QQ 互联 OAuth 配置
                </div>
                
                <div class="config-note">
                    <img src="https://api.iconify.design/mdi:information.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                    请前往 <a href="https://connect.qq.com/" target="_blank">QQ互联</a> 申请应用，获取 App ID 和 App Key
                </div>
                
                <div class="form-group">
                    <label>
                        <img src="https://api.iconify.design/mdi:identifier.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                        App ID
                    </label>
                    <input type="text" name="qq_app_id" value="<?php echo htmlspecialchars($qq_app_id); ?>" placeholder="请输入 App ID" required>
                </div>
                
                <div class="form-group">
                    <label>
                        <img src="https://api.iconify.design/mdi:key.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                        App Key
                    </label>
                    <input type="text" name="qq_app_key" value="<?php echo htmlspecialchars($qq_app_key); ?>" placeholder="请输入 App Key" required>
                </div>
                
                <div class="form-group">
    <label>
        <img src="https://api.iconify.design/mdi:web.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
        回调地址（固定）
    </label>
    <div class="url-input-wrapper">
        <input type="text" value="<?php echo SITE_URL . 'api/qq_callback.php'; ?>" readonly disabled>
        <button type="button" class="copy-btn" onclick="copyToClipboard('<?php echo SITE_URL . 'api/qq_callback.php'; ?>')">
            <img src="https://api.iconify.design/mdi:content-copy.svg?color=%23667eea" width="16" height="16" alt="">
        </button>
    </div>
    <small>在 QQ 互联应用配置中填写此回调地址</small>
</div>
                
                <div class="form-actions">
                    <button type="submit" class="btn btn-primary">
                        <img src="https://api.iconify.design/mdi:content-save.svg?color=white" width="18" height="18" style="margin-right: 6px;" alt="">
                        保存配置
                    </button>
                </div>
            </form>
            
        <?php elseif ($active_tab == 'gitee'): ?>
            <!-- Gitee 登录配置 -->
            <form method="POST">
                <input type="hidden" name="action" value="save_gitee">
                
                <div class="section-title">
                    <img src="https://api.iconify.design/mdi:git.svg?color=%23C71D23" width="20" height="20" style="margin-right: 8px;" alt="">
                    Gitee OAuth 配置
                </div>
                
                <div class="config-note">
                    <img src="https://api.iconify.design/mdi:information.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                    请前往 <a href="https://gitee.com/oauth/applications" target="_blank">Gitee 应用管理</a> 创建应用，获取 Client ID 和 Client Secret
                </div>
                
                <div class="form-group">
                    <label>
                        <img src="https://api.iconify.design/mdi:identifier.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                        Client ID
                    </label>
                    <input type="text" name="gitee_client_id" value="<?php echo htmlspecialchars($gitee_client_id); ?>" placeholder="请输入 Client ID" required>
                </div>
                
                <div class="form-group">
                    <label>
                        <img src="https://api.iconify.design/mdi:key.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                        Client Secret
                    </label>
                    <input type="text" name="gitee_client_secret" value="<?php echo htmlspecialchars($gitee_client_secret); ?>" placeholder="请输入 Client Secret" required>
                </div>
                
                <div class="form-group">
    <label>
        <img src="https://api.iconify.design/mdi:web.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
        回调地址（固定）
    </label>
    <div class="url-input-wrapper">
        <input type="text" value="<?php echo SITE_URL . 'api/gitee_callback.php'; ?>" readonly disabled>
        <button type="button" class="copy-btn" onclick="copyToClipboard('<?php echo SITE_URL . 'api/gitee_callback.php'; ?>')">
            <img src="https://api.iconify.design/mdi:content-copy.svg?color=%23667eea" width="16" height="16" alt="">
        </button>
    </div>
    <small>在 Gitee 应用配置中填写此回调地址</small>
</div>
                
                <div class="form-actions">
                    <button type="submit" class="btn btn-primary">
                        <img src="https://api.iconify.design/mdi:content-save.svg?color=white" width="18" height="18" style="margin-right: 6px;" alt="">
                        保存配置
                    </button>
                </div>
            </form>
            
        <?php elseif ($active_tab == 'union'): ?>
            <!-- 彩虹聚合登录配置 -->
            <form method="POST">
                <input type="hidden" name="action" value="save_union">
                
                <div class="section-title">
                    <img src="https://api.iconify.design/mdi:puzzle.svg?color=%23667eea" width="20" height="20" style="margin-right: 8px;" alt="">
                    彩虹聚合登录配置
                </div>
                
                <div class="config-note">
                    <img src="https://api.iconify.design/mdi:information.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                    此配置用于微信、支付宝、GitHub 等所有其他登录方式
                </div>
                
                <div class="form-group">
                    <label>
                        <img src="https://api.iconify.design/mdi:web.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                        接口地址
                    </label>
                    <input type="url" name="union_api_url" value="<?php echo htmlspecialchars($union_api_url); ?>" placeholder="例如：http://u.im01.cn/" required>
                    <small>彩虹聚合登录平台的接口地址，以 / 结尾</small>
                </div>
                
                <div class="form-group">
                    <label>
                        <img src="https://api.iconify.design/mdi:identifier.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                        App ID
                    </label>
                    <input type="text" name="union_app_id" value="<?php echo htmlspecialchars($union_app_id); ?>" placeholder="请输入 App ID" required>
                </div>
                
                <div class="form-group">
                    <label>
                        <img src="https://api.iconify.design/mdi:key.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
                        App Key
                    </label>
                    <input type="text" name="union_app_key" value="<?php echo htmlspecialchars($union_app_key); ?>" placeholder="请输入 App Key" required>
                </div>
                
                <div class="form-group">
    <label>
        <img src="https://api.iconify.design/mdi:web.svg?color=%23667eea" width="16" height="16" style="margin-right: 6px;" alt="">
        回调地址（固定）
    </label>
    <div class="url-input-wrapper">
        <input type="text" value="<?php echo SITE_URL . 'api/union_callback.php'; ?>" readonly disabled>
        <button type="button" class="copy-btn" onclick="copyToClipboard('<?php echo SITE_URL . 'api/union_callback.php'; ?>')">
            <img src="https://api.iconify.design/mdi:content-copy.svg?color=%23667eea" width="16" height="16" alt="">
        </button>
    </div>
    <small>在彩虹聚合登录平台配置此回调地址</small>
</div>
                
                <div class="form-actions">
                    <button type="submit" class="btn btn-primary">
                        <img src="https://api.iconify.design/mdi:content-save.svg?color=white" width="18" height="18" style="margin-right: 6px;" alt="">
                        保存配置
                    </button>
                </div>
            </form>
        <?php endif; ?>
    </div>
</div>

<style>
.quick-login-config-container {
    max-width: 600px;
    margin: 0 auto;
    padding: 4px;
}

.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 16px;
}
.page-header h2 {
    display: flex;
    align-items: center;
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 6px;
}
.page-desc {
    color: var(--text-muted);
    font-size: 14px;
    margin-left: 36px;
}
.header-actions {
    display: flex;
    gap: 10px;
}

/* 按钮 */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 20px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid transparent;
}
.btn-primary {
    background: var(--primary-color);
    color: white;
    box-shadow: 0 2px 4px rgba(102, 126, 234, 0.2);
}
.btn-primary:hover {
    background: var(--primary-hover);
    transform: translateY(-1px);
}
.btn-secondary {
    background: var(--bg-primary);
    color: var(--text-primary);
    border-color: var(--border-color);
}
.btn-secondary:hover {
    background: var(--bg-secondary);
}

/* 提示消息 */
.alert {
    display: flex;
    align-items: center;
    padding: 14px 20px;
    border-radius: 12px;
    margin-bottom: 24px;
    font-size: 14px;
}
.alert-success {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}
.alert-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

/* Tab 切换 */
.config-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 20px;
    background: var(--bg-secondary);
    padding: 4px;
    border-radius: 12px;
}
.tab-item {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-secondary);
    text-decoration: none;
    border-radius: 10px;
    transition: all 0.2s;
}
.tab-item:hover {
    color: var(--primary-color);
}
.tab-item.active {
    background: var(--primary-color);
    color: white;
}

/* 表单卡片 */
.form-card {
    background: var(--bg-primary);
    border-radius: 16px;
    padding: 28px;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-sm);
}

.section-title {
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color);
}

.config-note {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    background: rgba(102, 126, 234, 0.06);
    border-radius: 10px;
    margin-bottom: 24px;
    font-size: 13px;
    color: var(--text-secondary);
}
.config-note a {
    color: var(--primary-color);
    text-decoration: none;
}
.config-note a:hover {
    text-decoration: underline;
}

/* 表单组 */
.form-group {
    margin-bottom: 22px;
}
.form-group label {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    font-weight: 500;
    font-size: 14px;
    color: var(--text-primary);
}
.form-group input {
    width: 100%;
    padding: 12px 16px;
    border: 1.5px solid var(--border-color);
    border-radius: 10px;
    font-size: 14px;
    background: var(--bg-primary);
    color: var(--text-primary);
    transition: all 0.2s;
}
.form-group input:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}
.form-group small {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: var(--text-muted);
}

.url-input-wrapper {
    display: flex;
    gap: 8px;
}
.url-input-wrapper input {
    flex: 1;
}
.url-input-wrapper .copy-btn {
    padding: 0 16px;
    background: var(--bg-secondary);
    border: 1.5px solid var(--border-color);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s;
}
.url-input-wrapper .copy-btn:hover {
    background: var(--bg-primary);
    border-color: var(--primary-color);
}

/* 按钮 */
.form-actions {
    margin-top: 32px;
    padding-top: 20px;
    border-top: 1px solid var(--border-color);
}
.form-actions .btn {
    width: 100%;
    padding: 14px 24px;
}

/* 响应式 */
@media (max-width: 768px) {
    .config-tabs {
        flex-direction: column;
        gap: 4px;
    }
    .form-card {
        padding: 20px;
    }
    .url-input-wrapper {
        flex-direction: column;
    }
    .url-input-wrapper .copy-btn {
        padding: 12px;
    }
}
</style>

<script>
function copyToClipboard(text) {
    navigator.clipboard?.writeText(text).then(() => {
        window.showToast && window.showToast('回调地址已复制', 'success');
    }).catch(() => {
        const ta = document.createElement('textarea');
        ta.value = text;
        document.body.appendChild(ta);
        ta.select();
        document.execCommand('copy');
        document.body.removeChild(ta);
        window.showToast && window.showToast('回调地址已复制', 'success');
    });
}
</script>