diff --git a/src/components/MDinput/index.vue b/src/components/MDinput/index.vue
index 731311f73984697922e1e94b5f2b6a2750b362ac..f93ae25805bcdac0f8f875657769199dad6b7560 100644
--- a/src/components/MDinput/index.vue
+++ b/src/components/MDinput/index.vue
@@ -164,6 +164,7 @@ export default {
.material-input__icon {
position: absolute;
left: 0;
+ line-height: $font-size-base;
color: $color-blue;
top: $spacer;
width: $index-has-icon;
diff --git a/src/router/index.js b/src/router/index.js
index 67a8719760a238e318dddf7beb7b8caff6d68247..52011bd6cbd502da8ff58a1e5dfebd1b4ff909a2 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -95,18 +95,17 @@ export const asyncRouterMap = [
icon: 'component'
},
children: [
- { path: 'index', component: _import('components/index'), name: 'componentIndex', meta: { title: 'componentIndex' }},
- { path: 'tinymce', component: _import('components/tinymce'), name: 'tinymce', meta: { title: 'tinymce' }},
- { path: 'markdown', component: _import('components/markdown'), name: 'markdown', meta: { title: 'markdown' }},
- { path: 'json-editor', component: _import('components/jsonEditor'), name: 'jsonEditor', meta: { title: 'jsonEditor' }},
- { path: 'dnd-list', component: _import('components/dndList'), name: 'dndList', meta: { title: 'dndList' }},
- { path: 'splitpane', component: _import('components/splitpane'), name: 'splitpane', meta: { title: 'splitPane' }},
- { path: 'avatar-upload', component: _import('components/avatarUpload'), name: 'avatarUpload', meta: { title: 'avatarUpload' }},
- { path: 'dropzone', component: _import('components/dropzone'), name: 'dropzone', meta: { title: 'dropzone' }},
- { path: 'sticky', component: _import('components/sticky'), name: 'sticky', meta: { title: 'sticky' }},
- { path: 'count-to', component: _import('components/countTo'), name: 'countTo', meta: { title: 'countTo' }},
- { path: 'mixin', component: _import('components/mixin'), name: 'componentMixin', meta: { title: 'componentMixin' }},
- { path: 'back-to-top', component: _import('components/backToTop'), name: 'backToTop', meta: { title: 'backToTop' }}
+ { path: 'tinymce', component: _import('components-demo/tinymce'), name: 'tinymce', meta: { title: 'tinymce' }},
+ { path: 'markdown', component: _import('components-demo/markdown'), name: 'markdown', meta: { title: 'markdown' }},
+ { path: 'json-editor', component: _import('components-demo/jsonEditor'), name: 'jsonEditor', meta: { title: 'jsonEditor' }},
+ { path: 'dnd-list', component: _import('components-demo/dndList'), name: 'dndList', meta: { title: 'dndList' }},
+ { path: 'splitpane', component: _import('components-demo/splitpane'), name: 'splitpane', meta: { title: 'splitPane' }},
+ { path: 'avatar-upload', component: _import('components-demo/avatarUpload'), name: 'avatarUpload', meta: { title: 'avatarUpload' }},
+ { path: 'dropzone', component: _import('components-demo/dropzone'), name: 'dropzone', meta: { title: 'dropzone' }},
+ { path: 'sticky', component: _import('components-demo/sticky'), name: 'sticky', meta: { title: 'sticky' }},
+ { path: 'count-to', component: _import('components-demo/countTo'), name: 'countTo', meta: { title: 'countTo' }},
+ { path: 'mixin', component: _import('components-demo/mixin'), name: 'componentMixin', meta: { title: 'componentMixin' }},
+ { path: 'back-to-top', component: _import('components-demo/backToTop'), name: 'backToTop', meta: { title: 'backToTop' }}
]
},
@@ -235,7 +234,7 @@ export const asyncRouterMap = [
{
path: '/i18n',
component: Layout,
- children: [{ path: 'index', component: _import('i18n/index'), name: 'i18n', meta: { title: 'i18n', icon: 'international' }}]
+ children: [{ path: 'index', component: _import('i18n-demo/index'), name: 'i18n', meta: { title: 'i18n', icon: 'international' }}]
},
{ path: '*', redirect: '/404', hidden: true }
diff --git a/src/views/components/avatarUpload.vue b/src/views/components-demo/avatarUpload.vue
similarity index 100%
rename from src/views/components/avatarUpload.vue
rename to src/views/components-demo/avatarUpload.vue
diff --git a/src/views/components/backToTop.vue b/src/views/components-demo/backToTop.vue
similarity index 100%
rename from src/views/components/backToTop.vue
rename to src/views/components-demo/backToTop.vue
diff --git a/src/views/components/countTo.vue b/src/views/components-demo/countTo.vue
similarity index 100%
rename from src/views/components/countTo.vue
rename to src/views/components-demo/countTo.vue
diff --git a/src/views/components/dndList.vue b/src/views/components-demo/dndList.vue
similarity index 100%
rename from src/views/components/dndList.vue
rename to src/views/components-demo/dndList.vue
diff --git a/src/views/components/dropzone.vue b/src/views/components-demo/dropzone.vue
similarity index 100%
rename from src/views/components/dropzone.vue
rename to src/views/components-demo/dropzone.vue
diff --git a/src/views/components/jsonEditor.vue b/src/views/components-demo/jsonEditor.vue
similarity index 100%
rename from src/views/components/jsonEditor.vue
rename to src/views/components-demo/jsonEditor.vue
diff --git a/src/views/components/markdown.vue b/src/views/components-demo/markdown.vue
similarity index 100%
rename from src/views/components/markdown.vue
rename to src/views/components-demo/markdown.vue
diff --git a/src/views/components-demo/mixin.vue b/src/views/components-demo/mixin.vue
new file mode 100644
index 0000000000000000000000000000000000000000..32d164f9120a8d4c7d1c48770775506aace5f55e
--- /dev/null
+++ b/src/views/components-demo/mixin.vue
@@ -0,0 +1,118 @@
+<template>
+ <div class="components-container">
+ <el-row>
+ <el-col :span="4" class='text-center'>
+ <router-link class="pan-btn blue-btn" to="/components/index">Components</router-link>
+ </el-col>
+ <el-col :span="4" class='text-center'>
+ <router-link class="pan-btn light-blue-btn" to="/charts/index">Charts</router-link>
+ </el-col>
+ <el-col :span="4" class='text-center'>
+ <router-link class="pan-btn pink-btn" to="/excel/download">Excel</router-link>
+ </el-col>
+ <el-col :span="4" class='text-center'>
+ <router-link class="pan-btn green-btn" to="/example/table/complex-table">Table</router-link>
+ </el-col>
+ <el-col :span="4" class='text-center'>
+ <router-link class="pan-btn tiffany-btn" to="/form/edit-form">Form</router-link>
+ </el-col>
+ <el-col :span="4" class='text-center'>
+ <router-link class="pan-btn yellow-btn" to="/theme/index">Theme</router-link>
+ </el-col>
+ </el-row>
+
+ <el-row :gutter="20" style="margin-top:50px;">
+ <el-col :span="6">
+ <el-card class="box-card">
+ <div slot="header" class="clearfix">
+ <span>Material Design çš„input</span>
+ </div>
+ <div style="height:100px;">
+ <el-form :model="demo" :rules="demoRules">
+ <el-form-item prop="title">
+ <md-input icon="search" name="title" placeholder="è¾“å…¥æ ‡é¢˜" v-model="demo.title">æ ‡é¢˜</md-input>
+ </el-form-item>
+ </el-form>
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="6">
+ <el-card class="box-card">
+ <div slot="header" class="clearfix">
+ <span>图片hover效果</span>
+ </div>
+ <div class="component-item">
+ <pan-thumb width='100px' height='100px' image='https://wpimg.wallstcn.com/577965b9-bb9e-4e02-9f0c-095b41417191'>
+ vue-element-admin
+ </pan-thumb>
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="6">
+ <el-card class="box-card">
+ <div slot="header" class="clearfix">
+ <span>水波纹 waves v-directive</span>
+ </div>
+ <div class="component-item">
+ <el-button v-waves type="primary">水波纹效果</el-button>
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="6">
+ <el-card class="box-card">
+ <div slot="header" class="clearfix">
+ <span>hover text</span>
+ </div>
+ <div class="component-item">
+ <mallki className='mallki-text' text='vue-element-admin'></mallki>
+ </div>
+ </el-card>
+ </el-col>
+ </el-row>
+
+ </div>
+</template>
+
+<script>
+import PanThumb from '@/components/PanThumb'
+import MdInput from '@/components/MDinput'
+import waves from '@/directive/waves/index.js' // 水波纹指令
+import Mallki from '@/components/TextHoverEffect/Mallki'
+
+export default {
+ components: {
+ PanThumb,
+ MdInput,
+ Mallki
+ },
+ directives: {
+ waves
+ },
+ data() {
+ const validate = (rule, value, callback) => {
+ if (value.length !== 6) {
+ callback(new Error('请输入å…个å—符'))
+ } else {
+ callback()
+ }
+ }
+ return {
+ demo: {
+ title: ''
+ },
+ demoRules: {
+ title: [{ required: true, trigger: 'change', validator: validate }]
+ }
+ }
+ }
+}
+</script>
+
+<style scoped>
+.component-item{
+ min-height: 100px;
+}
+</style>
diff --git a/src/views/components/splitpane.vue b/src/views/components-demo/splitpane.vue
similarity index 100%
rename from src/views/components/splitpane.vue
rename to src/views/components-demo/splitpane.vue
diff --git a/src/views/components/sticky.vue b/src/views/components-demo/sticky.vue
similarity index 100%
rename from src/views/components/sticky.vue
rename to src/views/components-demo/sticky.vue
diff --git a/src/views/components/tinymce.vue b/src/views/components-demo/tinymce.vue
similarity index 100%
rename from src/views/components/tinymce.vue
rename to src/views/components-demo/tinymce.vue
diff --git a/src/views/components/index.vue b/src/views/components/index.vue
deleted file mode 100644
index 661c483595d8eccff8d0fcc6b3c51fc497f5697c..0000000000000000000000000000000000000000
--- a/src/views/components/index.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-<template>
- <div class="components-container">
- <code>这里暂时列出了自己在项目ä¸ç”¨åˆ°çš„组件和一些自己å°è£…的组件，如有补充å¯ä»¥æ<a target='_blank' href='https://github.com/PanJiaChen/vue-element-admin/issues'> issue </a><br/>
- 我个人崇尚自己å°è£…ç»„ä»¶ï¼Œå› ä¸ºå¾ˆå¤šç»„ä»¶ä¼šå’Œä¸šåŠ¡åŽé«˜åº¦çš„耦åˆï¼Œè€Œä¸”第三方å°è£…的组件çµæ´»æ€§å¯æŽ§æ€§éƒ½ä¸é«˜ï¼Œå¦‚有需è¦å¯ä»¥çœ‹æ¥¼ä¸»ä¹‹å‰å†™è¿‡çš„一篇<a href='https://segmentfault.com/a/1190000009090836' target='_blank'>æ–‡ç« </a>
- </code>
- </div>
-</template>
diff --git a/src/views/components/mixin.vue b/src/views/components/mixin.vue
deleted file mode 100644
index 5f450c91bd8f1f688f9a4014f9472bd17300405d..0000000000000000000000000000000000000000
--- a/src/views/components/mixin.vue
+++ /dev/null
@@ -1,66 +0,0 @@
-<template>
- <div class="components-container">
- <div class='component-item'>
- <el-form :model="demo" :rules="demoRules">
- <el-form-item prop="title">
- <md-input icon="search" name="title" placeholder="è¾“å…¥æ ‡é¢˜" v-model="demo.title">æ ‡é¢˜</md-input>
- </el-form-item>
- </el-form>
- <code class='code-part'>Material Design çš„input</code>
- </div>
-
- <div class='component-item'>
- <pan-thumb image='https://wpimg.wallstcn.com/577965b9-bb9e-4e02-9f0c-095b41417191'>
- 上海花裤衩
- </pan-thumb>
- <code class='code-part'>图片hover效果</code>
- </div>
-
- <div class='component-item'>
- <el-button v-waves type="primary">水波纹效果</el-button>
- <code class='code-part'>水波纹 v-directive</code>
- </div>
- </div>
-</template>
-
-<script>
-import PanThumb from '@/components/PanThumb'
-import MdInput from '@/components/MDinput'
-import waves from '@/directive/waves/index.js' // 水波纹指令
-
-export default {
- components: {
- PanThumb,
- MdInput
- },
- directives: {
- waves
- },
- data() {
- const validate = (rule, value, callback) => {
- if (value.length !== 6) {
- callback(new Error('请输入å…个å—符'))
- } else {
- callback()
- }
- }
- return {
- demo: {
- title: ''
- },
- demoRules: {
- title: [{ required: true, trigger: 'change', validator: validate }]
- }
- }
- }
-}
-</script>
-
-<style scoped>
-.component-item{
- margin-top: 100px;
-}
-.code-part{
- margin-top: 20px;
-}
-</style>
diff --git a/src/views/dashboard/admin/components/BoxCard.vue b/src/views/dashboard/admin/components/BoxCard.vue
index 20557c1c96a395f27ebdf1445e6956735dc57119..3e92e9e83b1feaa28a6647f6f2f23979887b5440 100644
--- a/src/views/dashboard/admin/components/BoxCard.vue
+++ b/src/views/dashboard/admin/components/BoxCard.vue
@@ -6,7 +6,7 @@
<div style="position:relative;">
<pan-thumb class="panThumb" :image="avatar"></pan-thumb>
<mallki className='mallki-text' text='vue-element-admin'></mallki>
- <div class='progress-item'>
+ <div style="padding-top:35px;" class='progress-item'>
<span>Vue</span>
<el-progress :percentage="70"></el-progress>
</div>
@@ -18,6 +18,10 @@
<span>Css</span>
<el-progress :percentage="12"></el-progress>
</div>
+ <div class='progress-item'>
+ <span>ESlint</span>
+ <el-progress :percentage="100" status="success"></el-progress>
+ </div>
</div>
</el-card>
</template>
@@ -53,13 +57,7 @@ export default {
}
return statusMap[status]
}
- },
- created() {
-
- },
- methods: {
}
-
}
</script>
@@ -86,7 +84,7 @@ export default {
}
.mallki-text {
position: absolute;
- top: -10px;
+ top: 0px;
right: 0px;
font-size: 20px;
font-weight: bold;
@@ -102,6 +100,9 @@ export default {
background-color: #fff;
margin: auto;
box-shadow: none!important;
+ /deep/ .pan-info{
+ box-shadow: none!important;
+ }
}
.progress-item {
margin-bottom: 10px;
diff --git a/src/views/dashboard/admin/components/PieChart.vue b/src/views/dashboard/admin/components/PieChart.vue
index 426653b2d048edc585d4e734b6af200f96f030ee..3146bbfd945f941d0083e41d0783cfc127cbd5c6 100644
--- a/src/views/dashboard/admin/components/PieChart.vue
+++ b/src/views/dashboard/admin/components/PieChart.vue
@@ -54,9 +54,9 @@ export default {
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
legend: {
- x: 'center',
- y: 'bottom',
- data: ['industries', 'technology', 'forex', 'gold', 'forecasts', 'markets']
+ left: 'center',
+ bottom: '10',
+ data: ['industries', 'technology', 'forex', 'gold', 'forecasts']
},
calculable: true,
series: [
@@ -71,8 +71,7 @@ export default {
{ value: 240, name: 'technology' },
{ value: 149, name: 'forex' },
{ value: 100, name: 'gold' },
- { value: 59, name: 'forecasts' },
- { value: 49, name: 'markets' }
+ { value: 59, name: 'forecasts' }
],
animationEasing: 'cubicInOut',
animationDuration: 2600
diff --git a/src/views/dashboard/admin/components/RaddarChart.vue b/src/views/dashboard/admin/components/RaddarChart.vue
index 703ee41cd5c4f1fa03e5dcdb827d7674e665f3d2..017b97485d31ef853587345504acaf034897dc77 100644
--- a/src/views/dashboard/admin/components/RaddarChart.vue
+++ b/src/views/dashboard/admin/components/RaddarChart.vue
@@ -58,8 +58,8 @@ export default {
}
},
radar: {
- radius: '70%',
- center: ['50%', '44%'],
+ radius: '66%',
+ center: ['50%', '42%'],
splitNumber: 8,
splitArea: {
areaStyle: {
@@ -81,8 +81,8 @@ export default {
]
},
legend: {
- left: 0,
- bottom: 0,
+ left: 'center',
+ bottom: '10',
data: ['Allocated Budget', 'Expected Spending', 'Actual Spending']
},
series: [{
diff --git a/src/views/dashboard/admin/index.vue b/src/views/dashboard/admin/index.vue
index 032b8a389808b13f782a1c03bf7ab6fa0366e624..ac146d7af690ab65ee8084081b83ec3263909925 100644
--- a/src/views/dashboard/admin/index.vue
+++ b/src/views/dashboard/admin/index.vue
@@ -1,29 +1,10 @@
<template>
<div class="dashboard-editor-container">
<github-corner></github-corner>
- <!-- <el-row class="btn-group">
- <el-col :span="4" class='text-center'>
- <router-link class="pan-btn blue-btn" to="/components/index">Components</router-link>
- </el-col>
- <el-col :span="4" class='text-center'>
- <router-link class="pan-btn light-blue-btn" to="/charts/index">Charts</router-link>
- </el-col>
- <el-col :span="4" class='text-center'>
- <router-link class="pan-btn pink-btn" to="/excel/download">Excel</router-link>
- </el-col>
- <el-col :span="4" class='text-center'>
- <router-link class="pan-btn green-btn" to="/example/table/complex-table">Table</router-link>
- </el-col>
- <el-col :span="4" class='text-center'>
- <router-link class="pan-btn tiffany-btn" to="/form/edit-form">Form</router-link>
- </el-col>
- <el-col :span="4" class='text-center'>
- <router-link class="pan-btn yellow-btn" to="/theme/index">Theme</router-link>
- </el-col>
- </el-row> -->
+
<el-row class="panel-group" :gutter="40">
<el-col :span="6">
- <div class='card-panel no-margin-left' @click="handleSetLineChartData('newVisitis')">
+ <div class='card-panel' @click="handleSetLineChartData('newVisitis')">
<div class="card-panel-icon-wrapper icon-people">
<svg-icon icon-class="peoples" class-name="card-panel-icon" />
</div>
@@ -56,7 +37,7 @@
</div>
</el-col>
<el-col :span="6">
- <div class='card-panel no-margin-right' @click="handleSetLineChartData('shoppings')">
+ <div class='card-panel' @click="handleSetLineChartData('shoppings')">
<div class="card-panel-icon-wrapper icon-shoppingCard">
<svg-icon icon-class="shoppingCard" class-name="card-panel-icon" />
</div>
@@ -72,9 +53,9 @@
<line-chart :chart-data='lineChartData'></line-chart>
</el-row>
- <el-row style="margin-top:30px;">
+ <el-row style="margin-top:30px;" :gutter="30">
<el-col :span="8">
- <div class="chart-wrapper no-margin-left">
+ <div class="chart-wrapper">
<raddar-chart></raddar-chart>
</div>
</el-col>
@@ -84,7 +65,7 @@
</div>
</el-col>
<el-col :span="8">
- <div class="chart-wrapper no-margin-right">
+ <div class="chart-wrapper">
<bar-chart></bar-chart>
</div>
</el-col>
@@ -100,15 +81,11 @@
<el-col :span="6">
<box-card></box-card>
</el-col>
-
</el-row>
</div>
</template>
-
-
-
<script>
import CountTo from 'vue-count-to'
import GithubCorner from '@/components/GithubCorner'
@@ -169,17 +146,10 @@ export default {
.dashboard-editor-container {
padding: 30px;
background-color: rgb(240, 242, 245);
- .no-margin-left {
- margin-left: 0!important;
- }
- .no-margin-right {
- margin-right: 0!important;
- }
.panel-group {
margin-top: 20px;
}
.card-panel {
- // margin: 0 25px;
height: 108px;
cursor: pointer;
font-size: 12px;
@@ -247,11 +217,7 @@ export default {
}
.chart-wrapper {
background: #fff;
- margin: 0 15px;
padding: 15px 15px 0;
}
- .btn-group {
- margin-bottom: 60px;
- }
}
</style>
diff --git a/src/views/i18n/index.vue b/src/views/i18n-demo/index.vue
similarity index 100%
rename from src/views/i18n/index.vue
rename to src/views/i18n-demo/index.vue
diff --git a/src/views/i18n/local.js b/src/views/i18n-demo/local.js
similarity index 100%
rename from src/views/i18n/local.js
rename to src/views/i18n-demo/local.js