RisvanaCybro
2 years ago
60 changed files with 21051 additions and 0 deletions
@ -0,0 +1,48 @@ |
|||
.. image:: https://img.shields.io/badge/license-AGPL--3-blue.svg |
|||
:target: http://www.gnu.org/licenses/agpl-3.0-standalone.html |
|||
:alt: License: AGPL-3 |
|||
|
|||
Fleet Rental Dashboard |
|||
====================== |
|||
This module adds a dashboard in fleet rental module. |
|||
|
|||
Configuration |
|||
============= |
|||
* No additional configurations needed |
|||
|
|||
Company |
|||
------- |
|||
* `Cybrosys Techno Solutions <https://cybrosys.com/>`__ |
|||
|
|||
License |
|||
------- |
|||
General Public License, Version 3 (AGPL v3). |
|||
(http://www.gnu.org/licenses/agpl-3.0-standalone.html) |
|||
|
|||
Credits |
|||
------- |
|||
* Developer:(V15) Ranjith R, |
|||
(V16) Mruthul Raj, |
|||
Contact: odoo@cybrosys.com |
|||
|
|||
Contacts |
|||
-------- |
|||
* Mail Contact : odoo@cybrosys.com |
|||
* Website : https://cybrosys.com |
|||
|
|||
Bug Tracker |
|||
----------- |
|||
Bugs are tracked on GitHub Issues. In case of trouble, please check there if your issue has already been reported. |
|||
|
|||
Maintainer |
|||
========== |
|||
.. image:: https://cybrosys.com/images/logo.png |
|||
:target: https://cybrosys.com |
|||
|
|||
This module is maintained by Cybrosys Technologies. |
|||
|
|||
For support and more information, please visit `Our Website <https://cybrosys.com/>`__ |
|||
|
|||
Further information |
|||
=================== |
|||
HTML Description: `<static/description/index.html>`__ |
|||
@ -0,0 +1,21 @@ |
|||
# -*- coding: utf-8 -*- |
|||
############################################################################### |
|||
# |
|||
# Cybrosys Technologies Pvt. Ltd. |
|||
# |
|||
# Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
|||
# Author: Ranjith R(odoo@cybrosys.com) |
|||
# |
|||
# You can modify it under the terms of the GNU AFFERO |
|||
# GENERAL PUBLIC LICENSE (AGPL v3), Version 3. |
|||
# |
|||
# This program is distributed in the hope that it will be useful, |
|||
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
# GNU AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. |
|||
# |
|||
# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE |
|||
# (AGPL v3) along with this program. |
|||
|
|||
############################################################################### |
|||
from . import models |
|||
@ -0,0 +1,53 @@ |
|||
# -*- coding: utf-8 -*- |
|||
############################################################################### |
|||
# |
|||
# Cybrosys Technologies Pvt. Ltd. |
|||
# |
|||
# Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
|||
# Author: Ranjith R(odoo@cybrosys.com) |
|||
# |
|||
# You can modify it under the terms of the GNU AFFERO |
|||
# GENERAL PUBLIC LICENSE (AGPL v3), Version 3. |
|||
# |
|||
# This program is distributed in the hope that it will be useful, |
|||
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
# GNU AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. |
|||
# |
|||
# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE |
|||
# (AGPL v3) along with this program. |
|||
|
|||
############################################################################### |
|||
{ |
|||
'name': 'Fleet Rental Dashboard', |
|||
'version': '15.0.1.0.0', |
|||
'category': 'Productivity', |
|||
'summary': 'Dashboard for fleet rental management', |
|||
'description': 'This dashboard module enhances the fleet rental management ' |
|||
'system by offering a centralized view of crucial metrics' |
|||
' and analytics.', |
|||
'author': 'Cybrosys Techno Solutions', |
|||
'company': 'Cybrosys Techno Solutions', |
|||
'maintainer': 'Cybrosys Techno Solutions', |
|||
'website': 'https://www.cybrosys.com', |
|||
'depends': ['fleet_rental', 'base'], |
|||
'data': ['views/fleet_rental_dashboard_views.xml', |
|||
], |
|||
'assets': { |
|||
'web.assets_backend': [ |
|||
'fleet_rental_dashboard/static/src/js/dashboard.js', |
|||
'fleet_rental_dashboard/static/src/css/dashboard.css', |
|||
'fleet_rental_dashboard/static/src/css/style.scss', |
|||
'fleet_rental_dashboard/static/src/js/lib/Chart.bundle.js', |
|||
'fleet_rental_dashboard/static/src/xml/dashboard_templates.xml', |
|||
], |
|||
'web.assets_qweb': [ |
|||
'fleet_rental_dashboard/static/src/xml/dashboard_templates.xml', |
|||
], |
|||
}, |
|||
'images': ['static/description/banner.jpg'], |
|||
'license': 'AGPL-3', |
|||
'installable': True, |
|||
'auto_install': False, |
|||
'application': False, |
|||
} |
|||
@ -0,0 +1,6 @@ |
|||
## Module <fleet_rental_dashboard> |
|||
|
|||
#### 25.04.2023 |
|||
#### Version 15.0.1.0.0 |
|||
#### ADD |
|||
- Initial Commit for Fleet Rental Dashboard |
|||
@ -0,0 +1,21 @@ |
|||
# -*- coding: utf-8 -*- |
|||
############################################################################### |
|||
# |
|||
# Cybrosys Technologies Pvt. Ltd. |
|||
# |
|||
# Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
|||
# Author: Ranjith R(odoo@cybrosys.com) |
|||
# |
|||
# You can modify it under the terms of the GNU AFFERO |
|||
# GENERAL PUBLIC LICENSE (AGPL v3), Version 3. |
|||
# |
|||
# This program is distributed in the hope that it will be useful, |
|||
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
# GNU AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. |
|||
# |
|||
# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE |
|||
# (AGPL v3) along with this program. |
|||
|
|||
############################################################################### |
|||
from . import car_rental_contract |
|||
@ -0,0 +1,138 @@ |
|||
# -*- coding: utf-8 -*- |
|||
############################################################################### |
|||
# |
|||
# Cybrosys Technologies Pvt. Ltd. |
|||
# |
|||
# Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
|||
# Author: Ranjith R(odoo@cybrosys.com) |
|||
# |
|||
# You can modify it under the terms of the GNU AFFERO |
|||
# GENERAL PUBLIC LICENSE (AGPL v3), Version 3. |
|||
# |
|||
# This program is distributed in the hope that it will be useful, |
|||
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
# GNU AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. |
|||
# |
|||
# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE |
|||
# (AGPL v3) along with this program. |
|||
|
|||
############################################################################### |
|||
from odoo import api, models |
|||
|
|||
|
|||
class CarRentalContract(models.Model): |
|||
"""Class for new function to get vehicle and customers details |
|||
get_vehicle_most_rented |
|||
function for getting most rented vehicle which |
|||
get_cars_availability |
|||
function for getting available and running car's |
|||
get_car_details |
|||
function for getting the car details |
|||
get_top_customers |
|||
function for getting top 10 customers |
|||
""" |
|||
|
|||
_inherit = "car.rental.contract" |
|||
|
|||
@api.model |
|||
def get_vehicle_most_rented(self, start_date, end_date): |
|||
"""function for getting most rented vehicle if filters enabled or not |
|||
args: |
|||
start_date:filter for start date |
|||
end_date:end date filter |
|||
return: |
|||
result which include vehicle details and its count |
|||
""" |
|||
query = """SELECT vehicle_id,COUNT(*) AS num FROM car_rental_contract WHERE state='done'""" |
|||
if start_date: |
|||
query += """ AND rent_start_date >= '%s'""" % start_date |
|||
if end_date: |
|||
query += """AND rent_start_date <= '%s'""" % end_date |
|||
query += """GROUP BY vehicle_id ORDER BY num DESC""" |
|||
self.env.cr.execute(query) |
|||
results = self.env.cr.fetchall() |
|||
cars = [] |
|||
count = [] |
|||
for vehicle_id, num in results: |
|||
if num > 0: |
|||
car = self.env['fleet.vehicle'].browse(vehicle_id) |
|||
cars.append( |
|||
car.name |
|||
) |
|||
count.append(num) |
|||
result = { |
|||
'name': cars, |
|||
'num': count |
|||
} |
|||
return result |
|||
|
|||
@api.model |
|||
def get_cars_availability(self): |
|||
"""function for getting available and running cars count |
|||
return: |
|||
count of available and running cars in result""" |
|||
available_cars = self.env['fleet.vehicle'].search_count( |
|||
[('rental_check_availability', '=', True)]) |
|||
cars_running = self.env['car.rental.contract'].search_count( |
|||
[('state', '=', 'running')]) |
|||
result = { |
|||
'available_cars': available_cars, |
|||
'cars_running': cars_running |
|||
} |
|||
return result |
|||
|
|||
@api.model |
|||
def get_car_details(self): |
|||
""" |
|||
function for getting details of running and available cars |
|||
return: |
|||
values which include details of running and available cars |
|||
""" |
|||
running_cars = self.env['car.rental.contract'].search( |
|||
[('state', '=', 'running')]) |
|||
cars_available = self.env['fleet.vehicle'].search( |
|||
[('rental_check_availability', '=', True)]) |
|||
running_details = [] |
|||
available_cars = [] |
|||
for record in running_cars: |
|||
running_details.append({'vehicle': record.vehicle_id.name, |
|||
'start_date': record.rent_start_date, |
|||
'end_date': record.rent_end_date, |
|||
'customer': record.customer_id.name, |
|||
'phone': record.customer_id.mobile, |
|||
}) |
|||
for record in cars_available: |
|||
available_cars.append({ |
|||
'available_car': record.name, |
|||
}) |
|||
values = { |
|||
'running_details': running_details, |
|||
'available_cars': available_cars |
|||
} |
|||
return values |
|||
|
|||
@api.model |
|||
def get_top_customers(self): |
|||
"""function for getting top 10 customers |
|||
return top customers which include their name,image and email |
|||
""" |
|||
rental_partners_count = self.env['car.rental.contract'].read_group( |
|||
[('state', 'in', ['done'])], |
|||
fields=['customer_id'], |
|||
groupby=['customer_id'], ) |
|||
sorted_rental_partners_count = sorted(rental_partners_count, |
|||
key=lambda k: k[ |
|||
'customer_id_count'], |
|||
reverse=True) |
|||
limited = sorted_rental_partners_count[:10] |
|||
top_customers = [] |
|||
for rec in limited: |
|||
partner = self.env['res.partner'].browse(rec['customer_id'][0]) |
|||
top_customers.append({ |
|||
'id': partner.id, |
|||
'name': partner.name, |
|||
'image': partner.image_1920, |
|||
'email': partner.email |
|||
}) |
|||
return top_customers |
|||
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 310 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 576 B |
|
After Width: | Height: | Size: 733 B |
|
After Width: | Height: | Size: 911 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 673 B |
|
After Width: | Height: | Size: 878 B |
|
After Width: | Height: | Size: 653 B |
|
After Width: | Height: | Size: 905 B |
|
After Width: | Height: | Size: 839 B |
|
After Width: | Height: | Size: 427 B |
|
After Width: | Height: | Size: 627 B |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 988 B |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 589 B |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 967 B |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 60 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 1.8 MiB |
|
After Width: | Height: | Size: 57 KiB |
|
After Width: | Height: | Size: 202 KiB |
|
After Width: | Height: | Size: 118 KiB |
|
After Width: | Height: | Size: 68 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 139 KiB |
|
After Width: | Height: | Size: 110 KiB |
|
After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 7.4 KiB |
@ -0,0 +1,629 @@ |
|||
<div style="background-color: #714B67; height: 810px; width: 100%; padding: 15px; position: relative;"> |
|||
<!-- TITLE BAR --> |
|||
<div class="d-flex align-items-center justify-content-between" |
|||
style="border-bottom: 1px solid #875A7B; padding: 15px; display: flex; justify-content: space-between; align-items: center;"> |
|||
<img src="assets/misc/cybrosys-logo.png" width="42" height="42" |
|||
style="width: 42px; height: 42px;"/> |
|||
<div> |
|||
<div |
|||
style="color: #7C7BAD; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;" |
|||
class="mr-2"> |
|||
<i class="fa fa-check mr-1"></i>Community |
|||
</div> |
|||
<div |
|||
style="color: #875A7B; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;" |
|||
class="mr-2"> |
|||
<i class="fa fa-check mr-1"></i>Enterprise |
|||
</div> |
|||
<div |
|||
style="color: #017E84; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;" |
|||
class="mr-2"> |
|||
<i class="fa fa-check mr-1"></i>Odoo.sh |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- END OF TITLE BAR --> |
|||
<div class="container"> |
|||
<div class="row"> |
|||
<div class="col-sm-12 col-md-12 col-lg-12"> |
|||
<!-- APP HERO --> |
|||
<h1 style="color: #FFFFFF; font-weight: bolder; font-size: 50px; text-align: center; margin-top: 50px;"> |
|||
Fleet Rental Dashboard</h1> |
|||
<!-- END OF APP HERO --> |
|||
<img src="assets/screenshots/hero.gif" class="img-responsive" |
|||
style="width: 100%; margin-left: auto; margin-right: auto;"/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
|
|||
</div> |
|||
|
|||
<!-- NAVIGATION SECTION --> |
|||
<div class="d-flex align-items-center" |
|||
style="border-bottom: 2px solid #714B67; padding: 15px 0px; margin-top: 300px;"> |
|||
<div class="d-flex justify-content-center align-items-center mr-2" |
|||
style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;"> |
|||
<img src="assets/misc/compass.png"/> |
|||
</div> |
|||
<h2 class="mt-2" |
|||
style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;"> |
|||
Explore This |
|||
Module</h2> |
|||
</div> |
|||
<div class="row my-4" style="font-family: 'Montserrat', sans-serif;"> |
|||
<div class="col-sm-12 col-md-6 my-3"> |
|||
<a href="#overview"> |
|||
<div class="d-flex justify-content-between align-items-center" |
|||
style="background-color: #f5f5f5; padding: 30px; width: 100%;"> |
|||
<div> |
|||
<span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Overview</span> |
|||
<span style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33; display: block;">Learn |
|||
more about this |
|||
module</span> |
|||
</div> |
|||
<img src="assets/misc/right-arrow.png" width="36" height="36"/> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-sm-12 col-md-6 my-3"> |
|||
<a href="#features"> |
|||
<div class="d-flex justify-content-between align-items-center" |
|||
style="background-color: #f5f5f5; padding: 30px; width: 100%;"> |
|||
<div> |
|||
<span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Features</span> |
|||
<span style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33; display: block;">View |
|||
features of this |
|||
module</span> |
|||
</div> |
|||
<img src="assets/misc/right-arrow.png" width="36" height="36"/> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-sm-12 col-md-6 my-3"> |
|||
<a href="#screenshots"> |
|||
<div class="d-flex justify-content-between align-items-center" |
|||
style="background-color: #f5f5f5; padding: 30px; width: 100%;"> |
|||
<div> |
|||
<span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Screenshots</span> |
|||
<span style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33; display: block;">View |
|||
screenshots for this |
|||
module</span> |
|||
</div> |
|||
<img src="assets/misc/right-arrow.png" width="36" height="36"/> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
<!-- END OF NAVIGATION SECTION --> |
|||
|
|||
<!-- OVERVIEW SECTION --> |
|||
<div class="d-flex align-items-center" |
|||
style="border-bottom: 2px solid #714B67; padding: 15px 0px;" id="overview"> |
|||
<div class="d-flex justify-content-center align-items-center mr-2" |
|||
style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;"> |
|||
<img src="assets/misc/pie-chart.png"/> |
|||
</div> |
|||
<h2 class="mt-2" |
|||
style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;"> |
|||
Overview |
|||
</h2> |
|||
</div> |
|||
<div class="row" |
|||
style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 200%;"> |
|||
<div class="col-sm-12 py-4"> |
|||
This dashboard module enhances the fleet rental management system by |
|||
offering a centralized view of crucial metrics and analytics. |
|||
</div> |
|||
</div> |
|||
<!-- END OF OVERVIEW SECTION --> |
|||
|
|||
<!-- FEATURES SECTION --> |
|||
<div class="d-flex align-items-center" |
|||
style="border-bottom: 2px solid #714B67; padding: 15px 0px;" id="features"> |
|||
<div class="d-flex justify-content-center align-items-center mr-2" |
|||
style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;"> |
|||
<img src="assets/misc/features.png"/> |
|||
</div> |
|||
<h2 class="mt-2" |
|||
style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;"> |
|||
Features |
|||
</h2> |
|||
</div> |
|||
<div class="row" |
|||
style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 200%;"> |
|||
<div class="col-sm-12 col-md-6"> |
|||
<div class="d-flex align-items-center" |
|||
style="margin-top: 40px; margin-bottom: 40px"> |
|||
<img src="assets/misc/check-box.png" class="mr-2"/> |
|||
<span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Dashboard with date filtration.</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="row" |
|||
style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 200%;"> |
|||
<div class="col-sm-12 col-md-6"> |
|||
<div class="d-flex align-items-center" |
|||
style="margin-top: 40px; margin-bottom: 40px"> |
|||
<img src="assets/misc/check-box.png" class="mr-2"/> |
|||
<span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Pie,Bar and Line graph available.</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="row" |
|||
style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 200%;"> |
|||
<div class="col-sm-12 col-md-6"> |
|||
<div class="d-flex align-items-center" |
|||
style="margin-top: 40px; margin-bottom: 40px"> |
|||
<img src="assets/misc/check-box.png" class="mr-2"/> |
|||
<span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Available vehicles and running vehicles on dashboard.</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="col-sm-12 col-md-6"> |
|||
<div class="d-flex align-items-center" |
|||
style="margin-top: 30px; margin-bottom: 30px"> |
|||
<img src="assets/misc/check-box.png" class="mr-2"/> |
|||
<span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Available in Odoo 15.</span> |
|||
</div> |
|||
</div> |
|||
<!-- END OF FEATURES SECTION --> |
|||
|
|||
<!-- SCREENSHOTS SECTION --> |
|||
<div class="d-flex align-items-center" |
|||
style="border-bottom: 2px solid #714B67; padding: 15px 0px;" |
|||
id="screenshots"> |
|||
<div class="d-flex justify-content-center align-items-center mr-2" |
|||
style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;"> |
|||
<img src="assets/misc/pictures.png"/> |
|||
</div> |
|||
<h2 class="mt-2" |
|||
style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;"> |
|||
Screenshots |
|||
</h2> |
|||
</div> |
|||
<div class="row"> |
|||
<div class="col-sm-12"> |
|||
<div style="display: block; margin: 30px auto;"> |
|||
<h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;"> |
|||
Dashboard View |
|||
</h3> |
|||
<p> |
|||
An elaborated dashboard view with Top Customers, Most Rented |
|||
Cars and Available Vehicles. |
|||
</p> |
|||
<img src="assets/screenshots/ss1.jpg" class="img-thumbnail"> |
|||
<img src="assets/screenshots/ss2.jpg" class="img-thumbnail"> |
|||
</div> |
|||
|
|||
<div style="display: block; margin: 30px auto;"> |
|||
<h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;"> |
|||
Available Vehicles With Scroll Bar |
|||
</h3> |
|||
<p> |
|||
This will display available vehicles name and numbers of cars on |
|||
road. |
|||
</p> |
|||
<img src="assets/screenshots/ss3.jpg" class="img-thumbnail"> |
|||
</div> |
|||
<div style="display: block; margin: 30px auto;"> |
|||
<h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;"> |
|||
Date Filter |
|||
</h3> |
|||
<p> |
|||
You can filter by date to get details of some specif date. |
|||
</p> |
|||
<img src="assets/screenshots/ss4.jpg" class="img-thumbnail"> |
|||
<img src="assets/screenshots/ss5.jpg" class="img-thumbnail"> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- END OF SCREENSHOTS SECTION --> |
|||
|
|||
<!-- RELATED PRODUCTS --> |
|||
<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px;"> |
|||
<div class="d-flex justify-content-center align-items-center mr-2" |
|||
style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;"> |
|||
<img src="assets/misc/categories.png"/> |
|||
</div> |
|||
<h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Related |
|||
Products |
|||
</h2> |
|||
</div> |
|||
<div class="row"> |
|||
<div class="col-sm-12"> |
|||
<div id="demo1" class="row carousel slide" data-ride="carousel"> |
|||
<!-- The slideshow --> |
|||
<div class="carousel-inner" style="padding: 30px;"> |
|||
<div class="carousel-item" style="min-height: 198.656px;"> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/dynamic_accounts_report/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" style="border-radius: 0px;" |
|||
src="assets/modules/1.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/custom_gantt_view/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" style="border-radius: 0px;" |
|||
src="assets/modules/2.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/project_custom_gantt/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" style="border-radius: 0px;" |
|||
src="assets/modules/3.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
<div class="carousel-item active" style="min-height: 198.656px;"> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/account_reports_xlsx/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" style="border-radius: 0px;" |
|||
src="assets/modules/4.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/base_accounting_kit/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" style="border-radius: 0px;" |
|||
src="assets/modules/5.gif"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/hr_payroll_community/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" style="border-radius: 0px;" |
|||
src="assets/modules/6.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- Left and right controls --> |
|||
<a class="carousel-control-prev" href="#demo1" data-slide="prev" style="width:35px; color:#000"> <span |
|||
class="carousel-control-prev-icon"><i class="fa fa-chevron-left" style="font-size:24px"></i></span> |
|||
</a> <a class="carousel-control-next" href="#demo1" data-slide="next" style="width:35px; color:#000"> |
|||
<span class="carousel-control-next-icon"><i class="fa fa-chevron-right" style="font-size:24px"></i></span> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- END OF RELATED PRODUCTS --> |
|||
|
|||
<!-- OUR SERVICES --> |
|||
|
|||
<div class="d-flex align-items-center" |
|||
style="border-bottom: 2px solid #714B67; padding: 15px 0px;"> |
|||
<div class="d-flex justify-content-center align-items-center mr-2" |
|||
style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;"> |
|||
<img src="assets/misc/star.png"/> |
|||
</div> |
|||
<h2 class="mt-2" |
|||
style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;"> |
|||
Our Services |
|||
</h2> |
|||
</div> |
|||
|
|||
<div class="container my-5"> |
|||
<div class="row"> |
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/cogs.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Customization</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #ff6b6b !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/wrench.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Implementation</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #6462CD !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/lifebuoy.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Support</h6> |
|||
</div> |
|||
|
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #ffa801 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/user.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Hire |
|||
Odoo |
|||
Developer</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #54a0ff !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/puzzle.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Integration</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #6d7680 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/update.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Migration</h6> |
|||
</div> |
|||
|
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #786fa6 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/consultation.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Consultancy</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #f8a5c2 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/training.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Implementation</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #e6be26 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/license.png" class="img-responsive" |
|||
height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" |
|||
style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Licensing Consultancy</h6> |
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
<!-- END OF OUR SERVICES --> |
|||
|
|||
<!-- OUR INDUSTRIES --> |
|||
|
|||
<div class="d-flex align-items-center" |
|||
style="border-bottom: 2px solid #714B67; padding: 15px 0px;"> |
|||
<div class="d-flex justify-content-center align-items-center mr-2" |
|||
style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;"> |
|||
<img src="assets/misc/corporate.png"/> |
|||
</div> |
|||
<h2 class="mt-2" |
|||
style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;"> |
|||
Our |
|||
Industries |
|||
</h2> |
|||
</div> |
|||
|
|||
<div class="container my-5"> |
|||
<div class="row"> |
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="assets/icons/trading-black.png" |
|||
class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Trading |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Easily procure |
|||
and |
|||
sell your products</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="assets/icons/pos-black.png" |
|||
class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
POS |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Easy |
|||
configuration |
|||
and convivial experience</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="assets/icons/education-black.png" |
|||
class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Education |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
A platform for |
|||
educational management</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="assets/icons/manufacturing-black.png" |
|||
class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Manufacturing |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Plan, track and |
|||
schedule your operations</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="assets/icons/ecom-black.png" |
|||
class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
E-commerce & Website |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Mobile |
|||
friendly, |
|||
awe-inspiring product pages</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="assets/icons/service-black.png" |
|||
class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Service Management |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Keep track of |
|||
services and invoice</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="assets/icons/restaurant-black.png" |
|||
class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Restaurant |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Run your bar or |
|||
restaurant methodically</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="assets/icons/hotel-black.png" |
|||
class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Hotel Management |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
An |
|||
all-inclusive |
|||
hotel management application</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<!-- END OF OUR INDUSTRIES --> |
|||
|
|||
<!-- SUPPORT --> |
|||
<div class="d-flex align-items-center" |
|||
style="border-bottom: 2px solid #714B67; padding: 15px 0px;"> |
|||
<div class="d-flex justify-content-center align-items-center mr-2" |
|||
style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;"> |
|||
<img src="assets/misc/customer-support.png"/> |
|||
</div> |
|||
<h2 class="mt-2" |
|||
style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;"> |
|||
Support |
|||
</h2> |
|||
</div> |
|||
<div class="container mt-5"> |
|||
<div class="row"> |
|||
<div class="col-sm-12 col-md-6"> |
|||
<div style="background-color: #F6F8F9; padding: 30px; display: flex; align-items: center;"> |
|||
<div class="mr-4 d-flex justify-content-center align-items-center" |
|||
style="background-color: #714B67; display: inline-block; height: 70px; width: 70px; display: flex; align-items: center; justify-content: center;"> |
|||
<img src="assets/misc/support.png" height="48" width="48" |
|||
style="width: 42px; height: 42px;"/> |
|||
</div> |
|||
<div> |
|||
<h4>Need Help?</h4> |
|||
<p style="line-height: 100%;">Got questions or need help? |
|||
Get in touch.</p> |
|||
<a href="mailto:odoo@cybrosys.com"> |
|||
<p style="font-weight: 400; font-size: 28px; line-height: 80%; color: #714B67;"> |
|||
odoo@cybrosys.com</p> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="col-sm-12 col-md-6"> |
|||
<div style="background-color: #F6F8F9; padding: 30px; display: flex; align-items: center;"> |
|||
<div class="mr-4 d-flex justify-content-center align-items-center" |
|||
style="background-color: #2AC44D; display: inline-block; height: 70px; width: 70px; display: flex; align-items: center; justify-content: center;"> |
|||
<img src="assets/misc/whatsapp.png" height="52" width="52" |
|||
style="width: 52px; height: 52px;"/> |
|||
</div> |
|||
<div> |
|||
<h4>WhatsApp</h4> |
|||
<p style="line-height: 100%;">Say hi to us on WhatsApp!</p> |
|||
<a href="https://api.whatsapp.com/send?phone=918606827707"> |
|||
<p style="font-weight: 400; font-size: 28px; line-height: 80%; color: #714B67;"> |
|||
+91 86068 |
|||
27707</p> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="row"> |
|||
<div class="col-sm-12 my-5 d-flex justify-content-center align-items-center"> |
|||
<img src="assets/misc/logo.png" width="144" height="31" |
|||
style="width:144px; height: 31px; margin-top: 40px;"/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- END OF SUPPORT --> |
|||
@ -0,0 +1,56 @@ |
|||
p, |
|||
span, |
|||
a, |
|||
ul, |
|||
li, |
|||
button { |
|||
font-size: inherit; |
|||
font-weight: inherit; |
|||
line-height: inherit; |
|||
} |
|||
|
|||
strong { |
|||
font-weight: 600; |
|||
} |
|||
|
|||
h1, |
|||
h2, |
|||
h3, |
|||
h4, |
|||
h5, |
|||
h6 { |
|||
line-height: 1.5em; |
|||
font-weight: 300; |
|||
} |
|||
|
|||
strong { |
|||
font-weight: 400; |
|||
} |
|||
|
|||
.sub_title { |
|||
font-size: 14px; |
|||
} |
|||
|
|||
.sub_title div span { |
|||
font-weight: 600; |
|||
} |
|||
|
|||
.chart #canvas_graph { |
|||
height: 400px !important; |
|||
} |
|||
|
|||
.highcharts-background { |
|||
fill: none; |
|||
} |
|||
|
|||
html .o_web_client>.o_action_manager { |
|||
overflow: scroll; |
|||
} |
|||
|
|||
.available_cars { |
|||
overflow: scroll; |
|||
} |
|||
|
|||
running_vehicle_contact { |
|||
overflow: scroll; |
|||
} |
|||
@ -0,0 +1,237 @@ |
|||
:root { |
|||
/* Primary */ |
|||
--mauve: #7D7EAF; |
|||
--pink-dark: #BD85BA; |
|||
--pink: #F78EAD; |
|||
--peach: #FFA48E; |
|||
--orange: #FFCA71; |
|||
--gold: #CEA716; |
|||
--green: #1EC198; |
|||
--grey: #a0a0a0; |
|||
/* Light */ |
|||
--mauve-light: #e5e5ef; |
|||
--pink-dark-light: #f2e7f1; |
|||
--pink-light: #fde8ef; |
|||
--peach-light: #ffede8; |
|||
--orange-light: #fff4e3; |
|||
--gold-light: #faf6e8; |
|||
--green-light: #e9f9f5; |
|||
--grey-light: #e0e0e0; |
|||
|
|||
/*Lighter*/ |
|||
--grey-lighter: #fafafa; |
|||
--grey-dark-lighter: #f3f3f3; |
|||
} |
|||
|
|||
/* Background */ |
|||
.bg-mauve-light { |
|||
background-color: var(--mauve-light); |
|||
} |
|||
|
|||
.bg-pink-dark-light { |
|||
background-color: var(--pink-dark-light); |
|||
} |
|||
|
|||
.bg-pink-light { |
|||
background-color: var(--pink-light); |
|||
} |
|||
|
|||
.bg-peach-light { |
|||
background-color: var(--peach-light); |
|||
} |
|||
|
|||
.bg-orange-light { |
|||
background-color: var(--orange-light); |
|||
} |
|||
|
|||
.bg-gold-light { |
|||
background-color: var(--gold-light); |
|||
} |
|||
|
|||
.bg-green-light { |
|||
background-color: var(--green-light); |
|||
} |
|||
|
|||
/* Text */ |
|||
.text-mauve { |
|||
color: var(--mauve); |
|||
} |
|||
|
|||
.text-pink-dark { |
|||
color: var(--pink-dark); |
|||
} |
|||
|
|||
.text-pink { |
|||
color: var(--pink); |
|||
} |
|||
|
|||
.text-peach { |
|||
color: var(--peach); |
|||
} |
|||
|
|||
.text-orange { |
|||
color: var(--orange); |
|||
} |
|||
|
|||
.text-gold { |
|||
color: var(--gold); |
|||
} |
|||
|
|||
.text-green { |
|||
color: var(--green); |
|||
} |
|||
|
|||
/* Cards */ |
|||
|
|||
.dashboard-card { |
|||
border-radius: 0.3rem; |
|||
display: flex; |
|||
justify-content: center; |
|||
padding: 1.7rem 1.5rem 1.5rem 1.5rem; |
|||
margin: 1rem auto; |
|||
height: 90px; |
|||
} |
|||
|
|||
.dashboard-card__icon-container { |
|||
height: 50px; |
|||
width: 50px; |
|||
border-radius: 50%; |
|||
} |
|||
|
|||
.dashboard-card__icon-container i { |
|||
font-size: 20px; |
|||
} |
|||
|
|||
.dashboard-card__details { |
|||
margin-left: 1rem; |
|||
max-width: 120px; |
|||
} |
|||
|
|||
.dashboard-card__details h3 { |
|||
font-weight: 700; |
|||
font-size: 1.5rem; |
|||
} |
|||
|
|||
.dashboard-card__details h4 { |
|||
font-weight: 700; |
|||
font-size: 0.7rem; |
|||
color: var(--grey); |
|||
margin-top: -5px; |
|||
} |
|||
|
|||
h2.section-header { |
|||
font-weight: 700; |
|||
font-size: 1.5rem; |
|||
} |
|||
|
|||
.chart-container { |
|||
border-radius: 0.3rem; |
|||
padding: 1rem; |
|||
margin: 1rem auto; |
|||
} |
|||
|
|||
.chart-container.card-shadow { |
|||
height: 100%; |
|||
} |
|||
|
|||
.half_chart.chart-container.card-shadow { |
|||
height: 49%; |
|||
} |
|||
|
|||
.chart-container h2 { |
|||
font-weight: 700; |
|||
font-size: 1.125rem; |
|||
} |
|||
|
|||
.item-container { |
|||
background-color: var(--grey-lighter); |
|||
border-radius: 0.3rem; |
|||
padding: 1.2rem 1rem; |
|||
margin: 1rem auto; |
|||
} |
|||
|
|||
.item-container:hover { |
|||
background-color: var(--grey-dark-lighter); |
|||
transition: all 0.3s ease-in-out; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.count-container { |
|||
font-weight: 700; |
|||
font-size: 1.7rem; |
|||
background-color: var(--mauve-light); |
|||
color: var(--mauve); |
|||
height: 50px; |
|||
width: 50px; |
|||
border-radius: 50%; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.item-header { |
|||
display: flex; |
|||
align-items: flex-start; |
|||
} |
|||
|
|||
.item-title h3 { |
|||
font-size: 1.3rem; |
|||
font-weight: 700; |
|||
} |
|||
|
|||
.item-content ul { |
|||
list-style: none; |
|||
padding-left: 0px; |
|||
} |
|||
|
|||
.item-content ul>li { |
|||
font-size: 0.9rem; |
|||
color: var(--grey); |
|||
font-weight: 700; |
|||
} |
|||
|
|||
/* Misc */ |
|||
.card-shadow { |
|||
-webkit-box-shadow: 1px 3px 5px 0px rgba(222, 222, 222, 1); |
|||
-moz-box-shadow: 1px 3px 5px 0px rgba(222, 222, 222, 1); |
|||
box-shadow: 1px 3px 5px 0px rgba(222, 222, 222, 1); |
|||
} |
|||
|
|||
/* Table */ |
|||
thead { |
|||
background-color: #e9ecf0; |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.table thead th { |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.table td, |
|||
.table th { |
|||
border-top: 1px solid #eceff2; |
|||
} |
|||
|
|||
.crm_scroll_table { |
|||
max-height: 395px; |
|||
overflow-y: auto; |
|||
} |
|||
.recent_activity_div .crm_scroll_table { |
|||
max-height: 435px; |
|||
} |
|||
|
|||
.crm_scroll_table thead { |
|||
position: sticky; |
|||
top: 0; |
|||
} |
|||
|
|||
.crm_scroll_table .count-container { |
|||
height: 45px; |
|||
width: 130px; |
|||
border-radius: 50px; |
|||
margin-right: 10px; |
|||
} |
|||
|
|||
.crm_scroll_table .item-content ul > li { |
|||
font-size: 1.1rem; |
|||
} |
|||
@ -0,0 +1,309 @@ |
|||
odoo.define('fleet_rental_dashboard.Dashboard', function(require) { |
|||
"use strict"; |
|||
|
|||
var AbstractAction = require('web.AbstractAction'); |
|||
var core = require('web.core'); |
|||
var QWeb = core.qweb; |
|||
var ajax = require('web.ajax'); |
|||
var rpc = require('web.rpc'); |
|||
var _t = core._t; |
|||
var session = require('web.session'); |
|||
var web_client = require('web.web_client'); |
|||
var abstractView = require('web.AbstractView'); |
|||
var flag = 0; |
|||
var tot_so = [] |
|||
var tot_project = [] |
|||
var tot_task = [] |
|||
var tot_employee = [] |
|||
var tot_hrs = [] |
|||
var tot_margin = [] |
|||
var CustomDashBoard = AbstractAction.extend({ |
|||
template: 'CustomDashBoard', |
|||
// Define events
|
|||
events: { |
|||
'click button': 'onclick_dateSubmit_', |
|||
'click #hide_modal': '_hideModal', |
|||
}, |
|||
// Constructor
|
|||
init: function(parent, context) { |
|||
this._super(parent, context); |
|||
this.dashboards_templates = ['DashboardFleetRental']; |
|||
}, |
|||
willStart: function() { |
|||
var self = this; |
|||
return $.when(ajax.loadLibs(this), this._super()).then(function() { |
|||
return self.fetch_data(); |
|||
}); |
|||
}, |
|||
start: function() { |
|||
var self = this; |
|||
this.set("title", 'Dashboard') |
|||
return this._super() |
|||
.then(function() { |
|||
self.render_dashboards(); |
|||
self.render_graphs(); |
|||
}) |
|||
|
|||
}, |
|||
_hideModal: function() { |
|||
this.$el.find('#modal_warning') |
|||
.modal('hide') |
|||
}, |
|||
// Handle date submission
|
|||
onclick_dateSubmit_: function(event) { |
|||
event.preventDefault() |
|||
var start_date = this.$el.find('#start_date') |
|||
.val() |
|||
var end_date = this.$el.find('#end_date') |
|||
.val() |
|||
if (start_date > end_date) { |
|||
this.$el.find('#modal_warning') |
|||
.modal('show') |
|||
} else { |
|||
var self = this; |
|||
self.$el.find(".most_rented_cars") |
|||
.remove() |
|||
self.$el.find(".most_rented_cars_pie") |
|||
.remove() |
|||
self.$el.find(".most_rented_cars_line") |
|||
.remove() |
|||
self.$el.find(".bar_canvas") |
|||
.append("<canvas class='most_rented_cars'/>") |
|||
self.$el.find(".pie_canvas") |
|||
.append("<canvas class='most_rented_cars_pie'/>") |
|||
self.$el.find(".line_canvas") |
|||
.append("<canvas class='most_rented_cars_line'/>") |
|||
var ctx = self.$el.find(".most_rented_cars") |
|||
this._rpc({ |
|||
model: 'car.rental.contract', |
|||
method: 'get_vehicle_most_rented', |
|||
args: [start_date, end_date] |
|||
}) |
|||
.then(function(cars) { |
|||
var data = { |
|||
labels: cars.name, |
|||
datasets: [{ |
|||
data: cars.num, |
|||
fill: false, |
|||
backgroundColor: '#003f5c', |
|||
borderColor: '#003f5c', |
|||
barPercentage: 0.5, |
|||
barThickness: 6, |
|||
maxBarThickness: 8, |
|||
minBarLength: 0, |
|||
borderWidth: 1, |
|||
backgroundColor: [ |
|||
"#665191", |
|||
"#ff7c43", |
|||
"#ffa600", |
|||
"#a05195", |
|||
"#2f4b7c", |
|||
"#f95d6a", |
|||
"#6d5c16", |
|||
"#003f5c", |
|||
"#d45087" |
|||
], |
|||
borderColor: [ |
|||
"#003f5c", |
|||
"#2f4b7c", |
|||
"#f95d6a", |
|||
"#665191", |
|||
"#d45087", |
|||
"#ff7c43", |
|||
"#ffa600", |
|||
"#a05195", |
|||
"#6d5c16" |
|||
], |
|||
borderWidth: 1 |
|||
}, ] |
|||
}; |
|||
//options
|
|||
var options = { |
|||
responsive: true, |
|||
title: true, |
|||
legend: { |
|||
display: false, |
|||
position: "right", |
|||
labels: { |
|||
fontColor: "#333", |
|||
fontSize: 16 |
|||
} |
|||
}, |
|||
scales: { |
|||
yAxes: [{ |
|||
gridLines: { |
|||
color: "rgba(1, 0, 0, 0)", |
|||
display: true, |
|||
}, |
|||
ticks: { |
|||
min: 0, |
|||
display: true, |
|||
stepSize: 1, |
|||
} |
|||
}] |
|||
} |
|||
}; |
|||
//create Chart class object
|
|||
var chart = new Chart(ctx, { |
|||
type: "bar", |
|||
data: data, |
|||
options: options |
|||
}); |
|||
var pie = self.$el.find(".most_rented_cars_pie") |
|||
var pie_chart = new Chart(pie, { |
|||
type: "doughnut", |
|||
data: data, |
|||
}) |
|||
var line = self.$el.find(".most_rented_cars_line") |
|||
var line_chart = new Chart(line, { |
|||
type: "line", |
|||
data: data, |
|||
}) |
|||
}) |
|||
} |
|||
}, |
|||
render_dashboards: function() { |
|||
var self = this; |
|||
_.each(this.dashboards_templates, function(template) { |
|||
self.$el.find('.o_pj_dashboard') |
|||
.append(QWeb.render(template, { |
|||
widget: self |
|||
})); |
|||
}); |
|||
}, |
|||
render_graphs: function() { |
|||
var self = this; |
|||
self.render_get_most_rended_cars(); |
|||
}, |
|||
// Fetch data asynchronously
|
|||
fetch_data: async function() { |
|||
var self = this; |
|||
var def1 = await this._rpc({ |
|||
model: 'car.rental.contract', |
|||
method: 'get_cars_availability' |
|||
}) |
|||
.then(function(data) { |
|||
self.available_cars = data['available_cars'] |
|||
self.running_cars = data['cars_running'] |
|||
}) |
|||
var def2 = await this._rpc({ |
|||
model: 'car.rental.contract', |
|||
method: 'get_car_details' |
|||
}) |
|||
.then(function(data) { |
|||
self.running_vehicle_details = data['running_details'] |
|||
}) |
|||
var def2 = await this._rpc({ |
|||
model: 'car.rental.contract', |
|||
method: 'get_car_details' |
|||
}) |
|||
.then(function(data) { |
|||
self.available_vehicle_details = data['available_cars'] |
|||
}) |
|||
var def3 = await this._rpc({ |
|||
model: 'car.rental.contract', |
|||
method: 'get_top_customers' |
|||
}) |
|||
.then(function(customers) { |
|||
self.top_customers = customers |
|||
}) |
|||
}, |
|||
render_get_most_rended_cars: function() { |
|||
var self = this; |
|||
var start_date = self.$el.find('#start_date') |
|||
.val() |
|||
var end_date = self.$el.find('#end_date') |
|||
.val() |
|||
var ctx = self.$el.find(".most_rented_cars") |
|||
this._rpc({ |
|||
model: 'car.rental.contract', |
|||
method: 'get_vehicle_most_rented', |
|||
args: [start_date, end_date] |
|||
}) |
|||
.then(function(cars) { |
|||
var data = { |
|||
labels: cars.name, |
|||
datasets: [{ |
|||
data: cars.num, |
|||
fill: false, |
|||
backgroundColor: '#003f5c', |
|||
borderColor: '#003f5c', |
|||
barPercentage: 0.5, |
|||
barThickness: 6, |
|||
maxBarThickness: 8, |
|||
minBarLength: 0, |
|||
borderWidth: 1, |
|||
backgroundColor: [ |
|||
"#665191", |
|||
"#ff7c43", |
|||
"#ffa600", |
|||
"#a05195", |
|||
"#2f4b7c", |
|||
"#f95d6a", |
|||
"#6d5c16", |
|||
"#003f5c", |
|||
"#d45087" |
|||
], |
|||
borderColor: [ |
|||
"#003f5c", |
|||
"#2f4b7c", |
|||
"#f95d6a", |
|||
"#665191", |
|||
"#d45087", |
|||
"#ff7c43", |
|||
"#ffa600", |
|||
"#a05195", |
|||
"#6d5c16" |
|||
], |
|||
borderWidth: 1 |
|||
}, ] |
|||
}; |
|||
//options
|
|||
var options = { |
|||
responsive: true, |
|||
title: false, |
|||
legend: { |
|||
display: false, |
|||
position: "right", |
|||
labels: { |
|||
fontColor: "#333", |
|||
fontSize: 16 |
|||
} |
|||
}, |
|||
scales: { |
|||
yAxes: [{ |
|||
gridLines: { |
|||
color: "rgba(1, 0, 0, 0)", |
|||
display: true, |
|||
}, |
|||
ticks: { |
|||
min: 0, |
|||
display: true, |
|||
stepSize: 1, |
|||
} |
|||
}] |
|||
} |
|||
}; |
|||
//create Chart class object
|
|||
var chart = new Chart(ctx, { |
|||
type: "bar", |
|||
data: data, |
|||
options: options |
|||
}); |
|||
var pie = self.$el.find(".most_rented_cars_pie") |
|||
var pie_chart = new Chart(pie, { |
|||
type: "doughnut", |
|||
data: data, |
|||
}) |
|||
var line = self.$el.find(".most_rented_cars_line") |
|||
var line_chart = new Chart(line, { |
|||
type: "line", |
|||
data: data, |
|||
}) |
|||
}) |
|||
} |
|||
}); |
|||
|
|||
core.action_registry.add('fleet_rental_dashboard', CustomDashBoard); |
|||
return CustomDashBoard; |
|||
}); |
|||
File diff suppressed because it is too large
@ -0,0 +1,236 @@ |
|||
<?xml version="1.0" encoding="utf-8" ?> |
|||
<template> |
|||
<!-- Custom Dashboard Template --> |
|||
<t t-name="CustomDashBoard"> |
|||
<div class="oh_dashboards" style="margin-top: 20px;"> |
|||
<div class="container-fluid o_pj_dashboard"> |
|||
</div> |
|||
</div> |
|||
</t> |
|||
<!-- DashboardFleetRental Template --> |
|||
<t t-name="DashboardFleetRental"> |
|||
<hr/> |
|||
<div class="form-group col-2"> |
|||
<form class="o_filter_form"> |
|||
<div style="display:flex;"> |
|||
<input type="date" id="start_date" name="start_date"/> |
|||
<i class="fa fa-duotone fa-arrow-right"/> |
|||
<input type="date" id="end_date" name="end_date"/> |
|||
</div> |
|||
<button id="date_submit" class="btn btn-primary">Filter</button> |
|||
</form> |
|||
</div> |
|||
<div class="modal fade" id="modal_warning" tableindex="-1" |
|||
role="dialog"> |
|||
<div class="modal-dialog" role="document"> |
|||
<div class="modal-content"> |
|||
<div class="modal-header"> |
|||
<h4 class="modal-title">Warning!</h4> |
|||
</div> |
|||
<div class="modal-body"> |
|||
<p class="message"> |
|||
'Start date should be smaller than end date for |
|||
filtration' |
|||
</p> |
|||
</div> |
|||
<div class="modal-footer"> |
|||
<button type="button" id="hide_modal" |
|||
class="btn btn-default" |
|||
data-dismiss="modal">Close |
|||
</button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- Top Customers --> |
|||
<div class="row"> |
|||
<h3 style="text-align:center;">Top Customers</h3> |
|||
<div class="col-md-12" style="display:flex;overflow:scroll;"> |
|||
<t t-foreach="widget.top_customers" t-as="customer"> |
|||
<div class="dashboard-card card-shadow my_lead" |
|||
style="display:inline-flex; align-items: center;"> |
|||
<div class="dashboard-card__icon-container bg-mauve-light d-flex justify-content-center"> |
|||
<t t-if="customer.image"> |
|||
<img t-att-src="'data:image/png;base64,'+customer.image" |
|||
alt="Image" |
|||
class="dashboard-card__icon-container bg-mauve-light d-flex justify-content-center"/> |
|||
</t> |
|||
<t t-else=""> |
|||
<i class="fa fa-user text-mauve dashboard-card__icon-container bg-mauve-light d-flex justify-content-center |
|||
align-items-center"/> |
|||
</t> |
|||
</div> |
|||
<div class="dashboard-card__details"> |
|||
<div> |
|||
<h3 t-esc="customer.name"/> |
|||
</div> |
|||
<div style="cursor: pointer;"> |
|||
<h4 t-esc="customer.email"/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</t> |
|||
</div> |
|||
</div> |
|||
<!-- Available Cars --> |
|||
<div class="col-xs-12 col-sm-12 col-lg-12 col-md-12"> |
|||
<div class="row" style="margin:0px;"> |
|||
<div class="col-6 col-sm-6 helpdesk inbox_tickets"> |
|||
<div class="leads_month_pie_div half_chart chart-container card-shadow" |
|||
style="height: 528px;"> |
|||
<h2> |
|||
<center> |
|||
Most Rented Cars |
|||
</center> |
|||
</h2> |
|||
<div class="graph_canvas bar_canvas"> |
|||
<canvas class="most_rented_cars"/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="col-6 col-sm-2 helpdesk inbox_tickets "> |
|||
<div class="leads_month_pie_div half_chart chart-container card-shadow available_cars" |
|||
style="height: 528px;"> |
|||
<h2> |
|||
<center> |
|||
Available Cars |
|||
</center> |
|||
</h2> |
|||
<hr/> |
|||
<div class="text-color"> |
|||
<table class="table table-sm"> |
|||
<thead> |
|||
<tr> |
|||
<th rowspan="14"> |
|||
<center>Car Name</center> |
|||
</th> |
|||
</tr> |
|||
</thead> |
|||
<tbody> |
|||
<t t-foreach="widget.available_vehicle_details" |
|||
t-as="available_car"> |
|||
<tr> |
|||
<td> |
|||
<center> |
|||
<t t-esc="available_car['available_car']"/> |
|||
</center> |
|||
</td> |
|||
</tr> |
|||
</t> |
|||
<div class="crm_dash_cards row"> |
|||
<div class="col-sm-12 col-md-12"> |
|||
<div class="dashboard-card card-shadow my_lead" |
|||
style="display:flex;"> |
|||
<div class="dashboard-card__icon-container bg-mauve-light d-flex justify-content-center |
|||
align-items-center"> |
|||
<i class="fa fa-car text-mauve"/> |
|||
</div> |
|||
<div class="dashboard-card__details"> |
|||
<h3> |
|||
<span t-esc="widget.available_cars"/> |
|||
</h3> |
|||
<h4>Cars Available</h4> |
|||
</div> |
|||
<div class="dashboard-card__details"> |
|||
<h3> |
|||
<span t-esc="widget.running_cars"/> |
|||
</h3> |
|||
<h4>Cars Running</h4> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</tbody> |
|||
</table> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="col-6 col-sm-4 helpdesk inbox_tickets "> |
|||
<div class="leads_month_pie_div half_chart chart-container card-shadow running_vehicle_contact" |
|||
style="height: 528px;"> |
|||
<h2> |
|||
<center> |
|||
Running vehicle and contact detail |
|||
</center> |
|||
</h2> |
|||
<hr/> |
|||
<div class="text-color"> |
|||
<table class="table table-sm" |
|||
style="table-layout:fixed;"> |
|||
<thead> |
|||
<tr> |
|||
<th rowspan="14">Car Name</th> |
|||
</tr> |
|||
<tr> |
|||
<th rowspan="14">Start Date</th> |
|||
</tr> |
|||
<tr> |
|||
<th rowspan="14">End Date</th> |
|||
</tr> |
|||
<tr> |
|||
<th rowspan="14">Customer Name</th> |
|||
</tr> |
|||
<tr> |
|||
<th rowspan="14">Customer Contact</th> |
|||
</tr> |
|||
</thead> |
|||
<tbody> |
|||
<t t-foreach="widget.running_vehicle_details" |
|||
t-as="data"> |
|||
<tr> |
|||
<td> |
|||
<t t-esc="data['vehicle']"/> |
|||
</td> |
|||
<td> |
|||
<t t-esc="data['start_date']"/> |
|||
</td> |
|||
<td> |
|||
<t t-esc="data['end_date']"/> |
|||
</td> |
|||
<td> |
|||
<t t-esc="data['customer']"/> |
|||
</td> |
|||
<t t-if="data['phone']"> |
|||
<td> |
|||
<t t-esc="data['phone']"/> |
|||
</td> |
|||
</t> |
|||
</tr> |
|||
</t> |
|||
</tbody> |
|||
</table> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="col-12 col-sm-12" style="display:flex;"> |
|||
<div class="col-6 col-sm-6 helpdesk inbox_tickets"> |
|||
<div class="leads_month_pie_div half_chart chart-container card-shadow" |
|||
style="height: 528px;"> |
|||
<h2> |
|||
<center> |
|||
Most Rented Cars |
|||
</center> |
|||
</h2> |
|||
<div class="graph_canvas pie_canvas"> |
|||
<canvas class="most_rented_cars_pie"/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="col-6 col-sm-6 helpdesk inbox_tickets"> |
|||
<div class="leads_month_pie_div half_chart chart-container card-shadow" |
|||
style="height: 528px;"> |
|||
<h2> |
|||
<center> |
|||
Most Rented Cars |
|||
</center> |
|||
</h2> |
|||
<div class="graph_canvas line_canvas"> |
|||
<canvas class="most_rented_cars_line"/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</t> |
|||
</template> |
|||
@ -0,0 +1,11 @@ |
|||
<?xml version="1.0" encoding="UTF-8" ?> |
|||
<odoo> |
|||
<record id="action_fleet_rental_dashboard" model="ir.actions.client"> |
|||
<field name="name">Fleet.Rental.Dashboard</field> |
|||
<field name="tag">fleet_rental_dashboard</field> |
|||
</record> |
|||
<!-- This Menu Item must have a parent and an action --> |
|||
<menuitem id="rental_dashboard" name="Dashboard" |
|||
action="action_fleet_rental_dashboard" parent="fleet.menu_root" |
|||
sequence="1"/> |
|||
</odoo> |
|||
Loading…
Reference in new issue