Song/xkrs_ms
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

重置功能修改，

Browse Source 
?：只能用在DayOfMonth和DayOfWeek两个域
This commit is contained in:
yjb 2021-09-22 19:00:25 +08:00
parent 492ee4fae5
commit 6d709f9fab
8 changed files with 844 additions and 826 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
ruoyi-ui/src/components/Crontab/day.vue
View File

@ -15,23 +15,28 @@
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model='radioValue' :label="3">
周期从 周期从
<el-input-number v-model='cycle01' :min="0" :max="31" /> - <el-input-number v-model='cycle01' :min="0" :max="31"/>
<el-input-number v-model='cycle02' :min="0" :max="31" /> 日 -
<el-input-number v-model='cycle02' :min="0" :max="31"/>
日
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model='radioValue' :label="4">
从 从
<el-input-number v-model='average01' :min="0" :max="31" /> 号开始，每 <el-input-number v-model='average01' :min="0" :max="31"/>
<el-input-number v-model='average02' :min="0" :max="31" /> 日执行一次 号开始，每
<el-input-number v-model='average02' :min="0" :max="31"/>
日执行一次
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="5"> <el-radio v-model='radioValue' :label="5">
每月 每月
<el-input-number v-model='workday' :min="0" :max="31" /> 号最近的那个工作日 <el-input-number v-model='workday' :min="0" :max="31"/>
号最近的那个工作日
</el-radio> </el-radio>
</el-form-item> </el-form-item>
@ -45,7 +50,7 @@
<el-radio v-model='radioValue' :label="7"> <el-radio v-model='radioValue' :label="7">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%">
<el-option v-for="item in 31" :key="item" :value="item">{{item}}</el-option> <el-option v-for="item in 31" :key="item" :value="item">{{ item }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
</el-form-item> </el-form-item>
@ -69,23 +74,19 @@ export default {
name: 'crontab-day', name: 'crontab-day',
props: ['check', 'cron'], props: ['check', 'cron'],
methods: { methods: {
init() {
this.workday = 1
this.cycle01 = 1
this.cycle02 = 2
this.average01 = 1
this.average02 = 1
this.checkboxList = []
},
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
('day rachange'); ('day rachange');
if (this.radioValue === 1) { if (this.radioValue === 1) {
this.$emit('update', 'day', '*', 'day'); this.$emit('update', 'day', '*', 'day');
this.$emit('update', 'week', '?', 'day');
this.$emit('update', 'month', '*', 'day');
} else {
if (this.cron.hour === '*') {
this.$emit('update', 'hour', '0', 'day');
}
if (this.cron.min === '*') {
this.$emit('update', 'min', '0', 'day');
}
if (this.cron.second === '*') {
this.$emit('update', 'second', '0', 'day');
}
} }
switch (this.radioValue) { switch (this.radioValue) {

247
ruoyi-ui/src/components/Crontab/hour.vue
View File

@ -1,122 +1,125 @@
<template> <template>
<el-form size="small"> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model='radioValue' :label="1">
小时，允许的通配符[, - * /] 小时，允许的通配符[, - * /]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model='radioValue' :label="2">
周期从 周期从
<el-input-number v-model='cycle01' :min="0" :max="60" /> - <el-input-number v-model='cycle01' :min="0" :max="60"/>
<el-input-number v-model='cycle02' :min="0" :max="60" /> 小时 -
</el-radio> <el-input-number v-model='cycle02' :min="0" :max="60"/>
</el-form-item> 小时
</el-radio>
<el-form-item> </el-form-item>
<el-radio v-model='radioValue' :label="3">
从 <el-form-item>
<el-input-number v-model='average01' :min="0" :max="60" /> 小时开始，每 <el-radio v-model='radioValue' :label="3">
<el-input-number v-model='average02' :min="0" :max="60" /> 小时执行一次 从
</el-radio> <el-input-number v-model='average01' :min="0" :max="60"/>
</el-form-item> 小时开始，每
<el-input-number v-model='average02' :min="0" :max="60"/>
<el-form-item> 小时执行一次
<el-radio v-model='radioValue' :label="4"> </el-radio>
指定 </el-form-item>
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%">
<el-option v-for="item in 60" :key="item" :value="item-1">{{item-1}}</el-option> <el-form-item>
</el-select> <el-radio v-model='radioValue' :label="4">
</el-radio> 指定
</el-form-item> <el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%">
</el-form> <el-option v-for="item in 60" :key="item" :value="item-1">{{ item - 1 }}</el-option>
</template> </el-select>
</el-radio>
<script> </el-form-item>
export default { </el-form>
data() { </template>
return {
radioValue: 1, <script>
cycle01: 0, export default {
cycle02: 1, data() {
average01: 0, return {
average02: 1, radioValue: 1,
checkboxList: [], cycle01: 0,
checkNum: this.$options.propsData.check cycle02: 1,
} average01: 0,
}, average02: 1,
name: 'crontab-hour', checkboxList: [],
props: ['check', 'cron'], checkNum: this.$options.propsData.check
methods: { }
// 单选按钮值变化时 },
radioChange() { name: 'crontab-hour',
if (this.radioValue === 1) { props: ['check', 'cron'],
this.$emit('update', 'hour', '*', 'hour'); methods: {
this.$emit('update', 'day', '*', 'hour'); init() {
} else { this.cycle01 = 0
if (this.cron.min === '*') { this.cycle02 = 1
this.$emit('update', 'min', '0', 'hour'); this.average01 = 0
} this.average02 = 1
if (this.cron.second === '*') { this.checkboxList = []
this.$emit('update', 'second', '0', 'hour'); },
} // 单选按钮值变化时
} radioChange() {
switch (this.radioValue) { if (this.radioValue === 1) {
case 2: this.$emit('update', 'hour', '*', 'hour');
this.$emit('update', 'hour', this.cycle01 + '-' + this.cycle02); }
break; switch (this.radioValue) {
case 3: case 2:
this.$emit('update', 'hour', this.average01 + '/' + this.average02); this.$emit('update', 'hour', this.cycle01 + '-' + this.cycle02);
break; break;
case 4: case 3:
this.$emit('update', 'hour', this.checkboxString); this.$emit('update', 'hour', this.average01 + '/' + this.average02);
break; break;
} case 4:
}, this.$emit('update', 'hour', this.checkboxString);
// 周期两个值变化时 break;
cycleChange() { }
if (this.radioValue == '2') { },
this.$emit('update', 'hour', this.cycleTotal); // 周期两个值变化时
} cycleChange() {
}, if (this.radioValue == '2') {
// 平均两个值变化时 this.$emit('update', 'hour', this.cycleTotal);
averageChange() { }
if (this.radioValue == '3') { },
this.$emit('update', 'hour', this.averageTotal); // 平均两个值变化时
} averageChange() {
}, if (this.radioValue == '3') {
// checkbox值变化时 this.$emit('update', 'hour', this.averageTotal);
checkboxChange() { }
if (this.radioValue == '4') { },
this.$emit('update', 'hour', this.checkboxString); // checkbox值变化时
} checkboxChange() {
} if (this.radioValue == '4') {
}, this.$emit('update', 'hour', this.checkboxString);
watch: { }
"radioValue": "radioChange", }
'cycleTotal': 'cycleChange', },
'averageTotal': 'averageChange', watch: {
'checkboxString': 'checkboxChange' "radioValue": "radioChange",
}, 'cycleTotal': 'cycleChange',
computed: { 'averageTotal': 'averageChange',
// 计算两个周期值 'checkboxString': 'checkboxChange'
cycleTotal: function () { },
this.cycle01 = this.checkNum(this.cycle01, 0, 23) computed: {
this.cycle02 = this.checkNum(this.cycle02, 0, 23) // 计算两个周期值
return this.cycle01 + '-' + this.cycle02; cycleTotal: function () {
}, this.cycle01 = this.checkNum(this.cycle01, 0, 23)
// 计算平均用到的值 this.cycle02 = this.checkNum(this.cycle02, 0, 23)
averageTotal: function () { return this.cycle01 + '-' + this.cycle02;
this.average01 = this.checkNum(this.average01, 0, 23) },
this.average02 = this.checkNum(this.average02, 1, 23) // 计算平均用到的值
return this.average01 + '/' + this.average02; averageTotal: function () {
}, this.average01 = this.checkNum(this.average01, 0, 23)
// 计算勾选的checkbox值合集 this.average02 = this.checkNum(this.average02, 1, 23)
checkboxString: function () { return this.average01 + '/' + this.average02;
let str = this.checkboxList.join(); },
return str == '' ? '*' : str; // 计算勾选的checkbox值合集
} checkboxString: function () {
} let str = this.checkboxList.join();
} return str == '' ? '*' : str;
</script> }
}
}
</script>

771
ruoyi-ui/src/components/Crontab/index.vue
View File

@ -1,110 +1,110 @@
<template> <template>
<div> <div>
<el-tabs type="border-card"> <el-tabs type="border-card">
<el-tab-pane label="秒" v-if="shouldHide('second')"> <el-tab-pane label="秒" v-if="shouldHide('second')">
<CrontabSecond @update="updateCrontabValue" :check="checkNumber" ref="cronsecond" /> <CrontabSecond @update="updateCrontabValue" :check="checkNumber" ref="cronsecond"/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="分钟" v-if="shouldHide('min')"> <el-tab-pane label="分钟" v-if="shouldHide('min')">
<CrontabMin <CrontabMin
@update="updateCrontabValue" @update="updateCrontabValue"
:check="checkNumber" :check="checkNumber"
:cron="crontabValueObj" :cron="crontabValueObj"
ref="cronmin" ref="cronmin"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="小时" v-if="shouldHide('hour')"> <el-tab-pane label="小时" v-if="shouldHide('hour')">
<CrontabHour <CrontabHour
@update="updateCrontabValue" @update="updateCrontabValue"
:check="checkNumber" :check="checkNumber"
:cron="crontabValueObj" :cron="crontabValueObj"
ref="cronhour" ref="cronhour"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="日" v-if="shouldHide('day')"> <el-tab-pane label="日" v-if="shouldHide('day')">
<CrontabDay <CrontabDay
@update="updateCrontabValue" @update="updateCrontabValue"
:check="checkNumber" :check="checkNumber"
:cron="crontabValueObj" :cron="crontabValueObj"
ref="cronday" ref="cronday"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="月" v-if="shouldHide('month')"> <el-tab-pane label="月" v-if="shouldHide('month')">
<CrontabMonth <CrontabMonth
@update="updateCrontabValue" @update="updateCrontabValue"
:check="checkNumber" :check="checkNumber"
:cron="crontabValueObj" :cron="crontabValueObj"
ref="cronmonth" ref="cronmonth"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="周" v-if="shouldHide('week')"> <el-tab-pane label="周" v-if="shouldHide('week')">
<CrontabWeek <CrontabWeek
@update="updateCrontabValue" @update="updateCrontabValue"
:check="checkNumber" :check="checkNumber"
:cron="crontabValueObj" :cron="crontabValueObj"
ref="cronweek" ref="cronweek"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="年" v-if="shouldHide('year')"> <el-tab-pane label="年" v-if="shouldHide('year')">
<CrontabYear <CrontabYear
@update="updateCrontabValue" @update="updateCrontabValue"
:check="checkNumber" :check="checkNumber"
:cron="crontabValueObj" :cron="crontabValueObj"
ref="cronyear" ref="cronyear"
/> />
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
<div class="popup-main"> <div class="popup-main">
<div class="popup-result"> <div class="popup-result">
<p class="title">时间表达式</p> <p class="title">时间表达式</p>
<table> <table>
<thead> <thead>
<th v-for="item of tabTitles" width="40" :key="item">{{item}}</th> <th v-for="item of tabTitles" width="40" :key="item">{{ item }}</th>
<th>Cron 表达式</th> <th>Cron 表达式</th>
</thead> </thead>
<tbody> <tbody>
<td> <td>
<span>{{crontabValueObj.second}}</span> <span>{{ crontabValueObj.second }}</span>
</td> </td>
<td> <td>
<span>{{crontabValueObj.min}}</span> <span>{{ crontabValueObj.min }}</span>
</td> </td>
<td> <td>
<span>{{crontabValueObj.hour}}</span> <span>{{ crontabValueObj.hour }}</span>
</td> </td>
<td> <td>
<span>{{crontabValueObj.day}}</span> <span>{{ crontabValueObj.day }}</span>
</td> </td>
<td> <td>
<span>{{crontabValueObj.month}}</span> <span>{{ crontabValueObj.month }}</span>
</td> </td>
<td> <td>
<span>{{crontabValueObj.week}}</span> <span>{{ crontabValueObj.week }}</span>
</td> </td>
<td> <td>
<span>{{crontabValueObj.year}}</span> <span>{{ crontabValueObj.year }}</span>
</td> </td>
<td> <td>
<span>{{crontabValueString}}</span> <span>{{ crontabValueString }}</span>
</td> </td>
</tbody> </tbody>
</table> </table>
</div> </div>
<CrontabResult :ex="crontabValueString"></CrontabResult> <CrontabResult :ex="crontabValueString"></CrontabResult>
<div class="pop_btn"> <div class="pop_btn">
<el-button size="small" type="primary" @click="submitFill">确定</el-button> <el-button size="small" type="primary" @click="submitFill">确定</el-button>
<el-button size="small" type="warning" @click="clearCron">重置</el-button> <el-button size="small" type="warning" @click="clearCron">重置</el-button>
<el-button size="small" @click="hidePopup">取消</el-button> <el-button size="small" @click="hidePopup">取消</el-button>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
@ -118,308 +118,315 @@ import CrontabYear from "./year.vue";
import CrontabResult from "./result.vue"; import CrontabResult from "./result.vue";
export default { export default {
data() { data() {
return { return {
tabTitles: ["秒", "分钟", "小时", "日", "月", "周", "年"], tabTitles: ["秒", "分钟", "小时", "日", "月", "周", "年"],
tabActive: 0, tabActive: 0,
myindex: 0, myindex: 0,
crontabValueObj: { crontabValueObj: {
second: "*", second: "*",
min: "*", min: "*",
hour: "*", hour: "*",
day: "*", day: "*",
month: "*", month: "*",
week: "?", week: "?",
year: "", year: "",
}, },
}; };
}, },
name: "vcrontab", name: "vcrontab",
props: ["expression", "hideComponent"], props: ["expression", "hideComponent"],
methods: { methods: {
shouldHide(key) { shouldHide(key) {
if (this.hideComponent && this.hideComponent.includes(key)) return false; if (this.hideComponent && this.hideComponent.includes(key)) return false;
return true; return true;
}, },
resolveExp() { resolveExp() {
// 反解析 表达式 // 反解析 表达式
if (this.expression) { if (this.expression) {
let arr = this.expression.split(" "); let arr = this.expression.split(" ");
if (arr.length >= 6) { if (arr.length >= 6) {
//6 位以上是合法表达式 //6 位以上是合法表达式
let obj = { let obj = {
second: arr[0], second: arr[0],
min: arr[1], min: arr[1],
hour: arr[2], hour: arr[2],
day: arr[3], day: arr[3],
month: arr[4], month: arr[4],
week: arr[5], week: arr[5],
year: arr[6] ? arr[6] : "", year: arr[6] ? arr[6] : "",
}; };
this.crontabValueObj = { this.crontabValueObj = {
...obj, ...obj,
}; };
for (let i in obj) { for (let i in obj) {
if (obj[i]) this.changeRadio(i, obj[i]); if (obj[i]) this.changeRadio(i, obj[i]);
} }
} }
} else { } else {
// 没有传入的表达式 则还原 // 没有传入的表达式 则还原
this.clearCron(); this.clearCron();
} }
}, },
// tab切换值 // tab切换值
tabCheck(index) { tabCheck(index) {
this.tabActive = index; this.tabActive = index;
}, },
// 由子组件触发，更改表达式组成的字段值 // 由子组件触发，更改表达式组成的字段值
updateCrontabValue(name, value, from) { updateCrontabValue(name, value, from) {
"updateCrontabValue", name, value, from; "updateCrontabValue", name, value, from;
this.crontabValueObj[name] = value; this.crontabValueObj[name] = value;
if (from && from !== name) { if (from && from !== name) {
console.log(`来自组件 ${from} 改变了 ${name} ${value}`); console.log(`来自组件 ${from} 改变了 ${name} ${value}`);
this.changeRadio(name, value); this.changeRadio(name, value);
} }
}, },
// 赋值到组件 // 赋值到组件
changeRadio(name, value) { changeRadio(name, value) {
let arr = ["second", "min", "hour", "month"], let arr = ["second", "min", "hour", "month"],
refName = "cron" + name, refName = "cron" + name,
insValue; insValue;
if (!this.$refs[refName]) return; if (!this.$refs[refName]) return;
this.$refs[refName].init()
if (arr.includes(name)) { if (arr.includes(name)) {
if (value === "*") { if (value === "*") {
insValue = 1; insValue = 1;
} else if (value.indexOf("-") > -1) { } else if (value.indexOf("-") > -1) {
let indexArr = value.split("-"); let indexArr = value.split("-");
isNaN(indexArr[0]) isNaN(indexArr[0])
? (this.$refs[refName].cycle01 = 0) ? (this.$refs[refName].cycle01 = 0)
: (this.$refs[refName].cycle01 = indexArr[0]); : (this.$refs[refName].cycle01 = indexArr[0]);
this.$refs[refName].cycle02 = indexArr[1]; this.$refs[refName].cycle02 = indexArr[1];
insValue = 2; insValue = 2;
} else if (value.indexOf("/") > -1) { } else if (value.indexOf("/") > -1) {
let indexArr = value.split("/"); let indexArr = value.split("/");
isNaN(indexArr[0]) isNaN(indexArr[0])
? (this.$refs[refName].average01 = 0) ? (this.$refs[refName].average01 = 0)
: (this.$refs[refName].average01 = indexArr[0]); : (this.$refs[refName].average01 = indexArr[0]);
this.$refs[refName].average02 = indexArr[1]; this.$refs[refName].average02 = indexArr[1];
insValue = 3; insValue = 3;
} else { } else {
insValue = 4; insValue = 4;
this.$refs[refName].checkboxList = value.split(","); this.$refs[refName].checkboxList = value.split(",");
} }
} else if (name == "day") { } else if (name == "day") {
if (value === "*") { if (value === "*") {
insValue = 1; insValue = 1;
} else if (value == "?") { } else if (value == "?") {
insValue = 2; insValue = 2;
} else if (value.indexOf("-") > -1) { } else if (value.indexOf("-") > -1) {
let indexArr = value.split("-"); let indexArr = value.split("-");
isNaN(indexArr[0]) isNaN(indexArr[0])
? (this.$refs[refName].cycle01 = 0) ? (this.$refs[refName].cycle01 = 0)
: (this.$refs[refName].cycle01 = indexArr[0]); : (this.$refs[refName].cycle01 = indexArr[0]);
this.$refs[refName].cycle02 = indexArr[1]; this.$refs[refName].cycle02 = indexArr[1];
insValue = 3; insValue = 3;
} else if (value.indexOf("/") > -1) { } else if (value.indexOf("/") > -1) {
let indexArr = value.split("/"); let indexArr = value.split("/");
isNaN(indexArr[0]) isNaN(indexArr[0])
? (this.$refs[refName].average01 = 0) ? (this.$refs[refName].average01 = 0)
: (this.$refs[refName].average01 = indexArr[0]); : (this.$refs[refName].average01 = indexArr[0]);
this.$refs[refName].average02 = indexArr[1]; this.$refs[refName].average02 = indexArr[1];
insValue = 4; insValue = 4;
} else if (value.indexOf("W") > -1) { } else if (value.indexOf("W") > -1) {
let indexArr = value.split("W"); let indexArr = value.split("W");
isNaN(indexArr[0]) isNaN(indexArr[0])
? (this.$refs[refName].workday = 0) ? (this.$refs[refName].workday = 0)
: (this.$refs[refName].workday = indexArr[0]); : (this.$refs[refName].workday = indexArr[0]);
insValue = 5; insValue = 5;
} else if (value === "L") { } else if (value === "L") {
insValue = 6; insValue = 6;
} else { } else {
this.$refs[refName].checkboxList = value.split(","); this.$refs[refName].checkboxList = value.split(",");
insValue = 7; insValue = 7;
} }
} else if (name == "week") { } else if (name == "week") {
if (value === "*") { if (value === "*") {
insValue = 1; insValue = 1;
} else if (value == "?") { } else if (value == "?") {
insValue = 2; insValue = 2;
} else if (value.indexOf("-") > -1) { } else if (value.indexOf("-") > -1) {
let indexArr = value.split("-"); let indexArr = value.split("-");
isNaN(indexArr[0]) isNaN(indexArr[0])
? (this.$refs[refName].cycle01 = 0) ? (this.$refs[refName].cycle01 = 0)
: (this.$refs[refName].cycle01 = indexArr[0]); : (this.$refs[refName].cycle01 = indexArr[0]);
this.$refs[refName].cycle02 = indexArr[1]; this.$refs[refName].cycle02 = indexArr[1];
insValue = 3; insValue = 3;
} else if (value.indexOf("#") > -1) { } else if (value.indexOf("#") > -1) {
let indexArr = value.split("#"); let indexArr = value.split("#");
isNaN(indexArr[0]) isNaN(indexArr[0])
? (this.$refs[refName].average01 = 1) ? (this.$refs[refName].average01 = 1)
: (this.$refs[refName].average01 = indexArr[0]); : (this.$refs[refName].average01 = indexArr[0]);
this.$refs[refName].average02 = indexArr[1]; this.$refs[refName].average02 = indexArr[1];
insValue = 4; insValue = 4;
} else if (value.indexOf("L") > -1) { } else if (value.indexOf("L") > -1) {
let indexArr = value.split("L"); let indexArr = value.split("L");
isNaN(indexArr[0]) isNaN(indexArr[0])
? (this.$refs[refName].weekday = 1) ? (this.$refs[refName].weekday = 1)
: (this.$refs[refName].weekday = indexArr[0]); : (this.$refs[refName].weekday = indexArr[0]);
insValue = 5; insValue = 5;
} else { } else {
this.$refs[refName].checkboxList = value.split(","); this.$refs[refName].checkboxList = value.split(",");
insValue = 7; insValue = 7;
} }
} else if (name == "year") { } else if (name == "year") {
if (value == "") { if (value == "") {
insValue = 1; insValue = 1;
} else if (value == "*") { } else if (value == "*") {
insValue = 2; insValue = 2;
} else if (value.indexOf("-") > -1) { } else if (value.indexOf("-") > -1) {
insValue = 3; insValue = 3;
} else if (value.indexOf("/") > -1) { } else if (value.indexOf("/") > -1) {
insValue = 4; insValue = 4;
} else { } else {
this.$refs[refName].checkboxList = value.split(","); this.$refs[refName].checkboxList = value.split(",");
insValue = 5; insValue = 5;
} }
} }
this.$refs[refName].radioValue = insValue; this.$refs[refName].radioValue = insValue;
}, },
// 表单选项的子组件校验数字格式（通过-props传递） // 表单选项的子组件校验数字格式（通过-props传递）
checkNumber(value, minLimit, maxLimit) { checkNumber(value, minLimit, maxLimit) {
// 检查必须为整数 // 检查必须为整数
value = Math.floor(value); value = Math.floor(value);
if (value < minLimit) { if (value < minLimit) {
value = minLimit; value = minLimit;
} else if (value > maxLimit) { } else if (value > maxLimit) {
value = maxLimit; value = maxLimit;
} }
return value; return value;
}, },
// 隐藏弹窗 // 隐藏弹窗
hidePopup() { hidePopup() {
this.$emit("hide"); this.$emit("hide");
}, },
// 填充表达式 // 填充表达式
submitFill() { submitFill() {
this.$emit("fill", this.crontabValueString); this.$emit("fill", this.crontabValueString);
this.hidePopup(); this.hidePopup();
}, },
clearCron() { clearCron() {
// 还原选择项 // 还原选择项
("准备还原"); ("准备还原");
this.crontabValueObj = { this.crontabValueObj = {
second: "*", second: "*",
min: "*", min: "*",
hour: "*", hour: "*",
day: "*", day: "*",
month: "*", month: "*",
week: "?", week: "?",
year: "", year: "",
}; };
for (let j in this.crontabValueObj) { for (let j in this.crontabValueObj) {
this.changeRadio(j, this.crontabValueObj[j]); this.changeRadio(j, this.crontabValueObj[j]);
} }
}, },
}, },
computed: { computed: {
crontabValueString: function() { crontabValueString: function () {
let obj = this.crontabValueObj; let obj = this.crontabValueObj;
let str = let str =
obj.second + obj.second +
" " + " " +
obj.min + obj.min +
" " + " " +
obj.hour + obj.hour +
" " + " " +
obj.day + obj.day +
" " + " " +
obj.month + obj.month +
" " + " " +
obj.week + obj.week +
(obj.year == "" ? "" : " " + obj.year); (obj.year == "" ? "" : " " + obj.year);
return str; return str;
}, },
}, },
components: { components: {
CrontabSecond, CrontabSecond,
CrontabMin, CrontabMin,
CrontabHour, CrontabHour,
CrontabDay, CrontabDay,
CrontabMonth, CrontabMonth,
CrontabWeek, CrontabWeek,
CrontabYear, CrontabYear,
CrontabResult, CrontabResult,
}, },
watch: { watch: {
expression: "resolveExp", expression: "resolveExp",
hideComponent(value) { hideComponent(value) {
// 隐藏部分组件 // 隐藏部分组件
}, },
}, },
mounted: function() { mounted: function () {
this.resolveExp(); this.resolveExp();
}, },
}; };
</script> </script>
<style scoped> <style scoped>
.pop_btn { .pop_btn {
text-align: center; text-align: center;
margin-top: 20px; margin-top: 20px;
} }
.popup-main { .popup-main {
position: relative; position: relative;
margin: 10px auto; margin: 10px auto;
background: #fff; background: #fff;
border-radius: 5px; border-radius: 5px;
font-size: 12px; font-size: 12px;
overflow: hidden; overflow: hidden;
} }
.popup-title { .popup-title {
overflow: hidden; overflow: hidden;
line-height: 34px; line-height: 34px;
padding-top: 6px; padding-top: 6px;
background: #f2f2f2; background: #f2f2f2;
} }
.popup-result { .popup-result {
box-sizing: border-box; box-sizing: border-box;
line-height: 24px; line-height: 24px;
margin: 25px auto; margin: 25px auto;
padding: 15px 10px 10px; padding: 15px 10px 10px;
border: 1px solid #ccc; border: 1px solid #ccc;
position: relative; position: relative;
} }
.popup-result .title { .popup-result .title {
position: absolute; position: absolute;
top: -28px; top: -28px;
left: 50%; left: 50%;
width: 140px; width: 140px;
font-size: 14px; font-size: 14px;
margin-left: -70px; margin-left: -70px;
text-align: center; text-align: center;
line-height: 30px; line-height: 30px;
background: #fff; background: #fff;
} }
.popup-result table { .popup-result table {
text-align: center; text-align: center;
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
} }
.popup-result table span { .popup-result table span {
display: block; display: block;
width: 100%; width: 100%;
font-family: arial; font-family: arial;
line-height: 30px; line-height: 30px;
height: 30px; height: 30px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
border: 1px solid #e8e8e8; border: 1px solid #e8e8e8;
} }
.popup-result-scroll { .popup-result-scroll {
font-size: 12px; font-size: 12px;
line-height: 24px; line-height: 24px;
height: 10em; height: 10em;
overflow-y: auto; overflow-y: auto;
} }
</style> </style>

244
ruoyi-ui/src/components/Crontab/min.vue
View File

@ -1,120 +1,124 @@
<template> <template>
<el-form size="small"> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model='radioValue' :label="1">
分钟，允许的通配符[, - * /] 分钟，允许的通配符[, - * /]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model='radioValue' :label="2">
周期从 周期从
<el-input-number v-model='cycle01' :min="0" :max="60" /> - <el-input-number v-model='cycle01' :min="0" :max="60" /> -
<el-input-number v-model='cycle02' :min="0" :max="60" /> 分钟 <el-input-number v-model='cycle02' :min="0" :max="60" /> 分钟
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model='radioValue' :label="3">
从 从
<el-input-number v-model='average01' :min="0" :max="60" /> 分钟开始，每 <el-input-number v-model='average01' :min="0" :max="60" /> 分钟开始，每
<el-input-number v-model='average02' :min="0" :max="60" /> 分钟执行一次 <el-input-number v-model='average02' :min="0" :max="60" /> 分钟执行一次
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model='radioValue' :label="4">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%">
<el-option v-for="item in 60" :key="item" :value="item-1">{{item-1}}</el-option> <el-option v-for="item in 60" :key="item" :value="item-1">{{item-1}}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
radioValue: 1, radioValue: 1,
cycle01: 1, cycle01: 1,
cycle02: 2, cycle02: 2,
average01: 0, average01: 0,
average02: 1, average02: 1,
checkboxList: [], checkboxList: [],
checkNum: this.$options.propsData.check checkNum: this.$options.propsData.check
} }
}, },
name: 'crontab-min', name: 'crontab-min',
props: ['check', 'cron'], props: ['check', 'cron'],
methods: { methods: {
// 单选按钮值变化时 init() {
radioChange() { this.cycle01 = 1
if (this.radioValue !== 1 && this.cron.second === '*') { this.cycle02 = 2
this.$emit('update', 'second', '0', 'min'); this.average01 = 0
} this.average02 = 1
switch (this.radioValue) { this.checkboxList = []
case 1: },
this.$emit('update', 'min', '*', 'min'); // 单选按钮值变化时
this.$emit('update', 'hour', '*', 'min'); radioChange() {
break; switch (this.radioValue) {
case 2: case 1:
this.$emit('update', 'min', this.cycle01 + '-' + this.cycle02, 'min'); this.$emit('update', 'min', '*', 'min');
break; this.$emit('update', 'hour', '*', 'min');
case 3: break;
this.$emit('update', 'min', this.average01 + '/' + this.average02, 'min'); case 2:
break; this.$emit('update', 'min', this.cycle01 + '-' + this.cycle02, 'min');
case 4: break;
this.$emit('update', 'min', this.checkboxString, 'min'); case 3:
break; this.$emit('update', 'min', this.average01 + '/' + this.average02, 'min');
} break;
}, case 4:
// 周期两个值变化时 this.$emit('update', 'min', this.checkboxString, 'min');
cycleChange() { break;
if (this.radioValue == '2') { }
this.$emit('update', 'min', this.cycleTotal, 'min'); },
} // 周期两个值变化时
}, cycleChange() {
// 平均两个值变化时 if (this.radioValue == '2') {
averageChange() { this.$emit('update', 'min', this.cycleTotal, 'min');
if (this.radioValue == '3') { }
this.$emit('update', 'min', this.averageTotal, 'min'); },
} // 平均两个值变化时
}, averageChange() {
// checkbox值变化时 if (this.radioValue == '3') {
checkboxChange() { this.$emit('update', 'min', this.averageTotal, 'min');
if (this.radioValue == '4') { }
this.$emit('update', 'min', this.checkboxString, 'min'); },
} // checkbox值变化时
}, checkboxChange() {
if (this.radioValue == '4') {
}, this.$emit('update', 'min', this.checkboxString, 'min');
watch: { }
"radioValue": "radioChange", },
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange', },
'checkboxString': 'checkboxChange', watch: {
}, "radioValue": "radioChange",
computed: { 'cycleTotal': 'cycleChange',
// 计算两个周期值 'averageTotal': 'averageChange',
cycleTotal: function () { 'checkboxString': 'checkboxChange',
this.cycle01 = this.checkNum(this.cycle01, 0, 59) },
this.cycle02 = this.checkNum(this.cycle02, 0, 59) computed: {
return this.cycle01 + '-' + this.cycle02; // 计算两个周期值
}, cycleTotal: function () {
// 计算平均用到的值 this.cycle01 = this.checkNum(this.cycle01, 0, 59)
averageTotal: function () { this.cycle02 = this.checkNum(this.cycle02, 0, 59)
this.average01 = this.checkNum(this.average01, 0, 59) return this.cycle01 + '-' + this.cycle02;
this.average02 = this.checkNum(this.average02, 1, 59) },
return this.average01 + '/' + this.average02; // 计算平均用到的值
}, averageTotal: function () {
// 计算勾选的checkbox值合集 this.average01 = this.checkNum(this.average01, 0, 59)
checkboxString: function () { this.average02 = this.checkNum(this.average02, 1, 59)
let str = this.checkboxList.join(); return this.average01 + '/' + this.average02;
return str == '' ? '*' : str; },
} // 计算勾选的checkbox值合集
} checkboxString: function () {
} let str = this.checkboxList.join();
</script> return str == '' ? '*' : str;
}
}
}
</script>

21
ruoyi-ui/src/components/Crontab/month.vue
View File

@ -49,24 +49,17 @@ export default {
name: 'crontab-month', name: 'crontab-month',
props: ['check', 'cron'], props: ['check', 'cron'],
methods: { methods: {
init() {
this.cycle01 = 1
this.cycle02 = 2
this.average01 = 1
this.average02 = 1
this.checkboxList = []
},
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
if (this.radioValue === 1) { if (this.radioValue === 1) {
this.$emit('update', 'month', '*'); this.$emit('update', 'month', '*');
this.$emit('update', 'year', '*');
} else {
if (this.cron.day === '*') {
this.$emit('update', 'day', '0', 'month');
}
if (this.cron.hour === '*') {
this.$emit('update', 'hour', '0', 'month');
}
if (this.cron.min === '*') {
this.$emit('update', 'min', '0', 'month');
}
if (this.cron.second === '*') {
this.$emit('update', 'second', '0', 'month');
}
} }
switch (this.radioValue) { switch (this.radioValue) {
case 2: case 2:

10
ruoyi-ui/src/components/Crontab/second.vue
View File

@ -25,7 +25,7 @@
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model='radioValue' :label="4">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%" @change="ch">
<el-option v-for="item in 60" :key="item" :value="item-1">{{item-1}}</el-option> <el-option v-for="item in 60" :key="item" :value="item-1">{{item-1}}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
@ -49,12 +49,18 @@ export default {
name: 'crontab-second', name: 'crontab-second',
props: ['check', 'radioParent'], props: ['check', 'radioParent'],
methods: { methods: {
init() {
this.cycle01 = 1
this.cycle02 = 2
this.average01 = 0
this.average02 = 1
this.checkboxList = []
},
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
switch (this.radioValue) { switch (this.radioValue) {
case 1: case 1:
this.$emit('update', 'second', '*', 'second'); this.$emit('update', 'second', '*', 'second');
this.$emit('update', 'min', '*', 'second');
break; break;
case 2: case 2:
this.$emit('update', 'second', this.cycle01 + '-' + this.cycle02); this.$emit('update', 'second', this.cycle01 + '-' + this.cycle02);

317
ruoyi-ui/src/components/Crontab/week.vue
View File

@ -1,167 +1,178 @@
<template> <template>
<el-form size='small'> <el-form size='small'>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model='radioValue' :label="1">
周，允许的通配符[, - * / L #] 周，允许的通配符[, - * / L #]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model='radioValue' :label="2">
不指定 不指定
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model='radioValue' :label="3">
周期从星期 周期从星期
<el-input-number v-model='cycle01' :min="1" :max="7" /> - <el-input-number v-model='cycle01' :min="1" :max="7"/>
<el-input-number v-model='cycle02' :min="1" :max="7" /> -
</el-radio> <el-input-number v-model='cycle02' :min="1" :max="7"/>
</el-form-item> </el-radio>
</el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model='radioValue' :label="4">
第 第
<el-input-number v-model='average01' :min="1" :max="4" /> 周的星期 <el-input-number v-model='average01' :min="1" :max="4"/>
<el-input-number v-model='average02' :min="1" :max="7" /> 周的星期
</el-radio> <el-input-number v-model='average02' :min="1" :max="7"/>
</el-form-item> </el-radio>
</el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="5"> <el-radio v-model='radioValue' :label="5">
本月最后一个星期 本月最后一个星期
<el-input-number v-model='weekday' :min="1" :max="7" /> <el-input-number v-model='weekday' :min="1" :max="7"/>
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="6"> <el-radio v-model='radioValue' :label="6">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select clearable v-model="checkboxDescribeList" placeholder="可多选" multiple style="width:100%">
<el-option v-for="(item,index) of weekList" :key="index" :value="index+1">{{item}}</el-option> <el-option v-for="(item,index) of weekList" :key="index" :value="index+1">{{ item }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
radioValue: 2, radioValue: 2,
weekday: 1, weekday: 1,
cycle01: 1, cycle01: 1,
cycle02: 2, cycle02: 2,
average01: 1, average01: 1,
average02: 1, average02: 1,
checkboxList: [], checkboxList: [],
weekList: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'], checkboxDescribeList: [],
checkNum: this.$options.propsData.check weekList: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
} checkNum: this.$options.propsData.check
}, }
name: 'crontab-week', },
props: ['check', 'cron'], name: 'crontab-week',
methods: { props: ['check', 'cron'],
// 单选按钮值变化时 methods: {
radioChange() { checkChange(data) {
if (this.radioValue === 1) { this.checkboxList = []
this.$emit('update', 'week', '*'); data.forEach(value => {
this.$emit('update', 'year', '*'); this.weekList.find((item, index) => {
} else { if (item === value) {
if (this.cron.month === '*') { this.checkboxList.push(index + 1)
this.$emit('update', 'month', '0', 'week'); }
} })
if (this.cron.day === '*') { })
this.$emit('update', 'day', '0', 'week'); },
} init() {
if (this.cron.hour === '*') { this.workday = 1
this.$emit('update', 'hour', '0', 'week'); this.cycle01 = 1
} this.cycle02 = 2
if (this.cron.min === '*') { this.average01 = 1
this.$emit('update', 'min', '0', 'week'); this.average02 = 1
} this.checkboxList = []
if (this.cron.second === '*') { this.checkboxDescribeList = []
this.$emit('update', 'second', '0', 'week'); },
} // 单选按钮值变化时
} radioChange() {
switch (this.radioValue) {
case 2:
this.$emit('update', 'week', '?');
break;
case 3:
this.$emit('update', 'week', this.cycle01 + '-' + this.cycle02);
break;
case 4:
this.$emit('update', 'week', this.average01 + '#' + this.average02);
break;
case 5:
this.$emit('update', 'week', this.weekday + 'L');
break;
case 6:
this.$emit('update', 'week', this.checkboxString);
break;
}
},
// 根据互斥事件，更改radio的值
// 周期两个值变化时
cycleChange() { switch (this.radioValue) {
if (this.radioValue == '3') { case 1:
this.$emit('update', 'week', this.cycleTotal); this.$emit('update', 'week', '*');
} break;
}, case 3:
// 平均两个值变化时 this.$emit('update', 'week', this.cycle01 + '-' + this.cycle02);
averageChange() { break;
if (this.radioValue == '4') { case 4:
this.$emit('update', 'week', this.averageTotal); this.$emit('update', 'week', this.average01 + '#' + this.average02);
} break;
}, case 5:
// 最近工作日值变化时 this.$emit('update', 'week', this.weekday + 'L');
weekdayChange() { break;
if (this.radioValue == '5') { case 6:
this.$emit('update', 'week', this.weekday + 'L'); this.$emit('update', 'week', this.checkboxString);
} break;
}, }
// checkbox值变化时 if (this.radioValue === 2) {
checkboxChange() { this.$emit('update', 'week', '?');
if (this.radioValue == '6') { this.$emit('update', 'day', '*');
this.$emit('update', 'week', this.checkboxString); } else {
} this.$emit('update', 'day', '?');
},
}, }
watch: { },
"radioValue": "radioChange", // 根据互斥事件，更改radio的值
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange', // 周期两个值变化时
'weekdayCheck': 'weekdayChange', cycleChange() {
'checkboxString': 'checkboxChange', if (this.radioValue == '3') {
}, this.$emit('update', 'week', this.cycleTotal);
computed: { }
// 计算两个周期值 },
cycleTotal: function () { // 平均两个值变化时
this.cycle01 = this.checkNum(this.cycle01, 1, 7) averageChange() {
this.cycle02 = this.checkNum(this.cycle02, 1, 7) if (this.radioValue == '4') {
return this.cycle01 + '-' + this.cycle02; this.$emit('update', 'week', this.averageTotal);
}, }
// 计算平均用到的值 },
averageTotal: function () { // 最近工作日值变化时
this.average01 = this.checkNum(this.average01, 1, 4) weekdayChange() {
this.average02 = this.checkNum(this.average02, 1, 7) if (this.radioValue == '5') {
return this.average01 + '#' + this.average02; this.$emit('update', 'week', this.weekday + 'L');
}, }
// 最近的工作日（格式） },
weekdayCheck: function () { // checkbox值变化时
this.weekday = this.checkNum(this.weekday, 1, 7) checkboxChange() {
return this.weekday; if (this.radioValue == '6') {
}, this.$emit('update', 'week', this.checkboxString);
// 计算勾选的checkbox值合集 }
checkboxString: function () { },
let str = this.checkboxList.join(); },
return str == '' ? '*' : str; watch: {
} "radioValue": "radioChange",
} 'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange',
'weekdayCheck': 'weekdayChange',
'checkboxString': 'checkboxChange',
},
computed: {
// 计算两个周期值
cycleTotal: function () {
this.cycle01 = this.checkNum(this.cycle01, 1, 7)
this.cycle02 = this.checkNum(this.cycle02, 1, 7)
return this.cycle01 + '-' + this.cycle02;
},
// 计算平均用到的值
averageTotal: function () {
this.average01 = this.checkNum(this.average01, 1, 4)
this.average02 = this.checkNum(this.average02, 1, 7)
return this.average01 + '#' + this.average02;
},
// 最近的工作日（格式）
weekdayCheck: function () {
this.weekday = this.checkNum(this.weekday, 1, 7)
return this.weekday;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
let str = this.checkboxList.join();
return str == '' ? '*' : str;
}
}
} }
</script> </script>

23
ruoyi-ui/src/components/Crontab/year.vue
View File

@ -57,23 +57,16 @@ export default {
name: 'crontab-year', name: 'crontab-year',
props: ['check', 'month', 'cron'], props: ['check', 'month', 'cron'],
methods: { methods: {
init() {
this.fullYear = Number(new Date().getFullYear())
this.cycle01 = 0
this.cycle02 = 0
this.average01 = 0
this.average02 = 1
this.checkboxList = []
},
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
if (this.cron.month === '*') {
this.$emit('update', 'month', '0', 'year');
}
if (this.cron.day === '*') {
this.$emit('update', 'day', '0', 'year');
}
if (this.cron.hour === '*') {
this.$emit('update', 'hour', '0', 'year');
}
if (this.cron.min === '*') {
this.$emit('update', 'min', '0', 'year');
}
if (this.cron.second === '*') {
this.$emit('update', 'second', '0', 'year');
}
switch (this.radioValue) { switch (this.radioValue) {
case 1: case 1:
this.$emit('update', 'year', ''); this.$emit('update', 'year', '');