选版本页面样式改版

common/styles/global/pages.scss

@@ -1858,4 +1858,34 @@
 			}
 		}
 	}
+}
+
+// 选版本
+.ezy-xbb-page{
+	width: 100%;height: 100vh;display: flex;flex-direction: column;
+	.xbb-list-box{
+		background-color: #fff;flex: 1;overflow-y: auto;padding-bottom: 120rpx;
+		.xbb-item-box{
+			width: 731rpx;height:273rpx;@include ezy-no-repeat-cover;
+			background-image: url("@/static/images/xuanke/xbb-item-bj.png");
+			position: relative;z-index: 1;box-sizing: border-box;padding: 26rpx 36rpx;
+			display: flex;align-items: center;margin:0 auto 16rpx;
+		}
+		.item-img-box{width: 180rpx;height: 220rpx;border-radius: 12rpx;margin-right: 32rpx;flex-shrink: 0;}
+		.item-content-box{
+			line-height: 1.5;
+			.item-name{color: #333;font-size: 34rpx;font-weight: bolder;margin-bottom: 16rpx;}
+			.item-bb{color: #444;font-size: 30rpx;}
+		}
+		.item-play-btn{
+			width: 100rpx;height: 100rpx;z-index: 2;
+			display: flex;align-items: center;justify-content: center;
+			position: absolute;bottom: 12rpx;right: 12rpx;
+			
+		}
+		.item-play-btn::before{
+			content: '';width: 46rpx;height: 48rpx;display: block;
+			background-image: url("@/static/images/xuanke/xbb-item-jt.png");@include ezy-no-repeat-cover;
+		}
+	}
 }

pages/chanpinXuanze/banben.vue

@@ -1,19 +1,22 @@
 <template>
-	<view>
+	<view class="ezy-xbb-page">
 		<view class="icon-title-navBar-box">
-			<view @click="handleBack"><</view>
+			<view class="nav-bar-icon" @click="handleBack"></view>
 			<view class="nav-bar-title">选择版本</view>
 		</view>
 
-		<view v-for="item in data.banbenList" :key="item.id">
-			<!-- 封面 -->
-			<image :src="item.cover" mode=""></image>
-			<!-- 名称+等级 -->
-			<view>{{item.chanpinName}} {{item.dengjiName}}</view>
-			<!-- 版本名称 -->
-			<view>{{item.name}}</view>
-
-			<view @click="handleSelect(item)">播放按钮</view>
+		<view class="xbb-list-box">
+			<view class="xbb-item-box" v-for="item in data.banbenList" :key="item.id">
+				<!-- 封面 -->
+				<image class="item-img-box" :src="item.cover" mode=""></image>
+				<view class="item-content-box">
+					<!-- 名称+等级 -->
+					<view class="item-name">{{item.chanpinName}} {{item.dengjiName}}</view>
+					<!-- 版本名称 -->
+					<view class="item-bb">{{item.name}}</view>
+				</view>
+				<view class="item-play-btn" @click="handleSelect(item)"></view>
+			</view>
 		</view>
 		<CustomTabBar :currentTabNumber="0"></CustomTabBar>
 	</view>