mouth.vue 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. <template>
  2. <el-form size='small'>
  3. <el-form-item>
  4. <el-radio v-model='radioValue' :label="1">
  5. 月,允许的通配符[, - * /]
  6. </el-radio>
  7. </el-form-item>
  8. <el-form-item>
  9. <el-radio v-model='radioValue' :label="2">
  10. 周期从
  11. <el-input-number v-model='cycle01' :min="1" :max="12" /> -
  12. <el-input-number v-model='cycle02' :min="1" :max="12" /> 月
  13. </el-radio>
  14. </el-form-item>
  15. <el-form-item>
  16. <el-radio v-model='radioValue' :label="3">
  17. <el-input-number v-model='average01' :min="1" :max="12" /> 月开始,每
  18. <el-input-number v-model='average02' :min="1" :max="12" /> 月月执行一次
  19. </el-radio>
  20. </el-form-item>
  21. <el-form-item>
  22. <el-radio v-model='radioValue' :label="4">
  23. 指定
  24. <el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%">
  25. <el-option v-for="item in 12" :key="item" :value="item">{{item}}</el-option>
  26. </el-select>
  27. </el-radio>
  28. </el-form-item>
  29. </el-form>
  30. </template>
  31. <script>
  32. export default {
  33. data() {
  34. return {
  35. radioValue: 1,
  36. cycle01: 1,
  37. cycle02: 2,
  38. average01: 1,
  39. average02: 1,
  40. checkboxList: [],
  41. checkNum: this.check
  42. }
  43. },
  44. name: 'crontab-mouth',
  45. props: ['check', 'cron'],
  46. methods: {
  47. // 单选按钮值变化时
  48. radioChange() {
  49. if (this.radioValue === 1) {
  50. this.$emit('update', 'mouth', '*');
  51. this.$emit('update', 'year', '*');
  52. } else {
  53. if (this.cron.day === '*') {
  54. this.$emit('update', 'day', '0', 'mouth');
  55. }
  56. if (this.cron.hour === '*') {
  57. this.$emit('update', 'hour', '0', 'mouth');
  58. }
  59. if (this.cron.min === '*') {
  60. this.$emit('update', 'min', '0', 'mouth');
  61. }
  62. if (this.cron.second === '*') {
  63. this.$emit('update', 'second', '0', 'mouth');
  64. }
  65. }
  66. switch (this.radioValue) {
  67. case 2:
  68. this.$emit('update', 'mouth', this.cycle01 + '-' + this.cycle02);
  69. break;
  70. case 3:
  71. this.$emit('update', 'mouth', this.average01 + '/' + this.average02);
  72. break;
  73. case 4:
  74. this.$emit('update', 'mouth', this.checkboxString);
  75. break;
  76. }
  77. },
  78. // 周期两个值变化时
  79. cycleChange() {
  80. if (this.radioValue == '2') {
  81. this.$emit('update', 'mouth', this.cycleTotal);
  82. }
  83. },
  84. // 平均两个值变化时
  85. averageChange() {
  86. if (this.radioValue == '3') {
  87. this.$emit('update', 'mouth', this.averageTotal);
  88. }
  89. },
  90. // checkbox值变化时
  91. checkboxChange() {
  92. if (this.radioValue == '4') {
  93. this.$emit('update', 'mouth', this.checkboxString);
  94. }
  95. }
  96. },
  97. watch: {
  98. "radioValue": "radioChange",
  99. 'cycleTotal': 'cycleChange',
  100. 'averageTotal': 'averageChange',
  101. 'checkboxString': 'checkboxChange'
  102. },
  103. computed: {
  104. // 计算两个周期值
  105. cycleTotal: function () {
  106. this.cycle01 = this.checkNum(this.cycle01, 1, 12)
  107. this.cycle02 = this.checkNum(this.cycle02, 1, 12)
  108. return this.cycle01 + '-' + this.cycle02;
  109. },
  110. // 计算平均用到的值
  111. averageTotal: function () {
  112. this.average01 = this.checkNum(this.average01, 1, 12)
  113. this.average02 = this.checkNum(this.average02, 1, 12)
  114. return this.average01 + '/' + this.average02;
  115. },
  116. // 计算勾选的checkbox值合集
  117. checkboxString: function () {
  118. let str = this.checkboxList.join();
  119. return str == '' ? '*' : str;
  120. }
  121. }
  122. }
  123. </script>