Adam / gulu-admin

Download as
Browse Code »

Commit 60fa0be9dbb3b7d8813926c450c01d7e45dfa049

Authored by Adam
1 parent 1172ebb791
Exists in master

auto commit the code by alias command

Showing 7 changed files with 155 additions and 100 deletions   Show diff stats
mock/mock-server.js
Diff comments   View file @60fa0be
... ... @@ -61,7 +61,7 @@ module.exports = app => {
61 61  
62 62 console.log(chalk.magentaBright(`\n > Mock Server hot reload success! changed ${path}`))
63 63 } catch (error) {
64   - console.log(chalk.redBright(error))
  64 + console.error(chalk.redBright(error))
65 65 }
66 66 }
67 67 })
... ...
1   -
2 1 const tokens = {
3 2 admin: {
4 3 token: 'admin-token'
... ... @@ -6,8 +5,8 @@ const tokens = {
6 5 assistant: {
7 6 token: 'assistant-token'
8 7 },
9   - editor: {
10   - token: 'editor-token'
  8 + runner: {
  9 + token: 'runner-token'
11 10 },
12 11 shoper: {
13 12 token: 'shoper-token'
... ... @@ -15,52 +14,60 @@ const tokens = {
15 14 }
16 15  
17 16 const users = {
18   - 'admin-token': {//管理员
  17 + 'admin-token': { //管理员
19 18 roles: ['admin'],
20 19 introduction: 'I am a super administrator',
21 20 avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif',
22 21 name: 'Super Admin'
23 22 },
24   - 'assistant-token': {//管理员助理
  23 + 'assistant-token': { //管理员助理
25 24 roles: ['assistant'],
26 25 introduction: 'I am a assistant of administrator',
27 26 avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif',
28   - name: 'Super Admin'
  27 + name: 'assistant Admin'
29 28 },
30   - 'editor-token': {//运营人员
31   - roles: ['editor'],
32   - introduction: 'I am an editor',
  29 + 'runner-token': { //运营人员
  30 + roles: ['runner'],
  31 + introduction: 'I am an runner',
33 32 avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif',
34   - name: 'Normal Editor'
  33 + name: 'Normal runner'
35 34 },
36   - 'shoper-token': {//供应商
  35 + 'shoper-token': { //供应商
37 36 roles: ['shoper'],
38 37 introduction: 'I am an shoper',
39 38 avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif',
40   - name: 'Normal Editor'
  39 + name: 'Normal shoper'
41 40 }
42 41 }
43 42  
44   -export default [
45   - // user login
46   - {
  43 +export default [{ // user login
47 44 url: '/yp/user/login',
48 45 type: 'post',
49 46 response: config => {
50   - const { username } = config.body
51   - const token = tokens[username]
52   - // mock error
53   - if (!token) {
  47 + console.log('config-------->', config.body);
  48 + const {
  49 + username,
  50 + password
  51 + } = config.body;
  52 + if (username == 'admin' && password == '111111') {
  53 + const token = tokens[username];
  54 + if (!token) {
  55 + return {
  56 + code: 60204,
  57 + message: 'Account and password are incorrect.'
  58 + }
  59 + } else {
  60 + return {
  61 + code: 20000,
  62 + data: token
  63 + }
  64 + }
  65 + } else {
54 66 return {
55 67 code: 60204,
56 68 message: 'Account and password are incorrect.'
57 69 }
58 70 }
59   -
60   - return {
61   - code: 20000,
62   - data: token
63   - }
64 71 }
65 72 },
66 73  
... ... @@ -69,7 +76,9 @@ export default [
69 76 url: '/yp/user/info\.*',
70 77 type: 'get',
71 78 response: config => {
72   - const { token } = config.query
  79 + const {
  80 + token
  81 + } = config.query
73 82 const info = users[token]
74 83  
75 84 // mock error
... ...
1 1 import request from '@/utils/request'
  2 +// var qs = require('Qs');
2 3  
3 4 export function login(data) {
4   - console.log('login....', data)
  5 + console.log('login.1111...', data)
5 6 return request({
6   - url: '/yp/user/login',
  7 + // url: '/yp/user/login',
  8 + url: '/yp.user.login.php',
7 9 method: 'post',
8   - data
9   - })
  10 + headers: {
  11 + 'Content-type': 'application/x-www-form-urlencoded'
  12 + },
  13 + data,
  14 + // responseType: 'text/plain',
  15 + // onDownloadProgress: false,
  16 + // onUploadProgress: true,
  17 + // proxy: {}
  18 + });
10 19 }
11 20  
12 21 export function getInfo(token) {
... ... @@ -14,7 +23,9 @@ export function getInfo(token) {
14 23 return request({
15 24 url: '/yp/user/info',
16 25 method: 'get',
17   - params: { token }
  26 + params: {
  27 + token
  28 + }
18 29 })
19 30 }
20 31  
... ... @@ -23,7 +34,9 @@ export function list(token) {
23 34 return request({
24 35 url: '/yp/user/list',
25 36 method: 'get',
26   - params: { token }
  37 + params: {
  38 + token
  39 + }
27 40 })
28 41 }
29 42  
... ... @@ -32,7 +45,9 @@ export function add(token) {
32 45 return request({
33 46 url: '/yp/user/add',
34 47 method: 'get',
35   - params: { token }
  48 + params: {
  49 + token
  50 + }
36 51 })
37 52 }
38 53  
... ... @@ -41,7 +56,9 @@ export function modi(token) {
41 56 return request({
42 57 url: '/yp/user/modi',
43 58 method: 'get',
44   - params: { token }
  59 + params: {
  60 + token
  61 + }
45 62 })
46 63 }
47 64  
... ...
src/store/modules/user.js
Diff comments   View file @60fa0be
... ... @@ -38,6 +38,7 @@ const actions = {
38 38 return new Promise((resolve, reject) => {
39 39 login({ username: username.trim(), password: password }).then(response => {
40 40 const { data } = response
  41 + console.log('action------->login------->处理', data);
41 42 commit('SET_TOKEN', data.token)
42 43 setToken(data.token)
43 44 resolve()
... ... @@ -52,18 +53,14 @@ const actions = {
52 53 return new Promise((resolve, reject) => {
53 54 getInfo(state.token).then(response => {
54 55 const { data } = response
55   -
56 56 if (!data) {
57 57 reject('Verification failed, please Login again.')
58 58 }
59   -
60 59 const { roles, name, avatar } = data
61   -
62 60 // roles must be a non-empty array
63 61 if (!roles || roles.length <= 0) {
64 62 reject('getInfo: roles must be a non-null array!')
65 63 }
66   -
67 64 commit('SET_ROLES', roles)
68 65 commit('SET_NAME', name)
69 66 commit('SET_AVATAR', avatar)
... ...
src/utils/request.js
Diff comments   View file @60fa0be
1 1 import axios from 'axios'
2   -import { MessageBox, Message } from 'element-ui'
  2 +import {
  3 + MessageBox,
  4 + Message
  5 +} from 'element-ui'
3 6 import store from '@/store'
4   -import { getToken } from '@/utils/auth'
  7 +import {
  8 + getToken
  9 +} from '@/utils/auth'
5 10  
6 11 // create an axios instance
7 12 // 创建axios实例
8 13 const service = axios.create({
  14 + // baseURL: '', // url = base url + request url
9 15 baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
10 16 // withCredentials: true, // send cookies when cross-domain requests
11   - timeout: 5000 // request timeout
  17 + timeout: 5000, // request timeout
  18 + headers: {
  19 + 'Content-Type': 'application/x-www-form-urlencoded'
  20 + }
12 21 })
13 22  
14 23 // request interceptor
... ... @@ -16,20 +25,23 @@ const service = axios.create({
16 25 service.interceptors.request.use(
17 26 config => {
18 27 // do something before request is sent
19   - console.log('do something before request is sent')
  28 + // console.log('do something before request is sent')
20 29 if (store.getters.token) {
21   - console.log('[X-Token] is a custom headers key')
  30 + // console.log('[X-Token] is a custom headers key')
22 31 // let each request carry token
23 32 // ['X-Token'] is a custom headers key
24 33 // please modify it according to the actual situation
25   - config.headers['X-Token'] = getToken()
  34 + config.headers['X-Token'] = getToken();
  35 + config.headers['Content-Type'] = 'application/x-www-form-urlencoded';
  36 + // var token = getToken()
  37 + // Object.assign(config.headers, { 'token': token })
26 38 }
27 39 return config
28 40 },
29 41 error => {
30   - console.log('do something with request error')
  42 + // console.log('do something with request error')
31 43 // do something with request error
32   - console.log(error) // for debug
  44 + console.error(error) // for debug
33 45 return Promise.reject(error)
34 46 }
35 47 )
... ... @@ -40,7 +52,7 @@ service.interceptors.response.use(
40 52 /**
41 53 * If you want to get http information such as headers or status
42 54 * Please return response => response
43   - */
  55 + */
44 56  
45 57 /**
46 58 * Determine the request status by custom code
... ... @@ -49,12 +61,12 @@ service.interceptors.response.use(
49 61 */
50 62 response => {
51 63 const res = response.data
  64 + console.log('返回的数据-------->', res);
52 65 /**
53   - * 下面的注释为通过response自定义code来标示请求状态，当code返回如下情况为权限有问题，登出并返回到登录页
54   - * 如通过xmlhttprequest 状态码标识 逻辑可写在下面error中
55   - */
56   - console.log('if the custom code is not 20000, it is judged as an error.')
57   - // if the custom code is not 20000, it is judged as an error.
  66 + * 下面的注释为通过response自定义code来标示请求状态，当code返回如下情况为权限有问题，登出并返回到登录页
  67 + * 如通过xmlhttprequest 状态码标识 逻辑可写在下面error中
  68 + */
  69 + // console.log('if the custom code is not 20000, it is judged as an error.')
58 70 if (res.code !== 20000) {
59 71 Message({
60 72 message: res.message || 'Error',
... ... @@ -62,7 +74,6 @@ service.interceptors.response.use(
62 74 duration: 5 * 1000
63 75 })
64 76  
65   - // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
66 77 // 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
67 78 if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
68 79 // to re-login
... ... @@ -75,17 +86,19 @@ service.interceptors.response.use(
75 86 type: 'warning'
76 87 }).then(() => {
77 88 store.dispatch('user/resetToken').then(() => {
78   - location.reload()// 为了重新实例化vue-router对象 避免bug
  89 + location.reload() // 为了重新实例化vue-router对象 避免bug
79 90 })
80 91 })
81 92 }
82 93 return Promise.reject(new Error(res.message || 'Error'))
83 94 } else {
84   - return res
  95 + // const token = res.data.token;
  96 + console.log('进入20000号判断-------->', res);
  97 + return res;
85 98 }
86 99 },
87 100 error => {
88   - console.log('err' + error) // for debug
  101 + console.error('===============发生错误！！！！！===============' + error) // for debug
89 102 Message({
90 103 message: error.message,
91 104 type: 'error',
... ...
src/views/login/index.vue
Diff comments   View file @60fa0be
1 1 <template>
2 2 <div class="login-container">
3   - <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
4   -
  3 + <el-form
  4 + ref="loginForm"
  5 + :model="loginForm"
  6 + :rules="loginRules"
  7 + class="login-form"
  8 + auto-complete="on"
  9 + label-position="left"
  10 + >
5 11 <div class="title-container">
6   - <h3 class="title">Login Form</h3>
  12 + <h3 class="title">鱼皮系统</h3>
7 13 </div>
8 14  
9 15 <el-form-item prop="username">
... ... @@ -41,96 +47,109 @@
41 47 </span>
42 48 </el-form-item>
43 49 <!-- <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">reg</el-button> -->
44   - <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">Login</el-button>
  50 + <el-button
  51 + :loading="loading"
  52 + type="primary"
  53 + style="width:100%;margin-bottom:30px;"
  54 + @click.native.prevent="handleLogin"
  55 + >Login</el-button>
45 56  
46 57 <div class="tips">
47 58 <span style="margin-right:20px;">username: admin</span>
48   - <span> password: any</span>
  59 + <span>password: any</span>
49 60 </div>
50   -
51 61 </el-form>
52 62 </div>
53 63 </template>
54 64  
55 65 <script>
56   -import { validUsername } from '@/utils/validate'
  66 +import { validUsername } from "@/utils/validate";
57 67  
58 68 export default {
59   - name: 'Login',
  69 + name: "Login",
60 70 data() {
61 71 const validateUsername = (rule, value, callback) => {
62 72 if (!validUsername(value)) {
63   - callback(new Error('Please enter the correct user name'))
  73 + callback(new Error("Please enter the correct user name"));
64 74 } else {
65   - callback()
  75 + callback();
66 76 }
67   - }
  77 + };
68 78 const validatePassword = (rule, value, callback) => {
69 79 if (value.length < 6) {
70   - callback(new Error('The password can not be less than 6 digits'))
  80 + callback(new Error("The password can not be less than 6 digits"));
71 81 } else {
72   - callback()
  82 + callback();
73 83 }
74   - }
  84 + };
75 85 return {
76 86 loginForm: {
77   - username: 'admin',
78   - password: '111111'
  87 + username: "admin",
  88 + password: "111111"
79 89 },
80 90 loginRules: {
81   - username: [{ required: true, trigger: 'blur', validator: validateUsername }],
82   - password: [{ required: true, trigger: 'blur', validator: validatePassword }]
  91 + username: [
  92 + { required: true, trigger: "blur", validator: validateUsername }
  93 + ],
  94 + password: [
  95 + { required: true, trigger: "blur", validator: validatePassword }
  96 + ]
83 97 },
84 98 loading: false,
85   - passwordType: 'password',
  99 + passwordType: "password",
86 100 redirect: undefined
87   - }
  101 + };
88 102 },
89 103 watch: {
90 104 $route: {
91 105 handler: function(route) {
92   - this.redirect = route.query && route.query.redirect
  106 + this.redirect = route.query && route.query.redirect;
93 107 },
94 108 immediate: true
95 109 }
96 110 },
97 111 methods: {
98 112 showPwd() {
99   - if (this.passwordType === 'password') {
100   - this.passwordType = ''
  113 + if (this.passwordType === "password") {
  114 + this.passwordType = "";
101 115 } else {
102   - this.passwordType = 'password'
  116 + this.passwordType = "password";
103 117 }
104 118 this.$nextTick(() => {
105   - this.$refs.password.focus()
106   - })
  119 + this.$refs.password.focus();
  120 + });
107 121 },
108 122 handleLogin() {
109 123 this.$refs.loginForm.validate(valid => {
110 124 if (valid) {
111   - this.loading = true
112   - this.$store.dispatch('user/login', this.loginForm).then(() => {
113   - this.$router.push({ path: this.redirect || '/' })
114   - this.loading = false
115   - }).catch(() => {
116   - this.loading = false
117   - })
  125 + this.loading = true;
  126 + this.$store
  127 + .dispatch("user/login", this.loginForm)
  128 + .then(() => {
  129 + this.$router.push({ path: this.redirect || "/" });
  130 + this.loading = false;
  131 + console.log('this.redirect', this.$router);
  132 + })
  133 + .catch(res => {
  134 + console.log("res error------------>", res);
  135 + this.loading = false;
  136 + });
118 137 } else {
119   - console.log('error submit!!')
120   - return false
  138 + console.log("error submit!!");
  139 + return false;
121 140 }
122   - })
  141 + });
123 142 }
124 143 }
125   -}
  144 +};
126 145 </script>
127 146  
128 147 <style lang="scss">
129 148 /* 修复input 背景不协调 和光标变色 */
130 149 /* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
131 150  
132   -$bg:#283443;
133   -$light_gray:#fff;
  151 +$bg: #283443;
  152 +$light_gray: #fff;
134 153 $cursor: #fff;
135 154  
136 155 @supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
... ... @@ -173,9 +192,9 @@ $cursor: #fff;
173 192 </style>
174 193  
175 194 <style lang="scss" scoped>
176   -$bg:#2d3a4b;
177   -$dark_gray:#889aa4;
178   -$light_gray:#eee;
  195 +$bg: #2d3a4b;
  196 +$dark_gray: #889aa4;
  197 +$light_gray: #eee;
179 198  
180 199 .login-container {
181 200 min-height: 100%;
... ...
... ... @@ -81,7 +81,7 @@ module.exports = {
81 81 .end()
82 82  
83 83 config
84   - // https://webpack.js.org/configuration/devtool/#development
  84 + // https://webpack.js.org/configuration/devtool/#development
85 85 .when(process.env.NODE_ENV === 'development',
86 86 config => config.devtool('cheap-source-map')
87 87 )
... ... @@ -93,7 +93,7 @@ module.exports = {
93 93 .plugin('ScriptExtHtmlWebpackPlugin')
94 94 .after('html')
95 95 .use('script-ext-html-webpack-plugin', [{
96   - // `runtime` must same as runtimeChunk name. default is `runtime`
  96 + // `runtime` must same as runtimeChunk name. default is `runtime`
97 97 inline: /runtime\..*\.js$/
98 98 }])
99 99 .end()
... ...