mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/student-h5.git
synced 2025-12-09 02:46:47 +08:00
style：修改调研、直播、投票、作业、讨论、讨论详情页面
This commit is contained in:
songwc
@@ -53,6 +53,7 @@ export default defineComponent({
|
||||
|
||||
#container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
background-color: rgba(242, 245, 247, 1);
|
||||
|
||||
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/filestorag/excel.png
Normal file
BIN
src/assets/image/filestorag/excel.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 758 B |
BIN
src/assets/image/filestorag/md.png
Normal file
BIN
src/assets/image/filestorag/md.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 729 B |
BIN
src/assets/image/filestorag/pdf.png
Normal file
BIN
src/assets/image/filestorag/pdf.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 642 B |
BIN
src/assets/image/filestorag/ppt.png
Normal file
BIN
src/assets/image/filestorag/ppt.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 671 B |
BIN
src/assets/image/filestorag/rar.png
Normal file
BIN
src/assets/image/filestorag/rar.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 615 B |
BIN
src/assets/image/filestorag/word.png
Normal file
BIN
src/assets/image/filestorag/word.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 650 B |
BIN
src/assets/image/filestorag/zip.png
Normal file
BIN
src/assets/image/filestorag/zip.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 551 B |
13
src/assets/image/index.js
Normal file
13
src/assets/image/index.js
Normal file
@@ -0,0 +1,13 @@
|
||||
const Images = {
|
||||
//选择按钮
|
||||
checkboxImg: require('./checkbox.png'),
|
||||
checkbox2Img: require('./checkbox2.png'),
|
||||
zipImg: require('./filestorag/zip.png'),
|
||||
excelImg: require('./filestorag/excel.png'),
|
||||
mdImg: require('./filestorag/md.png'),
|
||||
pdfImg: require('./filestorag/pdf.png'),
|
||||
pptImg: require('./filestorag/ppt.png'),
|
||||
rarImg: require('./filestorag/rar.png'),
|
||||
wordImg: require('./filestorag/word.png'),
|
||||
}
|
||||
export default Images
|
||||
BIN
src/assets/image/pathmap/nostart.png
Normal file
BIN
src/assets/image/pathmap/nostart.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
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 |
BIN
src/assets/image/readyexamination/smile.png
Normal file
BIN
src/assets/image/readyexamination/smile.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 722 B |
BIN
src/assets/image/readyexamination/time.png
Normal file
BIN
src/assets/image/readyexamination/time.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 968 B |
283
src/views/activities/ActivitiesPage.vue
Normal file
283
src/views/activities/ActivitiesPage.vue
Normal file
@@ -0,0 +1,283 @@
|
||||
<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>
|
||||
<el-button class="titlebtn" @click="open">签到</el-button>
|
||||
</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: "ActivitiesPage",
|
||||
components: {
|
||||
TitleHead,
|
||||
},
|
||||
setup() {
|
||||
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
showBox: false,
|
||||
};
|
||||
},
|
||||
};
|
||||
</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%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(36, 120, 255, 0.15) 0%,
|
||||
white 20%
|
||||
);
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
|
||||
.mani {
|
||||
width: 90%;
|
||||
dispaly: flex;
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.details {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 10px;
|
||||
.teachbox {
|
||||
width: 90%;
|
||||
// height: 200px;
|
||||
margin-bottom: 29.5px;
|
||||
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>
|
||||
@@ -3,38 +3,31 @@
|
||||
<!-- <TitleHead text="【投票】管理者进阶腾飞班 - 授课方式"></TitleHead> -->
|
||||
|
||||
<div class="notice">
|
||||
|
||||
<div class="noticebox">
|
||||
|
||||
<div class="mani">
|
||||
<div class="joininfo" style="margin-left:-8px">
|
||||
【投票】管理者进阶腾飞班 - 授课方式
|
||||
<div class="joininfo" style="margin-left: -8px">
|
||||
【投票】管理者进阶腾飞班 - 授课方式
|
||||
</div>
|
||||
<div class="contenttitle">
|
||||
<img class="timeimg" src="../../assets/image/ballotpage/time.png" >
|
||||
<img class="timeimg" src="../../assets/image/ballotpage/time.png" />
|
||||
<div class="timee">2022-07-20 20:00-21:00</div>
|
||||
</div>
|
||||
<div class="timebox">
|
||||
<div class="samez" style="margin-left:18px">00</div>
|
||||
<div class="samez" style="margin-left: 18px">00</div>
|
||||
<div class="samey">时</div>
|
||||
<div class="samez">00</div>
|
||||
<div class="samey">分</div>
|
||||
<div class="samez">00</div>
|
||||
<div class="samey">秒</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="notice">
|
||||
|
||||
<div class="noticebox">
|
||||
|
||||
<div class="mani">
|
||||
<div class="joininfo">
|
||||
参与情况
|
||||
</div>
|
||||
<div class="joininfo">参与情况</div>
|
||||
<div class="line"></div>
|
||||
<div class="contentone">
|
||||
<div class="same ba">
|
||||
@@ -50,57 +43,53 @@
|
||||
<div class="samego">浏览数</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice">
|
||||
|
||||
<div class="noticebox">
|
||||
|
||||
<div class="mani">
|
||||
<div class="joininfo">
|
||||
投票说明
|
||||
</div>
|
||||
<div class="joininfo">投票说明</div>
|
||||
<div class="line"></div>
|
||||
<div class="contentone">
|
||||
<div class="ballotdetail">
|
||||
为提高核心项目讲解体验，现向广大学员征集较为接受的授课方式 ，每位学员可投票2个选项，我们将选取最高选项的两个做后续讲解。
|
||||
为提高核心项目讲解体验，现向广大学员征集较为接受的授课方式
|
||||
，每位学员可投票2个选项，我们将选取最高选项的两个做后续讲解。
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice">
|
||||
|
||||
<div class="noticebox">
|
||||
|
||||
<div class="mani">
|
||||
<div class="joininfo">
|
||||
参加投票
|
||||
</div>
|
||||
<div class="joininfo">参加投票</div>
|
||||
<div class="line"></div>
|
||||
<div class="contentone">
|
||||
<div class="ballotjoincontainer">
|
||||
<div class="ballotjoin">
|
||||
<div class="ballotitem" v-for="(item,index) in ballot" :key="item.id">
|
||||
<div
|
||||
class="ballotitem"
|
||||
v-for="(item, index) in ballot"
|
||||
:key="item.id"
|
||||
>
|
||||
<div class="upitem">
|
||||
<div class="left">
|
||||
<img class="leftimg" src="../../assets/image/ballotpage/left.png" >
|
||||
<div class="leftcontent">{{item.content}}</div>
|
||||
<img
|
||||
class="leftimg"
|
||||
src="../../assets/image/ballotpage/left.png"
|
||||
/>
|
||||
<div class="leftcontent">{{ item.content }}</div>
|
||||
</div>
|
||||
<button class="btn" @click="getId(item.id)">投票</button>
|
||||
</div>
|
||||
<div :class="index === ballot.length-1? null:'thinline'"></div>
|
||||
<div
|
||||
:class="index === ballot.length - 1 ? null : 'thinline'"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -117,32 +106,32 @@ export default {
|
||||
},
|
||||
setup() {
|
||||
const state = reactive({
|
||||
ballot:[
|
||||
ballot: [
|
||||
{
|
||||
id:1,
|
||||
content:'录播课'
|
||||
id: 1,
|
||||
content: "录播课",
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
content:'PPT+配音'
|
||||
id: 2,
|
||||
content: "PPT+配音",
|
||||
},
|
||||
{
|
||||
id:3,
|
||||
content:'HTML5'
|
||||
id: 3,
|
||||
content: "HTML5",
|
||||
},
|
||||
{
|
||||
id:4,
|
||||
content:'OTHER'
|
||||
id: 4,
|
||||
content: "OTHER",
|
||||
},
|
||||
]
|
||||
],
|
||||
});
|
||||
const getId = (id) => {
|
||||
console.log(id)
|
||||
console.log(id);
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
getId
|
||||
}
|
||||
getId,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -171,24 +160,24 @@ export default {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.line{
|
||||
width: 100%;
|
||||
height: 0;
|
||||
border-top: 1px solid #F1F2F3;
|
||||
margin-top: 17px;
|
||||
position:absolute;
|
||||
left:0;
|
||||
}
|
||||
.line {
|
||||
width: 100%;
|
||||
height: 0;
|
||||
border-top: 1px solid #f1f2f3;
|
||||
margin-top: 17px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
.mani {
|
||||
width: 90%;
|
||||
margin-top: 20px;
|
||||
// position:relative;
|
||||
.joininfo{
|
||||
color:#0D233A;
|
||||
.joininfo {
|
||||
color: #0d233a;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
.samenum {
|
||||
margin-top: 18.5px;
|
||||
position: absolute;
|
||||
@@ -204,42 +193,42 @@ export default {
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
.contenttitle{
|
||||
width:100%;
|
||||
.contenttitle {
|
||||
width: 100%;
|
||||
// height:10px;
|
||||
margin-top: 15px;
|
||||
// background-color: #bfa;
|
||||
display:flex;
|
||||
.timeimg{
|
||||
display: flex;
|
||||
.timeimg {
|
||||
width: 12.8px;
|
||||
height: 13px;
|
||||
}
|
||||
.timee{
|
||||
color:#6E7B84;
|
||||
.timee {
|
||||
color: #6e7b84;
|
||||
font-size: 14px;
|
||||
line-height: 13px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
}
|
||||
.timebox{
|
||||
display:flex;
|
||||
.timebox {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height:49px;
|
||||
background-color:#F2F5F7;
|
||||
height: 49px;
|
||||
background-color: #f2f5f7;
|
||||
margin-top: 17.5px;
|
||||
margin-bottom: 27.5px;
|
||||
border-radius: 10px;
|
||||
.samez{
|
||||
color:#0060FF;
|
||||
.samez {
|
||||
color: #0060ff;
|
||||
font-size: 18px;
|
||||
line-height: 49px;
|
||||
margin-left: 13px;
|
||||
}
|
||||
.samey{
|
||||
color:#6E7B84;
|
||||
.samey {
|
||||
color: #6e7b84;
|
||||
font-size: 14px;
|
||||
line-height: 49px;
|
||||
|
||||
|
||||
margin-left: 13px;
|
||||
}
|
||||
}
|
||||
@@ -265,62 +254,60 @@ export default {
|
||||
.bh {
|
||||
background-image: url(../../assets/image/ballotpage/baccthr.png);
|
||||
}
|
||||
.ballotdetail{
|
||||
color:#6E7B84;
|
||||
.ballotdetail {
|
||||
color: #6e7b84;
|
||||
line-height: 30px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.ballotjoincontainer{
|
||||
.ballotjoincontainer {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
.ballotjoin{
|
||||
width: 85%;
|
||||
// height:100px;
|
||||
// background-color: #bfa;
|
||||
.ballotitem{
|
||||
|
||||
.upitem{
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
display:flex;
|
||||
.leftimg{
|
||||
width: 4.5px;
|
||||
height:14.5px;
|
||||
margin-top: 1px;
|
||||
.ballotjoin {
|
||||
width: 85%;
|
||||
// height:100px;
|
||||
// background-color: #bfa;
|
||||
.ballotitem {
|
||||
.upitem {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
display: flex;
|
||||
.leftimg {
|
||||
width: 4.5px;
|
||||
height: 14.5px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
.leftcontent {
|
||||
margin-left: 9px;
|
||||
color: #6e7b84;
|
||||
font-size: 13px;
|
||||
line-height: 30px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
}
|
||||
.leftcontent{
|
||||
margin-left: 9px;
|
||||
color:#6E7B84;
|
||||
font-size: 13px;
|
||||
line-height: 30px;
|
||||
margin-top: -5px;
|
||||
.btn {
|
||||
background-color: #2478ff;
|
||||
color: #fff;
|
||||
width: 64px;
|
||||
height: 21px;
|
||||
border-radius: 10px;
|
||||
border: 0;
|
||||
font-size: 12px;
|
||||
line-height: 19px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
}
|
||||
.btn{
|
||||
background-color: #2478FF;
|
||||
color:#fff;
|
||||
width:64px;
|
||||
height:21px;
|
||||
border-radius: 10px;
|
||||
border:0;
|
||||
font-size: 12px;
|
||||
line-height:19px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
}
|
||||
.thinline{
|
||||
width: 100%;
|
||||
border-top: 1px solid #F1F2F3;
|
||||
margin-top: 17px;
|
||||
margin-bottom: 17px;
|
||||
.thinline {
|
||||
width: 100%;
|
||||
border-top: 1px solid #f1f2f3;
|
||||
margin-top: 17px;
|
||||
margin-bottom: 17px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -323,41 +323,6 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// .dian {
|
||||
// color: #b3bdc4;
|
||||
// line-height: 30px;
|
||||
// // line-height: 20px;
|
||||
// font-size: 13px;
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
// margin-top: 7px;
|
||||
// width: 100%;
|
||||
// height: 30px;
|
||||
// background-color: #fbfbfb;
|
||||
|
||||
// .samt {
|
||||
// margin-right: 9px;
|
||||
// margin-top: 8px;
|
||||
// // position: absolute;
|
||||
// }
|
||||
// .a {
|
||||
// // position: absolute;
|
||||
// // top: 2px;
|
||||
// margin-top: 1.5px;
|
||||
// }
|
||||
// .diancon {
|
||||
// width: 80%;
|
||||
// height: 100%;
|
||||
// // background-color: #bfa;
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
// position: relative;
|
||||
// .one {
|
||||
// display: flex;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,280 +1,194 @@
|
||||
<template>
|
||||
<div class="examination">
|
||||
<TitleHead text="【考试】管理者进阶腾飞班 - 毕业典礼"></TitleHead>
|
||||
<div class="notice">
|
||||
<div class="noticebox">
|
||||
<div class="main">
|
||||
<div class="dir">
|
||||
<div class="samegt pre"></div>
|
||||
<div class="sameg">上一个</div>
|
||||
<div class="sameg" style="margin-left: 15.5px">下一个</div>
|
||||
<div class="samegt next"></div>
|
||||
</div>
|
||||
<div class="lefttitle">
|
||||
<div class="img"></div>
|
||||
<div class="rightmain">
|
||||
<div class="talk">考试测试</div>
|
||||
<div class="box"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contentone clearfix">
|
||||
<div class="areaone">
|
||||
<div class="texttime">
|
||||
考试时间：30分钟
|
||||
</div>
|
||||
<div class="passline">
|
||||
及格线：60
|
||||
</div>
|
||||
</div>
|
||||
<div class="areatwo">
|
||||
<div class="time">
|
||||
<span>考试时间：</span>
|
||||
<br/>
|
||||
<span>2022-7-20 00:00 至 2022-8-29 23:59:59</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btnbox">
|
||||
<button class="textbtn">
|
||||
开始考试
|
||||
</button>
|
||||
</div>
|
||||
<div class="lefttitle">
|
||||
<div class="img"></div>
|
||||
<div class="rightmain">
|
||||
<div class="talk">历史记录</div>
|
||||
<div class="box"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contenttwo clearfix">
|
||||
<table>
|
||||
<tr class="trbox1">
|
||||
<th>提交时间</th>
|
||||
<th>成绩</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr >
|
||||
<tr class="trbox2">
|
||||
<td>
|
||||
2022-7-20
|
||||
<br/>
|
||||
00:00
|
||||
</td>
|
||||
<td>10分</td>
|
||||
<td>已完成</td>
|
||||
<td><span>查看考卷</span> </td>
|
||||
</tr>
|
||||
<tr class="trbox3">
|
||||
<td>
|
||||
2022-7-20
|
||||
<br/>
|
||||
00:00
|
||||
</td>
|
||||
<td>10分</td>
|
||||
<td>已完成</td>
|
||||
<td><span>查看考卷</span></td>
|
||||
</tr>
|
||||
<tr class="trbox4">
|
||||
<td>
|
||||
2022-7-20
|
||||
<br/>
|
||||
00:00
|
||||
</td>
|
||||
<td>10分</td>
|
||||
<td>已完成</td>
|
||||
<td><span>查看考卷</span></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="examination">
|
||||
<!-- <TitleHead text="【考试】管理者进阶腾飞班 - 毕业典礼"></TitleHead> -->
|
||||
<div class="notice">
|
||||
<div class="noticebox">
|
||||
|
||||
<div class="main">
|
||||
<div class="e_title">管理者进阶腾飞班 - 第一次考试</div>
|
||||
<div class="et_detail">
|
||||
<div class="et_icon"></div>
|
||||
<div class="et_time">2022-7-20 00:00 至 2022-8-29 23:59:59</div>
|
||||
</div>
|
||||
<div class="et_box">
|
||||
<div class="et_length">
|
||||
<div class="et_name">考试时长：</div>
|
||||
<div class="et_minute">30分钟</div>
|
||||
<div class="et_lineicon"></div>
|
||||
<div class="et_name">及格分数：</div>
|
||||
<div class="et_score">60</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="noticebox">
|
||||
<div class="main">
|
||||
<div class="btnbox">
|
||||
<button class="textbtn">开始考试</button>
|
||||
</div>
|
||||
<div class="e_form">
|
||||
<table>
|
||||
<tr class="trbox1">
|
||||
<th>提交时间</th>
|
||||
<th>成绩</th>
|
||||
<th>状态</th>
|
||||
</tr>
|
||||
<tr class="trbox2">
|
||||
<td>
|
||||
2022-7-20 00:00
|
||||
</td>
|
||||
<td>10分</td>
|
||||
<td>已完成</td>
|
||||
</tr>
|
||||
<tr class="trbox3">
|
||||
<td>
|
||||
2022-7-20 00:00
|
||||
</td>
|
||||
<td>10分</td>
|
||||
<td>已完成</td>
|
||||
</tr>
|
||||
<tr class="trbox4">
|
||||
<td>
|
||||
2022-7-20 00:00
|
||||
</td>
|
||||
<td>10分</td>
|
||||
<td>已完成</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { reactive, toRefs } from "vue";
|
||||
import TitleHead from "@/components/TitleHead.vue";
|
||||
// import TitleHead from "@/components/TitleHead.vue";
|
||||
export default {
|
||||
name: "ExamiNation",
|
||||
components: {
|
||||
TitleHead,
|
||||
},
|
||||
setup() {
|
||||
},
|
||||
// components: {
|
||||
// TitleHead,
|
||||
// },
|
||||
setup() {},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
.examination {
|
||||
width: 100%;
|
||||
background-color: #F2F5F7;
|
||||
}
|
||||
|
||||
.examination{
|
||||
width: 100%;
|
||||
.notice {
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.noticebox {
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
margin-bottom: 11.5px;
|
||||
.main {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
padding-top: 18.5px;
|
||||
padding-bottom: 27.5px;
|
||||
}
|
||||
}
|
||||
.e_title{
|
||||
margin-bottom: 14.5px ;
|
||||
font-weight: 600;
|
||||
}
|
||||
.et_detail{
|
||||
display: flex;
|
||||
margin-bottom: 11.5px;
|
||||
align-items: center;
|
||||
.et_icon{
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
background-image: url('../../assets/image/readyexamination/time.png');
|
||||
background-size: 100% 100%;
|
||||
margin-right: 6px;
|
||||
}
|
||||
.et_time{
|
||||
color: #6E7B84;
|
||||
}
|
||||
}
|
||||
.et_box{
|
||||
margin-top: 16.5px;
|
||||
background-color: #F2F5F7;
|
||||
border-radius: 10px;
|
||||
padding: 18px 0 17px 22px;
|
||||
.et_length{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.et_name{
|
||||
margin-right: 5px;
|
||||
color: #6E7B84;
|
||||
}
|
||||
.et_minute{
|
||||
color: #2478FF;
|
||||
margin-right: 56px;
|
||||
}
|
||||
.et_lineicon{
|
||||
width: 17.5px;
|
||||
height: 17.5px;
|
||||
background-image: url(../../assets/image/readyexamination/smile.png);
|
||||
margin-right: 8px;
|
||||
}
|
||||
.et_score{
|
||||
color: #FF9E00;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.notice {
|
||||
|
||||
|
||||
.btnbox {
|
||||
width: 301.5px;
|
||||
height: 33px;
|
||||
background-color: #2478ff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
|
||||
font-size: 13.5px;
|
||||
margin: 18.5px auto 43.5px 20px;
|
||||
text-align: center;
|
||||
line-height: 33px;
|
||||
.textbtn {
|
||||
width: 301.5px;
|
||||
border: none;
|
||||
background-color: #2478ff;
|
||||
border-radius: 6px;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.e_form {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: -17.5px;
|
||||
.noticebox {
|
||||
width: 90%;
|
||||
background: #fff;
|
||||
flex-direction: column;
|
||||
font-size: 12px;
|
||||
color: #333330;
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
text-align: center;
|
||||
margin-bottom: 6.5px ;
|
||||
.trbox1 {
|
||||
width: 342.5px;
|
||||
height: 40px;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.main {
|
||||
width: 90%;
|
||||
margin-top: 20px;
|
||||
.dir {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
// background-color: red;
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
font-size: 12px;
|
||||
color: #2478ff;
|
||||
.samegt {
|
||||
margin-top: 3px;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
}
|
||||
.samege {
|
||||
line-height: 12px;
|
||||
}
|
||||
.pre {
|
||||
margin-right: 5px;
|
||||
// background-size: 100%;
|
||||
background-image: url(../../assets/image/pre.png);
|
||||
}
|
||||
.next {
|
||||
margin-left: 5px;
|
||||
// background-size: 100%;
|
||||
background-image: url(../../assets/image/next.png);
|
||||
}
|
||||
}
|
||||
.lefttitle {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 90px;
|
||||
.img {
|
||||
margin-top: 1.5px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-image: url(../../assets/image/cycle.png);
|
||||
}
|
||||
.rightmain {
|
||||
margin-left: 7.5px;
|
||||
.talk {
|
||||
margin-left: -1.5px;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
}
|
||||
.box {
|
||||
position: absolute;
|
||||
width: 62.5px;
|
||||
height: 10px;
|
||||
right: 8px;
|
||||
bottom: -5px;
|
||||
background: #ccdfff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.contentone{
|
||||
width: 100%;
|
||||
background: #F2F5F7;
|
||||
border-radius: 2px;
|
||||
margin-top: 20.5px;
|
||||
font-size: 13px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.areaone{
|
||||
width: 100%;
|
||||
margin: 15px 0;
|
||||
display: flex;
|
||||
color: #56A3F9;
|
||||
.texttime{
|
||||
margin-left: 22.5px ;
|
||||
}
|
||||
.passline{
|
||||
margin-left: 42px;
|
||||
}
|
||||
}
|
||||
.areatwo{
|
||||
// width: 290.5px;
|
||||
// height: 50.5px;
|
||||
margin: 0 5.5px 6.5px 5.5px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 0px 4px 0px 4px;
|
||||
font-size: 13px;
|
||||
|
||||
.time{
|
||||
margin: 9px 16px 9.5px 17px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btnbox{
|
||||
width: 83px;
|
||||
height: 33px;
|
||||
background-color: #2478FF;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0px 1px 8px 0px rgba(56,125,247,0.7);
|
||||
font-size: 13.5px;
|
||||
margin: 20px 109.5px 21.5px 109.5px;
|
||||
text-align: center;
|
||||
line-height: 33px;
|
||||
.textbtn{
|
||||
border: none;
|
||||
background-color: #2478FF;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
.contenttwo{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 12px;
|
||||
table{
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
// border-collapse:separate;
|
||||
// border-spacing:0px 15.5px;
|
||||
text-align: center;
|
||||
margin: 21px auto 48px auto;
|
||||
.trbox1{
|
||||
width: 302px;
|
||||
height: 40px;
|
||||
border-radius: 4px;
|
||||
background-color: #F2F5F7;
|
||||
th{
|
||||
font-size: 12px;
|
||||
color: #333330;
|
||||
}
|
||||
}
|
||||
td{
|
||||
padding: 14.5px;
|
||||
}
|
||||
.trbox2,
|
||||
.trbox3,
|
||||
.trbox4{
|
||||
border-bottom: 0.5px solid #D7E5FD ;
|
||||
}
|
||||
span{
|
||||
color: #2478FF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
background-color: #f2f5f7;
|
||||
}
|
||||
td {
|
||||
padding: 14.5px;
|
||||
}
|
||||
.trbox2,
|
||||
.trbox3,
|
||||
.trbox4 {
|
||||
border-bottom: 0.5px solid #F1F2F3;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,116 +1,116 @@
|
||||
<template>
|
||||
<div class="examinationscore">
|
||||
<TitleHead text="【考试】管理者进阶腾飞班 - 毕业典礼"></TitleHead>
|
||||
<div class="notice">
|
||||
<div class="noticebox">
|
||||
<div class="main">
|
||||
<div class="mainbody">
|
||||
<div class="scoretitle">
|
||||
阶段性考试
|
||||
</div>
|
||||
<div class="scorebox">
|
||||
<div class="scoredetail">
|
||||
您本次考试分数：
|
||||
<div class="score">84</div>
|
||||
<div class="grade">分</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btnbox">
|
||||
<div class="closebtn">关闭</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="examinationscore">
|
||||
<!-- <TitleHead text="【考试】管理者进阶腾飞班 - 毕业典礼"></TitleHead> -->
|
||||
<div class="notice">
|
||||
<div class="noticebox">
|
||||
<div class="main">
|
||||
<div class="mainbody">
|
||||
<div class="scoretitle">阶段性考试</div>
|
||||
<div class="scorebox">
|
||||
<div class="scoredetail">
|
||||
您本次考试分数：
|
||||
<div class="score">84</div>
|
||||
<div class="grade">分</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="btnbox">
|
||||
<div class="closebtn">关闭</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { reactive, toRefs } from "vue";
|
||||
import TitleHead from "@/components/TitleHead.vue";
|
||||
// import TitleHead from "@/components/TitleHead.vue";
|
||||
export default {
|
||||
name: "ExaminationScore",
|
||||
components: {
|
||||
TitleHead,
|
||||
},
|
||||
setup() {
|
||||
},
|
||||
// components: {
|
||||
// TitleHead,
|
||||
// },
|
||||
setup() {},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.examinationscore{
|
||||
width: 100%;
|
||||
}
|
||||
.examinationscore {
|
||||
width: 100%;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.notice {
|
||||
.notice {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
.noticebox {
|
||||
width: 100%;
|
||||
background: #ffffff;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.main {
|
||||
width: 90%;
|
||||
border-radius: 2px;
|
||||
.mainbody {
|
||||
width: 100%;
|
||||
margin: 240px auto;
|
||||
background-color: #f2f5f7;
|
||||
border-radius: 10px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: -17.5px;
|
||||
.noticebox {
|
||||
width: 90%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.main {
|
||||
width: 90%;
|
||||
border-radius: 2px;
|
||||
// background-color: #FFFFFF;
|
||||
.mainbody{
|
||||
width: 100%;
|
||||
margin-top: 133.5px;
|
||||
background-color: #F2F5F7;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.scoretitle{
|
||||
margin: 18px auto 15px auto;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: #56A3F9;
|
||||
}
|
||||
.scorebox{
|
||||
width: 290.5px;
|
||||
height: 55.5px;
|
||||
background-color: #FFFFFF;
|
||||
margin-bottom: 6.5px;
|
||||
.scoredetail{
|
||||
display: flex;
|
||||
font-size: 13px;
|
||||
margin: 21.5px auto 29.5px 72.5px;
|
||||
.score{
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
color: #EE423D;
|
||||
margin-top: -8px;
|
||||
}
|
||||
.grade{
|
||||
font-size: 13px;
|
||||
color: #EE423D;
|
||||
margin-bottom: 21.5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.btnbox{
|
||||
width: 83px;
|
||||
height: 33px;
|
||||
background-color: #2478FF;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0px 1px 8px 0px rgba(56,125,247,0.7);
|
||||
font-size: 14px;
|
||||
margin: 18px auto 218.5px auto;
|
||||
text-align: center;
|
||||
line-height: 33px;
|
||||
.closebtn{
|
||||
border: none;
|
||||
background-color: #2478FF;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.scoretitle {
|
||||
margin: 17.5px auto 15.5px auto;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: #04243C;
|
||||
}
|
||||
.scorebox {
|
||||
width: 320.5px;
|
||||
height: 55.5px;
|
||||
border-radius: 2px 6px 2px 6px;
|
||||
background-color: #ffffff;
|
||||
margin-bottom:11.5px;
|
||||
.scoredetail {
|
||||
display: flex;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
margin: 21.5px auto auto 92.5px;
|
||||
.score {
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
color: #FF9E00;
|
||||
margin-top: -7px;
|
||||
}
|
||||
.grade {
|
||||
font-size: 13px;
|
||||
color: #FF9E00;
|
||||
margin-bottom: 21.5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// .btnbox {
|
||||
// width: 83px;
|
||||
// height: 33px;
|
||||
// background-color: #2478ff;
|
||||
// border-radius: 2px;
|
||||
// box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
|
||||
// font-size: 14px;
|
||||
// margin: 18px auto 218.5px auto;
|
||||
// text-align: center;
|
||||
// line-height: 33px;
|
||||
// .closebtn {
|
||||
// border: none;
|
||||
// background-color: #2478ff;
|
||||
// color: #ffffff;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
</style>
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,211 +1,396 @@
|
||||
<template>
|
||||
<div class="readyexamination">
|
||||
<TitleHead text="考试模式"></TitleHead>
|
||||
<div class="notice">
|
||||
<div class="noticebox">
|
||||
<div class="main">
|
||||
<div class="lefttitle">
|
||||
<div class="img"></div>
|
||||
<div class="rightmain">
|
||||
<div class="time">剩余时间</div>
|
||||
<div class="box">29分钟53秒</div>
|
||||
</div>
|
||||
<div class="readyexamination">
|
||||
<!-- <TitleHead text="考试模式"></TitleHead> -->
|
||||
<div class="notice">
|
||||
<div class="noticebox">
|
||||
<div class="main">
|
||||
<div class="re_title">管理者进阶腾飞班 - 第一次考试</div>
|
||||
<!-- <div class="lefttitle">
|
||||
<div class="img"></div>
|
||||
<div class="rightmain">
|
||||
<div class="time">剩余时间</div>
|
||||
<div class="box">29分钟53秒</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="questiontype clearfix">
|
||||
<div class="type">判断题</div>
|
||||
</div>
|
||||
|
||||
<!-- 循环遍历生成判断题的问题和选项 -->
|
||||
<div class="questions"
|
||||
v-for="(q,index) in questions"
|
||||
:key="index">
|
||||
<div class="questiontitle" >
|
||||
{{q.text}}
|
||||
</div>
|
||||
<div class="btnswitch" v-for="(o,index) in q.options"
|
||||
:key="index"
|
||||
@click="selectBtn(o)"
|
||||
>
|
||||
<div class="checkoutbtn"
|
||||
:style="{
|
||||
backgroundImage:
|
||||
'url('+( o.select === true? Images.checkboxImg : Images.checkbox2Img )+')'
|
||||
}"
|
||||
></div>
|
||||
<div class="select">{{o.text}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="questions">
|
||||
<div class="questiontitle">
|
||||
1、控制计划是由工艺部门完成 （4分）
|
||||
</div>
|
||||
<div class="questiontype clearfix">
|
||||
<div class="type">
|
||||
判断题
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">正确</div>
|
||||
</div>
|
||||
<div class="questions">
|
||||
<div class="questiontitle">
|
||||
1、控制计划是由工艺部门完成 （4分）
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">正确</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">错误</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="questions">
|
||||
<div class="questiontitle">
|
||||
2、.PFMEA假定所设计的产品能满足设计要求
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">正确</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">错误</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="questions">
|
||||
<div class="questiontitle">
|
||||
3、PFMEA假定所设计的产品能满足设计要求 （4分）
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">正确</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">错误</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="questiontype clearfix">
|
||||
<div class="type">
|
||||
选择题
|
||||
</div>
|
||||
</div>
|
||||
<div class="questions">
|
||||
<div class="questiontitle">
|
||||
4、.FMEA 是一种（ ）工具（4分）
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">问题解决</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">项目策划</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">过程分析</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">风险分析</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btnbox">
|
||||
<div class="submitbtn">
|
||||
提交试卷
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">错误</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="questions">
|
||||
<div class="questiontitle">
|
||||
2、.PFMEA假定所设计的产品能满足设计要求
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">正确</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">错误</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="questions">
|
||||
<div class="questiontitle">
|
||||
3、PFMEA假定所设计的产品能满足设计要求 （4分）
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">正确</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">错误</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="questiontype clearfix">
|
||||
<div class="type">选择题</div>
|
||||
</div>
|
||||
|
||||
<!-- 循环遍历生成选择题的问题和选项 -->
|
||||
<div class="questions" v-for="(q, index) in s_questions" :key="index">
|
||||
<div class="questiontitle">
|
||||
{{ q.text }}
|
||||
</div>
|
||||
<div
|
||||
class="btnswitch"
|
||||
v-for="(s, index) in s_options"
|
||||
:key="index"
|
||||
@click="selectBtn2(s)"
|
||||
>
|
||||
<div
|
||||
class="checkoutbtn"
|
||||
:style="{
|
||||
backgroundImage:
|
||||
'url(' +
|
||||
(s.selected === true
|
||||
? Images.checkboxImg
|
||||
: Images.checkbox2Img) +
|
||||
')',
|
||||
}"
|
||||
></div>
|
||||
<div class="select">{{ s.text }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="questions">
|
||||
<div class="questiontitle">
|
||||
4、.FMEA 是一种（ ）工具（4分）
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">问题解决</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">项目策划</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">过程分析</div>
|
||||
</div>
|
||||
<div class="btnswitch">
|
||||
<div class="checkoutbtn"></div>
|
||||
<div class="select">风险分析</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="btnbox">
|
||||
<div class="submitbtn">提交</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import { reactive, toRefs } from "vue";
|
||||
import TitleHead from "@/components/TitleHead.vue";
|
||||
import { reactive, toRefs } from "vue";
|
||||
import Images from "../../assets/image/index";
|
||||
// import TitleHead from "@/components/TitleHead.vue";
|
||||
export default {
|
||||
name: "ReadyExamination",
|
||||
components: {
|
||||
TitleHead,
|
||||
},
|
||||
setup() {
|
||||
},
|
||||
name: "ReadyExamination",
|
||||
// components: {
|
||||
// TitleHead,
|
||||
// },
|
||||
setup() {
|
||||
const state = reactive({
|
||||
questions: [
|
||||
{
|
||||
id: 1,
|
||||
type: "judge",
|
||||
text: "1、控制计划是由工艺部门完成 （4分）",
|
||||
options: [
|
||||
{
|
||||
id:1,
|
||||
text: "正确",
|
||||
select:"flase",
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
text: "错误",
|
||||
select:"flase",
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
type: "judge",
|
||||
text: "2、.PFMEA假定所设计的产品能满足设计要求 （4分）",
|
||||
options: [
|
||||
{
|
||||
id:1,
|
||||
text: "正确",
|
||||
select:"flase",
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
text: "错误",
|
||||
select:"flase",
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
type: "judge",
|
||||
text: "3、PFMEA假定所设计的产品能满足设计要求 （4分）",
|
||||
options: [
|
||||
{
|
||||
id:1,
|
||||
text: "正确",
|
||||
select:"flase",
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
text: "错误",
|
||||
select:"flase",
|
||||
},
|
||||
]
|
||||
},
|
||||
],
|
||||
//判断题问题和选项（暂时被questions替代）
|
||||
// j_questions: [
|
||||
// {
|
||||
// type: "judge",
|
||||
// id: 1,
|
||||
// text: "1、控制计划是由工艺部门完成 （4分）",
|
||||
// },
|
||||
// {
|
||||
// type: "judge",
|
||||
// id: 2,
|
||||
// text: "2、.PFMEA假定所设计的产品能满足设计要求",
|
||||
// },
|
||||
// {
|
||||
// type: "judge",
|
||||
// id: 3,
|
||||
// text: "3、PFMEA假定所设计的产品能满足设计要求 （4分）",
|
||||
// },
|
||||
// ],
|
||||
// j_options: [
|
||||
// {
|
||||
// id: 1,
|
||||
// text: "正确",
|
||||
// selected: false,
|
||||
// },
|
||||
// {
|
||||
// id: 2,
|
||||
// text: "错误",
|
||||
// selected: false,
|
||||
// },
|
||||
// ],
|
||||
|
||||
s_questions: [
|
||||
{
|
||||
type: "choice",
|
||||
id: 1,
|
||||
text: "4、.FMEA 是一种（ ）工具（4分）",
|
||||
},
|
||||
],
|
||||
s_options: [
|
||||
{
|
||||
id: 1,
|
||||
text: "问题解决",
|
||||
selected: false,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
text: "项目策划",
|
||||
selected: false,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
text: "过程分析",
|
||||
selected: false,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
text: "风险分析",
|
||||
selected: false,
|
||||
},
|
||||
]
|
||||
});
|
||||
const selectBtn = (value) => {
|
||||
value.select = !value.select
|
||||
};
|
||||
const selectBtn2 = (value) => {
|
||||
let arr = state.s_options;
|
||||
arr.map((i) => {
|
||||
if (i.id === value.id) {
|
||||
i.selected = !i.selected;
|
||||
}
|
||||
});
|
||||
state.s_options = arr;
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
selectBtn,
|
||||
selectBtn2,
|
||||
Images,
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.readyexamination{
|
||||
// .clearfix:before,
|
||||
// .clearfix:after {
|
||||
// content: " ";
|
||||
// display: table;
|
||||
// clear: both;
|
||||
// }
|
||||
.readyexamination {
|
||||
width: 100%;
|
||||
background-color: #F2F5F7;
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
color: #333330;
|
||||
}
|
||||
.notice {
|
||||
width: 100%;
|
||||
background-color: #ffffff;
|
||||
margin-top: 10px;
|
||||
.noticebox {
|
||||
width: 100%;
|
||||
// position: relative;
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
.main {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
padding-top: 19.5px;
|
||||
// .lefttitle {
|
||||
// display: flex;
|
||||
// margin-bottom: 21.5px;
|
||||
// .img {
|
||||
// width: 16px;
|
||||
// height: 18.5px;
|
||||
// background-image: url(../../assets/image/readyexamination/sandclock.png);
|
||||
// background-size: 100% 100%;
|
||||
// }
|
||||
// .rightmain {
|
||||
// display: flex;
|
||||
// margin-left: 4.5px;
|
||||
// font-size: 14px;
|
||||
// .time {
|
||||
// color: #56a3f9;
|
||||
// }
|
||||
// .box {
|
||||
// margin-left: 9.5px;
|
||||
// color: #ee423d;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
.re_title{
|
||||
margin-bottom: 23.5px;
|
||||
color: #04243C;
|
||||
font-weight: 600;
|
||||
}
|
||||
.questiontype {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.notice {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: -17.5px;
|
||||
.noticebox {
|
||||
width: 90%;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.main {
|
||||
width: 90%;
|
||||
margin-top: 20px;
|
||||
font-size: 14px;
|
||||
color: #333330;
|
||||
.lefttitle {
|
||||
display: flex;
|
||||
margin-bottom: 21.5px;
|
||||
.img {
|
||||
width: 16px;
|
||||
height: 18.5px;
|
||||
background-image: url(../../assets/image/readyexamination/sandclock.png);
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.rightmain {
|
||||
display: flex;
|
||||
margin-left: 4.5px;
|
||||
font-size: 14px;
|
||||
.time {
|
||||
color:#56A3F9;
|
||||
}
|
||||
.box {
|
||||
margin-left: 9.5px;
|
||||
color: #EE423D;
|
||||
}
|
||||
}
|
||||
}
|
||||
.questiontype{
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
margin-bottom: 20px;
|
||||
background-color: #F9F9F9;
|
||||
line-height: 35px;
|
||||
.type{
|
||||
margin-left: 11px;
|
||||
}
|
||||
}
|
||||
.questions{
|
||||
width: 100%;
|
||||
margin-left: 9.5px;
|
||||
.questiontitle{
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.btnswitch{
|
||||
display: flex;
|
||||
height: 13.6px;
|
||||
line-height: 13.6px;
|
||||
// align-items: center;
|
||||
margin-bottom: 15px;
|
||||
.checkoutbtn {
|
||||
width: 13.6px;
|
||||
height: 13.6px;
|
||||
background-image: url(../../assets/image/checkbox2.png);
|
||||
background-size: 100% 100%;
|
||||
margin-right: 6.5px;
|
||||
}
|
||||
.select{
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btnbox{
|
||||
width: 83px;
|
||||
height: 33px;
|
||||
background-color: #2478FF;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0px 1px 8px 0px rgba(56,125,247,0.7);
|
||||
font-size: 14px;
|
||||
margin: 18px auto 24px auto;
|
||||
text-align: center;
|
||||
line-height: 33px;
|
||||
.submitbtn{
|
||||
border: none;
|
||||
background-color: #2478FF;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
height: 40px;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 20px;
|
||||
background-color: #F2F5F7;
|
||||
line-height: 40px;
|
||||
font-weight: 500;
|
||||
.type {
|
||||
margin-left: 11px;
|
||||
}
|
||||
}
|
||||
.questions {
|
||||
width: 100%;
|
||||
margin-left: 9px;
|
||||
.questiontitle {
|
||||
margin-bottom: 18px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.btnswitch {
|
||||
display: flex;
|
||||
height: 13.6px;
|
||||
line-height: 13.6px;
|
||||
margin-left: 23px;
|
||||
margin-bottom: 15px;
|
||||
.checkoutbtn {
|
||||
width: 13.6px;
|
||||
height: 13.6px;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 6.5px;
|
||||
}
|
||||
.select {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btnbox {
|
||||
width: 301.5px;
|
||||
height: 33px;
|
||||
background-color: #2478ff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
|
||||
font-size: 14px;
|
||||
margin: 30px auto 24px auto;
|
||||
text-align: center;
|
||||
line-height: 33px;
|
||||
.submitbtn {
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
background-color: #2478ff;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -27,6 +27,127 @@
|
||||
<div class="titlebtn">评估</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="teacher">
|
||||
<div style="width: 90%">
|
||||
<div class="teachertitle">
|
||||
<img
|
||||
style="width: 17px; height: 17px"
|
||||
src="../../assets/image/faceteach/livelecturer.png"
|
||||
/>
|
||||
<div class="talk">直播讲师</div>
|
||||
<div class="box"></div>
|
||||
</div>
|
||||
<div class="teachermain">
|
||||
<img class="teacherAvatar" src="../../assets/image/img.jpg" />
|
||||
<div style="flex: 1; margin-left: 11px; margin-right: 13px">
|
||||
<div class="teacherName">王星天（显示事业）</div>
|
||||
<div class="teacherIntro">
|
||||
教师是学生的镜子,学生是 老师的影子。
|
||||
</div>
|
||||
</div>
|
||||
<div class="teacherFollow">+ 关注</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail">
|
||||
<div style="width: 90%">
|
||||
<div class="teachertitle">
|
||||
<img
|
||||
style="width: 17px; height: 17px"
|
||||
src="../../assets/image/faceteach/livelecturer.png"
|
||||
/>
|
||||
<div class="talk">课程详情</div>
|
||||
<div class="box"></div>
|
||||
</div>
|
||||
<div class="detailMain">
|
||||
通过对各级人员的软件平台培训，使其能够了解如何
|
||||
运用乾元坤和智能信息管理系统来提升企业管理水平
|
||||
最大限度发挥软件产品在企业中的作用。<br />
|
||||
1.使企业不同部门人员掌握便捷、有效的系统平台操 作方法;<br />
|
||||
2.通过系统平台的培训提高员工对企业的管理理念认 识与提升。<br />
|
||||
3.通过系统平台培训加强沟通，统一部署，协同工作 提高效率。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="course">
|
||||
<div style="width: 100%">
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane label="课程附件" name="first">
|
||||
<div
|
||||
v-for="(el, index) in enclosure"
|
||||
:key="el.id"
|
||||
class="enclosure"
|
||||
:style="{
|
||||
'border-bottom':
|
||||
index === enclosure.length - 1
|
||||
? null
|
||||
: '1px solid rgba(56, 125, 247, 0.2)',
|
||||
}"
|
||||
>
|
||||
<div class="enclosureL">
|
||||
<img style="width: 19.5px; height: 22px" :src="el.img" />
|
||||
<div style="margin-left: 15px">{{ el.name }}</div>
|
||||
</div>
|
||||
<div class="download">
|
||||
<img
|
||||
style="width: 13px; height: 12px"
|
||||
src="../../assets/image/faceteach/download.png"
|
||||
/>
|
||||
<div style="margin-left: 2.5px">下载</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="课程作业" name="second">
|
||||
<div class="work">
|
||||
<div class="question">社交产品如何做好模块化处理？</div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div
|
||||
style="
|
||||
margin-top: 16px;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
"
|
||||
>
|
||||
<div class="tag1" style="margin: 0px 10px 10px 0px">
|
||||
必修
|
||||
</div>
|
||||
<div class="tag3" style="margin: 0px 10px 10px 0px">
|
||||
作业
|
||||
</div>
|
||||
</div>
|
||||
<div class="submit">提交</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="课程考试" name="third">
|
||||
<div class="work">
|
||||
<div class="question">
|
||||
模块化产品展示相关案例与展示：如何自由组合你的 思考？
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div
|
||||
style="
|
||||
margin-top: 16px;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
"
|
||||
>
|
||||
<div class="tag1" style="margin: 0px 10px 10px 0px">
|
||||
必修
|
||||
</div>
|
||||
<div class="tag3" style="margin: 0px 10px 10px 0px">
|
||||
作业
|
||||
</div>
|
||||
</div>
|
||||
<div class="submit">提交</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -110,10 +231,12 @@ export default {
|
||||
<style lang="scss">
|
||||
.faceteach {
|
||||
width: 100%;
|
||||
padding-bottom: 20px;
|
||||
.main {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: -14.5px;
|
||||
.title {
|
||||
width: 90%;
|
||||
@@ -150,6 +273,182 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.teachertitle {
|
||||
width: 90px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 21px;
|
||||
.talk {
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
line-height: 12px;
|
||||
margin-left: 7.5px;
|
||||
}
|
||||
.box {
|
||||
position: absolute;
|
||||
width: 62.5px;
|
||||
height: 10px;
|
||||
right: 6px;
|
||||
bottom: -4px;
|
||||
background: rgba(36, 120, 255, 0.15);
|
||||
}
|
||||
}
|
||||
.teacher {
|
||||
width: 90%;
|
||||
padding-bottom: 15px;
|
||||
border-radius: 4px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
|
||||
.teachermain {
|
||||
margin-top: 24px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.teacherAvatar {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 25px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
.teacherName {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #394145;
|
||||
line-height: 21px;
|
||||
}
|
||||
.teacherIntro {
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #394145;
|
||||
line-height: 21px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.teacherFollow {
|
||||
width: 73px;
|
||||
height: 28px;
|
||||
background: #2478ff;
|
||||
border-radius: 2px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 12px;
|
||||
color: #fff;
|
||||
margin-top: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.detail {
|
||||
width: 90%;
|
||||
padding-bottom: 25px;
|
||||
background: #ffffff;
|
||||
border-radius: 4px;
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.detailMain {
|
||||
margin-top: 22px;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #333330;
|
||||
line-height: 24px;
|
||||
}
|
||||
}
|
||||
.course {
|
||||
width: 90%;
|
||||
// padding-bottom: 15px;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.el-tabs__nav {
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.el-tabs__item {
|
||||
height: 50px;
|
||||
padding: 0px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 21px;
|
||||
padding-top: 15px;
|
||||
}
|
||||
.el-tabs__nav-wrap::after {
|
||||
background-color: rgba(56, 125, 247, 0.2);
|
||||
}
|
||||
.el-tabs__header {
|
||||
margin: 0;
|
||||
}
|
||||
.enclosure {
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
height: 50px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.enclosureL {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #677d86;
|
||||
line-height: 19px;
|
||||
}
|
||||
.download {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #2478ff;
|
||||
line-height: 19px;
|
||||
}
|
||||
}
|
||||
.work {
|
||||
// margin-left: 51px;
|
||||
// margin-right: 40px;
|
||||
padding-bottom: 20px;
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
margin-top: 17.5px;
|
||||
}
|
||||
.work .question {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: #333330;
|
||||
line-height: 21.5px;
|
||||
}
|
||||
|
||||
.work .submit {
|
||||
width: 73px;
|
||||
height: 28px;
|
||||
margin-top: 16px;
|
||||
background: #2478ff;
|
||||
box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
|
||||
border-radius: 2px;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
93
src/views/filestorag/fileStorag.vue
Normal file
93
src/views/filestorag/fileStorag.vue
Normal file
@@ -0,0 +1,93 @@
|
||||
<template>
|
||||
<div class="filestorag">
|
||||
<div class="notice">
|
||||
<div class="noticebox">
|
||||
<div class="main">
|
||||
<div class="filebox"
|
||||
v-for="(t,index) in t_items"
|
||||
:key="index">
|
||||
<div class="fileimg"
|
||||
:style="{
|
||||
backgroundImage:
|
||||
'url('+ t.imgUrl +')'
|
||||
}"
|
||||
></div>
|
||||
<div class="filename">{{t.text}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
import Images from "../../assets/image/index";
|
||||
export default {
|
||||
name: "FileStorag",
|
||||
setup() {
|
||||
const state = reactive({
|
||||
t_items: [
|
||||
{
|
||||
id: 1,
|
||||
text: "示例文档.zip",
|
||||
imgUrl:Images.zipImg,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
text: "示例文档.md",
|
||||
imgUrl:Images.mdImg,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
text: "示例文档.rar",
|
||||
imgUrl:Images.rarImg,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
text: "示例文档.word",
|
||||
imgUrl:Images.wordImg,
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
return {
|
||||
...toRefs(state),
|
||||
Images,
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.filestorag{
|
||||
width: 100%;
|
||||
background-color: #F2F5F7;
|
||||
font-size: 13px;
|
||||
color: #677D86;
|
||||
.notice{
|
||||
width: 100%;
|
||||
background-color: #ffffff;
|
||||
margin-top: 10px;
|
||||
.noticebox{
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
.main{
|
||||
width: 100%;
|
||||
.filebox{
|
||||
display: flex;
|
||||
margin-left: 16.5px;
|
||||
padding: 21.5px 0;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #EDF3FF;
|
||||
.fileimg{
|
||||
width: 19.5px;
|
||||
height: 22px;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 19px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -130,7 +130,7 @@ export default {
|
||||
}
|
||||
.homeworkpage {
|
||||
width: 100%;
|
||||
|
||||
padding-bottom: 20px;
|
||||
.notice {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
||||
@@ -20,9 +20,9 @@
|
||||
<div class="text">{{ value.text }}</div>
|
||||
<div class="answerLcontainer">
|
||||
<div class="answerL">
|
||||
<div>完全没用</div>
|
||||
<div>非常好</div>
|
||||
</div>
|
||||
<div>完全没用</div>
|
||||
<div>非常好</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="answer">
|
||||
<div class="answerC">
|
||||
@@ -58,20 +58,27 @@
|
||||
:style="{ 'margin-top': '22px' }"
|
||||
@click="selectPeople(value)"
|
||||
>
|
||||
<div class="conn">
|
||||
<div class="conn">
|
||||
<div class="peoplecontainer">
|
||||
<img
|
||||
style="width: 14px; height: 13px"
|
||||
:src="
|
||||
value.select
|
||||
? require('../../assets/image/investigat/checkbox.png')
|
||||
: require('../../assets/image/investigat/checkbox2.png')
|
||||
"
|
||||
/>
|
||||
<div class="people" style="font-size: 13px; margin-left: 7px;margin-top: -2px;">
|
||||
{{ value.text }}
|
||||
</div>
|
||||
</div>
|
||||
<img
|
||||
style="width: 14px; height: 13px"
|
||||
:src="
|
||||
value.select
|
||||
? require('../../assets/image/investigat/checkbox.png')
|
||||
: require('../../assets/image/investigat/checkbox2.png')
|
||||
"
|
||||
/>
|
||||
<div
|
||||
class="people"
|
||||
style="
|
||||
font-size: 13px;
|
||||
margin-left: 7px;
|
||||
margin-top: -2.5px;
|
||||
"
|
||||
>
|
||||
{{ value.text }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -80,14 +87,14 @@
|
||||
<div style="margin-top: 21px; position: relative">
|
||||
<div class="inputcon">
|
||||
<el-input
|
||||
style="width: 87%"
|
||||
v-model="textarea1"
|
||||
:autosize="{ minRows: 5, maxRows: 5 }"
|
||||
resize="none"
|
||||
maxlength="200"
|
||||
type="textarea"
|
||||
@input="textareaInput"
|
||||
/>
|
||||
style="width: 87%"
|
||||
v-model="textarea1"
|
||||
:autosize="{ minRows: 5, maxRows: 5 }"
|
||||
resize="none"
|
||||
maxlength="200"
|
||||
type="textarea"
|
||||
@input="textareaInput"
|
||||
/>
|
||||
</div>
|
||||
<div class="words">{{ textarealength }}/200</div>
|
||||
</div>
|
||||
@@ -197,7 +204,7 @@ export default {
|
||||
}
|
||||
.Investigat {
|
||||
width: 100%;
|
||||
|
||||
padding-bottom: 20px;
|
||||
.notice {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@@ -206,7 +213,7 @@ export default {
|
||||
margin-top: 20px;
|
||||
.noticebox {
|
||||
// width: 90%;
|
||||
width:100%;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
@@ -244,16 +251,16 @@ export default {
|
||||
background-image: url(../../assets/image/ballotpage/next.png);
|
||||
}
|
||||
}
|
||||
.conn{
|
||||
.conn {
|
||||
width: 100%;
|
||||
display:flex;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
// background-color:yellow;
|
||||
.peoplecontainer{
|
||||
// background-color: yellowgreen;
|
||||
display: flex;
|
||||
width: 94%;
|
||||
}
|
||||
.peoplecontainer {
|
||||
// background-color: yellowgreen;
|
||||
display: flex;
|
||||
width: 94%;
|
||||
}
|
||||
}
|
||||
.question {
|
||||
.text {
|
||||
@@ -261,20 +268,20 @@ export default {
|
||||
font-weight: 500;
|
||||
color: #333330;
|
||||
}
|
||||
.answerLcontainer{
|
||||
.answerLcontainer {
|
||||
width: 100%;
|
||||
display:flex;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.answerL {
|
||||
width:87%;
|
||||
margin-bottom: -20px;
|
||||
margin-top: 12px;
|
||||
font-size: 13px;
|
||||
// width: 100%;
|
||||
color: #56a3f9;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
width: 87%;
|
||||
margin-bottom: -20px;
|
||||
margin-top: 12px;
|
||||
font-size: 13px;
|
||||
// width: 100%;
|
||||
color: #56a3f9;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
.answer {
|
||||
margin-top: 30px;
|
||||
@@ -287,7 +294,7 @@ export default {
|
||||
.answerC {
|
||||
// width: 540px;
|
||||
// width: 100%;
|
||||
width:86%;
|
||||
width: 86%;
|
||||
height: 43px;
|
||||
border: 1px solid #d7e5fd;
|
||||
border-radius: 8px;
|
||||
@@ -332,8 +339,8 @@ export default {
|
||||
font-weight: 500;
|
||||
color: #333330;
|
||||
}
|
||||
.inputcon{
|
||||
width:100%;
|
||||
.inputcon {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
@@ -3,23 +3,22 @@
|
||||
<!-- <TitleHead text="【投票】管理者进阶腾飞班 - 授课方式"></TitleHead> -->
|
||||
<div class="top">
|
||||
<div class="topin">
|
||||
<div class="topsa">请各位选课的同学提前阅读本课程的“教学大纲与计划…</div>
|
||||
<img class="topimg" src="../../assets/image/liveboradcast/cha.png" >
|
||||
<div class="topsa">
|
||||
请各位选课的同学提前阅读本课程的“教学大纲与计划…
|
||||
</div>
|
||||
<img class="topimg" src="../../assets/image/liveboradcast/cha.png" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice" style="margin-top:0">
|
||||
|
||||
<div class="notice" style="margin-top: 0">
|
||||
<div class="noticebox">
|
||||
<div class="avator">
|
||||
<img class="avaimg" src="../../assets/image/liveboradcast/px.jpg">
|
||||
<img class="avaimg" src="../../assets/image/liveboradcast/px.jpg" />
|
||||
<div class="avaname">刘敏</div>
|
||||
</div>
|
||||
<div class="mani">
|
||||
<div class="joininfo" >
|
||||
管理者进阶腾飞班 - 专属线下活动
|
||||
</div>
|
||||
<div class="joininfo">管理者进阶腾飞班 - 专属线下活动</div>
|
||||
<div class="contenttitle">
|
||||
<img class="timeimg" src="../../assets/image/ballotpage/time.png" >
|
||||
<img class="timeimg" src="../../assets/image/ballotpage/time.png" />
|
||||
<div class="timee">2022-07-20 20:00-21:00</div>
|
||||
</div>
|
||||
<div class="midline"></div>
|
||||
@@ -30,54 +29,47 @@
|
||||
<button class="samebtn btnr">评估</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="notice">
|
||||
|
||||
<div class="noticebox">
|
||||
|
||||
<div class="mani">
|
||||
<div class="joininfo">
|
||||
活动详情
|
||||
</div>
|
||||
<div class="joininfo">活动详情</div>
|
||||
<div class="line"></div>
|
||||
<div class="contentone">
|
||||
<div class="actinner">
|
||||
活动详情<br/>通过对各级人员的软件平台培训，使其能够了解如何运用乾元坤和智能信息管理系统来提升企业管理水平，最大限度发挥软件产品在企业中的作用;<br/>● 培训目标<br/>1.使企业不同部门人员掌握便捷、有效的系统平台操作方法;<br/>2.通过系统平台的培训提高员工对企业的管理理念认识与提升。<br/>3.通过系统平台培训加强沟通，统一部署，协同工作，提高效率。<br/>● 培训对象<br/>集团领导、各相关部门领导、总经理、车间主管、车间操作员
|
||||
活动详情<br />通过对各级人员的软件平台培训，使其能够了解如何运用乾元坤和智能信息管理系统来提升企业管理水平，最大限度发挥软件产品在企业中的作用;<br />●
|
||||
培训目标<br />1.使企业不同部门人员掌握便捷、有效的系统平台操作方法;<br />2.通过系统平台的培训提高员工对企业的管理理念认识与提升。<br />3.通过系统平台培训加强沟通，统一部署，协同工作，提高效率。<br />●
|
||||
培训对象<br />集团领导、各相关部门领导、总经理、车间主管、车间操作员
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice">
|
||||
|
||||
<div class="noticebox">
|
||||
|
||||
<div class="mani">
|
||||
<div class="joininfo">
|
||||
课后作业
|
||||
</div>
|
||||
<div class="joininfo">课后作业</div>
|
||||
<div class="line"></div>
|
||||
<div class="contentone">
|
||||
<div class="de">
|
||||
<div class="deal">网易有道词典现有功能结构拆解</div>
|
||||
<img class="rightpng" src="../../assets/image/liveboradcast/toright.png" >
|
||||
<img
|
||||
class="rightpng"
|
||||
src="../../assets/image/liveboradcast/toright.png"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="detailin">
|
||||
<div class="in">查找资料，介绍一种国外（日本、美国、欧洲）道路（公路、铁路、城市道路、地铁）设计规范的演变过程，可以一种或几种主要技术指标为例，并说明其原因。</div>
|
||||
<div class="in">
|
||||
查找资料，介绍一种国外（日本、美国、欧洲）道路（公路、铁路、城市道路、地铁）设计规范的演变过程，可以一种或几种主要技术指标为例，并说明其原因。
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -89,9 +81,7 @@ export default {
|
||||
components: {
|
||||
// TitleHead,
|
||||
},
|
||||
setup() {
|
||||
|
||||
},
|
||||
setup() {},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -105,26 +95,26 @@ export default {
|
||||
}
|
||||
.liveboradcast {
|
||||
width: 100%;
|
||||
.top{
|
||||
.top {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height:25px;
|
||||
background-color: #FFFBEE;
|
||||
.topin{
|
||||
height: 25px;
|
||||
background-color: #fffbee;
|
||||
.topin {
|
||||
// text-align: center;
|
||||
width:90%;
|
||||
width: 90%;
|
||||
height: 25px;
|
||||
display:flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.topsa{
|
||||
color:#FF9E00;
|
||||
.topsa {
|
||||
color: #ff9e00;
|
||||
line-height: 25px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.topimg{
|
||||
.topimg {
|
||||
height: 10px;
|
||||
width:10px;
|
||||
width: 10px;
|
||||
margin-top: 7px;
|
||||
}
|
||||
}
|
||||
@@ -142,108 +132,107 @@ export default {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.avator{
|
||||
display:flex;
|
||||
position:absolute;
|
||||
right:29px;
|
||||
top:30px;
|
||||
.avator {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
right: 29px;
|
||||
top: 30px;
|
||||
// background-color:red;
|
||||
// z-index: 999;
|
||||
.avaimg{
|
||||
.avaimg {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.avaname{
|
||||
.avaname {
|
||||
line-height: 30px;
|
||||
margin-left: 8px;
|
||||
color:#0D233A;
|
||||
color: #0d233a;
|
||||
}
|
||||
}
|
||||
.line{
|
||||
width: 100%;
|
||||
height: 0;
|
||||
border-top: 1px solid #F1F2F3;
|
||||
margin-top: 17px;
|
||||
position:absolute;
|
||||
left:0;
|
||||
}
|
||||
.line {
|
||||
width: 100%;
|
||||
height: 0;
|
||||
border-top: 1px solid #f1f2f3;
|
||||
margin-top: 17px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
.mani {
|
||||
width: 90%;
|
||||
margin-top: 20px;
|
||||
// position:relative;
|
||||
.joininfo{
|
||||
color:#0D233A;
|
||||
.joininfo {
|
||||
color: #0d233a;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
.contenttitle{
|
||||
width:100%;
|
||||
|
||||
.contenttitle {
|
||||
width: 100%;
|
||||
// height:10px;
|
||||
margin-top: 15px;
|
||||
// background-color: #bfa;
|
||||
display:flex;
|
||||
.timeimg{
|
||||
display: flex;
|
||||
.timeimg {
|
||||
width: 12.8px;
|
||||
height: 13px;
|
||||
}
|
||||
.timee{
|
||||
color:#6E7B84;
|
||||
.timee {
|
||||
color: #6e7b84;
|
||||
font-size: 14px;
|
||||
line-height: 13px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
}
|
||||
.midline{
|
||||
height:0;
|
||||
border-top: 1px solid #F1F2F3;
|
||||
width:100%;
|
||||
.midline {
|
||||
height: 0;
|
||||
border-top: 1px solid #f1f2f3;
|
||||
width: 100%;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.timebox{
|
||||
display:flex;
|
||||
.timebox {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
// height: 100px;
|
||||
// background-color: #bfa;
|
||||
margin-bottom: 15px;
|
||||
.allbtn{
|
||||
.allbtn {
|
||||
width: 92%;
|
||||
display:flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// background-color: lightcoral;
|
||||
.samebtn{
|
||||
.samebtn {
|
||||
width: 93px;
|
||||
height:33px;
|
||||
border:0;
|
||||
color:#fff;
|
||||
height: 33px;
|
||||
border: 0;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.btno{
|
||||
background-color: #00C1FC;
|
||||
}
|
||||
.btnt{
|
||||
background-color:#0096FA;
|
||||
}
|
||||
.btnr{
|
||||
background-color: #2478FF;
|
||||
}
|
||||
.btno {
|
||||
background-color: #00c1fc;
|
||||
}
|
||||
.btnt {
|
||||
background-color: #0096fa;
|
||||
}
|
||||
.btnr {
|
||||
background-color: #2478ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.detailin{
|
||||
width:100%;
|
||||
.detailin {
|
||||
width: 100%;
|
||||
// height: 100px;
|
||||
// background-color: red;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.in{
|
||||
.in {
|
||||
margin-left: 20px;
|
||||
width:86%;
|
||||
color:#6E7B84;
|
||||
width: 86%;
|
||||
color: #6e7b84;
|
||||
line-height: 30px;
|
||||
font-size: 13px;
|
||||
}
|
||||
@@ -255,84 +244,82 @@ export default {
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
// height: 200px;
|
||||
.actinner{
|
||||
.actinner {
|
||||
// background-color: red;
|
||||
color:#6E7B84;
|
||||
color: #6e7b84;
|
||||
font-size: 13px;
|
||||
line-height: 30px;
|
||||
}
|
||||
.de{
|
||||
width:100%;
|
||||
height:34px;
|
||||
.de {
|
||||
width: 100%;
|
||||
height: 34px;
|
||||
border-radius: 10px;
|
||||
background-color: #F2F5F7;
|
||||
background-color: #f2f5f7;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.deal{
|
||||
color:#333330;
|
||||
.deal {
|
||||
color: #333330;
|
||||
font-weight: bold;
|
||||
line-height: 34px;
|
||||
margin-left: 21px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.rightpng{
|
||||
.rightpng {
|
||||
width: 6px;
|
||||
height:11px;
|
||||
height: 11px;
|
||||
margin-right: 6px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
}
|
||||
.ballotjoincontainer{
|
||||
.ballotjoincontainer {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
.ballotjoin{
|
||||
width: 85%;
|
||||
// height:100px;
|
||||
// background-color: #bfa;
|
||||
.ballotitem{
|
||||
|
||||
.upitem{
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
display:flex;
|
||||
.leftimg{
|
||||
width: 4.5px;
|
||||
height:14.5px;
|
||||
margin-top: 1px;
|
||||
.ballotjoin {
|
||||
width: 85%;
|
||||
// height:100px;
|
||||
// background-color: #bfa;
|
||||
.ballotitem {
|
||||
.upitem {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
display: flex;
|
||||
.leftimg {
|
||||
width: 4.5px;
|
||||
height: 14.5px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
.leftcontent {
|
||||
margin-left: 9px;
|
||||
color: #6e7b84;
|
||||
font-size: 13px;
|
||||
line-height: 30px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
}
|
||||
.leftcontent{
|
||||
margin-left: 9px;
|
||||
color:#6E7B84;
|
||||
font-size: 13px;
|
||||
line-height: 30px;
|
||||
margin-top: -5px;
|
||||
.btn {
|
||||
background-color: #2478ff;
|
||||
color: #fff;
|
||||
width: 64px;
|
||||
height: 21px;
|
||||
border-radius: 10px;
|
||||
border: 0;
|
||||
font-size: 12px;
|
||||
line-height: 19px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
}
|
||||
.btn{
|
||||
background-color: #2478FF;
|
||||
color:#fff;
|
||||
width:64px;
|
||||
height:21px;
|
||||
border-radius: 10px;
|
||||
border:0;
|
||||
font-size: 12px;
|
||||
line-height:19px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
}
|
||||
.thinline{
|
||||
width: 100%;
|
||||
border-top: 1px solid #F1F2F3;
|
||||
margin-top: 17px;
|
||||
margin-bottom: 17px;
|
||||
.thinline {
|
||||
width: 100%;
|
||||
border-top: 1px solid #f1f2f3;
|
||||
margin-top: 17px;
|
||||
margin-bottom: 17px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
1174
src/views/pathmap/PathmapPage.vue
Normal file
1174
src/views/pathmap/PathmapPage.vue
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user