604 lines
24 KiB
HTML
604 lines
24 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="zh-CN">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>KaMiXiTong API测试平台</title>
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||
|
|
line-height: 1.6;
|
||
|
|
margin: 0;
|
||
|
|
padding: 20px;
|
||
|
|
background-color: #f5f5f5;
|
||
|
|
}
|
||
|
|
.container {
|
||
|
|
max-width: 1200px;
|
||
|
|
margin: 0 auto;
|
||
|
|
background-color: white;
|
||
|
|
padding: 20px;
|
||
|
|
border-radius: 8px;
|
||
|
|
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
||
|
|
}
|
||
|
|
h1, h2, h3 {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.api-section {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
padding: 20px;
|
||
|
|
border: 1px solid #ddd;
|
||
|
|
border-radius: 5px;
|
||
|
|
background-color: #fafafa;
|
||
|
|
}
|
||
|
|
.form-group {
|
||
|
|
margin-bottom: 15px;
|
||
|
|
}
|
||
|
|
label {
|
||
|
|
display: block;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
input, select, textarea {
|
||
|
|
width: 100%;
|
||
|
|
padding: 8px;
|
||
|
|
border: 1px solid #ddd;
|
||
|
|
border-radius: 4px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
}
|
||
|
|
button {
|
||
|
|
background-color: #007bff;
|
||
|
|
color: white;
|
||
|
|
padding: 10px 20px;
|
||
|
|
border: none;
|
||
|
|
border-radius: 4px;
|
||
|
|
cursor: pointer;
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
button:hover {
|
||
|
|
background-color: #0056b3;
|
||
|
|
}
|
||
|
|
.response {
|
||
|
|
margin-top: 15px;
|
||
|
|
padding: 15px;
|
||
|
|
background-color: #e9ecef;
|
||
|
|
border-radius: 4px;
|
||
|
|
white-space: pre-wrap;
|
||
|
|
font-family: 'Courier New', Courier, monospace;
|
||
|
|
}
|
||
|
|
.success {
|
||
|
|
background-color: #d4edda;
|
||
|
|
border-color: #c3e6cb;
|
||
|
|
color: #155724;
|
||
|
|
}
|
||
|
|
.error {
|
||
|
|
background-color: #f8d7da;
|
||
|
|
border-color: #f5c6cb;
|
||
|
|
color: #721c24;
|
||
|
|
}
|
||
|
|
.tabs {
|
||
|
|
display: flex;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
.tab {
|
||
|
|
padding: 10px 20px;
|
||
|
|
background-color: #e9ecef;
|
||
|
|
cursor: pointer;
|
||
|
|
border: 1px solid #ddd;
|
||
|
|
border-bottom: none;
|
||
|
|
border-radius: 5px 5px 0 0;
|
||
|
|
margin-right: 5px;
|
||
|
|
}
|
||
|
|
.tab.active {
|
||
|
|
background-color: #007bff;
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
.tab-content {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.tab-content.active {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="container">
|
||
|
|
<h1>KaMiXiTong API测试平台</h1>
|
||
|
|
<p>这是一个用于测试KaMiXiTong系统所有API接口的前端页面。</p>
|
||
|
|
|
||
|
|
<div class="tabs">
|
||
|
|
<div class="tab active" onclick="openTab('admin')">用户管理</div>
|
||
|
|
<div class="tab" onclick="openTab('ticket')">工单管理</div>
|
||
|
|
<div class="tab" onclick="openTab('license')">卡密管理</div>
|
||
|
|
<div class="tab" onclick="openTab('version')">版本管理</div>
|
||
|
|
<div class="tab" onclick="openTab('device')">设备管理</div>
|
||
|
|
<div class="tab" onclick="openTab('product')">产品管理</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 用户管理 -->
|
||
|
|
<div id="admin" class="tab-content active">
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>创建管理员</h2>
|
||
|
|
<form id="createAdminForm">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="username">用户名:</label>
|
||
|
|
<input type="text" id="username" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="adminEmail">邮箱:</label>
|
||
|
|
<input type="email" id="adminEmail">
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="password">密码:</label>
|
||
|
|
<input type="password" id="password" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="role">角色:</label>
|
||
|
|
<select id="role">
|
||
|
|
<option value="0">普通管理员</option>
|
||
|
|
<option value="1">超级管理员</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="adminStatus">状态:</label>
|
||
|
|
<select id="adminStatus">
|
||
|
|
<option value="1">正常</option>
|
||
|
|
<option value="0">禁用</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<button type="submit">创建管理员</button>
|
||
|
|
</form>
|
||
|
|
<div id="createAdminResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>获取管理员列表</h2>
|
||
|
|
<button onclick="getAdmins()">获取管理员列表</button>
|
||
|
|
<div id="getAdminsResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>更新管理员</h2>
|
||
|
|
<form id="updateAdminForm">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="updateAdminId">管理员ID:</label>
|
||
|
|
<input type="number" id="updateAdminId" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="updateUsername">用户名:</label>
|
||
|
|
<input type="text" id="updateUsername">
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="updateAdminEmail">邮箱:</label>
|
||
|
|
<input type="email" id="updateAdminEmail">
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="updatePassword">密码 (留空则不更新):</label>
|
||
|
|
<input type="password" id="updatePassword">
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="updateRole">角色:</label>
|
||
|
|
<select id="updateRole">
|
||
|
|
<option value="">不更新</option>
|
||
|
|
<option value="0">普通管理员</option>
|
||
|
|
<option value="1">超级管理员</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="updateAdminStatus">状态:</label>
|
||
|
|
<select id="updateAdminStatus">
|
||
|
|
<option value="">不更新</option>
|
||
|
|
<option value="1">正常</option>
|
||
|
|
<option value="0">禁用</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<button type="submit">更新管理员</button>
|
||
|
|
</form>
|
||
|
|
<div id="updateAdminResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 工单管理 -->
|
||
|
|
<div id="ticket" class="tab-content">
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>创建工单</h2>
|
||
|
|
<form id="createTicketForm">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="ticketTitle">标题:</label>
|
||
|
|
<input type="text" id="ticketTitle" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="productId">产品ID:</label>
|
||
|
|
<input type="text" id="productId" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="ticketDescription">描述:</label>
|
||
|
|
<textarea id="ticketDescription" required></textarea>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="priority">优先级:</label>
|
||
|
|
<select id="priority">
|
||
|
|
<option value="1">低</option>
|
||
|
|
<option value="2">中</option>
|
||
|
|
<option value="3">高</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<button type="submit">创建工单</button>
|
||
|
|
</form>
|
||
|
|
<div id="createTicketResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>获取工单列表</h2>
|
||
|
|
<button onclick="getTickets()">获取工单列表</button>
|
||
|
|
<div id="getTicketsResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 卡密管理 -->
|
||
|
|
<div id="license" class="tab-content">
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>生成卡密</h2>
|
||
|
|
<form id="generateLicenseForm">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="licenseProductId">产品ID:</label>
|
||
|
|
<input type="text" id="licenseProductId" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="count">生成数量:</label>
|
||
|
|
<input type="number" id="count" value="1" min="1" max="10000" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="licenseType">卡密类型:</label>
|
||
|
|
<select id="licenseType">
|
||
|
|
<option value="0">试用</option>
|
||
|
|
<option value="1" selected>正式</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="validDays">有效期(天):</label>
|
||
|
|
<input type="number" id="validDays" value="365" min="1" required>
|
||
|
|
</div>
|
||
|
|
<button type="submit">生成卡密</button>
|
||
|
|
</form>
|
||
|
|
<div id="generateLicenseResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>获取卡密列表</h2>
|
||
|
|
<button onclick="getLicenses()">获取卡密列表</button>
|
||
|
|
<div id="getLicensesResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 版本管理 -->
|
||
|
|
<div id="version" class="tab-content">
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>创建版本</h2>
|
||
|
|
<form id="createVersionForm">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="versionProductId">产品ID:</label>
|
||
|
|
<input type="text" id="versionProductId" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="versionNum">版本号:</label>
|
||
|
|
<input type="text" id="versionNum" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="platform">平台:</label>
|
||
|
|
<input type="text" id="platform">
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="description">描述:</label>
|
||
|
|
<textarea id="description"></textarea>
|
||
|
|
</div>
|
||
|
|
<button type="submit">创建版本</button>
|
||
|
|
</form>
|
||
|
|
<div id="createVersionResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>获取版本列表</h2>
|
||
|
|
<button onclick="getVersions()">获取版本列表</button>
|
||
|
|
<div id="getVersionsResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 设备管理 -->
|
||
|
|
<div id="device" class="tab-content">
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>获取设备列表</h2>
|
||
|
|
<button onclick="getDevices()">获取设备列表</button>
|
||
|
|
<div id="getDevicesResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 产品管理 -->
|
||
|
|
<div id="product" class="tab-content">
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>创建产品</h2>
|
||
|
|
<form id="createProductForm">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="productName">产品名称:</label>
|
||
|
|
<input type="text" id="productName" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="productDescription">描述:</label>
|
||
|
|
<textarea id="productDescription"></textarea>
|
||
|
|
</div>
|
||
|
|
<button type="submit">创建产品</button>
|
||
|
|
</form>
|
||
|
|
<div id="createProductResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="api-section">
|
||
|
|
<h2>获取产品列表</h2>
|
||
|
|
<button onclick="getProducts()">获取产品列表</button>
|
||
|
|
<div id="getProductsResponse" class="response"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// 基础URL (MySQL版本)
|
||
|
|
const BASE_URL = 'http://127.0.0.1:9004';
|
||
|
|
|
||
|
|
// 切换标签页
|
||
|
|
function openTab(tabName) {
|
||
|
|
// 隐藏所有标签页内容
|
||
|
|
const tabContents = document.getElementsByClassName('tab-content');
|
||
|
|
for (let i = 0; i < tabContents.length; i++) {
|
||
|
|
tabContents[i].classList.remove('active');
|
||
|
|
}
|
||
|
|
|
||
|
|
// 移除所有标签的活动状态
|
||
|
|
const tabs = document.getElementsByClassName('tab');
|
||
|
|
for (let i = 0; i < tabs.length; i++) {
|
||
|
|
tabs[i].classList.remove('active');
|
||
|
|
}
|
||
|
|
|
||
|
|
// 显示当前标签页并设置活动状态
|
||
|
|
document.getElementById(tabName).classList.add('active');
|
||
|
|
event.currentTarget.classList.add('active');
|
||
|
|
}
|
||
|
|
|
||
|
|
// 显示响应结果
|
||
|
|
function showResponse(elementId, data, isSuccess = true) {
|
||
|
|
const element = document.getElementById(elementId);
|
||
|
|
element.textContent = JSON.stringify(data, null, 2);
|
||
|
|
element.className = 'response ' + (isSuccess ? 'success' : 'error');
|
||
|
|
}
|
||
|
|
|
||
|
|
// 用户管理API
|
||
|
|
document.getElementById('createAdminForm').addEventListener('submit', async function(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
const adminData = {
|
||
|
|
username: document.getElementById('username').value,
|
||
|
|
email: document.getElementById('adminEmail').value,
|
||
|
|
password: document.getElementById('password').value,
|
||
|
|
role: parseInt(document.getElementById('role').value),
|
||
|
|
status: parseInt(document.getElementById('adminStatus').value)
|
||
|
|
};
|
||
|
|
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/admins`, {
|
||
|
|
method: 'POST',
|
||
|
|
headers: {
|
||
|
|
'Content-Type': 'application/json'
|
||
|
|
},
|
||
|
|
body: JSON.stringify(adminData)
|
||
|
|
});
|
||
|
|
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('createAdminResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('createAdminResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
async function getAdmins() {
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/admins`);
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('getAdminsResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('getAdminsResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
document.getElementById('updateAdminForm').addEventListener('submit', async function(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
const adminId = document.getElementById('updateAdminId').value;
|
||
|
|
const updateData = {};
|
||
|
|
|
||
|
|
const username = document.getElementById('updateUsername').value;
|
||
|
|
if (username) updateData.username = username;
|
||
|
|
|
||
|
|
const email = document.getElementById('updateAdminEmail').value;
|
||
|
|
if (email) updateData.email = email;
|
||
|
|
|
||
|
|
const password = document.getElementById('updatePassword').value;
|
||
|
|
if (password) updateData.password = password;
|
||
|
|
|
||
|
|
const role = document.getElementById('updateRole').value;
|
||
|
|
if (role !== '') updateData.role = parseInt(role);
|
||
|
|
|
||
|
|
const status = document.getElementById('updateAdminStatus').value;
|
||
|
|
if (status !== '') updateData.status = parseInt(status);
|
||
|
|
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/admins/${adminId}`, {
|
||
|
|
method: 'PUT',
|
||
|
|
headers: {
|
||
|
|
'Content-Type': 'application/json'
|
||
|
|
},
|
||
|
|
body: JSON.stringify(updateData)
|
||
|
|
});
|
||
|
|
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('updateAdminResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('updateAdminResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
// 工单管理API
|
||
|
|
document.getElementById('createTicketForm').addEventListener('submit', async function(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
const ticketData = {
|
||
|
|
title: document.getElementById('ticketTitle').value,
|
||
|
|
product_id: document.getElementById('productId').value,
|
||
|
|
description: document.getElementById('ticketDescription').value,
|
||
|
|
priority: parseInt(document.getElementById('priority').value)
|
||
|
|
};
|
||
|
|
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/tickets`, {
|
||
|
|
method: 'POST',
|
||
|
|
headers: {
|
||
|
|
'Content-Type': 'application/json'
|
||
|
|
},
|
||
|
|
body: JSON.stringify(ticketData)
|
||
|
|
});
|
||
|
|
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('createTicketResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('createTicketResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
async function getTickets() {
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/tickets`);
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('getTicketsResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('getTicketsResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// 卡密管理API
|
||
|
|
document.getElementById('generateLicenseForm').addEventListener('submit', async function(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
const licenseData = {
|
||
|
|
product_id: document.getElementById('licenseProductId').value,
|
||
|
|
count: parseInt(document.getElementById('count').value),
|
||
|
|
type: parseInt(document.getElementById('licenseType').value),
|
||
|
|
valid_days: parseInt(document.getElementById('validDays').value)
|
||
|
|
};
|
||
|
|
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/licenses`, {
|
||
|
|
method: 'POST',
|
||
|
|
headers: {
|
||
|
|
'Content-Type': 'application/json'
|
||
|
|
},
|
||
|
|
body: JSON.stringify(licenseData)
|
||
|
|
});
|
||
|
|
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('generateLicenseResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('generateLicenseResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
async function getLicenses() {
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/licenses`);
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('getLicensesResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('getLicensesResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// 版本管理API
|
||
|
|
document.getElementById('createVersionForm').addEventListener('submit', async function(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
const versionData = {
|
||
|
|
product_id: document.getElementById('versionProductId').value,
|
||
|
|
version_num: document.getElementById('versionNum').value,
|
||
|
|
platform: document.getElementById('platform').value,
|
||
|
|
description: document.getElementById('description').value
|
||
|
|
};
|
||
|
|
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/versions`, {
|
||
|
|
method: 'POST',
|
||
|
|
headers: {
|
||
|
|
'Content-Type': 'application/json'
|
||
|
|
},
|
||
|
|
body: JSON.stringify(versionData)
|
||
|
|
});
|
||
|
|
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('createVersionResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('createVersionResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
async function getVersions() {
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/versions`);
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('getVersionsResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('getVersionsResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// 设备管理API
|
||
|
|
async function getDevices() {
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/devices`);
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('getDevicesResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('getDevicesResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// 产品管理API
|
||
|
|
document.getElementById('createProductForm').addEventListener('submit', async function(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
const productData = {
|
||
|
|
product_name: document.getElementById('productName').value,
|
||
|
|
description: document.getElementById('productDescription').value
|
||
|
|
};
|
||
|
|
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/products`, {
|
||
|
|
method: 'POST',
|
||
|
|
headers: {
|
||
|
|
'Content-Type': 'application/json'
|
||
|
|
},
|
||
|
|
body: JSON.stringify(productData)
|
||
|
|
});
|
||
|
|
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('createProductResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('createProductResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
async function getProducts() {
|
||
|
|
try {
|
||
|
|
const response = await fetch(`${BASE_URL}/products`);
|
||
|
|
const result = await response.json();
|
||
|
|
showResponse('getProductsResponse', result, response.ok);
|
||
|
|
} catch (error) {
|
||
|
|
showResponse('getProductsResponse', {error: error.message}, false);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|