rgutierrez/resq
1
0
Fork 0
Code Issues 126 Pull requests 49 Projects Releases 4 Packages Wiki Activity Actions

Change customer form layout to remove tabs, remove min height from datatables

Browse source
This commit is contained in:
Ramon Gutierrez 2018-02-04 13:44:48 +08:00
parent 729be1c084
commit dabb9c2f8b
2 changed files with 119 additions and 100 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
public/assets/css/style.css
View file

@ -142,6 +142,14 @@ span.has-danger,
color: #fff !important; color: #fff !important;
} }
.m-datatable.m-datatable--default > .m-datatable__table {
min-height: 0 !important;
}
.m-datatable.m-datatable--default > .m-datatable__table > .m-datatable__body .m-datatable__row > .m-datatable__cell {
font-weight: normal;
}
@media (min-width: 995px) { @media (min-width: 995px) {
.modal-lg { .modal-lg {
max-width: 1024px; max-width: 1024px;

67
templates/customer/form.html.twig
View file

@ -32,26 +32,14 @@
</div> </div>
</div> </div>
</div> </div>
<form id="row-form" class="m-form m-form--label-align-right" method="post" action="{{ mode == 'update' ? url('customer_update_submit', {'id': obj.getId()}) : url('customer_create_submit') }}"> <form id="row-form" class="m-form m-form--fit m-form--label-align-right" method="post" action="{{ mode == 'update' ? url('customer_update_submit', {'id': obj.getId()}) : url('customer_create_submit') }}">
<div class="m-portlet__body"> <div class="m-portlet__body">
<ul id="customer-tabs" class="nav nav-tabs" role="tablist"> <div class="m-form__section m-form__section--first">
<li class="nav-item"> <div class="m-form__heading">
<a class="nav-link active" data-toggle="tab" href="#customer-info">Customer Info</a> <h3 class="m-form__heading-title">
</li> Customer Info
<li class="nav-item"> </h3>
<a class="nav-link" data-toggle="tab" href="#mobile-numbers">Mobile Numbers</a> </div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#vehicles">Vehicles</a>
</li>
{% if mode == 'update' %}
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#tickets">Tickets</a>
</li>
{% endif %}
</ul>
<div class="tab-content">
<div class="tab-pane active" id="customer-info" role="tabpanel">
<div class="form-group m-form__group row"> <div class="form-group m-form__group row">
<div class="col-lg-6"> <div class="col-lg-6">
<label data-field="customer_classification"> <label data-field="customer_classification">
@ -91,13 +79,21 @@
</div> </div>
</div> </div>
</div> </div>
<div class="tab-pane" id="mobile-numbers" role="tabpanel">
<div class="form-group m-form__group row form-group-inner row"> <div class="m-form__seperator m-form__seperator--dashed"></div>
<div class="m-form__section">
<div class="m-form__heading">
<h3 class="m-form__heading-title">
Mobile Numbers
</h3>
</div>
<div class="form-group m-form__group row">
<div class="col-lg-12"> <div class="col-lg-12">
<div id="data-mobile-numbers"></div> <div id="data-mobile-numbers"></div>
</div> </div>
</div> </div>
<div class="form-group m-form__group row form-group-inner row"> <div class="form-group m-form__group row">
<div class="col-lg-4"> <div class="col-lg-4">
<input type="text" class="form-control m-input" placeholder="Mobile number" id="mobile-number"> <input type="text" class="form-control m-input" placeholder="Mobile number" id="mobile-number">
<div class="form-control-feedback hide" data-field="mobile-number"></div> <div class="form-control-feedback hide" data-field="mobile-number"></div>
@ -116,21 +112,37 @@
</div> </div>
</div> </div>
</div> </div>
<div class="tab-pane" id="vehicles" role="tabpanel">
<div class="form-group m-form__group row form-group-inner row"> <div class="m-form__seperator m-form__seperator--dashed"></div>
<div class="m-form__section{{ mode == 'create' ? ' m-form__section--last' }}">
<div class="m-form__heading">
<h3 class="m-form__heading-title">
Vehicles
</h3>
</div>
<div class="form-group m-form__group row">
<div class="col-lg-12"> <div class="col-lg-12">
<div class="m_datatable" id="data-vehicles"></div> <div class="m_datatable" id="data-vehicles"></div>
</div> </div>
</div> </div>
<div class="form-group m-form__group row form-group-inner row"> <div class="form-group m-form__group row">
<div class="col-lg-12"> <div class="col-lg-12">
<button type="button" class="btn btn-primary" id="add-vehicle">Add Vehicle</button> <button type="button" class="btn btn-primary" id="add-vehicle">Add Vehicle</button>
</div> </div>
</div> </div>
</div> </div>
{% if mode == 'update' %} {% if mode == 'update' %}
<div class="tab-pane" id="tickets" role="tabpanel"> <div class="m-form__seperator m-form__seperator--dashed"></div>
<div class="form-group m-form__group row form-group-inner row">
<div class="m-form__section m-form__section--last">
<div class="m-form__heading">
<h3 class="m-form__heading-title">
Tickets
</h3>
</div>
<div class="form-group m-form__group row">
<div class="col-lg-12"> <div class="col-lg-12">
<div class="m_datatable" id="data-tickets"></div> <div class="m_datatable" id="data-tickets"></div>
</div> </div>
@ -138,7 +150,6 @@
</div> </div>
{% endif %} {% endif %}
</div> </div>
</div>
<div class="m-portlet__foot m-portlet__foot--fit"> <div class="m-portlet__foot m-portlet__foot--fit">
<div class="m-form__actions m-form__actions--solid m-form__actions--right"> <div class="m-form__actions m-form__actions--solid m-form__actions--right">
<div class="row"> <div class="row">