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

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

@@ -0,0 +1,81 @@
+<template>
+  <div>
+    <el-form-item :label="label">
+      <el-checkbox-group v-model="tools">
+        <el-checkbox label="mail">
+          {{ $t('workflowEditorPublicModel.mail') }}
+        </el-checkbox>
+        <!-- <el-checkbox label="sms">
+        {{ $t('workflowEditorPublicModel.message') }}
+      </el-checkbox>
+      <el-checkbox label="app">
+        {{ $t('workflowEditorPublicModel.App') }}
+      </el-checkbox>
+      <el-checkbox label="dingding">
+        {{ $t('workflowEditorPublicModel.dingding') }}
+      </el-checkbox> -->
+        <el-checkbox label="DINGDING">
+          {{ $t('workflowEditorPublicModel.dingding') }}
+        </el-checkbox>
+        <el-checkbox label="QIWEI">
+          {{ $t('workflowEditorPublicModel.qiwei') }}
+        </el-checkbox>
+        <el-checkbox label="FEISHU">
+          {{ $t('workflowEditorPublicModel.feishu') }}
+        </el-checkbox>
+        <el-checkbox label="custom">
+          {{ $t('workflowEditorPublicModel.custom') }}
+        </el-checkbox>
+      </el-checkbox-group>
+    </el-form-item>
+    <el-form-item
+      label-width="110"
+      v-if="tools.indexOf('custom') >= 0"
+      :label="$t('workflowEditor.common.customMsg')"
+    >
+      <el-input v-model="myCustomMsg" />
+    </el-form-item>
+  </div>
+</template>
+<script>
+export default {
+  name: 'CommonNoticeTool',
+  props: {
+    label: {
+      type: String,
+      default: null
+    },
+    modelValue: {
+      type: String,
+      default: null
+    },
+    customMsg: {
+      type: String,
+      default: null
+    }
+  },
+  data() {
+    let tools = []
+    if (this.modelValue && this.modelValue !== '' && this.modelValue !== null) {
+      tools = this.modelValue.split(',')
+    }
+    let myCustomMsg = ''
+    if (this.customMsg && this.customMsg !== '' && this.customMsg !== null) {
+      myCustomMsg = this.customMsg
+    }
+    return {
+      tools,
+      myCustomMsg
+    }
+  },
+  watch: {
+    tools(val) {
+      // this.$emit('input', this.tools.join(','))
+      this.$emit('update:modelValue', this.tools.join(','))
+    },
+    myCustomMsg(val) {
+      this.$emit('input-msg', this.myCustomMsg)
+    }
+  }
+}
+</script>

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

@@ -0,0 +1,242 @@
+<template>
+  <div>
+    <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="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 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.type')" width="110">
+        <template v-slot="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 v-slot="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 v-slot="scope">
+          <el-input :value="format(scope.row.value)" readonly @click="openValueDialog(scope.row)" />
+        </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="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: {
+    modelValue: {
+      type: String,
+      default: null
+    },
+    usedIn: {
+      type: String,
+      default: 'reminder'
+    }
+  },
+  data() {
+    const users = []
+    let count = 0
+    if (this.modelValue && this.modelValue !== '') {
+      count = parseCondition(users, this.modelValue)
+    }
+
+    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))
+      this.$emit('update:modelValue', 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.indexOf('${deptField[') >= 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,117 @@
+<template>
+  <el-dialog
+    width="60%"
+    :title="$t('workflowEditor.common.selectFormField')"
+    v-model="dialogVisible"
+    center
+    top="5vh"
+    append-to-body
+    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>
+
+    <template #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>
+    </template>
+  </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: '',
+      dialogVisible: true
+    }
+  },
+  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,88 @@
+<template>
+  <span>
+    <div style="float: left;padding-right: 5px;">
+      <el-input v-model="zh">
+        <template #append>
+          <i class="fa fa-cog" @click="i18nSet"></i>
+        </template>
+      </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: {
+    modelValue: {
+      type: String,
+      default: ''
+    },
+    // 国际化key应为：'processName（流程名称）' 或 'name.tacheId、name.transitionId(环节名称、流向名称)'
+    i18nKey: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    const zh = this.modelValue
+    const myI18nKey = this.i18nKey
+    return {
+      isShowI18n: false,
+      myI18nKey,
+      zh,
+      isNewI18n: false
+    }
+  },
+  computed: {
+    ...mapGetters('wfEditor', [
+      'processCode',
+      'isHandleCreate'
+    ])
+  },
+  mounted() {
+    this.$watch('zh', function(newVal) {
+      // this.$emit('input', newVal)
+      this.$emit('update:modelValue', newVal)
+    })
+  },
+  created() {
+    if(this.isHandleCreate && this.isHandleCreate==='true') {
+      this.isNewI18n = false
+    } else {
+      this.isNewI18n = true
+    }
+    if(this.isNewI18n){
+      this.myI18nKey = this.modelValue
+    }
+  },
+  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,143 @@
+<template>
+  <el-dialog
+    v-if="isShow"
+    :close-on-click-modal="false"
+    width="30%"
+    :title="$t('workflowEditorPublicModel.i18nSet')"
+    append-to-body
+    model-value
+    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: {},
+      dialogVisible: true,
+      isNewI18n: false
+    }
+  },
+  computed: {
+    ...mapGetters('wfEditor', [
+      'systemCode',
+      'processCode',
+      'isHandleCreate'
+    ])
+  },
+  created() {
+    if(this.isHandleCreate && this.isHandleCreate==='true') {
+      this.isNewI18n = false
+    } else {
+      this.isNewI18n = true
+    }
+    if(!this.isNewI18n){
+      // 是原国际化配置
+      this.bundleCode = this.systemCode + '.workflow.' + this.processCode
+    }
+    this.getI18nSet()
+  },
+  methods: {
+    getI18nSet() {
+      this.$http.get(this.baseAPI + '/wf-editor/i18n-settings/languages?isNewI18n='+this.isNewI18n).then((languages) => {
+        const param = {
+          bundleCode: this.bundleCode,
+          i18nKey: this.i18nModel.key,
+          isNewI18n: this.isNewI18n+'',
+          systemCode: this.systemCode
+        }
+        this.$http.post(this.baseAPI + '/wf-editor/i18n-settings/get-info', param).then((data) => {
+          this.languages = languages
+          Object.keys(this.languages).forEach(language => {
+						console.log('%c描述-162040','color:#2E3435;background:#F8BB07;padding:3px;border-radius:2px',language);
+						console.log('%c描述-162049','color:#2E3435;background:#F8BB07;padding:3px;border-radius:2px',this.i18nModel);
+            if (data && data[language]) {
+              this.i18nModel.values[language] = data[language]
+              // this.$set(this.i18nModel.values, language, data[language])
+            } else if (!this.i18nModel.values[language]) {
+              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.isNewI18n = this.isNewI18n+''
+          // 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>