jinchao/XNSim
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

顶部机型与构型的选择已完成修改

Browse Source
This commit is contained in:
jinchao 2025-05-16 09:21:11 +08:00
parent 5ac2f08724
commit 61cfdb94e9
8 changed files with 199 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
Release/database/XNSim.db
View File

Binary file not shown.

104
XNSimHtml/components/header-tools.js
View File

@ -7,10 +7,46 @@ class HeaderTools extends HTMLElement {
}
// 添加getter方法
get selectedPlane() {
return this.shadowRoot.getElementById('planeSelect').value;
}
get selectedProduct() {
return this.shadowRoot.getElementById('productSelect').value;
}
// 保存选择到localStorage
saveSelection() {
const selection = {
plane: this.selectedPlane,
product: this.selectedProduct
};
localStorage.setItem('xnsim-selection', JSON.stringify(selection));
}
// 从localStorage恢复选择
restoreSelection() {
const savedSelection = localStorage.getItem('xnsim-selection');
if (savedSelection) {
const selection = JSON.parse(savedSelection);
const planeSelect = this.shadowRoot.getElementById('planeSelect');
const productSelect = this.shadowRoot.getElementById('productSelect');
// 先加载机型列表
this.loadPlanes().then(() => {
if (selection.plane) {
planeSelect.value = selection.plane;
// 加载该机型下的构型列表
this.loadProducts(selection.plane).then(() => {
if (selection.product) {
productSelect.value = selection.product;
}
});
}
});
}
}
render() {
this.shadowRoot.innerHTML = `
<style>
@ -41,18 +77,18 @@ class HeaderTools extends HTMLElement {
height: 20px;
}
.product-container {
.select-container {
display: flex;
align-items: center;
gap: 8px;
}
.product-label {
.select-label {
font-size: 14px;
color: #666;
}
.product-select {
.plane-select, .product-select {
min-width: 120px;
height: 32px;
padding: 0 8px;
@ -70,7 +106,7 @@ class HeaderTools extends HTMLElement {
border-radius: 4px;
background-color: white;
padding: 0 8px;
margin-left: 50px; /* 增加与下拉框的间距 */
margin-left: 50px;
}
.search-box input {
@ -86,8 +122,14 @@ class HeaderTools extends HTMLElement {
opacity: 0.5;
}
</style>
<div class="product-container">
<span class="product-label">构型：</span>
<div class="select-container">
<span class="select-label">机型：</span>
<select class="plane-select" id="planeSelect">
<option value="">选择机型</option>
</select>
</div>
<div class="select-container">
<span class="select-label">构型：</span>
<select class="product-select" id="productSelect">
<option value="">选择构型</option>
</select>
@ -112,8 +154,12 @@ class HeaderTools extends HTMLElement {
}
addEventListeners() {
// 加载机型列表
this.loadPlanes();
// 加载构型列表
this.loadProducts();
// 恢复上次的选择
this.restoreSelection();
// 字体大小调整
this.shadowRoot.getElementById('fontSizeBtn').addEventListener('click', () => {
@ -135,17 +181,54 @@ class HeaderTools extends HTMLElement {
this.dispatchEvent(new CustomEvent('online-users-click'));
});
// 机型选择
this.shadowRoot.getElementById('planeSelect').addEventListener('change', (e) => {
this.dispatchEvent(new CustomEvent('plane-change', {
detail: { plane: e.target.value }
}));
// 当机型改变时，重新加载该机型下的构型列表
this.loadProducts(e.target.value);
// 保存选择
this.saveSelection();
});
// 构型选择
this.shadowRoot.getElementById('productSelect').addEventListener('change', (e) => {
this.dispatchEvent(new CustomEvent('product-change', {
detail: { product: e.target.value }
}));
// 保存选择
this.saveSelection();
});
}
async loadProducts() {
async loadPlanes() {
try {
const response = await fetch('/api/products');
const response = await fetch('/api/planes');
if (!response.ok) {
throw new Error('获取机型列表失败');
}
const planes = await response.json();
const select = this.shadowRoot.getElementById('planeSelect');
// 清空现有选项
select.innerHTML = '<option value="">选择机型</option>';
planes.forEach(plane => {
const option = document.createElement('option');
option.value = plane.PlaneName;
option.textContent = plane.PlaneName;
select.appendChild(option);
});
} catch (error) {
console.error('加载机型列表失败:', error);
}
}
async loadProducts(planeName = '') {
try {
const url = planeName ? `/api/configurations?plane=${planeName}` : '/api/configurations';
const response = await fetch(url);
if (!response.ok) {
throw new Error('获取构型列表失败');
}
@ -157,13 +240,12 @@ class HeaderTools extends HTMLElement {
products.forEach(product => {
const option = document.createElement('option');
option.value = product.ProductName;
option.textContent = product.ProductName;
option.value = product.ConfName;
option.textContent = product.ConfName;
select.appendChild(option);
});
} catch (error) {
console.error('加载构型列表失败:', error);
// 可以在这里添加错误提示UI
}
}
}

71
XNSimHtml/routes/configurations.js Normal file
View File

@ -0,0 +1,71 @@
const express = require('express');
const router = express.Router();
const {
getConfigurations,
getConfigurationById,
createConfiguration,
updateConfiguration,
deleteConfiguration
} = require('../utils/configuration-utils');
// 获取所有配置列表
router.get('/configurations', (req, res) => {
try {
const planeName = req.query.plane;
const configs = getConfigurations(planeName);
res.json(configs);
} catch (error) {
console.error('获取配置列表失败:', error);
res.status(500).json({ error: '获取配置列表失败', details: error.message });
}
});
// 根据ID获取配置
router.get('/configurations/:id', (req, res) => {
try {
const config = getConfigurationById(req.params.id);
if (!config) {
return res.status(404).json({ error: '配置不存在' });
}
res.json(config);
} catch (error) {
console.error('获取配置详情失败:', error);
res.status(500).json({ error: '获取配置详情失败', details: error.message });
}
});
// 创建新配置
router.post('/configurations', (req, res) => {
try {
const result = createConfiguration(req.body);
res.status(201).json(result);
} catch (error) {
console.error('创建配置失败:', error);
res.status(500).json({ error: '创建配置失败', details: error.message });
}
});
// 更新配置
router.put('/configurations/:id', (req, res) => {
try {
const configData = { ...req.body, ConfID: req.params.id };
const result = updateConfiguration(configData);
res.json(result);
} catch (error) {
console.error('更新配置失败:', error);
res.status(500).json({ error: '更新配置失败', details: error.message });
}
});
// 删除配置
router.delete('/configurations/:id', (req, res) => {
try {
const result = deleteConfiguration(req.params.id);
res.json(result);
} catch (error) {
console.error('删除配置失败:', error);
res.status(500).json({ error: '删除配置失败', details: error.message });
}
});
module.exports = router;

16
XNSimHtml/routes/planes.js Normal file
View File

@ -0,0 +1,16 @@
const express = require('express');
const router = express.Router();
const { getPlanes } = require('../utils/db-utils');
// 获取所有飞机列表
router.get('/planes', (req, res) => {
try {
const planes = getPlanes();
res.json(planes);
} catch (error) {
console.error('获取飞机列表失败:', error);
res.status(500).json({ error: '获取飞机列表失败', details: error.message });
}
});
module.exports = router;

16
XNSimHtml/routes/products.js
View File

@ -1,16 +0,0 @@
const express = require('express');
const router = express.Router();
const { getProducts } = require('../utils/db-utils');
// 获取所有构型列表
router.get('/products', (req, res) => {
try {
const products = getProducts();
res.json(products);
} catch (error) {
console.error('获取构型列表失败:', error);
res.status(500).json({ error: '获取构型列表失败', details: error.message });
}
});
module.exports = router;

6
XNSimHtml/server.js
View File

@ -20,7 +20,8 @@ const projectModelRoutes = require('./routes/project-model');
const ataChaptersRoutes = require('./routes/model-dev');
const simulationRoutes = require('./routes/run-simulation');
const udpMonitorRoutes = require('./routes/udp-monitor');
const productsRoutes = require('./routes/products');
const planesRoutes = require('./routes/planes');
const configurationsRoutes = require('./routes/configurations');
const interfaceRoutes = require('./routes/interface-config');
const icdImportRoutes = require('./routes/icd-import');
const qaRoutes = require('./routes/qa');
@ -91,7 +92,8 @@ app.use('/api', projectModelRoutes);
app.use('/api', ataChaptersRoutes);
app.use('/api', simulationRoutes);
app.use('/api/udp-monitor', udpMonitorRoutes);
app.use('/api', productsRoutes);
app.use('/api', planesRoutes);
app.use('/api', configurationsRoutes);
app.use('/api/interface', interfaceRoutes);
app.use('/api/icd', icdImportRoutes);
app.use('/api/qa', qaRoutes);

17
XNSimHtml/utils/configuration-utils.js
View File

@ -1,14 +1,23 @@
const { getDBConnection } = require('./file-utils');
// 获取所有配置
function getConfigurations() {
function getConfigurations(planeName) {
try {
const db = getDBConnection(true);
const configs = db.prepare(`
let query = `
SELECT * FROM Configuration
ORDER BY ConfID ASC
`).all();
`;
const params = [];
if (planeName) {
query += ` WHERE PlaneName = ?`;
params.push(planeName);
}
query += ` ORDER BY ConfID ASC`;
const configs = db.prepare(query).all(...params);
return configs;
} catch (error) {

4
XNSimHtml/utils/file-utils.js
View File

@ -22,8 +22,8 @@ function getDBConnection(readonly = false) {
throw new Error('无法找到数据库文件');
}
// 打开数据库连接
dbConnection = new Database(dbPath, { readonly });
// 打开数据库连接，始终以可读可写模式打开
dbConnection = new Database(dbPath);
return dbConnection;
} catch (error) {
console.error('数据库连接失败:', error);