cdao-pjet/app/views/documents/show.html.erb

<div class="container-fluid row p-0 m-2">
  <div class="<%= params[:is_index_table].present? ? 'd-none': "container col-md-3"%>">
    <div class="advanced-search-box">
      <%= render(DocumentAdvancedSearchComponent.new(current_user: current_user,  opts: {})) %>
    </div>
  </div>
  <div class="<%= params[:is_index_table].present? ? 'container col-md-12': "container col-md-9"%>"> 
    <div class="card mt-1 g-3">
      <div class="container-fluid p-2 card-header">
        <div class="row">
          <div class="col-lg-12"> 
            <div class="row">
              <div class="col-lg-6">
                <% if params[:is_document_view].blank? && params[:is_citator_tab].blank? %>
                  <a class="btn btn-danger" href="<%= documents_path(params.reject { |k, v| %i[action controller id].include?(k.to_sym) }.to_unsafe_h) %>"> Back </a>
                <% end %>
              </div>
              <div class="col-lg-3 text-end"> 
              <b>Date : </b>
              </div>
              <div class="col-lg-3 text-end"> 
                <b><%= @document.docdate.present? ? @document.docdate.strftime("%m/%d/%Y") : @document.year %> </b>
              </div>
            </div>
          </div>

          <div class="col-lg-12 mt-2 mb-2"> 
            <div class="row"> 
              <div class="col-lg-3"> 
                Reference Number :
              </div>
              <div class="col-lg-9"> 
                <b><%= @document.reference_number %></b>
              </div>
            </div>
          </div>
          <div class="col-lg-12  mb-2"> 
            <div class="row">
              <div class="col-lg-3"> 
                Title : 
              </div>
              <div class="col-lg-9"> 
              <strong> <%= @document.short_title %> </strong> 
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="card-body p-0">
        <ul class="doc-nav-body nav nav-tabs nav-justified" id="menuTab" role="tablist">
          <li class="nav-item" role="presentation">
            <button class="nav-link <%= params[:is_document_view].blank? && params[:is_citator_tab].blank? ? 'active' : '' %>" id="analysisMenuTab" data-bs-toggle="tab" data-bs-target="#analysisTabContent" type="button" role="tab" aria-controls="analysisTab" aria-selected="true">Analysis</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link <%= params[:is_document_view].to_s.eql?("true") ? 'active' : '' %>" id="documentMenuTab" data-bs-toggle="tab" data-bs-target="#documentTabContent" type="button" role="tab" aria-controls="analysisTab" aria-selected="true">Full Text</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link <%= params[:is_citator_tab].to_s.eql?("true") ? 'active' : '' %>" id="citatorMenuTab" data-bs-toggle="tab" data-bs-target="#citatonTabContent" type="button" role="tab" aria-controls="analysisTab" aria-selected="true">Citator</button>
          </li>
        </ul>

        <div class="tab-content" style="height: 550px;overflow: auto;">
          <div class="tab-pane fade show <%= params[:is_document_view].blank? && params[:is_citator_tab].blank? ? 'active show' : '' %>" id="analysisTabContent" role="tabpanel" aria-labelledby="home-tab">
            <div class="row">
              <div class="d-flex justify-content-end" style="margin: 10px 0 0 -20px;">
                <a class="btn btn-success" data-controller="doctrines" data-document-id="<%= @document.id %>" data-action="click->doctrines#renderForm" data-bs-toggle="modal" data-bs-target="#doctrineModal"> Add Doctrine </a>
              </div>
              <div class="container-sm row-flex col-sm-12 mt-2">
                <%= render(DoctrineModalFormComponent.new(current_user: current_user)) %>
              </div>
            </div>

            <div class="container-sm row-flex col-sm-12 p-0 doct-body-index">
              <%= render(DocumentDoctrineIndexComponent.with_collection(@doctrines, current_user: current_user, opts: { document_id: @document.id })) %>
            </div>
          </div>

          <div class="tab-pane fade <%= params[:is_document_view].to_s.eql?("true") ? 'active show' : '' %>" id="documentTabContent" role="tabpanel">
            <div class="container-sm mt-2">
              <%= raw @document.content.html_safe%>
            </div>
          </div>

          <div class="tab-pane fade cited-table-body <%= params[:is_citator_tab].to_s.eql?("true") ? 'active show' : '' %>" id="citatonTabContent" role="tabpanel">
            <div class="d-flex align-items-baseline">
              <div class="col-md-6 mt-3 ps-3"> <h4> Cited In </h4> </div>
              <div class="col-md-6"> <%= render PaginationComponent.new(data: @cited_in_documents, opts: { is_cited_in_doc: true}) %> </div>
            </div>
            <table class="table table-hover mb-0 table-width">
              <thead style="position: sticky;top: 0">
                <th class="bg-light"> Reference No. </th>
                <th class="bg-light"> Title </th>
                <th class="bg-light"> Date </th>
              </thead>

              <tbody>
                <%= render(DocumentIndexTableComponent.with_collection(@cited_in_documents, current_user: current_user, opts: { search_params: params.reject { |k, v| %i[action controller id].include?(k.to_sym) }, is_document_view: false, is_citator_tab: true })) %>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>