499 lines
29 KiB
PHP
499 lines
29 KiB
PHP
@extends('layouts.app')
|
|
@section('title', __('crm::lang.call_workspace'))
|
|
@section('content')
|
|
@include('crm::layouts.nav')
|
|
@include('crm::telemarketing.partials.workspace_styles')
|
|
|
|
<div class="crm-page tm-workspace">
|
|
<div class="crm-page-header">
|
|
<div>
|
|
<h1><i class="fas fa-headset"></i> @lang('crm::lang.call_workspace')</h1>
|
|
<p class="crm-subtitle">@lang('crm::lang.workspace_idle_hint')</p>
|
|
</div>
|
|
<div>
|
|
<a href="{{ action([\Modules\Crm\Http\Controllers\PhoneListController::class, 'index']) }}" class="crm-btn crm-btn-ghost"><i class="fas fa-list"></i> @lang('crm::lang.phone_list')</a>
|
|
<a href="{{ action([\Modules\Crm\Http\Controllers\CallScriptController::class, 'index']) }}" class="crm-btn crm-btn-ghost"><i class="fas fa-scroll"></i> @lang('crm::lang.call_scripts')</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tm-stat-grid" id="tm_stats">
|
|
<div class="tm-stat tm-stat-indigo">
|
|
<div class="tm-stat-label">@lang('crm::lang.queue_remaining')</div>
|
|
<div class="tm-stat-value" id="stat_queue">{{ $workspaceStats['queue_remaining'] }}</div>
|
|
</div>
|
|
<div class="tm-stat tm-stat-teal">
|
|
<div class="tm-stat-label">@lang('crm::lang.today_calls')</div>
|
|
<div class="tm-stat-value"><span id="stat_today">{{ $workspaceStats['today_calls'] }}</span> / {{ $workspaceStats['daily_target'] }}</div>
|
|
</div>
|
|
<div class="tm-stat tm-stat-amber">
|
|
<div class="tm-stat-label">@lang('crm::lang.phone_status_interested')</div>
|
|
<div class="tm-stat-value" id="stat_interested">{{ $workspaceStats['today_interested'] }}</div>
|
|
</div>
|
|
<div class="tm-stat tm-stat-rose">
|
|
<div class="tm-stat-label">@lang('crm::lang.lead_score')</div>
|
|
<div class="tm-stat-value" id="stat_score">{{ $workspaceStats['avg_lead_score'] }}</div>
|
|
</div>
|
|
</div>
|
|
<div class="tm-card" style="margin-bottom:18px;padding:10px 18px;">
|
|
<div class="tm-stat-label">@lang('crm::lang.target_progress')</div>
|
|
<div class="tm-progress"><div class="tm-progress-bar" id="stat_progress" style="width:{{ $workspaceStats['target_progress'] }}%"></div></div>
|
|
</div>
|
|
|
|
<div id="tm_idle_panel">
|
|
<div class="tm-card tm-idle-hero">
|
|
<i class="fas fa-phone-volume fa-3x text-success" style="margin-bottom:16px;opacity:.85"></i>
|
|
<h3 style="margin-bottom:8px;font-weight:700">@lang('crm::lang.get_next_number')</h3>
|
|
<p class="text-muted" style="max-width:480px;margin:0 auto 24px">@lang('crm::lang.workspace_idle_hint')</p>
|
|
<button type="button" class="btn btn-success btn-lg" id="btn_acquire_next">
|
|
<i class="fas fa-phone"></i> @lang('crm::lang.get_next_number')
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="tm_active_panel" class="hide">
|
|
<div class="tm-layout">
|
|
<div>
|
|
<div class="tm-card">
|
|
<div class="tm-card-head">
|
|
<span><i class="fas fa-phone-alt"></i> <span id="tm_panel_title">@lang('crm::lang.ready_to_call')</span></span>
|
|
<span class="tm-badge tm-badge-pending" id="tm_status_badge">@lang('crm::lang.ready')</span>
|
|
</div>
|
|
<div class="tm-card-body">
|
|
<div class="tm-phone-display" id="tm_phone_number"></div>
|
|
<p class="text-muted" style="margin:6px 0 0"><i class="fas fa-building"></i> <span id="tm_company_name">-</span></p>
|
|
<p class="text-muted"><i class="fas fa-user"></i> <span id="tm_contact_name">-</span></p>
|
|
<div class="tm-timer-wrap">
|
|
<div class="tm-timer" id="tm_timer">00:00</div>
|
|
<small class="text-muted">@lang('crm::lang.call_timer')</small>
|
|
</div>
|
|
<div class="tm-actions">
|
|
<button type="button" class="btn btn-primary btn-block" id="btn_start_call"><i class="fas fa-phone"></i> @lang('crm::lang.start_call')</button>
|
|
<a href="#" class="btn btn-default btn-block hide" id="tm_tel_link" target="_blank"><i class="fas fa-external-link-alt"></i> @lang('crm::lang.redial')</a>
|
|
<button type="button" class="btn btn-danger" id="btn_end_call"><i class="fas fa-check"></i> @lang('crm::lang.complete_and_save')</button>
|
|
<button type="button" class="btn btn-default" id="btn_release"><i class="fas fa-undo"></i> @lang('crm::lang.release_number')</button>
|
|
</div>
|
|
<div class="tm-section-title">@lang('crm::lang.profile_completion')</div>
|
|
<div class="tm-progress"><div class="tm-progress-bar" id="tm_profile_bar" style="width:0%"></div></div>
|
|
<small id="tm_profile_pct">0%</small>
|
|
<a href="#" id="tm_company_link" class="btn btn-link btn-sm pull-left" target="_blank" style="display:none"><i class="fas fa-external-link-alt"></i> @lang('crm::lang.view_company_profile')</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tm-card">
|
|
<div class="tm-card-head"><i class="fas fa-scroll"></i> @lang('crm::lang.discovery_script')</div>
|
|
<div class="tm-card-body" id="tm_script_panel">
|
|
@if(!empty($script))
|
|
<p><strong>{{ $script->name }}</strong></p>
|
|
<p class="text-muted">{{ $script->opening_text }}</p>
|
|
@if(!empty($script->discovery_questions))
|
|
<ul class="tm-script-q" id="tm_script_questions">
|
|
@foreach($script->discovery_questions as $q)
|
|
<li><label><input type="checkbox" class="script-q-check"> <span>{{ $q }}</span></label></li>
|
|
@endforeach
|
|
</ul>
|
|
@endif
|
|
@if(!empty($script->closing_cta))
|
|
<p class="tm-field-hint"><i class="fas fa-flag-checkered"></i> {{ $script->closing_cta }}</p>
|
|
@endif
|
|
@else
|
|
<p class="text-muted">@lang('crm::lang.no_script_defined')</p>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tm-card">
|
|
<div class="tm-card-head"><i class="fas fa-history"></i> @lang('crm::lang.call_history')</div>
|
|
<div class="tm-card-body tm-timeline" id="tm_history"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<div class="tm-card">
|
|
<ul class="nav nav-tabs tm-tabs" role="tablist">
|
|
<li class="active"><a data-toggle="tab" href="#tab_profile"><i class="fas fa-building"></i> @lang('crm::lang.profile_tab')</a></li>
|
|
<li><a data-toggle="tab" href="#tab_contact"><i class="fas fa-user-tie"></i> @lang('crm::lang.who_did_you_speak_with')</a></li>
|
|
<li><a data-toggle="tab" href="#tab_assessment"><i class="fas fa-star"></i> @lang('crm::lang.assessment')</a></li>
|
|
<li><a data-toggle="tab" href="#tab_offers"><i class="fas fa-gift"></i> @lang('crm::lang.offers_tab')</a></li>
|
|
</ul>
|
|
<div class="tab-content tm-card-body">
|
|
<div id="tab_profile" class="tab-pane active">
|
|
{!! Form::open(['id' => 'tm_profile_form']) !!}
|
|
<div class="row">
|
|
<div class="col-md-6 form-group">{!! Form::label('company[brand_name]', __('crm::lang.companies')) !!}{!! Form::text('company[brand_name]', null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-6 form-group">{!! Form::label('company[legal_name]', __('business.business_name')) !!}{!! Form::text('company[legal_name]', null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-4 form-group">{!! Form::label('company[city]', __('crm::lang.import_col_city')) !!}{!! Form::text('company[city]', null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-4 form-group">{!! Form::label('company[province]', __('business.state')) !!}{!! Form::text('company[province]', null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-4 form-group">{!! Form::label('company[company_type]', __('sale.status')) !!}{!! Form::select('company[company_type]', $companyTypes, null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-6 form-group">{!! Form::label('company[main_phone]', __('lang_v1.mobile')) !!}{!! Form::text('company[main_phone]', null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-6 form-group">{!! Form::label('company[email]', __('business.email')) !!}{!! Form::email('company[email]', null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-12 form-group">{!! Form::label('company[address]', __('lang_v1.address')) !!}{!! Form::text('company[address]', null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-12 form-group">{!! Form::label('note', __('crm::lang.description')) !!}{!! Form::textarea('note', null, ['class' => 'form-control', 'rows' => 2, 'placeholder' => __('crm::lang.follow_up_note_placeholder')]) !!}</div>
|
|
</div>
|
|
<div class="tm-section-title">@lang('crm::lang.quick_add_requirement')</div>
|
|
<div class="row">
|
|
<div class="col-md-4">{!! Form::select('new_requirement[requirement_type]', $requirementTypes, null, ['class' => 'form-control']) !!}</div>
|
|
<div class="col-md-8">{!! Form::text('new_requirement[item_name]', null, ['class' => 'form-control', 'placeholder' => __('product.product_name')]) !!}</div>
|
|
</div>
|
|
<p class="tm-field-hint" id="tm_suggested_fields"></p>
|
|
{!! Form::close() !!}
|
|
</div>
|
|
|
|
<div id="tab_contact" class="tab-pane">
|
|
<div class="form-group">
|
|
<label>@lang('crm::lang.who_did_you_speak_with')</label>
|
|
<select class="form-control" id="company_contact_id" name="company_contact_id">
|
|
<option value="">— @lang('crm::lang.quick_add_contact') —</option>
|
|
</select>
|
|
</div>
|
|
<div class="tm-section-title">@lang('crm::lang.quick_add_contact')</div>
|
|
<div class="row">
|
|
<div class="col-md-4"><input type="text" class="form-control" id="nc_name" placeholder="@lang('user.name')"></div>
|
|
<div class="col-md-4">{!! Form::select('nc_role', $contactRoles, null, ['class' => 'form-control', 'id' => 'nc_role']) !!}</div>
|
|
<div class="col-md-4"><input type="text" class="form-control" id="nc_mobile" placeholder="@lang('lang_v1.mobile')"></div>
|
|
</div>
|
|
<input type="hidden" name="new_contact[name]" id="new_contact_name">
|
|
<input type="hidden" name="new_contact[role]" id="new_contact_role">
|
|
<input type="hidden" name="new_contact[mobile]" id="new_contact_mobile">
|
|
</div>
|
|
|
|
<div id="tab_assessment" class="tab-pane">
|
|
{!! Form::open(['id' => 'tm_assessment_form']) !!}
|
|
<div class="row">
|
|
<div class="col-md-6 form-group">
|
|
{!! Form::label('outcome', __('sale.status')) !!}
|
|
{!! Form::select('outcome', $outcomes, 'answered', ['class' => 'form-control', 'required']) !!}
|
|
</div>
|
|
<div class="col-md-6 form-group">
|
|
{!! Form::label('sentiment', __('crm::lang.sentiment')) !!}
|
|
{!! Form::select('sentiment', $sentiments, 'neutral', ['class' => 'form-control']) !!}
|
|
</div>
|
|
</div>
|
|
@foreach(['reception_score' => 'reception_score', 'tone_score' => 'tone_score', 'cooperation_score' => 'cooperation_score'] as $field => $label)
|
|
<div class="form-group">
|
|
<label>@lang('crm::lang.'.$label)</label>
|
|
<input type="hidden" name="{{ $field }}" id="{{ $field }}" value="">
|
|
<div class="tm-star-rating" data-field="{{ $field }}">
|
|
@for($i=1;$i<=5;$i++)<i class="far fa-star" data-value="{{ $i }}"></i>@endfor
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
<div class="row">
|
|
<div class="col-md-6"><label class="checkbox-inline">{!! Form::checkbox('decision_maker_reached', 1, false) !!} @lang('crm::lang.decision_maker_reached')</label></div>
|
|
<div class="col-md-6"><label class="checkbox-inline">{!! Form::checkbox('gatekeeper_blocked', 1, false) !!} @lang('crm::lang.gatekeeper_blocked')</label></div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label>@lang('crm::lang.partner_potential')</label>
|
|
{!! Form::select('partner_potential', $partnerPotentials, 'none', ['class' => 'form-control']) !!}
|
|
</div>
|
|
<div class="form-group">
|
|
<label>@lang('crm::lang.best_call_time')</label>
|
|
<input type="time" name="best_call_time" class="form-control">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>@lang('crm::lang.objection_price') / @lang('crm::lang.description')</label>
|
|
<div class="tm-objection-tags" id="tm_objections">
|
|
@foreach($objections as $key => $label)
|
|
<span class="tm-objection-tag" data-value="{{ $key }}">{{ $label }}</span>
|
|
@endforeach
|
|
</div>
|
|
<input type="hidden" name="objections_json" id="objections_json" value="[]">
|
|
</div>
|
|
<div class="form-group">
|
|
{!! Form::textarea('assessment_notes', null, ['class' => 'form-control', 'rows' => 2, 'placeholder' => __('crm::lang.follow_up_note_placeholder')]) !!}
|
|
</div>
|
|
{!! Form::close() !!}
|
|
</div>
|
|
|
|
<div id="tab_offers" class="tab-pane">
|
|
<p class="text-muted">@lang('crm::lang.offers_tab') — @lang('crm::lang.complete_and_save')</p>
|
|
<div id="tm_matched_offers"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade tm-complete-modal" id="tm_summary_modal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content crm-modal-form">
|
|
<div class="modal-header"><button type="button" class="close" data-dismiss="modal">×</button><h4 class="modal-title">@lang('crm::lang.session_summary')</h4></div>
|
|
<div class="modal-body text-center">
|
|
<div class="lead-score-ring" id="summary_score">0</div>
|
|
<p id="summary_msg"></p>
|
|
<div id="summary_offers"></div>
|
|
</div>
|
|
<div class="modal-footer"><button type="button" class="btn btn-primary" data-dismiss="modal">@lang('messages.close')</button></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@section('javascript')
|
|
<script>
|
|
$(function() {
|
|
var sessionId = {{ !empty($activeSession) ? $activeSession->id : 'null' }};
|
|
var queueId = {{ !empty($activeQueue) ? $activeQueue->id : 'null' }};
|
|
var phoneId = null;
|
|
var companyId = null;
|
|
var timerInterval = null;
|
|
var seconds = 0;
|
|
var callStarted = {{ !empty($activeSession) ? 'true' : 'false' }};
|
|
var selectedObjections = [];
|
|
|
|
function pad(n) { return n < 10 ? '0' + n : n; }
|
|
|
|
function setCallState(inCall) {
|
|
callStarted = inCall;
|
|
if (inCall) {
|
|
$('#tm_panel_title').text('@lang("crm::lang.call_in_progress")');
|
|
$('#tm_status_badge').removeClass('tm-badge-pending').addClass('tm-badge-calling').text('LIVE');
|
|
$('#btn_start_call').prop('disabled', true).addClass('hide');
|
|
$('#tm_tel_link').removeClass('hide');
|
|
} else {
|
|
$('#tm_panel_title').text('@lang("crm::lang.ready_to_call")');
|
|
$('#tm_status_badge').removeClass('tm-badge-calling').addClass('tm-badge-pending').text('@lang("crm::lang.ready")');
|
|
$('#btn_start_call').prop('disabled', false).removeClass('hide');
|
|
$('#tm_tel_link').addClass('hide');
|
|
$('#tm_timer').text('00:00');
|
|
}
|
|
}
|
|
|
|
function startTimer(fromSeconds) {
|
|
seconds = fromSeconds || 0;
|
|
clearInterval(timerInterval);
|
|
$('#tm_timer').text(pad(Math.floor(seconds / 60)) + ':' + pad(seconds % 60));
|
|
timerInterval = setInterval(function() {
|
|
seconds++;
|
|
$('#tm_timer').text(pad(Math.floor(seconds / 60)) + ':' + pad(seconds % 60));
|
|
}, 1000);
|
|
}
|
|
|
|
function stopTimer() {
|
|
clearInterval(timerInterval);
|
|
timerInterval = null;
|
|
}
|
|
function refreshStats() {
|
|
$.get('{{ action([\Modules\Crm\Http\Controllers\CallWorkspaceController::class, "workspaceStats"]) }}', function(d) {
|
|
$('#stat_queue').text(d.queue_remaining);
|
|
$('#stat_today').text(d.today_calls);
|
|
$('#stat_interested').text(d.today_interested);
|
|
$('#stat_score').text(d.avg_lead_score);
|
|
$('#stat_progress').css('width', d.target_progress + '%');
|
|
});
|
|
}
|
|
|
|
$('.tm-star-rating i').click(function() {
|
|
var field = $(this).parent().data('field');
|
|
var val = $(this).data('value');
|
|
$('#' + field).val(val);
|
|
$(this).parent().find('i').each(function() {
|
|
$(this).toggleClass('fas active', $(this).data('value') <= val).toggleClass('far', $(this).data('value') > val);
|
|
});
|
|
});
|
|
|
|
$('.tm-objection-tag').click(function() {
|
|
var v = $(this).data('value');
|
|
$(this).toggleClass('selected');
|
|
selectedObjections = [];
|
|
$('#tm_objections .selected').each(function() { selectedObjections.push($(this).data('value')); });
|
|
$('#objections_json').val(JSON.stringify(selectedObjections));
|
|
});
|
|
|
|
$(document).on('change', '.script-q-check', function() {
|
|
$(this).closest('li').toggleClass('done', this.checked);
|
|
});
|
|
|
|
function showActive(data, inCall) {
|
|
$('#tm_idle_panel').addClass('hide');
|
|
$('#tm_active_panel').removeClass('hide');
|
|
var p = data.phone;
|
|
$('#tm_phone_number').text(p.mobile_number);
|
|
$('#tm_company_name').text(p.company_name || p.contact_name || '-');
|
|
$('#tm_contact_name').text(p.contact_name || '-');
|
|
$('#tm_tel_link').attr('href', 'tel:' + p.mobile_number);
|
|
$('input[name="company[brand_name]"]').val(p.company_name || '');
|
|
$('input[name="company[city]"]').val(p.city || '');
|
|
$('input[name="company[province]"]').val(p.province || '');
|
|
$('input[name="company[main_phone]"]').val(p.mobile_number || '');
|
|
phoneId = p.id;
|
|
setCallState(!!inCall);
|
|
loadWorkspaceData();
|
|
}
|
|
|
|
function renderTimeline(logs, callLogs) {
|
|
var html = '';
|
|
(logs || []).forEach(function(l) {
|
|
html += '<div class="tm-timeline-item"><div class="tm-timeline-time">' + (l.created_at || '') + (l.user ? ' — ' + l.user : '') + '</div><strong>' + l.status + '</strong>' + (l.note ? '<br><small>' + l.note + '</small>' : '') + '</div>';
|
|
});
|
|
if ((callLogs || []).length) {
|
|
html += '<div class="tm-section-title">@lang("crm::lang.mobile_logs")</div>';
|
|
callLogs.forEach(function(c) {
|
|
html += '<div class="tm-timeline-item"><small>' + (c.start_time || '') + ' — ' + (c.duration || 0) + 's</small></div>';
|
|
});
|
|
}
|
|
$('#tm_history').html(html || '<p class="text-muted">—</p>');
|
|
}
|
|
|
|
function loadWorkspaceData() {
|
|
if (!phoneId) return;
|
|
$.get('{{ url("crm/telemarketing/workspace/data") }}/' + phoneId, function(r) {
|
|
renderTimeline(r.logs, r.call_logs);
|
|
if (r.company) {
|
|
companyId = r.company.id;
|
|
var c = r.company;
|
|
$('#tm_profile_bar').css('width', (c.profile_completion || 0) + '%');
|
|
$('#tm_profile_pct').text((c.profile_completion || 0) + '%');
|
|
$('#tm_company_link').attr('href', r.company_url).show();
|
|
$('input[name="company[brand_name]"]').val(c.brand_name || '');
|
|
$('input[name="company[legal_name]"]').val(c.legal_name || '');
|
|
$('input[name="company[city]"]').val(c.city || '');
|
|
$('input[name="company[province]"]').val(c.province || '');
|
|
$('input[name="company[email]"]').val(c.email || '');
|
|
$('input[name="company[address]"]').val(c.address || '');
|
|
var $sel = $('#company_contact_id').empty().append('<option value="">—</option>');
|
|
(r.contacts || []).forEach(function(ct) {
|
|
$sel.append('<option value="' + ct.id + '">' + ct.name + ' (' + ct.role + ')</option>');
|
|
});
|
|
if ((r.suggested_fields || []).length) {
|
|
$('#tm_suggested_fields').text('@lang("crm::lang.suggested_fields_hint"): ' + r.suggested_fields.join(', '));
|
|
}
|
|
loadMatchedOffers();
|
|
}
|
|
});
|
|
}
|
|
|
|
function loadMatchedOffers() {
|
|
if (!companyId) {
|
|
$('#tm_matched_offers').html('<p class="text-muted">@lang("crm::lang.complete_profile_first")</p>');
|
|
return;
|
|
}
|
|
$.get('{{ url("crm/telemarketing/workspace/offers") }}/' + companyId, function(r) {
|
|
if (!r.success || !(r.offers || []).length) {
|
|
$('#tm_matched_offers').html('<p class="text-muted">@lang("crm::lang.no_matched_offers")</p>');
|
|
return;
|
|
}
|
|
var html = '<div class="tm-offer-list">';
|
|
r.offers.forEach(function(o) {
|
|
html += '<label class="tm-offer-item"><input type="checkbox" name="offer_ids[]" value="' + o.id + '"> ' +
|
|
'<strong>' + (o.name || '') + '</strong><br><small class="text-muted">' + (o.description || '') + '</small></label>';
|
|
});
|
|
html += '</div>';
|
|
$('#tm_matched_offers').html(html);
|
|
});
|
|
}
|
|
|
|
$('a[href="#tab_offers"]').on('shown.bs.tab', function() { loadMatchedOffers(); });
|
|
|
|
function buildPayload() {
|
|
$('#new_contact_name').val($('#nc_name').val());
|
|
$('#new_contact_role').val($('#nc_role').val());
|
|
$('#new_contact_mobile').val($('#nc_mobile').val());
|
|
var payload = $('#tm_assessment_form').serializeArray();
|
|
payload.push({name: '_token', value: '{{ csrf_token() }}'});
|
|
payload.push({name: 'company_contact_id', value: $('#company_contact_id').val()});
|
|
payload.push({name: 'objections', value: $('#objections_json').val()});
|
|
$('#tm_profile_form').serializeArray().forEach(function(f) { payload.push(f); });
|
|
if (companyId) payload.push({name: 'company_id', value: companyId});
|
|
$('#tm_matched_offers input:checked').each(function() {
|
|
payload.push({name: 'offer_ids[]', value: $(this).val()});
|
|
});
|
|
return payload;
|
|
}
|
|
|
|
function resetWorkspace() {
|
|
stopTimer();
|
|
sessionId = queueId = phoneId = companyId = null;
|
|
seconds = 0;
|
|
callStarted = false;
|
|
$('#tm_active_panel').addClass('hide');
|
|
$('#tm_idle_panel').removeClass('hide');
|
|
$('#tm_assessment_form')[0].reset();
|
|
$('#tm_profile_form')[0].reset();
|
|
$('.tm-star-rating i').removeClass('fas active').addClass('far');
|
|
$('.tm-objection-tag').removeClass('selected');
|
|
setCallState(false);
|
|
refreshStats();
|
|
}
|
|
|
|
@if(!empty($activeSession))
|
|
showActive({ phone: @json($activeSession->phoneFollowUp) }, true);
|
|
startTimer(Math.max(0, Math.floor((Date.now() - new Date('{{ $activeSession->started_at }}').getTime()) / 1000)));
|
|
@elseif(!empty($activeQueue))
|
|
showActive({ phone: @json($activeQueue->phoneFollowUp) }, false);
|
|
@endif
|
|
|
|
$('#btn_acquire_next').click(function() {
|
|
var $btn = $(this).prop('disabled', true);
|
|
$.post('{{ action([\Modules\Crm\Http\Controllers\CallWorkspaceController::class, "acquireNext"]) }}', {_token: '{{ csrf_token() }}'}, function(r) {
|
|
$btn.prop('disabled', false);
|
|
if (!r.success) { toastr.warning(r.msg); return; }
|
|
queueId = r.queue.id;
|
|
sessionId = null;
|
|
stopTimer();
|
|
showActive(r, false);
|
|
});
|
|
});
|
|
|
|
$('#btn_start_call').click(function() {
|
|
if (!queueId) { toastr.warning('@lang("messages.something_went_wrong")'); return; }
|
|
if (callStarted && sessionId) {
|
|
window.location.href = $('#tm_tel_link').attr('href');
|
|
return;
|
|
}
|
|
var $btn = $(this).prop('disabled', true);
|
|
$.post('{{ action([\Modules\Crm\Http\Controllers\CallWorkspaceController::class, "startSession"]) }}', {_token: '{{ csrf_token() }}', queue_id: queueId}, function(sr) {
|
|
$btn.prop('disabled', false);
|
|
if (!sr.success) { toastr.error(sr.msg); return; }
|
|
sessionId = sr.session.id;
|
|
setCallState(true);
|
|
startTimer(0);
|
|
window.location.href = 'tel:' + $('#tm_phone_number').text().trim();
|
|
}).fail(function() { $btn.prop('disabled', false); toastr.error('@lang("messages.something_went_wrong")'); });
|
|
});
|
|
|
|
$('#btn_release').click(function() {
|
|
if (!queueId) return;
|
|
$.post('{{ action([\Modules\Crm\Http\Controllers\CallWorkspaceController::class, "releaseQueue"]) }}', {_token: '{{ csrf_token() }}', queue_id: queueId}, function(r) {
|
|
if (r.success) { toastr.info(r.msg); resetWorkspace(); }
|
|
});
|
|
});
|
|
|
|
$('#btn_end_call').click(function() {
|
|
if (!queueId) { toastr.warning('@lang("messages.something_went_wrong")'); return; }
|
|
if (!$('#outcome').val()) { $('a[href="#tab_assessment"]').tab('show'); toastr.warning('@lang("sale.status")'); return; }
|
|
var $btn = $(this).prop('disabled', true);
|
|
|
|
function doComplete() {
|
|
$.post('{{ url("crm/telemarketing/sessions") }}/' + sessionId + '/complete', $.param(buildPayload()), function(r) {
|
|
$btn.prop('disabled', false);
|
|
if (r.success) {
|
|
$('#summary_score').text(r.lead_score || '—');
|
|
$('#summary_msg').text(r.msg);
|
|
var oh = '<ul class="list-unstyled text-right">';
|
|
(r.matched_offers || []).forEach(function(o) { oh += '<li><i class="fas fa-check text-success"></i> ' + (o.name || '') + '</li>'; });
|
|
oh += '</ul>';
|
|
$('#summary_offers').html(oh);
|
|
$('#tm_summary_modal').modal('show');
|
|
resetWorkspace();
|
|
} else { toastr.error(r.msg); }
|
|
}).fail(function() { $btn.prop('disabled', false); toastr.error('@lang("messages.something_went_wrong")'); });
|
|
}
|
|
|
|
if (!sessionId) {
|
|
$.post('{{ action([\Modules\Crm\Http\Controllers\CallWorkspaceController::class, "startSession"]) }}', {_token: '{{ csrf_token() }}', queue_id: queueId}, function(sr) {
|
|
if (!sr.success) { $btn.prop('disabled', false); toastr.error(sr.msg); return; }
|
|
sessionId = sr.session.id;
|
|
doComplete();
|
|
}).fail(function() { $btn.prop('disabled', false); toastr.error('@lang("messages.something_went_wrong")'); });
|
|
return;
|
|
}
|
|
doComplete();
|
|
});
|
|
|
|
setInterval(refreshStats, 60000);
|
|
});
|
|
</script>
|
|
@endsection
|