zhangdaiscott
5 years ago
parent
4d5ac2b518
commit
432385fc14
@ -0,0 +1,99 @@
|
|||||||
|
<template>
|
||||||
|
<div class="input-cron">
|
||||||
|
<a-input :placeholder="placeholder" v-model="editCronValue" :disabled="disabled">
|
||||||
|
<a slot="addonAfter" @click="showConfigDlg" class="config-btn" :disabled="disabled">
|
||||||
|
<a-icon type="setting"></a-icon>
|
||||||
|
选择
|
||||||
|
</a>
|
||||||
|
</a-input>
|
||||||
|
<j-modal :visible.sync="show" title="Cron表达式" width="800px">
|
||||||
|
<easy-cron
|
||||||
|
v-model="editCronValue"
|
||||||
|
:exeStartTime="exeStartTime"
|
||||||
|
:hideYear="hideYear"
|
||||||
|
:remote="remote"
|
||||||
|
:hideSecond="hideSecond"
|
||||||
|
style="width: 100%"
|
||||||
|
></easy-cron>
|
||||||
|
</j-modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import EasyCron from './EasyCron.vue'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'input-cron',
|
||||||
|
components: {EasyCron},
|
||||||
|
model: {
|
||||||
|
prop: 'cronValue',
|
||||||
|
event: 'change'
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
cronValue: {
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
width: {
|
||||||
|
type: String,
|
||||||
|
default: '800px'
|
||||||
|
},
|
||||||
|
placeholder: {
|
||||||
|
type: String,
|
||||||
|
default: '请输入cron表达式'
|
||||||
|
},
|
||||||
|
disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
exeStartTime: {
|
||||||
|
type: [Number, String, Object],
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
|
hideSecond: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
hideYear: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
remote: {
|
||||||
|
type: Function,
|
||||||
|
default: null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
editCronValue: this.cronValue,
|
||||||
|
show: false,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
cronValue(newVal, oldVal) {
|
||||||
|
if (newVal === this.editCronValue) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.editCronValue = newVal
|
||||||
|
},
|
||||||
|
editCronValue(newVal, oldVal) {
|
||||||
|
this.$emit('change', newVal)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
showConfigDlg() {
|
||||||
|
if (!this.disabled) {
|
||||||
|
this.show = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
.config-btn {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -0,0 +1,37 @@
|
|||||||
|
const dateFormat = (date, block) => {
|
||||||
|
if (!date) {
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
|
||||||
|
let format = block || 'yyyy-MM-dd'
|
||||||
|
|
||||||
|
date = new Date(date)
|
||||||
|
|
||||||
|
const map = {
|
||||||
|
M: date.getMonth() + 1, // 月份
|
||||||
|
d: date.getDate(), // 日
|
||||||
|
h: date.getHours(), // 小时
|
||||||
|
m: date.getMinutes(), // 分
|
||||||
|
s: date.getSeconds(), // 秒
|
||||||
|
q: Math.floor((date.getMonth() + 3) / 3), // 季度
|
||||||
|
S: date.getMilliseconds() // 毫秒
|
||||||
|
}
|
||||||
|
|
||||||
|
format = format.replace(/([yMdhmsqS])+/g, (all, t) => {
|
||||||
|
let v = map[t]
|
||||||
|
if (v !== undefined) {
|
||||||
|
if (all.length > 1) {
|
||||||
|
v = `0${v}`
|
||||||
|
v = v.substr(v.length - 2)
|
||||||
|
}
|
||||||
|
return v
|
||||||
|
} else if (t === 'y') {
|
||||||
|
return (date.getFullYear().toString()).substr(4 - all.length)
|
||||||
|
}
|
||||||
|
return all
|
||||||
|
})
|
||||||
|
|
||||||
|
return format
|
||||||
|
}
|
||||||
|
|
||||||
|
export default dateFormat
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
export const WEEK_MAP_EN = {
|
||||||
|
'SUN': '0',
|
||||||
|
'MON': '1',
|
||||||
|
'TUE': '2',
|
||||||
|
'WED': '3',
|
||||||
|
'THU': '4',
|
||||||
|
'FRI': '5',
|
||||||
|
'SAT': '6'
|
||||||
|
}
|
||||||
|
|
||||||
|
export const replaceWeekName = (c) => {
|
||||||
|
// console.info('after: ' + c)
|
||||||
|
if (c) {
|
||||||
|
Object.keys(WEEK_MAP_EN).forEach(k => {
|
||||||
|
c = c.replace(new RegExp(k, 'g'), WEEK_MAP_EN[k])
|
||||||
|
})
|
||||||
|
c = c.replace(new RegExp('7', 'g'), '0')
|
||||||
|
}
|
||||||
|
// console.info('after: ' + c)
|
||||||
|
return c
|
||||||
|
}
|
||||||
@ -0,0 +1,151 @@
|
|||||||
|
// 主要用于日和星期的互斥使用
|
||||||
|
const TYPE_NOT_SET = 'TYPE_NOT_SET'
|
||||||
|
const TYPE_EVERY = 'TYPE_EVERY'
|
||||||
|
const TYPE_RANGE = 'TYPE_RANGE'
|
||||||
|
const TYPE_LOOP = 'TYPE_LOOP'
|
||||||
|
const TYPE_WORK = 'TYPE_WORK'
|
||||||
|
const TYPE_LAST = 'TYPE_LAST'
|
||||||
|
const TYPE_SPECIFY = 'TYPE_SPECIFY'
|
||||||
|
|
||||||
|
const DEFAULT_VALUE = '?'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
model: {
|
||||||
|
prop: 'prop',
|
||||||
|
event: 'change'
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
prop: {
|
||||||
|
type: String,
|
||||||
|
default: DEFAULT_VALUE
|
||||||
|
},
|
||||||
|
disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
const type = TYPE_EVERY
|
||||||
|
return {
|
||||||
|
DEFAULT_VALUE,
|
||||||
|
// 类型
|
||||||
|
type,
|
||||||
|
// 启用日或者星期互斥用
|
||||||
|
TYPE_NOT_SET,
|
||||||
|
TYPE_EVERY,
|
||||||
|
TYPE_RANGE,
|
||||||
|
TYPE_LOOP,
|
||||||
|
TYPE_WORK,
|
||||||
|
TYPE_LAST,
|
||||||
|
TYPE_SPECIFY,
|
||||||
|
// 对于不同的类型，所定义的值也有所不同
|
||||||
|
valueRange: {
|
||||||
|
start: 0,
|
||||||
|
end: 0
|
||||||
|
},
|
||||||
|
valueLoop: {
|
||||||
|
start: 0,
|
||||||
|
interval: 1
|
||||||
|
},
|
||||||
|
valueWeek: {
|
||||||
|
start: 0,
|
||||||
|
end: 0
|
||||||
|
},
|
||||||
|
valueList: [],
|
||||||
|
valueWork: 1,
|
||||||
|
maxValue: 0,
|
||||||
|
minValue: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
prop (newVal, oldVal) {
|
||||||
|
if (newVal === this.value_c) {
|
||||||
|
// console.info('skip ' + newVal)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.parseProp(newVal)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
value_c () {
|
||||||
|
let result = []
|
||||||
|
switch (this.type) {
|
||||||
|
case TYPE_NOT_SET:
|
||||||
|
result.push('?')
|
||||||
|
break
|
||||||
|
case TYPE_EVERY:
|
||||||
|
result.push('*')
|
||||||
|
break
|
||||||
|
case TYPE_RANGE:
|
||||||
|
result.push(`${this.valueRange.start}-${this.valueRange.end}`)
|
||||||
|
break
|
||||||
|
case TYPE_LOOP:
|
||||||
|
result.push(`${this.valueLoop.start}/${this.valueLoop.interval}`)
|
||||||
|
break
|
||||||
|
case TYPE_WORK:
|
||||||
|
result.push(`${this.valueWork}W`)
|
||||||
|
break
|
||||||
|
case TYPE_LAST:
|
||||||
|
result.push('L')
|
||||||
|
break
|
||||||
|
case TYPE_SPECIFY:
|
||||||
|
result.push(this.valueList.join(','))
|
||||||
|
break
|
||||||
|
default:
|
||||||
|
result.push(this.DEFAULT_VALUE)
|
||||||
|
break
|
||||||
|
}
|
||||||
|
return result.length > 0 ? result.join('') : this.DEFAULT_VALUE
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
parseProp (value) {
|
||||||
|
if (value === this.value_c) {
|
||||||
|
// console.info('same ' + value)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (typeof (this.preProcessProp) === 'function') {
|
||||||
|
value = this.preProcessProp(value)
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
if (!value || value === this.DEFAULT_VALUE) {
|
||||||
|
this.type = TYPE_EVERY
|
||||||
|
} else if (value.indexOf('?') >= 0) {
|
||||||
|
this.type = TYPE_NOT_SET
|
||||||
|
} else if (value.indexOf('-') >= 0) {
|
||||||
|
this.type = TYPE_RANGE
|
||||||
|
const values = value.split('-')
|
||||||
|
if (values.length >= 2) {
|
||||||
|
this.valueRange.start = parseInt(values[0])
|
||||||
|
this.valueRange.end = parseInt(values[1])
|
||||||
|
}
|
||||||
|
} else if (value.indexOf('/') >= 0) {
|
||||||
|
this.type = TYPE_LOOP
|
||||||
|
const values = value.split('/')
|
||||||
|
if (values.length >= 2) {
|
||||||
|
this.valueLoop.start = value[0] === '*' ? 0 : parseInt(values[0])
|
||||||
|
this.valueLoop.interval = parseInt(values[1])
|
||||||
|
}
|
||||||
|
} else if (value.indexOf('W') >= 0) {
|
||||||
|
this.type = TYPE_WORK
|
||||||
|
const values = value.split('W')
|
||||||
|
if (!values[0] && !isNaN(values[0])) {
|
||||||
|
this.valueWork = parseInt(values[0])
|
||||||
|
}
|
||||||
|
} else if (value.indexOf('L') >= 0) {
|
||||||
|
this.type = TYPE_LAST
|
||||||
|
const values = value.split('L')
|
||||||
|
this.valueLast = parseInt(values[0])
|
||||||
|
} else if (value.indexOf(',') >= 0 || !isNaN(value)) {
|
||||||
|
this.type = TYPE_SPECIFY
|
||||||
|
this.valueList = value.split(',').map(item => parseInt(item))
|
||||||
|
} else {
|
||||||
|
this.type = TYPE_EVERY
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
// console.info(e)
|
||||||
|
this.type = TYPE_EVERY
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,35 @@
|
|||||||
|
|
||||||
|
.config-list {
|
||||||
|
text-align: left;
|
||||||
|
margin: 0 10px 10px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.choice {
|
||||||
|
padding: 5px 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.w60 {
|
||||||
|
width: 60px;
|
||||||
|
}
|
||||||
|
.w80 {
|
||||||
|
width: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list {
|
||||||
|
margin: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-check-item {
|
||||||
|
padding: 1px 3px;
|
||||||
|
width: 4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tip-info {
|
||||||
|
color: #999
|
||||||
|
}
|
||||||
|
|
||||||
Loading…
Reference in new issue