workflow-editor 0.0.6-up → 0.0.8-up

package/packages/workflow-editor/src/properties-editors/process.vue

@@ -1,115 +0,0 @@
-<template>
-  <el-dialog
-    visible
-    :title="$t('workflowEditor.process.processProperties')"
-    :center="true"
-    top="10vh"
-    append-to-body
-    custom-class="properties-editor"
-    @open="$emit('open')"
-    @opend="$emit('opend')"
-    @close="$emit('close')"
-    @closed="$emit('closed')"
-  >
-    <el-tabs v-model="activeTab" type="border-card" @tab-click="handleClick">
-      <el-tab-pane :label="$t('workflowEditor.process.basicProperties')" name="basicProperties">
-        <basic-properties
-          :name.sync="model.attr.name"
-          :code.sync="model.attr.code"
-          :model="model.properties.basicProperties"
-        />
-      </el-tab-pane>
-      <el-tab-pane :label="$t('workflowEditor.process.permissionSettings')" name="permissions">
-        <permission-settings :model="model.properties.permissionSettings" />
-      </el-tab-pane>
-      <el-tab-pane :label="$t('workflowEditor.process.notificationSettings')" name="inform">
-        <notice-settings v-model="model.properties.inform" />
-      </el-tab-pane>
-      <el-tab-pane :label="$t('workflowEditor.process.reminderSettings')" name="reminders">
-        <!-- <reminder v-model="model.properties.reminder" /> -->
-        <notice-reminder :reminder-value="model.properties.reminder" :task-notice-value="model.properties.taskNotice" />
-      </el-tab-pane>
-      <el-tab-pane :label="$t('workflowEditor.process.parameterSsetting')" name="parameterSettings">
-        <parameter-settings :model="model.properties.parameterSettings" />
-      </el-tab-pane>
-      <el-tab-pane :label="$t('workflowEditor.process.event')" name="events">
-        <events v-model="model.properties.events" />
-      </el-tab-pane>
-      <el-tab-pane :label="$t('workflowEditor.process.processVariables')" name="variables">
-        <variables v-model="model.properties.variables" />
-      </el-tab-pane>
-    </el-tabs>
-  </el-dialog>
-</template>
-<script>
-import convert from 'xml-js'
-import BasicProperties from './process/basic-properties'
-import PermissionSettings from './process/permission-settings'
-// import Reminder from './common/reminder'
-import ParameterSettings from './process/parameter-settings'
-import Events from './process/events'
-import Variables from './common/variables'
-import NoticeSettings from './process/notice-settings.vue'
-import NoticeReminder from './common/notice-reminder.vue'
-export default {
-  name: 'ProcessPropertiesEditor',
-  components: {
-    BasicProperties,
-    PermissionSettings,
-    // Reminder,
-    ParameterSettings,
-    Events,
-    Variables,
-    NoticeSettings,
-    NoticeReminder
-  },
-  props: {
-    model: {
-      type: Object,
-      default: null
-    }
-  },
-  data() {
-    // if (this.model.properties.inform === undefined) {
-    //   this.model.properties.inform = {}
-    // }
-    if (this.model.properties.taskNotice === undefined) {
-      this.model.properties.taskNotice = {}
-    }
-    return {
-      activeTab: 'basicProperties'
-    }
-  },
-  computed: {
-    // 定义这些计算属性只是为了减少模板中的代码量
-    basicProperties() {
-      return this.model.properties.basicProperties
-    },
-    accessRight() {
-      return this.model.properties.accessRight
-    },
-    reminder() {
-      return this.model.properties.reminder
-    },
-    parameterSettings() {
-      return this.model.properties.parameterSettings
-    },
-    events() {
-      return this.model.properties.events
-    },
-    variables() {
-      return this.model.properties.variables
-    }
-  },
-  methods: {
-    toXml() {
-      const options = { compact: true, ignoreComment: true, spaces: 4 }
-      console.log(convert.js2xml({ basicProperties: this.basicProperties }, options))
-    },
-    handleClick(tab, event) {
-      // console.log(tab, event)
-    }
-  }
-}
-</script>
-

package/packages/workflow-editor/src/properties-editors/subprocess/basic-properties.vue

@@ -1,199 +0,0 @@
-<template>
-  <el-form :model="formModel">
-    <el-row>
-      <el-col :span="12">
-        <el-form-item :label="$t('workflowEditor.process.name')" label-width="50px">
-          <!-- <el-input v-model="formModel.name" /> -->
-          <i18n-input
-            v-model="formModel.name"
-            :i18n-key="formModel.tache.i18nKey?formModel.tache.i18nKey:'name.'+formModel.id"
-            @setI18n="setI18nValue"
-          />
-        </el-form-item>
-      </el-col>
-      <el-col :span="12">
-        <el-form-item :label="$t('workflowEditor.process.code')" label-width="50px">
-          <el-input v-model="formModel.id" @blur="validateId" />
-        </el-form-item>
-      </el-col>
-    </el-row>
-    <el-form-item :label="$t('workflowEditor.task.taskTitle')">
-      <task-title v-model="tache.taskTitle" />
-    </el-form-item>
-    <el-form-item :label="$t('workflowEditor.process.subprocess')" label-width="60px">
-      <el-cascader
-        v-model="selectedProcess"
-        :show-all-levels="false"
-        :options="processes"
-        @change="handleChange"
-      />
-    </el-form-item>
-    <el-form-item :label="$t('workflowEditor.process.subprocessIsSharedForm')" label-width="60px">
-      <el-switch v-model="formModel.tache.isSharedForm" />
-    </el-form-item>
-    <el-radio-group v-model="formModel.tache.moreTransactor">
-      <el-radio :label="false">
-        {{ $t('workflowEditor.task.anyOneCanHandleIt') }}
-      </el-radio>
-      <el-radio :label="true">
-        {{ $t('workflowEditor.task.forAll') }}
-      </el-radio>
-    </el-radio-group>
-    <el-form-item :label="$t('workflowEditor.process.transferValueFromMainFormToSubForm')">
-      <field-mappings
-        v-model="formModel.tache.parameters"
-        :src-label="$t('workflowEditor.process.fieldsOfTheMainForm')"
-        :target-label="$t('workflowEditor.process.fieldsOfSubform')"
-        :target-fields="subprocessFormFields"
-      />
-    </el-form-item>
-    <el-form-item :label="$t('workflowEditor.process.subformReturnsResultsToMainForm')">
-      <field-mappings
-        v-model="formModel.tache.result"
-        :src-label="$t('workflowEditor.process.fieldsOfSubform')"
-        :target-label="$t('workflowEditor.process.fieldsOfTheMainForm')"
-        :src-fields="subprocessFormFields"
-      />
-    </el-form-item>
-  </el-form>
-</template>
-
-<script>
-import FieldMappings from './field-mappings'
-import processService from '../../process-service.js'
-import { validateTacheCode } from '../../util'
-import i18nInput from '../common/i18n-input'
-import TaskTitle from '../common/task-title'
-export default {
-  name: 'BasicProperties',
-  components: {
-    FieldMappings,
-    i18nInput,
-    TaskTitle
-  },
-  props: {
-    model: {
-      type: Object,
-      default: null
-    },
-    id: {
-      type: String,
-      default: null
-    },
-    name: {
-      type: String,
-      default: null
-    }
-  },
-  data() {
-    return {
-      selectedProcess: [],
-      processes: [],
-      subprocessFormFields: [],
-      formModel: {
-        name: this.name,
-        id: this.id,
-        tache: this.model
-      }
-    }
-  },
-  computed: {
-    tache() {
-      return this.model
-    }
-  },
-  created() {
-    this.listAllProcesses().then(() => {
-      this.fetchSubprocessFormFields()
-    })
-
-    if (this.formModel.tache.parameters === '') {
-      this.formModel.tache.parameters = {}
-    }
-    if (this.formModel.tache.result === '') {
-      this.formModel.tache.result = {}
-    }
-  },
-  mounted() {
-    // 支持.snyc修饰符的写法
-    this.$watch('formModel.name', function(newVal, oldVal) {
-      this.$emit('update:name', newVal)
-    })
-  },
-  methods: {
-    fetchSubprocessFormFields() {
-      if (this.model.processCode) {
-      // 获得子流程对应表单字段集合
-        processService.fetchSubprocessFormFields(this.model.processCode, this.model.processVersion).then(formFields => {
-          this.subprocessFormFields = formFields
-        })
-      }
-    },
-    handleChange(values) {
-      console.log('handleChange=', values)
-      const processInfo = values[1]
-      this.model.processCode = processInfo.substring(processInfo.indexOf('/') + 1, processInfo.lastIndexOf('/'))
-      this.model.processVersion = processInfo.substring(processInfo.lastIndexOf('/') + 1)
-      this.fetchSubprocessFormFields()
-    },
-    // 获得对应表单列表
-    listAllProcesses() {
-      return new Promise((resolve, reject) => {
-        this.$http.get(this.baseAPI + '/wf-editor/workflow-editors/all-active-definitions').then(activeDefinitions => {
-          if (activeDefinitions.length > 0) {
-          // 设置表单信息
-            const selectedProcessInfo = this.model.processCode + '/' + this.model.processVersion
-            // 修改时，获得默认选中的表单项
-            this.setDefaultSelectedProcessWhenUpdate(activeDefinitions, selectedProcessInfo)
-            this.processes = activeDefinitions
-            resolve()
-          }
-        }).catch(error => {
-          reject(error)
-        })
-      })
-    },
-    // 修改时，获得默认选中的流程项
-    setDefaultSelectedProcessWhenUpdate(activeDefinitions, selectedProcessInfo) {
-      let selectedProcess
-      let selectedSystemCode
-      for (var i = 0; i < activeDefinitions.length; i++) {
-        const systemCode = activeDefinitions[i].value
-        const definitions = activeDefinitions[i].children
-        const selectedProcesses = definitions.filter(this.filterProcess(selectedProcessInfo))
-        if (selectedProcesses.length > 0) {
-          selectedSystemCode = systemCode
-          selectedProcess = selectedProcesses[0]
-          break
-        }
-      }
-      if (selectedProcess) {
-        const result = []
-        result.push(selectedSystemCode)
-        result.push(selectedProcess.value)
-        this.selectedProcess = result
-      }
-    },
-    // 过滤流程
-    filterProcess(selectedProcessInfo) {
-      return (process) => {
-        // systemAndProcessInfo/流程编号/流程版本”
-        const systemAndProcessInfo = process.value
-        // 获得“流程编号/流程版本”
-        const processInfo = systemAndProcessInfo.substring(systemAndProcessInfo.indexOf('/') + 1)
-        return (selectedProcessInfo === processInfo)
-      }
-    },
-    validateId() {
-      validateTacheCode(this)
-    },
-    setI18nValue(i18nKey) {
-      this.formModel.tache.i18nKey = i18nKey
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-
-</style>

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

@@ -1,26 +0,0 @@
-<template>
-  <el-form>
-    <el-form-item :label="$t('workflowEditor.process.eventsTriggeredBeforeStartingASubprocess')" label-width="150px">
-      <el-switch v-model="model.beforeStart" />
-    </el-form-item>
-    <el-form-item :label="$t('workflowEditor.process.triggerSubprocessEndEvent')">
-      <el-switch v-model="model.end" />
-    </el-form-item>
-  </el-form>
-</template>
-
-<script>
-export default {
-  name: 'Events',
-  props: {
-    model: {
-      type: Object,
-      default: null
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-
-</style>

package/packages/workflow-editor/src/properties-editors/subprocess/field-mappings.vue

@@ -1,206 +0,0 @@
-<template>
-  <div>
-    <el-row>
-      <el-button type="primary" size="mini" plain icon="el-icon-circle-plus-outline" @click="add">
-        {{ $t('workflowEditorPublicModel.add') }}
-      </el-button>
-      <el-button type="primary" size="mini" plain icon="el-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="source"
-        :label="srcLabel"
-      >
-        <template slot-scope="scope">
-          <el-input :value="showSourceFieldLabel(scope.row.source)" :placeholder="$t('workflowEditorMessage.pleaseSelect')" @focus="showSourceFields = true" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        prop="target"
-        :label="targetLabel"
-      >
-        <template slot-scope="scope">
-          <el-input :value="showTargetFieldLabel(scope.row.target)" :placeholder="$t('workflowEditorMessage.pleaseSelect')" @focus="showTargetFields=true" />
-        </template>
-      </el-table-column>
-    </el-table>
-    <form-fields v-if="showSourceFields||showTargetFields" :fields="formFields" @close="selectField" />
-  </div>
-</template>
-<script>
-import FormFields from '../common/form-fields'
-import { getFormFieldLabel } from '../common/form-fields-utils.js'
-export default {
-  name: 'FieldMappings',
-  components: {
-    FormFields
-  },
-  props: {
-    value: {
-      type: Object,
-      default: null
-    },
-    srcLabel: {
-      type: String,
-      default: null
-    },
-    targetLabel: {
-      type: String,
-      default: null
-    },
-    srcFields: {
-      type: Array,
-      default: null
-    },
-    targetFields: {
-      type: Array,
-      default: null
-    }
-  },
-  data() {
-    let tableData = []
-    if (this.value.field !== undefined) {
-      // xml中有多个field时是数组，只有一个field时是Object
-      if (Array.isArray(this.value.field)) {
-        tableData = this.value.field
-      } else {
-        tableData.push(this.value.field)
-      }
-    }
-    return {
-      tableData,
-      currentRow: null,
-      showSourceFields: false,
-      showTargetFields: false
-    }
-  },
-  computed: {
-    formFields() {
-      if (this.showSourceFields) {
-        return this.srcFields
-      } else if (this.showTargetFields) {
-        return this.targetFields
-      } else {
-        return []
-      }
-    }
-  },
-  watch: {
-
-  },
-  mounted() {
-    if (this.tableData.length > 0) {
-      this.setCurrentRow(this.tableData[0])
-    }
-    this.$watch('tableData', function() {
-      const filteredData = this.tableData.filter(field => {
-        return field.source !== '' && field.target !== ''
-      })
-      this.$emit('input', {
-        field: filteredData
-      })
-    }, {
-      // deep为true可以监控数组中的元素的某个属性的变化
-      deep: true
-    })
-  },
-  methods: {
-    getSubFormFieldLabel(name) {
-      const fields = this.srcFields || this.targetFields
-      const field = fields.filter(item => {
-        return item.name === name
-      })
-      if (field.length > 0) {
-        return field[0].label
-      } else {
-        return name
-      }
-    },
-    showSourceFieldLabel(value) {
-      if (this.srcFields) {
-        return this.getSubFormFieldLabel(value)
-      } else {
-        return getFormFieldLabel(value)
-      }
-    },
-    showTargetFieldLabel(value) {
-      if (this.targetFields) {
-        return this.getSubFormFieldLabel(value)
-      } else {
-        return getFormFieldLabel(value)
-      }
-    },
-    add() {
-      for (let i = 0; i < this.tableData.length; i++) {
-        if (this.tableData[i].source === '' || this.tableData[i].target === '') {
-          this.$alert(this.$t('workflowEditorMessage.dataInLineCannotBeEmpty', { row: (i + 1), data1: this.srcLabel, data2: this.targetLabel }))
-          return
-        }
-      }
-      const newRow = {
-        source: '',
-        target: ''
-      }
-      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].source === this.currentRow.source) {
-          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
-    },
-    checkSource(name) {
-      if (name === '') {
-        this.$alert(this.$t('workflowEditorMessage.dataCannotBeEmpty', { data: this.srcLabel }))
-      }
-    },
-    checkTarget(value) {
-      if (value === '') {
-        this.$alert(this.$t('workflowEditorMessage.dataCannotBeEmpty', { data: this.targetLabel }))
-      }
-    },
-    selectField(field) {
-      if (this.showSourceFields) {
-        this.$set(this.currentRow, 'source', field)
-        this.showSourceFields = false
-      }
-      if (this.showTargetFields) {
-        this.$set(this.currentRow, 'target', field)
-        this.showTargetFields = false
-      }
-      console.log('this.tableData===', this.tableData, 'this.srcFields===', this.srcFields, 'this.targetFields===', this.targetFields)
-    }
-  }
-}
-</script>

package/packages/workflow-editor/src/properties-editors/subprocess/transactor-settings.vue

@@ -1,64 +0,0 @@
-<template>
-  <div>
-    <el-row>
-      {{ $t('workflowEditor.process.setTheHandlerOfTheFirstPhaseOfTheSubProcess') }}<el-switch v-model="model.showTransactorSettings" />
-    </el-row>
-
-    <transactor-settings v-if="model.showTransactorSettings" :is-subprocess="true" :model="model.transactorSettings" />
-  </div>
-</template>
-
-<script>
-import TransactorSettings from '../common/transactor-settings'
-import { deepCopy } from '../../util.js'
-export default {
-  name: 'SubprocessTransactorSettings',
-  components: {
-    TransactorSettings
-  },
-  props: {
-    value: {
-      type: Object,
-      default: null
-    }
-  },
-  data() {
-    let showTransactorSettings = false
-    if (this.value.userCondition) {
-      showTransactorSettings = true
-    }
-    let transactorSettings = deepCopy(this.value)
-    if (!transactorSettings.userCondition) {
-      transactorSettings = {
-        userCondition: '${instanceCreator}',
-        additionalCondition: {
-          onlyInCreatorDepartment: false,
-          withCreatorDepartment: false,
-          selectOneFromMultiple: false
-        }
-      }
-    }
-    return {
-      model: {
-        showTransactorSettings,
-        transactorSettings
-      }
-    }
-  },
-  mounted() {
-    this.$watch('model', function(model) {
-      if (model.showTransactorSettings) {
-        this.$emit('input', model.transactorSettings)
-      } else {
-        this.$emit('input', {})
-      }
-    }, {
-      deep: true
-    })
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-
-</style>

package/packages/workflow-editor/src/properties-editors/subprocess.vue

@@ -1,79 +0,0 @@
-<template>
-  <el-dialog
-    visible
-    :title="$t('workflowEditor.process.propertiesOfSubprocesses')"
-    :center="true"
-    top="10vh"
-    append-to-body
-    custom-class="properties-editor"
-    @open="$emit('open')"
-    @opend="$emit('opend')"
-    @close="$emit('close')"
-    @closed="$emit('closed')"
-  >
-    <el-tabs v-model="activeTab" type="border-card" @tab-click="handleClick">
-      <el-tab-pane :label="$t('workflowEditor.process.basicProperties')" name="basicProperties">
-        <basic-properties
-          :id.sync="model.ref.attr.id"
-          :name.sync="model.ref.attr.name"
-          :model="model.ref"
-        />
-      </el-tab-pane>
-      <el-tab-pane :label="$t('workflowEditor.process.settingOfHandler')" name="transactors">
-        <subprocess-transactor-settings v-model="model.ref.transactorSettings" />
-      </el-tab-pane>
-      <el-tab-pane :label="$t('workflowEditor.process.eventProcessing')" name="events">
-        <events :model="model.ref.events" />
-      </el-tab-pane>
-    </el-tabs>
-  </el-dialog>
-</template>
-<script>
-import BasicProperties from './subprocess/basic-properties'
-import Events from './subprocess/events'
-import SubprocessTransactorSettings from './subprocess/transactor-settings'
-export default {
-  name: 'SubprocessPropertiesEditor',
-  components: {
-    BasicProperties,
-    SubprocessTransactorSettings,
-    Events
-  },
-  props: {
-    model: {
-      type: Object,
-      default: null
-    }
-  },
-  data() {
-    return {
-      activeTab: 'basicProperties'
-    }
-  },
-  computed: {
-    formModel() {
-      return this.model.ref
-    }
-  },
-  mounted() {
-    this.$watch('model.ref.attr.id', function(newVal, oldVal) {
-      this.model.id = newVal
-    })
-    this.$watch('model.ref.attr.name', function(newVal, oldVal) {
-      this.model.name = newVal
-    })
-  },
-  methods: {
-    handleClick(tab, event) {
-      // console.log('this.model=', this.model)
-    }
-  }
-}
-</script>
-<style scoped>
-/* 使用深度作用选择器（vue-loader的功能）">>>"符号重新定义了.el-dialog__body，不影响其他页面的同名样式*/
-.properties-editor :deep(.el-dialog__body){
-  padding-top: 0
-}
-</style>
-