max product field added in coupons form

Author: JasmeetLuthra

forms/BulkCoupon.js

@@ -60,16 +60,13 @@ const bulkCouponSchema = Yup.object().shape({
         .required("Field is required."),
     active: Yup.boolean()
         .required("Field is required."),
-    min_product_mrp: Yup.number().when('mode', {
-        is: (val) => val == "flat",
-        then: Yup.number()
-            .min(1, 'must be greater or eqauls to 1')
-            .typeError('min product price is required')
-            .required('min product price is required.'),
-        otherwise: Yup.number()
-            .min(1, 'must be greater or eqauls to 1')
-            .nullable().notRequired()
-    }),
+    min_product_mrp: Yup.number()
+        .positive().nullable().notRequired(),
+    max_product_mrp: Yup.number()
+        .positive()
+        .moreThan(Yup.ref('min_product_mrp'), 
+            "must be greater than min product mrp")
+        .nullable().notRequired()
 });
 
 const initialValues = {
@@ -91,7 +88,8 @@ const initialValues = {
     ends_with: '',
     valid_start: Date.now(),
     valid_end: new Date().setMonth(new Date().getMonth() + 1),
-    min_product_mrp: null
+    min_product_mrp: null,
+    max_product_mrp: null
 }
 
 class BulkCouponForm extends React.Component {
@@ -339,7 +337,6 @@ class BulkCouponForm extends React.Component {
                                                 setFieldTouched("percentage", false)
                                                 setFieldValue("max_discount", null)
                                                 setFieldTouched("max_discount", false)
-                                                setFieldTouched("min_product_mrp", false)
                                              }}
                                         >
                                             <option value="flat">Flat</option>
@@ -413,6 +410,21 @@ class BulkCouponForm extends React.Component {
                                             />
                                     </FieldWithElement>
 
+                                    <FieldWithElement
+                                            name={"Min product Mrp"} nameCols={3} elementCols={9} 
+                                            elementClassName={"pl-4"} errorColor={'tomato'} 
+                                            errors={touched.max_product_mrp && errors.max_product_mrp}>
+                                            <input
+                                                type="number"
+                                                className={"input-text"}
+                                                placeholder="Enter min product price"
+                                                name="max_product_mrp"
+                                                onBlur={handleBlur}
+                                                onChange={handleChange}
+                                                value={values.max_product_mrp}
+                                            />
+                                    </FieldWithElement>
+
                                     {/* Total number of times a coupon can be used*/}
                                     <FieldWithElement name={"How many times it can be used?"} nameCols={6}
                                                       elementCols={6} elementClassName={"pl-4"} errorColor={'tomato'}

forms/Coupon.js

@@ -55,16 +55,13 @@ const couponSchema = Yup.object().shape({
         .required("Field is required."),
     active: Yup.boolean()
         .required("Field is required."),
-    min_product_mrp: Yup.number().when('mode', {
-        is: (val) => val == "flat",
-        then: Yup.number()
-            .min(1, 'must be greater or eqauls to 1')
-            .typeError('min product price is required')
-            .required('min product price is required.'),
-        otherwise: Yup.number()
-            .min(1, 'must be greater or eqauls to 1')
-            .nullable().notRequired()
-    }),
+    min_product_mrp: Yup.number()
+        .positive().nullable().notRequired(),
+    max_product_mrp: Yup.number()
+        .positive()
+        .moreThan(Yup.ref('min_product_mrp'), 
+            "must be greater than min product mrp")
+        .nullable().notRequired()
 });
 
 const initialValues = {
@@ -83,7 +80,8 @@ const initialValues = {
     amount: null,
     valid_start: Date.now(),
     valid_end: new Date().setMonth(new Date().getMonth() + 1),
-    min_product_mrp: null
+    min_product_mrp: null,
+    max_product_mrp: null
 }
 
 class CouponForm extends React.Component {
@@ -123,7 +121,8 @@ class CouponForm extends React.Component {
             valid_start: new Date(this.props.data.coupon.valid_start),
             valid_end: new Date(this.props.data.coupon.valid_end),
             comment: this.props.data.coupon.comment,
-            min_product_mrp: this.props.data.coupon.min_product_mrp
+            min_product_mrp: this.props.data.coupon.min_product_mrp,
+            max_product_mrp: this.props.data.coupon.max_product_mrp
         }
     }
 
@@ -508,7 +507,6 @@ class CouponForm extends React.Component {
                                                 setFieldTouched("percentage", false)
                                                 setFieldValue("max_discount", null)
                                                 setFieldTouched("max_discount", false)
-                                                setFieldTouched("min_product_mrp", false)
                                              }}
                                             value={values.mode}>
                                                 <option value="flat">Flat</option>
@@ -584,6 +582,21 @@ class CouponForm extends React.Component {
                                             />
                                     </FieldWithElement>
 
+                                    <FieldWithElement
+                                            name={"Max product Mrp"} nameCols={3} elementCols={9} 
+                                            elementClassName={"pl-4"} errorColor={'tomato'} 
+                                            errors={touched.max_product_mrp && errors.max_product_mrp}>
+                                            <input
+                                                type="number"
+                                                className={"input-text"}
+                                                placeholder="Enter min product price"
+                                                name="max_product_mrp"
+                                                onBlur={handleBlur}
+                                                onChange={handleChange}
+                                                value={values.max_product_mrp}
+                                            />
+                                    </FieldWithElement>
+
                                     {/* Total number of times a coupon can be used*/}
                                     <FieldWithElement name={"How many times it can be used?*"} nameCols={6}
                                                       elementCols={6} elementClassName={"pl-4"} errorColor={'tomato'}