feat: JobTask,Scene表单NGrid布局调整

This commit is contained in:
dhb52 2024-05-18 23:51:42 +08:00
parent c1f3891eda
commit f45aa6fae9
2 changed files with 125 additions and 87 deletions

View File

@ -271,7 +271,7 @@ watch(visible, () => {
</script>
<template>
<OperateDrawer v-model="visible" :title="title" @handle-submit="handleSubmit">
<OperateDrawer v-model="visible" :title="title" :min-size="480" @handle-submit="handleSubmit">
<NForm ref="formRef" :model="model" :rules="rules">
<NFormItem :label="$t('page.jobTask.jobName')" path="jobName">
<NInput
@ -281,27 +281,39 @@ watch(visible, () => {
:placeholder="$t('page.jobTask.form.jobName')"
/>
</NFormItem>
<NFormItem :label="$t('page.jobTask.groupName')" path="groupName">
<SelectGroup v-model:value="model.groupName" />
</NFormItem>
<NFormItem :label="$t('page.jobTask.jobStatus')" path="jobStatus">
<NRadioGroup v-model:value="model.jobStatus" name="jobStatus">
<NSpace>
<NRadio
v-for="item in enableStatusNumberOptions"
:key="item.value"
:value="item.value"
:label="$t(item.label)"
/>
</NSpace>
</NRadioGroup>
</NFormItem>
<NFormItem :label="$t('page.jobTask.executorType')" path="executorType">
<ExecutorType v-model:value="model.executorType" />
</NFormItem>
<NFormItem :label="$t('page.jobTask.executorInfo')" path="executorInfo">
<NInput v-model:value="model.executorInfo" :placeholder="$t('page.jobTask.form.executorInfo')" />
</NFormItem>
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.jobTask.groupName')" path="groupName">
<SelectGroup v-model:value="model.groupName" />
</NFormItem>
</NGi>
<NGi>
<NFormItem :label="$t('page.jobTask.jobStatus')" path="jobStatus">
<NRadioGroup v-model:value="model.jobStatus" name="jobStatus">
<NSpace>
<NRadio
v-for="item in enableStatusNumberOptions"
:key="item.value"
:value="item.value"
:label="$t(item.label)"
/>
</NSpace>
</NRadioGroup>
</NFormItem>
</NGi>
</NGrid>
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.jobTask.executorType')" path="executorType">
<ExecutorType v-model:value="model.executorType" />
</NFormItem>
</NGi>
<NGi>
<NFormItem :label="$t('page.jobTask.executorInfo')" path="executorInfo">
<NInput v-model:value="model.executorInfo" :placeholder="$t('page.jobTask.form.executorInfo')" />
</NFormItem>
</NGi>
</NGrid>
<NFormItem :label="$t('page.jobTask.taskType')" path="taskType">
<TaskType v-model:value="model.taskType" :placeholder="$t('page.jobTask.form.taskType')" />
</NFormItem>
@ -336,58 +348,84 @@ watch(visible, () => {
</NCard>
<CodeMirror v-else v-model="model.argsStr" lang="json" :placeholder="$t('page.jobTask.form.argsStr')" />
</NFormItem>
<NFormItem :label="$t('page.jobTask.routeKey')" path="routeKey">
<RouteKey v-model:value="model.routeKey" :task-type="model.taskType" />
</NFormItem>
<NFormItem :label="$t('page.jobTask.blockStrategy')" path="blockStrategy">
<BlockStrategy v-model:value="model.blockStrategy" />
</NFormItem>
<NFormItem :label="$t('page.jobTask.triggerType')" path="triggerType">
<TriggerType
v-model:value="model.triggerType"
:placeholder="$t('page.jobTask.form.triggerType')"
@update:value="model.triggerInterval = ''"
/>
</NFormItem>
<NFormItem :label="$t('page.jobTask.triggerInterval')" path="triggerInterval">
<JobTriggerInterval v-model="model.triggerInterval" :trigger-type="model.triggerType" />
</NFormItem>
<NFormItem :label="$t('page.jobTask.executorTimeout')" path="executorTimeout">
<NInputNumber
v-model:value="model.executorTimeout"
:min="1"
:max="99999999"
:placeholder="$t('page.jobTask.form.executorTimeout')"
clearable
/>
</NFormItem>
<NFormItem :label="$t('page.jobTask.maxRetryTimes')" path="maxRetryTimes">
<NInputNumber
v-model:value="model.maxRetryTimes"
:min="1"
:max="999"
:placeholder="$t('page.jobTask.form.maxRetryTimes')"
clearable
/>
</NFormItem>
<NFormItem :label="$t('page.jobTask.retryInterval')" path="retryInterval">
<NInputNumber
v-model:value="model.retryInterval"
:min="1"
:max="99999999"
:placeholder="$t('page.jobTask.form.retryInterval')"
clearable
/>
</NFormItem>
<NFormItem :label="$t('page.jobTask.parallelNum')" path="parallelNum">
<NInputNumber
v-model:value="model.parallelNum"
:min="1"
:max="999"
:placeholder="$t('page.jobTask.form.parallelNum')"
clearable
/>
</NFormItem>
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.jobTask.routeKey')" path="routeKey">
<RouteKey v-model:value="model.routeKey" :task-type="model.taskType" />
</NFormItem>
</NGi>
<NGi>
<NFormItem :label="$t('page.jobTask.blockStrategy')" path="blockStrategy">
<BlockStrategy v-model:value="model.blockStrategy" />
</NFormItem>
</NGi>
</NGrid>
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.jobTask.triggerType')" path="triggerType">
<TriggerType
v-model:value="model.triggerType"
:placeholder="$t('page.jobTask.form.triggerType')"
@update:value="model.triggerInterval = ''"
/>
</NFormItem>
</NGi>
<NGi>
<NFormItem :label="$t('page.jobTask.triggerInterval')" path="triggerInterval">
<JobTriggerInterval v-model="model.triggerInterval" :trigger-type="model.triggerType" />
</NFormItem>
</NGi>
</NGrid>
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.jobTask.executorTimeout')" path="executorTimeout">
<NInputGroup>
<NInputNumber
v-model:value="model.executorTimeout"
:min="1"
:max="99999999"
:placeholder="$t('page.jobTask.form.executorTimeout')"
clearable
/>
</NInputGroup>
</NFormItem>
</NGi>
<NGi>
<NFormItem :label="$t('page.jobTask.maxRetryTimes')" path="maxRetryTimes">
<NInputNumber
v-model:value="model.maxRetryTimes"
:min="1"
:max="999"
:placeholder="$t('page.jobTask.form.maxRetryTimes')"
clearable
/>
</NFormItem>
</NGi>
</NGrid>
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.jobTask.retryInterval')" path="retryInterval">
<NInputNumber
v-model:value="model.retryInterval"
:min="1"
:max="99999999"
:placeholder="$t('page.jobTask.form.retryInterval')"
clearable
/>
</NFormItem>
</NGi>
<NGi>
<NFormItem :label="$t('page.jobTask.parallelNum')" path="parallelNum">
<NInputNumber
v-model:value="model.parallelNum"
:min="1"
:max="999"
:placeholder="$t('page.jobTask.form.parallelNum')"
clearable
/>
</NFormItem>
</NGi>
</NGrid>
<NFormItem :label="$t('page.jobTask.description')" path="description">
<NInput v-model:value="model.description" type="textarea" :placeholder="$t('page.jobTask.form.description')" />
</NFormItem>

View File

@ -229,7 +229,7 @@ watch(
</script>
<template>
<OperateDrawer v-model="visible" :title="title" @handle-submit="handleSubmit">
<OperateDrawer v-model="visible" :title="title" :min-size="480" @handle-submit="handleSubmit">
<NForm ref="formRef" :model="model" :rules="rules">
<NFormItem :label="$t('page.retryScene.sceneName')" path="sceneName">
<NInput
@ -240,8 +240,8 @@ watch(
:placeholder="$t('page.retryScene.form.sceneName')"
/>
</NFormItem>
<NGrid cols="24" item-responsive responsive="screen" x-gap="20">
<NGi span="0 m:1 l:17">
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.retryScene.groupName')" path="groupName">
<NSelect
v-model:value="model.groupName"
@ -252,7 +252,7 @@ watch(
/>
</NFormItem>
</NGi>
<NGi span="0 m:1 l:7">
<NGi>
<NFormItem :label="$t('page.retryScene.sceneStatus')" path="sceneStatus">
<NRadioGroup v-model:value="model.sceneStatus" name="sceneStatus">
<NSpace>
@ -268,13 +268,13 @@ watch(
</NGi>
</NGrid>
<NGrid cols="24" item-responsive responsive="screen" x-gap="20">
<NGi span="0 m:1 l:12">
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('common.routeKey.routeLabel')" path="routeKey">
<RouteKey v-model:value="model.routeKey" />
</NFormItem>
</NGi>
<NGi span="0 m:1 l:12">
<NGi>
<NFormItem :label="$t('page.retryScene.maxRetryCount')" path="maxRetryCount">
<NInputNumber
v-model:value="model.maxRetryCount"
@ -286,8 +286,8 @@ watch(
</NFormItem>
</NGi>
</NGrid>
<NGrid cols="24" item-responsive responsive="screen" x-gap="20">
<NGi span="0 m:1 l:12">
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.retryScene.backOff')" path="backOff">
<NSelect
v-model:value="model.backOff"
@ -297,7 +297,7 @@ watch(
/>
</NFormItem>
</NGi>
<NGi span="0 m:1 l:12">
<NGi>
<NFormItem path="triggerInterval">
<SceneTriggerInterval v-model="model.triggerInterval" :back-off="model.backOff" />
<template #label>
@ -325,8 +325,8 @@ watch(
</NFormItem>
</NGi>
</NGrid>
<NGrid cols="24" item-responsive responsive="screen" x-gap="20">
<NGi span="0 m:1 l:12">
<NGrid cols="2 s:1 m:2" responsive="screen" x-gap="20">
<NGi>
<NFormItem :label="$t('page.retryScene.executorTimeout')" path="executorTimeout">
<NInputNumber
v-model:value="model.executorTimeout"
@ -337,7 +337,7 @@ watch(
/>
</NFormItem>
</NGi>
<NGi span="0 m:1 l:12">
<NGi>
<NFormItem :label="$t('page.retryScene.deadlineRequest')" path="deadlineRequest">
<NInputNumber
v-model:value="model.deadlineRequest"