@extends('layouts.frontend')
@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">

            <div class="card">
                <div class="card-header">
                    {{ trans('global.show') }} {{ trans('cruds.branch.title') }}
                </div>

                <div class="card-body">
                    <div class="form-group">
                        <div class="form-group">
                            <a class="btn btn-default" href="{{ route('frontend.branches.index') }}">
                                {{ trans('global.back_to_list') }}
                            </a>
                        </div>
                        <table class="table table-bordered table-striped">
                            <tbody>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.id') }}
                                    </th>
                                    <td>
                                        {{ $branch->id }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.name') }}
                                    </th>
                                    <td>
                                        {{ $branch->name }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.address') }}
                                    </th>
                                    <td>
                                        {{ $branch->address }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.postal_code') }}
                                    </th>
                                    <td>
                                        {{ $branch->postal_code }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.phone_number') }}
                                    </th>
                                    <td>
                                        {{ $branch->phone_number }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.email') }}
                                    </th>
                                    <td>
                                        {{ $branch->email }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.website') }}
                                    </th>
                                    <td>
                                        {{ $branch->website }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.province') }}
                                    </th>
                                    <td>
                                        {{ $branch->province->name ?? '' }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.city') }}
                                    </th>
                                    <td>
                                        {{ $branch->city->name ?? '' }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        {{ trans('cruds.branch.fields.district') }}
                                    </th>
                                    <td>
                                        {{ $branch->district->name ?? '' }}
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        <div class="form-group">
                            <a class="btn btn-default" href="{{ route('frontend.branches.index') }}">
                                {{ trans('global.back_to_list') }}
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="card mt-2">
        <div class="card-header">
            {{ trans('cruds.product.title_singular') }} {{ trans('global.list') }}
        </div>

        <div class="card-body">
            <table class=" table table-bordered table-striped table-hover ajaxTable datatable datatable-Product">
                <thead>
                    <tr>
                        <th>
                            {{ trans('cruds.product.fields.id') }}
                        </th>
                        <th>
                            {{ trans('cruds.product.fields.photo') }}
                        </th>
                        <th>
                            {{ trans('cruds.product.fields.name') }}
                        </th>
                        <th>
                            {{ trans('cruds.product.fields.price') }}
                        </th>
                        <th>
                            Stock
                        </th>
                        <th>
                            Discount
                        </th>
                        <th>
                            Preorder ?
                        </th>
                        {{-- <th>
                            {{ trans('cruds.product.fields.tag') }}
                        </th> --}}
                        <th>
                            Action
                        </th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
</div>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">Data Product</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
            <div class="form-group">
                <label class="required" for="price">{{ trans('cruds.product.fields.price') }}</label>
                <input class="form-control" type="number" name="price" id="price" value="{{ old('price', '') }}">
                @if($errors->has('price'))
                    <div class="invalid-feedback">
                        {{ $errors->first('price') }}
                    </div>
                @endif
                <span class="help-block">{{ trans('cruds.product.fields.price_helper') }}</span>
            </div>
            <div class="form-group">
                <label for="stock">Stock</label>
                <input class="form-control" type="number" name="stock" id="stock" value="{{ old('stock', '') }}">
                @if($errors->has('stock'))
                    <div class="invalid-feedback">
                        {{ $errors->first('stock') }}
                    </div>
                @endif
                <span class="help-block">{{ trans('cruds.product.fields.price_helper') }}</span>
            </div>
            <div class="form-group">
                <label for="disc">Discount</label>
                <div class="input-group">
                    <input type="hidden" name="discount_category" id="discount_category">
                    <input id="discNominal"type="number" class="form-control" placeholder="Rp">
                    <span class="input-group-text rounded-0">or</span>
                    <input id="discPercent" type="number" min="1" max="100"class="form-control" placeholder="%">
                </div>
                @if($errors->has('disc'))
                    <div class="invalid-feedback">
                        {{ $errors->first('disc') }}
                    </div>
                @endif
                <span class="help-block">{{ trans('cruds.product.fields.price_helper') }}</span>
            </div>
            <div class="form-group">
                <label for="is_preorder">Is Preoder ?</label>
                <input type="checkbox" name="is_preorder" class="checkbox" id="is_preorder" value="false">
            </div>
            <div id="preorder_div"class="form-group">
                <label for="preorder_day">Preoder Day</label>
                <div class="input-group">
                    <input id="preorder_day" type="number" min="1" max="100"class="form-control">
                </div>
                @if($errors->has('preorder_day'))
                    <div class="invalid-feedback">
                        {{ $errors->first('preorder_day') }}
                    </div>
                @endif
                <span class="help-block">{{ trans('cruds.product.fields.price_helper') }}</span>
            </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
          <button id="save" type="button" class="btn btn-primary">Save changes</button>
        </div>
      </div>
    </div>
  </div>
@endsection

@section('scripts')
@parent
<script>
    let id = 0;
    $(function () {
    let dtButtons = $.extend(true, [], $.fn.dataTable.defaults.buttons)

  let dtOverrideGlobals = {
    buttons: dtButtons,
    processing: true,
    serverSide: true,
    retrieve: true,
    aaSorting: [],
    ajax: "{{ route('frontend.branches.show', $branch->id)}}",
    columns: [
    { data: 'id', name: 'id' },
    { data: 'photo', name: 'photo', sortable: false, searchable: false },
    { data: 'name', name: 'name' },
    { data: 'price', name: 'price' },
    { data: 'stock', name: 'stock' },
    { data: 'discount', name: 'discount' },
    { data: 'preorder', name: 'preorder' },
    // { data: 'tag', name: 'tags.name' },
    { data: 'setting', name: 'setting' },
        ],
        orderCellsTop: true,
        order: [[ 1, 'desc' ]],
        pageLength: 10,
    };
    let table = $('.datatable-Product').DataTable(dtOverrideGlobals);
    $('a[data-toggle="tab"]').on('shown.bs.tab click', function(e){
        $($.fn.dataTable.tables(true)).DataTable()
            .columns.adjust();
    });
  
});

function setData(_id){
    id = _id;
    $("#exampleModal").modal("show");
}
</script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#preorder_div").hide();
        $("#is_preorder").on('change', function() {
            if ($(this).is(':checked')) {
                $(this).attr('value', 'true');
                $("#preorder_div").show();
            } else {
                $(this).attr('value', 'false');
                $("#preorder_div").hide();
            }
        });
        $("#discNominal").focus(function() {
            $('#discPercent').prop('disabled', true);
            $('#discPercent').val(null);
            $('#discount_type').val("nominal");
            $('#discNominal').prop('name', 'discount');
            $('#discPercent').prop('name', false);
        });
        $("#discNominal").focusout(function() {
            $('#discPercent').prop('disabled', false);
            // $('#discount_type').val(null);
        });

        $("#discPercent").focus(function() {
            $('#discNominal').prop('disabled', true);
            $('#discNominal').val(null);
            $('#discount_type').val("percent");
            $('#discPercent').prop('name', 'discount');
            $('#discNominal').prop('name', false);
        });
        $("#discPercent").focusout(function() {
            $('#discNominal').prop('disabled', false);
            // $('#discount_type').val(null);
        });
        $("#save").on('click', function(){
            if($('#discPercent').val() != ""){
                console.log($('#discount_type').val());
                const data = {
                    _token: '{{ csrf_token() }}',
                    product_id: id,
                    is_preorder: $("#is_preorder").val(),
                    preorder_day: $("#preorder_day").val(),
                    branch_id: {!!$branch->id!!},
                    price: $("#price").val(),
                    stok: $("#stock").val(),
                    discount: $("#discPercent").val(),
                    discount_type: "percent"
                };
                save(data);
            }else if($('#discNominal').val() != ""){
                console.log($('#discount_type').val());
                const data = {
                    _token: '{{ csrf_token() }}',
                    product_id: id,
                    is_preorder: $("#is_preorder").val(),
                    preorder_day: $("#preorder_day").val(),
                    branch_id: {!!$branch->id!!},
                    price: $("#price").val(),
                    stok: $("#stock").val(),
                    discount: $("#discNominal").val(),
                    discount_type: "nominal"
                };
                save(data);
            }else{
                const data = {
                    _token: '{{ csrf_token() }}',
                    product_id: id,
                    is_preorder: $("#is_preorder").val(),
                    preorder_day: $("#preorder_day").val(),
                    branch_id: {!!$branch->id!!},
                    price: $("#price").val(),
                    stok: $("#stock").val(),
                    discount: "",
                    discount_type: ""
                };
                save(data);
            }
        });
    });
function save(data){
    $.ajax({
        url: '/product-prices',
        type: 'POST',
        data: data,
        dataType: 'JSON',
        success: function (data) { 
            location.reload();  
        }
    }); 
}
</script>
@endsection