chooseCoupon.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <view class="coopon-pages">
  3. <couponTpl @checkOk="checkOk" :list="couponList" :showCheck="true"></couponTpl>
  4. <view class="fix-button" v-if="curCoupon">
  5. <view>
  6. <view>优惠:¥9.8</view>
  7. <view @click="comfirn">确认</view>
  8. </view>
  9. </view>
  10. </view>
  11. </template>
  12. <script>
  13. import couponTpl from '@/pages/coupon/couponTpl.vue'
  14. export default {
  15. components: {
  16. couponTpl
  17. },
  18. data() {
  19. return {
  20. curCoupon: null,
  21. couponList: []
  22. };
  23. },
  24. onLoad(opt) {
  25. this.couponList = JSON.parse(decodeURIComponent(opt.list))
  26. },
  27. methods:{
  28. checkOk(item){
  29. this.curCoupon = item
  30. },
  31. // 确认按钮
  32. comfirn(){
  33. uni.navigateBack()
  34. }
  35. }
  36. }
  37. </script>
  38. <style lang="scss">
  39. .coopon-pages{
  40. width: 100%;
  41. padding-bottom: 100rpx;
  42. .fix-button{
  43. width: 100%;
  44. position: fixed;
  45. bottom: 0;
  46. > view{
  47. display: flex;
  48. align-items: center;
  49. background: #333;
  50. >view{
  51. padding: 20rpx 30rpx;
  52. color: #fff;
  53. &:first-child{
  54. width: 70%;
  55. flex-grow: 1;
  56. }
  57. &:last-child{
  58. background:red;
  59. width: 30%;
  60. color: #fff;
  61. text-align: center;
  62. font-size: 36rpx;
  63. }
  64. }
  65. }
  66. }
  67. }
  68. </style>