flowable-engine-web/package.json

@@ -21,7 +21,6 @@
     "signature_pad": "^3.0.0-beta.4",
     "trim-canvas": "^0.1.2",
     "vue": "^2.6.11",
-    "vue-esign": "^1.1.4",
     "vue-router": "^3.4.3",
     "vuedraggable": "^2.24.1",
     "vuex": "^3.5.1"

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

@@ -91,7 +91,8 @@
         <el-radio-button label="E">编辑</el-radio-button>
         <el-radio-button label="R">查看</el-radio-button>
       </el-radio-group>
-      <form-render-view v-if="viewFormVisibleRender" ref="form" :form-items="forms" v-model="formValue" :is-preview="true" :model="formPreviewModel"/>
+      <!--todo 表单渲染-->
+      <form-render-view v-if="viewFormVisibleRender" ref="form" :form-items="forms" v-model="formData" :is-preview="true" :model="formPreviewModel"/>
     </w-dialog>
   </el-container>
 </template>
@@ -108,7 +109,7 @@ export default {
   components: {draggable, FormComponentConfig, FormDesignRender, FormRenderView},
   data() {
     return {
-      // formData: {},
+      formData: {},
       libSelect: 0,
       viewFormVisible: false,
       viewFormVisibleRender: true,
@@ -204,8 +205,8 @@ export default {
         this.formValue=this.$refs.form.value
       })
         for (const key in this.formValue) {
-          if(this.formValue[key]!==undefined){
+          if(this.formValue[key]!=undefined){
-            this.formValue[key]=undefined
+            this.formValue[key]=[]
           }
         }
     },

flowable-engine-web/src/views/admin/layout/process/ProcessTree.vue

@@ -30,6 +30,7 @@ export default {
       return this.$store.state.parentMap;
     },
     dom() {
+      console.log(this.$store.state.design)
       return this.$store.state.design.process;
     },
     viewer(){

flowable-engine-web/src/views/common/form/ComponentExport.js

@@ -14,17 +14,16 @@ let Location = () => import('./components/Location.vue')
 let MoneyInput = () => import('./components/MoneyInput.vue')
 let DeptPicker = () => import('./components/DeptPicker.vue')
 let UserPicker = () => import('./components/UserPicker.vue')
-let RatePicker = () => import('./components/RatePicker.vue')
+let SignPanel = () => import('./components/SignPannel.vue')
 
 let SpanLayout = () => import('./components/SpanLayout.vue')
 let TableList = () => import('./components/TableList.vue')
-let SignPanel = () => import('./components/SignPanel.vue')
 
 export default {
   //基础组件
   TextInput, NumberInput, AmountInput, TextareaInput, SelectInput, MultipleSelect,
-  DateTime, DateTimeRange, UserPicker, DeptPicker,RatePicker,
+  DateTime, DateTimeRange, UserPicker, DeptPicker,
   //高级组件
   Description, FileUpload, ImageUpload, MoneyInput, Location, SignPanel,
-  SpanLayout, TableList,
+  SpanLayout, TableList
 }

flowable-engine-web/src/views/common/form/ComponentsConfigExport.js

@@ -6,7 +6,6 @@ export const ValueType = {
   date: 'Date',
   user: 'User',
   dept: 'Dept',
-  star: 'star',
   dateRange: 'DateRange'
 }
 
@@ -180,22 +179,6 @@ export const baseComponents = [
           multiple: false
         }
       },
-      {
-        title: '评分',
-        name: 'RatePicker',
-        icon: 'el-icon-star-off',
-        value: '',
-        valueType: ValueType.star,
-        props: {
-          color: '#f0a732',
-          max: 5,
-          required: false,
-          enablePrint: true,
-          showScore: true,
-          enableHalf: true,
-          placeholder: undefined,
-        }
-      },
       {
         title: '说明文字',
         name: 'Description',
@@ -227,20 +210,7 @@ export const baseComponents = [
           maxSize: 0, //最大条数，为0则不限制
           columns:[] //列设置
         }
-      },
+      }
-      {
-        title: '签名',
-        name: 'SignPanel',
-        icon: 'el-icon-edit',
-        value: [],
-        valueType: ValueType.string,
-        props: {
-          required: false,
-          enablePrint: true,
-          isCrop: true,
-          lineColor: '#ff0000',
-        }
-      },
     ]
   }
 ]

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

@@ -1,9 +1,6 @@
 <template>
   <div>
     <el-form label-width="90px" v-if="form.name !== 'SpanLayout'">
-      <el-form-item label="表单ID">
-        <el-input size="small" clearable v-model="form.id" disabled/>
-      </el-form-item>
       <el-form-item label="表单名称">
         <el-input size="small" clearable v-model="form.title"/>
       </el-form-item>
@@ -17,6 +14,7 @@
     </el-form>
     <el-empty v-else description="当前组件不支持配置"></el-empty>
   </div>
+
 </template>
 
 <script>
@@ -35,8 +33,6 @@ import MoneyInput from './config/MoneyInputConfig.vue'
 import DeptPicker from './config/OrgPickerConfig.vue'
 import UserPicker from './config/OrgPickerConfig.vue'
 import TableList from './config/TableListConfig.vue'
-import SignPanel from './config/SignPanelConfig.vue'
-import RatePicker from './config/RatePickerConfig.vue'
 
 export default {
   name: "FormComponentConfig",
@@ -55,9 +51,7 @@ export default {
     MoneyInput,
     DeptPicker,
     UserPicker,
-    TableList,
+    TableList
-    SignPanel,
-    RatePicker
   },
   props:{},
   computed:{

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

@@ -36,7 +36,7 @@ export default {
       rules: {},
     }
   },
-  created() {
+  mounted() {
    this.loadFormConfig(this.formItems)
   },
   computed: {
@@ -51,7 +51,6 @@ export default {
   },
   methods: {
     validate(call) {
-      console.log("我被触发了")
       let success = true
       this.$refs.form.validate(valid => {
         success = valid

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

@@ -1,5 +1,5 @@
 <template>
-  <el-form class="process-form" label-position="top" :rules="rules" :model="_value">
+  <el-form ref="form" class="process-form" label-position="top" :model="_value">
     <div v-for="(item, index) in formItems" :key="item.name + index">
       <el-form-item v-if="item.name !== 'SpanLayout' && item.name !== 'Description'"
                     :prop="item.id" :label="item.title">
@@ -30,24 +30,19 @@ export default {
         return {}
       }
     },
-    model: {
+    model:{
       type: String,
-      default: () => {
+      default:() => {
         return "R"
       }
     },
-    isPreview: {
+    isPreview:{
       type: Boolean,
-      default: () => {
+      default:() => {
         return false
       }
     }
   },
-  data() {
-    return {
-      rules: {},
-    }
-  },
   computed: {
     _value: {
       get() {
@@ -58,7 +53,7 @@ export default {
       }
     }
   },
-  created() {
+  mounted() {
     this.loadFormConfig(this.formItems)
   },
   methods: {
@@ -68,18 +63,9 @@ export default {
           this.loadFormConfig(item.props.items)
         } else {
           this.$set(this._value, item.id, this.value[item.id])
-          if (this.isPreview) {
+          if (this.isPreview){
             this.$set(item, 'perm', this.model)
           }
-          if (item.perm === 'E') {
-            if (item.props.required) {
-              this.$set(this.rules, item.id, [{
-                type: item.valueType === 'Array' ? 'array' : undefined,
-                required: true,
-                message: `请填写${item.title}`, trigger: 'blur'
-              }])
-            }
-          }
         }
       })
     }
@@ -92,7 +78,6 @@ export default {
   margin: 15px 0;
   padding: 10px 10px 1px 10px;
   background: #fff;
-
   /deep/ .el-form-item__label {
     padding: 0 0;
   }
@@ -101,7 +86,6 @@ export default {
     padding-left: 5px;
     line-height: 30px;
   }
-
   /deep/ .el-form-item {
     margin-bottom: 10px;
   }

flowable-engine-web/src/views/common/form/components/RatePicker.vue

@@ -1,79 +0,0 @@
-<template>
-  <div>
-    <template v-if="mode === 'DESIGN'">
-      <el-rate
-          disabled
-          :show-score="showScore"
-          :allow-half="enableHalf"
-          :text-color="color"
-          text-color="#ff9900"
-          score-template="{value}">
-      </el-rate>
-      <p>{{ placeholder }}</p>
-    </template>
-    <template v-else>
-      <template v-if="perm === 'E'">
-        <el-rate
-            v-model="_value"
-            :show-score="showScore"
-            :allow-half="enableHalf"
-            :text-color="color"
-            score-template="{value}">
-        </el-rate>
-        <p>{{ placeholder }}</p>
-      </template>
-      <template v-else-if="perm === 'R'">
-        <el-rate
-            v-model="_value"
-            disabled
-            :show-score="showScore"
-            :allow-half="enableHalf"
-            :text-color="color"
-            score-template="{value}">
-        </el-rate>
-      </template>
-    </template>
-
-  </div>
-</template>
-
-<script>
-
-import componentMinxins from '../ComponentMinxins'
-
-export default {
-  mixins: [componentMinxins],
-  name: "RatePicker",
-  props: {
-    value: {
-      type: Number,
-      default: 0
-    },
-    perm: {
-      type: String,
-      default: 'E'
-    },
-    color: {
-      type: String,
-      default: '#f0a732'
-    },
-    placeholder: {
-      type: String,
-      default: '请打分!'
-    },
-    enableHalf: {
-      type: Boolean,
-      default: true
-    },
-    showScore: {
-      type: Boolean,
-      default: true
-    },
-  }
-}
-</script>
-
-<style scoped>
-
-
-</style>

flowable-engine-web/src/views/common/form/components/SignPanel.vue

@@ -1,114 +0,0 @@
-<template>
-  <div>
-    <template v-if="mode === 'DESIGN'">
-      <el-icon class="el-icon-location-information"/>
-      请签名
-    </template>
-    <template v-else>
-      <template v-if="perm === 'E'">
-        <div v-if="!_value">
-          <el-button icon="el-icon-edit" @click="doSign">请签字</el-button>
-        </div>
-        <div v-else>
-          <div>
-            <el-image fit="contain" class="sign-border-preview" style="width: 200px; height: 100px" @click="doSign"
-                      :src="_value"/>
-          </div>
-          <div>
-            点击签名重签
-          </div>
-        </div>
-      </template>
-      <template v-else-if="perm === 'R'">
-        <div v-if="_value">
-          <el-image fit="contain" style="width: 200px; height: 100px" :src="_value"/>
-        </div>
-        <div>
-          请签名
-        </div>
-      </template>
-    </template>
-    <el-dialog title="请使用鼠标签字" width="800px" :visible.sync="sign.open" @close="signClose" append-to-body>
-      <div class="sign-border">
-        <vue-esign v-if="sign.open" ref="sign" :width="800" :height="300" :isCrop="isCrop"
-                   :lineWidth="sign.lineWidth" :lineColor="sign.lineColor"
-                   :bgColor.sync="sign.bgColor"/>
-      </div>
-      <div slot="footer">
-        <el-button size="mini" @click="signClose">取消</el-button>
-        <el-button size="mini" type="primary" @click="handleGenerate">确认</el-button>
-      </div>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-import vueEsign from 'vue-esign'
-
-
-import componentMinxins from '../ComponentMinxins'
-
-export default {
-  mixins: [componentMinxins],
-  name: "SignPanel",
-  components: {vueEsign},
-  props: {
-    value: {
-      type: String,
-      default: null
-    },
-    perm: {
-      type: String,
-      default: 'E'
-    },
-    isCrop: {
-      type: Boolean,
-      default: false
-    },
-    lineColor: {
-      type: String,
-      default: '#000000'
-    }
-  },
-  data() {
-    return {
-      sign: {
-        open: false,
-        lineWidth: 6,
-        bgColor: '',
-      }
-    }
-  },
-  methods: {
-    signClose() {
-      this.sign.open = false
-      this.$refs.sign.reset()
-    },
-    doSign() {
-      this.sign.open = true
-    },
-    handleGenerate() {
-      this.$refs.sign.generate().then(res => {
-        this._value = res
-        this.sign.open = false
-      }).catch(err => {
-        alert(err) // 画布没有签字时会执行这里 'Not Signned'
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-.sign-border {
-  border: 1px dashed #2b2b2b;
-}
-
-.sign-border-preview {
-  border: 1px solid #ffffff;
-}
-
-.sign-border-preview:hover {
-  border: 1px dashed #1989fa;
-}
-</style>

flowable-engine-web/src/views/common/form/components/SignPannel.vue

@@ -0,0 +1,18 @@
+<template>
+
+</template>
+
+<script>
+export default {
+  name: "SignPannel",
+  components: {},
+  data() {
+    return {}
+  },
+  methods: {}
+}
+</script>
+
+<style scoped>
+
+</style>

flowable-engine-web/src/views/common/form/config/RatePickerConfig.vue

@@ -1,39 +0,0 @@
-<template>
-  <div>
-  <el-form-item label="提示文字">
-    <el-input size="small" v-model="value.placeholder" placeholder="请设置提示语"/>
-  </el-form-item>
-  <el-form-item label="最大分值">
-    <el-input-number size="small" :min="1" v-model="value.max" />
-  </el-form-item>
-    <el-form-item label="允许半分">
-      <el-switch v-model="value.enableHalf"></el-switch>
-    </el-form-item>
-    <el-form-item label="显示分值">
-      <el-switch v-model="value.showScore"></el-switch>
-    </el-form-item>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "RatePickerConfig",
-  components: {},
-  props:{
-    value:{
-      type: Object,
-      default: ()=>{
-        return {}
-      }
-    }
-  },
-  data() {
-    return {}
-  },
-  methods: {}
-}
-</script>
-
-<style scoped>
-
-</style>

flowable-engine-web/src/views/common/form/config/SignPanelConfig.vue

@@ -1,30 +0,0 @@
-<template>
-  <div>
-    <el-form-item label="是否裁剪">
-      <el-switch v-model="value.isCrop"></el-switch>
-    </el-form-item>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "SignPanelConfig",
-  components: {},
-  props:{
-    value:{
-      type: Object,
-      default: ()=>{
-        return {}
-      }
-    }
-  },
-  data() {
-    return {}
-  },
-  methods: {}
-}
-</script>
-
-<style scoped>
-
-</style>

flowable-engine-web/src/views/common/operation/OperationRender.vue

@@ -109,52 +109,44 @@ export default {
     for (let operation of this.operationList) {
       let state = operation.state
       let type = operation.operation
-      //创建节点
+
       if (state === 'create') {
         this.$set(operation, "icon", "el-icon-check")
         this.$set(operation, "color", "#0bbd87")
-        this.$set(operation, "remark", operation.userInfo.name)
+        this.$set(operation,"remark",operation.userInfo.name)
       }
-      //审批通过
       if (state === 'agree') {
         this.$set(operation, "icon", "el-icon-check")
         this.$set(operation, "color", "#0bbd87")
-        this.$set(operation, "remark", operation.userInfo.name + '  (已同意)')
+        this.$set(operation,"remark",operation.userInfo.name + '  (已同意)')
       }
-      //审批处理中
       if (state === 'process') {
         this.$set(operation, "icon", "el-icon-loading")
         this.$set(operation, "color", "#f78f5f")
-        this.$set(operation, "remark", operation.userInfo.name + '  (处理中)')
+        this.$set(operation,"remark",operation.userInfo.name + '  (处理中)')
       }
-      //抄送
       if (type === 'cc') {
         this.$set(operation, "icon", "el-icon-s-promotion")
         this.$set(operation, "color", "#3395f8")
-        this.$set(operation, "remark", operation.userInfo.name + '  (抄送成功)')
+        this.$set(operation,"remark",operation.userInfo.name + '  (抄送成功)')
       }
-      //评论
       if (state === 'comment') {
         this.$set(operation, "icon", "el-icon-chat-dot-round")
         this.$set(operation, "color", "#0bbd87")
-        this.$set(operation, "remark", operation.userInfo.name + '  (添加了评论)')
+        this.$set(operation,"remark",operation.userInfo.name + '  (添加了评论)')
       }
-      //拒绝后评论
       if (state === 'refuse' && type === 'comment') {
         this.$set(operation, "icon", "el-icon-chat-dot-round")
         this.$set(operation, "color", "#f56c6c")
-        this.$set(operation, "remark", operation.userInfo.name + '  (填写拒绝理由)')
+        this.$set(operation,"remark",operation.userInfo.name + '  (填写拒绝理由)')
       }
-      //拒绝操作
       if (state === 'refuse' && type === 'opinion') {
         this.$set(operation, "icon", "el-icon-close")
         this.$set(operation, "color", "#f56c6c")
-        this.$set(operation, "remark", operation.userInfo.name + '  (拒绝)')
       }
     }
   },
   methods: {
-    //获取到对应附件的地址
     getAttachmentList(attachments, image) {
       let result = [];
       for (let attachment of attachments) {

flowable-engine-web/src/views/workspace/InitiateProcess.vue

@@ -2,7 +2,7 @@
   <div v-loading="loading" class="initiate_process">
     <div v-if="!loading" style="min-width: 338px;">
       <!--渲染表单-->
-      <form-render class="process-form" ref="initiateForm" :form-items="processDefinition.formItems" v-model="formData"/>
+      <form-render class="process-form" ref="form" :form-items="processDefinition.formItems" v-model="formData"/>
     </div>
     <div style="display: flex;justify-content: center;flex-direction: column;min-width: 1036px;">
         <span style="font-size: 18px;text-align: center;padding-top: 20px;">审批流程</span>
@@ -64,6 +64,7 @@ export default {
   methods: {
     loadProcessDefinitionInfo(processDefinitionKey) {
       getInitiateInfo(processDefinitionKey).then(res => {
+        console.log(res);
         let processDefinition = res.data;
         this.processDefinition = processDefinition;
         //构建表单及校验规则
@@ -74,8 +75,7 @@ export default {
       });
     },
     validate(call) {
-      console.log("我被调用了")
+      this.$refs.form.validate(call);
-      this.$refs.initiateForm.validate(call);
     }
   }
 };

flowable-engine-web/src/views/workspace/WorkSpace.vue

@@ -130,6 +130,7 @@ export default {
             this.openItemDl = false
             this.$message.success(res.msg)
             this.$refs.disposalTask.getList()
+
           })
         } else {
           this.$message.warning("请完善表单😥")