diff --git a/.env.development b/.env.development index 8f5856db1ce09e8f781d9138d249385058b47bac..de583d0940d6ec7a20f3b3a29172729e87173fcf 100644 --- a/.env.development +++ b/.env.development @@ -3,12 +3,3 @@ ENV = 'development' # base api VUE_APP_BASE_API = '/dev-api' - -# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable, -# to control whether the babel-plugin-dynamic-import-node plugin is enabled. -# It only does one thing by converting all import() to require(). -# This configuration can significantly increase the speed of hot updates, -# when you have a large number of pages. -# Detail: https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js - -VUE_CLI_BABEL_TRANSPILE_MODULES = true diff --git a/README.es.md b/README.es.md index 396556f5e679f34b1cc0effbd36fa1e561b43a2c..dc20fa421248559b18b2f2ce0f95209982e8e843 100644 --- a/README.es.md +++ b/README.es.md @@ -51,51 +51,62 @@ Vue Element Admin es una solución práctica basada en la nueva plataforma de de - Plantilla de Typescript: [vue-typescript-admin-template](https://github.com/Armour/vue-typescript-admin-template) (Créditos: [@Armour](https://github.com/Armour)) - [awesome-project](https://github.com/PanJiaChen/vue-element-admin/issues/2312) -**Después de la versión `v4.1.0+`, la rama por defecto master no tendrá soporte para i18n. Por favor use [i18n](https://github.com/PanJiaChen/vue-element-admin/tree/i18n), los cambios serán incluidos en la rama master** +**Después de la versión `v4.1.0+`, la rama por defecto master no tendrá soporte para i18n. Por favor utilice la rama [i18n](https://github.com/PanJiaChen/vue-element-admin/tree/i18n), los cambios serán incluidos en la rama master** **la versión actual es `v4.0+` construida con `vue-cli`. Si encuentra algún problema, por favor coloque un [issue](https://github.com/PanJiaChen/vue-element-admin/issues/new). Si desea usar la versión anterior, puede cambiar de rama a [tag/3.11.0](https://github.com/PanJiaChen/vue-element-admin/tree/tag/3.11.0), no relacionado con `vue-cli`** -**Este proyecto no está soportado para versiones muy viejas de navegadores (e.g. IE).** +**Este proyecto no está soportado para versiones antigüas de navegadores (ej. IE).** ## Preparación Necesita instalar [node](https://nodejs.org/) y [git](https://git-scm.com/) localmente. El proyecto es basado en [ES2015+](https://es6.ruanyifeng.com/), [vue](https://cn.vuejs.org/index.html), [vuex](https://vuex.vuejs.org/zh-cn/), [vue-router](https://router.vuejs.org/zh-cn/), [vue-cli](https://github.com/vuejs/vue-cli) , [axios](https://github.com/axios/axios) and [element-ui](https://github.com/ElemeFE/element), toda la solicitud de datos simulada se realiza a través de [Mock.js](https://github.com/nuysoft/Mock). Entendiendo y aprendiendo esto pudiera ayudarle con su proyecto. -

+[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/PanJiaChen/vue-element-admin/tree/CodeSandbox) + +

## Patrocinantes -Se un patrocinante y pon tu logo en nuestro README on GitHub con un enlace directo a tu sitio web. [[Se un Patrocinante]](https://www.patreon.com/panjiachen) +Sea un patrocinante y coloque su logo en nuestro LEEME en GitHub con un enlace directo a su sitio web. [[Se un Patrocinante]](https://www.patreon.com/panjiachen) + +### Akveo +

Get Java backend for Vue admin with 20% discount for 39$ use coupon code SWB0RAZPZR1M +

+ +### Flatlogic -

Plantilla de Dashboard de administración hecha con Vue, React y Angular.

+

Admin Dashboard Templates made with Vue, React and Angular.

## Características ``` - Iniciar / Cerrar Sesión -- Permisos de Authentication +- Permisos de Autenticación - Página de Permisos - Directivas de permisos - Página de configuración de permisos - Autenticación por dos pasos - Construcción Multi-entorno - - dev sit stage producción + - Desarrollo (dev) + - sit + - Escenario de pruebas (stage), + - Producción (prod) - Características Globales - I18n - Temas dinámicos - - Dynamic sidebar (soporte a rutas multi-nivel) + - Menu lateral dinámico (soporte a rutas multi-nivel) - Barra de rutas dinámica - - Tags-view (Tab page Support right-click operation) + - Tags-view (Pestañas de página, Soporta operación de clic derecho) - Svg Sprite - Datos de simulación con Mock - Pantalla completa - - Responsive Sidebar + - Menu lateral responsivo - Editor - Editor de Texto Enriquecido @@ -106,7 +117,7 @@ Se un patrocinante y pon tu logo en nuestro README on GitHub con un enlace direc - Exportación a Excel - Carga de Excel - Visualización de Excel - - Exportación como zip + - Exportación como ZIP - Tabla - Tabla Dinámica @@ -135,7 +146,7 @@ Se un patrocinante y pon tu logo en nuestro README on GitHub con un enlace direc - Página de Guías - ECharts (Gráficos) - Portapapeles -- Convertidor de Markdown a html +- Convertidor de Markdown a HTML ``` ## Iniciando @@ -208,7 +219,7 @@ Navegadores modernos e Internet Explorer 10+. | [IE / Edge](https://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](https://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](https://godban.github.io/browsers-support-badges/)
Chrome | [Safari](https://godban.github.io/browsers-support-badges/)
Safari | | --------- | --------- | --------- | --------- | -| IE10, IE11, Edge| últimas 2 versiones| últimas 2 versiones| últimas 2 versiones +| IE10, IE11, Edge | últimas 2 versiones | últimas 2 versiones | últimas 2 versiones | ## Licencia diff --git a/README.ja.md b/README.ja.md index 2f43128c2c724e929d1e86c71f1b1c5b83de2f22..3bc3ce8bf0ffdeffeb6c4b7f968c5ceb7dcf276f 100644 --- a/README.ja.md +++ b/README.ja.md @@ -30,7 +30,7 @@ ## 概要 -[vue-element-admin](https://panjiachen.github.io/vue-element-admin) は管理画面のフロントエンドのインタフェース,[vue](https://github.com/vuejs/vue) と [element-ui](https://github.com/ElemeFE/element)を使っています。i18nの多言語対応、可変ルート、権限、典型的なビジネスアプリテンプレートであり、豊富なコンポーネントを提供しています、素早くビジネス用の管理画面の現型を構築に役立ちます。 +[vue-element-admin](https://panjiachen.github.io/vue-element-admin) は管理画面のフロントエンドのインタフェースで、[vue](https://github.com/vuejs/vue) と [element-ui](https://github.com/ElemeFE/element)を使っています。i18nの多言語対応、可変ルート、権限、典型的なビジネスアプリテンプレートであり、豊富なコンポーネントを提供しています。素早くビジネス用の管理画面の現型を構築に役立ちます。 - [デモページ](https://panjiachen.github.io/vue-element-admin) @@ -44,22 +44,24 @@ - おすすめシンプルテンプレート: [vue-admin-template](https://github.com/PanJiaChen/vue-admin-template) - デスクトップバージョン: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin) -- Typescriptバージョン: [vue-typescript-admin-template](https://github.com/Armour/vue-typescript-admin-template) (鸣谢: [@Armour](https://github.com/Armour)) +- Typescriptバージョン: [vue-typescript-admin-template](https://github.com/Armour/vue-typescript-admin-template) (感謝: [@Armour](https://github.com/Armour)) - [awesome-project](https://github.com/PanJiaChen/vue-element-admin/issues/2312) -**After the `v4.1.0+` version, the default master branch will not support i18n. Please use [i18n Branch](https://github.com/PanJiaChen/vue-element-admin/tree/i18n), it will keep up with the master update** +**バージョン`v4.1.0+`以降について、デフォルトのmasterブランチではi18nをサポートしていません。masterブランチと共にアップデートされる[i18n Branch](https://github.com/PanJiaChen/vue-element-admin/tree/i18n)を使用してください。 ** -**現在のバージョン `v4.0+` は `vue-cli` で構築,バグ報告は[issue](https://github.com/PanJiaChen/vue-element-admin/issues/new)のissueでお願いします。旧バージョン[tag/3.11.0](https://github.com/PanJiaChen/vue-element-admin/tree/tag/3.11.0)もあります。`vue-cli`に依存しないです。** +**現在のバージョン `v4.0+` は `vue-cli` で構築していて、バグ報告は[issue](https://github.com/PanJiaChen/vue-element-admin/issues/new)のissueでお願いします。旧バージョン[tag/3.11.0](https://github.com/PanJiaChen/vue-element-admin/tree/tag/3.11.0)もあります。こちらは`vue-cli`に依存しないです。** **低いバージョンのブラウザはサーポートしないです(例えば ie),必要があれば polyfill を追加してください。 [詳細はこちら](https://github.com/PanJiaChen/vue-element-admin/wiki#babel-polyfill)** ## 前準備 -ローカル環境に [node](http://nodejs.org/) と [git](https://git-scm.com/)をインストールが必要です。[ES2015+](http://es6.ruanyifeng.com/)、[vue](https://cn.vuejs.org/index.html)、[vuex](https://vuex.vuejs.org/zh-cn/)、[vue-router](https://router.vuejs.org/zh-cn/) 、[vue-cli](https://github.com/vuejs/vue-cli) 、[axios](https://github.com/axios/axios) 和 [element-ui](https://github.com/ElemeFE/element)で開発しています。Requestは[Mock.js](https://github.com/nuysoft/Mock)のモックデータを使っています。 +ローカル環境に [node](http://nodejs.org/) と [git](https://git-scm.com/)のインストールが必要です。[ES2015+](http://es6.ruanyifeng.com/)、[vue](https://cn.vuejs.org/index.html)、[vuex](https://vuex.vuejs.org/zh-cn/)、[vue-router](https://router.vuejs.org/zh-cn/) 、[vue-cli](https://github.com/vuejs/vue-cli) 、[axios](https://github.com/axios/axios) と [element-ui](https://github.com/ElemeFE/element)で開発しています。Requestは[Mock.js](https://github.com/nuysoft/Mock)のモックデータを使っています。 **バグ修正や新規機能追加のissue と pull requestは大歓迎です。** -

+[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/PanJiaChen/vue-element-admin/tree/CodeSandbox) + +

@@ -67,6 +69,12 @@ Become a sponsor and get your logo on our README on GitHub with a link to your site. [[Become a sponsor]](https://www.patreon.com/panjiachen) +### Akveo +

Get Java backend for Vue admin with 20% discount for 39$ use coupon code SWB0RAZPZR1M +

+ +### Flatlogic +

Admin Dashboard Templates made with Vue, React and Angular.

## 機能一覧 @@ -81,15 +89,18 @@ Become a sponsor and get your logo on our README on GitHub with a link to your s - 外部IDでログイン - 複数環境デプロイ - - dev sit stage prod + - dev + - sit + - stage + - prod - 共通機能 - 多言語切替 - テーマ切替 - サイトメニュー(ルートから生成) - - Breadcrumb Navigation - - Tag Navigation - - Svg Sprite Icon + - パンくずリストナビゲーション + - タブナビゲーション + - Svg Sprite アイコン - ローカル/バックエンド モック データ - Screenfull @@ -104,33 +115,33 @@ Become a sponsor and get your logo on our README on GitHub with a link to your s - リード - Zip -- Table - - Dynamic Table - - Drag And Drop Table - - Inline Edit Table +- テーブル + - ダイナミックテーブル + - ドラッグアンドドロップテーブル + - インラインエディットテーブル -- Error Page +- エラーページ - 401 - 404 - コンポーネント - - Avatar Upload - - Back To Top - - Drag Dialog - - Drag Select - - Drag Kanban - - Drag List - - SplitPane + - アバターアップロード + - トップに戻る + - ドラッグダイアログ + - ドラッグ選択 + - ドラッグKanban + - ドラッグリスト + - ペインの分割 - Dropzone - - Sticky + - スティッキー - CountTo -- Advanced Example -- Error Log -- Dashboard -- Guide Page +- 高度なサンプル +- エラーログ +- ダッシュボード +- ガイドページ - ECharts -- Clipboard +- クリップボード - Markdown to html ``` @@ -150,7 +161,7 @@ npm install npm run dev ``` -This will automatically open http://localhost:9527 +http://localhost:9527 が自動的に開きます。 ## Build @@ -178,11 +189,11 @@ npm run lint npm run lint -- --fix ``` -Refer to [Documentation](https://panjiachen.github.io/vue-element-admin-site/guide/essentials/deploy.html) for more information +詳細は [Documentation](https://panjiachen.github.io/vue-element-admin-site/guide/essentials/deploy.html) を参照してください。 ## Changelog -Detailed changes for each release are documented in the [release notes](https://github.com/PanJiaChen/vue-element-admin/releases). +各リリースの詳細は [release notes](https://github.com/PanJiaChen/vue-element-admin/releases) にあります。 ## Online Demo @@ -204,7 +215,7 @@ Modern browsers and Internet Explorer 10+. | [IE / Edge](https://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](https://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](https://godban.github.io/browsers-support-badges/)
Chrome | [Safari](https://godban.github.io/browsers-support-badges/)
Safari | | --------- | --------- | --------- | --------- | -| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions +| IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions | ## License diff --git a/README.md b/README.md index 9cd95cc14c2244f2a0f93b9ebea60b4c1ee2e800..da4b8b97531620b11ad0343e42a8650934fbba83 100644 --- a/README.md +++ b/README.md @@ -28,11 +28,26 @@ English | [简体中文](./README.zh-CN.md) | [日本語](./README.ja.md) | [Spanish](./README.es.md) +

+ SPONSORED BY +

+ + + + + + +
+ + + +
+ ## Introduction -[vue-element-admin](https://panjiachen.github.io/vue-element-admin) is a production-ready front-end solution for admin interfaces. It based on [vue](https://github.com/vuejs/vue) and use the UI Toolkit [element-ui](https://github.com/ElemeFE/element). +[vue-element-admin](https://panjiachen.github.io/vue-element-admin) is a production-ready front-end solution for admin interfaces. It is based on [vue](https://github.com/vuejs/vue) and uses the UI Toolkit [element-ui](https://github.com/ElemeFE/element). -It is a magical vue admin based on the newest development stack of vue, built-in i18n solution, typical templates for enterprise applications, lots of awesome features. It helps you build a large complex Single-Page Applications. I believe whatever your needs are, this project will help you. +[vue-element-admin](https://panjiachen.github.io/vue-element-admin) is based on the newest development stack of vue and it has a built-in i18n solution, typical templates for enterprise applications, and lots of awesome features. It helps you build large and complex Single-Page Applications. I believe whatever your needs are, this project will help you. - [Preview](https://panjiachen.github.io/vue-element-admin) @@ -62,7 +77,9 @@ It is a magical vue admin based on the newest development stack of vue, built-in You need to install [node](https://nodejs.org/) and [git](https://git-scm.com/) locally. The project is based on [ES2015+](https://es6.ruanyifeng.com/), [vue](https://cn.vuejs.org/index.html), [vuex](https://vuex.vuejs.org/zh-cn/), [vue-router](https://router.vuejs.org/zh-cn/), [vue-cli](https://github.com/vuejs/vue-cli) , [axios](https://github.com/axios/axios) and [element-ui](https://github.com/ElemeFE/element), all request data is simulated using [Mock.js](https://github.com/nuysoft/Mock). Understanding and learning this knowledge in advance will greatly help the use of this project. -

+[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/PanJiaChen/vue-element-admin/tree/CodeSandbox) + +

@@ -70,6 +87,12 @@ Understanding and learning this knowledge in advance will greatly help the use o Become a sponsor and get your logo on our README on GitHub with a link to your site. [[Become a sponsor]](https://www.patreon.com/panjiachen) +### Akveo +

Get Java backend for Vue admin with 20% discount for 39$ use coupon code SWB0RAZPZR1M +

+ +### Flatlogic +

Admin Dashboard Templates made with Vue, React and Angular.

## Features @@ -84,7 +107,10 @@ Become a sponsor and get your logo on our README on GitHub with a link to your s - Two-step login - Multi-environment build - - dev sit stage prod + - Develop (dev) + - sit + - Stage Test (stage) + - Production (prod) - Global Features - I18n @@ -208,7 +234,7 @@ Modern browsers and Internet Explorer 10+. | [IE / Edge](https://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](https://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](https://godban.github.io/browsers-support-badges/)
Chrome | [Safari](https://godban.github.io/browsers-support-badges/)
Safari | | --------- | --------- | --------- | --------- | -| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions +| IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions | ## License diff --git a/README.zh-CN.md b/README.zh-CN.md index bbb94a48109e62f7d2deff88f591c702fffd6c39..d34c65a4a7735df069ecfad9eaa0c1c48b077c9e 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -28,6 +28,21 @@ 简体中文 | [English](./README.md) | [日本語](./README.ja.md) | [Spanish](./README.es.md) +

+ SPONSORED BY +

+ + + + + + +
+ + + +
+ ## 简介 [vue-element-admin](https://panjiachen.github.io/vue-element-admin) 是一个后台前端解决方案,它基于 [vue](https://github.com/vuejs/vue) 和 [element-ui](https://github.com/ElemeFE/element)实现。它使用了最新的前端技术栈,内置了 i18n 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。相信不管你的需求是什么,本项目都能帮助到你。 @@ -77,7 +92,9 @@ **如有问题请先看上述使用文档和文章,若不能满足,欢迎 issue 和 pr** -

+[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/PanJiaChen/vue-element-admin/tree/CodeSandbox) + +

@@ -85,8 +102,14 @@ Become a sponsor and get your logo on our README on GitHub with a link to your site. [[Become a sponsor]](https://www.patreon.com/panjiachen) +### Akveo +

Java 后端整合,可以使用优惠码:SWB0RAZPZR1M,获得20%的价格优化

+ +### Flatlogic +

Admin Dashboard Templates made with Vue, React and Angular.

+ ## 功能 ``` @@ -99,7 +122,10 @@ Become a sponsor and get your logo on our README on GitHub with a link to your s - 二步登录 - 多环境发布 - - dev sit stage prod + - dev + - sit + - stage + - prod - 全局功能 - 国际化多语言 @@ -221,13 +247,17 @@ Detailed changes for each release are documented in the [release notes](https:// [Buy me a coffee](https://www.buymeacoffee.com/Pan) +## 购买贴纸 + +你也可以通过 购买[官方授权的贴纸](https://smallsticker.com/product/vue-element-admin) 的方式来支持 vue-element-admin - 每售出一张贴纸,本项目将获得 2 元的捐赠。 + ## Browsers support Modern browsers and Internet Explorer 10+. | [IE / Edge](https://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](https://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](https://godban.github.io/browsers-support-badges/)
Chrome | [Safari](https://godban.github.io/browsers-support-badges/)
Safari | | --------- | --------- | --------- | --------- | -| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions +| IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions | ## License diff --git a/babel.config.js b/babel.config.js index ba179669a123909a9728283fd9c004c65adb90c5..fb82b2715f46a87182f3e004dcc731f5a5f49fe8 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/mock/article.js b/mock/article.js index bc236eb92727049bd9df31ed6ab77d8b6639abb3..23d8ba510567a90a149be2beff5547148d937ccd 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 6907e861263229f23687b640d00795e4bf71a4ce..2eed65db83bc1c539666af7716f9641b23cb6eef 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 4c4cb2af83dc82c6ccec206fe9c42196f984e034..8941ec0f8035485e9c432ae7789ffd817e96ef42 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 bb33c2f46ae44d263089be4792499a1bc3929a71..8fc4926743d7a160f61fea5e6f90ff0b91bd2c06 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 391480767c9c6aa4100d7f4562645822ee5cd7a8..4643f006d9cb26a1c5a4aee243e0f4d1604ec659 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 d718919c1511241af69650b1f0c4ce1e5cb82320..d33f1624418b84cc3ff5af1aa1fe7e95b3a23d6f 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', @@ -523,3 +523,8 @@ export const asyncRoutes = [ { path: '*', redirect: '/404', hidden: true } ] + +module.exports = { + constantRoutes, + asyncRoutes +} diff --git a/mock/user.js b/mock/user.js index 43f93a04fcff0346648763048c3f545fd70112fd..d82e079d58c4a9292c07e43505599e14fd704ed7 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 0000000000000000000000000000000000000000..f909a29362aea40dfdf7d2a46c665c64cea7b70a --- /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 9942fbacf43786083a44f008c789f7ca725a0540..02f68e2376412a8414f9d93aa6dd480551faa3b9 100644 --- a/package.json +++ b/package.json @@ -1,55 +1,28 @@ { "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", + "lint": "eslint --ext .js,.vue src", "build:prod": "vue-cli-service build", "build:stage": "vue-cli-service build --mode staging", "preview": "node build/index.js --preview", - "lint": "eslint --ext .js,.vue src", - "test:unit": "jest --clearCache && vue-cli-service test:unit", - "test:ci": "npm run lint && npm run test:unit", + "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": { "axios": "0.18.1", "clipboard": "2.0.4", "codemirror": "5.45.0", + "core-js": "3.6.5", "driver.js": "0.9.5", "dropzone": "5.5.1", "echarts": "4.2.1", - "element-ui": "2.7.0", + "element-ui": "2.13.2", "file-saver": "2.0.1", "fuse.js": "3.4.4", "js-cookie": "2.2.0", @@ -59,7 +32,7 @@ "nprogress": "0.2.0", "path-to-regexp": "2.4.0", "screenfull": "4.2.0", - "showdown": "1.9.0", + "script-loader": "0.7.2", "sortablejs": "1.8.4", "tui-editor": "1.3.3", "vue": "2.6.10", @@ -71,43 +44,68 @@ "xlsx": "0.14.1" }, "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": "4.4.4", + "@vue/cli-plugin-eslint": "4.4.4", + "@vue/cli-plugin-unit-jest": "4.4.4", + "@vue/cli-service": "4.4.4", "@vue/test-utils": "1.0.0-beta.29", - "autoprefixer": "^9.5.1", - "babel-core": "7.0.0-bridge.0", - "babel-eslint": "10.0.1", + "autoprefixer": "9.5.1", + "babel-eslint": "10.1.0", "babel-jest": "23.6.0", + "babel-plugin-dynamic-import-node": "2.3.3", "chalk": "2.4.2", "chokidar": "2.1.5", "connect": "3.6.6", - "eslint": "5.15.3", - "eslint-plugin-vue": "5.2.2", + "eslint": "6.7.2", + "eslint-plugin-vue": "6.2.2", "html-webpack-plugin": "3.2.0", "husky": "1.3.1", "lint-staged": "8.1.5", "mockjs": "1.0.1-beta3", - "node-sass": "^4.9.0", "plop": "2.3.0", - "runjs": "^4.3.2", - "sass-loader": "^7.1.0", + "runjs": "4.3.2", + "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", + "serve-static": "1.13.2", "svg-sprite-loader": "4.1.3", "svgo": "1.2.0", "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://github.com/PanJiaChen/vue-element-admin.git" + } } diff --git a/plop-templates/store/index.hbs b/plop-templates/store/index.hbs new file mode 100644 index 0000000000000000000000000000000000000000..4f8e2dc0b44ccdb18abfba87156b5611f2e3dd90 --- /dev/null +++ b/plop-templates/store/index.hbs @@ -0,0 +1,16 @@ +{{#if state}} +const state = {} +{{/if}} + +{{#if mutations}} +const mutations = {} +{{/if}} + +{{#if actions}} +const actions = {} +{{/if}} + +export default { + namespaced: true, + {{options}} +} diff --git a/plop-templates/store/prompt.js b/plop-templates/store/prompt.js new file mode 100644 index 0000000000000000000000000000000000000000..bcbc11d1f5b983062499c5d2f9c4071d8bc15d0d --- /dev/null +++ b/plop-templates/store/prompt.js @@ -0,0 +1,62 @@ +const { notEmpty } = require('../utils.js') + +module.exports = { + description: 'generate store', + prompts: [{ + type: 'input', + name: 'name', + message: 'store name please', + validate: notEmpty('name') + }, + { + type: 'checkbox', + name: 'blocks', + message: 'Blocks:', + choices: [{ + name: 'state', + value: 'state', + checked: true + }, + { + name: 'mutations', + value: 'mutations', + checked: true + }, + { + name: 'actions', + value: 'actions', + checked: true + } + ], + validate(value) { + if (!value.includes('state') || !value.includes('mutations')) { + return 'store require at least state and mutations' + } + return true + } + } + ], + actions(data) { + const name = '{{name}}' + const { blocks } = data + const options = ['state', 'mutations'] + const joinFlag = `, + ` + if (blocks.length === 3) { + options.push('actions') + } + + const actions = [{ + type: 'add', + path: `src/store/modules/${name}.js`, + templateFile: 'plop-templates/store/index.hbs', + data: { + options: options.join(joinFlag), + state: blocks.includes('state'), + mutations: blocks.includes('mutations'), + actions: blocks.includes('actions') + } + }] + return actions + } +} diff --git a/plop-templates/utils.js b/plop-templates/utils.js index 0310ca02b30ce7c02cbc9b238c4fd00c2a36815a..049875397992e2a75bfc71bb537b24844d7726fc 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/plopfile.js b/plopfile.js index 9f3147e250156109a9d57e999c0bc36857aee218..57387bf17ab64d915db5ff2ca9f0369d8e55b9bc 100644 --- a/plopfile.js +++ b/plopfile.js @@ -1,7 +1,9 @@ const viewGenerator = require('./plop-templates/view/prompt') const componentGenerator = require('./plop-templates/component/prompt') +const storeGenerator = require('./plop-templates/store/prompt.js') module.exports = function(plop) { plop.setGenerator('view', viewGenerator) plop.setGenerator('component', componentGenerator) + plop.setGenerator('store', storeGenerator) } diff --git a/src/api/article.js b/src/api/article.js index f54b8af6551110a0ca8c792dd5bd568d1cc754f0..407bda163feb2f1c01ba64faf2c45cf53b4eaf9d 100644 --- a/src/api/article.js +++ b/src/api/article.js @@ -2,7 +2,7 @@ import request from '@/utils/request' export function fetchList(query) { return request({ - url: '/article/list', + url: '/vue-element-admin/article/list', method: 'get', params: query }) @@ -10,7 +10,7 @@ export function fetchList(query) { export function fetchArticle(id) { return request({ - url: '/article/detail', + url: '/vue-element-admin/article/detail', method: 'get', params: { id } }) @@ -18,7 +18,7 @@ export function fetchArticle(id) { export function fetchPv(pv) { return request({ - url: '/article/pv', + url: '/vue-element-admin/article/pv', method: 'get', params: { pv } }) @@ -26,7 +26,7 @@ export function fetchPv(pv) { export function createArticle(data) { return request({ - url: '/article/create', + url: '/vue-element-admin/article/create', method: 'post', data }) @@ -34,7 +34,7 @@ export function createArticle(data) { export function updateArticle(data) { return request({ - url: '/article/update', + url: '/vue-element-admin/article/update', method: 'post', data }) diff --git a/src/api/remote-search.js b/src/api/remote-search.js index c7e1911776c889dd77657155bc1e216ed237176e..02e42b46e56ac4dbb0bf6e4afb341562cc66eca5 100644 --- a/src/api/remote-search.js +++ b/src/api/remote-search.js @@ -2,7 +2,7 @@ import request from '@/utils/request' export function searchUser(name) { return request({ - url: '/search/user', + url: '/vue-element-admin/search/user', method: 'get', params: { name } }) @@ -10,7 +10,7 @@ export function searchUser(name) { export function transactionList(query) { return request({ - url: '/transaction/list', + url: '/vue-element-admin/transaction/list', method: 'get', params: query }) diff --git a/src/api/role.js b/src/api/role.js index f6a983f1706f4f2836b25f858478b2155e1ba513..959bbd213f6524042f7e3f7a7f98c4c83da6fe32 100644 --- a/src/api/role.js +++ b/src/api/role.js @@ -2,21 +2,21 @@ import request from '@/utils/request' export function getRoutes() { return request({ - url: '/routes', + url: '/vue-element-admin/routes', method: 'get' }) } export function getRoles() { return request({ - url: '/roles', + url: '/vue-element-admin/roles', method: 'get' }) } export function addRole(data) { return request({ - url: '/role', + url: '/vue-element-admin/role', method: 'post', data }) @@ -24,7 +24,7 @@ export function addRole(data) { export function updateRole(id, data) { return request({ - url: `/role/${id}`, + url: `/vue-element-admin/role/${id}`, method: 'put', data }) @@ -32,7 +32,7 @@ export function updateRole(id, data) { export function deleteRole(id) { return request({ - url: `/role/${id}`, + url: `/vue-element-admin/role/${id}`, method: 'delete' }) } diff --git a/src/api/user.js b/src/api/user.js index de69f70733b8eb696249d4c5921af03c157ab689..b8b8741caffb06423f39aafc1abd3cb6cf62ebb4 100644 --- a/src/api/user.js +++ b/src/api/user.js @@ -2,7 +2,7 @@ import request from '@/utils/request' export function login(data) { return request({ - url: '/user/login', + url: '/vue-element-admin/user/login', method: 'post', data }) @@ -10,7 +10,7 @@ export function login(data) { export function getInfo(token) { return request({ - url: '/user/info', + url: '/vue-element-admin/user/info', method: 'get', params: { token } }) @@ -18,7 +18,7 @@ export function getInfo(token) { export function logout() { return request({ - url: '/user/logout', + url: '/vue-element-admin/user/logout', method: 'post' }) } diff --git a/src/components/Charts/mixins/resize.js b/src/components/Charts/mixins/resize.js index dccaf1a8a9789c6d692e5863f1ff659da4cc03c6..b1e76e947aef4ef6f386250c5b486dff3cefba34 100644 --- a/src/components/Charts/mixins/resize.js +++ b/src/components/Charts/mixins/resize.js @@ -3,32 +3,54 @@ import { debounce } from '@/utils' export default { data() { return { - $_sidebarElm: null + $_sidebarElm: null, + $_resizeHandler: null } }, mounted() { - this.__resizeHandler = debounce(() => { - if (this.chart) { - this.chart.resize() - } - }, 100) - window.addEventListener('resize', this.__resizeHandler) + this.initListener() + }, + activated() { + if (!this.$_resizeHandler) { + // avoid duplication init + this.initListener() + } - this.$_sidebarElm = document.getElementsByClassName('sidebar-container')[0] - this.$_sidebarElm && this.$_sidebarElm.addEventListener('transitionend', this.$_sidebarResizeHandler) + // when keep-alive chart activated, auto resize + this.resize() }, beforeDestroy() { - window.removeEventListener('resize', this.__resizeHandler) - - this.$_sidebarElm && this.$_sidebarElm.removeEventListener('transitionend', this.$_sidebarResizeHandler) + this.destroyListener() + }, + deactivated() { + this.destroyListener() }, methods: { // use $_ for mixins properties // https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential $_sidebarResizeHandler(e) { if (e.propertyName === 'width') { - this.__resizeHandler() + this.$_resizeHandler() } + }, + initListener() { + this.$_resizeHandler = debounce(() => { + this.resize() + }, 100) + window.addEventListener('resize', this.$_resizeHandler) + + this.$_sidebarElm = document.getElementsByClassName('sidebar-container')[0] + this.$_sidebarElm && this.$_sidebarElm.addEventListener('transitionend', this.$_sidebarResizeHandler) + }, + destroyListener() { + window.removeEventListener('resize', this.$_resizeHandler) + this.$_resizeHandler = null + + this.$_sidebarElm && this.$_sidebarElm.removeEventListener('transitionend', this.$_sidebarResizeHandler) + }, + resize() { + const { chart } = this + chart && chart.resize() } } } diff --git a/src/components/DragSelect/index.vue b/src/components/DragSelect/index.vue index 28256a8b582179e96aff808b1a658ee77cca5caf..47f42474f1d2661414d974c79a8f1bc10733e6ce 100644 --- a/src/components/DragSelect/index.vue +++ b/src/components/DragSelect/index.vue @@ -48,14 +48,18 @@ export default { } - diff --git a/src/components/HeaderSearch/index.vue b/src/components/HeaderSearch/index.vue index af047168e9f9446db239e2c2551ca9ecb1a6e96e..6026ebb416cbd80eb44ffb1294020e49c45ac31e 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/ImageCropper/index.vue b/src/components/ImageCropper/index.vue index 13ae9a1180cd8a533ca6827645a71b78545964ce..65a4262bebfb38b99255c42fe2d6c8a3322e9e0b 100644 --- a/src/components/ImageCropper/index.vue +++ b/src/components/ImageCropper/index.vue @@ -248,6 +248,7 @@ export default { // 浏览器是否支持该控件 isSupported, // 浏览器是否支持触屏事件 + // eslint-disable-next-line no-prototype-builtins isSupportTouch: document.hasOwnProperty('ontouchstart'), // 步骤 step: 1, // 1选择文件 2剪裁 3上传 diff --git a/src/components/JsonEditor/index.vue b/src/components/JsonEditor/index.vue index 07b282e401d270489eb0b035be563ffdc66709b3..c05b090c3b45e78844a5316b79fb60df0e67ee51 100644 --- a/src/components/JsonEditor/index.vue +++ b/src/components/JsonEditor/index.vue @@ -54,19 +54,24 @@ export default { } - diff --git a/src/components/MarkdownEditor/index.vue b/src/components/MarkdownEditor/index.vue index 3d6794b56a512d38772765049ffa05345162c8cf..1a8a01ee767b515b32a4ebae76a2b84c30bdbc7e 100644 --- a/src/components/MarkdownEditor/index.vue +++ b/src/components/MarkdownEditor/index.vue @@ -12,7 +12,7 @@ import Editor from 'tui-editor' import defaultOptions from './default-options' export default { - name: 'MarddownEditor', + name: 'MarkdownEditor', props: { value: { type: String, diff --git a/src/components/Share/DropdownMenu.vue b/src/components/Share/DropdownMenu.vue index 8ad8e56e566a09cbbe459a78ebc34b1acdecf3b5..d194a517a8de97715c1ec641139fbaf7d3f7329c 100644 --- a/src/components/Share/DropdownMenu.vue +++ b/src/components/Share/DropdownMenu.vue @@ -44,6 +44,7 @@ $t: .1s; width: 250px; position: relative; z-index: 1; + height: auto!important; &-title { width: 100%; display: block; @@ -65,10 +66,12 @@ $t: .1s; position: absolute; width: 100%; background: #e0e0e0; + color: #000; line-height: 60px; height: 60px; cursor: pointer; - font-size: 20px; + font-size: 18px; + overflow: hidden; opacity: 1; transition: transform 0.28s ease; &:hover { @@ -90,7 +93,7 @@ $t: .1s; .share-dropdown-menu-item { @for $i from 1 through $n { &:nth-of-type(#{$i}) { - transition-delay: ($n - $i)*$t; + transition-delay: ($n - $i)*$t; transform: translate3d(0, ($i - 1)*60px, 0); } } diff --git a/src/components/SvgIcon/index.vue b/src/components/SvgIcon/index.vue index 9a3318e5e6f47d3e4eb31389da799d102fdae0c2..b07ded2af39d367113e28f68ca581b74b2625718 100644 --- a/src/components/SvgIcon/index.vue +++ b/src/components/SvgIcon/index.vue @@ -1,7 +1,7 @@ diff --git a/src/components/Tinymce/components/EditorImage.vue b/src/components/Tinymce/components/EditorImage.vue index d4a98e847d3cc641ec4ba1c0bb4c460bc0c4513c..07d48e6cfda8c113904e4b382874fca190c9c5bb 100644 --- a/src/components/Tinymce/components/EditorImage.vue +++ b/src/components/Tinymce/components/EditorImage.vue @@ -104,7 +104,7 @@ export default { diff --git a/src/layout/components/Sidebar/Link.vue b/src/layout/components/Sidebar/Link.vue index eb4dd1079bc22f5e2dcad0c9eb71d5f3e7735126..530b3d5b3749538745ffbf2fcb32547a4de3bfa3 100644 --- a/src/layout/components/Sidebar/Link.vue +++ b/src/layout/components/Sidebar/Link.vue @@ -1,7 +1,5 @@ - @@ -16,19 +14,28 @@ export default { required: true } }, + computed: { + isExternal() { + return isExternal(this.to) + }, + type() { + if (this.isExternal) { + return 'a' + } + return 'router-link' + } + }, methods: { - linkProps(url) { - if (isExternal(url)) { + linkProps(to) { + if (this.isExternal) { return { - is: 'a', - href: url, + href: to, target: '_blank', rel: 'noopener' } } return { - is: 'router-link', - to: url + to: to } } } diff --git a/src/layout/components/Sidebar/SidebarItem.vue b/src/layout/components/Sidebar/SidebarItem.vue index 2d49dd879b512eea45832de98be62868368d73e3..a418c3d712a6d23a6aa70f4fa779011cac3b64ef 100644 --- a/src/layout/components/Sidebar/SidebarItem.vue +++ b/src/layout/components/Sidebar/SidebarItem.vue @@ -1,5 +1,5 @@