This commit is contained in:
2025-06-24 09:52:09 +02:00
parent 875e20304b
commit 6412d9f01a
3 changed files with 164 additions and 88 deletions

View File

@@ -1,6 +1,6 @@
from flask import Blueprint, jsonify from flask import Blueprint, jsonify, request
from flask_login import login_required, current_user from flask_login import login_required, current_user
from models import db, Room, RoomFile, User, DocuPulseSettings from models import db, Room, RoomFile, User, DocuPulseSettings, HelpArticle
import os import os
from datetime import datetime from datetime import datetime
@@ -253,9 +253,9 @@ def get_usage_stats():
stats = DocuPulseSettings.get_usage_stats() stats = DocuPulseSettings.get_usage_stats()
return jsonify(stats) return jsonify(stats)
except Exception as e: except Exception as e:
return jsonify({'error': str(e)}), 500 return jsonify({'error': str(e)}), 500
@admin.route('/help-articles/<int:article_id>', methods=['PUT']) @admin.route('/api/admin/help-articles/<int:article_id>', methods=['PUT'])
@login_required @login_required
def update_help_article(article_id): def update_help_article(article_id):
"""Update a help article""" """Update a help article"""
@@ -307,7 +307,7 @@ def update_help_article(article_id):
db.session.rollback() db.session.rollback()
return jsonify({'error': str(e)}), 500 return jsonify({'error': str(e)}), 500
@admin.route('/help-articles/<int:article_id>', methods=['DELETE']) @admin.route('/api/admin/help-articles/<int:article_id>', methods=['DELETE'])
@login_required @login_required
def delete_help_article(article_id): def delete_help_article(article_id):
"""Delete a help article""" """Delete a help article"""
@@ -339,7 +339,7 @@ def delete_help_article(article_id):
return jsonify({'error': str(e)}), 500 return jsonify({'error': str(e)}), 500
# Help Articles API endpoints # Help Articles API endpoints
@admin.route('/help-articles', methods=['GET']) @admin.route('/api/admin/help-articles', methods=['GET'])
@login_required @login_required
def get_help_articles(): def get_help_articles():
"""Get all help articles""" """Get all help articles"""
@@ -364,7 +364,7 @@ def get_help_articles():
return jsonify({'articles': articles_data}) return jsonify({'articles': articles_data})
@admin.route('/help-articles', methods=['POST']) @admin.route('/api/admin/help-articles', methods=['POST'])
@login_required @login_required
def create_help_article(): def create_help_article():
"""Create a new help article""" """Create a new help article"""
@@ -417,7 +417,7 @@ def create_help_article():
db.session.rollback() db.session.rollback()
return jsonify({'error': str(e)}), 500 return jsonify({'error': str(e)}), 500
@admin.route('/help-articles/<int:article_id>', methods=['GET']) @admin.route('/api/admin/help-articles/<int:article_id>', methods=['GET'])
@login_required @login_required
def get_help_article(article_id): def get_help_article(article_id):
"""Get a specific help article""" """Get a specific help article"""

View File

@@ -30,6 +30,37 @@
.note-editor .note-editing-area { .note-editor .note-editing-area {
background-color: var(--white); background-color: var(--white);
} }
.note-editor .note-toolbar {
background-color: var(--bg-color);
border-bottom: 1px solid var(--border-color);
border-radius: 0.375rem 0.375rem 0 0;
}
.note-editor .note-btn {
border: 1px solid var(--border-color);
background-color: var(--white);
color: var(--text-dark);
}
.note-editor .note-btn:hover {
background-color: var(--primary-color);
color: var(--white);
border-color: var(--primary-color);
}
.note-editor .note-btn.active {
background-color: var(--primary-color);
color: var(--white);
border-color: var(--primary-color);
}
.note-editor .note-editing-area .note-editable {
color: var(--text-dark);
font-family: inherit;
line-height: 1.6;
padding: 15px;
}
.note-editor .note-status-output {
background-color: var(--bg-color);
border-top: 1px solid var(--border-color);
color: var(--text-muted);
}
</style> </style>
{% endblock %} {% endblock %}
@@ -207,70 +238,83 @@
{% endblock %} {% endblock %}
{% block extra_js %} {% block extra_js %}
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.js"></script>
<script> <script>
$(document).ready(function() { document.addEventListener('DOMContentLoaded', function() {
// Initialize Summernote for rich text editing // Initialize Summernote for rich text editing
$('#articleBody, #editArticleBody').summernote({ $('#articleBody, #editArticleBody').summernote({
height: 300, height: 400,
toolbar: [ toolbar: [
['style', ['style']], ['style', ['style']],
['font', ['bold', 'underline', 'italic', 'clear']], ['font', ['bold', 'underline', 'italic', 'strikethrough', 'clear']],
['fontname', ['fontname']], ['fontname', ['fontname']],
['fontsize', ['fontsize']],
['color', ['color']], ['color', ['color']],
['para', ['ul', 'ol', 'paragraph']], ['para', ['ul', 'ol', 'paragraph']],
['height', ['height']], ['height', ['height']],
['table', ['table']], ['table', ['table']],
['insert', ['link', 'picture']], ['insert', ['link', 'picture', 'video', 'hr']],
['view', ['fullscreen', 'codeview', 'help']] ['view', ['fullscreen', 'codeview', 'help']],
['undo', ['undo', 'redo']]
], ],
styleTags: [ styleTags: [
'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6'
] ],
fontNames: ['Arial', 'Arial Black', 'Comic Sans MS', 'Courier New', 'Helvetica', 'Impact', 'Tahoma', 'Times New Roman', 'Verdana'],
fontSizes: ['8', '9', '10', '11', '12', '14', '16', '18', '24', '36'],
callbacks: {
onInit: function() {
// Ensure proper styling when modal opens
$('.note-editor').css('border-color', 'var(--border-color)');
$('.note-editing-area').css('background-color', 'var(--white)');
}
}
}); });
// Load articles on page load // Load articles on page load
loadArticles(); loadArticles();
// Handle create article form submission // Handle create article form submission
$('#createArticleForm').on('submit', function(e) { document.getElementById('createArticleForm').addEventListener('submit', function(e) {
e.preventDefault(); e.preventDefault();
createArticle(); createArticle();
}); });
// Handle edit article form submission // Handle edit article form submission
$('#editArticleForm').on('submit', function(e) { document.getElementById('editArticleForm').addEventListener('submit', function(e) {
e.preventDefault(); e.preventDefault();
updateArticle(); updateArticle();
}); });
// Handle delete confirmation // Handle delete confirmation
$('#confirmDelete').on('click', function() { document.getElementById('confirmDelete').addEventListener('click', function() {
deleteArticle(); deleteArticle();
}); });
}); });
function loadArticles() { function loadArticles() {
$.get('/api/admin/help-articles', function(data) { fetch('/api/admin/help-articles')
const articlesList = $('#articlesList'); .then(response => response.json())
articlesList.empty(); .then(data => {
const articlesList = document.getElementById('articlesList');
if (data.articles.length === 0) { articlesList.innerHTML = '';
articlesList.html(`
<div class="col-12"> if (data.articles.length === 0) {
<div class="card border-0 shadow-sm"> articlesList.innerHTML = `
<div class="card-body text-center py-5"> <div class="col-12">
<i class="fas fa-file-alt text-muted" style="font-size: 3rem; opacity: 0.5;"></i> <div class="card border-0 shadow-sm">
<h4 class="text-muted mt-3">No Articles Yet</h4> <div class="card-body text-center py-5">
<p class="text-muted">Create your first help article to get started.</p> <i class="fas fa-file-alt text-muted" style="font-size: 3rem; opacity: 0.5;"></i>
<h4 class="text-muted mt-3">No Articles Yet</h4>
<p class="text-muted">Create your first help article to get started.</p>
</div>
</div> </div>
</div> </div>
</div> `;
`); return;
return; }
}
data.articles.forEach(article => {
const categoryNames = { const categoryNames = {
'getting-started': 'Getting Started', 'getting-started': 'Getting Started',
'user-management': 'User Management', 'user-management': 'User Management',
@@ -280,8 +324,10 @@ function loadArticles() {
'administration': 'Administration' 'administration': 'Administration'
}; };
const card = $(` data.articles.forEach(article => {
<div class="col-lg-6 col-xl-4 mb-4"> const card = document.createElement('div');
card.className = 'col-lg-6 col-xl-4 mb-4';
card.innerHTML = `
<div class="card article-card border-0 shadow-sm h-100"> <div class="card article-card border-0 shadow-sm h-100">
<div class="card-body"> <div class="card-body">
<div class="d-flex justify-content-between align-items-start mb-2"> <div class="d-flex justify-content-between align-items-start mb-2">
@@ -311,91 +357,120 @@ function loadArticles() {
</div> </div>
</div> </div>
</div> </div>
</div> `;
`); articlesList.appendChild(card);
articlesList.append(card); });
})
.catch(error => {
console.error('Error loading articles:', error);
showAlert('Error loading articles: ' + error.message, 'danger');
}); });
});
} }
function createArticle() { function createArticle() {
const formData = new FormData($('#createArticleForm')[0]); const form = document.getElementById('createArticleForm');
const formData = new FormData(form);
formData.set('body', $('#articleBody').summernote('code')); formData.set('body', $('#articleBody').summernote('code'));
formData.set('is_published', $('#isPublished').is(':checked')); formData.set('is_published', document.getElementById('isPublished').checked);
$.ajax({ fetch('/api/admin/help-articles', {
url: '/api/admin/help-articles',
method: 'POST', method: 'POST',
data: formData, body: formData
processData: false, })
contentType: false, .then(response => response.json())
success: function(response) { .then(data => {
$('#createArticleModal').modal('hide'); if (data.success) {
$('#createArticleForm')[0].reset(); const modal = bootstrap.Modal.getInstance(document.getElementById('createArticleModal'));
modal.hide();
form.reset();
$('#articleBody').summernote('code', ''); $('#articleBody').summernote('code', '');
loadArticles(); loadArticles();
showAlert('Article created successfully!', 'success'); showAlert('Article created successfully!', 'success');
}, } else {
error: function(xhr) { throw new Error(data.error || 'Unknown error');
showAlert('Error creating article: ' + xhr.responseJSON?.error || 'Unknown error', 'danger');
} }
})
.catch(error => {
console.error('Error creating article:', error);
showAlert('Error creating article: ' + error.message, 'danger');
}); });
} }
function editArticle(articleId) { function editArticle(articleId) {
$.get(`/api/admin/help-articles/${articleId}`, function(data) { fetch(`/api/admin/help-articles/${articleId}`)
$('#editArticleId').val(data.article.id); .then(response => response.json())
$('#editArticleTitle').val(data.article.title); .then(data => {
$('#editArticleCategory').val(data.article.category); document.getElementById('editArticleId').value = data.article.id;
$('#editArticleBody').summernote('code', data.article.body); document.getElementById('editArticleTitle').value = data.article.title;
$('#editOrderIndex').val(data.article.order_index); document.getElementById('editArticleCategory').value = data.article.category;
$('#editIsPublished').prop('checked', data.article.is_published); $('#editArticleBody').summernote('code', data.article.body);
$('#editArticleModal').modal('show'); document.getElementById('editOrderIndex').value = data.article.order_index;
}); document.getElementById('editIsPublished').checked = data.article.is_published;
const modal = new bootstrap.Modal(document.getElementById('editArticleModal'));
modal.show();
})
.catch(error => {
console.error('Error loading article:', error);
showAlert('Error loading article: ' + error.message, 'danger');
});
} }
function updateArticle() { function updateArticle() {
const formData = new FormData($('#editArticleForm')[0]); const form = document.getElementById('editArticleForm');
const formData = new FormData(form);
formData.set('body', $('#editArticleBody').summernote('code')); formData.set('body', $('#editArticleBody').summernote('code'));
formData.set('is_published', $('#editIsPublished').is(':checked')); formData.set('is_published', document.getElementById('editIsPublished').checked);
$.ajax({ fetch(`/api/admin/help-articles/${document.getElementById('editArticleId').value}`, {
url: `/api/admin/help-articles/${$('#editArticleId').val()}`,
method: 'PUT', method: 'PUT',
data: formData, body: formData
processData: false, })
contentType: false, .then(response => response.json())
success: function(response) { .then(data => {
$('#editArticleModal').modal('hide'); if (data.success) {
const modal = bootstrap.Modal.getInstance(document.getElementById('editArticleModal'));
modal.hide();
loadArticles(); loadArticles();
showAlert('Article updated successfully!', 'success'); showAlert('Article updated successfully!', 'success');
}, } else {
error: function(xhr) { throw new Error(data.error || 'Unknown error');
showAlert('Error updating article: ' + xhr.responseJSON?.error || 'Unknown error', 'danger');
} }
})
.catch(error => {
console.error('Error updating article:', error);
showAlert('Error updating article: ' + error.message, 'danger');
}); });
} }
function confirmDelete(articleId, title) { function confirmDelete(articleId, title) {
$('#deleteArticleId').val(articleId); document.getElementById('deleteArticleId').value = articleId;
$('#deleteArticleTitle').text(title); document.getElementById('deleteArticleTitle').textContent = title;
$('#deleteArticleModal').modal('show');
const modal = new bootstrap.Modal(document.getElementById('deleteArticleModal'));
modal.show();
} }
function deleteArticle() { function deleteArticle() {
const articleId = $('#deleteArticleId').val(); const articleId = document.getElementById('deleteArticleId').value;
$.ajax({ fetch(`/api/admin/help-articles/${articleId}`, {
url: `/api/admin/help-articles/${articleId}`, method: 'DELETE'
method: 'DELETE', })
success: function(response) { .then(response => response.json())
$('#deleteArticleModal').modal('hide'); .then(data => {
if (data.success) {
const modal = bootstrap.Modal.getInstance(document.getElementById('deleteArticleModal'));
modal.hide();
loadArticles(); loadArticles();
showAlert('Article deleted successfully!', 'success'); showAlert('Article deleted successfully!', 'success');
}, } else {
error: function(xhr) { throw new Error(data.error || 'Unknown error');
showAlert('Error deleting article: ' + xhr.responseJSON?.error || 'Unknown error', 'danger');
} }
})
.catch(error => {
console.error('Error deleting article:', error);
showAlert('Error deleting article: ' + error.message, 'danger');
}); });
} }
@@ -407,7 +482,8 @@ function showAlert(message, type) {
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div> </div>
`; `;
$('.container-fluid').prepend(alertHtml); const container = document.querySelector('.container-fluid');
container.insertAdjacentHTML('afterbegin', alertHtml);
} }
</script> </script>
{% endblock %} {% endblock %}