{% extends 'layouts/base.html' %}
{% block content %}
<br>
<div class="row">
  <div class="col-md-9">
    <nav aria-label="breadcrumb">
      <ol class="breadcrumb">
        <li class="breadcrumb-item"><a class="mb-0" href="{{ url_for('home_blueprint.show_ws') }}">Workspaces</a></li>
        <li class="breadcrumb-item active" aria-current="page"><a
            href="{{ url_for('home_blueprint.show_ws_nodes', ws_id=ws_id,post_id=post_id)}}">Items</a></li>
        <li class="breadcrumb-item active" aria-current="page"><a
            href="{{ url_for('home_blueprint.show_ws_nodes', ws_id=ws_id,post_id=post_id)}}">Detail</a></li>
      </ol>
    </nav>
  </div>
  <div class="col-md-3"><span class="float-end">
      <button class="btn btn-gray-800 d-inline-flex align-items-center me-3 "> </button>
    </span>
  </div>
</div>

<div class="row">
  <div class="col-12 mb-4">
    <div class="card border-0 shadow">
      <div class="card-header">
        <div class="row align-items-center">
          <div class="col">
            <h2 class="fs-5  mb-0">Post Detail</h2>
          </div>
          <div class="col text-end">
            <a href="#" class="btn btn-sm btn-primary"></a>
          </div>
        </div>
      </div>
      <div class="table-responsive">
        <table class="table align-items-center table-flush">
          <thead class="thead-light">
            <tr>
              <th class="border-bottom" scope="col">owner_id</th>
              <th class="border-bottom" scope="col">post_name</th>
              <th class="border-bottom" scope="col">post_desc</th>
              <th class="border-bottom" scope="col">post_budget</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <th class="text-gray-900" scope="row">
                {{ws0.owner_name.username}}
              </th>
              <td class="fw-bolder text-gray-500">
                {{ws0.post_name}}
              </td>
              <td class="fw-bolder text-gray-500">
                {{ws0.post_desc}}
              </td>
              <td class="fw-bolder text-gray-500">
                <div class="d-flex">

                  {{"${:,.2f}".format(ws0.post_budget)}}
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
<div class="row">
  <div class="col-md-4">
    <div class="card border-0 shadow">
      <div class="card-header">
        <div class="row align-items-center">
          <div class="col">
            <h2 class="fs-5 fw-bold mb-0">Bids</h2>
          </div>
          <div class="col text-end">
            <a href="{{ url_for('home_blueprint.create_ws_node_bids', ws_id=ws1,post_id=post_id) }}"
              class="btn btn-sm btn-primary">New Bid</a>
          </div>
        </div>
      </div>
      <ul class="list-group">
        {% for data in ws1 %}
        <li class="list-group-item">
          <a href="#" class="avatar rounded-circle mr-3">
            <img alt="Image " src="https://robohash.org/sitsequiquia.png?size=50x50&set=set{{ data.owner_id }}"> </a>
          <a class="mb-0 text-sm" href="{{ url_for('home_blueprint.show_ws_nodes_bids', ws_id=data.group_id) }}">{{
            data.owner_name.username }}</a>
          <span class="float-end"><small> {{"${:,.2f}".format(data.bid_amount )}}</small></span>
        </li>
        <hr>
        {% endfor %}
      </ul>
    </div>
  </div>

  <div class="col-md-8">
    <div class="card border-0 shadow">
      <div class="card-header">
        <div class="row align-items-center">
          <div class="col">
            <h2 class="fs-5 fw-bold mb-0">Messages</h2>
          </div>
          <div class="col text-end">
            <a href="#" class="btn btn-sm btn-primary">new Message</a>
          </div>
        </div>
      </div>
      <ul class="list-group">
        {% for comment in ws0.n_comments %}
        <li class="list-group-item">
          <h5 id="user-comment">{{ comment.owner_name.username }}</h5>
          <p id="comment-text">{{ comment.message }}
            <span class="float-end"> <small>{{ comment.created_date }}</small></span>
          </p>
        </li>
        {% endfor %}
      </ul>
    </div>
  </div>

</div>

{{ postnn }}
<hr>

{% endblock %}