对接活动、实况等接口

property-uniapp-project/pageSubPack/activity-list/activityList.vue

@@ -58,7 +58,6 @@
 					</view>
 
 					<view v-if="activity.applied && activeTab === 'list'" class="signed-badge">
-						<uni-icons type="checkbox-filled" size="14" color="#fff"></uni-icons>
 						<text>已报名</text>
 					</view>
 
@@ -82,7 +81,7 @@
 										</view>
 
 										<view class="activity-detail">
-											<text class="detail-text">地点：{{ activity.address }}</text>
+											<text class="detail-text-address">地点：{{ activity.address }}</text>
 										</view>
 
 										<view class="activity-detail">
@@ -94,10 +93,14 @@
 						</view>
 
 						<view class="action-buttons">
-							<button v-if="activeTab === 'list' && !activity.hasSigned" class="action-btn signup-btn"
+							<button v-if="activeTab === 'list' && activity.applied === false" class="action-btn signup-btn"
 								@tap.stop="signupActivity(activity)">
 								立即报名
 							</button>
+							<button v-if="activeTab === 'list' && activity.applied === true" class="action-btn signup-btn"
+								@tap.stop="cancelActivity(activity)">
+								取消报名
+							</button>
 						</view>
 					</view>
 				</view>
@@ -119,89 +122,33 @@
 </template>
 
 <script setup>
-	import {
+import { ref, watch } from 'vue'
-		ref,
+import { onLoad, onUnload, onShow } from '@dcloudio/uni-app'
-		computed,
-		onMounted,
-		watch
-	} from 'vue'
 import moment from 'moment';
 import { getActivityList } from '../api/api.js'
 
-	// 响应式数据
+// ===================== 响应式数据 =====================
 const activeTab = ref('list') // 'list' 或 'my'
 const myFilter = ref('reviewing') // 我的活动筛选条件
 const isLoading = ref(false)
 const hasMoreData = ref(true)
 const currentPage = ref(1)
-	const pageSize = 5
+const pageSize = ref(5)
 const total = ref(0)
-	// 当前显示的活动列表
+const displayedActivities = ref([]) // 当前显示的活动列表
-	const displayedActivities = ref([])
 
 // 筛选条件
-	const filters = ref([{
+const filters = ref([
-			label: '审核中',
+	{ label: '审核中', value: 'reviewing' },
-			value: 'reviewing'
+	{ label: '已通过', value: 'passed' },
-		},
+	{ label: '未通过', value: 'rejected' },
-		{
+	{ label: '已结束', value: 'ended' }
-			label: '已通过',
-			value: 'passed'
-		},
-		{
-			label: '未通过',
-			value: 'rejected'
-		},
-		{
-			label: '已结束',
-			value: 'ended'
-		}
 ])
 
-	// 模拟活动数据
+// ===================== 核心方法 =====================
-	const allActivities = ref([])
+/**
-
+ * 重置并刷新第一页数据
-	// 计算属性：根据当前标签和筛选条件过滤活动
+ */
-	const filteredActivities = computed(() => {
-		if (activeTab.value === 'list') {
-			// 活动列表页：显示所有活动
-			return allActivities.value
-		} else {
-			// 我的活动页：根据筛选条件过滤
-			if (myFilter.value === 'all') {
-				return allActivities.value.filter(activity => activity.hasSigned)
-			} else {
-				return allActivities.value.filter(activity =>
-					activity.hasSigned && activity.myStatus === myFilter.value
-				)
-			}
-		}
-	})
-
-	// 返回
-	const narBack = () => {
-		if (uni.getStorageSync('sourcePage') === "index") {
-			uni.switchTab({
-				url: "/pages/index/index"
-			})
-		} else if (uni.getStorageSync('sourcePage') === "serviceIndex") {
-			uni.switchTab({
-				url: "/pages/serviceIndex/serviceIndex"
-			})
-		}
-	}
-	// 切换选项卡
-	const switchTab = (tab) => {
-		activeTab.value = tab
-		resetAndLoad()
-	}
-
-	// 切换筛选条件
-	const switchFilter = (filter) => {
-		myFilter.value = filter
-		resetAndLoad()
-	}
-		// 重置并刷新第一页
 const resetAndLoad = () => {
 	currentPage.value = 1
 	displayedActivities.value = []
@@ -209,29 +156,70 @@
 	getActivityListData(1)
 }
 
-	// 获取小区列表接口
+/**
+ * 返回上一级页面
+ */
+const narBack = () => {
+	const sourcePage = uni.getStorageSync('sourcePage')
+	if (sourcePage === "index") {
+		uni.switchTab({ url: "/pages/index/index" })
+	} else if (sourcePage === "serviceIndex") {
+		uni.switchTab({ url: "/pages/serviceIndex/serviceIndex" })
+	} else {
+		uni.navigateBack()
+	}
+}
+
+/**
+ * 切换选项卡（活动列表/我的活动）
+ * @param {string} tab - 选项卡类型
+ */
+const switchTab = (tab) => {
+	activeTab.value = tab
+	resetAndLoad()
+}
+
+/**
+ * 切换我的活动筛选条件
+ * @param {string} filter - 筛选值
+ */
+const switchFilter = (filter) => {
+	myFilter.value = filter
+	resetAndLoad()
+}
+
+/**
+ * 获取活动列表数据
+ * @param {number} pageNum - 页码
+ */
 const getActivityListData = async (pageNum = 1) => {
+	// 防止重复加载
 	if (isLoading.value) return
 	isLoading.value = true
 
 	try {
+		// 构造请求参数（区分活动列表/我的活动 + 筛选条件）
 		const params = {
 			pageNum: pageNum,
-					pageSize: pageSize
+			pageSize: pageSize.value,
+			//tabType: activeTab.value, // 传给后端：list/my
+			//filterType: activeTab.value === 'my' ? myFilter.value : '' // 我的活动筛选条件
 		}
+
 		const res = await getActivityList(params)
 
 		if (res.code === 200) {
 			const list = res.rows || []
 			total.value = res.total || 0
-					// 第一页 → 覆盖；下一页 → 追加
+			
+			// 第一页覆盖数据，下一页追加数据
 			if (pageNum === 1) {
 				displayedActivities.value = list
 			} else {
 				displayedActivities.value = [...displayedActivities.value, ...list]
 			}
 
-					// 是否还有更多数据
+			// 判断是否还有更多数据
 			hasMoreData.value = displayedActivities.value.length < total.value
 			currentPage.value = pageNum
 		} else {
@@ -239,108 +227,104 @@
 			if (pageNum === 1) displayedActivities.value = []
 		}
 	} catch (err) {
-				uni.showToast({ title: "网络异常", icon: 'error' })
+		uni.showToast({ title: "网络异常", icon: 'none' })
 		if (pageNum === 1) displayedActivities.value = []
 	} finally {
 		isLoading.value = false
 	}
 }
 
-	// 加载更多数据
+/**
+ * 加载更多数据
+ */
 const loadMoreData = () => {
 	if (isLoading.value || !hasMoreData.value) return
 	getActivityListData(currentPage.value + 1)
 }
 
-	// 获取活动状态类名
+/**
-	const getStatusClass = (status) => {
+ * 格式化日期
-		const classMap = {
+ * @param {string} date - 原始日期字符串
-			'ongoing': 'status-ongoing',
+ * @returns {string} 格式化后的日期
-		}
+ */
-		return classMap[status] || ''
+const formatDate = (date) => {
-	}
+	if (!date) return ''
-
-	// 获取我的活动状态文本
-	const getMyStatusText = (status) => {
-		const statusMap = {
-			'reviewing': '审核中',
-			'passed': '已通过',
-			'rejected': '未通过',
-			'ended': '已结束'
-		}
-		return statusMap[status] || '未知'
-	}
-
-	// 获取我的活动状态类名
-	const getMyStatusClass = (status) => {
-		const classMap = {
-			'reviewing': 'my-status-reviewing',
-			'passed': 'my-status-passed',
-			'rejected': 'my-status-rejected',
-			'ended': 'my-status-ended'
-		}
-		return classMap[status] || ''
-	}
-
-	// 格式化日期
-	function formatDate(date) {
 	return moment(date).format('YYYY-MM-DD HH:mm:ss')
 }
 
-	// 报名活动
+/**
+ * 报名活动（跳转详情页）
+ * @param {object} activity - 活动对象
+ */
 const signupActivity = (activity) => {
 	uni.navigateTo({
-			url: `/pageSubPack/activity-list/activityListDetails?id=${activity.id}&title=${activity.title}`
+		url: `/pageSubPack/activity-list/activityListDetails?id=${activity.id}&title=${activity.title}&applied=${activity.applied}`
 	})
 }
 
-	// 查看活动详情
+/**
-	// const viewActivityDetail = (activity) => {
+ * 取消报名（跳转详情页）
-	// 	uni.navigateTo({
+ * @param {object} activity - 活动对象
-	// 		url: `/pages/activityDetail/activityDetail?id=${activity.id}`,
+ */
-	// 		fail: () => {
+const cancelActivity = (activity) => {
-	// 			// 如果页面不存在，显示活动信息
+	uni.navigateTo({
-	// 			uni.showModal({
+		url: `/pageSubPack/activity-list/activityListDetails?id=${activity.id}&title=${activity.title}&applied=${activity.applied}`
-	// 				title: activity.title,
+	})
-	// 				content: `${activity.description}\n\n时间：${formatDate(activity.startTime)} 至 ${formatDate(activity.endTime)}\n地点：${activity.location}\n名额：${activity.totalQuota}人，已报名：${activity.signedCount}人`,
+}
-	// 				showCancel: false,
+
-	// 				confirmText: '知道了'
+/**
-	// 			})
+ * 查看活动详情（跳转详情页）
+ * @param {object} activity - 活动对象
+ */
+const viewActivityDetail = (activity) => {
+	uni.navigateTo({
+		url: `/pageSubPack/activity-list/activityListDetails?id=${activity.id}&title=${activity.title}&applied=${activity.applied}`
+	})
+}
+
+// ===================== 生命周期 & 监听 =====================
+/**
+ * 页面显示时刷新数据
+ */
+onShow(() => {
+	getActivityListData(1) // 强制刷新第一页
+})
+
+/**
+ * 页面加载时监听刷新事件（来自详情页）
+ */
+onLoad(() => {
+	// 监听详情页报名/取消报名后的刷新通知
+	uni.$on('refreshActivityList', (data) => {
+		console.log('收到活动列表刷新通知：', data)
+		getActivityListData(1)
+
+		// 方式2：局部更新（性能更好，可选启用）
+		// const index = displayedActivities.value.findIndex(item => item.id === data.activityId)
+		// if (index > -1) {
+		// 	displayedActivities.value[index].applied = data.isSigned
 		// }
-	// 	})
-	// }
-
-	// 联系管理员
-	const contactAdmin = (activity) => {
-		uni.showModal({
-			title: '联系管理员',
-			content: `您报名"${activity.title}"未通过审核，是否联系管理员了解原因？`,
-			success: (res) => {
-				if (res.confirm) {
-					uni.makePhoneCall({
-						phoneNumber: '400-123-4567'
 	})
-				}
-			}
 })
-	}
 
-	// 监听筛选条件变化
+/**
+ * 页面卸载时移除事件监听（避免内存泄漏）
+ */
+onUnload(() => {
+	uni.$off('refreshActivityList')
+})
+
+/**
+ * 监听我的活动筛选条件变化
+ */
 watch(() => myFilter.value, () => {
 	if (activeTab.value === 'my') {
-			currentPage.value = 1
+		resetAndLoad()
-			displayedActivities.value = []
-			getActivityListData(1)
 	}
 })
-
-	// 初始化
-	onMounted(() => {
-		getActivityListData(1)
-	})
 </script>
 
-<style>
+<style scoped>
 /* 页面容器 */
 .container {
 	width: 100%;
@@ -482,8 +466,7 @@
 	display: flex;
 	align-items: center;
 	padding: 6rpx 14rpx;
-		background-color: #007AFF;
+	color: #007AFF;
-		color: #fff;
 	font-size: 22rpx;
 	border-radius: 20rpx;
 	z-index: 1;
@@ -534,6 +517,11 @@
 
 .detail-text {
 	flex: 1;
+	font-size: 20rpx;
+}
+.detail-text-address{
+	flex: 1;
+	font-size: 22rpx;
 }
 
 /* 操作按钮 */

property-uniapp-project/pageSubPack/activity-list/activityListDetails.vue

@@ -1,5 +1,6 @@
 <template>
   <view class="container">
+	  <view class="status_bar"></view>
     <!-- 顶部导航栏 -->
     <view class="nav-bar">
       <view class="nav-left" @tap="goBack">
@@ -8,10 +9,10 @@
       <view class="nav-title">{{navTitle}}</view>
       <view class="nav-right"></view>
     </view>
-	<view style="status_bar"></view>
+	
 
     <!-- 内容区域 -->
-    <scroll-view class="content" scroll-y>
+    <scroll-view class="scroll-content" scroll-y="true">
       <!-- 选项卡 -->
       <view class="tabs">
         <view 
@@ -106,7 +107,7 @@
       <view v-else class="status-content">
         <view class="status-header">
           <view class="status-title">
-			  <image src="http://47.104.199.163:9090/images/activity/liveScene.png" style="width: 40rpx;height: 30rpx;"></image>
+			  <image src="http://47.104.199.163:9090/images/activity/liveScene.png" style="width: 38rpx;height: 23rpx;"></image>
 			  现场实况
 			  </view>
           <view class="status-count">{{ liveRecords.length }}次</view>
@@ -165,16 +166,9 @@
       >
         取消报名
       </button>
-	  <button class="action-btn add-status-btn" v-if="activeTab === 'status'" @click="liveClick">添加实况</button>
 	  
-      <!-- 已报名且在活动实况页显示添加实况按钮 -->
+	  <!-- 活动实况页显示添加实况按钮 -->
-     <!-- <button 
+	  <button class="action-btn add-status-btn" v-if="activeTab === 'status'" @click="liveClick">添加实况</button>
-        v-if="hasSigned && activeTab === 'status'" 
-        class="action-btn add-status-btn"
-        @tap="handleAddStatus"
-      >
-        添加实况
-      </button> -->
     </view>
 
     <!-- 报名确认模态框 -->
@@ -216,54 +210,53 @@
 
 <script setup>
 import { ref, onMounted } from 'vue'
-import {onLoad} from '@dcloudio/uni-app'
+import {onLoad,onUnload} from '@dcloudio/uni-app'
 import moment from 'moment'
-import {getActivityDetails} from '../api/api.js'
+import {getActivityDetails,confirmResident,cancelActivity,getActivityLive} from '../api/api.js'
 
 // 响应式数据
 const activeTab = ref('detail') // 'detail' 或 'status'
 const hasSigned = ref(false) // 是否已报名
 const showSignupModal = ref(false)
 const showCancelModal = ref(false)
-// const showAddStatusModal = ref(false)
 const showToast = ref(false)
 const toastMessage = ref('')
 const newStatusContent = ref('')
-// const newStatusImages = ref([])
 const navTitle = ref('')
 const curActivityId = ref('') // 当前活动的id
 const activityConent = ref({}) // 获取详情数据
 
 // 实况记录数据
 const liveRecords = ref([
-  {
+  // {
-    id: 1,
+  //   id: 1,
-    user: '微信用户',
+  //   user: '微信用户',
-    time: '2023-08-20 16:00:02',
+  //   time: '2023-08-20 16:00:02',
-    content: '参与活动打卡',
+  //   content: '参与活动打卡',
-    images: []
+  //   images: []
-  },
+  // },
-  {
+  // {
-    id: 2,
+  //   id: 2,
-    user: '微信用户',
+  //   user: '微信用户',
-    time: '2023-08-20 16:20:02',
+  //   time: '2023-08-20 16:20:02',
-    content: '目前现场的互动氛围很好',
+  //   content: '目前现场的互动氛围很好',
-    images: ['http://47.104.199.163:9090/images/logo.png', 'http://47.104.199.163:9090/images/repair/house1.png']
+  //   images: ['http://47.104.199.163:9090/images/logo.png', 'http://47.104.199.163:9090/images/repair/house1.png']
-  }
+  // }
 ])
+
 // 接受参数
 onLoad((option) =>{
-	// console.log('dsdsds',option)
 	navTitle.value = option?.title
 	curActivityId.value = option?.id
-	// console.log('navTitle',navTitle.value,curActivityId.value)
+	// 处理applied参数（可能是字符串类型，需要转布尔）
+	hasSigned.value = option?.applied === 'true' || option?.applied === true
+	// console.log('hasSigned.value',hasSigned.value)
 	getActivityDetailsData(curActivityId.value)
-	
 })
+
 // 获取列表详情
 const getActivityDetailsData = async (id) =>{
 	try{
-		
 		const res = await getActivityDetails(id)
 		if(res.code === 200){
 			activityConent.value = res.data || {}
@@ -274,13 +267,15 @@ const getActivityDetailsData = async (id) =>{
 				icon:"error"
 			})
 		}
-	}catch{
+	}catch(err){ 
 		uni.showToast({
-			title: res.msg ||"网络异常",
+			title: "网络异常",
 			icon:"none"
 		})
+		// console.error('获取活动详情失败：', err)
 	}
 }
+
 // 切换选项卡
 const switchTab = (tab) => {
   activeTab.value = tab
@@ -303,12 +298,40 @@ const hideSignupModal = () => {
 
 // 确认报名
 const confirmSignup = () => {
-  hasSigned.value = true
+  confirmRegist()
   hideSignupModal()
-  showToastMessage('报名成功！')
+}
 
-  // 模拟更新名额
+// 确认报名接口
-  // 在实际应用中，这里应该调用API更新后端数据
+const confirmRegist = async () =>{
+	try{
+		const res = await confirmResident(curActivityId.value)
+		if(res.code === 200){
+			hasSigned.value = true // 报名成功后更新状态
+			uni.showToast({
+				title: '报名成功',
+				icon:"success"
+			})
+			setTimeout(() =>{
+				uni.$emit('refreshActivityList', { 
+				    activityId: curActivityId.value,
+				    isSigned: true 
+				})
+				uni.navigateBack() 
+			},1500)
+		}else{
+			uni.showToast({
+				title: res.msg || "报名失败",
+				icon:"error"
+			})
+		}
+	}catch(err){
+		uni.showToast({
+			title: "网络异常",
+			icon:"none"
+		})
+		// console.error('报名失败：', err)
+	}
 }
 
 // 处理取消报名
@@ -323,26 +346,83 @@ const hideCancelModal = () => {
 
 // 确认取消报名  
 const confirmCancel = () => {
-  hasSigned.value = false
+  hasSigned.value = false // 取消报名后更新状态
+  cancelActivityData()
   hideCancelModal()
-  showToastMessage('已取消报名')
+  // showToastMessage('已取消报名')
-  
-  // 模拟更新名额
-  // 在实际应用中，这里应该调用API更新后端数据
 }
+// 确认取消报名接口
+const cancelActivityData = async () =>{
+	try{
+		const res = await cancelActivity(curActivityId.value)
+		if(res.code === 200){
+			hasSigned.value = true // 报名成功后更新状态
+			uni.showToast({
+				title: '取消报名成功',
+				icon:"success"
+			})
+			setTimeout(() =>{
+				uni.$emit('refreshActivityList', { 
+				    activityId: curActivityId.value,
+				    isSigned: true 
+				})
+				uni.navigateBack() 
+			},1500)
+		}else{
+			uni.showToast({
+				title: res.msg || "取消报名失败",
+				icon:"error"
+			})
+		}
+	}catch(err){
+		uni.showToast({
+			title: "网络异常",
+			icon:"none"
+		})
+	}
+}
+
+
+// -----获取活动实况列表----
+const getLiveActivityList = async () =>{
+	try{
+		const res = await getActivityLive(curActivityId.value)
+		if(res.code === 200){
+			liveRecords.value = res.rows || []
+		}else{
+			liveRecords.value = []
+			// uni.showToast({
+			// 	title: res.msg ||"实况列表获取失败",
+			// 	icon:"error"
+			// })
+		}
+	}catch(err){ 
+		uni.showToast({
+			title: "网络异常",
+			icon:"none"
+		})
+	}
+}
+
 // 添加实况跳转
 const liveClick = () =>{
 	uni.navigateTo({
-		url:'/pageSubPack/activity-list/live-add'
+		url:`/pageSubPack/activity-list/live-add?id=${curActivityId.value}`
 	})
 }
 
+// 监听实况列表刷新
 
-
+// ---------
-// 获取当前时间
+onLoad(() =>{
-const getCurrentTime = () => {
+	uni.$on('refreshLiveList', () => {
-	return moment(date).format('YYYY-MM-DD HH:mm:ss')
+		getLiveActivityList();
-}
+	});
+	getLiveActivityList()
+})
+onUnload(() => {
+	uni.$off('refreshLiveList')
+})
 
 // 显示提示信息
 const showToastMessage = (message) => {
@@ -354,14 +434,8 @@ const showToastMessage = (message) => {
   }, 2000)
 }
 
-// 初始化
+
-onMounted(() => {
+
-  // 模拟检查用户是否已报名
-  // 实际项目中应该从接口获取
-  setTimeout(() => {
-    hasSigned.value = false // 默认未报名
-  }, 100)
-})
 </script>
 
 <style scoped>
@@ -372,11 +446,9 @@ onMounted(() => {
   flex-direction: column;
   background: linear-gradient(to bottom left, #E2F0FF 0%, #ffffff 50%)
 }
-
 /* 顶部导航栏 */
 .nav-bar {
   height: 90rpx;
-  /* background: linear-gradient(135deg, #007AFF 0%, #0056cc 100%); */
   display: flex;
   align-items: center;
   padding: 0 30rpx;
@@ -384,7 +456,6 @@ onMounted(() => {
   position: sticky;
   top: 44px;
   z-index: 100;
-  /* box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.2); */
 }
 
 .nav-left {
@@ -397,7 +468,7 @@ onMounted(() => {
 .nav-title {
   flex: 1;
   text-align: left;
-  font-size: 36rpx;
+  font-size: 32rpx;
   font-weight: 600;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -410,17 +481,13 @@ onMounted(() => {
   width: 60rpx;
 }
 
-/* 内容区域 */
+/* 滚动内容区域 */
-.content {
+.scroll-content {
   flex: 1;
+  width: 100%;
   box-sizing: border-box;
+  overflow-y: auto;
   margin-bottom: 120rpx;
-  position: absolute; /* 关键：让scroll-view独立滚动 */
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    padding-top: 136px; 
 }
  .status_bar {
 	 height: 46px;
@@ -430,15 +497,10 @@ onMounted(() => {
 /* 选项卡 */
 .tabs {
   display: flex;
-  /* background-color: #fff; */
   border-bottom: 1rpx solid #e9ecef;
-  position: sticky;
-  top: 90rpx;
-  z-index: 90;
 }
 
 .tab-item {
-  /* flex: 1; */
   text-align: center;
   padding: 30rpx 35rpx;
   font-size: 32rpx;
@@ -452,31 +514,15 @@ onMounted(() => {
   font-weight: 600;
 }
 
-/* .tab-item.active::after {
-  content: '';
-  position: absolute;
-  bottom: 0;
-  left: 50%;
-  transform: translateX(-50%);
-  width: 80rpx;
-  height: 6rpx;
-  background: linear-gradient(90deg, #007AFF, #00aaff);
-  border-radius: 3rpx 3rpx 0 0;
-} */
-
 /* 活动详情内容 */
 .detail-content {
-  /* padding: 30rpx; */
+  padding: 0;
-  margin-top: 89rpx;
 }
 
 /* 基本信息区域 */
 .info-section {
-  /* background-color: #fff; */
   border-radius: 16rpx;
   padding: 30rpx 40rpx;
-  /* margin-bottom: 30rpx; */
-  /* box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05); */
 }
 
 .info-item {
@@ -510,10 +556,8 @@ onMounted(() => {
 
 /* 区块样式 */
 .section {
-  /* background-color: #fff; */
   border-radius: 16rpx;
   padding: 30rpx 40rpx;
-  /* margin-bottom: 30rpx; */
   box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05);
 }
 
@@ -550,12 +594,9 @@ onMounted(() => {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  /* background-color: #fff; */
   border-radius: 16rpx;
   padding: 30rpx;
   margin-bottom: 30rpx;
-  margin-top: 80rpx;
-  /* box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05); */
 }
 
 .status-title {
@@ -567,19 +608,16 @@ onMounted(() => {
 
 .status-count {
   padding: 8rpx 20rpx;
-  /* background-color: #007AFF; */
   color: #666;
-  font-size: 24rpx;
+  font-size: 28rpx;
   border-radius: 20rpx;
   font-weight: 500;
 }
 
 /* 实况列表 */
 .record-list {
-  /* background-color: #fff; */
   border-radius: 16rpx;
   overflow: hidden;
-  /* box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05); */
 }
 
 .record-item {
@@ -587,10 +625,6 @@ onMounted(() => {
   border-bottom: 1rpx solid #f0f0f0;
 }
 
-/* .record-item:last-child {
-  border-bottom: none;
-} */
-
 .record-user {
   display: flex;
   align-items: flex-start;
@@ -611,11 +645,9 @@ onMounted(() => {
 }
 
 .user-info {
-  /* flex: 1; */
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
-  
 }
 
 .user-name {
@@ -634,7 +666,6 @@ onMounted(() => {
   font-size: 28rpx;
   color: #333;
   line-height: 1.5;
-  /* margin-bottom: 20rpx; */
   margin: 25rpx 0rpx;
 }
 
@@ -647,7 +678,7 @@ onMounted(() => {
 
 .image-item {
   width: 150rpx;
-  height: 170rpx;
+  height: 150rpx;
   border-radius: 12rpx;
   background-color: #f8f9fa;
   background-size: cover;
@@ -809,97 +840,6 @@ onMounted(() => {
   background-color: #f0f7ff;
 }
 
-/* 添加实况模态框 */
-.add-status-modal {
-  width: 650rpx;
-}
-
-.status-input {
-  width: 100%;
-  min-height: 200rpx;
-  padding: 20rpx;
-  font-size: 28rpx;
-  color: #333;
-  background-color: #f8f9fa;
-  border-radius: 12rpx;
-  border: 1rpx solid #e9ecef;
-  margin-bottom: 20rpx;
-}
-
-.input-counter {
-  text-align: right;
-  font-size: 24rpx;
-  color: #999;
-  margin-bottom: 30rpx;
-}
-
-.image-upload-area {
-  margin-top: 30rpx;
-}
-
-.upload-tip {
-  font-size: 24rpx;
-  color: #999;
-  margin-bottom: 20rpx;
-  text-align: left;
-}
-
-.image-preview {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 20rpx;
-}
-
-.preview-item {
-  position: relative;
-  width: 150rpx;
-  height: 150rpx;
-  border-radius: 12rpx;
-  overflow: hidden;
-}
-
-.preview-image {
-  width: 100%;
-  height: 100%;
-  background-size: cover;
-  background-position: center;
-  background-repeat: no-repeat;
-  background-color: #f8f9fa;
-}
-
-.remove-btn {
-  position: absolute;
-  top: 0;
-  right: 0;
-  width: 40rpx;
-  height: 40rpx;
-  background-color: rgba(0, 0, 0, 0.6);
-  color: #fff;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 24rpx;
-  border-radius: 0 0 0 12rpx;
-}
-
-.upload-btn {
-  width: 150rpx;
-  height: 150rpx;
-  border: 2rpx dashed #e9ecef;
-  border-radius: 12rpx;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  color: #999;
-  background-color: #f8f9fa;
-}
-
-.upload-text {
-  font-size: 24rpx;
-  margin-top: 10rpx;
-}
-
 /* 提示信息 */
 .toast {
   position: fixed;

property-uniapp-project/pageSubPack/activity-list/live-add.vue

@@ -54,16 +54,27 @@
 
 <script setup>
 import { ref } from 'vue';
-// import { chooseImage, uploadFile, getLocation } from '@dcloudio/uni-app';
+import { onLoad } from '@dcloudio/uni-app';
+import { addActivityLive, signinActivityLive, uploadImage } from '../api/api.js';
 
+// 活动ID
+const activityId = ref('');
 // 实况描述内容
 const statusDesc = ref('');
 // 输入字符长度
 const currentLength = ref(0);
-// 图片列表
+// 图片列表（本地临时路径）
 const imgList = ref([]);
 // 定位信息
 const location = ref('山东省日照市东港区学院路');
+// 经纬度
+const longitude = ref('');
+const latitude = ref('');
+
+// 接收活动ID
+onLoad((option) => {
+  activityId.value = option?.id || '';
+});
 
 // 监听输入框字数变化
 const handleTextInput = (e) => {
@@ -73,11 +84,10 @@ const handleTextInput = (e) => {
 // 选择图片
 const chooseImg = () => {
   uni.chooseImage({
-    count: 3 - imgList.value.length, // 最多可选择的数量
+    count: 3 - imgList.value.length,
     sizeType: ['original', 'compressed'],
     sourceType: ['album', 'camera'],
     success: (res) => {
-      // 临时文件路径转存到图片列表
       imgList.value = [...imgList.value, ...res.tempFilePaths];
     },
     fail: (err) => {
@@ -99,8 +109,9 @@ const reLocate = () => {
     type: 'gcj02',
     success: (res) => {
       uni.hideLoading();
-      // 实际项目中可调用逆地理编码接口转换为具体地址，这里模拟
+      longitude.value = res.longitude;
-      location.value = '山东省日照市东港区学院路（新定位）';
+      latitude.value = res.latitude;
+      location.value = `${res.longitude},${res.latitude}`;
       uni.showToast({ title: '定位成功', icon: 'success' });
     },
     fail: (err) => {
@@ -111,34 +122,58 @@ const reLocate = () => {
   });
 };
 
+// 上传所有图片
+const uploadAllImages = async () => {
+  if (imgList.value.length === 0) return [];
+  const uploadPromises = imgList.value.map(img => uploadImage(img));
+  const results = await Promise.all(uploadPromises);
+  return results.map(res => res.data?.url || res.data);
+};
+
 // 提交实况
-const submitStatus = () => {
+const submitStatus = async () => {
-  // 简单校验
   if (!statusDesc.value.trim()) {
     uni.showToast({ title: '请输入实况描述', icon: 'none' });
     return;
   }
+  if (!activityId.value) {
+    uni.showToast({ title: '活动ID缺失', icon: 'none' });
+    return;
+  }
 
-  // 模拟提交逻辑（实际项目中可上传图片+提交表单）
+  uni.showLoading({ title: '提交中...', mask: true });
-  uni.showLoading({ title: '提交中...' });
 
-  // 如需上传图片，可循环调用uploadFile
+  try {
-  // 示例：
+    // 先上传图片
-  // const uploadPromises = imgList.value.map(img => {
+    const imageUrls = await uploadAllImages();
-  //   return uploadFile({
+
-  //     url: '你的上传接口',
+    // 提交实况
-  //     filePath: img,
+    const liveData = {
-  //     name: 'file'
+      content: statusDesc.value.trim(),
-  //   });
+      images: imageUrls,
-  // });
+      location: location.value,
-  // Promise.all(uploadPromises).then(res => { /* 处理上传结果 */ });
+      longitude: longitude.value,
+      latitude: latitude.value
+    };
+    await addActivityLive(activityId.value, liveData);
+
+    // 同时签到
+    await signinActivityLive(activityId.value, {
+      location: location.value,
+      longitude: longitude.value,
+      latitude: latitude.value
+    });
 
-  setTimeout(() => {
     uni.hideLoading();
     uni.showToast({ title: '添加成功', icon: 'success' });
-    // 提交成功后可返回上一页
+    uni.$emit('refreshLiveList');
+    setTimeout(() => {
       uni.navigateBack();
-  }, 1000);
+    }, 1500);
+  } catch (err) {
+    uni.hideLoading();
+    uni.showToast({ title: err || '提交失败', icon: 'none' });
+  }
 };
 </script>
 

property-uniapp-project/pageSubPack/api/api.js

@@ -1,4 +1,4 @@
-import request,{get,post} from "./request.js"
+import request,{get,post,upload} from "./request.js"
 
 
 // =======账号密码登录========
@@ -71,3 +71,33 @@ export const getActivityList = (data) =>{
 export const getActivityDetails = (id) =>{
 	return get(`/api/resident/activity/${id}`)
 }
+// 确认报名
+export const confirmResident = (id) =>{
+	return post(`/api/resident/activity/${id}/apply`)
+}
+// 取消报名
+export const cancelActivity = (id) =>{
+	return post(`/api/resident/activity/${id}/cancel`)
+}
+// =========我的活动========
+export const getMyActivityList = () =>{
+	return get("/api/resident/activity/my")
+}
+// ===========活动实况============
+// 活动实况列表
+export const getActivityLive = (id) =>{
+	return get(`/api/resident/activity/${id}/live`)
+}
+// 添加实况
+export const addActivityLive = (id, data) =>{
+	return post(`/api/resident/activity/${id}/live`, data)
+}
+// 签到
+export const signinActivityLive = (id, data) =>{
+	return post(`/api/resident/activity/${id}/signin`, data)
+}
+
+// 通用文件上传
+export const uploadImage = () => {
+	return upload('');
+}

property-uniapp-project/pageSubPack/api/request.js

@@ -78,4 +78,34 @@ export default function request(url, data = {}, method = "GET") {
 export const get = (url, data) => request(url, data, 'GET');
 export const post = (url, data) => request(url, data, 'POST');
 
+// 通用文件上传
+export const upload = (filePath, url) => {
+	return new Promise((resolve, reject) => {
+		uni.uploadFile({
+			url: baseUrl + url,
+			filePath: filePath,
+			name: 'file',
+			header: {
+				"Authorization": "Bearer " + (uni.getStorageSync("token") || ''),
+				"clientid": "resident"
+			},
+			success: (res) => {
+				if (res.statusCode === 200) {
+					const data = JSON.parse(res.data);
+					if (data.code === 200) {
+						resolve(data);
+					} else {
+						reject(data.msg || '上传失败');
+					}
+				} else {
+					reject('上传失败');
+				}
+			},
+			fail: (err) => {
+				reject(err);
+			}
+		});
+	});
+};
+
 

property-uniapp-project/uni_modules/uview-plus/libs/config/config.js

@@ -2,7 +2,7 @@ const version = '3'
 
 // 开发环境才提示，生产环境不会提示
 if (process.env.NODE_ENV === 'development') {
-	console.log(`\n %c uview-plus V${version} %c https://uview-plus.jiangruyi.com/ \n\n`, 'color: #ffffff; background: #3c9cff; padding:5px 0;', 'color: #3c9cff;background: #ffffff; padding:5px 0;');
+	//console.log(`\n %c uview-plus V${version} %c https://uview-plus.jiangruyi.com/ \n\n`, 'color: #ffffff; background: #3c9cff; padding:5px 0;', 'color: #3c9cff;background: #ffffff; padding:5px 0;');
 }
 
 export default {