92 lines
2.8 KiB
HTML
92 lines
2.8 KiB
HTML
|
<!--
|
||
|
* @Author: giaogiao giaogiao
|
||
|
* @Date: 2023-08-28 10:33:48
|
||
|
* @LastEditors: giaogiao giaogiao
|
||
|
* @LastEditTime: 2023-08-31 17:41:31
|
||
|
* @FilePath: \goweb\app\index.html
|
||
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||
|
-->
|
||
|
<!DOCTYPE html>
|
||
|
<html>
|
||
|
<head>
|
||
|
<meta charset="utf-8" />
|
||
|
<title>透你猴子</title>
|
||
|
<script type="text/javascript" src="static/index.js"></script>
|
||
|
<script type="text/javascript" src="static/tailwindcss3.3.3.js"></script>
|
||
|
</head>
|
||
|
<body class="bg-gray-100">
|
||
|
<!-- <div class="rounded-lg bg-white p-10 shadow-lg">
|
||
|
<div class="mb-4 flex items-center">
|
||
|
<input
|
||
|
type="text"
|
||
|
class="w-full rounded-lg border border-gray-40 p-2"
|
||
|
placeholder="mac地址"
|
||
|
id="mac"
|
||
|
/>
|
||
|
<button id="btn"
|
||
|
class="ml-2 rounded-lg bg-blue-500 p-2 text-white hover:bg-blue-600"
|
||
|
>
|
||
|
发送
|
||
|
</button>
|
||
|
</div>
|
||
|
</div> -->
|
||
|
<div class="min-h-screen flex items-center justify-center">
|
||
|
<div class="max-w-md w-full p-6 bg-white rounded-lg shadow-lg">
|
||
|
<div class="flex justify-center mb-8">
|
||
|
<img
|
||
|
src="https://www.emprenderconactitud.com/img/POC%20WCS%20(1).png"
|
||
|
alt="Logo"
|
||
|
class="w-30 h-20"
|
||
|
/>
|
||
|
</div>
|
||
|
<h1 class="text-2xl font-semibold text-center text-gray-500 mt-8 mb-6">
|
||
|
发送mac地址
|
||
|
</h1>
|
||
|
<p class="text-sm text-gray-600 text-justify mt-8 mb-6">
|
||
|
<input
|
||
|
type="text"
|
||
|
class="w-full rounded-lg border border-gray-40 p-2"
|
||
|
placeholder="mac地址"
|
||
|
id="mac"
|
||
|
/>
|
||
|
</p>
|
||
|
<div class="flex justify-center space-x-4 my-4">
|
||
|
<button
|
||
|
id="btn"
|
||
|
class="bg-gradient-to-r from-cyan-400 to-cyan-600 text-white px-4 py-2 rounded-md w-1/3"
|
||
|
>
|
||
|
发送
|
||
|
</button>
|
||
|
</div>
|
||
|
<div class="text-center">
|
||
|
<!-- <p class="text-sm">Volver a <a href="#" class="text-cyan-600">Iniciar sesión</a></p> -->
|
||
|
</div>
|
||
|
<p class="text-xs text-gray-600 text-center mt-8">
|
||
|
© 2023 WCS LAT
|
||
|
</p>
|
||
|
</div>
|
||
|
</div>
|
||
|
<p id="output"></p>
|
||
|
</body>
|
||
|
<script>
|
||
|
function isMACAddress(strMac) {
|
||
|
var reg = /^([0-9a-fA-F]{2})(([/\s:][0-9a-fA-F]{2}){5})$/;
|
||
|
if (reg.test(strMac)) {
|
||
|
return true;
|
||
|
} else {
|
||
|
return false;
|
||
|
}
|
||
|
}
|
||
|
var btn = document.getElementById("btn");
|
||
|
btn.addEventListener("click", function (e) {
|
||
|
let mac = document.getElementById("mac").value;
|
||
|
if (!isMACAddress(mac)) {
|
||
|
console.log("mac输入错误");
|
||
|
return;
|
||
|
}
|
||
|
let data = { method: "start", data: { mac } };
|
||
|
ws.send(JSON.stringify(data));
|
||
|
});
|
||
|
</script>
|
||
|
</html>
|