vue admin spaダウンロード-Vue vue admin spaソースコードダウンロード

vue admin spa

その他のカテゴリー

2.1正式版

ダウンロード

バックグラウンドマネジメントシステムVUE-ADMIN-SPA（注：このプロジェクトは停止しました。必要に応じて、最新のVUE 3.0バージョン、より多くの機能、より完全な機能に移動できます）

使用されるテクノロジースタック：Vue + Vue-Resource + Vue-Router + Vuex（Essence） + Element-UI + ES6 + WebPack + NPM

テストアドレス（開いていない場合は、DNSを114.114.114.114に変更してみてください）

序文

このプロジェクトは、Vueの足場と3つのプロジェクト（長寿と欠点）を利用しており、目的はすべての人に適していますポイントが書き直されました：

ログインして登録（MD5暗号化を含む）
永続的なコントロール、メニューはユーザーインターフェイスからのアクセス許可データに従って非表示になり、アドレスバーを手でノックし、404（アドレスバーエラー）または401（アドレスバーは正しいが普遍的）にジャンプします。システム設定のアクセス許可を動的に変更できます。
テーマを切り替え、ユーザーを完全にサポートしてテーマを手動で切り替え、テーマを覚えています
すべてのデータは、ローカルJSONシミュレーションによって実行されます
すべての動的操作は、要素をクリックし、関連するパラメーターが実際の開発の場合に印刷されています
新しい学生モジュールが追加され、ローカルの実際のAPIインターフェイスが使用されます。
機関管理モジュール、MOCKJSインターフェイスを使用し、実際の開発JSロジック（検証と提出インターフェイスなどを含む）を添付しました。

説明します

オープンソースの目的：下部に基づいて2人の開発者に提供され、より多くの人々が学び、参照し、迂回することが少なくなります。
需要のカスタマイズ：このプロジェクトは、基礎となるフレームワークとして、いくつかの基本的な機能がある場合のみです。
貢献：この基礎となる開発に参加し、貢献して維持し、詳細については所有者に連絡するための開発者が増えてください。
タイムリーな交換：全員の技術交流を促進するために、このプロジェクトは新しいQQグループ-645582193を構築しました

**質問がある場合は、それを提出して発行するか、ディスカッションのためにグループに入ることができます

このプロジェクトが役立つと思われる場合は、右上のスパーをクリックすることを忘れないでください^_^

関数（一部のデータはローカルJSONシミュレーションを実行し、部分的にMOCKJを使用します。DoubanAPIが最近ブロックされているため、Douban APIの一部の機能は一時的にプレビューできません）

システムの説明
ログイン/ログアウト
パスワードの変更
パーソナルホームページ
アバターアップロード
許可確認
変更許可
サイドバー
パン
豊富なテキストエディター
テーマを切り替えます（アバターをクリックして引き下げます）
フォーム検証、提出
リスト、削除、削除、修正、ソート、およびエクスポート（バックグラウンド管理システムの基本機能）
401、404ページのリダイレクト
Excelをエクスポートします
ビューテブ
PCエンドのより多くの機能が開いています...

開発する

    # 克隆代码
    git clone https://github.com/lss5270/vue-admin-spa.git
    # 安装依赖
    npm install
    # or 直接解压node_modules.7z到当前位置 （比较适合新手）。

    # 本地开发 开启服务
    npm run dev
    # or 直接双击start.bat（比较适合新手）

ブラウザアクセスhttp：// localhost：2018

リリース

  
    # 构建生产环境
    npm run build:prod
    # or 直接双击build.bat（比较适合新手）

正式な環境の紹介

    # nginx环境下运行
    1.准备nginx环境，自行到nginx官网（https://nginx.org/）下载，并解压
    2.双击build.bat后根目录生成一个dist包，把dist整个文件夹拷贝到nginx解压后的html下
    3.启动nginx服务：双击nginx.exe
    4.访问入口：http://localhost/dist/index.html
    ………
    
    8.关闭nginx服务：直接删进程
    
    # tomcat环境下运行
    参照nginx步骤即可

アイコンについて

    本项目使用了两套图标系统，具体使用方法参照以下官方链接:
    1.http://element.eleme.io/#/zh-CN/component/icon
    2.http://fontawesome.io/icons/
    使用方法：
    a.在index.html中引入<link href="//cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
    b.在使用图标的地方放置图标<i class="fa fa-home" aria-hidden="true"></i>

UIシステムについて

    由于bootstrap不支持mvvm已弃用，本项目使用了全新的elementUI系统，具体使用方法参照以下官方链接:
    1.http://element.eleme.io/#/zh-CN/component/installation

.Vueファイルの背景画像パスについて、プロダクション環境へのパッケージングの問題404修理

    具体修复方法，参照Issues中的 #6问题

学生モジュールに関するAPIインターフェイス

    1.学生模块功能使用了本地api接口，若想正常运行，请下载另外一个node项目（https://github.com/lss5270/vue-admin-spa-api），并且在本地启动该node 项目。
    2.该node项目源码，相当于其他后端语言（例如java）提供增删查改接口的源代码。
    3.不懂如何使用node项目的同学，可进群讨论

ディレクトリ構造

├── build                      // 构建相关  
├── config                     // 配置相关
├── src                        // 源代码
│   ├── assets                 // 主题 字体等静态资源
│   ├── components             // 全局公用组件。不直接显示
│   ├── global                 // 全局指令
│   ├── filtres                // 全局filter
│   ├── router                 // 路由
│   ├── store                  // 全局store管理
│   ├── utils                  // 全局公用方法
│   ├── view                   // view视图层
│   ├── App.vue                // 入口页面
│   └── main.js                // 入口 加载组件 初始化等
├── static                     // 第三方不打包资源
│   ├── jquery
│   ├── Tinymce                // 富文本
│   ├── dataJson               // 模拟接口json
│   └── theme                  // 主题文件
├── .babelrc                   // babel-loader 配置
├── eslintrc.js                // eslint 配置项
├── .gitignore                 // git 忽略项
├── favicon.ico                // favicon图标
├── index.html                 // html模板
└── package.json               // package.json