Back | Home
الـ Path الحالي: /home/picotech/domains/instantly.picotech.app/public_html/public/.././resources/views/layouts/../customer/./campaign
الملفات الموجودة في هذا الـ Path:
.
..
analytics.blade.php
create.blade.php
details.blade.php
edit.blade.php
form.blade.php
index.blade.php
statistic.blade.php
template.blade.php
مشاهدة ملف: details.blade.php
@extends('layouts.customer')
@section('title','Campaign Template')
@section('extra-css')
<link rel="stylesheet" href="{{asset('plugins/select2/css/select2.min.css')}}">
<link rel="stylesheet" href="{{asset('plugins/ion-rangeslider/css/ion.rangeSlider.min.css')}}">
<link rel="stylesheet" href="{{asset('plugins/daterangepicker/daterangepicker.css')}}">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.20/summernote-bs4.min.css"/>
<style>
#labellUpdateModal .modal-dialog {
margin-top: 1%;
margin-left: 50%;
}
#labellUpdateModal .modal-dialog {
position: fixed;
margin: auto;
width: 320px;
height: 100%;
right: 0px;
}
#labellUpdateModal .modal-content {
height: 100%;
}
#labellUpdateModal .modal-body {
overflow-y: scroll;
overflow-x: hidden;
}
.campaign-nav-tab-content {
width: 100% !important;
box-shadow: rgb(255 255 255 / 16%) 0px 1px 4px !important;
}
.campaign-input-group-text {
background-color: #fff !important;
border: 1px solid #fff !important;
}
.campaign-message-input {
border: 1px solid #ffffff !important;
}
.campaign-message-input:focus {
color: #495057;
background-color: #fff;
border-color: #ffffff;
outline: 0;
box-shadow: inset 0 0 0 transparent, none;
}
#nav-tab a {
color: rgba(38, 47, 59, 0.64) !important;
}
.group-row label{
cursor: pointer;
}
.group-row{
padding: 12px 10px;
}
.group-row:hover{
background: #f9f9f9;
}
#addLeadsModal{
background: white;
}
#addLeadsModal .modal-content{
box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 0%) !important;
border: hidden !important;
}
.add_label label{
cursor: pointer;
}
.add_label{
cursor: pointer;
}
.custom-label-select:focus-visible{
outline: initial !important;
}
.custom-label-select{
height: 26px;
border: 1px solid #d1d1d1;
border-radius: 10px;
font-size: 12px;
padding: 4px;
outline: initial !important;
}
.w-100{
width: 100%;
}
.ind-icon-section{
background: white;
border: 1px solid #d1d1d1;
border-radius: 15px;
padding: 4px 8px;
font-size: 11px;
font-weight: 500;
color: black;
font-family: inherit;
}
button.nav-item.nav-link.float-right.run-campaign-btn {
position: absolute;
right: 40px;
border: 1px solid #006bff;
background: #006bff;
color: #fff !important;
font-size: 12px !important;
}
#run-campaign a{
color: #fff !important;
}
a.nav-item.nav-link.float-right.run-campaign-btn {
position: absolute;
right: 40px;
border: 1px solid #006bff;
background: #006bff;
color: #fff !important;
font-size: 12px !important;
}
#run-campaign button{
color: #fff !important;
}
</style>
@endsection
@section('content')
<div class="row">
<div class="col-md-12">
<nav>
<div class="nav nav-tabs" id="nav-tab" role="tablist">
<a class="nav-item nav-link active nav-analytics-btn" id="nav-analytics-tab" data-toggle="tab"
href="#nav-analytics" role="tab" aria-controls="nav-analytics" aria-selected="true">Analytics</a>
<a class="nav-item nav-link camp-lead-sec-btn" id="nav-leads-tab" data-toggle="tab"
href="#nav-leads" role="tab"
aria-controls="nav-leads" aria-selected="false">Leads</a>
<a class="nav-item nav-link camp-message-sec-btn" id="nav-message-tab" data-toggle="tab"
href="#nav-message" role="tab"
aria-controls="nav-message" aria-selected="false">Message</a>
<a class="nav-item nav-link camp-schedule-sec-btn" id="nav-schedule-tab" data-toggle="tab"
href="#nav-schedule" role="tab"
aria-controls="nav-schedule" aria-selected="false">Schedule</a>
<a class="nav-item nav-link" id="nav-options-tab" data-toggle="tab" href="#nav-options" role="tab"
aria-controls="nav-options" aria-selected="false">Options</a>
<div id="run-campaign">
@if($campaign->title && $campaign->from_email && $campaign->start_date && $campaign->end_date && $campaign->start_time && $campaign->end_time && $campaign->subject_line && $campaign->reply_to_email)
<a href="{{route('customer.campaign.template.send',['campaign_id'=>$campaign->id])}}"
class="campaign_create_btn nav-item nav-link float-right btn-btn-primary run-campaign-btn btn-sm">
Schedule
</a>
@else
<button disabled type="button"
class="campaign_create_btn preview_and_test_send_btn nav-item nav-link float-right btn run-campaign-btn btn-sm">
Schedule
</button>
@endif
</div>
</div>
</nav>
<div class="tab-content campaign-nav-tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-analytics" role="tabpanel"
aria-labelledby="nav-analytics-tab">
<div id="show_analytics_result">
<div class="campaign-analyics-sec">
<div class="campaign-analytics-header-sec">
<div class="campaign-title-sec">
Status:
<span>
@if($campaign->status=='running')
<span class="capmpaign-active-btn">{{trans('Complete')}}</span>
@else
<span class="capmpaign-active-btn">{{trans('Complete')}}</span>
@endif
</span>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="campaign-analytics-card-sec">
<div class="row">
<div class="col-md text-center">
<div class="icon-sec-for-campaign-analytics-card">
<i class="fa fa-handshake" aria-hidden="true"></i>
</div>
<div class="devider-sec">
{{isset($total_opened[0]->count)?$total_opened[0]->count:0}}
</div>
<div class="analytics-card-text">
{{trans('Total Opened')}}
</div>
</div>
<div class="col-md text-center">
<div class="icon-sec-for-campaign-analytics-card">
<i class="fa fa-envelope" aria-hidden="true"></i>
</div>
<div class="devider-sec">
{{isset($total_clicked)?$total_clicked:0}}
</div>
<div class="analytics-card-text">
{{trans('Total Clicked')}}
</div>
</div>
<div class="col-md text-center">
<div class="icon-sec-for-campaign-analytics-card">
<i class="fa fa-link" aria-hidden="true"></i>
</div>
<div class="devider-sec">
{{isset($total_bounced)?$total_bounced:0}}
</div>
<div class="analytics-card-text">
{{trans('Total Bounced')}}
</div>
</div>
<div class="col-md text-center">
<div class="icon-sec-for-campaign-analytics-card">
<i class="fa fa-check-circle" aria-hidden="true"></i>
</div>
<div class="devider-sec">
{{isset($total_unsubscribed)?$total_unsubscribed:0}}
</div>
<div class="analytics-card-text">
{{trans('Total Unsubscribed')}}
</div>
</div>
<div class="col-md text-center">
<div class="icon-sec-for-campaign-analytics-card">
<i class="fa fa-hand-peace" aria-hidden="true"></i>
</div>
<div class="devider-sec">
0 | $0
</div>
<div class="analytics-card-text">
Opportunities
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="nav-leads" role="tabpanel" aria-labelledby="nav-leads-tab">
<div id="cam-lead-sec">
<div class="row">
<div class="col-md-12 text-right mb-3">
<button type="button" class="btn btn-info addLeads">Add Leads</button>
</div>
<div class="col-md-6 col-sm-6">
<label>{{trans('Email')}}</label>
</div>
<div class="col-md-6 col-sm-6">
<label>{{trans('Status')}}</label>
</div>
</div>
<div class="row mt-3">
@if($group_contacts->isNotEmpty())
@foreach($group_contacts as $contact)
<div class="col-lg-6 col-sm-6">
<div class="form-check add_label replace_label_{{$contact->id}}"
data-edit-url="{{route('customer.contacts.edit', [$contact->id])}}"
data-first-name="{{$contact->first_name}}"
data-last-name="{{$contact->last_name}}"
data-email="{{$contact->email}}"
data-contact-id="{{$contact->id}}"
data-label="{{$contact->label_id}}">
<input id="contact-list-{{$contact->id}}"
class="form-check-input groupCheckChecked" type="checkbox">
<label class="form-check-label ml-3" for="contact-list-{{$contact->id}}">
{{$contact->email}}
</label>
</div>
</div>
<div class="col-lg-6 col-sm-6">
<span class="badge badge-success">Active</span>
<span class="ml-2 append_status_{{$contact->id}}">
@if($contact->label && isset($contact->label->name))
<span class="ind-icon-section">
<i class="fa fa-bolt mr-1" style="color: {{$contact->label?$contact->label->color:''}} !important;"></i>
{{$contact->label?$contact->label->name:''}}
</span>
@endif
</span>
</div>
@endforeach
@endif
</div>
</div>
</div>
<div class="tab-pane fade" id="nav-message" role="tabpanel" aria-labelledby="nav-message-tab">
<div id="camp-message-sec">
<div class="row">
<div class="col-md-8 m-auto">
<form method="post" class="col-md-12 text-right mt-3" action="{{route('customer.campaign.update',[$campaign])}}">
@csrf
@method('put')
<input type="hidden" name="update_type" value="subject">
<div class="form-group text-left">
<label for="">{{trans('Subject')}}</label>
<input type="text" class="form-control" value="{{isset($campaign->subject_line)?$campaign->subject_line:''}}" name="subject_line" placeholder="Your Subject">
</div>
<div class="form-group text-left">
<label for="">Choose Template</label>
<select id="templates" class="form-control" multiple="multiple" placeholder="Choose Template">
@foreach(emailTemplate() as $template)
<option value="{{$template['body']}}">{{$template['title']}}</option>
@endforeach
</select>
</div>
<div class="form-group text-left">
<label for="">{{trans('Message Body')}}</label>
<textarea class="form-control message_body_value" name="message_body" id="summernote" cols="4" rows="4" placeholder="Start Typing Here">{{isset($campaign->message_body)?$campaign->message_body:''}}</textarea>
<div class="mt-2">
<p>{first_name} = Customer First Name</p>
<p>{last_name} = Customer Last Name</p>
<p>{email} = Customer Email</p>
<p>{address} = Customer Address</p>
<p>{city} = Customer City</p>
<p>{zip_code} = Customer Zip Code</p>
<p>{address} = Customer Address</p>
</div>
</div>
<div class="form-group justify-content-end">
<button type="submit" class="campaign_create_btn" id="to_email_button">Save</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="nav-schedule" role="tabpanel" aria-labelledby="nav-schedule-tab">
<div id="camp-schedule-sec-wrapper">
<div class="row">
<div class="col-md-8 m-auto">
<form method="post" action="{{route('customer.campaign.update',[$campaign])}}">
@csrf
@method('put')
<input type="hidden" name="update_type" value="date_time">
<div class="card">
<div class="card-header">
<h4>{{trans('Timing')}}</h4>
</div>
<div class="card-body">
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="date">Starting Date</label>
<input type="date" class="form-control"
value="{{isset($campaign->start_date)?$campaign->start_date->format('Y-m-d'):''}}"
name="starting_date">
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<label for="date">Ending Date</label>
<input type="date" class="form-control"
value="{{isset($campaign->end_date)?$campaign->end_date->format('Y-m-d'):''}}"
name="ending_date">
</div>
</div>
</div>
</div>
</div>
<div class="card mt-3">
<div class="card-header">
<h4>{{trans('Dates')}}</h4>
</div>
<div class="card-body">
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="time">Starting Time</label>
<input type="time" class="form-control"
value="{{isset($campaign->start_time)?$campaign->start_time:''}}"
name="starting_time">
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<label for="time">Ending Time</label>
<input type="time" class="form-control"
value="{{isset($campaign->end_time)?$campaign->end_time:''}}" name="ending_time">
</div>
</div>
</div>
</div>
</div>
<div class="mt-4 ml-2">
<button type="submit" class="campaign_create_btn">Save</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="nav-options" role="tabpanel" aria-labelledby="nav-options-tab">
<div id="camp-options-sec-wrapper">
</div>
<form method="post" action="{{route('customer.campaign.update',[$campaign])}}">
@csrf
@method('put')
<input type="hidden" name="update_type" value="from">
<div class="row">
<div class="col-md-8 m-auto">
<div class="camp-option-sec">
<div class="form-group">
<label for="exampleFormControlSelect2">From Email</label>
<select class="form-control campaign_senders" id="campaign_sender" name="from_email">
@if($senders->isNotEmpty())
<option value=""></option>
@foreach($senders as $sender)
<option data-from-email="{{$sender->from_email}}" value="{{$sender->id}}" {{isset($campaign) && $campaign->from_email==$sender->from_email?'selected':''}}>
{{$sender->from_email}}
</option>
@endforeach
@endif
</select>
</div>
<div class="d-flex justify-content-between">
<div class="account-selection-sec">
<div class="account-sec-title">
Accounts to use
</div>
<div class="account-sec-des">
Select one or more accounts to send emails from
</div>
</div>
<div class="select-send-mail-options">
<div class="select-send-mail-text">
Add at least 1 account to send emails from
</div>
<button class="btn btn-outline-primary d-none" type="button">Add Email Account</button>
</div>
</div>
<div class="form-group text-right mt-3">
<button class="btn btn-sm btn-success" type="submit">Submit</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="addLeadsModal" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Add Leads</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="post" class="col-md-12 mt-3" action="{{route('customer.campaign.update',[$campaign])}}">
@csrf
@method('put')
<input type="hidden" name="update_type" value="to">
<div class="form-group row">
@if($groups->isNotEmpty())
@foreach($groups as $group)
@php
$groupId = json_decode($campaign->group_id);
@endphp
<div class="col-md-12 group-row">
<div class="form-check">
<input id="group-list-{{$group->id}}"
class="form-check-input groupCheckChecked" type="checkbox"
value=""
data-group-id="{{$group->id}}" {{isset($groupId) && in_array($group->id, $groupId)?'checked':''}} >
<label class="form-check-label" for="group-list-{{$group->id}}">
{{$group->name}}
</label>
</div>
</div>
@endforeach
@endif
</div>
<div id="to_email"></div>
<div class="mt-4 text-right form-group">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="modal fade" id="labellUpdateModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Contact</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="form-group">
<input type="hidden" class="ind_contact_id">
<label class="contact_name w-100"></label>
<select name="label_id" id="all_labels" class="custom-label-select mt-2">
@foreach($labels as $label)
<option data-name="{{$label->name}}" data-color="{{$label->color}}" style="color: {{$label->color}}" value="{{$label->id}}"> {{$label->name}}</option>
@endforeach
</select>
</div>
<div class="form-group mt-3">
<label for="">{{trans('Email')}}</label>
<input type="text" class="form-control border-white border-0 contact_email bg-white" disabled readonly>
</div>
<div class="form-group">
<label for="">{{trans('First Name')}}</label>
<input type="text" class="form-control border-white border-0 first_name bg-white" disabled readonly>
</div>
<div class="form-group">
<label for="">{{trans('Last Name')}}</label>
<input type="text" class="form-control border-white border-0 last_name bg-white" disabled readonly>
</div>
<div class="form-group mt-4">
<a class="contact_edit_btn btn btn-sm btn-info d-block" target="_blank">Edit</a>
</div>
</div>
</div>
</div>
</div>
</section>
@endsection
@section('extra-scripts')
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.20/summernote.min.js"></script>
<script>
$(document).on('click', '.add_label', function(e){
const contact_id=$(this).attr('data-contact-id');
const label=$(this).attr('data-label');
const email=$(this).attr('data-email');
const first_name=$(this).attr('data-first-name');
const last_name=$(this).attr('data-last-name');
const edit_url=$(this).attr('data-edit-url');
console.log(label);
$('.ind_contact_id').val(contact_id);
$('#all_labels').val(label);
$('.contact_edit_btn').attr('href', edit_url);
$('.contact_email').val(email);
$('.first_name').val(first_name);
$('.last_name').val(last_name);
$('.contact_name').text(email)
$('#labellUpdateModal').modal('show');
});
$(document).ready(function(){
$('#templates').select2({
multiple:false
})
});
$(document).on('change', '#templates', function(e){
const body =$(this).val();
console.log(body);
// Get Summernote instance
var summernoteInstance = $('.message_body_value').summernote();
// Set Summernote value
summernoteInstance.summernote('code', body);
});
$(document).on('change', '#all_labels', function(e){
const color = $('option:selected', "#all_labels").attr('data-color');
const name = $('option:selected', "#all_labels").attr('data-name');
const contact_id=$('.ind_contact_id').val();
const label_id=$(this).val();
$.ajax({
method:'POST',
url:'{{route('customer.change.contact.label')}}',
data:{
'_token':'{{csrf_token()}}',
label_id:label_id,
contact_id:contact_id
},
success:function(res){
if(res.status=='success'){
toastr.success(res.message, 'success', {timeOut: 5000});
$('.append_status_'+contact_id).html(`<span class="ind-icon-section"><i class="fa fa-bolt mr-1" style="color: ${color} !important;"></i> ${name}</span>`);
$('#labellUpdateModal').modal('hide');
$('.replace_label_'+contact_id).attr('data-label', label_id)
}else{
toastr.error(res.message, 'failed', {timeOut: 5000});
}
}
})
});
$(document).on('click', '.addLeads', function(e){
$('#addLeadsModal').modal('show');
});
$(document).ready(function () {
$(".nav-analytics-btn").trigger("click");
});
$(document).on('change', '.groupCheckChecked', function (e) {
e.preventDefault();
let groupIds = [];
let toEmail = '';
$(".groupCheckChecked").each(function () {
const inputChecked = $(this).is(':checked');
const groupId = $(this).attr('data-group-id');
if (inputChecked) {
groupIds.push(parseInt($(this).attr('data-group-id')));
toEmail += `<input type="hidden" name="group_id[]" value="${groupId}">`;
}
});
$('#to_email').html(toEmail);
if (groupIds.length <= 0) {
$("#gauge_thumb").css("width", '0%');
$('#group_contact_count').text('0');
$('#to_email').html('');
$('#remainingEmail').text($('#remainingEmail').attr('data-remaining'));
$("#to_email_button").attr('disabled', 'true');
return true;
}
$.ajax({
url: '{{route('customer.campaign.template.get.to.email')}}',
method: "GET",
data: {
group_id: groupIds,
},
success: function (res) {
if (res.status == 'success') {
let total = res.data.to_count;
$("#gauge_thumb").css("width", total + '%');
$('#group_contact_count').text(total);
const pre_remaining = $('#remainingEmail').attr('data-remaining');
const currentRemaining = parseInt(pre_remaining) - total;
$('#remainingEmail').text(currentRemaining);
if (currentRemaining <= 0) {
$("#to_email_button").attr('disabled', 'true');
} else {
$("#to_email_button").removeAttr('disabled');
}
}
},
error: function (err) {
$("#gauge_thumb").css("width", '0%');
$('#group_contact_count').text('0');
$('#to_email').html('');
$('#remainingEmail').text($('#remainingEmail').attr('data-remaining'));
$("#to_email_button").attr('disabled', 'true');
}
});
});
</script>
<script>
$('.campaign_senders').select2({
multiple:false,
tags: true,
placeholder: "Select a option",
})
</script>
@endsection