index.jsx 4.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. import { useState } from "react";
  2. import { Button, } from '@tarojs/components'
  3. import image from '@/assets/icons/ProCard/8kb.jpg'
  4. import food from '@/assets/icons/ProCard/food.png'
  5. import ProCard_hot from '@/assets/icons/ProCard/ProCard_hot.png'
  6. import Pay from '@/assets/icons/GuideCheck/Pay_logo.png'
  7. import './style.less'
  8. export default (props) => {
  9. return (
  10. <scroll-view scroll-y style='height: 90vh;' >
  11. <view className='TobePaid-box'>
  12. <view className='OrderNumber'>订单编号:ABC123456789</view>
  13. {/* 待支付 */}
  14. <view class='wrapper'>
  15. <view class='left-complete-one'>
  16. <image className='left-image-1' src={ProCard_hot}></image>
  17. <view className='left-viewText'>
  18. 返现¥16.00
  19. </view>
  20. <view className='title-image'>
  21. <image className='image-1' mode='scaleToFill' src={image}></image>
  22. <image className='image-2' src={food}></image>
  23. </view>
  24. <view className='title-content'>
  25. <view className='Pro-title'>
  26. <view className='title-text'>【大巴山火锅】 <text className='title-money-2' >数量:1张</text></view>
  27. </view>
  28. <text className='title-money' >¥6990元</text>
  29. <view className='title-time' >有效期:2021/06/21-2021/12/31</view>
  30. </view>
  31. </view>
  32. <view class='right-complete-two'>
  33. <view className='right-content'>
  34. <image className='right-image' src={Pay} />
  35. <view className='right-title'>支付</view>
  36. </view>
  37. </view>
  38. </view>
  39. {/* 待支付 */}
  40. <view className='OrderNumber'>订单编号:ABC123456789</view>
  41. <view class='wrapper'>
  42. <view class='left-complete-one'>
  43. <image className='left-image-1' src={ProCard_hot}></image>
  44. <view className='left-viewText'>
  45. 返现¥16.00
  46. </view>
  47. <view className='title-image'>
  48. <image className='image-1' mode='scaleToFill' src={image}></image>
  49. <image className='image-2' src={food}></image>
  50. </view>
  51. <view className='title-content'>
  52. <view className='Pro-title'>
  53. <view className='title-text'>【大巴山火锅】 <text className='title-money-2' >数量:1张</text></view>
  54. </view>
  55. <text className='title-money' >¥6990元</text>
  56. <view className='title-time' >有效期:2021/06/21-2021/12/31</view>
  57. </view>
  58. </view>
  59. <view class='right-complete-two'>
  60. <view className='right-content'>
  61. <image className='right-image' src={Pay} />
  62. <view className='right-title'>支付</view>
  63. </view>
  64. </view>
  65. </view>
  66. {/* 待支付 */}
  67. <view className='OrderNumber'>订单编号:ABC123456789</view>
  68. <view class='wrapper'>
  69. <view class='left-complete-one'>
  70. <image className='left-image-1' src={ProCard_hot}></image>
  71. <view className='left-viewText'>
  72. 返现¥16.00
  73. </view>
  74. <view className='title-image'>
  75. <image className='image-1' mode='scaleToFill' src={image}></image>
  76. <image className='image-2' src={food}></image>
  77. </view>
  78. <view className='title-content'>
  79. <view className='Pro-title'>
  80. <view className='title-text'>【大巴山火锅】 <text className='title-money-2' >数量:1张</text></view>
  81. </view>
  82. <text className='title-money' >¥6990元</text>
  83. <view className='title-time' >有效期:2021/06/21-2021/12/31</view>
  84. </view>
  85. </view>
  86. <view class='right-complete-two'>
  87. <view className='right-content'>
  88. <image className='right-image' src={Pay} />
  89. <view className='right-title'>支付</view>
  90. </view>
  91. </view>
  92. </view>
  93. <view className='foot'>
  94. 已经到底了~
  95. </view>
  96. <view className='button-info'>
  97. <Button className='button-box'>全部支付</Button>
  98. </view>
  99. </view>
  100. </scroll-view>
  101. )
  102. }