Feature/10 add rates in export url

src/components/JehMaker.vue

@@ -131,11 +131,12 @@
     <div class="ui container">
       <button class="ui primary button" @click="newPhase">Nouvelle phase</button>
     </div>
+    <Taux v-model="taux" />
   </div>
 </template>
 
 <script lang="ts">
-import { Component, Prop, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch } from 'vue-property-decorator'
 
 // import DistributionChart from './DistributionChart'
 import DistributionChart from '../chart/ReadingChart.vue'
@@ -144,16 +145,15 @@ import Phase from './Phase.vue'
 import Consultants from './Consultant.vue'
 import Frais from './Frais.vue'
 import ProjetsSidebar from './ProjetsSidebar.vue'
+import Taux from './Taux.vue'
 import MargesDetails from './MargesDetails.vue'
 import { round, utf8ToB64, b64ToUtf8 } from '../utils'
 
 @Component({
-  components: { Phase, DistributionChart, Consultants, MargesDetails, Frais, ProjetsSidebar }
+  components: { Phase, DistributionChart, Consultants, MargesDetails, Frais, Taux, ProjetsSidebar }
 })
 export default class JehMaker extends Vue {
-  @Prop({ required: true }) taux!: TauxObject;
-
-  // Data
+  taux:TauxObject = new TauxObject()
   projectName:string = '';
   phases: PhaseObject[] = []
   totalPrice:number = 0
@@ -195,11 +195,12 @@ export default class JehMaker extends Vue {
     }
   }
 
-  get saveObject () : { projectName: string, phases: PhaseObject[], fee: number } {
+  get saveObject () : { projectName: string, phases: PhaseObject[], fee: number, taux: TauxObject } {
     return {
       projectName: this.projectName,
       phases: this.phases,
-      fee: this.fee
+      fee: this.fee,
+      taux: this.taux
     }
   }
 
@@ -251,11 +252,19 @@ export default class JehMaker extends Vue {
     this.projectName = project.projectName
     this.phases = project.phases
     this.fee = project.fee
+    this.taux = new TauxObject(
+      project.taux.urssafBase,
+      project.taux.jeContrib,
+      project.taux.jepay,
+      project.taux.consultantContrib,
+      project.taux.consultantPay
+    )
 
     if (project.id) {
       this.id = project.id
     }
     this.closeProjectSidebar()
+    this.calculate()
   }
 
   newPhase () {

src/components/Phase.vue

@@ -70,7 +70,6 @@ import MultipleSelect from './MultipleSelect.vue'
 export default class Phase extends Vue {
   // Props
   @Prop() private phase!: PhaseObject
-  @Prop() private contributions!: any
   // @Prop() private consultants!: string[]
   @Prop() private taux!: TauxObject
 
@@ -114,6 +113,11 @@ export default class Phase extends Vue {
     this.update('margin')
   }
 
+  @Watch('taux', { deep: true })
+  WatchTaux () {
+    this.calculate()
+  }
+
   // Methods
   update (name: string) {
     let val = this.toInt(this[name])

src/components/Taux.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div v-if="value">
     <sui-button @click.native="toggle">Afficher les taux</sui-button>
     <sui-modal v-model="open">
       <sui-modal-header>Taux</sui-modal-header>
@@ -13,9 +13,9 @@
             </tr>
           </thead>
           <tbody>
-              <tr v-for="label in Object.keys(content)" v-bind:key="label">
+              <tr v-for="label in Object.keys(value)" v-bind:key="label">
                   <td>{{description[label]}}</td>
-                  <td><sui-input class="w-100" v-model="content[label]" @input="handleInput" type="text"/></td>
+                  <td><sui-input class="w-100" v-model="value[label]" @input="handleInput" type="number"/></td>
               </tr>
           </tbody>
         </table>
@@ -38,7 +38,7 @@ import { TauxObject } from '../types'
 export default class Taux extends Vue {
   @Prop() value!:TauxObject
 
-  content:TauxObject = this.value
+  // Data
   open:boolean = false;
   description = {
     urssafBase: 'Base URSSAF',
@@ -48,12 +48,13 @@ export default class Taux extends Vue {
     consultantPay: 'Part Etudiant : Total des taux des cotisations indexées sur la rémunération brute'
   }
 
+  // Methods
   toggle () {
     this.open = !this.open
   }
 
   handleInput (e) {
-    this.$emit('input', this.content)
+    this.$emit('input', this.value)
   }
 }
 </script>

src/views/Home.vue

@@ -4,8 +4,7 @@
   <div class="home ui vertical stripe segment">
       <button @click="toogleSibebar" id="btn__sidebar--open" class="btnmenu"><i class="info circle icon"/></button>
       <h1 is="sui-header">JEH Maker</h1>
-      <JehMaker :taux="taux"/>
-      <Taux v-model="taux" />
+      <JehMaker/>
   </div>
     <div id="footer" class="ui inverted  footer segment">
       Fait avec ♥ par <a href="https://idesys.org">IdéSYS</a>
@@ -14,21 +13,17 @@
 </template>
 
 <script lang="ts">
-import { PhaseObject, TauxObject } from '../types'
 import { Component, Vue } from 'vue-property-decorator'
 import JehMaker from '@/components/JehMaker.vue' // @ is an alias to /src
-import Taux from '@/components/Taux.vue' // @ is an alias to /src
 import Sidebar from '@/components/Sidebar.vue' // @ is an alias to /src
 
 @Component({
   components: {
     JehMaker,
-    Taux,
     Sidebar
   }
 })
 export default class Home extends Vue {
-  taux:TauxObject = new TauxObject()
   v:boolean = false
 
   toogleSibebar () {

tests/unit/components/JehMaker.spec.ts

@@ -80,6 +80,7 @@ describe('JehMaker.vue', () => {
     wrapper.vm.loadProject({
       projectName: 'projet Toto',
       phases: [],
+      taux: {},
       fee: 123,
       id: 32
     })