You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
318 lines
19 KiB
318 lines
19 KiB
<?xml version="1.0" encoding="UTF-8" ?>
|
|
<template id="template" xml:space="preserve">
|
|
<t t-name="Invoicedashboard">
|
|
<div class="accounts-dashboard-wrap">
|
|
<div class="o_dashboards col-xs-12 col-sm-12 col-lg-12 col-md-12" style="background-color: #e1e1e1;overflow: scroll; !important; ">
|
|
<div class="content-header">
|
|
<div class="container-fluid">
|
|
<div class="row mb-2">
|
|
<div class="col-sm-12">
|
|
<div class="dash-header">
|
|
<h1 class="custom-h1 dashboard-h1">Dashboard </h1>
|
|
<input type="checkbox" style="display:none" data-toggle="toggle" data-on="" data-off="">
|
|
<input type="checkbox" id="toggle-two"/>
|
|
</input>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row" style="margin:0px">
|
|
<div class="col-xs-12 col-sm-12 col-lg-12 col-md-12">
|
|
<div class="">
|
|
<div class="row account-details" style="margin:0px">
|
|
<div class="col-md-3">
|
|
<!--Net Profit or Loss-->
|
|
<div class="tile wide invoice box-1">
|
|
<div class="headers">
|
|
<div class="main-title">Net Profit or Loss</div>
|
|
<div id="monthly_invoice">
|
|
<div class="left">
|
|
<div class="count">
|
|
<span id="net_profit_current_year"/>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<div class="count">
|
|
<span id="net_profit_current_months"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--Total Income-->
|
|
<div class="col-md-3">
|
|
<div class="tile wide invoice box-2">
|
|
<div class="header">
|
|
<div class="main-title">Total Income</div>
|
|
<div id="monthly_income">
|
|
<div class="left">
|
|
<div class="count">
|
|
<span id="total_incomes_this_year"/>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<div class="count">
|
|
<span id="total_incomes_"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--Total Expense-->
|
|
<div class="col-md-3">
|
|
<div class="tile wide invoice box-3">
|
|
<div class="header">
|
|
<div class="main-title">Total Expenses</div>
|
|
<div id="monthly_expense">
|
|
<div class="left">
|
|
<div class="count">
|
|
<span id="total_expense_this_year"/>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<div class="count">
|
|
<span id="total_expenses_"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--Unreconciled items-->
|
|
<div class="col-md-3">
|
|
<div class="tile wide invoice box-4">
|
|
<div class="header">
|
|
<div class="main-title">Unreconciled items</div>
|
|
<div id="monthly_unreconciled">
|
|
<div class="left">
|
|
<div class="count">
|
|
<span id="unreconciled_counts_this_year"/>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<div class="count">
|
|
<span id="unreconciled_items_"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xs-12 col-sm-12 col-lg-12 col-md-12">
|
|
<div class="row" style="margin:0px">
|
|
<div class="col-md-4" id="col-graph">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="card-title">
|
|
<b>
|
|
<h3 class="custom-h3">Income/Expense</h3>
|
|
</b>
|
|
</div>
|
|
<div class="card-tools">
|
|
<select id="income_expense_values" class="btn btn-primary">
|
|
<option id="income_this_year" value="income_this_year">This Year</option>
|
|
<option id="income_this_month" value="income_this_month" selected="">
|
|
This Month</option>
|
|
<div role="separator" class="dropdown-divider"/>
|
|
<option id="income_last_month" value="income_last_month">Last Month</option>
|
|
<option id="income_last_year" value="income_last_year">Last Year</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="card-body mt-3" id="in_ex_body_hide">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<p id="myelement1"> </p>
|
|
<div class="chart">
|
|
<canvas id="canvas" width="300" height="200"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4" id="col-graph">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="card-title">
|
|
<b>
|
|
<h3 class="custom-h3">INVOICES</h3>
|
|
</b>
|
|
</div>
|
|
<div class="card-tools">
|
|
<select id="invoice_values" class="btn btn-primary">
|
|
<option id="invoice_this_month" value="this_month">This Month</option>
|
|
<option id="invoice_this_year" value="this_year">This Year</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<!--card-header-->
|
|
<div class="card-body" id="">
|
|
<div class="row">
|
|
<div class="col-md-12 mt-3">
|
|
<h1 class="custom-h1" style="margin-bottom: 0;">Customer Invoice</h1>
|
|
<ul class="skill-list">
|
|
<li class="skill" style="display: flex;justify-content: space-between;color: #000;">
|
|
<p id="total_customer_invoice_paid"/>
|
|
<p id="total_customer_invoice"/>
|
|
<p id="total_customer_invoice_paid_current_year"/>
|
|
<p id="total_customer_invoice_current_year"/>
|
|
<p id="total_customer_invoice_paid_current_month"/>
|
|
<p id="total_customer_invoice_current_month"/>
|
|
</li>
|
|
<li>
|
|
<progress id="tot_invoice" class="skill-1" max="" value="">
|
|
<strong>Skill Level: 50%</strong>
|
|
</progress>
|
|
</li>
|
|
<li>
|
|
<progress id="tot_invoice_current_year" class="skill-1" max="" value="">
|
|
<strong>Skill Level: 50%</strong>
|
|
</progress>
|
|
</li>
|
|
<li>
|
|
<progress id="tot_invoice_current_month" class="skill-1" max="" value="">
|
|
<strong>Skill Level: 50%</strong>
|
|
</progress>
|
|
</li>
|
|
</ul>
|
|
<div role="separator" class="dropdown-divider"/>
|
|
<h1 class="custom-h1" style="margin-bottom: 0;">Supplier Invoice</h1>
|
|
<ul class="skill-list">
|
|
<li class="skill" style="display: flex;justify-content: space-between;color: #000;">
|
|
<p id="total_supplier_invoice_paid"/>
|
|
<p id="total_supplier_invoice"/>
|
|
<p id="total_supplier_invoice_paid_current_year"/>
|
|
<p id="total_supplier_invoice_current_year"/>
|
|
<p id="total_supplier_invoice_paid_current_month"/>
|
|
<p id="total_supplier_invoice_current_month"/>
|
|
</li>
|
|
<li>
|
|
<progress id="tot_supplier_inv" class="skill-1" max="" value="">
|
|
<strong>Skill Level: 50%</strong>
|
|
</progress>
|
|
</li>
|
|
<li>
|
|
<progress id="tot_supplier_inv_current_year" class="skill-1" max="" value="">
|
|
<strong>Skill Level: 50%</strong>
|
|
</progress>
|
|
</li>
|
|
<li>
|
|
<progress id="tot_supplier_inv_current_month" class="skill-1" max="" value="">
|
|
<strong>Skill Level: 50%</strong>
|
|
</progress>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4" id="col-graph">
|
|
<div class="card">
|
|
<div class="card-body p-0" style=" height: 287px; overflow-y: auto; ">
|
|
<div class="card-header" style=" padding: 17px 1.5rem !important; display: flex !IMPORTANT; justify-content: space-between; align-items: center; ">
|
|
<h3 class="custom-h3 card-title">
|
|
<b>BANK AND CASH BALANCE</b>
|
|
</h3>
|
|
</div>
|
|
<div class="card-body p-0" style=" height: 100px; " id="bank_balance_body_hide">
|
|
<ul id="current_bank_balance"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4" id="col-graph">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="card-title">
|
|
<b>
|
|
<h3 class="custom-h3">Aged Receivable</h3>
|
|
</b>
|
|
</div>
|
|
<div class="card-tools">
|
|
<select id="aged_receivable_values" class="btn btn-primary">
|
|
<option id="aged_payable_this_month" value="this_month">This Month</option>
|
|
<option id="aged_payable_this_year" value="this_year">This Year</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<!--card-header-->
|
|
<div class="card-body" id="ex_body">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div>
|
|
<canvas id="canvas1" height="250px" width="400px"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4" id="col-graph">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="card-title">
|
|
<b>
|
|
<h3 class="custom-h3">Aged Payable</h3>
|
|
</b>
|
|
</div>
|
|
<div class="card-tools">
|
|
<select id="aged_payable_value" class="btn btn-primary">
|
|
<option id="aged_receivable_this_month" value="this_month">This Month</option>
|
|
<option id="aged_receivable_this_year" value="this_year">This Year</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<!--card-header-->
|
|
<div class="card-body" id="aged_payable_body_hide">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div id="chart">
|
|
<canvas id="horizontalbarChart" width="400" height="250"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="card" style="height:366px;">
|
|
<div class="card-header" style=" padding: 17px 1.5rem !important; display: flex !IMPORTANT; justify-content: space-between; align-items: center; ">
|
|
<h3 class="custom-h3 card-title">
|
|
<b>TOP 10 CUSTOMERS</b>
|
|
</h3>
|
|
<div class="card-tools">
|
|
<select id="top_10_customer_value" class="btn btn-primary">
|
|
<option id="top_10_customer_this_month" value="this_month">This Month</option>
|
|
<div role="separator" class="dropdown-divider"/>
|
|
<option id="top_10_customer_last_month" value="last_month">Last Month</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body p-0" style=" height: 287px; overflow-y: auto; " id="top_10_body">
|
|
<ul class="users-list clearfix" id="top_10_customers_this_month"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container-fluid o_hr_dashboard">
|
|
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3" id="invoice_grapg"/>
|
|
<div class="dashboard-header-filter">
|
|
<div class="manager_filter_class"/>
|
|
</div>
|
|
</div>
|
|
<div id="chart-container"/>
|
|
</div>
|
|
</t>
|
|
</template>
|