refactor: crontab components

yudao-ui-admin-vue3/src/components/Crontab/index.ts

@@ -0,0 +1,3 @@
+import Crontab from './src/index.vue'
+
+export { Crontab }

yudao-ui-admin-vue3/src/components/Crontab/day.vue → yudao-ui-admin-vue3/src/components/Crontab/src/components/day.vue

@@ -1,60 +1,6 @@
-<template>
-  <el-form size="small">
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="1"> 日，允许的通配符[, - * ? / L W] </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="2"> 不指定 </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="3">
-        周期从
-        <el-input-number v-model="cycle01" :min="1" :max="30" /> -
-        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 2" :max="31" /> 日
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="4">
-        从
-        <el-input-number v-model="average01" :min="1" :max="30" /> 号开始，每
-        <el-input-number v-model="average02" :min="1" :max="31 - average01 || 1" /> 日执行一次
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="5">
-        每月
-        <el-input-number v-model="workday" :min="1" :max="31" /> 号最近的那个工作日
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="6"> 本月最后一天 </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="7">
-        指定
-        <el-select
-          clearable
-          v-model="checkboxList"
-          placeholder="可多选"
-          multiple
-          style="width: 100%"
-        >
-          <el-option v-for="item in 31" :key="item" :value="item">{{ item }}</el-option>
-        </el-select>
-      </el-radio>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script lang="ts" setup>
+<script setup lang="ts">
 import { computed, ref, watch } from 'vue'
-
+import { ElForm, ElFormItem, ElRadio, ElSelect, ElOption, ElInputNumber } from 'element-plus'
 const props = defineProps({
   check: {
     type: Function,
@@ -172,3 +118,56 @@ watch(checkboxString, () => {
   }
 })
 </script>
+<template>
+  <el-form>
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="1"> 日，允许的通配符[, - * ? / L W] </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="2"> 不指定 </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="3">
+        周期从
+        <el-input-number v-model="cycle01" :min="1" :max="30" /> -
+        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 2" :max="31" /> 日
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="4">
+        从
+        <el-input-number v-model="average01" :min="1" :max="30" /> 号开始，每
+        <el-input-number v-model="average02" :min="1" :max="31 - average01 || 1" /> 日执行一次
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="5">
+        每月
+        <el-input-number v-model="workday" :min="1" :max="31" /> 号最近的那个工作日
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="6"> 本月最后一天 </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="7">
+        指定
+        <el-select
+          clearable
+          v-model="checkboxList"
+          placeholder="可多选"
+          multiple
+          style="width: 100%"
+        >
+          <el-option v-for="item in 31" :key="item" :value="item">{{ item }}</el-option>
+        </el-select>
+      </el-radio>
+    </el-form-item>
+  </el-form>
+</template>

yudao-ui-admin-vue3/src/components/Crontab/hour.vue → yudao-ui-admin-vue3/src/components/Crontab/src/components/hour.vue

@@ -1,45 +1,6 @@
-<template>
-  <el-form size="small">
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="1"> 小时，允许的通配符[, - * /] </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="2">
-        周期从
-        <el-input-number v-model="cycle01" :min="0" :max="22" /> -
-        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="23" /> 小时
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="3">
-        从
-        <el-input-number v-model="average01" :min="0" :max="22" /> 小时开始，每
-        <el-input-number v-model="average02" :min="1" :max="23 - average01 || 0" /> 小时执行一次
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="4">
-        指定
-        <el-select
-          clearable
-          v-model="checkboxList"
-          placeholder="可多选"
-          multiple
-          style="width: 100%"
-        >
-          <el-option v-for="item in 24" :key="item" :value="item - 1">{{ item - 1 }}</el-option>
-        </el-select>
-      </el-radio>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script lang="ts" setup>
+<script setup lang="ts">
 import { computed, ref, watch } from 'vue'
-
+import { ElForm, ElFormItem, ElRadio, ElSelect, ElOption, ElInputNumber } from 'element-plus'
 const props = defineProps({
   check: {
     type: Function,
@@ -119,3 +80,41 @@ watch(radioValue, () => {
   }
 })
 </script>
+<template>
+  <el-form>
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="1"> 小时，允许的通配符[, - * /] </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="2">
+        周期从
+        <el-input-number v-model="cycle01" :min="0" :max="22" /> -
+        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="23" /> 小时
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="3">
+        从
+        <el-input-number v-model="average01" :min="0" :max="22" /> 小时开始，每
+        <el-input-number v-model="average02" :min="1" :max="23 - average01 || 0" /> 小时执行一次
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="4">
+        指定
+        <el-select
+          clearable
+          v-model="checkboxList"
+          placeholder="可多选"
+          multiple
+          style="width: 100%"
+        >
+          <el-option v-for="item in 24" :key="item" :value="item - 1">{{ item - 1 }}</el-option>
+        </el-select>
+      </el-radio>
+    </el-form-item>
+  </el-form>
+</template>

yudao-ui-admin-vue3/src/components/Crontab/src/components/index.ts

@@ -0,0 +1,19 @@
+import CrontabSecond from './second.vue'
+import CrontabMin from './min.vue'
+import CrontabHour from './hour.vue'
+import CrontabDay from './day.vue'
+import CrontabMonth from './month.vue'
+import CrontabWeek from './week.vue'
+import CrontabYear from './year.vue'
+import CrontabResult from './result.vue'
+
+export {
+  CrontabSecond,
+  CrontabMin,
+  CrontabHour,
+  CrontabDay,
+  CrontabMonth,
+  CrontabWeek,
+  CrontabYear,
+  CrontabResult
+}

yudao-ui-admin-vue3/src/components/Crontab/min.vue → yudao-ui-admin-vue3/src/components/Crontab/src/components/min.vue

@@ -1,45 +1,6 @@
-<template>
-  <el-form size="small">
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="1"> 分钟，允许的通配符[, - * /] </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="2">
-        周期从
-        <el-input-number v-model="cycle01" :min="0" :max="58" /> -
-        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 分钟
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="3">
-        从
-        <el-input-number v-model="average01" :min="0" :max="58" /> 分钟开始，每
-        <el-input-number v-model="average02" :min="1" :max="59 - average01 || 0" /> 分钟执行一次
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="4">
-        指定
-        <el-select
-          clearable
-          v-model="checkboxList"
-          placeholder="可多选"
-          multiple
-          style="width: 100%"
-        >
-          <el-option v-for="item in 60" :key="item" :value="item - 1">{{ item - 1 }}</el-option>
-        </el-select>
-      </el-radio>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script lang="ts" setup>
+<script setup lang="ts">
 import { computed, ref, watch } from 'vue'
-
+import { ElForm, ElFormItem, ElRadio, ElSelect, ElOption, ElInputNumber } from 'element-plus'
 const props = defineProps({
   check: {
     type: Function,
@@ -119,3 +80,41 @@ watch(radioValue, () => {
   }
 })
 </script>
+<template>
+  <el-form>
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="1"> 分钟，允许的通配符[, - * /] </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="2">
+        周期从
+        <el-input-number v-model="cycle01" :min="0" :max="58" /> -
+        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 分钟
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="3">
+        从
+        <el-input-number v-model="average01" :min="0" :max="58" /> 分钟开始，每
+        <el-input-number v-model="average02" :min="1" :max="59 - average01 || 0" /> 分钟执行一次
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="4">
+        指定
+        <el-select
+          clearable
+          v-model="checkboxList"
+          placeholder="可多选"
+          multiple
+          style="width: 100%"
+        >
+          <el-option v-for="item in 60" :key="item" :value="item - 1">{{ item - 1 }}</el-option>
+        </el-select>
+      </el-radio>
+    </el-form-item>
+  </el-form>
+</template>

yudao-ui-admin-vue3/src/components/Crontab/month.vue → yudao-ui-admin-vue3/src/components/Crontab/src/components/month.vue

@@ -1,45 +1,6 @@
-<template>
-  <el-form size="small">
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="1"> 月，允许的通配符[, - * /] </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="2">
-        周期从
-        <el-input-number v-model="cycle01" :min="1" :max="11" /> -
-        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 2" :max="12" /> 月
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="3">
-        从
-        <el-input-number v-model="average01" :min="1" :max="11" /> 月开始，每
-        <el-input-number v-model="average02" :min="1" :max="12 - average01 || 0" /> 月月执行一次
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="4">
-        指定
-        <el-select
-          clearable
-          v-model="checkboxList"
-          placeholder="可多选"
-          multiple
-          style="width: 100%"
-        >
-          <el-option v-for="item in 12" :key="item" :value="item">{{ item }}</el-option>
-        </el-select>
-      </el-radio>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script lang="ts" setup>
+<script setup lang="ts">
 import { computed, ref, watch } from 'vue'
-
+import { ElForm, ElFormItem, ElRadio, ElSelect, ElOption, ElInputNumber } from 'element-plus'
 const props = defineProps({
   check: {
     type: Function,
@@ -119,3 +80,41 @@ watch(radioValue, () => {
   }
 })
 </script>
+<template>
+  <el-form>
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="1"> 月，允许的通配符[, - * /] </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="2">
+        周期从
+        <el-input-number v-model="cycle01" :min="1" :max="11" /> -
+        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 2" :max="12" /> 月
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="3">
+        从
+        <el-input-number v-model="average01" :min="1" :max="11" /> 月开始，每
+        <el-input-number v-model="average02" :min="1" :max="12 - average01 || 0" /> 月月执行一次
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="4">
+        指定
+        <el-select
+          clearable
+          v-model="checkboxList"
+          placeholder="可多选"
+          multiple
+          style="width: 100%"
+        >
+          <el-option v-for="item in 12" :key="item" :value="item">{{ item }}</el-option>
+        </el-select>
+      </el-radio>
+    </el-form-item>
+  </el-form>
+</template>

yudao-ui-admin-vue3/src/components/Crontab/result.vue → yudao-ui-admin-vue3/src/components/Crontab/src/components/result.vue

@@ -1,16 +1,4 @@
-<template>
-  <div class="popup-result">
-    <p class="title">最近5次运行时间</p>
-    <ul class="popup-result-scroll">
-      <template v-if="isShow">
-        <li v-for="item in resultList" :key="item">{{ item }}</li>
-      </template>
-      <li v-else>计算结果中...</li>
-    </ul>
-  </div>
-</template>
-
-<script lang="ts" setup>
+<script setup lang="ts">
 import { onMounted, ref, watch } from 'vue'
 
 const props = defineProps({
@@ -572,3 +560,14 @@ function checkDate(value) {
   return value === format
 }
 </script>
+<template>
+  <div class="popup-result">
+    <p class="title">最近5次运行时间</p>
+    <ul class="popup-result-scroll">
+      <template v-if="isShow">
+        <li v-for="item in resultList" :key="item">{{ item }}</li>
+      </template>
+      <li v-else>计算结果中...</li>
+    </ul>
+  </div>
+</template>

yudao-ui-admin-vue3/src/components/Crontab/second.vue → yudao-ui-admin-vue3/src/components/Crontab/src/components/second.vue

@@ -1,45 +1,6 @@
-<template>
-  <el-form size="small">
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="1"> 秒，允许的通配符[, - * /] </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="2">
-        周期从
-        <el-input-number v-model="cycle01" :min="0" :max="58" /> -
-        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 秒
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="3">
-        从
-        <el-input-number v-model="average01" :min="0" :max="58" /> 秒开始，每
-        <el-input-number v-model="average02" :min="1" :max="59 - average01 || 0" /> 秒执行一次
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="4">
-        指定
-        <el-select
-          clearable
-          v-model="checkboxList"
-          placeholder="可多选"
-          multiple
-          style="width: 100%"
-        >
-          <el-option v-for="item in 60" :key="item" :value="item - 1">{{ item - 1 }}</el-option>
-        </el-select>
-      </el-radio>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script lang="ts" setup>
+<script setup lang="ts">
 import { computed, ref, watch } from 'vue'
-
+import { ElForm, ElFormItem, ElRadio, ElSelect, ElOption, ElInputNumber } from 'element-plus'
 const props = defineProps({
   check: {
     type: Function,
@@ -119,3 +80,41 @@ watch(radioValue, () => {
   }
 })
 </script>
+<template>
+  <el-form>
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="1"> 秒，允许的通配符[, - * /] </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="2">
+        周期从
+        <el-input-number v-model="cycle01" :min="0" :max="58" /> -
+        <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 秒
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="3">
+        从
+        <el-input-number v-model="average01" :min="0" :max="58" /> 秒开始，每
+        <el-input-number v-model="average02" :min="1" :max="59 - average01 || 0" /> 秒执行一次
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="4">
+        指定
+        <el-select
+          clearable
+          v-model="checkboxList"
+          placeholder="可多选"
+          multiple
+          style="width: 100%"
+        >
+          <el-option v-for="item in 60" :key="item" :value="item - 1">{{ item - 1 }}</el-option>
+        </el-select>
+      </el-radio>
+    </el-form-item>
+  </el-form>
+</template>

yudao-ui-admin-vue3/src/components/Crontab/week.vue → yudao-ui-admin-vue3/src/components/Crontab/src/components/week.vue

@@ -1,97 +1,6 @@
-<template>
-  <el-form size="small">
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="1"> 周，允许的通配符[, - * ? / L #] </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="2"> 不指定 </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="3">
-        周期从星期
-        <el-select clearable v-model="cycle01">
-          <el-option
-            v-for="(item, index) of weekList"
-            :key="index"
-            :label="item.value"
-            :value="item.key"
-            :disabled="item.key === 1"
-            >{{ item.value }}</el-option
-          >
-        </el-select>
-        -
-        <el-select clearable v-model="cycle02">
-          <el-option
-            v-for="(item, index) of weekList"
-            :key="index"
-            :label="item.value"
-            :value="item.key"
-            :disabled="item.key < cycle01 && item.key !== 1"
-            >{{ item.value }}</el-option
-          >
-        </el-select>
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="4">
-        第
-        <el-input-number v-model="average01" :min="1" :max="4" /> 周的星期
-        <el-select clearable v-model="average02">
-          <el-option
-            v-for="(item, index) of weekList"
-            :key="index"
-            :label="item.value"
-            :value="item.key"
-            >{{ item.value }}</el-option
-          >
-        </el-select>
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="5">
-        本月最后一个星期
-        <el-select clearable v-model="weekday">
-          <el-option
-            v-for="(item, index) of weekList"
-            :key="index"
-            :label="item.value"
-            :value="item.key"
-            >{{ item.value }}</el-option
-          >
-        </el-select>
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio v-model="radioValue" :label="6">
-        指定
-        <el-select
-          clearable
-          v-model="checkboxList"
-          placeholder="可多选"
-          multiple
-          style="width: 100%"
-        >
-          <el-option
-            v-for="(item, index) of weekList"
-            :key="index"
-            :label="item.value"
-            :value="String(item.key)"
-            >{{ item.value }}</el-option
-          >
-        </el-select>
-      </el-radio>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script lang="ts" setup>
+<script setup lang="ts">
 import { computed, ref, watch } from 'vue'
-
+import { ElForm, ElFormItem, ElRadio, ElSelect, ElOption, ElInputNumber } from 'element-plus'
 const props = defineProps({
   check: {
     type: Function,
@@ -222,3 +131,93 @@ watch(radioValue, () => {
   }
 })
 </script>
+<template>
+  <el-form>
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="1"> 周，允许的通配符[, - * ? / L #] </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="2"> 不指定 </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="3">
+        周期从星期
+        <el-select clearable v-model="cycle01">
+          <el-option
+            v-for="(item, index) of weekList"
+            :key="index"
+            :label="item.value"
+            :value="item.key"
+            :disabled="item.key === 1"
+            >{{ item.value }}</el-option
+          >
+        </el-select>
+        -
+        <el-select clearable v-model="cycle02">
+          <el-option
+            v-for="(item, index) of weekList"
+            :key="index"
+            :label="item.value"
+            :value="item.key"
+            :disabled="item.key < cycle01 && item.key !== 1"
+            >{{ item.value }}</el-option
+          >
+        </el-select>
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="4">
+        第
+        <el-input-number v-model="average01" :min="1" :max="4" /> 周的星期
+        <el-select clearable v-model="average02">
+          <el-option
+            v-for="(item, index) of weekList"
+            :key="index"
+            :label="item.value"
+            :value="item.key"
+            >{{ item.value }}</el-option
+          >
+        </el-select>
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="5">
+        本月最后一个星期
+        <el-select clearable v-model="weekday">
+          <el-option
+            v-for="(item, index) of weekList"
+            :key="index"
+            :label="item.value"
+            :value="item.key"
+            >{{ item.value }}</el-option
+          >
+        </el-select>
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio v-model="radioValue" :label="6">
+        指定
+        <el-select
+          clearable
+          v-model="checkboxList"
+          placeholder="可多选"
+          multiple
+          style="width: 100%"
+        >
+          <el-option
+            v-for="(item, index) of weekList"
+            :key="index"
+            :label="item.value"
+            :value="String(item.key)"
+            >{{ item.value }}</el-option
+          >
+        </el-select>
+      </el-radio>
+    </el-form-item>
+  </el-form>
+</template>

yudao-ui-admin-vue3/src/components/Crontab/year.vue → yudao-ui-admin-vue3/src/components/Crontab/src/components/year.vue

@@ -1,53 +1,6 @@
-<template>
-  <el-form size="small">
-    <el-form-item>
-      <el-radio label="1" v-model="radioValue"> 不填，允许的通配符[, - * /] </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio label="2" v-model="radioValue"> 每年 </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio label="3" v-model="radioValue">
-        周期从
-        <el-input-number v-model="cycle01" :min="fullYear" :max="2098" /> -
-        <el-input-number
-          v-model="cycle02"
-          :min="cycle01 ? cycle01 + 1 : fullYear + 1"
-          :max="2099"
-        />
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio label="4" v-model="radioValue">
-        从
-        <el-input-number v-model="average01" :min="fullYear" :max="2098" /> 年开始，每
-        <el-input-number v-model="average02" :min="1" :max="2099 - average01 || fullYear" />
-        年执行一次
-      </el-radio>
-    </el-form-item>
-
-    <el-form-item>
-      <el-radio label="5" v-model="radioValue">
-        指定
-        <el-select clearable v-model="checkboxList" placeholder="可多选" multiple>
-          <el-option
-            v-for="item in 9"
-            :key="item"
-            :value="item - 1 + fullYear"
-            :label="item - 1 + fullYear"
-          />
-        </el-select>
-      </el-radio>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script lang="ts" setup>
+<script setup lang="ts">
 import { computed, onMounted, ref, watch } from 'vue'
-
+import { ElForm, ElFormItem, ElRadio, ElSelect, ElOption, ElInputNumber } from 'element-plus'
 const props = defineProps({
   check: {
     type: Function,
@@ -138,3 +91,49 @@ onMounted(() => {
   average01.value = fullYear.value
 })
 </script>
+<template>
+  <el-form>
+    <el-form-item>
+      <el-radio label="1" v-model="radioValue"> 不填，允许的通配符[, - * /] </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio label="2" v-model="radioValue"> 每年 </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio label="3" v-model="radioValue">
+        周期从
+        <el-input-number v-model="cycle01" :min="fullYear" :max="2098" /> -
+        <el-input-number
+          v-model="cycle02"
+          :min="cycle01 ? cycle01 + 1 : fullYear + 1"
+          :max="2099"
+        />
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio label="4" v-model="radioValue">
+        从
+        <el-input-number v-model="average01" :min="fullYear" :max="2098" /> 年开始，每
+        <el-input-number v-model="average02" :min="1" :max="2099 - average01 || fullYear" />
+        年执行一次
+      </el-radio>
+    </el-form-item>
+
+    <el-form-item>
+      <el-radio label="5" v-model="radioValue">
+        指定
+        <el-select clearable v-model="checkboxList" placeholder="可多选" multiple>
+          <el-option
+            v-for="item in 9"
+            :key="item"
+            :value="item - 1 + fullYear"
+            :label="item - 1 + fullYear"
+          />
+        </el-select>
+      </el-radio>
+    </el-form-item>
+  </el-form>
+</template>

yudao-ui-admin-vue3/src/components/Crontab/index.vue → yudao-ui-admin-vue3/src/components/Crontab/src/index.vue

@@ -1,126 +1,15 @@
-<template>
-  <div>
-    <el-tabs type="border-card">
-      <el-tab-pane label="秒" v-if="shouldHide('second')">
-        <CrontabSecond
-          @update="updateCrontabValue"
-          :check="checkNumber"
-          :cron="crontabValueObj"
-          ref="cronsecond"
-        />
-      </el-tab-pane>
-
-      <el-tab-pane label="分钟" v-if="shouldHide('min')">
-        <CrontabMin
-          @update="updateCrontabValue"
-          :check="checkNumber"
-          :cron="crontabValueObj"
-          ref="cronmin"
-        />
-      </el-tab-pane>
-
-      <el-tab-pane label="小时" v-if="shouldHide('hour')">
-        <CrontabHour
-          @update="updateCrontabValue"
-          :check="checkNumber"
-          :cron="crontabValueObj"
-          ref="cronhour"
-        />
-      </el-tab-pane>
-
-      <el-tab-pane label="日" v-if="shouldHide('day')">
-        <CrontabDay
-          @update="updateCrontabValue"
-          :check="checkNumber"
-          :cron="crontabValueObj"
-          ref="cronday"
-        />
-      </el-tab-pane>
-
-      <el-tab-pane label="月" v-if="shouldHide('month')">
-        <CrontabMonth
-          @update="updateCrontabValue"
-          :check="checkNumber"
-          :cron="crontabValueObj"
-          ref="cronmonth"
-        />
-      </el-tab-pane>
-
-      <el-tab-pane label="周" v-if="shouldHide('week')">
-        <CrontabWeek
-          @update="updateCrontabValue"
-          :check="checkNumber"
-          :cron="crontabValueObj"
-          ref="cronweek"
-        />
-      </el-tab-pane>
-
-      <el-tab-pane label="年" v-if="shouldHide('year')">
-        <CrontabYear
-          @update="updateCrontabValue"
-          :check="checkNumber"
-          :cron="crontabValueObj"
-          ref="cronyear"
-        />
-      </el-tab-pane>
-    </el-tabs>
-
-    <div class="popup-main">
-      <div class="popup-result">
-        <p class="title">时间表达式</p>
-        <table>
-          <thead>
-            <th v-for="item of tabTitles" width="40" :key="item">{{ item }}</th>
-            <th>Cron 表达式</th>
-          </thead>
-          <tbody>
-            <td>
-              <span>{{ crontabValueObj.second }}</span>
-            </td>
-            <td>
-              <span>{{ crontabValueObj.min }}</span>
-            </td>
-            <td>
-              <span>{{ crontabValueObj.hour }}</span>
-            </td>
-            <td>
-              <span>{{ crontabValueObj.day }}</span>
-            </td>
-            <td>
-              <span>{{ crontabValueObj.month }}</span>
-            </td>
-            <td>
-              <span>{{ crontabValueObj.week }}</span>
-            </td>
-            <td>
-              <span>{{ crontabValueObj.year }}</span>
-            </td>
-            <td>
-              <span>{{ crontabValueString }}</span>
-            </td>
-          </tbody>
-        </table>
-      </div>
-      <CrontabResult :ex="crontabValueString" />
-
-      <div class="pop_btn">
-        <el-button size="small" type="primary" @click="submitFill">确定</el-button>
-        <el-button size="small" type="warning" @click="clearCron">重置</el-button>
-        <el-button size="small" @click="hidePopup">取消</el-button>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import CrontabSecond from './second.vue'
-import CrontabMin from './min.vue'
-import CrontabHour from './hour.vue'
-import CrontabDay from './day.vue'
-import CrontabMonth from './month.vue'
-import CrontabWeek from './week.vue'
-import CrontabYear from './year.vue'
-import CrontabResult from './result.vue'
+<script setup lang="ts">
+import {
+  CrontabSecond,
+  CrontabMin,
+  CrontabHour,
+  CrontabDay,
+  CrontabMonth,
+  CrontabWeek,
+  CrontabYear,
+  CrontabResult
+} from './components'
+import { ElTabs, ElTabPane } from 'element-plus'
 import { computed, defineEmits, defineProps, onMounted, Ref, ref, watch } from 'vue'
 
 const cronsecond = ref(null)
@@ -208,7 +97,7 @@ function updateCrontabValue(name, value, from) {
     changeRadio(name, value)
   }
 }
-
+// 赋值到组件
 function changeRadio(name, value) {
   let arr = ['second', 'min', 'hour', 'month'],
     refName = 'cron' + name,
@@ -373,7 +262,119 @@ function clearCron() {
 
 watch(() => props.expression, resolveExp)
 </script>
+<template>
+  <div>
+    <el-tabs type="border-card">
+      <el-tab-pane label="秒" v-if="shouldHide('second')">
+        <CrontabSecond
+          @update="updateCrontabValue"
+          :check="checkNumber"
+          :cron="crontabValueObj"
+          ref="cronsecond"
+        />
+      </el-tab-pane>
+
+      <el-tab-pane label="分钟" v-if="shouldHide('min')">
+        <CrontabMin
+          @update="updateCrontabValue"
+          :check="checkNumber"
+          :cron="crontabValueObj"
+          ref="cronmin"
+        />
+      </el-tab-pane>
+
+      <el-tab-pane label="小时" v-if="shouldHide('hour')">
+        <CrontabHour
+          @update="updateCrontabValue"
+          :check="checkNumber"
+          :cron="crontabValueObj"
+          ref="cronhour"
+        />
+      </el-tab-pane>
+
+      <el-tab-pane label="日" v-if="shouldHide('day')">
+        <CrontabDay
+          @update="updateCrontabValue"
+          :check="checkNumber"
+          :cron="crontabValueObj"
+          ref="cronday"
+        />
+      </el-tab-pane>
+
+      <el-tab-pane label="月" v-if="shouldHide('month')">
+        <CrontabMonth
+          @update="updateCrontabValue"
+          :check="checkNumber"
+          :cron="crontabValueObj"
+          ref="cronmonth"
+        />
+      </el-tab-pane>
+
+      <el-tab-pane label="周" v-if="shouldHide('week')">
+        <CrontabWeek
+          @update="updateCrontabValue"
+          :check="checkNumber"
+          :cron="crontabValueObj"
+          ref="cronweek"
+        />
+      </el-tab-pane>
+
+      <el-tab-pane label="年" v-if="shouldHide('year')">
+        <CrontabYear
+          @update="updateCrontabValue"
+          :check="checkNumber"
+          :cron="crontabValueObj"
+          ref="cronyear"
+        />
+      </el-tab-pane>
+    </el-tabs>
 
+    <div class="popup-main">
+      <div class="popup-result">
+        <p class="title">时间表达式</p>
+        <table>
+          <thead>
+            <th v-for="item of tabTitles" width="40" :key="item">{{ item }}</th>
+            <th>Cron 表达式</th>
+          </thead>
+          <tbody>
+            <td>
+              <span>{{ crontabValueObj.second }}</span>
+            </td>
+            <td>
+              <span>{{ crontabValueObj.min }}</span>
+            </td>
+            <td>
+              <span>{{ crontabValueObj.hour }}</span>
+            </td>
+            <td>
+              <span>{{ crontabValueObj.day }}</span>
+            </td>
+            <td>
+              <span>{{ crontabValueObj.month }}</span>
+            </td>
+            <td>
+              <span>{{ crontabValueObj.week }}</span>
+            </td>
+            <td>
+              <span>{{ crontabValueObj.year }}</span>
+            </td>
+            <td>
+              <span>{{ crontabValueString }}</span>
+            </td>
+          </tbody>
+        </table>
+      </div>
+      <CrontabResult :ex="crontabValueString" />
+
+      <div class="pop_btn">
+        <el-button type="primary" @click="submitFill">确定</el-button>
+        <el-button type="warning" @click="clearCron">重置</el-button>
+        <el-button @click="hidePopup">取消</el-button>
+      </div>
+    </div>
+  </div>
+</template>
 <style scoped>
 .pop_btn {
   text-align: center;