From 95fe6f14323834e3cb62d17258a06895dfcb5f45 Mon Sep 17 00:00:00 2001 From: master-coder-ll Date: Sat, 15 Apr 2023 11:24:46 +0800 Subject: [PATCH] 1 --- LICENSE | 21 +++ babel.config.js | 13 +- docAssets/vue-element-admin-simplify.svg | 25 ++++ mock/article.js | 16 +- mock/index.js | 30 ++-- mock/mock-server.js | 25 +++- mock/remote-search.js | 8 +- mock/role/index.js | 18 +-- mock/role/routes.js | 15 +- mock/user.js | 8 +- mock/utils.js | 48 ++++++ package.json | 139 +++++++++--------- plop-templates/utils.js | 11 +- src/components/HeaderSearch/index.vue | 2 +- .../Tinymce/components/EditorImage.vue | 2 +- src/layout/components/TagsView/ScrollPane.vue | 2 +- src/views/adminUser/components/UserDetail.vue | 6 +- .../dashboard/admin/components/BoxCard.vue | 2 +- .../example/components/ArticleDetail.vue | 2 +- src/views/permission/directive.vue | 6 +- src/views/server/components/ServerDetail.vue | 13 +- src/views/server/list.vue | 12 +- .../components/ServerConfigDetail.vue | 20 ++- tests/unit/utils/param2Obj.spec.js | 14 ++ tests/unit/utils/parseTime.spec.js | 10 ++ vue.config.js | 49 +++--- 26 files changed, 315 insertions(+), 202 deletions(-) create mode 100644 LICENSE create mode 100644 docAssets/vue-element-admin-simplify.svg create mode 100644 mock/utils.js create mode 100644 tests/unit/utils/param2Obj.spec.js diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..6151575 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2017-present PanJiaChen + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/babel.config.js b/babel.config.js index ba17966..fb82b27 100644 --- a/babel.config.js +++ b/babel.config.js @@ -1,5 +1,14 @@ module.exports = { presets: [ - '@vue/app' - ] + // https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app + '@vue/cli-plugin-babel/preset' + ], + 'env': { + 'development': { + // babel-plugin-dynamic-import-node plugin only does one thing by converting all import() to require(). + // This plugin can significantly increase the speed of hot updates, when you have a large number of pages. + // https://panjiachen.github.io/vue-element-admin-site/guide/advanced/lazy-loading.html + 'plugins': ['dynamic-import-node'] + } + } } diff --git a/docAssets/vue-element-admin-simplify.svg b/docAssets/vue-element-admin-simplify.svg new file mode 100644 index 0000000..b34ecb3 --- /dev/null +++ b/docAssets/vue-element-admin-simplify.svg @@ -0,0 +1,25 @@ + + + Layer 1 + + + + + + + + + + + + + + + Vue Element Admin Simlify + + + + + + + \ No newline at end of file diff --git a/mock/article.js b/mock/article.js index bc236eb..23d8ba5 100644 --- a/mock/article.js +++ b/mock/article.js @@ -1,4 +1,4 @@ -import Mock from 'mockjs' +const Mock = require('mockjs') const List = [] const count = 100 @@ -18,7 +18,7 @@ for (let i = 0; i < count; i++) { forecast: '@float(0, 100, 2, 2)', importance: '@integer(1, 3)', 'type|1': ['CN', 'US', 'JP', 'EU'], - 'status|1': ['published', 'draft', 'deleted'], + 'status|1': ['published', 'draft'], display_time: '@datetime', comment_disabled: true, pageviews: '@integer(300, 5000)', @@ -27,9 +27,9 @@ for (let i = 0; i < count; i++) { })) } -export default [ +module.exports = [ { - url: '/article/list', + url: '/vue-element-admin/article/list', type: 'get', response: config => { const { importance, type, title, page = 1, limit = 20, sort } = config.query @@ -58,7 +58,7 @@ export default [ }, { - url: '/article/detail', + url: '/vue-element-admin/article/detail', type: 'get', response: config => { const { id } = config.query @@ -74,7 +74,7 @@ export default [ }, { - url: '/article/pv', + url: '/vue-element-admin/article/pv', type: 'get', response: _ => { return { @@ -92,7 +92,7 @@ export default [ }, { - url: '/article/create', + url: '/vue-element-admin/article/create', type: 'post', response: _ => { return { @@ -103,7 +103,7 @@ export default [ }, { - url: '/article/update', + url: '/vue-element-admin/article/update', type: 'post', response: _ => { return { diff --git a/mock/index.js b/mock/index.js index 6907e86..2eed65d 100644 --- a/mock/index.js +++ b/mock/index.js @@ -1,10 +1,10 @@ -import Mock from 'mockjs' -import { param2Obj } from '../src/utils' +const Mock = require('mockjs') +const { param2Obj } = require('./utils') -import user from './user' -import role from './role' -import article from './article' -import search from './remote-search' +const user = require('./user') +const role = require('./role') +const article = require('./article') +const search = require('./remote-search') const mocks = [ ...user, @@ -16,7 +16,7 @@ const mocks = [ // for front mock // please use it cautiously, it will redefine XMLHttpRequest, // which will cause many of your third-party libraries to be invalidated(like progress event). -export function mockXHR() { +function mockXHR() { // mock patch // https://github.com/nuysoft/Mock/issues/300 Mock.XHR.prototype.proxy_send = Mock.XHR.prototype.send @@ -54,17 +54,7 @@ export function mockXHR() { } } -// for mock server -const responseFake = (url, type, respond) => { - return { - url: new RegExp(`/mock${url}`), - type: type || 'get', - response(req, res) { - res.json(Mock.mock(respond instanceof Function ? respond(req, res) : respond)) - } - } +module.exports = { + mocks, + mockXHR } - -export default mocks.map(route => { - return responseFake(route.url, route.type, route.response) -}) diff --git a/mock/mock-server.js b/mock/mock-server.js index 4c4cb2a..8941ec0 100644 --- a/mock/mock-server.js +++ b/mock/mock-server.js @@ -2,17 +2,21 @@ const chokidar = require('chokidar') const bodyParser = require('body-parser') const chalk = require('chalk') const path = require('path') +const Mock = require('mockjs') const mockDir = path.join(process.cwd(), 'mock') function registerRoutes(app) { let mockLastIndex - const { default: mocks } = require('./index.js') - for (const mock of mocks) { + const { mocks } = require('./index.js') + const mocksForServer = mocks.map(route => { + return responseFake(route.url, route.type, route.response) + }) + for (const mock of mocksForServer) { app[mock.type](mock.url, mock.response) mockLastIndex = app._router.stack.length } - const mockRoutesLength = Object.keys(mocks).length + const mockRoutesLength = Object.keys(mocksForServer).length return { mockRoutesLength: mockRoutesLength, mockStartIndex: mockLastIndex - mockRoutesLength @@ -27,10 +31,19 @@ function unregisterRoutes() { }) } -module.exports = app => { - // es6 polyfill - require('@babel/register') +// for mock server +const responseFake = (url, type, respond) => { + return { + url: new RegExp(`${process.env.VUE_APP_BASE_API}${url}`), + type: type || 'get', + response(req, res) { + console.log('request invoke:' + req.path) + res.json(Mock.mock(respond instanceof Function ? respond(req, res) : respond)) + } + } +} +module.exports = app => { // parse app.body // https://expressjs.com/en/4x/api.html#req.body app.use(bodyParser.json()) diff --git a/mock/remote-search.js b/mock/remote-search.js index bb33c2f..8fc4926 100644 --- a/mock/remote-search.js +++ b/mock/remote-search.js @@ -1,4 +1,4 @@ -import Mock from 'mockjs' +const Mock = require('mockjs') const NameList = [] const count = 100 @@ -10,10 +10,10 @@ for (let i = 0; i < count; i++) { } NameList.push({ name: 'mock-Pan' }) -export default [ +module.exports = [ // username search { - url: '/search/user', + url: '/vue-element-admin/search/user', type: 'get', response: config => { const { name } = config.query @@ -30,7 +30,7 @@ export default [ // transaction list { - url: '/transaction/list', + url: '/vue-element-admin/transaction/list', type: 'get', response: _ => { return { diff --git a/mock/role/index.js b/mock/role/index.js index 3914807..4643f00 100644 --- a/mock/role/index.js +++ b/mock/role/index.js @@ -1,6 +1,6 @@ -import Mock from 'mockjs' -import { deepClone } from '../../src/utils/index.js' -import { asyncRoutes, constantRoutes } from './routes.js' +const Mock = require('mockjs') +const { deepClone } = require('../utils') +const { asyncRoutes, constantRoutes } = require('./routes.js') const routes = deepClone([...constantRoutes, ...asyncRoutes]) @@ -35,10 +35,10 @@ const roles = [ } ] -export default [ +module.exports = [ // mock get all routes form server { - url: '/routes', + url: '/vue-element-admin/routes', type: 'get', response: _ => { return { @@ -50,7 +50,7 @@ export default [ // mock get all roles form server { - url: '/roles', + url: '/vue-element-admin/roles', type: 'get', response: _ => { return { @@ -62,7 +62,7 @@ export default [ // add role { - url: '/role', + url: '/vue-element-admin/role', type: 'post', response: { code: 20000, @@ -74,7 +74,7 @@ export default [ // update role { - url: '/role/[A-Za-z0-9]', + url: '/vue-element-admin/role/[A-Za-z0-9]', type: 'put', response: { code: 20000, @@ -86,7 +86,7 @@ export default [ // delete role { - url: '/role/[A-Za-z0-9]', + url: '/vue-element-admin/role/[A-Za-z0-9]', type: 'delete', response: { code: 20000, diff --git a/mock/role/routes.js b/mock/role/routes.js index d718919..e807a56 100644 --- a/mock/role/routes.js +++ b/mock/role/routes.js @@ -1,6 +1,6 @@ // Just a mock data -export const constantRoutes = [ +const constantRoutes = [ { path: '/redirect', component: 'layout/Layout', @@ -72,7 +72,7 @@ export const constantRoutes = [ } ] -export const asyncRoutes = [ +const asyncRoutes = [ { path: '/permission', component: 'layout/Layout', @@ -136,12 +136,6 @@ export const asyncRoutes = [ icon: 'component' }, children: [ - { - path: 'tinymce', - component: 'views/components-demo/tinymce', - name: 'TinymceDemo', - meta: { title: 'Tinymce' } - }, { path: 'markdown', component: 'views/components-demo/markdown', @@ -523,3 +517,8 @@ export const asyncRoutes = [ { path: '*', redirect: '/404', hidden: true } ] + +module.exports = { + constantRoutes, + asyncRoutes +} diff --git a/mock/user.js b/mock/user.js index 43f93a0..d82e079 100644 --- a/mock/user.js +++ b/mock/user.js @@ -23,10 +23,10 @@ const users = { } } -export default [ +module.exports = [ // user login { - url: '/user/login', + url: '/vue-element-admin/user/login', type: 'post', response: config => { const { username } = config.body @@ -49,7 +49,7 @@ export default [ // get user info { - url: '/user/info\.*', + url: '/vue-element-admin/user/info\.*', type: 'get', response: config => { const { token } = config.query @@ -72,7 +72,7 @@ export default [ // user logout { - url: '/user/logout', + url: '/vue-element-admin/user/logout', type: 'post', response: _ => { return { diff --git a/mock/utils.js b/mock/utils.js new file mode 100644 index 0000000..f909a29 --- /dev/null +++ b/mock/utils.js @@ -0,0 +1,48 @@ +/** + * @param {string} url + * @returns {Object} + */ +function param2Obj(url) { + const search = decodeURIComponent(url.split('?')[1]).replace(/\+/g, ' ') + if (!search) { + return {} + } + const obj = {} + const searchArr = search.split('&') + searchArr.forEach(v => { + const index = v.indexOf('=') + if (index !== -1) { + const name = v.substring(0, index) + const val = v.substring(index + 1, v.length) + obj[name] = val + } + }) + return obj +} + +/** + * This is just a simple version of deep copy + * Has a lot of edge cases bug + * If you want to use a perfect deep copy, use lodash's _.cloneDeep + * @param {Object} source + * @returns {Object} + */ +function deepClone(source) { + if (!source && typeof source !== 'object') { + throw new Error('error arguments', 'deepClone') + } + const targetObj = source.constructor === Array ? [] : {} + Object.keys(source).forEach(keys => { + if (source[keys] && typeof source[keys] === 'object') { + targetObj[keys] = deepClone(source[keys]) + } else { + targetObj[keys] = source[keys] + } + }) + return targetObj +} + +module.exports = { + param2Obj, + deepClone +} diff --git a/package.json b/package.json index cbcbc35..b1be698 100644 --- a/package.json +++ b/package.json @@ -1,68 +1,40 @@ { "name": "vue-element-admin", - "version": "4.2.1", + "version": "4.4.0", "description": "A magical vue admin. An out-of-box UI solution for enterprise applications. Newest development stack of vue. Lots of awesome features", "author": "Pan ", - "license": "MIT", "scripts": { - "dev": "vue-cli-service serve", - "build:prod": "vue-cli-service build", - "build:stage": "vue-cli-service build --mode staging", - "preview": "node build/index.js --preview", + "dev": " vue-cli-service serve", "lint": "eslint --ext .js,.vue src", - "test:unit": "jest --clearCache && vue-cli-service test:unit", - "test:ci": "npm run lint && npm run test:unit", + "build:prod": " vue-cli-service build", + "build:stage": " vue-cli-service build --mode staging", + "preview": "node build/index.js --preview", + "new": "plop", "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml", - "new": "plop" - }, - "husky": { - "hooks": { - "pre-commit": "lint-staged" - } - }, - "lint-staged": { - "src/**/*.{js,vue}": [ - "eslint --fix", - "git add" - ] - }, - "keywords": [ - "vue", - "admin", - "dashboard", - "element-ui", - "boilerplate", - "admin-template", - "management-system" - ], - "repository": { - "type": "git", - "url": "git+https://github.com/PanJiaChen/vue-element-admin.git" - }, - "bugs": { - "url": "https://github.com/PanJiaChen/vue-element-admin/issues" + "test:unit": "jest --clearCache && vue-cli-service test:unit", + "test:ci": "npm run lint && npm run test:unit" }, "dependencies": { "js-md5": "0.7.3", "vue-qr": "2.2.1", - "js-base64": "2.5.1", - "axios": ">=0.21.1", + "axios": "^1.3.4", "clipboard": "2.0.4", - "codemirror": "5.45.0", + "codemirror": "^5.65.12", + "core-js": "3.6.5", "driver.js": "0.9.5", "dropzone": "5.5.1", - "echarts": "4.2.1", - "element-ui": "2.13.0", + "echarts": "^5.4.2", + "element-ui": "2.13.2", "file-saver": "2.0.1", "fuse.js": "3.4.4", "js-cookie": "2.2.0", "jsonlint": "1.6.3", - "jszip": "3.2.1", + "jszip": "^3.10.1", "normalize.css": "7.0.0", "nprogress": "0.2.0", "path-to-regexp": "2.4.0", "screenfull": "4.2.0", - "showdown": "1.9.1", + "script-loader": "0.7.2", "sortablejs": "1.8.4", "tui-editor": "1.3.3", "vue": "2.6.10", @@ -71,46 +43,71 @@ "vue-splitpane": "1.0.4", "vuedraggable": "2.20.0", "vuex": "3.1.0", - "xlsx": "0.14.1" + "xlsx": "^0.18.5" }, "devDependencies": { - "@babel/core": "7.0.0", - "@babel/register": "7.0.0", - "@vue/cli-plugin-babel": "3.5.3", - "@vue/cli-plugin-eslint": "^3.9.1", - "@vue/cli-plugin-unit-jest": "3.5.3", - "@vue/cli-service": "3.5.3", + "@vue/cli-plugin-babel": "^5.0.8", + "@vue/cli-plugin-eslint": "^5.0.8", + "@vue/cli-plugin-unit-jest": "^5.0.8", + "@vue/cli-service": "^5.0.8", "@vue/test-utils": "1.0.0-beta.29", - "autoprefixer": "^9.5.1", - "babel-core": "7.0.0-bridge.0", - "babel-eslint": "10.0.1", - "babel-jest": "23.6.0", + "autoprefixer": "9.5.1", + "babel-eslint": "10.1.0", + "babel-jest": "^29.5.0", + "babel-plugin-dynamic-import-node": "2.3.3", "chalk": "2.4.2", - "chokidar": "2.1.5", + "chokidar": "^3.5.3", "connect": "3.6.6", - "eslint": "5.15.3", - "eslint-plugin-vue": "5.2.2", - "html-webpack-plugin": "3.2.0", + "eslint": "6.7.2", + "eslint-plugin-vue": "6.2.2", + "html-webpack-plugin": "^5.5.0", "husky": "1.3.1", - "lint-staged": "8.1.5", + "lint-staged": "^13.2.0", "mockjs": "1.0.1-beta3", - "node-sass": "^4.9.0", - "plop": "2.3.0", - "runjs": "^4.3.2", - "sass-loader": "^7.1.0", + "plop": "^2.7.6", + "runjs": "^4.1.3", + "sass": "1.26.2", + "sass-loader": "8.0.2", "script-ext-html-webpack-plugin": "2.1.3", - "script-loader": "0.7.2", - "serve-static": "^1.13.2", - "svg-sprite-loader": "4.1.3", - "svgo": "1.2.0", + "serve-static": "1.13.2", + "svg-sprite-loader": "^6.0.11", + "svgo": "^3.0.2", "vue-template-compiler": "2.6.10" }, + "browserslist": [ + "> 1%", + "last 2 versions" + ], + "bugs": { + "url": "https://github.com/PanJiaChen/vue-element-admin/issues" + }, "engines": { "node": ">=8.9", "npm": ">= 3.0.0" }, - "browserslist": [ - "> 1%", - "last 2 versions" - ] + "keywords": [ + "vue", + "admin", + "dashboard", + "element-ui", + "boilerplate", + "admin-template", + "management-system" + ], + "license": "MIT", + "lint-staged": { + "src/**/*.{js,vue}": [ + "eslint --fix", + "git add" + ] + }, + "husky": { + "hooks": { + "pre-commit": "lint-staged" + } + }, + "repository": { + "type": "git", + "url": "git+https://gitee.com/wubie/vue2-element-admin-simplify" + } } diff --git a/plop-templates/utils.js b/plop-templates/utils.js index 0310ca0..0498753 100644 --- a/plop-templates/utils.js +++ b/plop-templates/utils.js @@ -1,9 +1,2 @@ -exports.notEmpty = name => { - return v => { - if (!v || v.trim === '') { - return `${name} is required` - } else { - return true - } - } -} +exports.notEmpty = name => v => + !v || v.trim() === '' ? `${name} is required` : true diff --git a/src/components/HeaderSearch/index.vue b/src/components/HeaderSearch/index.vue index af04716..6026ebb 100644 --- a/src/components/HeaderSearch/index.vue +++ b/src/components/HeaderSearch/index.vue @@ -159,7 +159,7 @@ export default { display: inline-block; vertical-align: middle; - /deep/ .el-input__inner { + ::v-deep .el-input__inner { border-radius: 0; border: 0; padding-left: 0; diff --git a/src/components/Tinymce/components/EditorImage.vue b/src/components/Tinymce/components/EditorImage.vue index d4a98e8..07d48e6 100644 --- a/src/components/Tinymce/components/EditorImage.vue +++ b/src/components/Tinymce/components/EditorImage.vue @@ -104,7 +104,7 @@ export default {