index.vue 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <template>
  2. <view>
  3. <view v-show="showPop" class="confirmation-bar" :style="'width: '+width+';'">
  4. <view class="" style="height: 100%;">
  5. <slot></slot>
  6. </view>
  7. <view class="pop-btn" v-if="showBtn">
  8. <view class="pop-btn-cancal" @tap="closePop"><slot name="leftbtnname">取消</slot></view>
  9. <view class="pop-btn-submit" :style="'background-color:'+btnColor+';border:1rpx solid '+btnColor+';'" @tap="popSubmit"><slot name="rightbtnname">确认</slot></view>
  10. </view>
  11. </view>
  12. <!-- 遮罩层 -->
  13. <view v-show="showPop" @tap="closePop" class="mask"></view>
  14. </view>
  15. </template>
  16. <script>
  17. const app = getApp();
  18. const req = require("../../utils/request.js");
  19. export default {
  20. data() {
  21. return {
  22. bottomBlankHeignt: app.globalData.isIPhoneX ? 68 : 0
  23. };
  24. },
  25. components: {
  26. },
  27. props: {
  28. showPop: {
  29. type: Boolean,
  30. default: true
  31. },
  32. showBtn: {
  33. type: Boolean,
  34. default: true
  35. },
  36. title:{
  37. type: String,
  38. default:''
  39. },
  40. btnColor:{
  41. type: String,
  42. default:'#009AFF'
  43. },
  44. width:{
  45. type: String,
  46. default:'60%'
  47. }
  48. },
  49. watch: {
  50. },
  51. mounted() {
  52. },
  53. methods: {
  54. closePop(){
  55. this.$emit('closePop',false)
  56. },
  57. popSubmit(){
  58. this.$emit('popSubmit')
  59. }
  60. }
  61. };
  62. </script>
  63. <style>
  64. @import "./index.css";
  65. </style>