sh-view 1.5.2

package/packages/components/other-components/sh-cron-modal/tabs/cron-day-box.vue

@@ -0,0 +1,92 @@
+<template>
+	<div class="sh-cron-config-list">
+		<vxe-radio-group v-model="type">
+			<div class="item">
+				<vxe-radio :value="TypeEnum.unset" v-bind="beforeRadioAttrs">不设置</vxe-radio>
+				<span class="tip-info">日和周只能设置其中之一</span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.every" v-bind="beforeRadioAttrs">每日</vxe-radio>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.range" v-bind="beforeRadioAttrs">区间</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueRange.start" v-bind="typeRangeAttrs" />
+				<span> 日 至 </span>
+				<vxe-input v-model="valueRange.end" v-bind="typeRangeAttrs" />
+				<span> 日 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueLoop.start" v-bind="typeLoopAttrs" />
+				<span> 日开始，间隔 </span>
+				<vxe-input v-model="valueLoop.interval" v-bind="typeLoopAttrs" />
+				<span> 日 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.work" v-bind="beforeRadioAttrs">工作日</vxe-radio>
+				<span> 本月 </span>
+				<vxe-input v-model="valueWork" v-bind="typeWorkAttrs" />
+				<span> 日，最近的工作日 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.last" v-bind="beforeRadioAttrs">最后一日</vxe-radio>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.specify" v-bind="beforeRadioAttrs">指定</vxe-radio>
+				<div class="list">
+					<vxe-checkbox-group v-model="valueList">
+						<template v-for="i in specifyRange" :key="i">
+							<vxe-checkbox :label="i" v-bind="typeSpecifyAttrs">{{ i }}</vxe-checkbox>
+						</template>
+					</vxe-checkbox-group>
+				</div>
+			</div>
+		</vxe-radio-group>
+	</div>
+</template>
+
+<script>
+import cronMixin from '../mixin/cron-box'
+
+export default {
+	name: 'CronDayBox',
+	mixins: [cronMixin],
+	props: {
+		week: {
+			type: String,
+			default: '?'
+		}
+	},
+	data() {
+		return {
+			defaultValue: '*',
+			valueWork: 1,
+			minValue: 1,
+			maxValue: 31,
+			valueRange: { start: 1, end: 31 },
+			valueLoop: { start: 1, interval: 1 }
+		}
+	},
+	computed: {
+		disabledChoice() {
+			return (this.week && this.week !== '?') || this.disabled
+		},
+		typeWorkAttrs() {
+			return {
+				...this.inputNumberAttrs,
+				disabled: this.type !== this.TypeEnum.work || this.disabled || this.disabledChoice
+			}
+		}
+	},
+	watch: {
+		week() {
+			this.updateValue(this.disabledChoice ? '?' : this.computeValue)
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style scoped></style>

package/packages/components/other-components/sh-cron-modal/tabs/cron-hour-box.vue

@@ -0,0 +1,56 @@
+<template>
+	<div class="sh-cron-config-list">
+		<vxe-radio-group v-model="type">
+			<div class="item">
+				<vxe-radio :label="TypeEnum.every" v-bind="beforeRadioAttrs">每时</vxe-radio>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.range" v-bind="beforeRadioAttrs">区间</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueRange.start" v-bind="typeRangeAttrs" />
+				<span> 时 至 </span>
+				<vxe-input v-model="valueRange.end" v-bind="typeRangeAttrs" />
+				<span> 时 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueLoop.start" v-bind="typeLoopAttrs" />
+				<span> 时开始，间隔 </span>
+				<vxe-input v-model="valueLoop.interval" v-bind="typeLoopAttrs" />
+				<span> 时 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.specify" v-bind="beforeRadioAttrs">指定</vxe-radio>
+				<div class="list">
+					<vxe-checkbox-group v-model="valueList">
+						<template v-for="i in specifyRange" :key="i">
+							<vxe-checkbox :label="i" v-bind="typeSpecifyAttrs">{{ i }}</vxe-checkbox>
+						</template>
+					</vxe-checkbox-group>
+				</div>
+			</div>
+		</vxe-radio-group>
+	</div>
+</template>
+
+<script>
+import cronMixin from '../mixin/cron-box'
+
+export default {
+	name: 'CronHourBox',
+	mixins: [cronMixin],
+	data() {
+		return {
+			defaultValue: '*',
+			minValue: 0,
+			maxValue: 23,
+			valueRange: { start: 0, end: 23 },
+			valueLoop: { start: 0, interval: 1 }
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style scoped></style>

package/packages/components/other-components/sh-cron-modal/tabs/cron-minute-box.vue

@@ -0,0 +1,56 @@
+<template>
+	<div class="sh-cron-config-list">
+		<vxe-radio-group v-model="type">
+			<div class="item">
+				<vxe-radio :label="TypeEnum.every" v-bind="beforeRadioAttrs">每分</vxe-radio>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.range" v-bind="beforeRadioAttrs">区间</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueRange.start" v-bind="typeRangeAttrs" />
+				<span> 分 至 </span>
+				<vxe-input v-model="valueRange.end" v-bind="typeRangeAttrs" />
+				<span> 分 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueLoop.start" v-bind="typeLoopAttrs" />
+				<span> 分开始，间隔 </span>
+				<vxe-input v-model="valueLoop.interval" v-bind="typeLoopAttrs" />
+				<span> 分 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.specify" v-bind="beforeRadioAttrs">指定</vxe-radio>
+				<div class="list">
+					<vxe-checkbox-group v-model="valueList">
+						<template v-for="i in specifyRange" :key="i">
+							<vxe-checkbox :label="i" v-bind="typeSpecifyAttrs">{{ i }}</vxe-checkbox>
+						</template>
+					</vxe-checkbox-group>
+				</div>
+			</div>
+		</vxe-radio-group>
+	</div>
+</template>
+
+<script>
+import cronMixin from '../mixin/cron-box'
+
+export default {
+	name: 'CronMinuteBox',
+	mixins: [cronMixin],
+	data() {
+		return {
+			defaultValue: '*',
+			minValue: 0,
+			maxValue: 59,
+			valueRange: { start: 0, end: 59 },
+			valueLoop: { start: 0, interval: 1 }
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style scoped></style>

package/packages/components/other-components/sh-cron-modal/tabs/cron-month-box.vue

@@ -0,0 +1,56 @@
+<template>
+	<div class="sh-cron-config-list">
+		<vxe-radio-group v-model="type">
+			<div class="item">
+				<vxe-radio :label="TypeEnum.every" v-bind="beforeRadioAttrs">每月</vxe-radio>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.range" v-bind="beforeRadioAttrs">区间</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueRange.start" v-bind="typeRangeAttrs" />
+				<span> 月 至 </span>
+				<vxe-input v-model="valueRange.end" v-bind="typeRangeAttrs" />
+				<span> 月 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueLoop.start" v-bind="typeLoopAttrs" />
+				<span> 月开始，间隔 </span>
+				<vxe-input v-model="valueLoop.interval" v-bind="typeLoopAttrs" />
+				<span> 月 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.specify" v-bind="beforeRadioAttrs">指定</vxe-radio>
+				<div class="list">
+					<vxe-checkbox-group v-model="valueList">
+						<template v-for="i in specifyRange" :key="i">
+							<vxe-checkbox :label="i" v-bind="typeSpecifyAttrs">{{ i }}</vxe-checkbox>
+						</template>
+					</vxe-checkbox-group>
+				</div>
+			</div>
+		</vxe-radio-group>
+	</div>
+</template>
+
+<script>
+import cronMixin from '../mixin/cron-box'
+
+export default {
+	name: 'CronMonthBox',
+	mixins: [cronMixin],
+	data() {
+		return {
+			defaultValue: '*',
+			minValue: 1,
+			maxValue: 12,
+			valueRange: { start: 1, end: 12 },
+			valueLoop: { start: 1, interval: 1 }
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style scoped></style>

package/packages/components/other-components/sh-cron-modal/tabs/cron-second-box.vue

@@ -0,0 +1,56 @@
+<template>
+	<div class="sh-cron-config-list">
+		<vxe-radio-group v-model="type">
+			<div class="item">
+				<vxe-radio :label="TypeEnum.every" v-bind="beforeRadioAttrs">每秒</vxe-radio>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.range" v-bind="beforeRadioAttrs">区间</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueRange.start" v-bind="typeRangeAttrs" />
+				<span> 秒 至 </span>
+				<vxe-input v-model="valueRange.end" v-bind="typeRangeAttrs" />
+				<span> 秒 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueLoop.start" v-bind="typeLoopAttrs" />
+				<span> 秒开始，间隔 </span>
+				<vxe-input v-model="valueLoop.interval" v-bind="typeLoopAttrs" />
+				<span> 秒 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.specify" v-bind="beforeRadioAttrs">指定</vxe-radio>
+				<div class="list">
+					<vxe-checkbox-group v-model="valueList">
+						<template v-for="i in specifyRange" :key="i">
+							<vxe-checkbox :label="i" v-bind="typeSpecifyAttrs">{{ i }}</vxe-checkbox>
+						</template>
+					</vxe-checkbox-group>
+				</div>
+			</div>
+		</vxe-radio-group>
+	</div>
+</template>
+
+<script>
+import cronMixin from '../mixin/cron-box'
+
+export default {
+	name: 'CronSecondBox',
+	mixins: [cronMixin],
+	data() {
+		return {
+			defaultValue: '*',
+			minValue: 0,
+			maxValue: 59,
+			valueRange: { start: 0, end: 59 },
+			valueLoop: { start: 0, interval: 1 }
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style scoped></style>

package/packages/components/other-components/sh-cron-modal/tabs/cron-week-box.vue

@@ -0,0 +1,115 @@
+<template>
+	<div class="sh-cron-config-list">
+		<vxe-radio-group v-model="type">
+			<div class="item">
+				<vxe-radio :label="TypeEnum.unset" v-bind="beforeRadioAttrs">不设置</vxe-radio>
+				<span class="tip-info">日和周只能设置其中之一</span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.range" v-bind="beforeRadioAttrs">区间</vxe-radio>
+				<span> 从 </span>
+				<vxe-select v-model="valueRange.start" :options="weekOptions" v-bind="typeRangeSelectAttrs" />
+				<span> 至 </span>
+				<vxe-select v-model="valueRange.end" :options="weekOptions" v-bind="typeRangeSelectAttrs" />
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</vxe-radio>
+				<span> 从 </span>
+				<vxe-select v-model="valueLoop.start" :options="weekOptions" v-bind="typeLoopSelectAttrs" />
+				<span> 至 </span>
+				<vxe-input v-model="valueLoop.interval" v-bind="typeLoopAttrs" />
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.specify" v-bind="beforeRadioAttrs">指定</vxe-radio>
+				<div class="list">
+					<vxe-checkbox-group v-model="valueList">
+						<template v-for="i in specifyRange" :key="i">
+							<vxe-checkbox :label="i" v-bind="typeSpecifyAttrs">{{ i }}</vxe-checkbox>
+						</template>
+					</vxe-checkbox-group>
+				</div>
+			</div>
+		</vxe-radio-group>
+	</div>
+</template>
+
+<script>
+import cronMixin from '../mixin/cron-box'
+
+const WEEK_MAP_EN = {
+	1: 'SUN',
+	2: 'MON',
+	3: 'TUE',
+	4: 'WED',
+	5: 'THU',
+	6: 'FRI',
+	7: 'SAT'
+}
+
+const WEEK_MAP_CN = {
+	1: '周日',
+	2: '周一',
+	3: '周二',
+	4: '周三',
+	5: '周四',
+	6: '周五',
+	7: '周六'
+}
+
+export default {
+	name: 'CronWeekBox',
+	mixins: [cronMixin],
+	props: {
+		day: {
+			type: String,
+			default: '*'
+		}
+	},
+	data() {
+		return {
+			defaultValue: '*',
+			valueWork: 1,
+			minValue: 1,
+			maxValue: 7,
+			valueRange: { start: 1, end: 7 },
+			valueLoop: { start: 2, interval: 1 }
+		}
+	},
+	computed: {
+		disabledChoice() {
+			return (this.day && this.day !== '?') || this.disabled
+		},
+		weekOptions() {
+			let options = []
+			for (let weekKey of Object.keys(WEEK_MAP_CN)) {
+				let weekName = WEEK_MAP_CN[weekKey]
+				options.push({
+					value: Number.parseInt(weekKey),
+					label: weekName
+				})
+			}
+			return options
+		},
+		typeRangeSelectAttrs() {
+			return {
+				class: ['cron-item-input'],
+				disabled: this.typeRangeAttrs.disabled
+			}
+		},
+		typeLoopSelectAttrs() {
+			return {
+				class: ['cron-item-input'],
+				disabled: this.typeLoopAttrs.disabled
+			}
+		}
+	},
+	watch: {
+		week() {
+			this.updateValue(this.disabledChoice ? '?' : this.computeValue)
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style scoped></style>

package/packages/components/other-components/sh-cron-modal/tabs/cron-year-box.vue

@@ -0,0 +1,46 @@
+<template>
+	<div class="sh-cron-config-list">
+		<vxe-radio-group v-model="type">
+			<div class="item">
+				<vxe-radio :label="TypeEnum.every" v-bind="beforeRadioAttrs">每年</vxe-radio>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.range" v-bind="beforeRadioAttrs">区间</vxe-radio>
+				<span> 从 </span>
+				<vxe-input v-model="valueRange.start" v-bind="typeRangeAttrs" />
+				<span> 年 至 </span>
+				<vxe-input v-model="valueRange.end" v-bind="typeRangeAttrs" />
+				<span> 年 </span>
+			</div>
+			<div class="item">
+				<vxe-radio :label="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</vxe-radio>
+				<span> 年 </span>
+				<vxe-input v-model="valueLoop.start" v-bind="typeLoopAttrs" />
+				<span> 分开始，间隔 </span>
+				<vxe-input v-model="valueLoop.interval" v-bind="typeLoopAttrs" />
+				<span> 年 </span>
+			</div>
+		</vxe-radio-group>
+	</div>
+</template>
+
+<script>
+import cronMixin from '../mixin/cron-box'
+
+const nowYear = new Date().getFullYear()
+export default {
+	name: 'CronYearBox',
+	mixins: [cronMixin],
+	data() {
+		return {
+			defaultValue: '*',
+			minValue: 0,
+			valueRange: { start: nowYear, end: nowYear + 100 },
+			valueLoop: { start: nowYear, interval: 1 }
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style scoped></style>

package/packages/components/other-components/sh-cron-modal/utils/index.js

@@ -0,0 +1,52 @@
+import CronParser from 'cron-parser'
+
+const parse = (value, options) => {
+	return CronParser.parseExpression(value, options)
+}
+
+const validate = value => {
+	// 没填写就不校验
+	if (!value) {
+		return true
+	}
+	const values = value.split(' ').filter(item => !!item)
+	if (values.length > 7) {
+		return new Error('Cron表达式最多7项！')
+	}
+	// 检查第7项
+	let val = value
+	if (values.length === 7) {
+		const year = values[6]
+		if (year !== '*' && year !== '?') {
+			let yearValues = []
+			if (year.indexOf('-') >= 0) {
+				yearValues = year.split('-')
+			} else if (year.indexOf('/')) {
+				yearValues = year.split('/')
+			} else {
+				yearValues = [year]
+			}
+			// 判断是否都是数字
+			const checkYear = yearValues.some(item => isNaN(Number(item)))
+			if (checkYear) {
+				return new Error('Cron表达式参数[年]错误：' + year)
+			}
+		}
+		// 取其中的前六项
+		val = values.slice(0, 6).join(' ')
+	}
+	// 6位 没有年
+	// 5位没有秒、年
+	try {
+		const iter = parse(val)
+		iter.next()
+		return true
+	} catch (e) {
+		return new Error('Cron表达式错误：' + e)
+	}
+}
+
+export default {
+	parse,
+	validate
+}