From ace762ff9a7545d4735cb4f9a72dbe0c0beb443f Mon Sep 17 00:00:00 2001
From: fanfan <franceesfan@163.com>
Date: Thu, 13 Jun 2024 17:58:27 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BB=86=E8=8A=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/goods/detail.vue | 70 ++++++++++++++++++++++++++++++++++++++----
 1 file changed, 64 insertions(+), 6 deletions(-)

diff --git a/pages/goods/detail.vue b/pages/goods/detail.vue
index d67c616..e520273 100644
--- a/pages/goods/detail.vue
+++ b/pages/goods/detail.vue
@@ -138,8 +138,10 @@
 				</view>
 			</view>
 		</view>
-		<view v-if="storeVersion == 1 && goods.merchant_id > 0 && goods.merchant" class="merchant-info" @click="toShop()">
-			<image :src="goods.merchant.logoImage && goods.merchant.logoImage[0].external_url" mode="aspectFill"></image>
+		<view v-if="storeVersion == 1 && goods.merchant_id > 0 && goods.merchant" class="merchant-info"
+			@click="toShop()">
+			<image :src="goods.merchant.logoImage && goods.merchant.logoImage[0].external_url" mode="aspectFill">
+			</image>
 			<view class="info-box">
 				<view class="info-name">
 					<text>{{ goods.merchant.shop_name }}</text>
@@ -213,6 +215,19 @@
 					<text class="li" style="margin-right: 5rpx;">全程跟踪</text>
 				</view>
 			</view>
+			<!-- <view class="chosed">
+				<view class="title">须知</view>
+				<view class="info">
+					<view class="notice" :class="[!isToggle ? 'text-clamp' : 'text-ellipsis']">
+						请您在签收电视之前，务必检查电视外包装完好无损，并且通电正常点亮再签收，如果有明显破损，或者屏幕有明显运损，或者通电后电视屏幕请您在签收电视之前，务必检查电视外包装完好无损，并且通电正常点亮再签收，如果有明显破损，或者屏幕有明显运损，或者通电后电视屏幕请您在签收电视之前，务必检查电视外包装完好无损，并且通电正常点亮再签收，如果有明显破损，或者屏幕有明显运损，或者通电后电视屏幕
+					</view>
+					<view class="moreKnow" @click="toggleItem()" v-if="hasMoreLines">
+						{{isToggle == false?'展开':'收起'}}
+						<u-icon v-if="isToggle == false" style="margin-left: 10rpx;" name="arrow-down"></u-icon>
+						<u-icon v-else style="margin-left: 10rpx;" name="arrow-up"></u-icon>
+					</view>
+				</view>
+			</view> -->
 		</view>
 		<!-- 		<view class="about">
 			<view class="aboutHead">
@@ -407,7 +422,7 @@
 			</view>
 			<view class="shareWechat" v-if="shareType=='share'">
 				<view class="shareGoods">
-					<image :src="goods.goods_image"  class="shareImg">
+					<image :src="goods.goods_image" class="shareImg">
 					</image>
 				</view>
 				<view class="shareInfo">
@@ -543,6 +558,8 @@
 					district: '玄武区'
 				},
 				seckillCountTime: 0,
+				isToggle: false,
+				hasMoreLines: false
 			}
 		},
 		computed: {
@@ -600,7 +617,6 @@
 				this.isLogin = false;
 				this.userInfo = {}
 			}
-			console.log(this.userInfo)
 		},
 		onPageScroll(e) {
 			if (e.scrollTop <= 200) { // 当滚动到顶部且向下滑动时为true
@@ -610,6 +626,19 @@
 			}
 		},
 		methods: {
+			checkTextLines() {
+				const query = uni.createSelectorQuery().in(this);
+				query.select('.notice').boundingClientRect(data => {
+					if (data && data.height > 0) {
+						// 根据实际情况调整行高
+						const lineHeight = 21; // 假设的行高
+						this.hasMoreLines = data.height / lineHeight > 3;
+					}
+			 }).exec();
+			},
+			toggleItem() {
+				this.isToggle = !this.isToggle;
+			},
 			onLook(isLink, url) {
 				if (isLink) {
 					uni.navigateTo({
@@ -1050,6 +1079,7 @@
 									}
 								}
 							}
+							this.checkTextLines()
 						})
 						.catch()
 				})
@@ -1663,41 +1693,47 @@
 			}
 		}
 	}
-	
+
 	.merchant-info {
 		margin: 20rpx 18rpx 0 18rpx;
 		padding: 30rpx;
 		background: #fff;
 		display: flex;
+
 		>image {
 			width: 90rpx;
 			height: 90rpx;
 			margin-right: 20rpx;
 			flex-shrink: 0;
 		}
+
 		.info-box {
 			width: calc(100% - 110rpx);
 			display: flex;
 			flex-direction: column;
 			justify-content: space-between;
+
 			>.info-name {
 				font-size: 30rpx;
 				color: #333;
 				font-weight: bold;
 				display: flex;
 				align-items: center;
+
 				>text {
 					overflow: hidden;
 					text-overflow: ellipsis;
 					white-space: nowrap;
 					width: calc(100% - 21rpx);
 				}
+
 				>image {
 					margin-left: 10rpx;
 					width: 13rpx;
 					height: 24rpx;
 				}
 			}
+
 			>.label {
 				text {
 					display: inline-block;
@@ -1713,7 +1749,7 @@
 			}
 		}
 	}
-	
+
 	.orderInfo {
 		// width: 720rpx;
 		background: #FFFFFF;
@@ -2428,4 +2464,26 @@
 	.detail-content {
 		overflow: hidden;
 	}
+
+	.notice {
+		line-height: 21px;
+	}
+
+	.moreKnow {
+		width: 100%;
+		text-align: right;
+		font-size: 24rpx;
+		color: #B7B7B7
+	}
+
+	.text-clamp {
+		display: -webkit-box;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 3;
+		overflow: hidden;
+	}
+
+	.text-ellipsis {
+		-webkit-line-clamp: none;
+	}
 </style>