ttttt

components/qiandao/TaskComplete.less

+.task_complete_overlay {
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	z-index: 9999;
+
+	.background_container {
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		background: rgba(0, 0, 0, 0.8);
+	}
+
+	.task_complete_container {
+		position: relative;
+		width: 600rpx;
+		height: 500rpx;
+		// background: #ffffff;
+		border-radius: 30rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.3);
+		z-index: 2;
+		// padding: 40rpx;
+
+		.task_title {
+			font-size: 64rpx;
+			font-weight: bold;
+			color: #ffffff;
+			margin-bottom: 20rpx;
+			text-align: center;
+		}
+
+		.points_text {
+			font-size: 32rpx;
+			color: #ffffff;
+			margin-bottom: 40rpx;
+			text-align: center;
+		}
+
+		.coin_icon {
+			width: 119rpx;
+			height: 116rpx;
+			margin-bottom: 40rpx;
+		}
+
+		.accept_button {
+			width: 300rpx;
+			height: 80rpx;
+			background: #D3A458;
+			border-radius: 40rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			margin-bottom: 30rpx;
+
+			.accept_text {
+				font-size: 32rpx;
+				color: #ffffff;
+				font-weight: bold;
+			}
+		}
+	}
+
+	.close_button {
+		position: absolute;
+		bottom: -80rpx;
+		left: 50%;
+		transform: translateX(-50%);
+		width: 56rpx;
+		height: 56rpx;
+		background: rgba(255, 255, 255, 0.5);
+		border-radius: 50%;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
+		z-index: 2;
+
+		.close_icon {
+			font-size: 36rpx;
+			color: #333333;
+			font-weight: bold;
+			line-height: 1;
+		}
+	}
+}

components/qiandao/TaskComplete.vue

+<template>
+	<view class="task_complete_overlay" v-if="visible" @click="handleClose">
+		<!-- 背景容器，右下角镂空透明圆角矩形 -->
+		<view class="background_container"></view>
+		
+		<view class="task_complete_container">
+			<!-- 任务完成标题 -->
+			<text class="task_title">完成{{ taskTitle }}任务</text>
+			<!-- 获得积分文字 -->
+			<text class="points_text">获得{{ points }}积分</text>
+			<!-- 金币图标 -->
+			<image class="coin_icon" :src="$baseUrl + `integral/1023/jifenIcon1.png`" mode="aspectFit" />
+			<!-- 开心收下按钮 -->
+			<view class="accept_button" @click="handleAccept">
+				<text class="accept_text">开心收下</text>
+			</view>
+		</view>
+		
+		<!-- 关闭按钮 -->
+		<view class="close_button" @click="handleClose">
+			<text class="close_icon">×</text>
+		</view>
+	</view>
+</template>
+
+<script setup>
+import { defineProps, defineEmits } from 'vue';
+
+// Props 定义
+const props = defineProps({
+	visible: {
+		type: Boolean,
+		default: false
+	},
+	points: {
+		type: Number,
+		default: 100
+	},
+	taskTitle: {
+		type: String,
+		default: 'xxx'
+	}
+});
+
+// Emits 定义
+const emit = defineEmits(['close', 'accept']);
+
+// 关闭弹窗
+const handleClose = () => {
+	emit('close');
+};
+
+// 开心收下按钮点击
+const handleAccept = () => {
+	emit('accept');
+	emit('close');
+};
+</script>
+
+<style lang="less" scoped>
+@import '@/components/qiandao/TaskComplete.less';
+</style>

pages/index/index.vue

@@ -17,6 +17,15 @@
 		@record="handleInvitePrizePanelRecord"
 		@prize="handleInvitePrizePanelPrize"
 	/>
+	
+	<!-- 任务完成弹窗 -->
+	<TaskComplete 
+		:visible="globalStore.isShowTaskComplete"
+		:points="globalStore.taskCompletePoints"
+		:taskTitle="globalStore.taskCompleteTitle"
+		@close="handleCloseTaskComplete"
+		@accept="handleAcceptTaskComplete"
+	/>
   
   <button v-if="isBackApp" class="back-app" open-type="launchApp" app-parameter="wechat" @binderror="handleLaunchAppError"
     :style="{
@@ -58,6 +67,7 @@ import Integral from "@/views/Integral.vue";
 import My from "@/views/My.vue";
 import WxFriendCircleSimplePage from "@/components/WxFriendCircleSimplePage.vue";
 import InvitePrizePanel from "@/components/integralArea/InvitePrizePanel.vue";
+import TaskComplete from "@/components/qiandao/TaskComplete.vue";
 import { useGlobalStore } from "@/stores/global.js";
 import { useUserStore } from "@/stores/user.js";
 import { jump, JumpType } from "../../utils";
@@ -226,6 +236,17 @@ const handleInvitePrizePanelPrize = () => {
 	globalStore.isShowInvitePrizePanel = false;
 	// 这里可以添加跳转到奖品页面的逻辑
 };
+
+// 任务完成弹窗处理方法
+const handleCloseTaskComplete = () => {
+	globalStore.isShowTaskComplete = false;
+};
+
+const handleAcceptTaskComplete = () => {
+	console.log('接受任务完成奖励');
+	globalStore.isShowTaskComplete = false;
+	// 这里可以添加接受奖励后的逻辑
+};
 </script>
 
 <style lang="scss" scoped>

stores/global.js

@@ -17,6 +17,9 @@ export const useGlobalStore = defineStore('global', {
 			unionId: unionId,
 			baseUrl: '',
 			isShowInvitePrizePanel: false, // 是否显示邀请奖品弹窗
+			isShowTaskComplete: false, // 是否显示任务完成弹窗
+			taskCompletePoints: 100, // 任务完成获得的积分
+			taskCompleteTitle: 'xxx', // 任务完成的任务名称
 		};
 	},
 	actions: {
@@ -53,6 +56,17 @@ export const useGlobalStore = defineStore('global', {
 		
 		setIsShowLoading(v){
 			this.isShowLoading = v
+		},
+		
+		/**
+		 * 显示任务完成弹窗
+		 * @param {number} points 获得的积分
+		 * @param {string} taskTitle 任务名称
+		 */
+		showTaskComplete(points = 100, taskTitle = 'xxx') {
+			this.taskCompletePoints = points;
+			this.taskCompleteTitle = taskTitle;
+			this.isShowTaskComplete = true;
 		}
 	},
 });
\ No newline at end of file

views/Integral.vue

@@ -502,7 +502,7 @@
 import { ref, onMounted, onBeforeMount, computed, watch } from 'vue';
 import { jump, JumpType } from '@/utils/index.js'
 import { useUserStore } from "@/stores/user";
-import { fetchIntegralJSON, fetchBatchReceiveJSON } from '../api/integral';
+import { fetchIntegralJSON, fetchBatchReceiveJSON, taskCompleteJSON } from '../api/integral';
 import RegisterLayer from "../components/RegisterLayer.vue";
 
 import { showLoading, hideLoading } from '../utils'
@@ -1533,6 +1533,7 @@ const showSignRuleDes = ref(false);
 const showTaskPop = ref(false);
 const showTaskPerson = ref(false);
 const showGongzhonghaoPop = ref(false);
+const taskId = ref(0);
 
 // 公众号弹窗参数
 const gongzhonghaoTitle = ref('公众号');
@@ -1793,9 +1794,15 @@ onShow(async () => {
 		initNetData()
 	}
 
+	//完成了浏览任务
+	if(taskId.value > 0) {
+		// const res = await taskCompleteJSON(taskId.value);
+		// console.log('taskCompleteJSON res:', res);
+		globalStore.isShowTaskComplete = true;
+		globalStore.taskCompletePoints = 10;//res?.data?.credits;
+		globalStore.taskCompleteTitle = '浏览任务'//res?.data?.taskName;
+	}
 
-	const res = await taskCompleteJSON(data.task.id, isdebug.value);
-	console.log('taskCompleteJSON res:', res);
 })
 
 onMounted(async () => {
@@ -2912,6 +2919,7 @@ const handleTaskClick = async (data) => {
 		});
 		return;
 	}
+
 	switch (data.task.taskTodoExtra.type) {
 		case 'Perfect':
 			showTaskPop.value = false; // 先关闭TaskPop
@@ -2921,6 +2929,7 @@ const handleTaskClick = async (data) => {
 			break;
 		case 'BROWSE_PAGE'://浏览商城
 		 	showTaskPop.value = false;
+			taskId.value = data.task.id;
 			
 			jump({
 				type: JumpType.H5,