This commit is contained in:
zhangjianjun 2026-07-10 14:46:39 +08:00
parent 3225e84cff
commit e8594ed8d4
1 changed files with 57 additions and 33 deletions

View File

@ -69,7 +69,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, computed, watch, defineComponent, h, type PropType, type VNode, type Component } from 'vue' import { ref, computed, watch, defineComponent, h, type PropType, type VNode, type Component } from 'vue'
import { Close, FullScreen, CopyDocument, Plus, Delete, UploadFilled } from '@element-plus/icons-vue' import { Close, FullScreen, CopyDocument, Plus, Delete, Document, UploadFilled } from '@element-plus/icons-vue'
import { import {
ElFormItem, ElInput, ElInputNumber, ElSwitch, ElButton, ElFormItem, ElInput, ElInputNumber, ElSwitch, ElButton,
ElCollapse, ElCollapseItem, ElIcon, ElMessage, ElCollapse, ElCollapseItem, ElIcon, ElMessage,
@ -385,18 +385,26 @@ const NodeEditor: Component = defineComponent({
let uploadNode = null; let uploadNode = null;
if ((isFile || isImage || isVideo)) { if ((isFile || isImage || isVideo)) {
uploadNode = h(UploadInput, { uploadNode = [
value: [{url: value}], h(UploadInput, {
type: isImage ? 'image' : isVideo ? 'video' : 'file', value: [{url: value}],
uploadFile: props.uploadFile, type: isImage ? 'image' : isVideo ? 'video' : 'file',
hideUploadButton: true, uploadFile: props.uploadFile,
transport: `#jfd-${key}`, hideUploadButton: true,
onUpdateValue: (v: any) => { transport: `#jfd-${key}`,
if(v.length > 0) { onUpdateValue: (v: any) => {
p.parent[key] = v[0].url || '' if(v.length > 0) {
} p.parent[key] = v[0].url || ''
}, }
}) },
}),
h(ElButton, {
size: 'small', type: 'primary', link: true,
title: '切换为输入框',
'aria-label': '切换为输入框',
onClick: () => p.parent[key] = '',
}, () => h(ElIcon, { size: 14 }, () => h(Document))),
]
} }
const inputNode = [ const inputNode = [
h(ElInput, { h(ElInput, {
@ -405,9 +413,10 @@ const NodeEditor: Component = defineComponent({
'onUpdate:modelValue': (v: string) => { p.parent[key] = v }, 'onUpdate:modelValue': (v: string) => { p.parent[key] = v },
style: { width: '90%', marginRight: '5px' }, style: { width: '90%', marginRight: '5px' },
}), }),
p.parent[key] === '' && h(ElButton, { h(ElButton, {
size: 'small', type: 'primary', size: 'small', type: 'primary', link: true,
title: '切换为图片上传框', title: '切换为上传组件',
'aria-label': '切换为上传组件',
onClick: () => p.parent[key] = '1.png', onClick: () => p.parent[key] = '1.png',
}, () => h(ElIcon, { size: 14 }, () => h(UploadFilled))), }, () => h(ElIcon, { size: 14 }, () => h(UploadFilled))),
] ]
@ -423,9 +432,7 @@ const NodeEditor: Component = defineComponent({
}, },
}) })
const formItemNode = [ const formItemNode = uploadNode || (hasHtmlClosingTag ? [wangEditor] : inputNode)
uploadNode || (hasHtmlClosingTag ? wangEditor : inputNode),
]
const zhVal = p.zhParent?.[key] const zhVal = p.zhParent?.[key]
@ -471,24 +478,41 @@ const NodeEditor: Component = defineComponent({
const isFile = value[i].includes('.pdf') || value[i].includes('.doc') || value[i].includes('.docx') || value[i].includes('.xls') || value[i].includes('.xlsx') || value[i].includes('.ppt') || value[i].includes('.pptx') const isFile = value[i].includes('.pdf') || value[i].includes('.doc') || value[i].includes('.docx') || value[i].includes('.xls') || value[i].includes('.xlsx') || value[i].includes('.ppt') || value[i].includes('.pptx')
let uploadNode = null; let uploadNode = null;
if ((isFile || isImage || isVideo)) { if ((isFile || isImage || isVideo)) {
uploadNode = h(UploadInput, { uploadNode = [
value: [{url: value[i], name: value[i]}], h(UploadInput, {
type: isImage ? 'image' : isVideo ? 'video' : 'file', value: [{url: value[i], name: value[i]}],
uploadFile: props.uploadFile, type: isImage ? 'image' : isVideo ? 'video' : 'file',
hideUploadButton: true, uploadFile: props.uploadFile,
transport: `#jfd-${key}`, hideUploadButton: true,
onUpdateValue: (v: any) => { transport: `#jfd-${key}`,
if(v.length > 0) { onUpdateValue: (v: any) => {
value[i] = v[0].url || '' if(v.length > 0) {
} value[i] = v[0].url || ''
}, }
}) },
}),
h(ElButton, {
size: 'small', type: 'primary', link: true,
title: '切换为输入框',
'aria-label': '切换为输入框',
onClick: () => value[i] = '',
}, () => h(ElIcon, { size: 14 }, () => h(Document))),
]
} }
return h('div', { class: 'jfd-string-item', key: i }, [ const valueNode = uploadNode || [
uploadNode || h(ElInput, { h(ElInput, {
modelValue: value[i], modelValue: value[i],
'onUpdate:modelValue': (v: string) => { value[i] = v }, 'onUpdate:modelValue': (v: string) => { value[i] = v },
}), }),
h(ElButton, {
size: 'small', type: 'primary', link: true,
title: '切换为上传组件',
'aria-label': '切换为上传组件',
onClick: () => value[i] = '1.png',
}, () => h(ElIcon, { size: 14 }, () => h(UploadFilled))),
]
return h('div', { class: 'jfd-string-item', key: i }, [
...valueNode,
showBtn ? h(ElButton, { showBtn ? h(ElButton, {
link: true, size: 'small', class: 'jfd-translate-icon', link: true, size: 'small', class: 'jfd-translate-icon',
loading: translatingPath.value === `${key}-${i}`, loading: translatingPath.value === `${key}-${i}`,