Ver código fonte

Merge branch 'zhp' of http://code.qutaovip.com/lihai/pad_spa into feat/lihai

黎海 2 anos atrás
pai
commit
d8684465cb

+ 1 - 1
src/components/common/layout/layout.vue

@@ -97,7 +97,7 @@
97 97
               >
98 98
                 <div class="content-bar flex flex-column">
99 99
                   <div class="desc-info">{{item.project_name}}</div>
100
-                  <div class="desc-time">{{`${item.device_name} ${item.room}` | ellipsis(80)}}</div>
100
+                  <div class="desc-time">{{`${item.device_name} (${item.room}) 还有${item.minute}分钟开始` | ellipsis(80)}}</div>
101 101
                 </div>
102 102
                 <div class="count flex flex-column items-center">
103 103
                   <div class="time">{{item.create_time}}</div>

+ 239 - 63
src/pages/customerMan/details/index.vue

@@ -2,18 +2,30 @@
2 2
   <div class="mine">
3 3
     <div class="left">
4 4
       <div class="user-info">
5
-        <div class="user-img"><img :src="userInfo.avatar_url"
6
-               alt=""></div>
7
-        <div class="user-span">
8
-          <div class="info">
9
-            <div class="name"><span>{{userInfo.nickname}}</span></div>
10
-            <div class="sex"><img :src="gender"
11
-                   alt=""></div>
12
-            <div class="age"><span>{{userInfo.skin_age}}</span><span>肤龄</span></div>
5
+        <div class="title">
6
+          <div class="txt">个人信息</div>
7
+          <div class="test-record" @click="toTestRecord" v-if="userInfo.analysis_id">测肤记录</div>
8
+        </div>
9
+        <div class="detail-info">
10
+          <div class="user-img">
11
+            <img :src="userInfo.avatar_url" alt="">
12
+          </div>
13
+          <div class="user-span">
14
+            <div class="info">
15
+              <div class="name"><span>{{userInfo.nickname}}</span></div>
16
+              <div class="sex"><img :src="gender"
17
+                    alt=""></div>
18
+              <div class="age"><span>{{userInfo.skin_age}}</span><span>肤龄</span></div>
19
+            </div>
20
+            <div class="real-name">姓名:
21
+              <span v-show="!nameInpVisible">{{userInfo.real_name}}</span>
22
+              <el-input size="mini" ref="realNameInp" v-show="nameInpVisible" @change="updateRealName" v-model="userInfo.real_name" type="text"></el-input>
23
+              <img class="edit-name" @click="editName" src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/coupon/eidt.png" alt="" srcset="">
24
+            </div>
25
+            <div class="skin-type">肤质:<span>{{userInfo.skin_type}}</span></div>
26
+            <div class="skin-color">肤色:<span>{{userInfo.skin_color}}</span></div>
27
+            <div class="skin-color">上传报告时间:<span>{{userInfo.check_time}}</span></div>
13 28
           </div>
14
-          <div class="skin-type">肤质:<span>{{userInfo.skin_type}}</span></div>
15
-          <div class="skin-color">肤色:<span>{{userInfo.skin_color}}</span></div>
16
-          <div class="skin-color">上传报告时间:<span>{{userInfo.check_time}}</span></div>
17 29
         </div>
18 30
       </div>
19 31
 
@@ -37,8 +49,8 @@
37 49
           <span>{{userInfo.store_name}}</span>
38 50
         </div>
39 51
 
40
-        <div class="myDataList">
41
-          卡卷数量:
52
+        <div class="myDataList coupon-num">
53
+          优惠券数量:
42 54
           <span>{{userInfo.card_num}}</span>
43 55
         </div>
44 56
 
@@ -54,9 +66,9 @@
54 66
           积分:
55 67
           <span>{{userInfo.coin}}</span>
56 68
         </div>
57
-        <div class="myDataList">
69
+        <div class="myDataList" @click="remarkPupopVisible=true">
58 70
           备注:
59
-          <span>{{remarks | ellipsis(20)}}</span>
71
+          <span>{{userInfo.remark | ellipsis(20)}}</span>
60 72
         </div>
61 73
       </div>
62 74
     </div>
@@ -85,21 +97,27 @@
85 97
         <div class="right-top-list">
86 98
           <div class="dataList"
87 99
                @click="toOrder(1)">
88
-            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/coupon/project_icon.png" />
89
-            <p>项目订单</p>
100
+            <div class="">
101
+              <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/coupon/project_icon.png" />
102
+              <div>项目订单</div>
103
+            </div>
90 104
             <span>{{order_total.project}}</span>
91 105
           </div>
92 106
           <div class="dataList"
93 107
                style="margin:18px 0px"
94 108
                @click="toOrder(2)">
95
-            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/coupon/coupon_icon.png" />
96
-            <p>优惠券</p>
97
-            <span>{{order_total.coupon}}</span>
109
+            <div class="">
110
+              <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/coupon/coupon_icon.png" />
111
+              <div>卡券订单</div>
112
+            </div>
113
+            <span>{{order_total.card}}</span>
98 114
           </div>
99 115
           <div class="dataList"
100 116
                @click="toOrder(3)">
101
-            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/coupon/order_total_icon.png" />
102
-            <p>商品订单</p>
117
+            <div class="">
118
+              <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/coupon/order_total_icon.png" />
119
+              <div>商品订单</div>
120
+            </div>
103 121
             <span>{{order_total.goods}}</span>
104 122
           </div>
105 123
         </div>
@@ -151,11 +169,30 @@
151 169
         </div>
152 170
       </div>
153 171
     </div>
172
+        <!-- 备注 -->
173
+    <mine-pupop :show="remarkPupopVisible">
174
+      <div class="block">
175
+        <div class="delete-pupop"
176
+             @click="remarkPupopVisible=false">
177
+          <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/slices/delete.png"
178
+               alt />
179
+        </div>
180
+        <div class="pupop-title">备注</div>
181
+        <textarea type="text"
182
+                  class="noticeInput"
183
+                  placeholder="备注"
184
+                  v-model="userInfo.remark"></textarea>
185
+        <div class="noticeSubmit">
186
+          <div class="submit-notice" @click="submitRemark">确定</div>
187
+        </div>
188
+      </div>
189
+    </mine-pupop>
154 190
   </div>
155 191
 </template>
156 192
 
157 193
 <script>
158 194
 import api from "../../../server/home";
195
+import minePupop from "../../../components/minePupop/index.vue";
159 196
 
160 197
 export default {
161 198
   data () {
@@ -166,7 +203,9 @@ export default {
166 203
         name: "张三",
167 204
         sex: "女",
168 205
         age: "23",
169
-        skinType: "中性皮肤"
206
+        skinType: "中性皮肤",
207
+        real_name: '',
208
+        remark: '',
170 209
       },
171 210
       problem: "",
172 211
       //面部标签
@@ -175,7 +214,7 @@ export default {
175 214
       //执行方案
176 215
       programmeList: [],
177 216
 
178
-      remarks: {},
217
+      // remarks: {},
179 218
       //项目列表
180 219
       projectList: [],
181 220
 
@@ -185,10 +224,12 @@ export default {
185 224
       projectInfo: "",
186 225
       weekInfo: "",
187 226
       programmeIndex: "",
188
-      remarks: "",
189
-      isPupop: false
227
+      isPupop: false,
228
+      nameInpVisible: false,
229
+      remarkPupopVisible: false
190 230
     };
191 231
   },
232
+  components: { minePupop },
192 233
   computed: {
193 234
     gender () {
194 235
       // 性别,1男,2女,0保密
@@ -203,7 +244,7 @@ export default {
203 244
     getPadUserInfo () {
204 245
       api.getPadUserInfo({ id: this.id }).then(res => {
205 246
         this.userInfo = res.data.user;
206
-        this.remarks = res.data.remark;
247
+        // this.userInfo.remarks = res.data.remark;
207 248
         this.problem = res.data.skin_name;
208 249
         let _problem = []
209 250
         res.data.face_names.forEach(item => {
@@ -213,7 +254,6 @@ export default {
213 254
           console.log(_problem, '_problem');
214 255
         })
215 256
         this.lableList = _problem
216
-        this.remarks = res.data.remark
217 257
         this.randomColor();
218 258
         this.order_total = res.data.order_total;
219 259
         this.programmeList = res.data.scheme_list;
@@ -280,6 +320,38 @@ export default {
280 320
         }
281 321
       });
282 322
     },
323
+    toTestRecord () {
324
+      this.$router.push({
325
+        path: '/testSkin/details',
326
+        query: {
327
+          id: this.userInfo.analysis_id
328
+        }
329
+      })
330
+    },
331
+    editName () {
332
+      this.nameInpVisible = true
333
+      this.$refs.realNameInp.focus()
334
+    },
335
+    async updateRealName() {
336
+      let resp = await api.updateUserProfile({
337
+        id: this.id,
338
+        real_name: this.userInfo.real_name
339
+      })
340
+      if (resp.code === 200) {
341
+        this.$message.success('保存成功!')
342
+      }
343
+      this.nameInpVisible = false
344
+    },
345
+    async submitRemark () {
346
+      let resp = await api.updateUserProfile({
347
+        id: this.id,
348
+        remark: this.userInfo.remark
349
+      })
350
+      if (resp.code === 200) {
351
+        this.$message.success('保存成功!')
352
+      }
353
+      this.remarkPupopVisible = false
354
+    }
283 355
   },
284 356
 
285 357
   created () {
@@ -311,48 +383,79 @@ export default {
311 383
     height: 100%;
312 384
     .user-info {
313 385
       display: flex;
386
+      flex-direction: column;
314 387
       align-items: center;
315
-      .user-img {
316
-        width: 96px;
317
-        img {
318
-          width: 100%;
319
-          display: block;
320
-          border-radius: 6px;
388
+      .title {
389
+        width: 100%;
390
+        display: flex;
391
+        justify-content: space-between;
392
+        align-items: center;
393
+        margin-bottom: 10px;
394
+        .txt {
395
+          color: #333333;
396
+        }
397
+        .test-record {
398
+          font-size: 12px;
399
+          color: #FA7D22;
321 400
         }
322 401
       }
323
-      .user-span {
324
-        margin-left: 12px;
325
-
326
-        span {
327
-          color: #333333;
402
+      .detail-info {
403
+        display: flex;
404
+        .user-img {
405
+          width: 96px;
406
+          img {
407
+            width: 100%;
408
+            display: block;
409
+            border-radius: 6px;
410
+          }
328 411
         }
329
-        .info {
330
-          display: flex;
331
-          justify-content: space-between;
412
+        .user-span {
413
+          margin-left: 12px;
332 414
 
333
-          .name {
334
-            font-size: 16px;
415
+          span {
416
+            color: #333333;
335 417
           }
336
-          .sex {
337
-            img {
338
-              width: 24px;
339
-              height: 24px;
418
+          .info {
419
+            display: flex;
420
+            justify-content: space-between;
421
+
422
+            .name {
423
+              font-size: 16px;
424
+            }
425
+            .sex {
426
+              img {
427
+                width: 24px;
428
+                height: 24px;
429
+              }
430
+            }
431
+            .age {
432
+              margin-left: 13px;
433
+              span:nth-child(1) {
434
+                font-size: 22px;
435
+              }
436
+              span:nth-child(2) {
437
+                margin-left: 4px;
438
+                color: #999999;
439
+              }
340 440
             }
341 441
           }
342
-          .age {
343
-            margin-left: 13px;
344
-            span:nth-child(1) {
345
-              font-size: 22px;
442
+          .real-name {
443
+            display: flex;
444
+            justify-content: space-between;
445
+            align-items: center;
446
+            .real-name-inp {
447
+              width: 35px !important;
448
+              height: 25px !important;
346 449
             }
347
-            span:nth-child(2) {
348
-              margin-left: 4px;
349
-              color: #999999;
450
+            .edit-name {
451
+              width: 20px;
452
+              height: 20px;
350 453
             }
351 454
           }
352
-        }
353
-        div:nth-child(2),
354
-        div:nth-child(3) {
355
-          margin-bottom: 8px;
455
+          div:nth-child(2),
456
+          div:nth-child(3) {
457
+            margin-bottom: 8px;
458
+          }
356 459
         }
357 460
       }
358 461
     }
@@ -371,6 +474,13 @@ export default {
371 474
           color: #fa7d22;
372 475
         }
373 476
       }
477
+      .coupon-num {
478
+        span {
479
+          color: #FA7D22;
480
+          font-size: 16px;
481
+          font-weight: 500;
482
+        }
483
+      }
374 484
     }
375 485
   }
376 486
 
@@ -389,13 +499,21 @@ export default {
389 499
         flex-direction: column;
390 500
         .dataList {
391 501
           height: 56px;
392
-          // width: 239ppx;
502
+          width: 193px;
393 503
           background: #ffffff;
394 504
           box-shadow: 0px 2px 4px 0px rgba(184, 191, 198, 0.2);
395 505
           border-radius: 8px;
396
-          padding: 16px 12px 12px 12px;
506
+          padding: 12px 20px 12px 14px;
397 507
           display: flex;
508
+          justify-content: space-between;
398 509
           align-items: center;
510
+          div:nth-child(1) {
511
+            display: flex;
512
+            align-items: center;
513
+            img {
514
+              margin-right: 14px;
515
+            }
516
+          }
399 517
           img {
400 518
             width: 33px;
401 519
             height: 33px;
@@ -407,7 +525,7 @@ export default {
407 525
           }
408 526
           span {
409 527
             font-size: 16px;
410
-            margin-right: 20px;
528
+            // margin-right: 20px;
411 529
           }
412 530
         }
413 531
       }
@@ -416,7 +534,7 @@ export default {
416 534
         box-shadow: 0px 2px 4px 0px rgba(184, 191, 198, 0.2);
417 535
         border-radius: 8px;
418 536
         padding: 16px 12px 12px 12px;
419
-        width: 310px;
537
+        width: 358px;
420 538
         height: 100%;
421 539
         .lable {
422 540
           //   margin-top: 23px;
@@ -749,5 +867,63 @@ export default {
749 867
       }
750 868
     }
751 869
   }
870
+  .block {
871
+    width: 540px;
872
+    background: #ffffff;
873
+    border-radius: 8px;
874
+    position: relative;
875
+    padding: 42px;
876
+    .delete-pupop {
877
+      position: absolute;
878
+      width: 32px;
879
+      height: 32px;
880
+      top: 5px;
881
+      right: 5px;
882
+      img {
883
+        width: 100%;
884
+        height: 100%;
885
+        display: block;
886
+      }
887
+    }
888
+    .pupop-title {
889
+      font-size: 14px;
890
+      font-family: PingFangSC-Medium, PingFang SC;
891
+      font-weight: 500;
892
+      color: #333333;
893
+      line-height: 20px;
894
+      text-align: center;
895
+    }
896
+
897
+    .noticeInput {
898
+      margin-top: 50px;
899
+      margin-left: 80px;
900
+      padding: 10px;
901
+      width: 307px;
902
+      height: 184px;
903
+      border: 1px solid #f5f5f5;
904
+    }
905
+
906
+    .noticeSubmit {
907
+      margin-top: 20px;
908
+      width: 100%;
909
+      display: flex;
910
+      align-items: center;
911
+      justify-content: center;
912
+    }
913
+
914
+
915
+    .submit-notice {
916
+      width: 100px;
917
+      height: 29px;
918
+      border-radius: 14px;
919
+      font-size: 14px;
920
+      font-weight: 500;
921
+      background: #fa7d22;
922
+      color: white;
923
+      line-height: 29px;
924
+      text-align: center;
925
+      margin-left: 22px;
926
+    }
927
+  }
752 928
 }
753 929
 </style>

+ 102 - 17
src/pages/customerMan/myOrder/index.vue

@@ -58,11 +58,11 @@
58 58
             </div>
59 59
           </div>
60 60
         </el-tab-pane>
61
-        <el-tab-pane label="卡订单"
61
+        <el-tab-pane label="卡订单"
62 62
                      name="second">
63 63
           <div class="user-list">
64 64
             <el-table ref="multipleTable"
65
-                      :data="couponData"
65
+                      :data="cardOrderData"
66 66
                       tooltip-effect="dark"
67 67
                       height="354"
68 68
                       style="width: 100%;border-radius: 8px;">
@@ -74,18 +74,22 @@ name: "新人体验券"
74 74
 status: 2
75 75
 type: "全额券" -->
76 76
 
77
-              <el-table-column prop="name"
78
-                               label="卡卷名称"
79
-                               width="200"></el-table-column>
80
-              <el-table-column prop="type"
81
-                               label="卡卷类型"
82
-                               show-overflow-tooltip></el-table-column>
77
+              <el-table-column prop="id"
78
+                               label="订单编号">
79
+              </el-table-column>
80
+              <el-table-column prop="goods"
81
+                               label="商品名称"
82
+                               width="200">
83
+                <template slot-scope="scope">
84
+                  <div v-for="(val,index) in scope.row.goods"
85
+                       :key="index">
86
+                    <div>{{val.name}}</div>
87
+                  </div>
88
+                </template>
89
+                               
90
+              </el-table-column>
83 91
               <el-table-column prop="price"
84
-                               label="总价格"
85
-                               show-overflow-tooltip></el-table-column>
86
-              <el-table-column prop="create_time"
87
-                               label="到期时间"
88
-                               width="180"
92
+                               label="实付"
89 93
                                show-overflow-tooltip></el-table-column>
90 94
               <el-table-column prop="create_time"
91 95
                                label="创建时间"
@@ -95,9 +99,13 @@ type: "全额券" -->
95 99
                                label="状态"
96 100
                                show-overflow-tooltip>
97 101
                 <template slot-scope="scope">
98
-                  <div :class="'color'+scope.row.status">{{couponStatus[scope.row.status]}}</div>
102
+                  <div :class="'color'+scope.row.status">{{ cardOrderStatus[scope.row.status]}}</div>
99 103
                 </template>
100 104
               </el-table-column>
105
+              <el-table-column prop="create_time"
106
+                               label="下单时间"
107
+                               width="180"
108
+                               show-overflow-tooltip></el-table-column>
101 109
             </el-table>
102 110
 
103 111
             <div class="pagin">
@@ -167,6 +175,57 @@ status: 5 -->
167 175
             </div>
168 176
           </div>
169 177
         </el-tab-pane>
178
+        <el-tab-pane label="优惠券"
179
+                     name="fourth">
180
+          <div class="user-list">
181
+            <el-table ref="multipleTable"
182
+                      :data="couponData"
183
+                      tooltip-effect="dark"
184
+                      height="354"
185
+                      style="width: 100%;border-radius: 8px;">
186
+
187
+              <!-- create_time: "2022-03-10 10:39:19"
188
+ex_time: "2022.03.17 23:59"
189
+id: 2517
190
+name: "新人体验券"
191
+status: 2
192
+type: "全额券" -->
193
+
194
+              <el-table-column prop="name"
195
+                               label="卡卷名称"
196
+                               width="200"></el-table-column>
197
+              <el-table-column prop="type"
198
+                               label="卡卷类型"
199
+                               show-overflow-tooltip></el-table-column>
200
+              <el-table-column prop="price"
201
+                               label="总价格"
202
+                               show-overflow-tooltip></el-table-column>
203
+              <el-table-column prop="create_time"
204
+                               label="到期时间"
205
+                               width="180"
206
+                               show-overflow-tooltip></el-table-column>
207
+              <el-table-column prop="create_time"
208
+                               label="创建时间"
209
+                               width="180"
210
+                               show-overflow-tooltip></el-table-column>
211
+              <el-table-column prop="status"
212
+                               label="状态"
213
+                               show-overflow-tooltip>
214
+                <template slot-scope="scope">
215
+                  <div :class="'color'+scope.row.status">{{couponStatus[scope.row.status]}}</div>
216
+                </template>
217
+              </el-table-column>
218
+            </el-table>
219
+
220
+            <div class="pagin">
221
+              <el-pagination background
222
+                             layout="prev, pager, next"
223
+                             @current-change="handleCurrentChange"
224
+                             :current-page.sync="currentPage1"
225
+                             :total="total"></el-pagination>
226
+            </div>
227
+          </div>
228
+        </el-tab-pane>
170 229
       </el-tabs>
171 230
     </div>
172 231
   </div>
@@ -219,6 +278,13 @@ export default {
219 278
         "已结算",
220 279
         "已取消"
221 280
       ],
281
+      cardOrderStatus: [
282
+        // 状态:0已预约,未支付,1已支付,2/3已完成
283
+        '已预约,未支付',
284
+        '已支付',
285
+        '已完成',
286
+        '已完成'
287
+      ],
222 288
       couponStatus: [
223 289
         '待使用',
224 290
         '已使用',
@@ -234,6 +300,7 @@ export default {
234 300
       couponData: [],
235 301
       goodData: [],
236 302
       projectData: [],
303
+      cardOrderData: [],
237 304
       total: 100,
238 305
       limit: 10
239 306
     };
@@ -280,14 +347,30 @@ export default {
280 347
         this.total = res.data.total;
281 348
       });
282 349
     },
350
+
351
+    // 获取卡券订单
352
+    async getCardOrders () {
353
+      let params = {
354
+        page: this.currentPage1,
355
+        limit: this.limit,
356
+        id: this.id
357
+      };
358
+      let resp = await api.getCardOrders(params)
359
+      if (resp.code === 200) {
360
+        this.cardOrderData = resp.data.list
361
+        this.total = resp.data.total
362
+      }
363
+    },
283 364
     handleCurrentChange (val) {
284 365
       this.currentPage1 = val
285 366
       if (this.activeName == 'first') {
286 367
         this.getUserProject();
287 368
       } else if (this.activeName == 'second') {
288
-        this.getUserCoupon();
369
+        this.getCardOrders()
289 370
       } else if (this.activeName == 'third') {
290 371
         this.getUserGoods();
372
+      } else if (this.activeName == 'fourth') {
373
+        this.getUserCoupon();
291 374
       }
292 375
     },
293 376
     handleSelectionChange (row, column, event) {
@@ -305,9 +388,11 @@ export default {
305 388
       if (e.index == 0) {
306 389
         this.getUserProject();
307 390
       } else if (e.index == 1) {
308
-        this.getUserCoupon();
391
+        this.getCardOrders()
309 392
       } else if (e.index == 2) {
310 393
         this.getUserGoods();
394
+      } else if (e.index == 3) {
395
+        this.getUserCoupon();
311 396
       }
312 397
     }
313 398
   },
@@ -320,7 +405,7 @@ export default {
320 405
     if (this.activeName == 'first') {
321 406
       this.getUserProject();
322 407
     } else if (this.activeName == 'second') {
323
-      this.getUserCoupon();
408
+      this.getCardOrders()
324 409
     } else if (this.activeName == 'third') {
325 410
       this.getUserGoods();
326 411
     }

+ 10 - 0
src/server/home.js

@@ -181,4 +181,14 @@ export default class Home {
181 181
   static hasUnreadMessage () {
182 182
     return $http.get(url.hasUnreadMessage)
183 183
   }
184
+
185
+  // 更新用户信息
186
+  static updateUserProfile (params) {
187
+    return $http.post(url.updateUserProfile, params)
188
+  }
189
+
190
+  // 获取用户卡券订单
191
+  static getCardOrders (params) {
192
+    return $http.get(url.getCardOrders, params)
193
+  }
184 194
 }

+ 6 - 1
src/server/urls.js

@@ -110,6 +110,11 @@ export default {
110 110
   getMessageList: '/v2/pad/message/get_list',
111 111
 
112 112
   // 获取是否有未读消息
113
-  hasUnreadMessage: '/v2/pad/message/get_message'
113
+  hasUnreadMessage: '/v2/pad/message/get_message',
114 114
 
115
+  // 更新用户信息
116
+  updateUserProfile: '/v2/pad/user/update',
117
+
118
+  // 获取用户卡券订单
119
+  getCardOrders: '/v2/pad/user/order/coupon'
115 120
 }