Files
fe-manage/src/views/research/ResearchManage.vue
2022-12-19 20:45:23 +08:00

1268 lines
33 KiB
Vue

<!-- 评估管理页面 -->
<template>
<div class="researchmanage">
<!-- 搜索框及按钮 -->
<div class="filter">
<div class="filterItems">
<div class="select">
<a-input
v-model:value="projectName"
style="width: 270px; height: 40px; border-radius: 8px"
placeholder="请输入评估名称"
/>
</div>
<div class="select">
<a-select
v-model:value="projectStatus"
style="width: 270px"
placeholder="请选择状态"
:options="projectStateList"
@change="handleProjectState"
allowClear
showSearch
></a-select>
</div>
<div class="select">
<a-range-picker
v-model:value="projectTime"
separator="至"
:placeholder="[' 开始时间', ' 结束时间']"
/>
</div>
<div style="display: flex; margin-bottom: 20px">
<div class="btn btn1" @click="handleSearch">
<div class="search"></div>
<div class="btnText">搜索</div>
</div>
<div class="btnn btn2" @click="handleRest">
<div class="search"></div>
<div class="btnText">重置</div>
</div>
</div>
</div>
<div class="btns">
<div class="btn btn3" @click="handleNew">
<div class="search"></div>
<div class="btnText">创建评估</div>
</div>
</div>
</div>
<!-- 搜索框及按钮 -->
<!-- 表格 -->
<div class="tableBox">
<a-table
style="border: 1px solid #f2f6fe"
:columns="tableDataFunc()"
:data-source="tableData"
:loading="tableDataTotal === -1 ? true : false"
expandRowByClick="true"
:scroll="{ x: 1500 }"
@expand="expandTable"
:pagination="false"
/>
</div>
<div class="pa">
<a-pagination
:showSizeChanger="false"
showQuickJumper="true"
hideOnSinglePage="true"
:pageSize="pageSize"
:current="currentPage"
:total="tableDataTotal"
class="pagination"
@change="handelChangePage"
/>
</div>
<!-- 表格 -->
<a-modal
v-model:visible="newNext"
:footer="null"
:closable="false"
style="margin-top: 250px"
:centered="center"
>
<div class="out">
<div class="top">
<img class="topimg" src="../../assets/images/courseManage/add1.png" />
<div class="topc">{{ !assessmentId ? "创建" : "编辑" }}评估</div>
<div
style="margin-left: 500px; cursor: pointer"
@click="handleCancel"
>
<img
style="width: 20px; height: 20px"
src="../../assets/images/basicinfo/close.png"
/>
</div>
</div>
<div class="mid clearfix">
<div class="name">
<div class="inname">评估名称</div>
<div class="in">
<!-- <a-input
v-model:value="assessmentName"
show-count
:maxlength="15"
style="border-radius: 8px"
/> -->
<NameInput
placeholder="请输入路径名称"
v-model:value="assessmentName"
v-model:validate="validate"
:maxlength="15"
show-count
:type="4"
:id="assessmentId ? assessmentId : null"
></NameInput>
</div>
</div>
<div class="btn">
<button class="samtn btn1" @click="handleCancel">取消</button>
<button class="samtn btn2" @click="handleNext">
{{ !assessmentId ? "下一步" : "确定" }}
</button>
</div>
</div>
</div></a-modal
>
<!--操作弹窗 -->
<a-modal
v-model:visible="delete_hs"
:footer="null"
:closable="closableQR"
wrapClassName="DelModal"
style="margin-top: 400px"
@cancel="handleCancelModal"
>
<div class="delete" :style="{ display: delete_hs ? 'block' : 'none' }">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<img src="@/assets/images/coursewareManage/QR.png" alt="" />
<span style="margin-left: 9px">提示</span>
<div class="close_exit" @click="handleCancelModal"></div>
</div>
<div class="body">
<div :style="{ display: del_hs ? 'block' : 'none' }">
<span>您确定要删除此评估吗</span>
</div>
<div :style="{ display: over_hs ? 'block' : 'none' }">
<span>您确定要结束此评估吗</span>
</div>
<div :style="{ display: copy_hs ? 'block' : 'none' }">
<span>您确定要复制此评估吗</span>
</div>
<div :style="{ display: back_hs ? 'block' : 'none' }">
<span>您确定要撤回此评估吗</span>
</div>
<div :style="{ display: pub_hs ? 'block' : 'none' }">
<span>您确定要发布此评估吗</span>
</div>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="handleCancelModal">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="handleSure">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!--操作弹窗 -->
</div>
<!-- 加载动画 -->
<div
class="aeLoading"
style="z-index: 100"
:style="{ display: addLoading ? 'flex' : 'none' }"
>
<a-spin :spinning="addLoading" tip="" />
</div>
</template>
<script>
import { reactive, toRefs, onMounted, ref } from "vue";
// import { message } from "ant-design-vue";
import {
queryResearchDetailList,
editAssessmentName,
editReleaseStatus,
deleteResearch,
createResearch,
} from "@/api/indexResearch";
import { traverseArr } from "../../utils/utils";
import { useRouter } from "vue-router";
import { toDate } from "../../api/method.js";
import store from "@/store";
import { message } from "ant-design-vue";
import NameInput from "@/components/project/NameInput";
export default {
name: "learningPath",
components: {
NameInput,
},
setup() {
const router = useRouter();
const state = reactive({
addLoading: false,
// projectNameList: [
// {
// id: 1,
// value: "项目一",
// label: "项目一",
// },
// {
// id: 2,
// value: "项目二",
// label: "项目二",
// },
// {
// id: 3,
// value: "项目三",
// label: "项目三",
// },
// {
// id: 4,
// value: "项目四",
// label: "项目四",
// },
// ],
projectStateList: [
{
value: 1,
label: "待发布", //发布
},
{
value: 2,
label: "已发布", //撤回
},
{
value: 3,
label: "已结束",
},
],
projectName: "",
projectStatus: null,
projectTime: "",
newNext: false,
number: null,
selectTime: null,
tableData: [
// {
// key: 1,
// number: 1,
// manager: "产品经理评估",
// state: "已发布",
// creater: "管理员",
// pubtime: "2022-07-20 9:03",
// cretime: "2022-07-20 9:03",
// haspub: false,
// },
// {
// key: 2,
// number: 2,
// manager: "高级产品经理评估",
// state: "已发布",
// creater: "管理员",
// pubtime: "2022-07-20 9:03",
// cretime: "2022-07-20 9:03",
// haspub: false,
// },
// {
// key: 3,
// number: 3,
// manager: "管理者进阶腾飞班管理者进阶腾飞班评估",
// state: "待发布",
// creater: "管理员",
// pubtime: "2022-07-20 9:03",
// cretime: "2022-07-20 9:03",
// haspub: true,
// },
// {
// key: 4,
// number: 4,
// manager: "HR评估",
// state: "已结束",
// creater: "管理员",
// pubtime: "2022-07-20 9:03",
// cretime: "2022-07-20 9:03",
// haspub: true,
// },
],
currentPage: 1,
tableDataTotal: 0,
pageSize: 10,
// value1: " ",
assessmentId: "", //区分新建/编辑
assessmentName: "",
copyItem: {},
value2: ref(),
valueE: ref(" "),
valueEE: ref(" "),
valuei: ref(" "),
delete_hs: false,
del_hs: false,
over_hs: false,
copy_hs: false,
back_hs: false,
pub_hs: false,
validate: true,
});
const tableDataFunc = () => {
const columns = [
// {
// title: "序号",
// dataIndex: "number",
// // key: "number",
// width: 100,
// align: "center",
// className: "h",
// customRender: ({ index }) => {
//{ text, record, index, column }
// return index + 1;
// },
// },
{
title: "名称",
dataIndex: "manager",
key: "manager",
width: "30%",
align: "center",
ellipsis: true,
className: "h",
customRender: ({ text }) => {
return text ? text : "-";
},
},
{
title: "状态",
dataIndex: "state",
key: "state",
width: "10%",
align: "center",
className: "h",
customRender: ({ record }) => {
switch (record.releaseStatus) {
case "1":
return "待发布";
case "2":
return "已发布";
case "3":
return "已结束";
}
},
},
{
title: "创建人",
dataIndex: "creater",
key: "creater",
width: "10%",
align: "center",
className: "h",
customRender: ({ text }) => {
return text ? text : "-";
},
},
{
title: "发布时间",
dataIndex: "pubtime",
key: "pubtime",
width: "10%",
align: "center",
className: "h",
customRender: ({ text }) => {
return text ? text : "-";
},
},
{
title: "创建时间",
dataIndex: "cretime",
key: "cretime",
width: "10%",
align: "center",
className: "h",
customRender: ({ text }) => {
return text ? text : "-";
},
},
{
title: "操作",
className: "h",
dataIndex: "opacation",
key: "opacation",
width: "20%",
align: "center",
fixed: "right",
},
];
return columns;
};
const getTableDate = async () => {
// let data = state.tableData;
state.addLoading = true;
let startTime,
endTime = "";
if (state.projectTime) {
startTime = toDate(
new Date(state.projectTime[0].$d).getTime() / 1000,
"Y-M-D"
);
endTime = toDate(
new Date(state.projectTime[1].$d).getTime() / 1000,
"Y-M-D"
);
}
let res = await queryResearchDetailList({
pageNo: state.currentPage,
pageSize: state.pageSize,
releaseStatus: state.projectStatus,
assessmentName: state.projectName,
searchEndTime: endTime,
searchStartTime: startTime,
});
const { rows, total } = res.data.data;
state.tableDataTotal = total;
const data = traverseArr(
rows,
{
key: "assessmentId",
number: "assessmentId",
manager: "assessmentName",
state: "releaseStatus",
creater: "createUser",
pubtime: "releaseTime",
cretime: "createTime",
haspub: "assessmentId",
},
true
);
state.addLoading = false;
data.map((value) => {
{
//单层项目
value.opacation = (
<div class="operation">
{value.state === "2" ? (
<div class="fb">
{/**
<div class="jc"
onClick={() => {
handleToManagepage(value, "/managepage");
}}
>
管理
</div>
*/}
<div
class="jc"
onClick={() => {
handleCopy(value);
}}
>
复制
</div>
<div
class="jc"
onClick={() => {
handleStatuts(value, "2");
}}
>
撤回
</div>
<div
class="jc"
onClick={() => {
handleStatuts(value, "3");
}}
>
结束
</div>
</div>
) : (
<div></div>
)}
{value.state === "1" ? (
<div class="fb">
<div
class="jc"
onClick={() => {
handleStatuts(value, "1");
}}
>
发布
</div>
<div
class="jc"
onClick={() => {
handleToResearchadd(value, "/researchadd");
}}
>
基础信息
</div>
<div
class="jc"
onClick={() => {
handleCopy(value);
}}
>
复制
</div>
<div
class="jc"
onClick={() => {
handleEditName(value);
}}
>
编辑
</div>
<div
class="jc"
onClick={() => {
handleDel(value);
}}
>
删除
</div>
</div>
) : (
<div></div>
)}
{value.state === "3" ? (
<div class="fb">
<div
class="jc"
onClick={() => {
handleCopy(value);
}}
>
复制
</div>
<div
class="jc"
onClick={() => {
handleDel(value);
}}
>
删除
</div>
</div>
) : (
<div></div>
)}
</div>
);
}
});
state.tableData = data;
};
getTableDate();
const handelChangePage = (page, pageSize) => {
state.currentPage = page;
state.pageSize = pageSize;
getTableDate();
};
const handleSearch = () => {
getTableDate();
};
const handleRest = () => {
state.projectName = "";
state.projectStatus = null;
state.projectTime = "";
getTableDate();
};
const handleProjectState = (value) => {
state.projectStatus = value;
};
const handleNew = () => {
state.newNext = true;
};
const handleEditName = (item) => {
state.assessmentId = item.assessmentId;
state.assessmentName = item.assessmentName;
state.newNext = true;
};
const handleNext = () => {
if (!state.assessmentId) {
if (!state.assessmentName) {
message.error("请输入评估名称");
return false;
}
if (!state.validate) {
message.destroy();
message.warning("评估名称重复");
return;
}
store.commit("SET_assessmentName", state.assessmentName);
router.push("/researchadd");
handleCancel();
} else {
editAssessmentName({
assessmentId: state.assessmentId,
assessmentName: state.assessmentName,
}).then((res) => {
if (res.data.code === 200) {
getTableDate();
handleCancel();
}
});
}
};
const handleCancel = () => {
state.assessmentId = "";
state.assessmentName = "";
// store.commit("SET_assessmentName", "");
state.newNext = false;
};
const handleStatuts = (item, status) => {
state.assessmentId = item.assessmentId;
switch (status) {
case "1":
// 发布
state.delete_hs = true;
state.pub_hs = true;
break;
case "2":
// 撤回
state.delete_hs = true;
state.back_hs = true;
break;
case "3":
// 结束
state.delete_hs = true;
state.over_hs = true;
break;
}
};
const handleDel = (item) => {
state.assessmentId = item.assessmentId;
state.delete_hs = true;
state.del_hs = true;
};
const handleCopy = (item) => {
state.assessmentId = item.assessmentId;
state.copyItem = item;
state.delete_hs = true;
state.copy_hs = true;
};
const handleSure = () => {
// 发布
if (state.pub_hs) {
editReleaseStatus({
assessmentId: state.assessmentId,
releaseStatus: "2",
}).then((res) => {
console.log(res);
handleCancelModal();
getTableDate();
});
}
// 撤回
if (state.back_hs) {
editReleaseStatus({
assessmentId: state.assessmentId,
releaseStatus: "1",
}).then((res) => {
console.log(res);
handleCancelModal();
getTableDate();
});
}
// 结束
if (state.over_hs) {
editReleaseStatus({
assessmentId: state.assessmentId,
releaseStatus: "3",
}).then((res) => {
console.log(res);
handleCancelModal();
getTableDate();
});
}
// 删除
if (state.del_hs) {
deleteResearch({
assessmentId: Number(state.assessmentId),
}).then((res) => {
console.log(res);
handleCancelModal();
getTableDate();
});
}
// 复制
if (state.copy_hs) {
let resultPost = restData(state.copyItem);
resultPost.assessmentName = resultPost.assessmentName + "(1)";
console.log("resultPost");
console.log(resultPost);
createResearch(resultPost).then((res) => {
console.log(res);
handleCancelModal();
getTableDate();
});
}
};
const handleCancelModal = () => {
state.assessmentId = "";
state.delete_hs = false;
state.del_hs = false;
state.over_hs = false;
state.copy_hs = false;
state.back_hs = false;
state.pub_hs = false;
};
const handleToManagepage = (item, path) => {
router.push({
path: path + "/" + item.assessmentId,
});
};
const handleToResearchadd = (item, path) => {
// console.log("item.assessmentId");
// console.log(item.assessmentId);
// console.log(item);
router.push({
path: path + "/" + item.assessmentId,
});
};
onMounted(() => {
// console.log("执行");
});
// 转换成后端格式
const restData = (obj) => {
const resultArr = {
assessmentName: obj.assessmentName,
assessmentMark: obj.assessmentMark,
assessmentSingleChoiceDtoList: [],
assessmentMultipleChoiceDtoList: [],
assessmentEssayQuestionDtoList: [],
assessmentScoringQuestionDtoList: [],
};
if (obj.singleStemVoList.length) {
let single = obj.singleStemVoList;
let singleArr = [];
single.forEach((item) => {
item.assessmentSingleChoiceVoList.forEach((itm) => {
singleArr.push({
singleStemName: item.singleStemName,
questionType: item.questionType,
orderNumber: item.orderNumber,
optionOrderNum: itm.optionOrderNum,
singleOptionName: itm.singleOptionName,
singleOptionPictureAddress: itm.singleOptionPictureAddress,
});
});
});
resultArr.assessmentSingleChoiceDtoList = singleArr;
}
if (obj.multipleStemVoList.length) {
let multi = obj.multipleStemVoList;
let multiArr = [];
multi.forEach((item) => {
item.multipleChoiceVoList.forEach((itm) => {
multiArr.push({
multipleStemName: item.multipleStemName,
questionType: item.questionType,
orderNumber: item.orderNumber,
optionOrderNum: itm.optionOrderNum,
multipleOptionName: itm.multipleOptionName,
multipleOptionPictureAddress: itm.multipleOptionPictureAddress,
});
});
});
resultArr.assessmentMultipleChoiceDtoList = multiArr;
}
if (obj.essayQuestionVoList.length) {
let Ques = obj.essayQuestionVoList;
let QuesArr = [];
Ques.forEach((item) => {
QuesArr.push({
questionType: item.questionType,
assessmentQaTitle: item.assessmentQaTitle,
assessmentQaDescribe: item.assessmentQaDescribe,
orderNumber: item.orderNumber,
});
});
resultArr.assessmentEssayQuestionDtoList = QuesArr;
}
if (obj.scoringQuestionVoList.length) {
let scor = obj.scoringQuestionVoList;
let scorsArr = [];
scor.forEach((item) => {
scorsArr.push({
questionType: item.questionType,
assessmentScTitle: item.assessmentScTitle,
assessmentMinScore: item.assessmentMinScore,
assessmentMaxScore: item.assessmentMaxScore,
weightScale: item.weightScale,
orderNumber: item.orderNumber,
});
});
resultArr.assessmentScoringQuestionDtoList = scorsArr;
}
console.log(111);
console.log(resultArr);
return resultArr;
};
const expandTable = (e, a) => {
// console.log("惦记了");
console.log("e", e, a);
};
const chooseImg = (id) => {
console.log(id);
};
return {
...toRefs(state),
handleProjectState,
expandTable,
tableDataFunc,
chooseImg,
getTableDate,
handleCopy,
handleSure,
handleCancelModal,
handelChangePage,
handleSearch,
handleRest,
handleCancel,
handleNext,
handleNew,
handleEditName,
handleStatuts,
handleDel,
handleToManagepage,
handleToResearchadd,
};
},
};
</script>
<style lang="scss">
.clearfix:before,
.clearfix:after {
content: " ";
display: block;
clear: both;
}
.out {
//display: flex;
display: block;
position: absolute;
width: 680px;
// height: 525px;
background-color: #fff;
box-shadow: 0 0 10px rgba(118, 136, 166, 0.21);
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
.top {
width: 100%;
height: 68px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
display: flex;
align-items: center;
.topimg {
width: 18px;
height: 18px;
margin-left: 27px;
}
.topc {
color: #000000;
font-size: 16px;
margin-left: 8px;
}
}
.mid {
width: 100%;
height: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: center;
.d {
// margin-top: 8px;
// color: #ff4e4e;
margin-left: -5px;
}
.name {
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 20px;
align-items: center;
height: 40px;
// border: 1px solid black;
.inname {
color: #6f6f6f;
font-size: 14px;
margin-left: 7px;
}
.in {
margin-left: 14px;
width: 81%;
.ant-input {
border-radius: 5px;
// height: 120%;
width: 100%;
height: 30px;
}
.showcount {
position: absolute;
right: 10px;
color: #c7cbd2;
bottom: 5px;
}
}
}
.btn {
width: 33%;
margin-top: 30px;
display: flex;
justify-content: space-between;
margin-bottom: 30px;
.samtn {
width: 100px;
height: 40px;
font-size: 14px;
border: 1px solid #4ea6ff;
border-radius: 8px;
cursor: pointer;
}
.btn1 {
background-color: #fff;
color: #4ea6ff;
}
.btn2 {
margin-left: 10px;
background-color: #4ea6ff;
color: #fff;
}
}
}
}
.researchmanage {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
position: relative;
.filter {
margin-left: 38px;
margin-right: 38px;
margin-top: 30px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.filterItems {
display: flex;
flex-wrap: wrap;
.select {
margin-right: 20px;
margin-bottom: 20px;
}
.btn {
padding: 0px 26px 0px 26px;
height: 38px;
background: #4ea6ff;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.search {
background-size: 100%;
}
.btnText {
font-size: 14px;
font-weight: 400;
color: #ffffff;
line-height: 36px;
margin-left: 5px;
}
}
.btnn {
padding: 0px 26px 0px 26px;
height: 38px;
background: #ffffff;
border-radius: 8px;
border: 1px solid rgba(64, 158, 255, 1);
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.search {
background-size: 100%;
}
.btnText {
font-size: 14px;
font-weight: 400;
color: #4ea6ff;
line-height: 36px;
margin-left: 5px;
}
}
.btn1 {
.search {
width: 15px;
height: 17px;
background-image: url("../../assets/images/courseManage/search0.png");
}
}
.btn2 {
.search {
width: 16px;
height: 18px;
background-image: url("../../assets/images/courseManage/reset1.png");
}
}
.btn1:hover {
background: rgba(64, 158, 255, 0.76);
.search {
background-image: url("../../assets/images/courseManage/search0.png");
}
.btnText {
color: #ffffff;
}
}
.btn1:active {
background: #0982ff;
}
.btn2:hover {
background: rgba(64, 158, 255, 0.1);
}
.btn2:active {
background: rgba(64, 158, 255, 0.2);
}
}
.btns {
display: flex;
.btn {
padding: 0px 26px 0px 26px;
height: 38px;
background: #4ea6ff;
border-radius: 8px;
//border: 1px solid rgba(64, 158, 255, 1);
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.search {
background-size: 100%;
}
.btnText {
font-size: 14px;
font-weight: 400;
color: #ffffff;
line-height: 36px;
margin-left: 5px;
}
}
.btn3 {
margin-right: 0px;
.search {
width: 17px;
height: 18px;
background-image: url("../../assets/images/courseManage/add0.png");
}
}
.btn3:hover {
background: rgba(64, 158, 255, 0.76);
.search {
background-image: url("../../assets/images/courseManage/add0.png");
}
.btnText {
color: #ffffff;
}
}
.btn3:active {
background: #0982ff;
}
}
}
.tableBox {
margin: 20px 38px 30px;
display: flex;
flex: 1;
flex-direction: column;
th.ant-table-cell {
background-color: #eff4fc !important;
text-align: center;
color: #999ba3;
}
td.ant-table-cell {
text-align: center;
}
.ant-table-tbody
> tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
> td {
background: #f6f9fd;
}
}
.pa {
width: 100%;
display: flex;
justify-content: center;
margin-bottom: 20px;
.pagination {
margin-bottom: 20px;
}
.ant-pagination-item-link,
.ant-pagination-item,
.ant-select-selector,
.ant-pagination-options-quick-jumper input {
border-radius: 8px;
}
}
.unout {
display: none;
}
.operation {
display: flex;
justify-content: right;
.fb {
display: flex;
margin-right: 20px;
.jc {
color: #4ea6ff;
font-size: 14px;
margin-left: 20px;
white-space: nowrap;
cursor: pointer;
}
}
}
}
.DelModal {
.ant-modal {
.ant-modal-content {
width: 424px !important;
.ant-modal-body {
.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%);
.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-icon {
width: 16px;
height: 16px;
position: relative;
margin-right: 10px;
img {
width: 100%;
height: 100%;
position: absolute;
top: 0px;
left: 0px;
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%;
}
}
.body {
width: 100%;
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>