Browse Source

首页增加公告内容

Admin 3 years ago
parent
commit
7fcfaa14c8

+ 7 - 3
common/css/iconfont.scss

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 1519039 */
-  src: url('//at.alicdn.com/t/font_1519039_mxoh1k6nohe.woff2?t=1647230680693') format('woff2'),
-       url('//at.alicdn.com/t/font_1519039_mxoh1k6nohe.woff?t=1647230680693') format('woff'),
-       url('//at.alicdn.com/t/font_1519039_mxoh1k6nohe.ttf?t=1647230680693') format('truetype');
+  src: url('//at.alicdn.com/t/font_1519039_8ndehzm6pfp.woff2?t=1647332278079') format('woff2'),
+       url('//at.alicdn.com/t/font_1519039_8ndehzm6pfp.woff?t=1647332278079') format('woff'),
+       url('//at.alicdn.com/t/font_1519039_8ndehzm6pfp.ttf?t=1647332278079') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,10 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-xiaochengxu:before {
+  content: "\e731";
+}
+
 .icon-riqi:before {
   content: "\e66a";
 }

+ 116 - 0
components/cm-module/homeIndex/notice.vue

@@ -0,0 +1,116 @@
+<template>
+	<view>
+		<view class="tui-rolling-view">
+			<view class="tui-rolling-news">
+				<text class="tui-roll-label">公告:</text>
+				<swiper vertical autoplay circular interval="3000" class="tui-swiper">
+					<swiper-item v-for="(item,index) in list" :key="index" class="tui-swiper-item">
+						<view class="tui-news-item" @tap='detail(item)'>
+							<text class="iconfont icon-xiaochengxu"></text>
+							{{item.title}}
+						</view>
+					</swiper-item>
+				</swiper>
+				<view class="tui-roll-more" @tap='newsList(item)'>
+					更多<text class="iconfont icon-xiayibu"></text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		name:'address',
+		props:{
+			list:{
+				type:Array
+			}
+		},
+		data() {
+			return{
+				
+			}
+		},
+		created(){
+			
+		},
+		computed: {
+	
+		},
+		methods:{
+			detail(item){// 跳转公告详情
+				this.$api.navigateTo(`/pages/service/news-detailes?id=${item.id}`)
+			},
+			newsList(){// 公告列表
+				this.$api.navigateTo(`/pages/service/news-list`)
+			},
+			swiperChange(e) {//轮播图切换
+				const index = e.detail.current
+				this.current = index
+			},
+			NavToDetailPage(floor) {//跳转
+				this.$api.FlooryNavigateTo(floor)
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.tui-rolling-view{
+		width: 100%;
+		height: 96rpx;
+		background-color: #F7F7F7;
+		box-sizing: border-box;
+		padding: 32rpx 24rpx 0 24rpx;
+	}
+	.tui-rolling-news {
+		width: 100%;
+		padding: 0 20rpx;
+		border-radius: 8rpx;
+		box-sizing: border-box;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-wrap: nowrap;
+		line-height: 56rpx;
+		background: $btn-confirm;
+		.tui-roll-label{
+			font-weight: bold;
+			font-size: $font-size-26;
+			color: #FFFFFF;
+		}
+		.tui-roll-more{
+			font-size: $font-size-24;
+			color: #FFFFFF;
+			.icon-xiayibu{
+				font-size: $font-size-22;
+			}
+		}
+	}
+	
+	.tui-swiper {
+		font-size: 28rpx;
+		height: 50rpx;
+		flex: 1;
+	}
+	
+	.tui-swiper-item {
+		display: flex;
+		align-items: center
+	}
+	
+	.tui-news-item {
+		line-height: 28rpx;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		font-size: $font-size-24;
+		color: #FFFFFF;
+		.icon-xiaochengxu{
+			font-size: $font-size-24;
+			margin-right: 10rpx;
+		}
+	}
+	
+</style>

+ 13 - 0
pages.json

@@ -61,6 +61,19 @@
                     "style": {
                         "navigationBarTitleText": "条款内容"
                     }
+                },
+                {
+                    "path": "news-list",
+                    "style": {
+                        "navigationBarTitleText": "公告",
+						"enablePullDownRefresh": true
+                    }
+                },
+                {
+                    "path": "news-detailes",
+                    "style": {
+                        "navigationBarTitleText": "公告内容"
+                    }
                 }
             ]
         },

+ 43 - 0
pages/service/news-detailes.vue

@@ -0,0 +1,43 @@
+<template>
+	<view class="container clearfix rich-text-temp">
+		<rich-text-template ref="childTemplate"></rich-text-template>
+	</view>
+</template>
+
+<script>
+	import richTextTemplate from '@/components/cm-module/listTemplate/richTextTemplate'
+	
+	var self;
+	export default{
+		components: {
+		   richTextTemplate
+		},
+		data() {
+			return{
+				serverUrl: '',
+				type: 'introduction'
+			}
+		},
+		onLoad(){
+			this.initData()
+		},
+		methods:{
+			initData(){
+				this.CommonService.QueryAfterSale().then(response =>{
+					let _data =response.data,
+						type = this.type;
+					if(type) {
+						let html = this.$api.adaptRichTextImg(_data[type]);
+						this.$refs.childTemplate.html = html;
+					}
+				}).catch(error =>{
+					this.$util.msg(error.msg,2000);
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+
+</style>

+ 214 - 0
pages/service/news-list.vue

@@ -0,0 +1,214 @@
+<template>
+	<view class="container club clearfix">
+		<view class="club-main">
+			<view v-if="isEmpty" class="empty-container">
+				<image class="club-empty-image" src="https://img.caimei365.com/group1/M00/03/71/Cmis2F3wna6AY2ZjAABpmnBICH4247.png" mode="aspectFit"></image>
+				<view class="txt">暂无公告~</view>
+			</view>
+			<view v-else class="club-list">
+				<scroll-view scroll-y="true">
+					<view class="list" v-for="(item, index) in clubList" :key="index" @tap='detail(item)'>
+						<view class="list-left">
+							<text class="iconfont icon-xiaochengxu"></text>
+							<text class="txt">{{item.name == null ? item.username : item.name}}</text>
+						</view>
+						<view class="list-right">2022年03月07日</view>
+					</view>
+					<!--加载loadding-->
+					<tui-loadmore :visible="loadding" :index="3" type="black"></tui-loadmore>
+					<tui-nomore :visible="!pullUpOn" :backgroundColor="'#ffffff'" :text='nomoreText'></tui-nomore>
+					<!--加载loadding-->
+				</scroll-view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import authorize from '@/common/config/authorize.js'	
+	import tuiLoadmore from '@/components/tui-components/loadmore/loadmore'
+	import tuiNomore from '@/components/tui-components/nomore/nomore'
+	export default {
+		components:{
+			tuiLoadmore,
+			tuiNomore,
+		},
+		data() {
+			return {
+				serviceProviderId:'',
+				isShowClose:false,
+				searchInputVal:'',
+				isEmpty:false,
+				listQuery:{
+					searchWord:'',
+					pageNum:1,
+					pageSize:20,
+				},
+				nomoreText: '上拉显示更多',
+				hasNextPage:false,
+				loadding: false,
+				pullUpOn: true,
+				pullFlag: true,
+				allowDataStatus:true,
+				wrapperHeight:'100%',
+				scrollHeight:'',
+				deleteAddressId:'',
+				currPage:'',//当前页面
+				prevPage:'',//上一个页面
+				tabCurrentIndex:0,
+				listStatus:1,
+				clubList:[],
+				isIphoneX:this.$store.state.isIphoneX,
+				show_index:0,//控制显示那个组件
+			}
+		},
+		onLoad(){				
+			this.setScrollHeight()
+		},
+		methods: {
+			setScrollHeight() {
+				// 窗口高度 - 底部距离
+				setTimeout(()=> {
+					const query = wx.createSelectorQuery().in(this)
+					query.selectAll('.add-btn').boundingClientRect()
+					query.exec(res => {
+						if(res[0][0]){
+							let winHeight = this.$api.getWindowHeight(),
+								eleTop = res[0][0].top - 1
+								this.scrollHeight =  eleTop
+						}
+					})
+				}, 500)
+			},
+			searchClubList(){
+				this.listQuery.pageNum=1
+				this.GetFindAllClubList()
+			},
+			GetFindAllClubList(){	
+				this.SellerService.GetFindAllClubList(this.listQuery).then(response =>{
+					let responseData = response.data
+					if(responseData.list&&responseData.list.length > 0){
+						this.isEmpty = false
+						this.hasNextPage = response.data.hasNextPage
+						this.clubList =responseData.list
+						this.pullFlag = false
+						setTimeout(()=>{this.pullFlag = true},500)
+						if(this.hasNextPage){
+							this.pullUpOn = false
+							this.nomoreText = '上拉显示更多'
+						}else{
+							this.pullUpOn = true
+							this.loadding = false
+							this.nomoreText = '已至底部'
+						}
+					}else{
+						this.isEmpty = true
+					}
+				}).catch(error =>{
+					this.$util.msg(error.msg,2000)
+				})
+			},	
+			getOnReachBottomData(){
+				this.listQuery.pageNum+=1
+				this.SellerService.GetFindAllClubList(this.listQuery).then(response =>{
+					let responseData = response.data
+					if(responseData.list&&responseData.list.length > 0){
+						this.hasNextPage = response.data.hasNextPage
+						this.clubList = this.clubList.concat(responseData.list) 
+						this.pullFlag = false// 防上拉暴滑
+						setTimeout(()=>{this.pullFlag = true},500)
+						if(this.hasNextPage){
+							this.pullUpOn = false
+							this.nomoreText = '上拉显示更多'
+						}else{
+							this.pullUpOn = false
+							this.loadding = false
+							this.nomoreText = '已至底部'
+						}
+					}
+				}).catch(error =>{
+					this.$util.msg(error.msg,2000)
+				})
+			},
+			detail(item){// 跳转公告详情
+				this.$api.navigateTo(`/pages/service/news-detailes?id=${item.id}`)
+			},
+		},
+		onReachBottom() {
+			if(this.hasNextPage){
+				this.loadding = true
+				this.pullUpOn = true
+				this.getOnReachBottomData()
+			}	
+		},
+		onPullDownRefresh() {
+			setTimeout(() => {
+				this.listQuery.pageNum = 1
+				this.GetFindAllClubList()
+				uni.stopPullDownRefresh()
+			}, 200)
+		},
+		onShow() {
+			this.$api.getStorage().then(response =>{
+				this.serviceProviderId = response.serviceProviderId
+				this.GetFindAllClubList()
+			})
+		}
+	}
+</script>
+
+<style lang='scss'>
+	page {
+		height: auto;
+	}
+	page,.container{
+		/* padding-bottom: 120upx; */
+		background: #FFFFFF;
+	}
+	.container{
+		position: relative;
+	}
+	.club-main{
+		width: 100%;
+		height: auto;
+		box-sizing: border-box;
+		padding: 0 24rpx;
+		.list{
+			display: flex;
+			align-items: center;
+			width: 100%;
+			height: 100rpx;
+			line-height: 100rpx;
+			background: #FFFFFF;
+			position: relative;
+			border-bottom: 1px solid #EBEBEB;
+			.list-left{
+				display: flex;
+				flex: 8;
+				.icon-xiaochengxu{
+					font-size: $font-size-22;
+					color: #999999;
+					margin-right: 10rpx;
+				}
+				.txt{
+					display: flex;
+					flex: 1;
+					font-size: $font-size-26;
+					color: $text-color;
+					text-overflow: ellipsis;
+					overflow: hidden;
+					display: -webkit-box;
+					-webkit-line-clamp: 1;
+					line-clamp: 1;
+					-webkit-box-orient: vertical;
+				}
+			}
+			.list-right{
+				font-size: $font-size-24;
+				color: #999999;
+				text-align: right;
+			}
+		}
+	}
+</style>
+

+ 10 - 0
pages/tabBar/home/index.vue

@@ -8,6 +8,8 @@
 			<banner :list="bannerImageList" v-if="isNavRequest"></banner>
 			<!-- 金刚区菜单 -->
 			<navbars :list="navBarsList" v-if="isNavRequest"></navbars>
+			<!-- 轮播公告 -->
+			<notice :list="bannerImageList" v-if="isNavRequest"></notice>
 			<!-- 优惠券入口 -->
 			<coupon v-if="isNavRequest && couponEntry == 1"></coupon>
 			<!-- 直播 -->
@@ -33,6 +35,7 @@
 	import customer from '@/components/cm-module/homeIndex/customer.vue'
 	import banner from '@/components/cm-module/homeIndex/banner.vue'
 	import navbars from '@/components/cm-module/homeIndex/navbars.vue'
+	import notice from '@/components/cm-module/homeIndex/notice.vue'
 	import coupon from '@/components/cm-module/homeIndex/coupon.vue'
 	import pageFloor from '@/components/cm-module/homeIndex/pageFloor.vue'
 	import pageSpecial from '@/components/cm-module/homeIndex/pageSpecial.vue'
@@ -46,6 +49,7 @@
 			customer,
 			banner,
 			navbars,
+			notice,
 			coupon,
 			pageFloor,
 			pageSpecial,
@@ -75,6 +79,12 @@
 				flootData:[],				// 楼层
 				bannerImageList:[],			// 轮播
 				navBarsList:[],				// 导航分类
+				newsList:[// 公告
+					{text:'2021-12月德玛莉直播秒杀活动即将开始'},
+					{text:'2022-01月德玛莉直播秒杀活动即将开始'},
+					{text:'2022-02月德玛莉直播秒杀活动即将开始'},
+					{text:'2022-03月德玛莉直播秒杀活动即将开始'},
+				],		
 				templateData:{},
 				pageList:[],				// 楼层
 				supplierObj:{},				// 供应商列表