This commit is contained in:
Pan 2017-08-28 13:12:44 +08:00 committed by 花裤衩
parent b98860ace1
commit f7aee3b5a3
50 changed files with 386 additions and 416 deletions

View File

@ -12,5 +12,4 @@
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -1,16 +1,25 @@
import fetch from 'utils/fetch'
import fetch from '@/utils/fetch'
export function getList() {
export function fetchList(query) {
return fetch({
url: '/article/list',
method: 'get'
method: 'get',
params: query
})
}
export function getArticle() {
export function fetchArticle() {
return fetch({
url: '/article/detail',
method: 'get'
})
}
export function fetchPv(pv) {
return fetch({
url: '/article/pv',
method: 'get',
params: { pv }
})
}

View File

@ -1,17 +0,0 @@
import fetch from 'utils/fetch'
export function fetchList(query) {
return fetch({
url: '/article_table/list',
method: 'get',
params: query
})
}
export function fetchPv(pv) {
return fetch({
url: '/article_table/pv',
method: 'get',
params: { pv }
})
}

View File

@ -1,4 +1,4 @@
import fetch from 'utils/fetch'
import fetch from '@/utils/fetch'
export function loginByUsername(username, password) {
const data = {

View File

@ -1,4 +1,4 @@
import fetch from 'utils/fetch'
import fetch from '@/utils/fetch'
export function getToken() {
return fetch({

View File

@ -1,4 +1,4 @@
import fetch from 'utils/fetch'
import fetch from '@/utils/fetch'
export function userSearch(name) {
return fetch({

View File

@ -0,0 +1,13 @@
<template>
<a href="https://github.com/PanJiaChen/vue-element-admin" target="_blank" class="github-corner" aria-label="View source on Github">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#4AB7BD; color:#fff; position: absolute; top: 50px; border: 0; right: 0;"
aria-hidden="true">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"
fill="currentColor" class="octo-body"></path>
</svg>
</a>
</template>

View File

@ -8,6 +8,7 @@
<script>
import screenfull from 'screenfull'
export default {
name: 'hamburger',
props: {

View File

@ -33,6 +33,7 @@
<script>
import Todo from './Todo.vue'
const STORAGE_KEY = 'todos'
const filters = {
all: todos => todos,

View File

@ -18,7 +18,7 @@
<script>
//
import { getToken } from 'api/qiniu'
import { getToken } from '@/api/qiniu'
export default {
name: 'singleImageUpload',

View File

@ -17,8 +17,8 @@
</template>
<script>
//
import { getToken } from 'api/qiniu'
import { getToken } from '@/api/qiniu'
export default {
name: 'singleImageUpload2',
props: {
@ -61,7 +61,7 @@ export default {
})
}
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>

View File

@ -26,8 +26,8 @@
</template>
<script>
//
import { getToken } from 'api/qiniu'
import { getToken } from '@/api/qiniu'
export default {
name: 'singleImageUpload',
props: {
@ -71,7 +71,7 @@ export default {
})
}
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>

View File

@ -4,7 +4,7 @@ import 'element-ui/lib/theme-default/index.css'
import App from './App'
import router from './router'
import store from './store'
import '@/assets/iconfont/iconfont' // iconfont 具体图标见https://github.com/PanJiaChen/vue-element-admin/wiki
import '@/assets/iconfont/iconfont' // iconfont 具体图标见wiki
import IconSvg from '@/components/Icon-svg'// svg组件
import * as filters from '@/filters' // 全局filter
import '@/errorLog'// error log

View File

@ -1,21 +1,50 @@
import Mock from 'mockjs'
import { param2Obj } from '@/utils'
const List = []
const count = 20
const count = 100
for (let i = 0; i < count; i++) {
List.push(Mock.mock({
id: '@id',
title: '@ctitle(10, 20)',
'status|1': ['published', 'draft'],
id: '@increment',
timestamp: +Mock.Random.date('T'),
author: '@cname',
auditor: '@cname',
title: '@ctitle(10, 20)',
forecast: '@float(0, 100, 2, 2)',
importance: '@integer(1, 3)',
'type|1': ['CN', 'US', 'JP', 'EU'],
'status|1': ['published', 'draft', 'deleted'],
display_time: '@datetime',
pageviews: '@integer(300, 5000)'
}))
}
export default {
getList: () => List,
getList: config => {
const { importance, type, title, page = 1, limit = 20, sort } = param2Obj(config.url)
let mockList = List.filter(item => {
if (importance && item.importance !== +importance) return false
if (type && item.type !== type) return false
if (title && item.title.indexOf(title) < 0) return false
return true
})
if (sort === '-id') {
mockList = mockList.reverse()
}
const pageList = mockList.filter((item, index) => index < limit * page && index >= limit * (page - 1))
return {
total: mockList.length,
items: pageList
}
},
getPv: () => ({
pvData: [{ key: 'PC网站', pv: 1024 }, { key: 'mobile网站', pv: 1024 }, { key: 'ios', pv: 1024 }, { key: 'android', pv: 1024 }]
}),
getArticle: () => ({
id: 120000000001,
author: { key: 'mockPan' },

View File

@ -1,44 +0,0 @@
import Mock from 'mockjs'
import { param2Obj } from 'utils'
const List = []
const count = 100
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)',
forecast: '@float(0, 100, 2, 2)',
importance: '@integer(1, 3)',
'type|1': ['CN', 'US', 'JP', 'EU'],
'status|1': ['published', 'draft', 'deleted'],
pageviews: '@integer(300, 5000)'
}))
}
export default {
getList: config => {
const { importance, type, title, page, limit, sort } = param2Obj(config.url)
let mockList = List.filter(item => {
if (importance && item.importance !== +importance) return false
if (type && item.type !== type) return false
if (title && item.title.indexOf(title) < 0) return false
return true
})
if (sort === '-id') {
mockList = mockList.reverse()
}
const pageList = mockList.filter((item, index) => index < limit * page && index >= limit * (page - 1))
return {
total: mockList.length,
items: pageList
}
},
getPv: () => ({
pvData: [{ key: 'PC网站', pv: 1024 }, { key: 'mobile网站', pv: 1024 }, { key: 'ios', pv: 1024 }, { key: 'android', pv: 1024 }]
})
}

View File

@ -1,7 +1,6 @@
import Mock from 'mockjs'
import loginAPI from './login'
import articleAPI from './article'
import article_tableAPI from './article_table'
import remoteSearchAPI from './remoteSearch'
Mock.setup({
@ -16,10 +15,7 @@ Mock.mock(/\/user\/info\.*/, 'get', loginAPI.getUserInfo)
// 文章相关
Mock.mock(/\/article\/list/, 'get', articleAPI.getList)
Mock.mock(/\/article\/detail/, 'get', articleAPI.getArticle)
// table example相关
Mock.mock(/\/article_table\/list/, 'get', article_tableAPI.getList)
Mock.mock(/\/article_table\/p/, 'get', article_tableAPI.getPv)
Mock.mock(/\/article\/pv/, 'get', articleAPI.getPv)
// 搜索相关
Mock.mock(/\/search\/user/, 'get', remoteSearchAPI.searchUser)

View File

@ -1,4 +1,4 @@
import { param2Obj } from 'utils'
import { param2Obj } from '@/utils'
const userMap = {
admin: {

View File

@ -1,5 +1,5 @@
import Mock from 'mockjs'
import { param2Obj } from 'utils'
import { param2Obj } from '@/utils'
const NameList = []
const count = 100

View File

@ -104,7 +104,7 @@ export const asyncRouterMap = [
name: 'Table',
icon: 'table',
children: [
{ path: 'dynamictable', component: _import('example/table/dynamictable'), name: '动态table' },
{ path: 'dynamictable', component: _import('example/table/dynamictable/index'), name: '动态table' },
{ path: 'dragtable', component: _import('example/table/dragTable'), name: '拖拽table' },
{ path: 'inline_edit_table', component: _import('example/table/inlineEditTable'), name: 'table内编辑' },
{ path: 'table', component: _import('example/table/table'), name: '综合table' }
@ -112,7 +112,6 @@ export const asyncRouterMap = [
},
{ path: 'form/edit', icon: 'ziliaoshouce', component: _import('example/form'), name: '编辑Form', meta: { isEdit: true }},
{ path: 'form/create', icon: 'yinhangqia', component: _import('example/form'), name: '创建Form' },
{ path: 'tab/index', icon: 'mobankuangjia', component: _import('example/tab/index'), name: 'Tab' }
]
},

View File

@ -1,4 +1,4 @@
import { asyncRouterMap, constantRouterMap } from 'src/router'
import { asyncRouterMap, constantRouterMap } from '@/router'
/**
* 通过meta.role判断是否与当前用户权限匹配

View File

@ -1,5 +1,5 @@
import { loginByUsername, logout, getUserInfo } from 'api/login'
import { getToken, setToken, removeToken } from 'utils/auth'
import { loginByUsername, logout, getUserInfo } from '@/api/login'
import { getToken, setToken, removeToken } from '@/utils/auth'
const user = {
state: {

View File

@ -7,7 +7,7 @@
</template>
<script>
import keyboardChart from 'components/Charts/keyboard'
import keyboardChart from '@/components/Charts/keyboard'
export default {
components: { keyboardChart }

View File

@ -7,7 +7,7 @@
</template>
<script>
import keyboardChart2 from 'components/Charts/keyboard2'
import keyboardChart2 from '@/components/Charts/keyboard2'
export default {
components: { keyboardChart2 }

View File

@ -7,7 +7,7 @@
</template>
<script>
import lineMarker from 'components/Charts/lineMarker'
import lineMarker from '@/components/Charts/lineMarker'
export default {
components: { lineMarker }

View File

@ -7,7 +7,7 @@
</template>
<script>
import mixChart from 'components/Charts/mixChart'
import mixChart from '@/components/Charts/mixChart'
export default {
components: { mixChart }

View File

@ -9,7 +9,7 @@
<script>
import DndList from '@/components/twoDndList'
import { getList } from 'api/article'
import { fetchList } from '@/api/article'
export default {
components: { DndList },
@ -20,14 +20,14 @@ export default {
}
},
created() {
this.fetchData()
this.getData()
},
methods: {
fetchData() {
getData() {
this.listLoading = true
getList(this.listQuery).then(response => {
this.list1 = response.data.splice(0, 5)
this.list2 = response.data
fetchList().then(response => {
this.list1 = response.data.items.splice(0, 5)
this.list2 = response.data.items
})
}
}

View File

@ -11,6 +11,7 @@
<script>
import MdEditor from '@/components/MarkdownEditor'
export default {
components: { MdEditor },
data() {

View File

@ -24,7 +24,7 @@
<script>
import MdInput from '@/components/MDinput'
import PanThumb from '@/components/PanThumb'
import waves from '@/directive/waves.js'//
import waves from '@/directive/waves.js' //
export default {
components: { MdInput, PanThumb },

View File

@ -2,7 +2,7 @@
<div class="components-container">
<code>公司做的后台主要是一个cms系统公司也是以自媒体为核心的所以富文本是后台很核心的功能在选择富文本的过程中也走了不少的弯路市面上常见的富文本都基本用过了最终选择了Tinymce<a target='_blank' href='https://segmentfault.com/a/1190000009762198#articleHeader13'> 相关文章 </a> <a target='_blank' href='https://www.tinymce.com/'> 官网 </a></code>
<div>
<Tinymce :height=200 ref="editor" v-model="content"></Tinymce>
<tinymce :height=200 ref="editor" v-model="content"></tinymce>
</div>
<div class='editor-content' v-html='content'></div>
</div>

View File

@ -0,0 +1,131 @@
<template>
<div class="dashboard-editor-container">
<github></github>
<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/table">Table</router-link>
</el-col>
<el-col :span="4" class='text-center'>
<router-link class="pan-btn tiffany-btn" to="/example/form/edit">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>
<el-col :span="6">
<el-card class="box-card">
<div slot="header" class="box-card-header">
<pan-thumb class="panThumb" :image="avatar"> 你的权限:
<span class="pan-info-roles" :key='item' v-for="item in roles">{{item}}</span>
</pan-thumb>
</div>
<span class="display_name">{{name}}</span>
<div class="info-item">
<count-to class="info-item-num" :startVal='0' :endVal='statisticsData.article_count' :duration='3400'></count-to>
<span class="info-item-text">文章</span>
<icon-svg icon-class="a" class="dashboard-editor-icon"></icon-svg>
</div>
<div class="info-item">
<count-to class="info-item-num" :startVal='0' :endVal='statisticsData.pageviews_count' :duration='3600'></count-to>
<span class="info-item-text">浏览量</span>
<icon-svg icon-class="b" class="dashboard-editor-icon"></icon-svg>
</div>
</el-card>
</el-col>
<el-col :span="8">
<pie-chart></pie-chart>
</el-col>
<el-col :span="10">
<bar-chart></bar-chart>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="15">
<line-chart></line-chart>
</el-col>
<el-col :span="9">
<todo-list></todo-list>
</el-col>
</el-row>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import countTo from 'vue-count-to'
import panThumb from '@/components/PanThumb'
import todoList from '@/components/TodoList'
import Github from '@/components/Github'
import pieChart from './pieChart'
import barChart from './barChart'
import lineChart from './lineChart'
export default {
name: 'dashboard-admin',
components: { countTo, panThumb, todoList, Github, pieChart, lineChart, barChart },
data() {
return {
statisticsData: {
article_count: 1024,
pageviews_count: 1024
}
}
},
computed: {
...mapGetters([
'name',
'avatar',
'roles'
])
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.dashboard-editor-container {
margin: 30px;
.btn-group {
margin-bottom: 60px;
}
.box-card-header {
position: relative;
height: 160px;
}
.panThumb {
z-index: 100;
height: 150px;
width: 150px;
position: absolute;
left: 0px;
right: 0px;
margin: auto;
}
.display_name{
font-size: 30px;
display: block;
}
.info-item{
display: inline-block;
margin-top: 10px;
font-size: 14px;
&:last-of-type{
margin-left: 15px;
}
}
}
</style>

View File

@ -5,7 +5,7 @@
<script>
import echarts from 'echarts'
require('echarts/theme/macarons') // echarts
import { debounce } from 'utils'
import { debounce } from '@/utils'
export default {
props: {

View File

@ -1,82 +0,0 @@
<template>
<div class="dashboard-editor-container">
<div class=" clearfix">
<pan-thumb style="float: left" :image="avatar"> 你的权限:
<span class="pan-info-roles" v-for="item in roles">{{item}}</span>
</pan-thumb>
<a href="https://github.com/PanJiaChen/vue-element-admin" target="_blank" class="github-corner" aria-label="View source on Github">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#4AB7BD; color:#fff; position: absolute; top: 50px; border: 0; right: 0;"
aria-hidden="true">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"
fill="currentColor" class="octo-body"></path>
</svg>
</a>
<div class="info-container">
<span class="display_name">{{name}}</span>
<span style='font-size:20px;padding-top:20px;display:inline-block;'>普通编辑dashboard</span>
</div>
</div>
<div>
<img class='emptyGif' :src="emptyGif">
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import PanThumb from 'components/PanThumb'
export default {
name: 'dashboard-default',
components: { PanThumb },
data() {
return {
emptyGif: 'https://wpimg.wallstcn.com/0e03b7da-db9e-4819-ba10-9016ddfdaed3'
}
},
computed: {
...mapGetters([
'name',
'avatar',
'roles'
])
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.emptyGif {
display: block;
width: 45%;
margin: 0 auto;
}
.dashboard-editor-container {
background-color: #e3e3e3;
min-height: 100vh;
margin-top: -50px;
padding: 100px 60px 0px;
.pan-info-roles {
font-size: 12px;
font-weight: 700;
color: #333;
display: block;
}
.info-container {
position: relative;
margin-left: 190px;
height: 150px;
line-height: 200px;
.display_name {
font-size: 48px;
line-height: 48px;
color: #212121;
position: absolute;
top: 25px;
}
}
}
</style>

View File

@ -1,100 +1,32 @@
<template>
<div class="dashboard-editor-container">
<a href="https://github.com/PanJiaChen/vue-element-admin" target="_blank" class="github-corner" aria-label="View source on Github">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#4AB7BD; color:#fff; position: absolute; top: 50px; border: 0; right: 0;"
aria-hidden="true">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"
fill="currentColor" class="octo-body"></path>
</svg>
</a>
<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/table">Table</router-link>
</el-col>
<el-col :span="4" class='text-center'>
<router-link class="pan-btn tiffany-btn" to="/example/form/edit">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>
<el-col :span="6">
<el-card class="box-card">
<div slot="header" class="box-card-header">
<pan-thumb class="panThumb" :image="avatar"> 你的权限:
<div class=" clearfix">
<pan-thumb style="float: left" :image="avatar"> 你的权限:
<span class="pan-info-roles" :key='item' v-for="item in roles">{{item}}</span>
</pan-thumb>
</div>
<github></github>
<div class="info-container">
<span class="display_name">{{name}}</span>
<div class="info-item">
<countTo class="info-item-num" :startVal='0' :endVal='statisticsData.article_count' :duration='3400'></countTo>
<span class="info-item-text">文章</span>
<icon-svg icon-class="a" class="dashboard-editor-icon"></icon-svg>
<span style='font-size:20px;padding-top:20px;display:inline-block;'>普通编辑dashboard</span>
</div>
<div class="info-item">
<countTo class="info-item-num" :startVal='0' :endVal='statisticsData.pageviews_count' :duration='3600'></countTo>
<span class="info-item-text">浏览量</span>
<icon-svg icon-class="b" class="dashboard-editor-icon"></icon-svg>
</div>
</el-card>
</el-col>
<el-col :span="8">
<pie-chart></pie-chart>
</el-col>
<el-col :span="10">
<bar-chart></bar-chart>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="15">
<line-chart></line-chart>
</el-col>
<el-col :span="9">
<todo-list></todo-list>
</el-col>
</el-row>
<div>
<img class='emptyGif' :src="emptyGif">
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import panThumb from 'components/PanThumb'
import pieChart from './pieChart'
import barChart from './barChart'
import lineChart from './lineChart'
import countTo from 'vue-count-to'
import todoList from 'components/TodoList'
import PanThumb from '@/components/PanThumb'
import Github from '@/components/Github'
export default {
name: 'dashboard-editor',
components: { panThumb, countTo, pieChart, lineChart, barChart, todoList },
components: { PanThumb, Github },
data() {
return {
statisticsData: {
article_count: 1024,
comment_count: 102400,
latest_article: [],
month_article_count: 28,
pageviews_count: 1024
}
emptyGif: 'https://wpimg.wallstcn.com/0e03b7da-db9e-4819-ba10-9016ddfdaed3'
}
},
computed: {
@ -108,35 +40,35 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.dashboard-editor-container {
margin: 30px;
.btn-group {
margin-bottom: 60px;
.emptyGif {
display: block;
width: 45%;
margin: 0 auto;
}
.box-card-header {
position: relative;
height: 160px;
}
.panThumb {
z-index: 100;
height: 150px;
width: 150px;
position: absolute;
left: 0px;
right: 0px;
margin: auto;
}
.display_name{
font-size: 30px;
.dashboard-editor-container {
background-color: #e3e3e3;
min-height: 100vh;
margin-top: -50px;
padding: 100px 60px 0px;
.pan-info-roles {
font-size: 12px;
font-weight: 700;
color: #333;
display: block;
}
.info-item{
display: inline-block;
margin-top: 10px;
font-size: 14px;
&:last-of-type{
margin-left: 15px;
.info-container {
position: relative;
margin-left: 190px;
height: 150px;
line-height: 200px;
.display_name {
font-size: 48px;
line-height: 48px;
color: #212121;
position: absolute;
top: 25px;
}
}
}
}
</style>

View File

@ -1,35 +1,33 @@
<template>
<div class="dashboard-container">
<component v-bind:is="currentRole"> </component>
<component :is="currentRole"></component>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import EditorDashboard from './editor/index'
import DefaultDashboard from './default/index'
import adminDashboard from './admin/index'
import editorDashboard from './editor/index'
export default {
name: 'dashboard',
components: { EditorDashboard, DefaultDashboard },
components: { adminDashboard, editorDashboard },
data() {
return {
currentRole: 'EditorDashboard'
currentRole: 'adminDashboard'
}
},
computed: {
...mapGetters([
'name',
'avatar',
'introduction',
'roles'
])
},
created() {
console.log(this.roles)
if (this.roles.indexOf('admin') >= 0) {
return
}
this.currentRole = 'DefaultDashboard'
this.currentRole = 'editorDashboard'
}
}
</script>

View File

@ -27,7 +27,7 @@
</template>
<script>
import errGif from 'assets/401_images/401.gif'
import errGif from '@/assets/401_images/401.gif'
export default {
data() {

View File

@ -120,15 +120,15 @@
</template>
<script>
import Tinymce from 'components/Tinymce'
import Upload from 'components/Upload/singleImage3'
import MDinput from 'components/MDinput'
import Tinymce from '@/components/Tinymce'
import Upload from '@/components/Upload/singleImage3'
import MDinput from '@/components/MDinput'
import Multiselect from 'vue-multiselect'// 使element-uiselect
import 'vue-multiselect/dist/vue-multiselect.min.css'// css
import Sticky from 'components/Sticky' // header
import { validateURL } from 'utils/validate'
import { getArticle } from 'api/article'
import { userSearch } from 'api/remoteSearch'
import Sticky from '@/components/Sticky' // header
import { validateURL } from '@/utils/validate'
import { fetchArticle } from '@/api/article'
import { userSearch } from '@/api/remoteSearch'
export default {
name: 'articleDetail',
@ -204,7 +204,7 @@ export default {
},
methods: {
fetchData() {
getArticle().then(response => {
fetchArticle().then(response => {
this.postForm = response.data
}).catch(err => {
this.fetchSuccess = false
@ -259,6 +259,7 @@ export default {
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.title-prompt{

View File

@ -1,7 +1,8 @@
<template>
<el-table :data="list" border fit highlight-current-row style="width: 100%">
<el-table-column align="center" label="序号" width="65">
<el-table-column align="center" label="序号" width="65" v-loading="loading"
element-loading-text="请给我点时间!">
<template scope="scope">
<span>{{scope.row.id}}</span>
</template>
@ -15,7 +16,7 @@
<el-table-column min-width="300px" label="标题">
<template scope="scope">
<span class="link-type" @click="handleUpdate(scope.row)">{{scope.row.title}}</span>
<span>{{scope.row.title}}</span>
<el-tag>{{scope.row.type}}</el-tag>
</template>
</el-table-column>
@ -48,7 +49,7 @@
</template>
<script>
import { fetchList } from 'api/article_table'
import { fetchList } from '@/api/article'
export default {
props: {
@ -65,7 +66,8 @@ export default {
limit: 5,
type: this.type,
sort: '+id'
}
},
loading: false
}
},
filters: {
@ -83,9 +85,11 @@ export default {
},
methods: {
getList() {
this.loading = true
this.$emit('create') // for test
fetchList(this.listQuery).then(response => {
this.list = response.data.items
this.loading = false
})
}
}

View File

@ -47,7 +47,7 @@
<el-table-column align="center" label="拖拽" width="95">
<template scope="scope">
<icon-svg class='drag-handler' icon-class="tuozhuai" ></icon-svg>
<icon-svg class='drag-handler' icon-class="tuozhuai"></icon-svg>
</template>
</el-table-column>
@ -60,7 +60,7 @@
</template>
<script>
import { fetchList } from 'api/article_table'
import { fetchList } from '@/api/article'
import Sortable from 'sortablejs'
export default {
@ -79,9 +79,6 @@ export default {
newList: []
}
},
created() {
this.getList()
},
filters: {
statusFilter(status) {
const statusMap = {
@ -92,6 +89,9 @@ export default {
return statusMap[status]
}
},
created() {
this.getList()
},
methods: {
getList() {
this.listLoading = true
@ -109,7 +109,6 @@ export default {
setSort() {
const el = document.querySelectorAll('.el-table__body-wrapper > table > tbody')[0]
this.sortable = Sortable.create(el, {
// handle: '.drag-handler',
onEnd: evt => {
const tempIndex = this.newList.splice(evt.oldIndex, 1)[0]
this.newList.splice(evt.newIndex, 0, tempIndex)
@ -120,7 +119,7 @@ export default {
}
</script>
<style >
<style scoped>
.drag-handler{
width: 30px;
height: 30px;

View File

@ -2,7 +2,7 @@
<div class="app-container">
<div class="filter-container">
<el-checkbox-group v-model="checkboxVal" >
<el-checkbox-group v-model="checkboxVal">
<el-checkbox label="apple">apple</el-checkbox>
<el-checkbox label="banana">banana</el-checkbox>
<el-checkbox label="orange">orange</el-checkbox>

View File

@ -9,8 +9,8 @@
</template>
<script>
import fixedThead from './dynamictable/fixedThead'
import unfixedThead from './dynamictable/unfixedThead'
import fixedThead from './fixedThead'
import unfixedThead from './unfixedThead'
export default {
components: { fixedThead, unfixedThead }

View File

@ -42,8 +42,7 @@
<el-table-column align="center" label="编辑" width="120">
<template scope="scope">
<el-button v-show='!scope.row.edit' type="primary" @click='scope.row.edit=true' size="small" icon="edit">编辑</el-button>
<el-button v-show='scope.row.edit' type="success" @click='scope.row.edit=false' size="small" icon="check">完成</el-button>
<el-button :type="scope.row.edit?'success':'primary'" @click='scope.row.edit=!scope.row.edit' size="small" icon="edit">{{scope.row.edit?'完成':'编辑'}}</el-button>
</template>
</el-table-column>
@ -52,7 +51,7 @@
</template>
<script>
import { fetchList } from 'api/article_table'
import { fetchList } from '@/api/article'
export default {
name: 'inline_edit-table_demo',
@ -66,9 +65,6 @@ export default {
}
}
},
created() {
this.getList()
},
filters: {
statusFilter(status) {
const statusMap = {
@ -79,6 +75,9 @@ export default {
return statusMap[status]
}
},
created() {
this.getList()
},
methods: {
getList() {
this.listLoading = true

View File

@ -25,7 +25,7 @@
<el-checkbox class="filter-item" @change='tableKey=tableKey+1' v-model="showAuditor">显示审核人</el-checkbox>
</div>
<el-table :key='tableKey' :data="list" v-loading.body="listLoading" border fit highlight-current-row style="width: 100%">
<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">
<template scope="scope">
@ -150,9 +150,9 @@
</template>
<script>
import { fetchList, fetchPv } from 'api/article_table'
import { fetchList, fetchPv } from '@/api/article'
import waves from '@/directive/waves.js'//
import { parseTime } from 'utils'
import { parseTime } from '@/utils'
const calendarTypeOptions = [
{ key: 'CN', display_name: '中国' },
@ -161,7 +161,7 @@ const calendarTypeOptions = [
{ key: 'EU', display_name: '欧元区' }
]
// arr to obj
// arr to obj
const calendarTypeKeyValue = calendarTypeOptions.reduce((acc, cur) => {
acc[cur.key] = cur.display_name
return acc
@ -210,9 +210,6 @@ export default {
tableKey: 0
}
},
created() {
this.getList()
},
filters: {
statusFilter(status) {
const statusMap = {
@ -226,6 +223,9 @@ export default {
return calendarTypeKeyValue[type]
}
},
created() {
this.getList()
},
methods: {
getList() {
this.listLoading = true

View File

@ -12,17 +12,17 @@
{{scope.row.title}}
</template>
</el-table-column>
<el-table-column label="作者" width="110">
<el-table-column label="作者" width="95" align="center">
<template scope="scope">
<span>{{scope.row.author}}</span>
<el-tag>{{scope.row.author}}</el-tag>
</template>
</el-table-column>
<el-table-column label="阅读数" width="105" align="center">
<el-table-column label="阅读数" width="115" align="center">
<template scope="scope">
{{scope.row.pageviews}}
</template>
</el-table-column>
<el-table-column align="center" prop="created_at" label="发布时间" width="200">
<el-table-column align="center" prop="created_at" label="发布时间" width="220">
<template scope="scope">
<i class="el-icon-time"></i>
<span>{{scope.row.display_time}}</span>
@ -33,7 +33,7 @@
</template>
<script>
import { getList } from 'api/article'
import { fetchList } from '@/api/article'
export default {
data() {
@ -49,8 +49,8 @@ export default {
methods: {
fetchData() {
this.listLoading = true
getList().then(response => {
this.list = response.data
fetchList().then(response => {
this.list = response.data.items
this.listLoading = false
})
},

View File

@ -14,17 +14,17 @@
{{scope.row.title}}
</template>
</el-table-column>
<el-table-column label="作者" width="110">
<el-table-column label="作者" width="95" align="center">
<template scope="scope">
<span>{{scope.row.author}}</span>
<el-tag>{{scope.row.author}}</el-tag>
</template>
</el-table-column>
<el-table-column label="阅读数" width="105" align="center">
<el-table-column label="阅读数" width="115" align="center">
<template scope="scope">
{{scope.row.pageviews}}
</template>
</el-table-column>
<el-table-column align="center" prop="created_at" label="发布时间" width="200">
<el-table-column align="center" prop="created_at" label="发布时间" width="220">
<template scope="scope">
<i class="el-icon-time"></i>
<span>{{scope.row.display_time}}</span>
@ -35,7 +35,7 @@
</template>
<script>
import { getList } from 'api/article'
import { fetchList } from '@/api/article'
export default {
data() {
@ -52,8 +52,8 @@ export default {
methods: {
fetchData() {
this.listLoading = true
getList(this.listQuery).then(response => {
this.list = response.data
fetchList(this.listQuery).then(response => {
this.list = response.data.items
this.listLoading = false
})
},

View File

@ -37,7 +37,7 @@
</template>
<script>
import { isvalidUsername } from 'utils/validate'
import { isvalidUsername } from '@/utils/validate'
import socialSign from './socialsignin'
export default {

View File

@ -10,7 +10,7 @@
</template>
<script>
import openWindow from 'utils/openWindow'
import openWindow from '@/utils/openWindow'
export default {
name: 'social-signin',

View File

@ -7,8 +7,9 @@
<script>
import { getToken } from 'api/qiniu' // token Access Key,Secret Key,buckettoken
// sdk https://developer.qiniu.com/sdk#official-sdk
import { getToken } from '@/api/qiniu'
// token Access Key,Secret Key,buckettoken
// sdk https://developer.qiniu.com/sdk#official-sdk
export default{
data() {

View File

@ -44,7 +44,7 @@
<script>
import { toggleClass } from 'utils'
import { toggleClass } from '@/utils'
import '@/assets/custom-theme/index.css' // element-ui css
export default {