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

package/packages/workflow-editor/src/properties-editors/common/additional-condition.vue

@@ -0,0 +1,320 @@
+<template>
+  <div style="overflow: auto;width: 100%;">
+    <el-row>
+      <el-button type="primary" size="small" plain icon="CirclePlus" @click="add">
+        {{ $t('workflowEditorPublicModel.add') }}
+      </el-button>
+      <el-button type="primary" size="small" plain icon="ArrowRight" @click="insert">
+        {{ $t('workflowEditorPublicModel.insert') }}
+      </el-button>
+      <!-- <el-button type="primary" size="small" plain @click="modify">
+        修改
+      </el-button> -->
+      <el-button type="primary" size="small" plain icon="Delete" @click="remove">
+        {{ $t('workflowEditorPublicModel.delete') }}
+      </el-button>
+      <el-button type="primary" size="small" plain icon="View" @click="view">
+        {{ $t('workflowEditorPublicModel.viewConditions') }}
+      </el-button>
+    </el-row>
+    <el-table
+      ref="table"
+      :data="tableData"
+      row-key="id"
+      border
+      style="width: 100%; padding-top: 10px"
+      highlight-current-row
+      @current-change="handleCurrentChange"
+    >
+      <el-table-column prop="leftBracket" label="(" width="90">
+        <template v-slot="scope">
+          <el-select v-model="scope.row.leftBracket" placeholder="" @focus="selectRow(scope.row)">
+            <el-option label="" value="" />
+            <el-option label="(" value="(" />
+            <el-option label="((" value="((" />
+            <el-option label="(((" value="(((" />
+          </el-select>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('workflowEditor.common.fieldName')" width="200">
+        <template v-slot="scope">
+          <el-input :value="format(scope.row.key)" @click="selectField(scope.row)" />
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('workflowEditor.common.operator')" width="130">
+        <template v-slot="scope">
+          <el-select v-model="scope.row.operator" placeholder="" @focus="selectRow(scope.row)">
+            <el-option
+              v-for="option in getOperatorOptions(scope.row.key)"
+              :key="option.name"
+              :label="option.label"
+              :value="option.name"
+            />
+          </el-select>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('workflowEditor.common.value')">
+        <template v-slot="scope">
+          <el-input
+            v-if="scope.row.key.indexOf('${field[') >= 0 || isTransitionOtherField(scope.row.key)"
+            v-model.trim="scope.row.value"
+          />
+          <el-select
+            v-else-if="scope.row.key === '${approvalResult}'"
+            v-model.trim="scope.row.value"
+          >
+            <el-option value="同意" :label="$t('workflowEditorPublicModel.agree')" />
+            <el-option value="不同意" :label="$t('workflowEditorPublicModel.disagree')" />
+          </el-select>
+          <el-input
+            v-else
+            :value="format(scope.row.value, scope.row)"
+            readonly
+            @click="selectValue"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column prop="rightBracket" label=")" width="90" @focus="selectRow(scope.row)">
+        <template v-slot="scope">
+          <el-select v-model="scope.row.rightBracket" placeholder="">
+            <el-option label="" value="" />
+            <el-option label=")" value=")" />
+            <el-option label="))" value="))" />
+            <el-option label=")))" value=")))" />
+          </el-select>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="logicOperator"
+        :label="$t('workflowEditorPublicModel.andOr')"
+        width="110"
+      >
+        <template v-slot="scope">
+          <el-select
+            v-model="scope.row.logicOperator"
+            :placeholder="$t('workflowEditorMessage.pleaseSelect')"
+            @focus="selectRow(scope.row)"
+          >
+            <el-option
+              :label="$t('workflowEditor.process.perhaps')"
+              value="condition.operator.or"
+            />
+            <el-option :label="$t('workflowEditor.process.also')" value="condition.operator.and" />
+          </el-select>
+        </template>
+      </el-table-column>
+    </el-table>
+    <value-selection-dialog
+      v-if="currentInput"
+      :title="valueDialogTitle"
+      :show-organization="showOrganization"
+      :standard-fields="availableStandardFields"
+      :org-type="orgType"
+      @close="closeValueDialog"
+    />
+  </div>
+</template>
+<script>
+import {
+  getFieldLabel,
+  parseCondition,
+  generateCondition,
+  displayCondition,
+  getRelatedStandardFields,
+  getOperators,
+  getStandardFieldsByTacheType,
+  isTransitionOtherField
+} from './additional-condition-utils'
+import { standardFields } from './additional-condition-utils'
+import ValueSelectionDialog from '../common/value-selection-dialog'
+import { mapGetters } from 'vuex'
+export default {
+  name: 'AdditionalCondition',
+  components: {
+    ValueSelectionDialog
+  },
+  props: {
+    modelValue: {
+      type: String,
+      default: null
+    },
+    isTransition: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    const tableData = []
+    const count = parseCondition(tableData, this.modelValue)
+
+    return {
+      standardFields,
+      tableData,
+      count: count,
+      currentRow: null,
+      currentInput: null,
+      options: [],
+      valueDialogTitle: null,
+      showOrganization: true,
+      orgType: null
+    }
+  },
+  computed: {
+    ...mapGetters('wfEditor', ['formFields']),
+    availableStandardFields() {
+      if (this.currentInput === 'key') {
+        return getStandardFieldsByTacheType(this.isTransition)
+      } else {
+        return getRelatedStandardFields(this.currentRow.key)
+      }
+    }
+  },
+  mounted() {
+    if (this.tableData.length > 0) {
+      this.$refs.table.setCurrentRow(this.tableData[this.tableData.length - 1])
+    }
+    this.$watch(
+      'tableData',
+      function (newVal, oldVal) {
+        // this.$emit('input', generateCondition(this.tableData))
+        this.$emit('update:modelValue', generateCondition(this.tableData))
+      },
+      {
+        deep: true
+      }
+    )
+  },
+  methods: {
+    format(value, row) {
+      console.log('row', row)
+      if (value === '' || value === undefined || value === null) return ''
+      return getFieldLabel(value)
+    },
+    getOperatorOptions(fieldName) {
+      // console.log('---getOperatorOptions---fieldName=', fieldName)
+      return getOperators(fieldName)
+    },
+    selectRow(row) {
+      this.$refs.table.setCurrentRow(row)
+    },
+    openValueDialog(row) {
+      this.showValueDialog = true
+      this.selectRow(row)
+    },
+    closeValueDialog(selectedValue) {
+      if (selectedValue !== undefined && selectedValue !== '') {
+        // 改变字段时需要清空value
+        if (this.currentInput === 'key' && this.currentRow.key !== selectedValue) {
+          this.currentRow.operator = ''
+          this.currentRow.value = ''
+        }
+        // currentInput为key或者value
+        this.currentRow[this.currentInput] = selectedValue
+      }
+      this.currentInput = ''
+    },
+    getCondition(row) {
+      return row.key + ' ' + row.operator + ' ' + row.value
+    },
+    handleCurrentChange(val) {
+      this.currentRow = val
+    },
+    getRowIndex(row) {
+      for (let i = 0; i < this.tableData.length; i++) {
+        if (this.tableData[i].id === row.id) {
+          return i
+        }
+      }
+      return -1
+    },
+    add() {
+      if (
+        this.count === null ||
+        this.count === undefined ||
+        this.count.isNaN ||
+        this.count === 'NaN'
+      ) {
+        this.count = 0
+      }
+      const newRow = {
+        id: this.count,
+        leftBracket: '',
+        key: '',
+        operator: '',
+        value: '',
+        rightBracket: '',
+        logicOperator: 'condition.operator.or'
+      }
+      this.tableData.push(newRow)
+      this.$refs.table.setCurrentRow(newRow)
+      this.count++
+    },
+    insert() {
+      if (this.currentRow === null) {
+        this.$alert(this.$t('workflowEditorMessage.pleaseSelectARow'))
+        return
+      }
+      const newRow = {
+        id: this.count,
+        leftBracket: '',
+        key: '',
+        operator: 'operator.text.eq',
+        value: '',
+        rightBracket: '',
+        logicOperator: 'condition.operator.or'
+      }
+      this.tableData.splice(this.getRowIndex(this.currentRow), 0, newRow)
+      this.$refs.table.setCurrentRow(newRow)
+      this.count++
+    },
+    remove() {
+      if (this.currentRow === null) {
+        this.$alert(this.$t('workflowEditorMessage.pleaseSelectARow'))
+        return
+      }
+      let index = this.getRowIndex(this.currentRow)
+      this.tableData.splice(index, 1)
+      if (this.tableData.length > 0) {
+        index = index <= this.tableData.length - 1 ? index : this.tableData.length - 1
+        this.$refs.table.setCurrentRow(this.tableData[index])
+      }
+    },
+    view() {
+      let result = displayCondition(this.tableData)
+      if (result === '') {
+        result = this.$t('workflowEditorMessage.conditionsHaveNotBeenSet')
+      }
+      this.$confirm(result, this.$t('workflowEditorMessage.viewConditions'), {
+        showConfirmButton: false,
+        showCancelButton: false,
+        // 增加这个空的回退函数防止报错
+        callback: function () {}
+      })
+    },
+    selectField(row) {
+      this.selectRow(row)
+      this.currentInput = 'key'
+      this.valueDialogTitle = this.$t('workflowEditorMessage.fieldSettings')
+      this.showOrganization = false
+    },
+    selectValue() {
+      this.currentInput = 'value'
+      this.valueDialogTitle = this.$t('workflowEditorMessage.valueSetting')
+      this.showOrganization = true
+      this.orgType = this.getStandardFieldOrgType()
+    },
+    getStandardFieldOrgType() {
+      const fields = this.standardFields.filter((standardField) => {
+        return standardField.name === this.currentRow.key
+      })
+      if (fields.length > 0) {
+        return fields[0].orgType
+      }
+      return ''
+    },
+    isTransitionOtherField(fieldName) {
+      return isTransitionOtherField(fieldName)
+    }
+  }
+}
+</script>

package/packages/workflow-editor/src/properties-editors/common/auto-filled-fields-utils.js

@@ -0,0 +1,34 @@
+import {getI18n} from '../../../../workflow-editor/src/util'
+export const standardValues = {
+  '${currentTime}':	getI18n().t('workflowEditor.process.handlingTimeOfThisLink'),
+  '${currentTransactorId}':	getI18n().t('workflowEditor.process.handlerIDOfThisLink'),
+  '${currentTransactorMainDepartmentId}':	getI18n().t('workflowEditor.process.currentHandlerPrincipalDepartmentID'),
+  '${currentTransactorDirectSuperiorId}':	getI18n().t('workflowEditor.process.iDOfTheImmediateSuperiorOfTheCurrentHandler'),
+  '${currentTransactorDirectSuperiorMainDepartmentId}':	getI18n().t('workflowEditor.process.iDOfTheSuperiorDepartmentDirectlyUnderTheCurrentHandler'),
+  '${currentTransactor}':	getI18n().t('workflowEditor.process.loginNameOfTheHandlerInThisLink'),
+  '${currentTransactorName }':	getI18n().t('workflowEditor.process.NameOfCurrentHandler'),
+  '${currentTransactorDepartment }':	getI18n().t('workflowEditor.process.CurrentHandlerDepartment'),
+  '${currentTransactorDepartmentId}':	getI18n().t('workflowEditor.process.CurrentHandlerDepartmentID'),
+  '${currentTransactorMainDepartment}':	getI18n().t('workflowEditor.process.CurrentManagersPrincipalDepartment'),
+  '${currentTransactorSuperiorDepartmentId}':	getI18n().t('workflowEditor.process.iDOfSsuperiorDepartmentOfCurrentHandler'),
+  '${currentTransactorSuperiorDepartment}': getI18n().t('workflowEditor.process.CurrentHandlersSuperiorDepartment'),
+  '${currentTransactorUpstageDepartment}':	getI18n().t('workflowEditor.process.TopDepartmentOfCurrentHandler'),
+  '${currentTransactorUpstageDepartmentId}':	getI18n().t('workflowEditor.process.TopDepartmentIDOfCurrentHandler'),
+  '${currentTransactorRole}':	getI18n().t('workflowEditor.process.CurrentHandlerRole'),
+  '${currentTransactorRoleId}':	getI18n().t('workflowEditor.process.CurrentHandlerRoleID'),
+  '${currentTransactorWorkGroup}':	getI18n().t('workflowEditor.process.currentHandlerWorkingGroup'),
+  '${currentTransactorWorkGroupId}':	getI18n().t('workflowEditor.process.CurrentHandlerWorkingGroupID'),
+  '${currentTransactorDirectSuperior}': getI18n().t('workflowEditor.process.LoginNameOfTheImmediateSuperiorOfTheCurrentHandler'),
+  '${currentTransactorDirectSuperiorName}': getI18n().t('workflowEditor.process.nameOfTheImmediateSuperiorOfTheCurrentHandler'),
+  '${currentTransactorDirectSuperiorDepartment}':	getI18n().t('workflowEditor.process.currentHandlersDirectSuperiorDepartment'),
+  '${currentTransactorDirectSuperiorDepartmentId}':	getI18n().t('workflowEditor.process.currentManagersIdDirectlyUnderTheSuperior'),
+  '${currentTransactorDirectSuperiorMainDepartment}':	getI18n().t('workflowEditor.process.currentManagersDirectSuperiorDepartment'),
+  '${currentTransactorDirectSuperiorRole}':	getI18n().t('workflowEditor.process.currentManagersDirectSuperiorRole'),
+  '${currentTransactorDirectSuperiorRoleId}': getI18n().t('workflowEditor.process.currentHandlersDirectSuperiorRoleID'),
+  '${currentTransactorDirectSuperiorWorkGroup}':	getI18n().t('workflowEditor.process.currentManagersDirectSuperiorWork'),
+  '${currentTransactorDirectSuperiorWorkGroupId}':	getI18n().t('workflowEditor.process.iDOfTheWorkingGroupDirectlyUnderTheCurrentHandler'),
+  '${currentOperation}': getI18n().t('workflowEditor.process.operationsPerformedInThisPhase'),
+  '${previousTransactorId}': getI18n().t('workflowEditor.process.handlerIDOfThePreviousLink'),
+  '${previousTransactor}':	getI18n().t('workflowEditor.process.lastLinkHandlerLogin'),
+  '${previousTransactorName}': getI18n().t('workflowEditor.process.nameOfHandlerInThePreviousLink')
+}

package/packages/workflow-editor/src/properties-editors/common/auto-filled-fields.vue

@@ -0,0 +1,268 @@
+<template>
+  <div>
+    <el-card class="box-card">
+      <template #header> 表单自动填充字段设置 </template>
+      <el-row style="margin-bottom: 5px">
+        <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="tableData"
+        border
+        highlight-current-row
+        style="width: 100%"
+        @current-change="handleCurrentChange"
+      >
+        <el-table-column type="index" width="50" />
+        <el-table-column prop="name" :label="$t('workflowEditor.common.name')" width="150">
+          <template v-slot="scope">
+            <el-input
+              :value="getFieldLabel(scope.row.name)"
+              :placeholder="$t('workflowEditorMessage.pleaseEnterContent')"
+              readonly
+              @click="showFormFields = true"
+              @blur="checkName(scope.row.name)"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column prop="value" :label="$t('workflowEditor.common.fieldValue')" width="200">
+          <template v-slot="scope">
+            <el-select
+              v-model="scope.row.value"
+              multiple
+              filterable
+              allow-create
+              default-first-option
+              :placeholder="$t('workflowEditorMessage.pleaseSelect')"
+              @blur="checkValue(scope.row.value)"
+            >
+              <el-option v-for="key in keys" :key="key" :label="standardValues[key]" :value="key" />
+            </el-select>
+          </template>
+        </el-table-column>
+        <el-table-column prop="separator" :label="$t('workflowEditor.common.separator')">
+          <template v-slot="scope">
+            <el-input v-model.trim="scope.row.separator" />
+          </template>
+        </el-table-column>
+        <el-table-column prop="fillType" :label="$t('workflowEditor.common.fillInMethod')">
+          <template v-slot="scope">
+            <el-select v-model="scope.row.fillType">
+              <el-option :label="$t('workflowEditor.common.cover')" value="cover" />
+              <el-option :label="$t('workflowEditor.common.append')" value="append" />
+              <el-option :label="$t('workflowEditor.common.insertToFront')" value="prepend" />
+            </el-select>
+          </template>
+        </el-table-column>
+        <el-table-column prop="fillTime" :label="$t('workflowEditor.common.fillInTime')">
+          <template v-slot="scope">
+            <el-select v-model="scope.row.fillTime">
+              <el-option :label="$t('workflowEditor.common.fillInBeforeHandling')" value="before" />
+              <el-option :label="$t('workflowEditor.common.fillInAfterHandling')" value="after" />
+            </el-select>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="box-card" style="margin-top: 10px">
+      <template #header> 办理意见 </template>
+      <el-form-item :label="'意见来源字段'" label-width="100">
+        <el-input
+          :value="getFieldLabel(opinionAutoSetting.opinionSourceField)"
+          :placeholder="$t('workflowEditorMessage.pleaseSelect')"
+          readonly
+          :clearable="true"
+          @click="selectOpinionField"
+        >
+          <template #append>
+            <el-button icon="Delete" @click="clearOpinionField" />
+          </template>
+        </el-input>
+      </el-form-item>
+    </el-card>
+    <form-fields v-if="showFormFields" @close="setField" />
+  </div>
+</template>
+<script>
+import { standardValues } from './auto-filled-fields-utils'
+import FormFields from '../common/form-fields'
+import { getFormFieldLabel } from '../common/form-fields-utils'
+export default {
+  name: 'AutoFilledFields',
+  components: {
+    FormFields
+  },
+  props: {
+    modelValue: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    opinionSetting: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    }
+  },
+  data() {
+    const tableData = []
+    if (this.modelValue.field !== undefined && this.modelValue.field !== null) {
+      // xml中有多个field时是数组，只有一个field时是Object
+      if (Array.isArray(this.modelValue.field)) {
+        this.modelValue.field.map((field) => {
+          const row = { ...field }
+          if (typeof field.value === 'string' && field.value.indexOf('+') !== -1) {
+            row.value = field.value.split('+')
+          } else {
+            row.value = []
+            row.value.push(field.value)
+          }
+          tableData.push(row)
+        })
+      } else {
+        const row = { ...this.modelValue.field }
+        if (typeof this.modelValue.field.value === 'string' && this.modelValue.field.value.indexOf('+') !== -1) {
+          row.value = this.modelValue.field.value.split('+')
+        } else {
+          row.value = []
+          row.value.push(this.modelValue.field.value)
+        }
+        tableData.push(row)
+      }
+    }
+    let opinionAutoSetting = {}
+    if (this.opinionSetting && this.opinionSetting.opinionSourceField) {
+      opinionAutoSetting = { ...this.opinionSetting }
+    }
+    return {
+      tableData,
+      currentRow: null,
+      standardValues,
+      showFormFields: false,
+      isSelectOpinionField: false,
+      opinionAutoSetting
+    }
+  },
+  computed: {
+    keys() {
+      return Object.keys(this.standardValues)
+    }
+  },
+  watch: {
+    opinionAutoSetting: {
+      deep: true,
+      handler(val) {
+        const setting = { ...val }
+        this.$emit('update:opinion-setting', setting)
+      }
+    }
+  },
+  mounted() {
+    if (this.tableData && this.tableData.length > 0) {
+      this.setCurrentRow(this.tableData[0])
+    }
+    this.$watch(
+      'tableData',
+      function () {
+        const fields = []
+        this.tableData.map((row) => {
+          if (row.name !== '' && row.value.length > 0) {
+            const field = { ...row }
+            field.value = row.value.join('+')
+            fields.push(field)
+          }
+        })
+
+        this.$emit('update:modelValue', {
+          field: fields
+        })
+      },
+      {
+        // deep为true可以监控数组中的元素的某个属性的变化
+        deep: true
+      }
+    )
+  },
+  created() {},
+  methods: {
+    add() {
+      for (let i = 0; i < this.tableData.length; i++) {
+        if (this.tableData[i].name === '' || this.tableData[i].value === '') {
+          this.$alert(this.$t('workflowEditorMessage.theFieldNameOrFieldValueInLineCannotBeEmpty', { row: i + 1 }))
+          return
+        }
+      }
+      const newRow = {
+        name: '',
+        value: [],
+        separator: '',
+        fillType: 'cover',
+        fillTime: 'after'
+      }
+      this.tableData.push(newRow)
+      this.setCurrentRow(newRow)
+    },
+    remove() {
+      if (this.currentRow === null) {
+        this.$alert(this.$t('workflowEditorMessage.pleaseSelectARow'))
+        return
+      }
+      let index
+      for (let i = 0; i < this.tableData.length; i++) {
+        if (this.tableData[i].name === this.currentRow.name) {
+          index = i
+          break
+        }
+      }
+      this.tableData.splice(index, 1)
+      // 当前选中的index如果是最后一行，那么删除后，index会等于length造成下标越界，因此需要让index等于新的最后一行
+      index = index <= this.tableData.length - 1 ? index : this.tableData.length - 1
+      this.setCurrentRow(this.tableData[index])
+    },
+    setCurrentRow(row) {
+      this.$refs.table.setCurrentRow(row)
+    },
+    handleCurrentChange(val) {
+      this.currentRow = val
+    },
+    checkName(name) {
+      if (!this.showFormFields && name === '') {
+        this.$alert(this.$t('workflowEditorMessage.fieldNameCannotBeEmpty'))
+      }
+    },
+    checkValue(value) {
+      if (value.length === 0) {
+        this.$alert(this.$t('workflowEditorMessage.fieldValueCannotBeEmpty'))
+      }
+    },
+    setField(name) {
+      if (!this.isSelectOpinionField) {
+        if (name !== undefined) {
+          this.currentRow.name = name
+        }
+      } else {
+        this.opinionAutoSetting.opinionSourceField = name
+      }
+      this.showFormFields = false
+      this.isSelectOpinionField = false
+    },
+    getFieldLabel(name) {
+      return getFormFieldLabel(name)
+    },
+    selectOpinionField() {
+      this.showFormFields = true
+      this.isSelectOpinionField = true
+    },
+    clearOpinionField() {
+      delete this.opinionAutoSetting.opinionSourceField
+    }
+  }
+}
+</script>