|
@@ -0,0 +1,232 @@
|
|
|
+<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;' }"
|
|
|
+ >
|
|
|
+ 消息 <image class="iconfont icon-qingli" @click="clearNews" src="@/static/tabBar/clean_notice.png"></image>
|
|
|
+ </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="@/static/tabBar/play_notice.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="@/static/tabBar/user_notice.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="@/" 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="@/static/tabBar/preferential_notice.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 { mapGetters, mapMutations } from 'vuex'
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ skeletonShow: true,
|
|
|
+ // CustomBar: this.CustomBar,
|
|
|
+ // StatusBar: this.StatusBar,
|
|
|
+ // fontSizeSetting: this.fontSizeSetting,
|
|
|
+ CustomBar: '',
|
|
|
+ StatusBar: '',
|
|
|
+ fontSizeSetting: '',
|
|
|
+ StaticUrl: '',
|
|
|
+ clubId: 0,
|
|
|
+ allCount:0,
|
|
|
+ tradeCount: 0,
|
|
|
+ accountCount: 0,
|
|
|
+ notificationCount: 0,
|
|
|
+ promotionCount: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ BadgeType: (val) => (val && val >= 99 ? '99+' : val), // 红点的提示信息
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ // ...mapGetters(['hasLogin'])
|
|
|
+ },
|
|
|
+ watch: {},
|
|
|
+ onPullDownRefresh() {
|
|
|
+ uni.stopPullDownRefresh()
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ if (!this.$store.getters.hasLogin) {
|
|
|
+ this.initData()
|
|
|
+ } else {
|
|
|
+ this.initLogin()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ initLogin() {
|
|
|
+ console.log(111)
|
|
|
+ uni.reLaunch({
|
|
|
+ url: 'pages/tabBar/user/user'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ initData() {
|
|
|
+ this.skeletonShow = false
|
|
|
+ },
|
|
|
+ getSystomInfo() {
|
|
|
+ uni.getSystemInfo({
|
|
|
+ success: (e) => {
|
|
|
+ console.log(e)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ },
|
|
|
+ }
|
|
|
+</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 #e15616;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #e15616;
|
|
|
+ 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>
|