{% extends "global/Page.html" %}
{% load otree static %}

{% block styles %}
<style>
table, th, td {
  border: 1px solid grey;
    text-align: center;
}
table{
    width: 60%;
    alignment: center;
}

td{
width: 10em;
height: 4em;

}
</style>

{% endblock %}


{% block title %}
    <div align="center">
    决策任务({{ player.round_number }}/{{Constants.num_rounds}}）
    </div>
{% endblock %}

{% block content %}

<div align="center">
<p>
    请在A和B两个选项中做出选择：
</p>

    <table>
        <tr>
        <td>

        </td>
            {% for ff, ft, p in fields %}
                <td align="center">
               区域 <br>
                {{ ff }}-{{ ft }}
                    <br>
                    ({{ p }}%)
                </td>
            {% endfor %}
    </tr>
    <tr>
        <td>

        <input type="radio" id="A" name="skewed" value={{ option_a }} >
        <label for="A">选项 A </label><br>

        </td>
            {% for o in oo_1 %}
                <td>
                {{ o }}
                </td>
            {% endfor %}
    </tr>
        <tr>
        <td>

        <input type="radio" id="B" name="skewed" value={{ option_b }} >
        <label for="B">选项 B </label><br>

        </td>
            {% for o in oo_2 %}
                <td>
                {{ o }}
                </td>
            {% endfor %}
    </tr>


    </table>


<br>

<h3  align="center" >

<button class="nexttab btn-primary btn next">下一步</button>

 </h3>

     </div>

{% endblock %}