├── .babelrc ├── .electron-vue ├── build.js ├── dev-client.js ├── dev-runner.js ├── webpack.main.config.js ├── webpack.renderer.config.js └── webpack.web.config.js ├── .eslintignore ├── .eslintrc.js ├── .gitignore ├── .travis.yml ├── README.md ├── appveyor.yml ├── build └── icons │ ├── 256x256.png │ ├── icon.icns │ └── icon.ico ├── config ├── dev.env.js ├── index.js └── prod.env.js ├── dist ├── electron │ └── .gitkeep └── web │ └── .gitkeep ├── package.json ├── src ├── index.ejs ├── main │ ├── index.dev.js │ └── index.js └── renderer │ ├── App.vue │ ├── api │ ├── login.js │ └── table.js │ ├── assets │ ├── 404_images │ │ ├── 404.png │ │ └── 404_cloud.png │ └── logo.png │ ├── components │ ├── Breadcrumb │ │ └── index.vue │ ├── Hamburger │ │ └── index.vue │ ├── ScrollBar │ │ └── index.vue │ └── SvgIcon │ │ └── index.vue │ ├── icons │ ├── index.js │ └── svg │ │ ├── example.svg │ │ ├── eye.svg │ │ ├── form.svg │ │ ├── password.svg │ │ ├── table.svg │ │ ├── tree.svg │ │ └── user.svg │ ├── main.js │ ├── permission.js │ ├── router │ └── index.js │ ├── store │ ├── getters.js │ ├── index.js │ └── modules │ │ ├── app.js │ │ └── user.js │ ├── styles │ ├── element-ui.scss │ ├── index.scss │ ├── mixin.scss │ ├── sidebar.scss │ ├── transition.scss │ └── variables.scss │ ├── utils │ ├── auth.js │ ├── index.js │ ├── request.js │ └── validate.js │ └── views │ ├── 404.vue │ ├── dashboard │ └── index.vue │ ├── form │ └── index.vue │ ├── layout │ ├── Layout.vue │ ├── components │ │ ├── AppMain.vue │ │ ├── Navbar.vue │ │ ├── Sidebar │ │ │ ├── SidebarItem.vue │ │ │ └── index.vue │ │ └── index.js │ └── mixin │ │ └── ResizeHandler.js │ ├── login │ └── index.vue │ ├── table │ └── index.vue │ └── tree │ └── index.vue └── static └── .gitkeep /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "comments": false, 3 | "env": { 4 | "main": { 5 | "presets": [ 6 | ["env", { 7 | "targets": { "node": 7 } 8 | }], 9 | "stage-0" 10 | ] 11 | }, 12 | "renderer": { 13 | "presets": [ 14 | ["env", { 15 | "modules": false 16 | }], 17 | "stage-0" 18 | ] 19 | }, 20 | "web": { 21 | "presets": [ 22 | ["env", { 23 | "modules": false 24 | }], 25 | "stage-0" 26 | ] 27 | } 28 | }, 29 | "plugins": ["transform-runtime"] 30 | } 31 | -------------------------------------------------------------------------------- /.electron-vue/build.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | process.env.NODE_ENV = 'production' 4 | 5 | const { say } = require('cfonts') 6 | const chalk = require('chalk') 7 | const del = require('del') 8 | const { spawn } = require('child_process') 9 | const webpack = require('webpack') 10 | const Multispinner = require('multispinner') 11 | 12 | 13 | const mainConfig = require('./webpack.main.config') 14 | const rendererConfig = require('./webpack.renderer.config') 15 | const webConfig = require('./webpack.web.config') 16 | 17 | const doneLog = chalk.bgGreen.white(' DONE ') + ' ' 18 | const errorLog = chalk.bgRed.white(' ERROR ') + ' ' 19 | const okayLog = chalk.bgBlue.white(' OKAY ') + ' ' 20 | const isCI = process.env.CI || false 21 | 22 | if (process.env.BUILD_TARGET === 'clean') clean() 23 | else if (process.env.BUILD_TARGET === 'web') web() 24 | else build() 25 | 26 | function clean () { 27 | del.sync(['build/*', '!build/icons', '!build/icons/icon.*']) 28 | console.log(`\n${doneLog}\n`) 29 | process.exit() 30 | } 31 | 32 | function build () { 33 | greeting() 34 | 35 | del.sync(['dist/electron/*', '!.gitkeep']) 36 | 37 | const tasks = ['main', 'renderer'] 38 | const m = new Multispinner(tasks, { 39 | preText: 'building', 40 | postText: 'process' 41 | }) 42 | 43 | let results = '' 44 | 45 | m.on('success', () => { 46 | process.stdout.write('\x1B[2J\x1B[0f') 47 | console.log(`\n\n${results}`) 48 | console.log(`${okayLog}take it away ${chalk.yellow('`electron-builder`')}\n`) 49 | process.exit() 50 | }) 51 | 52 | pack(mainConfig).then(result => { 53 | results += result + '\n\n' 54 | m.success('main') 55 | }).catch(err => { 56 | m.error('main') 57 | console.log(`\n ${errorLog}failed to build main process`) 58 | console.error(`\n${err}\n`) 59 | process.exit(1) 60 | }) 61 | 62 | pack(rendererConfig).then(result => { 63 | results += result + '\n\n' 64 | m.success('renderer') 65 | }).catch(err => { 66 | m.error('renderer') 67 | console.log(`\n ${errorLog}failed to build renderer process`) 68 | console.error(`\n${err}\n`) 69 | process.exit(1) 70 | }) 71 | } 72 | 73 | function pack (config) { 74 | return new Promise((resolve, reject) => { 75 | webpack(config, (err, stats) => { 76 | if (err) reject(err.stack || err) 77 | else if (stats.hasErrors()) { 78 | let err = '' 79 | 80 | stats.toString({ 81 | chunks: false, 82 | colors: true 83 | }) 84 | .split(/\r?\n/) 85 | .forEach(line => { 86 | err += ` ${line}\n` 87 | }) 88 | 89 | reject(err) 90 | } else { 91 | resolve(stats.toString({ 92 | chunks: false, 93 | colors: true 94 | })) 95 | } 96 | }) 97 | }) 98 | } 99 | 100 | function web () { 101 | del.sync(['dist/web/*', '!.gitkeep']) 102 | webpack(webConfig, (err, stats) => { 103 | if (err || stats.hasErrors()) console.log(err) 104 | 105 | console.log(stats.toString({ 106 | chunks: false, 107 | colors: true 108 | })) 109 | 110 | process.exit() 111 | }) 112 | } 113 | 114 | function greeting () { 115 | const cols = process.stdout.columns 116 | let text = '' 117 | 118 | if (cols > 85) text = 'lets-build' 119 | else if (cols > 60) text = 'lets-|build' 120 | else text = false 121 | 122 | if (text && !isCI) { 123 | say(text, { 124 | colors: ['yellow'], 125 | font: 'simple3d', 126 | space: false 127 | }) 128 | } else console.log(chalk.yellow.bold('\n lets-build')) 129 | console.log() 130 | } 131 | -------------------------------------------------------------------------------- /.electron-vue/dev-client.js: -------------------------------------------------------------------------------- 1 | const hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true') 2 | 3 | hotClient.subscribe(event => { 4 | /** 5 | * Reload browser when HTMLWebpackPlugin emits a new index.html 6 | * 7 | * Currently disabled until jantimon/html-webpack-plugin#680 is resolved. 8 | * https://github.com/SimulatedGREG/electron-vue/issues/437 9 | * https://github.com/jantimon/html-webpack-plugin/issues/680 10 | */ 11 | // if (event.action === 'reload') { 12 | // window.location.reload() 13 | // } 14 | 15 | /** 16 | * Notify `mainWindow` when `main` process is compiling, 17 | * giving notice for an expected reload of the `electron` process 18 | */ 19 | if (event.action === 'compiling') { 20 | document.body.innerHTML += ` 21 | 34 | 35 |
36 | Compiling Main Process... 37 |
38 | ` 39 | } 40 | }) 41 | -------------------------------------------------------------------------------- /.electron-vue/dev-runner.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | const chalk = require('chalk') 4 | const electron = require('electron') 5 | const path = require('path') 6 | const { say } = require('cfonts') 7 | const { spawn } = require('child_process') 8 | const webpack = require('webpack') 9 | const WebpackDevServer = require('webpack-dev-server') 10 | const webpackHotMiddleware = require('webpack-hot-middleware') 11 | 12 | const mainConfig = require('./webpack.main.config') 13 | const rendererConfig = require('./webpack.renderer.config') 14 | 15 | let electronProcess = null 16 | let manualRestart = false 17 | let hotMiddleware 18 | 19 | function logStats (proc, data) { 20 | let log = '' 21 | 22 | log += chalk.yellow.bold(`┏ ${proc} Process ${new Array((19 - proc.length) + 1).join('-')}`) 23 | log += '\n\n' 24 | 25 | if (typeof data === 'object') { 26 | data.toString({ 27 | colors: true, 28 | chunks: false 29 | }).split(/\r?\n/).forEach(line => { 30 | log += ' ' + line + '\n' 31 | }) 32 | } else { 33 | log += ` ${data}\n` 34 | } 35 | 36 | log += '\n' + chalk.yellow.bold(`┗ ${new Array(28 + 1).join('-')}`) + '\n' 37 | 38 | console.log(log) 39 | } 40 | 41 | function startRenderer () { 42 | return new Promise((resolve, reject) => { 43 | rendererConfig.entry.renderer = [path.join(__dirname, 'dev-client')].concat(rendererConfig.entry.renderer) 44 | 45 | const compiler = webpack(rendererConfig) 46 | hotMiddleware = webpackHotMiddleware(compiler, { 47 | log: false, 48 | heartbeat: 2500 49 | }) 50 | 51 | compiler.plugin('compilation', compilation => { 52 | compilation.plugin('html-webpack-plugin-after-emit', (data, cb) => { 53 | hotMiddleware.publish({ action: 'reload' }) 54 | cb() 55 | }) 56 | }) 57 | 58 | compiler.plugin('done', stats => { 59 | logStats('Renderer', stats) 60 | }) 61 | 62 | const server = new WebpackDevServer( 63 | compiler, 64 | { 65 | contentBase: path.join(__dirname, '../'), 66 | quiet: true, 67 | before (app, ctx) { 68 | app.use(hotMiddleware) 69 | ctx.middleware.waitUntilValid(() => { 70 | resolve() 71 | }) 72 | } 73 | } 74 | ) 75 | 76 | server.listen(9080) 77 | }) 78 | } 79 | 80 | function startMain () { 81 | return new Promise((resolve, reject) => { 82 | mainConfig.entry.main = [path.join(__dirname, '../src/main/index.dev.js')].concat(mainConfig.entry.main) 83 | 84 | const compiler = webpack(mainConfig) 85 | 86 | compiler.plugin('watch-run', (compilation, done) => { 87 | logStats('Main', chalk.white.bold('compiling...')) 88 | hotMiddleware.publish({ action: 'compiling' }) 89 | done() 90 | }) 91 | 92 | compiler.watch({}, (err, stats) => { 93 | if (err) { 94 | console.log(err) 95 | return 96 | } 97 | 98 | logStats('Main', stats) 99 | 100 | if (electronProcess && electronProcess.kill) { 101 | manualRestart = true 102 | process.kill(electronProcess.pid) 103 | electronProcess = null 104 | startElectron() 105 | 106 | setTimeout(() => { 107 | manualRestart = false 108 | }, 5000) 109 | } 110 | 111 | resolve() 112 | }) 113 | }) 114 | } 115 | 116 | function startElectron () { 117 | electronProcess = spawn(electron, ['--inspect=5858', path.join(__dirname, '../dist/electron/main.js')]) 118 | 119 | electronProcess.stdout.on('data', data => { 120 | electronLog(data, 'blue') 121 | }) 122 | electronProcess.stderr.on('data', data => { 123 | electronLog(data, 'red') 124 | }) 125 | 126 | electronProcess.on('close', () => { 127 | if (!manualRestart) process.exit() 128 | }) 129 | } 130 | 131 | function electronLog (data, color) { 132 | let log = '' 133 | data = data.toString().split(/\r?\n/) 134 | data.forEach(line => { 135 | log += ` ${line}\n` 136 | }) 137 | if (/[0-9A-z]+/.test(log)) { 138 | console.log( 139 | chalk[color].bold('┏ Electron -------------------') + 140 | '\n\n' + 141 | log + 142 | chalk[color].bold('┗ ----------------------------') + 143 | '\n' 144 | ) 145 | } 146 | } 147 | 148 | function greeting () { 149 | const cols = process.stdout.columns 150 | let text = '' 151 | 152 | if (cols > 104) text = 'electron-vue' 153 | else if (cols > 76) text = 'electron-|vue' 154 | else text = false 155 | 156 | if (text) { 157 | say(text, { 158 | colors: ['yellow'], 159 | font: 'simple3d', 160 | space: false 161 | }) 162 | } else console.log(chalk.yellow.bold('\n electron-vue')) 163 | console.log(chalk.blue(' getting ready...') + '\n') 164 | } 165 | 166 | function init () { 167 | greeting() 168 | 169 | Promise.all([startRenderer(), startMain()]) 170 | .then(() => { 171 | startElectron() 172 | }) 173 | .catch(err => { 174 | console.error(err) 175 | }) 176 | } 177 | 178 | init() 179 | -------------------------------------------------------------------------------- /.electron-vue/webpack.main.config.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | process.env.BABEL_ENV = 'main' 4 | 5 | const path = require('path') 6 | const { dependencies } = require('../package.json') 7 | const webpack = require('webpack') 8 | 9 | const BabiliWebpackPlugin = require('babili-webpack-plugin') 10 | 11 | let mainConfig = { 12 | entry: { 13 | main: path.join(__dirname, '../src/main/index.js') 14 | }, 15 | externals: [ 16 | ...Object.keys(dependencies || {}) 17 | ], 18 | module: { 19 | rules: [ 20 | { 21 | test: /\.(js)$/, 22 | enforce: 'pre', 23 | exclude: /node_modules/, 24 | use: { 25 | loader: 'eslint-loader', 26 | options: { 27 | formatter: require('eslint-friendly-formatter') 28 | } 29 | } 30 | }, 31 | { 32 | test: /\.js$/, 33 | use: 'babel-loader', 34 | exclude: /node_modules/ 35 | }, 36 | { 37 | test: /\.node$/, 38 | use: 'node-loader' 39 | } 40 | ] 41 | }, 42 | node: { 43 | __dirname: process.env.NODE_ENV !== 'production', 44 | __filename: process.env.NODE_ENV !== 'production' 45 | }, 46 | output: { 47 | filename: '[name].js', 48 | libraryTarget: 'commonjs2', 49 | path: path.join(__dirname, '../dist/electron') 50 | }, 51 | plugins: [ 52 | new webpack.NoEmitOnErrorsPlugin() 53 | ], 54 | resolve: { 55 | extensions: ['.js', '.json', '.node'] 56 | }, 57 | target: 'electron-main' 58 | } 59 | 60 | /** 61 | * Adjust mainConfig for development settings 62 | */ 63 | if (process.env.NODE_ENV !== 'production') { 64 | mainConfig.plugins.push( 65 | new webpack.DefinePlugin({ 66 | '__static': `"${path.join(__dirname, '../static').replace(/\\/g, '\\\\')}"` 67 | }) 68 | ) 69 | } 70 | 71 | /** 72 | * Adjust mainConfig for production settings 73 | */ 74 | if (process.env.NODE_ENV === 'production') { 75 | mainConfig.plugins.push( 76 | new BabiliWebpackPlugin(), 77 | new webpack.DefinePlugin({ 78 | 'process.env.NODE_ENV': '"production"' 79 | }) 80 | ) 81 | } 82 | 83 | module.exports = mainConfig 84 | -------------------------------------------------------------------------------- /.electron-vue/webpack.renderer.config.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | process.env.BABEL_ENV = 'renderer' 4 | 5 | const path = require('path') 6 | const { dependencies } = require('../package.json') 7 | const webpack = require('webpack') 8 | const config = require('../config/index.js') 9 | 10 | const BabiliWebpackPlugin = require('babili-webpack-plugin') 11 | const CopyWebpackPlugin = require('copy-webpack-plugin') 12 | const ExtractTextPlugin = require('extract-text-webpack-plugin') 13 | const HtmlWebpackPlugin = require('html-webpack-plugin') 14 | 15 | /** 16 | * List of node_modules to include in webpack bundle 17 | * 18 | * Required for specific packages like Vue UI libraries 19 | * that provide pure *.vue files that need compiling 20 | * https://simulatedgreg.gitbooks.io/electron-vue/content/en/webpack-configurations.html#white-listing-externals 21 | */ 22 | let whiteListedModules = ['vue'] 23 | 24 | let rendererConfig = { 25 | devtool: '#cheap-module-eval-source-map', 26 | entry: { 27 | renderer: path.join(__dirname, '../src/renderer/main.js') 28 | }, 29 | externals: [ 30 | ...Object.keys(dependencies || {}).filter(d => !whiteListedModules.includes(d)) 31 | ], 32 | module: { 33 | rules: [ 34 | { 35 | test: /\.(js|vue)$/, 36 | enforce: 'pre', 37 | exclude: /node_modules/, 38 | use: { 39 | loader: 'eslint-loader', 40 | options: { 41 | formatter: require('eslint-friendly-formatter') 42 | } 43 | } 44 | }, 45 | { 46 | test: /\.css$/, 47 | use: ExtractTextPlugin.extract({ 48 | fallback: 'style-loader', 49 | use: 'css-loader' 50 | }) 51 | }, 52 | { 53 | test: /\.html$/, 54 | use: 'vue-html-loader' 55 | }, 56 | { 57 | test: /\.js$/, 58 | use: 'babel-loader', 59 | exclude: /node_modules/ 60 | }, 61 | { 62 | test: /\.node$/, 63 | use: 'node-loader' 64 | }, 65 | { 66 | test: /\.vue$/, 67 | use: { 68 | loader: 'vue-loader', 69 | options: { 70 | extractCSS: process.env.NODE_ENV === 'production', 71 | loaders: { 72 | sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax=1', 73 | scss: 'vue-style-loader!css-loader!sass-loader' 74 | } 75 | } 76 | } 77 | }, 78 | { 79 | test: /\.svg$/, 80 | loader: 'svg-sprite-loader', 81 | include: [path.join(__dirname, '../src/renderer/icons')], 82 | options: { 83 | symbolId: 'icon-[name]' 84 | } 85 | }, 86 | { 87 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 88 | exclude: [path.join(__dirname, '../src/renderer/icons')], 89 | use: { 90 | loader: 'url-loader', 91 | query: { 92 | limit: 10000, 93 | name: 'imgs/[name]--[folder].[ext]' 94 | } 95 | } 96 | }, 97 | { 98 | test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/, 99 | loader: 'url-loader', 100 | options: { 101 | limit: 10000, 102 | name: 'media/[name]--[folder].[ext]' 103 | } 104 | }, 105 | { 106 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 107 | use: { 108 | loader: 'url-loader', 109 | query: { 110 | limit: 10000, 111 | name: 'fonts/[name]--[folder].[ext]' 112 | } 113 | } 114 | } 115 | ] 116 | }, 117 | node: { 118 | __dirname: process.env.NODE_ENV !== 'production', 119 | __filename: process.env.NODE_ENV !== 'production' 120 | }, 121 | plugins: [ 122 | new ExtractTextPlugin('styles.css'), 123 | new webpack.DefinePlugin({ 124 | 'process.env': process.env.NODE_ENV === 'production' ? config.build.env : config.dev.env 125 | }), 126 | new HtmlWebpackPlugin({ 127 | filename: 'index.html', 128 | template: path.resolve(__dirname, '../src/index.ejs'), 129 | minify: { 130 | collapseWhitespace: true, 131 | removeAttributeQuotes: true, 132 | removeComments: true 133 | }, 134 | nodeModules: process.env.NODE_ENV !== 'production' 135 | ? path.resolve(__dirname, '../node_modules') 136 | : false 137 | }), 138 | new webpack.HotModuleReplacementPlugin(), 139 | new webpack.NoEmitOnErrorsPlugin() 140 | ], 141 | output: { 142 | filename: '[name].js', 143 | libraryTarget: 'commonjs2', 144 | path: path.join(__dirname, '../dist/electron') 145 | }, 146 | resolve: { 147 | alias: { 148 | '@': path.join(__dirname, '../src/renderer'), 149 | 'vue$': 'vue/dist/vue.esm.js' 150 | }, 151 | extensions: ['.js', '.vue', '.json', '.css', '.node'] 152 | }, 153 | target: 'electron-renderer' 154 | } 155 | 156 | /** 157 | * Adjust rendererConfig for development settings 158 | */ 159 | if (process.env.NODE_ENV !== 'production') { 160 | rendererConfig.plugins.push( 161 | new webpack.DefinePlugin({ 162 | '__static': `"${path.join(__dirname, '../static').replace(/\\/g, '\\\\')}"` 163 | }) 164 | ) 165 | } 166 | 167 | /** 168 | * Adjust rendererConfig for production settings 169 | */ 170 | if (process.env.NODE_ENV === 'production') { 171 | rendererConfig.devtool = '' 172 | 173 | rendererConfig.plugins.push( 174 | new BabiliWebpackPlugin(), 175 | new CopyWebpackPlugin([ 176 | { 177 | from: path.join(__dirname, '../static'), 178 | to: path.join(__dirname, '../dist/electron/static'), 179 | ignore: ['.*'] 180 | } 181 | ]), 182 | new webpack.DefinePlugin({ 183 | 'process.env.NODE_ENV': '"production"' 184 | }), 185 | new webpack.LoaderOptionsPlugin({ 186 | minimize: true 187 | }) 188 | ) 189 | } 190 | 191 | module.exports = rendererConfig 192 | -------------------------------------------------------------------------------- /.electron-vue/webpack.web.config.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | process.env.BABEL_ENV = 'web' 4 | 5 | const path = require('path') 6 | const webpack = require('webpack') 7 | 8 | const BabiliWebpackPlugin = require('babili-webpack-plugin') 9 | const CopyWebpackPlugin = require('copy-webpack-plugin') 10 | const ExtractTextPlugin = require('extract-text-webpack-plugin') 11 | const HtmlWebpackPlugin = require('html-webpack-plugin') 12 | 13 | let webConfig = { 14 | devtool: '#cheap-module-eval-source-map', 15 | entry: { 16 | web: path.join(__dirname, '../src/renderer/main.js') 17 | }, 18 | module: { 19 | rules: [ 20 | { 21 | test: /\.(js|vue)$/, 22 | enforce: 'pre', 23 | exclude: /node_modules/, 24 | use: { 25 | loader: 'eslint-loader', 26 | options: { 27 | formatter: require('eslint-friendly-formatter') 28 | } 29 | } 30 | }, 31 | { 32 | test: /\.css$/, 33 | use: ExtractTextPlugin.extract({ 34 | fallback: 'style-loader', 35 | use: 'css-loader' 36 | }) 37 | }, 38 | { 39 | test: /\.html$/, 40 | use: 'vue-html-loader' 41 | }, 42 | { 43 | test: /\.js$/, 44 | use: 'babel-loader', 45 | include: [ path.resolve(__dirname, '../src/renderer') ], 46 | exclude: /node_modules/ 47 | }, 48 | { 49 | test: /\.vue$/, 50 | use: { 51 | loader: 'vue-loader', 52 | options: { 53 | extractCSS: true, 54 | loaders: { 55 | sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax=1', 56 | scss: 'vue-style-loader!css-loader!sass-loader' 57 | } 58 | } 59 | } 60 | }, 61 | { 62 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 63 | use: { 64 | loader: 'url-loader', 65 | query: { 66 | limit: 10000, 67 | name: 'imgs/[name].[ext]' 68 | } 69 | } 70 | }, 71 | { 72 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 73 | use: { 74 | loader: 'url-loader', 75 | query: { 76 | limit: 10000, 77 | name: 'fonts/[name].[ext]' 78 | } 79 | } 80 | } 81 | ] 82 | }, 83 | plugins: [ 84 | new ExtractTextPlugin('styles.css'), 85 | new HtmlWebpackPlugin({ 86 | filename: 'index.html', 87 | template: path.resolve(__dirname, '../src/index.ejs'), 88 | minify: { 89 | collapseWhitespace: true, 90 | removeAttributeQuotes: true, 91 | removeComments: true 92 | }, 93 | nodeModules: false 94 | }), 95 | new webpack.DefinePlugin({ 96 | 'process.env.IS_WEB': 'true' 97 | }), 98 | new webpack.HotModuleReplacementPlugin(), 99 | new webpack.NoEmitOnErrorsPlugin() 100 | ], 101 | output: { 102 | filename: '[name].js', 103 | path: path.join(__dirname, '../dist/web') 104 | }, 105 | resolve: { 106 | alias: { 107 | '@': path.join(__dirname, '../src/renderer'), 108 | 'vue$': 'vue/dist/vue.esm.js' 109 | }, 110 | extensions: ['.js', '.vue', '.json', '.css'] 111 | }, 112 | target: 'web' 113 | } 114 | 115 | /** 116 | * Adjust webConfig for production settings 117 | */ 118 | if (process.env.NODE_ENV === 'production') { 119 | webConfig.devtool = '' 120 | 121 | webConfig.plugins.push( 122 | new BabiliWebpackPlugin(), 123 | new CopyWebpackPlugin([ 124 | { 125 | from: path.join(__dirname, '../static'), 126 | to: path.join(__dirname, '../dist/web/static'), 127 | ignore: ['.*'] 128 | } 129 | ]), 130 | new webpack.DefinePlugin({ 131 | 'process.env.NODE_ENV': '"production"' 132 | }), 133 | new webpack.LoaderOptionsPlugin({ 134 | minimize: true 135 | }) 136 | ) 137 | } 138 | 139 | module.exports = webConfig 140 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | build/*.js 2 | src/renderer/assets/** 3 | dist/** 4 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parser: 'babel-eslint', 4 | parserOptions: { 5 | sourceType: 'module' 6 | }, 7 | env: { 8 | browser: true, 9 | node: true, 10 | es6: true, 11 | }, 12 | extends: 'eslint:recommended', 13 | // required to lint *.vue files 14 | plugins: [ 15 | 'html' 16 | ], 17 | // check if imports actually resolve 18 | 'settings': { 19 | 'import/resolver': { 20 | 'webpack': { 21 | 'config': 'build/webpack.base.conf.js' 22 | } 23 | } 24 | }, 25 | // add your custom rules here 26 | //it is base on https://github.com/vuejs/eslint-config-vue 27 | rules: { 28 | 'accessor-pairs': 2, 29 | 'arrow-spacing': [2, { 30 | 'before': true, 31 | 'after': true 32 | }], 33 | 'block-spacing': [2, 'always'], 34 | 'brace-style': [2, '1tbs', { 35 | 'allowSingleLine': true 36 | }], 37 | 'camelcase': [0, { 38 | 'properties': 'always' 39 | }], 40 | 'comma-dangle': [2, 'never'], 41 | 'comma-spacing': [2, { 42 | 'before': false, 43 | 'after': true 44 | }], 45 | 'comma-style': [2, 'last'], 46 | 'constructor-super': 2, 47 | 'curly': [2, 'multi-line'], 48 | 'dot-location': [2, 'property'], 49 | 'eol-last': 2, 50 | 'eqeqeq': [2, 'allow-null'], 51 | 'generator-star-spacing': [2, { 52 | 'before': true, 53 | 'after': true 54 | }], 55 | 'handle-callback-err': [2, '^(err|error)$'], 56 | 'indent': [2, 2, { 57 | 'SwitchCase': 1 58 | }], 59 | 'jsx-quotes': [2, 'prefer-single'], 60 | 'key-spacing': [2, { 61 | 'beforeColon': false, 62 | 'afterColon': true 63 | }], 64 | 'keyword-spacing': [2, { 65 | 'before': true, 66 | 'after': true 67 | }], 68 | 'new-cap': [2, { 69 | 'newIsCap': true, 70 | 'capIsNew': false 71 | }], 72 | 'new-parens': 2, 73 | 'no-array-constructor': 2, 74 | 'no-caller': 2, 75 | 'no-console': 'off', 76 | 'no-class-assign': 2, 77 | 'no-cond-assign': 2, 78 | 'no-const-assign': 2, 79 | 'no-control-regex': 2, 80 | 'no-delete-var': 2, 81 | 'no-dupe-args': 2, 82 | 'no-dupe-class-members': 2, 83 | 'no-dupe-keys': 2, 84 | 'no-duplicate-case': 2, 85 | 'no-empty-character-class': 2, 86 | 'no-empty-pattern': 2, 87 | 'no-eval': 2, 88 | 'no-ex-assign': 2, 89 | 'no-extend-native': 2, 90 | 'no-extra-bind': 2, 91 | 'no-extra-boolean-cast': 2, 92 | 'no-extra-parens': [2, 'functions'], 93 | 'no-fallthrough': 2, 94 | 'no-floating-decimal': 2, 95 | 'no-func-assign': 2, 96 | 'no-implied-eval': 2, 97 | 'no-inner-declarations': [2, 'functions'], 98 | 'no-invalid-regexp': 2, 99 | 'no-irregular-whitespace': 2, 100 | 'no-iterator': 2, 101 | 'no-label-var': 2, 102 | 'no-labels': [2, { 103 | 'allowLoop': false, 104 | 'allowSwitch': false 105 | }], 106 | 'no-lone-blocks': 2, 107 | 'no-mixed-spaces-and-tabs': 2, 108 | 'no-multi-spaces': 2, 109 | 'no-multi-str': 2, 110 | 'no-multiple-empty-lines': [2, { 111 | 'max': 1 112 | }], 113 | 'no-native-reassign': 2, 114 | 'no-negated-in-lhs': 2, 115 | 'no-new-object': 2, 116 | 'no-new-require': 2, 117 | 'no-new-symbol': 2, 118 | 'no-new-wrappers': 2, 119 | 'no-obj-calls': 2, 120 | 'no-octal': 2, 121 | 'no-octal-escape': 2, 122 | 'no-path-concat': 2, 123 | 'no-proto': 2, 124 | 'no-redeclare': 2, 125 | 'no-regex-spaces': 2, 126 | 'no-return-assign': [2, 'except-parens'], 127 | 'no-self-assign': 2, 128 | 'no-self-compare': 2, 129 | 'no-sequences': 2, 130 | 'no-shadow-restricted-names': 2, 131 | 'no-spaced-func': 2, 132 | 'no-sparse-arrays': 2, 133 | 'no-this-before-super': 2, 134 | 'no-throw-literal': 2, 135 | 'no-trailing-spaces': 2, 136 | 'no-undef': 2, 137 | 'no-undef-init': 2, 138 | 'no-unexpected-multiline': 2, 139 | 'no-unmodified-loop-condition': 2, 140 | 'no-unneeded-ternary': [2, { 141 | 'defaultAssignment': false 142 | }], 143 | 'no-unreachable': 2, 144 | 'no-unsafe-finally': 2, 145 | 'no-unused-vars': [2, { 146 | 'vars': 'all', 147 | 'args': 'none' 148 | }], 149 | 'no-useless-call': 2, 150 | 'no-useless-computed-key': 2, 151 | 'no-useless-constructor': 2, 152 | 'no-useless-escape': 0, 153 | 'no-whitespace-before-property': 2, 154 | 'no-with': 2, 155 | 'one-var': [2, { 156 | 'initialized': 'never' 157 | }], 158 | 'operator-linebreak': [2, 'after', { 159 | 'overrides': { 160 | '?': 'before', 161 | ':': 'before' 162 | } 163 | }], 164 | 'padded-blocks': [2, 'never'], 165 | 'quotes': [2, 'single', { 166 | 'avoidEscape': true, 167 | 'allowTemplateLiterals': true 168 | }], 169 | 'semi': [2, 'never'], 170 | 'semi-spacing': [2, { 171 | 'before': false, 172 | 'after': true 173 | }], 174 | 'space-before-blocks': [2, 'always'], 175 | 'space-before-function-paren': [2, 'never'], 176 | 'space-in-parens': [2, 'never'], 177 | 'space-infix-ops': 2, 178 | 'space-unary-ops': [2, { 179 | 'words': true, 180 | 'nonwords': false 181 | }], 182 | 'spaced-comment': [2, 'always', { 183 | 'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ','] 184 | }], 185 | 'template-curly-spacing': [2, 'never'], 186 | 'use-isnan': 2, 187 | 'valid-typeof': 2, 188 | 'wrap-iife': [2, 'any'], 189 | 'yield-star-spacing': [2, 'both'], 190 | 'yoda': [2, 'never'], 191 | 'prefer-const': 2, 192 | 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, 193 | 'object-curly-spacing': [2, 'always', { 194 | objectsInObjects: false 195 | }], 196 | 'array-bracket-spacing': [2, 'never'] 197 | } 198 | } 199 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | dist/electron/* 3 | dist/web/* 4 | build/* 5 | !build/icons 6 | package-lock.json 7 | node_modules/ 8 | npm-debug.log 9 | npm-debug.log.* 10 | thumbs.db 11 | !.gitkeep 12 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | osx_image: xcode8.3 2 | sudo: required 3 | dist: trusty 4 | language: c 5 | matrix: 6 | include: 7 | - os: osx 8 | - os: linux 9 | env: CC=clang CXX=clang++ npm_config_clang=1 10 | compiler: clang 11 | cache: 12 | directories: 13 | - node_modules 14 | - "$HOME/.electron" 15 | - "$HOME/.cache" 16 | addons: 17 | apt: 18 | packages: 19 | - libgnome-keyring-dev 20 | - icnsutils 21 | before_install: 22 | - mkdir -p /tmp/git-lfs && curl -L https://github.com/github/git-lfs/releases/download/v1.2.1/git-lfs-$([ 23 | "$TRAVIS_OS_NAME" == "linux" ] && echo "linux" || echo "darwin")-amd64-1.2.1.tar.gz 24 | | tar -xz -C /tmp/git-lfs --strip-components 1 && /tmp/git-lfs/git-lfs pull 25 | - if [[ "$TRAVIS_OS_NAME" == "linux" ]]; then sudo apt-get install --no-install-recommends -y icnsutils graphicsmagick xz-utils; fi 26 | install: 27 | - nvm install 7 28 | - curl -o- -L https://yarnpkg.com/install.sh | bash 29 | - source ~/.bashrc 30 | - npm install -g xvfb-maybe 31 | - yarn 32 | script: 33 | - yarn run build 34 | branches: 35 | only: 36 | - master 37 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # electron-vue-admin 2 | 3 | > An electron-vue project 4 | 5 | This is a vue electron admin project base on [vueAdmin-template](https://github.com/PanJiaChen/vueAdmin-template) , and was generated from [electron-vue](https://github.com/SimulatedGREG/electron-vue) using [vue-cli](https://github.com/vuejs/vue-cli). Documentation about this project can be found [here](https://simulatedgreg.gitbooks.io/electron-vue/content/index.html). 6 | 7 | ## Build Setup 8 | 9 | ``` bash 10 | # install dependencies 11 | npm install 12 | 13 | # serve with hot reload at localhost:9080 14 | npm run dev 15 | 16 | # build electron app for production 17 | npm run build 18 | 19 | # lint all JS/Vue component files in `app/src` 20 | npm run lint 21 | 22 | # run webpack in production 23 | npm run pack 24 | ``` 25 | --- 26 | 27 | 28 | ## Demo 29 | 30 | ![](https://github.com/PanJiaChen/PanJiaChen.github.io/blob/master/images/electron-login.png) 31 | 32 | ![](https://github.com/PanJiaChen/PanJiaChen.github.io/blob/master/images/electron-admin.gif) 33 | 34 | 35 | ## Download 36 | Mac: [app release](https://github.com/PanJiaChen/electron-vue-admin/releases/tag/v3.0.0) 37 | -------------------------------------------------------------------------------- /appveyor.yml: -------------------------------------------------------------------------------- 1 | version: 0.1.{build} 2 | 3 | branches: 4 | only: 5 | - master 6 | 7 | image: Visual Studio 2017 8 | platform: 9 | - x64 10 | 11 | cache: 12 | - node_modules 13 | - '%APPDATA%\npm-cache' 14 | - '%USERPROFILE%\.electron' 15 | - '%USERPROFILE%\AppData\Local\Yarn\cache' 16 | 17 | init: 18 | - git config --global core.autocrlf input 19 | 20 | install: 21 | - ps: Install-Product node 8 x64 22 | - choco install yarn --ignore-dependencies 23 | - git reset --hard HEAD 24 | - yarn 25 | - node --version 26 | 27 | build_script: 28 | - yarn build 29 | 30 | test: off 31 | -------------------------------------------------------------------------------- /build/icons/256x256.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/build/icons/256x256.png -------------------------------------------------------------------------------- /build/icons/icon.icns: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/build/icons/icon.icns -------------------------------------------------------------------------------- /build/icons/icon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/build/icons/icon.ico -------------------------------------------------------------------------------- /config/dev.env.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | NODE_ENV: '"development"', 3 | BASE_API: '"https://easy-mock.com/mock/5950a2419adc231f356a6636/vue-admin"' 4 | } 5 | -------------------------------------------------------------------------------- /config/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | build: { 3 | env: require('./prod.env') 4 | }, 5 | dev: { 6 | env: require('./dev.env') 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /config/prod.env.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | NODE_ENV: '"production"', 3 | BASE_API: '"https://easy-mock.com/mock/5950a2419adc231f356a6636/vue-admin"' 4 | } 5 | -------------------------------------------------------------------------------- /dist/electron/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/dist/electron/.gitkeep -------------------------------------------------------------------------------- /dist/web/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/dist/web/.gitkeep -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "electron-vue-admin", 3 | "version": "3.0.0", 4 | "author": "Pan ", 5 | "description": "An electron-vue project", 6 | "license": "MIT", 7 | "main": "./dist/electron/main.js", 8 | "scripts": { 9 | "build": "node .electron-vue/build.js && electron-builder", 10 | "build:dir": "node .electron-vue/build.js && electron-builder --dir", 11 | "build:clean": "cross-env BUILD_TARGET=clean node .electron-vue/build.js", 12 | "build:web": "cross-env BUILD_TARGET=web node .electron-vue/build.js", 13 | "dev": "node .electron-vue/dev-runner.js", 14 | "lint": "eslint --ext .js,.vue -f ./node_modules/eslint-friendly-formatter src", 15 | "lint:fix": "eslint --ext .js,.vue -f ./node_modules/eslint-friendly-formatter --fix src", 16 | "pack": "npm run pack:main && npm run pack:renderer", 17 | "pack:main": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.main.config.js", 18 | "pack:renderer": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.renderer.config.js", 19 | "postinstall": "npm run lint:fix" 20 | }, 21 | "build": { 22 | "productName": "electron-vue-admin", 23 | "appId": "org.simulatedgreg.electron-vue", 24 | "directories": { 25 | "output": "build" 26 | }, 27 | "files": [ 28 | "dist/electron/**/*" 29 | ], 30 | "dmg": { 31 | "contents": [ 32 | { 33 | "x": 410, 34 | "y": 150, 35 | "type": "link", 36 | "path": "/Applications" 37 | }, 38 | { 39 | "x": 130, 40 | "y": 150, 41 | "type": "file" 42 | } 43 | ] 44 | }, 45 | "mac": { 46 | "icon": "build/icons/icon.icns" 47 | }, 48 | "win": { 49 | "icon": "build/icons/icon.ico" 50 | }, 51 | "linux": { 52 | "icon": "build/icons" 53 | } 54 | }, 55 | "dependencies": { 56 | "axios": "0.17.1", 57 | "element-ui": "2.3.4", 58 | "js-cookie": "^2.2.0", 59 | "normalize.css": "7.0.0", 60 | "nprogress": "0.2.0", 61 | "vue": "2.5.10", 62 | "vue-electron": "^1.0.6", 63 | "vue-router": "3.0.1", 64 | "vuex": "3.0.1" 65 | }, 66 | "devDependencies": { 67 | "babel-core": "^6.25.0", 68 | "babel-loader": "^7.1.1", 69 | "babel-plugin-transform-runtime": "^6.23.0", 70 | "babel-preset-env": "^1.6.0", 71 | "babel-preset-stage-0": "^6.24.1", 72 | "babel-register": "^6.24.1", 73 | "babili-webpack-plugin": "^0.1.2", 74 | "cfonts": "^1.1.3", 75 | "chalk": "^2.1.0", 76 | "copy-webpack-plugin": "^4.0.1", 77 | "cross-env": "^5.0.5", 78 | "css-loader": "^0.28.4", 79 | "del": "^3.0.0", 80 | "devtron": "^1.4.0", 81 | "electron": "^1.7.5", 82 | "electron-debug": "^1.4.0", 83 | "electron-devtools-installer": "^2.2.0", 84 | "electron-builder": "^19.19.1", 85 | "babel-eslint": "^7.2.3", 86 | "eslint": "^4.4.1", 87 | "eslint-friendly-formatter": "^3.0.0", 88 | "eslint-loader": "^1.9.0", 89 | "eslint-plugin-html": "^3.1.1", 90 | "extract-text-webpack-plugin": "^3.0.0", 91 | "file-loader": "^0.11.2", 92 | "html-webpack-plugin": "^2.30.1", 93 | "multispinner": "^0.2.1", 94 | "node-loader": "^0.6.0", 95 | "node-sass": "^4.7.2", 96 | "style-loader": "^0.18.2", 97 | "sass-loader": "6.0.6", 98 | "svg-sprite-loader": "3.5.2", 99 | "url-loader": "^0.5.9", 100 | "vue-html-loader": "^1.2.4", 101 | "vue-loader": "^13.0.5", 102 | "vue-style-loader": "^3.0.1", 103 | "vue-template-compiler": "2.5.10", 104 | "webpack": "^3.5.2", 105 | "webpack-dev-server": "^2.7.1", 106 | "webpack-hot-middleware": "^2.18.2" 107 | } 108 | } 109 | -------------------------------------------------------------------------------- /src/index.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | electron-vue-admin 6 | <% if (htmlWebpackPlugin.options.nodeModules) { %> 7 | 8 | 11 | <% } %> 12 | 13 | 14 |
15 | 16 | 19 | 20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /src/main/index.dev.js: -------------------------------------------------------------------------------- 1 | /** 2 | * This file is used specifically and only for development. It installs 3 | * `electron-debug` & `vue-devtools`. There shouldn't be any need to 4 | * modify this file, but it can be used to extend your development 5 | * environment. 6 | */ 7 | 8 | /* eslint-disable */ 9 | 10 | // Set environment for development 11 | process.env.NODE_ENV = 'development' 12 | 13 | // Install `electron-debug` with `devtron` 14 | require('electron-debug')({ showDevTools: true }) 15 | 16 | // Install `vue-devtools` 17 | require('electron').app.on('ready', () => { 18 | let installExtension = require('electron-devtools-installer') 19 | installExtension.default(installExtension.VUEJS_DEVTOOLS) 20 | .then(() => {}) 21 | .catch(err => { 22 | console.log('Unable to install `vue-devtools`: \n', err) 23 | }) 24 | }) 25 | 26 | // Require `main` process to boot app 27 | require('./index') 28 | -------------------------------------------------------------------------------- /src/main/index.js: -------------------------------------------------------------------------------- 1 | import { app, BrowserWindow } from 'electron' 2 | 3 | /** 4 | * Set `__static` path to static files in production 5 | * https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-static-assets.html 6 | */ 7 | if (process.env.NODE_ENV !== 'development') { 8 | global.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\') 9 | } 10 | 11 | let mainWindow 12 | const winURL = process.env.NODE_ENV === 'development' 13 | ? `http://localhost:9080` 14 | : `file://${__dirname}/index.html` 15 | 16 | function createWindow() { 17 | /** 18 | * Initial window options 19 | */ 20 | mainWindow = new BrowserWindow({ 21 | height: 563, 22 | useContentSize: true, 23 | width: 1000 24 | }) 25 | 26 | mainWindow.loadURL(winURL) 27 | 28 | mainWindow.on('closed', () => { 29 | mainWindow = null 30 | }) 31 | } 32 | 33 | app.on('ready', createWindow) 34 | 35 | app.on('window-all-closed', () => { 36 | if (process.platform !== 'darwin') { 37 | app.quit() 38 | } 39 | }) 40 | 41 | app.on('activate', () => { 42 | if (mainWindow === null) { 43 | createWindow() 44 | } 45 | }) 46 | 47 | /** 48 | * Auto Updater 49 | * 50 | * Uncomment the following code below and install `electron-updater` to 51 | * support auto updating. Code Signing with a valid certificate is required. 52 | * https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-electron-builder.html#auto-updating 53 | */ 54 | 55 | /* 56 | import { autoUpdater } from 'electron-updater' 57 | 58 | autoUpdater.on('update-downloaded', () => { 59 | autoUpdater.quitAndInstall() 60 | }) 61 | 62 | app.on('ready', () => { 63 | if (process.env.NODE_ENV === 'production') autoUpdater.checkForUpdates() 64 | }) 65 | */ 66 | -------------------------------------------------------------------------------- /src/renderer/App.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 12 | 15 | -------------------------------------------------------------------------------- /src/renderer/api/login.js: -------------------------------------------------------------------------------- 1 | import request from '@/utils/request' 2 | 3 | export function login(username, password) { 4 | return request({ 5 | url: '/user/login', 6 | method: 'post', 7 | data: { 8 | username, 9 | password 10 | } 11 | }) 12 | } 13 | 14 | export function getInfo(token) { 15 | return request({ 16 | url: '/user/info', 17 | method: 'get', 18 | params: { token } 19 | }) 20 | } 21 | 22 | export function logout() { 23 | return request({ 24 | url: '/user/logout', 25 | method: 'post' 26 | }) 27 | } 28 | -------------------------------------------------------------------------------- /src/renderer/api/table.js: -------------------------------------------------------------------------------- 1 | import request from '@/utils/request' 2 | 3 | export function getList(params) { 4 | return request({ 5 | url: '/table/list', 6 | method: 'get', 7 | params 8 | }) 9 | } 10 | -------------------------------------------------------------------------------- /src/renderer/assets/404_images/404.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/src/renderer/assets/404_images/404.png -------------------------------------------------------------------------------- /src/renderer/assets/404_images/404_cloud.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/src/renderer/assets/404_images/404_cloud.png -------------------------------------------------------------------------------- /src/renderer/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/src/renderer/assets/logo.png -------------------------------------------------------------------------------- /src/renderer/components/Breadcrumb/index.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 39 | 40 | 52 | -------------------------------------------------------------------------------- /src/renderer/components/Hamburger/index.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 30 | 31 | 45 | -------------------------------------------------------------------------------- /src/renderer/components/ScrollBar/index.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 43 | 44 | 58 | -------------------------------------------------------------------------------- /src/renderer/components/SvgIcon/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 33 | 34 | 43 | -------------------------------------------------------------------------------- /src/renderer/icons/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import SvgIcon from '@/components/SvgIcon'// svg组件 3 | 4 | // register globally 5 | Vue.component('svg-icon', SvgIcon) 6 | 7 | const requireAll = requireContext => requireContext.keys().map(requireContext) 8 | const req = require.context('./svg', false, /\.svg$/) 9 | requireAll(req) 10 | -------------------------------------------------------------------------------- /src/renderer/icons/svg/example.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/renderer/icons/svg/eye.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/renderer/icons/svg/form.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/renderer/icons/svg/password.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/renderer/icons/svg/table.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/renderer/icons/svg/tree.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/renderer/icons/svg/user.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/renderer/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | import 'normalize.css/normalize.css'// A modern alternative to CSS resets 4 | 5 | import ElementUI from 'element-ui' 6 | import 'element-ui/lib/theme-chalk/index.css' 7 | import locale from 'element-ui/lib/locale/lang/en' // lang i18n 8 | 9 | import App from './App' 10 | import router from './router' 11 | import store from './store' 12 | 13 | import '@/icons' // icon 14 | import '@/permission' // permission control 15 | 16 | if (!process.env.IS_WEB) Vue.use(require('vue-electron')) 17 | 18 | Vue.use(ElementUI, { locale }) 19 | 20 | Vue.config.productionTip = false 21 | 22 | new Vue({ 23 | components: { App }, 24 | router, 25 | store, 26 | template: '' 27 | }).$mount('#app') 28 | -------------------------------------------------------------------------------- /src/renderer/permission.js: -------------------------------------------------------------------------------- 1 | import router from './router' 2 | import store from './store' 3 | import NProgress from 'nprogress' // Progress 进度条 4 | import 'nprogress/nprogress.css'// Progress 进度条样式 5 | import { Message } from 'element-ui' 6 | 7 | const whiteList = ['/login'] // 不重定向白名单 8 | router.beforeEach((to, from, next) => { 9 | NProgress.start() 10 | if (store.getters.token) { 11 | if (to.path === '/login') { 12 | next({ path: '/' }) 13 | NProgress.done() // if current page is dashboard will not trigger afterEach hook, so manually handle it 14 | } else { 15 | if (store.getters.roles.length === 0) { 16 | store.dispatch('GetInfo').then(res => { // 拉取用户信息 17 | next() 18 | }).catch((err) => { 19 | store.dispatch('FedLogOut').then(() => { 20 | Message.error(err || 'Verification failed, please login again') 21 | next({ path: '/' }) 22 | }) 23 | }) 24 | } else { 25 | next() 26 | } 27 | } 28 | } else { 29 | if (whiteList.indexOf(to.path) !== -1) { 30 | next() 31 | } else { 32 | next('/login') 33 | NProgress.done() 34 | } 35 | } 36 | }) 37 | 38 | router.afterEach(() => { 39 | NProgress.done() // 结束Progress 40 | }) 41 | -------------------------------------------------------------------------------- /src/renderer/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | 4 | // in development-env not use lazy-loading, because lazy-loading too many pages will cause webpack hot update too slow. so only in production use lazy-loading; 5 | // detail: https://panjiachen.github.io/vue-element-admin-site/#/lazy-loading 6 | 7 | Vue.use(Router) 8 | 9 | /* Layout */ 10 | import Layout from '../views/layout/Layout' 11 | 12 | /** 13 | * hidden: true if `hidden:true` will not show in the sidebar(default is false) 14 | * alwaysShow: true if set true, will always show the root menu, whatever its child routes length 15 | * if not set alwaysShow, only more than one route under the children 16 | * it will becomes nested mode, otherwise not show the root menu 17 | * redirect: noredirect if `redirect:noredirect` will no redirct in the breadcrumb 18 | * name:'router-name' the name is used by (must set!!!) 19 | * meta : { 20 | title: 'title' the name show in submenu and breadcrumb (recommend set) 21 | icon: 'svg-name' the icon show in the sidebar, 22 | } 23 | **/ 24 | export const constantRouterMap = [ 25 | { path: '/login', component: () => import('@/views/login/index'), hidden: true }, 26 | { path: '/404', component: () => import('@/views/404'), hidden: true }, 27 | 28 | { 29 | path: '/', 30 | component: Layout, 31 | redirect: '/dashboard', 32 | name: 'Dashboard', 33 | hidden: true, 34 | children: [{ 35 | path: 'dashboard', 36 | component: () => import('@/views/dashboard/index') 37 | }] 38 | }, 39 | 40 | { 41 | path: '/example', 42 | component: Layout, 43 | redirect: '/example/table', 44 | name: 'Example', 45 | meta: { title: 'Example', icon: 'example' }, 46 | children: [ 47 | { 48 | path: 'table', 49 | name: 'Table', 50 | component: () => import('@/views/table/index'), 51 | meta: { title: 'Table', icon: 'table' } 52 | }, 53 | { 54 | path: 'tree', 55 | name: 'Tree', 56 | component: () => import('@/views/tree/index'), 57 | meta: { title: 'Tree', icon: 'tree' } 58 | } 59 | ] 60 | }, 61 | 62 | { 63 | path: '/form', 64 | component: Layout, 65 | children: [ 66 | { 67 | path: 'index', 68 | name: 'Form', 69 | component: () => import('@/views/form/index'), 70 | meta: { title: 'Form', icon: 'form' } 71 | } 72 | ] 73 | }, 74 | 75 | { path: '*', redirect: '/404', hidden: true } 76 | ] 77 | 78 | export default new Router({ 79 | // mode: 'history', //后端支持可开 80 | scrollBehavior: () => ({ y: 0 }), 81 | routes: constantRouterMap 82 | }) 83 | 84 | -------------------------------------------------------------------------------- /src/renderer/store/getters.js: -------------------------------------------------------------------------------- 1 | const getters = { 2 | sidebar: state => state.app.sidebar, 3 | device: state => state.app.device, 4 | token: state => state.user.token, 5 | avatar: state => state.user.avatar, 6 | name: state => state.user.name, 7 | roles: state => state.user.roles 8 | } 9 | export default getters 10 | -------------------------------------------------------------------------------- /src/renderer/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | import app from './modules/app' 4 | import user from './modules/user' 5 | import getters from './getters' 6 | 7 | Vue.use(Vuex) 8 | 9 | const store = new Vuex.Store({ 10 | modules: { 11 | app, 12 | user 13 | }, 14 | getters 15 | }) 16 | 17 | export default store 18 | -------------------------------------------------------------------------------- /src/renderer/store/modules/app.js: -------------------------------------------------------------------------------- 1 | import Cookies from 'js-cookie' 2 | 3 | const app = { 4 | state: { 5 | sidebar: { 6 | opened: !+Cookies.get('sidebarStatus'), 7 | withoutAnimation: false 8 | }, 9 | device: 'desktop' 10 | }, 11 | mutations: { 12 | TOGGLE_SIDEBAR: state => { 13 | if (state.sidebar.opened) { 14 | Cookies.set('sidebarStatus', 1) 15 | } else { 16 | Cookies.set('sidebarStatus', 0) 17 | } 18 | state.sidebar.opened = !state.sidebar.opened 19 | }, 20 | CLOSE_SIDEBAR: (state, withoutAnimation) => { 21 | Cookies.set('sidebarStatus', 1) 22 | state.sidebar.opened = false 23 | state.sidebar.withoutAnimation = withoutAnimation 24 | }, 25 | TOGGLE_DEVICE: (state, device) => { 26 | state.device = device 27 | } 28 | }, 29 | actions: { 30 | ToggleSideBar: ({ commit }) => { 31 | commit('TOGGLE_SIDEBAR') 32 | }, 33 | CloseSideBar({ commit }, { withoutAnimation }) { 34 | commit('CLOSE_SIDEBAR', withoutAnimation) 35 | }, 36 | ToggleDevice({ commit }, device) { 37 | commit('TOGGLE_DEVICE', device) 38 | } 39 | } 40 | } 41 | 42 | export default app 43 | -------------------------------------------------------------------------------- /src/renderer/store/modules/user.js: -------------------------------------------------------------------------------- 1 | import { login, logout, getInfo } from '@/api/login' 2 | import { getToken, setToken, removeToken } from '@/utils/auth' 3 | 4 | const user = { 5 | state: { 6 | token: getToken(), 7 | name: '', 8 | avatar: '', 9 | roles: [] 10 | }, 11 | 12 | mutations: { 13 | SET_TOKEN: (state, token) => { 14 | state.token = token 15 | }, 16 | SET_NAME: (state, name) => { 17 | state.name = name 18 | }, 19 | SET_AVATAR: (state, avatar) => { 20 | state.avatar = avatar 21 | }, 22 | SET_ROLES: (state, roles) => { 23 | state.roles = roles 24 | } 25 | }, 26 | 27 | actions: { 28 | // 登录 29 | Login({ commit }, userInfo) { 30 | const username = userInfo.username.trim() 31 | return new Promise((resolve, reject) => { 32 | login(username, userInfo.password).then(response => { 33 | const data = response.data 34 | setToken(data.token) 35 | commit('SET_TOKEN', data.token) 36 | resolve() 37 | }).catch(error => { 38 | reject(error) 39 | }) 40 | }) 41 | }, 42 | 43 | // 获取用户信息 44 | GetInfo({ commit, state }) { 45 | return new Promise((resolve, reject) => { 46 | getInfo(state.token).then(response => { 47 | const data = response.data 48 | if (data.roles && data.roles.length > 0) { // 验证返回的roles是否是一个非空数组 49 | commit('SET_ROLES', data.roles) 50 | } else { 51 | reject('getInfo: roles must be a non-null array !') 52 | } 53 | commit('SET_NAME', data.name) 54 | commit('SET_AVATAR', data.avatar) 55 | resolve(response) 56 | }).catch(error => { 57 | reject(error) 58 | }) 59 | }) 60 | }, 61 | 62 | // 登出 63 | LogOut({ commit, state }) { 64 | return new Promise((resolve, reject) => { 65 | logout(state.token).then(() => { 66 | commit('SET_TOKEN', '') 67 | commit('SET_ROLES', []) 68 | removeToken() 69 | resolve() 70 | }).catch(error => { 71 | reject(error) 72 | }) 73 | }) 74 | }, 75 | 76 | // 前端 登出 77 | FedLogOut({ commit }) { 78 | return new Promise(resolve => { 79 | removeToken() 80 | commit('SET_TOKEN', '') 81 | resolve() 82 | }) 83 | } 84 | } 85 | } 86 | 87 | export default user 88 | -------------------------------------------------------------------------------- /src/renderer/styles/element-ui.scss: -------------------------------------------------------------------------------- 1 | //to reset element-ui default css 2 | .el-upload { 3 | input[type="file"] { 4 | display: none !important; 5 | } 6 | } 7 | 8 | .el-upload__input { 9 | display: none; 10 | } 11 | 12 | //暂时性解决diolag 问题 https://github.com/ElemeFE/element/issues/2461 13 | .el-dialog { 14 | transform: none; 15 | left: 0; 16 | position: relative; 17 | margin: 0 auto; 18 | } 19 | 20 | //element ui upload 21 | .upload-container { 22 | .el-upload { 23 | width: 100%; 24 | .el-upload-dragger { 25 | width: 100%; 26 | height: 200px; 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/renderer/styles/index.scss: -------------------------------------------------------------------------------- 1 | @import './variables.scss'; 2 | @import './mixin.scss'; 3 | @import './transition.scss'; 4 | @import './element-ui.scss'; 5 | @import './sidebar.scss'; 6 | 7 | body { 8 | -moz-osx-font-smoothing: grayscale; 9 | -webkit-font-smoothing: antialiased; 10 | text-rendering: optimizeLegibility; 11 | font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; 12 | } 13 | 14 | html { 15 | box-sizing: border-box; 16 | } 17 | 18 | *, 19 | *:before, 20 | *:after { 21 | box-sizing: inherit; 22 | } 23 | 24 | div:focus{ 25 | outline: none; 26 | } 27 | 28 | a:focus, 29 | a:active { 30 | outline: none; 31 | } 32 | 33 | a, 34 | a:focus, 35 | a:hover { 36 | cursor: pointer; 37 | color: inherit; 38 | text-decoration: none; 39 | } 40 | 41 | .clearfix { 42 | &:after { 43 | visibility: hidden; 44 | display: block; 45 | font-size: 0; 46 | content: " "; 47 | clear: both; 48 | height: 0; 49 | } 50 | } 51 | 52 | //main-container全局样式 53 | .app-main{ 54 | min-height: 100% 55 | } 56 | 57 | .app-container { 58 | padding: 20px; 59 | } 60 | -------------------------------------------------------------------------------- /src/renderer/styles/mixin.scss: -------------------------------------------------------------------------------- 1 | @mixin clearfix { 2 | &:after { 3 | content: ""; 4 | display: table; 5 | clear: both; 6 | } 7 | } 8 | 9 | @mixin scrollBar { 10 | &::-webkit-scrollbar-track-piece { 11 | background: #d3dce6; 12 | } 13 | &::-webkit-scrollbar { 14 | width: 6px; 15 | } 16 | &::-webkit-scrollbar-thumb { 17 | background: #99a9bf; 18 | border-radius: 20px; 19 | } 20 | } 21 | 22 | @mixin relative { 23 | position: relative; 24 | width: 100%; 25 | height: 100%; 26 | } 27 | 28 | -------------------------------------------------------------------------------- /src/renderer/styles/sidebar.scss: -------------------------------------------------------------------------------- 1 | #app { 2 | 3 | // 主体区域 4 | .main-container { 5 | min-height: 100%; 6 | transition: margin-left .28s; 7 | margin-left: 180px; 8 | } 9 | 10 | // 侧边栏 11 | .sidebar-container { 12 | .horizontal-collapse-transition { 13 | transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out; 14 | } 15 | transition: width .28s; 16 | width: 180px !important; 17 | height: 100%; 18 | position: fixed; 19 | font-size: 0px; 20 | top: 0; 21 | bottom: 0; 22 | left: 0; 23 | z-index: 1001; 24 | overflow: hidden; 25 | a { 26 | display: inline-block; 27 | width: 100%; 28 | } 29 | .svg-icon { 30 | margin-right: 16px; 31 | } 32 | .el-menu { 33 | border: none; 34 | width: 100% !important; 35 | } 36 | } 37 | 38 | .hideSidebar { 39 | .sidebar-container { 40 | width: 36px !important; 41 | } 42 | .main-container { 43 | margin-left: 36px; 44 | } 45 | .submenu-title-noDropdown { 46 | padding-left: 10px !important; 47 | position: relative; 48 | .el-tooltip { 49 | padding: 0 10px !important; 50 | } 51 | } 52 | .el-submenu { 53 | &>.el-submenu__title { 54 | padding-left: 10px !important; 55 | &>span { 56 | height: 0; 57 | width: 0; 58 | overflow: hidden; 59 | visibility: hidden; 60 | display: inline-block; 61 | } 62 | .el-submenu__icon-arrow { 63 | display: none; 64 | } 65 | } 66 | } 67 | } 68 | 69 | .sidebar-container .nest-menu .el-submenu>.el-submenu__title, 70 | .sidebar-container .el-submenu .el-menu-item { 71 | min-width: 180px !important; 72 | background-color: $subMenuBg !important; 73 | &:hover { 74 | background-color: $menuHover !important; 75 | } 76 | } 77 | .el-menu--collapse .el-menu .el-submenu { 78 | min-width: 180px !important; 79 | } 80 | 81 | //适配移动端 82 | .mobile { 83 | .main-container { 84 | margin-left: 0px; 85 | } 86 | .sidebar-container { 87 | top: 50px; 88 | transition: transform .28s; 89 | width: 180px !important; 90 | } 91 | &.hideSidebar { 92 | .sidebar-container { 93 | transition-duration: 0.3s; 94 | transform: translate3d(-180px, 0, 0); 95 | } 96 | } 97 | } 98 | 99 | .withoutAnimation { 100 | .main-container, 101 | .sidebar-container { 102 | transition: none; 103 | } 104 | } 105 | } 106 | -------------------------------------------------------------------------------- /src/renderer/styles/transition.scss: -------------------------------------------------------------------------------- 1 | //globl transition css 2 | 3 | /*fade*/ 4 | .fade-enter-active, 5 | .fade-leave-active { 6 | transition: opacity 0.28s; 7 | } 8 | 9 | .fade-enter, 10 | .fade-leave-active { 11 | opacity: 0; 12 | } 13 | 14 | /*fade*/ 15 | .breadcrumb-enter-active, 16 | .breadcrumb-leave-active { 17 | transition: all .5s; 18 | } 19 | 20 | .breadcrumb-enter, 21 | .breadcrumb-leave-active { 22 | opacity: 0; 23 | transform: translateX(20px); 24 | } 25 | 26 | .breadcrumb-move { 27 | transition: all .5s; 28 | } 29 | 30 | .breadcrumb-leave-active { 31 | position: absolute; 32 | } 33 | -------------------------------------------------------------------------------- /src/renderer/styles/variables.scss: -------------------------------------------------------------------------------- 1 | //sidebar 2 | $menuBg:#304156; 3 | $subMenuBg:#1f2d3d; 4 | $menuHover:#001528; 5 | -------------------------------------------------------------------------------- /src/renderer/utils/auth.js: -------------------------------------------------------------------------------- 1 | import Cookies from 'js-cookie' 2 | 3 | const TokenKey = 'Admin-Token' 4 | 5 | export function getToken() { 6 | return Cookies.get(TokenKey) 7 | } 8 | 9 | export function setToken(token) { 10 | return Cookies.set(TokenKey, token) 11 | } 12 | 13 | export function removeToken() { 14 | return Cookies.remove(TokenKey) 15 | } 16 | -------------------------------------------------------------------------------- /src/renderer/utils/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by jiachenpan on 16/11/18. 3 | */ 4 | 5 | export function parseTime(time, cFormat) { 6 | if (arguments.length === 0) { 7 | return null 8 | } 9 | const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}' 10 | let date 11 | if (typeof time === 'object') { 12 | date = time 13 | } else { 14 | if (('' + time).length === 10) time = parseInt(time) * 1000 15 | date = new Date(time) 16 | } 17 | const formatObj = { 18 | y: date.getFullYear(), 19 | m: date.getMonth() + 1, 20 | d: date.getDate(), 21 | h: date.getHours(), 22 | i: date.getMinutes(), 23 | s: date.getSeconds(), 24 | a: date.getDay() 25 | } 26 | const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => { 27 | let value = formatObj[key] 28 | if (key === 'a') return ['一', '二', '三', '四', '五', '六', '日'][value - 1] 29 | if (result.length > 0 && value < 10) { 30 | value = '0' + value 31 | } 32 | return value || 0 33 | }) 34 | return time_str 35 | } 36 | 37 | export function formatTime(time, option) { 38 | time = +time * 1000 39 | const d = new Date(time) 40 | const now = Date.now() 41 | 42 | const diff = (now - d) / 1000 43 | 44 | if (diff < 30) { 45 | return '刚刚' 46 | } else if (diff < 3600) { // less 1 hour 47 | return Math.ceil(diff / 60) + '分钟前' 48 | } else if (diff < 3600 * 24) { 49 | return Math.ceil(diff / 3600) + '小时前' 50 | } else if (diff < 3600 * 24 * 2) { 51 | return '1天前' 52 | } 53 | if (option) { 54 | return parseTime(time, option) 55 | } else { 56 | return d.getMonth() + 1 + '月' + d.getDate() + '日' + d.getHours() + '时' + d.getMinutes() + '分' 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /src/renderer/utils/request.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { Message, MessageBox } from 'element-ui' 3 | import store from '../store' 4 | 5 | // 创建axios实例 6 | const service = axios.create({ 7 | baseURL: process.env.BASE_API, // api的base_url 8 | timeout: 15000 // 请求超时时间 9 | }) 10 | 11 | // request拦截器 12 | service.interceptors.request.use(config => { 13 | if (store.getters.token) { 14 | config.headers['X-Token'] = store.getters.token// 让每个请求携带自定义token 请根据实际情况自行修改 15 | } 16 | return config 17 | }, error => { 18 | // Do something with request error 19 | console.log(error) // for debug 20 | Promise.reject(error) 21 | }) 22 | 23 | // respone拦截器 24 | service.interceptors.response.use( 25 | response => { 26 | /** 27 | * code为非20000是抛错 可结合自己业务进行修改 28 | */ 29 | const res = response.data 30 | if (res.code !== 20000) { 31 | Message({ 32 | message: res.message, 33 | type: 'error', 34 | duration: 5 * 1000 35 | }) 36 | 37 | // 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了; 38 | if (res.code === 50008 || res.code === 50012 || res.code === 50014) { 39 | MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', { 40 | confirmButtonText: '重新登录', 41 | cancelButtonText: '取消', 42 | type: 'warning' 43 | }).then(() => { 44 | store.dispatch('FedLogOut').then(() => { 45 | location.reload()// 为了重新实例化vue-router对象 避免bug 46 | }) 47 | }) 48 | } 49 | return Promise.reject('error') 50 | } else { 51 | return response.data 52 | } 53 | }, 54 | error => { 55 | console.log('err' + error)// for debug 56 | Message({ 57 | message: error.message, 58 | type: 'error', 59 | duration: 5 * 1000 60 | }) 61 | return Promise.reject(error) 62 | } 63 | ) 64 | 65 | export default service 66 | -------------------------------------------------------------------------------- /src/renderer/utils/validate.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by jiachenpan on 16/11/18. 3 | */ 4 | 5 | export function isvalidUsername(str) { 6 | const valid_map = ['admin', 'editor'] 7 | return valid_map.indexOf(str.trim()) >= 0 8 | } 9 | 10 | /* 合法uri*/ 11 | export function validateURL(textval) { 12 | const urlregex = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/ 13 | return urlregex.test(textval) 14 | } 15 | 16 | /* 小写字母*/ 17 | export function validateLowerCase(str) { 18 | const reg = /^[a-z]+$/ 19 | return reg.test(str) 20 | } 21 | 22 | /* 大写字母*/ 23 | export function validateUpperCase(str) { 24 | const reg = /^[A-Z]+$/ 25 | return reg.test(str) 26 | } 27 | 28 | /* 大小写字母*/ 29 | export function validatAlphabets(str) { 30 | const reg = /^[A-Za-z]+$/ 31 | return reg.test(str) 32 | } 33 | 34 | -------------------------------------------------------------------------------- /src/renderer/views/404.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 39 | 40 | 230 | -------------------------------------------------------------------------------- /src/renderer/views/dashboard/index.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 21 | 22 | 33 | -------------------------------------------------------------------------------- /src/renderer/views/form/index.vue: -------------------------------------------------------------------------------- 1 | 49 | 50 | 79 | 80 | 85 | 86 | -------------------------------------------------------------------------------- /src/renderer/views/layout/Layout.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | 40 | 41 | 50 | -------------------------------------------------------------------------------- /src/renderer/views/layout/components/AppMain.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 20 | -------------------------------------------------------------------------------- /src/renderer/views/layout/components/Navbar.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 52 | 53 | 94 | 95 | -------------------------------------------------------------------------------- /src/renderer/views/layout/components/Sidebar/SidebarItem.vue: -------------------------------------------------------------------------------- 1 | 34 | 35 | 60 | -------------------------------------------------------------------------------- /src/renderer/views/layout/components/Sidebar/index.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 37 | -------------------------------------------------------------------------------- /src/renderer/views/layout/components/index.js: -------------------------------------------------------------------------------- 1 | export { default as Navbar } from './Navbar' 2 | export { default as Sidebar } from './Sidebar' 3 | export { default as AppMain } from './AppMain' 4 | -------------------------------------------------------------------------------- /src/renderer/views/layout/mixin/ResizeHandler.js: -------------------------------------------------------------------------------- 1 | import store from '@/store' 2 | 3 | const { body } = document 4 | const WIDTH = 1024 5 | const RATIO = 3 6 | 7 | export default { 8 | watch: { 9 | $route(route) { 10 | if (this.device === 'mobile' && this.sidebar.opened) { 11 | store.dispatch('CloseSideBar', { withoutAnimation: false }) 12 | } 13 | } 14 | }, 15 | beforeMount() { 16 | window.addEventListener('resize', this.resizeHandler) 17 | }, 18 | mounted() { 19 | const isMobile = this.isMobile() 20 | if (isMobile) { 21 | store.dispatch('ToggleDevice', 'mobile') 22 | store.dispatch('CloseSideBar', { withoutAnimation: true }) 23 | } 24 | }, 25 | methods: { 26 | isMobile() { 27 | const rect = body.getBoundingClientRect() 28 | return rect.width - RATIO < WIDTH 29 | }, 30 | resizeHandler() { 31 | if (!document.hidden) { 32 | const isMobile = this.isMobile() 33 | store.dispatch('ToggleDevice', isMobile ? 'mobile' : 'desktop') 34 | 35 | if (isMobile) { 36 | store.dispatch('CloseSideBar', { withoutAnimation: true }) 37 | } 38 | } 39 | } 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /src/renderer/views/login/index.vue: -------------------------------------------------------------------------------- 1 | 31 | 32 | 92 | 93 | 126 | 127 | 183 | -------------------------------------------------------------------------------- /src/renderer/views/table/index.vue: -------------------------------------------------------------------------------- 1 | 38 | 39 | 73 | -------------------------------------------------------------------------------- /src/renderer/views/tree/index.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 71 | 72 | -------------------------------------------------------------------------------- /static/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/PanJiaChen/electron-vue-admin/ec3afcc232e7db300a66932d17ded96495c76c77/static/.gitkeep --------------------------------------------------------------------------------