sharedstate for gueltigkeit, mode to set gueltigkeits reflect or ignore or set shared gueltigkeit, add vertragsbestandteil kuendigungsfrist

public/js/apps/vbform/presets.js

@@ -8,6 +8,9 @@ export default [
       label: 'Leer',
       description: 'keine vordefinierten Vertrags- und Gehaltsbestandteile. Alles kann/muss manuell angelegt werden.'
     },
+    data: {
+      dienstverhaeltnisid: null
+    },
     vbs: []
   },
   {
@@ -17,6 +20,11 @@ export default [
       label: 'Neuanlage Standard DV',
       description: 'Standard Dienstvertrag Vorlage'
     },
+    data: {
+      dienstverhaeltnisid: null,
+      unternehmen: 'fhtw',
+      vertragsart_kurzbz: 'echterDV'
+    },
     vbs: [
       {
         type: 'vertragsbestandteilstunden',
@@ -50,6 +58,17 @@ export default [
           homeoffice: true
         }
       },
+      {
+        type: 'vertragsbestandteilkuendigungsfrist',
+        guioptions: {
+          id: uuid.get_uuid(),
+          removable: false
+        },
+        data: {
+          arbeitgeber_frist: 6,
+          arbeitnehmer_frist: 4
+        }
+      },
       {
         type: 'vertragsbestandteilfunktion',
         guioptions: {
@@ -66,6 +85,9 @@ export default [
       label: 'AllIn',
       description: 'AllIn Vertrag'
     },
+    data: {
+      dienstverhaeltnisid: null
+    },
     vbs: [
       {
         type: 'vertragsbestandteilstunden',
@@ -133,6 +155,18 @@ export default [
       "label": "Test Zwischenspeichern",
       "description": "generiertes JSON aus ausgeflltem Formular als POC für das Zwischenspeichern"
     },
+    "data": {
+      "dienstverhaeltnisid": 135,
+      "gueltigkeit": {
+        "guioptions": {
+          "sharedstatemode": "set"
+        },
+        "data": {
+          "gueltig_ab": "01.06.2023",
+          "gueltig_bis": "31.12.2023"
+        }
+      }
+    },
     "vbs": [
       {
         "type": "vertragsbestandteilstunden",
@@ -143,8 +177,13 @@ export default [
         "data": {
           "stunden": "38,5",
           "gueltigkeit": {
-            "gueltig_ab": "01.03.2023",
-            "gueltig_bis": ""
+            "guioptions": {
+              "sharedstatemode": "reflect"
+            },
+            "data": {
+              "gueltig_ab": "01.03.2023",
+              "gueltig_bis": ""
+            }
           }
         },
         "gbs": [
@@ -158,8 +197,13 @@ export default [
               "gehaltstyp": "grund",
               "betrag": "3500",
               "gueltigkeit": {
-                "gueltig_ab": "01.03.2023",
-                "gueltig_bis": ""
+                "guioptions": {
+                  "sharedstatemode": "reflect"
+                },
+                "data": {
+                  "gueltig_ab": "01.03.2023",
+                  "gueltig_bis": ""
+                }
               },
               "valorisierung": true
             }
@@ -177,8 +221,13 @@ export default [
           "azgrelevant": false,
           "homeoffice": true,
           "gueltigkeit": {
-            "gueltig_ab": "01.03.2023",
-            "gueltig_bis": ""
+            "guioptions": {
+              "sharedstatemode": "reflect"
+            },
+            "data": {
+              "gueltig_ab": "01.03.2023",
+              "gueltig_bis": ""
+            }
           }
         }
       },
@@ -194,8 +243,13 @@ export default [
           "freitext": "Es wird AllIn vereinbart.",
           "kuendigungsrelevant": "",
           "gueltigkeit": {
-            "gueltig_ab": "01.03.2023",
-            "gueltig_bis": ""
+            "guioptions": {
+              "sharedstatemode": "reflect"
+            },
+            "data": {
+              "gueltig_ab": "01.03.2023",
+              "gueltig_bis": ""
+            }
           }
         },
         "gbs": [
@@ -209,8 +263,13 @@ export default [
               "gehaltstyp": "zulage",
               "betrag": "500",
               "gueltigkeit": {
-                "gueltig_ab": "01.03.2023",
-                "gueltig_bis": ""
+                "guioptions": {
+                  "sharedstatemode": "reflect"
+                },
+                "data": {
+                  "gueltig_ab": "01.03.2023",
+                  "gueltig_bis": ""
+                }
               },
               "valorisierung": false
             }

public/js/components/vbform/dvaenderung.js

@@ -0,0 +1,23 @@
+import gueltigkeit from './gueltigkeit.js';
+import configurable from '../../mixins/vbform/configurable.js';
+
+export default {
+  template: `
+  <div class="col-7">Aenderung</div>
+    <gueltigkeit ref="gueltigkeit" :initialsharedstatemode="'set'"></gueltigkeit>
+  <div class="col-1">&nbsp;</div>
+  `,
+  components: {
+    'gueltigkeit': gueltigkeit
+  },
+  mixins: [
+    configurable
+  ],
+  methods: {
+    getPayload: function() {
+      return {
+        gueltigkeit: this.$refs.gueltigkeit.getPayload()
+      }
+    }
+  }
+}

public/js/components/vbform/dvneuanlage.js

@@ -0,0 +1,66 @@
+import gueltigkeit from './gueltigkeit.js';
+import configurable from '../../mixins/vbform/configurable.js';
+
+export default {
+  template: `
+  <div class="col-3">
+    <select v-model="unternehmen" class="form-select form-select-sm" aria-label=".form-select-sm example">
+      <option value="" selected disabled>Unternehmen wählen</option>
+      <option value="fhtw">FH Technikum Wien</option>
+      <option value="twacademy">Technikum Wien GmbH</option>
+    </select>
+  </div>
+  <div class="col-3">
+    <select v-model="vertragsart_kurzbz" class="form-select form-select-sm" aria-label=".form-select-sm example">
+      <option value="" selected disabled>Vertragsart wählen</option>
+      <option value="echterDV">Echter DV</option>
+      <option value="freierDV">Freier DV</option>
+      <option value="Gastlektor">Gastlektor</option>
+      <option value="Werkvertrag">Werkvertrag</option>
+      <option value="StudHilfskraft">Stud. Hilfskraft</option>
+    </select>
+  </div>
+  <div class="col-1">&nbsp;</div>
+  <gueltigkeit ref="gueltigkeit" :initialsharedstatemode="'set'"></gueltigkeit>
+  <div class="col-1">&nbsp;</div>
+  `,
+  data: function() {
+    return {
+      'unternehmen': '',
+      'vertragsart_kurzbz': ''
+    }
+  },
+  components: {
+    'gueltigkeit': gueltigkeit
+  },
+  mixins: [
+    configurable
+  ],
+  watch: {
+    config: function() {
+      this.setDataFromConfig();
+    }
+  },
+  methods: {
+    setDataFromConfig: function() {
+      if( this.config?.unternehmen !== undefined ) {
+        this.unternehmen = this.config.unternehmen;
+      } else {
+        this.unternehmen = '';
+      }
+
+      if( this.config?.vertragsart_kurzbz !== undefined ) {
+        this.vertragsart_kurzbz = this.config.vertragsart_kurzbz;
+      } else {
+        this.vertragsart_kurzbz = '';
+      }
+    },
+    getPayload: function() {
+      return {
+        unternehmen: this.unternehmen,
+        vertragsart_kurzbz: this.vertragsart_kurzbz,
+        gueltigkeit: this.$refs.gueltigkeit.getPayload()
+      }
+    }
+  }
+}

public/js/components/vbform/gehaltsbestandteil.js

@@ -24,7 +24,7 @@ export default {
         Valorisierung
       </label>
     </div>
-    <gueltigkeit ref="gueltigkeit"></gueltigkeit>
+    <gueltigkeit ref="gueltigkeit" :config="getgueltigkeit"></gueltigkeit>
     <div class="col-1">
       <button v-if="isremoveable" type="button" class="btn-close btn-sm p-2 float-end" @click="removeGB" aria-label="Close"></button>
     </div>

public/js/components/vbform/gueltigkeit.js

@@ -1,25 +1,117 @@
+import configurable from '../../mixins/vbform/configurable.js';
+import sharedstate from './vbsharedstate.js';
+
 export default {
+  template: `
+  <div class="col-4">
+    <div class="input-group input-group-sm">
+      <input v-model="gueltig_ab" :disabled="isdisabled" @change="gueltigkeitchanged" type="text" class="form-control form-control-sm" placeholder="gültig ab" aria-label="gueltig ab">
+      <span class="input-group-text">&dash;</span>
+      <input v-model="gueltig_bis" :disabled="isdisabled" @change="gueltigkeitchanged" type="text" class="form-control form-control-sm" placeholder="gültig bis" aria-label="gueltig bis">
+      <span class="input-group-text" v-if="(this.sharedstatemode === 'reflect')">
+        <i @click="changesharedstatemode('ignore')" class="fas fa-link"></i>
+      </span>
+      <span class="input-group-text" v-else-if="(this.sharedstatemode === 'ignore')">
+        <i @click="changesharedstatemode('reflect')" class="fas fa-unlink"></i>
+      </span>
+      <span class="input-group-text bg-white border-0" v-else-if="(this.sharedstatemode === 'set')">
+        <i class="fas fa-square text-white"></i>
+      </span>
+    </div>
+  </div>
+  `,
+  props: {
+    'initialsharedstatemode': {
+      type: String,
+      default: 'reflect',
+      validator: function(value) {
+        return ['reflect', 'set', 'ignore'].includes(value);
+      }
+    }
+  },
   data: function() {
     return {
+      sharedstate: sharedstate,
+      sharedstatemode: '',
       gueltig_ab: '',
       gueltig_bis: ''
     }
   },
-  template: `
-  <div class="col-2">
-    <input v-model="gueltig_ab" type="text" class="form-control form-control-sm" placeholder="gültig ab" aria-label="gueltig ab">
-  </div>
-  <div class="col-2">
-    <input v-model="gueltig_bis" type="text" class="form-control form-control-sm" placeholder="gültig bis" aria-label="gueltig bis">
-  </div>
-  `,
   components: {},
+  mixins: [
+    configurable
+  ],
+  created: function() {
+    this.sharedstatemode = this.initialsharedstatemode;
+    this.setDataFromSharedSate();
+    this.setGUIOptionsFromConfig();
+    this.setDataFromConfig();
+  },
+  watch: {
+    'sharedstate.gueltigkeit.gueltig_ab': function() {
+      if( this.sharedstatemode === 'reflect' ) {
+        this.gueltig_ab = this.sharedstate.gueltigkeit.gueltig_ab;
+      }
+    },
+    'sharedstate.gueltigkeit.gueltig_bis': function() {
+      if( this.sharedstatemode === 'reflect' ) {
+        this.gueltig_bis = this.sharedstate.gueltigkeit.gueltig_bis;
+      }
+    },
+  },
   methods: {
+    setDataFromConfig: function() {
+      if( typeof this.config === 'undefined' ) {
+        return;
+      }
+
+      if( typeof this.config.data === 'undefined' ) {
+        return;
+      }
+
+      if( typeof this.config.data.gueltig_ab !== 'undefined' ) {
+        this.gueltig_ab = this.config.data.gueltig_ab;
+      }
+      if( typeof this.config.gueltig_bis !== 'undefined' ) {
+        this.gueltig_bis = this.config.data.gueltig_bis;
+      }
+    },
+    setDataFromSharedSate: function() {
+      if( this.sharedstatemode === 'reflect' ) {
+        this.gueltig_ab = this.sharedstate.gueltigkeit.gueltig_ab;
+        this.gueltig_bis = this.sharedstate.gueltigkeit.gueltig_bis;
+      }
+    },
+    setGUIOptionsFromConfig: function() {
+      if( typeof this.config?.guioptions?.sharedstatemode !== 'undefined' ) {
+        this.sharedstatemode = this.config.guioptions.sharedstatemode;
+      }
+    },
     getPayload: function() {
       return {
-        gueltig_ab: this.gueltig_ab,
-        gueltig_bis: this.gueltig_bis,
+        guioptions: {
+          sharedstatemode: this.sharedstatemode,
+        },
+        data: {
+          gueltig_ab: this.gueltig_ab,
+          gueltig_bis: this.gueltig_bis
+        }
       };
+    },
+    gueltigkeitchanged: function() {
+      if( this.sharedstatemode === 'set' ) {
+        this.sharedstate.gueltigkeit.gueltig_ab = this.gueltig_ab;
+        this.sharedstate.gueltigkeit.gueltig_bis = this.gueltig_bis;
+      }
+    },
+    changesharedstatemode: function(mode) {
+      this.sharedstatemode = mode;
+      this.setDataFromSharedSate();
+    }
+  },
+  computed: {
+    isdisabled: function() {
+      return (this.sharedstatemode === 'reflect');
     }
   }
 }

public/js/components/vbform/presets_chooser.js

@@ -17,7 +17,7 @@ export default {
     </div>
 
     <div class="col-6">
-      <vertragsbestandteilhelper v-bind:preset="selectedpreset" @vbhjsonready="process_json"></vertragsbestandteilhelper>
+      <vertragsbestandteilhelper v-bind:preset="selectedpresetvbs" v-bind:data="selectedpresetdata" @vbhjsonready="process_json"></vertragsbestandteilhelper>
     </div>
 
     <div class="col-4">
@@ -31,7 +31,8 @@ export default {
   data: function() {
     return {
       selectedpresetidx: 0,
-      selectedpreset: [],
+      selectedpresetvbs: [],
+      selectedpresetdata: {},
       vbhjson: ''
     }
   },
@@ -43,7 +44,8 @@ export default {
     selectpreset: function(idx) {
       if( typeof this.presets[idx] !== 'undefined' ) {
         this.seletedpresetidx = idx;
-        this.selectedpreset = this.presets[idx].vbs;
+        this.selectedpresetvbs = this.presets[idx].vbs;
+        this.selectedpresetdata = this.presets[idx].data;
       }
     },
     isactive: function(idx) {

public/js/components/vbform/vbsharedstate.js

@@ -0,0 +1,6 @@
+export default Vue.reactive({
+  gueltigkeit: {
+    gueltig_ab: '',
+    gueltig_bis: ''
+  }
+});

public/js/components/vbform/vertragsbestandteil_freitext.js

@@ -15,7 +15,7 @@ export default {
           <option value="sonstiges">Sonstiges</option>
         </select>
       </div>
-      <gueltigkeit ref="gueltigkeit"></gueltigkeit>
+      <gueltigkeit ref="gueltigkeit" :config="getgueltigkeit"></gueltigkeit>
       <div class="col-1">
         <button v-if="isremoveable" type="button" class="btn-close btn-sm p-2 float-end" @click="removeVB" aria-label="Close"></button>
       </div>

public/js/components/vbform/vertragsbestandteil_funktion.js

@@ -12,7 +12,7 @@ export default {
       <div class="col">
         <input v-model="orget" type="text" class="form-control form-control-sm" placeholder="Organisations-Einheit" aria-label="orget">
       </div>
-      <gueltigkeit ref="gueltigkeit"></gueltigkeit>
+      <gueltigkeit ref="gueltigkeit" :config="getgueltigkeit"></gueltigkeit>
       <div class="col-1">
         <button v-if="isremoveable" type="button" class="btn-close btn-sm p-2 float-end" @click="removeVB" aria-label="Close"></button>
       </div>
@@ -33,9 +33,7 @@ export default {
   data: function () {
     return {
       funktion: '',
-      orget: '',
-      gueltig_ab: '',
-      gueltig_bis: ''
+      orget: ''
     }
   },
   created: function() {

public/js/components/vbform/vertragsbestandteil_kuendigungsfrist.js

@@ -0,0 +1,76 @@
+import gehaltsbestandteilhelper from './gehaltsbestandteilhelper.js';
+import gueltigkeit from './gueltigkeit.js';
+import configurable from '../../mixins/vbform/configurable.js';
+
+export default {
+  template: `
+  <div class="border-bottom py-2 mb-3">
+    <div class="row g-2">
+      <div class="col-3">
+        <div class="input-group input-group-sm mb-3">
+          <input v-model="arbeitgeber_frist" type="text" class="form-control form-control-sm" placeholder="Arbeitgeber Frist" aria-label="arbeitgeber_frist">
+          <span class="input-group-text">Wochen</span>
+        </div>
+      </div>
+      <div class="col-3">
+        <div class="input-group input-group-sm mb-3">
+          <input v-model="arbeitnehmer_frist" type="text" class="form-control form-control-sm" placeholder="Arbeitnehmer Frist" aria-label="arbeitnehmer_frist">
+          <span class="input-group-text">Wochen</span>
+        </div>
+      </div>
+      <div class="col-1">&nbsp;</div>
+      <gueltigkeit ref="gueltigkeit" :config="getgueltigkeit"></gueltigkeit>
+      <div class="col-1">
+        <button v-if="isremoveable" type="button" class="btn-close btn-sm p-2 float-end" @click="removeVB" aria-label="Close"></button>
+      </div>
+    </div>
+  </div>
+  `,
+  components: {
+    'gueltigkeit': gueltigkeit
+  },
+  mixins: [
+    configurable
+  ],
+  emits: {
+    removeVB: null
+  },
+  data: function () {
+    return {
+      arbeitgeber_frist: '',
+      arbeitnehmer_frist: ''
+    }
+  },
+  created: function() {
+    this.setDataFromConfig();
+  },
+  methods: {
+    setDataFromConfig: function() {
+      if( typeof this.config?.data === 'undefined' ) {
+        return;
+      }
+
+      if( typeof this.config.data.arbeitgeber_frist !== 'undefined' ) {
+        this.arbeitgeber_frist = this.config.data.arbeitgeber_frist;
+      }
+
+      if( typeof this.config.data.arbeitnehmer_frist !== 'undefined' ) {
+        this.arbeitnehmer_frist = this.config.data.arbeitnehmer_frist;
+      }
+    },
+    removeVB: function() {
+      this.$emit('removeVB', {id: this.config.guioptions.id});
+    },
+    getPayload: function() {
+      return {
+        type: this.config.type,
+        guioptions: this.config.guioptions,
+        data: {
+          arbeitgeber_frist: this.arbeitgeber_frist,
+          arbeitnehmer_frist: this.arbeitnehmer_frist,
+          gueltigkeit: this.$refs.gueltigkeit.getPayload(),
+        }
+      };
+    }
+  }
+}

public/js/components/vbform/vertragsbestandteil_stunden.js

@@ -13,7 +13,7 @@ export default {
         </div>
       </div>
       <div class="col-4">&nbsp;</div>
-      <gueltigkeit ref="gueltigkeit"></gueltigkeit>
+      <gueltigkeit ref="gueltigkeit" :config="getgueltigkeit"></gueltigkeit>
       <div class="col-1">
         <button v-if="isremoveable" type="button" class="btn-close btn-sm p-2 float-end" @click="removeVB" aria-label="Close"></button>
       </div>
@@ -58,7 +58,7 @@ export default {
         guioptions: this.config.guioptions,
         data: {
           stunden: this.stunden,
-          gueltigkeit: this.$refs.gueltigkeit.getPayload()
+          gueltigkeit: this.$refs.gueltigkeit.getPayload(),
         },
         gbs: this.$refs.gbh.getPayload()
       };

public/js/components/vbform/vertragsbestandteil_zeitaufzeichnung.js

@@ -24,7 +24,7 @@ export default {
         </label>
       </div>
       <div class="col-1 form-check form-control-sm">&nbsp;</div>
-      <gueltigkeit ref="gueltigkeit"></gueltigkeit>
+      <gueltigkeit ref="gueltigkeit" :config="getgueltigkeit"></gueltigkeit>
       <div class="col-1">
         <button v-if="isremoveable" type="button" class="btn-close btn-sm p-2 float-end" @click="removeVB" aria-label="Close"></button>
       </div>
@@ -44,9 +44,7 @@ export default {
     return {
       zeitaufzeichnung: '',
       azgrelevant: '',
-      homeoffice: '',
-      gueltig_ab: '',
-      gueltig_bis: ''
+      homeoffice: ''
     }
   },
   created: function() {

public/js/components/vbform/vertragsbestandteilhelper.js

@@ -2,12 +2,20 @@ import vertragsbestandteilstunden from './vertragsbestandteil_stunden.js';
 import vertragsbestandteilzeitaufzeichnung from './vertragsbestandteil_zeitaufzeichnung.js';
 import vertragsbestandteilfunktion from './vertragsbestandteil_funktion.js';
 import vertragsbestandteilfreitext from './vertragsbestandteil_freitext.js';
+import vertragsbestandteilkuendigungsfrist from './vertragsbestandteil_kuendigungsfrist.js';
 import presetable from '../../mixins/vbform/presetable.js';
 import uuid from '../../helpers/vbform/uuid.js';
+import dvneuanlage from './dvneuanlage.js';
+import dvaenderung from './dvaenderung.js';
+import sharedstate from './vbsharedstate.js';
 
 export default {
   template: `
       <div>
+        <div class="row g-2 py-2 mb-3">
+          <dvaenderung ref="formheader" :config="data" v-if="isaenderung"></dvaenderung>
+          <dvneuanlage ref="formheader" :config="data" v-else=""></dvneuanlage>
+        </div>
         <div class="row py-2 border-bottom mb-3">
           <div class="col">
             <select v-model="vertragsbestandteiltyp" class="form-select form-select-sm" aria-label=".form-select-sm example">
@@ -16,6 +24,7 @@ export default {
               <option value="vertragsbestandteilzeitaufzeichnung">Vertragsbestandteil Zeitaufzeichnung</option>
               <option value="vertragsbestandteilfunktion">Vertragsbestandteil Funktion</option>
               <option value="vertragsbestandteilfreitext">Vertragsbestandteil Freitext</option>
+              <option value="vertragsbestandteilkuendigungsfrist">Vertragsbestandteil Kündigungsfrist</option>
             </select>
           </div>
           <div class="col">
@@ -29,8 +38,12 @@ export default {
           v-bind:config="config" :key="config.guioptions.id" @removeVB="removeVB"></component>
       </div>
   `,
+  props: [
+    'data'
+  ],
   data: function() {
     return {
+      sharedstate: sharedstate,
       vertragsbestandteiltyp: '',
       payload: {
         type: 'formdata',
@@ -43,6 +56,9 @@ export default {
     'vertragsbestandteilzeitaufzeichnung': vertragsbestandteilzeitaufzeichnung,
     'vertragsbestandteilfunktion': vertragsbestandteilfunktion,
     'vertragsbestandteilfreitext': vertragsbestandteilfreitext,
+    'vertragsbestandteilkuendigungsfrist': vertragsbestandteilkuendigungsfrist,
+    'dvneuanlage': dvneuanlage,
+    'dvaenderung': dvaenderung
   },
   mixins: [
     presetable
@@ -82,6 +98,7 @@ export default {
 
       this.payload = {
         type: 'formdata',
+        data: this.$refs.formheader.getPayload(),
         vbs: []
       };
       children.forEach(function(vb) {
@@ -89,6 +106,11 @@ export default {
       });
 
       this.$emit('vbhjsonready', JSON.stringify(this.payload, null, 2));
+    },
+  },
+  computed: {
+    isaenderung: function() {
+      return ((typeof this.data.dienstverhaeltnisid !== 'undefined') && parseInt(this.data.dienstverhaeltnisid) > 0);
     }
   }
 }

public/js/mixins/vbform/configurable.js

@@ -4,11 +4,15 @@ export default {
   ],
   computed: {
     isremoveable: function() {
-      return (typeof this.config.guioptions.removeable === 'undefined')
+      return (this.config?.guioptions?.removeable === undefined)
         ? false : this.config.guioptions.removeable;
     },
     getgehaltsbestandteile: function() {
-      return (typeof this.config.gbs !== 'undefined') ? this.config.gbs : [];
+      return (this.config?.gbs !== undefined) ? this.config.gbs : [];
+    },
+    getgueltigkeit: function() {
+      return (this.config?.data?.gueltigkeit !== undefined)
+        ? this.config.data.gueltigkeit : {};
     }
   }
 }