ibizdev提交

app_Default/src/App.vue

@@ -3,32 +3,62 @@
     <div id="app">
       <a-layout id="components-layout-demo-custom-trigger">
         <a-layout-sider :trigger="null" collapsible>
-          <div class="logo"><img src="https://cdn.ibizlab.cn/super-form/logo.png"/></div>
+          <div class="logo"><img src="/assets/images/logo.png"/></div>
           <a-menu theme="dark" mode="inline" :defaultSelectedKeys="['0']"  @click="handleClick">
                        <a-menu-item key="0">
               <a-icon type="user" />
-              <span>基础编辑器</span>
+              <span>实体编辑视图</span>
             </a-menu-item>
              <a-menu-item key="1">
               <a-icon type="video-camera" />
-              <span>基础表单项</span>
+              <span>基础编辑器</span>
             </a-menu-item>
              <a-menu-item key="2">
               <a-icon type="upload" />
-              <span>表单项动态逻辑示例</span>
+              <span>基础表单项</span>
             </a-menu-item>
              <a-menu-item key="3">
               <a-icon type="user" />
+              <span>实体3编辑视图</span>
+            </a-menu-item>
+             <a-menu-item key="4">
+              <a-icon type="video-camera" />
+              <span>实体4编辑视图</span>
+            </a-menu-item>
+             <a-menu-item key="5">
+              <a-icon type="upload" />
+              <span>实体5编辑视图</span>
+            </a-menu-item>
+             <a-menu-item key="6">
+              <a-icon type="user" />
+              <span>表单项动态逻辑示例</span>
+            </a-menu-item>
+             <a-menu-item key="7">
+              <a-icon type="video-camera" />
+              <span>实体2编辑视图</span>
+            </a-menu-item>
+             <a-menu-item key="8">
+              <a-icon type="upload" />
               <span>DemoForm</span>
             </a-menu-item>
+             <a-menu-item key="9">
+              <a-icon type="user" />
+              <span>表单3</span>
+            </a-menu-item>
           </a-menu>
         </a-layout-sider>
         <a-layout>
           <a-layout-content :style="{ margin: '24px 16px', padding: '24px', background: '#fff', minHeight: '280px' }">
-              <ExampleEditorType v-show="curSelected == '0'"/>
-              <ExampleEditView v-show="curSelected == '1'"/>
-              <ExampleDLFEditView v-show="curSelected == '2'"/>
-              <ExampleMain2EditView v-show="curSelected == '3'"/>
+              <EntityEditView v-show="curSelected == '0'"/>
+              <ExampleEditorType v-show="curSelected == '1'"/>
+              <ExampleEditView v-show="curSelected == '2'"/>
+              <Entity3EditView v-show="curSelected == '3'"/>
+              <Entity4EditView v-show="curSelected == '4'"/>
+              <Entity5EditView v-show="curSelected == '5'"/>
+              <ExampleDLFEditView v-show="curSelected == '6'"/>
+              <Entity2EditView v-show="curSelected == '7'"/>
+              <ExampleMain2EditView v-show="curSelected == '8'"/>
+              <ExampleMain3EditView v-show="curSelected == '9'"/>
           </a-layout-content>
         </a-layout>
       </a-layout>
@@ -41,18 +71,30 @@ import zhCN from "ant-design-vue/lib/locale-provider/zh_CN";
 import enUS from "ant-design-vue/lib/locale-provider/en_US";
 import AppService from "@service/AppService";
 
+import EntityEditView from '@pages/module/entity-edit-view/entity-edit-view.vue';
 import ExampleEditorType from '@pages/exapmple/example-editor-type/example-editor-type.vue';
 import ExampleEditView from '@pages/exapmple/example-edit-view/example-edit-view.vue';
+import Entity3EditView from '@pages/module3/entity3-edit-view/entity3-edit-view.vue';
+import Entity4EditView from '@pages/module4/entity4-edit-view/entity4-edit-view.vue';
+import Entity5EditView from '@pages/module5/entity5-edit-view/entity5-edit-view.vue';
 import ExampleDLFEditView from '@pages/exapmple/example-dlfedit-view/example-dlfedit-view.vue';
+import Entity2EditView from '@pages/module2/entity2-edit-view/entity2-edit-view.vue';
 import ExampleMain2EditView from '@pages/exapmple/example-main2-edit-view/example-main2-edit-view.vue';
+import ExampleMain3EditView from '@pages/exapmple/example-main3-edit-view/example-main3-edit-view.vue';
 
 export default {
   name: "app",
   components: {
+    EntityEditView,
     ExampleEditorType,
     ExampleEditView,
+    Entity3EditView,
+    Entity4EditView,
+    Entity5EditView,
     ExampleDLFEditView,
-    ExampleMain2EditView
+    Entity2EditView,
+    ExampleMain2EditView,
+    ExampleMain3EditView
   },
   data() {
     return {

app_Default/src/components/app-rich-text-editor/app-rich-text-editor.vue

@@ -91,10 +91,10 @@ export default {
           { text: "C#", value: "csharp" },
           { text: "C++", value: "cpp" }
         ],
-        codesample_content_css: "https://cdn.ibizlab.cn/super-form/tinymce/prism.css",
-        skin_url: "https://cdn.ibizlab.cn/super-form/tinymce/skins/lightgray",
+        codesample_content_css: "/assets/tinymce/prism.css",
+        skin_url: "/assets/tinymce/skins/lightgray",
         language_url:
-          "https://cdn.ibizlab.cn/super-form/tinymce/langs/" +
+          "/assets/tinymce/langs/" +
           (this.langu ? this.langu : "zh_CN") +
           ".js",
         setup: editor => {

app_Default/src/forms/example/main3/main3.vue

+<template>
+<div class="app-form">
+  <a-form class=""  style="">
+        <a-row>
+        <a-tabs  @change="formPageSelected">
+        </a-tabs>
+        </a-row>
+    </a-form>
+</div>
+</template>
+
+<script>
+import  { FormButtonModel,FormDetailModel,FormItemModel,FormDRUIPartModel,FormGroupPanelModel,FormIFrameModel,FormPageModel,FormPartModel,FormRowItemModel,FormTabPageModel,FormTabPanelModel,FormUserControlModel}  from "@models/index.js";
+import Schema from "async-validator";
+import ComUtil from '@utils/ComUtil';
+import AppService from "@service/AppService";
+export default {
+  
+  name: "Main3form",
+
+  props:{
+      formData:Object
+  },
+
+  watch: {
+    'formData': {
+      handler: 'onFormDataChanged',
+      immediate: true,
+      deep: true
+    }
+  },
+
+  data() {
+    return {
+
+      /**
+      * 当前语言
+      *
+      */
+      local:"",
+    
+      /**
+      * 激活分组
+      *
+      */
+      activeGroup:[],
+      
+      /**
+      * 激活分组
+      *
+      */
+      data:{
+        srfupdatedate: null,
+        srforikey: null,
+        srfkey: null,
+        srfmajortext: null,
+        srftempmode: null,
+        srfuf: null,
+        srfdeid: null,
+        srfsourcekey: null,
+        exampleid: null,
+      },
+
+      /**
+      * 表单模型
+      *
+      */
+      detailsModel:{
+        form: new FormTabPanelModel({ caption: 'form', detailType: 'TABPANEL', name: 'form', visible: true, isShowCaption: true, form: this, tabPages: [] }),
+      },
+
+      /**
+      * 代码表模型
+      *
+      */      
+      codelistModel:{
+      },
+
+      /**
+      *   表单值规则
+      *
+      */
+      formRules:{
+        
+      },
+
+      /**
+      * 默认值规则
+      *
+      */
+      rules:{
+      }
+    };
+  },
+
+  created(){
+        this.initForm();
+        this.initlangu();
+  },
+
+  methods: {
+
+    /**
+     * 初始化表单
+     *
+     */
+    initForm(){
+        if(Object.keys(this.data).length >0){
+             Object.keys(this.data).forEach((item) =>{
+                     this.formItemChange(item,this.data[item],true);
+             })   
+        }
+    },
+
+    /**
+     * 初始化语言
+     * 
+     */
+    initlangu(){
+        if (Object.is(window.localStorage.getItem("curLang"), "zh")) {
+                this.local ="zh_CN";
+        } else {
+                this.local ="en_GB";
+        }
+        AppService.getInstance().subject.subscribe(res => {
+            if (Object.is(res, "zh")) {
+                this.local ="zh_CN";
+            } else {
+                this.local ="en_GB";
+            }
+        });
+    },
+
+    /**
+     * 分页选中
+     *
+     */
+    formPageSelected(key){
+      console.log("表单选中了"+key);
+    },
+
+    /**
+     *  按钮点击事件
+     *
+     */
+    button_click($event,caption){
+      this.$message.success("点击了"+caption);
+    },
+
+    /**
+     * 表单项值变化
+     *
+     */
+    formItemChange(name,value,isFirst){
+      this.formLogic(name,value);
+      if(!isFirst){
+        this.validateItem(name, value);
+        this.$emit('formItemChange',{name:name,value:value});
+      }
+    },
+
+    /**
+     * 校验单个表单项
+     * @param item 
+     * @param value 
+     */
+    validateItem(item, value) {
+        // 做校验
+        // 1.获取数值和规则
+        const rule = this.rules[item];
+        // 2.创建校验规则
+        const schema = new Schema({ [item]: rule })
+        // 校验返回Promise
+        return schema.validate({ [item]: value },undefined,errors => {
+            if (errors) {
+                // 有错
+                this.detailsModel[item].setError(errors[0].message);
+            } else {
+                this.detailsModel[item].setError('');
+            }
+        })
+    },
+
+    /**
+     * 校验表单
+     * 
+     * @memberof Main
+     */
+     validateForm(callback) {
+        let tasks;
+        if (Object.keys(this.data).length > 0) {
+            tasks = Object.keys(this.data).map((item) => {
+                this.validateItem(item, this.data[item]);
+            })
+        }
+        Promise.all(tasks)
+            .then(() => callback(true))
+            .catch(() => callback(false))
+    },
+
+    /**
+     * 表单逻辑
+     *
+     */
+    formLogic( name, newVal, oldVal) {
+              
+    },
+
+    onFormDataChanged(val,oldVal){
+        if(val && val !== oldVal){
+                Object.keys(this.data).forEach(item =>{
+                        this.data[item] = null;
+                })
+                Object.assign(this.data,val);
+        }
+    }
+  }
+}
+</script>
+<style scoped>
+
+</style>

app_Default/src/pages/exapmple/example-main3-edit-view/example-main3-edit-view.vue

+<template>
+<div>
+    <Main3form :formData="formData"  @formItemChange="formItemChange"></Main3form></div>
+
+
+</template>
+
+<script>
+import Main3form from '@forms/example/main3/main3.vue';
+
+
+export default {
+  name: "ExampleMain3EditView",
+  components: {
+  Main3form
+  },
+  data(){
+    return {
+      formData:{
+        "bookname":"test1",
+        "input":"文本test",
+        "label":"标签test",
+        "group1":"书籍基本信息test",
+        "formpage1":"基本信息test",
+        "createman":"建立人test",
+        "createdate":"建立时间test",
+        "updateman":"更新人test",
+        "updatedate":"更新时间test",
+        "group2":"操作信息test",
+        "formpage2":"其它test"
+      }
+    }
+  },
+  methods:{
+    formItemChange(value){
+      console.log(value);
+    }
+  }
+}
+</script>
+<style scoped>
+
+
+</style>

app_Default/src/pages/module/entity-edit-view/entity-edit-view.vue

+<template>
+<div>
+    <Mainform :formData="formData"  @formItemChange="formItemChange"></Mainform></div>
+
+
+</template>
+
+<script>
+import Mainform from '@forms/entity/main/main.vue';
+
+
+export default {
+  name: "EntityEditView",
+  components: {
+  Mainform
+  },
+  data(){
+    return {
+      formData:{
+        "bookname":"test1",
+        "input":"文本test",
+        "label":"标签test",
+        "group1":"书籍基本信息test",
+        "formpage1":"基本信息test",
+        "createman":"建立人test",
+        "createdate":"建立时间test",
+        "updateman":"更新人test",
+        "updatedate":"更新时间test",
+        "group2":"操作信息test",
+        "formpage2":"其它test"
+      }
+    }
+  },
+  methods:{
+    formItemChange(value){
+      console.log(value);
+    }
+  }
+}
+</script>
+<style scoped>
+
+
+</style>

app_Default/src/pages/module2/entity2-edit-view/entity2-edit-view.vue

+<template>
+<div>
+    <Mainform :formData="formData"  @formItemChange="formItemChange"></Mainform></div>
+
+
+</template>
+
+<script>
+import Mainform from '@forms/entity2/main/main.vue';
+
+
+export default {
+  name: "Entity2EditView",
+  components: {
+  Mainform
+  },
+  data(){
+    return {
+      formData:{
+        "bookname":"test1",
+        "input":"文本test",
+        "label":"标签test",
+        "group1":"书籍基本信息test",
+        "formpage1":"基本信息test",
+        "createman":"建立人test",
+        "createdate":"建立时间test",
+        "updateman":"更新人test",
+        "updatedate":"更新时间test",
+        "group2":"操作信息test",
+        "formpage2":"其它test"
+      }
+    }
+  },
+  methods:{
+    formItemChange(value){
+      console.log(value);
+    }
+  }
+}
+</script>
+<style scoped>
+
+
+</style>

app_Default/src/pages/module3/entity3-edit-view/entity3-edit-view.vue

+<template>
+<div>
+    <Mainform :formData="formData"  @formItemChange="formItemChange"></Mainform></div>
+
+
+</template>
+
+<script>
+import Mainform from '@forms/entity3/main/main.vue';
+
+
+export default {
+  name: "Entity3EditView",
+  components: {
+  Mainform
+  },
+  data(){
+    return {
+      formData:{
+        "bookname":"test1",
+        "input":"文本test",
+        "label":"标签test",
+        "group1":"书籍基本信息test",
+        "formpage1":"基本信息test",
+        "createman":"建立人test",
+        "createdate":"建立时间test",
+        "updateman":"更新人test",
+        "updatedate":"更新时间test",
+        "group2":"操作信息test",
+        "formpage2":"其它test"
+      }
+    }
+  },
+  methods:{
+    formItemChange(value){
+      console.log(value);
+    }
+  }
+}
+</script>
+<style scoped>
+
+
+</style>

app_Default/src/pages/module4/entity4-edit-view/entity4-edit-view.vue

+<template>
+<div>
+    <Mainform :formData="formData"  @formItemChange="formItemChange"></Mainform></div>
+
+
+</template>
+
+<script>
+import Mainform from '@forms/entity4/main/main.vue';
+
+
+export default {
+  name: "Entity4EditView",
+  components: {
+  Mainform
+  },
+  data(){
+    return {
+      formData:{
+        "bookname":"test1",
+        "input":"文本test",
+        "label":"标签test",
+        "group1":"书籍基本信息test",
+        "formpage1":"基本信息test",
+        "createman":"建立人test",
+        "createdate":"建立时间test",
+        "updateman":"更新人test",
+        "updatedate":"更新时间test",
+        "group2":"操作信息test",
+        "formpage2":"其它test"
+      }
+    }
+  },
+  methods:{
+    formItemChange(value){
+      console.log(value);
+    }
+  }
+}
+</script>
+<style scoped>
+
+
+</style>

app_Default/src/pages/module5/entity5-edit-view/entity5-edit-view.vue

+<template>
+<div>
+    <Mainform :formData="formData"  @formItemChange="formItemChange"></Mainform></div>
+
+
+</template>
+
+<script>
+import Mainform from '@forms/entity5/main/main.vue';
+
+
+export default {
+  name: "Entity5EditView",
+  components: {
+  Mainform
+  },
+  data(){
+    return {
+      formData:{
+        "bookname":"test1",
+        "input":"文本test",
+        "label":"标签test",
+        "group1":"书籍基本信息test",
+        "formpage1":"基本信息test",
+        "createman":"建立人test",
+        "createdate":"建立时间test",
+        "updateman":"更新人test",
+        "updatedate":"更新时间test",
+        "group2":"操作信息test",
+        "formpage2":"其它test"
+      }
+    }
+  },
+  methods:{
+    formItemChange(value){
+      console.log(value);
+    }
+  }
+}
+</script>
+<style scoped>
+
+
+</style>