sohelp-eleplus 1.1.1-8.beta.1

package/sohelp-workflow/nodes/send.vue

@@ -0,0 +1,95 @@
+<template>
+  <div class="node-wrap">
+    <div class="node-wrap-box" @click="show" :class="[getStatus]">
+      <div class="title" style="background: #3296fa">
+        <el-icon class="icon"><Promotion /></el-icon>
+        <span>{{ nodeConfig.nodeName }}</span>
+      </div>
+      <div class="content">
+        <span v-if="toText(nodeConfig)">{{ toText(nodeConfig) }}</span>
+      </div>
+    </div>
+    <add-node v-model="nodeConfig.childNode"></add-node>
+  </div>
+</template>
+
+<script>
+  import addNode from './addNode.vue';
+
+  export default {
+    inject: ['select'],
+    props: {
+      modelValue: { type: Object, default: () => {} }
+    },
+    components: {
+      addNode
+    },
+    data() {
+      return {
+        nodeConfig: {},
+        drawer: false,
+        isEditTitle: false,
+        form: {}
+      };
+    },
+    watch: {
+      modelValue() {
+        this.nodeConfig = this.modelValue;
+      }
+    },
+    mounted() {
+      this.nodeConfig = this.modelValue;
+    },
+    computed: {
+      getStatus() {
+        if (!this.nodeConfig?.nodeAssigneeList?.length) {
+          return '';
+        }
+        return this.nodeConfig?.nodeAssigneeList[0]?.extendConfig?.type;
+      }
+    },
+    methods: {
+      show() {
+        this.form = {};
+        this.form = JSON.parse(JSON.stringify(this.nodeConfig));
+        this.drawer = true;
+      },
+      editTitle() {
+        this.isEditTitle = true;
+        this.$nextTick(() => {
+          this.$refs.nodeTitle.focus();
+        });
+      },
+      saveTitle() {
+        this.isEditTitle = false;
+      },
+      save() {
+        this.$emit('update:modelValue', this.form);
+        this.drawer = false;
+      },
+      delNode() {
+        this.$emit('update:modelValue', this.nodeConfig.childNode);
+      },
+      delUser(index) {
+        this.form.nodeAssigneeList.splice(index, 1);
+      },
+      selectHandle(type, data) {
+        this.select(type, data);
+      },
+      toText(nodeConfig) {
+        if (nodeConfig.nodeAssigneeList && nodeConfig.nodeAssigneeList.length > 0) {
+          const users = nodeConfig.nodeAssigneeList.map((item) => item.name).join('、');
+          return users;
+        } else {
+          if (nodeConfig.userSelectFlag) {
+            return '发起人自选';
+          } else {
+            return false;
+          }
+        }
+      }
+    }
+  };
+</script>
+
+<style></style>

package/sohelp-workflow-drawer/components/approval-modal.vue

@@ -0,0 +1,182 @@
+<template>
+  <ele-modal
+    :width="600"
+    :model-value="modelValue"
+    @update:modelValue="updateModelValue"
+    :title="titleMap[type]?.title"
+    :close-on-click-modal="false"
+    @open="open"
+    @close="close"
+  >
+    <ele-text>{{ titleMap[type]?.subTitle }}:</ele-text>
+    <sohelp-textarea-input :rows="3" v-model="approveForm.reason" :placeholder="请输入"></sohelp-textarea-input>
+    <ele-text style="margin-top: 10px" v-if="type!=='submit'">
+      推荐回复：
+      <span style="display: flex; gap: 5px 0; flex-wrap: wrap">
+        <el-tag
+          style="cursor: pointer"
+          v-for="item in quickText"
+          size="small"
+          :key="item"
+          @click="approveForm.reason = item"
+          >{{ item }}</el-tag
+        >
+      </span>
+    </ele-text>
+    <el-upload
+      class="pt-10"
+      ref="uploadRef"
+      name="files"
+      multiple
+      :auto-upload="false"
+      :on-change="uploadChange"
+      :on-remove="removeFile"
+    >
+      <ele-text>上传附件:</ele-text>
+      <el-button type="primary" :icon="Plus" plain size="small" class="ml-10"></el-button>
+    </el-upload>
+    <template #footer>
+      <el-button @click="close">取消</el-button>
+      <el-button type="primary" @click="save()" v-loading="loading">{{ titleMap[type]?.confirmText }}</el-button>
+    </template>
+  </ele-modal>
+</template>
+
+<script setup>
+  import { todoOperate } from '../js/index.js';
+  import { ElMessage } from 'element-plus';
+  import { Plus } from '@element-plus/icons-vue';
+  import { ref } from 'vue';
+  import { useFormData } from '@/utils/use-form-data';
+
+  const props = defineProps({
+    modelValue: Boolean,
+    type: String,
+    title: String,
+    subTitle: String,
+    confirmText: {
+      type: String,
+      default: '保存'
+    },
+    data: Object
+  });
+
+  const emit = defineEmits(['update:modelValue', 'confirm']);
+
+  const loading = ref(false);
+  const [approveForm, resetFields, assignFields] = useFormData({
+    reason: '',
+    files: [],
+    id: '',
+    refid: ''
+  });
+  const quickText = [
+    '同意',
+    '已阅',
+    '收到',
+    '已核对',
+    '合格',
+    '情况属实',
+    '确认',
+    '已复核',
+    '知悉',
+    '辛苦了',
+    '已安排'
+  ];
+
+  const titleMap = {
+    agree: {
+      title: '同意',
+      subTitle: '建议',
+      confirmText: '同意'
+    },
+    reject: {
+      title: '拒绝',
+      subTitle: '建议',
+      confirmText: '拒绝'
+    },
+    submit: {
+      title: '提交申请',
+      subTitle: '申请理由',
+      confirmText: '提交'
+    },
+    batchAgree: {
+      title: '批量同意',
+      subTitle: '建议',
+      confirmText: '同意'
+    },
+    batchReject: {
+      title: '批量拒绝',
+      subTitle: '建议',
+      confirmText: '同意'
+    }
+  };
+
+  /**
+   * 保存
+   */
+  const save = () => {
+    if (!props.data?.refid && !props.data.id) {
+      ElMessage.error('缺少参数refid,id');
+      return;
+    }
+    loading.value = true;
+    const formData = new FormData();
+    formData.append('reason', approveForm.reason || '');
+    formData.append('refid', props.data.refid);
+    formData.append('id', props.data.id);
+    approveForm.files?.forEach((item) => {
+      formData.append('files', item);
+    });
+
+
+    todoOperate(props.type, formData)
+      .then((msg) => {
+        loading.value = false;
+        ElMessage.success(msg);
+        emit('confirm');
+        close();
+      })
+      .catch((e) => {
+        loading.value = false;
+        ElMessage.error(e.message);
+      });
+  };
+
+  /**
+   * 上传文件
+   * @param file
+   * @param list
+   */
+  const uploadChange = (file, list) => {
+    approveForm.files = [...list.map((item) => item.raw)];
+  };
+
+  /**
+   * 删除文件
+   */
+  const removeFile = (file) => {
+    approveForm.files = approveForm.files.filter((item) => item.uid != file.uid);
+  };
+
+  /** 更新modelValue */
+  const updateModelValue = (value) => {
+    emit('update:modelValue', value);
+  };
+
+  /**
+   * 打开弹窗
+   */
+  const open = () => {
+    assignFields(props.data);
+  };
+
+  /**
+   * 关闭弹窗
+   */
+  const close = () => {
+    resetFields();
+    updateModelValue(false);
+  };
+</script>
+<style lang="scss" scoped></style>

package/sohelp-workflow-drawer/components/draw-box.vue

@@ -0,0 +1,141 @@
+<template>
+  <div
+    class="draw-box"
+    ref="container"
+    @mousemove="handleMove"
+    @mouseup="isDragging = false"
+    @wheel.prevent="handleZoom"
+    @mouseleave="resetCursor"
+  >
+    <div class="content" @mousedown="startDrag" :style="transformStyle">
+      <slot />
+    </div>
+    <!-- 缩放控件 -->
+    <el-slider
+      class="slider"
+      v-model="scale"
+      :min="0.5"
+      :max="2"
+      :step="0.1"
+      :vertical="true"
+      :format-tooltip="formatTooltip"
+      @change="handleSliderChange"
+    />
+  </div>
+</template>
+
+<script setup>
+  import { ref, computed, onUnmounted, onMounted } from 'vue';
+
+  const container = ref();
+  const position = ref({ x: 0, y: 0 });
+  const scale = ref(1);
+  const isDragging = ref(false);
+  const startPos = ref({ x: 0, y: 0 });
+  const rafId = ref(null);
+
+  onMounted(() => {
+    scale.value = 1;
+  });
+
+  const transformStyle = computed(() => ({
+    transform: `translate(${position.value.x}px, ${position.value.y}px) scale(${scale.value})`,
+    cursor: isDragging.value ? 'grabbing' : 'grab'
+  }));
+
+  function startDrag(e) {
+    isDragging.value = true;
+    startPos.value = { x: e.clientX - position.value.x, y: e.clientY - position.value.y };
+    cancelAnimationFrame(rafId.value);
+    container.value.style.cursor = 'grabbing';
+  }
+
+  function handleMove(e) {
+    if (!isDragging.value) return;
+    rafId.value = requestAnimationFrame(() => {
+      position.value = { x: e.clientX - startPos.value.x, y: e.clientY - startPos.value.y };
+    });
+  }
+
+  function resetCursor() {
+    isDragging.value = false;
+    container.value.style.cursor = 'auto';
+  }
+
+  function handleZoom(e) {
+    cancelAnimationFrame(rafId.value);
+    const rect = container.value.getBoundingClientRect();
+    const mouseX = e.clientX - rect.left;
+    const mouseY = e.clientY - rect.top;
+
+    const delta = e.deltaY > 0 ? -0.1 : 0.1;
+    const newScale = Math.max(0.5, Math.min(2, scale.value + delta));
+
+    position.value = {
+      x: mouseX - (mouseX - position.value.x) * (newScale / scale.value),
+      y: mouseY - (mouseY - position.value.y) * (newScale / scale.value)
+    };
+    scale.value = newScale;
+    container.value.style.cursor = delta > 0 ? 'zoom-in' : 'zoom-out';
+    setTimeout(resetCursor, 300);
+  }
+
+  function handleSliderChange(val) {
+    const rect = container.value.getBoundingClientRect();
+    const centerX = rect.width / 2;
+    const centerY = rect.height / 2;
+
+    position.value = {
+      x: centerX - (centerX - position.value.x) * (val / scale.value),
+      y: centerY - (centerY - position.value.y) * (val / scale.value)
+    };
+  }
+
+  function formatTooltip(val) {
+    return `${(val * 100).toFixed(0)}%`;
+  }
+
+  onUnmounted(() => {
+    cancelAnimationFrame(rafId.value);
+  });
+</script>
+
+<style scoped lang="scss">
+  .draw-box {
+    width: 100%;
+    height: calc(100% - 0px);
+    overflow: hidden;
+    position: relative;
+    background-color: #fefefe;
+    background-image: linear-gradient(rgba(0, 0, 0, 0.06) 1px, transparent 1px),
+      linear-gradient(90deg, rgba(0, 0, 0, 0.06) 1px, transparent 1px);
+    background-size: 10px 10px;
+    box-sizing: border-box;
+    border: 1px solid #ddd;
+  }
+
+  .content {
+    transform-origin: 0 0;
+    display: inline-block;
+    will-change: transform;
+  }
+
+  .slider.el-slider.is-vertical {
+    position: absolute;
+    z-index: 999;
+    height: 160px;
+    right: 10px;
+    bottom: 10px;
+    transform: scale(0.6);
+  }
+
+  .scale-text {
+    font-size: 14px;
+    color: #666;
+    font-weight: bold;
+  }
+
+  ::-webkit-scrollbar {
+    display: none;
+  }
+</style>

package/sohelp-workflow-drawer/components/form.vue

@@ -0,0 +1,78 @@
+<template>
+  <div v-loading="loading" class="todo-form">
+    <sohelp-entity-form
+      ref="entityFormRef"
+      v-model="formValue"
+      :data="data"
+      :refid="refid"
+      :readonly="true"
+      :disabled="true"
+    ></sohelp-entity-form>
+  </div>
+</template>
+
+<script setup>
+  import { ref, watch } from 'vue';
+  import { ElMessage } from 'element-plus';
+  import { getTodoDetail } from '@/api/todo/index.js';
+  import SohelpEntityForm from '../../sohelp-entity-form/index.vue';
+
+  const props = defineProps({
+    data: Object
+  });
+
+  const loading = ref(false);
+  const data = ref({});
+  const formValue = ref(null);
+  const entityFormRef = ref(null);
+
+  const refid = ref(props.data.refid.split('!')[0]);
+
+  const load = async () => {
+    const { id, refid } = props.data || {};
+    if (id && refid) {
+      await getDetail({ refid, id });
+    } else {
+      ElMessage.error('缺少id或refid参数');
+    }
+  };
+
+  const getDetail = async (params) => {
+    loading.value = true;
+    try {
+      const res = await getTodoDetail(params);
+      loading.value = false;
+      if (res) {
+        setTimeout(() => {
+          if (entityFormRef.value) {
+            entityFormRef.value.setFormData(res);
+          }
+        }, 100);
+      } else {
+        ElMessage.error('获取详情失败');
+      }
+    } catch (error) {
+      ElMessage.error('获取详情失败');
+      loading.value = false;
+    }
+  };
+
+  watch(
+    () => props.data,
+    (val) => {
+      if (val) {
+        load();
+      }
+    },
+    {
+      immediate: true
+    }
+  );
+</script>
+<style lang="scss" scoped>
+  .todo-form {
+    height: 100%;
+    padding-top: 20px;
+    box-sizing: border-box;
+  }
+</style>

package/sohelp-workflow-drawer/components/table.vue

@@ -0,0 +1,153 @@
+<template>
+  fff
+  <sohelp-vxe-grid
+    style="padding-top: 10px"
+    url="/engine/web/workflow/getTasks"
+    :gridOptions="gridOptions"
+    ref="tableRef"
+    :autoLoad="autoLoad"
+    @toolbarButtonClick="onToolbarButtonClick"
+  >
+    <template #type="{ row }">
+      <vxe-tag status="success" v-if="row.type === 'done'">办理完成</vxe-tag>
+      <vxe-tag status="danger" v-else-if="row.type === 'undo'">等待办理</vxe-tag>
+      <vxe-tag status="primary" v-else-if="row.type === 'todo'">正在办理</vxe-tag>
+    </template>
+
+    <template #actorList="{ row }">
+      <div style="display: flex; gap: 5px; flex-wrap: wrap">
+        <span v-for="item in row?.actorList" :key="item.actor_id">
+          <vxe-tag status="primary">{{ item.actor_name }}</vxe-tag>
+        </span>
+      </div>
+    </template>
+
+    <template #reason="{ row }">
+      <ele-text>{{ getVariable(row)?.reason }}</ele-text>
+    </template>
+  </sohelp-vxe-grid>
+</template>
+
+<script setup>
+  import { ElMessage } from 'element-plus';
+  import { reactive, ref, watch } from 'vue';
+
+  const props = defineProps({
+    data: Object
+  });
+
+  const tableRef = ref(null);
+  const autoLoad = ref(false);
+
+  const gridOptions = reactive({
+    params: {
+      refid: '',
+      id: ''
+    },
+    rowConfig: {
+      sHover: true,
+      isCurrent: true
+    },
+    keyboardConfig: {
+      isEdit: true,
+      isArrow: true,
+      isEnter: true,
+      isTab: true,
+      isDel: true,
+      isBack: true
+    },
+
+    border: true,
+    stripe: true,
+    loading: false,
+    minHeight: 200,
+    maxHeight: '100%',
+    size: 'mini',
+    columnConfig: {
+      resizable: true
+    },
+    formConfig: {
+      data: {},
+      items: []
+    },
+    toolbarConfig: {
+      custom: true, //是否开启自定义列工具栏
+      buttons: []
+    },
+    pageConfig: {
+      enabled: false
+    },
+    columns: [
+      {
+        type: 'seq',
+        title: '#',
+        fixe: 'left',
+        align: 'center',
+        width: 40
+      },
+      {
+        field: 'nodeName',
+        title: '任务名称',
+        width: 120
+      },
+      {
+        title: '办理人',
+        field: 'actorList',
+        width: 200,
+        slots: {
+          default: 'actorList'
+        }
+      },
+      {
+        title: '办理时间',
+        field: 'create_time',
+        width: 120
+      },
+      {
+        title: '办理状态',
+        align: 'center',
+        field: 'type',
+        width: 80,
+        slots: {
+          default: 'type'
+        }
+      },
+      {
+        title: '办理意见',
+        field: 'reason',
+        minWidth: 130,
+        slots: {
+          default: 'reason'
+        }
+      },
+      {
+        title: '附件',
+        field: 'file'
+      }
+    ],
+    data: []
+  });
+
+  const getVariable = (item) => {
+    return JSON.parse(item.variable || '{}');
+  };
+
+  watch(
+    () => props.data,
+    (val) => {
+      if (val) {
+        gridOptions.params = {
+          refid: val.refid,
+          id: val.id
+        };
+        autoLoad.value = true;
+      } else {
+        ElMessage.error('缺少variable参数');
+      }
+    },
+    {
+      immediate: true
+    }
+  );
+</script>
+<style lang="scss" scoped></style>