order.wxss 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
  1. /* 水平间距 */
  2. /* 水平间距 */
  3. .container.data-v-93207a4f {
  4. position: relative;
  5. display: flex;
  6. box-sizing: border-box;
  7. padding-top: 162rpx;
  8. height: 100%;
  9. color: #001713;
  10. background-color: #fff;
  11. overflow: hidden;
  12. }
  13. .container .title.data-v-93207a4f {
  14. position: absolute;
  15. left: 314rpx;
  16. font-size: 40rpx;
  17. }
  18. .container .content.data-v-93207a4f {
  19. box-sizing: border-box;
  20. padding: 30rpx;
  21. height: calc(100vh - 246rpx);
  22. color: #001713;
  23. overflow-y: auto;
  24. }
  25. .container .content .order_box.data-v-93207a4f {
  26. margin-bottom: 20rpx;
  27. box-sizing: border-box;
  28. padding: 40rpx 20rpx;
  29. box-shadow: 0px 3px 6px #ccc;
  30. /* 二维码弹框样式 */
  31. }
  32. .container .content .order_box .box_top.data-v-93207a4f {
  33. display: flex;
  34. align-items: center;
  35. justify-content: space-between;
  36. font-size: 28rpx;
  37. color: #ff8205;
  38. }
  39. .container .content .order_box .box_top .top_left.data-v-93207a4f {
  40. display: flex;
  41. align-items: center;
  42. }
  43. .container .content .order_box .box_top .top_left .left_img.data-v-93207a4f {
  44. margin-right: 12rpx;
  45. width: 32rpx;
  46. height: 32rpx;
  47. }
  48. .container .content .order_box .box_top .top_status.data-v-93207a4f {
  49. font-size: 32rpx;
  50. }
  51. .container .content .order_box .box_top .red.data-v-93207a4f {
  52. color: #dc2626;
  53. }
  54. .container .content .order_box .box_top .gray.data-v-93207a4f {
  55. color: #707070;
  56. }
  57. .container .content .order_box .box_center.data-v-93207a4f {
  58. display: flex;
  59. align-items: center;
  60. margin-top: 40rpx;
  61. font-weight: bold;
  62. }
  63. .container .content .order_box .box_center .center_img.data-v-93207a4f {
  64. width: 14rpx;
  65. height: 88rpx;
  66. }
  67. .container .content .order_box .box_center .center_text.data-v-93207a4f {
  68. margin-left: 16rpx;
  69. }
  70. .container .content .order_box .box_center .center_text .text_start.data-v-93207a4f {
  71. margin-top: -8rpx;
  72. width: 480rpx;
  73. text-overflow: ellipsis;
  74. white-space: nowrap;
  75. overflow: hidden;
  76. }
  77. .container .content .order_box .box_center .center_text .app.data-v-93207a4f {
  78. margin-top: 1px;
  79. }
  80. .container .content .order_box .box_center .center_text .text_end.data-v-93207a4f {
  81. margin-top: 30rpx;
  82. width: 480rpx;
  83. text-overflow: ellipsis;
  84. white-space: nowrap;
  85. overflow: hidden;
  86. }
  87. .container .content .order_box .box_center .center_price.data-v-93207a4f {
  88. margin-left: auto;
  89. font-size: 24rpx;
  90. color: #dc2626;
  91. }
  92. .container .content .order_box .box_center .center_price .text.data-v-93207a4f {
  93. font-size: 36rpx;
  94. }
  95. .container .content .order_box .box_bottom.data-v-93207a4f {
  96. display: flex;
  97. align-items: flex-end;
  98. justify-content: space-between;
  99. margin-top: 8rpx;
  100. font-size: 24rpx;
  101. color: #aba6a6;
  102. }
  103. .container .content .order_box .box_bottom .bottom_btns.data-v-93207a4f {
  104. display: flex;
  105. align-items: center;
  106. }
  107. .container .content .order_box .box_bottom .bottom_btns .btn_item.data-v-93207a4f {
  108. display: flex;
  109. align-items: center;
  110. justify-content: center;
  111. padding: 0 15rpx;
  112. margin-left: 10rpx;
  113. height: 50rpx;
  114. font-size: 24rpx;
  115. border-radius: 32rpx;
  116. border: 2rpx solid #aba6a6;
  117. }
  118. .container .content .order_box .box_bottom .bottom_btns .pay.data-v-93207a4f {
  119. color: #ff8205;
  120. border: 2rpx solid #ff8205;
  121. }
  122. .container .content .order_box .box_bottom .bottom_btns .hexiao.data-v-93207a4f {
  123. background-color: #FF8205;
  124. border: 2rpx solid #ff8205;
  125. color: #fff;
  126. }
  127. .container .content .order_box .box_bottom .bottom_btns .cancel.data-v-93207a4f {
  128. color: #fff;
  129. background-color: #ff8205;
  130. }
  131. .container .content .order_box .qr-dialog.data-v-93207a4f {
  132. position: fixed;
  133. top: 0;
  134. left: 0;
  135. width: 100%;
  136. height: 100%;
  137. background: rgba(0, 0, 0, 0.5);
  138. display: flex;
  139. justify-content: center;
  140. align-items: center;
  141. z-index: 999;
  142. }
  143. .container .content .order_box .dialog-content.data-v-93207a4f {
  144. width: 600rpx;
  145. background: #fff;
  146. border-radius: 16rpx;
  147. padding: 40rpx;
  148. text-align: center;
  149. }
  150. .container .content .order_box .qr-img.data-v-93207a4f {
  151. width: 400rpx;
  152. margin-bottom: 20rpx;
  153. }
  154. .container .content .order_box .dialog-tip.data-v-93207a4f {
  155. display: block;
  156. margin-bottom: 30rpx;
  157. color: #666;
  158. }
  159. .container .content .order_box .close-btn.data-v-93207a4f {
  160. background: #ff7a00;
  161. color: #fff;
  162. border-radius: 8rpx;
  163. }
  164. .pop_pay.data-v-93207a4f {
  165. height: 566rpx;
  166. color: #001713;
  167. font-size: 28rpx;
  168. }
  169. .pop_pay .pay_title.data-v-93207a4f {
  170. display: flex;
  171. align-items: center;
  172. justify-content: center;
  173. height: 80rpx;
  174. font-size: 32rpx;
  175. border-bottom: 18rpx solid #ff8205;
  176. }
  177. .pop_pay .pay_close.data-v-93207a4f {
  178. position: absolute;
  179. top: 24rpx;
  180. right: 42rpx;
  181. }
  182. .pop_pay .pay_list.data-v-93207a4f {
  183. box-sizing: border-box;
  184. padding: 55rpx 0;
  185. display: flex;
  186. flex-direction: column;
  187. justify-content: space-between;
  188. height: 265rpx;
  189. }
  190. .pop_pay .pay_list .list_item.data-v-93207a4f {
  191. display: flex;
  192. align-items: center;
  193. justify-content: space-between;
  194. box-sizing: border-box;
  195. padding: 0 32rpx 0 46rpx;
  196. }
  197. .pop_pay .pay_list .list_item .item_left.data-v-93207a4f {
  198. display: flex;
  199. align-items: center;
  200. }
  201. .pop_pay .pay_list .list_item .item_left .img.data-v-93207a4f {
  202. margin-right: 26rpx;
  203. width: 54rpx;
  204. height: 54rpx;
  205. }
  206. .pop_pay .pay_btn.data-v-93207a4f {
  207. display: flex;
  208. align-items: center;
  209. justify-content: center;
  210. margin: auto;
  211. width: 720rpx;
  212. height: 94rpx;
  213. font-size: 36rpx;
  214. color: #fff;
  215. border-radius: 50rpx;
  216. background-color: #ff8205;
  217. }