Subversion Repositories SmartDukaan

Rev

Rev 33909 | Rev 34085 | Go to most recent revision | Blame | Compare with Previous | Last modification | View Log | RSS feed 

<style>
    .border-red {
        border: 1px solid red;
    }

    .border-green {
        border: 1px solid green;
    }

    .hide-textarea {
        display: none
    }

    .show-textarea {
        display: block
    }

    .hide-model {
        display: none
    }

    .show-model {
        display: block
    }

</style>
<section class="wrapper">
    <div class="row">
        <div class="col-lg-12">
            <h3 class="page-header" style="text-align: center ;color:#d3181f">LOI form</h3>
            <ol class="breadcrumb">
                <li><i class="fa fa-home"></i><a href="${rc.contextPath}/dashboard">#springMessage(
                    "reportdailycollection.home")</a></li>
                <li><i class="icon_document_alt"></i>LOI Form</li>
            </ol>
        </div>
    </div>

    <div class="col-md-12">
        <div class="container well">
            <form name="loi-form" id="loi-form" method="post" style="margin-top:40px;">
                <div class="row">
                    <div class="col-lg-3 form-group">
                        <label>Refer By(BGC Team)</label>
                        <span style="color:red ;font-size: 140%"></span>
                        <select class="form-control type" name="referId" required>

                            <option value="" selected>
                                Select BGC
                            </option>
                            #foreach($authUsers in $authUsersList)
                                <option value=$authUsers.getId()>$authUsers.getFullName() </option>
                            #end
                        </select>

                    </div>
                    <div class="col-lg-3 form-group">
                        <label>Business type</label><span
                            style="color:red ;font-size: 140%">*</span>

                        <select class="form-control" name="businessType"
                                placeholder="Business type" required>
                            <option value="$businessTypes.get(0)" selected>$businessTypes.get(0)</option>
                            #foreach($businessType in $businessTypes)
                                <option value=$businessType>$businessType</option>
                            #end
                        </select>

                    </div>
                    <!--Acquired Date-->
                    <div class="col-lg-3 form-group">
                        <label>Acquired Date</label><span
                            style="color:red ;font-size: 140%">*</span>
                        <input type="date" name="acquiredDate" class="form-control">

                    </div>
                </div>
                <div>
                    <h4>Personal Details</h4>
                </div>
                <div class="row">
                    <div class="col-md-4">
                        <!-- Owner Name -->
                        <div class="form-group">
                            <label>First Name </label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="text" class="form-control" required name="firstName"
                                   placeholder="Enter first name">

                        </div>
                    </div>
                    <div class="col-md-4">
                        <!-- Owner Name -->
                        <div class="form-group">
                            <label>Last Name </label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="text" class="form-control" required name="lastName"
                                   placeholder="Enter last name">
                        </div>
                    </div>
                    <div class="col-md-4">
                        <!-- Mobile No -->
                        <div class="form-group">
                            <label>Mobile No. </label><span
                                style="color:red ;font-size: 140%">*</span>

                            <input type="tel" class="form-control" required name="mobile"
                                   placeholder="10-digit Mobile"
                                   maxlength="10"
                                   minlength="10"
                                   pattern="[0-9]"
                                   pla
                                   value="">

                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-4">
                        <!-- Landline No -->
                        <div class="form-group">
                            <label>Alternative Mobile No.</label>
                            <input type="tel" class="form-control" name="landline"
                                   maxlength="10"
                                   minlength="10"
                                   pattern="[0-9]"
                                   placeholder="Enter Alternative mobile"
                                   value="">


                        </div>
                    </div>
                    <div class="col-lg-4"><!-- Email ID -->
                        <div class="form-group">
                            <label>Email ID </label>
                            <span
                                    style="color:red ;font-size: 140%">*</span>

                            <input type="email" class="form-control" required name="email" placeholder="Enter Email"
                                   value="">

                        </div>
                    </div>
                    <div class="col-lg-4"> <!-- DOB -->
                        <div class="form-group">
                            <label>DOB </label>
                            <span
                                    style="color:red ;font-size: 140%">*</span>

                            <input type="date" class="form-control" required name="dob" placeholder="Enter DOB">

                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-3"> <!-- PAN No-->
                        <div class="form-group">
                            <label>PAN No</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="text" class="form-control" required name="panNo" placeholder="enter Pan No"
                                   minlength="10"
                                   maxlength="10">


                        </div>
                    </div>
                    <div class="col-lg-3"> <!-- Aadhar No-->
                        <div class="form-group">
                            <label>Aadhar No</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="tel" class="form-control" required name="adharNo"
                                   placeholder="Adhar Number"
                                   maxlength="12"
                                   minlength="12"
                                   pattern="[0-9]{12}">

                        </div>
                    </div>
                    <div class="col-lg-3"><!-- ANNIV DT- -->
                        <div class="form-group">
                            <label>Marital Status</label>
                            <span
                                    style="color:red ;font-size: 140%">*</span>
                            <select class="form-control" name="maritalStatus"
                                    placeholder="Marital Status" required id="maritalStatus">
                                <option value=""></option>
                                <option value="0">Single</option>
                                <option value="1">Married</option>
                            </select>
                        </div>
                    </div>
                    <div class="loiAnniversaryDate hide-model">
                        <div class="col-lg-3"><!-- ANNIV DT- -->
                            <div class="form-group">
                                <label>Anniversary Date </label>
                                <span
                                        style="color:red ;font-size: 140%">*</span>

                                <input type="date" class="form-control" name="anniversaryDate"
                                       placeholder="Enter Anniversary date" value=" ">

                            </div>
                        </div>
                    </div>


                </div>

                <h4>Business Detail</h4>
                <!-- GST No-->
                <div class="row">
                    <div class="col-lg-6">
                        <div class="form-group">
                            <label>GST No </label>
                            <span
                                    style="color:red ;font-size: 140%">*</span>

                            <input
                                    type="text"
                                    class="form-control gstNo"
                                    id="gstValidate"
                                    required
                                    name="gstNo"
                                    placeholder="Enter GST Reg No."
                                    minlength="15"
                                    maxlength="15" value="">

                        </div>
                    </div>


                    <div class="col-lg-6">
                        <div class="form-group">
                            <label for="gstName">Company Name:</label>
                            <span
                                    style="color:red ;font-size: 140%">*</span>

                            <input type="text" class="form-control" id="CompanyName" name="companyName" required
                                   value="" readonly>
                        </div>
                    </div>
                </div>
                <!-- GST Address -->
                <div class="row">
                    <div class="col-lg-3">
                        ##                                        <label class="bold-details">PIN CODE</lebel>

                        <input
                                placeholder="Pin Code" id="gstPinCode"
                                name="gstPin" type="hidden" value=""
                                class="form-control input-sm" readonly>

                    </div>

                    <div class="col-lg-3">
                        <div class="form-group">
                            ##                                            <label for="gstState">State</label>

                            <input placeholder="State"
                                   id="gstState" name="gstState" type="hidden"
                                   value="" class="form-control input-sm"
                                   style="font-weight: bold;" readonly>

                        </div>
                    </div>

                    <div class="col-lg-3">
                        <div class="form-group">
                            ## <label>City :</label>
                            <input placeholder="State"
                                   id="gstCity" name="gstCity" type="hidden"
                                   value="" class="form-control input-sm"
                                   style="font-weight: bold;" readonly>

                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            ##                                            <label for="gstDistrict">District :</label>

                            <input id="gstDistrict" type="hidden" name="gstDistrict" class="form-control input-sm"
                                   value="" readonly>

                        </div>
                    </div>
                </div>
                <div><h4>Addition Place of Business</h4></div>
                <div class="row">
                    <div class="col-lg-6">
                        <div class="form-group">
                            <label>Select Address</label>
                            <span
                                    style="color:red ;font-size: 140%">*</span>
                            <div id="addlist"></div>
                        </div>
                    </div>
                </div>
                <div><h4>Bank Details :</h4></div>
                <div class="row">
                    <!-- Bank name-->
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>Bank name :</label><span
                                style="color:red ;font-size: 140%">*</span>

                            <input type="text" class="form-control" required name="bankName" placeholder="Bank Name"
                                   value="">
                        </div>
                    </div>

                    <!-- IFSC Code-->
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>IFSC Code :</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="text" class="form-control" required name="ifscCode" placeholder="IFSC Code"
                                   value="">

                        </div>
                    </div>

                    <!-- Account No.-->
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>Account No :</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="number" class="form-control" required name="accountNo"
                                   placeholder="Account Number" value="">
                        </div>
                    </div>
                </div>
                <!-- Agreed Minimum Wallet value (INR) -->
                <div><h4>Store Details </h4></div>
                <div class="row">
                    <div class="col-lg-3">
                        <div class="form-group" style="text-align: left;">
                            <label>Minimum Wallet value :</label><span
                                style="color:red ;font-size: 140%">*</span>

                            <select class="form-control" name="agreeWalletValue" required>
                                <option value="600000">600000</option>
                                <option value="700000">700000</option>
                                <option value="800000">800000</option>
                                <option value="900000">900000</option>
                                <option value="1000000">1000000</option>
                                <option value="1100000">1100000</option>
                                <option value="1200000">1200000</option>
                                <option value="1500000">1500000</option>
                                <option value="2000000">2000000</option>
                                <option value="2500000">2500000</option>
                                <option value="3000000">3000000</option>
                            </select>
                        </div>

                    </div>
                    <!-- Store area (sq ft) -->
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label>Store area </label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="number" class="form-control" id="storeArea" required
                                   name="storeArea" placeholder="in square feet" value="">

                        </div>
                    </div>
                    <div class="col-lg-3">
                        <!-- Store Potential -->
                        <div class="form-group">
                            <label>Store Potential</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="number" class="form-control" required name="storePotential"
                                   min="400000" id="storePotential"
                                   placeholder="Store Potential" value="">
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <!-- Finance Code -->
                        <div class="form-group">
                            <label>Finance Code</label>
                            <span style="color:red ;font-size: 140%"></span>
                            <input type="text" class="form-control" required name="finCode"
                                   id="mk_finance_Code"
                                   placeholder="Finance code" value="">
                        </div>
                    </div>
                </div>
                <h4>Brand Commitment</h4>
                <div id="loiBrandCommitment form-contro">
                    #foreach($brandCommit in $brandCommits)
                        <div class="row">
                            <div class="col-lg-3">
                                <div class="form-group">
                                    <label>$brandCommit.getBrand()</label><span
                                        style="color:red ;font-size: 140%">*</span>
                                    <input type="number" class="form-control brand-commitment" required
                                           name="$brandCommit.getBrand()" value="">
                                </div>
                            </div>
                        </div>
                    #end
                    <div class="row">
                        <div class="col-lg-3">
                            <div class="form-group">
                                <label>Accessories</label><span
                                    style="color:red ;font-size: 140%">*</span>
                                <input type="number" class="form-control brand-commitment" required
                                       name="Accessories" value="">
                            </div>
                        </div>
                        <div class="col-lg-3">
                            <div class="form-group">
                                <label>Other</label><span
                                    style="color:red ;font-size: 140%">*</span>
                                <input type="number" class="form-control brand-commitment" required
                                       name="Other" value="">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label>Total Commitment</label>
                            <input type="number" class="form-control " name="totaCommitmentAmount" id="totalAmount"
                                   readonly required
                                   placeholder="Total Commitment" value="">
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="form-group hide-textarea" id="textArea">
                            <label>Reason for less Commit</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="text" class="form-control " name="lessCommitReason" id="lessCommitReason"
                                   placeholder="specify the reason"
                                   value="">

                        </div>
                    </div>
                </div>
                ##                Agreed Brand fees (INR)
                <div class="row">
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>Agreed Brand fees</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <select name="agreedBrandFees" class="form-control">
                                #foreach($storeTypeFeePair in $storeTypeFeePairs)
                                    #set($storeType1 =$storeTypeFeePair.getKey())
                                    #set($brandFee = $storeTypeFeePair.getValue())
                                    #if($brandFee.getFeeByStoreType($storeType1)>0)
                                        <option value="$storeTypeFeePair.getKey()-$brandFee.getFeeByStoreType($storeType1)-$brandFee.getId()"> $storeType1
                                            ($brandFee.getFeeByStoreType($storeType1))
                                        </option>
                                    #end
                                #end
                            </select>
                        </div>
                    </div>

                    <!-- Brand fees collected (INR) -->
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>Brand fees collected</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="number" class="form-control " id="brandFeesCollected" required
                                   name="brandFeesCollected" placeholder="500000">
                        </div>
                    </div>
                    <!-- Mode of Payment Online/Cheque/IMPS/NEFT/RTGS/Wallet -->
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>Mode of Payment</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <select class="form-control" name="paymentMode" required>
                                <option value="">Select mode</option>
                                <option value="UPI">UPI</option>
                                <option value="Cheque">Cheque</option>
                                <option value="IMPS">IMPS</option>
                                <option value="NEFT">NEFT</option>
                                <option value="RTGS">RTGS</option>
                            </select>
                        </div>
                    </div>
                </div>
                <!-- Payment reference no -->
                <div class="row">
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>Payment Reference No</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="text" class="form-control" id="paymentReferenceNo" required
                                   name="paymentReferenceNo" placeholder="">
                        </div>
                    </div>
                    <!-- fee collection date -->
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>Fee collecting Date</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="datetime-local" class="form-control " id="feeCollectingDate" required
                                   name="feeCollectingDate">
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="form-group">
                            <label>Attach Screenshot</label><span
                                style="color:red ;font-size: 140%">*</span>
                            <input type="hidden" id="payment-sc-docId" name="paymentAttachment">
                            <input type="file" class="form-control" id="payment-sc-doc" required>
                        </div>
                    </div>
                </div>
                <!-- Submit button-->
                <div class="form-group" style="text-align: center; margin-bottom:2px;">
                    <button type="button"
                            class="btn btn-primary text-white font-semibold py-1 px-4 rounded background-red mk_submit_loi_form"
                            style="box-shadow:none;margin-bottom:2px;">
                        <span>Submit</span>
                    </button>
                </div>
            </form>
        </div>
    </div>

</section>
<script>


    $(".gstNo").change(function () {
        var inputGstNo = $(this).val();
        var gstinformat = new RegExp('^[0-9]{2}[A-Z]{5}[0-9]{4}[A-Z]{1}[1-9A-Z]{1}Z[0-9A-Z]{1}$');
        if (gstinformat.test(inputGstNo)) {
            doGetAjaxRequestHandler(`${context}/gstValidate?gstNo=` + inputGstNo,
                    function (response) {
                        if (response.sts === "Active") {
                            $("#CompanyName").val(response.tradeNam);
                            $("#gstPinCode").val(response.pradr.addr.pncd);
                            console.log("pincode-", response.pradr.addr.pncd)
                            $("#gstState").val(response.pradr.addr.stcd);
                            $("#gstCity").val(response.pradr.addr.loc);
                            console.log("loc-", response.pradr.addr.loc)
                            $("#gstDistrict").val(response.pradr.addr.dst);
                            var selectOptions = [];
                            var addresses = response.adadr;
                            selectOptions.push(`<select id="billingAddress" name="billingAddress" class="form-control">`);
                            addresses.forEach((pradr) => {
                                var addrString = getAddressString(pradr.addr);
                                var addrStringify = JSON.stringify(pradr.addr);
                                selectOptions.push(`<option value='${addrStringify}'>
                                      ${addrString}
                                </option>`);
                            });
                            selectOptions.push(`</select>`);
                            $('#addlist').html(selectOptions.join(''));
                        } else {
                            alert("GSTIN - " + inputGstNo + " is not Active")
                        }
                    });
        } else {
            alert('Please Enter Valid GSTIN Number');
            $(".gstNo").val('');
            $(".gstNo").focus();
        }
    });


    function getAddressString(addr) {
        addrFields = ["bno", "bnm", "st", "locality", "loc", "pncd", "stcd"];
        addresArr = [];
        for (let i = 0; i < addrFields.length; i++) {
            if (addr.hasOwnProperty(addrFields[i]) && addr[addrFields[i]] !== "") {
                addresArr.push(addr[addrFields[i]]);
            }
        }
        return addresArr.join(", ");
    }

    $(document).ready(function () {
        var brandCommitmentInputs = document.querySelectorAll(".brand-commitment");
        var totalCommitmentAmount = 0;
        brandCommitmentInputs[brandCommitmentInputs.length - 1].addEventListener("blur", function () {
            updateTotalCommitmentAmount();
        });

        function updateTotalCommitmentAmount() {
            // Recalculate the total commitment amount
            totalCommitmentAmount = 0;
            brandCommitmentInputs.forEach(function (input) {
                var commitmentValue = parseInt(input.value);
                if (!isNaN(commitmentValue)) {
                    totalCommitmentAmount += commitmentValue;
                }
            });

            var totalCommitmentInput = document.getElementById("totalAmount");
            totalCommitmentInput.value = totalCommitmentAmount;

            var storePotential = document.getElementById("storePotential").value;
            var minCommitLimit = storePotential * 0.7; // 70% of the store's potential
            if (totalCommitmentAmount >= minCommitLimit) {
                totalCommitmentInput.classList.remove('border-red');
                totalCommitmentInput.classList.add('border-green');
                document.getElementById("textArea").classList.remove('show-textarea');
                document.getElementById("textArea").classList.add('hide-textarea');
            } else {
                alert("Total commit amount should be greater than or equal to 70% of the store's potential. Specify the reason");
                totalCommitmentInput.classList.remove('border-green');
                totalCommitmentInput.classList.add('border-red');
                document.getElementById("textArea").classList.remove('hide-textarea');
                document.getElementById("textArea").classList.add('show-textarea');
                document.getElementById("textArea").focus();
            }
        }
    });
</script>