zhangzengfei
2022-08-23 bd6b0405a89e66f80ca777599b035d4ea7f3ea6a
src/components/subComponents/VueCron.vue
@@ -1,7 +1,12 @@
<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>
@@ -16,7 +21,12 @@
      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
@@ -39,7 +49,7 @@
    <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="任意时间点"
@@ -54,7 +64,8 @@
      size="small"
      style="margin-left: 20px"
      @click="save"
    >保存</el-button>
      >保存</el-button
    >
  </div>
</template>
@@ -64,21 +75,21 @@
  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 {
@@ -90,13 +101,13 @@
        hour: "*",
        day: "*",
        month: "*",
        week: "*"
        week: "*",
      },
      cronText: ""
    }
      cronText: "",
    };
  },
  mounted() {
    this.resolveExp()
    this.resolveExp();
  },
  methods: {
    resolveExp() {
@@ -106,22 +117,22 @@
        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();
@@ -130,45 +141,45 @@
    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;
@@ -181,14 +192,13 @@
        " " +
        obj.month +
        " " +
        obj.week
        obj.week;
    },
    save() {
      debugger
      this.$emit("update", this.cronText)
    }
  }
}
      this.$emit("update", this.cronText);
    },
  },
};
</script>
<style lang="scss">