workflow-editor 0.0.81-up-tmp8 → 0.0.81-up-tmp10

package/packages/workflow-editor/src/properties-editors/human-task/editable-fields.vue

@@ -0,0 +1,206 @@
+<template>
+  <div style="width: 100%">
+    <el-row style="padding-bottom: 10px">
+      <el-button type="primary" size="small" plain icon="CirclePlus" @click="add">
+        {{ $t('workflowEditorPublicModel.add') }}
+      </el-button>
+      <el-button type="primary" size="small" plain icon="Delete" @click="remove">
+        {{ $t('workflowEditorPublicModel.delete') }}
+      </el-button>
+    </el-row>
+    <el-table
+      ref="table"
+      :data="selectedFields"
+      border
+      highlight-current-row
+      @selection-change="handleSelectionChange"
+      @current-change="handleCurrentChange"
+    >
+      <el-table-column type="selection" width="55" />
+      <el-table-column type="index" width="50" />
+      <el-table-column :label="$t('workflowEditor.common.name')" width="180">
+        <template v-slot="scope">
+          <span :style="{ color: scope.row.name && scope.row.name.indexOf('$') === 0 ? '#409EFF' : '' }">{{
+            getFieldLabel(scope.row)
+          }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="name" :label="$t('workflowEditor.task.propertyName')" width="180" />
+      <el-table-column prop="constraintRule" :label="$t('workflowEditor.task.editingMethod')">
+        <template v-slot="scope">
+          <el-radio-group v-model="scope.row.constraintRule">
+            <el-radio label="REQUIRED">
+              {{ $t('workflowEditorMessage.mustFill') }}
+            </el-radio>
+            <el-radio label="READ_ONLY">
+              {{ $t('workflowEditorMessage.readOnly') }}
+            </el-radio>
+          </el-radio-group>
+        </template>
+      </el-table-column>
+      <el-table-column prop="condition" :label="$t('workflowEditor.task.condition')">
+        <template v-slot="scope">
+          <el-input
+            :value="formatCondition(scope.row.condition)"
+            type="textarea"
+            autosize
+            @click="selectCondition(scope.row)"
+          />
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 之前是@input事件，会导致字段复选框无法选中 -->
+    <editable-field-selection
+      v-if="showFieldSelection"
+      :disabled-fields="disabledFields"
+      @input-value="setSelectedFields"
+      @close="showFieldSelection = false"
+    />
+    <additional-condition-dialog
+      v-if="showAdditionalCondition"
+      v-model="currentRow.condition"
+      @close="showAdditionalCondition = false"
+    />
+  </div>
+</template>
+
+<script>
+import EditableFieldSelection from './editable-field-selection'
+import AdditionalConditionDialog from './additional-condition-dialog'
+import { mapGetters } from 'vuex'
+import { parseCondition, displayCondition } from '../common/additional-condition-utils'
+export default {
+  name: 'EditableFields',
+  components: {
+    EditableFieldSelection,
+    AdditionalConditionDialog
+  },
+  props: {
+    modelValue: {
+      type: [Array, Object],
+      default: null
+    }
+  },
+  data() {
+    let selectedFields = []
+    if (this.modelValue !== '' && this.modelValue !== null && this.modelValue !== undefined) {
+      if (Array.isArray(this.modelValue)) {
+        selectedFields = this.modelValue
+      } else {
+        // 只有一个字段时其实是field对象
+        selectedFields.push(this.modelValue)
+      }
+    }
+    // 列表中出现的字段不能重复添加
+    const disabledFields = this.getDisabledFields(this.modelValue)
+    return {
+      showFieldSelection: false,
+      showAdditionalCondition: false,
+      selectedFields,
+      currentRow: null,
+      multipleSelection: [],
+      disabledFields
+    }
+  },
+  computed: {
+    ...mapGetters('wfEditor', ['formFieldsWithSub'])
+  },
+  watch: {
+    selectedFields: {
+      handler(newValue, oldValue) {
+        this.disabledFields = this.getDisabledFields(newValue)
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    if (this.selectedFields.length > 0) {
+      this.selectRow(this.selectedFields[this.selectedFields.length - 1])
+    }
+  },
+  methods: {
+    getDisabledFields(feilds) {
+      if (feilds === null || feilds === undefined) return []
+      const result = []
+      // value可能是数组或者对象（一个字段时），要分别处理
+      if (Array.isArray(feilds)) {
+        feilds.map((item) => {
+          result.push(item.name)
+        })
+      } else {
+        result.push(feilds)
+      }
+
+      return result
+    },
+    handleCurrentChange(val) {
+      this.currentRow = val
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val
+    },
+    selectRow(row) {
+      this.$refs.table.setCurrentRow(row)
+    },
+    add() {
+      this.showFieldSelection = true
+    },
+    getCurrentRowIndex() {
+      let index = -1
+      for (let i = 0; i < this.selectedFields.length; i++) {
+        if (this.selectedFields[i].name === this.currentRow.name) {
+          index = i
+          break
+        }
+      }
+      return index
+    },
+    remove() {
+      if (this.multipleSelection && this.multipleSelection.length > 0) {
+        for (var i = 0; i < this.multipleSelection.length; i++) {
+          const selectRow = this.multipleSelection[i]
+          this.selectRow(selectRow)
+          const index = this.getCurrentRowIndex()
+          this.selectedFields.splice(index, 1)
+        }
+        // 需要把input改成update:modelValue，否则v-model的属性无法双向绑定
+        // this.$emit('input', this.selectedFields)
+        this.$emit('update:modelValue', this.selectedFields)
+      }
+    },
+    setSelectedFields(fields) {
+      // 新选中的字段需要以追加的方式放到xml中
+      if (fields === null || fields === undefined) {
+        fields = []
+      }
+      this.selectedFields = this.selectedFields.concat(fields)
+      this.selectRow(this.selectedFields[this.selectedFields.length - 1])
+      // 需要把input改成update:modelValue，否则v-model的属性无法双向绑定
+      // this.$emit('input', this.selectedFields)
+      this.$emit('update:modelValue', this.selectedFields)
+    },
+    formatCondition(value) {
+      if (value === '' || !value) return this.$t('workflowEditor.task.nothing')
+      const conditions = []
+      parseCondition(conditions, value)
+      return displayCondition(conditions)
+    },
+    getFieldLabel(row) {
+      const field = this.formFieldsWithSub.filter((item) => {
+        return item.name === row.name
+      })
+      if (field.length > 0) {
+        return field[0].label
+      } else {
+        return ''
+      }
+    },
+    selectCondition(row) {
+      this.selectRow(row)
+      this.showAdditionalCondition = true
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped></style>

package/packages/workflow-editor/src/properties-editors/human-task/events.vue

@@ -0,0 +1,60 @@
+<template>
+  <el-form :model="formModel" label-width="80px">
+    <el-form-item :label="$t('workflowEditor.task.beforeSubmission')">
+      <el-switch v-model="formModel.beforeSubmitEnabled" />
+    </el-form-item>
+    <div v-if="formModel.beforeSubmitEnabled">
+      <el-form-item :label="$t('workflowEditor.task.executionURL')">
+        <el-input v-model="formModel.beforeSubmit.url" />
+      </el-form-item>
+      <el-form-item :label="$t('workflowEditor.task.errorMessage')">
+        <el-input v-model="formModel.beforeSubmit.errorMessage" />
+      </el-form-item>
+    </div>
+    <el-form-item :label="$t('workflowEditor.task.afterSubmission')">
+      <el-switch v-model="formModel.afterComplete" />
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+export default {
+  name: 'Events',
+  props: {
+    modelValue: {
+      type: Object,
+      default: null
+    }
+  },
+  data() {
+    const formModel = {}
+    formModel.beforeSubmitEnabled = false
+    formModel.beforeSubmit = {}
+    if (this.modelValue.beforeSubmit) {
+      formModel.beforeSubmitEnabled = true
+      formModel.beforeSubmit = {
+        ...this.modelValue.beforeSubmit
+      }
+    }
+    formModel.afterComplete = this.modelValue.afterComplete
+    return {
+      formModel
+    }
+  },
+  mounted() {
+    this.$watch('formModel', function(newVal, oldVal) {
+      const events = {}
+      if (this.formModel.beforeSubmitEnabled) {
+        events.beforeSubmit = {
+          ...this.formModel.beforeSubmit
+        }
+      }
+      events.afterComplete = this.formModel.afterComplete
+      // this.$emit('input', events)
+      this.$emit('update:modelValue',events)
+    }, {
+      deep: true
+    })
+  }
+}
+</script>

package/packages/workflow-editor/src/properties-editors/human-task/permission-settings.vue

@@ -0,0 +1,224 @@
+<template>
+  <el-form :model="formModel">
+    <el-form-item :label="$t('workflowEditor.task.allowEditingForms')">
+      <el-switch v-model="formModel.editForm.permission" />
+    </el-form-item>
+	  <el-form-item v-show="formModel.editForm.permission">
+		  <editable-fields v-if="formModel.editForm.permission" v-model="formModel.editForm.field" />
+		  <editable-child-fields v-if="formModel.editForm.permission" v-model="formModel.editForm.subTablePermission" />
+	  </el-form-item>
+    <el-form-item :label="$t('workflowEditor.task.allowViews')">
+      <el-switch v-model="formModel.viewOpinion.permission" />
+      <el-checkbox v-if="formModel.viewOpinion.permission" v-model="formModel.viewOpinionCheckbox">
+        {{ $t('workflowEditor.task.additionalConditions') }}
+      </el-checkbox>
+    </el-form-item>
+	  <el-form-item v-show="formModel.viewOpinion.permission&&formModel.viewOpinionCheckbox" >
+		  <additional-condition v-model="formModel.viewOpinion.condition" />
+	  </el-form-item>
+    <el-form-item :label="$t('workflowEditor.task.commentsAllowed')">
+      <el-switch v-model="formModel.editOpinion.permission" />
+      <el-checkbox v-if="formModel.editOpinion.permission" v-model="formModel.editOpinionCheckbox">
+        {{ $t('workflowEditor.task.additionalConditions') }}
+      </el-checkbox>
+    </el-form-item>
+	  <el-form-item v-show="formModel.editOpinion.permission&&formModel.editOpinionCheckbox">
+		  <additional-condition v-model="formModel.editOpinion.condition" />
+	  </el-form-item>
+    <el-form-item :label="$t('workflowEditor.task.commentsAreRequired')">
+      <el-switch v-model="formModel.requireOpinion.permission" />
+      <el-checkbox v-if="formModel.requireOpinion.permission" v-model="formModel.requireOpinionCheckbox">
+        {{ $t('workflowEditor.task.additionalConditions') }}
+      </el-checkbox>
+    </el-form-item>
+	  <el-form-item v-show="formModel.requireOpinion.permission&&formModel.requireOpinionCheckbox">
+		  <additional-condition v-model="formModel.requireOpinion.condition" />
+	  </el-form-item>
+    <el-form-item :label="$t('workflowEditor.task.allowToViewCountersignatureResults')">
+      <el-switch v-model="formModel.viewMeetingResult.permission" />
+      <el-checkbox v-if="formModel.viewMeetingResult.permission" v-model="formModel.viewMeetingResultCheckbox">
+        {{ $t('workflowEditor.task.additionalConditions') }}
+      </el-checkbox>
+    </el-form-item>
+	  <el-form-item  v-show="formModel.viewMeetingResult.permission&&formModel.viewMeetingResultCheckbox">
+		  <additional-condition v-model="formModel.viewMeetingResult.condition" />
+	  </el-form-item>
+    <el-form-item :label="$t('workflowEditor.task.allowToViewVotingResults')">
+      <el-switch v-model="formModel.viewVoteResult.permission" />
+      <el-checkbox v-if="formModel.viewVoteResult.permission" v-model="formModel.viewVoteResultCheckbox">
+        {{ $t('workflowEditor.task.additionalConditions') }}
+      </el-checkbox>
+    </el-form-item>
+	  <el-form-item v-show="formModel.viewVoteResult.permission&&formModel.viewVoteResultCheckbox" >
+		  <additional-condition v-model="formModel.viewVoteResult.condition" />
+	  </el-form-item>
+    <el-form-item :label="$t('workflowEditor.task.allowToViewFlowHistory')">
+      <el-switch v-model="formModel.viewFlowHistory.permission" />
+      <el-checkbox v-if="formModel.viewFlowHistory.permission" v-model="formModel.viewFlowHistoryCheckbox">
+        {{ $t('workflowEditor.task.additionalConditions') }}
+      </el-checkbox>
+    </el-form-item>
+	  <el-form-item  v-show="formModel.viewFlowHistory.permission&&formModel.viewFlowHistoryCheckbox">
+		  <additional-condition v-model="formModel.viewFlowHistory.condition" />
+	  </el-form-item>
+    <el-form-item :label="$t('workflowEditor.task.allowFormsToPrint')">
+      <el-switch v-model="formModel.printForm.permission" />
+      <el-checkbox v-if="formModel.printForm.permission" v-model="formModel.printFormCheckbox">
+        {{ $t('workflowEditor.task.additionalConditions') }}
+      </el-checkbox>
+    </el-form-item>
+	  <el-form-item v-show="formModel.printForm.permission&&formModel.printFormCheckbox" >
+		  <additional-condition v-model="formModel.printForm.condition" />
+	  </el-form-item>
+    <user-selection v-model="formModel.deleteInstance.userCondition" :label="$t('workflowEditor.task.deletePermission')" label-width="100px" :current-transactor="true" />
+    <el-form-item :label="$t('workflowEditor.task.attachmentAuthority')">
+      <el-switch v-model="formModel.attachment.permission" />
+    </el-form-item>
+    <el-card v-if="formModel.attachment.permission" class="box-card">
+      <el-form-item :label="$t('workflowEditor.task.addAttachment')">
+        <el-switch v-model="formModel.attachment.add.permission" />
+        <el-checkbox v-if="formModel.attachment.add.permission" v-model="formModel.attachment.addCheckbox">
+          {{ $t('workflowEditor.task.additionalConditions') }}
+        </el-checkbox>
+        <additional-condition v-if="formModel.attachment.add.permission&&formModel.attachment.addCheckbox" v-model="formModel.attachment.add.condition" />
+      </el-form-item>
+      <el-form-item :label="$t('workflowEditor.task.deleteAttachment')">
+        <el-switch v-model="formModel.attachment.delete.permission" />
+        <el-checkbox v-if="formModel.attachment.delete.permission" v-model="formModel.attachment.deleteCheckbox">
+          {{ $t('workflowEditor.task.additionalConditions') }}
+        </el-checkbox>
+        <additional-condition v-if="formModel.attachment.delete.permission&&formModel.attachment.deleteCheckbox" v-model="formModel.attachment.delete.condition" />
+      </el-form-item>
+      <el-form-item :label="$t('workflowEditor.task.downloadAttachment')">
+        <el-switch v-model="formModel.attachment.download.permission" />
+        <el-checkbox v-if="formModel.attachment.download.permission" v-model="formModel.attachment.downloadCheckbox">
+          {{ $t('workflowEditor.task.additionalConditions') }}
+        </el-checkbox>
+        <additional-condition v-if="formModel.attachment.download.permission&&formModel.attachment.downloadCheckbox" v-model="formModel.attachment.download.condition" />
+      </el-form-item>
+    </el-card>
+    <el-form-item :label="$t('workflowEditor.task.bodyPermission')">
+      <el-switch v-model="formModel.officialText.permission" />
+    </el-form-item>
+  </el-form>
+</template>
+<script>
+import EditableFields from './editable-fields'
+import editableChildFields from './editable-child-fields'
+import AdditionalCondition from '../common/additional-condition'
+import UserSelection from '../common/user-selection'
+import { deepCopy } from '../../util'
+export default {
+  name: 'PermissionSettings',
+  components: {
+    EditableFields,
+    UserSelection,
+    AdditionalCondition,
+    editableChildFields
+  },
+  props: {
+    modelValue: {
+      type: Object,
+      default: null
+    }
+  },
+  data() {
+    const formModel = deepCopy(this.modelValue)
+    // 控制附加条件的属性名
+    const attrNames = [
+      'viewOpinion', 'editOpinion', 'requireOpinion', 'viewMeetingResult', 'viewVoteResult',
+      'viewFlowHistory', 'printForm'
+    ]
+    attrNames.forEach(name => {
+      // 如果是''或者undefined,那么两次!后就是false
+      formModel[name + 'Checkbox'] = !!this.modelValue[name].condition
+    })
+    // 控制附件各个权限的附加条件的属性名
+    const attachmentAttrNames = [
+      'add', 'delete', 'download'
+    ]
+    attachmentAttrNames.forEach(name => {
+    // 如果是''或者undefined,那么两次!后就是false
+      formModel.attachment[name + 'Checkbox'] = !!this.modelValue.attachment[name] && !!this.modelValue.attachment[name].condition
+      if (!formModel.attachment.permission) {
+        formModel.attachment[name] = {
+          permission: false,
+          condition: ''
+        }
+      }
+    })
+
+    return {
+      formModel,
+      attrNames,
+      attachmentAttrNames
+    }
+  },
+  mounted() {
+    this.$watch('formModel', function(formModel) {
+      const result = {
+        editForm: { },
+        viewOpinion: { },
+        editOpinion: { },
+        requireOpinion: { },
+        viewMeetingResult: { },
+        viewVoteResult: { },
+        viewFlowHistory: { },
+        printForm: { },
+        officialText: { },
+        attachment: { },
+        deleteInstance: {
+          userCondition: ''
+        }
+      }
+      console.log('触发了watch')
+      result.editForm.permission = formModel.editForm.permission
+      if (formModel.editForm.permission) {
+        result.editForm.field = formModel.editForm.field
+        result.editForm.subTablePermission = formModel.editForm.subTablePermission
+      }
+
+      this.attrNames.map(name => {
+        // permission为true且附件条件的checkbox也选中了，condition才有效
+        result[name].permission = formModel[name].permission
+        if (formModel[name].permission && formModel[name + 'Checkbox']) {
+          result[name].condition = formModel[name].condition
+        } else {
+          result[name].condition = ''
+        }
+      })
+
+      result.attachment.permission = formModel.attachment.permission
+      // 允许设置附件权限时，add，delete等的权限设置才有效，否则根本不生成add，delete等对应的json
+      if (formModel.attachment.permission) {
+        this.attachmentAttrNames.map(name => {
+        // 需要避免result的add,delete等属性为undefined
+          if (!result.attachment[name])result.attachment[name] = {}
+          // attachment不是undefined并且对应的add，delete等属性的permission为true
+          result.attachment[name].permission = formModel.attachment[name].permission
+          // permission为true且附件条件的checkbox也选中了，condition才有效
+          if (formModel.attachment[name].permission && formModel.attachment[name + 'Checkbox']) {
+            result.attachment[name].condition = formModel.attachment[name].condition
+          } else {
+            result.attachment[name].condition = ''
+          }
+        })
+      }
+
+      // 正文权限暂不处理
+      // this.$emit('input', result)
+      this.$emit('update:modelValue', result)
+    }, {
+      deep: true
+    })
+  },
+  methods: {
+
+  }
+}
+</script>
+<style scoped>
+  .el-checkbox{
+    margin-left: 20px;
+  }
+</style>