Эх сурвалжийг харах

完善首页显示和按钮跳转

littleblue55 1 сар өмнө
parent
commit
ff349a92f3

+ 2 - 2
components/lgSwiper.vue

@@ -5,7 +5,7 @@
 			:easing-function="easeInOutCubic"
 			@change="changeCurrent">
 			<swiper-item v-for="(slide, index) in processedSildeItems" :key="index" style="overflow: initial;"
-				:class="index==currentIndex? 'swiper-item-active':'swiper-item-normal'" @click="swiperClick">
+				:class="index==currentIndex? 'swiper-item-active':'swiper-item-normal'" @click="swiperClick(slide)">
 				<!-- <view :class="index==currentIndex? 'swiper-item active':'swiper-item'">
 					<view style="width: 100%;height: 90%;">
 						<image style="width: 100%;height: 100%;" mode="aspectFit" :src="slide[image]"></image>
@@ -35,7 +35,7 @@
 				this.currentIndex = e.detail.current
 			},
 			swiperClick(data){
-				console.log(111)
+				console.log(111, data)
 				this.$emit('swiperClick', data);
 			}
 		},

+ 123 - 49
pages/index/index.vue

@@ -28,7 +28,7 @@
 			<u-card padding="20" margin="0rpx 0rpx 30rpx" border-radius="20"
 				box-shadow="0px 2px 5px rgba(0, 0, 0, 0.1)">
 				<template v-slot:head>
-					<u-section title="课程预告" sub-title="查看更多" sub-color="#000000"></u-section>
+					<u-section title="课程预告" sub-title="查看更多" sub-color="#000000" @click="toPage('/pages/goOnEdu/index')"></u-section>
 				</template>
 				<template v-slot:body>
 					<lg-swiper v-if="courseList.length!=0" 
@@ -41,27 +41,57 @@
 			<u-card padding="30" margin="0rpx 0rpx 30rpx" border-radius="20"
 				box-shadow="0px 2px 5px rgba(0, 0, 0, 0.1)">
 				<template v-slot:head>
-					<u-section title="研究报告" sub-title="查看更多" sub-color="#000000"></u-section>
+					<u-section title="研究报告" sub-title="查看更多" sub-color="#000000" @click="toPage('/pages/researchReport/reportHome/reportHome')"></u-section>
 				</template>
 				<template v-slot:body>
 					<view v-if="reportList.length!=0">
 						<view v-for="(data,index) in reportList" :key="index" class="u-body-item u-flex u-p-t-0 "
-							style="align-items: inherit;">
+							style="align-items: inherit;" @click="toReport(data.id, data.title)">
 							<image :src="data.imgUrl" mode="aspectFill"></image>
 							<view class="u-body-item-content">
 								<view class="item-content">
 									<text class="item-content-title text-ellipsis">{{data.title}}</text>
 									<text class="item-content-type">{{data.type}}</text>
-									<text class="item-content-price"
-										v-if="data.viewMode==='3'">¥{{isMember?data.priceMember:data.price}}元</text>
 								</view>
 								<view class="item-button">
-									<view v-if="data.viewMode==='3' && data.hasBuy" class="item-button-yiGouMai">已购买
+									<view v-if="data.viewMode==='1'" class="func-box" style="justify-content: flex-end;">
+										<view class="button free" >免费</view>
 									</view>
-									<view v-else-if="data.viewMode==='3' && !data.hasBuy" class="item-button-goumai">
-										点击购买</view>
-									<view v-else-if="data.viewMode==='2'" class="item-button-huiyuan">
-										会员免费
+									<view v-else-if="data.viewMode==='2' && isMember" class="func-box">
+										<view class="price">¥{{ data.price }}元</view>
+										<view class="button member-free">会员免费</view>
+									</view>
+									<view v-else-if="data.viewMode==='2' && !isMember" class="func-box">
+										<view style="flex: 0 0 auto;display: flex;align-items: center;">
+											<view class="member-free">
+												会员免费
+											</view>
+											<view class="not-member-price">
+												非会员:¥{{data.price}}元
+											</view>
+										</view>
+										<view :class="['button', data.hasBuy ? 'free' : 'buy']">
+											{{data.hasBuy ? '已购买' : '立即购买'}}
+										</view>
+									</view>
+									<view v-else-if="data.viewMode==='3' && data.price===data.priceMember" class="func-box">
+										<view class="price">¥{{ data.price }}元</view>
+										<view :class="['button', data.hasBuy ? 'free' : 'buy']">
+											{{data.hasBuy ? '已购买' : '立即购买'}}
+										</view>
+									</view>
+									<view v-else-if="data.viewMode==='3' && data.price!==data.priceMember" class="func-box">
+										<view style="flex: 0 0 auto;display: flex;align-items: center;">
+											<view class="member-free">
+												{{`会员:${data.priceMember}元`}}
+											</view>
+											<view class="not-member-price">
+												非会员:¥{{data.price}}元
+											</view>
+										</view>
+										<view :class="['button', data.hasBuy ? 'free' : 'buy']">
+											{{data.hasBuy ? '已购买' : '立即购买'}}
+										</view>
 									</view>
 								</view>
 							</view>
@@ -221,34 +251,7 @@
 	])
 
 	const reportList = ref(
-		[{
-				"id": 1,
-				"title": "2023年7月广州市中介促成二手住宅市场交易简报",
-				"imgUrl": "https://tse3-mm.cn.bing.net/th/id/OIP-C.YKoZzgmubNBxQ8j-mmoTKAHaEK?rs=1&pid=ImgDetMain",
-				"type": "月度成交简报",
-				"price": 150.80,
-				"hasBuy": true,
-				"memberFree": false
-			},
-			{
-				"id": 2,
-				"title": "成交有望稳中微升——2023年8月中介协会经理人指数报告经理人指数报告经理人指数报告",
-				"imgUrl": "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
-				"type": "经理人指数报告",
-				"price": 200.88,
-				"hasBuy": false,
-				"memberFree": false
-			},
-			{
-				"id": 3,
-				"title": "2023年6月广州市住宅租金动态监测报告",
-				"imgUrl": "https://desk-fd.zol-img.com.cn/t_s960x600c5/g4/M03/00/0C/Cg-4zFS8bC-Ie9zBADCvovJAqiEAATJ8wDX__cAMK-6184.jpg",
-				"type": "月度租赁简报",
-				"price": 300.00,
-				"hasBuy": true,
-				"memberFree": true
-			}
-		])
+		[])
 	// 跳转页面
 	const jumpToPage = (data) => {
 		if (data.toOtherApp) {
@@ -258,7 +261,6 @@
 		}
 		if (!authStore.isAuthenticated) {
 			loginModal.value = true
-
 			return
 		}
 		uni.navigateTo({
@@ -271,22 +273,34 @@
 			url: "/pages/initial/initial"
 		})
 	}
-	const toPage = () => {
+	const toPage = (url) => {
 		if (!authStore.isAuthenticated) {
-			uni.navigateTo({
-				url: "/pages/initial/initial"
-			})
+			loginModal.value = true
 			return
 		}
+		uni.navigateTo({
+			url: url
+		})
 	}
 	const itemClick = (data) =>{
 		// console.log("轮播图swiper", data)
+		if (!authStore.isAuthenticated) {
+			loginModal.value = true
+			return
+		}
 		uni.navigateTo({
 			url: "/pages/swiperDetail/swiperDetail?id=" + data.id 
 		})
 	}
 	const swiperClick = (data) => {
-		console.log(data, "课程预告数据")
+		// console.log(data, "课程预告数据")
+		if (!authStore.isAuthenticated) {
+			loginModal.value = true
+			return
+		}
+		uni.navigateTo({
+			url: `/pages/goOnEdu/course/courseDetail/courseDetail?id=${data.id}&name=${data.courseName}`
+		});
 	}
 
 	function initUser() {
@@ -331,6 +345,17 @@
 			}
 		})
 	}
+	
+	function toReport(id, title){
+		if (!authStore.isAuthenticated) {
+			loginModal.value = true
+			return
+		}
+		uni.navigateTo({
+			url:"/pages/reportDetail/reportDetail?id="+id+"&title="+title
+		})
+	}
+	
 	onReady(() => {
 		uni.getSystemInfo({
 			success(e) {
@@ -354,7 +379,7 @@
 			if (!isUserInfo) {
 				initUser();
 			} else {
-				isMember.value = authStore.userInfo.isMember;
+				isMember.value = authStore.userInfo.isMember==='0'?false:true;
 			}
 		}
 	})
@@ -418,10 +443,7 @@
 			}
 
 			.item-button {
-				position: absolute;
-				right: 0;
-				bottom: 0;
-				font-size: 22rpx;
+				width: 100%;
 
 				.item-button-huiyuan {
 					padding: 15rpx 0 5rpx;
@@ -536,4 +558,56 @@
 			}
 		}
 	}
+	
+	.item-button {
+		display: flex;
+		justify-content: space-between;
+		align-items: flex-end;
+		font-size: $uni-font-size-2;
+		font-weight: bold;
+		margin-top: 10rpx;
+	
+		.func-box {
+			display: flex;
+			justify-content: space-between;
+			width: 100%;
+			align-items: center;
+		}
+	
+		.button {
+			text-align: center;
+			width: 130rpx;
+		}
+	
+		.price {
+			color: $uni-color-error;
+			font-size: $uni-title-font-size-3;
+		}
+	
+		.not-member-price {
+			font-size: $uni-font-size-4;
+			color: $uni-text-color-grey;
+			text-align: end;
+		}
+	
+		.buy {
+			padding: 6rpx 25rpx;
+			background-color: $uni-color-error;
+			border-radius: $uni-card-border-radius;
+			color: $uni-text-color-inverse;
+		}
+	
+		.free {
+			padding: 6rpx 25rpx;
+			background-color: $uni-color-primary;
+			border-radius: $uni-card-border-radius;
+			color: $uni-text-color-inverse;
+		}
+	
+		.member-free {
+			padding: 10rpx 20rpx;
+			@include backgroundImg('https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/bg-label.png');
+			color: $uni-text-color;
+		}
+	}
 </style>