BUGFIX: tags were not always parsed

assets/js/job/Utils.js

@@ -0,0 +1,12 @@
+let Utils = {};
+
+Utils.initTags = () =>  {
+    document.querySelectorAll('.tag').forEach(elem => {
+        let backcolor = elem.dataset.backgroundColor;
+        let frontcolor = elem.dataset.color;
+        elem.style.backgroundColor = backcolor;
+        elem.style.color = frontcolor;
+    })
+}
+
+export default Utils;

assets/js/job/add.js

@@ -3,6 +3,7 @@ import moment from 'moment';
 import * as tempusDominus from '@eonasdan/tempus-dominus/dist/js/tempus-dominus';
 import momentparse from './momentjs-parse';
 import '/assets/scss/job/add.scss';
+import Utils from "./Utils";
 
 document.addEventListener("readystatechange", event => {
     if(event.target.readyState === 'complete') {
@@ -14,6 +15,7 @@ document.addEventListener("readystatechange", event => {
         initRangeInput();
         initIntervalPattern();
         initEternalCheckbox();
+        Utils.initTags();
     }
 });
 

assets/js/job/index.js

@@ -1,23 +1,16 @@
 import {Modal} from 'bootstrap';
 import image from '/assets/images/ajax-loader.gif'
 import '/assets/scss/job/index.scss';
+import Utils from "./Utils";
 
 document.addEventListener("readystatechange", event => {
     if(event.target.readyState === 'complete') {
         initDeleteButtons();
         initRunNowButtons();
-        initTags();
+        Utils.initTags();
     }
 });
 
-function initTags() {
-    document.querySelectorAll('.tag').forEach(elem => {
-        let backcolor = elem.dataset.backgroundColor;
-        let frontcolor = elem.dataset.color;
-        elem.style.backgroundColor = backcolor;
-        elem.style.color = frontcolor;
-    })
-}
 function initDeleteButtons() {
     document.querySelectorAll('.delete-btn').forEach(elem => elem.addEventListener("click", event => {
         let me = event.currentTarget;

assets/js/job/view.js

@@ -1,17 +1,9 @@
 import 'bootstrap';
 import '/assets/scss/job/view.scss';
+import Utils from "./Utils";
 
 document.addEventListener("readystatechange", event => {
     if(event.target.readyState === 'complete') {
-        initTags();
+        Utils.initTags();
     }
-});
-
-function initTags() {
-    document.querySelectorAll('.tag').forEach(elem => {
-        let backcolor = elem.dataset.backgroundColor;
-        let frontcolor = elem.dataset.color;
-        elem.style.backgroundColor = backcolor;
-        elem.style.color = frontcolor;
-    })
-}
+});

assets/scss/job/add.scss

@@ -1,4 +1,9 @@
 @import "assets/scss/base";
 @import "assets/scss/icons";
 @import "/node_modules/@eonasdan/tempus-dominus/dist/css/tempus-dominus.css";
-@import "assets/scss/tempus-dominus-dark";
+@import "assets/scss/tempus-dominus-dark";
+
+.tag {
+ display: inline-block;
+ padding: 0 1em;
+}