Merge branch 'i18n' into deploy
This commit is contained in:
commit
2d27251f2e
|
@ -30,9 +30,9 @@ English | [简体中文](./README.zh-CN.md) | [日本語](./README.ja.md) | [Spa
|
|||
|
||||
## Introduction
|
||||
|
||||
[vue-element-admin](https://panjiachen.github.io/vue-element-admin) is a production-ready front-end solution for admin interfaces. It based on [vue](https://github.com/vuejs/vue) and use the UI Toolkit [element-ui](https://github.com/ElemeFE/element).
|
||||
[vue-element-admin](https://panjiachen.github.io/vue-element-admin) is a production-ready front-end solution for admin interfaces. It is based on [vue](https://github.com/vuejs/vue) and uses the UI Toolkit [element-ui](https://github.com/ElemeFE/element).
|
||||
|
||||
It is a magical vue admin based on the newest development stack of vue, built-in i18n solution, typical templates for enterprise applications, lots of awesome features. It helps you build a large complex Single-Page Applications. I believe whatever your needs are, this project will help you.
|
||||
[vue-element-admin](https://panjiachen.github.io/vue-element-admin) is based on the newest development stack of vue and it has a built-in i18n solution, typical templates for enterprise applications, and lots of awesome features. It helps you build large and complex Single-Page Applications. I believe whatever your needs are, this project will help you.
|
||||
|
||||
- [Preview](https://panjiachen.github.io/vue-element-admin)
|
||||
|
||||
|
|
|
@ -0,0 +1,16 @@
|
|||
{{#if state}}
|
||||
const state = {}
|
||||
{{/if}}
|
||||
|
||||
{{#if mutations}}
|
||||
const mutations = {}
|
||||
{{/if}}
|
||||
|
||||
{{#if actions}}
|
||||
const actions = {}
|
||||
{{/if}}
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
{{options}}
|
||||
}
|
|
@ -0,0 +1,62 @@
|
|||
const { notEmpty } = require('../utils.js')
|
||||
|
||||
module.exports = {
|
||||
description: 'generate store',
|
||||
prompts: [{
|
||||
type: 'input',
|
||||
name: 'name',
|
||||
message: 'store name please',
|
||||
validate: notEmpty('name')
|
||||
},
|
||||
{
|
||||
type: 'checkbox',
|
||||
name: 'blocks',
|
||||
message: 'Blocks:',
|
||||
choices: [{
|
||||
name: 'state',
|
||||
value: 'state',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'mutations',
|
||||
value: 'mutations',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'actions',
|
||||
value: 'actions',
|
||||
checked: true
|
||||
}
|
||||
],
|
||||
validate(value) {
|
||||
if (!value.includes('state') || !value.includes('mutations')) {
|
||||
return 'store require at least state and mutations'
|
||||
}
|
||||
return true
|
||||
}
|
||||
}
|
||||
],
|
||||
actions(data) {
|
||||
const name = '{{name}}'
|
||||
const { blocks } = data
|
||||
const options = ['state', 'mutations']
|
||||
const joinFlag = `,
|
||||
`
|
||||
if (blocks.length === 3) {
|
||||
options.push('actions')
|
||||
}
|
||||
|
||||
const actions = [{
|
||||
type: 'add',
|
||||
path: `src/store/modules/${name}.js`,
|
||||
templateFile: 'plop-templates/store/index.hbs',
|
||||
data: {
|
||||
options: options.join(joinFlag),
|
||||
state: blocks.includes('state'),
|
||||
mutations: blocks.includes('mutations'),
|
||||
actions: blocks.includes('actions')
|
||||
}
|
||||
}]
|
||||
return actions
|
||||
}
|
||||
}
|
|
@ -1,7 +1,9 @@
|
|||
const viewGenerator = require('./plop-templates/view/prompt')
|
||||
const componentGenerator = require('./plop-templates/component/prompt')
|
||||
const storeGenerator = require('./plop-templates/store/prompt.js')
|
||||
|
||||
module.exports = function(plop) {
|
||||
plop.setGenerator('view', viewGenerator)
|
||||
plop.setGenerator('component', componentGenerator)
|
||||
plop.setGenerator('store', storeGenerator)
|
||||
}
|
||||
|
|
|
@ -12,7 +12,7 @@ import Editor from 'tui-editor'
|
|||
import defaultOptions from './default-options'
|
||||
|
||||
export default {
|
||||
name: 'MarddownEditor',
|
||||
name: 'MarkdownEditor',
|
||||
props: {
|
||||
value: {
|
||||
type: String,
|
||||
|
|
|
@ -44,6 +44,7 @@ $t: .1s;
|
|||
width: 250px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
height: auto!important;
|
||||
&-title {
|
||||
width: 100%;
|
||||
display: block;
|
||||
|
@ -65,10 +66,12 @@ $t: .1s;
|
|||
position: absolute;
|
||||
width: 100%;
|
||||
background: #e0e0e0;
|
||||
color: #000;
|
||||
line-height: 60px;
|
||||
height: 60px;
|
||||
cursor: pointer;
|
||||
font-size: 20px;
|
||||
font-size: 18px;
|
||||
overflow: hidden;
|
||||
opacity: 1;
|
||||
transition: transform 0.28s ease;
|
||||
&:hover {
|
||||
|
@ -90,7 +93,7 @@ $t: .1s;
|
|||
.share-dropdown-menu-item {
|
||||
@for $i from 1 through $n {
|
||||
&:nth-of-type(#{$i}) {
|
||||
transition-delay: ($n - $i)*$t;
|
||||
transition-delay: ($n - $i)*$t;
|
||||
transform: translate3d(0, ($i - 1)*60px, 0);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -77,3 +77,8 @@
|
|||
.el-range-editor.el-input__inner {
|
||||
display: inline-flex !important;
|
||||
}
|
||||
|
||||
// to fix el-date-picker css style
|
||||
.el-range-separator {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
|
|
@ -1,26 +1,10 @@
|
|||
<template>
|
||||
<div class="app-container documentation-container">
|
||||
<a
|
||||
class="document-btn"
|
||||
target="_blank"
|
||||
href="https://panjiachen.github.io/vue-element-admin-site/"
|
||||
>Documentation</a>
|
||||
<a
|
||||
class="document-btn"
|
||||
target="_blank"
|
||||
href="https://github.com/PanJiaChen/vue-element-admin/"
|
||||
>Github Repository</a>
|
||||
<a
|
||||
class="document-btn"
|
||||
target="_blank"
|
||||
href="https://panjiachen.gitee.io/vue-element-admin-site/zh/"
|
||||
>国内文档</a>
|
||||
<dropdown-menu :items="articleList" style="float:left;margin-left:50px;" title="系列文章" />
|
||||
<a
|
||||
class="document-btn"
|
||||
target="_blank"
|
||||
href="https://panjiachen.github.io/vue-element-admin-site/zh/job/"
|
||||
>内推招聘</a>
|
||||
<a class="document-btn" target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/">Documentation</a>
|
||||
<a class="document-btn" target="_blank" href="https://github.com/PanJiaChen/vue-element-admin/">Github Repository</a>
|
||||
<a class="document-btn" target="_blank" href="https://panjiachen.gitee.io/vue-element-admin-site/zh/">国内文档</a>
|
||||
<dropdown-menu class="document-btn" :items="articleList" title="系列文章" />
|
||||
<a class="document-btn" target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/zh/job/">内推招聘</a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -53,8 +37,10 @@ export default {
|
|||
margin: 50px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-evenly;
|
||||
|
||||
.document-btn {
|
||||
margin-left: 50px;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
background: black;
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
</a>
|
||||
</div>
|
||||
|
||||
<el-table v-loading="listLoading" :data="list" element-loading-text="拼命加载中" border fit highlight-current-row>
|
||||
<el-table v-loading="listLoading" :data="list" element-loading-text="Loading..." border fit highlight-current-row>
|
||||
<el-table-column align="center" label="Id" width="95">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index }}
|
||||
|
|
|
@ -6,29 +6,33 @@
|
|||
</aside>
|
||||
<el-tabs type="border-card">
|
||||
<el-tab-pane label="Icons">
|
||||
<div v-for="item of svgIcons" :key="item" @click="handleClipboard(generateIconCode(item),$event)">
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">
|
||||
{{ generateIconCode(item) }}
|
||||
</div>
|
||||
<div class="icon-item">
|
||||
<svg-icon :icon-class="item" class-name="disabled" />
|
||||
<span>{{ item }}</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<div class="grid">
|
||||
<div v-for="item of svgIcons" :key="item" @click="handleClipboard(generateIconCode(item),$event)">
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">
|
||||
{{ generateIconCode(item) }}
|
||||
</div>
|
||||
<div class="icon-item">
|
||||
<svg-icon :icon-class="item" class-name="disabled" />
|
||||
<span>{{ item }}</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="Element-UI Icons">
|
||||
<div v-for="item of elementIcons" :key="item" @click="handleClipboard(generateElementIconCode(item),$event)">
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">
|
||||
{{ generateElementIconCode(item) }}
|
||||
</div>
|
||||
<div class="icon-item">
|
||||
<i :class="'el-icon-' + item" />
|
||||
<span>{{ item }}</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<div class="grid">
|
||||
<div v-for="item of elementIcons" :key="item" @click="handleClipboard(generateElementIconCode(item),$event)">
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">
|
||||
{{ generateElementIconCode(item) }}
|
||||
</div>
|
||||
<div class="icon-item">
|
||||
<i :class="'el-icon-' + item" />
|
||||
<span>{{ item }}</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
@ -67,6 +71,12 @@ export default {
|
|||
margin: 10px 20px 0;
|
||||
overflow: hidden;
|
||||
|
||||
.grid {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
|
||||
}
|
||||
|
||||
.icon-item {
|
||||
margin: 20px;
|
||||
height: 85px;
|
||||
|
|
|
@ -26,17 +26,17 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
import('./content.js').then(data => {
|
||||
const { title } = data.default
|
||||
document.title = title
|
||||
this.article = data.default
|
||||
setTimeout(() => {
|
||||
this.fullscreenLoading = false
|
||||
this.$nextTick(() => {
|
||||
window.print()
|
||||
})
|
||||
}, 3000)
|
||||
})
|
||||
import('./content.js').then(data => {
|
||||
const { title } = data.default
|
||||
document.title = title
|
||||
this.article = data.default
|
||||
setTimeout(() => {
|
||||
this.fullscreenLoading = false
|
||||
this.$nextTick(() => {
|
||||
window.print()
|
||||
})
|
||||
}, 3000)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -74,61 +74,61 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.box-center {
|
||||
margin: 0 auto;
|
||||
display: table;
|
||||
}
|
||||
.box-center {
|
||||
margin: 0 auto;
|
||||
display: table;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: #777;
|
||||
}
|
||||
.text-muted {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.user-profile {
|
||||
.user-name {
|
||||
font-weight: bold;
|
||||
}
|
||||
.user-profile {
|
||||
.user-name {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.box-center {
|
||||
padding-top: 10px;
|
||||
}
|
||||
.box-center {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.user-role {
|
||||
padding-top: 10px;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
}
|
||||
.user-role {
|
||||
padding-top: 10px;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.box-social {
|
||||
padding-top: 30px;
|
||||
.box-social {
|
||||
padding-top: 30px;
|
||||
|
||||
.el-table {
|
||||
border-top: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.el-table {
|
||||
border-top: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
|
||||
.user-follow {
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
.user-follow {
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-bio {
|
||||
margin-top: 20px;
|
||||
color: #606266;
|
||||
.user-bio {
|
||||
margin-top: 20px;
|
||||
color: #606266;
|
||||
|
||||
span {
|
||||
padding-left: 4px;
|
||||
}
|
||||
span {
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.user-bio-section {
|
||||
font-size: 14px;
|
||||
padding: 15px 0;
|
||||
.user-bio-section {
|
||||
font-size: 14px;
|
||||
padding: 15px 0;
|
||||
|
||||
.user-bio-section-header {
|
||||
border-bottom: 1px solid #dfe6ec;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 10px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
.user-bio-section-header {
|
||||
border-bottom: 1px solid #dfe6ec;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 10px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -36,13 +36,13 @@
|
|||
@sort-change="sortChange"
|
||||
>
|
||||
<el-table-column :label="$t('table.id')" prop="id" sortable="custom" align="center" width="80" :class-name="getSortClass('id')">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.id }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('table.date')" width="150px" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('table.title')" min-width="150px">
|
||||
|
@ -52,18 +52,18 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('table.author')" width="110px" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.author }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.author }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="showReviewer" :label="$t('table.reviewer')" width="110px" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span style="color:red;">{{ scope.row.reviewer }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span style="color:red;">{{ row.reviewer }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('table.importance')" width="80px">
|
||||
<template slot-scope="scope">
|
||||
<svg-icon v-for="n in +scope.row.importance" :key="n" icon-class="star" class="meta-item__icon" />
|
||||
<template slot-scope="{row}">
|
||||
<svg-icon v-for="n in +row.importance" :key="n" icon-class="star" class="meta-item__icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('table.readings')" align="center" width="95">
|
||||
|
|
|
@ -3,38 +3,38 @@
|
|||
<!-- Note that row-key is necessary to get a correct row order. -->
|
||||
<el-table ref="dragTable" v-loading="listLoading" :data="list" row-key="id" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="ID" width="65">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.id }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<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 slot-scope="{row}">
|
||||
<span>{{ row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column min-width="300px" label="Title">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.title }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.title }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="110px" align="center" label="Author">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.author }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.author }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="100px" label="Importance">
|
||||
<template slot-scope="scope">
|
||||
<svg-icon v-for="n in +scope.row.importance" :key="n" icon-class="star" class="icon-star" />
|
||||
<template slot-scope="{row}">
|
||||
<svg-icon v-for="n in + row.importance" :key="n" icon-class="star" class="icon-star" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Readings" width="95">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.pageviews }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.pageviews }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
|
|
@ -2,26 +2,26 @@
|
|||
<div class="app-container">
|
||||
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="ID" width="80">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.id }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<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 slot-scope="{row}">
|
||||
<span>{{ row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="120px" align="center" label="Author">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.author }}</span>
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.author }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="100px" label="Importance">
|
||||
<template slot-scope="scope">
|
||||
<svg-icon v-for="n in +scope.row.importance" :key="n" icon-class="star" class="meta-item__icon" />
|
||||
<template slot-scope="{row}">
|
||||
<svg-icon v-for="n in + row.importance" :key="n" icon-class="star" class="meta-item__icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
|
Loading…
Reference in New Issue