Initial Commit
This commit is contained in:
@@ -0,0 +1,67 @@
|
||||
<div class="mb-3 row">
|
||||
<label class="col-2 col-form-label fw-bold">@lang('cabels') : </label>
|
||||
<div class="col-10">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<th>@lang('barcode')</th>
|
||||
<th class="text-center">@lang('available')</th>
|
||||
<th class="text-center">@lang('amount')</th>
|
||||
<th class="text-center">@lang('action')</th>
|
||||
</thead>
|
||||
<tbody id="cabel_input_container">
|
||||
<datalist id="cabels">
|
||||
@foreach($cabels as $cabel)
|
||||
<option data-available="{{$cabel->total - (count($cabel->loans) + count($cabel->reservations))}}" data-cabel-id="{{$cabel->id}}">{{$cabel->category->name}}.{{$cabel->name}}</option>
|
||||
@endforeach
|
||||
</datalist>
|
||||
<tr>
|
||||
<button type="button" id="cabel_add_button" class="btn btn-outline-success mb-4">@lang('add') @lang('cabel')</button>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var cabel_count = 0;
|
||||
$("#cabel_add_button").click(function(){
|
||||
let cabel_table = $("#cabel_input_container");
|
||||
cabel_table.append('<tr><td class="col align-middle"><div class="input-group"><input type="text" name="cabels[' + cabel_count + ']" id="cabel_' + cabel_count + '_input" class="form-control" placeholder="Barcode" list="cabels" data-cabel-index="' + cabel_count + '" oninput="cabel_barcode_change(this)" required></div></td><td id="cabel_' + cabel_count + '_available" class="col-1 text-center align-middle">0</td><td class="col-1 text-center align-middle"><input type="number" id="cabel_' + cabel_count + '_amount" name="cabel_amount[' + cabel_count + ']" class="form-control text-center" step="1" min="0" max="0" @if(old("cabel_' + cabel_count + '_amount"))value="old("cabel_' + cabel_count + '_amount")"@else value="0" @endif required disabled><input type="hidden" name="cabel_id[' + cabel_count + ']" id="cabel_' + cabel_count + '_id" value="0"></td><td class="col-2 text-center align-middle"><button type="button" onclick="cabel_barcode_remove(this)" class="btn btn-outline-danger">@lang('remove') @lang('cabel')</button></td></tr>');
|
||||
cabel_count += 1;
|
||||
});
|
||||
|
||||
function cabel_barcode_remove(elem) {
|
||||
let this_row = $(elem).parent().parent().remove();
|
||||
}
|
||||
|
||||
function cabel_barcode_change(elem){
|
||||
let cabel_index = $(elem).data('cabel-index');
|
||||
let cabel_input = $("#cabel_" + cabel_index + "_input");
|
||||
|
||||
var available = $('#cabels option').filter(function() {
|
||||
return this.value == cabel_input.val();
|
||||
}).data('available');
|
||||
var cabel_id = $('#cabels option').filter(function() {
|
||||
return this.value == cabel_input.val();
|
||||
}).data('cabel-id');
|
||||
|
||||
if(available == null || typeof available === "undefined"){
|
||||
$("#cabel_" + cabel_index + "_available").html(0);
|
||||
$("#cabel_" + cabel_index + "_amount").prop('min',0);
|
||||
$("#cabel_" + cabel_index + "_amount").prop('max',0);
|
||||
$("#cabel_" + cabel_index + "_amount").val(0);
|
||||
$("#cabel_" + cabel_index + "_amount").prop('disabled',true);
|
||||
$("#cabel_" + cabel_index + "_id").val(0);
|
||||
}
|
||||
else{
|
||||
$("#cabel_" + cabel_index + "_available").html(available);
|
||||
$("#cabel_" + cabel_index + "_amount").prop('min',1);
|
||||
$("#cabel_" + cabel_index + "_amount").prop('max',available);
|
||||
$("#cabel_" + cabel_index + "_amount").val(1);
|
||||
$("#cabel_" + cabel_index + "_amount").prop('disabled',false);
|
||||
$("#cabel_" + cabel_index + "_id").val(cabel_id);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
Reference in New Issue
Block a user