85 changed files with 2829 additions and 326 deletions
@ -1,31 +1,38 @@ |
|||
<template> |
|||
<div> |
|||
<CodeMirror basic :lang="language" class="overflow-y-auto" v-bind="attrs"></CodeMirror> |
|||
</div> |
|||
<q-field :v-bind="attrs"> |
|||
<template #control> |
|||
<div ref="codemirrorRef" class="border border-red-500" style="padding-top: 1px"></div> |
|||
</template> |
|||
</q-field> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { useAttrs, ref, onMounted } from 'vue'; |
|||
import CodeMirror from 'vue-codemirror6'; |
|||
import { java } from '@codemirror/lang-java'; |
|||
import { json } from '@codemirror/lang-json'; |
|||
import { sql } from '@codemirror/lang-sql'; |
|||
import { xml } from '@codemirror/lang-xml'; |
|||
import { ref, useAttrs, onMounted, onUnmounted } from 'vue'; |
|||
import { EditorView } from '@codemirror/view'; |
|||
import { basicSetup, basicTheme, getLanguage } from './Util'; |
|||
|
|||
const attrs = useAttrs(); |
|||
|
|||
const props = defineProps({ |
|||
lang: { type: String, default: 'json' }, |
|||
}); |
|||
|
|||
let language = json(); |
|||
if (props.lang === 'java') { |
|||
language = java(); |
|||
} else if (props.lang === 'json') { |
|||
language = json(); |
|||
} else if (props.lang === 'sql') { |
|||
language = sql(); |
|||
} else if (props.lang === 'xml') { |
|||
language = xml(); |
|||
} |
|||
const codemirrorRef = ref(); |
|||
let view; |
|||
|
|||
onMounted(() => { |
|||
view = new EditorView({ |
|||
extensions: [basicSetup, getLanguage(props.lang), basicTheme()], |
|||
parent: codemirrorRef.value, |
|||
}); |
|||
}); |
|||
|
|||
console.log(props.lang); |
|||
onUnmounted(() => { |
|||
view.destroy(); |
|||
}); |
|||
const value = ref('<xml><a name="name"></a></xml>'); |
|||
</script> |
|||
<style> |
|||
.cm-editor { |
|||
outline: none !important; |
|||
} |
|||
</style> |
|||
|
|||
@ -0,0 +1,31 @@ |
|||
<template> |
|||
<div> |
|||
<CodeMirror basic :lang="language" class="overflow-y-auto" v-bind="attrs"></CodeMirror> |
|||
</div> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { useAttrs, ref, onMounted } from 'vue'; |
|||
import CodeMirror from 'vue-codemirror6'; |
|||
import { java } from '@codemirror/lang-java'; |
|||
import { json } from '@codemirror/lang-json'; |
|||
import { sql } from '@codemirror/lang-sql'; |
|||
import { xml } from '@codemirror/lang-xml'; |
|||
|
|||
const attrs = useAttrs(); |
|||
const props = defineProps({ |
|||
lang: { type: String, default: 'json' }, |
|||
}); |
|||
|
|||
let language = json(); |
|||
if (props.lang === 'java') { |
|||
language = java(); |
|||
} else if (props.lang === 'json') { |
|||
language = json(); |
|||
} else if (props.lang === 'sql') { |
|||
language = sql(); |
|||
} else if (props.lang === 'xml') { |
|||
language = xml(); |
|||
} |
|||
|
|||
console.log(props.lang); |
|||
</script> |
|||
@ -0,0 +1,251 @@ |
|||
<template> |
|||
<q-list dense style="width: 100%"> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.day.per') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="notSpecify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.day.notSpecify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="period" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.day.period.1') }}</span> |
|||
<q-input |
|||
v-model="periodFromRef" |
|||
type="number" |
|||
:disable="!periodFromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.day.period.2') }}</span> |
|||
<q-input |
|||
v-model="periodToRef" |
|||
type="number" |
|||
:disable="!periodToEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.day.period.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per2" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.day.per2.1') }}</span> |
|||
<q-input |
|||
v-model="per2FromRef" |
|||
type="number" |
|||
:disable="!per2FromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.day.per2.2') }}</span> |
|||
<q-input |
|||
v-model="per2PerRef" |
|||
type="number" |
|||
:disable="!per2PerEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.day.per2.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
|
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="workDay" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.day.workDay.1') }}</span> |
|||
<q-input |
|||
v-model="workDayRef" |
|||
type="number" |
|||
:disable="!workDayEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.day.workDay.2') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
|
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="lastDay" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.day.lastDay') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
|
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="specify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.day.specify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row"> |
|||
<template v-for="index in 31" :key="index"> |
|||
<template v-if="index % 10 === 1"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
<div class="col-1"> |
|||
<q-checkbox |
|||
v-model="optionsRef[index - 1]" |
|||
dense |
|||
:label="'' + index" |
|||
:disable="!optionsEnableRef" |
|||
@update:model-value="valueChanged" |
|||
></q-checkbox> |
|||
</div> |
|||
<template v-if="index % 10 === 0"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
</template> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
</q-list> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
import { Tools } from '@/platform'; |
|||
|
|||
const props = defineProps({ |
|||
modelValue: { type: String, default: '' }, |
|||
}); |
|||
const emit = defineEmits(['update:modelValue']); |
|||
|
|||
const valueRef = ref(props.modelValue); |
|||
const modeRef = ref(''); |
|||
|
|||
const periodFromEnableRef = ref(false); |
|||
const periodFromRef = ref(''); |
|||
|
|||
const periodToEnableRef = ref(false); |
|||
const periodToRef = ref(''); |
|||
|
|||
const per2FromEnableRef = ref(false); |
|||
const per2FromRef = ref(''); |
|||
|
|||
const per2PerEnableRef = ref(false); |
|||
const per2PerRef = ref(''); |
|||
|
|||
const workDayEnableRef = ref(false); |
|||
const workDayRef = ref(''); |
|||
|
|||
const optionsEnableRef = ref(false); |
|||
const optionsRef = ref([]); |
|||
for (let i = 0; i < 31; i++) { |
|||
optionsRef.value.push(false); |
|||
} |
|||
|
|||
const valueChanged = () => { |
|||
if (modeRef.value === 'per') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
workDayEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'period') { |
|||
periodFromEnableRef.value = true; |
|||
periodToEnableRef.value = true; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
workDayEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'per2') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = true; |
|||
per2PerEnableRef.value = true; |
|||
workDayEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'workDay') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
workDayEnableRef.value = true; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'lastDay') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
workDayEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'specify') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
workDayEnableRef.value = false; |
|||
optionsEnableRef.value = true; |
|||
} |
|||
|
|||
if (modeRef.value === 'per') { |
|||
valueRef.value = '*'; |
|||
} else if (modeRef.value === 'period') { |
|||
valueRef.value = periodFromRef.value + '-' + periodToRef.value; |
|||
} else if (modeRef.value === 'per2') { |
|||
valueRef.value = per2FromRef.value + '/' + per2PerRef.value; |
|||
} else if (modeRef.value === 'workDay') { |
|||
valueRef.value = workDayRef.value + 'W'; |
|||
} else if (modeRef.value === 'lastDay') { |
|||
valueRef.value = 'L'; |
|||
} else if (modeRef.value === 'specify') { |
|||
let seconds = []; |
|||
for (let i = 0; i < 31; i++) { |
|||
if (optionsRef.value[i]) { |
|||
seconds.push(i + 1); |
|||
} |
|||
} |
|||
valueRef.value = Tools.join(seconds, ','); |
|||
} |
|||
|
|||
emit('update:modelValue', valueRef.value); |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,185 @@ |
|||
<template> |
|||
<q-list dense style="width: 100%"> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.hour.per') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="period" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.hour.period.1') }}</span> |
|||
<q-input |
|||
v-model="periodFromRef" |
|||
type="number" |
|||
:disable="!periodFromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.hour.period.2') }}</span> |
|||
<q-input |
|||
v-model="periodToRef" |
|||
type="number" |
|||
:disable="!periodToEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.hour.period.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per2" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.hour.per2.1') }}</span> |
|||
<q-input |
|||
v-model="per2FromRef" |
|||
type="number" |
|||
:disable="!per2FromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.hour.per2.2') }}</span> |
|||
<q-input |
|||
v-model="per2PerRef" |
|||
type="number" |
|||
:disable="!per2PerEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.hour.per2.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="specify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.hour.specify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-item-label> |
|||
<div class="row"> |
|||
<template v-for="index in 24" :key="index"> |
|||
<template v-if="index % 8 === 1"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
<div class="col-1"> |
|||
<q-checkbox |
|||
v-model="optionsRef[index - 1]" |
|||
dense |
|||
:label="'' + (index - 1)" |
|||
:disable="!optionsEnableRef" |
|||
@update:model-value="valueChanged" |
|||
></q-checkbox> |
|||
</div> |
|||
<template v-if="index % 8 === 0"> |
|||
<div class="col-3"></div> |
|||
</template> |
|||
</template> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
</q-list> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
import { Tools } from '@/platform'; |
|||
|
|||
const props = defineProps({ |
|||
modelValue: { type: String, default: '' }, |
|||
}); |
|||
const emit = defineEmits(['update:modelValue']); |
|||
|
|||
const valueRef = ref(props.modelValue); |
|||
const modeRef = ref(''); |
|||
|
|||
const periodFromEnableRef = ref(false); |
|||
const periodFromRef = ref(''); |
|||
|
|||
const periodToEnableRef = ref(false); |
|||
const periodToRef = ref(''); |
|||
|
|||
const per2FromEnableRef = ref(false); |
|||
const per2FromRef = ref(''); |
|||
|
|||
const per2PerEnableRef = ref(false); |
|||
const per2PerRef = ref(''); |
|||
|
|||
const optionsEnableRef = ref(false); |
|||
const optionsRef = ref([]); |
|||
for (let i = 0; i < 24; i++) { |
|||
optionsRef.value.push(false); |
|||
} |
|||
|
|||
const valueChanged = () => { |
|||
if (modeRef.value === 'per') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'period') { |
|||
periodFromEnableRef.value = true; |
|||
periodToEnableRef.value = true; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'per2') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = true; |
|||
per2PerEnableRef.value = true; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'specify') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = true; |
|||
} |
|||
|
|||
if (modeRef.value === 'per') { |
|||
valueRef.value = '*'; |
|||
} else if (modeRef.value === 'period') { |
|||
valueRef.value = periodFromRef.value + '-' + periodToRef.value; |
|||
} else if (modeRef.value === 'per2') { |
|||
valueRef.value = per2FromRef.value + '/' + per2PerRef.value; |
|||
} else if (modeRef.value === 'specify') { |
|||
let seconds = []; |
|||
for (let i = 0; i < 24; i++) { |
|||
if (optionsRef.value[i]) { |
|||
seconds.push(i); |
|||
} |
|||
} |
|||
valueRef.value = Tools.join(seconds, ','); |
|||
} |
|||
|
|||
emit('update:modelValue', valueRef.value); |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,185 @@ |
|||
<template> |
|||
<q-list dense style="width: 100%"> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.minute.per') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="period" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.minute.period.1') }}</span> |
|||
<q-input |
|||
v-model="periodFromRef" |
|||
type="number" |
|||
:disable="!periodFromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.minute.period.2') }}</span> |
|||
<q-input |
|||
v-model="periodToRef" |
|||
type="number" |
|||
:disable="!periodToEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.minute.period.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per2" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.minute.per2.1') }}</span> |
|||
<q-input |
|||
v-model="per2FromRef" |
|||
type="number" |
|||
:disable="!per2FromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.minute.per2.2') }}</span> |
|||
<q-input |
|||
v-model="per2PerRef" |
|||
type="number" |
|||
:disable="!per2PerEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.minute.per2.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="specify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.minute.specify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-item-label> |
|||
<div class="row"> |
|||
<template v-for="index in 60" :key="index"> |
|||
<template v-if="index % 10 === 1"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
<div class="col-1"> |
|||
<q-checkbox |
|||
v-model="optionsRef[index - 1]" |
|||
dense |
|||
:label="'' + (index - 1)" |
|||
:disable="!optionsEnableRef" |
|||
@update:model-value="valueChanged" |
|||
></q-checkbox> |
|||
</div> |
|||
<template v-if="index % 10 === 0"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
</template> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
</q-list> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
import { Tools } from '@/platform'; |
|||
|
|||
const props = defineProps({ |
|||
modelValue: { type: String, default: '' }, |
|||
}); |
|||
const emit = defineEmits(['update:modelValue']); |
|||
|
|||
const valueRef = ref(props.modelValue); |
|||
const modeRef = ref(''); |
|||
|
|||
const periodFromEnableRef = ref(false); |
|||
const periodFromRef = ref(''); |
|||
|
|||
const periodToEnableRef = ref(false); |
|||
const periodToRef = ref(''); |
|||
|
|||
const per2FromEnableRef = ref(false); |
|||
const per2FromRef = ref(''); |
|||
|
|||
const per2PerEnableRef = ref(false); |
|||
const per2PerRef = ref(''); |
|||
|
|||
const optionsEnableRef = ref(false); |
|||
const optionsRef = ref([]); |
|||
for (let i = 0; i < 60; i++) { |
|||
optionsRef.value.push(false); |
|||
} |
|||
|
|||
const valueChanged = () => { |
|||
if (modeRef.value === 'per') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'period') { |
|||
periodFromEnableRef.value = true; |
|||
periodToEnableRef.value = true; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'per2') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = true; |
|||
per2PerEnableRef.value = true; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'specify') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = true; |
|||
} |
|||
|
|||
if (modeRef.value === 'per') { |
|||
valueRef.value = '*'; |
|||
} else if (modeRef.value === 'period') { |
|||
valueRef.value = periodFromRef.value + '-' + periodToRef.value; |
|||
} else if (modeRef.value === 'per2') { |
|||
valueRef.value = per2FromRef.value + '/' + per2PerRef.value; |
|||
} else if (modeRef.value === 'specify') { |
|||
let seconds = []; |
|||
for (let i = 0; i < 60; i++) { |
|||
if (optionsRef.value[i]) { |
|||
seconds.push(i); |
|||
} |
|||
} |
|||
valueRef.value = Tools.join(seconds, ','); |
|||
} |
|||
|
|||
emit('update:modelValue', valueRef.value); |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,197 @@ |
|||
<template> |
|||
<q-list dense style="width: 100%"> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.month.per') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="notSpecify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.month.notSpecify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="period" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.month.period.1') }}</span> |
|||
<q-input |
|||
v-model="periodFromRef" |
|||
type="number" |
|||
:disable="!periodFromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.month.period.2') }}</span> |
|||
<q-input |
|||
v-model="periodToRef" |
|||
type="number" |
|||
:disable="!periodToEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.month.period.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per2" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.month.per2.1') }}</span> |
|||
<q-input |
|||
v-model="per2FromRef" |
|||
type="number" |
|||
:disable="!per2FromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.month.per2.2') }}</span> |
|||
<q-input |
|||
v-model="per2PerRef" |
|||
type="number" |
|||
:disable="!per2PerEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.month.per2.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
|
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="specify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.month.specify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row"> |
|||
<template v-for="index in 12" :key="index"> |
|||
<template v-if="index % 6 === 1"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
<div class="col-1"> |
|||
<q-checkbox |
|||
v-model="optionsRef[index - 1]" |
|||
dense |
|||
:label="'' + index" |
|||
:disable="!optionsEnableRef" |
|||
@update:model-value="valueChanged" |
|||
></q-checkbox> |
|||
</div> |
|||
<template v-if="index % 6 === 0"> |
|||
<div class="col-5"></div> |
|||
</template> |
|||
</template> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
</q-list> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
import { Tools } from '@/platform'; |
|||
|
|||
const props = defineProps({ |
|||
modelValue: { type: String, default: '' }, |
|||
}); |
|||
const emit = defineEmits(['update:modelValue']); |
|||
|
|||
const valueRef = ref(props.modelValue); |
|||
const modeRef = ref(''); |
|||
|
|||
const periodFromEnableRef = ref(false); |
|||
const periodFromRef = ref(''); |
|||
|
|||
const periodToEnableRef = ref(false); |
|||
const periodToRef = ref(''); |
|||
|
|||
const per2FromEnableRef = ref(false); |
|||
const per2FromRef = ref(''); |
|||
|
|||
const per2PerEnableRef = ref(false); |
|||
const per2PerRef = ref(''); |
|||
|
|||
const workDayEnableRef = ref(false); |
|||
const workDayRef = ref(''); |
|||
|
|||
const optionsEnableRef = ref(false); |
|||
const optionsRef = ref([]); |
|||
for (let i = 0; i < 12; i++) { |
|||
optionsRef.value.push(false); |
|||
} |
|||
|
|||
const valueChanged = () => { |
|||
if (modeRef.value === 'per') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'period') { |
|||
periodFromEnableRef.value = true; |
|||
periodToEnableRef.value = true; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'per2') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = true; |
|||
per2PerEnableRef.value = true; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'specify') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = true; |
|||
} |
|||
|
|||
if (modeRef.value === 'per') { |
|||
valueRef.value = '*'; |
|||
} else if (modeRef.value === 'period') { |
|||
valueRef.value = periodFromRef.value + '-' + periodToRef.value; |
|||
} else if (modeRef.value === 'per2') { |
|||
valueRef.value = per2FromRef.value + '/' + per2PerRef.value; |
|||
} else if (modeRef.value === 'specify') { |
|||
let seconds = []; |
|||
for (let i = 0; i < 12; i++) { |
|||
if (optionsRef.value[i]) { |
|||
seconds.push(i + 1); |
|||
} |
|||
} |
|||
valueRef.value = Tools.join(seconds, ','); |
|||
} |
|||
|
|||
emit('update:modelValue', valueRef.value); |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,185 @@ |
|||
<template> |
|||
<q-list dense style="width: 100%"> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.second.per') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="period" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.second.period.1') }}</span> |
|||
<q-input |
|||
v-model="periodFromRef" |
|||
type="number" |
|||
:disable="!periodFromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.second.period.2') }}</span> |
|||
<q-input |
|||
v-model="periodToRef" |
|||
type="number" |
|||
:disable="!periodToEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.second.period.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per2" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.second.per2.1') }}</span> |
|||
<q-input |
|||
v-model="per2FromRef" |
|||
type="number" |
|||
:disable="!per2FromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.second.per2.2') }}</span> |
|||
<q-input |
|||
v-model="per2PerRef" |
|||
type="number" |
|||
:disable="!per2PerEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.second.per2.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="specify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.second.specify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-item-label> |
|||
<div class="row"> |
|||
<template v-for="index in 60" :key="index"> |
|||
<template v-if="index % 10 === 1"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
<div class="col-1"> |
|||
<q-checkbox |
|||
v-model="optionsRef[index - 1]" |
|||
dense |
|||
:label="'' + (index - 1)" |
|||
:disable="!optionsEnableRef" |
|||
@update:model-value="valueChanged" |
|||
></q-checkbox> |
|||
</div> |
|||
<template v-if="index % 10 === 0"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
</template> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
</q-list> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
import { Tools } from '@/platform'; |
|||
|
|||
const props = defineProps({ |
|||
modelValue: { type: String, default: '' }, |
|||
}); |
|||
const emit = defineEmits(['update:modelValue']); |
|||
|
|||
const valueRef = ref(props.modelValue); |
|||
const modeRef = ref(''); |
|||
|
|||
const periodFromEnableRef = ref(false); |
|||
const periodFromRef = ref(''); |
|||
|
|||
const periodToEnableRef = ref(false); |
|||
const periodToRef = ref(''); |
|||
|
|||
const per2FromEnableRef = ref(false); |
|||
const per2FromRef = ref(''); |
|||
|
|||
const per2PerEnableRef = ref(false); |
|||
const per2PerRef = ref(''); |
|||
|
|||
const optionsEnableRef = ref(false); |
|||
const optionsRef = ref([]); |
|||
for (let i = 0; i < 60; i++) { |
|||
optionsRef.value.push(false); |
|||
} |
|||
|
|||
const valueChanged = () => { |
|||
if (modeRef.value === 'per') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'period') { |
|||
periodFromEnableRef.value = true; |
|||
periodToEnableRef.value = true; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'per2') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = true; |
|||
per2PerEnableRef.value = true; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'specify') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
per2FromEnableRef.value = false; |
|||
per2PerEnableRef.value = false; |
|||
optionsEnableRef.value = true; |
|||
} |
|||
|
|||
if (modeRef.value === 'per') { |
|||
valueRef.value = '*'; |
|||
} else if (modeRef.value === 'period') { |
|||
valueRef.value = periodFromRef.value + '-' + periodToRef.value; |
|||
} else if (modeRef.value === 'per2') { |
|||
valueRef.value = per2FromRef.value + '/' + per2PerRef.value; |
|||
} else if (modeRef.value === 'specify') { |
|||
let seconds = []; |
|||
for (let i = 0; i < 60; i++) { |
|||
if (optionsRef.value[i]) { |
|||
seconds.push(i); |
|||
} |
|||
} |
|||
valueRef.value = Tools.join(seconds, ','); |
|||
} |
|||
|
|||
emit('update:modelValue', valueRef.value); |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,90 @@ |
|||
<template> |
|||
<q-input v-model="valueRef" :v-bind="attrs"> |
|||
<template #append> |
|||
<!-- 选择颜色按钮 --> |
|||
<q-btn icon="bi-pencil-square" padding="2px" flat square unelevated :title="$t('select')"> |
|||
<q-popup-proxy v-model:model-value="isShow" anchor="bottom right" self="top right" :offset="[0, 10]" style="width: 800px"> |
|||
<q-tabs v-model="selectedTab" no-caps> |
|||
<q-tab name="second" :label="$t('second')" /> |
|||
<q-tab name="minute" :label="$t('minute')" /> |
|||
<q-tab name="hour" :label="$t('hour')" /> |
|||
<q-tab name="day" :label="$t('day')" /> |
|||
<q-tab name="month" :label="$t('month')" /> |
|||
<q-tab name="week" :label="$t('week')" /> |
|||
<q-tab name="year" :label="$t('year')" /> |
|||
</q-tabs> |
|||
|
|||
<q-tab-panels v-model="selectedTab" animated swipeable vertical transition-prev="jump-up" transition-next="jump-up" :keep-alive="true"> |
|||
<q-tab-panel name="second"> |
|||
<SecondSegment v-model="secondValueRef" @update:model-value="valueChanged"></SecondSegment> |
|||
</q-tab-panel> |
|||
<q-tab-panel name="minute"> |
|||
<MinuteSegment v-model="minuteValueRef" @update:model-value="valueChanged"></MinuteSegment> |
|||
</q-tab-panel> |
|||
<q-tab-panel name="hour"> |
|||
<HourSegment v-model="hourValueRef" @update:model-value="valueChanged"></HourSegment> |
|||
</q-tab-panel> |
|||
<q-tab-panel name="day"> |
|||
<DaySegment v-model="dayValueRef" @update:model-value="valueChanged"></DaySegment> |
|||
</q-tab-panel> |
|||
<q-tab-panel name="month"> |
|||
<MonthSegment v-model="monthValueRef" @update:model-value="valueChanged"></MonthSegment> |
|||
</q-tab-panel> |
|||
<q-tab-panel name="week"> |
|||
<WeekSegment v-model="weekValueRef" @update:model-value="valueChanged"></WeekSegment> |
|||
</q-tab-panel> |
|||
<q-tab-panel name="year"> |
|||
<YearSegment v-model="yearValueRef" @update:model-value="valueChanged"></YearSegment> |
|||
</q-tab-panel> |
|||
</q-tab-panels> |
|||
</q-popup-proxy> |
|||
</q-btn> |
|||
</template> |
|||
</q-input> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref, useAttrs } from 'vue'; |
|||
import { Tools } from '@/platform'; |
|||
import SecondSegment from './SecondSegment.vue'; |
|||
import MinuteSegment from './MinuteSegment.vue'; |
|||
import HourSegment from './HourSegment.vue'; |
|||
import DaySegment from './DaySegment.vue'; |
|||
import MonthSegment from './MonthSegment.vue'; |
|||
import WeekSegment from './WeekSegment.vue'; |
|||
import YearSegment from './YearSegment.vue'; |
|||
|
|||
const attrs = useAttrs(); |
|||
|
|||
const props = defineProps({ |
|||
modelValue: { type: String, default: '' }, |
|||
}); |
|||
const emit = defineEmits(['update:modelValue']); |
|||
|
|||
const isShow = ref(false); |
|||
const selectedTab = ref('second'); |
|||
|
|||
const valueRef = ref(props.modelValue); |
|||
const splits = props.modelValue.split(' '); |
|||
const secondValueRef = ref(splits[0]); |
|||
const minuteValueRef = ref(splits[1]); |
|||
const hourValueRef = ref(splits[2]); |
|||
const dayValueRef = ref(splits[3]); |
|||
const monthValueRef = ref(splits[4]); |
|||
const weekValueRef = ref(splits[5]); |
|||
const yearValueRef = ref(splits[6]); |
|||
|
|||
const valueChanged = () => { |
|||
const values = []; |
|||
values.push(secondValueRef.value ? secondValueRef.value : '*'); |
|||
values.push(minuteValueRef.value ? minuteValueRef.value : '*'); |
|||
values.push(hourValueRef.value ? hourValueRef.value : '*'); |
|||
values.push(dayValueRef.value ? dayValueRef.value : '*'); |
|||
values.push(monthValueRef.value ? monthValueRef.value : '*'); |
|||
values.push(weekValueRef.value ? weekValueRef.value : '*'); |
|||
values.push(yearValueRef.value ? yearValueRef.value : '*'); |
|||
|
|||
const result = Tools.join(values, ' '); |
|||
valueRef.value = result; |
|||
emit('update:modelValue', result); |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,233 @@ |
|||
<template> |
|||
<q-list dense style="width: 100%"> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.week.per') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="notSpecify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.week.notSpecify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="period" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.week.period.1') }}</span> |
|||
<q-input |
|||
v-model="periodFromRef" |
|||
type="number" |
|||
:disable="!periodFromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.week.period.2') }}</span> |
|||
<q-input |
|||
v-model="periodToRef" |
|||
type="number" |
|||
:disable="!periodToEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.week.period.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="weekOfYear" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.week.weekOfYear.1') }}</span> |
|||
<q-input |
|||
v-model="weekOfYearRef" |
|||
type="number" |
|||
:disable="!weekOfYearEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.week.weekOfYear.2') }}</span> |
|||
<q-input |
|||
v-model="dayOfWeekRef" |
|||
type="number" |
|||
:disable="!dayOfWeekEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.week.weekOfYear.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
|
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="lastWeek" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.week.lastDay.1') }}</span> |
|||
<q-input |
|||
v-model="lastWeekRef" |
|||
type="number" |
|||
:disable="!lastWeekEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.week.lastDay.2') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
|
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="specify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.week.specify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row"> |
|||
<template v-for="index in 7" :key="index"> |
|||
<template v-if="index % 7 === 1"> |
|||
<div class="col-1"></div> |
|||
</template> |
|||
<div class="col-1"> |
|||
<q-checkbox |
|||
v-model="optionsRef[index - 1]" |
|||
dense |
|||
:label="'' + index" |
|||
:disable="!optionsEnableRef" |
|||
@update:model-value="valueChanged" |
|||
></q-checkbox> |
|||
</div> |
|||
<template v-if="index % 7 === 0"> |
|||
<div class="col-5"></div> |
|||
</template> |
|||
</template> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
</q-list> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
import { Tools } from '@/platform'; |
|||
|
|||
const props = defineProps({ |
|||
modelValue: { type: String, default: '' }, |
|||
}); |
|||
const emit = defineEmits(['update:modelValue']); |
|||
|
|||
const valueRef = ref(props.modelValue); |
|||
const modeRef = ref(''); |
|||
|
|||
const periodFromEnableRef = ref(false); |
|||
const periodFromRef = ref(''); |
|||
|
|||
const periodToEnableRef = ref(false); |
|||
const periodToRef = ref(''); |
|||
|
|||
const weekOfYearEnableRef = ref(false); |
|||
const weekOfYearRef = ref(''); |
|||
|
|||
const dayOfWeekEnableRef = ref(false); |
|||
const dayOfWeekRef = ref(''); |
|||
|
|||
const lastWeekEnableRef = ref(false); |
|||
const lastWeekRef = ref(''); |
|||
|
|||
const optionsEnableRef = ref(false); |
|||
const optionsRef = ref([]); |
|||
for (let i = 0; i < 7; i++) { |
|||
optionsRef.value.push(false); |
|||
} |
|||
|
|||
const valueChanged = () => { |
|||
if (modeRef.value === 'per') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
weekOfYearEnableRef.value = false; |
|||
dayOfWeekEnableRef.value = false; |
|||
lastWeekEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'period') { |
|||
periodFromEnableRef.value = true; |
|||
periodToEnableRef.value = true; |
|||
weekOfYearEnableRef.value = false; |
|||
dayOfWeekEnableRef.value = false; |
|||
lastWeekEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'weekOfYear') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
weekOfYearEnableRef.value = true; |
|||
dayOfWeekEnableRef.value = true; |
|||
lastWeekEnableRef.value = false; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'lastWeek') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
weekOfYearEnableRef.value = false; |
|||
dayOfWeekEnableRef.value = false; |
|||
lastWeekEnableRef.value = true; |
|||
optionsEnableRef.value = false; |
|||
} else if (modeRef.value === 'specify') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
weekOfYearEnableRef.value = false; |
|||
dayOfWeekEnableRef.value = false; |
|||
lastWeekEnableRef.value = false; |
|||
optionsEnableRef.value = true; |
|||
} |
|||
|
|||
if (modeRef.value === 'per') { |
|||
valueRef.value = '*'; |
|||
} else if (modeRef.value === 'period') { |
|||
valueRef.value = periodFromRef.value + '-' + periodToRef.value; |
|||
} else if (modeRef.value === 'weekOfYear') { |
|||
valueRef.value = weekOfYearRef.value + '/' + dayOfWeekRef.value; |
|||
} else if (modeRef.value === 'lastWeek') { |
|||
valueRef.value = lastWeekRef.value + 'L'; |
|||
} else if (modeRef.value === 'specify') { |
|||
let seconds = []; |
|||
for (let i = 0; i < 7; i++) { |
|||
if (optionsRef.value[i]) { |
|||
seconds.push(i + 1); |
|||
} |
|||
} |
|||
valueRef.value = Tools.join(seconds, ','); |
|||
} |
|||
|
|||
emit('update:modelValue', valueRef.value); |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,93 @@ |
|||
<template> |
|||
<q-list dense style="width: 100%"> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="per" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.year.per') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="notSpecify" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label>{{ $t('cron.year.notSpecify') }}</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
<q-item> |
|||
<q-item-section avatar> |
|||
<q-radio v-model="modeRef" val="period" @update:model-value="valueChanged" /> |
|||
</q-item-section> |
|||
<q-item-section> |
|||
<q-item-label> |
|||
<div class="row no-wrap items-center"> |
|||
<span class="pr-2">{{ $t('cron.year.period.1') }}</span> |
|||
<q-input |
|||
v-model="periodFromRef" |
|||
type="number" |
|||
:disable="!periodFromEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.year.period.2') }}</span> |
|||
<q-input |
|||
v-model="periodToRef" |
|||
type="number" |
|||
:disable="!periodToEnableRef" |
|||
outlined |
|||
dense |
|||
style="width: 100px" |
|||
@update:model-value="valueChanged" |
|||
></q-input> |
|||
<span class="px-2">{{ $t('cron.year.period.3') }}</span> |
|||
</div> |
|||
</q-item-label> |
|||
</q-item-section> |
|||
</q-item> |
|||
</q-list> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
import { Tools } from '@/platform'; |
|||
|
|||
const props = defineProps({ |
|||
modelValue: { type: String, default: '' }, |
|||
}); |
|||
const emit = defineEmits(['update:modelValue']); |
|||
|
|||
const valueRef = ref(props.modelValue); |
|||
const modeRef = ref(''); |
|||
|
|||
const periodFromEnableRef = ref(false); |
|||
const periodFromRef = ref(''); |
|||
|
|||
const periodToEnableRef = ref(false); |
|||
const periodToRef = ref(''); |
|||
|
|||
const valueChanged = () => { |
|||
if (modeRef.value === 'per') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
} else if (modeRef.value === 'notSpecify') { |
|||
periodFromEnableRef.value = false; |
|||
periodToEnableRef.value = false; |
|||
} else if (modeRef.value === 'period') { |
|||
periodFromEnableRef.value = true; |
|||
periodToEnableRef.value = true; |
|||
} |
|||
|
|||
if (modeRef.value === 'per') { |
|||
valueRef.value = '*'; |
|||
} else if (modeRef.value === 'notSpecify') { |
|||
valueRef.value = ''; |
|||
} else if (modeRef.value === 'period') { |
|||
valueRef.value = periodFromRef.value + '-' + periodToRef.value; |
|||
} |
|||
|
|||
emit('update:modelValue', valueRef.value); |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,29 @@ |
|||
<template> |
|||
<q-splitter v-model="splitWidthRef" style="height: 250px"> |
|||
<template #before> |
|||
<q-tabs v-model="selectedTab" vertical no-caps> |
|||
<q-tab name="cron" label="w-cron" /> |
|||
<q-tab name="codemirror" label="w-code-mirror" /> |
|||
</q-tabs> |
|||
</template> |
|||
|
|||
<template #after> |
|||
<q-tab-panels v-model="selectedTab" animated swipeable vertical transition-prev="jump-up" transition-next="jump-up"> |
|||
<q-tab-panel name="cron"> |
|||
<w-cron v-model="valueRef" label="cron" outlined dense style="width: 200px"></w-cron> |
|||
</q-tab-panel> |
|||
<q-tab-panel name="codemirror"> |
|||
<w-code-mirror v-model="valueRef" label="codemirror" lang="sql" outlined dense></w-code-mirror> |
|||
<q-input v-model="valueRef" label="codemirror" outlined dense></q-input> |
|||
</q-tab-panel> |
|||
</q-tab-panels> |
|||
</template> |
|||
</q-splitter> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
|
|||
const selectedTab = ref('codemirror'); |
|||
const splitWidthRef = ref(20); |
|||
const valueRef = ref('* * * * * *'); |
|||
</script> |
|||
@ -1,8 +1,50 @@ |
|||
<template> |
|||
<w-codemirror v-model="value" lang="xml" style="height: 60px"></w-codemirror> |
|||
<!-- <w-codemirror |
|||
v-model="value" |
|||
lang="xml" |
|||
placeholder="Code goes here..." |
|||
:autofocus="false" |
|||
:tab-size="2" |
|||
:style="{ height: '200px', padding: '20px' }" |
|||
></w-codemirror> --> |
|||
<q-input outlined label="OK"></q-input> |
|||
<label class="q-field row no-wrap items-start q-field--outlined q-input q-field--labeled" for="f_eef31e6a-a3a8-4a87-b35c-481f40af889e"> |
|||
<div class="q-field__inner relative-position col self-stretch"> |
|||
<div class="q-field__control relative-position row no-wrap" tabindex="-1"> |
|||
<div class="q-field__control-container col relative-position row no-wrap q-anchor--skip"></div> |
|||
</div> |
|||
</div> |
|||
</label> |
|||
|
|||
<div class="rounded-md" style="border: 1px solid #e5e7eb"> |
|||
<div class="px-3 text-gray-600 text-xs">OK</div> |
|||
<div ref="codemirrorRef" class="py-1"></div> |
|||
</div> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref } from 'vue'; |
|||
import { ref, onMounted, onUnmounted } from 'vue'; |
|||
import { EditorView, basicSetup } from 'codemirror'; |
|||
import { javascript } from '@codemirror/lang-javascript'; |
|||
|
|||
const codemirrorRef = ref(); |
|||
let view; |
|||
|
|||
onMounted(() => { |
|||
view = new EditorView({ |
|||
extensions: [basicSetup, javascript()], |
|||
parent: codemirrorRef.value, |
|||
}); |
|||
//view.destroy(); |
|||
}); |
|||
|
|||
const value = ref('<xml><a name="name"></a>'); |
|||
onUnmounted(() => { |
|||
console.log('>>>>>>'); |
|||
view.destroy(); |
|||
}); |
|||
const value = ref('<xml><a name="name"></a></xml>'); |
|||
</script> |
|||
<style> |
|||
.cm-editor { |
|||
outline: none !important; |
|||
} |
|||
</style> |
|||
|
|||
@ -0,0 +1,52 @@ |
|||
package io.sc.platform.scheduler.core.vo; |
|||
|
|||
import io.sc.platform.orm.api.vo.CorporationAuditorVo; |
|||
import io.sc.platform.scheduler.core.enums.GlueType; |
|||
|
|||
public class GlueVo extends CorporationAuditorVo { |
|||
private String id; |
|||
private GlueType type; |
|||
private String description; |
|||
private String source; |
|||
private String task; |
|||
|
|||
public String getId() { |
|||
return id; |
|||
} |
|||
|
|||
public void setId(String id) { |
|||
this.id = id; |
|||
} |
|||
|
|||
public GlueType getType() { |
|||
return type; |
|||
} |
|||
|
|||
public void setType(GlueType type) { |
|||
this.type = type; |
|||
} |
|||
|
|||
public String getDescription() { |
|||
return description; |
|||
} |
|||
|
|||
public void setDescription(String description) { |
|||
this.description = description; |
|||
} |
|||
|
|||
public String getSource() { |
|||
return source; |
|||
} |
|||
|
|||
public void setSource(String source) { |
|||
this.source = source; |
|||
} |
|||
|
|||
public String getTask() { |
|||
return task; |
|||
} |
|||
|
|||
public void setTask(String task) { |
|||
this.task = task; |
|||
} |
|||
} |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"includes":[ |
|||
"io/sc/platform/scheduler/core/i18n/messages" |
|||
] |
|||
} |
|||
@ -0,0 +1,35 @@ |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.SERIAL_EXECUTION=Serializable |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.DISCARD_LATER=Discard Later |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.COVER_EARLY=Cover Early |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExecutorAddressType.AUTO=Auto |
|||
io.sc.platform.scheduler.core.enums.ExecutorAddressType.MANUAL=Manual |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.FIRST=First |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LAST=Last |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.ROUND=Round |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.RANDOM=Random |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.CONSISTENT_HASH=Consistent Hash |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LEAST_FREQUENTLY_USED=Least Frequently Used |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LEAST_RECENTLY_USED=Least Recently Used |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.FAILOVER=Failover |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.BUSYOVER=Busyover |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.SHARDING_BROADCAST=Sharding Broadcast |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExpirationPolicy.DO_NOTHING=Do Nothing |
|||
io.sc.platform.scheduler.core.enums.ExpirationPolicy.FIRE_ONCE_NOW=Fire Once Now |
|||
|
|||
io.sc.platform.scheduler.core.enums.GlueType.BEAN=Bean |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_GROOVY=Groovy |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_SHELL=Shell |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_PYTHON=Python |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_PHP=Php |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_NODEJS=NodeJs |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_POWERSHELL=PowerShell |
|||
|
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.NONE=None |
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.CRON=Cron |
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.FIX_RATE=Fix Rate |
|||
|
|||
io.sc.platform.scheduler.core.enums.TriggerStatus.STOPED=Stoped |
|||
io.sc.platform.scheduler.core.enums.TriggerStatus.RUNNING=Running |
|||
@ -0,0 +1,35 @@ |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.SERIAL_EXECUTION=\u55AE\u6A5F\u4E32\u884C |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.DISCARD_LATER=\u4E1F\u68C4\u5F8C\u7E8C\u8ABF\u5EA6 |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.COVER_EARLY=\u8986\u84CB\u5148\u524D\u8ABF\u5EA6 |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExecutorAddressType.AUTO=\u81EA\u52D5\u8A3B\u518A |
|||
io.sc.platform.scheduler.core.enums.ExecutorAddressType.MANUAL=\u624B\u5DE5\u9304\u5165 |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.FIRST=\u7B2C\u4E00\u500B |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LAST=\u6700\u5F8C\u4E00\u500B |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.ROUND=\u8F2A\u8A62 |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.RANDOM=\u96A8\u6A5F |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.CONSISTENT_HASH=\u4E00\u81F4\u6027 Hash |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LEAST_FREQUENTLY_USED=\u6700\u8FD1\u7D93\u5E38\u4F7F\u7528 |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LEAST_RECENTLY_USED=\u6700\u8FD1\u6700\u4E45\u672A\u4F7F\u7528 |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.FAILOVER=\u6545\u969C\u8F49\u79FB |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.BUSYOVER=\u5FD9\u788C\u8F49\u79FB |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.SHARDING_BROADCAST=\u5206\u7247\u5EE3\u64AD |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExpirationPolicy.DO_NOTHING=\u5FFD\u7565 |
|||
io.sc.platform.scheduler.core.enums.ExpirationPolicy.FIRE_ONCE_NOW=\u7ACB\u5373\u57F7\u884C\u4E00\u6B21 |
|||
|
|||
io.sc.platform.scheduler.core.enums.GlueType.BEAN=Bean |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_GROOVY=Groovy |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_SHELL=Shell |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_PYTHON=Python |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_PHP=Php |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_NODEJS=NodeJs |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_POWERSHELL=PowerShell |
|||
|
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.NONE=\u7121 |
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.CRON=Cron |
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.FIX_RATE=\u56FA\u5B9A\u9031\u671F |
|||
|
|||
io.sc.platform.scheduler.core.enums.TriggerStatus.STOPED=\u5DF2\u505C\u6B62 |
|||
io.sc.platform.scheduler.core.enums.TriggerStatus.RUNNING=\u904B\u884C\u4E2D |
|||
@ -0,0 +1,35 @@ |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.SERIAL_EXECUTION=\u5355\u673A\u4E32\u884C |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.DISCARD_LATER=\u4E22\u5F03\u540E\u7EED\u8C03\u5EA6 |
|||
io.sc.platform.scheduler.core.enums.BlockStrategy.COVER_EARLY=\u8986\u76D6\u5148\u524D\u8C03\u5EA6 |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExecutorAddressType.AUTO=\u81EA\u52A8\u6CE8\u518C |
|||
io.sc.platform.scheduler.core.enums.ExecutorAddressType.MANUAL=\u624B\u5DE5\u5F55\u5165 |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.FIRST=\u7B2C\u4E00\u4E2A |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LAST=\u6700\u540E\u4E00\u4E2A |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.ROUND=\u8F6E\u8BE2 |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.RANDOM=\u968F\u673A |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.CONSISTENT_HASH=\u4E00\u81F4\u6027 Hash |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LEAST_FREQUENTLY_USED=\u6700\u4E0D\u7ECF\u5E38\u4F7F\u7528 |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.LEAST_RECENTLY_USED=\u6700\u8FD1\u6700\u4E45\u672A\u4F7F\u7528 |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.FAILOVER=\u6545\u969C\u8F6C\u79FB |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.BUSYOVER=\u5FD9\u788C\u8F6C\u4E49 |
|||
io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy.SHARDING_BROADCAST=\u5206\u7247\u5E7F\u64AD |
|||
|
|||
io.sc.platform.scheduler.core.enums.ExpirationPolicy.DO_NOTHING=\u5FFD\u7565 |
|||
io.sc.platform.scheduler.core.enums.ExpirationPolicy.FIRE_ONCE_NOW=\u7ACB\u5373\u6267\u884C\u4E00\u6B21 |
|||
|
|||
io.sc.platform.scheduler.core.enums.GlueType.BEAN=Bean |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_GROOVY=Groovy |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_SHELL=Shell |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_PYTHON=Python |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_PHP=Php |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_NODEJS=NodeJs |
|||
io.sc.platform.scheduler.core.enums.GlueType.GLUE_POWERSHELL=PowerShell |
|||
|
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.NONE=\u65E0 |
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.CRON=Cron |
|||
io.sc.platform.scheduler.core.enums.TaskScheduleType.FIX_RATE=\u56FA\u5B9A\u5468\u671F |
|||
|
|||
io.sc.platform.scheduler.core.enums.TriggerStatus.STOPED=\u5DF2\u505C\u6B62 |
|||
io.sc.platform.scheduler.core.enums.TriggerStatus.RUNNING=\u8FD0\u884C\u4E2D |
|||
@ -1,2 +1,283 @@ |
|||
<template>Task</template> |
|||
<script setup lang="ts"></script> |
|||
<template> |
|||
<w-grid |
|||
:title="$t('lcdp.scheduler.task.grid.title')" |
|||
:config-button="true" |
|||
selection="multiple" |
|||
:checkbox-selection="true" |
|||
:query-form-cols-num="12" |
|||
:query-form-fields="[ |
|||
{ colSpan: 4, name: 'name', label: $t('name'), type: 'text' }, |
|||
{ |
|||
colSpan: 4, |
|||
name: 'executor', |
|||
label: $t('lcdp.scheduler.task.grid.entity.executor'), |
|||
type: 'select', |
|||
clearable: true, |
|||
queryOperator: 'equals', |
|||
options: executorOptionsRef, |
|||
}, |
|||
{ |
|||
colSpan: 2, |
|||
name: 'triggerStatus', |
|||
label: $t('status'), |
|||
type: 'select', |
|||
clearable: true, |
|||
queryOperator: 'equals', |
|||
options: Options.enum(TriggerStatusEnum), |
|||
}, |
|||
]" |
|||
:data-url="Environment.apiContextPath('/api/scheduler/task')" |
|||
:pageable="false" |
|||
:toolbar-configure="{ noIcon: false }" |
|||
:toolbar-actions="[ |
|||
'query', |
|||
'refresh', |
|||
'separator', |
|||
'add', |
|||
'edit', |
|||
'remove', |
|||
'separator', |
|||
{ |
|||
name: 'execute', |
|||
label: $t('lcdp.scheduler.task.grid.toolbar.execute'), |
|||
icon: 'bi-caret-right-fill', |
|||
enableIf: (selecteds) => { |
|||
return selecteds && selecteds.length > 0; |
|||
}, |
|||
click: () => {}, |
|||
}, |
|||
{ |
|||
name: 'schedule', |
|||
label: $t('lcdp.scheduler.task.grid.toolbar.schedule'), |
|||
icon: 'bi-cloud-arrow-up', |
|||
enableIf: (selecteds) => { |
|||
return selecteds && selecteds.length > 0; |
|||
}, |
|||
click: () => {}, |
|||
}, |
|||
{ |
|||
name: 'log', |
|||
label: $t('lcdp.scheduler.task.grid.toolbar.log'), |
|||
icon: 'bi-receipt', |
|||
enableIf: (selecteds) => { |
|||
return selecteds && selecteds.length > 0; |
|||
}, |
|||
click: () => {}, |
|||
}, |
|||
'separator', |
|||
'view', |
|||
'separator', |
|||
'export', |
|||
]" |
|||
:columns="[ |
|||
{ |
|||
width: 80, |
|||
name: 'triggerStatus', |
|||
label: $t('status'), |
|||
align: 'center', |
|||
format: (value) => { |
|||
return { |
|||
componentType: 'QChip', |
|||
attrs: { color: value == 'RUNNING' ? 'green' : 'gray', label: Formater.enum(TriggerStatusEnum)(value), dense: true }, |
|||
}; |
|||
}, |
|||
}, |
|||
{ width: 150, name: 'name', label: $t('name') }, |
|||
{ |
|||
width: 130, |
|||
name: 'scheduleType', |
|||
label: $t('lcdp.scheduler.task.grid.entity.scheduleType'), |
|||
format: (value, row) => { |
|||
return Formater.enum(TaskScheduleTypeEnum)(row.scheduleType) + ' : ' + row.scheduleConf; |
|||
}, |
|||
}, |
|||
{ width: 150, name: 'executorName', label: $t('lcdp.scheduler.task.grid.entity.executorName') }, |
|||
{ |
|||
width: 90, |
|||
name: 'executorGlueType', |
|||
label: $t('lcdp.scheduler.task.grid.entity.executorGlueType'), |
|||
format: Formater.enum(GlueTypeEnum), |
|||
}, |
|||
{ |
|||
width: 140, |
|||
name: 'triggerLastTime', |
|||
label: $t('lcdp.scheduler.task.grid.entity.triggerLastTime'), |
|||
format: () => { |
|||
return '2024-02-23 10:10:10'; |
|||
}, |
|||
}, |
|||
{ width: 140, name: 'triggerNextTime', label: $t('lcdp.scheduler.task.grid.entity.triggerNextTime') }, |
|||
{ width: 80, name: 'author', label: $t('lcdp.scheduler.task.grid.entity.author') }, |
|||
{ width: 100, name: 'lastModifier', label: $t('lastModifier') }, |
|||
{ width: 110, name: 'lastModifyDate', label: $t('lastModifyDate'), format: Formater.dateOnly() }, |
|||
{ width: 200, name: 'alarmEmail', label: $t('lcdp.scheduler.task.grid.entity.alarmEmail') }, |
|||
{ |
|||
width: 100, |
|||
name: 'routeStrategy', |
|||
label: $t('lcdp.scheduler.task.grid.entity.routeStrategy'), |
|||
format: (value) => { |
|||
return Formater.enum(ExecutorRouteStrategyEnum)(value); |
|||
}, |
|||
}, |
|||
{ |
|||
width: 100, |
|||
name: 'expirationPolicy', |
|||
label: $t('lcdp.scheduler.task.grid.entity.expirationPolicy'), |
|||
format: (value) => { |
|||
return Formater.enum(ExpirationPolicyEnum)(value); |
|||
}, |
|||
}, |
|||
{ |
|||
width: 100, |
|||
name: 'blockStrategy', |
|||
label: $t('lcdp.scheduler.task.grid.entity.blockStrategy'), |
|||
format: (value) => { |
|||
return Formater.enum(BlockStrategyEnum)(value); |
|||
}, |
|||
}, |
|||
{ width: 80, name: 'timeout', label: $t('lcdp.scheduler.task.grid.entity.timeout') }, |
|||
{ width: 90, name: 'failRetryCount', label: $t('lcdp.scheduler.task.grid.entity.failRetryCount') }, |
|||
]" |
|||
:editor="{ |
|||
dialog: { |
|||
width: '800px', |
|||
height: '600px', |
|||
}, |
|||
form: { |
|||
colsNum: 2, |
|||
fields: [ |
|||
{ |
|||
name: 'executor', |
|||
label: $t('lcdp.scheduler.task.grid.entity.executor'), |
|||
type: 'select', |
|||
clearable: true, |
|||
options: executorOptionsRef, |
|||
}, |
|||
{ colsFirst: true, name: 'name', label: $t('name'), type: 'text' }, |
|||
{ name: 'description', label: $t('description'), type: 'text' }, |
|||
{ name: 'author', label: $t('lcdp.scheduler.task.grid.entity.author'), type: 'text' }, |
|||
{ name: 'alarmEmail', label: $t('lcdp.scheduler.task.grid.entity.alarmEmail'), type: 'text' }, |
|||
{ |
|||
colsFirst: true, |
|||
name: 'scheduleType', |
|||
label: $t('lcdp.scheduler.task.grid.entity.scheduleType'), |
|||
type: 'select', |
|||
options: Options.enum(TaskScheduleTypeEnum), |
|||
defaultValue: 'FIX_RATE', |
|||
}, |
|||
|
|||
{ name: 'scheduleConf', label: $t('lcdp.scheduler.task.grid.entity.scheduleConf'), type: 'text', defaultValue: '60' }, |
|||
{ |
|||
name: 'executorGlueType', |
|||
label: $t('lcdp.scheduler.task.grid.entity.executorGlueType'), |
|||
type: 'select', |
|||
options: Options.enum(GlueTypeEnum), |
|||
}, |
|||
{ name: 'executorHandler', label: $t('lcdp.scheduler.task.grid.entity.executorHandler'), type: 'text' }, |
|||
{ colSpan: 2, name: 'executorParam', label: $t('lcdp.scheduler.task.grid.entity.executorParam'), type: 'textarea', rows: 5 }, |
|||
|
|||
{ |
|||
name: 'routeStrategy', |
|||
label: $t('lcdp.scheduler.task.grid.entity.routeStrategy'), |
|||
type: 'select', |
|||
options: Options.enum(ExecutorRouteStrategyEnum), |
|||
defaultValue: 'FIX_RATE', |
|||
}, |
|||
{ |
|||
name: 'expirationPolicy', |
|||
label: $t('lcdp.scheduler.task.grid.entity.expirationPolicy'), |
|||
type: 'select', |
|||
options: Options.enum(ExpirationPolicyEnum), |
|||
}, |
|||
{ |
|||
name: 'blockStrategy', |
|||
label: $t('lcdp.scheduler.task.grid.entity.blockStrategy'), |
|||
type: 'select', |
|||
options: Options.enum(BlockStrategyEnum), |
|||
}, |
|||
{ colsFirst: true, name: 'timeout', label: $t('lcdp.scheduler.task.grid.entity.timeout'), type: 'number' }, |
|||
{ name: 'failRetryCount', label: $t('lcdp.scheduler.task.grid.entity.failRetryCount'), type: 'number' }, |
|||
], |
|||
}, |
|||
}" |
|||
:viewer="{ |
|||
panel: { |
|||
columnNum: 1, |
|||
fields: [ |
|||
{ name: 'id', label: $t('id') }, |
|||
{ name: 'executor', label: $t('lcdp.scheduler.task.grid.entity.executorId') }, |
|||
{ name: 'executorName', label: $t('lcdp.scheduler.task.grid.entity.executorName') }, |
|||
|
|||
{ name: 'name', label: $t('name') }, |
|||
{ name: 'description', label: $t('description') }, |
|||
{ name: 'author', label: $t('lcdp.scheduler.task.grid.entity.author') }, |
|||
{ name: 'alarmEmail', label: $t('lcdp.scheduler.task.grid.entity.alarmEmail') }, |
|||
|
|||
{ name: 'scheduleType', label: $t('lcdp.scheduler.task.grid.entity.scheduleType'), format: Formater.none() }, |
|||
{ name: 'scheduleConf', label: $t('lcdp.scheduler.task.grid.entity.scheduleConf') }, |
|||
|
|||
{ name: 'executorGlueType', label: $t('lcdp.scheduler.task.grid.entity.executorGlueType'), format: Formater.none() }, |
|||
{ name: 'executorHandler', label: $t('lcdp.scheduler.task.grid.entity.executorHandler') }, |
|||
{ name: 'executorParam', label: $t('lcdp.scheduler.task.grid.entity.executorParam') }, |
|||
|
|||
{ name: 'routeStrategy', label: $t('lcdp.scheduler.task.grid.entity.routeStrategy') }, |
|||
{ name: 'expirationPolicy', label: $t('lcdp.scheduler.task.grid.entity.expirationPolicy') }, |
|||
{ name: 'blockStrategy', label: $t('lcdp.scheduler.task.grid.entity.blockStrategy') }, |
|||
{ name: 'timeout', label: $t('lcdp.scheduler.task.grid.entity.timeout') }, |
|||
{ name: 'failRetryCount', label: $t('lcdp.scheduler.task.grid.entity.failRetryCount') }, |
|||
|
|||
{ name: 'triggerStatus', label: $t('lcdp.scheduler.task.grid.entity.triggerStatus') }, |
|||
{ name: 'triggerLastTime', label: $t('lcdp.scheduler.task.grid.entity.triggerLastTime') }, |
|||
{ name: 'triggerNextTime', label: $t('lcdp.scheduler.task.grid.entity.triggerNextTime') }, |
|||
|
|||
{ name: 'dataComeFrom', label: $t('dataComeFrom') }, |
|||
{ name: 'creator', label: $t('creator') }, |
|||
{ name: 'createDate', label: $t('createDate') }, |
|||
{ name: 'lastModifier', label: $t('lastModifier') }, |
|||
{ name: 'lastModifyDate', label: $t('lastModifyDate'), format: Formater.none() }, |
|||
{ name: 'corporationCode', label: $t('corporationCode') }, |
|||
], |
|||
}, |
|||
}" |
|||
@before-editor-data-submit=" |
|||
(data, submit) => { |
|||
data.addresses = data.addresses.split(','); |
|||
submit(data); |
|||
} |
|||
" |
|||
></w-grid> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref, inject } from 'vue'; |
|||
import { axios, Environment, EnumTools, Formater, Options } from 'platform-core'; |
|||
|
|||
const eventBus = inject('eventBus'); |
|||
|
|||
const ExecutorRouteStrategyEnum = await EnumTools.fetch('io.sc.platform.scheduler.core.enums.ExecutorRouteStrategy'); |
|||
const ExpirationPolicyEnum = await EnumTools.fetch('io.sc.platform.scheduler.core.enums.ExpirationPolicy'); |
|||
const BlockStrategyEnum = await EnumTools.fetch('io.sc.platform.scheduler.core.enums.BlockStrategy'); |
|||
const GlueTypeEnum = await EnumTools.fetch('io.sc.platform.scheduler.core.enums.GlueType'); |
|||
const TaskScheduleTypeEnum = await EnumTools.fetch('io.sc.platform.scheduler.core.enums.TaskScheduleType'); |
|||
const TriggerStatusEnum = await EnumTools.fetch('io.sc.platform.scheduler.core.enums.TriggerStatus'); |
|||
|
|||
const executorOptionsRef = ref([]); |
|||
|
|||
const reloadExecutor = () => { |
|||
axios.get(Environment.apiContextPath('/api/scheduler/executor?pageable=false')).then((response) => { |
|||
executorOptionsRef.value.splice(0, executorOptionsRef.value.length); |
|||
const list = response?.data?.content; |
|||
if (list) { |
|||
for (const item of list) { |
|||
executorOptionsRef.value.push({ label: item.name + ' ( ' + item.appName + ' )', value: item.id }); |
|||
} |
|||
} |
|||
}); |
|||
}; |
|||
|
|||
// 当执行器发生增删改查时 |
|||
eventBus.on('io.sc.platform.scheduler.manager.ExecutorChanged', () => { |
|||
reloadExecutor(); |
|||
}); |
|||
|
|||
reloadExecutor(); |
|||
</script> |
|||
|
|||
@ -0,0 +1,15 @@ |
|||
package io.sc.platform.scheduler.manager.controller; |
|||
|
|||
import io.sc.platform.mvc.controller.support.RestCrudController; |
|||
import io.sc.platform.scheduler.core.vo.ExecutorVo; |
|||
import io.sc.platform.scheduler.manager.jpa.entity.ExecutorEntity; |
|||
import io.sc.platform.scheduler.manager.jpa.repository.ExecutorRepository; |
|||
import io.sc.platform.scheduler.manager.service.ExecutorService; |
|||
import org.springframework.web.bind.annotation.RequestMapping; |
|||
import org.springframework.web.bind.annotation.RestController; |
|||
|
|||
@RestController |
|||
@RequestMapping("/api/scheduler/executor") |
|||
public class ExecutorWebController extends RestCrudController<ExecutorVo, ExecutorEntity, String, ExecutorRepository, ExecutorService> { |
|||
|
|||
} |
|||
@ -0,0 +1,15 @@ |
|||
package io.sc.platform.scheduler.manager.controller; |
|||
|
|||
import org.springframework.web.bind.annotation.RequestMapping; |
|||
import org.springframework.web.bind.annotation.RestController; |
|||
|
|||
import java.util.Map; |
|||
|
|||
@RestController |
|||
@RequestMapping("api/scheduler/report") |
|||
public class ReportWebController { |
|||
|
|||
public Map<String,Object> dashboard(){ |
|||
return null; |
|||
} |
|||
} |
|||
@ -0,0 +1,15 @@ |
|||
package io.sc.platform.scheduler.manager.controller; |
|||
|
|||
import io.sc.platform.mvc.controller.support.RestCrudController; |
|||
import io.sc.platform.scheduler.core.vo.TaskVo; |
|||
import io.sc.platform.scheduler.manager.jpa.entity.TaskEntity; |
|||
import io.sc.platform.scheduler.manager.jpa.repository.TaskRepository; |
|||
import io.sc.platform.scheduler.manager.service.TaskService; |
|||
import org.springframework.web.bind.annotation.RequestMapping; |
|||
import org.springframework.web.bind.annotation.RestController; |
|||
|
|||
@RestController |
|||
@RequestMapping("/api/scheduler/task") |
|||
public class TaskWebController extends RestCrudController<TaskVo, TaskEntity, String, TaskRepository, TaskService> { |
|||
|
|||
} |
|||
@ -0,0 +1,91 @@ |
|||
package io.sc.platform.scheduler.manager.jpa.entity; |
|||
|
|||
import io.sc.platform.orm.entity.CorporationAuditorEntity; |
|||
import io.sc.platform.scheduler.core.enums.GlueType; |
|||
import io.sc.platform.scheduler.core.vo.GlueVo; |
|||
import org.hibernate.annotations.GenericGenerator; |
|||
import org.springframework.util.StringUtils; |
|||
|
|||
import javax.persistence.*; |
|||
import javax.validation.constraints.Size; |
|||
|
|||
@Entity |
|||
@Table(name="JOB_GLUE") |
|||
public class GlueEntity extends CorporationAuditorEntity<GlueVo> { |
|||
//主键
|
|||
@Id |
|||
@GeneratedValue(generator = "system-uuid") |
|||
@GenericGenerator(name = "system-uuid", strategy = "uuid2") |
|||
@Column(name="ID_", length=36) |
|||
@Size(max=36) |
|||
private String id; |
|||
|
|||
@Column(name="GLUE_TYPE_") |
|||
@Enumerated(EnumType.STRING) |
|||
private GlueType type; |
|||
|
|||
@Column(name="DESCRIPTION_", length=255) |
|||
@Size(max=255) |
|||
private String description; |
|||
|
|||
@Column(name="SOURCE_") |
|||
private String source; |
|||
|
|||
@ManyToOne(fetch=FetchType.LAZY) |
|||
@JoinColumn(name="TASK_ID_") |
|||
private TaskEntity task; |
|||
|
|||
@Override |
|||
public GlueVo toVo() { |
|||
GlueVo vo =new GlueVo(); |
|||
super.toVo(vo); |
|||
vo.setId(this.getId()); |
|||
vo.setType(this.getType()); |
|||
vo.setDescription(this.getDescription()); |
|||
vo.setSource(this.getSource()); |
|||
if(task!=null && StringUtils.hasText(task.getId())){ |
|||
vo.setTask(task.getId()); |
|||
} |
|||
return vo; |
|||
} |
|||
|
|||
public String getId() { |
|||
return id; |
|||
} |
|||
|
|||
public void setId(String id) { |
|||
this.id = id; |
|||
} |
|||
|
|||
public GlueType getType() { |
|||
return type; |
|||
} |
|||
|
|||
public void setType(GlueType type) { |
|||
this.type = type; |
|||
} |
|||
|
|||
public String getDescription() { |
|||
return description; |
|||
} |
|||
|
|||
public void setDescription(String description) { |
|||
this.description = description; |
|||
} |
|||
|
|||
public String getSource() { |
|||
return source; |
|||
} |
|||
|
|||
public void setSource(String source) { |
|||
this.source = source; |
|||
} |
|||
|
|||
public TaskEntity getTask() { |
|||
return task; |
|||
} |
|||
|
|||
public void setTask(TaskEntity task) { |
|||
this.task = task; |
|||
} |
|||
} |
|||
@ -1,8 +1,7 @@ |
|||
package io.sc.platform.scheduler.manager.jpa.repository; |
|||
|
|||
import io.sc.platform.scheduler.manager.jpa.entity.TaskLogEntity; |
|||
import io.sc.platform.scheduler.manager.jpa.entity.TaskLogReportEntity; |
|||
import io.sc.platform.scheduler.manager.jpa.entity.ReportEntity; |
|||
import io.sc.platform.orm.repository.DaoRepository; |
|||
|
|||
public interface TaskLogReportRepository extends DaoRepository<TaskLogReportEntity,String> { |
|||
public interface TaskLogReportRepository extends DaoRepository<ReportEntity,String> { |
|||
} |
|||
|
|||
@ -0,0 +1,9 @@ |
|||
package io.sc.platform.scheduler.manager.service; |
|||
|
|||
import io.sc.platform.orm.service.DaoService; |
|||
import io.sc.platform.scheduler.manager.jpa.entity.ExecutorEntity; |
|||
import io.sc.platform.scheduler.manager.jpa.repository.ExecutorRepository; |
|||
|
|||
public interface ExecutorService extends DaoService<ExecutorEntity, String, ExecutorRepository> { |
|||
|
|||
} |
|||
@ -0,0 +1,7 @@ |
|||
package io.sc.platform.scheduler.manager.service; |
|||
|
|||
import java.util.Map; |
|||
|
|||
public interface ReportService { |
|||
public Map<String,Object> dashboard(); |
|||
} |
|||
@ -0,0 +1,9 @@ |
|||
package io.sc.platform.scheduler.manager.service; |
|||
|
|||
import io.sc.platform.orm.service.DaoService; |
|||
import io.sc.platform.scheduler.manager.jpa.entity.TaskEntity; |
|||
import io.sc.platform.scheduler.manager.jpa.repository.TaskRepository; |
|||
|
|||
public interface TaskService extends DaoService<TaskEntity, String, TaskRepository> { |
|||
|
|||
} |
|||
@ -0,0 +1,12 @@ |
|||
package io.sc.platform.scheduler.manager.service.impl; |
|||
|
|||
import io.sc.platform.orm.service.impl.DaoServiceImpl; |
|||
import io.sc.platform.scheduler.manager.jpa.entity.ExecutorEntity; |
|||
import io.sc.platform.scheduler.manager.jpa.repository.ExecutorRepository; |
|||
import io.sc.platform.scheduler.manager.service.ExecutorService; |
|||
import org.springframework.stereotype.Service; |
|||
|
|||
@Service |
|||
public class ExecutorServiceImpl extends DaoServiceImpl<ExecutorEntity, String, ExecutorRepository> implements ExecutorService { |
|||
|
|||
} |
|||
@ -0,0 +1,13 @@ |
|||
package io.sc.platform.scheduler.manager.service.impl; |
|||
|
|||
import io.sc.platform.scheduler.manager.service.ReportService; |
|||
import org.springframework.beans.factory.annotation.Autowired; |
|||
|
|||
import java.util.Map; |
|||
|
|||
public class ReportServiceImpl implements ReportService { |
|||
@Override |
|||
public Map<String, Object> dashboard() { |
|||
return null; |
|||
} |
|||
} |
|||
@ -0,0 +1,12 @@ |
|||
package io.sc.platform.scheduler.manager.service.impl; |
|||
|
|||
import io.sc.platform.orm.service.impl.DaoServiceImpl; |
|||
import io.sc.platform.scheduler.manager.jpa.entity.TaskEntity; |
|||
import io.sc.platform.scheduler.manager.jpa.repository.TaskRepository; |
|||
import io.sc.platform.scheduler.manager.service.TaskService; |
|||
import org.springframework.stereotype.Service; |
|||
|
|||
@Service |
|||
public class TaskServiceImpl extends DaoServiceImpl<TaskEntity, String, TaskRepository> implements TaskService { |
|||
|
|||
} |
|||
Loading…
Reference in new issue