<?= $this->include("themes/_commonPartialsBs/sweetalert") ?>
<?= $this->include('themes/_commonPartialsBs/datatables') ?>
<?= $this->extend('themes/vuexy/main/defaultlayout') ?>
<?= $this->section('content'); ?>

<!-- Modal -->
<div class="modal fade" id="imageModal" tabindex="-1" aria-labelledby="imageModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="imageModalLabel">Vista Previa</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Cerrar"></button>
            </div>
            <div class="modal-body text-center">
                <img src="" id="modalImage" class="img-fluid rounded">
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <h4><?= $boxTitle ?></h4>
            </div>
            <div class="card-body">
                <form method="post" class="card-body" action="<?= $formAction ?>" enctype="multipart/form-data">
                    <?= csrf_field(); ?>
                    <?= view("themes/_commonPartialsBs/_alertBoxes") ?>
                    <?= !empty($validation->getErrors()) ? $validation->listErrors("bootstrap_style") : "" ?>
                    <div class="row">
                        <div class="mb-3 col-9">
                            <label class="form-label"><?= lang("Tickets.asunto") ?></label>
                            <input type="text" name="titulo" class="form-control"
                                <?= ($formAction !== route_to('NewTicket', $ticket->id)) ? "readonly" : "" ?>
                                value="<?= old('titulo', $ticket->titulo) ?>">
                        </div>
                    </div>

                    <div class="row">

                        <div class="col-3 mb-3">
                            <label class="form-label"><?= lang("Tickets.tipo") ?></label>
                            <select id="categoria" name="categoria_id" class="form-control select2"
                                <?= ($formAction !== route_to('NewTicket', $ticket->id) && !auth()->user()->can('tickets.edit')) ? "disabled" : "" ?>>
                                <?php foreach ($categorias as $categoria): ?>
                                    <option value="<?= $categoria['id']; ?>" <?= $categoria['id'] == $ticket->categoria_id ? ' selected' : '' ?>> <?= $categoria['text']; ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>


                        <div class="col-3 mb-3">
                            <label class="form-label"><?= lang("Tickets.seccion") ?></label>
                            <select id="seccion" name="seccion_id" class="form-control select2"
                                <?= ($formAction !== route_to('NewTicket', $ticket->id) && !auth()->user()->can('tickets.edit')) ? "disabled" : "" ?>>
                                <?php foreach ($secciones as $seccion): ?>
                                    <option value="<?= $seccion['id']; ?>" <?= $seccion['id'] == $ticket->seccion_id ? ' selected' : '' ?>><?= $seccion['text']; ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="col-3 mb-3">
                            <label class="form-label"><?= lang("Tickets.estado") ?></label>
                            <?php if ($formAction !== route_to('NewTicket') && auth()->user()->can('tickets.edit')): ?>
                                <select id="estado" name="estado_id" class="form-control select2">
                                <?php else: ?>
                                    <select id="estado" name="estado_id" class="form-control select2" disabled>
                                    <?php endif; ?>
                                    <?php foreach ($estados as $estado): ?>
                                        <option value="<?= $estado['id']; ?>" <?= $estado['id'] == $ticket->estado_id ? ' selected' : '' ?>><?= $estado['text']; ?>
                                        </option>
                                    <?php endforeach; ?>
                                    </select>
                        </div>

                    </div>

                    <?php if (auth()->user()->can('tickets.edit')): ?>

                        <div class="row">
                            <div class="mb-3 col-3">
                                <label class="form-label"><?= lang('Tickets.prioridad') ?></label>
                                <select id="prioridad" name="prioridad" class="form-control">
                                    <option value="baja" <?= $ticket->prioridad == 'baja' ? ' selected' : '' ?>>
                                        <?= lang('Tickets.baja') ?>
                                    </option>
                                    <option value="media" <?= $ticket->prioridad == 'media' ? ' selected' : '' ?>>
                                        <?= lang('Tickets.media') ?>
                                    </option>
                                    <option value="alta" <?= $ticket->prioridad == 'alta' ? ' selected' : '' ?>>
                                        <?= lang('Tickets.alta') ?>
                                    </option>
                                </select>
                            </div>

                            <div class="mb-3 col-3">
                                <label class="form-label"><?= lang('Tickets.asignarTo') ?></label>
                                <select id="user_soporte_id" name="user_soporte_id" class="form-control">
                                    <?php foreach ($supportUsers as $supportUser): ?>
                                        <option value="<?= $supportUser['id']; ?>" <?= $supportUser['id'] == $ticket->user_soporte_id ? ' selected' : '' ?>><?= $supportUser['name']; ?>
                                        </option>
                                    <?php endforeach; ?>
                                </select>
                            </div>

                        </div>

                    <?php endif; ?>

                    <div class="mb-3">
                        <label class="form-label"><?= lang("Tickets.descripcion") ?></label>
                        <textarea id="descripcion" name="descripcion" class="form-control"
                            <?= ($formAction !== route_to('NewTicket', $ticket->id)) ? "readonly" : "" ?>
                            rows="4"><?= old('descripcion', $ticket->descripcion) ?></textarea>
                    </div>

                    <?php if (isset($respuesta) || ($formAction !== route_to('NewTicket') && auth()->user()->can('tickets.edit'))) : ?>

                        <h4><?= lang("Tickets.respuesta") ?></h4>

                        <div class="mb-3">
                            <label class="form-label"><?= lang("Tickets.respuesta") ?></label>
                            <textarea id="respuestaMensaje" name="respuesta_mensaje" class="form-control"
                                <?= !auth()->user()->can('tickets.edit') ? "readonly" : "" ?>
                                rows="4"><?= isset($respuesta) ? old('respuestaMensaje', $respuesta->mensaje) : "" ?></textarea>
                        </div>

                    <?php endif; ?>

                    <?php if ($formAction === route_to('NewTicket') || ($formAction !== route_to('NewTicket') && auth()->user()->can('tickets.edit'))): ?>

                        <div class="row">
                            <div class="mb-3">
                                <label for="filesInput" class="form-label"><?= lang("Tickets.adjuntos") ?></label>
                                <input name="files[]" class="form-control" type="file" id="filesInput" multiple
                                    accept="image/*">
                            </div>
                        </div>
                    <?php endif; ?>

                    <?php if ($formAction !== route_to('NewTicket')): ?>
                        <h4><?= lang("Tickets.adjuntos_ticket") ?></h4>
                        <div class="container">
                            <?php foreach ($imagesTicket as $image): ?>
                                <div class="row">
                                    <div class="col-md-3 mb-3">
                                        <img src="<?= esc($image['path']) ?>" class="img-thumbnail img-fluid gallery-img"
                                            data-bs-toggle="modal" data-bs-target="#imageModal" data-src="<?= esc($image['path']) ?>"
                                            style="cursor:pointer;">
                                    </div>
                                </div>
                            <?php endforeach; ?>
                        </div>

                    <?php endif; ?>

                    <div class="pt-4">
                        <?php if (
                            $formAction === route_to('NewTicket') ||
                            ($formAction !== route_to('NewTicket') && auth()->user()->can('tickets.edit'))
                        ): ?>
                            <input
                                type="submit"
                                class="btn btn-primary float-start me-sm-3 me-1"
                                name="save"
                                value="<?= lang("Basic.global.Save") ?>" />
                        <?php endif; ?>
                        <?= anchor(route_to("TicketIndex"), lang("Basic.global.back"), ["class" => "btn btn-secondary"]) ?>

                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<?= $this->endSection(); ?>

<?= $this->section('css') ?>
<link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/libs/dropzone/dropzone.css') ?>" />
<?= $this->endSection() ?>


<?= $this->section('additionalExternalJs') ?>
<script src="<?= site_url("themes/vuexy/vendor/libs/dropzone/dropzone.js") ?>"></script>
<script type="module" src="<?= site_url('assets/js/safekat/pages/soporte/tickets.js') ?>"></script>

<?= $this->endSection() ?>