@include('system-layouts.layout-head')
@include('mod-notifications.title')

@php($url_default='notifications')
<div class="container-fluid">
    <!-- contentiner -->
    <!-- col -->
    <div class="card">
        <div class="card-header m-b-20">
            <h4 class="text-themecolor ">Adicionar</h4>
        </div>
        <!-- card -->
        <div class="card-body">

            <form action="{{ asset($url_default.'/add') }}" method="post" class="needs-validation error" novalidate
                  id="actionIndex">

                <div class="row">
                    <div class="col-12">
                        <div class="form-group">
                            <div class="d-flex flex-row">
                                <h5>Titulo<span class="text-danger">*</span></h5>
                                <i class="bi bi-exclamation-circle input-tooltip" data-toggle="tooltip"
                                   data-placement="top"
                                   title="Insira o titulo para a notificação."></i>
                            </div>
                            <div class="controls">
                                <input type="text" name="xName" id="xName" class="form-control" required=""
                                       data-validation-required-message="This field is required" value="">
                                <div class="help-block"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-12">
                        <div class="form-group">
                            <div class="d-flex flex-row">
                                <h5>Descrição</h5>
                                <i class="bi bi-exclamation-circle input-tooltip" data-toggle="tooltip"
                                   data-placement="top"
                                   title="Insira uma descrição para a notificação."></i>
                            </div>
                            <div class="controls">
                            <textarea class="textarea_editor form-control" maxlength="250" name="description"
                                      id="description" rows="8"
                                      placeholder="Enter texto..."></textarea>
                                <div class="textarea_count"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <hr>

                <div class="row">
                    <div class="col-12 m-t-20 m-b-20">
                        <h4>
                            Evento:
                        </h4>
                        <span id="dateEvent">
{{--                                <input type="checkbox" checked class="js-switch" data-color="#f62d51" data-size="small" />--}}
                            Datas dos eventos
                        </span>
                    </div>
                </div>

                <div class="row " id="idEvent">

                    <div class="col-6">
                        <div class="form-group">
                            <div class="d-flex flex-row">
                                <h5>Data inicio<span class="text-danger">*</span></h5>
                                <i class="bi bi-exclamation-circle input-tooltip" data-toggle="tooltip"
                                   data-placement="top"
                                   title="Defina uma data para começar a aparição da notificação."></i>
                            </div>
                            <div class="controls">
                                <input type="text" name="dateStart" id="dateStart" required
                                       class="form-control mask-data required"
                                       data-validation-required-message="campo obrigatorio " value=""
                                       placeholder="__/__/_____">
                                <div class="help-block"></div>
                            </div>
                        </div>
                    </div>


                    <div class="col-6">
                        <div class="form-group">
                            <div class="d-flex flex-row">
                                <h5>Data Final<span class="text-danger">*</span></h5>
                                <i class="bi bi-exclamation-circle input-tooltip" data-toggle="tooltip"
                                   data-placement="top"
                                   title="Defina uma data para terminar a aparição da notificação."></i>
                            </div>
                            <div class="controls">
                                <input type="text" name="dateEnd" id="dateEnd" class="form-control mask-data required"
                                       data-validation-required-message="This field is " value=""
                                       placeholder="__/__/_____">
                                <div class="help-block"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-12">
                        <div class="form-group">
                            <div class="d-flex flex-row">
                                <h5>Fonte<span class="text-danger">*</span></h5>
                                <i class="bi bi-exclamation-circle input-tooltip" data-toggle="tooltip"
                                   data-placement="top"
                                   title="Defina uma fonte para a notificação. Ex: Setor, Canal de noticias, entre outros."></i>

                            </div>
                            <div class="controls">
                                <input type="text" name="notificationSource" id="notificationSource"
                                       class="form-control" required=""
                                       data-validation-required-message="This field is required" value="">
                                <div class="help-block"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-6">
                        <div class="form-group">
                            <label class="control-label">Compartilhar
                                <i class="bi bi-exclamation-circle input-tooltip" data-toggle="tooltip"
                                   data-placement="top"
                                   title="Selecione a quem será compartilhado a norificação."></i>
                            </label>
                            <select class="form-control " data-placeholder="Choose a Category"
                                    tabindex="1" name="idShared" id="idShared">
                                <option value="">--</option>
                                <option value="1">Individual</option>
                                {{--                                    <option value="2">Setor</option>--}}
                                <option value="3">Todos</option>
                            </select>
                        </div>
                    </div>
                </div>

                <div class="row" id="idSharedSelect">
                </div>

                <input type="hidden" name="_token" id="_token" value="{{ csrf_token() }}">
                <hr>
                <div class="row p-t-20">
                    <div class="col-md-8"></div>
                    <div class="col-md-4">
                        <div class="btn-group btn-group  float-right" role="group" aria-label="Basic example">
                            <button type="submit" class="btn waves-effect waves-light btn-primary">    <i
                                        class="ti-save"></i> salvar    
                            </button>
                            <a href="{{asset($url_default)}}" class="btn waves-effect waves-light btn-secondary"
                               data-dismiss="modal" aria-hidden="true"> <i class="fa fa-chevron-left"></i>
                                Voltar</a>
                        </div>
                    </div>
                </div>


            </form>

        </div>
        <!--/ card -->
    </div>
    <!--/ end col -->
    <!--/ end contentiner -->
</div>
@include('system-layouts/layout-footer')
@include('mod-notifications.script')