Update code with changes from git diff
This commit is contained in:
101
puestos.php
101
puestos.php
@@ -42,7 +42,7 @@
|
||||
<?
|
||||
if ($user->acceso == 'w') {
|
||||
?>
|
||||
<div class="justify-content-between align-items-center d-flex mb-4">
|
||||
<div class="marco text-right">
|
||||
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#nuevo-puesto">
|
||||
<span class="ing-mas"></span>
|
||||
Agregar puesto
|
||||
@@ -53,32 +53,31 @@
|
||||
}
|
||||
?>
|
||||
|
||||
<div class="d-flex flex-wrap justify-content-around">
|
||||
<div class="accordion col-8 mb-4" id="puestos"
|
||||
<div class="d-flex flex-wrap marco justify-content-around">
|
||||
<div class="accordion col-10 mx-auto my-5" id="puestos"
|
||||
v-scope="{selected_carrera_id: -1, current_materia: null, current_encargado: null}"
|
||||
v-if="puestos.length">
|
||||
<div class="card" v-for="(puesto, index) in puestos" :key="puesto.puesto_id">
|
||||
<div class="card-header bg-primary" :id="`puesto-${puesto.nombre}`">
|
||||
<h2 class="mb-0">
|
||||
<button class="btn btn-link btn-block text-left text-light" type="button"
|
||||
data-toggle="collapse" :data-target="`#puesto-${puesto.puesto_id}`" aria-expanded="true"
|
||||
:aria-controls="`puesto-${puesto.puesto_id}`">
|
||||
{{puesto.nombre}}
|
||||
|
||||
<button type="button" class="btn btn-outline-danger float-right"
|
||||
data-target="#eliminar-puesto" data-toggle="modal" @click="to_delete = puesto">
|
||||
<span class="icono ing-basura"></span>
|
||||
</button>
|
||||
</button>
|
||||
</h2>
|
||||
<div class="card mb-3 shadow-lg" v-for="(puesto, index) in puestos" :key="puesto.puesto_id">
|
||||
<!-- Card Header -->
|
||||
<div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
|
||||
<button class="btn btn-link text-white flex-grow-1 text-left" type="button"
|
||||
data-toggle="collapse" :data-target="`#puesto-${puesto.puesto_id}`" aria-expanded="true"
|
||||
:aria-controls="`puesto-${puesto.puesto_id}`">
|
||||
{{puesto.nombre}}
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-light" data-target="#eliminar-puesto"
|
||||
data-toggle="modal" @click="to_delete = puesto">
|
||||
<i class="fas fa-trash-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div :id="`puesto-${puesto.puesto_id}`" class="collapse" :class="{'show': index == 0}"
|
||||
<div :id="`puesto-${puesto.puesto_id}`" class="collapse"
|
||||
:aria-labelledby="`puesto-${puesto.nombre}`" data-parent="#puestos">
|
||||
<div class="card-body">
|
||||
<!-- Encargado -->
|
||||
<div class="form-row justify-content-around align-items-center mb-2">
|
||||
<label :for="`encargado-${puesto.puesto_id}`" class="col-3">
|
||||
<label :for="`encargado-${puesto.puesto_id}`" class="col-2 barra-right">
|
||||
Encargado del área
|
||||
</label>
|
||||
<div id="encargados" class="datalist datalist-select mb-1 col-9">
|
||||
@@ -104,7 +103,7 @@
|
||||
|
||||
<div class="form-row justify-content-around align-items-center mb-2"
|
||||
v-show="carreras.length">
|
||||
<label :for="`carrera-${puesto.puesto_id}`" class="col-3">
|
||||
<label :for="`carrera-${puesto.puesto_id}`" class="col-2 barra-right">
|
||||
Carrera
|
||||
</label>
|
||||
<div id="dlCarreras" class="datalist datalist-select mb-1 col-9">
|
||||
@@ -128,7 +127,7 @@
|
||||
</div>
|
||||
<div class="form-row justify-content-around align-items-center"
|
||||
v-scope="{to_add_materia: null}">
|
||||
<label :for="`materias-${puesto.puesto_id}`" class="col-3">
|
||||
<label :for="`materias-${puesto.puesto_id}`" class="col-2 barra-right">
|
||||
Materias
|
||||
</label>
|
||||
<input name="materia" placeholder="Seleccione una materia" list="datalist-materias"
|
||||
@@ -152,36 +151,51 @@
|
||||
</datalist>
|
||||
|
||||
<hr>
|
||||
<fieldset class="container d-flex flex-column justify-content-center align-items-center">
|
||||
<legend>Materias Asignadas <span
|
||||
class="badge badge-secondary">{{puesto.materias.length}}</span></legend>
|
||||
<ul class="list-group overflow-auto col-10" v-if="puesto.materias.length"
|
||||
style="max-height: 200px; overflow-y: auto;">
|
||||
<li class="list-group-item list-group-item-action"
|
||||
<style>
|
||||
.list-group-item-action:hover {
|
||||
background-color: rgba(255, 0, 0, 0.1);
|
||||
/* Light red tint on hover for better feedback */
|
||||
}
|
||||
|
||||
.list-group-item-action:active {
|
||||
background-color: rgba(255, 0, 0, 0.2);
|
||||
/* Slightly darker red tint when active */
|
||||
}
|
||||
</style>
|
||||
<fieldset class="container mt-4">
|
||||
<legend class="text-center mb-3">
|
||||
Materias Asignadas <span class="badge badge-info">{{puesto.materias.length}}</span>
|
||||
</legend>
|
||||
|
||||
<!-- Assigned Subjects List -->
|
||||
<ul class="list-group shadow-sm" v-if="puesto.materias.length"
|
||||
style="max-height: 250px; overflow-y: auto;">
|
||||
<li class="list-group-item list-group-item-action d-flex justify-content-between align-items-center"
|
||||
v-for="materia in puesto.materias" :key="materia.materia_id"
|
||||
@click="puesto.materias.splice(puesto.materias.indexOf(materia), 1); materias.push(materia)"
|
||||
style="cursor: pointer;">
|
||||
<div class="d-flex justify-content-center">
|
||||
<div class="col-2 text-center">
|
||||
<span class="icono ing-borrar text-danger"></span>
|
||||
</div>
|
||||
<div class="col-10 text-left">
|
||||
{{materia.clave_materia}} - {{materia.materia_nombre}}
|
||||
</div>
|
||||
</div>
|
||||
style="cursor: pointer; transition: background-color 0.3s ease;">
|
||||
|
||||
<span class="flex-grow-1">
|
||||
{{materia.clave_materia}} - {{materia.materia_nombre}}
|
||||
</span>
|
||||
|
||||
<!-- Delete icon - assuming using FontAwesome, replace with your icon system if different -->
|
||||
<i class="fas fa-trash-alt text-danger ml-3" style="cursor: pointer;"></i>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="alert alert-light" role="alert" v-else>
|
||||
|
||||
<!-- Empty State Alert -->
|
||||
<div class="alert alert-light text-center" role="alert" v-else>
|
||||
No hay materias asignadas
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="card-footer text-muted">
|
||||
<!-- scroll to top -->
|
||||
<button type="button" class="btn btn-outline-primary btn-lg btn-block"
|
||||
@click="actualizarPuesto(puesto.puesto_id, puesto.materias, puesto.encargado?.usuario_id)"
|
||||
onclick="window.scrollTo(0, 0);">
|
||||
<div class="card-footer d-flex justify-content-between align-items-center">
|
||||
<!-- <small class="text-muted">Última actualización: {{ puesto.lastUpdate | formatDate }}</small> -->
|
||||
<button type="button" class="btn btn-primary"
|
||||
@click="actualizarPuesto(puesto.puesto_id, puesto.materias, puesto.encargado?.usuario_id)">
|
||||
{{ puesto.encargado ? 'Guardar cambios' : 'Guardar sin encargado' }}
|
||||
</button>
|
||||
</div>
|
||||
@@ -278,6 +292,11 @@
|
||||
<script src="js/datalist.js"></script>
|
||||
<script src="js/puestos.js?<?= rand(0, 2) ?>" type="module"></script>
|
||||
<script src="js/scrollables.js"></script>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$('.collapse').collapse
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user