abichinger / vue-js-cron

Renderless Vue.js cron editor
MIT License
74 stars 23 forks source link

Restricting the minute field options to every 15 mins #8

Closed charlie-litchfield-red closed 2 years ago

charlie-litchfield-red commented 2 years ago

Hi @abichinger, I was wondering whether it is possible to restrict the minutes field to every 15 minutes. I have used the following code for the minuteItems:

const minuteItems = () => {
        let res = []
        for(let i of cronVuetify.util.range(0, 59, 15)) {
            const item = {
                text: cronVuetify.util.pad(i, 2),
                alt: i+'',
                value: i
            }
            res.push(item)
        }
        return res
    }

However, this results in the dropdown for the minutes menu looking like the following image Despite this, the correct numbers (0, 15, 30, 45) are inputted into the cron expression when the corresponding option is clicked.

I was also wondering whether there is a minimum time period property, perhaps that can be added to the validation?

Any advice on resolving this would be much appreciated.

abichinger commented 2 years ago

Hello @charlie-litchfield-red, thank you for giving my cron component a shot :)

I was able to reproduce the error on my end and found out that part of the number is hidden. This is caused by v-list-item, which sets the css property overflow to hidden.

866174ba2e7fe713d4e7fb7dd0a05feaf0671307 should fix this issue for vue v3. Please let me know if it works for you.

In addition it is now required to import vuetify.css

import '@vue-js-cron/vuetify/dist/vuetify.css'
charlie-litchfield-red commented 2 years ago

Thank you very much for looking at this. All is now working as expected