From 90b02d8004b52e0340ea37954e37174f6cc633ec Mon Sep 17 00:00:00 2001
From: wong1988 <wong1988@petalmail.com>
Date: Sun, 21 Jan 2024 22:35:02 +0800
Subject: [PATCH] 111

---
 pages/home/cloudCard2.vue | 243 +++++++++++++++++++-------------------
 1 file changed, 121 insertions(+), 122 deletions(-)

diff --git a/pages/home/cloudCard2.vue b/pages/home/cloudCard2.vue
index 44ef5ac..da034f9 100644
--- a/pages/home/cloudCard2.vue
+++ b/pages/home/cloudCard2.vue
@@ -3,97 +3,105 @@
 	<view
 		style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);">
 
-		<view class="top">
+		<view class="top" style="position: fixed;z-index: 0;" />
 
-			<NavBar ref="nav" navTitle=" " :showIcon="false" :start-change-height="page.startHeight"
-				:end-change-height="page.endHeight">
-			</NavBar>
+		<loading-state ref="pageView" @request="request" style="z-index: 2;">
 
-		</view>
+			<!-- 总高度 - 底部导航栏高度 60px -->
+			<view style="height: calc(100vh - 60px);box-sizing: border-box;display: flex;flex-direction: column;">
 
-		<loading-state ref="pageView" @request="request">
-			<view
-				style="background: #fff; height: calc(100vh - 45px - 50vw);width: 100%; border-radius: 15px;display: flex;flex-direction: column; box-sizing: border-box;margin-top: -15px;box-sizing: border-box;">
+				<!-- 压住图片15px -->
+				<view style="height: calc(50vw - 15px);width: 100%;"></view>
 
-				<view class="center">
+				<view
+					style="background: #fff; width: 100%; border-radius: 15px;display: flex;flex-direction: column; box-sizing: border-box;flex: 1">
 
-					<view style="width: 22%;display: flex;flex-direction: column;overflow-y: auto;padding-top: 10px;">
+					<view class="center" style="flex: 1;">
+
+						<view
+							style="width: 24%;display: flex;flex-direction: column;overflow-y: auto;padding-top: 10px;">
+
+							<view style="width: 100%;display: flex;flex-direction: column; ">
+								<view v-for="(item,index) in data.typeVos" @click="labelClick(index,item)"
+									style="display: flex;flex-direction: column;justify-content: center;">
+									<text class="label" :class="{'label2':selectIndex==index}">{{item.name}}</text>
+								</view>
 
-						<view style="width: 100%;display: flex;flex-direction: column; ">
-							<view v-for="(item,index) in data.typeVos" @click="labelClick(index,item)"
-								style="display: flex;flex-direction: column;justify-content: center;">
-								<text class="label" :class="{'label2':selectIndex==index}">{{item.name}}</text>
 							</view>
 
 						</view>
 
-					</view>
-
-					<view style="width: 78%;background-color: #fff;overflow-y: auto;">
+						<view style="width: 77%;background-color: #fff;overflow-y: auto;">
 
-						<view style="z-index: 1;background: #FFFFFF;position: sticky;top: 0;padding: 10px;">
+							<view style="z-index: 1;background: #FFFFFF;position: sticky;top: 0;padding: 10px;">
 
-							<view style="display: flex;flex-direction: row;overflow-x: auto;">
+								<view style="display: flex;flex-direction: row;overflow-x: auto;">
 
-								<view v-for="(item,index2) in data.brandVos"
-									style="display: flex;flex-direction: column; justify-content: center;align-items: center;margin-right: 10px;"
-									@click.stop="brandClick(index2)">
+									<view v-for="(item,index2) in data.brandVos"
+										style="display: flex;flex-direction: column; justify-content: center;align-items: center;margin-right: 10px;"
+										@click.stop="brandClick(index2)">
 
-									<image src="https://supervise.yxtsoft.com/lpk/image/family_icon.png"
-										mode="aspectFill" :class="selectIndex2 == index2?'top_img1':'top_img2'"
-										style="width: 55px;height:55px;border-radius: 50%;padding:5px;"></image>
+										<image src="https://supervise.yxtsoft.com/lpk/image/family_icon.png"
+											mode="aspectFill" :class="selectIndex2 == index2?'top_img1':'top_img2'"
+											style="width: 55px;height:55px;border-radius: 50%;padding:5px;"></image>
 
-									<text
-										:class="selectIndex2 == index2?'top_text1':'top_text2'">{{item.brandName}}</text>
+										<text
+											:class="selectIndex2 == index2?'top_text1':'top_text2'">{{item.brandName}}</text>
 
+									</view>
 								</view>
 							</view>
-						</view>
 
-						<view style="width: 100%; display: flex;flex-direction: column;overflow-y: auto;">
+							<view style="width: 100%; display: flex;flex-direction: column;overflow-y: auto;">
 
-							<view v-for="(item,index) in goods"
-								style="display: flex;flex-direction: column;justify-content: center;width: 95%; margin-top: 15px; margin-left: 3%;">
+								<view v-for="(item,index) in goods"
+									style="display: flex;flex-direction: column;justify-content: center;width: 95%; margin-top: 15px; margin-left: 3%;">
 
-								<view style="display: flex;flex-direction: row;align-items: center;width: 100%;  ">
+									<view style="display: flex;flex-direction: row;align-items: center;width: 100%;  ">
 
-									<image :src="item.iconUrl" style="width: 90px;height: 90px; border-radius: 10px; "
-										mode="aspectFill" @click="itemClick(item.goodsSid)"></image>
+										<image :src="item.iconUrl"
+											style="width: 90px;height: 90px; border-radius: 10px; " mode="aspectFill"
+											@click="itemClick(item.goodsSid)"></image>
 
-									<view
-										style="display: flex;flex-direction: column;flex: 1;  padding-bottom: 15px; margin-left: 10px;"
-										:style="{'border-bottom':(index == goods.length-1 ? 'none' : '1px #EFEFEF solid')}">
-
-										<text style="font-size: 13px;color: #000;">{{item.name}}</text>
+										<view
+											style="display: flex;flex-direction: column;flex: 1;  padding-bottom: 15px; margin-left: 10px;"
+											:style="{'border-bottom':(index == goods.length-1 ? 'none' : '1px #EFEFEF solid')}">
 
-										<text
-											style="font-size: 10px;color: #999;margin-top: 5px;">{{item.remark}}</text>
+											<text style="font-size: 13px;color: #000;">{{item.name}}</text>
 
-										<view
-											style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;">
-											<text style="border: 1px #EE752F solid; border-radius: 5px;	padding: 0px 8px;
-											font-size: 10px;color: #EE752F;">{{item.jprice}}元/{{item.specificationUnit}}</text>
 											<text
-												style="border: 1px #EE752F solid; border-radius: 5px;	padding: 0px 8px;
-											font-size: 10px;color: #EE752F; margin-left: 10px; margin-right: 10px; ">{{item.weight}}{{item.specificationUnit}}/{{item.unitName}}</text>
+												style="font-size: 10px;color: #999;margin-top: 5px;">{{item.remark}}</text>
 
-										</view>
+											<view
+												style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;">
+												<text style="border: 1px #EE752F solid; border-radius: 5px;	padding: 0px 8px;
+												font-size: 10px;color: #EE752F;">{{item.jprice}}元/{{item.specificationUnit}}</text>
+												<text
+													style="border: 1px #EE752F solid; border-radius: 5px;	padding: 0px 8px;
+												font-size: 10px;color: #EE752F; margin-left: 10px; margin-right: 10px; ">{{item.weight}}{{item.specificationUnit}}/{{item.unitName}}</text>
 
-										<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between; margin-top: 15px;
-										margin-right: 15px;">
-											<text style="font-size: 14px;color: #FF5006;">￥{{item.mefenPrice}}</text>
+											</view>
 
-											<view style="display: flex;flex-direction: row;align-items: center;">
+											<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between; margin-top: 15px;
+											margin-right: 15px;">
+												<text
+													style="font-size: 14px;color: #FF5006;">￥{{item.mefenPrice}}</text>
 
-												<image src="../../static/jian_icon.png" mode="aspectFill"
-													style="width: 20px;height: 20px;" @click.stop="jian(item)"></image>
+												<view style="display: flex;flex-direction: row;align-items: center;">
 
-												<text
-													style="font-size: 14px;margin-left: 8px;margin-right: 8px;">{{item.goodsNumber}}</text>
-												<image src="../../static/jia_icon.png" mode="aspectFill"
-													style="width: 20px;height: 20px;" @click.stop="jia(item)"></image>
+													<image src="../../static/jian_icon.png" mode="aspectFill"
+														style="width: 20px;height: 20px;" @click.stop="jian(item)">
+													</image>
 
+													<text
+														style="font-size: 14px;margin-left: 8px;margin-right: 8px;">{{item.goodsNumber}}</text>
+													<image src="../../static/jia_icon.png" mode="aspectFill"
+														style="width: 20px;height: 20px;" @click.stop="jia(item)">
+													</image>
+
+												</view>
 											</view>
+
 										</view>
 
 									</view>
@@ -106,74 +114,65 @@
 
 					</view>
 
-				</view>
+					<view class="bottom">
 
-				<view class="bottom">
+						<view style="display: flex;flex-direction: row;align-items: center; justify-content: center;">
 
-					<view style="display: flex;flex-direction: row;align-items: center; justify-content: center;">
-						<!-- <view style="width: 35px;height: 35px;position: relative; visibility: hidden; ">
-
-							<image style="width: 25px;height: 25px;margin-left: 5px; margin-top: 5px; "
-								src="../../static/basket_icon.png" mode="aspectFill"></image>
+							<view id="bomView" style="display: flex;flex-direction: row;align-items: center;">
+								<view
+									style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;">
+									温馨提示：已订</view>
+								<view
+									style="color: #FF5006;font-size: 15px;height: 15px;line-height: 15px;font-weight: bold;">
+									{{page.weight}}斤
+								</view>
 
-							<view style="border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
-								position: absolute;
-								  top: 2px;
-								  right: 0px;
-								  padding: 2px 5px;
-								  width: auto;">{{page.count}}</view>
+								<view
+									style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;">
+									，{{data.brandVos[selectIndex2].qssl}}斤起订。</view>
 
-						</view> -->
+								<view style="display: flex;flex-direction: row;align-items: center;"
+									@click="showPop2()">
+									<text
+										style="color: #6190D8;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;text-decoration:underline;font-style:oblique;">
+										起订说明</text>
+									<text
+										style="color: #6190D8;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;">
+										>></text>
+								</view>
 
-						<view id="bomView" style="display: flex;flex-direction: row;align-items: center;">
-							<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;">
-								温馨提示：已订</view>
-							<view
-								style="color: #FF5006;font-size: 15px;height: 15px;line-height: 15px;font-weight: bold;">
-								{{page.weight}}斤
 							</view>
+						</view>
+
+						<view
+							style="display: flex;flex-direction: row; justify-content: center;align-items: center;padding-bottom: 10px;margin-top: 5px;padding: 0px 10px;">
 
-							<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;">
-								，{{data.brandVos[selectIndex2].qssl}}斤起订。</view>
+							<button open-type="share">分享新人有礼</button>
 
-							<view style="display: flex;flex-direction: row;align-items: center;" @click="showPop2()">
-								<text
-									style="color: #6190D8;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;text-decoration:underline;font-style:oblique;">
-									起订说明</text>
-								<text
-									style="color: #6190D8;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;">
-									>></text>
+							<view style="border: 1px #FF5006 solid;margin-left: 5px;margin-right: 5px;padding: 0px 10px;height: 42px;flex: 1;
+								display: flex;flex-direction: row;align-items: center;box-sizing: border-box;" @click="gotoCart()">
+								<image src="../../static/shoppCart_icon.png" mode="aspectFill"
+									style="height: 20px;width: 20px;flex-shrink: 0;">
+								</image>
+								<view style="display: flex;flex-direction: column;flex: 1;">
+									<text
+										style="font-size: 15px;color: #FF5006;margin-left: 10px;height: 20px;line-height: 20px;margin-top: 5px;font-weight: bold;">￥{{page.price}}</text>
+									<text
+										style="font-size: 10px;color: #666;margin-left: 10px; height: 10px;line-height: 10px;margin-bottom: 5px;">{{page.remarks}}</text>
+								</view>
 							</view>
 
-						</view>
-					</view>
+							<text style="background: #FF9900; color: #fff;font-size: 13px; padding: 0px 15px;height: 40px;line-height: 40px;
+								border: 1px #FF5006 solid; border-top-right-radius: 25px; border-bottom-right-radius: 25px;flex-shrink: 0;"
+								@click="settlement()">结算</text>
 
-					<view
-						style="display: flex;flex-direction: row; justify-content: center;align-items: center;padding-bottom: 10px;margin-top: 5px;padding: 0px 10px;">
-
-						<button open-type="share">分享新人有礼</button>
-
-						<view style="border: 1px #FF5006 solid;margin-left: 5px;margin-right: 5px;padding: 0px 10px;height: 42px;flex: 1;
-							display: flex;flex-direction: row;align-items: center;box-sizing: border-box;" @click="gotoCart()">
-							<image src="../../static/shoppCart_icon.png" mode="aspectFill"
-								style="height: 20px;width: 20px;flex-shrink: 0;">
-							</image>
-							<view style="display: flex;flex-direction: column;flex: 1;">
-								<text
-									style="font-size: 15px;color: #FF5006;margin-left: 10px;height: 20px;line-height: 20px;margin-top: 5px;font-weight: bold;">￥{{page.price}}</text>
-								<text
-									style="font-size: 10px;color: #666;margin-left: 10px; height: 10px;line-height: 10px;margin-bottom: 5px;">{{page.remarks}}</text>
-							</view>
 						</view>
 
-						<text style="background: #FF9900; color: #fff;font-size: 13px; padding: 0px 15px;height: 40px;line-height: 40px;
-							border: 1px #FF5006 solid; border-top-right-radius: 25px; border-bottom-right-radius: 25px;flex-shrink: 0;"
-							@click="settlement()">结算</text>
-
 					</view>
 
 				</view>
 
+
 			</view>
 
 		</loading-state>
@@ -494,7 +493,7 @@
 			},
 
 			dialogInputConfirm2(val) {
-				console.log(">>>>>>>>>>>",this.dialogBeforeClose2);
+				console.log(">>>>>>>>>>>", this.dialogBeforeClose2);
 				this.dialogBeforeClose2 = false
 			},
 
@@ -511,26 +510,25 @@
 
 				// 	_this.request()
 				// }).catch(e => {})
-				
-				
+
+
 				var params = {
 					customerSid: getApp().globalData.sid,
 					// cardNumber: 1,
-					brandId:this.data.brandVos[this.selectIndex2].id,
+					brandId: this.data.brandVos[this.selectIndex2].id,
 					totalTee: this.page.price,
-					
+
 					// ordOrderDetailsVoList: list
 				}
 				console.log("params", params);
-				
+
 				let _this = this
 				_this.$api.createVegeOrder(params).then((resp) => {
-				
+
 					// console.log("resp", resp);
 					this.$pay(resp)
-				}).catch(e => {
-				})
-				
+				}).catch(e => {})
+
 
 			},
 			itemClick(goodsSid) {
@@ -624,7 +622,6 @@
 		display: flex;
 		flex-direction: row;
 		/* 这里注意，影响弹窗 */
-		height: calc(100vh - 120px - 50vw);
 		background-color: #f7f7f7;
 		border-radius: 15px;
 		overflow: hidden;
@@ -649,6 +646,7 @@
 		padding-top: 7px;
 		padding-bottom: 7px;
 		margin-left: 5px;
+		margin-right: 5px;
 	}
 
 	.label2 {
@@ -664,6 +662,7 @@
 		font-weight: bold;
 		border-radius: 20px;
 		margin-left: 5px;
+		margin-right: 5px;
 	}
 
 	.top_img1 {
@@ -680,7 +679,7 @@
 		color: #fff;
 		font-weight: 800;
 		font-family: sans-serif;
-		padding: 5px 16px;
+		padding: 5px 12px;
 		border-radius: 5px;
 		margin-top: -25px;
 		font-size: 13px;
@@ -693,7 +692,7 @@
 		background: #fff;
 		color: #F6894B;
 		font-weight: 800;
-		padding: 5px 16px;
+		padding: 5px 12px;
 		font-family: sans-serif;
 		border-radius: 5px;
 		margin-top: -25px;