Vuetify Admin Dashboard: un panel de Crud Admin hecho con VueJS y Vuetify
Vuetify Admin Dashboard es un hermoso recurso construido sobre Vuetify y Vuex . Le ayudará a comenzar a desarrollar paneles en poco tiempo. Vuetify Material Dashboard es la versión oficial de Vuejs del original Material Dashboard . Usar el Panel de control es bastante simple, pero requiere conocimientos básicos de Javascript, Vue , Vuex y Vue-Router . Esta plantilla presenta:
-
Potente Tabla de datos CRUD con clasificación, paginación, búsqueda, visualización de imágenes ...
-
Potente Editar generador de formularios puede mostrar / editar cualquier valor de texto, imagen, booleano ...
-
Soporte completo para REST Api
-
Vue-Chart js incorporado
-
Reescribió el enrutador para agregar soporte para rutas anidadas / secundarias. También habilitó páginas externas sin la barra lateral / pie de página / encabezado, etc.
-
Altamente configurable tales como: temas oscuros / claros, imágenes de la barra lateral, nombre del sitio, colores, logotipo, menú y pie de página ...
-
los datos en la demostración solo se conectan para leer desde https://reqres.in/
-
Características de la tabla CRUD
- operaciones en registros:
- Tienda,
- Actualización,
- Suspender / Restaurar,
- Eliminar
- Filtrado de búsqueda:
- Buscar frase en toda la tabla,
- Ordenar por columna
- ACCIONES VUEX:
- Elemento de tabla, actualizar / editar / eliminar y restaurar
- otras funciones y características:
- el mecanismo de tabla de datos permite la selección del número de registros por página, transición de página y clasificación,
- Edición de tabla en línea
- Editar menú de fila completa
- Buscar
- Soporte APi Rest integrado
- operaciones en registros:
-
Autenticación
- formulario de inicio de sesión (comunicación integrada con API, validación),
- redirigir desde el inicio de sesión a la aplicación si ya inició sesión
- redirigiendo para iniciar sesión desde la aplicación si no ha iniciado sesión
- Obtiene automáticamente el token de actualización JWT una vez que caduca
- almacena JWT en el almacenamiento local (todavía no he creado un soporte integrado para almacenar cookies https)
- recupera JWT al volver a visitar la página
-
Componentes de diseño de la aplicación
- Barra de herramientas (con elementos opcionales):
- título,
- logotipo,
- Notificaciones
- perfil de usuario,
- cerrar sesión,
- espacios para desarrolladores
- Barra lateral / cajón:
- Lista de rutas,
- Ranura para título o avatar de usuario,
- Tragamonedas para desarrolladores,
- Filtro de cajón:
- Le permite cambiar la imagen de fondo del cajón y la combinación de colores
- Pie de página,
- Mapas
- ... y otros
- Barra de herramientas (con elementos opcionales):
La paleta de colores de esta plantilla esta compuesta por 43 colores:
| Color | Name | Hex | Rgb |
|---|---|---|---|
| Tree Poppy | #fa9f1a | rgb(250,159,26) | |
| Aqua Forest | #64ab69 | rgb(100,171,105) | |
| Chambray | #335582 | rgb(51,85,130) | |
| Spicy Pink | #796b6b | rgb(121,107,107) | |
| Picton Blue | #3097ea | rgb(48,151,234) | |
| Jelly Bean | #2874ac | rgb(40,116,172) | |
| Emperor | #545454 | rgb(84,84,84) | |
| Ming | #38647a | rgb(56,100,122) | |
| Mine Shaft | #343434 | rgb(52,52,52) | |
| Fuzzy Wuzzy Brown | #c46c58 | rgb(196,108,88) | |
| Picton Blue | #2b94ed | rgb(43,148,237) | |
| Gray | #848383 | rgb(132,131,131) | |
| Orange Roughy | #ba531b | rgb(186,83,27) | |
| Mine Shaft | #252525 | rgb(37,37,37) | |
| Picton Blue | #4cabf1 | rgb(76,171,241) | |
| Calypso | #2c6081 | rgb(44,96,129) | |
| Dove Gray | #616161 | rgb(97,97,97) | |
| Matisse | #2474ae | rgb(36,116,174) | |
| Fuscous Gray | #444443 | rgb(68,68,67) | |
| Sunglo | #e4746c | rgb(228,116,108) | |
| Picton Blue | #44a5f1 | rgb(68,165,241) | |
| Gray | #8a8a8a | rgb(138,138,138) | |
| Elephant | #0f283c | rgb(15,40,60) | |
| Shark | #232424 | rgb(35,36,36) | |
| Picton Blue | #3c9bef | rgb(60,155,239) | |
| Purple Heart | #9e30b4 | rgb(158,48,180) | |
| Fern | #62b669 | rgb(98,182,105) | |
| Calypso | #2e6b8a | rgb(46,107,138) | |
| Salt Box | #6d5171 | rgb(109,81,113) | |
| Picton Blue | #43baeb | rgb(67,186,235) | |
| Picton Blue | #2491ed | rgb(36,145,237) | |
| Dove Gray | #646464 | rgb(100,100,100) | |
| Jelly Bean | #246c9c | rgb(36,108,156) | |
| Picton Blue | #4cace4 | rgb(76,172,228) | |
| Purple Heart | #9c2bb3 | rgb(156,43,179) | |
| Fern | #5cb563 | rgb(92,181,99) | |
| Seance | #932ba8 | rgb(147,43,168) | |
| Mine Shaft | #232323 | rgb(35,35,35) | |
| Tree Poppy | #f9a420 | rgb(249,164,32) | |
| Dodger Blue | #2394f3 | rgb(35,148,243) | |
| Xanadu | #7a887d | rgb(122,136,125) | |
| St Tropaz | #255981 | rgb(37,89,129) | |
| Malibu | #85d4fa | rgb(133,212,250) |
Acciones
Publicado
Categoria Vue JS
Diseño Responsive
Columnas 4+
Apto para pantalla retina Si
Archivos incluidos Html, CSS, JavaScript
Exploradores compatibles IE10, IE11, Firefox, Safari, Opera, Chrome5
Bootstrap No
Tags vuejs vue.js vuex vuetify
Publicidad
Publicidad
