{% extends "mygame/company.html" %} {% block content %}
<h1
  class="text-center font-weight-bold border-bottom border-2 border-primary p-3 m-3 shadow rounded"
>
  Order: {{viewedorder.name}}
</h1>
{%if errormessage%}
<div class="m-2 pb-0 text-center text-light bg-danger rounded">
  {{errormessage}}
</div>
{%endif%}
<h2
  class="col-md-4 border-bottom border-1 border-primary p-2 m-2 mt-4 shadow rounded text-center"
>
  Workload
</h2>

<div class="m-2">
  <table class="table">
    <thead>
      <tr>
        <th scope="col">Required Skill</th>
        <th scope="col">Workload</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th scope="row">experience</th>
        <td>
          <div
            class="progress"
            role="progressbar"
            aria-label="worker-experience"
            aria-valuenow="0"
            aria-valuemin="0"
            aria-valuemax="100"
          >
            <div
              class="progress-bar overflow-visible text-dark"
              style="width: {{viewedorder.requiredWorkload.experience}}%"
            >
              {{viewedorder.requiredWorkload.experience}}
            </div>
          </div>
        </td>
      </tr>
      <tr>
        <th scope="row">reliability</th>
        <td>
          <div
            class="progress"
            role="progressbar"
            aria-label="worker-reliability"
            aria-valuenow="0"
            aria-valuemin="0"
            aria-valuemax="100"
          >
            <div
              class="progress-bar overflow-visible text-dark"
              style="width: {{viewedorder.requiredWorkload.reliability}}%"
            >
              {{viewedorder.requiredWorkload.reliability}}
            </div>
          </div>
        </td>
      </tr>
      <tr>
        <th scope="row">python</th>
        <td>
          <div
            class="progress"
            role="progressbar"
            aria-label="worker-python"
            aria-valuenow="0"
            aria-valuemin="0"
            aria-valuemax="100"
          >
            <div
              class="progress-bar overflow-visible text-dark"
              style="width: {{viewedorder.requiredWorkload.python}}%"
            >
              {{viewedorder.requiredWorkload.python}}
            </div>
          </div>
        </td>
      </tr>
      <tr>
        <th scope="row">javascript</th>
        <td>
          <div
            class="progress"
            role="progressbar"
            aria-label="worker-javascript"
            aria-valuenow="0"
            aria-valuemin="0"
            aria-valuemax="100"
          >
            <div
              class="progress-bar overflow-visible text-dark"
              style="width: {{viewedorder.requiredWorkload.javascript}}%"
            >
              {{viewedorder.requiredWorkload.javascript}}
            </div>
          </div>
        </td>
      </tr>
      <tr>
        <th scope="row">cpp</th>
        <td>
          <div
            class="progress"
            role="progressbar"
            aria-label="worker-cpp"
            aria-valuenow="0"
            aria-valuemin="0"
            aria-valuemax="100"
          >
            <div
              class="progress-bar overflow-visible text-dark"
              style="width: {{viewedorder.requiredWorkload.cpp}}%"
            >
              {{viewedorder.requiredWorkload.cpp}}
            </div>
          </div>
        </td>
      </tr>
      <tr>
        <th scope="row">management</th>
        <td>
          <div
            class="progress"
            role="progressbar"
            aria-label="worker-management"
            aria-valuenow="0"
            aria-valuemin="0"
            aria-valuemax="100"
          >
            <div
              class="progress-bar overflow-visible text-dark"
              style="width: {{viewedorder.requiredWorkload.management}}%"
            >
              {{viewedorder.requiredWorkload.management}}
            </div>
          </div>
        </td>
      </tr>
    </tbody>
  </table>
</div>
<h2
  class="col-md-4 border-bottom border-1 border-primary p-2 m-2 mt-4 shadow rounded text-center"
>
  Attributes
</h2>

<div class="m-2">
  <table class="table">
    <thead>
      <tr>
        <th scope="col">Attribute</th>
        <th scope="col">Value</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        {%if viewedorder.status == 0%}
        <th scope="row">Estimated Profit</th>
        {%else%}
        <th scope="row">Profit</th>
        {% endif%}
        <td>{{viewedorder.profit}}</td>
      </tr>
      <tr>
        {%if viewedorder.status == 0%}
        <th scope="row">Maximum Rounds</th>
        {%else%}
        <th scope="row">Rounds left</th>
        {% endif%}
        <td>{{viewedorder.maxRounds}}</td>
      </tr>
      {%if viewedorder.status == 1%}

      <tr>
        <th scope="row">Engineeringmodel</th>
        <td>{{viewedorder.engineeringModel}}</td>
      </tr>
      {% endif%}
      <tr>
        <th scope="row">Customer Description</th>
        <td>{{viewedorder.specialorder.hint}}</td>
      </tr>
    </tbody>
  </table>
</div>
<form
  class="row g-0 justify-content-evenly m-2"
  action="{% url 'companyOrder' gameid=game.id username=user.username orderid=viewedorder.id %}"
  method="post"
>
  {% csrf_token %} {%if viewedorder.status == 0 %}
  <div class="row g-0 justify-content-evenly">
    <div class="col-md-6 p-2">
      <input
        class="form-control"
        type="number"
        placeholder="Insert your Offer"
        id="offerfield"
        name="offerfield"
      />
    </div>
    <div class="col-md-6 p-2">
      <input
        class="btn btn-primary w-100"
        type="submit"
        value="offer"
        id="offer"
        name="action"
      />
    </div>
  </div>
  {%elif viewedorder.status == 1 %}
  <div class="col-md-6">
    <div class="d-grid gap-2">
      <input
        class="btn btn-danger btn-block m-2"
        type="submit"
        value="cancel"
        id="cancel"
        name="action"
      />
    </div>
  </div>
  <div class="col-md-6">
    <div class="d-grid gap-2">
      <input
        class="btn btn-success btn-block m-2"
        type="submit"
        value="assign resources"
        id="assign resources"
        name="action"
      />
    </div>
  </div>

  {%endif%}
</form>
{% endblock %}