Browse Source

feat: axios完善,接口联调

黎海 2 years ago
parent
commit
7a7678fbcc

+ 1 - 0
package.json

@@ -14,6 +14,7 @@
14
     "axios": "^0.27.2",
14
     "axios": "^0.27.2",
15
     "crypto-js": "^3.1.9-1",
15
     "crypto-js": "^3.1.9-1",
16
     "element-ui": "^2.8.2",
16
     "element-ui": "^2.8.2",
17
+    "js-cookie": "^3.0.1",
17
     "vue": "^2.6.6",
18
     "vue": "^2.6.6",
18
     "vue-router": "^3.0.1",
19
     "vue-router": "^3.0.1",
19
     "vuex": "^3.0.1"
20
     "vuex": "^3.0.1"

+ 122 - 96
src/common/http.js

@@ -5,14 +5,17 @@
5
 import axios from 'axios';
5
 import axios from 'axios';
6
 import QS from 'qs';
6
 import QS from 'qs';
7
 import store from '../store/index'
7
 import store from '../store/index'
8
+import { Message, Loading } from 'element-ui'
9
+import { basePath, logFlag } from '@/config/env'
10
+import router from '../router/index'
8
 
11
 
9
 // 环境的切换
12
 // 环境的切换
10
 if (process.env.NODE_ENV == 'development') {
13
 if (process.env.NODE_ENV == 'development') {
11
-	axios.defaults.baseURL = '/api';
14
+  axios.defaults.baseURL = '/api';
12
 } else if (process.env.NODE_ENV == 'debug') {
15
 } else if (process.env.NODE_ENV == 'debug') {
13
-	axios.defaults.baseURL = '';
16
+  axios.defaults.baseURL = '';
14
 } else if (process.env.NODE_ENV == 'production') {
17
 } else if (process.env.NODE_ENV == 'production') {
15
-	axios.defaults.baseURL = 'http://api.123dailu.com/';
18
+  axios.defaults.baseURL = 'http://api.123dailu.com/';
16
 }
19
 }
17
 
20
 
18
 // 请求超时时间
21
 // 请求超时时间
@@ -20,116 +23,139 @@ axios.defaults.timeout = 10000;
20
 
23
 
21
 // post请求头
24
 // post请求头
22
 axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';
25
 axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';
26
+axios.defaults.headers.post['token'] = localStorage.getItem('token');
27
+axios.defaults.headers.get['token'] = localStorage.getItem('token');
23
 
28
 
24
 // 请求拦截器
29
 // 请求拦截器
25
 axios.interceptors.request.use(
30
 axios.interceptors.request.use(
26
-	config => {
27
-		// 每次发送请求之前判断是否存在token,如果存在,则统一在http请求的header都加上token,不用每次请求都手动添加了
28
-		// 即使本地存在token,也有可能token是过期的,所以在响应拦截器中要对返回状态进行判断
29
-		const token = store.state.token;
30
-		token && (config.headers.Authorization = token);
31
-		return config;
32
-	},
33
-	error => {
34
-		return Promise.error(error);
35
-	})
31
+  config => {
32
+    // 每次发送请求之前判断是否存在token,如果存在,则统一在http请求的header都加上token,不用每次请求都手动添加了
33
+    // 即使本地存在token,也有可能token是过期的,所以在响应拦截器中要对返回状态进行判断
34
+    const token = localStorage.getItem('token');
35
+    if (!token) {
36
+      router.push('/login')
37
+    }
38
+    token && (config.headers.Authorization = token);
39
+    return config;
40
+  },
41
+  error => {
42
+    return Promise.error(error);
43
+  })
36
 
44
 
37
 // 响应拦截器
45
 // 响应拦截器
38
 axios.interceptors.response.use(
46
 axios.interceptors.response.use(
39
-	response => {
40
-		if (response.status === 200) {
41
-			return Promise.resolve(response);
42
-		} else {
43
-			return Promise.reject(response);
44
-		}
45
-	},
46
-	// 服务器状态码不是200的情况
47
-	error => {
48
-		if (error.response.status) {
49
-			switch (error.response.status) {
50
-				// 401: 未登录
51
-				// 未登录则跳转登录页面,并携带当前页面的路径
52
-				// 在登录成功后返回当前页面,这一步需要在登录页操作。
53
-				case 401:
54
-					router.replace({
55
-						path: '/login',
56
-						query: { redirect: router.currentRoute.fullPath }
57
-					});
58
-					break;
59
-				// 403 token过期
60
-				// 登录过期对用户进行提示
61
-				// 清除本地token和清空vuex中token对象
62
-				// 跳转登录页面
63
-				case 403:
64
-					this.$message.error('登录过期,请重新登录');
65
-					// 清除token
66
-					localStorage.removeItem('token');
67
-					store.commit('loginSuccess', null);
68
-					// 跳转登录页面,并将要浏览的页面fullPath传过去,登录成功后跳转需要访问的页面
69
-					setTimeout(() => {
70
-						router.replace({
71
-							path: '/login',
72
-							query: {
73
-								redirect: router.currentRoute.fullPath
74
-							}
75
-						});
76
-					}, 1000);
77
-					break;
78
-				// 404请求不存在
79
-				case 404:
80
-					this.$message.error('网络请求不存在');
81
-					break;
82
-				// 其他错误,直接抛出错误提示
83
-				default:
84
-					this.$message.error(error.response.data.message);
85
-			}
86
-			return Promise.reject(error.response);
87
-		}
88
-	}
47
+  response => {
48
+    if (response.status === 200) {
49
+      return Promise.resolve(response);
50
+    } else {
51
+      return Promise.reject(response);
52
+    }
53
+  },
54
+  // 服务器状态码不是200的情况
55
+  error => {
56
+    if (error.response.status) {
57
+      switch (error.response.status) {
58
+        // 401: 未登录
59
+        // 未登录则跳转登录页面,并携带当前页面的路径
60
+        // 在登录成功后返回当前页面,这一步需要在登录页操作。
61
+        case 401:
62
+          router.replace({
63
+            path: '/login',
64
+            query: { redirect: router.currentRoute.fullPath }
65
+          });
66
+          break;
67
+        // 403 token过期
68
+        // 登录过期对用户进行提示
69
+        // 清除本地token和清空vuex中token对象
70
+        // 跳转登录页面
71
+        case 403:
72
+          this.$message.error('登录过期,请重新登录');
73
+          // 清除token
74
+          localStorage.removeItem('token');
75
+          store.commit('loginSuccess', null);
76
+          // 跳转登录页面,并将要浏览的页面fullPath传过去,登录成功后跳转需要访问的页面
77
+          setTimeout(() => {
78
+            router.replace({
79
+              path: '/login',
80
+              query: {
81
+                redirect: router.currentRoute.fullPath
82
+              }
83
+            });
84
+          }, 1000);
85
+          break;
86
+        // 404请求不存在
87
+        case 404:
88
+          this.$message.error('网络请求不存在');
89
+          break;
90
+        // 其他错误,直接抛出错误提示
91
+        default:
92
+          this.$message.error(error.response.data.message);
93
+      }
94
+      return Promise.reject(error.response);
95
+    }
96
+  }
89
 )
97
 )
90
-	/**
91
-	 * get方法,对应get请求
92
-	 * @param {String} url [请求的url地址]
93
-	 * @param {Object} params [请求时携带的参数]
94
-	 */
95
-function get(url, params){
96
-	return new Promise((resolve, reject) =>{
97
-		axios.get(url, {
98
-			params: params
99
-		})
100
-			.then(res => {
101
-				resolve(res.data);
102
-			})
103
-			.catch(err => {
104
-				reject(err.data)
105
-			})
106
-	});
98
+let reqUrl = ''
99
+/**
100
+ * get方法,对应get请求
101
+ * @param {String} url [请求的url地址]
102
+ * @param {Object} params [请求时携带的参数]
103
+ */
104
+function get (url, params) {
105
+  reqUrl = basePath + url
106
+  return new Promise((resolve, reject) => {
107
+    axios.get(reqUrl, {
108
+      params: params
109
+    })
110
+      .then(res => {
111
+        if (res.data.code != 200) {
112
+          Message({
113
+            message: res.data.msg,
114
+            type: 'error'
115
+          });
116
+        }
117
+        console.log(res.data);
118
+        resolve(res.data);
119
+      })
120
+      .catch(err => {
121
+        reject(err.data)
122
+      })
123
+  });
107
 }
124
 }
108
 /**
125
 /**
109
  * post方法,对应post请求
126
  * post方法,对应post请求
110
  * @param {String} url [请求的url地址]
127
  * @param {String} url [请求的url地址]
111
  * @param {Object} params [请求时携带的参数]
128
  * @param {Object} params [请求时携带的参数]
112
  */
129
  */
113
-function post(url, params) {
114
-	return new Promise((resolve, reject) => {
115
-		axios.post(url, QS.stringify(params))
116
-			.then(res => {
117
-				resolve(res.data);
118
-			})
119
-			.catch(err => {
120
-				reject(err.data)
121
-			})
122
-	});
130
+function post (url, params) {
131
+  reqUrl = basePath + url
132
+  return new Promise((resolve, reject) => {
133
+    axios.post(reqUrl, QS.stringify(params))
134
+      .then(res => {
135
+        console.log(res, 'resres');
136
+        if (res.data.code != 200) {
137
+          Message({
138
+            message: res.data.msg,
139
+            type: 'error'
140
+          });
141
+        }
142
+        resolve(res.data);
143
+      })
144
+      .catch(err => {
145
+        console.log(err, 'errerrerr');
146
+        reject(err.data)
147
+      })
148
+  });
123
 }
149
 }
124
 
150
 
125
 
151
 
126
 
152
 
127
 export default () => {
153
 export default () => {
128
-	if (typeof window.$http == 'undefined') {
129
-		window.$http = {
130
-			post: post,
131
-			get: get
132
-		}
133
-	}
154
+  if (typeof window.$http == 'undefined') {
155
+    window.$http = {
156
+      post: post,
157
+      get: get
158
+    }
159
+  }
134
 }
160
 }
135
 
161
 

+ 21 - 1
src/common/utils.js

@@ -1,7 +1,27 @@
1
 // 自定义全局方法封装
1
 // 自定义全局方法封装
2
 const utils = {
2
 const utils = {
3
   test: function () { },
3
   test: function () { },
4
-  isBack: false
4
+  isBack: false,
5
+  formatTime: function (date, fmt) {
6
+    var date = new Date(date);
7
+    if (/(y+)/.test(fmt)) {
8
+      fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
9
+    }
10
+    var o = {
11
+      'M+': date.getMonth() + 1,
12
+      'd+': date.getDate(),
13
+      'h+': date.getHours(),
14
+      'm+': date.getMinutes(),
15
+      's+': date.getSeconds()
16
+    };
17
+    for (var k in o) {
18
+      if (new RegExp('(' + k + ')').test(fmt)) {
19
+        var str = o[k] + '';
20
+        fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : ('00' + str).substr(str.length));
21
+      }
22
+    }
23
+    return fmt;
24
+  },
5
 
25
 
6
 }
26
 }
7
 
27
 

+ 1 - 21
src/config/env.js

@@ -1,26 +1,6 @@
1
 // 环境配置
1
 // 环境配置
2
-let appId = 102;       //sso登录服务的appid,传0表示走老的授权登录
3
-let appVersion = 1;    //sso登录服务的版本,默认为第一版
4
-let logFlag = {
5
-  dev: false,    			// 开发和测试环境是否上报log
6
-  from: false,   			// 是否上传页面来源
7
-  packageName: 'web-init'
8
-};
9
-let basePath = 'https://store.api.ijolijoli.com/'; 	// api请求地址
10
-let ssoPath = 'https://sso.51yund.com';		// 授权登录地址
11
-let localPath = 'https://51yund.com';       // 获取定位地址
12
-let logPath = 'https://api.51yund.com';     // 上传日志地址
13
-let jumpPath = 'https://d.51yund.com';		// 跳转登录地址
14
-let filterErr = ['sskey过期'];  //过滤掉某些错不上报
2
+let basePath = 'https://store.api.ijolijoli.com'; 	// api请求地址
15
 
3
 
16
 export {
4
 export {
17
   basePath,
5
   basePath,
18
-  ssoPath,
19
-  localPath,
20
-  jumpPath,
21
-  logPath,
22
-  logFlag,
23
-  appId,
24
-  appVersion,
25
-  filterErr
26
 }
6
 }

+ 3 - 3
src/main.js

@@ -3,18 +3,18 @@ import App from './App.vue'
3
 import router from './router/index'
3
 import router from './router/index'
4
 import store from './store/index'
4
 import store from './store/index'
5
 import login from './common/login'
5
 import login from './common/login'
6
-import auth from './common/auth'
7
-import { injectGlobal } from './common/'
8
 import ElementUI from 'element-ui'
6
 import ElementUI from 'element-ui'
9
 import 'element-ui/lib/theme-chalk/index.css'
7
 import 'element-ui/lib/theme-chalk/index.css'
8
+import auth from './common/auth'
9
+import { injectGlobal } from './common/'
10
 import './style/reset.less'
10
 import './style/reset.less'
11
 import './style/common.less'
11
 import './style/common.less'
12
 import './assets/font/iconfont.css'
12
 import './assets/font/iconfont.css'
13
 import './style/index.less'
13
 import './style/index.less'
14
 import './filters/filter'
14
 import './filters/filter'
15
 //全局注入
15
 //全局注入
16
-injectGlobal()
17
 Vue.use(ElementUI)
16
 Vue.use(ElementUI)
17
+injectGlobal()
18
 
18
 
19
 window.globalVue = "";
19
 window.globalVue = "";
20
 // login((hasLogin)=>{
20
 // login((hasLogin)=>{

+ 47 - 24
src/pages/home/index.vue

@@ -1,7 +1,9 @@
1
 <template>
1
 <template>
2
   <div class="home">
2
   <div class="home">
3
     <div class="tab">
3
     <div class="tab">
4
-      <div class="make-order" v-for="item in tabList">
4
+      <div class="make-order"
5
+           v-for="item,index in tabList"
6
+           :key="index">
5
         <div class="make-icon">
7
         <div class="make-icon">
6
           <img :src="item.image">
8
           <img :src="item.image">
7
         </div>
9
         </div>
@@ -14,15 +16,24 @@
14
     <div class="order-list">
16
     <div class="order-list">
15
       <div class="title">预约订单列表</div>
17
       <div class="title">预约订单列表</div>
16
       <div class="list-info">
18
       <div class="list-info">
17
-        <div class="user-info" v-for="(item,index) in orderList" :style="index==orderList.length-1?'border-bottom:0px':''">
18
-          <div class="head-img"> <div class="new">新</div><img :src="item.img" alt=""></div>
19
+        <div class="user-info"
20
+             v-for="(item,index) in orderList"
21
+             :key="index"
22
+             :style="index==orderList.length-1?'border-bottom:0px':''">
23
+          <div class="head-img">
24
+            <div class="new">新</div><img :src="item.img"
25
+                 alt="">
26
+          </div>
19
           <div class="user-information">
27
           <div class="user-information">
20
             <div class="name">客户昵称:<span>{{ item.name }}</span></div>
28
             <div class="name">客户昵称:<span>{{ item.name }}</span></div>
21
             <div class="name">预约项目时间:<span>{{ item.ts }}</span></div>
29
             <div class="name">预约项目时间:<span>{{ item.ts }}</span></div>
22
             <div class="name">预约项目数量:<span>{{ item.num }}</span></div>
30
             <div class="name">预约项目数量:<span>{{ item.num }}</span></div>
23
           </div>
31
           </div>
24
           <ul class="product-list">
32
           <ul class="product-list">
25
-            <li class="product-image" v-for="value in item.imgList"><img :src="value" alt=""></li>
33
+            <li class="product-image"
34
+                v-for="value,i in item.imgList"
35
+                :key="i"><img :src="value"
36
+                   alt=""></li>
26
           </ul>
37
           </ul>
27
           <div class="status">
38
           <div class="status">
28
             {{ item.status }}
39
             {{ item.status }}
@@ -38,22 +49,22 @@ import api from '@/server/home'
38
 
49
 
39
 export default {
50
 export default {
40
   name: 'home',
51
   name: 'home',
41
-  data() {
52
+  data () {
42
     return {
53
     return {
43
       tabList: [
54
       tabList: [
44
         {
55
         {
45
           image: 'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
56
           image: 'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
46
-          num: 0,
57
+          num: 3,
47
           name: '预约订单'
58
           name: '预约订单'
48
         },
59
         },
49
         {
60
         {
50
           image: 'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/unpaid.png',
61
           image: 'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/unpaid.png',
51
-          num: 0,
62
+          num: 4,
52
           name: '未支付订单'
63
           name: '未支付订单'
53
         },
64
         },
54
         {
65
         {
55
           image: 'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/cancelOrder.png',
66
           image: 'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/cancelOrder.png',
56
-          num: 0,
67
+          num: 9,
57
           name: '取消订单'
68
           name: '取消订单'
58
         },
69
         },
59
       ],
70
       ],
@@ -126,10 +137,27 @@ export default {
126
 
137
 
127
   },
138
   },
128
   created: function () {
139
   created: function () {
129
-
140
+    this.getTotal()
141
+    this.getToday()
142
+    console.log(this.$store.state.comVal.token, 'this.$store.state.comVal.token');
130
   },
143
   },
131
   methods: {
144
   methods: {
132
-    initData() {
145
+    getTotal () {
146
+      api.getTotal().then(res => {
147
+        if (res.code == 200) {
148
+          this.tabList[0].num = res.data.order_num
149
+          this.tabList[1].num = res.data.wait_pay_num
150
+          this.tabList[2].num = res.data.cancel_num
151
+        }
152
+        console.log(res, 'res====');
153
+      })
154
+    },
155
+    getToday () {
156
+      api.getToday().then(res => {
157
+        console.log(res, 'res');
158
+      })
159
+    },
160
+    initData () {
133
 
161
 
134
     },
162
     },
135
   },
163
   },
@@ -151,7 +179,7 @@ export default {
151
     .make-order {
179
     .make-order {
152
       width: 274px;
180
       width: 274px;
153
       padding: 14px 30px;
181
       padding: 14px 30px;
154
-      background: #FFFFFF;
182
+      background: #ffffff;
155
       box-shadow: 0px 2px 4px 0px rgba(184, 191, 198, 0.2);
183
       box-shadow: 0px 2px 4px 0px rgba(184, 191, 198, 0.2);
156
       border-radius: 8px;
184
       border-radius: 8px;
157
       display: flex;
185
       display: flex;
@@ -189,7 +217,7 @@ export default {
189
   .order-list {
217
   .order-list {
190
     margin-top: 18px;
218
     margin-top: 18px;
191
     width: 100%;
219
     width: 100%;
192
-    background: #FFFFFF;
220
+    background: #ffffff;
193
     box-shadow: 0px 2px 4px 0px rgba(184, 191, 198, 0.2);
221
     box-shadow: 0px 2px 4px 0px rgba(184, 191, 198, 0.2);
194
     border-radius: 8px;
222
     border-radius: 8px;
195
     padding: 14px 12px;
223
     padding: 14px 12px;
@@ -210,14 +238,14 @@ export default {
210
 
238
 
211
       .user-info {
239
       .user-info {
212
         padding: 14px 0;
240
         padding: 14px 0;
213
-        border-bottom: 1px solid #E6E6E6;
241
+        border-bottom: 1px solid #e6e6e6;
214
         display: flex;
242
         display: flex;
215
         align-items: center;
243
         align-items: center;
216
 
244
 
217
         .head-img {
245
         .head-img {
218
           position: relative;
246
           position: relative;
219
           width: 72px;
247
           width: 72px;
220
-          .new{
248
+          .new {
221
             position: absolute;
249
             position: absolute;
222
             top: -2px;
250
             top: -2px;
223
             right: -2px;
251
             right: -2px;
@@ -228,9 +256,9 @@ export default {
228
             font-size: 12px;
256
             font-size: 12px;
229
             font-family: PingFangSC-Regular, PingFang SC;
257
             font-family: PingFangSC-Regular, PingFang SC;
230
             font-weight: 400;
258
             font-weight: 400;
231
-            color: #FFFFFF;
259
+            color: #ffffff;
232
             line-height: 17px;
260
             line-height: 17px;
233
-            background: #FF6945;
261
+            background: #ff6945;
234
             border-radius: 50%;
262
             border-radius: 50%;
235
           }
263
           }
236
 
264
 
@@ -264,32 +292,27 @@ export default {
264
           overflow-y: hidden;
292
           overflow-y: hidden;
265
           padding-left: 8px;
293
           padding-left: 8px;
266
 
294
 
267
-
268
           .product-image {
295
           .product-image {
269
             display: inline-block;
296
             display: inline-block;
270
             margin-left: 16px;
297
             margin-left: 16px;
271
             width: 72px;
298
             width: 72px;
272
-            img{
299
+            img {
273
               border-radius: 8px;
300
               border-radius: 8px;
274
               width: 100%;
301
               width: 100%;
275
               display: block;
302
               display: block;
276
             }
303
             }
277
-
278
           }
304
           }
279
-
280
         }
305
         }
281
-        .status{
306
+        .status {
282
           margin-left: 56px;
307
           margin-left: 56px;
283
           font-size: 16px;
308
           font-size: 16px;
284
           font-family: SourceHanSansCN-Regular, SourceHanSansCN;
309
           font-family: SourceHanSansCN-Regular, SourceHanSansCN;
285
           font-weight: 400;
310
           font-weight: 400;
286
-          color: #FC3019;
311
+          color: #fc3019;
287
           line-height: 24px;
312
           line-height: 24px;
288
         }
313
         }
289
       }
314
       }
290
     }
315
     }
291
-
292
   }
316
   }
293
 }
317
 }
294
-
295
 </style>
318
 </style>

+ 82 - 30
src/pages/login/login.vue

@@ -2,17 +2,27 @@
2
   <div class="mine">
2
   <div class="mine">
3
     <div class="login-info">
3
     <div class="login-info">
4
       <div class="logo">
4
       <div class="logo">
5
-        <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/logo%402x.png" alt="">
5
+        <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/logo%402x.png"
6
+             alt="">
6
       </div>
7
       </div>
7
       <div class="login-title">JOLIJOLI店员端</div>
8
       <div class="login-title">JOLIJOLI店员端</div>
8
       <div class="content">
9
       <div class="content">
9
         <div class="value-inp">
10
         <div class="value-inp">
10
-          <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/num_icon.png" alt="">
11
-          <el-input placeholder="请输入账号名" v-model="account"></el-input>
11
+          <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/num_icon.png"
12
+               alt="">
13
+          <el-input placeholder="请输入账号名"
14
+                    v-model="account"></el-input>
12
         </div>
15
         </div>
13
         <div class="value-inp">
16
         <div class="value-inp">
14
-          <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/password_icon.png" alt="">
15
-          <el-input placeholder="请输入密码" v-model="password" show-password></el-input>
17
+          <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/password_icon.png"
18
+               alt="">
19
+          <el-input placeholder="请输入密码"
20
+                    v-model="password"
21
+                    show-password></el-input>
22
+        </div>
23
+        <div class="onLogin"
24
+             @click="onLogin">
25
+          登录
16
         </div>
26
         </div>
17
       </div>
27
       </div>
18
     </div>
28
     </div>
@@ -20,25 +30,49 @@
20
 </template>
30
 </template>
21
 
31
 
22
 <script>
32
 <script>
33
+import api from '../../server/home'
34
+// import Cookies from "js-cookie"
23
 export default {
35
 export default {
24
   components: {},
36
   components: {},
25
-  data() {
37
+  data () {
26
     return {
38
     return {
27
-      account:"",
28
-      password:""
39
+      account: "",
40
+      password: ""
29
 
41
 
30
     };
42
     };
31
   },
43
   },
32
   computed: {},
44
   computed: {},
33
   watch: {},
45
   watch: {},
34
 
46
 
35
-  methods: {},
47
+  methods: {
48
+    onLogin () {
49
+      let params = {
50
+        username: this.account,
51
+        password: this.password
52
+      }
53
+      api.getToken(params).then(res => {
54
+        if (res.code == 200) {
55
+          this.$store.state.comVal.token = res.data.token
56
+          console.log(this.$store.state.comVal.token, 'this.$store.');
57
+          localStorage.setItem("token", res.data.token)
58
+          this.$router.push({
59
+            path: '/home'
60
+          })
61
+        }
62
+      })
63
+    }
36
 
64
 
37
-  created() {
65
+  },
38
 
66
 
67
+  created () {
68
+    if (localStorage.getItem("token")) {
69
+      this.$router.push({
70
+        path: '/home'
71
+      })
72
+    }
39
   },
73
   },
40
 
74
 
41
-  mounted() {
75
+  mounted () {
42
 
76
 
43
   },
77
   },
44
 }
78
 }
@@ -49,68 +83,86 @@ export default {
49
 .mine {
83
 .mine {
50
   width: 100%;
84
   width: 100%;
51
   min-height: 100vh;
85
   min-height: 100vh;
52
-  background: linear-gradient(315deg, #FF9F7E 0%, #FF926C 0%, #FF9D55 100%);
86
+  background: linear-gradient(315deg, #ff9f7e 0%, #ff926c 0%, #ff9d55 100%);
53
   position: relative;
87
   position: relative;
54
-  .login-info{
88
+  .login-info {
55
     position: absolute;
89
     position: absolute;
56
     left: 50%;
90
     left: 50%;
57
     top: 15%;
91
     top: 15%;
58
     transform: translateX(-50%);
92
     transform: translateX(-50%);
59
     width: 460px;
93
     width: 460px;
60
     height: 460px;
94
     height: 460px;
61
-    background: url("https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/login_bg.png") no-repeat;
95
+    background: url("https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/login_bg.png")
96
+      no-repeat;
62
     background-size: 100% 100%;
97
     background-size: 100% 100%;
63
-    .logo{
98
+    .logo {
64
       width: 100px;
99
       width: 100px;
65
       height: 100px;
100
       height: 100px;
66
       position: relative;
101
       position: relative;
67
       left: 50%;
102
       left: 50%;
68
       transform: translateX(-50%);
103
       transform: translateX(-50%);
69
       top: -17px;
104
       top: -17px;
70
-      img{
105
+      img {
71
         width: 100%;
106
         width: 100%;
72
         display: block;
107
         display: block;
73
       }
108
       }
74
     }
109
     }
75
-    .login-title{
110
+    .login-title {
76
       margin-top: 7px;
111
       margin-top: 7px;
77
       font-size: 28px;
112
       font-size: 28px;
78
       font-family: PingFangSC-Medium, PingFang SC;
113
       font-family: PingFangSC-Medium, PingFang SC;
79
       font-weight: 500;
114
       font-weight: 500;
80
       text-align: center;
115
       text-align: center;
81
-      color: #EB5C21;
116
+      color: #eb5c21;
82
       line-height: 40px;
117
       line-height: 40px;
83
     }
118
     }
84
-    .content{
119
+    .content {
85
       padding-top: 15px;
120
       padding-top: 15px;
86
       position: relative;
121
       position: relative;
87
-      .value-inp{
122
+      .value-inp {
88
         position: relative;
123
         position: relative;
89
         margin-top: 20px;
124
         margin-top: 20px;
90
         left: 50%;
125
         left: 50%;
91
         transform: translateX(-50%);
126
         transform: translateX(-50%);
92
         width: 336px;
127
         width: 336px;
93
         height: 53px;
128
         height: 53px;
94
-        background: url("https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/input_bg.png") no-repeat;
129
+        background: url("https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/input_bg.png")
130
+          no-repeat;
95
         background-size: 100% 100%;
131
         background-size: 100% 100%;
96
         display: flex;
132
         display: flex;
97
         padding: 0 24px;
133
         padding: 0 24px;
98
         justify-content: space-between;
134
         justify-content: space-between;
99
         align-items: center;
135
         align-items: center;
100
-        img{
136
+        img {
101
           width: 32px;
137
           width: 32px;
102
           height: 32px;
138
           height: 32px;
103
         }
139
         }
104
-       /deep/ .el-input__inner{
105
-          background-color:transparent;
106
-         border: 0px solid #DCDFE6;
107
-         height: 53px;
108
-         line-height: 53px;
109
-         font-size: 18px;
110
-         font-family: PingFangSC-Regular, PingFang SC;
111
-         font-weight: 400;
140
+        /deep/ .el-input__inner {
141
+          background-color: transparent;
142
+          border: 0px solid #dcdfe6;
143
+          height: 53px;
144
+          line-height: 53px;
145
+          font-size: 18px;
146
+          font-family: PingFangSC-Regular, PingFang SC;
147
+          font-weight: 400;
112
         }
148
         }
113
       }
149
       }
150
+      .onLogin {
151
+        margin-top: 29px;
152
+        position: relative;
153
+        left: 50%;
154
+        transform: translateX(-50%);
155
+        width: 214px;
156
+        height: 53px;
157
+        line-height: 53px;
158
+        background: #fa7d22;
159
+        border-radius: 27px;
160
+        font-size: 18px;
161
+        font-family: PingFangSC-Medium, PingFang SC;
162
+        font-weight: 500;
163
+        color: #ffffff;
164
+        text-align: center;
165
+      }
114
     }
166
     }
115
   }
167
   }
116
 }
168
 }

+ 44 - 95
src/pages/testSkin/index.vue

@@ -15,7 +15,8 @@
15
            class="el-input__icon el-icon-search"></i>
15
            class="el-input__icon el-icon-search"></i>
16
       </el-input>
16
       </el-input>
17
       <el-button type="primary"
17
       <el-button type="primary"
18
-                 class="searchButton">搜索</el-button>
18
+                 class="searchButton"
19
+                 @click="getSkinList">搜索</el-button>
19
     </div>
20
     </div>
20
     <div class="list">
21
     <div class="list">
21
       <div class="tab">
22
       <div class="tab">
@@ -30,21 +31,21 @@
30
              v-for="(item,index) in userList"
31
              v-for="(item,index) in userList"
31
              :key="index"
32
              :key="index"
32
              @click="onDetails">
33
              @click="onDetails">
33
-          <div class="head-img"><img :src="item.img"
34
+          <div class="head-img"><img :src="item.avatar_url"
34
                  alt=""></div>
35
                  alt=""></div>
35
-          <div class="head-name">{{ item.name }}</div>
36
-          <div class="head-phone">{{ item.phone }}</div>
37
-          <div class="head-ts">{{ item.ts }}</div>
38
-          <div class="head-status">{{ item.status }}</div>
36
+          <div class="head-name">{{ item.nickname }}</div>
37
+          <div class="head-phone">{{ item.mobile }}</div>
38
+          <div class="head-ts">{{ item.check_time }}</div>
39
+          <div class="head-status"
40
+               :style="item.status==1?'color: #61D09D;':'color: #FC3019;'">{{ item.status==1?'已面诊':'未面诊'}}</div>
39
         </div>
41
         </div>
40
       </div>
42
       </div>
41
       <div class="pagin">
43
       <div class="pagin">
42
         <el-pagination background
44
         <el-pagination background
43
                        layout="prev, pager, next"
45
                        layout="prev, pager, next"
44
-                       @size-change="handleSizeChange"
45
                        @current-change="handleCurrentChange"
46
                        @current-change="handleCurrentChange"
46
                        :current-page.sync="currentPage1"
47
                        :current-page.sync="currentPage1"
47
-                       :total="1000">
48
+                       :total="total">
48
         </el-pagination>
49
         </el-pagination>
49
       </div>
50
       </div>
50
     </div>
51
     </div>
@@ -52,111 +53,59 @@
52
 </template>
53
 </template>
53
 
54
 
54
 <script>
55
 <script>
56
+import api from '../../server/home'
55
 export default {
57
 export default {
56
   components: {},
58
   components: {},
57
   data () {
59
   data () {
58
     return {
60
     return {
59
-      dates: '',
61
+      dates: [],
60
       searchText: '',
62
       searchText: '',
61
-      userList: [
62
-        {
63
-          img:
64
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
65
-          name: '张三',
66
-          phone: 4556455645,
67
-          ts: '2022.04.15  14:30-16:30',
68
-          status: '标签信息未填写'
69
-        },
70
-        {
71
-          img:
72
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
73
-          name: '张三',
74
-          phone: 4556455645,
75
-          ts: '2022.04.15  14:30-16:30',
76
-          status: '标签信息未填写'
77
-        },
78
-        {
79
-          img:
80
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
81
-          name: '张三',
82
-          phone: 4556455645,
83
-          ts: '2022.04.15  14:30-16:30',
84
-          status: '标签信息未填写'
85
-        },
86
-        {
87
-          img:
88
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
89
-          name: '张三',
90
-          phone: 4556455645,
91
-          ts: '2022.04.15  14:30-16:30',
92
-          status: '标签信息未填写'
93
-        },
94
-        {
95
-          img:
96
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
97
-          name: '张三',
98
-          phone: 4556455645,
99
-          ts: '2022.04.15  14:30-16:30',
100
-          status: '标签信息未填写'
101
-        },
102
-        {
103
-          img:
104
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
105
-          name: '张三',
106
-          phone: 4556455645,
107
-          ts: '2022.04.15  14:30-16:30',
108
-          status: '标签信息未填写'
109
-        },
110
-        {
111
-          img:
112
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
113
-          name: '张三',
114
-          phone: 4556455645,
115
-          ts: '2022.04.15  14:30-16:30',
116
-          status: '标签信息未填写'
117
-        },
118
-        {
119
-          img:
120
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
121
-          name: '张三',
122
-          phone: 4556455645,
123
-          ts: '2022.04.15  14:30-16:30',
124
-          status: '标签信息未填写'
125
-        },
126
-        {
127
-          img:
128
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
129
-          name: '张三',
130
-          phone: 4556455645,
131
-          ts: '2022.04.15  14:30-16:30',
132
-          status: '标签信息未填写'
133
-        },
134
-        {
135
-          img:
136
-            'https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png',
137
-          name: '张三',
138
-          phone: 4556455645,
139
-          ts: '2022.04.15  14:30-16:30',
140
-          status: '标签信息未填写'
141
-        }
142
-      ],
143
-      currentPage1: 2
63
+      userList: [],
64
+      currentPage1: 1,
65
+      limit: 10,
66
+      total: 0,
144
     }
67
     }
145
   },
68
   },
146
   computed: {},
69
   computed: {},
147
   watch: {},
70
   watch: {},
148
 
71
 
149
   methods: {
72
   methods: {
73
+    getSkinList () {
74
+      let start_date = '', end_date = ''
75
+      if (this.dates && this.dates.length > 0) {
76
+        start_date = utils.formatTime(this.dates[0], 'yyyy-MM-dd')
77
+        end_date = utils.formatTime(this.dates[1], 'yyyy-MM-dd')
78
+      }
79
+      console.log(start_date, end_date, 'end_date');
80
+      let params = {
81
+        page: this.currentPage1,
82
+        limit: this.limit,
83
+        keywords: this.searchText,
84
+        start_date: start_date,
85
+        end_date: end_date,
86
+      }
87
+      api.getSkinList(params).then(res => {
88
+        if (res.code == 200) {
89
+          this.userList = res.data.list
90
+          this.total = res.data.total
91
+        }
92
+      })
93
+    },
150
     onDetails () {
94
     onDetails () {
151
       this.$router.push({
95
       this.$router.push({
152
         path: '/testSkin/details'
96
         path: '/testSkin/details'
153
       })
97
       })
154
     },
98
     },
155
-    handleCurrentChange () { },
156
-    handleSizeChange () { }
99
+    handleCurrentChange (e) {
100
+      this.currentPage1 = e
101
+      this.getSkinList
102
+      console.log(e, 'eeeeee');
103
+    }
157
   },
104
   },
158
 
105
 
159
-  created () { },
106
+  created () {
107
+    this.getSkinList()
108
+  },
160
 
109
 
161
   mounted () { }
110
   mounted () { }
162
 }
111
 }

+ 1 - 1
src/router/map/home.js

@@ -16,7 +16,7 @@ import Coupon from '@/pages/coupon/index'
16
 import projectOrder from '@/pages/customerMan/myOrder'
16
 import projectOrder from '@/pages/customerMan/myOrder'
17
 
17
 
18
 export default {
18
 export default {
19
-  path: '/',
19
+  path: '/layout',
20
   name: '首页',
20
   name: '首页',
21
   component: layout,
21
   component: layout,
22
   children: [
22
   children: [

+ 10 - 5
src/router/map/login.js

@@ -1,8 +1,13 @@
1
 // 登录
1
 // 登录
2
 export default [
2
 export default [
3
-	{	
4
-		path: '/login',
5
-		name: 'login',
6
-		component: () => import('@/pages/login/login.vue') 
7
-	}
3
+  {
4
+    path: '/',
5
+    name: 'login',
6
+    component: () => import('@/pages/login/login.vue')
7
+  },
8
+  {
9
+    path: '/login',
10
+    name: 'login',
11
+    component: () => import('@/pages/login/login.vue')
12
+  }
8
 ]
13
 ]

+ 20 - 8
src/server/home.js

@@ -3,14 +3,26 @@
3
 import url from './urls'
3
 import url from './urls'
4
 
4
 
5
 export default class Home {
5
 export default class Home {
6
-	/**
7
-	 * @描述  1.1	获取用户信息
8
-	 */
9
-	static getUserMess(parms) {
10
-		return $http.post(url.getUserMess,parms);
11
-    }
6
+  /**
7
+   * @描述  1.1	获取用户信息
8
+   */
9
+  static getToken (parms) {
10
+    return $http.post(url.getToken, parms);
11
+  }
12
+
13
+  static getTotal (parms) {
14
+    return $http.get(url.getTotal, parms);
15
+  }
16
+
17
+  static getToday (parms) {
18
+    return $http.get(url.getToday, parms);
19
+  }
20
+
21
+  static getSkinList (parms) {
22
+    return $http.get(url.getSkinList, parms);
23
+  }
12
 }
24
 }
13
 
25
 
14
- 
15
- 
26
+
27
+
16
 
28
 

+ 8 - 3
src/server/urls.js

@@ -1,5 +1,10 @@
1
 export default {
1
 export default {
2
-	//登录
3
-	getsskey: '/sport/get_session_key',
4
-	getUserMess: '/enterprise/check_user_auth'
2
+  //登录
3
+  getToken: '/v2/pad/login',
4
+  //首页数据
5
+  getTotal:'/v2/pad/home/total',
6
+  //今日订单列表
7
+  getToday:'/v2/pad/order/today',
8
+  //测肤记录列表
9
+  getSkinList:'/v2/pad/skin/list',
5
 }
10
 }

+ 2 - 1
src/store/modules/comVal.js

@@ -1,5 +1,6 @@
1
 const state = {
1
 const state = {
2
-  name: 666
2
+  name: 666,
3
+  token: null
3
 }
4
 }
4
 
5
 
5
 const actions = {
6
 const actions = {