2424 <input
2525 type =" radio"
2626 value =" expense"
27- name =" transactiontype"
27+ v-validate =" 'required'"
28+ name =" type"
2829 v-model =" transactiontype"
2930 />
3031 <span >Dépense</span >
3334 <input
3435 type =" radio"
3536 value =" income"
36- name =" transactiontype"
37+ v-validate =" 'required'"
38+ name =" type"
3739 v-model =" transactiontype"
3840 />
3941 <span >Revenue</span >
4042 </label >
4143 </div >
44+ <span
45+ v-show =" errors.has('type')"
46+ class =" helper-text text-danger"
47+ >{{ errors.first('type') }}</span >
4248 </div >
4349 <div class =" row" >
4450 <div class =" col-sm-6" >
4551 <div class =" md-form" >
46- <input class =" md-form-control" type =" date" v-model =" transactiondate" />
52+ <input
53+ class =" md-form-control"
54+ name =" date"
55+ v-validate =" 'required'"
56+ type =" date"
57+ v-model =" transactiondate"
58+ />
59+ <span
60+ v-show =" errors.has('date')"
61+ class =" helper-text"
62+ :data-error =" errors.first('date')"
63+ ></span >
4764 </div >
4865 </div >
4966 <div class =" col-sm-6" >
5067 <div class =" md-form" >
51- <input class =" md-form-control" type =" time" v-model =" transactiontime" />
68+ <input
69+ class =" md-form-control"
70+ name =" heure"
71+ v-validate =" 'required'"
72+ type =" time"
73+ v-model =" transactiontime"
74+ />
75+ <span
76+ v-show =" errors.has('heure')"
77+ class =" helper-text"
78+ :data-error =" errors.first('heure')"
79+ ></span >
5280 </div >
5381 </div >
5482 </div >
5583 <div class =" row" >
5684 <div class =" col-sm-6" >
5785 <div class =" md-form" >
58- <select class =" md-form-control" v-model =" transactioncategory" >
59- <option value >Choisir une catégorie</option >
86+ <select
87+ class =" md-form-control"
88+ name =" categorie"
89+ v-validate =" 'required'"
90+ v-model =" transactioncategory"
91+ >
92+ <option >Choisir une catégorie</option >
6093 <option
6194 v-for =" category in sortedTransactionOptions"
6295 v-bind:value =" category.transaction_category_id"
6396 :key =" category.transaction_category_id"
6497 >{{ category.transaction_category_name }}</option >
6598 </select >
6699 </div >
100+ <span
101+ v-show =" errors.has('categorie')"
102+ class =" helper-text"
103+ :data-error =" errors.first('categorie')"
104+ ></span >
67105 </div >
68106 <div class =" col-sm-6" >
69107 <div class =" md-form" >
70108 <input
71109 class =" md-form-control"
72110 type =" text"
111+ name =" montant"
112+ v-validate =" 'required|regex:[1234567890€]'"
73113 @blur =" onBlurHandler"
74114 @focus =" onFocusHandler"
75115 placeholder =" Entrer le montant"
76116 v-model =" transactionamount"
77117 />
78118 </div >
119+ <span
120+ v-show =" errors.has('montant')"
121+ class =" helper-text"
122+ :data-error =" errors.first('montant')"
123+ ></span >
79124 </div >
80125 </div >
81126 <div class =" md-form" >
82- <textarea class =" md-form-control" v-model =" transactiondescription" ></textarea >
127+ <textarea
128+ class =" md-form-control"
129+ name =" description"
130+ v-validate =" 'required|min:5|max:255'"
131+ v-model =" transactiondescription"
132+ ></textarea >
83133 <label >description</label >
134+ <span
135+ v-show =" errors.has('description')"
136+ class =" helper-text"
137+ :data-error =" errors.first('description')"
138+ ></span >
84139 </div >
85140 <div class =" form-group mb-5" >
86141 <label >Mode de payment :</label >
87142 <div class =" d-flex justify-content-around" >
88143 <label class =" radio radio-inline radio-primary" >
89- <input type =" radio" value =" cash" name =" paymentmode" v-model =" paymentmode" />
144+ <input
145+ type =" radio"
146+ value =" cash"
147+ v-validate =" 'required'"
148+ name =" payment"
149+ v-model =" paymentmode"
150+ />
90151 <span >En Espèces</span >
91152 </label >
92153 <label class =" radio radio-inline radio-primary" >
93- <input type =" radio" value =" card" name =" paymentmode" v-model =" paymentmode" />
154+ <input
155+ type =" radio"
156+ value =" card"
157+ v-validate =" 'required'"
158+ name =" payment"
159+ v-model =" paymentmode"
160+ />
94161 <span >Carte Bancaire</span >
95162 </label >
96163 <label class =" radio radio-inline radio-primary" >
97- <input type =" radio" value =" transfer" name =" paymentmode" v-model =" paymentmode" />
164+ <input
165+ type =" radio"
166+ value =" transfer"
167+ v-validate =" 'required'"
168+ name =" payment"
169+ v-model =" paymentmode"
170+ />
98171 <span >Virement</span >
99172 </label >
100173 </div >
174+ <span
175+ v-show =" errors.has('payment')"
176+ class =" helper-text text-danger"
177+ >{{ errors.first('payment') }}</span >
101178 </div >
102179 </form >
103180 </div >
@@ -142,7 +219,16 @@ export default {
142219 this .createTransaction = create;
143220 });
144221 EventBus .$on (" edit-transaction" , transaction => {
145- console .log (transaction);
222+ const selectDate = transaction .transaction_date .split (" T" );
223+ const selectTime = selectDate[1 ].split (" ." );
224+ this .transactionId = transaction .transaction_id ;
225+ this .paymentmode = transaction .transaction_payment_mode ;
226+ this .transactiontype = transaction .transaction_type ;
227+ this .transactiondate = selectDate[0 ];
228+ this .transactiontime = selectTime[0 ];
229+ this .transactionamount = transaction .transaction_amount ;
230+ this .transactioncategory = transaction .transaction_category_name ;
231+ this .transactiondescription = transaction .transaction_description ;
146232 this .createTransaction = false ;
147233 });
148234 this .$store
@@ -164,12 +250,42 @@ export default {
164250 transactionDescription: this .transactiondescription ,
165251 transaction_category_id: this .transactioncategory
166252 };
167- console .log (transactionData);
253+ this .$validator .validateAll ().then (result => {
254+ if (result) {
255+ if (this .createTransaction ) {
256+ this ._createTransaction (transactionData);
257+ } else {
258+ this ._editTransaction (transactionData);
259+ }
260+ } else {
261+ this .$awn .warning (" Veuillez saisir des informations valides" , {
262+ icons: { warning: " exclamation" }
263+ });
264+ }
265+ });
266+ },
267+ _createTransaction (transactionData ) {
168268 this .$store
169269 .dispatch (" transactions/createNewTransaction" , transactionData)
270+ .then (response => {
271+ this .$store .dispatch (" transactions/getAllTransactions" );
272+ $ (" #transactionModalCenter" ).modal (" hide" );
273+ this .$awn .success (response .message , {
274+ icons: { success: " check" }
275+ });
276+ });
277+ },
278+ _editTransaction (transactionData ) {
279+ const editTransactionData = {
280+ transactionData: transactionData,
281+ id: this .transactionId
282+ };
283+ this .$store
284+ .dispatch (" transactions/editTransaction" , editTransactionData)
170285 .then (response => {
171286 console .log (response);
172287 this .$store .dispatch (" transactions/getAllTransactions" );
288+ $ (" #transactionModalCenter" ).modal (" hide" );
173289 this .$awn .success (response .message , {
174290 icons: { success: " check" }
175291 });
0 commit comments