Update external protocols form to include sort_by

This commit is contained in:
Jure Grabnar 2019-06-27 21:26:28 +02:00
parent 51c25ba0af
commit 8338892fc6
2 changed files with 46 additions and 42 deletions

View file

@ -74,6 +74,12 @@
margin-bottom: 15px;
padding-right: 0;
.service-provider {
display: flex;
align-items: center;
width: 50%;
}
.protocolsio-logo {
height: 30px;
width: 30px;
@ -82,25 +88,20 @@
.protocolsio-title {
color: $brand-primary;
font-size: 14px;
margin-left: 3px;
vertical-align: middle;
}
.protocols-search-bar {
padding-right: 0;
width: 70%;
.input-group {
margin-bottom: 0;
.input-group {
margin-bottom: 0;
width: 100%;
.form-control {
border-right: 0;
}
.form-control {
border-right: 0;
}
.input-group-addon {
background: $color-white;
color: $color-silver-chalice;
}
.input-group-addon {
background: $color-white;
color: $color-silver-chalice;
}
}
}

View file

@ -1,59 +1,61 @@
<div class='external-protocols-tab'>
<div class='row'>
<div class='col-md-5 protocols-search-bar-panel'>
<%= form_tag team_list_external_protocol_path(@current_team.id),
method: :get,
class: 'protocols-search-bar',
remote: true do %>
<div class='col-md-5 protocols-search-bar-panel'>
<div class='service-provider'>
<%= image_tag 'external_protocols/protocolsio_logo.png',
class: 'protocolsio-logo' %>
<span class='protocolsio-title'><%= t('protocols.index.external_protocols.protocolsio_title') %></span>
</div>
<div>
<%= image_tag 'external_protocols/protocolsio_logo.png',
class: 'protocolsio-logo' %>
<span class='protocolsio-title'><%= t('protocols.index.external_protocols.protocolsio_title') %></span>
</div>
<%= form_tag '#',
method: :get,
class: 'protocols-search-bar' do %>
<div class='input-group'>
<input class='form-control'
type='text'
name='key'
placeholder="<%= t('protocols.index.external_protocols.search_bar_placeholder') %>" >
</input>
<div class='input-group'>
<input class='form-control'
type="text"
name="q"
placeholder="<%= t('protocols.index.external_protocols.search_bar_placeholder') %>" >
</input>
<span class='input-group-addon'><i class='fas fa-search '></i></span>
</div>
<% end %>
<span class='input-group-addon'><i class='fas fa-search '></i></span>
</div>
</div>
<div class='col-md-7'>
<div class='protocol-sort'>
<span><%= t('protocols.index.external_protocols.sort_by.title') %></span>
<div class='btn-group' data-toggle='buttons' >
<label class='btn btn-link active'>
<input type='radio' name='sory_by' id='alphabetically' value='alpha'>
<input type='radio' name='sort_by' id='alphabetically' value='alpha'>
<%= t('protocols.index.external_protocols.sort_by.alphabetically') %>
</label>
<label class='btn btn-link'>
<input type='radio' name='sory_by' id='newest' value='newest'>
<input type='radio' name='sort_by' id='newest' value='newest'>
<%= t('protocols.index.external_protocols.sort_by.newest') %>
</label>
<label class='btn btn-link'>
<input type='radio' name='sory_by' id='oldest' value='oldest'>
<input type='radio' name='sort_by' id='oldest' value='oldest'>
<%= t('protocols.index.external_protocols.sort_by.oldest') %>
</label>
</label>
</div>
</div>
</div>
</div>
<% end %>
</div>
<div class='row main-protocol-panel'>
<div class='col-md-5 protocol-list-side-panel'>
<div class='row main-protocol-panel'>
<div class='col-md-5 protocol-list-side-panel'>
<div class='row empty-text'>
<%= t('protocols.index.external_protocols.list_panel.empty_text') %>
</div>
<div class="external-protocol-result">
<a href="#" data-source="protocolsio/v3" data-id="11176" data-action="external-import" data-url="<%= team_build_external_protocol_path(current_team.id,) %>">Protocols IO, 11176</a>
</div>
<div class='list'>
<div class="external-protocol-result">
<a href="#" data-source="protocolsio/v3" data-id="11176" data-action="external-import" data-url="<%= team_build_external_protocol_path(current_team.id,) %>">Protocols IO, 11176</a>
</div>
<div class='protocol-card'
data-protocol-source='protocolsio/v3'
@ -75,6 +77,7 @@
data-show-protocol-id='errorr'>
Error protocol (click me, should default to default screen)
</div>
</div>
</div>
<div class='col-md-7 protocol-preview-panel'>