项目代码

2022-09-14 11:23:00 +08:00 · 2022-09-14 11:23:00 +08:00 · e429c455d1
commit e429c455d1
83 changed files with 17055 additions and 0 deletions
--- a/.babelrc
+++ b/.babelrc
@ -0,0 +1,20 @@
 {
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": [
    "transform-vue-jsx",
    "transform-runtime",
    ["import", {
      "libraryName": "vant",
      "libraryDirectory": "es",
      "style": true
    }]
  ]
 }
--- a/.editorconfig
+++ b/.editorconfig
@ -0,0 +1,9 @@
 root = true
 [*]
 charset = utf-8
 indent_style = space
 indent_size = 2
 end_of_line = lf
 insert_final_newline = true
 trim_trailing_whitespace = true
--- a/.env.development
+++ b/.env.development
@ -0,0 +1,17 @@
 # just a flag
 ENV = 'development'
 # base api
 # 这里修改成api服务器地址
 VUE_APP_BASE_API = '/api'
 # vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
 # to control whether the babel-plugin-dynamic-import-node plugin is enabled.
 # It only does one thing by converting all import() to require().
 # This configuration can significantly increase the speed of hot updates,
 # when you have a large number of pages.
 # Detail:  https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js
 VUE_CLI_BABEL_TRANSPILE_MODULES = true
 VUE_APP_REPORT_DESIGN_URL = 'http://hfxny.mes.picaiba.com/ureport/designer'
 VUE_APP_REPORT_VIEW_URL = 'http://hfxny.mes.picaiba.com/ureport/preview'
--- a/.env.production
+++ b/.env.production
@ -0,0 +1,7 @@
 # just a flag
 ENV = 'production'
 # base api
 VUE_APP_BASE_API = '/api'
 VUE_APP_REPORT_DESIGN_URL = '/ureport/designer'
 VUE_APP_REPORT_VIEW_URL = '/ureport/preview'
--- a/.env.staging
+++ b/.env.staging
@ -0,0 +1,8 @@
 NODE_ENV = production
 # just a flag
 ENV = 'staging'
 # base api
 VUE_APP_BASE_API = '/stage-api'
--- a/.eslintignore
+++ b/.eslintignore
@ -0,0 +1,4 @@
 /build/
 /config/
 /dist/
 /*.js
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -0,0 +1,29 @@
 // https://eslint.org/docs/user-guide/configuring
 module.exports = {
  root: true,
  parserOptions: {
    parser: 'babel-eslint'
  },
  env: {
    browser: true,
  },
  extends: [
    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
    'plugin:vue/essential', 
    // https://github.com/standard/standard/blob/master/docs/RULES-en.md
    'standard'
  ],
  // required to lint *.vue files
  plugins: [
    'vue'
  ],
  // add your custom rules here
  rules: {
    // allow async-await
    'generator-star-spacing': 'off',
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
  }
 }
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,14 @@
 .DS_Store
 node_modules/
 /dist/
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 # Editor directories and files
 .idea
 .vscode
 *.suo
 *.ntvs*
 *.njsproj
 *.sln
--- a/.postcssrc.js
+++ b/.postcssrc.js
@ -0,0 +1,13 @@
 // https://github.com/michael-ciniawsky/postcss-load-config
 module.exports = {
  plugins: {
    'autoprefixer': {
      browsers: ['Android >= 4.0', 'iOS >= 7']
    },
    'postcss-pxtorem': {
      rootValue: 50,
      propList: ['*']
    }
  }
 }
--- a/README.md
+++ b/README.md
@ -0,0 +1,21 @@
 # webapp
 > 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
 ```
 For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).
--- a/build/build.js
+++ b/build/build.js
@ -0,0 +1,41 @@
 '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
  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'
    ))
  })
 })
--- a/build/check-versions.js
+++ b/build/check-versions.js
@ -0,0 +1,54 @@
 '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)
  }
 }
--- a/build/logo.png
+++ b/build/logo.png
--- a/build/utils.js
+++ b/build/utils.js
@ -0,0 +1,101 @@
 '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')
    })
  }
 }
--- a/build/vue-loader.conf.js
+++ b/build/vue-loader.conf.js
@ -0,0 +1,22 @@
 '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'
  }
 }
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@ -0,0 +1,92 @@
 '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)
 }
 const createLintingRule = () => ({
  test: /\.(js|vue)$/,
  loader: 'eslint-loader',
  enforce: 'pre',
  include: [resolve('src'), resolve('test')],
  options: {
    formatter: require('eslint-friendly-formatter'),
    emitWarning: !config.dev.showEslintErrorsInOverlay
  }
 })
 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: [
      ...(config.dev.useEslint ? [createLintingRule()] : []),
      {
        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'
  }
 }
--- a/build/webpack.dev.conf.js
+++ b/build/webpack.dev.conf.js
@ -0,0 +1,95 @@
 '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)
    }
  })
 })
--- a/build/webpack.prod.conf.js
+++ b/build/webpack.prod.conf.js
@ -0,0 +1,145 @@
 '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 = 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: 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
--- a/config/dev.env.js
+++ b/config/dev.env.js
@ -0,0 +1,7 @@
 'use strict'
 const merge = require('webpack-merge')
 const prodEnv = require('./prod.env')
 module.exports = merge(prodEnv, {
  NODE_ENV: '"development"'
 })
--- a/config/index.js
+++ b/config/index.js
@ -0,0 +1,102 @@
 '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: {
      // '/wms': {
      //   target: 'https://xiaobu.zhaobu.wang',
      //   ws: true,
      //   changeOrigin: true
      // }
      '/api': {
        // target: 'http://192.168.1.31:8080',
        target: 'http://hfxny.mes.picaiba.com',
        ws: true,
        changeOrigin: true,
        pathRewrite: {
          '^/portapi': ''
        }
        // 使用了proxy 就需要开启下面的选项 (http-proxy-middleware会将post请求给parse了 所以需要再次进行string化)
        // onProxyReq: (proxyReq, req, res, options) => {
        //   if (req.body) {
        //     const bodyData = JSON.stringify(req.body)
        //     // incase if content-type is application/x-www-form-urlencoded -> we need to change to application/json
        //     proxyReq.setHeader('Content-Type', 'application/json')
        //     proxyReq.setHeader('Content-Length', Buffer.byteLength(bodyData))
        //     // stream the content
        //     proxyReq.write(bodyData)
        //   }
        // }
      },
    },
    // Various Dev Server settings
    host: '0.0.0.0', // can be overwritten by process.env.HOST
    port: 8080, // 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: true,
    // 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
  }
 }
--- a/config/prod.env.js
+++ b/config/prod.env.js
@ -0,0 +1,4 @@
 'use strict'
 module.exports = {
  NODE_ENV: '"production"'
 }
--- a/index.html
+++ b/index.html
@ -0,0 +1,12 @@
 <!DOCTYPE html>
 <html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <title>webapp</title>
  </head>
  <body>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
 </html>
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,86 @@
 {
  "name": "webapp",
  "version": "1.0.0",
  "description": "A Vue.js project",
  "author": "protongtz <535262213@qq.com>",
  "private": true,
  "scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "lint": "eslint --ext .js,.vue src",
    "build": "node build/build.js"
  },
  "dependencies": {
    "axios": "^0.19.0",
    "css-loader": "^0.28.11",
    "echarts": "^5.3.3",
    "fastclick": "^1.0.6",
    "moment": "^2.29.4",
    "node-sass": "^4.12.0",
    "qs": "^6.8.0",
    "sass-loader": "^7.3.1",
    "vant": "^2.12.48",
    "vconsole": "^3.14.6",
    "vue": "^2.5.2",
    "vue-router": "^3.0.1",
    "vuex": "^3.1.1"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.22.1",
    "babel-eslint": "^8.2.1",
    "babel-helper-vue-jsx-merge-props": "^2.0.3",
    "babel-loader": "^7.1.1",
    "babel-plugin-import": "^1.12.1",
    "babel-plugin-syntax-jsx": "^6.18.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",
    "chalk": "^2.0.1",
    "copy-webpack-plugin": "^4.0.1",
    "css-loader": "^0.28.0",
    "eslint": "^4.15.0",
    "eslint-config-standard": "^10.2.1",
    "eslint-friendly-formatter": "^3.0.0",
    "eslint-loader": "^1.7.1",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-node": "^5.2.0",
    "eslint-plugin-promise": "^3.4.0",
    "eslint-plugin-standard": "^3.0.1",
    "eslint-plugin-vue": "^4.0.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",
    "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-pxtorem": "^4.0.1",
    "postcss-url": "^7.2.1",
    "rimraf": "^2.6.0",
    "semver": "^5.3.0",
    "shelljs": "^0.7.6",
    "uglifyjs-webpack-plugin": "^1.1.1",
    "url-loader": "^0.5.8",
    "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"
  ]
 }
--- a/src/App.vue
+++ b/src/App.vue
@ -0,0 +1,66 @@
 <!--
 * @Author: gtz
 * @Date: 2022-07-25 14:18:00
 * @LastEditors: gtz
 * @LastEditTime: 2022-07-28 17:00:02
 * @Description: file content
 * @FilePath: \hf-pda\src\App.vue
 -->
 <template>
  <div id="app">
    <transition :name="transitionName">
      <router-view class="child-view"/>
    </transition>
  </div>
 </template>
 <script>
 export default {
  name: 'App',
  data () {
    return {
      transitionName: null
    }
  },
  watch: {
    '$route' (to, from) {
      let isBack = this.$router.isBack
      if (isBack) {
        this.transitionName = 'slide-right'
      } else {
        this.transitionName = 'slide-left'
      }
      this.$router.isBack = false
    }
  },
  mounted () {
    // if (!this.$store.state.user.userInfo) {
    //   this.$store.commit('user/updateUserInfo', JSON.parse(window.sessionStorage.getItem('userInfo')))
    // }
  }
 }
 </script>
 <style>
 .child-view {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: scroll;
  transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
 }
 .slide-left-enter,
 .slide-right-leave-active {
  opacity: 0;
  -webkit-transform: translate(50px, 0);
  transform: translate(50px, 0);
 }
 .slide-left-leave-active,
 .slide-right-enter {
  opacity: 0;
  -webkit-transform: translate(-50px, 0);
  transform: translate(-50px, 0);
 }
 </style>
--- a/src/api/file.js
+++ b/src/api/file.js
@ -0,0 +1,30 @@
 /*
 * @Author: gtz
 * @Date: 2022-08-02 08:42:08
 * @LastEditors: gtz
 * @LastEditTime: 2022-08-02 14:54:43
 * @Description: file content
 * @FilePath: \hf-pda\src\api\file.js
 */
 import request from '@/util/request'
 // 文件上传
 export const uploadFile = data => {
  return request({
    url: '/api/common/attachment/uploadFileFormData',
    method: 'POST',
    file: true,
    data
  })
 }
 // 文件下载
 export const downloadFile = params => {
  return request({
    url: '/api/common/attachment/downloadFile',
    method: 'GET',
    formState: true,
    params,
    responseType: 'blob'
  })
 }
--- a/src/api/user.js
+++ b/src/api/user.js
@ -0,0 +1,14 @@
 import request from '@/util/request'
 // 登录
 export const postLogin = data => {
  const dto = Object.assign(data, {
    appType: 1,
    userType: 1
  })
  return request({
    url: '/api/passport/login',
    method: 'post',
    data: dto
  })
 }
--- a/src/assets/css/all.scss
+++ b/src/assets/css/all.scss
@ -0,0 +1,108 @@
 // 登录页input样式修改
 // .login-input{
 //   .van-field__body{
 //     .van-field__control{
 //       line-height: .6rem;
 //     }
 //   }
 // }
 .van-cell:not(:last-child)::after{
  border-bottom: 0 !important;
 }
 // 登录页记住密码字体颜色
 .login-remPwd{
  .van-checkbox__label{
    color: #fff;
  }
 }
 // 登录页输入框placeholder颜色
 .login-box{
  input::placeholder{
    color:#f5f5f5;
  }
 }
 // index页图标颜色
 .index-blue{
  color: #1989fa;
  .van-grid-item__text{
    color: #1989fa;
  }
 }
 // tab宽度
 .van-tab{
  flex-basis: 20% !important;
  -webkit-box-flex: 0 !important;
  -webkit-flex: 0 0 20% !important;
  flex: 0 0 20% !important;
  padding: 0 !important;
 }
 // picker
 .van-picker {
  .van-picker-column__item{
    .van-ellipsis {
      height: 44px;
      line-height: 44px;
      font-size: .4rem;
    }
  }
  .van-picker__toolbar {
    .van-picker__cancel, .van-picker__title, .van-picker__confirm {
      font-size: .4rem;
    }
    .van-ellipsis {
      line-height: .88rem;
      height: .88rem;
    }
  }
 }
 // 输入框
 .van-field {
  .van-field__body {
    input, textarea {
      font-size: .4rem;
      color: #131415;
    }
    input::-webkit-input-placeholder {
      font-size: .4rem;
    }
    input:-moz-placeholder {
      font-size: .4rem;
    }
    input::-moz-placeholder {
      font-size: .4rem;
    }
    input:-ms-input-placeholder {
      font-size: .4rem;
    }
  }
 }
 .canInput {
  .van-cell__value {
    .van-field__body {
      .van-field__control:disabled {
        font-size: .4rem;
        color: #131415;
        -webkit-text-fill-color: #131415;
      }
      input::-webkit-input-placeholder {
        -webkit-text-fill-color: #c8c9cc;
      }
      input:-moz-placeholder {
        -webkit-text-fill-color: #c8c9cc;
      }
      input::-moz-placeholder {
        -webkit-text-fill-color: #c8c9cc;
      }
      input:-ms-input-placeholder {
        -webkit-text-fill-color: #c8c9cc;
      }
    }
  }
 }
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/demo.css
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/demo.css
@ -0,0 +1,539 @@
 /* Logo 字体 */
@font-face {
  font-family: "iconfont logo";
  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
 }
 .logo {
  font-family: "iconfont logo";
  font-size: 160px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 }
 /* tabs */
 .nav-tabs {
  position: relative;
 }
 .nav-tabs .nav-more {
  position: absolute;
  right: 0;
  bottom: 0;
  height: 42px;
  line-height: 42px;
  color: #666;
 }
 #tabs {
  border-bottom: 1px solid #eee;
 }
 #tabs li {
  cursor: pointer;
  width: 100px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
  border-bottom: 2px solid transparent;
  position: relative;
  z-index: 1;
  margin-bottom: -1px;
  color: #666;
 }
 #tabs .active {
  border-bottom-color: #f00;
  color: #222;
 }
 .tab-container .content {
  display: none;
 }
 /* 页面布局 */
 .main {
  padding: 30px 100px;
  width: 960px;
  margin: 0 auto;
 }
 .main .logo {
  color: #333;
  text-align: left;
  margin-bottom: 30px;
  line-height: 1;
  height: 110px;
  margin-top: -50px;
  overflow: hidden;
  *zoom: 1;
 }
 .main .logo a {
  font-size: 160px;
  color: #333;
 }
 .helps {
  margin-top: 40px;
 }
 .helps pre {
  padding: 20px;
  margin: 10px 0;
  border: solid 1px #e7e1cd;
  background-color: #fffdef;
  overflow: auto;
 }
 .icon_lists {
  width: 100% !important;
  overflow: hidden;
  *zoom: 1;
 }
 .icon_lists li {
  width: 100px;
  margin-bottom: 10px;
  margin-right: 20px;
  text-align: center;
  list-style: none !important;
  cursor: default;
 }
 .icon_lists li .code-name {
  line-height: 1.2;
 }
 .icon_lists .icon {
  display: block;
  height: 100px;
  line-height: 100px;
  font-size: 42px;
  margin: 10px auto;
  color: #333;
  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
  -moz-transition: font-size 0.25s linear, width 0.25s linear;
  transition: font-size 0.25s linear, width 0.25s linear;
 }
 .icon_lists .icon:hover {
  font-size: 100px;
 }
 .icon_lists .svg-icon {
  /* 通过设置 font-size 来改变图标大小 */
  width: 1em;
  /* 图标和文字相邻时，垂直对齐 */
  vertical-align: -0.15em;
  /* 通过设置 color 来改变 SVG 的颜色/fill */
  fill: currentColor;
  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
      normalize.css 中也包含这行 */
  overflow: hidden;
 }
 .icon_lists li .name,
 .icon_lists li .code-name {
  color: #666;
 }
 /* markdown 样式 */
 .markdown {
  color: #666;
  font-size: 14px;
  line-height: 1.8;
 }
 .highlight {
  line-height: 1.5;
 }
 .markdown img {
  vertical-align: middle;
  max-width: 100%;
 }
 .markdown h1 {
  color: #404040;
  font-weight: 500;
  line-height: 40px;
  margin-bottom: 24px;
 }
 .markdown h2,
 .markdown h3,
 .markdown h4,
 .markdown h5,
 .markdown h6 {
  color: #404040;
  margin: 1.6em 0 0.6em 0;
  font-weight: 500;
  clear: both;
 }
 .markdown h1 {
  font-size: 28px;
 }
 .markdown h2 {
  font-size: 22px;
 }
 .markdown h3 {
  font-size: 16px;
 }
 .markdown h4 {
  font-size: 14px;
 }
 .markdown h5 {
  font-size: 12px;
 }
 .markdown h6 {
  font-size: 12px;
 }
 .markdown hr {
  height: 1px;
  border: 0;
  background: #e9e9e9;
  margin: 16px 0;
  clear: both;
 }
 .markdown p {
  margin: 1em 0;
 }
 .markdown>p,
 .markdown>blockquote,
 .markdown>.highlight,
 .markdown>ol,
 .markdown>ul {
  width: 80%;
 }
 .markdown ul>li {
  list-style: circle;
 }
 .markdown>ul li,
 .markdown blockquote ul>li {
  margin-left: 20px;
  padding-left: 4px;
 }
 .markdown>ul li p,
 .markdown>ol li p {
  margin: 0.6em 0;
 }
 .markdown ol>li {
  list-style: decimal;
 }
 .markdown>ol li,
 .markdown blockquote ol>li {
  margin-left: 20px;
  padding-left: 4px;
 }
 .markdown code {
  margin: 0 3px;
  padding: 0 5px;
  background: #eee;
  border-radius: 3px;
 }
 .markdown strong,
 .markdown b {
  font-weight: 600;
 }
 .markdown>table {
  border-collapse: collapse;
  border-spacing: 0px;
  empty-cells: show;
  border: 1px solid #e9e9e9;
  width: 95%;
  margin-bottom: 24px;
 }
 .markdown>table th {
  white-space: nowrap;
  color: #333;
  font-weight: 600;
 }
 .markdown>table th,
 .markdown>table td {
  border: 1px solid #e9e9e9;
  padding: 8px 16px;
  text-align: left;
 }
 .markdown>table th {
  background: #F7F7F7;
 }
 .markdown blockquote {
  font-size: 90%;
  color: #999;
  border-left: 4px solid #e9e9e9;
  padding-left: 0.8em;
  margin: 1em 0;
 }
 .markdown blockquote p {
  margin: 0;
 }
 .markdown .anchor {
  opacity: 0;
  transition: opacity 0.3s ease;
  margin-left: 8px;
 }
 .markdown .waiting {
  color: #ccc;
 }
 .markdown h1:hover .anchor,
 .markdown h2:hover .anchor,
 .markdown h3:hover .anchor,
 .markdown h4:hover .anchor,
 .markdown h5:hover .anchor,
 .markdown h6:hover .anchor {
  opacity: 1;
  display: inline-block;
 }
 .markdown>br,
 .markdown>p>br {
  clear: both;
 }
 .hljs {
  display: block;
  background: white;
  padding: 0.5em;
  color: #333333;
  overflow-x: auto;
 }
 .hljs-comment,
 .hljs-meta {
  color: #969896;
 }
 .hljs-string,
 .hljs-variable,
 .hljs-template-variable,
 .hljs-strong,
 .hljs-emphasis,
 .hljs-quote {
  color: #df5000;
 }
 .hljs-keyword,
 .hljs-selector-tag,
 .hljs-type {
  color: #a71d5d;
 }
 .hljs-literal,
 .hljs-symbol,
 .hljs-bullet,
 .hljs-attribute {
  color: #0086b3;
 }
 .hljs-section,
 .hljs-name {
  color: #63a35c;
 }
 .hljs-tag {
  color: #333333;
 }
 .hljs-title,
 .hljs-attr,
 .hljs-selector-id,
 .hljs-selector-class,
 .hljs-selector-attr,
 .hljs-selector-pseudo {
  color: #795da3;
 }
 .hljs-addition {
  color: #55a532;
  background-color: #eaffea;
 }
 .hljs-deletion {
  color: #bd2c00;
  background-color: #ffecec;
 }
 .hljs-link {
  text-decoration: underline;
 }
 /* 代码高亮 */
 /* PrismJS 1.15.0
 https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
 /**
 * prism.js default theme for JavaScript, CSS and HTML
 * Based on dabblet (http://dabblet.com)
 * @author Lea Verou
 */
 code[class*="language-"],
 pre[class*="language-"] {
  color: black;
  background: none;
  text-shadow: 0 1px white;
  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.5;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
 }
 pre[class*="language-"]::-moz-selection,
 pre[class*="language-"] ::-moz-selection,
 code[class*="language-"]::-moz-selection,
 code[class*="language-"] ::-moz-selection {
  text-shadow: none;
  background: #b3d4fc;
 }
 pre[class*="language-"]::selection,
 pre[class*="language-"] ::selection,
 code[class*="language-"]::selection,
 code[class*="language-"] ::selection {
  text-shadow: none;
  background: #b3d4fc;
 }
@media print {
  code[class*="language-"],
  pre[class*="language-"] {
    text-shadow: none;
  }
 }
 /* Code blocks */
 pre[class*="language-"] {
  padding: 1em;
  margin: .5em 0;
  overflow: auto;
 }
 :not(pre)>code[class*="language-"],
 pre[class*="language-"] {
  background: #f5f2f0;
 }
 /* Inline code */
 :not(pre)>code[class*="language-"] {
  padding: .1em;
  border-radius: .3em;
  white-space: normal;
 }
 .token.comment,
 .token.prolog,
 .token.doctype,
 .token.cdata {
  color: slategray;
 }
 .token.punctuation {
  color: #999;
 }
 .namespace {
  opacity: .7;
 }
 .token.property,
 .token.tag,
 .token.boolean,
 .token.number,
 .token.constant,
 .token.symbol,
 .token.deleted {
  color: #905;
 }
 .token.selector,
 .token.attr-name,
 .token.string,
 .token.char,
 .token.builtin,
 .token.inserted {
  color: #690;
 }
 .token.operator,
 .token.entity,
 .token.url,
 .language-css .token.string,
 .style .token.string {
  color: #9a6e3a;
  background: hsla(0, 0%, 100%, .5);
 }
 .token.atrule,
 .token.attr-value,
 .token.keyword {
  color: #07a;
 }
 .token.function,
 .token.class-name {
  color: #DD4A68;
 }
 .token.regex,
 .token.important,
 .token.variable {
  color: #e90;
 }
 .token.important,
 .token.bold {
  font-weight: bold;
 }
 .token.italic {
  font-style: italic;
 }
 .token.entity {
  cursor: help;
 }
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/demo_index.html
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/demo_index.html
@ -0,0 +1,237 @@
 <!DOCTYPE html>
 <html>
 <head>
  <meta charset="utf-8"/>
  <title>iconfont Demo</title>
  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
  <style>
    .main .logo {
      margin-top: 0;
      height: auto;
    }
    .main .logo a {
      display: flex;
      align-items: center;
    }
    .main .logo .sub-title {
      margin-left: 0.5em;
      font-size: 22px;
      color: #fff;
      background: linear-gradient(-45deg, #3967FF, #B500FE);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  </style>
 </head>
 <body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
    </a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=3551906" target="_blank" class="nav-more">查看项目</a>
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
            <li class="dib">
              <span class="icon iconfont">&#xe602;</span>
                <div class="name">箭头</div>
                <div class="code-name">&amp;#xe602;</div>
              </li>
            <li class="dib">
              <span class="icon iconfont">&#xe603;</span>
                <div class="name">日历</div>
                <div class="code-name">&amp;#xe603;</div>
              </li>
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>
          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
 <pre><code class="language-css"
 >@font-face {
  font-family: 'iconfont';
  src: url('iconfont.eot?t=1658995551520'); /* IE9 */
  src: url('iconfont.eot?t=1658995551520#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('iconfont.woff2?t=1658995551520') format('woff2'),
       url('iconfont.woff?t=1658995551520') format('woff'),
       url('iconfont.ttf?t=1658995551520') format('truetype'),
       url('iconfont.svg?t=1658995551520#iconfont') format('svg');
 }
 </code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
 <pre><code class="language-css"
 >.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 }
 </code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
 <pre>
 <code class="language-html"
 >&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
 </code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          <li class="dib">
            <span class="icon iconfont iconfont-jiantou"></span>
            <div class="name">
              箭头
            </div>
            <div class="code-name">.iconfont-jiantou
            </div>
          </li>
          <li class="dib">
            <span class="icon iconfont iconfont-rili"></span>
            <div class="name">
              日历
            </div>
            <div class="code-name">.iconfont-rili
            </div>
          </li>
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>
        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
 <pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
 </code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
 <pre><code class="language-html">&lt;span class="iconfont iconfont-xxx"&gt;&lt;/span&gt;
 </code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#iconfont-jiantou"></use>
                </svg>
                <div class="name">箭头</div>
                <div class="code-name">#iconfont-jiantou</div>
            </li>
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#iconfont-rili"></use>
                </svg>
                <div class="name">日历</div>
                <div class="code-name">#iconfont-rili</div>
            </li>
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>
          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
 <pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
 </code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
 <pre><code class="language-html">&lt;style&gt;
 .icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
 }
 &lt;/style&gt;
 </code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
 <pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
 &lt;/svg&gt;
 </code></pre>
          </div>
      </div>
    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()
      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()
        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')
          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
 </body>
 </html>
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.css
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.css
@ -0,0 +1,26 @@
@font-face {
  font-family: "iconfont"; /* Project id 3551906 */
  src: url('iconfont.eot?t=1658995551520'); /* IE9 */
  src: url('iconfont.eot?t=1658995551520#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('iconfont.woff2?t=1658995551520') format('woff2'),
       url('iconfont.woff?t=1658995551520') format('woff'),
       url('iconfont.ttf?t=1658995551520') format('truetype'),
       url('iconfont.svg?t=1658995551520#iconfont') format('svg');
 }
 .iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 }
 .iconfont-jiantou:before {
  content: "\e602";
 }
 .iconfont-rili:before {
  content: "\e603";
 }
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.eot
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.eot
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.js
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.js
@ -0,0 +1 @@
 !function(e){var t,n,o,i,a,c='<svg><symbol id="iconfont-jiantou" viewBox="0 0 7509 1024"><path d="M7509.333333 0l-341.333333 324.266667-426.666667 426.666666a144.810667 144.810667 0 0 1-204.8-204.8l221.866667-221.866666H2218.666667V0h5290.666666zM1877.333333 0v341.333333h-512V0h512z m-682.666666 0v341.333333H682.666667V0h512zM341.333333 0v341.333333H0V0h341.333333z" fill="#4271FF" ></path></symbol><symbol id="iconfont-rili" viewBox="0 0 1024 1024"><path d="M259.424 287.488a28.096 28.096 0 0 0-28.064 28.064v449.024c0 15.488 12.608 28.064 28.064 28.064h505.152a28.064 28.064 0 0 0 28.064-28.064V315.52a28.096 28.096 0 0 0-28.064-28.064H259.424z m505.152 561.28H259.424c-46.4 0-84.16-37.76-84.16-84.192V315.52c0-46.4 37.76-84.16 84.16-84.16h505.152c46.4 0 84.16 37.76 84.16 84.16v449.024c0 46.4-37.76 84.16-84.16 84.16zM373.44 343.616h-3.52a26.368 26.368 0 0 1-26.272-26.272V201.568c0-14.464 11.808-26.336 26.272-26.336h3.52c14.496 0 26.304 11.84 26.304 26.336v115.776a26.368 26.368 0 0 1-26.304 26.272m280.64 0h-3.52a26.368 26.368 0 0 1-26.304-26.272V201.568c0-14.464 11.84-26.336 26.304-26.336h3.52c14.464 0 26.272 11.84 26.272 26.336v115.776a26.368 26.368 0 0 1-26.272 26.272m-282.4 308.704H315.552a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064m168.384 0h-56.128a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064M371.68 512H315.552a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064m336.768 0h-56.128a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064m-168.384 0h-56.128a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064" fill="#0B58FF" ></path></symbol></svg>',d=(d=document.getElementsByTagName("script"))[d.length-1].getAttribute("data-injectcss"),l=function(e,t){t.parentNode.insertBefore(e,t)};if(d&&!e.__iconfont__svg__cssinject__){e.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(e){console&&console.log(e)}}function s(){a||(a=!0,o())}function h(){try{i.documentElement.doScroll("left")}catch(e){return void setTimeout(h,50)}s()}t=function(){var e,t=document.createElement("div");t.innerHTML=c,c=null,(t=t.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",t=t,(e=document.body).firstChild?l(t,e.firstChild):e.appendChild(t))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(t,0):(n=function(){document.removeEventListener("DOMContentLoaded",n,!1),t()},document.addEventListener("DOMContentLoaded",n,!1)):document.attachEvent&&(o=t,i=e.document,a=!1,h(),i.onreadystatechange=function(){"complete"==i.readyState&&(i.onreadystatechange=null,s())})}(window);
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.json
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.json
@ -0,0 +1,23 @@
 {
  "id": "3551906",
  "name": "hf-pda",
  "font_family": "iconfont",
  "css_prefix_text": "iconfont-",
  "description": "",
  "glyphs": [
    {
      "icon_id": "30915165",
      "name": "箭头",
      "font_class": "jiantou",
      "unicode": "e602",
      "unicode_decimal": 58882
    },
    {
      "icon_id": "30915166",
      "name": "日历",
      "font_class": "rili",
      "unicode": "e603",
      "unicode_decimal": 58883
    }
  ]
 }
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.svg
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.svg
@ -0,0 +1,23 @@
 <?xml version="1.0" standalone="no"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
 <svg xmlns="http://www.w3.org/2000/svg">
  <metadata>Created by iconfont</metadata>
  <defs>
  <font id="iconfont" horiz-adv-x="1024">
    <font-face
      font-family="iconfont"
      font-weight="400"
      font-stretch="normal"
      units-per-em="1024"
      ascent="896"
      descent="-128"
    />
      <missing-glyph />
      <glyph glyph-name="jiantou" unicode="&#58882;" d="M7509.333333 896l-341.333333-324.266667-426.666667-426.666666a144.810667 144.810667 0 0 0-204.8 204.8l221.866667 221.866666H2218.666667V896h5290.666666zM1877.333333 896v-341.333333h-512V896h512z m-682.666666 0v-341.333333H682.666667V896h512zM341.333333 896v-341.333333H0V896h341.333333z"  horiz-adv-x="7509" />
      <glyph glyph-name="rili" unicode="&#58883;" d="M259.424 608.512a28.096 28.096 0 0 1-28.064-28.064v-449.024c0-15.488 12.608-28.064 28.064-28.064h505.152a28.064 28.064 0 0 1 28.064 28.064V580.48a28.096 28.096 0 0 1-28.064 28.064H259.424z m505.152-561.28H259.424c-46.4 0-84.16 37.76-84.16 84.192V580.48c0 46.4 37.76 84.16 84.16 84.16h505.152c46.4 0 84.16-37.76 84.16-84.16v-449.024c0-46.4-37.76-84.16-84.16-84.16zM373.44 552.384h-3.52a26.368 26.368 0 0 0-26.272 26.272V694.432c0 14.464 11.808 26.336 26.272 26.336h3.52c14.496 0 26.304-11.84 26.304-26.336v-115.776a26.368 26.368 0 0 0-26.304-26.272m280.64 0h-3.52a26.368 26.368 0 0 0-26.304 26.272V694.432c0 14.464 11.84 26.336 26.304 26.336h3.52c14.464 0 26.272-11.84 26.272-26.336v-115.776a26.368 26.368 0 0 0-26.272-26.272m-282.4-308.704H315.552a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064m168.384 0h-56.128a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064M371.68 384H315.552a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064m336.768 0h-56.128a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064m-168.384 0h-56.128a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064"  horiz-adv-x="1024" />
    </font>
  </defs>
 </svg>
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.ttf
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.ttf
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.woff
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.woff
--- a/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.woff2
+++ b/src/assets/css/font_3551906_yf5q3wbhp9m/iconfont.woff2
--- a/src/assets/css/iconfont.css
+++ b/src/assets/css/iconfont.css
@ -0,0 +1,26 @@
@font-face {
  font-family: "iconfont"; /* Project id 3551906 */
  src: url('./iconfont/iconfont.eot?t=1658995551520'); /* IE9 */
  src: url('./iconfont/iconfont.eot?t=1658995551520#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./iconfont/iconfont.woff2?t=1658995551520') format('woff2'),
       url('./iconfont/iconfont.woff?t=1658995551520') format('woff'),
       url('./iconfont/iconfont.ttf?t=1658995551520') format('truetype'),
       url('./iconfont/iconfont.svg?t=1658995551520#iconfont') format('svg');
 }
 .iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 }
 .iconfont-jiantou:before {
  content: "\e602";
 }
 .iconfont-rili:before {
  content: "\e603";
 }
--- a/src/assets/css/iconfont/iconfont.eot
+++ b/src/assets/css/iconfont/iconfont.eot
--- a/src/assets/css/iconfont/iconfont.svg
+++ b/src/assets/css/iconfont/iconfont.svg
@ -0,0 +1,23 @@
 <?xml version="1.0" standalone="no"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
 <svg xmlns="http://www.w3.org/2000/svg">
  <metadata>Created by iconfont</metadata>
  <defs>
  <font id="iconfont" horiz-adv-x="1024">
    <font-face
      font-family="iconfont"
      font-weight="400"
      font-stretch="normal"
      units-per-em="1024"
      ascent="896"
      descent="-128"
    />
      <missing-glyph />
      <glyph glyph-name="jiantou" unicode="&#58882;" d="M7509.333333 896l-341.333333-324.266667-426.666667-426.666666a144.810667 144.810667 0 0 0-204.8 204.8l221.866667 221.866666H2218.666667V896h5290.666666zM1877.333333 896v-341.333333h-512V896h512z m-682.666666 0v-341.333333H682.666667V896h512zM341.333333 896v-341.333333H0V896h341.333333z"  horiz-adv-x="7509" />
      <glyph glyph-name="rili" unicode="&#58883;" d="M259.424 608.512a28.096 28.096 0 0 1-28.064-28.064v-449.024c0-15.488 12.608-28.064 28.064-28.064h505.152a28.064 28.064 0 0 1 28.064 28.064V580.48a28.096 28.096 0 0 1-28.064 28.064H259.424z m505.152-561.28H259.424c-46.4 0-84.16 37.76-84.16 84.192V580.48c0 46.4 37.76 84.16 84.16 84.16h505.152c46.4 0 84.16-37.76 84.16-84.16v-449.024c0-46.4-37.76-84.16-84.16-84.16zM373.44 552.384h-3.52a26.368 26.368 0 0 0-26.272 26.272V694.432c0 14.464 11.808 26.336 26.272 26.336h3.52c14.496 0 26.304-11.84 26.304-26.336v-115.776a26.368 26.368 0 0 0-26.304-26.272m280.64 0h-3.52a26.368 26.368 0 0 0-26.304 26.272V694.432c0 14.464 11.84 26.336 26.304 26.336h3.52c14.464 0 26.272-11.84 26.272-26.336v-115.776a26.368 26.368 0 0 0-26.272-26.272m-282.4-308.704H315.552a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064m168.384 0h-56.128a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064M371.68 384H315.552a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064m336.768 0h-56.128a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064m-168.384 0h-56.128a28.16 28.16 0 0 0-28.064 28.064 28.16 28.16 0 0 0 28.064 28.064h56.128a28.16 28.16 0 0 0 28.064-28.064 28.16 28.16 0 0 0-28.064-28.064"  horiz-adv-x="1024" />
    </font>
  </defs>
 </svg>
--- a/src/assets/css/iconfont/iconfont.ttf
+++ b/src/assets/css/iconfont/iconfont.ttf
--- a/src/assets/css/iconfont/iconfont.woff
+++ b/src/assets/css/iconfont/iconfont.woff
--- a/src/assets/css/iconfont/iconfont.woff2
+++ b/src/assets/css/iconfont/iconfont.woff2
--- a/src/assets/css/reset.css
+++ b/src/assets/css/reset.css
@ -0,0 +1,25 @@
@charset "utf-8";html{background-color:#fff;color:#131415;font-size:12px}
 body,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,figure,form,fieldset,legend,input,textarea,button,p,blockquote,th,td,pre,xmp{margin:0;padding:0}
 body,input,textarea,button,select,pre,xmp,tt,code,kbd,samp{line-height:1.5;font-family:tahoma,arial,"Hiragino Sans GB",simsun,sans-serif}
 h1,h2,h3,h4,h5,h6,small,big,input,textarea,button,select{font-size:100%}
 h1,h2,h3,h4,h5,h6{font-family:tahoma,arial,"Hiragino Sans GB","微软雅黑",simsun,sans-serif}
 h1,h2,h3,h4,h5,h6,b,strong{font-weight:normal}
 address,cite,dfn,em,i,optgroup,var{font-style:normal}
 table{border-collapse:collapse;border-spacing:0;text-align:left}
 caption,th{text-align:inherit}
 ul,ol,menu{list-style:none}
 fieldset,img{border:0}
 img,object,input,textarea,button,select{vertical-align:middle}
 article,aside,footer,header,section,nav,figure,figcaption,hgroup,details,menu{display:block}
 audio,canvas,video{display:inline-block;*display:inline;*zoom:1}
 blockquote:before,blockquote:after,q:before,q:after{content:"\0020"}
 textarea{overflow:auto;resize:vertical}
 input,textarea,button,select,a{outline:0 none;border: none;}
 button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}
 mark{background-color:transparent}
 a,ins,s,u,del{text-decoration:none}
 sup,sub{vertical-align:baseline}
 html {overflow-x: hidden;height: 100%;font-size: 50px;-webkit-tap-highlight-color: transparent;}
 body {font-family: Arial, "Microsoft Yahei", "Helvetica Neue", Helvetica, sans-serif;color: #131415;font-size: .28em;line-height: 1;-webkit-text-size-adjust: none;}
 hr {height: .02rem;margin: .1rem 0;border: medium none;border-top: .02rem solid #cacaca;}
 a {color: #25a4bb;text-decoration: none;}
--- a/src/assets/img/08质量.png
+++ b/src/assets/img/08质量.png
--- a/src/assets/img/back.png
+++ b/src/assets/img/back.png
--- a/src/assets/img/background.png
+++ b/src/assets/img/background.png
--- a/src/assets/img/l1.png
+++ b/src/assets/img/l1.png
--- a/src/assets/img/l2.png
+++ b/src/assets/img/l2.png
--- a/src/assets/img/left.png
+++ b/src/assets/img/left.png
--- a/src/assets/img/left1.png
+++ b/src/assets/img/left1.png
--- a/src/assets/img/logo.png
+++ b/src/assets/img/logo.png
--- a/src/assets/img/model.png
+++ b/src/assets/img/model.png
--- a/src/assets/img/nav-left.png
+++ b/src/assets/img/nav-left.png
--- a/src/assets/img/nav-right.png
+++ b/src/assets/img/nav-right.png
--- a/src/assets/img/nav.png
+++ b/src/assets/img/nav.png
--- a/src/assets/img/overviewBasemap.png
+++ b/src/assets/img/overviewBasemap.png
--- a/src/assets/img/q1.png
+++ b/src/assets/img/q1.png
--- a/src/assets/img/q2.png
+++ b/src/assets/img/q2.png
--- a/src/assets/img/r1.png
+++ b/src/assets/img/r1.png
--- a/src/assets/img/r2.png
+++ b/src/assets/img/r2.png
--- a/src/assets/img/right.png
+++ b/src/assets/img/right.png
--- a/src/assets/img/right1.png
+++ b/src/assets/img/right1.png
--- a/src/assets/img/user.png
+++ b/src/assets/img/user.png
--- a/src/assets/img/概况.png
+++ b/src/assets/img/概况.png
--- a/src/assets/img/首页.png
+++ b/src/assets/img/首页.png
--- a/src/assets/js/rem.js
+++ b/src/assets/js/rem.js
@ -0,0 +1,15 @@
 (function (doc, win) {
  var docEl = doc.documentElement
  var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'
  var recalc = function () {
    var clientWidth = docEl.clientWidth
    if (!clientWidth) return
    var fontSize = 50 * (clientWidth / 375)
    window.xPixelRatio = 100 / fontSize
    docEl.style.fontSize = fontSize + 'px'
  }
  recalc()
  if (!doc.addEventListener) return
  win.addEventListener(resizeEvt, recalc, false)
  doc.addEventListener('DOMContentLoaded', recalc, false)
 })(document, window)
--- a/src/components/VanFieldCheckBox.vue
+++ b/src/components/VanFieldCheckBox.vue
@ -0,0 +1,189 @@
 <template>
  <div class="dh-field">
    <div class="van-picker__toolbar">
      <button type="button" class="van-picker__cancel" @click="cancel">取消</button>
      <div class="van-ellipsis van-picker__title">{{$attrs.label}}</div>
      <button type="button" class="van-picker__confirm" @click="onConfirm">确认</button>
    </div>
    <div style="max-height:264px; overflow-y:auto;">
      <van-field v-if="isSearch" v-model="searchVal" input-align="left" placeholder="搜索" @input="search"/>
      <van-cell title="全选">
        <template #right-icon>
          <van-checkbox v-model="checkedAll" name="all" @click="toggleAll"/>
        </template>
      </van-cell>
      <van-checkbox-group ref="checkboxGroup" v-model="checkboxValue" @change="change">
        <van-cell-group>
          <van-cell
            v-for="(item, index) in columnsData"
            :key="item[option.value]"
            :title="item[option.label]"
            clickable
            @click="toggle(index)"
          >
            <template #right-icon>
              <van-checkbox ref="checkboxes" :name="item[option.value]" />
            </template>
          </van-cell>
        </van-cell-group>
      </van-checkbox-group>
    </div>
  </div>
 </template>
 <script>
 export default {
  name: 'VanFieldCheckbox',
  model: {
    prop: 'selectValue'
  },
  props: {
    columns: {
      type: Array,
      default: function () {
        return []
      }
    },
    selectValue: {
      type: Array,
      default: function () {
        return []
      }
    },
    option: {
      type: Object,
      default: function () {
        return { label: 'label', value: 'value' }
      }
    },
    // 是否支持搜索
    isSearch: {
      type: Boolean,
      default: true
    }
  },
  computed: {
    resultLabel: {
      get () {
        const res = this.columns.filter(item => {
          return this.resultValue.indexOf(item[this.option.value]) > -1
        })
        const resLabel = res.map(item => {
          return item[this.option.label]
        })
        return resLabel.join(',')
      }
    }
  },
  data () {
    return {
      show: false,
      searchVal: '',
      columnsData: JSON.parse(JSON.stringify(this.columns)),
      checkboxValue: JSON.parse(JSON.stringify(this.selectValue)),
      checkedAll: false,
      resultValue: JSON.parse(JSON.stringify(this.selectValue))
    }
  },
  methods: {
    // 搜索
    search (val) {
      if (val) {
        this.columnsData = this.columnsData.filter(item => {
          return item[this.option.label].indexOf(val) > -1
        })
      } else {
        this.columnsData = JSON.parse(JSON.stringify(this.columns))
      }
    },
    getData (val) {
      const res = this.columnsData.filter(item => {
        return val.indexOf(item[this.option.value]) > -1
      })
      return res
    },
    onConfirm () {
      this.resultValue = this.checkboxValue
      this.show = !this.show
      this.$emit('confirm', this.resultValue, this.getData(this.resultValue))
    },
    change (val) {
      this.$emit('change', val, this.getData(this.resultValue))
    },
    cancel () {
      this.show = !this.show
      this.$emit('cancel', this.resultValue)
    },
    toggle (index) {
      this.$refs.checkboxes[index].toggle()
    },
    toggleAll (all) {
      this.$refs.checkboxGroup.toggleAll(this.checkedAll)
    },
    showPopu (disabled) {
      this.columnsData = JSON.parse(JSON.stringify(this.columns))
      this.checkboxValue = JSON.parse(JSON.stringify(this.selectValue))
      this.resultValue = JSON.parse(JSON.stringify(this.selectValue))
      if (disabled !== undefined && disabled !== false) {
        return false
      } else {
        this.show = !this.show
      }
    }
  },
  watch: {
    selectValue: function (newVal) {
      this.resultValue = newVal
    },
    resultValue (val) {
      this.searchVal = ''
      this.columnsData = JSON.parse(JSON.stringify(this.columns))
      this.$emit('input', val)
    },
    columnsData: {
      handler (val) {
        if (val.length && val.length === this.checkboxValue.length) {
          this.checkedAll = true
        } else {
          this.checkedAll = false
        }
      },
      immediate: true
    },
    checkboxValue: {
      handler (val) {
        if (val.length && val.length === this.columnsData.length) {
          this.checkedAll = true
        } else {
          this.checkedAll = false
        }
      },
      immediate: true
    }
  }
 }
 </script>
 <style lang="scss" scoped>
 .dh-field {
  padding: 0;
  background:#fff;
  .dh-cell.van-cell {
    padding: 10px 0;
  }
  .dh-cell.van-cell--required::before {
    left: -8px;
  }
  .van-popup {
    border-radius: 20px 20px 0 0;
  }
 }
 </style>
 <style lang="scss">
 .dh-field {
  .van-cell__title, .van-picker__confirm, .van-picker__cancel {
    font-size: .36rem;
  }
 }
 </style>
--- a/src/components/index.js
+++ b/src/components/index.js
@ -0,0 +1,9 @@
 import Vue from 'vue'
 import waterFall from './waterFall'
 import shortLine from './shortLine'
 import VanFieldCheckBox from './VanFieldCheckBox'
 Vue.component('waterFall', waterFall)
 Vue.component('shortLine', shortLine)
 Vue.component('VanFieldCheckBox', VanFieldCheckBox)
--- a/src/components/shortLine.vue
+++ b/src/components/shortLine.vue
@ -0,0 +1,43 @@
 <!--
 * @Author: gtz
 * @Date: 2022-07-28 10:22:30
 * @LastEditors: gtz
 * @LastEditTime: 2022-07-28 16:47:14
 * @Description: file content
 * @FilePath: \hf-pda\src\components\shortLine.vue
 -->
 <template>
  <div class="shortLine" :style="lineStyle" />
 </template>
 <script>
 export default {
  name: 'shortLine',
  props: {
    lineStyle: {
      tpye: Object,
      default: () => {
        return {
          background: '#4271FF',
          width: '0.0525rem',
          height: '0.375rem',
          borderRadius: '0.0525rem',
          top: '0.06rem'
        }
      }
    }
  },
  data () {
    return {}
  },
  methods: {}
 }
 </script>
 <style lang="scss" scoped>
 .shortLine {
  display: inline-block;
  position: relative;
 }
 </style>
--- a/src/components/waterFall.vue
+++ b/src/components/waterFall.vue
@ -0,0 +1,32 @@
 <template>
  <div class="water-fall">
    {{isOver ? '加载更多...' : '没有更多数据了'}}
  </div>
 </template>
 <script>
 export default {
  name: 'waterFall',
  data () {
    return {
      Height: null
    }
  },
  props: {
    isOver: {
      type: Boolean
    }
  }
 }
 </script>
 <style lang="scss">
  .water-fall{
    width: 100%;
    height: 1rem;
    line-height: 1rem;
    text-align: center;
    font-size: .24rem;
    color: #999;
  }
 </style>
--- a/src/main.js
+++ b/src/main.js
@ -0,0 +1,39 @@
 /*
 * @Author: gtz
 * @Date: 2022-07-25 14:18:00
 * @LastEditors: DY
 * @LastEditTime: 2022-09-07 09:21:31
 * @Description: file content
 * @FilePath: \hf-pda\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 fastClick from 'fastclick'
 // import Vconsole from 'vconsole'
 import './assets/js/rem'
 import './assets/css/reset.css'
 import './assets/css/all.scss'
 import './assets/css/iconfont.css'
 import './components/'
 import store from '@/store'
 import { Button, Field, Icon, Dialog, Grid, GridItem, NavBar, Popup, Row, Col, Stepper, Picker, DatetimePicker, PullRefresh, Cell, CellGroup, Tag, Checkbox, CheckboxGroup, Tab, Tabs, Sticky, Calendar, Uploader, SwipeCell, Radio, RadioGroup } from 'vant'
 Vue.use(Button).use(Field).use(Icon).use(Dialog).use(Grid).use(GridItem).use(NavBar).use(Popup).use(Row).use(Col).use(Stepper).use(Picker).use(DatetimePicker).use(PullRefresh).use(Cell).use(CellGroup).use(Tag).use(Checkbox).use(CheckboxGroup).use(Tab).use(Tabs).use(Sticky).use(Calendar).use(Uploader).use(SwipeCell).use(Radio).use(RadioGroup)
 // const vConsole = new Vconsole()
 Vue.config.productionTip = false
 fastClick.attach(document.body)
 /* eslint-disable no-new */
 new Vue({
  el: '#app',
  router,
  store,
  components: { App },
  template: '<App/>'
 })
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@ -0,0 +1,136 @@
 <template>
  <div class="index">
    <div><router-view /></div>
    <div class="nav-div" :style="{ 'backgroundImage': 'url(' + navImg + ')' }">
       <van-row justify="center">
          <van-col span="8">
            <div :class="homePage ? 'van-button' : 'un-button'" :style="{ 'color': homeColor }" style="margin-left: 52%; text-align: center" @click="toRouter('home')">
              <img v-if="homePage" src="../../assets/img/l2.png" alt="">
              <img v-else src="../../assets/img/l1.png" alt="">
              <p>首页</p>
            </div>
          </van-col>
          <van-col span="8" style="text-align: center">
            <div :class="[qualityPage ? 'van-button' : 'un-button', qualityPage ? 'font-color' : '']" style="margin-left: 36.8%;" @click="toRouter('quality')">
              <img v-if="qualityPage || homePage" src="../../assets/img/q1.png" alt="">
              <img v-else src="../../assets/img/q2.png" alt="">
              <p>质量</p>
            </div>
          </van-col>
          <van-col span="8">
            <div :class="[overviewPage ? 'van-button' : 'un-button', overviewPage ? 'font-color' : '']" style="margin-left: 26%; text-align: center" @click="toRouter('overview')">
              <img v-if="overviewPage || homePage" src="../../assets/img/r2.png" alt="">
              <img v-else src="../../assets/img/r1.png" alt="">
              <p>概况</p>
            </div>
          </van-col>
          <!-- van-col span="8">
            <van-button icon="../../assets/img/q1.png" round type="sucess">质量</van-button>
          </van-col>
          <van-col span="8">
            <van-button round type="sucess">首页</van-button>
          </van-col> -->
        </van-row>
      <!-- </div> -->
    </div>
  </div>
 </template>
 <script>
 export default {
  name: 'login',
  data () {
    return {
      Height: null,
      homePage: true,
      qualityPage: false,
      overviewPage: false,
      navImg: require('../../assets/img/left.png'),
      homeColor: 'white'
    }
  },
  mounted () {
    this.Height = window.innerHeight
  },
  methods: {
    toRouter (page) {
      if (page === 'home') {
        this.homePage = true
        this.qualityPage = false
        this.overviewPage = false
        this.navImg = require('../../assets/img/nav-left.png')
        this.homeColor = 'white'
        this.$router.push('home')
      } else if (page === 'quality') {
        this.homePage = false
        this.qualityPage = true
        this.overviewPage = false
        this.homeColor = '#0B58FF'
        this.navImg = require('../../assets/img/nav.png')
        this.$router.push('quality')
      } else if (page === 'overview') {
        this.homePage = false
        this.qualityPage = false
        this.overviewPage = true
        this.navImg = require('../../assets/img/nav-right.png')
        this.homeColor = '#0B58FF'
        this.$router.push('overview')
      }
    }
    // toRouter (router, v) {
    //   if (router) {
    //     if (v.text === '退出') {
    //       this.$store.commit('user/updateUserInfo', null)
    //       window.sessionStorage.removeItem('userInfo')
    //     }
    //     this.$router.push(router)
    //   } else {
    //     Toast.fail('模块待开发,敬请期待')
    //   }
    // }
  }
 }
 </script>
 <style lang="scss" scoped>
  .font-color {
    color: white;
  }
  .un-button{
    font-size: 0.1px;
    margin: 0.15rem auto 0 auto;
    width: 0.64rem;
    height: 0.57rem;
    color: #0B58FF;
    // text-align: center;
  }
  .van-button{
    margin-top: -0.25rem;
    background-color: #0B58FF;
    color: white;
    width: 0.64rem;
    height: 0.64rem;
    box-shadow: 4px 0px 16px 0px rgba(0,0,0,0.07);
    font-size: 0.1rem;
    border-radius: 50%;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .nav-div{
    // background-image: url('../../assets/img/nav.png');
    background-size: 100% 0.727rem;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 0.762rem;
  }
  .index{
    // width: 100vh;
    height: 4.21rem;
    background-color: #EDEFF0;
  }
 </style>
--- a/src/pages/overview/overview.vue
+++ b/src/pages/overview/overview.vue
@ -0,0 +1,597 @@
 <template>
  <div class="index">
    <div class="top">
      <div class="left">
        <van-row>
          <van-col>
            <img src="../../assets/img/logo.png" alt="">
            合肥新能源深加工数智工厂
          </van-col>
        </van-row>
        <van-row>
          <van-col class="description">
            © 中建材智能自动化研究院
          </van-col>
        </van-row>
      </div>
      <p>产线概况</p>
      <div class="right">
        <div>
          <p style="font-size: 0.1rem;">2022.12.24</p>
          <p style="font-size: 0.142rem;">23.12</p>
        </div>
      </div>
    </div>
    <div class="middle">
      <ul class="week">
        <li>
          <h2>
            本周产量
          </h2>
        </li>
        <li>
          <div><span>A</span> <span>8390</span></div>
        </li>
        <li>
          <div><span>A</span> <span>8390</span></div>
        </li>
        <li>
          <div><span>A</span> <span>8390</span></div>
        </li>
        <li>
          <div><span>A</span> <span>8390</span></div>
        </li>
      </ul>
      <ul class="day">
        <li>
          <h2>
            本日产量
          </h2>
        </li>
        <li>
          <div><span>A</span> <span>600</span></div>
        </li>
        <li>
          <div><span>A</span> <span>500</span></div>
        </li>
        <li>
          <div><span>A</span> <span>524</span></div>
        </li>
        <li>
          <div><span>A</span> <span>601</span></div>
        </li>
      </ul>
      <ul class="pass">
        <li>
          <h2>
            合格率
          </h2>
        </li>
        <li>
          <div><span>A</span> <span>97%</span></div>
        </li>
        <li>
          <div><span>A</span> <span>98%</span></div>
        </li>
        <li>
          <div><span>A</span> <span>96%</span></div>
        </li>
        <li>
          <div><span>A</span> <span>99%</span></div>
        </li>
      </ul>
      <ul class="energy">
        <li>
          <h2>
            能耗总量
          </h2>
        </li>
        <li>
          <div><span>A</span> <span>3900kW·h</span></div>
        </li>
        <li>
          <div><span>A</span> <span>3900kW·h</span></div>
        </li>
        <li>
          <div><span>A</span> <span>3900kW·h</span></div>
        </li>
        <li>
          <div><span>A</span> <span>3900kW·h</span></div>
        </li>
      </ul>
      <ul class="unit">
        <li>
          <h2>
            单位能耗
          </h2>
        </li>
        <li>
          <div><span>A</span> <span>3900kW·h</span></div>
        </li>
        <li>
          <div><span>A</span> <span>3900kW·h</span></div>
        </li>
        <li>
          <div><span>A</span> <span>3900kW·h</span></div>
        </li>
        <li>
          <div><span>A</span> <span>3900kW·h</span></div>
        </li>
      </ul>
      <ul class="equipment">
        <li>
          <h2>
            设备OEE
          </h2>
        </li>
        <li>
          <div><span>A</span> <span>95%</span></div>
        </li>
        <li>
          <div><span>A</span> <span>95%</span></div>
        </li>
        <li>
          <div><span>A</span> <span>95%</span></div>
        </li>
        <li>
          <div><span>A</span> <span>95%</span></div>
        </li>
      </ul>
      <ul class="monitor">
        <li>
          <h2>
            当班班长
          </h2>
        </li>
        <li>
          <div><span>A</span> <span>张三</span></div>
        </li>
        <li>
          <div><span>A</span> <span>李四</span></div>
        </li>
        <li>
          <div><span>A</span> <span>王五</span></div>
        </li>
        <li>
          <div><span>A</span> <span>刘涛</span></div>
        </li>
      </ul>
    </div>
  </div>
 </template>
 <script>
 import { Toast } from 'vant'
 const dataWeekList = [
  {
    title: '本周产量'
  },
  {
    label: 'A',
    data: '8390'
  },
  {
    label: 'B',
    data: '8390'
  },
  {
    label: 'C',
    data: '8390'
  },
  {
    label: 'D',
    data: '8390'
  }
 ]
 export default {
  name: 'login',
  data () {
    return {
      Height: null,
      dataWeekList
    }
  },
  mounted () {
    this.Height = window.innerHeight
  },
  methods: {
    toRouter (router, v) {
      if (router) {
        if (v.text === '退出') {
          this.$store.commit('user/updateUserInfo', null)
          window.sessionStorage.removeItem('userInfo')
        }
        this.$router.push(router)
      } else {
        Toast.fail('模块待开发,敬请期待')
      }
    }
  }
 }
 </script>
 <style lang="scss" scoped>
 .index {
  width: 100%;
  background-color: #edeff0;
 }
 .top{
  // width: 100%;
  height: 0.64rem;
  background: #276BFF;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0.2rem;
  p{
    font-size: 0.247rem;
    color: white;
  }
  .left{
    font-size: 0.135rem;
    font-family: PingFangSC-Semibold, PingFang SC;
    // font-weight: 600;
    line-height: 0.135rem;
    color: white;
    width: 30%;
  }
  .description{
    font-size: 0.1rem;
    opacity: 0.7;
    margin-top: 0.05rem;
  }
  .right{
    display: flex;
    color: white;
    align-items: center;
    justify-content: flex-end;
    text-align: right;
    width: 30%;
  }
 }
 .middle {
  width: 6.89rem;
  height: 2.6rem;
  margin: 0.09rem auto;
  background-color: white;
  .week {
    width: 100%;
    height: 0.37rem;
    li {
      float: left;
      height: 0.37rem;
      width: 1.362rem;
      background-color: white;
      margin-right: 0.016rem;
      h2 {
        height: 0.181rem;
        font-size: 0.158rem;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        text-align: center;
        margin-top: 0.11rem;
        color: rgba(19, 20, 21, 0.85);
        text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
      }
      div {
        margin-left: 0.1rem;
        margin-top: 0.03rem;
        span {
          font-size: 0.181rem;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #ff4d4f;
          line-height: 0.181rem;
          margin-top: 0.1rem;
          text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
        }
        span:first-child {
          color: black;
        }
      }
    }
    li:nth-child(2) {
      background: linear-gradient(
        to right,
        rgba(197, 199, 206, 0.89),
        white 10%
      );
    }
    li:nth-child(5) {
      background: linear-gradient(to right, white 90%, rgb(197, 199, 206) 95%);
    }
  }
  .day {
    width: 100%;
    height: 0.37rem;
    li {
      float: left;
      height: 0.37rem;
      width: 1.362rem;
      background-color: rgba(197, 199, 206, 0.55);
      margin-right: 0.016rem;
      h2 {
        height: 0.181rem;
        font-size: 0.158rem;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        text-align: center;
        margin-top: 0.11rem;
        color: rgba(19, 20, 21, 0.85);
        text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
      }
      div {
        margin-left: 0.1rem;
        margin-top: 0.03rem;
        span {
          font-size: 0.158rem;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #ff4d4f;
          line-height: 0.181rem;
          margin-top: 0.1rem;
          text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
        }
        span:first-child {
          color: black;
        }
      }
    }
  }
  .pass {
    width: 100%;
    height: 0.37rem;
    li {
      float: left;
      height: 0.37rem;
      width: 1.362rem;
      background-color: white;
      margin-right: 0.016rem;
      h2 {
        height: 0.181rem;
        font-size: 0.158rem;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        text-align: center;
        margin-top: 0.11rem;
        color: rgba(19, 20, 21, 0.85);
        text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
      }
      div {
        margin-left: 0.1rem;
        margin-top: 0.03rem;
        span {
          font-size: 0.158rem;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #ff4d4f;
          line-height: 0.181rem;
          margin-top: 0.1rem;
          text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
        }
        span:first-child {
          color: black;
        }
      }
    }
    li:nth-child(2) {
      background: linear-gradient(
        to right,
        rgba(197, 199, 206, 0.89),
        white 10%
      );
    }
    li:nth-child(5) {
      background: linear-gradient(to right, white 90%, rgb(197, 199, 206) 95%);
    }
  }
  .energy {
    width: 100%;
    height: 0.37rem;
    li {
      float: left;
      height: 0.37rem;
      width: 1.362rem;
      background-color: rgba(197, 199, 206, 0.55);
      margin-right: 0.016rem;
      h2 {
        height: 0.181rem;
        font-size: 0.158rem;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        text-align: center;
        margin-top: 0.11rem;
        color: rgba(19, 20, 21, 0.85);
        text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
      }
      div {
        margin-left: 0.1rem;
        margin-top: 0.03rem;
        span {
          font-size: 0.158rem;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #ff4d4f;
          line-height: 0.181rem;
          margin-top: 0.1rem;
          text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
        }
        span:first-child {
          color: black;
        }
      }
    }
  }
  .unit {
    width: 100%;
    height: 0.37rem;
    li {
      float: left;
      height: 0.37rem;
      width: 1.362rem;
      background-color: white;
      margin-right: 0.016rem;
      h2 {
        height: 0.181rem;
        font-size: 0.158rem;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        text-align: center;
        margin-top: 0.11rem;
        color: rgba(19, 20, 21, 0.85);
        text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
      }
      div {
        margin-left: 0.1rem;
        margin-top: 0.03rem;
        span {
          font-size: 0.158rem;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #ff4d4f;
          line-height: 0.181rem;
          margin-top: 0.1rem;
          text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
        }
        span:first-child {
          color: black;
        }
      }
    }
    li:nth-child(2) {
      background: linear-gradient(
        to right,
        rgba(197, 199, 206, 0.89),
        white 10%
      );
    }
    li:nth-child(5) {
      background: linear-gradient(to right, white 90%, rgb(197, 199, 206) 95%);
    }
  }
  .equipment {
    width: 100%;
    height: 0.37rem;
    li {
      float: left;
      height: 0.37rem;
      width: 1.362rem;
      background-color: rgba(197, 199, 206, 0.55);
      margin-right: 0.016rem;
      h2 {
        height: 0.181rem;
        font-size: 0.158rem;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        text-align: center;
        margin-top: 0.11rem;
        color: rgba(19, 20, 21, 0.85);
        text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
      }
      div {
        margin-left: 0.1rem;
        margin-top: 0.03rem;
        span {
          font-size: 0.158rem;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #ff4d4f;
          line-height: 0.181rem;
          margin-top: 0.1rem;
          text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
        }
        span:first-child {
          color: black;
        }
      }
    }
  }
  .monitor {
    width: 100%;
    height: 0.37rem;
    li {
      float: left;
      height: 0.37rem;
      width: 1.362rem;
      background-color: white;
      margin-right: 0.016rem;
      h2 {
        height: 0.181rem;
        font-size: 0.158rem;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        text-align: center;
        margin-top: 0.11rem;
        color: rgba(19, 20, 21, 0.85);
        text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
      }
      div {
        margin-left: 0.1rem;
        margin-top: 0.03rem;
        span {
          font-size: 0.158rem;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #ff4d4f;
          line-height: 0.181rem;
          margin-top: 0.1rem;
          text-shadow: 0.09rem 0rem 0.181rem rgba(197, 199, 206, 0.55);
        }
        span:first-child {
          color: black;
        }
      }
    }
    li:nth-child(2) {
      background: linear-gradient(
        to right,
        rgba(197, 199, 206, 0.89),
        white 10%
      );
    }
    li:nth-child(5) {
      background: linear-gradient(to right, white 90%, rgb(197, 199, 206) 95%);
    }
  }
 }
 </style>
--- a/src/pages/quality/quality.vue
+++ b/src/pages/quality/quality.vue
@ -0,0 +1,239 @@
 <template>
  <div>
    <div class="top">
      <div class="left">
        <van-row>
          <van-col>
            <img src="../../assets/img/logo.png" alt="">
            合肥新能源深加工数智工厂
          </van-col>
        </van-row>
        <van-row>
          <van-col class="description">
            © 中建材智能自动化研究院
          </van-col>
        </van-row>
      </div>
      <p>质量缺陷</p>
      <div class="right">
        <div>
          <p style="font-size: 0.1rem;">2022.12.24</p>
          <p style="font-size: 0.142rem;">23.12</p>
        </div>
        <div class="date">
          <p class="day">日</p>
          <p class="month">月</p>
        </div>
      </div>
    </div>
    <div class="content">
      <div id="bar" class="bar" style="border-bottom-right-radius: 20%"></div>
      <div id="pie" class="bar" style="border-bottom-left-radius: 20%"></div>
    </div>
  </div>
 </template>
 <script>
 import * as echarts from 'echarts'
 export default {
  data () {
    return {
      chart: null
    }
  },
  mounted () {
    this.initChart()
    this.pieChart()
  },
  methods: {
    beforeDestroy () {
      if (!this.chart) {
        return
      }
      this.chart.dispose()
      this.chart = null
    },
    initChart () {
      this.chart = echarts.init(document.getElementById('bar'))
      this.chart.setOption(
        {
          title: {
            text: '总量排名',
            textStyle: {
              color: '#276BFF'
            },
            top: '1%',
            left: '2%'
          },
          grid: {
            left: 50,
            bottom: 60
          },
          xAxis: {
            type: 'category',
            axisLabel: {
              interval: 0,
              rotate: 40
            },
            data: ['擦划伤', '脏污', '崩边', '气泡', '凹凸物']
          },
          yAxis: {
            type: 'value'
          },
          series: [{
            data: [518, 400, 289, 123, 24],
            type: 'bar',
            showBackground: true,
            barWidth: '35%',
            label: {
              show: true,
              position: 'top'
            },
            itemStyle: {
              normal: {
                color: function (params) {
                  var colorList = ['#2760FF', '#8167F6', '#5B9BFF', '#CCCCCC', '#FFD160', '#FF8A40']
                  return colorList[params.dataIndex]
                }
              }
            },
            backgroundStyle: {
              color: 'rgba(220, 220, 220, 0.4)'
            }
          }]
        }
      )
    },
    pieChart () {
      echarts.init(document.getElementById('pie')).setOption(
        {
          tooltip: {
            trigger: 'item'
          },
          title: {
            text: 'B产线',
            textStyle: {
              color: '#276BFF'
            },
            top: '1%',
            left: '2%'
          },
          legend: {
            orient: 'vertical',
            top: 'center',
            right: '5%'
          },
          color: ['#2760FF', '#8167F6', '#5B9BFF', '#CCCCCC', '#FFD160', '#FF8A40'],
          series: [
            {
              name: 'Access From',
              center: ['35%', '53%'],
              type: 'pie',
              radius: ['50%', '70%'],
              avoidLabelOverlap: false,
              label: {
                show: false,
                position: 'center'
              },
              emphasis: {
                label: {
                  show: true,
                  fontSize: '20',
                  fontWeight: 'bold'
                }
              },
              labelLine: {
                show: false
              },
              data: [
                { value: 123, name: '擦划伤' },
                { value: 122, name: '脏污' },
                { value: 67, name: '崩边' },
                { value: 42, name: '气泡' },
                { value: 12, name: '凹凸物' }
              ]
            }
          ]
        }
      )
    }
  }
 }
 </script>
 <style  lang="scss" scoped>
  .top{
    // width: 100%;
    height: 0.64rem;
    background: #276BFF;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0.2rem;
    p{
      font-size: 0.247rem;
      color: white;
    }
    .left{
      font-size: 0.135rem;
      font-family: PingFangSC-Semibold, PingFang SC;
      // font-weight: 600;
      line-height: 0.135rem;
      color: white;
    }
    .description{
      font-size: 0.1rem;
      opacity: 0.7;
      margin-top: 0.05rem;
    }
    .right{
      display: flex;
      color: white;
      align-items: center;
      text-align: right;
      .date{
        margin-left: 0.08rem;
        display: flex;
        text-align: center;
        align-items: center;
        line-height: 0.36rem;
        .day{
          height: 0.36rem;
          width: 0.64rem;
          background-color: #4E9AFF;
          border-radius: 5px;
        }
        .month{
          height: 0.36rem;
          width: 0.64rem;
          background-color: #276BFF;
          border: #88ADFF 1px solid;
          border-radius: 5px;
          margin-left: -0.05rem;
        }
      }
    }
  }
  .content{
    display: flex;
    justify-content: space-around;
    margin-top: 0.1rem;
    font-size: 0.135rem;
    .bar{
      width: 3.4rem;
      height: 2.66rem;
      background-color: white;
      border-radius: 5%;
      text-align: center;
    }
  }
 </style>
--- a/src/pages/threeDimensional/threeDimensional.vue
+++ b/src/pages/threeDimensional/threeDimensional.vue
@ -0,0 +1,186 @@
 <template>
  <div class="index">
    <div class="top">
      <div class="left">
        <img src="../../assets/img/left1.png" alt="">
      </div>
      <div class="topMiddle">
        <div class="base">
          <img src="../../assets/img/logo.png" alt="">
          <span>中建材(合肥)新能源有限公司</span>
        </div>
        <div class="factory">光伏玻璃深加工数智化工厂</div>
      </div>
      <div class="right">
        <img class="rightLogo" src="../../assets/img/right1.png" alt="">
        <img class="user" src="../../assets/img/user.png" alt="">
      </div>
    </div>
    <div class="middle">
      <img src="../../assets/img/model.png" alt="">
    </div>
  </div>
 </template>
 <script>
 import { Toast } from 'vant'
 const arrList = [
  [
    {
      text: '设备巡检',
      icon: 'logistics',
      router: '/eqInspection',
      color: '#1989fa'
    },
    {
      text: '物料耗材',
      icon: 'points',
      router: '/material',
      color: '#1989fa'
    }
  ],
  [
    {
      text: '待开发',
      icon: 'qr-invalid',
      color: ''
    },
    {
      text: '待开发',
      icon: 'qr-invalid',
      color: ''
    }
  ],
  [
    {
      text: '待开发',
      icon: 'qr-invalid',
      color: ''
    },
    {
      text: '待开发',
      icon: 'qr-invalid',
      color: ''
    }
  ],
  [
    {
      text: '我的',
      icon: 'manager-o',
      color: ''
    },
    {
      text: '退出',
      icon: 'ellipsis',
      router: '/',
      color: ''
    }
  ]
 ]
 export default {
  name: 'login',
  data () {
    return {
      Height: null
    }
  },
  mounted () {
    this.Height = window.innerHeight
  },
  computed: {
    arrList () {
      return arrList
    }
  },
  methods: {
    toRouter (router, v) {
      if (router) {
        if (v.text === '退出') {
          this.$store.commit('user/updateUserInfo', null)
          window.sessionStorage.removeItem('userInfo')
        }
        this.$router.push(router)
      } else {
        Toast.fail('模块待开发,敬请期待')
      }
    }
  }
 }
 </script>
 <style lang="scss" scoped>
 .index {
  width: 100%;
  background-color: black;
 }
 .top {
  width: 100%;
  height: 1.1rem;
  overflow: hidden;
  display: flex;
  .left{
    float: left;
    img{
      width: 1.96rem;
      margin-top: 0.329rem;
      margin-left: 0.238rem;
    }
  }
  .topMiddle{
    color: white;
    margin-top: 0.181rem;
    width: 2.68rem;
    float: left;
    height: 0.378rem;
    .base{
        margin-left: 0.181rem;
      img{
        width: 0.169rem;
      }
      span{
        width: 1.862rem;
        height: 0.135rem;
        font-size: 0.15rem;
        text-align: center;
        font-family: PingFangSC-Semibold, PingFang SC;
        font-weight: 600;
        color: #FFFFFF;
        line-height: 0.158rem;
      }
    }
    .factory{
      width: 2.68rem;
      text-align: center;
      height: 0.181rem;
      font-size: 0.181rem;
      font-family: PingFangSC-Semibold, PingFang SC;
      font-weight: 600;
      color: #FFFFFF;
      letter-spacing: 0.01rem;
    }
  }
        .right {
          float:left;
          .rightLogo {
            width: 1.5rem;
            margin-top: 0.329rem;
          }
          .user{
            margin: 0.18rem auto auto 0.4rem;
            width: 0.363rem;
            height: 0.363rem;
          }
        }
 }
 .middle {
  width: 100%;
  height: 2.58rem;
  background: url("../../assets/img/background.png") no-repeat;
  background-size: 100% 100%;
  overflow: hidden;
  img{
    width: 100%;
    margin-top: 0.61rem;
  }
 }
 </style>
--- a/src/router/index.js
+++ b/src/router/index.js
@ -0,0 +1,71 @@
 /*
 * @Author: gtz
 * @Date: 2022-07-25 14:18:00
 * @LastEditors: gtz
 * @LastEditTime: 2022-08-03 13:48:48
 * @Description: file content
 * @FilePath: \hf-pda\src\router\index.js
 */
 import Vue from 'vue'
 import Router from 'vue-router'
 import index from '@/pages/index/index'
 import quality from '@/pages/quality/quality'
 import homePage from '@/pages/threeDimensional/threeDimensional'
 import overview from '@/pages/overview/overview'
 Vue.use(Router)
 const router = new Router({
  routes: [
    {
      path: '/',
      name: 'index',
      redirect: '/home',
      component: index,
      children: [
        {
          path: 'quality',
          name: 'quality',
          component: quality
        },
        {
          path: 'home',
          name: 'home',
          component: homePage
        },
        {
          path: 'overview',
          name: 'overview',
          component: overview
        }
      ]
    }
  ]
 })
 Router.prototype.goBack = function () {
  this.isBack = true
  window.history.go(-1)
 }
 // const valid = () => {
 //   return sessionStorage.getItem('userInfo')
 // }
 // router.beforeResolve((to, from, next) => {
 //   if (to.matched.some(record => record.meta.requireAuth)) {
 //     // this route requires auth, check if logged in
 //     // if not, redirect to login page.
 //     if (valid()) {
 //       next()
 //     } else {
 //       next({
 //         path: '/'
 //       })
 //     }
 //   } else {
 //     next() // 确保一定要调用 next()
 //   }
 // })
 export default router
--- a/src/store/index.js
+++ b/src/store/index.js
@ -0,0 +1,21 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 import cloneDeep from 'lodash/cloneDeep'
 import user from './modules/user'
 Vue.use(Vuex)
 export default new Vuex.Store({
  modules: {
    user
  },
  mutations: {
    // 重置vuex本地储存状态
    resetStore (state) {
      Object.keys(state).forEach((key) => {
        state[key] = cloneDeep(window.SITE_CONFIG['storeState'][key])
      })
    }
  },
  strict: process.env.NODE_ENV !== 'production'
 })
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@ -0,0 +1,11 @@
 export default {
  namespaced: true,
  state: {
    userInfo: null
  },
  mutations: {
    updateUserInfo (state, userInfo) {
      state.userInfo = userInfo
    }
  }
 }
--- a/src/util/request.js
+++ b/src/util/request.js
@ -0,0 +1,94 @@
 /*
 * @Author: gtz
 * @Date: 2022-07-25 14:18:00
 * @LastEditors: gtz
 * @LastEditTime: 2022-08-08 10:31:58
 * @Description: file content
 * @FilePath: \hf-pda\src\util\request.js
 */
 import axios from 'axios'
 import { Toast, Notify } from 'vant'
 import qs from 'qs'
 // import store from '@/vuex'
 const service = axios.create({
  // baseURL: process.env.VUE_APP_BASE_API, // api的base_url
  timeout: 5000 // request timeout
 })
 let toast = null
 // 提交表单的
 // token加入header
 service.interceptors.request.use((config) => {
  // console.log(store.state)
  if (config.responseType || config.file) {
    config.timeout = 15000
    toast = Toast.loading({
      mask: true,
      message: '加载中...',
      duration: 15000
    })
  } else {
    toast = Toast.loading({
      mask: true,
      message: '加载中...',
      duration: 5000
    })
  }
  // if (config.url !== '/wms/login/verify' && JSON.parse(sessionStorage.getItem('userInfo')).token) {
  //   config.headers['token'] = JSON.parse(sessionStorage.getItem('userInfo')).token
  // }
  // 输出到安卓版本的时候开启下面的配置项
  // config.url = 'http://hfxny.mes.picaiba.com' + config.url
  // ***************
  if (config.formState) {
    config.data = qs.stringify(config.data)
    config.headers['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8'
  } else if (config.file) {
    config.headers['Content-Type'] = 'multipart/form-data;charset=UTF-8'
  }
  return config
 }, error => {
  Promise.reject(error)
 })
 // axios全局拦截配置
 service.interceptors.response.use(
  response => {
    // doing sth
    // console.log('request!')
    // setTimeout(() => {
    if (toast) {
      toast.clear()
    }
    toast = null
    // }, 500)
    // console.log(response)
    if (response.data.code === 0) {
      return {
        success: true,
        data: response.data.data,
        pagetotal: response.data.pagetotal
      }
    } else if (response.config.responseType === 'blob') {
      return {
        success: true,
        data: response
      }
    } else {
      Notify(response.data.msg)
      return {
        success: false,
        data: response.data,
        msg: response.data.msg
      }
    }
    // return response
  },
  error => {
    toast.clear()
    toast = null
    Toast.fail('网络超时')
    return Promise.reject(error) // 返回接口返回的错误信息
    // return Promise.reject(error.response.data) // 返回接口返回的错误信息
  })
 export default service
--- a/src/util/utils.js
+++ b/src/util/utils.js
@ -0,0 +1,16 @@
 /*
 * @Author: gtz
 * @Date: 2022-08-02 15:00:02
 * @LastEditors: gtz
 * @LastEditTime: 2022-08-02 15:03:00
 * @Description: file content
 * @FilePath: \hf-pda\src\util\utils.js
 */
 export const blobToBase64 = (blob, callback) => {
  var reader = new FileReader()
  reader.onload = function (e) {
    callback(e.target.result)
  }
  reader.readAsDataURL(blob)
 }
--- a/static/.gitkeep
+++ b/static/.gitkeep
		`@ -0,0 +1 @@`
							!function(e){var t,n,o,i,a,c='<svg><symbol id="iconfont-jiantou" viewBox="0 0 7509 1024"><path d="M7509.333333 0l-341.333333 324.266667-426.666667 426.666666a144.810667 144.810667 0 0 1-204.8-204.8l221.866667-221.866666H2218.666667V0h5290.666666zM1877.333333 0v341.333333h-512V0h512z m-682.666666 0v341.333333H682.666667V0h512zM341.333333 0v341.333333H0V0h341.333333z" fill="#4271FF" ></path></symbol><symbol id="iconfont-rili" viewBox="0 0 1024 1024"><path d="M259.424 287.488a28.096 28.096 0 0 0-28.064 28.064v449.024c0 15.488 12.608 28.064 28.064 28.064h505.152a28.064 28.064 0 0 0 28.064-28.064V315.52a28.096 28.096 0 0 0-28.064-28.064H259.424z m505.152 561.28H259.424c-46.4 0-84.16-37.76-84.16-84.192V315.52c0-46.4 37.76-84.16 84.16-84.16h505.152c46.4 0 84.16 37.76 84.16 84.16v449.024c0 46.4-37.76 84.16-84.16 84.16zM373.44 343.616h-3.52a26.368 26.368 0 0 1-26.272-26.272V201.568c0-14.464 11.808-26.336 26.272-26.336h3.52c14.496 0 26.304 11.84 26.304 26.336v115.776a26.368 26.368 0 0 1-26.304 26.272m280.64 0h-3.52a26.368 26.368 0 0 1-26.304-26.272V201.568c0-14.464 11.84-26.336 26.304-26.336h3.52c14.464 0 26.272 11.84 26.272 26.336v115.776a26.368 26.368 0 0 1-26.272 26.272m-282.4 308.704H315.552a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064m168.384 0h-56.128a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064M371.68 512H315.552a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064m336.768 0h-56.128a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064m-168.384 0h-56.128a28.16 28.16 0 0 1-28.064-28.064 28.16 28.16 0 0 1 28.064-28.064h56.128a28.16 28.16 0 0 1 28.064 28.064 28.16 28.16 0 0 1-28.064 28.064" fill="#0B58FF" ></path></symbol></svg>',d=(d=document.getElementsByTagName("script"))[d.length-1].getAttribute("data-injectcss"),l=function(e,t){t.parentNode.insertBefore(e,t)};if(d&&!e.__iconfont__svg__cssinject__){e.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(e){console&&console.log(e)}}function s(){a\|\|(a=!0,o())}function h(){try{i.documentElement.doScroll("left")}catch(e){return void setTimeout(h,50)}s()}t=function(){var e,t=document.createElement("div");t.innerHTML=c,c=null,(t=t.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",t=t,(e=document.body).firstChild?l(t,e.firstChild):e.appendChild(t))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(t,0):(n=function(){document.removeEventListener("DOMContentLoaded",n,!1),t()},document.addEventListener("DOMContentLoaded",n,!1)):document.attachEvent&&(o=t,i=e.document,a=!1,h(),i.onreadystatechange=function(){"complete"==i.readyState&&(i.onreadystatechange=null,s())})}(window);