浏览代码

BUG修复边框样式整理

seimin 3 年之前
父节点
当前提交
75073972a8

+ 2 - 2
components/seiminFooterBtn/seiminFooterBtn.vue

@@ -29,8 +29,8 @@
29 29
     height: 100rpx;
30 30
     z-index: 9;
31 31
     background-color: #fff;
32
-    border-top: 1px solid rgba(0, 0, 0, 0.1);
33 32
     padding: 0 25rpx;
33
+    @include border(top);
34 34
     @include flex(space-between, center);
35 35
 
36 36
     uni-button {
@@ -51,7 +51,7 @@
51 51
 
52 52
     .default {
53 53
       background-color: #fff;
54
-      border: 1px solid $defaultColor;
54
+      @include border($color:$defaultColor);
55 55
       color: $defaultColor;
56 56
     }
57 57
 

+ 1 - 1
components/seiminFooterNav/seiminFooterNav.vue

@@ -110,8 +110,8 @@
110 110
     height: 100rpx;
111 111
     z-index: 9;
112 112
     background-color: #fff;
113
-    border-top: 1px solid rgba(0, 0, 0, 0.1);
114 113
     padding: 0 60rpx;
114
+    @include border(top,rgba(0, 0, 0, 0.1));
115 115
     @include flex(space-between, center);
116 116
 
117 117
     .seiminFooterNav_item {

+ 17 - 7
components/seiminModel/seiminModel.vue

@@ -105,6 +105,16 @@
105 105
         evaluateTextArea: '',
106 106
       };
107 107
     },
108
+    onUnload() {
109
+      if (this.timerCloseTime) {
110
+        clearInterval(this.timerCloseTime);
111
+        this.timerCloseTime = null;
112
+      }
113
+      if (this.timer) {
114
+        clearInterval(this.timer);
115
+        this.timer = null;
116
+      }
117
+    },
108 118
     computed: {
109 119
       ...mapState('other', ["nurseDeptSwitchTip"]),
110 120
       ...mapState("login", ["loginInfo"]),
@@ -284,7 +294,7 @@
284 294
           flex: 1;
285 295
           background-color: #f9fafb;
286 296
           margin: 0 36rpx 25rpx;
287
-          border: 1px solid #e5e9ed;
297
+          @include border;
288 298
           color: #333;
289 299
           padding: 76rpx 24rpx;
290 300
           @include numbersAndLettersNoWrap;
@@ -312,8 +322,8 @@
312 322
               font-size: 28rpx;
313 323
               color: #666;
314 324
               line-height: 40rpx;
315
-              border-bottom: 2rpx solid #E5E9ED;
316 325
               padding: 24rpx;
326
+              @include border(bottom);
317 327
             }
318 328
 
319 329
             .urgent_textarea {
@@ -322,8 +332,8 @@
322 332
               min-height: 212rpx;
323 333
               background: #FFFFFF;
324 334
               border-radius: 2rpx;
325
-              border: 2rpx solid #E5E9ED;
326 335
               text-align: left;
336
+              @include border;
327 337
 
328 338
               ::v-deep .uni-textarea-textarea {
329 339
                 padding: 18rpx;
@@ -339,8 +349,8 @@
339 349
               font-size: 28rpx;
340 350
               color: #666;
341 351
               line-height: 40rpx;
342
-              border-bottom: 2rpx solid #E5E9ED;
343 352
               padding: 24rpx 0;
353
+              @include border(bottom);
344 354
             }
345 355
 
346 356
             .evaluate_list {
@@ -373,8 +383,8 @@
373 383
                   min-height: 212rpx;
374 384
                   background: #FFFFFF;
375 385
                   border-radius: 2rpx;
376
-                  border: 2rpx solid #E5E9ED;
377 386
                   text-align: left;
387
+                  @include border;
378 388
 
379 389
                   ::v-deep .uni-textarea-textarea {
380 390
                     padding: 18rpx;
@@ -386,15 +396,15 @@
386 396
         }
387 397
 
388 398
         .seiminModel_footer {
389
-          border-top: 1px solid #e5e5e5;
390 399
           height: 100rpx;
391 400
           color: #666;
401
+          @include border(top);
392 402
           @include flex(center, center);
393 403
 
394 404
           .seiminModel_footer__btn {
395 405
             height: 100%;
396
-            @include flex(center, center);
397 406
             position: relative;
407
+            @include flex(center, center);
398 408
 
399 409
             &::after {
400 410
               content: "";

+ 5 - 5
components/seiminPicker/seiminPicker.vue

@@ -114,18 +114,18 @@
114 114
   }
115 115
 
116 116
   .picker-header {
117
-    @include flex(center, center);
118 117
     padding: 20rpx;
119
-    border-bottom: 1px solid #E5E9ED;
120 118
     background-color: #fff;
119
+    @include flex(center, center);
120
+    @include border(bottom);
121 121
   }
122 122
 
123 123
   .picker-confirm {
124 124
     margin-top: 10rpx;
125
-    border-top: 1px solid #E5E9ED;
125
+    background-color: #fff;
126 126
     height: 90rpx;
127
+    @include border(top);
127 128
     @include flex(center, center);
128
-    background-color: #fff;
129 129
   }
130 130
 
131 131
   .packer-title {
@@ -142,7 +142,7 @@
142 142
   }
143 143
 
144 144
   .uni-picker-view-mask {
145
-    border-bottom: 1px solid #E5E9ED;
145
+    @include border(bottom);
146 146
   }
147 147
 
148 148
   .picker-item {

+ 7 - 0
pages.json

@@ -33,6 +33,13 @@
33 33
         "navigationBarBackgroundColor": "#2C2D31",
34 34
         "enablePullDownRefresh": true
35 35
       }
36
+    }, {
37
+      "path": "pages/orderDetail/orderDetail",
38
+      "style": {
39
+        "navigationBarTitleText": "工单详情",
40
+        "navigationBarBackgroundColor": "#2C2D31"
41
+      }
42
+
36 43
     }
37 44
   ],
38 45
   "globalStyle": {

+ 14 - 10
pages/index/index.vue

@@ -536,8 +536,8 @@
536 536
             font-size: 32rpx;
537 537
             width: 110rpx;
538 538
             text-align: center;
539
-            border-left: 2rpx solid #e5e9ed;
540 539
             padding: 6rpx 0;
540
+            @include border(left);
541 541
           }
542 542
         }
543 543
 
@@ -556,7 +556,7 @@
556 556
         height: 88rpx;
557 557
         margin-top: 24rpx;
558 558
         margin-bottom: 0;
559
-        border: 1px solid #e5e9ed;
559
+        @include border;
560 560
       }
561 561
 
562 562
       // 一键收标本
@@ -567,8 +567,8 @@
567 567
         margin-top: 8rpx;
568 568
         border-radius: 8rpx;
569 569
         // box-shadow: 0 0 7rpx 0 rgba(73, 184, 86, 0.09);
570
-        border: 1px solid #e5e9ed;
571 570
         position: relative;
571
+        @include border;
572 572
         @include flex(center, center);
573 573
         @include semicircle(#f9fafb);
574 574
 
@@ -577,9 +577,9 @@
577 577
           height: 48rpx;
578 578
           border-radius: 50%;
579 579
           background-color: rgba(57, 177, 153, 0.3);
580
-          border: 1px solid #39b199;
581 580
           font-size: 24rpx;
582 581
           color: #39b199;
582
+          @include border($color:#39b199);
583 583
           @include flex(center, center);
584 584
         }
585 585
 
@@ -598,8 +598,8 @@
598 598
 
599 599
           .collect_row {
600 600
             height: 88rpx;
601
+            @include border($directive:bottom,$style:dashed);
601 602
             @include flex(flex-start, center);
602
-            border-bottom: 1px dashed #e5e9ed;
603 603
 
604 604
             &:last-of-type {
605 605
               border-bottom: none;
@@ -616,6 +616,10 @@
616 616
           color: #fff;
617 617
           font-size: 32rpx;
618 618
           line-height: 88rpx;
619
+
620
+          &::after {
621
+            border: none;
622
+          }
619 623
         }
620 624
       }
621 625
 
@@ -627,16 +631,16 @@
627 631
         margin-top: 8rpx;
628 632
         border-radius: 8rpx;
629 633
         // box-shadow: 0 0 7rpx 0 rgba(73, 184, 86, 0.09);
630
-        border: 1px solid #e5e9ed;
631 634
         position: relative;
632 635
         padding: 0 15rpx;
633 636
         font-size: 32rpx;
637
+        @include border;
634 638
         @include semicircle(#f9fafb, 70rpx);
635 639
 
636 640
         .newOrders_header {
637 641
           height: 87rpx;
638 642
           padding: 0 27rpx;
639
-          border-bottom: 1px dashed #e5e9ed;
643
+          @include border($directive:bottom, $style:dashed);
640 644
           @include flex(space-between, center);
641 645
 
642 646
           .newOrders_header_title {
@@ -651,10 +655,10 @@
651 655
         .newOrders_item {
652 656
           height: 88rpx;
653 657
           padding: 0 27rpx;
654
-          border-bottom: 1px solid #e5e9ed;
655 658
           color: #333;
656 659
           font-size: 30rpx;
657 660
           position: relative;
661
+          @include border(bottom);
658 662
           @include flex(center, center);
659 663
 
660 664
           .ji,
@@ -698,16 +702,16 @@
698 702
         margin-top: 8rpx;
699 703
         border-radius: 8rpx;
700 704
         // box-shadow: 0 0 7rpx 0 rgba(73, 184, 86, 0.09);
701
-        border: 1px solid #e5e9ed;
702 705
         position: relative;
703 706
         padding: 0 15rpx;
704 707
         font-size: 32rpx;
708
+        @include border;
705 709
         @include semicircle(#f9fafb, 70rpx);
706 710
 
707 711
         .quick_other_header {
708 712
           height: 87rpx;
709 713
           padding: 0 27rpx;
710
-          border-bottom: 1px dashed #e5e9ed;
714
+          @include border($directive:bottom,$style:dashed);
711 715
           @include flex(space-between, center);
712 716
 
713 717
           .quick_other_header_title {

+ 1 - 1
pages/login/login.vue

@@ -176,7 +176,7 @@
176 176
 
177 177
 				.form_title {
178 178
 					@include flex(flex-start, center);
179
-					width: 140rpx;
179
+					width: 4em;
180 180
 
181 181
 					.placeholder {
182 182
 						display: inline-block;

+ 74 - 0
pages/orderDetail/orderDetail.vue

@@ -0,0 +1,74 @@
1
+<template>
2
+  <view class="orderDetail">
3
+    <!-- 头部 -->
4
+    <view class="orderDetail_header">
5
+      <view class="orderDetail_header_item">
6
+        工单信息
7
+      </view>
8
+      <view class="orderDetail_header_item">
9
+        流程信息
10
+      </view>
11
+      <view class="orderDetail_header_item">
12
+        业务信息
13
+      </view>
14
+    </view>
15
+  </view>
16
+</template>
17
+
18
+<script>
19
+  import {
20
+    reqFetchData,
21
+  } from "../../request/api.js";
22
+  export default {
23
+    data() {
24
+      return {
25
+        // 工单详情信息
26
+        orderInfo: {},
27
+      };
28
+    },
29
+    methods: {
30
+      init(queryParams) {
31
+        this.getData(queryParams);
32
+      },
33
+      //获取详情页数据
34
+      getData(queryParams) {
35
+        reqFetchData('api', 'workOrder', queryParams.id).then(res => {
36
+          if (res.status == 200) {
37
+            this.orderInfo = res.data;
38
+          } else {
39
+            this.$refs.seiminModel.show({
40
+              skin: 'toast',
41
+              icon: 'error',
42
+              content: '请求失败',
43
+            })
44
+          }
45
+        })
46
+      },
47
+    },
48
+    onLoad(queryParams) {
49
+      console.log(queryParams);
50
+      this.init(queryParams);
51
+    }
52
+  }
53
+</script>
54
+
55
+<style lang="scss" scoped>
56
+  .orderDetail {
57
+    padding-bottom: 108rpx;
58
+
59
+    .orderDetail_header {
60
+      height: 88rpx;
61
+      @include flex;
62
+
63
+      .orderDetail_header_item {
64
+        flex: 1;
65
+        @include border(right);
66
+        @include flex(center, center);
67
+
68
+        &.active {
69
+          color: $defaultColor;
70
+        }
71
+      }
72
+    }
73
+  }
74
+</style>

+ 16 - 9
pages/orderList/orderList.vue

@@ -13,7 +13,8 @@
13 13
     </view>
14 14
     <!-- 列表 -->
15 15
     <view class="orderList_list">
16
-      <view class="orderList_listItem" v-for="newOrder in newOrderList" :key="newOrder.id">
16
+      <view class="orderList_listItem" v-for="newOrder in newOrderList" :key="newOrder.id"
17
+        @click="toDetail(newOrder.id)">
17 18
         <image class="ji" src="../../static/imgs/icon_ji.png" mode="widthFix"
18 19
           v-if="newOrder.emergencyType && newOrder.emergencyType.value == 2"></image>
19 20
         <image class="jiaji" src="../../static/imgs/icon_jiaji.png" mode="widthFix"
@@ -150,6 +151,12 @@
150 151
     },
151 152
     methods: {
152 153
       ...mapActions("dictionary", ["vxDictionary"]),
154
+      // 前往工单详情
155
+      toDetail(id) {
156
+        uni.navigateTo({
157
+          url: `/pages/orderDetail/orderDetail?id=${id}`
158
+        })
159
+      },
153 160
       //评价
154 161
       showAppraise(id) {
155 162
         this.$refs.seiminModel.show({
@@ -570,18 +577,18 @@
570 577
     .orderList_header {
571 578
       height: 88rpx;
572 579
       background-color: #fff;
573
-      border-bottom: 1px solid #E5E9ED;
574 580
       position: fixed;
575 581
       left: 0;
576 582
       z-index: 99;
577 583
       width: 100%;
584
+      @include border(bottom);
578 585
       @include flex(center, center);
579 586
 
580 587
       .orderList_header_item {
581 588
         flex: 1;
582 589
         height: 100%;
583 590
         padding: 0 50rpx;
584
-        border-right: 1px solid #E5E9ED;
591
+        @include border(right);
585 592
         @include flex(space-between, center);
586 593
 
587 594
         &:last-of-type {
@@ -609,10 +616,10 @@
609 616
         background-color: #fff;
610 617
         margin-top: 8rpx;
611 618
         border-radius: 8rpx;
612
-        border: 2rpx solid #e5e9ed;
613 619
         position: relative;
614 620
         padding: 0 24rpx;
615 621
         font-size: 32rpx;
622
+        @include border;
616 623
         @include semicircle(#f9fafb, 82rpx);
617 624
         @include flex(flex-start, stretch, column);
618 625
 
@@ -626,7 +633,7 @@
626 633
 
627 634
         .orderList_listItem_header {
628 635
           height: 86rpx;
629
-          border-bottom: 2rpx dashed #e5e9ed;
636
+          @include border(bottom);
630 637
           @include flex(space-between, center);
631 638
 
632 639
           .orderList_listItem_header_title {
@@ -639,10 +646,10 @@
639 646
               height: 48rpx;
640 647
               border-radius: 50%;
641 648
               background-color: #F0F6ED;
642
-              border: 1px solid #39b199;
643 649
               font-size: 24rpx;
644 650
               color: #39b199;
645 651
               margin-right: 8rpx;
652
+              @include border($color:#39b199);
646 653
               @include flex(center, center);
647 654
             }
648 655
 
@@ -669,10 +676,10 @@
669 676
 
670 677
         .orderList_listItem_item {
671 678
           height: 88rpx;
672
-          border-bottom: 1px solid #e5e9ed;
673 679
           color: #333;
674 680
           font-size: 30rpx;
675 681
           flex: 1;
682
+          @include border(bottom);
676 683
           @include flex(flex-start, stretch, column);
677 684
 
678 685
           &:last-of-type {
@@ -714,9 +721,9 @@
714 721
                 position: absolute;
715 722
                 right: 0;
716 723
                 top: 0;
717
-                width: 2rpx;
724
+                width: 1px;
718 725
                 height: 100%;
719
-                border-right: 2rpx solid #fff;
726
+                @include border(right, #fff);
720 727
               }
721 728
 
722 729
               &:last-of-type::before {

+ 14 - 8
pages/quickCreateOrder/quickCreateOrder.vue

@@ -242,7 +242,7 @@
242 242
       },
243 243
       // 获取历史输入
244 244
       getRecentRemarks(res) {
245
-        if (res.state == 200) {
245
+        if (res.state == 200 || res.state == 201) {
246 246
           this.historyCustomRemarks = res.data || [];
247 247
         } else {
248 248
           this.$refs.seiminModel.show({
@@ -365,10 +365,16 @@
365 365
       selectDept(type) {
366 366
         this.selectdDeptType = type; //存储类型
367 367
         if (
368
-          this.dataObj.start.start.departmentStrategy == 201 ||
369
-          this.dataObj.start.start.departmentStrategy == 203 ||
370
-          this.dataObj.end.end.departmentStrategy == 201 ||
371
-          this.dataObj.end.end.departmentStrategy == 203) {
368
+          (this.dataObj.start.start.departmentStrategy == 201 ||
369
+            this.dataObj.start.start.departmentStrategy == 203) &&
370
+          type === 'start') {
371
+          //默认科室和固定科室不能选科室
372
+          return;
373
+        }
374
+        if (
375
+          (this.dataObj.end.end.departmentStrategy == 201 ||
376
+            this.dataObj.end.end.departmentStrategy == 203 &&
377
+            type === 'end')) {
372 378
           //默认科室和固定科室不能选科室
373 379
           return;
374 380
         }
@@ -429,8 +435,8 @@
429 435
       padding: 0 30rpx;
430 436
       height: 88rpx;
431 437
       font-size: 34rpx;
432
-      border-top: 1px solid #e5e5e5;
433 438
       background-color: #fff;
439
+      @include border(top);
434 440
       @include flex(space-between, center);
435 441
 
436 442
       .select_label {
@@ -456,9 +462,9 @@
456 462
     .remarks {
457 463
       min-height: 150rpx;
458 464
       background-color: #fff;
459
-      border-top: 1px solid #e5e5e5;
460
-      border-bottom: 1px solid #e5e5e5;
461 465
       padding: 22rpx 25rpx;
466
+      @include border(top);
467
+      @include border(bottom);
462 468
 
463 469
       .remarks_textarea {
464 470
         width: 100%;

+ 6 - 0
request/api.js

@@ -123,3 +123,9 @@ export const reqEvaluate = (id, postData) =>
123 123
     data: postData,
124 124
     method: 'POST'
125 125
   });
126
+
127
+// fetchData查询(通用)
128
+export const reqFetchData = (type, target, id) =>
129
+  request({
130
+    url: `/${type}/fetchData/${target}/${id}`,
131
+  });

+ 27 - 4
uni.scss

@@ -26,6 +26,29 @@ $textColorYellow: #F5A623;
26 26
   align-items: $alignItem;
27 27
   flex-direction: $flexDirection;
28 28
 }
29
+// 边框
30
+// $direction 方向
31
+@mixin border(
32
+  $directive: all,
33
+  $color:#E5E9ED,
34
+  $style:solid
35
+) {
36
+  @if $directive == top {
37
+      border-top: 1px $style $color;
38
+  }
39
+  @else if $directive == right {
40
+      border-right: 1px $style $color;
41
+  }
42
+  @else if $directive == bottom {
43
+      border-bottom: 1px $style $color;
44
+  }
45
+  @else if $directive == left {
46
+      border-left: 1px $style $color;
47
+  }
48
+  @else {
49
+      border: 1px $style $color;
50
+  }
51
+}
29 52
 // 按钮背景色
30 53
 @mixin btn_background {
31 54
   background-image: linear-gradient(90deg,#72c172,#3bb197);
@@ -55,10 +78,10 @@ $textColorYellow: #F5A623;
55 78
     height: 32rpx;
56 79
     border-radius: 0 16rpx 16rpx 0;
57 80
     background-color: $backgroundColor;
58
-    left: -1px;
81
+    left: -2rpx;
59 82
     top: $top;
60 83
     transform: translateY(-50%);
61
-    border: 1px solid #E5E9ED;
84
+    @include border;
62 85
     border-left: none;
63 86
   }
64 87
   
@@ -69,10 +92,10 @@ $textColorYellow: #F5A623;
69 92
     height: 32rpx;
70 93
     border-radius: 16rpx 0 0 16rpx;
71 94
     background-color: $backgroundColor;
72
-    right: -1px;
95
+    right: -2rpx;
73 96
     top: $top;
74 97
     transform: translateY(-50%);
75
-    border: 1px solid #E5E9ED;
98
+    @include border;
76 99
     border-right: none;
77 100
   } 
78 101
 }