<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <!-- <h1 class="m-0">Member Details</h1> -->
            </div>
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="#">Member</a></li>
                    <li class="breadcrumb-item active">Member Details</li>
                </ol>
            </div>
        </div>
    </div>
</div>




<section class="content">
    <div class="container-fluid">




        <div class="row">

            <section class="col-lg-12 connectedSortable">

                <div class="card">
                    <div class="card-header" style="background-color:#31708e;color:white">
                        <h3 class="card-title">
                            Member Details
                        </h3>
                        <div class="card-tools">
                            <ul class="nav nav-pills ml-auto">
                            </ul>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="tab-content p-0">



                            <form method="post" action="<?php echo base_url(); ?>index.php/Member/insert_member" id="member_add_" enctype='multipart/form-data'>
                                <div class="row mt-3">
                                    <div class="col-sm-5 ml-5">
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b style="color:red">Member No. *</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="me_no" id="mem_no" onchange="check_mem_no_exists(id);" value="<?php echo $me_no + 1; ?>">
                                                <!--value="<!-?php echo $me_no + 1; ?>"-->

                                                <div class="alert alert-danger" id="mem_no_alert"></div>
                                            </div>
                                        </div><br>

                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Member Photo</b></div>
                                            <div class="col-sm-6">
                                                <input type="file" class="form-control" name="mem_image" id="mem_image">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b style="color:red">Member Name * </b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" onkeyup="touppercase(id);" name="mem_name" id="mem_name">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Father Name</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" onkeyup="touppercase(id);" name="f_name" id="father_name">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Date Of Birth</b></div>
                                            <div class="col-sm-6">
                                                <div class="input-group input-append date datePicker" id="datePicker">
                                                    <input type="date" class="form-control" name="mem_dob" id="mem_dob" placeholder="DD-MM-YYYY" style="padding-right:44px" />
                                                    <!-- <span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span> -->
                                                </div>
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Age</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" readonly id="mem_age">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Gender</b></div>
                                            <div class="col-sm-6">
                                                <input type="radio" name="mem_gender" value="male"> Male&nbsp;&nbsp;
                                                <input type="radio" name="mem_gender" value="female">&nbsp; Female&nbsp;&nbsp;
                                                <input type="radio" name="mem_gender" value="other">&nbsp; Others
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Caste</b></div>
                                            <div class="col-sm-6">
                                                <select name="mem_caste" id="cast" class="form-control">
                                                    <option value="">Select</option>
                                                    <?php foreach ($value as $caste) { ?>
                                                        <option value="<?php echo $caste['caste']; ?>"><?php echo $caste['caste']; ?></option>
                                                    <?php } ?>
                                                </select>
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Designation</b></div>
                                            <div class="col-sm-6">
                                                <select name="mem_desig" id="designation" class="form-control">
                                                    <option value="">Select</option>
                                                    <?php foreach ($design as $key => $value) { ?>
                                                        <option value="<?php echo $value['designation']; ?>"><?php echo $value['designation']; ?></option>
                                                    <?php } ?>
                                                </select>
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Address</b></div>
                                            <div class="col-sm-6">
                                                <textarea class="form-control" rows="4" name="mem_add" id="mem_add"></textarea>
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>District</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="mem_dist" id="mem_dist">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Pincode</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" name="mem_pin" id="mem_pin">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Mobile Number</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" onchange="check_mem_mob(id);" name="mem_mob" id="phone">
                                                <div class="alert alert-danger" id="mem_mob_alert"></div>
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Nominee Name</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="n_name" id="nominee_name">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Relationship</b></div>
                                            <div class="col-sm-6">
                                                <select name="n_relation" id="relationship" class="form-control">
                                                    <option value="">Select</option>
                                                    <?php foreach ($relationship as $relationship) { ?>
                                                        <option value="<?php echo $relationship['relationship']; ?>"><?php echo $relationship['relationship']; ?></option>
                                                    <?php } ?>
                                                </select>
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b style="color:red">Division *</b></div>
                                            <div class="col-sm-6">
                                                <select name="division" id="division_id" class="form-control">
                                                    <option value="">Select</option>
                                                    <?php foreach ($divisions as $division) { ?>
                                                        <option value="<?php echo $division['division']; ?>"><?php echo $division['division']; ?></option>
                                                    <?php } ?>
                                                </select>
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b style="color:red">Section *</b></div>
                                            <div class="col-sm-6">
                                                <select name="section" id="section_id" class="form-control">
                                                    <option value="">Select</option>
                                                    <?php foreach ($sections as $section) { ?>
                                                        <option value="<?php echo $section['section']; ?>"><?php echo $section['section']; ?></option>
                                                    <?php } ?>
                                                </select>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-sm-5 ml-5">
                                        <ol class="breadcrumb ">
                                            <li>Bank 1 Details</li>&nbsp;
                                        </ol>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Bank Name 1</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="b1_name" id="b1_name">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Account Number</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" name="b1_acc_no" id="b1_acc_no">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Branch</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="b1_br" id="b1_br">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>IFSC</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="b1_ifsc" id="b1_ifsc">
                                            </div>
                                        </div><br>
                                        <ol class="breadcrumb ">
                                            <li>Bank 2 Details</li>&nbsp;
                                        </ol>
                                        <input type="checkbox" name="check1" id="check1" /> click if Two bank are not same<br><br><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Bank Name 2</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="b2_name" id="b2_name">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Account Number</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" name="b2_acc_no" id="b2_acc_no">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Branch</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="b2_br" id="b2_br">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>IFSC</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="b2_ifsc" id="b2_ifsc">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Adhar Card</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" name="adhar_no" id="adhar_no">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Pan Card</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="pan_no" id="pan_no">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>GPF No.</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="gpf_no" id="gpf_no">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Ration No.</b></div>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="ration_no" id="ration_no">
                                            </div>
                                        </div><br>

                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Join Date in Department</b></div>
                                            <div class="col-sm-6">
                                                <div class="input-group input-append date datePicker" id="datePicker">
                                                    <input type="date" class="form-control" name="scty_doj" id="scty_doj" placeholder="DD-MM-YYYY" style="padding-right:44px" />
                                                    <!-- <span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span> -->
                                                </div>
                                            </div>
                                        </div><br>

                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Retirement Date</b></div>
                                            <div class="col-sm-6">
                                                <div class="input-group input-append date datePicker" id="datePicker">
                                                    <input type="date" class="form-control" name="mem_dor" id="mem_dor" placeholder="DD-MM-YYYY" style="padding-right:44px" />
                                                    <!-- <span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span> -->
                                                </div>
                                            </div>
                                        </div><br>
                                    </div> <br><br>

                                </div>

                                <div class="row mt-3">
                                    <div class="col-sm-12 ml-12">
                                        <ol class="breadcrumb " style="margin-left:17px;margin-right:17px;margin-top:17px;">
                                            <center>
                                                <li><b>Account Details</b></li>
                                            </center>
                                        </ol>
                                    </div>

                                    <div class="col-sm-5 ml-5 ">
                                        <div class="row mt-3"><?php foreach ($default as $data) : ?>
                                                <div class="col-sm-6"><b>Ent. Fees</b></div>
                                                <div class="col-sm-6">
                                                    <input type="number" class="form-control" readonly name="ent_fees" id="ent_fees" value="<?= $data['ent_fees']; ?>">
                                                </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Share</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" readonly name="d_share" id="d_share" value="<?= $data['default_share']; ?>">
                                                <input type="hidden" class="form-control" readonly name="d_thrift" id="d_thrift" value="<?= $data['default_thrift']; ?>">

                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Books & Forms</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" readonly name="d_books" id="d_books" value="<?= $data['default_books']; ?>">
                                            </div>
                                        </div><br>
                                    </div>
                                    <div class="col-sm-5 ml-5">
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Others</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" readonly name="d_others" id="d_others" value="0">
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b>Insurance</b></div>
                                            <div class="col-sm-6">
                                                <input type="number" class="form-control" readonly name="d_ins" id="d_ins" value="0">
                                            </div><?php endforeach; ?>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b style="color:red">Join Date in Society *</b></div>
                                            <div class="col-sm-6">
                                                <div class="input-group input-append date datePicker" id="datePicker">
                                                    <input type="date" class="form-control" name="mem_doj" id="mem_doj" placeholder="DD-MM-YYYY" style="padding-right:44px" />
                                                    <!-- <span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span> -->
                                                </div>
                                            </div>
                                        </div><br>
                                        <div class="row mt-3">
                                            <div class="col-sm-6"><b style="color:red">Cash Type Bank*</b></div>
                                            <div class="col-sm-6">
                                                <select class="form-control" name="cash_type" id="cash_type_id">
                                                    <option value="">--Select--</option>
                                                    <?php foreach ($banks as $bank) { ?>
                                                        <option value="<?php echo  $bank['bank']; ?>"><?php echo  $bank['bank']; ?></option>
                                                    <?php } ?>
                                                </select>
                                            </div>
                                        </div><br>

                                    </div>
                                </div>


                                <div class='row'>
                                    <div class='col-sm-5'></div>
                                    <button type="button" onclick="member_validate();" class="btn btn-primary col-sm-2">Save</button>
                                </div><br><br>
                            </form>


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





<script>
    $(document).ready(function() {
        var $b1_name = $('#b1_name'),
            $b2_name = $('#b2_name');
        $b1_name.on('input', function() {
            $b2_name.val($b1_name.val());
        });
        var $b1_acc_no = $('#b1_acc_no'),
            $b2_acc_no = $('#b2_acc_no');
        $b1_acc_no.on('input', function() {
            $b2_acc_no.val($b1_acc_no.val());
        });
        var $b1_ifsc = $('#b1_ifsc'),
            $b2_ifsc = $('#b2_ifsc');
        $b1_ifsc.on('input', function() {
            $b2_ifsc.val($b1_ifsc.val());
        });
        var $b1_br = $('#b1_br'),
            $b2_br = $('#b2_br');
        $b1_br.on('input', function() {
            $b2_br.val($b1_br.val());
        });
    });
    $('#check1').click(function() {
        $('#b2_name').val('');
        $('#b2_acc_no').val('');
        $('#b2_br').val('');
        $('#b2_ifsc').val('');
    });
    //datepicker
    $(document).ready(function() {

        $("#mem_name").keyup(function() {
            $(this).val($(this).val().toUpperCase());
        });


        $("#father_name").keyup(function() {
            $(this).val($(this).val().toUpperCase());
        });
        $('.alert').hide();
    });
    //checking transaction
    function cheque_trans_id_div_fun() {
        var cash_type_id = $('#cash_type_id').val();
        if (cash_type_id != "" && cash_type_id != "Cash") {
            $("#cheque_trans_id_div").show();
        } else {
            $("#cheque_trans_id_div").hide();
        }
    }

    //checking member number
    function check_mem_no_exists(id) {
        var mem_no = $("#" + id).val();
        if (mem_no != "") {
            $.ajax({
                type: 'POST',
                url: "<?php echo base_url() ?>index.php/Member/check_memno_exists",
                data: {
                    me_no: mem_no
                },
                dataType: 'html',
                success: function(data) {
                    if (data != '1') {
                        $('.alert').show();
                        $("#mem_no_alert").html(data);
                        $('.alert').fadeOut(3000);
                        $("#" + id).val('');
                    }

                }
            });
        }
    }
    //checking mobile number
    function check_mem_mob(id) {
        var phone = $("#" + id).val();
        if (phone != "") {
            $.ajax({
                type: 'POST',
                url: "<?php echo base_url() ?>index.php/Member/check_mem_mob",
                data: {
                    mem_mob: phone
                },
                dataType: 'html',
                success: function(data) {
                    if (data != '1') {
                        $('.alert').show();
                        $("#mem_mob_alert").html(data);
                        $('.alert').fadeOut(3000);
                        $("#" + id).val('');
                    }

                }
            });
        }
    }
    //get section
    $('#division_id').on('change', function() {
        var division = this.value;
        $.ajax({
            type: 'POST',
            url: "<?php echo base_url() ?>index.php/Member/getsection",
            data: {
                division: division
            },
            dataType: 'html',
            success: function(data) {

                $('#section_id').html(data);
            }
        });
    });
    //validating the data
    function member_validate() {
        var mem_no = $('#mem_no').val();
        var cash_type_id = $('#cash_type_id').val();
        var name = $('#mem_name').val();
        var division = $('#division_id').val();
        var section = $('#section_id').val();
        var phone = $('#phone').val();
        var doj = $('#mem_doj').val();
        var tdccb = $('#tdccb').val();
        var sbi = $('#sbi').val();
        if (mem_no == "") {
            alert("Member Number Must Be Filled Out");
            $("#mem_no").focus();
            return false;
        }
        if (name == "") {
            alert("Name Must Be Filled Out");
            $("#mem_name").focus();
            return false;
        }
        if (division == "") {
            alert("Division Cannot Be Empty");
            $("#division_id").focus();

            return false;
        }
        if (section == "") {
            alert("Section Cannot Be Empty");
            $("#section_id").focus();

            return false;
        }
        if (doj == "") {
            alert("Join Date  Cannot Be Empty");
            $("#mem_doj").focus();

            return false;
        }

        if (phone != "" && phone.length != 10) {
            alert("Mobile Number Must Be 10 Digits");
            $("#phone").focus();

            return false;
        }
        if (cash_type_id == "") {
            alert("Must Fill Cash Type");

            return false;
        }
        $('#member_add_').submit();
    }
</script>
<!---- DOB validating ---->
<script>
    $('#mem_dob').on('change', function() {
        var getDtLive = document.getElementById("mem_dob").value;
        console.log(getDtLive);

        var born_date = new Date(getDtLive);
        console.log(" birthDate" + born_date);

        var diff_dt = Date.now() - born_date.getTime();

        var ageDate = new Date(diff_dt);
        var total_calc_member_age = Math.abs(ageDate.getUTCFullYear() - 1970);
        // alert(total_calc_member_age);
        $("#mem_age").val(total_calc_member_age);
    });
</script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">
    // Load the Google Transliteration API
    google.load("elements", "1", {
        packages: "transliteration"
    });

    function onLoad() {
        var options = {
            sourceLanguage: 'en',
            destinationLanguage: ['ta'],
            shortcutKey: 'ctrl+m',
            transliterationEnabled: true
        }

        // Create an instance on TransliterationControl with the required options.
        var control = new google.elements.transliteration.TransliterationControl(options);

        // Enable transliteration in the textfields with the given ids.
        var ids = ["mem_name"];
        control.makeTransliteratable(ids);

        // Show the transliteration control which can be used to toggle between English and Hindi and also choose other destination language.
        control.showControl('translControl');
    }

    google.setOnLoadCallback(onLoad);
</script>