chooseCoupon.vue 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <view class="coopon-pages">
  3. <couponTpl @checkOk="checkOk" :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. };
  22. },
  23. methods:{
  24. checkOk(item){
  25. this.curCoupon = item
  26. },
  27. // 确认按钮
  28. comfirn(){
  29. uni.navigateBack()
  30. }
  31. }
  32. }
  33. </script>
  34. <style lang="scss">
  35. .coopon-pages{
  36. width: 100%;
  37. padding-bottom: 100rpx;
  38. .fix-button{
  39. width: 100%;
  40. position: fixed;
  41. bottom: 0;
  42. > view{
  43. display: flex;
  44. align-items: center;
  45. background: #333;
  46. >view{
  47. padding: 20rpx 30rpx;
  48. color: #fff;
  49. &:first-child{
  50. width: 70%;
  51. flex-grow: 1;
  52. }
  53. &:last-child{
  54. background:red;
  55. width: 30%;
  56. color: #fff;
  57. text-align: center;
  58. font-size: 36rpx;
  59. }
  60. }
  61. }
  62. }
  63. }
  64. </style>