mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-07 01:46:43 +08:00
Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-manage
This commit is contained in:
dongwug
@@ -44,6 +44,7 @@ LevelAddDetail.vue:创建关卡页面
|
||||
```
|
||||
ProjectManage.vue:项目页面
|
||||
ProjectAdd.vue:创建项目页面
|
||||
TaskPage.vue:任务页面
|
||||
TemplateLibrary.vue:模板页面
|
||||
|
||||
```
|
||||
@@ -68,6 +69,7 @@ ExaminationCenter.vue:考试中心页面
|
||||
```
|
||||
ResearchManage.vue:调研管理页面
|
||||
ResearchAdd.vue:创建调研页面
|
||||
ManagePage:调研管理-管理页面
|
||||
|
||||
```
|
||||
|
||||
|
||||
BIN
src/assets/images/projectadd/edit.png
Normal file
BIN
src/assets/images/projectadd/edit.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 496 B |
BIN
src/assets/images/projectadd/edit1.png
Normal file
BIN
src/assets/images/projectadd/edit1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 373 B |
BIN
src/assets/images/projectadd/ending.png
Normal file
BIN
src/assets/images/projectadd/ending.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
@@ -5,16 +5,260 @@
|
||||
<div class="box">
|
||||
<img src="../../assets/images/projectadd/picture.png"/>
|
||||
</div>
|
||||
<div class="imgfor">
|
||||
<div class="forz">管理者进阶-腾飞班</div>
|
||||
<div class="fort">项目经理：黄华/刘俊</div>
|
||||
<div class="fort">起止时间：2022-07-21 00:00至2020-10-21 00:00</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="end">
|
||||
<div style="margin-top: 20px;margin-left: 10px">
|
||||
<img class="endimg" src="../../assets/images/projectadd/ending.png"/>
|
||||
<span class="endtext">结束项目</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="end">
|
||||
<div style="margin-top: 20px;margin-left: 10px">
|
||||
<img class="endimg" src="../../assets/images/leveladd/more.png"/>
|
||||
<div class="tableSelect" style="margin-left: 10px">
|
||||
<a-select
|
||||
style="width: 50px; color: #7096E3"
|
||||
value="更多"
|
||||
dropdownClassName="tabledropdown"
|
||||
>
|
||||
<a-select-option value="撤回" label="撤回">
|
||||
<div>撤回</div>
|
||||
</a-select-option>
|
||||
<a-select-option value="复制" label="复制">
|
||||
<div>复制</div>
|
||||
</a-select-option>
|
||||
<a-select-option value="存为模板" label="存为模板">
|
||||
<div>存为模板</div>
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="end">
|
||||
<div style="margin-top: 20px;margin-left: 10px">
|
||||
<img class="ending" src="../../assets/images/leveladd/back.png" />
|
||||
<span class="endtext" style="color:#4EA6FF">返回</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="split"></div>
|
||||
<div>2</div>
|
||||
<div class="content">
|
||||
<a-tabs class="tab"
|
||||
v-model:activeKey="activeKey"
|
||||
size="large"
|
||||
:tabBarStyle="{ marginLeft: '10px' }">
|
||||
<a-tab-pane key="1" tab="概览">Content of Tab Pane 1</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="任务" force-render>
|
||||
<div class="onerow">
|
||||
<div class="taskmain">任务大纲</div>
|
||||
<button class="btn">批量面授报名</button>
|
||||
<div class="edit">
|
||||
<img class="editimg" src="../../assets/images/projectadd/edit.png"/>
|
||||
<span class="editext">编辑</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stage">
|
||||
<span class="stageimg"><img src="../../assets/images/projectadd/close.png"/></span>
|
||||
<span class="stagename">阶段1腾飞班阶级1</span>
|
||||
</div>
|
||||
<div class="course">
|
||||
<div class="first">
|
||||
<div class="icon"><img src="../../assets/images/leveladd/zai.png"/></div>
|
||||
<div>
|
||||
<div class="iconame">「在线」</div>
|
||||
<div class="icontext">时间管理</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type">
|
||||
<div class="typename">选修</div>
|
||||
</div>
|
||||
<div class="time">
|
||||
<div class="timetext">开始时间</div>
|
||||
<div class="timetext">2022-09-16 14:03</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progresstext">25/50人</div>
|
||||
<div style="display: flex">
|
||||
<a-progress :showInfo="false" :percent="50" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
|
||||
<span class="progresstext" style="margin-left: 10px">50%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operations">
|
||||
|
||||
<div class="operation">管理</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="course">
|
||||
<div class="first">
|
||||
<div class="icon"><img src="../../assets/images/leveladd/zhi.png"/></div>
|
||||
<div>
|
||||
<div class="iconame">「直播」</div>
|
||||
<div class="icontext">管理直播间</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type">
|
||||
<div class="typename1">必修</div>
|
||||
</div>
|
||||
<div class="time">
|
||||
<div class="timetext">开始时间</div>
|
||||
<div class="timetext">2022-09-16 14:03</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progresstext">0/50人</div>
|
||||
<div style="display: flex">
|
||||
<a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
|
||||
<span class="progresstext" style="margin-left: 10px">0%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operations">
|
||||
<div class="operation">考勤</div>
|
||||
<div class="operation">管理</div>
|
||||
<div class="operation">二维码</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="course">
|
||||
<div class="first">
|
||||
<div class="icon"><img src="../../assets/images/leveladd/mian.png"/></div>
|
||||
<div>
|
||||
<div class="iconame">「面授」</div>
|
||||
<div class="icontext">管理面授课</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type">
|
||||
<div class="typename">选修</div>
|
||||
</div>
|
||||
<div class="time">
|
||||
<div class="timetext">开始时间</div>
|
||||
<div class="timetext">2022-09-16 14:03</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progresstext">0/50人</div>
|
||||
<div style="display: flex">
|
||||
<a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
|
||||
<span class="progresstext" style="margin-left: 10px">0%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operations">
|
||||
<div class="operation">学员</div>
|
||||
<div class="operation">管理</div>
|
||||
<div class="operation">二维码</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="course">
|
||||
<div class="first">
|
||||
<div class="icon"><img src="../../assets/images/leveladd/huo.png"/></div>
|
||||
<div>
|
||||
<div class="iconame">「活动」</div>
|
||||
<div class="icontext">管理活动</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type">
|
||||
<div class="typename1">必修</div>
|
||||
</div>
|
||||
<div class="time">
|
||||
<div class="timetext">开始时间</div>
|
||||
<div class="timetext">2022-09-16 14:03</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progresstext">0/50人</div>
|
||||
<div style="display: flex">
|
||||
<a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
|
||||
<span class="progresstext" style="margin-left: 10px">0%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operations">
|
||||
<div class="operation">考勤</div>
|
||||
<div class="operation">管理</div>
|
||||
<div class="operation">二维码</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="course">
|
||||
<div class="first">
|
||||
<div class="icon"><img src="../../assets/images/leveladd/zuo.png"/></div>
|
||||
<div>
|
||||
<div class="iconame">「作业」</div>
|
||||
<div class="icontext">管理者作业</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type">
|
||||
<div class="typename">选修</div>
|
||||
</div>
|
||||
<div class="time">
|
||||
<div class="timetext">开始时间</div>
|
||||
<div class="timetext">2022-09-16 14:03</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progresstext">0/50人</div>
|
||||
<div style="display: flex">
|
||||
<a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
|
||||
<span class="progresstext" style="margin-left: 10px">0%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operations">
|
||||
|
||||
<div class="operation">管理</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="course">
|
||||
<div class="first">
|
||||
<div class="icon"><img src="../../assets/images/leveladd/kao.png"/></div>
|
||||
<div>
|
||||
<div class="iconame">「考试」</div>
|
||||
<div class="icontext">管理者考试</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type">
|
||||
<div class="typename">选修</div>
|
||||
</div>
|
||||
<div class="time">
|
||||
<div class="timetext">开始时间</div>
|
||||
<div class="timetext">2022-09-16 14:03</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progresstext">0/50人</div>
|
||||
<div style="display: flex">
|
||||
<a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
|
||||
<span class="progresstext" style="margin-left: 10px">0%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operations">
|
||||
|
||||
<div class="operation">管理</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="stage" style="margin-top: 0">
|
||||
<span class="stageimg"><img src="../../assets/images/projectadd/close.png"/></span>
|
||||
<span class="stagename">阶段2 腾飞班阶级2</span>
|
||||
</div>
|
||||
<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>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.taskpage {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
.header {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@@ -22,12 +266,226 @@
|
||||
border: 12px solid #E7F2FF;
|
||||
margin: 16px 0 16px 19px;
|
||||
border-radius: 8px;
|
||||
//float: left;
|
||||
}
|
||||
.imgfor {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 38px;
|
||||
//margin-left: 15px;
|
||||
//float: left;
|
||||
position: absolute;
|
||||
left: 210px;
|
||||
.forz {
|
||||
font-size: 16px;
|
||||
color: #363636;
|
||||
font-weight: 500;
|
||||
}
|
||||
.fort {
|
||||
font-size: 14px;
|
||||
color: #878B92;
|
||||
|
||||
}
|
||||
}
|
||||
.right {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 5px;
|
||||
//float: right;
|
||||
.end {
|
||||
border-left: 1px solid #E8EFFA;
|
||||
height: 82px;
|
||||
margin-top:30px;
|
||||
//width: 113px;
|
||||
.endimg {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
|
||||
}
|
||||
.endtext {
|
||||
font-size: 14px;
|
||||
color: #57C887;
|
||||
padding: 7px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableBox {
|
||||
margin: 20px 38px 30px;
|
||||
.ant-table-thead > tr > th {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #999ba3;
|
||||
line-height: 36px;
|
||||
padding: 5px 16px;
|
||||
background-color: #eff4fc;
|
||||
}
|
||||
|
||||
}
|
||||
.split {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: #edf0f5;
|
||||
}
|
||||
.content {
|
||||
//display: flex;
|
||||
margin: 0 37px;
|
||||
.onerow {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
position: relative;
|
||||
//margin-top: 5xp;
|
||||
.taskmain {
|
||||
font-size: 18px;
|
||||
color: #000000;
|
||||
}
|
||||
.btn {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 110px;
|
||||
background-color: #409EFF;
|
||||
width: 130px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #409EFF;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
.edit {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
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");
|
||||
}
|
||||
}
|
||||
}
|
||||
.stage {
|
||||
display: flex;
|
||||
height: 49px;
|
||||
background-color: #EFF4FC;
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
.stageimg {
|
||||
margin-left: 31px;
|
||||
}
|
||||
.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: 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;
|
||||
}
|
||||
}
|
||||
.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;
|
||||
}
|
||||
}
|
||||
.time {
|
||||
//height: 71px;
|
||||
flex-grow: 1;
|
||||
margin-right: 50px;
|
||||
.timetext {
|
||||
font-size: 14px;
|
||||
color: #999BA3;
|
||||
}
|
||||
}
|
||||
.progress {
|
||||
width: 168px;
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.split {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: #edf0f5;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user