style:新版面授课界面添加

This commit is contained in:
wyx
2023-03-14 18:50:18 +08:00
parent f8816f0df4
commit fa431338c8
13 changed files with 2558 additions and 596 deletions

View File

@@ -17,15 +17,29 @@
</div>
<div class="main">
<div class="titl">
<div class="endtime">
起止时间{{
datasource && datasource.startTime ? datasource.startTime : "-"
}}
{{ datasource && datasource.endTime ? datasource.endTime : "-" }}
</div>
<div class="endtime" style="margin-left: 64px">
允许签到时段{{ beginTime }}~{{ endTime }}
<div
style="width: 100%;height:220px;display: flex;flex-wrap: nowrap;overflow-x: scroll;">
<div v-for="item,n in [1,2,3]" :key="n" style="cursor: pointer;">
<div
@click="ChoiceCourse(item)"
style="width: 360px;height:180px;margin-right: 32px;display: flex;flex-direction: column;padding: 16px;"
:style="{background:item==currentCourse?'rgb(247, 251, 253)':'rgb(250, 250, 250)'}">
<div style="font-size: 16px;">{{item}}次开课</div>
<div style="font-size: 14px;margin-top: 12px;">2023年管理者面授课程{{item}}</div>
<div style="font-size: 14px;">
<img src="../../../assets/images/courseManage/time.png" alt="" srcset="" style="width:16px;height:16px;">
2023.3.14 12:34 ~ 2023.3.17 12:34
</div>
<div style="font-size: 14px;margin-top: 6px;margin-bottom: 6px;">
<img src="../../../assets/images/courseManage/position.png" alt="" srcset="" style="width:16px;height:16px;">
京东方大厦{{item}}号楼
</div>
<div style="font-size: 14px;">
<img src="../../../assets/images/courseManage/persion.png" alt="" srcset="" style="width:16px;height:16px;">
董瑞华
</div>
</div>
</div>
</div>
</div>
@@ -39,12 +53,12 @@
placeholder="请输入姓名"
/>
</div>
<!-- <div class="namecon" style="margin-right: 30px">
<div class="namecon" style="margin-right: 30px">
<div class="name">考勤</div>
<div class="select">
<a-select
v-model:value="projectName"
style="width: 160px"
style="width: 200px"
placeholder="请选择"
:options="projectNameList"
@change="selectProjectName"
@@ -52,7 +66,7 @@
showSearch
></a-select>
</div>
</div> -->
</div>
<div class="namecon">
<div class="name">签到状态</div>
<div class="select">
@@ -76,7 +90,7 @@
<div class="img1"></div>
<div class="wz">搜索</div>
</div>
<div class="btn btn2" @click="resetTaskList">
<div class="btn btn1" @click="resetTaskList">
<div class="img2"></div>
<div class="wz">重置</div>
</div>
@@ -94,10 +108,10 @@
<div class="img1"></div>
<div class="wz">导入学员</div>
</div>
<div class="btn btn2" @click="showCopyModal">
<div class="btn btn1" @click="showCopyModal" style="margin-right: 20px">
<div class="wz">批量签到</div>
</div>
<div class="btn btn2" @click="exportTaskStu">
<div class="btn btn1" @click="exportTaskStu">
<div class="img2"></div>
<div class="wz">导出数据</div>
</div>
@@ -122,7 +136,6 @@
style="border: 1px solid #f2f6fe"
:columns="tableDataFunc()"
:data-source="tabledata"
:loading="tableDataTotal === -1 ? true : false"
expandRowByClick="true"
@expand="expandTable"
:scroll="{ x: 1300 }"
@@ -232,6 +245,7 @@ import TwoDimensionalCode from "../../../components/TwoDimensionalCode";
import { message } from "ant-design-vue";
import { toDate } from "../../../api/method";
import {checkPer} from "@/utils/utils";
export default {
name: "FaceManage",
components: {
@@ -270,6 +284,7 @@ export default {
closeStop: false, //签退弹窗关闭图标
signQRvisible: false, //二维码弹窗
name: null,
projectName: undefined,
projectName2: undefined,
showmodal: false, //勾选提示框
closable: false, //modal右上角的关闭按钮
@@ -282,23 +297,23 @@ export default {
projectNameList: [
{
id: 1,
value: "项目一",
label: "项目一",
value: "签到",
label: "签到",
},
{
id: 2,
value: "项目二",
label: "项目二",
value: "缺勤",
label: "缺勤",
},
{
id: 3,
value: "项目三",
label: "项目三",
value: "迟到",
label: "迟到",
},
{
id: 4,
value: "项目四",
label: "项目四",
value: "请假",
label: "请假",
},
],
projectNameList2: [
@@ -349,7 +364,13 @@ export default {
codeInfo: null, //二维码内容
beginTime: null, //签到开始时间
endTime: null, //签到结束时间
currentCourse: 1,
});
const ChoiceCourse = (n) => {
state.currentCourse = n;
}
const afterVisibleChange = (bol) => {
if (bol == true) {
getStudent();
@@ -541,6 +562,38 @@ export default {
);
},
},
{
title: "考勤",
dataIndex: "signTime",
key: "signTime",
width: 110,
align: "center",
ellipsis: true,
className: "h",
customRender: (text) => {
return (
<div class="racona">
<span>{text.record.signTime ? text.record.signTime : "-"}</span>
</div>
);
},
},
{
title: "签到状态",
dataIndex: "signTime",
key: "signTime",
width: 110,
align: "center",
ellipsis: true,
className: "h",
customRender: (text) => {
return (
<div class="racona">
<span>{text.record.signTime ? text.record.signTime : "-"}</span>
</div>
);
},
},
// {
// title: "签退时间",
// dataIndex: "jin",
@@ -549,45 +602,6 @@ export default {
// align: "center",
// className: "h",
// },
{
title: "考勤",
dataIndex: "signStatus",
key: "signStatus ",
width: 50,
align: "center",
ellipsis: true,
className: "h",
customRender: (text) => {
// console.log("text", text);
return (
<div class="racona">
<span>
{text.record.signStatus
? "签到"
: text.record.leaveStatus
? "请假"
: "-"}
</span>
</div>
);
},
},
{
title: "签到状态",
dataIndex: "signStatus",
key: "signStatus",
width: 50,
align: "center",
ellipsis: true,
className: "h",
customRender: (text) => {
return (
<div class="racona">
<span>{text.record.signStatus == null && new Date().getTime() > new Date(state.endTime).getTime() ? "异常" : text.record.signStatus ? "正常" : text.record.leaveStatus ? "异常" : text.record.signStatus == null ? "-" : "异常"}</span>
</div>
);
},
},
{
title: "考勤情况",
ellipsis: true,
@@ -669,83 +683,6 @@ export default {
>
请假
</a-radio>
{/**
<a-checkbox
checked={text.record.signIn}
onChange={(e) => {
let obj = {
courseId: Number(props.datasource.courseId),
// projectId: 0,
routerId: Number(props.datasource.routerId),
ids: [text.record.studentId],
studentName: text.record.studentName,
taskId: Number(props.datasource.routerTaskId),
taskType: Number(props.datasource.type),
type: 2,
// userName: "",
};
api
.attendanceSign(obj, (res) => {
console.log("签到结果", res, obj, e);
if (res.data.code === 200) {
text.record.signIn = true;
}
})
.catch((err) => {
console.log("签到失败", err, obj);
text.record.signIn = false;
});
// console.log(
// "点击签到",
// e,
// text.record,
// props.datasource,
// obj
// );
}}
>
签到
</a-checkbox>
<a-checkbox
checked={text.record.leave}
onChange={(e) => {
console.log("点击请假", e, props.datasource);
let obj = {
courseId: Number(props.datasource.courseId),
// projectId: 0,
routerId: Number(props.datasource.routerId),
studentId: Number(text.record.studentId),
studentName: text.record.studentName,
taskId: Number(props.datasource.routerTaskId),
taskType: Number(props.datasource.type),
type: 2,
// userName: "",
};
api
.attendanceLeave(obj, (res) => {
console.log("请假结果", res, obj, e);
if (res.data.code === 200) {
text.record.leave = true;
}
})
.catch((err) => {
console.log("请假结果", err, obj);
text.record.leave = false;
});
}}
>
请假
</a-checkbox>
<a-checkbox
checked={value.signOut}
onChange={(e) => {
console.log("点击签退", e);
}}
>
签退
</a-checkbox>
*/}
</div>
);
},
@@ -797,6 +734,7 @@ export default {
.catch((err) => {
console.log(err);
state.tabledata = [];
state.tabledata = [{name:'测试数据'}];
});
};
//搜索学员
@@ -808,6 +746,7 @@ export default {
};
// 重置按钮
function resetTaskList() {
state.projectName = undefined;
state.currentPage = 1;
state.name = null;
state.projectName2 = undefined;
@@ -832,21 +771,6 @@ export default {
props.datasource.chapterId
}&type=3&pid=${props.datasource.courseId}&thirdType=7&taskId=${props.datasource.routerTaskId}`
);
// api
// .exportTaskStudent({
// pageNo: state.currentPage,
// pageSize: state.pageSize,
// currentStageId: props.datasource.stageId,
// currentTaskId: props.datasource.projectTaskId,
// type: 1,
// pid: props.datasource.projectId,
// })
// .then((res) => {
// console.log(res);
// })
// .catch((err) => {
// console.log(err);
// });
}
//二维码
@@ -929,6 +853,7 @@ export default {
qrcodeVisible,
AddImpStuvisibleClose,
batchSign,
ChoiceCourse,
};
},
};
@@ -1147,7 +1072,7 @@ export default {
.img2 {
width: 16px;
height: 18px;
background-image: url(../../../assets/images/courseManage/reset1.png);
background-image: url(../../../assets/images/courseManage/reset0.png);
background-size: 100% 100%;
margin-right: 7px;
}
@@ -1188,7 +1113,7 @@ export default {
.img2 {
width: 17px;
height: 16px;
background-image: url(../../../assets/images/coursewareManage/export.png);
background-image: url(../../../assets/images/coursewareManage/export1.png);
background-size: 100% 100%;
margin-right: 7px;
}