svipDialog.vue 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <!-- 中弹窗 二行文字 -->
  2. <template>
  3. <uni-popup ref="svipPopup" :animation="false" :is-mask-click="false"
  4. mask-background-color="rgba(255, 255, 255, 0.6);">
  5. <view class="ezy-svip-dialog">
  6. <view class="tip-content-box">
  7. <!-- :class="'svip-img'+id" -->
  8. <icon class="svip-img svip-img1"></icon>
  9. <view class="tip-content">开通SVIP会员解锁学习关卡</view>
  10. <view class="tip-btn-box">
  11. <view class="not-confirm-btn" @click="handleClose"></view>
  12. <view class="confirm-btn" @click="confirmBtn"></view>
  13. </view>
  14. </view>
  15. </view>
  16. </uni-popup>
  17. </template>
  18. <script setup>
  19. import { ref } from 'vue';
  20. const props = defineProps({
  21. title: {
  22. type: String,
  23. default: '提示'
  24. },
  25. content: {
  26. type: String,
  27. require: true,
  28. default: ''
  29. },
  30. });
  31. const svipPopup = ref(null); // 索引
  32. const $emit = defineEmits(['confirm-btn'])
  33. // 打开弹窗
  34. function handleShow() {
  35. svipPopup.value.open();
  36. }
  37. // 取消
  38. function handleClose() {
  39. svipPopup.value.close();
  40. }
  41. // 确认
  42. function confirmBtn(){
  43. $emit('confirm-btn');
  44. svipPopup.value.close();
  45. }
  46. defineExpose({
  47. handleShow
  48. })
  49. </script>
  50. <style>
  51. </style>