ray650128/PcReDiveClanRecordFrontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

實作新增、修改

Browse Source
This commit is contained in:
Raymond Yang
2023-06-27 00:10:13 +08:00
parent 84d1e1916a
commit fbc0760bd3
3 changed files with 638 additions and 399 deletions
Download Patch File Download Diff File Expand all files Collapse all files
edit.html
+230
View File
@@ -0,0 +1,230 @@
<!DOCTYPE html>
<html lang="zh-TW" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
<head>
<!-- Required meta tags -->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>接收参数示例</title>
<script>
</script>
</head>
<body>
<form id="record-form">
<table>
<tr>
<td>第1刀正刀</td>
<td>
<input type="text" id="knife1_boss" placeholder="x周-y王" />
</td>
<td>第1刀正刀傷害</td>
<td>
<input type="text" id="knife1_damage" placeholder="ex: 12000000" />
</td>
</tr>
<tr>
<td>第1刀殘刀</td>
<td>
<input type="text" id="knife1c_boss" placeholder="x周-y王" />
</td>
<td>第1刀殘刀傷害</td>
<td>
<input type="text" id="knife1c_damage" placeholder="ex: 12000000" />
</td>
</tr>
</table>
<hr />
<table>
<tr>
<td>第2刀正刀</td>
<td>
<input type="text" id="knife2_boss" placeholder="x周-y王" />
</td>
<td>第2刀正刀傷害</td>
<td>
<input type="text" id="knife2_damage" placeholder="ex: 12000000" />
</td>
</tr>
<tr>
<td>第2刀殘刀</td>
<td>
<input type="text" id="knife2c_boss" placeholder="x周-y王" />
</td>
<td>第2刀殘刀傷害</td>
<td>
<input type="text" id="knife2c_damage" placeholder="ex: 12000000" />
</td>
</tr>
</table>
<hr />
<table>
<tr>
<td>第3刀正刀</td>
<td>
<input type="text" id="knife3_boss" placeholder="x周-y王" />
</td>
<td>第3刀正刀傷害</td>
<td>
<input type="text" id="knife3_damage" placeholder="ex: 12000000" />
</td>
</tr>
<tr>
<td>第3刀殘刀</td>
<td>
<input type="text" id="knife3c_boss" placeholder="x周-y王" />
</td>
<td>第3刀殘刀傷害</td>
<td>
<input type="text" id="knife3c_damage" placeholder="ex: 12000000" />
</td>
</tr>
</table>
<hr />
<p><button type="submit">送出</button></p>
</form>
<script src="https://cdn.jsdelivr.net/npm/axios@1.1.2/dist/axios.min.js"></script>
<script language="javascript" type="text/javascript">
var paramValue = "";
var memberId = "";
var knife1_boss = document.getElementById("knife1_boss");
var knife1_damage = document.getElementById("knife1_damage");
var knife1c_boss = document.getElementById("knife1c_boss");
var knife1c_damage = document.getElementById("knife1c_damage");
var knife2_boss = document.getElementById("knife2_boss");
var knife2_damage = document.getElementById("knife2_damage");
var knife2c_boss = document.getElementById("knife2c_boss");
var knife2c_damage = document.getElementById("knife2c_damage");
var knife3_boss = document.getElementById("knife3_boss");
var knife3_damage = document.getElementById("knife3_damage");
var knife3c_boss = document.getElementById("knife3c_boss");
var knife3c_damage = document.getElementById("knife3c_damage");
// 在页面加载完成后执行获取参数的操作
window.onload = function () {
// 获取名为 "param" 的参数值
paramValue = getParameterByName('id');
console.log(paramValue);
axios.get("http://127.0.0.1:10001/api/record/" + paramValue)
.then(function (response) {
// 在這裡處理回傳的資料
var options = response.data;
console.log(options);
memberId = options.member._id;
knife1_boss.value = options.record1.boss;
knife1_damage.value = options.record1.damage ?? "";
knife1c_boss.value = options.record1c.boss;
knife1c_damage.value = options.record1.damage ?? "";
knife2_boss.value = options.record2.boss;
knife2_damage.value = options.record2.damage ?? "";
knife2c_boss.value = options.record2c.boss;
knife2c_damage.value = options.record2c.damage ?? "";
knife3_boss.value = options.record3.boss;
knife3_damage.value = options.record3.damage ?? "";
knife3c_boss.value = options.record3c.boss;
knife3c_damage.value = options.record3c.damage ?? "";
})
.catch(function (error) {
// 處理錯誤
console.error(error);
});
};
document.getElementById("record-form").addEventListener("submit", function (event) {
event.preventDefault(); // 阻止表单的默认提交行为
// 执行登录请求
fillRecord(
paramValue,
memberId,
knife1_boss.value,
knife1_damage.value,
knife1c_boss.value,
knife1c_damage.value,
knife2_boss.value,
knife2_damage.value,
knife2c_boss.value,
knife2c_damage.value,
knife3_boss.value,
knife3_damage.value,
knife3c_boss.value,
knife3c_damage.value
);
});
function getParameterByName(name) {
// 获取 URL 中的参数部分
var url = window.location.href;
// 对 URL 进行解析
var parsedUrl = new URL(url);
// 从解析后的 URL 中获取参数值
return parsedUrl.searchParams.get(name);
}
function fillRecord(
recordId,
memberId,
knife1_boss,
knife1_damage,
knife1c_boss,
knife1c_damage,
knife2_boss,
knife2_damage,
knife2c_boss,
knife2c_damage,
knife3_boss,
knife3_damage,
knife3c_boss,
knife3c_damage
) {
// 发送登录请求
axios.put("http://127.0.0.1:10001/api/record/" + recordId, {
memberId: memberId,
record1: {
boss: knife1_boss,
damage: parseInt(knife1_damage),
},
record1c: {
boss: knife1c_boss,
damage: parseInt(knife1c_damage),
},
record2: {
boss: knife2_boss,
damage: parseInt(knife2_damage),
},
record2c: {
boss: knife2c_boss,
damage: parseInt(knife2c_damage),
},
record3: {
boss: knife3_boss,
damage: parseInt(knife3_damage),
},
record3c: {
boss: knife3c_boss,
damage: parseInt(knife3c_damage),
}
})
.then(function (response) {
window.location.href = "./index.html";
})
.catch(function (error) {
const message = error.response.data.message;
alert("更新失敗");
//console.error('登入失敗:', error);
});
}
</script>
</body>
</html>