mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-09 02:46:45 +08:00
Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-manage
This commit is contained in:
songwc
@@ -40,35 +40,127 @@
|
||||
</div>
|
||||
<div class="split" style="flex-shrink: 0"></div>
|
||||
<div class="content">
|
||||
<a-tabs
|
||||
class="tab"
|
||||
v-model:activeKey="activeKey"
|
||||
size="large"
|
||||
:tabBarStyle="{ marginLeft: '10px', marginTop: '5px' }"
|
||||
>
|
||||
<a-tab-pane key="1" tab="概览">
|
||||
<div class="split"></div>
|
||||
<!-- 概览（无数据） -->
|
||||
<div style="display: none">
|
||||
<div class="onerow">
|
||||
<div class="taskmain">快速创建项目详情</div>
|
||||
</div>
|
||||
<div class="second">
|
||||
<div
|
||||
class="taskbox"
|
||||
style="
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(254, 243, 221, 1) 100%,
|
||||
rgba(255, 250, 240, 1) 100%
|
||||
);
|
||||
"
|
||||
>
|
||||
<div class="leftt">
|
||||
<img src="../../assets/images/taskpage/left1.png" />
|
||||
<a-tabs class="tab"
|
||||
v-model:activeKey="activeKey"
|
||||
size="large"
|
||||
:tabBarStyle="{ marginLeft: '10px',marginTop: '5px' }">
|
||||
<a-tab-pane key="1" tab="概览">
|
||||
<div class="split"></div>
|
||||
<!-- 概览（无数据） -->
|
||||
<div >
|
||||
<div class="onerow"><div class="taskmain">快速创建项目详情</div></div>
|
||||
<div class="second">
|
||||
<div class="taskbox" style="background:linear-gradient(180deg,rgba(254, 243, 221, 1) 100%,rgba(255, 250, 240, 1) 100%);">
|
||||
<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,rgba(221, 234, 255, 1) 100%,rgba(240, 248, 254, 1) 100%);">
|
||||
<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,rgba(229, 246, 236, 1) 100%,rgba(238, 249, 243, 1) 100%);">
|
||||
<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: none">
|
||||
<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>
|
||||
<div class="photo">
|
||||
<img src="../../assets/images/taskpage/picture1.png" />
|
||||
<!-- 概览（有数据） -->
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="任务" force-render>
|
||||
<div class="split"></div>
|
||||
<div class="onerow">
|
||||
<div class="taskmain">任务大纲</div>
|
||||
<button class="btn">批量面授报名</button>
|
||||
<router-link to="/taskadd" class="edit">
|
||||
<img class="editimg" src="../../assets/images/projectadd/edit.png"/>
|
||||
<span class="editext">编辑</span>
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="rightt">
|
||||
<img src="../../assets/images/taskpage/right1.png" />
|
||||
@@ -119,15 +211,40 @@
|
||||
<div class="photo">
|
||||
<img src="../../assets/images/taskpage/picture3.png" />
|
||||
</div>
|
||||
<div class="rightt">
|
||||
<img src="../../assets/images/taskpage/right3.png" />
|
||||
<div style="display: flex; height: 20px"></div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="学员">Content of Tab Pane 3</a-tab-pane>
|
||||
<a-tab-pane key="4" tab="公告">Content of Tab Pane 3</a-tab-pane>
|
||||
<a-tab-pane key="5" tab="项目积分">Content of Tab Pane 3</a-tab-pane>
|
||||
<a-tab-pane key="6" tab="排行榜">Content of Tab Pane 3</a-tab-pane>
|
||||
<a-tab-pane key="7" tab="设置">Content of Tab Pane 3</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
<!-- 项目发布弹窗 -->
|
||||
<div>
|
||||
<a-tabs
|
||||
v-model:visible="pubproject"
|
||||
:title="null"
|
||||
@ok="closeModal"
|
||||
:footer="null"
|
||||
:closable="false"
|
||||
wrapClassName="pubproject"
|
||||
width="679px"
|
||||
height="437px"
|
||||
>
|
||||
<div class="modalHeader"
|
||||
style="width: 100%;height: 68px;display: flex;align-items: center;justify-content: space-between;background:linear-gradient(0deg,rgba(78, 166, 255, 0) 0%,rgba(78, 166, 255, 0.2000) 100%)"
|
||||
>
|
||||
<div class="headerLeft" style="margin-left: 32px">
|
||||
<span style="width: 15px;height: 15px"><img src="../../assets/images/taskpage/pub.png"/></span>
|
||||
<span class="headerLeftText" style="font-size: 16px;margin-left:10px">项目发布</span>
|
||||
</div>
|
||||
<div class="centerbox" style="color: rgba(93, 201, 136, 1)">
|
||||
发布
|
||||
</div>
|
||||
<div class="centermain">快速发布项目</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-tabs>
|
||||
</div>
|
||||
<!-- 概览（无数据） -->
|
||||
<!-- 概览（有数据） -->
|
||||
@@ -190,10 +307,31 @@
|
||||
<span class="progresstext" style="margin-left: 10px">50%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operations">
|
||||
<div class="operation" style="cursor: pointer" @click="showTime">
|
||||
管理
|
||||
</div>
|
||||
<div class="modalMain">
|
||||
<div class="projectname">管理者进阶-腾飞班1</div>
|
||||
<div class="projecttime"><span class="timeti">项目时间：</span><span class="timeme">2022/08/01-2022/08/30</span></div>
|
||||
<div class="projectbox">
|
||||
<div class="promessage">
|
||||
<div class="messageme">项目信息</div>
|
||||
<div class="messagege">当前项目共0个阶段，0个任务</div>
|
||||
</div>
|
||||
<div class="stumessage">
|
||||
<div class="messageme1">学员信息</div>
|
||||
<div class="messagege1">项目共0名学员</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="send">
|
||||
<a-switch v-model:checked="checked" size="small" />
|
||||
<span class="sendtext">发送项目通知</span>
|
||||
</div>
|
||||
<div class="ckb">
|
||||
<a-checkbox v-model:checked="checked1"><span class="sendpeo">发给老师</span></a-checkbox>
|
||||
<a-checkbox v-model:checked="checked2"><span class="sendpeo">发给学员</span></a-checkbox>
|
||||
</div>
|
||||
<div class="pubtn">
|
||||
<a-button class="pubtn1" @click="closeModal">取消</a-button>
|
||||
<a-button class="pubtn2" @click="closeModal">发布</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="course">
|
||||
@@ -806,242 +944,200 @@ export default {
|
||||
padding: 5px 16px;
|
||||
background-color: #eff4fc;
|
||||
}
|
||||
}
|
||||
.split {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: #edf0f5;
|
||||
}
|
||||
.content {
|
||||
//display: flex;
|
||||
//margin: 0 37px;
|
||||
.ant-tabs-nav-wrap {
|
||||
margin-left: 30px;
|
||||
.split {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: #edf0f5;
|
||||
}
|
||||
.onerow {
|
||||
//width: 100%;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
.content {
|
||||
//display: flex;
|
||||
//margin: 0 37px;
|
||||
.ant-tabs-nav-wrap {
|
||||
margin-left: 30px;
|
||||
}
|
||||
.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: center;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 40px;
|
||||
.nubbox {
|
||||
width: 253px;
|
||||
height: 116px;
|
||||
align-items: center;
|
||||
background: #fafbfc;
|
||||
border-radius: 10px;
|
||||
.nub1 {
|
||||
color: #ffb54a;
|
||||
font-size: 30px;
|
||||
}
|
||||
.nub2 {
|
||||
color: #6d7584;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.taskbox {
|
||||
width: 412px;
|
||||
height: 160px;
|
||||
border-radius: 10px;
|
||||
position: relative;
|
||||
margin-top: 15px;
|
||||
margin-left: 38px;
|
||||
//margin-right: 38px;
|
||||
.taskmain {
|
||||
font-size: 18px;
|
||||
padding-top: 7px;
|
||||
color: #000000;
|
||||
}
|
||||
.btn {
|
||||
margin-right: 68px;
|
||||
margin-bottom: 40px;
|
||||
cursor: pointer;
|
||||
.leftt {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 168px;
|
||||
background-color: #409eff;
|
||||
width: 130px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #409eff;
|
||||
color: #ffffff;
|
||||
cursor: pointer;
|
||||
top: 18px;
|
||||
left: 0;
|
||||
}
|
||||
.edit {
|
||||
.photo {
|
||||
position: absolute;
|
||||
right: 48px;
|
||||
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;
|
||||
}
|
||||
top: 42px;
|
||||
left: 37px;
|
||||
}
|
||||
.edit:hover {
|
||||
color: #ffffff;
|
||||
background-color: #409eff;
|
||||
cursor: pointer;
|
||||
.editimg {
|
||||
background-image: url("../../assets/images/projectadd/edit1.png");
|
||||
}
|
||||
.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;
|
||||
}
|
||||
}
|
||||
.second {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 40px;
|
||||
.nubbox {
|
||||
width: 253px;
|
||||
height: 116px;
|
||||
align-items: center;
|
||||
background: #fafbfc;
|
||||
border-radius: 10px;
|
||||
.nub1 {
|
||||
color: #ffb54a;
|
||||
font-size: 30px;
|
||||
}
|
||||
.nub2 {
|
||||
color: #6d7584;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.taskbox {
|
||||
width: 412px;
|
||||
height: 160px;
|
||||
border-radius: 10px;
|
||||
position: relative;
|
||||
margin-right: 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;
|
||||
}
|
||||
}
|
||||
}
|
||||
.stage {
|
||||
display: flex;
|
||||
height: 49px;
|
||||
background-color: #eff4fc;
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
margin-left: 38px;
|
||||
margin-right: 38px;
|
||||
.stageimg {
|
||||
margin-left: 31px;
|
||||
}
|
||||
.stage {
|
||||
.stagename {
|
||||
color: #409eff;
|
||||
font-size: 16px;
|
||||
padding-left: 9px;
|
||||
line-height: 36px;
|
||||
}
|
||||
}
|
||||
.course {
|
||||
//width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
margin-left: 38px;
|
||||
margin-right: 38px;
|
||||
//margin: 0 12px;
|
||||
border: 1px solid #f2f6fc;
|
||||
.first {
|
||||
//position: relative;
|
||||
display: flex;
|
||||
height: 49px;
|
||||
background-color: #eff4fc;
|
||||
flex-grow: 1;
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
margin-left: 38px;
|
||||
margin-right: 38px;
|
||||
.stageimg {
|
||||
margin-left: 31px;
|
||||
//height: 71px;
|
||||
margin-left: 12px;
|
||||
margin-right: 50px;
|
||||
.icon {
|
||||
//position: absolute;
|
||||
}
|
||||
.stagename {
|
||||
color: #409eff;
|
||||
.iconame {
|
||||
//position: absolute;
|
||||
color: #4f5156;
|
||||
font-size: 16px;
|
||||
padding-left: 9px;
|
||||
line-height: 36px;
|
||||
}
|
||||
.icontext {
|
||||
//positipn: absolute;
|
||||
color: #999ba3;
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
width: 83px;
|
||||
}
|
||||
}
|
||||
.course {
|
||||
//width: 100%;
|
||||
.type {
|
||||
//height: 71px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-grow: 1;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
margin-left: 38px;
|
||||
margin-right: 38px;
|
||||
//margin: 0 12px;
|
||||
border: 1px solid #f2f6fc;
|
||||
.first {
|
||||
//position: relative;
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
align-items: center;
|
||||
//height: 71px;
|
||||
margin-left: 12px;
|
||||
margin-right: 50px;
|
||||
.icon {
|
||||
//position: absolute;
|
||||
}
|
||||
.iconame {
|
||||
//position: absolute;
|
||||
color: #4f5156;
|
||||
font-size: 16px;
|
||||
}
|
||||
.icontext {
|
||||
//positipn: absolute;
|
||||
color: #999ba3;
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
width: 83px;
|
||||
}
|
||||
margin-right: 50px;
|
||||
.typename {
|
||||
width: 63px;
|
||||
height: 23px;
|
||||
color: #5dc988;
|
||||
font-size: 14px;
|
||||
background-color: #f2f6fc;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
}
|
||||
.type {
|
||||
//height: 71px;
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
align-items: center;
|
||||
margin-right: 50px;
|
||||
.typename {
|
||||
width: 63px;
|
||||
height: 23px;
|
||||
color: #5dc988;
|
||||
font-size: 14px;
|
||||
background-color: #f2f6fc;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
}
|
||||
.typename1 {
|
||||
width: 63px;
|
||||
height: 23px;
|
||||
color: #f0f4fe;
|
||||
font-size: 14px;
|
||||
background-color: #5dc988;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
}
|
||||
.typename1 {
|
||||
width: 63px;
|
||||
height: 23px;
|
||||
color: #f0f4fe;
|
||||
font-size: 14px;
|
||||
background-color: #5dc988;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
}
|
||||
.time {
|
||||
//height: 71px;
|
||||
flex-grow: 1;
|
||||
margin-right: 50px;
|
||||
.timetext {
|
||||
font-size: 14px;
|
||||
color: #999ba3;
|
||||
}
|
||||
}
|
||||
.time {
|
||||
//height: 71px;
|
||||
flex-grow: 1;
|
||||
margin-right: 50px;
|
||||
.timetext {
|
||||
font-size: 14px;
|
||||
color: #999ba3;
|
||||
}
|
||||
.progress {
|
||||
width: 168px;
|
||||
margin-left: 10px;
|
||||
margin-right: 50px;
|
||||
flex-grow: 1;
|
||||
.progresstext {
|
||||
color: #ffc067;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.progress {
|
||||
width: 168px;
|
||||
margin-left: 10px;
|
||||
margin-right: 50px;
|
||||
flex-grow: 1;
|
||||
.progresstext {
|
||||
color: #ffc067;
|
||||
font-size: 14px;
|
||||
}
|
||||
.operations {
|
||||
display: flex;
|
||||
width: 200px;
|
||||
//flex-grow: 1;
|
||||
.operation {
|
||||
color: #4ea6ff;
|
||||
font-size: 14px;
|
||||
padding: 10px;
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
.operations {
|
||||
display: flex;
|
||||
width: 200px;
|
||||
//flex-grow: 1;
|
||||
.operation {
|
||||
color: #4ea6ff;
|
||||
font-size: 14px;
|
||||
padding: 10px;
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.drawerStyle {
|
||||
.ant-drawer-content-wrapper {
|
||||
// max-width: 1000px;
|
||||
@@ -1112,7 +1208,175 @@ export default {
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.stage {
|
||||
display: flex;
|
||||
height: 49px;
|
||||
background-color: #eff4fc;
|
||||
align-items: center;
|
||||
.img1 {
|
||||
width: 15px;
|
||||
|
||||
Reference in New Issue
Block a user