fix(ui): improve suggestion handling in unresolved series template
- Update Font Awesome from 6.0.0 to 6.6.0 - Replace suggestion links with buttons for better click handling - Add debug logging for troubleshooting suggestion clicks - Use 'link' field as primary provider key source
This commit is contained in:
@@ -6,7 +6,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>AniWorld Manager - Resolve Series</title>
|
||||
<link rel="stylesheet" href="/static/css/styles.css?v={{ static_version('css/styles.css') }}">
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" rel="stylesheet">
|
||||
<style>
|
||||
.unresolved-container {
|
||||
min-height: 100vh;
|
||||
@@ -198,15 +198,27 @@
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.suggestion-link {
|
||||
.suggestion-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
color: var(--color-accent);
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.suggestion-link:hover {
|
||||
.suggestion-btn:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.suggestion-btn .key-label {
|
||||
color: var(--color-text-secondary);
|
||||
font-size: 0.8rem;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.no-suggestions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -591,12 +603,17 @@
|
||||
// Render functions
|
||||
function renderFolderItem(folder) {
|
||||
const suggestionsHtml = folder.search_suggestions && folder.search_suggestions.length > 0
|
||||
? folder.search_suggestions.map(s => `
|
||||
? folder.search_suggestions.map(s => {
|
||||
console.log('[DEBUG] Rendering suggestion:', s);
|
||||
return `
|
||||
<div class="suggestion-item">
|
||||
<i class="fas fa-link"></i>
|
||||
<a href="#" class="suggestion-link" data-provider-key="${s.provider_key || s.key || ''}" data-folder="${folder.folder_name}">${s.name || s.title}</a>
|
||||
<i class="fas fa-hand-pointer"></i>
|
||||
<button class="suggestion-btn" data-provider-key="${s.link || s.provider_key || s.key || ''}" data-folder="${folder.folder_name}">
|
||||
${s.name || s.title} <span class="key-label">(${s.link || ''})</span>
|
||||
</button>
|
||||
</div>
|
||||
`).join('')
|
||||
`;
|
||||
}).join('')
|
||||
: '<div class="no-suggestions"><i class="fas fa-info-circle"></i> No suggestions found</div>';
|
||||
|
||||
// Always show search row so user can search multiple times
|
||||
@@ -666,11 +683,16 @@
|
||||
}
|
||||
|
||||
function attachSuggestionLinkEvents() {
|
||||
document.querySelectorAll('.suggestion-link').forEach(link => {
|
||||
document.querySelectorAll('.suggestion-btn').forEach(link => {
|
||||
link.addEventListener('click', async (e) => {
|
||||
e.preventDefault();
|
||||
const providerKey = e.target.dataset.providerKey;
|
||||
const folder = e.target.dataset.folder;
|
||||
// Use 'link' from closure, not e.target, to handle clicks on child elements
|
||||
const providerKey = link.dataset.providerKey;
|
||||
const folder = link.dataset.folder;
|
||||
|
||||
console.log('[DEBUG] Suggestion clicked:', { providerKey, folder, link });
|
||||
console.log('[DEBUG] Full dataset:', link.dataset);
|
||||
console.log('[DEBUG] Suggestion object keys:', link.dataset);
|
||||
|
||||
if (!providerKey) {
|
||||
showToast('No provider key available for this suggestion', 'error');
|
||||
@@ -823,8 +845,10 @@
|
||||
if (result.search_suggestions && result.search_suggestions.length > 0) {
|
||||
suggestionsEl.innerHTML = result.search_suggestions.map(s => `
|
||||
<div class="suggestion-item">
|
||||
<i class="fas fa-link"></i>
|
||||
<a href="#" class="suggestion-link" data-provider-key="${s.provider_key || s.key || ''}" data-folder="${folder}">${s.name || s.title}</a>
|
||||
<i class="fas fa-hand-pointer"></i>
|
||||
<button class="suggestion-btn" data-provider-key="${s.link || s.provider_key || s.key || ''}" data-folder="${folder}">
|
||||
${s.name || s.title} <span class="key-label">(${s.link || ''})</span>
|
||||
</button>
|
||||
</div>
|
||||
`).join('');
|
||||
} else {
|
||||
|
||||
Reference in New Issue
Block a user