horzi_rai_wxa/components/activity/selectPopup.vue

<template>
  <!-- 参会方式弹出层 -->
  <view class="select-box" catchtap="preventPropagation">
    <u-popup v-model="popupShow" mode="bottom" @close="closeSelectHandle">
      <view style="color: #333333; font-size: 28rpxrpx">请选择参会方式</view>
      <view style="color: #2c83ff" @click="signupIsAddOfCancel('', 1)">预约外呼</view>
      <view v-if="selectYdong" style="color: #2c83ff" @click="signupIsAddOfCancel('', 4)">自主入会</view>
      <view v-else style="color: #2c83ff" @click="signupIsAddOfCancel('', 2)">自主拨入</view>
      <view style="color: #a9afb8" @click="closeSelectHandle">取消</view>
    </u-popup>
  </view>
</template>

<script>
export default {
  name: "",
  components: {},
  props: {
    selectShow: {
      type: Boolean,
      default: false,
      required: true,
    },
    selectYdong: {
      type: Boolean,
      default: false,
      required: true,
    },
  },
  data() {
    return {
      popupShow: false,
    };
  },
  watch: {
    selectShow: {
      handler(newVal) {
        this.popupShow = newVal;
      },
    },
  },
  methods: {
    // 关闭弹框事件
    closeSelectHandle() {
      this.popupShow = false;
      this.$emit("update:selectShow", false);
    },
    // 点击后的事件
    signupIsAddOfCancel(val, type) {
      this.$emit("signupIsAddOfCancel", val, type);
    },
    preventPropagation() {},
  },
};
</script>
<style scoped lang="scss">
.select-box {
  width: 100%;
  view {
    height: 95prx;
    line-height: 95rpx;
    text-align: center;
    font-size: 32rpx;
    border-bottom: 1rpx solid #ebebeb;
  }
}
</style>