解决冲突

pages/video/index.nvue

@@ -121,7 +121,7 @@
 						</view>
 					</view>
 					<view class="ft14" style="display: flex;flex-direction: row;justify-content: flex-start;padding: 0 20px;">账户余额<text class="ft14" style="color: #FF9800;">{{user_info.total_coin}}</text>K币</view>
-					<scroll-view class="scroll-my" :scroll-y="true" :scroll-top="scrollTop">
+					<scroll-view class="scroll-charge" :scroll-y="true" :scroll-top="scrollTop">
 					<view class="pay-box">
 						<block  v-for="(item,key) in payOptions" :key="key">
 							<view  v-if="item.type =='COIN'" @click="selectPayItem(item)" :class="item.id == pay_select_id ?'pay-select' :'' " class="box pay-box-items" >
@@ -594,64 +594,9 @@
 		},
 	};
 </script>
-
-<style lang="scss" scoped>
-	.content {
-		background: #000000;
-	}
-
-	.userInfo {
-		position: absolute;
-		z-index: 99;
-		bottom: 30%;
-		right: 10px;
-		width: 100rpx;
-		text-align: center;
-		flex-direction: column;
-
-	}
-
-	.contentcd {
-		background-color: rgba(255, 255, 255, .3);
-		width: 720rpx;
-		z-index: 99;
-		position: absolute;
-		bottom: 70rpx;
-		left: 50%;
-		transform: translateX(-50%);
-		padding: 15rpx;
-		border-radius: 8px;
-		display: flex;
-		flex-direction: row;
-		justify-content: flex-start;
-		align-items: center;
-		color: #ffffff;
-		margin: 0 auto;
-	}
-
-	.userName {
-		color: #fff;
-		font-size: 30rpx;
-		color: #ffffff;
-		margin: 0 6rpx;
-	}
-
-	.tsvideo {
-		animation: showDivAni 2s 1;
-	}
-
-	@keyframes showDivAni {
-		0% {
-			opacity: 0;
-		}
-
-		100% {
-			opacity: 1;
-		}
-	}
-</style>
+
 <style lang="scss" scoped>
-	.vip-center{
+.vip-center{
 		display: flex;
 		flex-direction: row;
 		justify-content: space-between;
@@ -705,164 +650,224 @@
 	.given-txt{
 		height: 30px;
 		border-top: solid 1rpx #9e9e9e1f;
-	}
-	.charge-wrapper {
-		margin-top: 15px;
-		width: 100%;
-
-		.top {
-			width: 100%;
-			display: flex;
-			align-items: center;
-
-			.charge-title {
-				font-size: 18px;
-				font-weight: bold;
-			}
-
-			.charge-info {
-				font-size: 15px;
-				color: #868686;
-				margin: 8px 0;
-			}
-
-			.charge-coin {
-				display: flex;
-				flex-direction: row;
-
-				.ji {
-					font-size: 18px;
-				}
-
-				.bi {
-					font-size: 18px;
-					color: $accent-color;
-				}
-			}
-		}
-	}
-
-	.down {
-		display: flex;
-		flex-direction: row;
-		width: 60px;
-		height: 30px;
-		margin-top: 5px;
-		position: absolute;
-		right: 0px;
-		top: 50%;
-		transform: translateY(-50%);
-
-		.down-text {
-			font-size: 12px;
-			color: #000;
-		}
-
-		.down-img {
-			width: 35rpx;
-			height: 35rpx;
-			object-fit: contain;
-		}
-	}
-
-	.ju-top {
-
-		// background-color: ;
-		.ju-top-title {
-			font-size: 16px;
-			font-weight: bold;
-			color: #000;
-			margin-top: 9px;
-			height: 22px;
-			margin-left: 20px;
-			// width: '+ (windowWidth*0.6) +' px;
-			overflow: hidden;
-		}
-
-		.ju-top-update {
-			font-size: 12px;
-			color: #000;
-			margin-top: 9px;
-			height: 22px;
-			margin-left: 20px;
-		}
-	}
-
-	.pop-my {
-		background-color: #FFFFFF;
-	}
-
-	.scroll-my {
-		height: 50vh;
-	}
-
-	.ju-wrapper {
-		display: flex;
-		flex-direction: row;
-		flex-wrap: wrap;
-		align-items: center;
-		justify-content: start;
-		width: 100%;
-		height: 100%;
-		background-color: #FFFFFF;
-		// margin: 6rpx;
-
-		.ju-content.active {
-			background-color: #ff7f02;
-		}
-
-		.ju-content {
-			flex-grow: 1;
-			position: relative;
-			border-radius: 12rpx;
-			background-color: #f6f6f6;
-			width: 31%;
-			height: 25rpx;
-			align-items: center;
-			justify-content: center;
-			padding: 45rpx 68rpx;
-			margin: 6rpx;
-
-			.lock-wrapper,
-			.lock-wrapper-no {
-				position: absolute;
-				width: 100%;
-				height: 100%;
-				border-radius: 12rpx;
-				background-color: rgba(0, 0, 0, .3);
-
-				.lock-img {
-					position: absolute;
-					left: 3rpx;
-					top: 50%;
-					transform: translateY(-50%);
-					width: 50rpx;
-					height: 50rpx;
-					margin-left: 20rpx;
-				}
-
-				.update-title {
-					width: fit-content;
-					height: fit-content;
-					border-radius: 8rpx;
-					font-size: 10px;
-					padding: 6rpx;
-					background-color: #868686;
-					color: #fff;
-				}
-			}
-
-			.lock-wrapper-no {
-				background-color: #f6f6f6;
-			}
-
-			.title {
-				font-size: 16px;
-			}
-		}
-	}
-
-	.utabs-top /deep/ .u-tabs {
-		align-items: flex-start;
-	}
+	}
+	.content {
+		background: #000000;
+	}
+
+	.userInfo {
+		position: absolute;
+		z-index: 99;
+		bottom: 30%;
+		right: 10px;
+		width: 100rpx;
+		text-align: center;
+		flex-direction: column;
+
+	}
+
+	.contentcd {
+		background-color: rgba(255, 255, 255, .3);
+		width: 720rpx;
+		z-index: 99;
+		position: absolute;
+		bottom: 70rpx;
+		left: 50%;
+		transform: translateX(-50%);
+		padding: 15rpx;
+		border-radius: 8px;
+		display: flex;
+		flex-direction: row;
+		justify-content: flex-start;
+		align-items: center;
+		color: #ffffff;
+		margin: 0 auto;
+	}
+
+	.userName {
+		color: #fff;
+		font-size: 30rpx;
+		color: #ffffff;
+		margin: 0 6rpx;
+	}
+
+	.tsvideo {
+		animation: showDivAni 2s 1;
+	}
+
+	@keyframes showDivAni {
+		0% {
+			opacity: 0;
+		}
+
+		100% {
+			opacity: 1;
+		}
+	}
+</style>
+
+<style lang="scss" scoped>
+	.charge-wrapper {
+		margin-top: 15px;
+		width: 100%;
+
+		.top {
+			width: 100%;
+			display: flex;
+			align-items: center;
+
+			.charge-title {
+				font-size: 18px;
+				font-weight: bold;
+			}
+
+			.charge-info {
+				font-size: 15px;
+				color: #868686;
+				margin: 8px 0;
+			}
+
+			.charge-coin {
+				display: flex;
+				flex-direction: row;
+
+				.ji {
+					font-size: 18px;
+				}
+
+				.bi {
+					font-size: 18px;
+					color: $accent-color;
+				}
+			}
+		}
+	}
+
+	.down {
+		display: flex;
+		flex-direction: row;
+		width: 60px;
+		height: 30px;
+		margin-top: 5px;
+		position: absolute;
+		right: 0px;
+		top: 50%;
+		transform: translateY(-50%);
+
+		.down-text {
+			font-size: 16px;
+			color: #000;
+		}
+
+		.down-img {
+			width: 35rpx;
+			height: 35rpx;
+			object-fit: contain;
+		}
+	}
+
+	.ju-top {
+
+		// background-color: ;
+		.ju-top-title {
+			font-size: 16px;
+			font-weight: bold;
+			color: #000;
+			margin-top: 9px;
+			height: 22px;
+			margin-left: 20px;
+			// width: '+ (windowWidth*0.6) +' px;
+			overflow: hidden;
+		}
+
+		.ju-top-update {
+			font-size: 12px;
+			color: #000;
+			margin-top: 9px;
+			height: 22px;
+			margin-left: 20px;
+		}
+	}
+
+	.pop-my {
+		background-color: #FFFFFF;
+	}
+
+	.scroll-my {
+		height: fit-content;
+	}
+
+	.scroll-charge {
+		height: 55vh;
+	}
+
+	.ju-wrapper {
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap;
+		align-items: center;
+		justify-content: start;
+		width: 100%;
+		height: 100%;
+		background-color: #FFFFFF;
+		// margin: 6rpx;
+
+		.ju-content.active {
+			background-color: #ff7f02;
+		}
+
+		.ju-content {
+			flex-grow: 1;
+			position: relative;
+			border-radius: 12rpx;
+			background-color: #f6f6f6;
+			width: 31%;
+			height: 25rpx;
+			align-items: center;
+			justify-content: center;
+			padding: 45rpx 68rpx;
+			margin: 6rpx;
+
+			.lock-wrapper,
+			.lock-wrapper-no {
+				position: absolute;
+				width: 100%;
+				height: 100%;
+				border-radius: 12rpx;
+				background-color: rgba(0, 0, 0, .3);
+
+				.lock-img {
+					position: absolute;
+					left: 3rpx;
+					top: 50%;
+					transform: translateY(-50%);
+					width: 50rpx;
+					height: 50rpx;
+					margin-left: 20rpx;
+				}
+
+				.update-title {
+					width: fit-content;
+					height: fit-content;
+					border-radius: 8rpx;
+					font-size: 10px;
+					padding: 6rpx;
+					background-color: #868686;
+					color: #fff;
+				}
+			}
+
+			.lock-wrapper-no {
+				background-color: #f6f6f6;
+			}
+
+			.title {
+				font-size: 16px;
+			}
+		}
+	}
+
+	.utabs-top /deep/ .u-tabs {
+		align-items: flex-start;
+	}
 </style>