better render array and dict in edit form

boofilsic/settings.py

@@ -49,9 +49,9 @@ INSTALLED_APPS = [
     "django.contrib.staticfiles",
     "django.contrib.humanize",
     "django.contrib.postgres",
-    "django_sass",
     "django_rq",
     "django_bleach",
+    "django_jsonform",
     "oauth2_provider",
     "tz_detect",
     "sass_processor",
@@ -60,7 +60,6 @@ INSTALLED_APPS = [
     "polymorphic",
     "easy_thumbnails",
     "user_messages",
-    "jsoneditor",
     "fontawesomefree",
 ]
 

catalog/common/jsondata.py

@@ -9,10 +9,12 @@ from django.core.exceptions import FieldError
 from django.db.models import fields
 from django.utils import dateparse, timezone
 
-from django.contrib.postgres.fields import ArrayField as DJANGO_ArrayField
+# from django.contrib.postgres.fields import ArrayField as DJANGO_ArrayField
+from django_jsonform.models.fields import ArrayField as DJANGO_ArrayField
 
 # from django.db.models import JSONField as DJANGO_JSONField
-from jsoneditor.fields.django3_jsonfield import JSONField as DJANGO_JSONField
+# from jsoneditor.fields.django3_jsonfield import JSONField as DJANGO_JSONField
+from django_jsonform.models.fields import JSONField as DJANGO_JSONField
 
 
 __all__ = (
@@ -232,9 +234,9 @@ class URLField(JSONFieldMixin, fields.URLField):
 
 
 class ArrayField(JSONFieldMixin, DJANGO_ArrayField):
-    def __init__(self, *args, **kwargs):
-        kwargs["help_text"] = _("多项之间以英文逗号分隔")
-        super().__init__(*args, **kwargs)
+    # def __init__(self, *args, **kwargs):
+    #     kwargs["help_text"] = _("多项之间以英文逗号分隔")
+    #     super().__init__(*args, **kwargs)
 
     def from_json(self, value):  # backward compatible with dirty legacy data
         if value:

catalog/forms.py

@@ -1,6 +1,5 @@
 from django import forms
 from django.utils.translation import gettext_lazy as _
-
 from catalog.models import *
 from common.forms import PreviewImageInput
 

catalog/movie/models.py

@@ -93,6 +93,10 @@ class Movie(Item):
         null=True,
         blank=True,
         default=list,
+        schema={
+            "type": "array",
+            "items": {"type": "dict", "additionalProperties": True, "keys": []},
+        },  # TODO fix it as simple dict...
     )
     site = jsondata.URLField(
         verbose_name=_("官方网站"), blank=True, default="", max_length=200

catalog/tv/models.py

@@ -145,6 +145,10 @@ class TVShow(Item):
         null=True,
         blank=True,
         default=list,
+        schema={
+            "type": "array",
+            "items": {"type": "dict", "additionalProperties": True, "keys": []},
+        },  # TODO fix it as simple dict...
     )
     site = jsondata.URLField(
         verbose_name=_("官方网站"), blank=True, default="", max_length=200
@@ -277,6 +281,10 @@ class TVSeason(Item):
         null=True,
         blank=True,
         default=list,
+        schema={
+            "type": "array",
+            "items": {"type": "dict", "additionalProperties": True, "keys": []},
+        },  # TODO fix it as simple dict...
     )
     site = jsondata.URLField(
         verbose_name=_("官方网站"), blank=True, default="", max_length=200

common/static/scss/_form.scss

@@ -0,0 +1,45 @@
+// override django_jsonform/react-json-form styles
+.rjf-form-wrapper {
+  input[type="text"] {
+    max-width: unset !important;
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+    font-size: unset !important;
+  }
+
+  .rjf-add-button {
+    background: var(--pico-background) !important;
+    color: var(--pico-secondary) !important;
+    border: solid 1px var(--pico-secondary) !important;
+    margin-left: 5px !important;
+  }
+
+  .rjf-form-row-controls {
+    button {
+      padding: unset !important;
+      font-size: unset !important;
+      margin-bottom: 0 !important;
+    }
+  }
+
+  .rjf-form-row-inner>div {
+    display: grid !important;
+    grid-template-columns: repeat(auto-fit, minmax(0%, 1fr));
+
+    >label {
+      margin-top: var(--pico-form-element-spacing-vertical);
+    }
+
+    >* {
+      width: max-content !important;
+
+
+      button {
+        padding: unset !important;
+        font-size: unset !important;
+        margin-bottom: 0 !important;
+      }
+
+    }
+  }
+}

common/static/scss/_legacy2.scss

@@ -1,12 +1,12 @@
-/*** django-jsoneditor ***/
-div.jsoneditor {
-  border-color: #ccc !important;
-}
+// /*** django-jsoneditor ***/
+// div.jsoneditor {
+//   border-color: #ccc !important;
+// }
 
-div.jsoneditor-menu {
-  background-color: #606c76 !important;
-  border-color: #606c76 !important;
-}
+// div.jsoneditor-menu {
+//   background-color: #606c76 !important;
+//   border-color: #606c76 !important;
+// }
 
 /***** MODAL DIALOG ****/
 #modal {

common/static/scss/neodb.scss

@@ -16,3 +16,4 @@
 @import '_sidebar.scss';
 @import '_common.scss';
 @import '_login.scss';
+@import '_form.scss';

requirements.txt

@@ -4,8 +4,7 @@ rq>=1.12.0
 django~=3.2.19
 django-auditlog
 django-markdownx @ git+https://github.com/alphatownsman/django-markdownx.git@e69480c64ad9c5d0499f4a8625da78cf2bb7691b
-django-jsoneditor @ git+https://github.com/alphatownsman/django-jsoneditor.git@fa2ae41aeeb34447bd8a808a520e843c853fd16e
-django-sass
+django-jsonform
 libsass
 django-compressor
 django-sass-processor