Feat: default month and list display

src/components/CreateMonth.vue

@@ -1,25 +1,41 @@
 <template>
-<form id="new-month">
+<div class="month-presentation" id="new-month">
-<h3> Nouveau mois </h3>
+  <div class="date">
-<input type="month">
+  <input type="month" v-model="monthDate">
+  </div>
+  <div class="infos">
     <month-form></month-form>
-</form>
+  </div>
+  <div class="actions">
+    <button> Valider </button>
+    <button> Annuler </button>
+  </div>
+</div>
 </template>
 
 <script>
 import MonthForm from "./MonthForm"
+
+const today = new Date();
+function formatDate(date) {
+    var y = ''+date.getFullYear()
+    var m = ''+(date.getMonth()+1)
+    if (m.length < 2) { m = '0'+m}
+    return [y, m].join('-')
+}
+
 export default {
   name: 'NewMonth',
+  props: {
+  },
   components: {
       MonthForm: MonthForm,
   },
   data () {
       return {
-            monthDate: "2021/07",
+            monthDate: formatDate(today),
           }
   },
-  props: {
-  },
   computed: {
   },
 }

src/components/MonthForm.vue

@@ -1,24 +1,31 @@
 <template>
 <form>
+<ul>
+    <li>
     <label for="ca-theo">CA théorique</label>
     <input type="number" id="ca-theo">
-
+    </li>
+    <li>
     <label for="ca-retro">CA au moment de la rétrocession</label>
     <input type="number" id="ca-retro">
-
+    </li>
+    <li>
     <label for="ca-react">CA réactualisé</label>
     <input type="number" id="ca-react">
-
+    </li>
+    <li>
     <label for="nbr-seance">Nombre de séances</label>
     <input type="number" id="nbr-seance">
-
+    </li>
+    <li>
     <label for="retro">Montant de la rétrocession</label>
     <input type="number" id="retro">
-
+    </li>
+    <li>
     <label for="remumeration">Rémunération effectuée</label>
     <input type="number" id="remumeration">
-
+    </li>
-
+</ul>
 </form>
 </template>
 
@@ -30,7 +37,7 @@ export default {
   },
   computed: {
     ...mapGetters({
-        empty: "travail/empty_month",
+        TheEmpty: "travail/TheEmptyMonth",
     })
   },
 }