flowable-engine-web/src/views/admin/layout/FormDesign.vue

@@ -87,38 +87,32 @@
     </el-aside>
     <w-dialog clickClose closeFree width="800px" :showFooter="false" :border="false" title="表单预览"
               v-model="viewFormVisible">
-      <el-radio-group v-model="formPreviewModel" @change="formPreviewModelChange">
-        <el-radio-button label="E">编辑</el-radio-button>
-        <el-radio-button label="R">查看</el-radio-button>
-      </el-radio-group>
       <!--todo 表单渲染-->
-      <form-render-view v-if="viewFormVisibleRender" ref="form" :form-items="forms" v-model="formData" :is-preview="true" :model="formPreviewModel"/>
+      <form-render ref="form" :forms="forms" v-model="formData"/>
     </w-dialog>
   </el-container>
 </template>
 <!--动态表单编辑器-->
 <script>
 import draggable from "vuedraggable";
-import FormRenderView from '@/views/common/form/FormRenderView'
+import FormRender from '@/views/common/form/FormRender'
 import FormDesignRender from '@/views/admin/layout/form/FormDesignRender'
 import FormComponentConfig from '@/views/common/form/FormComponentConfig'
 import {baseComponents} from '@/views/common/form/ComponentsConfigExport'
 
 export default {
   name: "FormDesign",
-  components: {draggable, FormComponentConfig, FormDesignRender, FormRenderView},
+  components: {draggable, FormComponentConfig, FormDesignRender, FormRender},
   data() {
     return {
       formData: {},
       libSelect: 0,
       viewFormVisible: false,
-      viewFormVisibleRender: true,
       isStart: false,
-      showMobile: false,
+      showMobile: true,
       baseComponents,
       select: null,
       drag: false,
-      formPreviewModel:"R",
     }
   },
   computed: {
@@ -138,16 +132,6 @@ export default {
     }
   },
   methods: {
-    formPreviewModelChange(){
-      // 卸载
-      this.viewFormVisibleRender= false
-      // 建议加上 nextTick 微任务
-      // 否则在同一事件内同时将tableShow设置false和true有可能导致组件渲染失败
-      this.$nextTick(function(){
-        // 加载
-        this.viewFormVisibleRender= true
-      })
-    },
     copy(node, index) {
       this.form.splice(index + 1, 0, Object.assign({}, node))
     },

flowable-engine-web/src/views/common/form/FormRender.vue

@@ -79,7 +79,7 @@ export default {
           this.loadFormConfig(item.props.items)
         }else {
           if (!item.perm){
-            this.$set(item, 'perm', 'E')
+            this.$set(item, 'perm', null)
           }
           this.$set(this._value, item.id, this.value[item.id])
           if(item.props.required){

flowable-engine-web/src/views/common/form/FormRenderView.vue

@@ -15,7 +15,7 @@
 import FormDesignRender from '@/views/admin/layout/form/FormDesignRender'
 
 export default {
-  name: "FormRenderView",
+  name: "FormViewRender",
   components: {FormDesignRender},
   props: {
     formItems: {
@@ -29,18 +29,6 @@ export default {
       default: () => {
         return {}
       }
-    },
-    model:{
-      type: String,
-      default:() => {
-        return "R"
-      }
-    },
-    isPreview:{
-      type: Boolean,
-      default:() => {
-        return false
-      }
     }
   },
   data() {
@@ -63,15 +51,13 @@ export default {
   },
   methods: {
     loadFormConfig(formItems) {
+      console.log(formItems)
       formItems.forEach(item => {
         if (item.name === 'SpanLayout') {
           this.loadFormConfig(item.props.items)
         } else {
           this.$set(this._value, item.id, this.value[item.id])
-          if (this.isPreview){
+          if (item.props.required) {
-            this.$set(item, 'perm', this.model)
-          }
-          if (item.props.required && this.model === "E") {
             this.$set(this.rules, item.id, [{
               type: item.valueType === 'Array' ? 'array' : undefined,
               required: true,
@@ -82,6 +68,8 @@ export default {
       })
     }
   }
+
+
 }
 </script>