Merge pull request #1 from PanJiaChen/master

update

README.es.md

@@ -51,11 +51,11 @@ Vue Element Admin es una solución práctica basada en la nueva plataforma de de
 - 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**
+**Después de la versión `v4.1.0+`, la rama por defecto master no tendrá soporte para i18n. Por favor utilice la rama [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).**
+**Este proyecto no está soportado para versiones antigüas de navegadores (ej. IE).**
 
 ## Preparación
 
@@ -64,13 +64,13 @@ Entendiendo y aprendiendo esto pudiera ayudarle con su proyecto.
 
 [![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/PanJiaChen/vue-element-admin/tree/CodeSandbox)
 
- <p align="center">
+<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)
+Sea un patrocinante y coloque su logo en nuestro LEEME en GitHub con un enlace directo a su 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>
 
@@ -79,25 +79,28 @@ Se un patrocinante y pon tu logo en nuestro README on GitHub con un enlace direc
 ```
 - Iniciar / Cerrar Sesión
 
-- Permisos de Authentication
+- Permisos de Autenticación
   - 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
+  - Desarrollo (dev)
+  - sit
+  - Escenario de pruebas (stage),
+  - Producción (prod)
 
 - Características Globales
   - I18n
   - Temas dinámicos
-  - Dynamic sidebar (soporte a rutas multi-nivel)
+  - Menu lateral dinámico (soporte a rutas multi-nivel)
   - Barra de rutas dinámica
-  - Tags-view (Tab page Support right-click operation)
+  - Tags-view (Pestañas de página, Soporta operación de clic derecho)
   - Svg Sprite
   - Datos de simulación con Mock
   - Pantalla completa
-  - Responsive Sidebar
+  - Menu lateral responsivo
 
 - Editor
   - Editor de Texto Enriquecido
@@ -108,7 +111,7 @@ Se un patrocinante y pon tu logo en nuestro README on GitHub con un enlace direc
   - Exportación a Excel
   - Carga de Excel
   - Visualización de Excel
-  - Exportación como zip
+  - Exportación como ZIP
 
 - Tabla
   - Tabla Dinámica
@@ -137,7 +140,7 @@ Se un patrocinante y pon tu logo en nuestro README on GitHub con un enlace direc
 - Página de Guías
 - ECharts (Gráficos)
 - Portapapeles
-- Convertidor de Markdown a html
+- Convertidor de Markdown a HTML
 ```
 
 ## Iniciando
@@ -210,7 +213,7 @@ 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
+| IE10, IE11, Edge | últimas 2 versiones | últimas 2 versiones | últimas 2 versiones |
 
 ## Licencia
 

README.ja.md

@@ -61,7 +61,7 @@
 
 [![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/PanJiaChen/vue-element-admin/tree/CodeSandbox)
 
- <p align="center">
+<p align="center">
   <img width="900" src="https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png">
 </p>
 
@@ -83,7 +83,10 @@ Become a sponsor and get your logo on our README on GitHub with a link to your s
   - 外部IDでログイン
 
 - 複数環境デプロイ
-  - dev sit stage prod
+  - dev
+  - sit
+  - stage
+  - prod
 
 - 共通機能
   - 多言語切替
@@ -206,7 +209,7 @@ 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
+| IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions |
 
 ## License
 

README.md

@@ -64,7 +64,7 @@ Understanding and learning this knowledge in advance will greatly help the use o
 
 [![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/PanJiaChen/vue-element-admin/tree/CodeSandbox)
 
- <p align="center">
+<p align="center">
   <img width="900" src="https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png">
 </p>
 
@@ -86,7 +86,10 @@ Become a sponsor and get your logo on our README on GitHub with a link to your s
   - Two-step login
 
 - Multi-environment build
-  - dev sit stage prod
+  - Develop (dev)
+  - sit
+  - Stage Test (stage)
+  - Production (prod)
 
 - Global Features
   - I18n
@@ -210,7 +213,7 @@ 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
+| IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions |
 
 ## License
 

README.zh-CN.md

@@ -79,7 +79,7 @@
 
 [![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/PanJiaChen/vue-element-admin/tree/CodeSandbox)
 
- <p align="center">
+<p align="center">
   <img width="900" src="https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png">
 </p>
 
@@ -101,7 +101,10 @@ Become a sponsor and get your logo on our README on GitHub with a link to your s
   - 二步登录
 
 - 多环境发布
-  - dev sit stage prod
+  - dev
+  - sit
+  - stage
+  - prod
 
 - 全局功能
   - 国际化多语言
@@ -233,7 +236,7 @@ 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
+| IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions |
 
 ## License
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-element-admin",
-  "version": "4.2.1",
+  "version": "4.3.0",
   "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>",
   "license": "MIT",
@@ -94,9 +94,9 @@
     "husky": "1.3.1",
     "lint-staged": "8.1.5",
     "mockjs": "1.0.1-beta3",
-    "node-sass": "^4.9.0",
     "plop": "2.3.0",
     "runjs": "^4.3.2",
+    "sass": "^1.26.2",
     "sass-loader": "^7.1.0",
     "script-ext-html-webpack-plugin": "2.1.3",
     "serve-static": "^1.13.2",

src/components/DragSelect/index.vue

@@ -48,14 +48,18 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
-.drag-select >>> .sortable-ghost {
+.drag-select {
+  ::v-deep {
+    .sortable-ghost {
       opacity: .8;
-  color: #fff!important;
+      color: #fff !important;
-  background: #42b983!important;
+      background: #42b983 !important;
-}
+    }
 
-.drag-select >>> .el-tag {
+    .el-tag {
       cursor: pointer;
+    }
+  }
 }
 </style>

src/components/HeaderSearch/index.vue

@@ -159,7 +159,7 @@ export default {
     display: inline-block;
     vertical-align: middle;
 
-    /deep/ .el-input__inner {
+    ::v-deep .el-input__inner {
       border-radius: 0;
       border: 0;
       padding-left: 0;

src/components/JsonEditor/index.vue

@@ -54,19 +54,24 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
-.json-editor{
+.json-editor {
   height: 100%;
   position: relative;
-}
+
-.json-editor >>> .CodeMirror {
+  ::v-deep {
+    .CodeMirror {
       height: auto;
       min-height: 300px;
-}
+    }
-.json-editor >>> .CodeMirror-scroll{
+
+    .CodeMirror-scroll {
       min-height: 300px;
-}
+    }
-.json-editor >>> .cm-s-rubyblue span.cm-string {
+
+    .cm-s-rubyblue span.cm-string {
       color: #F08047;
+    }
+  }
 }
 </style>

src/components/Tinymce/components/EditorImage.vue

@@ -104,7 +104,7 @@ export default {
 <style lang="scss" scoped>
 .editor-slide-upload {
   margin-bottom: 20px;
-  /deep/ .el-upload--picture-card {
+  ::v-deep .el-upload--picture-card {
     width: 100%;
   }
 }

src/components/Tinymce/index.vue

@@ -213,28 +213,37 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .tinymce-container {
   position: relative;
   line-height: normal;
 }
-.tinymce-container>>>.mce-fullscreen {
+
+.tinymce-container {
+  ::v-deep {
+    .mce-fullscreen {
       z-index: 10000;
+    }
+  }
 }
+
 .tinymce-textarea {
   visibility: hidden;
   z-index: -1;
 }
+
 .editor-custom-btn-container {
   position: absolute;
   right: 4px;
   top: 4px;
   /*z-index: 2005;*/
 }
+
 .fullscreen .editor-custom-btn-container {
   z-index: 10000;
   position: fixed;
 }
+
 .editor-upload-btn {
   display: inline-block;
 }

src/layout/components/TagsView/ScrollPane.vue

@@ -82,7 +82,7 @@ export default {
   position: relative;
   overflow: hidden;
   width: 100%;
-  /deep/ {
+  ::v-deep {
     .el-scrollbar__bar {
       bottom: 0px;
     }

src/views/components-demo/tinymce.vue

@@ -2,7 +2,7 @@
   <div class="components-container">
     <aside>
       Rich text is a core feature of the management backend, but at the same time it is a place with lots of pits. In the process of selecting rich texts, I also took a lot of detours. The common rich texts on the market have been basically used, and I finally chose Tinymce. See the more detailed rich text comparison and introduction.
-      <a target="_blank" class="link-type" href="https://panjiachen.github.io/vue-element-admin-site/component/rich-editor.html">Documentation</a>
+      <a target="_blank" class="link-type" href="https://panjiachen.github.io/vue-element-admin-site/feature/component/rich-editor.html">Documentation</a>
     </aside>
     <div>
       <tinymce v-model="content" :height="300" />

src/views/dashboard/admin/components/BoxCard.vue

@@ -101,7 +101,7 @@ export default {
     background-color: #fff;
     margin: auto;
     box-shadow: none!important;
-    /deep/ .pan-info {
+    ::v-deep .pan-info {
       box-shadow: none!important;
     }
   }

src/views/example/components/ArticleDetail.vue

@@ -277,7 +277,7 @@ export default {
   }
 }
 
-.article-textarea /deep/ {
+.article-textarea ::v-deep {
   textarea {
     padding-right: 40px;
     resize: none;

src/views/permission/directive.vue

@@ -91,7 +91,7 @@ export default {
 
 <style lang="scss" scoped>
 .app-container {
-  /deep/ .permission-alert {
+  ::v-deep .permission-alert {
     width: 320px;
     margin-top: 15px;
     background-color: #f0f9eb;
@@ -100,10 +100,10 @@ export default {
     border-radius: 4px;
     display: inline-block;
   }
-  /deep/ .permission-sourceCode {
+  ::v-deep .permission-sourceCode {
     margin-left: 15px;
   }
-  /deep/ .permission-tag {
+  ::v-deep .permission-tag {
     background-color: #ecf5ff;
   }
 }