{% extends 'task_orders/_new.html' %}

{% from "components/edit_link.html" import EditLink %}
{% from "components/required_label.html" import RequiredLabel %}
{% from "components/icon.html" import Icon %}

{% block heading %}
  Review Your Task Order Info
{% endblock %}

{% block form %}

{% macro TOEditLink(screen=1) %}
{% if task_order %}
  {{ EditLink(url_for("task_orders.new", screen=screen, task_order_id=task_order.id)) }}
{% else %}
  {{ EditLink(url_for("task_orders.new", screen=screen)) }}
{% endif %}
{% endmacro %}

<h3 class="subheading">What are you building {{ TOEditLink(screen=1) }}</h3>

<div class="row">
  <div class="col col--grow">
    <h4>Portfolio</h4>
    <p>{{ task_order.portfolio_name or RequiredLabel() }}</p>
  </div>

  <div class="col col--grow">
    <h4>DoD Component</h4>
    <p>{{ task_order.defense_component or RequiredLabel() }}</p>
  </div>
</div>

<h4>Scope (Statement of Work)</h4>
<p>
{{ task_order.scope or RequiredLabel() }}
</p>

<hr>

<h3 class="subheading">Reporting {{ TOEditLink(screen=1) }}</h3>

<div class="row">
  <div class="col col--grow">
    <h4>App Migration</h4>
    <p>{{ task_order.app_migration_description or RequiredLabel() }}</p>
  </div>

  <div class="col col--grow">
    <h4>Native Apps</h4>
    <p>{{ task_order.native_apps_description or RequiredLabel() }}</p>
  </div>
</div>

<h4>Project Complextiy</h4>
{% if task_order.complexity %}
  <ul class="checked-list">
  {% for item in task_order.complexity %}
    <li>{{ "forms.task_order.complexity.{}".format(item) | translate }}</li>
  {% endfor %}
  </ul>
  <!-- need to add in other here! -->
{% else %}
  <p>{{ RequiredLabel() }}</p>
{% endif %}

<div class="row">
  <div class="col col--grow">
    <h4>Development Team</h4>
    {% if task_order.dev_team %}
      <ul>
      {% for item in task_order.dev_team %}
        <li>{{ item.title() }}</li>
      {% endfor %}
      </ul>
      <!-- need to add in other here -->
    {% else %}
      <p>{{ RequiredLabel() }}</p>
    {% endif %}
  </div>

  <div class="col col--grow">
    <h4>Team Experience</h4>
    <p>{{ task_order.team_experience_description or RequiredLabel() }}</p>
  </div>
</div>

<hr>

<h3 class="subheading">Funding {{ TOEditLink(screen=2) }}</h3>

<div class="row">
  <div class="col col--grow">
    <h4>Period of Performance length</h4>
    {{ task_order.performance_length_description or RequiredLabel() }}
    <p><a href="#" class='icon-link' download>{{ Icon('download') }} View Usasge Estimate</a></p>
  </div>

  <div class="col col--grow">
    <table class="funding-summary">
      <tbody>
        <tr>
          <td><h4>Task Order Value</h4></td>
          <td class="table-cell--align-right">{{ '${:,.2f}'.format(task_order.budget) }}</td>
        </tr>
        <tr>
          <td><h4>CLIN #1 Unclassified Cloud</h4></td>
          <td class="table-cell--align-right">{{ '${:,.2f}'.format(task_order.clin_01) }}</td>
        </tr>
        <tr>
          <td><h4 class="inactive">CLIN #2 Classified Cloud<div>(Available soon)</div></h4></td>
          <td class="table-cell--align-right"></td>
        </tr>
        <tr>
          <td><h4>CLIN #3 Unclassified Cloud</h4></td>
          <td class="table-cell--align-right">{{ '${:,.2f}'.format(task_order.clin_03) }}</td>
        </tr>
        <tr>
            <td><h4 class="inactive">CLIN #4 Classified Cloud<div>(Available soon)</div></h4></td>
            <td class="table-cell--align-right"></td>
        <tr>
      </tbody>
    </table>
  </div>
</div>

<hr>

<h3 class="subheading">Oversight {{ TOEditLink(screen=3) }}</h3>

<div class="row">
  <div class="col col--grow">
    <h4>Contracting Officer (KO)</h4>
    {{ task_order.ko_first_name }} {{ task_order.ko_last_name }}<br>
    {{ task_order.ko_email }}<br>
    {{ task_order.ko_phone_number }}<br>
    DoD ID: {{ task_order.ko_dod_id}}<br>
    {% if task_order.ko_invite %}
      <span class="ok">{{ Icon('ok', classes='icon--ok') }} Invited</span>
    {% else %}
      <span class="error">{{ Icon('alert', classes='icon--error') }} Not Yet Invited</span>
    {% endif %}
  </div>

  <div class="col col--grow">
    <h4>Contracting Officer Representative (COR)</h4>
    {{ task_order.cor_first_name }} {{ task_order.cor_last_name }}<br>
    {{ task_order.cor_email }}<br>
    {{ task_order.cor_phone_number }}<br>
    DoD ID: {{ task_order.cor_dod_id}}<br>
    {% if task_order.cor_invite %}
      <span class="ok">{{ Icon('ok', classes='icon--ok') }} Invited</span>
    {% else %}
      <span class="error">{{ Icon('alert', classes='icon--error') }} Not Yet Invited</span>
    {% endif %}
  </div>
</div>
<div class="row">
  <div class="col col--grow">
    <h4>IA Security Officer</h4>
    {{ task_order.so_first_name }} {{ task_order.so_last_name }}<br>
    {{ task_order.so_email }}<br>
    {{ task_order.so_phone_number }}<br>
    DoD ID: {{ task_order.so_dod_id}}<br>
    {% if task_order.so_invite %}
      <span class="ok">{{ Icon('ok', classes='icon--ok') }} Invited</span>
    {% else %}
      <span class="error">{{ Icon('alert', classes='icon--error') }} Not Yet Invited</span>
    {% endif %}
  </div>
</div>

{% endblock %}

{% block next %}
  <div class='action-group'>
    <input type='submit' class='usa-button usa-button-primary' value='Send Invitations' />
  </div>
{% endblock %}

{% block form_action %}
  <form method='POST' action="{{ url_for('task_orders.invite', task_order_id=task_order_id) }}" autocomplete="off">
{% endblock %}