<?php
/**
 * 万象全功能面板 - 加密版 + OSS 自动存储
 * 适用环境：宝塔 PHP 7.4+
 */

session_start();

// 配置文件路径
define('CONFIG_FILE', __DIR__ . '/wanxiang_config.enc');
define('DASHSCOPE_BASE', 'https://dashscope.aliyuncs.com/api/v1/services/');

// ==================== 加密模块 ====================
function derive_key(string $password): string {
    return hash_pbkdf2('sha256', $password, 'wanxiang_oss_salt_2025', 10000, 32, true);
}

function encrypt_data(string $plaintext, string $password): string {
    $key = derive_key($password);
    $iv = openssl_random_pseudo_bytes(16);
    $ciphertext = openssl_encrypt($plaintext, 'AES-256-CBC', $key, OPENSSL_RAW_DATA, $iv);
    return base64_encode($iv . $ciphertext);
}

function decrypt_data(string $encrypted, string $password): string {
    $key = derive_key($password);
    $data = base64_decode($encrypted);
    $iv = substr($data, 0, 16);
    $ciphertext = substr($data, 16);
    return openssl_decrypt($ciphertext, 'AES-256-CBC', $key, OPENSSL_RAW_DATA, $iv);
}

// 配置读写（统一加密 JSON）
function get_config(string $password): ?array {
    if (!file_exists(CONFIG_FILE)) return null;
    $enc = file_get_contents(CONFIG_FILE);
    $json = decrypt_data($enc, $password);
    return json_decode($json, true);
}

function save_config(array $config, string $password): void {
    $json = json_encode($config);
    file_put_contents(CONFIG_FILE, encrypt_data($json, $password));
}

// ==================== OSS 签名与上传 ====================
function oss_sign(string $secretKey, string $method, string $object, string $bucket, string $contentMd5 = '', string $contentType = '', string $date = ''): string {
    if (empty($date)) $date = gmdate('D, d M Y H:i:s \G\M\T');
    $resource = '/' . $bucket . '/' . $object;
    $stringToSign = $method . "\n" . $contentMd5 . "\n" . $contentType . "\n" . $date . "\n" . $resource;
    return base64_encode(hash_hmac('sha1', $stringToSign, $secretKey, true));
}

function oss_upload(string $bucket, string $endpoint, string $accessKeyId, string $accessKeySecret, string $object, string $fileContent): string {
    $date = gmdate('D, d M Y H:i S \G\M\T');
    $contentType = mime_content_type_auto($fileContent);
    $sign = oss_sign($accessKeySecret, 'PUT', $object, $bucket, base64_encode(md5($fileContent, true)), $contentType, $date);
    $host = $bucket . '.' . $endpoint;
    $url = 'https://' . $host . '/' . $object;
    $ch = curl_init($url);
    curl_setopt_array($ch, [
        CURLOPT_PUT => true,
        CURLOPT_INFILE => $fileContent instanceof CURLFile ? null : tmpfile_from_string($fileContent),
        CURLOPT_INFILESIZE => strlen($fileContent),
        CURLOPT_HTTPHEADER => [
            'Authorization: OSS ' . $accessKeyId . ':' . $sign,
            'Date: ' . $date,
            'Content-MD5: ' . base64_encode(md5($fileContent, true)),
            'Content-Type: ' . $contentType,
        ],
        CURLOPT_RETURNTRANSFER => true,
        CURLOPT_HEADER => true,
        CURLOPT_SSL_VERIFYPEER => false,
    ]);
    if ($fileContent instanceof CURLFile) {
        $fp = fopen($fileContent->getFilename(), 'rb');
        curl_setopt($ch, CURLOPT_INFILE, $fp);
        curl_setopt($ch, CURLOPT_INFILESIZE, $fileContent->getSize());
    }
    $response = curl_exec($ch);
    $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
    curl_close($ch);
    if ($httpCode === 200) {
        return $url;
    }
    return 'UploadFailed: HTTP ' . $httpCode . ' ' . substr($response, 0, 500);
}

// 辅助：从字符串创建临时文件流（PUT 上传需要）
function tmpfile_from_string($content) {
    $fp = fopen('php://temp', 'rb+');
    fwrite($fp, $content);
    rewind($fp);
    return $fp;
}

// 简单 mime 检测
function mime_content_type_auto($content) {
    $finfo = new finfo(FILEINFO_MIME_TYPE);
    return $finfo->buffer($content) ?: 'application/octet-stream';
}

// ==================== 万象模型定义 ====================
$models = [
    'text2image' => [
        'title' => '文生图',
        'endpoint' => 'aigc/text2image/image-synthesis',
        'models' => [
            'wanx2.1-t2i-plus' => '万象2.1 文生图增强版',
            'wanx2.1-t2i-turbo' => '万象2.1 文生图极速版',
            'wanx-v1' => '万象1.0 文生图'
        ],
        'params' => [
            'prompt' => ['label' => '正向提示词', 'type' => 'textarea', 'required' => true],
            'negative_prompt' => ['label' => '负向提示词', 'type' => 'textarea', 'required' => false],
            'size' => ['label' => '尺寸', 'type' => 'select', 'options' => ['1024*1024', '720*1280', '1280*720'], 'default' => '1024*1024'],
            'n' => ['label' => '生成数量', 'type' => 'number', 'default' => 1, 'min' => 1, 'max' => 4]
        ]
    ],
    'image_generation' => [
        'title' => '图像编辑/生成',
        'endpoint' => 'aigc/image-generation/generation',
        'models' => [
            'wanx-style-cosplay-v1' => '人像风格重绘',
            'wanx-background-generation-v2' => '背景生成',
            'wanx-anytext-v1' => 'AnyText 图文融合',
            'wanx-sketch-to-image-lite' => '涂鸦作画'
        ],
        'params' => [
            'model' => ['label' => '功能模型', 'type' => 'select', 'dynamic' => true],
            'ref_image' => ['label' => '参考图URL', 'type' => 'text', 'required' => false, 'hint' => '可上传或填写URL'],
            'prompt' => ['label' => '提示词', 'type' => 'textarea', 'required' => false],
            'style_index' => ['label' => '风格指数 (仅人像)', 'type' => 'select', 'options' => ['1','2','3','4','5'], 'required' => false],
            'text_content' => ['label' => '要写入的文字 (仅AnyText)', 'type' => 'text', 'required' => false],
            'text_position' => ['label' => '文字位置 (仅AnyText)', 'type' => 'select', 'options' => ['center','top','bottom'], 'required' => false]
        ]
    ],
    'video_generation' => [
        'title' => '视频生成',
        'endpoint' => 'aigc/video-generation/generation',
        'models' => [
            'wanx2.1-t2v-plus' => '文本生成视频增强版',
            'wanx2.1-t2v-turbo' => '文本生成视频极速版'
        ],
        'params' => [
            'prompt' => ['label' => '视频描述', 'type' => 'textarea', 'required' => true],
            'duration' => ['label' => '时长(秒)', 'type' => 'number', 'default' => 5, 'min' => 2, 'max' => 10],
            'size' => ['label' => '分辨率', 'type' => 'select', 'options' => ['1280*720', '720*1280'], 'default' => '1280*720']
        ]
    ]
];

// ==================== 路由处理 ====================
$action = $_GET['action'] ?? ($_POST['action'] ?? '');
$password = $_SESSION['wanx_pass'] ?? '';

// 未配置则进入设置
if (!file_exists(CONFIG_FILE)) {
    $action = 'setup';
}

// 统一验证主密码（setup 和 verify_pass 除外）
if (!in_array($action, ['setup', 'save_config', 'verify_pass']) && empty($password)) {
    $action = 'auth'; // 需要先验证密码
}

// 特殊 action：身份验证
if ($action === 'verify_pass') {
    $pass = $_POST['password'] ?? '';
    $config = get_config($pass);
    if ($config !== null) {
        $_SESSION['wanx_pass'] = $pass;
        header('Location: ?action=panel');
        exit;
    } else {
        $error = '主密码错误，请重试';
    }
}

// 提交任务（ajax）
if ($action === 'submit_task') {
    header('Content-Type: application/json');
    if (empty($password)) {
        echo json_encode(['error' => '未解锁面板']);
        exit;
    }
    $config = get_config($password);
    if (!$config || empty($config['api_key'])) {
        echo json_encode(['error' => '配置无效或API Key缺失']);
        exit;
    }
    $apiKey = $config['api_key'];
    $category = $_POST['category'] ?? '';
    $model = $_POST['model'] ?? '';
    $catConfig = $models[$category] ?? null;
    if (!$catConfig) {
        echo json_encode(['error' => '无效功能分类']);
        exit;
    }
    $input = [];
    foreach ($catConfig['params'] as $param => $def) {
        if (isset($_POST[$param]) && $_POST[$param] !== '') {
            $input[$param] = $_POST[$param];
        }
    }
    if (!empty($_POST['ref_image'])) {
        $input['reference_image'] = $_POST['ref_image'];
    }
    $payload = [
        'model' => $model,
        'input' => $input,
    ];
    if (isset($input['size'])) {
        $payload['parameters']['size'] = $input['size'];
        unset($payload['input']['size']);
    }
    if (isset($input['n'])) {
        $payload['parameters']['n'] = (int)$input['n'];
        unset($payload['input']['n']);
    }

    $endpoint = DASHSCOPE_BASE . $catConfig['endpoint'];
    $ch = curl_init($endpoint);
    curl_setopt_array($ch, [
        CURLOPT_POST => true,
        CURLOPT_HTTPHEADER => [
            'Authorization: Bearer ' . $apiKey,
            'Content-Type: application/json',
            'X-DashScope-Async: enable'
        ],
        CURLOPT_POSTFIELDS => json_encode($payload),
        CURLOPT_RETURNTRANSFER => true,
        CURLOPT_SSL_VERIFYPEER => false,
    ]);
    $result = curl_exec($ch);
    $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
    curl_close($ch);
    $data = json_decode($result, true);
    if ($httpCode === 200 && isset($data['output']['task_id'])) {
        $_SESSION['tasks'][] = [
            'task_id' => $data['output']['task_id'],
            'category' => $category,
            'endpoint' => $catConfig['endpoint'],
            'time' => time()
        ];
        echo json_encode(['task_id' => $data['output']['task_id']]);
    } else {
        echo json_encode(['error' => $data['message'] ?? '请求失败', 'raw' => $result]);
    }
    exit;
}

// 查询任务状态
if ($action === 'query_task') {
    header('Content-Type: application/json');
    $config = get_config($password);
    $apiKey = $config['api_key'] ?? '';
    if (!$apiKey) {
        echo json_encode(['error' => 'API Key缺失']);
        exit;
    }
    $taskId = $_GET['task_id'] ?? '';
    $endpoint = $_GET['endpoint'] ?? '';
    $url = DASHSCOPE_BASE . $endpoint . '/' . $taskId;
    $ch = curl_init($url);
    curl_setopt_array($ch, [
        CURLOPT_HTTPHEADER => ['Authorization: Bearer ' . $apiKey],
        CURLOPT_RETURNTRANSFER => true,
    ]);
    $result = curl_exec($ch);
    curl_close($ch);
    echo $result;
    exit;
}

// 上传参考图到 OSS（返回 OSS URL）
if ($action === 'upload_ref_image') {
    header('Content-Type: application/json');
    $config = get_config($password);
    $oss = $config['oss'] ?? [];
    if (!$oss) {
        echo json_encode(['error' => 'OSS 未配置']);
        exit;
    }
    if (empty($_FILES['file'])) {
        echo json_encode(['error' => '未选择文件']);
        exit;
    }
    $file = $_FILES['file'];
    $ext = pathinfo($file['name'], PATHINFO_EXTENSION) ?: 'png';
    $object = ($oss['dir'] ?? '') . date('Ymd/His_') . uniqid() . '.' . $ext;
    $content = file_get_contents($file['tmp_name']);
    $url = oss_upload($oss['bucket'], $oss['endpoint'], $oss['access_key_id'], $oss['access_key_secret'], $object, $content);
    if (strpos($url, 'UploadFailed') === false) {
        echo json_encode(['url' => $url]);
    } else {
        echo json_encode(['error' => '上传到 OSS 失败: ' . $url]);
    }
    exit;
}

// 将临时 URL 的资源转存到 OSS（用于生成结果）
if ($action === 'save_to_oss') {
    header('Content-Type: application/json');
    $config = get_config($password);
    $oss = $config['oss'] ?? [];
    if (!$oss) {
        echo json_encode(['error' => 'OSS 未配置']);
        exit;
    }
    $tempUrl = $_POST['url'] ?? '';
    if (!$tempUrl) {
        echo json_encode(['error' => '缺少临时URL']);
        exit;
    }
    // 下载临时资源
    $ch = curl_init($tempUrl);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
    $content = curl_exec($ch);
    $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
    $contentType = curl_getinfo($ch, CURLINFO_CONTENT_TYPE);
    curl_close($ch);
    if ($httpCode !== 200 || empty($content)) {
        echo json_encode(['error' => '下载临时资源失败 HTTP' . $httpCode]);
        exit;
    }
    $ext = '';
    if (preg_match('/image\/(\w+)/', $contentType, $m)) {
        $ext = $m[1];
    } elseif (preg_match('/video\/(\w+)/', $contentType, $m)) {
        $ext = $m[1] === 'quicktime' ? 'mov' : $m[1];
    }
    if (!$ext) $ext = 'bin';
    $object = ($oss['dir'] ?? '') . 'results/' . date('Ymd/His_') . uniqid() . '.' . $ext;
    $url = oss_upload($oss['bucket'], $oss['endpoint'], $oss['access_key_id'], $oss['access_key_secret'], $object, $content);
    if (strpos($url, 'UploadFailed') === false) {
        echo json_encode(['url' => $url]);
    } else {
        echo json_encode(['error' => '转存 OSS 失败: ' . $url]);
    }
    exit;
}

// ==================== 页面渲染 ====================
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>通义万象 · 全功能加密面板 + OSS</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
    <style>
        body { background: #f0f2f5; }
        .container { max-width: 960px; margin-top: 30px; }
        .card { margin-bottom: 20px; box-shadow: 0 2px 12px rgba(0,0,0,0.08); }
        .task-output img, .task-output video { max-width: 100%; border-radius: 8px; margin: 10px 0; }
        .upload-zone { border: 2px dashed #ced4da; border-radius: 8px; padding: 20px; text-align: center; cursor: pointer; }
        .upload-zone:hover { border-color: #0d6efd; }
    </style>
</head>
<body>
<div class="container">
    <h2 class="mb-4">🎨 通义万象 · 全功能加密面板 <small class="text-muted">OSS 自动存储</small></h2>

    <?php if ($action === 'setup'): ?>
        <div class="card">
            <div class="card-header bg-primary text-white"><strong>首次配置 - 加密存储所有密钥</strong></div>
            <div class="card-body">
                <form method="post" action="?action=save_config">
                    <h5>🔐 安全主密码</h5>
                    <div class="mb-3">
                        <input type="password" name="master_password" class="form-control" placeholder="设置主密码（6位以上）" required minlength="6">
                        <div class="form-text">此密码用于加密下方所有敏感信息，请务必牢记。</div>
                    </div>
                    <h5>🧠 百炼 API Key</h5>
                    <div class="mb-3">
                        <input type="password" name="api_key" class="form-control" placeholder="sk-xxxx" required>
                    </div>
                    <h5>☁️ 阿里云 OSS 配置（用于存储图片视频）</h5>
                    <div class="row g-2">
                        <div class="col-md-6">
                            <input type="text" name="oss_bucket" class="form-control mb-2" placeholder="Bucket 名称" required>
                        </div>
                        <div class="col-md-6">
                            <input type="text" name="oss_endpoint" class="form-control mb-2" placeholder="Endpoint（如 oss-cn-beijing.aliyuncs.com）" required>
                        </div>
                        <div class="col-md-6">
                            <input type="text" name="oss_key_id" class="form-control mb-2" placeholder="AccessKey ID" required>
                        </div>
                        <div class="col-md-6">
                            <input type="password" name="oss_key_secret" class="form-control mb-2" placeholder="AccessKey Secret" required>
                        </div>
                        <div class="col-md-6">
                            <input type="text" name="oss_dir" class="form-control mb-2" placeholder="存储目录（可选，如 wanxiang/）">
                        </div>
                    </div>
                    <button type="submit" class="btn btn-success w-100 mt-2">加密并保存全部配置</button>
                </form>
            </div>
        </div>
    <?php elseif ($action === 'save_config'): ?>
        <?php
        $mp = $_POST['master_password'] ?? '';
        $apiKey = $_POST['api_key'] ?? '';
        $oss = [
            'bucket' => $_POST['oss_bucket'] ?? '',
            'endpoint' => $_POST['oss_endpoint'] ?? '',
            'access_key_id' => $_POST['oss_key_id'] ?? '',
            'access_key_secret' => $_POST['oss_key_secret'] ?? '',
            'dir' => rtrim($_POST['oss_dir'] ?? '', '/') . '/'
        ];
        if (strlen($mp) >= 6 && $apiKey && $oss['bucket'] && $oss['endpoint'] && $oss['access_key_id'] && $oss['access_key_secret']) {
            $config = ['api_key' => $apiKey, 'oss' => $oss];
            save_config($config, $mp);
            $_SESSION['wanx_pass'] = $mp;
            echo '<div class="alert alert-success">✅ 配置已加密存储，正在跳转...</div>';
            echo '<script>setTimeout(function(){ window.location.href = "?action=panel"; }, 1500);</script>';
        } else {
            echo '<div class="alert alert-danger">❌ 请完整填写所有信息并确保密码长度≥6</div>';
        }
        ?>
    <?php elseif (empty($password) && $action !== 'verify_pass'): ?>
        <div class="card">
            <div class="card-header">🔐 输入主密码解锁面板</div>
            <div class="card-body">
                <?php if (isset($error)): ?>
                    <div class="alert alert-danger"><?php echo $error; ?></div>
                <?php endif; ?>
                <form method="post" action="?action=verify_pass">
                    <input type="password" name="password" class="form-control mb-3" placeholder="请输入设置的主密码" required>
                    <button type="submit" class="btn btn-primary">解锁</button>
                </form>
            </div>
        </div>
    <?php else: ?>
        <!-- 功能面板 -->
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <span>🚀 万象功能选择</span>
                <span class="badge bg-success">已加密 · OSS 已连接</span>
            </div>
            <div class="card-body">
                <div class="mb-3">
                    <label class="form-label">功能类别</label>
                    <select id="categorySelect" class="form-select">
                        <option value="">-- 请选择 --</option>
                        <?php foreach ($models as $key => $cat): ?>
                            <option value="<?php echo $key; ?>"><?php echo $cat['title']; ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div id="modelParams" style="display: none;">
                    <div class="mb-3">
                        <label class="form-label">模型</label>
                        <select id="modelSelect" class="form-select"></select>
                    </div>
                    <div id="paramFields"></div>
                    <button id="submitTask" class="btn btn-primary mt-3">提交任务</button>
                </div>
            </div>
        </div>

        <!-- 任务列表 -->
        <div class="card">
            <div class="card-header">📋 任务记录</div>
            <div class="card-body" id="taskResults">
                <p class="text-muted">暂无任务</p>
            </div>
        </div>
    <?php endif; ?>
</div>

<script>
const modelsConfig = <?php echo json_encode($models); ?>;
let currentCategory = '';

// 类别切换
document.getElementById('categorySelect')?.addEventListener('change', function() {
    const cat = this.value;
    if (!cat) {
        document.getElementById('modelParams').style.display = 'none';
        return;
    }
    currentCategory = cat;
    const config = modelsConfig[cat];
    const modelSelect = document.getElementById('modelSelect');
    modelSelect.innerHTML = '';
    Object.keys(config.models).forEach(m => {
        modelSelect.add(new Option(config.models[m], m));
    });
    const paramDiv = document.getElementById('paramFields');
    paramDiv.innerHTML = '';
    for (const [name, def] of Object.entries(config.params)) {
        if (name === 'model') continue;
        const group = document.createElement('div');
        group.className = 'mb-3';
        group.innerHTML = `<label class="form-label">${def.label} ${def.required ? '*' : ''}</label>`;
        let input;
        if (name === 'ref_image') {
            // 特殊处理：文件上传 + URL 输入二选一
            group.innerHTML += `
                <div class="upload-zone mb-2" id="refUploadZone">
                    <p class="mb-1">📁 点击或拖拽上传参考图</p>
                    <input type="file" id="refFileInput" accept="image/*" style="display:none">
                    <small class="text-muted">或手动填写URL：</small>
                </div>`;
            const urlInput = document.createElement('input');
            urlInput.type = 'text';
            urlInput.className = 'form-control';
            urlInput.placeholder = '输入图片URL（优先使用上传）';
            urlInput.name = name;
            urlInput.id = 'param_' + name;
            group.appendChild(urlInput);
            // 绑定上传事件
            group.querySelector('.upload-zone').addEventListener('click', () => group.querySelector('#refFileInput').click());
            group.querySelector('#refFileInput').addEventListener('change', handleRefUpload);
        } else if (def.type === 'textarea') {
            input = document.createElement('textarea');
            input.className = 'form-control';
            input.rows = 3;
        } else if (def.type === 'select') {
            input = document.createElement('select');
            input.className = 'form-select';
            def.options.forEach(o => input.add(new Option(o, o)));
        } else {
            input = document.createElement('input');
            input.type = def.type;
            input.className = 'form-control';
            if (def.default) input.value = def.default;
            if (def.min) input.min = def.min;
            if (def.max) input.max = def.max;
        }
        if (name !== 'ref_image' && input) {
            input.name = name;
            input.id = 'param_' + name;
            if (def.required) input.required = true;
            group.appendChild(input);
        }
        if (def.hint) group.innerHTML += `<div class="form-text">${def.hint}</div>`;
        paramDiv.appendChild(group);
    }
    document.getElementById('modelParams').style.display = 'block';
});

// 参考图上传处理
async function handleRefUpload(e) {
    const file = e.target.files[0];
    if (!file) return;
    const formData = new FormData();
    formData.append('action', 'upload_ref_image');
    formData.append('file', file);
    const zone = document.getElementById('refUploadZone');
    zone.innerHTML = '<div class="spinner-border text-primary" role="status"></div> 上传中...';
    try {
        const resp = await fetch('?action=upload_ref_image', { method: 'POST', body: formData });
        const data = await resp.json();
        if (data.url) {
            document.getElementById('param_ref_image').value = data.url;
            zone.innerHTML = '<span class="text-success">✅ 上传成功，已填入URL</span>';
        } else {
            zone.innerHTML = `<span class="text-danger">❌ 上传失败：${data.error || '未知'}</span>`;
        }
    } catch(e) {
        zone.innerHTML = '<span class="text-danger">网络错误</span>';
    }
}

// 提交任务
document.getElementById('submitTask')?.addEventListener('click', async function() {
    const model = document.getElementById('modelSelect').value;
    const formData = new FormData();
    formData.append('action', 'submit_task');
    formData.append('category', currentCategory);
    formData.append('model', model);
    document.querySelectorAll('#paramFields input, #paramFields textarea, #paramFields select').forEach(el => {
        if (el.value && el.name) formData.append(el.name, el.value);
    });
    try {
        this.disabled = true;
        this.textContent = '提交中...';
        const resp = await fetch('?action=submit_task', { method: 'POST', body: formData });
        const data = await resp.json();
        if (data.task_id) {
            addTaskCard(data.task_id, modelsConfig[currentCategory].endpoint);
        } else {
            alert('任务提交失败: ' + (data.error || '未知错误'));
        }
    } catch(e) {
        alert('网络错误');
    }
    this.disabled = false;
    this.textContent = '提交任务';
});

// 任务卡片
function addTaskCard(taskId, endpoint) {
    const container = document.getElementById('taskResults');
    const card = document.createElement('div');
    card.className = 'card mt-2';
    card.id = 'task_' + taskId;
    card.innerHTML = `
        <div class="card-body">
            <h6>任务ID: ${taskId}</h6>
            <div class="progress">
                <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 100%">处理中...</div>
            </div>
            <div class="task-output mt-2"></div>
        </div>`;
    container.prepend(card);
    pollTask(taskId, endpoint);
}

// 轮询任务状态，成功后自动转存 OSS
async function pollTask(taskId, endpoint) {
    const maxAttempts = 60;
    let attempts = 0;
    const interval = setInterval(async () => {
        try {
            const resp = await fetch(`?action=query_task&task_id=${taskId}&endpoint=${endpoint}`);
            const data = await resp.json();
            const card = document.getElementById('task_' + taskId);
            if (!card) { clearInterval(interval); return; }
            const outputDiv = card.querySelector('.task-output');
            if (data.output?.task_status === 'SUCCEEDED') {
                clearInterval(interval);
                card.querySelector('.progress').style.display = 'none';
                outputDiv.innerHTML = '<div class="text-info">正在上传到 OSS 永久存储...</div>';
                const results = data.output.results || [];
                for (const r of results) {
                    if (r.url) {
                        const form = new FormData();
                        form.append('action', 'save_to_oss');
                        form.append('url', r.url);
                        const ossResp = await fetch('?action=save_to_oss', { method: 'POST', body: form });
                        const ossData = await ossResp.json();
                        if (ossData.url) {
                            const ext = ossData.url.split('.').pop().toLowerCase();
                            if (['mp4', 'mov', 'webm'].includes(ext)) {
                                outputDiv.innerHTML += `<video src="${ossData.url}" controls class="w-100"></video>`;
                            } else {
                                outputDiv.innerHTML += `<img src="${ossData.url}" class="img-fluid"><br>`;
                            }
                            outputDiv.innerHTML += `<small class="text-muted">OSS: <a href="${ossData.url}" target="_blank">${ossData.url}</a></small><br>`;
                        } else {
                            outputDiv.innerHTML += `<div class="text-danger">转存OSS失败: ${ossData.error}</div>`;
                        }
                    }
                }
            } else if (data.output?.task_status === 'FAILED') {
                clearInterval(interval);
                card.querySelector('.progress').style.display = 'none';
                outputDiv.innerHTML = `<p class="text-danger">任务失败: ${data.output.message || '未知'}</p>`;
            } else if (++attempts > maxAttempts) {
                clearInterval(interval);
                outputDiv.innerHTML = '<p class="text-warning">轮询超时，可能还在生成中...</p>';
            }
        } catch(e) {
            clearInterval(interval);
        }
    }, 3000);
}
</script>
</body>
</html>