@@ -0,0 +1,9 @@ | |||
{ | |||
"presets": [ | |||
["env", { | |||
"modules": false | |||
}], | |||
"stage-2" | |||
], | |||
"plugins": ["transform-runtime"] | |||
} |
@@ -0,0 +1,9 @@ | |||
root = true | |||
[*] | |||
charset = utf-8 | |||
indent_style = space | |||
indent_size = 2 | |||
end_of_line = lf | |||
insert_final_newline = true | |||
trim_trailing_whitespace = true |
@@ -0,0 +1,13 @@ | |||
.DS_Store | |||
node_modules/ | |||
dist/ | |||
npm-debug.log | |||
yarn-error.log | |||
# Editor directories and files | |||
.idea | |||
.vscode | |||
*.suo | |||
*.ntvs* | |||
*.njsproj | |||
*.sln |
@@ -0,0 +1,9 @@ | |||
// https://github.com/michael-ciniawsky/postcss-load-config | |||
module.exports = { | |||
"plugins": { | |||
// to edit target browsers: use "browserslist" field in package.json | |||
"postcss-import": {}, | |||
"autoprefixer": {} | |||
} | |||
} |
@@ -0,0 +1,21 @@ | |||
# posweb | |||
> A Vue.js project | |||
## Build Setup | |||
``` bash | |||
# install dependencies | |||
npm install | |||
# serve with hot reload at localhost:8080 | |||
npm run dev | |||
# build for production with minification | |||
npm run build | |||
# build for production and view the bundle analyzer report | |||
npm run build --report | |||
``` | |||
For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader). |
@@ -0,0 +1,41 @@ | |||
'use strict' | |||
require('./check-versions')() | |||
process.env.NODE_ENV = 'production' | |||
const ora = require('ora') | |||
const rm = require('rimraf') | |||
const path = require('path') | |||
const chalk = require('chalk') | |||
const webpack = require('webpack') | |||
const config = require('../config') | |||
const webpackConfig = require('./webpack.prod.conf') | |||
const spinner = ora('building for production...') | |||
spinner.start() | |||
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => { | |||
if (err) throw err | |||
webpack(webpackConfig, function (err, stats) { | |||
spinner.stop() | |||
if (err) throw err | |||
process.stdout.write(stats.toString({ | |||
colors: true, | |||
modules: false, | |||
children: false, | |||
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' | |||
)) | |||
}) | |||
}) |
@@ -0,0 +1,49 @@ | |||
'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) | |||
} | |||
} |
@@ -0,0 +1,90 @@ | |||
require('./check-versions')() | |||
var config = require('../config') | |||
if (!process.env.NODE_ENV) { | |||
process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV) | |||
} | |||
var opn = require('opn') | |||
var path = require('path') | |||
var express = require('express') | |||
var webpack = require('webpack') | |||
var proxyMiddleware = require('http-proxy-middleware') | |||
var webpackConfig = require('./webpack.dev.conf') | |||
// default port where dev server listens for incoming traffic | |||
var port = process.env.PORT || config.dev.port | |||
// automatically open browser, if not set will be false | |||
var autoOpenBrowser = !!config.dev.autoOpenBrowser | |||
// Define HTTP proxies to your custom API backend | |||
// https://github.com/chimurai/http-proxy-middleware | |||
var proxyTable = config.dev.proxyTable | |||
var app = express() | |||
var compiler = webpack(webpackConfig) | |||
var devMiddleware = require('webpack-dev-middleware')(compiler, { | |||
publicPath: webpackConfig.output.publicPath, | |||
quiet: true | |||
}) | |||
var hotMiddleware = require('webpack-hot-middleware')(compiler, { | |||
log: () => {} | |||
}) | |||
// force page reload when html-webpack-plugin template changes | |||
compiler.plugin('compilation', function (compilation) { | |||
compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) { | |||
hotMiddleware.publish({ action: 'reload' }) | |||
cb() | |||
}) | |||
}) | |||
// proxy api requests | |||
Object.keys(proxyTable).forEach(function (context) { | |||
var options = proxyTable[context] | |||
if (typeof options === 'string') { | |||
options = { target: options } | |||
} | |||
app.use(proxyMiddleware(options.filter || context, options)) | |||
}) | |||
// handle fallback for HTML5 history API | |||
app.use(require('connect-history-api-fallback')()) | |||
// serve webpack bundle output | |||
app.use(devMiddleware) | |||
// enable hot-reload and state-preserving | |||
// compilation error display | |||
app.use(hotMiddleware) | |||
// serve pure static assets | |||
var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory) | |||
app.use(staticPath, express.static('./static')) | |||
var uri = 'http://localhost:' + port | |||
var _resolve | |||
var readyPromise = new Promise(resolve => { | |||
_resolve = resolve | |||
}) | |||
console.log('> Starting dev server...') | |||
devMiddleware.waitUntilValid(() => { | |||
console.log('> Listening at ' + uri + '\n') | |||
// when env is testing, don't need open it | |||
if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') { | |||
opn(uri) | |||
} | |||
_resolve() | |||
}) | |||
var server = app.listen(port) | |||
module.exports = { | |||
ready: readyPromise, | |||
close: () => { | |||
server.close() | |||
} | |||
} |
@@ -0,0 +1,98 @@ | |||
'use strict' | |||
const path = require('path') | |||
const config = require('../config') | |||
const ExtractTextPlugin = require('extract-text-webpack-plugin') | |||
const pkg = 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 | |||
} | |||
} | |||
var 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 = function () { | |||
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: pkg.name, | |||
message: severity + ': ' + error.name, | |||
subtitle: filename || '', | |||
icon: path.join(__dirname, 'logo.png') | |||
}) | |||
} | |||
} |
@@ -0,0 +1,23 @@ | |||
'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', | |||
source: 'src', | |||
img: 'src', | |||
image: 'xlink:href' | |||
} | |||
} |
@@ -0,0 +1,93 @@ | |||
'use strict' | |||
const path = require('path') | |||
const utils = require('./utils') | |||
const config = require('../config') | |||
const vueLoaderConfig = require('./vue-loader.conf') | |||
const vuxLoader = require('vux-loader') | |||
function resolve (dir) { | |||
return path.join(__dirname, '..', dir) | |||
} | |||
let webpackConfig = { | |||
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')] | |||
}, | |||
{ | |||
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]') | |||
} | |||
} | |||
] | |||
} | |||
} | |||
module.exports = vuxLoader.merge(webpackConfig, { | |||
plugins: [ | |||
'vux-ui', | |||
'progress-bar', | |||
{ | |||
name: 'duplicate-style', | |||
options: { | |||
cssProcessorOptions : { | |||
safe: true, | |||
zindex: false, | |||
autoprefixer: { | |||
add: true, | |||
browsers: [ | |||
'iOS >= 7', | |||
'Android >= 4.1' | |||
] | |||
} | |||
} | |||
} | |||
} | |||
] | |||
}) |
@@ -0,0 +1,79 @@ | |||
'use strict' | |||
const utils = require('./utils') | |||
const webpack = require('webpack') | |||
const config = require('../config') | |||
const merge = require('webpack-merge') | |||
const baseWebpackConfig = require('./webpack.base.conf') | |||
const HtmlWebpackPlugin = require('html-webpack-plugin') | |||
const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') | |||
const portfinder = require('portfinder') | |||
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: true, | |||
hot: true, | |||
compress: true, | |||
host: process.env.HOST || config.dev.host, | |||
port: process.env.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 | |||
}), | |||
] | |||
}) | |||
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://${config.dev.host}:${port}`], | |||
messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`], | |||
}, | |||
onErrors: config.dev.notifyOnErrors | |||
? utils.createNotifierCallback() | |||
: undefined | |||
})) | |||
resolve(devWebpackConfig) | |||
} | |||
}) | |||
}) |
@@ -0,0 +1,118 @@ | |||
'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 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 | |||
}), | |||
// UglifyJs do not support ES6+, you can also use babel-minify for better treeshaking: https://github.com/babel/minify | |||
new webpack.optimize.UglifyJsPlugin({ | |||
compress: { | |||
warnings: false | |||
}, | |||
sourceMap: config.build.productionSourceMap, | |||
parallel: true | |||
}), | |||
// extract css into its own file | |||
new ExtractTextPlugin({ | |||
filename: utils.assetsPath('css/[name].[contenthash].css'), | |||
// set the following option to `true` if you want to extract CSS from | |||
// codesplit chunks into this main css file as well. | |||
// This will result in *all* of your app's CSS being loaded upfront. | |||
allChunks: false, | |||
}), | |||
// 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 vender 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: function (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.bundleAnalyzerReport) { | |||
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin | |||
webpackConfig.plugins.push(new BundleAnalyzerPlugin()) | |||
} | |||
module.exports = webpackConfig |
@@ -0,0 +1,8 @@ | |||
'use strict' | |||
const merge = require('webpack-merge') | |||
const prodEnv = require('./prod.env') | |||
module.exports = merge(prodEnv, { | |||
NODE_ENV: '"development"', | |||
BASE_API: '"http://10.209.96.72:8080/"', | |||
}) |
@@ -0,0 +1,74 @@ | |||
'use strict' | |||
// Template version: 1.2.4 | |||
// 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: '0.0.0.0', // can be overwritten by process.env.HOST | |||
port: 8011, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined | |||
autoOpenBrowser: false, | |||
errorOverlay: true, | |||
notifyOnErrors: true, | |||
poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions- | |||
// Use Eslint Loader? | |||
// If true, your code will be linted during bundling and | |||
// linting errors and warnings will be shown in the console. | |||
useEslint: false, | |||
// If true, eslint errors and warnings will also be shown in the error overlay | |||
// in the browser. | |||
showEslintErrorsInOverlay: false, | |||
/** | |||
* Source Maps | |||
*/ | |||
// https://webpack.js.org/configuration/devtool/#development | |||
devtool: '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, | |||
// CSS Sourcemaps off by default because relative paths are "buggy" | |||
// with this option, according to the CSS-Loader README | |||
// (https://github.com/webpack/css-loader#sourcemaps) | |||
// In our experience, they generally work as expected, | |||
// just be aware of this issue when enabling this option. | |||
cssSourceMap: false, | |||
}, | |||
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', | |||
// 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 | |||
} | |||
} |
@@ -0,0 +1,5 @@ | |||
'use strict' | |||
module.exports = { | |||
NODE_ENV: '"production"', | |||
BASE_API: '"http://ota.neusoft.com/"' | |||
} |
@@ -0,0 +1,12 @@ | |||
<!DOCTYPE html> | |||
<html> | |||
<head> | |||
<meta charset="utf-8"> | |||
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"> | |||
<title>东软智能云POS管理系统</title> | |||
</head> | |||
<body> | |||
<div id="app-box"></div> | |||
<!-- built files will be auto injected --> | |||
</body> | |||
</html> |
@@ -0,0 +1,73 @@ | |||
{ | |||
"name": "posweb", | |||
"version": "1.0.0", | |||
"description": "A Vue.js project", | |||
"author": "", | |||
"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": { | |||
"element-ui": "^2.3.7", | |||
"fastclick": "^1.0.6", | |||
"js-cookie": "^2.2.0", | |||
"vue": "^2.5.2", | |||
"vue-router": "^3.0.1", | |||
"vuex": "^2.5.0", | |||
"vuex-i18n": "^1.3.1", | |||
"vux": "^2.2.0", | |||
"vux-uploader": "^0.1.9" | |||
}, | |||
"devDependencies": { | |||
"autoprefixer": "^7.1.2", | |||
"babel-core": "^6.22.1", | |||
"babel-loader": "^7.1.1", | |||
"babel-plugin-transform-runtime": "^6.22.0", | |||
"babel-preset-env": "^1.3.2", | |||
"babel-preset-es2015": "^6.24.1", | |||
"babel-preset-stage-2": "^6.22.0", | |||
"babel-register": "^6.22.0", | |||
"chalk": "^2.0.1", | |||
"connect-history-api-fallback": "^1.3.0", | |||
"copy-webpack-plugin": "^4.0.1", | |||
"css-loader": "^0.28.0", | |||
"eventsource-polyfill": "^0.9.6", | |||
"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", | |||
"less": "^2.7.1", | |||
"less-loader": "^2.2.3", | |||
"node-notifier": "^5.1.2", | |||
"optimize-css-assets-webpack-plugin": "^3.2.0", | |||
"ora": "^1.2.0", | |||
"portfinder": "^1.0.13", | |||
"postcss-import": "^11.0.0", | |||
"postcss-loader": "^2.0.8", | |||
"rimraf": "^2.6.0", | |||
"semver": "^5.3.0", | |||
"shelljs": "^0.7.6", | |||
"url-loader": "^0.5.8", | |||
"vue-loader": "^13.3.0", | |||
"vue-style-loader": "^3.0.1", | |||
"vue-template-compiler": "^2.5.2", | |||
"vux-loader": "^1.0.56", | |||
"webpack": "^3.6.0", | |||
"webpack-bundle-analyzer": "^2.9.0", | |||
"webpack-dev-middleware": "^1.10.0", | |||
"webpack-dev-server": "^2.9.1", | |||
"webpack-hot-middleware": "^2.16.1", | |||
"webpack-merge": "^4.1.0", | |||
"yaml-loader": "^0.4.0" | |||
}, | |||
"engines": { | |||
"node": ">= 4.0.0", | |||
"npm": ">= 3.0.0" | |||
}, | |||
"browserslist": [ | |||
"iOS >= 7", | |||
"Android >= 4.1" | |||
] | |||
} |
@@ -0,0 +1,27 @@ | |||
<template> | |||
<div id="app"> | |||
<router-view></router-view> | |||
</div> | |||
</template> | |||
<script> | |||
export default { | |||
name: 'app' | |||
} | |||
</script> | |||
<style lang="less"> | |||
@import '~vux/src/styles/reset.less'; | |||
body { | |||
background-color: #fbf9fe; | |||
} | |||
.el-message{ | |||
width: 90%; | |||
min-width: auto; | |||
} | |||
.el-message-box{ | |||
width: 90%; | |||
width: auto; | |||
} | |||
</style> |
@@ -0,0 +1,65 @@ | |||
//全局通用 数据 | |||
import fetch from '@/utils/fetch' | |||
//获取上传授权 | |||
export function getOSSSignature(type) { | |||
return fetch({ | |||
url: '/unionService/AliOSS/signature', | |||
method: 'post', | |||
params: { | |||
dir: type | |||
}, | |||
withCredentials: false | |||
}) | |||
} | |||
//获取资源下载OSS地址接口 | |||
export function getMediaResoures() { | |||
return fetch({ | |||
url: '/unionService/AliOSS/mediaResource/oss/url', | |||
method: 'get', | |||
}) | |||
} | |||
//获取更新包下载OSS地址接口 | |||
export function getPackageResoures() { | |||
return fetch({ | |||
url: '/unionService/AliOSS/upgradePackage/oss/url', | |||
method: 'get', | |||
}) | |||
} | |||
//获取配置下载OSS地址接口 | |||
export function getConfigResoures() { | |||
return fetch({ | |||
url: '/unionService/AliOSS/deviceConfig/oss/url', | |||
method: 'get', | |||
}) | |||
} | |||
//获取配置下载OSS地址接口 | |||
export function getLogoResoures() { | |||
return fetch({ | |||
url: '/unionService/AliOSS/store/logo/oss/url', | |||
method: 'get', | |||
}) | |||
} | |||
//获取支付二维码下载OSS地址接口 | |||
export function qrcodeResoures() { | |||
return fetch({ | |||
url: '/unionService/AliOSS/trade/oss/url', | |||
method: 'get', | |||
}) | |||
} | |||
//获取支付二维码下载OSS地址接口 | |||
export function getImgResoures() { | |||
return fetch({ | |||
url: '/unionService/AliOSS/goods/oss/url', | |||
method: 'get', | |||
}) | |||
} | |||
//获取省市 | |||
export function getCitys(id) { | |||
return fetch({ | |||
url: '/service-org/Region/getCitys?parentId='+id, | |||
method: 'get', | |||
}) | |||
} |
@@ -0,0 +1,62 @@ | |||
import fetch from '@/utils/fetch' | |||
//列表商品 | |||
export function goodsList(params) { | |||
return fetch({ | |||
url: '/service-goods/catering/menus', | |||
method: 'get', | |||
params | |||
}) | |||
} | |||
//添加商品 | |||
export function goodsAdd(params) { | |||
return fetch({ | |||
url: '/service-goods/catering/menus', | |||
method: 'post', | |||
data: params | |||
}) | |||
} | |||
//修改商品 | |||
export function goodsEdit(params) { | |||
return fetch({ | |||
url: '/service-goods/catering/menus', | |||
method: 'patch', | |||
data: params, | |||
// params: params | |||
}) | |||
} | |||
//删除商品 | |||
export function goodsDel(id) { | |||
return fetch({ | |||
url: '/service-goods/catering/menus/' + id, | |||
method: 'delete', | |||
}) | |||
} | |||
//菜品类别列表 | |||
export function goodsCategories(id) { | |||
return fetch({ | |||
url: '/service-goods/catering/menus/categories?preset=1', | |||
method: 'get', | |||
}) | |||
} | |||
// /菜品标签列表 | |||
export function goodsTags(id) { | |||
return fetch({ | |||
url: '/service-goods/catering/menus/tags?preset=1', | |||
method: 'get', | |||
}) | |||
} | |||
//单菜品查询 | |||
// /菜品标签列表 | |||
export function goodsFind(id) { | |||
return fetch({ | |||
url: '/service-goods/catering/menus/'+id, | |||
method: 'get', | |||
}) | |||
} |
@@ -0,0 +1,46 @@ | |||
import fetch from '@/utils/fetch' | |||
//列表类型 | |||
export function typeList(params) { | |||
return fetch({ | |||
url: '/service-goods/category/', | |||
method: 'get', | |||
params | |||
}) | |||
} | |||
//添加类别 | |||
export function typeAdd(params) { | |||
return fetch({ | |||
url: '/service-goods/category', | |||
method: 'post', | |||
data: params | |||
}) | |||
} | |||
//修改类型 | |||
export function typeEdit(id,params) { | |||
return fetch({ | |||
url: '/service-goods/category/' + id, | |||
method: 'put', | |||
data: params, | |||
// params: params | |||
}) | |||
} | |||
//修改类型 | |||
export function typeOrderUpdate(params) { | |||
return fetch({ | |||
url: '/service-goods/category/re-order/', | |||
method: 'post', | |||
data: params, | |||
// params: params | |||
}) | |||
} | |||
//删除商品 | |||
export function typeDel(id) { | |||
return fetch({ | |||
url: '/service-goods/category/catering/' + id, | |||
method: 'delete', | |||
}) | |||
} |
@@ -0,0 +1,16 @@ | |||
import fetch from '@/utils/fetch' | |||
export function login(userinfo) { | |||
return fetch({ | |||
url: '/service-user/login', | |||
method: 'post', | |||
data: userinfo | |||
}) | |||
} | |||
export function getInfo() { | |||
return fetch({ | |||
url: '/service-user/user/me', | |||
method: 'get' | |||
}) | |||
} | |||
@@ -0,0 +1,46 @@ | |||
import fetch from '@/utils/fetch' | |||
//订单首页列表 | |||
export function orderIndex(par) { | |||
return fetch({ | |||
url: '/unionService/orderStatistics/shopOrderSummary', | |||
method: 'get', | |||
params:par | |||
}) | |||
} | |||
//订单交易流水列表 | |||
export function orderflow(par) { | |||
return fetch({ | |||
url: '/unionService/orderStatistics/shopOrderDetails', | |||
method: 'get', | |||
params:par | |||
}) | |||
} | |||
//订单交易流水列表 | |||
export function orderStatistics(par) { | |||
return fetch({ | |||
url: '/service-trade/tradeStatistics/payChannelSummary', | |||
method: 'get', | |||
params:par | |||
}) | |||
} | |||
//日报统计 | |||
//订单交易流水列表 | |||
export function orderDatestatistics(par) { | |||
return fetch({ | |||
url: '/unionService/tradeStatistics/daily', | |||
method: 'get', | |||
params:par | |||
}) | |||
} | |||
//占比统计 | |||
export function orderRationstatistics(par) { | |||
return fetch({ | |||
url: '/service-trade/tradeStatistics/payChannelProportion', | |||
method: 'get', | |||
params:par | |||
}) | |||
} |
@@ -0,0 +1,49 @@ | |||
import fetch from '@/utils/fetch' | |||
// 门店列表 | |||
export function storeList(params) { | |||
return fetch({ | |||
url: '/service-org/shop/list', | |||
method: 'get', | |||
params | |||
}) | |||
} | |||
// 门店添加 | |||
export function storeAdd(params) { | |||
return fetch({ | |||
url: '/unionService/shop/shop', | |||
method: 'post', | |||
data: params | |||
}) | |||
} | |||
// 门店查询 | |||
export function storeFind(id) { | |||
return fetch({ | |||
url: '/service-org/shop/detail?shopId=' + id, | |||
method: 'get' | |||
}) | |||
} | |||
// 门店修改 | |||
export function storeEdit(par) { | |||
return fetch({ | |||
url: '/unionService/shop/shop', | |||
method: 'put', | |||
data: par | |||
}) | |||
} | |||
// 门店关联ota | |||
export function storeOta(par) { | |||
return fetch({ | |||
url: '/unionService/device/store', | |||
method: 'put', | |||
data: par | |||
}) | |||
} | |||
// 门店删除 | |||
export function storeDel(id) { | |||
return fetch({ | |||
url: '/service-org/shop/delete?shopId=' + id, | |||
method: 'DELETE' | |||
}) | |||
} |
@@ -0,0 +1,261 @@ | |||
<template> | |||
<div> | |||
<x-header :left-options="{backText: ''}" style="width: 100%;position: fixed;left: 0px;top: 0px;z-index: 100;"> | |||
商品添加 | |||
</x-header> | |||
<div class="app-container" style="padding: 60px 0px 10px 0px;height: 100%"> | |||
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" size="small"> | |||
<el-form-item label="门店" prop="shop" v-if="this.usertype=='user'"> | |||
<el-select v-model="ruleForm.shop" placeholder="门店"> | |||
<el-option | |||
v-for="item in shopList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
<el-form-item label="菜品名" prop="name"> | |||
<el-input v-model.trim="ruleForm.name" style="width: 90%" placeholder="最多40字"></el-input> | |||
</el-form-item> | |||
<el-form-item label="菜品价格" prop="price"> | |||
<el-input v-model.trim="ruleForm.price" style="width: 90%"></el-input> | |||
</el-form-item> | |||
<el-form-item label="菜品类别" prop="category"> | |||
<el-select v-model="ruleForm.category" placeholder="请选择"> | |||
<el-option | |||
v-for="item in cateType" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"/> | |||
</el-select> | |||
</el-form-item> | |||
<el-form-item label="菜品图片" style="width: 50%" prop="image"> | |||
<el-tag type="warning">图片最大200kb,建议宽高174*143</el-tag> | |||
<el-upload | |||
id="img" | |||
class="avatar-uploader" | |||
:action="updata.url" | |||
:show-file-list="true" | |||
:fileList="fileList" | |||
:on-success="handleAvatarSuccess" | |||
:before-upload="beforeAvatarUpload" | |||
:data="updata.data" | |||
accept="image/*" | |||
> | |||
<img v-if="ruleForm.image" :src="ruleForm.image+'?x-oss-process=image/resize,m_fixed,h_143,w_174'" class="avatar"> | |||
<i v-else class="el-icon-plus avatar-uploader-icon"></i> | |||
</el-upload> | |||
</el-form-item> | |||
<el-form-item label="菜品标签" prop="tags"> | |||
<el-checkbox-group v-model="ruleForm.tags"> | |||
<el-checkbox v-for="item in tagsTyes" | |||
:key="item.id" | |||
:label="item.id" | |||
>{{item.name}} | |||
</el-checkbox> | |||
</el-checkbox-group> | |||
</el-form-item> | |||
<el-form-item label="是否上架" prop="onSale"> | |||
<el-radio-group v-model="ruleForm.onSale"> | |||
<el-radio :label="0">下架</el-radio> | |||
<el-radio :label="1">上架</el-radio> | |||
</el-radio-group> | |||
</el-form-item> | |||
<el-form-item> | |||
<el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button> | |||
<el-button @click="resetForm('ruleForm')">重置</el-button> | |||
</el-form-item> | |||
</el-form> | |||
</div> | |||
</div> | |||
</template> | |||
<script> | |||
import {goodsCategories, goodsTags, goodsAdd} from '@/api/goods' | |||
import {getOSSSignature, getImgResoures} from '@/api/comm' | |||
import {storeList} from '@/api/store' | |||
import {typeList} from "@/api/goodstype"; | |||
export default { | |||
created() { | |||
goodsTags().then(response => { | |||
this.tagsTyes = response.result | |||
}) | |||
//上传签名初始化 | |||
getOSSSignature("img").then(response => { | |||
this.updata.data.policy = response.result.policy | |||
this.updata.data.OSSAccessKeyId = response.result.accessid | |||
this.updata.data.success_action_status = '200' | |||
this.updata.data.signature = response.result.signature | |||
this.updata.url = response.result.host | |||
}) | |||
getImgResoures().then(res => { | |||
this.mediaUrl = res.result | |||
}) | |||
if (this.usertype == 'user') { | |||
//多个门店选择 | |||
storeList().then(response => { | |||
this.shopList = response.result.rows | |||
this.ruleForm.shop = this.shopList[0]['id'] | |||
}) | |||
}else{ | |||
typeList({ | |||
store:this.ruleForm.shop, | |||
industry: '1', | |||
}).then(response => { | |||
this.cateType = response.result | |||
this.ruleForm.category='' | |||
}); | |||
} | |||
this.listLoading = false | |||
}, | |||
data() { | |||
return { | |||
usertype: this.$store.getters.usertype, | |||
shopList: [], | |||
fileList:[], | |||
updata: { | |||
url: '', | |||
data: {} | |||
}, | |||
ruleForm: { | |||
name: '', | |||
price: "", | |||
category: "", | |||
tags: [], | |||
onSale: 1, | |||
image: "", | |||
// org: '', | |||
shop: '', | |||
}, | |||
rules: { | |||
shop: [ | |||
{required: true, message: '请选择门店', trigger: 'blur'}, | |||
], | |||
name: [ | |||
{required: true, message: '请输入菜品名称', trigger: 'blur'}, | |||
{max: 40, message: '最多40字', trigger: 'blur'}, | |||
], | |||
price: [ | |||
{required: true, message: '请输入价格', trigger: 'blur'}, | |||
{pattern: /^(0|[1-9][0-9]{0,9})(\.[0-9]{1,2})?$/, message: '请输入正确的价格', trigger: 'blur'} | |||
], | |||
category: [ | |||
{required: true, message: '请输选择类别', trigger: 'blur'}, | |||
], | |||
}, | |||
cateType: [], | |||
tagsTyes: [], | |||
}; | |||
}, | |||
watch:{ | |||
"ruleForm.shop":function () { | |||
if(this.ruleForm.shop){ | |||
typeList({ | |||
store:this.ruleForm.shop, | |||
industry: '1', | |||
}).then(response => { | |||
this.cateType = response.result | |||
this.ruleForm.category='' | |||
}); | |||
}else{ | |||
this.cateType=[] | |||
} | |||
this.$refs['ruleForm'].clearValidate(); | |||
} | |||
}, | |||
methods: { | |||
submitForm(formName) { | |||
this.$refs[formName].validate((valid) => { | |||
if (valid) { | |||
goodsAdd(this.ruleForm).then(res => { | |||
var router = this.$router; | |||
this.$message({ | |||
message: '操作成功', | |||
type: 'success', | |||
duration: 1000, | |||
onClose: function () { | |||
router.push({path: 'index'}) | |||
} | |||
}); | |||
}) | |||
} else { | |||
console.log('error submit!!', this.ruleForm.mediaUuid); | |||
return false; | |||
} | |||
}); | |||
}, | |||
resetForm(formName) { | |||
this.$refs[formName].resetFields(); | |||
}, | |||
handleAvatarSuccess(res, file) { | |||
this.filename = file.name | |||
this.ruleForm.image = this.mediaUrl + file.uid | |||
this.fileList=[] | |||
}, | |||
beforeAvatarUpload(file) { | |||
// var reader = new FileReader(); | |||
//// console.log(file,reader) | |||
// reader.readAsDataURL(file); | |||
// reader.onload = function(theFile) { | |||
// var image = new Image(); | |||
// image.src = theFile.target.result; | |||
// image.onload = function() { | |||
// console.log("图片的宽度为"+this.width+",长度为"+this.height); | |||
// }; | |||
// }; | |||
// const isLt2M = file.size / 1024 < 200; | |||
// if (!isLt2M) { | |||
// this.$message.error('上传图片大小不能超过 200kb!'); | |||
// return false | |||
// } | |||
this.updata.data.key = "img/" + file.uid | |||
return true | |||
}, | |||
} | |||
} | |||
</script> | |||
<style> | |||
.el-transfer-panel { | |||
width: 40%; | |||
} | |||
.avatar-uploader .el-upload { | |||
border: 1px dashed #d9d9d9; | |||
border-radius: 6px; | |||
cursor: pointer; | |||
position: relative; | |||
overflow: hidden; | |||
} | |||
.avatar-uploader .el-upload:hover { | |||
border-color: #409EFF; | |||
} | |||
.avatar-uploader-icon { | |||
font-size: 28px; | |||
color: #8c939d; | |||
width: 11rem; | |||
height:9rem; | |||
line-height: 150px; | |||
text-align: center; | |||
} | |||
.avatar { | |||
width: 11rem; | |||
height:9rem; | |||
display: block; | |||
} | |||
#img{ | |||
width:11rem | |||
} | |||
</style> |
@@ -0,0 +1,221 @@ | |||
<template> | |||
<div> | |||
<x-header :left-options="{backText: ''}" style="width: 100%;position: fixed;left: 0px;top: 0px;z-index: 100;"> | |||
商品修改 | |||
</x-header> | |||
<div class="app-container" style="padding: 60px 0px 10px 0px;height: 100%"> | |||
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm" size="small"> | |||
<el-form-item label="菜品名" prop="name"> | |||
<el-input v-model.trim="ruleForm.name" style="width: 90%" placeholder="最多40字"></el-input> | |||
</el-form-item> | |||
<el-form-item label="菜品价格" prop="price"> | |||
<el-input v-model.trim="ruleForm.price" style="width: 90%"></el-input> | |||
</el-form-item> | |||
<el-form-item label="菜品类别" prop="category"> | |||
<el-select v-model="ruleForm.category" placeholder="请选择"> | |||
<el-option | |||
v-for="item in cateType" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"/> | |||
</el-select> | |||
</el-form-item> | |||
<el-form-item label="菜品图片" style="width: 50%" prop="image"> | |||
<el-tag type="warning">图片最大200kb,建议宽高174*143</el-tag> | |||
<el-upload | |||
id="img" | |||
class="avatar-uploader" | |||
:action="updata.url" | |||
:show-file-list="true" | |||
:fileList="fileList" | |||
:on-success="handleAvatarSuccess" | |||
:before-upload="beforeAvatarUpload" | |||
:data="updata.data" | |||
accept="image/*" | |||
> | |||
<img v-if="ruleForm.image" :src="ruleForm.image+'?x-oss-process=image/resize,m_fixed,h_143,w_174'" class="avatar"> | |||
<i v-else class="el-icon-plus avatar-uploader-icon"></i> | |||
</el-upload> | |||
</el-form-item> | |||
<el-form-item label="菜品标签" prop="tags"> | |||
<el-checkbox-group v-model="ruleForm.tags"> | |||
<el-checkbox v-for="item in tagsTyes" | |||
:key="item.id" | |||
:label="item.id" | |||
>{{item.name}} | |||
</el-checkbox> | |||
</el-checkbox-group> | |||
</el-form-item> | |||
<el-form-item label="是否上架" prop="onSale"> | |||
<el-radio-group v-model="ruleForm.onSale"> | |||
<el-radio :label="0">下架</el-radio> | |||
<el-radio :label="1">上架</el-radio> | |||
</el-radio-group> | |||
</el-form-item> | |||
<el-form-item> | |||
<el-button type="primary" @click="submitForm('ruleForm')">修改</el-button> | |||
</el-form-item> | |||
</el-form> | |||
</div> | |||
</div> | |||
</template> | |||
<script> | |||
import {goodsCategories, goodsTags, goodsEdit, goodsFind} from '@/api/goods' | |||
import {getOSSSignature, getImgResoures} from '@/api/comm' | |||
import {typeList} from "@/api/goodstype"; | |||
export default { | |||
created() { | |||
//初始化 | |||
// goodsCategories().then(response => { | |||
// this.cateType = response.result | |||
// }) | |||
goodsTags().then(response => { | |||
this.tagsTyes = response.result | |||
}) | |||
//上传签名初始化 | |||
getOSSSignature("img").then(response => { | |||
this.updata.data.policy = response.result.policy | |||
this.updata.data.OSSAccessKeyId = response.result.accessid | |||
this.updata.data.success_action_status = '200' | |||
this.updata.data.signature = response.result.signature | |||
this.updata.url = response.result.host | |||
}) | |||
getImgResoures().then(res => { | |||
this.mediaUrl = res.result | |||
}) | |||
goodsFind(this.$route.params.id).then(response => { | |||
this.ruleForm = response.result | |||
let put = [] | |||
for (var i in response.result.tags) { | |||
put.push(parseInt(i)); | |||
} | |||
this.ruleForm.tags = put | |||
}) | |||
}, | |||
data() { | |||
return { | |||
fileList:[], | |||
updata: { | |||
url: '', | |||
data: {} | |||
}, | |||
ruleForm: { | |||
name: '', | |||
price: "", | |||
category: "", | |||
tags: [], | |||
onSale: 1, | |||
image: "", | |||
org: '', | |||
shop: '', | |||
}, | |||
rules: { | |||
name: [ | |||
{required: true, message: '请输入菜品名称', trigger: 'blur'}, | |||
{max: 40, message: '最多40字', trigger: 'blur'}, | |||
], | |||
price: [ | |||
{required: true, message: '请输入价格', trigger: 'blur'}, | |||
{pattern: /^(0|[1-9][0-9]{0,9})(\.[0-9]{1,2})?$/, message: '请输入正确的价格', trigger: 'blur'} | |||
], | |||
category: [ | |||
{required: true, message: '请输选择类别', trigger: 'blur'}, | |||
], | |||
}, | |||
cateType: [], | |||
tagsTyes: [], | |||
}; | |||
}, | |||
watch:{ | |||
"ruleForm.shop":function () { | |||
typeList({ | |||
store:this.ruleForm.shop, | |||
industry: '1', | |||
}).then(response => { | |||
this.cateType = response.result | |||
}); | |||
} | |||
}, | |||
methods: { | |||
submitForm(formName) { | |||
this.$refs[formName].validate((valid) => { | |||
if (valid) { | |||
goodsEdit(this.ruleForm).then(res => { | |||
var router = this.$router; | |||
this.$message({ | |||
message: '操作成功', | |||
type: 'success', | |||
duration: 1000, | |||
onClose: function () { | |||
router.push({path: '../index'}) | |||
} | |||
}); | |||
}) | |||
} else { | |||
console.log('error submit!!', this.ruleForm.mediaUuid); | |||
return false; | |||
} | |||
}); | |||
}, | |||
resetForm(formName) { | |||
this.$refs[formName].resetFields(); | |||
}, | |||
handleAvatarSuccess(res, file) { | |||
this.filename = file.name | |||
this.ruleForm.image = this.mediaUrl + file.uid | |||
this.fileList=[] | |||
}, | |||
beforeAvatarUpload(file) { | |||
// const isLt2M = file.size / 1024 < 200; | |||
// if (!isLt2M) { | |||
// this.$message.error('上传图片大小不能超过 200kb!'); | |||
// return false | |||
// } | |||
this.updata.data.key = "img/" + file.uid | |||
return true | |||
}, | |||
} | |||
} | |||
</script> | |||
<style> | |||
.el-transfer-panel { | |||
width: 40%; | |||
} | |||
.avatar-uploader .el-upload { | |||
border: 1px dashed #d9d9d9; | |||
border-radius: 6px; | |||
cursor: pointer; | |||
position: relative; | |||
overflow: hidden; | |||
} | |||
.avatar-uploader .el-upload:hover { | |||
border-color: #409EFF; | |||
} | |||
.avatar-uploader-icon { | |||
font-size: 28px; | |||
color: #8c939d; | |||
width: 174px; | |||
height: 143px; | |||
line-height: 150px; | |||
text-align: center; | |||
} | |||
.avatar { | |||
width: 174px; | |||
height: 143px; | |||
display: block; | |||
} | |||
#img{ | |||
width:11rem | |||
} | |||
</style> |
@@ -0,0 +1,124 @@ | |||
<template> | |||
<div> | |||
<x-header :left-options="{backText: ''}" style="width: 100%;position: fixed;left: 0px;top: 0px;z-index: 100;"> | |||
商品管理 | |||
</x-header> | |||
<div style="padding: 50px 0px 51px 0px;height: 100%"> | |||
<flexbox style="margin-bottom:5px" orient="vertical"> | |||
<flexbox-item v-if="usertype=='user'"> | |||
<selector title="选择门店" :options="opts" v-model="listQuery.shopId" | |||
:value-map="['id','name']" @on-change="fetchData"></selector> | |||
</flexbox-item> | |||
<flexbox-item> | |||
<router-link to="add"> | |||
<el-button type="primary" style="margin-left: 10px" size="small">添加商品</el-button> | |||
</router-link> | |||
<router-link to="type"> | |||
<el-button type="success" size="small">商品分类</el-button> | |||
</router-link> | |||
</flexbox-item> | |||
</flexbox> | |||
<x-table full-bordered class="goodstable"> | |||
<thead> | |||
<tr> | |||
<th>名称</th> | |||
<th width="20%">价格</th> | |||
<th width="20%">类别</th> | |||
<th width="15%">状态</th> | |||
<th width="15%">操作</th> | |||
</tr> | |||
</thead> | |||
<tbody> | |||
<tr v-for="vo in list"> | |||
<td>{{vo.name}}</td> | |||
<td>{{vo.price}}</td> | |||
<td>{{vo.cateName}}</td> | |||
<td>{{onSaleType[vo.onSale]}}</td> | |||
<td> | |||
<router-link :to="{ path: 'update/'+vo.id}"> <el-button type="text" size="small">编辑</el-button> </router-link> | |||
</td> | |||
</tr> | |||
<tr v-if="list.length==0"> | |||
<td colspan="5">暂无数据</td> | |||
</tr> | |||
</tbody> | |||
</x-table> | |||
</div> | |||
<myfooter activeIndex="1"> | |||
</myfooter> | |||
</div> | |||
</template> | |||
<script> | |||
import {XTable, Tabbar, TabbarItem, Flexbox, FlexboxItem, Selector} from 'vux' | |||
import {goodsList, goodsCategories, goodsTags, goodsDel} from '@/api/goods' | |||
import Myfooter from '@/components/layout/Myfooter' | |||
import {storeList} from '@/api/store' | |||
export default { | |||
components: { | |||
XTable, Tabbar, TabbarItem, Flexbox, FlexboxItem, Selector, Myfooter | |||
}, | |||
data() { | |||
return { | |||
list: [], | |||
listQuery: { | |||
id: '', | |||
shopId: '', | |||
name: '', | |||
categories: '', | |||
tags: '', | |||
onSale: '', | |||
limit: 25, | |||
offset: 0 | |||
}, | |||
cateType: [], | |||
opts: [], | |||
onSaleType: {1: '上架', 0: '下架'}, | |||
usertype: this.$store.getters.usertype, | |||
} | |||
}, | |||
created() { | |||
console.log(this.usertype) | |||
if (this.usertype == "user") { | |||
storeList().then(response => { | |||
if (response.result.rows.length > 0) { | |||
this.opts = response.result.rows | |||
this.listQuery.shopId = this.opts[0]['id'] | |||
} | |||
}).then(() => { | |||
this.fetchData() | |||
}) | |||
} else { | |||
this.fetchData() | |||
} | |||
}, | |||
methods: { | |||
fetchData() { | |||
goodsList(this.listQuery).then(response => { | |||
this.list = response.result.data | |||
}) | |||
}, | |||
} | |||
} | |||
</script> | |||
<style> | |||
.headercss { | |||
width: 100%; | |||
position: absolute; | |||
left: 0px; | |||
top: 0px; | |||
z-index: 100; | |||
} | |||
.goodstable { | |||
font-size: 14px; | |||
} | |||
</style> |
@@ -0,0 +1,206 @@ | |||
<template> | |||
<div> | |||
<x-header :left-options="{backText: ''}" style="width: 100%;position: fixed;left: 0px;top: 0px;z-index: 100;"> | |||
商品分类 | |||
</x-header> | |||
<div class="app-container" style="padding: 60px 0px 10px 0px;height: 100%"> | |||
<flexbox style="margin-bottom:5px" orient="vertical"> | |||
<flexbox-item v-if="usertype=='user'"> | |||
<selector title="选择门店" :options="shopList" v-model="ruleForm.store" @on-change="selectlist" | |||
:value-map="['id','name']"></selector> | |||
</flexbox-item> | |||
<flexbox-item> | |||
<el-button type="primary" style="margin-left: 10px" size="small" @click="addType()">添加分类</el-button> | |||
</flexbox-item> | |||
</flexbox> | |||
<!--<el-form :model="ruleForm" ref="ruleForm" label-width="20px" v-if="usertype!='admin'">--> | |||
<!--<selector title="选择门店" :options="shopList" v-model="ruleForm.store"--> | |||
<!--:value-map="['id','name']"></selector>--> | |||
<!--</el-form>--> | |||
<!--<div class="listbutton">--> | |||
<!--<el-button type="primary" @click="addType()" style="margin: 0px 0 10px 10px;">添加分类</el-button>--> | |||
<!--</div>--> | |||
<el-dialog title="" :visible.sync="dialogFormVisible" width="90%" :before-close="handleClose" > | |||
<el-form :model="form" :rules="rule" ref="form" size="mini"> | |||
<el-form-item label="类别名称" prop="name"> | |||
<el-input v-model.trim="form.name"></el-input> | |||
</el-form-item> | |||
</el-form> | |||
<div slot="footer" class="dialog-footer"> | |||
<el-button @click="handleClose">取 消</el-button> | |||
<el-button type="primary" @click="subTable">确 定</el-button> | |||
</div> | |||
</el-dialog> | |||
<div> | |||
<el-table :data="list" element-loading-text="拼命加载中" fit size="mini" class="goodstypetable"> | |||
<el-table-column align="center" label='类别名称' prop="name"> | |||
</el-table-column> | |||
<el-table-column align="center" label='排序'> | |||
<template slot-scope="scope"> | |||
<el-button icon="el-icon-upload2" type="text" style="font-size: 20px" | |||
:disabled="scope.$index==0" @click="up(scope.$index)"></el-button> | |||
<el-button icon="el-icon-download" type="text" style="font-size: 20px" | |||
:disabled="scope.$index==list.length-1" @click="down(scope.$index)"></el-button> | |||
</template> | |||
</el-table-column> | |||
<el-table-column align="center" label='操作'> | |||
<template slot-scope="scope"> | |||
<el-button type="text" size="mini" @click="updateTable(scope.row)">编辑</el-button> | |||
<el-button type="text" size="mini" @click="delTable(scope.row.id)">删除</el-button> | |||
</template> | |||
</el-table-column> | |||
</el-table> | |||
</div> | |||
</div> | |||
</div> | |||
</template> | |||
<script> | |||
import {XTable, Tabbar, TabbarItem, Flexbox, FlexboxItem, Selector} from 'vux' | |||
import {storeList} from "@/api/store"; | |||
import {typeAdd, typeList, typeEdit, typeDel, typeOrderUpdate} from "@/api/goodstype"; | |||
export default { | |||
components: { | |||
XTable, Tabbar, TabbarItem, Flexbox, FlexboxItem, Selector | |||
}, | |||
created() { | |||
if (this.usertype != 'admin') { | |||
storeList({org: this.ruleForm.org}).then(response => { | |||
this.shopList = response.result.rows; | |||
this.ruleForm.store = this.shopList[0].id; | |||
this.selectlist() | |||
}); | |||
} else { | |||
this.selectlist() | |||
} | |||
}, | |||
data() { | |||
return { | |||
dialogVisible: false, | |||
usertype: this.$store.getters.usertype, | |||
ruleForm: { | |||
store: '', | |||
industry: '1', | |||
}, | |||
form: { | |||
name: '', | |||
industry: '1', | |||
}, | |||
manageList: [], | |||
shopList: [], | |||
list: [], | |||
dialogFormVisible: false, | |||
rule: { | |||
name: [ | |||
{required: true, message: '请填写类别名称', trigger: 'blur'}, | |||
{min: 1, max: 4, message: '最多4个字', trigger: 'blur'}, | |||
], | |||
}, | |||
edit: false, | |||
upid: "", | |||
} | |||
}, | |||
methods: { | |||
handleClose(){ | |||
this.$refs['form'].clearValidate(); | |||
this.dialogFormVisible = false | |||
}, | |||
up(index) { | |||
var nowObj = this.list[index] | |||
var upObj = this.list[index - 1] | |||
this.$set(this.list, index - 1, nowObj) | |||
this.$set(this.list, index, upObj) | |||
this.updateSore() | |||
}, | |||
down(index) { | |||
var nowObj = this.list[index] | |||
var downObj = this.list[index + 1] | |||
this.$set(this.list, index + 1, nowObj) | |||
this.$set(this.list, index, downObj) | |||
this.updateSore() | |||
}, | |||
updateSore() { | |||
var listL = this.list.length | |||
var postList = this.list.map((v, key) => { | |||
return {id: v.id, order: listL - key} | |||
}) | |||
typeOrderUpdate(postList).then(response => { | |||
// this.list = response.result | |||
}); | |||
}, | |||
shopChange() { | |||
this.selectlist() | |||
}, | |||
selectlist() { | |||
typeList(this.ruleForm).then(response => { | |||
this.list = response.result | |||
}); | |||
}, | |||
addType() { | |||
this.edit = false; | |||
this.form = { | |||
'name': '', | |||
"industry": "1", | |||
}, | |||
this.dialogFormVisible = true | |||
}, | |||
updateTable(item) { | |||
this.edit = true; | |||
this.upid = item.id | |||
this.form = { | |||
name: item.name, | |||
"industry": 1, | |||
} | |||
this.dialogFormVisible = true | |||
}, | |||
delTable(id) { | |||
this.$confirm('此操作将删除您所选的数据, 是否继续?', '', { | |||
type: 'warning', | |||
center: true | |||
}).then(() => { | |||
typeDel(id).then(response => { | |||
this.selectlist() | |||
}); | |||
}).catch(() => { | |||
}); | |||
}, | |||
subTable() { | |||
this.$refs['form'].validate((valid) => { | |||
if (valid) { | |||
if (this.usertype != 'admin') this.form.store = this.ruleForm.store | |||
if (this.edit) { | |||
typeEdit(this.upid, this.form).then(response => { | |||
this.dialogFormVisible = false | |||
this.selectlist() | |||
}); | |||
} else { | |||
typeAdd(this.form).then(response => { | |||
this.dialogFormVisible = false | |||
this.selectlist() | |||
}); | |||
} | |||
} else { | |||
return false; | |||
} | |||
}) | |||
} | |||
}, | |||
} | |||
</script> | |||
<style> | |||
.goodstypetable td { | |||
padding: 0px 0px; | |||
} | |||
.el-message-box{ | |||
width: 90%; | |||
width: auto; | |||
} | |||
</style> |
@@ -0,0 +1,64 @@ | |||
<template> | |||
<el-menu :default-active="activeIndex" class=" footerLayout el-menu-demo " mode="horizontal" @select="handleSelect" | |||
menu-trigger="click"> | |||
<el-menu-item index="1">商品管理</el-menu-item> | |||
<!--<el-submenu index="1">--> | |||
<!--<template slot="title">商品管理{{activeIndex}}</template>--> | |||
<!--<el-menu-item index="2-1" class="fontCss">商品列表</el-menu-item>--> | |||
<!--<el-menu-item index="2-2" class="fontCss">商品分类</el-menu-item>--> | |||
<!--</el-submenu>--> | |||
<el-menu-item index="2" class="fontCss">交易管理</el-menu-item> | |||
</el-menu> | |||
</template> | |||
<script> | |||
import {Tabbar, TabbarItem} from 'vux' | |||
export default { | |||
components: { | |||
Tabbar, TabbarItem | |||
}, | |||
props: { | |||
activeIndex: {default: '1'}, | |||
}, | |||
methods: { | |||
handleSelect(key, keyPath) { | |||
var path = "" | |||
switch (key) { | |||
case '1': | |||
path = "/goods/index"; | |||
break; | |||
case '2': | |||
path = "/order/ratiostatistics"; | |||
break; | |||
} | |||
this.$router.push({path: path}); | |||
} | |||
} | |||
} | |||
</script> | |||
<style> | |||
.footerLayout { | |||
width: 100%; | |||
position: fixed; | |||
left: 0px; | |||
bottom: 0px; | |||
z-index: 100; | |||
} | |||
.footerLayout .el-menu-item { | |||
height: 50px; | |||
line-height: 50px; | |||
} | |||
.footerLayout li { | |||
width: 50%; | |||
text-align: center; | |||
/*font-size: 16px;*/ | |||
} | |||
.fontCss { | |||
text-align: center; | |||
} | |||
</style> |
@@ -0,0 +1,154 @@ | |||
<template> | |||
<div class="bjimg"> | |||
<x-header :left-options="{showBack: false}">{{token}}登录</x-header> | |||
<box gap="20px 30px"> | |||
<flexbox orient="vertical" style=""> | |||
<flexbox-item> | |||
<h2 style="color: white;text-align:center;margin: 30px 0 15px 0">东软智能云POS管理系统</h2> | |||
</flexbox-item> | |||
<flexbox-item> | |||
<x-input title="" placeholder="用户名" class="inputcss" v-model.trim="loginForm.username"> | |||
<img slot="label" style="padding-right:10px;display:block;" | |||
src="../assets/user.png" width="20" height="20"> | |||
</x-input> | |||
</flexbox-item> | |||
<flexbox-item> | |||
<x-input title="" placeholder="密码" type="password" class="inputcss" | |||
v-model.trim="loginForm.password"> | |||
<img slot="label" style="padding-right:10px;display:block;" | |||
src="../assets/password.png" width="20" height="20"> | |||
</x-input> | |||
</flexbox-item> | |||
<flexbox-item> | |||
<x-input title="验证码" placeholder="验证码" class="inputcss" v-model.trim="loginForm.captcha"> | |||
<img slot="label" style="padding-right:10px;display:block;" | |||
src="../assets/yzm.png" width="20" height="20"> | |||
<img slot="right-full-height" | |||
@click="reRand" :src="captcha" width="100" | |||
height="50"> | |||
</x-input> | |||
</flexbox-item> | |||
<flexbox-item> | |||
<!--<x-button type="default" style="width: 85%;margin-top: 20px" @click.native="sub">登录</x-button>--> | |||
<el-button type="primary" style="width:100%;margin-top: 15px" | |||
@click.native.prevent="sub"> | |||
立即登录 | |||
</el-button> | |||
</flexbox-item> | |||
</flexbox> | |||
<toast v-model="showMessage" type="text" width="16em">{{msg}}</toast> | |||
</box> | |||
</div> | |||
</template> | |||
<script> | |||
import {XInput, Flexbox, FlexboxItem, XButton, Box} from 'vux' | |||
import {login} from "@/api/login"; | |||
export default { | |||
components: { | |||
Flexbox, | |||
FlexboxItem, | |||
XInput, | |||
XButton, | |||
Box | |||
}, | |||
created() { | |||
this.randStr = Math.random().toString() | |||
}, | |||
data() { | |||
return { | |||
randStr: "", | |||
msg: '', | |||
showMessage: false, | |||
loginForm: { | |||
username: "", | |||
password: "", | |||
captcha: "" | |||
}, | |||
token: this.$store.getters.name | |||
} | |||
}, | |||
methods: { | |||
reRand() { | |||
this.randStr = Math.random().toString() | |||
}, | |||
sub() { | |||
// console.log(this.loginForm.username, this.loginForm.password, this.loginForm.captcha) | |||
var username = this.loginForm.username | |||
var password = this.loginForm.password | |||
var captcha = this.loginForm.captcha | |||
const reg = /^[a-zA-Z0-9]+$/ | |||
if (!reg.test(username)) { | |||
this.msg = "请输入正确的用户名" | |||
this.showMessage = true | |||
return | |||
} | |||
if (password.length < 6) { | |||
this.msg = "密码不能小于6位" | |||
this.showMessage = true | |||
return | |||
} | |||
if (captcha.length != 5) { | |||
this.msg = "验证码有误" | |||
this.showMessage = true | |||
return | |||
} | |||
this.msg = "" | |||
login(this.loginForm).then(response => { | |||
if (response.code != 200) { | |||
this.msg = response.message | |||
this.showMessage = true | |||
} else { | |||
if (response.result.type == "sa" || response.result.type == "ca") { | |||
this.msg = '无权登录' | |||
this.showMessage = true | |||
} else { | |||
this.$store.dispatch("Login", response.result) | |||
.then(() => { | |||
this.$router.push({path: "/order/ratiostatistics"}); | |||
}); | |||
} | |||
} | |||
}) | |||
// this.showMessage = true | |||
} | |||
}, | |||
computed: { | |||
captcha: function () { | |||
return process.env.BASE_API + "service-user/login/captcha?rand=" + this.randStr | |||
} | |||
} | |||
} | |||
</script> | |||
<style> | |||
.vux-demo { | |||
text-align: center; | |||
} | |||
.logo { | |||
width: 100px; | |||
height: 100px | |||
} | |||
.weui-input::placeholder { | |||
color: white; | |||
} | |||
.bjimg { | |||
position:absolute; | |||
width:100%; | |||
height:100%; | |||
background-image: url('../assets/background.png'); | |||
overflow:hidden | |||
} | |||
.inputcss { | |||
border: 1px solid hsla(0, 0%, 100%, .1); | |||
background: rgba(0, 0, 0, .1); | |||
border-radius: 5px; | |||
color: white; | |||
margin-top: 8px; | |||
} | |||
</style> |
@@ -0,0 +1,177 @@ | |||
<template> | |||
<div> | |||
<div class="headercss"> | |||
<x-header :left-options="{backText: ''}">交易管理</x-header> | |||
</div> | |||
<div style="padding-top: 15px;margin-top: 35px"> | |||
<flexbox style="margin-bottom:3px"> | |||
<flexbox-item> | |||
<selector title="选择门店" :options="opts" v-model="listQuery.shopId" :value-map="['id','name']" | |||
@on-change="fetchData()"></selector> | |||
</flexbox-item> | |||
</flexbox> | |||
<flexbox> | |||
<flexbox-item :span="3"> | |||
<x-button type="primary" mini style="margin-left: 15px;" @click.native="nowOrder">当日</x-button> | |||
</flexbox-item> | |||
<flexbox-item> | |||
<calendar v-model="date" title="切换日期" disable-future placeholder="" @on-change="fetchData()" ></calendar> | |||
</flexbox-item> | |||
</flexbox> | |||
</div> | |||
<card class="cardcss"> | |||
<div slot="content" class="card-demo-flex card-demo-content01"> | |||
<div class="vux-1px-r"> | |||
<span style=" color: #f74c31;">{{todayAmount}}</span> | |||
<br/> | |||
实收总金额 | |||
</div> | |||
<div class="vux-1px-r"> | |||
<span>{{todayCount}}</span> | |||
<br/> | |||
收单数 | |||
</div> | |||
<div class="vux-1px-r"> | |||
<span>{{todayRefundAmount}}</span> | |||
<br/> | |||
退款总金额 | |||
</div> | |||
<div> | |||
<span>{{todayRefundCount}}</span> | |||
<br/> | |||
退款笔数 | |||
</div> | |||
</div> | |||
</card> | |||
<div style="padding: 2px 0px 51px 0px;margin-top: 10px"> | |||
<x-table full-bordered class="xtable"> | |||
<thead> | |||
<tr> | |||
<th width="28%">支付方式</th> | |||
<th>消费金额</th> | |||
<th>折扣金额</th> | |||
<th>消费笔数</th> | |||
<th>退款金额</th> | |||
<th>退款笔数</th> | |||
<th>实收金额</th> | |||
</tr> | |||
</thead> | |||
<tbody> | |||
<tr v-for="vo in list"> | |||
<td>{{vo.payTypeName}}</td> | |||
<td>{{vo.payAmount}}</td> | |||
<td>{{vo.discountAmount}}</td> | |||
<td>{{vo.payCount}}</td> | |||
<td>{{vo.refundAmount}}</td> | |||
<td>{{vo.refundCount}}</td> | |||
<td>{{vo.amount}}</td> | |||
</tr> | |||
</tbody> | |||
</x-table> | |||
</div> | |||
<myfooter activeIndex="2"> | |||
</myfooter> | |||
</div> | |||
</template> | |||
<script> | |||
import {XTable, Tabbar, TabbarItem, Flexbox, FlexboxItem, Calendar, Selector, Card, dateFormat} from 'vux' | |||
import {orderStatistics} from '@/api/order' | |||
import {storeList} from '@/api/store' | |||
import Myfooter from '@/components/layout/Myfooter' | |||
export default { | |||
components: { | |||
XTable, Tabbar, TabbarItem, Flexbox, FlexboxItem, Calendar, Selector, Card,Myfooter | |||
}, | |||
data() { | |||
return { | |||
date: '', | |||
token: this.$store.getters.name, | |||
opts: [], | |||
listQuery: { | |||
shopId: '', | |||
timeMode: '1', | |||
}, | |||
list: null, | |||
todayAmount: 0, | |||
todayCount: 0, | |||
todayRefundAmount: 0, | |||
todayRefundCount: 0, | |||
} | |||
}, | |||
created() { | |||
storeList().then(response => { | |||
if (response.result.rows.length > 0) { | |||
this.opts = response.result.rows | |||
} | |||
}).then(() => { | |||
this.listQuery.shopId = this.opts[0]['id'] | |||
}) | |||
}, | |||
methods: { | |||
fetchData() { | |||
if (!this.date) { | |||
this.date = dateFormat(new Date(), 'YYYY-MM-DD') | |||
} | |||
this.listQuery.startTime=this.date | |||
this.listQuery.endTime=this.date | |||
orderStatistics(this.listQuery).then(response => { | |||
this.list = response.result.payChannels | |||
}) | |||
}, | |||
nowOrder(){ | |||
this.date='' | |||
this.fetchData() | |||
} | |||
}, | |||
watch: { | |||
"list": function (list) { | |||
let payAmount = 0, payCount = 0, refundAmount = 0, refundCount = 0 | |||
list.forEach(function (x) { | |||
payAmount += x.amount | |||
payCount += x.payCount | |||
refundAmount += x.refundAmount | |||
refundCount += x.refundCount | |||
}); | |||
this.todayAmount = payAmount.toFixed(2) | |||
this.todayCount = payCount | |||
this.todayRefundAmount = refundAmount.toFixed(2) | |||
this.todayRefundCount = refundCount | |||
} | |||
} | |||
} | |||
</script> | |||
<style scoped lang="less"> | |||
@import '~vux/src/styles/1px.less'; | |||
.card-demo-flex { | |||
display: flex; | |||
} | |||
.card-demo-content01 { | |||
padding: 6px 0; | |||
} | |||
.card-padding { | |||
padding: 15px; | |||
} | |||
.card-demo-flex > div { | |||
flex: 1; | |||
text-align: center; | |||
font-size: 14px; | |||
} | |||
.cardcss { | |||
margin-top: 0px; | |||
} | |||
.xtable{ | |||
font-size: 10px; | |||
} | |||
thead th { | |||
/*font-weight: bold;*/ | |||
} | |||
.headercss{ | |||
position: fixed;top: 0px;width: 100%; | |||
} | |||
</style> |
@@ -0,0 +1,25 @@ | |||
// The Vue build version to load with the `import` command | |||
// (runtime-only or standalone) has been set in webpack.base.conf with an alias. | |||
import Vue from 'vue' | |||
import store from './store' | |||
import App from './App' | |||
import router from './router' | |||
import '@/permission' // 权限 | |||
Vue.config.productionTip = false | |||
import { XHeader ,Toast ,ToastPlugin,XButton } from 'vux' | |||
console.log(navigator.userAgent) | |||
import ElementUI from 'element-ui' | |||
import 'element-ui/lib/theme-chalk/index.css' | |||
import locale from 'element-ui/lib/locale/lang/zh-CN' | |||
Vue.component('x-header', XHeader) | |||
Vue.component('toast', Toast) | |||
Vue.use(ToastPlugin) | |||
Vue.component('x-button',XButton ) | |||
Vue.use(ElementUI, { locale }) | |||
/* eslint-disable no-new */ | |||
new Vue({ | |||
router, | |||
store, | |||
render: h => h(App) | |||
}).$mount('#app-box') |
@@ -0,0 +1,33 @@ | |||
import router from './router' | |||
import store from './store' | |||
import { | |||
getToken | |||
} from '@/utils/auth' // 验权 | |||
const whiteList = ['/login'] | |||
router.beforeEach((to, from, next) => { | |||
if (getToken()) { | |||
if (to.path === '/login') { | |||
next({ | |||
path: '/order/ratiostatistics' | |||
}) | |||
} else { | |||
if (!store.getters.usertype) { | |||
store.dispatch('GetInfo').then(res => { | |||
next() | |||
}) | |||
} else { | |||
next() | |||
} | |||
} | |||
} else { | |||
if (whiteList.indexOf(to.path) !== -1) { | |||
next() | |||
} else { | |||
next('/login') | |||
} | |||
} | |||
}) | |||
router.afterEach((to, from) => { | |||
// console.log(to) | |||
}) |
@@ -0,0 +1 @@ | |||
module.exports = file => require('@/components/' + file + '.vue').default // vue-loader at least v13.0.0+ |
@@ -0,0 +1 @@ | |||
module.exports = file => () => import('@/components/' + file + '.vue') |
@@ -0,0 +1,43 @@ | |||
import Vue from 'vue' | |||
import Router from 'vue-router' | |||
const _import = require('./_import_' + process.env.NODE_ENV) | |||
Vue.use(Router) | |||
export default new Router({ | |||
routes: [ | |||
{ | |||
path: '/', | |||
name: '交易占比', | |||
component: _import('order/ratiostatistics') | |||
}, | |||
{ | |||
path: '/login', | |||
name: '登录', | |||
component: _import('login') | |||
}, | |||
{ | |||
path: '/order/ratiostatistics', | |||
name: '交易占比', | |||
component: _import('order/ratiostatistics') | |||
}, | |||
{ | |||
path: '/goods/index', | |||
name: '商品管理', | |||
component: _import('goods/index') | |||
}, | |||
{ | |||
path: '/goods/add', | |||
name: '商品添加', | |||
component: _import('goods/add') | |||
}, | |||
{ | |||
path: '/goods/update/:id', | |||
name: '商品添加', | |||
component: _import('goods/edit') | |||
}, | |||
{ | |||
path: '/goods/type', | |||
name: '商品类型', | |||
component: _import('goods/type') | |||
} | |||
] | |||
}) |
@@ -0,0 +1,8 @@ | |||
const getters = { | |||
token: state => state.user.token, | |||
name: state => state.user.name, | |||
usertype: state => state.user.type, | |||
orgId: state => state.user.orgId, | |||
} | |||
export default getters |
@@ -0,0 +1,13 @@ | |||
import Vue from 'vue' | |||
import Vuex from 'vuex' | |||
import user from './modules/user' | |||
import getters from './getters' | |||
Vue.use(Vuex) | |||
const store = new Vuex.Store({ | |||
modules: { | |||
user, | |||
}, | |||
getters | |||
}) | |||
export default store |
@@ -0,0 +1,65 @@ | |||
import { | |||
getInfo, | |||
} from '@/api/login' | |||
import { | |||
getToken, | |||
setToken, | |||
removeToken | |||
} from '@/utils/auth' | |||
const user = { | |||
state: { | |||
token: getToken(), | |||
name: '', | |||
type: '', | |||
orgId: '', | |||
}, | |||
mutations: { | |||
SET_TOKEN: (state, token) => { | |||
state.token = token | |||
}, | |||
SET_NAME: (state, name) => { | |||
state.name = name | |||
}, | |||
SET_TYPE: (state, type) => { | |||
state.type = type | |||
}, | |||
SET_ORGID: (state, orgId) => { | |||
state.orgId = orgId | |||
}, | |||
}, | |||
actions: { | |||
// 登录 | |||
Login({ | |||
commit | |||
}, userInfo) { | |||
setToken(userInfo.token) | |||
commit('SET_TOKEN', userInfo.token) | |||
commit('SET_NAME', userInfo.name) | |||
commit('SET_TYPE', userInfo.type) | |||
commit('SET_ORGID', userInfo.orgId) | |||
}, | |||
// 获取用户信息 | |||
GetInfo({ | |||
commit, | |||
state | |||
}) { | |||
return new Promise((resolve, reject) => { | |||
getInfo().then(response => { | |||
const userInfo = response.result | |||
commit('SET_NAME', userInfo.name) | |||
commit('SET_TYPE', userInfo.type) | |||
commit('SET_ORGID', userInfo.orgId) | |||
resolve() | |||
}).catch(error => { | |||
reject(error) | |||
}) | |||
}) | |||
}, | |||
} | |||
} | |||
export default user |
@@ -0,0 +1,16 @@ | |||
import Cookies from 'js-cookie' | |||
const TokenKey = 'Admin-Token' | |||
export function getToken() { | |||
// return "eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJhZG1pbiIsInJvbGUiOiJhZG1pbiIsImV4cCI6MTUyMTc4MzIwNX0.59_l_ir1uXS3v5PIQxA721UzSyJIcM8WceqZJAFEHnGIDHtQ8N_pkL7096eGvMPAqSCeOZabnALosqeovUZ0Hw" | |||
return Cookies.get(TokenKey) | |||
} | |||
export function setToken(token) { | |||
return Cookies.set(TokenKey, token) | |||
} | |||
export function removeToken() { | |||
return Cookies.remove(TokenKey) | |||
} |
@@ -0,0 +1,72 @@ | |||
import axios from 'axios' | |||
import { | |||
Message | |||
} from 'element-ui' | |||
import store from '../store' | |||
import { | |||
getToken | |||
} from '@/utils/auth' | |||
// 创建axios实例 | |||
const service = axios.create({ | |||
baseURL: process.env.BASE_API, // api的base_url | |||
timeout: 30000, // 请求超时时间 | |||
withCredentials: true | |||
}) | |||
// request拦截器 | |||
service.interceptors.request.use(config => { | |||
const token = getToken() | |||
if (token) { | |||
config.headers['Authorization'] = 'Bearer ' + token // 让每个请求携带自定义token 请根据实际情况自行修改 | |||
} | |||
return config | |||
}, error => { | |||
// Do something with request error | |||
console.log(error) // for debug | |||
Promise.reject(error) | |||
}) | |||
// respone拦截器 | |||
service.interceptors.response.use( | |||
response => { | |||
/** | |||
* code为非200是抛错 可结合自己业务进行修改 | |||
*/ | |||
const res = response.data | |||
if (res.code !== 200 && res.code !== '200') { | |||
Message({ | |||
message: res.message, | |||
type: 'error', | |||
duration: 2 * 1000 | |||
}) | |||
// 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了; | |||
if (res.code === 50008 || res.code === 50012 || res.code === 50014) { | |||
MessageBox.confirm('你已被登出,可以取消继续留在该页面,或者重新登录', '确定登出', { | |||
confirmButtonText: '重新登录', | |||
cancelButtonText: '取消', | |||
type: 'warning' | |||
}).then(() => { | |||
store.dispatch('FedLogOut').then(() => { | |||
location.reload() // 为了重新实例化vue-router对象 避免bug | |||
}) | |||
}) | |||
} | |||
return Promise.reject('error') | |||
} else { | |||
return response.data | |||
} | |||
}, | |||
error => { | |||
console.log(error) // for debug | |||
Message({ | |||
message: error.message, | |||
type: 'error', | |||
duration: 5 * 1000 | |||
}) | |||
return Promise.reject(error) | |||
} | |||
) | |||
export default service |