11 changed files with 628 additions and 21 deletions
-
38pages.json
-
4pages/exercises/brushQuestions/brushQuestions.vue
-
2pages/exercises/exam/exam.vue
-
236pages/exercises/examSubjiect1/examResultsOne.vue
-
112pages/exercises/examSubjiect1/examSubjiect1.vue
-
136pages/exercises/lastPage/lastPage.vue
-
2pages/exercises/theoryStudy/theoryStudy.vue
-
73pages/vip/vipEntry/vipEntry.vue
-
44pages/vip/vipQuestions/vipQuestions.vue
-
0static/images/vip/stepTag.png
@ -0,0 +1,236 @@ |
|||||
|
<template> |
||||
|
<view class="content"> |
||||
|
<up-navbar leftText=" " :leftIconColor="'#fff'" :safeAreaInsetTop="true" :autoBack="true" title="我的学习" |
||||
|
:bgColor="'transparent'" :titleStyle="{color: '#fff'}"> |
||||
|
</up-navbar> |
||||
|
<view class="padding"> |
||||
|
<view class="useInfo flex"> |
||||
|
<view class="avatar"> |
||||
|
<image src="" mode=""></image> |
||||
|
</view> |
||||
|
<view class="rightBox"> |
||||
|
<view class="name">用户名</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="card"> |
||||
|
<view class="bigNum"> |
||||
|
<view class="num">80%</view> |
||||
|
<view class="lab">预测通过率</view> |
||||
|
</view> |
||||
|
<view class="huiBg"> |
||||
|
<view class="li"> |
||||
|
<view class="num">10:22</view> |
||||
|
<view class="lab">测试时长</view> |
||||
|
</view> |
||||
|
<view class="li"> |
||||
|
<view class="num">10</view> |
||||
|
<view class="lab">已做题</view> |
||||
|
</view> |
||||
|
<view class="li"> |
||||
|
<view class="num">14</view> |
||||
|
<view class="lab">答错题</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="btnBox"> |
||||
|
<oneBtn text="快速提升通过率" @oneBtnClick="$goPage('/pages/vip/vipEntry/vipEntry')"></oneBtn> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="card card2"> |
||||
|
<view class="chartTab"> |
||||
|
<view class="h3">模拟考试成绩</view> |
||||
|
<view class="btn_row"> |
||||
|
<view class="btn" @click="changeChart(1)" :class="{bg: currentChart==1}">曲线</view> |
||||
|
<view class="btn" @click="changeChart(2)" :class="{bg: currentChart==2}">明细</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="tip">近30次科目一模拟考试成绩</view> |
||||
|
<view class="con" v-if="currentChart==1"> |
||||
|
图表 |
||||
|
<view class="tips">按住可左右滑动查看更多成绩</view> |
||||
|
</view> |
||||
|
<view class="con" v-if="currentChart==2"> |
||||
|
<view class="tables"> |
||||
|
<view class="fristTab li"> |
||||
|
<view class="item">考试成绩</view> |
||||
|
<view class="item">考试用时</view> |
||||
|
<view class="item">考试时间</view> |
||||
|
</view> |
||||
|
<view class="li"> |
||||
|
<view class="item">90分</view> |
||||
|
<view class="item">10分30秒</view> |
||||
|
<view class="item">2024-8-28</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
|
||||
|
<script setup> |
||||
|
import { ref } from 'vue' |
||||
|
import nodata from '@/components/nodata/nodata.vue' |
||||
|
const value = ref(false) |
||||
|
const currentNav = ref(1) |
||||
|
|
||||
|
function changeNav(val) { |
||||
|
currentNav.value = val |
||||
|
} |
||||
|
|
||||
|
const currentChart = ref(1) |
||||
|
function changeChart(num) { |
||||
|
currentChart.value = num |
||||
|
} |
||||
|
|
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.content { |
||||
|
width: 100%; |
||||
|
min-height: 100vh; |
||||
|
padding: 100rpx 0rpx 30rpx 0rpx; |
||||
|
background: url('../../../static/images/topbg.png') #F6F7FA no-repeat; |
||||
|
background-size: 100% 410rpx; |
||||
|
|
||||
|
.useInfo { |
||||
|
padding: 30rpx 0; |
||||
|
|
||||
|
.avatar { |
||||
|
width: 140rpx; |
||||
|
height: 140rpx; |
||||
|
overflow: hidden; |
||||
|
border-radius: 50%; |
||||
|
background: url('../../../static/images/avatarbg.png') no-repeat; |
||||
|
background-size: 100% 100%; |
||||
|
|
||||
|
image { |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.rightBox { |
||||
|
flex: 1; |
||||
|
width: 0; |
||||
|
padding-left: 30rpx; |
||||
|
|
||||
|
.name { |
||||
|
font-size: 36rpx; |
||||
|
color: #FFFFFF; |
||||
|
font-weight: 500; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.bigNum { |
||||
|
padding: 20rpx 0 20rpx 0; |
||||
|
text-align: center; |
||||
|
.num { |
||||
|
font-weight: bold; |
||||
|
font-size: 72rpx; |
||||
|
color: #3776FF; |
||||
|
} |
||||
|
.lab { |
||||
|
font-weight: 400; |
||||
|
font-size: 24rpx; |
||||
|
color: #CCCCCC; |
||||
|
} |
||||
|
} |
||||
|
.huiBg { |
||||
|
width: 100%; |
||||
|
height: 164rpx; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
text-align: center; |
||||
|
padding-bottom: 30rpx ; |
||||
|
.li { |
||||
|
flex: 1; |
||||
|
.num { |
||||
|
font-family: DIN; |
||||
|
font-weight: bold; |
||||
|
font-size: 48rpx; |
||||
|
} |
||||
|
|
||||
|
.lab { |
||||
|
font-size: 24rpx; |
||||
|
margin-top: 10rpx; |
||||
|
color: #999999; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.card { |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 20rpx; |
||||
|
overflow: hidden; |
||||
|
margin-top: 20rpx; |
||||
|
padding: 30rpx; |
||||
|
} |
||||
|
.tables { |
||||
|
width: 100%; |
||||
|
.fristTab.li { |
||||
|
background: #F4F4F4; |
||||
|
border-radius: 8rpx 8rpx 0 0; |
||||
|
.item { |
||||
|
color: $themC; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.li { |
||||
|
height: 76rpx; |
||||
|
line-height: 76rpx; |
||||
|
border-bottom: 1rpx solid #F4F4F4; |
||||
|
display: flex; |
||||
|
.item { |
||||
|
text-align: center; |
||||
|
flex: 1; |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.tip { |
||||
|
font-size: 24rpx; |
||||
|
color: #ccc; |
||||
|
padding: 10rpx 0 30rpx; |
||||
|
} |
||||
|
.tips { |
||||
|
width: 360rpx; |
||||
|
height: 48rpx; |
||||
|
background: #DCE7FF; |
||||
|
border-radius: 24rpx; |
||||
|
font-size: 24rpx; |
||||
|
color: $themC; |
||||
|
text-align: center; |
||||
|
line-height: 48rpx; |
||||
|
margin-top: 30rpx; |
||||
|
} |
||||
|
.chartTab { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
.btn_row { |
||||
|
display: flex; |
||||
|
width: 170rpx; |
||||
|
height: 44rpx; |
||||
|
border-radius: 8rpx; |
||||
|
overflow: hidden; |
||||
|
border: 1px solid $themC; |
||||
|
.btn.bg { |
||||
|
background: #3776FF; |
||||
|
color: #fff; |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
color: $themC; |
||||
|
text-align: center; |
||||
|
font-size: 28rpx; |
||||
|
flex: 1; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,112 @@ |
|||||
|
<template> |
||||
|
<view class="content"> |
||||
|
<up-navbar leftText=" " :leftIconColor="'#fff'" :safeAreaInsetTop="true" :autoBack="true" title="我的学习" |
||||
|
:bgColor="'transparent'" :titleStyle="{color: '#fff'}"> |
||||
|
<template #right> |
||||
|
<view class="cjd" @click="$goPage('/pages/exercises/examSubjiect1/examResultsOne')"> |
||||
|
成绩单 |
||||
|
</view> |
||||
|
</template> |
||||
|
</up-navbar> |
||||
|
<view class="padding"> |
||||
|
<view class="useInfo flex"> |
||||
|
<view class="avatar"> |
||||
|
<image src="" mode=""></image> |
||||
|
</view> |
||||
|
<view class="rightBox"> |
||||
|
<view class="name">用户名</view> |
||||
|
<view class="p"> |
||||
|
<text>最高分数：85</text> |
||||
|
<text>用时：00：30</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="card"> |
||||
|
<view class="text">考试车型：小车C1</view> |
||||
|
<view class="text">考试时间：45分钟（100题）</view> |
||||
|
<view class="text">合格标准：90分及格（满分100分）</view> |
||||
|
<view class="text">出题规则：根据公安部规定出题规则组卷</view> |
||||
|
<view class="text">计分规则：模拟考试下不能修改答案，每错1题扣2分，累计错题超过5道，考试不通过，系统自动提醒交卷。</view> |
||||
|
</view> |
||||
|
<view class="btnBox"> |
||||
|
<oneBtn text="开始模拟考试"></oneBtn> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.content { |
||||
|
width: 100%; |
||||
|
min-height: 100vh; |
||||
|
padding: 100rpx 0rpx 30rpx 0rpx; |
||||
|
background: url('../../../static/images/topbg.png') #F6F7FA no-repeat; |
||||
|
background-size: 100% 410rpx; |
||||
|
.cjd { |
||||
|
color: #fff; |
||||
|
} |
||||
|
.useInfo { |
||||
|
padding: 30rpx 0; |
||||
|
|
||||
|
.avatar { |
||||
|
width: 140rpx; |
||||
|
height: 140rpx; |
||||
|
overflow: hidden; |
||||
|
border-radius: 50%; |
||||
|
background: url('../../../static/images/avatarbg.png') no-repeat; |
||||
|
background-size: 100% 100%; |
||||
|
image { |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.rightBox { |
||||
|
flex: 1; |
||||
|
width: 0; |
||||
|
padding-left: 30rpx; |
||||
|
|
||||
|
.name { |
||||
|
font-size: 36rpx; |
||||
|
color: #FFFFFF; |
||||
|
font-weight: 500; |
||||
|
} |
||||
|
|
||||
|
.p { |
||||
|
padding-top: 30rpx; |
||||
|
|
||||
|
text { |
||||
|
font-weight: 500; |
||||
|
font-size: 28rpx; |
||||
|
color: #FFFFFF; |
||||
|
margin-right: 40rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.card { |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 20rpx 30rpx; |
||||
|
|
||||
|
.text { |
||||
|
padding: 10rpx 0; |
||||
|
font-weight: 500; |
||||
|
font-size: 28rpx; |
||||
|
color: #333333; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.btnBox { |
||||
|
padding: 100rpx 50rpx; |
||||
|
width: 100%; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,136 @@ |
|||||
|
<template> |
||||
|
<view class="content"> |
||||
|
<u-navbar leftText=" " title="顺序练习成绩" :safeAreaInsetTop="true" :autoBack="true" :fixed="false" :leftIconColor="'#fff'" :bgColor="'transparent'" :titleStyle="{color: '#fff'}"></u-navbar> |
||||
|
<view class="padding"> |
||||
|
<view class="card"> |
||||
|
<view class="echartBox"> |
||||
|
这里是图表 |
||||
|
</view> |
||||
|
<view class="huiBg"> |
||||
|
<view class="li"> |
||||
|
<view class="num">10:22</view> |
||||
|
<view class="lab">测试时长</view> |
||||
|
</view> |
||||
|
<view class="li"> |
||||
|
<view class="num">10</view> |
||||
|
<view class="lab">已做题</view> |
||||
|
</view> |
||||
|
<view class="li"> |
||||
|
<view class="num">14</view> |
||||
|
<view class="lab">答错题</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="btn_row"> |
||||
|
<view class="btn">查看全部错题</view> |
||||
|
<view class="btn lastBtn">继续答题</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="card flex-b"> |
||||
|
<view class="leftTxt"> |
||||
|
<view class="text">查看全部错题</view> |
||||
|
<view class="tps">继续答题</view> |
||||
|
</view> |
||||
|
<view class="lianxi flex"> |
||||
|
<view class="lx">去练习</view> |
||||
|
<u-icon name="arrow-right" color="#666" size="14"></u-icon> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.content { |
||||
|
background: linear-gradient(0deg, rgba(55,118,255,0) 0%, #3776FF 100%) no-repeat #F6F7FA; |
||||
|
background-size: 100% 720rpx; |
||||
|
width: 100%; |
||||
|
min-height: 100vh; |
||||
|
.card { |
||||
|
width: 100%; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 30rpx; |
||||
|
margin-top: 30rpx; |
||||
|
.echartBox { |
||||
|
width: 100%; |
||||
|
min-height: 230rpx; |
||||
|
} |
||||
|
|
||||
|
.huiBg { |
||||
|
width: 100%; |
||||
|
height: 144rpx; |
||||
|
background: #F4F4F4; |
||||
|
border-radius: 20rpx; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
text-align: center; |
||||
|
.li { |
||||
|
flex: 1; |
||||
|
.num { |
||||
|
font-family: DIN; |
||||
|
font-weight: bold; |
||||
|
font-size: 48rpx; |
||||
|
} |
||||
|
|
||||
|
.lab { |
||||
|
font-size: 24rpx; |
||||
|
margin-top: 10rpx; |
||||
|
color: #999999; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.btn_row { |
||||
|
padding-top: 40rpx; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
.btn { |
||||
|
height: 77rpx; |
||||
|
background: linear-gradient(90deg, #FAE0A2 0%, #F6C86F 100%); |
||||
|
border-radius: 39rpx; |
||||
|
color: #6B4229; |
||||
|
font-weight: 500; |
||||
|
font-size: 28rpx; |
||||
|
text-align: center; |
||||
|
line-height: 77rpx; |
||||
|
width: 48%; |
||||
|
&.lastBtn { |
||||
|
background: #3776FF; |
||||
|
color: #fff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.card { |
||||
|
.leftTxt { |
||||
|
flex: 1; |
||||
|
.text { |
||||
|
font-weight: 500; |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
|
||||
|
.tps { |
||||
|
font-weight: 500; |
||||
|
font-size: 24rpx; |
||||
|
color: #666666; |
||||
|
margin-top: 10rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.lianxi { |
||||
|
.lx { |
||||
|
font-weight: 500; |
||||
|
font-size: 24rpx; |
||||
|
color: #3776FF; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,44 @@ |
|||||
|
<template> |
||||
|
<view class="content"> |
||||
|
<up-collapse |
||||
|
:value="['2']" |
||||
|
:border="false" |
||||
|
> |
||||
|
<up-collapse-item |
||||
|
title="文档指南" |
||||
|
|
||||
|
> |
||||
|
<view class="textbg"> |
||||
|
<text class="u-collapse-content">涵盖uniapp各个方面，给开发者方向指导和设计理念，让您茅塞顿开，一马平川</text> |
||||
|
</view> |
||||
|
</up-collapse-item> |
||||
|
<up-collapse-item |
||||
|
title="组件全面" |
||||
|
> |
||||
|
<view class="textbg"> |
||||
|
<text class="u-collapse-content">众多组件覆盖开发过程的各个需求，组件功能丰富，多端兼容。让您快速集成，开箱即用</text> |
||||
|
</view> |
||||
|
</up-collapse-item> |
||||
|
<up-collapse-item |
||||
|
name="2" |
||||
|
title="众多利器" |
||||
|
> |
||||
|
<view class="textbg"> |
||||
|
<text class="u-collapse-content">众多的贴心小工具，是您开发过程中召之即来的利器，让您飞镖在手，百步穿杨</text> |
||||
|
</view> |
||||
|
</up-collapse-item> |
||||
|
</up-collapse> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.textbg { |
||||
|
background: #F4F4F4; |
||||
|
border-radius: 10rpx; |
||||
|
padding: 20rpx; |
||||
|
} |
||||
|
|
||||
|
</style> |
||||
|
Before Width: 125 | Height: 47 | Size: 465 B After Width: 125 | Height: 47 | Size: 465 B |
Write
Preview
Loading…
Cancel
Save
Reference in new issue