因为这个项目license问题无法开源，更多技术支持与服务请加入我的知识星球。

1、通过online表单设计进行，生成代码

主要注意2点，1个是查询需要选择哪些字段，同时创建人员需要选择用户选择

这里，SysForm增加下面的一个注解，才能正常显示创建人员，这个生成的代码就会有，但我以前移植过来的后端是没有的，所以需要增加。

@Dict(dictTable ="sys_user",dicText = "realname",dicCode = "username")

private java.lang.String createBy;

2、生成后运行出现下面页面

3、更新保存的问题

正常生成的代码现在对应编辑做了如下调整

@RequestMapping(value = "/edit", method = {RequestMethod.PUT,RequestMethod.POST})

这样也支持post，否则

题，生成的代码会自动生成上面的信息

主要原因现在的保存与更新都是用post

/**
 * 保存或者更新
 * @param params
 * @param isUpdate
 */
export const saveOrUpdate = (params, isUpdate) => {
  let url = isUpdate ? Api.edit : Api.save;
  return defHttp.post({ url: url, params }, { isTransformResponse: false });
}

4、因为实际编辑我们这里采用了VForm3，所以需要引入这个组件，这个统一到下面的registerFlowableComp.ts文件里，flowable相关需要的都放到这个文件里来引入

//注册flowable相关组件 add by nbacheng
import ElementPlus from 'element-plus';
import locale from 'element-plus/es/locale/lang/zh-cn'; // 中文语言
import 'element-plus/theme-chalk/dark/css-vars.css';
import ElementIcons from '@/plugins/svgicon';

import VForm3 from '@/lib/vform/designer.umd.js';
import '@/lib/vform/designer.style.css';

// 高亮highlightjs
import 'highlight.js/lib/common';
import 'highlight.js/styles/atom-one-dark-reasonable.css';// 引入内置样式
import highlightPlugin from "@highlightjs/vue-plugin";
// add by nbacheng

export async function registerFlowableComp(app: App) {
  app.use(ElementIcons);
  app.use(VForm3);
  app.use(highlightPlugin);
  // 使用element-plus 并且设置全局的大小
  app.use(ElementPlus, {
    locale: locale
  });
}

5、同时增加一些element-plus的支持，以便兼容VForm3的样式等，否则会出现样式错误，界面混乱的现象

  import { ElForm } from 'element-plus';
  import 'element-plus/dist/index.css'
  import 'element-plus/theme-chalk/display.css'
  import '@/lib/vform/designer.style.css';
  import { useMessage } from '/@/hooks/web/useMessage';