no message

.babelrc

+{
+  "presets": [
+    ["env", {
+      "modules": false,
+      "targets": {
+        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
+      }
+    }],
+    "stage-2"
+  ],
+  "plugins": ["transform-vue-jsx", "transform-runtime"],
+  "env": {
+    "test": {
+      "presets": ["env", "stage-2"],
+      "plugins": ["transform-vue-jsx", "transform-es2015-modules-commonjs", "dynamic-import-node"]
+    }
+  }
+}
\ No newline at end of file

.editorconfig

+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

.gitignore

+.DS_Store
+node_modules/
+/dist/
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+/test/unit/coverage/
+/test/e2e/reports/
+selenium-debug.log
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln

.postcssrc.js

+// https://github.com/michael-ciniawsky/postcss-load-config
+
+module.exports = {
+  "plugins": {
+    "postcss-import": {},
+    "postcss-url": {},
+    // to edit target browsers: use "browserslist" field in package.json
+    "autoprefixer": {}
+  }
+}

README.md

+# demo
+
+> A Vue.js project
+
+## Build Setup
+
+``` bash
+# install dependencies
+npm install
+
+# serve with hot reload at localhost:8080
+npm run dev
+
+# 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 e2e tests
+npm run e2e
+
+# 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).

build/build.js

+'use strict'
+require('./check-versions')()
+
+process.env.NODE_ENV = 'production'
+
+const ora = require('ora')
+const rm = require('rimraf')
+const path = require('path')
+const chalk = require('chalk')
+const webpack = require('webpack')
+const config = require('../config')
+const webpackConfig = require('./webpack.prod.conf')
+
+const spinner = ora('building for production...')
+spinner.start()
+
+rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
+  if (err) throw err
+  process.env.product = true;
+  webpack(webpackConfig, (err, stats) => {
+    spinner.stop()
+    if (err) throw err
+    process.stdout.write(stats.toString({
+      colors: true,
+      modules: false,
+      children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build.
+      chunks: false,
+      chunkModules: false
+    }) + '\n\n')
+
+    if (stats.hasErrors()) {
+      console.log(chalk.red('  Build failed with errors.\n'))
+      process.exit(1)
+    }
+
+    console.log(chalk.cyan('  Build complete.\n'))
+    console.log(chalk.yellow(
+      '  Tip: built files are meant to be served over an HTTP server.\n' +
+      '  Opening index.html over file:// won\'t work.\n'
+    ))
+  })
+})

build/check-versions.js

+'use strict'
+const chalk = require('chalk')
+const semver = require('semver')
+const packageConfig = require('../package.json')
+const shell = require('shelljs')
+
+function exec (cmd) {
+  return require('child_process').execSync(cmd).toString().trim()
+}
+
+const versionRequirements = [
+  {
+    name: 'node',
+    currentVersion: semver.clean(process.version),
+    versionRequirement: packageConfig.engines.node
+  }
+]
+
+if (shell.which('npm')) {
+  versionRequirements.push({
+    name: 'npm',
+    currentVersion: exec('npm --version'),
+    versionRequirement: packageConfig.engines.npm
+  })
+}
+
+module.exports = function () {
+  const warnings = []
+
+  for (let i = 0; i < versionRequirements.length; i++) {
+    const mod = versionRequirements[i]
+
+    if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
+      warnings.push(mod.name + ': ' +
+        chalk.red(mod.currentVersion) + ' should be ' +
+        chalk.green(mod.versionRequirement)
+      )
+    }
+  }
+
+  if (warnings.length) {
+    console.log('')
+    console.log(chalk.yellow('To use this template, you must update following to modules:'))
+    console.log()
+
+    for (let i = 0; i < warnings.length; i++) {
+      const warning = warnings[i]
+      console.log('  ' + warning)
+    }
+
+    console.log()
+    process.exit(1)
+  }
+}

build/utils.js

+'use strict'
+const path = require('path')
+const config = require('../config')
+const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const packageConfig = require('../package.json')
+
+exports.assetsPath = function (_path) {
+  const assetsSubDirectory = process.env.NODE_ENV === 'production'
+    ? config.build.assetsSubDirectory
+    : config.dev.assetsSubDirectory
+
+  return path.posix.join(assetsSubDirectory, _path)
+}
+
+exports.cssLoaders = function (options) {
+  options = options || {}
+
+  const cssLoader = {
+    loader: 'css-loader',
+    options: {
+      sourceMap: options.sourceMap
+    }
+  }
+
+  const postcssLoader = {
+    loader: 'postcss-loader',
+    options: {
+      sourceMap: options.sourceMap
+    }
+  }
+
+  // generate loader string to be used with extract text plugin
+  function generateLoaders (loader, loaderOptions) {
+    const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
+
+    if (loader) {
+      loaders.push({
+        loader: loader + '-loader',
+        options: Object.assign({}, loaderOptions, {
+          sourceMap: options.sourceMap
+        })
+      })
+    }
+
+    // Extract CSS when that option is specified
+    // (which is the case during production build)
+    if (options.extract) {
+      return ExtractTextPlugin.extract({
+        use: loaders,
+        fallback: 'vue-style-loader'
+      })
+    } else {
+      return ['vue-style-loader'].concat(loaders)
+    }
+  }
+
+  // https://vue-loader.vuejs.org/en/configurations/extract-css.html
+  return {
+    css: generateLoaders(),
+    postcss: generateLoaders(),
+    less: generateLoaders('less'),
+    sass: generateLoaders('sass', { indentedSyntax: true }),
+    scss: generateLoaders('sass'),
+    stylus: generateLoaders('stylus'),
+    styl: generateLoaders('stylus')
+  }
+}
+
+// Generate loaders for standalone style files (outside of .vue)
+exports.styleLoaders = function (options) {
+  const output = []
+  const loaders = exports.cssLoaders(options)
+
+  for (const extension in loaders) {
+    const loader = loaders[extension]
+    output.push({
+      test: new RegExp('\\.' + extension + '$'),
+      use: loader
+    })
+  }
+
+  return output
+}
+
+exports.createNotifierCallback = () => {
+  const notifier = require('node-notifier')
+
+  return (severity, errors) => {
+    if (severity !== 'error') return
+
+    const error = errors[0]
+    const filename = error.file && error.file.split('!').pop()
+
+    notifier.notify({
+      title: packageConfig.name,
+      message: severity + ': ' + error.name,
+      subtitle: filename || '',
+      icon: path.join(__dirname, 'logo.png')
+    })
+  }
+}

build/vue-loader.conf.js

+'use strict'
+const utils = require('./utils')
+const config = require('../config')
+const isProduction = process.env.NODE_ENV === 'production'
+const sourceMapEnabled = isProduction
+  ? config.build.productionSourceMap
+  : config.dev.cssSourceMap
+
+module.exports = {
+  loaders: utils.cssLoaders({
+    sourceMap: sourceMapEnabled,
+    extract: isProduction
+  }),
+  cssSourceMap: sourceMapEnabled,
+  cacheBusting: config.dev.cacheBusting,
+  transformToRequire: {
+    video: ['src', 'poster'],
+    source: 'src',
+    img: 'src',
+    image: 'xlink:href'
+  }
+}

build/webpack.base.conf.js

+'use strict'
+const path = require('path')
+const utils = require('./utils')
+const config = require('../config')
+const vueLoaderConfig = require('./vue-loader.conf')
+
+function resolve (dir) {
+  return path.join(__dirname, '..', dir)
+}
+
+
+
+module.exports = {
+  context: path.resolve(__dirname, '../'),
+  entry: {
+    app: './src/main.js'
+  },
+  output: {
+    path: config.build.assetsRoot,
+    filename: '[name].js',
+    publicPath: process.env.NODE_ENV === 'production'
+      ? config.build.assetsPublicPath
+      : config.dev.assetsPublicPath
+  },
+  resolve: {
+    extensions: ['.js', '.vue', '.json'],
+    alias: {
+      'vue$': 'vue/dist/vue.esm.js',
+      '@': resolve('src'),
+    }
+  },
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: vueLoaderConfig
+      },
+      {
+        test: /\.js$/,
+        loader: 'babel-loader',
+        include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
+      },
+      {
+        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('img/[name].[hash:7].[ext]')
+        }
+      },
+      {
+        test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('media/[name].[hash:7].[ext]')
+        }
+      },
+      {
+        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
+        }
+      }
+    ]
+  },
+  node: {
+    // prevent webpack from injecting useless setImmediate polyfill because Vue
+    // source contains it (although only uses it if it's native).
+    setImmediate: false,
+    // prevent webpack from injecting mocks to Node native modules
+    // that does not make sense for the client
+    dgram: 'empty',
+    fs: 'empty',
+    net: 'empty',
+    tls: 'empty',
+    child_process: 'empty'
+  }
+}

build/webpack.dev.conf.js

+'use strict'
+const utils = require('./utils')
+const webpack = require('webpack')
+const config = require('../config')
+const merge = require('webpack-merge')
+const path = require('path')
+const baseWebpackConfig = require('./webpack.base.conf')
+const CopyWebpackPlugin = require('copy-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
+const portfinder = require('portfinder')
+
+
+const HOST = process.env.HOST
+const PORT = process.env.PORT && Number(process.env.PORT)
+
+const devWebpackConfig = merge(baseWebpackConfig, {
+  module: {
+    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
+  },
+  // cheap-module-eval-source-map is faster for development
+  devtool: config.dev.devtool,
+
+  // these devServer options should be customized in /config/index.js
+  devServer: {
+    clientLogLevel: 'warning',
+    historyApiFallback: {
+      rewrites: [
+        { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
+      ],
+    },
+    hot: true,
+    contentBase: false, // since we use CopyWebpackPlugin.
+    compress: true,
+    host: HOST || config.dev.host,
+    port: PORT || config.dev.port,
+    open: config.dev.autoOpenBrowser,
+    overlay: config.dev.errorOverlay
+      ? { warnings: false, errors: true }
+      : false,
+    publicPath: config.dev.assetsPublicPath,
+    proxy: config.dev.proxyTable,
+    quiet: true, // necessary for FriendlyErrorsPlugin
+    watchOptions: {
+      poll: config.dev.poll,
+    }
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env': require('../config/dev.env')
+    }),    
+    new webpack.HotModuleReplacementPlugin(),
+    new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
+    new webpack.NoEmitOnErrorsPlugin(),
+    // https://github.com/ampedandwired/html-webpack-plugin
+    new HtmlWebpackPlugin({
+      filename: 'index.html',
+      template: 'index.html',
+      inject: true
+    }),
+    // copy custom static assets
+    new CopyWebpackPlugin([
+      {
+        from: path.resolve(__dirname, '../static'),
+        to: config.dev.assetsSubDirectory,
+        ignore: ['.*']
+      }
+    ])
+  ]
+})
+module.exports = new Promise((resolve, reject) => {
+  portfinder.basePort = process.env.PORT || config.dev.port
+  portfinder.getPort((err, port) => {
+    if (err) {
+      reject(err)
+    } else {
+      // publish the new Port, necessary for e2e tests
+      process.env.PORT = port
+      // add port to devServer config
+      devWebpackConfig.devServer.port = port
+
+      // Add FriendlyErrorsPlugin
+      devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
+        compilationSuccessInfo: {
+          messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
+        },
+        onErrors: config.dev.notifyOnErrors
+        ? utils.createNotifierCallback()
+        : undefined
+      }))
+
+      resolve(devWebpackConfig)
+    }
+  })
+})

build/webpack.prod.conf.js

+'use strict'
+const path = require('path')
+const utils = require('./utils')
+const webpack = require('webpack')
+const config = require('../config')
+const merge = require('webpack-merge')
+const baseWebpackConfig = require('./webpack.base.conf')
+const CopyWebpackPlugin = require('copy-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
+const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
+
+const env = process.env.NODE_ENV === 'testing'
+  ? require('../config/test.env')
+  : require('../config/prod.env')
+
+const webpackConfig = merge(baseWebpackConfig, {
+  module: {
+    rules: utils.styleLoaders({
+      sourceMap: config.build.productionSourceMap,
+      extract: true,
+      usePostCSS: true
+    })
+  },
+  devtool: config.build.productionSourceMap ? config.build.devtool : false,
+  output: {
+    path: config.build.assetsRoot,
+    filename: utils.assetsPath('js/[name].[chunkhash].js'),
+    chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
+  },
+  plugins: [
+    // http://vuejs.github.io/vue-loader/en/workflow/production.html
+    new webpack.DefinePlugin({
+      'process.env': env
+    }),
+    new UglifyJsPlugin({
+      uglifyOptions: {
+        compress: {
+          warnings: false
+        }
+      },
+      sourceMap: config.build.productionSourceMap,
+      parallel: true
+    }),
+    // extract css into its own file
+    new ExtractTextPlugin({
+      filename: utils.assetsPath('css/[name].[contenthash].css'),
+      // Setting the following option to `false` will not extract CSS from codesplit chunks.
+      // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
+      // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, 
+      // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
+      allChunks: true,
+    }),
+    // Compress extracted CSS. We are using this plugin so that possible
+    // duplicated CSS from different components can be deduped.
+    new OptimizeCSSPlugin({
+      cssProcessorOptions: config.build.productionSourceMap
+        ? { safe: true, map: { inline: false } }
+        : { safe: true }
+    }),
+    // generate dist index.html with correct asset hash for caching.
+    // you can customize output by editing /index.html
+    // see https://github.com/ampedandwired/html-webpack-plugin
+    new HtmlWebpackPlugin({
+      filename: process.env.NODE_ENV === 'testing'
+        ? 'index.html'
+        : config.build.index,
+      template: 'index.html',
+      inject: true,
+      minify: {
+        removeComments: true,
+        collapseWhitespace: true,
+        removeAttributeQuotes: true
+        // more options:
+        // https://github.com/kangax/html-minifier#options-quick-reference
+      },
+      // necessary to consistently work with multiple chunks via CommonsChunkPlugin
+      chunksSortMode: 'dependency'
+    }),
+    // keep module.id stable when vendor modules does not change
+    new webpack.HashedModuleIdsPlugin(),
+    // enable scope hoisting
+    new webpack.optimize.ModuleConcatenationPlugin(),
+    // split vendor js into its own file
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'vendor',
+      minChunks (module) {
+        // any required modules inside node_modules are extracted to vendor
+        return (
+          module.resource &&
+          /\.js$/.test(module.resource) &&
+          module.resource.indexOf(
+            path.join(__dirname, '../node_modules')
+          ) === 0
+        )
+      }
+    }),
+    // extract webpack runtime and module manifest to its own file in order to
+    // prevent vendor hash from being updated whenever app bundle is updated
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'manifest',
+      minChunks: Infinity
+    }),
+    // This instance extracts shared chunks from code splitted chunks and bundles them
+    // in a separate chunk, similar to the vendor chunk
+    // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'app',
+      async: 'vendor-async',
+      children: true,
+      minChunks: 3
+    }),
+
+    // copy custom static assets
+    new CopyWebpackPlugin([
+      {
+        from: path.resolve(__dirname, '../static'),
+        to: config.build.assetsSubDirectory,
+        ignore: ['.*']
+      }
+    ])
+  ]
+})
+
+if (config.build.productionGzip) {
+  const CompressionWebpackPlugin = require('compression-webpack-plugin')
+
+  webpackConfig.plugins.push(
+    new CompressionWebpackPlugin({
+      asset: '[path].gz[query]',
+      algorithm: 'gzip',
+      test: new RegExp(
+        '\\.(' +
+        config.build.productionGzipExtensions.join('|') +
+        ')$'
+      ),
+      threshold: 10240,
+      minRatio: 0.8
+    })
+  )
+}
+
+if (config.build.bundleAnalyzerReport) {
+  const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
+  webpackConfig.plugins.push(new BundleAnalyzerPlugin())
+}
+
+module.exports = webpackConfig

config/dev.env.js

+'use strict'
+const merge = require('webpack-merge')
+const prodEnv = require('./prod.env')
+
+module.exports = merge(prodEnv, {
+  NODE_ENV: '"development"'
+})

config/index.js

+'use strict'
+// Template version: 1.3.1
+// see http://vuejs-templates.github.io/webpack for documentation.
+
+const path = require('path')
+
+module.exports = {
+  dev: {
+
+    // Paths
+    assetsSubDirectory: 'static',
+    assetsPublicPath: '/',
+    proxyTable: {
+      // 开发环境中，请求后台接口，需要配置跨域，就在这里配置就可以了，可以配置多个地址
+    },
+
+    // Various Dev Server settings
+    // host: 'localhost', // can be overwritten by process.env.HOST
+    host: '0.0.0.0',
+    port: 6067, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
+    autoOpenBrowser: false,
+    errorOverlay: true,
+    notifyOnErrors: true,
+    poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
+
+    // Use Eslint Loader?
+    // If true, your code will be linted during bundling and
+    // linting errors and warnings will be shown in the console.
+    useEslint: false,
+    // If true, eslint errors and warnings will also be shown in the error overlay
+    // in the browser.
+    showEslintErrorsInOverlay: false,
+
+    /**
+     * Source Maps
+     */
+
+    // https://webpack.js.org/configuration/devtool/#development
+    devtool: 'cheap-module-eval-source-map',
+
+    // If you have problems debugging vue-files in devtools,
+    // set this to false - it *may* help
+    // https://vue-loader.vuejs.org/en/options.html#cachebusting
+    cacheBusting: true,
+
+    cssSourceMap: true
+  },
+
+  build: {
+    // Template for index.html
+    index: path.resolve(__dirname, '../dist/index.html'),
+
+    // Paths
+    assetsRoot: path.resolve(__dirname, '../dist'),
+    assetsSubDirectory: 'static',
+    assetsPublicPath: '/',
+
+    /**
+     * Source Maps
+     */
+
+    productionSourceMap: true,
+    // https://webpack.js.org/configuration/devtool/#production
+    devtool: '#source-map',
+
+    // Gzip off by default as many popular static hosts such as
+    // Surge or Netlify already gzip all static assets for you.
+    // Before setting to `true`, make sure to:
+    // npm install --save-dev compression-webpack-plugin
+    productionGzip: false,
+    productionGzipExtensions: ['js', 'css'],
+
+    // Run the build command with an extra argument to
+    // View the bundle analyzer report after build finishes:
+    // `npm run build --report`
+    // Set to `true` or `false` to always turn it on or off
+    bundleAnalyzerReport: process.env.npm_config_report
+  }
+}

config/prod.env.js

+'use strict'
+module.exports = {
+  NODE_ENV: '"production"'
+}

config/test.env.js

+'use strict'
+const merge = require('webpack-merge')
+const devEnv = require('./dev.env')
+
+module.exports = merge(devEnv, {
+  NODE_ENV: '"testing"'
+})

index.html

+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <title>yydata</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

package.json

+{
+  "name": "yydata",
+  "version": "1.0.0",
+  "description": "A Vue.js project",
+  "author": "lxm",
+  "private": true,
+  "scripts": {
+    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
+    "start": "npm run dev",
+    "unit": "jest --config test/unit/jest.conf.js --coverage",
+    "e2e": "node test/e2e/runner.js",
+    "test": "npm run unit && npm run e2e",
+    "build": "node build/build.js --product"
+  },
+  "dependencies": {
+    "@babel/preset-es2017": "^7.0.0-beta.53",
+    "axios": "^0.18.0",
+    "echarts": "^4.8.0",
+    "echarts-gl": "^1.1.1",
+    "element": "^0.1.4",
+    "element-ui": "^2.13.2",
+    "file-saver": "^2.0.2",
+    "js-md5": "^0.7.3",
+    "node-annotation": "^1.0.0",
+    "nprogress": "^0.2.0",
+    "qs": "^6.6.0",
+    "urlencode": "^1.1.0",
+    "vue": "^2.5.2",
+    "vue-cookie": "^1.1.4",
+    "vue-i18n": "^8.12.0",
+    "vue-resource": "^1.5.1",
+    "vue-router": "^3.0.2",
+    "vuedraggable": "^2.24.3",
+    "vuex": "^3.1.0",
+    "xlsx": "^0.15.5"
+  },
+  "devDependencies": {
+    "autoprefixer": "^7.1.2",
+    "babel-core": "^6.22.1",
+    "babel-helper-vue-jsx-merge-props": "^2.0.3",
+    "babel-jest": "^21.0.2",
+    "babel-loader": "^7.1.1",
+    "babel-plugin-component": "^1.1.1",
+    "babel-plugin-dynamic-import-node": "^1.2.0",
+    "babel-plugin-syntax-jsx": "^6.18.0",
+    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
+    "babel-plugin-transform-runtime": "^6.22.0",
+    "babel-plugin-transform-vue-jsx": "^3.5.0",
+    "babel-preset-env": "^1.3.2",
+    "babel-preset-stage-2": "^6.22.0",
+    "babel-register": "^6.22.0",
+    "chalk": "^2.0.1",
+    "chromedriver": "^2.27.2",
+    "copy-webpack-plugin": "^4.0.1",
+    "cross-spawn": "^5.0.1",
+    "css-loader": "^0.28.0",
+    "extract-text-webpack-plugin": "^3.0.0",
+    "file-loader": "^1.1.4",
+    "friendly-errors-webpack-plugin": "^1.6.1",
+    "html-webpack-plugin": "^2.30.1",
+    "jest": "^22.0.4",
+    "jest-serializer-vue": "^0.3.0",
+    "nightwatch": "^0.9.12",
+    "node-notifier": "^5.1.2",
+    "optimize-css-assets-webpack-plugin": "^3.2.0",
+    "ora": "^1.2.0",
+    "portfinder": "^1.0.13",
+    "postcss-import": "^11.0.0",
+    "postcss-loader": "^2.0.8",
+    "postcss-url": "^7.2.1",
+    "rimraf": "^2.6.0",
+    "selenium-server": "^3.0.1",
+    "semver": "^5.3.0",
+    "shelljs": "^0.7.6",
+    "uglifyjs-webpack-plugin": "^1.1.1",
+    "url-loader": "^0.5.8",
+    "vue-jest": "^1.0.2",
+    "vue-loader": "^13.3.0",
+    "vue-style-loader": "^3.0.1",
+    "vue-template-compiler": "^2.5.2",
+    "webpack": "^3.6.0",
+    "webpack-bundle-analyzer": "^2.9.0",
+    "webpack-dev-server": "^2.9.1",
+    "webpack-merge": "^4.1.0"
+  },
+  "engines": {
+    "node": ">= 6.0.0",
+    "npm": ">= 3.0.0"
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not ie <= 8"
+  ]
+}

src/App.vue

+<template>
+  <div id="app">
+    <router-view/>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'App'
+}
+</script>
+<style>
+  html, body, ul, li, a {
+    margin: 0;
+    padding: 0;
+    text-decoration: none;
+    list-style: none;
+  }
+</style>
+
+

src/lang/en-us.js

+module.exports = {
+  emunTitle: {
+    CustomerService: "Customer service",
+    GameManagement: "Game management",
+    ServerManagement: "Server management",
+    statistics: "statistics",
+    RechargeRelated: "Recharge related",
+  },
+  tree: {
+    playerManager: "User Management",
+    notice: "announcement",
+    activityNotice: "Upcoming Events",
+    operatingActivity: "Operational activities",
+    falseRecharge: "False recharge",
+    code: "code",
+    userLog: "Log",
+    systemMail: "mail",
+    area: "Area clothing",
+    chat: "Chat monitoring",
+    managerUser: "blacklist",
+    whiteUser: "whitelist",
+    serverTime: "server time",
+  },
+  card: {
+    successful: "Saved successfully",
+    failed: "Save failed",
+  },
+  playerManager: {
+    areaId: "District ID",
+    platform: "channel",
+    playerId: "playerID",
+    sdkUUID: "sdkUUID",
+    userName: "nickname",
+    userId: "Account ID",
+    lv: "grade",
+    lastActiveTime: "Last active time",
+    createTime: "Creation time",
+    totalActiveDay: "Landing days",
+    diamond: "Current diamond",
+    endurance: "Current physical strength",
+    maxMission: "Highest level",
+    rechargeTimes: "Recharge times",
+    totalRecharge: "Cumulative recharge amount",
+    deviceInfo: "Device Information",
+    ip: "IP",
+    clientVersion: "Client version",
+    hz: "Current Rainbow Diamond",
+  },
+  notice: {
+    updateTime: "Last modified time",
+    noticeTitle: "Announcement title",
+    noticeContent: "Announcement content",
+  },
+  activityNotice: {
+    id: "id",
+    title: "title",
+    content: "content",
+    sort: "Sort",
+    operate: "operating",
+    createTime: "Creation time",
+  },
+  operatingActivity: {
+    title: "title",
+    subtitle: "subtitle",
+    activityType: "type of activity",
+    startTime: "Starting time",
+    createTime: "Creation time",
+    endTime: "End Time",
+    state: "status",
+    notes: "Remarks",
+    grade: "Gear",
+    operate: "operating",
+  },
+  falseRecharge: {
+    grade: "Gear",
+    playerId: "playerID",
+  },
+  systemMail: {
+    limitPlatform: "Limited channel",
+    limitArea: "Limited service",
+    limitPlayer: "Limited role",
+    title: "title",
+    description: "description",
+    validDays: "valid date",
+    timingSendDate: "Timing sending time",
+    timingSend:'Timing sending',
+    updateTime: "Change the time",
+    enclosure: "Prop accessories",
+    operate: "operating",
+    mailList: "mailing list",
+    addMail: "Add mail",
+  },
+  area: {
+    areaName: "District Service Name",
+    openTime: "Opening time",
+    platform: "channel",
+    machineIp: "server address",
+    upperLimit: "Maximum number of people",
+    onlinesCount: "online users",
+    activityCount: "Active people",
+    edit: "edit",
+    maintenanceStatus: "Server status",
+    normal: "normal",
+    maintain: "maintain",
+  },
+  chat: {
+    autoRefresh: "Auto Refresh",
+    platform: "channel",
+    deliveryTime: "Sending time",
+    name: "nickname",
+    content: "Chat content",
+    blocking: "Forbidden",
+    blockingUser: "Ban users",
+  },
+  managerUser: {
+    closeUser: "Ban users",
+    platform: "channel",
+    name: "nickname",
+    closePlayerDay: "Title days",
+    closePlayerDate: "Title start time",
+    closeChatDay: "Forbidden days",
+    closeChatDate: "Mute start time",
+    reason: "reason",
+    operate: "operating",
+    closePlayer: "title",
+    closeChat: "Forbidden",
+    closeReason: "Ban grounds",
+    LiftTheBan: "Unblock",
+  },
+  whiteUser: {
+    platform: "channel",
+    name: "nickname",
+    operate: "operating",
+    addWhiteText: "Add whitelist",
+  },
+  code: {},
+  userLog: {},
+  pointOut: {
+    inputText: "Please enter",
+    selectText: "please choose",
+    validDaysText: "Required, will be automatically deleted after the expiration date",
+    timingSendDateText: "Timed sending time, not sending immediately",
+    limitAreaText: "If no partition is selected, the whole area is sent by default",
+    limitPlayerText: "Role ID, multiple in English; separated",
+    selectTime: "Select date and time",
+    titleText:"Please enter the title you want to find"
+  },
+  buttom: {
+    query: "Inquire",
+    delete: "delete",
+    update: "Update",
+    submit: "submit",
+    edit: "edit",
+    add: "Add to",
+    push: "Push",
+    copy: "copy",
+    cancel: "cancel",
+    retrieve: "Recycle",
+    client: "Clear",
+    recharge: "Top up",
+    preview: "Preview",
+    chooseProps: "Choose props",
+    addInBlack: "Add to blacklist",
+    addInWhite: "Add to whitelist",
+  },
+  public: {
+    edit: "edit",
+    update: "modify",
+    add: "Add to",
+  }
+}
\ No newline at end of file

src/lang/ja-jp.js

+module.exports = {
+  emunTitle: {
+    CustomerService: "カスタマーサービス",
+    GameManagement: "ゲーム管理",
+    ServerManagement: "サーバー管理",
+    statistics: "統計学",
+    RechargeRelated: "充電関連",
+  },
+  tree: {
+    playerManager: "ユーザー管理",
+    notice: "お知らせ",
+    activityNotice: "イベント発表",
+    operatingActivity: "運用活動",
+    falseRecharge: "誤充電",
+    code: "コード",
+    userLog: "ログ",
+    systemMail: "メール",
+    area: "地区サービス",
+    chat: "チャット監視",
+    managerUser: "ブラックリスト",
+    whiteUser: "ホワイトリスト",
+    serverTime: "サーバー時間",
+  },
+  card: {
+    successful: "正常に保存されました",
+    failed: "保存できませんでした",
+  },
+  playerManager: {
+    areaId: "地区ID",
+    platform: "チャンネル",
+    playerId: "playerID",
+    sdkUUID: "sdkUUID",
+    userName: "ニックネーム",
+    userId: "アカウントID",
+    lv: "ランク",
+    lastActiveTime: "最終活動時間",
+    createTime: "作成時間",
+    totalActiveDay: "着陸日",
+    diamond: "現在のダイヤモンド",
+    endurance: "現在の体力",
+    maxMission: "最高レベル",
+    rechargeTimes: "充電時間",
+    totalRecharge: "累計リチャージ額",
+    deviceInfo: "デバイス情報",
+    ip: "IP",
+    clientVersion: "クライアントのバージョン",
+    hz: "現在のレインボーダイヤモンド",
+  },
+  notice: {
+    updateTime: "最終変更時間",
+    noticeTitle: "発表タイトル",
+    noticeContent: "発表内容",
+  },
+  activityNotice: {
+    id: "id",
+    title: "タイトル",
+    content: "内容",
+    sort: "並べ替え",
+    operate: "運営",
+    createTime: "作成時間",
+  },
+  operatingActivity: {
+    title: "タイトル",
+    subtitle: "字幕",
+    activityType: "活動タイプ",
+    startTime: "開始時間",
+    createTime: "作成時間",
+    endTime: "終了時間",
+    state: "州",
+    notes: "備考",
+    grade: "ギア",
+    operate: "運営",
+  },
+  falseRecharge: {
+    grade: "ギア",
+    playerId: "playerID",
+  },
+  systemMail: {
+    limitPlatform: "限定チャンネル",
+    limitArea: "限定サービス",
+    limitPlayer: "限られた役割",
+    title: "タイトル",
+    description: "説明",
+    validDays: "有効日",
+    timingSendDate: "タイミング送信時間",
+    updateTime: "修正時間",
+    enclosure: "プロップアクセサリー",
+    operate: "運営",
+    mailList: "メーリングリスト",
+    addMail: "メールを追加",
+  },
+  area: {
+    areaName: "地区サービス名",
+    openTime: "開店時間",
+    platform: "チャンネル",
+    machineIp: "サーバーアドレス",
+    upperLimit: "最大人数",
+    onlinesCount: "オンラインの人数",
+    activityCount: "アクティブな人々",
+    edit: "編集する",
+    maintenanceStatus: "サーバーの状態",
+    normal: "普通",
+    maintain: "メンテナンス",
+  },
+  chat: {
+    autoRefresh: "自動更新",
+    platform: "チャンネル",
+    deliveryTime: "送信時間",
+    name: "ニックネーム",
+    content: "チャットコンテンツ",
+    blocking: "禁じられた",
+    blockingUser: "ユーザーを禁止する",
+  },
+  managerUser: {
+    closeUser: "ユーザーを禁止する",
+    platform: "チャンネル",
+    name: "ニックネーム",
+    closePlayerDay: "タイトル日",
+    closePlayerDate: "タイトル開始時間",
+    closeChatDay: "禁じられた日",
+    closeChatDate: "ミュート開始時間",
+    reason: "理由",
+    operate: "運営",
+    closePlayer: "タイトル",
+    closeChat: "禁じられた",
+    closeReason: "禁止理由",
+    LiftTheBan: "ブロックを解除",
+  },
+  whiteUser: {
+    platform: "チャンネル",
+    name: "ニックネーム",
+    operate: "運営",
+    addWhiteText: "ホワイトリストを追加",
+  },
+  code: {},
+  userLog: {},
+  pointOut: {
+    inputText: "入力してください",
+    selectText: "選択してください",
+    validDaysText: "必須、有効期限後に自動的に削除されます",
+    timingSendDateText: "即時送信ではなく、時間指定送信時間",
+    timingSend:'定期的に送る',
+    limitAreaText: "パーティションが選択されていない場合、デフォルトで領域全体が送信されます",
+    limitPlayerText: "役割ID、複数（英語）; 分離",
+    selectTime: "日時を選択してください",
+    titleText:"検索したいタイトルを入力してください"
+  },
+  buttom: {
+    query: "お問い合わせ",
+    delete: "削除する",
+    update: "更新する",
+    submit: "提出する",
+    edit: "編集する",
+    add: "追加する",
+    push: "押す",
+    copy: "コピーする",
+    cancel: "キャンセルする",
+    retrieve: "リサイクルする",
+    client: "クリアー",
+    recharge: "補充する",
+    preview: "プレビュー",
+    chooseProps: "小道具を選択してください",
+    addInBlack: "ブラックリストに追加",
+    addInWhite: "ホワイトリストに追加",
+  },
+  public: {
+    edit: "編集する",
+    update: "修正",
+    add: "追加する",
+  },
+}
\ No newline at end of file

src/lang/ko-kr.js

+module.exports = {
+  emunTitle: {
+    CustomerService: "고객 서비스",
+    GameManagement: "게임 관리",
+    ServerManagement: "서버 관리",
+    statistics: "통계",
+    RechargeRelated: "충전 관련",
+  },
+  tree: {
+    playerManager: "사용자 관리",
+    notice: "발표",
+    activityNotice: "이벤트 발표",
+    operatingActivity: "운영 활동",
+    falseRecharge: "거짓 재충전",
+    code: "코드",
+    userLog: "로그",
+    systemMail: "메일",
+    area: "지역 서비스",
+    chat: "채팅 모니터링",
+    managerUser: "블랙리스트",
+    whiteUser: "화이트리스트",
+    serverTime: "서버 시간",
+  },
+  card: {
+    successful: "성공적으로 저장되었습니다",
+    failed: "저장 실패",
+  },
+  playerManager: {
+    areaId: "지구 ID",
+    platform: "채널",
+    playerId: "playerID",
+    sdkUUID: "SDKUUID",
+    userName: "닉네임",
+    userId: "계정 ID",
+    lv: "순위",
+    lastActiveTime: "마지막 활동 시간",
+    createTime: "제작 시간",
+    totalActiveDay: "상륙 일",
+    diamond: "현재 다이아몬드",
+    endurance: "현재 체력",
+    maxMission: "최고 수준",
+    rechargeTimes: "재충전 시간",
+    totalRecharge: "누적 충전량",
+    deviceInfo: "장치 정보",
+    ip: "IP",
+    clientVersion: "클라이언트 버전",
+    hz: "현재 레인보우 다이아몬드",
+  },
+  notice: {
+    updateTime: "마지막 수정 시간",
+    noticeTitle: "발표 제목",
+    noticeContent: "발표 내용",
+  },
+  activityNotice: {
+    id: "아이디",
+    title: "직함",
+    content: "내용",
+    sort: "정렬",
+    operate: "조작",
+    createTime: "제작 시간",
+  },
+  operatingActivity: {
+    title: "직함",
+    subtitle: "자막",
+    activityType: "활동 유형",
+    startTime: "시작 시간",
+    createTime: "제작 시간",
+    endTime: "종료 시간",
+    state: "주",
+    notes: "비고",
+    grade: "기어",
+    operate: "조작",
+  },
+  falseRecharge: {
+    grade: "기어",
+    playerId: "playerID",
+  },
+  systemMail: {
+    limitPlatform: "제한된 채널",
+    limitArea: "제한된 서비스",
+    limitPlayer: "제한된 역할",
+    title: "직함",
+    description: "설명",
+    validDays: "유효일",
+    timingSendDate: "타이밍 전송 시간",
+    updateTime: "수정 된 시간",
+    enclosure: "소품 액세서리",
+    operate: "조작",
+    mailList: "메일 링리스트",
+    addMail: "메일 추가",
+  },
+  area: {
+    areaName: "지역 서비스 이름",
+    openTime: "개관 시간",
+    platform: "채널",
+    machineIp: "서버 주소",
+    upperLimit: "최대 인원",
+    onlinesCount: "온라인 사람 수",
+    activityCount: "활동적인 사람들",
+    edit: "편집",
+    maintenanceStatus: "서버 상태",
+    normal: "보통",
+    maintain: "정비",
+  },
+  chat: {
+    autoRefresh: "자동 새로 고침",
+    platform: "채널",
+    deliveryTime: "보내는 시간",
+    name: "닉네임",
+    content: "채팅 내용",
+    blocking: "금지",
+    blockingUser: "사용자 금지",
+  },
+  managerUser: {
+    closeUser: "사용자 금지",
+    platform: "채널",
+    name: "닉네임",
+    closePlayerDay: "타이틀 일",
+    closePlayerDate: "타이틀 시작 시간",
+    closeChatDay: "금지 된 날",
+    closeChatDate: "음소거 시작 시간",
+    reason: "이유",
+    operate: "조작",
+    closePlayer: "직함",
+    closeChat: "금지",
+    closeReason: "금지 근거",
+    LiftTheBan: "차단 해제",
+  },
+  whiteUser: {
+    platform: "채널",
+    name: "닉네임",
+    operate: "조작",
+    addWhiteText: "허용 목록 추가",
+  },
+  code: {},
+  userLog: {},
+  pointOut: {
+    inputText: "입력 해주세요",
+    selectText: "선택하세요",
+    validDaysText: "필수, 만료일 후에 자동으로 삭제됩니다",
+    timingSendDateText: "즉시 발송하지 않고 시간이 지정된 발송 시간",
+    timingSend:'정기적으로 보내기',
+    limitAreaText: "파티션을 선택하지 않으면 전체 영역이 기본적으로 전송됩니다",
+    limitPlayerText: "역할 ID, 영어로 여러 개;구분",
+    selectTime: "날짜와 시간을 선택하십시오",
+    titleText:"찾으려는 제목을 입력하십시오"
+  },
+  buttom: {
+    query: "문의",
+    delete: "삭제",
+    update: "업데이트",
+    submit: "제출",
+    edit: "편집",
+    add: "추가",
+    push: "푸시",
+    copy: "복사",
+    cancel: "취소",
+    retrieve: "재활용",
+    client: "클리어",
+    recharge: "위로",
+    preview: "미리보기",
+    chooseProps: "소품 선택",
+    addInBlack: "블랙리스트에 추가",
+    addInWhite: "허용 목록에 추가",
+  },
+  public: {
+    edit: "편집",
+    update: "수정",
+    add: "추가",
+  }
+}
\ No newline at end of file

src/lang/zh-cn.js

+module.exports = {
+  emunTitle:{
+     CustomerService:"客服",
+     GameManagement:"游戏管理",
+     ServerManagement:"服务器管理",
+     statistics:"统计",
+     RechargeRelated:"充值相关"
+  },
+  tree: {
+    playerManager : "用户管理",
+    notice:"公告",
+    activityNotice:"活动公告",
+    operatingActivity:"运营活动",
+    falseRecharge:"虚假充值",
+    code:"code",
+    userLog:"日志",
+    systemMail:"邮件",
+    area:"区服",
+    chat:"聊天监控",
+    managerUser:"黑名单",
+    whiteUser:"白名单",
+    serverTime:"服务器时间"
+  },
+  card:{
+    successful:"保存成功",
+    failed:"保存失败"
+  },
+  //用户管理
+  playerManager:{
+    areaId:"区服ID",
+    platform:"渠道",
+    playerId:"playerID",
+    sdkUUID:"sdkUUID",
+    userName:"昵称",
+    userId:"账号ID",
+    lv:"等级",
+    lastActiveTime:"最后活跃时间",
+    createTime:"创建时间",
+    totalActiveDay:"登陆天数",
+    diamond:"当前钻石",
+    endurance:"当前体力",
+    maxMission:"最高关卡",
+    rechargeTimes:"充值次数",
+    totalRecharge:"累计充值金额",
+    deviceInfo:"设备信息",
+    ip:"IP",
+    clientVersion:"客户端版本",
+    hz:"当前虹钻",
+  },
+  //公告
+  notice:{
+    updateTime:"上次修改时间",
+    noticeTitle:"公告标题",
+    noticeContent:"公告内容",
+  },
+  //活动公告
+  activityNotice:{
+    id:"id",
+    title:"标题",
+    content:"内容",
+    sort:"排序",
+    operate:"操作",
+    createTime:"创建时间",
+  },
+  //运营活动
+  operatingActivity:{
+    title:"标题",
+    subtitle:"副标题",
+    activityType:"活动类型",
+    startTime:"开始时间",
+    createTime:"创建时间",
+    endTime:"结束时间",
+    state:"状态",
+    notes:"备注",
+    grade:"挡位",
+    operate:"操作"
+  },
+  //虚拟充值
+  falseRecharge:{
+    grade:"挡位",
+    playerId:"playerID",
+  },
+  //邮件
+  systemMail:{
+    limitPlatform:"限渠道",
+    limitArea:"限区服",
+    limitPlayer:"限角色",
+    title:"标题",
+    description:"描述",
+    validDays:"有效天数",
+    timingSendDate:"定时发送时间",
+    timingSend:'定时发送',
+    updateTime:"修改时间",
+    enclosure:"道具附件",
+    operate:"操作",
+    mailList:"邮件列表",
+    addMail:"添加邮件"
+  },
+  //区服
+  area:{
+    areaName:"区服名称",
+    openTime:"开服时间",
+    platform:"渠道",
+    machineIp:"服务器地址",
+    upperLimit:"人数上限",
+    onlinesCount:"在线人数",
+    activityCount:"活跃人数",
+    edit:"编辑",
+    maintenanceStatus:"服务器状态",
+    normal:"正常",
+    maintain:"维护"
+  },
+  //聊天监控
+  chat:{
+    autoRefresh:"自动刷新",
+    platform:"渠道",
+    deliveryTime:"发送时间",
+    name:"昵称",
+    content:"聊天内容",
+    blocking:"禁言",
+    blockingUser:"封禁用户"
+
+  },
+  //黑名单
+  managerUser:{
+    closeUser:"封禁用户",
+    platform:"渠道",
+    name:"昵称",
+    closePlayerDay:"封号天数",
+    closePlayerDate:"封号开始时间",
+    closeChatDay:"禁言天数",
+    closeChatDate:"禁言开始时间",
+    reason:"理由",
+    operate:"操作",
+    closePlayer:"封号",
+    closeChat:"禁言",
+    closeReason:"封禁理由",
+    LiftTheBan:"解封"
+  },
+  //白名单
+  whiteUser:{
+    platform:"渠道",
+    name:"昵称",
+    operate:"操作",
+    addWhiteText:"添加白名单",
+  },
+  //code
+  code:{
+    codeListText:"兑换码列表",
+    codeText:"创建普通code",
+    infiniteCodeText:"创建无限code",
+    disposableCodeText:"创建一次性code",
+    effectiveTime:"生效时间",
+    failureTime:"失效时间",
+    useCount:"可兑换总数",
+    singleUseTimes:"单人使用次数",
+    finishedUse:"已经使用次数",
+    goodNameList:"奖励列表",
+    createTime:"创建时间",
+    codeTypeStr:"code类型",
+    operate:"操作",
+    infiniteCode:"无限code",
+    disposableCode:"一次性code",
+    ordinaryCode:"普通code",
+    maxPeople:"最大兑换人数",
+    selectProp:"选择道具",
+    srCode:"指定code",
+  },
+  //日志
+  userLog:{},
+  pointOut:{
+    inputText:"请输入内容",
+    selectText:"请选择",
+    validDaysText:"必填,有效期过后会被自动删除",
+    timingSendDateText:"定时发送时间点,不选立即发送",
+    limitAreaText:"不选分区则默认全区发送",
+    limitPlayerText:"角色ID,多个用英文;隔开",
+    selectTime:"选择日期时间",
+    srCodeText:"不输入则系统生成",
+    titleText:"请输入需要查找的标题"
+  },
+  
+  buttom:{
+    query:"查询",
+    delete:"删除",
+    update:"更新",
+    submit:"提交",
+    edit:"编辑",
+    add:"添加",
+    push:"推送",
+    copy:"复制",
+    cancel:"取消",
+    retrieve:"回收",
+    client:"清除",
+    recharge:"充值",
+    preview:"预览",
+    chooseProps:"选择道具",
+    addInBlack:"添加至黑名单",
+    addInWhite:"添加至白名单",
+  },
+  public:{
+    edit:"编辑",
+    update:"修改",
+    add:"添加"
+  }
+}

src/lang/zh-tw.js

+module.exports = {
+  emunTitle: {
+    CustomerService: "客服",
+    GameManagement: "遊戲管理",
+    ServerManagement: "服務器管理",
+    statistics: "統計",
+    RechargeRelated: "充值相關",
+  },
+  tree: {
+    playerManager: "用戶管理",
+    notice: "公告",
+    activityNotice: "活動公告",
+    operatingActivity: "運營活動",
+    falseRecharge: "虛假充值",
+    code: "code",
+    userLog: "日誌",
+    systemMail: "郵件",
+    area: "區服",
+    chat: "聊天監控",
+    managerUser: "黑名單",
+    whiteUser: "白名單",
+    serverTime: "服務器時間",
+  },
+  card: {
+    successful: "保存成功",
+    failed: "保存失敗",
+  },
+  playerManager: {
+    areaId: "區服ID",
+    platform: "渠道",
+    playerId: "playerID",
+    sdkUUID: "sdkUUID",
+    userName: "暱稱",
+    userId: "賬號ID",
+    lv: "等級",
+    lastActiveTime: "最後活躍時間",
+    createTime: "創建時間",
+    totalActiveDay: "登陸天數",
+    diamond: "當前鑽石",
+    endurance: "當前體力",
+    maxMission: "最高關卡",
+    rechargeTimes: "充值次數",
+    totalRecharge: "累計充值金額",
+    deviceInfo: "設備信息",
+    ip: "IP",
+    clientVersion: "客戶端版本",
+    hz: "當前虹鑽",
+  },
+  notice: {
+    updateTime: "上次修改時間",
+    noticeTitle: "公告標題",
+    noticeContent: "公告內容",
+  },
+  activityNotice: {
+    id: "id",
+    title: "標題",
+    content: "內容",
+    sort: "排序",
+    operate: "操作",
+    createTime: "創建時間",
+  },
+  operatingActivity: {
+    title: "標題",
+    subtitle: "副標題",
+    activityType: "活動類型",
+    startTime: "開始時間",
+    createTime: "創建時間",
+    endTime: "結束時間",
+    state: "狀態",
+    notes: "備註",
+    grade: "擋位",
+    operate: "操作",
+  },
+  falseRecharge: {
+    grade: "擋位",
+    playerId: "playerID",
+  },
+  systemMail: {
+    limitPlatform: "限渠道",
+    limitArea: "限區服",
+    limitPlayer: "限角色",
+    title: "標題",
+    description: "描述",
+    validDays: "有效天數",
+    timingSendDate: "定時發送時間",
+    updateTime: "修改時間",
+    enclosure: "道具附件",
+    operate: "操作",
+    mailList: "郵件列表",
+    addMail: "添加郵件",
+  },
+  area: {
+    areaName: "區服名稱",
+    openTime: "開服時間",
+    platform: "渠道",
+    machineIp: "服務器地址",
+    upperLimit: "人數上限",
+    onlinesCount: "在線人數",
+    activityCount: "活躍人數",
+    edit: "編輯",
+    maintenanceStatus: "服務器狀態",
+    normal: "正常",
+    maintain: "維護",
+  },
+  chat: {
+    autoRefresh: "自動刷新",
+    platform: "渠道",
+    deliveryTime: "發送時間",
+    name: "暱稱",
+    content: "聊天內容",
+    blocking: "禁言",
+    blockingUser: "封禁用戶",
+  },
+  managerUser: {
+    closeUser: "封禁用戶",
+    platform: "渠道",
+    name: "暱稱",
+    closePlayerDay: "封號天數",
+    closePlayerDate: "封號開始時間",
+    closeChatDay: "禁言天數",
+    closeChatDate: "禁言開始時間",
+    reason: "理由",
+    operate: "操作",
+    closePlayer: "封號",
+    closeChat: "禁言",
+    closeReason: "封禁理由",
+    LiftTheBan: "解封",
+  },
+  whiteUser: {
+    platform: "渠道",
+    name: "暱稱",
+    operate: "操作",
+    addWhiteText: "添加白名單",
+  },
+  code: {},
+  userLog: {},
+  pointOut: {
+    inputText: "請輸入內容",
+    selectText: "請選擇",
+    validDaysText: "必填,有效期過後會被自動刪除",
+    timingSendDateText: "定時發送時間點,不選立即發送",
+    timingSend:'定時發送',
+    limitAreaText: "不選分區則默認全區發送",
+    limitPlayerText: "角色ID,多個用英文;隔開",
+    selectTime: "選擇日期時間",
+    titleText:"請輸入需要查找的標題"
+  },
+  buttom: {
+    query: "查詢",
+    delete: "刪除",
+    update: "更新",
+    submit: "提交",
+    edit: "編輯",
+    add: "添加",
+    push: "推送",
+    copy: "複製",
+    cancel: "取消",
+    retrieve: "回收",
+    client: "清除",
+    recharge: "充值",
+    preview: "預覽",
+    chooseProps: "選擇道具",
+    addInBlack: "添加至黑名單",
+    addInWhite: "添加至白名單",
+  },
+  public: {
+    edit: "編輯",
+    update: "修改",
+    add: "添加",
+  }
+}
\ No newline at end of file

src/main.js

+// The Vue build version to load with the `import` command
+// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
+import Vue from 'vue'
+import App from './App'
+import router from './router'
+import ElementUI from 'element-ui'
+import NProgress from 'nprogress'
+import VueI18n from 'vue-i18n'
+import Axios from 'axios'
+import 'element-ui/lib/theme-chalk/index.css'
+import store from './store/store'
+Vue.config.productionTip = false
+import VueCookie  from 'vue-cookie'
+import 'nprogress/nprogress.css'
+import LangZHCN from './lang/zh-cn'
+import LangENUS from './lang/en-us'
+import LangJAJP from './lang/ja-jp'
+import LangKPKR from './lang/ko-kr'
+import md5 from 'js-md5';
+
+
+Vue.use(ElementUI);
+Vue.use(VueCookie);
+Vue.use(VueI18n);
+
+let lang = !sessionStorage.getItem('lang') || sessionStorage.getItem('lang') == "undefined" ? 'zh-cn' : sessionStorage.getItem('lang');
+const i18n = new VueI18n({
+  locale: lang,
+  messages: {
+    'en-us': LangENUS,
+    'zh-cn': LangZHCN,
+    'ko-kr': LangKPKR,
+    'ja-jp': LangJAJP
+  }
+});
+
+// changeLange();
+
+// function changeLange () {
+//   i18n.locale = sessionStorage.getItem('lang') ? sessionStorage.getItem('lang') : 'zh-cn'
+// }
+// console.log("lang",vue.i18n);
+
+
+Date.prototype.format = function(fmt)   
+{ //author: meizz   
+  var o = {   
+    "M+" : this.getMonth()+1,                 //月份   
+    "d+" : this.getDate(),                    //日   
+    "h+" : this.getHours(),                   //小时   
+    "m+" : this.getMinutes(),                 //分   
+    "s+" : this.getSeconds(),                 //秒   
+    "q+" : Math.floor((this.getMonth()+3)/3), //季度   
+    "S"  : this.getMilliseconds()             //毫秒   
+  };   
+  if(/(y+)/.test(fmt))   
+    fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));   
+  for(var k in o)   
+    if(new RegExp("("+ k +")").test(fmt))   
+  fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));   
+  return fmt;   
+}
+
+// 设置请求token
+Axios.interceptors.request.use(config => {
+  let token = sessionStorage.getItem('token')
+  let user = JSON.parse(sessionStorage.getItem('user'));
+  config.headers['token'] = token;
+  if (user) config.headers['userid'] = user.id;
+  return config
+})
+
+// 接口错误拦截
+Axios.interceptors.response.use(res => {
+  return res?res.data:res
+
+  // if (res.status === 401) {
+  //   app && app.$message({
+  //     type: 'warning',
+  //     message: '登录身份过期，请重新登录。'
+  //   })
+  //   sessionStorage.removeItem('token')
+  //   sessionStorage.removeItem('user')
+  //   router.push({name: 'login'})
+  //   return Promise.reject(new Error('身份过期'))
+  // } 
+  // else if (res.status == 500){
+  //   app.$notify.error({
+  //     title: '服务错误',
+  //     message: '服务器响应错误 ' + JSON.stringify(res.data)
+  //   })
+  // }
+  // else {
+  //   return res?res.data:res
+  // }
+}, err => {
+  let errinfo = {
+    title: '服务错误',
+    message: ' 服务器响应错误 '
+  }
+  return Promise.reject(errinfo)
+})
+
+
+//导航卫士
+router.beforeEach((to, from, next) => {
+  // NProgress.start();
+  // let token = sessionStorage.getItem('token');
+  // if (!token && to.name !== 'login') {
+  //   // app && app.$message.error('未授权，请登陆授权后继续')
+  //   // NProgress.done();
+  //   return next({name: 'login'})
+  // }
+  return next();
+});
+
+Vue.prototype.$http = Axios
+Vue.http = Axios
+Vue.prototype.$md5 = md5;
+
+
+/* eslint-disable no-new */
+var vue = new Vue({
+  el: '#app',
+  router,
+  i18n,
+  store,
+  components: { App },
+  template: '<App/>'
+});
+
+export default vue

src/pages/boss/createProject.vue

+<template>
+    <div class="createProjectBox">
+        <div class="createProjectMainBox">
+            <el-card class="box-card">
+                <el-form ref="form" label-width="80px">
+                    <el-form-item label="项目名称">
+                        <el-input size="mini" style="width:400px" v-model="projectName"></el-input>
+                    </el-form-item>
+                    <el-form-item label="项目类型 ">
+                        <el-select size="mini" v-model="projectType" placeholder="请选择">
+                            <el-option
+                            v-for="item in projectSelectList"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                            </el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="项目背景">
+                        <el-input  type="textarea" size="mini" 
+                         resize="none"
+                        style="width:400px" 
+                        :rows="8"
+                        v-model="projectDes"></el-input>
+                    </el-form-item>
+                </el-form>
+                <div class="null40Div"></div>
+                <div class="createProjectButtonBox">
+                   <el-button size="mini" round>创建项目</el-button>
+                </div>
+            </el-card>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            projectName:"",
+            projectType:"",
+            projectDes:"",
+            projectSelectList:[
+                {label:"园区", value:1},
+                {label:"教育", value:2},
+                {label:"企业", value:3},
+                {label:"政府", value:4},
+            ],
+
+        }
+    },
+    components: { },
+    methods:{
+      
+    }    
+}
+</script>
+
+<style>
+.createProjectBox{
+    width: 100%;
+}
+.createProjectBox .createProjectMainBox {
+    width: 66%;
+}
+.createProjectBox .createProjectMainBox .el-card  {
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 6px;
+}
+.createProjectBox .createProjectMainBox .el-form-item__label {
+    color: aliceblue;
+    font-size: 16px;
+}
+.createProjectBox .createProjectMainBox .createProjectButtonBox {
+      width: 95%;
+    height: 40px;
+    text-align: center;
+}
+</style>
\ No newline at end of file

src/pages/boss/stats.vue

+<template>
+    <div>统计</div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file

src/pages/home.vue

+<template>
+  <div class="mainStyle">
+   <el-container>
+      <el-aside :style="defaultLeftMenu">
+        <div class="leftBox">
+          <div class="logoBox">
+            <img src="../assets/login/logo.png" @click="clickNotebook" width="118px" height="44px" class="logoImg" />
+          </div>
+          <div class="menuBox">
+           <letfmenu></letfmenu>
+          </div>
+        </div>
+      </el-aside>
+      <el-container>
+        <el-header :style="defaultHeader">
+          <div class="headerBox">
+            <div class="headerBoxStyle">
+               <el-row>
+                <el-col :span="24">
+                  <div class="headerLeftContent">
+                    <div class="avatarBox pull-right">
+                      <el-avatar class="avatarInfo" :size="46" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></el-avatar>
+                      <span><b>Zhang Shan</b></span>
+                    </div>
+                  </div>
+                </el-col>
+              </el-row>
+            </div>
+          </div>
+        </el-header>
+        <el-main :style="defaultMainHeight">
+          <router-view></router-view>
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+</template>
+
+<script>
+import { mapActions } from "vuex";
+import letfmenu from "./menu.vue"
+export default {
+  name: "home",
+  data() {
+    return {
+      //自适应高度
+      defaultMainHeight:{
+        height:"",
+        padding:"0 40"
+      },
+      defaultLeftMenu:{
+        width:"200px",
+        height:"",
+        "border-right":" 1px solid rgb(255 255 255 / 15%)"
+      },
+      defaultHeader:{
+        height:"60px",
+        padding:"0 0"
+      },
+
+    };
+  },
+  components: { letfmenu },
+  methods: {
+    //自适应main区域高度
+    getMainHeight() {
+      let windowHeight = window.innerHeight;
+      this.defaultMainHeight.height = windowHeight - 60 +"px";
+      this.defaultLeftMenu.height = windowHeight +"px";
+    },
+    clickNotebook() {
+      this.$router.push({path: '/home/notebook'});
+    }
+  },
+  created: async function () {
+    window.addEventListener("resize", this.getMainHeight);
+    this.getMainHeight();
+  }
+};
+</script>
+<style scoped>
+.mainStyle {
+  background: url('../assets/login/logbackground.png') no-repeat;
+}
+.headerBoxStyle {
+    background: rgb(0 0 0 / 15%);
+    border-bottom: 1px solid rgb(255 255 255 / 15%);
+}
+.headerBox .el-row {
+  height: 60px;
+}
+.leftBox{
+  width: 100%;
+  height: 100%;
+  background-size:100% 100%;
+}
+.headerBox{
+  width: 100%;
+  height: 100%;
+}
+.headerBox .el-card {
+  height: 60px;
+}
+.logoBox {
+  width: 100%;
+  height: 60px;
+  background: rgb(255 255 255 / 15%);
+  border-bottom: 1px solid rgb(255 255 255 / 12%);
+}
+
+.logoImg {
+  position: relative;
+  top: 10px;
+  left: 18px;
+}
+.menuBox {
+  width: 100%;
+}
+.headerLeftContent{
+  /* text-align: right; */
+  border-radius: 4px;
+  min-height: 60px;
+}
+.headerLeftContent .avatarBox .avatarInfo {
+  position: relative;
+  right: 42px;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  margin: 6px;
+}
+.avatarBox{
+  width: 190px;
+  height: 60px;
+  border-left: solid 1px rgb(255 255 255 / 15%);
+}
+.avatarBox span{
+  width: 190px;
+  position: relative;
+  left: 5px;
+}
+.avatarBox b{
+  color: #fff;
+  height: 46px;
+  position: relative;
+  top: -20px;
+}
+</style>

src/pages/login.vue

+<template>
+  <div>
+    <div class="loginBackgroundInfo">
+      <img :src="imgSrc" width="100%" height="100%" alt="" />
+    </div>
+    <template>
+      <el-row :gutter="24" style="height:100%;width:100%">
+        <el-col :xs="0"  :sm="1"  :md="2"  :lg="4"  :xl="3"><div class="grid-content "></div></el-col>
+        <el-col :xs="24" :sm="21" :md="16" :lg="15" :xl="15">
+          <div class="grid-content ">
+            <div :style="bodyDefaultStyle">
+              <div class="bodyBack">
+                <div class="bodyBorder">
+                  <div class="logoStyle">
+                    <img :src="logoImg" width="172px" height="64px" class="logoImg" />
+                  </div>
+                  <div class="boxStyle">
+                    <div class="subBoxStyle">
+                      <el-input v-model="loginId" class="inpurtBox" placeholder="输入账号">
+                        <i slot="prefix" class="el-input__icon el-icon-user-solid"></i>
+                      </el-input>
+                    </div>
+                  </div>
+                  <div class="boxStyle">
+                    <div class="subBoxStyle">
+                      <el-input v-model="pwd" class="inpurtBox" placeholder="输入密码">
+                        <i slot="prefix" class="el-input__icon el-icon-user-solid"></i>
+                      </el-input>
+                    </div>
+                  </div>
+                  <div class="msgBoxStyle">
+                    <div class="msgStyle">{{errMsg}}</div>
+                  </div>
+                  <div class="boxStyle">
+                    <div class="subBoxStyle">
+                      <el-button type="primary" @click="login"><font style="font-size:22px">立即登录</font></el-button>
+                    </div>
+                  </div>
+
+                </div>
+              </div>
+            </div>
+          </div>
+        </el-col>
+        <el-col :xs="0"  :sm="1"  :md="2"  :lg="1"  :xl="1"><div class="grid-content "></div></el-col>
+        <el-col :xs="0"  :sm="1"  :md="2"  :lg="2"  :xl="1"><div class="grid-content "></div></el-col>
+        <el-col :xs="0"  :sm="0"  :md="2"  :lg="2"  :xl="4"><div class="grid-content "></div></el-col>
+    </el-row>
+    </template>
+  </div>
+</template>
+<script>
+  import {mapActions} from 'vuex';
+  let background = require('../assets/login/logbackground.png');
+  let logo = require('../assets/login/logo.png');
+  export default {
+    name: 'login',
+    data () {
+      return {
+        imgSrc:background,
+        bodyDefaultStyle:{height:"0px", width:"100%"},
+        logoImg:logo,
+
+    
+
+        loginId:"",
+        pwd:"",
+        errMsg:"错误消息",
+      }
+    },
+    mounted() {
+      let _this = this;
+      window.onresize = () => {
+        
+        _this.initBodyHeight();    // 获取页面滚动高度
+      };
+    },
+    created() {
+      this.initBodyHeight();
+    },
+    destroyed() {
+      console.log("onresize已销毁");
+      window.onresize = null;
+    },
+    methods: {
+      initBodyHeight() {
+        this.bodyDefaultStyle.height = window.innerHeight-20+"px";
+        console.log(window.innerHeight-40 +"px");
+      },
+      async login(){
+        let pwd = this.pwd;
+        let loginId = this.loginId;
+        if (!pwd || !loginId) {
+          this.$message.error("请输入账号密码");
+          return;
+        }
+        let result = await this.$store.dispatch('users/login', { loginId:this.loginId, pwd:this.pwd });
+        if (result.success) {
+          this.$router.push({path: '/home'});
+        } else {
+          this.$message.error(result.msg);
+        }
+      }
+    }
+  }
+</script>
+<style type="text/css">
+ .loginBackgroundInfo{
+    width:100%;  
+    height:100%;  /**宽高100%是为了图片铺满屏幕 */
+    z-index:-1;
+    position: absolute;
+ }
+  .grid-content {
+    border-radius: 4px;
+    min-height: 36px;
+  }
+  .loginBody {
+    height: 600px;
+    width: 100%;
+  }
+  .logoStyle {
+    width: 100%;
+    height: 94px;
+  }
+  .bodyBack{
+    background-color: rgb(0 0 0 / 15%);
+    width: 630px;
+    height: 430px;
+    min-height: 150px;
+    background-size:100% 100%;
+    position: absolute;
+    top: 20%;
+    margin: 0 0 0 0;
+    text-align: center;
+  }
+  .logoImg{
+    position: relative;
+    top: 20px;
+  }
+  .boxStyle{
+    width: 100%;
+    height: 76px;
+    text-align: center;
+  }
+  .subBoxStyle{
+    position: relative;
+    top: 26px;
+    width: 460px;
+    height: 50px;
+    margin:0 auto;
+  }
+  .subBoxStyle .el-input__inner {
+    height: 50px !important;
+    background-color: rgb(0 0 0 / 15%);
+  }
+  .subBoxStyle .el-button {
+    height: 100% !important;
+    width: 100% !important;
+    border-radius: 0px;
+    background-color: rgb(255 255 255 / 15%);
+    border-color: rgb(255 255 255 / 35%);
+  }
+  .msgBoxStyle{
+    width: 100%;
+    height: 18px;
+    text-align: left;
+  }
+  .msgStyle{
+    position: relative;
+    left: 85px;
+    text-align: left;
+    width: 50%;
+    height: 100%;
+  }
+  .bodyBorder {
+    width: 94%;
+    height: 94%;
+    border: 1px solid rgb(255 255 255 / 15%)!important;
+    margin: 2% auto;
+  }
+  
+</style>

src/pages/menu.vue

+<template>
+    <div >
+        <el-menu
+         default-active="2"
+         class="el-menu-vertical-demo"
+        @open="handleOpen"
+        @close="handleClose"
+        background-color="transparent"
+        text-color="#fff"
+        active-text-color="#ffd04b"
+        :router="true"
+        >
+             <el-submenu v-for="(item, i) in menuInfoList" :index="item.index + ''" :key="i">
+                <template slot="title"> <font class="menuFont"><i :class="item.icon"></i>{{item.name}}</font></template>
+                    <el-menu-item v-for="(subInfo, subI) in item.subList" :index="i+''+subI" :key="subI" :route="subInfo.path">
+                        <i class="el-icon-right"></i>{{subInfo.subName}}
+                    </el-menu-item>
+            </el-submenu>
+        </el-menu>
+    </div>
+    
+</template>
+
+<script type="text/javascript">
+import getThreeEnum from './../server/menu.js'
+export default {
+    data() {
+        return {
+            menuInfoList:[]
+        };
+    },
+    created() {
+        this.menuInfoList = getThreeEnum();
+        
+    },
+
+    methods: {
+        changeEnum (info) {
+          sessionStorage.setItem("defaultPagesInfo", JSON.stringify(info));
+          this.$emit('checkMenu', {index:info.index});
+        },
+        handleOpen (key, index) {
+        },
+        handleClose (key, index) {
+        }
+    }
+};
+</script>
+<style type="text/css">
+/* .menuFont {
+    font-size: 16px;
+}
+.menuSubFont {
+    font-size: 12px;
+}
+.el-menu {
+    background:transparent
+}
+
+.el-menu-item.is-active{
+border-left: solid 3px #26a1fa;
+background: red !important;
+}
+.el-menu {
+    background:transparent
+}
+.el-menu:active,.el-menu:focus {
+    background: rgb(255 255 255 / 15%);
+} */
+
+.el-menu-item.is-active {
+    background:transparent !important;
+}
+.el-submenu__title:focus,.el-submenu__title:hover {
+    /* background:transparent !important; */
+    background:rgb(255 255 255 / 15%) !important;
+}
+.el-menu-item{
+    border: 1px solid rgb(255 255 255 / 12%);
+}
+.el-menu-item:active,.el-menu-item:focus,.el-menu-item:hover {
+    /* background:transparent !important; */
+    background:rgb(255 255 255 / 15%) !important;
+}
+.el-submenu .el-menu-item {
+    min-width: 190px;
+}
+</style>
+

src/pages/new/css/component.css

+@font-face {
+	font-family: 'typicons';
+	src:url('../fonts/typicons/typicons.eot');
+	src:url('../fonts/typicons/typicons.eot?#iefix') format('embedded-opentype'),
+		url('../fonts/typicons/typicons.ttf') format('truetype'),
+		url('../fonts/typicons/typicons.woff') format('woff'),
+		url('../fonts/typicons/typicons.svg#typicons') format('svg');
+	font-weight: normal;
+	font-style: normal;
+}
+
+html, body, .perspective {
+	width: 100%;
+	height: 100%;
+}
+
+.perspective {
+	background: #aaa;
+	position: relative;
+}
+
+.container {
+	background: #fff;
+	min-height: 100%;
+	position: relative;
+	outline: 1px solid rgba(0,0,0,0);
+	z-index: 10;
+}
+
+.container::after {
+	content: '';
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 0px;
+	opacity: 0;
+	background: rgba(0,0,0,0.2);
+	/* the transition delay of the height needs to be synced with the container transition time */
+	-webkit-transition: opacity 0.4s, height 0s 0.4s;
+	transition: opacity 0.4s, height 0s 0.4s;
+}
+
+.wrapper {
+	position: relative;
+}
+
+.component {
+	margin: 0 auto;
+	width: 60%;
+	text-align: justify;
+	font-size: 1.5em;
+}
+
+/* Modal view */
+.perspective.modalview {
+	position: fixed;
+	-webkit-perspective: 1500px;
+	perspective: 1500px;
+}
+
+.modalview .container {
+	position: absolute;
+	overflow: hidden;
+	width: 100%;
+	height: 100%;
+	cursor: pointer;
+	-webkit-backface-visibility: hidden;
+	backface-visibility: hidden;
+}
+
+.modalview .wrapper {
+	-webkit-transform: translateZ(-1px); /* solves a rendering bug in Chrome on Windows */
+}
+
+.animate .container::after {
+	opacity: 1;
+	height: 101%;
+	-webkit-transition: opacity 0.3s;
+	transition: opacity 0.3s;
+}
+
+/* Outer Nav */
+.outer-nav {
+	position: absolute;
+	height: auto;
+	font-size: 2em;
+}
+
+.outer-nav.vertical {
+	top: 50%;
+	-webkit-transform: translateY(-50%);
+	transform: translateY(-50%);
+	-webkit-transform-style: preserve-3d;
+	transform-style: preserve-3d;
+}
+
+.outer-nav.horizontal {
+	left: 50%;
+	width: 75%;
+	max-width: 1000px;
+	text-align: center;
+	-webkit-transform: translateX(-50%);
+	transform: translateX(-50%);
+}
+
+.outer-nav.left {
+	left: 25%;
+}
+
+.outer-nav.right {
+	right: 25%;
+}
+
+.outer-nav.top {
+	top: 25%;
+}
+
+.outer-nav.bottom {
+	bottom: 25%;
+}
+
+.outer-nav a {
+	display: inline-block;
+	white-space: nowrap;
+	font-weight: 300;
+	margin: 0 0 30px 0;
+	color: #fff;
+	-webkit-transition: color 0.3s;
+	transition: color 0.3s;
+	-webkit-transform-style: preserve-3d;
+	transform-style: preserve-3d;
+}
+
+.outer-nav a:hover {
+	color: #ffdccd;
+}
+
+.outer-nav.vertical a {
+	display: block;
+}
+
+.outer-nav.horizontal a {
+	margin: 15px 20px;
+}
+
+.outer-nav a::before {
+	display: inline-block;
+	font-family: 'typicons';
+	speak: none;
+	font-style: normal;
+	font-weight: normal;
+	font-variant: normal;
+	text-transform: none;
+	line-height: 1;
+	margin-right: 10px;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+	-webkit-backface-visibility: hidden;
+	backface-visibility: hidden;
+}
+
+.icon-news::before { content: "\e600" }
+.icon-home::before { content: "\e601" }
+.icon-image::before { content: "\e602" }
+.icon-upload::before { content: "\e603" }
+.icon-star::before { content: "\e604" }
+.icon-mail::before { content: "\e605" }
+.icon-lock::before { content: "\e606" }
+.icon-chart-pie::before { content: "\e607" }
+
+/* Individual Effects */
+
+/* Effect airbnb */
+.effect-airbnb {
+	background: #b8b6b4;
+}
+
+.effect-airbnb .container {
+	-webkit-transition: -webkit-transform 0.4s;
+	transition: transform 0.4s;
+	-webkit-transform-origin: 50% 50%;
+	transform-origin: 50% 50%;
+}
+
+.effect-airbnb.animate .container {
+	-webkit-transform: translateZ(-1500px) translateX(100%) rotateY(-45deg);
+	transform: translateZ(-1500px) translateX(100%) rotateY(-45deg);
+}
+
+.no-csstransforms3d .effect-airbnb.animate .container {
+	left: 75%;
+}
+
+.effect-airbnb .outer-nav a {
+	opacity: 0;
+	-webkit-transform: translateX(-150px);
+	transform: translateX(-150px);
+	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
+	transition: transform 0.4s, opacity 0.4s;
+}
+
+.effect-airbnb.animate .outer-nav a {
+	opacity: 1;
+	-webkit-transform: translateX(0);
+	transform: translateX(0);
+}
+
+.effect-airbnb.animate .outer-nav a:nth-child(2) {
+	-webkit-transition-delay: 0.04s;
+	transition-delay: 0.04s;
+}
+
+.effect-airbnb.animate .outer-nav a:nth-child(3) {
+	-webkit-transition-delay: 0.08s;
+	transition-delay: 0.08s;
+}
+
+.effect-airbnb.animate .outer-nav a:nth-child(4) {
+	-webkit-transition-delay: 0.12s;
+	transition-delay: 0.12s;
+}
+
+.effect-airbnb.animate .outer-nav a:nth-child(5) {
+	-webkit-transition-delay: 0.16s;
+	transition-delay: 0.16s;
+}
+
+.effect-airbnb.animate .outer-nav a:nth-child(6) {
+	-webkit-transition-delay: 0.2s;
+	transition-delay: 0.2s;
+}
+
+.effect-airbnb.animate .outer-nav a:nth-child(7) {
+	-webkit-transition-delay: 0.24s;
+	transition-delay: 0.24s;
+}
+
+/* Effect Move Left */
+.effect-moveleft {
+	background: #f4f3f1;
+}
+
+.effect-moveleft .container {
+	-webkit-transition: -webkit-transform 0.4s;
+	transition: transform 0.4s;
+	-webkit-transform-origin: 50% 50%;
+	transform-origin: 50% 50%;
+}
+
+.effect-moveleft .container::after {
+	background: rgba(255,255,255,0.6);
+}
+
+.effect-moveleft.animate .container {
+	-webkit-transform: translateX(-50%) rotateY(45deg) translateZ(-50px);
+	transform: translateX(-50%) rotateY(45deg) translateZ(-50px);
+}
+
+.no-csstransforms3d .effect-moveleft.animate .container {
+	left: -75%;
+}
+
+.effect-moveleft .outer-nav a {
+	color: #e86a32;
+	opacity: 0;
+	-webkit-transform: translateX(100px) translateZ(-1000px);
+	transform: translateX(100px) translateZ(-1000px);
+	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
+	transition: transform 0.4s, opacity 0.4s;
+}
+
+.effect-moveleft .outer-nav a:hover {
+	color: #333;
+}
+
+.effect-moveleft.animate .outer-nav a {
+	opacity: 1;
+	-webkit-transform: translateX(0) translateZ(0);
+	transform: translateX(0) translateZ(0);
+}
+
+.effect-moveleft.animate .outer-nav a:nth-child(2) {
+	-webkit-transition-delay: 0.04s;
+	transition-delay: 0.04s;
+}
+
+.effect-moveleft.animate .outer-nav a:nth-child(3) {
+	-webkit-transition-delay: 0.08s;
+	transition-delay: 0.08s;
+}
+
+.effect-moveleft.animate .outer-nav a:nth-child(4) {
+	-webkit-transition-delay: 0.12s;
+	transition-delay: 0.12s;
+}
+
+.effect-moveleft.animate .outer-nav a:nth-child(5) {
+	-webkit-transition-delay: 0.16s;
+	transition-delay: 0.16s;
+}
+
+.effect-moveleft.animate .outer-nav a:nth-child(6) {
+	-webkit-transition-delay: 0.2s;
+	transition-delay: 0.2s;
+}
+
+.effect-moveleft.animate .outer-nav a:nth-child(7) {
+	-webkit-transition-delay: 0.24s;
+	transition-delay: 0.24s;
+}
+
+/* Effect Rotate Left */
+.effect-rotateleft {
+	background: #e96e4f;
+}
+
+.effect-rotateleft .container {
+	-webkit-transition: -webkit-transform 0.4s;
+	transition: transform 0.4s;
+	-webkit-transform-origin: 0% 50%;
+	transform-origin: 0% 50%;
+}
+
+.effect-rotateleft .container::after {
+	background: rgba(255,255,255,0.6);
+}
+
+.effect-rotateleft.animate .container {
+	-webkit-transform: translateZ(-1800px) translateX(-50%) rotateY(45deg);
+	transform: translateZ(-1800px) translateX(-50%) rotateY(45deg);
+}
+
+.no-csstransforms3d .effect-rotateleft.animate .container {
+	left: -75%;
+}
+
+.effect-rotateleft .outer-nav a {
+	opacity: 0;
+	-webkit-transform: translateX(350px) translateZ(-1000px);
+	transform: translateX(350px) translateZ(-1000px);
+	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
+	transition: transform 0.4s, opacity 0.4s;
+}
+
+.effect-rotateleft.animate .outer-nav a {
+	opacity: 1;
+	-webkit-transform: translateX(0) translateZ(0);
+	transform: translateX(0) translateZ(0);
+}
+
+.effect-rotateleft.animate .outer-nav a:nth-child(2) {
+	-webkit-transition-delay: 0.04s;
+	transition-delay: 0.04s;
+}
+
+.effect-rotateleft.animate .outer-nav a:nth-child(3) {
+	-webkit-transition-delay: 0.08s;
+	transition-delay: 0.08s;
+}
+
+.effect-rotateleft.animate .outer-nav a:nth-child(4) {
+	-webkit-transition-delay: 0.08s;
+	transition-delay: 0.08s;
+}
+
+.effect-rotateleft.animate .outer-nav a:nth-child(5) {
+	-webkit-transition-delay: 0.16s;
+	transition-delay: 0.16s;
+}
+
+.effect-rotateleft.animate .outer-nav a:nth-child(6) {
+	-webkit-transition-delay: 0.2s;
+	transition-delay: 0.2s;
+}
+
+.effect-rotateleft.animate .outer-nav a:nth-child(7) {
+	-webkit-transition-delay: 0.24s;
+	transition-delay: 0.24s;
+}
+
+/* Effect Move Down */
+.effect-movedown {
+	background: #34495e;
+}
+
+.effect-movedown .container {
+	-webkit-transition: -webkit-transform 0.4s;
+	transition: transform 0.4s;
+	-webkit-transform-origin: 50% 50%;
+	transform-origin: 50% 50%;
+}
+
+.effect-movedown .container::after {
+	background: rgba(52, 73, 94, 0.5);
+}
+
+.effect-movedown.animate .container {
+	-webkit-transform: translateY(100%) translateZ(-1500px);
+	transform: translateY(100%) translateZ(-1500px);
+}
+
+.no-csstransforms3d .effect-movedown.animate .container {
+	top: 75%;
+}
+
+.effect-movedown .outer-nav a {
+	opacity: 0;
+	-webkit-transform: translateY(-20px);
+	transform: translateY(-20px);
+	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
+	transition: transform 0.4s, opacity 0.4s;
+}
+
+.effect-movedown .outer-nav a:hover {
+	color: #ed8151;
+}
+
+.effect-movedown.animate .outer-nav a {
+	opacity: 1;
+	-webkit-transform: translateY(0);
+	transform: translateY(0);
+}
+
+.effect-movedown.animate .outer-nav a:nth-child(2) {
+	-webkit-transition-delay: 0.04s;
+	transition-delay: 0.04s;
+}
+
+.effect-movedown.animate .outer-nav a:nth-child(3) {
+	-webkit-transition-delay: 0.08s;
+	transition-delay: 0.08s;
+}
+
+.effect-movedown.animate .outer-nav a:nth-child(4) {
+	-webkit-transition-delay: 0.12s;
+	transition-delay: 0.12s;
+}
+
+.effect-movedown.animate .outer-nav a:nth-child(5) {
+	-webkit-transition-delay: 0.16s;
+	transition-delay: 0.16s;
+}
+
+.effect-movedown.animate .outer-nav a:nth-child(6) {
+	-webkit-transition-delay: 0.2s;
+	transition-delay: 0.2s;
+}
+
+.effect-movedown.animate .outer-nav a:nth-child(7) {
+	-webkit-transition-delay: 0.24s;
+	transition-delay: 0.24s;
+}
+
+/* Effect Rotate Top */
+.effect-rotatetop {
+	background: #edcdbb;
+}
+
+.effect-rotatetop .container {
+	-webkit-transition: -webkit-transform 0.4s;
+	transition: transform 0.4s;
+	-webkit-transform-origin: 50% 50%;
+	transform-origin: 50% 50%;
+}
+
+.effect-rotatetop .container::after {
+	background: rgba(94,59,43,0.6);
+}
+
+.effect-rotatetop.animate .container {
+	-webkit-transform: translateZ(-1500px) translateY(-50%) rotateX(-45deg);
+	transform: translateZ(-1500px) translateY(-50%) rotateX(-45deg);
+}
+
+.no-csstransforms3d .effect-rotatetop.animate .container {
+	top: -75%;
+}
+
+.effect-rotatetop .outer-nav a {
+	opacity: 0;
+	color: #ed8151;
+	-webkit-transform: translateY(200px) translateZ(-1000px);
+	transform: translateY(200px) translateZ(-1000px);
+	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
+	transition: transform 0.4s, opacity 0.4s;
+}
+
+.effect-rotatetop .outer-nav a:hover {
+	color: #777;
+}
+
+.effect-rotatetop.animate .outer-nav a {
+	opacity: 1;
+	-webkit-transform: translateY(0) translateZ(0);
+	transform: translateY(0) translateZ(0);
+}
+
+.effect-rotatetop.animate .outer-nav a:nth-child(2) {
+	-webkit-transition-delay: 0.04s;
+	transition-delay: 0.04s;
+}
+
+.effect-rotatetop.animate .outer-nav a:nth-child(3) {
+	-webkit-transition-delay: 0.08s;
+	transition-delay: 0.08s;
+}
+
+.effect-rotatetop.animate .outer-nav a:nth-child(4) {
+	-webkit-transition-delay: 0.12s;
+	transition-delay: 0.12s;
+}
+
+.effect-rotatetop.animate .outer-nav a:nth-child(5) {
+	-webkit-transition-delay: 0.16s;
+	transition-delay: 0.16s;
+}
+
+.effect-rotatetop.animate .outer-nav a:nth-child(6) {
+	-webkit-transition-delay: 0.2s;
+	transition-delay: 0.2s;
+}
+
+.effect-rotatetop.animate .outer-nav a:nth-child(7) {
+	-webkit-transition-delay: 0.24s;
+	transition-delay: 0.24s;
+}
+
+/* Effect Lay Down */
+.effect-laydown {
+	background: #b8b6b4;
+}
+
+.effect-laydown .container {
+	-webkit-transition: -webkit-transform 0.4s;
+	transition: transform 0.4s;
+	-webkit-transform-origin: 50% 150%;
+	transform-origin: 50% 150%;
+}
+
+.effect-laydown.animate .container {
+	-webkit-transform: translateZ(-1500px) rotateX(80deg);
+	transform: translateZ(-1500px) rotateX(80deg);
+}
+
+.no-csstransforms3d .effect-laydown.animate .container {
+	top: 75%;
+}
+
+.effect-laydown .outer-nav a {
+	opacity: 0;
+	-webkit-transform: translateY(-200px) translateZ(-1000px);
+	transform: translateY(-200px) translateZ(-1000px);
+	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
+	transition: transform 0.4s, opacity 0.4s;
+}
+
+.effect-laydown.animate .outer-nav a {
+	opacity: 1;
+	-webkit-transform: translateY(0) translateZ(0);
+	transform: translateY(0) translateZ(0);
+}
+
+.effect-laydown.animate .outer-nav a:nth-child(7){
+	-webkit-transition-delay: 0.0s;
+	transition-delay: 0.0s;
+}
+
+.effect-laydown.animate .outer-nav a:nth-child(6) {
+	-webkit-transition-delay: 0.04s;
+	transition-delay: 0.04s;
+}
+
+.effect-laydown.animate .outer-nav a:nth-child(5) {
+	-webkit-transition-delay: 0.08s;
+	transition-delay: 0.08s;
+}
+
+.effect-laydown.animate .outer-nav a:nth-child(4) {
+	-webkit-transition-delay: 0.12s;
+	transition-delay: 0.12s;
+}
+
+.effect-laydown.animate .outer-nav a:nth-child(3) {
+	-webkit-transition-delay: 0.16s;
+	transition-delay: 0.16s;
+}
+
+.effect-laydown.animate .outer-nav a:nth-child(2) {
+	-webkit-transition-delay: 0.2s;
+	transition-delay: 0.2s;
+}
+
+.effect-laydown.animate .outer-nav a:first-child {
+	-webkit-transition-delay: 0.24s;
+	transition-delay: 0.24s;
+}
+
+/* Media Queries */
+@media screen and (max-width: 77em) {
+	
+	.outer-nav.top {
+		top: 15%;
+	}
+
+	.outer-nav.bottom {
+		bottom: 15%;
+	}
+}
+
+@media screen and (max-width: 36.625em), screen and (max-height: 41.75em) {
+
+	.outer-nav.top {
+		top: 5%;
+	}
+
+	.outer-nav.bottom {
+		bottom: 5%;
+	}
+	
+	.outer-nav.horizontal {
+		font-size: 1.7em;
+		width: 6.2em;
+	}
+
+	.outer-nav.horizontal a {
+		display: block;
+		text-align: left;
+	}
+
+	/* Special Case */
+	.effect-rotatetop .outer-nav.horizontal {
+		width: 95%;
+		bottom: auto;
+		top: 50%;
+	}
+
+	.effect-rotatetop .outer-nav.horizontal a {
+		display: inline-block;
+	}
+
+}
+
+@media screen and (max-width: 31em), screen and (max-height: 36.2em) {
+	.outer-nav.horizontal,
+	.outer-nav.vertical {
+		font-size: 1.2em;
+		width: 6.8em;
+	}
+
+	.outer-nav.right {
+		right: auto;
+		left: 50%;
+	}
+}
+
+@media screen and (max-height: 31.6em) {
+	.outer-nav a {
+		margin-bottom: 20px;
+	}
+}
\ No newline at end of file

src/pages/new/css/demo.css

+@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
+@font-face {
+	font-weight: normal;
+	font-style: normal;
+	font-family: 'codropsicons';
+	src:url('../fonts/codropsicons/codropsicons.eot');
+	src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
+		url('../fonts/codropsicons/codropsicons.woff') format('woff'),
+		url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
+		url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
+}
+
+*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
+
+body {
+	background: #ddd;
+	color: #5a5350;
+	font-weight: 300;
+	font-family: 'Lato', Calibri, Arial, sans-serif;
+	overflow-y: scroll;
+	overflow-x: hidden;
+}
+
+a {
+	text-decoration: none;
+	color: #ed8151;
+	outline: none;
+}
+
+a:hover, a:focus {
+	color: #e86a32;
+	outline: none;
+}
+
+/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
+.clearfix:before,
+.clearfix:after {
+	display: table;
+	content: " ";
+}
+
+.clearfix:after {
+	clear: both;
+}
+
+.codrops-header,
+.codrops-top {
+	font-family: 'Lato', Arial, sans-serif;
+}
+
+.codrops-header {
+	margin: 0 auto 3em;
+	padding: 3em;
+	text-align: center;
+}
+
+.codrops-header h1 {
+	margin: 0;
+	font-weight: 300;
+	font-size: 2.625em;
+	line-height: 1.3;
+}
+
+.codrops-header span {
+	display: block;
+	padding: 0 0 0.6em 0.1em;
+	font-size: 60%;
+	color: #aca89a;
+}
+
+/* To Navigation Style */
+.codrops-top {
+	width: 100%;
+	text-transform: uppercase;
+	font-size: 0.69em;
+	line-height: 2.2;
+	font-weight: 700;
+	background: rgba(255,255,255,0.3);
+}
+
+.codrops-top a {
+	display: inline-block;
+	padding: 0 1em;
+	text-decoration: none;
+	letter-spacing: 0.1em;
+}
+
+.codrops-top a:hover {
+	background: rgba(255,255,255,0.4);
+	color: #333;
+}
+
+.codrops-top span.right {
+	float: right;
+}
+
+.codrops-top span.right a {
+	display: block;
+	float: left;
+}
+
+.codrops-icon:before {
+	margin: 0 4px;
+	text-transform: none;
+	font-weight: normal;
+	font-style: normal;
+	font-variant: normal;
+	font-family: 'codropsicons';
+	line-height: 1;
+	speak: none;
+	-webkit-font-smoothing: antialiased;
+}
+
+.codrops-icon-drop:before {
+	content: "\e001";
+}
+
+.codrops-icon-prev:before {
+	content: "\e004";
+}
+
+.main {
+	max-width: 69em;
+	margin: 0 auto;
+}
+
+.column {
+	float: left;
+	width: 50%;
+	padding: 0 2em;
+	min-height: 300px;
+	position: relative;
+	text-align: right;
+}
+
+.column:nth-child(2) {
+	box-shadow: -1px 0 0 rgba(0,0,0,0.1);
+	text-align: left;
+}
+
+.column p {
+	font-weight: 300;
+	font-size: 2em;
+	padding: 0 0 0.5em;
+	margin: 0;
+	line-height: 1.5;
+}
+
+.codrops-demos a,
+button {
+	border: none;
+	padding: 0.6em 1.2em;
+	background: #a9a9a9;
+	color: #fff;
+	font-family: 'Lato', Calibri, Arial, sans-serif;
+	font-size: 1em;
+	letter-spacing: 1px;
+	text-transform: uppercase;
+	cursor: pointer;
+	display: inline-block;
+	margin: 10px;
+	border-radius: 2px;
+	font-weight: 400;
+	outline: none;
+}
+
+.codrops-demos a:hover,
+.codrops-demos a:active,
+.codrops-demos a.current-demo {
+	background: #777;
+}
+
+button {
+	font-size: 75%;
+	background: #ed8151;
+}
+
+button:hover,
+button:active {
+	background: #e86a32;
+}
+
+.related {
+	text-align: center;
+	font-size: 1.5em;
+	margin-top: 3em;
+	clear: both;
+	padding: 3em 0;
+}
+
+.related a {
+	font-weight: 700;
+	font-size: 0.9em;
+}
+
+@media screen and (max-width: 46.0625em) {
+
+	.codrops-header {
+		margin-bottom: 0;
+		padding-bottom: 1em;
+	}
+
+	.column {
+		width: 100%;
+		min-width: auto;
+		min-height: 0;
+		padding: 2em; 
+		text-align: center;
+	}
+
+	.column p {
+		font-size: 1.5em;
+	}
+
+	.column:nth-child(2) {
+		text-align: center;
+		box-shadow: 0 -1px 0 rgba(0,0,0,0.1);
+	}
+}
+
+@media screen and (max-width: 25em) {
+
+	.codrops-header {
+		font-size: 80%;
+	}
+
+	.codrops-top {
+		font-size: 120%;
+	}
+
+	.codrops-icon span {
+		display: none;
+	}
+
+}
\ No newline at end of file

src/pages/new/css/normalize.css

+article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
\ No newline at end of file

src/pages/new/js/classie.js

+/*!
+ * classie - class helper functions
+ * from bonzo https://github.com/ded/bonzo
+ * 
+ * classie.has( elem, 'my-class' ) -> true/false
+ * classie.add( elem, 'my-new-class' )
+ * classie.remove( elem, 'my-unwanted-class' )
+ * classie.toggle( elem, 'my-class' )
+ */
+
+/*jshint browser: true, strict: true, undef: true */
+/*global define: false */
+
+( function( window ) {
+
+    'use strict';
+    
+    // class helper functions from bonzo https://github.com/ded/bonzo
+    
+    function classReg( className ) {
+      return new RegExp("(^|\\s+)" + className + "(\\s+|$)");
+    }
+    
+    // classList support for class management
+    // altho to be fair, the api sucks because it won't accept multiple classes at once
+    var hasClass, addClass, removeClass;
+    
+    if ( 'classList' in document.documentElement ) {
+      hasClass = function( elem, c ) {
+        return elem.classList.contains( c );
+      };
+      addClass = function( elem, c ) {
+        elem.classList.add( c );
+      };
+      removeClass = function( elem, c ) {
+        elem.classList.remove( c );
+      };
+    }
+    else {
+      hasClass = function( elem, c ) {
+        return classReg( c ).test( elem.className );
+      };
+      addClass = function( elem, c ) {
+        if ( !hasClass( elem, c ) ) {
+          elem.className = elem.className + ' ' + c;
+        }
+      };
+      removeClass = function( elem, c ) {
+        elem.className = elem.className.replace( classReg( c ), ' ' );
+      };
+    }
+    
+    function toggleClass( elem, c ) {
+      var fn = hasClass( elem, c ) ? removeClass : addClass;
+      fn( elem, c );
+    }
+    
+    var classie = {
+      // full names
+      hasClass: hasClass,
+      addClass: addClass,
+      removeClass: removeClass,
+      toggleClass: toggleClass,
+      // short names
+      has: hasClass,
+      add: addClass,
+      remove: removeClass,
+      toggle: toggleClass
+    };
+    
+    // transport
+    if ( typeof define === 'function' && define.amd ) {
+      // AMD
+      define( classie );
+    } else {
+      // browser global
+      window.classie = classie;
+    }
+    
+    })( window );
\ No newline at end of file

src/pages/new/js/menu.js

+/**
+ * menu.js v1.0.0
+ * http://www.codrops.com
+ *
+ * Licensed under the MIT license.
+ * http://www.opensource.org/licenses/mit-license.php
+ * 
+ * Copyright 2013, Codrops
+ * http://www.codrops.com
+ */
+ (function() {
+	
+	function scrollY() {
+		return window.pageYOffset || docElem.scrollTop;
+	}
+
+	// from http://stackoverflow.com/a/11381730/989439
+	function mobilecheck() {
+		var check = false;
+		(function(a){if(/(android|ipad|playbook|silk|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))check = true})(navigator.userAgent||navigator.vendor||window.opera);
+		return check;
+	}
+
+	var docElem = window.document.documentElement,
+		// support transitions
+		support = Modernizr.csstransitions,
+		// transition end event name
+		transEndEventNames = {
+			'WebkitTransition': 'webkitTransitionEnd',
+			'MozTransition': 'transitionend',
+			'OTransition': 'oTransitionEnd',
+			'msTransition': 'MSTransitionEnd',
+			'transition': 'transitionend'
+		},
+		transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
+		docscroll = 0,
+		// click event (if mobile use touchstart)
+		clickevent = mobilecheck() ? 'touchstart' : 'click';
+
+	function init() {
+		var showMenu = document.getElementById( 'showMenu' ),
+			perspectiveWrapper = document.getElementById( 'perspective' ),
+			container = perspectiveWrapper.querySelector( '.container' ),
+			contentWrapper = container.querySelector( '.wrapper' );
+
+		showMenu.addEventListener( clickevent, function( ev ) {
+			ev.stopPropagation();
+			ev.preventDefault();
+			docscroll = scrollY();
+			// change top of contentWrapper
+			contentWrapper.style.top = docscroll * -1 + 'px';
+			// mac chrome issue:
+			document.body.scrollTop = document.documentElement.scrollTop = 0;
+			// add modalview class
+			classie.add( perspectiveWrapper, 'modalview' );
+			// animate..
+			setTimeout( function() { classie.add( perspectiveWrapper, 'animate' ); }, 25 );
+		});
+
+		container.addEventListener( clickevent, function( ev ) {
+			if( classie.has( perspectiveWrapper, 'animate') ) {
+				var onEndTransFn = function( ev ) {
+					if( support && ( ev.target.className !== 'container' || ev.propertyName.indexOf( 'transform' ) == -1 ) ) return;
+					this.removeEventListener( transEndEventName, onEndTransFn );
+					classie.remove( perspectiveWrapper, 'modalview' );
+					// mac chrome issue:
+					document.body.scrollTop = document.documentElement.scrollTop = docscroll;
+					// change top of contentWrapper
+					contentWrapper.style.top = '0px';
+				};
+				if( support ) {
+					perspectiveWrapper.addEventListener( transEndEventName, onEndTransFn );
+				}
+				else {
+					onEndTransFn.call();
+				}
+				classie.remove( perspectiveWrapper, 'animate' );
+			}
+		});
+
+		perspectiveWrapper.addEventListener( clickevent, function( ev ) { return false; } );
+	}
+
+	init();
+
+})();
\ No newline at end of file

src/pages/new/js/modernizr.js

+/* Modernizr 2.7.1 (Custom Build) | MIT & BSD
+ * Build: http://modernizr.com/download/#-csstransforms3d-csstransitions-shiv-cssclasses-prefixed-teststyles-testprop-testallprops-prefixes-domprefixes-load
+ */
+;window.Modernizr=function(a,b,c){function z(a){j.cssText=a}function A(a,b){return z(m.join(a+";")+(b||""))}function B(a,b){return typeof a===b}function C(a,b){return!!~(""+a).indexOf(b)}function D(a,b){for(var d in a){var e=a[d];if(!C(e,"-")&&j[e]!==c)return b=="pfx"?e:!0}return!1}function E(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:B(f,"function")?f.bind(d||b):f}return!1}function F(a,b,c){var d=a.charAt(0).toUpperCase()+a.slice(1),e=(a+" "+o.join(d+" ")+d).split(" ");return B(b,"string")||B(b,"undefined")?D(e,b):(e=(a+" "+p.join(d+" ")+d).split(" "),E(e,b,c))}var d="2.7.1",e={},f=!0,g=b.documentElement,h="modernizr",i=b.createElement(h),j=i.style,k,l={}.toString,m=" -webkit- -moz- -o- -ms- ".split(" "),n="Webkit Moz O ms",o=n.split(" "),p=n.toLowerCase().split(" "),q={},r={},s={},t=[],u=t.slice,v,w=function(a,c,d,e){var f,i,j,k,l=b.createElement("div"),m=b.body,n=m||b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:h+(d+1),l.appendChild(j);return f=["&#173;",'<style id="s',h,'">',a,"</style>"].join(""),l.id=h,(m?l:n).innerHTML+=f,n.appendChild(l),m||(n.style.background="",n.style.overflow="hidden",k=g.style.overflow,g.style.overflow="hidden",g.appendChild(n)),i=c(l,a),m?l.parentNode.removeChild(l):(n.parentNode.removeChild(n),g.style.overflow=k),!!i},x={}.hasOwnProperty,y;!B(x,"undefined")&&!B(x.call,"undefined")?y=function(a,b){return x.call(a,b)}:y=function(a,b){return b in a&&B(a.constructor.prototype[b],"undefined")},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!="function")throw new TypeError;var d=u.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(u.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(u.call(arguments)))};return e}),q.csstransforms3d=function(){var a=!!F("perspective");return a&&"webkitPerspective"in g.style&&w("@media (transform-3d),(-webkit-transform-3d){#modernizr{left:9px;position:absolute;height:3px;}}",function(b,c){a=b.offsetLeft===9&&b.offsetHeight===3}),a},q.csstransitions=function(){return F("transition")};for(var G in q)y(q,G)&&(v=G.toLowerCase(),e[v]=q[G](),t.push((e[v]?"":"no-")+v));return e.addTest=function(a,b){if(typeof a=="object")for(var d in a)y(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,typeof f!="undefined"&&f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},z(""),i=k=null,function(a,b){function l(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function m(){var a=s.elements;return typeof a=="string"?a.split(" "):a}function n(a){var b=j[a[h]];return b||(b={},i++,a[h]=i,j[i]=b),b}function o(a,c,d){c||(c=b);if(k)return c.createElement(a);d||(d=n(c));var g;return d.cache[a]?g=d.cache[a].cloneNode():f.test(a)?g=(d.cache[a]=d.createElem(a)).cloneNode():g=d.createElem(a),g.canHaveChildren&&!e.test(a)&&!g.tagUrn?d.frag.appendChild(g):g}function p(a,c){a||(a=b);if(k)return a.createDocumentFragment();c=c||n(a);var d=c.frag.cloneNode(),e=0,f=m(),g=f.length;for(;e<g;e++)d.createElement(f[e]);return d}function q(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return s.shivMethods?o(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/[\w\-]+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(s,b.frag)}function r(a){a||(a=b);var c=n(a);return s.shivCSS&&!g&&!c.hasCSS&&(c.hasCSS=!!l(a,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")),k||q(a,c),a}var c="3.7.0",d=a.html5||{},e=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,f=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,g,h="_html5shiv",i=0,j={},k;(function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",g="hidden"in a,k=a.childNodes.length==1||function(){b.createElement("a");var a=b.createDocumentFragment();return typeof a.cloneNode=="undefined"||typeof a.createDocumentFragment=="undefined"||typeof a.createElement=="undefined"}()}catch(c){g=!0,k=!0}})();var s={elements:d.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:c,shivCSS:d.shivCSS!==!1,supportsUnknownElements:k,shivMethods:d.shivMethods!==!1,type:"default",shivDocument:r,createElement:o,createDocumentFragment:p};a.html5=s,r(b)}(this,b),e._version=d,e._prefixes=m,e._domPrefixes=p,e._cssomPrefixes=o,e.testProp=function(a){return D([a])},e.testAllProps=F,e.testStyles=w,e.prefixed=function(a,b,c){return b?F(a,b,c):F(a,"pfx")},g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+t.join(" "):""),e}(this,this.document),function(a,b,c){function d(a){return"[object Function]"==o.call(a)}function e(a){return"string"==typeof a}function f(){}function g(a){return!a||"loaded"==a||"complete"==a||"uninitialized"==a}function h(){var a=p.shift();q=1,a?a.t?m(function(){("c"==a.t?B.injectCss:B.injectJs)(a.s,0,a.a,a.x,a.e,1)},0):(a(),h()):q=0}function i(a,c,d,e,f,i,j){function k(b){if(!o&&g(l.readyState)&&(u.r=o=1,!q&&h(),l.onload=l.onreadystatechange=null,b)){"img"!=a&&m(function(){t.removeChild(l)},50);for(var d in y[c])y[c].hasOwnProperty(d)&&y[c][d].onload()}}var j=j||B.errorTimeout,l=b.createElement(a),o=0,r=0,u={t:d,s:c,e:f,a:i,x:j};1===y[c]&&(r=1,y[c]=[]),"object"==a?l.data=c:(l.src=c,l.type=a),l.width=l.height="0",l.onerror=l.onload=l.onreadystatechange=function(){k.call(this,r)},p.splice(e,0,u),"img"!=a&&(r||2===y[c]?(t.insertBefore(l,s?null:n),m(k,j)):y[c].push(l))}function j(a,b,c,d,f){return q=0,b=b||"j",e(a)?i("c"==b?v:u,a,b,this.i++,c,d,f):(p.splice(this.i++,0,a),1==p.length&&h()),this}function k(){var a=B;return a.loader={load:j,i:0},a}var l=b.documentElement,m=a.setTimeout,n=b.getElementsByTagName("script")[0],o={}.toString,p=[],q=0,r="MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNode,l=a.opera&&"[object Opera]"==o.call(a.opera),l=!!b.attachEvent&&!l,u=r?"object":l?"script":"img",v=l?"script":u,w=Array.isArray||function(a){return"[object Array]"==o.call(a)},x=[],y={},z={timeout:function(a,b){return b.length&&(a.timeout=b[0]),a}},A,B;B=function(a){function b(a){var a=a.split("!"),b=x.length,c=a.pop(),d=a.length,c={url:c,origUrl:c,prefixes:a},e,f,g;for(f=0;f<d;f++)g=a[f].split("="),(e=z[g.shift()])&&(c=e(c,g));for(f=0;f<b;f++)c=x[f](c);return c}function g(a,e,f,g,h){var i=b(a),j=i.autoCallback;i.url.split(".").pop().split("?").shift(),i.bypass||(e&&(e=d(e)?e:e[a]||e[g]||e[a.split("/").pop().split("?")[0]]),i.instead?i.instead(a,e,f,g,h):(y[i.url]?i.noexec=!0:y[i.url]=1,f.load(i.url,i.forceCSS||!i.forceJS&&"css"==i.url.split(".").pop().split("?").shift()?"c":c,i.noexec,i.attrs,i.timeout),(d(e)||d(j))&&f.load(function(){k(),e&&e(i.origUrl,h,g),j&&j(i.origUrl,h,g),y[i.url]=2})))}function h(a,b){function c(a,c){if(a){if(e(a))c||(j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}),g(a,j,b,0,h);else if(Object(a)===a)for(n in m=function(){var b=0,c;for(c in a)a.hasOwnProperty(c)&&b++;return b}(),a)a.hasOwnProperty(n)&&(!c&&!--m&&(d(j)?j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}:j[n]=function(a){return function(){var b=[].slice.call(arguments);a&&a.apply(this,b),l()}}(k[n])),g(a[n],j,b,n,h))}else!c&&l()}var h=!!a.test,i=a.load||a.both,j=a.callback||f,k=j,l=a.complete||f,m,n;c(h?a.yep:a.nope,!!i),i&&c(i)}var i,j,l=this.yepnope.loader;if(e(a))g(a,0,l,0);else if(w(a))for(i=0;i<a.length;i++)j=a[i],e(j)?g(j,0,l,0):w(j)?B(j):Object(j)===j&&h(j,l);else Object(a)===a&&h(a,l)},B.addPrefix=function(a,b){z[a]=b},B.addFilter=function(a){x.push(a)},B.errorTimeout=1e4,null==b.readyState&&b.addEventListener&&(b.readyState="loading",b.addEventListener("DOMContentLoaded",A=function(){b.removeEventListener("DOMContentLoaded",A,0),b.readyState="complete"},0)),a.yepnope=k(),a.yepnope.executeStack=h,a.yepnope.injectJs=function(a,c,d,e,i,j){var k=b.createElement("script"),l,o,e=e||B.errorTimeout;k.src=a;for(o in d)k.setAttribute(o,d[o]);c=j?h:c||f,k.onreadystatechange=k.onload=function(){!l&&g(k.readyState)&&(l=1,c(),k.onload=k.onreadystatechange=null)},m(function(){l||(l=1,c(1))},e),i?k.onload():n.parentNode.insertBefore(k,n)},a.yepnope.injectCss=function(a,c,d,e,g,i){var e=b.createElement("link"),j,c=i?h:c||f;e.href=a,e.rel="stylesheet",e.type="text/css";for(j in d)e.setAttribute(j,d[j]);g||(n.parentNode.insertBefore(e,n),m(c,0))}}(this,document),Modernizr.load=function(){yepnope.apply(window,[].slice.call(arguments,0))};
\ No newline at end of file

src/pages/new/menu.vue

+<template>
+    <div></div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file

src/pages/pm/replenish.vue

+<template>
+    <div class="projectMaintain">
+        <div class="maintainBodyBox">
+           <el-card class="box-card">
+                <el-form ref="form" label-width="80px">
+                    <el-form-item label="项目名称">
+                        <el-input size="mini" style="width:400px" v-model="projectName"></el-input>
+                    </el-form-item>
+                    <el-form-item label="项目类型 ">
+                        <el-select size="mini" v-model="projectType" placeholder="请选择">
+                            <el-option
+                            v-for="item in projectSelectList"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                            </el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="项目背景">
+                        <el-input  type="textarea" size="mini" 
+                        resize="none"
+                        style="width:800px" 
+                        :rows="6"
+                        v-model="projectDes"></el-input>
+                    </el-form-item>
+                </el-form>
+                <div class="updateBodyButtonBox">
+                <el-button size="mini" round>修改基础信息</el-button>
+                </div>
+            </el-card>
+        </div>
+        <div class="null40Div"></div>
+        <div class="maintainBaseBox">
+            <el-card class="box-card">
+                <el-form ref="form" label-width="80px">
+                    <el-form-item label="甲方名称">
+                        <el-input size="mini" style="width:400px" v-model="firstParty"></el-input>
+                    </el-form-item>
+                    <el-form-item label="对接人 ">
+                       <el-input size="mini" style="width:400px" v-model="dockingPerson"></el-input>
+                    </el-form-item>
+                    <el-form-item label="承包类型">
+                         <el-radio-group v-model="contractType">
+                            <el-radio :label="1">总包</el-radio>
+                            <el-radio :label="2">转包</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
+                    <el-form-item label="参与成员">
+                        <el-tag closable type=""> 张三 </el-tag>
+                        <el-tag closable type="info"> 李四 </el-tag>
+                        <el-tag closable type="success"> 王五 </el-tag>
+                        <el-tag closable type="warning"> 赵六 </el-tag>
+                    </el-form-item>
+                </el-form>
+                <div class="updateBaseButtonBox">
+                <el-button size="mini" round>修改</el-button>
+                </div>
+            </el-card>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            projectName:"",
+            projectType:"",
+            projectDes:"",
+            projectSelectList:[
+                {label:"园区", value:1},
+                {label:"教育", value:2},
+                {label:"企业", value:3},
+                {label:"政府", value:4},
+            ],
+            firstParty:"",//甲方名称
+            dockingPerson:"",//对接人
+            contractType:1,//承包类型
+        }
+    },
+    components: { },
+    methods:{
+      
+    } 
+}
+</script>
+
+<style>
+.null40Div{
+    width: 100%;
+    height: 40px;
+}
+.projectMaintain {
+    width: 100%;
+}
+.projectMaintain .maintainBodyBox {
+    width: 66%;
+}
+
+.projectMaintain .el-card  {
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 6px;
+}
+.projectMaintain  .el-form-item__label {
+    color: aliceblue;
+    font-size: 16px;
+}
+.projectMaintain .maintainBodyBox  .updateBodyButtonBox {
+    width: 95%;
+    height: 40px;
+    text-align: right;
+}
+
+/* 卡片二 */
+.projectMaintain .maintainBaseBox {
+    width: 66%;
+}
+.projectMaintain .maintainBaseBox  .updateBaseButtonBox {
+    width: 95%;
+    height: 40px;
+    text-align: right;
+}
+
+
+</style>
\ No newline at end of file

src/pages/pm/stats.vue

+<template>
+    <div>项目经理统计</div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file

src/pages/project/projectInfo.vue

+<template>
+    <div class="projectInfo">
+        <el-row :gutter="24">
+            <el-col :span="8">
+                <div class="leftInfoBox">
+                    <div class="titleBox">
+                        {{projectName}}
+                    </div>
+                    <el-divider content-position="left">项目描述</el-divider>
+                    <div class="desBox">
+                        {{des}}
+                    </div>
+                    <el-divider content-position="left">对接人信息</el-divider>
+                    <div class="joinBox">
+                        <div class="partyAInfo">
+                            <div class="partyATitle">甲方：</div>
+                            <div class="partyAData">{{joinPeopleName}}</div>
+                       </div>
+                       <div class="jointInfo">
+                            <div class="joinTitle">对接人：</div>
+                            <div class="joinData">{{joinPeopleName}}</div>
+                       </div>
+                    </div>
+                    <el-divider content-position="left">进度</el-divider>
+                    <div class="scheduleBox">
+                        <div class="scheduleTimelineBox">
+                             <el-timeline>
+                                <el-timeline-item
+                                v-for="(activity, index) in activities"
+                                :key="index"
+                                :icon="activity.icon"
+                                :type="activity.type"
+                                :color="activity.color"
+                                :size="activity.size"
+                                :timestamp="activity.timestamp">
+                                {{activity.content}}
+                                </el-timeline-item>
+                            </el-timeline>
+                        </div>
+                       
+                    </div>
+                </div>
+            </el-col>
+            <el-col :span="16">
+                <div class="centerInfoBox">
+                    <div class="projectFeedbackTable">
+                        <el-table :data="feedbackList" height="350">
+                            <el-table-column prop="initiateUserName" align="center" width="80" label="发起人">
+                            </el-table-column>
+                            <el-table-column prop="initiateUserTime" align="center" width="180" label="发起时间">
+                            </el-table-column>
+                            <el-table-column prop="targetUserName" align="center" width="120" label="指派人">
+                            </el-table-column>
+                            <el-table-column prop="type" align="center" width="50" label="类型">
+                            </el-table-column>
+                            <el-table-column prop="des" align="center" label="描述">
+                            </el-table-column>
+                        </el-table>
+                    </div>
+                    <el-divider content-position="left">编辑反馈</el-divider>
+                    <div class="projectFeedbackAddBox">
+                        <div class="projectFeedbackInputBox">
+                            <el-input resize="none" type="textarea" :rows="4" placeholder="请输入内容" v-model="addFeedbackInfo.des">
+                            </el-input>
+                        </div>
+                        <el-form ref="form" label-width="80px">
+                            <el-form-item label="指派人">
+                                <el-select size="mini" v-model="addFeedbackInfo.targetList" multiple collapse-tags style="margin-left: 20px;" placeholder="请选择">
+                                    <el-option v-for="item in peopleList" :key="item.value" :label="item.label" :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                             <el-form-item label="反馈类型">
+                                 <el-radio-group v-model="addFeedbackInfo.type">
+                                    <el-radio :label="1">修改</el-radio>
+                                    <el-radio :label="2">投诉</el-radio>
+                                    <el-radio :label="3">一般</el-radio>
+                                </el-radio-group>
+                            </el-form-item>
+                        </el-form>
+                        <div class="projectFeedbackSubmitBox">
+                            <el-button size="mini" round>添加反馈</el-button>
+                        </div>
+                    </div>
+                </div>
+            </el-col>
+        </el-row>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            projectName:"体育学院",
+            pageUrlStr:"",
+            createTime:"",
+            des:"这是一段文字描述**************************************这是一段项目描述",
+            nodeList:[],
+            joinPeopleName:"张三",
+            partyA:"测试的甲方名称",
+
+            feedbackList:[{
+                initiateUserName:"张三",
+                initiateUserTime:"2011-08-00 00:00:00",
+                targetUserName:"李四",
+                type:"紧急",
+                des:"这是一段描述xxxxxxxxxxxxxxxxxxxx描述"
+            }],
+
+            addFeedbackInfo:{//添加反馈
+                des:"",
+                targetList:[],
+                type:1,
+            },
+            activities: [
+                {
+                    content: '尾款',
+                    timestamp: '2018-04-12 20:46',
+                    size: 'large',
+                    type: 'primary'
+                }, 
+                {
+                    content: '验收',
+                    timestamp: '2018-04-03 20:46',
+                    color: '#0bbd87'
+                }, {
+                    content: '测试',
+                    timestamp: '2018-04-03 20:46',
+                    size: 'large',
+                    color: '#0bbd87'
+                }, 
+                {
+                    content: '开发',
+                    timestamp: '2018-04-03 20:46',
+                     color: '#0bbd87',
+                    size: 'large'
+                }, 
+                {
+                    content: '设计稿',
+                    timestamp: '2018-04-03 20:46',
+                     color: '#0bbd87',
+                    size: 'large'
+                }, {
+                    content: '立项',
+                    timestamp: '2018-04-03 20:46',
+                    color: '#0bbd87',
+                    size: 'large'
+                }],
+            //员工
+            peopleList:[{label:"张三", value:"zs"},{label:"李四", value:"ls"},{label:"王五", value:"ww"},{label:"赵六", value:"zl"}]
+
+        }
+    },
+    methods:{
+        
+    }
+}
+</script>
+
+<style>
+
+.projectInfo {
+    width: 100%;
+    height: 700px;
+}
+.projectInfo .el-divider__text {
+    border-radius: 10px;
+    font-size: 15px !important;
+}
+.projectInfo .el-divider--horizontal {
+    left: 15px;
+    width: 90% !important;
+}
+/*  左边*/
+.projectInfo .leftInfoBox {
+    width: 100%;
+    height: 700px;
+     background-color: rgb(255 255 255 / 15%);
+    border-radius: 15px;
+    box-shadow: 0 2px 5px 0 rgba(255, 255, 255, 0.699);
+}
+.projectInfo .leftInfoBox .titleBox {
+    width: 100%;
+    height: 40px;
+    text-align: center;
+    font:'黑体';
+    font-weight: bold;
+    font-size: 25px;
+    color: rgb(255, 255, 255);
+}
+.projectInfo .leftInfoBox .desBox {
+    width: 90%;
+    margin: auto;
+    height: 120px;
+    font:'黑体';
+    font-size: 18px;
+    color: rgb(255, 255, 255);
+}
+.projectInfo .leftInfoBox .joinBox {
+    width: 100%;
+    height: 50px;
+    font:'黑体';
+    font-size: 18px;
+    margin-left: 20px;
+    color: rgb(255, 255, 255);
+}
+.projectInfo .leftInfoBox .scheduleBox{
+    width: 100%;
+    height: 350px;
+}
+.projectInfo .leftInfoBox .scheduleBox .scheduleTimelineBox {
+    width: 75%;
+    height: 300px;
+    margin: auto;
+    margin-top: 10px;
+}
+.projectInfo .leftInfoBox .scheduleBox .scheduleTimelineBox .el-timeline {
+    overflow: auto;
+    height: 300px;
+    
+}
+.projectInfo .leftInfoBox .scheduleBox .scheduleTimelineBox ::-webkit-scrollbar{
+    display: none;
+}
+
+.scheduleTimelineBox .el-timeline-item {
+    left: 10px;
+}
+.scheduleTimelineBox .el-timeline-item__content {
+    color: rgb(255, 255, 255);
+}
+.scheduleTimelineBox .el-timeline-item__timestamp {
+    color: rgb(184, 250, 178);
+}
+
+.projectInfo .leftInfoBox .joinBox .jointInfo {
+    width: 50%;
+    height: 50px;
+    display: inline-block;
+}
+
+.projectInfo .leftInfoBox .joinBox .joinTitle {
+    font-size: 18px;
+    font-weight: bold;
+    display: inline-block;
+}
+.projectInfo .leftInfoBox .joinBox .joinData {
+    font-size: 20px;
+    display: inline-block;
+}
+.projectInfo .leftInfoBox .joinBox .partyAInfo {
+    width: 40%;
+    height: 50px;
+    display: inline-block;
+}
+.projectInfo .leftInfoBox .joinBox .partyATitle {
+    font-size: 18px;
+    font-weight: bold;
+    display: inline-block;
+}
+
+.projectInfo .leftInfoBox .joinBox .partyAData {
+    font-size: 20px;
+    display: inline-block;
+}
+
+/* 中间 */
+.projectInfo .centerInfoBox {
+    width: 100%;
+    height: 700px;
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 15px;
+    box-shadow: 0 2px 5px 0 rgba(255, 255, 255, 0.699);
+}
+
+
+.projectInfo .centerInfoBox.projectFeedbackTable {
+    width: 66%;
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(141, 141, 141);
+    border-radius: 6px;
+}
+/*最外层透明*/
+.projectInfo .centerInfoBox .projectFeedbackTable .el-table, .el-table__expanded-cell{
+   background-color: transparent;
+}
+/* 表格内背景颜色 */
+.projectInfo .centerInfoBox .projectFeedbackTable .el-table th, .el-table tr, .el-table td {
+   background-color: transparent;
+   color: aliceblue;
+}
+.projectInfo .centerInfoBox .projectFeedbackTable .el-table--enable-row-hover .el-table__body tr:hover>td {
+    background-color: rgba(247, 247, 247, 0.205);
+}
+
+/* 中间问题编辑 */
+.projectFeedbackAddBox {
+    width: 100%;
+    height: 120px;
+}
+.projectFeedbackAddBox .el-form-item__label{
+    color: rgb(255, 255, 255);
+}
+.projectFeedbackAddBox .el-radio{
+    color: aliceblue;
+}
+.projectFeedbackAddBox .el-button {
+    background: rgba(247, 247, 247, 0.5);
+}
+.projectFeedbackInputBox {
+    width: 95%;
+    height: 120px;
+    margin: auto;
+}
+.projectFeedbackInputBox .el-textarea__inner {
+    background-color: rgba(119, 119, 119, 0.671);
+    color: rgb(255, 255, 255);
+}
+.projectFeedbackSubmitBox {
+    width: 95%;
+    height: 40px;
+    text-align: right;
+}
+
+/* .projectFeedbackTargetSelectBox {
+    width: 100%;
+}
+
+.projectFeedbackTargetSelectBox .titleBox {
+    color: rgb(255, 255, 255);
+    font-size: 16px;
+    display: inline-block;
+}
+.projectFeedbackTargetSelectBox .selectBox {
+    width: 200px;
+    height: 30px;
+    display: inline-block;
+} */
+
+/* 右边 */
+.projectInfo .rightInfoBox {
+   width: 100%;
+    height: 700px;
+     background: rgba(255, 255, 255, 0.349);
+    border-radius: 15px;
+    box-shadow: 0 2px 5px 0 rgba(255, 255, 255, 0.699);
+}
+</style>
\ No newline at end of file

src/pages/project/projectList.vue

+<template>
+    <div class="projectList">
+       <!-- <pageNameModel :pageName="pageName"></pageNameModel> -->
+       <div class="selectBox">
+            <div class="selectInputBox">
+                <el-input v-model="selectInput" placeholder="请输入内容"></el-input>
+            </div>
+            <div class="selectButtonBox">
+                <el-button type="primary" @click="checkSelect"><font style="font-size:12px" class="el-icon-search"></font></el-button>
+            </div>
+       </div>
+       <div class="projectListBox">
+           <div class="projectListTable">
+                <el-table :data="projectList" height="650">
+                    <el-table-column prop="projectName" align="center" width="220" label="项目名称">
+                    </el-table-column>
+                    <el-table-column prop="type" align="center" width="150" label="项目类型">
+                    </el-table-column>
+                    <el-table-column prop="state" align="center" width="200" label="当前进度">
+                    </el-table-column>
+                    <el-table-column prop="startTime" align="center" width="200" label="开始时间">
+                    </el-table-column>
+                    <el-table-column prop="lastNodeTime" align="center" width="200" label="下一节点时间">
+                    </el-table-column>
+                    <el-table-column align="center" width="100" label="操作">
+                        <template slot-scope="scope">
+                             <i @click="checkProjectItem(scope.row)" style="color:aliceblue;font-size:18px" class="el-icon-thumb"></i>
+                        </template>
+                    </el-table-column>
+                </el-table>
+           </div>
+           
+        </div>
+        <div class="projectInfoDialog">
+            <el-dialog width="80%" top="2vh" :visible.sync="projectInfoDialogVisible">
+                <projectInfo></projectInfo>
+            </el-dialog>
+       </div>
+    </div>
+</template>
+
+<script>
+// import pageNameModel from "./../publicModel/pageName.vue"
+import projectInfo from "./projectInfo.vue"
+export default {
+    data() {
+        return {
+            pageName:"项目列表",
+            selectInput:"",
+            projectList:[{
+                projectName:"11",
+                type:"11",
+                state:"11",
+                startTime:"11",
+                lastNodeTime:"11"
+            }],
+            projectInfoDialogVisible:false,
+        }
+    },
+    components: { projectInfo },
+    methods:{
+        checkProjectItem:function(projectItem) {//点击详情
+            this.projectInfoDialogVisible = true;
+        },
+        checkSelect:function() {//查询
+
+        }
+    }
+}
+</script>
+
+<style>
+.projectList .selectBox{
+    width: 100%;
+    height: 60px;
+}
+/* 输入框 */
+.projectList .selectBox .selectInputBox {
+    width: 400px;
+    display: inline-block;
+}
+.selectInputBox .el-input__inner {
+    height: 40px !important;
+    background-color: rgb(0 0 0 / 15%);
+}
+
+/* 查询按钮 */
+.projectList .selectBox .selectButtonBox {
+    display: inline-block;
+    /* width: 100px; */
+    border-radius: 10px;
+    height: 40px;
+}
+.projectList .selectBox .selectButtonBox .el-button {
+    height: 100% !important;
+    width: 100% !important;
+    border-radius: 0px;
+    background-color: rgb(255 255 255 / 15%);
+    border-color: rgb(255 255 255 / 35%);
+}
+
+/* 列表 */
+.projectList .projectListBox{
+    width: 100%;
+}
+
+.projectList .projectListBox .projectListTable {
+    width: 66%;
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 6px;
+}
+/*最外层透明*/
+.projectList .projectListBox .projectListTable .el-table, .el-table__expanded-cell{
+   background-color: transparent;
+}
+/* 表格内背景颜色 */
+.projectList .projectListBox .projectListTable .el-table th, .el-table tr, .el-table td {
+   background-color: transparent;
+   color: aliceblue;
+}
+.projectList .projectListBox .projectListTable .el-table--enable-row-hover .el-table__body tr:hover>td {
+    background-color: rgba(247, 247, 247, 0.205);
+}
+
+/* 弹出框 */
+.projectInfoDialog .el-dialog, .el-pager li {
+    /* background-color: rgba(206, 206, 206, 0.486); */
+    border-radius: 40px;
+    box-shadow: 0 2px 50px 0 rgba(255, 255, 255, 0.699);
+    background: url('../../assets/login/logbackground.png') no-repeat;
+}
+.projectInfoDialog .el-dialog__header {
+    padding:0 0 0 0;
+}
+
+
+</style>
\ No newline at end of file

src/pages/publicModel/pageName.vue

+<template>
+    <div class="pageHeader">
+        <div class="pageNameBox">
+            <div class="txtBox">{{pageName}}</div>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+ name:"",
+    data() {
+        return {
+        }
+    },
+    props:{
+        pageName:""
+    },
+    methods:{
+
+    }
+}
+</script>
+
+<style>
+.pageHeader {
+    width: 100%;
+    height: 60px;
+}
+.pageHeader .pageNameBox{
+    width: 200px;
+    height: 40px;
+    text-align: center;
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 10px;
+}
+.pageHeader .pageNameBox .txtBox {
+    font-size: 28px;
+    color: rgb(255, 255, 255);
+}
+
+
+</style>
\ No newline at end of file

src/pages/self/notebook.vue

+<template>
+    <div class="notebookBox">
+        <el-row :gutter="20">
+            <el-col :span="6">
+                <div class="notebookTable">
+                    <el-table :data="notebookList" height="750"  >
+                        <el-table-column prop="projectName" align="center" width="210" label="项目名称">
+                        </el-table-column>
+                        <el-table-column prop="count" align="center" width="100" label="笔记数量">
+                        </el-table-column>
+                        <el-table-column align="center" width="80" label="查看">
+                            <template slot-scope="scope">
+                                    <i @click="checkNotebookItem(scope.row)" style="color:aliceblue;font-size:18px" class="el-icon-s-management"></i>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+            </el-col>
+            <el-col :span="18">
+                <div class="notebookBaseBox">
+                    <el-card shadow="always">
+                    </el-card>
+                </div>
+            </el-col>
+        </el-row>
+    </div>
+</template>
+
+<script>
+export default {
+    // 笔记本
+    data() {
+        return {
+            notebookList:[
+                {projectName:"张江双创", count:9},
+                {projectName:"张江双创二期", count:10},
+                {projectName:"徐汇教育局", count:12},
+                {projectName:"徐汇二期", count:3},
+                {projectName:"深圳艺校三期", count:6},
+                {projectName:"深圳艺校四期", count:0},
+            ]
+        }
+    },
+    components: { },
+    methods:{
+        checkNotebookItem:function() {
+
+        }
+    }    
+}
+</script>
+
+<style>
+.notebookBox {
+    width: 100%;   
+}
+.notebookBox .notebookTable {
+    width: 100%;
+    height: 750px;
+}
+
+.notebookBox .notebookTable {
+    width: 100%;
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 6px;
+}
+/*最外层透明*/
+.notebookBox .notebookTable .el-table, .el-table__expanded-cell{
+   background-color: transparent;
+}
+/* 表格内背景颜色 */
+.notebookBox .notebookTable .el-table th, .el-table tr, .el-table td {
+   background-color: transparent;
+   color: aliceblue;
+}
+
+.notebookBox .notebookTable .el-table--enable-row-hover .el-table__body tr:hover>td {
+    background-color: rgba(247, 247, 247, 0.205);
+}
+
+.notebookBox .notebookBaseBox {
+    width: 80%;
+    height: 750px;
+}
+
+.notebookBox .notebookBaseBox .el-card  {
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 6px;
+    height: 750px;
+}
+
+</style>
\ No newline at end of file

src/pages/self/projectState.vue

+<template>
+    <div></div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file

src/pages/set/pwd.vue

+<template>
+    <div>修改密码</div>
+</template>
+
+<script>
+export default {
+     data() {
+        return {
+           
+        }
+    },
+    components: { },
+    methods:{
+      
+    }    
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file

src/pages/task/editTask.vue

+<template>
+    <div class="taskInfoBox">
+        <el-divider content-position="left">反馈描述</el-divider>
+        <div class="taskInfoMainBox">
+           <el-input disabled="false" resize="none" type="textarea" :rows="8" placeholder="请输入内容" v-model="feedbackDsc">
+            </el-input>
+        </div>
+        <el-divider content-position="left">解决方案</el-divider>
+        <div class="solveEditMainBox">
+            <div class="editTextAreaBox">
+                <el-input resize="none" type="textarea" :rows="6" placeholder="请输入内容" v-model="feedbackSol">
+                </el-input>
+            </div>
+            <div class="null40Div"></div>
+            <div class="solveBox">
+                <el-form ref="form" label-width="80px">
+                    <el-form-item label="指派人">
+                        <el-select size="mini" v-model="editInfo.targetList" multiple collapse-tags style="margin-left: 20px;" placeholder="请选择">
+                            <el-option v-for="item in peopleList" :key="item.value" :label="item.label" :value="item.value">
+                            </el-option>
+                        </el-select>
+                    </el-form-item>
+                        <el-form-item label="是否解决">
+                            <el-radio-group v-model="editInfo.state">
+                            <el-radio :label="1">是</el-radio>
+                            <el-radio :label="2">否</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
+                </el-form>
+            </div>
+        </div>
+         <div class="solvButtonBox">
+            <el-button size="mini" round>提交</el-button>
+         </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            feedbackDsc:"问题描述描述描述 萨芬顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶 胜多负少辣椒粉撒娇",
+            feedbackSol:"",
+            editInfo:{
+                state:1,
+                targetList:[]
+            }
+        }
+    },
+    methods:{
+        
+    }
+}
+</script>
+
+<style>
+.null40Div{
+    width: 100%;
+    height: 40px;
+}
+.taskInfoBox{
+    width: 100%;
+    height: 600px;
+}
+
+.taskInfoBox .el-divider__text {
+    border-radius: 10px;
+    font-size: 15px !important;
+}
+.taskInfoBox .el-divider--horizontal {
+    left: 15px;
+    width: 95% !important;
+}
+
+.taskInfoBox .taskInfoMainBox {
+    width: 95%;
+    height: 180px;
+    margin: auto;
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 15px;
+    box-shadow: 0 2px 5px 0 rgba(255, 255, 255, 0.699);
+}
+.taskInfoBox .taskInfoMainBox .el-textarea__inner {
+    background-color: transparent;
+    color: rgb(255, 255, 255);
+    border-radius: 15px;
+    cursor:auto !important;
+}
+
+.taskInfoBox .solveEditMainBox {
+    width: 95%;
+    margin: auto;
+}
+.taskInfoBox .editTextAreaBox .el-textarea__inner{
+    color: rgb(255, 255, 255);
+    border-radius: 15px;
+    cursor:auto !important;
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 15px;
+    box-shadow: 0 2px 5px 0 rgba(255, 255, 255, 0.699);
+}
+
+.taskInfoBox .solveBox {
+    width: 100%;
+}
+.solvButtonBox {
+    width: 95%;
+    height: 40px;
+    text-align: right;
+}
+
+
+</style>
\ No newline at end of file

src/pages/task/initiate.vue

+<template>
+    <div class="initiateListBox">
+        <div class="initiateListTable">
+            <el-table :data="initiateList" height="750" :row-class-name="tableRowClassName" >
+                <el-table-column prop="projectName" align="center" width="220" label="项目名称">
+                </el-table-column>
+                 <el-table-column prop="type" align="center" width="80" label="类型">
+                </el-table-column>
+                <el-table-column prop="initiateUserTime" align="center" width="160" label="发起时间">
+                </el-table-column>
+                <el-table-column prop="targetUserName" align="center" width="80" label="指派人">
+                </el-table-column>
+                <el-table-column prop="state" align="center" width="80" label="状态">
+                </el-table-column>
+                <el-table-column prop="des" align="center" width="360" label="问题描述">
+                </el-table-column>
+                <el-table-column align="center" width="80" label="操作">
+                    <template slot-scope="scope">
+                            <i @click="checkInitiateItem(scope.row)" style="color:aliceblue;font-size:18px" class="el-icon-view"></i>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </div>
+        <div class="initiateInfoDialog">
+            <el-dialog width="60%" top="5vh" :visible.sync="initiateInfoDialogVisible">
+                <initiateInfo></initiateInfo>
+            </el-dialog>
+       </div>
+    </div>
+</template>
+
+<script>
+import initiateInfo from "./initiateInfo.vue"
+export default {
+    data() {
+        return {
+            initiateList:[
+                {projectName:"张江双创二期", state:"解决", initiateUserTime:'2022-06-31 00:00', targetUserName:'李某某',type:'投诉', des:"核心数据缺失"},
+                {projectName:"徐汇二期", state:"未解决", initiateUserTime:'2022-06-31 00:00', targetUserName:'王大小',type:'修改', des:"****页面数据修改"},
+                {projectName:"艺校三期", state:"未解决", initiateUserTime:'2022-06-31 00:00', targetUserName:'刘谋',type:'修改', des:"******页面重新设计"},
+                {projectName:"长三角", state:"未处理", initiateUserTime:'2022-06-32 00:00', targetUserName:'李某某',type:'修改', des:"对接数据"},
+                {projectName:"徐汇五期", state:"未处理", initiateUserTime:'2022-06-32 00:00', targetUserName:'王二小',type:'修改', des:"修改页面"},
+                {projectName:"艺校六期", state:"未处理", initiateUserTime:'2022-06-32 00:00', targetUserName:'王金橘',type:'修改', des:"修改页面"},
+                {projectName:"艺校六期", state:"未通过", initiateUserTime:'2022-06-32 00:00', targetUserName:'王金橘',type:'修改', des:"修改页面"}
+            ],
+           initiateInfoDialogVisible:false
+        }
+    },
+    components: { initiateInfo },
+    methods:{
+        tableRowClassName:function({row, rowIndex}) {
+            if (row.state == "解决") return 'success-row';
+            else if (row.state == "未解决") return 'warning-row';
+            else if (row.state == "未通过") return 'error-row'
+            return '';
+        },
+        checkInitiateItem:function(row) {
+            this.initiateInfoDialogVisible = true
+        }
+    }    
+}
+</script>
+
+<style>
+.initiateListBox{
+    width: 100%;
+}
+
+.initiateListBox .initiateListTable {
+    width: 66%;
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 6px;
+}
+/*最外层透明*/
+.initiateListBox .initiateListTable .el-table, .el-table__expanded-cell{
+   background-color: transparent;
+}
+/* 表格内背景颜色 */
+.initiateListBox .initiateListTable .el-table th, .el-table tr, .el-table td {
+   background-color: transparent;
+   color: aliceblue;
+}
+.initiateListBox .initiateListTable .success-row {
+    background: rgba(60, 255, 213, 0.61) !important;
+}
+.initiateListBox .initiateListTable .warning-row {
+    background: rgba(245, 134, 70, 0.904) !important;
+}
+.initiateListBox .initiateListTable .error-row {
+    background: rgba(247, 52, 52, 0.37) !important;
+}
+.initiateListBox .initiateListTable .el-table--enable-row-hover .el-table__body tr:hover>td {
+    background-color: rgba(247, 247, 247, 0.205);
+}
+.initiateInfoDialog .el-dialog, .el-pager li {
+    /* background-color: rgba(206, 206, 206, 0.486); */
+    border-radius: 40px;
+    box-shadow: 0 2px 50px 0 rgba(255, 255, 255, 0.699);
+    background: url('../../assets/login/logbackground.png') no-repeat;
+}
+.initiateInfoDialog .el-dialog__header {
+    padding:0 0 0 0;
+}
+</style>
\ No newline at end of file

src/pages/task/initiateInfo.vue

+<template>
+    <div class="initiateInfoBox">
+        <el-divider content-position="left">反馈描述</el-divider>
+        <div class="initiateInfoMainBox">
+           <el-input :disabled="false" resize="none" type="textarea" :rows="8"  v-model="feedbackDsc">
+            </el-input>
+        </div>
+        <el-divider content-position="left">解决方案</el-divider>
+        <div class="solveEditMainBox">
+            <div class="editTextAreaBox">
+                <el-input  :disabled="false" resize="none" type="textarea" :rows="6" v-model="feedbackSol">
+                </el-input>
+            </div>
+            <div class="null40Div"></div>
+            <div class="solveBox">
+                <el-form ref="form" label-width="80px">
+                    <el-form-item label="指派人">
+                        <el-tag type=""> 张三 </el-tag>
+                        <el-tag type="info"> 李四 </el-tag>
+                        <el-tag type="success"> 王五 </el-tag>
+                        <el-tag type="warning"> 赵六 </el-tag>
+                    </el-form-item>
+                        <el-form-item label="是否解决">
+                            <el-radio-group v-model="isSolve">
+                            <el-radio :label="1">是</el-radio>
+                            <el-radio :label="2">否</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
+                </el-form>
+            </div>
+        </div>
+         <div class="solvButtonBox">
+            <el-button size="mini" round>提交</el-button>
+         </div>
+    </div>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            feedbackDsc:"",
+            feedbackSol:"",
+            isSolve:2
+        }
+    },
+    components: { },
+    methods:{
+    }    
+}
+</script>
+
+<style>
+.null40Div{
+    width: 100%;
+    height: 40px;
+}
+.initiateInfoBox {
+    width: 100%;
+    height: 600px;
+}
+
+
+
+.initiateInfoBox .el-divider__text {
+    border-radius: 10px;
+    font-size: 15px !important;
+}
+.initiateInfoBox .el-divider--horizontal {
+    left: 15px;
+    width: 95% !important;
+}
+
+.initiateInfoBox .initiateInfoMainBox {
+    width: 95%;
+    height: 180px;
+    margin: auto;
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 15px;
+    box-shadow: 0 2px 5px 0 rgba(255, 255, 255, 0.699);
+}
+.initiateInfoBox .initiateInfoMainBox .el-textarea__inner {
+    background-color: transparent;
+    color: rgb(255, 255, 255);
+    border-radius: 15px;
+    cursor:auto !important;
+}
+
+.initiateInfoBox .solveEditMainBox {
+    width: 95%;
+    margin: auto;
+}
+.initiateInfoBox .editTextAreaBox .el-textarea__inner{
+    color: rgb(255, 255, 255);
+    border-radius: 15px;
+    cursor:auto !important;
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 15px;
+    box-shadow: 0 2px 5px 0 rgba(255, 255, 255, 0.699);
+}
+
+.initiateInfoBox .solveBox {
+    width: 100%;
+}
+.initiateInfoBox .solvButtonBox {
+    width: 95%;
+    height: 40px;
+    text-align: right;
+}
+</style>
\ No newline at end of file

src/pages/task/taskList.vue

+<template>
+    <div class="taskListBox">
+        <div class="taskListTable">
+            <el-table :data="myTaskList" height="750">
+                <el-table-column prop="projectName" align="center" width="220" label="项目名称">
+                </el-table-column>
+                <el-table-column prop="initiateUserTime" align="center" width="180" label="发起时间">
+                </el-table-column>
+                <el-table-column prop="initiateUserName" align="center" width="80" label="发起人">
+                </el-table-column>
+                <el-table-column prop="type" align="center" width="80" label="类型">
+                </el-table-column>
+                <el-table-column prop="des" align="center" width="430" label="问题描述">
+                </el-table-column>
+                <el-table-column align="center" width="100" label="操作">
+                    <template slot-scope="scope">
+                            <i @click="checkTaskItem(scope.row)" style="color:aliceblue;font-size:18px" class="el-icon-edit"></i>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </div>
+        <div class="taskInfoDialog">
+            <el-dialog width="60%" top="5vh" :visible.sync="taskInfoDialogVisible">
+                <taskInfo></taskInfo>
+            </el-dialog>
+       </div>
+    </div>
+</template>
+
+<script>
+import taskInfo from "./editTask.vue"
+export default {
+    data() {
+        return {
+            taskInfoDialogVisible:false,
+            myTaskList:[
+                {projectName:"张江双创二期", initiateUserTime:'2022-06-31 00:00:00', initiateUserName:'李四',type:'投诉', des:"啊撒旦发生范德萨发空间是辣的开发技术飞洒防守反击萨拉"}
+            ]
+        }
+    },
+    components: { taskInfo },
+    methods:{
+        checkTaskItem:function(projectItem) {//点击详情
+            this.taskInfoDialogVisible = true;
+        },
+    }
+}
+</script>
+
+<style>
+.taskListBox{
+    width: 100%;
+}
+
+.taskListBox .taskListTable {
+    width: 66%;
+    box-shadow: 0 2px 12px 0 rgba(252, 252, 252, 0.144);
+    background-color: rgb(255 255 255 / 15%);
+    border-radius: 6px;
+}
+/*最外层透明*/
+.taskListBox .taskListTable .el-table, .el-table__expanded-cell{
+   background-color: transparent;
+}
+/* 表格内背景颜色 */
+.taskListBox .taskListTable .el-table th, .el-table tr, .el-table td {
+   background-color: transparent;
+   color: aliceblue;
+}
+.taskListBox .taskListTable .el-table--enable-row-hover .el-table__body tr:hover>td {
+    background-color: rgba(247, 247, 247, 0.205);
+}
+.taskInfoDialog .el-dialog, .el-pager li {
+    /* background-color: rgba(206, 206, 206, 0.486); */
+    border-radius: 40px;
+    box-shadow: 0 2px 50px 0 rgba(255, 255, 255, 0.699);
+    background: url('../../assets/login/logbackground.png') no-repeat;
+}
+.taskInfoDialog .el-dialog__header {
+    padding:0 0 0 0;
+}
+
+</style>
\ No newline at end of file

src/router/index.js

+import Vue from 'vue'
+import Router from 'vue-router'
+
+Vue.use(Router)
+
+export default new Router({
+  mode: 'history',
+  routes: [{
+      path: '/',
+      name: 'login',
+      component: () => import('../pages/home.vue')
+    },
+    {
+      path: '/new',
+      name: 'new',
+      component: () => import('../pages/new/menu.vue')
+    },
+    {
+      path: '/login',
+      name: 'login',
+      component: () => import('../pages/login.vue')
+    },
+    {
+      path: '/home', 
+      name: 'home',
+      component: () => import('../pages/home.vue'),
+      children: [
+        {path: 'notebook', name: 'notebook', component: () => import('../pages/self/notebook.vue')}
+      ]
+    },
+    {
+      path: '/project',
+      name: 'project',
+      component: () => import('../pages/home.vue'),
+      children: [
+        {path: 'projectList', name: 'projectList', component: () => import('../pages/project/projectList.vue')},
+        {path: 'taskList', name: 'taskList', component: () => import('../pages/task/taskList.vue')},
+        {path: 'initiate', name: 'initiate', component: () => import('../pages/task/initiate.vue')},
+      ]
+    },
+    {
+      path: '/set',
+      name: 'set',
+      component: () => import('../pages/home.vue'),
+      children: [
+        {path: 'pwd', name: 'pwd', component: () => import('../pages/set/pwd.vue')},
+      ]
+    },
+    {
+      path: '/boss',
+      name: 'boss',
+      component: () => import('../pages/home.vue'),
+      children: [
+        {path: 'createProject', name: 'createProject', component: () => import('../pages/boss/createProject.vue')},
+        {path: 'stats', name: 'stats', component: () => import('../pages/boss/stats.vue')},
+
+      ]
+    },
+    {
+      path: '/pm',
+      name: 'pm',
+      component: () => import('../pages/home.vue'),
+      children: [
+        {path: 'replenish', name: 'replenish', component: () => import('../pages/pm/replenish.vue')},
+        {path: 'stats', name: 'stats', component: () => import('../pages/pm/stats.vue')},
+
+      ]
+    }
+
+  ]
+});
+

src/server/axiosInstance.js

+import axios from 'axios'
+
+const serverUrl = 'http://192.168.0.105:60000';
+
+const server = axios.create({
+    baseURL: serverUrl,
+    timeout: 5000
+});
+
+
+async function postReq(url, paramater) {
+    return new Promise((resolve, reject) => {
+        server.post(url, paramater).then(res => {
+            resolve(res.data);
+        }).catch(error => {
+            resolve(error);
+        })
+    });
+}
+
+export default postReq
\ No newline at end of file

src/server/menu.js

+
+let picList = [
+    {
+        index:1,
+        name:"PROJECT",
+        icon:"el-icon-collection",
+        subList:[
+            {subName:"项目列表", path:"/project/projectList"},
+            {subName:"我的任务", path:"/project/taskList"},
+            {subName:"我发起的", path:"/project/initiate"}
+        ]
+    },
+    {
+        index:2,
+        name:"SYSTEM",
+        icon:"el-icon-s-tools",
+        subList:[
+            {subName:"修改密码", path:"/set/pwd"},
+        ]
+    },
+    {
+        index:3,
+        name:"BOSS",
+        icon:"el-icon-s-custom",
+        subList:[
+            {subName:"创建项目", path:"/boss/createProject"},
+            {subName:"统计", path:"/boss/stats"},
+        ]
+    },
+    {
+        index:4,
+        name:"PM",
+        icon:"el-icon-s-custom",
+        subList:[
+            {subName:"项目维护", path:"/pm/replenish"},
+            {subName:"统计", path:"/pm/stats"},
+        ]
+    }
+]
+
+function getThreeEnum() {
+   return picList;
+}
+  
+export default getThreeEnum;
\ No newline at end of file

src/server/url.js

+export const urlConfig = {
+    "登录":"/api/user/login"
+};
\ No newline at end of file

src/store/store.js

+import Vue from 'vue'
+import Vuex from 'vuex'
+
+
+import users from './users'
+Vue.use(Vuex);
+export default () => {
+  const Store = new Vuex.Store({
+    modules: {
+      users
+    }
+  })
+  return Store
+}

src/store/users/actions.js

+
+import postReq from '../../server/axiosInstance';
+import { urlConfig } from '../../server/url';
+
+
+//登录
+export async function login({commit}, payload) {
+  return await postReq(urlConfig.登录, payload);
+};
+
+//退出登录
+export function quitLogin() {
+  return ;
+}
+
+
+

src/store/users/index.js

+import * as actions from './actions'
+import * as state from './state'
+import * as getters from './getters'
+export default {
+    namespaced: true,
+    actions,
+    state,
+    getters
+}
\ No newline at end of file

test/e2e/custom-assertions/elementCount.js

+// A custom Nightwatch assertion.
+// The assertion name is the filename.
+// Example usage:
+//
+//   browser.assert.elementCount(selector, count)
+//
+// For more information on custom assertions see:
+// http://nightwatchjs.org/guide#writing-custom-assertions
+
+exports.assertion = function (selector, count) {
+  this.message = 'Testing if element <' + selector + '> has count: ' + count
+  this.expected = count
+  this.pass = function (val) {
+    return val === this.expected
+  }
+  this.value = function (res) {
+    return res.value
+  }
+  this.command = function (cb) {
+    var self = this
+    return this.api.execute(function (selector) {
+      return document.querySelectorAll(selector).length
+    }, [selector], function (res) {
+      cb.call(self, res)
+    })
+  }
+}

test/e2e/nightwatch.conf.js

+require('babel-register')
+var config = require('../../config')
+
+// http://nightwatchjs.org/gettingstarted#settings-file
+module.exports = {
+  src_folders: ['test/e2e/specs'],
+  output_folder: 'test/e2e/reports',
+  custom_assertions_path: ['test/e2e/custom-assertions'],
+
+  selenium: {
+    start_process: true,
+    server_path: require('selenium-server').path,
+    host: '127.0.0.1',
+    port: 4444,
+    cli_args: {
+      'webdriver.chrome.driver': require('chromedriver').path
+    }
+  },
+
+  test_settings: {
+    default: {
+      selenium_port: 4444,
+      selenium_host: 'localhost',
+      silent: true,
+      globals: {
+        devServerURL: 'http://localhost:' + (process.env.PORT || config.dev.port)
+      }
+    },
+
+    chrome: {
+      desiredCapabilities: {
+        browserName: 'chrome',
+        javascriptEnabled: true,
+        acceptSslCerts: true
+      }
+    },
+
+    firefox: {
+      desiredCapabilities: {
+        browserName: 'firefox',
+        javascriptEnabled: true,
+        acceptSslCerts: true
+      }
+    }
+  }
+}

test/e2e/runner.js

+// 1. start the dev server using production config
+process.env.NODE_ENV = 'testing'
+
+const webpack = require('webpack')
+const DevServer = require('webpack-dev-server')
+
+const webpackConfig = require('../../build/webpack.prod.conf')
+const devConfigPromise = require('../../build/webpack.dev.conf')
+
+let server
+
+devConfigPromise.then(devConfig => {
+  const devServerOptions = devConfig.devServer
+  const compiler = webpack(webpackConfig)
+  server = new DevServer(compiler, devServerOptions)
+  const port = devServerOptions.port
+  const host = devServerOptions.host
+  return server.listen(port, host)
+})
+.then(() => {
+  // 2. run the nightwatch test suite against it
+  // to run in additional browsers:
+  //    1. add an entry in test/e2e/nightwatch.conf.js under "test_settings"
+  //    2. add it to the --env flag below
+  // or override the environment flag, for example: `npm run e2e -- --env chrome,firefox`
+  // For more information on Nightwatch's config file, see
+  // http://nightwatchjs.org/guide#settings-file
+  let opts = process.argv.slice(2)
+  if (opts.indexOf('--config') === -1) {
+    opts = opts.concat(['--config', 'test/e2e/nightwatch.conf.js'])
+  }
+  if (opts.indexOf('--env') === -1) {
+    opts = opts.concat(['--env', 'chrome'])
+  }
+
+  const spawn = require('cross-spawn')
+  const runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' })
+
+  runner.on('exit', function (code) {
+    server.close()
+    process.exit(code)
+  })
+
+  runner.on('error', function (err) {
+    server.close()
+    throw err
+  })
+})

test/e2e/specs/test.js

+// For authoring Nightwatch tests, see
+// http://nightwatchjs.org/guide#usage
+
+module.exports = {
+  'default e2e tests': function (browser) {
+    // automatically uses dev Server port from /config.index.js
+    // default: http://localhost:8080
+    // see nightwatch.conf.js
+    const devServer = browser.globals.devServerURL
+
+    browser
+      .url(devServer)
+      .waitForElementVisible('#app', 5000)
+      .assert.elementPresent('.hello')
+      .assert.containsText('h1', 'Welcome to Your Vue.js App')
+      .assert.elementCount('img', 1)
+      .end()
+  }
+}

test/unit/.eslintrc

+{
+  "env": { 
+    "jest": true
+  },
+  "globals": { 
+  }
+}

test/unit/jest.conf.js

+const path = require('path')
+
+module.exports = {
+  rootDir: path.resolve(__dirname, '../../'),
+  moduleFileExtensions: [
+    'js',
+    'json',
+    'vue'
+  ],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1'
+  },
+  transform: {
+    '^.+\\.js$': '<rootDir>/node_modules/babel-jest',
+    '.*\\.(vue)$': '<rootDir>/node_modules/vue-jest'
+  },
+  testPathIgnorePatterns: [
+    '<rootDir>/test/e2e'
+  ],
+  snapshotSerializers: ['<rootDir>/node_modules/jest-serializer-vue'],
+  setupFiles: ['<rootDir>/test/unit/setup'],
+  mapCoverage: true,
+  coverageDirectory: '<rootDir>/test/unit/coverage',
+  collectCoverageFrom: [
+    'src/**/*.{js,vue}',
+    '!src/main.js',
+    '!src/router/index.js',
+    '!**/node_modules/**'
+  ]
+}

test/unit/setup.js

+import Vue from 'vue'
+
+Vue.config.productionTip = false

test/unit/specs/HelloWorld.spec.js

+import Vue from 'vue'
+import HelloWorld from '@/components/HelloWorld'
+
+describe('HelloWorld.vue', () => {
+  it('should render correct contents', () => {
+    const Constructor = Vue.extend(HelloWorld)
+    const vm = new Constructor().$mount()
+    expect(vm.$el.querySelector('.hello h1').textContent)
+      .toEqual('Welcome to Your Vue.js App')
+  })
+})