| | |
| | | <template> |
| | | <div> |
| | | <b style="padding-right:30px;">定时重启:</b> |
| | | <el-select v-model="every" placeholder="请选择" size="small" @change="changeEvery"> |
| | | <b style="padding-right: 30px">定时重启:</b> |
| | | <el-select |
| | | v-model="every" |
| | | placeholder="请选择" |
| | | size="small" |
| | | @change="changeEvery" |
| | | > |
| | | <el-option label="关闭" value="never"></el-option> |
| | | <el-option label="每天" value="day"></el-option> |
| | | <el-option label="每周" value="week"></el-option> |
| | |
| | | style="margin-left: 20px" |
| | | @change="updateExpression" |
| | | > |
| | | <el-option v-for="item in days" :key="item.value" :label="item.label" :value="item.value"></el-option> |
| | | <el-option |
| | | v-for="item in days" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | ></el-option> |
| | | </el-select> |
| | | |
| | | <el-select |
| | |
| | | <el-time-picker |
| | | v-show="every !== 'never'" |
| | | v-model="time" |
| | | :picker-options="{selectableRange: '00:00:00 - 23:59:59'}" |
| | | :picker-options="{ selectableRange: '00:00:00 - 23:59:59' }" |
| | | value-format="HH:mm" |
| | | format="HH:mm" |
| | | placeholder="任意时间点" |
| | |
| | | size="small" |
| | | style="margin-left: 20px" |
| | | @click="save" |
| | | >保存</el-button> |
| | | >保存</el-button |
| | | > |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | props: ["expression"], |
| | | computed: { |
| | | days: () => { |
| | | let arr = [] |
| | | let arr = []; |
| | | for (let i = 1; i < 32; i++) { |
| | | arr.push({ |
| | | label: i + "日", |
| | | value: i + "" |
| | | }) |
| | | value: i + "", |
| | | }); |
| | | } |
| | | |
| | | return arr |
| | | } |
| | | return arr; |
| | | }, |
| | | }, |
| | | watch: { |
| | | expression: function () { |
| | | this.resolveExp() |
| | | } |
| | | this.resolveExp(); |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | |
| | | hour: "*", |
| | | day: "*", |
| | | month: "*", |
| | | week: "*" |
| | | week: "*", |
| | | }, |
| | | cronText: "" |
| | | } |
| | | cronText: "", |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.resolveExp() |
| | | this.resolveExp(); |
| | | }, |
| | | methods: { |
| | | resolveExp() { |
| | |
| | | let arr = this.expression.split(" "); |
| | | if (arr.length >= 5) { |
| | | //6 位以上是合法表达式 |
| | | this.cronValueObj.min = arr[0] |
| | | this.cronValueObj.hour = arr[1] |
| | | this.cronValueObj.day = arr[2] |
| | | this.cronValueObj.min = arr[0]; |
| | | this.cronValueObj.hour = arr[1]; |
| | | this.cronValueObj.day = arr[2]; |
| | | // this.cronValueObj.month = arr[3], |
| | | this.cronValueObj.month = "*" |
| | | this.cronValueObj.week = arr[4] |
| | | this.cronValueObj.month = "*"; |
| | | this.cronValueObj.week = arr[4]; |
| | | } |
| | | |
| | | if (this.cronValueObj.week != "*") { |
| | | this.every = "week" |
| | | this.every = "week"; |
| | | } else if (this.cronValueObj.day != "*") { |
| | | this.every = "month" |
| | | this.every = "month"; |
| | | } else { |
| | | this.every = "day" |
| | | this.every = "day"; |
| | | } |
| | | this.time = this.cronValueObj.hour + ":" + this.cronValueObj.min |
| | | this.time = this.cronValueObj.hour + ":" + this.cronValueObj.min; |
| | | } else { |
| | | //没有传入的表达式 则还原 |
| | | this.clearCron(); |
| | |
| | | changeEvery() { |
| | | this.saveBtn = true; |
| | | if (this.every === "never") { |
| | | this.cronText = "" |
| | | return |
| | | this.cronText = ""; |
| | | return; |
| | | } |
| | | if (this.every === "month") { |
| | | this.cronValueObj.week = "*" |
| | | this.cronValueObj.day = "1" |
| | | this.cronValueObj.week = "*"; |
| | | this.cronValueObj.day = "1"; |
| | | if (!this.time.length) { |
| | | this.time = "00:00" |
| | | this.time = "00:00"; |
| | | } |
| | | } |
| | | if (this.every === "week") { |
| | | this.cronValueObj.day = "*" |
| | | this.cronValueObj.week = "1" |
| | | this.cronValueObj.day = "*"; |
| | | this.cronValueObj.week = "1"; |
| | | if (!this.time.length) { |
| | | this.time = "00:00" |
| | | this.time = "00:00"; |
| | | } |
| | | } |
| | | if (this.every === "day") { |
| | | this.cronValueObj.day = "*" |
| | | this.cronValueObj.week = "*" |
| | | this.cronValueObj.day = "*"; |
| | | this.cronValueObj.week = "*"; |
| | | } |
| | | this.updateExpression() |
| | | this.updateExpression(); |
| | | }, |
| | | updateExpression() { |
| | | this.saveBtn = true; |
| | | if (this.time.length) { |
| | | let arr = this.time.split(":"); |
| | | this.cronValueObj.hour = arr[0] |
| | | this.cronValueObj.min = arr[1] |
| | | this.cronValueObj.hour = arr[0]; |
| | | this.cronValueObj.min = arr[1]; |
| | | } |
| | | this.crontabValueString() |
| | | this.crontabValueString(); |
| | | }, |
| | | clearCron() { |
| | | this.cronValueObj.second = "*" |
| | | this.cronValueObj.min = "*" |
| | | this.cronValueObj.hour = "*" |
| | | this.cronValueObj.day = "*" |
| | | this.cronValueObj.month = "*" |
| | | this.cronValueObj.week = "*" |
| | | this.cronValueObj.second = "*"; |
| | | this.cronValueObj.min = "*"; |
| | | this.cronValueObj.hour = "*"; |
| | | this.cronValueObj.day = "*"; |
| | | this.cronValueObj.month = "*"; |
| | | this.cronValueObj.week = "*"; |
| | | }, |
| | | crontabValueString: function () { |
| | | let obj = this.cronValueObj; |
| | |
| | | " " + |
| | | obj.month + |
| | | " " + |
| | | obj.week |
| | | obj.week; |
| | | }, |
| | | save() { |
| | | debugger |
| | | this.$emit("update", this.cronText) |
| | | } |
| | | } |
| | | } |
| | | this.$emit("update", this.cronText); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss"> |