-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathoptions.html
148 lines (127 loc) · 4.16 KB
/
options.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>X-BOX 配置</title>
<style>
.wrapper {
width: 70%;
padding: 20px;
margin: 40px auto 200px;
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
border: 1px solid #ebeef5;
}
.title {
padding: 4px 0;
border-bottom: solid lightgray 1px;
}
a {
color: #0366d6;
text-decoration: none;
}
p {
font-size: 15px;
}
table,th,td {
border: 1px solid #ddd;
}
table {
width: 100%;
font-size: 15px;
}
tr {
line-height: 36px;
}
td:first-child {
min-width: 70px;
text-align: center;
}
td:nth-child(2) {
text-align: center;
font-size: 12px;
color: #585858;
}
td:nth-child(3) {
text-align: center;
font-size: 12px;
}
td:last-child {
min-width: 280px;
}
table input {
width: 90%;
height: 32px;
margin: 4px;
padding: 0 4px;
border: 1px solid #ccc;
border-radius: 4px;
}
.radio-group {
font-size: 15px;
margin: 10px 0;
}
.submit {
width: 100px;
height: 35px;
border-radius: 5px;
font-size: 15px;
margin: 10px 0;
color: #fff;
background-color: #409eff;
border-color: #409eff;
cursor: pointer;
}
.submit:hover {
background-color: #5ebdff;
border-color: #5ebdff;
}
</style>
</head>
<body>
<div class="wrapper">
<h1 class="title">配置</h1>
<form>
<p>每次运行计算前，都会先读取下列三种特殊日期：</p>
<table cellspacing="0">
<tr>
<th>类型</th>
<th>说明</th>
<th>默认配置</th>
<th>用户自定义配置</th>
</tr>
<tr>
<td>排除日期</td>
<td>不纳入计算的日期 <br> 比如某些特殊日期打卡了但不计算</td>
<td id="exclusiveDaysDefault"></td>
<td><input id="exclusiveDaysCustom" placeholder="格式：2019-01-01，多个日期请用英文,分隔"></td>
</tr>
<tr>
<td>工作日</td>
<td>要当作「工作日」计算的日期 <br> 比如元旦前的周末要上班</td>
<td id="asWorkdaysDefault"></td>
<td><input id="asWorkdaysCustom" placeholder="格式：2019-01-01，多个日期请用英文,分隔"></td>
</tr>
<tr>
<td>节假日</td>
<td>要当作「节假日」计算的日期 <br> 比如元旦节来公司加班呢</td>
<td id="asHolidaysDefault"></td>
<td><input id="asHolidaysCustom" placeholder="格式：2019-01-01，多个日期请用英文,分隔"></td>
</tr>
</table>
<div class="radio-group">
<span>是否启用「默认配置」：</span>
<input class="radio" type="radio" id="configChoice1" name="config" value="configChoice1">
<label for="configChoice1">是</label>
<input class="radio" type="radio" id="configChoice2" name="config" value="configChoice2">
<label class="radio" for="configChoice2">否</label>
</div>
<div>优先级：排除日期 > 工作日 > 节假日</div>
<div>
<button class="submit" type="submit">保存</button>
</div>
</form>
</div>
<script src="js/options.js"></script>
</body>
</html>