ui_components.py

import gradio as gr
from task_manager import get_current_task, select_result, change_task, tasks, get_total_tasks
from annotation import save_annotations


def calculate_completion_stats(annotation_results):
    """计算任务完成统计信息"""
    if not annotation_results:
        return 0, 0, 0.0

    total_tasks = get_total_tasks()
    completed_tasks = len(annotation_results)
    completion_rate = (completed_tasks / total_tasks * 100) if total_tasks > 0 else 0.0

    return completed_tasks, total_tasks, completion_rate


def create_task_info_html(username, annotation_results, current_task_num):
    """创建包含用户信息和完成度的HTML"""
    completed_tasks, total_tasks, completion_rate = calculate_completion_stats(annotation_results)

    # 使用更简洁的HTML结构
    task_info_html = f"""
    <div style="font-size: 16px; color: #333; padding: 10px; background-color: #f0f0f0; border-radius: 5px; display: flex; justify-content: space-between; align-items: center;">
        <span>👤 用户: {username}</span>
        <span>完成度: {completed_tasks}/{total_tasks} ({completion_rate:.1f}%)</span>
        <span><strong>当前任务: {current_task_num}</strong></span>
    </div>
    """

    return task_info_html


def create_ui(init_task, username, annotation_results):
    """创建 Gradio 界面组件"""
    init_inst, init_text, init_audioA_data, init_audioA_rate, init_audioB_data, init_audioB_rate, init_prev_dis, init_next_dis, init_task_num = init_task

    gr.Markdown('<div class="center"><h2>🎵 音频对比标注平台</h2></div>')
    user_display = gr.Markdown()

    instruction = gr.Textbox(label="🎯Instruction", value=init_inst, interactive=False)
    text_box = gr.Textbox(label="📋Transcription", value=init_text, interactive=False)

    # 初始化时创建完成度显示 - 使用HTML组件而不是Markdown
    initial_task_info = create_task_info_html("unknown", {}, init_task_num)
    task_number = gr.HTML(value=initial_task_info, elem_classes="center")

    with gr.Row():
        with gr.Column(elem_classes="audio-container"):
            audioA = gr.Audio(
                label="🔊 音频 A",
                value=(init_audioA_rate, init_audioA_data),
                interactive=False,
                type="numpy"
            )
        with gr.Column(elem_classes="audio-container"):
            audioB = gr.Audio(
                label="🔊 音频 B",
                value=(init_audioB_rate, init_audioB_data),
                interactive=False,
                type="numpy"
            )

    with gr.Row():
        btn_win = gr.Button("🏆 Win", variant="primary")
        btn_tie = gr.Button("🤝 Tie", variant="secondary")
        btn_lose = gr.Button("❌ Lose", variant="stop")

    with gr.Row():
        btn_prev = gr.Button("⬅️ 上一题", interactive=not init_prev_dis)
        btn_next = gr.Button("➡️ 下一题", interactive=not init_next_dis)

    def wrapped_select_result(choice, audioA, audioB, annotation_results, username, user_current_task):
        """包装 select_result 函数以适配新的参数签名"""
        result_audioA, result_audioB, updated_annotation_results = select_result(choice, audioA, audioB,
                                                                                 annotation_results, username,
                                                                                 user_current_task)

        # 更新完成度显示 - 保持当前任务编号不变，因为还在同一个任务上
        current_task_display = user_current_task + 1  # 假设任务编号从1开始显示
        updated_task_info = create_task_info_html(username, updated_annotation_results, current_task_display)

        return result_audioA, result_audioB, updated_annotation_results, gr.update(value=updated_task_info)

    def wrapped_change_task(direction, annotation_results, username, user_current_task):
        """包装 change_task 函数以适配新的参数签名"""
        result = change_task(direction, annotation_results, username, user_current_task)

        if len(result) >= 9:  # 确保返回值包含所有必需的字段
            inst, text, audioA, audioB, btn_prev, btn_next, original_task_display, updated_annotation_results, updated_current_task = result[
                                                                                                                                      :9]

            # 使用更新后的当前任务索引来计算显示编号
            current_task_display = updated_current_task + 1  # 转换为1-based显示

            # 创建新的完成度显示
            updated_task_info = create_task_info_html(username, updated_annotation_results, current_task_display)

            return inst, text, audioA, audioB, btn_prev, btn_next, gr.update(
                value=updated_task_info), updated_annotation_results, updated_current_task
        else:
            return result

    return {
        "user_display": user_display,
        "instruction": instruction,
        "text_box": text_box,
        "task_number": task_number,
        "audioA": audioA,
        "audioB": audioB,
        "btn_win": btn_win,
        "btn_tie": btn_tie,
        "btn_lose": btn_lose,
        "btn_prev": btn_prev,
        "btn_next": btn_next,
        "select_result": wrapped_select_result,
        "change_task": wrapped_change_task,
        "save_annotations": lambda u, a: save_annotations(u, a, tasks)
    }