修复pagetype设置界面Cron Editor和Jeditor渲染后字段Label所在行消失的问题

This commit is contained in:
jingrow 2026-01-24 18:05:38 +08:00
parent dac822f30b
commit 3df029d352
2 changed files with 22 additions and 6 deletions

View File

@ -1,5 +1,7 @@
<script setup lang="ts">
import { ref, computed, watch, onMounted } from 'vue'
import { ref, computed, watch, onMounted, useSlots } from 'vue'
const slots = useSlots()
//
interface Props {
@ -228,8 +230,14 @@ onMounted(() => {
</script>
<template>
<div :class="['field-wrapper', `layout-${labelLayout}`]">
<label v-if="props.df" 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" class="field-label">
{{ props.ctx?.t(props.df?.label || props.df?.fieldname) }}
<span v-if="props.df?.reqd" class="required">*</span>
</label>

View File

@ -1,5 +1,5 @@
<script setup lang="ts">
import { onMounted, onBeforeUnmount, ref, watch, computed } from 'vue'
import { onMounted, onBeforeUnmount, ref, watch, computed, useSlots } from 'vue'
import { Editor, Extension, Node } from '@tiptap/core'
import Document from '@tiptap/extension-document'
import Paragraph from '@tiptap/extension-paragraph'
@ -37,6 +37,8 @@ import Superscript from '@tiptap/extension-superscript'
import { uploadFileToJingrow } from '@/shared/api/common'
import ImageResizable from '@/shared/extensions/image-resize'
const slots = useSlots()
interface Df {
fieldname: string
fieldtype: string
@ -720,8 +722,14 @@ watch(() => props.disabled, (disabled) => {
</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 class="field-label">
{{ ctx?.t ? ctx.t(df.label || df.fieldname) : (df.label || df.fieldname) }}
<span v-if="df.reqd" class="required">*</span>
</label>