docs: ✏️ 添加互助交流QQ群3群二维码

Author: Moonofweisheng

docs/guide/join-group.md

@@ -24,11 +24,12 @@
 
 ## QQ 群
 
-目前 1 群已满，请加 2 群。
+目前 1、2 群已满，请加 3 群。
 
 <div style="display: flex;gap:24px;">
-  <img style="width: 250px; height: 250px;" :src="QQ1" @click="handleClick" :style="{filter: checked ? 'none' : 'blur(5px)'}" />
-  <img style="width: 250px; height: 250px;" :src="QQ2" @click="handleClick" :style="{filter: checked ? 'none' : 'blur(5px)'}" />
+  <img style="width: 250px; height: auto;" :src="QQ1" @click="handleClick" :style="{filter: checked ? 'none' : 'blur(5px)'}" />
+  <img style="width: 250px; height: auto;" :src="QQ2" @click="handleClick" :style="{filter: checked ? 'none' : 'blur(5px)'}" />
+  <img style="width: 250px; height: auto;" :src="QQ3" @click="handleClick" :style="{filter: checked ? 'none' : 'blur(5px)'}" />
 </div>
 
 ***快速定位问题小技巧***
@@ -37,15 +38,18 @@
 3. 查看[Github issues](https://github.com/Moonofweisheng/wot-design-uni/issues)，是否有类似问题。
 4. 翻看[更新日志](/guide/changelog)，查看是否有相关更新。
 5. 学习[提问的智慧](https://lug.ustc.edu.cn/wiki/doc/smart-questions/)，如何快速提出正确的问题。
+6. 交流群主要是提供一个互助交流的平台，请友好交流，不做伸手党，感谢支持。
 
 <el-checkbox  v-model="checked" label="我已阅读以上沟通案例和小技巧，并保证提问时遵守以上规范" />
 
 
 <script setup>
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { ref } from 'vue'
-import QQ1 from '/QQ1.png'
-import QQ2 from '/QQ2.png'
+import QQ1 from '/QQ1.jpg'
+import QQ2 from '/QQ2.jpg'
+import QQ3 from '/QQ3.jpg'
+
 const checked = ref(false)
 
 function handleClick() {

docs/public/QQ1.jpg

@@ -10,7 +10,7 @@
       <slot />
       <!-- #ifdef MP-WEIXIN -->
       <!-- 横幅广告和格子广告可以共存，但插屏广告展示时，不显示横幅广告和格子广告 -->
-      <template v-if="useWxAd && !showWxAd3">
+      <template v-if="useWxAd && !showWxAd3 && !isFree">
         <ad-custom v-if="showWxAd" unit-id="adunit-06191d6d3d1ddfc4"></ad-custom>
         <ad-custom
           v-if="showWxAd2"
@@ -29,7 +29,7 @@
       <wd-button type="error" round @click="goToReward">
         <view style="display: flex; align-items: center">
           <wd-icon name="thumb-up" size="22px"></wd-icon>
-          观看激励视频广告为我助力
+          观看视频广告24h内免除广告
         </view>
       </wd-button>
     </wd-fab>
@@ -49,6 +49,7 @@ export default {
 import { computed, ref, onMounted, nextTick } from 'vue'
 import { setNotifyDefaultOptions, useQueue, type ConfigProviderThemeVars } from '@/uni_modules/wot-design-uni'
 import { useDark } from '../../store'
+import { useRewardAd } from '@/store/useRewardAd'
 
 interface Props {
   showDarkMode?: boolean
@@ -67,7 +68,7 @@ const props = withDefaults(defineProps<Props>(), {
 const enableRewardFab = computed(() => {
   return props.useRewardFab && (process.env.NODE_ENV === 'development' ? false : true)
 })
-
+const { isFree } = useRewardAd()
 const darkMode = useDark()
 const { closeOutside } = useQueue()
 const isDark = ref<boolean>(false)

docs/public/QQ2.jpg

@@ -1,18 +1,9 @@
-<!--
- * @Author: weisheng
- * @Date: 2024-12-12 21:33:43
- * @LastEditTime: 2024-12-12 22:52:14
- * @LastEditors: weisheng
- * @Description: 
- * @FilePath: /wot-design-uni/src/pages/wxRewardAd/Index.vue
- * 记得注释
--->
 <template>
   <page-wraper :use-wx-ad="false">
     <div class="ad-completion-message">
       <div class="message-title">感谢你愿意来观看广告！</div>
       <div class="message-content">观看成功就已经成功为我助力！</div>
-      <div class="message-content">请继续使用我们的组件，您的支持对我们非常重要！</div>
+      <div class="message-content">观看一次即可免除24h内的页面贴片和插屏广告！</div>
       <view class="button-group">
         <wd-button type="success" block @click="back">返回使用</wd-button>
         <wd-button type="error" block @click="showAd">再次观看</wd-button>
@@ -21,46 +12,16 @@
   </page-wraper>
 </template>
 <script setup lang="ts">
-import { useToast } from '@/uni_modules/wot-design-uni'
+import { useRewardAd } from '@/store/useRewardAd'
+import { pause } from '@/uni_modules/wot-design-uni/components/common/util'
 import { onMounted } from 'vue'
-const { loading: showLoading, close: closeLoading } = useToast()
-let rewardVideoAd: UniApp.InterstitialAdContext | null = null
+const { createRewardVideoAd, showRewardAd, isFree } = useRewardAd()
 
-function showRewardAd() {
-  showLoading({ msg: '正在加载激励视频...' })
-  rewardVideoAd &&
-    rewardVideoAd
-      .show()
-      .then(() => {
-        closeLoading()
-      })
-      .catch(() => {
-        rewardVideoAd!
-          .load()
-          .then(() =>
-            rewardVideoAd!.show().finally(() => {
-              closeLoading()
-            })
-          )
-          .catch((err) => {
-            closeLoading()
-            console.log('激励视频 广告显示失败')
-          })
-      })
-}
-
-onMounted(() => {
-  // 接入微信小程序激励视频广告
-  if (uni.createRewardedVideoAd) {
-    rewardVideoAd = uni.createRewardedVideoAd({ adUnitId: 'adunit-91e0e9b07b57557a' })
-    rewardVideoAd.onLoad(() => {
-      console.log('激励视频 广告加载成功')
-    })
-    rewardVideoAd.onError((err) => {
-      console.log('激励视频 广告加载失败', err)
-    })
-    showRewardAd()
-  }
+onMounted(async () => {
+  await pause()
+  createRewardVideoAd()
+  await pause()
+  showRewardAd()
 })
 
 function back() {

docs/public/QQ3.jpg

@@ -0,0 +1,85 @@
+import { useToast } from '@/uni_modules/wot-design-uni'
+import { ref } from 'vue'
+
+// 是否免除广告，免除后不再显示广告
+const isFree = ref(false)
+
+export function useRewardAd() {
+  const { loading: showLoading, close: closeLoading, show: showToast } = useToast()
+
+  let rewardVideoAd: UniApp.InterstitialAdContext | null = null
+
+  isFreeAd()
+
+  // 用户观看过广告的话会在storage中存一个时间戳，写个方法判断是否存在这个时间戳，距离当前是否超过一天，超过一天则必须观看，否则不强制
+  function isFreeAd() {
+    const freeAdTime = uni.getStorageSync('freeAdTime')
+    if (freeAdTime) {
+      const now = new Date().getTime()
+      const diff = now - freeAdTime
+      if (diff > 24 * 60 * 60 * 1000) {
+        isFree.value = false
+      } else {
+        isFree.value = true
+      }
+    } else {
+      isFree.value = false
+    }
+  }
+
+  /**
+   * 创建激励视频广告
+   */
+  function createRewardVideoAd() {
+    if (uni.createRewardedVideoAd) {
+      rewardVideoAd = uni.createRewardedVideoAd({ adUnitId: 'adunit-91e0e9b07b57557a' })
+      rewardVideoAd.onLoad(() => {
+        console.log('激励视频 广告加载成功')
+      })
+      rewardVideoAd.onError((err) => {
+        console.log('激励视频 广告加载失败', err)
+      })
+      rewardVideoAd.onClose((res) => {
+        if (res && res.isEnded) {
+          // 看完广告则存一个时间戳
+          console.log('激励视频 广告完成')
+          isFree.value = true
+          uni.setStorageSync('freeAdTime', new Date().getTime())
+          showToast({ msg: '广告观看成功，感谢支持' })
+        } else {
+          console.log('激励视频 广告未完成')
+        }
+      })
+    } else {
+      console.log('当前环境不支持激励视频广告')
+    }
+  }
+
+  /**
+   * 打开激励视频广告
+   */
+  function showRewardAd() {
+    showLoading({ msg: '正在加载激励视频...' })
+    rewardVideoAd &&
+      rewardVideoAd
+        .show()
+        .then(() => {
+          closeLoading()
+        })
+        .catch(() => {
+          rewardVideoAd!
+            .load()
+            .then(() =>
+              rewardVideoAd!.show().finally(() => {
+                closeLoading()
+              })
+            )
+            .catch((err) => {
+              closeLoading()
+              console.log('激励视频 广告显示失败')
+            })
+        })
+  }
+
+  return { createRewardVideoAd, showRewardAd, isFree }
+}