mirror of
https://github.com/tenrok/vue-cron-editor-bootstrap.git
synced 2026-06-08 17:32:24 +03:00
externals deps
This commit is contained in:
+1
-1
@@ -1,3 +1,3 @@
|
||||
module.exports = {
|
||||
presets: ['@vue/cli-plugin-babel/preset'],
|
||||
presets: ['@vue/cli-plugin-babel/preset'],
|
||||
}
|
||||
|
||||
+10
-3
@@ -1,8 +1,15 @@
|
||||
# http://editorconfig.org
|
||||
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
charset = utf-8
|
||||
indent_style = tab
|
||||
indent_size = 2
|
||||
trim_trailing_whitespace = true
|
||||
|
||||
[*.md]
|
||||
insert_final_newline = false
|
||||
trim_trailing_whitespace = false
|
||||
|
||||
+2
-2
@@ -1,3 +1,3 @@
|
||||
node_modules
|
||||
/demo
|
||||
/dist
|
||||
/demo/
|
||||
/dist/
|
||||
|
||||
+18
-18
@@ -1,22 +1,22 @@
|
||||
const isProduction = process.env.NODE_ENV === 'production'
|
||||
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true,
|
||||
},
|
||||
parserOptions: {
|
||||
parser: '@typescript-eslint/parser',
|
||||
ecmaVersion: 2020,
|
||||
},
|
||||
extends: ['plugin:vue/recommended', 'eslint:recommended', '@vue/typescript/recommended', 'plugin:prettier/recommended'],
|
||||
rules: {
|
||||
curly: 'warn',
|
||||
'no-console': isProduction ? 'error' : 'off',
|
||||
'no-debugger': isProduction ? 'error' : 'off',
|
||||
'vue/max-attributes-per-line': 'off',
|
||||
'vue/singleline-html-element-content-newline': 'off',
|
||||
'@typescript-eslint/no-explicit-any': 'off',
|
||||
'@typescript-eslint/no-non-null-assertion': 'off',
|
||||
},
|
||||
root: true,
|
||||
env: {
|
||||
node: true,
|
||||
},
|
||||
parserOptions: {
|
||||
parser: '@typescript-eslint/parser',
|
||||
ecmaVersion: 2020,
|
||||
},
|
||||
extends: ['plugin:vue/recommended', 'eslint:recommended', '@vue/typescript/recommended', 'plugin:prettier/recommended'],
|
||||
rules: {
|
||||
curly: 'warn',
|
||||
'no-console': isProduction ? 'error' : 'off',
|
||||
'no-debugger': isProduction ? 'error' : 'off',
|
||||
'vue/max-attributes-per-line': 'off',
|
||||
'vue/singleline-html-element-content-newline': 'off',
|
||||
'@typescript-eslint/no-explicit-any': 'off',
|
||||
'@typescript-eslint/no-non-null-assertion': 'off',
|
||||
},
|
||||
}
|
||||
|
||||
+9
-6
@@ -1,9 +1,12 @@
|
||||
// https://prettier.io/docs/en/options.html
|
||||
|
||||
module.exports = {
|
||||
arrowParens: 'avoid',
|
||||
printWidth: 140,
|
||||
semi: false,
|
||||
singleQuote: true,
|
||||
useTabs: true,
|
||||
/** @type {import("prettier").Config} */
|
||||
const config = {
|
||||
arrowParens: 'avoid',
|
||||
printWidth: 180,
|
||||
semi: false,
|
||||
singleQuote: true,
|
||||
vueIndentScriptAndStyle: true,
|
||||
}
|
||||
|
||||
module.exports = config
|
||||
|
||||
Vendored
+6
-2
@@ -1,3 +1,7 @@
|
||||
{
|
||||
"recommendations": ["editorconfig.editorconfig", "esbenp.prettier-vscode"]
|
||||
}
|
||||
"recommendations": [
|
||||
"editorconfig.editorconfig",
|
||||
"esbenp.prettier-vscode",
|
||||
"octref.vetur"
|
||||
]
|
||||
}
|
||||
Vendored
+19
-8
@@ -1,9 +1,20 @@
|
||||
{
|
||||
"editor.fontFamily": "'Fira Code', Consolas, 'Courier New', monospace",
|
||||
"editor.fontLigatures": true,
|
||||
"editor.fontWeight": "400",
|
||||
"editor.foldingStrategy": "indentation",
|
||||
"editor.formatOnSave": true,
|
||||
"editor.rulers": [140],
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||
}
|
||||
"editor.fontFamily": "'Fira Code', Consolas, 'Courier New', monospace",
|
||||
"editor.fontLigatures": true,
|
||||
"editor.fontWeight": "400",
|
||||
"editor.foldingStrategy": "indentation",
|
||||
"editor.formatOnSave": true,
|
||||
"editor.rulers": [
|
||||
180
|
||||
],
|
||||
"editor.defaultFormatter": "octref.vetur",
|
||||
"[json]": {
|
||||
"editor.defaultFormatter": "vscode.json-language-features"
|
||||
},
|
||||
"[jsonc]": {
|
||||
"editor.defaultFormatter": "vscode.json-language-features"
|
||||
},
|
||||
"[vue]": {
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||
}
|
||||
}
|
||||
@@ -25,17 +25,17 @@ npm install @tenrok/vue-cron-editor-bootstrap --save
|
||||
|
||||
```
|
||||
<template>
|
||||
<VueCronEditorBootstrap v-model="cronExpression" />
|
||||
<VueCronEditor v-model="cronExpression" />
|
||||
{{cronExpression}}
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import VueCronEditorBootstrap from '@tenrok/vue-cron-editor-bootstrap';
|
||||
import VueCronEditor from '@tenrok/vue-cron-editor-bootstrap';
|
||||
|
||||
export default {
|
||||
name: 'App',
|
||||
components: {
|
||||
VueCronEditorBootstrap
|
||||
VueCronEditor
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -57,7 +57,7 @@ To preserve expression on switch to **advanced** tab set the `preserveStateOnSwi
|
||||
The language of the component can be selected with the `locale` prop.
|
||||
|
||||
```
|
||||
<VueCronEditorBootstrap
|
||||
<VueCronEditor
|
||||
v-model="expression"
|
||||
locale="pl"
|
||||
/>
|
||||
@@ -71,7 +71,7 @@ Currently supported languages:
|
||||
Custom locales can be provided via a `customLocales` prop:
|
||||
|
||||
```
|
||||
<VueCronEditorBootstrap
|
||||
<VueCronEditor
|
||||
v-model="expression"
|
||||
locale="test"
|
||||
:custom-locales="{
|
||||
|
||||
@@ -0,0 +1,152 @@
|
||||
<template>
|
||||
<b-tabs v-model="activeTabIndex" content-class="p-2" @input="reset">
|
||||
<b-tab :value="0" :title="translate('minutes')" class="minutes-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-1">{{ translate('every') }}</span>
|
||||
<b-form-input v-model="editorData.minuteInterval" type="number" min="1" max="59" class="mr-1" style="width: 80px" />
|
||||
<span>{{ translate('mminutes') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="1" :title="translate('hourly')" class="hourly-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-1">{{ translate('every') }}</span>
|
||||
<b-form-input v-model="editorData.hourInterval" type="number" min="1" max="24" class="mr-1" style="width: 80px" />
|
||||
<span class="mr-1">{{ translate('hoursOnMinute') }}</span>
|
||||
<b-form-input v-model="editorData.minutes" type="number" min="0" max="59" style="width: 80px" />
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="2" :title="translate('daily')" class="daily-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-1">{{ translate('every') }}</span>
|
||||
<b-form-input v-model="editorData.dayInterval" type="number" class="mr-1" style="width: 80px" />
|
||||
<span class="mr-1">{{ translate('daysAt') }}</span>
|
||||
<b-form-timepicker :value="dateTime" :hour12="false" now-button style="width: auto" @input="setDateTime" />
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="3" :title="translate('weekly')" class="weekly-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-3">{{ translate('onlyOn') }}</span>
|
||||
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="0" class="mr-3">{{ translate('sun') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="1" class="mr-3">{{ translate('mon') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="2" class="mr-3">{{ translate('tue') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="3" class="mr-3">{{ translate('wed') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="4" class="mr-3">{{ translate('thu') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="5" class="mr-3">{{ translate('fri') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="6" class="mr-3">{{ translate('sat') }}</b-form-checkbox> -->
|
||||
|
||||
<div v-for="(a, idx) in uids" :key="`${a[0]}`" class="mr-3 custom-control custom-checkbox">
|
||||
<input :id="`${a[1]}`" v-model="editorData.days" type="checkbox" class="custom-control-input" :value="`${idx}`" />
|
||||
<label class="custom-control-label" :for="`${a[1]}`">{{ translate(a[0]) }}</label>
|
||||
</div>
|
||||
|
||||
<span class="mr-1">{{ translate('at') }}</span>
|
||||
<b-form-timepicker :value="dateTime" :hour12="false" now-button style="width: auto" @input="setDateTime" />
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="4" :title="translate('monthly')" class="monthly-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-1">{{ translate('onThe') }}</span>
|
||||
<b-form-input v-model="editorData.day" type="number" min="1" max="31" class="mr-1" style="width: 80px" />
|
||||
<span class="mr-1">{{ translate('dayOfEvery') }}</span>
|
||||
<b-form-input v-model="editorData.monthInterval" type="number" min="1" class="mr-1" style="width: 80px" />
|
||||
<span class="mr-1">{{ translate('monthsAt') }}</span>
|
||||
<b-form-timepicker :value="dateTime" :hour12="false" now-button style="width: auto" @input="setDateTime" />
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="5" :title="translate('advanced')" class="advanced-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-2">{{ translate('cronExpression') }}</span>
|
||||
<b-form-input v-model="editorData.cronExpression" class="mr-2" style="width: auto" />
|
||||
<span>{{ explanation }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
</b-tabs>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import VueCronEditorMixin from '../core/vueCronEditorMixin'
|
||||
import { BTabs, BTab, BFormInput, BFormTimepicker } from '@tenrok/bootstrap-vue'
|
||||
import { TabKey } from 'lib/core/cronExpressions'
|
||||
|
||||
interface Tab {
|
||||
idx: number
|
||||
key: string
|
||||
}
|
||||
|
||||
interface Data {
|
||||
activeTabIndex?: number
|
||||
tabs: Tab[]
|
||||
uids: string[][]
|
||||
}
|
||||
|
||||
export default VueCronEditorMixin.extend({
|
||||
components: {
|
||||
BTabs,
|
||||
BTab,
|
||||
BFormInput,
|
||||
BFormTimepicker,
|
||||
},
|
||||
|
||||
data(): Data {
|
||||
return {
|
||||
activeTabIndex: undefined,
|
||||
tabs: [
|
||||
{ idx: 0, key: 'minutes' },
|
||||
{ idx: 1, key: 'hourly' },
|
||||
{ idx: 2, key: 'daily' },
|
||||
{ idx: 3, key: 'weekly' },
|
||||
{ idx: 4, key: 'monthly' },
|
||||
{ idx: 5, key: 'advanced' },
|
||||
],
|
||||
uids: ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'].map(x => [x, crypto.randomUUID()]),
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
dateTime() {
|
||||
return `${this.editorData.hours}:${this.editorData.minutes}:00`
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
currentTab() {
|
||||
this.activeTabIndex = this.tabs.find(t => t.key === this.currentTab)?.idx
|
||||
},
|
||||
},
|
||||
|
||||
created() {
|
||||
this.activeTabIndex = this.tabs.find(t => t.key === this.currentTab)?.idx
|
||||
},
|
||||
|
||||
methods: {
|
||||
reset(tabIndex: number) {
|
||||
const tab = this.tabs.find(t => t.idx === tabIndex)
|
||||
if (tab) {
|
||||
this.resetToTab(tab.key as TabKey)
|
||||
}
|
||||
},
|
||||
|
||||
setDateTime(time: string) {
|
||||
if (time == null) {
|
||||
return
|
||||
}
|
||||
const splittedTime = time.split(':')
|
||||
this.editorData.hours = splittedTime[0]
|
||||
this.editorData.minutes = splittedTime[1]
|
||||
},
|
||||
},
|
||||
})
|
||||
</script>
|
||||
@@ -1,141 +0,0 @@
|
||||
<template>
|
||||
<b-tabs v-model="activeTabIndex" content-class="p-2" @input="reset">
|
||||
<b-tab :value="0" :title="translate('minutes')" class="minutes-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-1">{{ translate('every') }}</span>
|
||||
<b-form-input v-model="editorData.minuteInterval" type="number" min="1" max="59" class="mr-1" style="width: 80px" />
|
||||
<span>{{ translate('mminutes') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="1" :title="translate('hourly')" class="hourly-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-1">{{ translate('every') }}</span>
|
||||
<b-form-input v-model="editorData.hourInterval" type="number" min="1" max="24" class="mr-1" style="width: 80px" />
|
||||
<span class="mr-1">{{ translate('hoursOnMinute') }}</span>
|
||||
<b-form-input v-model="editorData.minutes" type="number" min="0" max="59" style="width: 80px" />
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="2" :title="translate('daily')" class="daily-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-1">{{ translate('every') }}</span>
|
||||
<b-form-input v-model="editorData.dayInterval" type="number" class="mr-1" style="width: 80px" />
|
||||
<span class="mr-1">{{ translate('daysAt') }}</span>
|
||||
<b-form-timepicker :value="dateTime" :hour12="false" now-button style="width: auto" @input="setDateTime" />
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="3" :title="translate('weekly')" class="weekly-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-3">{{ translate('onlyOn') }}</span>
|
||||
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="0" class="mr-3">{{ translate('sun') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="1" class="mr-3">{{ translate('mon') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="2" class="mr-3">{{ translate('tue') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="3" class="mr-3">{{ translate('wed') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="4" class="mr-3">{{ translate('thu') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="5" class="mr-3">{{ translate('fri') }}</b-form-checkbox> -->
|
||||
<!-- <b-form-checkbox v-model="editorData.days" value="6" class="mr-3">{{ translate('sat') }}</b-form-checkbox> -->
|
||||
<div v-for="(a, idx) in uids" :key="`${a[0]}`" class="mr-3 custom-control custom-checkbox">
|
||||
<input :id="`${a[1]}`" v-model="editorData.days" type="checkbox" class="custom-control-input" :value="`${idx}`" />
|
||||
<label class="custom-control-label" :for="`${a[1]}`">{{ translate(a[0]) }}</label>
|
||||
</div>
|
||||
|
||||
<span class="mr-1">{{ translate('at') }}</span>
|
||||
<b-form-timepicker :value="dateTime" :hour12="false" now-button style="width: auto" @input="setDateTime" />
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="4" :title="translate('monthly')" class="monthly-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-1">{{ translate('onThe') }}</span>
|
||||
<b-form-input v-model="editorData.day" type="number" min="1" max="31" class="mr-1" style="width: 80px" />
|
||||
<span class="mr-1">{{ translate('dayOfEvery') }}</span>
|
||||
<b-form-input v-model="editorData.monthInterval" type="number" min="1" class="mr-1" style="width: 80px" />
|
||||
<span class="mr-1">{{ translate('monthsAt') }}</span>
|
||||
<b-form-timepicker :value="dateTime" :hour12="false" now-button style="width: auto" @input="setDateTime" />
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :value="5" :title="translate('advanced')" class="advanced-tab">
|
||||
<div class="row">
|
||||
<div class="col d-flex align-items-center">
|
||||
<span class="mr-2">{{ translate('cronExpression') }}</span>
|
||||
<b-form-input v-model="editorData.cronExpression" class="mr-2" style="width: auto" />
|
||||
<span>{{ explanation }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
</b-tabs>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vueCronEditorMixin from '../core/vueCronEditorMixin'
|
||||
import { BTabs, BTab, BFormInput, BFormTimepicker } from '@tenrok/bootstrap-vue'
|
||||
|
||||
export default {
|
||||
name: 'VueCronEditorBootstrap',
|
||||
|
||||
components: {
|
||||
BTabs,
|
||||
BTab,
|
||||
BFormInput,
|
||||
BFormTimepicker,
|
||||
},
|
||||
|
||||
mixins: [vueCronEditorMixin],
|
||||
|
||||
data: () => ({
|
||||
activeTabIndex: null,
|
||||
tabs: [
|
||||
{ idx: 0, key: 'minutes' },
|
||||
{ idx: 1, key: 'hourly' },
|
||||
{ idx: 2, key: 'daily' },
|
||||
{ idx: 3, key: 'weekly' },
|
||||
{ idx: 4, key: 'monthly' },
|
||||
{ idx: 5, key: 'advanced' },
|
||||
],
|
||||
uids: ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'].map(x => [x, crypto.randomUUID()]),
|
||||
}),
|
||||
|
||||
computed: {
|
||||
dateTime() {
|
||||
return `${this.editorData.hours}:${this.editorData.minutes}:00`
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
currentTab() {
|
||||
this.activeTabIndex = this.tabs.find(t => t.key === this.currentTab).idx
|
||||
},
|
||||
},
|
||||
|
||||
created() {
|
||||
this.activeTabIndex = this.tabs.find(t => t.key === this.currentTab).idx
|
||||
},
|
||||
|
||||
methods: {
|
||||
reset(tabIndex) {
|
||||
const tab = this.tabs.find(t => t.idx === tabIndex)
|
||||
if (tab) {
|
||||
this.resetToTab(tab.key)
|
||||
}
|
||||
},
|
||||
|
||||
setDateTime(time) {
|
||||
if (time == null) {
|
||||
return
|
||||
}
|
||||
const splittedTime = time.split(':')
|
||||
this.editorData.hours = splittedTime[0]
|
||||
this.editorData.minutes = splittedTime[1]
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
+106
-112
@@ -1,151 +1,145 @@
|
||||
interface MinutesTabUpdatedEvent {
|
||||
type: 'minutes'
|
||||
minuteInterval: number
|
||||
type: 'minutes'
|
||||
minuteInterval: number
|
||||
}
|
||||
|
||||
interface HourlyTabUpdatedEvent {
|
||||
type: 'hourly'
|
||||
minutes: number
|
||||
hourInterval: number
|
||||
type: 'hourly'
|
||||
minutes: number
|
||||
hourInterval: number
|
||||
}
|
||||
|
||||
interface DailyTabUpdatedEvent {
|
||||
type: 'daily'
|
||||
minutes: number
|
||||
hours: number
|
||||
dayInterval: number
|
||||
type: 'daily'
|
||||
minutes: number
|
||||
hours: number
|
||||
dayInterval: number
|
||||
}
|
||||
|
||||
interface WeeklyTabUpdatedEvent {
|
||||
type: 'weekly'
|
||||
minutes: number
|
||||
hours: number
|
||||
days: string[]
|
||||
type: 'weekly'
|
||||
minutes: number
|
||||
hours: number
|
||||
days: string[]
|
||||
}
|
||||
|
||||
interface MonthlyTabUpdatedEvent {
|
||||
type: 'monthly'
|
||||
minutes: number
|
||||
hours: number
|
||||
day: number
|
||||
monthInterval: number
|
||||
type: 'monthly'
|
||||
minutes: number
|
||||
hours: number
|
||||
day: number
|
||||
monthInterval: number
|
||||
}
|
||||
|
||||
interface AdvancedTabUpdatedEvent {
|
||||
type: 'advanced'
|
||||
cronExpression: string
|
||||
type: 'advanced'
|
||||
cronExpression: string
|
||||
}
|
||||
|
||||
export type TabUpdatedEvent =
|
||||
| MinutesTabUpdatedEvent
|
||||
| HourlyTabUpdatedEvent
|
||||
| DailyTabUpdatedEvent
|
||||
| WeeklyTabUpdatedEvent
|
||||
| MonthlyTabUpdatedEvent
|
||||
| AdvancedTabUpdatedEvent
|
||||
export type TabUpdatedEvent = MinutesTabUpdatedEvent | HourlyTabUpdatedEvent | DailyTabUpdatedEvent | WeeklyTabUpdatedEvent | MonthlyTabUpdatedEvent | AdvancedTabUpdatedEvent
|
||||
|
||||
export type TabKey = TabUpdatedEvent[keyof TabUpdatedEvent]
|
||||
|
||||
export const buildExpression = (event: TabUpdatedEvent): string => {
|
||||
if (event.type === 'minutes') {
|
||||
return `*/${event.minuteInterval} * * * *`
|
||||
}
|
||||
if (event.type === 'minutes') {
|
||||
return `*/${event.minuteInterval} * * * *`
|
||||
}
|
||||
|
||||
if (event.type === 'hourly') {
|
||||
return `${event.minutes} */${event.hourInterval} * * *`
|
||||
}
|
||||
if (event.type === 'hourly') {
|
||||
return `${event.minutes} */${event.hourInterval} * * *`
|
||||
}
|
||||
|
||||
if (event.type === 'daily') {
|
||||
return `${event.minutes} ${event.hours} */${event.dayInterval} * *`
|
||||
}
|
||||
if (event.type === 'daily') {
|
||||
return `${event.minutes} ${event.hours} */${event.dayInterval} * *`
|
||||
}
|
||||
|
||||
if (event.type === 'weekly') {
|
||||
if ([0, 7].includes(event.days.length)) {
|
||||
return `${event.minutes} ${event.hours} * * *`
|
||||
} else {
|
||||
return (
|
||||
`${event.minutes} ${event.hours} * * ` +
|
||||
`${event.days
|
||||
.filter(d => d)
|
||||
.sort()
|
||||
.join()}`
|
||||
)
|
||||
}
|
||||
}
|
||||
if (event.type === 'weekly') {
|
||||
if ([0, 7].includes(event.days.length)) {
|
||||
return `${event.minutes} ${event.hours} * * *`
|
||||
} else {
|
||||
return (
|
||||
`${event.minutes} ${event.hours} * * ` +
|
||||
`${event.days
|
||||
.filter(d => d)
|
||||
.sort()
|
||||
.join()}`
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
if (event.type === 'monthly') {
|
||||
return `${event.minutes} ${event.hours} ${event.day} */${event.monthInterval} *`
|
||||
}
|
||||
if (event.type === 'monthly') {
|
||||
return `${event.minutes} ${event.hours} ${event.day} */${event.monthInterval} *`
|
||||
}
|
||||
|
||||
if (event.type === 'advanced') {
|
||||
return event.cronExpression
|
||||
}
|
||||
if (event.type === 'advanced') {
|
||||
return event.cronExpression
|
||||
}
|
||||
|
||||
throw `unknown event type: ${event}`
|
||||
throw `unknown event type: ${event}`
|
||||
}
|
||||
|
||||
export const parseExpression = (expression: string): TabUpdatedEvent => {
|
||||
let groups = null
|
||||
let groups: RegExpMatchArray | null
|
||||
|
||||
if (expression!.split(' ').length != 5) {
|
||||
return {
|
||||
type: 'advanced',
|
||||
cronExpression: expression,
|
||||
}
|
||||
}
|
||||
if (expression!.split(' ').length != 5) {
|
||||
return {
|
||||
type: 'advanced',
|
||||
cronExpression: expression,
|
||||
}
|
||||
}
|
||||
|
||||
if ((groups = expression.match(/^\*\/(\d+) \* \* \* \*$/))) {
|
||||
return {
|
||||
type: 'minutes',
|
||||
minuteInterval: Number(groups[1]),
|
||||
}
|
||||
}
|
||||
if ((groups = expression.match(/^\*\/(\d+) \* \* \* \*$/))) {
|
||||
return {
|
||||
type: 'minutes',
|
||||
minuteInterval: Number(groups[1]),
|
||||
}
|
||||
}
|
||||
|
||||
if ((groups = expression.match(/^(\d+) \*\/(\d+) \* \* \*$/))) {
|
||||
return {
|
||||
type: 'hourly',
|
||||
minutes: Number(groups[1]),
|
||||
hourInterval: Number(groups[2]),
|
||||
}
|
||||
}
|
||||
if ((groups = expression.match(/^(\d+) \*\/(\d+) \* \* \*$/))) {
|
||||
return {
|
||||
type: 'hourly',
|
||||
minutes: Number(groups[1]),
|
||||
hourInterval: Number(groups[2]),
|
||||
}
|
||||
}
|
||||
|
||||
if ((groups = expression.match(/^(\d+) (\d+) \*\/(\d+) \* \*$/))) {
|
||||
return {
|
||||
type: 'daily',
|
||||
minutes: Number(groups[1]),
|
||||
hours: Number(groups[2]),
|
||||
dayInterval: Number(groups[3]),
|
||||
}
|
||||
}
|
||||
if ((groups = expression.match(/^(\d+) (\d+) \*\/(\d+) \* \*$/))) {
|
||||
return {
|
||||
type: 'daily',
|
||||
minutes: Number(groups[1]),
|
||||
hours: Number(groups[2]),
|
||||
dayInterval: Number(groups[3]),
|
||||
}
|
||||
}
|
||||
|
||||
if ((groups = expression.match(/^(\d+) (\d+) \* \* (\d)(,\d)?(,\d)?(,\d)?(,\d)?(,\d)?(,\d)?$/))) {
|
||||
const optionalDaysBeginIndex = 4
|
||||
const matchesEndIndex = 10
|
||||
return {
|
||||
type: 'weekly',
|
||||
minutes: Number(groups[1]),
|
||||
hours: Number(groups[2]),
|
||||
days: [groups[3]].concat(
|
||||
groups
|
||||
.slice(optionalDaysBeginIndex, matchesEndIndex)
|
||||
.map(d => d && d.replace(/,/, ''))
|
||||
.filter(d => d)
|
||||
),
|
||||
}
|
||||
}
|
||||
if ((groups = expression.match(/^(\d+) (\d+) \* \* (\d)(,\d)?(,\d)?(,\d)?(,\d)?(,\d)?(,\d)?$/))) {
|
||||
const optionalDaysBeginIndex = 4
|
||||
const matchesEndIndex = 10
|
||||
return {
|
||||
type: 'weekly',
|
||||
minutes: Number(groups[1]),
|
||||
hours: Number(groups[2]),
|
||||
days: [groups[3]].concat(
|
||||
groups
|
||||
.slice(optionalDaysBeginIndex, matchesEndIndex)
|
||||
.map(d => d && d.replace(/,/, ''))
|
||||
.filter(d => d)
|
||||
),
|
||||
}
|
||||
}
|
||||
|
||||
if ((groups = expression.match(/^(\d+) (\d+) (\d+) \*\/(\d+) \*$/))) {
|
||||
return {
|
||||
type: 'monthly',
|
||||
minutes: Number(groups[1]),
|
||||
hours: Number(groups[2]),
|
||||
day: Number(groups[3]),
|
||||
monthInterval: Number(groups[4]),
|
||||
}
|
||||
}
|
||||
if ((groups = expression.match(/^(\d+) (\d+) (\d+) \*\/(\d+) \*$/))) {
|
||||
return {
|
||||
type: 'monthly',
|
||||
minutes: Number(groups[1]),
|
||||
hours: Number(groups[2]),
|
||||
day: Number(groups[3]),
|
||||
monthInterval: Number(groups[4]),
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
type: 'advanced',
|
||||
cronExpression: expression,
|
||||
}
|
||||
return {
|
||||
type: 'advanced',
|
||||
cronExpression: expression,
|
||||
}
|
||||
}
|
||||
|
||||
+58
-58
@@ -1,63 +1,63 @@
|
||||
export const defaultLocales: Record<string, Record<string, string>> = {
|
||||
en: {
|
||||
every: 'Every',
|
||||
mminutes: 'minute(s)',
|
||||
hoursOnMinute: 'hour(s) on minute',
|
||||
daysAt: 'day(s) at',
|
||||
at: 'at',
|
||||
onThe: 'On the',
|
||||
dayOfEvery: 'day, of every',
|
||||
monthsAt: 'month(s), at',
|
||||
// everyDay: 'Every',
|
||||
mon: 'Mon',
|
||||
tue: 'Tue',
|
||||
wed: 'Wed',
|
||||
thu: 'Thu',
|
||||
fri: 'Fri',
|
||||
sat: 'Sat',
|
||||
sun: 'Sun',
|
||||
// hasToBeBetween: 'Has to be between',
|
||||
// and: 'and',
|
||||
minutes: 'MINUTES',
|
||||
hourly: 'HOURLY',
|
||||
daily: 'DAILY',
|
||||
weekly: 'WEEKLY',
|
||||
monthly: 'MONTHLY',
|
||||
advanced: 'ADVANCED',
|
||||
cronExpression: 'cron expression:',
|
||||
onlyOn: 'Only on',
|
||||
},
|
||||
pl: {
|
||||
every: 'Co',
|
||||
mminutes: 'minut',
|
||||
hoursOnMinute: 'godzin w minucie',
|
||||
daysAt: 'dni o',
|
||||
at: 'o',
|
||||
onThe: '',
|
||||
dayOfEvery: 'dzień miesiąca, co',
|
||||
monthsAt: 'miesięcy, o godzinie',
|
||||
// everyDay: 'W każdy',
|
||||
mon: 'Pon',
|
||||
tue: 'Wt',
|
||||
wed: 'Śr',
|
||||
thu: 'Czw',
|
||||
fri: 'Pt',
|
||||
sat: 'So',
|
||||
sun: 'Nie',
|
||||
// hasToBeBetween: 'Wymagana wartość pomiędzy',
|
||||
// and: 'i',
|
||||
minutes: 'Minuty',
|
||||
hourly: 'Godziny',
|
||||
daily: 'Dni',
|
||||
weekly: 'Tygodnie',
|
||||
monthly: 'Miesiące',
|
||||
advanced: 'Zaawansowane',
|
||||
cronExpression: 'Wyrażenie cron:',
|
||||
onlyOn: 'Co',
|
||||
},
|
||||
en: {
|
||||
every: 'Every',
|
||||
mminutes: 'minute(s)',
|
||||
hoursOnMinute: 'hour(s) on minute',
|
||||
daysAt: 'day(s) at',
|
||||
at: 'at',
|
||||
onThe: 'On the',
|
||||
dayOfEvery: 'day, of every',
|
||||
monthsAt: 'month(s), at',
|
||||
// everyDay: 'Every',
|
||||
mon: 'Mon',
|
||||
tue: 'Tue',
|
||||
wed: 'Wed',
|
||||
thu: 'Thu',
|
||||
fri: 'Fri',
|
||||
sat: 'Sat',
|
||||
sun: 'Sun',
|
||||
// hasToBeBetween: 'Has to be between',
|
||||
// and: 'and',
|
||||
minutes: 'MINUTES',
|
||||
hourly: 'HOURLY',
|
||||
daily: 'DAILY',
|
||||
weekly: 'WEEKLY',
|
||||
monthly: 'MONTHLY',
|
||||
advanced: 'ADVANCED',
|
||||
cronExpression: 'cron expression:',
|
||||
onlyOn: 'Only on',
|
||||
},
|
||||
pl: {
|
||||
every: 'Co',
|
||||
mminutes: 'minut',
|
||||
hoursOnMinute: 'godzin w minucie',
|
||||
daysAt: 'dni o',
|
||||
at: 'o',
|
||||
onThe: '',
|
||||
dayOfEvery: 'dzień miesiąca, co',
|
||||
monthsAt: 'miesięcy, o godzinie',
|
||||
// everyDay: 'W każdy',
|
||||
mon: 'Pon',
|
||||
tue: 'Wt',
|
||||
wed: 'Śr',
|
||||
thu: 'Czw',
|
||||
fri: 'Pt',
|
||||
sat: 'So',
|
||||
sun: 'Nie',
|
||||
// hasToBeBetween: 'Wymagana wartość pomiędzy',
|
||||
// and: 'i',
|
||||
minutes: 'Minuty',
|
||||
hourly: 'Godziny',
|
||||
daily: 'Dni',
|
||||
weekly: 'Tygodnie',
|
||||
monthly: 'Miesiące',
|
||||
advanced: 'Zaawansowane',
|
||||
cronExpression: 'Wyrażenie cron:',
|
||||
onlyOn: 'Co',
|
||||
},
|
||||
}
|
||||
|
||||
export function createI18n(customLocales: Record<string, Record<string, string>>, locale: string): Record<string, string> {
|
||||
const allLocales = { ...defaultLocales, ...customLocales }
|
||||
return allLocales[locale]
|
||||
const allLocales = { ...defaultLocales, ...customLocales }
|
||||
return allLocales[locale]
|
||||
}
|
||||
|
||||
+119
-119
@@ -12,143 +12,143 @@ import { createI18n } from './i18n'
|
||||
import Vue from 'vue'
|
||||
|
||||
const initialData: Record<TabKey, TabUpdatedEvent> = {
|
||||
minutes: {
|
||||
type: 'minutes',
|
||||
minuteInterval: 1,
|
||||
},
|
||||
hourly: {
|
||||
type: 'hourly',
|
||||
minutes: 0,
|
||||
hourInterval: 1,
|
||||
},
|
||||
daily: {
|
||||
type: 'daily',
|
||||
minutes: 0,
|
||||
hours: 0,
|
||||
dayInterval: 1,
|
||||
},
|
||||
weekly: {
|
||||
type: 'weekly',
|
||||
minutes: 0,
|
||||
hours: 0,
|
||||
days: ['1'],
|
||||
},
|
||||
monthly: {
|
||||
type: 'monthly',
|
||||
hours: 0,
|
||||
minutes: 0,
|
||||
day: 1,
|
||||
monthInterval: 1,
|
||||
},
|
||||
advanced: {
|
||||
type: 'advanced',
|
||||
cronExpression: '',
|
||||
},
|
||||
minutes: {
|
||||
type: 'minutes',
|
||||
minuteInterval: 1,
|
||||
},
|
||||
hourly: {
|
||||
type: 'hourly',
|
||||
minutes: 0,
|
||||
hourInterval: 1,
|
||||
},
|
||||
daily: {
|
||||
type: 'daily',
|
||||
minutes: 0,
|
||||
hours: 0,
|
||||
dayInterval: 1,
|
||||
},
|
||||
weekly: {
|
||||
type: 'weekly',
|
||||
minutes: 0,
|
||||
hours: 0,
|
||||
days: ['1'],
|
||||
},
|
||||
monthly: {
|
||||
type: 'monthly',
|
||||
hours: 0,
|
||||
minutes: 0,
|
||||
day: 1,
|
||||
monthInterval: 1,
|
||||
},
|
||||
advanced: {
|
||||
type: 'advanced',
|
||||
cronExpression: '',
|
||||
},
|
||||
}
|
||||
|
||||
interface ComponentData {
|
||||
editorData: any
|
||||
currentTab: TabKey
|
||||
innerValue: string | null
|
||||
i18n: Record<string, string> | null
|
||||
editorData: any
|
||||
currentTab: TabKey
|
||||
innerValue: string | null
|
||||
i18n: Record<string, string> | null
|
||||
}
|
||||
|
||||
export default Vue.extend({
|
||||
props: {
|
||||
value: { type: String, default: '*/1 * * * *' },
|
||||
isAdvancedTabVisible: { type: Boolean, default: true },
|
||||
preserveStateOnSwitchToAdvanced: { type: Boolean, default: false },
|
||||
locale: { type: String, default: 'en' },
|
||||
customLocales: { type: Object, default: null },
|
||||
},
|
||||
props: {
|
||||
value: { type: String, default: '*/1 * * * *' },
|
||||
isAdvancedTabVisible: { type: Boolean, default: true },
|
||||
preserveStateOnSwitchToAdvanced: { type: Boolean, default: false },
|
||||
locale: { type: String, default: 'en' },
|
||||
customLocales: { type: Object, default: null },
|
||||
},
|
||||
|
||||
data() {
|
||||
return <ComponentData>{
|
||||
innerValue: '*/1 * * * *',
|
||||
editorData: Object.assign({}, initialData.minutes),
|
||||
currentTab: 'minutes',
|
||||
i18n: null,
|
||||
}
|
||||
},
|
||||
data(): ComponentData {
|
||||
return {
|
||||
innerValue: '*/1 * * * *',
|
||||
editorData: Object.assign({}, initialData.minutes),
|
||||
currentTab: 'minutes',
|
||||
i18n: null,
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
explanation(): string {
|
||||
if (!this.innerValue) {
|
||||
return ''
|
||||
}
|
||||
computed: {
|
||||
explanation(): string {
|
||||
if (!this.innerValue) {
|
||||
return ''
|
||||
}
|
||||
|
||||
return (cronstrue as any).toString(this.innerValue, {
|
||||
locale: this.locale,
|
||||
})
|
||||
},
|
||||
},
|
||||
return (cronstrue as any).toString(this.innerValue, {
|
||||
locale: this.locale,
|
||||
})
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
value: {
|
||||
handler() {
|
||||
if (this.value == this.innerValue) {
|
||||
return
|
||||
}
|
||||
this.loadDataFromExpression()
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
value: {
|
||||
handler() {
|
||||
if (this.value == this.innerValue) {
|
||||
return
|
||||
}
|
||||
this.loadDataFromExpression()
|
||||
},
|
||||
},
|
||||
|
||||
editorData: {
|
||||
deep: true,
|
||||
handler(changedData) {
|
||||
this.updateCronExpression(changedData)
|
||||
},
|
||||
},
|
||||
},
|
||||
editorData: {
|
||||
deep: true,
|
||||
handler(changedData) {
|
||||
this.updateCronExpression(changedData)
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
created() {
|
||||
this.i18n = createI18n(this.customLocales, this.locale)
|
||||
this.innerValue = this.value
|
||||
this.loadDataFromExpression()
|
||||
},
|
||||
created() {
|
||||
this.i18n = createI18n(this.customLocales, this.locale)
|
||||
this.innerValue = this.value
|
||||
this.loadDataFromExpression()
|
||||
},
|
||||
|
||||
methods: {
|
||||
translate(key: string) {
|
||||
return this.i18n![key]
|
||||
},
|
||||
methods: {
|
||||
translate(key: string) {
|
||||
return this.i18n![key]
|
||||
},
|
||||
|
||||
loadDataFromExpression() {
|
||||
const tabData = parseExpression(this.value)
|
||||
this.editorData = { ...tabData }
|
||||
this.currentTab = tabData.type
|
||||
},
|
||||
loadDataFromExpression() {
|
||||
const tabData = parseExpression(this.value)
|
||||
this.editorData = { ...tabData }
|
||||
this.currentTab = tabData.type
|
||||
},
|
||||
|
||||
updateCronExpression(event: TabUpdatedEvent) {
|
||||
const cronExpression = buildExpression({ ...event })
|
||||
updateCronExpression(event: TabUpdatedEvent) {
|
||||
const cronExpression = buildExpression({ ...event })
|
||||
|
||||
if (cronValidator.isValidCron(cronExpression)) {
|
||||
this.innerValue = cronExpression
|
||||
this.$emit('input', cronExpression)
|
||||
} else {
|
||||
this.innerValue = null
|
||||
this.$emit('input', null)
|
||||
}
|
||||
},
|
||||
if (cronValidator.isValidCron(cronExpression)) {
|
||||
this.innerValue = cronExpression
|
||||
this.$emit('input', cronExpression)
|
||||
} else {
|
||||
this.innerValue = null
|
||||
this.$emit('input', null)
|
||||
}
|
||||
},
|
||||
|
||||
resetToTab(tabKey: TabKey) {
|
||||
this.currentTab = tabKey
|
||||
resetToTab(tabKey: TabKey) {
|
||||
this.currentTab = tabKey
|
||||
|
||||
if (this.preserveStateOnSwitchToAdvanced && tabKey === 'advanced') {
|
||||
this.editorData = {
|
||||
type: 'advanced',
|
||||
cronExpression: this.innerValue,
|
||||
}
|
||||
return
|
||||
}
|
||||
if (this.preserveStateOnSwitchToAdvanced && tabKey === 'advanced') {
|
||||
this.editorData = {
|
||||
type: 'advanced',
|
||||
cronExpression: this.innerValue,
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
const tabData = parseExpression(this.value)
|
||||
if (tabKey == tabData.type) {
|
||||
this.editorData = Object.assign({}, tabData)
|
||||
return
|
||||
}
|
||||
const tabData = parseExpression(this.value)
|
||||
if (tabKey == tabData.type) {
|
||||
this.editorData = Object.assign({}, tabData)
|
||||
return
|
||||
}
|
||||
|
||||
this.editorData = Object.assign({}, initialData[tabKey])
|
||||
this.updateCronExpression(initialData[tabKey])
|
||||
},
|
||||
},
|
||||
this.editorData = Object.assign({}, initialData[tabKey])
|
||||
this.updateCronExpression(initialData[tabKey])
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
+11
-14
@@ -1,18 +1,15 @@
|
||||
import _Vue from 'vue'
|
||||
import VueCronEditorBootstrap from './components/VueCronEditorBootstrap.vue'
|
||||
import { VueConstructor, PluginObject } from 'vue'
|
||||
import VueCronEditor from './components/VueCronEditor.vue'
|
||||
|
||||
const components = [VueCronEditorBootstrap]
|
||||
const components: { [key: string]: VueConstructor } = { VueCronEditor }
|
||||
|
||||
class CronEditorPluginOptions {}
|
||||
|
||||
type CronEditorPlugin = {
|
||||
install(vue: typeof _Vue, options?: CronEditorPluginOptions): void
|
||||
const VueCronEditorPlugin: PluginObject<any> = {
|
||||
install(Vue) {
|
||||
for (const key in components) {
|
||||
Vue.component(key, components[key])
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
const instance: CronEditorPlugin = {
|
||||
install(vue) {
|
||||
components.forEach(component => vue.component(component.name, component))
|
||||
},
|
||||
}
|
||||
|
||||
export default instance
|
||||
export default VueCronEditor
|
||||
export { VueCronEditor, VueCronEditorPlugin }
|
||||
|
||||
Generated
+20141
-20113
File diff suppressed because it is too large
Load Diff
+58
-56
@@ -1,57 +1,59 @@
|
||||
{
|
||||
"name": "@tenrok/vue-cron-editor-bootstrap",
|
||||
"version": "0.2.3",
|
||||
"homepage": "https://github.com/tenrok/vue-cron-editor-bootstrap",
|
||||
"bugs": {
|
||||
"url": "https://github.com/tenrok/vue-cron-editor-bootstrap/issues"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/tenrok/vue-cron-editor-bootstrap.git"
|
||||
},
|
||||
"license": "MIT",
|
||||
"author": {
|
||||
"name": "alexmfreitas",
|
||||
"url": "https://github.com/alexmfreitas"
|
||||
},
|
||||
"contributors": [
|
||||
{
|
||||
"name": "Sergey Solodyagin",
|
||||
"url": "https://github.com/solodyagin"
|
||||
}
|
||||
],
|
||||
"main": "dist/vue-cron-editor-bootstrap.umd.min.js",
|
||||
"files": [
|
||||
"dist/vue-cron-editor-bootstrap.*"
|
||||
],
|
||||
"scripts": {
|
||||
"build": "vue-cli-service build --target lib --name vue-cron-editor-bootstrap lib/index.ts",
|
||||
"demo:build": "vue-cli-service build",
|
||||
"lint": "vue-cli-service lint --fix",
|
||||
"serve": "vue-cli-service serve --open"
|
||||
},
|
||||
"dependencies": {
|
||||
"bootstrap": "^4.6.0",
|
||||
"core-js": "^3.29.0",
|
||||
"cron-validator": "^1.3.1",
|
||||
"cronstrue": "^2.14.0",
|
||||
"vue": "^2.7.14",
|
||||
"@tenrok/bootstrap-vue": "^2.23.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@typescript-eslint/eslint-plugin": "^5.50.0",
|
||||
"@typescript-eslint/parser": "^5.50.0",
|
||||
"@vue/cli-plugin-babel": "^5.0.8",
|
||||
"@vue/cli-plugin-eslint": "^5.0.8",
|
||||
"@vue/cli-plugin-typescript": "^5.0.8",
|
||||
"@vue/cli-service": "^5.0.8",
|
||||
"@vue/eslint-config-typescript": "^11.0.2",
|
||||
"eslint": "^8.33.0",
|
||||
"eslint-config-prettier": "^8.6.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-vue": "^9.17.0",
|
||||
"prettier": "^2.8.8",
|
||||
"typescript": "^4.9.5",
|
||||
"vue-template-compiler": "^2.7.14"
|
||||
}
|
||||
}
|
||||
"name": "@tenrok/vue-cron-editor-bootstrap",
|
||||
"version": "0.3.0",
|
||||
"homepage": "https://github.com/tenrok/vue-cron-editor-bootstrap",
|
||||
"bugs": {
|
||||
"url": "https://github.com/tenrok/vue-cron-editor-bootstrap/issues"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/tenrok/vue-cron-editor-bootstrap.git"
|
||||
},
|
||||
"license": "MIT",
|
||||
"author": {
|
||||
"name": "alexmfreitas",
|
||||
"url": "https://github.com/alexmfreitas"
|
||||
},
|
||||
"contributors": [
|
||||
{
|
||||
"name": "Sergey Solodyagin",
|
||||
"url": "https://github.com/solodyagin"
|
||||
}
|
||||
],
|
||||
"main": "dist/vue-cron-editor-bootstrap.umd.min.js",
|
||||
"files": [
|
||||
"dist/vue-cron-editor-bootstrap.*"
|
||||
],
|
||||
"scripts": {
|
||||
"build": "vue-cli-service build --target lib --name vue-cron-editor-bootstrap lib/index.ts",
|
||||
"demo:build": "vue-cli-service build",
|
||||
"lint": "vue-cli-service lint --fix",
|
||||
"serve": "vue-cli-service serve --open"
|
||||
},
|
||||
"dependencies": {
|
||||
"bootstrap": "^4.6.0",
|
||||
"core-js": "^3.33.1",
|
||||
"cron-validator": "^1.3.1",
|
||||
"cronstrue": "^2.14.0",
|
||||
"vue": "^2.7.15"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@typescript-eslint/eslint-plugin": "^5.62.0",
|
||||
"@typescript-eslint/parser": "^5.62.0",
|
||||
"@vue/cli-plugin-babel": "^5.0.8",
|
||||
"@vue/cli-plugin-eslint": "^5.0.8",
|
||||
"@vue/cli-plugin-typescript": "^5.0.8",
|
||||
"@vue/cli-service": "^5.0.8",
|
||||
"@vue/eslint-config-typescript": "^11.0.3",
|
||||
"eslint": "^8.52.0",
|
||||
"eslint-config-prettier": "^9.0.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-vue": "^9.18.0",
|
||||
"prettier": "^2.8.8",
|
||||
"typescript": "^4.9.5",
|
||||
"vue-template-compiler": "^2.7.15"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@tenrok/bootstrap-vue": "^2.23.2"
|
||||
}
|
||||
}
|
||||
+12
-12
@@ -1,18 +1,18 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<div class="p-3">
|
||||
<vue-cron-editor-bootstrap v-model="sample1CronExpression" preserve-state-on-switch-to-advanced />
|
||||
<b-form-input v-model="sample1CronExpression" readonly />
|
||||
</div>
|
||||
</div>
|
||||
<div id="app">
|
||||
<div class="p-3">
|
||||
<vue-cron-editor v-model="sample1CronExpression" preserve-state-on-switch-to-advanced />
|
||||
<input v-model="sample1CronExpression" class="form-control" type="text" readonly />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'App',
|
||||
export default {
|
||||
name: 'App',
|
||||
|
||||
data: () => ({
|
||||
sample1CronExpression: '4 4 * * 0,2,3,5',
|
||||
}),
|
||||
}
|
||||
data: () => ({
|
||||
sample1CronExpression: '4 4 * * 0,2,3,5',
|
||||
}),
|
||||
}
|
||||
</script>
|
||||
|
||||
+3
-5
@@ -1,16 +1,14 @@
|
||||
import Vue from 'vue'
|
||||
import App from './App.vue'
|
||||
|
||||
import VueCronEditorBootstrap from '../lib'
|
||||
Vue.use(VueCronEditorBootstrap)
|
||||
import { VueCronEditorPlugin } from '../lib'
|
||||
Vue.use(VueCronEditorPlugin)
|
||||
|
||||
import { BFormInput } from '@tenrok/bootstrap-vue'
|
||||
import 'bootstrap/dist/css/bootstrap.css'
|
||||
import '@tenrok/bootstrap-vue/dist/bootstrap-vue.css'
|
||||
Vue.component('BFormInput', BFormInput)
|
||||
|
||||
Vue.config.productionTip = false
|
||||
|
||||
new Vue({
|
||||
render: h => h(App),
|
||||
render: h => h(App),
|
||||
}).$mount('#app')
|
||||
|
||||
Vendored
+2
-2
@@ -1,4 +1,4 @@
|
||||
declare module '*.vue' {
|
||||
import Vue from 'vue'
|
||||
export default Vue
|
||||
import Vue from 'vue'
|
||||
export default Vue
|
||||
}
|
||||
|
||||
+25
-15
@@ -1,16 +1,26 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"baseUrl": ".",
|
||||
"moduleResolution": "node",
|
||||
"outDir": "dist",
|
||||
"removeComments": true,
|
||||
"sourceMap": true,
|
||||
"target": "esnext",
|
||||
"paths": {
|
||||
"@/*": ["src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["lib/**/*.ts", "src/**/*.ts", "src/**/*.vue"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
"compilerOptions": {
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"baseUrl": ".",
|
||||
"moduleResolution": "node",
|
||||
"outDir": "dist",
|
||||
"removeComments": true,
|
||||
"sourceMap": true,
|
||||
"strict": true,
|
||||
"target": "esnext",
|
||||
"paths": {
|
||||
"@/*": [
|
||||
"src/*"
|
||||
]
|
||||
}
|
||||
},
|
||||
"include": [
|
||||
"lib/**/*.ts",
|
||||
"src/**/*.ts",
|
||||
"src/**/*.vue"
|
||||
],
|
||||
"exclude": [
|
||||
"node_modules",
|
||||
"dist"
|
||||
]
|
||||
}
|
||||
+14
-6
@@ -2,10 +2,18 @@ const isProduction = process.env.NODE_ENV === 'production'
|
||||
const isBuildLib = (process.env.npm_lifecycle_script || '').indexOf('--target lib') > 0
|
||||
|
||||
module.exports = {
|
||||
publicPath: isProduction ? '/vue-cron-editor-bootstrap/' : '',
|
||||
outputDir: isBuildLib ? 'dist' : 'demo',
|
||||
css: {
|
||||
extract: true,
|
||||
},
|
||||
productionSourceMap: false,
|
||||
publicPath: isProduction ? '/vue-cron-editor-bootstrap/' : '',
|
||||
outputDir: isBuildLib ? 'dist' : 'demo',
|
||||
css: {
|
||||
extract: true,
|
||||
},
|
||||
productionSourceMap: false,
|
||||
chainWebpack: config => {
|
||||
if (isProduction) {
|
||||
config.externals({
|
||||
'@tenrok/bootstrap-vue': '@tenrok/bootstrap-vue',
|
||||
})
|
||||
// config.merge({ devtool: 'source-map' })
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user