feat: [bpm][ele] bpmn 设计器时间事件配置优化

This commit is contained in:
jason
2025-12-18 11:15:35 +08:00
parent 936e127c0d
commit b18353e171
3 changed files with 14 additions and 19 deletions

View File

@@ -211,7 +211,7 @@ watch(
<ElInput <ElInput
v-model="cronStr" v-model="cronStr"
readonly readonly
class="w-[400px] font-bold" class="!w-[400px] font-bold"
key="cronStr" key="cronStr"
/> />
</div> </div>
@@ -273,7 +273,7 @@ watch(
:min="f.min" :min="f.min"
:max="f.max" :max="f.max"
size="small" size="small"
class="w-[60px]" class="!w-[100px]"
:key="`range0-${f.key}`" :key="`range0-${f.key}`"
/> />
@@ -282,7 +282,7 @@ watch(
:min="f.min" :min="f.min"
:max="f.max" :max="f.max"
size="small" size="small"
class="w-[60px]" class="!w-[100px]"
:key="`range1-${f.key}`" :key="`range1-${f.key}`"
/> />
之间每{{ f.label }} 之间每{{ f.label }}
@@ -294,7 +294,7 @@ watch(
:min="f.min" :min="f.min"
:max="f.max" :max="f.max"
size="small" size="small"
class="w-[60px]" class="!w-[100px]"
:key="`step0-${f.key}`" :key="`step0-${f.key}`"
/> />
开始每 开始每
@@ -303,7 +303,7 @@ watch(
:min="1" :min="1"
:max="f.max" :max="f.max"
size="small" size="small"
class="w-[60px]" class="!w-[100px]"
:key="`step1-${f.key}`" :key="`step1-${f.key}`"
/> />
{{ f.label }} {{ f.label }}
@@ -342,7 +342,7 @@ watch(
循环次数<ElInputNumber 循环次数<ElInputNumber
v-model="repeat" v-model="repeat"
:min="1" :min="1"
class="w-[100px]" class="!w-[100px]"
key="repeat" key="repeat"
/> />
</div> </div>
@@ -351,7 +351,7 @@ watch(
v-model="isoDate" v-model="isoDate"
type="datetime" type="datetime"
placeholder="选择开始时间" placeholder="选择开始时间"
class="w-[200px]" class="!w-[200px]"
key="isoDate" key="isoDate"
/> />
</div> </div>
@@ -360,7 +360,7 @@ watch(
v-model="isoDuration" v-model="isoDuration"
readonly readonly
placeholder="如P3DT30M30S" placeholder="如P3DT30M30S"
class="w-[200px]" class="!w-[200px]"
key="isoDuration" key="isoDuration"
/> />
</div> </div>
@@ -380,7 +380,7 @@ watch(
<ElInput <ElInput
v-model="durationCustom[unit.key]" v-model="durationCustom[unit.key]"
size="small" size="small"
class="ml-2 w-[60px]" class="ml-2 !w-[60px]"
placeholder="自定义" placeholder="自定义"
@change="setDuration(unit.key, durationCustom[unit.key])" @change="setDuration(unit.key, durationCustom[unit.key])"
/> />

View File

@@ -69,7 +69,7 @@ watch(
<template> <template>
<div> <div>
<div class="mb-2.5"> <div class="mb-2.5">
当前选择<ElInput v-model="isoString" readonly class="w-[300px]" /> 当前选择<ElInput v-model="isoString" readonly class="!w-[300px]" />
</div> </div>
<div v-for="unit in units" :key="unit.key" class="mb-2"> <div v-for="unit in units" :key="unit.key" class="mb-2">
<span>{{ unit.label }}</span> <span>{{ unit.label }}</span>
@@ -86,7 +86,7 @@ watch(
<ElInput <ElInput
v-model="custom[unit.key]" v-model="custom[unit.key]"
size="small" size="small"
class="ml-2 w-[60px]" class="ml-2 !w-[60px]"
placeholder="自定义" placeholder="自定义"
@change="setUnit(unit.key, custom[unit.key])" @change="setUnit(unit.key, custom[unit.key])"
/> />

View File

@@ -1,6 +1,4 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { Dayjs } from 'dayjs';
import type { Ref } from 'vue'; import type { Ref } from 'vue';
import { computed, nextTick, onMounted, ref, toRaw, watch } from 'vue'; import { computed, nextTick, onMounted, ref, toRaw, watch } from 'vue';
@@ -30,7 +28,7 @@ const bpmnInstances = () => (window as any).bpmnInstances;
const type: Ref<string> = ref('time'); const type: Ref<string> = ref('time');
const condition: Ref<string> = ref(''); const condition: Ref<string> = ref('');
const valid: Ref<boolean> = ref(false); const valid: Ref<boolean> = ref(false);
const dateValue = ref<Dayjs>(); const dateValue = ref();
const placeholder = computed<string>(() => { const placeholder = computed<string>(() => {
if (type.value === 'time') return '请输入时间'; if (type.value === 'time') return '请输入时间';
@@ -108,7 +106,6 @@ function validate(): boolean {
// 选择时间 Modal // 选择时间 Modal
const [DateModal, dateModalApi] = useVbenModal({ const [DateModal, dateModalApi] = useVbenModal({
title: '选择时间', title: '选择时间',
class: 'w-[400px]',
onConfirm: onDateConfirm, onConfirm: onDateConfirm,
}); });
@@ -126,7 +123,6 @@ function onDateConfirm(): void {
// 持续时长 Modal // 持续时长 Modal
const [DurationModal, durationModalApi] = useVbenModal({ const [DurationModal, durationModalApi] = useVbenModal({
title: '时间配置', title: '时间配置',
class: 'w-[600px]',
onConfirm: onDurationConfirm, onConfirm: onDurationConfirm,
}); });
@@ -141,7 +137,6 @@ function onDurationConfirm(): void {
// 循环配置 Modal // 循环配置 Modal
const [CycleModal, cycleModalApi] = useVbenModal({ const [CycleModal, cycleModalApi] = useVbenModal({
title: '时间配置', title: '时间配置',
class: 'w-[800px]',
onConfirm: onCycleConfirm, onConfirm: onCycleConfirm,
}); });
@@ -338,7 +333,7 @@ watch(
v-model="dateValue" v-model="dateValue"
type="datetime" type="datetime"
placeholder="选择日期时间" placeholder="选择日期时间"
class="w-full" class="!w-full"
@change="onDateChange" @change="onDateChange"
/> />
</DateModal> </DateModal>
@@ -349,7 +344,7 @@ watch(
</DurationModal> </DurationModal>
<!-- 循环配置器 --> <!-- 循环配置器 -->
<CycleModal> <CycleModal class="w-2/3">
<CycleConfig :value="condition" @change="onCycleChange" /> <CycleConfig :value="condition" @change="onCycleChange" />
</CycleModal> </CycleModal>