mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/student-h5.git
synced 2025-12-10 11:26:48 +08:00
feat:合并
This commit is contained in:
李晓鸽
BIN
src/assets/image/checkbox.png
Normal file
BIN
src/assets/image/checkbox.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 734 B |
BIN
src/assets/image/checkbox2.png
Normal file
BIN
src/assets/image/checkbox2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 620 B |
BIN
src/assets/image/cycle.png
Normal file
BIN
src/assets/image/cycle.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 826 B |
BIN
src/assets/image/discuss/dianzan.png
Normal file
BIN
src/assets/image/discuss/dianzan.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 404 B |
BIN
src/assets/image/discuss/elsedianzan.png
Normal file
BIN
src/assets/image/discuss/elsedianzan.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 496 B |
BIN
src/assets/image/discuss/pinglun.png
Normal file
BIN
src/assets/image/discuss/pinglun.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 430 B |
BIN
src/assets/image/discuss/px.jpg
Normal file
BIN
src/assets/image/discuss/px.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
src/assets/image/discuss/shoucang.png
Normal file
BIN
src/assets/image/discuss/shoucang.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 484 B |
BIN
src/assets/image/next.png
Normal file
BIN
src/assets/image/next.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 571 B |
BIN
src/assets/image/pre.png
Normal file
BIN
src/assets/image/pre.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 572 B |
BIN
src/assets/image/readyexamination/sandclock.png
Normal file
BIN
src/assets/image/readyexamination/sandclock.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
@@ -124,7 +124,7 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin-top: 10px;
|
margin-top: -17.5px;
|
||||||
.noticebox {
|
.noticebox {
|
||||||
width: 90%;
|
width: 90%;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
@@ -316,6 +316,7 @@ export default {
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
.imgsame {
|
.imgsame {
|
||||||
|
background-size: 100% 100%;
|
||||||
width: 95px;
|
width: 95px;
|
||||||
height: 95px;
|
height: 95px;
|
||||||
// background-color: blue;
|
// background-color: blue;
|
||||||
|
|||||||
586
src/views/discuss/DiscussDetail.vue
Normal file
586
src/views/discuss/DiscussDetail.vue
Normal file
@@ -0,0 +1,586 @@
|
|||||||
|
<template>
|
||||||
|
<div class="discussdetail">
|
||||||
|
<TitleHead text="【直播】管理者进阶腾飞班 - 毕业典礼"></TitleHead>
|
||||||
|
<div class="main">
|
||||||
|
<div class="title">
|
||||||
|
<div class="inner clearfix">
|
||||||
|
<!-- 时间 pre next 外部盒子-->
|
||||||
|
<div class="titlemain clearfix">
|
||||||
|
<!-- <div class="imgTime clearfix">
|
||||||
|
<div class="img"></div>
|
||||||
|
<div class="time">2022-07-20 20:00-21:00</div>
|
||||||
|
</div> -->
|
||||||
|
<div class="preNext clearfix">
|
||||||
|
<div class="sameone pre" style="margin-right: 5px"></div>
|
||||||
|
<div class="sametwo">上一个</div>
|
||||||
|
<div class="sametwo" style="margin-left: 15.5px">下一个</div>
|
||||||
|
<div class="sameone next" style="margin-left: 5px"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="titleblue">
|
||||||
|
请基于公司的战略方向和你所负责的组织的业务发展，识别3-5个你和你的团队在未来2-3年的新的能力与技能要求
|
||||||
|
</div>
|
||||||
|
<div class="buttoncontainer">
|
||||||
|
<button class="btn">发表帖子</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preview">
|
||||||
|
<div class="previewbox">
|
||||||
|
<div class="previewmani">
|
||||||
|
<div class="discusstitle clearfix">
|
||||||
|
<div class="titcon">
|
||||||
|
<div class="maint">第二讲：模块化产品展示：班内成员讨论</div>
|
||||||
|
<div class="intime">
|
||||||
|
<div class="yuna"></div>
|
||||||
|
<div class="in">进行中</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="alltalkcontainer">
|
||||||
|
<div class="inne">
|
||||||
|
<div class="takltitle">从营销角度分析：我的团队需要这些能力</div>
|
||||||
|
<div class="taklcon">
|
||||||
|
所谓团队协作能力，是指建立在团队的基础之上，发挥团队精神、互补互助以达到团队最大工作效率的能力。对于团队的成员来说，不仅要有个人能力，更需要有在不同的位置上各尽所能、与其他成员协调合作的能力。<br />包容成员
|
||||||
|
<br />团队工作需要成员在一起不断地讨论，如果一个人固执己见，无法听取他人的意见，或无法和他人达成一致，团队的工作就无法进行下去。团队的效率在于配合的默契，如果达不成这种默契，团队合作就不可能成功。为此，对待团队中其他成员时一定要抱着宽容的心态，讨论问题的时候对事不对人，即使他人犯了错误，也要本着大家共同进步的目的去帮对方改正，而不是一味斥责。同时也要经常检查自己的缺点，如果意识到了自己的缺点，不妨将它坦诚地讲出来，承认自己的缺点，让大家共同帮助你改进，这是最有效的方法。<br />获得支持<br />要使自己的工作得到大家的支持和认可，而不是反对，必须让大家喜欢你。但一个人又如何让别人来喜欢你呢?除了在工作中互相支援、互相鼓励外，还应该尽量和大家一起去参加各种活动，或者礼貌地关心一下大家的生活。<br />保持谦虚<br />任何人都不喜欢骄傲自大的人，这种人在团队合作中也不会被大家认可。可能你在某个方面比其他人强，但你更应该将自己的注意力放在他人的强项上，只有这样，才能看到自己的肤浅和无知。因为团队中的任
|
||||||
|
</div>
|
||||||
|
<div class="bottombox">
|
||||||
|
<div class="dianzan">
|
||||||
|
<div class="sa">
|
||||||
|
<div>
|
||||||
|
<img
|
||||||
|
style="margin-right: 9.5px; margin-left: 10px"
|
||||||
|
src="../../assets/image/discuss/dianzan.png"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span>103</span>
|
||||||
|
</div>
|
||||||
|
<div class="sa">
|
||||||
|
<div>
|
||||||
|
<img
|
||||||
|
style="margin-right: 9.5px"
|
||||||
|
src="../../assets/image/discuss/shoucang.png"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span>103</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="restore">
|
||||||
|
<div class="restorebox">
|
||||||
|
<div class="restoremani">
|
||||||
|
<div
|
||||||
|
class="rescon clearfix"
|
||||||
|
v-for="(item, index) in restore"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<div class="head">
|
||||||
|
<div>
|
||||||
|
<img class="headavator" :src="item.head" />
|
||||||
|
</div>
|
||||||
|
<div class="namehead">
|
||||||
|
{{ item.name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="inner">
|
||||||
|
<div class="allimg">
|
||||||
|
<img class="reavator" :src="item.reimg" />
|
||||||
|
<img class="reavator" :src="item.reimg" />
|
||||||
|
<img class="reavator" :src="item.reimg" />
|
||||||
|
</div>
|
||||||
|
<div class="recon">{{ item.re }}</div>
|
||||||
|
<div class="botto">
|
||||||
|
<div class="time">{{ item.time }}</div>
|
||||||
|
<div class="re">回复</div>
|
||||||
|
<div class="right">
|
||||||
|
<div class="good">
|
||||||
|
<img src="../../assets/image/discuss/elsedianzan.png" />
|
||||||
|
</div>
|
||||||
|
<div class="gocount">67</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="newre">
|
||||||
|
<div class="tri"></div>
|
||||||
|
<div class="rec clearfix">
|
||||||
|
<div class="it" v-for="(itemc, index) in newrestore" :key="index">
|
||||||
|
<div class="ava">
|
||||||
|
<img class="avainner" :src="itemc.head" />
|
||||||
|
</div>
|
||||||
|
<div class="redetail">
|
||||||
|
<div class="rename">{{ itemc.name }}</div>
|
||||||
|
<div class="rein">{{ itemc.re }}</div>
|
||||||
|
<div class="detre">
|
||||||
|
<div class="day">{{ itemc.time }}</div>
|
||||||
|
<div class="huifu">回复</div>
|
||||||
|
<div class="good">
|
||||||
|
<img
|
||||||
|
class="gimg"
|
||||||
|
src="../../assets/image/discuss/elsedianzan.png"
|
||||||
|
/>
|
||||||
|
<div class="gcou">0</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="line"></div> -->
|
||||||
|
<div
|
||||||
|
:class="index === newrestore.length - 1 ? null : 'line'"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="btncon clearfix">
|
||||||
|
<button class="btnn">查看全部14条评论</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { reactive, toRefs } from "vue";
|
||||||
|
import TitleHead from "@/components/TitleHead.vue";
|
||||||
|
export default {
|
||||||
|
name: "DiscussDetail",
|
||||||
|
components: {
|
||||||
|
TitleHead,
|
||||||
|
},
|
||||||
|
setup() {
|
||||||
|
const state = reactive({
|
||||||
|
restore: [
|
||||||
|
{
|
||||||
|
name: "罗宗梅",
|
||||||
|
time: "2022-09-01",
|
||||||
|
re: "教师基本功扎实，知识讲解准确，教学设计合理，始终以学生为主体，自主学习，小组交流讨论，上台交流展示等形式，师生配合默契，取得了较好的学习效果。",
|
||||||
|
head: require("../../assets/image/discuss/px.jpg"),
|
||||||
|
reimg: require("../../assets/image/discuss/px.jpg"),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
newrestore: [
|
||||||
|
{
|
||||||
|
name: "赵雪梨",
|
||||||
|
time: "三天前",
|
||||||
|
re: "教学重难点突出，板书条理清晰。教学步骤设计合理由浅入深，循序渐进。",
|
||||||
|
head: require("../../assets/image/discuss/px.jpg"),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "赵雪梨",
|
||||||
|
time: "三天前",
|
||||||
|
re: "教学重难点突出，板书条理清晰。教学步骤设计合理由浅入深，循序渐进。",
|
||||||
|
head: require("../../assets/image/discuss/px.jpg"),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
...toRefs(state),
|
||||||
|
};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
<style lang="scss">
|
||||||
|
.clearfix:before,
|
||||||
|
.clearfix:after {
|
||||||
|
content: " ";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
.discussdetail {
|
||||||
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
.main {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: -14.5px;
|
||||||
|
position: relative;
|
||||||
|
.title {
|
||||||
|
width: 90%;
|
||||||
|
// height: 109px;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
width: 90%;
|
||||||
|
.titlemain {
|
||||||
|
width: 100%;
|
||||||
|
// display: flex;
|
||||||
|
margin-top: 18.5px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
height: 18px;
|
||||||
|
.imgTime {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
.img {
|
||||||
|
margin-right: 4px;
|
||||||
|
width: 13px;
|
||||||
|
height: 14.5px;
|
||||||
|
background-image: url(../../assets/image/liveboradcast/time.png);
|
||||||
|
}
|
||||||
|
.time {
|
||||||
|
margin-top: 2px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 12px;
|
||||||
|
// line-height: 15.5px;
|
||||||
|
// height: 16.5px;
|
||||||
|
color: #6e7b84;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.preNext {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 2px;
|
||||||
|
display: flex;
|
||||||
|
.sameone {
|
||||||
|
width: 12px;
|
||||||
|
// border: 0;
|
||||||
|
height: 12px;
|
||||||
|
// background-color: #fff;
|
||||||
|
}
|
||||||
|
.sametwo {
|
||||||
|
color: #2478ff;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 12px;
|
||||||
|
height: 12px;
|
||||||
|
}
|
||||||
|
.pre {
|
||||||
|
background-image: url(../../assets/image/liveboradcast/pre.png);
|
||||||
|
}
|
||||||
|
.next {
|
||||||
|
background-image: url(../../assets/image/liveboradcast/next.png);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.titleblue {
|
||||||
|
margin-top: 18.5px;
|
||||||
|
color: #4a9cf8;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.buttoncontainer {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: right;
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-bottom: 21.5px;
|
||||||
|
.btn {
|
||||||
|
width: 83px;
|
||||||
|
height: 33px;
|
||||||
|
background-color: #2478ff;
|
||||||
|
color: #fff;
|
||||||
|
border: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
.previewbox {
|
||||||
|
width: 90%;
|
||||||
|
// height: 200px;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 4px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.previewmani {
|
||||||
|
width: 90%;
|
||||||
|
margin-top: 17px;
|
||||||
|
|
||||||
|
.discusstitle {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 15px;
|
||||||
|
background-color: #f9f9f9;
|
||||||
|
// height: 20px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.titcon {
|
||||||
|
margin-top: 11px;
|
||||||
|
width: 95%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.maint {
|
||||||
|
color: #333330;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
width: 75%;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
.intime {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 2px;
|
||||||
|
.yuna {
|
||||||
|
margin-top: 4px;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 1px solid #0060ff;
|
||||||
|
}
|
||||||
|
.in {
|
||||||
|
margin-left: 3px;
|
||||||
|
color: #0060ff;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.alltalkcontainer {
|
||||||
|
width: 100%;
|
||||||
|
// background-color: #bfa;
|
||||||
|
margin-top: 20px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.inne {
|
||||||
|
width: 95%;
|
||||||
|
.takltitle {
|
||||||
|
color: #04243c;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
.taklcon {
|
||||||
|
color: #333330;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 24px;
|
||||||
|
}
|
||||||
|
.bottombox {
|
||||||
|
margin-top: 21px;
|
||||||
|
margin-bottom: 24.5px;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
background-color: #fbfbfb;
|
||||||
|
.dianzan {
|
||||||
|
width: 50%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.sa {
|
||||||
|
color: #b3bdc4;
|
||||||
|
font-size: 13px;
|
||||||
|
margin-top: 7px;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.restore {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
.restorebox {
|
||||||
|
width: 90%;
|
||||||
|
// height: 200px;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 4px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.restoremani {
|
||||||
|
width: 90%;
|
||||||
|
margin-top: 17px;
|
||||||
|
position: relative;
|
||||||
|
.rescon {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
// height: 100px;
|
||||||
|
// background-color: #bfa;
|
||||||
|
.head {
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
.headavator {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.namehead {
|
||||||
|
margin-left: 5px;
|
||||||
|
color: #02172a;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 36px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.inner {
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-left: 36px;
|
||||||
|
.allimg {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.reavator {
|
||||||
|
width: 82px;
|
||||||
|
height: 82px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.recon {
|
||||||
|
margin-top: 14.5px;
|
||||||
|
color: #5f6d75;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 18px;
|
||||||
|
}
|
||||||
|
.botto {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 20px;
|
||||||
|
position: relative;
|
||||||
|
.time {
|
||||||
|
color: #5f6d75;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-right: 16.5px;
|
||||||
|
}
|
||||||
|
.re {
|
||||||
|
color: #00152a;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-top: -2px;
|
||||||
|
}
|
||||||
|
.right {
|
||||||
|
display: flex;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
.good {
|
||||||
|
margin-top: -2px;
|
||||||
|
}
|
||||||
|
.gocount {
|
||||||
|
color: #4e5e67;
|
||||||
|
font-size: 13px;
|
||||||
|
margin-left: 6.5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.newre {
|
||||||
|
margin-top: 7.5px;
|
||||||
|
.tri {
|
||||||
|
margin-left: 80px;
|
||||||
|
height: 0px;
|
||||||
|
width: 0px;
|
||||||
|
border-bottom: 10px solid #f0f3f6;
|
||||||
|
border-left: 10px solid transparent;
|
||||||
|
border-right: 10px solid transparent;
|
||||||
|
}
|
||||||
|
.rec {
|
||||||
|
background-color: #f0f3f6;
|
||||||
|
border-radius: 13px;
|
||||||
|
width: 100%;
|
||||||
|
.it {
|
||||||
|
margin-left: 12.5px;
|
||||||
|
width: 92%;
|
||||||
|
display: flex;
|
||||||
|
margin-top: 20px;
|
||||||
|
// margin-bottom: 20px;
|
||||||
|
.ava {
|
||||||
|
// margin-top: 20px;
|
||||||
|
.avainner {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.redetail {
|
||||||
|
margin-left: 12.5px;
|
||||||
|
.rename {
|
||||||
|
color: #02172a;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.rein {
|
||||||
|
color: #5f6d75;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-top: 16.5px;
|
||||||
|
}
|
||||||
|
.detre {
|
||||||
|
margin-top: 10px;
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
.day {
|
||||||
|
color: #5f6d75;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-right: 14px;
|
||||||
|
}
|
||||||
|
.huifu {
|
||||||
|
color: #00152a;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.good {
|
||||||
|
position: absolute;
|
||||||
|
right: 2px;
|
||||||
|
display: flex;
|
||||||
|
.gimg {
|
||||||
|
width: 14px;
|
||||||
|
height: 15px;
|
||||||
|
}
|
||||||
|
.gcou {
|
||||||
|
color: #4e5e67;
|
||||||
|
font-size: 13px;
|
||||||
|
margin-top: 2px;
|
||||||
|
margin-left: 7px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.line {
|
||||||
|
// margin-top: 24.5px;
|
||||||
|
margin-left: -45px;
|
||||||
|
height: 0;
|
||||||
|
width: 117%;
|
||||||
|
border-top: 1px solid #dcdedf;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btncon {
|
||||||
|
width: 100%;
|
||||||
|
height: 60px;
|
||||||
|
position: relative;
|
||||||
|
.btnn {
|
||||||
|
margin-top: 30px;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, 0);
|
||||||
|
border: 0;
|
||||||
|
background-color: #fff;
|
||||||
|
color: #5f6d75;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
408
src/views/discuss/DiscussPage.vue
Normal file
408
src/views/discuss/DiscussPage.vue
Normal file
@@ -0,0 +1,408 @@
|
|||||||
|
<template>
|
||||||
|
<div class="discusspage">
|
||||||
|
<TitleHead text="【直播】管理者进阶腾飞班 - 毕业典礼"></TitleHead>
|
||||||
|
<div class="main">
|
||||||
|
<div class="title">
|
||||||
|
<div class="inner clearfix">
|
||||||
|
<!-- 时间 pre next 外部盒子-->
|
||||||
|
<div class="titlemain clearfix">
|
||||||
|
<!-- <div class="imgTime clearfix">
|
||||||
|
<div class="img"></div>
|
||||||
|
<div class="time">2022-07-20 20:00-21:00</div>
|
||||||
|
</div> -->
|
||||||
|
<div class="preNext clearfix">
|
||||||
|
<div class="sameone pre" style="margin-right: 5px"></div>
|
||||||
|
<div class="sametwo">上一个</div>
|
||||||
|
<div class="sametwo" style="margin-left: 15.5px">下一个</div>
|
||||||
|
<div class="sameone next" style="margin-left: 5px"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="titleblue">
|
||||||
|
请基于公司的战略方向和你所负责的组织的业务发展，识别3-5个你和你的团队在未来2-3年的新的能力与技能要求
|
||||||
|
</div>
|
||||||
|
<div class="buttoncontainer">
|
||||||
|
<button class="btn">发表帖子</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preview">
|
||||||
|
<div class="previewbox">
|
||||||
|
<div class="previewmani">
|
||||||
|
<div class="firstbtncontainer">
|
||||||
|
<!-- <button class="samebtn new">最新</button>
|
||||||
|
<button class="samebtn hot">最热</button> -->
|
||||||
|
<button
|
||||||
|
@click="changee"
|
||||||
|
:class="onfo ? 'new samebtn' : 'samebtn hot'"
|
||||||
|
>
|
||||||
|
最新
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
@click="changeee"
|
||||||
|
:class="onfo ? 'samebtn hot' : 'new samebtn'"
|
||||||
|
>
|
||||||
|
最热
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="discusstitle clearfix">
|
||||||
|
<div class="titcon">
|
||||||
|
<div class="maint">第二讲：模块化产品展示：班内成员讨论</div>
|
||||||
|
<div class="intime">
|
||||||
|
<div class="yuna"></div>
|
||||||
|
<div class="in">进行中</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="discusscontainer clearfix">
|
||||||
|
<div class="item" v-for="(item, index) in discuss" :key="index">
|
||||||
|
<div class="tit">{{ item.title }}</div>
|
||||||
|
<div class="inn">{{ item.contain }}</div>
|
||||||
|
<div class="tim">{{ item.time }}</div>
|
||||||
|
<div class="dian clearfix">
|
||||||
|
<div class="diancon">
|
||||||
|
<div class="one">
|
||||||
|
<div>
|
||||||
|
<img
|
||||||
|
class="samt"
|
||||||
|
src="../../assets/image/discuss/pinglun.png"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span class="a">{{ item.pinglun }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="one">
|
||||||
|
<div>
|
||||||
|
<img
|
||||||
|
class="samt"
|
||||||
|
src="../../assets/image/discuss/dianzan.png"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span class="a">{{ item.dianzan }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="one">
|
||||||
|
<div>
|
||||||
|
<img
|
||||||
|
class="samt"
|
||||||
|
src="../../assets/image/discuss/shoucang.png"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span class="a">{{ item.shoucang }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { reactive, toRefs } from "vue";
|
||||||
|
import TitleHead from "@/components/TitleHead.vue";
|
||||||
|
export default {
|
||||||
|
name: "DiscussPage",
|
||||||
|
components: {
|
||||||
|
TitleHead,
|
||||||
|
},
|
||||||
|
setup() {
|
||||||
|
const state = reactive({
|
||||||
|
onfo: true,
|
||||||
|
discuss: [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
title: "从营销角度分析：我的团队需要这些能力",
|
||||||
|
contain:
|
||||||
|
"所谓团队协作能力，是指建立在团队的基础之上，发挥团队精神、互补互助以达到团队最大工作效率的能力。对于团队的成员来说...",
|
||||||
|
time: "2022-7-20 00:00",
|
||||||
|
pinglun: 317,
|
||||||
|
dianzan: 103,
|
||||||
|
shoucang: 103,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
title: "从营销角度分析：我的团队需要这些能力",
|
||||||
|
contain:
|
||||||
|
"所谓团队协作能力，是指建立在团队的基础之上，发挥团队精神、互补互助以达到团队最大工作效率的能力。对于团队的成员来说...",
|
||||||
|
time: "2022-7-20 00:00",
|
||||||
|
pinglun: 317,
|
||||||
|
dianzan: 103,
|
||||||
|
shoucang: 103,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
title: "从营销角度分析：我的团队需要这些能力",
|
||||||
|
contain:
|
||||||
|
"所谓团队协作能力，是指建立在团队的基础之上，发挥团队精神、互补互助以达到团队最大工作效率的能力。对于团队的成员来说...",
|
||||||
|
time: "2022-7-20 00:00",
|
||||||
|
pinglun: 317,
|
||||||
|
dianzan: 103,
|
||||||
|
shoucang: 103,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
const changee = () => {
|
||||||
|
if (state.onfo !== true) {
|
||||||
|
state.onfo = !state.onfo;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const changeee = () => {
|
||||||
|
if (state.onfo == true) {
|
||||||
|
state.onfo = !state.onfo;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
return {
|
||||||
|
...toRefs(state),
|
||||||
|
changee,
|
||||||
|
changeee,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
<style lang="scss">
|
||||||
|
.clearfix:before,
|
||||||
|
.clearfix:after {
|
||||||
|
content: " ";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
.discusspage {
|
||||||
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
.main {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: -14.5px;
|
||||||
|
position: relative;
|
||||||
|
.title {
|
||||||
|
width: 90%;
|
||||||
|
// height: 109px;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
width: 90%;
|
||||||
|
.titlemain {
|
||||||
|
width: 100%;
|
||||||
|
// display: flex;
|
||||||
|
margin-top: 18.5px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
height: 18px;
|
||||||
|
.imgTime {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
.img {
|
||||||
|
margin-right: 4px;
|
||||||
|
width: 13px;
|
||||||
|
height: 14.5px;
|
||||||
|
background-image: url(../../assets/image/liveboradcast/time.png);
|
||||||
|
}
|
||||||
|
.time {
|
||||||
|
margin-top: 2px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 12px;
|
||||||
|
// line-height: 15.5px;
|
||||||
|
// height: 16.5px;
|
||||||
|
color: #6e7b84;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.preNext {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 2px;
|
||||||
|
display: flex;
|
||||||
|
.sameone {
|
||||||
|
width: 12px;
|
||||||
|
// border: 0;
|
||||||
|
height: 12px;
|
||||||
|
// background-color: #fff;
|
||||||
|
}
|
||||||
|
.sametwo {
|
||||||
|
color: #2478ff;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 12px;
|
||||||
|
height: 12px;
|
||||||
|
}
|
||||||
|
.pre {
|
||||||
|
background-image: url(../../assets/image/liveboradcast/pre.png);
|
||||||
|
}
|
||||||
|
.next {
|
||||||
|
background-image: url(../../assets/image/liveboradcast/next.png);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.titleblue {
|
||||||
|
margin-top: 18.5px;
|
||||||
|
color: #4a9cf8;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.buttoncontainer {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: right;
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-bottom: 21.5px;
|
||||||
|
.btn {
|
||||||
|
width: 83px;
|
||||||
|
height: 33px;
|
||||||
|
background-color: #2478ff;
|
||||||
|
color: #fff;
|
||||||
|
border: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
.previewbox {
|
||||||
|
width: 90%;
|
||||||
|
// height: 200px;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 4px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.previewmani {
|
||||||
|
width: 90%;
|
||||||
|
margin-top: 17px;
|
||||||
|
.firstbtncontainer {
|
||||||
|
width: 100%;
|
||||||
|
.samebtn {
|
||||||
|
width: 42.5px;
|
||||||
|
height: 23px;
|
||||||
|
font-size: 13px;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
.new {
|
||||||
|
color: #fff;
|
||||||
|
background-color: #387df7;
|
||||||
|
// margin-right: 10px;
|
||||||
|
}
|
||||||
|
.hot {
|
||||||
|
color: #6e7b84;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.discusstitle {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 15px;
|
||||||
|
background-color: #f9f9f9;
|
||||||
|
// height: 20px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.titcon {
|
||||||
|
margin-top: 11px;
|
||||||
|
width: 95%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.maint {
|
||||||
|
color: #333330;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
width: 75%;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
.intime {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 2px;
|
||||||
|
.yuna {
|
||||||
|
margin-top: 4px;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 1px solid #0060ff;
|
||||||
|
}
|
||||||
|
.in {
|
||||||
|
margin-left: 3px;
|
||||||
|
color: #0060ff;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.discusscontainer {
|
||||||
|
padding-bottom: 20px;
|
||||||
|
width: 100%;
|
||||||
|
.item {
|
||||||
|
position: relative;
|
||||||
|
.tit {
|
||||||
|
margin-top: 18px;
|
||||||
|
color: #04243c;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 14px;
|
||||||
|
// line-height: 24px;
|
||||||
|
}
|
||||||
|
.inn {
|
||||||
|
margin-top: 11px;
|
||||||
|
color: #6e7b84;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 24px;
|
||||||
|
}
|
||||||
|
.tim {
|
||||||
|
color: #b3bdc4;
|
||||||
|
font-size: 12px;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 42px;
|
||||||
|
}
|
||||||
|
.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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
273
src/views/examination/Examination.vue
Normal file
273
src/views/examination/Examination.vue
Normal file
@@ -0,0 +1,273 @@
|
|||||||
|
<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>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// import { reactive, toRefs } from "vue";
|
||||||
|
import TitleHead from "@/components/TitleHead.vue";
|
||||||
|
export default {
|
||||||
|
name: "ExamiNation",
|
||||||
|
components: {
|
||||||
|
TitleHead,
|
||||||
|
},
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.clearfix:before,
|
||||||
|
.clearfix:after {
|
||||||
|
content: " ";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.examination {
|
||||||
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.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;
|
||||||
|
.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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
114
src/views/examination/ExaminationScore.vue
Normal file
114
src/views/examination/ExaminationScore.vue
Normal file
@@ -0,0 +1,114 @@
|
|||||||
|
<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>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// import { reactive, toRefs } from "vue";
|
||||||
|
import TitleHead from "@/components/TitleHead.vue";
|
||||||
|
export default {
|
||||||
|
name: "ExaminationScore",
|
||||||
|
components: {
|
||||||
|
TitleHead,
|
||||||
|
},
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.examinationscore {
|
||||||
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.notice {
|
||||||
|
width: 100%;
|
||||||
|
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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
201
src/views/examination/ReadyExamination.vue
Normal file
201
src/views/examination/ReadyExamination.vue
Normal file
@@ -0,0 +1,201 @@
|
|||||||
|
<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>
|
||||||
|
<div class="questiontype clearfix">
|
||||||
|
<div class="type">判断题</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>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// import { reactive, toRefs } from "vue";
|
||||||
|
import TitleHead from "@/components/TitleHead.vue";
|
||||||
|
export default {
|
||||||
|
name: "ReadyExamination",
|
||||||
|
components: {
|
||||||
|
TitleHead,
|
||||||
|
},
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.clearfix:before,
|
||||||
|
.clearfix:after {
|
||||||
|
content: " ";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.readyexamination {
|
||||||
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -27,6 +27,127 @@
|
|||||||
<div class="titlebtn">评估</div>
|
<div class="titlebtn">评估</div>
|
||||||
</div>
|
</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>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -110,10 +231,12 @@ export default {
|
|||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.faceteach {
|
.faceteach {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
.main {
|
.main {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
margin-top: -14.5px;
|
margin-top: -14.5px;
|
||||||
.title {
|
.title {
|
||||||
width: 90%;
|
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>
|
</style>
|
||||||
|
|||||||
@@ -215,12 +215,12 @@ export default {
|
|||||||
}
|
}
|
||||||
.homeworkpage {
|
.homeworkpage {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
.notice {
|
.notice {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin-top: 10px;
|
margin-top: -17.5px;
|
||||||
.noticebox {
|
.noticebox {
|
||||||
width: 90%;
|
width: 90%;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
|||||||
@@ -189,12 +189,12 @@ export default {
|
|||||||
}
|
}
|
||||||
.Investigat {
|
.Investigat {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
.notice {
|
.notice {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin-top: 10px;
|
margin-top: -17.5px;
|
||||||
.noticebox {
|
.noticebox {
|
||||||
width: 90%;
|
width: 90%;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
|||||||
@@ -141,6 +141,7 @@ export default {
|
|||||||
}
|
}
|
||||||
.liveboradcast {
|
.liveboradcast {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
padding-bottom: 20px;
|
||||||
.main {
|
.main {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
Reference in New Issue
Block a user