1 changed files with 490 additions and 437 deletions
@ -1,443 +1,496 @@ |
|||||
<!DOCTYPE html> |
<!DOCTYPE html> |
||||
<html lang="zh-CN"> |
<html lang="zh-CN"> |
||||
<head> |
<head> |
||||
<meta charset="UTF-8"> |
<meta charset="UTF-8"> |
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> |
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> |
||||
<title>插件模板</title> |
<title>插件模板</title> |
||||
<link rel="stylesheet" href="https://unpkg.com/tailwindcss@2.2.4/dist/tailwind.css"> |
<link rel="stylesheet" href="https://unpkg.com/tailwindcss@2.2.4/dist/tailwind.css"> |
||||
<!-- <link rel="stylesheet" type="text/css" href="style.css" /> --> |
<!-- <link rel="stylesheet" type="text/css" href="style.css" /> --> |
||||
<!-- <script type="text/javascript" src="plugin.js"></script> --> |
<!-- <script type="text/javascript" src="plugin.js"></script> --> |
||||
</head> |
</head> |
||||
<body> |
<body> |
||||
<div class=""> |
<div class=""> |
||||
<div class="h-10 w-full flex justify-center items-center border-b-2">项目名称</div> |
<div class="h-10 w-full flex justify-center items-center border-b-2">项目名称</div> |
||||
<!-- 角色栏--> |
<!-- 角色栏--> |
||||
<div class="w-full h-16 flex items-center border-b-2"> |
<div class="w-full h-16 flex items-center border-b-2"> |
||||
<div class="p-2 m-4">项目经理</div> |
<div class="p-2 m-4">项目经理</div> |
||||
<div class="p-2 m-4 border-b-2 border-blue-500 text-blue-400">运维</div> |
<div class="p-2 m-4 border-b-2 border-blue-500 text-blue-400">运维</div> |
||||
</div> |
</div> |
||||
|
|
||||
<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="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"> |
<div class="flex-1"> |
||||
<!-- 定期任务面板--> |
<!-- 定期任务面板--> |
||||
<div class="rounded-lg ml-4 bg-white p-3"> |
<div class="rounded-lg ml-4 bg-white p-3"> |
||||
<!-- 示例插件1--> |
<!-- 示例插件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" |
||||
<!-- 示例插件2 id=100--> |
onclick="alert('hello')">测试组建1</button> |
||||
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p100.show()">测试组建2</button> |
<!-- 示例插件2 id=100--> |
||||
|
<button class="bg-blue-500 py-2 px-5 rounded text-white" |
||||
<div data-tname="考勤" |
onclick="p100.show()">测试组建2</button> |
||||
data-pid="1473556016628244480" |
|
||||
data-uid="1217647686598135808" |
<div data-tname="考勤" data-pid="1473556016628244480" data-uid="1217647686598135808" |
||||
data-rid="1473556018582790144" |
data-rid="1473556018582790144" |
||||
data-token="eyJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE2NTM2MTQwOTksInN1YiI6IjE0ODE0NTg3NDEyOTU3MTQzMDQiLCJhdXRoSWQiOiIxNDgxNDU4NzQxNTMwNTk1MzI4IiwiZXhwIjoxNjUzNjIxMjk5fQ.kM15-gERv5j5qWBeWEG0kDxLWMJesHInnwFQnUaKcGg" |
data-token="eyJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE2NTM2MTQwOTksInN1YiI6IjE0ODE0NTg3NDEyOTU3MTQzMDQiLCJhdXRoSWQiOiIxNDgxNDU4NzQxNTMwNTk1MzI4IiwiZXhwIjoxNjUzNjIxMjk5fQ.kM15-gERv5j5qWBeWEG0kDxLWMJesHInnwFQnUaKcGg" |
||||
data-url="http://101.201.226.163:7320/v1.0" |
data-url="http://101.201.226.163:7320/v1.0" data-type="1" data-tid="tid444" |
||||
data-type="1" |
data-did="did555" style="height:500px;width:100%"> |
||||
data-tid="tid444" |
<!-- 考勤插件 --> |
||||
data-did="did555" |
<div data-root="p1473554031225085952" style="height: 100%; width: 100%;"> |
||||
style="height:500px;width:100%" |
<div class="pb-3 flex justify-between items-center"> |
||||
> |
<div class="flex items-center border border-blue-500 rounded-sm"> |
||||
<!-- 考勤插件 --> |
<span class="px-2 py-1.5 text-sm text-white bg-blue-500 rounded-sm" |
||||
<div data-root="p1473554031225085952" style="height: 100%; width: 100%;"> |
onclick="p1473554031225085952.showPopup()">请假申请</span> |
||||
<div class="pb-3 flex justify-between items-center"> |
</div> |
||||
<div class="flex items-center border border-blue-500 rounded-sm"> |
|
||||
<span class="px-2 py-1.5 text-xs text-white bg-blue-500">今日请假</span> |
<div class="flex items-center"> |
||||
<span class="px-2 py-1.5 text-xs text-blue-500">我的请假</span> |
|
||||
</div> |
<div class="ml-2" onclick="p1473554031225085952.jumpDetails(this)"> |
||||
|
<!-- <img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" /> --> |
||||
<div class="flex items-center"> |
<span class="text-blue-500 text-xs">查看更多</span> |
||||
<span class="px-2 py-1.5 text-xs text-white bg-blue-500 rounded-sm" onclick="p1473554031225085952.showPopup()">请假申请</span> |
</div> |
||||
<div class="ml-2" onclick="p1473554031225085952.jumpDetails(this)"> |
</div> |
||||
<!-- <img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" /> --> |
</div> |
||||
<span class="text-blue-500 text-xs">查看更多</span> |
|
||||
|
<div class="border-t border-gray-200"> |
||||
|
<div class="border-b text-center flex items-center"> |
||||
|
<div class="px-1 py-2 text-sm" style="width: 20%;">姓名</div> |
||||
|
<div class="px-1 py-2 text-sm" style="width: 16%;">类型</div> |
||||
|
<div class="px-1 py-2 text-sm" style="width: 42%;">时间</div> |
||||
|
<div class="px-1 py-2 text-sm" style="width: 22%;">审核状态</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="record-wrap"> |
||||
|
<div class="py-1.5 flex items-center text-center border-b"> |
||||
|
<div class="px-1 text-sm" style="width: 20%;">张三</div> |
||||
|
<div class="px-1 text-sm" style="width: 16%;">加班</div> |
||||
|
<div class="px-1 text-sm" style="width: 42%;"> |
||||
|
<div>5.21 09:00</div>-<div>5.21 18:00</div> |
||||
|
</div> |
||||
|
<div class="px-1 text-sm" style="width: 22%;"> |
||||
|
<div |
||||
|
class="inline-block px-2 py-1.5 text-xs text-white bg-blue-500 rounded-sm"> |
||||
|
通过</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="py-1.5 flex items-center text-center border-b"> |
||||
|
<div class="px-1 text-sm" style="width: 20%;">薛思男</div> |
||||
|
<div class="px-1 text-sm" style="width: 16%;">请假</div> |
||||
|
<div class="px-1 text-sm" style="width: 42%;">5.21 9:00 - 5.21 18:00 |
||||
|
</div> |
||||
|
<div class="px-1 text-sm" style="width: 22%;">待审批</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="py-1.5 flex items-center text-center border-b"> |
||||
|
<div class="px-1 text-sm" style="width: 20%;">张三</div> |
||||
|
<div class="px-1 text-sm" style="width: 16%;">调休</div> |
||||
|
<div class="px-1 text-sm" style="width: 42%;">5.21 9:00 - 5.21 18:00 |
||||
|
</div> |
||||
|
<div class="px-1 text-sm" style="width: 22%;">待审批</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="py-1.5 flex items-center text-center border-b"> |
||||
|
<div class="px-1 text-sm" style="width: 20%;">张三</div> |
||||
|
<div class="px-1 text-sm" style="width: 16%;">弹性</div> |
||||
|
<div class="px-1 text-sm" style="width: 42%;">5.21 9:00 - 5.21 18:00 |
||||
|
</div> |
||||
|
<div class="px-1 text-sm" style="width: 22%;">待审批</div> |
||||
|
</div> |
||||
|
</div> |
||||
</div> |
</div> |
||||
|
|
||||
|
<!-- 请假弹框 --> |
||||
|
<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 flex-col absolute bg-white rounded-lg" |
||||
|
style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%;"> |
||||
|
<div class="p-4"> |
||||
|
<div class="pt-1 pb-2 flex justify-center items-center font-bold" |
||||
|
style="font-size: 17px;">请假申请</div> |
||||
|
|
||||
|
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
||||
|
<div class="text-right" style="width: 80px">时间:</div> |
||||
|
<input |
||||
|
class="start-time px-1 focus:outline-none border border-gray-300 rounded" |
||||
|
style="width: 180px; height: 32px" type="datetime-local" /> |
||||
|
</div> |
||||
|
|
||||
|
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
||||
|
<div class="text-right" style="width: 80px"></div> |
||||
|
<input |
||||
|
class="end-time px-1 focus:outline-none border border-gray-300 rounded" |
||||
|
style="width: 180px; height: 32px" type="datetime-local" /> |
||||
|
</div> |
||||
|
|
||||
|
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
||||
|
<div class="text-right" style="width: 80px">类型:</div> |
||||
|
<label class="flex items-center"><input class="mr-1" type="radio" |
||||
|
name="type" value="请假" checked />请假</label> |
||||
|
<label class="ml-3 flex items-center"><input class="mr-1" |
||||
|
type="radio" name="type" value="调休" />调休</label> |
||||
|
<label class="ml-3 flex items-center"><input class="mr-1" |
||||
|
type="radio" name="type" value="加班" />加班</label> |
||||
|
<label class="ml-3 flex items-center"><input class="mr-1" |
||||
|
type="radio" name="type" value="弹性" />弹性</label> |
||||
|
</div> |
||||
|
|
||||
|
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
||||
|
<div class="text-right" style="width: 80px">时长:</div> |
||||
|
<input |
||||
|
class="punch-reason px-1 focus:outline-none border border-gray-300 rounded" |
||||
|
style="width: 180px; height: 32px" type="number" /> |
||||
|
<span class="ml-1">天</span> |
||||
|
</div> |
||||
|
|
||||
|
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
||||
|
<div class="text-right" style="width: 80px">请假方式:</div> |
||||
|
<label class="flex items-center"><input class="mr-1" type="radio" |
||||
|
name="leaveType" value="微信" checked />微信</label> |
||||
|
<label class="ml-3 flex items-center"><input class="mr-1" |
||||
|
type="radio" name="leaveType" value="口头" />口头</label> |
||||
|
<label class="ml-3 flex items-center"><input class="mr-1" |
||||
|
type="radio" name="leaveType` " value="PT" />PT</label> |
||||
|
</div> |
||||
|
|
||||
|
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
||||
|
<div class="text-right" style="width: 80px">审核人:</div> |
||||
|
<input |
||||
|
class="reviewer-1 px-1 focus:outline-none border border-gray-300 rounded" |
||||
|
style="width: 180px; height: 32px" type="text" |
||||
|
onFocus="p1473554031225085952.show(1)" /> |
||||
|
</div> |
||||
|
|
||||
|
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
||||
|
<div class="text-right" style="width: 80px"></div> |
||||
|
<input |
||||
|
class="reviewer-2 px-1 focus:outline-none border border-gray-300 rounded" |
||||
|
style="width: 180px; height: 32px" type="text" |
||||
|
onFocus="p1473554031225085952.show(2)" /> |
||||
|
</div> |
||||
|
|
||||
|
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
||||
|
<div class="text-right" style="width: 80px"></div> |
||||
|
<input |
||||
|
class="reviewer-3 px-1 focus:outline-none border border-gray-300 rounded" |
||||
|
style="width: 180px; height: 32px" type="text" |
||||
|
onFocus="p1473554031225085952.show(3)" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="mt-4 flex" style="border-top: 1px solid rgba(0, 0, 0, .1);"> |
||||
|
<div class="w-2/4 h-14 flex justify-center items-center" |
||||
|
style="font-size: 16px; border-right: 1px solid rgba(0, 0, 0, .1);" |
||||
|
onclick="p1473554031225085952.hidePopup()">取消</div> |
||||
|
<div class="w-2/4 h-14 flex justify-center items-center text-blue-500" |
||||
|
style="font-size: 16px;" onclick="p1473554031225085952.punch()">提交 |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
|
<!-- 选择审核人 --> |
||||
<div class="border-t border-gray-200"> |
<div class="w-screen h-screen fixed z-20 statusChoose bg-black bg-opacity-50" |
||||
<div class="border-b text-center flex items-center"> |
style="display:none;top: 0;left: 0;"> |
||||
<div class="p-1 text-sm" style="width: 18%;">姓名</div> |
<div class="flex flex-col absolute w-full bg-white" style="bottom: 0;"> |
||||
<div class="p-1 text-sm" style="width: 18%;">类型</div> |
<div class="flex flex-row justify-between px-5 py-4"> |
||||
<div class="p-1 text-sm" style="width: 28%;">时间</div> |
<span class="text-gray-400" |
||||
<div class="p-1 text-sm" style="width: 18%;">时长(天)</div> |
onclick="p1473554031225085952.hide()">取消</span> |
||||
<div class="p-1 text-sm" style="width: 18%;">审核状态</div> |
<span class="font-bold">选择审核人</span> |
||||
</div> |
<span class="text-blue-500" |
||||
|
onclick="p1473554031225085952.choose()">确定</span> |
||||
<div class="record-wrap"> |
|
||||
<div class="flex items-center text-center border-b"> |
|
||||
<div class="p-1 text-sm" style="width: 18%;">张三</div> |
|
||||
<div class="p-1 text-sm" style="width: 18%;">加班</div> |
|
||||
<div class="p-1 text-sm" style="width: 28%;">5.21 9:00 - 5.21 18:00</div> |
|
||||
<div class="p-1 text-sm" style="width: 18%;">1</div> |
|
||||
<div class="p-1 text-sm" style="width: 18%;"> |
|
||||
<div class="inline-block px-2 py-1.5 text-xs text-white bg-blue-500 rounded-sm">通过</div> |
|
||||
</div> |
</div> |
||||
</div> |
<div class="bg-gray-200" style="width:100%;height: 1px"></div> |
||||
|
<ul class="flex flex-col text-center" |
||||
<div class="flex items-center text-center border-b"> |
style="height: 240px;overflow-y: auto;"></ul> |
||||
<div class="p-1 text-sm" style="width: 18%;">张三</div> |
</div> |
||||
<div class="p-1 text-sm" style="width: 18%;">请假</div> |
</div> |
||||
<div class="p-1 text-sm" style="width: 28%;">5.21 9:00 - 5.21 18:00</div> |
</div> |
||||
<div class="p-1 text-sm" style="width: 18%;">1</div> |
</div> |
||||
<div class="p-1 text-sm" style="width: 18%;">待审批</div> |
|
||||
</div> |
<script> |
||||
|
var p1473554031225085952 = { |
||||
<div class="flex items-center text-center border-b"> |
token: '', |
||||
<div class="p-1 text-sm" style="width: 18%;">张三</div> |
projectId: '', |
||||
<div class="p-1 text-sm" style="width: 18%;">调休</div> |
roleId: '', |
||||
<div class="p-1 text-sm" style="width: 28%;">5.21 9:00 - 5.21 18:00</div> |
dom: '', |
||||
<div class="p-1 text-sm" style="width: 18%;">1</div> |
lists: [], |
||||
<div class="p-1 text-sm" style="width: 18%;">待审批</div> |
currentIndex: '', // 当前点击的审核人下标 |
||||
</div> |
checkerId: '', // 审核员id |
||||
|
currReviewer: 1, // 当前选择的审核人等级 |
||||
<div class="flex items-center text-center border-b"> |
|
||||
<div class="p-1 text-sm" style="width: 18%;">张三</div> |
init() { |
||||
<div class="p-1 text-sm" style="width: 18%;">弹性</div> |
this.dom = document.querySelector("div[data-root=p1473554031225085952]"); |
||||
<div class="p-1 text-sm" style="width: 28%;">5.21 9:00 - 5.21 18:00</div> |
var domBox = this.dom.parentNode; |
||||
<div class="p-1 text-sm" style="width: 18%;">1</div> |
var title = this.dom.querySelector('.title'); |
||||
<div class="p-1 text-sm" style="width: 18%;">待审批</div> |
|
||||
</div> |
// 获取父元素携带的参数 |
||||
</div> |
var userId = domBox.getAttribute("data-uid"); |
||||
</div> |
this.projectId = domBox.getAttribute("data-pid"); |
||||
|
this.roleId = domBox.getAttribute("data-rid"); |
||||
<!-- 请假弹框 --> |
// 初始化的时候 获取token |
||||
<div class="w-screen h-screen fixed z-10 clockInPopup bg-black bg-opacity-50" style="display: none; top: 0; left: 0;"> |
this.getTokenByUserId(userId); |
||||
<div class="flex flex-col absolute bg-white rounded-lg" style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%;"> |
}, |
||||
<div class="p-4"> |
|
||||
<div class="pt-1 pb-2 flex justify-center items-center font-bold" style="font-size: 17px;">请假申请</div> |
// 获取token |
||||
|
getTokenByUserId(userId) { |
||||
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
var that = this |
||||
<div class="text-right" style="width: 80px">时间:</div> |
fetch(`https://test.tall.wiki/gateway/tall3/v3.0/users/userId?userId=${userId}`) |
||||
<input class="start-time px-1 focus:outline-none border border-gray-300 rounded" style="width: 180px; height: 32px" type="datetime-local" /> |
.then(function(response) { |
||||
</div> |
return response.json(); |
||||
|
}) |
||||
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
.then(function(res) { |
||||
<div class="text-right" style="width: 80px"></div> |
const { |
||||
<input class="end-time px-1 focus:outline-none border border-gray-300 rounded" style="width: 180px; height: 32px" type="datetime-local" /> |
success, |
||||
</div> |
code, |
||||
|
data, |
||||
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
msg |
||||
<div class="text-right" style="width: 80px">类型:</div> |
} = res; |
||||
<label class="flex items-center"><input class="mr-1" type="radio" name="type" value="请假" checked />请假</label> |
if (success && code === 200) { |
||||
<label class="ml-3 flex items-center"><input class="mr-1" type="radio" name="type" value="调休" />调休</label> |
that.token = data.token; |
||||
<label class="ml-3 flex items-center"><input class="mr-1" type="radio" name="type" value="加班" />加班</label> |
// 查询项目成员列表 |
||||
<label class="ml-3 flex items-center"><input class="mr-1" type="radio" name="type" value="弹性" />弹性</label> |
that.getQueryChecker() |
||||
</div> |
} else { |
||||
|
console.log('msg: ', msg); |
||||
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
} |
||||
<div class="text-right" style="width: 80px">时长:</div> |
}); |
||||
<input class="punch-reason px-1 focus:outline-none border border-gray-300 rounded" style="width: 180px; height: 32px" type="number" /> |
}, |
||||
<span class="ml-1">天</span> |
|
||||
</div> |
/** |
||||
|
* 批量查询请假信息 |
||||
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
* @param {string} projectId 项目id |
||||
<div class="text-right" style="width: 80px">请假方式:</div> |
* @param {Array} codeList |
||||
<label class="flex items-center"><input class="mr-1" type="radio" name="leaveType" value="微信" checked />微信</label> |
*/ |
||||
<label class="ml-3 flex items-center"><input class="mr-1" type="radio" name="leaveType" value="口头" />口头</label> |
getClockQuery() { |
||||
<label class="ml-3 flex items-center"><input class="mr-1" type="radio" name="leaveType` " value="PT" />PT</label> |
|
||||
</div> |
}, |
||||
|
|
||||
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
/** |
||||
<div class="text-right" style="width: 80px">审核人:</div> |
* 查询项目成员列表 |
||||
<input class="reviewer-1 px-1 focus:outline-none border border-gray-300 rounded" style="width: 180px; height: 32px" type="text" onFocus="p1473554031225085952.show(1)" /> |
* @param {string} projectId 项目id |
||||
</div> |
* @param {Array} codeList |
||||
|
*/ |
||||
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
getQueryChecker() { |
||||
<div class="text-right" style="width: 80px"></div> |
var that = this |
||||
<input class="reviewer-2 px-1 focus:outline-none border border-gray-300 rounded" style="width: 180px; height: 32px" type="text" onFocus="p1473554031225085952.show(2)" /> |
var timer = null; |
||||
</div> |
let d = new Date() |
||||
|
const params = JSON.stringify({ |
||||
<div class="mt-3 flex items-center text-sm" style="color: #595959;"> |
param: { |
||||
<div class="text-right" style="width: 80px"></div> |
projectId: that.projectId |
||||
<input class="reviewer-3 px-1 focus:outline-none border border-gray-300 rounded" style="width: 180px; height: 32px" type="text" onFocus="p1473554031225085952.show(3)" /> |
} |
||||
</div> |
}); |
||||
</div> |
var url = 'https://test.tall.wiki/gateway/defaultwbs/deliver/queryChecker'; |
||||
|
fetch(url, { |
||||
<div class="mt-4 flex" style="border-top: 1px solid rgba(0, 0, 0, .1);"> |
method: 'POST', |
||||
<div class="w-2/4 h-14 flex justify-center items-center" style="font-size: 16px; border-right: 1px solid rgba(0, 0, 0, .1);" onclick="p1473554031225085952.hidePopup()">取消</div> |
mode: 'cors', |
||||
<div class="w-2/4 h-14 flex justify-center items-center text-blue-500" style="font-size: 16px;" onclick="p1473554031225085952.punch()">提交</div> |
body: params, |
||||
</div> |
headers: new Headers({ |
||||
</div> |
'Authorization': 'Bearer ' + that.token, |
||||
</div> |
'Content-Type': 'application/json;charset=utf-8' |
||||
|
}) |
||||
<!-- 选择审核人 --> |
}).then(function(response) { |
||||
<div class="w-screen h-screen fixed z-20 statusChoose bg-black bg-opacity-50" style="display:none;top: 0;left: 0;"> |
return response.json(); |
||||
<div class="flex flex-col absolute w-full bg-white" style="bottom: 0;"> |
}).catch(function(error) { |
||||
<div class="flex flex-row justify-between px-5 py-4"> |
console.error('Error:', error) |
||||
<span class="text-gray-400" onclick="p1473554031225085952.hide()">取消</span> |
}).then(function(res) { |
||||
<span class="font-bold">选择审核人</span> |
const { |
||||
<span class="text-blue-500" onclick="p1473554031225085952.choose()">确定</span> |
success, |
||||
</div> |
code, |
||||
<div class="bg-gray-200" style="width:100%;height: 1px"></div> |
data, |
||||
<ul class="flex flex-col text-center" style="height: 240px;overflow-y: auto;"></ul> |
msg |
||||
</div> |
} = res; |
||||
</div> |
if (success && code === 200) { |
||||
</div> |
for (var i = 0; i < data.length; i++) { |
||||
</div> |
data[i].choose = true |
||||
|
that.lists.push(data[i]) |
||||
<script> |
} |
||||
var p1473554031225085952 = { |
// 查询请假信息 |
||||
token: '', |
that.getClockQuery() |
||||
projectId: '', |
} else { |
||||
roleId: '', |
console.log('msg: ', msg); |
||||
dom: '', |
} |
||||
lists: [], |
}) |
||||
currentIndex: '', // 当前点击的审核人下标 |
}, |
||||
checkerId: '', // 审核员id |
|
||||
currReviewer: 1, // 当前选择的审核人等级 |
// 显示申请弹框 |
||||
|
showPopup() { |
||||
init() { |
var clockInPopup = this.dom.querySelector('.clockInPopup'); |
||||
this.dom = document.querySelector("div[data-root=p1473554031225085952]"); |
clockInPopup.style.display = 'block'; |
||||
var domBox = this.dom.parentNode; |
|
||||
var title = this.dom.querySelector('.title'); |
let time = this.format(new Date()); // 当前时间 |
||||
|
let arr = time.split(' '); |
||||
// 获取父元素携带的参数 |
// 默认开始时间 |
||||
var userId = domBox.getAttribute("data-uid"); |
let startTime = arr[0] + 'T' + '09:00'; |
||||
this.projectId = domBox.getAttribute("data-pid"); |
this.dom.querySelector('.start-time').value = startTime; |
||||
this.roleId = domBox.getAttribute("data-rid"); |
// 默认结束时间 |
||||
// 初始化的时候 获取token |
let endTime = arr[0] + 'T' + '18:00'; |
||||
this.getTokenByUserId(userId); |
this.dom.querySelector('.end-time').value = endTime; |
||||
}, |
}, |
||||
|
|
||||
// 获取token |
// 隐藏申请弹框 |
||||
getTokenByUserId(userId){ |
hidePopup() { |
||||
var that = this |
var clockInPopup = this.dom.querySelector('.clockInPopup'); |
||||
fetch(`https://test.tall.wiki/gateway/tall3/v3.0/users/userId?userId=${userId}`) |
clockInPopup.style.display = 'none'; |
||||
.then(function(response) { |
}, |
||||
return response.json(); |
|
||||
}) |
// 显示选择框 |
||||
.then(function(res) { |
show(type) { |
||||
const { success, code, data, msg } = res; |
this.currReviewer = type; // 当前选择的审核人等级 |
||||
if (success && code === 200) { |
|
||||
that.token = data.token; |
var statusChoose = this.dom.querySelector('.statusChoose'); |
||||
// 查询项目成员列表 |
statusChoose.style.display = 'block'; |
||||
that.getQueryChecker() |
var list = '' |
||||
} else { |
for (let i = 0; i < this.lists.length; i++) { |
||||
console.log('msg: ', msg); |
list += `<li class="py-3" onclick="p1473554031225085952.chooseItem(${i})">` + this.lists[i] |
||||
} |
.name + '</li>'; |
||||
}); |
} |
||||
}, |
var ul = this.dom.querySelector('ul'); |
||||
|
ul.innerHTML = list |
||||
/** |
}, |
||||
* 批量查询请假信息 |
|
||||
* @param {string} projectId 项目id |
// 选择 |
||||
* @param {Array} codeList |
chooseItem(index) { |
||||
*/ |
this.currentIndex = index; |
||||
getClockQuery() { |
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'; |
||||
* @param {string} projectId 项目id |
} else { |
||||
* @param {Array} codeList |
item.classList.remove('text-white'); |
||||
*/ |
item.style.backgroundColor = '#fff'; |
||||
getQueryChecker() { |
} |
||||
var that = this |
} |
||||
var timer = null; |
}, |
||||
let d = new Date() |
|
||||
const params = JSON.stringify({ |
/** |
||||
param: { projectId: that.projectId } |
* 确定 选择审核人 |
||||
}); |
* @param { Array } codeAndAnswerList code和答案 |
||||
var url = 'https://test.tall.wiki/gateway/defaultwbs/deliver/queryChecker'; |
* @param { String } projectId 项目ID |
||||
fetch(url, { |
* @param { Number } codeAndAnswerList 提交人类型(0平车 1人) |
||||
method: 'POST', |
*/ |
||||
mode: 'cors', |
choose() { |
||||
body: params, |
const that = this; |
||||
headers: new Headers({ |
that.dom.querySelector('.reviewer-' + that.currReviewer).value = that.lists[that.currentIndex].name; |
||||
'Authorization': 'Bearer ' + that.token ,'Content-Type': 'application/json;charset=utf-8' |
that.checkerId = that.lists[that.currentIndex].memberId; |
||||
}) |
that.hide(); |
||||
}).then(function(response) { |
}, |
||||
return response.json(); |
|
||||
}).catch(function(error){ |
// 取消 |
||||
console.error('Error:', error) |
hide() { |
||||
}).then(function(res){ |
var statusChoose = this.dom.querySelector('.statusChoose'); |
||||
const { success, code, data, msg } = res; |
statusChoose.style.display = 'none'; |
||||
if (success && code === 200) { |
}, |
||||
for(var i = 0; i < data.length; i++){ |
|
||||
data[i].choose = true |
// 时间戳转时间格式 |
||||
that.lists.push(data[i]) |
format(shijianchuo) { |
||||
} |
//shijianchuo是整数,否则要parseInt转换 |
||||
// 查询请假信息 |
var time = new Date(shijianchuo); |
||||
that.getClockQuery() |
var y = time.getFullYear(); |
||||
} else { |
var m = time.getMonth() + 1; |
||||
console.log('msg: ', msg); |
var d = time.getDate(); |
||||
} |
var h = time.getHours(); |
||||
}) |
var mm = time.getMinutes(); |
||||
}, |
// var s = time.getSeconds(); |
||||
|
return this.add0(y) + '-' + this.add0(m) + '-' + this.add0(d) + ' ' + this.add0(h) + ':' + this |
||||
// 显示申请弹框 |
.add0(mm); |
||||
showPopup(){ |
}, |
||||
var clockInPopup = this.dom.querySelector('.clockInPopup'); |
|
||||
clockInPopup.style.display = 'block'; |
add0(m) { |
||||
|
return m < 10 ? '0' + m : m |
||||
let time = this.format(new Date()); // 当前时间 |
}, |
||||
let arr = time.split(' '); |
|
||||
// 默认开始时间 |
// 跳转详情 |
||||
let startTime = arr[0] + 'T' + '09:00'; |
jumpDetails(that) { |
||||
this.dom.querySelector('.start-time').value = startTime; |
// const pId = this.dom.parentNode.getAttribute('data-pid'); |
||||
// 默认结束时间 |
// const uId = this.dom.parentNode.getAttribute('data-uid'); |
||||
let endTime = arr[0] + 'T' + '18:00'; |
// const rId = this.dom.parentNode.getAttribute('data-rid'); |
||||
this.dom.querySelector('.end-time').value = endTime; |
// location.href = `https://test.tall.wiki/checkwork/?pid=${pId}&uid=${uId}&rid=${rId}`; |
||||
}, |
|
||||
|
const pId = this.dom.parentNode.getAttribute('data-pid'); |
||||
// 隐藏申请弹框 |
const uId = this.dom.parentNode.getAttribute('data-uid'); |
||||
hidePopup() { |
const token = this.dom.parentNode.getAttribute('data-token'); |
||||
var clockInPopup = this.dom.querySelector('.clockInPopup'); |
const rId = this.dom.parentNode.getAttribute('data-rid'); |
||||
clockInPopup.style.display = 'none'; |
const url = this.dom.parentNode.getAttribute('data-url'); |
||||
}, |
const type = this.dom.parentNode.getAttribute('data-type') ? 1 : 0; |
||||
|
const longitude = this.dom.parentNode.getAttribute('data-longitude'); |
||||
// 显示选择框 |
const latitude = this.dom.parentNode.getAttribute('data-latitude'); |
||||
show(type){ |
const param = |
||||
this.currReviewer = type; // 当前选择的审核人等级 |
`http://101.201.226.163/leaveProcess/?pid=${pId}&uid=${uId}&rid=${rId}&token=${token}&url=${url}&longitude=${longitude}&latitude=${latitude}`; |
||||
|
if (type === 1) { |
||||
var statusChoose = this.dom.querySelector('.statusChoose'); |
sessionStorage.setItem('targetUrl', `${param}`); |
||||
statusChoose.style.display='block'; |
} else { |
||||
var list = '' |
location.href = param; |
||||
for (let i = 0; i < this.lists.length; i++) { |
} |
||||
list += `<li class="py-3" onclick="p1473554031225085952.chooseItem(${i})">` + this.lists[i].name + '</li>'; |
} |
||||
} |
} |
||||
var ul = this.dom.querySelector('ul'); |
p1473554031225085952.init() |
||||
ul.innerHTML = list |
</script> |
||||
}, |
</div> |
||||
|
</div> |
||||
// 选择 |
</div> |
||||
chooseItem(index){ |
|
||||
this.currentIndex = index; |
<div class="flex mb-3"> |
||||
var lis = this.dom.querySelectorAll('li'); |
<!-- 序号--> |
||||
for (var i = 0; i < lis.length; i++){ |
<div class="flex flex-col items-center"> |
||||
var item = lis[i]; |
<div class="rounded-full h-8 w-8 mb-1 bg-gray-100 border-2 border-blue-500"></div> |
||||
if(i === index){ |
<div class="w-8 flex-1 flex flex-col items-center"> |
||||
item.classList.add('text-white'); |
<div class="w-0.5 flex-1 bg-gray-300"></div> |
||||
item.style.backgroundColor = '#3b82f6'; |
</div> |
||||
}else{ |
</div> |
||||
item.classList.remove('text-white'); |
|
||||
item.style.backgroundColor = '#fff'; |
<div class="flex-1"> |
||||
} |
<!-- 定期任务面板--> |
||||
} |
<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> |
||||
* 确定 选择审核人 |
<!-- 示例插件2 id=100--> |
||||
* @param { Array } codeAndAnswerList code和答案 |
<button class="bg-blue-500 py-2 px-5 rounded text-white" |
||||
* @param { String } projectId 项目ID |
onclick="p100.show()">测试组建2</button> |
||||
* @param { Number } codeAndAnswerList 提交人类型(0平车 1人) |
<script> |
||||
*/ |
const p100 = { |
||||
choose(){ |
name: 'hello tall plugin', |
||||
const that = this; |
show() { |
||||
that.dom.querySelector('.reviewer-' + that.currReviewer).value = that.lists[that.currentIndex].name; |
alert(this.name) |
||||
that.checkerId = that.lists[that.currentIndex].memberId; |
} |
||||
that.hide(); |
} |
||||
}, |
</script> |
||||
|
</div> |
||||
// 取消 |
</div> |
||||
hide(){ |
</div> |
||||
var statusChoose = this.dom.querySelector('.statusChoose'); |
</div> |
||||
statusChoose.style.display='none'; |
</div> |
||||
}, |
</body> |
||||
|
<style> |
||||
// 时间戳转时间格式 |
.content, |
||||
format(shijianchuo){ |
.task-bar { |
||||
//shijianchuo是整数,否则要parseInt转换 |
overflow-y: scroll; |
||||
var time = new Date(shijianchuo); |
} |
||||
var y = time.getFullYear(); |
|
||||
var m = time.getMonth()+1; |
.content::-webkit-scrollbar, |
||||
var d = time.getDate(); |
.task-bar::-webkit-scrollbar { |
||||
var h = time.getHours(); |
display: none; |
||||
var mm = time.getMinutes(); |
} |
||||
// var s = time.getSeconds(); |
</style> |
||||
return this.add0(y) + '-' + this.add0(m) + '-' + this.add0(d) + ' ' + this.add0(h) + ':' + this.add0(mm); |
|
||||
}, |
|
||||
|
|
||||
add0(m){return m<10?'0'+m:m }, |
|
||||
|
|
||||
// 跳转详情 |
|
||||
jumpDetails(that) { |
|
||||
// const pId = this.dom.parentNode.getAttribute('data-pid'); |
|
||||
// const uId = this.dom.parentNode.getAttribute('data-uid'); |
|
||||
// const rId = this.dom.parentNode.getAttribute('data-rid'); |
|
||||
// location.href = `https://test.tall.wiki/checkwork/?pid=${pId}&uid=${uId}&rid=${rId}`; |
|
||||
|
|
||||
const pId = this.dom.parentNode.getAttribute('data-pid'); |
|
||||
const uId = this.dom.parentNode.getAttribute('data-uid'); |
|
||||
const token = this.dom.parentNode.getAttribute('data-token'); |
|
||||
const rId = this.dom.parentNode.getAttribute('data-rid'); |
|
||||
const url = this.dom.parentNode.getAttribute('data-url'); |
|
||||
const type = this.dom.parentNode.getAttribute('data-type') ? 1 : 0; |
|
||||
const longitude = this.dom.parentNode.getAttribute('data-longitude'); |
|
||||
const latitude = this.dom.parentNode.getAttribute('data-latitude'); |
|
||||
const path = "http://101.201.226.163/tall/v4.0.0/pages/detailWebview/detailWebview"; |
|
||||
const param = `pid=${pId}&uid=${uId}&rid=${rId}&token=${token}&url=${url}&longitude=${longitude}&latitude=${latitude}`; |
|
||||
if (type === 1) { |
|
||||
sessionStorage.setItem('targetUrl', `http://101.201.226.163/leaveProcess/?${param}`); |
|
||||
} else { |
|
||||
location.href = `${path}/?url=${encodeURIComponent(param)}`; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
p1473554031225085952.init() |
|
||||
</script> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="flex mb-3"> |
|
||||
<!-- 序号--> |
|
||||
<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="w-8 flex-1 flex flex-col items-center"> |
|
||||
<div class="w-0.5 flex-1 bg-gray-300"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="flex-1"> |
|
||||
<!-- 定期任务面板--> |
|
||||
<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> |
|
||||
<!-- 示例插件2 id=100--> |
|
||||
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p100.show()">测试组建2</button> |
|
||||
<script> |
|
||||
const p100 = { |
|
||||
name: 'hello tall plugin', |
|
||||
show() { |
|
||||
alert(this.name) |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</body> |
|
||||
<style> |
|
||||
.content, .task-bar{ |
|
||||
overflow-y: scroll; |
|
||||
} |
|
||||
.content::-webkit-scrollbar, .task-bar::-webkit-scrollbar{ |
|
||||
display: none; |
|
||||
} |
|
||||
</style> |
|
||||
</html> |
</html> |
||||
|
Loading…
Reference in new issue