From 0c39b593ce6c001500850cb9fd3ca8f1d32757d5 Mon Sep 17 00:00:00 2001
From: LiuHao <liuhaoai545@gmail.com>
Date: 星期一, 18 三月 2024 14:18:30 +0800
Subject: [PATCH] update 优化面板类型
---
src/components/BpmnDesign/panel/ParticipantPanel.vue | 53 ++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 40 insertions(+), 13 deletions(-)
diff --git a/src/components/BpmnDesign/panel/ParticipantPanel.vue b/src/components/BpmnDesign/panel/ParticipantPanel.vue
index 7dd5474..24cb9dc 100644
--- a/src/components/BpmnDesign/panel/ParticipantPanel.vue
+++ b/src/components/BpmnDesign/panel/ParticipantPanel.vue
@@ -1,26 +1,53 @@
<template>
<div>
- <el-form ref="formRef" :model="formData" :rules="formRules" label-width="80px">
- <el-form-item prop="id" label="鑺傜偣 ID">
- <el-input v-model="formData.id" @change="idChange"> </el-input>
- </el-form-item>
- <el-form-item prop="name" label="鑺傜偣鍚嶇О">
- <el-input v-model="formData.name" @change="nameChange"> </el-input>
- </el-form-item>
- <el-form-item label="鎵ц鐩戝惉鍣�" style="margin-bottom: 0"> </el-form-item>
- <ExecutionListener :element="element"></ExecutionListener>
- </el-form>
+ <el-collapse v-model="currentCollapseItem">
+ <el-collapse-item name="1">
+ <template #title>
+ <div class="collapse__title">
+ <el-icon>
+ <InfoFilled />
+ </el-icon>
+ 甯歌
+ </div>
+ </template>
+ <div>
+ <el-form ref="formRef" :model="formData" :rules="formRules" label-width="90px">
+ <el-form-item prop="id" label="鑺傜偣 ID">
+ <el-input v-model="formData.id" @change="idChange"></el-input>
+ </el-form-item>
+ <el-form-item prop="name" label="鑺傜偣鍚嶇О">
+ <el-input v-model="formData.name" @change="nameChange"></el-input>
+ </el-form-item>
+ </el-form>
+ </div>
+ </el-collapse-item>
+
+ <el-collapse-item name="2">
+ <template #title>
+ <div class="collapse__title">
+ <el-icon>
+ <BellFilled />
+ </el-icon>
+ 鎵ц鐩戝惉鍣�
+ </div>
+ </template>
+ <div>
+ <ExecutionListener :element="element"></ExecutionListener>
+ </div>
+ </el-collapse-item>
+ </el-collapse>
</div>
</template>
<script setup lang="ts">
import useParseElement from '@/components/BpmnDesign/hooks/useParseElement';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import { ModdleElement } from 'bpmn';
-import { StartEndPanel } from 'bpmnDesign';
+import { ParticipantPanel } from 'bpmnDesign';
interface PropType {
element: ModdleElement;
}
+
const props = withDefaults(defineProps<PropType>(), {});
const { nameChange, idChange } = usePanel({
element: toRaw(props.element)
@@ -29,8 +56,8 @@
element: toRaw(props.element)
});
-const formData = ref(parseData<StartEndPanel>());
-
+const formData = ref(parseData<ParticipantPanel>());
+const currentCollapseItem = ref(['1', '2']);
const formRules = ref<ElFormRules>({
id: [{ required: true, message: '璇疯緭鍏�', trigger: 'blur' }],
name: [{ required: true, message: '璇疯緭鍏�', trigger: 'blur' }]
--
Gitblit v1.9.3