feat:学习路径测评评估投票抽屉 编辑测评抽屉 删除TaskAdd.vue a-input整体样式

This commit is contained in:
dongwug
2022-11-03 17:43:45 +08:00
parent f18282dede
commit 7914153bb1
3 changed files with 149 additions and 87 deletions

View File

@@ -9,7 +9,8 @@
> >
<div class="drawerMain"> <div class="drawerMain">
<div class="header"> <div class="header">
<div class="headerTitle">添加测评</div> <div v-if="edit" class="headerTitle">编辑测评</div>
<div v-else class="headerTitle">添加测评</div>
<img <img
style="width: 29px; height: 29px; cursor: pointer" style="width: 29px; height: 29px; cursor: pointer"
src="../../assets/images/basicinfo/close.png" src="../../assets/images/basicinfo/close.png"
@@ -121,6 +122,10 @@ export default {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
edit: {
type: Boolean,
default: false,
},
}, },
setup(props, ctx) { setup(props, ctx) {
const state = reactive({ const state = reactive({
@@ -140,6 +145,7 @@ export default {
const closeDrawer = () => { const closeDrawer = () => {
ctx.emit("update:addevalVisible", false); ctx.emit("update:addevalVisible", false);
ctx.emit("update:edit", false);
state.inputV1 = ""; state.inputV1 = "";
state.inputV2 = ""; state.inputV2 = "";
}; };

View File

@@ -60,7 +60,7 @@
<div class="main"> <div class="main">
<div class="inma"> <div class="inma">
<div class="name"> <div class="name">
<div class="d" style="margin-top: 2px;margin-right:2px"> <div class="d" style="margin-top: 2px; margin-right: 2px">
<img <img
style="width: 10px; height: 10px" style="width: 10px; height: 10px"
src="../../assets/images/basicinfo/asterisk.png" src="../../assets/images/basicinfo/asterisk.png"
@@ -78,8 +78,15 @@
<div class="co">{{ value1.length }}/20</div> <div class="co">{{ value1.length }}/20</div>
</div> </div>
<div class="name"> <div class="name">
<div class="d" style="width: 10px;height: 10px;margin-top: 2px;margin-right:2px"> <div
</div> class="d"
style="
width: 10px;
height: 10px;
margin-top: 2px;
margin-right: 2px;
"
></div>
<div class="fir">关卡说明</div> <div class="fir">关卡说明</div>
<div class="input"> <div class="input">
<a-textarea <a-textarea
@@ -166,9 +173,11 @@
</div> </div>
<!-- 添加作业侧弹窗 --> <!-- 添加作业侧弹窗 -->
<div> <div>
<add-homework <add-homework
flag=0 routerTaskId=ListChoosedId flag="0"
v-model:addhomeworkVisible="addhomeworkvisible" /> routerTaskId="ListChoosedId"
v-model:addhomeworkVisible="addhomeworkvisible"
/>
</div> </div>
<div class="lin"></div> <div class="lin"></div>
</div> </div>
@@ -221,30 +230,45 @@
</div> </div>
<div class="lin"></div> <div class="lin"></div>
</div> </div>
<div class="item"> <div class="item" @click="showDrawerAddEval">
<div class="itcon"> <div class="itcon">
<div class="img"> <div class="img">
<img src="../../assets/images/leveladd/ce.png" /> <img src="../../assets/images/leveladd/ce.png" />
</div> </div>
<div class="text">测评</div> <div class="text">测评</div>
<!-- 添加测评侧弹窗 -->
<div>
<add-eval v-model:addevalVisible="addevalvisible" v-model:edit="edit" />
</div>
<!-- 添加测评侧弹窗 -->
</div> </div>
<div class="lin"></div> <div class="lin"></div>
</div> </div>
<div class="item"> <div class="item" @click="showDrawerAddInvist">
<div class="itcon"> <div class="itcon">
<div class="img"> <div class="img">
<img src="../../assets/images/leveladd/diao.png" /> <img src="../../assets/images/leveladd/diao.png" />
</div> </div>
<div class="text">评估</div> <div class="text">评估</div>
<!-- 添加评估侧弹窗 -->
<div>
<add-invist v-model:addinvistVisible="addinvistvisible" />
</div>
<!-- 添加评估侧弹窗 -->
</div> </div>
<div class="lin"></div> <div class="lin"></div>
</div> </div>
<div class="item"> <div class="item" @click="showDrawerAddVote">
<div class="itcon"> <div class="itcon">
<div class="img"> <div class="img">
<img src="../../assets/images/leveladd/tou.png" /> <img src="../../assets/images/leveladd/tou.png" />
</div> </div>
<div class="text">投票</div> <div class="text">投票</div>
<!-- 添加投票侧弹窗 -->
<div>
<add-vote v-model:addvoteVisible="addvotevisible" />
</div>
<!-- 添加投票侧弹窗 -->
</div> </div>
<div class="lin"></div> <div class="lin"></div>
</div> </div>
@@ -524,6 +548,9 @@ import AddStu from "../../components/drawers/AddLevelAddStu";
import ImpStu from "../../components/drawers/AddLevelImportStu"; import ImpStu from "../../components/drawers/AddLevelImportStu";
import AddHomework from "../../components/drawers/AddHomework.vue"; import AddHomework from "../../components/drawers/AddHomework.vue";
import AddTest from "../../components/drawers/AddTest.vue"; import AddTest from "../../components/drawers/AddTest.vue";
import AddEval from "../../components/drawers/AddEval.vue";
import AddInvist from "../../components/drawers/AddInvist.vue";
import AddVote from "../../components/drawers/AddVote.vue";
import * as api from "../../api/indexLevel"; import * as api from "../../api/indexLevel";
import { GetRouterDetail, RouterDeleteTask } from "../../api/indexTask"; import { GetRouterDetail, RouterDeleteTask } from "../../api/indexTask";
import { message } from "ant-design-vue"; import { message } from "ant-design-vue";
@@ -533,7 +560,10 @@ export default {
AddStu, AddStu,
ImpStu, ImpStu,
AddHomework, AddHomework,
AddTest AddTest,
AddEval,
AddInvist,
AddVote,
}, },
setup() { setup() {
const state = reactive({ const state = reactive({
@@ -542,7 +572,7 @@ export default {
chapterId: "1", chapterId: "1",
remark: "关卡说明", remark: "关卡说明",
name: "默认关卡", name: "默认关卡",
} },
], ],
tableData: [ tableData: [
{ {
@@ -739,19 +769,23 @@ export default {
value1: "", value1: "",
value2: "", value2: "",
selectedRowKeys: [], selectedRowKeys: [],
edit:false, //是否点击编辑
gqxy_hs: true, gqxy_hs: true,
isactive: 0, isactive: 0,
projectChecked: null, //项目单选框 projectChecked: null, //项目单选框
addhomeworkvisible: false, addhomeworkvisible: false,
addtestvisible:false, addtestvisible: false,
addevalvisible: false,
addinvistvisible: false,
addvotevisible: false,
updateChapterID: null, //修改关卡id updateChapterID: null, //修改关卡id
// 表示当前触发列表的id,用来发送编辑和删除 // 表示当前触发列表的id,用来发送编辑和删除
ListChoosedId:0 ListChoosedId: 0,
}); });
//新建关卡 //新建关卡
const editChapter = () => { const editChapter = () => {
if(!state.value1) return message.warning("请输入关卡名称"); if (!state.value1) return message.warning("请输入关卡名称");
let obj = { let obj = {
name: state.value1, name: state.value1,
remark: state.value2, remark: state.value2,
@@ -774,7 +808,7 @@ export default {
.catch((err) => { .catch((err) => {
console.log("创建失败", err); console.log("创建失败", err);
}); });
} };
//编辑关卡 //编辑关卡
// const updateChapter = () => { // const updateChapter = () => {
@@ -800,44 +834,56 @@ export default {
// 作业和考试的抽屉 // 作业和考试的抽屉
const showDrawerAddHomework = () => { const showDrawerAddHomework = () => {
state.addhomeworkvisible = true; state.addhomeworkvisible = true;
state.ListChoosedId = 0 state.ListChoosedId = 0;
}; };
const showDrawerAddTest = () => { const showDrawerAddTest = () => {
state.addtestvisible = true; state.addtestvisible = true;
state.ListChoosedId = 0 state.ListChoosedId = 0;
};
//测试评估投票抽屉
const showDrawerAddEval = () => {
state.addevalvisible = true;
};
const showDrawerAddInvist = () => {
state.addinvistvisible = true;
};
const showDrawerAddVote = () => {
state.addvotevisible = true;
}; };
// tableData数据赋值方法 // tableData数据赋值方法
const dataAssignment = () => { const dataAssignment = () => {
console.log((state.level)); console.log(state.level);
state.level[0].taskList.forEach((element,index) => { state.level[0].taskList.forEach((element, index) => {
state.tableData[index] = { state.tableData[index] = {
key:element.routerTaskId, key: element.routerTaskId,
lei:checkType(element.type), lei: checkType(element.type),
creater:element.name, creater: element.name,
cretime:element.duration, cretime: element.duration,
checked1:element.flag checked1: element.flag,
} };
}); });
} };
const getDetail = (index) => { const getDetail = (index) => {
GetRouterDetail(92).then((res) => { GetRouterDetail(92)
state.level = res.data.data.chapterList .then((res) => {
console.log(state.level); state.level = res.data.data.chapterList;
if(index == 0) { console.log(state.level);
// state.tableData[1] = { if (index == 0) {
// key: 2, // state.tableData[1] = {
// lei: "在线", // key: 2,
// creater: "管理者课程", // lei: "在线",
// cretime: "60", // creater: "管理者课程",
// checked1: true, // cretime: "60",
// } // checked1: true,
dataAssignment(0) // }
} dataAssignment(0);
}).catch((err) => { }
message.error(err) })
}) .catch((err) => {
} message.error(err);
});
};
const closeDrawer = () => { const closeDrawer = () => {
state.visible = false; state.visible = false;
}; };
@@ -960,12 +1006,23 @@ export default {
return ( return (
<div class="opa"> <div class="opa">
<div class="opacation"> <div class="opacation">
<span style="color:#4EA6FF;margin-right:25px;cursor:pointer"> <span
style="color:#4EA6FF;margin-right:25px;cursor:pointer"
onClick={()=>{
state.edit = true;
state.addevalvisible = true;
}}
>
编辑 编辑
</span> </span>
<span style="color:#4EA6FF;cursor:pointer" onClick={() => { <span
deleteLevelTask() style="color:#4EA6FF;cursor:pointer"
}}>删除</span> onClick={() => {
deleteLevelTask();
}}
>
删除
</span>
</div> </div>
</div> </div>
); );
@@ -975,9 +1032,22 @@ export default {
return columns; return columns;
}; };
const checkType = (index) => { const checkType = (index) => {
let typeRules = ["","在线","面授","案例","作业","考试","直播","外链","讨论","测评","评估","投票"]; let typeRules = [
"",
"在线",
"面授",
"案例",
"作业",
"考试",
"直播",
"外链",
"讨论",
"测评",
"评估",
"投票",
];
return typeRules[index]; return typeRules[index];
} };
const tableDataFunc2 = () => { const tableDataFunc2 = () => {
const columns = [ const columns = [
{ {
@@ -1162,7 +1232,7 @@ export default {
document.getElementsByTagName("main")[0].style.background = document.getElementsByTagName("main")[0].style.background =
"rgb(245, 247, 250,1)"; "rgb(245, 247, 250,1)";
document.getElementsByTagName("main")[0].style.boxShadow = "none"; document.getElementsByTagName("main")[0].style.boxShadow = "none";
getDetail(0) getDetail(0);
}); });
onUnmounted(() => { onUnmounted(() => {
document.getElementsByTagName("main")[0].style.background = "#ffffff"; document.getElementsByTagName("main")[0].style.background = "#ffffff";
@@ -1183,13 +1253,15 @@ export default {
state.deleteAll = false; state.deleteAll = false;
}; };
const deleteLevelTask = () => { const deleteLevelTask = () => {
RouterDeleteTask(state.listChoosedId).then((res) => { RouterDeleteTask(state.listChoosedId)
console.log(`删除成功${res}`); .then((res) => {
message.success('删除成功') console.log(`删除成功${res}`);
}).catch((err) => { message.success("删除成功");
console.log(`删除失败${err}`); })
}) .catch((err) => {
} console.log(`删除失败${err}`);
});
};
return { return {
...toRefs(state), ...toRefs(state),
@@ -1213,6 +1285,9 @@ export default {
// updateChapter, // updateChapter,
showDrawerAddHomework, showDrawerAddHomework,
showDrawerAddTest, showDrawerAddTest,
showDrawerAddEval,
showDrawerAddInvist,
showDrawerAddVote,
deleteLevelTask, deleteLevelTask,
}; };
}, },
@@ -1339,9 +1414,9 @@ export default {
width: 100px; width: 100px;
height: 40px; height: 40px;
border-radius: 4px; border-radius: 4px;
border: 1px solid #409EFF; border: 1px solid #409eff;
font-size: 14px; font-size: 14px;
color: #409EFF; color: #409eff;
cursor: pointer; cursor: pointer;
background: #ffffff; background: #ffffff;
margin-right: 20px; margin-right: 20px;
@@ -1354,7 +1429,7 @@ export default {
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
border: 0; border: 0;
background: #409EFF; background: #409eff;
} }
} }
} }

View File

@@ -522,14 +522,7 @@
</template> </template>
<script> <script>
import { import { reactive, toRefs, onMounted, onUnmounted, onUpdated } from "vue";
reactive,
toRefs,
onMounted,
onUnmounted,
onUpdated,
watch,
} from "vue";
import AddOnline from "../../components/drawers/AddOnline.vue"; import AddOnline from "../../components/drawers/AddOnline.vue";
import EditOnline from "../../components/drawers/EditOnline.vue"; import EditOnline from "../../components/drawers/EditOnline.vue";
import AddFaceteach from "../../components/drawers/AddFaceteach.vue"; import AddFaceteach from "../../components/drawers/AddFaceteach.vue";
@@ -875,7 +868,6 @@ export default {
deleteActivityID: null, //删除活动id deleteActivityID: null, //删除活动id
deleteID: "", deleteID: "",
}); });
const selectProjectName = (value, index) => { const selectProjectName = (value, index) => {
console.log("value", value, index); console.log("value", value, index);
}; };
@@ -1074,16 +1066,6 @@ export default {
console.log("获取任务列表失败", err); console.log("获取任务列表失败", err);
}); });
}; };
watch(
state.tableData,
() => {
getTask();
},
{
deep: true,
}
);
//删除直播 //删除直播
const deleteLiveBroadcast = () => { const deleteLiveBroadcast = () => {
let obj = { let obj = {
@@ -1466,7 +1448,6 @@ export default {
//关闭确认框 //关闭确认框
state.deleteModal = false; state.deleteModal = false;
deleteTask(); deleteTask();
message.success("删除成功");
}; };
const closeModal = () => { const closeModal = () => {
state.stage = false; state.stage = false;
@@ -1600,12 +1581,12 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
.ant-input { // .ant-input {
border-radius: 8px; // border-radius: 8px;
// height: 120%; // // height: 120%;
width: 384px; // width: 384px;
height: 88px; // height: 88px;
} // }
.ConfirmModal { .ConfirmModal {
.ant-modal { .ant-modal {
width: 424px !important; width: 424px !important;