优化样式

vedio/pagesA/vipPay/vipPay.vue

@@ -13,22 +13,22 @@
 					<view class="pack-item" v-for='(item, index) in vipList' :key='index'
 						@click="choosePack(item, index)">
 						<view class="pack-content" :class="[{active: index==selectedIndex}]">
-							<view class="label">
+							<view class="label" v-if="item.topTitle">
 								{{ item.topTitle }}
 							</view>
 							<view class="name row" :class="[{active2: index==selectedIndex}]">
 								{{item.title}}
 							</view>
 							<view class="price row" :class="[{active1: index==selectedIndex}]">
-								<view style="font-size: 22rpx;">￥</view>
+								<view style="font-size: 30rpx;">￥</view>
 								{{item.firstPayPrice}}
 							</view>
 							<view class="origin row" v-if='item.oldPrice'>
 								￥{{item.oldPrice}}
 							</view>
 
-							<view class="origin2 row" v-if='item.oldPrice'>
-								{{item.remarks }}
+							<view class="origin2 row" v-if='item.remarks'>
+								{{ getRemark1(item.remarks) + '\r\n' + getRemark2(item.remarks) }}
 							</view>
 
 							<view class="label2" v-if="index==selectedIndex">
@@ -126,6 +126,20 @@
 			amount(value) {
 				return value.toFixed(2)
 			},
+			getRemark1(value) {
+				let data = value.split(',')
+				if (data.length > 0) {
+					return data[0]
+				}
+				return ''
+			},
+			getRemark2(value) {
+				let data = value.split(',')
+				if (data.length > 1) {
+					return data[1]
+				}
+				return ''
+			},
 			handlePay() {
 				if (!this.checked) {
 					message.notify("请阅读《支付协议》后勾选同意")
@@ -260,15 +274,15 @@
 
 					.pack-content {
 						width: 100%;
-						height: 270rpx;
+						height: 320rpx;
 						display: flex;
 						flex-direction: column;
 						align-items: center;
 						background: white;
-						border: 4rpx solid #EAECEC;
+						border: 2rpx solid #EAECEC;
 						border-radius: 20rpx;
 						position: relative;
-						padding-top: 50rpx;
+						padding-top: 60rpx;
 
 						.row {
 							display: flex;
@@ -282,13 +296,13 @@
 						}
 
 						.name {
-							font-size: 26rpx;
+							font-size: 30rpx;
 							font-weight: 700;
 							color: #000000;
 						}
 
 						.price {
-							font-size: 40rpx;
+							font-size: 60rpx;
 							color: #000000;
 							font-weight: 700;
 						}
@@ -303,15 +317,15 @@
 
 
 						.origin {
-							font-size: 22rpx;
+							font-size: 26rpx;
+							margin: 0;
 							text-align: center;
 							color: #676666;
 							text-decoration: line-through;
 						}
 
 						.origin2 {
-							// width: 100rpx;
-							font-size: 22rpx;
+							font-size: 26rpx;
 							text-align: center;
 							color: #676666;
 							word-wrap: break-word;