@extends('layout.admin.master')

@section('meta-title', 'LEREVE - Create Addon')
@section('body-class', 'menu-position-side menu-side-left full-screen with-content-panel')

@section('breadcrumbs')
  <li class="breadcrumb-item">
    <a href="{{route(session('role').'.addon.list')}}">Addons</a>
  </li>
  <li class="breadcrumb-item">
    <span>Create</span>
  </li>
@endsection

@push('asset-top')
    
@endpush

@section('content')
  <div class="element-wrapper">
    <h6 class="element-header">
      Addon
    </h6>
    <div class="element-box">
      <form method="post" enctype="multipart/form-data" action="{{route(session('role').'.addon.store')}}">
        @csrf
        <h5 class="form-header">
          Create
        </h5>
        <div class="form-desc">
          <!-- Discharge best employed your phase each the of shine. Be met even reason consider logbook redesigns. Never a turned interfaces among asking -->
        </div>
        <div class="row">
          <div class="col-sm-4">
            <div class="form-group">
              <label for=""> Option Name EN</label>
              <input class="form-control" name="name_en" placeholder="Name" required="required" type="text">
              @error('name_en')
                  <div class="help-block form-text with-errors form-control-feedback">{{ $message }}</div>
              @enderror
            </div>
          </div>
          <div class="col-sm-4">
            <div class="form-group">
              <label for=""> Option Name AR</label>
              <input class="form-control" name="name_ar" placeholder="Name (Arabic)"  type="text">
              @error('name_ar')
                  <div class="help-block form-text with-errors form-control-feedback">{{ $message }}</div>
              @enderror
            </div>
          </div>
          <div class="col-sm-4">
            <div class="form-group">
              <label for=""> Input Type</label>
              <select class="form-control" name="input_type">
                <option value="0">Select</option>
                <option value="checkbox">Checkbox</option>
                <option value="radio">Radio</option>
              </select>
              @error('input_type')
                  <div class="help-block form-text with-errors form-control-feedback">{{ $message }}</div>
              @enderror
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-sm-12">
            <a class="btn btn-sm btn-info add-new-val" href="#"><i class="os-icon os-icon-common-03"></i> Add New Value</a>
          </div>
        </div>
        <!-- Media -->
        <fieldset class="form-group">
          <legend><span>Values</span></legend>
          <div class="row option_val">
            <div class="col-sm-1" style="max-width: 4.5%;">
              <div class="form-group">
                <label>Show</label>
                <div class="form-check">
                  <label class="form-check-label"><input type="checkbox" name="show[0]" class="form-check-input" value="1"  ></label>                    
                </div>
              </div>                
            </div>
            <div class="col-sm-2">
                <input type="file" name="thumbnail[{{$key}}]">
              </div>
            <div class="col-sm-3">
              <div class="form-group">
                <label for=""> Option Value</label>
                <input class="form-control" name="value_en[]" type="text" placeholder="English">
              </div>
            </div>
            <div class="col-sm-3">
              <div class="form-group">
                <label for="">&nbsp;</label>
                <input class="form-control" name="value_ar[]" type="text" placeholder="Arabic">
              </div>
            </div>
            <div class="col-sm-3">
              <div class="form-group">
                <label for="" class="text-center"> Price Modifier</label>
                <div class="row">
                  <div class="col-sm-4">
                    <select name="operand[]" class="form-control selectpicker">
                      <option value="">Select</option>
                      <option value="plus"><strong>+</strong></option>
                      <option value="minus"><strong>-</strong></option>
                    </select>                    
                  </div>
                  <div class="col-sm-4">
                    <select name="price_type[]" class="form-control">
                      <option value="">Select</option>
                      <option value="fixed">Fixed</option>
                      <option value="percentage">Percentage</option>
                    </select>
                  </div>
                  <div class="col-sm-4">
                    <input class="form-control" name="price[]" type="text" placeholder="Price">
                  </div>
                </div>
              </div>          
            </div>
            <a href="#" class="danger del-val-row"><i class="os-icon os-icon-ui-15"></i></a>
          </div>
        </fieldset>
        <!-- <div class="form-check">
          <label for="" class="form-check-label"> 
            <input class="form-check-input" name="active" type="checkbox" value="1" checked> Active
          </label>
        </div> -->
        <div class="row">
          <div class="col-sm-6">
            <div class="form-group">
              <label>Allow the customer to choose</label>
              <input type="number" name="minimum" placeholder="Minimum" class="form-control">              
            </div>
          </div>
          <div class="col-sm-6">
            <div class="form-group">
              <label>&nbsp;</label>
              <input type="number" name="maximum" placeholder="Maximum" class="form-control">
            </div>
          </div>
        </div>
        <div class="form-buttons-w">
          <button class="btn btn-primary" type="submit"> Submit</button>
        </div>
      </form>
    </div>
  </div>
@endsection

@push('asset-bottom')
  <script>
    
  </script>
@endpush