Pedro Delgado Sucre's profile

Proyecto Valet Parking

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.
Proyecto Valet Parking
Published:

Proyecto Valet Parking

Proyecto de valet parking.

Published: