| 提交 | 用户 | 时间 | ||
| 268beb | 1 | <template> |
| W | 2 | <el-form size='small'> |
| 3 | <el-form-item> | |
| 4 | <el-radio v-model='radioValue' :label="1"> | |
| 5 | 周，允许的通配符[, - * ? / L #] | |
| 6 | </el-radio> | |
| 7 | </el-form-item> | |
| 8 | ||
| 9 | <el-form-item> | |
| 10 | <el-radio v-model='radioValue' :label="2"> | |
| 11 | 不指定 | |
| 12 | </el-radio> | |
| 13 | </el-form-item> | |
| 14 | ||
| 15 | <el-form-item> | |
| 16 | <el-radio v-model='radioValue' :label="3"> | |
| 17 | 周期从星期 | |
| 18 | <el-select clearable v-model="cycle01"> | |
| 19 | <el-option | |
| 20 | v-for="(item,index) of weekList" | |
| 21 | :key="index" | |
| 22 | :label="item.value" | |
| 23 | :value="item.key" | |
| 24 | :disabled="item.key === 1" | |
| 25 | >{{item.value}}</el-option> | |
| 26 | </el-select> | |
| 27 | - | |
| 28 | <el-select clearable v-model="cycle02"> | |
| 29 | <el-option | |
| 30 | v-for="(item,index) of weekList" | |
| 31 | :key="index" | |
| 32 | :label="item.value" | |
| 33 | :value="item.key" | |
| 34 | :disabled="item.key < cycle01 && item.key !== 1" | |
| 35 | >{{item.value}}</el-option> | |
| 36 | </el-select> | |
| 37 | </el-radio> | |
| 38 | </el-form-item> | |
| 39 | ||
| 40 | <el-form-item> | |
| 41 | <el-radio v-model='radioValue' :label="4"> | |
| 42 | 第 | |
| 43 | <el-input-number v-model='average01' :min="1" :max="4" /> 周的星期 | |
| 44 | <el-select clearable v-model="average02"> | |
| 45 | <el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key">{{item.value}}</el-option> | |
| 46 | </el-select> | |
| 47 | </el-radio> | |
| 48 | </el-form-item> | |
| 49 | ||
| 50 | <el-form-item> | |
| 51 | <el-radio v-model='radioValue' :label="5"> | |
| 52 | 本月最后一个星期 | |
| 53 | <el-select clearable v-model="weekday"> | |
| 54 | <el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key">{{item.value}}</el-option> | |
| 55 | </el-select> | |
| 56 | </el-radio> | |
| 57 | </el-form-item> | |
| 58 | ||
| 59 | <el-form-item> | |
| 60 | <el-radio v-model='radioValue' :label="6"> | |
| 61 | 指定 | |
| 62 | <el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> | |
| 63 | <el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="String(item.key)">{{item.value}}</el-option> | |
| 64 | </el-select> | |
| 65 | </el-radio> | |
| 66 | </el-form-item> | |
| 67 | ||
| 68 | </el-form> | |
| 69 | </template> | |
| 70 | ||
| 71 | <script> | |
| 72 | export default { | |
| 73 | data() { | |
| 74 | return { | |
| 75 | radioValue: 2, | |
| 76 | weekday: 2, | |
| 77 | cycle01: 2, | |
| 78 | cycle02: 3, | |
| 79 | average01: 1, | |
| 80 | average02: 2, | |
| 81 | checkboxList: [], | |
| 82 | weekList: [ | |
| 83 | { | |
| 84 | key: 2, | |
| 85 | value: '星期一' | |
| 86 | }, | |
| 87 | { | |
| 88 | key: 3, | |
| 89 | value: '星期二' | |
| 90 | }, | |
| 91 | { | |
| 92 | key: 4, | |
| 93 | value: '星期三' | |
| 94 | }, | |
| 95 | { | |
| 96 | key: 5, | |
| 97 | value: '星期四' | |
| 98 | }, | |
| 99 | { | |
| 100 | key: 6, | |
| 101 | value: '星期五' | |
| 102 | }, | |
| 103 | { | |
| 104 | key: 7, | |
| 105 | value: '星期六' | |
| 106 | }, | |
| 107 | { | |
| 108 | key: 1, | |
| 109 | value: '星期日' | |
| 110 | } | |
| 111 | ], | |
| 112 | checkNum: this.$options.propsData.check | |
| 113 | } | |
| 114 | }, | |
| 115 | name: 'crontab-week', | |
| 116 | props: ['check', 'cron'], | |
| 117 | methods: { | |
| 118 | // 单选按钮值变化时 | |
| 119 | radioChange() { | |
| 120 | if (this.radioValue !== 2 && this.cron.day !== '?') { | |
| 121 | this.$emit('update', 'day', '?', 'week'); | |
| 122 | } | |
| 123 | switch (this.radioValue) { | |
| 124 | case 1: | |
| 125 | this.$emit('update', 'week', '*'); | |
| 126 | break; | |
| 127 | case 2: | |
| 128 | this.$emit('update', 'week', '?'); | |
| 129 | break; | |
| 130 | case 3: | |
| 131 | this.$emit('update', 'week', this.cycleTotal); | |
| 132 | break; | |
| 133 | case 4: | |
| 134 | this.$emit('update', 'week', this.averageTotal); | |
| 135 | break; | |
| 136 | case 5: | |
| 137 | this.$emit('update', 'week', this.weekdayCheck + 'L'); | |
| 138 | break; | |
| 139 | case 6: | |
| 140 | this.$emit('update', 'week', this.checkboxString); | |
| 141 | break; | |
| 142 | } | |
| 143 | }, | |
| 144 | ||
| 145 | // 周期两个值变化时 | |
| 146 | cycleChange() { | |
| 147 | if (this.radioValue == '3') { | |
| 148 | this.$emit('update', 'week', this.cycleTotal); | |
| 149 | } | |
| 150 | }, | |
| 151 | // 平均两个值变化时 | |
| 152 | averageChange() { | |
| 153 | if (this.radioValue == '4') { | |
| 154 | this.$emit('update', 'week', this.averageTotal); | |
| 155 | } | |
| 156 | }, | |
| 157 | // 最近工作日值变化时 | |
| 158 | weekdayChange() { | |
| 159 | if (this.radioValue == '5') { | |
| 160 | this.$emit('update', 'week', this.weekday + 'L'); | |
| 161 | } | |
| 162 | }, | |
| 163 | // checkbox值变化时 | |
| 164 | checkboxChange() { | |
| 165 | if (this.radioValue == '6') { | |
| 166 | this.$emit('update', 'week', this.checkboxString); | |
| 167 | } | |
| 168 | }, | |
| 169 | }, | |
| 170 | watch: { | |
| 171 | 'radioValue': 'radioChange', | |
| 172 | 'cycleTotal': 'cycleChange', | |
| 173 | 'averageTotal': 'averageChange', | |
| 174 | 'weekdayCheck': 'weekdayChange', | |
| 175 | 'checkboxString': 'checkboxChange', | |
| 176 | }, | |
| 177 | computed: { | |
| 178 | // 计算两个周期值 | |
| 179 | cycleTotal: function () { | |
| 180 | this.cycle01 = this.checkNum(this.cycle01, 1, 7) | |
| 181 | this.cycle02 = this.checkNum(this.cycle02, 1, 7) | |
| 182 | return this.cycle01 + '-' + this.cycle02; | |
| 183 | }, | |
| 184 | // 计算平均用到的值 | |
| 185 | averageTotal: function () { | |
| 186 | this.average01 = this.checkNum(this.average01, 1, 4) | |
| 187 | this.average02 = this.checkNum(this.average02, 1, 7) | |
| 188 | return this.average02 + '#' + this.average01; | |
| 189 | }, | |
| 190 | // 最近的工作日（格式） | |
| 191 | weekdayCheck: function () { | |
| 192 | this.weekday = this.checkNum(this.weekday, 1, 7) | |
| 193 | return this.weekday; | |
| 194 | }, | |
| 195 | // 计算勾选的checkbox值合集 | |
| 196 | checkboxString: function () { | |
| 197 | let str = this.checkboxList.join(); | |
| 198 | return str == '' ? '*' : str; | |
| 199 | } | |
| 200 | } | |
| 201 | } | |
| 202 | </script> | |
