From 5a16046eddc753b752c5ab1fdb91595adf588a6b Mon Sep 17 00:00:00 2001
From: Mitsuo Tokumori <rtokumori@pucp.edu.pe>
Date: Mon, 13 Nov 2023 10:55:39 -0500
Subject: Add sample file upload for "load_data" blueprint

Also add a success page that redirects to the Dashboard
---
 ustayml/templates/base.html              |  4 +-
 ustayml/templates/load_data/index.html   | 71 ++++++++++++++++++++++++++++++++
 ustayml/templates/load_data/success.html | 16 +++++++
 ustayml/templates/students/details.html  |  1 -
 4 files changed, 89 insertions(+), 3 deletions(-)
 create mode 100644 ustayml/templates/load_data/index.html
 create mode 100644 ustayml/templates/load_data/success.html

(limited to 'ustayml/templates')

diff --git a/ustayml/templates/base.html b/ustayml/templates/base.html
index b8d243c..eefbc06 100644
--- a/ustayml/templates/base.html
+++ b/ustayml/templates/base.html
@@ -5,10 +5,10 @@
 <nav>
   <h1><a href="{{ url_for('index') }}">u-stayML</a></h1>
   <ul>
-    <li><a href="{{ url_for('students.index') }}">Dashboard</a></li>
+    <li><a href="#">Dashboard</a></li>
     <li><a href="{{ url_for('students.index') }}">Estudiantes</a></li>
     <li><a href="#">Historial</a>       </li>
-    <li><a href="#">Cargar datos</a>    </li>
+    <li><a href="{{ url_for('load_data.index') }}">Cargar datos</a>    </li>
   </ul>
   <ul>
     {% if g.user %}
diff --git a/ustayml/templates/load_data/index.html b/ustayml/templates/load_data/index.html
new file mode 100644
index 0000000..3400de3
--- /dev/null
+++ b/ustayml/templates/load_data/index.html
@@ -0,0 +1,71 @@
+{% extends 'base.html' %}
+
+
+{% block header %}
+  <h1>{% block title %}Cargar datos{% endblock %}</h1>
+{% endblock %}
+
+{% block content %}
+  <span>Siga los siguientes pasos para actualizar los datos (dataset) sobre el
+  cual se desarrollarán las posteriores predicciones de riesgo de deserción
+  estudiantil.</span>
+  <form method=post enctype=multipart/form-data>
+    <div class="load-data-step">
+      <h2>1. Diccionario de Variables</h2>
+      <div class="flex-container-horizontal">
+        <div class="left">
+          <p>El diccionario de variables lista información sobre las variables del dataset.</p>
+          <input type=file name=diccionario>
+          {# <input type=submit value="Subir"> #}
+          <p></p>
+        </div>
+        <div class="right">
+          <ul class="data-validation-list">
+            <li>Tipo de archivo debe ser CSV</li>
+            <li>Tamaño debe ser &lt;1 MiB</li>
+            <li>Debe existir la variable "target"</li>
+          </ul>
+        </div>
+      </div>
+    </div>
+    <div class="load-data-step">
+      <h2>2. Dataset</h2>
+      <div class="flex-container-horizontal">
+        <div class="left">
+          <p>El diccionario de variables lista información sobre las variables del dataset.</p>
+          <input type=file name=dataset>
+          {# <input type=submit value="Subir"> #}
+          <p></p>
+        </div>
+        <div class="right">
+          <ul class="data-validation-list">
+            <li>Tipo de archivo debe ser CSV</li>
+            <li>Tamaño debe ser &lt;2 GiB</li>
+            <li>Las variables deben coincidir con el diccionario de variables</li>
+          </ul>
+        </div>
+      </div>
+    </div>
+    <div class="load-data-step">
+      <h2>3. Añadir identificadores y guardar</h2>
+      <div class="flex-container-horizontal">
+        <div class="left">
+          <p>El diccionario de variables lista información sobre las variables del dataset.</p>
+            <label for="dataset-label">Etiqueta: </label>
+            <input name="dataset-label" id="dataset-label" required>
+            <p></p>
+            <label for="dataset-date">Fecha del conjunto de datos: </label>
+            <input name="dataset-date" id="dataset-date" required type="date">
+
+            <div></div>
+            <p></p>
+            <input type="submit" value="💾 Guardar">
+            <p></p>
+        </div>
+        <div class="right">
+          <p>(*) Campos Obligatorios</p>
+        </div>
+      </div>
+    </div>
+  </form>
+{% endblock %}
\ No newline at end of file
diff --git a/ustayml/templates/load_data/success.html b/ustayml/templates/load_data/success.html
new file mode 100644
index 0000000..442ef74
--- /dev/null
+++ b/ustayml/templates/load_data/success.html
@@ -0,0 +1,16 @@
+
+{% extends 'base.html' %}
+
+
+{% block header %}
+  <h1>{% block title %}Procesando datos ⏳{% endblock %}</h1>
+{% endblock %}
+
+{% block content %}
+  <p>La carga de datos fue exitosa.  Por favor espere unos minutos hasta que el
+  nuevo conjunto de datos termine de procesar y se generen nuevas predicciones 
+  de riesgo de deserción.</p>
+  <p>Podrá validar que el procesamiento terminó verificando la fecha del
+  reporte.</p>
+  <a href="{{ url_for('index') }}">Regresar al dashboard</a>
+{% endblock %}
\ No newline at end of file
diff --git a/ustayml/templates/students/details.html b/ustayml/templates/students/details.html
index a9c0cca..663124c 100644
--- a/ustayml/templates/students/details.html
+++ b/ustayml/templates/students/details.html
@@ -47,7 +47,6 @@
           </div>
         </li>
         <li>Mérito: {{ student['current_merit'] }}</li>
-
         <li>
           <div class="tooltip">
             Long. de estudios est. (semestres):
-- 
cgit v1.2.3