activityDescPopup.vue 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <view class="activityDescPopup">
  3. <wd-popup
  4. v-model="props.show"
  5. position="bottom"
  6. closable
  7. custom-style="height: 600rpx;border-radius:16rpx"
  8. @close="handleClose"
  9. >
  10. <view class="title">活动说明</view>
  11. <view class="content">
  12. <view v-for="(item, index) in description" :key="index">{{
  13. item
  14. }}</view>
  15. <!-- {{ description }} -->
  16. </view>
  17. </wd-popup>
  18. </view>
  19. </template>
  20. <script lang="ts" setup>
  21. import { computed } from "vue";
  22. import { useDraw } from "@/hooks/useDraw";
  23. const props = defineProps({
  24. show: {
  25. type: Boolean,
  26. default: false,
  27. },
  28. description: {
  29. type: Array,
  30. default: () => [],
  31. },
  32. });
  33. // const descStr = computed(() => {
  34. // console.log("-----------------------", props.description.split("\n"));
  35. // return props.description.split("\n");
  36. // });
  37. const emit = defineEmits(["update:show"]);
  38. const { handleClose } = useDraw(props, emit);
  39. </script>
  40. <style lang="scss" scoped>
  41. .activityDescPopup {
  42. .title {
  43. font-size: 32rpx;
  44. color: #333;
  45. font-weight: bold;
  46. text-align: center;
  47. margin-top: 32rpx;
  48. }
  49. .content {
  50. font-size: 24rpx;
  51. color: #666;
  52. width: 90%;
  53. margin: 50rpx auto;
  54. line-height: 34rpx;
  55. }
  56. }
  57. </style>