selectPopup.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <!-- 参会方式弹出层 -->
  3. <view class="select-box">
  4. <u-popup v-model="popupShow" mode="bottom" @close="closeSelectHandle">
  5. <view style="color: #333333; font-size: 28rpxrpx">请选择参会方式</view>
  6. <view style="color: #2c83ff" @click="signupIsAddOfCancel('', 1)">预约外呼</view>
  7. <view v-if="selectYdong" style="color: #2c83ff" @click="signupIsAddOfCancel('', 4)">自主入会</view>
  8. <view v-else style="color: #2c83ff" @click="signupIsAddOfCancel('', 2)">自主拨入</view>
  9. <view style="color: #a9afb8" @click="closeSelectHandle">取消</view>
  10. </u-popup>
  11. </view>
  12. </template>
  13. <script>
  14. export default {
  15. name: "",
  16. components: {},
  17. props: {
  18. selectShow: {
  19. type: Boolean,
  20. default: false,
  21. required: true,
  22. },
  23. selectYdong: {
  24. type: Boolean,
  25. default: false,
  26. required: true,
  27. },
  28. },
  29. data() {
  30. return {
  31. popupShow: false,
  32. };
  33. },
  34. watch: {
  35. selectShow: {
  36. handler(newVal) {
  37. this.popupShow = newVal;
  38. },
  39. },
  40. },
  41. methods: {
  42. // 关闭弹框事件
  43. closeSelectHandle() {
  44. this.popupShow = false;
  45. this.$emit("update:selectShow", false);
  46. },
  47. // 点击后的事件
  48. signupIsAddOfCancel(val, type) {
  49. this.$emit("signupIsAddOfCancel", val, type);
  50. },
  51. },
  52. };
  53. </script>
  54. <style scoped lang="scss">
  55. .select-box {
  56. width: 100%;
  57. view {
  58. height: 95prx;
  59. line-height: 95rpx;
  60. text-align: center;
  61. font-size: 32rpx;
  62. border-bottom: 1rpx solid #ebebeb;
  63. }
  64. }
  65. </style>