From f45aa6fae9aa88af104f560aef5a2e6c9f493693 Mon Sep 17 00:00:00 2001
From: dhb52 <dhb52@126.com>
Date: Sat, 18 May 2024 23:51:42 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20JobTask,Scene=E8=A1=A8=E5=8D=95NGrid?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../task/modules/job-task-operate-drawer.vue  | 186 +++++++++++-------
 .../scene/modules/scene-operate-drawer.vue    |  26 +--
 2 files changed, 125 insertions(+), 87 deletions(-)

diff --git a/src/views/job/task/modules/job-task-operate-drawer.vue b/src/views/job/task/modules/job-task-operate-drawer.vue
index 6d538ab..8387470 100644
--- a/src/views/job/task/modules/job-task-operate-drawer.vue
+++ b/src/views/job/task/modules/job-task-operate-drawer.vue
@@ -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>
diff --git a/src/views/retry/scene/modules/scene-operate-drawer.vue b/src/views/retry/scene/modules/scene-operate-drawer.vue
index 727b637..d7c6130 100644
--- a/src/views/retry/scene/modules/scene-operate-drawer.vue
+++ b/src/views/retry/scene/modules/scene-operate-drawer.vue
@@ -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"