mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-17 23:06:47 +08:00
feat:新增学习路径关卡的概览有无数据
This commit is contained in:
dongwug
@@ -44,7 +44,170 @@
|
|||||||
size="large"
|
size="large"
|
||||||
:tabBarStyle="{ marginLeft: '10px' }"
|
:tabBarStyle="{ marginLeft: '10px' }"
|
||||||
>
|
>
|
||||||
<a-tab-pane key="1" tab="路径管理">
|
<a-tab-pane key="1" tab="概览">
|
||||||
|
<div class="split"></div>
|
||||||
|
<!-- 概览（无数据） -->
|
||||||
|
<div :style="{display: nodata ? 'block' : 'none'}">
|
||||||
|
<div class="onerow">
|
||||||
|
<div class="taskmain">快速创建项目详情</div>
|
||||||
|
</div>
|
||||||
|
<div class="second">
|
||||||
|
<div
|
||||||
|
class="taskbox"
|
||||||
|
style="background: linear-gradient(180deg, #fef3dd, #fffaf0)"
|
||||||
|
>
|
||||||
|
<div class="leftt">
|
||||||
|
<img src="../../assets/images/taskpage/left1.png" />
|
||||||
|
</div>
|
||||||
|
<div class="photo">
|
||||||
|
<img src="../../assets/images/taskpage/picture1.png" />
|
||||||
|
</div>
|
||||||
|
<div class="rightt">
|
||||||
|
<img src="../../assets/images/taskpage/right1.png" />
|
||||||
|
</div>
|
||||||
|
<div class="centerbox" style="color: rgba(255, 182, 78, 1)">
|
||||||
|
添加任务
|
||||||
|
</div>
|
||||||
|
<div class="centermain">快速添加任务/阶段</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="taskbox"
|
||||||
|
style="background: linear-gradient(180deg, #ddeaff, #f0f8fe)"
|
||||||
|
>
|
||||||
|
<div class="leftt">
|
||||||
|
<img src="../../assets/images/taskpage/left2.png" />
|
||||||
|
</div>
|
||||||
|
<div class="photo">
|
||||||
|
<img src="../../assets/images/taskpage/picture2.png" />
|
||||||
|
</div>
|
||||||
|
<div class="rightt">
|
||||||
|
<img src="../../assets/images/taskpage/right2.png" />
|
||||||
|
</div>
|
||||||
|
<div class="centerbox" style="color: rgba(78, 166, 255, 1)">
|
||||||
|
添加学员
|
||||||
|
</div>
|
||||||
|
<div class="centermain">快速添加学员</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="taskbox"
|
||||||
|
@click="showModal"
|
||||||
|
style="background: linear-gradient(180deg, #e5f6ec, #eef9f3)"
|
||||||
|
>
|
||||||
|
<div class="leftt">
|
||||||
|
<img src="../../assets/images/taskpage/left3.png" />
|
||||||
|
</div>
|
||||||
|
<div class="photo">
|
||||||
|
<img src="../../assets/images/taskpage/picture3.png" />
|
||||||
|
</div>
|
||||||
|
<div class="rightt">
|
||||||
|
<img src="../../assets/images/taskpage/right3.png" />
|
||||||
|
</div>
|
||||||
|
<div class="centerbox" style="color: rgba(93, 201, 136, 1)">
|
||||||
|
发布
|
||||||
|
</div>
|
||||||
|
<div class="centermain">快速发布项目</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 概览（无数据） -->
|
||||||
|
<!-- 概览（有数据） -->
|
||||||
|
<div :style="{display: nodata ? 'none' : 'block'}">
|
||||||
|
<div class="onerow"><div class="taskmain">项目概览</div></div>
|
||||||
|
<div class="second" style="margin-top: 0">
|
||||||
|
<div class="nubbox">
|
||||||
|
<span class="nub1">200</span>
|
||||||
|
<div class="nub2">总人数</div>
|
||||||
|
</div>
|
||||||
|
<div class="nubbox">
|
||||||
|
<span class="nub1" style="color: #ff90ae">15</span>
|
||||||
|
<div class="nub2">必修课</div>
|
||||||
|
</div>
|
||||||
|
<div class="nubbox">
|
||||||
|
<span class="nub1" style="color: #a497ff">15</span>
|
||||||
|
<div class="nub2">选修课</div>
|
||||||
|
</div>
|
||||||
|
<div class="nubbox">
|
||||||
|
<div>
|
||||||
|
<span class="nub1" style="color: #5dc988">50</span
|
||||||
|
><span style="color: #5dc988; font-size: 14px">%</span>
|
||||||
|
</div>
|
||||||
|
<div class="nub2">完成率</div>
|
||||||
|
</div>
|
||||||
|
<div class="nubbox">
|
||||||
|
<div>
|
||||||
|
<span class="nub1" style="color: #ff90ae">30</span
|
||||||
|
><span style="color: #ff90ae; font-size: 14px">%</span>
|
||||||
|
</div>
|
||||||
|
<div class="nub2">必修完成率</div>
|
||||||
|
</div>
|
||||||
|
<div class="nubbox">
|
||||||
|
<div>
|
||||||
|
<span class="nub1" style="color: #a497ff">30</span
|
||||||
|
><span style="color: #a497ff; font-size: 14px">%</span>
|
||||||
|
</div>
|
||||||
|
<div class="nub2">选修完成率</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="onerow"><div class="taskmain">阶段信息</div></div>
|
||||||
|
<div class="stagemess">
|
||||||
|
<div class="stage1">阶段1</div>
|
||||||
|
<div class="stage2">阶段2</div>
|
||||||
|
</div>
|
||||||
|
<div class="stagesecond">
|
||||||
|
<div class="staname">阶段名称：</div>
|
||||||
|
<div class="stamess">管理者进阶-腾飞班1第一阶段</div>
|
||||||
|
</div>
|
||||||
|
<div class="stagelast">
|
||||||
|
<div class="stagepro">
|
||||||
|
<a-progress
|
||||||
|
type="dashboard"
|
||||||
|
gapDegree="0"
|
||||||
|
:percent="50"
|
||||||
|
:width="140"
|
||||||
|
/>
|
||||||
|
<div class="protext">课程完成率</div>
|
||||||
|
</div>
|
||||||
|
<div class="stagepro">
|
||||||
|
<a-progress
|
||||||
|
type="dashboard"
|
||||||
|
gapDegree="0"
|
||||||
|
:percent="50"
|
||||||
|
:width="140"
|
||||||
|
/>
|
||||||
|
<div class="protext">考试通过率</div>
|
||||||
|
</div>
|
||||||
|
<div class="stagepro" style="margin-right: 0">
|
||||||
|
<a-progress
|
||||||
|
type="dashboard"
|
||||||
|
gapDegree="0"
|
||||||
|
:percent="50"
|
||||||
|
:width="140"
|
||||||
|
/>
|
||||||
|
<div class="protext">作业合格率</div>
|
||||||
|
</div>
|
||||||
|
<div class="proright">
|
||||||
|
<div class="pronub" style="margin-left: 280px">10</div>
|
||||||
|
<div class="proright1">
|
||||||
|
<span class="textpro">阶段任务总数</span>
|
||||||
|
<a-progress :percent="50" style="width: 369px" />
|
||||||
|
</div>
|
||||||
|
<div class="pronub" style="margin-left: 206px">5</div>
|
||||||
|
<div class="proright1">
|
||||||
|
<span class="textpro">必修课</span>
|
||||||
|
<a-progress :percent="25" style="width: 369px" />
|
||||||
|
</div>
|
||||||
|
<div class="pronub" style="margin-left: 142px">1</div>
|
||||||
|
<div class="proright1">
|
||||||
|
<span class="textpro">选修课</span>
|
||||||
|
<a-progress :percent="5" style="width: 369px" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 概览（有数据） -->
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="2" tab="路径管理">
|
||||||
|
<div class="split"></div>
|
||||||
<div class="cont">
|
<div class="cont">
|
||||||
<div class="pad"></div>
|
<div class="pad"></div>
|
||||||
<div class="sametab">
|
<div class="sametab">
|
||||||
@@ -168,7 +331,8 @@
|
|||||||
<div class="pad"></div>
|
<div class="pad"></div>
|
||||||
</div>
|
</div>
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane key="2" tab="学员管理" force-render>
|
<a-tab-pane key="3" tab="学员管理" force-render>
|
||||||
|
<div class="split"></div>
|
||||||
<div class="xwid">
|
<div class="xwid">
|
||||||
<div class="pad"></div>
|
<div class="pad"></div>
|
||||||
<div class="xin" style="overflow-x: auto">
|
<div class="xin" style="overflow-x: auto">
|
||||||
@@ -249,8 +413,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="pad"></div></div
|
<div class="pad"></div></div
|
||||||
></a-tab-pane>
|
></a-tab-pane>
|
||||||
|
<a-tab-pane key="4" tab="设置">
|
||||||
<a-tab-pane key="3" tab="设置">
|
<div class="split"></div>
|
||||||
<div class="sametab">
|
<div class="sametab">
|
||||||
<div class="Gcon">
|
<div class="Gcon">
|
||||||
<div class="pad"></div>
|
<div class="pad"></div>
|
||||||
@@ -550,6 +714,7 @@ export default {
|
|||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
visible: false,
|
visible: false,
|
||||||
sh: false,
|
sh: false,
|
||||||
|
nodata: true,
|
||||||
closeDeleteAll: false,
|
closeDeleteAll: false,
|
||||||
curLevel: "",
|
curLevel: "",
|
||||||
//关卡的数据
|
//关卡的数据
|
||||||
@@ -1041,7 +1206,6 @@ export default {
|
|||||||
.addwrapper {
|
.addwrapper {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
// background-color: green;
|
|
||||||
.addhead {
|
.addhead {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 130px;
|
height: 130px;
|
||||||
@@ -1198,6 +1362,491 @@ export default {
|
|||||||
margin-left: 0px !important;
|
margin-left: 0px !important;
|
||||||
padding-left: 32px !important;
|
padding-left: 32px !important;
|
||||||
}
|
}
|
||||||
|
.onerow {
|
||||||
|
//width: 100%;
|
||||||
|
display: flex;
|
||||||
|
height: 40px;
|
||||||
|
position: relative;
|
||||||
|
margin-top: 15px;
|
||||||
|
margin-left: 38px;
|
||||||
|
//margin-right: 38px;
|
||||||
|
.taskmain {
|
||||||
|
font-size: 18px;
|
||||||
|
padding-top: 7px;
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
.btn {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 168px;
|
||||||
|
background-color: #409eff;
|
||||||
|
width: 130px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid #409eff;
|
||||||
|
color: #ffffff;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.edit {
|
||||||
|
position: absolute;
|
||||||
|
right: 38px;
|
||||||
|
top: 0;
|
||||||
|
color: #409eff;
|
||||||
|
width: 100px;
|
||||||
|
height: 40px;
|
||||||
|
border: 1px solid #409eff;
|
||||||
|
border-radius: 8px;
|
||||||
|
.editimg {
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
margin-top: -2px;
|
||||||
|
margin-left: 25px;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
.editext {
|
||||||
|
line-height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.edit:hover {
|
||||||
|
color: #ffffff;
|
||||||
|
background-color: #409eff;
|
||||||
|
cursor: pointer;
|
||||||
|
.editimg {
|
||||||
|
background-image: url("../../assets/images/projectadd/edit1.png");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.second {
|
||||||
|
display: flex;
|
||||||
|
justify-content: left;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
margin-top: 40px;
|
||||||
|
margin-left: 20px;
|
||||||
|
.nubbox {
|
||||||
|
width: 253px;
|
||||||
|
height: 116px;
|
||||||
|
margin-top: 20px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
background: #fafbfc;
|
||||||
|
border-radius: 10px;
|
||||||
|
margin-left: 15px;
|
||||||
|
.nub1 {
|
||||||
|
color: #ffb54a;
|
||||||
|
font-size: 30px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.nub2 {
|
||||||
|
color: #6d7584;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.taskbox {
|
||||||
|
width: 412px;
|
||||||
|
height: 160px;
|
||||||
|
border-radius: 10px;
|
||||||
|
position: relative;
|
||||||
|
margin-left: 68px;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
cursor: pointer;
|
||||||
|
.leftt {
|
||||||
|
position: absolute;
|
||||||
|
top: 18px;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
.photo {
|
||||||
|
position: absolute;
|
||||||
|
top: 42px;
|
||||||
|
left: 37px;
|
||||||
|
}
|
||||||
|
.rightt {
|
||||||
|
position: absolute;
|
||||||
|
top: 69px;
|
||||||
|
right: 26px;
|
||||||
|
}
|
||||||
|
.centerbox {
|
||||||
|
position: absolute;
|
||||||
|
top: 52px;
|
||||||
|
left: 145px;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 700;
|
||||||
|
//line-height: 36px;
|
||||||
|
}
|
||||||
|
.centermain {
|
||||||
|
color: rgba(135, 139, 146, 1);
|
||||||
|
font-size: 14px;
|
||||||
|
position: absolute;
|
||||||
|
left: 144px;
|
||||||
|
bottom: 49px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.stagemess {
|
||||||
|
display: flex;
|
||||||
|
margin-left: 38px;
|
||||||
|
.stage1 {
|
||||||
|
width: 100px;
|
||||||
|
height: 33px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 34px;
|
||||||
|
border-radius: 6px;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 16px;
|
||||||
|
background: #4ea6ff;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-top: 19px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.stage2 {
|
||||||
|
width: 100px;
|
||||||
|
height: 33px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 34px;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 1px solid #ebeef3;
|
||||||
|
color: #000000;
|
||||||
|
font-size: 16px;
|
||||||
|
background: #ffffff;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-top: 19px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.stagesecond {
|
||||||
|
display: flex;
|
||||||
|
margin-left: 39px;
|
||||||
|
margin-top: 29px;
|
||||||
|
.staname {
|
||||||
|
color: #999ba3;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.stamess {
|
||||||
|
color: #4f5156;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.stagelast {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: center;
|
||||||
|
margin-bottom: 55px;
|
||||||
|
.stagepro {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 55px;
|
||||||
|
margin-right: 120px;
|
||||||
|
.ant-progress-circle-path {
|
||||||
|
stroke: #4ea6ff;
|
||||||
|
}
|
||||||
|
.ant-progress-text {
|
||||||
|
color: #4ea6ff;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.protext {
|
||||||
|
color: #6d7584;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-top: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.proright {
|
||||||
|
width: 500px;
|
||||||
|
margin-top: 55px;
|
||||||
|
margin-left: 50px;
|
||||||
|
.ant-progress-bg {
|
||||||
|
height: 24px !important;
|
||||||
|
background: #4ea6ff;
|
||||||
|
}
|
||||||
|
.ant-progress-inner {
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
.pronub {
|
||||||
|
color: #4ea6ff;
|
||||||
|
font-size: 14px;
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
.proright1 {
|
||||||
|
display: flex;
|
||||||
|
justify-content: right;
|
||||||
|
.textpro {
|
||||||
|
color: #6d7584;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
.ant-progress-text {
|
||||||
|
color: #4ea6ff;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.sametab {
|
||||||
|
// margin-left: 30px;
|
||||||
|
// margin-right: 30px;
|
||||||
|
margin-top: 30px;
|
||||||
|
width: 100%;
|
||||||
|
// background-color: green;
|
||||||
|
.Lhead {
|
||||||
|
display: flex;
|
||||||
|
.btns {
|
||||||
|
display: flex;
|
||||||
|
margin-left: 20px;
|
||||||
|
// flex-wrap: wrap;
|
||||||
|
.btn {
|
||||||
|
padding: 0px 26px 0px 26px;
|
||||||
|
height: 38px;
|
||||||
|
background: rgba(64, 158, 255, 0);
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid rgba(64, 158, 255, 1);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-right: 14px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
.search {
|
||||||
|
background-size: 100%;
|
||||||
|
}
|
||||||
|
.btnText {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: rgba(64, 158, 255, 1);
|
||||||
|
line-height: 36px;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn1 {
|
||||||
|
.search {
|
||||||
|
width: 15px;
|
||||||
|
height: 17px;
|
||||||
|
background-image: url("../../assets/images/courseManage/search1.png");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn2 {
|
||||||
|
.search {
|
||||||
|
width: 16px;
|
||||||
|
height: 18px;
|
||||||
|
background-image: url("../../assets/images/courseManage/reset1.png");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn3 {
|
||||||
|
margin-right: 0px;
|
||||||
|
.search {
|
||||||
|
width: 17px;
|
||||||
|
height: 18px;
|
||||||
|
background-image: url("../../assets/images/courseManage/add1.png");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn1:hover {
|
||||||
|
background: rgba(64, 158, 255, 1);
|
||||||
|
.search {
|
||||||
|
background-image: url("../../assets/images/courseManage/search0.png");
|
||||||
|
}
|
||||||
|
.btnText {
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn2:hover {
|
||||||
|
background: rgba(64, 158, 255, 1);
|
||||||
|
.search {
|
||||||
|
background-image: url("../../assets/images/courseManage/reset0.png");
|
||||||
|
}
|
||||||
|
.btnText {
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn3:hover {
|
||||||
|
background: rgba(64, 158, 255, 1);
|
||||||
|
.search {
|
||||||
|
background-image: url("../../assets/images/courseManage/add0.png");
|
||||||
|
}
|
||||||
|
.btnText {
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.Lbom {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
.item {
|
||||||
|
width: 100%;
|
||||||
|
height: 200px;
|
||||||
|
// background-color: green;
|
||||||
|
margin-top: 40px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid #f0f4fe;
|
||||||
|
.itemhead {
|
||||||
|
height: 50px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #f0f4fe;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
position: relative;
|
||||||
|
.lev {
|
||||||
|
margin-left: 27px;
|
||||||
|
margin-right: 16px;
|
||||||
|
line-height: 100%;
|
||||||
|
color: #409eff;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.lin {
|
||||||
|
width: 1px;
|
||||||
|
height: 35%;
|
||||||
|
background-color: #c7cbd2;
|
||||||
|
}
|
||||||
|
.nam {
|
||||||
|
margin-left: 16px;
|
||||||
|
color: #4f5156;
|
||||||
|
line-height: 100%;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.count {
|
||||||
|
position: absolute;
|
||||||
|
line-height: 100%;
|
||||||
|
color: #4f5156;
|
||||||
|
font-size: 14px;
|
||||||
|
right: 40px;
|
||||||
|
span:nth-child(2) {
|
||||||
|
color: #63ca8c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.itembomm {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 150px;
|
||||||
|
.it {
|
||||||
|
// margin-left: 110px;
|
||||||
|
// margin-right: 110px;
|
||||||
|
width: 13%;
|
||||||
|
text-align: center;
|
||||||
|
.on {
|
||||||
|
font-size: 30px;
|
||||||
|
}
|
||||||
|
.ittext {
|
||||||
|
color: #4f5156;
|
||||||
|
margin-top: 16px;
|
||||||
|
margin-left: -5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.linee {
|
||||||
|
background-color: #ecf2fb;
|
||||||
|
width: 1px;
|
||||||
|
height: 55%;
|
||||||
|
}
|
||||||
|
.itright {
|
||||||
|
position: absolute;
|
||||||
|
right: 45px;
|
||||||
|
display: flex;
|
||||||
|
.te {
|
||||||
|
color: #4ea6ff;
|
||||||
|
font-size: 14px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.more {
|
||||||
|
position: relative;
|
||||||
|
height: 30px;
|
||||||
|
display: flex;
|
||||||
|
.moreArrow {
|
||||||
|
width: 13px;
|
||||||
|
height: 7px;
|
||||||
|
display: inline-block;
|
||||||
|
background-image: url("../../assets/images/navtop/down.png");
|
||||||
|
background-size: 100%;
|
||||||
|
margin: 2px;
|
||||||
|
margin-left: 7px;
|
||||||
|
margin-top: 6px;
|
||||||
|
}
|
||||||
|
.moreItems {
|
||||||
|
width: 80px;
|
||||||
|
height: 70px;
|
||||||
|
display: none;
|
||||||
|
background: #ffffff;
|
||||||
|
box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
|
||||||
|
border-radius: 3px;
|
||||||
|
border: 0px solid #dcdcdc;
|
||||||
|
position: absolute;
|
||||||
|
left: 0px;
|
||||||
|
top: 20px;
|
||||||
|
z-index: 100;
|
||||||
|
.roleItem {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: rgba(79, 81, 86, 1);
|
||||||
|
line-height: 36px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.roleItem:hover {
|
||||||
|
color: #4ea6ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.more:hover .moreArrow {
|
||||||
|
background-image: url("../../assets/images/navtop/up.png");
|
||||||
|
}
|
||||||
|
.more:hover .moreItems {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.show {
|
||||||
|
color: blue;
|
||||||
|
}
|
||||||
|
.noshow {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.create {
|
||||||
|
margin-top: 40px;
|
||||||
|
.taskbox {
|
||||||
|
width: 412px;
|
||||||
|
height: 160px;
|
||||||
|
border-radius: 10px;
|
||||||
|
position: relative;
|
||||||
|
// margin-left: 68px;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
cursor: pointer;
|
||||||
|
.leftt {
|
||||||
|
position: absolute;
|
||||||
|
top: 18px;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
.photo {
|
||||||
|
position: absolute;
|
||||||
|
top: 42px;
|
||||||
|
left: 37px;
|
||||||
|
}
|
||||||
|
.rightt {
|
||||||
|
position: absolute;
|
||||||
|
top: 69px;
|
||||||
|
right: 26px;
|
||||||
|
}
|
||||||
|
.centerbox {
|
||||||
|
position: absolute;
|
||||||
|
top: 52px;
|
||||||
|
left: 145px;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 700;
|
||||||
|
//line-height: 36px;
|
||||||
|
}
|
||||||
|
.centermain {
|
||||||
|
color: rgba(135, 139, 146, 1);
|
||||||
|
font-size: 14px;
|
||||||
|
position: absolute;
|
||||||
|
left: 144px;
|
||||||
|
bottom: 49px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.cont {
|
.cont {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
@@ -1206,270 +1855,6 @@ export default {
|
|||||||
width: 40px;
|
width: 40px;
|
||||||
// background-color: red;
|
// background-color: red;
|
||||||
}
|
}
|
||||||
.sametab {
|
|
||||||
// margin-left: 30px;
|
|
||||||
// margin-right: 30px;
|
|
||||||
margin-top: 30px;
|
|
||||||
width: 100%;
|
|
||||||
// background-color: green;
|
|
||||||
.Lhead {
|
|
||||||
display: flex;
|
|
||||||
.btns {
|
|
||||||
display: flex;
|
|
||||||
margin-left: 20px;
|
|
||||||
// flex-wrap: wrap;
|
|
||||||
.btn {
|
|
||||||
padding: 0px 26px 0px 26px;
|
|
||||||
height: 38px;
|
|
||||||
background: rgba(64, 158, 255, 0);
|
|
||||||
border-radius: 8px;
|
|
||||||
border: 1px solid rgba(64, 158, 255, 1);
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
margin-right: 14px;
|
|
||||||
flex-shrink: 0;
|
|
||||||
cursor: pointer;
|
|
||||||
.search {
|
|
||||||
background-size: 100%;
|
|
||||||
}
|
|
||||||
.btnText {
|
|
||||||
font-size: 14px;
|
|
||||||
font-weight: 400;
|
|
||||||
color: rgba(64, 158, 255, 1);
|
|
||||||
line-height: 36px;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.btn1 {
|
|
||||||
.search {
|
|
||||||
width: 15px;
|
|
||||||
height: 17px;
|
|
||||||
background-image: url("../../assets/images/courseManage/search1.png");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.btn2 {
|
|
||||||
.search {
|
|
||||||
width: 16px;
|
|
||||||
height: 18px;
|
|
||||||
background-image: url("../../assets/images/courseManage/reset1.png");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.btn3 {
|
|
||||||
margin-right: 0px;
|
|
||||||
.search {
|
|
||||||
width: 17px;
|
|
||||||
height: 18px;
|
|
||||||
background-image: url("../../assets/images/courseManage/add1.png");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.btn1:hover {
|
|
||||||
background: rgba(64, 158, 255, 1);
|
|
||||||
.search {
|
|
||||||
background-image: url("../../assets/images/courseManage/search0.png");
|
|
||||||
}
|
|
||||||
.btnText {
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.btn2:hover {
|
|
||||||
background: rgba(64, 158, 255, 1);
|
|
||||||
.search {
|
|
||||||
background-image: url("../../assets/images/courseManage/reset0.png");
|
|
||||||
}
|
|
||||||
.btnText {
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.btn3:hover {
|
|
||||||
background: rgba(64, 158, 255, 1);
|
|
||||||
.search {
|
|
||||||
background-image: url("../../assets/images/courseManage/add0.png");
|
|
||||||
}
|
|
||||||
.btnText {
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.Lbom {
|
|
||||||
position: relative;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
.item {
|
|
||||||
width: 100%;
|
|
||||||
height: 200px;
|
|
||||||
// background-color: green;
|
|
||||||
margin-top: 40px;
|
|
||||||
border-radius: 8px;
|
|
||||||
border: 1px solid #f0f4fe;
|
|
||||||
.itemhead {
|
|
||||||
height: 50px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #f0f4fe;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
position: relative;
|
|
||||||
.lev {
|
|
||||||
margin-left: 27px;
|
|
||||||
margin-right: 16px;
|
|
||||||
line-height: 100%;
|
|
||||||
color: #409eff;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
.lin {
|
|
||||||
width: 1px;
|
|
||||||
height: 35%;
|
|
||||||
background-color: #c7cbd2;
|
|
||||||
}
|
|
||||||
.nam {
|
|
||||||
margin-left: 16px;
|
|
||||||
color: #4f5156;
|
|
||||||
line-height: 100%;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
.count {
|
|
||||||
position: absolute;
|
|
||||||
line-height: 100%;
|
|
||||||
color: #4f5156;
|
|
||||||
font-size: 14px;
|
|
||||||
right: 40px;
|
|
||||||
span:nth-child(2) {
|
|
||||||
color: #63ca8c;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.itembomm {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
height: 150px;
|
|
||||||
.it {
|
|
||||||
// margin-left: 110px;
|
|
||||||
// margin-right: 110px;
|
|
||||||
width: 13%;
|
|
||||||
text-align: center;
|
|
||||||
.on {
|
|
||||||
font-size: 30px;
|
|
||||||
}
|
|
||||||
.ittext {
|
|
||||||
color: #4f5156;
|
|
||||||
margin-top: 16px;
|
|
||||||
margin-left: -5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.linee {
|
|
||||||
background-color: #ecf2fb;
|
|
||||||
width: 1px;
|
|
||||||
height: 55%;
|
|
||||||
}
|
|
||||||
.itright {
|
|
||||||
position: absolute;
|
|
||||||
right: 45px;
|
|
||||||
display: flex;
|
|
||||||
.te {
|
|
||||||
color: #4ea6ff;
|
|
||||||
font-size: 14px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.more {
|
|
||||||
position: relative;
|
|
||||||
height: 30px;
|
|
||||||
display: flex;
|
|
||||||
.moreArrow {
|
|
||||||
width: 13px;
|
|
||||||
height: 7px;
|
|
||||||
display: inline-block;
|
|
||||||
background-image: url("../../assets/images/navtop/down.png");
|
|
||||||
background-size: 100%;
|
|
||||||
margin: 2px;
|
|
||||||
margin-left: 7px;
|
|
||||||
margin-top: 6px;
|
|
||||||
}
|
|
||||||
.moreItems {
|
|
||||||
width: 80px;
|
|
||||||
height: 70px;
|
|
||||||
display: none;
|
|
||||||
background: #ffffff;
|
|
||||||
box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
|
|
||||||
border-radius: 3px;
|
|
||||||
border: 0px solid #dcdcdc;
|
|
||||||
position: absolute;
|
|
||||||
left: 0px;
|
|
||||||
top: 20px;
|
|
||||||
z-index: 100;
|
|
||||||
.roleItem {
|
|
||||||
font-size: 14px;
|
|
||||||
font-weight: 400;
|
|
||||||
color: rgba(79, 81, 86, 1);
|
|
||||||
line-height: 36px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.roleItem:hover {
|
|
||||||
color: #4ea6ff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.more:hover .moreArrow {
|
|
||||||
background-image: url("../../assets/images/navtop/up.png");
|
|
||||||
}
|
|
||||||
.more:hover .moreItems {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.show {
|
|
||||||
color: blue;
|
|
||||||
}
|
|
||||||
.noshow {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.create {
|
|
||||||
margin-top: 40px;
|
|
||||||
.taskbox {
|
|
||||||
width: 412px;
|
|
||||||
height: 160px;
|
|
||||||
border-radius: 10px;
|
|
||||||
position: relative;
|
|
||||||
// margin-left: 68px;
|
|
||||||
margin-bottom: 40px;
|
|
||||||
cursor: pointer;
|
|
||||||
.leftt {
|
|
||||||
position: absolute;
|
|
||||||
top: 18px;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
.photo {
|
|
||||||
position: absolute;
|
|
||||||
top: 42px;
|
|
||||||
left: 37px;
|
|
||||||
}
|
|
||||||
.rightt {
|
|
||||||
position: absolute;
|
|
||||||
top: 69px;
|
|
||||||
right: 26px;
|
|
||||||
}
|
|
||||||
.centerbox {
|
|
||||||
position: absolute;
|
|
||||||
top: 52px;
|
|
||||||
left: 145px;
|
|
||||||
font-size: 20px;
|
|
||||||
font-weight: 700;
|
|
||||||
//line-height: 36px;
|
|
||||||
}
|
|
||||||
.centermain {
|
|
||||||
color: rgba(135, 139, 146, 1);
|
|
||||||
font-size: 14px;
|
|
||||||
position: absolute;
|
|
||||||
left: 144px;
|
|
||||||
bottom: 49px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.xwid {
|
.xwid {
|
||||||
// width: 100%;
|
// width: 100%;
|
||||||
|
|||||||
Reference in New Issue
Block a user