mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-12 04:16:47 +08:00
feat:新增面授管理的标记和录入成绩 新增面授学员抽屉 新增活动考勤抽屉 新增作业管理抽屉
This commit is contained in:
songwc
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:visible="Fvisible"
|
||||
class="drawerStyle"
|
||||
class="drawerStyle FaceManage"
|
||||
placement="right"
|
||||
width="60%"
|
||||
@after-visible-change="afterVisibleChange"
|
||||
@@ -60,7 +60,7 @@
|
||||
<div class="wz">批量标注完成</div>
|
||||
</div>
|
||||
<div class="btn btn2">
|
||||
<div class="wz">批量录入成绩</div>
|
||||
<div class="wz" @click="showEntryScore">批量录入成绩</div>
|
||||
</div>
|
||||
<div class="btn btn2">
|
||||
<div class="img2"></div>
|
||||
@@ -80,7 +80,7 @@
|
||||
<div class="right">清空</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" style="margin-top: 20px; margin-bottom: 100px">
|
||||
<div class="tableBox" style="margin-top: 20px; margin-bottom: 100px">
|
||||
<a-table
|
||||
style="border: 1px solid #f2f6fe"
|
||||
:columns="tablecolumns"
|
||||
@@ -113,14 +113,42 @@
|
||||
<button class="btn1">取消</button>
|
||||
<button class="btn2">确定</button>
|
||||
</div>
|
||||
|
||||
<a-modal
|
||||
:closable="closable"
|
||||
v-model:visible="showmodal"
|
||||
centered="true"
|
||||
:footer="null"
|
||||
dialogClass="me"
|
||||
style="width: 424px; height: 258px; padding: 0px; position: relative"
|
||||
>
|
||||
<div class="head">
|
||||
<div class="inhead">
|
||||
<div class="left">
|
||||
<div class="gan"></div>
|
||||
<div class="tis">提示</div>
|
||||
</div>
|
||||
<div class="right" @click="closeModal"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main">确定将所选学员标记完成吗</div>
|
||||
<div class="butn">
|
||||
<button class="btn btn1" @click="closeModal">取消</button>
|
||||
<button class="btn btn2" @click="check">确定</button>
|
||||
</div>
|
||||
</a-modal>
|
||||
</div>
|
||||
</a-drawer>
|
||||
<!-- 录入成绩抽屉 -->
|
||||
<entry-scores v-model:Evisible="Evisible" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { toRefs, reactive } from "vue";
|
||||
import EntryScores from "./EntryScores.vue";
|
||||
export default {
|
||||
name: "FaceManage",
|
||||
components: { EntryScores },
|
||||
props: {
|
||||
Fvisible: {
|
||||
type: Boolean,
|
||||
@@ -130,7 +158,10 @@ export default {
|
||||
|
||||
setup(props, ctx) {
|
||||
const state = reactive({
|
||||
Evisible: false, //录入成绩抽屉
|
||||
name: null,
|
||||
showmodal: false, //勾选提示框
|
||||
closable: false, //modal右上角的关闭按钮
|
||||
pageSize: 10,
|
||||
currentPage: 1,
|
||||
tableDataTotal: 100,
|
||||
@@ -245,14 +276,14 @@ export default {
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
width: 50,
|
||||
align: "center",
|
||||
className: "h",
|
||||
align: "left",
|
||||
className: "h head",
|
||||
},
|
||||
{
|
||||
title: "所在部门",
|
||||
dataIndex: "bum",
|
||||
key: "bum",
|
||||
width: 50,
|
||||
width: 60,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
@@ -260,7 +291,7 @@ export default {
|
||||
title: "所在岗位",
|
||||
dataIndex: "gangw",
|
||||
key: "gangw",
|
||||
width: 50,
|
||||
width: 60,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
@@ -268,7 +299,7 @@ export default {
|
||||
title: "课程成绩",
|
||||
dataIndex: "score",
|
||||
key: "score",
|
||||
width: 50,
|
||||
width: 60,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
@@ -276,7 +307,7 @@ export default {
|
||||
title: "任务状态",
|
||||
dataIndex: "state",
|
||||
key: "state",
|
||||
width: 50,
|
||||
width: 60,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
@@ -288,31 +319,158 @@ export default {
|
||||
const closeDrawer = () => {
|
||||
ctx.emit("update:Fvisible", false);
|
||||
};
|
||||
//勾选提示框
|
||||
const showModal = () => {
|
||||
state.showmodal = true;
|
||||
};
|
||||
//关闭勾选提示框
|
||||
const closeModal = () => {
|
||||
state.showmodal = false;
|
||||
};
|
||||
//点击确认
|
||||
const check = () => {
|
||||
closeModal();
|
||||
return true;
|
||||
};
|
||||
const showEntryScore = () => {
|
||||
state.Evisible = true;
|
||||
};
|
||||
const onSelectChange = (selectedRowKeys) => {
|
||||
console.log("selectedRowKeys changed: ", selectedRowKeys);
|
||||
state.selectedRowKeys = selectedRowKeys;
|
||||
showModal();
|
||||
// 判断是否点击了确认
|
||||
// let result = check();
|
||||
// if (result) {
|
||||
// state.selectedRowKeys = selectedRowKeys;
|
||||
// }
|
||||
// state.selectedRowKeys = selectedRowKeys;
|
||||
};
|
||||
|
||||
return {
|
||||
...toRefs(state),
|
||||
selectProjectName,
|
||||
check,
|
||||
closeDrawer,
|
||||
onSelectChange,
|
||||
showModal,
|
||||
closeModal,
|
||||
showEntryScore,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss" >
|
||||
.drawerStyle {
|
||||
.ant-drawer-content-wrapper {
|
||||
// max-width: 1000px;
|
||||
.ant-drawer-header {
|
||||
display: none !important;
|
||||
}
|
||||
.ant-drawer-body {
|
||||
padding: 0;
|
||||
<style lang="scss" >
|
||||
.me {
|
||||
.ant-modal-body {
|
||||
padding: 0px;
|
||||
}
|
||||
}
|
||||
.ant-modal {
|
||||
width: 424px !important;
|
||||
height: 258px !important;
|
||||
.ant-modal-content {
|
||||
width: 424px !important;
|
||||
height: 258px !important;
|
||||
.ant-modal-body {
|
||||
width: 424px !important;
|
||||
height: 258px !important;
|
||||
padding: 0px !important;
|
||||
.head {
|
||||
width: 424px;
|
||||
height: 68px;
|
||||
// position: absolute;
|
||||
// left: 0;
|
||||
// top: 0;
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(78, 166, 255, 0.2) 0%,
|
||||
rgba(78, 166, 255, 0) 100%
|
||||
);
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
.inhead {
|
||||
width: 90%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.gan {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-image: url(../../assets/images/taskpage/gan.png);
|
||||
}
|
||||
.tis {
|
||||
margin-left: 5px;
|
||||
width: 32px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
.right {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
background-image: url(../../assets/images/basicinfo/close.png);
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.main {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
.butn {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
margin-top: 60px;
|
||||
justify-content: center;
|
||||
|
||||
.btn {
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn1 {
|
||||
color: #387df7;
|
||||
|
||||
background: #ffffff;
|
||||
border: 1px solid #387df7;
|
||||
}
|
||||
.btn2 {
|
||||
background: #388be1;
|
||||
color: #fff;
|
||||
border: 0;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// .drawerStyle {
|
||||
// .ant-drawer-content-wrapper {
|
||||
// // max-width: 1000px;
|
||||
// .ant-drawer-header {
|
||||
// display: none !important;
|
||||
// }
|
||||
// .ant-drawer-body {
|
||||
// padding: 0;
|
||||
// }
|
||||
// }
|
||||
|
||||
// }
|
||||
.FaceManage {
|
||||
.drawerMain {
|
||||
min-width: 600px;
|
||||
margin: 0px 32px 0px 32px;
|
||||
@@ -355,6 +513,9 @@ export default {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
margin-bottom: 10px;
|
||||
.name {
|
||||
margin-top: 8px;
|
||||
}
|
||||
// .name {
|
||||
// margin-top: 8px;
|
||||
|
||||
@@ -493,15 +654,23 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.tab {
|
||||
.ant-table-thead > tr > th {
|
||||
background-color: rgba(239, 244, 252, 1);
|
||||
.tableBox {
|
||||
.ant-table-selection-column {
|
||||
padding: 0px !important;
|
||||
// padding-left: 45px !important;
|
||||
}
|
||||
.ant-table-thead > tr > th {
|
||||
background-color: rgba(239, 244, 252, 1) !important;
|
||||
}
|
||||
.ant-table-selection-column {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
th.h {
|
||||
background-color: #eff4fc !important;
|
||||
}
|
||||
|
||||
.head {
|
||||
padding-left: 0px !important;
|
||||
}
|
||||
.ant-table-tbody
|
||||
> tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
|
||||
> td {
|
||||
|
||||
Reference in New Issue
Block a user