Files
admin-php-module/web/views/dashboard/dashboard.html
miroman-afk fb46c8e739 v.2.27
Fixed reports
2023-05-02 15:21:54 +03:00

618 lines
18 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<div id="container-floating">
<div class="nd1 nds" data-toggle="tooltip" data-placement="left" title="Обновить" ng-click="updateData()" style="background-color: #d3a411"
onmouseenter="$(this).tooltip('show')">
<i class="material-icons">&#xE5D5;</i>
</div>
<div id="floating-button" data-toggle="tooltip" data-placement="left" title="Действия" onmouseenter="$(this).tooltip('show')">
<p class="plus">
<i class="material-icons">&#xE5D2;</i>
</p>
<p class="edit">
<i class="material-icons">&#xE5CD;</i>
</p>
</div>
</div>
<div class="padding">
<div class="margin">
<div class="row">
<div class="col-sm-9">
<h5 id="currentTime" class="m-b-0 _300">{{ currentDate | date:'dd.MM.yyyy HH:mm:ss' }}
</h5>
<small class="text-muted">Данные по филиалу
<strong>{{globals.currentUser.organization.name}}</strong>
</small>
</div>
<div class="col-sm-3">
<label class="md-switch">
<input id="timerCheckbox" type="checkbox" ng-model="timerEnabled" ng-change="toggleTimer()">
<i class="blue"></i>
<span ng-show="timerEnabled">
Автоматическое обновление через: {{ timeRemaining | date:'mm:ss' }}
</span>
<span ng-show="!timerEnabled">
Обновление данных отключено!
</span>
</label>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-3">
<div class="box" style="height: 198px;">
<div class="box-header warn">
<h3>Смена № {{shiftInfo.z_number}}</h3>
</div>
<div class="box-body">
<div ng-if="!shiftInfo.exists">Информация о смене будет доступна позже</div>
<div ng-if="shiftInfo.exists">
<span>Открыл: {{shiftInfo.open}} в {{shiftInfo.opened | date:'H:mm d.MM'}}</span>
<div ng-if="shiftInfo.closed">
<span>Закрыл: {{shiftInfo.close}} в {{shiftInfo.closed | date:'H:mm d.MM'}}</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-12 col-md-9">
<div class="row">
<div class="col-sm-6 col-md-4 one-height" >
<div class="box p-a" style="max-height: 75px;">
<div class="pull-left m-r">
<span class="w-40 {{app.setting.theme.primary}} text-center rounded">
<i class="material-icons">&#xE227;</i>
</span>
</div>
<div class="clear">
<h4 class="m-a-0 text-md">
<a>{{total | curr}}</a>
</h4>
<small class="text-muted">выручка</small>
</div>
<div class="box-tool">
<ul class="nav">
<li class="nav-item">
<a ng-click="getMore('total')">
<i class="fa fa-eye"></i>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 one-height">
<div class="box-color p-a {{app.setting.theme.primary}}" style="max-height: 75px;">
<div class="pull-left m-r">
<span class="w-40 dker text-center rounded">
<i class="material-icons">&#xE84F;</i>
</span>
</div>
<div class="clear">
<h4 class="m-a-0 text-md">
<a>{{profit | curr}}</a>
</h4>
<small class="text-muted">валовый доход</small>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 one-height">
<div class="box-color p-a {{app.setting.theme.accent}}" style="max-height: 75px;">
<div class="pull-left m-r">
<span class="w-40 dker text-center rounded">
<i class="material-icons">&#xE8A1;</i>
</span>
</div>
<div class="clear">
<h4 class="m-a-0 text-md">
<a>{{middle | curr}}</a>
</h4>
<small class="text-muted">средний чек</small>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-md-4 one-height">
<div class="box">
<div class="box-header danger">
<h3>Удаления: {{deleted}}</h3>
</div>
<div class="box-tool box-tool-white">
<ul class="nav">
<li class="nav-item">
<a ng-click="getMoreDeleted()">
<i class="fa fa-eye"></i>
</a>
</li>
</ul>
</div>
<div class="box-body b-t">
<h4 class="m-a-0 text-md" ng-if="deleted > 0">
<a>
<span class="text-sm lead"><strong>Сумма: {{deleted_sum | curr}} BYN</strong></span>
</a>
</h4>
<span class="text-muted" ng-if="deleted == 0">Удаленных позиций нет</span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 one-height">
<div class="box">
<div class="box-header primary">
<h3>
Заказы со скидками: {{discounts}}
</h3>
</div>
<div class="box-tool box-tool-white">
<ul class="nav">
<li class="nav-item">
<a ng-click="getMoreDiscount()">
<i class="fa fa-eye"></i>
</a>
</li>
</ul>
</div>
<div class="box-body b-t">
<h4 class="m-a-0 text-md" ng-if="discounts > 0">
<a>
<span class="text-sm lead"><strong>Сумма: {{tot_disc_sum | curr}} BYN</strong></span>
</a>
</h4>
<span class="text-muted" ng-if="discounts == 0">Заказов со скидками нет</span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 one-height">
<div class="box">
<div class="box-header blue">
<h3>
Гостей: {{guests}}
</h3>
</div>
<div class="box-tool box-tool-white">
<ul class="nav">
<li class="nav-item">
<a ng-click="getMoreGuests()">
<i class="fa fa-eye"></i>
</a>
</li>
</ul>
</div>
<div class="box-body b-t">
<h4 class="m-a-0 text-md" ng-if="namedGuests > 0">
<a>
<span class="text-sm lead"><strong>Сумма заказов: {{sumNamedGuests | curr}} BYN</strong></span>
</a>
</h4>
<span class="text-muted" ng-if="namedGuests == 0">Именованных гостей нет</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 col-xl-4">
<div class="box">
<div class="box-header">
<h3>Текущие заказы</h3>
</div>
<div class="text-center b-t" style="height: 230px">
<div class="row-col">
<div class="row-cell p-a">
<div class="inline m-b">
<div ui-jp="easyPieChart" class="easyPieChart" ui-refresh="app.setting.color" data-redraw='true' data-percent="{{ orders_closed.percent }}"
ui-options="{
lineWidth: 8,
trackColor: 'rgba(0,0,0,0.05)',
barColor: '{{ app.setting.color.primary }}',
scaleColor: 'transparent',
size: 100,
scaleLength: 0,
animate:{
duration: 1500,
enabled:true
}
}">
<div>
<h5>{{ orders_closed.percent }}%</h5>
</div>
</div>
</div>
<div>
Закрытые
<small class="block m-b">
<strong>{{ orders_closed.total }}</strong> на сумму
<strong>{{ orders_closed.sum | curr}}</strong>
</small>
</div>
</div>
<div class="row-cell p-a dker" style="height: 230px">
<div class="inline m-b">
<div ui-jp="easyPieChart" class="easyPieChart" ui-refresh="app.setting.color" data-redraw='true' data-percent="{{ orders_waited.percent }}"
ui-options="{
lineWidth: 8,
trackColor: 'rgba(0,0,0,0.05)',
barColor: '{{ app.setting.color.warn }}',
scaleColor: 'transparent',
size: 100,
scaleLength: 0,
animate:{
duration: 1500,
enabled:true
}
}">
<div>
<h5>{{ orders_waited.percent }}%</h5>
</div>
</div>
</div>
<div>
Отложенные
<small class="block m-b">
<strong>{{ orders_waited.total }}</strong> на сумму
<strong>{{ orders_waited.sum | curr}}</strong>
</small>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4">
<div class="box">
<div class="box-header">
<h3>Текущие заказы</h3>
</div>
<div class="text-center b-t" style="height: 230px">
<div class="row-col">
<div class="row-cell p-a">
<div class="inline m-b">
<div ui-jp="easyPieChart" class="easyPieChart" ui-refresh="app.setting.color" data-redraw='true' data-percent="{{ orders_deleted.percent }}"
ui-options="{
lineWidth: 8,
trackColor: 'rgba(0,0,0,0.05)',
barColor: '#f44455',
scaleColor: 'transparent',
size: 100,
scaleLength: 0,
animate:{
duration: 1500,
enabled:true
}
}">
<div>
<h5>{{ orders_deleted.percent }}%</h5>
</div>
</div>
</div>
<div>
Удаленные
<small class="block m-b">
<strong>{{ orders_deleted.total }}</strong> на сумму
<strong>{{ orders_deleted.sum | curr}}</strong>
</small>
</div>
</div>
<div class="row-cell p-a dker" style="height: 230px">
<div class="inline m-b">
<div ui-jp="easyPieChart" class="easyPieChart" ui-refresh="app.setting.color" data-redraw='true' data-percent="{{ orders_returned.percent }}"
ui-options="{
lineWidth: 8,
trackColor: 'rgba(0,0,0,0.05)',
barColor: '{{ app.setting.color.accent }}',
scaleColor: 'transparent',
size: 100,
scaleLength: 0,
animate:{
duration: 1500,
enabled:true
}
}">
<div>
<h5>{{ orders_returned.percent }}%</h5>
</div>
</div>
</div>
<div>
Возвраты
<small class="block m-b">
<strong>{{ orders_returned.total }}</strong> на сумму
<strong>{{ orders_returned.sum | curr}}</strong>
</small>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12 col-xl-4">
<div class="box">
<div class="box-header">
<h3>Персонал</h3>
</div>
<div class="box-tool">
<ul class="nav">
<li class="nav-item">
<span bs-tooltip="" title="Кликните по персоналу для просмотра подробной информации" class="text-muted inline p-a-xs m-r-sm">
<i class="fa fa-question"></i>
</span>
</li>
</ul>
</div>
<div class="scrollable" style="height: 230px">
<table class="table table-striped table-hover">
<thead>
<tr>
<td>ФИО</td>
<td class="text-right">Количество заказов</td>
<td class="text-right">Сумма, BYN</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="personal in personals" ng-click="getStaffMore(personal)">
<td class="text-left">
<strong>{{ personal.name }}</strong>
</td>
<td class="text-right">{{ personal.orders_count }}</td>
<td class="text-right">{{ personal.orders_sum | curr}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 col-xl-6">
<div class="box">
<div class="box-header">
<h3>Гости</h3>
</div>
<div class="box-body">
<canvas class="chart chart-bar" chart-data="medianGuests.data" chart-series="medianGuests.series" chart-labels="medianGuests.labels"
chart-options="medianGuests.options" chart-colors="colors"></canvas>
</div>
</div>
</div>
<div class="col-md-12 col-xl-6">
<div class="box">
<div class="box-header">
<h3>Финансы</h3>
</div>
<div class="box-body">
<canvas class="chart chart-bar" chart-data="medianFinance.data" chart-labels="medianFinance.labels" chart-series="medianFinance.series"
chart-options="medianFinance.options" chart-colors="colors"></canvas>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 col-xl-8" style="max-height: 620px; "><!--overflow-y: hidden;-->
<div class="box">
<div class="box-header">
<h3>Топ продаваемых товаров</h3>
</div>
<div class="box-tool">
<ul class="nav">
<li class="nav-item">
<span bs-tooltip="" title="< 25%-сверхприбыль 25-35%-прибыль 35-50%-самоокупаемость > 50%-убыток" class="text-muted inline p-a-xs m-r-sm">
<i class="fa fa-question"></i>
</span>
</li>
</ul>
</div>
<div class="table-responsive">
<table class="table table-striped table-bordered">
<thead>
<tr>
<th></th>
<th class="text-center">Кол-во</th>
<th class="text-center">Сумма,
<br> BYN</th>
<th class="text-center">Total cost,
<br> BYN</th>
<th class="text-center">Total cost /
<br>Сумма</th>
<th class="text-center">Прибыль,
<br> BYN</th>
</tr>
</thead>
<tbody>
<tr class="text-right" ng-repeat="dish in dishes">
<td>
<strong>{{ dish.name }}</strong>
</td>
<td>{{ dish.count }}</td>
<td>{{ dish.sum | curr}}</td>
<td>{{ dish.totalCost | curr}}</td>
<td ng-class="getBackClass(dish.percentProffit)">{{ dish.percentProffit }} %</td>
<td>{{ dish.proffit | curr}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="col-md-12 col-xl-4">
<div class="box">
<div class="box-header">
<h3>Список занятых столов</h3>
</div>
<div class="box-tool">
<ul class="nav">
<li class="nav-item">
<span bs-tooltip="" title="Кликните по столу для просмотра подробной информации" class="text-muted inline p-a-xs m-r-sm">
<i class="fa fa-question"></i>
</span>
</li>
</ul>
</div>
<div class="box-body">
<p class="text-muted text-center" ng-if="tables.length == 0">Занятых столов нет</p>
<div class="table-responsive" ng-if="tables.length > 0" style="max-height: 510px;">
<table class="table table-striped table-hover">
<thead>
<tr>
<th>Зал</th>
<th>Номер стола</th>
<th>Количество заказов</th>
<th>Сумма, BYN</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="table in tables" ng-click="getTableMore(table)">
<td>
<strong>{{ table.place_name }}</strong>
</td>
<td>
<strong>{{ table.table_name }}</strong>
</td>
<td>{{ table.guests_count }}</td>
<td class="text-right">{{ table.sum | curr}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 col-xl-4">
<div class="box">
<div class="box-header">
<h3>Категории товаров</h3>
</div>
<div class="box-body">
<div class="box-body">
<canvas class="chart chart-pie" chart-data="folders.data" chart-labels="folders.labels" chart-options="folders.options"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-12 col-xl-4">
<div class="box">
<div class="box-header">
<h3>Места продаж</h3>
</div>
<div class="box-body">
<div class="box-body">
<canvas class="chart chart-pie" chart-data="printers.data" chart-labels="printers.labels" chart-options="printers.options"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-12 col-xl-4">
<div class="box">
<div class="box-header">
<h3>Типы оплат</h3>
</div>
<div class="box-body">
<div class="box-body">
<canvas class="chart chart-pie" chart-data="payments.data" chart-labels="payments.labels" chart-options="payments.options"></canvas>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="add-widget">
<div ui-include="'../views/dashboard/add.html'"></div>
</div>
<div class="modal fade" id="get-more-deleted">
<div ui-include="'../views/dashboard/items/more-deleted.html'"></div>
</div>
<!--<div class="modal my-modal fade" id="get-more-newyear">
<div ui-include="'../views/dashboard/items/more-newyear.html'"></div>
</div>-->
<div class="modal fade" id="get-more-guests">
<div ui-include="'../views/dashboard/items/more-guests.html'"></div>
</div>
<div class="modal fade" id="get-more-discount">
<div ui-include="'../views/dashboard/items/more-discount.html'"></div>
</div>
<div class="modal fade" id="get-more-total">
<div ui-include="'../views/dashboard/items/more-total.html'"></div>
</div>
<div class="modal fade" id="get-more-staff">
<div ui-include="'../views/dashboard/items/more-staff.html'"></div>
</div>
<div class="modal fade" id="get-more-table">
<div ui-include="'../views/dashboard/items/more-table.html'"></div>
</div>
<div class="modal fade" id="items-guests">
<div ui-include="'../views/dashboard/items/items-guests.html'"></div>
</div>
<div class="modal fade" id="items-discount">
<div ui-include="'../views/dashboard/items/items-discount.html'"></div>
</div>
<div class="modal fade" id="items-total">
<div ui-include="'../views/dashboard/items/items-total.html'"></div>
</div>
<div class="modal fade" id="items-staff">
<div ui-include="'../views/dashboard/items/items-staff.html'"></div>
</div>
<div class="modal fade" id="items-deleted">
<div ui-include="'../views/dashboard/items/items-deleted.html'"></div>
</div>
<div class="modal fade" id="preload-modal" data-backdrop="true">
<div ui-include="'../views/dashboard/preload.html'"></div>
</div>