样式开发

common/styles/global/components.scss

@@ -278,33 +278,67 @@ view{box-sizing: border-box;}
 	}
 }
 
-/***** 答题卡 *****/
-/* .answer-card-popup{
-	height: 100vh;display: flex;flex-direction: column;
-	.card-navBar-box{
-		background-color: #0856e6;
-		.icon-title-navBar-box{background-color: #0856e6;}
-		.nav-bar-title{color: #fff!important;}
-		.nav-bar-icon{background-image: url("@/static/images/common/nav-white-bar-jt.svg");}
-	
+/***** 通用scroll-组件 *****/
+.mobile-scroll-box{height: calc(100vh - 304rpx)}
+.mobile-chengji-scroll-box{height: calc(100vh - 304rpx)}
+
+/***** 通用card-组件 *****/
+.mobile-card-box {
+    margin: 0 28rpx;border-bottom: 1rpx solid #f2f1f2;
+    // 标题
+    .mobile-card-title {
+      color: #333;font-size: 32rpx;font-weight: 500;margin: 36rpx 0 32rpx;
+      text-align: justify;line-height: 1.4;@include multi-line-ellipsis(2);
+    }
+
+    // 行
+    .mobile-card-row{
+      margin-bottom: 24rpx;display: flex;justify-content: space-between;align-items: flex-end;
+	  color: #333;font-size: 28rpx;
+      // 得分
+      .mobile-card-score {font-size: 20rpx;color: #F10A0A;}
+      // 分数（有最小宽度）
+      .card-score-box{min-width: 240rpx;text-align: left;}
+    }
+
+    // 按钮
+    .mobile-card-btn {
+		width: 60%;height: 80rpx;line-height: 80rpx;margin: 50rpx auto;color: #fff;
+		background: linear-gradient(0deg,#436aff 0%, #234ff7 100%);border-radius: 80rpx;display: block;}
+}
+
+
+/***** 通用试题页面组件 *****/
+.mobile-shiti-page{
+	.shiti-page-title {
+		height: 80rpx;line-height: 80rpx;background-color: #fff;font-size: 28rpx;border-top: 1rpx solid #ebebeb;
+		color: #333;display: flex;justify-content: space-between;padding: 0 24rpx;border-bottom: 1rpx solid #ebebeb;
 	}
-	.card-content-box{
-		flex: 1;overflow-y: auto;padding: 0 24rpx;
-		.answer-card-content{display: flex;flex-flow: row wrap;}
-		.paragraph-title {color: #666;width: 100%;font-size: 32rpx;padding: 18rpx;
-		padding-bottom: 3rpx;box-sizing: border-box;}
-		.paragraph-qa{
-			width: 80rpx;height: 80rpx;border-radius: 50%;border: 1rpx solid #ccc;
-			text-align: center;line-height: 76rpx;box-sizing: border-box;margin: 30rpx;
-		}
-		.paragraph-qa-block-mark{background-color: #FF9100;color: #fff;border-color:#FF9100;}
+	.shiti-content-box {padding: 24rpx 24rpx 0 24rpx;background-color: #fff;flex: 1;}	
+	.shiti-bottom-box{
+	  width: 100%;height: 100rpx;background-color: #f0f0f0;
+	  display: flex;align-items: center;justify-content: space-between;
+	  padding: 0 24rpx;box-sizing: border-box;position: fixed;bottom: var(--window-bottom);
+	  // 按钮
+	  .shiti-btn{border-radius: 4px;}
+	
+	  // 橙色大的文字
+	  .orange-big-color{color: #FF6B67;font-size: 40rpx;margin-right: 12rpx;}
+	
+	  // 蓝色大的文字
+	  .blue-big-color{color: #0856e6;font-size: 40rpx;margin-right: 12rpx;}
+	  
+	  .shiti-num-box{
+	  	display: flex;align-items: center;font-size: 30rpx;
+	  	.shiti-num-icon {width: 56rpx;height: 56rpx;@include ezy-no-repeat-cover();
+	  	background-image: url("@/static/images/exam/answer-carts-sj.svg");margin-right: 8rpx;}
+	  }
 	}
-	.answer-card-btn-box{
-		display: flex;border-top: 1rpx solid #E3E3E3;background-color: #FEF0F0;line-height: 1;
-		.card-btn{width: 50%;text-align: center;font-size: 32rpx;color: #333;padding: 32rpx 0;}
-		.card-jj-btn{background-color: #0856e6;color: #FFF;}}
-} */
+	
+
+}
 
+  
 /***** 考试须知 *****/
 .ksxz-dialog{
 	width: 640rpx;font-size: 28rpx;color: #333;max-height: 70vh;overflow: auto;border-radius: 20rpx;background-color: #fff;

common/styles/global/pages.scss

@@ -93,16 +93,15 @@
 .phone-kaoshi-page {
 	display: flex;flex-direction: column;background-color: #f4f6fa;position: relative;
 	.kaoshi-page-title {
-		height: 80rpx;line-height: 80rpx;background-color: #fff;font-size: 28rpx;border-top: 1rpx solid #ebebeb;
-		color: #333;display: flex;justify-content: space-between;padding: 0 24rpx;border-bottom: 1rpx solid #ebebeb;
 		.title-types {color: #000;}
 		.exam-countdown .uni-countdown__number,.exam-countdown .uni-countdown__splitor{color: #0856e6!important;}
 	}
-	.kaoshi-shiti-content {padding: 24rpx 24rpx 0 24rpx;background-color: #fff;flex: 1;}	
+	
 	.kaoshi-bottom-box {
-		width: 100%;height: 100rpx;background-color: #f0f0f0;
-		display: flex;align-items: center;justify-content: space-between;
-		padding: 0 24rpx;box-sizing: border-box;position: fixed;bottom: var(--window-bottom);
+		// 标记、取标
+		.shiti-mark-btn{background: #FF9100;border-color: #FF9100;}
+		// 保存
+		.shiti-save-btn{margin: 0 10px 0 16px;}
 		.save-btn-box{display: flex;align-items: center;}
 		.bj-btn,.qb-btn,.save-btn {height: 60rpx;line-height: 58rpx;color: #fff;font-size: 24rpx;
 		box-sizing: border-box;display: flex;align-items: center;padding: 0 16rpx;}
@@ -112,24 +111,18 @@
 		.qb-btn::before{background-image: url("@/static/images/exam/mark2-sj.svg");}
 		.save-btn{margin-left:auto;background-color: #0856e6;border-color: #0856e6;}
 		.save-btn + .save-btn{margin-left: 20rpx;}
-		.shiti-num-box{
-			display: flex;align-items: center;
-			.shiti-num-icon {width: 56rpx;height: 56rpx;@include ezy-no-repeat-cover();
-			background-image: url("@/static/images/exam/answer-carts-sj.svg");margin-right: 8rpx;}
-			.active-num {color: #000;}
-		}
-		
 	}	
-	.ks-btn-prev,.ks-btn-next{border:1rpx solid #0856e6;background-color: #F2F7FF;color: #0856e6;padding: 0 16rpx;}
-	.ks-btn-prev::before,.ks-btn-next::after{
-		content: '';width: 20rpx;height: 20rpx;display: inline-block;@include ezy-no-repeat-cover();
-		background-image: url("@/static/images/exam/icon-jiantou-sj.svg");}
-	.ks-btn-prev::before{transform: rotate(180deg);margin-right: 8rpx;;}
-	.ks-btn-prev::after{display: none;}
-	.ks-btn-next::after{transform:unset;border: 0;position: unset;margin-left: 8rpx;}
-	.ks-btn-prev {position: fixed;bottom: 140rpx;left: 24rpx;}
-	.ks-btn-next {position: fixed;bottom: 140rpx;right: 24rpx;}
 }
+
+// 课程
+.mobile-score-page{
+	.kecheng-bottom-box{
+		.answer-score-icon{width: 56rpx;height: 56rpx;@include ezy-no-repeat-cover();
+	  	background-image: url("@/static/images/exam/answer-score-sj.svg");margin-right: 8rpx;}
+	}
+}
+
+
 	
 // 我的
 .mobile-my-page{

pages/exam/exam.vue

@@ -1,8 +1,8 @@
 <template>
-	<view class="phone-kaoshi-page">
+	<view class="mobile-shiti-page phone-kaoshi-page">
 		<customNavbarVue :title="data.ksName" :show-back-btn="true" @back="handleBack"></customNavbarVue>
 		<!-- 第一行 -->
-		<view class="kaoshi-page-title">
+		<view class="shiti-page-title kaoshi-page-title">
 			<view v-if="activeSt" class="title-types">{{dlName}}</view>
 			<!--  倒计时 -->
 			<view v-if="!!data.endSecond">
@@ -10,7 +10,7 @@
 					:second="data.endSecond" @timeup="onTimeUp" :start="startCountDown"></uni-countdown>
 			</view>
 		</view>
-		<view class="kaoshi-shiti-content">
+		<view class="shiti-content-box">
 			<!-- 内容区域 -->
 			<!-- 试题区域 -->
 			<view v-if="activeSt">
@@ -42,7 +42,7 @@
 
 		</view>
 
-		<view class="kaoshi-bottom-box" v-if="activeSt">
+		<view class="shiti-bottom-box kaoshi-bottom-box" v-if="activeSt">
 			<button class="phone-green-btn" :class="[activeSt.marked ? 'qb-btn' : 'bj-btn']" hover-class="none"
 				type="default" size="mini" @click="handleBiaoji">{{activeSt && activeSt.marked ? '取标':'标记'}}</button>
 			<view @click="showAnswerCard" class="shiti-num-box">
@@ -58,9 +58,9 @@
 			</view>
 		</view>
 		<template v-if="activeSt">
-			<button type="default" size="mini" hover-class="none" class="phone-green-btn ks-btn-prev"
+			<button type="default" size="mini" hover-class="none" class="phone-green-btn st-btn-prev"
 				@click="handlePrev" v-if="!isFistStId">上一题</button>
-			<button type="default" size="mini" hover-class="none" class="phone-green-btn ks-btn-next"
+			<button type="default" size="mini" hover-class="none" class="phone-green-btn st-btn-next"
 				@click="handleNext" v-if="!isLastStId">下一题</button>
 
 		</template>

pages/score/kaoshiChengjiInfo.vue

@@ -1,14 +1,12 @@
 <template>
-	<view class="phone-kaoshi-page">
+	<view class="mobile-shiti-page mobile-score-page">
 		<customNavbarVue :title="data.name" :show-back-btn="true" @back="handleBack"></customNavbarVue>
 		<!-- 第一行 -->
-		<view class="kaoshi-page-title">
+		<view class="shiti-page-title kaoshi-page-title">
 			<view v-if="activeSt" class="title-types">{{dlName}}</view>
-			<view>100分钟</view>
 		</view>
 
-
-		<view class="kaoshi-shiti-content">
+		<view class="shiti-content-box">
 			<!-- 内容区域 -->
 			<!-- 试题区域 -->
 			<view v-if="activeSt">
@@ -40,20 +38,20 @@
 			</view>
 
 		</view>
-		<view class="kaoshi-bottom-box">
-			<view @click="showAnswerCard" class="shiti-num-box">
-				<text>
-					{{data.userScore}} / {{data.ksScore}}分
-				</text>
+		<view class="shiti-bottom-box">
+			<view class="shiti-num-box kecheng-bottom-box">
+				<icon class="answer-score-icon"></icon>
+				<text class="orange-big-color">{{data.userScore}}</text> / {{data.ksScore}}分
+			</view>
+			<view class="shiti-num-box"  @click="showAnswerCard" >
 				<icon class="shiti-num-icon"></icon>
-				<text
-					class="active-num">{{activeSt ? activeSt.onlyNum: 0}}</text>/<text>{{data.StListForSearch.length}}</text>
+				<text class="blue-big-color">{{activeSt ? activeSt.onlyNum: 0}}</text>/ {{data.StListForSearch.length}}
 			</view>
 		</view>
 		<template v-if="activeSt">
-			<button type="default" size="mini" hover-class="none" class="phone-green-btn ks-btn-prev"
+			<button type="default" size="mini" hover-class="none" class="phone-green-btn st-btn-prev"
 				@click="handlePrev" v-if="!isFistStId">上一题</button>
-			<button type="default" size="mini" hover-class="none" class="phone-green-btn ks-btn-next"
+			<button type="default" size="mini" hover-class="none" class="phone-green-btn st-btn-next"
 				@click="handleNext" v-if="!isLastStId">下一题</button>
 		</template>
 		<uni-popup ref="popupRef" background-color="#fff" :animation="false" :is-mask-click="false" :mask-click="false">