mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/student-h5.git
synced 2025-12-07 01:46:45 +08:00
Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/stu_h5
This commit is contained in:
dongwug
BIN
src/assets/image/activities/bg.png
Normal file
BIN
src/assets/image/activities/bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
BIN
src/assets/image/activities/no.png
Normal file
BIN
src/assets/image/activities/no.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 454 B |
BIN
src/assets/image/activities/trumpet.png
Normal file
BIN
src/assets/image/activities/trumpet.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 806 B |
BIN
src/assets/image/activities/yes.png
Normal file
BIN
src/assets/image/activities/yes.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 347 B |
BIN
src/assets/image/pathmap/personal.png
Normal file
BIN
src/assets/image/pathmap/personal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 528 B |
BIN
src/assets/image/pathmap/photo.png
Normal file
BIN
src/assets/image/pathmap/photo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
BIN
src/assets/image/pathmap/study.png
Normal file
BIN
src/assets/image/pathmap/study.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 521 B |
274
src/views/activities/activities.vue
Normal file
274
src/views/activities/activities.vue
Normal file
@@ -0,0 +1,274 @@
|
|||||||
|
<template>
|
||||||
|
<div class="activities">
|
||||||
|
<TitleHead text="【其他活动】管理者进阶腾飞班 - 专属线下活动"></TitleHead>
|
||||||
|
<div class="message">
|
||||||
|
<div class="yes"></div>
|
||||||
|
<div class="textmessage">签到成功</div>
|
||||||
|
<div class="no"></div>
|
||||||
|
</div>
|
||||||
|
<div class="main">
|
||||||
|
<div class="title">
|
||||||
|
<div class="titlemain">
|
||||||
|
<div class="timeposition">
|
||||||
|
<div class="time">
|
||||||
|
<img
|
||||||
|
style="width: 13px; height: 14.5px; margin-right: 5.5px"
|
||||||
|
src="../../assets/image/faceteach/time.png"
|
||||||
|
/>
|
||||||
|
<div style="font-size: 12px; color: rgba(110, 123, 132, 1)">
|
||||||
|
2022-07-20 20:00-21:00
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="time" style="margin-top: 9px">
|
||||||
|
<img
|
||||||
|
style="width: 13px; height: 15px; margin-right: 5.5px"
|
||||||
|
src="../../assets/image/faceteach/position.png"
|
||||||
|
/>
|
||||||
|
<div style="font-size: 12px; color: rgba(110, 123, 132, 1)">
|
||||||
|
大族广场
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="titlebtn">签到</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="notice">
|
||||||
|
<div class="noticebox">
|
||||||
|
<div class="mani">
|
||||||
|
<div class="lefttitle">
|
||||||
|
<div class="img"></div>
|
||||||
|
<div class="rightmain">
|
||||||
|
<div class="talk">活动公告</div>
|
||||||
|
<div class="box"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
为拓宽人民群众的表达途径、畅听民意，及时了解和解决人民群众反映强烈的公共法律服务问题，我局将在浈江区公共法律服务中心开展领导干部接待活动，<br>现将2022年8月的活动安排公告如下：<br> 一、接待时间 <br>工作日上午9:00-12:00。 <br>二、接待地点 <br>浈江区公共法律服务中心（浈江区新韶镇乐土路3号曲仁田螺冲党群服务中心一楼）。<br>三、接待受理范围 <br>（一）听取人民群众对公共法律服务工作的批评和意见建议。 <br>（二）解答或接收公共法律服务相关业务咨询。
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="details">
|
||||||
|
<div class="teachbox">
|
||||||
|
<div class="teachmani">
|
||||||
|
<div class="lefttitle">
|
||||||
|
<div class="img"></div>
|
||||||
|
<div class="rightmain">
|
||||||
|
<div class="talk">活动详情</div>
|
||||||
|
<div class="box"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
写字楼介绍<br>大族广场写字楼采用国际顶级硬件设施，美国OTIS电梯、麦克维尔中央空调、高端安防系统等商务空间新标准匹配项目在亦庄地标综合体的形象。写字楼空间设计由亚洲著名的室内空间设计大师之一梁景华设计，写字楼群由六栋(T1—T6)呈舰队排列的5A写字楼构成形成独特的舰队造型。<br>购物中心介绍<br>大族广场Mall&More位于北京经济技术开发区核心商圈荣华路，由荷兰鹿特丹缤纷市场设计师HANS VAN DA LEN 主持设计,秉持自然与未来和谐共生理念,倡导乐活有机、绿色环保的生活方式,传递生活美学。<br>大族广场Mall&More汇集众多知名优质品牌,7FRESH生 鲜超市、CGV星聚汇影城、中信书店、源力悦体等,集 购物、餐饮、娱乐、文化于一体,丰富的业态品类为消费 者提供城市生活的第三空间感受。<br>大族广场Mall&More以人为本,不断提升服务水平,升级 消费购物体验,致力于营造更加舒适的购物环境与空间打造有温度的品牌。同时根据春夏秋冬四季策划丰富多样的大型主题活动；为会员设置专属的沙龙活动，打造专属会员日等,与顾客近距离产生情感上的互动与链接为城市人们提供自由、放松、愉悦的社交空间与精神的栖息地。
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// import { reactive, toRefs } from "vue";
|
||||||
|
import TitleHead from "@/components/TitleHead.vue";
|
||||||
|
export default {
|
||||||
|
name: "BallotPage",
|
||||||
|
components: {
|
||||||
|
TitleHead,
|
||||||
|
},
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.activities {
|
||||||
|
width: 100%;
|
||||||
|
.main {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: -14.5px;
|
||||||
|
.title {
|
||||||
|
width: 90%;
|
||||||
|
height: 74px;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.titlemain {
|
||||||
|
width: 90%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
.timeposition {
|
||||||
|
.time {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.titlebtn {
|
||||||
|
width: 83px;
|
||||||
|
height: 33px;
|
||||||
|
background: #2478ff;
|
||||||
|
box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
|
||||||
|
border-radius: 2px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 12px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.message {
|
||||||
|
display: flex;
|
||||||
|
position: absolute;
|
||||||
|
top: 194px;
|
||||||
|
left: 80.5px;
|
||||||
|
width: 234px;
|
||||||
|
height: 64px;
|
||||||
|
z-index: 1;
|
||||||
|
background-image: url(../../assets/image/activities/bg.png);
|
||||||
|
.textmessage {
|
||||||
|
margin-top: 18px;
|
||||||
|
margin-left: 46px;
|
||||||
|
color: #333330;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.yes {
|
||||||
|
width: 13px;
|
||||||
|
height: 13px;
|
||||||
|
margin-top: 19px;
|
||||||
|
margin-left: 32px;
|
||||||
|
background-image: url(../../assets/image/activities/yes.png);
|
||||||
|
}
|
||||||
|
.no {
|
||||||
|
width: 13px;
|
||||||
|
height: 13px;
|
||||||
|
margin-top: 19px;
|
||||||
|
margin-left: 50px;
|
||||||
|
background-image: url(../../assets/image/activities/no.png);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.notice {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
.noticebox {
|
||||||
|
width: 90%;
|
||||||
|
background: linear-gradient(
|
||||||
|
180deg,
|
||||||
|
rgba(36, 120, 255, 0.15) 0%,
|
||||||
|
white 20%
|
||||||
|
);
|
||||||
|
border-radius: 4px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.mani {
|
||||||
|
margin-left: 20.5px;
|
||||||
|
margin-top: 20px;
|
||||||
|
line-height: 24px;
|
||||||
|
|
||||||
|
.lefttitle {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
width: 90px;
|
||||||
|
.img {
|
||||||
|
width: 18px;
|
||||||
|
height: 15px;
|
||||||
|
margin-top: 4px;
|
||||||
|
background-image: url(../../assets/image/activities/trumpet.png);
|
||||||
|
}
|
||||||
|
.rightmain {
|
||||||
|
margin-left: 7.5px;
|
||||||
|
.talk {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
|
.box {
|
||||||
|
position: absolute;
|
||||||
|
width: 62.5px;
|
||||||
|
height: 10px;
|
||||||
|
right: 6px;
|
||||||
|
bottom: -4px;
|
||||||
|
background: #cccfff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
color: #333330;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 24px;
|
||||||
|
font-weight: 400;
|
||||||
|
margin: 18.5px 12px 24.5px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.details {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
.teachbox {
|
||||||
|
width: 90%;
|
||||||
|
// height: 200px;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 4px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.teachmani {
|
||||||
|
width: 90%;
|
||||||
|
margin-top: 20px;
|
||||||
|
.lefttitle {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
width: 90px;
|
||||||
|
.img {
|
||||||
|
width: 18px;
|
||||||
|
height: 15px;
|
||||||
|
margin-top: 4px;
|
||||||
|
background-image: url(../../assets/image/activities/trumpet.png);
|
||||||
|
}
|
||||||
|
.rightmain {
|
||||||
|
margin-left: 7.5px;
|
||||||
|
.talk {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
|
.box {
|
||||||
|
position: absolute;
|
||||||
|
width: 62.5px;
|
||||||
|
height: 10px;
|
||||||
|
right: 6px;
|
||||||
|
bottom: -4px;
|
||||||
|
background: #cccfff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
color: #333330;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 24px;
|
||||||
|
font-weight: 400;
|
||||||
|
margin: 18.5px 0 29.5px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
436
src/views/pathmap/pathmap.vue
Normal file
436
src/views/pathmap/pathmap.vue
Normal file
@@ -0,0 +1,436 @@
|
|||||||
|
<template>
|
||||||
|
<div class="pathmap">
|
||||||
|
<TitleHead text="中级产品经理"></TitleHead>
|
||||||
|
<div class="main">
|
||||||
|
<div class="title">
|
||||||
|
<div class="box">
|
||||||
|
<div class="nav">
|
||||||
|
<span class="announcement">课程公告</span>
|
||||||
|
<span class="share">共享文档</span>
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
请各位选课的同学提前阅读本课程的“教学大纲与计划”“课程考核要求”与“学习要求”，并按给定的中学化学教学主题分好小组 <br>每位同学在网上学习的活动轨迹都会自动被系统记录，将作为大家个人线上参与的评价依据；<br>请大家务必在规定的时间内提交作业，否则会被系统自动记录为“迟交”或“未交”，则会影响线上参与的平时成绩；
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="messaeg">
|
||||||
|
<div class="mani">
|
||||||
|
<div class="uptitle">
|
||||||
|
<div class="img"></div>
|
||||||
|
<div class="rightmain">
|
||||||
|
<div class="talk">个人信息</div>
|
||||||
|
<div class="box"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="information">
|
||||||
|
<div class="photo"></div>
|
||||||
|
<div class="description">
|
||||||
|
<span class="text1">乐晓琪（显示事业）</span>
|
||||||
|
<span class="text2">真正的陪伴经得起坎坷，经得起平淡。</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="downtitle">
|
||||||
|
<div class="img"></div>
|
||||||
|
<div class="rightmain">
|
||||||
|
<div class="talk">学习进度</div>
|
||||||
|
<div class="box"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="speed">
|
||||||
|
<span class="text3">上次学到：启航班 - 领导寄语</span>
|
||||||
|
<button class="btn">去上课</button>
|
||||||
|
</div>
|
||||||
|
<div class="progress">
|
||||||
|
<div class="total">
|
||||||
|
<div class="total_part">
|
||||||
|
<span class="text4">总进度</span> <span class="text5">32%</span>
|
||||||
|
</div>
|
||||||
|
<div class="progress">
|
||||||
|
<div class="progress_part"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="compulsory">
|
||||||
|
<div class="compulsory_part">
|
||||||
|
<span class="text6">必修进度</span> <span class="text7">10%</span>
|
||||||
|
</div>
|
||||||
|
<div class="progress1">
|
||||||
|
<div class="progress1_part"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="course">
|
||||||
|
<div class="course_box">
|
||||||
|
<div class="course_first">
|
||||||
|
<span class="text8">序：产品经理从初级到中级</span>
|
||||||
|
<span class="text9"><span class="circular"></span>进行中</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// import { reactive, toRefs } from "vue";
|
||||||
|
import TitleHead from "@/components/TitleHead.vue";
|
||||||
|
export default {
|
||||||
|
name: "BallotPage",
|
||||||
|
components: {
|
||||||
|
TitleHead,
|
||||||
|
},
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.pathmap {
|
||||||
|
width: 100%;
|
||||||
|
.main {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: -14.5px;
|
||||||
|
.course {
|
||||||
|
width: 90%;
|
||||||
|
height: 903px;
|
||||||
|
margin-top: 10px;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.course_box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
width: 90%;
|
||||||
|
margin-top: 18.5px;
|
||||||
|
background-color: pink;
|
||||||
|
.course_first {
|
||||||
|
width: 100%;
|
||||||
|
height: 35px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: content;
|
||||||
|
background-color: #F9F9F9;
|
||||||
|
.text8 {
|
||||||
|
display: flex;
|
||||||
|
flex: 1;
|
||||||
|
margin-top: 11px;
|
||||||
|
margin-left: 10.5px;
|
||||||
|
margin-bottom: 10.5px;
|
||||||
|
height: 13.5px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333330;
|
||||||
|
}
|
||||||
|
.text9 {
|
||||||
|
margin-top: 11px;
|
||||||
|
margin-left: 77.5px;
|
||||||
|
color: #0060FF;
|
||||||
|
font-size:13px;
|
||||||
|
font-weight: 400;
|
||||||
|
.circular {
|
||||||
|
|
||||||
|
border: 1px solid #0060FF;
|
||||||
|
border-radius: 25%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
width: 90%;
|
||||||
|
height: 272px;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.box {
|
||||||
|
width: 90%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
flex-wrap:wrap;
|
||||||
|
overflow-y: auto;
|
||||||
|
.nav {
|
||||||
|
width: 100%;
|
||||||
|
height: 49.5px;
|
||||||
|
display: flex;
|
||||||
|
.announcement {
|
||||||
|
color: #2478FF;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 21.6px;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-top: 18.5px;
|
||||||
|
border-bottom: 1px solid #2478FF;
|
||||||
|
}
|
||||||
|
.share {
|
||||||
|
color: #394145;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 21.6px;
|
||||||
|
margin-top: 19px;
|
||||||
|
margin-left: 70px;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
width: 100%;
|
||||||
|
height: 180.5px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
color: #333330;
|
||||||
|
font-size:13px;
|
||||||
|
line-height: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.messaeg {
|
||||||
|
width: 90%;
|
||||||
|
height: 314px;
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
.mani {
|
||||||
|
width: 90%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: content;
|
||||||
|
margin-left: 20.5px;
|
||||||
|
margin-top: 23px;
|
||||||
|
.downtitle {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
width: 90px;
|
||||||
|
margin-top: 21.5px;
|
||||||
|
.img {
|
||||||
|
width: 15.5px;
|
||||||
|
height: 14.5px;
|
||||||
|
margin-top: 3px;
|
||||||
|
background-image: url(../../assets/image/pathmap/study.png);
|
||||||
|
}
|
||||||
|
.rightmain {
|
||||||
|
margin-left: 7.5px;
|
||||||
|
.talk {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
|
.box {
|
||||||
|
position: absolute;
|
||||||
|
width: 62.5px;
|
||||||
|
height: 10px;
|
||||||
|
right: 6px;
|
||||||
|
bottom: -4px;
|
||||||
|
background: #ccdfff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.uptitle {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
width: 90px;
|
||||||
|
.img {
|
||||||
|
width: 17px;
|
||||||
|
height: 15px;
|
||||||
|
margin-top: 3px;
|
||||||
|
background-image: url(../../assets/image/pathmap/personal.png);
|
||||||
|
}
|
||||||
|
.rightmain {
|
||||||
|
margin-left: 7.5px;
|
||||||
|
.talk {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
|
.box {
|
||||||
|
position: absolute;
|
||||||
|
width: 62.5px;
|
||||||
|
height: 10px;
|
||||||
|
right: 6px;
|
||||||
|
bottom: -4px;
|
||||||
|
background: #ccdfff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.information {
|
||||||
|
width: 100%;
|
||||||
|
height: 50px;
|
||||||
|
margin-top: 24px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: content;
|
||||||
|
.photo {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
background-image: url(../../assets/image/pathmap/photo.png)
|
||||||
|
}
|
||||||
|
.description {
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-left: 11.5px;
|
||||||
|
.text1 {
|
||||||
|
height: 13.5px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #394145;
|
||||||
|
line-height: 21.6px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.text2 {
|
||||||
|
height: 13px;
|
||||||
|
margin-top: 12px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #394145;
|
||||||
|
line-height: 21.6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
.speed {
|
||||||
|
width: 100%;
|
||||||
|
margin-top:11px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: content;
|
||||||
|
.text3 {
|
||||||
|
display: flex;
|
||||||
|
flex:1;
|
||||||
|
margin-top: 4.5px;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 24px;
|
||||||
|
color: #677D86;
|
||||||
|
text-overflow: elipsis;
|
||||||
|
}
|
||||||
|
.btn {
|
||||||
|
width: 73px;
|
||||||
|
height: 28px;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 28px;
|
||||||
|
margin-rihgt: 21px;
|
||||||
|
color: #2478FF;
|
||||||
|
font-weight: 400;
|
||||||
|
border: 0.5px solid #2478FF;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.progress {
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-top: 15px;
|
||||||
|
width: 100%;
|
||||||
|
height: 74px;
|
||||||
|
.total {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 29px;
|
||||||
|
.total_part {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
width: 100%;
|
||||||
|
height: 12.5px;
|
||||||
|
.text4 {
|
||||||
|
width: 38.5px;
|
||||||
|
height: 12.5px;
|
||||||
|
font-size: 12px;
|
||||||
|
// line-height: 30.29px;
|
||||||
|
color: #677D86;
|
||||||
|
}
|
||||||
|
.text5 {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
width: 25px;
|
||||||
|
height: 9.5px;
|
||||||
|
font-size: 12px;
|
||||||
|
// line-height: 30.29px;
|
||||||
|
color: #277AFF;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 6.4px;
|
||||||
|
margin-top: 20px;
|
||||||
|
background-color: #E8F1FE;
|
||||||
|
border-radius: 2px;
|
||||||
|
.progress_part {
|
||||||
|
width: 32%;
|
||||||
|
height: 6.4px;
|
||||||
|
border-radius: 2px;
|
||||||
|
background: linear-gradient(
|
||||||
|
-180deg,
|
||||||
|
rgba(36, 120, 255, 1),
|
||||||
|
rgba(80, 147, 255, 1)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.compulsory{
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 29px;
|
||||||
|
margin-top: 16px;
|
||||||
|
.compulsory_part {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
width: 100%;
|
||||||
|
height: 12.5px;
|
||||||
|
.text6 {
|
||||||
|
width: 38.5px;
|
||||||
|
height: 12.5px;
|
||||||
|
font-size: 12px;
|
||||||
|
// line-height: 30.29px;
|
||||||
|
color: #677D86;
|
||||||
|
}
|
||||||
|
.text7 {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
width: 25px;
|
||||||
|
height: 9.5px;
|
||||||
|
font-size: 12px;
|
||||||
|
// line-height: 30.29px;
|
||||||
|
color: #EE6661;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.progress1 {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 6.4px;
|
||||||
|
margin-top: 20px;
|
||||||
|
background-color: #E8F1FE;
|
||||||
|
border-radius: 2px;
|
||||||
|
.progress1_part {
|
||||||
|
width: 10%;
|
||||||
|
height: 6.4px;
|
||||||
|
border-radius: 2px;
|
||||||
|
background: linear-gradient(
|
||||||
|
-180deg,
|
||||||
|
rgba(238, 98, 94, 1),
|
||||||
|
rgba(238, 164, 161, 1)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user