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

feat：合并

Browse Source
This commit is contained in:
dongwug
2022-10-22 11:46:55 +08:00
parent 876a2dfcd9 4de0713adb
commit b0f3b9d070
5 changed files with 743 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/projectadd/nopro.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 911 B

354
src/components/drawers/TaskFaceIn.vue Normal file
View File

@@ -0,0 +1,354 @@
<template>
<a-drawer
:visible="TaskFaceImpStuvisible"
class="drawerStyle TaskFaceImpStu"
placement="right"
width="40%"
@after-visible-change="afterVisibleChange"
>
<div class="drawerMain">
<div class="header">
<div class="headerTitle">批量面授报名</div>
<img
style="width: 29px; height: 29px; cursor: pointer"
src="../../assets/images/basicinfo/close.png"
@click="closeDrawer"
/>
</div>
<div class="main">
<div class="minatitl">
<div class="up1">请下载</div>
<div class="up2">模板</div>
<div class="up1">，按要求填写数据并导入</div>
</div>
<div class="upload">
<div class="text">上传：</div>
<div class="right">
<div class="load">
<div class="cloud"></div>
<div class="tip">点击或将文件拖拽到此处上传</div>
<div class="tipz">支持扩展名：.xls/.xlsx</div>
</div>
<div class="loadstate">
<div class="loadborder">
<div class="content">
<div class="img"></div>
<div class="timebox">
<div class="timetop">
<div class="tit">京东方商业模型.xls</div>
<div class="stateloading">正在上传</div>
</div>
<div class="prog">
<div class="inprogloading"></div>
</div>
</div>
<div class="curloading">
<div class="cur">55%</div>
<div class="cancel" style="margin-left: 20px">暂停</div>
<div class="cancel" style="margin-left: 15px">取消</div>
</div>
</div>
</div>
<div class="loadborder">
<div class="content">
<div class="img"></div>
<div class="timebox">
<div class="timetop">
<div class="tit">京东方商业模型.xls</div>
<div class="statedefeat">上传失败</div>
</div>
<div class="prog">
<div class="inprogdefeat"></div>
</div>
</div>
<div class="curloading">
<div class="cur">55%</div>
<div class="cancel" style="margin-left: 20px">暂停</div>
<div class="cancel" style="margin-left: 15px">取消</div>
</div>
<div class="defeat">下载失败数据</div>
</div>
</div>
<div class="loadborder">
<div class="content">
<div class="img"></div>
<div class="timebox">
<div class="timetop">
<div class="tit">京东方商业模型.xls</div>
<div class="statesucce">上传成功</div>
</div>
<div class="prog">
<div class="inprogsucce"></div>
</div>
</div>
<div class="curloading">
<div class="cur">55%</div>
<div class="cancel" style="margin-left: 20px">删除</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="btnn">
<button class="btn1">取消</button>
<button class="btn2">确定</button>
</div>
</div>
</a-drawer>
</template>
<script>
import { reactive, toRefs } from "vue";
export default {
name: "TaskImpStu",
props: {
TaskFaceImpStuvisible: {
type: Boolean,
default: false,
},
},
setup(props, ctx) {
const state = reactive({});
const closeDrawer = () => {
ctx.emit("update:TaskFaceImpStuvisible", false);
};
const afterVisibleChange = (bool) => {
console.log("state", bool);
};
return {
...toRefs(state),
afterVisibleChange,
closeDrawer,
// change,
};
},
};
</script>
<style lang="scss" >
.TaskFaceImpStu {
.drawerMain {
min-width: 600px;
margin: 0px 32px 0px 32px;
overflow-x: scroll;
display: flex;
flex-direction: column;
.header {
height: 73px;
border-bottom: 1px solid #e8e8e8;
display: flex;
justify-content: space-between;
align-items: center;
// background-color: red;
margin-bottom: 20px;
.headerTitle {
font-size: 18px;
font-weight: 600;
color: #333333;
line-height: 25px;
// margin-left: 24px;
}
}
.main {
.minatitl {
display: flex;
.up1 {
font-size: 16px;
font-weight: 400;
color: #333333;
}
.up2 {
font-size: 16px;
font-weight: 400;
color: #388be1;
margin-left: 4px;
}
}
.upload {
margin-top: 32px;
display: flex;
.text {
font-size: 14px;
font-weight: 400;
color: #333333;
}
.right {
margin-left: 6px;
.load {
width: 500px;
height: 176px;
background: #f5f9fd;
border-radius: 4px;
// opacity: 0.3;
border: 1px dashed #caddfd;
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 20px;
.cloud {
margin-top: 52px;
width: 28px;
height: 28px;
background-image: url(../../assets/images/basicinfo/cloud.png);
}
.tip {
font-size: 14px;
font-weight: 400;
color: #388be1;
margin-top: 15px;
cursor: pointer;
}
.tipz {
font-size: 14px;
font-weight: 400;
color: #999999;
margin-top: 10px;
}
}
.loadstate {
width: 500px;
margin-bottom: 100px;
.loadborder {
width: 500px;
height: 173px;
border-radius: 4px;
border: 1px dashed #eaeaea;
margin-bottom: 30px;
display: flex;
align-items: center;
.content {
display: flex;
margin-left: 20px;
position: relative;
.defeat {
position: absolute;
left: 46px;
top: 38px;
font-size: 14px;
font-weight: 500;
color: #ff7474;
}
.img {
width: 30px;
height: 34px;
background-image: url(../../assets/images/basicinfo/exl.png);
}
.timebox {
margin-left: 15px;
margin-top: -5px;
.timetop {
display: flex;
width: 262px;
justify-content: space-between;
margin-bottom: 8px;
.tit {
font-size: 14px;
font-weight: 400;
color: #333333;
}
.stateloading {
font-size: 14px;
font-weight: 400;
color: #388be1;
}
.statedefeat {
font-size: 14px;
font-weight: 400;
color: #ff7474;
}
.statesucce {
font-size: 14px;
font-weight: 400;
color: #35ae69;
}
}
.prog {
width: 262px;
height: 5px;
background: #eaf1fe;
border-radius: 4px;
.inprogloading {
width: 55%;
height: 5px;
border-radius: 4px;
background: #388be1;
}
//下载失败条
.inprogdefeat {
width: 55%;
height: 5px;
border-radius: 4px;
background: #ff7474;
}
//下载成功条
.inprogsucce {
width: 100%;
height: 5px;
border-radius: 4px;
background: #57c887;
}
}
}
.curloading {
margin-left: 15px;
margin-top: 15px;
display: flex;
.cur {
font-size: 14px;
font-weight: 400;
color: #333333;
}
.cancel {
font-size: 14px;
font-weight: 400;
color: #387df7;
}
}
}
}
}
}
}
}
.btnn {
height: 72px;
width: 100%;
position: absolute;
background-color: #fff;
bottom: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16);
.btn1 {
width: 100px;
height: 40px;
border: 1px solid #4ea6ff;
border-radius: 8px;
color: #4ea6ff;
background-color: #fff;
cursor: pointer;
}
.btn2 {
cursor: pointer;
width: 100px;
height: 40px;
background: #4ea6ff;
border-radius: 8px;
border: 0;
margin-left: 15px;
color: #fff;
}
}
}
}
</style>

49
src/views/projectcenter/TaskAdd.vue
View File

@@ -468,6 +468,36 @@
</div> </div>
</div> </div>
</a-modal> </a-modal>
<!-- 确认删除阶段弹窗 -->
<a-modal
v-model:visible="deleteModal"
:footer="null"
:closable="cC"
wrapClassName="ConfirmModal"
centered="true"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeDelete"></div>
</div>
<div class="body">
<span>您确定要删除此任务吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="showModal">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div> </div>
</template> </template>
@@ -795,6 +825,7 @@ export default {
confirmModal: false, //确认添加阶段弹窗 confirmModal: false, //确认添加阶段弹窗
cC: false, cC: false,
cancelModal: false, //确认取消阶段弹窗 cancelModal: false, //确认取消阶段弹窗
deleteModal: false, //确认删除弹窗
}); });
const selectProjectName = (value, index) => { const selectProjectName = (value, index) => {
console.log("value", value, index); console.log("value", value, index);
@@ -915,7 +946,14 @@ export default {
> >
编辑 编辑
</span> </span>
<span style="color:#4EA6FF;cursor:pointer">删除</span> <span
style="color:#4EA6FF;cursor:pointer"
onClick={() => {
showDelete();
}}
>
删除
</span>
</div> </div>
</div> </div>
); );
@@ -1003,7 +1041,12 @@ export default {
const closeCancel = () => { const closeCancel = () => {
state.cancelModal = false; state.cancelModal = false;
}; };
const showDelete = () => {
state.deleteModal = true;
};
const closeDelete = () => {
state.deleteModal = false;
};
return { return {
...toRefs(state), ...toRefs(state),
selectProjectName, selectProjectName,
@@ -1031,6 +1074,8 @@ export default {
closeConfirm, closeConfirm,
showCancel, showCancel,
closeCancel, closeCancel,
showDelete,
closeDelete,
}; };
}, },
}; };

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

@@ -209,10 +209,27 @@
<!-- 概览（有数据） --> <!-- 概览（有数据） -->
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="2" tab="任务" force-render> <a-tab-pane key="2" tab="任务" force-render>
<div style="flex: 1">
<div class="split"></div> <div class="split"></div>
<!-- 无数据样式 -->
<div class="notable" style="display: none">
<div class="notablebox">
<div class="boxbody">
<div class="boximg"></div>
<div class="boxtitle">
<span style="color: #ffb64e; font-size: 20px">无课程</span>
</div>
<div class="boxtitle2">
<span style="color: #878b92">请点击新建开课，创建课程</span>
</div>
</div>
<div class="smallleft"></div>
<div class="smallright"></div>
</div>
</div>
<div class="onerow"> <div class="onerow">
<div class="taskmain">任务大纲</div> <div class="taskmain">任务大纲</div>
<button class="btn">批量面授报名</button> <button class="btn" @click="showFaceIn">批量面授报名</button>
<router-link to="/taskadd" class="edit"> <router-link to="/taskadd" class="edit">
<img <img
class="editimg" class="editimg"
@@ -221,6 +238,16 @@
<span class="editext">编辑</span> <span class="editext">编辑</span>
</router-link> </router-link>
</div> </div>
<!-- <div class="taskSyllabus">
<a-collapse v-model:activeKey="taskSyllabusActive" accordion>
<template #expandIcon="{ isActive }">
<img
class="editimg"
src="../../assets/images/projectadd/edit.png"
/>
<span class="editext">编辑</span>
</router-link>
</div> -->
<div class="taskSyllabus"> <div class="taskSyllabus">
<a-collapse v-model:activeKey="taskSyllabusActive" accordion> <a-collapse v-model:activeKey="taskSyllabusActive" accordion>
<template #expandIcon="{ isActive }"> <template #expandIcon="{ isActive }">
@@ -248,9 +275,49 @@
v-for="(item, key) in value.children" v-for="(item, key) in value.children"
:key="key" :key="key"
> >
<!-- :style="{width:item.course==='在线'?'28px':
height:item.course==='在线'?'27px':}" -->
<div class="first"> <div class="first">
<div class="icon"> <div class="icon">
<img src="../../assets/images/leveladd/zai.png" /> <div
style="
width: 31px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
"
>
<img
:src="
item.course === '在线'
? require('../../assets/images/leveladd/zai.png')
: item.course === '面授'
? require('../../assets/images/leveladd/mian.png')
: item.course === '案例'
? require('../../assets/images/leveladd/an.png')
: item.course === '作业'
? require('../../assets/images/leveladd/zuo.png')
: item.course === '考试'
? require('../../assets/images/leveladd/kao.png')
: item.course === '直播'
? require('../../assets/images/leveladd/zhi.png')
: item.course === '外链'
? require('../../assets/images/leveladd/wai.png')
: item.course === '讨论'
? require('../../assets/images/leveladd/tao.png')
: item.course === '活动'
? require('../../assets/images/leveladd/huo.png')
: item.course === '测评'
? require('../../assets/images/leveladd/ce.png')
: item.course === '调研'
? require('../../assets/images/leveladd/diao.png')
: item.course === '投票'
? require('../../assets/images/leveladd/tou.png')
: null
"
/>
</div>
</div> </div>
<div> <div>
<div class="iconame">「{{ item.course }}」</div> <div class="iconame">「{{ item.course }}」</div>
@@ -355,8 +422,7 @@
<!-- 无数据创建任务 --> <!-- 无数据创建任务 -->
<div <div
class="taskbox" class="taskbox"
style="background: linear-gradient(180deg, #ddeaff, #f0f8fe); style="background: linear-gradient(180deg, #ddeaff, #f0f8fe)"
display: none;"
> >
<div class="leftt"> <div class="leftt">
<img src="../../assets/images/taskpage/left2.png" /> <img src="../../assets/images/taskpage/left2.png" />
@@ -375,6 +441,7 @@
<!-- 无数据创建任务 --> <!-- 无数据创建任务 -->
</div> </div>
<div style="display: flex; height: 20px"></div> <div style="display: flex; height: 20px"></div>
</div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="3" tab="学员"> <a-tab-pane key="3" tab="学员">
<div class="split"></div> <div class="split"></div>
@@ -750,9 +817,7 @@
</div> </div>
</div> </div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="5" tab="项目积分"> <a-tab-pane key="5" tab="项目积分"> Content of Tab Pane 3 </a-tab-pane>
Content of Tab Pane 3
</a-tab-pane>
<a-tab-pane key="6" tab="排行榜"> <a-tab-pane key="6" tab="排行榜">
<div class="content6"> <div class="content6">
<div class="title">排行榜</div> <div class="title">排行榜</div>
@@ -987,6 +1052,8 @@
<work-manage v-model:Wvisible="Wvisible" /> <work-manage v-model:Wvisible="Wvisible" />
<!-- 考试管理抽屉 --> <!-- 考试管理抽屉 -->
<test-manage v-model:TMvisible="TMvisible" :title="showTestText" /> <test-manage v-model:TMvisible="TMvisible" :title="showTestText" />
<!-- 批量面授报名 -->
<task-imp-stu v-model:TaskFaceImpStuvisible="TaskFaceImpStuvisible" />
<!-- 概览（无数据）-项目发布弹窗 --> <!-- 概览（无数据）-项目发布弹窗 -->
<div> <div>
@@ -1235,8 +1302,8 @@
</div> </div>
<div class="lodalimg"> <div class="lodalimg">
<div class="lodalcenter"> <div class="lodalcenter">
<span style="color:#448EF7;margin-right: 10px;">+</span> <span style="color: #448ef7; margin-right: 10px">+</span>
<span style="color:#448EF7;">添加图片</span> <span style="color: #448ef7">添加图片</span>
</div> </div>
</div> </div>
</div> </div>
@@ -1411,6 +1478,7 @@ import StuAdd from "../../components/drawers/StuAdd";
import ImportStu from "../../components/drawers/ImportStu"; import ImportStu from "../../components/drawers/ImportStu";
import SeeStu from "../../components/drawers/SeeStu"; import SeeStu from "../../components/drawers/SeeStu";
import ChangeGroup from "../../components/drawers/ChangeGroup"; import ChangeGroup from "../../components/drawers/ChangeGroup";
import TaskImpStu from "../../components/drawers/TaskFaceIn";
export default { export default {
name: "taskPage", name: "taskPage",
components: { components: {
@@ -1427,6 +1495,7 @@ export default {
ImportStu, ImportStu,
SeeStu, SeeStu,
ChangeGroup, ChangeGroup,
TaskImpStu,
}, },
setup() { setup() {
const state = reactive({ const state = reactive({
@@ -1612,6 +1681,7 @@ export default {
valueDate: "", //排行榜输入日期 valueDate: "", //排行榜输入日期
noticeChecked: true, noticeChecked: true,
noticeContent: "请输入要发布的公告", noticeContent: "请输入要发布的公告",
TaskFaceImpStuvisible: false, //批量面授报名
//进度排行表 //进度排行表
jindutabledata: [ jindutabledata: [
@@ -2080,6 +2150,9 @@ export default {
const closeModal2 = () => { const closeModal2 = () => {
state.stugroup = false; state.stugroup = false;
}; };
const showFaceIn = () => {
state.TaskFaceImpStuvisible = true;
};
//新增 //新增
const showTime = (course, name) => { const showTime = (course, name) => {
console.log("点击管理"); console.log("点击管理");
@@ -2177,6 +2250,7 @@ export default {
showImportStu, showImportStu,
showSeeStu, showSeeStu,
showChangeGroup, showChangeGroup,
showFaceIn,
edit_hShow, edit_hShow,
edit_exit, edit_exit,
cloradio1, cloradio1,
@@ -2734,7 +2808,6 @@ export default {
background-color: #edf0f5; background-color: #edf0f5;
} }
.content { .content {
//display: flex;
//margin: 0 37px; //margin: 0 37px;
.ant-tabs-top > .ant-tabs-nav::before, .ant-tabs-top > .ant-tabs-nav::before,
.ant-tabs-bottom > .ant-tabs-nav::before, .ant-tabs-bottom > .ant-tabs-nav::before,
@@ -2746,6 +2819,55 @@ export default {
margin-left: 30px; margin-left: 30px;
margin-top: 10px; margin-top: 10px;
} }
.notable {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
.notablebox {
width: 412px;
height: 212px;
background: linear-gradient(180deg, #fef3dd 0%, #fffaf0 100%);
border-radius: 10px;
display: flex;
justify-content: center;
text-align: center;
margin-top: 77px;
margin-bottom: 109px;
cursor: pointer;
position: relative;
.smallleft {
position: absolute;
top: 18px;
left: 0px;
width: 8px;
height: 21px;
border-radius: 0px 4px 4px 0px;
background-color: #ffb64e;
}
.smallright {
position: absolute;
bottom: 18px;
right: 0px;
width: 8px;
height: 21px;
border-radius: 4px 0px 0px 4px;
background-color: #ffb64e;
}
.boxbody {
.boximg {
width: 72px;
height: 72px;
margin: 32px auto 20px auto;
background-image: url(@/assets/images/coursewareManage/nostate.png);
background-size: 100% 100%;
}
.boxtitle {
margin-bottom: 4px;
}
}
}
}
.onerow { .onerow {
//width: 100%; //width: 100%;
display: flex; display: flex;
@@ -2968,10 +3090,15 @@ export default {
} }
} }
.taskSyllabus { .taskSyllabus {
// flex: 1;
overflow-x: scroll;
.ant-collapse { .ant-collapse {
border: 0px; border: 0px;
background-color: rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0);
min-width: 1040px;
} }
.ant-collapse-content > .ant-collapse-content-box { .ant-collapse-content > .ant-collapse-content-box {
padding-top: 0px; padding-top: 0px;
padding-bottom: 0px; padding-bottom: 0px;
@@ -3059,12 +3186,15 @@ export default {
} }
.course { .course {
//width: 100%; //width: 100%;
flex-shrink: 0;
margin-right: 24px;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; align-items: center;
padding: 25px 0px; padding: 25px 0px;
margin-left: 22px; margin-left: 22px;
margin-right: 24px;
//margin: 0 12px; //margin: 0 12px;
border: 1px solid #f2f6fc; border: 1px solid #f2f6fc;
border-top: 0px; border-top: 0px;
@@ -3081,12 +3211,13 @@ export default {
//position: absolute; //position: absolute;
color: #4f5156; color: #4f5156;
font-size: 16px; font-size: 16px;
margin-left: 4px;
} }
.icontext { .icontext {
//positipn: absolute; //positipn: absolute;
color: #999ba3; color: #999ba3;
font-size: 14px; font-size: 14px;
margin-left: 8px; margin-left: 12px;
width: 83px; width: 83px;
} }
} }
@@ -3785,7 +3916,7 @@ export default {
.lodalimg { .lodalimg {
width: 120px; width: 120px;
height: 120px; height: 120px;
border:1px dashed #387DF7; border: 1px dashed #387df7;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

25
src/views/research/ResearchManage.vue
View File

@@ -21,8 +21,8 @@
v-model:value="projectName" v-model:value="projectName"
style="width: 270px" style="width: 270px"
placeholder="请选择状态" placeholder="请选择状态"
:options="projectNameList" :options="projectStateList"
@change="selectProjectName" @change="selectProjectState"
allowClear allowClear
showSearch showSearch
></a-select> ></a-select>
@@ -149,6 +149,23 @@ export default {
label: "项目四", label: "项目四",
}, },
], ],
projectStateList: [
{
id: 1,
value: "已发布",
label: "已发布",
},
{
id: 2,
value: "待发布",
label: "待发布",
},
{
id: 3,
value: "已结束",
label: "已结束",
},
],
out: false, out: false,
number: null, number: null,
selectTime: null, selectTime: null,
@@ -327,6 +344,9 @@ export default {
const selectProjectName = (value, index) => { const selectProjectName = (value, index) => {
console.log("value", value, index); console.log("value", value, index);
}; };
const selectProjectState = (value, index) => {
console.log("value", value, index);
};
const expandTable = (e, a) => { const expandTable = (e, a) => {
// console.log("惦记了"); // console.log("惦记了");
console.log("e", e, a); console.log("e", e, a);
@@ -340,6 +360,7 @@ export default {
return { return {
...toRefs(state), ...toRefs(state),
selectProjectName, selectProjectName,
selectProjectState,
expandTable, expandTable,
handleOut, handleOut,
tableDataFunc, tableDataFunc,