workflow-editor 0.9.84-dw-tmp2 → 0.9.84-dw-tmp3

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

@@ -0,0 +1,241 @@
+<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-arrow-right" @click="insert">
+        {{ $t('workflowEditorPublicModel.insert') }}
+      </el-button>
+      <!-- <el-button type="primary" size="mini" plain @click="modify">
+        修改
+      </el-button> -->
+      <el-button type="primary" size="mini" plain icon="el-icon-delete" @click="remove">
+        {{ $t('workflowEditorPublicModel.delete') }}
+      </el-button>
+      <el-button type="primary" size="mini" plain icon="el-icon-view" @click="view">
+        {{ $t('workflowEditorPublicModel.viewConditions') }}
+      </el-button>
+    </el-row>
+    <el-table
+      ref="table"
+      :data="users"
+      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 slot-scope="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.type')" width="110">
+        <template slot-scope="scope">
+          <el-select v-model="scope.row.key" placeholder="" @focus="selectRow(scope.row)" @change="handleKeyChange">
+            <el-option :label="$t('workflowEditor.common.user')" value="${user}" />
+            <el-option :label="$t('workflowEditor.common.role')" value="${role}" />
+            <el-option :label="$t('workflowEditor.common.department')" value="${department}" />
+            <el-option :label="$t('workflowEditor.common.workgroup')" value="${workgroup}" />
+          </el-select>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('workflowEditor.common.operator')" width="110">
+        <template slot-scope="scope">
+          <el-select v-model="scope.row.operator" placeholder="" @focus="selectRow(scope.row)">
+            <el-option :label="$t('workflowEditor.process.beEqualTo')" value="operator.text.eq" />
+            <el-option :label="$t('workflowEditor.process.notEqualTo')" value="operator.text.neq" />
+          </el-select>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('workflowEditor.common.value')">
+        <template slot-scope="scope">
+          <el-input :value="format(scope.row.value)" readonly @focus="openValueDialog(scope.row)" />
+        </template>
+      </el-table-column>
+      <el-table-column prop="rightBracket" label=")" width="90" @focus="selectRow(scope.row)">
+        <template slot-scope="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 slot-scope="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="showValueDialog" :standard-fields="standardFields" :org-type="currentRow.key.substring(currentRow.key.indexOf('{')+1,currentRow.key.lastIndexOf('}'))" @close="closeValueDialog" />
+  </div>
+</template>
+<script>
+import ValueSelectionDialog from './value-selection-dialog'
+import { userStandardFieldsForReminder, userStandardFieldsForTransactor, departmentStandardFieldsForReminder, departmentStandardFieldsForTransactor, workgroupStandardFieldsForReminder, workgroupStandardFieldsForTransactor } from '../user-condition'
+import { formatStandardValue, parseCondition, generateUserCondition, displayUserCondition } from '../user-condition'
+import { getFormFieldLabel } from './form-fields-utils.js'
+export default {
+  name: 'CommonUserCondition',
+  components: {
+    ValueSelectionDialog
+  },
+  props: {
+    value: {
+      type: String,
+      default: null
+    },
+    usedIn: {
+      type: String,
+      default: 'reminder'
+    }
+  },
+  data() {
+    const users = []
+    let count = 0
+    if (this.value && this.value !== '') {
+      count = parseCondition(users, this.value)
+    }
+
+    return {
+      users,
+      count: count,
+      currentRow: null,
+      showValueDialog: false
+    }
+  },
+  computed: {
+    standardFields() {
+      let standardFields = this.usedIn === 'reminder' ? userStandardFieldsForReminder : userStandardFieldsForTransactor
+      if (this.currentRow.key === '${department}') {
+        standardFields = this.usedIn === 'reminder' ? departmentStandardFieldsForReminder : departmentStandardFieldsForTransactor
+      } else if (this.currentRow.key === '${workgroup}') {
+        standardFields = this.usedIn === 'reminder' ? workgroupStandardFieldsForReminder : workgroupStandardFieldsForTransactor
+      } else if (this.currentRow.key === '${role}') {
+        standardFields = {}
+      }
+      return standardFields
+    }
+  },
+  mounted() {
+    if (this.users.length > 0) {
+      this.$refs.table.setCurrentRow(this.users[this.users.length - 1])
+    }
+    this.$watch('users', function(newVal, oldVal) {
+      this.$emit('input', generateUserCondition(this.users))
+    }, {
+      deep: true
+    })
+  },
+  methods: {
+    format(value) {
+      if (value.indexOf('${field[') >= 0) {
+        return getFormFieldLabel(value)
+      } else if (value.indexOf('${') >= 0) {
+        return formatStandardValue(value)
+      } else {
+        // value为管理员[admin]的形式，不应该包括单引号或双引号
+        return value.substring(0, value.indexOf('['))
+      }
+    },
+    selectRow(row) {
+      this.$refs.table.setCurrentRow(row)
+    },
+    openValueDialog(row) {
+      this.showValueDialog = true
+      this.selectRow(row)
+    },
+    closeValueDialog(selectedValue) {
+      console.log(selectedValue)
+      if (selectedValue !== undefined && selectedValue !== '') {
+        this.currentRow.value = selectedValue
+      }
+      this.showValueDialog = false
+    },
+    getCondition(row) {
+      return row.key + ' ' + row.operator + ' ' + row.value
+    },
+    handleCurrentChange(val) {
+      this.currentRow = val
+    },
+    getRowIndex(row) {
+      for (let i = 0; i < this.users.length; i++) {
+        if (this.users[i].id === row.id) {
+          return i
+        }
+      }
+      return -1
+    },
+    add() {
+      const newRow = {
+        id: this.count,
+        leftBracket: '',
+        key: '${user}',
+        operator: 'operator.text.eq',
+        value: '',
+        rightBracket: '',
+        logicOperator: 'condition.operator.or'
+      }
+      this.users.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: '${user}',
+        operator: 'operator.text.eq',
+        value: '',
+        rightBracket: '',
+        logicOperator: 'condition.operator.or'
+      }
+      this.users.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.users.splice(index, 1)
+      if (this.users.length > 0) {
+        index = (index <= (this.users.length - 1) ? index : (this.users.length - 1))
+        this.$refs.table.setCurrentRow(this.users[index])
+      }
+    },
+    view() {
+      let result = displayUserCondition(this.users)
+      if (result === '') {
+        result = this.$t('workflowEditorMessage.conditionsHaveNotBeenSet')
+      }
+      this.$confirm(result, this.$t('workflowEditorPublicModel.viewConditions'), {
+        showConfirmButton: false,
+        showCancelButton: false,
+        // 增加这个空的回退函数防止报错
+        callback: function() {}
+      })
+    },
+    handleKeyChange(val) {
+      this.currentRow.value = ''
+    }
+  }
+}
+</script>

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

@@ -0,0 +1,23 @@
+export function getFormFieldLabel(name) {
+  const field = getFormField(name)
+  return field ? field.label : name
+}
+
+export function getFormField(name) {
+  const fields = window.$store.getters['wfEditor/formFields']
+  // name可以是code或者${field[code]}两种形式
+  if (name && name.indexOf('${field[') >= 0) {
+    name = name.substring(name.indexOf('[') + 1, name.lastIndexOf(']'))
+  }
+  const field = fields.filter(item => {
+    return item.name === name
+  })
+  if (field.length > 0) {
+    return field[0]
+  } else {
+    return null
+  }
+}
+export function getFormFields() {
+
+}

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

@@ -0,0 +1,116 @@
+<template>
+  <el-dialog
+    width="60%"
+    :title="$t('workflowEditor.common.selectFormField')"
+    visible
+    center
+    top="5vh"
+    append-to-body
+    custom-class="properties-editor-noTab"
+    @close="$emit('close')"
+  >
+    <div style="padding-bottom:10px">
+      <span style="float:left;width:70%">
+        <el-input v-model="searchFormCode" :placeholder="$t('workflowEditorMessage.pleaseEnterTheNameOrCode')" />
+      </span>
+      <span>
+        <el-button style="margin-left:10px" type="primary" @click="searchForm">
+          {{ $t('workflowEditorPublicModel.search') }}
+        </el-button>
+      </span>
+    </div>
+    <div class="item-content">
+      <el-radio-group v-model="selectedField" class="group">
+        <ul>
+          <li v-for="field in showFields" :key="field.name" class="item">
+            <el-radio :label="field.name">
+              {{ field.label }}
+            </el-radio>
+          </li>
+        </ul>
+      </el-radio-group>
+    </div>
+
+    <span slot="footer" class="dialog-footer">
+      <el-button type="primary" size="small" @click="setField">
+        {{ $t('workflowEditorPublicModel.determine') }}
+      </el-button>
+      <el-button size="small" @click="$emit('close')">
+        {{ $t('workflowEditorPublicModel.cancel') }}
+      </el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+export default {
+  name: 'FormFields',
+  props: {
+    fields: {
+      type: Array,
+      default: null
+    }
+  },
+  data() {
+    return {
+      selectedField: null,
+      copyShowFields: [],
+      showFields: [],
+      searchFormCode: ''
+    }
+  },
+  computed: {
+    ...mapGetters('wfEditor', [
+      'formFields'
+    ]),
+    allFields() {
+      // 显示传递进来的字段或者取vuex中缓存的表单字段
+      if (this.fields) {
+        return this.fields
+      } else {
+        return this.formFields
+      }
+    }
+  },
+  mounted() {
+    this.copyAllFields = this.allFields
+    this.showFields = this.allFields
+  },
+  methods: {
+    setField() {
+      this.$emit('close', this.selectedField)
+    },
+    searchForm() {
+      if (this.searchFormCode && this.searchFormCode !== '') {
+        this.showFields = this.copyAllFields.filter(item => {
+          return item.name.indexOf(this.searchFormCode) > -1 || item.label.indexOf(this.searchFormCode) > -1
+        })
+      } else {
+        this.showFields = this.copyAllFields
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .group {
+    font-size: 14px;
+    width:100%;
+  }
+
+  .item {
+    float: left;
+    list-style-type:none;
+    width: 33.33%;
+    margin-bottom: 18px
+  }
+
+  .item-content {
+    height: calc(100vh - 300px);;
+    padding-left: 20px;
+    overflow: auto
+  }
+
+</style>

package/packages/workflow-editor/src/properties-editors/common/i18n-input.vue

@@ -0,0 +1,75 @@
+<template>
+  <span>
+    <div style="float: left;padding-right: 5px;">
+      <el-input v-model="zh">
+        <i slot="append" class="el-icon-setting" @click="i18nSet" />
+      </el-input>
+    </div>
+    <i18n-set v-if="isShowI18n" :value="{values:{zh_CN: zh}, key: myI18nKey}" @close="closeI18nSet" />
+  </span>
+</template>
+<script>
+import I18nSet from './i18n-set-dialog'
+import { mapGetters } from 'vuex'
+export default {
+  name: 'I18nInput',
+  components: {
+    I18nSet
+  },
+  model: {
+    prop: 'value',
+    event: 'input'
+  },
+  props: {
+    value: {
+      type: String,
+      default: ''
+    },
+    // 国际化key应为：'processName（流程名称）' 或 'name.tacheId、name.transitionId(环节名称、流向名称)'
+    i18nKey: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    const zh = this.value
+    const myI18nKey = this.i18nKey
+    return {
+      isShowI18n: false,
+      myI18nKey,
+      zh
+    }
+  },
+  computed: {
+    ...mapGetters('wfEditor', [
+      'processCode'
+    ])
+  },
+  mounted() {
+    this.$watch('zh', function(newVal) {
+      this.$emit('input', newVal)
+    })
+  },
+  created() {
+  },
+  methods: {
+    i18nSet() {
+      if (this.myI18nKey) {
+        this.isShowI18n = true
+      } else {
+        this.$message({
+          showClose: true,
+          type: 'warning',
+          message: this.$t('workflowEditorMessage.pleaseInputCode')
+        })
+      }
+    },
+    closeI18nSet(i18nSet) {
+      if (i18nSet) {
+        this.$emit('setI18n', i18nSet)
+      }
+      this.isShowI18n = false
+    }
+  }
+}
+</script>

package/packages/workflow-editor/src/properties-editors/common/i18n-set-dialog.vue

@@ -0,0 +1,125 @@
+<template>
+  <el-dialog
+    v-if="isShow"
+    :close-on-click-modal="false"
+    width="30%"
+    :title="$t('workflowEditorPublicModel.i18nSet')"
+    append-to-body
+    visible
+    top="5vh"
+    @open="$emit('open')"
+    @opend="$emit('opend')"
+    @close="$emit('close')"
+    @closed="$emit('closed')"
+  >
+    <div class="operation-area">
+      <el-button type="primary" size="small" @click="saveI18nSet('form')">
+        {{ $t('workflowEditorPublicModel.determine') }}
+      </el-button>
+      <el-button size="small" @click="goBack">
+        {{ $t('workflowEditorPublicModel.return') }}
+      </el-button>
+    </div>
+    <el-form ref="form" :model="i18nModel" label-width="100px">
+      <el-row>
+        <el-col :span="24">
+          <el-form-item :label="$t('workflowEditorPublicModel.i18nKey')" prop="key" :rules="[requiredRule]">
+            <el-input v-model="i18nModel.key" style="width:80%" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row v-for="language in Object.keys(languages)" :key="language">
+        <el-col :span="24">
+          <el-form-item :label="languages[language]" :prop="language">
+            <el-input v-model="i18nModel.values[language]" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+  </el-dialog>
+</template>
+<script>
+import { getI18n } from '../../../../workflow-editor/src/util'
+import { mapGetters } from 'vuex'
+export default {
+  name: 'I18nSet',
+  props: {
+    value: {
+      type: Object,
+      default: null
+    }
+  },
+  data() {
+    let i18nModel = {}
+    if (this.value) {
+      i18nModel = JSON.parse(JSON.stringify(this.value))
+    }
+    return {
+      requiredRule: {
+        required: true,
+        message: getI18n().t('workflowEditor.process.cannotBeEmpty'),
+        trigger: 'blur'
+      },
+      i18nModel,
+      bundleCode: null,
+      isShow: false,
+      i18nKey: null,
+      languages: {}
+    }
+  },
+  computed: {
+    ...mapGetters('wfEditor', [
+      'systemCode',
+      'processCode'
+    ])
+  },
+  created() {
+    this.bundleCode = this.systemCode + '.workflow.' + this.processCode
+    this.getI18nSet()
+  },
+  methods: {
+    getI18nSet() {
+      this.$http.get(this.baseAPI + '/wf-editor/i18n-settings/languages').then((languages) => {
+        const param = {
+          bundleCode: this.bundleCode,
+          i18nKey: this.i18nModel.key
+        }
+        this.$http.post(this.baseAPI + '/wf-editor/i18n-settings/get-info', param).then((data) => {
+          this.languages = languages
+          Object.keys(this.languages).forEach(language => {
+            if (data && data[language]) {
+              this.$set(this.i18nModel.values, language, data[language])
+            } else if (!this.i18nModel.values[language]) {
+              this.$set(this.i18nModel.values, language, '')
+            }
+          })
+          this.isShow = true
+        })
+      })
+    },
+    saveI18nSet(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          // alert('submit!')
+          // bundleCode：系统编码.workflow.processCode
+          this.i18nModel.bundleCode = this.bundleCode
+          this.i18nModel.systemCode = this.systemCode
+          // this.i18nModel.key应为：processName 或 name.环节编码
+          console.log('this.i18nModel---', this.i18nModel)
+          // this.$emit('close', this.i18nModel)
+          this.$http.post(this.baseAPI + '/wf-editor/i18n-settings', this.i18nModel).then(() => {
+            console.log('更新成功-----')
+            this.$emit('close', this.i18nModel.key)
+          })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    goBack() {
+      this.$emit('close')
+    }
+  }
+}
+</script>

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

@@ -0,0 +1,98 @@
+<template>
+  <el-form :model="model" label-width="80px">
+    <el-form-item :label="switchLabel" label-width="130">
+      <el-switch
+        v-model="showNotice"
+      />
+    </el-form-item>
+    <div v-if="showNotice">
+      <common-notice-tool v-model="model.informType" :label="$t('workflowEditor.common.notificationMethod')" />
+      <el-form-item v-if="model.informType && model.informType.length > 0 && model.informType.indexOf('mail') !== -1" :label="$t('workflowEditor.task.selectMailTemplate')">
+        <select-mail-templates v-model="model.noticeMailTemplateCode" @set-value="setMailTemplateCode" />
+      </el-form-item>
+      <user-selection v-model="model.userCondition" :label="$t('workflowEditor.common.addressee')" />
+      <el-form-item :label="$t('workflowEditor.common.theme')">
+        <el-input v-model="model.subject" :placeholder="$t('workflowEditorMessage.pleaseEnterASubject')" />
+      </el-form-item>
+      <el-form-item :label="$t('workflowEditor.common.content')">
+        <el-input
+          v-model="model.content"
+          type="textarea"
+          :autosize="{ minRows: 4, maxRows: 10}"
+          :placeholder="$t('workflowEditorMessage.pleaseEnterContent')"
+        />
+      </el-form-item>
+    </div>
+  </el-form>
+</template>
+<script>
+import UserSelection from './user-selection'
+import CommonNoticeTool from './common-notice-tool'
+import SelectMailTemplates from './select-mail-template.vue'
+export default {
+  name: 'Notice',
+  components: {
+    UserSelection,
+    CommonNoticeTool,
+    SelectMailTemplates
+  },
+  props: {
+    value: {
+      type: [Object, String],
+      default: null
+    },
+    switchLabel: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    let showNotice = false
+    let model = {
+      informType: '',
+      userCondition: '',
+      subject: null,
+      content: null
+    }
+    if (this.value !== null && this.value !== undefined && this.value !== '') {
+      model = this.value
+      if (model.informType && model.informType !== '') {
+        showNotice = true
+      }
+    }
+    return {
+      showNotice,
+      model,
+      options: {
+        showColumns: 'code,name'
+      }
+    }
+  },
+  watch: {
+    // showNotice发生变化时，需要改变流程的inform属性
+    showNotice(val) {
+      this.getValue()
+    }
+  },
+  created() {
+    // inform在xml中可能是没有的，所以不能直接使用inform作为model
+    // 通过deep监听model把设置的值返回给流程的inform属性
+    this.$watch('model', function(newVal, oldVal) {
+      this.getValue()
+    }, {
+      deep: true
+    })
+  },
+  methods: {
+    getValue() {
+      const notice = this.model
+      this.$emit('input', notice)
+    },
+    // 关闭选择邮件模板弹框
+    setMailTemplateCode(mailTemplateCode) {
+      this.model.noticeMailTemplateCode = mailTemplateCode
+    }
+  }
+}
+</script>
+