diff --git a/api/system.js b/api/system.js
index 888a932..641004b 100644
--- a/api/system.js
+++ b/api/system.js
@@ -88,3 +88,13 @@ export const watchAdReward = async () => {
     method: "POST",
   });
 };
+
+export const watchAdStart = async () => {
+  return request({
+    url: "/api/blessing/ad/start",
+    method: "POST",
+    data: {
+      adPlacementId: "adunit-d7a28e0357d98947",
+    },
+  });
+};
diff --git a/components/RewardAd/RewardAd.vue b/components/RewardAd/RewardAd.vue
new file mode 100644
index 0000000..d9ad337
--- /dev/null
+++ b/components/RewardAd/RewardAd.vue
@@ -0,0 +1,75 @@
+<template>
+  <view></view>
+</template>
+
+<script setup>
+import { onMounted, onUnmounted } from "vue";
+
+const props = defineProps({
+  adUnitId: {
+    type: String,
+    default: "adunit-d7a28e0357d98947",
+  },
+});
+
+const emit = defineEmits(["onReward", "onError", "onClose"]);
+
+let videoAd = null;
+
+const onLoadHandler = () => {
+  console.log("Ad Loaded");
+};
+
+const onErrorHandler = (err) => {
+  console.error("Ad Load Error", err);
+  emit("onError", err);
+};
+
+const onCloseHandler = (res) => {
+  if (res && res.isEnded) {
+    emit("onReward");
+  } else {
+    uni.showToast({ title: "观看完整广告才能获取奖励哦", icon: "none" });
+    emit("onClose");
+  }
+};
+
+onMounted(() => {
+  if (uni.createRewardedVideoAd) {
+    videoAd = uni.createRewardedVideoAd({
+      adUnitId: props.adUnitId,
+    });
+
+    videoAd.onLoad(onLoadHandler);
+    videoAd.onError(onErrorHandler);
+    videoAd.onClose(onCloseHandler);
+  }
+});
+
+onUnmounted(() => {
+  if (videoAd) {
+    videoAd.offLoad(onLoadHandler);
+    videoAd.offError(onErrorHandler);
+    videoAd.offClose(onCloseHandler);
+  }
+});
+
+const show = () => {
+  if (videoAd) {
+    videoAd.show().catch(() => {
+      videoAd
+        .load()
+        .then(() => videoAd.show())
+        .catch((err) => {
+          console.error("Ad show failed", err);
+          uni.showToast({ title: "广告加载失败，请稍后再试", icon: "none" });
+          emit("onError", err);
+        });
+    });
+  } else {
+    uni.showToast({ title: "当前环境不支持广告", icon: "none" });
+  }
+};
+
+defineExpose({ show });
+</script>
diff --git a/pages/avatar/download.vue b/pages/avatar/download.vue
index 2948944..e916968 100644
--- a/pages/avatar/download.vue
+++ b/pages/avatar/download.vue
@@ -97,6 +97,7 @@
       @logind="handleLogind"
       :share-token="shareToken"
     />
+    <RewardAd ref="rewardAdRef" @onReward="handleAdReward" />
   </view>
 </template>
 
@@ -118,11 +119,11 @@ import { onShareAppMessage, onShareTimeline, onLoad } from "@dcloudio/uni-app";
 import { getShareReward, abilityCheck, watchAdReward } from "@/api/system.js";
 import { useUserStore } from "@/stores/user";
 import NavBar from "@/components/NavBar/NavBar.vue";
-
-let videoAd = null;
+import RewardAd from "@/components/RewardAd/RewardAd.vue";
 
 const userStore = useUserStore();
 const loginPopupRef = ref(null);
+const rewardAdRef = ref(null);
 
 const isLoggedIn = computed(() => !!userStore.userInfo.nickName);
 const userPoints = computed(() => userStore.userInfo.points || 0);
@@ -188,29 +189,6 @@ onLoad((options) => {
     eventName: "avatar_download_page_visit",
     eventType: `visit`,
   });
-
-  // Initialize Rewarded Video Ad
-  if (uni.createRewardedVideoAd) {
-    videoAd = uni.createRewardedVideoAd({
-      adUnitId: "adunit-d7a28e0357d98947",
-    });
-    videoAd.onLoad(() => {
-      console.log("ad loaded");
-    });
-    videoAd.onError((err) => {
-      console.error("ad load error", err);
-    });
-    videoAd.onClose((res) => {
-      console.log(1212121212, res);
-
-      if (res && res.isEnded) {
-        handleAdReward();
-      } else {
-        // Playback not completed
-        uni.showToast({ title: "观看完整广告才能获取积分哦", icon: "none" });
-      }
-    });
-  }
 });
 
 const getThumbUrl = (url) => {
@@ -308,23 +286,6 @@ const previewImage = (index) => {
   });
 };
 
-const showRewardAd = () => {
-  if (videoAd) {
-    videoAd.show().catch(() => {
-      // Failed to load, try loading again
-      videoAd
-        .load()
-        .then(() => videoAd.show())
-        .catch((err) => {
-          console.error("Ad show failed", err);
-          uni.showToast({ title: "广告加载失败，请稍后再试", icon: "none" });
-        });
-    });
-  } else {
-    uni.showToast({ title: "当前环境不支持广告", icon: "none" });
-  }
-};
-
 const handleAdReward = async () => {
   try {
     const res = await watchAdReward();
@@ -375,7 +336,7 @@ const downloadAvatar = async (item) => {
         content: "观看广告可获得50积分，继续下载",
         success: (res) => {
           if (res.confirm) {
-            showRewardAd();
+            rewardAdRef.value.show();
           }
         },
       });