u-bottom.vue 785 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. <template>
  2. <view class="bottom-wrap" :style="[{customStyle,'color': color || 'rgba(255, 255, 255, 0.5)'}]">
  3. <view class="bottom" :style="[customStyle]">
  4. <view class="bottom-p">如您有任何问题,欢迎拨打服务热线</view>
  5. <view class="bottom-p">400-5555-8888</view>
  6. </view>
  7. </view>
  8. </template>
  9. <script>
  10. export default {
  11. name:'u-bottom',
  12. props:{
  13. customStyle:{
  14. type: Object,
  15. default() {
  16. return {};
  17. }
  18. },
  19. color:{
  20. type: String,
  21. default: ''
  22. }
  23. },
  24. }
  25. </script>
  26. <style lang="scss" >
  27. .bottom-wrap{
  28. text-align: center;
  29. height: 200rpx;
  30. .bottom{
  31. position: fixed;
  32. left: 0;
  33. right: 0;
  34. bottom: 76rpx;
  35. font-size: 26rpx;
  36. line-height: 33rpx;
  37. .bottom-p + .bottom-p{
  38. margin-top: 10rpx;
  39. }
  40. }
  41. }
  42. </style>