Browse Source

Merge pull request #31 from lexintegritastech/feature-enhancement-ui

Feature enhancement UI
pull/32/head
Angel Aviel Domaoan 4 years ago committed by GitHub
parent
commit
3b85a373c9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 27
      app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb
  2. 12
      app/components/document_doctrine_index_component/document_doctrine_index_component.html.erb
  3. 5
      app/components/pagination_component/pagination_component.html.erb
  4. 54
      app/javascript/src/application.scss
  5. 4
      app/views/doctrines/search.html.erb
  6. 72
      app/views/documents/show.html.erb

27
app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb

@ -1,37 +1,30 @@
<div class="modal fade" id="doctrineModal" tabindex="-1" aria-labelledby="doctrineModal" aria-hidden="true">
<div class="modal fade modal-doctrine-body" id="doctrineModal" tabindex="-1" aria-labelledby="doctrineModal" aria-hidden="true">
<%= form_tag(opts[:form_url], method: opts[:form_method]) do %>
<div class="modal-dialog modal-lg modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"> <%= opts[:form_method].eql?(:post) ? "New Doctrine" : "Update Doctrine" %> </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
<button type="button" class="btn-close-x" data-bs-dismiss="modal" aria-label="Close">x</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-sm-12 p-2">
<strong> <%= label_tag :subjects %> </strong>
<%= select_tag "subject_ids[]", options_from_collection_for_select(subjects.sort_by { |sub| sub.lineage_name }, :id, :lineage_name, doctrine.subject_ids), class: "form-select subject-ids-selectize", multiple: true, prompt: "Please select" %>
</div>
<div class="mb-3">
<label for="subject-name" class="col-form-label">Subjects</label>
<%= select_tag "subject_ids[]", options_from_collection_for_select(subjects.sort_by { |sub| sub.lineage_name }, :id, :lineage_name, doctrine.subject_ids), class: "form-control subject-ids-selectize ps-0", multiple: true, prompt: "Please select" %>
</div>
<% if doctrine.new_record? %>
<div class="row">
<div class="col-sm-12 p-2">
<strong> <%= label_tag :doctine_content_suggestions %> </strong>
<select id="doctine_content_suggestions" class="form-select"> </select>
</div>
<div class="mb-3">
<label for="subject-name" class="col-form-label">Doctine content suggestions</label>
<select id="doctine_content_suggestions" class="form-control ps-0"> </select>
</div>
<% end %>
<div class="row">
<div class="col-sm-12 p-2">
<strong> <%= label_tag :content %> </strong>
<div class="mb-3">
<label for="subject-name" class="col-form-label">Content</label>
<%= rich_text_area_tag :content, doctrine.content, placeholder: "Doctrine Content" %>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">Save</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>

12
app/components/document_doctrine_index_component/document_doctrine_index_component.html.erb

@ -1,17 +1,17 @@
<div class="card card-header row-flex m-3 clickable-link" href="<%= opts[:is_disable_clickable_link].present? ? '#' : document_doctrine_path(document_id, id)%>">
<div class="row-flex m-3 mt-0 doctrine-content-body clickable-link" href="<%= opts[:is_disable_clickable_link].present? ? '#' : document_doctrine_path(document_id, id)%>">
<% if opts[:is_subjects_index].blank? %>
<% if opts[:is_doctrines_index].present? && opts[:subject_ids].reject(&:blank?).present? %>
<h4> <%= subjects.where(id: opts[:subject_ids].map(&:to_i)).map(&:lineage_name).join(" ") %> </h4>
<h5 style="color: darkred;"> <%= subjects.where(id: opts[:subject_ids].map(&:to_i)).map(&:lineage_name).join(" ") %> </h5>
<% elsif subjects.present? %>
<% subjects.each do |subject| %>
<h4> <%= subject.lineage_name %> </h4>
<h5 style="color: darkred;"> <%= subject.lineage_name %> </h5>
<% end %>
<% else %>
<h4> (No Subjects Provided) </h4>
<h5> (No Subjects Provided) </h5>
<% end %>
<% end %>
<div class="container-sm <%= opts[:is_subjects_index].present? ? 'm-0 ps-0' : 'ms-3' %>">
<div class="container-sm <%= opts[:is_subjects_index].present? ? 'm-0 ps-0' : '' %>">
<p class="mb-0"> <%= raw content.html_safe %> </p>
<div class="container-sm ms-3">
@ -48,4 +48,6 @@
<% end %>
</div>
</div>
<hr/>
</div>

5
app/components/pagination_component/pagination_component.html.erb

@ -1,9 +1,9 @@
<div class="col col-md-12">
<header class="header bg-white b-b clearfix">
<div class="row m-t-sm align-items-end pagination-body">
<div class="col-md-6">
<div class="col-md-6 mb-0">
<% if opts[:is_subject_breadcrums].present? && subjects.present? %>
<ol class="breadcrumb">
<ol class="breadcrumb mb-0">
<% subjects.each do |subject| %>
<% subject.ancestors.each do |ancestor| %>
<li class="breadcrumb-item d-inline-flex">
@ -30,4 +30,5 @@
</div>
</div>
</header>
<hr class="mt-0"/>
</div>

54
app/javascript/src/application.scss

@ -40,3 +40,57 @@
min-height: 100vh !important;
overflow: auto;
}
// Modal Form custom styling //
.modal-doctrine-body .selectize-control {
border: none !important;
}
.modal-doctrine-body .modal-header {
background: darkred !important;
color: #fff !important;
button.btn-close-x {
background: transparent;
border: none;
color: #fff;
font-size: 18px;
width: 30px;
}
button.btn-close-x:hover {
background: white !important;
border-radius: 18px;
color: darkred !important;
width: 30px;
}
}
// Document custom styling //
.doct-body-index div:last-child .hr {
display: none !important;
}
.doc-nav-body.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
color: #ffffff !important;
background: darkred !important;
font-weight: 800;
}
.doc-nav-body .nav-item button {
color: #000;
}
// Cited custom styling //
.cited-table-body .table-width {
width: 97%;
margin: 0 auto;
}
.doctrine-index-body .doctrine-content-body {
padding-left: 15px;
}

4
app/views/doctrines/search.html.erb

@ -1,5 +1,5 @@
<div class="card container-sm mt-1 p-0">
<div class="container m-2"> <%= render PaginationComponent.new(data: @doctrines, opts: { is_subject_breadcrums: true, subject_ids: params[:subject_ids] }) %> </div>
<div class="container-sm mt-1 p-0 doctrine-index-body">
<div class="container m-2 ps-0"> <%= render PaginationComponent.new(data: @doctrines, opts: { is_subject_breadcrums: true, subject_ids: params[:subject_ids] }) %> </div>
<% if params[:is_index_table].to_s.eql?("true") %>
<div class="card-body col-sm-12 tableFixHead p-0 mt-1">

72
app/views/documents/show.html.erb

@ -1,24 +1,45 @@
<div class="card mt-1 g-3">
<div class="card-header mt-1 mb-2 col-sm-12">
<table class="table table-borderless">
<tbody>
<tr>
<td class="text-start" style="width: 160px;"> Reference Number: </td>
<td class="text-start"> <strong> <%= @document.reference_number %> </strong> </td>
<td class="text-end" style="width: 50px;" > Date: </td>
<td class="text-end" style="width: 160px;"> <strong> <%= @document.docdate.present? ? @document.docdate.strftime("%m/%d/%Y") : @document.year %> </strong> </td>
</tr>
<tr>
<td style="width: 160px;" class="text-start"> Title: </td>
<td colspan="3" class="text-start"> <strong> <%= @document.title %> </strong> </td>
</tr>
</tbody>
</table>
<div class="card mt-1 g-3">
<div class="container p-2 card-header">
<div class="row">
<div class="col-lg-12">
<div class="row">
<div class="col-lg-6">
</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="card-body">
<ul class="nav nav-tabs" id="menuTab" role="tablist">
<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.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 active" id="analysisMenuTab" data-bs-toggle="tab" data-bs-target="#analysisTabContent" type="button" role="tab" aria-controls="analysisTab" aria-selected="true">Analysis</button>
</li>
@ -30,19 +51,18 @@
</li>
</ul>
<div class="tab-content">
<div class="tab-content" style="height: 550px;overflow: auto;">
<div class="tab-pane fade show active" id="analysisTabContent" role="tabpanel" aria-labelledby="home-tab">
<div class="row">
<div class="d-flex justify-content-end p-3">
<div class="d-flex justify-content-end" style="margin: 10px 0 0 -20px;">
<a class="btn btn-sm btn-primary" 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, doctrine: @document.doctrines.new, subjects: @subjects.order(name: :asc), opts: { form_url: jurisprudence_doctrines_path(jurisprudence_id: @document.id), form_method: :post })) %>
</div>
</div>
<div class="container-sm row-flex col-sm-12 mt-2">
<div class="container-sm row-flex col-sm-12 p-0 doct-body-index">
<%= render(DocumentDoctrineIndexComponent.with_collection(@doctrines, current_user: current_user)) %>
</div>
</div>
@ -53,10 +73,10 @@
</div>
</div>
<div class="tab-pane fade" id="ciatatonTabContent" role="tabpanel">
<div class="card card-header mt-1"> <h4> Cited Ins Documents </h4> </div>
<table class="table table-striped table-hover mb-0">
<thead>
<div class="tab-pane fade cited-table-body" id="ciatatonTabContent" role="tabpanel">
<div class="mt-3 ps-3"> <h4> Cited Ins Documents </h4> </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>

Loading…
Cancel
Save