@extends('app-new')

@push('head-script')
    <!-- BEGIN: Vendor CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/forms/wizard/bs-stepper.min.css">
    <!-- END: Vendor CSS-->

    <!-- BEGIN: Page CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/form-validation.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/core/menu/menu-types/vertical-menu.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/form-wizard.css">
    <!-- END: Page CSS-->
@endpush
@push('content-header')
    <div class="row breadcrumbs-top">
        <div class="col-12">
            <h2 class="content-header-title float-start mb-0">{{trans('device.device')}}</h2>
            <div class="breadcrumb-wrapper">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/{{$alias}}/home">{{trans('device.home')}}</a>
                    </li>
                    <li class="breadcrumb-item"><a href="/{{$alias}}/devices">{{trans('device.device')}}</a>
                    </li>
                    <li class="breadcrumb-item active">
                    @if(isset($device) && ($device->id))
                        {{trans('common/common.edit')}}
                    @else
                        {{trans('common/common.add_new')}}
                    @endif
                    </li>
                </ol>
            </div>
        </div>
    </div>
@endpush

@section('content')
<!-- Basic multiple Column Form section start -->
{!! Form::model($device, ['method' => isset($device) && $device->id ? 'put' : 'post']) !!}
    <section class="vertical-wizard">
        <div class="bs-stepper vertical vertical-wizard-example">
            <div class="bs-stepper-header">
                <div class="step" data-target="#personal-info-vertical" role="tab" id="personal-info-vertical-trigger">
                    <button type="button" class="step-trigger">
                        <span class="bs-stepper-box">1</span>
                        <span class="bs-stepper-label">
                            <span class="bs-stepper-title">{{trans('device.device_detail')}}</span>
                            <span class="bs-stepper-subtitle">{{trans('device.add_device_detail')}}</span>
                        </span>
                    </button>
                </div>
                <div class="step" data-target="#account-details-vertical" role="tab" id="account-details-vertical-trigger">
                    <button type="button" class="step-trigger">
                        <span class="bs-stepper-box">2</span>
                        <span class="bs-stepper-label">
                            <span class="bs-stepper-title">{{trans('device.location_detail')}}</span>
                            <span class="bs-stepper-subtitle">{{trans('device.add_location_detail')}}</span>
                        </span>
                    </button>
                </div>
            </div>
            <div class="bs-stepper-content">
                <div id="personal-info-vertical" class="content position-relative" role="tabpanel" aria-labelledby="personal-info-vertical-trigger" style="height: 570px">
                    <div class="content-header">
                        <h5 class="mb-0">{{trans('device.device_detail')}}</h5>
                        <small class="text-muted">{{trans('device.enter_device_detail')}}</small>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-1  {{{ $errors->has('serial_number') ? 'has-error' : '' }}}">
                                <label class="form-label" for="serial_number"> {{trans('device.serial_number')}} <span class="mendatory-field text-danger">*</span></label>
                                {!! Form::text('serial_number', isset($workman) && $workman->serial_number ? $workman->serial_number : old('serial_number'), ['class' => 'form-control', 'id' => 'serial_number']) !!} 
                                {!! $errors->first('serial_number', '<label class="error" for="name">:message</label>')!!}
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('status') ? 'has-error' : '' }}}">
                                <label class="form-label" for="status">{{trans('device.status')}} <span class="mendatory-field text-danger">*</span></label>
                                <select class="form-select select2" name="status">
                                @foreach($deviceStatus as $val)
                                    <option value="{{$val}}"  @if(isset($device) && ($device->status == $val) || (old('status') == $val)) selected @endif>{{$val}}</option>
                                @endforeach
                                </select>
                            </div>
                            {!! $errors->first('status', '<label class="error" for="status">:message</label>')!!}
                        </div>
                  
                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('device_category') ? 'has-error' : '' }}}">
                                <label class="form-label" for="device_category">{{trans('device.device_category')}} <span class="mendatory-field text-danger">*</span></label>
                                {!! Form::select('device_category', $deviceCategories, isset($device) && $device->device_category ? $device->device_category : old('device_category'), ['class' => 'form-control select2', 'id' => 'device_category']) !!} 
                                {!! $errors->first('device_category', '<label class="error" for="device_category">:message</label>')!!}
                            </div>
                        </div>
                  
                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('device_type_id') ? 'has-error' : '' }}}">
                                <label class="form-label" for="device_type_id">{{trans('device.device_type')}} <span class="mendatory-field text-danger">*</span></label>
                                {!! Form::select('device_type_id', $deviceTypes, isset($device) && $device->device_type_id ? $device->device_type_id : old('device_type_id'), ['class' => 'form-control select2', 'id' => 'device_type_id']) !!} 
                                {!! $errors->first('device_type_id', '<label class="error" for="device_type_id">:message</label>')!!}
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('device_sub_type') ? 'has-error' : '' }}}">
                                <label class="form-label" for="device_sub_type">{{trans('device.device_sub_type')}} <span class="mendatory-field text-danger">*</span></label>
                                <select class="form-select select2" name="device_sub_type">
                                @foreach($deviceSubTypes as $deviceSubType)
                                    <option value="{{$deviceSubType}}"  @if(isset($device) && ($device->device_sub_type == $deviceSubType)) selected @endif>{{ucwords($deviceSubType)}}</option>
                                @endforeach
                                </select>
                            </div>
                            {!! $errors->first('device_sub_type', '<label class="error" for="device_sub_type">:message</label>')!!}
                        </div>
                     
                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('name') ? 'has-error' : '' }}}">
                                <label class="form-label" for="name">{{trans('device.device_name')}} <span class="mendatory-field text-danger">*</span></label>
                                {!! Form::text('name', isset($device) && $device->name ? $device->name : old('name'), ['class' => 'form-control', 'id' => 'name']) !!} 
                                {!! $errors->first('name', '<label class="error" for="name">:message</label>')!!}
                            </div>
                        </div>
                    
                        {{-- <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('email') ? 'has-error' : '' }}}">
                                <label class="form-label">{{trans('device.email_id_for_alert')}}<span class="mendatory-field text-danger">*</span></label> 
                                {!! Form::email('email', isset($device) && $device->email ? $device->email : old('email'), ['class' => 'form-control', 'id' => 'email']) !!} 
                                {!! $errors->first('email', '<label class="error" for="email">:message</label>')!!}
                            </div>
                        </div> --}}

                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('device_use') ? 'has-error' : '' }}}">
                                <label class="form-label" for="device_use">{{trans('device.device_use')}} <span class="mendatory-field text-danger">*</span></label>
                                <select class="form-control select2" name="device_use">
                                    @foreach ($deviceUses as $value)
                                        <option value="{{ $value }}" @if($device->device_use==$value)  selected @endif>{{ $value }}</option> 
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('brand_name') ? 'has-error' : '' }}}">
                                <label class="form-label" for="brand_name">{{trans('device.brand_name')}}</label>
                                {!! Form::text('brand_name', isset($device) && $device->brand_name ? $device->brand_name : old('brand_name'), ['class' => 'form-control', 'id' => 'brand_name']) !!} 
                                {!! $errors->first('brand_name', '<label class="error" for="brand_name">:message</label>')!!}
                            </div>
                        </div>
             
                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('product_name') ? 'has-error' : '' }}}">
                                <label class="form-label" for="product_name">{{trans('device.product_name')}}</label>
                                {!! Form::text('product_name', isset($device) && $device->product_name ? $device->product_name : old('product_name'), ['class' => 'form-control', 'id' => 'product_name']) !!} 
                                {!! $errors->first('product_name', '<label class="error" for="product_name">:message</label>')!!}
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('checkin_validity') ? 'has-error' : '' }}}">
                                <label class="form-label" for="checkin_validity">{{trans('device.checkin_validity')}}</label>
                                {!! Form::hidden('checkin_validity_key', 'checkin_validity', ['id' => 'checkin_validity_key']) !!} 
                                {!! Form::number('checkin_validity', isset($deviceConfig['checkin_validity']) ? $deviceConfig['checkin_validity'] : old('checkin_validity'), ['class' => 'form-control', 'id' => 'checkin_validity']) !!}
                                {!! $errors->first('checkin_validity', '<label class="error" for="checkin_validity">:message</label>')!!}
                            </div>
                        </div>
                 
                        <div class="col-md-6">
                            <div class="mb-1 {{{ $errors->has('checkout_validity') ? 'has-error' : '' }}}">
                                <label class="form-label" for="checkout_validity">{{trans('device.checkout_validity')}}</label>
                                {!! Form::hidden('checkout_validity_key', 'checkout_validity', ['id' => 'checkout_validity_key']) !!} 
                                {!! Form::number('checkout_validity', isset($deviceConfig['checkout_validity']) ? $deviceConfig['checkout_validity'] : old('checkout_validity'), ['class' => 'form-control', 'id' => 'checkout_validity']) !!}
                                {!! $errors->first('checkout_validity', '<label class="error" for="checkout_validity">:message</label>')!!}
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="mb-1">
                                <input type="checkbox" class="form-check-input" name="is_email_alert" value="1" @if ((isset($device) && $device->is_email_alert) || old('is_email_alert') == 1) checked @endif>
                                <label class="form-check-label fw-bolder" for="is-night">Email Alert</label>
                            </div>
                        </div>
                    </div>

                    <div class="content-footer position-absolute bottom-0 col-md-12">
                        <div class="d-flex justify-content-between content-footer">
                            <button type="button" class="btn btn-outline-secondary btn-prev" disabled>
                                <i data-feather="arrow-left" class="align-middle me-sm-25 me-0"></i>
                                <span class="align-middle d-sm-inline-block d-none">{{trans('common/common.previous')}}</span>
                            </button>
                            <button type="button" class="btn btn-primary btn-next">
                                <span class="align-middle d-sm-inline-block d-none">{{trans('common/common.next')}}</span>
                                <i data-feather="arrow-right" class="align-middle ms-sm-25 ms-0"></i>
                            </button>
                        </div>
                    </div>
                </div>
                <div id="account-details-vertical" class="content position-relative" role="tabpanel" aria-labelledby="account-details-vertical-trigger" style="height: 470px">
                    <div class="content-header">
                        <h5 class="mb-0">{{trans('device.location_detail')}}</h5>
                        <small>{{trans('device.enter_location_detail')}}</small>
                    </div>
                    <div class="row">
                        <div class="col-md-12 col-12">
                            <div class="row">
                                <div class="col-md-6">
                                    <label class="form-label" for="location_id">{{trans('device.location')}}
                                    </label>
                                    <div class="form-label-group {{{ $errors->has('location_id') ? 'has-error' : '' }}}">
                                        <select class="form-control select2" data-live-search="true" onchange="getSubLocations(this,'sublocations')" id="location_id" name="location_id">
                                            @if(isset($subLocation) && ($subLocation->location))
                                                <option value="{{$subLocation->location->id}}">
                                                    {{$subLocation->location->name}}
                                                </option>
                                            @else    
                                                <option value="">Select Location</option>
                                                @foreach($locations as $location)
                                                    <option value="{{$location->id}}" @if(isset($device->subLocation) && ($device->subLocation->location_id == $location->id) || (old('location_id') == $location->id)) selected @endif>
                                                        {{$location->name}}
                                                    </option>
                                                @endforeach
                                            @endif    	
                                        </select> {!! $errors->first('location_id', '<label class="control-label" for="location_id">:message</label>')!!}
                                    </div>

                                </div>
                                <div class="col-md-6">
                                    <label class="form-label" for="sub_location_id">{{trans('device.sub_location')}}
                                    </label>
                                    <div class="form-label-group {{{ $errors->has('sub_location_id') ? 'has-error' : '' }}}" id="sublocations">
                                        <select class="form-control select2" id="blank_sub_location_id">
                                            @if(isset($device->subLocation))
                                                <option value="{{$device->subLocation->id}}" >
                                                    {{$device->subLocation->name}}
                                                </option>
                                            @else 
                                                <option value="">Select Sub Location</option>
                                            @endif    
                                        </select> {!! $errors->first('sub_location_id', '<label class="control-label" for="sub_location_id">:message</label>')!!}
                                    </div>

                                </div>

                                <div class="row">
                                    <div class="col-md-6">
                                        <label class="form-label" for="manager_id">{{ trans('device.device_managers') }}</label>
                                        <div class="form-label-group {{{ $errors->has('manager_id') ? 'has-error' : '' }}}">
                                            <select class="form-control select2" data-live-search="true" id="manager_id" name="manager_id[]" multiple>
                                                @if(isset($managers) && $managers)
                                                    @foreach($managers as $manager)
                                                        <option value="{{ $manager->id }}" 
                                                            @if(isset($selectedManagerIds) && in_array($manager->id, $selectedManagerIds)) selected @endif>
                                                            {{ $manager->name }}
                                                        </option>
                                                    @endforeach
                                                @endif
                                            </select>                                            
                                            {!! $errors->first('manager_id', '<label class="control-label" for="manager_id">:message</label>') !!}
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="content-footer position-absolute bottom-0 col-md-12">
                        <div class="d-flex justify-content-between content-footer">
                            <button type="button" class="btn btn-outline-secondary btn-prev">
                                <i data-feather="arrow-left" class="align-middle me-sm-25 me-0"></i>
                                <span class="align-middle d-sm-inline-block d-none">{{trans('common/common.previous')}}</span>
                            </button>
                            <button type="submit" class="btn btn-success btn-submit user-submit" id="submit-text">{{trans('common/common.submit')}}</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
 
{!! Form::close() !!} 
<!-- Basic Floating Label Form section end -->

@endsection 

@push('footer-script')

<!-- BEGIN: Page Vendor JS-->
<script src="/app-assets/vendors/js/forms/wizard/bs-stepper.min.js"></script>
<script src="/app-assets/vendors/js/forms/select/select2.full.min.js"></script>
<script src="/app-assets/vendors/js/forms/validation/jquery.validate.min.js"></script>
<!-- END: Page Vendor JS-->

<!-- BEGIN: Page JS-->
<script src="/app-assets/js/scripts/forms/form-wizard.js"></script>
<script src="/app-assets/js/scripts/forms/form-validation.js"></script>
<!-- END: Page JS-->
<script type="text/javascript">
    function getSubLocations(th) {
        var locationId = $('#location_id').val();
        var subLocationId = "";
		
		@if($device->sub_location_id > 0) 
        subLocationId = {{ $device->sub_location_id }};
		@endif 
		
        console.log(subLocationId);
        var data = {
            location_id: locationId,
            '_token' : '{{{csrf_token()}}}'
        }
        $.ajax({
            url: '/{{ $alias }}/device/sub-locations',
            type: 'POST',
            data: data,
            success: function(data) {
                var selectbox = '';
                if (data) {

                    selectbox = '<select class="form-control select2" id="sub_location_id" name="sub_location_id" >';
                    selectbox += '<option value="">Select Sub Location</option>';
                    $.each(data, function(i, item) {
                        if (i == subLocationId) {
                            selectbox += '<option value="' + i + '" selected="selected">' + item + '</option>';
                        } else {
                            selectbox += '<option value="' + i + '">' + item + '</option>';
                        }
                    });
                    selectbox += '</select>';
                }
                $('#blank_sub_location_id').css('display', 'none');
                $('#sublocations').css('display', 'block');
                $('#sublocations').html(selectbox);
                $('.select2#sub_location_id').select2();

            }
        });
    }

    $(document).ready(function() {
        if ($('#location_id').val()) {
            getSubLocations();
        }
    });
</script>
@endpush