fix: bpmn style

This commit is contained in:
xingyu4j
2025-11-07 14:29:18 +08:00
parent aa13d2a67c
commit 5f071c20f3
2 changed files with 20 additions and 35 deletions

View File

@@ -660,16 +660,15 @@ onBeforeUnmount(() => {
<!-- <div id="js-properties-panel" class="panel"></div> -->
<!-- <div class="my-process-designer__canvas" ref="bpmn-canvas"></div> -->
</div>
<Dialog
<Modal
title="预览"
v-model:open="previewModelVisible"
width="80%"
class="max-h-[600px] w-4/5"
:scroll="true"
style="max-height: 600px"
>
<div>
<pre><code v-dompurify-html="highlightedCode(previewResult)" class="hljs"></code></pre>
</div>
</Dialog>
</Modal>
</div>
</template>

View File

@@ -248,9 +248,8 @@ defineExpose({ validate });
:rules="rules"
:label-col="{ span: 4 }"
:wrapper-col="{ span: 20 }"
class="mt-5"
>
<Form.Item label="流程标识" name="key" class="mb-5">
<Form.Item label="流程标识" name="key">
<div class="flex items-center">
<Input
class="w-full"
@@ -264,14 +263,11 @@ defineExpose({ validate });
"
placement="top"
>
<IconifyIcon
icon="lucide:circle-help"
class="ml-1 size-5 text-gray-900"
/>
<IconifyIcon icon="lucide:circle-help" class="ml-1 size-5" />
</Tooltip>
</div>
</Form.Item>
<Form.Item label="流程名称" name="name" class="mb-5">
<Form.Item label="流程名称" name="name">
<Input
v-model:value="modelData.name"
:disabled="!!modelData.id"
@@ -279,7 +275,7 @@ defineExpose({ validate });
placeholder="请输入流程名称"
/>
</Form.Item>
<Form.Item label="流程分类" name="category" class="mb-5">
<Form.Item label="流程分类" name="category">
<Select
class="w-full"
v-model:value="modelData.category"
@@ -295,13 +291,13 @@ defineExpose({ validate });
</Select.Option>
</Select>
</Form.Item>
<Form.Item label="流程图标" class="mb-5">
<Form.Item label="流程图标">
<ImageUpload v-model:value="modelData.icon" />
</Form.Item>
<Form.Item label="流程描述" name="description" class="mb-5">
<Form.Item label="流程描述" name="description">
<Input.TextArea v-model:value="modelData.description" allow-clear />
</Form.Item>
<Form.Item label="流程类型" name="type" class="mb-5">
<Form.Item label="流程类型" name="type">
<Radio.Group v-model:value="modelData.type">
<Radio
v-for="dict in getDictOptions(DICT_TYPE.BPM_MODEL_TYPE, 'number')"
@@ -312,7 +308,7 @@ defineExpose({ validate });
</Radio>
</Radio.Group>
</Form.Item>
<Form.Item label="是否可见" name="visible" class="mb-5">
<Form.Item label="是否可见" name="visible">
<Radio.Group v-model:value="modelData.visible">
<Radio
v-for="dict in getDictOptions(
@@ -326,7 +322,7 @@ defineExpose({ validate });
</Radio>
</Radio.Group>
</Form.Item>
<Form.Item label="谁可以发起" name="startUserType" class="mb-5">
<Form.Item label="谁可以发起" name="startUserType">
<Select
v-model:value="modelData.startUserType"
placeholder="请选择谁可以发起"
@@ -343,15 +339,10 @@ defineExpose({ validate });
<div
v-for="user in selectedStartUsers"
:key="user.id"
class="relative flex h-9 items-center rounded-full bg-gray-100 pr-2 hover:bg-gray-200 dark:border dark:border-gray-500 dark:bg-gray-700 dark:hover:bg-gray-600"
class="relative flex h-8 items-center rounded-lg bg-gray-100 pr-2 hover:bg-gray-200 dark:border dark:border-gray-500 dark:bg-gray-700 dark:hover:bg-gray-600"
>
<Avatar
class="m-1"
:size="28"
v-if="user.avatar"
:src="user.avatar"
/>
<Avatar class="m-1" :size="28" v-else>
<Avatar class="m-1 size-7" v-if="user.avatar" :src="user.avatar" />
<Avatar class="m-1 size-7" v-else>
{{ user.nickname?.substring(0, 1) }}
</Avatar>
<span class="text-gray-700 dark:text-gray-200">
@@ -359,7 +350,7 @@ defineExpose({ validate });
</span>
<IconifyIcon
icon="lucide:x"
class="ml-2 size-4 cursor-pointer text-gray-400 hover:text-red-500"
class="ml-2 size-4 cursor-pointer text-gray-400 hover:text-red-500 dark:text-gray-200"
@click="handleRemoveStartUser(user)"
/>
</div>
@@ -381,7 +372,7 @@ defineExpose({ validate });
<div
v-for="dept in selectedStartDepts"
:key="dept.id"
class="relative flex h-9 items-center rounded-full bg-gray-100 pr-2 shadow-sm hover:bg-gray-200 dark:border dark:border-gray-500 dark:bg-gray-700 dark:hover:bg-gray-600"
class="relative flex h-8 items-center rounded-lg bg-gray-100 pr-2 shadow-sm hover:bg-gray-200 dark:border dark:border-gray-500 dark:bg-gray-700 dark:hover:bg-gray-600"
>
<IconifyIcon icon="lucide:building" class="size-6 px-1" />
<span class="text-gray-700 dark:text-gray-200">
@@ -405,20 +396,15 @@ defineExpose({ validate });
</Button>
</div>
</Form.Item>
<Form.Item label="流程管理员" name="managerUserIds" class="mb-5">
<Form.Item label="流程管理员" name="managerUserIds">
<div class="flex flex-wrap gap-1">
<div
v-for="user in selectedManagerUsers"
:key="user.id"
class="relative flex h-9 items-center rounded-full bg-gray-100 pr-2 hover:bg-gray-200 dark:border dark:border-gray-500 dark:bg-gray-700 dark:hover:bg-gray-600"
>
<Avatar
class="m-1"
:size="28"
v-if="user.avatar"
:src="user.avatar"
/>
<Avatar class="m-1" :size="28" v-else>
<Avatar class="m-1 size-7" v-if="user.avatar" :src="user.avatar" />
<Avatar class="m-1 size-7" v-else>
{{ user.nickname?.substring(0, 1) }}
</Avatar>
<span class="text-gray-700 dark:text-gray-200">