<template>
|
<div class="restart">
|
<div class="restart-set">
|
<div class="t">重启设置</div>
|
|
<div class="bar">
|
<div class="name">重启节点</div>
|
<el-button
|
class="reset-btn"
|
type="primary"
|
size="small"
|
@click="restart"
|
>重启</el-button
|
>
|
</div>
|
</div>
|
|
<div class="restart-set">
|
<div class="t">定时重启</div>
|
<div class="bar">
|
<div class="name">重启周期</div>
|
<el-select
|
v-model="every"
|
placeholder="关闭"
|
size="small"
|
@change="changeEvery"
|
>
|
<el-option
|
v-for="item in options"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</div>
|
|
<div class="bar" v-if="every == 'monthly'">
|
<div class="name">重启日期</div>
|
<el-select
|
v-model="cronValueObj.day"
|
placeholder="请选择"
|
size="small"
|
@change="updateExpression"
|
>
|
<el-option
|
v-for="item in days"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</div>
|
|
<div class="bar" v-if="every == 'weekly'">
|
<div class="name">重启日期</div>
|
<el-select
|
v-model="cronValueObj.week"
|
placeholder="请选择"
|
size="small"
|
@change="updateExpression"
|
>
|
<el-option label="星期一" value="1"></el-option>
|
<el-option label="星期二" value="2"></el-option>
|
<el-option label="星期三" value="3"></el-option>
|
<el-option label="星期四" value="4"></el-option>
|
<el-option label="星期五" value="5"></el-option>
|
<el-option label="星期六" value="6"></el-option>
|
<el-option label="星期日" value="7"></el-option>
|
</el-select>
|
</div>
|
|
<div class="bar" v-if="every != 'close'">
|
<div class="name">重启时间</div>
|
<el-time-picker
|
v-model="time"
|
:picker-options="{ selectableRange: '00:00:00 - 23:59:59' }"
|
value-format="HH:mm"
|
format="HH:mm"
|
placeholder="任意时间点"
|
size="small"
|
@change="updateExpression"
|
></el-time-picker>
|
</div>
|
</div>
|
|
<el-button class="save-btn" type="primary" @click="save">保存</el-button>
|
</div>
|
</template>
|
|
<script>
|
import {
|
rebootServer,
|
getDevInfo,
|
getRebootTask,
|
setRebootTask,
|
fileUpload,
|
doUpgrade,
|
deleteDate,
|
} from "@/api/system";
|
export default {
|
data() {
|
return {
|
time: "",
|
saveBtn: false,
|
timer: null,
|
probeSum: 0,
|
cronText: "",
|
cronValueObj: {
|
min: "*",
|
hour: "*",
|
day: "*",
|
month: "*",
|
week: "*",
|
},
|
options: [
|
{
|
value: "close",
|
label: "关闭",
|
},
|
{
|
value: "daily",
|
label: "每日",
|
},
|
{
|
value: "weekly",
|
label: "每周",
|
},
|
{
|
value: "monthly",
|
label: "每月",
|
},
|
],
|
every: "close",
|
rebootCron: "",
|
};
|
},
|
computed: {
|
days: () => {
|
let arr = [];
|
for (let i = 1; i < 32; i++) {
|
arr.push({
|
label: i + "日",
|
value: i + "",
|
});
|
}
|
return arr;
|
},
|
},
|
components: {},
|
mounted() {
|
this.getRebootCron();
|
},
|
beforeDestroy() {},
|
methods: {
|
resolveExp() {
|
// "准备反解析", this.expression;
|
if (this.rebootCron.length) {
|
let arr = this.rebootCron.split(" ");
|
if (arr.length >= 5) {
|
//6 位以上是合法表达式
|
this.cronValueObj.min = arr[0];
|
this.cronValueObj.hour = arr[1];
|
this.cronValueObj.day = arr[2];
|
this.cronValueObj.month = "*";
|
this.cronValueObj.week = arr[4];
|
}
|
|
if (this.cronValueObj.week != "*") {
|
this.every = "weekly";
|
} else if (this.cronValueObj.day != "*") {
|
this.every = "monthly";
|
} else {
|
this.every = "daily";
|
}
|
this.time = this.cronValueObj.hour + ":" + this.cronValueObj.min;
|
} else {
|
//没有传入的表达式 则还原
|
this.clearCron();
|
}
|
},
|
clearCron() {
|
this.cronValueObj.min = "*";
|
this.cronValueObj.hour = "*";
|
this.cronValueObj.day = "*";
|
this.cronValueObj.month = "*";
|
this.cronValueObj.week = "*";
|
},
|
getRebootCron() {
|
getRebootTask().then((rsp) => {
|
this.rebootCron = rsp.data;
|
});
|
},
|
reLogin() {
|
this.$router.push("/");
|
},
|
restart() {
|
this.$confirm("确定要重启该节点吗?", {
|
center: true,
|
cancelButtonClass: "comfirm-class-cancle",
|
confirmButtonClass: "comfirm-class-sure",
|
}).then(() => {
|
// this.loading = true;
|
// this.loadingText = "智能计算节点正在重启，请耐心等待..."
|
rebootServer()
|
.then((rsp) => {
|
this.probeServer(this.reLogin);
|
})
|
.catch((err) => {
|
if (err.status == 400) {
|
// this.loading = false;
|
this.$notify({
|
type: "error",
|
message: "重启计算节点失败",
|
});
|
} else {
|
this.probeServer(this.reLogin);
|
}
|
});
|
});
|
},
|
probeServer(cb) {
|
this.probeSum++;
|
let _this = this;
|
if (this.probeSum > 60) {
|
this.$confirm("连接服务器失败, 请刷新页面或联系管理员", "失败", {
|
type: "error",
|
cancelButtonClass: "comfirm-class-cancle",
|
confirmButtonClass: "comfirm-class-sure",
|
}).then(() => {
|
cb();
|
});
|
return;
|
}
|
this.timer = setTimeout(() => {
|
getDevInfo()
|
.then(() => {
|
cb();
|
})
|
.catch((err) => {
|
_this.probeServer(cb);
|
});
|
}, 10000);
|
},
|
save() {
|
this.rebootCron = this.cronText;
|
setRebootTask({ task: this.cronText })
|
.then((rsp) => {
|
if (rsp && rsp.success) {
|
this.$notify({
|
type: "success",
|
message: "配置成功",
|
});
|
}
|
})
|
.catch((err) => {
|
this.$notify({
|
type: "error",
|
message: "配置失败",
|
});
|
});
|
},
|
changeEvery() {
|
this.saveBtn = true;
|
if (this.every === "close") {
|
this.cronText = "";
|
return;
|
}
|
if (this.every === "monthly") {
|
this.cronValueObj.week = "*";
|
this.cronValueObj.day = "1";
|
if (!this.time.length) {
|
this.time = "00:00";
|
}
|
}
|
if (this.every === "weekly") {
|
this.cronValueObj.day = "*";
|
this.cronValueObj.week = "1";
|
if (!this.time.length) {
|
this.time = "00:00";
|
}
|
}
|
if (this.every === "daily") {
|
this.cronValueObj.day = "*";
|
this.cronValueObj.week = "*";
|
}
|
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.crontabValueString();
|
},
|
crontabValueString() {
|
let obj = this.cronValueObj;
|
this.cronText =
|
obj.min +
|
" " +
|
obj.hour +
|
" " +
|
obj.day +
|
" " +
|
obj.month +
|
" " +
|
obj.week;
|
},
|
},
|
watch: {
|
rebootCron() {
|
this.resolveExp();
|
},
|
},
|
};
|
</script>
|
<style lang="scss">
|
.all {
|
width: 100%;
|
}
|
.restart {
|
margin: 0 auto;
|
padding: 20px;
|
.t {
|
box-sizing: border-box;
|
text-align: left;
|
width: 70%;
|
margin: 0 auto;
|
padding: 10px;
|
font-size: 16px;
|
}
|
.bar {
|
height: 50px;
|
|
width: 70%;
|
background: rgba(248, 248, 248, 1);
|
margin: 0 auto;
|
min-width: 300px;
|
display: flex;
|
justify-content: space-between;
|
box-sizing: border-box;
|
padding: 0 20px;
|
align-items: center;
|
border-radius: 10px;
|
margin-bottom: 10px;
|
.reset-btn {
|
width: 70px;
|
height: 32px;
|
border-radius: 5px;
|
}
|
.el-select {
|
width: 100%;
|
}
|
.name {
|
min-width: 150px;
|
text-align: left;
|
font-size: 14px;
|
}
|
.el-input__inner::placeholder {
|
color: rgba(107, 107, 107, 1);
|
}
|
.el-input--small .el-input__inner {
|
height: 32px;
|
line-height: 32px;
|
border: none;
|
background: rgba(240, 240, 240, 1);
|
}
|
.el-select .el-input .el-select__caret {
|
color: rgba(138, 138, 138, 1);
|
font-size: 15px;
|
}
|
.el-date-editor.el-input,
|
.el-date-editor.el-input__inner {
|
width: 100%;
|
}
|
}
|
.save-btn {
|
width: 260px;
|
margin-top: 50px;
|
}
|
}
|
</style>
|
