-- fix bug

This commit is contained in:
yuping
2023-02-24 22:55:22 +08:00
parent 47015caf5a
commit b198c31057
2 changed files with 217 additions and 256 deletions

View File

@@ -2,8 +2,9 @@
<a-modal
:visible="true"
:footer="null"
:title="null"
:centere="true"
:closable="false"
wrapClassName="DelModal"
style="margin-top: 400px"
:zIndex="9999"
@cancel="close"
@@ -66,5 +67,118 @@ function handleConfirm() {
props.ok()
props.close()
}
</script>
<style lang="scss" scoped>
.delete {
min-width: 424px;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
border-radius: 4px;
position: absolute;
left: 50%;
top: 10%;
transform: translate(-50%, -50%);
.del_header {
position: absolute;
width: calc(100%);
height: 40px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
}
.del_main {
width: 100%;
position: relative;
.header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
.del-icons {
width: 16px;
height: 16px;
position: relative;
margin-right: 10px;
img {
width: 100%;
height: 100%;
position: absolute;
top: 0px;
left: 0px;
background-size: 100% 100%;
}
}
.close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
}
.body {
width: 100%;
padding: 0 30px;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
}
.del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
.del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
}
}
}
</style>
<style lang="scss">
.ant-modal-body {
padding: 0 !important;
}
</style>

View File

@@ -6,7 +6,7 @@
<div class="tit">
阶段
<img src="../../assets/images/projectadd/right.png" style="margin-left: 10px; cursor: pointer"
@click="showCancel" v-show="projectInfo.stageList[0].id != '0'" />
@click="removeAllLevel" v-show="projectInfo.stageList[0].id != '0'"/>
</div>
<div class="btn btn3" @click="showModal" style="margin-left: 19px">
<div class="search"></div>
@@ -14,7 +14,8 @@
</div>
<div class="maincon" style="background-color: #fff">
<Draggable v-model="projectInfo.stageList" chosenClass="chosen" ghostClass="ghost" forceFallback="true"
group="stage" animation="500" v-if="JSON.stringify(projectInfo.stageList[0].taskDraftDtoList[0]) != '{}'">
group="stage" animation="500"
v-if="JSON.stringify(projectInfo.stageList[0].taskDraftDtoList[0]) != '{}'">
<template #item="{ element,index }">
<div class="items" v-if="element.id !=='0' && !element.deleted"
:class="activeIndex === index ? 'active' : ''"
@@ -37,7 +38,7 @@
<div class="imgIcon" @click="showModal(index)"></div>
</div>
<div class="boxs_right">
<div class="imgIcon" @click="showDeleteStage(index)"></div>
<div class="imgIcon" @click="deleteStage(index)"></div>
</div>
</div>
<div class="items2">
@@ -121,7 +122,7 @@
<button class="btn" @click="showChangeModal">
移动任务到阶段
</button>
<div class="edit" @click="showdeAll">
<div class="edit" @click="deleteTaskAll">
<img class="editimg" src="../../assets/images/projectadd/delete.png"/>
<span class="editext">批量删除</span>
</div>
@@ -257,13 +258,7 @@
" @click="editTaskForType(element,index)">
编辑
</span>
<!--<span v-else style="-->
<!--color: #4ea6ff;-->
<!--margin-right: 55px;-->
<!--cursor: pointer;-->
<!--">-->
<!--</span>-->
<span style="color: #4ea6ff; cursor: pointer" @click="showDelete(index)">
<span style="color: #4ea6ff; cursor: pointer" @click="confirmDelTask(index)">
删除
</span>
</div>
@@ -281,14 +276,13 @@
<div class="footbtn">
<div class="btnbox">
<a-button class="btn btn2" @click="temporaryStorage" :loading="templateLoading">暂存</a-button>
<a-button class="btn btn2" @click="temporaryStorage" :loading="confirmLoading">暂存</a-button>
<a-button class="btn btn2" @click="submitStorage" :loading="confirmLoading">确定</a-button>
<a-button class="btn btn1" @click="cancelStorage" :loading="cancleLoading">取消</a-button>
</div>
</div>
<!-- 添加阶段弹窗 -->
<div>
<a-modal v-model:visible="stage" :title="null" @ok="closeModal" :footer="null" :closable="false"
wrapClassName="addstage" width="624px" height="388px" :centered="true" @cancel="closeModal">
<div class="modalHeader" style="
@@ -359,105 +353,6 @@
</div>
</div>
</a-modal>
</div>
<!-- 确认添加阶段弹窗 -->
<a-modal v-model:visible="confirmModal" :footer="null" 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="closeConfirm"></div>
</div>
<div class="body">
<span>您确定要添加阶段吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1" @click="closeConfirm">
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="showModal">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 确认取消阶段弹窗 -->
<a-modal v-model:visible="cancelModal" :footer="null" 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="closeCancel"></div> -->
</div>
<div class="body">
<span>您确定要删除所有阶段吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1" @click="closeCancel">
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="removeAllLevel">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 确认删除任务弹窗 -->
<a-modal v-model:visible="deleteModal" :footer="null" 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" @click="closeDelete">
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="confirmDelTask">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<a-modal v-model:visible="deAll" :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="closeDeAll"></div>
</div>
<div class="body">
<span>您确定要批量删除任务吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1" @click="closeDeAll">
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="deleteTaskAll">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 移动任务到阶段 -->
<a-modal style="padding: 0" v-model:visible="visiblene" :footer="null" :centered="true"
wrapClassName="moveModal">
@@ -490,34 +385,6 @@
</div>
</div>
</a-modal>
<!-- 是否删除阶段弹窗 -->
<a-modal v-model:visible="deleteStageModal" :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="closeDeleteStage"></div> -->
</div>
<div class="body">
<span style="width:320px;display:flex;justify-content:center;align-items:center;">{{
projectInfo.stageList?.length === 1 ? "当前为最后一个阶段,删除后任务将被移出,为无阶段模式,确认删除阶段吗?" : "您确定要删除此阶段"
}}</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1" @click="closeDeleteStage">
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="deleteStage">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div>
</template>
@@ -531,23 +398,17 @@ import {useRoute} from "vue-router";
import {TASK_TYPE} from "@/utils/const";
import {request} from "@/api/request";
import {PROJECT_DETAIL_MODIFY, PROJECT_RELEASE} from "@/api/apis";
import dialog from "@/utils/dialog";
const route = useRoute();
const courseRef = ref({})
const visiblene = ref(false);
const deAll = ref(false);
const deleteModal = ref(false);
const confirmModal = ref(false);
const stage = ref(false);
const cancelModal = ref(false);
const deleteStageModal = ref(false);
const templateLoading = ref(false);
const confirmLoading = ref(false);
const cancleLoading = ref(false);
const projectInfo = ref({stageList: [{taskDraftDtoList: [{}]}], projectInfo: {}});
const activeIndex = ref(0);
const moveChapterIndex = ref(0);
const deleteIndex = ref(0);
const formValue = ref({taskDraftDtoList: []});
@@ -611,16 +472,34 @@ const moveTask = () => {
};
//批量删除
const deleteTaskAll = () => {
projectInfo.value.stageList[activeIndex.value].taskDraftDtoList.filter(t => t.checked).forEach(t => {
if (!projectInfo.value?.stageList[activeIndex.value]?.taskDraftDtoList?.filter(t => t.checked)?.length) {
message.warning("请选择要删除的任务!");
return
}
dialog({
content: '确定要批量删除任务吗?',
ok: () => {
projectInfo.value.stageList[activeIndex.value].taskDraftDtoList.filter(t => t.checked).forEach((t,i) => {
if(t.id){
t.checked = false;
t.deleted = true;
}else{
projectInfo.value.stageList[activeIndex.value].taskDraftDtoList.splice(i,1)
}
})
deAll.value = false;
},
});
};
const confirmDelTask = () => {
projectInfo.value.stageList[activeIndex.value].taskDraftDtoList[deleteIndex.value].deleted = true
deleteModal.value = false
const confirmDelTask = (index) => {
dialog({
content: '确定要删除此任务吗?',
ok: () => {
message.success("删除成功");
projectInfo.value.stageList[activeIndex.value].taskDraftDtoList[index].id?(projectInfo.value.stageList[activeIndex.value].taskDraftDtoList[index].deleted = true):projectInfo.value.stageList[activeIndex.value].taskDraftDtoList.splice(index,1)
},
});
};
//关闭添加阶段弹窗
const closeModal = () => {
@@ -650,26 +529,16 @@ function editStage() {
stage.value = false
}
//打开删除阶段弹窗
const showDeleteStage = (index) => {
deleteStageModal.value = true;
deleteIndex.value = index;
};
//关闭删除阶段弹窗
const closeDeleteStage = () => {
deleteStageModal.value = false;
};
//删除阶段
const deleteStage = () => {
console.log(12345);
if (projectInfo.value.stageList.length === 1) {
projectInfo.value.stageList = [{id: '0', stageId: '0', name: '', remark: '', taskDraftDtoList: []}];
deleteStageModal.value = false;
return
}
projectInfo.value.stageList.splice(activeIndex.value, 1);
dialog({
content: projectInfo.value.stageList.length === 1 ? "当前为最后一个阶段,删除后任务将被移出,为无阶段模式,确认删除阶段吗?" : '确认删除此阶段吗?',
ok: () => {
message.success("删除成功");
projectInfo.value.stageList[activeIndex.value].id?(projectInfo.value.stageList[activeIndex.value].deleted = true):projectInfo.value.stageList.splice(activeIndex.value,1)
activeIndex.value && (activeIndex.value = activeIndex.value - 1);
deleteStageModal.value = false;
},
});
};
onMounted(() => {
document.getElementsByTagName("main")[0].style.background = "rgb(245, 247, 250,1)";
@@ -681,32 +550,22 @@ onUnmounted(() => {
document.getElementsByTagName("main")[0].style.background = "#ffffff";
document.getElementsByTagName("main")[0].style.boxShadow = "0px 1px 35px 0px rgba(118, 136, 166, 0.07)";
});
const closeConfirm = () => {
confirmModal.value = false;
};
const showCancel = () => {
cancelModal.value = true;
};
const closeCancel = () => {
cancelModal.value = false;
};
const showDelete = (index) => {
deleteModal.value = true;
deleteIndex.value = index
};
const closeDelete = () => {
deleteModal.value = false;
};
// 删除所有阶段
const removeAllLevel = () => {
console.log(projectInfo.value.stageList)
projectInfo.value.stageList.forEach(t => {
if(t.id!=='0'){
dialog({
content: '确定要删除所有阶段吗?',
ok: () => {
message.success("删除成功");
projectInfo.value.stageList.forEach((t,i) => {
if(t.id){
t.checked = false;
t.deleted = true;
}else{
projectInfo.value.stageList.splice(i,1)
}
})
cancelModal.value = false;
},
});
};
//全选任务或全不选任务
const selectRowAll = () => {
@@ -716,29 +575,17 @@ const selectRowAll = () => {
}
projectInfo.value.stageList[activeIndex.value].taskDraftDtoList.forEach(t => t.checked = true)
};
const showdeAll = () => {
if (!projectInfo.value?.stageList[activeIndex.value]?.taskDraftDtoList?.filter(t => t.checked)?.length) {
message.warning("请选择要删除的任务!");
return
}
deAll.value = true
};
const closeDeAll = () => {
deAll.value = false;
};
//暂存
const temporaryStorage = async () => {
templateLoading.value = true
console.log(projectInfo.value)
confirmLoading.value = true
await request(PROJECT_DETAIL_MODIFY, projectInfo.value)
await getTask()
message.success("暂存成功");
templateLoading.value = false
confirmLoading.value = false
};
//确定
const submitStorage = async () => {
// debugger
confirmLoading.value = true
projectInfo.value.projectInfo.status === 3 ? await request(PROJECT_RELEASE, {projectId: route.query.projectId}) : await request(PROJECT_DETAIL_MODIFY, projectInfo.value)
message.success("阶段和任务数据已保存")
@@ -1717,7 +1564,7 @@ const cancelStorage = async () => {
.bi {
width: 63px;
height: 23;
height: 23px;
background-color: #5dc988;
line-height: 23px;
position: absolute;