734 lines
24 KiB
Vue
734 lines
24 KiB
Vue
|
<!--
|
|||
|
|
* @Descripttion: cron规则生成器
|
|||
|
|
* @version: 1.0
|
|||
|
|
* @Author: sakuya
|
|||
|
|
* @Date: 2021年12月29日15:23:54
|
|||
|
|
* @LastEditors:
|
|||
|
|
* @LastEditTime:
|
|||
|
|
-->
|
|||
|
|
|
|||
|
|
<template>
|
|||
|
|
<el-input v-model="defaultValue" v-bind="$attrs">
|
|||
|
|
<template #append>
|
|||
|
|
<el-dropdown size="medium" @command="handleShortcuts">
|
|||
|
|
<el-button icon="el-icon-arrow-down"></el-button>
|
|||
|
|
<template #dropdown>
|
|||
|
|
<el-dropdown-menu>
|
|||
|
|
<el-dropdown-item command="0 * * * * ?">每分钟</el-dropdown-item>
|
|||
|
|
<el-dropdown-item command="0 0 * * * ?">每小时</el-dropdown-item>
|
|||
|
|
<el-dropdown-item command="0 0 0 * * ?">每天零点</el-dropdown-item>
|
|||
|
|
<el-dropdown-item command="0 0 0 1 * ?">每月一号零点</el-dropdown-item>
|
|||
|
|
<el-dropdown-item command="0 0 0 L * ?">每月最后一天零点</el-dropdown-item>
|
|||
|
|
<el-dropdown-item command="0 0 0 ? * 1">每周星期日零点</el-dropdown-item>
|
|||
|
|
<el-dropdown-item v-for="(item, index) in shortcuts" :key="item.value" :divided="index==0" :command="item.value">{{item.text}}</el-dropdown-item>
|
|||
|
|
<el-dropdown-item icon="el-icon-plus" divided command="custom">自定义</el-dropdown-item>
|
|||
|
|
</el-dropdown-menu>
|
|||
|
|
</template>
|
|||
|
|
</el-dropdown>
|
|||
|
|
</template>
|
|||
|
|
</el-input>
|
|||
|
|
|
|||
|
|
<el-dialog title="cron规则生成器" v-model="dialogVisible" :width="580" destroy-on-close append-to-body>
|
|||
|
|
<div class="sc-cron">
|
|||
|
|
<el-tabs>
|
|||
|
|
<el-tab-pane>
|
|||
|
|
<template #label>
|
|||
|
|
<div class="sc-cron-num">
|
|||
|
|
<h2>秒</h2>
|
|||
|
|
<h4>{{value_second}}</h4>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<el-form>
|
|||
|
|
<el-form-item label="类型">
|
|||
|
|
<el-radio-group v-model="value.second.type">
|
|||
|
|
<el-radio-button label="0">任意值</el-radio-button>
|
|||
|
|
<el-radio-button label="1">范围</el-radio-button>
|
|||
|
|
<el-radio-button label="2">间隔</el-radio-button>
|
|||
|
|
<el-radio-button label="3">指定</el-radio-button>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="范围" v-if="value.second.type==1">
|
|||
|
|
<el-input-number v-model="value.second.range.start" :min="0" :max="59" controls-position="right"></el-input-number>
|
|||
|
|
<span style="padding:0 15px;">-</span>
|
|||
|
|
<el-input-number v-model="value.second.range.end" :min="0" :max="59" controls-position="right"></el-input-number>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="间隔" v-if="value.second.type==2">
|
|||
|
|
<el-input-number v-model="value.second.loop.start" :min="0" :max="59" controls-position="right"></el-input-number>
|
|||
|
|
秒开始，每
|
|||
|
|
<el-input-number v-model="value.second.loop.end" :min="0" :max="59" controls-position="right"></el-input-number>
|
|||
|
|
秒执行一次
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="指定" v-if="value.second.type==3">
|
|||
|
|
<el-select v-model="value.second.appoint" multiple style="width: 100%;">
|
|||
|
|
<el-option v-for="(item, index) in data.second" :key="index" :label="item" :value="item"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-tab-pane>
|
|||
|
|
<el-tab-pane>
|
|||
|
|
<template #label>
|
|||
|
|
<div class="sc-cron-num">
|
|||
|
|
<h2>分钟</h2>
|
|||
|
|
<h4>{{value_minute}}</h4>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<el-form>
|
|||
|
|
<el-form-item label="类型">
|
|||
|
|
<el-radio-group v-model="value.minute.type">
|
|||
|
|
<el-radio-button label="0">任意值</el-radio-button>
|
|||
|
|
<el-radio-button label="1">范围</el-radio-button>
|
|||
|
|
<el-radio-button label="2">间隔</el-radio-button>
|
|||
|
|
<el-radio-button label="3">指定</el-radio-button>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="范围" v-if="value.minute.type==1">
|
|||
|
|
<el-input-number v-model="value.minute.range.start" :min="0" :max="59" controls-position="right"></el-input-number>
|
|||
|
|
<span style="padding:0 15px;">-</span>
|
|||
|
|
<el-input-number v-model="value.minute.range.end" :min="0" :max="59" controls-position="right"></el-input-number>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="间隔" v-if="value.minute.type==2">
|
|||
|
|
<el-input-number v-model="value.minute.loop.start" :min="0" :max="59" controls-position="right"></el-input-number>
|
|||
|
|
分钟开始，每
|
|||
|
|
<el-input-number v-model="value.minute.loop.end" :min="0" :max="59" controls-position="right"></el-input-number>
|
|||
|
|
分钟执行一次
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="指定" v-if="value.minute.type==3">
|
|||
|
|
<el-select v-model="value.minute.appoint" multiple style="width: 100%;">
|
|||
|
|
<el-option v-for="(item, index) in data.minute" :key="index" :label="item" :value="item"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-tab-pane>
|
|||
|
|
<el-tab-pane>
|
|||
|
|
<template #label>
|
|||
|
|
<div class="sc-cron-num">
|
|||
|
|
<h2>小时</h2>
|
|||
|
|
<h4>{{value_hour}}</h4>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<el-form>
|
|||
|
|
<el-form-item label="类型">
|
|||
|
|
<el-radio-group v-model="value.hour.type">
|
|||
|
|
<el-radio-button label="0">任意值</el-radio-button>
|
|||
|
|
<el-radio-button label="1">范围</el-radio-button>
|
|||
|
|
<el-radio-button label="2">间隔</el-radio-button>
|
|||
|
|
<el-radio-button label="3">指定</el-radio-button>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="范围" v-if="value.hour.type==1">
|
|||
|
|
<el-input-number v-model="value.hour.range.start" :min="0" :max="23" controls-position="right"></el-input-number>
|
|||
|
|
<span style="padding:0 15px;">-</span>
|
|||
|
|
<el-input-number v-model="value.hour.range.end" :min="0" :max="23" controls-position="right"></el-input-number>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="间隔" v-if="value.hour.type==2">
|
|||
|
|
<el-input-number v-model="value.hour.loop.start" :min="0" :max="23" controls-position="right"></el-input-number>
|
|||
|
|
小时开始，每
|
|||
|
|
<el-input-number v-model="value.hour.loop.end" :min="0" :max="23" controls-position="right"></el-input-number>
|
|||
|
|
小时执行一次
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="指定" v-if="value.hour.type==3">
|
|||
|
|
<el-select v-model="value.hour.appoint" multiple style="width: 100%;">
|
|||
|
|
<el-option v-for="(item, index) in data.hour" :key="index" :label="item" :value="item"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-tab-pane>
|
|||
|
|
<el-tab-pane>
|
|||
|
|
<template #label>
|
|||
|
|
<div class="sc-cron-num">
|
|||
|
|
<h2>日</h2>
|
|||
|
|
<h4>{{value_day}}</h4>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<el-form>
|
|||
|
|
<el-form-item label="类型">
|
|||
|
|
<el-radio-group v-model="value.day.type">
|
|||
|
|
<el-radio-button label="0">任意值</el-radio-button>
|
|||
|
|
<el-radio-button label="1">范围</el-radio-button>
|
|||
|
|
<el-radio-button label="2">间隔</el-radio-button>
|
|||
|
|
<el-radio-button label="3">指定</el-radio-button>
|
|||
|
|
<el-radio-button label="4">本月最后一天</el-radio-button>
|
|||
|
|
<el-radio-button label="5">不指定</el-radio-button>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="范围" v-if="value.day.type==1">
|
|||
|
|
<el-input-number v-model="value.day.range.start" :min="1" :max="31" controls-position="right"></el-input-number>
|
|||
|
|
<span style="padding:0 15px;">-</span>
|
|||
|
|
<el-input-number v-model="value.day.range.end" :min="1" :max="31" controls-position="right"></el-input-number>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="间隔" v-if="value.day.type==2">
|
|||
|
|
<el-input-number v-model="value.day.loop.start" :min="1" :max="31" controls-position="right"></el-input-number>
|
|||
|
|
号开始，每
|
|||
|
|
<el-input-number v-model="value.day.loop.end" :min="1" :max="31" controls-position="right"></el-input-number>
|
|||
|
|
天执行一次
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="指定" v-if="value.day.type==3">
|
|||
|
|
<el-select v-model="value.day.appoint" multiple style="width: 100%;">
|
|||
|
|
<el-option v-for="(item, index) in data.day" :key="index" :label="item" :value="item"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-tab-pane>
|
|||
|
|
<el-tab-pane>
|
|||
|
|
<template #label>
|
|||
|
|
<div class="sc-cron-num">
|
|||
|
|
<h2>月</h2>
|
|||
|
|
<h4>{{value_month}}</h4>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<el-form>
|
|||
|
|
<el-form-item label="类型">
|
|||
|
|
<el-radio-group v-model="value.month.type">
|
|||
|
|
<el-radio-button label="0">任意值</el-radio-button>
|
|||
|
|
<el-radio-button label="1">范围</el-radio-button>
|
|||
|
|
<el-radio-button label="2">间隔</el-radio-button>
|
|||
|
|
<el-radio-button label="3">指定</el-radio-button>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="范围" v-if="value.month.type==1">
|
|||
|
|
<el-input-number v-model="value.month.range.start" :min="1" :max="12" controls-position="right"></el-input-number>
|
|||
|
|
<span style="padding:0 15px;">-</span>
|
|||
|
|
<el-input-number v-model="value.month.range.end" :min="1" :max="12" controls-position="right"></el-input-number>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="间隔" v-if="value.month.type==2">
|
|||
|
|
<el-input-number v-model="value.month.loop.start" :min="1" :max="12" controls-position="right"></el-input-number>
|
|||
|
|
月开始，每
|
|||
|
|
<el-input-number v-model="value.month.loop.end" :min="1" :max="12" controls-position="right"></el-input-number>
|
|||
|
|
月执行一次
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="指定" v-if="value.month.type==3">
|
|||
|
|
<el-select v-model="value.month.appoint" multiple style="width: 100%;">
|
|||
|
|
<el-option v-for="(item, index) in data.month" :key="index" :label="item" :value="item"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-tab-pane>
|
|||
|
|
<el-tab-pane>
|
|||
|
|
<template #label>
|
|||
|
|
<div class="sc-cron-num">
|
|||
|
|
<h2>周</h2>
|
|||
|
|
<h4>{{value_week}}</h4>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<el-form>
|
|||
|
|
<el-form>
|
|||
|
|
<el-form-item label="类型">
|
|||
|
|
<el-radio-group v-model="value.week.type">
|
|||
|
|
<el-radio-button label="0">任意值</el-radio-button>
|
|||
|
|
<el-radio-button label="1">范围</el-radio-button>
|
|||
|
|
<el-radio-button label="2">间隔</el-radio-button>
|
|||
|
|
<el-radio-button label="3">指定</el-radio-button>
|
|||
|
|
<el-radio-button label="4">本月最后一周</el-radio-button>
|
|||
|
|
<el-radio-button label="5">不指定</el-radio-button>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="范围" v-if="value.week.type==1">
|
|||
|
|
<el-select v-model="value.week.range.start">
|
|||
|
|
<el-option v-for="(item, index) in data.week" :key="index" :label="item.label" :value="item.value"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
<span style="padding:0 15px;">-</span>
|
|||
|
|
<el-select v-model="value.week.range.end">
|
|||
|
|
<el-option v-for="(item, index) in data.week" :key="index" :label="item.label" :value="item.value"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="间隔" v-if="value.week.type==2">
|
|||
|
|
第
|
|||
|
|
<el-input-number v-model="value.week.loop.start" :min="1" :max="4" controls-position="right"></el-input-number>
|
|||
|
|
周的星期
|
|||
|
|
<el-select v-model="value.week.loop.end">
|
|||
|
|
<el-option v-for="(item, index) in data.week" :key="index" :label="item.label" :value="item.value"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
执行一次
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="指定" v-if="value.week.type==3">
|
|||
|
|
<el-select v-model="value.week.appoint" multiple style="width: 100%;">
|
|||
|
|
<el-option v-for="(item, index) in data.week" :key="index" :label="item.label" :value="item.value"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="最后一周" v-if="value.week.type==4">
|
|||
|
|
<el-select v-model="value.week.last">
|
|||
|
|
<el-option v-for="(item, index) in data.week" :key="index" :label="item.label" :value="item.value"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-form>
|
|||
|
|
</el-tab-pane>
|
|||
|
|
<el-tab-pane>
|
|||
|
|
<template #label>
|
|||
|
|
<div class="sc-cron-num">
|
|||
|
|
<h2>年</h2>
|
|||
|
|
<h4>{{value_year}}</h4>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<el-form>
|
|||
|
|
<el-form-item label="类型">
|
|||
|
|
<el-radio-group v-model="value.year.type">
|
|||
|
|
<el-radio-button label="-1">忽略</el-radio-button>
|
|||
|
|
<el-radio-button label="0">任意值</el-radio-button>
|
|||
|
|
<el-radio-button label="1">范围</el-radio-button>
|
|||
|
|
<el-radio-button label="2">间隔</el-radio-button>
|
|||
|
|
<el-radio-button label="3">指定</el-radio-button>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="范围" v-if="value.year.type==1">
|
|||
|
|
<el-input-number v-model="value.year.range.start" controls-position="right"></el-input-number>
|
|||
|
|
<span style="padding:0 15px;">-</span>
|
|||
|
|
<el-input-number v-model="value.year.range.end" controls-position="right"></el-input-number>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="间隔" v-if="value.year.type==2">
|
|||
|
|
<el-input-number v-model="value.year.loop.start" controls-position="right"></el-input-number>
|
|||
|
|
年开始，每
|
|||
|
|
<el-input-number v-model="value.year.loop.end" :min="1" controls-position="right"></el-input-number>
|
|||
|
|
年执行一次
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="指定" v-if="value.year.type==3">
|
|||
|
|
<el-select v-model="value.year.appoint" multiple style="width: 100%;">
|
|||
|
|
<el-option v-for="(item, index) in data.year" :key="index" :label="item" :value="item"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-tab-pane>
|
|||
|
|
</el-tabs>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<template #footer>
|
|||
|
|
<el-button @click="dialogVisible=false" >取 消</el-button>
|
|||
|
|
<el-button type="primary" @click="submit()">确 认</el-button>
|
|||
|
|
</template>
|
|||
|
|
</el-dialog>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
props: {
|
|||
|
|
modelValue: { type: String, default: "* * * * * ?" },
|
|||
|
|
shortcuts: { type: Array, default: () => [] }
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
type: '0',
|
|||
|
|
defaultValue: '',
|
|||
|
|
dialogVisible: false,
|
|||
|
|
|
|||
|
|
value:{
|
|||
|
|
second: {
|
|||
|
|
type: '0',
|
|||
|
|
range: {
|
|||
|
|
start: 1,
|
|||
|
|
end: 2
|
|||
|
|
},
|
|||
|
|
loop: {
|
|||
|
|
start: 0,
|
|||
|
|
end: 1
|
|||
|
|
},
|
|||
|
|
appoint: []
|
|||
|
|
},
|
|||
|
|
minute: {
|
|||
|
|
type: '0',
|
|||
|
|
range: {
|
|||
|
|
start: 1,
|
|||
|
|
end: 2
|
|||
|
|
},
|
|||
|
|
loop: {
|
|||
|
|
start: 0,
|
|||
|
|
end: 1
|
|||
|
|
},
|
|||
|
|
appoint: []
|
|||
|
|
},
|
|||
|
|
hour: {
|
|||
|
|
type: '0',
|
|||
|
|
range: {
|
|||
|
|
start: 1,
|
|||
|
|
end: 2
|
|||
|
|
},
|
|||
|
|
loop: {
|
|||
|
|
start: 0,
|
|||
|
|
end: 1
|
|||
|
|
},
|
|||
|
|
appoint: []
|
|||
|
|
},
|
|||
|
|
day: {
|
|||
|
|
type: '0',
|
|||
|
|
range: {
|
|||
|
|
start: 1,
|
|||
|
|
end: 2
|
|||
|
|
},
|
|||
|
|
loop: {
|
|||
|
|
start: 1,
|
|||
|
|
end: 1
|
|||
|
|
},
|
|||
|
|
appoint: []
|
|||
|
|
},
|
|||
|
|
month: {
|
|||
|
|
type: '0',
|
|||
|
|
range: {
|
|||
|
|
start: 1,
|
|||
|
|
end: 2
|
|||
|
|
},
|
|||
|
|
loop: {
|
|||
|
|
start: 1,
|
|||
|
|
end: 1
|
|||
|
|
},
|
|||
|
|
appoint: []
|
|||
|
|
},
|
|||
|
|
week: {
|
|||
|
|
type: '5',
|
|||
|
|
range: {
|
|||
|
|
start: '2',
|
|||
|
|
end: '3'
|
|||
|
|
},
|
|||
|
|
loop: {
|
|||
|
|
start: 0,
|
|||
|
|
end: '2'
|
|||
|
|
},
|
|||
|
|
last: '2',
|
|||
|
|
appoint: []
|
|||
|
|
},
|
|||
|
|
year: {
|
|||
|
|
type: '-1',
|
|||
|
|
range: {
|
|||
|
|
start: this.getYear()[0],
|
|||
|
|
end: this.getYear()[1]
|
|||
|
|
},
|
|||
|
|
loop: {
|
|||
|
|
start: this.getYear()[0],
|
|||
|
|
end: 1
|
|||
|
|
},
|
|||
|
|
appoint: []
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
data: {
|
|||
|
|
second: ['0','5','15','20','25','30','35','40','45','50','55','59'],
|
|||
|
|
minute: ['0','5','15','20','25','30','35','40','45','50','55','59'],
|
|||
|
|
hour: ['0','1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23'],
|
|||
|
|
day: ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24','25','26','27','28','29','30','31'],
|
|||
|
|
month: ['1','2','3','4','5','6','7','8','9','10','11','12'],
|
|||
|
|
week: [
|
|||
|
|
{
|
|||
|
|
value: '1',
|
|||
|
|
label: '周日'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value: '2',
|
|||
|
|
label: '周一'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value: '3',
|
|||
|
|
label: '周二'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value: '4',
|
|||
|
|
label: '周三'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value: '5',
|
|||
|
|
label: '周四'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value: '6',
|
|||
|
|
label: '周五'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value: '7',
|
|||
|
|
label: '周六'
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
year: this.getYear()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
'value.week.type'(val){
|
|||
|
|
if(val != '5'){
|
|||
|
|
this.value.day.type = '5'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
'value.day.type'(val){
|
|||
|
|
if(val != '5'){
|
|||
|
|
this.value.week.type = '5'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
modelValue() {
|
|||
|
|
this.defaultValue = this.modelValue
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
value_second(){
|
|||
|
|
let v = this.value.second
|
|||
|
|
if(v.type == 0){
|
|||
|
|
return '*'
|
|||
|
|
}else if(v.type==1){
|
|||
|
|
return v.range.start + '-' +v.range.end
|
|||
|
|
}else if(v.type==2){
|
|||
|
|
return v.loop.start + '/' + v.loop.end
|
|||
|
|
}else if(v.type==3){
|
|||
|
|
return v.appoint.length>0 ? v.appoint.join(',') : '*'
|
|||
|
|
}else{
|
|||
|
|
return '*'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
value_minute(){
|
|||
|
|
let v = this.value.minute
|
|||
|
|
if(v.type == 0){
|
|||
|
|
return '*'
|
|||
|
|
}else if(v.type==1){
|
|||
|
|
return v.range.start + '-' +v.range.end
|
|||
|
|
}else if(v.type==2){
|
|||
|
|
return v.loop.start + '/' + v.loop.end
|
|||
|
|
}else if(v.type==3){
|
|||
|
|
return v.appoint.length>0 ? v.appoint.join(',') : '*'
|
|||
|
|
}else{
|
|||
|
|
return '*'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
value_hour(){
|
|||
|
|
let v = this.value.hour
|
|||
|
|
if(v.type == 0){
|
|||
|
|
return '*'
|
|||
|
|
}else if(v.type==1){
|
|||
|
|
return v.range.start + '-' +v.range.end
|
|||
|
|
}else if(v.type==2){
|
|||
|
|
return v.loop.start + '/' + v.loop.end
|
|||
|
|
}else if(v.type==3){
|
|||
|
|
return v.appoint.length>0 ? v.appoint.join(',') : '*'
|
|||
|
|
}else{
|
|||
|
|
return '*'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
value_day(){
|
|||
|
|
let v = this.value.day
|
|||
|
|
if(v.type == 0){
|
|||
|
|
return '*'
|
|||
|
|
}else if(v.type==1){
|
|||
|
|
return v.range.start + '-' +v.range.end
|
|||
|
|
}else if(v.type==2){
|
|||
|
|
return v.loop.start + '/' + v.loop.end
|
|||
|
|
}else if(v.type==3){
|
|||
|
|
return v.appoint.length>0 ? v.appoint.join(',') : '*'
|
|||
|
|
}else if(v.type==4){
|
|||
|
|
return 'L'
|
|||
|
|
}else if(v.type==5){
|
|||
|
|
return '?'
|
|||
|
|
}else{
|
|||
|
|
return '*'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
value_month(){
|
|||
|
|
let v = this.value.month
|
|||
|
|
if(v.type == 0){
|
|||
|
|
return '*'
|
|||
|
|
}else if(v.type==1){
|
|||
|
|
return v.range.start + '-' +v.range.end
|
|||
|
|
}else if(v.type==2){
|
|||
|
|
return v.loop.start + '/' + v.loop.end
|
|||
|
|
}else if(v.type==3){
|
|||
|
|
return v.appoint.length>0 ? v.appoint.join(',') : '*'
|
|||
|
|
}else{
|
|||
|
|
return '*'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
value_week(){
|
|||
|
|
let v = this.value.week
|
|||
|
|
if(v.type == 0){
|
|||
|
|
return '*'
|
|||
|
|
}else if(v.type==1){
|
|||
|
|
return v.range.start + '-' +v.range.end
|
|||
|
|
}else if(v.type==2){
|
|||
|
|
return v.loop.end + '#' + v.loop.start
|
|||
|
|
}else if(v.type==3){
|
|||
|
|
return v.appoint.length>0 ? v.appoint.join(',') : '*'
|
|||
|
|
}else if(v.type==4){
|
|||
|
|
return v.last + 'L'
|
|||
|
|
}else if(v.type==5){
|
|||
|
|
return '?'
|
|||
|
|
}else{
|
|||
|
|
return '*'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
value_year(){
|
|||
|
|
let v = this.value.year
|
|||
|
|
if(v.type == -1){
|
|||
|
|
return ''
|
|||
|
|
}else if(v.type==0){
|
|||
|
|
return '*'
|
|||
|
|
}else if(v.type==1){
|
|||
|
|
return v.range.start + '-' +v.range.end
|
|||
|
|
}else if(v.type==2){
|
|||
|
|
return v.loop.start + '/' + v.loop.end
|
|||
|
|
}else if(v.type==3){
|
|||
|
|
return v.appoint.length>0 ? v.appoint.join(',') : ''
|
|||
|
|
}else{
|
|||
|
|
return ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
this.defaultValue = this.modelValue
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
handleShortcuts(command){
|
|||
|
|
if(command == 'custom'){
|
|||
|
|
this.open()
|
|||
|
|
}else{
|
|||
|
|
this.defaultValue = command
|
|||
|
|
this.$emit('update:modelValue', this.defaultValue)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
open(){
|
|||
|
|
this.set()
|
|||
|
|
this.dialogVisible = true
|
|||
|
|
},
|
|||
|
|
set(){
|
|||
|
|
this.defaultValue = this.modelValue
|
|||
|
|
let arr = (this.modelValue || "* * * * * ?").split(" ")
|
|||
|
|
//简单检查
|
|||
|
|
if(arr.length < 6){
|
|||
|
|
this.$message.warning("cron表达式错误，已转换为默认表达式")
|
|||
|
|
arr = "* * * * * ?".split(" ")
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//秒
|
|||
|
|
if(arr[0]=='*'){
|
|||
|
|
this.value.second.type = '0'
|
|||
|
|
}else if(arr[0].includes('-')){
|
|||
|
|
this.value.second.type = '1'
|
|||
|
|
this.value.second.range.start = Number(arr[0].split("-")[0])
|
|||
|
|
this.value.second.range.end = Number(arr[0].split("-")[1])
|
|||
|
|
}else if(arr[0].includes('/')){
|
|||
|
|
this.value.second.type = '2'
|
|||
|
|
this.value.second.loop.start = Number(arr[0].split("/")[0])
|
|||
|
|
this.value.second.loop.end = Number(arr[0].split("/")[1])
|
|||
|
|
}else{
|
|||
|
|
this.value.second.type = '3'
|
|||
|
|
this.value.second.appoint = arr[0].split(",")
|
|||
|
|
}
|
|||
|
|
//分
|
|||
|
|
if(arr[1]=='*'){
|
|||
|
|
this.value.minute.type = '0'
|
|||
|
|
}else if(arr[1].includes('-')){
|
|||
|
|
this.value.minute.type = '1'
|
|||
|
|
this.value.minute.range.start = Number(arr[1].split("-")[0])
|
|||
|
|
this.value.minute.range.end = Number(arr[1].split("-")[1])
|
|||
|
|
}else if(arr[1].includes('/')){
|
|||
|
|
this.value.minute.type = '2'
|
|||
|
|
this.value.minute.loop.start = Number(arr[1].split("/")[0])
|
|||
|
|
this.value.minute.loop.end = Number(arr[1].split("/")[1])
|
|||
|
|
}else{
|
|||
|
|
this.value.minute.type = '3'
|
|||
|
|
this.value.minute.appoint = arr[1].split(",")
|
|||
|
|
}
|
|||
|
|
//小时
|
|||
|
|
if(arr[2]=='*'){
|
|||
|
|
this.value.hour.type = '0'
|
|||
|
|
}else if(arr[2].includes('-')){
|
|||
|
|
this.value.hour.type = '1'
|
|||
|
|
this.value.hour.range.start = Number(arr[2].split("-")[0])
|
|||
|
|
this.value.hour.range.end = Number(arr[2].split("-")[1])
|
|||
|
|
}else if(arr[2].includes('/')){
|
|||
|
|
this.value.hour.type = '2'
|
|||
|
|
this.value.hour.loop.start = Number(arr[2].split("/")[0])
|
|||
|
|
this.value.hour.loop.end = Number(arr[2].split("/")[1])
|
|||
|
|
}else{
|
|||
|
|
this.value.hour.type = '3'
|
|||
|
|
this.value.hour.appoint = arr[2].split(",")
|
|||
|
|
}
|
|||
|
|
//日
|
|||
|
|
if(arr[3]=='*'){
|
|||
|
|
this.value.day.type = '0'
|
|||
|
|
}else if(arr[3]=='L'){
|
|||
|
|
this.value.day.type = '4'
|
|||
|
|
}else if(arr[3]=='?'){
|
|||
|
|
this.value.day.type = '5'
|
|||
|
|
}else if(arr[3].includes('-')){
|
|||
|
|
this.value.day.type = '1'
|
|||
|
|
this.value.day.range.start = Number(arr[3].split("-")[0])
|
|||
|
|
this.value.day.range.end = Number(arr[3].split("-")[1])
|
|||
|
|
}else if(arr[3].includes('/')){
|
|||
|
|
this.value.day.type = '2'
|
|||
|
|
this.value.day.loop.start = Number(arr[3].split("/")[0])
|
|||
|
|
this.value.day.loop.end = Number(arr[3].split("/")[1])
|
|||
|
|
}else{
|
|||
|
|
this.value.day.type = '3'
|
|||
|
|
this.value.day.appoint = arr[3].split(",")
|
|||
|
|
}
|
|||
|
|
//月
|
|||
|
|
if(arr[4]=='*'){
|
|||
|
|
this.value.month.type = '0'
|
|||
|
|
}else if(arr[4].includes('-')){
|
|||
|
|
this.value.month.type = '1'
|
|||
|
|
this.value.month.range.start = Number(arr[4].split("-")[0])
|
|||
|
|
this.value.month.range.end = Number(arr[4].split("-")[1])
|
|||
|
|
}else if(arr[4].includes('/')){
|
|||
|
|
this.value.month.type = '2'
|
|||
|
|
this.value.month.loop.start = Number(arr[4].split("/")[0])
|
|||
|
|
this.value.month.loop.end = Number(arr[4].split("/")[1])
|
|||
|
|
}else{
|
|||
|
|
this.value.month.type = '3'
|
|||
|
|
this.value.month.appoint = arr[4].split(",")
|
|||
|
|
}
|
|||
|
|
//周
|
|||
|
|
if(arr[5]=='*'){
|
|||
|
|
this.value.week.type = '0'
|
|||
|
|
}else if(arr[5]=='?'){
|
|||
|
|
this.value.week.type = '5'
|
|||
|
|
}else if(arr[5].includes('-')){
|
|||
|
|
this.value.week.type = '1'
|
|||
|
|
this.value.week.range.start = arr[5].split("-")[0]
|
|||
|
|
this.value.week.range.end = arr[5].split("-")[1]
|
|||
|
|
}else if(arr[5].includes('#')){
|
|||
|
|
this.value.week.type = '2'
|
|||
|
|
this.value.week.loop.start = Number(arr[5].split("#")[1])
|
|||
|
|
this.value.week.loop.end = arr[5].split("#")[0]
|
|||
|
|
}else if(arr[5].includes('L')){
|
|||
|
|
this.value.week.type = '4'
|
|||
|
|
this.value.week.last = arr[5].split("L")[0]
|
|||
|
|
}else{
|
|||
|
|
this.value.week.type = '3'
|
|||
|
|
this.value.week.appoint = arr[5].split(",")
|
|||
|
|
}
|
|||
|
|
//年
|
|||
|
|
if(!arr[6]){
|
|||
|
|
this.value.year.type = '-1'
|
|||
|
|
}else if(arr[6]=='*'){
|
|||
|
|
this.value.year.type = '0'
|
|||
|
|
}else if(arr[6].includes('-')){
|
|||
|
|
this.value.year.type = '1'
|
|||
|
|
this.value.year.range.start = Number(arr[6].split("-")[0])
|
|||
|
|
this.value.year.range.end = Number(arr[6].split("-")[1])
|
|||
|
|
}else if(arr[6].includes('/')){
|
|||
|
|
this.value.year.type = '2'
|
|||
|
|
this.value.year.loop.start = Number(arr[6].split("/")[1])
|
|||
|
|
this.value.year.loop.end = Number(arr[6].split("/")[0])
|
|||
|
|
}else{
|
|||
|
|
this.value.year.type = '3'
|
|||
|
|
this.value.year.appoint = arr[6].split(",")
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
getYear(){
|
|||
|
|
let v = []
|
|||
|
|
let y = new Date().getFullYear()
|
|||
|
|
for (let i = 0; i < 11; i++) {
|
|||
|
|
v.push(y+i)
|
|||
|
|
}
|
|||
|
|
return v
|
|||
|
|
},
|
|||
|
|
submit(){
|
|||
|
|
let year = this.value_year ? ' '+this.value_year : ''
|
|||
|
|
this.defaultValue = this.value_second + ' ' + this.value_minute + ' ' + this.value_hour + ' ' + this.value_day + ' ' + this.value_month + ' ' + this.value_week + year
|
|||
|
|
this.$emit('update:modelValue', this.defaultValue)
|
|||
|
|
this.dialogVisible = false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped>
|
|||
|
|
.sc-cron:deep(.el-tabs__item) {height: auto;line-height: 1;padding:0 7px;vertical-align: bottom;}
|
|||
|
|
.sc-cron-num {text-align: center;margin-bottom: 15px;width: 100%;}
|
|||
|
|
.sc-cron-num h2 {font-size: 12px;margin-bottom: 15px;font-weight: normal;}
|
|||
|
|
.sc-cron-num h4 {display: block;height: 32px;line-height: 30px;width: 100%;font-size: 12px;padding:0 15px;background: var(--el-color-primary-light-9);border-radius:4px;}
|
|||
|
|
.sc-cron:deep(.el-tabs__item.is-active) .sc-cron-num h4 {background: var(--el-color-primary);color: #fff;}
|
|||
|
|
|
|||
|
|
[data-theme='dark'] .sc-cron-num h4 {background: var(--el-color-white);}
|
|||
|
|
</style>
|