EVOLUTION-MANAGER
Edit File: servicios_index.blade.php
@extends("admin.layouts.app") @section("title") Servicios @endsection @section("estilos") <style> .contenedor_responsive{ padding: 25px 0px 0px 0px; } .responsive_ofrece{ /*editado ----------------------------------*/ /* display: flex; flex-wrap: wrap; gap: 0px 10px; user-select: none; */ display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 4px; padding: 16px; box-sizing: border-box; user-select: none; } .colum_ofrece{ /*editado ----------------------------------*/ /* flex: 1 1 0; */ text-align: center; } .colum_ofrece .htitulo1{ display: flex; line-height: 1; font-weight: bold; gap: 3px; align-items: center; justify-content: center; } .colum_ofrece .htitulo1 input{ margin-left: 3px; } .colum_ofrece .htitulo1:hover{ color: #94c11f; } .colum_ofrece .htitulo{ text-align: left; /*editado ----------------------------------*/ display: flex; align-items: flex-end; line-height: 1; gap: 4px; font-weight: bold; } .colum_ofrece .htitulo img{ max-height: 28px; } .colum_ofrece ul{ list-style: none; padding-left: 0; margin-bottom: 0.8rem; } .colum_ofrece li{ text-align: left; /*editado ----------------------------------*/ /* width: max-content; */ position: relative; padding-left: 5px; line-height: 1; font-size: 0.8rem; } .colum_ofrece li::before{ position: absolute; left: 0; } .ul_select li label{ display: flex; gap: 5px; padding-bottom: 6px; } .ul_select li *{ margin: 0; font-weight: normal !important; } .ul_select li label:hover{ font-weight: 700 !important; cursor: context-menu !important; } .custom_checkbox:checked { background-color: #90bf14; border-color: #90bf14; } .custom_checkbox:checked::after { content: ''; position: absolute; top: 0px; left: 4px; width: 5px; height: 10px; border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); } .custom_checkbox { appearance: none; width: 15px; height: 15px; border: 1px solid #444444; border-radius: 3px; background-color: #fff; cursor: pointer; position: relative; } </style> @endsection @section("contenido") <div class="content-header"> <div class="container-fluid"> <div class="row mb-2"> <div class="col-sm-6"> <h1 class="m-0">Gestión de Servicios</h1> </div> </div> </div> </div> <section class="content"> <div class="container-fluid"> <div class="row"> <div id="content_formulario" class="col-md-12" style="display: none;"> <div class="card card-default"> <div class="card-header"> <h3 class="card-title"> <b>Formulario Servicio</b> </h3> </div> <form id="frm_guardar_servicio" method="POST" enctype="multipart/form-data"> <div class="card-body"> <div class="row"> <input type="hidden" name="servicio_id_edit" id="servicio_id_edit" value=""> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><span class="requerido">*</span><b>Parroquia {!!espacio(0)!!}</b></span> </div> <select class="form-control" name="parroquia" id="parroquia" required> <option selected value="">-- Seleccione --</option> @foreach ($parroquias as $parro) <option value="{{$parro->id}}">{!!$parro->nombre!!}</option> @endforeach </select> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><span class="requerido">*</span><b>Tipo de servicio {!!espacio(0)!!}</b></span> </div> <select class="form-control" name="tipo_servicio" id="tipo_servicio" required=""> <option selected value="">-- Seleccione --</option> @foreach ($tipo_servicios as $ts) <option value="{{$ts->id}}">{!!$ts->nombre!!}</option> @endforeach </select> </div> </div> <div class="col-sm-12"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><span class="requerido">*</span> <b>Nombre {!!espacio(3)!!}</b></span> </div> <input type="text" name="nombre" id="nombre" class="form-control" placeholder="Escriba aquí..." value="" required> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><span class="requerido">*</span> <b>Dirección {!!espacio(0)!!}</b></span> </div> <input type="text" name="direccion" id="direccion" class="form-control" placeholder="Escriba aquí..." value="" required> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>Correo {!!espacio(0)!!}</b></span> </div> <input type="email" name="correo" id="correo" class="form-control" placeholder="Escriba aquí..." value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>Teléfono {!!espacio(0)!!}</b></span> </div> <input type="number" name="telefono" id="telefono" class="form-control" placeholder="000000000" value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>Celular {!!espacio(0)!!}</b></span> </div> <input type="text" name="celular" id="celular" class="form-control" placeholder="000000000" value=""> <div class="input-group-prepend"> <span class="input-group-text" style="border-left: none;"> <label for="celular_what" style="margin-bottom: 0px;"> <i class="fab fa-whatsapp" style="margin-right: 10px;"></i> </label> <input type="checkbox" name="celular_what" id="celular_what"> </span> </div> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>Costo {!!espacio(0)!!}</b></span> </div> <input type="number" name="costo" id="costo" class="form-control" placeholder="0.00" value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>Responsable {!!espacio(0)!!}</b></span> </div> <input type="text" name="responsable" id="responsable" class="form-control" placeholder="Escriba aquí..." value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>Horario {!!espacio(0)!!}</b></span> </div> <input type="text" name="horario" id="horario" class="form-control" placeholder="Escriba aquí..." value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>Coordenadas {!!espacio(0)!!}</b></span> </div> <input type="text" name="latitud" id="latitud" class="form-control" placeholder="Latitud" value=""> <input type="text" name="longitud" id="longitud" class="form-control" placeholder="Longitud" value=""> </div> </div> {{-- ENLACES DE REDES SOCIALES --}} <div class="col-sm-12"> <div style="padding: 0px 0px; margin: 15px 0px 0px 0px;"> <span style="font-size: 15px;"><b class="text-success">Enlaces a redes sociales</b></span> <hr style="margin: 0px 0px 15px 0px;"> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>URL página web {!!espacio(0)!!}</b></span> </div> <input type="text" name="url_web" id="url_web" class="form-control" placeholder="Escriba aquí..." value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>URL Facebook {!!espacio(0)!!}</b></span> </div> <input type="text" name="url_fb" id="url_fb" class="form-control" placeholder="Escriba aquí..." value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>URL Instagram {!!espacio(0)!!}</b></span> </div> <input type="text" name="url_in" id="url_in" class="form-control" placeholder="Escriba aquí..." value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>URL X {!!espacio(0)!!}</b></span> </div> <input type="text" name="url_x" id="url_x" class="form-control" placeholder="Escriba aquí..." value=""> </div> </div> <div class="col-sm-6"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>URL Youtube {!!espacio(0)!!}</b></span> </div> <input type="text" name="url_yt" id="url_yt" class="form-control" placeholder="Escriba aquí..." value=""> </div> </div> </div> {{-- IMAGENES DEL SERVICIO --}} <div id="contenedor_ofrece"> <div class="col-sm-12"> <div style="padding: 0px 0px; margin: 15px 0px 0px 0px;"> <span style="font-size: 15px;"><b class="text-info">Lo que el servicio ofrece</b></span> <hr style="margin: 0px 0px 15px 0px;"> </div> </div> <div class="content_ofrece section_ofrece col-sm-12 mb-2"> <button type="button" class="btn_agregar_ofrece btn btn-info btn-sm mb-3"><i class="fa fa-plus"></i> Agregar Ofrece </button> <div id="card_ofrece" class="card_ofrece"> {{-- <div class="body_ofrece"> <span class="card_info"> <i class="fa fa-edit"></i> Vista al jardin Vista al jardin Vista al jardin Vista al jardin Vista al jardin Vista al jardin </span> <span class="card_btn_del"> <button type="button" class="btn btn-xs btn-outline-secondary"><i class="fas fa-times"></i></button> </span> </div> --}} </div> <div class="modal_agregar_ofrece modal fade"> <div class="modal-dialog modal-xl"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title"><i class="fa fa-bars"></i> Ofrece</h4> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <div class="ofrece_form"> <div class="col-sm-12"> <div class="col-sm-12"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><b>Nombre {!!espacio(0)!!}</b></span> </div> <textarea type="text" class="ofrece_nombre form-control" placeholder="Escriba aquí..."></textarea> </div> </div> <div class="col-sm-12"> <div class="input-group mb-2"> <div class="input-group-prepend"> <span class="input-group-text"><i class="ofrece_view_icono"></i></span> </div> <input type="text" class="ofrece_icono form-control" placeholder="Escriba aquí..."> <button type="button" class="ofrece_select_icono btn btn-default"> Seleccionar Icono </button> </div> </div> </div> </div> <div class="ofrece_lista_iconos"> <div class="input-group mb-2"> <input type="text" class="ofrece_buscar_icono form-control"> <div class="input-group-prepend"> <span class="input-group-text"><i class="fas fa-search fa-fw"></i></span> </div> </div> @include("admin.listado_iconos") </div> </div> <div class="modal-footer justify-content-between"> <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fas fa-times"></i> Cerrar</button> <button type="button" class="btn btn-primary ofrece_btn_agregar"><i class="fa fa-save"></i> Agregar</button> </div> </div> </div> </div> </div> </div> {{-- NUEVA SECCION DE LO QUE OFRECE --}} <div id="contenedor_ofrece_v2" class="contenedor_ofrece_v2" style="display: none;"> <div class="col-sm-12"> <div style="padding: 0px 0px; margin: 15px 0px 0px 0px;"> <span style="font-size: 15px;"><b class="text-info">Lo que el servicio ofrece</b></span> <hr style="margin: 0px 0px 15px 0px;"> </div> </div> <textarea id="texto_ofrece" name="texto" class="form-control" cols="30" rows="4"></textarea> <div class="contenedor_responsive"> <div id="lista_titulo1" class="responsive_ofrece"> <!-- SE CARGA CON JQUERY --> </div> <hr> <div id="lista_titulo" class="responsive_ofrece"> <!-- SE CARGA CON JQUERY --> </div> </div> </div> {{-- IMAGENES DEL SERVICIO --}} <div class="col-sm-12"> <div style="padding: 0px 0px; margin: 15px 0px 0px 0px;"> <span style="font-size: 15px;"><b class="text-primary">Imagenes</b></span> <hr style="margin: 0px 0px 15px 0px;"> </div> </div> <div class="section_files col-sm-12"> <div class="content_add"> <button class="files_btn_agregar btn btn-sm btn-primary mb-3" type="button"><i class="fa fa-plus"></i> Agregar Imagen</button> <input type="file" data-name="servicio_imagen" data-detalle="false" data-detalle-name="imagen_detalle" data-detalle-pl="Detalle" class="files_btn_multiple" multiple hidden data-show-preview="false" accept="image/*" style="display: none"> </div> <div id="content_files" class="content_files"> {{-- <div class="card_files"> <div class="card_body"> <img class="carrousel_img" src="{{route_public('pagina/img/servicios/casa_ceivo_bus2.png')}}" alt=""> <input id="servicio_imagen_1" name="servicio_imagen" type="file"> <span class="name_files">Nombre largo de pruebas del documento.pdf</span> <span class="items"> <input name="imagen_descripcion" class="detalle form-control form-control-sm" type="text" placeholder="Detalle"> </span> <span class="buttons_files"> <button type="button" data-name-delete="servicio_imagen" class="btn_files_delete btn btn-xs btn-danger"><i class="fa fa-trash"></i> </button> </span> </div> </div> --}} </div> </div> <hr> <button id="btn_servicio" class="btn btn-success"><i class="fa fa-save"></i> Guardar</button> <button id="btn_cancelar" class="btn btn-warning" onclick="cancelar_editado()" type="button"><i class="fas fa-arrow-alt-circle-left"></i> Cancelar</button> </div> </form> </div> </div> <div id="content_nuevo_servicio" class="col-sm-12"> <button id="btn_nuevo_servicio" class="btn btn-outline-primary mb-3"><i class="fa fa-plus"></i> Agregar nuevo servicio</button> </div> <div class="col-md-12"> <div class="card card-default"> <div class="card-header"> <h3 class="card-title"> <b>Listado de Servicios</b> </h3> </div> <div class="card-body"> <table id="tabla_servicios" class="table table-sm table-bordered table-hover"> <thead> <tr> <th style="width: 1px;">N#</th> <th>Parroquia</th> <th>Tipo</th> <th>Nombre</th> <th style="width: 1px;">Opciones</th> </tr> </thead> <tbody> </tbody> </table> </div> </div> </div> </div> </div> </section> @endsection @section("scripts") <script src="{{route_public('admin/js/servicios.js')}}"></script> @endsection