init

2024-03-04 19:13:43 +08:00
commit e44edd71c0
350 changed files with 52288 additions and 0 deletions
--- a/src/views/workflow/process/config/ConditionNodeConfig.vue
+++ b/src/views/workflow/process/config/ConditionNodeConfig.vue
@@ -0,0 +1,141 @@
+<template>
+  <el-form inline label-width="100px">
+    <el-form-item label="调整优先级" prop="level">
+      <el-popover placement="right" title="拖拽条件调整优先级顺序" width="250" trigger="click">
+        <draggable style="width: 100%; min-height:25px" :list="prioritySortList" group="from"
+                   @end="onEnd"
+                   :options="sortOption">
+          <template #item="{ index,element }">
+            <div :class="{'drag-no-choose': true, 'drag-hover': element.id === selectedNode.id}">
+              <ellipsis style="width: 80px;" hover-tip :content="element.name"/>
+                          <div>优先级 {{ index + 1 }}</div>
+            </div>
+          </template>
+        </draggable>
+
+        <template #reference>
+          <el-button slot="reference">第{{ nowNodeLeave + 1 }}级</el-button>
+        </template>
+      </el-popover>
+    </el-form-item>
+    <el-form-item label="条件组关系" label-width="150px">
+      <el-switch v-model="selectedNode.props.groupsType" active-color="#409EFF"
+                 inactive-color="#c1c1c1" active-value="AND" inactive-value="OR"
+                 active-text="且" inactive-text="或">
+      </el-switch>
+    </el-form-item>
+    <el-form-item label="条件组表达式">
+      <el-input v-model="config.expression" placeholder="输入条件组关系表达式  &为与，|为或"/>
+      <span class="item-desc">使用表达式构建复杂逻辑，例如: (A & B) | C</span>
+    </el-form-item>
+  </el-form>
+  <div>
+    <el-button type="primary" icon="Plus" style="margin: 0 15px 15px 0" round
+               @click="addConditionGroup">
+              添加条件组
+    </el-button>
+    <span class="item-desc">只有必填选项才能作为审批条件</span>
+  </div>
+  <group-item/>
+</template>
+
+<script setup>
+import draggable from 'vuedraggable';
+import Ellipsis from '../common/Ellipsis.vue'
+import {computed, defineProps, ref,defineEmits} from 'vue'
+import {useProcessStore} from '@/stores/processStore.js'
+const emit = defineEmits()
+
+const processStore = useProcessStore()
+import GroupItem from "./ConditionGroupItemConfig.vue"
+
+const props = defineProps({
+  config: {
+    type: Object,
+    default: {}
+  }
+})
+
+const sortOption = reactive({
+  animation: 300,
+  chosenClass: 'choose',
+  scroll: true,
+  sort: true
+})
+
+const selectedNode = computed(() => {
+  //当前选择的节点
+  return processStore.getSelectedNode()
+})
+
+
+//条件节点
+const prioritySortList = computed(() => {
+  let node = processStore.nodeMap.get(processStore.getSelectedNode().parentId)
+  if (node) {
+    return node.branchs || []
+  }
+  return []
+})
+
+const nowNodeLeave = computed(() => {
+  let node = processStore.nodeMap.get(processStore.getSelectedNode().parentId)
+  let list = []
+  if (node) {
+    list = node.branchs || []
+  }
+  return list.indexOf(processStore.getSelectedNode())
+})
+
+
+const onEnd = () => {
+  emit('initRender')
+}
+const addConditionGroup = (select) => {
+  props.config.groups.push({
+    cids: [],
+    groupType: "OR",
+    conditions: []
+  })
+}
+
+
+// const selected = (select) => {
+//   select.forEach(val => processStore.addAssignedUser(val))
+// }
+
+
+</script>
+
+<style lang="scss" scoped>
+.choose {
+  border-radius: 5px;
+  margin-top: 2px;
+  background: #f4f4f4;
+  border: 1px dashed #1890FF !important;
+}
+
+.drag-hover {
+  color: #1890FF
+}
+
+.drag-no-choose {
+  cursor: move;
+  background: #f8f8f8;
+  border-radius: 5px;
+  margin: 5px 0;
+  height: 25px;
+  line-height: 25px;
+  padding: 5px 10px;
+  border: 1px solid #ffffff;
+
+  div {
+    display: inline-block;
+    font-size: small !important;
+  }
+
+  div:nth-child(2) {
+    float: right !important;
+  }
+}
+</style>