Файловый менеджер - Редактировать - /home/kckglobal/public_html/portal/resources/views/reports/lead/report-chart.blade.php
Назад
@extends('layouts.app') @section('filter-section') <div class="d-flex filter-box project-header bg-white border-bottom"> <div class="mobile-close-overlay w-100 h-100" id="close-client-overlay"></div> <div class="project-menu d-lg-flex" id="mob-client-detail"> <a class="d-none close-it" href="javascript:;" id="close-client-detail"> <i class="fa fa-times"></i> </a> <x-tab :href="route('lead-report.index') . '?tab=profile'" :text="__('modules.deal.profile')" class="profile" /> <x-tab :href="route('lead-report.chart') . '?tab=chart'" :text="__('modules.leadContact.leadReport')" class="chart" /> </div> </div> <x-filters.filter-box> <!-- DATE START --> <div class="select-box d-flex py-2 px-lg-2 px-md-2 px-0 border-right-grey border-right-grey-sm-0"> <p class="mb-0 pr-2 f-14 text-dark-grey d-flex align-items-center">@lang('modules.deal.pipeline')</p> <div class="select-year"> <select class="form-control select-picker" name="pipeline" id="pipeline" data-live-search="true" data-size="8"> @foreach ($pipelines as $pipeline) <option value="{{ $pipeline->id }}" @if ($pipeline->default == 1) selected @endif> {{ $pipeline->name }}</option> @endforeach </select> </div> </div> <div class="select-box d-flex py-2 px-lg-2 px-md-2 px-0 border-right-grey border-right-grey-sm-0"> <p class="mb-0 pr-2 f-14 text-dark-grey d-flex align-items-center">@lang('modules.deal.category')</p> <div class="select-year"> <select class="form-control select-picker" name="category" id="category" data-live-search="true" data-size="8"> <option value="all">@lang('app.all')</option> @foreach ($categories as $category) <option value="{{ $category->id }}">{{ $category->category_name }}</option> @endforeach </select> </div> </div> <div class="select-box d-flex py-2 px-lg-2 px-md-2 px-0 border-right-grey border-right-grey-sm-0"> <p class="mb-0 pr-2 f-14 text-dark-grey d-flex align-items-center">@lang('app.year')</p> <div class="select-status"> <select class="form-control select-picker" name="year" id="year" data-live-search="true" data-size="8"> @foreach ($years as $year) <option value="{{ $year }}">{{ $year }}</option> @endforeach </select> </div> </div> <!-- RESET START --> <div class="select-box d-flex py-1 px-lg-2 px-md-2 px-0"> <x-forms.button-secondary class="btn-xs d-none" id="reset-filters" icon="times-circle"> @lang('app.clearFilters') </x-forms.button-secondary> </div> <!-- RESET END --> </x-filters.filter-box> @endsection @section('content') <div class="content-wrapper"> <x-alert type="info" icon="info-circle"> @lang('messages.dealCloseDateMsg') </x-alert> <div class="d-flex flex-column w-tables rounded mt-4 bg-white"> <div id="chartContainer"></div> </div> <div id="table-actions" class="flex-grow-1 align-items-center mt-4"> @if (canDataTableExport()) <x-forms.button-secondary id="export-report" class="mr-3 mb-2 mb-lg-0" icon="file-export"> @lang('app.exportExcel') </x-forms.button-secondary> @endif </div> <div class="d-flex flex-column w-tables rounded mt-4 bg-white"> <div class="col-lg-12 col-md-12 ntfcn-tab-content-left w-100 p-4"> <div class="table-responsive" id="deal-report"> <x-table class="table-bordered"> <x-slot name="thead"> <th>@lang('app.month') </th> <th>@lang('modules.deal.dealsToBeClosed')</th> <th>@lang('modules.deal.totalDealAmount')</th> <th>@lang('modules.deal.averageDealValue')</th> <th>@lang('modules.deal.wonDeals')</th> <th>@lang('modules.deal.dealsWonValue')</th> <th>@lang('modules.deal.lostDeals')</th> <th>@lang('modules.deal.dealsLostValue')</th> <th>@lang('modules.deal.otherDealStages')</th> <th>@lang('modules.deal.otherDealStagesValue')</th> </x-slot> @foreach ($dealDatas as $dealData) <tr> <td>{{ __('app.months.' . $dealData['month']) }}</td> <td>{{ $dealData['deals_closed'] }}</td> <td>{{ $dealData['total_deal_amount'] ? currency_format($dealData['total_deal_amount'], company()->currencyId) : 0 }}</td> <td>{{ $dealData['average_deal_amount'] ? currency_format($dealData['average_deal_amount'], company()->currencyId) : 0 }}</td> <td>{{ $dealData['won_deals'] }}</td> <td>{{ $dealData['deals_won_amount'] ? currency_format($dealData['deals_won_amount'], company()->currencyId) : 0 }}</td> <td>{{ $dealData['lost_deals'] }}</td> <td>{{ $dealData['deals_lost_amount'] ? currency_format($dealData['deals_lost_amount'], company()->currencyId) : 0 }}</td> <td>{{ $dealData['other_stages'] }}</td> <td>{{ $dealData['other_stages_value'] ? currency_format($dealData['other_stages_value'], company()->currencyId) : 0 }}</td> </tr> @endforeach </x-table> </div> </div> </div> </div> @endsection @push('scripts') <script src="{{ asset('vendor/graph/frappechart.js') }}"></script> <script> var currencyCode = "{{ company()->currency->currency_code }}" const activeTab = "{{ $activeTab }}"; $('.project-menu .' + activeTab).addClass('active'); $(document).ready(function() { var datasetsData = @json($datasets); chart(datasetsData); function chart(datasetsData) { var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ]; var datasets = []; const chart = new frappe.Chart("#chartContainer", { data: { labels: monthNames, datasets: datasetsData.map(function(dataset) { return { name: dataset.name.substr(0, 12), values: dataset.values, chartType: dataset.chartType, color: dataset.color || '#d4f542' }; }) }, title: "Monthly Values by Stage", type: "axis-mixed", height: 300, axisOptions: { yAxisMode: 'tick', xAxisMode: 'tick', xIsSeries: 0 }, barOptions: { stacked: true, spaceRatio: 0.5 }, tooltipOptions: { formatTooltipX: (d) => (d + "").toUpperCase(), formatTooltipY: (d) => d + ' ' + currencyCode } }); } $('#pipeline, #year, #category').on('change', function() { var year = $('#year').val(); var pipeline = $('#pipeline').val(); var category = $('#category').val(); if (category == 'all') { category = null; } $.easyAjax({ url: "{{ route('lead-report.chart') }}", type: "GET", data: { year: year, pipeline: pipeline, category: category }, success: function(response) { chart(response.datasets); $('#deal-report').html(response.html); }, }); }); function showTable(loading = true) { var year = $('#year').val(); var pipeline = $('#pipeline').val(); var category = $('#category').val(); if (category == 'all') { category = null; } $.easyAjax({ url: "{{ route('lead-report.chart') }}", type: "GET", data: { year: year, pipeline: pipeline, category: category }, success: function(response) { chart(response.datasets); $('#deal-report').html(response.html); }, }); } $('#pipeline, #year, #category').on('change keyup', function() { if ($('#pipeline').val() != "all") { $('#reset-filters').removeClass('d-none'); showTable(); } else if ($('#year').val() != "all") { $('#reset-filters').removeClass('d-none'); showTable(); } else if ($('#category').val() != "all") { $('#reset-filters').removeClass('d-none'); showTable(); } else { $('#reset-filters').addClass('d-none'); showTable(); } }); $('#reset-filters').click(function() { $('#filter-form')[0].reset(); $('.filter-box .select-picker').selectpicker("refresh"); $('#reset-filters').addClass('d-none'); showTable(); }); }); @if (canDataTableExport()) $('#export-report').click(function() { var year = $('#year').val(); var pipeline = $('#pipeline').val(); var category = $('#category').val(); if (category == 'all') { category = null; } var url = "{{ route('deal-report.export', [':year', ':pipeline', ':category']) }}"; url = url.replace(':year', year).replace(':pipeline', pipeline).replace(':category', category); window.location.href = url; }); @endif </script> @endpush
| ver. 1.4 |
Github
|
.
| PHP 8.2.28 | Генерация страницы: 0.01 |
proxy
|
phpinfo
|
Настройка