a

code/finance_web/.babelrc

+{
+  "presets": [
+    ["env", {
+      "modules": false,
+      "targets": {
+        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
+      }
+    }],
+    "stage-2"
+  ],
+  "plugins": ["transform-vue-jsx", "transform-runtime"]
+}

code/finance_web/.editorconfig

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

code/finance_web/.gitignore

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

code/finance_web/.postcssrc.js

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

code/finance_web/README.md

+# finance_serv
+
+> 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).

code/finance_web/build/build.js

+'use strict'
+require('./check-versions')()
+
+process.env.NODE_ENV = 'production'
+
+const ora = require('ora')
+const rm = require('rimraf')
+const path = require('path')
+const chalk = require('chalk')
+const webpack = require('webpack')
+const config = require('../config')
+const webpackConfig = require('./webpack.prod.conf')
+
+const spinner = ora('building for production...')
+spinner.start()
+
+rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
+  if (err) throw err
+  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'
+    ))
+  })
+})

code/finance_web/build/check-versions.js

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

code/finance_web/build/utils.js

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

code/finance_web/build/vue-loader.conf.js

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

code/finance_web/build/webpack.base.conf.js

+'use strict'
+const path = require('path')
+const utils = require('./utils')
+const config = require('../config')
+const vueLoaderConfig = require('./vue-loader.conf')
+
+function resolve (dir) {
+  return path.join(__dirname, '..', dir)
+}
+
+
+
+module.exports = {
+  context: path.resolve(__dirname, '../'),
+  entry: {
+    app: './src/main.js'
+  },
+  output: {
+    path: config.build.assetsRoot,
+    filename: '[name].js',
+    publicPath: process.env.NODE_ENV === 'production'
+      ? config.build.assetsPublicPath
+      : config.dev.assetsPublicPath
+  },
+  resolve: {
+    extensions: ['.js', '.vue', '.json'],
+    alias: {
+      'vue$': 'vue/dist/vue.esm.js',
+      '@': resolve('src'),
+    }
+  },
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: vueLoaderConfig
+      },
+      {
+        test: /\.js$/,
+        loader: 'babel-loader',
+        include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
+      },
+      {
+        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('img/[name].[hash:7].[ext]')
+        }
+      },
+      {
+        test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('media/[name].[hash:7].[ext]')
+        }
+      },
+      {
+        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
+        }
+      },
+      {
+        test: /\\\\\\\\.css$/,
+        loader: "style!css"
+    },
+    {
+        test: /\\\\\\\\.(eot|woff|woff2|ttf)([\\\\\\\\?]?.*)$/,
+        loader: "file"
+    }  
+    ]
+  },
+  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'
+  }
+}

code/finance_web/build/webpack.dev.conf.js

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

code/finance_web/build/webpack.prod.conf.js

+'use strict'
+const path = require('path')
+const utils = require('./utils')
+const webpack = require('webpack')
+const config = require('../config')
+const merge = require('webpack-merge')
+const baseWebpackConfig = require('./webpack.base.conf')
+const CopyWebpackPlugin = require('copy-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
+const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
+
+const env = 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

code/finance_web/config/dev.env.js

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

code/finance_web/config/index.js

+'use strict'
+// Template version: 1.3.1
+// see http://vuejs-templates.github.io/webpack for documentation.
+
+const path = require('path')
+
+module.exports = {
+  dev: {
+
+    // Paths
+    assetsSubDirectory: 'static',
+    assetsPublicPath: '/',
+    proxyTable: {},
+
+    // Various Dev Server settings
+    host: 'localhost', // can be overwritten by process.env.HOST
+    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-
+
+    
+    /**
+     * 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
+  }
+}

code/finance_web/config/prod.env.js

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

code/finance_web/index.html

-<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>finance_serv</title><link href=/static/css/app.224d00077d0021fd215ca564d0fe2286.css rel=stylesheet></head><body style="height: 100%"><div id=app></div><script type=text/javascript src=/static/js/manifest.2ae2e69a05c33dfc65f8.js></script><script type=text/javascript src=/static/js/vendor.63cdc4627ea566ad7c80.js></script><script type=text/javascript src=/static/js/app.481161cf906b23242e19.js></script></body></html>
\ No newline at end of file
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <title>finance_serv</title>
+  </head>
+  <body style="height: 100%">
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

code/finance_web/package.json

+{
+  "name": "finance_serv",
+  "version": "1.0.0",
+  "description": "A Vue.js project",
+  "author": "xmh",
+  "private": true,
+  "scripts": {
+    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
+    "start": "npm run dev",
+    "build": "node build/build.js"
+  },
+  "dependencies": {
+    "axios": "^0.18.0",
+    "element-ui": "^2.4.4",
+    "style-loader": "^0.21.0",
+    "vue": "^2.5.2",
+    "vue-router": "^3.0.1"
+  },
+  "devDependencies": {
+    "autoprefixer": "^7.1.2",
+    "babel-core": "^6.22.1",
+    "babel-helper-vue-jsx-merge-props": "^2.0.3",
+    "babel-loader": "^7.1.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.11",
+    "extract-text-webpack-plugin": "^3.0.0",
+    "file-loader": "^1.1.11",
+    "friendly-errors-webpack-plugin": "^1.6.1",
+    "html-webpack-plugin": "^2.30.1",
+    "mockjs": "^1.0.1-beta3",
+    "node-notifier": "^5.1.2",
+    "optimize-css-assets-webpack-plugin": "^3.2.0",
+    "ora": "^1.2.0",
+    "portfinder": "^1.0.13",
+    "postcss-import": "^11.0.0",
+    "postcss-loader": "^2.0.8",
+    "postcss-url": "^7.2.1",
+    "rimraf": "^2.6.0",
+    "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"
+  ]
+}

code/finance_web/src/App.vue

+<template>
+  <div id="app">
+    <router-view></router-view>
+  </div> 
+</template>
+
+<script>
+
+export default {
+  name: "App",
+  methods: {
+   
+  },
+  data() {
+    return {};
+  }
+};
+</script>
+  .el-container{
+
+  }
+<style>
+html,body,#app{
+  height:95%
+}
+</style>

code/finance_web/src/components/contract.vue

+<template>
+  <div>
+    <!-- 合同基本信息开始~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+
+    <el-row>
+      <el-col :span="22">
+        <h1 @click="contract_show =!contract_show">销售合同信息</h1>
+      </el-col>
+      <el-col :span="2">
+        <h1 class="h-button" @click="form_submit('form')">提交</h1>
+      </el-col>
+    </el-row>
+    <transition name="el-fade-in-linear">
+      <el-form id="form" :inline="true" :model="form" class="demo-form-inline" label-width="100px" :rules="add_rules" v-show="contract_show">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="合同编号">
+              <el-select class="width-220" v-model="form.contract_unid" filterable remote reserve-keyword placeholder="合同编号" :remote-method="contractIdRemoteMethod">
+                <el-option v-for="(item,index) in contract_unid_selected_data" :key="index" :label="item.name" :value="item.country_unid">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="销售员">
+              <el-select class="width-220" v-model="form.salesperson_unid" filterable remote placeholder="销售人员" :remote-method="salespersonIdRemoteMethod">
+                <el-option v-for="(item,index) in salesperson_unid_selected_data" :key="index" :label="item.name" :value="item.code_unid">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="项目名称">
+              <el-select class="width-220" v-model="form.project_unid" filterable remote placeholder="项目名称" :remote-method="projectIdRemoteMethod">
+                <el-option v-for="(item,index) in project_unid_selected_data" :key="index" :label="item.name" :value="index">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="客户名称">
+              <el-select class="width-220" v-model="form.customer_unid" filterable remote placeholder="客户名称" :remote-method="customerIdRemoteMethod">
+                <el-option v-for="(item,index) in customer_unid_selected_data" :key="index" :label="item.name" :value="index">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="项目所在地">
+              <el-select style="width:100px" v-model="form.province" placeholder="省" @change="get_cities()">
+                <el-option v-for="(item,index) in provinces" :key="index" :label="item.name" :value="item.province_unid">
+                </el-option>
+              </el-select>
+              <el-select style="width:100px" v-model="form.city" placeholder="市" @change="get_counties()">
+                <el-option v-for="(item,index) in cities" :key="index" :label="item.name" :value="item.city_unid">
+                </el-option>
+              </el-select>
+              <el-select style="width:100px" v-model="form.county" placeholder="区县">
+                <el-option v-for="(item,index) in counties" :key="index" :label="item.name" :value="item.county_unid">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="质保周期(月)">
+              <el-input-number class="width-220" v-model="form.guarantee_period" :step="6" :min="6" :max="60" size="medium"></el-input-number>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="签订日期">
+              <el-date-picker class="width-220" v-model="form.sign_date" type="date" placeholder="日期" value-format="yyyy-MM-dd" @change="signDataChanged">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="所属年份">
+              <el-input class="width-220" v-model="form.year" :disabled="true"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="所属月份">
+              <el-input class="width-220" v-model="form.month" :disabled="true"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="产品线类型">
+              <el-select class="width-220" v-model="form.product_line_type" placeholder="产品线类型">
+                <el-option v-for="(value,index) in projectline_type_data" :key="index" :label="value" :value="index">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="合同状态">
+              <el-select class="width-220" v-model="form.contract_state" placeholder="合同状态">
+                <el-option v-for="(value,index) in contract_state_data" :key="index" :label="value" :value="index">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="合同性质">
+              <el-select class="width-220" v-model="form.contract_type" placeholder="合同性质">
+                <el-option v-for="(value,index) in contract_type_data" :key="index" :label="value" :value="index">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="合同金额" prop="contract_amount">
+              <el-input class="width-220" v-model="form.contract_amount"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="抵扣金额" prop="deduct_amount">
+              <el-input class="width-220" v-model="form.deduct_amount"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="备注">
+              <el-input class="width-220" v-model="form.contract_amount_note"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="累计回款额">
+              <el-input class="width-220" v-model="total_reback_amount" :disabled="true"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="暂停金额" prop="stop_amount">
+              <el-input class="width-220" v-model="form.stop_amount"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="备注">
+              <el-input class="width-220" v-model="form.reback_note"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="合同余额">
+              <el-input class="width-220" v-model="contract_remaining" :disabled="true"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="豁免金额" prop="exemptions_amount">
+              <el-input class="width-220" v-model="form.exemptions_amount"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="备注">
+              <el-input class="width-220" v-model="form.contract_remain_note"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="合同是否归档">
+              <el-select class="width-220" v-model="form.is_archive" placeholder="请选择">
+                <el-option label="是" value=true></el-option>
+                <el-option label="否" value=false></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="坏账金额" prop="bad_amount">
+              <el-input class="width-220" v-model="form.bad_amount"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="备注">
+              <el-input class="width-220" v-model="form.bad_amount_note"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="累计应收款">
+              <el-input class="width-220" v-model="total_receive_amount" :disabled="true"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="应收账款余额">
+              <el-input class="width-220" v-model="total_leave_amount" :disabled="true"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="逾期天数">
+              <el-input class="width-220" v-model="over_days_unid" :disabled="true"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="确认收入金额" prop="confirm_income_amount">
+              <el-input class="width-220" v-model="form.confirm_income_amount"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="账款状态">
+              <el-select class="width-220" v-model="form.amount_state_unid" placeholder="账款状态">
+                <el-option v-for="(value,index) in amount_state_unid_data" :key="index" :label="value" :value="index">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="9">
+            <el-form-item label="维保服务期">
+              <el-date-picker v-model="guarantee_date" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" :unlink-panels="true">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="19">
+            <el-form-item label="质保期">
+              <el-select class="width-220" v-model="form.mainten_start_point" placeholder="开始节点">
+                <el-option v-for="(value,index) in mainten_start_point_data" :key="index" :label="value" :value="index">
+                </el-option>
+              </el-select>
+              <el-date-picker class="width-220" v-model="this.mainten_start_date" type="date" placeholder="开始日期" value-format="yyyy-MM-dd" :readonly="true">
+              </el-date-picker>
+              <el-date-picker class="width-220" v-model="this.mainten_end_date" type="date" placeholder="结束日期" value-format="yyyy-MM-dd" :readonly="true">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="备注">
+              <el-input v-model="form.contract_note" type="textarea" :rows="8" style="width:500px"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-upload class="upload-demo" drag :action="upload_url" multiple :file-list="contract_appendix_list" :before-upload="test">
+              <i class="el-icon-upload"></i>
+              <div class="el-upload__text">将文件拖到此处，或点击上传</div>
+            </el-upload>
+          </el-col>
+        </el-row>
+      </el-form>
+    </transition>
+
+    <!-- 基本信息结束~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+    <!-- 付款约定开始~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+
+    <el-row>
+      <el-col :span="22">
+        <h1 @click="payments_show = !payments_show">付款约定</h1>
+      </el-col>
+      <el-col :span="2">
+        <h1 class="h-button" @click="form_submit('payment')">提交</h1>
+      </el-col>
+    </el-row>
+    <transition name="el-fade-in-linear">
+      <div id="payments_data_table" v-show="payments_show">
+        <el-table :data="payments_data" style="width: 100%">
+          <el-table-column prop="payment_progress" label="付款进度" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="payment_type" label="付款类型" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="days" label="天数" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="payment_propority" label="付款比例(%)" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="pay_date" label="本期应付款日期" min-width="200" align="center">
+          </el-table-column>
+          <el-table-column prop="amount" label="本期应付款金额" min-width="200" align="center">
+          </el-table-column>
+          <el-table-column prop="payment_requirement" label="本期付款条件" min-width="300" align="center">
+          </el-table-column>
+          <el-table-column label="操作" min-width="200" align="center" fixed="right">
+            <template slot-scope="scope">
+              <el-button @click.native.prevent="payment_data_modify(scope.$index, payments_data)" type="primary" round>
+                修改
+              </el-button>
+              <el-button @click.native.prevent="data_delete(scope.$index, payments_data)" type="danger" round>
+                移除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-row>
+          <el-button class="add_button" type="text" @click="payments_dialog_show = true">添加付款约定</el-button>
+        </el-row>
+      </div>
+    </transition>
+
+    <!-- 付款约定弹出框 -->
+
+    <el-dialog id="payments_dialog" title="付款约定" :visible.sync="payments_dialog_show" width="30%">
+      <el-form :model="payments_form" label-width="150px" label-position="left" :rules="add_rules" ref="payments_form">
+        <el-form-item label="付款类型" prop="payment_type">
+          <el-select v-model="payments_form.payment_type" placeholder="付款类型" style="width:100%">
+            <el-option label="预付款" value="1">
+            </el-option>
+            <el-option label="到货款" value="2">
+            </el-option>
+            <el-option label="系统验收款" value="3">
+            </el-option>
+            <el-option label="质保款(发货节点计算)" value="4">
+            </el-option>
+            </el-option>
+            <el-option label="质保款(验收节点计算)" value="5">
+            </el-option>
+          </el-select>
+          </el-col>
+        </el-form-item>
+        <el-form-item label="天数" prop="days">
+          <el-input v-model="payments_form.days" placeholder="请输入天数" style="width:100%"></el-input>
+        </el-form-item>
+        <el-form-item label="付款比例" prop="payment_propority">
+          <el-input-number v-model="payments_form.payment_propority" :step="5" :min="0" :max="100" style="width:100%"></el-input-number>
+        </el-form-item>
+        <el-form-item label="条件" prop="payment_requirement">
+          <el-input v-model="payments_form.payment_requirement" type="textarea" :rows="2" style="width:100%"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="payments_dialog_cancel()">取 消</el-button>
+        <el-button type="primary" @click="payments_dialog_confirm()">确 定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 付款约定结束~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+    <!-- 合同回款信息开始~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+
+    <el-row>
+      <el-col :span="22">
+        <h1 @click="rebacks_show = !rebacks_show">合同回款信息(财务部)</h1>
+      </el-col>
+      <el-col :span="2">
+        <h1 class="h-button" @click="form_submit('reback')">提交</h1>
+      </el-col>
+    </el-row>
+
+    <transition name="el-fade-in-linear">
+      <div id="rebacks_data_table" v-show="rebacks_show">
+        <el-table :data="rebacks_data" style="width:100%">
+          <el-table-column prop="reback_progress" label="回款进度" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="actual_reback_amount" label="实际回款金额" min-width="200" align="center">
+          </el-table-column>
+          <el-table-column prop="reback_propority" label="回款比例(%)" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="reback_date" label="回款日期" min-width="200" align="center">
+          </el-table-column>
+          <el-table-column prop="reback_note" label="回款备注" min-width="300" align="center">
+          </el-table-column>
+          <el-table-column label="操作" min-width="200" align="center" fixed="right">
+            <template slot-scope="scope">
+              <el-button @click.native.prevent="reback_data_modify(scope.$index, rebacks_data)" type="primary" round>
+                修改
+              </el-button>
+              <el-button @click.native.prevent="data_delete(scope.$index, rebacks_data)" type="danger" round>
+                移除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-row>
+          <el-button class="add_button" type="text" @click="rebacks_dialog_show = true">添加合同回款信息</el-button>
+        </el-row>
+      </div>
+    </transition>
+    <!-- 合同回款信息弹出框 -->
+
+    <el-dialog id="rebacks_dialog" title="回款信息" :visible.sync="rebacks_dialog_show" width="30%">
+      <el-form :model="rebacks_form" label-width="150px" label-position="left" :rules="rebacks_form_rules" ref="rebacks_form">
+        <el-form-item label="实际回款金额" prop="actual_reback_amount">
+          <el-input v-model="rebacks_form.actual_reback_amount" placeholder="请输入金额" style="width:100%"></el-input>
+        </el-form-item>
+        <el-form-item label="回款日期" prop="reback_date">
+          <el-date-picker style="width:100%" v-model="rebacks_form.reback_date" type="date" value-format="yyyy-MM-dd">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="备注" prop="reback_note">
+          <el-input v-model="rebacks_form.reback_note" placeholder="备注" style="width:100%" type="textarea" :rows="2"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="rebacks_dialog_cancel()">取 消</el-button>
+        <el-button type="primary" @click="rebacks_dialog_confirm()">确 定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 合同回款信息结束~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+    <!-- 合同开票信息开始~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+
+    <el-row>
+      <el-col :span="22">
+        <h1 @click="receipts_show = !receipts_show">合同开票信息(财务部)</h1>
+      </el-col>
+      <el-col :span="2">
+        <h1 class="h-button" @click="form_submit('receipt')">提交</h1>
+      </el-col>
+    </el-row>
+
+    <transition name="el-fade-in-linear">
+      <div id="receipts_data_table" v-show="receipts_show">
+        <el-table :data="receipts_data" style="width: 100%">
+          <el-table-column prop="receipt_progress" label="开票进度" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="receipt_amount" label="开票金额" min-width="150" align="center">
+          </el-table-column>
+          <el-table-column prop="oa_flow_id" label="OA流水号" min-width="150" align="center">
+          </el-table-column>
+          <el-table-column prop="receipt_propority" label="开票比例(%)" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="total_receipt_amount" label="累计开票金额" min-width="200" align="center">
+          </el-table-column>
+          <el-table-column prop="is_reback" label="是否回款" min-width="100" align="center">
+          </el-table-column>
+          <el-table-column prop="receipt_note" label="备注" min-width="300" align="center">
+          </el-table-column>
+          <el-table-column label="操作" min-width="200" align="center" fixed="right">
+            <template slot-scope="scope">
+              <el-button @click.native.prevent="receipt_data_modify(scope.$index, receipts_data)" type="primary" round>
+                修改
+              </el-button>
+              <el-button @click.native.prevent="data_delete(scope.$index, receipts_data)" type="danger" round>
+                移除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-row>
+          <el-button class="add_button" type="text" @click="receipts_dialog_show = true">添加开票信息</el-button>
+        </el-row>
+      </div>
+    </transition>
+    <!-- 开票信息弹出框 -->
+
+    <el-dialog id="receipts_dialog" title="开票合同" :visible.sync="receipts_dialog_show" width="30%">
+      <el-form :model="receipts_form" label-width="150px" label-position="left" :rules="receipts_form_rules" ref="receipts_form">
+        <el-form-item label="开票金额" prop="receipt_amount">
+          <el-input v-model="receipts_form.receipt_amount" placeholder="请输入金额" style="width:100%"></el-input>
+        </el-form-item>
+        <el-form-item label="OA流水号" prop="oa_flow_id">
+          <el-input v-model="receipts_form.oa_flow_id" placeholder="请输入流水号" style="width:100%"></el-input>
+        </el-form-item>
+        <el-form-item label="备注" prop="receipt_note">
+          <el-input v-model="receipts_form.receipt_note" placeholder="备注" style="width:100%" type="textarea" :rows="2"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="receipts_dialog_cancel()">取 消</el-button>
+        <el-button type="primary" @click="receipts_dialog_confirm()">确 定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 合同开票信息结束~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+    <!-- 发货信息开始~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+
+    <el-row>
+      <el-col :span="22">
+        <h1 @click="delivers_show = !delivers_show">发货信息(生产部)</h1>
+      </el-col>
+      <el-col :span="2">
+        <h1 class="h-button" @click="form_submit('deliver')">提交</h1>
+      </el-col>
+    </el-row>
+
+    <transition name="el-fade-in-linear">
+      <div id="delivers_data_table" v-show="delivers_show">
+        <el-table :data="delivers_data" style="width: 100%">
+          <el-table-column prop="deliver_goods_date" label="发货日期" width="300" align="center">
+          </el-table-column>
+          <el-table-column prop="goods_acceptanc_date" label="到货验收日期" width="300" align="center">
+          </el-table-column>
+          <el-table-column label="操作" min-width="100" align="center" fixed="right">
+            <template slot-scope="scope">
+              <el-button @click.native.prevent="deliver_data_modify(scope.$index, delivers_data)" type="primary" round>
+                修改
+              </el-button>
+              <el-button @click.native.prevent="data_delete(scope.$index, delivers_data)" type="danger" round>
+                移除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-row>
+          <el-button class="add_button" type="text" @click="delivers_dialog_show = true">添加发货信息</el-button>
+        </el-row>
+      </div>
+    </transition>
+    <!-- 发货信息信息弹出框 -->
+
+    <el-dialog id="delivers_dialog" title="发货信息" :visible.sync="delivers_dialog_show" width="30%">
+      <el-form :model="delivers_form" label-width="150px" label-position="left" :rules="add_rules" ref="delivers_form">
+        <el-form-item label="发货日期" prop="deliver_goods_date">
+          <el-date-picker style="width:100%" v-model="delivers_form.deliver_goods_date" type="date" value-format="yyyy-MM-dd">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="到货验收日期" prop="goods_acceptanc_date">
+          <el-date-picker style="width:100%" v-model="delivers_form.goods_acceptanc_date" type="date" value-format="yyyy-MM-dd">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          此处需要上传附件
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="delivers_dialog_cancel()">取 消</el-button>
+        <el-button type="primary" @click="delivers_dialog_confirm()">确 定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 发货信息结束~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+    <!-- 工程验收信息开始~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+
+    <el-row>
+      <el-col :span="22">
+        <h1 @click="acceptance_show = !acceptance_show">工程验收信息(工程部)</h1>
+      </el-col>
+      <el-col :span="2">
+        <h1 class="h-button" @click="form_submit('project')">提交</h1>
+      </el-col>
+    </el-row>
+
+    <transition name="el-fade-in-linear">
+      <div id="acceptance_form" v-show="acceptance_show">
+        <el-form :inline="true" :model="first_acceptances_form" class="demo-form-inline" label-width="100px" :rules="acceptance_form_rules" ref="first_acceptances_form">
+          <el-row>
+            <el-col :span="8">
+              <el-tooltip class="item" effect="dark" content="填写初验必须填写终验" placement="top">
+                <el-form-item label="是否初验" prop="acceptance_type">
+                  <el-select class="width-220" v-model="first_acceptances_form.acceptance_type">
+                    <el-option label="是" value="1">
+                    </el-option>
+                    <el-option label="否" value="">
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-tooltip>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="项目验收日期" prop="acceptance_date">
+                <el-date-picker class="width-220" v-model="first_acceptances_form.acceptance_date" type="date" value-format="yyyy-MM-dd">
+                </el-date-picker>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="备注">
+                <el-input class="width-220" v-model="first_acceptances_form.acceptance_note" placeholder="备注"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            此处需要上传附件
+          </el-row>
+        </el-form>
+        <el-form :inline="true" :model="final_acceptances_form" class="demo-form-inline" label-width="100px" :rules="acceptance_form_rules2" ref="final_acceptances_form">
+          <el-row>
+            <el-col :span="8">
+              <el-tooltip class="item" effect="dark" content="填写初验必须填写终验" placement="top">
+                <el-form-item label="是否终验" prop="acceptance_type">
+                  <el-select class="width-220" v-model="final_acceptances_form.acceptance_type">
+                    <el-option label="是" value="2">
+                    </el-option>
+                    <el-option label="否" value="">
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-tooltip>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="项目验收日期" prop="acceptance_date">
+                <el-date-picker class="width-220" v-model="final_acceptances_form.acceptance_date" type="date" value-format="yyyy-MM-dd">
+                </el-date-picker>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="备注">
+                <el-input class="width-220" v-model="final_acceptances_form.acceptance_note" placeholder="备注"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            此处需要上传附件
+          </el-row>
+        </el-form>
+      </div>
+    </transition>
+
+    <!-- 工程验收信息结束~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
+  </div>
+</template>
+<script>
+const twodecimalrule = {
+  pattern: /((^[1-9]\d*)|^0)(\.\d{2})$/,
+  message: "请输入数字并保留两位小数",
+  trigger: "blur"
+};
+export default {
+  data() {
+    return {
+      contract_appendix_list: [],
+      operate_type: [0, 0, 0, 0, 0, 0], //整个页面的操作类型，一共6个表单，0表示新增，1表示修改
+      code_base_url: disparch_data.code_base_url,
+      contract_base_url: disparch_data.contract_base_url,
+      contract_unid_selected_data: [], //合同编号数据数组
+      salesperson_unid_selected_data: [], //销售人员数据数组
+      project_unid_selected_data: [], //项目名称数据数组
+      customer_unid_selected_data: [], //客户名称数据数组
+      provinces: [],
+      cities: [],
+      counties: [],
+      modify_data: false, //用来标志dialog用来修改数据
+      modify_index: -1, //用来标志修改数据的索引
+      projectline_type_data: ["安防", "交通", "客流", "维保"],
+      contract_state_data: ["已完成", "代发货", "施工中", "项目暂停"],
+      contract_type_data: ["供货", "施工", "集成", "维保"],
+      amount_state_unid_data: ["正常验收款", "正常维保"],
+      mainten_start_point_data: ["签订时间", "到货验收时间", "项目终验时间"],
+      guarantee_date: [], //维保服务期，数组形式的日期，0开始，1结束。
+      // show and display~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+      payments_dialog_show: false,
+      receipts_dialog_show: false,
+      rebacks_dialog_show: false,
+      delivers_dialog_show: false,
+      payments_show: true,
+      contract_show: true,
+      rebacks_show: true,
+      receipts_show: true,
+      delivers_show: true,
+      acceptance_show: true,
+      // show and display~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+      form: {
+        // 合同编号
+        contract_unid: null,
+        //销售员
+        salesperson_unid: null,
+        // 项目名称
+        project_unid: null,
+        // 客户名称
+        customer_unid: null,
+        // 项目所在省
+        province: "",
+        // // 项目所在市
+        city: "",
+        // // 项目所在区
+        county: "",
+        // 质保周期
+        guarantee_period: 6,
+        // 签订时间
+        sign_date: "",
+        // 所属年份
+        year: "",
+        // 所属月份
+        month: "",
+        // 产品线类型
+        product_line_type: null,
+        // 合同状态
+        contract_state: null,
+        // 合同类型
+        contract_type: null,
+        // 合同金额
+        contract_amount: 0.0,
+        // 抵扣金额
+        deduct_amount: 0.0,
+        // 合同金额备注
+        contract_amount_note: "",
+        // 暂停金额
+        stop_amount: 0.0,
+        // 累计回款额备注
+        reback_note: "",
+        // 豁免金额
+        exemptions_amount: 0.0,
+        // 合同余额备注
+        contract_remain_note: "",
+        // 是否归档
+        is_archive: "",
+        // 坏账金额
+        bad_amount: 0.0,
+        // 坏账金额备注
+        bad_amount_note: "",
+        // 确定收入金额
+        confirm_income_amount: "",
+        // 账款状态
+        amount_state_unid: "",
+        // 质保期开始
+        mainten_start_point: null,
+        // 合同备注
+        contract_note: "",
+        // 合同附件
+        contract_appendix: {}
+      },
+
+      // 工程验收表单
+      // acceptances_form: [
+      //   {
+      //     acceptance_type: "",
+      //     acceptance_date: null,
+      //     acceptance_note: null,
+      //     appendix_unids: []
+      //   },
+      //   {
+      //     acceptance_type: "",
+      //     acceptance_date: null,
+      //     acceptance_note: null,
+      //     appendix_unids: []
+      //   }
+      // ],
+      first_acceptances_form: {
+        acceptance_type: null,
+        acceptance_date: null,
+        acceptance_note: null,
+        appendix_unids: []
+      },
+
+      final_acceptances_form: {
+        acceptance_type: null,
+        acceptance_date: null,
+        acceptance_note: null,
+        appendix_unids: []
+      },
+      // 发货信息表单和数据，提交时提交data里的数据
+      delivers_data: [],
+      delivers_form: {
+        deliver_goods_date: "",
+        goods_acceptanc_date: "",
+        appendix_unids: []
+      },
+      // 付款约定表单和数据，提交时提交data里的数据
+      payments_data: [],
+      payments_form: {
+        payment_type: "",
+        days: "",
+        payment_propority: "",
+        payment_requirement: ""
+      },
+      // 回款信息表单和数据，提交时提交data里的数据
+      rebacks_data: [],
+      rebacks_form: {
+        actual_reback_amount: 0,
+        reback_date: "",
+        reback_note: ""
+      },
+      // 开票信息表单和数据，提交时提交data里的数据
+      receipts_data: [],
+      receipts_form: {
+        receipt_amount: 0,
+        oa_flow_id: "",
+        receipt_note: ""
+      },
+
+      // 表单验证~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+      add_rules: {
+        contract_amount: twodecimalrule,
+        deduct_amount: twodecimalrule,
+        stop_amount: twodecimalrule,
+        exemptions_amount: twodecimalrule,
+        bad_amount: twodecimalrule,
+        confirm_income_amount: twodecimalrule,
+        payment_type: {
+          required: true,
+          message: "类型不能为空",
+          trigger: "blur"
+        },
+        days: {
+          required: true,
+          pattern: /(^[1-9](\d*)$)|(^0$)/,
+          message: "请输入正确天数",
+          trigger: "blur"
+        },
+        deliver_goods_date: {
+          validator: (rule, value, callback) => {
+            if (value == "") {
+              callback(new Error("时间不能为空"));
+            } else callback();
+          },
+          trigger: "blur"
+        },
+        goods_acceptanc_date: {
+          validator: (rule, value, callback) => {
+            if (value == "") {
+              callback(new Error("时间不能为空"));
+            } else if (
+              this.delivers_form.deliver_goods_date &&
+              value < this.delivers_form.deliver_goods_date
+            ) {
+              callback(new Error("到货验收时间不能小于发货时间"));
+            } else callback();
+          },
+          trigger: "blur"
+        }
+      },
+      rebacks_form_rules: {
+        actual_reback_amount: {
+          required: true,
+          pattern: /(^[1-9](\d*)$)|(^0$)/,
+          message: "请输入正确金额",
+          trigger: "blur"
+        },
+        reback_date: {
+          required: true,
+          message: "不能为空",
+          trigger: "blur"
+        }
+      },
+      receipts_form_rules: {
+        receipt_amount: {
+          required: true,
+          pattern: /(^[1-9](\d*)$)|(^0$)/,
+          message: "请输入正确金额",
+          trigger: "blur"
+        },
+        oa_flow_id: {
+          required: true,
+          message: "请输入流水号",
+          trigger: "blur"
+        }
+      },
+      acceptance_form_rules: {
+        acceptance_date: {
+          validator: (rule, value, callback) => {
+            if (
+              this.first_acceptances_form.acceptance_type == "1" &&
+              value == null
+            ) {
+              callback(new Error("请填写时间"));
+            } else callback();
+          },
+          trigger: "blur"
+        }
+      },
+      acceptance_form_rules2: {
+        acceptance_date: {
+          validator: (rule, value, callback) => {
+            var a = this.final_acceptances_form.acceptance_type;
+            if (a == "2" && value == null) {
+              callback(new Error("请填写时间"));
+            } else callback();
+          },
+          trigger: "blur"
+        },
+        //callback必须返回
+        acceptance_type: {
+          validator: (rule, value, callback) => {
+            if (
+              this.first_acceptances_form.acceptance_type == "1" &&
+              value != "2"
+            ) {
+              callback(new Error("初验必须终验"));
+            } else {
+              callback();
+            }
+          }
+        }
+      }
+      // 表单验证~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    };
+  },
+  computed: {
+    // 上传附件地址
+    upload_url: function() {
+      return (
+        "/api/v1/financial/contracts/" +
+        this.form.contract_unid +
+        "/upload/appendixes"
+      );
+    },
+    // 合同余额
+    contract_remaining: function() {
+      return (
+        this.form.contract_amount -
+        this.form.deduct_amount -
+        this.total_reback_amount -
+        this.form.stop_amount -
+        this.form.exemptions_amount -
+        this.form.bad_amount
+      ).toFixed(2);
+    },
+    // 累计回款额
+    total_reback_amount: function() {
+      var total = 0;
+      for (let i = 0; i < this.rebacks_data.length; i++) {
+        const e = this.rebacks_data[i];
+        total += parseFloat(e.actual_reback_amount);
+      }
+      return total.toFixed(2);
+    },
+    //累计应收款
+    total_receive_amount: function() {
+      var total = 0;
+      var now = new Date();
+      var now_date =
+        now.getFullYear() + "-" + (now.getMonth() + 1) + "-" + now.getDate();
+      for (let i = 0; i < this.payments_data.length; i++) {
+        const e = this.payments_data[i];
+        if (e.pay_date < now_date) {
+          total += parseFloat(e.amount);
+        }
+      }
+      return total.toFixed(2);
+    },
+    // 应收账款余额
+    total_leave_amount: function() {
+      return (
+        this.total_receive_amount -
+        this.total_reback_amount -
+        this.form.deduct_amount -
+        this.form.stop_amount -
+        this.form.exemptions_amount -
+        this.form.bad_amount
+      ).toFixed(2);
+    },
+    // 逾期天数
+    over_days_unid: function() {
+      var pay_date = "";
+      var now = new Date();
+      var now_date =
+        now.getFullYear() + "-" + (now.getMonth() + 1) + "-" + now.getDate();
+      var amount = 0;
+      for (let i = 0; i < this.payments_data.length; i++) {
+        const element = this.payments_data[i];
+        pay_date = element.pay_date;
+        amount += element.amount;
+      }
+      if (now_date > pay_date && amount > this.total_reback_amount) {
+        return this.date_diff(now_date, pay_date);
+      } else {
+        return 0;
+      }
+    },
+    // 维保服务期开始时间
+    start_guarantee_date: function() {
+      if (this.guarantee_date[0]) {
+        return this.guarantee_date[0];
+      }
+    },
+    // 维保服务期结束时间
+    end_guarantee_date: function() {
+      if (this.guarantee_date[1]) {
+        return this.guarantee_date[1];
+      }
+    },
+    mainten_start_date: function() {
+      if (
+        this.form.mainten_start_point == 0 &&
+        this.form.sign_date &&
+        this.form.guarantee_period
+      ) {
+        return this.form.sign_date;
+      } else if (this.form.mainten_start_point == 1 && this.delivers_data[0]) {
+        var index = this.delivers_data.length - 1;
+        return this.delivers_data[index].goods_acceptanc_date;
+      } else if (
+        this.form.mainten_start_point == 2 &&
+        this.final_acceptances_form.acceptance_type == "2" &&
+        this.final_acceptances_form.acceptance_date != ""
+      ) {
+        return this.final_acceptances_form.acceptance_date;
+      }
+    },
+    mainten_end_date: function() {
+      if (
+        this.form.mainten_start_point == 0 &&
+        this.form.sign_date &&
+        this.form.guarantee_period
+      ) {
+        return this.date_add_month(
+          this.form.sign_date,
+          this.form.guarantee_period
+        );
+      } else if (this.form.mainten_start_point == 1 && this.delivers_data[0]) {
+        var index = this.delivers_data.length - 1;
+        return this.date_add_month(
+          this.delivers_data[index].goods_acceptanc_date,
+          this.form.guarantee_period
+        );
+      } else if (
+        this.form.mainten_start_point == 2 &&
+        this.final_acceptances_form.acceptance_type == "2" &&
+        this.final_acceptances_form.acceptance_date != ""
+      ) {
+        return this.date_add_month(
+          this.final_acceptances_form.acceptance_date,
+          this.form.guarantee_period
+        );
+      }
+    }
+  },
+  methods: {
+    test(file) {
+      this.$Axios({
+        method: "post",
+        url: this.upload_url,
+        data: {
+          business_table: "contracts",
+          appendix_files: file
+        }
+      }).then(res => {
+        console.log(res.data.appendix_unid);
+      });
+      return false;
+    },
+
+    // dialog_cancel~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    payments_dialog_cancel() {
+      this.modify_data = false;
+      this.$refs["payments_form"].resetFields();
+      this.payments_dialog_show = false;
+    },
+    rebacks_dialog_cancel() {
+      this.modify_data = false;
+      this.$refs["rebacks_form"].resetFields();
+      this.rebacks_dialog_show = false;
+    },
+    receipts_dialog_cancel() {
+      this.modify_data = false;
+      this.$refs["receipts_form"].resetFields();
+      this.receipts_dialog_show = false;
+    },
+    delivers_dialog_cancel() {
+      this.modify_data = false;
+      this.$refs["delivers_form"].resetFields();
+      this.delivers_dialog_show = false;
+    },
+
+    // dialog_cancel~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+    // date_methods~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    date_diff(date1, date2) {
+      var date1s = date1.split("-");
+      var date2s = date2.split("-");
+      var days = parseInt(
+        (new Date(date1s[0], date1s[1] - 1, date1s[2]).getTime() -
+          new Date(date2s[0], date2s[1] - 1, date2s[2]).getTime()) /
+          1000 /
+          60 /
+          60 /
+          24
+      );
+      return days;
+    },
+    date_add_days(datestr, daynum) {
+      var date_str = datestr;
+      var date = new Date(date_str.replace(/-/g, "/"));
+      date = new Date((date / 1000 + 86400 * daynum) * 1000);
+      var result_date =
+        date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
+      return result_date;
+    },
+    date_add_month(datestr, month) {
+      var dates = datestr.split("-");
+      var date = new Date(dates[0], dates[1] - 1 + month, dates[2]);
+      return date
+        .toLocaleDateString()
+        .match(/\d+/g)
+        .join("-");
+    },
+    // date_methods~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+    add_axios(m, u, arr) {
+      this.$Axios({
+        method: m,
+        url: u
+      }).then(response => {
+        arr = response.data.list_data;
+      });
+    },
+    // remoteMethod~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    contractIdRemoteMethod(query) {
+      this.$Axios({
+        method: "get",
+        url: this.code_base_url + "countries"
+        // params:{
+        //   wd:this.form.contract_unid
+        // }
+      })
+        .then(response => {
+          this.contract_unid_selected_data = response.data.list_data;
+        })
+        .catch(err => {
+          console.log(err.message);
+        });
+    },
+    salespersonIdRemoteMethod(query) {
+      this.$Axios({
+        method: "get",
+        url: this.code_base_url + "simple/cates/09BB973F92/codes"
+        // params:{
+        //   wd:this.form.contract_unid
+        // }
+      })
+        .then(response => {
+          this.salesperson_unid_selected_data = response.data.list_data;
+        })
+        .catch(err => {
+          console.log(err.message);
+        });
+    },
+    projectIdRemoteMethod(query) {
+      this.$Axios({
+        method: "get",
+        url: this.code_base_url + "simple/cates/09BB973F92/codes"
+        // params:{
+        //   wd:this.form.contract_unid
+        // }
+      })
+        .then(response => {
+          this.project_unid_selected_data = response.data.list_data;
+        })
+        .catch(err => {
+          console.log(err.message);
+        });
+    },
+    customerIdRemoteMethod(query) {
+      this.$Axios({
+        method: "get",
+        url: this.code_base_url + "simple/cates/09BB973F92/codes"
+        // params:{
+        //   wd:this.form.contract_unid
+        // }
+      })
+        .then(response => {
+          this.customer_unid_selected_data = response.data.list_data;
+        })
+        .catch(err => {
+          console.log(err.message);
+        });
+    },
+
+    // remoteMethod~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+    signDataChanged() {
+      var date = this.form.sign_date;
+      this.form.year = date.slice(0, 4);
+      this.form.month = date.slice(5, 7);
+    },
+
+    // dialog_confirm_start~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    payments_dialog_confirm() {
+      this.$refs["payments_form"].validate(valid => {
+        if (valid) {
+          var progress = this.payments_data.length + 1;
+          var type_value = this.payments_form.payment_type;
+          var days = this.payments_form.days;
+          var propority = this.payments_form.payment_propority;
+          var requirement = this.payments_form.payment_requirement;
+          var amount = 0;
+          var date = "";
+          if (this.form.contract_amount > 0) {
+            amount = this.form.contract_amount * propority / 100;
+          }
+          if (type_value == "1" && this.form.sign_date) {
+            date = this.date_add_days(this.form.sign_date, days);
+          } else if (
+            (type_value == "2" || type_value == "4") &&
+            this.delivers_data[0]
+          ) {
+            var i = this.delivers_data.length - 1;
+            date = this.date_add_days(
+              this.delivers_data[i].goods_acceptanc_date,
+              days
+            );
+          } else if (
+            (type_value == "3" || type_value == "5") &&
+            this.final_acceptances_form.acceptance_date != null
+          ) {
+            date = this.date_add_days(
+              this.final_acceptances_form.acceptance_date,
+              days
+            );
+          }
+          var a = {
+            payment_progress: progress,
+            payment_type: type_value,
+            days: days,
+            payment_propority: propority,
+            payment_requirement: requirement,
+            amount: amount,
+            pay_date: date
+          };
+          if (!this.modify_data) {
+            this.payments_data.push(a);
+          } else {
+            this.$set(this.payments_data, this.modify_index, a);
+          }
+
+          this.modify_data = false;
+          this.$refs["payments_form"].resetFields();
+          this.payments_dialog_show = false;
+        }
+      });
+    },
+    receipts_dialog_confirm() {
+      this.$refs["receipts_form"].validate(valid => {
+        if (valid) {
+          var receipt_progress = this.receipts_data.length + 1;
+          var receipt_amount = parseFloat(this.receipts_form.receipt_amount);
+          var oa_flow_id = this.receipts_form.oa_flow_id;
+          var receipt_propority = 0;
+          if (this.form.contract_amount) {
+            receipt_propority = (
+              receipt_amount *
+              100 /
+              this.form.contract_amount
+            ).toFixed(2);
+          }
+          var total_receipt_amount = receipt_amount;
+          if (receipt_progress > 1) {
+            total_receipt_amount =
+              parseFloat(
+                this.receipts_data[receipt_progress - 2].total_receipt_amount
+              ) + receipt_amount;
+          }
+          var is_reback = "";
+          if (this.total_reback_amount >= total_receipt_amount) {
+            is_reback = "是";
+          } else is_reback = "否";
+          var receipt_note = this.receipts_form.receipt_note;
+          var a = {
+            receipt_progress: receipt_progress,
+            receipt_amount: receipt_amount,
+            oa_flow_id: oa_flow_id,
+            receipt_propority: receipt_propority,
+            total_receipt_amount: total_receipt_amount,
+            is_reback: is_reback,
+            receipt_note: receipt_note
+          };
+          if (!this.modify_data) {
+            this.receipts_data.push(a);
+          } else {
+            this.$set(this.receipts_data, this.modify_index, a);
+          }
+
+          this.modify_data = false;
+          this.$refs["receipts_form"].resetFields();
+          this.receipts_dialog_show = false;
+        }
+      });
+    },
+    rebacks_dialog_confirm() {
+      this.$refs["rebacks_form"].validate(valid => {
+        if (valid) {
+          var reback_progress = this.rebacks_data.length + 1;
+          var actual_reback_amount = this.rebacks_form.actual_reback_amount;
+          var reback_propority = 0;
+          if (this.form.contract_amount) {
+            reback_propority =
+              actual_reback_amount / this.form.contract_amount * 100;
+          }
+          var reback_date = this.rebacks_form.reback_date;
+          var reback_note = this.rebacks_form.reback_note;
+          var a = {
+            reback_progress: reback_progress,
+            actual_reback_amount: actual_reback_amount,
+            reback_propority: reback_propority,
+            reback_date: reback_date,
+            reback_note: reback_note
+          };
+
+          if (!this.modify_data) {
+            this.rebacks_data.push(a);
+          } else {
+            this.$set(this.rebacks_data, this.modify_index, a);
+          }
+
+          this.modify_data = false;
+
+          this.$refs["rebacks_form"].resetFields();
+          this.rebacks_dialog_show = false;
+        }
+      });
+    },
+    delivers_dialog_confirm() {
+      this.$refs["delivers_form"].validate(valid => {
+        if (valid) {
+          var deliver_goods_date = this.delivers_form.deliver_goods_date;
+          var goods_acceptanc_date = this.delivers_form.goods_acceptanc_date;
+          var appendix_unids = this.delivers_form.appendix_unids;
+          var a = {
+            deliver_goods_date: deliver_goods_date,
+            goods_acceptanc_date: goods_acceptanc_date,
+            appendix_unids: appendix_unids
+          };
+          if (!this.modify_data) {
+            this.delivers_data.push(a);
+          } else {
+            this.$set(this.delivers_data, this.modify_index, a);
+          }
+          this.modify_data = false;
+          this.$refs["delivers_form"].resetFields();
+          this.delivers_dialog_show = false;
+        }
+      });
+    },
+    // dialog_confirm_end~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+    data_delete(index, data) {
+      this.$confirm("确认删除数据？", "确认信息", {
+        confirmButtonText: "确认",
+        cancelButtonText: "取消"
+      })
+        .then(() => {
+          data.splice(index, 1);
+          this.$message({
+            duration: 1000,
+            type: "success",
+            message: "删除成功"
+          });
+        })
+        .catch(action => {
+          this.$message({
+            duration: 1000,
+            type: "info",
+            message: "没有删除数据"
+          });
+        });
+    },
+
+    // modifystart~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    payment_data_modify(index, data) {
+      this.payments_form.payment_type = data[index].payment_type;
+      this.payments_form.days = data[index].days;
+      this.payments_form.payment_propority = data[index].payment_propority;
+      this.payments_form.payment_requirement = data[index].payment_requirement;
+      this.modify_data = true;
+      this.modify_index = index;
+      this.payments_dialog_show = true;
+    },
+    reback_data_modify(index, data) {
+      this.rebacks_form.actual_reback_amount = data[index].actual_reback_amount;
+      this.rebacks_form.reback_date = data[index].reback_date;
+      this.rebacks_form.reback_note = data[index].reback_note;
+      this.modify_data = true;
+      this.modify_index = index;
+      this.rebacks_dialog_show = true;
+    },
+    receipt_data_modify(index, data) {
+      this.receipts_form.receipt_amount = data[index].receipt_amount;
+      this.receipts_form.oa_flow_id = data[index].oa_flow_id;
+      this.receipts_form.receipt_note = data[index].receipt_note;
+      this.modify_data = true;
+      this.modify_index = index;
+      this.receipts_dialog_show = true;
+    },
+    deliver_data_modify(index, data) {
+      this.delivers_form.deliver_goods_date = data[index].deliver_goods_date;
+      this.delivers_form.goods_acceptanc_date =
+        data[index].goods_acceptanc_date;
+      this.modify_data = true;
+      this.modify_index = index;
+      this.delivers_dialog_show = true;
+    },
+    // modifyend~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+    // getlocation start~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    get_provinces() {
+      this.$Axios({
+        method: "get",
+        url: this.code_base_url + "countries/0E229CD043/provinces"
+      })
+        .then(response => {
+          this.provinces = response.data.list_data;
+        })
+        .catch(err => {
+          console.log(err.message);
+        });
+    },
+    get_cities() {
+      this.form.city = "";
+      this.form.county = "";
+      if (this.form.province) {
+        this.$Axios({
+          method: "get",
+          url:
+            this.code_base_url +
+            "countries/0E229CD043/provinces/" +
+            this.form.province +
+            "/cities"
+        })
+          .then(response => {
+            this.cities = response.data.list_data;
+          })
+          .catch(err => {
+            console.log(err.message);
+          });
+      }
+    },
+    get_counties() {
+      this.form.county = "";
+      if (this.form.province && this.form.city) {
+        this.$Axios({
+          method: "get",
+          url:
+            this.code_base_url +
+            "countries/0E229CD043/provinces/" +
+            this.form.province +
+            "/cities/" +
+            this.form.city +
+            "/counties"
+        })
+          .then(response => {
+            this.counties = response.data.list_data;
+          })
+          .catch(err => {
+            console.log(err.message);
+          });
+      }
+    },
+    // getlocation end~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+    // !!!!!!~~~~~~~~~~~~~submit~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    form_submit(name) {
+      if (name == "form") {
+        if (this.operate_type[0] == 0) {
+          this.operate_type[0] = 1;
+          this.$Axios({
+            method: "post",
+            url: this.contract_base_url,
+            data: this.form
+          }).then(response => {
+            if (response.data.encode == 200) {
+              this.$alert("提交成功");
+            }
+          });
+        } else if (this.operate_type[0] == 1) {
+          // this.$alert("我提交 基本信息 修改的数据");
+          console.log(this.form.contract_unid);
+        }
+      } else if (name == "payment") {
+        if (this.operate_type[1] == 0) {
+          this.operate_type[1] = 1;
+          this.$alert("我提交 付款约定 新的数据");
+        } else if (this.operate_type[1] == 1) {
+          this.$alert("我提交 付款约定 修改的数据");
+        }
+      } else if (name == "reback") {
+        if (this.operate_type[2] == 0) {
+          this.operate_type[2] = 1;
+          this.$alert("我提交 回款信息 新的数据");
+        } else if (this.operate_type[2] == 1) {
+          this.$alert("我提交 回款信息 修改的数据");
+        }
+      } else if (name == "receipt") {
+        if (this.operate_type[3] == 0) {
+          this.operate_type[3] = 1;
+          this.$alert("我提交 开票信息 新的数据");
+        } else if (this.operate_type[3] == 1) {
+          this.$alert("我提交 开票信息 修改的数据");
+        }
+      } else if (name == "deliver") {
+        if (this.operate_type[4] == 0) {
+          this.operate_type[4] = 1;
+          this.$alert("我提交 发货信息 新的数据");
+        } else if (this.operate_type[4] == 1) {
+          this.$alert("我提交 发货信息 修改的数据");
+        }
+      } else if (name == "project") {
+        if (this.operate_type[5] == 0) {
+          var _this = this;
+          var p1 = new Promise(function(resolve, reject) {
+            _this.$refs.first_acceptances_form.validate(valid => {
+              if (valid) {
+                resolve();
+              }
+            });
+          });
+          var p2 = new Promise(function(resolve, reject) {
+            _this.$refs.final_acceptances_form.validate(valid2 => {
+              if (valid2) {
+                resolve();
+              }
+            });
+          });
+
+          Promise.all([p1, p2]).then(function() {
+            _this
+              .$Axios({
+                method: "post",
+                url: "/api/v1/financial/contracts/contract/project/acceptancs",
+                data: {
+                  list_data: [
+                    _this.first_acceptances_form,
+                    _this.final_acceptances_form
+                  ]
+                }
+              })
+              .then(response => {
+                if (response.data.encode == 200) {
+                  _this.$alert("提交成功");
+                  _this.operate_type[5] = 1;
+                }
+              });
+          });
+        } else if (this.operate_type[5] == 1) {
+          this.$refs["first_acceptances_form"].validate(valid => {
+            if (valid) {
+              console.log("非初次提交");
+            }
+          });
+        }
+      }
+    }
+  },
+  created() {
+    this.get_provinces();
+    var id = this.$route.params.contract_unid;
+    if (id != "0") {
+      this.operate_type = [1, 1, 1, 1, 1, 1];
+      this.form.contract_unid = id;
+    }
+  }
+};
+</script>
+<style scoped>
+.add_button {
+  font-size: 20px;
+  padding-top: 60px;
+  color: gray;
+}
+.add_button:hover {
+  color: black;
+}
+h1 {
+  text-align: left;
+  background-color: rgba(138, 200, 255, 0.5);
+  padding-top: 20px;
+  padding-bottom: 20px;
+  padding-left: 30px;
+  font-size: 26px;
+  margin-bottom: 0px;
+}
+h1.h-button:hover {
+  background-color: rgba(138, 200, 255, 0.8);
+  cursor: pointer;
+}
+
+#payments_dialog {
+  text-align: left;
+}
+.width-220 {
+  width: 300px;
+}
+#form,
+#payments_data_table,
+#rebacks_data_table,
+#receipts_data_table,
+#delivers_data_table,
+#acceptance_form {
+  border-left: 5px solid rgba(138, 200, 255, 0.5);
+  border-bottom: 5px solid rgba(138, 200, 255, 0.5);
+  border-right: 5px solid rgba(138, 200, 255, 0.5);
+  padding-top: 20px;
+}
+</style>

code/finance_web/src/components/login.vue

+<template>
+  <div id="login_box">
+    <h2 style="text-align:center">合同管理系统</h2>
+    <br>
+    <el-form ref="form" :model="form" :rules="rules" label-width="60px" label-position="top">
+      <el-form-item label="姓名" prop="username">
+        <el-input v-model="form.username"></el-input>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input type="password" v-model="form.password" auto-complete="off"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="submitForm('form')">提交</el-button>
+        <el-button @click="resetForm('form')">重置</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "login",
+  data() {
+    return {
+      form: {
+        username: localStorage.getItem("username"),
+        password: ""
+      },
+      rules: {
+      username: [
+        {required: true, message: '请输入用户名', trigger: 'blur'}
+      ],
+      password: [
+        {required: true, message: '请输入登录密码', trigger: 'blur'}
+      ]
+    }
+    };
+  },
+  methods: {
+    submitForm(form){
+      this.$refs[form].validate((valid) => {
+        if (valid) {
+          console.log(valid);
+          console.log(this.form.username);
+          console.log(this.form.password);
+          window.localStorage.setItem("username",this.form.username);
+          window.sessionStorage.setItem('loginCheck',true);
+          window.sessionStorage.setItem("username",this.form.username);
+          this.$router.push({path:"/nav/search"});
+        }
+      });
+    },
+    resetForm(form){
+      this.$refs[form].resetFields();
+    }
+  }
+};
+</script>
+
+<style scoped>
+#login_box {
+  position: absolute;
+  /* height: 300px; */
+  width: 300px;
+  top: 45%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+</style>

code/finance_web/src/components/manage.vue

+<template>
+  <div>
+    后台管理
+  </div>
+</template>

code/finance_web/src/components/nav.vue

+<template>
+  <el-container>
+    <el-aside width="15%">
+      <el-menu :default-active="$route.path" class="el-menu-vertical-demo" router>
+        <div style="height:20%">
+
+        </div>
+        <el-menu-item index="/nav/search">
+          <i class="el-icon-search"></i>
+          <span slot="title">检索合同</span>
+        </el-menu-item>
+        <el-menu-item index="/nav/contract/0">
+          <i class="el-icon-plus"></i>
+          <span slot="title">添加合同</span>
+        </el-menu-item>
+        <el-menu-item index="/nav/manage">
+          <i class="el-icon-setting"></i>
+          <span slot="title">后台管理</span>
+        </el-menu-item>
+        <el-menu-item index="" @click="exit">
+          <i class="el-icon-back"></i>
+          <span slot="title">退出</span>
+        </el-menu-item>
+      </el-menu>
+    </el-aside>
+    <el-main>
+      <router-view></router-view>
+    </el-main>
+  </el-container>
+</template>
+
+<script>
+export default {
+  name: "HelloWorld",
+  data() {
+    return {
+      username: ""
+    };
+  },
+
+  methods: {
+    exit() {
+      this.$confirm("确认退出?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          sessionStorage.removeItem("username");
+          sessionStorage.removeItem("loginCheck");
+          this.$router.push({ path: "/" });
+        })
+        .catch(() =>{});
+    }
+  },
+  beforeCreate() {
+    if (!sessionStorage.getItem("loginCheck")) {
+      alert("请登录");
+      this.$router.push({ path: "/" });
+    }
+  },
+  created() {
+    this.username = sessionStorage.getItem("username");
+  }
+};
+</script>
+
+<style>
+.el-main {
+  text-align: center;
+}
+.el-menu {
+  position: relative;
+}
+
+.el-container,
+.el-aside {
+  height: 100%;
+}
+.el-menu {
+  height: 100%;
+}
+</style>

code/finance_web/src/components/search.vue

+<template>
+  <div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+    };
+  },
+  methods: {
+    
+    }
+};
+</script>
+
+<style scoped>
+
+</style>

code/finance_web/src/main.js

+// The Vue build version to load with the `import` command
+// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
+import Vue from 'vue'
+import App from './App'
+import router from './router'
+import ElementUI from 'element-ui'
+import 'element-ui/lib/theme-chalk/index.css'
+import Axios from 'axios'
+import '../static/city-data'
+import CollapseTransition from 'element-ui/lib/transitions/collapse-transition';
+import "./mock"
+import '../static/disparch'
+
+
+Vue.component(CollapseTransition.name, CollapseTransition)
+Vue.config.productionTip = false
+Vue.prototype.$Axios = Axios
+/* eslint-disable no-new */
+Vue.use(ElementUI)
+
+Vue.filter('twoDecimal',function(value){
+  value=Number(value);
+  return value.toFixed(2);
+});
+new Vue({
+  el: '#app',
+  router,
+  components: { App },
+  template: '<App/>'
+})

code/finance_web/src/mock.js

+const Mock = require('mockjs');
+
+Mock.mock("/api/v1/financial/contracts/contract/project/acceptancs", 'post', res => {
+  console.log(res.body);
+  return {
+    encode: 200
+  }
+})

code/finance_web/src/router/index.js

+import Vue from 'vue'
+import Router from 'vue-router'
+import Nav from '@/components/nav'
+import Login from '@/components/login'
+import Search from '@/components/search'
+import Contract from '@/components/contract'
+import Manage from '@/components/manage'
+
+
+Vue.use(Router)
+
+export default new Router({
+  routes: [{
+      path: '/',
+      component: Login
+    },
+    {
+      path: '/nav',
+      component: Nav,
+      children: [{
+        path: 'search',
+        component: Search
+      }, {
+        path: 'contract/:contract_unid',
+        component: Contract
+      }, {
+        path: 'manage',
+        component: Manage
+      }]
+    }
+  ]
+})

code/finance_web/static/js/manifest.2ae2e69a05c33dfc65f8.js

-!function(r){var n=window.webpackJsonp;window.webpackJsonp=function(e,u,c){for(var f,i,p,a=0,l=[];a<e.length;a++)i=e[a],o[i]&&l.push(o[i][0]),o[i]=0;for(f in u)Object.prototype.hasOwnProperty.call(u,f)&&(r[f]=u[f]);for(n&&n(e,u,c);l.length;)l.shift()();if(c)for(a=0;a<c.length;a++)p=t(t.s=c[a]);return p};var e={},o={2:0};function t(n){if(e[n])return e[n].exports;var o=e[n]={i:n,l:!1,exports:{}};return r[n].call(o.exports,o,o.exports,t),o.l=!0,o.exports}t.m=r,t.c=e,t.d=function(r,n,e){t.o(r,n)||Object.defineProperty(r,n,{configurable:!1,enumerable:!0,get:e})},t.n=function(r){var n=r&&r.__esModule?function(){return r.default}:function(){return r};return t.d(n,"a",n),n},t.o=function(r,n){return Object.prototype.hasOwnProperty.call(r,n)},t.p="/",t.oe=function(r){throw console.error(r),r}}([]);
-//# sourceMappingURL=manifest.2ae2e69a05c33dfc65f8.js.map
\ No newline at end of file

code/finance_web/static/js/manifest.2ae2e69a05c33dfc65f8.js.map

-{"version":3,"sources":["webpack:///webpack/bootstrap f39cc19804ff0156d5ab"],"names":["parentJsonpFunction","window","chunkIds","moreModules","executeModules","moduleId","chunkId","result","i","resolves","length","installedChunks","push","Object","prototype","hasOwnProperty","call","modules","shift","__webpack_require__","s","installedModules","2","exports","module","l","m","c","d","name","getter","o","defineProperty","configurable","enumerable","get","n","__esModule","object","property","p","oe","err","console","error"],"mappings":"aACA,IAAAA,EAAAC,OAAA,aACAA,OAAA,sBAAAC,EAAAC,EAAAC,GAIA,IADA,IAAAC,EAAAC,EAAAC,EAAAC,EAAA,EAAAC,KACQD,EAAAN,EAAAQ,OAAoBF,IAC5BF,EAAAJ,EAAAM,GACAG,EAAAL,IACAG,EAAAG,KAAAD,EAAAL,GAAA,IAEAK,EAAAL,GAAA,EAEA,IAAAD,KAAAF,EACAU,OAAAC,UAAAC,eAAAC,KAAAb,EAAAE,KACAY,EAAAZ,GAAAF,EAAAE,IAIA,IADAL,KAAAE,EAAAC,EAAAC,GACAK,EAAAC,QACAD,EAAAS,OAAAT,GAEA,GAAAL,EACA,IAAAI,EAAA,EAAYA,EAAAJ,EAAAM,OAA2BF,IACvCD,EAAAY,IAAAC,EAAAhB,EAAAI,IAGA,OAAAD,GAIA,IAAAc,KAGAV,GACAW,EAAA,GAIA,SAAAH,EAAAd,GAGA,GAAAgB,EAAAhB,GACA,OAAAgB,EAAAhB,GAAAkB,QAGA,IAAAC,EAAAH,EAAAhB,IACAG,EAAAH,EACAoB,GAAA,EACAF,YAUA,OANAN,EAAAZ,GAAAW,KAAAQ,EAAAD,QAAAC,IAAAD,QAAAJ,GAGAK,EAAAC,GAAA,EAGAD,EAAAD,QAKAJ,EAAAO,EAAAT,EAGAE,EAAAQ,EAAAN,EAGAF,EAAAS,EAAA,SAAAL,EAAAM,EAAAC,GACAX,EAAAY,EAAAR,EAAAM,IACAhB,OAAAmB,eAAAT,EAAAM,GACAI,cAAA,EACAC,YAAA,EACAC,IAAAL,KAMAX,EAAAiB,EAAA,SAAAZ,GACA,IAAAM,EAAAN,KAAAa,WACA,WAA2B,OAAAb,EAAA,SAC3B,WAAiC,OAAAA,GAEjC,OADAL,EAAAS,EAAAE,EAAA,IAAAA,GACAA,GAIAX,EAAAY,EAAA,SAAAO,EAAAC,GAAsD,OAAA1B,OAAAC,UAAAC,eAAAC,KAAAsB,EAAAC,IAGtDpB,EAAAqB,EAAA,IAGArB,EAAAsB,GAAA,SAAAC,GAA8D,MAApBC,QAAAC,MAAAF,GAAoBA","file":"static/js/manifest.2ae2e69a05c33dfc65f8.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n \t\tif(executeModules) {\n \t\t\tfor(i=0; i < executeModules.length; i++) {\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n \t\t\t}\n \t\t}\n \t\treturn result;\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// objects to store loaded and loading chunks\n \tvar installedChunks = {\n \t\t2: 0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"/\";\n\n \t// on error function for async loading\n \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap f39cc19804ff0156d5ab"],"sourceRoot":""}
\ No newline at end of file