From 767ace6f3e5706370168eeec11832537a1cbfcda Mon Sep 17 00:00:00 2001
From: Vinjor <vinjorm@gmail.com>
Date: Thu, 3 Apr 2025 11:14:12 +0800
Subject: [PATCH] =?UTF-8?q?=E6=88=91=E7=9A=84=E9=80=9A=E5=91=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/components/my-notice-item.vue | 163 ++++++++++++++++++++++++++++
 pages/components/my-notice.vue      | 148 +++++++++++++++++++++++++
 2 files changed, 311 insertions(+)
 create mode 100644 pages/components/my-notice-item.vue
 create mode 100644 pages/components/my-notice.vue

diff --git a/pages/components/my-notice-item.vue b/pages/components/my-notice-item.vue
new file mode 100644
index 0000000..4d612a5
--- /dev/null
+++ b/pages/components/my-notice-item.vue
@@ -0,0 +1,163 @@
+<template>
+	<view class="my-notice-item-box">
+		<view class="notice-status">进行中</view>
+		<view class="report-title">
+			<text class="status-text">已报名</text>
+			<view class="time-text">2025-04-03 10:07:32</view>
+		</view>
+		<!-- 通告信息 -->
+		<view class="notice-main-box">
+			<notice-item :dataObj="item"></notice-item>
+		</view>
+		<!-- 操作按钮 -->
+		<view class="opt-button-box">
+			<view class="opt-item">追加留言</view>
+			<view class="opt-item">查看详情</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import noticeItem from '@/pages/components/notice-item.vue'
+	export default {
+		components: {
+			noticeItem
+		},
+		data() {
+			return {
+				item: {
+					"creator": "1",
+					"createTime": "2025-03-28 15:41:18",
+					"updater": "1",
+					"updateTime": "2025-03-28 15:41:18",
+					"delFlag": "0",
+					"params": {},
+					"id": "4797bd2c87bd5c2a480e412f6adb2459",
+					"userId": 103,
+					"title": "找小红书达人种草【蓝月亮】洗衣液",
+					"platformCode": "xiaohongshu",
+					"province": "河北省",
+					"city": "唐山市",
+					"feeDown": 100.00,
+					"feeUp": null,
+					"isSelfPrice": 0,
+					"giftDetail": null,
+					"giftPrice": null,
+					"endDate": "2025-03-31",
+					"brand": "蓝月亮",
+					"isShowBrand": 1,
+					"needNum": 100,
+					"fansDown": 100,
+					"fansUp": 100000,
+					"isEligible": 0,
+					"pic": null,
+					"collect": null,
+					"detail": "<p>找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液找小红书达人种草【蓝月亮】洗衣液</p>",
+					"images": "/profile/upload/2025/03/28/0306359214743be86f4d8f6dea4e5d0_20250328154103A008.png,/profile/upload/2025/03/28/1_20250328154109A009.png,/profile/upload/2025/03/28/2_20250328154109A010.png,/profile/upload/2025/03/28/3_20250328154109A011.png,/profile/upload/2025/03/28/4_20250328154109A012.png,/profile/upload/2025/03/28/5_20250328154109A013.png",
+					"bloggerTypes": "洗护,美妆,食品",
+					"isShowTel": 1,
+					"wechat": null,
+					"tel": null,
+					"groupImage": "/profile/upload/2025/03/28/0306359214743be86f4d8f6dea4e5d0_20250328154059A007.png",
+					"isUseCoupon": 0,
+					"approvalStatus": "1",
+					"approvalUserId": null,
+					"approvalTime": null,
+					"approvalRemark": null,
+					"similarityIds": null,
+					"userNickName": "微信用户",
+					"avatar": "",
+					"platformName": null,
+					"isSuper": null,
+					"signStatus": null,
+					"mainImage": "/profile/upload/2025/03/28/0306359214743be86f4d8f6dea4e5d0_20250328154103A008.png",
+					"viewNum": 31,
+					"reportNum": 0,
+					"bloggerTypesText": "洗护 美妆 食品",
+					"approvalUserName": null
+				}
+			}
+		},
+		methods: {}
+	}
+</script>
+
+<style lang="scss">
+	.my-notice-item-box:first-child {
+		margin-top: 20rpx;
+	}
+
+	.my-notice-item-box {
+		width: 100%;
+		border-radius: 20rpx;
+		padding: 30rpx 20rpx;
+		background-color: white;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		margin-bottom: 20rpx;
+		position: relative;
+
+		.notice-status {
+			position: absolute;
+			right: 0;
+			top: 0;
+			font-size: 20rpx;
+			background-color: #FC1F3E;
+			color: white;
+			border-radius: 0 20rpx 0 20rpx;
+			padding: 7rpx 14rpx;
+		}
+
+		.report-title {
+			width: 100%;
+			display: flex;
+			align-items: flex-end;
+			justify-content: start;
+
+			.time-text {
+				flex: 1;
+				display: flex;
+				justify-content: flex-end;
+				align-items: center;
+				font-size: 20rpx;
+				color: #929292;
+			}
+
+			.status-text {
+				width: 200rpx;
+				font-size: 32rpx;
+				font-weight: bold;
+				padding: 5rpx;
+			}
+		}
+
+		.notice-main-box {
+			font-size: 29rpx;
+			width: 100%;
+			margin-top: 20rpx;
+			background-color: #FAFAFA;
+			border-radius: 20rpx;
+			margin-bottom: 20rpx;
+		}
+
+		.opt-button-box {
+			width: 100%;
+			font-size: 30rpx;
+			padding-top: 10rpx;
+			display: flex;
+			justify-content: flex-end;
+			align-items: center;
+
+			.opt-item {
+				padding: 10rpx 25rpx;
+				margin-left: 20rpx;
+				color: #626464;
+				background-color: white;
+				border: 1rpx solid #C8C8C8;
+				border-radius: 40rpx;
+			}
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pages/components/my-notice.vue b/pages/components/my-notice.vue
new file mode 100644
index 0000000..b6a5d97
--- /dev/null
+++ b/pages/components/my-notice.vue
@@ -0,0 +1,148 @@
+<template>
+	<view class="my-notice-box">
+		<!-- 标题 -->
+		<view class="dl-title">
+			我的通告
+		</view>
+		<!-- 菜单 -->
+		<view class="dl-menu-box">
+			<view v-for="(item,index) in menus" @click="itemClick(index,item)" class="dl-menu"
+				:class="index==menuIndex?'dl-menu click':'dl-menu'">{{item}}</view>
+		</view>
+		<!-- 通告列表 -->
+		<view class="dl-body">
+			<view class="dl-item-box">
+				<scroll-view style="height: 100%;" scroll-y="true" @scrolltolower="onReachBottomCus" refresher-enabled
+					@refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
+					<my-notice-item v-if="dataList.length>0" :dataList="dataList"></my-notice-item>
+					<my-notice-item v-if="dataList.length>0" :dataList="dataList"></my-notice-item>
+					<my-notice-item v-if="dataList.length>0" :dataList="dataList"></my-notice-item>
+					<my-notice-item v-if="dataList.length>0" :dataList="dataList"></my-notice-item>
+					<!-- <view style="text-align: center" v-if="dataList.length==0">
+						<image class="" src="@/static/images/nothing.png"></image>
+					</view> -->
+				</scroll-view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		toast,
+		hasRights
+	} from '@/utils/common.js'
+	import myNoticeItem from '@/pages/components/my-notice-item.vue'
+	export default {
+		components: {
+			myNoticeItem
+		},
+		data() {
+			return {
+				menus: ['全部', '已报名', '待审核', '待发布', '已完成', '未合作'],
+				menuIndex: 0,
+				dataList: ['', ''],
+				queryParams: {
+					pageNum: 1,
+					pageSize: 10,
+				},
+				total: 0,
+				//下来刷新状态
+				isTriggered: false
+			}
+		},
+		methods: {
+			/**
+			 * 菜单点击
+			 * @param {Object} index
+			 * @param {Object} item
+			 */
+			itemClick(index, item) {
+				this.menuIndex = index
+			},
+			/**
+			 * 上滑加载数据
+			 */
+			onReachBottomCus() {
+				//判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
+				if (this.queryParams.pageNum * this.queryParams.pageSize >= this.total) {
+					toast("没有更多数据了")
+					return
+				}
+				//页码+1,调用获取数据的方法获取第二页数据
+				this.queryParams.pageNum++
+			},
+			/**
+			 * 下拉刷新数据
+			 */
+			onRefresherrefresh() {
+				this.isTriggered = true
+				this.queryParams.pageNum = 1
+				this.total = 0
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.my-notice-box {
+		padding-top: var(--status-bar-height);
+		width: 100%;
+		color: #363636;
+		background-color: white;
+		font-size: 38rpx;
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: start;
+		position: relative;
+
+		.dl-title {
+			font-size: 32rpx;
+			width: 100%;
+			position: relative;
+			text-align: center;
+			font-weight: bold;
+			z-index: 10;
+			padding: 62rpx 0 15rpx 15rpx;
+			border-bottom: 1px solid #F4F4F4;
+		}
+
+		.dl-menu-box {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 100%;
+			padding-top: 20rpx;
+
+			.dl-menu {
+				flex-grow: 1;
+				font-size: 30rpx;
+				margin: 0 20rpx;
+				padding-bottom: 12rpx;
+				text-align: center;
+			}
+
+			.click {
+				color: #FF434E;
+				font-weight: bold;
+				border-bottom: 3px solid #FF434E;
+			}
+		}
+
+		.dl-body {
+			flex: 1;
+			width: 100%;
+			height: 100%;
+			background-color: #EEEEEE;
+			padding: 0 20rpx 0 20rpx;
+
+			.dl-item-box {
+				height: calc(100vh - var(--status-bar-height) - var(--window-bottom) - 337rpx);
+				isplay: flex;
+				flex-direction: column;
+			}
+		}
+	}
+</style>
\ No newline at end of file