hz/fe-manage
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git synced 2025-12-10 19:36:46 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat:发布的弹窗

Browse Source
This commit is contained in:
岳佳鑫
2022-10-17 10:46:30 +08:00
parent 731fdb94c3
commit 05ac824fc1
2 changed files with 156 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/taskpage/pub.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 516 B

159
src/views/projectcenter/TaskPage.vue
View File

@@ -62,7 +62,7 @@
<div class="centerbox" style="color: rgba(78, 166, 255, 1)">添加学员</div>
<div class="centermain">快速添加学员</div>
</div>
<div class="taskbox" style="background:linear-gradient(180deg,rgba(229, 246, 236, 1) 100%,rgba(238, 249, 243, 1) 100%);">
<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>
@@ -281,7 +281,8 @@
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 class="headerLeftText" style="font-size: 16px">项目发布</span>
<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 style="cursor: pointer;margin-right:32px" @click="closeModal">
<img
@@ -290,6 +291,32 @@
/>
</div>
</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">取消</a-button>
<a-button class="pubtn2">发布</a-button>
</div>
</div>
</a-modal>
</div>
</div>
@@ -300,7 +327,11 @@ export default {
name:"taskPage",
setup(){
const state = reactive({
pubproject: true,
pubproject: false,
checked: false,
checked1: true,
checked2: false,
activeKey: '1',
});
const showModal = () => {
state.pubproject = true;
@@ -317,6 +348,128 @@ export default {
}
</script>
<style lang="scss">
.pubproject {
.ant-modal {
.ant-modal-body {
padding: 0;
.modalMain {
.projectname {
color: rgba(79, 81, 86, 1);
font-size: 14px;
line-height: 36px;
margin-left: 62px;
font-weight: 500;
}
.projecttime {
margin-left: 221px;
.timeti {
color: rgba(153, 155, 163, 1);
font-size: 14px;
line-height: 36px;
}
.timeme {
color: rgba(79, 81, 86, 1);
font-size: 14px;
line-height: 36px;
}
}
.projectbox {
margin-top: 26px;
display: flex;
justify-content: center;
.promessage {
width: 280px;
height: 110px;
background:linear-gradient(180deg,rgba(254, 243, 221, 1),rgba(255, 250, 240, 1));
border-radius: 10px;
margin-right: 7px;
.messageme {
color: rgba(255, 182, 78, 1);
font-size: 14px;
line-height: 36px;
margin-top: 17px;
margin-left: 30px;
}
.messagege {
color: rgba(153, 155, 163, 1);
font-size: 14px;
margin-left: 30px;
}
}
.stumessage {
width: 280px;
height: 110px;
background:linear-gradient(180deg,rgba(221, 234, 255, 1),rgba(240, 248, 254, 1));
border-radius: 10px;
.messageme1 {
color: rgba(78, 166, 255, 1);
font-size: 14px;
line-height: 36px;
margin-top: 17px;
margin-left: 30px;
}
.messagege1 {
color: rgba(153, 155, 163, 1);
font-size: 14px;
margin-left: 30px;
}
}
}
.send {
margin-top: 30px;
margin-left: 61px;
.sendtext {
margin-left: 11px;
color: rgba(109, 117, 132, 1);
font-size: 14px;
}
}
.ckb {
margin-top: 20px;
margin-left: 62px;
.sendpeo {
color: rgba(109, 117, 132, 1);
font-size: 14px;
}
.ant-checkbox-inner {
border-radius: 4px;
}
}
.pubtn {
display: flex;
justify-content: center;
margin-top: 25px;
//margin-bottom: 29px;
.pubtn1 {
width: 100px;
height: 40px;
margin-right: 16px;
margin-bottom: 29px;
border: 1px solid #409EFF;
border-radius: 4px;
color: rgba(78, 166, 255, 1);
font-size: 14px;
//line-height: 36px;
align-items: center;
background: rgba(255, 255, 255, 1)
}
.pubtn2 {
width: 100px;
height: 40px;
margin-bottom: 29px;
border: 1px solid #409EFF;
border-radius: 4px;
color: #FFFFFF;
font-size: 14px;
align-items: center;
//line-height: 36px;
background: #409EFF;
}
}
}
}
}
}
.taskpage {
width: 100%;
display: flex;