adding additional functionality to the regional-sales and team-efficiency datepickers

This commit is contained in:
PreslavKozovski 2018-03-13 19:19:02 +02:00
Родитель 5e19d7476f
Коммит e1ac13fc13
3 изменённых файлов: 160 добавлений и 40 удалений

Просмотреть файл

@ -42,14 +42,18 @@ function onRegionalSales() {
$('.row-offcanvas').toggleClass('active');
});
$('#end-date').kendoDatePicker({
value: new Date(1998, 7, 1),
change: onCriteriaChange
})
$('#start-date').kendoDatePicker({
value: new Date(1996, 0, 1),
change: onCriteriaChange
min: new Date(1996, 0, 1),
max: new Date(1998, 5, 30),
change: startChange
})
$('#end-date').kendoDatePicker({
value: new Date(1998, 7, 9),
min: new Date(1996, 0, 1),
max: new Date(1998, 7, 9),
change: endChange
})
$("#map").kendoMap({
@ -403,6 +407,48 @@ function onRegionalSales() {
setSparkLinesWidths();
}
function startChange(e) {
var StartDate = $("#start-date").data("kendoDatePicker");
var EndDate = $("#end-date").data("kendoDatePicker");
var startDate = StartDate.value();
var endDate = EndDate.value();
if (startDate) {
startDate = new Date(startDate);
startDate.setDate(startDate.getDate());
EndDate.min(startDate);
} else if (endDate) {
StartDate.max(new Date(endDate));
} else {
endDate = new Date();
StartDate.max(endDate);
EndDate.min(endDate);
}
onCriteriaChange();
}
function endChange(e) {
var StartDate = $("#start-date").data("kendoDatePicker");
var EndDate = $("#end-date").data("kendoDatePicker");
var startDate = StartDate.value();
var endDate = EndDate.value();
if (endDate) {
endDate = new Date(endDate);
endDate.setDate(endDate.getDate());
StartDate.max(endDate);
} else if (startDate) {
EndDate.min(new Date(startDate));
} else {
endDate = new Date();
StartDate.max(endDate);
EndDate.min(endDate);
}
onCriteriaChange();
}
function listCustomers(country) {
$("#countryName").text(country);
var companyNames = "";

Просмотреть файл

@ -2,14 +2,14 @@
<h2 id="team-efficiency" class="col-xs-3">Team efficiency</h2>
<div id="dateFilter" class="col-xs-9">
<div class="period-wrapper">
<label for="StartDate" class="select-period">Stats from</label>
<input id="StartDate" />
<span class="k-invalid-msg" data-for="StartDate"></span>
<label for="StartDateTeamEff" class="select-period">Stats from</label>
<input id="StartDateTeamEff" />
<span class="k-invalid-msg" data-for="StartDateTeamEff"></span>
</div>
<div class="period-wrapper">
<label for="EndDate" class="select-period">To</label>
<input id="EndDate" />
<span class="k-invalid-msg" data-for="EndDate"></span>
<label for="EndDateTeamEff" class="select-period">To</label>
<input id="EndDateTeamEff" />
<span class="k-invalid-msg" data-for="EndDateTeamEff"></span>
</div>
</div>
<div style="clear:both;"></div>
@ -43,8 +43,11 @@
</div>
</div>
</div>
<div id="employeeStats" class="col-xs-12">
<div id="employeeStats" class="col-xs-12" style="height:200px">
<div id="team-sales" style="height:200px"></div>
<div id="team-sales-no-data" class="overlay" style="height:200px; position:relative">
<div>No data available</div>
</div>
</div>
<div id="employeeSchedule" class="col-xs-12">
<h3>Representative orders - schedule</h3>

Просмотреть файл

@ -26,14 +26,18 @@ function onTeamEfficiency() {
});
function initWidgets() {
$("#StartDate").kendoDatePicker({
value: new Date(1996, 0, 1),
change: onCriteriaChange
$("#StartDateTeamEff").kendoDatePicker({
value: new Date(1997, 0, 1),
min: new Date(1996, 0, 1),
max: new Date(1997, 5, 30),
change: startChange
})
$("#EndDate").kendoDatePicker({
value: new Date(1998, 7, 1),
change: onCriteriaChange
$("#EndDateTeamEff").kendoDatePicker({
value: new Date(1997, 5, 30),
min: new Date(1997, 0, 1),
max: new Date(1998, 5, 30),
change: endChange
})
$("#employees-list").kendoListView({
@ -104,18 +108,14 @@ function onTeamEfficiency() {
autoBind: false,
dataBound: onAverageSalesDataBound,
dataSource: {
transport: {
read: function (options) {
var result = $.grep(employeeAverageSales, function (e) {
return e.EmployeeID == options.data.EmployeeID;
});
options.success(result);
data: employeeAverageSales,
schema:{
model:{
fields:{
Date: {type: "date"}
}
}
},
aggregate: [{
field: "EmployeeSales",
aggregate: "average"
}]
}
},
series: [{
type: "line",
@ -166,19 +166,30 @@ function onTeamEfficiency() {
dataSource: {
transport: {
read: function (options) {
var result;
var startDate = options.data.startDate;
var endDate = options.data.endDate;
var StartDateTeamEff = options.data.StartDateTeamEff;
var EndDateTeamEff = options.data.EndDateTeamEff;
var employee = $.grep(employeeAndTeamSales, function (e) {
return e.EmployeeID == options.data.EmployeeID;
})[0];
options.success(employee.Sales);
options.success($.grep(employee.Sales, function(e){
var date = kendo.parseDate(e.Date);
if((date>StartDateTeamEff)&&(date<EndDateTeamEff)){
return true;
}else{
return false;
}
}));
}
}
},
legend: {
position: "bottom"
},
dataBound: function(e){
var dataLength = e.sender.dataSource.view().length
$("#team-sales-no-data").toggle(dataLength === 0);
e.sender.element.toggle(!(dataLength === 0));
},
series: [{
field: "EmployeeSales",
categoryField: "Date",
@ -318,12 +329,12 @@ function onTeamEfficiency() {
employeeAverageSales = $("#employee-average-sales").data("kendoChart"),
teamSales = $("#team-sales").data("kendoChart"),
employeeSales = $("#employee-sales").data("kendoScheduler"),
startDate = $("#start-date").data("kendoDatePicker"),
endDate = $("#end-date").data("kendoDatePicker"),
StartDateTeamEff = $("#StartDateTeamEff").data("kendoDatePicker"),
EndDateTeamEff = $("#EndDateTeamEff").data("kendoDatePicker"),
filter = {
EmployeeID: employee.EmployeeID,
startDate: kendo.format("{0:MM/dd/yyyy hh:mm:ss}", startDate.value()),
endDate: kendo.format("{0:MM/dd/yyyy hh:mm:ss}", endDate.value())
StartDateTeamEff: StartDateTeamEff.value(),
EndDateTeamEff: EndDateTeamEff.value()
},
template = kendo.template($("#employeeBioTemplate").html());
@ -337,7 +348,67 @@ function onTeamEfficiency() {
teamSales.dataSource.read(filter);
employeeQuarterSales.dataSource.read(filter);
employeeAverageSales.dataSource.read(filter);
employeeAverageSales.dataSource.query({
filter: [{
field: "EmployeeID",
operator: "eq",
value: employee.EmployeeID
},{
field: "Date",
operator: "gte",
value: StartDateTeamEff.value()
}, {
field: "Date",
operator: "lte",
value: EndDateTeamEff.value()
}],
aggregate: [{
field: "EmployeeSales",
aggregate: "average"
}]
});
}
function startChange(e) {
var StartDateTeamEff = $("#StartDateTeamEff").data("kendoDatePicker");
var EndDateTeamEff = $("#EndDateTeamEff").data("kendoDatePicker");
var startDate = StartDateTeamEff.value();
var endDate = EndDateTeamEff.value();
if (startDate) {
startDate = new Date(startDate);
startDate.setDate(startDate.getDate());
EndDateTeamEff.min(startDate);
} else if (endDate) {
StartDateTeamEff.max(new Date(endDate));
} else {
endDate = new Date();
StartDateTeamEff.max(endDate);
EndDateTeamEff.min(endDate);
}
onCriteriaChange();
}
function endChange(e) {
var StartDateTeamEff = $("#StartDateTeamEff").data("kendoDatePicker");
var EndDateTeamEff = $("#EndDateTeamEff").data("kendoDatePicker");
var startDate = StartDateTeamEff.value();
var endDate = EndDateTeamEff.value();
if (endDate) {
endDate = new Date(endDate);
endDate.setDate(endDate.getDate());
StartDateTeamEff.max(endDate);
} else if (startDate) {
EndDateTeamEff.min(new Date(startDate));
} else {
endDate = new Date();
StartDateTeamEff.max(endDate);
EndDateTeamEff.min(endDate);
}
onCriteriaChange();
}
function onQuarterSalesDataBound(e) {
@ -346,7 +417,7 @@ function onTeamEfficiency() {
}
function onAverageSalesDataBound(e) {
var data = this.dataSource.aggregates()
var data = this.dataSource.aggregates();
if (data.EmployeeSales) {
$("#employee-average-sales-label").text(kendo.toString(data.EmployeeSales.average, "c2"));
} else {