1 Star 0 Fork 65

xxssyyyyssxx / easy-cron

forked from toktok / easy-cron 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

easy-cron

介绍

Cron表达式看则简单,但是实际上如果手写的话,非常容易出错的,而且很难及时发现,而easy-cron就是为此应运而生的。

easy-cron是基于Vue.js和iview实现crontab表达式的UI组件,支持多种特性,可以方便、快捷直观地定义cron表达式,并支持给定开始时间后的执行时间点,方便排除错误。

本工程包括测试代码,和vue原始文件。

image image image image

软件特性

支持特性:

  • 纯js代码实现,可以方便和其他iview&vue.js项目无缝接入。
  • v-model双向数据绑定
  • 多种crontab表达式,可以支持到参数年
  • cron表达式校验器validator
  • 提供easy-cron原始界面组件,方便开发者自己封装
  • 默认提供input-cron输入组件,开发者可以直接使用,内置validator校验
  • 纯js模拟cron表达式的执行触发时间点列表
  • 可以指定开始之后,观察cron表达式触发执行时间点

依赖组件列表:

安装教程

  1. Demo编译运行

如果要运行demo,可以直接运行命令即可: npm run dev,当然也看直接在线查看。

  1. 集成到项目中

可以将src/componets/easy-cron中的代码直接复制到工程中,就可以直接导入使用。

  1. 支持格式
*    *    *    *    *    *   *
┬    ┬    ┬    ┬    ┬    ┬   ┬
│    │    │    │    │    │   └ year (optional)
│    │    │    │    │    └ day of week (0 - 7) (0 or 7 is Sun)
│    │    │    │    └───── month (1 - 12)
│    │    │    └────────── day of month (1 - 31)
│    │    └─────────────── hour (0 - 23)
│    └──────────────────── minute (0 - 59)
└───────────────────────── second (0 - 59)

星期对应的单词缩写映射关系如下:

'SUN': 0 或 7
'MON': 1
'TUE': 2
'WED': 3
'THU': 4
'FRI': 5
'SAT': 6

使用说明

  1. 快速使用input-cron输入cron表达式组件

直接参考代码如下

import InputCron from './easy-cron/input-cron'
...
<FormItem label="输入组件" prop="cronValue">
  <input-cron type="text" v-model="formData.cronValue1"
    placeholder="请输入cron表达式(http://www.easysb.cn)"/>
</FormItem>
  1. 直接使用easy-cron元组件

直接参考代码如下

import EasyCron from './easy-cron'
...
<FormItem label="原始组件(700px)" prop="cronValue">
  <easy-cron style="width: 700px;"
    v-model="formData.cronValue2"></easy-cron>
</FormItem>
// 可以调整元组件大小
<FormItem label="原始组件(800px)" prop="cronValue">
  <easy-cron style="width: 800px;"
    v-model="formData.cronValue3"></easy-cron>
</FormItem>
  1. 使用cron表达式校验器

直接参考代码如下

<FormItem label="原始组件(800px)" prop="cronValue">
  <easy-cron style="width: 800px;"
    v-model="formData.cronValue3"></easy-cron>
</FormItem>
....
import CronValidator from './easy-cron/validator'
...
data () {
  return {
    msg: 'Cron表达式测试页面',
    formData: {
      ....
      cronValue1: '',
      cronValue2: '4 1/2 5 7-8 1 ?',
      cronValue3: '1 2-4 3/5 3/12 4,5,8 ? *'
    },
    formDataValidator: {
      cronValue: [
        { validator: CronValidator }
      ]
  }
}

参与贡献

  1. Fork 本仓库

参考项目

本组件实现参考以下多位大佬:

如果大侠觉得有用的话,留下大名

image

MIT License Copyright (c) 2019 知行合一 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

这是基于Vue.js和iviewui封装一个crontab表达式的组件,可以方便、快捷直观地定义cron表达式,并支持给定开始时间后的预览执行时间点列表,方便排除错误。 展开 收起
JavaScript
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/xxssyyyyssxx/easy-cron.git
git@gitee.com:xxssyyyyssxx/easy-cron.git
xxssyyyyssxx
easy-cron
easy-cron
master

搜索帮助

14c37bed 8189591 565d56ea 8189591