@extends('layout.header')
@section('title')
ALIAN | Dashboard
@endsection
@section('main')
<div class="m-grid__item m-grid__item--fluid m-wrapper admin_dashboard sales_dashboard">
    <!-- BEGIN: Subheader -->
    <div class="m-subheader ">
        <div class="d-sm-flex align-items-center subheader_border_bottom">
            <div class="mr-auto">
                <h3 class="m-subheader__title">
                    Dashboard
                </h3>
            </div>

            <div class="m-portlet__head-tools">
                <form class="m-form m-form--fit m-form--label-align-right select_bde">
                    <div class="modal-body">
                        <div class="form-group m-form__group row">
                            <label class="col-form-label">
                                Select BDE
                            </label>
                            <div class="">
                                <select class="form-control m-bootstrap-select m_selectpicker" id="bde_dropdown" onchange="change(); chart1(); chart2(); chart3(); follow_up();">
                                    <option value="0">All</option>
                                    @foreach($users as $user_list)
                                    <option value="{{ $user_list->id }}">{{$user_list->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div>
                <select name="dropdown" id="select1" value="" onchange="change(); chart1(); chart2(); chart3();">
                    <option name="Today" value="Today" selected>Today</option>
                    <option name="Yesterday" value="Yesterday">Yesterday</option>
                    <option name="Last 3 Days" value="Last 3 Days">Last 3 Days</option>
                    <option name="Last 7 Days" value="Last 7 Days">Last 7 Days</option>
                    <option name="Last 30 Days" value="Last 30 Days">Last 30 Days</option>
                    <option name="This Month" value="This Month">This Month</option>
                    <option name="Last Month" value="Last Month">Last Month</option>
                    <option name="This Year" value="This Year">This Year</option>
                    <option name="Last Year" value="Last Year">Last Year</option>
                </select>
            </div>
        </div>
    </div>
    <!-- END: Sub header -->
    <!-- START :: main Content-->
    <div class="m-content">
        {{--@foreach($date as $sale)--}}
        <!-- START :: Top box-->
        <div class="m-portlet top_box">
            <div class="m-portlet__body  m-portlet__body--no-padding dashboard_top">
                <div class="row m-0">
                    <div class="box_main_content">
                        <!--begin::Total Profit-->
                        <div class="box_content">
                            <h6>Total Sellings ({{  $_ENV['APP_MONEY_SYMBOL']  }})</h6> {{--@foreach($price as $price1)--}}
                            <span class="blue_color"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span id="selling_price" ></span></span>
                            {{--@endforeach--}}
                        </div>
                        <!--end::Total Profit-->
                    </div>
                    <div class="box_main_content">
                        <!--begin::Total Collected Amount)-->
                        <div class="box_content">
                            <h6>Total Collected Amount ({{  $_ENV['APP_MONEY_SYMBOL']  }})</h6>
                            <span class="pink_color"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span id="tot_amount"></span> </span>
                        </div>
                        <!--end::Total Collected Amount-->
                    </div>
                    <div class="box_main_content">
                        <!--begin:: Total Pending Amount-->
                        <div class="box_content">
                            <h6> Current Pending Amount({{  $_ENV['APP_MONEY_SYMBOL']  }})</h6>
                            <span class="purple_color"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span id="rem_amount"></span> </span>
                        </div>
                        <!--end::Total Pending Amount-->
                    </div>
                    <div class="box_main_content">
                        <!--begin::Total Pending Orders-->
                        <div class="box_content">
                            <h6>Total Pending Orders</h6>
                            <span class="sky_color"> <span id="orderpending"></span></span>
                        </div>
                        <!--end::Total Pending Orderst-->
                    </div>

                </div>

            </div>
        </div>
        <!-- END :: Top box-->
        <!-- START :: Top box-->
        <div class="top_box">
            <div class="m-portlet__body  m-portlet__body--no-padding">
                <div class="row m-0">
                    <div class="box_main_content">
                        <!--begin::Total Number of Bids-->
                        <div class="box_img">
                            <img src="{{URL::asset('images/user_box_1.png')}}" alt="" />
                        </div>
                        <div class="box_content">
                            <p>Total Number of Bids</p>
                            <span class="blue_font d_custom_bid_count" id="total_bid"></span>
                        </div>
                        <!--end::Total Number of Bids-->
                    </div>
                    <div class="box_main_content">
                        <!--begin::Award Ratio-->
                        <div class="box_img">
                            <img src="{{URL::asset('images/user_box_2.png')}}" alt="" />
                        </div>
                        <div class="box_content">
                            <p>Award Ratio</p>
                            <span class="yellow_font d_custom_award_ratio" id="award_ratio"></span>
                        </div>
                        <!--end::Award Ratio-->
                    </div>
                    <div class="box_main_content">
                        <!--begin:: Lead Ratio-->
                        <div class="box_img">
                            <img src="{{URL::asset('images/user_box_3.png')}}" alt="" />
                        </div>
                        <div class="box_content">
                            <p> Lead</p>
                            <span class="green_font d_custom_lead_ratio" id="lead_count"></span>
                        </div>
                        <!--end::Lead Ratio-->
                    </div>
                    <div class="box_main_content">
                        <!--begin::Lead Conversion Ratio-->
                        <div class="box_img">
                            <img src="{{URL::asset('images/user_box_4.png')}}" alt="" />
                        </div>
                        <div class="box_content">
                            <p>Lead Conversion Ratio</p>
                            <span class="purple_font d_custom_conv_ratio" id="lead_con_ratio"></span>
                        </div>
                        <!--end::Lead Conversion Ratio-->
                    </div>
                    <div class="box_main_content">
                        <!--begin:: Repeat Ratio-->
                        <div class="box_img">
                            <img src="{{URL::asset('images/user_box_5.png')}}" alt="" />
                        </div>
                        <div class="box_content">
                            <p> Repeat Ratio</p>
                            <span class="pink_font"> - </span>
                        </div>
                        <!--end:: Repeat Ratio-->
                    </div>
                    <div class="box_main_content">
                        <!--begin:: No. of connect-->
                        <div class="box_img">
                            <img src="{{URL::asset('images/user_box_6.png')}}" alt="" />
                        </div>
                        <div class="box_content">
                            <p> No. of connect</p>
                            <span class="blue_font d_custom_bid_connect" id="total_bid_connect"></span>
                        </div>
                        <!--end:: No. of connect-->
                    </div>
                </div>
            </div>
        </div>
        <!-- END :: Top box-->
        <!--Begin:: Top Collected Amount & Total Selling Section-->
        <div class="row">
            <div class="col-xl-4 col-4_padding_right">
                <!--begin:: Total Collected Amount-->
                <div class="m-portlet m-portlet--full-height dash_top_collection_amount">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Total Collected Amount
                                </h3>
                            </div>
                        </div>
                        <div class="m-portlet__head-tools">
                            <span class="pink_color">{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id="total_amount"></span></span>
                        </div>
                    </div>
                    <div class="m-portlet__body main_bg_color">
                        <!--begin::Total Collected Amount body-->
                        <div class="m-widget16 d-inline-block">
                            <div class="m-widget16__stats m-0">
                                <div class="m-widget16__visual dashboard_amount_graph">
                                    <div id="m_chart_dashboard_collect_amount" style="height: 215px"></div>
                                </div>
                            </div>

                            <div class="m-widget16__legends d-inline-block">
                                <div class="m-widget16__legend">
                                    <p>Upwork Amount ({{ $_ENV['APP_MONEY_SYMBOL'] }})</p>
                                    <span class="m-widget16__legend-text">
                                        {{  $_ENV['APP_MONEY_SYMBOL']  }}<span id="upwork"></span>
                                    </span>
                                </div>
                                <div class="m-widget16__legend">
                                    <p>PayPal Transfer ({{ $_ENV['APP_MONEY_SYMBOL'] }})</p>
                                    <span class="m-widget16__legend-text">
                                        {{  $_ENV['APP_MONEY_SYMBOL']  }}<span id="paypal"></span>
                                    </span>
                                </div>
                                <div class="m-widget16__legend">
                                    <p>Payoneer Transfer ({{ $_ENV['APP_MONEY_SYMBOL'] }})</p>
                                    <span class="m-widget16__legend-text">
                                        {{  $_ENV['APP_MONEY_SYMBOL']  }}<span id="payoneer"></span>
                                    </span>
                                </div>
                                <div class="m-widget16__legend">
                                    <p>BOB Transfer ({{ $_ENV['APP_MONEY_SYMBOL'] }})</p>
                                    <span class="m-widget16__legend-text">
                                        {{  $_ENV['APP_MONEY_SYMBOL']  }}<span id="bob"></span>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <!--end::Total Collected Amount body-->
                    </div>
                </div>
                <!--end:: Total Collected Amount-->
            </div>
            <div class="col-xl-8 col-8_padding_left">
                <!--begin:: Total Selling -->
                <div class="m-portlet m-portlet--full-height dash_top_collection_amount">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Total sellings
                                </h3>
                            </div>
                        </div>
                    </div>
                    <div class="m-portlet__body main_bg_color dash_total_sell_graph">
                        <!--begin::Total Selling body-->
                        <button class="dash_graph_download text-right d-inline-block p-0" id="dwn-btn">
                            <img src="{{URL::asset('images/dash_download.png')}}" alt="" />
                        </button>
                        <div id="editor"></div>
                        <div id="m_morris_dash" style="height:315px;" data-colors="#29abe2"></div>
                        <!--end::Total Selling body-->
                    </div>
                </div>
                <!--end:: Total Selling -->
            </div>
        </div>
        <!--End:: Top Collected Amount & Total Selling Section-->
        <!--Begin::Section-->
        <div class="row">
            <div class="col-xl-6 col-lg-12">
                <!--Begin::Portlet-->
                <!--begin:: Widgets/Revenue Change-->
                <div class="m-portlet m-portlet--full-height ">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Technology Wise Ratio
                                </h3>
                            </div>
                        </div>
<!--                        <div class="m-portlet__head-tools">
                            <form class="m-form m-form--fit m-form--label-align-right select_bde">
                                <div class="modal-body">
                                    <div class="form-group m-form__group row">
                                        <label class="col-form-label">
                                            Select BDE
                                        </label>
                                        <div class="">
                                            <select class="form-control m-bootstrap-select m_selectpicker" id="d_technology_users_dropdown">
                                                <option value="0">All</option>
                                                @foreach($users as $user_list)
                                                <option value="{{ $user_list->id }}">{{$user_list->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>-->
                    </div>
                    <div class="m-portlet__body technology_graph_section">
                        <div class="m-widget14 technology_graph">
                            <div class="row  align-items-center">
                                <div class="col">
                                    <div class="m-form__group form-group">
                                        <div class="m-radio-inline">
                                            <label class="m-radio">
                                                <input type="radio" name="example_3" value="bid" id="radio_btn_tech_filter" checked="true"> Bids
                                                <span></span>
                                            </label>
                                            <label class="m-radio">
                                                <input type="radio" name="example_3" value="award_ratio" id="radio_btn_tech_filter"> Award Ratio (In %)
                                                <span></span>
                                            </label>
                                            <label class="m-radio">
                                                <input type="radio" name="example_3" value="lead" id="radio_btn_tech_filter"> Lead
                                                <span></span>
                                            </label>
                                            <label class="m-radio">
                                                <input type="radio" name="example_3" value="lead_con_ratio" id="radio_btn_tech_filter"> Lead Conversation Ratio (In %)
                                                <span></span>
                                            </label>
                                            <label class="m-radio">
                                                <input type="radio" name="example_3" value="existing_client" id="radio_btn_tech_filter"> Existing Clients
                                                <span></span>
                                            </label>
                                        </div>
                                    </div>

                                    <!--<div id="m_chart_revenue_change" class="m-widget14__chart1 d_technologies_data" style="height: 336px"></div>-->
                                    <div id="morrischart" class="m-widget14__chart1 d_technologies_data" style="height: 336px"></div>
                                    <div class="m-widget14__legends d_technologies_show">

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--end:: Widgets/Revenue Change-->
                <!--End::Portlet-->
            </div>
            <div class="col-xl-6 col-lg-12 target_graph_section">
                <!--Begin::Portlet-->
                <div class="m-portlet m-portlet--full-height ">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Target
                                </h3>
                            </div>
                        </div>
<!--                        <div class="m-portlet__head-tools">
                            <form class="m-form m-form--fit m-form--label-align-right select_bde">
                                <div class="modal-body">
                                    <div class="form-group m-form__group row">
                                        <label class="col-form-label">
                                            Select BDE
                                        </label>
                                        <div class="">
                                            <select class="form-control m-bootstrap-select m_selectpicker" id="d_target_users_dropdown" onchange="chart3();">
                                                <option value="0">All</option>
                                                @foreach($users as $user_list)
                                                <option value="{{ $user_list->id }}">{{$user_list->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>-->
                    </div>
                    <div class="m-portlet__body">
                        <div class="target_content_main">
                            <div class="target_content">
                                <p>Target</p>
                                <span class="d_target">&#36;0</span>
                            </div>
                            <div class="target_content">
                                <p>Achieved Target</p>
                                <span class="d_arv_target">&#36;0</span>
                            </div>
                            <div class="target_content">
                                <p>Target</p>
                                <div class="m-widget12__progress">
                                    <div class="m-widget12__progress-sm progress m-progress--sm d_target_progressbar">
                                        <div class="m-widget12__progress-bar progress-bar bg-brand" role="progressbar" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <span class="m-widget12__stats d_target_progressbar_percent">
                                        0%
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="target_graph_main">
                            <div id="flot_placeholder_target_custom" class="target_graph_customer"></div>
                        </div>
                        <div class="graph_bottom_title d_custom_graph_title"><span></span></div>
                    </div>
                </div>
                <!--End::Portlet-->
            </div>
        </div>
        <!--End::Section-->
        <!--Begin Total Sell Products & Highest Selling Persons Section-->
        <div class="row">
            <div class="col-xl-8 col-8_padding_right">
                <!--begin:: Total Sell Products -->
                <div class="m-portlet m-portlet--full-height dash_total_sell_product">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Total Sell Products
                                </h3>
                            </div>
                        </div>
                        <div class="m-portlet__head-tools">
                            <a href="#" class="text-uppercase">view all</a>
                        </div>
                    </div>
                    <div class="m-portlet__body main_bg_color">
                        <!--begin:: Total Sell Products body-->
                        <div class="m-widget16 table_style_16">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="m-widget16__head">
                                        <div class="m-widget16__item">
                                            <span class="m-widget16__sceduled">
                                                Products
                                            </span>
                                            <span class="m-widget16__amount m--align-right">
                                                Amount({{  $_ENV['APP_MONEY_SYMBOL']  }})
                                            </span>
                                        </div>
                                    </div>
                                    <div class="m-widget16__body">
                                        <!--begin::widget item-->
                                        <span id="Total_Sell_Products"></span>
                                        <!--end::widget item-->
                                        <!--begin::widget item-->
                                        <span id="other_products"></span>
                                        <!--end::widget item-->
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="m-widget16__stats">
                                        <div class="m-widget16__visual dashboard_total_sell_products_graph">
                                            <div id="m_chart_dashboard_total_sell_products" style="height: 261px"> </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--end:: Total Sell Products body-->
                    </div>
                </div>
                <!--end:: Total Sell Products -->
            </div>
            <div class="col-xl-4 col-4_padding_left">
                <!--begin:: Highest Selling Persons -->
                <div class="m-portlet m-portlet--full-height dash_highest_selling_person_main">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Highest Selling Persons
                                </h3>
                            </div>
                        </div>
                        <div class="m-portlet__head-tools">
                            <a href="#" class="text-uppercase text-blue">view all</a>
                        </div>
                    </div>
                    <div class="m-portlet__body m-widget16 table_style_16 main_bg_color">
                        <!--begin:: Highest Selling Persons body-->
                        <!--begin::Widget 14-->
                        <div class="m-widget16__head">
                            <div class="m-widget16__item">
                                <span class="m-widget16__sceduled">
                                    Name
                                </span>
                                <span class="m-widget16__amount m--align-right">
                                    Amount({{  $_ENV['APP_MONEY_SYMBOL']  }})
                                </span>
                            </div>
                        </div>
                        <div class="m-widget4 dash_highest_selling_person dash_table_style_4">
                            <!--begin::Widget 14 Item-->
                            <span id="highest_salesperson">
                            </span>
                            <!--end::Widget 14 Item-->
                        </div>
                        <!--end::Widget 14-->
                        <!--end:: Highest Selling Persons body-->
                    </div>
                </div>
                <!--end:: Highest Selling Persons -->
            </div>
        </div>
        <!--End:: Total Sell Products & Highest Selling Persons Section-->
        <!--Begin:: Most Valuable Customers & Highest Selling Products Section-->
        <div class="row">
            <div class="col-xl-4 col-4_padding_right">
                <!--begin:: Most Valuable Customers -->
                <div class="m-portlet m-portlet--full-height dash_most_valuable_customers">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Most Valuable Customers
                                </h3>
                            </div>
                        </div>
                        <div class="m-portlet__head-tools">
                            <a href="#" class="text-uppercase">view all</a>
                        </div>
                    </div>
                    <div class="m-portlet__body m-widget16 table_style_16 main_bg_color">
                        <!--begin:: Most Valuable Customers body-->
                        <!--begin::Widget 14-->
                        <div class="m-widget16__head">
                            <div class="m-widget16__item">
                                <span class="m-widget16__sceduled">
                                    Name
                                </span>
                                <span class="m-widget16__amount m--align-right">
                                    Amount({{  $_ENV['APP_MONEY_SYMBOL']  }})
                                </span>
                            </div>
                        </div>
                        <div class="m-widget4 dash_table_style_4">
                            <!--begin::Widget 14 Item-->
                            <span id="Most_Valuable_Customers"> </span>
                            <!--end::Widget 14 Item-->
                        </div>
                        <!--end::Widget 14-->
                        <!--end:: Most Valuable Customers body-->
                    </div>
                </div>
                <!--end:: Most Valuable Customers -->
            </div>
            <div class="col-xl-8 col-8_padding_left">
                <!--begin:: Highest Selling Products -->
                <div class="m-portlet m-portlet--full-height dash_highest_selling_products">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Highest Selling Products
                                </h3>
                            </div>
                        </div>
                        <div class="m-portlet__head-tools">
                            <a href="#" class="text-uppercase">view all</a>
                        </div>
                    </div>
                    <div class="m-portlet__body m-widget16 table_style_16 main_bg_color">
                        <!--begin:: Highest Selling Products body-->
                        <!--begin::Widget 14-->
                        <div class="m-widget16__head">
                            <div class="m-widget16__item">
                                <span class="m-widget16__sceduled">
                                    Product
                                </span>
                                <span class="m-widget16__pro_qty">
                                    Product Qty
                                </span>
                                <span class="m-widget16__amount m--align-right">
                                    Amount({{  $_ENV['APP_MONEY_SYMBOL']  }})
                                </span>
                            </div>
                        </div>
                        <div class="m-widget4 dash_table_style_4">
                            <!--begin::Widget 14 Item-->
                            <span id="Highest_Selling_Products"></span>
                            <!--end::Widget 14 Item-->
                        </div>
                        <!--end::Widget 14-->
                        <!--end:: Highest Selling Products body-->
                    </div>
                </div>
                <!--end:: Highest Selling Products -->
            </div>
        </div>
        <!--End:: Most Valuable Customers & Highest Selling Products Section-->
        <!--Begin::Section-->
        <div class="row">
            <div class="col-xl-12">
                <!--begin:: Widgets/Best Sellers-->
                <div class="m-portlet m-portlet--full-height table_style table_select">
                    <div class="m-portlet__head">
                        <div class="m-portlet__head-caption">
                            <div class="m-portlet__head-title">
                                <h3 class="m-portlet__head-text">
                                    Project(s) Follow Up
                                </h3>
                            </div>
                        </div>
                        <div class="m-portlet__head-tools head_width">
                            <ul class="nav nav-pills nav-pills--brand m-nav-pills--align-right m-nav-pills--btn-pill m-nav-pills--btn-sm" role="tablist" id="myTab">
                                <li class="nav-item m-tabs__item">
                                    <a class="nav-link m-tabs__link active" data-toggle="tab" href="#m_widget11_tab1_content" role="tab">
                                        Today’s
                                    </a>
                                </li>
                                <li class="nav-item m-tabs__item">
                                    <a class="nav-link m-tabs__link" data-toggle="tab" href="#m_widget11_tab2_content" role="tab">
                                        Tomorrow
                                    </a>
                                </li>
                            </ul>
<!--                            <form class="m-form m-form--fit m-form--label-align-right select_bde" method="get" action="dashboard-manager">
                                <div class="modal-body">
                                    <div class="form-group m-form__group row">
                                        <label class="col-form-label">
                                            Select BDE
                                        </label>
                                        <div class="">
                                            <select class="form-control m-bootstrap-select m_selectpicker" id="dt_custom_user_list" name="filter_username">
                                                <option value="0">All</option>
                                                @foreach($users as $user_list)
                                                <option value="{{ $user_list->id }}">{{$user_list->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </form>-->
                        </div>

                    </div>
                    <div class="followup">
                    <div class="m-portlet__body">
                        <!--Begin::Tab Content-->
                        <div class="tab-content">
                            <!--begin::tab 1 content-->
                           
                            <div class="tab-pane active  today_bid_data" id="m_widget11_tab1_content">
                                @include('Sales/DashboardManagerTData')
                            </div>
                        
                            <!--end::tab 1 content-->
                            <!--begin::tab 2 content-->
                         
                            <div class="tab-pane yesterday_bid_data" id="m_widget11_tab2_content">
                                @include('Sales/DashboardManagerYData')
                            </div>
                          
                            <!--end::tab 2 content-->
                        </div>
                        <!--End::Tab Content-->
                    </div>
                    </div>    
                </div>
                <!--end:: Widgets/Best Sellers-->
            </div>
        </div>

    </div>
    <!-- END :: main Content-->
</div>
<script type="text/javascript">
    $(document).ready(function () {
        change();
        chart1();
        chart2();
        chart3();
        
        $(document).on('change', '#radio_btn_tech_filter', function () {
            chart2();
        });
    });
</script>

<script>
    function follow_up(){
        var bde_user = document.getElementById("bde_dropdown").value;
        $.ajax({
                type: 'GET',
                url: './dashboard_1',
                data: {
                    
                    bde_user: bde_user
                },
                success: function (data) {
                    debugger;
                   
                    if(data.data==1){
                        
                    }else if(data.data==0){
                        
                        if(data.today!=null){
                            
                            $('#m_widget11_tab1_content').html(data.today);
                        }
                        if(data.yesterday!=null){
                          
                            $('#m_widget11_tab2_content').html(data.yesterday);
                        }
                    }
                   // $('.followup').html(data['html']);
                    
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
    }
</script>
<script>
    function change() {
        $('#highest_salesperson').empty();
        $('#Most_Valuable_Customers').empty();
        $('#Highest_Selling_Products').empty();
        $('#Total_Sell_Products').empty();
        $('#other_products').empty();
        $("#m_chart_dashboard_collect_amount").empty();
        $('#total_bid').empty();
        $('#lead_count').empty();
        $('#total_bid_connect').empty();
        $("#lead_con_ratio").empty();
        $("#award_ratio").empty();
        var date = get_date();
        debugger;
        var ab = document.getElementById("select1").value;
        var bde_user = document.getElementById("bde_dropdown").value;
        if (ab === 'Today' || ab === 'Yesterday') {
            $.ajax({
                type: 'GET',
                url: './given_date',
                data: {
                    date: date,
                    bde_user: bde_user
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    document.getElementById("tot_amount").innerHTML = data.dashboard[0].price;
                    document.getElementById("selling_price").innerHTML = data.dashboard[0].sellingprice;
                    document.getElementById("rem_amount").innerHTML = data.dashboard[0].remamount;
                    document.getElementById("orderpending").innerHTML = data.dashboard[0].pendingorder;
                    document.getElementById("total_amount").innerHTML = data.dashboard[0].price;
                    document.getElementById("paypal").innerHTML = data.dashboard[0].paypal;
                    document.getElementById("upwork").innerHTML = data.dashboard[0].upwork;
                    document.getElementById("payoneer").innerHTML = data.dashboard[0].payoneer;
                    document.getElementById("bob").innerHTML = data.dashboard[0].bob;
                    document.getElementById("total_bid").innerHTML = data.total_bid;
                    document.getElementById("lead_count").innerHTML = data.lead_count;
                    document.getElementById("total_bid_connect").innerHTML = data.total_bid_connect;
                    document.getElementById("award_ratio").innerHTML = data.award_ratio + '%';
                    document.getElementById("lead_con_ratio").innerHTML = data.winnerCount + ' (' + data.lead_con_ratio + '%)';
                    console.log("data today", data);
                    // Initialize charts

                    let chartData = data.product.map((el) => {
                        if (el.product_name == null || el.product_name == '')
                            el.product_name = 'Unassign';
                        return {
                            label: el.product_name,
                            value: el.amount
                        }
                    });
                    chartData.sort(function (a, b) {
                        return b.value - a.value
                    })

                    let finalChartData = []
                    if (chartData.length > 5) {
                        let sum = 0
                        for (let i = 5; i < chartData.length; i++)
                            sum += chartData[i].value

                        for (let i = 0; i < 5; i++)
                            finalChartData[i] = chartData[i]

                        finalChartData.push({
                            label: 'Other Products',
                            value: sum
                        })
                    } else
                        finalChartData = chartData

                    console.log(finalChartData)
                    $("#m_chart_dashboard_total_sell_products").empty();
                    $("#m_chart_dashboard_total_sell_products").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_total_sell_products",
                        data: finalChartData,
                        resize: true,
                        labelColor: "#a7a7c2",
                        colors: [mApp.getColor("dash_sell_red"), mApp.getColor("dash_sell_green"), mApp.getColor("dash_sell_puple"), mApp.getColor("dash_sell_sky"), mApp.getColor("dash_sell_yellow"), mApp.getColor("dash_sell_black")]
                    });
                    let bardata = [{
                            y: data.data,
                            a: data.dashboard[0].sellingprice,
                            b: data.dashboard[0].asprice
                        }]
                    //DASH CHART
                     $("#m_morris_dash").empty();
                    Morris.Bar({
                        element: "m_morris_dash",
                        data: bardata.reverse(),
                        xkey: "y",
                        ykeys: ["a","b"],
                        labels: ["Fix(In $)","Hourly(In $)"],
                        stacked:true,
                        resize:true,
                        pointFillColors:['#ffffff'],
                        barColors: ['#F0136A','#1367F0'],
                        
                        barSizeRatio: 0.75,
                        barGap: 3,
                        xLabelAngle: 60
                    });
                    let i = 0;
                    console.log("Before for");
                    // console.log(data.valueable_customer);

                    for (i = 0; i < data.size_users; i++) {
                        $("#highest_salesperson").append(" <div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__img m-widget4__img--pic\">\n" +
                                "\n" +
                                "                                        <img src=\"sales_images/" + data.users[i].profile_image + "\" onerror=\"this.src='sales_images/IMG1550210555_images.png'\">\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\" id=\"user_name" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\" id=\"user_city" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\" >\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}</span>" + "<span id=\"user_total" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("user_name" + i).innerHTML = data.users[i].name;
                        document.getElementById("user_city" + i).innerHTML = data.users[i].user_city;
                        document.getElementById("user_total" + i).innerHTML = Math.round(data.users[i].total);
                    }

                    for (i = 0; i < data.size_valuable_customer; i++) {
                        $("#Most_Valuable_Customers").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\">\n" +
                                "                                                        <span id=\"store_name" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\">\n" +
                                "                                                        <span id=\"store_city" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"store_amount" + i + "\"></span></span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("store_name" + i).innerHTML = data.valuable_customer[i].store_name;
                        document.getElementById("store_city" + i).innerHTML = data.valuable_customer[i].store_city;
                        document.getElementById("store_amount" + i).innerHTML = data.valuable_customer[i].amount;
                    }

                    for (i = 0; i < data.size_highest_selling_product; i++) {
                        $("#Highest_Selling_Products").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info product\">\n" +
                                "                                        <a class=\"m-widget4__title\" href=\"#\">\n" +
                                "                                            <span id=\"product_name" + i + "\"></span>\n" +
                                "                                        </a>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub product_qty\">\n" +
                                "                                                        <span id=\"product_category" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info product_amount\">\n" +
                                "                                        <span id=\"product_quantity" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"product_amount" + i + "\" </span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        if (data.highest_selling_product[i].product_name == null || data.highest_selling_product[i].product_name == '')
                            data.highest_selling_product[i].product_name = 'Unassign';
                        document.getElementById("product_name" + i).innerHTML = data.highest_selling_product[i].product_name;
                        document.getElementById("product_category" + i).innerHTML = data.highest_selling_product[i].category;
                        document.getElementById("product_quantity" + i).innerHTML = data.highest_selling_product[i].quantity;
                        document.getElementById("product_amount" + i).innerHTML = data.highest_selling_product[i].amount;
                    }

                    var clr = ["background_pink", "background_green", "background_purple", "background_sky", "background_yellow"];
                    if (data.size_product <= 5) {
                        for (i = 0; i < data.size_product; i++) {
                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                    } else {
                        var other_product = 0;
                        for (i = 0; i < 5; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                        for (i = 5; i < data.size_product; i++) {
                            other_product += data.product[i].amount;
                        }
                        console.log(data.product);
                        $("#other_products").append("<div class=\"m-widget16__item\">\n" +
                                "                                                            <span class=\"m-widget16__date\">\n" +
                                "                                                                Other Products\n" +
                                "                                                            </span>\n" +
                                "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                "                                                                <span class=\"amount_style\">  {{  $_ENV['APP_MONEY_SYMBOL']  }} <span style='color: white' id=\"other_product\"></span></span>\n" +
                                "                                                            </span>\n" +
                                "                                            </div>");
                        document.getElementById("other_product").innerHTML = other_product;
                    }
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }

        if (ab === 'Last 3 Days') {
            $.ajax({
                type: 'GET',
                url: './last_3_days',
                data: {
                    date: date,
                    bde_user: bde_user
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    // console.log('hi');
                    console.log("data last 3 days ", data);
                    document.getElementById("tot_amount").innerHTML = data.price;
                    document.getElementById("selling_price").innerHTML = data.sellingprice;
                    document.getElementById("rem_amount").innerHTML = data.remamount;
                    document.getElementById("orderpending").innerHTML = data.pendingorder;
                    document.getElementById("total_amount").innerHTML = data.price;
                    document.getElementById("paypal").innerHTML = data.paypal;
                    document.getElementById("upwork").innerHTML = data.upwork;
                    document.getElementById("payoneer").innerHTML = data.payoneer;
                    document.getElementById("bob").innerHTML = data.bob;
                    document.getElementById("total_bid").innerHTML = data.total_bid;
                    document.getElementById("lead_count").innerHTML = data.lead_count;
                    document.getElementById("total_bid_connect").innerHTML = data.total_bid_connect;
                    document.getElementById("award_ratio").innerHTML = data.award_ratio + '%';
                    document.getElementById("lead_con_ratio").innerHTML = data.winnerCount + ' (' + data.lead_con_ratio + '%)';
                    // Initialize charts

                    let chartData = data.product.map((el) => {
                        if (el.product_name == null || el.product_name == '')
                            el.product_name = 'Unassign';
                        return {
                            label: el.product_name,
                            value: el.amount
                        }
                    })

                    chartData.sort(function (a, b) {
                        return b.value - a.value
                    })

                    let finalChartData = []
                    if (chartData.length > 5) {
                        let sum = 0
                        for (let i = 5; i < chartData.length; i++)
                            sum += chartData[i].value

                        for (let i = 0; i < 5; i++)
                            finalChartData[i] = chartData[i]

                        finalChartData.push({
                            label: 'Other Products',
                            value: sum
                        })
                    } else
                        finalChartData = chartData

                    console.log(finalChartData)
                    $("#m_chart_dashboard_total_sell_products").empty();
                    $("#m_chart_dashboard_total_sell_products").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_total_sell_products",
                        data: finalChartData,
                        resize: true,
                        labelColor: "#a7a7c2",
                        colors: [mApp.getColor("dash_sell_red"), mApp.getColor("dash_sell_green"), mApp.getColor("dash_sell_puple"), mApp.getColor("dash_sell_sky"), mApp.getColor("dash_sell_yellow"), mApp.getColor("dash_sell_black")]
                    });
                    //BAR CHART

                    let bardata = data.sPrice

                    $("#m_morris_dash").empty();
                    Morris.Bar({
                        element: "m_morris_dash",
                        data: bardata.reverse(),
                        xkey: "y",
                        ykeys: ["a","b"],
                        labels: ["Fix(In $)","Hourly(In $)"],
                        stacked:true,
                        resize:true,
                        pointFillColors:['#ffffff'],
                        barColors: ['#F0136A','#1367F0'],
                        
                        barSizeRatio: 0.75,
                        barGap: 3,
                        xLabelAngle: 60
                    });
                    let i = 0;
                    console.log("Before for");
                    // console.log(data.valueable_customer);

                    for (i = 0; i < data.size_users; i++) {
                        $("#highest_salesperson").append(" <div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__img m-widget4__img--pic\">\n" +
                                "\n" +
                                "                                        <img src=\"sales_images/" + data.users[i].profile_image + "\" onerror=\"this.src='sales_images/IMG1550210555_images.png'\">\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\" id=\"user_name" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\" id=\"user_city" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\" >\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}</span>" + "<span id=\"user_total" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("user_name" + i).innerHTML = data.users[i].name;
                        document.getElementById("user_city" + i).innerHTML = data.users[i].user_city;
                        document.getElementById("user_total" + i).innerHTML = Math.round(data.users[i].total);
                    }

                    for (i = 0; i < data.size_valuable_customer; i++) {
                        $("#Most_Valuable_Customers").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\">\n" +
                                "                                                        <span id=\"store_name" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\">\n" +
                                "                                                        <span id=\"store_city" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"store_amount" + i + "\"></span></span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("store_name" + i).innerHTML = data.valuable_customer[i].store_name;
                        document.getElementById("store_city" + i).innerHTML = data.valuable_customer[i].store_city;
                        document.getElementById("store_amount" + i).innerHTML = data.valuable_customer[i].amount;
                    }

                    for (i = 0; i < data.size_highest_selling_product; i++) {
                        $("#Highest_Selling_Products").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info product\">\n" +
                                "                                        <a class=\"m-widget4__title\" href=\"#\">\n" +
                                "                                            <span id=\"product_name" + i + "\"></span>\n" +
                                "                                        </a>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub product_qty\">\n" +
                                "                                                        <span id=\"product_category" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info product_amount\">\n" +
                                "                                        <span id=\"product_quantity" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"product_amount" + i + "\" </span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        if (data.highest_selling_product[i].product_name == null || data.highest_selling_product[i].product_name == '')
                            data.highest_selling_product[i].product_name = 'Unassign';
                        document.getElementById("product_name" + i).innerHTML = data.highest_selling_product[i].product_name;
                        document.getElementById("product_category" + i).innerHTML = data.highest_selling_product[i].category;
                        document.getElementById("product_quantity" + i).innerHTML = data.highest_selling_product[i].quantity;
                        document.getElementById("product_amount" + i).innerHTML = data.highest_selling_product[i].amount;
                    }

                    var clr = ["background_pink", "background_green", "background_purple", "background_sky", "background_yellow"];
                    // console.log(clr);
                    if (data.size_product <= 5) {
                        for (i = 0; i < data.size_product; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                    } else {
                        var other_product = 0;
                        for (i = 0; i < 5; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }

                        for (i = 5; i < data.size_product; i++) {
                            other_product += data.product[i].amount;
                        }
                        $("#other_products").append("<div class=\"m-widget16__item\">\n" +
                                "                                                            <span class=\"m-widget16__date\">\n" +
                                "                                                                Other Products\n" +
                                "                                                            </span>\n" +
                                "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                "                                                                <span class=\"amount_style\">  {{  $_ENV['APP_MONEY_SYMBOL']  }} <span style='color: white' id=\"other_product\"></span></span>\n" +
                                "                                                            </span>\n" +
                                "                                            </div>");
                        document.getElementById("other_product").innerHTML = other_product;
                    }
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }

        if (ab === 'Last 7 Days') {
         
            $.ajax({
                type: 'GET',
                url: './last_7_days',
                data: {
                    date: date,
                    bde_user: bde_user
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    console.log("last 7 days ", data);
                    document.getElementById("tot_amount").innerHTML = data.price;
                    document.getElementById("selling_price").innerHTML = data.sellingprice;
                    document.getElementById("rem_amount").innerHTML = data.remamount;
                    document.getElementById("orderpending").innerHTML = data.pendingorder;
                    document.getElementById("total_amount").innerHTML = data.price;
                    document.getElementById("paypal").innerHTML = data.paypal;
                    document.getElementById("upwork").innerHTML = data.upwork;
                    document.getElementById("payoneer").innerHTML = data.payoneer;
                    document.getElementById("bob").innerHTML = data.bob;
                    document.getElementById("total_bid").innerHTML = data.total_bid;
                    document.getElementById("lead_count").innerHTML = data.lead_count;
                    document.getElementById("total_bid_connect").innerHTML = data.total_bid_connect;
                    document.getElementById("award_ratio").innerHTML = data.award_ratio + '%';
                    document.getElementById("lead_con_ratio").innerHTML = data.winnerCount + ' (' + data.lead_con_ratio + '%)';
                    // Initialize charts

                    let chartData = data.product.map((el) => {
                        if (el.product_name == null || el.product_name == '')
                            el.product_name = 'Unassign';
                        return {
                            label: el.product_name,
                            value: el.amount
                        }
                    })

                    chartData.sort(function (a, b) {
                        return b.value - a.value
                    })

                    let finalChartData = []
                    if (chartData.length > 5) {
                        let sum = 0
                        for (let i = 5; i < chartData.length; i++)
                            sum += chartData[i].value

                        for (let i = 0; i < 5; i++)
                            finalChartData[i] = chartData[i]

                        finalChartData.push({
                            label: 'Other Products',
                            value: sum
                        })
                    } else
                        finalChartData = chartData

                    console.log(finalChartData)
                    $("#m_chart_dashboard_total_sell_products").empty();
                    $("#m_chart_dashboard_total_sell_products").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_total_sell_products",
                        data: finalChartData,
                        resize: true,
                        labelColor: "#a7a7c2",
                        colors: [mApp.getColor("dash_sell_red"), mApp.getColor("dash_sell_green"), mApp.getColor("dash_sell_puple"), mApp.getColor("dash_sell_sky"), mApp.getColor("dash_sell_yellow"), mApp.getColor("dash_sell_black")]
                    });
                    //BAR CHART

                    let bardata = data.sPrices

                   $("#m_morris_dash").empty();
                    Morris.Bar({
                        element: "m_morris_dash",
                        data: bardata.reverse(),
                        xkey: "y",
                        ykeys: ["a","b"],
                        labels: ["Fix(In $)","Hourly(In $)"],
                        stacked:true,
                        resize:true,
                        pointFillColors:['#ffffff'],
                        barColors: ['#F0136A','#1367F0'],
                        
                        barSizeRatio: 0.75,
                        barGap: 3,
                        xLabelAngle: 60
                    });
                    let i = 0;
                    console.log("Before for");
                    // console.log(data.valueable_customer);

                    for (i = 0; i < data.size_users; i++) {
                        $("#highest_salesperson").append(" <div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__img m-widget4__img--pic\">\n" +
                                "\n" +
                                "                                        <img src=\"sales_images/" + data.users[i].profile_image + "\" onerror=\"this.src='sales_images/IMG1550210555_images.png'\">\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\" id=\"user_name" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\" id=\"user_city" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\" >\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}</span>" + "<span id=\"user_total" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("user_name" + i).innerHTML = data.users[i].name;
                        document.getElementById("user_city" + i).innerHTML = data.users[i].user_city;
                        document.getElementById("user_total" + i).innerHTML = Math.round(data.users[i].total);
                    }

                    for (i = 0; i < data.size_valuable_customer; i++) {
                        $("#Most_Valuable_Customers").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\">\n" +
                                "                                                        <span id=\"store_name" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\">\n" +
                                "                                                        <span id=\"store_city" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"store_amount" + i + "\"></span></span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("store_name" + i).innerHTML = data.valuable_customer[i].store_name;
                        document.getElementById("store_city" + i).innerHTML = data.valuable_customer[i].store_city;
                        document.getElementById("store_amount" + i).innerHTML = data.valuable_customer[i].amount;
                    }

                    for (i = 0; i < data.size_highest_selling_product; i++) {
                        $("#Highest_Selling_Products").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info product\">\n" +
                                "                                        <a class=\"m-widget4__title\" href=\"#\">\n" +
                                "                                            <span id=\"product_name" + i + "\"></span>\n" +
                                "                                        </a>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub product_qty\">\n" +
                                "                                                        <span id=\"product_category" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info product_amount\">\n" +
                                "                                        <span id=\"product_quantity" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"product_amount" + i + "\" </span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        if (data.highest_selling_product[i].product_name == null || data.highest_selling_product[i].product_name == '')
                            data.highest_selling_product[i].product_name = 'Unassign';
                        document.getElementById("product_name" + i).innerHTML = data.highest_selling_product[i].product_name;
                        document.getElementById("product_category" + i).innerHTML = data.highest_selling_product[i].category;
                        document.getElementById("product_quantity" + i).innerHTML = data.highest_selling_product[i].quantity;
                        document.getElementById("product_amount" + i).innerHTML = data.highest_selling_product[i].amount;
                    }

                    var clr = ["background_pink", "background_green", "background_purple", "background_sky", "background_yellow"];
                    if (data.size_product <= 5) {
                        for (i = 0; i < data.size_product; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                    } else {
                        var other_product = 0;
                        for (i = 0; i < 5; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                        for (i = 5; i < data.size_product; i++) {
                            other_product += data.product[i].amount;
                        }

                        $("#other_products").append("<div class=\"m-widget16__item\">\n" +
                                "                                                            <span class=\"m-widget16__date\">\n" +
                                "                                                                Other Products\n" +
                                "                                                            </span>\n" +
                                "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                "                                                                <span class=\"amount_style\">  {{  $_ENV['APP_MONEY_SYMBOL']  }} <span style='color: white' id=\"other_product\"></span></span>\n" +
                                "                                                            </span>\n" +
                                "                                            </div>");
                        document.getElementById("other_product").innerHTML = other_product;
                    }
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }

        if (ab === 'Last 30 Days') {
            $.ajax({
                type: 'GET',
                url: './last_30_days',
                data: {
                    date: date,
                    bde_user: bde_user
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    console.log("last 30 days: ", data);
                    document.getElementById("tot_amount").innerHTML = data.price;
                    document.getElementById("selling_price").innerHTML = data.sellingprice;
                    document.getElementById("rem_amount").innerHTML = data.remamount;
                    document.getElementById("orderpending").innerHTML = data.pendingorder;
                    document.getElementById("total_amount").innerHTML = data.price;
                    document.getElementById("paypal").innerHTML = data.paypal;
                    document.getElementById("upwork").innerHTML = data.upwork;
                    document.getElementById("payoneer").innerHTML = data.payoneer;
                    document.getElementById("bob").innerHTML = data.bob;
                    document.getElementById("total_bid").innerHTML = data.total_bid;
                    document.getElementById("lead_count").innerHTML = data.lead_count;
                    document.getElementById("total_bid_connect").innerHTML = data.total_bid_connect;
                    document.getElementById("award_ratio").innerHTML = data.award_ratio + '%';
                    document.getElementById("lead_con_ratio").innerHTML = data.winnerCount + ' (' + data.lead_con_ratio + '%)';
                    // Initialize charts

                    let chartData = data.product.map((el) => {
                        if (el.product_name == null || el.product_name == '')
                            el.product_name = 'Unassign';
                        return {
                            label: el.product_name,
                            value: el.amount
                        }
                    })

                    chartData.sort(function (a, b) {
                        return b.value - a.value
                    })

                    let finalChartData = []
                    if (chartData.length > 5) {
                        let sum = 0
                        for (let i = 5; i < chartData.length; i++)
                            sum += chartData[i].value

                        for (let i = 0; i < 5; i++)
                            finalChartData[i] = chartData[i]

                        finalChartData.push({
                            label: 'Other Products',
                            value: sum
                        })
                    } else
                        finalChartData = chartData

                    console.log(finalChartData)
                    $("#m_chart_dashboard_total_sell_products").empty();
                    $("#m_chart_dashboard_total_sell_products").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_total_sell_products",
                        data: finalChartData,
                        resize: true,
                        labelColor: "#a7a7c2",
                        colors: [mApp.getColor("dash_sell_red"), mApp.getColor("dash_sell_green"), mApp.getColor("dash_sell_puple"), mApp.getColor("dash_sell_sky"), mApp.getColor("dash_sell_yellow"), mApp.getColor("dash_sell_black")]
                    });
                    let bardata = data.sPrices
                    //DASH CHART
                     $("#m_morris_dash").empty();
                    Morris.Bar({
                        element: "m_morris_dash",
                        data: bardata.reverse(),
                        xkey: "y",
                        ykeys: ["a","b"],
                        labels: ["Fix(In $)","Hourly(In $)"],
                        stacked:true,
                        resize:true,
                        pointFillColors:['#ffffff'],
                        barColors: ['#F0136A','#1367F0'],
                        
                        barSizeRatio: 0.75,
                        barGap: 3,
                        xLabelAngle: 60
                    });
                    let i = 0;
                    console.log("Before for");
                    // console.log(data.valueable_customer);

                    for (i = 0; i < data.size_users; i++) {
                        $("#highest_salesperson").append(" <div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__img m-widget4__img--pic\">\n" +
                                "\n" +
                                "                                        <img src=\"sales_images/" + data.users[i].profile_image + "\" onerror=\"this.src='sales_images/IMG1550210555_images.png'\">\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\" id=\"user_name" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\" id=\"user_city" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\" >\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}</span>" + "<span id=\"user_total" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("user_name" + i).innerHTML = data.users[i].name;
                        document.getElementById("user_city" + i).innerHTML = data.users[i].user_city;
                        document.getElementById("user_total" + i).innerHTML = Math.round(data.users[i].total);
                    }

                    for (i = 0; i < data.size_valuable_customer; i++) {
                        $("#Most_Valuable_Customers").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\">\n" +
                                "                                                        <span id=\"store_name" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\">\n" +
                                "                                                        <span id=\"store_city" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"store_amount" + i + "\"></span></span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("store_name" + i).innerHTML = data.valuable_customer[i].store_name;
                        document.getElementById("store_city" + i).innerHTML = data.valuable_customer[i].store_city;
                        document.getElementById("store_amount" + i).innerHTML = data.valuable_customer[i].amount;
                    }

                    for (i = 0; i < data.size_highest_selling_product; i++) {
                        $("#Highest_Selling_Products").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info product\">\n" +
                                "                                        <a class=\"m-widget4__title\" href=\"#\">\n" +
                                "                                            <span id=\"product_name" + i + "\"></span>\n" +
                                "                                        </a>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub product_qty\">\n" +
                                "                                                        <span id=\"product_category" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info product_amount\">\n" +
                                "                                        <span id=\"product_quantity" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"product_amount" + i + "\" </span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        if (data.highest_selling_product[i].product_name == null || data.highest_selling_product[i].product_name == '')
                            data.highest_selling_product[i].product_name = 'Unassign';
                        document.getElementById("product_name" + i).innerHTML = data.highest_selling_product[i].product_name;
                        document.getElementById("product_category" + i).innerHTML = data.highest_selling_product[i].category;
                        document.getElementById("product_quantity" + i).innerHTML = data.highest_selling_product[i].quantity;
                        document.getElementById("product_amount" + i).innerHTML = data.highest_selling_product[i].amount;
                    }

                    var clr = ["background_pink", "background_green", "background_purple", "background_sky", "background_yellow"];
                    if (data.size_product <= 5) {
                        for (i = 0; i < data.size_product; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                    } else {
                        var other_product = 0;
                        for (i = 0; i < 5; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                        for (i = 5; i < data.size_product; i++) {
                            other_product += data.product[i].amount;
                        }
                        $("#other_products").append("<div class=\"m-widget16__item\">\n" +
                                "                                                            <span class=\"m-widget16__date\">\n" +
                                "                                                                Other Products\n" +
                                "                                                            </span>\n" +
                                "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                "                                                                <span class=\"amount_style\">  {{  $_ENV['APP_MONEY_SYMBOL']  }} <span style='color: white' id=\"other_product\"></span></span>\n" +
                                "                                                            </span>\n" +
                                "                                            </div>");
                        document.getElementById("other_product").innerHTML = other_product;
                    }
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }

        if (ab === 'This Month') {
            $.ajax({
                type: 'GET',
                url: './This_Month',
                data: {
                    date: date,
                    bde_user: bde_user
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    // console.log('hi');
                    console.log(data);
                    document.getElementById("tot_amount").innerHTML = data.price;
                    document.getElementById("selling_price").innerHTML = data.sellingprice;
                    document.getElementById("rem_amount").innerHTML = data.remamount;
                    document.getElementById("orderpending").innerHTML = data.pendingorder;
                    document.getElementById("total_amount").innerHTML = data.price;
                    document.getElementById("paypal").innerHTML = data.paypal;
                    document.getElementById("upwork").innerHTML = data.upwork;
                    document.getElementById("payoneer").innerHTML = data.payoneer;
                    document.getElementById("bob").innerHTML = data.bob;
                    document.getElementById("total_bid").innerHTML = data.total_bid;
                    document.getElementById("lead_count").innerHTML = data.lead_count;
                    document.getElementById("total_bid_connect").innerHTML = data.total_bid_connect;
                    document.getElementById("award_ratio").innerHTML = data.award_ratio + '%';
                    document.getElementById("lead_con_ratio").innerHTML = data.winnerCount + ' (' + data.lead_con_ratio + '%)';
                    // Initialize charts

                    let chartData = data.product.map((el) => {
                        if (el.product_name == null || el.product_name == '')
                            el.product_name = 'Unassign';
                        return {
                            label: el.product_name,
                            value: el.amount
                        }
                    })

                    chartData.sort(function (a, b) {
                        return b.value - a.value
                    })

                    let finalChartData = []
                    if (chartData.length > 5) {
                        let sum = 0
                        for (let i = 5; i < chartData.length; i++)
                            sum += chartData[i].value

                        for (let i = 0; i < 5; i++)
                            finalChartData[i] = chartData[i]

                        finalChartData.push({
                            label: 'Other Products',
                            value: sum
                        })
                    } else
                        finalChartData = chartData

                    console.log(finalChartData)
                    $("#m_chart_dashboard_total_sell_products").empty();
                    $("#m_chart_dashboard_total_sell_products").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_total_sell_products",
                        data: finalChartData,
                        resize: true,
                        labelColor: "#a7a7c2",
                        colors: [mApp.getColor("dash_sell_red"), mApp.getColor("dash_sell_green"), mApp.getColor("dash_sell_puple"), mApp.getColor("dash_sell_sky"), mApp.getColor("dash_sell_yellow"), mApp.getColor("dash_sell_black")]
                    });
                    let bardata = data.sPrices

                     $("#m_morris_dash").empty();
                    Morris.Bar({
                        element: "m_morris_dash",
                        data: bardata.reverse(),
                        xkey: "y",
                        ykeys: ["a","b"],
                        labels: ["Fix(In $)","Hourly(In $)"],
                        stacked:true,
                        resize:true,
                        pointFillColors:['#ffffff'],
                        barColors: ['#F0136A','#1367F0'],
                        
                        barSizeRatio: 0.75,
                        barGap: 3,
                        xLabelAngle: 60
                    });
                    let i = 0;
                    console.log("Before for");
                    // console.log(data.valueable_customer);

                    for (i = 0; i < data.size_users; i++) {
                        $("#highest_salesperson").append(" <div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__img m-widget4__img--pic\">\n" +
                                "\n" +
                                "                                        <img src=\"sales_images/" + data.users[i].profile_image + "\" onerror=\"this.src='sales_images/IMG1550210555_images.png'\">\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\" id=\"user_name" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\" id=\"user_city" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\" >\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}</span>" + "<span id=\"user_total" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("user_name" + i).innerHTML = data.users[i].name;
                        document.getElementById("user_city" + i).innerHTML = data.users[i].user_city;
                        document.getElementById("user_total" + i).innerHTML = Math.round(data.users[i].total);
                    }

                    for (i = 0; i < data.size_valuable_customer; i++) {
                        $("#Most_Valuable_Customers").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\">\n" +
                                "                                                        <span id=\"store_name" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\">\n" +
                                "                                                        <span id=\"store_city" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"store_amount" + i + "\"></span></span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("store_name" + i).innerHTML = data.valuable_customer[i].store_name;
                        document.getElementById("store_city" + i).innerHTML = data.valuable_customer[i].store_city;
                        document.getElementById("store_amount" + i).innerHTML = data.valuable_customer[i].amount;
                    }

                    for (i = 0; i < data.size_highest_selling_product; i++) {
                        $("#Highest_Selling_Products").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info product\">\n" +
                                "                                        <a class=\"m-widget4__title\" href=\"#\">\n" +
                                "                                            <span id=\"product_name" + i + "\"></span>\n" +
                                "                                        </a>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub product_qty\">\n" +
                                "                                                        <span id=\"product_category" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info product_amount\">\n" +
                                "                                        <span id=\"product_quantity" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"product_amount" + i + "\" </span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        if (data.highest_selling_product[i].product_name == null || data.highest_selling_product[i].product_name == '')
                            data.highest_selling_product[i].product_name = 'Unassign';
                        document.getElementById("product_name" + i).innerHTML = data.highest_selling_product[i].product_name;
                        document.getElementById("product_category" + i).innerHTML = data.highest_selling_product[i].category;
                        document.getElementById("product_quantity" + i).innerHTML = data.highest_selling_product[i].quantity;
                        document.getElementById("product_amount" + i).innerHTML = data.highest_selling_product[i].amount;
                    }

                    var clr = ["background_pink", "background_green", "background_purple", "background_sky", "background_yellow"];
                    if (data.size_product <= 5) {
                        for (i = 0; i < data.size_product; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                    } else {
                        var other_product = 0;
                        for (i = 0; i < 5; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                        for (i = 5; i < data.size_product; i++) {
                            other_product += data.product[i].amount;
                        }

                        $("#other_products").append("<div class=\"m-widget16__item\">\n" +
                                "                                                            <span class=\"m-widget16__date\">\n" +
                                "                                                                Other Products\n" +
                                "                                                            </span>\n" +
                                "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                "                                                                <span class=\"amount_style\">  {{  $_ENV['APP_MONEY_SYMBOL']  }} <span style='color: white' id=\"other_product\"></span></span>\n" +
                                "                                                            </span>\n" +
                                "                                            </div>");
                        document.getElementById("other_product").innerHTML = other_product;
                    }
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }

        if (ab === 'Last Month') {
            $.ajax({
                type: 'GET',
                url: './Last_Month',
                data: {
                    date: date,
                    bde_user: bde_user
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    // console.log('hi');
                    // console.log(data);
                    document.getElementById("tot_amount").innerHTML = data.price;
                    document.getElementById("selling_price").innerHTML = data.sellingprice;
                    document.getElementById("rem_amount").innerHTML = data.remamount;
                    document.getElementById("orderpending").innerHTML = data.pendingorder;
                    document.getElementById("total_amount").innerHTML = data.price;
                    document.getElementById("paypal").innerHTML = data.paypal;
                    document.getElementById("upwork").innerHTML = data.upwork;
                    document.getElementById("payoneer").innerHTML = data.payoneer;
                    document.getElementById("bob").innerHTML = data.bob;
                    document.getElementById("total_bid").innerHTML = data.total_bid;
                    document.getElementById("lead_count").innerHTML = data.lead_count;
                    document.getElementById("total_bid_connect").innerHTML = data.total_bid_connect;
                    document.getElementById("award_ratio").innerHTML = data.award_ratio + '%';
                    document.getElementById("lead_con_ratio").innerHTML = data.winnerCount + ' (' + data.lead_con_ratio + '%)';
                    // Initialize charts

                    let chartData = data.product.map((el) => {
                        if (el.product_name == null || el.product_name == '')
                            el.product_name = 'Unassign';
                        return {
                            label: el.product_name,
                            value: el.amount
                        }
                    })

                    chartData.sort(function (a, b) {
                        return b.value - a.value
                    })

                    let finalChartData = []
                    if (chartData.length > 5) {
                        let sum = 0
                        for (let i = 5; i < chartData.length; i++)
                            sum += chartData[i].value

                        for (let i = 0; i < 5; i++)
                            finalChartData[i] = chartData[i]

                        finalChartData.push({
                            label: 'Other Products',
                            value: sum
                        })
                    } else
                        finalChartData = chartData

                    console.log(finalChartData)
                    $("#m_chart_dashboard_total_sell_products").empty();
                    $("#m_chart_dashboard_total_sell_products").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_total_sell_products",
                        data: finalChartData,
                        resize: true,
                        labelColor: "#a7a7c2",
                        colors: [mApp.getColor("dash_sell_red"), mApp.getColor("dash_sell_green"), mApp.getColor("dash_sell_puple"), mApp.getColor("dash_sell_sky"), mApp.getColor("dash_sell_yellow"), mApp.getColor("dash_sell_black")]
                    });
                    let bardata = data.sPrices

                   
                    $("#m_morris_dash").empty();
                   
                    Morris.Bar({
                        element: "m_morris_dash",
                        data: bardata.reverse(),
                        xkey: "y",
                        ykeys: ["a","b"],
                        labels: ["Fix(In $)","Hourly(In $)"],
                        stacked:true,
                        resize:true,
                        pointFillColors:['#ffffff'],
                        barColors: ['#F0136A','#1367F0'],
                        
                        barSizeRatio: 0.75,
                        barGap: 3,
                        xLabelAngle: 60
                    });
                    let i = 0;
                    console.log("Before for");
                    // console.log(data.valueable_customer);

                    for (i = 0; i < data.size_users; i++) {
                        $("#highest_salesperson").append(" <div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__img m-widget4__img--pic\">\n" +
                                "\n" +
                                "                                        <img src=\"sales_images/" + data.users[i].profile_image + "\" onerror=\"this.src='sales_images/IMG1550210555_images.png'\">\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\" id=\"user_name" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\" id=\"user_city" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\" >\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}</span>" + "<span id=\"user_total" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("user_name" + i).innerHTML = data.users[i].name;
                        document.getElementById("user_city" + i).innerHTML = data.users[i].user_city;
                        document.getElementById("user_total" + i).innerHTML = Math.round(data.users[i].total);
                    }

                    for (i = 0; i < data.size_valuable_customer; i++) {
                        $("#Most_Valuable_Customers").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\">\n" +
                                "                                                        <span id=\"store_name" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\">\n" +
                                "                                                        <span id=\"store_city" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"store_amount" + i + "\"></span></span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("store_name" + i).innerHTML = data.valuable_customer[i].store_name;
                        document.getElementById("store_city" + i).innerHTML = data.valuable_customer[i].store_city;
                        document.getElementById("store_amount" + i).innerHTML = data.valuable_customer[i].amount;
                    }

                    for (i = 0; i < data.size_highest_selling_product; i++) {
                        $("#Highest_Selling_Products").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info product\">\n" +
                                "                                        <a class=\"m-widget4__title\" href=\"#\">\n" +
                                "                                            <span id=\"product_name" + i + "\"></span>\n" +
                                "                                        </a>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub product_qty\">\n" +
                                "                                                        <span id=\"product_category" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info product_amount\">\n" +
                                "                                        <span id=\"product_quantity" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"product_amount" + i + "\" </span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        if (data.highest_selling_product[i].product_name == null || data.highest_selling_product[i].product_name == '')
                            data.highest_selling_product[i].product_name = 'Unassign';
                        document.getElementById("product_name" + i).innerHTML = data.highest_selling_product[i].product_name;
                        document.getElementById("product_category" + i).innerHTML = data.highest_selling_product[i].category;
                        document.getElementById("product_quantity" + i).innerHTML = data.highest_selling_product[i].quantity;
                        document.getElementById("product_amount" + i).innerHTML = data.highest_selling_product[i].amount;
                    }

                    var clr = ["background_pink", "background_green", "background_purple", "background_sky", "background_yellow"];
                    if (data.size_product <= 5) {
                        for (i = 0; i < data.size_product; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                    } else {
                        var other_product = 0;
                        for (i = 0; i < 5; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                        for (i = 5; i < data.size_product; i++) {
                            other_product += data.product[i].amount;
                        }

                        $("#other_products").append("<div class=\"m-widget16__item\">\n" +
                                "                                                            <span class=\"m-widget16__date\">\n" +
                                "                                                                Other Products\n" +
                                "                                                            </span>\n" +
                                "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                "                                                                <span class=\"amount_style\">  {{  $_ENV['APP_MONEY_SYMBOL']  }} <span style='color: white' id=\"other_product\"></span></span>\n" +
                                "                                                            </span>\n" +
                                "                                            </div>");
                        document.getElementById("other_product").innerHTML = other_product;
                    }
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }

        if (ab === 'Last Year' || ab === 'This Year') {
            $.ajax({
                type: 'GET',
                url: './This_Year',
                data: {
                    date: date,
                    bde_user: bde_user
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    // console.log('hi');
                    // console.log(data);
                    document.getElementById("tot_amount").innerHTML = data.price;
                    document.getElementById("selling_price").innerHTML = data.sellingprice;
                    document.getElementById("rem_amount").innerHTML = data.remamount;
                    document.getElementById("orderpending").innerHTML = data.pendingorder;
                    document.getElementById("total_amount").innerHTML = data.price;
                    document.getElementById("paypal").innerHTML = data.paypal;
                    document.getElementById("upwork").innerHTML = data.upwork;
                    document.getElementById("payoneer").innerHTML = data.payoneer;
                    document.getElementById("bob").innerHTML = data.bob;
                    document.getElementById("total_bid").innerHTML = data.total_bid;
                    document.getElementById("lead_count").innerHTML = data.lead_count;
                    document.getElementById("total_bid_connect").innerHTML = data.total_bid_connect;
                    document.getElementById("award_ratio").innerHTML = data.award_ratio + '%';
                    document.getElementById("lead_con_ratio").innerHTML = data.winnerCount + ' (' + data.lead_con_ratio + '%)';
                    // Initialize charts

                    let chartData = data.product.map((el) => {

                        if (el.product_name == null || el.product_name == '')
                            el.product_name = 'Unassign';
                        return {
                            label: el.product_name,
                            value: el.amount
                        }
                    })

                    chartData.sort(function (a, b) {
                        return b.value - a.value
                    })

                    let finalChartData = []
                    if (chartData.length > 5) {
                        let sum = 0
                        for (let i = 5; i < chartData.length; i++)
                            sum += chartData[i].value

                        for (let i = 0; i < 5; i++)
                            finalChartData[i] = chartData[i]

                        finalChartData.push({
                            label: 'Other Products',
                            value: sum
                        })
                    } else
                        finalChartData = chartData

                    console.log(finalChartData)
                    $("#m_chart_dashboard_total_sell_products").empty();
                    $("#m_chart_dashboard_total_sell_products").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_total_sell_products",
                        data: finalChartData,
                        resize: true,
                        labelColor: "#a7a7c2",
                        colors: [mApp.getColor("dash_sell_red"), mApp.getColor("dash_sell_green"), mApp.getColor("dash_sell_puple"), mApp.getColor("dash_sell_sky"), mApp.getColor("dash_sell_yellow"), mApp.getColor("dash_sell_black")]
                    });
                    let bardata = data.sPrices

                    $("#m_morris_dash").empty();
                    Morris.Bar({
                        element: "m_morris_dash",
                        data: bardata.reverse(),
                        xkey: "y",
                        ykeys: ["a","b"],
                        labels: ["Fix(In $)","Hourly(In $)"],
                        stacked:true,
                        resize:true,
                        pointFillColors:['#ffffff'],
                        barColors: ['#F0136A','#1367F0'],
                        
                        barSizeRatio: 0.75,
                        barGap: 3,
                        xLabelAngle: 60
                    });
                    let i = 0;
                    console.log("Before for");
                    // console.log(data.valueable_customer);

                    for (i = 0; i < data.size_users; i++) {
                        $("#highest_salesperson").append(" <div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__img m-widget4__img--pic\">\n" +
                                "\n" +
                                "                                        <img src=\"sales_images/" + data.users[i].profile_image + "\" onerror=\"this.src='sales_images/IMG1550210555_images.png'\">\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\" id=\"user_name" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\" id=\"user_city" + i + "\">\n" +
                                "                                                        \n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\" >\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}</span>" + "<span id=\"user_total" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("user_name" + i).innerHTML = data.users[i].name;
                        document.getElementById("user_city" + i).innerHTML = data.users[i].user_city;
                        document.getElementById("user_total" + i).innerHTML = Math.round(data.users[i].total);
                    }

                    for (i = 0; i < data.size_valuable_customer; i++) {
                        $("#Most_Valuable_Customers").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info\">\n" +
                                "                                                    <span class=\"m-widget4__title\">\n" +
                                "                                                        <span id=\"store_name" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub\">\n" +
                                "                                                        <span id=\"store_city" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"store_amount" + i + "\"></span></span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        document.getElementById("store_name" + i).innerHTML = data.valuable_customer[i].store_name;
                        document.getElementById("store_city" + i).innerHTML = data.valuable_customer[i].store_city;
                        document.getElementById("store_amount" + i).innerHTML = data.valuable_customer[i].amount;
                    }

                    for (i = 0; i < data.size_highest_selling_product; i++) {

                        $("#Highest_Selling_Products").append("<div class=\"m-widget4__item\">\n" +
                                "                                    <div class=\"m-widget4__info product\">\n" +
                                "                                        <a class=\"m-widget4__title\" href=\"#\">\n" +
                                "                                            <span id=\"product_name" + i + "\"></span>\n" +
                                "                                        </a>\n" +
                                "                                        <br>\n" +
                                "                                        <span class=\"m-widget4__sub product_qty\">\n" +
                                "                                                        <span id=\"product_category" + i + "\"></span>\n" +
                                "                                                    </span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__info product_amount\">\n" +
                                "                                        <span id=\"product_quantity" + i + "\"></span>\n" +
                                "                                    </div>\n" +
                                "                                    <div class=\"m-widget4__ext\">\n" +
                                "                                        <span>{{  $_ENV['APP_MONEY_SYMBOL']  }}<span id=\"product_amount" + i + "\" </span>\n" +
                                "                                    </div>\n" +
                                "                                </div>");
                        if (data.highest_selling_product[i].product_name == null || data.highest_selling_product[i].product_name == '')
                            data.highest_selling_product[i].product_name = 'Unassign';
                        document.getElementById("product_name" + i).innerHTML = data.highest_selling_product[i].product_name;
                        document.getElementById("product_category" + i).innerHTML = data.highest_selling_product[i].category;
                        document.getElementById("product_quantity" + i).innerHTML = data.highest_selling_product[i].quantity;
                        document.getElementById("product_amount" + i).innerHTML = data.highest_selling_product[i].amount;
                    }

                    var clr = ["background_pink", "background_green", "background_purple", "background_sky", "background_yellow"];
                    if (data.size_product <= 5) {
                        for (i = 0; i < data.size_product; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                    } else {
                        var other_product = 0;
                        for (i = 0; i < 5; i++) {

                            $("#Total_Sell_Products").append("<div class=\"m-widget16__item\">\n" +
                                    "                                                            <span class=\"m-widget16__date\">\n" +
                                    "                                                                <span id=\"name_of_product" + i + "\"></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                    "                                                                <span class=\"amount_style " + clr[i] + "\"> {{  $_ENV['APP_MONEY_SYMBOL']  }}<span style='color: white' id=\"amount_of_product" + i + "\"></span></span>\n" +
                                    "                                                            </span>\n" +
                                    "                                            </div>");
                            if (data.product[i].product_name == '' || data.product[i].product_name == null)
                                data.product[i].product_name = 'Unassign';
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("name_of_product" + i).innerHTML = data.product[i].product_name;
                            document.getElementById("amount_of_product" + i).innerHTML = data.product[i].amount;
                        }
                        for (i = 5; i < data.size_product; i++) {
                            other_product += data.product[i].amount;
                        }

                        $("#other_products").append("<div class=\"m-widget16__item\">\n" +
                                "                                                            <span class=\"m-widget16__date\">\n" +
                                "                                                                Other Products\n" +
                                "                                                            </span>\n" +
                                "                                                <span class=\"m-widget16__price m--align-right\">\n" +
                                "                                                                <span class=\"amount_style\">  {{  $_ENV['APP_MONEY_SYMBOL']  }} <span style='color: white' id=\"other_product\"></span></span>\n" +
                                "                                                            </span>\n" +
                                "                                            </div>");
                        document.getElementById("other_product").innerHTML = other_product;
                    }
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }
    }
</script>

<script type="text/javascript">
    function get_date() {
        var ab = document.getElementById("select1").value;
        // console.log(ab);
        var date = null;
        if (ab === 'Today') {
            var n = new Date();
            var y = n.getFullYear();
            var m = n.getMonth() + 1;
            var d = n.getDate();
            var date1;
            date1 = y + "-" + m + "-" + d;
            console.log("Today..", date1);
            date = date1;
        }

        if (ab === 'Yesterday') {
            var da = new Date();
            var curr_date = da.getDate() - 1;
            var curr_month = da.getMonth() + 1;
            var curr_year = da.getFullYear();
            var yesterday;
            yesterday = curr_year + "-" + curr_month + "-" + curr_date;
            console.log("Yesterday..", yesterday);
            date = yesterday;
        }

        if (ab === 'Last 3 Days') {

            var result2 = [];
            for (var i = 1; i < 4; i++) {
                var dt = new Date();
                dt.setDate(dt.getDate() - i);
                var y = dt.getFullYear();
                var m = dt.getMonth() + 1;
                var d = dt.getDate();
                var cal = y + "-" + m + "-" + d;
                result2.push(cal)
            }
            console.log("Last 3 Days..", result2);
            date = result2;
        }
        if (ab === 'Last 7 Days') {

            var result3 = [];
            for (var i = 1; i < 8; i++) {
                var dt = new Date();
                dt.setDate(dt.getDate() - i);
                var y = dt.getFullYear();
                var m = dt.getMonth() + 1;
                var d = dt.getDate();
                var cal = y + "-" + m + "-" + d;
                result3.push(cal)
            }
            console.log("Last 7 Days..", result3);
            date = result3;
        }

        if (ab === 'Last 30 Days') {

            var result4 = [];
            for (var i = 1; i < 31; i++) {
                var dt = new Date();
                dt.setDate(dt.getDate() - i);
                var y = dt.getFullYear();
                var m = dt.getMonth() + 1;
                var d = dt.getDate();
                var cal = y + "-" + m + "-" + d;
                result4.push(cal)
            }
            console.log("Last 30 Days..", result4);
            date = result4;
        }

        if (ab === 'This Month') {
            var result = [];
            var nowdate = new Date();
            var monthStartDay = new Date(nowdate.getFullYear(), nowdate.getMonth(), 0);
            var monthEndDay = new Date(nowdate.getFullYear(), nowdate.getMonth() + 1, 0);
            var getDateArray = function (start, end) {
                var arr = [];
                var dt = new Date(start);
                while (dt < end) {
                    arr.push(new Date(dt));
                    dt.setDate(dt.getDate() + 1);
                    var y = dt.getFullYear();
                    var m = dt.getMonth() + 1;
                    var d = dt.getDate();
                    var cal = y + "-" + m + "-" + d;
                    result.push(cal)
                }
                return result;
            }
            var dateArr = getDateArray(monthStartDay, monthEndDay);
            console.log("This Month..", dateArr);
            date = dateArr;
        }

        if (ab === 'Last Month') {
            var result1 = [];
            var nowdate1 = new Date();
            var monthStartDay1 = new Date(nowdate1.getFullYear(), nowdate1.getMonth() - 1, 0);
            var monthEndDay1 = new Date(nowdate1.getFullYear(), nowdate1.getMonth(), 0);
            var getDateArray1 = function (start, end) {
                var arr = [];
                var dt = new Date(start);
                while (dt < end) {
                    arr.push(new Date(dt));
                    dt.setDate(dt.getDate() + 1);
                    var y = dt.getFullYear();
                    var m = dt.getMonth() + 1;
                    var d = dt.getDate();
                    var cal = y + "-" + m + "-" + d;
                    result1.push(cal)
                }
                return result1;
            }
            var dateArr1 = getDateArray1(monthStartDay1, monthEndDay1);
            console.log("Last Month..", dateArr1);
            date = dateArr1;
        }

        if (ab === 'This Year' || ab === 'Last Year') {
            var dateArr = [];
            var nowdate = new Date();
            var year = nowdate.getFullYear();
            if (ab === 'Last Year')
                year = year - 1;
            var result = [];
            var start_date = year + "-" + 01 + "-" + 01;
            var end_date = year + "-" + 12 + "-" + 31;
            dateArr.push(start_date)
            dateArr.push(end_date)
            console.log(ab, dateArr);
            date = dateArr;
        }

        return date;
    }

    function chart1() {

        var date = get_date();
        var ab = document.getElementById("select1").value;
        if (ab === 'Today' || ab === 'Yesterday') {
            $.ajax({
                type: 'GET',
                url: 'graph_given_date',
                data: {
                    date: date
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    $("#m_chart_dashboard_collect_amount").empty();
                    $("#m_chart_dashboard_collect_amount").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_collect_amount",
                        data: data.data,
                        resize: true,
                        labelColor: "#434349",
                        colors: [mApp.getColor("dash_1"), mApp.getColor("dash_2"), mApp.getColor("dash_3"), mApp.getColor("dash_4")]
                    });
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }

        if (ab === 'Last 3 Days') {
            $.ajax({
                type: 'GET',
                url: 'graph_last_3_days',
                data: {
                    date: date
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    $("#m_chart_dashboard_collect_amount").empty();
                    $("#m_chart_dashboard_collect_amount").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_collect_amount",
                        data: data.data,
                        resize: true,
                        labelColor: "#434349",
                        colors: [mApp.getColor("dash_1"), mApp.getColor("dash_2"), mApp.getColor("dash_3"), mApp.getColor("dash_4")]
                    });
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }
        if (ab === 'Last 7 Days') {
            $.ajax({
                type: 'GET',
                url: 'graph_last_7_days',
                data: {
                    date: date
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    $("#m_chart_dashboard_collect_amount").empty();
                    $("#m_chart_dashboard_collect_amount").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_collect_amount",
                        data: data.data,
                        resize: true,
                        labelColor: "#434349",
                        colors: [mApp.getColor("dash_1"), mApp.getColor("dash_2"), mApp.getColor("dash_3"), mApp.getColor("dash_4")]
                    });
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }
        if (ab === 'Last 30 Days') {
            $.ajax({
                type: 'GET',
                url: 'graph_last_30_days',
                data: {
                    date: date
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    $("#m_chart_dashboard_collect_amount").empty();
                    $("#m_chart_dashboard_collect_amount").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_collect_amount",
                        data: data.data,
                        resize: true,
                        labelColor: "#434349",
                        colors: [mApp.getColor("dash_1"), mApp.getColor("dash_2"), mApp.getColor("dash_3"), mApp.getColor("dash_4")]
                    });
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }
        if (ab === 'This Month') {
            $.ajax({
                type: 'GET',
                url: 'graph_this_month',
                data: {
                    date: date
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    $("#m_chart_dashboard_collect_amount").empty();
                    $("#m_chart_dashboard_collect_amount").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_collect_amount",
                        data: data.data,
                        resize: true,
                        labelColor: "#434349",
                        colors: [mApp.getColor("dash_1"), mApp.getColor("dash_2"), mApp.getColor("dash_3"), mApp.getColor("dash_4")]
                    });
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }
        if (ab === 'Last Month') {
            $.ajax({
                type: 'GET',
                url: 'graph_last_month',
                data: {
                    date: date
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    $("#m_chart_dashboard_collect_amount").empty();
                    $("#m_chart_dashboard_collect_amount").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_collect_amount",
                        data: data.data,
                        resize: true,
                        labelColor: "#434349",
                        colors: [mApp.getColor("dash_1"), mApp.getColor("dash_2"), mApp.getColor("dash_3"), mApp.getColor("dash_4")]
                    });
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }
        
        if (ab === 'This Year' || ab === 'Last Year') {
            $.ajax({
                type: 'GET',
                url: 'graph_year',
                data: {
                    date: date
                },
                contentType: "application/json;charset=utf-8",
                success: function (data) {
                    $("#m_chart_dashboard_collect_amount").empty();
                    $("#m_chart_dashboard_collect_amount").length !== 0 && Morris.Donut({
                        element: "m_chart_dashboard_collect_amount",
                        data: data.data,
                        resize: true,
                        labelColor: "#434349",
                        colors: [mApp.getColor("dash_1"), mApp.getColor("dash_2"), mApp.getColor("dash_3"), mApp.getColor("dash_4")]
                    });
                },
                error: function (error) {
                    console.log("error", error);
                    alert('error');
                }
            });
        }
    }

    function chart2() {
        var date = get_date();
       // var bde_user = document.getElementById("d_technology_users_dropdown").value;
       
       var bde_user = document.getElementById("bde_dropdown").value;
        var ab = document.getElementById("select1").value;
        var val_radio = $('input[name="example_3"]:checked').val();
        $.ajax({
            type: 'GET',
            url: 'admin_tech_graph',
            data: {
                date: date,
                val_radio: val_radio,
                bde_user: bde_user
            },
            contentType: "application/json;charset=utf-8",
            success: function (data) {
                $('#morrischart').empty();
                var donut = new Morris.Donut({
                    data: data.getTechList,
                    colors: data.color,
                    element: 'morrischart',
                });
                $('.d_technologies_show').empty();
                var d_technologies_show = '';
                $.each(data.getTechList, function (key, data) {
                    d_technologies_show += '<div class="m-widget14__legend" style="display: inline-block;float: left;margin-right: 1px;margin-bottom: 0;"><span class="m-widget14__legend" style="line-height: normal;padding: 1.5px 5px;font-size: 14px;font-size: 14px;font-family: MyriadPro-Regular;color: #ffffff;background-color:' + data['color'] + '"> ' + data['label'] + '</span></div>';
                });
                $('.d_technologies_show').html(d_technologies_show);
            },
            error: function (error) {
                console.log("error", error);
                alert('error');
            }
        });
    }

    function chart3() {
       // var BDEUser = document.getElementById("d_target_users_dropdown").value;
        var BDEUser = document.getElementById("bde_dropdown").value;
        
        var ab = document.getElementById("select1").value;

        if (ab === 'Last Month') {
            var result1 = [];
            var nowdate1 = new Date();
            var monthStartDay1 = new Date(nowdate1.getFullYear(), nowdate1.getMonth() - 1, 0);
            var monthEndDay1 = new Date(nowdate1.getFullYear(), nowdate1.getMonth(), 0);
            var getDateArray1 = function (start, end) {
                var arr = [];
                var dt = new Date(start);
                while (dt < end) {
                    arr.push(new Date(dt));
                    dt.setDate(dt.getDate() + 1);
                    var y = dt.getFullYear();
                    var m = dt.getMonth() + 1;
                    var d = dt.getDate();
                    var cal = y + "-" + m + "-" + d;
                    result1.push(cal)
                }
                return result1;
            }
            var dateArr1 = getDateArray1(monthStartDay1, monthEndDay1);
            console.log("Last Month..", dateArr1);
            date = dateArr1;
        } else {
            var result = [];
            var nowdate = new Date();
            var monthStartDay = new Date(nowdate.getFullYear(), nowdate.getMonth(), 0);
            var monthEndDay = new Date(nowdate.getFullYear(), nowdate.getMonth() + 1, 0);
            var getDateArray = function (start, end) {
                var arr = [];
                var dt = new Date(start);
                while (dt < end) {
                    arr.push(new Date(dt));
                    dt.setDate(dt.getDate() + 1);
                    var y = dt.getFullYear();
                    var m = dt.getMonth() + 1;
                    var d = dt.getDate();
                    var cal = y + "-" + m + "-" + d;
                    result.push(cal)
                }
                return result;
            }
            var dateArr = getDateArray(monthStartDay, monthEndDay);
            console.log("This Month..", dateArr);
            date = dateArr;
        }
        $.ajax({
            type: 'GET',
            url: 'admin_target_graph',
            data: {
                range: ab,
                date: date,
                BDEUser: BDEUser
            },
            contentType: "application/json;charset=utf-8",
            success: function (data) {
                $('#flot_placeholder_target_custom').empty();
                //Target Graph
                $('.d_target').html('$' + data.Total_Target.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,"));
                $('.d_arv_target').html('$' + data.get_arcv_amount.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,"));
                $('.d_target_progressbar').html('<div style="width:' + data.cal_target_percent.toFixed() + '%;background-color: #22b9ff;border-radius:0 !important;" role="progressbar" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>');
                $('.d_target_progressbar_percent').html(data.cal_target_percent.toFixed() + '%');
                $('.d_custom_graph_title').html(ab);
                var data1_target = data.Target_Arch_Graph;
                var data2_target = data.Target_Graph;
                var dataset_target = [{
                        label: "Achieved Target",
                        data: data1_target
                    }, {
                        label: "Target",
                        data: data2_target
                    }, ];
                var options_target = {
                    series: {
                        lines: {
                            show: !0,
                            lineWidth: 1,
                            fill: !0,
                            fillColor: {
                                colors: [{
                                        opacity: 0.01
                                    }, {
                                        opacity: 0.09
                                    }]
                            }
                        },
                        points: {
                            show: !0,
                            radius: 3,
                            lineWidth: 1
                        },
                        shadowSize: 1,
                    },
                    grid: {
                        hoverable: true,
                        clickable: !0,
                        tickColor: "#d9dffa",
                        borderColor: "#d9dffa",
                        borderStyle: "dotted",
                        borderWidth: 0,
                        labelMargin: 10,
                        backgroundColor: "#ffffff" // => margin in pixels
                    },
                    legend: {
                        noColumns: 1,
                        labelBoxBorderColor: "#cccccc",
                        position: "ne",
                    },
                    colors: ["#d12610", "#37b7f3"],
                    xaxis: {
                        ticks: 31,
                        tickDecimals: 0,
                        tickColor: "#fff",
                    },
                    yaxis: {
                        ticks: 13,
                        tickDecimals: 0,
                        tickColor: "#d9dffa",
                    },
                };
                //Target Graph :: END
                $.plot($("#flot_placeholder_target_custom"), dataset_target, options_target);
                $("#flot_placeholder_target_custom").UseTooltip();
            },
            error: function (error) {
                console.log("error", error);
                alert('error');
            }
        });
    }
</script>

@endsection