added text about promocode-status in payments-modal, promocode-input

luckydiamond/src/assets/css/ComponentsStyles/payments-modal.css

@@ -205,8 +205,30 @@ input[type="checkbox"]:checked::before {
 
 .error-checkbox h2 {
     font-size: 13px;
-    font-weight: 400;
-    color: #c52f2f;
+    font-weight: 700;
+    color: #BA3636;
+    font-family: "Montserrat Alternates";
+}
+
+.error-promocode {
+    position: absolute;
+    left: 49%;
+    top: 35%;
+}
+
+.error-promocode .error-text__promocode {
+    font-size: 11px;
+    font-weight: 700;
+    color: #BA3636;
+    font-family: "Montserrat Alternates";
+    margin-left: 55px;
+}
+
+.error-promocode .correct-text__promocode {
+    font-size: 11px;
+    font-weight: 700;
+    color: #3BA44C;
+    font-family: "Montserrat Alternates";
 }
 
 .checkbox-styles input:disabled:hover {

luckydiamond/src/components/PaymentsModal.vue

@@ -29,9 +29,13 @@
             </li>
           </ul>
         </div>
+        <div v-if="showPromocodeStatus" class="error-promocode">
+          <h2 v-if="errorPromocode" class="error-text__promocode">Промокод не найден</h2>
+          <h2 v-else class="correct-text__promocode">Промокод успешно применён</h2>
+        </div>
         <div class="deposit-promocode deposit-promocode__padding--input">
           <h3>Промокод</h3>
-          <input class="promo-input" type="text" />
+          <input @focusout="checkValidationPromocode" v-model="promocode" class="promo-input" type="text" />
         </div>
         <div class="deposit-checkbox checkbox-styles">
           <input @click="agreeUser = !agreeUser" type="checkbox" />
@@ -108,6 +112,10 @@ export default {
       amountWithdraw: 1,
       amountSave: 1,
       card: '',
+      promocode: '',
+      promocodeBase: ['ANTI-GRIF'],
+      errorPromocode: false,
+      showPromocodeStatus: false,
       errorAgree: false,
       captchaToken: null,
       clickedBtn: "",
@@ -179,6 +187,10 @@ export default {
     closeModal() {
       return this.$emit("closemodal");
     },
+    checkValidationPromocode() {
+      this.errorPromocode = !this.promocodeBase.includes(this.promocode);
+      this.showPromocodeStatus = true
+    },
     completeValidationCheck() {
       this.offBtn = true