xiebaomin 1 year ago
parent
commit
643c42bf15

+ 14 - 0
pages.json

@@ -602,6 +602,20 @@
 						"enablePullDownRefresh": true
 					}
 				},
+                {
+                	"path": "club/notice-article",
+                	"style": {
+                		"navigationBarTitleText": "最新文章",
+                		"enablePullDownRefresh": true
+                	}
+                },
+                {
+                	"path": "club/notice-activity",
+                	"style": {
+                		"navigationBarTitleText": "最新活动",
+                		"enablePullDownRefresh": true
+                	}
+                },
 				{
 					"path": "club/notice-coupon",
 					"style": {

+ 35 - 1
pages/notice/club/components/notice-cell.vue

@@ -70,7 +70,41 @@
 					{{ noticeCouponText(cell)}}
 				</view> 
 			</view>
-		</template>
+		</template>
+        <!-- 文章最新通知 -->
+        <template v-if="cellType === 5">
+            <view class="tui-notice-cell">
+            	<view class="tui-cell-top">
+            		<view class="cell-title"> 最新文章通知 </view>
+            		<view class="cell-time"> {{ cell.time }} </view>
+            	</view>
+            	<view class="tui-cell-content"> 
+            		<view class="cell-image">
+            			<img :src="cell.mainImage" alt="">
+            		</view>
+            		<view class="tui-cell-content">
+            			{{ cell.articleContent }}
+            		</view> 
+            	</view> 
+            </view>
+        </template>
+        <!-- 最新活动通知 -->
+        <template v-if="cellType === 6">
+        	<view class="tui-notice-cell clearfix">
+        		<view class="tui-cell-top">
+        			<view class="cell-title"> 最新活动通知 </view>
+        			<view class="cell-time"> {{ cell.time }} </view>
+        		</view>
+                <view class="tui-cell-content">
+                	<view class="cell-image">
+                		<img :src="cell.mainImage" alt="">
+                	</view>
+                    <view class="tui-cell-content"> 
+                        {{ cell.activityContent }}
+                    </view> 
+                </view> 
+        	</view>
+        </template>
 	</view>
 </template>
 

+ 1 - 1
pages/notice/club/mixins/notice.mixins.js

@@ -37,7 +37,7 @@ const noticeMixins = {
                 3: '优惠券待领取通知'
             }
             return map[value]
-        },
+        }
     },
     methods: {
         getUserAuthClubMessageList() {

+ 224 - 0
pages/notice/club/notice-activity.vue

@@ -0,0 +1,224 @@
+<template>
+	<view class="container cart clearfix">
+		<tui-skeleton
+			v-if="skeletonShow"
+			backgroundColor="#fafafa"
+			borderRadius="10rpx"
+			:isLoading="true"
+			:loadingType="5"
+		></tui-skeleton>
+		<view class="container-main" v-else>
+			<view class="clearfix">
+				<!-- 空白页 -->
+				<view class="empty-container" v-if="isEmpty">
+					<image class="empty-container-image" :src="StaticUrl + '/icon/icon-notice-empty@2x.png'"></image>
+					<text class="error-text">暂无任何消息~</text>
+				</view>
+				<!-- 列表 -->
+				<view
+					class="tui-notice"
+					v-else
+					v-for="(cell, index) in list"
+					:key="index"
+					@click.stop="handleOrderClick(cell)"
+				>
+					<tui-swipe-action :operateWidth="80" :backgroundColor="'#F7F7F7'">
+						<template v-slot:content>
+							<notice-cell :cellType="6" :cell="cell"></notice-cell>
+						</template>
+						<template v-slot:button>
+							<view class="tui-custom-btn_box">
+								<view class="tui-custom-btn" @click.stop="deleteBtn(cell.id, index)">
+									<text class="iconfont icon-shanchu3"></text>
+								</view>
+							</view>
+						</template>
+					</tui-swipe-action>
+				</view>
+				<!--加载loadding-->
+				<tui-loadmore :visible="loadding" :index="3" type="black" />
+				<tui-nomore :visible="!pullUpOn" :backgroundColor="'#F7F7F7'" :text="nomoreText" />
+				<!--加载loadding-->
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+import { mapState, mapMutations } from 'vuex'
+import noticeMixins from './mixins/notice.mixins.js'
+import noticeCell from './components/notice-cell.vue'
+export default {
+	mixins: [noticeMixins],
+	components: {
+		noticeCell
+	},
+	data() {
+		return {
+			skeletonShow: true,
+			StaticUrl: this.$Static,
+			listQuery: {
+				source: 2,
+				commonId: 0,
+				messageType: 0,
+				pageNum: 1,
+				pageSize: 10
+			},
+			list: [],
+			isEmpty: false,
+			loadding: false,
+			pullUpOn: true,
+			pullFlag: true,
+			hasNextPage: false,
+			nomoreText: '上拉显示更多'
+		}
+	},
+	onLoad(option) {
+		this.initData(option)
+	},
+	methods: {
+		async initData(option) {
+			const userInfo = await this.$api.getStorage()
+			this.listQuery.messageType = option.messageType
+			this.listQuery.commonId = userInfo.clubId ? userInfo.clubId : 0
+			this.getUserAuthClubMessageList()
+		},
+		handleOrderClick(cell) {
+            console.log(cell)
+			this.$api.navigateTo()
+		},
+	},
+	onReachBottom() {
+		if (this.hasNextPage) {
+			this.loadding = true
+			this.pullUpOn = true
+			this.getReachBottomData()
+		}
+	},
+	onPullDownRefresh() {
+		//下拉刷新
+		this.listQuery.pageNum = 1
+		this.getUserAuthClubMessageList()
+		uni.stopPullDownRefresh()
+	},
+	onShow() {}
+}
+</script>
+
+<style lang="scss">
+page {
+	background-color: #f7f7f7;
+}
+.container-main {
+	width: 100%;
+	box-sizing: border-box;
+	padding: 24rpx 0;
+	.empty-container-image {
+		width: 260rpx;
+		height: 260rpx;
+		margin-top: -300rpx;
+	}
+}
+.tui-notice {
+	margin-bottom: 24rpx;
+}
+.tui-notice-cell {
+	width: 702rpx;
+	height: auto;
+	background-color: #ffffff;
+	border-radius: 16rpx;
+	box-sizing: border-box;
+	padding: 16rpx 24rpx;
+	margin: 0 auto;
+	.tui-cell-top {
+		width: 100%;
+		height: 88rpx;
+		line-height: 88rpx;
+		.cell-title {
+			font-size: 32rpx;
+			color: #333333;
+			float: left;
+			font-weight: bold;
+		}
+		.cell-time {
+			font-size: 24rpx;
+			color: #999999;
+			float: right;
+		}
+	}
+	.tui-cell-content {
+		width: 100%;
+		height: 160rpx;
+		box-sizing: border-box;
+		padding: 16rpx;
+		border-radius: 8rpx;
+		background-color: #f7f7f7;
+		.cell-image {
+			width: 128rpx;
+			height: 128rpx;
+			border-radius: 8rpx;
+			float: left;
+			image {
+				width: 128rpx;
+				height: 128rpx;
+				display: block;
+				border-radius: 8rpx;
+			}
+		}
+		.cell-content {
+			width: 490rpx;
+			height: 100%;
+			box-sizing: border-box;
+			padding: 0 20rpx;
+			line-height: 40rpx;
+			font-size: 28rpx;
+			color: #666666;
+			text-align: justify;
+			float: left;
+		}
+	}
+	.tui-cell-bot {
+		width: 100%;
+		height: 80rpx;
+		box-sizing: border-box;
+		padding: 16rpx 0 0 0;
+		.tui-cell-btn {
+			width: 160rpx;
+			height: 64rpx;
+			border-radius: 35rpx;
+			box-sizing: border-box;
+			border: 1px solid #999999;
+			text-align: center;
+			line-height: 64rpx;
+			font-size: 26rpx;
+			color: #333333;
+			float: right;
+			margin-left: 24rpx;
+		}
+	}
+}
+.tui-custom-btn_box {
+	width: 80px;
+	height: 100%;
+	padding: 0 20rpx;
+	box-sizing: border-box;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	background-color: #f7f7f7;
+}
+
+.tui-custom-btn {
+	width: 56rpx;
+	height: 56rpx;
+	border-radius: 50%;
+	background-color: #f94b4b;
+	color: #ffffff;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-shrink: 0;
+	.icon-shanchu3 {
+		font-size: 32rpx;
+	}
+}
+</style>

+ 224 - 0
pages/notice/club/notice-article.vue

@@ -0,0 +1,224 @@
+<template>
+	<view class="container cart clearfix">
+		<tui-skeleton
+			v-if="skeletonShow"
+			backgroundColor="#fafafa"
+			borderRadius="10rpx"
+			:isLoading="true"
+			:loadingType="5"
+		></tui-skeleton>
+		<view class="container-main" v-else>
+			<view class="clearfix">
+				<!-- 空白页 -->
+				<view class="empty-container" v-if="isEmpty">
+					<image class="empty-container-image" :src="StaticUrl + '/icon/icon-notice-empty@2x.png'"></image>
+					<text class="error-text">暂无任何消息~</text>
+				</view>
+				<!-- 列表 -->
+				<view
+					class="tui-notice"
+					v-else
+					v-for="(cell, index) in list"
+					:key="index"
+					@click.stop="handleOrderClick(cell)"
+				>
+					<tui-swipe-action :operateWidth="80" :backgroundColor="'#F7F7F7'">
+						<template v-slot:content>
+							<notice-cell :cellType="5" :cell="cell"></notice-cell>
+						</template>
+						<template v-slot:button>
+							<view class="tui-custom-btn_box">
+								<view class="tui-custom-btn" @click.stop="deleteBtn(cell.id, index)">
+									<text class="iconfont icon-shanchu3"></text>
+								</view>
+							</view>
+						</template>
+					</tui-swipe-action>
+				</view>
+				<!--加载loadding-->
+				<tui-loadmore :visible="loadding" :index="3" type="black" />
+				<tui-nomore :visible="!pullUpOn" :backgroundColor="'#F7F7F7'" :text="nomoreText" />
+				<!--加载loadding-->
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+import { mapState, mapMutations } from 'vuex'
+import noticeMixins from './mixins/notice.mixins.js'
+import noticeCell from './components/notice-cell.vue'
+export default {
+	mixins: [noticeMixins],
+	components: {
+		noticeCell
+	},
+	data() {
+		return {
+			skeletonShow: true,
+			StaticUrl: this.$Static,
+			listQuery: {
+				source: 2,
+				commonId: 0,
+				messageType: 0,
+				pageNum: 1,
+				pageSize: 10
+			},
+			list: [],
+			isEmpty: false,
+			loadding: false,
+			pullUpOn: true,
+			pullFlag: true,
+			hasNextPage: false,
+			nomoreText: '上拉显示更多'
+		}
+	},
+	onLoad(option) {
+		this.initData(option)
+	},
+	methods: {
+		async initData(option) {
+			const userInfo = await this.$api.getStorage()
+			this.listQuery.messageType = option.messageType
+			this.listQuery.commonId = userInfo.clubId ? userInfo.clubId : 0
+			this.getUserAuthClubMessageList()
+		},
+		handleOrderClick(cell) {
+            console.log(cell)
+			this.$api.navigateTo()
+		},
+	},
+	onReachBottom() {
+		if (this.hasNextPage) {
+			this.loadding = true
+			this.pullUpOn = true
+			this.getReachBottomData()
+		}
+	},
+	onPullDownRefresh() {
+		//下拉刷新
+		this.listQuery.pageNum = 1
+		this.getUserAuthClubMessageList()
+		uni.stopPullDownRefresh()
+	},
+	onShow() {}
+}
+</script>
+
+<style lang="scss">
+page {
+	background-color: #f7f7f7;
+}
+.container-main {
+	width: 100%;
+	box-sizing: border-box;
+	padding: 24rpx 0;
+	.empty-container-image {
+		width: 260rpx;
+		height: 260rpx;
+		margin-top: -300rpx;
+	}
+}
+.tui-notice {
+	margin-bottom: 24rpx;
+}
+.tui-notice-cell {
+	width: 702rpx;
+	height: auto;
+	background-color: #ffffff;
+	border-radius: 16rpx;
+	box-sizing: border-box;
+	padding: 16rpx 24rpx;
+	margin: 0 auto;
+	.tui-cell-top {
+		width: 100%;
+		height: 88rpx;
+		line-height: 88rpx;
+		.cell-title {
+			font-size: 32rpx;
+			color: #333333;
+			float: left;
+			font-weight: bold;
+		}
+		.cell-time {
+			font-size: 24rpx;
+			color: #999999;
+			float: right;
+		}
+	}
+	.tui-cell-content {
+		width: 100%;
+		height: 160rpx;
+		box-sizing: border-box;
+		padding: 16rpx;
+		border-radius: 8rpx;
+		background-color: #f7f7f7;
+		.cell-image {
+			width: 128rpx;
+			height: 128rpx;
+			border-radius: 8rpx;
+			float: left;
+			image {
+				width: 128rpx;
+				height: 128rpx;
+				display: block;
+				border-radius: 8rpx;
+			}
+		}
+		.cell-content {
+			width: 490rpx;
+			height: 100%;
+			box-sizing: border-box;
+			padding: 0 20rpx;
+			line-height: 40rpx;
+			font-size: 28rpx;
+			color: #666666;
+			text-align: justify;
+			float: left;
+		}
+	}
+	.tui-cell-bot {
+		width: 100%;
+		height: 80rpx;
+		box-sizing: border-box;
+		padding: 16rpx 0 0 0;
+		.tui-cell-btn {
+			width: 160rpx;
+			height: 64rpx;
+			border-radius: 35rpx;
+			box-sizing: border-box;
+			border: 1px solid #999999;
+			text-align: center;
+			line-height: 64rpx;
+			font-size: 26rpx;
+			color: #333333;
+			float: right;
+			margin-left: 24rpx;
+		}
+	}
+}
+.tui-custom-btn_box {
+	width: 80px;
+	height: 100%;
+	padding: 0 20rpx;
+	box-sizing: border-box;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	background-color: #f7f7f7;
+}
+
+.tui-custom-btn {
+	width: 56rpx;
+	height: 56rpx;
+	border-radius: 50%;
+	background-color: #f94b4b;
+	color: #ffffff;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-shrink: 0;
+	.icon-shanchu3 {
+		font-size: 32rpx;
+	}
+}
+</style>

+ 289 - 267
pages/tabBar/notice/index.vue

@@ -1,267 +1,289 @@
-<template>
-	<view class="notice clearfix" :style="{ paddingTop: CustomBar + 'px' }">
-		<tui-skeleton
-			v-if="skeletonShow"
-			backgroundColor="#fafafa"
-			borderRadius="10rpx"
-			:isLoading="true"
-			:loadingType="5"
-		></tui-skeleton>
-		<view v-else>
-			<view class="navbar-wrap" :style="{ height: CustomBar + 'px', paddingTop: StatusBar + 'px' }">
-				<view
-					class="navbar-text"
-					:style="{ lineHeight: CustomBar - StatusBar + 'px;', fontSize: fontSizeSetting + 'px;' }"
-				>
-					消息 <text @click="clearNews" class="iconfont icon-qingli"></text>
-				</view>
-			</view>
-			<view class="container-notice">
-				<view class="notice-cell" @click="navigator('/pages/notice/club/notice-order?messageType=1')">
-					<view class="notice-cell-icon">
-						<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-order@2x.png'" mode=""></image>
-					</view>
-					<view class="notice-cell-text"> 交易物流 <text class="cell-text">官方</text> </view>
-					<view class="notice-cell-badge" v-if="tradeCount > 0">
-						<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
-							{{ tradeCount | BadgeType }}
-						</text>
-					</view>
-				</view>
-				<view class="notice-cell" @click="navigator('/pages/notice/club/notice-users?messageType=2')">
-					<view class="notice-cell-icon">
-						<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-users@2x.png'" mode=""></image>
-					</view>
-					<view class="notice-cell-text"> 账户通知 <text class="cell-text">官方</text> </view>
-					<view class="notice-cell-badge" v-if="accountCount > 0">
-						<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
-							{{ accountCount | BadgeType }}
-						</text>
-					</view>
-				</view>
-				<view class="notice-cell" @click="navigator('/pages/notice/club/notice-serve?messageType=3')">
-					<view class="notice-cell-icon">
-						<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-serve@2x.png'" mode=""></image>
-					</view>
-					<view class="notice-cell-text"> 服务通知 <text class="cell-text">官方</text> </view>
-					<view class="notice-cell-badge" v-if="notificationCount > 0">
-						<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
-							{{ notificationCount | BadgeType }}
-						</text>
-					</view>
-				</view>
-				<view class="notice-cell" @click="navigator('/pages/notice/club/notice-coupon?messageType=4')">
-					<view class="notice-cell-icon">
-						<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-coupon@2x.png'" mode=""></image>
-					</view>
-					<view class="notice-cell-text"> 优惠促销 <text class="cell-text">官方</text> </view>
-					<view class="notice-cell-badge" v-if="promotionCount > 0">
-						<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
-							{{ promotionCount | BadgeType }}
-						</text>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
-</template>
-<script>
-import { mapState, mapMutations } from 'vuex'
-export default {
-	data() {
-		return {
-			CustomBar: this.CustomBar,
-			StatusBar: this.StatusBar,
-			StaticUrl: this.$Static,
-			skeletonShow: true,
-			clubId: 0,
-			allCount:0,
-			tradeCount: 0,
-			accountCount: 0,
-			notificationCount: 0,
-			promotionCount: 0
-		}
-	},
-	onLoad() {},
-	filters: {
-		BadgeType(value) {
-			if (value) {
-				return value > 99 ? '99+' : value
-			}
-		}
-	},
-	computed: {
-		...mapState(['hasLogin', 'userInfo'])
-	},
-	methods: {
-		...mapMutations(['updateNoticeNum']),
-		async initData() {
-			const userInfo = await this.$api.getStorage()
-			this.skeletonShow = true //预加载圆圈
-			this.clubId = userInfo.clubId ? userInfo.clubId : 0
-			this.updateNoticeNum()
-			this.getUserAuthClubMessageCount()
-		},
-		clearNews() {
-			// 标记消息已读
-			if(this.allCount == 0){
-				this.$util.msg('暂无未读消息', 2000)
-				return
-			}
-			this.UserService.authUpdateMessageAsRead({ commonId:this.clubId,messageType: '' })
-				.then(response => {
-					uni.vibrateShort({
-						success: function() {
-							console.log('success')
-						}
-					})
-					this.initData()
-					this.$util.msg('已将所有消息标记为已读', 2000)
-				})
-				.catch(error => {
-					console.log('标记通知消息已读', error.msg)
-				})
-		},
-		getUserAuthClubMessageCount() {
-			//供应商详情
-			this.UserService.getUserAuthClubMessageCount({ commonId: this.clubId })
-				.then(response => {
-					this.allCount = response.data.count
-					this.tradeCount = response.data.tradeCount // 交易物流
-					this.accountCount = response.data.account // 账户通知
-					this.notificationCount = response.data.notificationCount // 服务通知
-					this.promotionCount = response.data.promotionCount // 优惠促销
-					this.skeletonShow = false //预加载圆圈隐藏
-				})
-				.catch(error => {
-					this.$util.msg(error.msg, 2000)
-				})
-			this.skeletonShow = false
-		},
-		initLogin() {
-			this.$api.redirectTo('/pages/login/login')
-		},
-		navigator(url) {
-			this.$api.navigateTo(url)
-		}
-	},
-	onPullDownRefresh() {
-		//下拉刷新
-		this.initData()
-		uni.stopPullDownRefresh()
-	},
-	onShow() {
-		if (this.hasLogin) {
-			this.initData()
-		} else {
-			this.initLogin()
-		}
-	}
-}
-</script>
-
-<style lang="scss">
-.navbar-wrap {
-	position: fixed;
-	width: 100%;
-	top: 0;
-	z-index: 100000;
-	box-sizing: border-box;
-	background: #ffffff;
-	.navbar-text {
-		font-size: 30rpx;
-		color: #000000;
-		font-weight: 500;
-		text-align: center;
-		.iconfont {
-			display: inline-block;
-			width: 48rpx;
-			height: 48rpx;
-			border-radius: 50%;
-			background-color: #f5f5f5;
-			text-align: center;
-			line-height: 48rpx;
-			color: #666666;
-			font-size: 30rpx;
-			margin-left: 20rpx;
-		}
-	}
-}
-.container-notice {
-	width: 100%;
-	height: auto;
-	box-sizing: border-box;
-	padding: 0 24rpx;
-	padding-top: 20rpx;
-	.notice-cell {
-		width: 100%;
-		height: 130rpx;
-		box-sizing: border-box;
-		padding: 19rpx 0;
-		border-bottom: 1px solid #e1e1e1;
-		.notice-cell-icon {
-			width: 92rpx;
-			height: 92rpx;
-			float: left;
-			.icon-image {
-				width: 92rpx;
-				height: 92rpx;
-				display: block;
-			}
-		}
-		.notice-cell-text {
-			width: 400rpx;
-			height: 100%;
-			line-height: 92rpx;
-			font-size: 34rpx;
-			text-align: left;
-			margin-left: 24rpx;
-			float: left;
-			.cell-text {
-				display: inline-block;
-				height: 32rpx;
-				padding: 0 11rpx;
-				line-height: 32rpx;
-				border-radius: 20rpx;
-				text-align: center;
-				border: 1px solid #FF5B00;
-				font-size: 24rpx;
-				color: #FF5B00;
-				margin-left: 10rpx;
-			}
-		}
-		.notice-cell-badge {
-			width: 92rpx;
-			height: 92rpx;
-			float: right;
-			box-sizing: border-box;
-			padding: 25rpx 15rpx;
-			text-align: right;
-		}
-	}
-}
-.uni-badge--small {
-	-webkit-transform: scale(0.8);
-	-ms-transform: scale(0.8);
-	transform: scale(0.8);
-	-webkit-transform-origin: center center;
-	-ms-transform-origin: center center;
-	transform-origin: center center;
-}
-.uni-badge {
-	font-family: 'Helvetica Neue', Helvetica, sans-serif;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-	font-size: 12px;
-	line-height: 1;
-	display: inline-block;
-	padding: 3px 6px;
-	color: #333;
-	border-radius: 100px;
-	background-color: #f1f1f1;
-}
-.uni-badge-error {
-	color: #fff;
-	background-color: #ff2a2a;
-}
-</style>
+<template>
+	<view class="notice clearfix" :style="{ paddingTop: CustomBar + 'px' }">
+		<tui-skeleton
+			v-if="skeletonShow"
+			backgroundColor="#fafafa"
+			borderRadius="10rpx"
+			:isLoading="true"
+			:loadingType="5"
+		></tui-skeleton>
+		<view v-else>
+			<view class="navbar-wrap" :style="{ height: CustomBar + 'px', paddingTop: StatusBar + 'px' }">
+				<view
+					class="navbar-text"
+					:style="{ lineHeight: CustomBar - StatusBar + 'px;', fontSize: fontSizeSetting + 'px;' }"
+				>
+					消息 <text @click="clearNews" class="iconfont icon-qingli"></text>
+				</view>
+			</view>
+			<view class="container-notice">
+				<view class="notice-cell" @click="navigator('/pages/notice/club/notice-order?messageType=1')">
+					<view class="notice-cell-icon">
+						<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-order@2x.png'" mode=""></image>
+					</view>
+					<view class="notice-cell-text"> 交易物流 <text class="cell-text">官方</text> </view>
+					<view class="notice-cell-badge" v-if="tradeCount > 0">
+						<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
+							{{ tradeCount | BadgeType }}
+						</text>
+					</view>
+				</view>
+				<view class="notice-cell" @click="navigator('/pages/notice/club/notice-users?messageType=2')">
+					<view class="notice-cell-icon">
+						<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-users@2x.png'" mode=""></image>
+					</view>
+					<view class="notice-cell-text"> 账户通知 <text class="cell-text">官方</text> </view>
+					<view class="notice-cell-badge" v-if="accountCount > 0">
+						<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
+							{{ accountCount | BadgeType }}
+						</text>
+					</view>
+				</view>
+				<view class="notice-cell" @click="navigator('/pages/notice/club/notice-serve?messageType=3')">
+					<view class="notice-cell-icon">
+						<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-serve@2x.png'" mode=""></image>
+					</view>
+					<view class="notice-cell-text"> 服务通知 <text class="cell-text">官方</text> </view>
+					<view class="notice-cell-badge" v-if="notificationCount > 0">
+						<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
+							{{ notificationCount | BadgeType }}
+						</text>
+					</view>
+				</view>
+				<view class="notice-cell" @click="navigator('/pages/notice/club/notice-coupon?messageType=4')">
+					<view class="notice-cell-icon">
+						<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-coupon@2x.png'" mode=""></image>
+					</view>
+					<view class="notice-cell-text"> 优惠促销 <text class="cell-text">官方</text> </view>
+					<view class="notice-cell-badge" v-if="promotionCount > 0">
+						<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
+							{{ promotionCount | BadgeType }}
+						</text>
+					</view>
+				</view>
+                <view class="notice-cell" @click="navigator('/pages/notice/club/notice-article?messageType=5')">
+                	<view class="notice-cell-icon">
+                		<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-text@2x.png'" mode=""></image>
+                	</view>
+                	<view class="notice-cell-text"> 最新文章 <text class="cell-text">官方</text> </view>
+                	<view class="notice-cell-badge" v-if="promotionCount > 0">
+                		<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
+                			{{ promotionCount | BadgeType }}
+                		</text>
+                	</view>
+                </view>
+                <view class="notice-cell" @click="navigator('/pages/notice/club/notice-activity?messageType=6')">
+                	<view class="notice-cell-icon">
+                		<image class="icon-image" :src="StaticUrl + 'icon/icon-notice-active@2x.png'" mode=""></image>
+                	</view>
+                	<view class="notice-cell-text"> 最新活动 <text class="cell-text">官方</text> </view>
+                	<view class="notice-cell-badge" v-if="promotionCount > 0">
+                		<text class="uni-badge uni-badge-error uni-small uni-badge--small icon-num">
+                			{{ promotionCount | BadgeType }}
+                		</text>
+                	</view>
+                </view>
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+import { mapState, mapMutations } from 'vuex'
+export default {
+	data() {
+		return {
+			CustomBar: this.CustomBar,
+			StatusBar: this.StatusBar,
+			StaticUrl: this.$Static,
+			skeletonShow: true,
+			clubId: 0,
+			allCount:0,
+			tradeCount: 0,
+			accountCount: 0,
+			notificationCount: 0,
+			promotionCount: 0
+		}
+	},
+	onLoad() {},
+	filters: {
+		BadgeType(value) {
+			if (value) {
+				return value > 99 ? '99+' : value
+			}
+		}
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo'])
+	},
+	methods: {
+		...mapMutations(['updateNoticeNum']),
+		async initData() {
+			const userInfo = await this.$api.getStorage()
+			this.skeletonShow = true //预加载圆圈
+			this.clubId = userInfo.clubId ? userInfo.clubId : 0
+			this.updateNoticeNum()
+			this.getUserAuthClubMessageCount()
+		},
+		clearNews() {
+			// 标记消息已读
+			if(this.allCount == 0){
+				this.$util.msg('暂无未读消息', 2000)
+				return
+			}
+			this.UserService.authUpdateMessageAsRead({ commonId:this.clubId,messageType: '' })
+				.then(response => {
+					uni.vibrateShort({
+						success: function() {
+							console.log('success')
+						}
+					})
+					this.initData()
+					this.$util.msg('已将所有消息标记为已读', 2000)
+				})
+				.catch(error => {
+					console.log('标记通知消息已读', error.msg)
+				})
+		},
+		getUserAuthClubMessageCount() {
+			//供应商详情
+			this.UserService.getUserAuthClubMessageCount({ commonId: this.clubId })
+				.then(response => {
+					this.allCount = response.data.count
+					this.tradeCount = response.data.tradeCount // 交易物流
+					this.accountCount = response.data.account // 账户通知
+					this.notificationCount = response.data.notificationCount // 服务通知
+					this.promotionCount = response.data.promotionCount // 优惠促销
+					this.skeletonShow = false //预加载圆圈隐藏
+				})
+				.catch(error => {
+					this.$util.msg(error.msg, 2000)
+				})
+			this.skeletonShow = false
+		},
+		initLogin() {
+			this.$api.redirectTo('/pages/login/login')
+		},
+		navigator(url) {
+			this.$api.navigateTo(url)
+		}
+	},
+	onPullDownRefresh() {
+		//下拉刷新
+		this.initData()
+		uni.stopPullDownRefresh()
+	},
+	onShow() {
+		if (this.hasLogin) {
+			this.initData()
+		} else {
+			this.initLogin()
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.navbar-wrap {
+	position: fixed;
+	width: 100%;
+	top: 0;
+	z-index: 100000;
+	box-sizing: border-box;
+	background: #ffffff;
+	.navbar-text {
+		font-size: 30rpx;
+		color: #000000;
+		font-weight: 500;
+		text-align: center;
+		.iconfont {
+			display: inline-block;
+			width: 48rpx;
+			height: 48rpx;
+			border-radius: 50%;
+			background-color: #f5f5f5;
+			text-align: center;
+			line-height: 48rpx;
+			color: #666666;
+			font-size: 30rpx;
+			margin-left: 20rpx;
+		}
+	}
+}
+.container-notice {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	padding: 0 24rpx;
+	padding-top: 20rpx;
+	.notice-cell {
+		width: 100%;
+		height: 130rpx;
+		box-sizing: border-box;
+		padding: 19rpx 0;
+		border-bottom: 1px solid #e1e1e1;
+		.notice-cell-icon {
+			width: 92rpx;
+			height: 92rpx;
+			float: left;
+			.icon-image {
+				width: 92rpx;
+				height: 92rpx;
+				display: block;
+			}
+		}
+		.notice-cell-text {
+			width: 400rpx;
+			height: 100%;
+			line-height: 92rpx;
+			font-size: 34rpx;
+			text-align: left;
+			margin-left: 24rpx;
+			float: left;
+			.cell-text {
+				display: inline-block;
+				height: 32rpx;
+				padding: 0 11rpx;
+				line-height: 32rpx;
+				border-radius: 20rpx;
+				text-align: center;
+				border: 1px solid #FF5B00;
+				font-size: 24rpx;
+				color: #FF5B00;
+				margin-left: 10rpx;
+			}
+		}
+		.notice-cell-badge {
+			width: 92rpx;
+			height: 92rpx;
+			float: right;
+			box-sizing: border-box;
+			padding: 25rpx 15rpx;
+			text-align: right;
+		}
+	}
+}
+.uni-badge--small {
+	-webkit-transform: scale(0.8);
+	-ms-transform: scale(0.8);
+	transform: scale(0.8);
+	-webkit-transform-origin: center center;
+	-ms-transform-origin: center center;
+	transform-origin: center center;
+}
+.uni-badge {
+	font-family: 'Helvetica Neue', Helvetica, sans-serif;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+	font-size: 12px;
+	line-height: 1;
+	display: inline-block;
+	padding: 3px 6px;
+	color: #333;
+	border-radius: 100px;
+	background-color: #f1f1f1;
+}
+.uni-badge-error {
+	color: #fff;
+	background-color: #ff2a2a;
+}
+</style>