使用项目组件对 form-create-designer 进行增强

src/views/infra/build/index.vue

@@ -30,8 +30,7 @@
   </Dialog>
 </template>
 <script lang="ts" setup>
-defineOptions({ name: 'InfraBuild' })
-import FcDesigner from '@form-create/designer'
+import { useFormCreateDesigner } from '@/components/FormCreate'
 import { useClipboard } from '@vueuse/core'
 import { isString } from '@/utils/is'
 
@@ -41,6 +40,8 @@ import xml from 'highlight.js/lib/languages/java'
 import json from 'highlight.js/lib/languages/json'
 import formCreate from '@form-create/element-ui'
 
+defineOptions({ name: 'InfraBuild' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息
 
@@ -49,7 +50,7 @@ const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const formType = ref(-1) // 表单的类型：0 - 生成 JSON；1 - 生成 Options；2 - 生成组件
 const formData = ref('') // 表单数据
-
+useFormCreateDesigner(designer) // 表单设计器增强
 /** 打开弹窗 */
 const openModel = (title: string) => {
   dialogVisible.value = true
@@ -81,12 +82,12 @@ const makeTemplate = () => {
   const rule = designer.value.getRule()
   const opt = designer.value.getOption()
   return `<template>
-    <my-form-create
+    <form-create
       v-model:api="fApi"
       :rule="rule"
       :option="option"
       @submit="onSubmit"
-    ></my-form-create>
+    ></form-create>
   </template>
   <script setup lang=ts>
     const faps = ref(null)