@extends('layouts.app')
@section('title', 'Add SMS AI Template')
@section('content')
<!-- Content Wrapper. Contains page content -->


<!-- Main content -->
<section class="content">
        <div class="row">
        <div class="col-lg-12 col-12">
                <div class="box">

                    
                             <div class="box-body"><!--bg-lightest-->
                             <h4 class="box-title text-info mb-0"><i class="fa fa-plus"></i> Add Template</h4>
            <a  href="{{url('/sms-ai-templates')}}" type="button" style="float:right" class="waves-effect waves-light btn btn-rounded btn-primary btn-bitbucket btn-sm mb-5"><i class="fa fa-eye fa-sx"></i> SMS AI Templates</a> 
            <hr class="my-15">
                    <div class="row col-md-12">      
                        
                        <form  method="post"  id="systemForm">
                                @csrf
                                <div class="row">
                                  
                                 
                                    <div class="form-group col-md-5">
                                    <label for="exampleInputEmail1"> Template Name</label>
                                    <div class="input-group">
                                     <span class="input-group-text @error('template_name') text-danger border-danger @enderror"><i class="ti-mobile"></i></span>
                                    <input type="text" required class="form-control " name="template_name"   id="template_name" placeholder="">

                                    </div>
                                    </div>

                                     <div class="form-group col-md-5">
                                    <label for="exampleInputEmail1"> Labels</label>
                                    <div class="input-group">
                                      <select id="multiple_labels" class="select2"  multiple="multiple"  autocomplete="off" data-placeholder="Select Labels" style="width: 100%;">
                                        @foreach($label_list as $list)
                                            <option value="<?php echo '[['.$list->title.']]' ?>">{{$list->title}}</option>
                                        @endforeach;
                                    </select>
                                  

                                    </div>
                                    </div>


                                   

                                   
                                    <div class="form-group col-md-12">
                                    <label for="exampleInputEmail1">Introduction</label>
                                    <div class="input-group">
                                    <textarea class="form-control" id="message"  name="introduction" rows="3"></textarea> 
                                            
                                    </div>
                                    </div>
                                    <div class="form-group col-md-12">
                                    

                                    <label for="exampleInputEmail1">Description</label>
                                    <div class="input-group">
                                    <textarea class="form-control"   name="description" rows="10"></textarea> 


                                  
                                    </div>
                                    </div>


                                    
                                  
                                    
                                   

                                    
                </div>

            
                    <div class="box-footer text-end">
                      
                    <button type="submit"  class="btn btn btn-primary waves-effect waves-light"><i class="ti-save-alt"></i> Submit</button> 


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

            </div><!-- /.col -->
        </div><!-- /.row -->
    </section><!-- /.content -->
</div>



<script src="{{ asset('asset/plugins/input-mask/jquery.inputmask.js')}}"></script>
<script src="{{ asset('assets/vendor_plugins/input-mask/jquery.inputmask.date.extensions.js')}}"></script>

<script>
  $(document).ready(function ()
  {



    
    $('.phone_number').inputmask("(999) 999-9999");
   
</script>

  <script>
            $(document).ready(function() {
    $( "#multiple_labels" ).on('change', function() {
        displayVals();
    });
});
    function displayVals() {
       // $( "#message" ).val('');
        var singleValues = $( "#message" ).val();
        var multipleValues = $( "#multiple_labels" ).val() || [];
        $( "#message" ).val(singleValues+' '+ multipleValues.join( " " ) );

        $( "#multiple_labels" ).val('');
    }

    </script>


@endsection