├── src ├── scss │ ├── conf │ │ ├── common.scss │ │ ├── _all.scss │ │ ├── mixin.scss │ │ ├── variable.scss │ │ └── minireset.scss │ ├── pages │ │ ├── stat │ │ │ ├── operate.scss │ │ │ ├── info.scss │ │ │ ├── loan.scss │ │ │ ├── credit.scss │ │ │ ├── invest.scss │ │ │ └── outcome.scss │ │ ├── user │ │ │ ├── bank.scss │ │ │ └── info.scss │ │ ├── news │ │ │ ├── list.scss │ │ │ ├── manage.scss │ │ │ ├── detail.scss │ │ │ └── add.scss │ │ └── index │ │ │ └── index.scss │ ├── com │ │ ├── leverbar.scss │ │ ├── sidebar.scss │ │ ├── header.scss │ │ ├── layout.scss │ │ └── login.scss │ ├── main.scss │ └── lib │ │ └── element.scss ├── img │ ├── bg.jpg │ └── icon.png ├── assets │ └── login_logo.png ├── lib │ └── Regex.js ├── view │ ├── Layout.vue │ ├── Main.vue │ ├── Com │ │ ├── LeverBar.vue │ │ ├── Header.vue │ │ ├── Sidebar.vue │ │ ├── Layout.vue │ │ └── Login.vue │ └── Pages │ │ ├── Email │ │ ├── Send.vue │ │ ├── OutBox.vue │ │ └── InBox.vue │ │ ├── News │ │ ├── Detail.vue │ │ ├── Add.vue │ │ ├── Edit.vue │ │ ├── List.vue │ │ └── Manage.vue │ │ ├── User │ │ ├── Pwd.vue │ │ ├── Level.vue │ │ ├── Info.vue │ │ ├── Save.vue │ │ └── Bank.vue │ │ ├── Index │ │ └── Index.vue │ │ ├── Stat │ │ ├── Operate.vue │ │ ├── Outcome.vue │ │ └── Returned.vue │ │ └── Print │ │ └── Index.vue ├── js │ ├── routes.js │ ├── util.js │ ├── main.js │ ├── auth.js │ ├── filter.js │ └── router.js └── data │ └── loan │ ├── list.js │ └── staff.js ├── .gitignore ├── doc ├── 1 │ ├── gulp.md │ ├── webpack.md │ ├── vue.md │ ├── loader.md │ └── babel.md ├── 2 │ ├── webpack.md │ └── gulp.md ├── 3 │ └── main.md └── 4 │ ├── webpack.md │ └── router.md ├── .babelrc ├── LICENSE ├── README.md ├── package.json ├── index.html ├── gulpfile.js ├── webpack.config.js └── records └── acccenterpage.vjson /src/scss/conf/common.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/scss/pages/stat/operate.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/scss/pages/user/bank.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/img/bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lifetea/vue-admin/HEAD/src/img/bg.jpg -------------------------------------------------------------------------------- /src/img/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lifetea/vue-admin/HEAD/src/img/icon.png -------------------------------------------------------------------------------- /src/assets/login_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lifetea/vue-admin/HEAD/src/assets/login_logo.png -------------------------------------------------------------------------------- /src/scss/com/leverbar.scss: -------------------------------------------------------------------------------- 1 | .crumbs-wrp{ 2 | padding: 1rem 0; 3 | border-bottom: 1px solid #e5e5e5; 4 | } -------------------------------------------------------------------------------- /src/scss/conf/_all.scss: -------------------------------------------------------------------------------- 1 | @charset "utf-8"; 2 | 3 | @import "variable.scss"; 4 | @import "minireset.scss"; 5 | @import "common.scss"; -------------------------------------------------------------------------------- /src/scss/conf/mixin.scss: -------------------------------------------------------------------------------- 1 | @mixin clearfix { 2 | &:after { 3 | content: ""; 4 | display: table; 5 | clear: both; 6 | } 7 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Created by .ignore support plugin (hsz.mobi) 2 | .gitignore 3 | .idea/ 4 | package.json 5 | node_modules/ 6 | dist/ 7 | doc/res/ 8 | -------------------------------------------------------------------------------- /src/lib/Regex.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by lifetea on 2017/3/15. 3 | * email: 494886251@qq.com 4 | * github: https://github.com/lifetea 5 | */ 6 | -------------------------------------------------------------------------------- /doc/1/gulp.md: -------------------------------------------------------------------------------- 1 | #### 安装gulp 2 | npm i --save-dev gulp 3 | #### 安装gulp-minify 4 | npm i --save-dev gulp-minify 5 | #### 安装gulp-uglify 6 | npm i --save-dev gulp-uglify 7 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets" : [ ["es2015", {"loose": true}] ], 3 | "plugins" : [ 4 | "transform-es3-property-literals", 5 | "transform-es3-member-expression-literals", 6 | "transform-es2015-modules-commonjs" 7 | ] 8 | } -------------------------------------------------------------------------------- /doc/1/webpack.md: -------------------------------------------------------------------------------- 1 | 2 | #### 安装webpack到全局 3 | npm i -g webpack 4 | 5 | #### 安装webpack到项目 6 | npm i --save-dev webpack 7 | 8 | #### 安装webpack-dev-server(须和webpack版本兼容) 9 | npm i --save-dev webpack-dev-server 10 | -------------------------------------------------------------------------------- /doc/1/vue.md: -------------------------------------------------------------------------------- 1 | 2 | #### 安装vue 3 | npm i --save-dev vue 4 | 5 | #### 安装vue-router(路由) 6 | npm i --save-dev vue-router 7 | 8 | #### 安装vuex 9 | npm i --save-dev vuex 10 | 11 | #### 安装vue-resource(网络请求) 12 | npm i --save-dev vue-resource -------------------------------------------------------------------------------- /doc/1/loader.md: -------------------------------------------------------------------------------- 1 | #### 安装style-loader 2 | npm i --save-dev style-loader 3 | 4 | #### 安装vue-loader 5 | npm i --save-dev vue-loader 6 | 7 | #### 安装css-loader 8 | npm i --save-dev css-loader 9 | 10 | ####安装babel-loader 11 | npm i --save-dev babel-loader -------------------------------------------------------------------------------- /src/scss/com/sidebar.scss: -------------------------------------------------------------------------------- 1 | @import "../conf/variable.scss"; 2 | .sidebar-wrp{ 3 | background: $theme-sidebar-wrap-background; 4 | .el-menu-item, .el-submenu__title{ 5 | font-size: 1rem; 6 | height: 46px; 7 | line-height: 46px; 8 | } 9 | & > ul{ 10 | height: 100%; 11 | } 12 | } -------------------------------------------------------------------------------- /src/scss/main.scss: -------------------------------------------------------------------------------- 1 | @charset "uft-8"; 2 | @import "conf/all"; 3 | 4 | $body-size: $size-6 !default; 5 | 6 | html{ 7 | font-size: $body-size; 8 | font-family: $family-sans-serif; 9 | } 10 | 11 | #main, .wrapper, body, html { 12 | width: 100%; 13 | height: 100%; 14 | } 15 | .main-wrp{ 16 | height: 100%; 17 | } -------------------------------------------------------------------------------- /src/scss/lib/element.scss: -------------------------------------------------------------------------------- 1 | //@import "~element/base.css"; 2 | //@import "~element/menu.css"; 3 | //@import "~element/form.css"; 4 | //@import "~element/button.css"; 5 | //@import "~element/input.css"; 6 | //@import "~element/col.css"; 7 | 8 | //menu-item-group.css text/css 0 B 2017-03-09T10:14:56.000Z 9 | // menu-item.css text/css 0 B 2017-03-09T10:14:56.000Z 10 | -------------------------------------------------------------------------------- /src/scss/pages/news/list.scss: -------------------------------------------------------------------------------- 1 | .new-list{ 2 | padding: 1rem; 3 | .list{ 4 | font-size: 14px; 5 | li { 6 | border: 1px solid #DDD; 7 | height: 38px; 8 | line-height: 38px; 9 | margin-bottom: 15px; 10 | } 11 | 12 | li .hint { 13 | float: left; 14 | margin: 0px 15px; 15 | color: #FE9802; 16 | } 17 | 18 | li .time { 19 | float: right; 20 | margin-right: 15px; 21 | color: #666; 22 | font-size: 12px; 23 | } 24 | } 25 | 26 | } 27 | 28 | -------------------------------------------------------------------------------- /src/scss/pages/news/manage.scss: -------------------------------------------------------------------------------- 1 | .new-list{ 2 | padding: 1rem; 3 | .list{ 4 | font-size: 14px; 5 | li { 6 | border: 1px solid #DDD; 7 | height: 38px; 8 | line-height: 38px; 9 | margin-bottom: 15px; 10 | } 11 | 12 | li .hint { 13 | float: left; 14 | margin: 0px 15px; 15 | color: #FE9802; 16 | } 17 | 18 | li .time { 19 | float: right; 20 | margin-right: 15px; 21 | color: #666; 22 | font-size: 12px; 23 | } 24 | } 25 | 26 | } 27 | 28 | -------------------------------------------------------------------------------- /src/view/Layout.vue: -------------------------------------------------------------------------------- 1 | 11 | 14 | 24 | -------------------------------------------------------------------------------- /src/scss/pages/user/info.scss: -------------------------------------------------------------------------------- 1 | .bg_w { 2 | background: white; 3 | padding: 15px; 4 | } 5 | .in_news ul li { 6 | border: 1px solid #DDD; 7 | height: 38px; 8 | line-height: 38px; 9 | margin-bottom: 15px; 10 | } 11 | .in_news ul li .hint { 12 | float: left; 13 | margin: 0px 15px; 14 | color: #FE9802; 15 | } 16 | .in_news ul li .time { 17 | float: right; 18 | margin-right: 15px; 19 | color: #666; 20 | font-size: 12px; 21 | } 22 | 23 | .user-info{ 24 | .wrap{ 25 | width: 500px; 26 | margin: 0 auto; 27 | margin-bottom: 20px; 28 | color: #666; 29 | } 30 | } -------------------------------------------------------------------------------- /src/js/routes.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by lifetea on 2016/12/16. 3 | * email: 494886251@qq.com 4 | * github: https://github.com/lifetea 5 | */ 6 | 7 | //lazy load 8 | const lazyLoading = (name, index = false) => () => System.import(`../view/${name}${index ? '/index' : ''}.vue`) 9 | 10 | //布局 11 | 12 | 13 | const routes = [ 14 | { path: '', component: lazyLoading('Layout'), 15 | children: [ 16 | 17 | ] 18 | }, 19 | { 20 | path: '/login', 21 | name:'login', 22 | component: lazyLoading('Login') 23 | }, 24 | ]; 25 | 26 | export default routes; -------------------------------------------------------------------------------- /src/scss/conf/variable.scss: -------------------------------------------------------------------------------- 1 | $theme-header-wrap-background :#4c4f53; 2 | $theme-header-wrap-color :#ffffff; 3 | $theme-login-wrap-background :#324157; 4 | $theme-sidebar-wrap-background :#464c5b; 5 | 6 | 7 | 8 | // Typography 9 | $family-sans-serif: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif !default 10 | $family-monospace: "Inconsolata", "Consolas", "Monaco", monospace !default 11 | 12 | $size-1: 3.5rem !default 13 | $size-2: 2.75rem !default 14 | $size-3: 2rem !default 15 | $size-4: 1.5rem !default 16 | $size-5: 1.25rem !default 17 | $size-6: 13px !default 18 | $size-7: 0.75rem !default -------------------------------------------------------------------------------- /src/scss/pages/news/detail.scss: -------------------------------------------------------------------------------- 1 | .home_news{ 2 | margin-top: 30px; 3 | padding: 0 30px; 4 | .home_news_padd { 5 | padding-right: 30px; 6 | } 7 | .bg_w { 8 | background: white; 9 | .pxzx_tit { 10 | border-bottom: 1px solid #ddd; 11 | height: 50px; 12 | line-height: 50px; 13 | color: black; 14 | font-size: 16px; 15 | overflow: hidden; 16 | } 17 | .pxzx_fbr { 18 | overflow: hidden; 19 | color: #aaa; 20 | margin: 10px 0; 21 | } 22 | 23 | .pxzx_con { 24 | line-height: 30px; 25 | color: #333; 26 | font-size: 14px; 27 | text-indent: 2em; 28 | } 29 | 30 | } 31 | 32 | 33 | } 34 | -------------------------------------------------------------------------------- /doc/2/webpack.md: -------------------------------------------------------------------------------- 1 | ### 在根目录创建 webpack.config.js 2 | 3 | module.exports = { 4 | entry: './src/js/main.js', 5 | output: { 6 | path: __dirname + '/dist', 7 | publicPath: 'dist/', 8 | filename: 'build.js' 9 | }, 10 | module: { 11 | loaders: [ 12 | { 13 | test: /\.vue$/, 14 | loader: 'vue-loader' 15 | }, 16 | { 17 | test: /\.js$/, 18 | exclude: /(node_modules|bower_components)/, 19 | loader: 'babel-loader', 20 | } 21 | ] 22 | 23 | }, 24 | devtool: '#eval-source-map' 25 | } 26 | 27 | 28 | -------------------------------------------------------------------------------- /src/view/Main.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 12 | 13 | 33 | -------------------------------------------------------------------------------- /src/scss/pages/news/add.scss: -------------------------------------------------------------------------------- 1 | .bg_w { 2 | background: white; 3 | padding: 15px; 4 | } 5 | .in_news ul li { 6 | border: 1px solid #DDD; 7 | height: 38px; 8 | line-height: 38px; 9 | margin-bottom: 15px; 10 | } 11 | .in_news ul li .hint { 12 | float: left; 13 | margin: 0px 15px; 14 | color: #FE9802; 15 | } 16 | .in_news ul li .time { 17 | float: right; 18 | margin-right: 15px; 19 | color: #666; 20 | font-size: 12px; 21 | } 22 | 23 | .user-info{ 24 | .wrap{ 25 | width: 80%; 26 | margin: 0 auto; 27 | margin-bottom: 20px; 28 | color: #666; 29 | } 30 | } 31 | 32 | .ql-container .ql-editor { 33 | min-height: 20em; 34 | padding-bottom: 1em; 35 | max-height: 25em; 36 | } 37 | 38 | .news-type .el-select{ 39 | width: 100%; 40 | } -------------------------------------------------------------------------------- /src/view/Com/LeverBar.vue: -------------------------------------------------------------------------------- 1 | 9 | 28 | -------------------------------------------------------------------------------- /src/scss/com/header.scss: -------------------------------------------------------------------------------- 1 | @import "../conf/variable.scss"; 2 | 3 | .header-wrp{ 4 | background-color: $theme-header-wrap-background; 5 | position: relative; 6 | width: 100%; 7 | height: 46px; 8 | overflow: hidden; 9 | line-height: 46px; 10 | font-size: 1rem; 11 | .logo{ 12 | vertical-align: middle; 13 | float: left; 14 | width:250px; 15 | text-align: center; 16 | line-height: 46px; 17 | } 18 | color: $theme-header-wrap-color ; 19 | } 20 | 21 | .user-info { 22 | float: right; 23 | padding-right: 50px; 24 | font-size: 16px; 25 | color: #fff; 26 | } 27 | .user-info .el-dropdown-link{ 28 | position: relative; 29 | display: inline-block; 30 | padding-left: 50px; 31 | color: #fff; 32 | cursor: pointer; 33 | vertical-align: middle; 34 | } 35 | .user-info .user-logo{ 36 | position: absolute; 37 | left:0; 38 | top:15px; 39 | width:40px; 40 | height:40px; 41 | border-radius: 50%; 42 | } 43 | .el-dropdown-menu__item{ 44 | text-align: center; 45 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 李松阳 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /doc/4/webpack.md: -------------------------------------------------------------------------------- 1 | #### 使用 webpack 插件 ProvidePlugin 2 |

ProvidePlugin是webpack内置的插件他能让如juqery这样的三方库暴露到全局环境中，即我们能够在全局环境中使用$。在项目中会在很多地方使用到Vue,如果不把Vue当做全局,每个使用了Vue的文件都引入一遍造成webpack打包之后代码的体积非常大每个页面加载很慢。

3 | 4 | #### 更新后的 webpack.config.js 5 | //引入webpack 6 | var webpack = require('webpack'); 7 | 8 | module.exports = { 9 | entry: './src/js/main.js', 10 | output: { 11 | path: __dirname + '/dist', 12 | publicPath: 'dist/', 13 | filename: 'build.js' 14 | }, 15 | module: { 16 | loaders: [ 17 | { 18 | test: /\.vue$/, 19 | loader: 'vue-loader' 20 | }, 21 | { 22 | test: /\.js$/, 23 | exclude: /(node_modules|bower_components)/, 24 | loader: 'babel-loader', 25 | } 26 | ] 27 | }, 28 | plugins: [ 29 | //使用插件让我们能够在全局使用Vue 30 | new webpack.ProvidePlugin({ 31 | Vue: 'Vue' 32 | }), 33 | ], 34 | devtool: '#eval-source-map' 35 | } -------------------------------------------------------------------------------- /src/js/util.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by lifetea on 2017/4/18. 3 | * email: 494886251@qq.com 4 | * github: https://github.com/lifetea 5 | */ 6 | 7 | let reqData = { 8 | mobiel:null, 9 | name:'lifetea', 10 | certNo:'', 11 | status:0 12 | } 13 | 14 | // console.log(reqData) 15 | 16 | let dataClear = function (obj) { 17 | for (var a in obj){ 18 | if(obj[a] === null || obj[a] === '' ) 19 | delete obj[""+a] 20 | } 21 | } 22 | 23 | // dataClear(reqData) 24 | // 25 | // console.log(reqData) 26 | 27 | 28 | let dataReset = function (obj) { 29 | for (var a in obj){ 30 | obj[a] = null 31 | } 32 | } 33 | 34 | 35 | let getFile = function (response,fileName) { 36 | var headers = response.headers; 37 | var blob = new Blob([response.data],{type:headers['content-type']}); 38 | var link = document.createElement('a'); 39 | link.href = window.URL.createObjectURL(blob); 40 | link.download = fileName; 41 | link.click(); 42 | } 43 | 44 | 45 | export default { 46 | dataClear:dataClear, 47 | dataReset:dataReset, 48 | getFile:getFile 49 | } -------------------------------------------------------------------------------- /src/scss/conf/minireset.scss: -------------------------------------------------------------------------------- 1 | /*! minireset.css v0.0.2 | MIT License | github.com/jgthms/minireset.css */ 2 | // Blocks 3 | html, 4 | body, 5 | p, 6 | ol, 7 | ul, 8 | li, 9 | dl, 10 | dt, 11 | dd, 12 | blockquote, 13 | figure, 14 | fieldset, 15 | legend, 16 | textarea, 17 | pre, 18 | iframe, 19 | hr, 20 | h1, 21 | h2, 22 | h3, 23 | h4, 24 | h5, 25 | h6{ 26 | margin: 0; 27 | padding: 0; 28 | } 29 | 30 | // Headings 31 | h1, h2, h3, h4, h5, h6{ 32 | font-size: 100%; 33 | font-weight: normal; 34 | } 35 | 36 | // List 37 | ul{ 38 | list-style: none 39 | } 40 | 41 | // Form 42 | button, input, select, textarea{ 43 | margin: 0 44 | } 45 | 46 | // Box sizing 47 | html{ 48 | box-sizing: border-box 49 | } 50 | 51 | 52 | //*{ 53 | // box-sizing: inherit; 54 | // &:before, 55 | // &:after{ 56 | // box-sizing: inherit 57 | // } 58 | //} 59 | 60 | // Media 61 | img, embed, object, audio, video{ 62 | height: auto; 63 | max-width: 100%; 64 | } 65 | 66 | // Iframe 67 | iframe{ 68 | border: 0 69 | } 70 | 71 | // Table 72 | table{ 73 | border-collapse: collapse; 74 | border-spacing: 0; 75 | 76 | } 77 | 78 | td, th{ 79 | padding: 0; 80 | text-align: left; 81 | } 82 | 83 | a{ 84 | text-decoration: none; 85 | } -------------------------------------------------------------------------------- /src/js/main.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by lifetea on 16/9/20. 3 | */ 4 | // app.js 5 | 6 | Vue = require('Vue') 7 | 8 | import Main from '../view/Main.vue' 9 | 10 | import {router} from './router' 11 | 12 | // 13 | // import { sync } from 'vuex-router-sync' 14 | // 15 | // import store from '../vuex/store' 16 | // 17 | 18 | 19 | 20 | Vue.debugUrl = "/admin" 21 | 22 | //filter 23 | 24 | require.ensure([], () => { 25 | require('./filter.js'); 26 | // require('./b'); 27 | }, ''); 28 | // import filter from './filter.js' 29 | 30 | // System.import('./filter.js') 31 | 32 | // sync(store, router) 33 | 34 | import vueResource from 'vue-resource' 35 | Vue.use(vueResource) 36 | Vue.http.options.emulateJSON = true; 37 | 38 | //网络请求 39 | // System.import('vue-resource').then(function(resource) { 40 | // Vue.use(resource) 41 | // Vue.http.options.emulateJSON = true; 42 | // session 失效跳转 43 | // Vue.http.interceptors.push((request, next) => { 44 | // next((response) => { 45 | // if(response.status == 200 && response.body.status == 'UNLOGIN'){ 46 | // window.location.hash = "#/login" 47 | // } 48 | // }); 49 | // }); 50 | // }); 51 | 52 | //初始化APP 53 | var app = new Vue({ 54 | el:"#main", 55 | router, 56 | // store, 57 | render: h => h(Main), 58 | }) 59 | 60 | -------------------------------------------------------------------------------- /src/scss/pages/stat/info.scss: -------------------------------------------------------------------------------- 1 | @import "src/scss/conf/variable.scss"; 2 | @import "src/scss/conf/mixin.scss"; 3 | .stat-loan{ 4 | width: 100%; 5 | padding: 1rem; 6 | box-sizing: border-box; 7 | .stat-box{ 8 | padding-top: .4rem; 9 | } 10 | .item-box{ 11 | display: inline-block; 12 | padding-left: 1rem; 13 | } 14 | .search-box{ 15 | padding-top: 1rem; 16 | .el-input{ 17 | width: 160px; 18 | &.time{ 19 | width: 200px; 20 | } 21 | &.money{ 22 | width: 100px; 23 | } 24 | } 25 | .lang{ 26 | .el-input{ 27 | width: 200px; 28 | } 29 | } 30 | .short{ 31 | .el-input{ 32 | width: 80px; 33 | } 34 | } 35 | .middle{ 36 | .el-input{ 37 | width: 110px; 38 | } 39 | } 40 | .long{ 41 | &.el-date-editor{ 42 | width: 330px; 43 | } 44 | } 45 | label{ 46 | font-size: 1rem; 47 | } 48 | .el-form-item{ 49 | display: inline-block; 50 | margin-bottom: 1rem; 51 | } 52 | } 53 | .result-box{ 54 | padding-bottom: 1rem; 55 | @include clearfix; 56 | a{ 57 | padding: 0 .6rem; 58 | color: black; 59 | } 60 | } 61 | .footer-box{ 62 | padding-top: 1rem; 63 | @include clearfix; 64 | } 65 | .table{ 66 | cursor: move; 67 | } 68 | 69 | 70 | .el-table{ 71 | font-size: $size-7; 72 | } 73 | } -------------------------------------------------------------------------------- /src/scss/pages/stat/loan.scss: -------------------------------------------------------------------------------- 1 | @import "src/scss/conf/variable.scss"; 2 | @import "src/scss/conf/mixin.scss"; 3 | .stat-loan{ 4 | width: 100%; 5 | padding: 1rem; 6 | box-sizing: border-box; 7 | .stat-box{ 8 | padding-top: .4rem; 9 | } 10 | .item-box{ 11 | display: inline-block; 12 | padding-left: 1rem; 13 | } 14 | .search-box{ 15 | padding-top: 1rem; 16 | .el-input{ 17 | width: 160px; 18 | &.time{ 19 | width: 180px; 20 | } 21 | &.money{ 22 | width: 100px; 23 | } 24 | } 25 | .lang{ 26 | .el-input{ 27 | width: 200px; 28 | } 29 | } 30 | .short{ 31 | .el-input{ 32 | width: 80px; 33 | } 34 | } 35 | .middle{ 36 | .el-input{ 37 | width: 110px; 38 | } 39 | } 40 | .long{ 41 | &.el-date-editor{ 42 | width: 330px; 43 | } 44 | } 45 | label{ 46 | font-size: 1rem; 47 | } 48 | .el-form-item{ 49 | display: inline-block; 50 | margin-bottom: 1rem; 51 | } 52 | } 53 | .result-box{ 54 | padding-bottom: 1rem; 55 | @include clearfix; 56 | a{ 57 | padding: 0 .6rem; 58 | color: black; 59 | } 60 | } 61 | .footer-box{ 62 | padding-top: 1rem; 63 | @include clearfix; 64 | } 65 | .table{ 66 | cursor: move; 67 | } 68 | 69 | 70 | .el-table{ 71 | font-size: $size-7; 72 | } 73 | } -------------------------------------------------------------------------------- /src/view/Com/Header.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 43 | -------------------------------------------------------------------------------- /src/scss/pages/stat/credit.scss: -------------------------------------------------------------------------------- 1 | @import "src/scss/conf/variable.scss"; 2 | @import "src/scss/conf/mixin.scss"; 3 | .stat-loan{ 4 | width: 100%; 5 | padding: 1rem; 6 | box-sizing: border-box; 7 | .stat-box{ 8 | padding-top: .4rem; 9 | } 10 | .item-box{ 11 | display: inline-block; 12 | padding-left: 1rem; 13 | } 14 | .search-box{ 15 | padding-top: 1rem; 16 | .el-input{ 17 | width: 160px; 18 | &.time{ 19 | width: 180px; 20 | } 21 | &.money{ 22 | width: 100px; 23 | } 24 | } 25 | .lang{ 26 | .el-input{ 27 | width: 200px; 28 | } 29 | } 30 | .short{ 31 | .el-input{ 32 | width: 80px; 33 | } 34 | } 35 | .middle{ 36 | .el-input{ 37 | width: 110px; 38 | } 39 | } 40 | .long{ 41 | &.el-date-editor{ 42 | width: 330px; 43 | } 44 | } 45 | label{ 46 | font-size: 1rem; 47 | } 48 | .el-form-item{ 49 | display: inline-block; 50 | margin-bottom: 1rem; 51 | } 52 | } 53 | .result-box{ 54 | padding-bottom: 1rem; 55 | @include clearfix; 56 | a{ 57 | padding: 0 .6rem; 58 | color: black; 59 | } 60 | } 61 | .footer-box{ 62 | padding-top: 1rem; 63 | @include clearfix; 64 | } 65 | .table{ 66 | cursor: move; 67 | } 68 | 69 | 70 | .el-table{ 71 | font-size: $size-7; 72 | } 73 | } -------------------------------------------------------------------------------- /src/scss/pages/stat/invest.scss: -------------------------------------------------------------------------------- 1 | @import "src/scss/conf/variable.scss"; 2 | @import "src/scss/conf/mixin.scss"; 3 | .stat-loan{ 4 | width: 100%; 5 | padding: 1rem; 6 | box-sizing: border-box; 7 | .stat-box{ 8 | padding-top: .4rem; 9 | } 10 | .item-box{ 11 | display: inline-block; 12 | padding-left: 1rem; 13 | } 14 | .search-box{ 15 | padding-top: 1rem; 16 | .el-input{ 17 | width: 160px; 18 | &.time{ 19 | width: 180px; 20 | } 21 | &.money{ 22 | width: 100px; 23 | } 24 | } 25 | .lang{ 26 | .el-input{ 27 | width: 200px; 28 | } 29 | } 30 | .short{ 31 | .el-input{ 32 | width: 80px; 33 | } 34 | } 35 | .middle{ 36 | .el-input{ 37 | width: 110px; 38 | } 39 | } 40 | .long{ 41 | &.el-date-editor{ 42 | width: 330px; 43 | } 44 | } 45 | label{ 46 | font-size: 1rem; 47 | } 48 | .el-form-item{ 49 | display: inline-block; 50 | margin-bottom: 1rem; 51 | } 52 | } 53 | .result-box{ 54 | padding-bottom: 1rem; 55 | @include clearfix; 56 | a{ 57 | padding: 0 .6rem; 58 | color: black; 59 | } 60 | } 61 | .footer-box{ 62 | padding-top: 1rem; 63 | @include clearfix; 64 | } 65 | .table{ 66 | cursor: move; 67 | } 68 | 69 | 70 | .el-table{ 71 | font-size: $size-7; 72 | } 73 | } -------------------------------------------------------------------------------- /src/scss/pages/stat/outcome.scss: -------------------------------------------------------------------------------- 1 | @import "src/scss/conf/variable.scss"; 2 | @import "src/scss/conf/mixin.scss"; 3 | .stat-loan{ 4 | width: 100%; 5 | padding: 1rem; 6 | box-sizing: border-box; 7 | .stat-box{ 8 | padding-top: .4rem; 9 | } 10 | .item-box{ 11 | display: inline-block; 12 | padding-left: 1rem; 13 | } 14 | .search-box{ 15 | padding-top: 1rem; 16 | .el-input{ 17 | width: 160px; 18 | &.time{ 19 | width: 180px; 20 | } 21 | &.money{ 22 | width: 100px; 23 | } 24 | } 25 | .lang{ 26 | .el-input{ 27 | width: 200px; 28 | } 29 | } 30 | .short{ 31 | .el-input{ 32 | width: 80px; 33 | } 34 | } 35 | .middle{ 36 | .el-input{ 37 | width: 110px; 38 | } 39 | } 40 | .long{ 41 | &.el-date-editor{ 42 | width: 330px; 43 | } 44 | } 45 | label{ 46 | font-size: 1rem; 47 | } 48 | .el-form-item{ 49 | display: inline-block; 50 | margin-bottom: 1rem; 51 | } 52 | } 53 | .result-box{ 54 | padding-bottom: 1rem; 55 | @include clearfix; 56 | a{ 57 | padding: 0 .6rem; 58 | color: black; 59 | } 60 | } 61 | .footer-box{ 62 | padding-top: 1rem; 63 | @include clearfix; 64 | } 65 | .table{ 66 | cursor: move; 67 | } 68 | 69 | 70 | .el-table{ 71 | font-size: $size-7; 72 | } 73 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 后台管理系统 2 | =========================== 3 | 通过 vue@2.3.0^ webpack@^2.4.1 来搭建后台管理 4 | 5 | author :lifetea 6 | mail :494886251@qq.com 7 | wechat :weiweipuzi 8 | 9 | 如果这个教程对您有所帮助 给一个star吧 - .. - 10 | 11 | #### layout布局 12 | ![alt text]( http://cdn.2mmr.com/vue-admin/layout.png "运行效果") 13 | 14 | #### 登录页面 15 | ![alt text]( http://cdn.2mmr.com/vue-admin/login.png "运行效果") 16 | 17 | #### 新闻页面(富文本) 18 | ![alt text]( http://cdn.2mmr.com/vue-admin/news.jpeg "运行效果") 19 | 20 | 21 | ## 目录 22 | * 1.[第一步搭建环境](#Install) 23 | * [安装vue环境](./doc/1/vue.md) 24 | * [安装webpack环境](./doc/1/webpack.md) 25 | * [安装babel](./doc/1/babel.md) 26 | * [安装loader](./doc/1/loader.md) 27 | * [安装gulp](./doc/1/gulp.md) 28 | * 2.[第二步配置环境](#Config) 29 | * [配置webpack](./doc/2/webpack.md) 30 | * [配置gulp](./doc/2/gulp.md) 31 | * 3.[第三步构建入口](#App) 32 | * [webpack入口和输出](./doc/3/main.md) 33 | * [创建index.html](./doc/3/main.md) 34 | * [创建main.js](./doc/3/main.md) 35 | * [创建Main.vue](./doc/3/main.md) 36 | * 4.[第四步搭建路由](#Route) 37 | * [Vue全局化](./doc/4/webpack.md) 38 | * [创建配置路由](./doc/4/router.md) 39 | * 5.[第五步登录页面](#Login) 40 | * [登录页面](./doc/5/login.md) 41 | * [惰性加载](./doc/5/gulp.md) 42 | * [更新配置](./doc/5/gulp.md) 43 | * [登录授权](./doc/5/gulp.md) 44 | * [退出登录](./doc/5/gulp.md) 45 | * 6.[第六步页面布局](#Layout) 46 | * [配置webpack](./doc/6/webpack.md) 47 | * [配置gulp](./doc/6/gulp.md) 48 | -------------------------------------------------------------------------------- /doc/1/babel.md: -------------------------------------------------------------------------------- 1 | #### 安装babel 2 | npm i --save-dev babel-cli babel-core 3 | 4 | #### 转换es2015 5 | 6 | npm i --save-dev babel-preset-es2015 babel-preset-es2015-loose 7 | 8 | #### 兼容es3 9 | 10 | npm i --save-dev babel-plugin-transform-es2015-modules-commonjs babel-plugin-transform-es3-member-expression-literals babel-plugin-transform-es3-property-literals 11 | 12 | 13 | #### 在webpack中使用babel 14 | 15 | module: { 16 | loaders: [ 17 | { 18 | test: /\.js$/, 19 | exclude: /(node_modules|bower_components)/, 20 | loader: 'babel-loader', 21 | } 22 | ] 23 | }, 24 | 25 | #### 配置babel 在根目录中创建.babelrc 26 | 27 | { 28 | "presets" : [ ["es2015", {"loose": true}] ], 29 | "plugins" : [ 30 | "transform-es3-property-literals", 31 | "transform-es3-member-expression-literals", 32 | "transform-es2015-modules-commonjs" 33 | ] 34 | } 35 | 36 | ### 配置 babel-polyfill 37 | 38 | 39 | 作用: 40 | Babel默认只转换新的JavaScript句法（syntax），而不转换新的API，比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象，以及一些定义在全局对象上的方法（比如Object.assign）都不会转码。 41 | 举例来说，ES6在Array对象上新增了Array.from方法。Babel就不会转码这个方法。如果想让这个方法运行，必须使用babel-polyfill，为当前环境提供一个垫片。 42 | 43 | 安装: 44 | npm install i --save-dev babel-polyfill 45 | 46 | webpack中配置: 47 | entry: ["babel-polyfill", "./src/js/main.js"], 48 | -------------------------------------------------------------------------------- /src/scss/pages/index/index.scss: -------------------------------------------------------------------------------- 1 | .home_con { 2 | width: 100%; 3 | height: 100%; 4 | overflow-y: auto; 5 | position: relative; 6 | } 7 | .home_con_foot { 8 | position: absolute; 9 | left: 0; 10 | bottom: 70px; 11 | width: 100%; 12 | color: #666; 13 | } 14 | .home_gg { 15 | color: #009900; 16 | background: #f2ffea; 17 | line-height: 50px; 18 | height: 50px; 19 | padding-left: 10px; 20 | } 21 | .home_hy, .home_news { 22 | margin-top: 30px; 23 | padding: 0 30px; 24 | } 25 | .home_hy_con { 26 | width: 100%; 27 | overflow: hidden; 28 | } 29 | .home_hy_con .w30 { 30 | width: 33.33333%; 31 | float: left; 32 | } 33 | .hy_con_padd { 34 | padding-right: 30px; 35 | } 36 | .hy_con_padd table { 37 | line-height: 40px; 38 | color: #666; 39 | font-size: 14px; 40 | } 41 | .home_news_padd { 42 | padding-right: 30px; 43 | } 44 | .home_news_con { 45 | width: 100%; 46 | background: white; 47 | } 48 | .tit { 49 | border-left: 4px solid #778; 50 | padding: 10px 15px; 51 | background: #F4F5F9 none repeat scroll 0% 0%; 52 | } 53 | .bg_w { 54 | background: white; 55 | padding: 15px; 56 | } 57 | .in_news ul li { 58 | border: 1px solid #DDD; 59 | height: 38px; 60 | line-height: 38px; 61 | margin-bottom: 15px; 62 | } 63 | .in_news ul li .hint { 64 | float: left; 65 | margin: 0px 15px; 66 | color: #FE9802; 67 | } 68 | .in_news ul li .time { 69 | float: right; 70 | margin-right: 15px; 71 | color: #666; 72 | font-size: 12px; 73 | } -------------------------------------------------------------------------------- /doc/3/main.md: -------------------------------------------------------------------------------- 1 | #### 在webpack.config.js中配置 2 | //入口文件设置 3 | entry: './src/js/main.js', 4 | //输出目录 和 文件设置 5 | output: { 6 | path: __dirname + '/dist', 7 | filename: 'build.js' 8 | }, 9 | 10 | #### 创建 根目录/index.html 11 | 12 | 13 | 14 | 15 | 哈喽宝贝后台管理 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | #### 创建 src/js/main.js 25 | // 导入Vue 26 | import Vue from 'vue' 27 | // 导入Main.vue 28 | import Main from '../view/Main.vue' 29 | 30 | //初始化APP 31 | var app = new Vue({ 32 | el:"#main", 33 | // router, 34 | // store, 35 | render: h => h(Main), 36 | }) 37 | 38 | 39 | 40 | #### 创建 src/view/Main.vue 41 | 48 | 50 | 64 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vue-insurance", 3 | "version": "1.0.0", 4 | "description": "用vue开发一个车险营销管理后台", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "repository": { 10 | "type": "git", 11 | "url": "git+https://github.com/lifetea/vue-insurance.git" 12 | }, 13 | "author": "", 14 | "license": "ISC", 15 | "bugs": { 16 | "url": "https://github.com/lifetea/vue-insurance/issues" 17 | }, 18 | "homepage": "https://github.com/lifetea/vue-insurance#readme", 19 | "dependencies": { 20 | "babel-polyfill": "^6.23.0", 21 | "element-ui": "^1.3.4", 22 | "iview": "^2.0.0-rc.15", 23 | "vue": "^2.3.0", 24 | "vue-quill-editor": "^2.2.1" 25 | }, 26 | "devDependencies": { 27 | "babel": "^6.23.0", 28 | "babel-core": "^6.24.1", 29 | "babel-loader": "^7.0.0", 30 | "babel-plugin-transform-es2015-modules-commonjs": "^6.24.1", 31 | "babel-plugin-transform-es3-member-expression-literals": "^6.22.0", 32 | "babel-plugin-transform-es3-property-literals": "^6.22.0", 33 | "babel-plugin-transform-runtime": "^6.23.0", 34 | "babel-preset-es2015": "^6.24.1", 35 | "babel-runtime": "^6.23.0", 36 | "css-loader": "^0.28.1", 37 | "extract-text-webpack-plugin": "^2.1.0", 38 | "file-loader": "^0.11.1", 39 | "font-awesome": "^4.7.0", 40 | "gulp": "^3.9.1", 41 | "gulp-qiniu": "^0.2.4", 42 | "node-sass": "^4.5.2", 43 | "sass-loader": "^6.0.3", 44 | "style-loader": "^0.16.1", 45 | "vue-loader": "^12.0.2", 46 | "vue-resource": "^1.3.1", 47 | "vue-router": "^2.5.2", 48 | "vue-template-compiler": "^2.3.0", 49 | "webpack": "^2.4.1" 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /src/scss/com/layout.scss: -------------------------------------------------------------------------------- 1 | .layout{ 2 | border: 1px solid #d7dde4; 3 | background: #f5f7f9; 4 | position: relative; 5 | border-radius: 4px; 6 | //overflow: hidden; 7 | height: 100%; 8 | .layout-wrp{ 9 | height: 100%; 10 | } 11 | .ivu-menu-vertical .ivu-menu-item{ 12 | padding:0; 13 | a.link{ 14 | padding: 14px 24px; 15 | display: block; 16 | color: inherit; 17 | &>i { 18 | margin-right: 6px; 19 | } 20 | } 21 | } 22 | .ivu-menu-vertical .ivu-menu-submenu .ivu-menu-item{ 23 | a.link{ 24 | padding-left: 43px; 25 | } 26 | } 27 | } 28 | .layout-breadcrumb{ 29 | padding: 10px 15px 0; 30 | } 31 | .layout-content{ 32 | min-height: calc(100% - 200px);; 33 | margin: 15px; 34 | overflow: hidden; 35 | background: #fff; 36 | border-radius: 4px; 37 | } 38 | .layout-content-main{ 39 | padding: 10px; 40 | } 41 | .layout-copy{ 42 | text-align: center; 43 | padding: 10px 0 20px; 44 | color: #9ea7b4; 45 | } 46 | .layout-menu-left{ 47 | height: 100%\0; 48 | &>ul{ 49 | height: 100%; 50 | } 51 | } 52 | .layout-header{ 53 | height: 60px; 54 | background: #fff; 55 | box-shadow: 0 1px 1px rgba(0,0,0,.1); 56 | } 57 | .layout-logo-left{ 58 | width: 90%; 59 | height: 30px; 60 | background: #5b6270; 61 | border-radius: 3px; 62 | margin: 15px auto; 63 | } 64 | .layout-ceiling-main a{ 65 | color: #9ba7b5; 66 | } 67 | .layout-hide-text{ 68 | .layout-text{ 69 | display: none; 70 | } 71 | .ivu-menu-vertical{ 72 | .ivu-menu-submenu{ 73 | .ivu-menu-item{ 74 | padding-left: 0; 75 | a.link { 76 | padding-left: 43px; 77 | } 78 | } 79 | } 80 | } 81 | } 82 | 83 | .ivu-col{ 84 | transition: width .2s ease-in-out; 85 | } -------------------------------------------------------------------------------- /src/js/auth.js: -------------------------------------------------------------------------------- 1 | /* globals localStorage */ 2 | 3 | export default { 4 | login () { 5 | localStorage.token = true; 6 | 7 | // cb = arguments[arguments.length - 1] 8 | // if (localStorage.token) { 9 | // if (cb) cb(true) 10 | // this.onChange(true) 11 | // return 12 | // } 13 | // pretendRequest(email, pass, (res) => { 14 | // if (res.authenticated) { 15 | // localStorage.token = res.token 16 | // if (cb) cb(true) 17 | // this.onChange(true) 18 | // } else { 19 | // if (cb) cb(false) 20 | // this.onChange(false) 21 | // } 22 | // }) 23 | }, 24 | setUser(user){ 25 | localStorage.user = user? JSON.stringify(user): null 26 | }, 27 | getUser(){ 28 | let user = localStorage.user ? JSON.parse(localStorage.user) : {} 29 | console.log(user) 30 | return user 31 | }, 32 | getToken () { 33 | return localStorage.token 34 | }, 35 | 36 | logout (cb) { 37 | delete localStorage.token 38 | delete localStorage.user 39 | if (cb) cb() 40 | this.onChange(false) 41 | }, 42 | 43 | loggedIn () { 44 | return !!localStorage.token 45 | }, 46 | 47 | onChange () {} 48 | } 49 | 50 | // function pretendRequest (email, pass, cb) { 51 | // setTimeout(() => { 52 | // if (email === 'joe@example.com' && pass === 'password1') { 53 | // cb({ 54 | // authenticated: true, 55 | // token: Math.random().toString(36).substring(7) 56 | // }) 57 | // } else { 58 | // cb({ authenticated: false }) 59 | // } 60 | // }, 0) 61 | // } -------------------------------------------------------------------------------- /doc/2/gulp.md: -------------------------------------------------------------------------------- 1 | #### gulpfile.js 2 | 3 | var gulp = require('gulp') 4 | var gutil = require("gulp-util"); 5 | var path = require('path'); 6 | 7 | // webpack dev server 8 | var webpackDevServer = require('webpack-dev-server'); 9 | // webpack 10 | var webpack = require('webpack') 11 | // webpack 配置 12 | var webpackConf = require("./webpack.config.js"); 13 | // 修改配置 14 | var devConf = Object.create(webpackConf); 15 | 16 | devConf.devtool = "sourcemap"; 17 | 18 | // 创建一个配置 19 | var devCompiler = webpack(devConf); 20 | 21 | gulp.task("webpack:build-dev", function(callback) { 22 | // 运行webpack 23 | devCompiler.run(function(err, stats) { 24 | if(err) throw new gutil.PluginError("webpack:build-dev", err); 25 | gutil.log("[webpack:build-dev]", stats.toString({ 26 | colors: true 27 | })); 28 | callback(); 29 | }); 30 | }); 31 | 32 | // 修改配置 33 | var serverConf = Object.create(webpackConf); 34 | serverConf.devtool = "eval"; 35 | 36 | gulp.task("webpack-dev-server", function(callback) { 37 | // 启动server 38 | new webpackDevServer(webpack(serverConf), { 39 | publicPath: "/" + serverConf.output.publicPath, 40 | stats: { 41 | colors: true 42 | }, 43 | hot:true, 44 | }).listen(8080, "localhost", function(err) { 45 | if(err) throw new gutil.PluginError("webpack-dev-server", err); 46 | gutil.log("[webpack-dev-server]", "http://localhost:8080/webpack-dev-server/index.html"); 47 | }); 48 | }); 49 | 50 | #### gulp webpack运行效果(关于黄色的提示我们在之后的优化会处理webpack打包体积过大的问题) 51 | ![alt text](../res/gulp-webpack.jpeg "运行效果") 52 | 53 | #### gulp webpack-dev-server 运行效果 54 | ![alt text](../res/gulp-webpack-dev-server.jpeg "运行效果") 55 | -------------------------------------------------------------------------------- /doc/4/router.md: -------------------------------------------------------------------------------- 1 | ####创建 src/view/Layout.vue 2 | 12 | 15 | 25 | 26 | ####创建 src/js/routes.js 27 | //布局 28 | import Layout from '../view/Layout.vue' 29 | 30 | 31 | const routes = [ 32 | { path: '', component: Layout, 33 | children: [ 34 | 35 | ] 36 | }, 37 | ]; 38 | 39 | export default routes; 40 | 41 | ####创建 src/js/router.js 42 | import VueRouter from 'vue-router' 43 | 44 | //挂载vue-router 45 | Vue.use(VueRouter); 46 | 47 | import routes from './routes' 48 | 49 | //定义路由 50 | var router = new VueRouter({ 51 | mode: 'hash', 52 | routes // （缩写）相当于 routes: routes 53 | }) 54 | 55 | export default router 56 | 57 | ####更新 src/view/Main.vue 58 | 64 | 66 | 77 | 78 | ####编译后 运行结果 79 | ![alt text](../res/4-create-router.jpg "运行效果") -------------------------------------------------------------------------------- /src/scss/com/login.scss: -------------------------------------------------------------------------------- 1 | @import "../conf/variable.scss"; 2 | @import "../conf/mixin.scss"; 3 | //@import "../lib/element.scss"; 4 | .login-wrap{ 5 | background-color: $theme-login-wrap-background; 6 | background-image: url("../../img/bg.jpg"); 7 | background-size: cover; 8 | } 9 | .plugins-tips{ 10 | background: #eef1f6; 11 | } 12 | .plugins-tips a{ 13 | color: #20a0ff; 14 | } 15 | .el-upload--text em { 16 | color: #20a0ff; 17 | } 18 | .pure-button{ 19 | background: #20a0ff; 20 | } 21 | .login-wrap{ 22 | width:100%; 23 | height:100%; 24 | box-sizing: border-box; 25 | .link-box{ 26 | font-size:12px; 27 | line-height:30px; 28 | color:#51689f; 29 | height: 30px; 30 | padding-top: .6rem; 31 | } 32 | } 33 | .ms-title{ 34 | margin: 0 auto; 35 | height: 44px; 36 | padding: 0 20px 2.6rem; 37 | box-sizing: content-box; 38 | color: #fff; 39 | text-align: center; 40 | .icon{ 41 | width: 80px; 42 | } 43 | span{ 44 | font-weight: 500; 45 | font-size: 1.8rem; 46 | //padding: 14px 0 0 24px; 47 | letter-spacing: 2px; 48 | } 49 | } 50 | .login-box{ 51 | position : absolute; 52 | top : 40%; 53 | left : 50%; 54 | transform : translate(-50%,-50%); 55 | width: 300px; 56 | } 57 | .ms-login{ 58 | margin: 0 auto; 59 | padding:30px 30px 20px; 60 | border-radius: 5px; 61 | background: rgba(255, 255, 255, 0.61); 62 | .code{ 63 | height: 36px; 64 | text-align: right; 65 | img{ 66 | height: 100%; 67 | } 68 | } 69 | } 70 | .login-btn{ 71 | text-align: center; 72 | .el-button--primary{ 73 | background: #51689f; 74 | border-color: #51689f; 75 | color: white; 76 | &:hover,&:focus{ 77 | background: #5b70a2; 78 | border-color: #5b70a2; 79 | } 80 | &:active,&.is-active{ 81 | background: #364772; 82 | border-color: #364772; 83 | } 84 | } 85 | } 86 | .login-btn button{ 87 | width:100%; 88 | height:36px; 89 | } 90 | 91 | .tips{ 92 | color: #51689f; 93 | font-size:12px; 94 | line-height:30px; 95 | } -------------------------------------------------------------------------------- /src/view/Com/Sidebar.vue: -------------------------------------------------------------------------------- 1 | 34 | 43 | -------------------------------------------------------------------------------- /src/view/Pages/Email/Send.vue: -------------------------------------------------------------------------------- 1 | 29 | 69 | 70 | 73 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 汽车保险 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /src/view/Pages/News/Detail.vue: -------------------------------------------------------------------------------- 1 | 26 | 88 | 89 | 92 | -------------------------------------------------------------------------------- /src/data/loan/list.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by lifetea on 2017/3/13. 3 | * email: 494886251@qq.com 4 | * github: https://github.com/lifetea 5 | */ 6 | export default [{ 7 | date: '12345678901234', 8 | name: '是', 9 | province: '娜可露露', 10 | phone: '18857631223', 11 | card: '331081199105084017', 12 | zip: 200333 13 | }, { 14 | date: '2016-05-02', 15 | name: '是', 16 | province: '娜可露露', 17 | phone: '18857631223', 18 | card: '331081199105084017', 19 | zip: 200333 20 | }, { 21 | date: '2016-05-04', 22 | name: '是', 23 | province: '娜可露露', 24 | phone: '18857631223', 25 | card: '331081199105084017', 26 | zip: 200333 27 | }, { 28 | date: '2016-05-01', 29 | name: '是', 30 | province: '娜可露露', 31 | phone: '18857631223', 32 | card: '331081199105084017', 33 | zip: 200333 34 | }, { 35 | date: '2016-05-08', 36 | name: '是', 37 | province: '娜可露露', 38 | phone: '18857631223', 39 | card: '331081199105084017', 40 | zip: 200333 41 | }, { 42 | date: '2016-05-06', 43 | name: '是', 44 | province: '娜可露露', 45 | phone: '18857631223', 46 | card: '331081199105084017', 47 | zip: 200333 48 | }, { 49 | date: '2016-05-08', 50 | name: '是', 51 | province: '娜可露露', 52 | phone: '18857631223', 53 | card: '331081199105084017', 54 | zip: 200333 55 | }, { 56 | date: '2016-05-06', 57 | name: '是', 58 | province: '娜可露露', 59 | phone: '18857631223', 60 | card: '331081199105084017', 61 | zip: 200333 62 | }, 63 | { 64 | date: '2016-05-06', 65 | name: '是', 66 | province: '娜可露露', 67 | phone: '18857631223', 68 | card: '331081199105084017', 69 | zip: 200333 70 | }, 71 | { 72 | date: '2016-05-06', 73 | name: '是', 74 | province: '娜可露露', 75 | phone: '18857631223', 76 | card: '331081199105084017', 77 | zip: 200333 78 | }, 79 | { 80 | date: '2016-05-06', 81 | name: '是', 82 | province: '娜可露露', 83 | phone: '18857631223', 84 | card: '331081199105084017', 85 | zip: 200333 86 | }, 87 | { 88 | date: '2016-05-06', 89 | name: '是', 90 | province: '娜可露露', 91 | phone: '18857631223', 92 | card: '331081199105084017', 93 | zip: 200333 94 | }, 95 | { 96 | date: '2016-05-06', 97 | name: '是', 98 | province: '娜可露露', 99 | phone: '18857631223', 100 | card: '331081199105084017', 101 | zip: 200333 102 | },{ 103 | 104 | date: '2016-05-07', 105 | name: '是', 106 | province: '娜可露露', 107 | phone: '18857631223', 108 | card: '331081199105084017', 109 | zip: 200333 110 | }] -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp') 2 | var gutil = require("gulp-util"); 3 | var path = require('path'); 4 | 5 | // webpack dev server 6 | // var webpackDevServer = require('webpack-dev-server'); 7 | // webpack 8 | var webpack = require('webpack') 9 | // webpack 配置 10 | var webpackConf = require("./webpack.config.js"); 11 | // 修改配置 12 | var devConf = Object.create(webpackConf); 13 | 14 | devConf.devtool = "sourcemap"; 15 | 16 | // 创建一个配置 17 | var devCompiler = webpack(devConf); 18 | 19 | gulp.task("webpack:build-dev", function(callback) { 20 | // 运行webpack 21 | devCompiler.run(function(err, stats) { 22 | if(err) throw new gutil.PluginError("webpack:build-dev", err); 23 | gutil.log("[webpack:build-dev]", stats.toString({ 24 | colors: true 25 | })); 26 | callback(); 27 | }); 28 | }); 29 | 30 | // // 修改配置 31 | // var serverConf = Object.create(webpackConf); 32 | // serverConf.devtool = "eval"; 33 | // 34 | // gulp.task("webpack-dev-server", function(callback) { 35 | // // 启动server 36 | // new webpackDevServer(webpack(serverConf), { 37 | // publicPath: "/" + serverConf.output.publicPath, 38 | // stats: { 39 | // colors: true 40 | // }, 41 | // hot:true, 42 | // }).listen(8080, "localhost", function(err) { 43 | // if(err) throw new gutil.PluginError("webpack-dev-server", err); 44 | // gutil.log("[webpack-dev-server]", "http://localhost:8080/webpack-dev-server/index.html"); 45 | // }); 46 | // }); 47 | 48 | let qiniu = require('gulp-qiniu') 49 | //marked vue-admin as root 50 | gulp.task("qi-niu",function () { 51 | gulp.src('./doc/res/**') 52 | .pipe(qiniu({ 53 | accessKey: "B2OKlkXQB04RFcUNvVBiXZUeWmEOfBOFN26tGC2f", 54 | secretKey: "gbifYUdYUN5aanKHhkcEDrMfrf3GNkKWjxJknjSE", 55 | bucket: "2mmr", 56 | private: false 57 | }, { 58 | dir: 'vue-admin/', 59 | versioning: false, 60 | // versionFile: './cdn.json', 61 | concurrent: 10 62 | })) 63 | }) 64 | 65 | 66 | 67 | //移动文件到src 68 | // move 69 | gulp.task('move-src', function() { 70 | return gulp.src( 71 | [ 72 | './node_modules/element-ui/lib/theme-default/index.css', 73 | './node_modules/element-ui/lib/theme-default/fonts/*', 74 | './node_modules/element-ui/lib/index.js', 75 | './node_modules/vue/dist/*', 76 | './node_modules/iview/dist/**/**/*', 77 | './node_modules/moment/locale//*', 78 | './node_modules/moment/min/*', 79 | './node_modules/font-awesome/css/*', 80 | './node_modules/font-awesome/fonts/*', 81 | './node_modules/accounting/*accounting*.js', 82 | ], { //./node_modules/ivew/* 83 | base: './node_modules' //如果设置为 base: 'js' 将只会复制 js目录下文件, 其他文件会忽略 84 | } 85 | ).pipe(gulp.dest('./src/lib/')); 86 | }); 87 | 88 | -------------------------------------------------------------------------------- /src/view/Pages/User/Pwd.vue: -------------------------------------------------------------------------------- 1 | 24 | 90 | 91 | 94 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | var webpack = require('webpack'); 2 | var ExtractTextPlugin = require("extract-text-webpack-plugin") 3 | var path = require("path") 4 | 5 | module.exports = { 6 | entry: ["babel-polyfill", "./src/js/main.js"], 7 | output: { 8 | path: __dirname + '/dist', 9 | publicPath: 'dist/', 10 | filename: 'build.js' 11 | }, 12 | externals: { 13 | Vue:'Vue', 14 | moment:'moment', 15 | Vuex:'Vuex', 16 | accounting:'accounting', 17 | }, 18 | resolve: { 19 | alias: { 20 | element: path.join(__dirname, '/node_modules/element-ui/lib/theme-default'), 21 | src: path.join(__dirname, '/src'), 22 | } 23 | }, 24 | module: { 25 | loaders: [ 26 | { 27 | test: /\.vue$/, 28 | use: 'vue-loader' 29 | }, 30 | { 31 | test: /\.js$/, 32 | exclude: /(node_modules|bower_components)/, 33 | use: 'babel-loader', 34 | }, 35 | { 36 | test: /\.css$/, 37 | use: ExtractTextPlugin.extract({ 38 | fallback: "style-loader", 39 | use: "style-loader!css-loader?sourceMap" 40 | }) 41 | }, 42 | 43 | // LESS 44 | { 45 | test: /\.less$/, 46 | use: 'style-loader!css-loader!less-loader' 47 | }, 48 | // SASS 49 | { 50 | test: /(\.scss|\.css)$/, 51 | use: ExtractTextPlugin.extract({ 52 | fallback: 'style-loader', 53 | use: ['css', 'sass'] 54 | }) 55 | } 56 | ], 57 | rules:[ 58 | { test: /\.(png|jpg|svg)$/, loader: 'file-loader?name=[name].[hash:6].[ext]' }, 59 | { 60 | test: /\.css$/, 61 | loader: ExtractTextPlugin.extract({ 62 | fallback: "style-loader", 63 | use: "style-loader!css-loader?sourceMap" 64 | }) 65 | }, 66 | { 67 | test: /\.vue$/, 68 | loader: 'vue-loader', 69 | options: { 70 | loaders: { 71 | css: ExtractTextPlugin.extract({ 72 | use: 'css-loader', 73 | fallback: 'vue-style-loader' // <- this is a dep of vue-loader, so no need to explicitly install if using npm3 74 | }), 75 | scss: 'style-loader!css-loader!sass-loader', 76 | 77 | } 78 | } 79 | }, 80 | { 81 | test: /\.js$/, 82 | loader: 'babel-loader', 83 | } 84 | ] 85 | }, 86 | plugins: [ 87 | new webpack.ProvidePlugin({ 88 | Vue: 'Vue', 89 | moment:'moment', 90 | accounting:'accounting' 91 | }), 92 | new ExtractTextPlugin("style.css") 93 | ], 94 | devtool: '#eval-source-map' 95 | } -------------------------------------------------------------------------------- /src/view/Pages/User/Level.vue: -------------------------------------------------------------------------------- 1 | 42 | 98 | 99 | 102 | -------------------------------------------------------------------------------- /records/acccenterpage.vjson: -------------------------------------------------------------------------------- 1 |
2 |
类别
3 |
时间
4 |
项目
5 |
单号
6 |
金额（元）
7 |
状态
8 |
投标类型
9 |
10 |
11 |
投资
12 |
2017/05/18
17:05:00
13 |
WL072017051816
14 |
11008010000002584
15 |
10,000.00
16 |
订单关闭
17 |
18 | 19 | 20 |
21 |
22 |
23 |
线下充值
24 |
2017/05/18
06:00:26
25 |
线下充值
26 |
55008120000001639
27 |
10.00
28 |
支付成功
29 |
30 | 31 |
32 |
33 |
34 |
线下充值
35 |
2017/05/11
06:00:08
36 |
线下充值
37 |
55008120000001373
38 |
4,000.00
39 |
支付成功
40 |
41 | 42 |
43 |
44 |
45 |
线下充值
46 |
2017/05/11
06:00:08
47 |
线下充值
48 |
55008120000001372
49 |
50,000.00
50 |
支付成功
51 |
52 | 53 |
54 |
55 |
56 |
投资
57 |
2017/05/10
11:49:52
58 |
WL022017051003
59 |
13008010000002311
60 |
40,000.00
61 |
支付成功
62 |
63 | 64 | 65 |
66 |
67 | 68 | 69 |

70 | 共25页，到第页 71 | 72 |

73 | 86 | 87 | 99 | -------------------------------------------------------------------------------- /src/view/Pages/News/Add.vue: -------------------------------------------------------------------------------- 1 | 42 | 114 | 115 | 118 | -------------------------------------------------------------------------------- /src/view/Pages/User/Info.vue: -------------------------------------------------------------------------------- 1 | 59 | 120 | 121 | 124 | -------------------------------------------------------------------------------- /src/view/Pages/User/Save.vue: -------------------------------------------------------------------------------- 1 | 59 | 120 | 121 | 124 | -------------------------------------------------------------------------------- /src/view/Pages/Index/Index.vue: -------------------------------------------------------------------------------- 1 | 93 | 122 | 123 | 126 | -------------------------------------------------------------------------------- /src/view/Pages/User/Bank.vue: -------------------------------------------------------------------------------- 1 | 67 | 126 | 127 | 130 | -------------------------------------------------------------------------------- /src/view/Pages/News/Edit.vue: -------------------------------------------------------------------------------- 1 | 42 | 130 | 131 | 134 | -------------------------------------------------------------------------------- /src/data/loan/staff.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by lifetea on 2017/3/15. 3 | * email: 494886251@qq.com 4 | * github: https://github.com/lifetea 5 | */ 6 | 7 | const list = [ 8 | { 9 | label: '总部营业部', 10 | options: [{ 11 | name: '江涛', 12 | no:'9101', 13 | value:'9101', 14 | initial:'JT' 15 | }, { 16 | name: '蒋高登', 17 | value:'9018', 18 | no:'9018', 19 | initial:'JGD' 20 | }] 21 | }, 22 | { 23 | label: '新河营业部', 24 | options: [{ 25 | value: 'Shanghai', 26 | name: '罗新亮', 27 | no:'9032', 28 | initial:'LXL' 29 | }, { 30 | value: 'Beijing', 31 | name: '赵本全', 32 | no:'9057', 33 | initial:'ZBQ' 34 | }] 35 | }, 36 | { 37 | label: '泽国营业部', 38 | options: [ 39 | { 40 | value: 'Chengdu', 41 | name: '梁峰', 42 | no:'9005', 43 | initial:'LF' 44 | }, 45 | { 46 | value: 'Shenzhen', 47 | name: '林敬皓', 48 | no:'9083', 49 | initial:'LJH' 50 | }, 51 | { 52 | value: 'Guangzhou', 53 | name: '叶谨肇', 54 | no:'9145', 55 | initial:'LJZ' 56 | } 57 | ] 58 | }, 59 | { 60 | label: '大溪营业部', 61 | options: [ 62 | { 63 | value: 'Chengdu', 64 | name: '毛仙华', 65 | no:'9081', 66 | initial:'MXH' 67 | }, { 68 | value: 'Shenzhen', 69 | name: '陈宣邑', 70 | no:'9067', 71 | initial:'CYY' 72 | }, { 73 | value: 'Guangzhou', 74 | name: '谢晨晨', 75 | no:'9079', 76 | initial:'XCC' 77 | }, { 78 | value: 'Dalian', 79 | name: '郑佳妮', 80 | no:'9093', 81 | initial:'ZJN' 82 | }, 83 | { 84 | value: 'Dalian', 85 | name: '孔笑笑', 86 | no:'9138', 87 | initial:'KXX' 88 | }, 89 | { 90 | value: 'Dalian', 91 | name: '王石', 92 | no:'9159', 93 | initial:'WS' 94 | } 95 | ] 96 | } 97 | ]; 98 | 99 | let queryByName = '罗' 100 | 101 | var findByName = function (val,query) { 102 | let array = Array.from(val) 103 | let newArray = [] 104 | array.forEach(item =>{ 105 | var t = item.options.filter(op=>{ 106 | // console.log('op:'+op.name) 107 | return op.name.indexOf(query)>-1 108 | }) 109 | if(t.length>0) 110 | newArray.push({ 111 | label:item.label, 112 | options:t 113 | }) 114 | }); 115 | return newArray 116 | } 117 | 118 | // 根据名字查询测试 119 | // 120 | // 121 | // let resByName = findByName(list,queryByName) 122 | // 123 | // console.log('filter by name:',resByName) 124 | // 125 | // console.log(list) 126 | 127 | let queryByNo = '90' 128 | 129 | var findByNo = function (val,query) { 130 | let array = Array.from(val) 131 | let newArray = [] 132 | array.forEach(item =>{ 133 | var t = item.options.filter(op=>{ 134 | // console.log('op:'+op.name) 135 | return op.no.indexOf(query)>-1 136 | }) 137 | if(t.length>0) 138 | newArray.push({ 139 | label:item.label, 140 | options:t 141 | }) 142 | }); 143 | return newArray 144 | } 145 | 146 | 147 | let resByNo = findByNo(list,queryByNo) 148 | 149 | console.log('filter by no:',resByNo) 150 | 151 | // console.log(list) 152 | 153 | 154 | let queryByInitial = 'W' 155 | 156 | var findByInitial = function (val,query) { 157 | let array = Array.from(val) 158 | let newArray = [] 159 | array.forEach(item =>{ 160 | var t = item.options.filter(op=>{ 161 | // console.log('op:'+op.name) 162 | return op.initial.indexOf(query)>-1 163 | }) 164 | if(t.length>0) 165 | newArray.push({ 166 | label:item.label, 167 | options:t 168 | }) 169 | }); 170 | return newArray 171 | } 172 | 173 | 174 | let resByInitial = findByInitial(list,queryByInitial) 175 | 176 | console.log('filter by initial:',resByInitial) 177 | 178 | // console.log('---') 179 | 180 | 181 | export default { 182 | 'list':list, 183 | 'findByName':findByName, 184 | 'findByNo':findByNo, 185 | 'findByInitial':findByInitial 186 | } -------------------------------------------------------------------------------- /src/js/filter.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by lifetea on 2017/4/17. 3 | * email: 494886251@qq.com 4 | * github: https://github.com/lifetea 5 | */ 6 | Vue.filter('dateFormat', function (value) { 7 | let res = value ? moment(value).format("YYYY-MM-DD") : '无'; 8 | return res 9 | }) 10 | 11 | Vue.filter('dateTimeFormat', function (value) { 12 | let res = value ? moment(value).format("YYYY-MM-DD hh:mm:ss") : '无'; 13 | return res 14 | }) 15 | 16 | 17 | // 会员等级 0-普通会员 1-初级服务中心 2-高级服务中心 18 | 19 | Vue.filter('levelFormat', function (value) { 20 | let res = '普通会员' 21 | if(value == 1) 22 | res = '初级会员' 23 | if(value == 2) 24 | res = '高级会员' 25 | return res 26 | }) 27 | 28 | 29 | Vue.filter('moneyFormat', function (value) { 30 | return accounting.format(value,2,',') 31 | }) 32 | 33 | 34 | Vue.filter('countFormat', function (value) { 35 | let res = value? value : 0 36 | return res 37 | }) 38 | 39 | 40 | Vue.filter('nameFormat', function (value) { 41 | let res = value? value : '未知' 42 | return res 43 | }) 44 | 45 | Vue.filter('mgrNameFormat', function (value) { 46 | let res = value? value : '暂无' 47 | return res 48 | }) 49 | 50 | //新闻类型转换 51 | 52 | Vue.filter('newsTypeFormat', function (value) { 53 | let res = '' 54 | if(value == 0) 55 | res = '未读' 56 | if(value == 1) 57 | res = '公告' 58 | if(value == 2) 59 | res = '活动' 60 | return res 61 | }) 62 | 63 | 64 | // 状态 0：已处理、1：已失败、2：处理中 65 | 66 | 67 | Vue.filter('emailStatusFormat', function (value) { 68 | let res = '' 69 | if(value == 0) 70 | res = '未读' 71 | if(value == 1) 72 | res = '已读' 73 | return res 74 | }) 75 | 76 | 77 | // 投资状态 2：成功 3: 失败 78 | // THE_DAY_BEARING("1", "初始"), 79 | // /** 成功 */ 80 | // MORROW_BEARING("2", "成功"), 81 | // /** 撤销*/ 82 | // SATISFY_BEARING("3", "撤销"), 83 | // /** 失败 */ 84 | // ESTABLISH_BEARING("4", "失败") 85 | 86 | Vue.filter('investStatus', function (value) { 87 | let res = '' 88 | if(value == 1) 89 | res = '初始' 90 | if(value == 2) 91 | res = '成功' 92 | if(value == 3) 93 | res = '撤销' 94 | if(value == 4) 95 | res = '失败' 96 | return res 97 | }) 98 | 99 | 100 | // 状态 0-未还款 1-已还款 2-部分还款 3-逾期 4-逾期还款 5-违约处理 6-已兑付 101 | 102 | 103 | Vue.filter('incomePlanStatus', function (value) { 104 | let res = '未知' 105 | if(value == 0) 106 | res = '未还款' 107 | if(value == 1) 108 | res = '已还款' 109 | if(value == 2) 110 | res = '部分还款' 111 | if(value == 3) 112 | res = '逾期' 113 | if(value == 4) 114 | res = '逾期还款' 115 | if(value == 5) 116 | res = '违约处理' 117 | if(value == 6) 118 | res = '已兑付' 119 | return res 120 | }) 121 | 122 | 123 | // 状态 0-未还款 1-已还款 2-部分还款 3-逾期 4-逾期还款 5-违约处理 6-已兑付 124 | 125 | 126 | Vue.filter('repaymentType', function (value) { 127 | let res = '未知' 128 | if(value == 0) 129 | res = '未还款' 130 | if(value == 1) 131 | res = '已还款' 132 | if(value == 2) 133 | res = '部分还款' 134 | if(value == 3) 135 | res = '逾期' 136 | if(value == 4) 137 | res = '逾期还款' 138 | if(value == 5) 139 | res = '违约处理' 140 | if(value == 6) 141 | res = '已兑付' 142 | return res 143 | }) 144 | 145 | // 146 | // NOT_RELEASED("0", "未发布"), 147 | // BIDDING("1", "投标中"), 148 | // INTEREST_IN("2", "计息中"), 149 | // TO_BE_RETURNED("3", "待返还"), 150 | // HAS_RETURNED("4", "已返还"), 151 | // HAS_ENDED("5", "已结束"), 152 | // ALREADY_REVOKED("6", "已撤销") 153 | 154 | Vue.filter('lifeCycle', function (value) { 155 | let res = '未知' 156 | if(value == 0) 157 | res = '未发布' 158 | if(value == 1) 159 | res = '投标中' 160 | if(value == 2) 161 | res = '计息中' 162 | if(value == 3) 163 | res = '待返还' 164 | if(value == 4) 165 | res = '已返还' 166 | if(value == 5) 167 | res = '已结束' 168 | if(value == 6) 169 | res = '已撤销' 170 | return res 171 | }) 172 | 173 | 174 | 175 | // 状态 0-未还款 1-已还款 2-部分还款 3-逾期未还款 4-逾期已还款 5-违约 6-已兑付 176 | Vue.filter('outcomePlanStatus', function (value) { 177 | let res = '未知' 178 | if(value == 0) 179 | res = '未还款' 180 | if(value == 1) 181 | res = '已还款' 182 | if(value == 2) 183 | res = '部分还款' 184 | if(value == 3) 185 | res = '逾期未还' 186 | if(value == 4) 187 | res = '逾期已还' 188 | if(value == 5) 189 | res = '违约处理' 190 | if(value == 6) 191 | res = '已兑付' 192 | return res 193 | }) 194 | 195 | 196 | // 生效状态 0：正常 1：失效 197 | 198 | Vue.filter('creditStatus', function (value) { 199 | let res = '' 200 | if(value == 0) 201 | res = '正常' 202 | if(value == 1) 203 | res = '失效' 204 | return res 205 | }) 206 | 207 | 208 | //1 利随本清 2 按月结息 209 | 210 | Vue.filter('repayType', function (value) { 211 | let res = '未知' 212 | if(value == 1) 213 | res = '利随本清' 214 | if(value == 2) 215 | res = '按月结息' 216 | if(value == 3) 217 | res = '按季付息' 218 | return res 219 | }) 220 | -------------------------------------------------------------------------------- /src/view/Pages/News/List.vue: -------------------------------------------------------------------------------- 1 | 50 | 162 | 163 | 166 | -------------------------------------------------------------------------------- /src/view/Pages/News/Manage.vue: -------------------------------------------------------------------------------- 1 | 50 | 162 | 163 | 166 | -------------------------------------------------------------------------------- /src/view/Pages/Email/OutBox.vue: -------------------------------------------------------------------------------- 1 | 76 | 170 | 171 | 174 | -------------------------------------------------------------------------------- /src/view/Pages/Email/InBox.vue: -------------------------------------------------------------------------------- 1 | 76 | 189 | 190 | 193 | -------------------------------------------------------------------------------- /src/view/Com/Layout.vue: -------------------------------------------------------------------------------- 1 | 86 | 89 | 151 | -------------------------------------------------------------------------------- /src/view/Pages/Stat/Operate.vue: -------------------------------------------------------------------------------- 1 | 65 | 66 | 216 | -------------------------------------------------------------------------------- /src/view/Com/Login.vue: -------------------------------------------------------------------------------- 1 | 42 | 43 | 138 | 139 | 142 | 143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | 160 | 161 | 162 | 163 | 164 | 165 | 166 | 167 | 168 | 169 | 170 | 171 | 172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | 181 | 182 | 183 | 184 | 185 | 186 | 187 | 188 | 189 | 190 | 191 | 192 | 193 | 194 | 195 | 196 | 197 | 198 | 199 | 200 | 201 | 202 | 203 | 204 | -------------------------------------------------------------------------------- /src/js/router.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by lifetea on 2016/10/8. 3 | */ 4 | 5 | let Vue = require('Vue') 6 | 7 | import VueRouter from 'vue-router' 8 | 9 | import auth from './auth' 10 | 11 | //挂载vue-router 12 | Vue.use(VueRouter); 13 | 14 | //布局 15 | import Layout from '../view/Com/Layout.vue' 16 | //lazy load 17 | const lazyLoading = (name, index = false) => () => System.import(`../view/${name}${index ? '/index' : ''}.vue`) 18 | 19 | //要求登录 20 | function requireAuth (to, from, next) { 21 | if (!auth.loggedIn()) { 22 | next({ 23 | path: '/login', 24 | query: { redirect: to.fullPath } 25 | }) 26 | } else { 27 | next() 28 | } 29 | } 30 | 31 | 32 | export let list = [ 33 | { 34 | icon:"ios-navigate", 35 | index:"1", 36 | name:'首页', 37 | path:'index', 38 | component: lazyLoading('Pages/Index/Index'), 39 | }, 40 | { 41 | icon:"person", 42 | name:"个人管理", 43 | index:'2', 44 | children:[ 45 | { 46 | name:"个人资料", 47 | index:'2-1', 48 | path:'user-info', 49 | component: lazyLoading('Pages/User/Info'), 50 | }, 51 | { 52 | name:"银行资料", 53 | index:'2-2', 54 | path:'user-bank', 55 | component: lazyLoading('Pages/User/Bank'), 56 | }, 57 | { 58 | name:"个人升级", 59 | index:'2-3', 60 | path:'user-level', 61 | component: lazyLoading('Pages/User/Level'), 62 | }, 63 | ] 64 | }, 65 | { 66 | icon:"social-yen", 67 | name:"财务管理", 68 | index:'3', 69 | children:[ 70 | { 71 | name:"奖金明细", 72 | index:'3-1', 73 | path:'user-info', 74 | component: lazyLoading('Pages/User/Info'), 75 | }, 76 | { 77 | name:"奖金提现", 78 | index:'3-2', 79 | path:'user-bank', 80 | component: lazyLoading('Pages/User/Bank'), 81 | }, 82 | { 83 | name:"积分充值", 84 | index:'3-3', 85 | path:'user-level', 86 | component: lazyLoading('Pages/User/Level'), 87 | }, 88 | { 89 | name:"积分转账", 90 | index:'3-4', 91 | path:'user-level', 92 | component: lazyLoading('Pages/User/Level'), 93 | }, 94 | { 95 | name:"积分转换", 96 | index:'3-5', 97 | path:'user-level', 98 | component: lazyLoading('Pages/User/Level'), 99 | }, 100 | ] 101 | }, 102 | { 103 | icon:"ios-cart", 104 | name:"购物中心", 105 | index:'4', 106 | children:[ 107 | { 108 | name:"选购商品", 109 | index:'4-1', 110 | path:'user-info', 111 | component: lazyLoading('Pages/User/Info'), 112 | }, 113 | { 114 | name:"已购列表", 115 | index:'4-2', 116 | path:'user-bank', 117 | component: lazyLoading('Pages/User/Bank'), 118 | }, 119 | ] 120 | }, 121 | { 122 | icon:"android-contacts", 123 | name:"联系我们", 124 | index:'6', 125 | children:[ 126 | { 127 | name:"留言反馈", 128 | index:'6-1', 129 | path:'email-send', 130 | component: lazyLoading('Pages/Email/Send'), 131 | }, 132 | { 133 | name:"发件箱", 134 | index:'6-2', 135 | path:'email-out-box', 136 | component: lazyLoading('Pages/Email/OutBox'), 137 | }, 138 | { 139 | name:"收件箱", 140 | index:'6-3', 141 | path:'email-in-box', 142 | component: lazyLoading('Pages/Email/InBox'), 143 | } 144 | ] 145 | }, 146 | { 147 | icon:"ios-paper", 148 | name:"新闻中心", 149 | index:'7', 150 | children:[ 151 | { 152 | name:"新闻公告", 153 | index:'7-1', 154 | path:'news-list', 155 | component: lazyLoading('Pages/News/List'), 156 | }, 157 | { 158 | name:"新闻添加", 159 | index:'7-2', 160 | path:'news-add', 161 | component: lazyLoading('Pages/News/Add'), 162 | }, 163 | { 164 | name:"新闻编辑", 165 | index:'7-3', 166 | path:'news-edit', 167 | component: lazyLoading('Pages/News/Edit'), 168 | hidden:true 169 | }, 170 | { 171 | name:"新闻详情", 172 | index:'7-4', 173 | path:'news-detail', 174 | component: lazyLoading('Pages/News/Detail'), 175 | hidden:true 176 | }, 177 | { 178 | name:"新闻管理", 179 | index:'7-5', 180 | path:'news-list', 181 | component: lazyLoading('Pages/News/List'), 182 | }, 183 | ] 184 | }, 185 | { 186 | icon:"locked", 187 | name:"安全中心", 188 | index:'8', 189 | children:[ 190 | { 191 | name:"密码修改", 192 | index:'8-1', 193 | path:'user-pwd', 194 | component: lazyLoading('Pages/User/Pwd'), 195 | }, 196 | { 197 | name:"密保修改", 198 | index:'8-2', 199 | path:'user-safe', 200 | component: lazyLoading('Pages/User/Save'), 201 | } 202 | ] 203 | } 204 | ] 205 | 206 | let arr = [ 207 | { 208 | path: '', 209 | component: lazyLoading('Pages/Index/Index'), 210 | name:"index", 211 | } 212 | ] 213 | 214 | list.forEach((ele,index)=>{ 215 | if(!!ele.children){ 216 | Array.prototype.push.apply(arr,ele.children); 217 | }else { 218 | arr.push(ele) 219 | } 220 | 221 | }) 222 | 223 | const routes = [ 224 | { 225 | path: '', 226 | component: Layout, 227 | beforeEnter:requireAuth, 228 | children: arr 229 | // [ 230 | // { 231 | // path: '', 232 | // component: lazyLoading('Pages/Index/Index'), 233 | // name:"index", 234 | // }, 235 | // { 236 | // path: 'index', 237 | // component: lazyLoading('Pages/Index/Index'), 238 | // name:'主页', 239 | // }, 240 | // // User 用户 241 | // { 242 | // path: 'user-info', 243 | // component: lazyLoading('Pages/User/Info'), 244 | // name:'user-info' 245 | // }, 246 | // { 247 | // path: 'stat-repayment', 248 | // component: lazyLoading('Pages/Stat/Outcome'), 249 | // name:'stat-outcome-plan', 250 | // meta:{ 251 | // alias :'统计', 252 | // } 253 | // }, 254 | // { 255 | // path: 'stat-credit', 256 | // component: lazyLoading('Pages/Stat/Credit'), 257 | // name:'stat-credit', 258 | // meta:{ 259 | // alias :'统计', 260 | // } 261 | // }, 262 | // { 263 | // path: 'stat-info', 264 | // component: lazyLoading('Pages/Stat/Info'), 265 | // name:'stat-info', 266 | // meta:{ 267 | // alias :'统计', 268 | // } 269 | // }, 270 | // { 271 | // path: 'stat-invest', 272 | // component: lazyLoading('Pages/Stat/Invest'), 273 | // name:'stat-invest', 274 | // meta:{ 275 | // alias :'统计', 276 | // } 277 | // }, 278 | // { 279 | // path: 'stat-returned', 280 | // component: lazyLoading('Pages/Stat/Returned'), 281 | // name:'stat-invest', 282 | // meta:{ 283 | // alias :'统计', 284 | // } 285 | // }, 286 | // { 287 | // path: 'stat-operate', 288 | // component: lazyLoading('Pages/Stat/Operate'), 289 | // name:'stat-invest', 290 | // meta:{ 291 | // alias :'统计', 292 | // } 293 | // }, 294 | // { 295 | // path: 'doctor-list', 296 | // component: lazyLoading('Doctor/Doctor'), 297 | // name:'doctor-list', 298 | // auth: 'user' 299 | // }, 300 | // { 301 | // path: 'doctor-top', 302 | // component: lazyLoading('Doctor/Top'), 303 | // name:'doctor-top', 304 | // auth: 'user' 305 | // }, 306 | // { 307 | // path: 'doctor-edit', 308 | // component: lazyLoading('Doctor/Edit'), 309 | // name:'doctor-edit', 310 | // auth: 'user' 311 | // }, 312 | // { 313 | // path: 'doctor-set', 314 | // component: lazyLoading('Doctor/Set'), 315 | // name:'doctor-set', 316 | // auth: 'user' 317 | // }, 318 | // { 319 | // path: 'doctor-add', 320 | // component: lazyLoading('Doctor/Add'), 321 | // name:'add', 322 | // auth: 'user' 323 | // }, 324 | // { 325 | // path: 'sick', 326 | // component: lazyLoading('Sick/Sick'), 327 | // name:'sick', 328 | // auth: 'user' 329 | // }, 330 | // { 331 | // path: 'order', 332 | // component: lazyLoading('Order/Order'), 333 | // name:'order', 334 | // auth: 'user' 335 | // }, 336 | // { 337 | // path: 'balance', 338 | // component: lazyLoading('Balance/Balance'), 339 | // name:'balance', 340 | // auth: 'user' 341 | // }, 342 | // { 343 | // path: 'jiesuan', 344 | // component: lazyLoading('Balance/jiesuan'), 345 | // name:'jiesuan', 346 | // auth: 'user' 347 | // }, 348 | // { 349 | // path: 'set', 350 | // component: lazyLoading('Set/Set'), 351 | // name:'set', 352 | // auth: 'user' 353 | // }, 354 | // { 355 | // path: 'set-refund', 356 | // component: lazyLoading('Set/Refund'), 357 | // name:'set-refund', 358 | // auth: 'user' 359 | // }, 360 | // { 361 | // path: 'set-balance', 362 | // component: lazyLoading('Set/Balance'), 363 | // name:'set-balance', 364 | // auth: 'user' 365 | // }, 366 | // { 367 | // path: 'set-spread', 368 | // component: lazyLoading('Set/Spread'), 369 | // name:'set-spread', 370 | // auth: 'user' 371 | // }, 372 | // { 373 | // path: 'set-royalty', 374 | // component: lazyLoading('Set/Royalty'), 375 | // name:'set-royalty', 376 | // auth: 'user' 377 | // }, 378 | // { 379 | // path: 'depart', 380 | // component: lazyLoading('Set/Depart'), 381 | // name:'depart', 382 | // auth: 'user' 383 | // }, 384 | // { 385 | // path: 'set-hospital', 386 | // component: lazyLoading('Set/Hospital'), 387 | // name:'set-hospital', 388 | // auth: 'user' 389 | // }, 390 | // ] 391 | }, 392 | { 393 | path: '/login', 394 | name:'login', 395 | component: lazyLoading('Com/Login') 396 | }, 397 | { 398 | path: '/print', 399 | name:'print', 400 | component: lazyLoading('Pages/Print/Index') 401 | }, 402 | // { 403 | // path: '/logout', 404 | // name:'logout', 405 | // beforeEnter (to, from, next) { 406 | // auth.logout() 407 | // next('/login') 408 | // } 409 | // }, 410 | { path: '*', component: lazyLoading('Com/Login') } 411 | ]; 412 | 413 | 414 | 415 | 416 | // //定义路由 417 | // var router = new VueRouter({ 418 | // mode: 'hash', 419 | // routes // （缩写）相当于 routes: routes 420 | // }) 421 | 422 | 423 | export var router = new VueRouter({ 424 | mode: 'hash', 425 | routes // （缩写）相当于 routes: routes 426 | }) -------------------------------------------------------------------------------- /src/view/Pages/Print/Index.vue: -------------------------------------------------------------------------------- 1 | 135 | 171 | 307 | -------------------------------------------------------------------------------- /src/view/Pages/Stat/Outcome.vue: -------------------------------------------------------------------------------- 1 | 239 | 240 | 393 | -------------------------------------------------------------------------------- /src/view/Pages/Stat/Returned.vue: -------------------------------------------------------------------------------- 1 | 229 | 230 | 406 | --------------------------------------------------------------------------------