fixed adding product variation layout and sku, gtin value

Author: thiennn

src/Modules/SimplCommerce.Module.Catalog/wwwroot/admin/product/product-form.html

@@ -243,13 +243,13 @@ <h2 ng-if="vm.isEditMode">{{::vm.translate.get('Edit Product')}} {{vm.product.na
                         <div class="col-sm-10">
                             <table class="table table-striped">
                                 <tr>
-                                    <th>{{::vm.translate.get('Option Combinations')}}</th>
-                                    <th>{{::vm.translate.get('SKU')}}</th>
-                                    <th>{{::vm.translate.get('GTIN')}}</th>
-                                    <th>{{::vm.translate.get('Price')}}</th>
-                                    <th>{{::vm.translate.get('Old Price')}}</th>
-                                    <th>{{::vm.translate.get('Images')}}</th>
-                                    <th>{{::vm.translate.get('Actions')}}</th>
+                                    <th class="col-md-2">{{::vm.translate.get('Option Combinations')}}</th>
+                                    <th class="col-md-2">{{::vm.translate.get('SKU')}}</th>
+                                    <th class="col-md-2">{{::vm.translate.get('GTIN')}}</th>
+                                    <th class="col-md-2">{{::vm.translate.get('Price')}}</th>
+                                    <th class="col-md-2">{{::vm.translate.get('Old Price')}}</th>
+                                    <th class="col-md-1">{{::vm.translate.get('Images')}}</th>
+                                    <th class="col-md-1">{{::vm.translate.get('Actions')}}</th>
                                 </tr>
                                 <tr ng-repeat="variation in vm.product.variations">
                                     <td>{{variation.name}}</td>
@@ -279,34 +279,40 @@ <h2 ng-if="vm.isEditMode">{{::vm.translate.get('Edit Product')}} {{vm.product.na
                                     </td>
                                 </tr>
                                 <tr ng-show="vm.product.options.length > 0">
-                                    <td class="variation-form" colspan="5">
+                                    <td class="variation-form" colspan="7">
                                         <ng-form name="addingVariationForm">
                                             <table class="table">
                                                 <tr>
-                                                    <td class="col-sm-4">
+                                                    <td class="col-md-2">
                                                         <div class="form-group row">
                                                             <div ng-repeat="option in vm.product.options">
-                                                                <div class="col-md-4">
+                                                                <div>
                                                                     <select class="form-control" ng-model="vm.addingVariation[option.name]"
                                                                             ng-options="value.key as value.key for value in option.values | filter: vm.filterAddedOptionValue"></select>
                                                                 </div>
                                                             </div>
                                                         </div>
                                                     </td>
-                                                    <td class="col-sm-2">
+                                                    <td class="col-md-2">
+                                                        <input id="addingVariationSku" type="text" maxlength="100" class="form-control" ng-model="vm.addingVariation.sku" />
+                                                    </td>
+                                                    <td class="col-md-2">
+                                                        <input id="addingVariationGtin" type="text" maxlength="100" class="form-control" ng-model="vm.addingVariation.gtin" />
+                                                    </td>
+                                                    <td class="col-md-2">
                                                         <div class="input-number">
                                                             <input id="addingVariationPrice" type="text" decimal maxlength="10" class="form-control" ng-model="vm.addingVariation.price" />
                                                             <label for="addingVariationPrice" class="form-control">{{vm.addingVariation.price | number}}</label>
                                                         </div>
                                                     </td>
-                                                    <td class="col-sm-2">
+                                                    <td class="col-md-2">
                                                         <div class="input-number">
                                                             <input id="addingVariationOldPrice" type="text" decimal maxlength="10" class="form-control" ng-model="vm.addingVariation.oldPrice" />
                                                             <label for="addingVariationOldPrice" class="form-control">{{vm.addingVariation.oldPrice | number}}</label>
                                                         </div>
                                                     </td>
-                                                    <td class="col-sm-2"></td>
-                                                    <td class="col-sm-2"><button type="button" class="btn btn-primary" ng-disabled="!vm.isAddVariationFormValid()" ng-click="vm.addVariation()"><span class="glyphicon glyphicon-plus"></span></button></td>
+                                                    <td class="col-md-1"></td>
+                                                    <td class="col-md-1"><button type="button" class="btn btn-primary" ng-disabled="!vm.isAddVariationFormValid()" ng-click="vm.addVariation()"><span class="glyphicon glyphicon-plus"></span></button></td>
                                                 </tr>
                                             </table>
                                         </ng-form>

src/Modules/SimplCommerce.Module.Catalog/wwwroot/admin/product/product-form.js

@@ -131,7 +131,8 @@
                             name: vm.product.name + ' ' + optionCombinations.map(getItemValue).join(' '),
                             normalizedName : optionCombinations.map(getItemValue).join('-'),
                             optionCombinations: optionCombinations,
-                            price : vm.product.price
+                            price: vm.product.price,
+                            oldPrice: vm.product.oldPrice
                         };
                         vm.product.variations.push(variation);
                     } else {
@@ -197,12 +198,15 @@
                     return item.value;
                 }).join('-'),
                 optionCombinations: optionCombinations,
-                price: vm.addingVariation.price || vm.product.price
+                price: vm.addingVariation.price || vm.product.price,
+                oldPrice: vm.addingVariation.oldPrice || vm.product.oldPrice,
+                sku: vm.addingVariation.sku,
+                gtin: vm.addingVariation.gtin
             };
 
             if (!vm.product.variations.find(function (item) { return item.name === variation.name; })) {
                 vm.product.variations.push(variation);
-                vm.addingVariation = { price: vm.product.price };
+                vm.addingVariation = { price: vm.product.price, oldPrice: vm.product.oldPrice };
             } else {
                 toastr.error('The ' + variation.name + ' has been existing');
             }