vip功能修改

pages/mine/vip/order.vue

@@ -6,10 +6,19 @@
 			<view class="order_top goods_box pay_box">
 				<view class="pay_title">支付方式</view>
 
-				<view style="margin-bottom: 20rpx">
+				<view style="margin-bottom: 20rpx" v-if="!dataInfo.list">
 					<u-tag :text="`已选：${dataInfo.title}`" bgColor="#DCF2FA" borderColor="#DCF2FA" color="#258feb"
 						plain></u-tag>
 				</view>
+				<view v-if="dataInfo.list&&dataInfo.list.length>0" style="margin: 20rpx 0 40rpx;">
+					{{dataInfo.list[0].title}}价格：<text v-if="dataInfo.title.includes('国学与心理学')"><br/></text>
+					<text v-for="(item,index) in dataInfo.list" :key="index" 
+					class="list_choose" 
+					:class="activeIndex==index?'list_choose_active':''"
+					@click="chooseYear(item, index)">{{item.year}}年</text>
+				</view>
+				
+				
 				<view class="curriulum_title_box goods_item pay_item" v-for="(v, i) in payList">
 					<view :class="isDefaultCurrency && i != 2 ? 'bgGrey top' : 'top'">
 						<view class="left">
@@ -139,6 +148,14 @@
 					this.$forceUpdate();
 				},
 			},
+			lastFee:{
+				immediate: true,
+				handler(newRoute) {
+					if(this.dataInfo.list&&this.dataInfo.list.length>0){
+						this.dataInfo.lastFee = this.dataInfo.list[0].rebateFee
+					}
+				}
+			}
 		},
 		data() {
 			return {
@@ -247,6 +264,7 @@
 					backgroundColor: "linear-gradient(90deg, #3C77BE 0%,#258feb 100%)",
 					color: "#fff",
 				}, ],
+				activeIndex: 0,  //选择付款 下标
 			};
 		},
 		async onLoad(options) {
@@ -526,7 +544,14 @@
 						}
 					});
 			},
-
+			//切换年份选项
+			chooseYear(item,index){
+				this.activeIndex = index;
+				this.dataInfo.lastFee = item.rebateFee;
+				
+				
+				console.log('----this.dataInfo',this.dataInfo);
+			},
 			radioChange(index) {
 				this.selectPayIndex = index;
 				this.payType = this.payList[this.selectPayIndex].type;
@@ -1281,4 +1306,19 @@
 	/deep/.commonDetailPage {
 		height: 100vh !important;
 	}
+	
+	.list_choose{
+		display: inline-block;
+		border:1rpx solid #999;
+		color: #999;
+		border-radius: 10rpx;
+		margin: 20rpx 30rpx 20rpx 0;
+		padding: 0 30rpx;
+		font-size: 28rpx;
+		line-height: 50rpx;
+	}
+	.list_choose_active{
+		border:1rpx solid #ff1f00;
+		color: #ff1f00;
+	}
 </style>