wally
/
plugin-templete
1
0
Fork 1
Code Issues Releases Wiki Activity
Browse Source

考勤打卡

tall-check-work-2
xuesinan 4 years ago
parent
81c010c1b3
commit
abdb8f7514
1 changed files with 547 additions and 261 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 780
      index.html

780
index.html
View File

@ -20,108 +20,148 @@
<div class="w-full p-4 bg-gray-100"> <div class="w-full p-4 bg-gray-100">
<!-- 日常任务面板--> <!-- 日常任务面板-->
<!-- <div class="content p-3 h-46 bg-white rounded-lg"> <div class="content p-3 h-46 bg-white rounded-lg">
<div class="h-6 mb-2 bg-gray-100"></div> <div class="h-6 mb-2 bg-gray-100"></div>
<div class="h-6 mb-2 bg-gray-100"></div> <div class="h-6 mb-2 bg-gray-100"></div>
<div class="h-6 mb-2 bg-gray-100"></div> <div class="h-6 mb-2 bg-gray-100"></div>
<div class="h-6 mb-2 bg-gray-100"></div> <div class="h-6 mb-2 bg-gray-100"></div>
<div class="h-6 bg-gray-100"></div> <div class="h-6 bg-gray-100"></div>
</div> -->
</div> </div>
</div>
<!-- <div class="w-full h-8 bg-blue-500 text-white pl-4 flex items-center">2021年30周</div>-->
<div class="task-bar h-96 w-full bg-gray-100 p-4"> <div class="task-bar h-96 w-full bg-gray-100 p-4">
<div class="flex mb-3"> <div class="flex mb-3">
<!-- <div class="flex flex-col items-center"> <!-- 序号-->
<div class="flex flex-col items-center">
<div class="rounded-full h-8 w-8 mb-1 bg-gray-100 border-2 border-blue-500"></div> <div class="rounded-full h-8 w-8 mb-1 bg-gray-100 border-2 border-blue-500"></div>
<div class="w-8 flex-1 flex flex-col items-center"> <div class="w-8 flex-1 flex flex-col items-center">
<div class="w-0.5 flex-1 bg-gray-300"></div> <div class="w-0.5 flex-1 bg-gray-300"></div>
</div> </div>
</div> --> </div>
<div class="flex-1" style="height: 30rem;"> <div class="flex-1">
<div class="rounded-lg bg-white p-3" style="height: 100%;"> <!-- 定期任务面板-->
<div class="rounded-lg ml-4 bg-white p-3">
<!-- 示例插件1-->
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="alert('hello')">测试组建1</button> <button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="alert('hello')">测试组建1</button>
<!-- 示例插件2 id=100-->
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p100.show()">测试组建2</button> <button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p100.show()">测试组建2</button>
<div data-tname="考勤" data-pid="1451447721818071040" data-uid="1217647686598135808" data-rid="rid333" data-tid="tid444" data-did="did555" style="height:50px;width:100%"> <div data-tname="考勤" data-pid="1458744703108521984" data-uid="1438701238123368448" data-rid="1458744707302825984" data-tid="tid444" data-did="did555" style="height:500px;width:100%">
<div data-root="p1449944565242142720" style="height:100%;width:100%;"> <!-- 考勤插件 -->
<div class="certificate-box px-2 py-1.5 flex justify-between w-full border border-gray-200 rounded-sm text-sm"> <div data-root="p1432643387798069248" style="height:100%;width:100%;">
<p class="w-20 flex-shrink-0 text-gray-400">红头文件</p> <div class="pb-3 flex justify-between items-center border-b">
<div class="certificate py-1 flex justify-end" style="max-width: 100px; max-height: 100px;"> <div class="flex items-center border border-blue-500 rounded-sm">
<img style="max-width: 100%; max-height: 100%;" onclick="p1449944565242142720.bigImg()" src="http://test.tall.wiki/staticrec/plan.png" /> <span class="px-2.5 h-6 leading-6 text-sm text-white bg-blue-500">打卡</span>
<span class="px-2.5 h-6 leading-6 text-sm text-blue-500">请假</span>
</div> </div>
<div onclick="p1432643387798069248.jumpDetails(this)">
<img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" />
</div> </div>
<div class="img-preview fixed z-10 inset-0 bg-black bg-opacity-60 p-4 flex justify-center items-center" style="display: none;">
<img id="img" src="http://test.tall.wiki/staticrec/plan.png" />
</div> </div>
<div class="student-box mt-2.5 px-2 py-1.5 flex justify-between items-center w-full border border-gray-200 rounded-sm text-sm"> <div class="mt-2 px-2">
<p style="color: #999999;">报名人员</p> <div class="flex items-center text-center h-10 border-b">
<button class="check-btn text-xs text-blue-400 border border-blue-400 rounded-full w-10 h-5" onclick="p1449944565242142720.studentList()">查看</button> <div class="text-sm" style="width: 20%;">姓名</div>
<div class="text-sm" style="width: 25%;">早打卡</div>
<div class="text-sm" style="width: 25%;">晚打卡</div>
<div class="text-sm" style="width: 30%;">审核人</div>
</div> </div>
<div class="mt-2.5 py-1.5 w-full border border-gray-200 rounded-sm"> <div class="record-wrap">
<div class="select-teacher px-2 flex justify-between items-center w-full text-sm"> <div class="flex items-center text-center h-10 border-b">
<p class="text-gray-400 truncate w-20">导师委派</p> <div class="text-sm" style="width: 20%;">姓名</div>
<div class="flex justify-end rounded-md startBtnBox" style="width: calc(100% - 5rem)" onclick="p1449944565242142720.show()">
<div class="startBtn mr-1 text-right" style="width: calc(100% - 15px);">请选择委派导师</div> <div class="text-sm" style="width: 25%;">
<img class="direction-icon" style="width: 15px;" src="https://www.tall.wiki/staticrec/icon/down.svg" /> <div class="flex-1">
<button class="morningClockBtn bg-blue-500 text-xs rounded py-1 text-white" style="width: 50px;">早打卡</button>
</div> </div>
</div> </div>
<ul class="teacher-list flex mt-2 px-2" style="display: none;"> <div class="text-sm" style="width: 25%;">
<div class="flex-1">
<button class="nightClockBtn bg-blue-500 text-xs rounded py-1 text-white" style="width: 50px;">晚打卡</button>
</div>
</div>
<div class="text-sm" style="width: 30%;">
<div class="flex flex-nowrap border py-1 px-3 rounded-md" onclick="p1432643387798069248.show()">
<div class="startBtn mr-1">审核人</div>
<img style="width:15px" src="https://www.tall.wiki/staticrec/icon/down.svg" />
</div>
</div>
</div>
</div>
</div>
</ul> <!-- 选择审核人 -->
<div class="w-screen h-screen fixed z-20 statusChoose bg-black bg-opacity-50" style="display:none;top: 0;left: 0;">
<div class="flex flex-col absolute w-full bg-white" style="bottom: 0;">
<div class="flex flex-row justify-between px-5 py-4">
<span class="text-gray-400" onclick="p1432643387798069248.hide()">取消</span>
<span class="font-bold">选择审核人</span>
<span class="text-blue-500" onclick="p1432643387798069248.choose()">确定</span>
</div>
<div class="bg-gray-200" style="width:100%;height: 1px"></div>
<ul class="flex flex-col text-center" style="height: 240px;overflow-y: auto;"></ul>
</div>
</div> </div>
<div class="selected-teacher mt-2.5 p-2 border border-gray-200 rounded-sm w-full text-sm" style="display: none;"> <!-- 打卡弹框 -->
<p class="mb-1" style="color: #999999;">导师委派</p> <div class="w-screen h-screen fixed z-10 clockInPopup bg-black bg-opacity-50" style="display: none; top: 0; left: 0;">
<div class="flex justify-between rounded-md leading-7"> <div class="flex flex-col absolute bg-white rounded-lg" style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%;">
<div class="mr-1">导师</div> <div class="p-4">
<div class="">未接受</div> <div class="h-14 flex justify-center items-center font-bold" style="font-size: 17px;">打卡</div>
<div class="h-12 flex justify-between items-center text-sm" style="border-bottom: 1px solid rgba(0, 0, 0, .1); color: #595959;">
<div>打卡原因</div>
<input class="text-right focus:outline-none" type="text" placeholder="请输入打卡原因" />
</div>
<div class="h-12 flex justify-between items-center text-sm" style="border-bottom: 1px solid rgba(0, 0, 0, .1); color: #595959;">
<div>打卡时间</div>
<div class="flex items-center">
<input class="clockIn text-right focus:outline-none" type="time" value="00:00" />
<img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" />
</div> </div>
<div class="flex justify-between rounded-md leading-7">
<div class="mr-1">导师</div>
<div class="text-green-500">已接受</div>
</div> </div>
<div class="flex justify-between rounded-md leading-7"> <div class="h-12 flex justify-between items-center text-sm" style="border-bottom: 1px solid rgba(0, 0, 0, .1); color: #595959;" onclick="p1432643387798069248.show()">
<div class="mr-1">导师</div> <div>审核人</div>
<div class="text-yellow-500">已拒绝</div> <div class="flex items-center"><span class="checker">周勇</span><img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" /></div>
</div> </div>
<div class="text-xs text-yellow-500 leading-5">拒绝原因：拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因拒绝原因</div>
</div> </div>
<div class="mt-4 flex justify-center items-center w-full text-sm"> <div class="mt-4 flex" style="border-top: 1px solid rgba(0, 0, 0, .1);">
<button class="border border-blue-500 bg-blue-500 text-white rounded-sm" style="width: 45%; height: 34px;" onclick="p1449944565242142720.release()">发布</button> <div class="w-2/4 h-14 flex justify-center items-center" style="font-size: 17px; border-right: 1px solid rgba(0, 0, 0, .1);" onclick="p1432643387798069248.hidePopup()">取消</div>
<div class="w-2/4 h-14 flex justify-center items-center text-blue-500" style="font-size: 17px;" onclick="p1432643387798069248.punch()">提交</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<script> <script>
document.querySelector('.img-preview').onclick = function(e){ var p1432643387798069248 = {
e = window.event || e;
let parentApp = document.getElementById('img');
if(!parentApp.contains(e.target)){
document.querySelector('.img-preview').style.display = 'none';
}
}
var p1449944565242142720 = {
token: '', token: '',
projectId: '', projectId: '',
roleId: '', roleId: '',
dom: '', dom: '',
lists: [], // 培训导师列表 lists: [],
planId: '', // 培训计划id recordList: [], // 打卡列表
isShow: 0, // 教师列表是否展开 0 不展开 1 展开 recordTime: '', // 打卡列表时间
currentIndex: 0, // 当前点击的导师下标 currentIndex: '',
selectedTeachers: [], // 被选中的导师数组 memberId: '', // 打卡人id
checkerId: '', // 审核员id
// checkerName: '', // 审核员
id: '', // 记录id
today: '', // 今天日期
clockType: -1, // 打卡类型 0 早打卡 1 晚打卡
init() { init() {
this.dom = document.querySelector("div[data-root=p1449944565242142720]"); this.dom = document.querySelector("div[data-root=p1432643387798069248]");
var domBox = this.dom.parentNode; var domBox = this.dom.parentNode;
var title = this.dom.querySelector('.title'); var title = this.dom.querySelector('.title');
let currTime = new Date();
this.today = currTime.getFullYear() + '-' + (currTime.getMonth() + 1) + '-' + currTime.getDate();
// 获取父元素携带的参数 // 获取父元素携带的参数
var userId = domBox.getAttribute("data-uid"); var userId = domBox.getAttribute("data-uid");
this.projectId = domBox.getAttribute("data-pid"); this.projectId = domBox.getAttribute("data-pid");
@ -133,7 +173,7 @@
// 获取token // 获取token
getTokenByUserId(userId){ getTokenByUserId(userId){
var that = this var that = this
fetch(`https://www.tall.wiki/gateway/tall/v1.0/users/userId?userId=${userId}`) fetch(`https://test.tall.wiki/gateway/tall3/v3.0/users/userId?userId=${userId}`)
.then(function(response) { .then(function(response) {
return response.json(); return response.json();
}) })
@ -141,276 +181,522 @@
const { success, code, data, msg } = res; const { success, code, data, msg } = res;
if (success && code === 200) { if (success && code === 200) {
that.token = data.token; that.token = data.token;
// 查询培训计划是否待审核 // 查询考勤信息
that.getTrainPlan() // that.getClockQuery()
// 委派导师列表 that.getQueryChecker()
that.getTeacherList()
} else { } else {
console.log('msg: ', msg); console.log('msg: ', msg);
} }
}); });
}, },
// 查询委派的导师列表 /**
getTeacherList() { * 批量查询打卡信息
var that = this; * @param {string} projectId 项目id
fetch(`https://test.tall.wiki/gateway/sports/teacher/getAppoint`, { * @param {Array} codeList
headers: new Headers({ */
'Authorization': 'Bearer ' + that.token, getClockQuery() {
'Content-Type': 'application/json; charset=utf-8' var that = this
}), var timer = null;
let d = new Date()
let startTime = new Date(d).getTime()
const params = JSON.stringify({
param: { projectId: that.projectId,roleId: that.roleId, memberIdList: [], startTime, endTime: startTime }
});
var url = 'https://test.tall.wiki/gateway/defaultwbs/clock/query';
fetch(url, {
method: 'POST', method: 'POST',
body: JSON.stringify({ mode: 'cors',
param: { projectId: that.projectId } body: params,
}) headers: new Headers({
'Authorization': 'Bearer ' + that.token ,'Content-Type': 'application/json;charset=utf-8'
}) })
.then(function(response) { }).then(function(response) {
return response.json(); return response.json();
}) }).catch(function(error){
.then(function(res) { console.error('Error:', error)
}).then(function(res){
const { success, code, data, msg } = res; const { success, code, data, msg } = res;
if (success && code === 200) { if (success && code === 200) {
that.selectedTeachers = data; if(data && data.length && data[0].recordList && data[0].recordList.length){
that.renderTeacherName(); that.recordList = data[0].recordList;
that.recordTime = data[0].dateTime;
let html = '';
for (let i = 0; i < that.recordList.length; i++) {
html += `<div class="record-item-${i} flex items-center text-center h-10 border-b"></div>`;
}
that.dom.querySelector('.record-wrap').innerHTML = html;
for (let i = 0; i < that.recordList.length; i++) {
// let record = that.recordList[i];
that.renderData(i);
}
that.memberId = data[0].recordList[0].memberId
that.id = data[0].recordList[0].id
// 审核人
if (data[0].recordList[0].lastCheckerId) {
that.checkerId = data[0].recordList[0].lastCheckerId
} else if(data[0].recordList[0].checkerId) {
that.checkerId = data[0].recordList[0].checkerId
} else{
that.checkerId = that.lists[0].memberId;
}
let checkerName = '';
if (data[0].recordList[0].lastCheckerName) {
checkerName = data[0].recordList[0].lastCheckerName;
} else if (data[0].recordList[0].checkerName) {
checkerName = data[0].recordList[0].checkerName;
} else {
checkerName = that.lists[0].name;
}
that.dom.querySelector('.checker').innerHTML = checkerName;
}
} else { } else {
console.log('msg: ', msg); console.log('msg: ', msg);
} }
}); })
}, },
// 选中导师名称 /**
renderTeacherName() { * 查询项目成员列表
let that = this; * @param {string} projectId 项目id
if (that.selectedTeachers.length > 0) { * @param {Array} codeList
let names = []; */
for (let i = 0; i < that.selectedTeachers.length; i++) { getQueryChecker() {
names.push(that.selectedTeachers[i].name); var that = this
var timer = null;
let d = new Date()
const params = JSON.stringify({
param: { projectId: that.projectId }
});
var url = 'https://test.tall.wiki/gateway/defaultwbs/deliver/queryChecker';
fetch(url, {
method: 'POST',
mode: 'cors',
body: params,
headers: new Headers({
'Authorization': 'Bearer ' + that.token ,'Content-Type': 'application/json;charset=utf-8'
})
}).then(function(response) {
return response.json();
}).catch(function(error){
console.error('Error:', error)
}).then(function(res){
const { success, code, data, msg } = res;
if (success && code === 200) {
for(var i = 0; i < data.length; i++){
data[i].choose = true
that.lists.push(data[i])
} }
that.dom.querySelector('.startBtn').innerHTML = names; that.getClockQuery()
} else { } else {
that.dom.querySelector('.startBtn').innerHTML = "请选择委派导师"; console.log('msg: ', msg);
} }
})
}, },
// 查询培训计划是否待审核 /**
getTrainPlan(){ * 打卡
var that = this; * @param {string} checkerId 审核员id
// let trainPlan = that.dom.querySelector('.train-release'); * @param {string} clockType 打卡类型 0-早,1-晚
// trainPlan.style.display = 'block'; * @param {string} dateTime 打卡日期
* @param {string} id 记录id(没有则不传)
fetch(`https://test.tall.wiki/gateway/sports/training/get`, { * @param {string} memberId 成员id
headers: new Headers({ */
'Authorization': 'Bearer ' + that.token, punch(){
'Content-Type': 'application/json; charset=utf-8' var that = this
}), let { checkerId, id, memberId, clockType } = that
let d = new Date()
let dateTime = new Date(d).getTime()
const params = JSON.stringify({
param: { checkerId, id, memberId, dateTime, clockType }
});
var url = 'https://test.tall.wiki/gateway/defaultwbs/clock/punch';
fetch(url, {
method: 'POST', method: 'POST',
body: JSON.stringify({ mode: 'cors',
param: {projectId: that.projectId} body: params,
}) headers: new Headers({
'Authorization': 'Bearer ' + that.token ,'Content-Type': 'application/json;charset=utf-8'
}) })
.then(function(response) { }).then(function(response) {
return response.json(); return response.json();
}) }).catch(function(error) {
.then(function(res) { console.error('Error:', error)
}).then(function(res){
const { success, code, data, msg } = res; const { success, code, data, msg } = res;
if (success && code === 200) { if (success && code === 200) {
that.planId = data.id; that.hidePopup();
that.dom.querySelector('.file-name').innerHTML = data.name; // 查询考勤信息
if (data && data.checkStatus === 1) { that.getClockQuery()
// trainPlan.style.display = 'block'; } else {
console.log('msg: ', msg);
}
})
},
// 显示打卡弹框
showPopup(type){
var clockInPopup = this.dom.querySelector('.clockInPopup');
clockInPopup.style.display = 'block';
this.clockType = type;
let time = this.format(new Date());
let clockIn = this.dom.querySelector('.clockIn');
clockIn.value = time;
},
// 隐藏打卡弹框
hidePopup() {
var clockInPopup = this.dom.querySelector('.clockInPopup');
clockInPopup.style.display = 'none';
},
// 显示选择框
show(){
var statusChoose = this.dom.querySelector('.statusChoose');
statusChoose.style.display='block';
var list = ''
for (let i = 0; i < this.lists.length; i++) {
list += `<li class="py-3" onclick="p1432643387798069248.chooseItem(${i})">` + this.lists[i].name + '</li>';
}
var ul = this.dom.querySelector('ul');
ul.innerHTML = list
},
// 选择
chooseItem(index){
this.currentIndex = index;
var lis = this.dom.querySelectorAll('li');
for (var i = 0; i < lis.length; i++){
var item = lis[i];
if(i === index){
item.classList.add('text-white');
item.style.backgroundColor = '#3b82f6';
}else{ }else{
// trainPlan.style.display = 'none' item.classList.remove('text-white');
item.style.backgroundColor = '#fff';
}
} }
},
/**
* 确定 选择审核人
* @param { Array } codeAndAnswerList code和答案
* @param { String } projectId 项目ID
* @param { Number } codeAndAnswerList 提交人类型（0平车 1人）
*/
choose(){
const that = this;
const { dom } = that;
var startBtn = dom.querySelector('.startBtn');
startBtn.innerHTML = that.lists[that.currentIndex].name;
that.dom.querySelector('.checker').innerHTML = that.lists[that.currentIndex].name;
that.checkerId = that.lists[that.currentIndex].memberId;
that.hide();
},
// 取消
hide(){
var statusChoose = this.dom.querySelector('.statusChoose');
statusChoose.style.display='none';
},
// 显示操作面板
showAction(index, type) {
for (let i = 0; i < this.recordList.length; i++) {
this.renderData(i);
}
let action = '';
if (type === 'morning') {
action = this.dom.querySelector('.morning-action-' + index);
} else { } else {
console.log('msg: ', msg); action = this.dom.querySelector('.night-action-' + index);
} }
}); action.style.display = 'inline-block';
},
// 隐藏操作面板
hideAction(index, type) {
let action = '';
if (type === 'morning') {
action = this.dom.querySelector('.morning-action-' + index);
} else {
action = this.dom.querySelector('.night-action-' + index);
}
action.style.display = 'none';
},
// 确认、驳回
rejectStatus(index, type, timeType) {
let record = this.recordList[index];
const param = { id: record.id, type: type, projectId: this.projectId };
if (timeType === 'morning') {
param.morning = record.morning;
} else {
param.night = record.night;
}
this.handleClockAudit(param, index);
},
// 修改时间
changeTimeData(time, index, type) {
let record = this.recordList[index];
let date = new Date(this.recordTime + ' ' + time);
let dateTime = date.getTime();
const param = { id: record.id, type: 0, projectId: this.projectId };
if (type === 'morning') {
param.morning = dateTime;
} else {
param.night = dateTime;
}
this.handleClockAudit(param, index);
}, },
/** /**
* 培训导师列表 * 审核打卡
* @param {string} id 打卡记录id
* @param {string} morning 早打卡时间
* @param {string} night 晚打卡时间
* @param {string} projectId 项目id
* @param {string} type 审批类型(0-修改,1-驳回,2-通过)
*/ */
getAllTeacherList() { handleClockAudit(param, index) {
var that = this; var that = this
fetch(`https://test.tall.wiki/gateway/sports/teacher/query`, {
headers: new Headers({ const params = JSON.stringify({
'Authorization': 'Bearer ' + that.token, param: param
'Content-Type': 'application/json; charset=utf-8' });
}), var url = 'https://test.tall.wiki/gateway/defaultwbs/clock/audit';
fetch(url, {
method: 'POST', method: 'POST',
body: JSON.stringify({ mode: 'cors',
param: {} body: params,
}) headers: new Headers({
'Authorization': 'Bearer ' + that.token ,'Content-Type': 'application/json;charset=utf-8'
}) })
.then(function(response) { }).then(function(response) {
return response.json(); return response.json();
}) }).catch(function(error){
.then(function(res) { console.error('Error:', error)
}).then(function(res){
const { success, code, data, msg } = res; const { success, code, data, msg } = res;
if (success && code === 200) { if (success && code === 200) {
that.lists = data; // that.getClockQuery();
if (param.morning) {
let html = ''; if (param.type === 0) { // 修改
for (let i = 0; i < data.length; i++) { that.recordList[index].morningStatus = 1;
let flag = false, status = 0; } else if (param.type === 1) { // 驳回
for (let j = 0; i < that.selectedTeachers.length; j++) { that.recordList[index].morningStatus = 2;
if (data[i].id == that.selectedTeachers[j].id) { } else if (param.type === 2) { // 审核
flag = true; that.recordList[index].morningStatus = 3;
status = that.selectedTeachers[j].status;
} }
that.recordList[index].morning = param.morning;
} else {
if (param.type === 0) { // 修改
that.recordList[index].nightStatus = 1;
} else if (param.type === 1) { // 驳回
that.recordList[index].nightStatus = 2;
} else if (param.type === 2) { // 审核
that.recordList[index].nightStatus = 3;
} }
html += `<li class="teacher-box w-1/4 h-6 text-xs flex items-center" onclick="p1449944565242142720.chooseItem(${i}, ${data[0].id})"> that.recordList[index].night = param.night;
<input class="teacher-id mr-1" type="checkbox" ${flag && status !== 2 ? 'checked' : ''} ${status !== 0 ? 'disabled' : ''} value="${data[0].name}" />
<span class="teacher-name" style="height: 13px; line-height: 13px;">${data[0].name}</span>
</li>`;
} }
that.dom.querySelector('.teacher-list').innerHTML = html;
} else { } else {
console.log('msg: ', msg); console.log('msg: ', msg);
} }
}); that.renderData(index);
})
}, },
// 显示选择框 // 修改时间
show(){ changePunchTime(index, type) {
this.isShow = this.isShow === 0 ? 1 : 0; if (type === 'morning') {
let teacherBox = this.dom.querySelector('.teacher-list'); this.dom.querySelector('.morning-input-' + index).style.display = 'block';
if (this.isShow) { this.dom.querySelector('.morning-time-' + index).style.display = 'none';
teacherBox.style.display = 'flex';
} else { } else {
teacherBox.style.display = 'none'; this.dom.querySelector('.night-input-' + index).style.display = 'block';
this.dom.querySelector('.night-time-' + index).style.display = 'none';
} }
this.getAllTeacherList(); this.hideAction(index, type);
}, },
// 选择导师 // 数据渲染
chooseItem(index, id){ renderData(index) {
let flag = false, t_index = -1; let that = this;
let teacher_input = this.dom.querySelectorAll('.teacher-box')[index].getElementsByTagName('input')[0]; let html = '';
let name = teacher_input.value; let record = that.recordList[index];
let morning = Number(record.morning) ? that.format(Number(record.morning)) : '';
let night = Number(record.night) ? that.format(Number(record.night)) : '';
// 被选中的导师id是否在委派导师列表中 html += `<div class="text-sm" style="width: 20%;">${record.memberName}</div>`;
if (this.selectedTeachers.length > 0) {
for (let i = 0; i < this.selectedTeachers.length; i++) { html += `<div class="text-sm" style="width: 25%;">`;
if (id === this.selectedTeachers[i].id) { // 早打卡
flag = true; html += `<div class="morning-punch-box-${index} relative inline-block max-w-full">`;
t_index = i;
} if (!record.isMine && !record.isChecker) {
if (record.morningStatus === 2) {
html += `<div class="line-through">${morning}</div>`;
} else {
html += `<div class="">${morning ? morning : '未打卡'}</div>`;
} }
} }
if (teacher_input.checked) { if (record.isMine) {
if (!flag) { if (record.morningStatus === 1) {
this.selectedTeachers.push({id: id, name: name}); html += `<div class="relative font-bold inline-block">${morning}
<span class="absolute inline-block rounded-full bg-red-500" style="top: 0; right: -10px; width: 6px; height: 6px;"></span>
</div>`;
} else if (record.morningStatus === 2) {
html += `<div class="line-through font-bold">${morning}</div>`;
} else if (record.morningStatus === 3) {
html += `<div class="font-bold">${morning}</div>`;
} else if (that.today !== that.recordTime) {
html += `<div>未打卡</div>`;
} else {
html += `<button class="morningClockBtn m-auto py-1 rounded bg-blue-500 text-xs text-white" style="width: 50px;" onclick="p1432643387798069248.showPopup(0)">早打卡</button>`;
}
} }
if (record.isChecker) {
html += `<input class="morning-input-${index} border max-w-full focus:outline-none" style="display: none;" type="time" value="${morning}" onblur="p1432643387798069248.changeTimeData(this.value, ${index}, 'morning')" />`;
if (record.morningStatus === 1) {
html += `<div class="morning-time-${index} relative inline-block" onclick="p1432643387798069248.showAction(${index}, 'morning')">${morning}
<span class="absolute inline-block rounded-full bg-red-500" style="top: 0; right: -10px; width: 6px; height: 6px;"></span>
</div>`;
} else if (record.morningStatus === 2) {
html += `<div class="morning-time-${index} line-through" onclick="p1432643387798069248.showAction(${index}, 'morning')">${morning}</div>`;
} else if (record.morningStatus === 3) {
html += `<div class="morning-time-${index}" onclick="p1432643387798069248.showAction(${index}, 'morning')">${morning}</div>`;
} else { } else {
if (t_index > -1) { html += `<div class="morning-time-${index}" onclick="p1432643387798069248.showAction(${index}, 'morning')">未打卡</div>`;
this.selectedTeachers.splice(t_index, 1);
} }
} }
this.renderTeacherName(); // 操作面板
}, html += `<div class="morning-action-${index} absolute bg-white shadow-lg" style="display: none; bottom: 30px; left: -74px; border-radius: 5px; width: 248px;">
<div class="relative flex justify-between" style="padding: 8px;">
<button class="text-white bg-green-500" style="width: 52px; height: 26px; border-radius: 5px;" onclick="p1432643387798069248.rejectStatus(${index}, 2, 'morning')">审核</button>
<button class="text-white bg-red-500" style="width: 52px; height: 26px; border-radius: 5px;" onclick="p1432643387798069248.rejectStatus(${index}, 1, 'morning')">驳回</button>
<button class="text-white bg-blue-500" style="width: 52px; height: 26px; border-radius: 5px;" onclick="p1432643387798069248.changePunchTime(${index}, 'morning')">修改</button>
<button class="border" style="width: 52px; height: 26px; border-radius: 5px; border-color: #999; color: #595959;" onclick="p1432643387798069248.hideAction(${index}, 'morning')">取消</button>
<div class="absolute w-0 h-0" style="left: 88px; top: 42px; font-size: 0; line-height: 0; border-width: 7px; border-color: #fff transparent transparent;"></div>
</div>
</div>`;
// 选中的数据渲染 html += `</div>`;
renderData() { html += `</div>`;
let d = this.selected;
let lis = this.dom.querySelectorAll('.teacher-name'); html += `<div class="text-sm" style="width: 25%;">`;
for (let i = 0; i < lis.length; i++) { // 晚打卡
let item = lis[i]; html += `<div class="night-punch-box relative max-w-full inline-block">`;
item.classList.remove('text-white');
item.style.backgroundColor = '#fff'; if (!record.isMine && !record.isChecker) {
let teacher_id = item.getAttribute('data-id'); if (record.nightStatus === 2) {
for (let j = 0; j < d.length; j++) { html += `<div class="line-through">${night}</div>`;
if (teacher_id === d[j]) { } else {
item.classList.add('text-white'); html += `<div class="">${night ? night : '未打卡'}</div>`;
item.style.backgroundColor = '#3b82f6';
} }
} else {
if (record.isMine) {
if (record.nightStatus === 1) {
html += `<div class="relative font-bold inline-block">${night}
<span class="absolute inline-block rounded-full bg-red-500" style="top: 0; right: -10px; width: 6px; height: 6px;"></span>
</div>`;
} else if (record.nightStatus === 2) {
html += `<div class="line-through font-bold">${night}</div>`;
} else if (record.nightStatus === 3) {
html += `<div class="font-bold">${night}</div>`;
} else if (that.today !== that.recordTime) {
html += `<div>未打卡</div>`;
} else {
html += `<button class="nightClockBtn m-auto py-1 rounded bg-blue-500 text-xs text-white" style="width: 50px;" onclick="p1432643387798069248.showPopup(1)">晚打卡</button>`;
} }
} }
},
// 发布 if (record.isChecker) {
release() { html += `<input class="night-input-${index} border max-w-full focus:outline-none" style="display: none;" type="time" value="${night}" onblur="p1432643387798069248.changeTimeData(this.value, ${index}, 'night')" />`;
let that = this;
if (record.nightStatus === 1) {
html += `<div class="night-time-${index} relative inline-block" onclick="p1432643387798069248.showAction(${index}, 'night')">${night}
<span class="absolute inline-block rounded-full bg-red-500" style="top: 0; right: -10px; width: 6px; height: 6px;"></span>
</div>`;
} else if (record.nightStatus === 2) {
html += `<div class="night-time-${index} line-through" onclick="p1432643387798069248.showAction(${index}, 'night')">${night}</div>`;
} else if (record.nightStatus === 3) {
html += `<div class="night-time-${index}" onclick="p1432643387798069248.showAction(${index}, 'night')">${night}</div>`;
} else {
html += `<div class="night-time-${index}" onclick="p1432643387798069248.showAction(${index}, 'night')">未打卡</div>`;
}
}
}
if (that.selectedTeachers.length <= 0) { html += `<div class="night-action-${index} absolute bg-white shadow-lg" style="display: none; bottom: 30px; right: -74px; border-radius: 5px; width: 248px;">
window.alert("请选择培训导师"); <div class="relative flex justify-between" style="padding: 8px;">
return false; <button class="text-white bg-green-500" style="width: 52px; height: 26px; border-radius: 5px;" onclick="p1432643387798069248.rejectStatus(${index}, 2, 'night')">审核</button>
} <button class="text-white bg-red-500" style="width: 52px; height: 26px; border-radius: 5px;" onclick="p1432643387798069248.rejectStatus(${index}, 1, 'night')">驳回</button>
<button class="text-white bg-blue-500" style="width: 52px; height: 26px; border-radius: 5px;" onclick="p1432643387798069248.changePunchTime(${index}, 'night')">修改</button>
let teacherList = that.dom.querySelector('.selected-teacher'); // 选择导师 <button class="border" style="width: 52px; height: 26px; border-radius: 5px; border-color: #999; color: #595959;" onclick="p1432643387798069248.hideAction(${index}, 'night')">取消</button>
let teacherSelect = that.dom.querySelector('.select-teacher'); // 已委派的导师 <div class="absolute w-0 h-0" style="right: 88px; top: 42px; font-size: 0; line-height: 0; border-width: 7px; border-color: #fff transparent transparent;"></div>
let releaseBtn = that.dom.querySelector('.release-btn'); // 发布按钮 </div>
teacherList.style.display = 'block'; </div>`;
teacherSelect.style.display = 'flex';
releaseBtn.style.display = 'none';
let studentBox = that.dom.querySelector('.student-box'); // 查看学员
studentBox.style.display = 'block';
// let ids = [];
// for (let i = 0; i < that.selectedTeachers.length; i++) {
// ids.push(that.selectedTeachers[i].id);
// }
// fetch(`https://test.tall.wiki/gateway/sports/teacher/appoint`, {
// headers: new Headers({
// 'Authorization': 'Bearer ' + that.token,
// 'Content-Type': 'application/json; charset=utf-8'
// }),
// method: 'POST',
// body: JSON.stringify({
// planId: that.planId,
// teacherIds: ids
// })
// })
// .then(function(response) {
// return response.json();
// })
// .then(function(res) {
// const { success, code, data, msg } = res;
// if (success && code === 200) {
// let teacherList = that.dom.querySelector('.selected-teacher'); // 选择导师
// let teacherSelect = that.dom.querySelector('.select-teacher'); // 已委派的导师
// let releaseBtn = that.dom.querySelector('.release-btn'); // 发布按钮
// teacherList.style.display = 'block';
// teacherSelect.style.display = 'flex';
// releaseBtn.style.display = 'none';
// let studentBox = that.dom.querySelector('.student-box'); // 查看学员
// studentBox.style.display = 'block';
// } else {
// console.log('msg: ', msg);
// }
// });
},
// 预览 html += `</div>`;
bigImg() { html += `</div>`;
document.querySelector('.img-preview').style.display = 'flex';
let checker = record.lastCheckerId ? record.lastCheckerName : record.checkerName ? record.checkerName : that.lists[0].name;
html += `<div class="text-sm" style="width: 30%;">`;
if (!record.isMine || record.isMine && record.morningStatus && record.nightStatus || that.today !== that.recordTime) {
html += `<div class="mr-1">${record.checkerName ? record.checkerName : that.lists[0].name}</div>`;
} else {
html += `<div class="flex flex-nowrap border py-1 px-3 rounded-md" onclick="p1432643387798069248.show()">`;
html += `<div class="startBtn mr-1">${checker}</div>`;
html += `<img style="width:15px" src="https://www.tall.wiki/staticrec/icon/down.svg" />`;
html += `</div>`;
}
html += `</div>`;
that.dom.querySelector('.record-item-' + index).innerHTML = html;
}, },
// 查看红头文件 // 时间戳转时间格式
checkFile() { format(shijianchuo){
const pId = this.dom.parentNode.getAttribute('data-pid'); //shijianchuo是整数，否则要parseInt转换
const uId = this.dom.parentNode.getAttribute('data-uid'); var time = new Date(shijianchuo);
const rId = this.dom.parentNode.getAttribute('data-rid'); // var y = time.getFullYear();
location.href = `https://test.tall.wiki/ts/file?pid=${pId}&uid=${uId}&rid=${rId}` // var m = time.getMonth()+1;
// var d = time.getDate();
var h = time.getHours();
var mm = time.getMinutes();
// var s = time.getSeconds();
return this.add0(h)+':' + this.add0(mm);
}, },
add0(m){return m<10?'0'+m:m },
// 跳转详情 // 跳转详情
studentList() { jumpDetails(that) {
const pId = this.dom.parentNode.getAttribute('data-pid'); const pId = this.dom.parentNode.getAttribute('data-pid');
const uId = this.dom.parentNode.getAttribute('data-uid'); const uId = this.dom.parentNode.getAttribute('data-uid');
const rId = this.dom.parentNode.getAttribute('data-rid'); const rId = this.dom.parentNode.getAttribute('data-rid');
location.href = `https://test.tall.wiki/ts/peopleList?pid=${pId}&uid=${uId}&rid=${rId}`; location.href = `https://test.tall.wiki/checkwork/?pid=${pId}&uid=${uId}&rid=${rId}`;
} }
} }
p1449944565242142720.init() p1432643387798069248.init()
</script> </script>
</div> </div>
</div> </div>

Write Preview
Loading…
Cancel
Save