Skip to content
This repository was archived by the owner on Oct 17, 2023. It is now read-only.

Commit a377f0d

Browse files
setcysetcy
authored
Merge pull request #16 from Kiameow/main
Kiameow's Submit
2 parents bfc2033 + c267852 commit a377f0d

File tree

5 files changed

+715
-0
lines changed

5 files changed

+715
-0
lines changed

‎kiameow/README.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
## 如何预览
2+
由于使用了本地json文件实现数据访问，又因为没有使用服务器框架，故只能使用vscode的live_preview插件进行预览，开启预览后，可以前往浏览器输入`http://127.0.0.1:3000/index.html`在浏览器页面进行访问(vscode端功能不是很齐全)
3+
4+
## 项目特点
5+
之后再写

‎kiameow/data.json

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"students":[{"id": 1, "number": 22050701, "name": "一二", "college": "计算机科学与工程学院", "major": "软件工程", "grade": 2015, "class": 2, "age": 21},
3+
{"id": 2, "number": 22050702, "name": "三四", "college": "人工智能学院", "major": "人工智能", "grade": 2015, "class": 2, "age": 20},
4+
{"id": 3, "number": 22050703, "name": "五六", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
5+
{"id": 4, "number": 22050704, "name": "七八", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
6+
{"id": 5, "number": 22050705, "name": "旧事", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
7+
{"id": 6, "number": 22050706, "name": "释义", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
8+
{"id": 7, "number": 22050707, "name": "食饵", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
9+
{"id": 8, "number": 22050708, "name": "十三", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
10+
{"id": 9, "number": 22050709, "name": "事务", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
11+
{"id": 10, "number": 22050710, "name": "石榴", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
12+
{"id": 11, "number": 22050711, "name": "石器", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
13+
{"id": 12, "number": 22050712, "name": "拾捌", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
14+
{"id": 13, "number": 22050713, "name": "狮鹫", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
15+
{"id": 14, "number": 22050714, "name": "耳饰", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
16+
{"id": 15, "number": 22050715, "name": "二十亿", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
17+
{"id": 16, "number": 22050716, "name": "而使而", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
18+
{"id": 17, "number": 22050717, "name": "二式伞", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
19+
{"id": 18, "number": 22050718, "name": "orchis", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
20+
{"id": 19, "number": 22050719, "name": "迩食物", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
21+
{"id": 20, "number": 22050720, "name": "尔时流", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
22+
{"id": 21, "number": 22050721, "name": "二世齐", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
23+
{"id": 22, "number": 22050722, "name": "archibald", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
24+
{"id": 23, "number": 22050723, "name": "而是酒", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
25+
{"id": 24, "number": 22050724, "name": "散失", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
26+
{"id": 25, "number": 22050725, "name": "三史亦", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
27+
{"id": 26, "number": 22050726, "name": "三史迩", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
28+
{"id": 27, "number": 22050727, "name": "三史伞", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
29+
{"id": 28, "number": 22050728, "name": "三石似", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
30+
{"id": 29, "number": 22050729, "name": "三石舞", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
31+
{"id": 30, "number": 22050730, "name": "三史流", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20},
32+
{"id": 31, "number": 22050731, "name": "三石棋", "college": "计算机科学与工程学院", "major": "计算机科学与工程", "grade": 2015, "class": 2, "age": 20}
33+
],
34+
"length": 31
35+
}

‎kiameow/index.html

Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
<!DOCTYPE html>
2+
<html lang="zh" color-mode="light">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
7+
<title>学生信息管理系统</title>
8+
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
9+
<link rel="stylesheet" href="style.css">
10+
</head>
11+
12+
<body>
13+
<h1>学生信息管理系统</h1>
14+
<div id="top-func">
15+
<button id="add">新增</button>
16+
<button id="delete" disabled="true">删除</button>
17+
<button id="color-mode">黑暗/日间模式</button>
18+
</div>
19+
<div id="info-form">
20+
<table>
21+
<thead>
22+
<tr id="head-row">
23+
<th><input type="checkbox" id="select-toggle" /></th>
24+
<th>序号</th>
25+
<th>学号</th>
26+
<th>姓名</th>
27+
<th>学院</th>
28+
<th>专业</th>
29+
<th>年级</th>
30+
<th>班级</th>
31+
<th>年龄</th>
32+
<th>操作</th>
33+
</tr>
34+
</thead>
35+
36+
<tbody>
37+
38+
</tbody>
39+
</table>
40+
</div>
41+
<dialog id="check-dialog">
42+
<h3>信息</h3>
43+
<ul id="check-dialog-list"></ul>
44+
<form method="dialog">
45+
<button>OK</button>
46+
</form>
47+
</dialog>
48+
49+
<dialog id="change-dialog">
50+
<h3>修改信息</h3>
51+
52+
<form method="dialog">
53+
<label for="number">学号</label>
54+
<input type="text" placeholder="22050701" id="number"><br />
55+
56+
<label for="name">姓名</label>
57+
<input type="text" placeholder="张三" id="name" autocomplete="name"><br />
58+
59+
60+
<label for="colleges">学院</label>
61+
<select id="colleges" class="colleges">
62+
<option value="JSJ">计算机科学与工程学院</option>
63+
<option value="ZDH">自动化学院</option>
64+
<option value="RGZN">人工智能学院</option>
65+
<option value="WLAQ">网络安全学院</option>
66+
<option value="JX">机械学院</option>
67+
</select>
68+
<br />
69+
70+
71+
<label for="majors">专业</label>
72+
<select id="majors" class="majors">
73+
74+
</select>
75+
<br />
76+
77+
<label for="grade">年级</label>
78+
<input type="text" placeholder="2015" id="grade"><br />
79+
<label for="class">班级</label>
80+
<input type="text" placeholder="2" id="class"><br />
81+
<label for="age">年龄</label>
82+
<input type="text" placeholder="20" id="age"><br /><br/>
83+
84+
<button>取消</button>
85+
<button type="submit">确认</button>
86+
</form>
87+
</dialog>
88+
89+
<dialog id="add-dialog">
90+
<h3>新增信息</h3>
91+
92+
<form method="dialog">
93+
<label for="number">学号</label>
94+
<input type="text" placeholder="22050701" id="number"><br />
95+
96+
<label for="name">姓名</label>
97+
<input type="text" placeholder="张三" id="name" autocomplete="name"><br />
98+
99+
100+
<label for="colleges">学院</label>
101+
<select id="colleges" class="colleges">
102+
<option value="JSJ">计算机科学与工程学院</option>
103+
<option value="ZDH">自动化学院</option>
104+
<option value="RGZN">人工智能学院</option>
105+
<option value="WLAQ">网络安全学院</option>
106+
<option value="JX">机械学院</option>
107+
</select>
108+
<br />
109+
110+
111+
<label for="majors">专业</label>
112+
<select id="majors" class="majors">
113+
114+
</select>
115+
<br />
116+
117+
<label for="grade">年级</label>
118+
<input type="text" placeholder="2015" id="grade"><br />
119+
<label for="class">班级</label>
120+
<input type="text" placeholder="2" id="class"><br />
121+
<label for="age">年龄</label>
122+
<input type="text" placeholder="20" id="age"><br /><br/>
123+
124+
<button>取消</button>
125+
<button type="submit">确认</button>
126+
</form>
127+
</dialog>
128+
129+
<dialog id="delete-dialog">
130+
<p></p>
131+
<form method="dialog">
132+
<button id="delete-cancel">取消</button>
133+
<button id="delete-confirm">确认</button>
134+
</form>
135+
</dialog>
136+
137+
<div id="footer">
138+
<span id="bottom-info"></span>
139+
<span id="page-button">
140+
<button id="prev">上一页</button>
141+
<button id="next">下一页</button>
142+
</span>
143+
</div>
144+
<script src="script.js"></script>
145+
</body>
146+
</html>

0 commit comments

Comments
 (0)