浏览代码

购物车和学习中心页面调整

xuqiaoying 3 年之前
父节点
当前提交
1827257008
共有 6 个文件被更改,包括 129 次插入95 次删除
  1. 2 2
      common/request.js
  2. 52 41
      pages/learn/index.scss
  3. 58 44
      pages/learn/index.vue
  4. 5 6
      pages/shopping/shoppingCart.vue
  5. 6 1
      pages2/bank/detail.vue
  6. 6 1
      pages3/course/detail.vue

+ 2 - 2
common/request.js

@@ -5,10 +5,10 @@ import api from './api.js'
 var num = 1
 //接口api   
 // export const BASE_URL = 'https://api.xyyxt.net'   //release
-// export const BASE_URL = 'https://test.xyyxt.net'   //预发布
+export const BASE_URL = 'https://test.xyyxt.net'   //预发布
 // export const BASE_URL = 'http://42.192.164.187:19005'    //test
 // export const BASE_URL = 'http://192.168.1.222:5055'    //后端本地更新到222
-export const BASE_URL = 'http://192.168.1.24:5055'    //后端本地
+// export const BASE_URL = 'http://192.168.1.24:5055'    //后端本地
 
  //图片上传api
 // export const BASE_IMG_URL = 'https://file.xyyxt.net/'     //release

+ 52 - 41
pages/learn/index.scss

@@ -117,15 +117,40 @@
 		box-shadow: 0rpx 0rpx 20rpx 1rpx rgba(1,99,235,0.1000);
 		border-radius: 24rpx;
 		padding: 29rpx 29rpx 20rpx 24rpx;
-		display: flex;
-		align-items: center;
+		
 		margin-bottom: 20rpx;
+		.cou_titles {
+			margin-bottom: 12rpx;
+			color: #333333;
+			font-size: 32rpx;
+			font-weight: bold;
+			width: 100%;
+			@include threeDot();
+		}
+		.learn_ranges {
+			color: #666;
+			font-size: 24rpx;
+			.l_range {
+				width: 20rpx;
+				height: 24rpx;
+				margin-right: 9rpx;
+			}
+			.l_time {
+				color: #333;
+			}
+		}
+		.c_downs {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			margin-top: 24rpx;
+		}
 	}
 	.lefts {
-		width: 202rpx;
-		height: 223rpx;
+		width: 204rpx;
+		height: 120rpx;
 		border-radius: 12rpx;
-		margin-right: 35rpx;
+		margin-right: 24rpx;
 		position: relative;
 		top: 0;
 		left: 0;
@@ -133,6 +158,7 @@
 			width: 100%;
 			height: 100%;
 			display: block;
+			border-radius: 16rpx;
 		}
 		.live_icon {
 			width: 65rpx;
@@ -150,60 +176,45 @@
 	}
 	.rights {
 		width: 400rpx;
-		height: 223rpx;
+		height: 120rpx;
 		display: flex;
 		flex-direction: column;
 		justify-content: space-between;;
-		.cou_titles {
-			margin-top: 14rpx;
-			color: #333333;
-			font-size: 28rpx;
-			font-weight: bold;
-			width: 100%;
-			@include threeDot();
-		}
-		.learn_ranges {
-			color: #999;
-			font-size: 24rpx;
-			margin-top: 24rpx;
-			.l_range {
-				width: 20rpx;
-				height: 24rpx;
-				margin-right: 9rpx;
-			}
-			.l_time {
-				color: #333;
-			}
-		}
+		
 		.learn_progress {
 			width: 100%;
+			height: 100%;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
 		}
 		.progress_up {
 			font-size: 24rpx;
-			// font-weight: 400;
 			color: #999999;
-			display: flex;
-			align-items: center;
-			.wk_icon {
-				width: 24rpx;
-				height: 24rpx;
-				margin-right: 8rpx;
+			width: 50%;
+			// .wk_icon {
+			// 	width: 24rpx;
+			// 	height: 24rpx;
+			// 	margin-right: 8rpx;
+			// }
+			.progress_bar {
+				margin-top: 16rpx;
 			}
 		}
 		.progress_down {
-			width: 100%;
+			// width: 100%;
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
 		}
 		.enter_into {
-			width: 165rpx;
-			height: 48rpx;
-			line-height: 48rpx;
+			width: 144rpx;
+			height: 52rpx;
+			line-height: 52rpx;
 			background: #FFB102;
-			border-radius: 0rpx 16rpx 16rpx 16rpx;
-			font-size: 24rpx;
-			font-weight: 400;
+			border-radius: 16rpx;
+			font-size: 26rpx;
+			font-weight: 500;
 			color: #FFFFFF;
 			text-align: center;
 		}

+ 58 - 44
pages/learn/index.vue

@@ -70,35 +70,41 @@
 					<text class="titles">我的课程</text>
 
 					<view v-for="(item, index) in courseLists" :key="index" class="course_item">
-						<view class="lefts">
-							<image class="lefet_img" :src="$method.splitImgHost(item.coverUrl, true)" mode=""></image>
-							<view class="live_icon">直播</view>
+						<view>
+							<view class="cou_titles">{{ item.goodsName }}</view>
+							<view v-if="item.serviceStartTime && item.serviceEndTime" class="learn_ranges">
+								<image class="l_range" src="/static/learn/learn_range.png"></image>
+								学习周期:
+								<text class="l_time">{{ item.serviceStartTime | formate('yyyy.mm.dd') }} - {{ item.serviceEndTime | formate('yyyy.mm.dd') }}</text>
+							</view>
 						</view>
-						<view class="rights">
-							<view>
-								<view class="cou_titles">{{ item.goodsName }}</view>
-								<view v-if="item.serviceStartTime && item.serviceEndTime" class="learn_ranges">
-									<image class="l_range" src="/static/learn/learn_range.png"></image>
-									学习周期:
-									<text class="l_time">{{ item.serviceStartTime | formate('yyyy.mm.dd') }} - {{ item.serviceEndTime | formate('yyyy.mm.dd') }}</text>
-									<!-- <text class="l_time">{{ $method.formate(item.studyStartTime,'yyyy.mm.dd') }} - {{ $method.formate(item.studyStartTime,'yyyy.mm.dd') }}</text> -->
-								</view>
+						<view class="c_downs">
+							<view class="lefts">
+								<image class="lefet_img" :src="$method.splitImgHost(item.coverUrl, true)" mode=""></image>
+								<view class="live_icon">直播</view>
 							</view>
-							<view class="learn_progress">
-								<view class="progress_up">
-									<image src="/static/icon/wk_icon3.png" class="wk_icon"></image>
-									学习进度:{{ item.stuAllNum+item.recordNum }}/{{ item.secAllNum+item.examNum }}
-								</view>
-								<view class="progress_down">
-									<view class="progress_bar" style="width: 50%;">
-										<u-line-progress :showText="false" height="32" active-color="#ff9900" :show-percent="false"
-											:percent="((item.stuAllNum+item.recordNum) / (item.secAllNum+item.examNum)) * 100"></u-line-progress>
+							<view class="rights">
+								
+								<view class="learn_progress">
+									<view class="progress_up">
+										<!-- <image src="/static/icon/wk_icon3.png" class="wk_icon"></image> -->
+										<view>
+											学习进度:{{ item.stuAllNum+item.recordNum }}/{{ item.secAllNum+item.examNum }}
+										</view>
+										<view class="progress_bar" style="width: 100%;">
+											<u-line-progress :showText="false" height="22" active-color="#ff9900" :show-percent="false"
+												:percent="((item.stuAllNum+item.recordNum) / (item.secAllNum+item.examNum)) * 100"></u-line-progress>
+										</view>
+									</view>
+									<view class="progress_down">
+										
+										<view class="enter_into" @click.stop="studyIn(item.goodsId,item.gradeId,item,index)">进入学习</view>
 									</view>
-									<view class="enter_into" @click.stop="studyIn(item.goodsId,item.gradeId,item,index)">进入学习</view>
-								</view>
 
+								</view>
 							</view>
 						</view>
+						
 					</view>
 				</view>
 
@@ -136,33 +142,41 @@
 
 					<template v-if="questionLists.length">
 						<view v-for="(item, indexq) in questionLists" :key="indexq" class="course_item">
-							<view class="lefts">
-								<image class="lefet_img" :src="$method.splitImgHost(item.coverUrl, true)" mode=""></image>
-								<!-- <view class="live_icon">直播</view> -->
+							<view>
+								<view class="cou_titles">{{ item.goodsName }}</view>
+								<view v-if="item.serviceStartTime && item.serviceEndTime" class="learn_ranges">
+									<image class="l_range" src="/static/learn/learn_range.png"></image>
+									学习周期:
+									<text class="l_time">{{ item.serviceStartTime | formate('yyyy.mm.dd') }} - {{ item.serviceEndTime | formate('yyyy.mm.dd') }}</text>
+								</view>
 							</view>
-							<view class="rights">
-								<view>
-									<view class="cou_titles">{{ item.goodsName }}</view>
-									<view v-if="item.serviceStartTime && item.serviceEndTime" class="learn_ranges">
-										<image class="l_range" src="/static/learn/learn_range.png"></image>
-										学习周期:
-										<text class="l_time">{{ item.serviceStartTime | formate('yyyy.mm.dd') }} - {{ item.serviceEndTime | formate('yyyy.mm.dd') }}</text>
-									</view>
+							<view class="c_downs">
+								<view class="lefts">
+									<image class="lefet_img" :src="$method.splitImgHost(item.coverUrl, true)" mode=""></image>
+									<!-- <view class="live_icon">直播</view> -->
 								</view>
-								<view class="learn_progress">
-									<view class="progress_up">
-										<image src="/static/icon/wk_icon3.png" class="wk_icon"></image>
-										学习进度:{{item.doNum}}/{{item.totalNum}}
-									</view>
-									<view class="progress_down">
-										<view class="progress_bar" style="width: 50%;">
-											<u-line-progress :show-percent="false" height="32" active-color="#007AFF" :percent="(item.doNum/item.totalNum)*100"></u-line-progress>
+								<view class="rights">
+									
+									<view class="learn_progress">
+										<view class="progress_up">
+											<!-- <image src="/static/icon/wk_icon3.png" class="wk_icon"></image>
+											学习进度:{{item.doNum}}/{{item.totalNum}} -->
+											<view>
+												学习进度:{{item.doNum}}/{{item.totalNum}}
+											</view>
+											<view class="progress_bar" style="width: 100%;">
+												<u-line-progress :show-percent="false" height="22" active-color="#007AFF" :percent="(item.doNum/item.totalNum)*100"></u-line-progress>
+											</view>
+										</view>
+										<view class="progress_down">
+											
+											<view class="enter_into" @click="studyques(item,index)">进入练习</view>
 										</view>
-										<view class="enter_into" @click="studyques(item,index)">进入练习</view>
-									</view>
 
+									</view>
 								</view>
 							</view>
+							
 						</view>
 					</template>
 					

+ 5 - 6
pages/shopping/shoppingCart.vue

@@ -583,10 +583,11 @@ page {
 				
 				.goods-img {
 					overflow: hidden;
-					width: 132rpx;
-					height: 132rpx;
+					width: 204rpx;
+					height: 120rpx;
 					border-radius: 22rpx;
 					margin-left: 22rpx;
+					margin-right: 24rpx;
 					image {
 						display: block;
 						// width: 278rpx;
@@ -597,16 +598,14 @@ page {
 				}
 				
 				&__auto {
-					margin-left: 20rpx;
 					flex: 1;
 					
-					
 					.goods-title {
 						color: #333333;
 						font-size: 28rpx;
 						font-weight: bold;
 						text-align: right;
-						width: 450rpx;
+						width: 378rpx;
 						overflow:hidden;
 						text-overflow:ellipsis;
 						white-space:nowrap;
@@ -619,7 +618,7 @@ page {
 						font-weight: bold;
 						color: #FC3F3F;
 						display: flex;
-						flex-direction: row-reverse;
+						// flex-direction: row-reverse;
 						margin-right: 8rpx;
 						margin-top: 25rpx;
 					}

+ 6 - 1
pages2/bank/detail.vue

@@ -111,7 +111,7 @@
 			<!-- <view class="priceTag">¥ {{ toFixed(goodsData.standPrice) }}</view> -->
 			<view class="icons">
 				<image src="/static/index/share.png" class="share"></image>
-				<image src="/static/index/shopcar.png" class="shopcar"></image>
+				<image src="/static/index/shopcar.png" class="shopcar" @click="toShopcar()"></image>
 			</view>
 			<view style="display: flex;color: #FFFFFF;align-items: center;">
 				<view class="btn1" @click="addCart">加购物车</view>
@@ -318,6 +318,11 @@ export default {
 						this.$set(this.bankList[index1], 'list', res.data.data);
 					});
 			}
+		},
+		toShopcar() {
+			uni.switchTab({
+			    url: '/pages/shopping/shoppingCart'
+			})
 		}
 	}
 };

+ 6 - 1
pages3/course/detail.vue

@@ -100,7 +100,7 @@
             <!-- <view class="priceTag">分享</view> -->
 			<view class="icons">
 				<image src="/static/index/share.png" class="share"></image>
-				<image src="/static/index/shopcar.png" class="shopcar"></image>
+				<image src="/static/index/shopcar.png" class="shopcar" @click="toShopcar()"></image>
 			</view>
 			<view style="display: flex;color: #FFFFFF;align-items: center;">
 				<view class="btn1" @click="addCart">加购物车</view>
@@ -407,6 +407,11 @@ export default {
 		},
 		change(index){
 			this.current = index;
+		},
+		toShopcar() {
+			uni.switchTab({
+			    url: '/pages/shopping/shoppingCart'
+			})
 		}
 	}
 };