@extends('layouts.dashboard')
@section('content')
<div class="container">    
  <div class="contentbox">
    <div class="contentboxheading"><i class="las la-envelope" aria-hidden="true"></i><span id="formStatus">Email assigned to service</span><a class="btn btn-primary pull-right mt-2 mr10 btn-form-toggle"><span>Show</span> Form</a>  
    </div>
    <div class="contentboxinner">
      @if (session('success'))
        <div class="alert alert-success">
            {{ session('success') }}
        </div>
      @endif
      <div class="form-container fhide">
        <form class="row g-3" id="saveServiceEmail" >
          @csrf
          <input type="hidden"  name="hdn_id" id="hdn_id" readonly>
          <div class="alert alert-danger errorMsgUpdt" style="display:none;"></div>
          <div class="row g-3">
              <div class="col-md-4">
                <label for="txtfromdate" class="ml10">Select Service <span style="color:red">*</span></label>
                <select class="selectpicker" data-live-search="true" name="selected_service" id="selected_service">
                  <option value="">--Select Service--</option>
                  @foreach($services as $srv)
                  <option value="{{$srv->service_id}}">{{$srv->name}}</option>
                  @endforeach
                </select>
              </div>
              <div class="col-md-4">
                <label for="txtEmail" class="form-label ml10"> Email <span style="color:red">*</span></label>
                <input type="email" class="form-control" id="txtEmail" name ="Email" placeholder="Email">
              </div>

              <div class="col-md-4">
                  <button type="button" id = "addServiceEmail" class="btn btn-primary mt-4 mb-4">Submit</button>
                  <button type="button" class="btn btn-primary mt-4 mb-4" type="button" onclick="Javascript:window.location.reload()">Reset</button>
              </div>
          </div>
        </form>
      </div>   
    
      <div class="table-responsive mt-6">
        <table class="table table-striped">
            <thead>
                <tr>
                  <th scope="col">Action</th>
                  <th scope="col">Service Name</th>
                  <th scope="col">Email</th>
                  <th scope="col">Created By</th>
                  <th scope="col">Created Date</th>
                </tr>
              </thead>
              <tbody id="ajaxData">@include('services.service-maping_ajax')</tbody>
        </table>
      </div>   
    </div>
  </div>
</div>

@endsection
@section('footer_scripts')
<script>
$(document).ready(function () {
   
});
</script>
@endsection