Sistema para restaurante en PHP, MySQL y Vue

A continuación te presentaré un sistema para administrar un restaurante. Entre las opciones que tiene están:

• Inicio de sesión: Los usuarios registrados pueden iniciar sesión.
• Configuración del sistema: Puedes establecer el nombre del local, teléfono, número de mesas (que son las mesas que se pueden atender), logotipo:
• Administrar categorías: Se agregan las categorías a las que pertenecen los platillos y bebidas.
• Administrar insumos: Agregar, editar y eliminar los insumos (platillos y bebidas) que se venden.
• Ocupar mesa / Tomar orden: Según la mesa que sea seleccionada, se agregan los insumos que el cliente pide, cancelar la orden o marcar los insumos que ya han sido servidos.
• Reporte de ventas: Visualizar el reporte de ventas e imprimir el comprobante de compra.

Está desarrollado usando PHP, MySQL, Vue y Buefy. Te mostraré cómo funciona y al final te dejaré el link para que puedas descargarlo y ver una demostración. Recuerda que puedes descargarlo, usarlo y modificarlo de acuerdo a las necesidades que tengas.

Inicio de sesión

Para empezar, es necesario iniciar sesión. En este caso se coloca el correo electrónico y la contraseña del usuario que va a ingresar.

Dashboard o página pricipal

En esta parte se muestra un pequeño resumen de los registros que hay en el sistema. Entre ellos están:

• Cards con:
  • Ventas del día
  • Estado de mesas (mesas que se encuentran ocupadas)
  • Usuarios que hay registrados
  • Total de insumos registrados
  • Total de ventas general
• Gráficas :
  • Ventas por horas, puedes filtrar por periodo
  • Ventas de usuarios, puedes filtrar por periodo
  • Ventas por día en la semana
  • Ventas por año, puedes seleccionar el año
• Insumos más vendidos
• Mesas más ocupadas

Configuración

En este apartado puedes establecer los datos del local, entre ellos se encuentra en nombre, teléfono, número de mesas, logo. Al guardar los datos para visualizarlos se debe de recargar la página. Estos datos son los que se muestran en el comprobante de compra.

Insumos

Para registrar los insumos se pulsa el botón de Añadir insumos. Los datos que pide son:

• Tipo (si es platillo o bebida, con esto se mostrarán las categorías pertenecientes al tipo)
• Código (de barras o uno inventado)
• Nombre
• Descripción
• Categoría a la que pertenece
• Precio

En la tabla de los insumos puedes editar, eliminar y filtrar. Al filtrar se puede mediante el tipos (si solo deseas ver los platillos o las bebidas), por categoría y por nombre.

Usuarios

Los usuarios son quienes pueden acceder al sistema y pueden modificar los datos del mismo. Igual es un crud. Cuando registras a un nuevo usuario la contraseña por defecto es PacoHunterDev. Cuando inicie sesión este usuario deberá cambiar su contraseña.

Ordenar

Ahora llegamos al apartado más importante, que es en el que se realizan las órdenes, para empezar se selecciona la mesa en la que se sirven los insumos. Enseguida se muestra la pantalla en la que se agregan los insumos que el cliente pide. En esta parte se puede:

• Colocar el nombre del cliente que ocupa la mesa
• Agregar los insumos: Para esto se escribe el nombre del platillo o bebida que se va a agregar, se selecciona de la lista que se muestra y se agrega a la tabla
• En la tabla puedes:
  • Agregar o disminuir el número de insumos
  • Colocar una descripción de cómo debe ser servido
  • Quitar el insumo

Cuando ya se hayan colocado todos los insumos que se desean se pulsa en ordenar.

Ahora la mesa se marcará como ocupada y aparecen todos los insumos que se han servido, además de quien la está atendiendo, el cliente y el total. en cada insumo se muestra un ícono que indica si el insumo ya se ha servido, para marcarlo como servido se marca en el check que esta al lado derecho.

Se pueden agregar más insumos, para esto se pulsa en agregar insumos. En la pantalla se muestran los insumos que ya se han servido estos no pueden ser modificados. Para agregar más insumos se realiza los mismo que en el paso anterior.

Para cobrar , se pulsa en cobrar. Se coloca el total con el que pagan. Después de esto se muestra el comprobante de compra.

Reporte de ventas.

Aquí se muestran las ventas realizadas, cuando se ingresa se muestran las ventas del día. En cada una de ellas es posible reimprimir el comprobante de compra. También se pueden filtrar por fecha o por usuarios.

Perfil

Para terminar, en este apartado se presentan gráficas que muestran:

• Ventas de la semana del usuario
• Ventas del mes del usuario (se puede seleccionar el mes y el año)
• Ventas del año del usuario (se puede seleccionar el año)

Descargar código

Si deseas descargar, usar o modificarlo, puedes descargar el código del siguiente enlace de GitHub además hice un vídeo en el que te presento lo aquí escrito en YouTube

Usar el sistema

Después de que hayas descargado el código, hay dos cosas que puedes hacer. La primera es que si deseas emplearlo así como esta, lo que debes hacer es copiar las carpetas de api y dist dentro de tu servidor en una carpeta llamada botanero-ventas. En la primera se encuentran todos los archivos de php y en la segunda todo el js, html, css. En mi caso uso xampp, entonces lo pegaré en htdocs/botanero-ventas. Cuando lo descargas la carpeta de node_modules no aparece, ya que esta se crea cuando instalas las dependencias.

Si deseas modificarlo o agregar cosas debes copiar todos los archivos dentro del servidor en una carpeta llamada botanero-ventas. Ahora lo que sigue es instalar las dependencias del proyecto para esto abres una ventana de cmd, navegas en dónde lo tienes y ejecutas npm install (Para esto debes tener node.js instalado).

Después de que las dependencias se instalen, ya puedes ejecutar npm run dev para ejecutar el proyecto

Y cuando termine de compilar, accedes a localhost:8080 para poder verlo.

Configurando el sistema

Cuando ingreses al sistema por primera vez, te pedirá que pulses un botón para iniciar, con esto estas creando la base de datos, seguidamente, ingresas los datos del local y del usuario. Después ya puedes iniciar sesión, recuerda que la contraseña por defecto al crear un usuario nuevo es PacoHunterDev

Con esto ya puedes emplear o modificar el sistema.

Etiquetas: PHP