Files
fe-manage/src/components/student/TableStudent.vue
2023-01-19 10:37:37 +08:00

1173 lines
28 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div class="TableStudent">
<a-row
type="flex"
gutter="12"
style="padding-left: 20px; margin-right: 0px"
>
<a-col>
<a-form-item title="姓名:">
<a-input
class="cus-input"
v-model:value="tableParam.studentName"
placeholder="请输入姓名"
/>
</a-form-item>
</a-col>
<!-- <a-col v-if="type === 1">
<a-form-item title="小组名称:">
<a-input
class="cus-input"
v-model:value="tableParam.groupName"
placeholder="请输入小组名称"
/>
</a-form-item>
</a-col>
-->
<a-col v-if="type === 1">
<a-form-item title="部门:">
<div class="select in" style="width: 270px">
<OrgClass
v-model:value="tableParam.studentDepartId"
v-model:name="tableParam.studentDepartName"
></OrgClass>
</div>
</a-form-item>
</a-col>
<a-col v-if="type === 1">
<a-form-item title="优秀学员:">
<div class="select">
<a-select
v-model:value="tableParam.topFlag"
style="width: 260px; height: 40px"
placeholder="是否为优秀学员"
:options="topFlagList"
@change="selectProjectName"
allowClear
showSearch
></a-select>
</div>
</a-form-item>
</a-col>
<a-col>
<a-button
class="cus-btn"
style="background: #4ea6ff; color: #fff; width: 100px"
@click="getStuList"
>
<template #icon>
<img
style="margin-right: 10px"
src="../../assets/images/courseManage/search0.png"
/></template>
搜索
</a-button>
</a-col>
<a-col :span="2">
<a-button class="cus-btn white" style="width: 100px" @click="reset">
<template #icon>
<img
style="margin-right: 10px"
src="../../assets/images/leveladd/reset.png"
/></template>
重置
</a-button>
</a-col>
</a-row>
<a-row
type="flex"
gutter="12"
style="padding-left: 20px; margin-right: 0px"
>
<a-col :span="1.5">
<CommonStudent
:type="type"
:id="id"
@finash="submitCall"
:stage="stage"
>
<a-button class="cus-btn" style="background: #4ea6ff; color: #fff">
<template #icon
><img
style="margin-right: 10px"
src="../../assets/images/courseManage/add0.png"
/></template>
添加学员
</a-button>
</CommonStudent>
</a-col>
<!-- 新加导入学员 批量换组 导出学习信息 -->
<a-col :span="1.5" v-if="type === 1 || type === 2">
<a-button class="cus-btn white" @click="showImpStu">
<template #icon
><img
style="margin-right: 10px"
src="../../assets/images/basicinfo/in2.png"
/></template>
导入学员
</a-button>
</a-col>
<!--
<a-col :span="1.5" v-if="type === 1">
<a-button class="cus-btn white"> 批量换组 </a-button>
</a-col>-->
<a-col :span="1.5" v-if="type === 1">
<a-button class="cus-btn white" @click="exportTaskStu">
导出学习信息
</a-button>
</a-col>
<a-col :span="1.5" v-if="type === 2">
<a-button class="cus-btn white" @click="exportTaskStuRouter">
导出学习信息
</a-button>
</a-col>
<a-col :span="1.5">
<a-button class="cus-btn white" @click="bathDel">
<template #icon
><img
style="margin-right: 10px"
src="../../assets/images/projectadd/delete.png"
/></template>
批量删除
</a-button>
</a-col>
<a-col :span="1.5" v-if="type === 2">
<a-button class="cus-btn white" @click="showChangeModal">
<template #icon></template>
批量调整关卡
</a-button>
</a-col>
<!-- 新加批量操作导出导出作业 -->
<a-col :span="1.5" v-if="type === 3" class="batchOpera">
<div class="stmm_btn btn4" @click="hideShow">
<div class="btn4_sub">
<span style="color: #4ea6ff; margin-right: 4px"> 批量操作 </span>
<div
class="b_zk"
:style="{ display: hideshow ? 'block' : 'none' }"
></div>
<div
class="b_sq"
:style="{ display: hideshow ? 'none' : 'block' }"
></div>
</div>
<div
class="btn4_sup"
:style="{ display: hideshow ? 'none' : 'block' }"
>
<div class="btnsbox">
<div class="btn4_tit" @click="showEScoreModal">
<span>批量录入成绩</span>
</div>
<!--2023-1-12 隐藏 后面放开 -->
<!-- <div class="btn4_op1" @click="updateStatus(1)">
<span>批量结业</span>
</div> -->
<div class="btn4_op2" @click="updateStatus(0)">
<span>批量通过</span>
</div>
<div class="btn4_op3" @click="updateStatus(2)">
<span>批量拒绝</span>
</div>
</div>
</div>
</div>
<div class="stmm_btn btn5" @click="exportStu">
<div class="export"></div>
<div class="btnText">导出</div>
</div>
<div
class="stmm_btn btn5"
style="margin-left: 15px"
@click="exportHomeWorkShow"
>
<div class="btnText">导出作业</div>
</div>
</a-col>
</a-row>
<div style="margin-top: 20px">
<a-table
:columns="tablecolumns"
:data-source="tableData.list"
:pagination="stuPagination"
:loading="tableData.loading"
:scroll="{ x: 1500 }"
row-key="id"
:row-selection="stuRowSelection"
>
<template #action="{ record }">
<!-- <div style="display:flex;justify-content: center;align-items: center;">-->
<!-- <div v-if="props.type == 1" @click="excellentStudent(record)"
style="color: #4ea6ff; font-size: 14px; text-align: center;margin-left: 20px;cursor: pointer;">
优秀学员
</div>
<div @click="seeStudent(record)"
style="color: #4ea6ff; font-size: 14px; text-align: center;margin-left: 20px;cursor: pointer;">
查看
</div>
<div v-if="props.type == 2" @click="seeStudent(record)"
style="color: #4ea6ff; font-size: 14px; text-align: center;margin-left: 20px;cursor: pointer;">
调整
</div> -->
<!-- </div>-->
<a-row gutter="12">
<a-col>
<slot name="extension" v-bind:data="{ record }"></slot>
</a-col>
<!-- 新加 换组 通过 拒绝
<a-col v-if="type === 1">
<div
style="
color: #4ea6ff;
font-size: 14px;
text-align: center;
margin-left: 10px;
cursor: pointer;
"
>
换组
</div>
</a-col>
-->
<a-col v-if="type === 3 && record.status!==0">
<div
style=" color: #4ea6ff; font-size: 14px;text-align: center; margin-left: 10px; cursor: pointer; "
@click="updateStatus(0, record.id)"
>
通过
</div>
</a-col>
<a-col v-if="type === 3 && record.status!==0">
<div
style=" color: #4ea6ff;font-size: 14px;text-align: center; margin-left: 10px;cursor: pointer; "
@click="updateStatus(2, record.id)"
>
拒绝
</div>
</a-col>
<a-col>
<div
@click="del(record.id)"
style=" color: #4ea6ff;font-size: 14px;text-align: center; margin-left: 10px; cursor: pointer;"
>
删除
</div>
</a-col>
</a-row>
</template>
</a-table>
</div>
</div>
<!-- 批量调整关卡弹窗 -->
<ChangeLevelModal
v-model:visiblene="visiblene"
:stage="stage"
:ids="stuSelectKeys"
@finash="submitCall"
/>
<!-- 批量调整关卡弹窗 -->
<!-- 取消学员弹窗 -->
<div>
<a-modal
v-model:visible="canclestu"
:footer="null"
:closable="close"
wrapClassName="canclestu"
centered="true"
@cancel="closeModal1"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon1"></div>
<span>提示</span>
</div>
<div class="body">
<span>您是否授予此学员优秀学员称号</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1" @click="cancelyou">
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="closeModal1">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div>
<!-- 取消学员弹窗 -->
<!-- 优秀学员弹窗 -->
<div>
<a-modal
v-model:visible="canclestu1"
:footer="null"
:closable="close"
wrapClassName="canclestu1"
centered="true"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon1"></div>
<span>提示</span>
</div>
<div class="body">
<span>您是否取消此学员优学员称号</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="cancelcanyou">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="closeModal3">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div>
<!-- 查看学员 传入查看学员的id-->
<see-stu
v-model:Seevisible="Seevisible"
v-model:checkStuId="checkStuId"
v-model:projectId="projectId"
/>
<!-- 导入作业成绩抽屉 -->
<EScore
v-model:eScorevisible="eScorevisible"
:type="3"
:id="id"
:pid="id"
v-model:searchTaskList="getStuList"
/>
<!-- 导出作业提示框 -->
<ExportHomeWork
v-model:exportHomeWorkV="exportHomeWorkV"
:downloadUrl="downloadUrl"
/>
<!-- 导入学员抽屉 -->
<!-- :courseId="projectTaskInfo.courseId"
:courseType="2" -->
<imp-stu
v-model:AddImpStuvisible="AddImpStuvisible"
@AddImpStuvisibleClose="AddImpStuvisibleClose"
:courseId="id"
:courseType="type"
/>
</template>
<script setup>
import { computed, defineProps, onMounted, ref, watch } from "vue";
import { delStudentList, getStuPage, batchUpdateStatus } from "@/api/index1";
import CommonStudent from "@/components/student/CommonStudent";
import ChangeLevelModal from "./ChangeLevelModal.vue";
import { message } from "ant-design-vue";
// import { topStudent } from "../../api/indexProjStu";
import SeeStu from "../../components/drawers/SeeStu";
import EScore from "../drawers/ExportScore.vue";
import OrgClass from "@/components/project/OrgClass";
import ExportHomeWork from "../Modals/ExportHomeWork.vue";
import * as api from "../../api/index1";
import ImpStu from "../drawers/AddLevelImportStu";
const props = defineProps({
type: Number,
id: String,
columns: {
type: Array,
default: () => [],
},
stage: {
type: Array,
default: () => [],
},
visable: {
type: Boolean,
default: false,
},
isgetStudent: {
type: Boolean,
default: null,
},
});
const topFlagList = ref([
{
id: 0,
value: 0,
label: "普通学员",
},
{
id: 1,
value: 1,
label: "优秀学员",
},
]);
const tablecolumns = ref([
{
title: "姓名",
dataIndex: "studentName",
key: "studentName",
width: "10%",
align: "left",
className: "h",
ellipsis: true,
customRender: ({ record: { studentName, topFlag } }) =>
topFlag ? (
<div
style={{
display: "flex",
alignItems: "center",
}}
>
<span className="stydentName">{studentName}</span>
<div className="studentExcellent">
<img
className="studentExcellentImg"
src={require("../../assets/images/taskpage/excellent.png")}
/>
<span className="studentExcellentT">优秀</span>
</div>
</div>
) : (
<div>{studentName}</div>
),
},
{
title: "工号",
dataIndex: "studentUserNo",
key: "studentUserNo",
width: "20%",
align: "center",
className: "h",
ellipsis: true,
},
{
title: "部门",
dataIndex: "studentDepartName",
key: "studentDepartName",
width: "15%",
align: "center",
className: "h",
ellipsis: true,
customRender: ({ record: { studentOrgName, studentDepartName } }) =>
(allDepartShow(studentOrgName, studentDepartName)),
},
{
title: "加入方式",
dataIndex: "source",
key: "source",
width: "10%",
align: "center",
customRender: ({ record: { source } }) =>
// ({ 1: "快速添加", 2: "组织", 3: "受众", 4: "报名" }[source]),
({ 0: "手动加入", 1: "手动加入", 2: "手动加入", 3: "手动加入", 4: "报名", 5: "手动加入", 6: "手动加入"}[source]),
},
...props.columns,
{
title: "操作",
dataIndex: "operation",
key: "operation",
width: 210,
align: "center",
slots: { customRender: "action" },
},
]);
function allDepartShow(a,b) {
let org = (a=="" || a == null || a == undefined) ? a = "" : a.slice(0,1) =='/' ? a.slice(1,a.length) : a;
let depart = (b=="" || b == null || b == undefined) ? b = "" : b;
let allname = org == "" && depart == "" ? '-' : org + depart;
return allname;
}
const tableParam = ref({
studentName: "", //学员名称
groupName: "", //学员小组
studentDepartId: null, //部门
studentDepartName: null, //部门名称
topFlag: null, //是否是优秀学员
pageNo: 1,
pageSize: 10,
type: props.type,
pid: props.id,
});
const stuSelectKeys = ref([]);
const tableData = ref({
list: [],
total: 0,
loading: false,
});
const stuRowSelection = computed(() => ({
columnWidth: 20,
selectedRowKeys: stuSelectKeys.value,
onChange: onStuSelectChange,
preserveSelectedRowKeys: true,
}));
// 导出数据
function exportTaskStu() {
console.log("props.datasource", props);
window.open(
`${
process.env.VUE_APP_BASE_API
}/admin/student/exportTaskStudent?type=${1}&pid=${props.id}`
);
}
function exportTaskStuRouter() {
console.log("props.datasource", props);
window.open(
`${
process.env.VUE_APP_BASE_API
}/admin/student/exportTaskStudent?type=${2}&pid=${props.id}`
);
}
onMounted(() => {
getStuList();
});
watch(props.isgetStudent, () => {
console.log("监测");
});
watch(props, () => {
if (!props.visable) {
stuSelectKeys.value = [];
console.log("关闭了");
}
console.log("props.visable", props.visable);
tableParam.value.pid = props.id;
getStuList();
});
function onStuSelectChange(e) {
stuSelectKeys.value = e;
}
const stuPagination = computed(() => ({
total: tableData.value.total,
showSizeChanger: false,
current: tableParam.value.pageNo,
pageSize: tableParam.value.pageSize,
onChange: changePagination,
}));
function changePagination(page) {
tableParam.value.pageNo = page;
getStuList();
}
function getStuList() {
tableData.value.loading = true;
console.log("tableParam.value", tableParam.value);
getStuPage(tableParam.value).then((res) => {
console.log("学员管理-获取学员", res.data);
tableData.value.total = res.data.data.total;
tableData.value.list = res.data.data.records;
tableData.value.loading = false;
});
}
function reset() {
tableParam.value.studentName = "";
tableParam.value.groupName = ""; //学员小组
tableParam.value.studentDepartId = null; //部门
tableParam.value.studentDepartName = null; //部门
tableParam.value.topFlag = null; //是否是优秀学员
getStuList();
}
function bathDel() {
if (stuSelectKeys.value && stuSelectKeys.value.length === 0) {
message.destroy();
return message.warning("请先选中学员");
}
stuSelectKeys.value &&
stuSelectKeys.value.length &&
delStudentList({
ids: stuSelectKeys.value,
}).then(() => {
getStuList();
});
}
function del(id) {
id &&
delStudentList({
ids: [id],
}).then(() => {
getStuList();
});
}
function submitCall(flag) {
tableData.value.loading = true;
flag && getStuList();
}
// 调整关卡;
const visiblene = ref(false);
const showChangeModal = () => {
if (!stuSelectKeys.value.length) {
message.error("请选择学员");
return;
}
visiblene.value = true;
};
// 优秀学员
const canclestu = ref(false);
const canclestu1 = ref(false);
// function excellentStudent(record) {
// console.log(record)
// if (record.topFlag) {
// // 当该名学员是优秀学员时候
// canclestu1.value = true;
// } else {
// // 当该名学员不是优秀学员时候
// canclestu.value = true;
// }
// }
// 优秀学员-弹框关闭
function cancelyou() {
canclestu.value = false;
}
// 优秀学员-设置优秀学员
function closeModal1() {
canclestu.value = false;
// 授予优秀学员操作
}
// 取消优秀学员-弹框关闭
function cancelcanyou() {
canclestu1.value = false;
}
// 取消优秀学员-取消优秀学员
function closeModal3() {
canclestu1.value = false;
// 取消优秀学员操作
}
// 查看学员
const Seevisible = ref(false);
const checkStuId = ref(null);
const projectId = ref(null);
// function seeStudent(record) {
// console.log(record)
// checkStuId.value = record.id;
// projectId.value = props.id;
// Seevisible.value = true;
// console.log(props.type)
// console.log(checkStuId.value, projectId.value)
// }
//面授课批量操作下拉框
const hideshow = ref(true);
const hideShow = () => {
if (hideshow.value == true) {
hideshow.value = false;
} else {
hideshow.value = true;
}
};
//批量导入成绩
const eScorevisible = ref(false);
const showEScoreModal = () => {
eScorevisible.value = true;
};
//显示导出作业弹窗
const exportHomeWorkV = ref(false);
const downloadUrl = ref(null);
const exportHomeWorkShow = () => {
// exportHomeWorkV.value = true;
// exportHomeWork();
let obj = {
currentStageId: 0,
pid: props.id,
taskId: 0,
taskType: 0,
type: 3,
};
api.exportHomeWork(obj).then((res) => {
console.log("导出作业", res.data.data);
//message.destroy();
// message.success("导出作业成功");
exportHomeWorkV.value = true;
downloadUrl.value = res.data.data;
});
};
// //导出作业
// const exportHomeWork = () => {
// window.open(
// `${
// process.env.VUE_APP_PROXY_URL
// }admin/student/exportHomeWork?type=${3}&pid=${props.id}`
// );
// };
//导出
const exportStu = () => {
window.open(
`${
process.env.VUE_APP_BASE_API
}/admin/student/exportTaskStudent?type=${3}&pid=${props.id}&thirdType=2`
);
};
//批量操作 结业、通过、拒绝等
const updateStatus = (status, id) => {
if (!id && stuSelectKeys.value.length === 0) {
message.warning("请选择学员");
}
let obj = {
ids: id ? [id] : stuSelectKeys.value,
};
if (status === 1) {
obj.completionStatus = 1;
} else {
obj.status = status;
}
batchUpdateStatus(obj)
.then((res) => {
console.log("批量更新学员状态", res);
if (res.data.code === 200) {
getStuList();
stuSelectKeys.value = [];
}
})
.catch((err) => {
console.log("批量更新学员状态失败", err);
});
};
//导入学员
const AddImpStuvisible = ref(false); //导入学员抽屉
const showImpStu = () => {
AddImpStuvisible.value = true;
};
const AddImpStuvisibleClose = (isget) => {
console.log("关闭了导入学员弹框", isget);
{
/* 此处操作重新获取学员列表数据 */
}
if (isget) {
getStuList();
}
};
</script>
<style lang="scss">
.TableStudent {
table tr th.ant-table-selection-column,
table tr td.ant-table-selection-column {
padding-left: 3px;
}
}
.stydentName {
overflow: hidden;
text-overflow: ellipsis;
}
.studentExcellent {
width: 64px;
height: 24px;
border-radius: 2px;
border: 1px solid #ffb64e;
background-color: rgba(255, 182, 78, 0.1);
margin-left: 24px;
display: flex;
align-items: center;
.studentExcellentImg {
width: 16px;
height: 16px;
margin-left: 7px;
}
.studentExcellentT {
font-size: 12px;
font-weight: 400;
color: #ffb64e;
line-height: 17px;
margin-left: 3px;
}
}
.studentopea1 {
font-size: 14px;
font-weight: 400;
color: #387df7;
line-height: 22px;
padding-right: 8px;
border-right: 1px solid #e9e9e9;
cursor: pointer;
}
.cus-btn {
width: 100%;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 16px;
border: 1px solid #4ea6ff;
border-radius: 8px;
background: #4ea6ff;
cursor: pointer;
color: #fff;
}
.white {
background: #fff;
color: #4ea6ff;
}
.cus-input {
height: 40px;
border-radius: 8px;
}
.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%
);
}
.batchOpera {
display: flex;
.stmm_btn {
width: 100px;
height: 40px;
margin-right: 14px;
background: #ffffff;
border: 1px solid #4ea6ff;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
cursor: pointer;
.btnText {
color: #4ea6ff;
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
}
.btn4 {
display: flex;
width: 130px;
flex-direction: column;
position: relative;
.btn4_sub {
display: flex;
justify-content: center;
align-items: center;
.b_zk {
width: 10px;
height: 8px;
background-image: url("@/assets/images/coursewareManage/down.png");
background-size: 100% 100%;
}
.b_sq {
width: 10px;
height: 8px;
background-image: url("@/assets/images/coursewareManage/up.png");
background-size: 100% 100%;
}
}
.btn4_sup {
width: 100%;
background-color: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
position: absolute;
top: 40px;
z-index: 999;
.btnsbox {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.btn4_tit {
margin: 10px auto;
white-space: nowrap;
}
.btn4_op1,
.btn4_op2,
.btn4_op3 {
margin-bottom: 10px;
white-space: nowrap;
}
.btn4_tit:hover,
.btn4_op1:hover,
.btn4_op2:hover,
.btn4_op3:hover {
color: #4ea6ff;
}
}
}
}
.btn5 {
margin-right: 0px;
.export {
width: 17px;
height: 18px;
margin-right: 5px;
background-image: url("@/assets/images/coursewareManage/export.png");
}
}
}
/*.delete {
z-index: 9999;
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%);
}
.body {
width: 100%;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
}
.del_main {
width: 100%;
position: relative;
}
.del_main > .header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
}
.del-icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/notice.png);
background-size: 100% 100%;
}
.icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/QR.png);
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%;
}
.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;
}
.ant-modal-close {
margin-right: 18px;
margin-top: 5px;
}
.ant-modal-content {
width: 424px !important;
height: 258px !important;
}
.ant-modal-body {
width: 424px !important;
height: 258px !important;
padding: 0 !important;
position: relative;
top: 105px !important;
}
.ant-modal-body > .delete {
z-index: 999;
width: 424px;
height: 258px;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
border-radius: 4px;
}
.ant-modal-body > .del_header {
position: absolute;
width: calc(100%);
height: 68px;
background: linear-gradient(rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%);
}
.ant-modal-body > .del_main {
width: 100%;
position: relative;
}
.ant-modal-body > .del_main > .header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
}
.ant-modal-body > .del_main > .header > .icon1 {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/QR.png);
background-size: 100% 100%;
}
.ant-modal-body > .del_main > .header > .close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
.ant-modal-body > .del_main > .body {
width: 100%;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
position: relative;
}
.ant-modal-body > .del_main > .body > .back {
position: absolute;
top: 30px;
font-size: 12px;
font-weight: 400;
color: #666666;
}
.ant-modal-body > .del_main > .del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
}
.ant-modal-body > .del_main > .del_btnbox > .del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
cursor: pointer;
}
.ant-modal-body > .del_main > .del_btnbox > .del_btn > .btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
.ant-modal-body > .del_main > .del_btnbox > .btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
margin-right: 14px;
}
.ant-modal-body > .del_main > .del_btnbox > .btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
.canclestu > .ant-modal {
width: 424px !important;
height: 258px !important;
}
*/
</style>