@ -0,0 +1,12 @@
|
||||
{
|
||||
"presets": [
|
||||
["env", {
|
||||
"modules": false,
|
||||
"targets": {
|
||||
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
|
||||
}
|
||||
}],
|
||||
"stage-2"
|
||||
],
|
||||
"plugins": ["transform-vue-jsx", "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,25 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# Editor directories and files`
|
||||
`
|
||||
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
@ -0,0 +1,10 @@
|
||||
// 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": {}
|
||||
}
|
||||
}
|
@ -0,0 +1,41 @@
|
||||
'use strict'
|
||||
require('./check-versions')()
|
||||
|
||||
process.env.NODE_ENV = 'production'
|
||||
|
||||
const ora = require('ora')
|
||||
const rm = require('rimraf')
|
||||
const path = require('path')
|
||||
const chalk = require('chalk')
|
||||
const webpack = require('webpack')
|
||||
const config = require('../config')
|
||||
const webpackConfig = require('./webpack.prod.conf')
|
||||
|
||||
const spinner = ora('building for production...')
|
||||
spinner.start()
|
||||
|
||||
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
|
||||
if (err) throw err
|
||||
webpack(webpackConfig, (err, stats) => {
|
||||
spinner.stop()
|
||||
if (err) throw err
|
||||
process.stdout.write(stats.toString({
|
||||
colors: true,
|
||||
modules: false,
|
||||
children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build.
|
||||
chunks: false,
|
||||
chunkModules: false
|
||||
}) + '\n\n')
|
||||
|
||||
if (stats.hasErrors()) {
|
||||
console.log(chalk.red(' Build failed with errors.\n'))
|
||||
process.exit(1)
|
||||
}
|
||||
|
||||
console.log(chalk.cyan(' Build complete.\n'))
|
||||
console.log(chalk.yellow(
|
||||
' Tip: built files are meant to be served over an HTTP server.\n' +
|
||||
' Opening index.html over file:// won\'t work.\n'
|
||||
))
|
||||
})
|
||||
})
|
@ -0,0 +1,54 @@
|
||||
'use strict'
|
||||
const chalk = require('chalk')
|
||||
const semver = require('semver')
|
||||
const packageConfig = require('../package.json')
|
||||
const shell = require('shelljs')
|
||||
|
||||
function exec (cmd) {
|
||||
return require('child_process').execSync(cmd).toString().trim()
|
||||
}
|
||||
|
||||
const versionRequirements = [
|
||||
{
|
||||
name: 'node',
|
||||
currentVersion: semver.clean(process.version),
|
||||
versionRequirement: packageConfig.engines.node
|
||||
}
|
||||
]
|
||||
|
||||
if (shell.which('npm')) {
|
||||
versionRequirements.push({
|
||||
name: 'npm',
|
||||
currentVersion: exec('npm --version'),
|
||||
versionRequirement: packageConfig.engines.npm
|
||||
})
|
||||
}
|
||||
|
||||
module.exports = function () {
|
||||
const warnings = []
|
||||
|
||||
for (let i = 0; i < versionRequirements.length; i++) {
|
||||
const mod = versionRequirements[i]
|
||||
|
||||
if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
|
||||
warnings.push(mod.name + ': ' +
|
||||
chalk.red(mod.currentVersion) + ' should be ' +
|
||||
chalk.green(mod.versionRequirement)
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
if (warnings.length) {
|
||||
console.log('')
|
||||
console.log(chalk.yellow('To use this template, you must update following to modules:'))
|
||||
console.log()
|
||||
|
||||
for (let i = 0; i < warnings.length; i++) {
|
||||
const warning = warnings[i]
|
||||
console.log(' ' + warning)
|
||||
}
|
||||
|
||||
console.log()
|
||||
process.exit(1)
|
||||
}
|
||||
}
|
After Width: | Height: | Size: 34 KiB |
@ -0,0 +1,99 @@
|
||||
'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'),
|
||||
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')
|
||||
})
|
||||
}
|
||||
}
|
@ -0,0 +1,22 @@
|
||||
'use strict'
|
||||
const utils = require('./utils')
|
||||
const config = require('../config')
|
||||
const isProduction = process.env.NODE_ENV === 'production'
|
||||
const sourceMapEnabled = isProduction
|
||||
? config.build.productionSourceMap
|
||||
: config.dev.cssSourceMap
|
||||
|
||||
module.exports = {
|
||||
loaders: utils.cssLoaders({
|
||||
sourceMap: sourceMapEnabled,
|
||||
extract: isProduction
|
||||
}),
|
||||
cssSourceMap: sourceMapEnabled,
|
||||
cacheBusting: config.dev.cacheBusting,
|
||||
transformToRequire: {
|
||||
video: ['src', 'poster'],
|
||||
source: 'src',
|
||||
img: 'src',
|
||||
image: 'xlink:href'
|
||||
}
|
||||
}
|
@ -0,0 +1,99 @@
|
||||
'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: /\.less$/,
|
||||
loader: "style-loader!css-loader!less-loader"
|
||||
},
|
||||
{
|
||||
test: /\.vue$/,
|
||||
loader: 'vue-loader',
|
||||
options: vueLoaderConfig
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
loader: 'babel-loader',
|
||||
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
|
||||
},
|
||||
{
|
||||
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000,
|
||||
name: utils.assetsPath('img/[name].[hash:7].[ext]')
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000,
|
||||
name: utils.assetsPath('media/[name].[hash:7].[ext]')
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000,
|
||||
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
|
||||
}
|
||||
},
|
||||
// {
|
||||
// test: /node_modules[\\\/]vis[\\\/].*\.js$/,
|
||||
// loader: 'babel-loader',
|
||||
// query: {
|
||||
// cacheDirectory: true,
|
||||
// presets: [ "babel-preset-es2015" ].map(require.resolve),
|
||||
// plugins: [
|
||||
// "transform-es3-property-literals", // #2452
|
||||
// "transform-es3-member-expression-literals", // #2566
|
||||
// "transform-runtime" // #2566
|
||||
// ]
|
||||
// }
|
||||
// }
|
||||
]
|
||||
},
|
||||
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'
|
||||
}
|
||||
}
|
@ -0,0 +1,95 @@
|
||||
'use strict'
|
||||
const utils = require('./utils')
|
||||
const webpack = require('webpack')
|
||||
const config = require('../config')
|
||||
const merge = require('webpack-merge')
|
||||
const path = require('path')
|
||||
const baseWebpackConfig = require('./webpack.base.conf')
|
||||
const CopyWebpackPlugin = require('copy-webpack-plugin')
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin')
|
||||
const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
|
||||
const portfinder = require('portfinder')
|
||||
|
||||
const HOST = process.env.HOST
|
||||
const PORT = process.env.PORT && Number(process.env.PORT)
|
||||
|
||||
const devWebpackConfig = merge(baseWebpackConfig, {
|
||||
module: {
|
||||
rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
|
||||
},
|
||||
// cheap-module-eval-source-map is faster for development
|
||||
devtool: config.dev.devtool,
|
||||
|
||||
// these devServer options should be customized in /config/index.js
|
||||
devServer: {
|
||||
clientLogLevel: 'warning',
|
||||
historyApiFallback: {
|
||||
rewrites: [
|
||||
{ from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
|
||||
],
|
||||
},
|
||||
hot: true,
|
||||
contentBase: false, // since we use CopyWebpackPlugin.
|
||||
compress: true,
|
||||
host: HOST || config.dev.host,
|
||||
port: PORT || config.dev.port,
|
||||
open: config.dev.autoOpenBrowser,
|
||||
overlay: config.dev.errorOverlay
|
||||
? { warnings: false, errors: true }
|
||||
: false,
|
||||
publicPath: config.dev.assetsPublicPath,
|
||||
proxy: config.dev.proxyTable,
|
||||
quiet: true, // necessary for FriendlyErrorsPlugin
|
||||
watchOptions: {
|
||||
poll: config.dev.poll,
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': require('../config/dev.env')
|
||||
}),
|
||||
new webpack.HotModuleReplacementPlugin(),
|
||||
new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
|
||||
new webpack.NoEmitOnErrorsPlugin(),
|
||||
// https://github.com/ampedandwired/html-webpack-plugin
|
||||
new HtmlWebpackPlugin({
|
||||
filename: 'index.html',
|
||||
template: 'index.html',
|
||||
inject: true
|
||||
}),
|
||||
// copy custom static assets
|
||||
new CopyWebpackPlugin([
|
||||
{
|
||||
from: path.resolve(__dirname, '../static'),
|
||||
to: config.dev.assetsSubDirectory,
|
||||
ignore: ['.*']
|
||||
}
|
||||
])
|
||||
]
|
||||
})
|
||||
|
||||
module.exports = new Promise((resolve, reject) => {
|
||||
portfinder.basePort = process.env.PORT || config.dev.port
|
||||
portfinder.getPort((err, port) => {
|
||||
if (err) {
|
||||
reject(err)
|
||||
} else {
|
||||
// publish the new Port, necessary for e2e tests
|
||||
process.env.PORT = port
|
||||
// add port to devServer config
|
||||
devWebpackConfig.devServer.port = port
|
||||
|
||||
// Add FriendlyErrorsPlugin
|
||||
devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
|
||||
compilationSuccessInfo: {
|
||||
messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
|
||||
},
|
||||
onErrors: config.dev.notifyOnErrors
|
||||
? utils.createNotifierCallback()
|
||||
: undefined
|
||||
}))
|
||||
|
||||
resolve(devWebpackConfig)
|
||||
}
|
||||
})
|
||||
})
|
@ -0,0 +1,145 @@
|
||||
'use strict'
|
||||
const path = require('path')
|
||||
const utils = require('./utils')
|
||||
const webpack = require('webpack')
|
||||
const config = require('../config')
|
||||
const merge = require('webpack-merge')
|
||||
const baseWebpackConfig = require('./webpack.base.conf')
|
||||
const CopyWebpackPlugin = require('copy-webpack-plugin')
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin')
|
||||
const ExtractTextPlugin = require('extract-text-webpack-plugin')
|
||||
const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
|
||||
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
|
||||
|
||||
const env = require('../config/prod.env')
|
||||
|
||||
const webpackConfig = merge(baseWebpackConfig, {
|
||||
module: {
|
||||
rules: utils.styleLoaders({
|
||||
sourceMap: config.build.productionSourceMap,
|
||||
extract: true,
|
||||
usePostCSS: true
|
||||
})
|
||||
},
|
||||
devtool: config.build.productionSourceMap ? config.build.devtool : false,
|
||||
output: {
|
||||
path: config.build.assetsRoot,
|
||||
filename: utils.assetsPath('js/[name].[chunkhash].js'),
|
||||
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
|
||||
},
|
||||
plugins: [
|
||||
// http://vuejs.github.io/vue-loader/en/workflow/production.html
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': env
|
||||
}),
|
||||
new UglifyJsPlugin({
|
||||
uglifyOptions: {
|
||||
compress: {
|
||||
warnings: false
|
||||
}
|
||||
},
|
||||
sourceMap: config.build.productionSourceMap,
|
||||
parallel: true
|
||||
}),
|
||||
// extract css into its own file
|
||||
new ExtractTextPlugin({
|
||||
filename: utils.assetsPath('css/[name].[contenthash].css'),
|
||||
// Setting the following option to `false` will not extract CSS from codesplit chunks.
|
||||
// Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
|
||||
// It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
|
||||
// increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
|
||||
allChunks: true,
|
||||
}),
|
||||
// Compress extracted CSS. We are using this plugin so that possible
|
||||
// duplicated CSS from different components can be deduped.
|
||||
new OptimizeCSSPlugin({
|
||||
cssProcessorOptions: config.build.productionSourceMap
|
||||
? { safe: true, map: { inline: false } }
|
||||
: { safe: true }
|
||||
}),
|
||||
// generate dist index.html with correct asset hash for caching.
|
||||
// you can customize output by editing /index.html
|
||||
// see https://github.com/ampedandwired/html-webpack-plugin
|
||||
new HtmlWebpackPlugin({
|
||||
filename: config.build.index,
|
||||
template: 'index.html',
|
||||
inject: true,
|
||||
minify: {
|
||||
removeComments: true,
|
||||
collapseWhitespace: true,
|
||||
removeAttributeQuotes: true
|
||||
// more options:
|
||||
// https://github.com/kangax/html-minifier#options-quick-reference
|
||||
},
|
||||
// necessary to consistently work with multiple chunks via CommonsChunkPlugin
|
||||
chunksSortMode: 'dependency'
|
||||
}),
|
||||
// keep module.id stable when vendor modules does not change
|
||||
new webpack.HashedModuleIdsPlugin(),
|
||||
// enable scope hoisting
|
||||
new webpack.optimize.ModuleConcatenationPlugin(),
|
||||
// split vendor js into its own file
|
||||
new webpack.optimize.CommonsChunkPlugin({
|
||||
name: 'vendor',
|
||||
minChunks (module) {
|
||||
// any required modules inside node_modules are extracted to vendor
|
||||
return (
|
||||
module.resource &&
|
||||
/\.js$/.test(module.resource) &&
|
||||
module.resource.indexOf(
|
||||
path.join(__dirname, '../node_modules')
|
||||
) === 0
|
||||
)
|
||||
}
|
||||
}),
|
||||
// extract webpack runtime and module manifest to its own file in order to
|
||||
// prevent vendor hash from being updated whenever app bundle is updated
|
||||
new webpack.optimize.CommonsChunkPlugin({
|
||||
name: 'manifest',
|
||||
minChunks: Infinity
|
||||
}),
|
||||
// This instance extracts shared chunks from code splitted chunks and bundles them
|
||||
// in a separate chunk, similar to the vendor chunk
|
||||
// see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
|
||||
new webpack.optimize.CommonsChunkPlugin({
|
||||
name: 'app',
|
||||
async: 'vendor-async',
|
||||
children: true,
|
||||
minChunks: 3
|
||||
}),
|
||||
|
||||
// copy custom static assets
|
||||
new CopyWebpackPlugin([
|
||||
{
|
||||
from: path.resolve(__dirname, '../static'),
|
||||
to: config.build.assetsSubDirectory,
|
||||
ignore: ['.*']
|
||||
}
|
||||
])
|
||||
]
|
||||
})
|
||||
|
||||
if (config.build.productionGzip) {
|
||||
const CompressionWebpackPlugin = require('compression-webpack-plugin')
|
||||
|
||||
webpackConfig.plugins.push(
|
||||
new CompressionWebpackPlugin({
|
||||
asset: '[path].gz[query]',
|
||||
algorithm: 'gzip',
|
||||
test: new RegExp(
|
||||
'\\.(' +
|
||||
config.build.productionGzipExtensions.join('|') +
|
||||
')$'
|
||||
),
|
||||
threshold: 10240,
|
||||
minRatio: 0.8
|
||||
})
|
||||
)
|
||||
}
|
||||
|
||||
if (config.build.bundleAnalyzerReport) {
|
||||
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
|
||||
webpackConfig.plugins.push(new BundleAnalyzerPlugin())
|
||||
}
|
||||
|
||||
module.exports = webpackConfig
|
@ -0,0 +1,7 @@
|
||||
'use strict'
|
||||
const merge = require('webpack-merge')
|
||||
const prodEnv = require('./prod.env')
|
||||
|
||||
module.exports = merge(prodEnv, {
|
||||
NODE_ENV: '"development"'
|
||||
})
|
@ -0,0 +1,4 @@
|
||||
'use strict'
|
||||
module.exports = {
|
||||
NODE_ENV: '"production"'
|
||||
}
|
@ -0,0 +1,15 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<title>在线考试系统</title>
|
||||
<link rel="stylesheet" href="//at.alicdn.com/t/font_987928_pqv3jkd52jl.css">
|
||||
<link rel="icon" type="image/x-icon" href="./static/img/icon.png"/>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,75 @@
|
||||
{
|
||||
"name": "vue-init",
|
||||
"version": "1.0.0",
|
||||
"description": "vue demo",
|
||||
"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": {
|
||||
"@babel/preset-es2015": "^7.0.0-beta.53",
|
||||
"axios": "^0.18.0",
|
||||
"echarts": "^4.2.0-rc.2",
|
||||
"element-ui": "^2.4.11",
|
||||
"global": "^4.4.0",
|
||||
"vis": "^4.21.0",
|
||||
"vue": "^2.5.2",
|
||||
"vue-cookies": "^1.5.12",
|
||||
"vue-router": "^3.0.1",
|
||||
"vuex": "^3.0.1",
|
||||
"vuex-persistedstate": "^2.5.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"less": "^4.1.3",
|
||||
"less-loader": "5.0.0",
|
||||
"@babel/core": "^7.2.2",
|
||||
"@babel/preset-env": "^7.2.3",
|
||||
"autoprefixer": "^7.1.2",
|
||||
"babel-core": "^6.22.1",
|
||||
"babel-helper-vue-jsx-merge-props": "^2.0.3",
|
||||
"babel-loader": "^7.1.5",
|
||||
"babel-plugin-syntax-jsx": "^6.18.0",
|
||||
"babel-plugin-transform-runtime": "^6.22.0",
|
||||
"babel-plugin-transform-vue-jsx": "^3.5.0",
|
||||
"babel-preset-env": "^1.3.2",
|
||||
"babel-preset-stage-2": "^6.22.0",
|
||||
"chalk": "^2.0.1",
|
||||
"copy-webpack-plugin": "^4.0.1",
|
||||
"css-loader": "^0.28.0",
|
||||
"extract-text-webpack-plugin": "^3.0.0",
|
||||
"file-loader": "^1.1.4",
|
||||
"friendly-errors-webpack-plugin": "^1.6.1",
|
||||
"html-webpack-plugin": "^2.30.1",
|
||||
"node-notifier": "^5.1.2",
|
||||
"optimize-css-assets-webpack-plugin": "^3.2.0",
|
||||
"ora": "^1.2.0",
|
||||
"portfinder": "^1.0.13",
|
||||
"postcss-import": "^11.0.0",
|
||||
"postcss-loader": "^2.0.8",
|
||||
"postcss-url": "^7.2.1",
|
||||
"rimraf": "^2.6.0",
|
||||
"semver": "^5.3.0",
|
||||
"shelljs": "^0.7.6",
|
||||
"uglifyjs-webpack-plugin": "^1.1.1",
|
||||
"url-loader": "^0.5.8",
|
||||
"vue-loader": "^13.3.0",
|
||||
"vue-style-loader": "^3.0.1",
|
||||
"vue-template-compiler": "^2.5.2",
|
||||
"webpack": "^3.12.0",
|
||||
"webpack-bundle-analyzer": "^2.9.0",
|
||||
"webpack-dev-server": "^2.9.1",
|
||||
"webpack-merge": "^4.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 6.0.0",
|
||||
"npm": ">= 3.0.0"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not ie <= 8"
|
||||
]
|
||||
}
|
@ -0,0 +1,41 @@
|
||||
<!--
|
||||
* 程序主入口
|
||||
*
|
||||
* @Author: cyh
|
||||
* @Date: 2024-10-11
|
||||
-->
|
||||
<template>
|
||||
<div id="app">
|
||||
<router-view/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'App',
|
||||
created() {
|
||||
var token = this.$cookies.get("rb_token");
|
||||
var role = this.$cookies.get("rb_role");
|
||||
if(token == null || token == "" || role == null || role == null) {
|
||||
this.$router.push({path: '/' }) //跳转到首页
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#app {
|
||||
font-family: "Microsoft YaHei", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
|
||||
background-color: #eee;
|
||||
}
|
||||
</style>
|
After Width: | Height: | Size: 488 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 34 KiB |
After Width: | Height: | Size: 987 KiB |
After Width: | Height: | Size: 192 KiB |
After Width: | Height: | Size: 192 KiB |
After Width: | Height: | Size: 34 KiB |
@ -0,0 +1,99 @@
|
||||
<!--
|
||||
* 成绩统计页面
|
||||
*
|
||||
* @Author: ShanZhu
|
||||
* @Date: 2024-12-16
|
||||
-->
|
||||
<template>
|
||||
<div id="grade">
|
||||
<div ref="box" class="box"></div>
|
||||
<div class="notFound" v-if="isNull">
|
||||
<i class="iconfont icon-LC_icon_tips_fill"></i
|
||||
><span>该考生未参加考试</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "grade",
|
||||
data() {
|
||||
return {
|
||||
isNull: false, //原始数据
|
||||
tableDataX: [], //x轴数据 保存次数
|
||||
tableDataY: [], //y轴数据 保存分数
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.score();
|
||||
},
|
||||
methods: {
|
||||
score() {
|
||||
let studentId = this.$route.query.studentId;
|
||||
this.$axios(`/api/score/${studentId}`).then((res) => {
|
||||
//根据学生Id查询成绩
|
||||
if (res.data.code == 200) {
|
||||
let rootData = res.data.data;
|
||||
rootData.forEach((element, index) => {
|
||||
|
||||
// 科目名称转列显示
|
||||
var insertIntervalString = (
|
||||
originStr,
|
||||
disNum = 10,
|
||||
insertStr = "\n"
|
||||
) =>
|
||||
originStr.replace(
|
||||
new RegExp("(.{" + disNum + "})", "g"),
|
||||
"$1" + insertStr
|
||||
);
|
||||
// 每隔一个字符插入一个回车
|
||||
var subject = insertIntervalString(element.subject, 3, "\n");
|
||||
|
||||
this.tableDataX.push(subject);
|
||||
this.tableDataY.push(element.etScore);
|
||||
});
|
||||
let boxDom = this.$refs["box"];
|
||||
let scoreCharts = this.$echarts.init(boxDom);
|
||||
let option = {
|
||||
xAxis: {
|
||||
type: "category",
|
||||
data: this.tableDataX,
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: this.tableDataY,
|
||||
type: "line",
|
||||
itemStyle: { normal: { label: { show: true } } },
|
||||
},
|
||||
],
|
||||
};
|
||||
scoreCharts.setOption(option);
|
||||
scoreCharts.on("mouseover", (params) => {
|
||||
console.log(params.value);
|
||||
});
|
||||
} else {
|
||||
this.isNull = true;
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
#grade {
|
||||
position: relative;
|
||||
.box {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
}
|
||||
.notFound {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -0,0 +1,170 @@
|
||||
<!--
|
||||
* 开始成绩页面
|
||||
*
|
||||
* @Author: ShanZhu
|
||||
* @Date: 2023-11-23
|
||||
-->
|
||||
<template>
|
||||
<div class="score">
|
||||
<br>
|
||||
<div class="total">
|
||||
<div class="look">
|
||||
本次考试成绩
|
||||
</div>
|
||||
<div class="show">
|
||||
<div class="number" :class="{'border': isTransition}">
|
||||
<span>{{score}}</span>
|
||||
<span>分数</span>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="time">
|
||||
<li class="start"><span>开始时间</span> <span>{{startTime}}</span></li>
|
||||
<li class="end"><span>结束时间</span> <span>{{endTime}}</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isTransition: false, //是否渲染完成
|
||||
score: 0, //总分
|
||||
startTime: null, //考试开始时间
|
||||
endTime: null, //考试结束时间
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.transiton()
|
||||
this.getScore()
|
||||
},
|
||||
methods: {
|
||||
transiton() { //一秒后过渡
|
||||
setTimeout(() => {
|
||||
this.isTransition = true
|
||||
},1000)
|
||||
},
|
||||
getScore() {
|
||||
let score = this.$route.query.score
|
||||
let startTime = this.$route.query.startTime
|
||||
let endTime = this.$route.query.endTime
|
||||
this.score = score
|
||||
this.startTime = startTime
|
||||
this.endTime = endTime
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.show {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
img {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
}
|
||||
.img1Transform {
|
||||
opacity: 1 !important;
|
||||
transform: translateX(30px) !important;
|
||||
transition: all 0.6s ease !important;
|
||||
}
|
||||
.img2Transform {
|
||||
opacity: 1 !important;
|
||||
transform: translateX(-30px) !important;
|
||||
transition: all 0.6s ease !important;
|
||||
}
|
||||
.img1 {
|
||||
margin-top: 70px;
|
||||
opacity: 0;
|
||||
transform: translateX(0px);
|
||||
transition: all 0.6s ease;
|
||||
}
|
||||
.img2 {
|
||||
margin-top: 30px;
|
||||
opacity: 0;
|
||||
transform: translateX(0px);
|
||||
transition: all 0.6s ease;
|
||||
}
|
||||
}
|
||||
.time {
|
||||
padding: 0px 70px;
|
||||
li {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 10px;
|
||||
margin: 20px 0px;
|
||||
}
|
||||
li:nth-child(1) {
|
||||
background-color: #fcf8e3;
|
||||
}
|
||||
li:nth-child(2) {
|
||||
background-color: #e9f5e9;
|
||||
}
|
||||
}
|
||||
.border {
|
||||
border: 6px solid #36aafd !important;
|
||||
transition: all 2s ease;
|
||||
width: 160px !important;
|
||||
height: 160px !important;
|
||||
transform: rotate(360deg) !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
.score {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
.title {
|
||||
margin: 60px 0px 30px 0px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
.name {
|
||||
font-size: 26px;
|
||||
color: inherit;
|
||||
font-weight: 500;
|
||||
}
|
||||
.description {
|
||||
font-size: 14px;
|
||||
color: #888;
|
||||
}
|
||||
}
|
||||
.total {
|
||||
border: 1px solid #dbdbdb;
|
||||
background-color: #fff;
|
||||
padding: 40px;
|
||||
.look {
|
||||
border-bottom: 1px solid #dbdbdb;
|
||||
padding: 0px 0px 14px 14px;
|
||||
color: #36aafd;
|
||||
}
|
||||
.number {
|
||||
opacity: 0;
|
||||
border: 6px solid #fff;
|
||||
transform: rotate(0deg);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
margin: 0 auto;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
border-radius: 50%;
|
||||
margin-top: 80px;
|
||||
margin-bottom: 20px;
|
||||
transition: all 1s ease;
|
||||
|
||||
span:nth-child(1) {
|
||||
font-size: 36px;
|
||||
font-weight: 600;
|
||||
}
|
||||
span:nth-child(2) {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -0,0 +1,274 @@
|
||||
<!--
|
||||
* 点击试卷缩略信息
|
||||
*
|
||||
* @Author: ShanZhu
|
||||
* @Date: 2023-11-23
|
||||
-->
|
||||
<template>
|
||||
<div id="msg">
|
||||
<div class="title">
|
||||
<span>试卷列表</span>
|
||||
<span>/ {{examData.source}}</span>
|
||||
</div>
|
||||
<div class="wrapper">
|
||||
<ul class="top">
|
||||
<li class="example">{{examData.source}}</li>
|
||||
<li><i class="iconfont icon-pen-"></i></li>
|
||||
<li><i class="iconfont icon-share"></i></li>
|
||||
<li class="right">
|
||||
<div>
|
||||
<span class="count">总分</span>
|
||||
<span class="score">{{score[0]+score[1]+score[2]}}</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="bottom">
|
||||
<li>更新于{{examData.examDate}}</li>
|
||||
<li>来自 {{examData.institute}}</li>
|
||||
<li class="btn">{{examData.type}}</li>
|
||||
<li class="right"><el-button @click="toAnswer(examData.examCode)">{{$store.state.isPractice==true?'开始练习':'开始考试'}}</el-button></li>
|
||||
</ul>
|
||||
<ul class="info">
|
||||
<li @click="dialogVisible = true"><a href="javascript:;"><i class="iconfont icon-info"></i>考生须知</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="content">
|
||||
<el-collapse v-model="activeName" >
|
||||
<el-collapse-item class="header" name="0">
|
||||
<template slot="title">
|
||||
<div class="title">
|
||||
<span>{{examData.source}}</span><i class="header-icon el-icon-info"></i>
|
||||
<span class="time">{{score[0]+score[1]+score[2]}}分 / {{examData.totalTime}}分钟</span>
|
||||
<el-button type="primary" size="small">点击查看试题详情</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<el-collapse class="inner">
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<div class="titlei">选择题 (共{{topicCount[0]}}题 共计{{score[0]}}分)</div>
|
||||
</template>
|
||||
<div class="contenti">
|
||||
<ul class="question" v-for="(list, index) in topic[1]" :key="index">
|
||||
<li>{{index+1}}. {{list.question}} {{list.score}}分</li>
|
||||
</ul>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<div class="titlei">填空题 (共{{topicCount[1]}}题 共计{{score[1]}}分)</div>
|
||||
</template>
|
||||
<div class="contenti">
|
||||
<ul class="question" v-for="(list, index) in topic[2]" :key="index">
|
||||
<li>{{topicCount[0]+index+1}}.{{list.question}} {{list.score}}分</li>
|
||||
</ul>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<div class="titlei">判断题 (共{{topicCount[2]}}题 共计{{score[2]}}分)</div>
|
||||
</template>
|
||||
<div class="contenti">
|
||||
<ul class="question" v-for="(list, index) in topic[3]" :key="index">
|
||||
<li>{{topicCount[0]+topicCount[1]+index+1}}. {{list.question}} {{list.score}}分</li>
|
||||
</ul>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-collapse-item>
|
||||
|
||||
</el-collapse>
|
||||
</div>
|
||||
<!--考生须知对话框-->
|
||||
<el-dialog
|
||||
title="考生须知"
|
||||
:visible.sync="dialogVisible"
|
||||
width="30%">
|
||||
<span>{{examData.tips}}</span>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">知道了</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false, //对话框属性
|
||||
activeName: '0', //默认打开序号
|
||||
topicCount: [],//每种类型题目的总数
|
||||
score: [], //每种类型分数的总数
|
||||
examData: { //考试信息
|
||||
// source: null,
|
||||
// totalScore: null,
|
||||
},
|
||||
topic: { //试卷信息
|
||||
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
//初始化页面数据
|
||||
init() {
|
||||
let examCode = this.$route.query.examCode //获取路由传递过来的试卷编号
|
||||
this.$axios(`/api/exam/${examCode}`).then(res => { //通过examCode请求试卷详细信息
|
||||
res.data.data.examDate = res.data.data.examDate.substr(0,10)
|
||||
this.examData = { ...res.data.data}
|
||||
let paperId = this.examData.paperId
|
||||
this.$axios(`/api/paper/${paperId}`).then(res => { //通过paperId获取试题题目信息
|
||||
this.topic = {...res.data}
|
||||
let keys = Object.keys(this.topic) //对象转数组
|
||||
keys.forEach(e => {
|
||||
let data = this.topic[e]
|
||||
this.topicCount.push(data.length)
|
||||
let currentScore = 0
|
||||
for(let i = 0; i< data.length; i++) { //循环每种题型,计算出总分
|
||||
currentScore += data[i].score
|
||||
}
|
||||
this.score.push(currentScore) //把每种题型总分存入score
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
toAnswer(id) {
|
||||
this.$router.push({path:"/answer",query:{examCode: id}})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.bottom {
|
||||
.right{
|
||||
.el-button{
|
||||
color: #409EFF;
|
||||
border-color: #c6e2ff;
|
||||
background-color: #ecf5ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right {
|
||||
margin-left: auto;
|
||||
}
|
||||
.inner .contenti .question {
|
||||
margin-left: 40px;
|
||||
color: #9a9a9a;
|
||||
font-size: 14px;
|
||||
}
|
||||
.content .inner .titlei {
|
||||
margin-left: 20px;
|
||||
font-size: 16px;
|
||||
color: #88949b;
|
||||
font-weight: bold;
|
||||
}
|
||||
.content .title .time {
|
||||
font-size: 16px;
|
||||
margin-left: 420px;
|
||||
color: #999;
|
||||
}
|
||||
.content .stitle {
|
||||
background-color: #0195ff;
|
||||
}
|
||||
.content .title span {
|
||||
margin-right: 10px;
|
||||
}
|
||||
#msg .content .title {
|
||||
font-size: 20px;
|
||||
margin: 0px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.content {
|
||||
margin-top: 20px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.content .header {
|
||||
padding: 10px 30px;
|
||||
}
|
||||
.wrapper .info {
|
||||
margin: 20px 0px 0px 20px;
|
||||
border-top: 1px solid #eee;
|
||||
padding: 20px 0px 10px 0px;
|
||||
}
|
||||
.wrapper .info a {
|
||||
color: #88949b;
|
||||
font-size: 14px;
|
||||
}
|
||||
.wrapper .info a:hover {
|
||||
color: #0195ff;
|
||||
}
|
||||
.wrapper .bottom .btn {
|
||||
cursor: pointer;
|
||||
padding: 5px 10px;
|
||||
border: 1px solid #88949b;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.wrapper .bottom {
|
||||
display: flex;
|
||||
margin-left: 20px;
|
||||
color: #999;
|
||||
font-size: 14px;
|
||||
align-items: center;
|
||||
}
|
||||
.wrapper .bottom li {
|
||||
margin-right: 14px;
|
||||
}
|
||||
#msg {
|
||||
background-color: #eee;
|
||||
width: 980px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#msg .title {
|
||||
margin: 20px;
|
||||
}
|
||||
#msg .wrapper {
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
}
|
||||
.wrapper .top {
|
||||
display: flex;
|
||||
margin: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
.wrapper .top .right {
|
||||
margin-left: auto;
|
||||
}
|
||||
.wrapper .top .example {
|
||||
color: #333;
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.wrapper .top li i {
|
||||
margin-left: 20px;
|
||||
color: #88949b;
|
||||
}
|
||||
.wrapper .right .count {
|
||||
margin-right: 60px;
|
||||
color: #fff;
|
||||
padding: 4px 10px;
|
||||
background-color: #88949b;
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
border: 1px solid #88949b;
|
||||
}
|
||||
.wrapper .right .score {
|
||||
position: absolute;
|
||||
left: 53px;
|
||||
top: -5px;
|
||||
padding: 1px 12px;
|
||||
font-size: 20px;
|
||||
color: #88949b;
|
||||
border: 1px dashed #88949b;
|
||||
border-left: none;
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.wrapper .right div {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
@ -0,0 +1,152 @@
|
||||
<!--
|
||||
* 学生考试首页
|
||||
*
|
||||
* @Author: ShanZhu
|
||||
* @Date: 2023-11-23
|
||||
-->
|
||||
<template>
|
||||
<div id="student">
|
||||
<el-row class="padding-50">
|
||||
<el-col :span="24">
|
||||
<ul class="list">
|
||||
<li class="logo"><span>在线考试系统</span></li>
|
||||
<li @click="exam()"><a href="javascript:;" >考试中心</a></li>
|
||||
<li @click="practice()"><a href="javascript:;" >试卷练习</a></li>
|
||||
<li><router-link to="/scoreTable">我的分数</router-link></li>
|
||||
<li><router-link to="/message">交流区</router-link></li>
|
||||
<li class="right" @mouseenter="flag = !flag" @mouseleave="flag = !flag">
|
||||
<a href="javascript:;"><i class="iconfont icon-Userselect icon"></i>{{user.userName}}</a>
|
||||
<div class="msg" v-if="flag">
|
||||
<p @click="manage()">修改密码</p>
|
||||
<p class="exit" @click="exit()">退出</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!--路由区域-->
|
||||
<div class="main">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
<v-footer></v-footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import myFooter from "@/components/student/myFooter"
|
||||
import {mapState} from 'vuex'
|
||||
export default {
|
||||
components: {
|
||||
"v-footer": myFooter
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
flag: false,
|
||||
user: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.userInfo()
|
||||
},
|
||||
methods: {
|
||||
exit() { //退出登录
|
||||
this.$router.push({path:"/"}) //跳转到登录页面
|
||||
this.$cookies.remove("cname") //清除cookie
|
||||
this.$cookies.remove("cid")
|
||||
this.$cookies.remove("rb_token") //清除cookie
|
||||
this.$cookies.remove("rb_role")
|
||||
},
|
||||
manage() { //跳转到修改密码页面
|
||||
this.$router.push({path: '/manager'})
|
||||
},
|
||||
userInfo() {
|
||||
let studentName = this.$cookies.get("cname")
|
||||
let studentId = this.$cookies.get("cid")
|
||||
console.log(`studentId${studentId}`)
|
||||
console.log(`studentName ${studentName}`)
|
||||
this.user.userName = studentName
|
||||
this.user.studentId = studentId
|
||||
},
|
||||
practice() { //跳转练习模式
|
||||
let isPractice = true
|
||||
this.$store.commit("practice", isPractice)
|
||||
this.$router.push({path:'/startExam'})
|
||||
},
|
||||
exam() { //跳转考试模式
|
||||
let isPractice = false
|
||||
this.$store.commit("practice", isPractice)
|
||||
this.$router.push({path:'/student'})
|
||||
}
|
||||
},
|
||||
computed:mapState(["isPractice"])
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.right .icon {
|
||||
margin-right: 6px;
|
||||
}
|
||||
#student .padding-50 {
|
||||
margin: 0 auto;
|
||||
padding: 0 50px;
|
||||
box-shadow: 0 0 10px 4px rgba(1,149,255,0.1);
|
||||
background-color: #fff;
|
||||
}
|
||||
.list a {
|
||||
text-decoration: none;
|
||||
color: #334046;
|
||||
}
|
||||
li {
|
||||
list-style: none;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
}
|
||||
#student .list{
|
||||
display: flex;
|
||||
}
|
||||
#student .list li {
|
||||
padding: 0 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#student .list li:hover {
|
||||
background-color: #0195ff;
|
||||
transition: all 2s ease;
|
||||
}
|
||||
#student .list li:hover a {
|
||||
color: #fff;
|
||||
}
|
||||
#student .list .right {
|
||||
margin-left: auto;
|
||||
position: relative;
|
||||
}
|
||||
#student .list li.right :hover a {
|
||||
color: #000;
|
||||
}
|
||||
#student .list .logo {
|
||||
display: flex;
|
||||
font-weight: bold;
|
||||
color: #2f6c9f;
|
||||
}
|
||||
#student .list .logo i {
|
||||
font-size: 50px;
|
||||
}
|
||||
.right .msg {
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 2px;
|
||||
border-bottom: 3px solid #0195ff;
|
||||
background-color: #fff;
|
||||
}
|
||||
.right .msg p {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
width: 105px;
|
||||
}
|
||||
.right .msg p:hover {
|
||||
background-color: #0195ff;
|
||||
}
|
||||
</style>
|
@ -0,0 +1,111 @@
|
||||
<!--
|
||||
* 管理中心
|
||||
*
|
||||
* @Author: ShanZhu
|
||||
* @Date: 2023-11-23
|
||||
-->
|
||||
<template>
|
||||
<div id='manager'>
|
||||
<el-form :model="ruleForm2" status-icon :rules="rules2" ref="ruleForm2" label-width="100px" class="demo-ruleForm">
|
||||
<h3 class="alter">修改你的密码</h3>
|
||||
<el-form-item label="密码" prop="pass" class="pass">
|
||||
<el-input type="password" v-model="ruleForm2.pass" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码" prop="checkPass">
|
||||
<el-input type="password" v-model="ruleForm2.checkPass" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="submitForm('ruleForm2')">提交</el-button>
|
||||
<el-button @click="resetForm('ruleForm2')">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
var validatePass = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
callback(new Error('请输入密码'));
|
||||
} else {
|
||||
if (this.ruleForm2.checkPass !== '') {
|
||||
this.$refs.ruleForm2.validateField('checkPass');
|
||||
}
|
||||
callback();
|
||||
}
|
||||
};
|
||||
var validatePass2 = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
callback(new Error('请再次输入密码'));
|
||||
} else if (value !== this.ruleForm2.pass) {
|
||||
callback(new Error('两次输入密码不一致!'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
return {
|
||||
ispass: true,
|
||||
ruleForm2: {
|
||||
pass: '',
|
||||
checkPass: ''
|
||||
},
|
||||
rules2: {
|
||||
pass: [
|
||||
{ validator: validatePass, trigger: 'blur' }
|
||||
],
|
||||
checkPass: [
|
||||
{ validator: validatePass2, trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
submitForm(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
let studentId = this.$cookies.get("cid")
|
||||
this.$axios({ //修改密码
|
||||
url: '/api/studentPWD',
|
||||
method: 'put',
|
||||
data: {
|
||||
pwd: this.ruleForm2.pass,
|
||||
studentId
|
||||
}
|
||||
}).then(res => {
|
||||
if(res.data != null ) { //修改成功提示
|
||||
this.$message({
|
||||
message: '密码修改成功...',
|
||||
type: 'success'
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
resetForm(formName) {
|
||||
this.$refs[formName].resetFields();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#manager .pass label{
|
||||
color: red;
|
||||
font-size: 20px;
|
||||
}
|
||||
#manager {
|
||||
width: 600px;
|
||||
margin: 0 auto;
|
||||
margin-top: 100px;
|
||||
text-align: center;
|
||||
margin-bottom: 300px;
|
||||
}
|
||||
#manager .alter {
|
||||
margin: 30px 0px;
|
||||
}
|
||||
</style>
|
@ -0,0 +1,45 @@
|
||||
<!--
|
||||
* 页脚部分
|
||||
*
|
||||
* @Author: ShanZhu
|
||||
* @Date: 2023-11-23
|
||||
-->
|
||||
<template>
|
||||
<footer id="footer">
|
||||
<ul>
|
||||
<li><a href="javascript:;">关于我们</a></li>
|
||||
<li><a href="javascript:;">免责声明</a></li>
|
||||
<li><a href="javascript:;">使用协议</a></li>
|
||||
<li>@Copyright 杭州水果捞</li>
|
||||
</ul>
|
||||
</footer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "myFooter"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#footer a {
|
||||
color: #919698;
|
||||
font-size: 14px;
|
||||
}
|
||||
#footer {
|
||||
background-color: #eee;
|
||||
}
|
||||
#footer ul {
|
||||
margin-top: 40px;
|
||||
border-top: 1px solid #d5d5d5;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
}
|
||||
#footer ul li {
|
||||
color: #919698;
|
||||
font-size: 14px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
</style>
|
@ -0,0 +1,32 @@
|
||||
/*
|
||||
* 主函数
|
||||
*
|
||||
* @Author: cyh
|
||||
* @Date: 2024-10-11
|
||||
*/
|
||||
import Vue from 'vue'
|
||||
import App from './App'
|
||||
import router from './router'
|
||||
import echarts from 'echarts'
|
||||
import axios from 'axios'
|
||||
import ElementUI from 'element-ui'
|
||||
import 'element-ui/lib/theme-chalk/index.css'
|
||||
import VueCookies from 'vue-cookies'
|
||||
import store from '@/vuex/store'
|
||||
|
||||
Vue.use(ElementUI)
|
||||
Vue.use(VueCookies)
|
||||
|
||||
Vue.config.productionTip = false
|
||||
Vue.prototype.bus = new Vue()
|
||||
Vue.prototype.$echarts = echarts
|
||||
Vue.prototype.$axios = axios
|
||||
|
||||
new Vue({
|
||||
el: '#app',
|
||||
router,
|
||||
store,
|
||||
render: h => h(App),
|
||||
components: { App },
|
||||
template: '<App/>'
|
||||
})
|
@ -0,0 +1,109 @@
|
||||
import Vue from 'vue'
|
||||
import Router from 'vue-router'
|
||||
Vue.use(Router)
|
||||
|
||||
|
||||
|
||||
const VueRouterPush = Router.prototype.push
|
||||
|
||||
Router.prototype.push = function push (to) {
|
||||
return VueRouterPush.call(this, to).catch(err => err)
|
||||
}
|
||||
|
||||
export default new Router({
|
||||
routes: [
|
||||
{
|
||||
path: '/',
|
||||
name: 'login', //登录界面
|
||||
component: () => import('@/components/common/login')
|
||||
},
|
||||
{
|
||||
path: '/index', //教师主页
|
||||
component: () => import('@/components/admin/index'),
|
||||
children: [
|
||||
{
|
||||
path: '/', //首页默认路由
|
||||
component: () => import('@/components/common/hello')
|
||||
},
|
||||
{
|
||||
path:'/grade', //学生成绩
|
||||
component: () => import('@/components/charts/grade')
|
||||
},
|
||||
{
|
||||
path: '/selectExamToPart', //学生分数段
|
||||
component: () => import('@/components/teacher/selectExamToPart')
|
||||
},
|
||||
{
|
||||
path: '/scorePart',
|
||||
component: () => import('@/components/charts/scorePart')
|
||||
},
|
||||
{
|
||||
path: '/allStudentsGrade', //所有学生成绩统计
|
||||
component: () => import('@/components/teacher/allStudentsGrade')
|
||||
},
|
||||
// {
|
||||
// path: '/examDescription', //考试管理功能描述
|
||||
// component: () => import('@/components/teacher/examDescription')
|
||||
// },
|
||||
{
|
||||
path: '/selectExam', //查询所有考试
|
||||
component: () => import('@/components/teacher/selectExam')
|
||||
},
|
||||
{
|
||||
path: '/addExam', //添加考试
|
||||
component: () => import('@/components/teacher/addExam')
|
||||
},
|
||||
// {
|
||||
// path: '/answerDescription', //题库管理功能介绍
|
||||
// component: ()=> import('@/components/teacher/answerDescription')
|
||||
// },
|
||||
{
|
||||
path: '/selectAnswer', //查询所有题库
|
||||
component: () => import('@/components/teacher/selectAnswer')
|
||||
},
|
||||
{
|
||||
path: '/addAnswer', //增加题库主界面
|
||||
component: () => import('@/components/teacher/addAnswer')
|
||||
},
|
||||
{
|
||||
path: '/editAnswerChildren', //编辑题库主界面
|
||||
component: () => import('@/components/teacher/editAnswerChildren')
|
||||
},
|
||||
{
|
||||
path: '/addAnswerChildren', //点击试卷跳转到添加题库页面
|
||||
component: () => import('@/components/teacher/addAnswerChildren')
|
||||
},
|
||||
{
|
||||
path: '/studentManage', //学生管理界面
|
||||
component: () => import('@/components/teacher/studentManage')
|
||||
},
|
||||
{
|
||||
path: '/addStudent', //添加学生
|
||||
component: () => import('@/components/teacher/addStudent')
|
||||
},
|
||||
{
|
||||
path: '/teacherManage',
|
||||
component: () => import('@/components/admin/tacherManage')
|
||||
},
|
||||
{
|
||||
path: '/addTeacher',
|
||||
component: () => import ('@/components/admin/addTeacher')
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/student',
|
||||
component: () => import('@/components/student/index'),
|
||||
children: [
|
||||
{path:"/",component: ()=> import('@/components/student/myExam')},
|
||||
{path:'/startExam', component: () => import('@/components/student/startExam')},
|
||||
{path: '/manager', component: () => import('@/components/student/manager')},
|
||||
{path: '/examMsg', component: () => import('@/components/student/examMsg')},
|
||||
{path: '/message', component: () => import('@/components/student/message')},
|
||||
{path: '/studentScore', component: () => import("@/components/student/answerScore")},
|
||||
{path: '/scoreTable', component: () => import("@/components/student/scoreTable")}
|
||||
]
|
||||
},
|
||||
{path: '/answer',component: () => import('@/components/student/answer')}
|
||||
]
|
||||
})
|
@ -0,0 +1,64 @@
|
||||
import VUE from 'vue'
|
||||
import VUEX from 'vuex'
|
||||
|
||||
VUE.use(VUEX)
|
||||
|
||||
const state = {
|
||||
isPractice: false, //练习模式标志
|
||||
flag: false, //菜单栏左右滑动标志
|
||||
userInfo: null,
|
||||
menu: [{
|
||||
index: '1',
|
||||
title: '考试管理',
|
||||
icon: 'icon-kechengbiao',
|
||||
content: [{ item2: '考试查询', path: 'selectExam' }, { item3: '添加考试', path: '/addExam' }],
|
||||
},
|
||||
{
|
||||
index: '2',
|
||||
title: '题库管理',
|
||||
icon: 'icon-tiku',
|
||||
content: [{ item2: '所有题库', path: '/selectAnswer' }, { item3: '增加题库', path: '/addAnswer' }, { path: '/addAnswerChildren' }],
|
||||
},
|
||||
{
|
||||
index: '3',
|
||||
title: '成绩查询',
|
||||
icon: 'icon-performance',
|
||||
content: [{ item1: '学生成绩查询', path: '/allStudentsGrade' }, { path: '/grade' }, { item2: '成绩分段查询', path: '/selectExamToPart' }, { path: '/scorePart' }],
|
||||
},
|
||||
{
|
||||
index: '4',
|
||||
title: '学生管理',
|
||||
icon: 'icon-role',
|
||||
content: [{ item1: '学生管理', path: '/studentManage' }, { item2: '添加学生', path: '/addStudent' }],
|
||||
},
|
||||
],
|
||||
}
|
||||
const mutations = {
|
||||
practice(state, status) {
|
||||
state.isPractice = status
|
||||
},
|
||||
toggle(state) {
|
||||
state.flag = !state.flag
|
||||
},
|
||||
changeUserInfo(state, info) {
|
||||
state.userInfo = info
|
||||
}
|
||||
}
|
||||
const getters = {
|
||||
|
||||
}
|
||||
const actions = {
|
||||
getUserInfo(context, info) {
|
||||
context.commit('changeUserInfo', info)
|
||||
},
|
||||
getPractice(context, status) {
|
||||
context.commit('practice', status)
|
||||
}
|
||||
}
|
||||
export default new VUEX.Store({
|
||||
state,
|
||||
mutations,
|
||||
getters,
|
||||
actions,
|
||||
// store
|
||||
})
|
After Width: | Height: | Size: 34 KiB |
After Width: | Height: | Size: 34 KiB |