Blame view

ant-design-vue-jeecg/src/components/jeecg/JEasyCron/tabs/week.vue 3.4 KB
肖超群 authored
1
2
3
4
5
6
7
8
9
10
11
12
<template>
  <div class="config-list week">
    <a-radio-group v-model="type">
      <div class="item">
        <a-radio value="TYPE_NOT_SET" class="choice" :disabled="disableChoice">不设置</a-radio>
        <span class="tip-info">日和周只能设置其中之一</span>
      </div>
      <div class="item">
        <a-radio value="TYPE_RANGE" class="choice" :disabled="disableChoice">区间</a-radio>

        <a-select v-model="valueRange.start" class="w80" :disabled="type!==TYPE_RANGE || disableChoice">
          <template v-for="(v, k) of WEEK_MAP">
肖超群 authored
13
            <a-select-option :value="v">{{ k }}</a-select-option>
肖超群 authored
14
15
16
17
18
          </template>
        </a-select>

        <a-select v-model="valueRange.end" class="w80" :disabled="type!==TYPE_RANGE || disableChoice">
          <template v-for="(v, k) of WEEK_MAP">
肖超群 authored
19
            <a-select-option :value="v">{{ k }}</a-select-option>
肖超群 authored
20
21
22
23
24
25
26
27
          </template>
        </a-select>
      </div>
      <div class="item">
        <a-radio value="TYPE_LOOP" class="choice" :disabled="disableChoice">循环</a-radio>

        <a-select v-model="valueLoop.start" class="w80" :disabled="type!==TYPE_LOOP || disableChoice">
          <template v-for="(v, k) of WEEK_MAP">
肖超群 authored
28
            <a-select-option :value="v">{{ k }}</a-select-option>
肖超群 authored
29
30
31
          </template>
        </a-select>
        开始,间隔
肖超群 authored
32
33
        <a-input-number :disabled="type!==TYPE_LOOP || disableChoice" :max="maxValue" :min="minValue" :precision="0"
                        class="w60" v-model="valueLoop.interval"/>
肖超群 authored
34
35
36
37
38
39
40

      </div>
      <div class="item">
        <a-radio value="TYPE_SPECIFY" class="choice" :disabled="disableChoice">指定</a-radio>
        <div class="list">
          <a-checkbox-group v-model="valueList">
            <template v-for="(v,k) in WEEK_MAP">
肖超群 authored
41
42
43
              <a-checkbox class="list-check-item" :key="`key-${v}`" :value="v"
                          :disabled="type!==TYPE_SPECIFY || disabled">{{ k }}
              </a-checkbox>
肖超群 authored
44
45
46
47
48
49
50
51
52
53
            </template>
          </a-checkbox-group>
        </div>
      </div>
    </a-radio-group>
  </div>
</template>

<script>
import mixin from './mixin'
肖超群 authored
54
import {replaceWeekName, WEEK_MAP_EN} from './const.js'
肖超群 authored
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119

const WEEK_MAP = {
  '周一': 2,
  '周二': 3,
  '周三': 4,
  '周四': 5,
  '周五': 6,
  '周六': 7,
  // 按照国人习惯,将周日放到每周的最后一天
  '周日': 1,
}

export default {
  name: 'week',
  mixins: [mixin],
  props: {
    day: {
      type: String,
      default: '*'
    }
  },
  data() {
    return {
      WEEK_MAP,
      WEEK_MAP_EN
    }
  },
  computed: {
    disableChoice() {
      return (this.day && this.day !== '?') || this.disabled
    }
  },
  watch: {
    value_c(newVal, oldVal) {
      // 如果设置日,那么星期就直接不设置
      this.updateValue()
    },
    day(newVal) {
      // console.info('new day: ' + newVal)
      this.updateValue()
    }
  },
  methods: {
    updateValue() {
      this.$emit('change', this.disableChoice ? '?' : this.value_c)
    },
    preProcessProp(c) {
      return replaceWeekName(c)
    }
  },
  created() {
    this.DEFAULT_VALUE = '*'
    // 0,7表示周日 1表示周一
    this.minValue = 1
    this.maxValue = 7
    this.valueRange.start = 1
    this.valueRange.end = 7
    this.valueLoop.start = 2
    this.valueLoop.interval = 1
    this.parseProp(this.prop)
  }
}
</script>

<style lang="less" scoped>
肖超群 authored
120
@import "mixin.less";
肖超群 authored
121
</style>