 @extends('admin.layouts.main-layout')
 @section('content')
 <div class="container">
     <div class="justify-content-center">
         <div class="">
             <div class="card">
                 <div class="card-header">Update Sub Master</div>
                 <div class="card-body">
                     @if ($errors->any())
                     <div class="alert alert-danger">
                         <ul>
                             @foreach ($errors->all() as $error)
                             <li>{{ $error }}</li>
                             @endforeach
                         </ul>
                     </div>
                     @endif
                     <form role="form" method="post" onsubmit="return validateForm('addsstatus')" class="addsstatus" action="{{url('admin/submaster/'.$detail->id)}}" autocomplete="off" enctype="multipart/form-data">
                         @csrf
                         {{ method_field('PATCH') }}



                         <div class="form-group">
                             <label for="name">Name <span class="require label-mandatory">*</span></label>
                             <input type="text" class="form-control input-mandatory" name="name" id="name" value="{{$detail->name}}">
                         </div>

                         <div class="form-group">
                             <label for="mobile_number">Mobile Number <span class="require label-mandatory">*</span></label>
                             <input type="text"
                                 class="form-control input-mandatory"
                                 name="mobile_number"
                                 id="mobile_number"
                                 value="{{$detail->mobile_number}}"
                                 maxlength="10"
                                 pattern="\d{10}">
                         </div>

                         <div class="form-group">
                              <label for="commission">Commission Percent % <span class="require label-mandatory">*</span> (User Partnership : <span id="distribute">{{100 - $detail->commission}}</span>)</label>
                            <input type="number" step="0.01" class="form-control input-mandatory" name="commission" id="commission" value="{{$detail->commission}}" oninput="validateAdminPercent()"  min="0.01" max="99.99" step="0.01">
                            
                         </div>

                         <br>
                         <div class="form-group">

                             <button type="submit" class="btn btn-primary">Submit</button>
                         </div>

                     </form>
                 </div>
             </div>
         </div>
     </div>
 </div>
 @endsection
@section('js-content')
 <script>
     function validateAdminPercent() {
         let adminPercent = document.getElementById("commission").value;
         if (adminPercent <= 0 || adminPercent >= 100) {
             // Display an error message or make the input invalid
             document.getElementById("commission").setCustomValidity("Please enter a number between 0 and 100, but not 0 or 100.");
         } else {
             document.getElementById("commission").setCustomValidity("");
         }
         document.getElementById("distribute").innerHTML = 100 - adminPercent;
     }
 </script>
@endsection