xiaoe_mp_npm 0.5.42-test32 → 0.5.42-test34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- @import "..\\common\\css\\theme.wxss";
1
+ @import "..//common//css//theme.wxss";
2
2
 
3
3
  $deviceWidth: 750;
4
4
  @function vmin($rpx) {
@@ -361,10 +361,8 @@ $deviceWidth: 750;
361
361
  display: flex;
362
362
  justify-content: center;
363
363
  align-items: center;
364
- color: white;
365
364
  line-height: vmin(48);
366
365
  font-weight: 500;
367
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
368
366
  .load{
369
367
  width: vmin(24);
370
368
  height: vmin(24);
@@ -372,6 +370,14 @@ $deviceWidth: 750;
372
370
  margin-right: vmin(8);
373
371
  }
374
372
  }
373
+ .cancel-explain-bg {
374
+ background: #ffebef;
375
+ color: #ff2e57;
376
+ }
377
+ .explain-bg {
378
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
379
+ color: white;
380
+ }
375
381
  .no-stock-btn{
376
382
  font-size: vmin(24);
377
383
  border-radius: vmin(8);
@@ -146,7 +146,7 @@
146
146
  </block>
147
147
  <block wx:elif="{{!isManage && !isStudent}}">
148
148
  <view
149
- class="buy-btn-teacher"
149
+ class="buy-btn-teacher {{ sendingGoodId === goodsItem.id ? 'cancel-explain-bg' : 'explain-bg' }}"
150
150
  catchtap="sendGoodsCard"
151
151
  data-item="{{goodsItem}}"
152
152
  data-type="10"
@@ -103,6 +103,84 @@
103
103
  background: rgba(0, 0, 0, 0.25) !important;
104
104
  backdrop-filter: blur(3.2vmin);
105
105
  }
106
+ .goods-item .main-card .left .goods-explaining {
107
+ position: absolute;
108
+ bottom: 0;
109
+ left: 0;
110
+ display: flex;
111
+ justify-content: center;
112
+ align-items: center;
113
+ height: 5.33333vmin;
114
+ width: 29.9vmin;
115
+ border-bottom-right-radius: 2.13vmin;
116
+ border-bottom-left-radius: 2.13vmin;
117
+ }
118
+ .goods-item .main-card .left .goods-explaining::before {
119
+ content: '';
120
+ position: absolute;
121
+ background: rgba(0, 0, 0, 0.2);
122
+ backdrop-filter: blur(0.22rem);
123
+ left: 0;
124
+ bottom: 0;
125
+ width: 100%;
126
+ height: 5.33333vmin;
127
+ border-bottom-right-radius: 2.13vmin;
128
+ border-bottom-left-radius: 2.13vmin;
129
+ }
130
+ .goods-item .main-card .left .goods-explaining .loadingWrapper {
131
+ position: relative;
132
+ display: flex;
133
+ justify-content: center;
134
+ align-items: center;
135
+ height: 2.88vmin;
136
+ width: 4.8vmin;
137
+ background-repeat: no-repeat;
138
+ background-size: cover;
139
+ margin-right: 0.08rem;
140
+ }
141
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading {
142
+ background-color: white;
143
+ height: 2.88vmin;
144
+ width: 0.53333vmin;
145
+ border-radius: 1.06667vmin;
146
+ transform-origin: top;
147
+ transform: translateZ(0);
148
+ -webkit-transform: translateZ(0);
149
+ position: absolute;
150
+ bottom: 0;
151
+ }
152
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(1) {
153
+ left: 0;
154
+ animation: 0.9s ease-in-out 0.15s loading-run infinite;
155
+ }
156
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(2) {
157
+ left: 1.33333vmin;
158
+ animation: 0.9s ease-in-out 0.25s loading-run infinite;
159
+ }
160
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(3) {
161
+ left: 2.66667vmin;
162
+ animation: 0.9s ease-in-out 0.35s loading-run infinite;
163
+ }
164
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(4) {
165
+ left: 4vmin;
166
+ animation: 0.9s ease-in-out 0.45s loading-run infinite;
167
+ }
168
+ @keyframes loading-run {
169
+ 0%,
170
+ 40%,
171
+ 100% {
172
+ height: 1.44vmin;
173
+ }
174
+ 25% {
175
+ height: 2.88vmin;
176
+ }
177
+ }
178
+ .goods-item .main-card .left .goods-explaining .text {
179
+ font-size: 3.2vmin;
180
+ color: #ffffff;
181
+ position: relative;
182
+ margin-left: 1.06667vmin;
183
+ }
106
184
  .goods-item .main-card .left .is-over {
107
185
  border-radius: 1.42267vmin 1.42267vmin 0 0;
108
186
  position: absolute;
@@ -307,10 +385,8 @@
307
385
  display: flex;
308
386
  justify-content: center;
309
387
  align-items: center;
310
- color: white;
311
388
  line-height: 6.4vmin;
312
389
  font-weight: 500;
313
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
314
390
  }
315
391
  .goods-item .main-card .right .line-three .buy-btn-teacher .load {
316
392
  width: 3.2vmin;
@@ -318,6 +394,14 @@
318
394
  animation: turn 1s linear infinite;
319
395
  margin-right: 1.06667vmin;
320
396
  }
397
+ .goods-item .main-card .right .line-three .cancel-explain-bg {
398
+ background: #ffebef;
399
+ color: #ff2e57;
400
+ }
401
+ .goods-item .main-card .right .line-three .explain-bg {
402
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
403
+ color: white;
404
+ }
321
405
  .goods-item .main-card .right .line-three .no-stock-btn {
322
406
  font-size: 3.2vmin;
323
407
  border-radius: 1.06667vmin;
@@ -475,6 +559,84 @@
475
559
  background: rgba(0, 0, 0, 0.25) !important;
476
560
  backdrop-filter: blur(1.5625vmin);
477
561
  }
562
+ .goods-item .main-card .left .goods-explaining {
563
+ position: absolute;
564
+ bottom: 0;
565
+ left: 0;
566
+ display: flex;
567
+ justify-content: center;
568
+ align-items: center;
569
+ height: 2.60417vmin;
570
+ width: 29.9vmin;
571
+ border-bottom-right-radius: 2.13vmin;
572
+ border-bottom-left-radius: 2.13vmin;
573
+ }
574
+ .goods-item .main-card .left .goods-explaining::before {
575
+ content: '';
576
+ position: absolute;
577
+ background: rgba(0, 0, 0, 0.2);
578
+ backdrop-filter: blur(0.22rem);
579
+ left: 0;
580
+ bottom: 0;
581
+ width: 100%;
582
+ height: 2.60417vmin;
583
+ border-bottom-right-radius: 2.13vmin;
584
+ border-bottom-left-radius: 2.13vmin;
585
+ }
586
+ .goods-item .main-card .left .goods-explaining .loadingWrapper {
587
+ position: relative;
588
+ display: flex;
589
+ justify-content: center;
590
+ align-items: center;
591
+ height: 1.40625vmin;
592
+ width: 2.34375vmin;
593
+ background-repeat: no-repeat;
594
+ background-size: cover;
595
+ margin-right: 0.08rem;
596
+ }
597
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading {
598
+ background-color: white;
599
+ height: 1.40625vmin;
600
+ width: 0.26042vmin;
601
+ border-radius: 0.52083vmin;
602
+ transform-origin: top;
603
+ transform: translateZ(0);
604
+ -webkit-transform: translateZ(0);
605
+ position: absolute;
606
+ bottom: 0;
607
+ }
608
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(1) {
609
+ left: 0;
610
+ animation: 0.9s ease-in-out 0.15s loading-run infinite;
611
+ }
612
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(2) {
613
+ left: 0.65104vmin;
614
+ animation: 0.9s ease-in-out 0.25s loading-run infinite;
615
+ }
616
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(3) {
617
+ left: 1.30208vmin;
618
+ animation: 0.9s ease-in-out 0.35s loading-run infinite;
619
+ }
620
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(4) {
621
+ left: 1.95312vmin;
622
+ animation: 0.9s ease-in-out 0.45s loading-run infinite;
623
+ }
624
+ @keyframes loading-run {
625
+ 0%,
626
+ 40%,
627
+ 100% {
628
+ height: 0.70312vmin;
629
+ }
630
+ 25% {
631
+ height: 1.40625vmin;
632
+ }
633
+ }
634
+ .goods-item .main-card .left .goods-explaining .text {
635
+ font-size: 1.5625vmin;
636
+ color: #ffffff;
637
+ position: relative;
638
+ margin-left: 0.52083vmin;
639
+ }
478
640
  .goods-item .main-card .left .is-over {
479
641
  border-radius: 0.69466vmin 0.69466vmin 0 0;
480
642
  position: absolute;
@@ -553,6 +715,21 @@
553
715
  justify-content: space-between;
554
716
  font-size: 1.30208vmin;
555
717
  }
718
+ .goods-item .main-card .right .order .order-left {
719
+ display: flex;
720
+ flex-direction: row;
721
+ }
722
+ .goods-item .main-card .right .order .order-left .distribution {
723
+ background-color: #f5f5f5;
724
+ color: #999999;
725
+ border-radius: 0.26042vmin;
726
+ padding: 0.26042vmin 0.52083vmin;
727
+ font-weight: 400;
728
+ font-family: "PingFang SC";
729
+ text-align: center;
730
+ line-height: 1.5625vmin;
731
+ height: 1.5625vmin;
732
+ }
556
733
  .goods-item .main-card .right .order .order-left .preferential-price {
557
734
  color: #FF2E57;
558
735
  background: #FFEBEF;
@@ -664,10 +841,8 @@
664
841
  display: flex;
665
842
  justify-content: center;
666
843
  align-items: center;
667
- color: white;
668
844
  line-height: 3.125vmin;
669
845
  font-weight: 500;
670
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
671
846
  }
672
847
  .goods-item .main-card .right .line-three .buy-btn-teacher .load {
673
848
  width: 1.5625vmin;
@@ -675,6 +850,14 @@
675
850
  animation: turn 1s linear infinite;
676
851
  margin-right: 0.52083vmin;
677
852
  }
853
+ .goods-item .main-card .right .line-three .cancel-explain-bg {
854
+ background: #ffebef;
855
+ color: #ff2e57;
856
+ }
857
+ .goods-item .main-card .right .line-three .explain-bg {
858
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
859
+ color: white;
860
+ }
678
861
  .goods-item .main-card .right .line-three .no-stock-btn {
679
862
  font-size: 1.5625vmin;
680
863
  border-radius: 0.52083vmin;
@@ -833,6 +1016,84 @@
833
1016
  background: rgba(0, 0, 0, 0.25) !important;
834
1017
  backdrop-filter: blur(1.90476vmin);
835
1018
  }
1019
+ .goods-item .main-card .left .goods-explaining {
1020
+ position: absolute;
1021
+ bottom: 0;
1022
+ left: 0;
1023
+ display: flex;
1024
+ justify-content: center;
1025
+ align-items: center;
1026
+ height: 3.1746vmin;
1027
+ width: 29.9vmin;
1028
+ border-bottom-right-radius: 2.13vmin;
1029
+ border-bottom-left-radius: 2.13vmin;
1030
+ }
1031
+ .goods-item .main-card .left .goods-explaining::before {
1032
+ content: '';
1033
+ position: absolute;
1034
+ background: rgba(0, 0, 0, 0.2);
1035
+ backdrop-filter: blur(0.22rem);
1036
+ left: 0;
1037
+ bottom: 0;
1038
+ width: 100%;
1039
+ height: 3.1746vmin;
1040
+ border-bottom-right-radius: 2.13vmin;
1041
+ border-bottom-left-radius: 2.13vmin;
1042
+ }
1043
+ .goods-item .main-card .left .goods-explaining .loadingWrapper {
1044
+ position: relative;
1045
+ display: flex;
1046
+ justify-content: center;
1047
+ align-items: center;
1048
+ height: 1.71429vmin;
1049
+ width: 2.85714vmin;
1050
+ background-repeat: no-repeat;
1051
+ background-size: cover;
1052
+ margin-right: 0.08rem;
1053
+ }
1054
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading {
1055
+ background-color: white;
1056
+ height: 1.71429vmin;
1057
+ width: 0.31746vmin;
1058
+ border-radius: 0.63492vmin;
1059
+ transform-origin: top;
1060
+ transform: translateZ(0);
1061
+ -webkit-transform: translateZ(0);
1062
+ position: absolute;
1063
+ bottom: 0;
1064
+ }
1065
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(1) {
1066
+ left: 0;
1067
+ animation: 0.9s ease-in-out 0.15s loading-run infinite;
1068
+ }
1069
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(2) {
1070
+ left: 0.79365vmin;
1071
+ animation: 0.9s ease-in-out 0.25s loading-run infinite;
1072
+ }
1073
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(3) {
1074
+ left: 1.5873vmin;
1075
+ animation: 0.9s ease-in-out 0.35s loading-run infinite;
1076
+ }
1077
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(4) {
1078
+ left: 2.38095vmin;
1079
+ animation: 0.9s ease-in-out 0.45s loading-run infinite;
1080
+ }
1081
+ @keyframes loading-run {
1082
+ 0%,
1083
+ 40%,
1084
+ 100% {
1085
+ height: 0.85714vmin;
1086
+ }
1087
+ 25% {
1088
+ height: 1.71429vmin;
1089
+ }
1090
+ }
1091
+ .goods-item .main-card .left .goods-explaining .text {
1092
+ font-size: 1.90476vmin;
1093
+ color: #ffffff;
1094
+ position: relative;
1095
+ margin-left: 0.63492vmin;
1096
+ }
836
1097
  .goods-item .main-card .left .is-over {
837
1098
  border-radius: 0.84683vmin 0.84683vmin 0 0;
838
1099
  position: absolute;
@@ -911,6 +1172,21 @@
911
1172
  justify-content: space-between;
912
1173
  font-size: 1.5873vmin;
913
1174
  }
1175
+ .goods-item .main-card .right .order .order-left {
1176
+ display: flex;
1177
+ flex-direction: row;
1178
+ }
1179
+ .goods-item .main-card .right .order .order-left .distribution {
1180
+ background-color: #f5f5f5;
1181
+ color: #999999;
1182
+ border-radius: 0.31746vmin;
1183
+ padding: 0.31746vmin 0.63492vmin;
1184
+ font-weight: 400;
1185
+ font-family: "PingFang SC";
1186
+ text-align: center;
1187
+ line-height: 1.90476vmin;
1188
+ height: 1.90476vmin;
1189
+ }
914
1190
  .goods-item .main-card .right .order .order-left .preferential-price {
915
1191
  color: #FF2E57;
916
1192
  background: #FFEBEF;
@@ -1022,10 +1298,8 @@
1022
1298
  display: flex;
1023
1299
  justify-content: center;
1024
1300
  align-items: center;
1025
- color: white;
1026
1301
  line-height: 3.80952vmin;
1027
1302
  font-weight: 500;
1028
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
1029
1303
  }
1030
1304
  .goods-item .main-card .right .line-three .buy-btn-teacher .load {
1031
1305
  width: 1.90476vmin;
@@ -1033,6 +1307,14 @@
1033
1307
  animation: turn 1s linear infinite;
1034
1308
  margin-right: 0.63492vmin;
1035
1309
  }
1310
+ .goods-item .main-card .right .line-three .cancel-explain-bg {
1311
+ background: #ffebef;
1312
+ color: #ff2e57;
1313
+ }
1314
+ .goods-item .main-card .right .line-three .explain-bg {
1315
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
1316
+ color: white;
1317
+ }
1036
1318
  .goods-item .main-card .right .line-three .no-stock-btn {
1037
1319
  font-size: 1.90476vmin;
1038
1320
  border-radius: 0.63492vmin;
@@ -1191,6 +1473,84 @@
1191
1473
  background: rgba(0, 0, 0, 0.25) !important;
1192
1474
  backdrop-filter: blur(1.5625vmin);
1193
1475
  }
1476
+ .goods-item .main-card .left .goods-explaining {
1477
+ position: absolute;
1478
+ bottom: 0;
1479
+ left: 0;
1480
+ display: flex;
1481
+ justify-content: center;
1482
+ align-items: center;
1483
+ height: 2.60417vmin;
1484
+ width: 29.9vmin;
1485
+ border-bottom-right-radius: 2.13vmin;
1486
+ border-bottom-left-radius: 2.13vmin;
1487
+ }
1488
+ .goods-item .main-card .left .goods-explaining::before {
1489
+ content: '';
1490
+ position: absolute;
1491
+ background: rgba(0, 0, 0, 0.2);
1492
+ backdrop-filter: blur(0.22rem);
1493
+ left: 0;
1494
+ bottom: 0;
1495
+ width: 100%;
1496
+ height: 2.60417vmin;
1497
+ border-bottom-right-radius: 2.13vmin;
1498
+ border-bottom-left-radius: 2.13vmin;
1499
+ }
1500
+ .goods-item .main-card .left .goods-explaining .loadingWrapper {
1501
+ position: relative;
1502
+ display: flex;
1503
+ justify-content: center;
1504
+ align-items: center;
1505
+ height: 1.40625vmin;
1506
+ width: 2.34375vmin;
1507
+ background-repeat: no-repeat;
1508
+ background-size: cover;
1509
+ margin-right: 0.08rem;
1510
+ }
1511
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading {
1512
+ background-color: white;
1513
+ height: 1.40625vmin;
1514
+ width: 0.26042vmin;
1515
+ border-radius: 0.52083vmin;
1516
+ transform-origin: top;
1517
+ transform: translateZ(0);
1518
+ -webkit-transform: translateZ(0);
1519
+ position: absolute;
1520
+ bottom: 0;
1521
+ }
1522
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(1) {
1523
+ left: 0;
1524
+ animation: 0.9s ease-in-out 0.15s loading-run infinite;
1525
+ }
1526
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(2) {
1527
+ left: 0.65104vmin;
1528
+ animation: 0.9s ease-in-out 0.25s loading-run infinite;
1529
+ }
1530
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(3) {
1531
+ left: 1.30208vmin;
1532
+ animation: 0.9s ease-in-out 0.35s loading-run infinite;
1533
+ }
1534
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(4) {
1535
+ left: 1.95312vmin;
1536
+ animation: 0.9s ease-in-out 0.45s loading-run infinite;
1537
+ }
1538
+ @keyframes loading-run {
1539
+ 0%,
1540
+ 40%,
1541
+ 100% {
1542
+ height: 0.70312vmin;
1543
+ }
1544
+ 25% {
1545
+ height: 1.40625vmin;
1546
+ }
1547
+ }
1548
+ .goods-item .main-card .left .goods-explaining .text {
1549
+ font-size: 1.5625vmin;
1550
+ color: #ffffff;
1551
+ position: relative;
1552
+ margin-left: 0.52083vmin;
1553
+ }
1194
1554
  .goods-item .main-card .left .is-over {
1195
1555
  border-radius: 0.69466vmin 0.69466vmin 0 0;
1196
1556
  position: absolute;
@@ -1269,6 +1629,21 @@
1269
1629
  justify-content: space-between;
1270
1630
  font-size: 1.30208vmin;
1271
1631
  }
1632
+ .goods-item .main-card .right .order .order-left {
1633
+ display: flex;
1634
+ flex-direction: row;
1635
+ }
1636
+ .goods-item .main-card .right .order .order-left .distribution {
1637
+ background-color: #f5f5f5;
1638
+ color: #999999;
1639
+ border-radius: 0.26042vmin;
1640
+ padding: 0.26042vmin 0.52083vmin;
1641
+ font-weight: 400;
1642
+ font-family: "PingFang SC";
1643
+ text-align: center;
1644
+ line-height: 1.5625vmin;
1645
+ height: 1.5625vmin;
1646
+ }
1272
1647
  .goods-item .main-card .right .order .order-left .preferential-price {
1273
1648
  color: #FF2E57;
1274
1649
  background: #FFEBEF;
@@ -1380,10 +1755,8 @@
1380
1755
  display: flex;
1381
1756
  justify-content: center;
1382
1757
  align-items: center;
1383
- color: white;
1384
1758
  line-height: 3.125vmin;
1385
1759
  font-weight: 500;
1386
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
1387
1760
  }
1388
1761
  .goods-item .main-card .right .line-three .buy-btn-teacher .load {
1389
1762
  width: 1.5625vmin;
@@ -1391,6 +1764,14 @@
1391
1764
  animation: turn 1s linear infinite;
1392
1765
  margin-right: 0.52083vmin;
1393
1766
  }
1767
+ .goods-item .main-card .right .line-three .cancel-explain-bg {
1768
+ background: #ffebef;
1769
+ color: #ff2e57;
1770
+ }
1771
+ .goods-item .main-card .right .line-three .explain-bg {
1772
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
1773
+ color: white;
1774
+ }
1394
1775
  .goods-item .main-card .right .line-three .no-stock-btn {
1395
1776
  font-size: 1.5625vmin;
1396
1777
  border-radius: 0.52083vmin;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "xiaoe_mp_npm",
3
- "version": "0.5.42-test32",
3
+ "version": "0.5.42-test34",
4
4
  "description": "",
5
5
  "main": "miniprogram_dist/index.js",
6
6
  "scripts": {
@@ -1,4 +1,4 @@
1
- @import "..\\common\\css\\theme.wxss";
1
+ @import "..//common//css//theme.wxss";
2
2
 
3
3
  $deviceWidth: 750;
4
4
  @function vmin($rpx) {
@@ -361,10 +361,8 @@ $deviceWidth: 750;
361
361
  display: flex;
362
362
  justify-content: center;
363
363
  align-items: center;
364
- color: white;
365
364
  line-height: vmin(48);
366
365
  font-weight: 500;
367
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
368
366
  .load{
369
367
  width: vmin(24);
370
368
  height: vmin(24);
@@ -372,6 +370,14 @@ $deviceWidth: 750;
372
370
  margin-right: vmin(8);
373
371
  }
374
372
  }
373
+ .cancel-explain-bg {
374
+ background: #ffebef;
375
+ color: #ff2e57;
376
+ }
377
+ .explain-bg {
378
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
379
+ color: white;
380
+ }
375
381
  .no-stock-btn{
376
382
  font-size: vmin(24);
377
383
  border-radius: vmin(8);
@@ -146,7 +146,7 @@
146
146
  </block>
147
147
  <block wx:elif="{{!isManage && !isStudent}}">
148
148
  <view
149
- class="buy-btn-teacher"
149
+ class="buy-btn-teacher {{ sendingGoodId === goodsItem.id ? 'cancel-explain-bg' : 'explain-bg' }}"
150
150
  catchtap="sendGoodsCard"
151
151
  data-item="{{goodsItem}}"
152
152
  data-type="10"
@@ -118,6 +118,94 @@
118
118
  backdrop-filter: blur(3.2vmin);
119
119
  }
120
120
 
121
+ .goods-item .main-card .left .goods-explaining {
122
+ position: absolute;
123
+ bottom: 0;
124
+ left: 0;
125
+ display: flex;
126
+ justify-content: center;
127
+ align-items: center;
128
+ height: 5.33333vmin;
129
+ width: 29.9vmin;
130
+ border-bottom-right-radius: 2.13vmin;
131
+ border-bottom-left-radius: 2.13vmin;
132
+ }
133
+
134
+ .goods-item .main-card .left .goods-explaining::before {
135
+ content: '';
136
+ position: absolute;
137
+ background: rgba(0, 0, 0, 0.2);
138
+ backdrop-filter: blur(0.22rem);
139
+ left: 0;
140
+ bottom: 0;
141
+ width: 100%;
142
+ height: 5.33333vmin;
143
+ border-bottom-right-radius: 2.13vmin;
144
+ border-bottom-left-radius: 2.13vmin;
145
+ }
146
+
147
+ .goods-item .main-card .left .goods-explaining .loadingWrapper {
148
+ position: relative;
149
+ display: flex;
150
+ justify-content: center;
151
+ align-items: center;
152
+ height: 2.88vmin;
153
+ width: 4.8vmin;
154
+ background-repeat: no-repeat;
155
+ background-size: cover;
156
+ margin-right: 0.08rem;
157
+ }
158
+
159
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading {
160
+ background-color: white;
161
+ height: 2.88vmin;
162
+ width: 0.53333vmin;
163
+ border-radius: 1.06667vmin;
164
+ transform-origin: top;
165
+ transform: translateZ(0);
166
+ -webkit-transform: translateZ(0);
167
+ position: absolute;
168
+ bottom: 0;
169
+ }
170
+
171
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(1) {
172
+ left: 0;
173
+ animation: 0.9s ease-in-out 0.15s loading-run infinite;
174
+ }
175
+
176
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(2) {
177
+ left: 1.33333vmin;
178
+ animation: 0.9s ease-in-out 0.25s loading-run infinite;
179
+ }
180
+
181
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(3) {
182
+ left: 2.66667vmin;
183
+ animation: 0.9s ease-in-out 0.35s loading-run infinite;
184
+ }
185
+
186
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(4) {
187
+ left: 4vmin;
188
+ animation: 0.9s ease-in-out 0.45s loading-run infinite;
189
+ }
190
+
191
+ @keyframes loading-run {
192
+ 0%,
193
+ 40%,
194
+ 100% {
195
+ height: 1.44vmin;
196
+ }
197
+ 25% {
198
+ height: 2.88vmin;
199
+ }
200
+ }
201
+
202
+ .goods-item .main-card .left .goods-explaining .text {
203
+ font-size: 3.2vmin;
204
+ color: #ffffff;
205
+ position: relative;
206
+ margin-left: 1.06667vmin;
207
+ }
208
+
121
209
  .goods-item .main-card .left .is-over {
122
210
  border-radius: 1.42267vmin 1.42267vmin 0 0;
123
211
  position: absolute;
@@ -220,7 +308,7 @@
220
308
  font-family: "PingFang SC";
221
309
  text-align: center;
222
310
  line-height: 3.2vmin;
223
- height: 3.2vmin
311
+ height: 3.2vmin;
224
312
  }
225
313
 
226
314
  .goods-item .main-card .right .order .order-left .preferential-price {
@@ -349,10 +437,8 @@
349
437
  display: flex;
350
438
  justify-content: center;
351
439
  align-items: center;
352
- color: white;
353
440
  line-height: 6.4vmin;
354
441
  font-weight: 500;
355
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
356
442
  }
357
443
 
358
444
  .goods-item .main-card .right .line-three .buy-btn-teacher .load {
@@ -362,6 +448,16 @@
362
448
  margin-right: 1.06667vmin;
363
449
  }
364
450
 
451
+ .goods-item .main-card .right .line-three .cancel-explain-bg {
452
+ background: #ffebef;
453
+ color: #ff2e57;
454
+ }
455
+
456
+ .goods-item .main-card .right .line-three .explain-bg {
457
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
458
+ color: white;
459
+ }
460
+
365
461
  .goods-item .main-card .right .line-three .no-stock-btn {
366
462
  font-size: 3.2vmin;
367
463
  border-radius: 1.06667vmin;
@@ -530,6 +626,84 @@
530
626
  background: rgba(0, 0, 0, 0.25) !important;
531
627
  backdrop-filter: blur(1.5625vmin);
532
628
  }
629
+ .goods-item .main-card .left .goods-explaining {
630
+ position: absolute;
631
+ bottom: 0;
632
+ left: 0;
633
+ display: flex;
634
+ justify-content: center;
635
+ align-items: center;
636
+ height: 2.60417vmin;
637
+ width: 29.9vmin;
638
+ border-bottom-right-radius: 2.13vmin;
639
+ border-bottom-left-radius: 2.13vmin;
640
+ }
641
+ .goods-item .main-card .left .goods-explaining::before {
642
+ content: '';
643
+ position: absolute;
644
+ background: rgba(0, 0, 0, 0.2);
645
+ backdrop-filter: blur(0.22rem);
646
+ left: 0;
647
+ bottom: 0;
648
+ width: 100%;
649
+ height: 2.60417vmin;
650
+ border-bottom-right-radius: 2.13vmin;
651
+ border-bottom-left-radius: 2.13vmin;
652
+ }
653
+ .goods-item .main-card .left .goods-explaining .loadingWrapper {
654
+ position: relative;
655
+ display: flex;
656
+ justify-content: center;
657
+ align-items: center;
658
+ height: 1.40625vmin;
659
+ width: 2.34375vmin;
660
+ background-repeat: no-repeat;
661
+ background-size: cover;
662
+ margin-right: 0.08rem;
663
+ }
664
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading {
665
+ background-color: white;
666
+ height: 1.40625vmin;
667
+ width: 0.26042vmin;
668
+ border-radius: 0.52083vmin;
669
+ transform-origin: top;
670
+ transform: translateZ(0);
671
+ -webkit-transform: translateZ(0);
672
+ position: absolute;
673
+ bottom: 0;
674
+ }
675
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(1) {
676
+ left: 0;
677
+ animation: 0.9s ease-in-out 0.15s loading-run infinite;
678
+ }
679
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(2) {
680
+ left: 0.65104vmin;
681
+ animation: 0.9s ease-in-out 0.25s loading-run infinite;
682
+ }
683
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(3) {
684
+ left: 1.30208vmin;
685
+ animation: 0.9s ease-in-out 0.35s loading-run infinite;
686
+ }
687
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(4) {
688
+ left: 1.95312vmin;
689
+ animation: 0.9s ease-in-out 0.45s loading-run infinite;
690
+ }
691
+ @keyframes loading-run {
692
+ 0%,
693
+ 40%,
694
+ 100% {
695
+ height: 0.70312vmin;
696
+ }
697
+ 25% {
698
+ height: 1.40625vmin;
699
+ }
700
+ }
701
+ .goods-item .main-card .left .goods-explaining .text {
702
+ font-size: 1.5625vmin;
703
+ color: #ffffff;
704
+ position: relative;
705
+ margin-left: 0.52083vmin;
706
+ }
533
707
  .goods-item .main-card .left .is-over {
534
708
  border-radius: 0.69466vmin 0.69466vmin 0 0;
535
709
  position: absolute;
@@ -609,6 +783,21 @@
609
783
  justify-content: space-between;
610
784
  font-size: 1.30208vmin;
611
785
  }
786
+ .goods-item .main-card .right .order .order-left {
787
+ display: flex;
788
+ flex-direction: row;
789
+ }
790
+ .goods-item .main-card .right .order .order-left .distribution {
791
+ background-color: #f5f5f5;
792
+ color: #999999;
793
+ border-radius: 0.26042vmin;
794
+ padding: 0.26042vmin 0.52083vmin;
795
+ font-weight: 400;
796
+ font-family: "PingFang SC";
797
+ text-align: center;
798
+ line-height: 1.5625vmin;
799
+ height: 1.5625vmin;
800
+ }
612
801
  .goods-item .main-card .right .order .order-left .preferential-price {
613
802
  color: #FF2E57;
614
803
  background: #FFEBEF;
@@ -720,10 +909,8 @@
720
909
  display: flex;
721
910
  justify-content: center;
722
911
  align-items: center;
723
- color: white;
724
912
  line-height: 3.125vmin;
725
913
  font-weight: 500;
726
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
727
914
  }
728
915
  .goods-item .main-card .right .line-three .buy-btn-teacher .load {
729
916
  width: 1.5625vmin;
@@ -731,6 +918,14 @@
731
918
  animation: turn 1s linear infinite;
732
919
  margin-right: 0.52083vmin;
733
920
  }
921
+ .goods-item .main-card .right .line-three .cancel-explain-bg {
922
+ background: #ffebef;
923
+ color: #ff2e57;
924
+ }
925
+ .goods-item .main-card .right .line-three .explain-bg {
926
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
927
+ color: white;
928
+ }
734
929
  .goods-item .main-card .right .line-three .no-stock-btn {
735
930
  font-size: 1.5625vmin;
736
931
  border-radius: 0.52083vmin;
@@ -890,6 +1085,84 @@
890
1085
  background: rgba(0, 0, 0, 0.25) !important;
891
1086
  backdrop-filter: blur(1.90476vmin);
892
1087
  }
1088
+ .goods-item .main-card .left .goods-explaining {
1089
+ position: absolute;
1090
+ bottom: 0;
1091
+ left: 0;
1092
+ display: flex;
1093
+ justify-content: center;
1094
+ align-items: center;
1095
+ height: 3.1746vmin;
1096
+ width: 29.9vmin;
1097
+ border-bottom-right-radius: 2.13vmin;
1098
+ border-bottom-left-radius: 2.13vmin;
1099
+ }
1100
+ .goods-item .main-card .left .goods-explaining::before {
1101
+ content: '';
1102
+ position: absolute;
1103
+ background: rgba(0, 0, 0, 0.2);
1104
+ backdrop-filter: blur(0.22rem);
1105
+ left: 0;
1106
+ bottom: 0;
1107
+ width: 100%;
1108
+ height: 3.1746vmin;
1109
+ border-bottom-right-radius: 2.13vmin;
1110
+ border-bottom-left-radius: 2.13vmin;
1111
+ }
1112
+ .goods-item .main-card .left .goods-explaining .loadingWrapper {
1113
+ position: relative;
1114
+ display: flex;
1115
+ justify-content: center;
1116
+ align-items: center;
1117
+ height: 1.71429vmin;
1118
+ width: 2.85714vmin;
1119
+ background-repeat: no-repeat;
1120
+ background-size: cover;
1121
+ margin-right: 0.08rem;
1122
+ }
1123
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading {
1124
+ background-color: white;
1125
+ height: 1.71429vmin;
1126
+ width: 0.31746vmin;
1127
+ border-radius: 0.63492vmin;
1128
+ transform-origin: top;
1129
+ transform: translateZ(0);
1130
+ -webkit-transform: translateZ(0);
1131
+ position: absolute;
1132
+ bottom: 0;
1133
+ }
1134
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(1) {
1135
+ left: 0;
1136
+ animation: 0.9s ease-in-out 0.15s loading-run infinite;
1137
+ }
1138
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(2) {
1139
+ left: 0.79365vmin;
1140
+ animation: 0.9s ease-in-out 0.25s loading-run infinite;
1141
+ }
1142
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(3) {
1143
+ left: 1.5873vmin;
1144
+ animation: 0.9s ease-in-out 0.35s loading-run infinite;
1145
+ }
1146
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(4) {
1147
+ left: 2.38095vmin;
1148
+ animation: 0.9s ease-in-out 0.45s loading-run infinite;
1149
+ }
1150
+ @keyframes loading-run {
1151
+ 0%,
1152
+ 40%,
1153
+ 100% {
1154
+ height: 0.85714vmin;
1155
+ }
1156
+ 25% {
1157
+ height: 1.71429vmin;
1158
+ }
1159
+ }
1160
+ .goods-item .main-card .left .goods-explaining .text {
1161
+ font-size: 1.90476vmin;
1162
+ color: #ffffff;
1163
+ position: relative;
1164
+ margin-left: 0.63492vmin;
1165
+ }
893
1166
  .goods-item .main-card .left .is-over {
894
1167
  border-radius: 0.84683vmin 0.84683vmin 0 0;
895
1168
  position: absolute;
@@ -969,6 +1242,21 @@
969
1242
  justify-content: space-between;
970
1243
  font-size: 1.5873vmin;
971
1244
  }
1245
+ .goods-item .main-card .right .order .order-left {
1246
+ display: flex;
1247
+ flex-direction: row;
1248
+ }
1249
+ .goods-item .main-card .right .order .order-left .distribution {
1250
+ background-color: #f5f5f5;
1251
+ color: #999999;
1252
+ border-radius: 0.31746vmin;
1253
+ padding: 0.31746vmin 0.63492vmin;
1254
+ font-weight: 400;
1255
+ font-family: "PingFang SC";
1256
+ text-align: center;
1257
+ line-height: 1.90476vmin;
1258
+ height: 1.90476vmin;
1259
+ }
972
1260
  .goods-item .main-card .right .order .order-left .preferential-price {
973
1261
  color: #FF2E57;
974
1262
  background: #FFEBEF;
@@ -1080,10 +1368,8 @@
1080
1368
  display: flex;
1081
1369
  justify-content: center;
1082
1370
  align-items: center;
1083
- color: white;
1084
1371
  line-height: 3.80952vmin;
1085
1372
  font-weight: 500;
1086
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
1087
1373
  }
1088
1374
  .goods-item .main-card .right .line-three .buy-btn-teacher .load {
1089
1375
  width: 1.90476vmin;
@@ -1091,6 +1377,14 @@
1091
1377
  animation: turn 1s linear infinite;
1092
1378
  margin-right: 0.63492vmin;
1093
1379
  }
1380
+ .goods-item .main-card .right .line-three .cancel-explain-bg {
1381
+ background: #ffebef;
1382
+ color: #ff2e57;
1383
+ }
1384
+ .goods-item .main-card .right .line-three .explain-bg {
1385
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
1386
+ color: white;
1387
+ }
1094
1388
  .goods-item .main-card .right .line-three .no-stock-btn {
1095
1389
  font-size: 1.90476vmin;
1096
1390
  border-radius: 0.63492vmin;
@@ -1250,6 +1544,84 @@
1250
1544
  background: rgba(0, 0, 0, 0.25) !important;
1251
1545
  backdrop-filter: blur(1.5625vmin);
1252
1546
  }
1547
+ .goods-item .main-card .left .goods-explaining {
1548
+ position: absolute;
1549
+ bottom: 0;
1550
+ left: 0;
1551
+ display: flex;
1552
+ justify-content: center;
1553
+ align-items: center;
1554
+ height: 2.60417vmin;
1555
+ width: 29.9vmin;
1556
+ border-bottom-right-radius: 2.13vmin;
1557
+ border-bottom-left-radius: 2.13vmin;
1558
+ }
1559
+ .goods-item .main-card .left .goods-explaining::before {
1560
+ content: '';
1561
+ position: absolute;
1562
+ background: rgba(0, 0, 0, 0.2);
1563
+ backdrop-filter: blur(0.22rem);
1564
+ left: 0;
1565
+ bottom: 0;
1566
+ width: 100%;
1567
+ height: 2.60417vmin;
1568
+ border-bottom-right-radius: 2.13vmin;
1569
+ border-bottom-left-radius: 2.13vmin;
1570
+ }
1571
+ .goods-item .main-card .left .goods-explaining .loadingWrapper {
1572
+ position: relative;
1573
+ display: flex;
1574
+ justify-content: center;
1575
+ align-items: center;
1576
+ height: 1.40625vmin;
1577
+ width: 2.34375vmin;
1578
+ background-repeat: no-repeat;
1579
+ background-size: cover;
1580
+ margin-right: 0.08rem;
1581
+ }
1582
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading {
1583
+ background-color: white;
1584
+ height: 1.40625vmin;
1585
+ width: 0.26042vmin;
1586
+ border-radius: 0.52083vmin;
1587
+ transform-origin: top;
1588
+ transform: translateZ(0);
1589
+ -webkit-transform: translateZ(0);
1590
+ position: absolute;
1591
+ bottom: 0;
1592
+ }
1593
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(1) {
1594
+ left: 0;
1595
+ animation: 0.9s ease-in-out 0.15s loading-run infinite;
1596
+ }
1597
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(2) {
1598
+ left: 0.65104vmin;
1599
+ animation: 0.9s ease-in-out 0.25s loading-run infinite;
1600
+ }
1601
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(3) {
1602
+ left: 1.30208vmin;
1603
+ animation: 0.9s ease-in-out 0.35s loading-run infinite;
1604
+ }
1605
+ .goods-item .main-card .left .goods-explaining .loadingWrapper .loading:nth-child(4) {
1606
+ left: 1.95312vmin;
1607
+ animation: 0.9s ease-in-out 0.45s loading-run infinite;
1608
+ }
1609
+ @keyframes loading-run {
1610
+ 0%,
1611
+ 40%,
1612
+ 100% {
1613
+ height: 0.70312vmin;
1614
+ }
1615
+ 25% {
1616
+ height: 1.40625vmin;
1617
+ }
1618
+ }
1619
+ .goods-item .main-card .left .goods-explaining .text {
1620
+ font-size: 1.5625vmin;
1621
+ color: #ffffff;
1622
+ position: relative;
1623
+ margin-left: 0.52083vmin;
1624
+ }
1253
1625
  .goods-item .main-card .left .is-over {
1254
1626
  border-radius: 0.69466vmin 0.69466vmin 0 0;
1255
1627
  position: absolute;
@@ -1329,6 +1701,21 @@
1329
1701
  justify-content: space-between;
1330
1702
  font-size: 1.30208vmin;
1331
1703
  }
1704
+ .goods-item .main-card .right .order .order-left {
1705
+ display: flex;
1706
+ flex-direction: row;
1707
+ }
1708
+ .goods-item .main-card .right .order .order-left .distribution {
1709
+ background-color: #f5f5f5;
1710
+ color: #999999;
1711
+ border-radius: 0.26042vmin;
1712
+ padding: 0.26042vmin 0.52083vmin;
1713
+ font-weight: 400;
1714
+ font-family: "PingFang SC";
1715
+ text-align: center;
1716
+ line-height: 1.5625vmin;
1717
+ height: 1.5625vmin;
1718
+ }
1332
1719
  .goods-item .main-card .right .order .order-left .preferential-price {
1333
1720
  color: #FF2E57;
1334
1721
  background: #FFEBEF;
@@ -1440,10 +1827,8 @@
1440
1827
  display: flex;
1441
1828
  justify-content: center;
1442
1829
  align-items: center;
1443
- color: white;
1444
1830
  line-height: 3.125vmin;
1445
1831
  font-weight: 500;
1446
- background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
1447
1832
  }
1448
1833
  .goods-item .main-card .right .line-three .buy-btn-teacher .load {
1449
1834
  width: 1.5625vmin;
@@ -1451,6 +1836,14 @@
1451
1836
  animation: turn 1s linear infinite;
1452
1837
  margin-right: 0.52083vmin;
1453
1838
  }
1839
+ .goods-item .main-card .right .line-three .cancel-explain-bg {
1840
+ background: #ffebef;
1841
+ color: #ff2e57;
1842
+ }
1843
+ .goods-item .main-card .right .line-three .explain-bg {
1844
+ background: linear-gradient(270deg, #ff2e57 0%, #ff4d82 100%);
1845
+ color: white;
1846
+ }
1454
1847
  .goods-item .main-card .right .line-three .no-stock-btn {
1455
1848
  font-size: 1.5625vmin;
1456
1849
  border-radius: 0.52083vmin;