vue-cron-builder

vue-cron-builder

Simple vue component to generate cron expression This package is developed using same logic in React cron generator

Getting Started

Package helps to build linux scheduler cron expression.

Make sure you have include bootstrap(4.x) in your project.

data = '* * * * * * *'

npm install vue-cron-builder

demo

Live demo

import css or create your own css for style

import 'vue-cron-builder/dist/cron.css'; 

<template>
  <Cron showResultCron="true" :cron="cron" showResultText="true" @cron-change="valChanged"/>
</template>

<script>
import Cron from 'vue-cron-builder'
import 'vue-cron-builder/dist/cron.css';

export default {
  name: 'App',
  components: {
    Cron
  },
  data() {
    return {
      cron : '0 0 4 ? * MON *',
    }
  },
  methods: {
    valChanged(val) {
      this.cron = val
    }
  },
}
</script>

props

Prop	Description	Default	Mandatory
cron	cron expression		No
cron-change			Yes
showResultText	show in readable text format	false	No
showResultCron	show cron expression	false	No
translation	translation object	default translation(en)	No
locale	locale for cronstrue	en	No
options	Options for Cron component, *Must pass a valid cron value for available headers	All available headers	No

translation

Expects a method. Use this prop for localization support. vue-cron-builder will use this values for every key. List of keys are available here

locale option should be set for correct ResultText translation. Please visit cronstrue for supported locales.

Options

options.headers

import HEADER  from 'vue-cron-builder/dist/header';

const options = {
  headers: [HEADER.MONTHLY, HEADER.WEEKLY, HEADER.MINUTES, HEADER.HOURLY, HEADER.DAILY, HEADER.CUSTOM]
};

Sojin Antony

Acknowledgments

cronstrue