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