营销：适配商城装修组件【弹窗广告】

pages/index/index.vue

@@ -5,8 +5,6 @@
 			<s-block v-for="(item, index) in template.components" :key="index" :styles="item.property.style">
 				<s-block-item :type="item.id" :data="item.property" :styles="item.property.style" />
 			</s-block>
-			<!-- 广告模块 -->
-			<s-popup-image />
 		</s-layout>
 	</view>
 </template>
@@ -89,4 +87,4 @@
 	onPageScroll(() => {});
 </script>
 
-<style></style>
+<style></style>

sheep/components/s-block-item/s-block-item.vue

@@ -10,6 +10,8 @@
     <s-menu-list v-if="type === 'MenuList'" :data="data" />
     <!-- 基础组件：宫格导航 -->
     <s-menu-grid v-if="type === 'MenuGrid'" :data="data" />
+    <!-- 基础组件：弹窗广告 -->
+    <s-popup-image v-if="type === 'Popover'" :data="data" />
 
     <!-- 图文组件：图片展示 -->
     <s-image-block v-if="type === 'ImageBar'" :data="data" :styles="styles" />

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

@@ -1,6 +1,6 @@
 <template>
   <view>
-    <view v-for="(item, index) in popupList" :key="item.src">
+    <view v-for="(item, index) in popupList" :key="index">
       <su-popup
         v-if="index === currentIndex"
         :show="item.isShow"
@@ -14,7 +14,7 @@
         <view class="img-box">
           <image
             class="modal-img"
-            :src="sheep.$url.cdn(item.src)"
+            :src="sheep.$url.cdn(item.imgUrl)"
             mode="widthFix"
             @tap.stop="onPopup(item.url)"
           />
@@ -27,34 +27,46 @@
 <script setup>
   import sheep from '@/sheep';
   import { computed, ref } from 'vue';
-  import { onShow } from '@dcloudio/uni-app';
   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 = sheep.$store('app').template.basic?.popupImage?.list || [];
+    const list = props.data.list || [];
     const newList = [];
     if (list.length > 0) {
       list.forEach((adv) => {
-        if (adv.show === 1 && advHistory.includes(adv.src)) {
+        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;

sheep/hooks/useModal.js

@@ -121,8 +121,8 @@ export function saveAdvHistory(adv) {
   const modal = $store('modal');
 
   modal.$patch((state) => {
-    if (!state.advHistory.includes(adv.src)) {
-      state.advHistory.push(adv.src);
+    if (!state.advHistory.includes(adv.imgUrl)) {
+      state.advHistory.push(adv.imgUrl);
     }
   });
 }