样式优化

This commit is contained in:
binbin_pan 2024-12-31 18:16:11 +08:00
parent 0400ac61ce
commit 8641b3298e
3 changed files with 37 additions and 27 deletions

View File

@ -5,17 +5,17 @@
<div class="subtitle">{{ subtitle }}</div>
<div class="info">
<div class="duration-wrapper">
<u-icon name="/static/images/time.png"></u-icon>
<u-icon name="/static/images/time.png" size="25"></u-icon>
<div class="duration">{{ duration }}分钟</div>
<div class="explain">考试时长</div>
</div>
<div class="count-wrapper">
<u-icon name="/static/images/infinite.png" size="21"></u-icon>
<u-icon name="/static/images/infinite.png" size="30"></u-icon>
<div class="count">{{ count }}</div>
<div class="explain">考试次数</div>
</div>
<div class="switch-count-wrapper">
<u-icon name="/static/images/qiehuan.png"></u-icon>
<u-icon name="/static/images/qiehuan.png" size="25"></u-icon>
<div class="switch-count">{{ '不允许切屏' }}</div>
<div class="explain">切屏次数</div>
</div>

View File

@ -10,11 +10,11 @@
></u-tag>
<u-tag
text="中"
:type="fontSize == 21 ? 'primary' : 'info'"
:type="fontSize == 20.5 ? 'primary' : 'info'"
@click="changeFont(20.5)"
style="margin-right: 8px"
></u-tag>
<u-tag text="大" :type="fontSize == 23 ? 'primary' : 'info'" @click="changeFont(22)"></u-tag>
<u-tag text="大" :type="fontSize == 22 ? 'primary' : 'info'" @click="changeFont(22)"></u-tag>
</view>
</u-navbar>
<div class="content" @touchstart="touchStart" @touchmove="touchMove" @touchend="touchEnd">

View File

@ -5,17 +5,20 @@
<h2 style="margin: 0 10px 8px">{{ name }}</h2>
<span style="font-size: 15px; color: #b0b0b0; margin: 0 10px">合格标准学习进度达到{{ eligibility }}%</span>
<view class="user-info">
<div style="font-size: 18px; margin: 0 10px">{{ createUserName }}</div>
<!-- <div style="font-size: 18px; margin: 0 10px; display: flex; align-items: center">
<u-avatar :src="avatar" size="25"></u-avatar>
<div style="margin-left: 5px">{{ createUserName }}</div>
</div> -->
<div class="training-content">
<div>培训内容{{ listStageContentNum || '暂无' }}</div>
</div>
</view>
<!-- <view class="tip">已开启进度同步其他途径的学习进度已自动同步</view> -->
<view class="tip">已开启进度同步其他途径的学习进度已自动同步</view>
<div v-for="(stageItem, stageIndex) in listStage" :key="stageIndex" :title="stageItem.stageName">
<div class="item-stage" @click="handleShow(stageItem)">
<!-- <div class="item-stage" @click="handleShow(stageItem)">
<span style="font-size: 18px; margin: 0 10px">{{ stageItem.stageName }}</span>
<u-icon :name="!stageItem.isShow ? 'arrow-down' : 'arrow-up'" size="20" style="margin: 0 5px" />
</div>
</div> -->
<div v-if="stageItem.isShow">
<div v-for="(content, conIndex) in stageItem.listStageContent" :key="conIndex">
<u-collapse :border="false" :value="[1]">
@ -30,7 +33,7 @@
<div class="left-content">
<div class="title">
<u-icon name="/static/images/curriculum.png" size="15" />
<div style="margin: 0 15px 0 3px">素材</div>
<div class="title-tip">素材</div>
<div>{{ item.totalTime }}</div>
</div>
<div class="note">{{ item.studyName }}</div>
@ -59,7 +62,7 @@
<div class="left-content">
<div class="title">
<u-icon name="/static/images/curriculum.png" size="15" />
<div style="margin: 0 15px 0 3px">课程</div>
<div class="title-tip">课程</div>
<div>{{ item.totalTime }}</div>
</div>
<div class="note">{{ item.studyName }}</div>
@ -84,7 +87,7 @@
<div class="left-content">
<div class="title">
<u-icon name="/static/images/exercises.png" size="15" />
<div style="margin: 0 15px 0 3px">练习</div>
<div class="title-tip">练习</div>
</div>
<div class="note">{{ content.studyName }}</div>
<div v-show="content.practiceMsg && content.practiceMsg.allQuestionNum > 0">
@ -107,7 +110,7 @@
<div class="left-content">
<div class="title">
<u-icon name="/static/images/examine.png" size="15" />
<div style="margin: 0 15px 0 3px">考试</div>
<div class="title-tip">考试</div>
<div>{{ content.responseTime }}分钟</div>
</div>
<div class="note">{{ content.name }}</div>
@ -144,6 +147,7 @@ import config from 'config'
export default {
data() {
return {
avatar: config.fileUrl + uni.getStorageSync('facePath'),
projId: '',
studyId: '', // id
starRate: 4,
@ -332,18 +336,20 @@ export default {
<style lang="scss">
::v-deep .u-cell__body {
padding: 5px !important;
padding: 20px 12px 20px 10px !important;
}
::v-deep .u-collapse-item__content__text {
padding: 0 5px !important;
padding: 0 !important;
}
::v-deep .u-cell__body {
border-bottom: 1px solid #f0f0f0;
}
.page {
width: 100vw;
height: 100vh;
min-height: 100vh;
background-color: #f8f8f8;
box-sizing: border-box;
padding: 5vw 10px;
padding: 10px;
position: relative;
font-style: 20px;
@ -360,6 +366,7 @@ export default {
width: 100%;
box-sizing: border-box;
padding: 30rpx 0;
margin-bottom: 20px;
background-color: #fff;
border-radius: 20rpx;
display: flex;
@ -367,9 +374,6 @@ export default {
box-shadow: #f4f4f4 2px 2px;
.slot-item-title {
margin-left: 10px;
height: 45px;
line-height: 45px;
font-size: 18px;
}
@ -432,8 +436,7 @@ export default {
}
.tip {
width: 100%;
margin: 2vh auto;
margin: 20px 10px;
background-color: #f7f7f7;
font-size: 12px;
color: #9b9b9b;
@ -442,6 +445,7 @@ export default {
align-items: center;
box-sizing: border-box;
padding: 25rpx 15rpx;
border-radius: 5px;
}
.collapse-item {
/* height: 400px; */
@ -459,22 +463,27 @@ export default {
margin-bottom: 3px;
padding-bottom: 5px;
border-bottom: 1px solid #f0f0f0;
color: #b0b0b0;
color: #333;
/* height: 400px; */
background-color: #e6f0fa;
background-color: #f4f9fe;
overflow: auto;
.left-content {
font-size: 18px;
font-size: 14px;
width: 50vw;
.title {
display: flex;
align-items: center;
.title-tip {
margin: 0 15px 0 3px;
}
}
.note {
/* width: 130px; */
font-size: 17px;
font-weight: 700;
margin-top: 15px;
margin-bottom: 10px;
color: #333;
word-wrap: break-word;
}
}
@ -482,6 +491,7 @@ export default {
width: 35vw;
display: flex;
align-items: center;
font-weight: 800;
.progress {
width: 100px;
margin-right: 5px;