!65 增加表单编辑器

Merge pull request !65 from 李大饼/abp

Yi.Abp.Net8/module/rbac/Yi.Framework.Rbac.SqlSugarCore/DataSeeds/MenuRuoYiDataSeed.cs

@@ -228,6 +228,21 @@ namespace Yi.Framework.Rbac.SqlSugarCore.DataSeeds
             };
             entities.Add(swagger);
             
+            //表单构建
+            MenuAggregateRoot builder = new MenuAggregateRoot(_guidGenerator.Create(), tool.Id)
+            {
+                MenuName = "表单生成器",
+                MenuType = MenuTypeEnum.Menu,
+                Router = "build",
+                IsShow = true,
+                IsLink = false,
+                MenuIcon = "form",
+                Component = "tool/build/index",
+				IsCache = true,
+				OrderNum = 101,
+                IsDeleted = false,
+            };
+            entities.Add(builder);
 
             // //ERP
             // MenuAggregateRoot erp = new MenuAggregateRoot(_guidGenerator.Create())

Yi.RuoYi.Vue3/package.json

@@ -32,7 +32,8 @@
     "typeface-roboto": "^1.1.13",
     "vue": "3.4.21",
     "vue-cropper": "1.0.3",
-    "vue-router": "4.3.0"
+    "vue-router": "4.3.0",
+    "vform3-builds": "^3.0.10"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.0.4",

Yi.RuoYi.Vue3/src/main.js

@@ -11,6 +11,8 @@ import App from './App'
 import store from './store'
 import router from './router'
 import directive from './directive' // directive
+import VForm3 from 'vform3-builds'
+import 'vform3-builds/dist/designer.style.css'  //引入VForm3样式
 
 
 // 注册指令
@@ -77,5 +79,6 @@ app.use(ElementPlus, {
   // 支持 large、default、small
   size: Cookies.get('size') || 'default'
 })
+app.use(VForm3)
 app.mount('#app')
 

Yi.RuoYi.Vue3/src/views/tool/build/index.vue

@@ -1,3 +1,25 @@
 <template>
-   <div> 表单构建 <svg-icon icon-class="build" /> </div>
+  <div ref="box">
+    <v-form-designer ></v-form-designer>
+  </div>
 </template>
+
+<script setup lang="ts">
+import {ref,onMounted} from "vue";
+
+const box = ref<Element>()
+onMounted(() =>
+{
+  box.value?.firstChild?.classList.add("not-margin")
+  box.value?.firstChild?.children[0].remove()
+})
+</script>
+
+<style lang="scss" scoped>
+div {
+  margin: 0; /* 如果页面出现垂直滚动条，则加入此行CSS以消除之 */
+}
+.not-margin{
+  margin: 0 !important;
+}
+</style>