Viewing file:  40bdd51333085bcd3ddd2d7cf138017e.php (13.67 KB) -rw-r--r--
Select action/file-type:
 (+) |  (+) |  (+) | Code (+) | Session (+) |  (+) | SDB (+) |  (+) |  (+) |  (+) |  (+) |  (+) |
<?php $__env->startSection('title'); ?> <?php echo e(trans('customer.devices')); ?> <?php $__env->stopSection(); ?>
<?php $__env->startSection('extra-css'); ?>
<link rel="stylesheet" href="<?php echo e(asset('plugins/datatables-bs4/css/dataTables.bootstrap4.min.css')); ?>">
<link rel="stylesheet" href="<?php echo e(asset('plugins/datatables-responsive/css/responsive.bootstrap4.min.css')); ?>">
<style>
.modal-qr-code {
height: 200px;
width: 220px;
margin: 0 auto;
}
.modal-qr-code img {
width: 100%;
height: 100%;
}
#qrcode {
width: 100%;
height: 100%;
margin: 0 auto;
text-align: center;
}
#qrcode a {
font-size: 0.8em;
}
.qr-url, .qr-size {
padding: 0.5em;
border: 1px solid #ddd;
border-radius: 2px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
canvas {
height: 100%;
width: 100%;
}
</style>
<?php $__env->stopSection(); ?>
<?php $__env->startSection('content'); ?>
<!-- Main content -->
<section class="content">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h2 class="card-title"><?php echo app('translator')->get('customer.list'); ?>
<span class="ml-2 what-font-size icon-position" data-toggle="tooltip" data-placement="right" title="<?php echo e(trans('customer.device_description')); ?>">
<i class="fa fa-question-circle"></i>
</span>
</h2>
<div class="float-right">
<?php if (app(\Illuminate\Contracts\Auth\Access\Gate::class)->check('device_add')): ?>
<button type="button" disabled class="disable btn btn-primary text-front-normal generate-qr-code" data-toggle="modal"
data-target="#deviceCreate">
<?php echo e(trans('customer.add_new_device')); ?>
</button>
<?php endif; ?>
</div>
</div>
<!-- /.card-header -->
<div class="card-body">
<table id="deviceTable" class="table table-striped table-bordered dt-responsive nowrap">
<thead>
<tr>
<th><?php echo e(trans('customer.device_name')); ?></th>
<th><?php echo e(trans('customer.total_sent_message')); ?></th>
<th><?php echo e(trans('customer.status')); ?></th>
<th><?php echo e(trans('customer.action')); ?></th>
</tr>
</thead>
</table>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>
<!-- /.content -->
<!-- Modal -->
<div class="modal fade" id="deviceCreate" 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"><?php echo e(trans('customer.add_new_device')); ?></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span class="close-icon" aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="form-group" id="create_device_section">
<label for="device_name"><?php echo e(trans('customer.device_name')); ?></label>
<input type="text" class="form-control" id="device_name">
</div>
<div id="instructions" class="d-none">
<div class="form-group">
<p>Just follow the below steps to connect your WhatsApp.</p>
<ul class="device-text">
<li><b>Step 1 :</b> Open WhatsApp on your phone.</li>
<li><b>Step 2 :</b> <span dir="ltr" class="_11JPr">Tap <strong><span dir="ltr"
class="_11JPr">Menu <span class="l7jjieqr fewfhwl7"><svg height="24px"
viewBox="0 0 24 24" width="24px">
<rect fill="#f2f2f2" height="24" rx="3" width="24">
</rect>
<path
d="m12 15.5c.825 0 1.5.675 1.5 1.5s-.675 1.5-1.5 1.5-1.5-.675-1.5-1.5.675-1.5 1.5-1.5zm0-2c-.825 0-1.5-.675-1.5-1.5s.675-1.5 1.5-1.5 1.5.675 1.5 1.5-.675 1.5-1.5 1.5zm0-5c-.825 0-1.5-.675-1.5-1.5s.675-1.5 1.5-1.5 1.5.675 1.5 1.5-.675 1.5-1.5 1.5z"
fill="#818b90"></path>
</svg></span></span></strong> or <strong><span dir="ltr"
class="_11JPr">Settings <span class="l7jjieqr fewfhwl7"><svg width="24"
height="24" viewBox="0 0 24 24">
<rect fill="#F2F2F2" width="24" height="24" rx="3">
</rect>
<path
d="M12 18.69c-1.08 0-2.1-.25-2.99-.71L11.43 14c.24.06.4.08.56.08.92 0 1.67-.59 1.99-1.59h4.62c-.26 3.49-3.05 6.2-6.6 6.2zm-1.04-6.67c0-.57.48-1.02 1.03-1.02.57 0 1.05.45 1.05 1.02 0 .57-.47 1.03-1.05 1.03-.54.01-1.03-.46-1.03-1.03zM5.4 12c0-2.29 1.08-4.28 2.78-5.49l2.39 4.08c-.42.42-.64.91-.64 1.44 0 .52.21 1 .65 1.44l-2.44 4C6.47 16.26 5.4 14.27 5.4 12zm8.57-.49c-.33-.97-1.08-1.54-1.99-1.54-.16 0-.32.02-.57.08L9.04 5.99c.89-.44 1.89-.69 2.96-.69 3.56 0 6.36 2.72 6.59 6.21h-4.62zM12 19.8c.22 0 .42-.02.65-.04l.44.84c.08.18.25.27.47.24.21-.03.33-.17.36-.38l.14-.93c.41-.11.82-.27 1.21-.44l.69.61c.15.15.33.17.54.07.17-.1.24-.27.2-.48l-.2-.92c.35-.24.69-.52.99-.82l.86.36c.2.08.37.05.53-.14.14-.15.15-.34.03-.52l-.5-.8c.25-.35.45-.73.63-1.12l.95.05c.21.01.37-.09.44-.29.07-.2.01-.38-.16-.51l-.73-.58c.1-.4.19-.83.22-1.27l.89-.28c.2-.07.31-.22.31-.43s-.11-.35-.31-.42l-.89-.28c-.03-.44-.12-.86-.22-1.27l.73-.59c.16-.12.22-.29.16-.5-.07-.2-.23-.31-.44-.29l-.95.04c-.18-.4-.39-.77-.63-1.12l.5-.8c.12-.17.1-.36-.03-.51-.16-.18-.33-.22-.53-.14l-.86.35c-.31-.3-.65-.58-.99-.82l.2-.91c.03-.22-.03-.4-.2-.49-.18-.1-.34-.09-.48.01l-.74.66c-.39-.18-.8-.32-1.21-.43l-.14-.93a.426.426 0 00-.36-.39c-.22-.03-.39.05-.47.22l-.44.84-.43-.02h-.22c-.22 0-.42.01-.65.03l-.44-.84c-.08-.17-.25-.25-.48-.22-.2.03-.33.17-.36.39l-.13.88c-.42.12-.83.26-1.22.44l-.69-.61c-.15-.15-.33-.17-.53-.06-.18.09-.24.26-.2.49l.2.91c-.36.24-.7.52-1 .82l-.86-.35c-.19-.09-.37-.05-.52.13-.14.15-.16.34-.04.51l.5.8c-.25.35-.45.72-.64 1.12l-.94-.04c-.21-.01-.37.1-.44.3-.07.2-.02.38.16.5l.73.59c-.1.41-.19.83-.22 1.27l-.89.29c-.21.07-.31.21-.31.42 0 .22.1.36.31.43l.89.28c.03.44.1.87.22 1.27l-.73.58c-.17.12-.22.31-.16.51.07.2.23.31.44.29l.94-.05c.18.39.39.77.63 1.12l-.5.8c-.12.18-.1.37.04.52.16.18.33.22.52.14l.86-.36c.3.31.64.58.99.82l-.2.92c-.04.22.03.39.2.49.2.1.38.08.54-.07l.69-.61c.39.17.8.33 1.21.44l.13.93c.03.21.16.35.37.39.22.03.39-.06.47-.24l.44-.84c.23.02.44.04.66.04z"
fill="#818b90"></path>
</svg></span></span></strong> and select <strong>Linked
Devices</strong></span></li>
<li><b>Step 3 :</b><span>Tap on <strong>Link a device</strong></span></li>
<li><b>Step 4 :</b> <span>Point your phone to this screen to capture the QR code</span></li>
</ul>
</div>
<div class="modal-qr-code">
<canvas id="qrcode"></canvas>
</div>
</div>
</div>
<div class="modal-footer border-0">
<button type="button" class="btn btn-primary text-front-normal" id="deviceCreateBtn">Create</button>
<button type="button" class="btn btn-secondary text-front-normal d-none" id="modalCloseBtn" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<input type="hidden" id="add_type" value="<?php echo e(request()->get('type')); ?>">
<?php $__env->stopSection(); ?>
<?php $__env->startSection('extra-scripts'); ?>
<script src="<?php echo e(asset('plugins/datatables/jquery.dataTables.min.js')); ?>"></script>
<script src="<?php echo e(asset('plugins/datatables-bs4/js/dataTables.bootstrap4.min.js')); ?>"></script>
<script src="<?php echo e(asset('plugins/datatables-responsive/js/dataTables.responsive.min.js')); ?>"></script>
<script src="<?php echo e(asset('plugins/datatables-responsive/js/responsive.bootstrap4.min.js')); ?>"></script>
<script src="<?php echo e(asset('js/readmore.min.js')); ?>"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrious/4.0.2/qrious.min.js"></script>
<script src="https://cdn.socket.io/4.7.2/socket.io.min.js" integrity="sha384-mZLF4UVrpi/QTWPA7BjNPEnkIfRFn4ZEO3Qt/HFklTJBj/gBOV8G3HcKn4NfQblz" crossorigin="anonymous"></script>
<script>
"use strict";
const socket = io("<?php echo e(config('pico.wa_server_host')); ?>");
socket.on("connect", () => {
$('.generate-qr-code').removeAttr('disabled').removeClass('disable')
});
socket.on("qrcode", (res) => {
if(!res.code){
notify('danger','Invalid qr code')
retrn;
}
const code=res.code;
new QRious({element: document.getElementById("qrcode"), value: code, size: 200});
});
socket.on('scanned',(resp)=>{
$.ajax({
method:'post',
url:"<?php echo e(route('customer.device.status')); ?>",
data:{id:resp.id,status:'active',_token:"<?php echo e(csrf_token()); ?>"},
success:(res)=>{
console.log(res);
$('#deviceCreate').modal('hide');
setTimeout(() => {
deviceTable.ajax.reload();
}, 2000);
}
});
})
</script>
<script>
const deviceTable=$('#deviceTable').DataTable({
processing: true,
serverSide: true,
responsive: true,
ajax: '<?php echo e(route('customer.get.all.device')); ?>',
columns: [
{"data": "name"},
{"data": "total_sent_message"},
{"data": "status"},
{"data": "action"},
],
});
$('#deviceCreateBtn').on('click', function (e) {
e.preventDefault();
$('#qrcode').empty();
const name=$("#device_name").val();
$.ajax({
method:'post',
url:"<?php echo e(route('customer.device.store')); ?>",
data:{name:name,_token:"<?php echo e(csrf_token()); ?>"},
success:(res)=>{
$('#create_device_section').addClass('d-none');
$('#instructions').removeClass('d-none');
deviceTable.ajax.reload();
socket.emit('scan',{id:res.data.device_unique_id})
$(this).addClass('d-none');
$('#modalCloseBtn').removeClass('d-none');
},
error:(err)=>{
if(err.responseJSON && err.responseJSON){
const messages=err.responseJSON.message;
console.log(typeof messages);
let alertMessage = "";
if (typeof messages == "object") {
for (const key in messages) {
alertMessage += messages[key][0] + "\n\r";
}
} else {
alertMessage = messages;
}
notify('danger',alertMessage)
}
}
})
});
$(document).ready(function() {
const add_type = $('#add_type').val();
if (add_type == 'add'){
$('.generate-qr-code').trigger('click');
}
});
</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.customer', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/picotech/domains/sender.picotech.app/public_html/resources/views/customer/device/index.blade.php ENDPATH**/ ?>
|