Proyecto Valet Parking
A continuaciĆ³n veremos el funcionamiento de la aplicaciĆ³n mĆ³vil del proyecto "Valet Parking" realizada con Ionic 3, Node.js y Mongodb asĆ como tambiĆ©n la app web realizada con Vuejs, Nodejs y Mongodb.Ā En las siguientes pantallas podremos apreciar el inicio de sesiĆ³n el cual se debe proporcionar el telĆ©fono del valet y la contraseƱa asociada, despuĆ©s de verificar que las credenciales seanĀ correctas en el servidor se procede a elegir la ubicaciĆ³n en la cual estĆ” registrado el valet, en la pantalla principal de la aplicaciĆ³n es donde creamos el ticket del cliente, el cual proporcionamos como primer dato el nĆŗmero del ticket, luego el telĆ©fono del cliente y la placa del vehĆculo, asĆ como tambiĆ©n la marca el tipo de vehĆculo y el color del mismo, tambiĆ©n cuenta con la funcionalidad de poder subir fotos para tener una mejor vista del vehĆculo del cliente, por ultimo tenemos el botĆ³n de parquear para generar el registro en el servidor y tambiĆ©nĀ enviar un mensaje de texto al cliente con el link de la plataforma web para solicitar el vehĆculo
AppĀ Web
Al ingresar en el link que se envĆa en el mensaje de texto al cliente, ingresamos en la primera pantalla que se ve a continuaciĆ³n la cual nos permite hacer 2 acciones, solicitar el vehĆculo y chatear con el valet, en la segunda pantalla podemos observar el chat el cual le permite al cliente comunicarse con el valet que estacionĆ³Ā su vehĆculo por cualquier inconveniente. La ultima pantalla es para solicitar el vehĆculo, el cual es cliente debe ingresar su nombre y el correo el cual es opcional y finaliza el proceso con el botĆ³n de solicitar el vehĆculo.
App y App web
DespuĆ©s de que el cliente enviĆ© la solicitud del vehĆculo la app web lo llevara a la primera pantalla que vemos a continuaciĆ³n el cual le permitirĆ” ir calificando el servicio prestado y podrĆ” ver con un gif el estatus de su vehĆculo, tambiĆ©n al momento que solicito su vehĆculo llegara una notificaciĆ³n a la aplicaciĆ³n del valet el cual avisa a todos los trabajadores que 1 vehĆculo esta siendo solicitado el cual podemos apreciarlo en la segunda pantalla, luego de que un valet disponible presione para buscar el auto en la app web actualizara el estatus del vehĆculo como se puede ver en la tercera pantalla, tambiĆ©n se puede observar que despuĆ©s de que el cliente deje la calificaciĆ³n del servicio puede tambiĆ©n dejar un comentario sobre el mismo.
Luego de que el suplidor lleve el vehĆculo a donde se encuentra el clienteĀ tendrĆ” la opciĆ³n de cambiar el estatus del ticket a listo para ser entregado como se puedeĀ ver en la primera pantalla, estoĀ actualizarĆ”Ā la pantalla de la web app del cliente al estatus de listo como se puede apreciar en la segunda pantalla y para finalizar el proceso de parking luego de que el valet haya entregado el vehĆculo al cliente podrĆ” finalizar el ticket a estatus entregado como se puede ver en la tercera pantalla.
Administrador
En esta secciĆ³n podremos ver la pagina web que administra las app y la app web la cual fue realizada con Vuejs, Nodejs y Mongodb. Como primera pantalla tenemos el inicio de sesiĆ³n.Ā
Al ingresar lo primero que encontraremos es el Dashboard, el cual podremos ver con una grĆ”fica los vehĆculos recibidos y entregados del dĆa actual, tambiĆ©n las propinas, recargos o ingresos del dĆa, tambiĆ©n se podrĆ” apreciar las actividades de cada una de las localidades asociada al sistema de valet parking, la cantidad de vehĆculos recibidos, estacionados, en espera, listos y entregados, asĆ como tambiĆ©n el promedio de entrega de los vehĆculos yĀ el promedio de tiempo estacionados.
Como primera opciĆ³n del menĆŗ tenemos las ubicaciones registradas en el sistema, en esta pantalla podremos ver la cantidad total de ubicaciones,Ā y la cantidad de valets en el sistema (se debe tomar en cuenta que un valet puede estar registrado en varias ubicaciones), en el detalle de cada ubicaciĆ³n se puede ver los valets que posee esa ubicaciĆ³n y la cantidad de anuncios asociados.
Al hacer click en algunas de las ubicaciones creadas podremos ver en detalle toda la informaciĆ³n de la misma, en la pantalla de "reportes - boletos emitidos"Ā tendremos un contador de la cantidad de tickets emitidos, tambiĆ©nĀ podremos observar un grĆ”fico sobre los tickets recibidos y entregados de esta ubicaciĆ³n, del lado derecho se puede apreciar una leyenda sobre la cantidad de vehĆculos y en que estatus se encuentran, asĆ como una lista de estos tickets y el detalle de los mismos, tambiĆ©n podemos filtrar toda esta informaciĆ³n por fecha
En la opciĆ³n de "calificaciones" podremos ver un grĆ”fico de barra con las calificaciones que han tenido los valets de esa ubicaciĆ³n, tambiĆ©n cuenta con una pequeƱa leyenda del lado derecho que proporciona el promedio de las calificaciones y el total de las mismas. TambiĆ©n cuenta con un listado de las calificaciones y comentarios realizados, toda esta informaciĆ³n puede ser filtrada por fecha
En la opciĆ³n de "Vista de la aplicaciĆ³n", podremos observar un listado de los tickets estacionados, solicitados, y listos en esa ubicaciĆ³nĀ con una pequeƱa descripciĆ³n de cada uno.
En la opciĆ³n de "Configuraciones" podremos cambiar la informaciĆ³n de la empresa, logo y tĆ©rminos &Ā condiciones, en la secciĆ³n de mensajerĆa el usuario puede configurar a su gusto el mensaje de texto que le llega el cliente al momento de estacionar su vehĆculo.
La ultima opciĆ³n es la de "Cierre", la cual sirve para asignar una hora de cierre a la ubicaciĆ³n, al momento de que llegue la hora registrada, todos los vehĆculos pasaran a estatus entregado.
En las prĆ³ximas 2 pantallas podremos observar el formulario de registro de las ubicaciones, y los diferentes campos que la integran.
En la segunda opciĆ³n del menĆŗ podemos observar la creaciĆ³n de anuncios en las ubicaciones, las cuales se podrĆ”n observar en la web app al momento en que el cliente espera que se entregue su vehĆculo, esta secciĆ³n cuenta con un mapa donde aparecerĆ”n todas las ubicaciones que tengan al menos un anuncio registrado, al hacer click en una de las ubicaciones en el mapa podremos ver una pequeƱa informaciĆ³n de la misma y tambiĆ©n un listado de todos los anuncios registrados en esa ubicaciĆ³n.Ā
En las siguientes pantallas podremos ver el formulario para la creaciĆ³n de un anuncio.
Como tercera opciĆ³n del menĆŗ tenemos la secciĆ³n de tickets, la cual podremos observar todos los tickets creados en el sistema y su informaciĆ³n detallada asĆ como tambiĆ©n podremos hacer bĆŗsquedas de los mismos por ubicaciĆ³n, estatus y por fecha, tambiĆ©n se puede imprimir en formato pdf y excel los tickets deseados.
Como cuarta opciĆ³n del menĆŗ tenemos la secciĆ³n de tarifas, la cual es sencilla, simplemente se crean las tarifas de una ubicaciĆ³n en especificoĀ
En la quinta opciĆ³n del menĆŗ, tenemos la secciĆ³n de clientes, la cual podremos ver todos los clientes que han utilizado el sistema de valet parking en todas las ubicaciones, tenemos la opciĆ³n de realizar bĆŗsquedas por estatus y por fecha, al ingresar al detalle del cliente se puede observar todos los tickets que en los cuales esta asociado el cliente y el detalle de cada uno de ellos.
En la sexta opciĆ³n del menĆŗ tenemos la secciĆ³n de "Empleados", la cual podremos ver todos los empleados registrados y la informaciĆ³n detallada de cada uno de ellos, tambiĆ©n podremos crear o eliminar empleados.
Pantalla de ediciĆ³n de empleado.
Formulario de creaciĆ³n de empleado
Como ultima opciĆ³n del menĆŗ tenemos "Usuarios y Permisos", en el cual se pueden crear todos los usuarios que pueden manejar la pagina del administrador, y asignarle los permisos dentro del mismo, los cuales restringen al usuario que secciones del menĆŗĀ puede utilizar, asĆ como tambiĆ©n si puede crear, modificar o eliminar cualquier registro en el administrador.
Formulario de creaciĆ³n de usuario y ediciĆ³n de permisos
Como ultima pantalla del administrador, tenemos la secciĆ³n de "Cuenta" la cual podremos modificar la informaciĆ³n de la empresa, y las marcas de los vehĆculos para la app.