├── .browserslistrc ├── cypress.json ├── tests ├── unit │ ├── .eslintrc.js │ └── example.spec.js └── e2e │ ├── .eslintrc.js │ ├── specs │ └── test.js │ ├── support │ ├── index.js │ └── commands.js │ └── plugins │ └── index.js ├── postcss.config.js ├── dist ├── favicon.ico ├── img │ ├── 404.70700566.jpg │ ├── logo.894572d9.png │ ├── bg-img-1.807bd009.jpg │ ├── lajifenlei.bf4aec9d.png │ └── iconfont.aae4d5ba.svg ├── fonts │ ├── element-icons.535877f5.woff │ └── element-icons.732389de.ttf ├── css │ ├── home.a30b6065.css │ ├── tables.d90ae196.css │ ├── charts.09959efd.css │ ├── users.eaec730e.css │ ├── dashboard.4d19cea6.css │ └── app.02ab5746.css ├── js │ ├── home.a7687f85.js │ ├── charts.c94f195a.js │ ├── home.a7687f85.js.map │ ├── tables.5ae64fdf.js │ ├── charts.c94f195a.js.map │ ├── dashboard.168ef4be.js │ └── app.5589acba.js └── index.html ├── public ├── favicon.ico └── index.html ├── src ├── assets │ ├── logo.png │ ├── logo1.png │ ├── images │ │ ├── 404.jpg │ │ ├── menu.png │ │ ├── loading.gif │ │ ├── menu2.png │ │ └── bg-img-1.jpg │ ├── lajifenlei.png │ ├── icons │ │ ├── iconfont.eot │ │ ├── iconfont.ttf │ │ ├── iconfont.woff │ │ ├── iconfont.woff2 │ │ ├── iconfont.svg │ │ ├── iconfont.css │ │ └── iconfont.js │ └── styles │ │ ├── common.css │ │ └── reset.css ├── views │ ├── tables │ │ ├── Tables.vue │ │ ├── details │ │ │ └── Details.vue │ │ └── list │ │ │ └── List.vue │ ├── 404.vue │ ├── setting │ │ └── Setting.vue │ ├── users │ │ ├── Login.vue │ │ └── Register.vue │ ├── charts │ │ ├── Diagram.vue │ │ └── Slider.vue │ └── dashboard │ │ └── Dashboard.vue ├── store │ ├── getters.js │ ├── index.js │ └── modules │ │ ├── user.js │ │ └── app.js ├── components │ ├── footer │ │ └── Footer.vue │ ├── breadcrumb │ │ └── Breadcrumb.vue │ ├── loading │ │ └── Loading.vue │ ├── scrolltotop │ │ └── Scrolltotop.vue │ ├── header │ │ └── Header.vue │ ├── slider │ │ └── TableAndRing.vue │ └── sidebar │ │ └── Sidebar.vue ├── plugins │ ├── vcharts.js │ └── element.js ├── main.js ├── App.vue ├── utils │ └── resizeHandler.js ├── containers │ └── Full.vue ├── axios.js └── router.js ├── babel.config.js ├── .gitignore ├── server ├── token │ ├── createToken.js │ └── checkToken.js ├── dbs │ ├── models │ │ └── users.js │ └── config.js └── interface │ └── user.js ├── .eslintrc.js ├── README.md ├── vue.config.js ├── server.js └── package.json /.browserslistrc: -------------------------------------------------------------------------------- 1 | > 1% 2 | last 2 versions 3 | not ie <= 8 4 | -------------------------------------------------------------------------------- /cypress.json: -------------------------------------------------------------------------------- 1 | { 2 | "pluginsFile": "tests/e2e/plugins/index.js" 3 | } 4 | -------------------------------------------------------------------------------- /tests/unit/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | env: { 3 | mocha: true 4 | } 5 | } -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | autoprefixer: {} 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /dist/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/dist/favicon.ico -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/logo.png -------------------------------------------------------------------------------- /src/assets/logo1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/logo1.png -------------------------------------------------------------------------------- /dist/img/404.70700566.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/dist/img/404.70700566.jpg -------------------------------------------------------------------------------- /dist/img/logo.894572d9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/dist/img/logo.894572d9.png -------------------------------------------------------------------------------- /src/assets/images/404.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/images/404.jpg -------------------------------------------------------------------------------- /src/assets/images/menu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/images/menu.png -------------------------------------------------------------------------------- /src/assets/lajifenlei.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/lajifenlei.png -------------------------------------------------------------------------------- /src/assets/icons/iconfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/icons/iconfont.eot -------------------------------------------------------------------------------- /src/assets/icons/iconfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/icons/iconfont.ttf -------------------------------------------------------------------------------- /src/assets/images/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/images/loading.gif -------------------------------------------------------------------------------- /src/assets/images/menu2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/images/menu2.png -------------------------------------------------------------------------------- /dist/img/bg-img-1.807bd009.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/dist/img/bg-img-1.807bd009.jpg -------------------------------------------------------------------------------- /src/assets/icons/iconfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/icons/iconfont.woff -------------------------------------------------------------------------------- /src/assets/icons/iconfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/icons/iconfont.woff2 -------------------------------------------------------------------------------- /src/assets/images/bg-img-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/src/assets/images/bg-img-1.jpg -------------------------------------------------------------------------------- /dist/img/lajifenlei.bf4aec9d.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/dist/img/lajifenlei.bf4aec9d.png -------------------------------------------------------------------------------- /dist/fonts/element-icons.535877f5.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/dist/fonts/element-icons.535877f5.woff -------------------------------------------------------------------------------- /dist/fonts/element-icons.732389de.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/caochangkui/vue-element-responsive-demo/HEAD/dist/fonts/element-icons.732389de.ttf -------------------------------------------------------------------------------- /src/views/tables/Tables.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 12 | -------------------------------------------------------------------------------- /tests/e2e/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: [ 3 | 'cypress' 4 | ], 5 | env: { 6 | mocha: true, 7 | 'cypress/globals': true 8 | }, 9 | rules: { 10 | strict: 'off' 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/store/getters.js: -------------------------------------------------------------------------------- 1 | const getters = { 2 | sidebar: state => state.app.sidebar, 3 | device: state => state.app.device, 4 | token: state => state.user.token, 5 | username: state => state.user.username 6 | } 7 | export default getters 8 | -------------------------------------------------------------------------------- /tests/e2e/specs/test.js: -------------------------------------------------------------------------------- 1 | // https://docs.cypress.io/api/introduction/api.html 2 | 3 | describe('My First Test', () => { 4 | it('Visits the app root url', () => { 5 | cy.visit('/') 6 | cy.contains('h1', 'Welcome to Your Vue.js App') 7 | }) 8 | }) 9 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | "presets": [ 3 | "@vue/app" 4 | ], 5 | "plugins": [ 6 | [ 7 | "component", 8 | { 9 | "libraryName": "element-ui", 10 | "styleLibraryName": "theme-chalk" 11 | }, 12 | "syntax-dynamic-import" 13 | ] 14 | ] 15 | } -------------------------------------------------------------------------------- /dist/css/home.a30b6065.css: -------------------------------------------------------------------------------- 1 | .notFind{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-width:600px;margin:50px auto}.notFind img{max-width:80%;margin-bottom:50px} -------------------------------------------------------------------------------- /src/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | import app from './modules/app' 4 | import user from './modules/user' 5 | import getters from './getters' 6 | 7 | Vue.use(Vuex) 8 | 9 | const store = new Vuex.Store({ 10 | modules: { 11 | app, 12 | user 13 | }, 14 | getters 15 | }) 16 | 17 | export default store 18 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | 4 | /tests/e2e/videos/ 5 | /tests/e2e/screenshots/ 6 | 7 | # local env files 8 | .env.local 9 | .env.*.local 10 | 11 | # Log files 12 | npm-debug.log* 13 | yarn-debug.log* 14 | yarn-error.log* 15 | 16 | # Editor directories and files 17 | .idea 18 | .vscode 19 | *.suo 20 | *.ntvs* 21 | *.njsproj 22 | *.sln 23 | *.sw* 24 | -------------------------------------------------------------------------------- /server/token/createToken.js: -------------------------------------------------------------------------------- 1 | const jwt = require('jsonwebtoken') 2 | 3 | // jsonwebtoken中文文档：https://segmentfault.com/a/1190000009494020 4 | module.exports = function (user_id) { 5 | const token = jwt.sign( 6 | { 7 | user_id: user_id 8 | }, 9 | 'cedric1990', 10 | { 11 | expiresIn: '60s' 12 | } 13 | ) 14 | 15 | return token 16 | } -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | env: { 4 | node: true 5 | }, 6 | 'extends': [ 7 | 'plugin:vue/essential', 8 | 'eslint:recommended' 9 | ], 10 | rules: { 11 | 'no-console': 'off', 12 | 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off' 13 | }, 14 | parserOptions: { 15 | parser: 'babel-eslint' 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /src/components/footer/Footer.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 11 | 12 | 21 | -------------------------------------------------------------------------------- /src/plugins/vcharts.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import VeLine from 'v-charts/lib/line.common' 3 | import VeGauge from 'v-charts/lib/gauge.common' 4 | import VeHistogram from 'v-charts/lib/histogram.common' 5 | import VeRing from 'v-charts/lib/ring.common' 6 | 7 | Vue.component(VeLine.name, VeLine) 8 | Vue.component(VeGauge.name, VeGauge) 9 | Vue.component(VeHistogram.name, VeHistogram) 10 | Vue.component(VeRing.name, VeRing) 11 | -------------------------------------------------------------------------------- /tests/unit/example.spec.js: -------------------------------------------------------------------------------- 1 | import { expect } from 'chai' 2 | import { shallowMount } from '@vue/test-utils' 3 | import HelloWorld from '@/components/HelloWorld.vue' 4 | 5 | describe('HelloWorld.vue', () => { 6 | it('renders props.msg when passed', () => { 7 | const msg = 'new message' 8 | const wrapper = shallowMount(HelloWorld, { 9 | propsData: { msg } 10 | }) 11 | expect(wrapper.text()).to.include(msg) 12 | }) 13 | }) 14 | -------------------------------------------------------------------------------- /src/views/tables/details/Details.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 19 | 20 | 30 | -------------------------------------------------------------------------------- /server/dbs/models/users.js: -------------------------------------------------------------------------------- 1 | // users模型 2 | const mongoose = require('mongoose') 3 | const Schema = mongoose.Schema 4 | const UserSchema = new Schema({ 5 | username: { 6 | type: String, 7 | unique: true, 8 | required: true 9 | }, 10 | password: { 11 | type: String, 12 | required: true 13 | }, 14 | email: { 15 | type: String, 16 | required: true 17 | }, 18 | token: { 19 | type: String, 20 | required: true 21 | } 22 | }) 23 | 24 | module.exports = { 25 | Users: mongoose.model('User', UserSchema) 26 | } 27 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | import router from './router' 4 | import store from './store/index' 5 | import VueAwesomeSwiper from 'vue-awesome-swiper' 6 | import './assets/styles/reset.css' 7 | import './assets/styles/common.css' 8 | import './plugins/element.js' 9 | import './plugins/vcharts.js' 10 | import 'swiper/dist/css/swiper.css' 11 | import '@/assets/icons/iconfont.css' 12 | 13 | Vue.config.productionTip = false 14 | 15 | Vue.use(VueAwesomeSwiper) 16 | 17 | new Vue({ 18 | router, 19 | store, 20 | render: h => h(App) 21 | }).$mount('#app') -------------------------------------------------------------------------------- /server/token/checkToken.js: -------------------------------------------------------------------------------- 1 | const jwt = require('jsonwebtoken') 2 | 3 | // 检查 token 4 | module.exports = async (ctx, next) => { 5 | // 检验是否存在 token 6 | // axios.js 中设置了 authorization 7 | const authorization = ctx.get('Authorization') 8 | if (authorization === '') { 9 | ctx.throw(401, 'no token detected in http headerAuthorization') 10 | } 11 | 12 | const token = authorization.split(' ')[1] 13 | 14 | // 检验 token 是否已过期 15 | try { 16 | await jwt.verify(token, 'cedric1990') 17 | } catch (err) { 18 | ctx.throw(401, 'invalid token') 19 | } 20 | 21 | await next() 22 | } 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vue + element 响应式后台模板 2 | 3 | ## Project setup 4 | ``` 5 | npm install 6 | ``` 7 | 8 | ### Compiles and hot-reloads for development 9 | ``` 10 | npm run serve 11 | ``` 12 | 13 | ### Compiles and minifies for production 14 | ``` 15 | npm run build 16 | ``` 17 | 18 | 19 | 20 | ## 主要功能 21 | 22 | - 响应式侧边栏 23 | - 面包屑导航（结合router.js） 24 | - 路由动效 25 | - 阿里巴巴矢量icon引入 26 | - 公用样式 27 | - stylus预处理CSS 28 | - 路由懒加载 29 | - 路由拦截 30 | - axios请求拦截 31 | - vuex 状态分模块管理 32 | 33 | 另外，在以上基础上做了真实登录注册功能，参考：https://www.cnblogs.com/cckui/p/10536122.html 34 | - Koa2+MongoDB+Redis登录注册 35 | - 邮箱验证码服务 36 | 37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | 19 | 20 | 31 | -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | vue-element-demo 9 | 10 | 11 | 14 |
15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/views/404.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 20 | 21 | 32 | -------------------------------------------------------------------------------- /dist/js/home.a7687f85.js: -------------------------------------------------------------------------------- 1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["home"],{"2e60":function(t,n,e){t.exports=e.p+"img/404.70700566.jpg"},"8cdb":function(t,n,e){"use strict";e.r(n);var c=function(){var t=this,n=t.$createElement,c=t._self._c||n;return c("div",{staticClass:"notFind"},[c("img",{attrs:{src:e("2e60"),alt:""}}),c("el-button",{attrs:{type:"primary",round:""},on:{click:t.backHome}},[t._v("返回首页")])],1)},o=[],a={name:"NotFind",methods:{backHome:function(){this.$router.push({path:"/"})}}},i=a,s=(e("a886c"),e("5511")),r=Object(s["a"])(i,c,o,!1,null,null,null);n["default"]=r.exports},"947b":function(t,n,e){},a886c:function(t,n,e){"use strict";var c=e("947b"),o=e.n(c);o.a}}]); 2 | //# sourceMappingURL=home.a7687f85.js.map -------------------------------------------------------------------------------- /tests/e2e/support/index.js: -------------------------------------------------------------------------------- 1 | // *********************************************************** 2 | // This example support/index.js is processed and 3 | // loaded automatically before your test files. 4 | // 5 | // This is a great place to put global configuration and 6 | // behavior that modifies Cypress. 7 | // 8 | // You can change the location of this file or turn off 9 | // automatically serving support files with the 10 | // 'supportFile' configuration option. 11 | // 12 | // You can read more here: 13 | // https://on.cypress.io/configuration 14 | // *********************************************************** 15 | 16 | // Import commands.js using ES2015 syntax: 17 | import './commands' 18 | 19 | // Alternatively you can use CommonJS syntax: 20 | // require('./commands') 21 | -------------------------------------------------------------------------------- /vue.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | runtimeCompiler: true, 3 | publicPath: './', // 设置打包文件相对路径, baseUrl 已被官方不建议使用 4 | 5 | devServer: { 6 | // host: 'localhost', 7 | port: 9527, 8 | open: process.platform === 'darwin', //配置自动启动浏览器 9 | https: false, 10 | hotOnly: false, 11 | proxy: { // 跨域请求代理 https://www.cnblogs.com/cckui/p/10331432.html 12 | '/api': { 13 | target: 'http://127.0.0.1:8888/', // 接口地址 14 | changeOrigin: true, 15 | ws: true, 16 | pathRewrite: { 17 | '^/': '' 18 | } 19 | } 20 | } 21 | }, 22 | productionSourceMap: true, // 生产环境是否生成 sourceMap 文件 23 | 24 | // configureWebpack: { 25 | // performance:{ // webpack打包压缩限制报错这里禁掉这个warning信息 26 | // hints: false 27 | // } 28 | // } 29 | } 30 | -------------------------------------------------------------------------------- /dist/css/tables.d90ae196.css: -------------------------------------------------------------------------------- 1 | .collection{margin:40px auto}.collection .new{width:100%;margin-bottom:20px;height:40px;background:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer}.collection .new i{color:#03a9f4;padding-right:10px}.collection .page{height:40px;margin-top:20px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.collection .page .el-pagination,.details{background:#fff}.details{padding:20px;margin:0 auto}.details .title{font-size:28px;padding:0 0 30px 0}.setting{background:#fff;padding:20px;max-width:1100px;margin:0 auto}.setting .title{font-size:28px;padding:0 0 30px 0} -------------------------------------------------------------------------------- /server/dbs/config.js: -------------------------------------------------------------------------------- 1 | // 数据库和邮箱配置文件 2 | const dbs = 'mongodb://127.0.0.1:27017/vue-element-login-register' 3 | const redis = { 4 | get host() { 5 | return '127.0.0.1' 6 | }, 7 | get port() { 8 | return 6379 9 | } 10 | } 11 | const smtp = { 12 | get host() { 13 | return 'smtp.qq.com' 14 | }, 15 | get user() { 16 | return '*********@qq.com' // qq邮箱名 17 | }, 18 | get pass() { 19 | return '*************' // qq邮箱授权码 20 | }, 21 | // 邮箱验证码 22 | get code() { 23 | return () => { 24 | return Math.random() 25 | .toString(16) 26 | .slice(2, 6) 27 | .toUpperCase() 28 | } 29 | }, 30 | // 定义验证码过期时间rules，5分钟内邮箱 31 | get expire() { 32 | return () => { 33 | return new Date().getTime() + 5 * 60 * 1000 34 | } 35 | } 36 | } 37 | 38 | module.exports = { 39 | dbs, 40 | redis, 41 | smtp 42 | } 43 | -------------------------------------------------------------------------------- /src/store/modules/user.js: -------------------------------------------------------------------------------- 1 | const user = { 2 | state: { 3 | token: localStorage.getItem('token'), 4 | username: localStorage.getItem('username') 5 | }, 6 | 7 | mutations: { 8 | BIND_LOGIN: (state, data) => { 9 | localStorage.setItem('token', data) 10 | state.token = data 11 | }, 12 | BIND_LOGOUT: (state) => { 13 | localStorage.removeItem('token') 14 | state.token = null 15 | }, 16 | SAVE_USER: (state, data) => { 17 | localStorage.setItem('username', data) 18 | state.username = data 19 | } 20 | }, 21 | 22 | // actions: { 23 | // bindLogin({ commit }, data){ 24 | // commit('BIND_LOGIN', data) 25 | // }, 26 | // bindLogout({ commit }){ 27 | // commit('BIND_LOGOUT') 28 | // }, 29 | // saveUser({ commit }, data){ 30 | // commit('SAVE_USER', data) 31 | // } 32 | // } 33 | } 34 | 35 | export default user 36 | -------------------------------------------------------------------------------- /tests/e2e/support/commands.js: -------------------------------------------------------------------------------- 1 | // *********************************************** 2 | // This example commands.js shows you how to 3 | // create various custom commands and overwrite 4 | // existing commands. 5 | // 6 | // For more comprehensive examples of custom 7 | // commands please read more here: 8 | // https://on.cypress.io/custom-commands 9 | // *********************************************** 10 | // 11 | // 12 | // -- This is a parent command -- 13 | // Cypress.Commands.add("login", (email, password) => { ... }) 14 | // 15 | // 16 | // -- This is a child command -- 17 | // Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... }) 18 | // 19 | // 20 | // -- This is a dual command -- 21 | // Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... }) 22 | // 23 | // 24 | // -- This is will overwrite an existing command -- 25 | // Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... }) 26 | -------------------------------------------------------------------------------- /src/components/breadcrumb/Breadcrumb.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 26 | 27 | 37 | -------------------------------------------------------------------------------- /tests/e2e/plugins/index.js: -------------------------------------------------------------------------------- 1 | // https://docs.cypress.io/guides/guides/plugins-guide.html 2 | 3 | // if you need a custom webpack configuration you can uncomment the following import 4 | // and then use the `file:preprocessor` event 5 | // as explained in the cypress docs 6 | // https://docs.cypress.io/api/plugins/preprocessors-api.html#Examples 7 | 8 | /* eslint-disable import/no-extraneous-dependencies, global-require, arrow-body-style */ 9 | // const webpack = require('@cypress/webpack-preprocessor') 10 | 11 | module.exports = (on, config) => { 12 | // on('file:preprocessor', webpack({ 13 | // webpackOptions: require('@vue/cli-service/webpack.config'), 14 | // watchOptions: {} 15 | // })) 16 | 17 | return Object.assign({}, config, { 18 | fixturesFolder: 'tests/e2e/fixtures', 19 | integrationFolder: 'tests/e2e/specs', 20 | screenshotsFolder: 'tests/e2e/screenshots', 21 | videosFolder: 'tests/e2e/videos', 22 | supportFile: 'tests/e2e/support/index.js' 23 | }) 24 | } 25 | -------------------------------------------------------------------------------- /src/store/modules/app.js: -------------------------------------------------------------------------------- 1 | import Cookies from 'js-cookie' 2 | 3 | const app = { 4 | state: { 5 | sidebar: { 6 | opened: !+Cookies.get('sidebarStatus') 7 | }, 8 | device: 'desktop' 9 | }, 10 | mutations: { 11 | TOGGLE_SIDEBAR: state => { 12 | if (state.sidebar.opened) { 13 | Cookies.set('sidebarStatus', 1) 14 | } else { 15 | Cookies.set('sidebarStatus', 0) 16 | } 17 | state.sidebar.opened = !state.sidebar.opened 18 | }, 19 | CLOSE_SIDEBAR: (state) => { 20 | Cookies.set('sidebarStatus', 1) 21 | state.sidebar.opened = false 22 | }, 23 | TOGGLE_DEVICE: (state, device) => { 24 | state.device = device 25 | } 26 | }, 27 | actions: { 28 | ToggleSideBar: ({ commit }) => { 29 | commit('TOGGLE_SIDEBAR') 30 | }, 31 | CloseSideBar({ commit } ) { 32 | commit('CLOSE_SIDEBAR') 33 | }, 34 | ToggleDevice({ commit }, device) { 35 | commit('TOGGLE_DEVICE', device) 36 | } 37 | } 38 | } 39 | 40 | export default app 41 | -------------------------------------------------------------------------------- /src/components/loading/Loading.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 14 | 15 | 48 | -------------------------------------------------------------------------------- /src/utils/resizeHandler.js: -------------------------------------------------------------------------------- 1 | import store from '@/store' 2 | 3 | const { body } = document 4 | const WIDTH = 992 // refer to Bootstrap's responsive design 5 | 6 | export default { 7 | watch: { 8 | $route() { 9 | if (this.$store.state.app.device === 'mobile' && this.$store.state.app.sidebar.opened) { 10 | store.dispatch('CloseSideBar') 11 | } 12 | } 13 | }, 14 | beforeMount() { 15 | window.addEventListener('resize', this.resizeHandler) 16 | }, 17 | mounted() { 18 | const isMobile = this.isMobile() 19 | if (isMobile) { 20 | store.dispatch('ToggleDevice', 'mobile') 21 | store.dispatch('CloseSideBar') 22 | } 23 | }, 24 | methods: { 25 | isMobile() { 26 | const rect = body.getBoundingClientRect() 27 | return rect.width - 1 < WIDTH 28 | }, 29 | resizeHandler() { 30 | if (!document.hidden) { 31 | const isMobile = this.isMobile() 32 | store.dispatch('ToggleDevice', isMobile ? 'mobile' : 'desktop') 33 | 34 | if (isMobile) { 35 | store.dispatch('CloseSideBar') 36 | } 37 | } 38 | } 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /src/assets/styles/common.css: -------------------------------------------------------------------------------- 1 | /* 渐隐渐现动效 */ 2 | .fade-enter-active, 3 | .fade-leave-active { 4 | transition: all 0.4s ease; 5 | } 6 | /* .fade-enter, .fade-leave-to { 7 | opacity: 0.1; 8 | } */ 9 | .fade-enter { 10 | opacity: 0; 11 | transform: translateY(-20px); 12 | } 13 | 14 | .fade-leave-to { 15 | opacity: 0; 16 | transform: translateY(20px); 17 | } 18 | 19 | /* containers/Full容器内微滑动 动效 */ 20 | .fade-transform-leave-active, 21 | .fade-transform-enter-active { 22 | transition: all .3s; 23 | } 24 | 25 | .fade-transform-enter { 26 | opacity: 0; 27 | transform: translateX(-20px); 28 | } 29 | 30 | .fade-transform-leave-to { 31 | opacity: 0; 32 | transform: translateX(20px); 33 | } 34 | 35 | /* 返回顶部 */ 36 | .slide-enter-active,.slide-leave-active { 37 | transition: all 0.2s; 38 | } 39 | .slide-enter,.slide-leave-to { 40 | transform: translate3d(0, 100px, 0); 41 | } 42 | 43 | /* 面包屑导航动画 */ 44 | .breadcrumb-enter-active, 45 | .breadcrumb-leave-active { 46 | transition: all .4s; 47 | } 48 | 49 | .breadcrumb-enter, 50 | .breadcrumb-leave-active { 51 | opacity: 0; 52 | transform: translateX(30px); 53 | } 54 | 55 | .breadcrumb-leave-active { 56 | position: absolute; 57 | } 58 | 59 | @media (max-width: 768px) { 60 | .el-message-box { 61 | max-width: 300px; 62 | } 63 | } 64 | -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | vue-element-demo
-------------------------------------------------------------------------------- /server.js: -------------------------------------------------------------------------------- 1 | // server端启动入口 2 | const Koa = require('koa') 3 | const app = new Koa(); 4 | const mongoose = require('mongoose') 5 | const bodyParser = require('koa-bodyparser') 6 | const session = require('koa-generic-session') 7 | const Redis = require('koa-redis') 8 | const json = require('koa-json') // 美化json格式化 9 | const dbConfig = require('./server/dbs/config') 10 | 11 | const users = require('./server/interface/user.js').router 12 | 13 | // 一些session和redis相关配置 14 | app.keys = ['keys', 'keyskeys'] 15 | app.proxy = true 16 | app.use( 17 | session({ 18 | key: 'vueEle', // 前缀 19 | prefix: 'vueEle:uid', // 前缀 20 | store: new Redis() 21 | }) 22 | ) 23 | 24 | app.use(bodyParser({ 25 | extendTypes: ['json', 'form', 'text'] 26 | })) 27 | 28 | app.use(json()) 29 | 30 | // 连接数据库 31 | mongoose.connect( 32 | dbConfig.dbs, 33 | { useNewUrlParser: true } 34 | ) 35 | 36 | mongoose.set('useNewUrlParser', true) 37 | mongoose.set('useFindAndModify', false) 38 | mongoose.set('useCreateIndex', true) 39 | 40 | const db = mongoose.connection 41 | mongoose.Promise = global.Promise // 防止Mongoose: mpromise 错误 42 | 43 | db.on('error', function () { 44 | console.log('数据库连接出错') 45 | }) 46 | 47 | db.on('open', function () { 48 | console.log('数据库连接成功') 49 | }) 50 | 51 | // 路由 52 | app.use(users.routes()).use(users.allowedMethods()) 53 | 54 | app.listen(8888, () => { 55 | console.log('This server is running at http://localhost:' + 8888) 56 | }) 57 | -------------------------------------------------------------------------------- /dist/img/iconfont.aae4d5ba.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 8 | Created by iconfont 9 | 10 | 11 | 12 | 13 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /src/assets/icons/iconfont.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 8 | Created by iconfont 9 | 10 | 11 | 12 | 13 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /dist/css/charts.09959efd.css: -------------------------------------------------------------------------------- 1 | .diagram{width:100%}.diagram .total{height:440px;width:100%;background:#fff;padding:10px 12px;margin-bottom:20px;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}.diagram .total .select-wrapper{position:absolute;right:10px;top:6px;padding:0 .4rem;z-index:9}.diagram .total .select-wrapper .el-button{margin-right:6px}.diagram .total .el-tabs__item{font-size:16px}.diagram .products{min-height:400px;background:#fff;padding:10px 16px;margin-bottom:20px;position:relative}.diagram .products h4{font-size:18px;font-weight:700;padding:0 0 12px 0}.diagram .products .diagram{height:100px;padding-bottom:12px}.diagram .products .diagram .swiper-container{height:100px}.diagram .products .diagram .swiper-container .swiper-slide{background:rgba(215,241,233,.4);border-radius:8px;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around;cursor:pointer}.diagram .products .diagram .swiper-container .swiper-slide.active{background:#9df5da}.diagram .products .diagram .swiper-container .swiper-slide .text{color:#555;font-size:16px}.diagram .products .diagram .swiper-container .swiper-slide .text p{font-size:14px;color:#666;padding:16px 0}.diagram .products .diagram .swiper-container .swiper-slide .text span{font-size:20px;font-weight:700;color:#333}.diagram .products .charts h5{font-weight:700}@media (max-width:920px){.select-wrapper{display:none}} -------------------------------------------------------------------------------- /src/containers/Full.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 51 | 52 | 73 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vue-element-demo", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "serve": "vue-cli-service serve", 7 | "build": "vue-cli-service build", 8 | "lint": "vue-cli-service lint", 9 | "test:e2e": "vue-cli-service test:e2e", 10 | "test:unit": "vue-cli-service test:unit" 11 | }, 12 | "dependencies": { 13 | "ajv": "^6.7.0", 14 | "axios": "^0.18.0", 15 | "crypto-js": "^3.1.9-1", 16 | "echarts": "^4.1.0", 17 | "element-ui": "^2.4.5", 18 | "js-cookie": "^2.2.0", 19 | "jsonwebtoken": "^8.5.0", 20 | "jspdf": "^1.5.3", 21 | "koa": "^2.7.0", 22 | "koa-bodyparser": "^4.2.1", 23 | "koa-generic-session": "^2.0.1", 24 | "koa-json": "^2.0.2", 25 | "koa-redis": "^3.1.3", 26 | "koa-router": "^7.4.0", 27 | "mongoose": "^5.4.19", 28 | "nodemailer": "^5.1.1", 29 | "nodemon": "^1.18.10", 30 | "v-charts": "^1.19.0", 31 | "vue": "^2.5.21", 32 | "vue-awesome-swiper": "^3.1.3", 33 | "vue-router": "^3.0.1", 34 | "vuex": "^3.0.1" 35 | }, 36 | "devDependencies": { 37 | "@babel/plugin-syntax-dynamic-import": "^7.2.0", 38 | "@vue/cli-plugin-babel": "^3.1.1", 39 | "@vue/cli-plugin-e2e-cypress": "^3.1.1", 40 | "@vue/cli-plugin-eslint": "^3.1.1", 41 | "@vue/cli-plugin-unit-mocha": "^3.1.1", 42 | "@vue/cli-service": "^3.1.1", 43 | "@vue/test-utils": "^1.0.0-beta.20", 44 | "babel-eslint": "^10.0.1", 45 | "babel-plugin-component": "^1.1.1", 46 | "chai": "^4.1.2", 47 | "eslint": "^5.8.0", 48 | "eslint-plugin-vue": "^5.0.0", 49 | "stylus": "^0.54.5", 50 | "stylus-loader": "^3.0.2", 51 | "vue-cli-plugin-element": "^1.0.1", 52 | "vue-template-compiler": "^2.5.21" 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /src/components/scrolltotop/Scrolltotop.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 47 | 48 | 71 | -------------------------------------------------------------------------------- /src/assets/icons/iconfont.css: -------------------------------------------------------------------------------- 1 | @font-face {font-family: "iconfont"; 2 | src: url('iconfont.eot?t=1552123170809'); /* IE9 */ 3 | src: url('iconfont.eot?t=1552123170809#iefix') format('embedded-opentype'), /* IE6-IE8 */ 4 | url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAL8AAsAAAAABwwAAAKtAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgqBbIFhATYCJAMMCwgABCAFhG0HQBsxBsgekiQlCogQgo4rCEGY4uFrDX1/d+8CAApQZSIBxxMU0ZhOFZB0pDs+QhV1XeB/1/QPAFVe1TDXVlaNSLWsDpMDatOM2aJQBL5Cb3Ju81g3gD5x77TpC8d+luU2x8DuUxfFcUCB7oFRERVIQN4wdtVSeUj3CTQbN6Boe2IuDpUKvCwQL01dhspCUlHMSqNQN+wt4rNKY3qTfgCf1Pfjn3BUklQZXrvzeFyDoZ+JXz1567qbgkS1nB/mITIWgELcbiyeKBEmu0SzsbS7sVaEtFTm+hqlDMz1Qf94iajh9lYwAw3poVRMRvCrRwE5yItrNGEbOAL0Xn+lYEbOrXXtd5qg8Sa6+Umd1qN4IplMrTad3m3dVne+vd9+yNRl1Nb+ptrFxPnW+JlrK8rWm043PwCDXVjnk2/8J/O98Fp4GbRmxmbGofz1utBEA7RJOC/foRKONl421j54fT3uPubzrroDdUp91whIcG9+lc7B9ddMzOt/+jduXwRPxIbl/40tBZzfXQdU/PprMSwMGu8jFPxX1cCBEmiwKxdPyZRRJVtUdtcOzUHENRzt9jXd3Dc4T2gsqEwkDcaQNZogF/oCKi2WUGu0hmbzJg+36MGUiNKEOfsAodMLknZfkHV6Ixf6Jyr9/lHrjBI0O4qeM1tMhVm9xYjMiYaUZWSqvkeph1fHnVGizzsyy2uUMElY3sygEA6WK5PEI2yJDfkFPcw5RZT5LpoAjxHH8VGW+RZROTY4z0YEgTa9CKu+C9W2MISMIzSIYhliUvk8VIznqiufjyJ08xwy1kHoyycRTJ45PRKCBQeQJ43eIMKjPJO3QBfGcRRCMT4XMgH8hEOKPiTbPMtCqDjMmJDPihDQMDrUiLc3u/93AprhvTlS5CjqB7KpyV6dtK0YrGDLJgAAAAA=') format('woff2'), 5 | url('iconfont.woff?t=1552123170809') format('woff'), 6 | url('iconfont.ttf?t=1552123170809') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ 7 | url('iconfont.svg?t=1552123170809#iconfont') format('svg'); /* iOS 4.1- */ 8 | } 9 | 10 | [class^="el-icon-newfont"], [class*=" el-icon-newfont"] { 11 | font-family: "iconfont" !important; 12 | font-size: 16px; 13 | font-style: normal; 14 | -webkit-font-smoothing: antialiased; 15 | -moz-osx-font-smoothing: grayscale; 16 | } 17 | 18 | .el-icon-newfont-caidan:before { 19 | content: "\e655"; 20 | } 21 | 22 | .el-icon-newfont-caidanzhankai:before { 23 | content: "\e728"; 24 | } 25 | 26 | -------------------------------------------------------------------------------- /src/axios.js: -------------------------------------------------------------------------------- 1 | // axios 配置 2 | import axios from 'axios' 3 | import store from './store' 4 | import router from './router' 5 | 6 | //创建 axios 实例 7 | let instance = axios.create({ 8 | timeout: 5000, // 请求超过5秒即超时返回错误 9 | headers: { 'Content-Type': 'application/json;charset=UTF-8' }, 10 | }) 11 | 12 | instance.interceptors.request.use( 13 | config => { 14 | if (store.getters.token) { // 若存在token，则每个Http Header都加上token 15 | config.headers.Authorization = `token ${store.getters.token}` 16 | console.log('拿到token') 17 | } 18 | console.log('request请求配置', config) 19 | return config 20 | }, 21 | err => { 22 | return Promise.reject(err) 23 | }) 24 | 25 | // http response 拦截器 26 | instance.interceptors.response.use( 27 | response => { 28 | console.log('成功响应：', response) 29 | return response 30 | }, 31 | error => { 32 | if (error.response) { 33 | switch (error.response.status) { 34 | case 401: 35 | // 返回 401 (未授权) 清除 token 并跳转到登录页面 36 | store.commit('BIND_LOGOUT') 37 | router.replace({ 38 | path: '/login', 39 | query: { 40 | redirect: router.currentRoute.fullPath 41 | } 42 | }) 43 | break 44 | default: 45 | console.log('服务器出错，请稍后重试！') 46 | alert('服务器出错，请稍后重试！') 47 | } 48 | } 49 | return Promise.reject(error.response) // 返回接口返回的错误信息 50 | } 51 | ) 52 | 53 | export default { 54 | // 发送验证码 55 | userVerify (data) { 56 | return instance.post('/api/verify', data) 57 | }, 58 | // 注册 59 | userRegister (data) { 60 | return instance.post('/api/register', data) 61 | }, 62 | // 登录 63 | userLogin (data) { 64 | return instance.post('/api/login', data) 65 | }, 66 | // 获取用户列表 67 | getAllUser () { 68 | return instance.get('/api/alluser') 69 | }, 70 | // 删除用户 71 | delUser (data) { 72 | return instance.post('/api/deluser', data) 73 | } 74 | } 75 | -------------------------------------------------------------------------------- /src/plugins/element.js: -------------------------------------------------------------------------------- 1 | // element 按需引入 2 | import Vue from 'vue' 3 | import { 4 | Container, 5 | Header, 6 | Aside, 7 | Main, 8 | Footer, 9 | Row, 10 | Col, 11 | Pagination, 12 | Dialog, 13 | Button, 14 | Input, 15 | Table, 16 | TableColumn, 17 | Form, 18 | FormItem, 19 | Dropdown, 20 | Breadcrumb, 21 | BreadcrumbItem, 22 | Autocomplete, 23 | DropdownMenu, 24 | DropdownItem, 25 | Menu, 26 | Submenu, 27 | MenuItem, 28 | MenuItemGroup, 29 | MessageBox, 30 | Message, 31 | Loading, 32 | Notification, 33 | DatePicker, 34 | TimeSelect, 35 | TimePicker, 36 | Tabs, 37 | Select, 38 | Option, 39 | OptionGroup, 40 | TabPane, 41 | Tooltip, 42 | progress, 43 | Carousel, 44 | CarouselItem, 45 | Upload 46 | } from 'element-ui' 47 | 48 | Vue.use(Container) 49 | Vue.use(Header) 50 | Vue.use(Aside) 51 | Vue.use(Main) 52 | Vue.use(Footer) 53 | Vue.use(Row) 54 | Vue.use(Col) 55 | Vue.use(Pagination) 56 | Vue.use(Dialog) 57 | Vue.use(Button) 58 | Vue.use(Form) 59 | Vue.use(Input) 60 | Vue.use(Table) 61 | Vue.use(TableColumn) 62 | Vue.use(FormItem) 63 | Vue.use(Dropdown) 64 | Vue.use(Autocomplete) 65 | Vue.use(DropdownMenu) 66 | Vue.use(DropdownItem) 67 | Vue.use(Breadcrumb) 68 | Vue.use(BreadcrumbItem) 69 | Vue.use(Menu) 70 | Vue.use(Submenu) 71 | Vue.use(MenuItem) 72 | Vue.use(MenuItemGroup) 73 | Vue.use(Loading.directive) 74 | Vue.use(DatePicker) 75 | Vue.use(TimeSelect) 76 | Vue.use(TimePicker) 77 | Vue.use(Tabs) 78 | Vue.use(TabPane) 79 | Vue.use(Tooltip) 80 | Vue.use(progress) 81 | Vue.use(Carousel) 82 | Vue.use(CarouselItem) 83 | Vue.use(Upload) 84 | Vue.use(Select) 85 | Vue.use(Option) 86 | Vue.use(OptionGroup) 87 | Vue.prototype.$loading = Loading.service 88 | Vue.prototype.$msgbox = MessageBox 89 | Vue.prototype.$alert = MessageBox.alert 90 | Vue.prototype.$confirm = MessageBox.confirm 91 | Vue.prototype.$prompt = MessageBox.prompt 92 | Vue.prototype.$notify = Notification 93 | Vue.prototype.$message = Message 94 | -------------------------------------------------------------------------------- /src/assets/icons/iconfont.js: -------------------------------------------------------------------------------- 1 | !function(d){var e,a='',t=(e=document.getElementsByTagName("script"))[e.length-1].getAttribute("data-injectcss");if(t&&!d.__iconfont__svg__cssinject__){d.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(e){console&&console.log(e)}}!function(e){if(document.addEventListener)if(~["complete","loaded","interactive"].indexOf(document.readyState))setTimeout(e,0);else{var t=function(){document.removeEventListener("DOMContentLoaded",t,!1),e()};document.addEventListener("DOMContentLoaded",t,!1)}else document.attachEvent&&(n=e,o=d.document,i=!1,c=function(){i||(i=!0,n())},(a=function(){try{o.documentElement.doScroll("left")}catch(e){return void setTimeout(a,50)}c()})(),o.onreadystatechange=function(){"complete"==o.readyState&&(o.onreadystatechange=null,c())});var n,o,i,c,a}(function(){var e,t,n,o,i,c;(e=document.createElement("div")).innerHTML=a,a=null,(t=e.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",n=t,(o=document.body).firstChild?(i=n,(c=o.firstChild).parentNode.insertBefore(i,c)):o.appendChild(n))})}(window); -------------------------------------------------------------------------------- /dist/js/charts.c94f195a.js: -------------------------------------------------------------------------------- 1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["charts"],{"3f2b":function(e,t,a){},"4ae9":function(e,t,a){"use strict";var n=a("3f2b"),s=a.n(n);s.a},5303:function(e,t,a){"use strict";a.r(t);var n=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"diagram"},[a("div",{staticClass:"total"},[a("div",{staticClass:"select-wrapper"},[a("el-button",{attrs:{type:"text"}},[e._v("今日")]),a("el-button",{attrs:{type:"text"}},[e._v("本周")]),a("el-button",{attrs:{type:"text"}},[e._v("本月")]),a("el-button",{attrs:{type:"text"}},[e._v("全年")]),a("el-date-picker",{attrs:{type:"daterange",editable:!1,size:"small","picker-options":e.datePickerOptions,"range-separator":"至","start-placeholder":"开始日期","end-placeholder":"结束日期"},model:{value:e.dateValue,callback:function(t){e.dateValue=t},expression:"dateValue"}})],1),a("el-tabs",{on:{"tab-click":e.handleTab},model:{value:e.activeName,callback:function(t){e.activeName=t},expression:"activeName"}},[a("el-tab-pane",{attrs:{label:"访客",name:"invoke"}},[a("ve-line",{ref:"invoke",attrs:{data:e.invokeChartData,settings:e.invokeChartSettings}})],1),a("el-tab-pane",{attrs:{label:"关注",name:"sale"}},[a("ve-line",{ref:"sale",attrs:{data:e.saleChartData,settings:e.saleChartSettings}})],1)],1)],1)])},s=[],i=(a("cc57"),{name:"Diagram",data:function(){return this.invokeChartSettings={dimension:["时间"],scale:[!0,!0],area:!0},this.saleChartSettings={dimension:["时间"],scale:[!0,!0]},{activeName:"invoke",dateValue:"",datePickerOptions:{disabledDate:function(e){return e.getTime()>Date.now()}},invokeChartData:{columns:["时间","毛衣访客","床单访客","枕头访客"],rows:[{"时间":"10:00","毛衣访客":2800,"床单访客":1e3,"枕头访客":900},{"时间":"11:00","毛衣访客":2600,"床单访客":1200,"枕头访客":1400},{"时间":"12:00","毛衣访客":2700,"床单访客":1600,"枕头访客":1200},{"时间":"13:00","毛衣访客":3e3,"床单访客":1100,"枕头访客":1600},{"时间":"14:00","毛衣访客":3100,"床单访客":1700,"枕头访客":1900},{"时间":"15:00","毛衣访客":2900,"床单访客":2e3,"枕头访客":1800},{"时间":"16:00","毛衣访客":3300,"床单访客":1500,"枕头访客":2200}]},saleChartData:{columns:["时间","毛衣关注","床单关注","枕头关注"],rows:[{"时间":"10:00","毛衣关注":280,"床单关注":100,"枕头关注":90},{"时间":"11:00","毛衣关注":260,"床单关注":120,"枕头关注":140},{"时间":"12:00","毛衣关注":270,"床单关注":160,"枕头关注":120},{"时间":"13:00","毛衣关注":300,"床单关注":110,"枕头关注":160},{"时间":"14:00","毛衣关注":310,"床单关注":170,"枕头关注":190},{"时间":"15:00","毛衣关注":290,"床单关注":200,"枕头关注":180},{"时间":"16:00","毛衣关注":330,"床单关注":150,"枕头关注":220}]}}},watch:{activeName:function(e){var t=this;this.$nextTick((function(){t.$refs["".concat(e)].echarts.resize()}))}},methods:{handleTab:function(e){console.log(e.name)}}}),l=i,r=(a("4ae9"),a("5511")),c=Object(r["a"])(l,n,s,!1,null,null,null);t["default"]=c.exports}}]); 2 | //# sourceMappingURL=charts.c94f195a.js.map -------------------------------------------------------------------------------- /src/views/setting/Setting.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 82 | 83 | -------------------------------------------------------------------------------- /src/components/header/Header.vue: -------------------------------------------------------------------------------- 1 | 22 | 23 | 61 | 62 | 114 | -------------------------------------------------------------------------------- /src/components/slider/TableAndRing.vue: -------------------------------------------------------------------------------- 1 | 49 | 50 | 102 | 103 | 114 | -------------------------------------------------------------------------------- /src/components/sidebar/Sidebar.vue: -------------------------------------------------------------------------------- 1 | 38 | 39 | 67 | 68 | 119 | -------------------------------------------------------------------------------- /src/assets/styles/reset.css: -------------------------------------------------------------------------------- 1 | @charset "utf-8"; 2 | 3 | html { 4 | background-color: #fff; 5 | color: #000; 6 | font-size: 12px 7 | } 8 | 9 | body, 10 | ul, 11 | ol, 12 | dl, 13 | dd, 14 | h1, 15 | h2, 16 | h3, 17 | h4, 18 | h5, 19 | h6, 20 | figure, 21 | form, 22 | fieldset, 23 | legend, 24 | input, 25 | textarea, 26 | button, 27 | p, 28 | blockquote, 29 | th, 30 | td, 31 | pre, 32 | xmp { 33 | margin: 0; 34 | padding: 0 35 | } 36 | 37 | body, 38 | input, 39 | textarea, 40 | button, 41 | select, 42 | pre, 43 | xmp, 44 | tt, 45 | code, 46 | kbd, 47 | samp { 48 | line-height: 1.5; 49 | font-family: tahoma, arial, "Hiragino Sans GB", simsun, sans-serif 50 | } 51 | 52 | h1, 53 | h2, 54 | h3, 55 | h4, 56 | h5, 57 | h6, 58 | small, 59 | big, 60 | input, 61 | textarea, 62 | button, 63 | select { 64 | font-size: 100% 65 | } 66 | 67 | h1, 68 | h2, 69 | h3, 70 | h4, 71 | h5, 72 | h6 { 73 | font-family: tahoma, arial, "Hiragino Sans GB", "微软雅黑", simsun, sans-serif 74 | } 75 | 76 | h1, 77 | h2, 78 | h3, 79 | h4, 80 | h5, 81 | h6, 82 | b, 83 | strong { 84 | font-weight: normal 85 | } 86 | 87 | address, 88 | cite, 89 | dfn, 90 | em, 91 | i, 92 | optgroup, 93 | var { 94 | font-style: normal 95 | } 96 | 97 | table { 98 | border-collapse: collapse; 99 | border-spacing: 0; 100 | text-align: left 101 | } 102 | 103 | caption, 104 | th { 105 | text-align: inherit 106 | } 107 | 108 | ul, 109 | ol, 110 | menu { 111 | list-style: none 112 | } 113 | 114 | fieldset, 115 | img { 116 | border: 0 117 | } 118 | 119 | img, 120 | object, 121 | input, 122 | textarea, 123 | button, 124 | select { 125 | vertical-align: middle 126 | } 127 | 128 | article, 129 | aside, 130 | footer, 131 | header, 132 | section, 133 | nav, 134 | figure, 135 | figcaption, 136 | hgroup, 137 | details, 138 | menu { 139 | display: block 140 | } 141 | 142 | audio, 143 | canvas, 144 | video { 145 | display: inline-block; 146 | *display: inline; 147 | *zoom: 1 148 | } 149 | 150 | blockquote:before, 151 | blockquote:after, 152 | q:before, 153 | q:after { 154 | content: "\0020" 155 | } 156 | 157 | textarea { 158 | overflow: auto; 159 | resize: vertical 160 | } 161 | 162 | input, 163 | textarea, 164 | button, 165 | select, 166 | a { 167 | outline: 0 none; 168 | border: none; 169 | } 170 | 171 | button::-moz-focus-inner, 172 | input::-moz-focus-inner { 173 | padding: 0; 174 | border: 0 175 | } 176 | 177 | mark { 178 | background-color: transparent 179 | } 180 | 181 | a, 182 | ins, 183 | s, 184 | u, 185 | del { 186 | text-decoration: none 187 | } 188 | 189 | sup, 190 | sub { 191 | vertical-align: baseline 192 | } 193 | 194 | html { 195 | overflow-x: hidden; 196 | height: 100%; 197 | width: 100%; 198 | font-size: 50px; 199 | -webkit-tap-highlight-color: transparent; 200 | } 201 | 202 | /* @media screen and (min-width: 768px) { 203 | html { 204 | font-size: 60px; 205 | } 206 | } */ 207 | 208 | body { 209 | font-family: Arial, "Microsoft Yahei", "Helvetica Neue", Helvetica, sans-serif; 210 | color: #333; 211 | font-size: .28em; 212 | line-height: 1; 213 | -webkit-text-size-adjust: none; 214 | } 215 | 216 | hr { 217 | height: .02rem; 218 | margin: .1rem 0; 219 | border: medium none; 220 | border-top: .02rem solid #cacaca; 221 | } 222 | 223 | a { 224 | color: #25a4bb; 225 | text-decoration: none; 226 | } 227 | 228 | .el-popup-parent--hidden { 229 | padding-right: 0 !important; 230 | } 231 | 232 | .bg-white { 233 | background: #fff; 234 | } 235 | -------------------------------------------------------------------------------- /dist/css/users.eaec730e.css: -------------------------------------------------------------------------------- 1 | .load-container[data-v-2322154e]{margin:50px auto;width:150px;text-align:center}.load-container .load[data-v-2322154e]{width:20px;height:20px;margin:auto 6px;background-color:#1e8fc6;border-radius:100%;display:inline-block;-webkit-animation:loading-data-v-2322154e 1.4s ease-in-out infinite;animation:loading-data-v-2322154e 1.4s ease-in-out infinite;-webkit-animation-fill-mode:both;animation-fill-mode:both}.load-container .load1[data-v-2322154e]{-webkit-animation-delay:-.32s;animation-delay:-.32s}.load-container .load2[data-v-2322154e]{-webkit-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes loading-data-v-2322154e{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes loading-data-v-2322154e{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.loading-wrapper[data-v-8c1b31e0]{background:#aedff8;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.loading-wrapper[data-v-8c1b31e0],.login-wrapper[data-v-8c1b31e0]{position:fixed;top:0;right:0;left:0;bottom:0}.login-wrapper img[data-v-8c1b31e0]{position:absolute;z-index:1}.login[data-v-8c1b31e0]{max-width:340px;margin:60px auto;background:#fff;padding:20px 40px;border-radius:10px;position:relative;z-index:9}.title[data-v-8c1b31e0]{font-size:26px;line-height:50px;font-weight:700;margin:10px;text-align:center}#login-form>input[data-v-8c1b31e0]{width:100%;height:34px;display:block;margin-top:26px;background:#fff;color:#333;border:1px solid #7da9c7;outline:none;text-indent:20px;font-size:14px}#login-form>button[data-v-8c1b31e0]{width:100%;height:34px;display:block;margin-top:26px;background:#1ab2ff;color:#fff;border:1px solid #1ab2ff;outline:none;border-radius:100px;text-align:center;font-size:16px;cursor:pointer}.register[data-v-8c1b31e0]{margin-top:10px;font-size:14px;line-height:22px;text-indent:8px;color:#1ab2ff;cursor:pointer;display:inline-block}.register[data-v-8c1b31e0]:hover{color:#2c2fd6}@media (max-width:768px){.login[data-v-8c1b31e0]{max-width:260px;margin:60px auto;background:#fff;padding:20px 20px;border-radius:10px;position:relative;z-index:9}}.loading-wrapper[data-v-08332e24]{position:fixed;top:0;right:0;left:0;bottom:0;background:#aedff8;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.register-wrapper img[data-v-08332e24]{position:absolute;z-index:1}.register-wrapper[data-v-08332e24]{position:fixed;top:0;right:0;left:0;bottom:0}#register[data-v-08332e24]{max-width:340px;margin:60px auto;background:#fff;padding:20px 40px;border-radius:10px;position:relative;z-index:9}.title[data-v-08332e24]{font-size:26px;line-height:50px;font-weight:700;margin:10px;text-align:center}.el-form-item[data-v-08332e24]{text-align:center}.login[data-v-08332e24]{margin-top:10px;font-size:14px;line-height:22px;color:#1ab2ff;cursor:pointer;text-align:left;text-indent:8px;width:160px}.login[data-v-08332e24]:hover{color:#2c2fd6}.code[data-v-08332e24] .el-form-item__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.code button[data-v-08332e24]{margin-left:20px;width:140px;text-align:center}.el-button--primary[data-v-08332e24]:focus{background:#409eff;border-color:#409eff;color:#fff}@media (max-width:768px){#register[data-v-08332e24]{max-width:260px;margin:60px auto;background:#fff;padding:10px 20px;border-radius:10px;position:relative;z-index:9}} -------------------------------------------------------------------------------- /dist/js/home.a7687f85.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["webpack:///./src/assets/images/404.jpg","webpack:///./src/views/404.vue?7958","webpack:///src/views/404.vue","webpack:///./src/views/404.vue?06fe","webpack:///./src/views/404.vue","webpack:///./src/views/404.vue?7dbd"],"names":["module","exports","render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","on","backHome","_v","staticRenderFns","name","methods","$router","push","path","component"],"mappings":"2FAAAA,EAAOC,QAAU,IAA0B,wB,2CCA3C,IAAIC,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,WAAW,CAACF,EAAG,MAAM,CAACG,MAAM,CAAC,IAAM,EAAQ,QAA4B,IAAM,MAAMH,EAAG,YAAY,CAACG,MAAM,CAAC,KAAO,UAAU,MAAQ,IAAIC,GAAG,CAAC,MAAQR,EAAIS,WAAW,CAACT,EAAIU,GAAG,WAAW,IACvSC,EAAkB,GCOtB,GACEC,KAAM,UACNC,QAAS,CACPJ,SADJ,WAEMR,KAAKa,QAAQC,KAAK,CAChBC,KAAM,SCbma,I,yBCQ7aC,EAAY,eACd,EACAlB,EACAY,GACA,EACA,KACA,KACA,MAIa,aAAAM,E,qECnBf,yBAAgqB,EAAG","file":"js/home.a7687f85.js","sourcesContent":["module.exports = __webpack_public_path__ + \"img/404.70700566.jpg\";","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"notFind\"},[_c('img',{attrs:{\"src\":require(\"../assets/images/404.jpg\"),\"alt\":\"\"}}),_c('el-button',{attrs:{\"type\":\"primary\",\"round\":\"\"},on:{\"click\":_vm.backHome}},[_vm._v(\"返回首页\")])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","\n\n\n\n\n","import mod from \"-!../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--12-0!../../node_modules/_thread-loader@2.1.3@thread-loader/dist/cjs.js!../../node_modules/_babel-loader@8.0.6@babel-loader/lib/index.js!../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!../../node_modules/_vue-loader@15.8.3@vue-loader/lib/index.js??vue-loader-options!./404.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--12-0!../../node_modules/_thread-loader@2.1.3@thread-loader/dist/cjs.js!../../node_modules/_babel-loader@8.0.6@babel-loader/lib/index.js!../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!../../node_modules/_vue-loader@15.8.3@vue-loader/lib/index.js??vue-loader-options!./404.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./404.vue?vue&type=template&id=46850e9c&\"\nimport script from \"./404.vue?vue&type=script&lang=js&\"\nexport * from \"./404.vue?vue&type=script&lang=js&\"\nimport style0 from \"./404.vue?vue&type=style&index=0&lang=stylus&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/_vue-loader@15.8.3@vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n null,\n null\n \n)\n\nexport default component.exports","import mod from \"-!../../node_modules/_mini-css-extract-plugin@0.8.2@mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../node_modules/_css-loader@1.0.1@css-loader/index.js??ref--11-oneOf-1-1!../../node_modules/_vue-loader@15.8.3@vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/_postcss-loader@3.0.0@postcss-loader/src/index.js??ref--11-oneOf-1-2!../../node_modules/_stylus-loader@3.0.2@stylus-loader/index.js??ref--11-oneOf-1-3!../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!../../node_modules/_vue-loader@15.8.3@vue-loader/lib/index.js??vue-loader-options!./404.vue?vue&type=style&index=0&lang=stylus&\"; export default mod; export * from \"-!../../node_modules/_mini-css-extract-plugin@0.8.2@mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../node_modules/_css-loader@1.0.1@css-loader/index.js??ref--11-oneOf-1-1!../../node_modules/_vue-loader@15.8.3@vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/_postcss-loader@3.0.0@postcss-loader/src/index.js??ref--11-oneOf-1-2!../../node_modules/_stylus-loader@3.0.2@stylus-loader/index.js??ref--11-oneOf-1-3!../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!../../node_modules/_vue-loader@15.8.3@vue-loader/lib/index.js??vue-loader-options!./404.vue?vue&type=style&index=0&lang=stylus&\""],"sourceRoot":""} -------------------------------------------------------------------------------- /src/router.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | import store from './store/index' 4 | import Full from '@/containers/Full' 5 | // 把下面的路由 作懒加载处理 6 | const Login = () => import(/* webpackChunkName: "users" */ '@/views/users/Login.vue') 7 | const Register = () => import(/* webpackChunkName: "users" */ '@/views/users/Register.vue') 8 | const Dashboard = () => import(/* webpackChunkName: "dashboard" */ '@/views/dashboard/Dashboard.vue') 9 | const Diagram = () => import(/* webpackChunkName: "charts" */ '@/views/charts/Diagram.vue') 10 | const Slider = () => import(/* webpackChunkName: "dashboard" */ '@/views/charts/Slider.vue') 11 | const Tables = () => import(/* webpackChunkName: "tables" */ '@/views/tables/Tables.vue') 12 | const List = () => import(/* webpackChunkName: "tables" */ '@/views/tables/list/List.vue') 13 | const Details = () => import(/* webpackChunkName: "tables" */ '@/views/tables/details/Details.vue') 14 | const Setting = () => import(/* webpackChunkName: "tables" */ '@/views/setting/Setting.vue') 15 | const NotFind = () => import(/* webpackChunkName: "home" */ '@/views/404.vue') 16 | 17 | Vue.use(Router) 18 | 19 | const router = new Router({ 20 | // mode: 'history', 21 | base: process.env.BASE_URL, 22 | routes: [ 23 | { 24 | path: '/login', 25 | name: 'Login', 26 | component: Login, 27 | meta: { 28 | title: '登录' 29 | } 30 | }, 31 | { 32 | path: '/register', 33 | name: 'Register', 34 | component: Register, 35 | meta: { 36 | title: '注册' 37 | } 38 | }, 39 | { 40 | path: '/', 41 | redirect: '/dashboard', 42 | name: 'Full', 43 | component: Full, 44 | meta: { 45 | breadcrumb: '首页', 46 | requireLogin: true 47 | }, 48 | children: [ 49 | { 50 | path: '/dashboard', 51 | name: 'Dashboard', 52 | component: Dashboard, 53 | meta: { 54 | breadcrumb: 'dashboard', 55 | title: 'dashboard', 56 | requireLogin: true 57 | } 58 | }, 59 | { 60 | path: '/charts/diagram', 61 | name: 'Diagram', 62 | component: Diagram, 63 | meta: { 64 | breadcrumb: '图表一', 65 | title: 'Diagram', 66 | requireLogin: true 67 | } 68 | }, 69 | { 70 | path: '/charts/slider', 71 | name: 'Slider', 72 | component: Slider, 73 | meta: { 74 | breadcrumb: '图表二', 75 | title: 'Slider', 76 | requireLogin: true 77 | } 78 | }, 79 | { 80 | path: '/tables', 81 | redirect: '/tables/list', 82 | name: 'Tables', 83 | component: Tables, 84 | meta: { 85 | breadcrumb: '表格', 86 | requireLogin: true 87 | }, 88 | children: [ 89 | { 90 | path: '/tables/list', 91 | name: 'List', 92 | component: List, 93 | meta: { 94 | title: 'list', 95 | breadcrumb: '列表', 96 | requireLogin: true 97 | } 98 | }, 99 | { 100 | path: '/tables/details', 101 | name: 'Details', 102 | component: Details, 103 | meta: { 104 | title: 'details', 105 | breadcrumb: '详情', 106 | requireLogin: true 107 | } 108 | } 109 | ] 110 | }, 111 | { 112 | path: '/setting', 113 | name: 'Setting', 114 | component: Setting, 115 | meta: { 116 | breadcrumb: '设置', 117 | requireLogin: true 118 | }, 119 | } 120 | ] 121 | }, 122 | { 123 | path: '*', 124 | name: 'NotFind', 125 | component: NotFind, 126 | meta: { 127 | title: '404' 128 | } 129 | } 130 | ] 131 | }) 132 | 133 | // 页面刷新时，重新赋值token 134 | if (localStorage.getItem('token')) { 135 | store.commit('BIND_LOGIN', localStorage.getItem('token')) 136 | } 137 | 138 | // 全局导航钩子 139 | router.beforeEach((to, from, next) => { 140 | if (to.meta.title) { // 路由发生变化修改页面title 141 | document.title = to.meta.title 142 | } 143 | if (to.meta.requireLogin) { 144 | if (store.getters.token) { 145 | if (Object.keys(from.query).length === 0) { // 判断路由来源是否有query，处理不是目的跳转的情况 146 | next() 147 | } else { 148 | let redirect = from.query.redirect // 如果来源路由有query 149 | if (to.path === redirect) { // 避免 next 无限循环 150 | next() 151 | } else { 152 | next({ path: redirect }) // 跳转到目的路由 153 | } 154 | } 155 | } else { 156 | next({ 157 | path: '/login', 158 | query: { redirect: to.fullPath } // 将跳转的路由path作为参数，登录成功后跳转到该路由 159 | }) 160 | } 161 | } else { 162 | next() 163 | } 164 | }) 165 | 166 | export default router 167 | -------------------------------------------------------------------------------- /src/views/users/Login.vue: -------------------------------------------------------------------------------- 1 | 33 | 34 | 113 | 202 | -------------------------------------------------------------------------------- /src/views/charts/Diagram.vue: -------------------------------------------------------------------------------- 1 | 41 | 42 | 105 | 106 | 177 | -------------------------------------------------------------------------------- /dist/css/dashboard.4d19cea6.css: -------------------------------------------------------------------------------- 1 | .dashboard{width:100%}.dashboard .el-row.top-block{height:5rem}.dashboard .el-row.top-block .el-col{height:100%;margin-bottom:14px}.dashboard .el-row.top-block .el-col .grid-content{height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:4px;padding:.32rem;color:#555;position:relative}.dashboard .el-row.top-block .el-col .grid-content .title{height:.6rem;font-size:14px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.dashboard .el-row.top-block .el-col .grid-content .content,.dashboard .el-row.top-block .el-col .grid-content .title{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dashboard .el-row.top-block .el-col .grid-content .content{height:4rem;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.dashboard .el-row.top-block .el-col .grid-content .content h2{font-size:.4rem;color:#333;padding:.3rem 0}.dashboard .el-row.top-block .el-col .grid-content .content .radio{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dashboard .el-row.top-block .el-col .grid-content .content .radio.topborder{border-top:1px solid #ddd;height:.7rem}.dashboard .el-row.top-block .el-col .grid-content .content .radio div{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dashboard .el-row.top-block .el-col .grid-content .content .radio div p{padding-right:4px}.dashboard .el-row.top-block .el-col .grid-content .content .radio div .el-icon-caret-top{color:#52c41a}.dashboard .el-row.top-block .el-col .grid-content .content .radio div .el-icon-caret-bottom{color:#f5222d}.dashboard .el-row.top-block .el-col .grid-content .content .income{height:.7rem;line-height:.7rem;border-top:1px solid #ddd;color:#444}.dashboard .realtime{width:100%}.dashboard .realtime .invoke{margin-bottom:20px}.dashboard .realtime .invoke h2{font-size:18px;font-weight:700;padding:10px 20px;border-bottom:1px solid #eee}.dashboard .realtime .invoke .total{padding:10px 10PX 20px 10PX;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around}.dashboard .realtime .invoke .total div p{color:#555;padding:14px 0}.dashboard .realtime .invoke .total div span{font-size:.5rem;font-weight:700}.dashboard .realtime .right-dash .grid-content{height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:4px;padding:.32rem;color:#555;margin-bottom:14px;position:relative}.dashboard .realtime .right-dash .grid-content .title{height:.6rem;font-size:16px;color:#444;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.dashboard .realtime .right-dash .grid-content .content,.dashboard .realtime .right-dash .grid-content .title{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dashboard .realtime .right-dash .grid-content .content{height:4rem;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.dashboard .realtime .right-dash .grid-content .content h2{font-size:.3rem;color:#333;padding:.3rem 0}.dashboard .realtime .right-dash .grid-content .content .radio{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dashboard .realtime .right-dash .grid-content .content .radio.topborder{border-top:1px solid #ddd;height:.7rem}.dashboard .realtime .right-dash .grid-content .content .radio div{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dashboard .realtime .right-dash .grid-content .content .radio div p{padding-right:4px}.dashboard .realtime .right-dash .grid-content .content .radio div .el-icon-caret-top{color:#52c41a}.dashboard .realtime .right-dash .grid-content .content .radio div .el-icon-caret-bottom{color:#f5222d}.dashboard .realtime .right-dash .grid-content .content2{height:4rem;width:100%}.dashboard .realtime .right-dash .grid-content .content2 .inner{height:180px;width:180px;margin:auto}.table-and-ring{margin-bottom:16px}.table-and-ring .grid-content{padding:10px}.table-and-ring .grid-content h4{font-size:.32rem;font-weight:700;padding-bottom:.32rem}.slider{width:100%}.slider .total{height:440px;width:100%;background:#fff;padding:10px 12px;margin-bottom:20px;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}.slider .total .select-wrapper{position:absolute;right:10px;top:6px;padding:0 .4rem;z-index:9}.slider .total .select-wrapper .el-button{margin-right:6px}.slider .total .el-tabs__item{font-size:16px}.slider .products{min-height:400px;background:#fff;padding:10px 16px;margin-bottom:20px;position:relative}.slider .products h4{font-size:18px;font-weight:700;padding:0 0 12px 0}.slider .products .slider{height:100px;padding-bottom:12px}.slider .products .slider .swiper-container{height:100px}.slider .products .slider .swiper-container .swiper-slide{background:rgba(215,241,233,.4);border-radius:8px;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around;cursor:pointer}.slider .products .slider .swiper-container .swiper-slide.active{background:#9df5da}.slider .products .slider .swiper-container .swiper-slide .text{color:#555;font-size:16px}.slider .products .slider .swiper-container .swiper-slide .text p{font-size:14px;color:#666;padding:16px 0}.slider .products .slider .swiper-container .swiper-slide .text span{font-size:20px;font-weight:700;color:#333}.slider .products .charts h5{font-weight:700}@media (max-width:920px){.select-wrapper{display:none}} -------------------------------------------------------------------------------- /server/interface/user.js: -------------------------------------------------------------------------------- 1 | const Router = require('koa-router') 2 | const Redis = require('koa-redis') // key-value存储系统, 存储用户名，验证每个用户名对应的验证码是否正确 3 | const nodeMailer = require('nodemailer') // 通过node发送邮件 4 | const User = require('../dbs/models/users').Users 5 | const Email = require('../dbs/config') 6 | 7 | const createToken = require('../token/createToken.js') // 创建token 8 | const checkToken = require('../token/checkToken.js') // 验证token 9 | 10 | 11 | // 创建路由对象 12 | const router = new Router({ 13 | prefix: '/api' // 接口的统一前缀 14 | }) 15 | 16 | // 获取redis的客户端 17 | const Store = new Redis().client 18 | 19 | // 发送验证码 的接口 20 | router.post('/verify', async (ctx, next) => { 21 | const username = ctx.request.body.username 22 | const saveExpire = await Store.hget(`nodemail:${username}`, 'expire') // 拿到过期时间 23 | 24 | console.log(ctx.request.body) 25 | console.log('当前时间:', new Date().getTime()) 26 | console.log('过期时间：', saveExpire) 27 | 28 | // 检验已存在的验证码是否过期，以限制用户频繁发送验证码 29 | if (saveExpire && new Date().getTime() - saveExpire < 0) { 30 | ctx.body = { 31 | code: -1, 32 | msg: '发送过于频繁，请稍后再试' 33 | } 34 | return 35 | } 36 | 37 | // QQ邮箱smtp服务权限校验 38 | const transporter = nodeMailer.createTransport({ 39 | /** 40 | * 端口465和587用于电子邮件客户端到电子邮件服务器通信 - 发送电子邮件。 41 | * 端口465用于smtps SSL加密在任何SMTP级别通信之前自动启动。 42 | * 端口587用于msa 43 | */ 44 | host: Email.smtp.host, 45 | port: 587, 46 | secure: false, // 为true时监听465端口，为false时监听其他端口 47 | auth: { 48 | user: Email.smtp.user, 49 | pass: Email.smtp.pass 50 | } 51 | }) 52 | 53 | // 邮箱需要接收的信息 54 | const ko = { 55 | code: Email.smtp.code(), 56 | expire: Email.smtp.expire(), 57 | email: ctx.request.body.email, 58 | user: ctx.request.body.username 59 | } 60 | 61 | // 邮件中需要显示的内容 62 | const mailOptions = { 63 | from: `"认证邮件" <${Email.smtp.user}>`, // 邮件来自 64 | to: ko.email, // 邮件发往 65 | subject: '邀请码', // 邮件主题 标题 66 | html: `用户${ko.user}，您正在注册****，您的邀请码是${ko.code}` // 邮件内容 67 | } 68 | 69 | // 执行发送邮件 70 | await transporter.sendMail(mailOptions, (err, info) => { 71 | if (err) { 72 | return console.log('发送邮件失败') 73 | } else { 74 | Store.hmset(`nodemail:${ko.user}`, 'code', ko.code, 'expire', ko.expire, 'email', ko.email) 75 | } 76 | }) 77 | 78 | ctx.body = { 79 | code: 0, 80 | msg: '验证码已发送，请注意查收，可能会有延时，有效期5分钟' 81 | } 82 | }) 83 | 84 | // 接口 - 注册 85 | router.post('/register', async ctx => { 86 | const { username, password, email, code } = ctx.request.body 87 | 88 | // 验证验证码 89 | if (code) { 90 | const saveCode = await Store.hget(`nodemail:${username}`, 'code') // 拿到已存储的真实的验证码 91 | const saveExpire = await Store.hget(`nodemail:${username}`, 'expire') // 过期时间 92 | 93 | console.log(ctx.request.body) 94 | console.log('redis中保存的验证码：', saveCode) 95 | console.log('当前时间:', new Date().getTime()) 96 | console.log('过期时间：', saveExpire) 97 | 98 | // 用户提交的验证码是否等于已存的验证码 99 | if (code === saveCode) { 100 | if (new Date().getTime() - saveExpire > 0) { 101 | ctx.body = { 102 | code: -1, 103 | msg: '验证码已过期，请重新申请' 104 | } 105 | return 106 | } 107 | } else { 108 | ctx.body = { 109 | code: -1, 110 | msg: '请填写正确的验证码' 111 | } 112 | return 113 | } 114 | } else { 115 | ctx.body = { 116 | code: -1, 117 | msg: '请填写验证码' 118 | } 119 | return 120 | } 121 | 122 | // 用户名是否已经被注册 123 | const user = await User.find({ username }) 124 | if (user.length) { 125 | ctx.body = { 126 | code: -1, 127 | msg: '该用户名已被注册' 128 | } 129 | return 130 | } 131 | // 如果用户名未被注册，则写入数据库 132 | const newUser = await User.create({ 133 | username, 134 | password, 135 | email, 136 | token: createToken(this.username) 137 | }) 138 | 139 | // 如果用户名被成功写入数据库，则返回注册成功 140 | if (newUser) { 141 | ctx.body = { 142 | code: 0, 143 | msg: '注册成功', 144 | } 145 | } else { 146 | ctx.body = { 147 | code: -1, 148 | msg: '注册失败' 149 | } 150 | } 151 | }) 152 | 153 | 154 | // 接口 - 登录 155 | router.post('/login', async (ctx, next) => { 156 | const { username, password } = ctx.request.body 157 | 158 | let doc = await User.findOne({ username }) 159 | if (!doc) { 160 | console.log('该用户不存在') 161 | ctx.body = { 162 | code: -1, 163 | msg: '用户名不存在' 164 | } 165 | } else if (doc.password !== password) { 166 | ctx.body = { 167 | code: -1, 168 | msg: '密码错误' 169 | } 170 | } else if (doc.password === password) { 171 | console.log('密码正确') 172 | let token = createToken(username) 173 | console.log(token) 174 | doc.token = token 175 | try { 176 | await doc.save() 177 | ctx.body = { 178 | code: 0, 179 | msg: '登录成功', 180 | username, 181 | token 182 | } 183 | } catch (err) { 184 | ctx.body = { 185 | code: -1, 186 | msg: '登录失败，请重新登录' 187 | } 188 | } 189 | } 190 | }) 191 | 192 | // 接口 - 获取所有用户 193 | router.get('/alluser', checkToken, async (ctx, next) => { 194 | try { 195 | let result = [] 196 | let doc = await User.find({}) 197 | console.log(doc) 198 | doc.map((val, index) => { 199 | result.push({ 200 | email: val.email, 201 | username: val.username, 202 | }) 203 | }) 204 | console.log(result) 205 | ctx.body = { 206 | code: 0, 207 | msg: '查找成功', 208 | result 209 | } 210 | } catch (err) { 211 | ctx.body = { 212 | code: -1, 213 | msg: '查找失败', 214 | result: err 215 | } 216 | } 217 | }) 218 | 219 | // 接口 - 删除用户 220 | router.post('/deluser', checkToken, async (ctx, next) => { 221 | const { username } = ctx.request.body 222 | 223 | try { 224 | await User.findOneAndRemove({username: username}) 225 | ctx.body = { 226 | code: 0, 227 | msg: '删除成功', 228 | } 229 | } catch (err) { 230 | ctx.body = { 231 | code: -1, 232 | msg: '删除失败', 233 | } 234 | } 235 | }) 236 | 237 | module.exports = { 238 | router 239 | } 240 | 241 | -------------------------------------------------------------------------------- /src/views/tables/list/List.vue: -------------------------------------------------------------------------------- 1 | 83 | 84 | 184 | 185 | 211 | -------------------------------------------------------------------------------- /dist/js/tables.5ae64fdf.js: -------------------------------------------------------------------------------- 1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["tables"],{"1be1":function(e,t,a){},"275d":function(e,t,a){"use strict";a.r(t);var l=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"collection"},[a("el-dialog",{attrs:{title:"新建商品",visible:e.dialogFormVisible},on:{"update:visible":function(t){e.dialogFormVisible=t}}},[a("el-form",{attrs:{model:e.newForm}},[a("el-form-item",{attrs:{label:"名称","label-width":e.formLabelWidth}},[a("el-input",{attrs:{autocomplete:"off"},model:{value:e.newForm.name,callback:function(t){e.$set(e.newForm,"name",t)},expression:"newForm.name"}})],1),a("el-form-item",{attrs:{label:"类型","label-width":e.formLabelWidth}},[a("el-select",{attrs:{placeholder:"请选择商品类型"},model:{value:e.newForm.region,callback:function(t){e.$set(e.newForm,"region",t)},expression:"newForm.region"}},[a("el-option",{attrs:{label:"111",value:"MySQL"}}),a("el-option",{attrs:{label:"Oracle",value:"Oracle"}})],1)],1),a("el-form-item",{attrs:{label:"地址","label-width":e.formLabelWidth}},[a("el-input",{attrs:{autocomplete:"off"},model:{value:e.newForm.address,callback:function(t){e.$set(e.newForm,"address",t)},expression:"newForm.address"}})],1),a("el-form-item",{attrs:{label:"用户名","label-width":e.formLabelWidth}},[a("el-input",{attrs:{autocomplete:"off"},model:{value:e.newForm.username,callback:function(t){e.$set(e.newForm,"username",t)},expression:"newForm.username"}})],1),a("el-form-item",{attrs:{label:"密码","label-width":e.formLabelWidth}},[a("el-input",{attrs:{autocomplete:"off"},model:{value:e.newForm.password,callback:function(t){e.$set(e.newForm,"password",t)},expression:"newForm.password"}})],1),a("el-form-item",{attrs:{label:"描述","label-width":e.formLabelWidth}},[a("el-input",{attrs:{autocomplete:"off"},model:{value:e.newForm.describe,callback:function(t){e.$set(e.newForm,"describe",t)},expression:"newForm.describe"}})],1)],1),a("div",{staticClass:"dialog-footer",attrs:{slot:"footer"},slot:"footer"},[a("el-button",{on:{click:function(t){e.dialogFormVisible=!1}}},[e._v("取 消")]),a("el-button",{attrs:{type:"primary"},on:{click:function(t){e.dialogFormVisible=!1}}},[e._v("测试连接")]),a("el-button",{attrs:{type:"primary"},on:{click:function(t){e.dialogFormVisible=!1}}},[e._v("确 定")])],1)],1),a("div",{staticClass:"table-box"},[a("el-table",{ref:"multipleTable",staticStyle:{width:"100%"},attrs:{data:e.tableData,"tooltip-effect":"dark"},on:{"selection-change":e.handleSelectionChange}},[a("el-table-column",{attrs:{type:"selection",width:"55",align:"center"}}),a("el-table-column",{attrs:{prop:"dataName",label:"商品",width:"180",align:"center"}}),a("el-table-column",{attrs:{prop:"creator",label:"创建人",width:"",align:"center"}}),a("el-table-column",{attrs:{prop:"createTime",label:"创建时间",width:"",align:"center"}}),a("el-table-column",{attrs:{prop:"changeTime",label:"修改时间",width:"",align:"center"}}),a("el-table-column",{attrs:{label:"操作",width:"300",align:"center"},scopedSlots:e._u([{key:"default",fn:function(t){return[a("el-button",{attrs:{type:"primary",size:"small"},on:{click:e.handleDelete}},[e._v("删除")]),a("el-button",{attrs:{type:"primary",size:"small"},on:{click:e.handleEdit}},[e._v("编辑")]),a("el-button",{attrs:{type:"success",size:"small"},on:{click:function(a){return e.handleOperate(t.row)}}},[e._v("查看")])]}}])})],1)],1)],1)},n=[],r={name:"Collection",data:function(){return{tableData:[{dataName:"商品1",creator:"Admin",createTime:"2019-03-01 12:33:10",changeTime:"2019-03-02 15:00:06"},{dataName:"商品2",creator:"Admin",createTime:"2019-02-03 13:35:09",changeTime:"2019-02-14 11:06:11"},{dataName:"商品3",creator:"Admin",createTime:"2019-01-11 10:33:55",changeTime:"2019-02-02 12:00:03"},{dataName:"商品4",creator:"Admin",createTime:"2019-01-01 22:55:44",changeTime:"2019-01-02 15:00:06"},{dataName:"商品5",creator:"Admin",createTime:"2018-11-16 11:33:14",changeTime:"2018-12-02 15:55:06"},{dataName:"商品6",creator:"Admin",createTime:"2018-10-21 11:33:32",changeTime:"2018-12-09 11:15:26"},{dataName:"商品7",creator:"Admin",createTime:"2018-08-26 16:22:25",changeTime:"2018-12-02 15:44:23"},{dataName:"商品8",creator:"Admin",createTime:"2018-08-23 10:43:10",changeTime:"2018-09-22 17:25:25"},{dataName:"商品9",creator:"Admin",createTime:"2018-07-17 11:33:35",changeTime:"2018-11-02 15:55:23"},{dataName:"商品10",creator:"Admin",createTime:"2018-05-19 11:34:35",changeTime:"2018-09-04 18:31:21"}],dialogFormVisible:!1,newForm:{name:"",origin:"",region:"",date1:"",date2:"",delivery:!1,type:[],resource:"",desc:""},formLabelWidth:"120px"}},methods:{handleSelectionChange:function(e){this.multipleSelection=e},handleOperate:function(e){console.log(e),this.$router.push({path:"/tables/details"})},handleDelete:function(){this.$notify({title:"警告",message:"不能删除",duration:2e3,type:"error"})},handleEdit:function(){this.$message({showClose:!0,message:"没有编辑权限",duration:2e3,type:"error"})}}},i=r,o=(a("f26e"),a("5511")),s=Object(o["a"])(i,l,n,!1,null,null,null);t["default"]=s.exports},"278d":function(e,t,a){"use strict";a.r(t);var l=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"setting"},[a("h1",{staticClass:"title"},[e._v("setting")]),a("el-table",{staticStyle:{width:"100%"},attrs:{data:e.tableData}},[a("el-table-column",{attrs:{prop:"username",label:"姓名",width:"180"}}),a("el-table-column",{attrs:{prop:"email",label:"邮箱",width:"180"}}),a("el-table-column",{scopedSlots:e._u([{key:"default",fn:function(t){return[a("el-button",{attrs:{type:"text",size:"small"},on:{click:function(a){return e.handleClick(t.row)}}},[e._v("删除")])]}}])})],1),a("br"),a("br"),a("br"),a("h4",{staticStyle:{"font-size":"20px"}},[e._v("微信小程序扫码体验")]),e._m(0)],1)},n=[function(){var e=this,t=e.$createElement,l=e._self._c||t;return l("div",{staticStyle:{padding:"20px","text-align":"center"}},[l("img",{attrs:{src:a("cf05"),alt:"",height:"150px"}}),l("img",{attrs:{src:a("77ae"),alt:"",height:"150px"}})])}],r=a("bb36"),i={name:"Setting",data:function(){return{tableData:[]}},created:function(){},methods:{getAllUser:function(){var e=this;r["a"].getAllUser().then((function(t){console.log(t),200===t.status&&t.data&&0===t.data.code?e.tableData=t.data.result:e.$notify({title:"错误",message:t.data.msg,duration:2e3,type:"error"})}))},handleClick:function(e){var t=this;console.log(e.username),r["a"].delUser({username:e.username}).then((function(a){200===a.status&&a.data&&0===a.data.code?(t.$notify({title:"成功",message:a.data.msg,duration:2e3,type:"error"}),t.tableData=t.tableData.filter((function(t){return t.username!==e.username}))):t.$notify({title:"错误",message:a.data.msg,duration:2e3,type:"error"})}))}}},o=i,s=(a("2b67"),a("5511")),c=Object(s["a"])(o,l,n,!1,null,null,null);t["default"]=c.exports},"2b67":function(e,t,a){"use strict";var l=a("913f"),n=a.n(l);n.a},"3bf8":function(e,t,a){"use strict";a.r(t);var l=function(){var e=this,t=e.$createElement;e._self._c;return e._m(0)},n=[function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"details"},[a("h1",{staticClass:"title"},[e._v("详情")]),a("div",{staticClass:"info"},[e._v("\n abc\n ")])])}],r={name:"Details",data:function(){return{}}},i=r,o=(a("d267"),a("5511")),s=Object(o["a"])(i,l,n,!1,null,null,null);t["default"]=s.exports},"77ae":function(e,t,a){e.exports=a.p+"img/lajifenlei.bf4aec9d.png"},"913f":function(e,t,a){},d267:function(e,t,a){"use strict";var l=a("ee0c"),n=a.n(l);n.a},ec9d:function(e,t,a){"use strict";a.r(t);var l=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{},[a("router-view")],1)},n=[],r={name:"Tables"},i=r,o=a("5511"),s=Object(o["a"])(i,l,n,!1,null,null,null);t["default"]=s.exports},ee0c:function(e,t,a){},f26e:function(e,t,a){"use strict";var l=a("1be1"),n=a.n(l);n.a}}]); 2 | //# sourceMappingURL=tables.5ae64fdf.js.map -------------------------------------------------------------------------------- /src/views/users/Register.vue: -------------------------------------------------------------------------------- 1 | 43 | 44 | 239 | 240 | 322 | -------------------------------------------------------------------------------- /dist/js/charts.c94f195a.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["webpack:///./src/views/charts/Diagram.vue?4d48","webpack:///./src/views/charts/Diagram.vue?2bd2","webpack:///src/views/charts/Diagram.vue","webpack:///./src/views/charts/Diagram.vue?0536","webpack:///./src/views/charts/Diagram.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","_v","datePickerOptions","model","value","callback","$$v","dateValue","expression","on","handleTab","activeName","ref","invokeChartData","invokeChartSettings","saleChartData","saleChartSettings","staticRenderFns","name","data","dimension","scale","area","disabledDate","time","getTime","Date","now","columns","rows","watch","$nextTick","methods","console","log","tab","component"],"mappings":"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","file":"js/charts.c94f195a.js","sourcesContent":["import mod from \"-!../../../node_modules/_mini-css-extract-plugin@0.8.2@mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../../node_modules/_css-loader@1.0.1@css-loader/index.js??ref--11-oneOf-1-1!../../../node_modules/_vue-loader@15.8.3@vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/_postcss-loader@3.0.0@postcss-loader/src/index.js??ref--11-oneOf-1-2!../../../node_modules/_stylus-loader@3.0.2@stylus-loader/index.js??ref--11-oneOf-1-3!../../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/_vue-loader@15.8.3@vue-loader/lib/index.js??vue-loader-options!./Diagram.vue?vue&type=style&index=0&lang=stylus&\"; export default mod; export * from \"-!../../../node_modules/_mini-css-extract-plugin@0.8.2@mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../../node_modules/_css-loader@1.0.1@css-loader/index.js??ref--11-oneOf-1-1!../../../node_modules/_vue-loader@15.8.3@vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/_postcss-loader@3.0.0@postcss-loader/src/index.js??ref--11-oneOf-1-2!../../../node_modules/_stylus-loader@3.0.2@stylus-loader/index.js??ref--11-oneOf-1-3!../../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/_vue-loader@15.8.3@vue-loader/lib/index.js??vue-loader-options!./Diagram.vue?vue&type=style&index=0&lang=stylus&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"diagram\"},[_c('div',{staticClass:\"total\"},[_c('div',{staticClass:\"select-wrapper\"},[_c('el-button',{attrs:{\"type\":\"text\"}},[_vm._v(\"今日\")]),_c('el-button',{attrs:{\"type\":\"text\"}},[_vm._v(\"本周\")]),_c('el-button',{attrs:{\"type\":\"text\"}},[_vm._v(\"本月\")]),_c('el-button',{attrs:{\"type\":\"text\"}},[_vm._v(\"全年\")]),_c('el-date-picker',{attrs:{\"type\":\"daterange\",\"editable\":false,\"size\":\"small\",\"picker-options\":_vm.datePickerOptions,\"range-separator\":\"至\",\"start-placeholder\":\"开始日期\",\"end-placeholder\":\"结束日期\"},model:{value:(_vm.dateValue),callback:function ($$v) {_vm.dateValue=$$v},expression:\"dateValue\"}})],1),_c('el-tabs',{on:{\"tab-click\":_vm.handleTab},model:{value:(_vm.activeName),callback:function ($$v) {_vm.activeName=$$v},expression:\"activeName\"}},[_c('el-tab-pane',{attrs:{\"label\":\"访客\",\"name\":\"invoke\"}},[_c('ve-line',{ref:\"invoke\",attrs:{\"data\":_vm.invokeChartData,\"settings\":_vm.invokeChartSettings}})],1),_c('el-tab-pane',{attrs:{\"label\":\"关注\",\"name\":\"sale\"}},[_c('ve-line',{ref:\"sale\",attrs:{\"data\":_vm.saleChartData,\"settings\":_vm.saleChartSettings}})],1)],1)],1)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","\n\n\n\n\n","import mod from \"-!../../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/_thread-loader@2.1.3@thread-loader/dist/cjs.js!../../../node_modules/_babel-loader@8.0.6@babel-loader/lib/index.js!../../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/_vue-loader@15.8.3@vue-loader/lib/index.js??vue-loader-options!./Diagram.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/_thread-loader@2.1.3@thread-loader/dist/cjs.js!../../../node_modules/_babel-loader@8.0.6@babel-loader/lib/index.js!../../../node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/_vue-loader@15.8.3@vue-loader/lib/index.js??vue-loader-options!./Diagram.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Diagram.vue?vue&type=template&id=bd9260c2&\"\nimport script from \"./Diagram.vue?vue&type=script&lang=js&\"\nexport * from \"./Diagram.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Diagram.vue?vue&type=style&index=0&lang=stylus&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/_vue-loader@15.8.3@vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n null,\n null\n \n)\n\nexport default component.exports"],"sourceRoot":""} -------------------------------------------------------------------------------- /src/views/dashboard/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 175 | 176 | 310 | 311 | 435 | -------------------------------------------------------------------------------- /dist/js/dashboard.168ef4be.js: -------------------------------------------------------------------------------- 1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["dashboard"],{"035e":function(t,e,a){},"096e":function(t,e,a){"use strict";var s=a("9515"),i=a.n(s);i.a},"311a":function(t,e,a){"use strict";a.r(e);var s=function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"slider"},[a("div",{staticClass:"products"},[a("h4",[t._v("各产品访客")]),a("div",{staticClass:"slider"},[a("swiper",{attrs:{options:t.productSwiperOption}},t._l(t.sliderProducts,(function(e,s){return a("swiper-slide",{key:s,class:{active:t.productIsActive===s},nativeOn:{click:function(e){return t.selectProducts(s)}}},[a("div",{staticClass:"text"},[a("h5",[t._v(t._s(e.code))]),a("p",[t._v("访客占比")]),a("span",[t._v(t._s(e.radio)+"%")])]),a("div",{staticClass:"circle"},[a("el-progress",{attrs:{type:"circle","stroke-width":8,width:70,percentage:e.radio}})],1)])})),1)],1),a("div",{staticClass:"charts"},[a("h5",[t._v(t._s(t.productInvokeCode)+"各公司访客")]),a("ve-line",{ref:"products",attrs:{data:t.productChartData,settings:t.productChartSettings}})],1)]),a("TableAndRing",{attrs:{tableTitle:t.hotProducts.tableTitle,ringTitle:t.hotProducts.ringTitle,tableData:t.hotProducts.tableData,chartData:t.hotProducts.chartData,chartSettings:t.hotProducts.chartSettings}}),a("TableAndRing",{attrs:{tableTitle:t.bigCustomer.tableTitle,ringTitle:t.bigCustomer.ringTitle,tableData:t.bigCustomer.tableData,chartData:t.bigCustomer.chartData,chartSettings:t.bigCustomer.chartSettings}})],1)},i=[],r=(a("cc57"),function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"table-and-ring"},[a("el-row",{attrs:{gutter:10}},[a("el-col",{attrs:{xs:24,md:12}},[a("div",{staticClass:"grid-content bg-white"},[a("h4",[t._v(t._s(t.tableTitle))]),a("el-table",{staticStyle:{width:"100%"},attrs:{data:t.tableData}},[a("el-table-column",{attrs:{align:"center",prop:"id",label:"排名",width:"100"}}),a("el-table-column",{attrs:{align:"center",prop:"name",label:"产品名",width:""}}),a("el-table-column",{attrs:{align:"center",prop:"amount",label:"调用量",width:""}}),a("el-table-column",{attrs:{align:"center",prop:"increase",label:"周涨幅"}})],1),a("el-pagination",{attrs:{layout:"prev, pager, next",total:50}})],1)]),a("el-col",{attrs:{xs:24,md:12}},[a("div",{staticClass:"grid-content bg-white"},[a("h4",[t._v(t._s(t.ringTitle))]),a("ve-ring",{attrs:{data:t.chartData,height:"320px",settings:t.chartSettings}})],1)])],1)],1)}),n=[],o={name:"",props:{tableTitle:{type:String,default:function(){return""}},ringTitle:{type:String,default:function(){return""}},tableData:{type:Array,default:function(){return[]}},chartData:{type:Object,default:function(){}},chartSettings:{type:Object,default:function(){}}},data:function(){return{}},methods:{}},c=o,l=(a("b219"),a("5511")),d=Object(l["a"])(c,r,n,!1,null,null,null),h=d.exports,u={name:"Slider",components:{TableAndRing:h},data:function(){return this.productChartSettings={dimension:["时间"],scale:[!0,!0],area:!0},this.formChartSettings={dimension:["时间"],scale:[!0,!0],area:!0},{activeName:"invoke",dateValue:"",datePickerOptions:{disabledDate:function(t){return t.getTime()>Date.now()}},productChartData:{columns:["时间","北京","上海","青岛"],rows:[{"时间":"2019-03-01","北京":75700,"上海":4311,"青岛":1e3},{"时间":"2019-03-02","北京":72936,"上海":6650,"青岛":1307},{"时间":"2019-03-03","北京":76636,"上海":7085,"青岛":1707},{"时间":"2019-03-04","北京":66536,"上海":6085,"青岛":2105},{"时间":"2019-03-05","北京":77516,"上海":5105,"青岛":1505},{"时间":"2019-03-06","北京":80536,"上海":8015,"青岛":1750}]},formChartData:{columns:["时间","毛衣","床单","枕头","Y0906"],rows:[{"时间":"2019-03-01","毛衣":56e3,"床单":22e3,"枕头":8888,Y0906:666},{"时间":"2019-03-02","毛衣":44e3,"床单":24e3,"枕头":5888,Y0906:766},{"时间":"2019-03-03","毛衣":51e3,"床单":21e3,"枕头":6888,Y0906:1166},{"时间":"2019-03-04","毛衣":59e3,"床单":27e3,"枕头":8888,Y0906:966},{"时间":"2019-03-05","毛衣":66e3,"床单":12e3,"枕头":6888,Y0906:1266},{"时间":"2019-03-06","毛衣":52e3,"床单":29e3,"枕头":7888,Y0906:1066}]},productSwiperOption:{slidesPerView:4,spaceBetween:30,navigation:{nextEl:".swiper-button-next",prevEl:".swiper-button-prev"},breakpoints:{1024:{slidesPerView:3,spaceBetween:40},768:{slidesPerView:2,spaceBetween:30},640:{slidesPerView:2,spaceBetween:20},320:{slidesPerView:1,spaceBetween:10}}},formSwiperOption:{slidesPerView:4,spaceBetween:30,breakpoints:{1024:{slidesPerView:3,spaceBetween:40},768:{slidesPerView:2,spaceBetween:30},640:{slidesPerView:2,spaceBetween:20},320:{slidesPerView:1,spaceBetween:10}}},productIsActive:0,productInvokeCode:"毛衣",formIsActive:0,formInvokeName:"北京",sliderProducts:[{code:"毛衣",radio:63},{code:"床单",radio:15},{code:"枕头",radio:2},{code:"窗帘",radio:1}],sliderForms:[{code:"北京",radio:72},{code:"上海",radio:12},{code:"上海淇毓",radio:9},{code:"北京济南",radio:6}],hotProducts:{tableTitle:"热门产品",ringTitle:"各产品关注占比",tableData:[{id:1,name:"毛衣",amount:"82093",increase:"128%"},{id:2,name:"羽绒服",amount:"77093",increase:"33%"},{id:3,name:"枕头",amount:"66752",increase:"25%"},{id:4,name:"短袖",amount:"57890",increase:"55%"},{id:5,name:"手套",amount:"5567",increase:"67%"}],chartData:{columns:["产品","关注"],rows:[{"产品":"毛衣","关注":1393},{"产品":"羽绒服","关注":3530},{"产品":"枕头","关注":2923},{"产品":"短袖","关注":1723},{"产品":"手套","关注":3792}]},chartSettings:{dimension:"产品",metrics:"关注",offsetY:180}},bigCustomer:{tableTitle:"大客户",ringTitle:"各客户关注占比",tableData:[{id:1,name:"北京",amount:"82093",increase:"183%"},{id:2,name:"济南",amount:"77093",increase:"33%"},{id:3,name:"苏州",amount:"66752",increase:"25%"},{id:4,name:"大连",amount:"57890",increase:"55%"},{id:5,name:"西安",amount:"5567",increase:"67%"}],chartData:{columns:["公司","关注"],rows:[{"产品":"北京","关注":10093},{"产品":"济南","关注":5530},{"产品":"苏州","关注":2923},{"产品":"大连","关注":1723},{"产品":"西安","关注":992}]},chartSettings:{dimension:"产品",metrics:"关注",offsetY:180}}}},watch:{activeName:function(t){var e=this;this.$nextTick((function(){e.$refs["".concat(t)].echarts.resize()}))}},methods:{handleTab:function(t){console.log(t.name)},selectProducts:function(t){console.log(t),this.productIsActive=t,0===t?(this.productInvokeCode="毛衣",this.productChartData={columns:["时间","北京","上海","青岛"],rows:[{"时间":"2019-03-01","北京":75700,"上海":4311,"青岛":1e3},{"时间":"2019-03-02","北京":72936,"上海":6650,"青岛":1307},{"时间":"2019-03-03","北京":76636,"上海":7085,"青岛":1707},{"时间":"2019-03-04","北京":66536,"上海":6085,"青岛":2105},{"时间":"2019-03-05","北京":77516,"上海":5105,"青岛":1505},{"时间":"2019-03-06","北京":80536,"上海":8015,"青岛":1750}]}):1===t?(this.productInvokeCode="床单",this.productChartData={columns:["时间","北京","上海","青岛"],rows:[{"时间":"2019-03-01","北京":15700,"上海":800,"青岛":200},{"时间":"2019-03-02","北京":11936,"上海":650,"青岛":307},{"时间":"2019-03-03","北京":12636,"上海":785,"青岛":197},{"时间":"2019-03-04","北京":14536,"上海":885,"青岛":215},{"时间":"2019-03-05","北京":15516,"上海":705,"青岛":155},{"时间":"2019-03-06","北京":16536,"上海":805,"青岛":250}]}):2===t?(this.productInvokeCode="枕头",this.productChartData={columns:["时间","北京","上海","青岛"],rows:[{"时间":"2019-03-01","北京":650,"上海":300,"青岛":300},{"时间":"2019-03-02","北京":736,"上海":250,"青岛":307},{"时间":"2019-03-03","北京":636,"上海":285,"青岛":297},{"时间":"2019-03-04","北京":536,"上海":285,"青岛":215},{"时间":"2019-03-05","北京":516,"上海":205,"青岛":255},{"时间":"2019-03-06","北京":636,"上海":305,"青岛":350}]}):3===t&&(this.productInvokeCode="窗帘",this.productChartData={columns:["时间","北京","上海","青岛"],rows:[{"时间":"2019-03-01","北京":157,"上海":100,"青岛":300},{"时间":"2019-03-02","北京":136,"上海":150,"青岛":307},{"时间":"2019-03-03","北京":166,"上海":115,"青岛":297},{"时间":"2019-03-04","北京":156,"上海":125,"青岛":215},{"时间":"2019-03-05","北京":156,"上海":105,"青岛":555},{"时间":"2019-03-06","北京":136,"上海":135,"青岛":250}]})},selectForms:function(t){console.log(t),this.formIsActive=t,0===t?(this.formInvokeName="北京",this.formChartData={columns:["时间","毛衣","床单","枕头","Y0906"],rows:[{"时间":"2019-03-01","毛衣":56e3,"床单":22e3,"枕头":8888,Y0906:666},{"时间":"2019-03-02","毛衣":44e3,"床单":24e3,"枕头":5888,Y0906:766},{"时间":"2019-03-03","毛衣":51e3,"床单":21e3,"枕头":6888,Y0906:1166},{"时间":"2019-03-04","毛衣":59e3,"床单":27e3,"枕头":8888,Y0906:966},{"时间":"2019-03-05","毛衣":66e3,"床单":12e3,"枕头":6888,Y0906:1266},{"时间":"2019-03-06","毛衣":52e3,"床单":29e3,"枕头":7888,Y0906:1066}]}):1===t?(this.formInvokeName="上海",this.formChartData={columns:["时间","毛衣","床单","枕头","Y0906"],rows:[{"时间":"2019-03-01","毛衣":12e3,"床单":7e3,"枕头":300,Y0906:500},{"时间":"2019-03-02","毛衣":14e3,"床单":6e3,"枕头":388,Y0906:666},{"时间":"2019-03-03","毛衣":11e3,"床单":6600,"枕头":338,Y0906:466},{"时间":"2019-03-04","毛衣":19e3,"床单":5500,"枕头":298,Y0906:566},{"时间":"2019-03-05","毛衣":16e3,"床单":6900,"枕头":388,Y0906:466},{"时间":"2019-03-06","毛衣":12e3,"床单":7900,"枕头":488,Y0906:666}]}):2===t?(this.formInvokeName="上海淇毓",this.formChartData={columns:["时间","毛衣","床单","枕头","Y0906"],rows:[{"时间":"2019-03-01","毛衣":1e4,"床单":3e3,"枕头":2008,Y0906:500},{"时间":"2019-03-02","毛衣":14e3,"床单":4e3,"枕头":1588,Y0906:466},{"时间":"2019-03-03","毛衣":11e3,"床单":2700,"枕头":1888,Y0906:566},{"时间":"2019-03-04","毛衣":12e3,"床单":2800,"枕头":2288,Y0906:565},{"时间":"2019-03-05","毛衣":13e3,"床单":3300,"枕头":2388,Y0906:555},{"时间":"2019-03-06","毛衣":14e3,"床单":3400,"枕头":2288,Y0906:666}]}):3===t&&(this.formInvokeName="北京济南",this.formChartData={columns:["时间","毛衣","床单","枕头","Y0906"],rows:[{"时间":"2019-03-01","毛衣":9e3,"床单":2e3,"枕头":1e3,Y0906:333},{"时间":"2019-03-02","毛衣":8e3,"床单":1800,"枕头":1188,Y0906:466},{"时间":"2019-03-03","毛衣":9e3,"床单":2100,"枕头":1118,Y0906:466},{"时间":"2019-03-04","毛衣":9900,"床单":1800,"枕头":888,Y0906:555},{"时间":"2019-03-05","毛衣":8800,"床单":1900,"枕头":999,Y0906:444},{"时间":"2019-03-06","毛衣":9900,"床单":2e3,"枕头":990,Y0906:666}]})},bindSelectDate:function(t){console.log(t),"今日"===t?this.invokeChartData={columns:["时间","毛衣访客","床单访客","枕头访客"],rows:[{"时间":"10:00","毛衣访客":2800,"床单访客":1e3,"枕头访客":900},{"时间":"11:00","毛衣访客":2600,"床单访客":1200,"枕头访客":1400},{"时间":"12:00","毛衣访客":2700,"床单访客":1600,"枕头访客":1200},{"时间":"13:00","毛衣访客":3e3,"床单访客":1100,"枕头访客":1600},{"时间":"14:00","毛衣访客":3100,"床单访客":1700,"枕头访客":1900},{"时间":"15:00","毛衣访客":2900,"床单访客":2e3,"枕头访客":1800},{"时间":"16:00","毛衣访客":3300,"床单访客":1500,"枕头访客":2200}]}:"今日"===t&&(this.invokeChartData={columns:["时间","毛衣访客","床单访客","枕头访客"],rows:[{"时间":"10:00","毛衣访客":2800,"床单访客":1e3,"枕头访客":900},{"时间":"11:00","毛衣访客":2600,"床单访客":1200,"枕头访客":1400},{"时间":"12:00","毛衣访客":2700,"床单访客":1600,"枕头访客":1200},{"时间":"13:00","毛衣访客":3e3,"床单访客":1100,"枕头访客":1600},{"时间":"14:00","毛衣访客":3100,"床单访客":1700,"枕头访客":1900},{"时间":"15:00","毛衣访客":2900,"床单访客":2e3,"枕头访客":1800},{"时间":"16:00","毛衣访客":3300,"床单访客":1500,"枕头访客":2200}]})}}},p=u,v=(a("096e"),Object(l["a"])(p,s,i,!1,null,null,null));e["default"]=v.exports},"4ad0":function(t,e,a){"use strict";var s=a("c68a"),i=a.n(s);i.a},"5c3a":function(t,e,a){"use strict";a.r(e);var s=function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"dashboard"},[a("el-row",{staticClass:"top-block",attrs:{gutter:20}},[a("el-col",{attrs:{xs:24,sm:12,lg:6}},[a("div",{staticClass:"grid-content bg-white"},[a("div",{staticClass:"title"},[a("p",[t._v("折线图")]),a("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"折线图",placement:"top-end"}},[a("i",{staticClass:"el-icon-warning"})])],1),a("div",{staticClass:"content"},[a("h2",[t._v("示例")]),a("ve-line",{attrs:{height:"100px",yAxis:{show:!1},legend:{show:!1},grid:{left:"0",right:"0",bottom:"0",top:"0",containLabel:!1},data:t.callChartData,settings:t.callChartSettings}}),a("div",{staticClass:"radio topborder"},[a("div",[a("p",[t._v("周同比")]),a("i",{staticClass:"el-icon-caret-top"}),a("span",[t._v("15%")])]),a("div",[a("p",[t._v("日环比")]),a("i",{staticClass:"el-icon-caret-bottom"}),a("span",[t._v("9%")])])])],1)])]),a("el-col",{attrs:{xs:24,sm:12,lg:6}},[a("div",{staticClass:"grid-content bg-white"},[a("div",{staticClass:"title"},[a("p",[t._v("柱状图")]),a("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"柱状图",placement:"top-end"}},[a("i",{staticClass:"el-icon-warning"})])],1),a("div",{staticClass:"content"},[a("h2",[t._v("示例")]),a("ve-histogram",{attrs:{height:"100px",yAxis:{show:!1},legend:{show:!1},grid:{left:"0",right:"0",bottom:"0",top:"0",containLabel:!1},settings:t.clientChartSettings,data:t.clientChartData}}),a("div",{staticClass:"radio topborder"},[a("div",[a("p",[t._v("周同比")]),a("i",{staticClass:"el-icon-caret-top"}),a("span",[t._v("13%")])]),a("div",[a("p",[t._v("日环比")]),a("i",{staticClass:"el-icon-caret-bottom"}),a("span",[t._v("8%")])])])],1)])]),a("el-col",{attrs:{xs:24,sm:12,lg:6}},[a("div",{staticClass:"grid-content bg-white"},[a("div",{staticClass:"title"},[a("p",[t._v("进度条")]),a("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"进度条",placement:"top-end"}},[a("i",{staticClass:"el-icon-warning"})])],1),a("div",{staticClass:"content"},[a("h2",[t._v("86%")]),a("el-progress",{attrs:{"text-inside":!0,"stroke-width":18,percentage:86}}),a("div",{staticClass:"radio topborder"},[a("div",[a("p",[t._v("周同比")]),a("i",{staticClass:"el-icon-caret-top"}),a("span",[t._v("8%")])]),a("div",[a("p",[t._v("日环比")]),a("i",{staticClass:"el-icon-caret-bottom"}),a("span",[t._v("5%")])])])],1)])]),a("el-col",{attrs:{xs:24,sm:12,lg:6}},[a("div",{staticClass:"grid-content bg-white"},[a("div",{staticClass:"title"},[a("p",[t._v("仪表盘")]),a("br"),a("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"仪表盘",placement:"top-end"}},[a("i",{staticClass:"el-icon-warning"})])],1),a("div",{staticClass:"content"},[a("ve-gauge",{attrs:{height:"220px",data:t.passChartData,settings:t.passChartSettings}})],1)])])],1),a("div",{staticClass:"realtime"},[a("el-row",{attrs:{gutter:20}},[a("el-col",{attrs:{sm:24,md:24,lg:24}},[a("div",{staticClass:"invoke bg-white"},[a("h2",[t._v("折线图")]),a("div",{staticClass:"total"},[a("div",{staticClass:"left"},[a("p",[t._v("今日访客")]),a("span",[t._v("102631")])]),a("div",{staticClass:"right"},[a("p",[t._v("平均纪录")]),a("span",[t._v("666")])])]),a("div",{staticClass:"chart"},[a("ve-line",{attrs:{data:t.invokeChartData,height:"300px",settings:t.invokeChartSettings}})],1)]),a("div",{staticClass:"invoke bg-white"},[a("h2",[t._v("堆叠面积图")]),a("div",{staticClass:"total"},[a("div",{staticClass:"left"},[a("p",[t._v("今日访客")]),a("span",[t._v("2209")])]),a("div",{staticClass:"right"},[a("p",[t._v("平均纪录")]),a("span",[t._v("666")])])]),a("div",{staticClass:"chart"},[a("ve-line",{attrs:{data:t.timeoutChartData,height:"300px",settings:t.timeoutChartSettings}})],1)])])],1)],1)],1)},i=[],r={name:"Dashboard",data:function(){return this.callChartSettings={scale:[!0,!0],area:!0},this.clientChartSettings={scale:[!0,!0]},this.invokeChartSettings={dimension:["时间"],scale:[!0,!0]},this.timeoutChartSettings={dimension:["时间"],scale:[!0,!0],area:!0},this.passChartSettings={dataType:{"占比":"percent"},seriesMap:{"占比":{min:0,max:1,splitNumber:5,radius:"96%",pointer:{length:"45%"},axisLabel:{color:"red",distance:0},axisLine:{lineStyle:{color:[[1,"#36a9e1"]],width:20}},detail:{backgroundColor:"rgba(30,144,255,0.8)",borderWidth:1,borderColor:"#fff",shadowColor:"#fff",shadowBlur:5,offsetCenter:[0,"70%"],textStyle:{fontWeight:"bolder",color:"#fff",fontSize:20}}}}},{callChartData:{columns:["日期","访客"],rows:[{"日期":"2019-02-21","访客":116921},{"日期":"2019-02-22","访客":122921},{"日期":"2019-02-23","访客":133921},{"日期":"2019-02-24","访客":122921},{"日期":"2019-02-25","访客":116921},{"日期":"2019-02-26","访客":144921},{"日期":"2019-02-27","访客":133921},{"日期":"2019-02-28","访客":144921},{"日期":"2019-03-01","访客":129921},{"日期":"2019-03-02","访客":121921},{"日期":"2019-03-03","访客":134921},{"日期":"2019-03-04","访客":124921},{"日期":"2019-03-05","访客":129921},{"日期":"2019-03-06","访客":135019}]},clientChartData:{columns:["日期","客户数"],rows:[{"日期":"2019-02-21","客户数":33},{"日期":"2019-02-22","客户数":45},{"日期":"2019-02-23","客户数":45},{"日期":"2019-02-24","客户数":60},{"日期":"2019-02-25","客户数":59},{"日期":"2019-02-26","客户数":55},{"日期":"2019-02-27","客户数":46},{"日期":"2019-02-28","客户数":66},{"日期":"2019-03-01","客户数":52},{"日期":"2019-03-02","客户数":65},{"日期":"2019-03-03","客户数":59},{"日期":"2019-03-04","客户数":77},{"日期":"2019-03-05","客户数":66},{"日期":"2019-03-06","客户数":68}]},invokeChartData:{columns:["时间","商品零访客","商品一访客","商品二访客"],rows:[{"时间":"10:00","商品零访客":2800,"商品一访客":1e3,"商品二访客":900},{"时间":"11:00","商品零访客":2600,"商品一访客":1200,"商品二访客":1400},{"时间":"12:00","商品零访客":2700,"商品一访客":1600,"商品二访客":1200},{"时间":"13:00","商品零访客":3e3,"商品一访客":1100,"商品二访客":1600},{"时间":"14:00","商品零访客":3100,"商品一访客":1700,"商品二访客":1900},{"时间":"15:00","商品零访客":2900,"商品一访客":2e3,"商品二访客":1800},{"时间":"16:00","商品零访客":3300,"商品一访客":1500,"商品二访客":2200}]},timeoutChartData:{columns:["时间","商品零访客","商品一访客","商品二访客"],rows:[{"时间":"10:00","商品零访客":19,"商品一访客":17,"商品二访客":15},{"时间":"11:00","商品零访客":21,"商品一访客":19,"商品二访客":18},{"时间":"12:00","商品零访客":19,"商品一访客":18,"商品二访客":14},{"时间":"13:00","商品零访客":20,"商品一访客":14,"商品二访客":16},{"时间":"14:00","商品零访客":18,"商品一访客":17,"商品二访客":12},{"时间":"15:00","商品零访客":19,"商品一访客":15,"商品二访客":15},{"时间":"16:00","商品零访客":16,"商品一访客":14,"商品二访客":11}]},passChartData:{columns:["type","value"],rows:[{type:"占比",value:.98}]}}}},n=r,o=(a("4ad0"),a("5511")),c=Object(o["a"])(n,s,i,!1,null,null,null);e["default"]=c.exports},9515:function(t,e,a){},b219:function(t,e,a){"use strict";var s=a("035e"),i=a.n(s);i.a},c68a:function(t,e,a){}}]); 2 | //# sourceMappingURL=dashboard.168ef4be.js.map -------------------------------------------------------------------------------- /dist/css/app.02ab5746.css: -------------------------------------------------------------------------------- 1 | #app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.header[data-v-06b99f66]{width:100%;height:50px;display:-webkit-box;display:-ms-flexbox;display:flex;background:#36a9e1}.header .logo[data-v-06b99f66]{width:200px;height:50px;background:#1e8fc6;color:#fff;text-indent:15px;font-size:18px;line-height:50px;font-weight:600;-webkit-transition:.4s ease;transition:.4s ease}.header .logo.is-active[data-v-06b99f66]{width:64px}.header .logo img[data-v-06b99f66]{padding:0 5px 5px 0}.header .navbar[data-v-06b99f66]{-webkit-box-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:0 10px;color:#fff}.header .navbar .btn[data-v-06b99f66]{height:50px;line-height:50px;cursor:pointer;-webkit-transition:.4s ease;transition:.4s ease}.header .navbar .btn.is-active[data-v-06b99f66]{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.header .navbar .btn span[data-v-06b99f66]{font-size:28px;line-height:50px;-webkit-transition:.5s;transition:.5s;color:#fff;font-weight:400}.header .navbar .el-dropdown-link[data-v-06b99f66]{color:#fff;font-weight:700;cursor:pointer}@media (max-width:768px){.header .logo.is-active[data-v-06b99f66]{width:0;overflow:hidden}}.breadcrumb[data-v-3bae7630]{line-height:40px;border-radius:4px;margin-bottom:10px}.breadcrumb .el-breadcrumb[data-v-3bae7630]{line-height:2;padding-left:4px}.footer[data-v-37f1445a]{height:50px;line-height:50px;width:100%;font-size:14px;text-align:center;color:#777}.sidebar[data-v-470df524]{background-color:#545c64}.el-menu-vertical-demo[data-v-470df524]:not(.el-menu--collapse){width:200px;min-height:100vh;height:100%}.el-menu-vertical-demo[data-v-470df524]{min-height:100vh;height:100%}.el-menu-item.is-active[data-v-470df524],.el-submenu.is-active[data-v-470df524] .el-submenu__title{background:#484e5c!important}.el-submenu .el-menu-item[data-v-470df524]{padding-left:60px!important;min-width:auto}.el-submenu.is-active .el-menu-item[data-v-470df524]{background:#484e5c!important}.el-submenu.is-active .el-menu-item.is-active[data-v-470df524]{background:#3a4046!important}.el-submenu .el-menu-item[data-v-470df524]:hover{padding-left:60px!important;background:#434a50!important}.el-menu-item i[data-v-470df524],.el-submenu__title i[data-v-470df524]{padding-bottom:4px}@media (max-width:768px){.el-menu--collapse[data-v-470df524]{width:0;overflow:hidden}}.scrolltotop[data-v-4e240626]{height:.9rem;width:.9rem;position:fixed;bottom:1.4rem;right:.8rem;cursor:pointer;border-radius:50%;background:#409eff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;opacity:.5;-webkit-transition:.2s;transition:.2s}.scrolltotop .el-icon-arrow-up[data-v-4e240626]{font-size:.6rem;color:#fff}.scrolltotop[data-v-4e240626]:hover{-webkit-transform:scale(1.1);transform:scale(1.1);opacity:1}@media (max-width:920px){.el-main[data-v-7abd01fa]{padding:0}}.el-footer[data-v-7abd01fa],.el-header[data-v-7abd01fa]{color:#333;height:50px!important;padding:0}.el-main[data-v-7abd01fa]{background-color:#f5f5f5;color:#333}body>.el-container[data-v-7abd01fa]{margin-bottom:40px}html{background-color:#fff;color:#000;font-size:12px}blockquote,body,button,dd,dl,fieldset,figure,form,h1,h2,h3,h4,h5,h6,input,legend,ol,p,pre,td,textarea,th,ul,xmp{margin:0;padding:0}body,button,code,input,kbd,pre,samp,select,textarea,tt,xmp{line-height:1.5;font-family:tahoma,arial,Hiragino Sans GB,simsun,sans-serif}big,button,h1,h2,h3,h4,h5,h6,input,select,small,textarea{font-size:100%}h1,h2,h3,h4,h5,h6{font-family:tahoma,arial,Hiragino Sans GB,"\5FAE\8F6F\96C5\9ED1",simsun,sans-serif}b,h1,h2,h3,h4,h5,h6,strong{font-weight:400}address,cite,dfn,em,i,optgroup,var{font-style:normal}table{border-collapse:collapse;border-spacing:0;text-align:left}caption,th{text-align:inherit}menu,ol,ul{list-style:none}fieldset,img{border:0}button,img,input,object,select,textarea{vertical-align:middle}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}blockquote:after,blockquote:before,q:after,q:before{content:" "}textarea{overflow:auto;resize:vertical}a,button,input,select,textarea{outline:0 none;border:none}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}mark{background-color:transparent}a,del,ins,s,u{text-decoration:none}sub,sup{vertical-align:baseline}html{overflow-x:hidden;height:100%;width:100%;font-size:50px;-webkit-tap-highlight-color:transparent}body{font-family:Arial,Microsoft Yahei,Helvetica Neue,Helvetica,sans-serif;color:#333;font-size:.28em;line-height:1;-webkit-text-size-adjust:none}hr{height:.02rem;margin:.1rem 0;border:medium none;border-top:.02rem solid #cacaca}a{color:#25a4bb;text-decoration:none}.el-popup-parent--hidden{padding-right:0!important}.bg-white{background:#fff}.fade-enter-active,.fade-leave-active{-webkit-transition:all .4s ease;transition:all .4s ease}.fade-enter{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}.fade-leave-to{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}.fade-transform-enter-active,.fade-transform-leave-active{-webkit-transition:all .3s;transition:all .3s}.fade-transform-enter{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}.fade-transform-leave-to{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}.slide-enter-active,.slide-leave-active{-webkit-transition:all .2s;transition:all .2s}.slide-enter,.slide-leave-to{-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}.breadcrumb-enter-active,.breadcrumb-leave-active{-webkit-transition:all .4s;transition:all .4s}.breadcrumb-enter,.breadcrumb-leave-active{opacity:0;-webkit-transform:translateX(30px);transform:translateX(30px)}.breadcrumb-leave-active{position:absolute}@media (max-width:768px){.el-message-box{max-width:300px}}@font-face{font-family:iconfont;src:url(data:application/vnd.ms-fontobject;base64,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);src:url(data:application/vnd.ms-fontobject;base64,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#iefix) format("embedded-opentype"),url("data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAL8AAsAAAAABwwAAAKtAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgqBbIFhATYCJAMMCwgABCAFhG0HQBsxBsgekiQlCogQgo4rCEGY4uFrDX1/d+8CAApQZSIBxxMU0ZhOFZB0pDs+QhV1XeB/1/QPAFVe1TDXVlaNSLWsDpMDatOM2aJQBL5Cb3Ju81g3gD5x77TpC8d+luU2x8DuUxfFcUCB7oFRERVIQN4wdtVSeUj3CTQbN6Boe2IuDpUKvCwQL01dhspCUlHMSqNQN+wt4rNKY3qTfgCf1Pfjn3BUklQZXrvzeFyDoZ+JXz1567qbgkS1nB/mITIWgELcbiyeKBEmu0SzsbS7sVaEtFTm+hqlDMz1Qf94iajh9lYwAw3poVRMRvCrRwE5yItrNGEbOAL0Xn+lYEbOrXXtd5qg8Sa6+Umd1qN4IplMrTad3m3dVne+vd9+yNRl1Nb+ptrFxPnW+JlrK8rWm043PwCDXVjnk2/8J/O98Fp4GbRmxmbGofz1utBEA7RJOC/foRKONl421j54fT3uPubzrroDdUp91whIcG9+lc7B9ddMzOt/+jduXwRPxIbl/40tBZzfXQdU/PprMSwMGu8jFPxX1cCBEmiwKxdPyZRRJVtUdtcOzUHENRzt9jXd3Dc4T2gsqEwkDcaQNZogF/oCKi2WUGu0hmbzJg+36MGUiNKEOfsAodMLknZfkHV6Ixf6Jyr9/lHrjBI0O4qeM1tMhVm9xYjMiYaUZWSqvkeph1fHnVGizzsyy2uUMElY3sygEA6WK5PEI2yJDfkFPcw5RZT5LpoAjxHH8VGW+RZROTY4z0YEgTa9CKu+C9W2MISMIzSIYhliUvk8VIznqiufjyJ08xwy1kHoyycRTJ45PRKCBQeQJ43eIMKjPJO3QBfGcRRCMT4XMgH8hEOKPiTbPMtCqDjMmJDPihDQMDrUiLc3u/93AprhvTlS5CjqB7KpyV6dtK0YrGDLJgAAAAA=") format("woff2"),url(data:font/woff;base64,d09GRgABAAAAAASEAAsAAAAABwwAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFY8y0kaY21hcAAAAYAAAABVAAABhmmT0XhnbHlmAAAB2AAAALYAAADsklqXRGhlYWQAAAKQAAAALwAAADYUcpBBaGhlYQAAAsAAAAAcAAAAJAfeA4RobXR4AAAC3AAAAAwAAAAMDAAAAGxvY2EAAALoAAAACAAAAAgAKAB2bWF4cAAAAvAAAAAfAAAAIAESAD5uYW1lAAADEAAAAUUAAAJtPlT+fXBvc3QAAARYAAAAKwAAAECmDAUjeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2BkYWCcwMDKwMHUyXSGgYGhH0IzvmYwYuRgYGBiYGVmwAoC0lxTGByehT7XYG7438AQw9zA0AAUZgTJAQDnKgxheJztkMENgDAMAy9p6QMxSB+sg8SL8ekYxU1hCyxdrDh5GViAJHaRwS6MoVOpRZ5YI8/xU+SG30ervcPnkulWwl2j8GuLWd/NR1uT0WyrE/wByT0PPgAAAHicY2BlAALmRqYbDMwM7AzcDHwMggwMwoqiisxAzAjE6uzi+ozmDcwMfxkYwYQk48t/4lF79uh5ezNd1/u7To8xQ+/wxg3Zrm4go1gYGP4fYD7A7AA0S5xBmcEQZJqRmAibsqKSmokZLjajuJgIPyObkpqpoImZUQazvqC4uOCfi0BSiPEciP3PCEQiiTOt2cjJuZFLSlhImtlBXEkciP5loNJMFkB5ro2cwryMSXxCDAAgmyymAAB4nGNgZGBgAOK8PwYR8fw2Xxm4WRhA4MbKZUoI+v8BFgZmByCXg4EJJAoAK0YKRQB4nGNgZGBgbvjfwBDDwgACQJKRARUwAwBHCQJsBAAAAAQAAAAEAAAAAAAAAAAoAHZ4nGNgZGBgYGYwYmBlAAEmIOYCQgaG/2A+AwAN8AFRAHicZY9NTsMwEIVf+gekEqqoYIfkBWIBKP0Rq25YVGr3XXTfpk6bKokjx63UA3AejsAJOALcgDvwSCebNpbH37x5Y08A3OAHHo7fLfeRPVwyO3INF7gXrlN/EG6QX4SbaONVuEX9TdjHM6bCbXRheYPXuGL2hHdhDx18CNdwjU/hOvUv4Qb5W7iJO/wKt9Dx6sI+5l5XuI1HL/bHVi+cXqnlQcWhySKTOb+CmV7vkoWt0uqca1vEJlODoF9JU51pW91T7NdD5yIVWZOqCas6SYzKrdnq0AUb5/JRrxeJHoQm5Vhj/rbGAo5xBYUlDowxQhhkiMro6DtVZvSvsUPCXntWPc3ndFsU1P9zhQEC9M9cU7qy0nk6T4E9XxtSdXQrbsuelDSRXs1JErJCXta2VELqATZlV44RelzRiT8oZ0j/AAlabsgAAAB4nGNgYoAALgbsgJmRiZGZkYWBLTkxMyUxjxdCVWUk5mUnZjIwAABjRwfVAA==) format("woff"),url(data:font/ttf;base64,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) format("truetype"),url(../img/iconfont.aae4d5ba.svg#iconfont) format("svg")}[class*=" el-icon-newfont"],[class^=el-icon-newfont]{font-family:iconfont!important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.el-icon-newfont-caidan:before{content:"\E655"}.el-icon-newfont-caidanzhankai:before{content:"\E728"} -------------------------------------------------------------------------------- /dist/js/app.5589acba.js: -------------------------------------------------------------------------------- 1 | (function(e){function t(t){for(var a,r,i=t[0],u=t[1],l=t[2],c=0,d=[];c100?this.show=!0:this.show=!1},backToTop:function(){var e=setInterval((function(){document.documentElement.scrollTop||document.body.scrollTop?(document.body.scrollTop-=100,document.documentElement.scrollTop-=100):clearInterval(e)}),0)}}},F=R,H=(n("8437"),Object(h["a"])(F,G,M,!1,null,"4e240626",null)),U=H.exports,V=document,z=V.body,J=992,K={watch:{$route:function(){"mobile"===this.$store.state.app.device&&this.$store.state.app.sidebar.opened&&o["a"].dispatch("CloseSideBar")}},beforeMount:function(){window.addEventListener("resize",this.resizeHandler)},mounted:function(){var e=this.isMobile();e&&(o["a"].dispatch("ToggleDevice","mobile"),o["a"].dispatch("CloseSideBar"))},methods:{isMobile:function(){var e=z.getBoundingClientRect();return e.width-1 2 |
3 |
4 |

各产品访客

5 |
6 | 7 | 13 |
14 |
{{item.code}}
15 |

访客占比

16 | {{item.radio}}% 17 |
18 |
19 | 20 |
21 | 22 | 23 |
24 |
25 |
{{productInvokeCode}}各公司访客
26 | 31 | 32 |
33 |
34 | 41 | 42 | 49 | 50 |
51 | 52 | 53 | 447 | 448 | 519 | --------------------------------------------------------------------------------