Showing preview only (415K chars total). Download the full file or copy to clipboard to get everything.
Repository: hzlshen/vue-project
Branch: master
Commit: 74108e477990
Files: 72
Total size: 375.8 KB
Directory structure:
gitextract_7zminbyu/
├── .babelrc
├── .editorconfig
├── .gitignore
├── .postcssrc.js
├── README.md
├── build/
│ ├── build.js
│ ├── check-versions.js
│ ├── utils.js
│ ├── vue-loader.conf.js
│ ├── webpack.base.conf.js
│ ├── webpack.dev.conf.js
│ └── webpack.prod.conf.js
├── config/
│ ├── dev.env.js
│ ├── index.js
│ └── prod.env.js
├── index.html
├── package.json
├── src/
│ ├── App.vue
│ ├── axios/
│ │ ├── api.js
│ │ ├── fetch.js
│ │ └── url.js
│ ├── components/
│ │ ├── btnList/
│ │ │ └── btnList.vue
│ │ ├── filterBox/
│ │ │ ├── batchAudit.vue
│ │ │ ├── batchDelete.vue
│ │ │ ├── batchDifferences.vue
│ │ │ ├── batchStatement.vue
│ │ │ └── batchUnAudit.vue
│ │ ├── getWebSocket/
│ │ │ └── getWebSocket.vue
│ │ ├── head/
│ │ │ └── head.vue
│ │ ├── search/
│ │ │ └── Search.vue
│ │ ├── sidebar/
│ │ │ └── sidebar.vue
│ │ ├── tabs/
│ │ │ └── Tabs.vue
│ │ ├── tags/
│ │ │ └── tags.vue
│ │ ├── template/
│ │ │ ├── hzlDialog.vue
│ │ │ ├── hzlInput.vue
│ │ │ ├── hzlPage.vue
│ │ │ ├── hzlSelect.vue
│ │ │ ├── hzlTable.vue
│ │ │ └── index.js
│ │ └── templateOne.vue
│ ├── i18n/
│ │ ├── index.js
│ │ └── lan/
│ │ ├── en.js
│ │ └── zh.js
│ ├── main.js
│ ├── page/
│ │ ├── chart/
│ │ │ └── chart.vue
│ │ ├── home/
│ │ │ └── home.vue
│ │ ├── inquiry/
│ │ │ ├── BankFlow.vue
│ │ │ ├── OrderReceivable.vue
│ │ │ ├── SystemStatement.vue
│ │ │ ├── TransactionFlow.vue
│ │ │ └── children/
│ │ │ ├── orderAdd.vue
│ │ │ └── orderDetail.vue
│ │ ├── login/
│ │ │ └── login.vue
│ │ ├── reportForms/
│ │ │ ├── OrderSummary.vue
│ │ │ └── ReceivablesBalance.vue
│ │ ├── set/
│ │ │ ├── structure.vue
│ │ │ └── updatePWD.vue
│ │ ├── upload/
│ │ │ └── upload.vue
│ │ ├── verifyPlatform/
│ │ │ ├── VerifyBankStatement.vue
│ │ │ ├── VerifyReceivables.vue
│ │ │ └── verifyAutomate.vue
│ │ └── verifyRecord/
│ │ ├── VerifyBankStatementRecord.vue
│ │ └── VerifyReceivablesRecord.vue
│ ├── router/
│ │ └── index.js
│ ├── store/
│ │ ├── index.js
│ │ └── modules/
│ │ ├── actions.js
│ │ ├── mutation-type.js
│ │ └── mutations.js
│ └── style/
│ └── main.css
└── static/
├── .gitkeep
└── data/
├── localData.json
└── tableCols.json
================================================
FILE CONTENTS
================================================
================================================
FILE: .babelrc
================================================
{
"presets": [
["env", {
"modules": false,
"targets": {
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
}
}],
"stage-2"
],
"plugins": ["transform-vue-jsx", "transform-runtime"]
}
================================================
FILE: .editorconfig
================================================
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
================================================
FILE: .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
================================================
FILE: .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": {}
}
}
================================================
FILE: README.md
================================================
#基于vue-cli构建的财务后台管理系统(`vue2`+`vuex`+`axios`+`vue-router`+`element-ui`+`echarts`+`websocket`+`vue-i18n`)
[](https://github.com/996icu/996.ICU/blob/master/LICENSE)[](https://996.icu)
-------
### 本项目可以学到:
1、学会使用vue-cli2.0构建项目.
2、基于(pomise)封装axios的get、post等http请求.
3、学会使用vue-router实现页面跳转带参.
4、学会使用vuex状态管理.
5、配套element-ui(主要对table的操作多)
6、对elementui进行二次封装组件,提高复用性
7、略微涉及echarts作图标分析
8、使用websocket监听ele进度条状态
9、使用vue-i18n实现国际化--中英文切换
10、使用Ngprogress做加载,类似github loading bar
#### 安装
#### 项目地址：
（`git clone`）
```shell
git clone https://github.com/hzlshen/vue-project.git
```
#### 通过`npm`安装本地服务第三方依赖模块(需要已安装[Node.js](https://nodejs.org/))
```
npm install
```
#### 启动服务(http://localhost:8080)
```
npm run dev
```
#### 发布代码
```
npm run build
```
#### 开发
#### 目录结构
<pre>
.
├── README.md
├── build // 构建服务和webpack配置
├── config // 项目不同环境的配置
├── dist // 项目build目录
├── index.html // 项目入口文件
├── package.json // 项目配置文件
├── src // 生产目录
│ ├── assets // css js 和图片资源
│ ├── axios // ajax url 放置
│ ├── components // 各种组件
│ ├── images // 图片文件夹
│ ├── i18n // 国际化文件夹
│ ├── page // 各种页面
│ ├── router // 页面路由
│ ├── store // vuex状态管理器
│ ├── style // 样式文件
│ └── main.js // Webpack 预编译入口
</pre>
###项目截图
<br/>
================================================
FILE: 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'
))
})
})
================================================
FILE: 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)
}
}
================================================
FILE: 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')
})
}
}
================================================
FILE: 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'
}
}
================================================
FILE: build/webpack.base.conf.js
================================================
'use strict'
const path = require('path')
const utils = require('./utils')
const config = require('../config')
const vueLoaderConfig = require('./vue-loader.conf')
function resolve (dir) {
return path.join(__dirname, '..', dir)
}
module.exports = {
context: path.resolve(__dirname, '../'),
entry: {
app: './src/main.js'
},
output: {
path: config.build.assetsRoot,
filename: '[name].js',
publicPath: process.env.NODE_ENV === 'production'
? config.build.assetsPublicPath
: config.dev.assetsPublicPath
},
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
}
},
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: vueLoaderConfig
},
{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('img/[name].[hash:7].[ext]')
}
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('media/[name].[hash:7].[ext]')
}
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
]
},
node: {
// prevent webpack from injecting useless setImmediate polyfill because Vue
// source contains it (although only uses it if it's native).
setImmediate: false,
// prevent webpack from injecting mocks to Node native modules
// that does not make sense for the client
dgram: 'empty',
fs: 'empty',
net: 'empty',
tls: 'empty',
child_process: 'empty'
}
}
================================================
FILE: 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)
}
})
})
================================================
FILE: 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
================================================
FILE: config/dev.env.js
================================================
'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')
module.exports = merge(prodEnv, {
NODE_ENV: '"development"'
})
================================================
FILE: 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
}
}
================================================
FILE: config/prod.env.js
================================================
'use strict'
module.exports = {
NODE_ENV: '"production"'
}
================================================
FILE: index.html
================================================
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Vue+Element后台管理系统</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
================================================
FILE: package.json
================================================
{
"name": "my-project",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "liuzhu",
"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",
"echarts": "^4.1.0",
"element-ui": "^2.4.11",
"moment": "^2.22.2",
"normalize.css": "^8.0.1",
"nprogress": "^0.2.0",
"url-parse": "^1.4.4",
"vue": "^2.5.21",
"vue-i18n": "^8.7.0",
"vue-router": "^3.0.2",
"vuex": "^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.4.2",
"copy-webpack-plugin": "^4.6.0",
"css-loader": "^0.28.0",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^1.1.4",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1",
"node-notifier": "^5.3.0",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0",
"portfinder": "^1.0.20",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.1.6",
"postcss-url": "^7.2.1",
"rimraf": "^2.6.3",
"semver": "^5.6.0",
"shelljs": "^0.7.6",
"uglifyjs-webpack-plugin": "^1.3.0",
"url-loader": "^0.5.8",
"vue-loader": "^13.7.3",
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.5.21",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.2.1"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
================================================
FILE: src/App.vue
================================================
<template>
<div id="app">
<transition name="router-fade" mode="out-in">
<keep-alive>
<router-view></router-view>
</keep-alive>
</transition>
</div>
</template>
<script>
export default {
name: 'App'
}
</script>
<style>
@import './style/main.css';
</style>
================================================
FILE: src/axios/api.js
================================================
/**
* Created by 不动的推动者 on 2018/4/30.
*/
/*****
* 获取数据get + 对应路由名称
* 向后台传数据 store + 对应路由名称
* 驼峰命名
* *****/
import { fetch } from "./fetch"; //引用fetch.js
import api from './url'; //引用url.js
//查看用户
export const lookOption = (username,password,captcha) => fetch({//lookOption是你要调用接口的名字，issuer,userId是传进来的参数
//api.Hallowmas 引用url.js里面的数据
url: api.Hallowmas,
method: 'get',//请求方法
params:{
// username,password,captcha//参数
}
});
//获取公司
export const getCompany = (date,audit) => fetch({
url:'',
method:'',
params:{
date,
audit
}
});
//订单应收获取数据
export const getOrderReceivable = ()=>fetch({
url: api.commonLick,
method: 'get',
params: {
}
});
//cols title
export const getCols = ()=>fetch({
url: api.cols,
method: 'get',
params: {
}
});
//审核 批量审核audit
export const audit = (data)=>fetch({
url: '',
methods: 'get',
params: {
data: data
}
})
//获取验证码
export const getcaptchas = () => fetch('', {},'POST'); //简写
//有新接口的时候像上面那样再来一次
// //修改昵称接口
// export function userID(name){
// return fetch({
// url:api.myself_name,
// method:"put",
// data:{
// nickname:name
// }
// })
// }
//
//
// //取消转发赞踩接口
// export function cancelForward(articleId,type){
// return fetch({
// url:api.detail_article+articleId+"/forwarded_impress",
// method:"delete",
// params:{
// type:type
// }
// })
// }
//导入
export const leadingIn = () => fetch('',{},'POST')
================================================
FILE: src/axios/fetch.js
================================================
/**
* Created by 不动的推动者 on 2018/4/30.
*/
import axios from 'axios';//引入axios
export function fetch(options){
return new Promise((resolve, reject) => {
const instance = axios.create({
//instance创建一个axios实例，可以自定义配置。
//所有的请求都会带上这些配置，比如全局都要用的身份信息等。
headers: {
'Content-Type': 'application/json',
// 'token_in_header': global_.token,//token从全局变量那里传过来
},
timeout:30 * 1000 // 30秒超时
});
instance(options)
.then(response => { //then 请求成功之后进行什么操作
resolve(response);//把请求到的数据发到引用请求的地方
})
.catch(error => {
console.log('请求异常信息：'+error);
reject(error);
});
});
}
================================================
FILE: src/axios/url.js
================================================
/**
* Created by 不动的推动者 on 2018/4/30.
*/
export default {
//接口代理配置
Hallowmas:'http://jsonplaceholder.typicode.com/users',
commonLick:'../static/data/localData.json',
cols:'../static/data/tableCols.json',
ws:'ws://baidu.com'
}
//区分环境或者区分服务器
// let service = 'dev';
// // // let service = 'prod';
// let api = '';
// if (service === 'dev') {
// /**dev开发**/
// api = 'data/localData.json';
// } else if (service === 'prod') {
// /**prod部署**/
// api = '/proxy/client';
// }
//
// export default {
// /**个人中心start**/
// //1 获取c端个人信息 POST /wx/getClientInfo
// getClientInfo: `${api}/wx/getClientInfo`,
// //2 获取手机注册验证码 POST /wx/getClientRegisterCode
// getClientRegisterCode: `${api}/wx/getClientRegisterCode`,
// //3 绑定手机号 POST /wx/clientBindMobile
// clientBindMobile: `${api}/wx/clientBindMobile`,
// /**个人中心end**/
//
// }
================================================
FILE: src/components/btnList/btnList.vue
================================================
<template>
<div class="btn-list">
<el-dropdown split-button type="primary" size="mini" @click="getBtnInfo($event)">
导入
<el-dropdown-menu slot="dropdown">
<el-dropdown-item >
<span @click="getBtnInfo($event)">导出</span>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-dropdown split-button type="primary" size="mini" @click="getBtnInfo($event)">
审核
<el-dropdown-menu slot="dropdown">
<el-dropdown-item >
<div @click="getBtnInfo($event)">批量审核</div>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-dropdown split-button type="primary" size="mini" @click="getBtnInfo($event)">
反审核
<el-dropdown-menu slot="dropdown">
<el-dropdown-item >
<div @click="getBtnInfo($event)">批量反审核</div>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-dropdown split-button type="primary" plain size="mini" @click="getBtnInfo($event)">
差异对帐
<el-dropdown-menu slot="dropdown">
<el-dropdown-item >
<div @click="getBtnInfo($event)">批量差异对帐</div>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-button size="mini" type="primary" @click="getBtnInfo($event)">新增</el-button>
<el-button size="mini" type="primary" @click="getBtnInfo($event)">接口获取</el-button>
<el-dropdown split-button type="primary" size="mini" @click="getBtnInfo($event)">
删除
<el-dropdown-menu slot="dropdown" >
<el-dropdown-item >
<div @click="getBtnInfo($event)">批量删除</div>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</template>
<script>
export default {
name: 'btnList',
data () {
return {}
},
methods:{
/*所有按钮共用一个点击事件*/
getBtnInfo(e){
let name = e.target.innerText;
this.message = name;
let boolean =
name === '导入' ||
name === '导出' ||
name === '接口获取' ||
name === '新增' ||
name === '批量审核' ||
name === '批量反审核' ||
name === '批量差异对帐' ||
name === '批量删除';
if(boolean){
switch (name) {
case '导入':
this.$router.push('/Upload');
break;
case '导出':
console.log('导出');
break;
case '接口获取':
console.log('接口获取');
break;
case '新增':
this.$router.push('/orderAdd');
break;
case '批量审核':
this.$store.dispatch('dialogFromAudit');
break;
case '批量反审核':
this.$store.dispatch('dialogFromUnAudit');
break;
case '批量差异对帐':
this.$store.dispatch('dialogFromDifferences');
break;
case '批量删除':
this.$store.dispatch('dialogFromDelete');
break;
}
}else{
if(this.handSelectDataList.length){
console.log(name,1);
switch (name) {
case '审核':
this.duff(this.handSelectDataList);
console.log('审核');
break;
case '反审核':
console.log('反审核');
break;
case '差异对帐':
console.log('差异对帐');
break;
case '删除':
console.log('删除');
break;
}
}else{
this.$message.error('请选择需要' + this.message + '的数据');
}
}
},
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/components/filterBox/batchAudit.vue
================================================
<template>
<div class="batch-audit">
<template>
<el-dialog title="批量审核" :close-on-click-modal="false" :append-to-body="true" :close-on-press-escape="false" :visible.sync="dialogFromAudit" :before-close="dialog_close">
<el-form :model="form">
<el-form-item label="单据类型" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsType" placeholder="请选择活动区域">
<el-option label="平台订单" value="shanghai"></el-option>
<el-option label="手工订单" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="业务日期" :label-width="formLabelWidth">
<div class="block">
<el-date-picker
size="small"
v-model="form.time"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</div>
</el-form-item>
<el-form-item label="平台" :label-width="formLabelWidth">
<el-select size="small" v-model="form.platform" placeholder="请选择活动区域">
<el-option label="微信" value="shanghai"></el-option>
<el-option label="支付宝" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="单据状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsState" placeholder="请选择活动区域">
<el-option label="审核" value="shanghai"></el-option>
<el-option label="保存" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="对账状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.checkState" placeholder="请选择活动区域">
<el-option label="未对账" value="shanghai"></el-option>
<el-option label="已对账" value="beijing"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="cancel">取 消</el-button>
<el-button size="mini" type="primary" @click="determine">确 定</el-button>
</div>
</el-dialog>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'batchAudit',
data () {
return {
form: {
documentsType: '',//单据类型
time: '',//时间
platform: '',//平台
documentsState: '',//单据状态
checkState: '', //对账状态
},
formLabelWidth: '120px',
}
},
computed:{
...mapState({
dialogFromAudit:state=>state.dialogFromAudit
})
},
methods:{
cancel(){ //取消
this.$store.dispatch('dialogFromAudit')
},
determine(){ //确定
console.log(this.form);
this.$store.dispatch('dialogFromAudit')
},
dialog_close() {
this.$store.dispatch('dialogFromAudit')
},
}
}
</script>
<style scoped>
.el-dialog .el-input{
max-width: 300px;
}
</style>
================================================
FILE: src/components/filterBox/batchDelete.vue
================================================
<template>
<div class="batch-delete">
<template>
<el-dialog title="批量删除" :close-on-click-modal="false" :append-to-body="true" :close-on-press-escape="false" :visible.sync="dialogFromDelete" :before-close="dialog_close">
<el-form :model="form">
<el-form-item label="单据类型" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsType" placeholder="请选择活动区域">
<el-option label="平台订单" value="shanghai"></el-option>
<el-option label="手工订单" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="业务日期" :label-width="formLabelWidth">
<div class="block">
<el-date-picker
size="small"
v-model="form.time"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</div>
</el-form-item>
<el-form-item label="平台" :label-width="formLabelWidth">
<el-select size="small" v-model="form.platform" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="单据状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsState" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="对账状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.checkState" placeholder="请选择活动区域">
<el-option label="保存" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="cancel">取 消</el-button>
<el-button size="mini" type="primary" @click="dialogFormVisible = false">确 定</el-button>
</div>
</el-dialog>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'batchDelete',
data () {
return {
form: {
documentsType: '',//单据类型
time: '',//时间
platform: '',//平台
documentsState: '',//单据状态
checkState: '', //对账状态
},
formLabelWidth: '120px'
}
},
computed: {
...mapState({
dialogFromDelete:state=>state.dialogFromDelete
})
},
methods: {
cancel(){
this.$store.dispatch('dialogFromDelete')
},
dialog_close(){
this.$store.dispatch('dialogFromDelete')
}
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/components/filterBox/batchDifferences.vue
================================================
<template>
<div class="batch-Differences">
<template>
<el-dialog title="批量差异对帐" :close-on-click-modal="false" :append-to-body="true" :close-on-press-escape="false" :visible.sync="dialogFromDifferences" :before-close="dialog_close">
<el-form :model="form">
<el-form-item label="单据类型" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsType" placeholder="请选择活动区域">
<el-option label="平台订单" value="shanghai"></el-option>
<el-option label="手工订单" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="业务日期" :label-width="formLabelWidth">
<div class="block">
<el-date-picker
size="small"
v-model="form.time"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</div>
</el-form-item>
<el-form-item label="平台" :label-width="formLabelWidth">
<el-select size="small" v-model="form.platform" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="单据状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsState" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="对账状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.checkState" placeholder="请选择活动区域">
<el-option label="保存" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="差异对帐原因" :label-width="formLabelWidth">
<el-input size="small" v-model="form.remarks" placeholder="请输入差异对帐原因"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="cancel">取 消</el-button>
<el-button size="mini" type="primary" @click="dialogFormVisible = false">确 定</el-button>
</div>
</el-dialog>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'batchDifferences',
data () {
return {
form: {
documentsType: '',//单据类型
time: '',//时间
platform: '',//平台
documentsState: '',//单据状态
checkState: '', //对账状态
remarks: '',//差异对帐原因
},
formLabelWidth: '120px'
}
},
computed:{
...mapState({
dialogFromDifferences:state=>state.dialogFromDifferences
})
},
methods:{
cancel(){
this.$store.dispatch('dialogFromDifferences')
},
dialog_close(){
this.$store.dispatch('dialogFromDifferences')
}
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/components/filterBox/batchStatement.vue
================================================
<template>
<div class="batch-statement">
<template>
<el-dialog title="条件查询" :close-on-click-modal="false" :append-to-body="true" :close-on-press-escape="false" :visible.sync="dialogFromStatement" :before-close="dialog_close" :modal-append-to-body="false">
<el-form :model="form">
<el-form-item label="业务日期" :label-width="formLabelWidth">
<div class="block">
<el-date-picker
size="small"
v-model="form.time"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</div>
</el-form-item>
<el-form-item label="单据状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsState" placeholder="请选择单据状态">
<el-option label="全部" value=""></el-option>
<el-option label="保存" value="Save"></el-option>
<el-option label="审核" value="Audited"></el-option>
</el-select>
</el-form-item>
<el-form-item label="对账状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.checkState" placeholder="请选择对账状态">
<el-option label="全部" value=""></el-option>
<el-option label="未对账" value="UnSettled"></el-option>
<el-option label="部份对账" value="Part"></el-option>
<el-option label="全部对账" value="Completely"></el-option>
</el-select>
</el-form-item>
<el-form-item label="是否差异处理" :label-width="formLabelWidth">
<el-select size="small" v-model="form.differenceStatus" placeholder="请选择是否差异处理">
<el-option label="全部" value=""></el-option>
<el-option label="是" value="Y"></el-option>
<el-option label="否" value="N"></el-option>
</el-select>
</el-form-item>
<el-form-item label="退款状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.refundStatus" placeholder="请选择退款状态">
<el-option label="全部" value=""></el-option>
<el-option label="未退款" value="UnSettled"></el-option>
<el-option label="部分退款" value="Part"></el-option>
<el-option label="全部退款" value="Completely"></el-option>
</el-select>
</el-form-item>
<el-form-item label="来源平台" :label-width="formLabelWidth">
<el-input size="mini" v-model="form.platform" placeholder="请输入内容"></el-input>
</el-form-item>
<el-form-item label="销售公司" :label-width="formLabelWidth">
<el-input size="mini" v-model="form.company" placeholder="请输入内容"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="mini" type="primary" @click="determine">确 定</el-button>
<el-button size="mini" @click="cancel">取 消</el-button>
</div>
</el-dialog>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'batchStatement',
data () {
return {
form: {
time: '',//时间
documentsState: '',//单据状态
checkState: '', //对账状态
differenceStatus: '',//差异处理状态
refundStatus: '',//退款状态
platform: '',//平台
company: '',//公司
},
formLabelWidth: '120px',
}
},
computed:{
...mapState({
dialogFromStatement:state=>state.dialogFromStatement
})
},
methods: {
cancel(){ //取消
this.$store.dispatch('dialogFromStatement')
},
determine(){ //确定
console.log(this.form);
},
dialog_close() {
this.$store.dispatch('dialogFromStatement')
},
}
}
</script>
<style scoped>
.el-dialog .el-input{
max-width: 300px;
}
</style>
================================================
FILE: src/components/filterBox/batchUnAudit.vue
================================================
<template>
<div class="batch-UnAudit">
<template>
<el-dialog title="批量反审核" :close-on-click-modal="false" :append-to-body="true" :close-on-press-escape="false" :visible.sync="dialogFromUnAudit" :before-close="dialog_close">
<el-form :model="form">
<el-form-item label="单据类型" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsType" placeholder="请选择活动区域">
<el-option label="平台订单" value="shanghai"></el-option>
<el-option label="手工订单" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="业务日期" :label-width="formLabelWidth">
<div class="block">
<el-date-picker
size="small"
v-model="form.time"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</div>
</el-form-item>
<el-form-item label="平台" :label-width="formLabelWidth">
<el-select size="small" v-model="form.platform" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="单据状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.documentsState" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="对账状态" :label-width="formLabelWidth">
<el-select size="small" v-model="form.checkState" placeholder="请选择活动区域">
<el-option label="保存" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="cancel">取 消</el-button>
<el-button size="mini" type="primary" @click="dialogFormVisible = false">确 定</el-button>
</div>
</el-dialog>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'batchUnAudit',
data () {
return {
form: {
documentsType: '',//单据类型
time: '',//时间
platform: '',//平台
documentsState: '',//单据状态
checkState: '',//对账状态
},
formLabelWidth: '120px'
}
},
computed:{
...mapState({
dialogFromUnAudit:state=>state.dialogFromUnAudit
})
},
methods:{
cancel() {
this.$store.dispatch('dialogFromUnAudit')
},
dialog_close() {
this.$store.dispatch('dialogFromUnAudit')
},
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/components/getWebSocket/getWebSocket.vue
================================================
<template>
<div class="batch-statement">
<template>
<el-dialog width="42%" style="min-height:100px;" title="提示" :close-on-click-modal="false" :show-close="false" :close-on-press-escape ="false" :visible.sync="dialoggetWebSocket" :before-close="dialog_close" :modal-append-to-body="false">
<div class="progressClass">
<el-progress :text-inside="true" status="socketStatus" :stroke-width="18" :percentage="socketSchedule"></el-progress>
</div>
<div style="margin-top:10px;height:15px;text-align:center">{{socketDatatext}}</div>
<div slot="footer" class="dialog-footer">
<el-button size="mini" type="primary" @click="determine" :disabled="guanbi">确 定</el-button>
</div>
</el-dialog>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
import api from '../../axios/url.js'
export default {
name: 'getWebSocket',
data () {
return {
socketDatatext:'', //文字
socketStatus:'', //状态
guanbi:false,
socketSchedule:70, //百分比
}
},
computed:{
...mapState({
dialoggetWebSocket:state=>state.dialoggetWebSocket
})
},
watch: {
$route(to, from) {
//由于路由的原因，现在还有一种websocket可能失效，从对账记录到订单列表：to orderReceivable from verifyReceivablesRecord
console.log(to);
//到订单查询，除了自动对账界面和对账记录界面
if(to.fullPath =='/orderReceivable'){
if(from.fullPath !='/verifyAutomate'&&from.fullPath !='/verifyReceivablesRecord'){
this.websockets();
}
}
//到对账记录界面 来自订单查询
if(to.fullPath =='/verifyReceivablesRecord'){
if(from.fullPath =='/orderReceivable'){
this.close();
}
}
//到自动对账，来自交易流水
if(to.fullPath =='/verifyAutomate'){
if(from.fullPath =='/transactionFlow'){
this.close();
}
this.websockets();
}
//来自订单上传
if(from.fullPath =='/orderUpload'){
this.close();
}
//来自自动对账，到交易流水
if(from.fullPath =='/verifyAutomate'){
if(to.fullPath =='/transactionFlow'){
this.close();
}
}
}
},
created: function(){
this.websockets();
},
methods: {
websockets() {
var socket=localStorage.getItem("socket");
var that = this;
let websocket=new WebSocket(api.ws+ "/ws");
if(socket!="open"){
websocket.onopen = function(evnt) {
console.log("open websocket");
localStorage.setItem("socket","open");
websocket.send('Holle');
};
}
//发送消息
websocket.onmessage = function(event) {
var data = JSON.parse(event.data);
if(JSON.parse(event.data)!={}&&JSON.parse(event.data)!=''&&JSON.parse(event.data)!='undefined '){
that.socketSchedule = parseFloat(JSON.parse(event.data).process);
}
that.socketStatus = JSON.parse(event.data).status;
that.socketDatatext = JSON.parse(event.data).text;
if (JSON.parse(event.data).status === 'Ongoing') {
that.guanbi = true;
} else {
that.guanbi = false;
}
}
websocket.onclose = function(evnt) {
localStorage.setItem("socket","close");
console.log(" clsoe websocket");
};
//路由切换
this.$router.afterEach(function () {
localStorage.setItem("socket","close");
websocket.close();
})
this.close=function(){
localStorage.setItem("socket","close");
websocket.close();
}
},
shutDown(){
},
cancel(){ //取消
this.$store.dispatch('dialoggetWebSocket')
},
determine(){ //确定
this.$store.dispatch('dialoggetWebSocket')
this.$emit('socketStatus',this.guanbi)
//清空
this.socketDatatext =''; //文字
this.socketStatus =''; //状态
this.guanbi = false;
this.socketSchedule =0;
// location.reload();
},
dialog_close() {
this.$store.dispatch('dialoggetWebSocket')
},
getCookie(name){
name = name + "="
var start = document.cookie.indexOf(name),
value = null;
if(start>-1){
var end = document.cookie.indexOf(";",start);
if(end == -1){
end = document.cookie.length;
}
value = document.cookie.substring(start+name.length,end);
}
return value;
}
}
}
</script>
<style scoped>
.el-dialog .el-input{
max-width: 300px;
}
.progressClass{
margin: auto 40px;
}
</style>
================================================
FILE: src/components/head/head.vue
================================================
<template>
<header class="head">
<!-- 折叠按钮 -->
<div class="collapse-btn" @click="getCollapse">
<i class="el-icon-menu"></i>
</div>
<div class="logo">{{$t('h.system')}}</div>
<div class="company">
<template >
<el-select v-model="companyValue" placeholder="请选择" size="small" @change="getCompanyValue(companyValue)">
<el-option
v-for="(item,index) in companyList"
:key="index"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</template>
</div>
<div class="top-nav">
<!--全屏显示-->
<template>
<el-tooltip class="full" effect="dark" :content="$t('h.full')" placement="bottom">
<div>
<i class="el-icon-rank"></i>
</div>
</el-tooltip>
</template>
<!--消息中心-->
<template>
<el-tooltip class="news" effect="dark" :content="message?`有${message}条未读消息`:`消息中心`" placement="bottom">
<div>
<i class="el-icon-bell"></i>
<span class="msg" v-if="message"></span>
</div>
</el-tooltip>
</template>
<!--退出or设置-->
<template>
<el-dropdown placement="bottom">
<span class="el-dropdown-link">
<i class="el-icon-setting el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>关于我</el-dropdown-item>
<el-dropdown-item>设置</el-dropdown-item>
<el-dropdown-item>退出</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
<template>
<div class="full" @click="changeLangEvent()">
<span class="lan">{{language}}</span>
</div>
</template>
</div>
</header>
</template>
<script>
import {mapState,mapActions} from 'vuex';
import {getCompany} from '../../axios/api'
export default {
name: 'Head',
data () {
return {
message:1,//消息
// companyValue:null,
companyList:[
{
value: '选项1',
label:'公司一',
},
{
value: '选项2',
label:'公司二',
}
],
language: localStorage.getItem("lang") || "EN"
}
},
mounted(){
},
computed: {
...mapState({
companyValue:state=>state.companyValue,
}),
},
methods:{
...mapActions(["getCollapse", "getCompanyValue"]),//简写
changeLangEvent() {
console.log(this.$i18n);
console.log(1111);
// this.baseLan()
if (this.language == "EN") {
localStorage.setItem("locale", "zh");
this.$i18n.locale = localStorage.getItem("locale");
this.$message({
message: "切换为中文！",
type: "success"
});
localStorage.setItem("lang", "ZH");
this.language = "ZH";
location.reload();
} else if (this.language == "ZH") {
localStorage.setItem("locale", "en");
this.$i18n.locale = localStorage.getItem("locale");
this.$message({
message: "Switch to English!",
type: "success"
});
localStorage.setItem("lang", "EN");
this.language = "EN";
location.reload();
}
}
}
}
</script>
<style scoped>
.lan {
display: inline-block;
cursor: pointer;
width: 22px;
height: 22px;
font-size: 12px;
line-height: 22px;
text-align: center;
background: #fff;
border-radius: 50%;
color: #24292e;
}
</style>
================================================
FILE: src/components/search/Search.vue
================================================
<template>
<div class="search">
<div>
<!-- 单一查询 -->
<div style="float: left;padding:10px;z-index:33;">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__header" style="width:450px;float: left;">
<tbody class="el-table--scrollable-y" id="test">
<tr class="el-table__row" v-for="(list,index) in reconDanyiIquireList" :key="index">
<td width="80">
<div>
<template>
<el-select v-model="list.selected" @change='getMore(index)' filterable size="mini" placeholder="请选择">
<el-option
v-for="item in optionData"
:label="item.name"
:value="item.name"
:key="item.name">
</el-option>
</el-select>
</template>
</div>
</td>
<td width="80">
<div style="margin-left:4px;">
<template>
<el-select v-model="list.comparing" @change="comparval" filterable size="mini" placeholder="请选择">
<el-option
v-for="item in compareJsonlist"
:key="item.name"
:label="item.name"
:value="item.name">
</el-option>
</el-select>
</template>
</div>
</td>
<td width="80">
<div style="margin-left:4px;">
<template>
<el-select v-show="list.logsSelect" v-model="list.valSelect" filterable size="mini" placeholder="请选择">
<el-option
v-for="item in ValData"
:label="item.name"
:value="item.name"
:key="item.name">
</el-option>
</el-select>
<el-select v-show="list.pyType" v-model="list.platId"
filterable size="mini" placeholder="请选择">
<el-option
v-for="item in platData"
:label="item.name"
:value="item.id"
:key="item.id">
</el-option>
</el-select>
</template>
<template>
<el-date-picker
style="width:150px;"
size="mini"
v-show="list.logsDate"
:disabled="disdate"
v-model="list.valDate"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择日期">
</el-date-picker>
</template>
</div>
<el-input v-model="list.valText" v-show="list.logsText" size="mini" placeholder="请输入"></el-input>
</td>
</tr>
</tbody>
</table>
<el-button type="primary" style="margin-left:5px;" @click="singleInCon" size="mini">查询</el-button>
</div>
<el-button type="text" @click="openfilter"><i class="el-icon-search"></i>高级搜索</el-button>
<div class="search-body">
<template>
<el-dialog width="69%" title="高级搜索" :modal-append-to-body="false" :close-on-click-modal="false" :visible.sync="dialogFormVisible">
<!--</el-form-item>-->
<div class="search-contain">
<div class="left-search-body">
<template>
<el-row>
<el-button size="small" @click="savelist">保存</el-button>
<el-button size="small" @click="asSave" >另存</el-button>
<el-button size="small" @click="rename($event)">重命名</el-button>
<el-button size="small" @click="deleteKis">删除</el-button>
</el-row>
</template>
<div class="guolvList">
<ul>
<li v-for="(item,index) in Listdata" :class="{active1:index == num}" :key="index" @click="tabName(item,index)">
{{item.schemenaem}}
</li>
</ul>
</div>
</div>
<div class="right-search-body">
<template>
<el-row>
<el-button size="small" type="primary" @click="addTr">新增行</el-button>
<el-button size="small" type="success" @click="deleteTr">删除行</el-button>
<el-button size="small" type="danger" @click="AlldeleteTr">全部删除</el-button>
<el-button size="small" type="warning" @click="insertTr">插入行</el-button>
</el-row>
<div class="el-table el-table--fit el-table--border el-table--scrollable-x el-table--scrollable-y el-table--enable-row-hover el-table--enable-row-transition" style="width: 100%; height: 280px;">
<div class="el-table__header-wrapper">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__header" style="width:100%;">
<thead class="has-gutter">
<tr class="">
<th colspan="1" rowspan="1" width="140">
<div class="cell">
字段
</div>
</th>
<th colspan="1" rowspan="1" width="140">
<div class="cell">
比较
</div>
</th>
<th colspan="1" rowspan="1" width="140">
<div class="cell">
值
</div>
</th>
<th colspan="1" rowspan="1" width="140">
<div class="cell">
逻辑
</div>
</th>
</tr>
</thead>
<tbody class="el-table--scrollable-y" id="test">
<tr class="el-table__row" v-for="(list,index) in reconciliationPlanInfoList" :key="index">
<td width="140">
<div>
<template>
<el-select v-model="list.selected" @change='getValue(index)' filterable size="mini" placeholder="请选择">
<el-option
v-for="item in optionData"
:label="item.name"
:value="item.name"
:key="item.name">
</el-option>
</el-select>
</template>
</div>
</td>
<td width="140">
<div>
<template>
<el-select v-model="list.comparing" @change="comparval" filterable size="mini" placeholder="请选择">
<el-option
v-for="item in compareJsonlist"
:key="item.name"
:label="item.name"
:value="item.name">
</el-option>
</el-select>
</template>
</div>
</td>
<td width="140">
<div>
<template>
<el-select v-show="list.logsSelect" v-model="list.valSelect" filterable size="mini" placeholder="请选择">
<el-option
v-for="item in ValData"
:label="item.name"
:value="item.name"
:key="item.name">
</el-option>
</el-select>
<el-select v-show="list.pyType" v-model="list.platId" filterable size="mini" placeholder="请选择">
<el-option
v-for="item in platData"
:label="item.name"
:value="item.id"
:key="item.id">
</el-option>
</el-select>
</template>
<template>
<el-date-picker
size="mini"
v-show="list.logsDate"
:disabled="disdate"
v-model="list.valDate"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择日期">
</el-date-picker>
</template>
<el-input v-model="list.valText" v-show="list.logsText" size="mini" placeholder="请输入"></el-input>
</div>
</td>
<td width="140">
<div>
<template>
<el-select v-model="list.logic" filterable size="mini" placeholder="请选择">
<el-option
v-for="item in logsgetData"
:label="item.text"
:key="item.text"
:value="item.text">
</el-option>
</el-select>
</template>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div>
<div style="line-height:25px;height:30px;margin:10px auto;">
<div class="statusBottom">
<label class=" col-md-4">对账状态:</label>
<div class="col-md-8">
<template>
<el-select v-model="reconModel" filterable size="mini"
placeholder="请选择">
<el-option
v-for="item in reconData"
:label="item.name"
:value="item.value"
:key="item.value">
</el-option>
</el-select>
</template>
</div>
</div>
<div class="statusBottom">
<label class=" col-md-4">单据状态:</label>
<div class="col-md-8">
<template>
<el-select v-model="statusinqu" filterable size="mini"
placeholder="请选择">
<el-option
v-for="item in statusData"
:label="item.name"
:value="item.value"
:key="item.value">
</el-option>
</el-select>
</template>
</div>
</div>
</div>
<div style="line-height:25px;height:30px;margin:10px auto;">
<div class="statusBottom">
<label class=" col-md-4">退款状态:</label>
<div class="col-md-8">
<template>
<el-select v-model="refuncomm" filterable size="mini" placeholder="请选择">
<el-option
v-for="item in refundData"
:label="item.name"
:value="item.value"
:key="item.value">
</el-option>
</el-select>
</template>
</div>
</div>
<div class="statusBottom">
<label class=" col-md-4">差异状态:</label>
<div class="col-md-8">
<template>
<el-select v-model="chayiD" filterable size="mini" placeholder="请选择">
<el-option
v-for="item in chayiData"
:label="item.name"
:value="item.value"
:key="item.value">
</el-option>
</el-select>
</template>
</div>
</div>
</div>
</div>
</template>
</div>
</div>
<div slot="footer" class="dialog-footer">
<div style="float: left;">
<template>
<el-checkbox v-model="defaultScheme" v-show="moren" @change="checkClick">默认方案</el-checkbox>
</template>
</div>
<el-button size="small" @click="queryCancel">取 消</el-button>
<el-button type="primary" size="small" @click="determine">确 定</el-button>
</div>
</el-dialog>
<!-- <el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button> -->
<el-dialog
title="保存方案"
:visible.sync="dialogSave"
width="30%">
<div style="margin:0 18%;">
<label>输入方案名:</label>
<el-input size="mini" v-model="savename" @change="projectName($event)"></el-input>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="saveCacel">取 消</el-button>
<el-button type="primary" @click="saveQu">确 定</el-button>
</span>
</el-dialog>
</template>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data () {
return {
dialogSave:false,//方案模态
dialogFormVisible: false,//高级查询模态
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
},
formLabelWidth: '120px',
//高级查询
reconciliationPlanInfoList: [{
'selected': '',
'comparing': '',
'logic': '',
logsSelect: false, // 值下拉
logsText: true, //值输入
logsDate: false, //日期
pyType: false,
'valDate': '',
'valSelect': '',
'valText': '',
'platId': '', //活的
advancedName: '',
queryType: '',
'reconStatus': '',
'invoiceStatus': '',
'differenseStatus': '',
'refundStatus': '',
'saveName': '',
'mark': '',
'uuid': '',
'pageNumber': 1, //第几页
'pageSize': 100, //每页展示数
'selectPageNumber': ''
}],
//单一
reconDanyiIquireList: [{
'selected': '',
'comparing': '',
'logic': '',
logsSelect: false, // 值下拉
logsText: true, //值输入
logsDate: false, //日期
pyType: false,
'valDate': '',
'valSelect': '',
'valText': '',
'platId': '', //活的
advancedName: '',
queryType: '',
'reconStatus': '',
'invoiceStatus': '',
'differenseStatus': '',
'refundStatus': '',
'saveName': '',
'mark': '6',
'uuid': '',
'pageNumber': 1, //第几页
'pageSize': 100, //每页展示数
'selectPageNumber': ''
}],
logsgetData: [{
text: '并且'
}, {
text: '或者'
}],
//重写model
chayiD: '',
refuncomm: '',
statusinqu: '',
reconModel: '',
chayiData: [{
value: '',
name: '全部'
},
{
value: 'Y',
name: '是'
},
{
value: 'N',
name: '否'
},
],
refundData: [{
value: '',
name: '全部'
},
{
value: 'UnRefund',
name: '未退款'
},
{
value: 'PartRefund',
name: '部分退款'
},
{
value: 'CompleteRefund',
name: '完全退款'
},
{
value: 'RefundException',
name: '退款异常'
},
],
statusData: [{
value: '',
name: '全部'
},
{
value: 'Save',
name: '保存'
},
{
value: 'Audited',
name: '审核'
},
{
value: 'HandClose',
name: '手工关闭'
},
{
value: 'AtuoClose',
name: '自动关闭'
},
],
reconData: [{
value: '',
name: '全部'
},
{
value: 'UnSettled',
name: '未对账'
},
{
value: 'Part',
name: '部分对账'
},
{
value: 'Completely',
name: '完全对账'
},
{
value: 'Exception',
name: '异常'
},
],
selected: '',
optionData:[],//一级data
compareJsonlist: [], //二级
ValData: [], //三级
platData:[], //四级
startText: '',
saveTitle: false, //模态
saveTitle1: false, //模态
pagination: true, //分页
paginations: false, //高级分页
savename: '', //保存的名字
disdate: false,
Listdata: [], //保存列表
num: -1,
proname: '', //方案名
renId: '', //方案uuid
userId: '', //方案userid
renamedele: '',
idenName:'', //重命名标识
savename1: '',
defaultScheme: false, //默认方案
indexme: '', //这是查询列表index
indexnum:null, //接口index
moren:true, //默认方案显示隐藏
}
},
methods:{
//模态框
openfilter(){
this.dialogFormVisible = true;
},
//select change 获取二级列表
getMore(index){
},
//高级查询一级
getValue(){
},
//获取三级列表
comparval(){
},
//高级查询取消
queryCancel(){
this.dialogFormVisible = false;
},
//高级查询确定
determine(){
if (this.reconciliationPlanInfoList.length == 0) {
this.addRow();
}
this.reconciliationPlanInfoList[0].differenseStatus = this.chayiD;
this.reconciliationPlanInfoList[0].reconStatus = this.reconModel;
this.reconciliationPlanInfoList[0].refundStatus = this.refuncomm;
this.reconciliationPlanInfoList[0].invoiceStatus = this.statusinqu;
var data = this.reconciliationPlanInfoList;
//组件通讯
this.$emit('orderSearchs', data); //单据 --- 订单
this.dialogFormVisible = false;
},
//方案名
projectName(){
},
//默认方案
checkClick(){
},
//方案取消
saveCacel(){
},
//方案确定
saveQu(){
},
//单一查询确认
singleInCon(){
},
//LEFT 方案list
//保存方案
savelist(){
},
//另存
asSave(){
},
//重命名
rename(){
},
//删除
deleteKis(){
},
//RIGHT 增删改查
//新增
addTr(){
var newIndex = this.reconciliationPlanInfoList.length;
var tr = {
index: newIndex,
'selected': '',
'comparing': '',
'logic': '',
logsSelect: false, // 值下拉
logsText: true, //值输入
logsDate: false, //日期
pyType: false,
'valDate': '',
'valSelect': '',
'valText': '',
'platId': '', //活的
advancedName: '',
queryType: '',
'saveName': '',
'mark': '',
'pageNumber': 1, //第几页
'pageSize': 100, //每页展示数
};
this.reconciliationPlanInfoList.push(tr);
},
//删除
deleteTr(){
this.reconciliationPlanInfoList.splice(index, 1);
},
//全部删除
AlldeleteTr(){
this.reconciliationPlanInfoList.splice(index);
},
//插入
insertTr(){
var tr = {
'selected': '',
'comparing': '',
'valDate': '',
'valSelect': '',
'valText': '',
'platId': '', //活的
logsSelect: false, // 值下拉
logsText: true, //值输入
logsDate: false,
pyType: false,
'logic': '',
advancedName: '',
queryType: '',
'saveName': '',
'mark': '',
'pageNumber': 1, //第几页
'pageSize': 100, //每页展示数
};
this.reconciliationPlanInfoList.push(tr);
},
//当全部删除行的时候
addRow: function() {
this.reconciliationPlanInfoList = [{
'selected': '',
'comparing': '',
'logic': '',
logsSelect: false, // 值下拉
logsText: true, //值输入
logsDate: false, //日期
pyType: false,
'valDate': '',
'valSelect': '',
'valText': '',
'platId': '', //活的
advancedName: '',
queryType: '',
'reconStatus': '',
'invoiceStatus': '',
'differenseStatus': '',
'refundStatus': '',
'saveName': '',
'mark': '',
'uuid': ''
}]
},
}
}
</script>
<style scoped>
.el-dialog__body{
padding: 10px;
}
.el-dialog .el-input{
width: 100%!important;
}
.statusBottom{
width: 50%;
float: left;
}
.col-md-4{
width: 33.333%;
float: left;
}
.col-md-8{
width: 66.66%;
float: left;
}
.guolvList {
clear: both;
}
.guolvList ul {
padding: 0;
}
.guolvList ul li {
padding-left: 20px;
cursor: pointer;
height: 30px;
line-height: 30px;
list-style: none;
}
.active1 {
background: #f5f5f5;
color: #2EAEF0;
}
.el-dialog__footer{
padding: 10px 20px;
}
</style>
================================================
FILE: src/components/sidebar/sidebar.vue
================================================
<template>
<div id="sidebar-left">
<el-menu
:collapse="collapse"
class="el-menu-vertical-demo"
background-color="#24292e"
text-color="#fff"
active-text-color="#fff"
unique-opened router>
<template v-for="(item) in sidebarInfo">
<el-submenu :index="item.index" :key="item.index" v-if="item.subNav">
<template slot="title">
<i :class="item.icon"></i>
<span>{{item.title}}</span>
</template>
<el-menu-item-group>
<!--<template slot="title">分组一</template>-->
<el-menu-item :index="list.index" v-for="(list) in item.subNav" :key="list.index">{{list.title}}</el-menu-item>
</el-menu-item-group>
</el-submenu>
<el-menu-item :index="item.index" :key="item.index" v-else>
<template>
<i :class="item.icon"></i>
<span slot="title">{{item.title}}</span>
</template>
</el-menu-item>
</template>
</el-menu>
</div>
</template>
<script>
import {mapState,mapActions} from 'vuex'
export default {
name: 'sidebar',
data () {
return {
indexPath:[],//保存点击过的页面路由信息
sidebarInfo:[//左侧导航条信息
{
icon: 'el-icon-setting',
index: 'chart',
title: this.$t('h.account')
},
/**
* inquiry 原始单据
* **/
{
icon: 'el-icon-tickets',
index:'1',
title: this.$t('h.invoice'),
subNav:[
{
index:'/orderReceivable',
title:'应收单据'
},
{
index:'/transactionFlow',
title:'交易流水'
},
{
index:'/systemStatement',
title:'系统对账单'
},
{
index:'/bankFlow',
title:'银行流水'
}
]
},
/**
* verifyPlatform 对账平台
* **/
{
icon: 'el-icon-date',
index:'2',
title: this.$t('h.reconciliation'),
subNav:[
{
index: '/verifyReceivables',
title: '收款对账'
},
{
index: '/verifyAutomate',
title: '自动对账'
},
{
index:'/verifyBankStatement',
title:'银行对账'
}
]
},
/**
* verifyRecord 对账记录
* **/
{
icon: 'el-icon-goods',
title: this.$t('h.record'),
index:'3',
subNav:[
{
index:'/verifyReceivablesRecord',
title:'收款记录'
},
{
index:'/verifyBankStatementRecord',
title:'银行记录'
}
]
},
/**
* reportForms报表
* **/
{
icon: 'el-icon-star-off',
title: this.$t('h.report'),
index:'4',
subNav:[
{
index:'/OrderSummary',
title:'订单执行总表'
},
{
index:'/ReceivablesBalance',
title:'收款对账余额表'
}
]
},
{
icon: 'el-icon-more',
title: this.$t('h.setting'),
index:'5',
subNav:[
{
index:'/Structure',
title:'平台管理'
},
{
index:'/UpdatePWD',
title:'修改密码'
}
]
},
]
}
},
computed:{
...mapState({
collapse:state=>state.collapse
}),
},
methods:{
},
}
</script>
<style scoped>
</style>
================================================
FILE: src/components/tabs/Tabs.vue
================================================
<template>
<div class="tabs">
<template>
<el-tabs v-model="verifyStatus" @tab-click="handleClick">
<el-tab-pane v-for="(item,index) in tabs" :label="item.label" :name="item.name" :key="index"></el-tab-pane>
</el-tabs>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
data () {
return {
tabs:[
{label:'全部', name:'Whole'},
{label:'已对账', name:'Completely'},
{label:'部份对账', name:'Part'},
{label:'未对账', name:'UnSettled'}
]
}
},
watch: {
$route(newValue){
if(newValue){
this.$store.dispatch('getVerifyStatus','Whole');
}
}
},
computed: {
verifyStatus:{
get: function(){
return this.$store.state.verifyStatus
},
set: function(){
}
}
},
methods: {
handleClick(tab) {
this.$store.dispatch('getVerifyStatus',tab.name);
}
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/components/tags/tags.vue
================================================
<template>
<div class="tags" v-if="isShowTags">
<div class="tag-box">
<ul>
<li v-for="(item,index) in indexPath" :class="{'active':item.name === activeValue}" :key="index">
<router-link class="tab-item" :class="{active:activeValue===index}" :to="{path:item.path}" >
<span>{{item.name}}</span>
</router-link>
<span class="tag_delete" @click="closeTag(index)"><i class="el-icon-close"></i></span>
</li>
</ul>
</div>
<div class="tag-close-box">
<el-dropdown @command="handleCommand">
<span class="el-dropdown-link">
标签设置<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="a">关闭其它</el-dropdown-item>
<el-dropdown-item command="b">关闭所有</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
data () {
return {
activeValue: '',//当前选中的路由名称
indexPath: [],//将点击过的路由信息添加进来
isShowTags: true, //标签设置 关闭所有隐藏
}
},
created(){
this.setTags(this.$route);//获取页面的路由信息
},
watch: {
$route(newValue){ //监听路由的变化获取最新的路由信息
this.setTags(newValue);
}
},
methods:{
setTags(route){ //判断刚刚点击的路由是否存在，如果不存在保存
this.activeValue = route.meta.title;
const isExist = this.indexPath.some(item=>{
return item.path === route.path
});
!isExist && this.indexPath.unshift({
name:route.meta.title,
path:route.path
});
console.log(this.indexPath.length);
if(this.indexPath.length > 8){
this.indexPath.splice(this.indexPath.length-1,1)
}
},
closeTag(index){
//删除当前点击的tag
const closePath = this.indexPath.splice(index,1)[0];
//获取删除后当前下标的tag(如果当前下标有选择当前否则选前一个)
const item = this.indexPath[index]?this.indexPath[index]:this.indexPath[index-1];
if(item){//存在执行
//如果删除的的元素path等于当前路由path 执行改变路由
closePath.path === this.$route.path && this.$router.push(item.path);
}else{//不存在跳转到我的账户
this.$router.push('/chart');
}
},
handleCommand(command) {
console.log(command);
command === 'a' ? this.indexPath = [{name:this.$route.meta.title,path:this.$route.path}] : this.indexPath =[];
if(!this.indexPath.length){
this.isShowTags = false;
}
}
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/components/template/hzlDialog.vue
================================================
<template>
<div>
<el-dialog
:title="title"
:visible.sync="dialog"
:width="width"
@close="$emit('update:show', false)"
:show="show">
<span>这是一段信息</span>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="dialog = false">取 消</el-button>
<el-button type="primary" @click="dialog = false">确 定</el-button> -->
</span>
</el-dialog>
</div>
</template>
<script>
export default {
name: "hzl-dialog",
props: {
title: {
type: [String],
default: "提示"
},
width: {
type:[String],
default: "40%"
},
show: {
type: Boolean,
default: false
}
},
data() {
return {
dialog: this.show
}
},
watch: {
show() {
this.dialog = this.show;
}
},
methods: {
},
mounted() {
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/components/template/hzlInput.vue
================================================
<template>
<div>
<el-input :type="type" :size="size" v-model="inputValue" :placeholder="placeholder" @change="inputChange"></el-input>
</div>
</template>
<script>
export default {
name: 'hzl-input',
// value type size placeholder
// props: ['value','type','size','placeholder'],
props:{
type: {
type: String,
default: 'text'
},
inputValue:{
type: String,
default: ''
},
size: {
type: String,
default: "small"
},
placeholder: {
type: String,
default: '请输入...'
}
},
data() {
return {
}
},
watch: {
},
mounted() {
},
methods: {
inputChange() {
this.$emit("change",this.inputValue)
}
}
}
</script>
<style>
</style>
================================================
FILE: src/components/template/hzlPage.vue
================================================
<template>
<div class="right">
<el-pagination
@size-change="sizeChange"
@current-change="currentChange"
:current-page="currentPage"
:page-sizes="[20, 50, 80, 120]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>
</template>
<script>
export default {
data() {
return {
}
},
props: {
currentPage: {
type: [String,Number],
default: 1
},
pageSize: {
type: [String, Number],
default: 20
},
total: {
type: [String , Number],
default: 50
}
},
methods: {
sizeChange(val) {
console.log(`每页 ${val} 条`);
},
currentChange(val) {
console.log(`当前页: ${val}`);
}
}
}
</script>
<style>
.right {
text-align: right;
}
</style>
================================================
FILE: src/components/template/hzlSelect.vue
================================================
<template>
<div>
<el-select v-model="select" :placeholder="placeholder" :size="size" @change="hanleChange">
<el-option
v-for="item in list"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</template>
<script>
export default {
name: "hzl-select",
props: {
value: {
type: String,
default: []
},
placeholder: {
type: String,
default: '请选择...'
},
size: {
type: String,
default: 'small'
},
list: {
type: Array,
default: []
}
},
data() {
return {
select: ""
}
},
methods: {
hanleChange() {
this.$emit('input', this.select)
}
}
}
</script>
<style>
</style>
================================================
FILE: src/components/template/hzlTable.vue
================================================
<template>
<div>
<el-table
border
:data="DataList"
highlight-current-row
:height="height"
@row-click="handleSelectedRow"
@selection-change="handleSelectionChange">
<el-table-column
v-for="item in cols"
:key="item.prop"
:label="item.label"
:prop="item.prop"
:width="item.width"
:type="item.type"
>
<!-- :formatter="formatter" -->
<!-- formatter的用法：需要在每个col里添加formatter,push方法进去 对数据进行格式化 -->
</el-table-column>
</el-table>
</div>
</template>
<script>
import moment from 'moment'
export default {
props: {
DataList: {
type: Array,
default() {
return []
}
},
cols: {
type: Array,
default() {
return []
}
},
height: {
type: [Array,Number],
default: '410'
}
},
data() {
return {
}
},
mounted() {
},
watch: {
},
methods: {
handleSelectedRow() {
},
handleSelectionChange() {
},
// formatter(row) {
// console.log(row);
// }
}
}
</script>
<style>
</style>
================================================
FILE: src/components/template/index.js
================================================
import Vue from 'vue'
import hzlInput from './hzlInput.vue'
import hzlSelect from './hzlSelect.vue'
import hzlPage from './hzlPage.vue'
import hzlTable from './hzlTable.vue'
import hzlDialog from './hzlDialog.vue'
Vue.component('hzl-input',hzlInput);
Vue.component('hzl-select',hzlSelect);
Vue.component('hzl-page',hzlPage);
Vue.component('hzl-table',hzlTable);
Vue.component('hzl-dialog',hzlDialog);
================================================
FILE: src/components/templateOne.vue
================================================
<template>
<footer class="templateOne">
<ul>
<li v-for="lis in ul" :key="lis.index">{{lis.li}}</li>
</ul>
<p>
Copyright © {{author}} - 2016 All rights reserved
</p>
</footer>
</template>
<script>
export default {
name: 'templateOne',
data () {
return {
ul: [
{ li: '琉璃之金' },
{ li: '朦胧之森' },
{ li: '缥缈之滔' },
{ li: '逍遥之火' },
{ li: '璀璨之沙' }
]
}
},
mounted(){
},
methods:{
},
computed: {
author () {
return this.$store.state.dialog.author
}
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/i18n/index.js
================================================
import Vue from "vue";
import VueI18n from "vue-i18n";
Vue.use(VueI18n); // 全局挂载
export const i18n = new VueI18n({
locale: localStorage.getItem("locale") || "en", // 从localStorage中获取 默认英文
messages: {
zh: require("./lan/zh"), // 中文语言包
en: require("./lan/en") // 英文语言包
}
});
export default i18n;
================================================
FILE: src/i18n/lan/en.js
================================================
export const h = {
system: "Background management system",
full: "full-screen display",
account: "myAccount",
invoice: "invoice",
reconciliation: "Statement",
record: "recording",
report: "report",
setting: "Settings",
login: "login",
tips: "Username and password are filled in casually",
administrator: "administrator",
placeUser: "please enter user name",
palcePass: "Please enter your password",
palceCode: "please enter verification code",
accounts: "accounts",
password: "password",
code: "Verification code"
}
================================================
FILE: src/i18n/lan/zh.js
================================================
export const h = {
system: "Vue后台管理系统",
full: "全屏显示",
account: "我的账户",
invoice: "原始单据",
reconciliation: "财务对账",
record: "对账记录",
report: "月结报表",
setting: "系统设置",
login: "登录",
tips: "用户名和密码随便填",
administrator: "管理员",
placeUser: "请输入用户名",
palcePass: "请输入密码",
palceCode: "请输入验证码",
accounts: "账号",
password: "密码",
code: "验证码"
}
================================================
FILE: src/main.js
================================================
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
/**
* Created by 不动的推动者 on 2018/5/2.
*/
//
import Vue from 'vue'
import App from './App'
import router from './router'
import store from './store/index'
import 'normalize.css'
import Axios from 'axios'
import Elementui from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import moment from 'moment'
import echarts from 'echarts'
import './components/template/index'
import { i18n } from './i18n/index' //国际化
Vue.use(Elementui);
Vue.use(moment);
Vue.config.productionTip = false;
Vue.prototype.$http = Axios;
Vue.prototype.$echarts = echarts
import NProgress from 'nprogress' // Progress 进度条
import 'nprogress/nprogress.css'// Progress 进度条样式
router.beforeEach((to, from, next) => {
NProgress.start()
const user = localStorage.getItem('lz_userName');
const pass = localStorage.getItem('lz_passNumber');
if (!user && !pass && to.path !== '/login') { // 检查路径用户是否即将进入我们的 chart 路径
next('/login');
}else{
localStorage.setItem('lz_userName', user);
localStorage.setItem('lz_passNumber', pass);
next()
}
})
router.afterEach(() => {
NProgress.done() // 结束Progress
})
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
store,//使用store
i18n, //使用国际化
components: { App },
template: '<App/>'
})
================================================
FILE: src/page/chart/chart.vue
================================================
<template>
<div>
<template>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="用户管理" name="first">
<div class="chart">
<div ref="myChart" :style="{width: '100%', height: '300px'}"></div>
</div>
</el-tab-pane>
<el-tab-pane label="配置管理" name="second">
<!-- <div class="chart">
<div ref="myChart" :style="{width: '100%', height: '300px'}"></div>
</div> -->
</el-tab-pane>
<el-tab-pane label="角色管理" name="third">
<!-- <div class="chart">
<div ref="myChart" :style="{width: '100%', height: '300px'}"></div>
</div> -->
</el-tab-pane>
</el-tabs>
</template>
</div>
</template>
<script>
// 引入基本模板
let echarts = require('echarts/lib/echarts')
// 引入柱状图组件
require('echarts/lib/chart/bar')
// 引入提示框和title组件
require('echarts/lib/component/tooltip')
require('echarts/lib/component/title')
export default {
name: 'chart',
data () {
return {
activeName: 'first'
}
},
mounted(){
this.drawLine();
},
components:{
},
methods:{
handleClick(tab, event) {
console.log(tab, event);
},
drawLine(){
// 基于准备好的dom，初始化echarts实例
let myChart = this.$echarts.init(this.$refs.myChart);
// 绘制图表
myChart.setOption({
title: { text: '在Vue中使用echarts' },
tooltip: {},
xAxis: {
data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
},
yAxis: {},
series: [{
name: '销量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}]
});
}
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/page/home/home.vue
================================================
<template>
<div id="Home">
<head-top></head-top>
<div class="wrapper">
<sidebar></sidebar>
<div class="main" :class="{'content-collapse':collapse}">
<tags></tags>
<div class="container">
<!--<tabs></tabs>-->
<transition name="move" mode="out-in">
<keep-alive>
<router-view></router-view>
</keep-alive>
</transition>
</div>
</div>
</div>
</div>
<!-- </div> -->
</template>
<script>
import {mapState} from 'vuex'
import headTop from '../../components/head/head'
import sidebar from '../../components/sidebar/sidebar'
import tags from '../../components/tags/tags'
export default {
name: 'Home',
components:{
headTop,
sidebar,
tags,
},
data () {
return {
aa:null
}
},
computed:{
...mapState({
collapse:store=>store.collapse
}),
// author(){
// return this.$store.state.messages
// }
},
methods:{
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/page/inquiry/BankFlow.vue
================================================
<template>
<div class="hello">
<div class="head_search">
<h3 class="head_title">银行流水</h3>
<search></search>
<batchAudit></batchAudit>
<batchUnAudit></batchUnAudit>
<batchDifferences></batchDifferences>
<batchDelete></batchDelete>
</div>
<div class="container">
<template>
<el-tabs type="border-card" v-model="activeName">
<!--按钮-->
<el-row>
<btnList></btnList>
</el-row>
<el-tab-pane label="全部" name="Whole">
<template>
<el-table
border
v-loading="loading"
ref="OrderTable"
:data="getLocalDataList"
highlight-current-row
height="410"
@row-click="handleSelectedRow"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="60">
</el-table-column>
<el-table-column
prop="billNo"
label="单据编号"
width="200">
</el-table-column>
<el-table-column
prop="platform"
label="交易日期"
width="200">
</el-table-column>
<el-table-column
prop="orderNo"
label="收入"
width="250">
</el-table-column>
<el-table-column
prop="totalAmount"
label="支出"
width="80">
</el-table-column>
<el-table-column
prop="status"
label="单据状态"
width="90"
:formatter="formatStatus">
</el-table-column>
<el-table-column
prop="settleStatus"
label="对账状态"
width="100"
:formatter="formatSettleStatus">
</el-table-column>
<el-table-column
prop="settleAmount"
label="已对账金额"
width="100">
</el-table-column>
<el-table-column
prop="unsettleAmount"
label="未对账金额"
width="100">
</el-table-column>
<el-table-column
prop="differenceProcessingStatus"
label="差异处理状态"
width="110"
:formatter="formatDifferenceProcessingStatus">
</el-table-column>
<el-table-column
prop="differenceProcessingAmount"
label="差异处理金额"
width="110">
</el-table-column>
<el-table-column
prop="differenceProcessingRamarks"
label="差异处理原因"
width="130">
</el-table-column>
<el-table-column
prop="reconStatus"
label="退款状态"
width="100"
:formatter="formatReconStatus">
</el-table-column>
<el-table-column
prop="unsettlementMoney"
label="未退款金额"
width="100">
</el-table-column>
<el-table-column
prop="settlementMoney"
label="已退款金额"
width="100">
</el-table-column>
<el-table-column
prop="orderType"
label="单据类型"
width="100"
:formatter="formatOrderType">
</el-table-column>
<el-table-column
prop="orderTotalAmount"
label="订单总金额"
width="100">
</el-table-column>
</el-table>
</template>
</el-tab-pane>
<el-tab-pane label="已对账" name="Completely">已对账</el-tab-pane>
<el-tab-pane label="部份对账" name="Part">部份对账</el-tab-pane>
<el-tab-pane label="未对账" name="UnSettled">未对账</el-tab-pane>
</el-tabs>
</template>
</div>
</div>
</template>
<script>
import {mapState} from 'vuex'
import {getOrderReceivable} from '../../axios/api'
import tabs from '../../components/tabs/Tabs'
import search from '../../components/search/Search'
import batchAudit from '../../components/filterBox/batchAudit'
import batchUnAudit from '../../components/filterBox/batchUnAudit'
import batchDifferences from '../../components/filterBox/batchDifferences'
import batchDelete from '../../components/filterBox/batchDelete'
import btnList from '../../components/btnList/btnList'
export default {
name: 'HelloWorld',
components:{
search,//高级搜索
batchAudit,//批量审核框
batchUnAudit,//批量反审核框
batchDifferences,//批量差异对帐
batchDelete,//批量删除
btnList,//按钮
},
data () {
return {
loading: true,
activeName: 'Whole',
getLocalDataList:[],//请求的数据
handSelectDataList:[],//选中的数据
btnInfo:[],
message: '',
currentPage4: 4
}
},
computed: {
...mapState({
verifyStatus:store=>store.verifyStatus
})
},
mounted(){
this.getLocalData()
},
methods:{
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
handleClick() {
alert('button click');
},
/*请求数据*/
getLocalData(){
getOrderReceivable().then(res=>{
console.log(res);
if(res.status === 200){
this.getLocalDataList = res.data.rows;
this.loading = false;
}
})
},
process(row) {
if(row.status === 'Audited'){
row.status = 'Save'
}
},
getRowInfo(row){//获取点击的信息然后跳转
//let index = this.getLocalDataList.indexOf(row);
this.$store.dispatch('storeOrderListUUid',row.uuid);
this.$refs.OrderTable.toggleRowSelection(row);
this.$router.push({
name: 'orderDetail',
params: {id: row.uuid}
})
},
//点击行
handleSelectedRow(row){
this.$refs.OrderTable.toggleRowSelection(row);
},
//当选择项发生变化时会触发该事件
handleSelectionChange(val){
this.handSelectDataList = val;
},
//数格式转换
formatTime(row) { //转换时间
return new Date(row.businessDate);
},
formatStatus(row) { //单据状态
return (row.status === 'Save' && '保存') || (row.status === 'Audited' && '审核');
},
formatSettleStatus(row) { //对账状态
return (row.settleStatus === "UnSettled" && '未对账') || (row.settleStatus === "Part" && '部分对账') || (row.settleStatus === 'Completely' && '完全对账');
},
formatDifferenceProcessingStatus(row) { //差异处理状态
return (row.differenceProcessingStatus === "Y" && '是') || (row.differenceProcessingStatus === "N" && '否');
},
formatReconStatus(row) { //退款状态
return (row.reconStatus === 'UnSettled' && '未退款') || (row.reconStatus === 'Part' && '部分退款') || (row.reconStatus === 'Completely' && '完全退款')
},
formatOrderType(row) { //退款状态
return (row.orderType === '0' && '平台订单') || (row.orderType === '1' && '手工订单')
},
},
}
</script>
<style scoped>
</style>
================================================
FILE: src/page/inquiry/OrderReceivable.vue
================================================
<template>
<div class="bill" v-once>
<div class="head_search">
<h3 class="head_title">订单应收</h3>
<!-- 传回父组件 -->
<search @orderSearchs="fliterOrder"></search>
<batchAudit></batchAudit>
<batchUnAudit></batchUnAudit>
<batchDifferences></batchDifferences>
<batchDelete></batchDelete>
</div>
<div class="container">
<template>
<el-tabs type="border-card" v-model="activeName">
<!--按钮-->
<el-row>
<btnList></btnList>
</el-row>
<el-tab-pane label="全部" name="Whole">
<template>
<hzl-table
:DataList="getLocalDataList"
:height="420"
:cols="colsData"
>
</hzl-table>
</template>
</el-tab-pane>
<el-tab-pane label="已对账" name="Completely">
<template>
<hzl-table
:DataList="getLocalDataList"
:height="420"
:cols="colsData"
>
</hzl-table>
</template>
</el-tab-pane>
<el-tab-pane label="部份对账" name="Part">
<template>
<hzl-table
:DataList="getLocalDataList"
:height="420"
:cols="colsData"
>
</hzl-table>
</template>
</el-tab-pane>
<el-tab-pane label="未对账" name="UnSettled">
<template>
<hzl-table
:DataList="getLocalDataList"
:height="420"
:cols="colsData"
>
</hzl-table>
</template>
</el-tab-pane>
</el-tabs>
</template>
</div>
<template>
<hzl-page></hzl-page>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
import moment from 'moment'
import {getOrderReceivable,getCompany, getCols} from '../../axios/api'
import search from '../../components/search/Search'
import batchAudit from '../../components/filterBox/batchAudit'
import batchUnAudit from '../../components/filterBox/batchUnAudit'
import batchDifferences from '../../components/filterBox/batchDifferences'
import batchDelete from '../../components/filterBox/batchDelete'
import btnList from '../../components/btnList/btnList'
export default {
name: 'bill',
components: {
search,//高级搜索
batchAudit,//批量审核框
batchUnAudit,//批量反审核框
batchDifferences,//批量差异对帐
batchDelete,//批量删除
btnList,//按钮
},
data () {
return {
loading: true,
activeName: 'Whole',
getLocalDataList:[],//请求的数据
colsData: [],
handSelectDataList:[],//选中的数据
btnInfo:[],
message: '',
currentPage4: 4,
}
},
computed: {
...mapState({
verifyStatus:store=>store.verifyStatus,
})
},
mounted(){
this.getLocalData()
this.colsUpate()
},
created() {
},
methods:{
//高级查询
fliterOrder(value){
console.log(JSON.stringify(value),"这是高级查询组件传回来的...")
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
handleClick() {
alert('button click');
},
/*请求数据*/
getLocalData(){
getOrderReceivable().then(res=>{
console.log(res);
if(res.status === 200){
this.getLocalDataList = res.data.rows;
this.loading = false;
}
})
},
/*请求数据*/
colsUpate(){
getCols().then(res=>{
console.log(res.data);
this.colsData = res.data;
this.loading = false;
})
},
getRowInfo(row){//获取点击的信息然后跳转
//let index = this.getLocalDataList.indexOf(row);
this.$store.dispatch('storeOrderListUUid',row.uuid);
this.$refs.OrderTable.toggleRowSelection(row);
this.$router.push({
name: 'orderDetail',
params: {id: row.uuid}
})
},
//点击行
handleSelectedRow(row){
this.$refs.OrderTable.toggleRowSelection(row);
},
//当选择项发生变化时会触发该事件
handleSelectionChange(val){
this.handSelectDataList = val;
},
//数格式转换
formatTime(row) { //转换时间
if(row.businessDate){
return moment(row.businessDate).format("YYYY-MM-DD");
}
},
formatStatus(row) { //单据状态
return (row.status === 'Save' && '保存') || (row.status === 'Audited' && '审核');
},
formatSettleStatus(row) { //对账状态
return (row.settleStatus === "UnSettled" && '未对账') || (row.settleStatus === "Part" && '部分对账') || (row.settleStatus === 'Completely' && '完全对账');
},
formatDifferenceProcessingStatus(row) { //差异处理状态
return (row.differenceProcessingStatus === "Y" && '是') || (row.differenceProcessingStatus === "N" && '否');
},
formatReconStatus(row) { //退款状态
return (row.reconStatus === 'UnSettled' && '未退款') || (row.reconStatus === 'Part' && '部分退款') || (row.reconStatus === 'Completely' && '完全退款')
},
formatOrderType(row) { //退款状态
return (row.orderType === '0' && '平台订单') || (row.orderType === '1' && '手工订单')
},
},
}
</script>
<style scoped>
</style>
================================================
FILE: src/page/inquiry/SystemStatement.vue
================================================
<template>
<div class="bill">
<div class="head_search">
<h3 class="head_title">系统对账单</h3>
<!-- 传回父组件 -->
<search @orderSearchs="fliterOrder"></search>
<batchAudit></batchAudit>
<batchUnAudit></batchUnAudit>
<batchDifferences></batchDifferences>
<batchDelete></batchDelete>
</div>
<div class="container">
<template>
<el-tabs type="border-card" v-model="activeName">
<!--按钮-->
<el-row>
<btnList></btnList>
</el-row>
<el-tab-pane label="全部" name="Whole">
<template>
<el-table
border
v-loading="loading"
ref="OrderTable"
:data="getLocalDataList"
highlight-current-row
height="410"
@row-click="handleSelectedRow"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="60">
</el-table-column>
<el-table-column
prop="billNo"
label="单据编号"
width="200">
</el-table-column>
<el-table-column
prop="platform"
label="平台"
width="200">
</el-table-column>
<el-table-column
prop="orderNo"
label="平台订单号"
width="250">
</el-table-column>
<el-table-column
prop="totalAmount"
label="总金额"
width="80">
</el-table-column>
<el-table-column
prop="status"
label="单据状态"
width="90"
:formatter="formatStatus">
</el-table-column>
<el-table-column
prop="businessDate"
label="业务日期"
width="100"
:formatter="formatTime">
</el-table-column>
<el-table-column
prop="settleStatus"
label="对账状态"
width="100"
:formatter="formatSettleStatus">
</el-table-column>
<el-table-column
prop="settleAmount"
label="已对账金额"
width="100">
</el-table-column>
<el-table-column
prop="unsettleAmount"
label="未对账金额"
width="100">
</el-table-column>
<el-table-column
prop="differenceProcessingStatus"
label="差异处理状态"
width="110"
:formatter="formatDifferenceProcessingStatus">
</el-table-column>
<el-table-column
prop="differenceProcessingAmount"
label="差异处理金额"
width="110">
</el-table-column>
<el-table-column
prop="differenceProcessingRamarks"
label="差异处理原因"
width="130">
</el-table-column>
<el-table-column
prop="reconStatus"
label="退款状态"
width="100"
:formatter="formatReconStatus">
</el-table-column>
<el-table-column
prop="unsettlementMoney"
label="未退款金额"
width="100">
</el-table-column>
<el-table-column
prop="settlementMoney"
label="已退款金额"
width="100">
</el-table-column>
<el-table-column
prop="orderType"
label="单据类型"
width="100"
:formatter="formatOrderType">
</el-table-column>
<el-table-column
prop="orderTotalAmount"
label="订单总金额"
width="100">
</el-table-column>
<el-table-column
prop="commission"
label="佣金"
width="100">
</el-table-column>
<el-table-column
prop="integral"
label="积分"
width="100">
</el-table-column>
</el-table>
</template>
</el-tab-pane>
<el-tab-pane label="已对账" name="Completely">已对账</el-tab-pane>
<el-tab-pane label="部份对账" name="Part">部份对账</el-tab-pane>
<el-tab-pane label="未对账" name="UnSettled">未对账</el-tab-pane>
</el-tabs>
</template>
</div>
<template>
<div class="pagination">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage4"
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
layout="total, sizes, prev, pager, next, jumper"
:total="400">
</el-pagination>
</div>
</template>
</div>
</template>
<script>
import {mapState} from 'vuex'
import {getOrderReceivable,getCompany} from '../../axios/api'
import search from '../../components/search/Search'
import batchAudit from '../../components/filterBox/batchAudit'
import batchUnAudit from '../../components/filterBox/batchUnAudit'
import batchDifferences from '../../components/filterBox/batchDifferences'
import batchDelete from '../../components/filterBox/batchDelete'
import btnList from '../../components/btnList/btnList'
export default {
name: 'bill',
components: {
search,//高级搜索
batchAudit,//批量审核框
batchUnAudit,//批量反审核框
batchDifferences,//批量差异对帐
batchDelete,//批量删除
btnList,//按钮
},
data () {
return {
loading: true,
activeName: 'Whole',
getLocalDataList:[],//请求的数据
handSelectDataList:[],//选中的数据
btnInfo:[],
message: '',
currentPage4: 4,
treeData: {
name: 'My Tree',
children: [
{ name: 'hello' },
{ name: 'wat' },
{
name: 'child folder',
children: [
{
name: 'child folder',
children: [
{ name: 'hello' },
{ name: 'wat' ,
children: [
{ name: 'wwww' },
{ name: 'eeee' }
]}
]
},
{ name: 'hello' },
{ name: 'wat' },
{
name: 'child folder',
children: [
{ name: 'hello' },
{ name: 'wat' }
]
}
]
}
]
}
}
},
computed: {
...mapState({
verifyStatus:store=>store.verifyStatus,
})
},
mounted(){
this.getLocalData()
},
methods:{
//高级查询
fliterOrder(value){
alert(JSON.stringify(value),"这是高级查询组件传回来的...")
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
handleClick() {
alert('button click');
},
/*请求数据*/
getLocalData(){
getOrderReceivable().then(res=>{
console.log(res);
if(res.status === 200){
this.getLocalDataList = res.data.rows;
this.loading = false;
}
})
},
getRowInfo(row){//获取点击的信息然后跳转
//let index = this.getLocalDataList.indexOf(row);
this.$store.dispatch('storeOrderListUUid',row.uuid);
this.$refs.OrderTable.toggleRowSelection(row);
this.$router.push({
name: 'orderDetail',
params: {id: row.uuid}
})
},
//点击行
handleSelectedRow(row){
this.$refs.OrderTable.toggleRowSelection(row);
},
//当选择项发生变化时会触发该事件
handleSelectionChange(val){
this.handSelectDataList = val;
},
//数格式转换
formatTime(row) { //转换时间
return new Date(row.businessDate);
},
formatStatus(row) { //单据状态
return (row.status === 'Save' && '保存') || (row.status === 'Audited' && '审核');
},
formatSettleStatus(row) { //对账状态
return (row.settleStatus === "UnSettled" && '未对账') || (row.settleStatus === "Part" && '部分对账') || (row.settleStatus === 'Completely' && '完全对账');
},
formatDifferenceProcessingStatus(row) { //差异处理状态
return (row.differenceProcessingStatus === "Y" && '是') || (row.differenceProcessingStatus === "N" && '否');
},
formatReconStatus(row) { //退款状态
return (row.reconStatus === 'UnSettled' && '未退款') || (row.reconStatus === 'Part' && '部分退款') || (row.reconStatus === 'Completely' && '完全退款')
},
formatOrderType(row) { //退款状态
return (row.orderType === '0' && '平台订单') || (row.orderType === '1' && '手工订单')
},
},
}
</script>
<style scoped>
</style>
================================================
FILE: src/page/inquiry/TransactionFlow.vue
================================================
<template>
<div class="hello">
<div class="head_search">
<h3 class="head_title">交易流水</h3>
<search></search>
<batchAudit></batchAudit>
<batchUnAudit></batchUnAudit>
<batchDifferences></batchDifferences>
<batchDelete></batchDelete>
</div>
<div class="container">
<template>
<el-tabs type="border-card" v-model="activeName">
<!--按钮-->
<el-row>
<btnList></btnList>
</el-row>
<el-tab-pane label="全部" name="Whole">
<template>
<el-table
border
v-loading="loading"
ref="OrderTable"
:data="getLocalDataList"
highlight-current-row
height="410"
@row-click="handleSelectedRow"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="60">
</el-table-column>
<el-table-column
prop="billNo"
label="单据编号"
width="200">
</el-table-column>
<el-table-column
prop="platform"
label="平台"
width="200">
</el-table-column>
<el-table-column
prop="orderNo"
label="平台订单号"
width="250">
</el-table-column>
<el-table-column
prop="totalAmount"
label="总金额"
width="80">
</el-table-column>
<el-table-column
prop="status"
label="单据状态"
width="90"
:formatter="formatStatus">
</el-table-column>
<el-table-column
prop="businessDate"
label="业务日期"
width="100"
:formatter="formatTime">
</el-table-column>
<el-table-column
prop="settleStatus"
label="对账状态"
width="100"
:formatter="formatSettleStatus">
</el-table-column>
<el-table-column
prop="settleAmount"
label="已对账金额"
width="100">
</el-table-column>
<el-table-column
prop="unsettleAmount"
label="未对账金额"
width="100">
</el-table-column>
<el-table-column
prop="differenceProcessingStatus"
label="差异处理状态"
width="110"
:formatter="formatDifferenceProcessingStatus">
</el-table-column>
<el-table-column
prop="differenceProcessingAmount"
label="差异处理金额"
width="110">
</el-table-column>
<el-table-column
prop="differenceProcessingRamarks"
label="差异处理原因"
width="130">
</el-table-column>
<el-table-column
prop="reconStatus"
label="退款状态"
width="100"
:formatter="formatReconStatus">
</el-table-column>
<el-table-column
prop="unsettlementMoney"
label="未退款金额"
width="100">
</el-table-column>
<el-table-column
prop="settlementMoney"
label="已退款金额"
width="100">
</el-table-column>
<el-table-column
prop="orderType"
label="单据类型"
width="100"
:formatter="formatOrderType">
</el-table-column>
<el-table-column
prop="orderTotalAmount"
label="订单总金额"
width="100">
</el-table-column>
<el-table-column
prop="commission"
label="佣金"
width="100">
</el-table-column>
<el-table-column
prop="integral"
label="积分"
width="100">
</el-table-column>
<el-table-column
prop="platformCoupon"
label="平台优惠卷"
width="110">
</el-table-column>
<el-table-column
prop="companyCoupon"
label="公司优惠卷"
width="110">
</el-table-column>
<el-table-column
prop="insurance"
label="保险"
width="100">
</el-table-column>
<el-table-column
prop="freight"
label="运费"
width="100">
</el-table-column>
<el-table-column
prop="sellerPayment"
label="买家支付金额"
width="110">
</el-table-column>
</el-table>
</template>
</el-tab-pane>
<el-tab-pane label="已对账" name="Completely">已对账</el-tab-pane>
<el-tab-pane label="部份对账" name="Part">部份对账</el-tab-pane>
<el-tab-pane label="未对账" name="UnSettled">未对账</el-tab-pane>
</el-tabs>
</template>
</div>
</div>
</template>
<script>
import {mapState} from 'vuex'
import {getOrderReceivable} from '../../axios/api'
import tabs from '../../components/tabs/Tabs'
import search from '../../components/search/Search'
import batchAudit from '../../components/filterBox/batchAudit'
import batchUnAudit from '../../components/filterBox/batchUnAudit'
import batchDifferences from '../../components/filterBox/batchDifferences'
import batchDelete from '../../components/filterBox/batchDelete'
import btnList from '../../components/btnList/btnList'
export default {
name: 'HelloWorld',
components:{
search,//高级搜索
batchAudit,//批量审核框
batchUnAudit,//批量反审核框
batchDifferences,//批量差异对帐
batchDelete,//批量删除
btnList,//按钮
},
data () {
return {
loading: true,
activeName: 'Whole',
getLocalDataList:[],//请求的数据
handSelectDataList:[],//选中的数据
btnInfo:[],
message: '',
currentPage4: 4
}
},
computed: {
...mapState({
verifyStatus:store=>store.verifyStatus
})
},
mounted(){
this.getLocalData()
},
methods:{
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
handleClick() {
alert('button click');
},
/*请求数据*/
getLocalData(){
getOrderReceivable().then(res=>{
console.log(res);
if(res.status === 200){
this.getLocalDataList = res.data.rows;
this.loading = false;
}
})
},
//Duff装置
duff(rows){
console.log(rows);
let iterations = Math.floor(rows.length /8);
let leftover = rows.length % 8;
let i = 0;
if(leftover > 0) {
do {
this.process(rows[i++]);
}while(--leftover > 0);
}
do {
this.process(rows[i++]);
this.process(rows[i++]);
this.process(rows[i++]);
this.process(rows[i++]);
this.process(rows[i++]);
this.process(rows[i++]);
this.process(rows[i++]);
this.process(rows[i++]);
}while(--iterations > 0);
},
process(row) {
if(row.status === 'Audited'){
row.status = 'Save'
}
},
getRowInfo(row){//获取点击的信息然后跳转
//let index = this.getLocalDataList.indexOf(row);
this.$store.dispatch('storeOrderListUUid',row.uuid);
this.$refs.OrderTable.toggleRowSelection(row);
this.$router.push({
name: 'orderDetail',
params: {id: row.uuid}
})
},
//点击行
handleSelectedRow(row){
this.$refs.OrderTable.toggleRowSelection(row);
},
//当选择项发生变化时会触发该事件
handleSelectionChange(val){
this.handSelectDataList = val;
},
//数格式转换
formatTime(row) { //转换时间
return new Date(row.businessDate);
},
formatStatus(row) { //单据状态
return (row.status === 'Save' && '保存') || (row.status === 'Audited' && '审核');
},
formatSettleStatus(row) { //对账状态
return (row.settleStatus === "UnSettled" && '未对账') || (row.settleStatus === "Part" && '部分对账') || (row.settleStatus === 'Completely' && '完全对账');
},
formatDifferenceProcessingStatus(row) { //差异处理状态
return (row.differenceProcessingStatus === "Y" && '是') || (row.differenceProcessingStatus === "N" && '否');
},
formatReconStatus(row) { //退款状态
return (row.reconStatus === 'UnSettled' && '未退款') || (row.reconStatus === 'Part' && '部分退款') || (row.reconStatus === 'Completely' && '完全退款')
},
formatOrderType(row) { //退款状态
return (row.orderType === '0' && '平台订单') || (row.orderType === '1' && '手工订单')
},
},
}
</script>
<style scoped>
.el-row{
/*background: #d0e9ff;*/
height:40px;
padding:5px 0;
}
table .el-button{
width: 50%;
padding: 0;
}
.el-dropdown{
padding:0 8px;
}
.el-row .el-button-group .el-button{
padding:5px;
}
.el-pagination{
margin-top:10px;
}
</style>
================================================
FILE: src/page/inquiry/children/orderAdd.vue
================================================
<template>
<div class="order-add">
<div class="head_search">
<h2>订单新增</h2>
</div>
<template>
<el-tabs v-model="activeNameOne">
<!--基本信息-->
<el-tab-pane label="基本信息" name="basicInfo">
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>单据类型:</span>
<el-select v-model="fromData.orderType" size="small" placeholder="单据类型" >
<el-option
v-for="item in orderTypeSelect"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>单据编号:</span>
<el-input
placeholder="单据编号"
size="small"
v-model="fromData.billNo"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>平台:</span>
<el-input
placeholder="平台"
size="small"
v-model="fromData.platform"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>销售公司:</span>
<el-input
placeholder="销售公司"
size="small"
v-model="fromData.salesCompany"
:disabled="true">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>业务日期:</span>
<el-date-picker
v-model="fromData.businessDate"
size="small"
type="datetime"
placeholder="选择日期时间">
</el-date-picker>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>对账金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>平台订单号:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.orderNo"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>销售部门:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesDepartment"
:disabled="true">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>对账状态:</span>
<el-input
placeholder="对账状态"
size="small"
v-model="fromData.settleStatus"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>已对账金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.settleAmount"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>未对账金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.unsettleAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>销售员:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesman">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>退款状态:</span>
<el-select v-model="fromData.reconStatus" size="small" placeholder="退款状态" >
<el-option
v-for="item in reconStatusSelect"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>已退款金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.settlementMoney">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>未退款金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.unsettlementMoney">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>单据状态:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.status"
:disabled="true">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>是否差异处理:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.differenceProcessingStatus"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>差异处理金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.differenceProcessingAmount"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>差异处理原因:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.differenceProcessingRamarks"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>备注:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.remarks">
</el-input>
</div>
</el-col>
</el-row>
</el-tab-pane>
<!--订单信息-->
<el-tab-pane label="订单信息" name="orderInfo">
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>订单总金额:</span>
<el-input
placeholder="订单总金额"
size="small"
v-model="fromData.orderTotalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>订单初始支付金:</span>
<el-input
placeholder="单据编号"
size="small"
v-model="fromData.orderInitAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>订单货到应收:</span>
<el-input
placeholder="平台"
size="small"
v-model="fromData.platform">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>运费:</span>
<el-input
placeholder="销售公司"
size="small"
v-model="fromData.salesCompany">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>订单优惠抵扣:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>优惠券名称:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>订单状态:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.orderNo">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>支付状态:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesDepartment">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>支付方式:</span>
<el-input
placeholder="对账状态"
size="small"
v-model="fromData.settleStatus">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>取消理由:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.settleAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>是否有拆单:</span>
<el-select v-model="fromData.haveOtherOrder" size="small" placeholder="是否有拆单" >
<el-option
v-for="item in haveOtherOrder"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>所属订单类型:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesman">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>团购验证码:</span>
<el-select v-model="fromData.reconStatus" size="small" placeholder="退款状态" >
<el-option
v-for="item in reconStatusSelect"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>接单人:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.settlementMoney">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>操作人:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.unsettlementMoney">
</el-input>
</div>
</el-col>
</el-row>
</el-tab-pane>
<!--配送信息-->
<el-tab-pane label="配送信息" name="shippingInfo">
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>订货人:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.orderer">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>订货人电话:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.ordererPhone">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>下单时间:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.deliveryTime"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>门店:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.store">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>收货人:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.receiver">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>收货人电话:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.receiverPhone">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>收货人地址:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.orderNo">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>配送方式:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesDepartment">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>配送员名称:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>配送员手机:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>配送时间:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.orderNo"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>所属城市:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesDepartment">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>配送站:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>发票内容:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
</el-row>
</el-tab-pane>
<!--其它-->
<el-tab-pane label="其它" name="createInfo">
<el-row :gutter="20">
<el-col :span="8">
<div class="grid-content">
<span>创建人:</span>
<el-input
placeholder="创建人"
size="small"
v-model="fromData.creator"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="8">
<div class="grid-content">
<span>修改人:</span>
<el-input
placeholder="修改人"
size="small"
v-model="fromData.operator"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="8">
<div class="grid-content">
<span>审核人:</span>
<el-input
placeholder="审核人"
size="small"
v-model="fromData.auditor"
:disabled="true">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<div class="grid-content">
<span>创建日期:</span>
<el-input
placeholder="创建日期"
size="small"
v-model="fromData.createTime"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="8">
<div class="grid-content">
<span>修改日期:</span>
<el-input
placeholder="修改日期"
size="small"
v-model="fromData.updateTime"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="8">
<div class="grid-content">
<span>审核日期:</span>
<el-input
placeholder="审核日期"
size="small"
v-model="fromData.auditTime"
:disabled="true">
</el-input>
</div>
</el-col>
</el-row>
</el-tab-pane>
</el-tabs>
</template>
<!--表单-->
<template>
<el-tabs type="border-card" v-model="activeNameTwo">
<div class="btn-wrap">
<el-button size="small" type="primary" @click="addTr">新增</el-button>
</div>
<el-tab-pane label="对账计划" name="collate"> <!--collate 对账-->
<template>
<el-table
:data="fromData.reconciliationPlanInfoList"
border
width="100%">
<el-table-column
prop="name"
label="名称">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.reconciliationPlanInfoList[scope.$index].name"
placeholder="名称">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="money"
label="金额">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.reconciliationPlanInfoList[scope.$index].money"
placeholder="金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="settleAmount"
label="已对账金额">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.reconciliationPlanInfoList[scope.$index].settleAmount"
placeholder="已对账金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="unsettleAmount"
label="未对账金额">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.reconciliationPlanInfoList[scope.$index].unsettleAmount"
placeholder="未对账金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="settlementMoney"
label="已退款金额">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.reconciliationPlanInfoList[scope.$index].settlementMoney"
placeholder="已退款金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="unsettlementMoney"
label="未退款金额">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.reconciliationPlanInfoList[scope.$index].unsettlementMoney"
placeholder="名称">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="address"
label="操作"
width="80px">
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
@click="handleDelete(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</template>
</el-tab-pane>
<el-tab-pane label="订单明细" name="detail"><!--detail 明细-->
<template>
<el-table
:data="fromData.orderReceivableSupList"
border
width="100%">
<el-table-column
prop="firstCommodityClass"
label="一级类目名称"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].firstCommodityClass"
placeholder="一级类目名称">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="secondCommodityClass"
label="二级类目名称"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].secondCommodityClass"
placeholder="二级类目名称">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="specification"
label="规格"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].specification"
placeholder="规格">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="commodityNum"
label="商品编码"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].commodityNum"
placeholder="商品编码">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="productName"
label="产品名称(SPU名称)"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].productName"
placeholder="产品名称(SPU名称)">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="SKU"
label="SKU编码"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].SKU"
placeholder="SKU编码">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="SKUNum"
label="SKU值"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].SKUNum"
placeholder="SKU值">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="groupSKU"
label="是否为组合商品"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].groupSKU"
placeholder="是否为组合商品">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="productNum"
label="产品数量">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].productNum"
placeholder="产品数量">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="commission"
label="商品门市价"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].commission"
placeholder="商品门市价">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="unitPrice"
label="商品销售价"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].unitPrice"
placeholder="商品销售价">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="commodityOfficialPrice"
label="商品官网价"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].commodityOfficialPrice"
placeholder="商品官网价">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="amount"
label="商品实际售价(总)"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].amount"
placeholder="商品实际售价(总)">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="platformCoupon"
label="商品卡券优惠金额(总)"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].platformCoupon"
placeholder="商品卡券优惠金额(总)">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="commodityReceivablePrice"
label="商品应收金额"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].commodityReceivablePrice"
placeholder="商品应收金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="commodityVoucherNumber"
label="商品代金券号"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].commodityVoucherNumber"
placeholder="商品代金券号">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="paymentNumber"
label="支付号"
width="160px">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.orderReceivableSupList[scope.$index].paymentNumber"
placeholder="支付号">
</el-input>
</template>
</el-table-column>
</el-table>
</template>
</el-tab-pane>
<el-tab-pane label="关联信息" name="relevance"><!--relevance 关联-->
<template>
<el-table
:data="fromData.receivableRelationInfoList"
border
width="100%">
<el-table-column
prop="name"
label="名称">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.receivableRelationInfoList[scope.$index].name"
placeholder="名称">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="money"
label="金额">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.receivableRelationInfoList[scope.$index].money"
placeholder="金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="relationMoney"
label="关联金额">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.receivableRelationInfoList[scope.$index].settleAmount"
placeholder="已对账金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="transNum"
label="交易流水号">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.receivableRelationInfoList[scope.$index].unsettleAmount"
placeholder="未对账金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="settleNum"
label="结算单号">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.receivableRelationInfoList[scope.$index].settlementMoney"
placeholder="已退款金额">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="bankNum"
label="银行流水号">
<template slot-scope="scope">
<el-input
size="mini"
v-model="fromData.receivableRelationInfoList[scope.$index].name"
placeholder="名称">
</el-input>
</template>
</el-table-column>
<el-table-column
prop="address"
label="操作"
width="80px">
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
@click="handleDelete(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</template>
</el-tab-pane>
</el-tabs>
</template>
<button @click="getData">console</button>
</div>
</template>
<script>
import {mapState} from 'vuex'
import {getOrderReceivable} from '../../../axios/api'
export default {
name: 'orderAdd',
data () {
return {
getLocalDataList: null, //请求的数据
index: null,
activeNameOne: 'basicInfo',//v-model默认选中的tab
activeNameTwo: 'collate',//v-model默认选中的tab
fromData: { //新增储存的数据
/*
* 基本信息
* */
orderType: null,//单据类型
businessDate: null,//业务日期
settleStatus: null,//对账状态
reconStatus: null,//退款状态
billNo: null,//单据编号
totalAmount: null,//对账金额
settleAmount: null,//已对账金额
settlementMoney: null,//已退款金额
platform: null,//平台
orderNo: null,//平台订单号
unsettleAmount: null,//未对账金额
unsettlementMoney: null,//未退款金额
salesCompany: null,//销售公司
salesDepartment: null,//销售部门
status: null,//单据状态
remarks: null,//备注
salesman: null,//销售员
differenceProcessingRamarks: null,//差异处理原因
differenceProcessingAmount: null,//差异处理金额
differenceProcessingStatus: null,//是否差异处理
/*
* 订单信息
* */
orderTotalAmount: null, //订单总金额
orderInitAmount: null, //订单初始支付金
orderReceiveAmount: null, //订单货到应收
freight: null, //运费
orderDiscountAmount: null, //订单优惠抵扣
couponName: null, //优惠券名称
orderStatus: null, //订单状态
payState: null, //支付状态
payType: null, //支付方式
cancelReason: null, //取消理由
haveOtherOrder: null, //是否拆单
orderTypeBelong: null, //所属订单类型
groupPurchaseVerificationCode: null, //团购验证码
orderPickUpEmp: null, //接单人
orderOperator: null, //操作人
/*
* 配送信息
* */
orderer: null,//订货人
ordererPhone: null,//订货人电话
deliveryTime: null,//下单时间(配送时间)
store: null,//门店
receiver: null,//收货人
receiverPhone: null,//收货人电话
receiverAddress: null,//收货人地址
delivery: null,//配送方式
deliveryMan: null,//配送员名称
deliveryManPhone: null,//配送员手机
sendArea: null,//所属城市
sendStation: null,//配送站
invoiceContent: null,//发票内容
/*
* 其它
* */
creator: null,//创建人
createTime: null,//创建日期
operator: null,//修改人
updateTime: null,//修改日期
auditor: null,//审核人
auditTime: null,//审核日期
reconciliationPlanInfoList:[{//对账计划
name: null,
money: null,
settleAmount: null,
unsettleAmount: null,
settlementMoney: null,
unsettlementMoney: null
}
],
orderReceivableSupList:[{//订单明细
firstCommodityClass: null,//一级类目名称
secondCommodityClass: null,//二级类目名称
commodityName: null,//商品名称
specification: null,//规格
commodityNum: null,//商品编码
productName: null,//产品名称
SKU: null,//SKU编码
SKUNum: null,//SKU值
groupSKU: null,//是否为组合商品
productNum: null,//商品数量
commission: null,//商品门市价
unitPrice: null,//商品销售价
//商品活动价(总)
commodityOfficialPrice: null,//商品官网价
amount: null,//商品实际售价(总)
platformCoupon: null,//商品卡券优惠金额(总)
commodityReceivablePrice: null,//商品应收金额
commodityVoucherNumber: null,//商品代金券号
paymentNumber: null,//支付号
}],
receivableRelationInfoList:[{//关联信息
name: null, //名称
money: null,//金额
relationMoney: null,//关联金额
transNum: null,//交易流水号
settleNum: null ,//结算单号
bankNum: null,//银行流水号
}],
},
orderTypeSelect: [{ //单据类型
value: '0',
label: '平台订单'
}, {
value: '1',
label: '手工订单'
}],
reconStatusSelect: [{ //退款状态
value: 'Part',
label: '部分退款'
},{
value: 'Completely',
label: '完全退款'
}],
haveOtherOrder: [{
value: '1',
label: '是'
},{
value: '0',
label: '否'
}],
}
},
mounted(){
this.getLocalData()
},
computed: {
...mapState({
orderListUUid: store => store.orderListUUid
}),
},
methods: {
getLocalData(){ // 请求数据
getOrderReceivable().then(res => {
// this.getLocalDataList = res.data.rows;
})
},
getData(){
console.log(this.fromData);
},
handleDelete(index) { //删除
let name = this.activeNameTwo;
if(name === 'collate'){
this.fromData.reconciliationPlanInfoList.splice(index,1)
}else if(name ==='relevance'){
this.fromData.receivableRelationInfoList.splice(index,1)
}
console.log(index);
},
addTr(){ /*新增(对账计划订单明细关联信息)*/
let name = this.activeNameTwo;
if(name === 'collate'){
this.fromData.reconciliationPlanInfoList.push({
name: null,
money: null,
settleAmount: null,
unsettleAmount: null,
settlementMoney: null,
unsettlementMoney: null,
})
}else if(name === 'detail'){
this.fromData.orderReceivableSupList.push({
firstCommodityClass: null,//一级类目名称
secondCommodityClass: null,//二级类目名称
commodityName: null,//商品名称
specification: null,//规格
commodityNum: null,//商品编码
productName: null,//产品名称
SKU: null,//SKU编码
SKUNum: null,//SKU值
groupSKU: null,//是否为组合商品
productNum: null,//商品数量
commission: null,//商品门市价
unitPrice: null,//商品销售价
//商品活动价(总)
commodityOfficialPrice: null,//商品官网价
amount: null,//商品实际售价(总)
platformCoupon: null,//商品卡券优惠金额(总)
commodityReceivablePrice: null,//商品应收金额
commodityVoucherNumber: null,//商品代金券号
paymentNumber: null,//支付号
})
}else if(name ==='relevance'){
this.fromData.receivableRelationInfoList.push({//关联信息
name: null, //名称
money: null,//金额
relationMoney: null,//关联金额
transNum: null,//交易流水号
settleNum: null ,//结算单号
bankNum: null,//银行流水号
})
}
}
}
}
</script>
<style scoped>
</style>
================================================
FILE: src/page/inquiry/children/orderDetail.vue
================================================
<template>
<div class="order-detail">
<div class="head_search">
<h2>订单新增</h2>
</div>
<template>
<el-tabs v-model="activeNameOne">
<!--基本信息-->
<el-tab-pane label="基本信息" name="basicInfo">
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>单据类型:</span>
<el-select v-model="fromData.orderType" size="small" placeholder="单据类型" >
<el-option
v-for="item in orderTypeSelect"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>单据编号:</span>
<el-input
placeholder="单据编号"
size="small"
v-model="fromData.billNo"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>平台:</span>
<el-input
placeholder="平台"
size="small"
v-model="fromData.platform"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>销售公司:</span>
<el-input
placeholder="销售公司"
size="small"
v-model="fromData.salesCompany"
:disabled="true">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>业务日期:</span>
<el-date-picker
v-model="fromData.businessDate"
size="small"
type="date"
placeholder="选择日期时间">
</el-date-picker>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>对账金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>平台订单号:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.orderNo"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>销售部门:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesDepartment"
:disabled="true">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>对账状态:</span>
<el-input
placeholder="对账状态"
size="small"
v-model="fromData.settleStatus"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>已对账金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.settleAmount"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>未对账金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.unsettleAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>销售员:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesman">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>退款状态:</span>
<el-select v-model="fromData.reconStatus" size="small" placeholder="退款状态" >
<el-option
v-for="item in reconStatusSelect"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>已退款金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.settlementMoney">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>未退款金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.unsettlementMoney">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>单据状态:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.status"
:disabled="true">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>是否差异处理:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.differenceProcessingStatus"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>差异处理金额:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.differenceProcessingAmount"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>差异处理原因:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.differenceProcessingRamarks"
:disabled="true">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>备注:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.remarks">
</el-input>
</div>
</el-col>
</el-row>
</el-tab-pane>
<!--订单信息-->
<el-tab-pane label="订单信息" name="orderInfo">
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>订单总金额:</span>
<el-input
placeholder="订单总金额"
size="small"
v-model="fromData.orderTotalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>订单初始支付金:</span>
<el-input
placeholder="单据编号"
size="small"
v-model="fromData.orderInitAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>订单货到应收:</span>
<el-input
placeholder="平台"
size="small"
v-model="fromData.platform">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>运费:</span>
<el-input
placeholder="销售公司"
size="small"
v-model="fromData.salesCompany">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>订单优惠抵扣:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>优惠券名称:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.totalAmount">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>订单状态:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.orderNo">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>支付状态:</span>
<el-input
placeholder="请输入内容"
size="small"
v-model="fromData.salesDepartment">
</el-input>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="grid-content">
<span>支付方式:</span>
<el-input
placeholder="对账状态"
size="small"
v-model="fromData.settleStatus">
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content">
<span>取消理由:</span>
<el-input
placeholder="请输入内容"
size="sm
gitextract_7zminbyu/
├── .babelrc
├── .editorconfig
├── .gitignore
├── .postcssrc.js
├── README.md
├── build/
│ ├── build.js
│ ├── check-versions.js
│ ├── utils.js
│ ├── vue-loader.conf.js
│ ├── webpack.base.conf.js
│ ├── webpack.dev.conf.js
│ └── webpack.prod.conf.js
├── config/
│ ├── dev.env.js
│ ├── index.js
│ └── prod.env.js
├── index.html
├── package.json
├── src/
│ ├── App.vue
│ ├── axios/
│ │ ├── api.js
│ │ ├── fetch.js
│ │ └── url.js
│ ├── components/
│ │ ├── btnList/
│ │ │ └── btnList.vue
│ │ ├── filterBox/
│ │ │ ├── batchAudit.vue
│ │ │ ├── batchDelete.vue
│ │ │ ├── batchDifferences.vue
│ │ │ ├── batchStatement.vue
│ │ │ └── batchUnAudit.vue
│ │ ├── getWebSocket/
│ │ │ └── getWebSocket.vue
│ │ ├── head/
│ │ │ └── head.vue
│ │ ├── search/
│ │ │ └── Search.vue
│ │ ├── sidebar/
│ │ │ └── sidebar.vue
│ │ ├── tabs/
│ │ │ └── Tabs.vue
│ │ ├── tags/
│ │ │ └── tags.vue
│ │ ├── template/
│ │ │ ├── hzlDialog.vue
│ │ │ ├── hzlInput.vue
│ │ │ ├── hzlPage.vue
│ │ │ ├── hzlSelect.vue
│ │ │ ├── hzlTable.vue
│ │ │ └── index.js
│ │ └── templateOne.vue
│ ├── i18n/
│ │ ├── index.js
│ │ └── lan/
│ │ ├── en.js
│ │ └── zh.js
│ ├── main.js
│ ├── page/
│ │ ├── chart/
│ │ │ └── chart.vue
│ │ ├── home/
│ │ │ └── home.vue
│ │ ├── inquiry/
│ │ │ ├── BankFlow.vue
│ │ │ ├── OrderReceivable.vue
│ │ │ ├── SystemStatement.vue
│ │ │ ├── TransactionFlow.vue
│ │ │ └── children/
│ │ │ ├── orderAdd.vue
│ │ │ └── orderDetail.vue
│ │ ├── login/
│ │ │ └── login.vue
│ │ ├── reportForms/
│ │ │ ├── OrderSummary.vue
│ │ │ └── ReceivablesBalance.vue
│ │ ├── set/
│ │ │ ├── structure.vue
│ │ │ └── updatePWD.vue
│ │ ├── upload/
│ │ │ └── upload.vue
│ │ ├── verifyPlatform/
│ │ │ ├── VerifyBankStatement.vue
│ │ │ ├── VerifyReceivables.vue
│ │ │ └── verifyAutomate.vue
│ │ └── verifyRecord/
│ │ ├── VerifyBankStatementRecord.vue
│ │ └── VerifyReceivablesRecord.vue
│ ├── router/
│ │ └── index.js
│ ├── store/
│ │ ├── index.js
│ │ └── modules/
│ │ ├── actions.js
│ │ ├── mutation-type.js
│ │ └── mutations.js
│ └── style/
│ └── main.css
└── static/
├── .gitkeep
└── data/
├── localData.json
└── tableCols.json
SYMBOL INDEX (37 symbols across 9 files)
FILE: build/check-versions.js
function exec (line 7) | function exec (cmd) {
FILE: build/utils.js
function generateLoaders (line 33) | function generateLoaders (loader, loaderOptions) {
FILE: build/webpack.base.conf.js
function resolve (line 7) | function resolve (dir) {
FILE: build/webpack.dev.conf.js
constant HOST (line 13) | const HOST = process.env.HOST
constant PORT (line 14) | const PORT = process.env.PORT && Number(process.env.PORT)
FILE: build/webpack.prod.conf.js
method minChunks (line 84) | minChunks (module) {
FILE: src/axios/fetch.js
function fetch (line 6) | function fetch(options){
FILE: src/store/modules/actions.js
method getCollapse (line 11) | getCollapse({commit}){
method getCompanyValue (line 14) | getCompanyValue({commit},companyValue) { // 提交到mutations中处理
method getVerifyStatus (line 17) | getVerifyStatus({commit},verifyStatus){ //获取
method storeOrderListUUid (line 20) | storeOrderListUUid({commit},orderListInfo){ //存储
method dialogFromAudit (line 23) | dialogFromAudit({commit}){ //批量审核
method dialogFromUnAudit (line 26) | dialogFromUnAudit({commit}){ //批量反深恶黑
method dialogFromDifferences (line 29) | dialogFromDifferences({commit}){ //批量差异对帐
method dialogFromDelete (line 32) | dialogFromDelete({commit}){ //批量删除
method dialogFromStatement (line 35) | dialogFromStatement({commit}){//报表通用弹出层
method dialoggetWebSocket (line 38) | dialoggetWebSocket({commit}){//websocket
FILE: src/store/modules/mutation-type.js
constant COLLAPSE (line 5) | const COLLAPSE = 'COLLAPSE' //左侧边栏隐藏状态
constant COMPANY (line 6) | const COMPANY = 'COMPANY' //公司
constant VERIFY_STATUS (line 7) | const VERIFY_STATUS = 'VERIFY_STATUS' //
constant ORDER_LIST_INFO (line 8) | const ORDER_LIST_INFO = 'ORDER_LIST_INFO' //
constant DIALOG_FROM_AUDIT (line 9) | const DIALOG_FROM_AUDIT = 'DIALOG_FROM_AUDIT' //批量审核框
constant DIALOG_FROM_UN_AUDIT (line 10) | const DIALOG_FROM_UN_AUDIT = 'DIALOG_FROM_UN_AUDIT' //批量反审核框
constant DIALOG_FROM_DIFFERENCES (line 11) | const DIALOG_FROM_DIFFERENCES = 'DIALOG_FROM_DIFFERENCES' //批量差异对帐
constant DIALOG_FROM_DELETE (line 12) | const DIALOG_FROM_DELETE = 'DIALOG_FROM_DELETE' //批量删除
constant DIALOG_FROM_STATEMENT (line 13) | const DIALOG_FROM_STATEMENT = 'DIALOG_FROM_STATEMENT' //报表通用弹出层
constant DIALOGGET_WEB_SOCKET (line 14) | const DIALOGGET_WEB_SOCKET = 'DIALOGGET_WEB_SOCKET' //websocket
FILE: src/store/modules/mutations.js
method ['COLLAPSE'] (line 17) | ['COLLAPSE'](state) {
method ['COMPANY'] (line 21) | ['COMPANY'](state,obj) {
method ['VERIFY_STATUS'] (line 24) | ['VERIFY_STATUS'](state,obj){
method ['ORDER_LIST_INFO'] (line 27) | ['ORDER_LIST_INFO'](state,obj){
method ['DIALOG_FROM_AUDIT'] (line 30) | ['DIALOG_FROM_AUDIT'](state){
method ['DIALOG_FROM_UN_AUDIT'] (line 33) | ['DIALOG_FROM_UN_AUDIT'](state){
method ['DIALOG_FROM_DIFFERENCES'] (line 36) | ['DIALOG_FROM_DIFFERENCES'](state){
method ['DIALOG_FROM_DELETE'] (line 39) | ['DIALOG_FROM_DELETE'](state){
method ['DIALOG_FROM_STATEMENT'] (line 42) | ['DIALOG_FROM_STATEMENT'](state){
method ['DIALOGGET_WEB_SOCKET'] (line 46) | ['DIALOGGET_WEB_SOCKET'](state) { //websocket
Condensed preview — 72 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (433K chars).
[
{
"path": ".babelrc",
"chars": 230,
"preview": "{\n \"presets\": [\n [\"env\", {\n \"modules\": false,\n \"targets\": {\n \"browsers\": [\"> 1%\", \"last 2 versions\""
},
{
"path": ".editorconfig",
"chars": 147,
"preview": "root = true\n\n[*]\ncharset = utf-8\nindent_style = space\nindent_size = 2\nend_of_line = lf\ninsert_final_newline = true\ntrim_"
},
{
"path": ".gitignore",
"chars": 154,
"preview": ".DS_Store\nnode_modules/\n/dist/\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# Editor directories and files\n.idea\n.vsc"
},
{
"path": ".postcssrc.js",
"chars": 246,
"preview": "// https://github.com/michael-ciniawsky/postcss-load-config\n\nmodule.exports = {\n \"plugins\": {\n \"postcss-import\": {},"
},
{
"path": "README.md",
"chars": 1695,
"preview": "\n\n#基于vue-cli构建的财务后台管理系统(`vue2`+`vuex`+`axios`+`vue-router`+`element-ui`+`echarts`+`websocket`+`vue-i18n`)\n\n[![LICENSE](h"
},
{
"path": "build/build.js",
"chars": 1198,
"preview": "'use strict'\nrequire('./check-versions')()\n\nprocess.env.NODE_ENV = 'production'\n\nconst ora = require('ora')\nconst rm = r"
},
{
"path": "build/check-versions.js",
"chars": 1290,
"preview": "'use strict'\nconst chalk = require('chalk')\nconst semver = require('semver')\nconst packageConfig = require('../package.j"
},
{
"path": "build/utils.js",
"chars": 2587,
"preview": "'use strict'\nconst path = require('path')\nconst config = require('../config')\nconst ExtractTextPlugin = require('extract"
},
{
"path": "build/vue-loader.conf.js",
"chars": 553,
"preview": "'use strict'\nconst utils = require('./utils')\nconst config = require('../config')\nconst isProduction = process.env.NODE_"
},
{
"path": "build/webpack.base.conf.js",
"chars": 2047,
"preview": "'use strict'\nconst path = require('path')\nconst utils = require('./utils')\nconst config = require('../config')\nconst vue"
},
{
"path": "build/webpack.dev.conf.js",
"chars": 3004,
"preview": "'use strict'\nconst utils = require('./utils')\nconst webpack = require('webpack')\nconst config = require('../config')\ncon"
},
{
"path": "build/webpack.prod.conf.js",
"chars": 5055,
"preview": "'use strict'\nconst path = require('path')\nconst utils = require('./utils')\nconst webpack = require('webpack')\nconst conf"
},
{
"path": "config/dev.env.js",
"chars": 156,
"preview": "'use strict'\nconst merge = require('webpack-merge')\nconst prodEnv = require('./prod.env')\n\nmodule.exports = merge(prodEn"
},
{
"path": "config/index.js",
"chars": 1974,
"preview": "'use strict'\n// Template version: 1.3.1\n// see http://vuejs-templates.github.io/webpack for documentation.\n\nconst path ="
},
{
"path": "config/prod.env.js",
"chars": 61,
"preview": "'use strict'\nmodule.exports = {\n NODE_ENV: '\"production\"'\n}\n"
},
{
"path": "index.html",
"chars": 279,
"preview": "<!DOCTYPE html>\n<html>\n <head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width,initial"
},
{
"path": "package.json",
"chars": 1984,
"preview": "{\n \"name\": \"my-project\",\n \"version\": \"1.0.0\",\n \"description\": \"A Vue.js project\",\n \"author\": \"liuzhu\",\n \"private\": "
},
{
"path": "src/App.vue",
"chars": 295,
"preview": "<template>\n <div id=\"app\">\n <transition name=\"router-fade\" mode=\"out-in\">\n <keep-alive>\n <router-view></"
},
{
"path": "src/axios/api.js",
"chars": 1459,
"preview": "/**\n * Created by 不动的推动者 on 2018/4/30.\n */\n/*****\n * 获取数据get + 对应路由名称\n * 向后台传数据 store + 对应路由名称\n * 驼峰命名\n * *****/\n\n\nimpor"
},
{
"path": "src/axios/fetch.js",
"chars": 666,
"preview": "/**\n * Created by 不动的推动者 on 2018/4/30.\n */\nimport axios from 'axios';//引入axios\n\nexport function fetch(options){\n return"
},
{
"path": "src/axios/url.js",
"chars": 857,
"preview": "/**\n * Created by 不动的推动者 on 2018/4/30.\n */\nexport default {\n //接口代理配置\n Hallowmas:'http://jsonplaceholder.typicode.com/"
},
{
"path": "src/components/btnList/btnList.vue",
"chars": 3897,
"preview": "<template>\n <div class=\"btn-list\">\n <el-dropdown split-button type=\"primary\" size=\"mini\" @click=\"getBtnInfo($eve"
},
{
"path": "src/components/filterBox/batchAudit.vue",
"chars": 3357,
"preview": "<template>\n <div class=\"batch-audit\">\n <template>\n <el-dialog title=\"批量审核\" :close-on-click-modal=\"false\" "
},
{
"path": "src/components/filterBox/batchDelete.vue",
"chars": 3234,
"preview": "<template>\n <div class=\"batch-delete\">\n <template>\n <el-dialog title=\"批量删除\" :close-on-click-modal=\"false\""
},
{
"path": "src/components/filterBox/batchDifferences.vue",
"chars": 3487,
"preview": "<template>\n <div class=\"batch-Differences\">\n <template>\n <el-dialog title=\"批量差异对帐\" :close-on-click-modal="
},
{
"path": "src/components/filterBox/batchStatement.vue",
"chars": 4197,
"preview": "<template>\n <div class=\"batch-statement\">\n <template>\n <el-dialog title=\"条件查询\" :close-on-click-modal=\"fal"
},
{
"path": "src/components/filterBox/batchUnAudit.vue",
"chars": 3218,
"preview": "<template>\n <div class=\"batch-UnAudit\">\n <template>\n <el-dialog title=\"批量反审核\" :close-on-click-modal=\"fals"
},
{
"path": "src/components/getWebSocket/getWebSocket.vue",
"chars": 4734,
"preview": "<template>\n <div class=\"batch-statement\">\n <template>\n <el-dialog width=\"42%\" style=\"min-height:100px;\" title=\""
},
{
"path": "src/components/head/head.vue",
"chars": 3883,
"preview": "<template>\n <header class=\"head\">\n <!-- 折叠按钮 -->\n <div class=\"collapse-btn\" @click=\"getCollapse\">\n <i class="
},
{
"path": "src/components/search/Search.vue",
"chars": 28855,
"preview": "<template>\n <div class=\"search\">\n <div>\n <!-- 单一查询 -->\n <div style=\"float: left;padding:10px;z-index"
},
{
"path": "src/components/sidebar/sidebar.vue",
"chars": 4710,
"preview": "<template>\n <div id=\"sidebar-left\">\n <el-menu\n :collapse=\"collapse\"\n class=\"el-menu-vertical-demo\""
},
{
"path": "src/components/tabs/Tabs.vue",
"chars": 1162,
"preview": "<template>\n <div class=\"tabs\">\n <template>\n <el-tabs v-model=\"verifyStatus\" @tab-click=\"handleClick\">\n "
},
{
"path": "src/components/tags/tags.vue",
"chars": 2778,
"preview": "<template>\n <div class=\"tags\" v-if=\"isShowTags\">\n <div class=\"tag-box\">\n <ul>\n <li v-for=\"(item,"
},
{
"path": "src/components/template/hzlDialog.vue",
"chars": 891,
"preview": "<template>\n <div>\n <el-dialog\n :title=\"title\"\n :visible.sync=\"dialog\"\n :width=\"width\"\n @close=\"$"
},
{
"path": "src/components/template/hzlInput.vue",
"chars": 758,
"preview": "<template>\n <div>\n <el-input :type=\"type\" :size=\"size\" v-model=\"inputValue\" :placeholder=\"placeholder\" @change=\"inpu"
},
{
"path": "src/components/template/hzlPage.vue",
"chars": 845,
"preview": "<template>\n <div class=\"right\">\n <el-pagination\n @size-change=\"sizeChange\"\n @current-change=\"currentChange"
},
{
"path": "src/components/template/hzlSelect.vue",
"chars": 778,
"preview": "<template>\n <div>\n <el-select v-model=\"select\" :placeholder=\"placeholder\" :size=\"size\" @change=\"hanleChange\">\n "
},
{
"path": "src/components/template/hzlTable.vue",
"chars": 1133,
"preview": "<template>\n <div>\n <el-table \n border\n :data=\"DataList\"\n highlight-current-row\n :height=\"height\""
},
{
"path": "src/components/template/index.js",
"chars": 403,
"preview": "import Vue from 'vue'\n\nimport hzlInput from './hzlInput.vue'\nimport hzlSelect from './hzlSelect.vue'\nimport hzlPage from"
},
{
"path": "src/components/templateOne.vue",
"chars": 696,
"preview": "<template>\n <footer class=\"templateOne\">\n <ul>\n <li v-for=\"lis in ul\" :key=\"lis.index\">{{lis.li}}</li>\n </ul"
},
{
"path": "src/i18n/index.js",
"chars": 310,
"preview": "import Vue from \"vue\";\nimport VueI18n from \"vue-i18n\";\n\nVue.use(VueI18n); // 全局挂载\n\nexport const i18n = new VueI18n({\n l"
},
{
"path": "src/i18n/lan/en.js",
"chars": 549,
"preview": "export const h = {\n system: \"Background management system\",\n full: \"full-screen display\",\n account: \"myAccount\",\n in"
},
{
"path": "src/i18n/lan/zh.js",
"chars": 356,
"preview": "export const h = {\n system: \"Vue后台管理系统\",\n full: \"全屏显示\",\n account: \"我的账户\",\n invoice: \"原始单据\",\n reconciliation: \"财务对账\""
},
{
"path": "src/main.js",
"chars": 1401,
"preview": "// The Vue build version to load with the `import` command\n// (runtime-only or standalone) has been set in webpack.base."
},
{
"path": "src/page/chart/chart.vue",
"chars": 1957,
"preview": "<template>\n\n <div>\n <template>\n <el-tabs v-model=\"activeName\" @tab-click=\"handleClick\">\n "
},
{
"path": "src/page/home/home.vue",
"chars": 1199,
"preview": "<template>\n <div id=\"Home\">\n <head-top></head-top>\n <div class=\"wrapper\">\n <sidebar></sidebar>\n "
},
{
"path": "src/page/inquiry/BankFlow.vue",
"chars": 8079,
"preview": "<template>\n <div class=\"hello\">\n <div class=\"head_search\">\n <h3 class=\"head_title\">银行流水</h3>\n <sea"
},
{
"path": "src/page/inquiry/OrderReceivable.vue",
"chars": 5984,
"preview": "<template>\n <div class=\"bill\" v-once>\n <div class=\"head_search\">\n <h3 class=\"head_title\">订单应收</h3>\n "
},
{
"path": "src/page/inquiry/SystemStatement.vue",
"chars": 10295,
"preview": "<template>\n <div class=\"bill\">\n <div class=\"head_search\">\n <h3 class=\"head_title\">系统对账单</h3>\n <!--"
},
{
"path": "src/page/inquiry/TransactionFlow.vue",
"chars": 10188,
"preview": "<template>\n <div class=\"hello\">\n <div class=\"head_search\">\n <h3 class=\"head_title\">交易流水</h3>\n <sea"
},
{
"path": "src/page/inquiry/children/orderAdd.vue",
"chars": 42023,
"preview": "<template>\n <div class=\"order-add\">\n <div class=\"head_search\">\n <h2>订单新增</h2>\n </div>\n <template>\n <"
},
{
"path": "src/page/inquiry/children/orderDetail.vue",
"chars": 44582,
"preview": "<template>\n <div class=\"order-detail\">\n <div class=\"head_search\">\n <h2>订单新增</h2>\n </div>\n <temp"
},
{
"path": "src/page/login/login.vue",
"chars": 4917,
"preview": "<template>\n <div class=\"loginContainer\">\n <div class=\"loginTitle\">{{$t('h.system')}}</div>\n <div class=\"log"
},
{
"path": "src/page/reportForms/OrderSummary.vue",
"chars": 10405,
"preview": "<template>\n <div class=\"orderSummary\">\n <h3 class=\"head_title\">订单执行汇总表</h3>\n <batchStatement></batchStateme"
},
{
"path": "src/page/reportForms/ReceivablesBalance.vue",
"chars": 10531,
"preview": "<template>\n <div class=\"order-receivable\">\n <h3 class=\"head_title\">收款对账余额表</h3>\n <batchStatement></batchSta"
},
{
"path": "src/page/set/structure.vue",
"chars": 4230,
"preview": "<template>\n <div class=\"platform-setup\">\n <h3 class=\"head_title\">平台管理</h3>\n <div class=\"search-btn\">\n <div c"
},
{
"path": "src/page/set/updatePWD.vue",
"chars": 2894,
"preview": "<template>\n <div class=\"update-PWD\">\n <el-form\n :model=\"ruleForm\" :rules=\"rules\" ref=\"ruleForm\" label-widt"
},
{
"path": "src/page/upload/upload.vue",
"chars": 1494,
"preview": "<template>\n <div class=\"upload\">\n <el-upload\n class=\"upload-demo\"\n ref=\"upload\"\n action=\"ht"
},
{
"path": "src/page/verifyPlatform/VerifyBankStatement.vue",
"chars": 219,
"preview": "<template>\n <div class=\"hello\">\n 银行对账\n </div>\n</template>\n\n<script>\n export default {\n name: 'Hello"
},
{
"path": "src/page/verifyPlatform/VerifyReceivables.vue",
"chars": 239,
"preview": "<template>\n <div class=\"verify-receivables\">\n 收款对账\n </div>\n</template>\n\n<script>\n export default {\n "
},
{
"path": "src/page/verifyPlatform/verifyAutomate.vue",
"chars": 6317,
"preview": "<template>\n <div class=\"verify-automate\">\n <h3 class=\"head_title\">自动对账</h3>\n <getWebSocket></getWebSocket>\n"
},
{
"path": "src/page/verifyRecord/VerifyBankStatementRecord.vue",
"chars": 223,
"preview": "<template>\n <div class=\"hello\">\n 对账记录银行对账\n </div>\n</template>\n\n<script>\n export default {\n name: 'H"
},
{
"path": "src/page/verifyRecord/VerifyReceivablesRecord.vue",
"chars": 10156,
"preview": "<template>\n <div class=\"bill\">\n <div class=\"head_search\">\n <h3 class=\"head_title\">对账记录收款对账</h3>\n <el-butto"
},
{
"path": "src/router/index.js",
"chars": 4594,
"preview": "/**\n * Created by 不动的推动者 on 2018/5/2.\n */\n//\nimport Vue from 'vue'\nimport Router from 'vue-router'\n\nconst Login = resolv"
},
{
"path": "src/store/index.js",
"chars": 791,
"preview": "/**\n * Created by 不动的推动者 on 2018/4/21.\n */\n//分离vuex方便维护\n// # 我们组装模块并导出 store 的地方\nimport Vue from 'vue'\nimport Vuex from "
},
{
"path": "src/store/modules/actions.js",
"chars": 964,
"preview": "/**\n * Created by 不动的推动者 on 2018/5/2.\n */\nimport {\n COLLAPSE,\n COMPANY,\n VERIFY_STATUS\n}from './mutation-type'\n\nexpor"
},
{
"path": "src/store/modules/mutation-type.js",
"chars": 638,
"preview": "/**\n * Created by 不动的推动者 on 2018/5/2.\n */\n//\nexport const COLLAPSE = 'COLLAPSE' //左侧边栏隐藏状态\nexport const COMPANY = 'COMPA"
},
{
"path": "src/store/modules/mutations.js",
"chars": 1175,
"preview": "/**\n * Created by 不动的推动者 on 2018/5/2.\n */\nimport {\n COLLAPSE,\n COMPANY,\n VERIFY_STATUS,\n DIALOG_FROM_AUDIT,\n DIALOG"
},
{
"path": "src/style/main.css",
"chars": 6563,
"preview": "body{\n font-family: \"Helvetica Neue\",Helvetica,\"PingFang SC\",\"Hiragino Sans GB\",\"Microsoft YaHei\",\"微软雅黑\",Arial,sans-ser"
},
{
"path": "static/.gitkeep",
"chars": 0,
"preview": ""
},
{
"path": "static/data/localData.json",
"chars": 90611,
"preview": "{\n\"total\": 24,\n\"rows\": [\n\n {\n \"creatorId\": null,\n \"creator\": \"管理员\",\n \"createTime\": \"2018-04-18T21:01:03.000+00"
},
{
"path": "static/data/tableCols.json",
"chars": 1973,
"preview": "[\n {\n \"prop\": \"\",\n \"label\": \"\",\n \"width\": \"60\",\n \"type\":\"selection\"\n },\n {\n \"prop\": \"billNo\",\n \"lab"
}
]
About this extraction
This page contains the full source code of the hzlshen/vue-project GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 72 files (375.8 KB), approximately 95.2k tokens, and a symbol index with 37 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.