Small payment fixes (#9082)

* Fixed some parameter passing and computed placements

* reset edit when user change

* Lint fix

website/client/components/settings/subscription.vue

@@ -36,11 +36,11 @@
             strong {{user.purchased.plan.dateTerminated | date}}
           tr(v-if='!hasCanceledSubscription'): td
             h4 {{ $t('subscribed') }}
-            p(v-if='hasPlan && !hasGroupPlan') {{ $t('purchasedPlanId', {purchasedPlanIdInfo}) }}
+            p(v-if='hasPlan && !hasGroupPlan') {{ $t('purchasedPlanId', purchasedPlanIdInfo) }}
             p(v-if='hasGroupPlan') {{ $t('youHaveGroupPlan') }}
           tr(v-if='user.purchased.plan.extraMonths'): td
             span.glyphicon.glyphicon-credit-card
-            |   {{ $t('purchasedPlanExtraMonths', {purchasedPlanExtraMonthsDetails}) }}
+            |   {{ $t('purchasedPlanExtraMonths', purchasedPlanExtraMonthsDetails) }}
           tr(v-if='hasConsecutiveSubscription'): td
             span.glyphicon.glyphicon-forward
             |   {{ $t('consecutiveSubscription') }}
@@ -208,7 +208,7 @@ export default {
     },
     purchasedPlanExtraMonthsDetails () {
       return {
-        months: this.user.purchased.plan.extraMonths.toFixed(2),
+        months: parseFloat(this.user.purchased.plan.extraMonths).toFixed(2),
       };
     },
     buyGemsGoldCap () {
@@ -238,6 +238,14 @@ export default {
         amount: this.numberOfMysticHourglasses,
       };
     },
+    canCancelSubscription () {
+      return (
+        this.user.purchased.plan.paymentMethod !== this.paymentMethods.GOOGLE &&
+        this.user.purchased.plan.paymentMethod !== this.paymentMethods.APPLE &&
+        !this.hasCanceledSubscription &&
+        !this.hasGroupPlan
+      );
+    },
   },
   methods: {
     async applyCoupon (coupon) {
@@ -253,14 +261,6 @@ export default {
       subs.basic_6mo.discount = true;
       subs.google_6mo.discount = false;
     },
-    canCancelSubscription () {
-      return (
-        this.user.purchased.plan.paymentMethod !== this.paymentMethods.GOOGLE &&
-        this.user.purchased.plan.paymentMethod !== this.paymentMethods.APPLE &&
-        !this.hasCanceledSubscription &&
-        !this.hasGroupPlan
-      );
-    },
     async cancelSubscription (config) {
       if (config && config.group && !confirm(this.$t('confirmCancelGroupPlan'))) return;
       if (!confirm(this.$t('sureCancelSub'))) return;
@@ -298,6 +298,7 @@ export default {
       this.$router.push('/');
     },
     getCancelSubInfo () {
+      // @TODO: String 'cancelSubInfoGroup Plan' not found. ?
       return this.$t(`cancelSubInfo${this.user.purchased.plan.paymentMethod}`);
     },
   },

website/client/components/userMenu/profile.vue

@@ -653,6 +653,9 @@ export default {
     user () {
       let user = this.userLoggedIn;
 
+      // Reset editing when user is changed. Move to watch or is this good?
+      this.editing = false;
+
       let profileUser = this.$store.state.profileUser;
       if (profileUser._id && profileUser._id !== this.userLoggedIn._id) {
         user = profileUser;

website/client/libs/encodeParams.js

@@ -1,7 +1,7 @@
 // Equivalent of jQuery's param
 
 export default function (params) {
-  Object.keys(params).map((k) => {
+  return Object.keys(params).map((k) => {
     return `${encodeURIComponent(k)}=${encodeURIComponent(params[k])}`;
   }).join('&');
 }