platypush/platypush
platypush
/
platypush
2
2
Fork 4
Code Issues 41 Pull Requests Packages Projects 4 Releases Wiki Activity

`CronEditor` should contain the raw cron expression and a copy button.

This commit is contained in:
Fabio Manganiello 2023-12-11 22:18:57 +01:00
parent 00694f4e10
commit 6e7c5def2f
Signed by: blacklight
GPG Key ID: D90FBA7F76362774
1 changed files with 32 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
platypush/backend/http/webapp/src/components/elements/CronEditor.vue
View File

@ -13,18 +13,28 @@
</label> </label>
</div> </div>
<div class="cron-description"> <div class="cron-description-container">
<div class="error" v-if="error" v-text="error" /> <div class="error" v-if="error" v-text="error" />
<div v-else>Runs: <span v-text="cronDescription" /></div> <div class="cron-description" v-else>
<CopyButton :text="cronString" />
<div class="cron-string" v-text="cronString" />
<div class="cron-next-run" v-if="!error">
Runs: <span class="cron-text" v-text="cronDescription" />
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import cronstrue from 'cronstrue' import cronstrue from 'cronstrue'
import CopyButton from "@/components/elements/CopyButton"
export default { export default {
emits: ['input'], emits: ['input'],
components: {
CopyButton,
},
props: { props: {
value: { value: {
type: String, type: String,
@ -38,6 +48,7 @@ export default {
cronDescription: null, cronDescription: null,
error: null, error: null,
selectedItem: null, selectedItem: null,
cronRegex: new RegExp('^[0-9*/,-]*$'),
labels: [ labels: [
'Minute', 'Minute',
'Hour', 'Hour',
@ -59,7 +70,7 @@ export default {
handler(newValue, oldValue) { handler(newValue, oldValue) {
newValue.forEach((v, i) => { newValue.forEach((v, i) => {
v = v.trim() v = v.trim()
if (!v.match(/^[0-9\*\/\-,]*$/)) { if (!v.match(this.cronRegex)) {
this.cronExpr[i] = oldValue[i] this.cronExpr[i] = oldValue[i]
} else { } else {
this.cronExpr[i] = v this.cronExpr[i] = v
@ -94,7 +105,7 @@ export default {
return return
} }
if (key.match(/^[0-9\*\/\-,]$/)) { if (key.match(this.cronRegex)) {
return return
} }
@ -160,17 +171,29 @@ export default {
} }
} }
.cron-description { .cron-description-container {
margin-top: 0.5em; margin-top: 0.5em;
padding: 0.25em; padding: 0.5em;
font-size: 0.9em; font-size: 0.9em;
font-weight: bold; font-weight: bold;
background: $code-light-bg; background: $code-dark-bg;
color: $default-fg-2; color: $code-dark-fg;
border-radius: 1em; border-radius: 1em;
border: $default-border-3; border: $default-border-3;
span { .cron-description {
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
}
.cron-string {
font-family: monospace;
font-size: 1.1em;
}
.cron-text {
font-weight: normal; font-weight: normal;
font-style: italic; font-style: italic;
} }