@extends('layouts.app')
@section('appjs')
    <script type="application/javascript" src="{{ asset('js/app.js') }}"></script>
@endsection
@section('content')
@section('page_title') Add RichMedia Templates @endsection
<style type="text/css">
    .field_wrapper div{
	    margin-bottom:10px;
    }
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
    }
    .col-form-label:after{
    content:'*';
    color:red;
    padding-left:5px;
}
</style>
<div class="container">
<div class="card-header flex justify-content-between">
        <h4> Add Bot Account </h4>
            <div>
            <a href="{{url('botAccountList')}}" class="btn btn-sm btn-dark">Bot Account List</a>
            </div>
    </div>
    <div class="card">
        <div class="card-body">
            <form method="post" action="{{ url('save_rcs_account') }}" enctype="multipart/form-data" autocomplete="off">
                {{ csrf_field() }}
                <div class="form-group row">
                    <label for="organization" class="col-sm-3 col-form-label">Organization</label>
                    <div class="col-sm-6">
                    <select name="organization" id="organization" class="form-control" data-live-search="true" required>
                        <option value="">Select Organization</option>
                        @foreach ($accountname as $value)
                        <option value="{{$value->id}}">
                            {{ $value->account_name }}-({{$value->email}})
                        </option>
                                @endforeach
                    </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label for="file" class="col-sm-3 col-form-label">Header Name</label>
                    <div class="col-sm-6">
                        <input id='bot_brand_name' type="text" name="bot_brand_name" class="form-control" placeholder="Enter Header Name" required />
                    </div>
                </div>
                <div class="form-group row">
                    <label for="file" class="col-sm-3 col-form-label">User Name</label>
                    <div class="col-sm-6">
                        <input id='user_name' type="text" name="user_name" class="form-control" placeholder="Enter User Name" required />
                    </div>
                </div>
                <div class="form-group row">
                    <label for="file" class="col-sm-3 col-form-label">Password</label>
                    <div class="col-sm-6">
                        <input id='rcs_password' type="password" name="rcs_password" class="form-control" placeholder="Enter Password" required />
                    </div>
                </div>
                <div class="form-group row">
                    <label for="file" class="col-sm-3 col-form-label">Agent ID</label>
                    <div class="col-sm-6">
                        <input id='agent_id' type="text" name="agent_id" class="form-control" required />
                    </div>
                </div>
                <div class="form-group row">
                    <label for="sms_type" class="col-sm-3 col-form-label" >Message Type</label>
                    <div class="col-sm-6">
                    <select name="sms_type" id="sms_type" class="form-control" style="-webkit-appearance: none;" required>
                            <option value="1" selected>Promotional</option>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label for="rcs_type_id" class="col-sm-3 col-form-label">RichMedia Type</label>
                    <div class="col-sm-6">
                    <select name="rcs_type_id" id="rcs_type_id" class="form-control" style="-webkit-appearance: none;" required>
                            <option value="1" Selected>RichMedia-G</option>
                            <option value="4">RichMedia-J</option>
                        </select>
                    </div>
                </div>
                @can('hasAddPermission')
                <div class="form-group row">
                    <div class="offset-sm-3 col-sm-6">
                        <button type="submit"  class="btn btn-sm btn-block btn-primary">Submit</button>
                    </div>
                </div>
                @endcan
            </form>
        </div>
    </div>
</div>
<style>
.hide{
    display:none;
}
.pull-right{
    margin-left : 10px;
}
</style>
<script>
$(document).ready(function(){

    $('#organization').multiselect({
            enableFiltering: true,
            enableCaseInsensitiveFiltering: true,
            includeFilterClearBtn:true,
            buttonWidth:'515px',
            enableHTML: true,
            templates: {
                filter: '<li class="multiselect-item multiselect-filter"><div class="input-group mb-3"><div class="input-group-prepend"><span class="input-group-text"><i class="fa fa-search"></i></span></div><input class="form-control multiselect-search" type="text" /></div></li>',
                filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default multiselect-clear-filter" type="button"><i class="fa fa-close"></i></button></span>'
            }
        });
    });
</script>
@endsection