vue admin manager
1.0.0
Einige Schüler haben beim Start einen Fehler gemeldet, der ein Problem mit NPM-Abhängigkeiten sein sollte.
Meine Versionsinformationen sind als Referenz beigefügt, aber alle oben genannten Versionen sollten unterstützt werden.
erneuern:
Der Hauptzweigmaster wird aktualisiert, um das Menü dynamisch zu laden:
Weisen Sie Lademenüs dynamisch basierend auf Benutzerberechtigungen zu, hauptsächlich durch die Verwendung von addRoutes, Meta und anderen Funktionen.
Anzeigedaten werden über Mock.js erstellt
Demo-Adresse
Ein Back-End-Forschungs- und Entwicklungsunternehmen, ein Start-up-Unternehmen, verfügt derzeit nicht über eine Webentwicklung und muss nach und nach Betrieb und Wartung sowie die Betriebsseite durchführen. Wenn Sie schnell mit der Arbeit beginnen möchten,
Ich habe mich über die derzeit beliebtesten Methoden informiert, darunter React, Vue und Angular. Nach dem Vergleich bin ich der Meinung, dass Vue derzeit am besten geeignet ist.
Ich ging auf die offizielle Website, um mich damit vertraut zu machen, schrieb ein paar Demos und begann dann mit der Arbeit an diesem Backend. Ich habe aus vielen hervorragenden Arbeiten auf Github gelernt
Geben Sie es aus, damit Sie es leicht überprüfen können.
Das Projekt ist SPA, das Front-End und das Back-End sind getrennt, das Front-End wird mit vue-cli erstellt, die Authentifizierung erfolgt mit JWT, die Back-End-Datenbank ist Mongodb und das Back-End stellt bereit
Erholsame Schnittstelle, statistische Funktionen sind sehr praktisch, Aggregat, MapReduce, Bedingungen sind im Frontend gekapselt,
Ähnlich wie bei der Front-End-Assemblierung von Abfragebedingungen spuckt das Back-End die entsprechenden Ergebnisse direkt aus.
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# 发布测试环境 包含 webpack ananalyzer
npm run build:sit-preview
# 构建生成环境
npm run build:prod
├── build // 构建相关
├── config // 配置相关
├── src // 源代码
│ ├── api // 所有请求
│ ├── assets // 主题 字体等静态资源
│ ├── components // 全局公用组件（及页面）
│ ├── config // 配置项
│ ├── directive // 全局指令
│ ├── filtres // 全局filter
│ ├── mock // mock数据
│ ├── router // 路由
│ ├── store // 全局store管理
│ ├── styles // 全局样式
│ ├── utils // 全局公用方法
│ ├── App.vue // 入口页面
│ └── main.js // 入口 加载组件 初始化等
├── static // 第三方不打包资源
├── .babelrc // babel-loader 配置
├── .editorconfig // 代码风格文件，前提是要你的编辑器支持
├── .gitignore // 用于Git配置不需要加入版本管理的文件
├── .postcssrc.js // autoprefixer的配置文件
└── package.json // 项目依赖管理
Die Anmeldeauthentifizierung (derzeit basierend auf JWT) todo unterstützt OAuth2 und die Anmeldung von Drittanbietern
Anwendungsübersichts-Dashboard Verschiedene Symbolstatistiken
Datentrends: registrierte Benutzer, aktive Benutzer, Benutzerbeziehungen usw.
Die Benutzerverwaltung führt derzeit nur Abfragen durch
Die Datenpflege unterstützt die Anzeige von Videos und Bildern
Navigationsleiste einklappen abgeschlossen
Anmeldung abgeschlossen, um Benutzer-Spitznamen zu erhalten
Die Extraktion des Statistiksymbols ist abgeschlossen
Abgeschlossener Zugriff auf Alibaba Cloud OSS, STS (temporärer Authentifizierungsdienst)
Unterstützung für Videowiedergabe abgeschlossen
Vuex-Statusverwaltung (derzeit werden nur Benutzer-Token-Informationen aufgezeichnet)
[] Das Echart-Symbol im Dashboard, komponentenbasierte Rekonstruktion (bei der ersten Verwendung geschrieben, der Code ist relativ redundant und wird später in Komponenten aufgeteilt)
404-Seitenkomponente (derzeit leer), erwägen Sie die Verwendung von Tencent Charity in Ihrem eigenen Blog
[] 401-Seitenkomponente
[] Reaktionsschnell, unterstützt Mobiltelefone
Die Dashboard-Seite verwendet die Komponente vue-echarts-v3. Sie wurde zwangsweise erstellt, als ich zum ersten Mal mit vue vertraut wurde. Sie hat überhaupt kein ästhetisches Gefühl. Später werden Sie sich nach und nach mit der Idee von Komponenten vertraut machen und diese anwenden.
Der Code muss noch schrittweise optimiert werden, haha
