Add sample file upload for "load_data" blueprint

Also add a success page that redirects to the Dashboard

2 files changed, 87 insertions, 0 deletions

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