@extends('admin.layout') @section('content')


<style>
.form {
    border: 1px solid #efefef;
    /*width: 80%;*/
    padding: 50px 30px;
    text-align: left;
    background: #fff;
    border-radius: 4px;
}
    
.form-control {
        text-align: left !important;
}

.form-group {
    margin-bottom: 2rem;
}

.help-block{
  font-weight: normal;font-size: 11px;margin-bottom: 0;position: absolute;
}

textarea.form-control {
    height: calc(2.25rem + 2px);
}

.space-30{
  height: 30px;
  display: block;
}

label {
    font-weight: 600;
}

textarea.form-control {
    height: auto;
}

i.dropdown.icon {
    color: #333;
}

i.icon.delete:before {
    content: "\f00d";
    font-family: Dropdown;
    color: #333;
}

.ui.multiple.dropdown {
    height: auto;
}

</style>



<div class="content-wrapper">


    <!-- Main content -->

    <section class="content">

        <!-- Info boxes -->

        <!-- /.row -->

        <div class="container">

        <div class="row">

            <div class="col-md-12">


                        <div class="row">

                            <div class="col-xs-12">


                                   @if (count($errors) > 0) @if($errors->any())

                                    <div class="alert alert-success alert-dismissible" role="alert">

                                        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>

                                        {{$errors->first()}}

                                    </div>

                                    @endif @endif

                                    <!-- /.box-header -->

                                    <!-- form start -->

                                    {!! Form::open(array('url' =>'admin/marketingSendEmail', 'method'=>'post', 'class' => 'form-horizontal form-validate', 'enctype'=>'multipart/form-data')) !!}
                                    <div class="box-body">
                                        <center>
                                          <div class="row form">
                                           

                                        <div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
                                            <label for="customers_emails">Email </label>
                                        <select multiple="" class="form-control field-validate dropdown" id="customers_emails" name="customers_emails[]"  data-live-search="true">
                      @if (count($customers['result']) > 0) 
                        @foreach ($customers['result'] as $key=>$listingCustomers)
                                         <option value="{{ $listingCustomers->customers_email_address }}">{{ $listingCustomers->customers_email_address }}</option>
                          @endforeach 
                      @endif
                                      </select>
                                <div class="ui toggle checkbox" style="margin-top: 14px;">
                                    <input type="checkbox" id="selectall">
                                    <label>Select all</label>
                                </div>
                                        </div>

                                    <div class="form-group col-xs-12 col-sm-6 col-md-6 col-lg-6">
                                            <label for="subjects">Subject </label>
                                          
                                                <input class="form-control field-validate" name="subjects" type="text" value=""> <span class="help-block" style="font-weight: normal;font-size: 11px;margin-bottom: 0;">                                 </span> 
                                        </div>

                                            <div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
                                                <label for="message">Message </label>
                                                
                                                    <textarea id="id_message" class="form-control" name="message" type="text" value=""></textarea> <span class="help-block">                                 </span> 
                                            </div>
                                          

                                            <!-- /.box-body -->

                                            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                                                <div class="space-30"></div>
                                                <center>
                                                <button type="submit" class="ecom-btn">Send Email</button>
                                              </center>
                                            </div>

                                            <!-- /.box-footer -->
                                            </div>
                                            </center>
                                           </div>

                                    </div>

                                     {!! Form::close() !!}

                        

                            </div>

                        </div>



            </div>

            <!-- /.col -->
          </div>

        </div>

        <!-- /.row -->

        <!-- Main row -->

        <!-- /.row -->

    </section>

    <!-- /.content -->

</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="/resources/views/admin/dist/css/semantic.min.css">

<script type="text/javascript" src="/resources/views/admin/js/semantic.min.js"></script>
<script type="text/javascript">
var semantic = $.noConflict(true); 
    //$('#customers_emails').dropdown(); 

semantic('.dropdown').dropdown({
  label: {
    duration: 0,
  },
  debug: true,
  performance: true,
});

semantic('.ui.checkbox')
  .checkbox({
    onChecked() {
      const options = semantic('#customers_emails > option').toArray().map(
        (obj) => obj.value
      );
      semantic('#customers_emails').dropdown('set exactly', options);
    },
    onUnchecked() {
      semantic('#customers_emails').dropdown('clear');
    },
  });
   
</script>
@endsection