mirrors/vue-cron-editor-bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/vue-cron-editor-bootstrap.git synced 2026-06-05 16:52:25 +03:00
Code Activity

Bootstrap 5 update (#9)

Browse Source 
Co-authored-by: Alex Freitas <afreitas@jbssa.com>
This commit is contained in:
alexmfreitas
2022-09-27 23:55:53 -03:00
committed by GitHub
parent d766f75bbc
commit 42e11a5b93
9 changed files with 33051 additions and 11560 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/vueCronEditorBootstrap.common.js
Vendored
+4740 -5648
View File
File diff suppressed because one or more lines are too long
dist/vueCronEditorBootstrap.common.js.map
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
dist/vueCronEditorBootstrap.umd.js
Vendored
+4740 -5648
View File
File diff suppressed because one or more lines are too long
dist/vueCronEditorBootstrap.umd.js.map
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
dist/vueCronEditorBootstrap.umd.min.js
Vendored
+2 -9
View File
File diff suppressed because one or more lines are too long
dist/vueCronEditorBootstrap.umd.min.js.map
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
package-lock.json
Generated
+23433 -83
View File
File diff suppressed because it is too large Load Diff
package.json
+4 -5
View File
@@ -1,6 +1,6 @@
{
"name": "vue-cron-editor-bootstrap",
"version": "0.1.10",
"version": "0.2.1",
"private": false,
"main": "dist/vueCronEditorBootstrap.umd.js",
"module": "dist/vueCronEditorBootstrap.esm.js",
@@ -34,14 +34,13 @@
"gh-pages": "^2.2.0",
"link-parent-bin": "^1.0.2",
"lint-staged": "^10.2.4",
"node-sass": "^4.14.1",
"prettier": "^1.19.1",
"sass": "^1.26.5",
"sass-loader": "^8.0.0",
"sass": "^1.46.0",
"sass-loader": "^8.0.2",
"standard-version": "^8.0.0",
"typescript": "~3.5.3",
"vue-template-compiler": "^2.6.10",
"bootstrap-vue": "^2.14.0"
"bootstrap-vue": "^2.21.2"
},
"author": "alexmfreitas",
"license": "MIT",
src/VueCronEditorBootstrap.vue
+129 -164
View File
@@ -1,169 +1,143 @@
<template>
<b-tabs v-model="activeTab" @input="reset" content-class="mt-3">
<b-tabs v-model="activeTab" @input="reset" content-class="mt-3 mb-3">
<b-tab :value="0" :title="_$t('minutes')" class="minutes-tab">
<b-form inline>
<label class="mr-sm-2">{{ _$t("every") }}</label>
<b-form-input
type="number"
v-model="editorData.minuteInterval"
v-bind:style="{ width: '80px' }"
/>
<label class="mr-sm-2 ml-sm-2">{{ _$t("mminutes") }}</label>
</b-form>
<div class="row">
<div class="col d-flex" style="align-items: center;">
<label class="me-2">{{ _$t("every") }}</label>
<b-form-input
type="number"
v-model="editorData.minuteInterval"
v-bind:style="{ width: '80px' }"
/>
<label class="me-2 ms-2">{{ _$t("mminutes") }}</label>
</div>
</div>
</b-tab>
<b-tab :value="1" :title="_$t('hourly')" class="hourly-tab">
<b-row>
<b-col size="12">
<b-form inline>
<label class="mr-sm-2">{{ _$t("every") }}</label>
<b-form-input
type="number"
v-model="editorData.hourInterval"
v-bind:style="{ width: '80px' }"
/>
<label class="mr-sm-2 ml-sm-2">{{
_$t("hoursOnMinute")
}}</label>
<b-form-input
type="number"
max="59"
min="0"
v-model="editorData.minutes"
v-bind:style="{ width: '80px' }"
/>
</b-form>
</b-col>
</b-row>
<div class="row">
<div class="col d-flex" style="align-items: center;">
<label class="me-2">{{ _$t("every") }}</label>
<b-form-input
type="number"
v-model="editorData.hourInterval"
v-bind:style="{ width: '80px' }"
/>
<label class="me-2 ms-2">{{
_$t("hoursOnMinute")
}}</label>
<b-form-input
type="number"
max="59"
min="0"
v-model="editorData.minutes"
v-bind:style="{ width: '80px' }"
/>
</div>
</div>
</b-tab>
<b-tab :value="2" :title="_$t('daily')" class="daily-tab">
<b-row>
<b-col size="12">
<b-form inline>
<label class="mr-sm-2">{{ _$t("every") }}</label>
<b-form-input
type="number"
v-model="editorData.dayInterval"
v-bind:style="{ width: '80px' }"
/>
<label class="mr-sm-2 ml-sm-2">{{
_$t("daysAt")
}}</label>
<b-form-timepicker
:value="dateTime"
:hour12="false"
@input="setDateTime"
/>
</b-form>
</b-col>
</b-row>
<div class="row">
<div class="col d-flex" style="align-items: center;">
<label class="me-2">{{ _$t("every") }}</label>
<b-form-input
type="number"
v-model="editorData.dayInterval"
v-bind:style="{ width: '80px' }"
/>
<label class="me-2 ms-2">{{
_$t("daysAt")
}}</label>
<b-form-timepicker
:value="dateTime"
:hour12="false"
@input="setDateTime"
style="width: auto; display: flex;"
/>
</div>
</div>
</b-tab>
<b-tab :value="3" :title="_$t('weekly')" class="weekly-tab">
<b-row>
<b-col size="12">
<b-form inline>
<label class="mr-sm-2">{{ _$t("every") }}</label>
<b-form-checkbox
value="0"
class="mr-sm-2"
v-model="editorData.days"
switch
>{{ _$t("sun") }}</b-form-checkbox
>
<b-form-checkbox
value="1"
class="mr-sm-2"
v-model="editorData.days"
switch
>{{ _$t("mon") }}</b-form-checkbox
>
<b-form-checkbox
value="2"
class="mr-sm-2"
v-model="editorData.days"
switch
>{{ _$t("tue") }}</b-form-checkbox
>
<b-form-checkbox
value="3"
class="mr-sm-2"
v-model="editorData.days"
switch
>{{ _$t("wed") }}</b-form-checkbox
>
<b-form-checkbox
value="4"
class="mr-sm-2"
v-model="editorData.days"
switch
>{{ _$t("thu") }}</b-form-checkbox
>
<b-form-checkbox
value="5"
class="mr-sm-2"
v-model="editorData.days"
switch
>{{ _$t("fri") }}</b-form-checkbox
>
<b-form-checkbox
value="6"
v-model="editorData.days"
switch
>{{ _$t("sat") }}</b-form-checkbox
>
<label class="mr-sm-2 ml-sm-2">{{ _$t("at") }}</label>
<b-form-timepicker
:value="dateTime"
@input="setDateTime"
:hour12="false"
/>
</b-form>
</b-col>
</b-row>
<div class="row">
<div class="col d-flex" style="align-items: center;">
<label class="me-2">{{ _$t("every") }}</label>
<div class="form-check form-switch me-2">
<input :id="`toggle-editor-0`" type="checkbox" class="form-check-input" value="0" v-model="editorData.days">
<label class="form-check-label" :for="`toggle-editor-0`">{{ _$t("sun") }}</label>
</div>
<div class="form-check form-switch me-2">
<input :id="`toggle-editor-1`" type="checkbox" class="form-check-input" value="1" v-model="editorData.days">
<label class="form-check-label" :for="`toggle-editor-1`">{{ _$t("mon") }}</label>
</div>
<div class="form-check form-switch me-2">
<input :id="`toggle-editor-2`" type="checkbox" class="form-check-input" value="2" v-model="editorData.days">
<label class="form-check-label" :for="`toggle-editor-2`">{{ _$t("tue") }}</label>
</div>
<div class="form-check form-switch me-2">
<input :id="`toggle-editor-3`" type="checkbox" class="form-check-input" value="3" v-model="editorData.days">
<label class="form-check-label" :for="`toggle-editor-3`">{{ _$t("wed") }}</label>
</div>
<div class="form-check form-switch me-2">
<input :id="`toggle-editor-4`" type="checkbox" class="form-check-input" value="4" v-model="editorData.days">
<label class="form-check-label" :for="`toggle-editor-4`">{{ _$t("thu") }}</label>
</div>
<div class="form-check form-switch me-2">
<input :id="`toggle-editor-5`" type="checkbox" class="form-check-input" value="5" v-model="editorData.days">
<label class="form-check-label" :for="`toggle-editor-5`">{{ _$t("fri") }}</label>
</div>
<div class="form-check form-switch me-2">
<input :id="`toggle-editor-6`" type="checkbox" class="form-check-input" value="6" v-model="editorData.days">
<label class="form-check-label" :for="`toggle-editor-6`">{{ _$t("sat") }}</label>
</div>
<label class="me-2">{{ _$t("at") }}</label>
<b-form-timepicker
:value="dateTime"
@input="setDateTime"
:hour12="false"
style="width: auto; display: flex;"
/>
</div>
</div>
</b-tab>
<b-tab :value="4" :title="_$t('monthly')" class="monthly-tab">
<b-row>
<b-col size="12">
<b-form inline>
<label class="mr-sm-2">{{ _$t("onThe") }}</label>
<b-form-input
type="number"
v-model="editorData.day"
v-bind:style="{ width: '80px' }"
/>
<label class="mr-sm-2 ml-sm-2">{{
_$t("dayOfEvery")
}}</label>
<b-form-input
type="number"
v-model="editorData.monthInterval"
v-bind:style="{ width: '80px' }"
/><label class="mr-sm-2 ml-sm-2">{{
_$t("monthsAt")
}}</label>
<b-form-timepicker
:value="dateTime"
@input="setDateTime"
:hour12="false"
/>
</b-form>
</b-col>
</b-row>
<div class="row">
<div class="col d-flex" style="align-items: center;">
<label class="me-2">{{ _$t("onThe") }}</label>
<b-form-input
type="number"
v-model="editorData.day"
v-bind:style="{ width: '80px' }"
/>
<label class="me-2 ms-2">{{
_$t("dayOfEvery")
}}</label>
<b-form-input
type="number"
v-model="editorData.monthInterval"
v-bind:style="{ width: '80px' }"
/><label class="me-2 ms-2">{{
_$t("monthsAt")
}}</label>
<b-form-timepicker
:value="dateTime"
@input="setDateTime"
:hour12="false"
style="width: auto; display: flex;"
/>
</div>
</div>
</b-tab>
<b-tab :value="4" :title="_$t('advanced')" class="advanced-tab">
<b-row>
<b-col size="12">
<b-form inline>
<label class="mr-sm-2">{{
_$t("cronExpression")
}}</label>
<b-form-input v-model="editorData.cronExpression" />
<label class="mr-sm-2 ml-sm-2">
{{ explanation }}
</label>
</b-form>
</b-col>
</b-row>
<div class="row">
<div class="col d-flex" style="align-items: center;">
<label class="me-2">{{
_$t("cronExpression")
}}</label>
<b-form-input v-model="editorData.cronExpression" style="width:auto"/>
<label class="me-2 ms-2">
{{ explanation }}
</label>
</div>
</div>
</b-tab>
</b-tabs>
</template>
@@ -173,13 +147,8 @@ import vueCronEditorMixin from "./core/vueCronEditorMixin";
import {
BTabs,
BTab,
BForm,
BFormInput,
BFormTimepicker,
BFormCheckbox,
BCol,
BRow,
BContainer
} from "bootstrap-vue";
export default {
@@ -187,13 +156,9 @@ export default {
mixins: [vueCronEditorMixin],
components: {
BFormInput,
BForm,
BTabs,
BTab,
BCol,
BRow,
BFormTimepicker,
BFormCheckbox
BFormTimepicker
},
data: () => ({
activeTab: null,