init

bin/index.js

@@ -0,0 +1,52 @@
+#!/usr/bin/env node
+
+'use strict'
+
+const checker = require('../lib/checkSystem.js')
+const colors = require('colors')
+
+// set color theme
+colors.setTheme({
+  success: 'green',
+  info: 'grey',
+  warn: 'yellow',
+  error: 'red',
+  boldWarn: ['bold', 'yellow'],
+  boldUnderlineSuccess: ['bold', 'underline', 'green'],
+  boldUnderlineError: ['bold', 'underline', 'red']
+})
+
+console.log('Checking versions...'.info, '\n')
+
+checker(process.argv[2]).then((result) => {
+  // check if the process should exit prematurely
+  if (result.status != 0) {
+    console.log(colors[result.message.type](result.message.text))
+    process.exit(result.status)
+  }
+
+  // print out results for each package
+  result.packages.forEach((p) => {
+    if (p.type === 'success') {
+      console.log(('✔ ' + colors.bold(p.name) + ' was validated with ' + p.expectedVersion + '.').success)
+    } else if (p.type === 'warn') {
+      console.log((colors.bold(p.name) + ' was expected, but no validator found!').warn)
+    } else if (p.type === 'error' && p.commandError) {
+      console.log(('✘ Error validating ' + colors.bold(p.name) + ': ' + p.commandError).error)
+    } else if (p.type === 'error' && !p.commandError) {
+      console.log((
+        '✘ ' + colors.bold(p.name) +
+                ' version is incorrect! Expected ' +
+                p.expectedVersion + ' but was ' + p.foundVersion + '.'
+      ).error)
+    }
+  })
+
+  // print out a summary message
+  if (result.message.type === 'success') {
+    console.log('\n', result.message.text.boldUnderlineSuccess)
+  } else {
+    console.log('\n', result.message.text.boldUnderlineError)
+    process.exit(1)
+  }
+})

build/index.js

@@ -5,7 +5,7 @@ const rawArgv = process.argv.slice(2)
 const args = rawArgv.join(' ')
 
 if (process.env.npm_config_preview || rawArgv.includes('--preview')) {
-  run(`vue-cli-service build ${args} --report`)
+  run(`vue-cli-service build ${args}`)
 
   const port = 9526
   const publicPath = config.publicPath
@@ -23,10 +23,7 @@ if (process.env.npm_config_preview || rawArgv.includes('--preview')) {
 
   app.listen(port, function() {
     console.log(
-      chalk.green(`> Preview at  http://localhost:${port}${publicPath}`)
+      chalk.green(`> Listening at  http://localhost:${port}${publicPath}`)
-    )
-    console.log(
-      chalk.green(`> Report at  http://localhost:${port}${publicPath}/report.html`)
     )
   })
 } else {

lib/checkSystem.js

@@ -0,0 +1,122 @@
+'use strict'
+
+const check = function(pathToPackage) {
+  const path = require('path')
+  const Promise = require('bluebird')
+  const exec = Promise.promisify(require('child_process').exec)
+  const _ = require('lodash')
+  const fs = require('fs')
+  const jsonfile = require('jsonfile')
+  const validaterRules = require('./validatorRules')
+  const promiseHelpers = require('./promiseHelpers')
+
+  let engines
+
+  const checkerResult = {
+    status: 0,
+    message: '',
+    packages: []
+  }
+
+  const packageJsonPath = pathToPackage || path.join(process.cwd(), 'package.json')
+  try {
+    fs.accessSync(packageJsonPath)
+    engines = jsonfile.readFileSync(packageJsonPath).engines
+  } catch (ex) {
+    checkerResult.message = {
+      text: '✘ No package.json found in the current directory so I can\'t validate what you need!',
+      type: 'error'
+    }
+    checkerResult.status = -1
+
+    return Promise.resolve(checkerResult)
+  }
+
+  if (!engines) {
+    checkerResult.message = {
+      text: '✘ No engines found in package.json so I can\'t validate what you need!',
+      type: 'error'
+    }
+    checkerResult.status = -1
+
+    return Promise.resolve(checkerResult)
+  }
+
+  const thingsToCheck = Object.getOwnPropertyNames(engines)
+  const validatorPromises = thingsToCheck.map(validate) // run the function over all items.
+
+  return promiseHelpers.allSettled(validatorPromises)
+    .then((inspections) => {
+      const environmentIsValid = _.every(inspections,
+        (inspection) => inspection.isFulfilled() && inspection.value())
+
+      if (environmentIsValid) {
+        checkerResult.message = {
+          text: 'Environment looks good!',
+          type: 'success'
+        }
+      } else {
+        checkerResult.message = {
+          text: 'Environment is invalid!',
+          type: 'error'
+        }
+      }
+      return checkerResult
+    })
+
+  function validate(name) {
+    // find it in the validators
+    const validator = validaterRules[name]
+
+    if (validator === undefined) {
+      checkerResult.packages.push({
+        name: name,
+        validatorFound: false,
+        type: 'warn'
+      })
+      return Promise.resolve(false)
+    }
+
+    // call the validator and pass in the version we expect
+    return execAndCheck(validator, engines[name]).then((results) => {
+      if (results.result) {
+        checkerResult.packages.push({
+          name: name,
+          validatorFound: true,
+          expectedVersion: engines[name],
+          foundVersion: engines[name],
+          type: 'success'
+        })
+      } else {
+        checkerResult.packages.push({
+          name: name,
+          validatorFound: true,
+          expectedVersion: engines[name],
+          foundVersion: results.reason.trim() || 'missing',
+          type: 'error'
+        })
+      }
+
+      return Promise.resolve(results.result)
+    }).catch((error) => {
+      checkerResult.packages.push({
+        name: name,
+        validatorFound: true,
+        expectedVersion: engines[name],
+        commandError: error,
+        type: 'error'
+      })
+      return Promise.reject()
+    })
+  }
+
+  function execAndCheck(validator, expectedVersion) {
+    return exec(validator.versionCheck).then((result) => {
+      return {
+        result: validator.versionValidate(result, expectedVersion),
+        reason: result
+      }
+    }).catch((e) => { throw e })
+  }
+}
+module.exports = check

lib/promiseHelpers.js

@@ -0,0 +1,24 @@
+const Promise = require('bluebird')
+
+/**
+ *  Creates a promise that is resolved when all input promises have been
+ *  settled.  The returned Promise is resolved with an array of
+ *  Promise.Inspection objects.
+ *
+ *  This is the commonly accepted way of implementing allSettled() in Bluebird.
+ *  See:  http://bluebirdjs.com/docs/api/reflect.html
+ *
+ * @param promises - The array of input promises.
+ * @returns {Promise<Promise.Inspection[]>} A promise that will be resolved once
+ * all input Promises have settled. The returned Promise will be resolved with a
+ * corresponding array of Promise.Inspection objects.
+ */
+function allSettled(promises) {
+  'use strict'
+  const wrappedPromises = promises.map((curPromise) => curPromise.reflect())
+  return Promise.all(wrappedPromises)
+}
+
+module.exports = {
+  allSettled: allSettled
+}

lib/validatorRules.js

@@ -0,0 +1,141 @@
+'use strict'
+
+const semver = require('semver')
+
+module.exports = {
+  osx: {
+    versionCheck: 'sw_vers -productVersion',
+    versionValidate:
+            (detectedVersion, expectedVersion) => expectedVersion === detectedVersion.trim()
+  },
+  node: {
+    versionCheck: 'node -v',
+    versionValidate:
+            (detectedVersion, expectedVersion) => semver.satisfies(detectedVersion, expectedVersion)
+  },
+  npm: {
+    versionCheck: 'npm -v',
+    versionValidate:
+            (detectedVersion, expectedVersion) => semver.satisfies(detectedVersion, expectedVersion)
+  },
+  jx: {
+    versionCheck: 'jx -jxv',
+    versionValidate:
+            (result, version) => 'v' + version === result.trim()
+  },
+  cordova: {
+    versionCheck: 'cordova -v',
+    versionValidate:
+            (result, version) => version === result.trim()
+  },
+  appium: {
+    versionCheck: 'appium -v',
+    versionValidate:
+            (result, version) => version === result.trim()
+  },
+  'ios-deploy': {
+    versionCheck: 'ios-deploy -V',
+    versionValidate:
+            (result, version) => version === result.trim()
+  },
+  'ios-sim': {
+    versionCheck: 'ios-sim --version',
+    versionValidate:
+            (result, version) => version === result.trim()
+  },
+  bower: {
+    versionCheck: 'bower -v',
+    versionValidate:
+            (result, version) => semver.satisfies(result, version)
+  },
+  'ios-webkit-debug-proxy': {
+    versionCheck: 'brew list ios-webkit-debug-proxy --versions',
+    versionValidate:
+            (result, version) => result.includes(version)
+
+  },
+  'ideviceinstaller': {
+    versionCheck: 'brew list ideviceinstaller --versions',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  java: {
+    versionCheck: 'javac -version 2>&1',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  ant: {
+    versionCheck: 'ant -version',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  adb: {
+    versionCheck: 'adb version',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  git: {
+    versionCheck: 'git --version',
+    versionValidate:
+            (result, version) => {
+              // http://stackoverflow.com/questions/82064/a-regex-for-version-number-parsing
+              const found = result.match(/(\d+\.)?(\d+\.)?(\d+)/i)
+              return found[0] === version
+            }
+  },
+  windows: {
+    versionCheck: 'ver',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  'gulp-cli': {
+    versionCheck: 'npm list --depth=0 -g |grep gulp-cli',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  cocoapods: {
+    versionCheck: 'pod --version',
+    versionValidate:
+            (result, version) => version === result.trim()
+  },
+  xcodebuild: {
+    versionCheck: 'xcodebuild -version',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  carthage: {
+    versionCheck: 'carthage version',
+    versionValidate:
+            (result, version) => version === result.trim()
+  },
+  xcpretty: {
+    versionCheck: 'xcpretty -v',
+    versionValidate:
+            (result, version) => version === result.trim()
+  },
+  libimobiledevice: {
+    versionCheck: 'brew list --versions |grep libimobiledevice',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  'deviceconsole': {
+    versionCheck: 'npm list --depth=0 -g |grep deviceconsole',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  'check-engine': {
+    versionCheck: 'npm list --depth=0 -g |grep check-engine',
+    versionValidate:
+            (result, version) => result.includes(version)
+  },
+  yarn: {
+    versionCheck: 'yarn -v',
+    versionValidate:
+            (result, version) => semver.satisfies(result, version)
+  },
+  nsp: {
+    versionCheck: 'nsp --version',
+    versionValidate:
+            (result, version) => version === result.trim()
+  }
+}

package.json

@@ -8,7 +8,8 @@
     "dev": "vue-cli-service serve",
     "build:prod": "vue-cli-service build",
     "build:stage": "vue-cli-service build --mode staging",
-    "preview": "node build/index.js --preview",
+    "build:preview": "node build/index.js --preview",
+    "build:report": "node build/index.js --report",
     "lint": "eslint --ext .js,.vue src",
     "test": "npm run lint",
     "test:unit": "vue-cli-service test:unit",
@@ -43,49 +44,48 @@
   "dependencies": {
     "axios": "0.18.0",
     "clipboard": "1.7.1",
-    "codemirror": "5.45.0",
+    "codemirror": "5.44.0",
     "driver.js": "0.9.5",
     "dropzone": "5.5.1",
-    "echarts": "4.2.1",
+    "echarts": "4.1.0",
-    "element-ui": "2.6.3",
+    "element-ui": "2.6.1",
     "file-saver": "2.0.1",
     "fuse.js": "3.4.4",
     "js-cookie": "2.2.0",
     "jsonlint": "1.6.3",
-    "jszip": "3.2.1",
+    "jszip": "3.2.0",
     "normalize.css": "7.0.0",
     "nprogress": "0.2.0",
     "path-to-regexp": "2.4.0",
-    "screenfull": "4.1.0",
+    "screenfull": "4.0.1",
     "showdown": "1.9.0",
-    "sortablejs": "1.8.4",
+    "sortablejs": "1.8.3",
-    "tui-editor": "1.3.3",
+    "tui-editor": "1.3.2",
-    "vue": "2.6.10",
+    "vue": "2.6.8",
     "vue-count-to": "1.0.13",
     "vue-i18n": "7.3.2",
     "vue-router": "3.0.2",
-    "vue-splitpane": "1.0.4",
+    "vue-splitpane": "1.0.2",
-    "vuedraggable": "2.20.0",
+    "vuedraggable": "2.17.0",
     "vuex": "3.1.0",
     "xlsx": "0.14.1"
   },
   "devDependencies": {
     "@babel/core": "7.0.0",
     "@babel/register": "7.0.0",
-    "@vue/cli-plugin-babel": "3.5.1",
+    "@vue/cli-plugin-babel": "3.5.0",
-    "@vue/cli-plugin-unit-jest": "3.5.1",
+    "@vue/cli-plugin-unit-jest": "3.5.0",
-    "@vue/cli-service": "3.5.1",
+    "@vue/cli-service": "3.5.0",
     "@vue/test-utils": "1.0.0-beta.29",
     "babel-core": "7.0.0-bridge.0",
     "babel-eslint": "10.0.1",
     "babel-jest": "23.6.0",
     "chalk": "2.4.2",
     "connect": "3.6.6",
-    "eslint": "5.15.3",
+    "eslint": "5.15.1",
     "eslint-plugin-vue": "5.2.2",
-    "html-webpack-plugin": "3.2.0",
     "husky": "1.3.1",
-    "lint-staged": "8.1.5",
+    "lint-staged": "7.2.2",
     "mockjs": "1.0.1-beta3",
     "node-sass": "^4.9.0",
     "plop": "2.3.0",
@@ -96,7 +96,7 @@
     "serve-static": "^1.13.2",
     "svg-sprite-loader": "4.1.3",
     "svgo": "1.2.0",
-    "vue-template-compiler": "2.6.10"
+    "vue-template-compiler": "2.6.8"
   },
   "engines": {
     "node": ">=8.9",

src/components/Breadcrumb/index.vue

@@ -58,7 +58,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   .app-breadcrumb.el-breadcrumb {
     display: inline-block;
     font-size: 14px;

src/components/DndList/index.vue

@@ -2,7 +2,7 @@
   <div class="dndList">
     <div :style="{width:width1}" class="dndList-list">
       <h3>{{ list1Title }}</h3>
-      <draggable :list="list1" group="article" class="dragArea">
+      <draggable :list="list1" :options="{group:'article'}" class="dragArea">
         <div v-for="element in list1" :key="element.id" class="list-complete-item">
           <div class="list-complete-item-handle">
             {{ element.id }}[{{ element.author }}] {{ element.title }}
@@ -17,7 +17,7 @@
     </div>
     <div :style="{width:width2}" class="dndList-list">
       <h3>{{ list2Title }}</h3>
-      <draggable :list="list2" group="article" class="dragArea">
+      <draggable :list="list2" :options="{group:'article'}" class="dragArea">
         <div v-for="element in list2" :key="element.id" class="list-complete-item">
           <div class="list-complete-item-handle2" @click="pushEle(element)">
             {{ element.id }} [{{ element.author }}] {{ element.title }}
@@ -99,7 +99,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .dndList {
   background: #fff;
   padding-bottom: 40px;

src/components/Kanban/index.vue

@@ -5,7 +5,7 @@
     </div>
     <draggable
       :list="list"
-      v-bind="$attrs"
+      :options="options"
       class="board-column-content"
     >
       <div v-for="element in list" :key="element.id" class="board-item">

src/components/MDinput/index.vue

@@ -197,7 +197,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   // Fonts:
   $font-size-base: 16px;
   $font-size-small: 18px;

src/components/RightPanel/index.vue

@@ -21,7 +21,7 @@ export default {
       type: Boolean
     },
     buttonTop: {
-      default: 250,
+      default: 240,
       type: Number
     }
   },
@@ -77,7 +77,7 @@ export default {
 }
 </style>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .rightPanel-background {
   opacity: 0;
   transition: opacity .3s cubic-bezier(.7, .3, .1, 1);
@@ -108,6 +108,7 @@ export default {
 }
 
 .show {
+
   transition: all .3s cubic-bezier(.7, .3, .1, 1);
 
   .rightPanel-background {

src/components/Share/dropdownMenu.vue

@@ -37,7 +37,7 @@ export default {
 }
 </script>
 
-<style lang="scss" >
+<style rel="stylesheet/scss" lang="scss" >
 $n: 8; //和items.length 相同
 $t: .1s;
 .share-dropdown-menu {

src/components/Tinymce/components/editorImage.vue

@@ -101,7 +101,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .editor-slide-upload {
   margin-bottom: 20px;
   /deep/ .el-upload--picture-card {

src/components/Upload/singleImage.vue

@@ -78,7 +78,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
     @import "~@/styles/mixin.scss";
     .upload-container {
         width: 100%;

src/components/Upload/singleImage2.vue

@@ -76,7 +76,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .upload-container {
   width: 100%;
   height: 100%;

src/components/Upload/singleImage3.vue

@@ -85,7 +85,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 @import "~@/styles/mixin.scss";
 .upload-container {
   width: 100%;

src/lang/en.js

@@ -163,12 +163,5 @@ export default {
     close: 'Close',
     closeOthers: 'Close Others',
     closeAll: 'Close All'
-  },
-  settings: {
-    title: 'Page style setting',
-    theme: 'Theme Color',
-    tagsView: 'Open Tags-View',
-    fixedHeader: 'Fixed Header',
-    sidebarLogo: 'Sidebar Logo'
   }
 }

src/lang/es.js

@@ -163,12 +163,5 @@ export default {
     close: 'Cerrar',
     closeOthers: 'Cerrar otros',
     closeAll: 'Cerrar todos'
-  },
-  settings: {
-    title: 'Page style setting',
-    theme: 'Theme Color',
-    tagsView: 'Open Tags-View',
-    fixedHeader: 'Fixed Header',
-    sidebarLogo: 'Sidebar Logo'
   }
 }

src/lang/zh.js

@@ -163,12 +163,5 @@ export default {
     close: '关闭',
     closeOthers: '关闭其它',
     closeAll: '关闭所有'
-  },
-  settings: {
-    title: '系统布局配置',
-    theme: '主题色',
-    tagsView: '开启 Tags-View',
-    fixedHeader: '固定 Header',
-    sidebarLogo: '侧边栏 Logo'
   }
 }

src/layout/Layout.vue

@@ -57,7 +57,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   @import "~@/styles/mixin.scss";
   @import "~@/styles/variables.scss";
 
@@ -66,13 +66,11 @@ export default {
     position: relative;
     height: 100%;
     width: 100%;
-
+    &.mobile.openSidebar{
-    &.mobile.openSidebar {
       position: fixed;
       top: 0;
     }
   }
-
   .drawer-bg {
     background: #000;
     opacity: 0.3;
@@ -82,21 +80,18 @@ export default {
     position: absolute;
     z-index: 999;
   }
-
+  .fixed-header{
-  .fixed-header {
     position: fixed;
     top: 0;
     right: 0;
     z-index: 9;
     width: calc(100% - #{$sideBarWidth});
-    transition: width 0.28s;
+     transition: width 0.28s;
   }
-
+  .hideSidebar .fixed-header{
-  .hideSidebar .fixed-header {
+     width: calc(100% - 54px)
-    width: calc(100% - 54px)
   }
-
+  .mobile .fixed-header{
-  .mobile .fixed-header {
     width: 100%;
   }
 </style>

src/layout/components/AppMain.vue

@@ -22,9 +22,9 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .app-main {
-  /* 50= navbar  50  */
+  /*50= navbar  50  */
   min-height: calc(100vh - 50px);
   width: 100%;
   position: relative;
@@ -32,17 +32,17 @@ export default {
 }
 
 .fixed-header+.app-main {
-  padding-top: 50px;
+  margin-top: 50px;
 }
 
 .hasTagsView {
   .app-main {
-    /* 84 = navbar + tags-view = 50 + 34 */
+    /*84 = navbar + tags-view = 50 + 34 */
     min-height: calc(100vh - 84px);
   }
 
   .fixed-header+.app-main {
-    padding-top: 84px;
+    margin-top: 80px;
   }
 }
 </style>

src/layout/components/Navbar.vue

@@ -85,7 +85,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .hasTagsView {
   .navbar {
     border-bottom: none;
@@ -105,7 +105,6 @@ export default {
     float: left;
     cursor: pointer;
     transition: background .3s;
-    -webkit-tap-highlight-color:transparent;
 
     &:hover {
       background: rgba(0, 0, 0, .025)

src/layout/components/Settings/index.vue

@@ -1,28 +1,25 @@
 <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;" />
+        <theme-picker style="float: right;height: 26px;margin: -3px 5px 0 0;" />
       </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>
-        <el-switch v-model="sidebarLogo" class="drawer-switch" />
-      </div>
-
     </div>
   </div>
 </template>
@@ -33,7 +30,9 @@ import ThemePicker from '@/components/ThemePicker'
 export default {
   components: { ThemePicker },
   data() {
-    return {}
+    return {
+      sidebarLogo: true
+    }
   },
   computed: {
     fixedHeader: {
@@ -57,23 +56,12 @@ export default {
           value: val
         })
       }
-    },
-    sidebarLogo: {
-      get() {
-        return this.$store.state.settings.sidebarLogo
-      },
-      set(val) {
-        this.$store.dispatch('settings/changeSetting', {
-          key: 'sidebarLogo',
-          value: val
-        })
-      }
     }
   }
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .drawer-container {
   padding: 24px;
   font-size: 14px;

src/layout/components/Sidebar/Logo.vue

@@ -1,82 +0,0 @@
-<template>
-  <div class="sidebar-logo-container" :class="{'collapse':collapse}">
-    <transition name="sidebarLogoFade">
-      <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo">
-        <h1 v-else class="sidebar-title">{{ title }} </h1>
-      </router-link>
-      <router-link v-else key="expand" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo">
-        <h1 class="sidebar-title">{{ title }} </h1>
-      </router-link>
-    </transition>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'SidebarLogo',
-  props: {
-    collapse: {
-      type: Boolean,
-      required: true
-    }
-  },
-  data() {
-    return {
-      title: 'Vue Element Admin',
-      logo: 'https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef5251.png'
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.sidebarLogoFade-enter-active {
-  transition: opacity 1.5s;
-}
-
-.sidebarLogoFade-enter,
-.sidebarLogoFade-leave-to {
-  opacity: 0;
-}
-
-.sidebar-logo-container {
-  position: relative;
-  width: 100%;
-  height: 50px;
-  line-height: 50px;
-  background: #2b2f3a;
-  text-align: center;
-  overflow: hidden;
-
-  & .sidebar-logo-link {
-    height: 100%;
-    width: 100%;
-
-    & .sidebar-logo {
-      width: 32px;
-      height: 32px;
-      vertical-align: middle;
-      margin-right: 12px;
-    }
-
-    & .sidebar-title {
-      display: inline-block;
-      margin: 0;
-      color: #fff;
-      font-weight: 600;
-      line-height: 50px;
-      font-size: 14px;
-      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
-      vertical-align: middle;
-    }
-  }
-
-  &.collapse {
-    .sidebar-logo {
-      margin-right: 0px;
-    }
-  }
-}
-</style>

src/layout/components/Sidebar/index.vue

@@ -1,38 +1,31 @@
 <template>
-  <div :class="{'has-logo':showLogo}">
+  <el-scrollbar wrap-class="scrollbar-wrapper">
-    <logo v-if="showLogo" :collapse="isCollapse" />
+    <el-menu
-    <el-scrollbar wrap-class="scrollbar-wrapper">
+      :default-active="$route.path"
-      <el-menu
+      :collapse="isCollapse"
-        :default-active="$route.path"
+      :background-color="variables.menuBg"
-        :collapse="isCollapse"
+      :text-color="variables.menuText"
-        :background-color="variables.menuBg"
+      :active-text-color="variables.menuActiveText"
-        :text-color="variables.menuText"
+      :collapse-transition="false"
-        :active-text-color="variables.menuActiveText"
+      mode="vertical"
-        :collapse-transition="false"
+    >
-        mode="vertical"
+      <sidebar-item v-for="route in permission_routes" :key="route.path" :item="route" :base-path="route.path" />
-      >
+    </el-menu>
-        <sidebar-item v-for="route in permission_routes" :key="route.path" :item="route" :base-path="route.path" />
+  </el-scrollbar>
-      </el-menu>
-    </el-scrollbar>
-  </div>
 </template>
 
 <script>
 import { mapGetters } from 'vuex'
-import Logo from './Logo'
 import SidebarItem from './SidebarItem'
 import variables from '@/styles/variables.scss'
 
 export default {
-  components: { SidebarItem, Logo },
+  components: { SidebarItem },
   computed: {
     ...mapGetters([
       'permission_routes',
       'sidebar'
     ]),
-    showLogo() {
-      return this.$store.state.settings.sidebarLogo
-    },
     variables() {
       return variables
     },

src/layout/components/TagsView/ScrollPane.vue

@@ -67,7 +67,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .scroll-container {
   white-space: nowrap;
   position: relative;

src/layout/components/TagsView/index.vue

@@ -196,7 +196,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .tags-view-container {
   height: 34px;
   width: 100%;
@@ -264,7 +264,7 @@ export default {
 }
 </style>
 
-<style lang="scss">
+<style rel="stylesheet/scss" lang="scss">
 //reset element css of el-icon-close
 .tags-view-wrapper {
   .tags-view-item {

src/router/index.js

@@ -33,12 +33,6 @@ import nestedRouter from './modules/nested'
     affix: true                  if true, the tag will affix in the tags-view
   }
 **/
-
-/**
- * constantRoutes
- * a base page that does not have permission requirements
- * all roles can be accessed
- * */
 export const constantRoutes = [
   {
     path: '/redirect',
@@ -111,10 +105,6 @@ export const constantRoutes = [
   }
 ]
 
-/**
- * asyncRoutes
- * the routes that need to be dynamically loaded based on user roles
-*/
 export const asyncRoutes = [
   {
     path: '/permission',
@@ -170,7 +160,7 @@ export const asyncRoutes = [
     ]
   },
 
-  /** when your routing map is too long, you can split it into small modules **/
+  /** When your routing table is too long, you can split it into small modules**/
   componentsRouter,
   chartsRouter,
   nestedRouter,

src/settings.js

@@ -1,4 +1,6 @@
 export default {
+  title: 'vue-element-admin',
+
   /**
    * @type {boolean} true | false
    * @description Whether show the settings right-panel
@@ -15,13 +17,7 @@ export default {
    * @type {boolean} true | false
    * @description Whether fix the header
    */
-  fixedHeader: false,
+  fixedHeader: true,
-
-  /**
-   * @type {boolean} true | false
-   * @description Whether show the logo in sidebar
-   */
-  sidebarLogo: false,
 
   /**
    * @type {string | array} 'production' | ['production','development']

src/store/modules/settings.js

@@ -1,11 +1,10 @@
 import defaultSettings from '@/settings'
-const { showSettings, tagsView, fixedHeader, sidebarLogo } = defaultSettings
+const { showSettings, tagsView, fixedHeader } = defaultSettings
 
 const state = {
   showSettings: showSettings,
   tagsView: tagsView,
-  fixedHeader: fixedHeader,
+  fixedHeader: fixedHeader
-  sidebarLogo: sidebarLogo
 }
 
 const mutations = {

src/styles/sidebar.scss

@@ -38,16 +38,6 @@
       right: 0px;
     }
 
-    .el-scrollbar {
-      height: 100%;
-    }
-
-    &.has-logo {
-      .el-scrollbar {
-        height: calc(100% - 50px);
-      }
-    }
-
     .is-horizontal {
       display: none;
     }
@@ -110,7 +100,6 @@
 
       .el-tooltip {
         padding: 0 !important;
-
         .svg-icon {
           margin-left: 20px;
         }
@@ -122,7 +111,6 @@
 
       &>.el-submenu__title {
         padding: 0 !important;
-
         .svg-icon {
           margin-left: 20px;
         }

src/styles/transition.scss

@@ -1,4 +1,4 @@
-//global transition css
+//globl transition css
 
 /*fade*/
 .fade-enter-active,

src/views/components-demo/countTo.vue

@@ -26,10 +26,10 @@
         <input v-model.number="setDuration" type="number" name="durationInput">
       </label>
       <div class="startBtn example-btn" @click="start">
-        Start
+        开始
       </div>
       <div class="pause-resume-btn example-btn" @click="pauseResume">
-        pause/resume
+        暂停/恢复
       </div>
       <br>
       <label class="label" for="decimalsInput">decimals:

src/views/components-demo/dragKanban.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="components-container board">
-    <Kanban :key="1" :list="list1" :group="group" class="kanban todo" header-text="Todo" />
+    <Kanban :key="1" :list="list1" :options="options" class="kanban todo" header-text="Todo" />
-    <Kanban :key="2" :list="list2" :group="group" class="kanban working" header-text="Working" />
+    <Kanban :key="2" :list="list2" :options="options" class="kanban working" header-text="Working" />
-    <Kanban :key="3" :list="list3" :group="group" class="kanban done" header-text="Done" />
+    <Kanban :key="3" :list="list3" :options="options" class="kanban done" header-text="Done" />
   </div>
 </template>
 <script>
@@ -15,7 +15,9 @@ export default {
   },
   data() {
     return {
-      group: 'mission',
+      options: {
+        group: 'mission'
+      },
       list1: [
         { name: 'Mission', id: 1 },
         { name: 'Mission', id: 2 },

src/views/components-demo/jsonEditor.vue

@@ -1,10 +1,6 @@
 <template>
   <div class="components-container">
-    <code>Json-Editor is base on <a href="https://github.com/codemirror/CodeMirror" target="_blank">CodeMirrorr</a>. Lint
+    <code>JsonEditor is base on  <a href="https://github.com/codemirror/CodeMirror" target="_blank">CodeMirrorr</a> , lint base on json-lint </code>
-      base on <a
-        href="https://github.com/codemirror/CodeMirror/blob/master/addon/lint/json-lint.js"
-        target="_blank"
-      >json-lint</a>.</code>
     <div class="editor-container">
       <json-editor ref="jsonEditor" v-model="value" />
     </div>

src/views/components-demo/markdown.vue

@@ -1,11 +1,8 @@
 <template>
   <div class="components-container">
     <code>Markdown is based on
-      <a href="https://github.com/nhnent/tui.editor" target="_blank">tui.editor</a> ，simply wrapped with Vue.
+      <a href="https://github.com/nhnent/tui.editor" target="_blank">tui.editor</a> ，Simply encapsulated in Vue.
-      <a
+      <a target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/feature/component/markdown-editor.html">
-        target="_blank"
-        href="https://panjiachen.github.io/vue-element-admin-site/feature/component/markdown-editor.html"
-      >
         Documentation </a>
     </code>
 
@@ -13,33 +10,33 @@
       <el-tag class="tag-title">
         Basic:
       </el-tag>
-      <markdown-editor v-model="content1" height="300px" />
+      <markdown-editor v-model="content" height="300px" />
     </div>
 
     <div class="editor-container">
       <el-tag class="tag-title">
         Markdown Mode:
       </el-tag>
-      <markdown-editor ref="markdownEditor" v-model="content2" :options="{hideModeSwitch:true,previewStyle:'tab'}" height="200px" />
+      <markdown-editor ref="markdownEditor" v-model="content" :options="{hideModeSwitch:true,previewStyle:'tab'}" height="200px" />
     </div>
 
     <div class="editor-container">
       <el-tag class="tag-title">
         Customize Toolbar:
       </el-tag>
-      <markdown-editor v-model="content3" :options="{ toolbarItems: ['heading','bold','italic']}" />
+      <markdown-editor
+        ref="markdownEditor"
+        v-model="content"
+        :options="{ toolbarItems: ['heading','bold','italic']}"
+      />
     </div>
 
     <div class="editor-container">
       <el-tag class="tag-title">
         I18n:
       </el-tag>
-      <el-alert
+      <el-alert :closable="false" title="You can change the language of the admin system to see the effect" type="success" />
-        :closable="false"
+      <markdown-editor v-model="content" :language="language" height="300px" />
-        title="You can change the language of the admin system to see the effect"
-        type="success"
-      />
-      <markdown-editor ref="markdownEditor" v-model="content4" :language="language" height="300px" />
     </div>
 
     <el-button style="margin-top:80px;" type="primary" icon="el-icon-document" @click="getHtml">
@@ -65,10 +62,7 @@ export default {
   components: { MarkdownEditor },
   data() {
     return {
-      content1: content,
+      content: content,
-      content2: content,
-      content3: content,
-      content4: content,
       html: '',
       languageTypeList: {
         'en': 'en_US',

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

@@ -61,14 +61,14 @@ export default {
 }
 </script>
 
-<style lang="scss" >
+<style rel="stylesheet/scss" lang="scss" >
 .box-card-component{
   .el-card__header {
     padding: 0px!important;
   }
 }
 </style>
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .box-card-component {
   .box-card-header {
     position: relative;

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

@@ -70,7 +70,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .panel-group {
   margin-top: 18px;
   .card-panel-col{

src/views/dashboard/admin/index.vue

@@ -96,7 +96,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .dashboard-editor-container {
   padding: 32px;
   background-color: rgb(240, 242, 245);

src/views/dashboard/editor/index.vue

@@ -40,7 +40,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   .emptyGif {
     display: block;
     width: 45%;

src/views/documentation/index.vue

@@ -29,7 +29,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .documentation-container {
   margin: 50px;
   .document-btn {

src/views/errorPage/401.vue

@@ -58,7 +58,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   .errPage-container {
     width: 800px;
     max-width: 100%;

src/views/errorPage/404.vue

@@ -41,7 +41,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .wscn-http404-container{
   transform: translate(-50%,-50%);
   position: absolute;

src/views/example/components/ArticleDetail.vue

@@ -234,7 +234,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 @import "~@/styles/mixin.scss";
 .createPost-container {
   position: relative;

src/views/login/index.vue

@@ -171,7 +171,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style rel="stylesheet/scss" lang="scss">
 /* 修复input 背景不协调 和光标变色 */
 /* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
 
@@ -222,7 +222,7 @@ $cursor: #fff;
 }
 </style>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 $bg:#2d3a4b;
 $dark_gray:#889aa4;
 $light_gray:#eee;

src/views/login/socialsignin.vue

@@ -35,7 +35,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   .social-signup-container {
     margin: 20px 0;
     .sign-btn {

src/views/pdf/download.vue

@@ -42,7 +42,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style rel="stylesheet/scss" lang="scss">
 @mixin clearfix {
   &:before {
     display: table;

src/views/permission/directive.vue

@@ -89,7 +89,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .app-container {
   /deep/ .permission-alert {
     width: 320px;

src/views/svg-icons/index.vue

@@ -42,7 +42,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
 .icons-container {
   margin: 10px 20px 0;
   overflow: hidden;

vue.config.js

@@ -103,13 +103,13 @@ module.exports = {
       .when(process.env.NODE_ENV !== 'development',
         config => {
           config
-            .plugin('ScriptExtHtmlWebpackPlugin')
+          // .plugin('ScriptExtHtmlWebpackPlugin')
-            .after('html')
+          // .after('html')
-            .use('script-ext-html-webpack-plugin', [{
+          // .use('script-ext-html-webpack-plugin', [{
-            // `runtime` must same as runtimeChunk name. default is `runtime`
+          //   // `runtime` must same as runtimeChunk name. default is `runtime`
-              inline: /runtime\..*\.js$/
+          //   inline: /runtime\..*\.js$/
-            }])
+          // }])
-            .end()
+          // .end()
           config
             .optimization.splitChunks({
               chunks: 'all',