学员端小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

94 lines
1.8 KiB

1 year ago
  1. <template>
  2. <view class="pageBgImg">
  3. <topNavbar title="支付订单"></topNavbar>
  4. <view class="pad">
  5. <view class="card">
  6. <view class="orderInfo">
  7. <view class="schoolName">翔力驾校</view>
  8. <view class="price">
  9. <text class="uint"></text>1000.13
  10. </view>
  11. <view class="num">交易单号65465879312</view>
  12. </view>
  13. </view>
  14. <view class="card">
  15. <view class="pay">
  16. <view class="h2">选择支付方式</view>
  17. <view class="row">
  18. <view class="wxIcon">
  19. <image src="@/static/images/index/wxicon.png" mode=""></image>
  20. </view>
  21. <view class="text">微信支付</view>
  22. <view class="icon">
  23. <u-icon name="arrow-right" size="14" color="#686B73" ></u-icon>
  24. </view>
  25. </view>
  26. </view>
  27. </view>
  28. <view class="btnBg">确认支付</view>
  29. </view>
  30. </view>
  31. </template>
  32. <script>
  33. </script>
  34. <style lang="scss" scoped>
  35. .card {
  36. width: 100%;
  37. margin-bottom: 20rpx;
  38. .orderInfo {
  39. text-align: center;
  40. display: flex;
  41. flex-direction: column;
  42. align-items: center;
  43. justify-content: center;
  44. height: 306rpx;
  45. .schoolName {
  46. font-size: 24rpx;
  47. color: #333;
  48. }
  49. .price {
  50. font-size: 72rpx;
  51. font-weight: 600;
  52. padding: 30rpx 0 30rpx 0;
  53. text.uint {
  54. font-size: 44rpx;
  55. font-weight: 600;
  56. }
  57. }
  58. .num {
  59. font-size: 24rpx;
  60. color: #ADADAD;
  61. }
  62. }
  63. }
  64. .pay {
  65. padding: 40rpx 48rpx;
  66. .h2 {
  67. font-size: 32rpx;
  68. font-weight: 500;
  69. margin-bottom: 24rpx;
  70. }
  71. .row {
  72. display: flex;
  73. justify-content: space-between;
  74. align-items: center;
  75. .wxIcon {
  76. width: 48rpx;
  77. height: 48rpx;
  78. }
  79. .text {
  80. margin-left: 20rpx;
  81. flex: 1;
  82. text-align: left;
  83. }
  84. }
  85. }
  86. .btnBg {
  87. margin: 100rpx auto;
  88. width: 396rpx;
  89. }
  90. </style>