Stable
This commit is contained in:
@@ -1,155 +1,155 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Cliente REST</title>
|
||||
<script type="module" src="../js/client.js" defer></script>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="../css/indivisa.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header class="container-fluid bg-dark text-white text-center">
|
||||
Página de Cliente REST
|
||||
</header>
|
||||
<main class="container" @vue:mounted="mounted">
|
||||
<div v-for="error in store.errors" class="alert alert-danger alert-dismissible fade show" role="alert">
|
||||
<strong>Error!</strong> {{error}}
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h1>Periodos activos</h1>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="list-group">
|
||||
|
||||
<li href="#" class="list-group-item" v-for="(periodo, index) in store.periodosV1" :key="periodo.IdPeriodo">
|
||||
<!-- v1
|
||||
IdNivel: number;
|
||||
IdPeriodo: number;
|
||||
NombreNivel: string;
|
||||
NombrePeriodo: string;
|
||||
-->
|
||||
<div class="row">
|
||||
<span class="badge bg-secondary">{{index}}</span>
|
||||
<h2 class="text-center">
|
||||
Información
|
||||
</h2>
|
||||
<div class="col-md-3">
|
||||
<strong>ID Nivel:</strong> {{periodo.IdNivel}}
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<strong>ID Periodo:</strong> {{periodo.IdPeriodo}}
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<strong>Nombre Nivel:</strong> {{periodo.NombreNivel}}
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<strong>Nombre Periodo:</strong> {{periodo.NombrePeriodo}}
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
FechaFin: string;
|
||||
FechaInicio: string;
|
||||
IdPeriodo: number;
|
||||
-- info(IdPeriodo) --
|
||||
-->
|
||||
<div class="row mt-2" v-if="complete(periodo.IdPeriodo)">
|
||||
<h2 class="text-center">
|
||||
Fechas
|
||||
</h2>
|
||||
<div class="col-md-2">
|
||||
<strong>Fecha Inicio:</strong> {{info(periodo.IdPeriodo).FechaInicio}}
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<strong>Fecha Fin:</strong> {{info(periodo.IdPeriodo).FechaFin}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!periodo.in_db" class="row mt-2">
|
||||
<!--
|
||||
PeriodoV2
|
||||
ClaveCarrera: string;
|
||||
NombreCarrera: string;
|
||||
PeriodoV1
|
||||
IdNivel: number;
|
||||
-->
|
||||
<div class="col-md-12">
|
||||
<button class="btn btn-primary float-end" @click="store.addPeriodo(periodo)"
|
||||
:disabled="!complete(periodo.IdPeriodo)">
|
||||
Agregar
|
||||
<i class="ing ing-mas"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="row mt-2">
|
||||
<div class="col-md-12">
|
||||
<button class="btn btn-success float-end disabled">
|
||||
Agregado
|
||||
<i class="ing-aceptar"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-2">
|
||||
<div class="col-md-12">
|
||||
<button class="btn btn-secondary float-end" @click="store.addCarreras(periodo.IdPeriodo)">
|
||||
Sincronizar Carreras
|
||||
<i class="ing ing-link"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="accordion mt-2">
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header">
|
||||
<button class="accordion-button collapsed" data-bs-toggle="collapse"
|
||||
:data-bs-target="`#collapse-${periodo.IdPeriodo}`">
|
||||
Horarios del periodo
|
||||
</button>
|
||||
</h2>
|
||||
<div :id="`collapse-${periodo.IdPeriodo}`" class="accordion-collapse collapse">
|
||||
<div class="accordion-body">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item"
|
||||
v-for="periodo in store.periodosV2.filter(periodov2 => periodov2.IdPeriodo === periodo.IdPeriodo)">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<strong>Clave Carrera:</strong> {{periodo.ClaveCarrera}}
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<strong>Nombre Carrera:</strong> {{periodo.NombreCarrera}}
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<span class="badge float-end mx-1"
|
||||
:class="periodo.linked ?'bg-success':'bg-secondary'">
|
||||
<i class="ing-link"></i>
|
||||
</span>
|
||||
<span class="badge float-end mx-1"
|
||||
:class="periodo.in_db ?'bg-success':'bg-secondary'">
|
||||
<i class="ing-aceptar"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</main>
|
||||
<footer>
|
||||
|
||||
</footer>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
</body>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Cliente REST</title>
|
||||
<script type="module" src="../js/client.js" defer></script>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="../css/indivisa.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header class="container-fluid bg-dark text-white text-center">
|
||||
Página de Cliente REST
|
||||
</header>
|
||||
<main class="container" @vue:mounted="mounted">
|
||||
<div v-for="error in store.errors" class="alert alert-danger alert-dismissible fade show" role="alert">
|
||||
<strong>Error!</strong> {{error}}
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h1>Periodos activos</h1>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="list-group">
|
||||
|
||||
<li href="#" class="list-group-item" v-for="(periodo, index) in store.periodosV1" :key="periodo.IdPeriodo">
|
||||
<!-- v1
|
||||
IdNivel: number;
|
||||
IdPeriodo: number;
|
||||
NombreNivel: string;
|
||||
NombrePeriodo: string;
|
||||
-->
|
||||
<div class="row">
|
||||
<span class="badge bg-secondary">{{index}}</span>
|
||||
<h2 class="text-center">
|
||||
Información
|
||||
</h2>
|
||||
<div class="col-md-3">
|
||||
<strong>ID Nivel:</strong> {{periodo.IdNivel}}
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<strong>ID Periodo:</strong> {{periodo.IdPeriodo}}
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<strong>Nombre Nivel:</strong> {{periodo.NombreNivel}}
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<strong>Nombre Periodo:</strong> {{periodo.NombrePeriodo}}
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
FechaFin: string;
|
||||
FechaInicio: string;
|
||||
IdPeriodo: number;
|
||||
-- info(IdPeriodo) --
|
||||
-->
|
||||
<div class="row mt-2" v-if="complete(periodo.IdPeriodo)">
|
||||
<h2 class="text-center">
|
||||
Fechas
|
||||
</h2>
|
||||
<div class="col-md-2">
|
||||
<strong>Fecha Inicio:</strong> {{info(periodo.IdPeriodo).FechaInicio}}
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<strong>Fecha Fin:</strong> {{info(periodo.IdPeriodo).FechaFin}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!periodo.in_db" class="row mt-2">
|
||||
<!--
|
||||
PeriodoV2
|
||||
ClaveCarrera: string;
|
||||
NombreCarrera: string;
|
||||
PeriodoV1
|
||||
IdNivel: number;
|
||||
-->
|
||||
<div class="col-md-12">
|
||||
<button class="btn btn-primary float-end" @click="store.addPeriodo(periodo)"
|
||||
:disabled="!complete(periodo.IdPeriodo)">
|
||||
Agregar
|
||||
<i class="ing ing-mas"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="row mt-2">
|
||||
<div class="col-md-12">
|
||||
<button class="btn btn-success float-end disabled">
|
||||
Agregado
|
||||
<i class="ing-aceptar"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-2">
|
||||
<div class="col-md-12">
|
||||
<button class="btn btn-secondary float-end" @click="store.addCarreras(periodo.IdPeriodo)">
|
||||
Sincronizar Carreras
|
||||
<i class="ing ing-link"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="accordion mt-2">
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header">
|
||||
<button class="accordion-button collapsed" data-bs-toggle="collapse"
|
||||
:data-bs-target="`#collapse-${periodo.IdPeriodo}`">
|
||||
Horarios del periodo
|
||||
</button>
|
||||
</h2>
|
||||
<div :id="`collapse-${periodo.IdPeriodo}`" class="accordion-collapse collapse">
|
||||
<div class="accordion-body">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item"
|
||||
v-for="periodo in store.periodosV2.filter(periodov2 => periodov2.IdPeriodo === periodo.IdPeriodo)">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<strong>Clave Carrera:</strong> {{periodo.ClaveCarrera}}
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<strong>Nombre Carrera:</strong> {{periodo.NombreCarrera}}
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<span class="badge float-end mx-1"
|
||||
:class="periodo.linked ?'bg-success':'bg-secondary'">
|
||||
<i class="ing-link"></i>
|
||||
</span>
|
||||
<span class="badge float-end mx-1"
|
||||
:class="periodo.in_db ?'bg-success':'bg-secondary'">
|
||||
<i class="ing-aceptar"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</main>
|
||||
<footer>
|
||||
|
||||
</footer>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user