项目初始化

sheep/components/s-popup-image/s-popup-image.vue

@@ -0,0 +1,85 @@
+<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>