Last active
December 19, 2015 11:28
-
-
Save BluntBlade/5947489 to your computer and use it in GitHub Desktop.
@七牛云存储 运维排班表模板
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" | |
| "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
| <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" > | |
| <head> | |
| <meta http-equiv="content-type" content="text/html; charset=utf-8" /> | |
| <title>运维值班表</title> | |
| <style> | |
| <!-- | |
| table { text-align: center; width: 50em; border: 1px solid black; border-collapse: collapse; } | |
| th,td { padding: 0.4em; border: 1px solid black; } | |
| pre { font-size: 1.2em; } | |
| --> | |
| </style> | |
| </head> | |
| <body> | |
| <p style="font-size: 1.3em; font-weight: bold;">运维值班表</p> | |
| <script language="javascript"> | |
| <!-- | |
| // 输入参数 | |
| const days = 7 | |
| var beginDate = new Date() | |
| beginDate.setTime(Date.parse("2013-07-08")) | |
| // 常量定义 | |
| const LINEBREAK = "\r\n" | |
| const ONEDAYLONG = 86400 * 1000 | |
| const slots = [ | |
| { "begin": "01:00", "end": "09:00", "400call": "01:00 ~ 08:59" }, | |
| { "begin": "09:00", "end": "18:00", "400call": "09:00 ~ 17:59" }, | |
| { "begin": "18:00", "end": "01:00", "400call": "18:00 ~ 23:59, 00:00 ~ 00:59" } | |
| ] | |
| const weekdays = [ "周日", "周一", "周二", "周三", "周四", "周五", "周六" ] | |
| const ops = [ | |
| { "name": "CPP", "wid": "001" }, { "name": "Perl", "wid": "002" }, | |
| { "name": "Ruby", "wid": "003" }, { "name": "Python", "wid": "004" } | |
| ] | |
| const oncall = [ { "name": "PHP" }, { "name": "Java" }, { "name": "Go" } ] | |
| var baseDate = new Date() | |
| baseDate.setTime(Date.parse("2013-07-07")) | |
| const dayDiff = (beginDate.getTime() - baseDate.getTime()) / ONEDAYLONG | |
| function makeList(src, rows, dayDiff, days) { | |
| // 0 1 2 3 | |
| // a d c b | |
| // b a d c | |
| // c b a d | |
| var cols = (src.length % rows === 0) ? src.length / rows : src.length | |
| var pos = ((dayDiff % cols) * rows) % src.length | |
| var dst = [] | |
| for (var i = 0; i < rows * days; ++i) { | |
| dst.push(src[pos].name) | |
| pos += 1 | |
| if (pos == src.length) { pos = 0 } | |
| } // for | |
| return dst | |
| } // makeList | |
| function generateColumnHeaders() { | |
| var columnHeaders = '<th>时段</th>' | |
| var curDate = new Date() | |
| curDate.setTime(beginDate.getTime()) | |
| for (var i = 0; i < days; ++i) { | |
| var mon = curDate.getMonth() + 1 | |
| if (mon < 10) { mon = '0' + mon } | |
| var monDay = curDate.getDate() | |
| if (monDay < 10) { monDay = '0' + monDay } | |
| columnHeaders += '<th>' + weekdays[curDate.getDay()] + ' ' + mon + '-' + monDay + '</th>' | |
| curDate.setTime(curDate.getTime() + ONEDAYLONG) | |
| } // for | |
| return '<tr>' + columnHeaders + '</tr>' + LINEBREAK | |
| } // generateColumnHeaders | |
| function generateOperations() { | |
| var list = makeList(ops, slots.length, dayDiff, days) | |
| var rows = [] | |
| for (var i = 0; i < slots.length; ++i) { | |
| rows.push('<td>' + slots[i].begin + '～' + slots[i].end + '</td>') | |
| } // for | |
| for (var j = 0; j < slots.length * days; ++j) { | |
| rows[j % slots.length] += '<td>' + list[j] + '</td>' | |
| } // for | |
| for (var i = 0; i < slots.length; ++i) { | |
| rows[i] = '<tr>' + rows[i] + '</tr>' + LINEBREAK | |
| } // for | |
| return rows.join('') | |
| } // generateOperations | |
| function generateOnCall() { | |
| var list = makeList(oncall, 1, dayDiff, days) | |
| var row = '<td>On Call</td>' | |
| for (var j = 0; j < days; ++j) { | |
| row += '<td>' + list[j] + '</td>' | |
| } // for | |
| return '<tr>' + row + '</tr>' + LINEBREAK | |
| } // generateOnCall | |
| function generate400Call() { | |
| var list = makeList(ops, slots.length, dayDiff, days) | |
| var opList = {} | |
| var curDate = new Date() | |
| curDate.setTime(beginDate.getTime()) | |
| for (var i = 0; i < days; ++i) { | |
| for (var j = 0; j < slots.length; ++j) { | |
| var pos = i * slots.length + j | |
| op = list[pos] | |
| if (opList[op] === undefined) { | |
| opList[op] = [] | |
| } | |
| var slot = weekdays[curDate.getDay()] + ' ' + slots[j]["400call"] + LINEBREAK | |
| opList[op].push(slot) | |
| } // for | |
| curDate.setTime(curDate.getTime() + ONEDAYLONG) | |
| } // for | |
| var para = '' | |
| for (var k in opList) { | |
| var workerId = -1 | |
| for (var i = 0; i < ops.length; ++i) { | |
| if (ops[i].name === k) { | |
| workerId = ops[i].wid | |
| break | |
| } | |
| } // for | |
| para += k + '/' + workerId + LINEBREAK + opList[k].join('') + LINEBREAK | |
| } // for | |
| return para | |
| } // generate400Call | |
| --> | |
| </script> | |
| <table> | |
| <thead> | |
| <script language="javascript"> document.write(generateColumnHeaders()) </script> | |
| </thead> | |
| <tbody> | |
| <script language="javascript"> document.write(generateOperations()) </script> | |
| <script language="javascript"> document.write(generateOnCall()) </script> | |
| </tbody> | |
| </table> | |
| <hr/> | |
| <pre> | |
| <script language="javascript"> document.write(generate400Call()) </script> | |
| </pre> | |
| </body> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment