diff --git a/member/index.html b/member/index.html
new file mode 100644
index 0000000..e0a4f67
--- /dev/null
+++ b/member/index.html
@@ -0,0 +1,21 @@
+
+
+
+
+
+
+
+
+ 公主連結戰隊戰填表系統 - 成員管理
+
+
+
+
+
+ 成員管理
+
+
+
+
+
+
\ No newline at end of file
diff --git a/member/js/index.js b/member/js/index.js
new file mode 100644
index 0000000..151b1ee
--- /dev/null
+++ b/member/js/index.js
@@ -0,0 +1,75 @@
+var selectedDate = document.getElementById("queryDate");
+
+let table = document.createElement("table");
+let thead = document.createElement("thead");
+let tbody = document.createElement("tbody");
+
+table.appendChild(thead);
+table.appendChild(tbody);
+
+// Adding the entire table to the body tag
+document.getElementById("body").appendChild(table);
+
+// Creating and adding data to first row of the table
+let row_1 = document.createElement("tr");
+let heading_1 = document.createElement("th");
+heading_1.innerHTML = "成員名稱";
+let heading_2 = document.createElement("th");
+heading_2.innerHTML = "角色暱稱";
+let heading_3 = document.createElement("th");
+heading_3.innerHTML = "角色UID";
+let heading_4 = document.createElement("th");
+heading_4.innerHTML = "DC ID";
+let heading_5= document.createElement("th");
+heading_5.innerHTML = "已離開";
+
+row_1.appendChild(heading_1);
+row_1.appendChild(heading_2);
+row_1.appendChild(heading_3);
+row_1.appendChild(heading_4);
+row_1.appendChild(heading_5);
+thead.appendChild(row_1);
+// 取得刀表
+axios.get("http://127.0.0.1:10001/api/member", {
+ headers: {
+ 'Content-Type': 'application/json',
+ 'Accept': 'application/json'
+ }
+})
+ .then(function (response) {
+ const data = response.data;
+ console.log(data);
+ for (let i = 0; i < data.length; i++) {
+ // Creating and adding data to second row of the table
+ let row_2 = document.createElement("tr");
+ let row_2_data_1 = document.createElement("td");
+ let row_2_data_2 = document.createElement("td");
+ let row_2_data_3 = document.createElement("td");
+ let row_2_data_4 = document.createElement("td");
+ let row_2_data_5 = document.createElement("td");
+
+ const item = data[i];
+
+ row_2_data_1.innerHTML = "" + item.nickName + "";
+ row_2_data_2.innerHTML = item.playerName;
+ row_2_data_3.innerHTML = item.uid;
+ row_2_data_4.innerHTML = item.discordID;
+ if (item.leave) {
+ row_2_data_5.innerHTML = "O";
+ } else {
+ row_2_data_5.innerHTML = "X";
+ }
+
+ row_2.appendChild(row_2_data_1);
+ row_2.appendChild(row_2_data_2);
+ row_2.appendChild(row_2_data_3);
+ row_2.appendChild(row_2_data_4);
+ row_2.appendChild(row_2_data_5);
+ tbody.appendChild(row_2);
+ }
+ })
+ .catch(function (error) {
+ //const message = error.response.data.message;
+ //alert("資料取得失敗");
+ console.error('資料取得失敗:', error);
+ });