完善任务管理
This commit is contained in:
150
src/components/CronModal/components/Day.vue
Normal file
150
src/components/CronModal/components/Day.vue
Normal file
@@ -0,0 +1,150 @@
|
||||
<script setup lang="ts">
|
||||
import { reactive, watch, onBeforeMount } from 'vue';
|
||||
import { useI18n } from "vue-i18n";
|
||||
const { t } = useI18n();
|
||||
|
||||
const emit = defineEmits(['update:value']);
|
||||
const props = defineProps({
|
||||
value: {
|
||||
type: String,
|
||||
default: '*',
|
||||
},
|
||||
});
|
||||
|
||||
/**指定列表初始数据 */
|
||||
const optionsSpecific = Array.from({ length: 31 }, (_, i) => {
|
||||
let idx = i + 1;
|
||||
return {
|
||||
label: `${idx}`,
|
||||
value: `${idx}`,
|
||||
};
|
||||
});
|
||||
|
||||
/**数据 */
|
||||
let data = reactive({
|
||||
type: '1',
|
||||
/**间隔 */
|
||||
increment: 2,
|
||||
incrementStart: 1,
|
||||
/**周期 */
|
||||
rangeStart: 1,
|
||||
rangeEnd: 2,
|
||||
/**指定 */
|
||||
specific: ['1'],
|
||||
});
|
||||
|
||||
/**监听数据,将数值格式化 */
|
||||
watch(data, () => {
|
||||
let reultValue = '*';
|
||||
let val = data.type;
|
||||
// 每一
|
||||
if (val === '1') {
|
||||
reultValue = '*';
|
||||
}
|
||||
// 间隔
|
||||
if (val === '2') {
|
||||
let start = data.incrementStart;
|
||||
let increment = data.increment;
|
||||
reultValue = `${start ?? 0}/${increment ?? 0}`;
|
||||
}
|
||||
// 周期
|
||||
if (val === '3') {
|
||||
let start = data.rangeStart;
|
||||
let end = data.rangeEnd;
|
||||
reultValue = `${start ?? 0}-${end ?? 0}`;
|
||||
}
|
||||
// 指定
|
||||
if (val === '4') {
|
||||
reultValue = data.specific.sort((a, b) => +a - +b).join(',');
|
||||
}
|
||||
emit('update:value', reultValue);
|
||||
});
|
||||
|
||||
/**挂载前初始属性 */
|
||||
onBeforeMount(() => {
|
||||
const val = props.value;
|
||||
if (val === '*') {
|
||||
data.type = '1';
|
||||
}
|
||||
if (val.includes('/')) {
|
||||
const arr = val.split('/');
|
||||
data.incrementStart = Number(arr[0]);
|
||||
data.increment = Number(arr[1]);
|
||||
data.type = '2';
|
||||
}
|
||||
if (val.includes('-')) {
|
||||
const arr = val.split('-');
|
||||
data.rangeStart = Number(arr[0]);
|
||||
data.rangeEnd = Number(arr[1]);
|
||||
data.type = '3';
|
||||
}
|
||||
if (val.includes(',')) {
|
||||
data.specific = val.split(',').sort((a, b) => +a - +b);
|
||||
data.type = '4';
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<a-radio-group size="small" v-model:value="data.type">
|
||||
<a-space direction="vertical" :size="18">
|
||||
<a-radio value="1">
|
||||
{{ t('components.CronModal.day1') }}
|
||||
</a-radio>
|
||||
<a-radio value="2">
|
||||
{{ t('components.CronModal.day21') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.increment"
|
||||
:min="1"
|
||||
:max="31"
|
||||
placeholder="1-31"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.day22') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.incrementStart"
|
||||
:min="1"
|
||||
:max="31"
|
||||
placeholder="1-31"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.day23') }}
|
||||
</a-radio>
|
||||
<a-radio value="3">
|
||||
{{ t('components.CronModal.day31') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeStart"
|
||||
:min="1"
|
||||
:max="31"
|
||||
placeholder="1-31"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.day32') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeEnd"
|
||||
:min="1"
|
||||
:max="31"
|
||||
placeholder="1-31"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.day33') }}
|
||||
</a-radio>
|
||||
<a-radio value="4">
|
||||
{{ t('components.CronModal.day4') }}
|
||||
</a-radio>
|
||||
<a-select
|
||||
v-model:value="data.specific"
|
||||
size="small"
|
||||
mode="multiple"
|
||||
style="width: 100%"
|
||||
:placeholder="t('components.CronModal.day4')"
|
||||
:options="optionsSpecific"
|
||||
></a-select>
|
||||
<a-radio value="5">
|
||||
{{ t('components.CronModal.day5') }}
|
||||
</a-radio>
|
||||
</a-space>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
144
src/components/CronModal/components/Hour.vue
Normal file
144
src/components/CronModal/components/Hour.vue
Normal file
@@ -0,0 +1,144 @@
|
||||
<script setup lang="ts">
|
||||
import { reactive, watch, onBeforeMount } from 'vue';
|
||||
import { useI18n } from "vue-i18n";
|
||||
const { t } = useI18n();
|
||||
|
||||
const emit = defineEmits(['update:value']);
|
||||
const props = defineProps({
|
||||
value: {
|
||||
type: String,
|
||||
default: '*',
|
||||
},
|
||||
});
|
||||
|
||||
/**指定列表初始数据 */
|
||||
const optionsSpecific = Array.from({ length: 24 }, (_, i) => ({
|
||||
label: `${i}`.padStart(2, '0'),
|
||||
value: `${i}`,
|
||||
}));
|
||||
|
||||
/**数据 */
|
||||
let data = reactive({
|
||||
type: '1',
|
||||
/**间隔 */
|
||||
increment: 2,
|
||||
incrementStart: 0,
|
||||
/**周期 */
|
||||
rangeStart: 0,
|
||||
rangeEnd: 2,
|
||||
/**指定 */
|
||||
specific: ['0'],
|
||||
});
|
||||
|
||||
/**监听数据,将数值格式化 */
|
||||
watch(data, () => {
|
||||
let reultValue = '*';
|
||||
let val = data.type;
|
||||
// 每一
|
||||
if (val === '1') {
|
||||
reultValue = '*';
|
||||
}
|
||||
// 间隔
|
||||
if (val === '2') {
|
||||
let start = data.incrementStart;
|
||||
let increment = data.increment;
|
||||
reultValue = `${start ?? 0}/${increment ?? 0}`;
|
||||
}
|
||||
// 周期
|
||||
if (val === '3') {
|
||||
let start = data.rangeStart;
|
||||
let end = data.rangeEnd;
|
||||
reultValue = `${start ?? 0}-${end ?? 0}`;
|
||||
}
|
||||
// 指定
|
||||
if (val === '4') {
|
||||
reultValue = data.specific.sort((a, b) => +a - +b).join(',');
|
||||
}
|
||||
emit('update:value', reultValue);
|
||||
});
|
||||
|
||||
/**挂载前初始属性 */
|
||||
onBeforeMount(() => {
|
||||
const val = props.value;
|
||||
if (val === '*') {
|
||||
data.type = '1';
|
||||
}
|
||||
if (val.includes('/')) {
|
||||
const arr = val.split('/');
|
||||
data.incrementStart = Number(arr[0]);
|
||||
data.increment = Number(arr[1]);
|
||||
data.type = '2';
|
||||
}
|
||||
if (val.includes('-')) {
|
||||
const arr = val.split('-');
|
||||
data.rangeStart = Number(arr[0]);
|
||||
data.rangeEnd = Number(arr[1]);
|
||||
data.type = '3';
|
||||
}
|
||||
if (val.includes(',')) {
|
||||
data.specific = val.split(',').sort((a, b) => +a - +b);
|
||||
data.type = '4';
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<a-radio-group size="small" v-model:value="data.type">
|
||||
<a-space direction="vertical" :size="18">
|
||||
<a-radio value="1">
|
||||
{{ t('components.CronModal.hour1') }}
|
||||
</a-radio>
|
||||
<a-radio value="2">
|
||||
{{ t('components.CronModal.hour21') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.increment"
|
||||
:min="0"
|
||||
:max="23"
|
||||
placeholder="0-23"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.hour22') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.incrementStart"
|
||||
:min="0"
|
||||
:max="23"
|
||||
placeholder="0-23"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.hour23') }}
|
||||
</a-radio>
|
||||
<a-radio value="3">
|
||||
{{ t('components.CronModal.hour31') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeStart"
|
||||
:min="0"
|
||||
:max="23"
|
||||
placeholder="1-23"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.hour32') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeEnd"
|
||||
:min="0"
|
||||
:max="23"
|
||||
placeholder="0-23"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.hour33') }}
|
||||
</a-radio>
|
||||
<a-radio value="4">
|
||||
{{ t('components.CronModal.hour4') }}
|
||||
</a-radio>
|
||||
<a-select
|
||||
v-model:value="data.specific"
|
||||
size="small"
|
||||
mode="multiple"
|
||||
style="width: 100%"
|
||||
:placeholder="t('components.CronModal.hour4')"
|
||||
:options="optionsSpecific"
|
||||
></a-select>
|
||||
</a-space>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
146
src/components/CronModal/components/Minute.vue
Normal file
146
src/components/CronModal/components/Minute.vue
Normal file
@@ -0,0 +1,146 @@
|
||||
<script setup lang="ts">
|
||||
import { reactive, watch, onBeforeMount } from 'vue';
|
||||
import { useI18n } from "vue-i18n";
|
||||
const { t } = useI18n();
|
||||
|
||||
const emit = defineEmits(['update:value']);
|
||||
const props = defineProps({
|
||||
value: {
|
||||
type: String,
|
||||
default: '*',
|
||||
},
|
||||
});
|
||||
|
||||
/**指定列表初始数据 */
|
||||
const optionsSpecific = Array.from({ length: 60 }, (_, i) => {
|
||||
return {
|
||||
label: `${i}`.padStart(2, '0'),
|
||||
value: `${i}`,
|
||||
};
|
||||
});
|
||||
|
||||
/**数据 */
|
||||
let data = reactive({
|
||||
type: '1',
|
||||
/**间隔 */
|
||||
increment: 1,
|
||||
incrementStart: 0,
|
||||
/**周期 */
|
||||
rangeStart: 1,
|
||||
rangeEnd: 2,
|
||||
/**指定 */
|
||||
specific: ['0'],
|
||||
});
|
||||
|
||||
/**监听数据,将数值格式化 */
|
||||
watch(data, () => {
|
||||
let reultValue = '*';
|
||||
let val = data.type;
|
||||
// 每一
|
||||
if (val === '1') {
|
||||
reultValue = '*';
|
||||
}
|
||||
// 间隔
|
||||
if (val === '2') {
|
||||
let start = data.incrementStart;
|
||||
let increment = data.increment;
|
||||
reultValue = `${start ?? 0}/${increment ?? 0}`;
|
||||
}
|
||||
// 周期
|
||||
if (val === '3') {
|
||||
let start = data.rangeStart;
|
||||
let end = data.rangeEnd;
|
||||
reultValue = `${start ?? 0}-${end ?? 0}`;
|
||||
}
|
||||
// 指定
|
||||
if (val === '4') {
|
||||
reultValue = data.specific.sort((a, b) => +a - +b).join(',');
|
||||
}
|
||||
emit('update:value', reultValue);
|
||||
});
|
||||
|
||||
/**挂载前初始属性 */
|
||||
onBeforeMount(() => {
|
||||
const val = props.value;
|
||||
if (val === '*') {
|
||||
data.type = '1';
|
||||
}
|
||||
if (val.includes('/')) {
|
||||
const arr = val.split('/');
|
||||
data.incrementStart = Number(arr[0]);
|
||||
data.increment = Number(arr[1]);
|
||||
data.type = '2';
|
||||
}
|
||||
if (val.includes('-')) {
|
||||
const arr = val.split('-');
|
||||
data.rangeStart = Number(arr[0]);
|
||||
data.rangeEnd = Number(arr[1]);
|
||||
data.type = '3';
|
||||
}
|
||||
if (val.includes(',')) {
|
||||
data.specific = val.split(',').sort((a, b) => +a - +b);
|
||||
data.type = '4';
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<a-radio-group size="small" v-model:value="data.type">
|
||||
<a-space direction="vertical" :size="18">
|
||||
<a-radio value="1">
|
||||
{{ t('components.CronModal.minute1') }}
|
||||
</a-radio>
|
||||
<a-radio value="2">
|
||||
{{ t('components.CronModal.minute21') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.increment"
|
||||
:min="0"
|
||||
:max="59"
|
||||
placeholder="0-59"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.minute22') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.incrementStart"
|
||||
:min="0"
|
||||
:max="59"
|
||||
placeholder="0-59"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.minute23') }}
|
||||
</a-radio>
|
||||
<a-radio value="3">
|
||||
{{ t('components.CronModal.minute31') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeStart"
|
||||
:min="0"
|
||||
:max="59"
|
||||
placeholder="0-59"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.minute32') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeEnd"
|
||||
:min="0"
|
||||
:max="59"
|
||||
placeholder="0-59"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.minute33') }}
|
||||
</a-radio>
|
||||
<a-radio value="4">
|
||||
{{ t('components.CronModal.minute4') }}
|
||||
</a-radio>
|
||||
<a-select
|
||||
v-model:value="data.specific"
|
||||
size="small"
|
||||
mode="multiple"
|
||||
style="width: 100%"
|
||||
:placeholder="t('components.CronModal.minute4')"
|
||||
:options="optionsSpecific"
|
||||
></a-select>
|
||||
</a-space>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
148
src/components/CronModal/components/Month.vue
Normal file
148
src/components/CronModal/components/Month.vue
Normal file
@@ -0,0 +1,148 @@
|
||||
<script setup lang="ts">
|
||||
import { reactive, watch, onBeforeMount } from 'vue';
|
||||
import { useI18n } from "vue-i18n";
|
||||
const { t } = useI18n();
|
||||
|
||||
const emit = defineEmits(['update:value']);
|
||||
const props = defineProps({
|
||||
value: {
|
||||
type: String,
|
||||
default: '*',
|
||||
},
|
||||
});
|
||||
|
||||
/**指定列表初始数据 */
|
||||
const optionsSpecific = Array.from({ length: 12 }, (_, i) => {
|
||||
let idx = i + 1;
|
||||
return {
|
||||
label: `${idx}`,
|
||||
value: `${idx}`,
|
||||
};
|
||||
});
|
||||
|
||||
/**构建数据 */
|
||||
let data = reactive({
|
||||
/**类型 */
|
||||
type: '1',
|
||||
/**间隔 */
|
||||
increment: 1,
|
||||
incrementStart: 1,
|
||||
/**周期 */
|
||||
rangeStart: 1,
|
||||
rangeEnd: 2,
|
||||
/**指定秒 */
|
||||
specific: ['1'],
|
||||
});
|
||||
|
||||
/**监听数据,将数值格式化 */
|
||||
watch(data, () => {
|
||||
let reultValue = '*';
|
||||
let val = data.type;
|
||||
// 每一
|
||||
if (val === '1') {
|
||||
reultValue = '*';
|
||||
}
|
||||
// 间隔
|
||||
if (val === '2') {
|
||||
let start = data.incrementStart;
|
||||
let increment = data.increment;
|
||||
reultValue = `${start ?? 0}/${increment ?? 0}`;
|
||||
}
|
||||
// 周期
|
||||
if (val === '3') {
|
||||
let start = data.rangeStart;
|
||||
let end = data.rangeEnd;
|
||||
reultValue = `${start ?? 0}-${end ?? 0}`;
|
||||
}
|
||||
// 指定
|
||||
if (val === '4') {
|
||||
reultValue = data.specific.sort((a, b) => +a - +b).join(',');
|
||||
}
|
||||
emit('update:value', reultValue);
|
||||
});
|
||||
|
||||
/**挂载前初始属性 */
|
||||
onBeforeMount(() => {
|
||||
const val = props.value;
|
||||
if (val === '*') {
|
||||
data.type = '1';
|
||||
}
|
||||
if (val.includes('/')) {
|
||||
const arr = val.split('/');
|
||||
data.incrementStart = Number(arr[0]);
|
||||
data.increment = Number(arr[1]);
|
||||
data.type = '2';
|
||||
}
|
||||
if (val.includes('-')) {
|
||||
const arr = val.split('-');
|
||||
data.rangeStart = Number(arr[0]);
|
||||
data.rangeEnd = Number(arr[1]);
|
||||
data.type = '3';
|
||||
}
|
||||
if (val.includes(',')) {
|
||||
data.specific = val.split(',').sort((a, b) => +a - +b);
|
||||
data.type = '4';
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<a-radio-group size="small" v-model:value="data.type">
|
||||
<a-space direction="vertical" :size="18">
|
||||
<a-radio value="1">
|
||||
{{ t('components.CronModal.month1') }}
|
||||
</a-radio>
|
||||
<a-radio value="2">
|
||||
{{ t('components.CronModal.month21') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.increment"
|
||||
:min="1"
|
||||
:max="12"
|
||||
placeholder="1-12"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.month22') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.incrementStart"
|
||||
:min="1"
|
||||
:max="12"
|
||||
placeholder="1-12"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.month23') }}
|
||||
</a-radio>
|
||||
<a-radio value="3">
|
||||
{{ t('components.CronModal.month31') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeStart"
|
||||
:min="1"
|
||||
:max="12"
|
||||
placeholder="1-12"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.month32') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeEnd"
|
||||
:min="1"
|
||||
:max="12"
|
||||
placeholder="1-12"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.month33') }}
|
||||
</a-radio>
|
||||
<a-radio value="4">
|
||||
{{ t('components.CronModal.month4') }}
|
||||
</a-radio>
|
||||
<a-select
|
||||
v-model:value="data.specific"
|
||||
size="small"
|
||||
mode="multiple"
|
||||
style="width: 100%"
|
||||
:placeholder="t('components.CronModal.month4')"
|
||||
:options="optionsSpecific"
|
||||
></a-select>
|
||||
</a-space>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
145
src/components/CronModal/components/Second.vue
Normal file
145
src/components/CronModal/components/Second.vue
Normal file
@@ -0,0 +1,145 @@
|
||||
<script setup lang="ts">
|
||||
import { reactive, watch, onBeforeMount } from 'vue';
|
||||
import { useI18n } from "vue-i18n";
|
||||
const { t } = useI18n();
|
||||
|
||||
const emit = defineEmits(['update:value']);
|
||||
const props = defineProps({
|
||||
value: {
|
||||
type: String,
|
||||
default: '*',
|
||||
},
|
||||
});
|
||||
|
||||
/**指定列表初始数据 */
|
||||
const optionsSpecific = Array.from({ length: 60 }, (_, i) => ({
|
||||
label: `${i}`.padStart(2, '0'),
|
||||
value: `${i}`,
|
||||
}));
|
||||
|
||||
/**构建数据 */
|
||||
let data = reactive({
|
||||
/**类型 */
|
||||
type: '1',
|
||||
/**间隔 */
|
||||
increment: 2,
|
||||
incrementStart: 0,
|
||||
/**周期 */
|
||||
rangeStart: 1,
|
||||
rangeEnd: 2,
|
||||
/**指定秒 */
|
||||
specific: ['0'],
|
||||
});
|
||||
|
||||
/**监听数据,将数值格式化 */
|
||||
watch(data, () => {
|
||||
let reultValue = '*';
|
||||
let val = data.type;
|
||||
// 每一
|
||||
if (val === '1') {
|
||||
reultValue = '*';
|
||||
}
|
||||
// 间隔
|
||||
if (val === '2') {
|
||||
let start = data.incrementStart;
|
||||
let increment = data.increment;
|
||||
reultValue = `${start ?? 0}/${increment ?? 0}`;
|
||||
}
|
||||
// 周期
|
||||
if (val === '3') {
|
||||
let start = data.rangeStart;
|
||||
let end = data.rangeEnd;
|
||||
reultValue = `${start ?? 0}-${end ?? 0}`;
|
||||
}
|
||||
// 指定
|
||||
if (val === '4') {
|
||||
reultValue = data.specific.sort((a, b) => +a - +b).join(',');
|
||||
}
|
||||
emit('update:value', reultValue);
|
||||
});
|
||||
|
||||
/**挂载前初始属性 */
|
||||
onBeforeMount(() => {
|
||||
const val = props.value;
|
||||
if (val === '*') {
|
||||
data.type = '1';
|
||||
}
|
||||
if (val.includes('/')) {
|
||||
const arr = val.split('/');
|
||||
data.incrementStart = Number(arr[0]);
|
||||
data.increment = Number(arr[1]);
|
||||
data.type = '2';
|
||||
}
|
||||
if (val.includes('-')) {
|
||||
const arr = val.split('-');
|
||||
data.rangeStart = Number(arr[0]);
|
||||
data.rangeEnd = Number(arr[1]);
|
||||
data.type = '3';
|
||||
}
|
||||
if (val.includes(',')) {
|
||||
data.specific = val.split(',').sort((a, b) => +a - +b);
|
||||
data.type = '4';
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<a-radio-group size="small" v-model:value="data.type">
|
||||
<a-space direction="vertical" :size="18">
|
||||
<a-radio value="1">
|
||||
{{ t('components.CronModal.second1') }}
|
||||
</a-radio>
|
||||
<a-radio value="2">
|
||||
{{ t('components.CronModal.second21') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.increment"
|
||||
:min="0"
|
||||
:max="59"
|
||||
placeholder="0-59"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.second22') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.incrementStart"
|
||||
:min="0"
|
||||
:max="59"
|
||||
placeholder="0-59"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.second23') }}
|
||||
</a-radio>
|
||||
<a-radio value="3">
|
||||
{{ t('components.CronModal.second31') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeStart"
|
||||
:min="0"
|
||||
:max="59"
|
||||
placeholder="0-59"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.second32') }}
|
||||
<a-input-number
|
||||
size="small"
|
||||
v-model:value="data.rangeEnd"
|
||||
:min="0"
|
||||
:max="59"
|
||||
placeholder="0-59"
|
||||
></a-input-number>
|
||||
{{ t('components.CronModal.second33') }}
|
||||
</a-radio>
|
||||
<a-radio value="4">
|
||||
{{ t('components.CronModal.second4') }}
|
||||
</a-radio>
|
||||
<a-select
|
||||
v-model:value="data.specific"
|
||||
size="small"
|
||||
mode="multiple"
|
||||
style="width: 100%"
|
||||
:placeholder="t('components.CronModal.second4')"
|
||||
:options="optionsSpecific"
|
||||
></a-select>
|
||||
</a-space>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
114
src/components/CronModal/index.vue
Normal file
114
src/components/CronModal/index.vue
Normal file
@@ -0,0 +1,114 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:destroyOnClose="true"
|
||||
:title="t('components.CronModal.title')"
|
||||
:open="props.open"
|
||||
:body-style="{ padding: '0 24px' }"
|
||||
@cancel="fnCronModal(false)"
|
||||
@ok="fnCronModal(true)"
|
||||
>
|
||||
<a-tabs tab-position="top" type="line">
|
||||
<a-tab-pane key="1" :tab="t('common.units.second')">
|
||||
<CronSecond v-model:value="cronValue.second"></CronSecond>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" :tab="t('common.units.minute')">
|
||||
<CronMinute v-model:value="cronValue.minute"></CronMinute>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" :tab="t('common.units.hour')">
|
||||
<CronHour v-model:value="cronValue.hour"></CronHour>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" :tab="t('common.units.day')">
|
||||
<CronDay v-model:value="cronValue.day"></CronDay>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="5" :tab="t('common.units.month')">
|
||||
<CronMonth v-model:value="cronValue.month"></CronMonth>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
|
||||
<a-input
|
||||
class="reultBox"
|
||||
:addon-before="t('components.CronModal.addon')"
|
||||
v-model:value="cronStr"
|
||||
disabled
|
||||
/>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import CronSecond from './components/Second.vue';
|
||||
import CronMinute from './components/Minute.vue';
|
||||
import CronHour from './components/Hour.vue';
|
||||
import CronDay from './components/Day.vue';
|
||||
import CronMonth from './components/Month.vue';
|
||||
import { reactive, computed, watch } from 'vue';
|
||||
import { useI18n } from "vue-i18n";
|
||||
const { t } = useI18n();
|
||||
|
||||
const emit = defineEmits(['cancel', 'ok', 'update:open']);
|
||||
const props = defineProps({
|
||||
open: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
cron: {
|
||||
type: String,
|
||||
default: '* * * * * ?',
|
||||
},
|
||||
});
|
||||
|
||||
/**cron属性值 */
|
||||
let cronValue = reactive({
|
||||
second: '*',
|
||||
minute: '*',
|
||||
hour: '*',
|
||||
day: '*',
|
||||
month: '*',
|
||||
week: '?',
|
||||
});
|
||||
|
||||
/**组合cron结果 */
|
||||
const cronStr = computed(() => {
|
||||
let time = `${cronValue.second} ${cronValue.minute} ${cronValue.hour}`;
|
||||
let date = `${cronValue.day} ${cronValue.month} ${cronValue.week}`;
|
||||
return `${time} ${date}`;
|
||||
});
|
||||
|
||||
/**监听是否显示,初始cron属性 */
|
||||
watch(
|
||||
() => props.open,
|
||||
val => {
|
||||
if (!val) return;
|
||||
const arr = props.cron.split(' ');
|
||||
// 6 位以上是合法表达式
|
||||
if (arr.length >= 6) {
|
||||
Object.assign(cronValue, {
|
||||
second: arr[0],
|
||||
minute: arr[1],
|
||||
hour: arr[2],
|
||||
day: arr[3],
|
||||
month: arr[4],
|
||||
week: arr[5],
|
||||
});
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
/**
|
||||
* 窗口事件
|
||||
* @param val modal触发事件
|
||||
*/
|
||||
function fnCronModal(val: boolean) {
|
||||
emit('update:open', false);
|
||||
if (val) {
|
||||
emit('ok', cronStr.value);
|
||||
} else {
|
||||
emit('cancel');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.reultBox {
|
||||
margin-top: 48px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
</style>
|
||||
@@ -50,7 +50,7 @@ function handleExport() {
|
||||
<div class="flex flex-wrap justify-end gap-x-12px gap-y-8px lt-sm:(w-200px py-12px)">
|
||||
<slot name="prefix"></slot>
|
||||
<slot name="default">
|
||||
<AButton v-if="isShowBtn(`system:${tableType}:add`)" size="small" ghost type="primary" @click="add">
|
||||
<AButton v-if="isShowBtn(`system:${tableType}:add`) && !notShowAdd" size="small" ghost type="primary" @click="add">
|
||||
<div class="flex-y-center gap-8px">
|
||||
<icon-ic-round-plus class="text-icon" />
|
||||
<span>{{ $t('common.add') }}</span>
|
||||
|
||||
@@ -24,8 +24,13 @@ const local: any = {
|
||||
config: 'Config',
|
||||
confirm: 'Confirm',
|
||||
delete: 'Delete',
|
||||
view: 'View',
|
||||
exportOk: "Export Completed",
|
||||
exportTip: "Confirm exporting xlsx table files based on search criteria?",
|
||||
deleteSuccess: 'Delete Success',
|
||||
confirmDelete: 'Are you sure you want to delete?',
|
||||
confirmClean: 'Are you sure you want to Clean?',
|
||||
clearText: "Clean",
|
||||
edit: 'Edit',
|
||||
index: 'Index',
|
||||
keywordSearch: 'Please enter keyword',
|
||||
@@ -55,7 +60,75 @@ const local: any = {
|
||||
abnormal: 'Abnormal',
|
||||
export: 'Export',
|
||||
loading: 'Loading',
|
||||
selectPlease: 'please select',
|
||||
disable: 'Disable',
|
||||
default: 'Default',
|
||||
system:'System',
|
||||
record: 'Record',
|
||||
noRecord: 'No Record',
|
||||
msgSuccess: 'Success {msg}',
|
||||
errorFields: 'Please fill in the required information in {num} correctly!',
|
||||
tipTitle: 'Prompt',
|
||||
units: {
|
||||
second: 'Second',
|
||||
minute: 'Minute',
|
||||
hour: 'Hour',
|
||||
day: 'Day',
|
||||
week: 'Week',
|
||||
month: 'Month',
|
||||
year: 'Year',
|
||||
core: 'Core',
|
||||
}
|
||||
},
|
||||
// 组件
|
||||
components: {
|
||||
CronModal: {
|
||||
title: "Cron Expression Generator",
|
||||
addon: "Expression Preview:",
|
||||
day1: "Every day",
|
||||
day21: "Execute every",
|
||||
day22: "days, starting from the",
|
||||
day23: "day",
|
||||
day31: "Cycle from",
|
||||
day32: "to",
|
||||
day33: "days",
|
||||
day4: "Designated day (optional)",
|
||||
day5: "Last day of the month",
|
||||
hour1: "Hourly",
|
||||
hour21: "Execute every",
|
||||
hour22: "hours, starting from the",
|
||||
hour23: "hour",
|
||||
hour31: "Cycle time from",
|
||||
hour32: "to",
|
||||
hour33: "hours",
|
||||
hour4: "Specified hours (multiple options available)",
|
||||
minute1: "Every minute",
|
||||
minute21: "Execute every",
|
||||
minute22: "minutes, starting from the",
|
||||
minute23: "minute",
|
||||
minute31: "Cycle time from",
|
||||
minute32: "to",
|
||||
minute33: "minutes",
|
||||
minute4: "Specified minutes (multiple options available)",
|
||||
month1: "Every month",
|
||||
month21: "Execute every",
|
||||
month22: "months, starting from the",
|
||||
month23: "month",
|
||||
month31: "Cycle time from",
|
||||
month32: "to",
|
||||
month33: "months",
|
||||
month4: "Specified months (multiple options available)",
|
||||
second1: "Every second",
|
||||
second21: "Execute every",
|
||||
second22: "seconds, starting from the",
|
||||
second23: "second",
|
||||
second31: "Cycle time from",
|
||||
second32: "to",
|
||||
second33: "seconds",
|
||||
second4: "Specify the number of seconds (multiple selectable)",
|
||||
},
|
||||
},
|
||||
|
||||
request: {
|
||||
logout: 'Logout user after request failed',
|
||||
logoutMsg: 'User status is invalid, please log in again',
|
||||
@@ -517,7 +590,27 @@ const local: any = {
|
||||
viewJob:'View Job',
|
||||
addJob:'Add Job',
|
||||
editJob:'Edit Job',
|
||||
viewInfoErr:'Failed to get job information',
|
||||
getInfoError:'Get Info Error',
|
||||
jobNamePlease: 'Please enter the task name correctly, limited to 2-50 characters',
|
||||
invokeTargetPlease: 'Please enter the call target correctly, limited to 2-50 characters.',
|
||||
cronExpressionPlease: 'Please enter or generate a cron execution expression',
|
||||
jobGroup: "Job Group",
|
||||
saveLog: "Save Log",
|
||||
invokeTargetTip: "Parameter description: support for preset incoming parameters, serialized processing parameters in the processor",
|
||||
cronExpressionTip: "Example of an expression:0/20 * * * * ?",
|
||||
cronExpressionTip1: "Illustrative example: Execute tasks every 20 seconds",
|
||||
cronExpressionNew: "Generating Expression",
|
||||
targetParamsPlease: 'Call target incoming parameters, only support json strings',
|
||||
delTip: "Are you sure you want to delete task number [{num}]?",
|
||||
delLogTip: "Are you sure you want to delete Log number [{num}]?",
|
||||
runOneTip: "Are you sure you want to perform a [{num}] task right away?",
|
||||
runOneOk: "{num} Executed successfully",
|
||||
runOne:'execute once',
|
||||
jobLog: "Task Log",
|
||||
jobMessage: "Task Message",
|
||||
clearTip: "Confirm that all dispatch log data items are cleared?",
|
||||
clearOk: "Cleared Successfully",
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -24,8 +24,13 @@ const local:any = {
|
||||
config: '配置',
|
||||
confirm: '确认',
|
||||
delete: '删除',
|
||||
view:'查看',
|
||||
exportOk: "已完成导出",
|
||||
exportTip: "确认根据搜索条件导出xlsx表格文件吗?",
|
||||
deleteSuccess: '删除成功',
|
||||
confirmDelete: '确认删除吗?',
|
||||
confirmClean: '确认清空吗?',
|
||||
clearText: "清空",
|
||||
edit: '编辑',
|
||||
index: '序号',
|
||||
keywordSearch: '请输入关键词搜索',
|
||||
@@ -55,7 +60,75 @@ const local:any = {
|
||||
abnormal: '异常',
|
||||
export:'导出',
|
||||
loading: '加载中...',
|
||||
selectPlease: '请选择',
|
||||
disable: '停用',
|
||||
default: '默认',
|
||||
system:'系统',
|
||||
record: '记录',
|
||||
noRecord: '不记录',
|
||||
msgSuccess: '{msg} 成功',
|
||||
errorFields: '请正确填写 {num} 处必填信息!',
|
||||
tipTitle: '提示',
|
||||
units: {
|
||||
second: '秒',
|
||||
minute: '分钟',
|
||||
hour: '小时',
|
||||
day: '天',
|
||||
week: '周',
|
||||
month: '月',
|
||||
year: '年',
|
||||
core: '核',
|
||||
}
|
||||
},
|
||||
// 组件
|
||||
components: {
|
||||
CronModal: {
|
||||
title: "Cron表达式生成",
|
||||
addon: "表达式预览:",
|
||||
day1: "每一天",
|
||||
day21: "每隔",
|
||||
day22: "天执行一次,从",
|
||||
day23: "日开始",
|
||||
day31: "周期从",
|
||||
day32: "到",
|
||||
day33: "日",
|
||||
day4: "指定日(可多选)",
|
||||
day5: "本月最后一天",
|
||||
hour1: "每一小时",
|
||||
hour21: "每隔",
|
||||
hour22: "小时执行一次,从",
|
||||
hour23: "时开始",
|
||||
hour31: "周期从",
|
||||
hour32: "到",
|
||||
hour33: "小时",
|
||||
hour4: "指定小时(可多选)",
|
||||
minute1: "每一分钟",
|
||||
minute21: "每隔",
|
||||
minute22: "分钟执行一次,从",
|
||||
minute23: "分钟开始",
|
||||
minute31: "周期从",
|
||||
minute32: "到",
|
||||
minute33: "分钟",
|
||||
minute4: "指定分钟(可多选)",
|
||||
month1: "每一月",
|
||||
month21: "每隔",
|
||||
month22: "月执行,从",
|
||||
month23: "月开始",
|
||||
month31: "周期从",
|
||||
month32: "到",
|
||||
month33: "月之间的每个月",
|
||||
month4: "指定月(可多选)",
|
||||
second1: "每一秒钟",
|
||||
second21: "每隔",
|
||||
second22: "秒执行一次,从",
|
||||
second23: "秒开始",
|
||||
second31: "周期从",
|
||||
second32: "到",
|
||||
second33: "秒",
|
||||
second4: "指定秒数(可多选)",
|
||||
}
|
||||
},
|
||||
|
||||
request: {
|
||||
logout: '请求失败后登出用户',
|
||||
logoutMsg: '用户状态失效,请重新登录',
|
||||
@@ -504,7 +577,7 @@ const local:any = {
|
||||
other:'其他',
|
||||
},
|
||||
task:{
|
||||
taskId:'ID',
|
||||
taskId:'编号',
|
||||
taskName:'任务名称',
|
||||
group:'任务组名',
|
||||
invoke:'调用目标',
|
||||
@@ -519,6 +592,25 @@ const local:any = {
|
||||
editJob:'编辑任务',
|
||||
viewInfoErr:'查看异常信息',
|
||||
getInfoError:'获取信息失败',
|
||||
jobNamePlease: '请正确输入任务名称,限2-50个字符',
|
||||
invokeTargetPlease: '请正确输入调用目标,限2-50个字符',
|
||||
cronExpressionPlease: '请输入或生成cron执行表达式',
|
||||
jobGroup: "任务组名",
|
||||
saveLog: "记录日志",
|
||||
invokeTargetTip: "参数说明:支持预设传入参数,在处理器中进行序列化处理参数",
|
||||
cronExpressionTip: "表达式示例:0/20 * * * * ?",
|
||||
cronExpressionTip1: "示例说明:每20秒执行任务",
|
||||
cronExpressionNew: "生成表达式",
|
||||
targetParamsPlease: '调用目标传入参数,仅支持json字符串',
|
||||
delTip: "确认删除定时任务编号为 【{num}】 任务吗?",
|
||||
delLogTip: "确认删除日志编号为 【{num}】 任务日志吗?",
|
||||
runOneTip: "确定要立即执行一次 【{num}】 任务吗?",
|
||||
runOneOk: "{num} 执行成功",
|
||||
runOne:'执行一次',
|
||||
jobLog: "任务日志",
|
||||
jobMessage: "执行信息",
|
||||
clearTip: "确认清空所有调度日志数据项吗?",
|
||||
clearOk: "清空成功",
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -16,3 +16,88 @@ export function doGetjobInfo(paramsId: any) {
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 新增定时任务调度
|
||||
* @param data 任务对象
|
||||
* @returns object
|
||||
*/
|
||||
export function addJob(data: Record<string, any>) {
|
||||
return request({
|
||||
url: '/schedule/job',
|
||||
method: 'post',
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 修改定时任务调度
|
||||
* @param data 任务对象
|
||||
* @returns object
|
||||
*/
|
||||
export function updateJob(data: Record<string, any>) {
|
||||
return request({
|
||||
url: '/schedule/job',
|
||||
method: 'put',
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除调度日志
|
||||
* @param jobIds 任务日志Id
|
||||
* @returns object
|
||||
*/
|
||||
export function delJobLog(jobIds: string) {
|
||||
return request({
|
||||
url: `/schedule/job/${jobIds}`,
|
||||
method: 'delete',
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 定时任务立即执行一次
|
||||
* @param jobId 任务ID
|
||||
* @returns object
|
||||
*/
|
||||
export function runJob(jobId: string) {
|
||||
return request({
|
||||
url: `/schedule/job/run`,
|
||||
method: 'put',
|
||||
data: {jobId},
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 任务状态修改
|
||||
* @param jobId 任务ID
|
||||
* @param status 变更状态值
|
||||
* @returns
|
||||
*/
|
||||
export function changeJobStatus(
|
||||
jobId: string | number,
|
||||
status: string | number
|
||||
) {
|
||||
return request({
|
||||
url: '/schedule/job/changeStatus',
|
||||
method: 'put',
|
||||
data: {
|
||||
jobId,
|
||||
status,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 定时任务调度列表导出
|
||||
* @param query 查询参数
|
||||
* @returns bolb
|
||||
*/
|
||||
export function exportJob() {
|
||||
return request({
|
||||
url: '/schedule/job/export',
|
||||
method: 'post',
|
||||
responseType: 'blob',
|
||||
});
|
||||
}
|
||||
|
||||
@@ -3,19 +3,18 @@ import { message, Tag } from 'ant-design-vue';
|
||||
import type { Key } from 'ant-design-vue/es/_util/type';
|
||||
import { useTable, useTableOperate } from '@/hooks/common/table';
|
||||
import { SimpleScrollbar } from '~/packages/materials/src';
|
||||
import taskOperateDrawer from './modules/task-operate-drawer.vue';
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { SyncOutlined, SearchOutlined, ProfileOutlined, FormOutlined, DeleteOutlined, RocketOutlined, ContainerOutlined } from '@ant-design/icons-vue';
|
||||
import { SyncOutlined, SearchOutlined, ProfileOutlined, FormOutlined, DeleteOutlined, RocketOutlined, ContainerOutlined, FieldTimeOutlined, ExportOutlined } from '@ant-design/icons-vue';
|
||||
import { enableStatusOptions } from '@/constants/business';
|
||||
import { saveAs } from 'file-saver';
|
||||
import Form from 'ant-design-vue/es/form/Form';
|
||||
import Modal from 'ant-design-vue/es/modal/Modal';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const routePath = route.path;
|
||||
|
||||
import { useAntdForm, useFormRules } from '@/hooks/common/form';
|
||||
const { defaultRequiredRule, formRules } = useFormRules();
|
||||
|
||||
const rules = {
|
||||
jonName: defaultRequiredRule,
|
||||
invokeTarget: defaultRequiredRule,
|
||||
cronExpression: defaultRequiredRule,
|
||||
};
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
@@ -44,8 +43,50 @@ let modalState: any = reactive({
|
||||
},
|
||||
confirmLoading: false,
|
||||
openByCron: false,
|
||||
statusOpt: [
|
||||
{ label: t('common.normal'), value: '0' },
|
||||
{ label: t('common.disable'), value: '1' }
|
||||
],
|
||||
jobGroup: [
|
||||
{ label: t('common.default'), value: "DEFAULT" },
|
||||
{ label: t('common.system'), value: "SYSTEM" }
|
||||
],
|
||||
sysJobSaveLog: [
|
||||
{ label: t('common.record'), value: "0" },
|
||||
{ label: t('common.noRecord'), value: "1" }
|
||||
]
|
||||
});
|
||||
|
||||
/**对话框内表单属性和校验规则 */
|
||||
const modalStateFrom = Form.useForm(
|
||||
modalState.from,
|
||||
reactive({
|
||||
jobName: [
|
||||
{
|
||||
required: true,
|
||||
min: 2,
|
||||
max: 50,
|
||||
message: t('page.manage.task.jobNamePlease'),
|
||||
},
|
||||
],
|
||||
invokeTarget: [
|
||||
{
|
||||
required: true,
|
||||
min: 2,
|
||||
max: 50,
|
||||
message: t('page.manage.task.invokeTargetPlease'),
|
||||
},
|
||||
],
|
||||
cronExpression: [
|
||||
{
|
||||
required: true,
|
||||
min: 6,
|
||||
message: t('page.manage.task.cronExpressionPlease'),
|
||||
},
|
||||
],
|
||||
})
|
||||
);
|
||||
|
||||
const scrollConfig = computed(() => {
|
||||
return {
|
||||
y: wrapperElHeight.value - 72,
|
||||
@@ -53,11 +94,14 @@ const scrollConfig = computed(() => {
|
||||
};
|
||||
});
|
||||
|
||||
const { columns, columnChecks, data, loading, getData, mobilePagination, searchParams, resetSearchParams } = useTable({
|
||||
const { columns, data, loading, getData, mobilePagination, searchParams, resetSearchParams } = useTable({
|
||||
apiFn: doGetjobList,
|
||||
apiParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
jobName: '',
|
||||
jobGroup: '',
|
||||
status: ''
|
||||
},
|
||||
rowKey: 'jobId',
|
||||
columns: () => [
|
||||
@@ -78,22 +122,6 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
||||
dataIndex: 'jobGroup',
|
||||
title: t('page.manage.task.group'),
|
||||
align: 'center',
|
||||
// customRender: ({ record }: any) => {
|
||||
// if (record.operatorType === null) {
|
||||
// return null;
|
||||
// }
|
||||
// const tagMap: any = {
|
||||
// 0: t('page.manage.log.other'),
|
||||
// 1: t('page.manage.log.backUser'),
|
||||
// 2: t('page.manage.log.phoneUser'),
|
||||
// };
|
||||
// const tagColor: any = {
|
||||
// '0': 'pink',
|
||||
// '1': 'warning',
|
||||
// '2': 'blue',
|
||||
// };
|
||||
// return <Tag color={tagColor[record.operatorType]}>{tagMap[record.operatorType]}</Tag>;
|
||||
// }
|
||||
},
|
||||
{
|
||||
key: 'invokeTarget',
|
||||
@@ -132,74 +160,42 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
||||
title: t('common.operate'),
|
||||
align: 'center',
|
||||
width: 200,
|
||||
// customRender: ({ record }: any) =>
|
||||
// !record.admin && (
|
||||
// <div class="flex justify-around gap-8px">
|
||||
// <Popconfirm onConfirm={() => handleDelete(record.operId)} title={t('common.confirmDelete')}>
|
||||
// <a-button danger size="small">
|
||||
// <template #icon>
|
||||
// <SyncOutlined />
|
||||
// </template>
|
||||
// </a-button>
|
||||
// </Popconfirm>
|
||||
// </div>
|
||||
// )
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const {
|
||||
drawerVisible,
|
||||
operateType,
|
||||
editingData,
|
||||
handleAdd,
|
||||
checkedRowKeys,
|
||||
onBatchDeleted,
|
||||
onDeleted
|
||||
// closeDrawer
|
||||
} = useTableOperate(data, { getData, idKey: 'jobId' });
|
||||
const deptTreeData = ref<Api.Common.CommonTree>([]);
|
||||
|
||||
onMounted(() => {
|
||||
});
|
||||
|
||||
|
||||
async function handleBatchDelete() {
|
||||
const { error } = await doDeleteLog(checkedRowKeys.value);
|
||||
if (!error) {
|
||||
onBatchDeleted();
|
||||
}
|
||||
Modal.confirm({
|
||||
title: t('common.tipTitle'),
|
||||
content: t('page.manage.task.delTip', { num: checkedRowKeys.value.join(',') }),
|
||||
async onOk() {
|
||||
|
||||
const { error } = await doDeleteLog(checkedRowKeys.value);
|
||||
if (!error) {
|
||||
onBatchDeleted();
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
async function handleDelete(id: number) {
|
||||
const { error } = await doDeleteLog([id]);
|
||||
if (!error) {
|
||||
onDeleted();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function handleUserSelectChange(selectedRowKeys: Key[], selectedRows: any[]) {
|
||||
checkedRowKeys.value = selectedRowKeys as number[];
|
||||
}
|
||||
|
||||
function fnTest() {
|
||||
searchParams.value = {
|
||||
|
||||
};
|
||||
|
||||
resetSearchParams();
|
||||
// 使用 nextTick 确保视图更新后检查
|
||||
nextTick(() => {
|
||||
console.log(operateType)
|
||||
});
|
||||
}
|
||||
|
||||
async function fnRecordView(jobId: number) {
|
||||
// const { error, data } = await doGetjobInfo(jobId);
|
||||
// // if (!error) {
|
||||
// // onDeleted();
|
||||
// // }
|
||||
// console.log(data);
|
||||
|
||||
operateType.value = 'view';
|
||||
|
||||
if (modalState.confirmLoading) return;
|
||||
@@ -215,16 +211,44 @@ async function fnRecordView(jobId: number) {
|
||||
modalState.title = t('page.manage.task.viewJob');
|
||||
console.log(modalState.openByView);
|
||||
}
|
||||
// if (res.code === RESULT_CODE_SUCCESS && res.data) {
|
||||
// modalState.from = Object.assign(modalState.from, res.data);
|
||||
// modalState.title = t('views.manage.job.viewJob');
|
||||
// modalState.openByView = true;
|
||||
// } else {
|
||||
// message.error(t('views.manage.job.viewInfoErr'), 2);
|
||||
// }
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 对话框弹出确认执行函数
|
||||
* 进行表达规则校验
|
||||
*/
|
||||
function fnModalOk() {
|
||||
modalStateFrom
|
||||
.validate()
|
||||
.then(() => {
|
||||
modalState.confirmLoading = true;
|
||||
const from = toRaw(modalState.from);
|
||||
const job = from.jobId ? updateJob(from) : addJob(from);
|
||||
const key = 'job';
|
||||
message.loading({ content: t('common.loading'), key });
|
||||
job
|
||||
.then((res: any) => {
|
||||
if (!res.error) {
|
||||
message.success({
|
||||
content: t('common.msgSuccess', { msg: modalState.title }),
|
||||
key,
|
||||
duration: 2,
|
||||
});
|
||||
modalState.openByEdit = false;
|
||||
modalStateFrom.resetFields();
|
||||
getData();
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
modalState.confirmLoading = false;
|
||||
});
|
||||
})
|
||||
.catch(e => {
|
||||
message.error(t('common.errorFields', { num: e.errorFields.length }), 3);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 对话框弹出关闭执行函数
|
||||
@@ -233,7 +257,7 @@ async function fnRecordView(jobId: number) {
|
||||
function fnModalCancel() {
|
||||
modalState.openByEdit = false;
|
||||
modalState.openByView = false;
|
||||
// modalStateFrom.resetFields();
|
||||
modalStateFrom.resetFields();
|
||||
}
|
||||
|
||||
|
||||
@@ -264,6 +288,123 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 对话框弹出cron生成回调
|
||||
*/
|
||||
function fnModalCron(opt: boolean, cronStr?: string) {
|
||||
modalState.openByCron = opt;
|
||||
if (cronStr) {
|
||||
modalState.from.cronExpression = cronStr;
|
||||
}
|
||||
}
|
||||
|
||||
function fnRecordDelete(recordId: any) {
|
||||
Modal.confirm({
|
||||
title: t('common.tipTitle'),
|
||||
content: t('page.manage.task.delTip', { num: recordId }),
|
||||
async onOk() {
|
||||
|
||||
const { error } = await delJobLog(recordId);
|
||||
if (!error) {
|
||||
onDeleted();
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function fnRunTask(jobId: any) {
|
||||
Modal.confirm({
|
||||
title: t('common.tipTitle'),
|
||||
content: t('page.manage.task.runOneTip', { num: jobId }),
|
||||
async onOk() {
|
||||
const { error } = await runJob(jobId);
|
||||
if (!error) {
|
||||
message.success(t('page.manage.task.runOneOk'), 2);
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**跳转任务日志页面 */
|
||||
function fnJobLogView(jobId: string | number = '0') {
|
||||
console.log(`${routePath}/log/${jobId}`)
|
||||
router.push(`${routePath}/log?jobId=${jobId}`);
|
||||
}
|
||||
|
||||
/**
|
||||
* 任务状态修改
|
||||
* @param row 任务信息对象
|
||||
*/
|
||||
function fnRecordStatus(row: Record<string, string>) {
|
||||
doGetType(row.jobId).then((res: any) => {
|
||||
console.log(res);
|
||||
})
|
||||
const sysJobStatus = [
|
||||
{
|
||||
"label": t('common.normal'),
|
||||
"value": "0",
|
||||
"tagType": "",
|
||||
"tagClass": ""
|
||||
},
|
||||
{
|
||||
"label": t('common.disable'),
|
||||
"value": "1",
|
||||
"tagType": "",
|
||||
"tagClass": ""
|
||||
}
|
||||
];
|
||||
const text =
|
||||
row.status === '1'
|
||||
? sysJobStatus.find(s => s.value === '1')?.label
|
||||
: sysJobStatus.find(s => s.value === '0')?.label;
|
||||
Modal.confirm({
|
||||
title: t('common.tipTitle'),
|
||||
content: t('views.monitor.job.statusChange', { text, num: row.jobName }),
|
||||
onOk() {
|
||||
const key = 'changeJobStatus';
|
||||
message.loading({ content: t('common.loading'), key });
|
||||
changeJobStatus(row.jobId, row.status).then(res => {
|
||||
if (!res.error) {
|
||||
message.success({
|
||||
content: t('common.msgSuccess', { msg: `${row.jobName} ${text}` }),
|
||||
key,
|
||||
duration: 2,
|
||||
});
|
||||
}
|
||||
getData();
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
const value =
|
||||
row.status === '1'
|
||||
? sysJobStatus.find(s => s.value === '0')?.value
|
||||
: sysJobStatus.find(s => s.value === '1')?.value;
|
||||
row.status = value || '0';
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function fnExportList() {
|
||||
Modal.confirm({
|
||||
title: t('common.tipTitle'),
|
||||
content: t('common.exportTip'),
|
||||
onOk() {
|
||||
const key = 'exportJob';
|
||||
message.loading({ content: t('common.loading'), key });
|
||||
exportJob().then(res => {
|
||||
if (!res.error) {
|
||||
message.success({
|
||||
content: t('common.exportOk'),
|
||||
key,
|
||||
duration: 2,
|
||||
});
|
||||
saveAs(res.data, `job_${Date.now()}.xlsx`);
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -274,14 +415,14 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
<AForm :model="searchParams" :label-width="80">
|
||||
<ARow :gutter="[16, 16]" wrap>
|
||||
<ACol :lg="6" :md="12" :xs="24">
|
||||
<AFormItem label="Name" name="operIp" class="m-0">
|
||||
<AInput v-model:value="searchParams.operIp" />
|
||||
<AFormItem label="Name" name="jobName" class="m-0">
|
||||
<AInput v-model:value="searchParams.jobName" />
|
||||
</AFormItem>
|
||||
</ACol>
|
||||
|
||||
<ACol :lg="6" :md="12" :xs="24">
|
||||
<AFormItem label="Group" name="title" class="m-0">
|
||||
<AInput v-model:value="searchParams.title" />
|
||||
<AFormItem label="Group" name="jobGroup" class="m-0">
|
||||
<AInput v-model:value="searchParams.jobGroup" />
|
||||
</AFormItem>
|
||||
</ACol>
|
||||
|
||||
@@ -302,7 +443,7 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
<AFormItem class="m-0">
|
||||
<div class="w-full flex-y-center justify-end gap-8px">
|
||||
<a-space :size="8">
|
||||
<a-button @click="fnTest">
|
||||
<a-button @click="resetSearchParams">
|
||||
<template #icon>
|
||||
<SyncOutlined />
|
||||
</template>
|
||||
@@ -326,10 +467,6 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
<ACard title="Task Management" :bordered="false" :body-style="{ flex: 1, overflow: 'hidden' }"
|
||||
class="flex-col-stretch sm:flex-1-hidden card-wrapper">
|
||||
<template #extra>
|
||||
<!-- <TableHeaderOperation v-model:columns="columnChecks" :disabled-delete="checkedRowKeys.length === 0"
|
||||
:loading="loading" :show-delete="true" @add="handleAdd" @delete="handleBatchDelete" @refresh="getData"
|
||||
:showExport="true" :not-show-add="false" /> -->
|
||||
|
||||
<div class="flex flex-wrap justify-end gap-x-12px gap-y-8px lt-sm:(w-200px py-12px)">
|
||||
<slot name="prefix"></slot>
|
||||
<slot name="default">
|
||||
@@ -355,13 +492,21 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
<span>{{ $t('common.refresh') }}</span>
|
||||
</div>
|
||||
</AButton>
|
||||
<!-- <AButton size="small" type="primary" @click="handleExport" v-show="showExport">
|
||||
<div class="flex-y-center gap-8px">
|
||||
<icon-mdi-refresh class="text-icon" :class="{ 'animate-spin': loading }" />
|
||||
<span>{{ $t('common.export') }}</span>
|
||||
</div>
|
||||
</AButton> -->
|
||||
<TableColumnSetting v-model:columns="columns" />
|
||||
|
||||
<AButton size="small" type="primary" @click="fnExportList">
|
||||
<template #icon>
|
||||
<ExportOutlined />
|
||||
</template>
|
||||
<span>{{ $t('common.export') }}</span>
|
||||
</AButton>
|
||||
|
||||
<AButton size="small" type="default" @click.prevent="fnJobLogView()">
|
||||
<template #icon>
|
||||
<ContainerOutlined />
|
||||
</template>
|
||||
{{ t('page.manage.task.jobLog') }}
|
||||
</AButton>
|
||||
|
||||
<slot name="suffix"></slot>
|
||||
</div>
|
||||
</template>
|
||||
@@ -375,17 +520,14 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
<template #bodyCell="{ column, record }">
|
||||
|
||||
<template v-if="column.key === 'status'">
|
||||
<a-switch v-model:checked="record.status" checked-value="0" un-checked-value="1" size="small" />
|
||||
<!-- <DictTag :options="{
|
||||
'0': t('common.normal'),
|
||||
'1': t('common.abnormal'),
|
||||
}" :value="record.status" /> -->
|
||||
<a-switch v-model:checked="record.status" checked-value="0" un-checked-value="1" size="small"
|
||||
@change="fnRecordStatus(record)" />
|
||||
</template>
|
||||
|
||||
<template v-if="column.key === 'operate'">
|
||||
<a-space :size="8" align="center">
|
||||
<a-tooltip>
|
||||
<template #title>{{ 'View' }}</template>
|
||||
<template #title>{{ t('common.view') }}</template>
|
||||
<a-button type="link" @click.prevent="fnRecordView(record.jobId)">
|
||||
<template #icon>
|
||||
<ProfileOutlined />
|
||||
@@ -393,7 +535,7 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
<a-tooltip>
|
||||
<template #title>{{ 'Edit' }}</template>
|
||||
<template #title>{{ t('common.edit') }}</template>
|
||||
<a-button type="link" @click.prevent="fnModalVisibleByEdit(record.jobId)">
|
||||
<template #icon>
|
||||
<FormOutlined />
|
||||
@@ -402,8 +544,8 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
</a-tooltip>
|
||||
|
||||
<a-tooltip>
|
||||
<template #title>{{ 'Delete' }}</template>
|
||||
<a-button type="link">
|
||||
<template #title>{{ t('common.delete') }}</template>
|
||||
<a-button type="link" @click.prevent="fnRecordDelete(record.jobId)">
|
||||
<template #icon>
|
||||
<DeleteOutlined />
|
||||
</template>
|
||||
@@ -411,8 +553,8 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
</a-tooltip>
|
||||
|
||||
<a-tooltip>
|
||||
<template #title>{{ 'run' }}</template>
|
||||
<a-button type="link">
|
||||
<template #title>{{ t('page.manage.task.runOne') }}</template>
|
||||
<a-button type="link" @click.prevent="fnRunTask(record.jobId)">
|
||||
<template #icon>
|
||||
<RocketOutlined />
|
||||
</template>
|
||||
@@ -420,8 +562,8 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
</a-tooltip>
|
||||
|
||||
<a-tooltip>
|
||||
<template #title>{{ 'Job Log' }}</template>
|
||||
<a-button type="link">
|
||||
<template #title>{{ t('page.manage.task.jobLog') }}</template>
|
||||
<a-button type="link" @click.prevent="fnJobLogView(record.jobId)">
|
||||
<template #icon>
|
||||
<ContainerOutlined />
|
||||
</template>
|
||||
@@ -434,11 +576,6 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
</ATable>
|
||||
|
||||
|
||||
|
||||
<!-- <taskOperateDrawer v-model:visible="drawerVisible" :dept-tree-data="deptTreeData" :operate-type="operateType"
|
||||
:row-data="editingData" @submitted="getData" /> -->
|
||||
|
||||
|
||||
<!-- 详情框 -->
|
||||
<a-modal :width="800" v-model:open="modalState.openByView" :title="modalState.title" @cancel="fnModalCancel">
|
||||
<a-form layout=" horizontal" :label-col="{ span: 6 }" :label-wrap="true">
|
||||
@@ -528,10 +665,10 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
|
||||
|
||||
<!-- 新增框或修改框 -->
|
||||
<!-- <a-modal :drag="true" :width="800" :destroyOnClose="true" :keyboard="false" :mask-closable="false"
|
||||
<a-modal :width="800" :destroyOnClose="true" :keyboard="false" :mask-closable="false"
|
||||
:open="modalState.openByEdit" :title="modalState.title" :confirm-loading="modalState.confirmLoading"
|
||||
@ok="fnModalOk" @cancel="fnModalCancel">
|
||||
<a-form name="modalStateFrom" layout="horizontal" :label-col="{ span: 6 }" :label-wrap="true" :rules="rules">
|
||||
<a-form name="modalStateFrom" layout="horizontal" :label-col="{ span: 6 }" :label-wrap="true">
|
||||
<a-row>
|
||||
<a-col :lg="12" :md="12" :xs="24">
|
||||
<a-form-item :label="t('page.manage.task.taskName')" name="jobName">
|
||||
@@ -542,7 +679,7 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
<a-col :lg="12" :md="12" :xs="24">
|
||||
<a-form-item :label="t('page.manage.task.status')" name="status">
|
||||
<a-select v-model:value="modalState.from.status" default-value="0"
|
||||
:placeholder="t('common.selectPlease')" :options="dict.sysJobStatus">
|
||||
:placeholder="t('common.selectPlease')" :options="modalState.statusOpt">
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
@@ -552,20 +689,20 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
<a-col :lg="12" :md="12" :xs="24">
|
||||
<a-form-item :label="t('page.manage.task.jobGroup')" name="jobGroup">
|
||||
<a-select v-model:value="modalState.from.jobGroup" default-value="DEFAULT"
|
||||
:placeholder="t('common.selectPlease')" :options="dict.sysJobGroup">
|
||||
:placeholder="t('common.selectPlease')" :options="modalState.jobGroup">
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="12" :md="12" :xs="24">
|
||||
<a-form-item :label="t('page.manage.task.saveLog')" name="saveLog">
|
||||
<a-select v-model:value="modalState.from.saveLog" default-value="0"
|
||||
:placeholder="t('common.selectPlease')" :options="dict.sysJobSaveLog">
|
||||
:placeholder="t('common.selectPlease')" :options="modalState.sysJobSaveLog">
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-form-item :label="t('page.manage.task.invokeTarget')" name="invokeTarget" :label-col="{ span: 3 }"
|
||||
<a-form-item :label="t('page.manage.task.invoke')" name="invokeTarget" :label-col="{ span: 3 }"
|
||||
:label-wrap="true">
|
||||
<a-input v-model:value="modalState.from.invokeTarget" allow-clear
|
||||
:placeholder="t('page.manage.task.invokeTargetPlease')">
|
||||
@@ -580,7 +717,7 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
</a-input>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item :label="t('page.manage.task.cronExpression')" name="cronExpression" :label-col="{ span: 3 }"
|
||||
<a-form-item :label="t('page.manage.task.cron')" name="cronExpression" :label-col="{ span: 3 }"
|
||||
:label-wrap="true">
|
||||
<a-input v-model:value="modalState.from.cronExpression" allow-clear
|
||||
:placeholder="t('page.manage.task.cronExpressionPlease')">
|
||||
@@ -606,6 +743,7 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
</a-input>
|
||||
</a-form-item>
|
||||
|
||||
|
||||
<a-form-item :label="t('page.manage.task.targetParams')" name="targetParams" :label-col="{ span: 3 }"
|
||||
:label-wrap="true">
|
||||
<a-textarea v-model:value="modalState.from.targetParams" :auto-size="{ minRows: 2, maxRows: 6 }"
|
||||
@@ -618,8 +756,11 @@ function fnModalVisibleByEdit(jobId?: string | number) {
|
||||
:maxlength="400" :show-count="true" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-modal> -->
|
||||
</a-modal>
|
||||
|
||||
|
||||
<CronModal v-model:open="modalState.openByCron" :cron="modalState.from.cronExpression"
|
||||
@ok="fnModalCron(false, $event)"></CronModal>
|
||||
</ACard>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user