修改文章编辑器为mdeditor

Echo_Z/settings.py

@@ -9,7 +9,7 @@ https://docs.djangoproject.com/en/4.2/topics/settings/
 For the full list of settings and their values, see
 https://docs.djangoproject.com/en/4.2/ref/settings/
 """
-
+import os
 from pathlib import Path
 
 # Build paths inside the project like this: BASE_DIR / 'subdir'.
@@ -42,6 +42,7 @@ INSTALLED_APPS = [
     'django.contrib.sessions',
     'django.contrib.messages',
     'django.contrib.staticfiles',
+    'mdeditor',
 ]
 
 MIDDLEWARE = [
@@ -137,3 +138,34 @@ SIMPLEUI_CONFIG = {
 }
 
 Echo_Z_version = "1.2.3"
+
+MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
+# 设置前缀
+MEDIA_URL = '/media/'
+
+MDEDITOR_CONFIGS = {
+    'default': {
+        'width': 690,  # Custom edit box width
+        'heigth': 500,  # Custom edit box height
+        'toolbar': ["undo", "redo", "|",
+                    "bold", "del", "italic", "quote", "ucwords", "uppercase", "lowercase", "|",
+                    "h1", "h2", "h3", "h5", "h6", "|",
+                    "list-ul", "list-ol", "hr", "|",
+                    "link", "reference-link", "image", "code", "preformatted-text", "code-block", "table", "datetime"
+                                                                                                           "emoji",
+                    "html-entities", "pagebreak", "goto-line", "|",
+                    "help", "info",
+                    "||", "preview", "watch", "fullscreen"],  # custom edit box toolbar
+        'upload_image_formats': ["jpg", "jpeg", "gif", "png", "bmp", "webp"],  # image upload format type
+        'image_floder': 'editor',  # image save the folder name
+        'theme': 'default',  # edit box theme, dark / default
+        'preview_theme': 'default',  # Preview area theme, dark / default
+        'editor_theme': 'default',  # edit area theme, pastel-on-dark / default
+        'toolbar_autofixed': True,  # Whether the toolbar capitals
+        'search_replace': True,  # Whether to open the search for replacement
+        'emoji': True,  # whether to open the expression function
+        'tex': True,  # whether to open the tex chart function
+        'flow_chart': True,  # whether to open the flow chart function
+        'sequence': True  # Whether to open the sequence diagram function
+    }
+}

Echo_Z/urls.py

@@ -1,11 +1,15 @@
 from django.contrib import admin
 from django.urls import path,include
-
+from django.urls import re_path
+from django.conf.urls.static import static
+from django.conf import settings
 admin.site.site_title = 'Echo-Z'
 admin.site.site_header = '后台管理'
-
 urlpatterns = [
     path('admin/', admin.site.urls),
     path('api/', include('api.urls')),
     path('', include('home.urls')),
+    re_path(r'mdeditor/', include('mdeditor.urls')),
 ]
+if settings.DEBUG:
+    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

home/admin.py

@@ -1,13 +1,14 @@
 from django.contrib import admin
-
 from home.models import *
 
 # Register your models here.
 @admin.register(Articles)
 class DepartmentAdmin(admin.ModelAdmin):
+
     # 要显示的字段
     list_display = ('title', 'abstract', 'created','stat')
     search_fields = ('title','abstract',)
+    exclude = ('content',)
     # 不可编辑字段
     readonly_fields = ('stat','read')
     # 分页显示，一页的数量

home/migrations/0008_articles_content_md_alter_articles_content.py

@@ -0,0 +1,24 @@
+# Generated by Django 4.2.23 on 2025-07-01 11:39
+
+from django.db import migrations, models
+import mdeditor.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('home', '0007_articletag_articles_tag_id'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='articles',
+            name='content_md',
+            field=mdeditor.fields.MDTextField(default='', verbose_name='md编辑器'),
+        ),
+        migrations.AlterField(
+            model_name='articles',
+            name='content',
+            field=models.TextField(blank=True, default='', null=True, verbose_name='呈现内容'),
+        ),
+    ]

home/migrations/0009_rename_content_md_articles_content_raw.py

@@ -0,0 +1,18 @@
+# Generated by Django 4.2.23 on 2025-07-01 11:47
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('home', '0008_articles_content_md_alter_articles_content'),
+    ]
+
+    operations = [
+        migrations.RenameField(
+            model_name='articles',
+            old_name='content_md',
+            new_name='content_raw',
+        ),
+    ]

home/migrations/0010_alter_articles_content.py

@@ -0,0 +1,18 @@
+# Generated by Django 4.2.23 on 2025-07-01 13:39
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('home', '0009_rename_content_md_articles_content_raw'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='articles',
+            name='content',
+            field=models.TextField(blank=True, default='', null=True),
+        ),
+    ]

home/migrations/0011_alter_articles_content_alter_articles_content_raw.py

@@ -0,0 +1,24 @@
+# Generated by Django 4.2.23 on 2025-07-01 13:40
+
+from django.db import migrations, models
+import mdeditor.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('home', '0010_alter_articles_content'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='articles',
+            name='content',
+            field=models.TextField(blank=True, default='', null=True, verbose_name='呈现内容'),
+        ),
+        migrations.AlterField(
+            model_name='articles',
+            name='content_raw',
+            field=mdeditor.fields.MDTextField(default='', verbose_name='文章内容'),
+        ),
+    ]

home/models.py

@@ -1,4 +1,6 @@
 from django.db import models
+import markdown
+from mdeditor.fields import MDTextField
 
 # Create your models here.
 
@@ -14,7 +16,8 @@ class ArticleTag(models.Model):
 
 class Articles(models.Model):
     title = models.CharField(max_length=100,verbose_name="文章标题")
-    content = models.TextField(verbose_name="文章内容")
+    content_raw = MDTextField(verbose_name='文章内容', default='', config_name='default')
+    content = models.TextField(verbose_name='呈现内容', null=True, blank=True, default='')
     abstract = models.TextField(verbose_name="文章摘要")
     author = models.TextField(default="admin", verbose_name="文章作者")
     created = models.DateTimeField(verbose_name="发布时间")
@@ -22,6 +25,14 @@ class Articles(models.Model):
     read = models.IntegerField(default=0,verbose_name="阅读数量")
     tag_id = models.ForeignKey(ArticleTag, on_delete=models.SET_NULL, null=True, blank=True, verbose_name="文章标签")
 
+    def save(self, *args, **kwargs):
+        # 将Markdown格式 转为html，页面上显示
+        self.content = markdown.markdown(self.content_raw, extensions=[
+            'markdown.extensions.extra',
+            'markdown.extensions.codehilite',
+            'markdown.extensions.toc',
+        ])
+        super(Articles, self).save(*args, **kwargs)
 
     class Meta:
         verbose_name = "文章"

requirements.txt

@@ -13,3 +13,4 @@ sqlparse==0.5.3
 tablib==3.8.0
 typing_extensions==4.14.0
 zipp==3.23.0
+mdeditor