diff --git a/.postcssrc.js b/.postcssrc.js deleted file mode 100644 index 09948d63..00000000 --- a/.postcssrc.js +++ /dev/null @@ -1,8 +0,0 @@ -// https://github.com/michael-ciniawsky/postcss-load-config - -module.exports = { - "plugins": { - // to edit target browsers: use "browserslist" field in package.json - "autoprefixer": {} - } -} diff --git a/README.es.md b/README.es.md new file mode 100644 index 00000000..734c51c2 --- /dev/null +++ b/README.es.md @@ -0,0 +1,216 @@ +

+ +

+ +

+ + vue + + + element-ui + + + Estado de Construcción + + + Licencia + + + Liberación Github + + + Gitter + + + Donación + +

+ +Español | [English](./README.md) | [简体中文](./README.zh-CN.md) | [日本語](./README.ja.md) + +## Introducción + +[vue-element-admin](https://panjiachen.github.io/vue-element-admin) es una interfáz de administración preparada para producción. Está basada en [vue](https://github.com/vuejs/vue) y usa [element-ui](https://github.com/ElemeFE/element) como conjunto de herramientas de interfáz de usuario. + +Vue Element Admin es una solución práctica basada en la nueva plataforma de desarrollo de vue, construida con soporte a i18 para el manejo de múltiples lenguajes, plantillas estándares para aplicaciones de negocio y un conjunto de asombrosas características. Esta herramienta ayuda a construir largas y complejas Aplicacones de una sola página (SPA). Creo que lo que necesites hacer, este proyecto te ayudará. + +- [Vista Prévia de la Aplicación](https://panjiachen.github.io/vue-element-admin) + +- [Documentación](https://panjiachen.github.io/vue-element-admin-site/) + +- [Canal de Gitter](https://gitter.im/vue-element-admin/discuss) + +- [Para Donaciones](https://panjiachen.github.io/vue-element-admin-site/donate/) + +- [Enlace de Wiki](https://github.com/PanJiaChen/vue-element-admin/wiki) + +- [Canal de Gitee](https://panjiachen.gitee.io/vue-element-admin/) + +- Plantilla base recomendada para usar: [vue-admin-template](https://github.com/PanJiaChen/vue-admin-template) +- Aplicación de Escritorio: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin) +- Plantilla de Typescript: [vue-typescript-admin-template](https://github.com/Armour/vue-typescript-admin-template) (Créditos: [@Armour](https://github.com/Armour)) + +**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** + +**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).** + +## 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. + +

+ +

+ +## 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) + +

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

+ +## Características + +``` +- Iniciar / Cerrar Sesión + +- Permisos de Authentication + - 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 + +- Características Globales + - I18n + - Temas dinámicos + - Dynamic sidebar (soporte a rutas multi-nivel) + - Barra de rutas dinámica + - Tags-view (Tab page Support right-click operation) + - Svg Sprite + - Datos de simulación con Mock + - Pantalla completa + - Responsive Sidebar + +- Editor + - Editor de Texto Enriquecido + - Editor Markdown + - Editor JSON + +- Excel + - Exportación a Excel + - Carga de Excel + - Visualización de Excel + - Exportación como zip + +- Tabla + - Tabla Dinámica + - Tabla con Arrastrar y Soltar + - Tabla de edición en línea + +- Páginas de Error + - 401 + - 404 + +- Componentes + - Carga de Avatar + - Botón para subir al inicio + - Arrastrar y Soltar (Diaglogo) + - Arrastrar y Soltar (Seleccionar) + - Arrastrar y Soltar (Kanban) + - Arrastrar y Soltar (Lista) + - Panel de división + - Componente para soltar archivos + - Adhesión de objetos + - Contador hasta + +- Ejemplo Avanzado +- Registro de Errores +- Tablero de indicadores +- Página de Guías +- ECharts (Gráficos) +- Portapapeles +- Convertidor de Markdown a html +``` + +## Iniciando + +```bash +# clone el proyecto +git clone https://github.com/PanJiaChen/vue-element-admin.git + +# vaya al directorio clonado +cd vue-element-admin + +# instale las dependencias +npm install + +# corra el proyecto como desarrollador +npm run dev +``` + +Automáticamente se abrirá el siguiente enlace en su navegador http://localhost:9527 + +## Construcción + +```bash +# Construcción para entornos de prueba +npm run build:stage + +# Construcción para entornos de producción +npm run build:prod +``` + +## Avanzado + +```bash +# Vista previa con efectos de entorno +npm run preview + +# Vista previa con efectos + análisis de recursos estáticos +npm run preview -- --report + +# Chequeo de formato de código +npm run lint + +# Chequeo de formato de código y auto-corrección +npm run lint -- --fix +``` + +Vaya a [Documentación](https://panjiachen.github.io/vue-element-admin-site/guide/essentials/deploy.html) para mayor información + +## Registro de Cambios + +Los cambios detallados por cada liberación se encuentran en [notas de liberación](https://github.com/PanJiaChen/vue-element-admin/releases). + +## Demostración en línea + +[Vista Prévia de la Aplicación](https://panjiachen.github.io/vue-element-admin) + +## Donación + +Si este proyecto es de mucha ayuda para ti, puedes comprarle al autor un vaso de jugo :tropical_drink: + +![Donar](https://wpimg.wallstcn.com/bd273f0d-83a0-4ef2-92e1-9ac8ed3746b9.png) + +[dona por Paypal](https://www.paypal.me/panfree23) + +[Comprame un Café](https://www.buymeacoffee.com/Pan) + +## Navegadores Soportados + +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 + +## Licencia + +[MIT](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE) + +Copyright (c) 2017-presente PanJiaChen diff --git a/README.ja.md b/README.ja.md index c99108fe..e890e4f6 100644 --- a/README.ja.md +++ b/README.ja.md @@ -26,7 +26,7 @@

-日本語 | [English](./README.md) | [简体中文](./README.zh-CN.md) +日本語 | [English](./README.md) | [简体中文](./README.zh-CN.md) | [Spanish](./README.es.md) ## 概要 diff --git a/README.md b/README.md index a2c63a00..cf4b74f6 100644 --- a/README.md +++ b/README.md @@ -26,7 +26,7 @@

-English | [简体中文](./README.zh-CN.md) | [日本語](./README.ja.md) +English | [简体中文](./README.zh-CN.md) | [日本語](./README.ja.md) | [Spanish](./README.es.md) ## Introduction diff --git a/README.zh-CN.md b/README.zh-CN.md index c6f4604d..96a57757 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -26,7 +26,7 @@

-简体中文 | [English](./README.md) +简体中文 | [English](./README.md) | [日本語](./README.ja.md) | [Spanish](./README.es.md) ## 简介 diff --git a/package.json b/package.json index e092c70d..774ab589 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-element-admin", - "version": "4.0.1", + "version": "4.2.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", @@ -110,7 +110,6 @@ }, "browserslist": [ "> 1%", - "last 2 versions", - "not ie <= 8" + "last 2 versions" ] } diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 00000000..961986e2 --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,5 @@ +module.exports = { + plugins: { + autoprefixer: {} + } +} diff --git a/public/index.html b/public/index.html index 9bb2d7fc..e9185009 100644 --- a/public/index.html +++ b/public/index.html @@ -9,10 +9,6 @@ <%= webpackConfig.name %> - - <% for(var js of htmlWebpackPlugin.options.cdn.js) { %> - - <% } %>
diff --git a/src/components/Breadcrumb/index.vue b/src/components/Breadcrumb/index.vue index b89d8da6..c11fd448 100644 --- a/src/components/Breadcrumb/index.vue +++ b/src/components/Breadcrumb/index.vue @@ -21,7 +21,11 @@ export default { } }, watch: { - $route() { + $route(route) { + // if you go to the redirect page, do not update the breadcrumbs + if (route.path.startsWith('/redirect/')) { + return + } this.getBreadcrumb() } }, diff --git a/src/components/RightPanel/index.vue b/src/components/RightPanel/index.vue index 63408d8b..55e8c1e5 100644 --- a/src/components/RightPanel/index.vue +++ b/src/components/RightPanel/index.vue @@ -86,32 +86,27 @@ export default { diff --git a/src/components/Tinymce/dynamicLoadScript.js b/src/components/Tinymce/dynamicLoadScript.js new file mode 100644 index 00000000..46a93290 --- /dev/null +++ b/src/components/Tinymce/dynamicLoadScript.js @@ -0,0 +1,39 @@ +const dynamicLoadScript = (src, callback) => { + const existingScript = document.getElementById(src) + const cb = callback || function() {} + + if (!existingScript) { + const script = document.createElement('script') + script.src = src // src url for the third-party library being loaded. + script.id = src + document.body.appendChild(script) + + const onEnd = 'onload' in script ? stdOnEnd : ieOnEnd + onEnd(script, cb) + } + + if (existingScript && cb) cb(null, existingScript) + + function stdOnEnd(script, cb) { + script.onload = function() { + // this.onload = null here is necessary + // because even IE9 works not like others + this.onerror = this.onload = null + cb(null, script) + } + script.onerror = function() { + this.onerror = this.onload = null + cb(new Error('Failed to load ' + src), script) + } + } + + function ieOnEnd(script, cb) { + script.onreadystatechange = function() { + if (this.readyState !== 'complete' && this.readyState !== 'loaded') return + this.onreadystatechange = null + cb(null, script) // there is no way to catch loading errors in IE8 + } + } +} + +export default dynamicLoadScript diff --git a/src/components/Tinymce/index.vue b/src/components/Tinymce/index.vue index a5dd7a3f..670a0e53 100644 --- a/src/components/Tinymce/index.vue +++ b/src/components/Tinymce/index.vue @@ -15,6 +15,10 @@ import editorImage from './components/EditorImage' import plugins from './plugins' import toolbar from './toolbar' +import load from './dynamicLoadScript' + +// why use this cdn, detail see https://github.com/PanJiaChen/tinymce-all-in-one +const tinymceCDN = 'https://cdn.jsdelivr.net/npm/tinymce-all-in-one@4.9.3/tinymce.min.js' export default { name: 'Tinymce', @@ -91,10 +95,12 @@ export default { } }, mounted() { - this.initTinymce() + this.init() }, activated() { - this.initTinymce() + if (window.tinymce) { + this.initTinymce() + } }, deactivated() { this.destroyTinymce() @@ -103,12 +109,20 @@ export default { this.destroyTinymce() }, methods: { + init() { + // dynamic load tinymce from cdn + load(tinymceCDN, (err) => { + if (err) { + this.$message.error(err.message) + return + } + this.initTinymce() + }) + }, initTinymce() { const _this = this window.tinymce.init({ language: this.language, - // language cnd URL, detail see https://github.com/PanJiaChen/tinymce-lang - language_url: this.language === 'en' ? '' : `https://cdn.jsdelivr.net/npm/tinymce-lang/langs/${this.language}.js`, selector: `#${this.tinymceId}`, height: this.height, body_class: 'panel-body ', diff --git a/src/main.js b/src/main.js index 74328e8e..17ab972f 100644 --- a/src/main.js +++ b/src/main.js @@ -21,15 +21,24 @@ import './utils/error-log' // error log import * as filters from './filters' // global filters import VueAnalytics from 'vue-analytics' -import { mockXHR } from '../mock' // simulation data Vue.use(VueAnalytics, { id: 'UA-109340118-1', router }) -// mock api in github pages site build -if (process.env.NODE_ENV === 'production') { mockXHR() } +/** + * If you don't want to use mock-server + * you want to use MockJs for mock api + * you can execute: mockXHR() + * + * Currently MockJs will be used in the production environment, + * please remove it before going online! ! ! + */ +import { mockXHR } from '../mock' +if (process.env.NODE_ENV === 'production') { + mockXHR() +} Vue.use(Element, { size: Cookies.get('size') || 'medium', // set element-ui default size diff --git a/src/store/index.js b/src/store/index.js index 70736d3a..0fd83955 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -5,7 +5,7 @@ import getters from './getters' Vue.use(Vuex) // https://webpack.js.org/guides/dependency-management/#requirecontext -const modulesFiles = require.context('./modules', false, /\.js$/) +const modulesFiles = require.context('./modules', true, /\.js$/) // you do not need `import app from './modules/app'` // it will auto require all vuex module from modules file diff --git a/src/store/modules/user.js b/src/store/modules/user.js index d2b2e67a..dbc29003 100644 --- a/src/store/modules/user.js +++ b/src/store/modules/user.js @@ -115,6 +115,9 @@ const actions = { // dynamically add accessible routes router.addRoutes(accessRoutes) + // reset visited views and cached views + dispatch('tagsView/delAllViews', null, { root: true }) + resolve() }) } diff --git a/src/styles/sidebar.scss b/src/styles/sidebar.scss index e55f8656..3dad4c39 100644 --- a/src/styles/sidebar.scss +++ b/src/styles/sidebar.scss @@ -95,10 +95,6 @@ margin-left: 54px; } - .svg-icon { - margin-right: 0px; - } - .submenu-title-noDropdown { padding: 0 !important; position: relative; diff --git a/src/views/example/components/ArticleDetail.vue b/src/views/example/components/ArticleDetail.vue index 4f4dfe05..59d7fce1 100644 --- a/src/views/example/components/ArticleDetail.vue +++ b/src/views/example/components/ArticleDetail.vue @@ -185,12 +185,16 @@ export default { fetchData(id) { fetchArticle(id).then(response => { this.postForm = response.data - // Just for test + + // just for test this.postForm.title += ` Article Id:${this.postForm.id}` this.postForm.content_short += ` Article Id:${this.postForm.id}` - // Set tagsview title + // set tagsview title this.setTagsViewTitle() + + // set page title + this.setPageTitle() }).catch(err => { console.log(err) }) @@ -200,6 +204,10 @@ export default { const route = Object.assign({}, this.tempRoute, { title: `${title}-${this.postForm.id}` }) this.$store.dispatch('tagsView/updateVisitedView', route) }, + setPageTitle() { + const title = 'Edit Article' + document.title = `${title} - ${this.postForm.id}` + }, submitForm() { console.log(this.postForm) this.$refs.postForm.validate(valid => { diff --git a/src/views/login/index.vue b/src/views/login/index.vue index 27f11ef5..7c16db67 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -116,13 +116,18 @@ export default { capsTooltip: false, loading: false, showDialog: false, - redirect: undefined + redirect: undefined, + otherQuery: {} } }, watch: { $route: { handler: function(route) { - this.redirect = route.query && route.query.redirect + const query = route.query + if (query) { + this.redirect = query.redirect + this.otherQuery = this.getOtherQuery(query) + } }, immediate: true } @@ -169,7 +174,7 @@ export default { this.loading = true this.$store.dispatch('user/login', this.loginForm) .then(() => { - this.$router.push({ path: this.redirect || '/' }) + this.$router.push({ path: this.redirect || '/', query: this.otherQuery }) this.loading = false }) .catch(() => { @@ -180,6 +185,14 @@ export default { return false } }) + }, + getOtherQuery(query) { + return Object.keys(query).reduce((acc, cur) => { + if (cur !== 'redirect') { + acc[cur] = query[cur] + } + return acc + }, {}) } // afterQRScan() { // if (e.key === 'x-admin-oauth-code') { diff --git a/src/views/redirect/index.vue b/src/views/redirect/index.vue index bf56fbcd..db4c1d66 100644 --- a/src/views/redirect/index.vue +++ b/src/views/redirect/index.vue @@ -1,6 +1,6 @@