You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					
					
						
							85 lines
						
					
					
						
							1.9 KiB
						
					
					
				
			
		
		
		
			
			
			
				
					
				
				
					
				
			
		
		
	
	
							85 lines
						
					
					
						
							1.9 KiB
						
					
					
				
								<template>
							 | 
						|
								  <view>
							 | 
						|
								    <view v-for="(item, index) in popupList" :key="index">
							 | 
						|
								      <su-popup
							 | 
						|
								        v-if="index === currentIndex"
							 | 
						|
								        :show="item.isShow"
							 | 
						|
								        type="center"
							 | 
						|
								        backgroundColor="none"
							 | 
						|
								        round="0"
							 | 
						|
								        :showClose="true"
							 | 
						|
								        :isMaskClick="false"
							 | 
						|
								        @close="onClose(index)"
							 | 
						|
								      >
							 | 
						|
								        <view class="img-box">
							 | 
						|
								          <image
							 | 
						|
								            class="modal-img"
							 | 
						|
								            :src="sheep.$url.cdn(item.imgUrl)"
							 | 
						|
								            mode="widthFix"
							 | 
						|
								            @tap.stop="onPopup(item.url)"
							 | 
						|
								          />
							 | 
						|
								        </view>
							 | 
						|
								      </su-popup>
							 | 
						|
								    </view>
							 | 
						|
								  </view>
							 | 
						|
								</template>
							 | 
						|
								
							 | 
						|
								<script setup>
							 | 
						|
								  import sheep from '@/sheep';
							 | 
						|
								  import { computed, ref } from 'vue';
							 | 
						|
								  import { saveAdvHistory } from '@/sheep/hooks/useModal';
							 | 
						|
								
							 | 
						|
								  // 定义属性
							 | 
						|
								  const props = defineProps({
							 | 
						|
								    data: {
							 | 
						|
								      type: Object,
							 | 
						|
								      default() {},
							 | 
						|
								    }
							 | 
						|
								  })
							 | 
						|
								
							 | 
						|
								  // const modalStore = sheep.$store('modal');
							 | 
						|
								  const modalStore = JSON.parse(uni.getStorageSync('modal-store') || '{}');
							 | 
						|
								  console.log(modalStore)
							 | 
						|
								  const advHistory = modalStore.advHistory || [];
							 | 
						|
								  const currentIndex = ref(0);
							 | 
						|
								  const popupList = computed(() => {
							 | 
						|
								    const list = props.data.list || [];
							 | 
						|
								    const newList = [];
							 | 
						|
								    if (list.length > 0) {
							 | 
						|
								      list.forEach((adv) => {
							 | 
						|
								        if (adv.showType === 'once' && advHistory.includes(adv.imgUrl)) {
							 | 
						|
								          adv.isShow = false;
							 | 
						|
								        } else {
							 | 
						|
								          adv.isShow = true;
							 | 
						|
								          newList.push(adv);
							 | 
						|
								        }
							 | 
						|
								
							 | 
						|
								        // 记录弹窗已显示过
							 | 
						|
								        saveAdvHistory(adv);
							 | 
						|
								      });
							 | 
						|
								    }
							 | 
						|
								    return newList;
							 | 
						|
								  });
							 | 
						|
								
							 | 
						|
								  // 跳转链接
							 | 
						|
								  function onPopup(path) {
							 | 
						|
								    sheep.$router.go(path);
							 | 
						|
								  }
							 | 
						|
								
							 | 
						|
								  // 关闭
							 | 
						|
								  function onClose(index) {
							 | 
						|
								    currentIndex.value = index + 1;
							 | 
						|
								    popupList.value[index].isShow = false;
							 | 
						|
								  }
							 | 
						|
								</script>
							 | 
						|
								
							 | 
						|
								<style lang="scss" scoped>
							 | 
						|
								  .img-box {
							 | 
						|
								    width: 610rpx;
							 | 
						|
								    // height: 800rpx;
							 | 
						|
								  }
							 | 
						|
								  .modal-img {
							 | 
						|
								    width: 100%;
							 | 
						|
								    height: 100%;
							 | 
						|
								  }
							 | 
						|
								</style>
							 |