refactor:format code
This commit is contained in:
Pan
parent
6d6a9df5b8
commit
339d760771
17 changed files with 77 additions and 58 deletions
|
|
@ -11,6 +11,6 @@
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import '~normalize.css/normalize.css';// normalize.css 样式格式化
|
||||
@import './styles/index.scss'; // 全局自定义的css样式
|
||||
@import '~normalize.css/normalize.css'; // normalize.css 样式格式化
|
||||
@import './styles/index.scss'; // 全局自定义样式
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ function pluralize(time, label) {
|
|||
}
|
||||
return time + label + 's'
|
||||
}
|
||||
|
||||
export function timeAgo(time) {
|
||||
const between = Date.now() / 1000 - Number(time)
|
||||
if (between < 3600) {
|
||||
|
|
|
|||
1
src/icons/svg/documentation.svg
Normal file
1
src/icons/svg/documentation.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<?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="1510826638494" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1669" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M743.253333 144.184889H374.499556v734.378667H743.253333a92.017778 92.017778 0 0 0 92.16-91.818667V235.975111a91.989333 91.989333 0 0 0-92.16-91.790222z m-0.398222 293.888c0.398222 20.48-1.507556 26.794667-9.756444 26.794667-3.612444 0.597333-9.415111-1.621333-17.863111-8.874667-12.657778-8.931556-21.504-16.753778-29.155556-21.617778-6.798222-5.888-17.550222-5.205333-24.291556 0-8.874667 4.949333-21.532444 15.872-28.814222 21.617778-8.988444 7.907556-15.018667 8.874667-17.180444 8.874667-8.618667 0-10.837333-7.424-10.496-26.794667l-0.312889-223.601778c0-21.162667 8.561778-24.376889 17.265778-24.376889h103.708444c10.552889 0 17.294222 4.835556 17.294222 24.376889l-0.398222 223.601778zM190.122667 235.975111V786.773333a92.046222 92.046222 0 0 0 92.188444 91.818667h46.08V144.184889h-46.08a92.017778 92.017778 0 0 0-92.188444 91.790222z" fill="" p-id="1670"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -2,6 +2,7 @@ export default {
|
|||
route: {
|
||||
dashboard: 'Dashboard',
|
||||
introduction: 'Introduction',
|
||||
documentation: 'Documentation',
|
||||
permission: 'Permission',
|
||||
icons: 'Icons',
|
||||
components: 'Components',
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import Vue from 'vue'
|
||||
import elementEnLocale from 'element-ui/lib/locale/lang/en'
|
||||
import elementZhLocale from 'element-ui/lib/locale/lang/zh-CN'
|
||||
import enLocale from './en'
|
||||
import zhLocale from './zh'
|
||||
import VueI18n from 'vue-i18n'
|
||||
import Cookies from 'js-cookie'
|
||||
import elementEnLocale from 'element-ui/lib/locale/lang/en' // element-ui lang
|
||||
import elementZhLocale from 'element-ui/lib/locale/lang/zh-CN'// element-ui lang
|
||||
import enLocale from './en'
|
||||
import zhLocale from './zh'
|
||||
|
||||
Vue.use(VueI18n)
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ export default {
|
|||
route: {
|
||||
dashboard: '首页',
|
||||
introduction: '简述',
|
||||
documentation: '文档',
|
||||
permission: '权限测试页',
|
||||
icons: '图标',
|
||||
components: '组件',
|
||||
|
|
|
|||
|
|
@ -23,4 +23,5 @@ Mock.mock(/\/search\/user/, 'get', remoteSearchAPI.searchUser)
|
|||
|
||||
// 账单相关
|
||||
Mock.mock(/\/transaction\/list/, 'get', transactionAPI.getList)
|
||||
|
||||
export default Mock
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
import Vue from 'vue'
|
||||
import Router from 'vue-router'
|
||||
const _import = require('./_import_' + process.env.NODE_ENV)
|
||||
// in development env not use Lazy Loading,because Lazy Loading too many pages will cause webpack hot update too slow.so only in production use Lazy Loading
|
||||
// in development-env not use lazy-loading, because lazy-loading too many pages will cause webpack hot update too slow. so only in production use lazy-loading;
|
||||
// detail: https://panjiachen.github.io/vue-element-admin-site/#/lazy-loading
|
||||
|
||||
Vue.use(Router)
|
||||
|
||||
/* layout */
|
||||
/* Layout */
|
||||
import Layout from '../views/layout/Layout'
|
||||
|
||||
/**
|
||||
* hidden: true if `hidden:true` will not show in the sidebar(default is false)
|
||||
* redirect: noredirect if `redirect:noredirect` will no redirct in the levelbar
|
||||
* 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
|
||||
* name:'router-name' the name is used by <keep-alive> (must set!!!)
|
||||
* meta : {
|
||||
role: ['admin'] will control the page role
|
||||
title: 'title' the name show in submenu and levelbar
|
||||
icon: 'svg-name' the icon show in the sidebar,
|
||||
noCache: true if fasle ,the page will no be cached(default is false)
|
||||
role: ['admin','editor'] will control the page role (you can set multiple roles)
|
||||
title: 'title' the name show in submenu and breadcrumb (recommend set)
|
||||
icon: 'svg-name' the icon show in the sidebar,
|
||||
noCache: true if fasle ,the page will no be cached(default is false)
|
||||
}
|
||||
**/
|
||||
|
||||
export const constantRouterMap = [
|
||||
{ path: '/login', component: _import('login/index'), hidden: true },
|
||||
{ path: '/authredirect', component: _import('login/authredirect'), hidden: true },
|
||||
{ path: '/404', component: _import('errorPage/404'), hidden: true },
|
||||
{ path: '/401', component: _import('errorPage/401'), hidden: true },
|
||||
|
||||
{
|
||||
path: '',
|
||||
component: Layout,
|
||||
|
|
@ -36,16 +36,15 @@ export const constantRouterMap = [
|
|||
meta: { title: 'dashboard', icon: 'dashboard' }
|
||||
}]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/introduction',
|
||||
path: '/documentation',
|
||||
component: Layout,
|
||||
redirect: '/introduction/index',
|
||||
redirect: '/documentation/index',
|
||||
children: [{
|
||||
path: 'index',
|
||||
component: _import('introduction/index'),
|
||||
name: 'introduction',
|
||||
meta: { title: 'introduction', icon: 'people' }
|
||||
component: _import('documentation/index'),
|
||||
name: 'documentation',
|
||||
meta: { title: 'documentation', icon: 'documentation', noCache: true }
|
||||
}]
|
||||
}
|
||||
]
|
||||
|
|
@ -81,7 +80,7 @@ export const asyncRouterMap = [
|
|||
path: 'index',
|
||||
component: _import('svg-icons/index'),
|
||||
name: 'icons',
|
||||
meta: { title: 'icons', icon: 'icon' }
|
||||
meta: { title: 'icons', icon: 'icon', noCache: true }
|
||||
}]
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
@import './mixin.scss';
|
||||
@import './transition.scss';
|
||||
@import './btn.scss';
|
||||
@import './element-ui.scss';
|
||||
@import './sidebar.scss';
|
||||
@import './btn.scss';
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import echarts from 'echarts'
|
|||
require('echarts/theme/macarons') // echarts 主题
|
||||
import { debounce } from '@/utils'
|
||||
|
||||
const animationDuration = 3000
|
||||
const animationDuration = 6000
|
||||
export default {
|
||||
props: {
|
||||
className: {
|
||||
|
|
|
|||
|
|
@ -93,7 +93,7 @@ export default {
|
|||
z-index: 100;
|
||||
height: 70px!important;
|
||||
width: 70px!important;
|
||||
position: absolute;
|
||||
position: absolute!important;
|
||||
top: -45px;
|
||||
left: 0px;
|
||||
border: 5px solid #ffffff;
|
||||
|
|
|
|||
|
|
@ -21,7 +21,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='3600'></count-to>
|
||||
<count-to class="card-panel-num" :startVal='0' :endVal='81212' :duration='4000'></count-to>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
|
|
@ -32,7 +32,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='3600'></count-to>
|
||||
<count-to class="card-panel-num" :startVal='0' :endVal='9280' :duration='4000'></count-to>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
|
|
@ -43,7 +43,7 @@
|
|||
</div>
|
||||
<div class='card-panel-description'>
|
||||
<div class='card-panel-text'>Shoppings</div>
|
||||
<count-to class="card-panel-num" :startVal='0' :endVal='1299' :duration='3600'></count-to>
|
||||
<count-to class="card-panel-num" :startVal='0' :endVal='13600' :duration='4600'></count-to>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
|
|
@ -104,7 +104,7 @@ const lineChartData = {
|
|||
},
|
||||
messages: {
|
||||
expectedData: [200, 192, 120, 144, 160, 130, 140],
|
||||
actualData: [180, 160, 101, 106, 145, 150, 130]
|
||||
actualData: [180, 160, 151, 106, 145, 150, 130]
|
||||
},
|
||||
purchases: {
|
||||
expectedData: [80, 100, 121, 104, 105, 90, 100],
|
||||
|
|
|
|||
39
src/views/documentation/index.vue
Normal file
39
src/views/documentation/index.vue
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="wrapper">
|
||||
<code>
|
||||
<ul>
|
||||
<li>
|
||||
<a target='_blank' href="https://github.com/PanJiaChen/vue-element-admin/">项目地址</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target='_blank' href="https://panjiachen.github.io/vue-element-admin-site/#/">详细文档</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target='_blank' href="https://juejin.im/post/59097cd7a22b9d0065fb61d2">手摸手，带你用 vue 撸后台 系列一(基础篇)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target='_blank' href="https://juejin.im/post/591aa14f570c35006961acac">手摸手，带你用 vue 撸后台 系列二(登录权限篇)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target='_blank' href="https://juejin.im/post/593121aa0ce4630057f70d35">手摸手，带你用 vue 撸后台 系列三 (实战篇)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target='_blank' href="https://juejin.im/post/595b4d776fb9a06bbe7dba56">手摸手，带你用vue撸后台 系列四(vueAdmin 一个极简的后台基础模板)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target='_blank' href="https://segmentfault.com/a/1190000009090836">手摸手，带你封装一个vue component</a>
|
||||
</li>
|
||||
</ul>
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<style scoped>
|
||||
.wrapper{
|
||||
width: 800px;
|
||||
margin: 30px auto;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="wrapper">
|
||||
<code>
|
||||
这半年来一直在用vue写管理后台，目前后台已经有百来个个页面，十几种权限，但维护成本依然很低，所以准备开源分享一下后台开发的经验和成果。目前的技术栈主要的采用vue+element+axios由webpack2打包.由于是个人项目，所以数据请求都是用了mockjs模拟。注意：在次项目基础上改造开发时请移除mock文件。
|
||||
写了一个系列的教程配套文章，如何从零构建后一个完整的后台项目:
|
||||
<ul>
|
||||
<li><a target='_blank' class='lin' href="https://github.com/PanJiaChen/vue-element-admin/">项目地址</a></li>
|
||||
<li><a target='_blank' class='lin' href="https://github.com/PanJiaChen/vue-element-admin/wiki">wiki</a></li>
|
||||
<li><a target='_blank' href="https://juejin.im/post/59097cd7a22b9d0065fb61d2">手摸手，带你用 vue 撸后台 系列一(基础篇)</a></li>
|
||||
<li><a target='_blank' href="https://juejin.im/post/591aa14f570c35006961acac">手摸手，带你用 vue 撸后台 系列二(登录权限篇)</a></li>
|
||||
<li><a target='_blank' href="https://juejin.im/post/593121aa0ce4630057f70d35">手摸手，带你用 vue 撸后台 系列三 (实战篇)</a></li>
|
||||
<li><a target='_blank' href="https://juejin.im/post/595b4d776fb9a06bbe7dba56">手摸手，带你用vue撸后台 系列四(vueAdmin 一个极简的后台基础模板)</a></li>
|
||||
<li><a target='_blank' href="https://segmentfault.com/a/1190000009090836">手摸手，带你封装一个vue component</a></li>
|
||||
</ul>
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.wrapper{
|
||||
width: 800px;
|
||||
margin: 30px auto;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div style='margin-bottom:15px;'>你的权限： {{roles}}</div>
|
||||
<div style="margin-bottom:15px;">你的权限： {{roles}}</div>
|
||||
切换权限：
|
||||
<el-radio-group v-model="role">
|
||||
<el-radio-button label="editor"></el-radio-button>
|
||||
|
|
@ -12,6 +12,7 @@
|
|||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default{
|
||||
name: 'permission',
|
||||
data() {
|
||||
return {
|
||||
role: ''
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ import icons from './generateIconsView'
|
|||
import clipboard from '@/utils/clipboard' // use clipboard directly
|
||||
|
||||
export default {
|
||||
name: 'icons',
|
||||
data() {
|
||||
return {
|
||||
iconsMap: []
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<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>
|
||||
<a class='link-type link-title' target="_blank" href='https://panjiachen.github.io/vue-element-admin-site/#/theme'>换肤文档</a>
|
||||
</div>
|
||||
<div class="box-item">
|
||||
<span class="field-label">换肤:</span>
|
||||
|
|
|
|||
Loading…
Reference in a new issue