docs/i18n

mock/article.js

@@ -3,7 +3,7 @@ import Mock from 'mockjs'
 const List = []
 const count = 100
 
-const baseContent = '<p>我是测试数据我是测试数据</p><p><img src="https://wpimg.wallstcn.com/4c69009c-0fd4-4153-b112-6cb53d1cf943"></p>'
+const baseContent = '<p>I am testing data, I am testing data.</p><p><img src="https://wpimg.wallstcn.com/4c69009c-0fd4-4153-b112-6cb53d1cf943"></p>'
 const image_uri = 'https://wpimg.wallstcn.com/e4558086-631c-425c-9430-56ffb46e70b3'
 
 for (let i = 0; i < count; i++) {

src/components/BackToTop/index.vue

@@ -1,12 +1,7 @@
 <template>
   <transition :name="transitionName">
     <div v-show="visible" :style="customStyle" class="back-to-ceiling" @click="backToTop">
-      <svg width="16" height="16" viewBox="0 0 17 17" xmlns="http://www.w3.org/2000/svg" class="Icon Icon--backToTopArrow" aria-hidden="true" style="height: 16px; width: 16px;">
-        <title>回到顶部</title>
-        <g>
-          <path d="M12.036 15.59c0 .55-.453.995-.997.995H5.032c-.55 0-.997-.445-.997-.996V8.584H1.03c-1.1 0-1.36-.633-.578-1.416L7.33.29c.39-.39 1.026-.385 1.412 0l6.878 6.88c.782.78.523 1.415-.58 1.415h-3.004v7.004z" fill-rule="evenodd" />
-        </g>
-      </svg>
+      <svg width="16" height="16" viewBox="0 0 17 17" xmlns="http://www.w3.org/2000/svg" class="Icon Icon--backToTopArrow" aria-hidden="true" style="height:16px;width:16px"><path d="M12.036 15.59a1 1 0 0 1-.997.995H5.032a.996.996 0 0 1-.997-.996V8.584H1.03c-1.1 0-1.36-.633-.578-1.416L7.33.29a1.003 1.003 0 0 1 1.412 0l6.878 6.88c.782.78.523 1.415-.58 1.415h-3.004v7.004z" /></svg>
     </div>
   </transition>
 </template>

src/components/JsonEditor/index.vue

@@ -25,8 +25,8 @@ export default {
   },
   watch: {
     value(value) {
-      const editor_value = this.jsonEditor.getValue()
-      if (value !== editor_value) {
+      const editorValue = this.jsonEditor.getValue()
+      if (value !== editorValue) {
         this.jsonEditor.setValue(JSON.stringify(this.value, null, 2))
       }
     }

src/components/Kanban/index.vue

@@ -15,6 +15,7 @@
     </draggable>
   </div>
 </template>
+
 <script>
 import draggable from 'vuedraggable'
 

src/components/ThemePicker/index.vue

@@ -8,7 +8,6 @@
 </template>
 
 <script>
-
 const version = require('element-ui/package.json').version // element-ui version from node_modules
 const ORIGINAL_THEME = '#409EFF' // default color
 

src/components/Tinymce/components/EditorImage.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="upload-container">
     <el-button :style="{background:color,borderColor:color}" icon="el-icon-upload" size="mini" type="primary" @click=" dialogVisible=true">
-      上传图片
+      upload
     </el-button>
     <el-dialog :visible.sync="dialogVisible">
       <el-upload
@@ -16,14 +16,14 @@
         list-type="picture-card"
       >
         <el-button size="small" type="primary">
-          点击上传
+          Click upload
         </el-button>
       </el-upload>
       <el-button @click="dialogVisible = false">
-        取 消
+        Cancel
       </el-button>
       <el-button type="primary" @click="handleSubmit">
-        确 定
+        Confirm
       </el-button>
     </el-dialog>
   </div>
@@ -54,7 +54,7 @@ export default {
     handleSubmit() {
       const arr = Object.keys(this.listObj).map(v => this.listObj[v])
       if (!this.checkAllSuccess()) {
-        this.$message('请等待所有图片上传成功 或 出现了网络问题，请刷新页面重新上传！')
+        this.$message('Please wait for all images to be uploaded successfully. If there is a network problem, please refresh the page and upload again!')
         return
       }
       this.$emit('successCBK', arr)

src/components/Upload/SingleImage.vue

@@ -26,7 +26,6 @@
 </template>
 
 <script>
-// 预览效果见付费文章
 import { getToken } from '@/api/qiniu'
 
 export default {

src/directive/el-table/adaptive.js

@@ -1,4 +1,3 @@
-
 import { addResizeListener, removeResizeListener } from 'element-ui/src/utils/resize-event'
 
 /**

src/directive/el-table/index.js

@@ -1,4 +1,3 @@
-
 import adaptive from './adaptive'
 
 const install = function(Vue) {

src/directive/permission/permission.js

@@ -1,4 +1,3 @@
-
 import store from '@/store'
 
 export default {

src/filters/index.js

@@ -1,4 +1,4 @@
-// set function parseTime,formatTime to filter
+// import parseTime, formatTime and set to filter
 export { parseTime, formatTime } from '@/utils'
 
 /**

src/lang/en.js

@@ -132,6 +132,9 @@ export default {
     cancel: 'Cancel',
     confirm: 'Confirm'
   },
+  example: {
+    warning: 'Creating and editing pages cannot be cached by keep-alive because keep-alive include does not currently support caching based on routes, so it is currently cached based on component name. If you want to achieve a similar caching effect, you can use a browser caching scheme such as localStorage. Or do not use keep-alive include to cache all pages directly. See details'
+  },
   errorLog: {
     tips: 'Please click the bug icon in the upper right corner',
     description: 'Now the management system are basically the form of the spa, it enhances the user experience, but it also increases the possibility of page problems, a small negligence may lead to the entire page deadlock. Fortunately Vue provides a way to catch handling exceptions, where you can handle errors or report exceptions.',

src/lang/es.js

@@ -132,6 +132,9 @@ export default {
     cancel: 'Cancelar',
     confirm: 'Confirmar'
   },
+  example: {
+    warning: 'Creating and editing pages cannot be cached by keep-alive because keep-alive include does not currently support caching based on routes, so it is currently cached based on component name. If you want to achieve a similar caching effect, you can use a browser caching scheme such as localStorage. Or do not use keep-alive include to cache all pages directly. See details'
+  },
   errorLog: {
     tips: 'Please click the bug icon in the upper right corner',
     description: 'Now the management system are basically the form of the spa, it enhances the user experience, but it also increases the possibility of page problems, a small negligence may lead to the entire page deadlock. Fortunately Vue provides a way to catch handling exceptions, where you can handle errors or report exceptions.',

src/lang/zh.js

@@ -132,6 +132,9 @@ export default {
     cancel: '取 消',
     confirm: '确 定'
   },
+  example: {
+    warning: '创建和编辑页面是不能被 keep-alive 缓存的，因为keep-alive 的 include 目前不支持根据路由来缓存，所以目前都是基于 component name 来进行缓存的。如果你想类似的实现缓存效果，可以使用 localStorage 等浏览器缓存方案。或者不要使用 keep-alive 的 include，直接缓存所有页面。详情见'
+  },
   errorLog: {
     tips: '请点击右上角bug小图标',
     description: '现在的管理后台基本都是spa的形式了，它增强了用户体验，但同时也会增加页面出问题的可能性，可能一个小小的疏忽就导致整个页面的死锁。好在 Vue 官网提供了一个方法来捕获处理异常，你可以在其中进行错误处理或者异常上报。',

src/main.js

@@ -2,7 +2,7 @@ import Vue from 'vue'
 
 import Cookies from 'js-cookie'
 
-import 'normalize.css/normalize.css' // A modern alternative to CSS resets
+import 'normalize.css/normalize.css' // a modern alternative to CSS resets
 
 import Element from 'element-ui'
 import './styles/element-variables.scss'
@@ -13,24 +13,28 @@ import App from './App'
 import store from './store'
 import router from './router'
 
-import i18n from './lang' // Internationalization
+import i18n from './lang' // internationalization
 import './icons' // icon
 import './permission' // permission control
 import './utils/error-log' // error log
 
 import * as filters from './filters' // global filters
 
-import { mockXHR } from '../mock' // simulation data
-
-// mock api in github pages site build
-if (process.env.NODE_ENV === 'production') { mockXHR() }
+/**
+ * If you don't want to use mock-server
+ * you want to use mockjs for request interception
+ * you can execute:
+ *
+ * import { mockXHR } from '../mock'
+ * mockXHR()
+ */
 
 Vue.use(Element, {
   size: Cookies.get('size') || 'medium', // set element-ui default size
   i18n: (key, value) => i18n.t(key, value)
 })
 
-// register global utility filters.
+// register global utility filters
 Object.keys(filters).forEach(key => {
   Vue.filter(key, filters[key])
 })

src/router/modules/components.js

@@ -1,4 +1,4 @@
-/** When your routing table is too long, you can split it into small modules**/
+/** When your routing table is too long, you can split it into small modules **/
 
 import Layout from '@/layout'
 

src/router/modules/nested.js

@@ -1,4 +1,4 @@
-/** When your routing table is too long, you can split it into small modules**/
+/** When your routing table is too long, you can split it into small modules **/
 
 import Layout from '@/layout'
 

src/router/modules/table.js

@@ -1,4 +1,4 @@
-/** When your routing table is too long, you can split it into small modules**/
+/** When your routing table is too long, you can split it into small modules **/
 
 import Layout from '@/layout'
 

src/store/modules/permission.js

@@ -1,7 +1,7 @@
 import { asyncRoutes, constantRoutes } from '@/router'
 
 /**
- * 通过meta.role判断是否与当前用户权限匹配
+ * Use meta.role to determine if the current user has permission
  * @param roles
  * @param route
  */
@@ -14,7 +14,7 @@ function hasPermission(roles, route) {
 }
 
 /**
- * 递归过滤异步路由表，返回符合用户角色权限的路由表
+ * Filter asynchronous routing tables by recursion
  * @param routes asyncRoutes
  * @param roles
  */

src/styles/element-ui.scss

@@ -1,4 +1,4 @@
-//覆盖一些element-ui样式
+// cover some element-ui styles
 
 .el-breadcrumb__inner,
 .el-breadcrumb__inner a {

src/styles/index.scss

@@ -96,14 +96,18 @@ div:focus {
   }
 }
 
-code {
+aside {
   background: #eef1f6;
-  padding: 15px 16px;
+  padding: 8px 24px;
   margin-bottom: 20px;
+  border-radius: 2px;
   display: block;
-  line-height: 36px;
-  font-size: 15px;
-  font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
+  line-height: 32px;
+  font-size: 16px;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+  color: #2c3e50;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
 
   a {
     color: #337ab7;
@@ -115,20 +119,6 @@ code {
   }
 }
 
-.warn-content {
-  background: rgba(66, 185, 131, .1);
-  border-radius: 2px;
-  padding: 16px;
-  padding: 1rem;
-  line-height: 1.6rem;
-  word-spacing: .05rem;
-
-  a {
-    color: #42b983;
-    font-weight: 600;
-  }
-}
-
 //main-container全局样式
 .app-container {
   padding: 20px;

src/styles/sidebar.scss

@@ -1,14 +1,12 @@
 #app {
 
-  // 主体区域 Main container
   .main-container {
     min-height: 100%;
     transition: margin-left .28s;
     margin-left: $sideBarWidth;
     position: relative;
   }
 
-  // 侧边栏 Sidebar container
   .sidebar-container {
     transition: width 0.28s;
     width: $sideBarWidth !important;
@@ -22,7 +20,7 @@
     z-index: 1001;
     overflow: hidden;
 
-    //reset element-ui css
+    // reset element-ui css
     .horizontal-collapse-transition {
       transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
     }
@@ -149,7 +147,7 @@
     min-width: $sideBarWidth !important;
   }
 
-  // 适配移动端, Mobile responsive
+  // mobile responsive
   .mobile {
     .main-container {
       margin-left: 0px;

src/styles/transition.scss

@@ -1,6 +1,6 @@
-//global transition css
+// global transition css
 
-/*fade*/
+/* fade */
 .fade-enter-active,
 .fade-leave-active {
   transition: opacity 0.28s;
@@ -11,7 +11,7 @@
   opacity: 0;
 }
 
-/*fade-transform*/
+/* fade-transform */
 .fade-transform-leave-active,
 .fade-transform-enter-active {
   transition: all .5s;
@@ -27,7 +27,7 @@
   transform: translateX(30px);
 }
 
-/*breadcrumb transition*/
+/* breadcrumb transition */
 .breadcrumb-enter-active,
 .breadcrumb-leave-active {
   transition: all .5s;

src/styles/variables.scss

@@ -8,10 +8,10 @@ $tiffany: #4AB7BD;
 $yellow:#FEC171;
 $panGreen: #30B08F;
 
-//sidebar
+// sidebar
 $menuText:#bfcbd9;
 $menuActiveText:#409EFF;
-$subMenuActiveText:#f4f4f5; //https://github.com/ElemeFE/element/issues/12951
+$subMenuActiveText:#f4f4f5; // https://github.com/ElemeFE/element/issues/12951
 
 $menuBg:#304156;
 $menuHover:#263445;

src/utils/error-log.js

@@ -4,10 +4,10 @@ import { isString, isArray } from '@/utils/validate'
 import settings from '@/settings'
 
 // you can set in settings.js
-// errorLog:'production' | ['production','development']
+// errorLog:'production' | ['production', 'development']
 const { errorLog: needErrorLog } = settings
 
-function checkNeed(arg) {
+function checkNeed() {
   const env = process.env.NODE_ENV
   if (isString(needErrorLog)) {
     return env === needErrorLog