{% extends "base.html" %}

{% block title %}签到详情{% endblock %}

{% block content %}
<div class="p-4 space-y-4">

    <!-- 标题 -->
    <div class="flex justify-between items-center">
        <h1 class="text-xl font-bold">签到详情</h1>
        <a href="/sign" class="text-sm text-blue-500 hover:underline">返回签到列表</a>
    </div>

    <hr />

    <!-- 详情信息 -->
    <div class="space-y-4">
        <div>
            <span class="text-zinc-500">签到名称</span>
            <div class="font-medium">{{ knowing_name }}</div>
        </div>

        <div>
            <span class="text-zinc-500">日期</span>
            <div class="font-medium">{{ start_date }}</div>
        </div>

        <div>
            <span class="text-zinc-500">时间</span>
            <div class="font-medium">{{ start_time }} - {{ end_time }}</div>
        </div>

        <div>
            <span class="text-zinc-500">发起人</span>
            <div class="font-medium">{{ send_name }} ({{ send_role }})</div>
        </div>

        <div>
            <span class="text-zinc-500">签到状态</span>
            <div class="font-medium">
                {% if is_finish_know == 1 %}
                <span class="text-green-600">已签到</span>
                {% elif is_check == 1 %}
                <span class="text-green-600">已签到</span>
                {% else %}
                <span class="text-red-600">未签到</span>
                {% endif %}
            </div>
        </div>

        {% if is_picture == 1 %}
        <div>
            <span class="text-zinc-500">签到需要拍照</span>
            <div class="font-medium">是</div>
        </div>
        {% else %}
        <div>
            <span class="text-zinc-500">签到需要拍照</span>
            <div class="font-medium">否</div>
        </div>
        {% endif %}
    </div>

    <!-- 完成签到按钮 -->
    {% if is_finish_know == 0 and is_check == 0 %}
    <div class="mt-4">
        <form method="post" action="/sign/{{ know_id }}/complete">
            <button type="submit" class="bg-blue-600 text-white py-2 px-4 rounded-lg">完成签到</button>
        </form>
    </div>
    {% endif %}

</div>
{% endblock %}