Untitled
unknown
plain_text
2 years ago
31 kB
5
Indexable
<div id="page-content">
<span id="popupNotification"></span>
<div id="addform" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true"></div>
<style>
#page-content { min-height: auto;}
.k-grid-content {max-height: 368px; min-height: 360px;}
.k-grid-content .k-state-selected{background-color:transparent;color:#000;}
.k-grid-content .k-alt.k-state-selected{background-color: #f1f1f1;}
.k-checkbox-label {display: inline;}
.inbound {
background-color: #eaedf1;
border-color: #eaedf1;
color: #5e534d;
border-top: 2px solid;
border-right: 2px solid;
border-radius: 0px;
border-left: 2px solid;
}
.outbound {
background-color: #eaedf1;
border-color: #eaedf1;
color: #5e534d;
border-top: 2px solid;
border-right: 2px solid;
border-radius: 0px;
border-left: 2px solid;
}
</style>
<div class="widget" style="margin:0px;" >
<div class="widget-extra themed-background-dark-default i-click">
<h5 class="widget-content-light"><strong><?= @lang('menu')['browse'] ?></strong></h5>
</div>
</div>
<script type="text/javascript">
function changeExt(e) {
$.post('<?= base_url() ?>customers/search/changeExt', $('#frmChangeExt').serialize()).done(function (data) {
if (data == 1) {
$.bootstrapGrowl('<h4>Success..!</h4>', {
type: "success",
offset: {from: 'bottom', amount: 20},
align: "left",
delay: 2500,
allow_dismiss: true
});
$("#grid").data("kendoGrid").dataSource.read();
} else {
$.bootstrapGrowl('<h4>Error..!</h4>', {
type: "danger",
offset: {from: 'bottom', amount: 20},
align: "left",
delay: 2500,
allow_dismiss: true
});
}
});
e.preventDefault();
}
</script>
<script type="text/javascript">
function loadform(x, y, z) {
(function ($) {
$('#player').remove();
if (y == z) {
$(z).html('<i class="fa fa-spinner fa-spin"></i>');
$(y).load(x);
} else {
$(z).html('<i class="fa fa-spinner fa-spin"></i>');
$(y).load(x, function () {
$(z).html('');
});
}
})(jQuery);
}
;
</script>
<script type="text/javascript">
$(document).ready(function (e) {
$(".widget .i-click").click(function (event) {
if (!$(this).parents(".widget").hasClass('active')) {
$(this).parents(".widget").addClass('active');
$(".widget.active .widget-extra-full").slideDown("slow");
$('#page-content').css('min-height', '800px');
} else {
$(this).parents(".widget").removeClass('active');
$(".widget .widget-extra-full").slideUp("slow");
}
});
});
</script>
<?php
$this->load->library("kendoui");
$transport = new \Kendo\Data\DataSourceTransport();
$read = new \Kendo\Data\DataSourceTransportRead();
$read->url('browse/readdb')
->contentType('application/json')
->type('POST');
$transport->read($read)
->parameterMap('function(data){return kendo.stringify(data);}');
$model = new \Kendo\Data\DataSourceSchemaModel();
$schema = new \Kendo\Data\DataSourceSchema();
$schema->data(new \Kendo\JavaScriptFunction(' function(response) { var i = 1; $.each(response.data, function(idx, val) { val.diallistid = (typeof val.diallistid == "undefined" || val.diallistid == null) ? "undefined" : val.diallistid; this.no = i++;val.starttimestampcheck = val.starttime; val.starttime = (typeof val.starttime == "undefined" || val.starttime == null) ? "" : kendo.toString(new Date((val.starttime)*1000),"dd/MM/yyyy HH:mm:ss"); val.customercheck = (typeof val.customername != "undefined" && val.customername != null && typeof val.customercode != "undefined" && val.customercode != null ) ? val.customername : null; }); return response.data; }'))
->total('total');
$startDate = new DateTime();
$startDate->setTime(0, 0, 0);
$endDate = new DateTime();
$endDate->setTime(23, 59, 59);
if (isset($_GET['start']) && isset($_GET['end'])) {
$startTimestamp = strtotime($_GET['start']);
$endTimestamp = strtotime($_GET['end']);
$startDate->setTimestamp($startTimestamp);
$endDate->setTimestamp($endTimestamp);
}
$start = new \Kendo\UI\DateTimePicker('start');
$start->value($startDate)
->parseFormats(array('Y-m-dTH:i:s'))
->attr('style', 'width: 210px')
->change('startChange');
$end = new \Kendo\UI\DateTimePicker('end');
$end->value($endDate)
->parseFormats(array('Y-m-dTH:i:s'))
->attr('style', 'width: 210px')
->change('endChange');
?>
<div class="block-content mvvm">
<div class="container-fluid" style="padding-bottom: 10px">
<div class="row form-horizontal">
<div class="demo-section" style="border-left: 1px solid #ccc; border-right: 1px solid #ccc; padding: 0 0 0 15px;">
<a href="browse"><?= lang('reset'); ?></a>
<form method="GET">
<label for="start"><?= lang('from'); ?>:</label>
<?= $start->render() ?>
<label for="end" style="margin-left:3em"><?= lang('to'); ?>:</label>
<?= $end->render() ?>
<?php
$btn = new \Kendo\UI\Button('primaryTextButton');
$btn->attr('class', 'k-primary')
->content(lang('menu')['browse'])
->click('$(this).parents("form").submit()');
echo $btn->render();
?>
</form>
</div>
</div>
<div class="row text-center">
<div class="col-md-12" style="border-left: 1px solid #ccc; border-right: 1px solid #ccc;">
<div class="col-md-6 input-group" style="display:block;margin-top:10px;">
<input type="text" class="form-control" id='FieldFilter' placeholder="<?=lang('searchForPhone');?>">
</div>
<div class="col-md-6" style="display:block;margin-top:10px;font-size:14px">
<p>Inbound: <span id="count_inbound"></span>
<span>Outbound: <span id="count_outbound"></span></span>
<span>ANSWERED: <span id="count_answered"></span></span>
<span>Total: <span id="total"></span></p>
</div>
</div>
<div class="import-loading text-center" data-bind="visible: loading"><i class="fa fa-asterisk fa-spin fa-2x text-info"></i></div>
</div>
<div class="row" data-bind="visible: enableImport">
<button type="button" onclick="FieldFilterInOut(1)" class="btn btn-primary inbound">InBound</button>
<button type="button" onclick="FieldFilterInOut(2)" class="btn btn-warning outbound">OutBound</button>
<div data-role="grid" id="cdrGrid"
<?php if($this->session->userdata('isadmin')==1){ ?>
data-toolbar="[{ name: 'excel', text: 'Xuất Excel'}]"
<?php } ?>
data-scrollable="true"
data-pageable="{refresh: true}"
data-filterable="{extra: false,messages: {
info: 'Lọc theo điều kiện (không dấu)',
and: 'Và',
or: 'Hoặc',
filter: 'Lọc',
clear: 'Bỏ lọc'
}
}"
data-sortable="true"
data-excel="{allPages: true}"
data-auto-bind="false"
data-columns="[
{field:'direction', title: 'Hướng gọi', template: templateDirection, width: 120, filterable: {
ui: directionFilter,
operators: {
string: {
eq: 'Bằng',
}
}
}
},
{field:'starttime', title: 'Thời gian gọi', width: 140, filterable: false},
{field:'userextension', title: 'Extension', width: 120, filterable: {
ui: userextensionFilter,
operators: {
string: {
eq: 'Bằng'
}
}
}
},
{field: 'customername', title: 'Tên KH',width: 150, template: tplCustomerName, filterable: false},
{field: 'sobigoi', title: 'Số bị gọi', width: 150, template: tplCustomerNumber,filterable: false
},
{field: 'sogoi', title: 'Số gọi', width: 120, template: DtsNumber,filterable: false
},
{field:'disposition', title: 'Trạng thái', width: 100, template: tplDisposition, filterable: {
ui: dispositionFilter,
operators: {
string: {
eq: 'Bằng',
}
}
}
},
{field: 'totalduration' , title: 'TG gọi', template: tplTotalDuration, width: 80, filterable: false},
{field: 'billduration' , title: 'Billsec', template: tplBillDuration, width: 80, filterable: false},
{title: 'Ghi âm', template: templateRecord, width: 100},
{title: 'Ghi chú', field: 'callnote', width:500},
{field: 'customer.sanpham', title: 'Sản phẩm',width: 150},
{field: 'customer.kenhbansanpham', title: 'Kênh bán sản phẩm',width: 150}
]"
data-bind="source: dataCdr"></div>
</div>
</div>
</div>
<!-- END Interactive Content -->
<!-- END Interactive Block -->
<!-- End Huy Ngo 16/11/2018 11:16 PM-->
<script type="text/javascript">
$(document).ready(function () {
$("#FieldFilter").keyup(function () {
var value = $("#FieldFilter").val();
grid = $("#cdrGrid").data("kendoGrid");
if (value) {
grid.dataSource.filter(
{
logic:"or",
filters: [
{field:"customernumber",operator:"eq",value:value},
{field:"customername",operator:"eq",value:value}
]
}
);
} else {
grid.dataSource.filter({});
}
});
});
//thang 20190108
function FieldFilterInOut(i){
if(i==1){
grid = $("#cdrGrid").data("kendoGrid");
grid.dataSource.filter(
{
logic:"or",
filters: [
{field:"direction",operator:"eq",value: "inbound" },
]
}
);
$(".btn-primary").css("background-color", "#6ad2eb");
$(".outbound").css("background-color", "#eaedf1");
}else{
grid = $("#cdrGrid").data("kendoGrid");
grid.dataSource.filter(
{
logic:"or",
filters: [
{field:"direction",operator:"eq",value: "outbound" },
]
}
);
$(".inbound").css("background-color", "#eaedf1");
$(".outbound").css("background-color", "#f39c12");
}
}
//end thang 20190108
function gridArray(data = []) {
var bs_color = ["success","warning","info","danger","primary","default"],
template = [];
if(data && data.length) {
template = $.map($.makeArray(data), function(value, index) {
return "<span class=\"label label-"+bs_color[index%6]+"\">"+value+"</span>";
});;
}
return template.join(' ');
}
function startChange() {
var startDate = start.value();
if (startDate) {
startDate = new Date(startDate);
startDate.setDate(startDate.getDate()); //+1
startDate.setHours(23, 59, 59);
end.min(startDate);
}
}
function endChange() {
var endDate = end.value();
if (endDate) {
endDate = new Date(endDate);
endDate.setDate(endDate.getDate()); //-1
endDate.setHours(0, 0, 0);
start.max(endDate);
}
}
function loadform(x,y,z){
(function($) {
$('#player').remove();
if(y==z){
$(z).html('<i class="fa fa-spinner fa-spin"></i>');
$(y).load(x);
}else{
$(z).html('<i class="fa fa-spinner fa-spin"></i>');
$(y).load(x,function() {
$(z).html('');
});
}
})(jQuery);
};
window.onload = function() {
var toDate = $("#end").val();
// var toDate = new Date();
// var fromDate = new Date();
var fromDate = $("#start").val();
// fromDate.setMonth(toDate.getMonth() - 1);
var observable = kendo.observable({
trueVar: true,
loading: false,
enableImport: false,
item: {
TuNgay: fromDate,
DenNgay: toDate,
},
dataCdr: new kendo.data.DataSource({
serverFiltering: true,
serverPaging: true,
serverSorting: true,
pageSize: 5,
sort: {field: "starttime", dir: "desc"},
transport: {
read: {
type: "POST",
url: base_url + "cdr/browse/readdb",
data: function() {
var item = observable.item.toJSON();
for(let prop in item) {
if(prop == 'TuNgay' || prop == 'DenNgay') {
// item[prop] = item[prop].toISOString();
}
}
return item;
}
},
parameterMap: function(options, operation) {
return JSON.stringify(options);
}
},
schema: {
data: function(response) {
$("#count_inbound").text(response.count_inbound);
$("#count_outbound").text(response.count_outbound);
$("#count_answered").text(response.count_answered);
$("#total").text(response.total);
// debugger;
return response.data;
},
total: "total"
}
}),
search: function() {
var that = this;
this.set("loading", true);
this.dataCdr.read().then(function() {
that.set("loading", false);
that.set("enableImport", true);
})
}
})
kendo.bind($(".mvvm"), observable);
observable.search();
};
$(document).ready(function () {
start = $("#start").data("kendoDateTimePicker");
end = $("#end").data("kendoDateTimePicker");
// month = $("#month").data("kendoDatePicker");
// start.min(start.value());
start.max(end.value());
end.min(start.value());
});
<!-- Start Huy Ngo 16/11/2018 11:16 PM-->
function tplDisposition(data) {
var result = (data.disposition || "").toString();
var css = "warning";
if(result == "ANSWERED") css = "success";
return `<label class="label label-${css}">${result}</label>`;
}
function tplBillDuration(data) {
var bill = (data.billduration || "").toString();
return bill ? bill + " s" : "0";
}
function tplTotalDuration(data) {
var bill = (data.totalduration || "").toString();
return bill ? bill + " s" : "0";
}
function tplCustomerName(data) {
if(typeof data.customercode=='undefined'){
var aTag = `<a target="_blank" href="${base_url}customers/customerdetail"><b>Chưa có thông tin</b></a>`;
}else{
var aTag = `<a target="_blank" href="${base_url}customers/customerdetail?id=${data.customercode.$id}"><b>${data.customername ? data.customername : 'Chưa có thông tin'}</b></a>`;
}
return aTag;
}
function tplCustomerNumber(data) {
if(typeof data.sobigoi!='undefined' && data.sobigoi!="500"){
return `<span class="label label-info">${(data.sobigoi).toString()}</span>`;
}
}
function DtsNumber(data) {
var diallistid="";
if(data.diallistid=="undefined"){
diallistid="undefined";
}else{
diallistid="'"+data.diallistid+"'";
}
var calluuid="'"+data.calluuid+"'";
if(typeof data.sobigoi!='undefined'){
var phone="'"+data.customernumber+"'";
}
// console.log(phone);return;
var dateString = data.starttime;
var split1=dateString.split(" ");
var dateParts = split1[0].split("/");
var result= dateParts[1]+"/"+dateParts[0]+"/"+dateParts[2]+" "+split1[1];
var starttimestamp = new Date(result).getTime()/1000;
var time=starttimestamp;
var direction="'"+data.direction.toString()+"'";
if(typeof data.sogoi!='undefined' && typeof data.sobigoi!='null'){
return `<span class="label label-info">${(data.sogoi).toString()}</span>
<button class="btn btn-sm btn-primary" style="margin-left:15px" data-toggle="tooltip" data-original-title="<?=lang('popupDisplay')?>" onclick="showPopup(this, ${calluuid}, ${phone}, ${direction},${(time).toString()}, ${(diallistid)})"><i class='fa fa-address-card'></i></button>`;
}else{
return `<span class="label label-info"></span>
`;
}
}
function tplOrders(data) {
return data.orders ? data.orders.length : 0;
}
function directionFilter(element) {
element.kendoDropDownList({
dataSource: {
data: [
{direction:"inbound", text: "inbound"},
{direction:"outbound", text: "outbound"},
<!-- {direction:"internal", text: "Gọi nội bộ"}-->
]
},
dataTextField: "text",
dataValueField: "direction",
optionLabel: "-- Chọn --"
});
}
function dispositionFilter(element) {
element.kendoDropDownList({
dataSource: {
transport: {
read: {
url: "browse/readfilter?details=disposition",
type: "POST"
}
},
schema: {
data: "data"
}
},
dataTextField: "disposition",
dataValueField: "disposition",
optionLabel: "-- Chọn --"
});
}
function userextensionFilter(element) {
element.kendoDropDownList({
dataSource: {
transport: {
read: {
url: "browse/readfilter?details=userextension",
type: "POST"
}
},
schema: {
data: "data"
}
},
dataTextField: "userextension",
dataValueField: "userextension",
optionLabel: "-- Chọn --"
});
}
function templateDirection(data) {
return (data.direction == "outbound") ? `<span class="label label-success">${data.direction}</span>` : `<span class="label label-danger">${data.direction}</span>`;
}
function templateRecord(data) {
if(typeof data.disposition != "undefined" && data.disposition != null && data.disposition=="ANSWERED" && typeof data.billduration != "undefined" && data.billduration > 1 && typeof data.endtime != "undefined"){
<?php if ($this->session->userdata('issupervisor') != 1 && $this->session->userdata('isadmin') != 1) { ?>
return `<a href="javascript:void(0)" class="btn btn-default btn-play" onclick="play('${base_url}playback/record/play?calluuid=${data.calluuid}')"><i class="fa fa-play"></i></a>`;
<?php }else{ ?>
return `<a href="javascript:void(0)" class="btn btn-default btn-play" onclick="play('${base_url}playback/record/play?calluuid=${data.calluuid}')"><i class="fa fa-play"></i></a>
<a href="javascript:void(0)" onclick="window.location.href='${base_url}playback/record/download?calluuid=${data.calluuid}'" class="btn btn-default" data-toggle="tooltip" title="" data-original-title="Download"><i class="fa fa-cloud-download"></i></a>`;
<?php } ?>
} else {
return "";
}
}
<!-- End Huy Ngo 16/11/2018 11:16 PM-->
function minimize() {
$("#player .gallery-widget, #player .widget-header").hide();
$("#player").addClass("collapse");
$("#player").removeClass("col-xs-12 col-sm-4 col-lg-4");
$(".widget-main").after('<div class="jp-close" data-dismiss="alert" aria-label="close"><i class="fa fa-times-circle"></i></div>');
$(".widget-main").before('<div class="jp-maximize" onclick="maximize()"><i class="fa fa-plus-circle"></i></div>');
$('.jp-play,.jp-pause').tooltip("enable");
}
function maximize() {
$("#player .gallery-widget, #player .widget-header").show();
$("#player").removeClass("collapse");
$("#player").addClass("col-xs-12 col-sm-4 col-lg-4");
$("#player .jp-close, #player .jp-maximize").remove();
$('.jp-play,.jp-pause').tooltip("disable");
}
function close() {
$('#player').modal({'show': false});
}
function play(url) {
if ($("div#player").length == 0) {
$("body").append(`
<div id="player" class="alert fade in widget col-xs-12 col-sm-4 col-lg-4 no-padding" style="z-index: 999999; position: absolute; top: 100px; left: 40%">
<div id="jp_container" class="widget-advanced">
<div class="widget-header text-center themed-background-dark">
<div class="widget-options">
<div class="btn-group btn-group-xs">
<button class="btn btn-xs btn-default" data-toggle="tooltip" title="Minimize" onclick="minimize()"><i class="fa fa-minus-circle"></i></button>
<button class="btn btn-xs btn-default" data-toggle="tooltip" title="Close" onclick="$('#player').alert('close')" aria-label="close"><i class="fa fa-times-circle text-danger"></i></button>
</div>
</div>
<span class="play-state pull-left widget-content-light"></span>
<span class="jp-duration pull-right widget-content-light"></span>
<div class="jp-progress">
<div class="progress progress-striped jp-seek-bar">
<div class="progress-bar progress-bar-info jp-play-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 0%; color: #07313A">00:00</div>
</div>
</div>
</div>
<div id="jquery_jplayer"></div>
<div class="widget-main">
<a href="#" class="widget-image-container jp-play" data-original-title="Phát">
<span class="widget-icon themed-background"><i class="gi gi-play"></i></span>
</a>
<a href="#" class="widget-image-container jp-pause" data-original-title="Tạm Dừng">
<span class="widget-icon themed-background"><i class="gi gi-pause"></i></span>
</a>
<div class="gallery gallery-widget" data-toggle="lightbox-gallery">
<ul class="fa-ul pull-left">
</div>
</div>
</div>
</div>`);
}
$("#player").css("display", "block");
$("#player").addClass("animation-fadeIn");
// Local copy of jQuery selectors, for performance.
var my_jPlayer = $("#jquery_jplayer"),
my_trackName = $("#jp_container .track-name"),
my_playState = $("#jp_container .play-state"),
my_extraPlayInfo = $("#jp_container .extra-play-info"),
my_processbarPlayInfo = $("#jp_container .progress-bar-info");
// Some options
var opt_play_first = false, // If true, will attempt to auto-play the default track on page loads. No effect on mobile devices, like iOS.
opt_auto_play = true, // If true, when a track is selected, it will auto-play.
opt_text_playing = "Đang Phát", // Text when playing
opt_text_paused = "Tạm Dừng"; // Text when not playing
// A flag to capture the first track
var first_track = true;
// Initialize the play state text
my_playState.text(opt_text_paused);
// Instance jPlayer
my_jPlayer.jPlayer({
ready: function (event) {
// Setup the player with media.
$(this).jPlayer("setMedia", {
mp3: url,
});
$("#jp_container .jp-play").click();
},
timeupdate: function(event) {
my_processbarPlayInfo.css("width", (event.jPlayer.status.currentTime / event.jPlayer.status.duration * 100) + "%");
my_processbarPlayInfo.html($.jPlayer.convertTime(event.jPlayer.status.currentTime));
},
play: function(event) {
my_playState.text(opt_text_playing);
},
pause: function(event) {
my_playState.text(opt_text_paused);
},
ended: function(event) {
my_playState.text(opt_text_paused);
},
autoPlay: true,
cssSelectorAncestor: "#jp_container",
supplied: "mp3",
wmode: "window"
});
// Create click handlers for the different tracks
$("#jp_container .track").click(function(e) {
my_trackName.text($(this).text());
my_jPlayer.jPlayer("setMedia", {
mp3: $(this).attr("href")
});
if((opt_play_first && first_track) || (opt_auto_play && !first_track)) {
my_jPlayer.jPlayer("play");
}
first_track = false;
$(this).blur();
return false;
});
}
</script>
<style>
#FieldFilter {
border-radius: 5px;
}
.k-grid-excel{
margin-top:10px !important;
}
</style>
</div>
<script>
function showPopup(btn, calluuid, phone, direction, starttime, diallistdetailid) {
console.log(calluuid);
$(btn).attr('disabled', true);
let url = base_url + 'customers/popup/view?calluuid=' + calluuid + '&phone=' + phone + "&direction=" + direction + "&starttime=" + starttime + "&diallistdetailid=" + diallistdetailid;
$('#popup-locate').load(url, function () {
flag_popup = true;
$('#timeupstatus').val("start");
process_waitting = true;
var process = $("#wf-process");
process.data("kendoWindow").close();
$(btn).attr('disabled', false);
});
}
</script>
Editor is loading...