refine code

This commit is contained in:
Pan 2017-08-22 18:47:23 +08:00 committed by 花裤衩
parent 8fa2364a3b
commit 33a4369cd7
8 changed files with 40 additions and 66 deletions

View file

@ -18,8 +18,8 @@ import Layout from '../views/layout/Layout'
export const constantRouterMap = [
{ path: '/login', component: _import('login/index'), hidden: true },
{ path: '/authredirect', component: _import('login/authredirect'), hidden: true },
{ path: '/404', component: _import('error/404'), hidden: true },
{ path: '/401', component: _import('error/401'), hidden: true },
{ path: '/404', component: _import('errorPage/404'), hidden: true },
{ path: '/401', component: _import('errorPage/401'), hidden: true },
{
path: '/',
component: Layout,
@ -117,14 +117,14 @@ export const asyncRouterMap = [
]
},
{
path: '/errorpage',
path: '/error',
component: Layout,
redirect: 'noredirect',
name: '错误页面',
icon: '404',
children: [
{ path: '401', component: _import('error/401'), name: '401' },
{ path: '404', component: _import('error/404'), name: '404' }
{ path: '401', component: _import('errorPage/401'), name: '401' },
{ path: '404', component: _import('errorPage/404'), name: '404' }
]
},
{
@ -139,12 +139,12 @@ export const asyncRouterMap = [
{
path: '/excel',
component: Layout,
redirect: 'noredirect',
redirect: '/excel/download',
name: 'excel',
icon: 'EXCEL',
children: [
{ path: 'download', component: _import('excel/index'), name: '导出excel' },
{ path: 'download2', component: _import('excel/selectExcel'), name: '选择导出excel' }
{ path: 'download2', component: _import('excel/selectExcel'), name: '导出已选择项' }
]
},
{

View file

@ -20,7 +20,6 @@
<img :src="errGif" width="313" height="428" alt="Girl has dropped her ice cream.">
</el-col>
</el-row>
<el-dialog title="随便看" :visible.sync="dialogVisible" size="large">
<img class="pan-img" :src="ewizardClap">
</el-dialog>

View file

@ -225,5 +225,4 @@ export default {
}
}
}
</style>

View file

@ -28,7 +28,7 @@
<el-table-column width="80px" label="重要性">
<template scope="scope">
<icon-svg v-for="n in +scope.row.importance" icon-class="wujiaoxing" class="meta-item__icon" :key="n"></icon-svg>
<icon-svg v-for="n in +scope.row.importance" icon-class="wujiaoxing" :key="n"></icon-svg>
</template>
</el-table-column>
@ -51,7 +51,6 @@
import { fetchList } from 'api/article_table'
export default {
name: 'articleDetail',
props: {
type: {
type: String,
@ -61,7 +60,6 @@ export default {
data() {
return {
list: null,
total: null,
listQuery: {
page: 1,
limit: 5,
@ -86,10 +84,8 @@ export default {
methods: {
getList() {
this.$emit('create') // for test
fetchList(this.listQuery).then(response => {
this.list = response.data.items
this.total = response.data.total
})
}
}

View file

@ -20,10 +20,10 @@ export default {
data() {
return {
tabMapOptions: [
{ label: '中国', key: 'CN' },
{ label: '美国', key: 'US' },
{ label: '日本', key: 'JP' },
{ label: '欧元区', key: 'EU' }
{ label: '中国', key: 'CN' },
{ label: '美国', key: 'US' },
{ label: '日本', key: 'JP' },
{ label: '欧元区', key: 'EU' }
],
activeName: 'CN',
createdTimes: 0

View file

@ -1,6 +1,6 @@
<template>
<div class="app-container">
<el-button style='margin-bottom:20px;float:right' type="primary" icon="document" @click="handleDownload">导出excel</el-button>
<el-button style='margin-bottom:20px;' type="primary" icon="document" @click="handleDownload" :loading="downloadLoading">导出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">
<template scope="scope">
@ -12,7 +12,6 @@
{{scope.row.title}}
</template>
</el-table-column>
<el-table-column label="作者" width="110">
<template scope="scope">
<span>{{scope.row.author}}</span>
@ -40,7 +39,8 @@ export default {
data() {
return {
list: null,
listLoading: true
listLoading: true,
downloadLoading: false
}
},
created() {
@ -49,21 +49,21 @@ export default {
methods: {
fetchData() {
this.listLoading = true
getList(this.listQuery).then(response => {
getList().then(response => {
this.list = response.data
this.listLoading = false
})
},
handleDownload() {
this.downloadLoading = true
require.ensure([], () => {
const {
export_json_to_excel
} = require('vendor/Export2Excel')
const { export_json_to_excel } = require('vendor/Export2Excel')
const tHeader = ['序号', '文章标题', '作者', '阅读数', '发布时间']
const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
const list = this.list
const data = this.formatJson(filterVal, list)
export_json_to_excel(tHeader, data, '列表excel')
this.downloadLoading = false
})
},
formatJson(filterVal, jsonData) {

View file

@ -1,34 +1,29 @@
<template>
<div class="app-container">
<el-button style='margin-bottom:20px;float:right' type="primary" icon="document" @click="handleDownload">导出excel</el-button>
<el-table :data="list" v-loading.body="listLoading" element-loading-text="拼命加载中" border fit highlight-current-row @selection-change="handleSelectionChange" ref="multipleTable">
<el-button style='margin-bottom:20px' type="primary" icon="document" @click="handleDownload" :loading="downloadLoading">导出已选择项</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">
<template scope="scope">
{{scope.$index}}
</template>
</el-table-column>
<el-table-column label="文章标题">
<template scope="scope">
{{scope.row.title}}
</template>
</el-table-column>
<el-table-column label="作者" width="110">
<template scope="scope">
<span>{{scope.row.author}}</span>
</template>
</el-table-column>
<el-table-column label="阅读数" width="105" align="center">
<template scope="scope">
{{scope.row.pageviews}}
</template>
</el-table-column>
<el-table-column align="center" prop="created_at" label="发布时间" width="200">
<template scope="scope">
<i class="el-icon-time"></i>
@ -39,7 +34,6 @@
</div>
</template>
<script>
import { getList } from 'api/article'
@ -48,7 +42,8 @@ export default {
return {
list: null,
listLoading: true,
multipleSelection: []
multipleSelection: [],
downloadLoading: false
}
},
created() {
@ -67,6 +62,7 @@ export default {
},
handleDownload() {
if (this.multipleSelection.length) {
this.downloadLoading = true
require.ensure([], () => {
const { export_json_to_excel } = require('vendor/Export2Excel')
const tHeader = ['序号', '文章标题', '作者', '阅读数', '发布时间']
@ -75,10 +71,11 @@ export default {
const data = this.formatJson(filterVal, list)
export_json_to_excel(tHeader, data, '列表excel')
this.$refs.multipleTable.clearSelection()
this.downloadLoading = false
})
} else {
this.$message({
message: '请选择一条或多条记录导出',
message: '请至少选择一条记录',
type: 'warning'
})
}

View file

@ -1,11 +1,10 @@
<template>
<div class="app-container">
<code>会补动态换肤的教程</code>
<el-card class="box-card">
<div slot="header">
<span style="line-height: 36px;">偏好设置</span>
<a class='link-type link-title' target="_blank" href='https://segmentfault.com/a/1190000009762198#articleHeader2'>态换肤的教程</a>
</div>
<div class="box-item">
<span class="field-label">换肤:</span>
<el-switch v-model="theme" on-text="" off-text="">
@ -43,6 +42,7 @@
</div>
</template>
<script>
import { toggleClass } from 'utils'
import '@/assets/custom-theme/index.css' // element-ui css
@ -51,39 +51,19 @@ export default {
data() {
return {
theme: false,
tags: [{
name: '标签一',
type: ''
},
{
name: '标签二',
type: 'gray'
},
{
name: '标签三',
type: 'primary'
},
{
name: '标签四',
type: 'success'
},
{
name: '标签五',
type: 'warning'
},
{
name: '标签六',
type: 'danger'
}
],
inputVisible: false,
inputValue: ''
tags: [
{ name: '标签一', type: '' },
{ name: '标签二', type: 'gray' },
{ name: '标签三', type: 'primary' },
{ name: '标签四', type: 'success' },
{ name: '标签五', type: 'warning' },
{ name: '标签六', type: 'danger' }
]
}
},
watch: {
theme() {
toggleClass(document.body, 'custom-theme')
// this.$store.dispatch('setTheme', value);
}
}
}
@ -103,4 +83,7 @@ export default {
.tag-item{
margin-right: 15px;
}
.link-title{
margin-left:35px;
}
</style>