miitvip vue admin manager

Makeit Admin Pro 3.x

Framework de modèle de combinaison prête à l'emploi pour les systèmes de gestion du milieu et du back-end construits en fonction de Vue3.x

(Une solution d'interface utilisateur hors boîte pour les applications d'entreprise construites sur Vue3.x)

Avis

3.x du package npm est renommée à @miitvip/admin-pro

2.x du package npm makeit-admin-pro ici

3.x Adresse de l'expérience de la version " https://admin.makeit.vip "

2.x Adresse de l'expérience de la version " https://2x.makeit.vip "

à propos

Makeit Admin Pro est un UI 框架adapté aux projets de gestion du milieu et du back-end construits et développés sur la base de Vue 3.x + Vite 5.x + Ant Design Vue 4.x

? Le framework a des modules communs intégrés tels que la mise en page / page d'enregistrement de la page / page de connexion / Mot de passe oublié / Code de vérification du curseur Component / Search Lenovo Component / Dynamic Menu Configuration / Permission Management Configuration, etc., qui sont disponibles hors de la boîte .

? L'intention d'origine de concevoir ce framework est d'éviter la construction de pages de base et en double dans le projet de gestion du milieu et du backend, et d'encapsuler une série de comportements dans la page en composants lourds ( un composant ≈ une page ), tels que Layout de base, la connexion, Login / Register / le mot de passe oublié Forget et d'autres modules de base, afin que les développeurs puissent se concentrer davantage sur le développement du contenu commercial sans dépenser trop de temps sur la construction trop de temps. J'espère fournir une construction rapide et efficace des applications moyennes et backend de haute qualité grâce à des composants de la série Makeit Admin Pro . Il est toujours en cours d'amélioration à ce stade et se développe et se développe constamment ...

Diagramme de reproduction

Thème sombre

Thème léger

Changer le thème

Menu de collecte

Effet de téléphone mobile

Application globale

Configuration de TheTheme ( css modules + css variables )

✅internationalisation ( vue-i18n )

✅ Cookies ( document.cookie )

✅ Storage ( localStorage & sessionStorage )

✅ Demande ( axios )

✅ Global (configuration global configuration )

✅ Outils (fonctions globales de la bibliothèque global functions )

Composants de base

✅La mise en page basique ( Layout )?

Code de vérification du litre ( Captcha )?

✅anchor lien ( Anchor )?

Horloge Clock ?

Menu de Dropdown ( Dropdown )?

✅Link Adresse ( Link )?

✅ Panneau de palette de couleurs ( Palette )

✅ connexion autorisée ( Socialite )?

✅ Navigation du menu ( Menu )

Effet d'animation de fenêtre populaire ( Modal )?

Centre de messagerie ( Notice )?

✅ paramètres de mot de passe ( Password )?

✅Search Components ( Search )?

✅ Code sur la mise en surbrillance ( Code )?

Paramètres de title ( Title )?

✅quotes ( Quotes ) # ️⃣

✅backtop Backtop

✅RIET du routage ( History )?

✅Meau de chargement ( ItemsImage )?

Composants de composition

✅CopyWriting ( ItemsText )?

✅Picture Dayout ( ItemsImage )

Composants gardiens

Page ✅Login ( Login )?

Page d'installation ( Register )?

✅Forgot Mot de passe ( Forget )?

Applications avancées

✅ Configuration de la langue ( AppsLanguage ) ❄️

✅Men Management (routage dynamique) ( AppsMenu )

Contrôle de l'autorisation?

Gestion des applications?

Éditeur de texte riche?

Choix régional?

Page d'exception ( 404 )?

Centre personnel?

······

Installer et utiliser

npm i @miitvip/admin-pro

Introduction mondiale

 import { createApp } from 'vue'
import MakeitAdminPro from '@miitvip/admin-pro'
import App from './app.vue'

const app = createApp ( App )
app . use ( MakeitAdminPro )
app . mount ( '#app' ) 

Charge à la demande

 import { createApp } from 'vue'
import router from './router'
import App from './app.vue'
import { Layout , Notice } from '@miitvip/admin-pro'

const app = createApp ( App )
app . use ( router )
const components = [ Layout , Notice ]
components . forEach ( ( component ) => app . use ( component ) )
app . mount ( '#app' ) 

Disposition de base

 < template >
    < mi-layout />
</ template >

< script lang =" ts " setup >
    import { useStoreMenu } from '@miitvip/admin-pro'

    // 更新菜单
    const menuStore = useStoreMenu ( )
    menuStore . updateMenus ( [
        {
            name : 'dashboard' ,
            path : '/dashboard' ,
            meta : {
                title : '控制中心' ,
                subTitle : 'Dashboard' ,
                icon : DashboardOutlined ,
                tag : { color : '#f50' , content : 'Hot' }
            }
        } , {
            // ... sider menus
        }
    ] )
</ script > 

Page de connexion

< template >
    < mi-login action = " /v1/login " />
</ template >

Page d'inscription

< template >
    < mi-register action = " /v1/register " />
</ template >

Plus d'applications

Pour plus de contenu et d'utilisation, veuillez consulter l'exemple en ligne: https://admin.makeit.vip