From 10c990bd951c53d50285e610e57e925ed77b89f1 Mon Sep 17 00:00:00 2001 From: hxuanyu <2252193204@qq.com> Date: Wed, 2 Apr 2025 15:03:09 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E6=BF=80=E6=B4=BB=E7=8A=B6?= =?UTF-8?q?=E6=80=81=E6=A0=B7=E5=BC=8F=EF=BC=8C=E7=A1=AE=E4=BF=9D=E5=9C=A8?= =?UTF-8?q?CSS=E5=92=8CJavaScript=E4=B8=AD=E6=AD=A3=E7=A1=AE=E5=A4=84?= =?UTF-8?q?=E7=90=86=E6=BF=80=E6=B4=BB=E9=A1=B9=E7=9A=84=E6=98=BE=E7=A4=BA?= =?UTF-8?q?=E9=80=BB=E8=BE=91=EF=BC=8C=E4=BC=98=E5=8C=96=E4=BB=A3=E7=A0=81?= =?UTF-8?q?=E5=8F=AF=E8=AF=BB=E6=80=A7=E5=92=8C=E7=BB=B4=E6=8A=A4=E6=80=A7?= =?UTF-8?q?=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/web/static/css/style.css | 9 +++ src/web/static/js/main.js | 118 ++++++++--------------------------- src/web/templates/index.html | 9 --- 3 files changed, 36 insertions(+), 100 deletions(-) diff --git a/src/web/static/css/style.css b/src/web/static/css/style.css index aee7bd1..8d9b218 100644 --- a/src/web/static/css/style.css +++ b/src/web/static/css/style.css @@ -74,4 +74,13 @@ .chess-list { grid-template-columns: repeat(2, 1fr); } +} + +/* 激活状态样式 */ +.synergy-weight-item.active, +.chess-weight-item.active { + background-color: #e0e7ff; + border-left: 3px solid #4f46e5; + padding-left: 5px; + border-radius: 4px; } \ No newline at end of file diff --git a/src/web/static/js/main.js b/src/web/static/js/main.js index c754313..357b784 100644 --- a/src/web/static/js/main.js +++ b/src/web/static/js/main.js @@ -552,14 +552,14 @@ function updateActiveStatus(results) { // 添加激活的羁绊 result.active_synergies.forEach(synergy => { console.log('激活羁绊：', synergy); - if (synergy.id) activeSynergies.add(synergy.id); + if (synergy.id) activeSynergies.add(String(synergy.id)); // 确保ID是字符串 if (synergy.name) activeSynergyNames.add(synergy.name); // 添加名称 }); // 添加激活的棋子 result.chess_list.forEach(chess => { console.log('激活棋子：', chess); - if (chess.id) activeChess.add(chess.id); + if (chess.id) activeChess.add(String(chess.id)); // 确保ID是字符串 if (chess.name) activeChessNames.add(chess.name); // 添加名称 }); }); @@ -569,101 +569,37 @@ function updateActiveStatus(results) { console.log('所有激活的棋子ID：', Array.from(activeChess)); console.log('所有激活的棋子名称：', Array.from(activeChessNames)); - // 记录是否有成功匹配 - let synergyMatched = false; - let chessMatched = false; - - // 使用多种方式尝试匹配 - - // 1. 通过ID直接匹配 - activeSynergies.forEach(synergyId => { - const selector = `.synergy-weight-item[data-synergy-id="${synergyId}"]`; - const $elements = $(selector); - console.log('查找羁绊元素(通过ID)：', selector, $elements.length); - if ($elements.length > 0) { - $elements.addClass('active'); - synergyMatched = true; + // 处理羁绊激活状态 + $('.synergy-weight-item').each(function() { + const $item = $(this); + const synergyId = String($item.data('synergy-id')); + const synergyName = $item.data('synergy-name') || $item.find('label').text().trim(); + + // 通过ID或名称匹配 + if (activeSynergies.has(synergyId) || + activeSynergyNames.has(synergyName) || + activeSynergyNames.has(synergyName.toLowerCase())) { + $item.addClass('active'); + console.log('激活羁绊：', synergyId, synergyName); } }); - activeChess.forEach(chessId => { - const selector = `.chess-weight-item[data-chess-id="${chessId}"]`; - const $elements = $(selector); - console.log('查找棋子元素(通过ID)：', selector, $elements.length); - if ($elements.length > 0) { - $elements.addClass('active'); - chessMatched = true; + // 处理棋子激活状态 + $('.chess-weight-item').each(function() { + const $item = $(this); + const chessId = String($item.data('chess-id')); + const chessName = $item.data('chess-name') || $item.find('label').text().trim(); + + // 通过ID或名称匹配 + if (activeChess.has(chessId) || + activeChessNames.has(chessName) || + activeChessNames.has(chessName.toLowerCase())) { + $item.addClass('active'); + console.log('激活棋子：', chessId, chessName); } }); - // 2. 通过名称匹配 - if (!synergyMatched) { - console.log('ID匹配失败，尝试使用名称匹配羁绊'); - $('.synergy-weight-item').each(function() { - const $item = $(this); - const synergyName = $item.find('label').text().trim(); - const dataName = $item.data('synergy-name'); - - if (activeSynergyNames.has(synergyName) || - (dataName && activeSynergyNames.has(dataName))) { - $item.addClass('active'); - console.log('通过名称匹配到羁绊：', synergyName); - synergyMatched = true; - } - }); - } - - if (!chessMatched) { - console.log('ID匹配失败，尝试使用名称匹配棋子'); - $('.chess-weight-item').each(function() { - const $item = $(this); - const chessName = $item.find('label').text().trim(); - const dataName = $item.data('chess-name'); - - if (activeChessNames.has(chessName) || - (dataName && activeChessNames.has(dataName))) { - $item.addClass('active'); - console.log('通过名称匹配到棋子：', chessName); - chessMatched = true; - } - }); - } - - // 3. 最后的尝试：直接遍历匹配名称（不区分大小写） - if (!synergyMatched) { - console.log('所有正常匹配方式失败，尝试不区分大小写的名称匹配'); - const lowerSynergyNames = Array.from(activeSynergyNames).map(name => name.toLowerCase()); - - $('.synergy-weight-item').each(function() { - const $item = $(this); - const synergyName = $item.find('label').text().trim().toLowerCase(); - - if (lowerSynergyNames.includes(synergyName)) { - $item.addClass('active'); - console.log('通过不区分大小写名称匹配到羁绊：', synergyName); - } - }); - } - - if (!chessMatched) { - const lowerChessNames = Array.from(activeChessNames).map(name => name.toLowerCase()); - - $('.chess-weight-item').each(function() { - const $item = $(this); - const chessName = $item.find('label').text().trim().toLowerCase(); - - if (lowerChessNames.includes(chessName)) { - $item.addClass('active'); - console.log('通过不区分大小写名称匹配到棋子：', chessName); - } - }); - } - - // 添加高亮样式，以便更好地区分激活项 - $('.synergy-weight-item.active').css('background-color', '#e0e7ff'); - $('.chess-weight-item.active').css('background-color', '#e0e7ff'); - - // 输出激活项目数量统计 + // 记录激活项目数量统计 console.log('成功激活的羁绊数量：', $('.synergy-weight-item.active').length); console.log('成功激活的棋子数量：', $('.chess-weight-item.active').length); diff --git a/src/web/templates/index.html b/src/web/templates/index.html index 99a39fc..61bf1c3 100644 --- a/src/web/templates/index.html +++ b/src/web/templates/index.html @@ -44,15 +44,6 @@ .drawer-backdrop.open { display: block; } - - /* 添加激活状态样式 */ - .synergy-weight-item.active, - .chess-weight-item.active { - background-color: #e0e7ff; - border-left: 3px solid #4f46e5; - padding-left: 5px; - border-radius: 4px; - }