EVOLUTION-NINJA

Edit File: homepage.php

<?php echo view('includes/headerSidebar'); ?>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

}

.user_details_main {
        border-radius: 13px;
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        /* width: 55%; */
        padding: 27px;
        min-height: 301px;
        background-color: white;

}

.use_img {
        width: 140px;
        height: 126px;
        /* border: 1px solid; */
        border-radius: 50%;
        overflow: hidden;
    }

.user_deta {
        /* border: 1px solid; */
    }

.user_deta>p {
        margin: 0;
        margin-bottom: 5px;
    }

.user_deta>p:nth-child(1) {
        color: #0065A3;
        font-size: 26px;
        font-weight: 600;
    }

.user_deta>p:nth-child(2) {
        color: #33363F;
        font-size: 19px;
        font-weight: 600;
    }

.user_deta>p:nth-child(3) {
        color: #222323;
        font-size: 16px;
        font-weight: 600;
        word-wrap: break-word;
        white-space: break-spaces;
        word-break: break-word;
    }

.user_idno {
        color: #575757
    }

.user_border {
        height: 1px;
        border: 1px solid #B7B4B4;
        margin-bottom: 15px;
    }

.user_more_inf {
        margin-bottom: 10px;
        display: flex;
        align-items: center;
        font-size: 16px;
        font-weight: 500;
        margin-left: 10px;

/* color: #007bff; */
        color: #444;
    }

.user_more_inf>span {
        margin-left: 8px;

color: #525252;
    }

.user_de {
        color: #363636;
        font-weight: 500;
        margin: 0;
        margin-bottom: 8px;
        margin-left: 4px;
        font-size: 20px;
    }

.mor_det {
        color: #212529;
        font-weight: 500;
    }

/* promoter details  */
    .prom_det {
        position: relative;
        width: 300px;
        padding: 20px;
        box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
        margin: auto;
        margin-bottom: 15px;
        background-color: white;
    }

.prom_det:hover {
        scale: 1.1;
        transition: scale 0.6s ease-in-out;

}

.prom_icon {
        width: 63px;
        position: relative;
        top: -47px;
        left: 17px;
    }

.prom_det>.pro_mon {
        float: right;
        margin-top: 18px;
        font-size: 18px;
        font-weight: 600;
        color: #345757;

}

.prom_detail {
        /* display:grid;
            grid-template-columns: repeat(5,1fr); */
        display: flex;
        flex-wrap: wrap;
        flex: 1 0 300px;
        gap: 22px;
        margin: auto;
    }

.peo_par {
        color: #443;
        font-weight: 600;
        margin-top: 4px
    }

@media only screen and (max-width:628px) {
        .user_details_main {
            width: 100%;
            padding: 12px;
            min-height: auto;
        }
        
        
    }

@media only screen and (min-width:629px) and (max-width:1028px) {
        .user_details_main {
            width: 100%;
            min-height: auto;
        }
    }
</style>
<div id="main" class="p-4">

<section>
        
        <div class="mainheading">My Account</div>

<div class="row  mt-5">
            <div class="col-lg-8 col-md-12 col-sm-12">
                <div class="user_details_main h-auto mb-3">
                    <div class="d-flex mb-3 flex-wrap align-items-center flex-wrap">
                        <img src='<?php echo base_url("public/assets/images/Rectangle 4141 (1).png")?>' alt="user image"
                            class="use_img ">

<div class="user_deta ml-4">
                            <p> <?php echo session()->get('username');?></p>
                           
                            <p>User Key: <span class="user_idno"><?php echo session()->get('promoter_id');?></span> </p>
                        </div>

</div>

<div class="accordion" id="accordionExample">
                        <div class="card">
                            <div class="card-header" id="headingOne">
                                <h2 class="mb-0">
                                    <button class="btn btn-link btn-block text-left text-decoration-none mor_det"
                                        type="button" data-toggle="collapse" data-target="#collapseOne"
                                        aria-expanded="true" aria-controls="collapseOne">
                                        More Details
                                    </button>
                                </h2>
                            </div>

<div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
                                data-parent="#accordionExample">
                              <div class="card-body">
                                    <p class="user_de">About</p>
                                    <div class="user_more_inf"> Full Name: <span class="usre_inf" id="promoter_name"></span></div>
                                    <div class="user_more_inf"> Role: <span class="usre_inf" id="role" ></span> </div>
                                    <div class="user_more_inf"> City: <span class="usre_inf" id="city"></span></div>
                                    
                                    
                                    <div class="user_border"></div>

<p class="user_de">Contact Details</p>
                                    <div class="user_more_inf"> Contact: <span class="usre_inf" id="phone"></span>
                                    </div>
                                    <div class="user_more_inf"> Email: <span class="usre_inf"  id="email"></span>
                                    </div>

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

</div>
                </div>
            </div>
            <div class="col-lg-4 col-md-12 col-sm-12">
                <div class="overview-prom user_details_main"
                    style="box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px;">
                    <p class="user_de">Overview</p>
                    <div class="user_more_inf"> Total Earnings:<span class="usre_inf" id="total_amount"></span> </div>
                    <div class="user_more_inf"> Total Collections:
                        <span class="usre_inf" id="collections"></span>
                    </div>

</div>

</div>
        </div>

</section>

<section>
        <div class="prom_detail mt-5">
            <div class="prom_det">
                <img src='<?php echo base_url("public/assets/images/top-up.png")?>' alt="icon" class="prom_icon">
                <div class="pro_mon" id="total_withdraw"></div>
                <hr style="margin:0">
                <button class="btn btn-success mt-2" id="withdraw">Withdraw</button>
            </div>
            <div class="prom_det">
                <img src='<?php echo base_url("public/assets/images/coin.png")?>' alt="icon" class="prom_icon">
                <div class="pro_mon"  id="collection"></div>
                <hr style="margin:0">
                <p class="peo_par">Collections</p>
            </div>
            <div class="prom_det">
                <img src='<?php echo base_url("public/assets/images/user (7).png")?>' alt="icon" class="prom_icon">
                <div class="pro_mon" id="customer"></div>
                <hr style="margin:0">
                <p class="peo_par">Customers</p>
            </div>
            <div class="prom_det">
                <img src='<?php echo base_url("public/assets/images/borrowing.png")?>' alt="icon" class="prom_icon">
                <div class="pro_mon"  id="repayment_pins">0</div>
                <hr style="margin:0">
                <p class="peo_par">Repayment Pins</p>
            </div>
            <div class="prom_det">
                <img src='<?php echo base_url("public/assets/images/key (3).png")?>' alt="icon" class="prom_icon">
                <div class="pro_mon" id="initial_pins">0</div>
                <hr style="margin:0">
                <p class="peo_par">Initial Pins</p>
            </div>
        </div>
    </section>
    
</div>

</body>

if (response) {
            $('#promoter_name').text(response.name || 'N/A'); 
            $('#city').text(response.city || 'N/A'); 
            $('#phone').text(response.phone || 'N/A'); 
            $('#email').text(response.email || 'N/A'); 
            $('#role').text(response.role_name || 'N/A'); 
            
            $('#total_withdraw').text(response.total_earnings || '0');
            $('#collections').text(response.total_amount || '0'); 
            $('#collection').text(response.total_amount || '0'); 
            $('#total_money').text(response.total_money || '0');
            $('#customer').text(response.total_customers || '0'); 
            $('#repayment_pins').text(response.total_request || '0'); 
            $('#initial_pins').text(response.total_initial || '0'); 
        } else {
            console.error('Error: No data found');
        }
    },
    error: function(xhr, status, error) {
        console.log('Error fetching payment data:', error); // Log any errors
    }
});

</script>

if (response) {
   
            $('#total_withdraw').text(response.total_amount || '0');
             $('#total_amount').text(response.total_amount || '0'); 
      
        } else {
            console.error('Error: No data found');
        }
    },
    error: function(xhr, status, error) {
        console.log('Error fetching payment data:', error); // Log any errors
    }
});

</script>

window.location.href = "<?php echo base_url('withdraw'); ?>";
    });
});
</script>

</html>