From fc7e166bc94d2eb97a382c70d50e8aaf5f81d61a Mon Sep 17 00:00:00 2001
From: jingrow <support@jingrow.com>
Date: Sat, 24 Jan 2026 18:37:29 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8Dpagetype=E8=AE=BE=E7=BD=AE?=
 =?UTF-8?q?=E7=95=8C=E9=9D=A2Text=20Editor=E6=B8=B2=E6=9F=93=E5=90=8E?=
 =?UTF-8?q?=E4=B8=8E=E5=89=8D=E7=AB=AF=E7=95=8C=E9=9D=A2=E4=B8=8D=E4=B8=80?=
 =?UTF-8?q?=E8=87=B4=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/core/features/form_builder/globals.js |  2 +-
 .../pagetype/form/controls/TextEditor.vue     | 62 ++++++++++++++-----
 2 files changed, 49 insertions(+), 15 deletions(-)

diff --git a/apps/jingrow/frontend/src/core/features/form_builder/globals.js b/apps/jingrow/frontend/src/core/features/form_builder/globals.js
index 483c47f..e50be69 100644
--- a/apps/jingrow/frontend/src/core/features/form_builder/globals.js
+++ b/apps/jingrow/frontend/src/core/features/form_builder/globals.js
@@ -13,7 +13,7 @@ import SelectControl from "./components/controls/SelectControl.vue";
 import SignatureControl from "./components/controls/SignatureControl.vue";
 import TableControl from "./components/controls/TableControl.vue";
 import TextControl from "./components/controls/TextControl.vue";
-import TextEditorControl from "./components/controls/TextEditorControl.vue";
+import TextEditorControl from "@/core/pagetype/form/controls/TextEditor.vue";
 
 export function registerGlobalComponents(app) {
   // Helper function to safely register component
diff --git a/apps/jingrow/frontend/src/core/pagetype/form/controls/TextEditor.vue b/apps/jingrow/frontend/src/core/pagetype/form/controls/TextEditor.vue
index f67640b..ce591e5 100644
--- a/apps/jingrow/frontend/src/core/pagetype/form/controls/TextEditor.vue
+++ b/apps/jingrow/frontend/src/core/pagetype/form/controls/TextEditor.vue
@@ -1,11 +1,22 @@
 <script setup lang="ts">
-import { ref, onMounted, onBeforeUnmount, watch, computed } from 'vue'
+import { ref, onMounted, onBeforeUnmount, watch, computed, useSlots } from 'vue'
 import Quill from 'quill'
 import ImageResize from 'quill-image-resize'
 import MagicUrl from 'quill-magic-url'
 import 'quill/dist/quill.snow.css'
 
-const props = defineProps<{ df: any; record: Record<string, any>; canEdit: boolean; ctx: any }>()
+const slots = useSlots()
+
+const props = defineProps<{ 
+  df: any; 
+  record?: Record<string, any>; 
+  canEdit?: boolean; 
+  ctx?: any; 
+  read_only?: boolean; 
+  modelValue?: any 
+}>()
+
+const emit = defineEmits(['update:modelValue'])
 
 const host = ref<HTMLDivElement | null>(null)
 let quill: Quill | null = null
@@ -130,22 +141,39 @@ function init() {
       }
     ]
   ]
+  
+  const readOnly = props.read_only || props.df?.read_only || !props.canEdit
+  
   quill = new Quill(host.value, {
     theme: 'snow',
-    readOnly: !props.canEdit,
+    readOnly,
     placeholder: props.df?.placeholder || '',
     modules: { toolbar, imageResize: {}, magicUrl: true, table: true }
   })
 
-  setHtml(String((props.record as any)?.[props.df.fieldname] ?? ''))
-
-  quill.on('text-change', (_d: any, _o: any, source: string) => {
-    if (source === 'api') return
-    if (syncTimer) clearTimeout(syncTimer)
-    syncTimer = setTimeout(() => {
-      ;(props.record as any)[props.df.fieldname] = getHtml()
-    }, 200)
-  })
+  // FormBuilder 模式：使用 modelValue
+  if (slots.label) {
+    setHtml(String(props.modelValue ?? ''))
+    quill.on('text-change', (_d: any, _o: any, source: string) => {
+      if (source === 'api') return
+      if (syncTimer) clearTimeout(syncTimer)
+      syncTimer = setTimeout(() => {
+        emit('update:modelValue', getHtml())
+      }, 200)
+    })
+  } else {
+    // default_single.vue 模式：使用 record
+    setHtml(String((props.record as any)?.[props.df.fieldname] ?? ''))
+    quill.on('text-change', (_d: any, _o: any, source: string) => {
+      if (source === 'api') return
+      if (syncTimer) clearTimeout(syncTimer)
+      syncTimer = setTimeout(() => {
+        if (props.record) {
+          (props.record as any)[props.df.fieldname] = getHtml()
+        }
+      }, 200)
+    })
+  }
 
   try {
     const toolbarModule: any = (quill as any).getModule('toolbar')
@@ -201,8 +229,14 @@ watch(() => props.canEdit, (v) => { (quill as any)?.enable(!!v) })
 </script>
 
 <template>
-  <div :class="['field-wrapper', `layout-${labelLayout}`]">
-    <label class="field-label">
+  <div :class="['field-wrapper', `layout-${labelLayout}`, { 'form-builder-control': slots.label }]">
+    <!-- FormBuilder 模式: 使用 slot 渲染 label -->
+    <div v-if="slots.label" class="field-controls">
+      <slot name="label" />
+      <slot name="actions" />
+    </div>
+    <!-- default_single.vue 模式: 自己渲染 label -->
+    <label v-else-if="props.df && props.ctx" class="field-label">
       {{ ctx.t(df.label || df.fieldname) }}
       <span v-if="df.reqd" class="required">*</span>
     </label>