update

799ada09 · wangqinghua · 8172167f · 799ada09 · 799ada09 · 799ada09
Commit 799ada09 authored Dec 17, 2019 by wangqinghua
32 changed files
--- a/LICENSE
+++ b/LICENSE
+MIT License
+
+Copyright (c) 2017-present PanJiaChen
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
--- a/README.es.md
+++ b/README.es.md
+<p align="center">
+  <img width="320" src="https://wpimg.wallstcn.com/ecc53a42-d79b-42e2-8852-5126b810a4c8.svg">
+</p>
+
+<p align="center">
+  <a href="https://github.com/vuejs/vue">
+    <img src="https://img.shields.io/badge/vue-2.6.10-brightgreen.svg" alt="vue">
+  </a>
+  <a href="https://github.com/ElemeFE/element">
+    <img src="https://img.shields.io/badge/element--ui-2.7.0-brightgreen.svg" alt="element-ui">
+  </a>
+  <a href="https://travis-ci.org/PanJiaChen/vue-element-admin" rel="nofollow">
+    <img src="https://travis-ci.org/PanJiaChen/vue-element-admin.svg?branch=master" alt="Estado de Construcción">
+  </a>
+  <a href="https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE">
+    <img src="https://img.shields.io/github/license/mashape/apistatus.svg" alt="Licencia">
+  </a>
+  <a href="https://github.com/PanJiaChen/vue-element-admin/releases">
+    <img src="https://img.shields.io/github/release/PanJiaChen/vue-element-admin.svg" alt="Liberación Github">
+  </a>
+  <a href="https://gitter.im/vue-element-admin/discuss">
+    <img src="https://badges.gitter.im/Join%20Chat.svg" alt="Gitter">
+  </a>
+  <a href="https://panjiachen.github.io/vue-element-admin-site/donate">
+    <img src="https://img.shields.io/badge/%24-donate-ff69b4.svg" alt="Donación">
+  </a>
+</p>
+
+Español | [English](./README.md) | [简体中文](./README.zh-CN.md) | [日本語](./README.ja.md)
+
+## Introducción
+
+[vue-element-admin](https://panjiachen.github.io/vue-element-admin) es una interfáz de administración preparada para producción. Está basada en [vue](https://github.com/vuejs/vue) y usa [element-ui](https://github.com/ElemeFE/element) como conjunto de herramientas de interfáz de usuario.
+
+Vue Element Admin es una solución práctica basada en la nueva plataforma de desarrollo de vue, construida con soporte a i18 para el manejo de múltiples lenguajes, plantillas estándares para aplicaciones de negocio y un conjunto de asombrosas características. Esta herramienta ayuda a construir largas y complejas Aplicacones de una sola página (SPA). Creo que lo que necesites hacer, este proyecto te ayudará.
+
+- [Vista Prévia de la Aplicación](https://panjiachen.github.io/vue-element-admin)
+
+- [Documentación](https://panjiachen.github.io/vue-element-admin-site/)
+
+- [Canal de Gitter](https://gitter.im/vue-element-admin/discuss)
+
+- [Para Donaciones](https://panjiachen.github.io/vue-element-admin-site/donate/)
+
+- [Enlace de Wiki](https://github.com/PanJiaChen/vue-element-admin/wiki)
+
+- [Canal de Gitee](https://panjiachen.gitee.io/vue-element-admin/)
+
+- Plantilla base recomendada para usar: [vue-admin-template](https://github.com/PanJiaChen/vue-admin-template)
+- Aplicación de Escritorio: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin)
+- Plantilla de Typescript: [vue-typescript-admin-template](https://github.com/Armour/vue-typescript-admin-template) (Créditos: [@Armour](https://github.com/Armour))
+- [awesome-project](https://github.com/PanJiaChen/vue-element-admin/issues/2312)
+
+**Después de la versión `v4.1.0+`, la rama por defecto master no tendrá soporte para i18n. Por favor use [i18n](https://github.com/PanJiaChen/vue-element-admin/tree/i18n), los cambios serán incluidos en la rama master**
+
+**la versión actual es `v4.0+` construida con `vue-cli`. Si encuentra algún problema, por favor coloque un [issue](https://github.com/PanJiaChen/vue-element-admin/issues/new). Si desea usar la versión anterior, puede cambiar de rama a [tag/3.11.0](https://github.com/PanJiaChen/vue-element-admin/tree/tag/3.11.0), no relacionado con `vue-cli`**
+
+**Este proyecto no está soportado para versiones muy viejas de navegadores (e.g. IE).**
+
+## Preparación
+
+Necesita instalar [node](https://nodejs.org/) y [git](https://git-scm.com/) localmente. El proyecto es basado en [ES2015+](https://es6.ruanyifeng.com/), [vue](https://cn.vuejs.org/index.html), [vuex](https://vuex.vuejs.org/zh-cn/), [vue-router](https://router.vuejs.org/zh-cn/), [vue-cli](https://github.com/vuejs/vue-cli) , [axios](https://github.com/axios/axios) and [element-ui](https://github.com/ElemeFE/element), toda la solicitud de datos simulada se realiza a través de [Mock.js](https://github.com/nuysoft/Mock).
+Entendiendo y aprendiendo esto pudiera ayudarle con su proyecto.
+
+ <p align="center">
+  <img width="900" src="https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png">
+</p>
+
+## Patrocinantes
+
+Se un patrocinante y pon tu logo en nuestro README on GitHub con un enlace directo a tu sitio web. [[Se un Patrocinante]](https://www.patreon.com/panjiachen)
+
+<a href="https://flatlogic.com/admin-dashboards?from=vue-element-admin"><img width="150px" src="https://wpimg.wallstcn.com/9c0b719b-5551-4c1e-b776-63994632d94a.png" /></a><p>Plantilla de Dashboard de administración hecha con Vue, React y Angular.</p>
+
+## Características
+
+```
+- Iniciar / Cerrar Sesión
+
+- Permisos de Authentication
+  - Página de Permisos
+  - Directivas de permisos
+  - Página de configuración de permisos
+  - Autenticación por dos pasos
+
+- Construcción Multi-entorno
+  - dev sit stage  producción
+
+- Características Globales
+  - I18n
+  - Temas dinámicos
+  - Dynamic sidebar (soporte a rutas multi-nivel)
+  - Barra de rutas dinámica
+  - Tags-view (Tab page Support right-click operation)
+  - Svg Sprite
+  - Datos de simulación con Mock
+  - Pantalla completa
+  - Responsive Sidebar
+
+- Editor
+  - Editor de Texto Enriquecido
+  - Editor Markdown
+  - Editor JSON
+
+- Excel
+  - Exportación a Excel
+  - Carga de Excel
+  - Visualización de Excel
+  - Exportación como zip
+
+- Tabla
+  - Tabla Dinámica
+  - Tabla con Arrastrar y Soltar
+  - Tabla de edición en línea
+
+- Páginas de Error
+  - 401
+  - 404
+
+- Componentes
+  - Carga de Avatar
+  - Botón para subir al inicio
+  - Arrastrar y Soltar (Diaglogo)
+  - Arrastrar y Soltar (Seleccionar)
+  - Arrastrar y Soltar (Kanban)
+  - Arrastrar y Soltar (Lista)
+  - Panel de división
+  - Componente para soltar archivos
+  - Adhesión de objetos
+  - Contador hasta
+
+- Ejemplo Avanzado
+- Registro de Errores
+- Tablero de indicadores
+- Página de Guías
+- ECharts (Gráficos)
+- Portapapeles
+- Convertidor de Markdown a html
+```
+
+## Iniciando
+
+```bash
+# clone el proyecto
+git clone https://github.com/PanJiaChen/vue-element-admin.git
+
+# vaya al directorio clonado
+cd vue-element-admin
+
+# instale las dependencias
+npm install
+
+# corra el proyecto como desarrollador
+npm run dev
+```
+
+Automáticamente se abrirá el siguiente enlace en su navegador http://localhost:9527
+
+## Construcción
+
+```bash
+# Construcción para entornos de prueba
+npm run build:stage
+
+# Construcción para entornos de producción
+npm run build:prod
+```
+
+## Avanzado
+
+```bash
+# Vista previa con efectos de entorno
+npm run preview
+
+# Vista previa  con efectos + análisis de recursos estáticos
+npm run preview -- --report
+
+# Chequeo de formato de código
+npm run lint
+
+# Chequeo de formato de código y auto-corrección
+npm run lint -- --fix
+```
+
+Vaya a [Documentación](https://panjiachen.github.io/vue-element-admin-site/guide/essentials/deploy.html) para mayor información
+
+## Registro de Cambios
+
+Los cambios detallados por cada liberación se encuentran en [notas de liberación](https://github.com/PanJiaChen/vue-element-admin/releases).
+
+## Demostración en línea
+
+[Vista Prévia de la Aplicación](https://panjiachen.github.io/vue-element-admin)
+
+## Donación
+
+Si este proyecto es de mucha ayuda para ti, puedes comprarle al autor un vaso de jugo :tropical_drink:
+
+![Donar](https://wpimg.wallstcn.com/bd273f0d-83a0-4ef2-92e1-9ac8ed3746b9.png)
+
+[dona por Paypal](https://www.paypal.me/panfree23)
+
+[Comprame un Café](https://www.buymeacoffee.com/Pan)
+
+## Navegadores Soportados
+
+Navegadores modernos e Internet Explorer 10+.
+
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Safari |
+| --------- | --------- | --------- | --------- |
+| IE10, IE11, Edge| últimas 2 versiones| últimas 2 versiones| últimas 2 versiones
+
+## Licencia
+
+[MIT](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE)
+
+Copyright (c) 2017-presente PanJiaChen
--- a/README.ja.md
+++ b/README.ja.md
+<p align="center">
+  <img width="320" src="https://wpimg.wallstcn.com/ecc53a42-d79b-42e2-8852-5126b810a4c8.svg">
+</p>
+
+<p align="center">
+  <a href="https://github.com/vuejs/vue">
+    <img src="https://img.shields.io/badge/vue-2.6.10-brightgreen.svg" alt="vue">
+  </a>
+  <a href="https://github.com/ElemeFE/element">
+    <img src="https://img.shields.io/badge/element--ui-2.7.0-brightgreen.svg" alt="element-ui">
+  </a>
+  <a href="https://travis-ci.org/PanJiaChen/vue-element-admin" rel="nofollow">
+    <img src="https://travis-ci.org/PanJiaChen/vue-element-admin.svg?branch=master" alt="Build Status">
+  </a>
+  <a href="https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE">
+    <img src="https://img.shields.io/github/license/mashape/apistatus.svg" alt="license">
+  </a>
+  <a href="https://github.com/PanJiaChen/vue-element-admin/releases">
+    <img src="https://img.shields.io/github/release/PanJiaChen/vue-element-admin.svg" alt="GitHub release">
+  </a>
+  <a href="https://gitter.im/vue-element-admin/discuss">
+    <img src="https://badges.gitter.im/Join%20Chat.svg" alt="gitter">
+  </a>
+  <a href="https://panjiachen.gitee.io/vue-element-admin-site/zh/donate">
+    <img src="https://img.shields.io/badge/%24-donate-ff69b4.svg" alt="donate">
+  </a>
+</p>
+
+日本語 | [English](./README.md) | [简体中文](./README.zh-CN.md) | [Spanish](./README.es.md)
+
+## 概要
+
+[vue-element-admin](https://panjiachen.github.io/vue-element-admin) は管理画面のフロントエンドのインタフェース，[vue](https://github.com/vuejs/vue) と [element-ui](https://github.com/ElemeFE/element)を使っています。i18nの多言語対応、可変ルート、権限、典型的なビジネスアプリテンプレートであり、豊富なコンポーネントを提供しています、素早くビジネス用の管理画面の現型を構築に役立ちます。
+
+- [デモページ](https://panjiachen.github.io/vue-element-admin)
+
+- [ドキュメント](https://panjiachen.github.io/vue-element-admin-site/)
+
+- [Gitter](https://gitter.im/vue-element-admin/discuss)
+
+- [Donate](https://panjiachen.gitee.io/vue-element-admin-site/zh/donate)
+
+- [Wiki](https://github.com/PanJiaChen/vue-element-admin/wiki)
+
+- おすすめシンプルテンプレート: [vue-admin-template](https://github.com/PanJiaChen/vue-admin-template)
+- デスクトップバージョン: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin)
+- Typescriptバージョン: [vue-typescript-admin-template](https://github.com/Armour/vue-typescript-admin-template) (鸣谢: [@Armour](https://github.com/Armour))
+- [awesome-project](https://github.com/PanJiaChen/vue-element-admin/issues/2312)
+
+**After the `v4.1.0+` version, the default master branch will not support i18n. Please use [i18n Branch](https://github.com/PanJiaChen/vue-element-admin/tree/i18n), it will keep up with the master update**
+
+**現在のバージョン `v4.0+` は `vue-cli` で構築，バグ報告は[issue](https://github.com/PanJiaChen/vue-element-admin/issues/new)のissueでお願いします。旧バージョン[tag/3.11.0](https://github.com/PanJiaChen/vue-element-admin/tree/tag/3.11.0)もあります。`vue-cli`に依存しないです。**
+
+**低いバージョンのブラウザはサーポートしないです(例えば ie)，必要があれば polyfill を追加してください。 [詳細はこちら](https://github.com/PanJiaChen/vue-element-admin/wiki#babel-polyfill)**
+
+## 前準備
+
+ローカル環境に [node](http://nodejs.org/) と [git](https://git-scm.com/)をインストールが必要です。[ES2015+](http://es6.ruanyifeng.com/)、[vue](https://cn.vuejs.org/index.html)、[vuex](https://vuex.vuejs.org/zh-cn/)、[vue-router](https://router.vuejs.org/zh-cn/) 、[vue-cli](https://github.com/vuejs/vue-cli) 、[axios](https://github.com/axios/axios) 和 [element-ui](https://github.com/ElemeFE/element)で開発しています。Requestは[Mock.js](https://github.com/nuysoft/Mock)のモックデータを使っています。
+
+**バグ修正や新規機能追加のissue と pull requestは大歓迎です。**
+
+ <p align="center">
+  <img width="900" src="https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png">
+</p>
+
+## Sponsors
+
+Become a sponsor and get your logo on our README on GitHub with a link to your site. [[Become a sponsor]](https://www.patreon.com/panjiachen)
+
+<a href="https://flatlogic.com/admin-dashboards?from=vue-element-admin"><img width="150px" src="https://wpimg.wallstcn.com/9c0b719b-5551-4c1e-b776-63994632d94a.png" /></a><p>Admin Dashboard Templates made with Vue, React and Angular.</p>
+
+## 機能一覧
+
+```
+- ログイン / ログアウト
+
+- Auth認証
+  - ページ権限
+  - 権限パーミッション
+  - 権限設定
+  - 外部IDでログイン
+
+- 複数環境デプロイ
+  - dev sit stage prod
+
+- 共通機能
+  - 多言語切替
+  - テーマ切替
+  - サイトメニュー（ルートから生成）
+  - Breadcrumb Navigation
+  - Tag Navigation
+  - Svg Sprite Icon
+  - ローカル/バックエンド モック データ
+  - Screenfull
+
+- WYSIWYG
+  - TinyMCE
+  - Markdown
+  - JSON
+
+- Excel
+  - エクスポート
+  - インポート
+  - リード
+  - Zip
+
+- Table
+  - Dynamic Table
+  - Drag And Drop Table
+  - Inline Edit Table
+
+- Error Page
+  - 401
+  - 404
+
+- コンポーネント
+  - Avatar Upload
+  - Back To Top
+  - Drag Dialog
+  - Drag Select
+  - Drag Kanban
+  - Drag List
+  - SplitPane
+  - Dropzone
+  - Sticky
+  - CountTo
+
+- Advanced Example
+- Error Log
+- Dashboard
+- Guide Page
+- ECharts
+- Clipboard
+- Markdown to html
+```
+
+## Getting started
+
+```bash
+# clone the project
+git clone -b i18n git@github.com:PanJiaChen/vue-element-admin.git
+
+# enter the project directory
+cd vue-element-admin
+
+# install dependency
+npm install
+
+# develop
+npm run dev
+```
+
+This will automatically open http://localhost:9527
+
+## Build
+
+```bash
+# build for test environment
+npm run build:stage
+
+# build for production environment
+npm run build:prod
+```
+
+## Advanced
+
+```bash
+# preview the release environment effect
+npm run preview
+
+# preview the release environment effect + static resource analysis
+npm run preview -- --report
+
+# code format check
+npm run lint
+
+# code format check and auto fix
+npm run lint -- --fix
+```
+
+Refer to [Documentation](https://panjiachen.github.io/vue-element-admin-site/guide/essentials/deploy.html) for more information
+
+## Changelog
+
+Detailed changes for each release are documented in the [release notes](https://github.com/PanJiaChen/vue-element-admin/releases).
+
+## Online Demo
+
+[Preview](https://panjiachen.github.io/vue-element-admin)
+
+## Donate
+
+If you find this project useful, you can buy author a glass of juice :tropical_drink:
+
+![donate](https://wpimg.wallstcn.com/bd273f0d-83a0-4ef2-92e1-9ac8ed3746b9.png)
+
+[Paypal Me](https://www.paypal.me/panfree23)
+
+[Buy me a coffee](https://www.buymeacoffee.com/Pan)
+
+## Browsers support
+
+Modern browsers and Internet Explorer 10+.
+
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Safari |
+| --------- | --------- | --------- | --------- |
+| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions
+
+## License
+
+[MIT](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE)
+
+Copyright (c) 2017-present PanJiaChen
--- a/README.md
+++ b/README.md
-├── README.md         //说明文件
-├── babel.config.js  babel配置文件
-├── jest.config.js 配置文件
-├── jsconfig.json 配置文件
-├── mock    //mock数据目录 可以拦截 Ajax 请求，返回模拟的响应数据。
-│   └── mock-server.js
-├── package-lock.json  
-├── package.json  npm包配置文件 里面定义了项目的npm脚本，依赖包等信息
-├── postcss.config.js  配置项目css基础px
-├── public    项目入口文件
-│   ├── favicon.ico
-│   └── index.html  项目入口页面
-├── src  源码目录
-│   ├── App.vue   跟组件
-│   ├── api 
-│   │   └── index.js
-│   ├── assets  静态资源文件夹
-│   │   └── favicon.ico
-│   ├── components   公共组件目录
-│   ├── directive  指令目录
-│   │   └── sticky.js
-│   ├── filters  过滤器目录
-│   │   └── index.js
-│   ├── icons  icon目录
-│   │   └── index.js
-│   ├── layout  页面结构目录
-│   │   └── index.vue
-│   ├── main.js  入口js文件
-│   ├── permission.js   权限js文件
-│   ├── router   路由模块
-│   │   └── index.js
-│   ├── settings.js  页面结构配置
-│   ├── store   应用级数据（state）
-│   │   └── index.js
-│   ├── styles  前端样式文件
-│   ├── utils  公共方法文件
-│   │   └── index.js
-│   ├── vendor
-│   └── views   页面目录
-│       └── index.vue
-└── vue.config.js vue-cli 配置
-.env.xxxx                  # 环境变量配置
-.eslintrc.js               # eslint 配置项
-.babelrc                   # babel-loader 配置
-.travis.yml                # 自动化CI配置
-
-# install dependency
+#目录结构
+├── build                      // 构建相关  
+├── config                     // 配置相关  
+├── src                        // 源代码  
+│   ├── api                    // 所有请求  
+│   ├── assets                 // 主题 字体等静态资源  
+│   ├── components             // 全局公用组件  
+│   ├── directive              // 全局指令  
+│   ├── filter                // 全局 filter  
+│   ├── http                  // 全局 http请求 配置  
+│   ├── icons                  // 项目所有 svg icons  
+│   ├── lang                   // 国际化 language  
+│   ├── mock                   // 项目mock 模拟数据  
+│   ├── router                 // 路由  
+│   ├── store                  // 全局 store管理  
+│   ├── styles                 // 全局样式  
+│   ├── utils                  // 全局公用方法  
+│   ├── vendor                 // 公用vendor  
+│   ├── views                   // view  
+│   ├── App.vue                // 入口页面  
+│   ├── main.js                // 入口 加载组件 初始化等  
+│   └── permission.js          // 权限管理  
+├── static                     // 第三方不打包资源
+│   └── Tinymce                // 富文本  
+├── .babelrc                   // babel-loader 配置  
+├── eslintrc.js                // eslint 配置项  
+├── .gitignore                 // git 忽略项  
+├── favicon.ico                // favicon图标  
+├── index.html                 // html模板  
+└── package.json               // package.json  
+
+
+# vue-init
+
+> A Vue.js project
+
+## Build Setup
+
+``` bash
+# install dependencies
 npm install

-# develop
+# serve with hot reload at localhost:8080
 npm run dev

-#prod
-npm run build:prod
\ No newline at end of file
+# build for production with minification
+npm run build
+
+# build for production and view the bundle analyzer report
+npm run build --report
+
+# run unit tests
+npm run unit
+
+# run all tests
+npm test
+```
+
+For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).
--- a/README.zh-CN.md
+++ b/README.zh-CN.md
+<p align="center">
+  <img width="320" src="https://wpimg.wallstcn.com/ecc53a42-d79b-42e2-8852-5126b810a4c8.svg">
+</p>
+
+<p align="center">
+  <a href="https://github.com/vuejs/vue">
+    <img src="https://img.shields.io/badge/vue-2.6.10-brightgreen.svg" alt="vue">
+  </a>
+  <a href="https://github.com/ElemeFE/element">
+    <img src="https://img.shields.io/badge/element--ui-2.7.0-brightgreen.svg" alt="element-ui">
+  </a>
+  <a href="https://travis-ci.org/PanJiaChen/vue-element-admin" rel="nofollow">
+    <img src="https://travis-ci.org/PanJiaChen/vue-element-admin.svg?branch=master" alt="Build Status">
+  </a>
+  <a href="https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE">
+    <img src="https://img.shields.io/github/license/mashape/apistatus.svg" alt="license">
+  </a>
+  <a href="https://github.com/PanJiaChen/vue-element-admin/releases">
+    <img src="https://img.shields.io/github/release/PanJiaChen/vue-element-admin.svg" alt="GitHub release">
+  </a>
+  <a href="https://gitter.im/vue-element-admin/discuss">
+    <img src="https://badges.gitter.im/Join%20Chat.svg" alt="gitter">
+  </a>
+  <a href="https://panjiachen.gitee.io/vue-element-admin-site/zh/donate">
+    <img src="https://img.shields.io/badge/%24-donate-ff69b4.svg" alt="donate">
+  </a>
+</p>
+
+简体中文 | [English](./README.md) | [日本語](./README.ja.md) | [Spanish](./README.es.md)
+
+## 简介
+
+[vue-element-admin](https://panjiachen.github.io/vue-element-admin) 是一个后台前端解决方案，它基于 [vue](https://github.com/vuejs/vue) 和 [element-ui](https://github.com/ElemeFE/element)实现。它使用了最新的前端技术栈，内置了 i18n 国际化解决方案，动态路由，权限验证，提炼了典型的业务模型，提供了丰富的功能组件，它可以帮助你快速搭建企业级中后台产品原型。相信不管你的需求是什么，本项目都能帮助到你。
+
+- [在线预览](https://panjiachen.github.io/vue-element-admin)
+
+- [使用文档](https://panjiachen.github.io/vue-element-admin-site/zh/)
+
+- [Gitter 讨论组](https://gitter.im/vue-element-admin/discuss)
+
+- [Donate](https://panjiachen.gitee.io/vue-element-admin-site/zh/donate)
+
+- [Wiki](https://github.com/PanJiaChen/vue-element-admin/wiki)
+
+- [Gitee](https://panjiachen.gitee.io/vue-element-admin/) 在线预览（国内用户可访问该地址）
+
+- [国内访问文档](https://panjiachen.gitee.io/vue-element-admin-site/zh/) 文档（方便没翻墙的用户查看）
+
+- 基础模板建议使用: [vue-admin-template](https://github.com/PanJiaChen/vue-admin-template)
+- 桌面端: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin)
+- Typescript 版: [vue-typescript-admin-template](https://github.com/Armour/vue-typescript-admin-template) (鸣谢: [@Armour](https://github.com/Armour))
+- [awesome-project](https://github.com/PanJiaChen/vue-element-admin/issues/2312)
+
+**`v4.1.0+`版本之后默认 master 分支将不支持国际化，有需要的请使用[i18n](https://github.com/PanJiaChen/vue-element-admin/tree/i18n)分支，它会和 master 保持同步更新**
+
+**该项目不支持低版本浏览器(如 ie)，有需求请自行添加 polyfill [详情](https://github.com/PanJiaChen/vue-element-admin/wiki#babel-polyfill)**
+
+**目前版本为 `v4.0+` 基于 `vue-cli` 进行构建，若发现问题，欢迎提[issue](https://github.com/PanJiaChen/vue-element-admin/issues/new)。若你想使用旧版本，可以切换分支到[tag/3.11.0](https://github.com/PanJiaChen/vue-element-admin/tree/tag/3.11.0)，它不依赖 `vue-cli`**
+
+群主 **[圈子](https://jianshiapp.com/circles/1209)** 群主会经常分享一些技术相关的东西，或者加入 [qq 群](https://github.com/PanJiaChen/vue-element-admin/issues/602) 或者关注 [微博](https://weibo.com/u/3423485724?is_all=1)
+
+## 前序准备
+
+你需要在本地安装 [node](http://nodejs.org/) 和 [git](https://git-scm.com/)。本项目技术栈基于 [ES2015+](http://es6.ruanyifeng.com/)、[vue](https://cn.vuejs.org/index.html)、[vuex](https://vuex.vuejs.org/zh-cn/)、[vue-router](https://router.vuejs.org/zh-cn/) 、[vue-cli](https://github.com/vuejs/vue-cli) 、[axios](https://github.com/axios/axios) 和 [element-ui](https://github.com/ElemeFE/element)，所有的请求数据都使用[Mock.js](https://github.com/nuysoft/Mock)进行模拟，提前了解和学习这些知识会对使用本项目有很大的帮助。
+
+同时配套了系列教程文章，如何从零构建后一个完整的后台项目，建议大家先看完这些文章再来实践本项目
+
+- [手摸手，带你用 vue 撸后台 系列一(基础篇)](https://juejin.im/post/59097cd7a22b9d0065fb61d2)
+- [手摸手，带你用 vue 撸后台 系列二(登录权限篇)](https://juejin.im/post/591aa14f570c35006961acac)
+- [手摸手，带你用 vue 撸后台 系列三 (实战篇)](https://juejin.im/post/593121aa0ce4630057f70d35)
+- [手摸手，带你用 vue 撸后台 系列四(vueAdmin 一个极简的后台基础模板)](https://juejin.im/post/595b4d776fb9a06bbe7dba56)
+- [手摸手，带你用vue撸后台 系列五(v4.0新版本)](https://juejin.im/post/5c92ff94f265da6128275a85)
+- [手摸手，带你封装一个 vue component](https://segmentfault.com/a/1190000009090836)
+- [手摸手，带你优雅的使用 icon](https://juejin.im/post/59bb864b5188257e7a427c09)
+- [手摸手，带你用合理的姿势使用 webpack4（上）](https://juejin.im/post/5b56909a518825195f499806)
+- [手摸手，带你用合理的姿势使用 webpack4（下）](https://juejin.im/post/5b5d6d6f6fb9a04fea58aabc)
+
+**如有问题请先看上述使用文档和文章，若不能满足，欢迎 issue 和 pr**
+
+ <p align="center">
+  <img width="900" src="https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png">
+</p>
+
+## Sponsors
+
+Become a sponsor and get your logo on our README on GitHub with a link to your site. [[Become a sponsor]](https://www.patreon.com/panjiachen)
+
+<a href="https://flatlogic.com/admin-dashboards?from=vue-element-admin"><img width="150px" src="https://wpimg.wallstcn.com/9c0b719b-5551-4c1e-b776-63994632d94a.png" /></a><p>Admin Dashboard Templates made with Vue, React and Angular.</p>
+
+## 功能
+
+```
+- 登录 / 注销
+
+- 权限验证
+  - 页面权限
+  - 指令权限
+  - 权限配置
+  - 二步登录
+
+- 多环境发布
+  - dev sit stage prod
+
+- 全局功能
+  - 国际化多语言
+  - 多种动态换肤
+  - 动态侧边栏（支持多级路由嵌套）
+  - 动态面包屑
+  - 快捷导航(标签页)
+  - Svg Sprite 图标
+  - 本地/后端 mock 数据
+  - Screenfull全屏
+  - 自适应收缩侧边栏
+
+- 编辑器
+  - 富文本
+  - Markdown
+  - JSON 等多格式
+
+- Excel
+  - 导出excel
+  - 导入excel
+  - 前端可视化excel
+  - 导出zip
+
+- 表格
+  - 动态表格
+  - 拖拽表格
+  - 内联编辑
+
+- 错误页面
+  - 401
+  - 404
+
+- 組件
+  - 头像上传
+  - 返回顶部
+  - 拖拽Dialog
+  - 拖拽Select
+  - 拖拽看板
+  - 列表拖拽
+  - SplitPane
+  - Dropzone
+  - Sticky
+  - CountTo
+
+- 综合实例
+- 错误日志
+- Dashboard
+- 引导页
+- ECharts 图表
+- Clipboard(剪贴复制)
+- Markdown2html
+```
+
+## 开发
+
+```bash
+# 克隆项目
+git clone -b i18n git@github.com:PanJiaChen/vue-element-admin.git
+
+# 进入项目目录
+cd vue-element-admin
+
+# 安装依赖
+npm install
+
+# 建议不要直接使用 cnpm 安装依赖，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
+npm install --registry=https://registry.npm.taobao.org
+
+# 启动服务
+npm run dev
+```
+
+浏览器访问 http://localhost:9527
+
+## 发布
+
+```bash
+# 构建测试环境
+npm run build:stage
+
+# 构建生产环境
+npm run build:prod
+```
+
+## 其它
+
+```bash
+# 预览发布环境效果
+npm run preview
+
+# 预览发布环境效果 + 静态资源分析
+npm run preview -- --report
+
+# 代码格式检查
+npm run lint
+
+# 代码格式检查并自动修复
+npm run lint -- --fix
+```
+
+更多信息请参考 [使用文档](https://panjiachen.github.io/vue-element-admin-site/zh/)
+
+## Changelog
+
+Detailed changes for each release are documented in the [release notes](https://github.com/PanJiaChen/vue-element-admin/releases).
+
+## Online Demo
+
+[在线 Demo](https://panjiachen.github.io/vue-element-admin)
+
+## Donate
+
+如果你觉得这个项目帮助到了你，你可以帮作者买一杯果汁表示鼓励 :tropical_drink:
+![donate](https://panjiachen.github.io/donate/donation.png)
+
+[更多捐赠方式](https://panjiachen.gitee.io/vue-element-admin-site/zh/donate)
+
+[Paypal Me](https://www.paypal.me/panfree23)
+
+[Buy me a coffee](https://www.buymeacoffee.com/Pan)
+
+## Browsers support
+
+Modern browsers and Internet Explorer 10+.
+
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](https://godban.github.io/browsers-support-badges/)</br>Safari |
+| --------- | --------- | --------- | --------- |
+| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions
+
+## License
+
+[MIT](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE)
+
+Copyright (c) 2017-present PanJiaChen
--- a/babel.config.js
+++ b/babel.config.js
 module.exports = {
-  presets: [
-    '@vue/app'
-  ]
+presets: [
+  '@vue/app'
+]
 }
--- a/build/index.js
+++ b/build/index.js
@@ -19,7 +19,7 @@ if (process.env.npm_config_preview || rawArgv.includes('--preview')) {
  app.use(
    publicPath,
    serveStatic('./dist', {
-      index: ['index.html', '/']
+      index: ['pdf-view.vue.html', '/']
    })
  )


--- a/mock/role/routes.js
+++ b/mock/role/routes.js
@@ -50,7 +50,7 @@ export const constantRoutes = [
    component: 'layout/Layout',
    children: [
      {
-        path: 'index',
+        path: 'pdf-view.vue',
        component: 'views/documentation/index',
        name: 'Documentation',
        meta: { title: 'documentation', icon: 'documentation', affix: true }
@@ -63,7 +63,7 @@ export const constantRoutes = [
    redirect: '/guide/index',
    children: [
      {
-        path: 'index',
+        path: 'pdf-view.vue',
        component: 'views/guide/index',
        name: 'Guide',
        meta: { title: 'guide', icon: 'guide', noCache: true }
@@ -118,7 +118,7 @@ export const asyncRoutes = [
    component: 'layout/Layout',
    children: [
      {
-        path: 'index',
+        path: 'pdf-view.vue',
        component: 'views/icons/index',
        name: 'Icons',
        meta: { title: 'icons', icon: 'icon', noCache: true }
@@ -350,7 +350,7 @@ export const asyncRoutes = [
    component: 'layout/Layout',
    children: [
      {
-        path: 'index',
+        path: 'pdf-view.vue',
        component: 'views/tab/index',
        name: 'Tab',
        meta: { title: 'tab', icon: 'tab' }
@@ -456,7 +456,7 @@ export const asyncRoutes = [
    redirect: '/pdf/index',
    children: [
      {
-        path: 'index',
+        path: 'pdf-view.vue',
        component: 'views/pdf/index',
        name: 'PDF',
        meta: { title: 'pdf', icon: 'pdf' }
@@ -475,7 +475,7 @@ export const asyncRoutes = [
    redirect: 'noRedirect',
    children: [
      {
-        path: 'index',
+        path: 'pdf-view.vue',
        component: 'views/theme/index',
        name: 'Theme',
        meta: { title: 'theme', icon: 'theme' }
@@ -489,7 +489,7 @@ export const asyncRoutes = [
    redirect: 'noRedirect',
    children: [
      {
-        path: 'index',
+        path: 'pdf-view.vue',
        component: 'views/clipboard/index',
        name: 'ClipboardDemo',
        meta: { title: 'clipboardDemo', icon: 'clipboard' }
@@ -502,7 +502,7 @@ export const asyncRoutes = [
    component: 'layout/Layout',
    children: [
      {
-        path: 'index',
+        path: 'pdf-view.vue',
        component: 'views/i18n-demo/index',
        name: 'I18n',
        meta: { title: 'i18n', icon: 'international' }

--- a/package.json
+++ b/package.json
 {
  "name": "vue-element-admin",
  "version": "4.2.1",
-  "description": "A magical vue admin. An out-of-box UI solution for enterprise applications. Newest development stack of vue. Lots of awesome features",
-  "author": "Pan <panfree23@gmail.com>",
+  "description": "A vue project",
+  "author": "",
  "license": "MIT",
  "scripts": {
    "dev": "vue-cli-service serve",
@@ -65,6 +65,7 @@
    "vue": "2.6.10",
    "vue-count-to": "1.0.13",
    "vue-i18n": "7.3.2",
+    "vue-pdf": "^4.0.7",
    "vue-router": "3.0.2",
    "vue-splitpane": "1.0.4",
    "vuedraggable": "2.20.0",

--- a/src/api/article.js
+++ b/src/api/article.js
@@ -39,3 +39,11 @@ export function updateArticle(data) {
    data
  })
 }
+
+export function downloadZip() {
+  return request({
+    url: 'https://github.com//PanJiaChen/vue-element-admin/archive/master.zip',
+    method: 'get',
+    responseType: 'blob'
+  })
+}
--- a/src/components/ImageCropper/index.vue
+++ b/src/components/ImageCropper/index.vue
@@ -125,8 +125,8 @@
          </div>
        </div>
        <div class="vicp-operate">
-          <a @click="setStep(2)" @mousedown="ripple">{{ lang.btn.back }}</a>
-          <a @click="off" @mousedown="ripple">{{ lang.btn.close }}</a>
+          <a @click="setStep(2)" @mousedown="ripple">返回</a>
+          <a @click="off" @mousedown="ripple">关闭</a>
        </div>
      </div>
      <canvas v-show="false" ref="canvas" :width="width" :height="height" />

--- a/src/components/Tinymce/components/EditorImage.vue
+++ b/src/components/Tinymce/components/EditorImage.vue
@@ -20,10 +20,10 @@
        </el-button>
      </el-upload>
      <el-button @click="dialogVisible = false">
-        Cancel
+        取消
      </el-button>
      <el-button type="primary" @click="handleSubmit">
-        Confirm
+        确定
      </el-button>
    </el-dialog>
  </div>

--- a/src/lang/zh.js
+++ b/src/lang/zh.js
 export default {
  route: {
-    dashboard: '菜单',
-    documentation: '菜单',
-    guide: '菜单',
-    permission: '菜单',
-    rolePermission: '菜单',
-    pagePermission: '菜单',
-    directivePermission: '菜单',
-    icons: '菜单',
-    components: '菜单',
-    tinymce: '菜单',
-    markdown: '菜单',
-    jsonEditor: '菜单',
-    dndList: '菜单',
-    splitPane: '菜单',
-    avatarUpload: '菜单',
-    dropzone: '菜单',
-    sticky: '菜单',
-    countTo: '菜单',
-    componentMixin: '菜单',
-    backToTop: '菜单',
-    dragDialog: '菜单',
-    dragSelect: '菜单',
-    dragKanban: '菜单',
-    charts: '菜单',
-    keyboardChart: '菜单',
-    lineChart: '菜单',
-    mixChart: '菜单',
-    example: '菜单',
-    nested: '菜单',
-    menu1: '菜单',
+    dashboard: '首页',
+    documentation: '文档',
+    guide: '引导页',
+    permission: '权限测试页',
+    rolePermission: '角色权限',
+    pagePermission: '页面权限',
+    directivePermission: '指令权限',
+    icons: '图标',
+    components: '组件',
+    tinymce: '富文本编辑器',
+    markdown: 'Markdown',
+    jsonEditor: 'JSON 编辑器',
+    dndList: '列表拖拽',
+    splitPane: 'Splitpane',
+    avatarUpload: '头像上传',
+    dropzone: 'Dropzone',
+    sticky: 'Sticky',
+    countTo: 'Count To',
+    componentMixin: '小组件',
+    backToTop: '返回顶部',
+    dragDialog: '拖拽 Dialog',
+    dragSelect: '拖拽 Select',
+    dragKanban: '可拖拽看板',
+    charts: '图表',
+    keyboardChart: '键盘图表',
+    lineChart: '折线图',
+    mixChart: '混合图表',
+    example: '综合实例',
+    nested: '路由嵌套',
+    menu1: '菜单1',
    'menu1-1': '菜单 1-1',
    'menu1-2': '菜单 1-2',
    'menu1-2-1': '菜单 1-2-1',
    'menu1-2-2': '菜单 1-2-2',
    'menu1-3': '菜单 1-3',
    menu2: '菜单 2',
-    Table: '菜单',
-    dynamicTable: '菜单',
-    dragTable: '菜单',
-    inlineEditTable: '菜单',
-    complexTable: '菜单',
-    tab: '菜单',
-    form: '菜单',
-    createArticle: '菜单',
-    editArticle: '菜单',
-    articleList: '菜单',
-    errorPages: '菜单',
-    page401: '菜单',
-    page404: '菜单',
-    errorLog: '菜单',
-    excel: '菜单',
-    exportExcel: '菜单',
-    selectExcel: '菜单',
-    mergeHeader: '菜单',
-    uploadExcel: '菜单',
-    zip: '菜单',
-    pdf: '菜单',
-    exportZip: '菜单',
-    theme: '菜单',
-    clipboardDemo: '菜单',
-    i18n: '菜单',
-    externalLink: '菜单',
-    profile: '菜单'
+    Table: 'Table',
+    dynamicTable: '动态 Table',
+    dragTable: '拖拽 Table',
+    inlineEditTable: 'Table 内编辑',
+    complexTable: '综合 Table',
+    tab: 'Tab',
+    form: '表单',
+    createArticle: '创建文章',
+    editArticle: '编辑文章',
+    articleList: '文章列表',
+    errorPages: '错误页面',
+    page401: '401',
+    page404: '404',
+    errorLog: '错误日志',
+    excel: 'Excel',
+    exportExcel: '导出 Excel',
+    selectExcel: '导出 已选择项',
+    mergeHeader: '导出 多级表头',
+    uploadExcel: '上传 Excel',
+    zip: 'Zip',
+    pdf: 'PDF',
+    exportZip: 'Export Zip',
+    theme: '换肤',
+    clipboardDemo: 'Clipboard',
+    i18n: '国际化',
+    externalLink: '外链',
+    profile: '个人中心'
  },
  navbar: {
    dashboard: '首页',

--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -5,20 +5,20 @@
    <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />

    <div class="right-menu">
-      <!--      <template v-if="device!=='mobile'">-->
-      <!--        <search id="header-search" class="right-menu-item" />-->
+      <template v-if="device!=='mobile'">
+        <search id="header-search" class="right-menu-item" />

-      <!--        <error-log class="errLog-container right-menu-item hover-effect" />-->
+        <error-log class="errLog-container right-menu-item hover-effect" />

-      <!--        <screenfull id="screenfull" class="right-menu-item hover-effect" />-->
+        <screenfull id="screenfull" class="right-menu-item hover-effect" />

-      <!--        <el-tooltip :content="$t('navbar.size')" effect="dark" placement="bottom">-->
-      <!--          <size-select id="size-select" class="right-menu-item hover-effect" />-->
-      <!--        </el-tooltip>-->
+        <el-tooltip :content="$t('navbar.size')" effect="dark" placement="bottom">
+          <size-select id="size-select" class="right-menu-item hover-effect" />
+        </el-tooltip>

-      <!--        <lang-select class="right-menu-item hover-effect" />-->
+        <lang-select class="right-menu-item hover-effect" />

-      <!--      </template>-->
+      </template>

      <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
        <div class="avatar-wrapper">
@@ -36,6 +36,14 @@
              {{ $t('navbar.dashboard') }}
            </el-dropdown-item>
          </router-link>
+          <a target="_blank" href="https://github.com/PanJiaChen/vue-element-admin/">
+            <el-dropdown-item>
+              {{ $t('navbar.github') }}
+            </el-dropdown-item>
+          </a>
+          <a target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/#/">
+            <el-dropdown-item>Docs</el-dropdown-item>
+          </a>
          <el-dropdown-item divided>
            <span style="display:block;" @click="logout">{{ $t('navbar.logOut') }}</span>
          </el-dropdown-item>

--- a/src/layout/components/Settings/index.vue
+++ b/src/layout/components/Settings/index.vue
 <template>
  <div class="drawer-container">
    <div>
-      <h3 class="drawer-title">{{ $t('settings.title') }}</h3>
+      <h3 class="drawer-title">系统布局配置</h3>

      <div class="drawer-item">
-        <span>{{ $t('settings.theme') }}</span>
+        <span>主题色</span>
        <theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" />
      </div>

      <div class="drawer-item">
-        <span>{{ $t('settings.tagsView') }}</span>
+        <span>开启 Tags-View</span>
        <el-switch v-model="tagsView" class="drawer-switch" />
      </div>

      <div class="drawer-item">
-        <span>{{ $t('settings.fixedHeader') }}</span>
+        <span>固定 Header</span>
        <el-switch v-model="fixedHeader" class="drawer-switch" />
      </div>

      <div class="drawer-item">
-        <span>{{ $t('settings.sidebarLogo') }}</span>
+        <span>侧边栏 Logo</span>
        <el-switch v-model="sidebarLogo" class="drawer-switch" />
      </div>
-
    </div>
  </div>
 </template>

--- a/src/main.js
+++ b/src/main.js
@@ -20,6 +20,14 @@ import './utils/error-log' // error log

 import * as filters from './filters' // global filters

+/**
+ * If you don't want to use mock-server
+ * you want to use MockJs for mock api
+ * you can execute: mockXHR()
+ *
+ * Currently MockJs will be used in the production environment,
+ * please remove it before going online! ! !
+ */
 import { mockXHR } from '../mock'
 if (process.env.NODE_ENV === 'production') {
  mockXHR()

--- a/src/router/index.js
+++ b/src/router/index.js
--- a/src/router/modules/charts.js
+++ b/src/router/modules/charts.js
@@ -14,19 +14,19 @@ const chartsRouter = {
  children: [
    {
      path: 'keyboard',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/charts/keyboard'),
      name: 'KeyboardChart',
      meta: { title: 'keyboardChart', noCache: true }
    },
    {
      path: 'line',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/charts/line'),
      name: 'LineChart',
      meta: { title: 'lineChart', noCache: true }
    },
    {
      path: 'mix-chart',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/charts/mix-chart'),
      name: 'MixChart',
      meta: { title: 'mixChart', noCache: true }
    }

--- a/src/router/modules/components.js
+++ b/src/router/modules/components.js
@@ -14,85 +14,91 @@ const componentsRouter = {
  children: [
    {
      path: 'tinymce',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/components-demo/tinymce'),
      name: 'TinymceDemo',
      meta: { title: 'tinymce' }
    },
-    {
-      path: 'markdown',
-      component: () => import('@/views/documentation/index'),
-      name: 'MarkdownDemo',
-      meta: { title: 'markdown' }
-    },
-    {
-      path: 'json-editor',
-      component: () => import('@/views/documentation/index'),
-      name: 'JsonEditorDemo',
-      meta: { title: 'jsonEditor' }
-    },
-    {
-      path: 'split-pane',
-      component: () => import('@/views/documentation/index'),
-      name: 'SplitpaneDemo',
-      meta: { title: 'splitPane' }
-    },
-    {
-      path: 'avatar-upload',
-      component: () => import('@/views/documentation/index'),
-      name: 'AvatarUploadDemo',
-      meta: { title: 'avatarUpload' }
-    },
-    {
-      path: 'dropzone',
-      component: () => import('@/views/documentation/index'),
-      name: 'DropzoneDemo',
-      meta: { title: 'dropzone' }
-    },
+    // {
+    //   path: 'markdown',
+    //   component: () => import('@/views/components-demo/markdown'),
+    //   name: 'MarkdownDemo',
+    //   meta: { title: 'markdown' }
+    // },
+    // {
+    //   path: 'json-editor',
+    //   component: () => import('@/views/components-demo/json-editor'),
+    //   name: 'JsonEditorDemo',
+    //   meta: { title: 'jsonEditor' }
+    // },
+    // {
+    //   path: 'split-pane',
+    //   component: () => import('@/views/components-demo/split-pane'),
+    //   name: 'SplitpaneDemo',
+    //   meta: { title: 'splitPane' }
+    // },
+    // {
+    //   path: 'avatar-upload',
+    //   component: () => import('@/views/components-demo/avatar-upload'),
+    //   name: 'AvatarUploadDemo',
+    //   meta: { title: 'avatarUpload' }
+    // },
+    // {
+    //   path: 'dropzone',
+    //   component: () => import('@/views/components-demo/dropzone'),
+    //   name: 'DropzoneDemo',
+    //   meta: { title: 'dropzone' }
+    // },
    {
      path: 'sticky',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/components-demo/sticky'),
      name: 'StickyDemo',
-      meta: { title: 'sticky' }
-    },
-    {
-      path: 'count-to',
-      component: () => import('@/views/documentation/index'),
-      name: 'CountToDemo',
-      meta: { title: 'countTo' }
+      meta: { title: '固定顶部' }
    },
+    // {
+    //   path: 'count-to',
+    //   component: () => import('@/views/components-demo/count-to'),
+    //   name: 'CountToDemo',
+    //   meta: { title: 'countTo' }
+    // },
    {
      path: 'mixin',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/components-demo/mixin'),
      name: 'ComponentMixinDemo',
      meta: { title: 'componentMixin' }
    },
    {
      path: 'back-to-top',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/components-demo/back-to-top'),
      name: 'BackToTopDemo',
      meta: { title: 'backToTop' }
    },
    {
      path: 'drag-dialog',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/components-demo/drag-dialog'),
      name: 'DragDialogDemo',
-      meta: { title: 'dragDialog' }
+      meta: { title: '弹窗可拖动' }
    },
    {
-      path: 'drag-select',
-      component: () => import('@/views/documentation/index'),
-      name: 'DragSelectDemo',
-      meta: { title: 'dragSelect' }
+      path: 'drag-dialog',
+      component: () => import('@/views/components-demo/drag-dialog'),
+      name: 'DragDialogDemo',
+      meta: { title: 'process进度页面' }
    },
+    // {
+    //   path: 'drag-select',
+    //   component: () => import('@/views/components-demo/drag-select'),
+    //   name: 'DragSelectDemo',
+    //   meta: { title: 'dragSelect' }
+    // },
    {
      path: 'dnd-list',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/components-demo/dnd-list'),
      name: 'DndListDemo',
      meta: { title: 'dndList' }
    },
    {
      path: 'drag-kanban',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/components-demo/drag-kanban'),
      name: 'DragKanbanDemo',
      meta: { title: 'dragKanban' }
    }

--- a/src/router/modules/nested.js
+++ b/src/router/modules/nested.js
@@ -14,33 +14,33 @@ const nestedRouter = {
  children: [
    {
      path: 'menu1',
-      component: () => import('@/views/documentation/index'), // Parent router-view
+      component: () => import('@/views/nested/menu1/index'), // Parent router-view
      name: 'Menu1',
      meta: { title: 'menu1' },
      redirect: '/nested/menu1/menu1-1',
      children: [
        {
          path: 'menu1-1',
-          component: () => import('@/views/documentation/index'),
+          component: () => import('@/views/nested/menu1/menu1-1'),
          name: 'Menu1-1',
          meta: { title: 'menu1-1' }
        },
        {
          path: 'menu1-2',
-          component: () => import('@/views/documentation/index'),
+          component: () => import('@/views/nested/menu1/menu1-2'),
          name: 'Menu1-2',
          redirect: '/nested/menu1/menu1-2/menu1-2-1',
          meta: { title: 'menu1-2' },
          children: [
            {
              path: 'menu1-2-1',
-              component: () => import('@/views/documentation/index'),
+              component: () => import('@/views/nested/menu1/menu1-2/menu1-2-1'),
              name: 'Menu1-2-1',
              meta: { title: 'menu1-2-1' }
            },
            {
              path: 'menu1-2-2',
-              component: () => import('@/views/documentation/index'),
+              component: () => import('@/views/nested/menu1/menu1-2/menu1-2-2'),
              name: 'Menu1-2-2',
              meta: { title: 'menu1-2-2' }
            }
@@ -48,7 +48,7 @@ const nestedRouter = {
        },
        {
          path: 'menu1-3',
-          component: () => import('@/views/documentation/index'),
+          component: () => import('@/views/nested/menu1/menu1-3'),
          name: 'Menu1-3',
          meta: { title: 'menu1-3' }
        }
@@ -57,7 +57,7 @@ const nestedRouter = {
    {
      path: 'menu2',
      name: 'Menu2',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/nested/menu2/index'),
      meta: { title: 'menu2' }
    }
  ]

--- a/src/router/modules/table.js
+++ b/src/router/modules/table.js
@@ -14,25 +14,25 @@ const tableRouter = {
  children: [
    {
      path: 'dynamic-table',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/table/dynamic-table/index'),
      name: 'DynamicTable',
      meta: { title: 'dynamicTable' }
    },
    {
      path: 'drag-table',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/table/drag-table'),
      name: 'DragTable',
      meta: { title: 'dragTable' }
    },
    {
      path: 'inline-edit-table',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/table/inline-edit-table'),
      name: 'InlineEditTable',
      meta: { title: 'inlineEditTable' }
    },
    {
      path: 'complex-table',
-      component: () => import('@/views/documentation/index'),
+      component: () => import('@/views/table/complex-table'),
      name: 'ComplexTable',
      meta: { title: 'complexTable' }
    }

--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -37,7 +37,9 @@ export function parseTime(time, cFormat) {
  const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => {
    const value = formatObj[key]
    // Note: getDay() returns 0 on Sunday
-    if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value ] }
+    if (key === 'a') {
+      return ['日', '一', '二', '三', '四', '五', '六'][value]
+    }
    return value.toString().padStart(2, '0')
  })
  return time_str
@@ -160,12 +162,12 @@ export function param2Obj(url) {
  }
  return JSON.parse(
    '{"' +
-      decodeURIComponent(search)
-        .replace(/"/g, '\\"')
-        .replace(/&/g, '","')
-        .replace(/=/g, '":"')
-        .replace(/\+/g, ' ') +
-      '"}'
+    decodeURIComponent(search)
+      .replace(/"/g, '\\"')
+      .replace(/&/g, '","')
+      .replace(/=/g, '":"')
+      .replace(/\+/g, ' ') +
+    '"}'
  )
 }

@@ -345,3 +347,89 @@ export function removeClass(ele, cls) {
    ele.className = ele.className.replace(reg, ' ')
  }
 }
+
+/**
+ * 下载文件
+ * @param title 文件名称
+ * @param data 接口返回的二进制流
+ * 兼容IE 10+  IE 8 9点击文件链接自动下载不做说明
+ */
+export function downloadFile(title, data) {
+  // type是文件的格式
+  const fileType = getFileMimeType(title)
+  const blob = new Blob([data], { type: fileType })
+  const ie = navigator.userAgent.match(/MSIE\s([\d.]+)/)
+  const ie11 = navigator.userAgent.match(/Trident\/7.0/) && navigator.userAgent.match(/rv:11/)
+  const ieEDGE = navigator.userAgent.match(/Edge/g)
+  const ieVer = (ie ? ie[1] : (ie11 ? 11 : (ieEDGE ? 12 : -1)))
+  console.log('ie:' + ie)
+  console.log('ieVer:' + ieVer)
+  if (ie && ieVer < 10) {
+    this.message.error('No blobs on IE<10')
+    return
+  }
+  if (ieVer > -1) {
+    window.navigator.msSaveBlob(blob)
+  } else {
+    const url = window.URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.setAttribute('href', url)
+    link.setAttribute('download', title)
+    document.body.appendChild(link)
+    link.click()
+    document.body.removeChild(link)
+  }
+}
+
+/**
+ * 获取文件类型
+ * @param fileName 文件名称 如xxx.doc
+ * @returns {string}
+ */
+export function getFileMimeType(fileName) {
+  const fileType = fileName.substring(fileName.lastIndexOf('.') + 1, fileName.length).toLowerCase()
+  let mimeType = ''
+
+  switch (fileType) {
+    case 'txt':
+      mimeType = 'text/plain'
+      break
+    case 'docx':
+      mimeType = 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
+      break
+    case 'doc':
+      mimeType = 'application/msword'
+      break
+    case 'pptx':
+      mimeType = 'application/vnd.openxmlformats-officedocument.presentationml.presentation'
+      break
+    case 'ppt':
+      mimeType = 'application/vnd.ms-powerpoint'
+      break
+    case 'xlsx':
+      mimeType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+      break
+    case 'xls':
+      mimeType = 'application/vnd.ms-excel'
+      break
+    case 'zip':
+      mimeType = 'application/x-zip-compressed'
+      break
+    case 'rar':
+      mimeType = 'application/octet-stream'
+      break
+    case 'pdf':
+      mimeType = 'application/pdf'
+      break
+    case 'jpg':
+      mimeType = 'image/jpeg'
+      break
+    case 'png':
+      mimeType = 'image/png'
+      break
+    default:
+      mimeType = 'application/' + fileType
+      break
+  }
+  return mimeType
+}
--- a/src/views/components-demo/avatar-upload.vue
+++ b/src/views/components-demo/avatar-upload.vue
 <template>
  <div class="components-container">
-    <aside>This is based on
+    <aside>基于
      <a class="link-type" href="//github.com/dai-siki/vue-image-crop-upload"> vue-image-crop-upload</a>.
      {{ $t('components.imageUploadTips') }}
    </aside>
@@ -8,7 +8,7 @@
    <pan-thumb :image="image" />

    <el-button type="primary" icon="el-icon-upload" style="position: absolute;bottom: 15px;margin-left: 40px;" @click="imagecropperShow=true">
-      Change Avatar
+      修改头像
    </el-button>

    <image-cropper

--- a/src/views/documentation/index.vue
+++ b/src/views/documentation/index.vue
-<template />
-
-<script>
-import DropdownMenu from '@/components/Share/DropdownMenu'
-
-export default {
-  name: 'Documentation',
-  components: { DropdownMenu },
-  data() {
-    return {
-      articleList: [
-      ]
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.documentation-container {
-  margin: 50px;
-  display: flex;
-  flex-wrap: wrap;
-  .document-btn {
-    margin-left: 50px;
-    display: block;
-    cursor: pointer;
-    background: black;
-    color: white;
-    height: 60px;
-    width: 200px;
-    margin-bottom: 16px;
-    line-height: 60px;
-    font-size: 20px;
-    text-align: center;
-  }
-}
-</style>
--- a/src/views/error-page/401.vue
+++ b/src/views/error-page/401.vue
@@ -18,10 +18,6 @@
              回首页
            </router-link>
          </li>
-          <li class="link-type">
-            <a href="https://www.taobao.com/">随便看看</a>
-          </li>
-          <li><a href="#" @click.prevent="dialogVisible=true">点我看图</a></li>
        </ul>
      </el-col>
      <el-col :span="12">

--- a/src/views/error-page/404.vue
+++ b/src/views/error-page/404.vue
@@ -8,13 +8,7 @@
        <img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404">
      </div>
      <div class="bullshit">
-        <div class="bullshit__oops">OOPS!</div>
-        <div class="bullshit__info">All rights reserved
-          <a style="color:#20a0ff" href="https://wallstreetcn.com" target="_blank">wallstreetcn</a>
-        </div>
-        <div class="bullshit__headline">{{ message }}</div>
-        <div class="bullshit__info">Please check that the URL you entered is correct, or click the button below to return to the homepage.</div>
-        <a href="" class="bullshit__return-home">Back to home</a>
+        <a href="" class="bullshit__return-home">返回首页</a>
      </div>
    </div>
  </div>

--- a/src/views/excel/export-excel.vue
+++ b/src/views/excel/export-excel.vue
@@ -6,10 +6,10 @@
      <AutoWidthOption v-model="autoWidth" />
      <BookTypeOption v-model="bookType" />
      <el-button :loading="downloadLoading" style="margin:0 0 20px 20px;" type="primary" icon="el-icon-document" @click="handleDownload">
-        {{ $t('excel.export') }} Excel
+        导出 Excel
      </el-button>
      <a href="https://panjiachen.github.io/vue-element-admin-site/feature/component/excel.html" target="_blank" style="margin-left:15px;">
-        <el-tag type="info">Documentation</el-tag>
+        <el-tag type="info">文档</el-tag>
      </a>
    </div>


--- a/src/views/file/file-download.vue
+++ b/src/views/file/file-download.vue
+<template>
+  <div class="download">
+    <aside>
+      1.直接文件路径下载，通过a标签下载，
+      <p>
+        文件路径：https://github.com//PanJiaChen/vue-element-admin/archive/master.zip
+        <a href="https://github.com//PanJiaChen/vue-element-admin/archive/master.zip" download>下载</a>
+      </p>
+      <pre>
+            &lt;a href="https://github.com//PanJiaChen/vue-element-admin/archive/master.zip" download&gt;下载&lt;/a&gt;
+      </pre>
+    </aside>
+    <aside>
+      2.接口返回二进制流，通过blob方法生成文件路径下载，没有接口的列子，详细例子参照该页面的源码
+      <el-button style="margin-left: 20px" type="primary" size="small" @click="dlFile">下载</el-button>
+
+      <p>接口api配置需要 在responseType:'blob</p>
+      <p>{</p>
+      <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: 'https://github.com//PanJiaChen/vue-element-admin/archive/master.zip',</p>
+      <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;method: 'get',</p>
+      <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;responseType: 'blob'</p>
+      <p>}</p>
+    </aside>
+  </div>
+
+</template>
+
+<script>
+import { downloadFile } from '../../utils/index'
+
+export default {
+  name: 'FileDownload',
+  data() {
+  },
+  methods: {
+    // 下载文件
+    dlFile() {
+      let blob // 二进制流
+      let fileName // 文件名称
+      downloadFile(blob, fileName)
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
--- a/src/views/file/file-upload.vue
+++ b/src/views/file/file-upload.vue
+<template>
+  <div class="upload">
+    <aside>
+      本demo基于
+      <a href="https://element.eleme.cn/#/zh-CN/component/upload" target="_blank">element的upload组件</a>
+    </aside>
+    <div class="el">
+      <el-upload
+        class="upload-demo"
+        action="https://jsonplaceholder.typicode.com/posts/"
+        :on-preview="handlePreview"
+        :on-remove="handleRemove"
+        :before-remove="beforeRemove"
+        multiple
+        :limit="3"
+        :on-exceed="handleExceed"
+        :file-list="fileList"
+      >
+        <el-button size="small" type="primary">点击上传</el-button>
+        <div slot="tip" class="el-upload__tip">选择文件以二进制流上传文件</div>
+      </el-upload>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'FileUpload',
+  data() {
+    return {
+      fileList: [{
+        name: 'food.jpeg',
+        url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
+      }, {
+        name: 'food2.jpeg',
+        url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
+      }]
+    }
+  },
+  methods: {
+    handleRemove(file, fileList) {
+      console.log(file, fileList)
+    },
+    handlePreview(file) {
+      console.log(file)
+    },
+    handleExceed(files, fileList) {
+      this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`)
+    },
+    beforeRemove(file, fileList) {
+      return this.$confirm(`确定移除 ${file.name}？`)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  p {
+    text-align: center;
+  }
+  .el{
+    width: 600px;
+    padding:0 100px;
+  }
+</style>
--- a/src/views/file/pdf-view.vue
+++ b/src/views/file/pdf-view.vue
+<template>
+  <div class="pdf-view">
+    <p class="title">PDF预览</p>
+    <p class="arrow">
+      <!--      上一页-->
+      <el-button size="small" type="primary" @click="changePdfPage(0)">
+        下一页
+      </el-button>
+      {{ currentPage }} / {{ pageCount }}
+      <!--      下一页-->
+      <el-button size="small" type="primary" @click="changePdfPage(1)">
+        下一页
+      </el-button>
+    </p>
+    <pdf
+      ref="pdf"
+      :src="src"
+      :page="currentPage"
+      @progress="loadedProcess"
+      @num-pages="pageCount = $event"
+      @page-loaded="currentPage= $event"
+      @loaded="loadPdfHandler"
+    />
+    <div v-if="percentage < 100" class="process">
+      <el-progress type="circle" :percentage="percentage" />
+    </div>
+  </div>
+</template>
+
+<script>
+import pdf from 'vue-pdf'
+
+export default {
+  name: 'IndexVue',
+  components: { pdf },
+  data() {
+    return {
+      src: 'http://mozilla.github.io/pdf.js/web/compressed.tracemonkey-pldi-09.pdf',
+      currentPage: 1,
+      pageCount: 0,
+      percentage: 0
+    }
+  },
+  created() {
+    // this.src = pdf.createLoadingTask(this.src)
+  },
+  methods: {
+    // 改变PDF页码,val传过来区分上一页下一页的值,0上一页,1下一页
+    changePdfPage(val) {
+      // console.log(val)
+      if (val === 0 && this.currentPage > 1) {
+        this.currentPage--
+        // console.log(this.currentPage)
+      }
+      if (val === 1 && this.currentPage < this.pageCount) {
+        this.currentPage++
+        // console.log(this.currentPage)
+      }
+    },
+
+    // pdf加载时
+    loadPdfHandler(e) {
+      this.currentPage = 1 // 加载的时候先加载第一页
+    },
+
+    // 加载中进度条
+    loadedProcess(e) {
+      console.log(e)
+      this.percentage = Number((100 * e).toFixed(1))
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .title {
+    text-align: center;
+    font-weight: bold;
+  }
+
+  .arrow,.process {
+    text-align: center;
+  }
+  .process{
+    margin: 60px;
+  }
+
+  pdf > span {
+    width: 100%;
+  }
+</style>
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -6,6 +6,7 @@
        <h3 class="title">
          {{ $t('login.title') }}
        </h3>
+        <lang-select class="set-language" />
      </div>

      <el-form-item prop="username">
@@ -65,6 +66,13 @@
      </div>
    </el-form>

+    <el-dialog :title="$t('login.thirdparty')" :visible.sync="showDialog">
+      {{ $t('login.thirdpartyTips') }}
+      <br>
+      <br>
+      <br>
+      <social-sign />
+    </el-dialog>
  </div>
 </template>


--- a/vue.config.js
+++ b/vue.config.js
@@ -8,12 +8,22 @@ function resolve(dir) {

 const name = defaultSettings.title || 'vue Element Admin' // page title

-
+// If your port is set to 80,
+// use administrator privileges to execute the command line.
+// For example, Mac: sudo npm run
+// You can change the port by the following method:
+// port = 9527 npm run dev OR npm run dev --port = 9527
 const port = process.env.port || process.env.npm_config_port || 9527 // dev port

 // All configuration item explanations can be find in https://cli.vuejs.org/config/
 module.exports = {
-
+  /**
+   * You will need to set publicPath if you plan to deploy your site under a sub path,
+   * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
+   * then publicPath should be set to "/bar/".
+   * In most cases please use '/' !!!
+   * Detail: https://cli.vuejs.org/config/#publicpath
+   */
  publicPath: '/',
  outputDir: 'dist',
  assetsDir: 'static',