From 45fef9b431a0a5a7cdd5399aaebd9fabec2b2dd3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8A=B1=E8=A3=A4=E8=A1=A9?= <panfree23@gmail.com>
Date: Fri, 29 Dec 2017 16:07:42 +0800
Subject: [PATCH] Feature/english (#381)
* perf[navbar]: set langSelect to component && refine errorLog component
* feat[login]:add 18n to login form
* fix[pagination]: fixed when selected page-sizes
* perf[i18n]:dashboard document svg permission
* perf[charts]: perf effect
* perf[i18n]:excel && zip
* perf[i18n]: table && errorLog && theme
* perf[i18n]: components
* perf[i18n]: direct use $t
* perf[i18n]: complex-table
* update README.md
* update README.md :blue_book:
* perf[i18n]: refine code comments
---
LICENSE | 2 +-
README-en.md | 177 ------------
README.md | 214 +++++++--------
README.zh-CN.md | 165 ++++++++++++
src/components/Charts/lineMarker.vue | 19 +-
src/components/Charts/mixChart.vue | 23 +-
src/components/Upload/singleImage3.vue | 1 -
src/errorLog.js | 4 +
src/icons/svg/trendChart1.svg | 1 -
src/icons/svg/trendChart2.svg | 1 -
src/icons/svg/trendChart3.svg | 1 -
src/lang/en.js | 73 ++++-
src/lang/zh.js | 69 +++++
src/main.js | 6 +-
src/mock/article.js | 8 +-
src/permission.js | 18 +-
src/router/index.js | 4 +
src/styles/element-ui.scss | 7 +
src/styles/index.scss | 3 +-
src/utils/clipboard.js | 4 +-
src/utils/i18n.js | 4 +-
src/utils/request.js | 10 +-
src/views/charts/keyboard.vue | 9 +-
src/views/charts/line.vue | 9 +-
src/views/charts/mixChart.vue | 10 +-
src/views/clipboard/index.vue | 4 +-
src/views/components-demo/avatarUpload.vue | 10 +-
src/views/components-demo/backToTop.vue | 253 +++++++++---------
src/views/components-demo/dndList.vue | 2 +-
src/views/components-demo/dropzone.vue | 8 +-
src/views/components-demo/markdown.vue | 6 +-
src/views/components-demo/splitpane.vue | 6 +-
src/views/components-demo/sticky.vue | 139 +++++-----
src/views/components-demo/tinymce.vue | 16 +-
.../dashboard/admin/components/BarChart.vue | 2 +-
.../dashboard/admin/components/LineChart.vue | 2 +-
.../dashboard/admin/components/PanelGroup.vue | 8 +-
.../dashboard/admin/components/PieChart.vue | 2 +-
.../admin/components/RaddarChart.vue | 2 +-
.../admin/components/TransactionTable.vue | 4 +-
src/views/dashboard/editor/index.vue | 4 +-
src/views/documentation/index.vue | 7 +-
src/views/errorLog/index.vue | 10 +-
src/views/example/tab/components/tabPane.vue | 16 +-
src/views/example/tab/index.vue | 8 +-
src/views/example/table/complexTable.vue | 106 ++++----
src/views/example/table/dragTable.vue | 22 +-
.../example/table/dynamicTable/fixedThead.vue | 10 +-
.../example/table/dynamicTable/index.vue | 4 +-
.../table/dynamicTable/unfixedThead.vue | 2 +-
src/views/example/table/inlineEditTable.vue | 20 +-
src/views/excel/exportExcel.vue | 17 +-
src/views/excel/selectExcel.vue | 35 +--
src/views/layout/components/AppMain.vue | 1 -
src/views/layout/components/Navbar.vue | 12 +-
src/views/login/authredirect.vue | 14 +-
src/views/login/index.vue | 38 ++-
src/views/permission/index.vue | 4 +-
src/views/svg-icons/index.vue | 3 +-
src/views/theme/index.vue | 26 +-
src/views/zip/index.vue | 15 +-
61 files changed, 901 insertions(+), 779 deletions(-)
delete mode 100644 README-en.md
create mode 100644 README.zh-CN.md
delete mode 100644 src/icons/svg/trendChart1.svg
delete mode 100644 src/icons/svg/trendChart2.svg
delete mode 100644 src/icons/svg/trendChart3.svg
diff --git a/LICENSE b/LICENSE
index b4bb0d9f..68144da7 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,6 +1,6 @@
MIT License
-Copyright (c) 2017 PanJiaChen
+Copyright (c) 2017-presen 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
diff --git a/README-en.md b/README-en.md
deleted file mode 100644
index 25459147..00000000
--- a/README-en.md
+++ /dev/null
@@ -1,177 +0,0 @@
-[](https://github.com/vuejs/vue)
-[](https://github.com/ElemeFE/element)
-[](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE)
-[]()
-
-## Intro
-
-> In the past half year, I have been building a backend for management dashboard using Vue. Though the backend has contained greater than 70 pages and over 10 permissions, it still takes insignificant effort to maintain the project. So I decide to make it open source so as to share my development experience and progress on backend. The tech stack is mainly [Vue.js](https://github.com/vuejs/vue)+[Element](https://github.com/ElemeFE/element)+[axios](https://github.com/mzabriskie/axios). Since it's a personal project, all data requests are simulated with [Mock.js](https://github.com/nuysoft/Mock). **Note:** if anyone wants to modify or develop based on this project, please remove the mock files.
-
-**Live demo:** http://panjiachen.github.io/vue-element-admin
-
-**Note: element-ui@1.4.2 is used in the project, so vue 2.3.0+ is required.**
-
- - vueAdmin-template: [vueAdmin-template](https://github.com/PanJiaChen/vueAdmin-template) Â
- - electron-vue-admin: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin)
- - Donate:[donate](https://github.com/PanJiaChen/vue-element-admin/blob/master/README-en.md#donate)
-
-## Features
-
-- Login/Logout
-- Permission authentication
-- Sidebar
-- Breadcrumb
-- Rich text editor
-- Markdown editor
-- JSON editor
-- Drag & drop list
-- SplitPane
-- Dropzone
-- Sticky
-- CountTo
-- ECharts
-- 401, 404 error page
-- Error log
-- Export Excel
-- Upload Excel
-- Export Zip
-- Table example
-- Interactive table example
-- Drag & drop table example
-- Form example
-- Multi-environments distribution
-- Dashboard
-- Two-factor authentication
-- Collapsing sidebar (support nested routes)
-- Mock data
-- cache tabs example
-- screenfull
-- markdown2html
-- views-tab
-- clipboard
-
-## Development
-
-```bash
-# Clone project
-git clone https://github.com/PanJiaChen/vue-element-admin.git
-
-# Install dependencies
-npm install
-
-# Or (not recommended for cnpm due to unknown bugs, use taobao mirror instead)
-npm install --registry=https://registry.npm.taobao.org
-
-# Run local dev server
-npm run dev
-```
-
-Visit in browser: http://localhost:9527
-
-## Distribution
-
-```bash
-# Build staged environment with webpack-bundle-analyzer
-npm run build:sit-preview
-
-# Build production environment
-npm run build:prod
-```
-
-## Directory structure
-
-```
-├── build // buildÂ
-├── config // config
-├── src // source code
-│  ├── api // all requests
-│  ├── assets // static resource like themes, fonts
-│  ├── components // global public components
-│  ├── directive // global directive
-│  ├── filters // global filters
-│  ├── mock // mock data
-│  ├── router // router
-│  ├── store // global status management
-│  ├── styles // global styles
-│  ├── utils // global public functions
-│  ├── view // view
-│  ├── App.vue // entry view
-│  └── main.js // entry for loading components, initialization
-├── static // third-party libraries not packed with Webpack
-│  └── Tinymce // rich text
-├── .babelrc // babel-loader config
-├── eslintrc.js // eslint config
-├── .gitignore // gitignore
-├── favicon.ico // favicon
-├── index.html // html template
-└── package.json // package.json
-```
-
-## Changelog
-Detailed changes for each release are documented in the [release notes](https://github.com/PanJiaChen/vue-element-admin/releases).
-
-## Donate
-If you find this project useful, you can buy me a cup of coffee
-
-
-## State Management
-
-Only status of user and app configuration is managed by Vuex. Other data are managed by their own business pages.
-
-## Demo
-
-#### Two-factor authentication, supporting WeChat and QQ
-
-
-
-#### Realtime switching themes
-
-
-
-#### tabs
-
-<br />
-
-#### Collapsing sidebar
-
-
-
-#### Drag & drop table
-
-
-
-#### Interactive table
-
-
-
-#### Uploading cropped avatar
-
-
-
-#### Error log
-
-
-
-#### Rich text (integrated with Qiniu, watermark and customization)
-
-
-
-#### Packaging table component
-
-
-
-#### Charts
-
-
-
-#### Exporting to Excel
-
-
-
-#### More
-
-http://panjiachen.github.io/vue-element-admin
-
-## License
-
-MIT
diff --git a/README.md b/README.md
index d4f11fb9..fda9814a 100644
--- a/README.md
+++ b/README.md
@@ -2,177 +2,151 @@
<img width="320" src="https://wpimg.wallstcn.com/ecc53a42-d79b-42e2-8852-5126b810a4c8.svg">
</p>
-# vue-element-admin
+<p align="center">
+ <a href="https://github.com/vuejs/vue">
+ <img src="https://img.shields.io/badge/vue-2.5.10-brightgreen.svg" alt="vue">
+ </a>
+ <a href="https://github.com/ElemeFE/element">
+ <img src="https://img.shields.io/badge/element--ui-2.0.8-brightgreen.svg" alt="element-ui">
+ </a>
+ <a href="https://travis-ci.org/PanJiaChen/vue-element-admin" rel="nofollow">
+ <img src="https://travis-ci.org/PanJiaChen/vue-element-admin.svg?branch=master" alt="Build Status">
+ </a>
+ <a href="https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE">
+ <img src="https://img.shields.io/github/license/mashape/apistatus.svg" alt="license">
+ </a>
+ <a href="https://github.com/PanJiaChen/vue-element-admin/releases">
+ <img src="https://img.shields.io/github/release/PanJiaChen/vue-element-admin.svg" alt="GitHub release">
+ </a>
+</p>
-[](https://github.com/vuejs/vue)
-[](https://github.com/ElemeFE/element)
-[](https://travis-ci.org/PanJiaChen/vue-element-admin)
-[](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE)
-[]()
+English | [简体ä¸æ–‡](./README.zh-CN.md)
-**A magical vue admin.**
+## Introduction
-- [线上地å€](http://panjiachen.github.io/vue-element-admin)
+`vue-element-admin` is a production-ready solution for admin interfaces. Based on [Vue.js](https://github.com/vuejs/vue) and use the UI Toolkit -- [element](https://github.com/ElemeFE/element). `vue-element-admin` is a magical vue admin, it 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.
-- [使用文档](https://panjiachen.github.io/vue-element-admin-site/#/)
+- [Preview](http://panjiachen.github.io/vue-element-admin)
-- [English Document](https://github.com/PanJiaChen/vue-element-admin/blob/master/README-en.md)
+- [Documentation](https://panjiachen.github.io/vue-element-admin-site/#/)
- [wiki](https://github.com/PanJiaChen/vue-element-admin/wiki)
- [donate](https://panjiachen.github.io/vue-element-admin-site/#/donate)
-**本项目的定ä½æ˜¯åŽå°é›†æˆæ–¹æ¡ˆï¼Œä¸é€‚åˆå½“基础模æ¿æ¥å¼€å‘。**
- - 模æ¿å»ºè®®ä½¿ç”¨: [vueAdmin-template](https://github.com/PanJiaChen/vueAdmin-template) Â
- - æ¡Œé¢ç«¯: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin)
-
-**注æ„：该项目使用 element-ui@2.0.0+ 版本，所以最低兼容 vue@2.5.0**
-
-## å‰åºå‡†å¤‡
+**vue-element-admin is a admin interfaces integration solution, which is not suitable for secondary development as a base template.**
-ä½ çš„æœ¬åœ°çŽ¯å¢ƒéœ€è¦å®‰è£… [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/) å’Œ [element-ui](https://github.com/ElemeFE/element)，æå‰äº†è§£å’Œå¦ä¹ 这些知识会对使用本项目有很大的帮助。
+ - Base template recommends using: [vueAdmin-template](https://github.com/PanJiaChen/vueAdmin-template) Â
+ - Desktop: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin)
-åŒæ—¶é…å¥—ä¸€ä¸ªç³»åˆ—çš„æ•™ç¨‹æ–‡ç« ï¼Œå¦‚ä½•ä»Žé›¶æž„å»ºåŽä¸€ä¸ªå®Œæ•´çš„åŽå°é¡¹ç›®ï¼Œå»ºè®®å¤§å®¶å…ˆçœ‹å®Œè¿™äº›æ–‡ç« å†æ¥å®žè·µæœ¬é¡¹ç›®
- - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ç”¨ vue æ’¸åŽå° 系列一(基础篇)](https://juejin.im/post/59097cd7a22b9d0065fb61d2)
- - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ç”¨ vue æ’¸åŽå° 系列二(登录æƒé™ç¯‡)](https://juejin.im/post/591aa14f570c35006961acac)
- - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ç”¨ vue æ’¸åŽå° 系列三 (实战篇)](https://juejin.im/post/593121aa0ce4630057f70d35)
- - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ç”¨ vue æ’¸åŽå° 系列四(vueAdmin 一个æžç®€çš„åŽå°åŸºç¡€æ¨¡æ¿)](https://juejin.im/post/595b4d776fb9a06bbe7dba56)
- - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ å°è£…一个 vue component](https://segmentfault.com/a/1190000009090836)
- - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ä¼˜é›…çš„ä½¿ç”¨ icon](https://juejin.im/post/59bb864b5188257e7a427c09)
+**Note: This project uses element-ui@2.0.0+ version, so the minimum compatible vue@2.5.0**
- å“应需求，开了一个qq群 `591724180` 方便大家交æµ
+## Preparation
- æˆ–è€…åŠ å…¥è¯¥ç¾¤ä¸» **[圈å](https://jianshiapp.com/circles/1209)** 楼主会ç»å¸¸åˆ†äº«ä¸€äº›æŠ€æœ¯ç›¸å…³çš„东西
+You need to install [node](http://nodejs.org/) and [git](https://git-scm.com/) locally. The project is based on [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/) å’Œ [element-ui](https://github.com/ElemeFE/element). All data requests for this project are simulated using [Mock.js](https://github.com/nuysoft/Mock). It would be helpful if you have pre-existing knowledge on those.
- **å¦‚æœ‰é—®é¢˜è¯·å…ˆçœ‹ä¸Šè¿°ä½¿ç”¨æ–‡æ¡£å’Œæ–‡ç« ï¼Œè‹¥ä¸èƒ½æ»¡è¶³ï¼Œæ¬¢è¿Ž issue å’Œ pr**
+ **This project is not a scaffolding and is more of an integrated solution.**
- **本项目并ä¸æ˜¯ä¸€ä¸ªè„šæ‰‹æž¶ï¼Œæ›´å€¾å‘于是一个集æˆè§£å†³æ–¹æ¡ˆ**
-
- **该项目ä¸æ”¯æŒä½Žç‰ˆæœ¬æ¸¸è§ˆå™¨(如ie)ï¼Œæœ‰éœ€æ±‚è¯·è‡ªè¡Œæ·»åŠ polyfill [详情](https://github.com/PanJiaChen/vue-element-admin/wiki#babel-polyfill)**
+ **This project does not support low version browsers (e.g. IE). Please add polyfill yourself if you need them.**
<p align="center">
<img width="900" src="https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png">
</p>
-## 功能
-- 登录/注销
-- æƒé™éªŒè¯
-- 多环境å‘布
-- 动æ€ä¾§è¾¹æ （支æŒå¤šçº§è·¯ç”±ï¼‰
-- 动æ€é¢åŒ…屑
-- 国际化多è¯è¨€
-- 多ç§åŠ¨æ€æ¢è‚¤
-- å¿«æ·å¯¼èˆª(æ ‡ç¾é¡µ 支æŒå³é”®æ“作)
-- 富文本编辑器
-- Markdown编辑器
-- JSON编辑器
-- Screenfullå…¨å±
-- 列表拖拽
-- Svg Sprite å›¾æ ‡
+## Features
+```
+- Login / Logout
+- Permission authentication
+- Multi-environment build
+- Dynamic sidebar (supports multi-level routing)
+- Dynamic breadcrumb
+- I18n
+- Customizable theme
+- Tags-view(Tab page Support right-click operation)
+- Rich text editor
+- Markdown editor
+- JSON editor
+- Screenfull
+- Drag and drop list
+- Svg Sprite
- Dashboard
-- 本地mockæ•°æ®
-- Echarts 图表
-- Clipboard(剪贴å¤åˆ¶)
-- 401/404错误页é¢
-- 错误日志
-- 导出excel
-- 导出zip
-- å‰ç«¯å¯è§†åŒ–excel
+- Mock data
+- Echarts
+- Clipboard
+- 401/404 error page
+- Error log
+- Export excel
+- Export zip
+- Front-end visualization excel
- Table example
-- 动æ€table example
-- 拖拽table example
-- 内è”编辑table example
+- Dynamictable example
+- Drag and drop table example
+- Inline edit table example
- Form example
-- 二æ¥ç™»å½•
+- Two-step login
- SplitPane
- Dropzone
- Sticky
- CountTo
- Markdown to html
+```
+
+## Getting started
-## å¼€å‘
```bash
- # 克隆项目
- git clone https://github.com/PanJiaChen/vue-element-admin.git
+# clone the projice
+git clone https://github.com/PanJiaChen/vue-element-admin.git
- # 安装ä¾èµ–
- npm install
- Â Â
- # 建议ä¸è¦ç”¨cnpm安装 会有å„ç§è¯¡å¼‚çš„bug å¯ä»¥é€šè¿‡å¦‚下æ“作解决 npm 下载速度慢的问题
- npm install --registry=https://registry.npm.taobao.org
+# install dependency
+npm install
- # å¯åŠ¨æœåŠ¡
- npm run dev
+# develop
+npm run dev
```
-æµè§ˆå™¨è®¿é—® http://localhost:9527
-## å‘布
+This will automatically open http://localhost:9527.
+
+## Build
```bash
- # 构建测试环境
- npm run build:sit
+# build for test environment
+npm run build:sit
- # 构建生æˆçŽ¯å¢ƒ
- npm run build:prod
+# build for production environment
+npm run build:prod
```
-## 其它
+## Advanced
```bash
- # --report to build with bundle size analytics
- npm run build:prod --report
-
- # --preview to start a server in local to preview
- npm run build:prod --preview
+# --report to build with bundle size analytics
+npm run build:prod --report
- # lint code
- npm run lint
-```
+# --preview to start a server in local to preview
+npm run build:prod --preview
-更多信æ¯è¯·å‚考 [使用文档](https://panjiachen.github.io/vue-element-admin-site/#/deploy)
-
-## 目录结构
-```shell
-├── build // 构建相关 Â
-├── config // é…置相关
-├── src // æºä»£ç
-│  ├── api // 所有请求
-│  ├── assets // 主题 图片ç‰é™æ€èµ„æº
-│  ├── components // 全局公用组件
-│  ├── directive // 全局指令
-│  ├── filtres // 全局 filter
-│  ├── icons // 项目svg icons
-│  ├── lang // 国际化 lang
-│  ├── mock // 项目mock 模拟数æ®
-│  ├── router // 路由
-│  ├── store // 全局 store
-│  ├── styles // å…¨å±€æ ·å¼
-│  ├── utils // 全局公用方法
-│  ├── vendor // 公用vendor
-│  ├── views // views
-│  ├── App.vue // å…¥å£é¡µé¢
-│  ├── main.js // å…¥å£js åˆå§‹åŒ– åŠ è½½ç»„ä»¶ç‰
-│ └── permission.js // æƒé™ç®¡ç†
-├── static // 第三方ä¸æ‰“包资æº
-│  └── Tinymce // 富文本
-├── .babelrc // babel-loader é…ç½®
-├── .eslintrc.js // eslint é…置项
-├── .postcssrc.js // postcss é…置项
-├── .gitignore // git 忽略项
-├── favicon.ico // faviconå›¾æ ‡
-├── index.html // html模æ¿
-└── package.json // package.json
+# lint code
+npm run lint
+# auto fix
+npm run lint -- --fix
```
+Refer to [Documentation](https://panjiachen.github.io/vue-element-admin-site/#/deploy) for more information
+
## Changelog
Detailed changes for each release are documented in the [release notes](https://github.com/PanJiaChen/vue-element-admin/releases).
## Online Demo
-[查看更多demo](http://panjiachen.github.io/vue-element-admin)
+[Preview](http://panjiachen.github.io/vue-element-admin)
## Donate
-If you find this project useful, you can buy me a cup of coffee
-
+If you find this project useful, you can buy author a glass of juice :tropical_drink:
+
+
+
+[Paypal Me](https://www.paypal.me/panfree23)
## License
-MIT
+[MIT](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE)
+
+Copyright (c) 2017-presen PanJiaChen
diff --git a/README.zh-CN.md b/README.zh-CN.md
new file mode 100644
index 00000000..d46a3c12
--- /dev/null
+++ b/README.zh-CN.md
@@ -0,0 +1,165 @@
+<p align="center">
+ <img width="320" src="https://wpimg.wallstcn.com/ecc53a42-d79b-42e2-8852-5126b810a4c8.svg">
+</p>
+
+<p align="center">
+ <a href="https://github.com/vuejs/vue">
+ <img src="https://img.shields.io/badge/vue-2.5.10-brightgreen.svg" alt="vue">
+ </a>
+ <a href="https://github.com/ElemeFE/element">
+ <img src="https://img.shields.io/badge/element--ui-2.0.8-brightgreen.svg" alt="element-ui">
+ </a>
+ <a href="https://travis-ci.org/PanJiaChen/vue-element-admin" rel="nofollow">
+ <img src="https://travis-ci.org/PanJiaChen/vue-element-admin.svg?branch=master" alt="Build Status">
+ </a>
+ <a href="https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE">
+ <img src="https://img.shields.io/github/license/mashape/apistatus.svg" alt="license">
+ </a>
+ <a href="https://github.com/PanJiaChen/vue-element-admin/releases">
+ <img src="https://img.shields.io/github/release/PanJiaChen/vue-element-admin.svg" alt="GitHub release">
+ </a>
+</p>
+
+简体ä¸æ–‡ | [English](./README.md)
+
+## 简介
+
+`vue-element-admin` 是一个åŽå°é›†æˆè§£å†³æ–¹æ¡ˆï¼Œå®ƒåŸºäºŽ [Vue.js](https://github.com/vuejs/vue) å’Œ [element](https://github.com/ElemeFE/element)。它使用了最新的å‰ç«¯æŠ€æœ¯æ ˆï¼Œå†…置了i18国际化解决方案，动æ€è·¯ç”±ï¼Œæƒé™éªŒè¯ç‰å¾ˆå¤šåŠŸèƒ½ç‰¹æ€§ï¼Œç›¸ä¿¡ä¸ç®¡ä½ çš„éœ€æ±‚æ˜¯ä»€ä¹ˆï¼Œæœ¬é¡¹ç›®éƒ½èƒ½å¸®åŠ©åˆ°ä½ ã€‚
+
+- [在线访问](http://panjiachen.github.io/vue-element-admin)
+
+- [使用文档](https://panjiachen.github.io/vue-element-admin-site/#/)
+
+- [wiki](https://github.com/PanJiaChen/vue-element-admin/wiki)
+
+- [donate](https://panjiachen.github.io/vue-element-admin-site/#/donate)
+
+**本项目的定ä½æ˜¯åŽå°é›†æˆæ–¹æ¡ˆï¼Œä¸é€‚åˆå½“基础模æ¿æ¥å¼€å‘。**
+ - 模æ¿å»ºè®®ä½¿ç”¨: [vueAdmin-template](https://github.com/PanJiaChen/vueAdmin-template) Â
+ - æ¡Œé¢ç«¯: [electron-vue-admin](https://github.com/PanJiaChen/electron-vue-admin)
+
+**注æ„：该项目使用 element-ui@2.0.0+ 版本，所以最低兼容 vue@2.5.0**
+
+## å‰åºå‡†å¤‡
+
+ä½ çš„æœ¬åœ°çŽ¯å¢ƒéœ€è¦å®‰è£… [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/) and [element-ui](https://github.com/ElemeFE/element)，所有的请求数æ®éƒ½ä½¿ç”¨[Mock.js](https://github.com/nuysoft/Mock)模拟，æå‰äº†è§£å’Œå¦ä¹ 这些知识会对使用本项目有很大的帮助。
+
+åŒæ—¶é…å¥—ä¸€ä¸ªç³»åˆ—çš„æ•™ç¨‹æ–‡ç« ï¼Œå¦‚ä½•ä»Žé›¶æž„å»ºåŽä¸€ä¸ªå®Œæ•´çš„åŽå°é¡¹ç›®ï¼Œå»ºè®®å¤§å®¶å…ˆçœ‹å®Œè¿™äº›æ–‡ç« å†æ¥å®žè·µæœ¬é¡¹ç›®
+ - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ç”¨ vue æ’¸åŽå° 系列一(基础篇)](https://juejin.im/post/59097cd7a22b9d0065fb61d2)
+ - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ç”¨ vue æ’¸åŽå° 系列二(登录æƒé™ç¯‡)](https://juejin.im/post/591aa14f570c35006961acac)
+ - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ç”¨ vue æ’¸åŽå° 系列三 (实战篇)](https://juejin.im/post/593121aa0ce4630057f70d35)
+ - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ç”¨ vue æ’¸åŽå° 系列四(vueAdmin 一个æžç®€çš„åŽå°åŸºç¡€æ¨¡æ¿)](https://juejin.im/post/595b4d776fb9a06bbe7dba56)
+ - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ å°è£…一个 vue component](https://segmentfault.com/a/1190000009090836)
+ - [æ‰‹æ‘¸æ‰‹ï¼Œå¸¦ä½ ä¼˜é›…çš„ä½¿ç”¨ icon](https://juejin.im/post/59bb864b5188257e7a427c09)
+
+ å“应需求，开了一个qq群 `591724180` 方便大家交æµ
+
+ æˆ–è€…åŠ å…¥è¯¥ç¾¤ä¸» **[圈å](https://jianshiapp.com/circles/1209)** 楼主会ç»å¸¸åˆ†äº«ä¸€äº›æŠ€æœ¯ç›¸å…³çš„东西
+
+ **å¦‚æœ‰é—®é¢˜è¯·å…ˆçœ‹ä¸Šè¿°ä½¿ç”¨æ–‡æ¡£å’Œæ–‡ç« ï¼Œè‹¥ä¸èƒ½æ»¡è¶³ï¼Œæ¬¢è¿Ž issue å’Œ pr**
+
+ **本项目并ä¸æ˜¯ä¸€ä¸ªè„šæ‰‹æž¶ï¼Œæ›´å€¾å‘于是一个集æˆè§£å†³æ–¹æ¡ˆ**
+
+ **该项目ä¸æ”¯æŒä½Žç‰ˆæœ¬æµè§ˆå™¨(如ie)ï¼Œæœ‰éœ€æ±‚è¯·è‡ªè¡Œæ·»åŠ polyfill [详情](https://github.com/PanJiaChen/vue-element-admin/wiki#babel-polyfill)**
+
+ <p align="center">
+ <img width="900" src="https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png">
+</p>
+
+## 功能
+```
+- 登录/注销
+- æƒé™éªŒè¯
+- 多环境å‘布
+- 动æ€ä¾§è¾¹æ （支æŒå¤šçº§è·¯ç”±ï¼‰
+- 动æ€é¢åŒ…屑
+- 国际化多è¯è¨€
+- 多ç§åŠ¨æ€æ¢è‚¤
+- å¿«æ·å¯¼èˆª(æ ‡ç¾é¡µ)
+- 富文本编辑器
+- Markdown编辑器
+- JSON编辑器
+- Screenfullå…¨å±
+- 列表拖拽
+- Svg Sprite å›¾æ ‡
+- Dashboard
+- 本地mockæ•°æ®
+- Echarts 图表
+- Clipboard(剪贴å¤åˆ¶)
+- 401/404错误页é¢
+- 错误日志
+- 导出excel
+- 导出zip
+- å‰ç«¯å¯è§†åŒ–excel
+- Table example
+- 动æ€table example
+- 拖拽table example
+- 内è”编辑table example
+- Form example
+- 二æ¥ç™»å½•
+- SplitPane
+- Dropzone
+- Sticky
+- CountTo
+- Markdown2html
+```
+
+## å¼€å‘
+```bash
+# 克隆项目
+git clone https://github.com/PanJiaChen/vue-element-admin.git
+
+# 安装ä¾èµ–
+npm install
+Â Â
+# 建议ä¸è¦ç”¨cnpm安装 会有å„ç§è¯¡å¼‚çš„bug å¯ä»¥é€šè¿‡å¦‚下æ“作解决 npm 下载速度慢的问题
+npm install --registry=https://registry.npm.taobao.org
+
+# å¯åŠ¨æœåŠ¡
+npm run dev
+```
+æµè§ˆå™¨è®¿é—® http://localhost:9527
+
+## å‘布
+```bash
+# 构建测试环境
+npm run build:sit
+
+# 构建生æˆçŽ¯å¢ƒ
+npm run build:prod
+```
+
+## 其它
+```bash
+# --report to build with bundle size analytics
+npm run build:prod --report
+
+# --preview to start a server in local to preview
+npm run build:prod --preview
+
+# lint code
+npm run lint
+
+# auto fix
+npm run lint -- --fix
+```
+
+更多信æ¯è¯·å‚考 [使用文档](https://panjiachen.github.io/vue-element-admin-site/#/deploy)
+
+## Changelog
+Detailed changes for each release are documented in the [release notes](https://github.com/PanJiaChen/vue-element-admin/releases).
+
+## Online Demo
+[在线 Demo](http://panjiachen.github.io/vue-element-admin)
+
+## Donate
+å¦‚æžœä½ è§‰å¾—è¿™ä¸ªé¡¹ç›®å¸®åŠ©åˆ°äº†ä½ ï¼Œä½ å¯ä»¥å¸®ä½œè€…买一æ¯æžœæ±è¡¨ç¤ºé¼“励 :tropical_drink:
+
+
+[Paypal Me](https://www.paypal.me/panfree23)
+
+## License
+
+[MIT](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE)
+
+Copyright (c) 2017-presen PanJiaChen
diff --git a/src/components/Charts/lineMarker.vue b/src/components/Charts/lineMarker.vue
index 80e6b7ec..e8dce6da 100644
--- a/src/components/Charts/lineMarker.vue
+++ b/src/components/Charts/lineMarker.vue
@@ -46,13 +46,14 @@ export default {
this.chart.setOption({
backgroundColor: '#394056',
title: {
- text: '请求数',
+ top: 20,
+ text: 'Requests',
textStyle: {
fontWeight: 'normal',
fontSize: 16,
color: '#F1F1F3'
},
- left: '6%'
+ left: '1%'
},
tooltip: {
trigger: 'axis',
@@ -63,11 +64,12 @@ export default {
}
},
legend: {
+ top: 20,
icon: 'rect',
itemWidth: 14,
itemHeight: 5,
itemGap: 13,
- data: ['移动', '电信', 'è”通'],
+ data: ['CMCC', 'CTCC', 'CUCC'],
right: '4%',
textStyle: {
fontSize: 12,
@@ -75,9 +77,10 @@ export default {
}
},
grid: {
+ top: 100,
left: '3%',
right: '4%',
- bottom: '3%',
+ bottom: '2%',
containLabel: true
},
xAxis: [{
@@ -92,7 +95,7 @@ export default {
}],
yAxis: [{
type: 'value',
- name: 'å•ä½ï¼ˆ%）',
+ name: '(%)',
axisTick: {
show: false
},
@@ -114,7 +117,7 @@ export default {
}
}],
series: [{
- name: '移动',
+ name: 'CMCC',
type: 'line',
smooth: true,
symbol: 'circle',
@@ -148,7 +151,7 @@ export default {
},
data: [220, 182, 191, 134, 150, 120, 110, 125, 145, 122, 165, 122]
}, {
- name: '电信',
+ name: 'CTCC',
type: 'line',
smooth: true,
symbol: 'circle',
@@ -182,7 +185,7 @@ export default {
},
data: [120, 110, 125, 145, 122, 165, 122, 220, 182, 191, 134, 150]
}, {
- name: 'è”通',
+ name: 'CUCC',
type: 'line',
smooth: true,
symbol: 'circle',
diff --git a/src/components/Charts/mixChart.vue b/src/components/Charts/mixChart.vue
index 05260b9f..6454dd36 100644
--- a/src/components/Charts/mixChart.vue
+++ b/src/components/Charts/mixChart.vue
@@ -46,15 +46,16 @@ export default {
const xData = (function() {
const data = []
for (let i = 1; i < 13; i++) {
- data.push(i + '月份')
+ data.push(i + 'month')
}
return data
}())
this.chart.setOption({
backgroundColor: '#344b58',
title: {
- text: '统计',
- x: '4%',
+ text: 'statistics',
+ x: '20',
+ top: '20',
textStyle: {
color: '#fff',
fontSize: '22'
@@ -81,12 +82,12 @@ export default {
}
},
legend: {
- x: '15%',
+ x: '5%',
top: '10%',
textStyle: {
color: '#90979c'
},
- data: ['女', 'ç”·', 'å¹³å‡']
+ data: ['female', 'male', 'average']
},
calculable: true,
xAxis: [{
@@ -158,9 +159,9 @@ export default {
end: 35
}],
series: [{
- name: '女',
+ name: 'female',
type: 'bar',
- stack: '总é‡',
+ stack: 'total',
barMaxWidth: 35,
barGap: '10%',
itemStyle: {
@@ -195,9 +196,9 @@ export default {
},
{
- name: 'ç”·',
+ name: 'male',
type: 'bar',
- stack: '总é‡',
+ stack: 'total',
itemStyle: {
normal: {
color: 'rgba(0,191,183,1)',
@@ -226,9 +227,9 @@ export default {
220
]
}, {
- name: 'å¹³å‡',
+ name: 'average',
type: 'line',
- stack: '总é‡',
+ stack: 'total',
symbolSize: 10,
symbol: 'circle',
itemStyle: {
diff --git a/src/components/Upload/singleImage3.vue b/src/components/Upload/singleImage3.vue
index 4183b88c..ea63e648 100644
--- a/src/components/Upload/singleImage3.vue
+++ b/src/components/Upload/singleImage3.vue
@@ -7,7 +7,6 @@
</el-upload>
<div class="image-preview image-app-preview">
<div class="image-preview-wrapper" v-show="imageUrl.length>1">
- <div class='app-fake-conver'>  å…¨çƒ ä»˜è´¹èŠ‚ç›®å• æœ€çƒ ç»æµŽ</div>
<img :src="imageUrl">
<div class="image-preview-action">
<i @click="rmImage" class="el-icon-delete"></i>
diff --git a/src/errorLog.js b/src/errorLog.js
index f5aa6644..7f7e492e 100644
--- a/src/errorLog.js
+++ b/src/errorLog.js
@@ -3,7 +3,10 @@ import store from './store'
// you can set only in production env show the error-log
// if (process.env.NODE_ENV === 'production') {
+
Vue.config.errorHandler = function(err, vm, info, a) {
+ // Don't ask me why I use Vue.nextTick, it just a hack.
+ // detail see https://forum.vuejs.org/t/dispatch-in-vue-config-errorhandler-has-some-problem/23500
Vue.nextTick(() => {
store.dispatch('addErrorLog', {
err,
@@ -14,4 +17,5 @@ Vue.config.errorHandler = function(err, vm, info, a) {
console.error(err, info)
})
}
+
// }
diff --git a/src/icons/svg/trendChart1.svg b/src/icons/svg/trendChart1.svg
deleted file mode 100644
index 6297fe8a..00000000
--- a/src/icons/svg/trendChart1.svg
+++ /dev/null
@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1503994155726" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8554" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M44.521739 0h44.521739v979.478261H44.521739zM267.130435 534.26087h44.521739v445.217391H267.130435zM489.73913 311.652174h44.52174v667.826087h-44.52174zM712.347826 712.347826h44.521739v267.130435h-44.521739zM934.956522 445.217391h44.521739v534.26087h-44.521739z" fill="" p-id="8555"></path></svg>
\ No newline at end of file
diff --git a/src/icons/svg/trendChart2.svg b/src/icons/svg/trendChart2.svg
deleted file mode 100644
index 0c08ff08..00000000
--- a/src/icons/svg/trendChart2.svg
+++ /dev/null
@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1503994177895" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8894" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M712.347826 0h44.521739v979.478261h-44.521739zM267.130435 534.26087h44.521739v445.217391H267.130435zM489.73913 311.652174h44.52174v667.826087h-44.52174zM44.521739 712.347826h44.521739v267.130435H44.521739zM934.956522 445.217391h44.521739v534.26087h-44.521739z" fill="" p-id="8895"></path></svg>
\ No newline at end of file
diff --git a/src/icons/svg/trendChart3.svg b/src/icons/svg/trendChart3.svg
deleted file mode 100644
index 17124d90..00000000
--- a/src/icons/svg/trendChart3.svg
+++ /dev/null
@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1503994166937" class="icon" style="" viewBox="0 0 1131 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8786" xmlns:xlink="http://www.w3.org/1999/xlink" width="70.6875" height="64"><defs><style type="text/css"></style></defs><path d="M0 0h53.894737v970.105263H0zM269.473684 431.157895h53.894737v538.947368H269.473684zM538.947368 161.684211h53.894737v808.421052h-53.894737zM808.421053 646.736842h53.894736v323.368421h-53.894736zM1077.894737 323.368421h53.894737v646.736842h-53.894737z" fill="" p-id="8787"></path></svg>
\ No newline at end of file
diff --git a/src/lang/en.js b/src/lang/en.js
index a5e31a96..b243b0a5 100644
--- a/src/lang/en.js
+++ b/src/lang/en.js
@@ -20,7 +20,7 @@ export default {
backToTop: 'BackToTop',
charts: 'Charts',
keyboardChart: 'Keyboard Chart',
- lineChart: 'Line chart',
+ lineChart: 'Line Chart',
mixChart: 'Mix Chart',
example: 'Example',
Table: 'Table',
@@ -45,6 +45,13 @@ export default {
clipboardDemo: 'Clipboard',
i18n: 'I18n'
},
+ navbar: {
+ logOut: 'Log Out',
+ dashboard: 'Dashboard',
+ github: 'Github',
+ screenfull: 'screenfull',
+ theme: 'theme'
+ },
login: {
title: 'Login Form',
logIn: 'Log in',
@@ -52,6 +59,68 @@ export default {
password: 'Password',
any: 'any',
thirdparty: 'Or connect with',
- thirdpartyTips: 'Local can not be simulated, please combine their own business simulation! ! !'
+ thirdpartyTips: 'Can not be simulated on local, so please combine you own business simulation! ! !'
+ },
+ documentation: {
+ documentation: 'Documentation',
+ github: 'Github Repository'
+ },
+ permission: {
+ roles: 'Your roles',
+ switchRoles: 'Switch roles'
+ },
+ components: {
+ documentation: 'Documentation',
+ tinymceTips: 'Rich text editor is a core part of management system, but at the same time is a place with lots of problems. In the process of selecting rich texts, I also walked a lot of detours. The common rich text editors in the market are basically used, and the finally chose Tinymce. See documentation for more detailed rich text editor comparisons and introductions.',
+ dropzoneTips: 'Because my business has special needs, and has to upload images to qiniu, so instead of a third party, I chose encapsulate it by myself. It is very simple, you can see the detail code in @/components/Dropzone.',
+ stickyTips: 'when the page is scrolled to the preset position will be sticky on the top.',
+ backToTopTips1: 'When the page is scrolled to the specified position, the Back to Top button appears in the lower right corner',
+ backToTopTips2: 'You can customize the style of the button, show / hide, height of appearance, height of the return. If you need a text prompt, you can use element-ui el-tooltip elements externally',
+ imageUploadTips: 'Since I was using only the vue@1 version, and it is not compatible with mockjs at the moment, I modified it myself, and if you are going to use it, it is better to use official version.'
+ },
+ table: {
+ dynamicTips1: 'Fixed header, sorted by header order',
+ dynamicTips2: 'Not fixed header, sorted by click order',
+ dragTips1: 'The default order',
+ dragTips2: 'The after dragging order',
+ title: 'Title',
+ importance: 'Imp',
+ type: 'Type',
+ remark: 'Remark',
+ search: 'Search',
+ add: 'Add',
+ export: 'Export',
+ reviewer: 'reviewer',
+ id: 'ID',
+ date: 'Date',
+ author: 'Author',
+ readings: 'Readings',
+ status: 'Status',
+ actions: 'Actions',
+ edit: 'Edit',
+ publish: 'Publish',
+ draft: 'Draft',
+ delete: 'Delete',
+ cancel: 'Cancel',
+ confirm: 'Confirm'
+ },
+ errorLog: {
+ tips: 'Please click the bug icon in the upper right corner',
+ description: 'Now the management system are basically the form of the spa, it enhances the user experience, but it also increases the possibility of page problems, a small negligence may lead to the entire page deadlock. Fortunately Vue provides a way to catch handling exceptions, where you can handle errors or report exceptions.',
+ documentation: 'Document introduction'
+ },
+ excel: {
+ export: 'Export',
+ selectedExport: 'Export selected items',
+ placeholder: 'Please enter the file name(default excel-list)'
+ },
+ zip: {
+ export: 'Export',
+ placeholder: 'Please enter the file name(default file)'
+ },
+ theme: {
+ change: 'Theme change',
+ documentation: 'Theme documentation',
+ tips: 'Tips: It is different from the theme-pick on the navbar is two different skinning methods, each with different application scenarios. Refer to the documentation for details.'
}
}
diff --git a/src/lang/zh.js b/src/lang/zh.js
index 61e3d13b..4dd83533 100644
--- a/src/lang/zh.js
+++ b/src/lang/zh.js
@@ -45,6 +45,13 @@ export default {
clipboardDemo: 'clipboard',
i18n: '国际化'
},
+ navbar: {
+ logOut: '退出登录',
+ dashboard: '首页',
+ github: '项目地å€',
+ screenfull: 'å…¨å±',
+ theme: 'æ¢è‚¤'
+ },
login: {
title: '系统登录',
logIn: '登录',
@@ -53,5 +60,67 @@ export default {
any: 'éšä¾¿å¡«',
thirdparty: '第三方登录',
thirdpartyTips: '本地ä¸èƒ½æ¨¡æ‹Ÿï¼Œè¯·ç»“åˆè‡ªå·±ä¸šåŠ¡è¿›è¡Œæ¨¡æ‹Ÿï¼ï¼ï¼'
+ },
+ documentation: {
+ documentation: '文档',
+ github: 'Github 地å€'
+ },
+ permission: {
+ roles: 'ä½ çš„æƒé™',
+ switchRoles: '切æ¢æƒé™'
+ },
+ components: {
+ documentation: '文档',
+ tinymceTips: '富文本是管ç†åŽå°ä¸€ä¸ªæ ¸å¿ƒçš„功能，但åŒæ—¶åˆæ˜¯ä¸€ä¸ªæœ‰å¾ˆå¤šå‘的地方。在选择富文本的过程ä¸æˆ‘也走了ä¸å°‘的弯路，市é¢ä¸Šå¸¸è§çš„富文本都基本用过了，最终æƒè¡¡äº†ä¸€ä¸‹é€‰æ‹©äº†Tinymce。更详细的富文本比较和介ç»è§',
+ dropzoneTips: '由于我å¸ä¸šåŠ¡æœ‰ç‰¹æ®Šéœ€æ±‚，而且è¦ä¼ 七牛 所以没用第三方，选择了自己å°è£…。代ç éžå¸¸çš„简å•ï¼Œå…·ä½“代ç ä½ å¯ä»¥åœ¨è¿™é‡Œçœ‹åˆ° @/components/Dropzone',
+ stickyTips: '当页é¢æ»šåŠ¨åˆ°é¢„设的ä½ç½®ä¼šå¸é™„在顶部',
+ backToTopTips1: '页é¢æ»šåŠ¨åˆ°æŒ‡å®šä½ç½®ä¼šåœ¨å³ä¸‹è§’出现返回顶部按钮',
+ backToTopTips2: 'å¯è‡ªå®šä¹‰æŒ‰é’®çš„æ ·å¼ã€show/hideã€å‡ºçŽ°çš„高度ã€è¿”回的ä½ç½® 如需文å—æ示，å¯åœ¨å¤–部使用Elementçš„el-tooltipå…ƒç´ ',
+ imageUploadTips: '由于我在使用时它åªæœ‰vue@1版本，而且和mockjsä¸å…¼å®¹ï¼Œæ‰€ä»¥è‡ªå·±æ”¹é€ 了一下，如果大家è¦ä½¿ç”¨çš„è¯ï¼Œä¼˜å…ˆè¿˜æ˜¯ä½¿ç”¨å®˜æ–¹ç‰ˆæœ¬ã€‚'
+ },
+ table: {
+ dynamicTips1: '固定表头, 按照表头顺åºæŽ’åº',
+ dynamicTips2: 'ä¸å›ºå®šè¡¨å¤´, 按照点击顺åºæŽ’åº',
+ dragTips1: '默认顺åº',
+ dragTips2: '拖拽åŽé¡ºåº',
+ title: 'æ ‡é¢˜',
+ importance: 'é‡è¦æ€§',
+ type: '类型',
+ remark: '点评',
+ search: 'æœç´¢',
+ add: 'æ·»åŠ ',
+ export: '导出',
+ reviewer: 'å®¡æ ¸äºº',
+ id: 'åºå·',
+ date: '时间',
+ author: '作者',
+ readings: '阅读数',
+ status: '状æ€',
+ actions: 'æ“作',
+ edit: '编辑',
+ publish: 'å‘布',
+ draft: 'è‰ç¨¿',
+ delete: 'åˆ é™¤',
+ cancel: 'å– æ¶ˆ',
+ confirm: '确 定'
+ },
+ errorLog: {
+ tips: '请点击å³ä¸Šè§’bugå°å›¾æ ‡',
+ description: '现在的管ç†åŽå°åŸºæœ¬éƒ½æ˜¯spaçš„å½¢å¼äº†ï¼Œå®ƒå¢žå¼ºäº†ç”¨æˆ·ä½“验，但åŒæ—¶ä¹Ÿä¼šå¢žåŠ 页é¢å‡ºé—®é¢˜çš„å¯èƒ½æ€§ï¼Œå¯èƒ½ä¸€ä¸ªå°å°çš„ç–忽就导致整个页é¢çš„æ»é”。好在 Vue 官网æ供了一个方法æ¥æ•èŽ·å¤„ç†å¼‚å¸¸ï¼Œä½ å¯ä»¥åœ¨å…¶ä¸è¿›è¡Œé”™è¯¯å¤„ç†æˆ–者异常上报。',
+ documentation: '文档介ç»'
+ },
+ excel: {
+ export: '导出',
+ selectedExport: '导出已选择项',
+ placeholder: '请输入文件å(默认excel-list)'
+ },
+ zip: {
+ export: '导出',
+ placeholder: '请输入文件å(默认file)'
+ },
+ theme: {
+ change: 'æ¢è‚¤',
+ documentation: 'æ¢è‚¤æ–‡æ¡£',
+ tips: 'Tips: 它区别于 navbar 上的 theme-pick, 是两ç§ä¸åŒçš„æ¢è‚¤æ–¹æ³•ï¼Œå„自有ä¸åŒçš„应用场景，具体请å‚考文档。'
}
}
diff --git a/src/main.js b/src/main.js
index 30140400..07cbbe6e 100644
--- a/src/main.js
+++ b/src/main.js
@@ -15,12 +15,12 @@ import i18n from './lang' // Internationalization
import './icons' // icon
import './errorLog'// error log
import './permission' // permission control
-import './mock' // simulation data generator
+import './mock' // simulation data
-import * as filters from './filters' // global filter
+import * as filters from './filters' // global filters
Vue.use(Element, {
- size: 'medium',
+ size: 'medium', // set element-ui default size
i18n: (key, value) => i18n.t(key, value)
})
diff --git a/src/mock/article.js b/src/mock/article.js
index 20dc4e1c..2f5b4583 100644
--- a/src/mock/article.js
+++ b/src/mock/article.js
@@ -8,9 +8,9 @@ for (let i = 0; i < count; i++) {
List.push(Mock.mock({
id: '@increment',
timestamp: +Mock.Random.date('T'),
- author: '@cname',
- auditor: '@cname',
- title: '@ctitle(10, 20)',
+ author: '@first',
+ reviewer: '@first',
+ title: '@title(5, 10)',
forecast: '@float(0, 100, 2, 2)',
importance: '@integer(1, 3)',
'type|1': ['CN', 'US', 'JP', 'EU'],
@@ -43,7 +43,7 @@ export default {
}
},
getPv: () => ({
- pvData: [{ key: 'PC网站', pv: 1024 }, { key: 'mobile网站', pv: 1024 }, { key: 'ios', pv: 1024 }, { key: 'android', pv: 1024 }]
+ pvData: [{ key: 'PC', pv: 1024 }, { key: 'mobile', pv: 1024 }, { key: 'ios', pv: 1024 }, { key: 'android', pv: 1024 }]
}),
getArticle: () => ({
id: 120000000001,
diff --git a/src/permission.js b/src/permission.js
index e470ffb7..e3400588 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -1,21 +1,21 @@
import router from './router'
import store from './store'
-import NProgress from 'nprogress' // Progress 进度æ¡
-import 'nprogress/nprogress.css'// Progress 进度æ¡æ ·å¼
-import { getToken } from '@/utils/auth' // 验æƒ
+import NProgress from 'nprogress' // progress bar
+import 'nprogress/nprogress.css'// progress bar style
+import { getToken } from '@/utils/auth' // getToken from cookie
import { Message } from 'element-ui'
// permissiom judge
function hasPermission(roles, permissionRoles) {
- if (roles.indexOf('admin') >= 0) return true // adminæƒé™ 直接通过
+ if (roles.indexOf('admin') >= 0) return true // admin permission passed directly
if (!permissionRoles) return true
return roles.some(role => permissionRoles.indexOf(role) >= 0)
}
-const whiteList = ['/login', '/authredirect']// ä¸é‡å®šå‘白åå•
+const whiteList = ['/login', '/authredirect']// no redirect whitelist
router.beforeEach((to, from, next) => {
- NProgress.start() // å¼€å¯Progress
+ NProgress.start() // start progress bar
if (getToken()) { // 判æ–是å¦æœ‰token
if (to.path === '/login') {
next({ path: '/' })
@@ -26,11 +26,11 @@ router.beforeEach((to, from, next) => {
const roles = res.data.role
store.dispatch('GenerateRoutes', { roles }).then(() => { // 生æˆå¯è®¿é—®çš„路由表
router.addRoutes(store.getters.addRouters) // 动æ€æ·»åŠ å¯è®¿é—®è·¯ç”±è¡¨
- next({ ...to, replace: true }) // hack方法 ç¡®ä¿addRouteså·²å®Œæˆ ,replace: true so the navigation will not leave a history record
+ next({ ...to, replace: true }) // hack方法 ç¡®ä¿addRouteså·²å®Œæˆ ,set the replace: true so the navigation will not leave a history record
})
}).catch(() => {
store.dispatch('FedLogOut').then(() => {
- Message.error('验è¯å¤±è´¥,请é‡æ–°ç™»å½•')
+ Message.error('Verification failed, please login again')
next({ path: '/login' })
})
})
@@ -56,5 +56,5 @@ router.beforeEach((to, from, next) => {
})
router.afterEach(() => {
- NProgress.done() // 结æŸProgress
+ NProgress.done() // finish progress bar
})
diff --git a/src/router/index.js b/src/router/index.js
index 26c47f4a..221ec7eb 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,6 +9,10 @@ Vue.use(Router)
/* Layout */
import Layout from '../views/layout/Layout'
+/** note: submenu only apppear when children.length>=1
+* detail see https://panjiachen.github.io/vue-element-admin-site/#/router-and-nav?id=sidebar
+**/
+
/**
* hidden: true if `hidden:true` will not show in the sidebar(default is false)
* redirect: noredirect if `redirect:noredirect` will no redirct in the breadcrumb
diff --git a/src/styles/element-ui.scss b/src/styles/element-ui.scss
index 72b03e37..08a7388a 100644
--- a/src/styles/element-ui.scss
+++ b/src/styles/element-ui.scss
@@ -27,6 +27,13 @@
}
}
+ .fixed-width{
+ .el-button--mini{
+ padding: 7px 10px;
+ width: 60px;
+ }
+ }
+
.status-col {
.cell {
padding: 0 10px;
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 5cc936b3..f98127f1 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -102,7 +102,8 @@ code {
margin-bottom: 20px;
display: block;
line-height: 36px;
- font-size: 14px;
+ font-size: 15px;
+ font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
a {
color: #337ab7;
cursor: pointer;
diff --git a/src/utils/clipboard.js b/src/utils/clipboard.js
index 25295900..e916a44d 100644
--- a/src/utils/clipboard.js
+++ b/src/utils/clipboard.js
@@ -3,7 +3,7 @@ import Clipboard from 'clipboard'
function clipboardSuccess() {
Vue.prototype.$message({
- message: 'å¤åˆ¶æˆåŠŸ',
+ message: 'Copy successfully',
type: 'success',
duration: 1500
})
@@ -11,7 +11,7 @@ function clipboardSuccess() {
function clipboardError() {
Vue.prototype.$message({
- message: 'å¤åˆ¶å¤±è´¥',
+ message: 'Copy failed',
type: 'error'
})
}
diff --git a/src/utils/i18n.js b/src/utils/i18n.js
index 6e4ca145..faa52062 100644
--- a/src/utils/i18n.js
+++ b/src/utils/i18n.js
@@ -1,4 +1,4 @@
-// translate router.meta.title , be used in breadcrumb sidebar tagsview
+// translate router.meta.title, be used in breadcrumb sidebar tagsview
export function generateTitle(title) {
- return this.$t('route.' + title) // $t :this method from vue-i18n ,inject in @/lang/index.js
+ return this.$t('route.' + title) // $t :this method from vue-i18n, inject in @/lang/index.js
}
diff --git a/src/utils/request.js b/src/utils/request.js
index ee007f1f..eb70b363 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -3,17 +3,17 @@ import { Message } from 'element-ui'
import store from '@/store'
import { getToken } from '@/utils/auth'
-// 创建axios实例
+// create an axios instance
const service = axios.create({
baseURL: process.env.BASE_API, // apiçš„base_url
- timeout: 5000 // 请求超时时间
+ timeout: 5000 // request timeout
})
-// request拦截器
+// request interceptor
service.interceptors.request.use(config => {
// Do something before request is sent
if (store.getters.token) {
- config.headers['X-Token'] = getToken() // 让æ¯ä¸ªè¯·æ±‚æºå¸¦token--['X-Token']为自定义key è¯·æ ¹æ®å®žé™…情况自行修改
+ config.headers['X-Token'] = getToken() // 让æ¯ä¸ªè¯·æ±‚æºå¸¦token-- ['X-Token']为自定义key è¯·æ ¹æ®å®žé™…情况自行修改
}
return config
}, error => {
@@ -22,7 +22,7 @@ service.interceptors.request.use(config => {
Promise.reject(error)
})
-// respone拦截器
+// respone interceptor
service.interceptors.response.use(
response => response,
/**
diff --git a/src/views/charts/keyboard.vue b/src/views/charts/keyboard.vue
index 4001811e..30ed5762 100644
--- a/src/views/charts/keyboard.vue
+++ b/src/views/charts/keyboard.vue
@@ -1,8 +1,6 @@
<template>
- <div class="components-container" style='height:100vh'>
- <div class='chart-container'>
- <chart height='100%' width='100%'></chart>
- </div>
+ <div class='chart-container'>
+ <chart height='100%' width='100%'></chart>
</div>
</template>
@@ -18,8 +16,9 @@ export default {
<style scoped>
.chart-container{
position: relative;
+ padding: 20px;
width: 100%;
- height: 90%;
+ height: 85vh;
}
</style>
diff --git a/src/views/charts/line.vue b/src/views/charts/line.vue
index 6d62e52f..c45c3813 100644
--- a/src/views/charts/line.vue
+++ b/src/views/charts/line.vue
@@ -1,8 +1,6 @@
<template>
- <div class="components-container" style='height:100vh'>
- <div class='chart-container'>
- <chart height='100%' width='100%'></chart>
- </div>
+ <div class='chart-container'>
+ <chart height='100%' width='100%'></chart>
</div>
</template>
@@ -18,8 +16,9 @@ export default {
<style scoped>
.chart-container{
position: relative;
+ padding:20px;
width: 100%;
- height: 80%;
+ height:85vh;
}
</style>
diff --git a/src/views/charts/mixChart.vue b/src/views/charts/mixChart.vue
index 387e2e18..1ca476e6 100644
--- a/src/views/charts/mixChart.vue
+++ b/src/views/charts/mixChart.vue
@@ -1,8 +1,6 @@
<template>
- <div class="components-container" style='height:100vh'>
- <div class='chart-container'>
- <chart height='100%' width='100%'></chart>
- </div>
+ <div class='chart-container'>
+ <chart height='100%' width='100%'></chart>
</div>
</template>
@@ -18,9 +16,9 @@ export default {
<style scoped>
.chart-container{
position: relative;
+ padding: 20px;
width: 100%;
- height: 90%;
- padding-bottom: 40px;
+ height:85vh;
}
</style>
diff --git a/src/views/clipboard/index.vue b/src/views/clipboard/index.vue
index dfc4a98c..83945235 100644
--- a/src/views/clipboard/index.vue
+++ b/src/views/clipboard/index.vue
@@ -2,11 +2,11 @@
<div class="app-container">
<el-tabs v-model="activeName">
<el-tab-pane label="use clipboard directly" name="directly">
- <el-input v-model="inputData" placeholder="请输入内容" style='width:400px;'></el-input>
+ <el-input v-model="inputData" placeholder="Please input" style='width:400px;'></el-input>
<el-button type="primary" icon="document" @click='handleCopy(inputData,$event)'>copy</el-button>
</el-tab-pane>
<el-tab-pane label="use clipboard by v-directive" name="v-directive">
- <el-input v-model="inputData" placeholder="请输入内容" style='width:400px;'></el-input>
+ <el-input v-model="inputData" placeholder="Please input" style='width:400px;'></el-input>
<el-button type="primary" icon="document" v-clipboard:copy='inputData' v-clipboard:success='clipboardSuccess'>copy</el-button>
</el-tab-pane>
</el-tabs>
diff --git a/src/views/components-demo/avatarUpload.vue b/src/views/components-demo/avatarUpload.vue
index 9a98ae21..f993a4f6 100644
--- a/src/views/components-demo/avatarUpload.vue
+++ b/src/views/components-demo/avatarUpload.vue
@@ -1,16 +1,16 @@
<template>
<div class="components-container">
- <code>è¿™é‡Œæ ¸å¿ƒä»£ç 用的是
- <a class="link-type" href="//github.com/dai-siki/vue-image-crop-upload"> vue-image-crop-upload</a>
- 由于我在使用时它åªæœ‰vue@1版本，而且有些业务的需求耦åˆåˆ°ä¸ƒç‰›ç‰ç‰åŽŸå› å§ï¼Œè‡ªå·±æ”¹é€ 了一下，如果大家è¦ä½¿ç”¨çš„è¯ï¼Œä¼˜å…ˆè¿˜æ˜¯ä½¿ç”¨å®˜æ–¹component
+ <code>This is based on
+ <a class="link-type" href="//github.com/dai-siki/vue-image-crop-upload"> vue-image-crop-upload</a>.
+ {{$t('components.imageUploadTips')}}
</code>
<pan-thumb :image="image"></pan-thumb>
- <el-button type="primary" icon="upload" style="position: absolute;bottom: 15px;margin-left: 40px;" @click="imagecropperShow=true">修改头åƒ
+ <el-button type="primary" icon="upload" style="position: absolute;bottom: 15px;margin-left: 40px;" @click="imagecropperShow=true">Change avatar
</el-button>
- <image-cropper :width="300" :height="300" url="https://httpbin.org/post" @close='close' @crop-upload-success="cropSuccess"
+ <image-cropper :width="300" :height="300" url="https://httpbin.org/post" @close='close' @crop-upload-success="cropSuccess" langType="en"
:key="imagecropperKey" v-show="imagecropperShow"></image-cropper>
</div>
</template>
diff --git a/src/views/components-demo/backToTop.vue b/src/views/components-demo/backToTop.vue
index 51d7879e..6abb652a 100644
--- a/src/views/components-demo/backToTop.vue
+++ b/src/views/components-demo/backToTop.vue
@@ -1,134 +1,121 @@
<template>
<div class="components-container">
- <code>页é¢æ»šåŠ¨åˆ°æŒ‡å®šä½ç½®ä¼šåœ¨å³ä¸‹è§’出现返回顶部按钮</code>
- <code>å¯è‡ªå®šä¹‰æŒ‰é’®çš„æ ·å¼ã€show/hide临界点ã€è¿”回的ä½ç½® 如需文å—æ示，å¯åœ¨å¤–部使用Elementçš„el-tooltipå…ƒç´ </code>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
+ <code>{{$t('components.backToTopTips1')}}</code>
+ <code>{{$t('components.backToTopTips2')}}</code>
+ <div class="placeholder-container">
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ </div>
<!--å¯è‡ªå®šä¹‰æŒ‰é’®çš„æ ·å¼ã€show/hide临界点ã€è¿”回的ä½ç½® -->
<!--如需文å—æ示，å¯åœ¨å¤–éƒ¨æ·»åŠ elementçš„<el-tooltip></el-tooltip>å…ƒç´ -->
- <el-tooltip placement="top" content="æ–‡å—æ示">
+ <el-tooltip placement="top" content="tooltip">
<back-to-top transitionName="fade" :customStyle="myBackToTopStyle" :visibilityHeight="300" :backPosition="50"></back-to-top>
</el-tooltip>
</div>
@@ -148,10 +135,16 @@ export default {
width: '40px',
height: '40px',
'border-radius': '4px',
- 'line-height': '45px', // 请ä¿æŒä¸Žé«˜åº¦ä¸€è‡´ä»¥åž‚ç›´å±…ä¸
- background: '#e7eaf1'// 按钮的背景颜色
+ 'line-height': '45px', // 请ä¿æŒä¸Žé«˜åº¦ä¸€è‡´ä»¥åž‚ç›´å±…ä¸ Please keep consistent with height to center vertically
+ background: '#e7eaf1'// 按钮的背景颜色 The background color of the button
}
}
}
}
- </script>
+</script>
+
+<style scoped>
+.placeholder-container div {
+ margin: 10px;
+}
+</style>
diff --git a/src/views/components-demo/dndList.vue b/src/views/components-demo/dndList.vue
index e929a3fb..b9779a31 100644
--- a/src/views/components-demo/dndList.vue
+++ b/src/views/components-demo/dndList.vue
@@ -4,7 +4,7 @@
<a href="https://github.com/SortableJS/Vue.Draggable" target="_blank">Vue.Draggable</a>
</code>
<div class="editor-container">
- <dnd-list :list1="list1" :list2="list2" list1Title="头æ¡åˆ—表" list2Title="æ–‡ç« æ± "></dnd-list>
+ <dnd-list :list1="list1" :list2="list2" list1Title="List" list2Title="Article pool"></dnd-list>
</div>
</div>
</template>
diff --git a/src/views/components-demo/dropzone.vue b/src/views/components-demo/dropzone.vue
index 6af6ae2e..a31a702b 100644
--- a/src/views/components-demo/dropzone.vue
+++ b/src/views/components-demo/dropzone.vue
@@ -1,8 +1,8 @@
<template>
<div class="components-container">
<code>
- 基于<a class="link-type" href="https://github.com/rowanwins/vue-dropzone"> dropzone </a>å°è£… ,
- 由于我å¸ä¸šåŠ¡æœ‰ç‰¹æ®Šéœ€æ±‚，而且è¦ä¼ 七牛 所以没用第三方 选择了自己å°è£…
+ Based on <a class="link-type" href="https://github.com/rowanwins/vue-dropzone"> dropzone </a>.
+ {{$t('components.dropzoneTips')}}
</code>
<div class="editor-container">
<dropzone v-on:dropzone-removedFile="dropzoneR" v-on:dropzone-success="dropzoneS" id="myVueDropzone" url="https://httpbin.org/post"></dropzone>
@@ -19,11 +19,11 @@ export default {
methods: {
dropzoneS(file) {
console.log(file)
- this.$message({ message: 'ä¸Šä¼ æˆåŠŸ', type: 'success' })
+ this.$message({ message: 'Upload success', type: 'success' })
},
dropzoneR(file) {
console.log(file)
- this.$message({ message: 'åˆ é™¤æˆåŠŸ', type: 'success' })
+ this.$message({ message: 'Delete success', type: 'success' })
}
}
}
diff --git a/src/views/components-demo/markdown.vue b/src/views/components-demo/markdown.vue
index afd07c6c..61a3b51f 100644
--- a/src/views/components-demo/markdown.vue
+++ b/src/views/components-demo/markdown.vue
@@ -1,14 +1,14 @@
<template>
<div class="components-container">
- <code>Markdown 我们这里选用了
- <a href="https://github.com/sparksuite/simplemde-markdown-editor" target="_blank">simplemde-markdown-editor</a> ，简å•çš„用vueå°è£…了一下
+ <code>Markdown is based on
+ <a href="https://github.com/sparksuite/simplemde-markdown-editor" target="_blank">simplemde-markdown-editor</a> ，Simply encapsulated in Vue.
<a target="_blank" href="https://segmentfault.com/a/1190000009762198#articleHeader14">
ç›¸å…³æ–‡ç« </a>
</code>
<div class="editor-container">
<markdown-editor id="contentEditor" ref="contentEditor" v-model="content" :height="300" :zIndex="20"></markdown-editor>
</div>
- <el-button @click="markdown2Html" style="margin-top:80px;" type="primary" icon="el-icon-document">转为HTML</el-button>
+ <el-button @click="markdown2Html" style="margin-top:80px;" type="primary" icon="el-icon-document">To HTML</el-button>
<div v-html="html"></div>
</div>
</template>
diff --git a/src/views/components-demo/splitpane.vue b/src/views/components-demo/splitpane.vue
index fa3f14a4..d870197e 100644
--- a/src/views/components-demo/splitpane.vue
+++ b/src/views/components-demo/splitpane.vue
@@ -1,9 +1,9 @@
<template>
<div class="components-container">
- <code>splitPane å¦‚æžœä½ ç”¨è¿‡
+ <code><strong>SplitPane</strong> If you've used
<a href="http://codepen.io/" target="_blank"> codepen</a>,
- <a href="https://jsfiddle.net/" target="_blank"> jsfiddle </a>å°±ä¸ä¼šé™Œç”Ÿäº†
- <a href="https://github.com/PanJiaChen/vue-split-pane" target='_blank'>项目地å€</a>
+ <a href="https://jsfiddle.net/" target="_blank"> jsfiddle </a>will not be unfamiliar.
+ <a href="https://github.com/PanJiaChen/vue-split-pane" target='_blank'> Github repository</a>
</code>
<split-pane v-on:resize="resize" split="vertical">
<template slot="paneL">
diff --git a/src/views/components-demo/sticky.vue b/src/views/components-demo/sticky.vue
index 014d71fa..49772bea 100644
--- a/src/views/components-demo/sticky.vue
+++ b/src/views/components-demo/sticky.vue
@@ -2,8 +2,8 @@
<div>
<sticky className="sub-navbar">
<el-dropdown trigger="click">
- <el-button>
- å¹³å°<i class="el-icon-caret-bottom el-icon--right"></i>
+ <el-button plain>
+ Platform<i class="el-icon-caret-bottom el-icon--right"></i>
</el-button>
<el-dropdown-menu class="no-border" slot="dropdown">
<el-checkbox-group v-model="platforms" style="padding: 5px 15px;">
@@ -15,79 +15,79 @@
</el-dropdown>
<el-dropdown trigger="click">
- <el-button>
- 外链<i class="el-icon-caret-bottom el-icon--right"></i>
+ <el-button plain>
+ Link<i class="el-icon-caret-bottom el-icon--right"></i>
</el-button>
<el-dropdown-menu class="no-padding no-border" style="width:300px" slot="dropdown">
- <el-input placeholder="请输入内容" v-model="url">
- <template slot="prepend">填写url</template>
+ <el-input placeholder="Please enter the content" v-model="url">
+ <template slot="prepend">Url</template>
</el-input>
</el-dropdown-menu>
</el-dropdown>
<div class="time-container">
- <el-date-picker v-model="time" type="datetime" :picker-options="pickerOptions" format="yyyy-MM-dd HH:mm:ss" placeholder="å‘布时间">
+ <el-date-picker v-model="time" type="datetime" :picker-options="pickerOptions" format="yyyy-MM-dd HH:mm:ss" placeholder="Release time">
</el-date-picker>
</div>
- <el-button style="margin-left: 10px;" type="success">å‘布
+ <el-button style="margin-left: 10px;" type="success">publish
</el-button>
</sticky>
<div class="components-container">
- <code>Sticky header 当页é¢æ»šåŠ¨åˆ°é¢„设的ä½ç½®ä¼šå¸é™„在顶部</code>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
- <div>我是å ä½</div>
+ <code>Sticky header, {{$t('components.stickyTips')}}</code>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
+ <div>placeholder</div>
</div>
</div>
</template>
@@ -105,9 +105,9 @@ export default {
url: '',
platforms: ['a-platform'],
platformsOptions: [
- { key: 'a-platform', name: 'å¹³å°A' },
- { key: 'b-platform', name: 'å¹³å°B' },
- { key: 'c-platform', name: 'å¹³å°C' }
+ { key: 'a-platform', name: 'platformA' },
+ { key: 'b-platform', name: 'platformB' },
+ { key: 'c-platform', name: 'platformC' }
],
pickerOptions: {
disabledDate(time) {
@@ -120,8 +120,11 @@ export default {
</script>
<style scoped>
- .time-container {
- display: inline-block;
- }
-</style>
+.components-container div {
+ margin: 10px;
+}
+.time-container {
+ display: inline-block;
+}
+</style>
diff --git a/src/views/components-demo/tinymce.vue b/src/views/components-demo/tinymce.vue
index d8a85c3b..284660c4 100644
--- a/src/views/components-demo/tinymce.vue
+++ b/src/views/components-demo/tinymce.vue
@@ -1,10 +1,11 @@
<template>
<div class="components-container">
- <code>å…¬å¸åšçš„åŽå°ä¸»è¦æ˜¯ä¸€ä¸ªcms系统，公å¸ä¹Ÿæ˜¯ä»¥è‡ªåª’ä½“ä¸ºæ ¸å¿ƒçš„ï¼Œæ‰€ä»¥å¯Œæ–‡æœ¬æ˜¯åŽå°å¾ˆæ ¸å¿ƒçš„功能。在选择富文本的过程ä¸ä¹Ÿèµ°äº†ä¸å°‘的弯路，市é¢ä¸Šå¸¸è§çš„富文本都基本用过了，最终选择了Tinymce
- <a target="_blank" class="link-type" href="https://panjiachen.github.io/vue-element-admin-site/#/rich-editor">文档介ç»</a>
+ <code>
+ {{$t('components.tinymceTips')}}
+ <a target="_blank" class="link-type" href="https://panjiachen.github.io/vue-element-admin-site/#/rich-editor"> {{$t('components.documentation')}}</a>
</code>
<div>
- <tinymce :height="200" v-model="content"></tinymce>
+ <tinymce :height="300" v-model="content"></tinymce>
</div>
<div class="editor-content" v-html="content"></div>
</div>
@@ -18,7 +19,14 @@ export default {
components: { Tinymce },
data() {
return {
- content: 'Tinymce'
+ content:
+ `<h1 style="text-align: center;">Welcome to the TinyMCE demo!</h1>
+ <ul>
+ <li>Our <a href="//www.tinymce.com/docs/">documentation</a> is a great resource for learning how to configure TinyMCE.</li>
+ <li>Have a specific question? Visit the <a href="https://community.tinymce.com/forum/">Community Forum</a>.</li>
+ <li>We also offer enterprise grade support as part of <a href="https://tinymce.com/pricing">TinyMCE premium subscriptions</a>.</li>
+ </ul>
+ `
}
}
}
diff --git a/src/views/dashboard/admin/components/BarChart.vue b/src/views/dashboard/admin/components/BarChart.vue
index 78e71a93..e0606b2d 100644
--- a/src/views/dashboard/admin/components/BarChart.vue
+++ b/src/views/dashboard/admin/components/BarChart.vue
@@ -4,7 +4,7 @@
<script>
import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts 主题
+require('echarts/theme/macarons') // echarts theme
import { debounce } from '@/utils'
const animationDuration = 6000
diff --git a/src/views/dashboard/admin/components/LineChart.vue b/src/views/dashboard/admin/components/LineChart.vue
index df96887b..9be9c92d 100644
--- a/src/views/dashboard/admin/components/LineChart.vue
+++ b/src/views/dashboard/admin/components/LineChart.vue
@@ -4,7 +4,7 @@
<script>
import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts 主题
+require('echarts/theme/macarons') // echarts theme
import { debounce } from '@/utils'
export default {
diff --git a/src/views/dashboard/admin/components/PanelGroup.vue b/src/views/dashboard/admin/components/PanelGroup.vue
index e1b2cdf1..8b7394a1 100644
--- a/src/views/dashboard/admin/components/PanelGroup.vue
+++ b/src/views/dashboard/admin/components/PanelGroup.vue
@@ -7,7 +7,7 @@
</div>
<div class="card-panel-description">
<div class="card-panel-text">New Visits</div>
- <count-to class="card-panel-num" :startVal="0" :endVal="102400" :duration="3600"></count-to>
+ <count-to class="card-panel-num" :startVal="0" :endVal="102400" :duration="2600"></count-to>
</div>
</div>
</el-col>
@@ -18,7 +18,7 @@
</div>
<div class="card-panel-description">
<div class="card-panel-text">Messages</div>
- <count-to class="card-panel-num" :startVal="0" :endVal="81212" :duration="4000"></count-to>
+ <count-to class="card-panel-num" :startVal="0" :endVal="81212" :duration="3000"></count-to>
</div>
</div>
</el-col>
@@ -29,7 +29,7 @@
</div>
<div class="card-panel-description">
<div class="card-panel-text">Purchases</div>
- <count-to class="card-panel-num" :startVal="0" :endVal="9280" :duration="4000"></count-to>
+ <count-to class="card-panel-num" :startVal="0" :endVal="9280" :duration="3200"></count-to>
</div>
</div>
</el-col>
@@ -40,7 +40,7 @@
</div>
<div class="card-panel-description">
<div class="card-panel-text">Shoppings</div>
- <count-to class="card-panel-num" :startVal="0" :endVal="13600" :duration="4600"></count-to>
+ <count-to class="card-panel-num" :startVal="0" :endVal="13600" :duration="3600"></count-to>
</div>
</div>
</el-col>
diff --git a/src/views/dashboard/admin/components/PieChart.vue b/src/views/dashboard/admin/components/PieChart.vue
index 36a11227..773b5f47 100644
--- a/src/views/dashboard/admin/components/PieChart.vue
+++ b/src/views/dashboard/admin/components/PieChart.vue
@@ -4,7 +4,7 @@
<script>
import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts 主题
+require('echarts/theme/macarons') // echarts theme
import { debounce } from '@/utils'
export default {
diff --git a/src/views/dashboard/admin/components/RaddarChart.vue b/src/views/dashboard/admin/components/RaddarChart.vue
index 017b9748..f7d3bf36 100644
--- a/src/views/dashboard/admin/components/RaddarChart.vue
+++ b/src/views/dashboard/admin/components/RaddarChart.vue
@@ -4,7 +4,7 @@
<script>
import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts 主题
+require('echarts/theme/macarons') // echarts theme
import { debounce } from '@/utils'
const animationDuration = 3000
diff --git a/src/views/dashboard/admin/components/TransactionTable.vue b/src/views/dashboard/admin/components/TransactionTable.vue
index 5f53557c..90f4a914 100644
--- a/src/views/dashboard/admin/components/TransactionTable.vue
+++ b/src/views/dashboard/admin/components/TransactionTable.vue
@@ -44,7 +44,7 @@ export default {
fetchList().then(response => {
this.list = response.data.items.slice(0, 7)
})
- } }
-
+ }
+ }
}
</script>
diff --git a/src/views/dashboard/editor/index.vue b/src/views/dashboard/editor/index.vue
index 531c8067..ae1f7995 100644
--- a/src/views/dashboard/editor/index.vue
+++ b/src/views/dashboard/editor/index.vue
@@ -1,13 +1,13 @@
<template>
<div class="dashboard-editor-container">
<div class=" clearfix">
- <pan-thumb style="float: left" :image="avatar"> ä½ çš„æƒé™:
+ <pan-thumb style="float: left" :image="avatar"> Your roles:
<span class="pan-info-roles" :key='item' v-for="item in roles">{{item}}</span>
</pan-thumb>
<github-corner></github-corner>
<div class="info-container">
<span class="display_name">{{name}}</span>
- <span style="font-size:20px;padding-top:20px;display:inline-block;">普通编辑dashboard</span>
+ <span style="font-size:20px;padding-top:20px;display:inline-block;">editor : dashboard</span>
</div>
</div>
<div>
diff --git a/src/views/documentation/index.vue b/src/views/documentation/index.vue
index 89e1c934..d8381592 100644
--- a/src/views/documentation/index.vue
+++ b/src/views/documentation/index.vue
@@ -1,16 +1,15 @@
<template>
<div class="app-container documentation-container">
- <a class="document-btn" target='_blank' href="https://panjiachen.github.io/vue-element-admin-site/#/">文档</a>
- <a class="document-btn" target='_blank' href="https://github.com/PanJiaChen/vue-element-admin/">Github 地å€</a>
+ <a class="document-btn" target='_blank' href="https://panjiachen.github.io/vue-element-admin-site/#/">{{$t('documentation.documentation')}}</a>
+ <a class="document-btn" target='_blank' href="https://github.com/PanJiaChen/vue-element-admin/">{{$t('documentation.github')}}</a>
<dropdown-menu style="float:left;margin-left:50px;" title='ç³»åˆ—æ–‡ç« ' :items='articleList'></dropdown-menu>
</div>
</template>
-
<script>
import DropdownMenu from '@/components/Share/dropdownMenu'
export default {
- name: 'clipboardDemo',
+ name: 'documentation',
components: { DropdownMenu },
data() {
return {
diff --git a/src/views/errorLog/index.vue b/src/views/errorLog/index.vue
index 21f4817d..f94b2282 100644
--- a/src/views/errorLog/index.vue
+++ b/src/views/errorLog/index.vue
@@ -2,11 +2,13 @@
<div class="errPage-container">
<errorA></errorA>
<errorB></errorB>
-
- <h3>请点击å³ä¸Šè§’bugå°å›¾è¡¨</h3>
+ <!-- $t is vue-i18n global function to translate lang -->
+ <h3>{{$t('errorLog.tips')}}</h3>
<code>
- 现在的管ç†åŽå°åŸºæœ¬éƒ½æ˜¯spaçš„å½¢å¼äº†ï¼Œå®ƒå¢žå¼ºäº†ç”¨æˆ·ä½“验，但åŒæ—¶ä¹Ÿä¼šå¢žåŠ 页é¢å‡ºé—®é¢˜çš„å¯èƒ½æ€§ï¼Œå¯èƒ½ä¸€ä¸ªå°å°çš„ç–忽就导致整个页é¢çš„æ»é”。好在 Vue 官网æ供了一个方法æ¥æ•èŽ·å¤„ç†å¼‚常.
- <a target="_blank" class="link-type" href="https://panjiachen.github.io/vue-element-admin-site/#/error?id=%e4%bb%a3%e7%a0%81">文档介ç»</a>
+ {{$t('errorLog.description')}}
+ <a target="_blank" class="link-type" href="https://panjiachen.github.io/vue-element-admin-site/#/error?id=%e4%bb%a3%e7%a0%81">
+ {{$t('errorLog.documentation')}}
+ </a>
</code>
<a href="#">
<img src='https://wpimg.wallstcn.com/360e4842-4db5-42d0-b078-f9a84a825546.gif'>
diff --git a/src/views/example/tab/components/tabPane.vue b/src/views/example/tab/components/tabPane.vue
index 1052d609..5d11d33b 100644
--- a/src/views/example/tab/components/tabPane.vue
+++ b/src/views/example/tab/components/tabPane.vue
@@ -1,45 +1,45 @@
<template>
- <el-table :data="list"border fit highlight-current-row style="width: 100%">
+ <el-table :data="list" border fit highlight-current-row style="width: 100%">
- <el-table-column align="center" label="åºå·" width="65" v-loading="loading"
+ <el-table-column align="center" label="ID" width="65" v-loading="loading"
element-loading-text="请给我点时间ï¼">
<template slot-scope="scope">
<span>{{scope.row.id}}</span>
</template>
</el-table-column>
- <el-table-column width="180px" align="center" label="时间">
+ <el-table-column width="180px" align="center" label="Date">
<template slot-scope="scope">
<span>{{scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}')}}</span>
</template>
</el-table-column>
- <el-table-column min-width="300px" label="æ ‡é¢˜">
+ <el-table-column min-width="300px" label="Title">
<template slot-scope="scope">
<span>{{scope.row.title}}</span>
<el-tag>{{scope.row.type}}</el-tag>
</template>
</el-table-column>
- <el-table-column width="110px" align="center" label="作者">
+ <el-table-column width="110px" align="center" label="Author">
<template slot-scope="scope">
<span>{{scope.row.author}}</span>
</template>
</el-table-column>
- <el-table-column width="80px" label="é‡è¦æ€§">
+ <el-table-column width="120px" label="Importance">
<template slot-scope="scope">
<svg-icon v-for="n in +scope.row.importance" icon-class="star" :key="n"></svg-icon>
</template>
</el-table-column>
- <el-table-column align="center" label="阅读数" width="95">
+ <el-table-column align="center" label="Readings" width="95">
<template slot-scope="scope">
<span>{{scope.row.pageviews}}</span>
</template>
</el-table-column>
- <el-table-column class-name="status-col" label="状æ€" width="110">
+ <el-table-column class-name="status-col" label="Status" width="110">
<template slot-scope="scope">
<el-tag :type="scope.row.status | statusFilter">{{scope.row.status}}</el-tag>
</template>
diff --git a/src/views/example/tab/index.vue b/src/views/example/tab/index.vue
index 3e6a601f..2a3239a3 100644
--- a/src/views/example/tab/index.vue
+++ b/src/views/example/tab/index.vue
@@ -20,10 +20,10 @@ export default {
data() {
return {
tabMapOptions: [
- { label: 'ä¸å›½', key: 'CN' },
- { label: '美国', key: 'US' },
- { label: '日本', key: 'JP' },
- { label: '欧元区', key: 'EU' }
+ { label: 'China', key: 'CN' },
+ { label: 'USA', key: 'US' },
+ { label: 'Japan', key: 'JP' },
+ { label: 'Eurozone', key: 'EU' }
],
activeName: 'CN',
createdTimes: 0
diff --git a/src/views/example/table/complexTable.vue b/src/views/example/table/complexTable.vue
index 98bc6b1f..b96b8f9c 100644
--- a/src/views/example/table/complexTable.vue
+++ b/src/views/example/table/complexTable.vue
@@ -1,78 +1,78 @@
<template>
<div class="app-container calendar-list-container">
<div class="filter-container">
- <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item" placeholder="æ ‡é¢˜" v-model="listQuery.title">
+ <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item" :placeholder="$t('table.title')" v-model="listQuery.title">
</el-input>
- <el-select clearable style="width: 90px" class="filter-item" v-model="listQuery.importance" placeholder="é‡è¦æ€§">
+ <el-select clearable style="width: 90px" class="filter-item" v-model="listQuery.importance" :placeholder="$t('table.importance')">
<el-option v-for="item in importanceOptions" :key="item" :label="item" :value="item">
</el-option>
</el-select>
- <el-select clearable class="filter-item" style="width: 130px" v-model="listQuery.type" placeholder="类型">
+ <el-select clearable class="filter-item" style="width: 130px" v-model="listQuery.type" :placeholder="$t('table.type')">
<el-option v-for="item in calendarTypeOptions" :key="item.key" :label="item.display_name+'('+item.key+')'" :value="item.key">
</el-option>
</el-select>
- <el-select @change='handleFilter' style="width: 120px" class="filter-item" v-model="listQuery.sort" placeholder="排åº">
+ <el-select @change='handleFilter' style="width: 140px" class="filter-item" v-model="listQuery.sort">
<el-option v-for="item in sortOptions" :key="item.key" :label="item.label" :value="item.key">
</el-option>
</el-select>
- <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">æœç´¢</el-button>
- <el-button class="filter-item" style="margin-left: 10px;" @click="handleCreate" type="primary" icon="el-icon-edit">æ·»åŠ </el-button>
- <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
- <el-checkbox class="filter-item" style='margin-left:15px;' @change='tableKey=tableKey+1' v-model="showAuditor">æ˜¾ç¤ºå®¡æ ¸äºº</el-checkbox>
+ <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">{{$t('table.search')}}</el-button>
+ <el-button class="filter-item" style="margin-left: 10px;" @click="handleCreate" type="primary" icon="el-icon-edit">{{$t('table.add')}}</el-button>
+ <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">{{$t('table.export')}}</el-button>
+ <el-checkbox class="filter-item" style='margin-left:15px;' @change='tableKey=tableKey+1' v-model="showReviewer">{{$t('table.reviewer')}}</el-checkbox>
</div>
<el-table :key='tableKey' :data="list" v-loading="listLoading" element-loading-text="给我一点时间" border fit highlight-current-row
style="width: 100%">
- <el-table-column align="center" label="åºå·" width="65">
+ <el-table-column align="center" :label="$t('table.id')" width="65">
<template slot-scope="scope">
<span>{{scope.row.id}}</span>
</template>
</el-table-column>
- <el-table-column width="180px" align="center" label="时间">
+ <el-table-column width="150px" align="center" :label="$t('table.date')">
<template slot-scope="scope">
<span>{{scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}')}}</span>
</template>
</el-table-column>
- <el-table-column min-width="150px" label="æ ‡é¢˜">
+ <el-table-column min-width="150px" :label="$t('table.title')">
<template slot-scope="scope">
<span class="link-type" @click="handleUpdate(scope.row)">{{scope.row.title}}</span>
<el-tag>{{scope.row.type | typeFilter}}</el-tag>
</template>
</el-table-column>
- <el-table-column width="110px" align="center" label="作者">
+ <el-table-column width="110px" align="center" :label="$t('table.author')">
<template slot-scope="scope">
<span>{{scope.row.author}}</span>
</template>
</el-table-column>
- <el-table-column width="110px" v-if='showAuditor' align="center" label="å®¡æ ¸äºº">
+ <el-table-column width="110px" v-if='showReviewer' align="center" :label="$t('table.reviewer')">
<template slot-scope="scope">
- <span style='color:red;'>{{scope.row.auditor}}</span>
+ <span style='color:red;'>{{scope.row.reviewer}}</span>
</template>
</el-table-column>
- <el-table-column width="80px" label="é‡è¦æ€§">
+ <el-table-column width="80px" :label="$t('table.importance')">
<template slot-scope="scope">
<svg-icon v-for="n in +scope.row.importance" icon-class="star" class="meta-item__icon" :key="n"></svg-icon>
</template>
</el-table-column>
- <el-table-column align="center" label="阅读数" width="95">
+ <el-table-column align="center" :label="$t('table.readings')" width="95">
<template slot-scope="scope">
<span v-if="scope.row.pageviews" class="link-type" @click='handleFetchPv(scope.row.pageviews)'>{{scope.row.pageviews}}</span>
- <span v-else>æ— </span>
+ <span v-else>0</span>
</template>
</el-table-column>
- <el-table-column class-name="status-col" label="状æ€" width="100">
+ <el-table-column class-name="status-col" :label="$t('table.status')" width="100">
<template slot-scope="scope">
<el-tag :type="scope.row.status | statusFilter">{{scope.row.status}}</el-tag>
</template>
</el-table-column>
- <el-table-column align="center" label="æ“作" width="220" class-name="small-padding">
+ <el-table-column align="center" :label="$t('table.actions')" width="230" class-name="small-padding fixed-width">
<template slot-scope="scope">
- <el-button type="primary" size="mini" @click="handleUpdate(scope.row)">编辑</el-button>
- <el-button v-if="scope.row.status!='published'" size="mini" type="success" @click="handleModifyStatus(scope.row,'published')">å‘布
+ <el-button type="primary" size="mini" @click="handleUpdate(scope.row)">{{$t('table.edit')}}</el-button>
+ <el-button v-if="scope.row.status!='published'" size="mini" type="success" @click="handleModifyStatus(scope.row,'published')">{{$t('table.publish')}}
</el-button>
- <el-button v-if="scope.row.status!='draft'" size="mini" @click="handleModifyStatus(scope.row,'draft')">è‰ç¨¿
+ <el-button v-if="scope.row.status!='draft'" size="mini" @click="handleModifyStatus(scope.row,'draft')">{{$t('table.draft')}}
</el-button>
- <el-button v-if="scope.row.status!='deleted'" size="mini" type="danger" @click="handleModifyStatus(scope.row,'deleted')">åˆ é™¤
+ <el-button v-if="scope.row.status!='deleted'" size="mini" type="danger" @click="handleModifyStatus(scope.row,'deleted')">{{$t('table.delete')}}
</el-button>
</template>
</el-table-column>
@@ -86,47 +86,47 @@
<el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
<el-form :rules="rules" ref="dataForm" :model="temp" label-position="left" label-width="70px" style='width: 400px; margin-left:50px;'>
- <el-form-item label="类型" prop="type">
- <el-select class="filter-item" v-model="temp.type" placeholder="请选择">
+ <el-form-item :label="$t('table.type')" prop="type">
+ <el-select class="filter-item" v-model="temp.type" placeholder="Please select">
<el-option v-for="item in calendarTypeOptions" :key="item.key" :label="item.display_name" :value="item.key">
</el-option>
</el-select>
</el-form-item>
- <el-form-item label="时间" prop="timestamp">
- <el-date-picker v-model="temp.timestamp" type="datetime" placeholder="选择日期时间">
+ <el-form-item :label="$t('table.date')" prop="timestamp">
+ <el-date-picker v-model="temp.timestamp" type="datetime" placeholder="Please pick a date">
</el-date-picker>
</el-form-item>
- <el-form-item label="æ ‡é¢˜" prop="title">
+ <el-form-item :label="$t('table.title')" prop="title">
<el-input v-model="temp.title"></el-input>
</el-form-item>
- <el-form-item label="状æ€">
- <el-select class="filter-item" v-model="temp.status" placeholder="请选择">
+ <el-form-item :label="$t('table.status')">
+ <el-select class="filter-item" v-model="temp.status" placeholder="Please select">
<el-option v-for="item in statusOptions" :key="item" :label="item" :value="item">
</el-option>
</el-select>
</el-form-item>
- <el-form-item label="é‡è¦æ€§">
+ <el-form-item :label="$t('table.importance')">
<el-rate style="margin-top:8px;" v-model="temp.importance" :colors="['#99A9BF', '#F7BA2A', '#FF9900']" :max='3'></el-rate>
</el-form-item>
- <el-form-item label="点评">
- <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" v-model="temp.remark">
+ <el-form-item :label="$t('table.remark')">
+ <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="Please input" v-model="temp.remark">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
- <el-button @click="dialogFormVisible = false">å– æ¶ˆ</el-button>
- <el-button v-if="dialogStatus=='create'" type="primary" @click="createData">确 定</el-button>
- <el-button v-else type="primary" @click="updateData">确 定</el-button>
+ <el-button @click="dialogFormVisible = false">{{$t('table.cancel')}}</el-button>
+ <el-button v-if="dialogStatus=='create'" type="primary" @click="createData">{{$t('table.confirm')}}</el-button>
+ <el-button v-else type="primary" @click="updateData">{{$t('table.confirm')}}</el-button>
</div>
</el-dialog>
- <el-dialog title="阅读数统计" :visible.sync="dialogPvVisible">
+ <el-dialog title="Reading statistics" :visible.sync="dialogPvVisible">
<el-table :data="pvData" border fit highlight-current-row style="width: 100%">
- <el-table-column prop="key" label="æ¸ é“"> </el-table-column>
- <el-table-column prop="pv" label="pv"> </el-table-column>
+ <el-table-column prop="key" label="Channel"> </el-table-column>
+ <el-table-column prop="pv" label="Pv"> </el-table-column>
</el-table>
<span slot="footer" class="dialog-footer">
- <el-button type="primary" @click="dialogPvVisible = false">确 定</el-button>
+ <el-button type="primary" @click="dialogPvVisible = false">{{$t('table.confirm')}}</el-button>
</span>
</el-dialog>
@@ -139,13 +139,13 @@ import waves from '@/directive/waves' // 水波纹指令
import { parseTime } from '@/utils'
const calendarTypeOptions = [
- { key: 'CN', display_name: 'ä¸å›½' },
- { key: 'US', display_name: '美国' },
- { key: 'JP', display_name: '日本' },
- { key: 'EU', display_name: '欧元区' }
+ { key: 'CN', display_name: 'China' },
+ { key: 'US', display_name: 'USA' },
+ { key: 'JP', display_name: 'Japan' },
+ { key: 'EU', display_name: 'Eurozone' }
]
-// arr to obj ,such as { CN : "ä¸å›½", US : "美国" }
+// arr to obj ,such as { CN : "China", US : "USA" }
const calendarTypeKeyValue = calendarTypeOptions.reduce((acc, cur) => {
acc[cur.key] = cur.display_name
return acc
@@ -172,9 +172,9 @@ export default {
},
importanceOptions: [1, 2, 3],
calendarTypeOptions,
- sortOptions: [{ label: '按IDå‡åºåˆ—', key: '+id' }, { label: '按IDé™åº', key: '-id' }],
+ sortOptions: [{ label: 'ID Ascending', key: '+id' }, { label: 'ID Descending', key: '-id' }],
statusOptions: ['published', 'draft', 'deleted'],
- showAuditor: false,
+ showReviewer: false,
temp: {
id: undefined,
importance: 1,
@@ -187,8 +187,8 @@ export default {
dialogFormVisible: false,
dialogStatus: '',
textMap: {
- update: '编辑',
- create: '创建'
+ update: 'Edit',
+ create: 'Create'
},
dialogPvVisible: false,
pvData: [],
@@ -267,7 +267,7 @@ export default {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
- this.temp.author = '原创作者'
+ this.temp.author = 'vue-element-admin'
createArticle(this.temp).then(() => {
this.list.unshift(this.temp)
this.dialogFormVisible = false
@@ -333,10 +333,10 @@ export default {
handleDownload() {
this.downloadLoading = true
import('@/vendor/Export2Excel').then(excel => {
- const tHeader = ['时间', '地区', '类型', 'æ ‡é¢˜', 'é‡è¦æ€§']
- const filterVal = ['timestamp', 'province', 'type', 'title', 'importance']
+ const tHeader = ['timestamp', 'title', 'type', 'importance', 'status']
+ const filterVal = ['timestamp', 'title', 'type', 'importance', 'status']
const data = this.formatJson(filterVal, this.list)
- excel.export_json_to_excel(tHeader, data, 'tableæ•°æ®')
+ excel.export_json_to_excel(tHeader, data, 'table-list')
this.downloadLoading = false
})
},
diff --git a/src/views/example/table/dragTable.vue b/src/views/example/table/dragTable.vue
index 8907ed83..5534f2f8 100644
--- a/src/views/example/table/dragTable.vue
+++ b/src/views/example/table/dragTable.vue
@@ -3,58 +3,58 @@
<!-- Note that row-key is necessary to get a correct row order. -->
<el-table :data="list" row-key="id" v-loading.body="listLoading" border fit highlight-current-row style="width: 100%">
- <el-table-column align="center" label="åºå·" width="65">
+ <el-table-column align="center" label="ID" width="65">
<template slot-scope="scope">
<span>{{scope.row.id}}</span>
</template>
</el-table-column>
- <el-table-column width="180px" align="center" label="时间">
+ <el-table-column width="180px" align="center" label="Date">
<template slot-scope="scope">
<span>{{scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}')}}</span>
</template>
</el-table-column>
- <el-table-column min-width="300px" label="æ ‡é¢˜">
+ <el-table-column min-width="300px" label="Title">
<template slot-scope="scope">
<span>{{scope.row.title}}</span>
</template>
</el-table-column>
- <el-table-column width="110px" align="center" label="作者">
+ <el-table-column width="110px" align="center" label="Author">
<template slot-scope="scope">
<span>{{scope.row.author}}</span>
</template>
</el-table-column>
- <el-table-column width="100px" label="é‡è¦æ€§">
+ <el-table-column width="100px" label="Importance">
<template slot-scope="scope">
<svg-icon v-for="n in +scope.row.importance" icon-class="star" class="icon-star" :key="n"></svg-icon>
</template>
</el-table-column>
- <el-table-column align="center" label="阅读数" width="95">
+ <el-table-column align="center" label="Readings" width="95">
<template slot-scope="scope">
<span>{{scope.row.pageviews}}</span>
</template>
</el-table-column>
- <el-table-column class-name="status-col" label="状æ€" width="110">
+ <el-table-column class-name="status-col" label="Status" width="110">
<template slot-scope="scope">
<el-tag :type="scope.row.status | statusFilter">{{scope.row.status}}</el-tag>
</template>
</el-table-column>
- <el-table-column align="center" label="拖拽" width="80">
+ <el-table-column align="center" label="Drag" width="80">
<template slot-scope="scope">
<svg-icon class='drag-handler' icon-class="drag"></svg-icon>
</template>
</el-table-column>
</el-table>
-
- <div class='show-d'>é»˜è®¤é¡ºåº {{ oldList}}</div>
- <div class='show-d'>拖拽åŽé¡ºåº{{newList}}</div>
+ <!-- $t is vue-i18n global function to translate lang (lang in @/lang) -->
+ <div class='show-d'>{{$t('table.dragTips1')}} : {{ oldList}}</div>
+ <div class='show-d'>{{$t('table.dragTips2')}} : {{newList}}</div>
</div>
</template>
diff --git a/src/views/example/table/dynamicTable/fixedThead.vue b/src/views/example/table/dynamicTable/fixedThead.vue
index 18aa7f74..9f4cfc5f 100644
--- a/src/views/example/table/dynamicTable/fixedThead.vue
+++ b/src/views/example/table/dynamicTable/fixedThead.vue
@@ -11,7 +11,7 @@
<el-table :data="tableData" :key='key' border fit highlight-current-row style="width: 100%">
<el-table-column prop="name" label="fruitName" width="180"></el-table-column>
- <el-table-column :key='fruit' v-for='(fruit,index) in formThead' :label="fruit">
+ <el-table-column :key='fruit' v-for='fruit in formThead' :label="fruit">
<template slot-scope="scope">
{{scope.row[fruit]}}
</template>
@@ -22,7 +22,7 @@
</template>
<script>
-const defaultFormThead = ['apple', 'banana'] // 默认选ä¸é¡¹
+const defaultFormThead = ['apple', 'banana']
export default {
data() {
@@ -42,15 +42,15 @@ export default {
}
],
key: 1, // table key
- formTheadOptions: ['apple', 'banana', 'orange'], // å¯é€‰æ‹©è¡¨å¤´
+ formTheadOptions: ['apple', 'banana', 'orange'],
checkboxVal: defaultFormThead, // checkboxVal
- formThead: defaultFormThead // 默认表头
+ formThead: defaultFormThead // 默认表头 Default header
}
},
watch: {
checkboxVal(valArr) {
this.formThead = this.formTheadOptions.filter(i => valArr.indexOf(i) >= 0)
- this.key = this.key + 1// 为了ä¿è¯table æ¯æ¬¡éƒ½ä¼šé‡æ¸² （牺牲性能ä¿è¯æ•ˆæžœï¼Œå½“然也å¯ä»¥ä¸ç”¨ï¼‰
+ this.key = this.key + 1// 为了ä¿è¯table æ¯æ¬¡éƒ½ä¼šé‡æ¸² In order to ensure the table will be re-rendered each time
}
}
}
diff --git a/src/views/example/table/dynamicTable/index.vue b/src/views/example/table/dynamicTable/index.vue
index 503c0b08..51f0da18 100644
--- a/src/views/example/table/dynamicTable/index.vue
+++ b/src/views/example/table/dynamicTable/index.vue
@@ -1,9 +1,9 @@
<template>
<div class="app-container">
- <div style='margin:0 0 5px 20px'>固定表头 按照表头顺åºæŽ’åº</div>
+ <div style='margin:0 0 5px 20px'>{{$t('table.dynamicTips1')}}</div>
<fixed-thead></fixed-thead>
- <div style='margin:30px 0 5px 20px'>ä¸å›ºå®šè¡¨å¤´ 按照点击顺åºæŽ’åº</div>
+ <div style='margin:30px 0 5px 20px'>{{$t('table.dynamicTips2')}}</div>
<unfixed-thead></unfixed-thead>
</div>
</template>
diff --git a/src/views/example/table/dynamicTable/unfixedThead.vue b/src/views/example/table/dynamicTable/unfixedThead.vue
index 34797b77..fab8e5b6 100644
--- a/src/views/example/table/dynamicTable/unfixedThead.vue
+++ b/src/views/example/table/dynamicTable/unfixedThead.vue
@@ -12,7 +12,7 @@
<el-table :data="tableData" border fit highlight-current-row style="width: 100%">
<el-table-column prop="name" label="fruitName" width="180">
</el-table-column>
- <el-table-column :key='fruit' v-for='(fruit,index) in formThead' :label="fruit">
+ <el-table-column :key='fruit' v-for='fruit in formThead' :label="fruit">
<template slot-scope="scope">
{{scope.row[fruit]}}
</template>
diff --git a/src/views/example/table/inlineEditTable.vue b/src/views/example/table/inlineEditTable.vue
index f359997f..3d2ad00f 100644
--- a/src/views/example/table/inlineEditTable.vue
+++ b/src/views/example/table/inlineEditTable.vue
@@ -3,37 +3,37 @@
<el-table :data="list" v-loading.body="listLoading" border fit highlight-current-row style="width: 100%">
- <el-table-column align="center" label="åºå·" width="80">
+ <el-table-column align="center" label="ID" width="80">
<template slot-scope="scope">
<span>{{scope.row.id}}</span>
</template>
</el-table-column>
- <el-table-column width="180px" align="center" label="时间">
+ <el-table-column width="180px" align="center" label="Date">
<template slot-scope="scope">
<span>{{scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}')}}</span>
</template>
</el-table-column>
- <el-table-column width="120px" align="center" label="作者">
+ <el-table-column width="120px" align="center" label="Author">
<template slot-scope="scope">
<span>{{scope.row.author}}</span>
</template>
</el-table-column>
- <el-table-column width="100px" label="é‡è¦æ€§">
+ <el-table-column width="100px" label="Importance">
<template slot-scope="scope">
<svg-icon v-for="n in +scope.row.importance" icon-class="star" class="meta-item__icon" :key="n"></svg-icon>
</template>
</el-table-column>
- <el-table-column class-name="status-col" label="状æ€" width="110">
+ <el-table-column class-name="status-col" label="Status" width="110">
<template slot-scope="scope">
<el-tag :type="scope.row.status | statusFilter">{{scope.row.status}}</el-tag>
</template>
</el-table-column>
- <el-table-column min-width="300px" label="æ ‡é¢˜">
+ <el-table-column min-width="300px" label="Title">
<template slot-scope="scope">
<template v-if="scope.row.edit">
<el-input class="edit-input" size="small" v-model="scope.row.title"></el-input>
@@ -43,10 +43,10 @@
</template>
</el-table-column>
- <el-table-column align="center" label="编辑" width="120">
+ <el-table-column align="center" label="Actions" width="120">
<template slot-scope="scope">
- <el-button v-if="scope.row.edit" type="success" @click="confirmEdit(scope.row)" size="small" icon="el-icon-circle-check-outline">完æˆ</el-button>
- <el-button v-else type="primary" @click='scope.row.edit=!scope.row.edit' size="small" icon="el-icon-edit">编辑</el-button>
+ <el-button v-if="scope.row.edit" type="success" @click="confirmEdit(scope.row)" size="small" icon="el-icon-circle-check-outline">Ok</el-button>
+ <el-button v-else type="primary" @click='scope.row.edit=!scope.row.edit' size="small" icon="el-icon-edit">Edit</el-button>
</template>
</el-table-column>
@@ -89,7 +89,9 @@ export default {
const items = response.data.items
this.list = items.map(v => {
this.$set(v, 'edit', false) // https://vuejs.org/v2/guide/reactivity.html
+
v.originalTitle = v.title // will be used when user click the cancel botton
+
return v
})
this.listLoading = false
diff --git a/src/views/excel/exportExcel.vue b/src/views/excel/exportExcel.vue
index 63e75764..be12ea4b 100644
--- a/src/views/excel/exportExcel.vue
+++ b/src/views/excel/exportExcel.vue
@@ -1,29 +1,30 @@
<template>
+ <!-- $t is vue-i18n global function to translate lang -->
<div class="app-container">
- <el-input style='width:240px;' placeholder="请输入文件å(默认excel-list)" prefix-icon="el-icon-document" v-model="filename"></el-input>
- <el-button style='margin-bottom:20px;' type="primary" icon="document" @click="handleDownload" :loading="downloadLoading">导出excel</el-button>
+ <el-input style='width:340px;' :placeholder="$t('excel.placeholder')" prefix-icon="el-icon-document" v-model="filename"></el-input>
+ <el-button style='margin-bottom:20px;' type="primary" icon="document" @click="handleDownload" :loading="downloadLoading">{{$t('excel.export')}} excel</el-button>
<el-table :data="list" v-loading.body="listLoading" element-loading-text="æ‹¼å‘½åŠ è½½ä¸" border fit highlight-current-row>
- <el-table-column align="center" label='ID' width="95">
+ <el-table-column align="center" label='Id' width="95">
<template slot-scope="scope">
{{scope.$index}}
</template>
</el-table-column>
- <el-table-column label="æ–‡ç« æ ‡é¢˜">
+ <el-table-column label="Title">
<template slot-scope="scope">
{{scope.row.title}}
</template>
</el-table-column>
- <el-table-column label="作者" width="95" align="center">
+ <el-table-column label="Author" width="110" align="center">
<template slot-scope="scope">
<el-tag>{{scope.row.author}}</el-tag>
</template>
</el-table-column>
- <el-table-column label="阅读数" width="115" align="center">
+ <el-table-column label="Readings" width="115" align="center">
<template slot-scope="scope">
{{scope.row.pageviews}}
</template>
</el-table-column>
- <el-table-column align="center" prop="created_at" label="å‘布时间" width="220">
+ <el-table-column align="center" label="Date" width="220">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span>{{scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}')}}</span>
@@ -61,7 +62,7 @@ export default {
handleDownload() {
this.downloadLoading = true
import('@/vendor/Export2Excel').then(excel => {
- const tHeader = ['åºå·', 'æ–‡ç« æ ‡é¢˜', '作者', '阅读数', 'å‘布时间']
+ const tHeader = ['Id', 'Title', 'Author', 'Readings', 'Date']
const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
const list = this.list
const data = this.formatJson(filterVal, list)
diff --git a/src/views/excel/selectExcel.vue b/src/views/excel/selectExcel.vue
index cc3e2fe3..bd62ade7 100644
--- a/src/views/excel/selectExcel.vue
+++ b/src/views/excel/selectExcel.vue
@@ -1,31 +1,32 @@
<template>
<div class="app-container">
- <el-input style='width:240px;' placeholder="请输入文件å(默认excel-list)" prefix-icon="el-icon-document" v-model="filename"></el-input>
- <el-button style='margin-bottom:20px' type="primary" icon="document" @click="handleDownload" :loading="downloadLoading">导出已选择项</el-button>
+ <!-- $t is vue-i18n global function to translate lang -->
+ <el-input style='width:340px;' :placeholder="$t('excel.placeholder')" prefix-icon="el-icon-document" v-model="filename"></el-input>
+ <el-button style='margin-bottom:20px' type="primary" icon="document" @click="handleDownload" :loading="downloadLoading">{{$t('excel.selectedExport')}}</el-button>
<el-table :data="list" v-loading.body="listLoading" element-loading-text="æ‹¼å‘½åŠ è½½ä¸" border fit highlight-current-row @selection-change="handleSelectionChange"
ref="multipleTable">
<el-table-column type="selection" align="center"></el-table-column>
- <el-table-column align="center" label='ID' width="95">
+ <el-table-column align="center" label='Id' width="95">
<template slot-scope="scope">
{{scope.$index}}
</template>
</el-table-column>
- <el-table-column label="æ–‡ç« æ ‡é¢˜">
+ <el-table-column label="Title">
<template slot-scope="scope">
{{scope.row.title}}
</template>
</el-table-column>
- <el-table-column label="作者" width="95" align="center">
+ <el-table-column label="Author" width="110" align="center">
<template slot-scope="scope">
<el-tag>{{scope.row.author}}</el-tag>
</template>
</el-table-column>
- <el-table-column label="阅读数" width="115" align="center">
+ <el-table-column label="Readings" width="115" align="center">
<template slot-scope="scope">
{{scope.row.pageviews}}
</template>
</el-table-column>
- <el-table-column align="center" prop="created_at" label="å‘布时间" width="220">
+ <el-table-column align="center" label="PDate" width="220">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span>{{scope.row.display_time}}</span>
@@ -66,18 +67,18 @@ export default {
handleDownload() {
if (this.multipleSelection.length) {
this.downloadLoading = true
- import('@/vendor/Export2Excel').then(excel => {
- const tHeader = ['åºå·', 'æ–‡ç« æ ‡é¢˜', '作者', '阅读数', 'å‘布时间']
- const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
- const list = this.multipleSelection
- const data = this.formatJson(filterVal, list)
- excel.export_json_to_excel(tHeader, data, this.filename)
- this.$refs.multipleTable.clearSelection()
- this.downloadLoading = false
- })
+ import('@/vendor/Export2Excel').then(excel => {
+ const tHeader = ['Id', 'Title', 'Author', 'Readings', 'Date']
+ const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
+ const list = this.multipleSelection
+ const data = this.formatJson(filterVal, list)
+ excel.export_json_to_excel(tHeader, data, this.filename)
+ this.$refs.multipleTable.clearSelection()
+ this.downloadLoading = false
+ })
} else {
this.$message({
- message: '请至少选择一æ¡è®°å½•',
+ message: 'Please select at least one item',
type: 'warning'
})
}
diff --git a/src/views/layout/components/AppMain.vue b/src/views/layout/components/AppMain.vue
index fba66f3a..653d1810 100644
--- a/src/views/layout/components/AppMain.vue
+++ b/src/views/layout/components/AppMain.vue
@@ -13,7 +13,6 @@ export default {
name: 'AppMain',
computed: {
cachedViews() {
- // console.log(this.$store.state.tagsView.cachedViews)
return this.$store.state.tagsView.cachedViews
}
// key() {
diff --git a/src/views/layout/components/Navbar.vue b/src/views/layout/components/Navbar.vue
index dd8cf835..ad96453c 100644
--- a/src/views/layout/components/Navbar.vue
+++ b/src/views/layout/components/Navbar.vue
@@ -7,13 +7,13 @@
<div class="right-menu">
<error-log class="errLog-container right-menu-item"></error-log>
- <el-tooltip effect="dark" content="å…¨å±" placement="bottom">
+ <el-tooltip effect="dark" :content="$t('navbar.screenfull')" placement="bottom">
<screenfull class="screenfull right-menu-item"></screenfull>
</el-tooltip>
<lang-select class="international right-menu-item"></lang-select>
- <el-tooltip effect="dark" content="æ¢è‚¤" placement="bottom">
+ <el-tooltip effect="dark" :content="$t('navbar.theme')" placement="bottom">
<theme-picker class="theme-switch right-menu-item"></theme-picker>
</el-tooltip>
@@ -25,16 +25,16 @@
<el-dropdown-menu slot="dropdown">
<router-link to="/">
<el-dropdown-item>
- 首页
+ {{$t('navbar.dashboard')}}
</el-dropdown-item>
</router-link>
<a target='_blank' href="https://github.com/PanJiaChen/vue-element-admin/">
<el-dropdown-item>
- 项目地å€
+ {{$t('navbar.github')}}
</el-dropdown-item>
</a>
<el-dropdown-item divided>
- <span @click="logout" style="display:block;">退出登录</span>
+ <span @click="logout" style="display:block;">{{$t('navbar.logOut')}}</span>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
@@ -73,7 +73,7 @@ export default {
},
logout() {
this.$store.dispatch('LogOut').then(() => {
- location.reload()// 为了é‡æ–°å®žä¾‹åŒ–vue-router对象 é¿å…bug
+ location.reload()// In order to re-instantiate the vue-router object to avoid bugs
})
}
}
diff --git a/src/views/login/authredirect.vue b/src/views/login/authredirect.vue
index f466fff3..7cf37e81 100644
--- a/src/views/login/authredirect.vue
+++ b/src/views/login/authredirect.vue
@@ -1,10 +1,10 @@
<script>
- export default {
- name: 'authredirect',
- created() {
- const hash = window.location.search.slice(1)
- window.opener.location.href = window.location.origin + '/login#' + hash
- window.close()
- }
+ export default {
+ name: 'authredirect',
+ created() {
+ const hash = window.location.search.slice(1)
+ window.opener.location.href = window.location.origin + '/login#' + hash
+ window.close()
}
+ }
</script>
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 72237f31..0ea1764d 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -2,7 +2,7 @@
<div class="login-container">
<el-form class="login-form" autoComplete="on" :model="loginForm" :rules="loginRules" ref="loginForm" label-position="left">
<div class="title-container">
- <h3 class="title">{{ translateKey('title')}}</h3>
+ <h3 class="title">{{$t('login.title')}}</h3>
<lang-select class="set-language"></lang-select>
</div>
<el-form-item prop="username">
@@ -16,29 +16,28 @@
<span class="svg-container">
<svg-icon icon-class="password" />
</span>
- <el-input name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" autoComplete="on"
- placeholder="password" />
+ <el-input name="password" :type="passwordType" @keyup.enter.native="handleLogin" v-model="loginForm.password" autoComplete="on" placeholder="password" />
<span class="show-pwd" @click="showPwd">
<svg-icon icon-class="eye" />
</span>
</el-form-item>
- <el-button type="primary" style="width:100%;margin-bottom:30px;" :loading="loading" @click.native.prevent="handleLogin">{{translateKey('logIn')}}</el-button>
+ <el-button type="primary" style="width:100%;margin-bottom:30px;" :loading="loading" @click.native.prevent="handleLogin">{{$t('login.logIn')}}</el-button>
<div class="tips">
- <span>{{translateKey('username')}} : admin</span>
- <span>{{translateKey('password')}} : {{translateKey('any')}}</span>
+ <span>{{$t('login.username')}} : admin</span>
+ <span>{{$t('login.password')}} : {{$t('login.any')}}</span>
</div>
<div class="tips">
- <span>{{translateKey('username')}} : editor </span>
- <span>{{translateKey('password')}} : {{translateKey('any')}}</span>
+ <span style="margin-right:18px;">{{$t('login.username')}} : editor</span>
+ <span>{{$t('login.password')}} : {{$t('login.any')}}</span>
</div>
- <el-button class="thirdparty-button" type="primary" @click="showDialog=true">{{translateKey('thirdparty')}}</el-button>
+ <el-button class="thirdparty-button" type="primary" @click="showDialog=true">{{$t('login.thirdparty')}}</el-button>
</el-form>
- <el-dialog :title="translateKey('thirdparty')" :visible.sync="showDialog">
- {{translateKey('thirdpartyTips')}}
+ <el-dialog :title="$t('login.thirdparty')" :visible.sync="showDialog">
+ {{$t('login.thirdpartyTips')}}
<br/>
<br/>
<br/>
@@ -51,10 +50,10 @@
<script>
import { isvalidUsername } from '@/utils/validate'
import LangSelect from '@/components/LangSelect'
-import socialSign from './socialsignin'
+import SocialSign from './socialsignin'
export default {
- components: { LangSelect, socialSign },
+ components: { LangSelect, SocialSign },
name: 'login',
data() {
const validateUsername = (rule, value, callback) => {
@@ -80,20 +79,17 @@ export default {
username: [{ required: true, trigger: 'blur', validator: validateUsername }],
password: [{ required: true, trigger: 'blur', validator: validatePassword }]
},
- pwdType: 'password',
+ passwordType: 'password',
loading: false,
showDialog: false
}
},
methods: {
- translateKey(key) {
- return this.$t('login.' + key)
- },
showPwd() {
- if (this.pwdType === 'password') {
- this.pwdType = ''
+ if (this.passwordType === 'password') {
+ this.passwordType = ''
} else {
- this.pwdType = 'password'
+ this.passwordType = 'password'
}
},
handleLogin() {
@@ -103,7 +99,6 @@ export default {
this.$store.dispatch('LoginByUsername', this.loginForm).then(() => {
this.loading = false
this.$router.push({ path: '/' })
- // this.showDialog = true
}).catch(() => {
this.loading = false
})
@@ -172,7 +167,6 @@ $light_gray:#eee;
color: #454545;
}
}
-
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
diff --git a/src/views/permission/index.vue b/src/views/permission/index.vue
index df040deb..73a64e3e 100644
--- a/src/views/permission/index.vue
+++ b/src/views/permission/index.vue
@@ -1,7 +1,7 @@
<template>
<div class="app-container">
- <div style="margin-bottom:15px;">ä½ çš„æƒé™ï¼š {{roles}}</div>
- 切æ¢æƒé™ï¼š
+ <div style="margin-bottom:15px;">{{$t('permission.roles')}}： {{roles}}</div>
+ {{$t('permission.switchRoles')}}：
<el-radio-group v-model="role">
<el-radio-button label="editor"></el-radio-button>
</el-radio-group>
diff --git a/src/views/svg-icons/index.vue b/src/views/svg-icons/index.vue
index 19dff705..0051b20c 100644
--- a/src/views/svg-icons/index.vue
+++ b/src/views/svg-icons/index.vue
@@ -1,7 +1,8 @@
<template>
<div class="icons-container">
<p class="warn-content">
- <a href="https://panjiachen.github.io/vue-element-admin-site/#/icon" target="_blank">æ·»åŠ å’Œä½¿ç”¨æ–¹å¼</a>
+ <a href="https://panjiachen.github.io/vue-element-admin-site/#/icon" target="_blank">Add and use
+ </a>
</p>
<div class="icons-wrapper">
<div v-for="item of iconsMap" :key="item" @click="handleClipboard(generateIconCode(item),$event)">
diff --git a/src/views/theme/index.vue b/src/views/theme/index.vue
index 496c7783..ca6e1e5f 100644
--- a/src/views/theme/index.vue
+++ b/src/views/theme/index.vue
@@ -2,21 +2,23 @@
<div class="app-container">
<el-card class="box-card">
<div slot="header">
- <span style="line-height: 36px;">å好设置</span>
- <a class='link-type link-title' target="_blank" href='https://panjiachen.github.io/vue-element-admin-site/#/theme'>æ¢è‚¤æ–‡æ¡£</a>
+ <a class='link-type link-title' target="_blank" href='https://panjiachen.github.io/vue-element-admin-site/#/theme'>
+ {{$t('theme.documentation')}}
+ </a>
</div>
<div class="box-item">
- <span class="field-label">æ¢è‚¤:</span>
+ <span class="field-label">{{$t('theme.change')}} : </span>
<el-switch v-model="theme"></el-switch>
+ <code style="margin-top:15px;">{{$t('theme.tips')}}</code>
</div>
</el-card>
<div class="block">
- <el-button type="primary">æˆåŠŸæŒ‰é’®</el-button>
- <el-button type="success">æˆåŠŸæŒ‰é’®</el-button>
- <el-button type="warning">è¦å‘ŠæŒ‰é’®</el-button>
- <el-button type="danger">å±é™©æŒ‰é’®</el-button>
- <el-button type="info">ä¿¡æ¯æŒ‰é’®</el-button>
+ <el-button type="primary">Primary</el-button>
+ <el-button type="success">Success</el-button>
+ <el-button type="info">Info</el-button>
+ <el-button type="warning">Warning</el-button>
+ <el-button type="danger">Danger</el-button>
</div>
<div class="block">
@@ -24,7 +26,8 @@
<el-button type="primary" icon="el-icon-share"></el-button>
<el-button type="primary" icon="el-icon-delete"></el-button>
<el-button type="primary" icon="el-icon-search">Search</el-button>
- <el-button type="primary">Upload
+ <el-button type="primary">
+ Upload
<i class="el-icon-upload el-icon-right"></i>
</el-button>
</div>
@@ -52,7 +55,7 @@
<script>
import { toggleClass } from '@/utils'
-import '@/assets/custom-theme/index.css' // æ¢è‚¤ç‰ˆæœ¬element-ui css
+import '@/assets/custom-theme/index.css' // the theme changed version element-ui css
export default {
name: 'theme',
@@ -79,6 +82,9 @@ export default {
</script>
<style scoped>
+.field-label{
+ vertical-align: middle;
+}
.box-card {
width: 400px;
margin: 20px auto;
diff --git a/src/views/zip/index.vue b/src/views/zip/index.vue
index 98c3d7ad..54320a8e 100644
--- a/src/views/zip/index.vue
+++ b/src/views/zip/index.vue
@@ -1,29 +1,30 @@
<template>
<div class="app-container">
- <el-input style='width:240px;' placeholder="请输入文件å(默认file)" prefix-icon="el-icon-document" v-model="filename"></el-input>
- <el-button style='margin-bottom:20px;' type="primary" icon="document" @click="handleDownload" :loading="downloadLoading">导出zip</el-button>
+ <!-- $t is vue-i18n global function to translate lang -->
+ <el-input style='width:300px;' :placeholder="$t('zip.placeholder')" prefix-icon="el-icon-document" v-model="filename"></el-input>
+ <el-button style='margin-bottom:20px;' type="primary" icon="document" @click="handleDownload" :loading="downloadLoading">{{$t('zip.export')}} zip</el-button>
<el-table :data="list" v-loading.body="listLoading" element-loading-text="æ‹¼å‘½åŠ è½½ä¸" border fit highlight-current-row>
<el-table-column align="center" label='ID' width="95">
<template slot-scope="scope">
{{scope.$index}}
</template>
</el-table-column>
- <el-table-column label="æ–‡ç« æ ‡é¢˜">
+ <el-table-column label="Title">
<template slot-scope="scope">
{{scope.row.title}}
</template>
</el-table-column>
- <el-table-column label="作者" width="95" align="center">
+ <el-table-column label="Author" width="95" align="center">
<template slot-scope="scope">
<el-tag>{{scope.row.author}}</el-tag>
</template>
</el-table-column>
- <el-table-column label="阅读数" width="115" align="center">
+ <el-table-column label="Readings" width="115" align="center">
<template slot-scope="scope">
{{scope.row.pageviews}}
</template>
</el-table-column>
- <el-table-column align="center" prop="created_at" label="å‘布时间" width="220">
+ <el-table-column align="center" label="Date" width="220">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span>{{scope.row.display_time}}</span>
@@ -60,7 +61,7 @@ export default {
handleDownload() {
this.downloadLoading = true
import('@/vendor/Export2Zip').then(zip => {
- const tHeader = ['åºå·', 'æ–‡ç« æ ‡é¢˜', '作者', '阅读数', 'å‘布时间']
+ const tHeader = ['Id', 'Title', 'Author', 'Readings', 'Date']
const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
const list = this.list
const data = this.formatJson(filterVal, list)
--
GitLab