How to filter records by the due date. I have a records search page that when accessed only displays the records due in the current month. My question is how to make a filter and apply in ng-repeat. I have the example below plus the data comes from the DB so the date is in the format yyyy-mm-dd. In the example below when the page is accessed display only the id: 1 and 2 that has expiration in the current month
/* EXEMPLO */
$scope.oportunidades = [
{id: 1, nome: Fulano, vencimento: 2018-08-01},
{id: 2, nome: Beltrano, vencimento: 2018-08-15},
{id: 3, nome: Jose, vencimento: 2018-10-03},
];
In this query page I already have input fields that search by date (working) and the other fields (order type, operator and city) are working as well. All fields are subject to dynamic query
/* BUSCA POR PERIODO */
angular.module("App").filter('betweenDate', function($filter) {
return function(collection, column, startDate, endDate) {
var new_collection = [];
if (angular.isDefined(startDate) && angular.isDefined(endDate)) {
if (startDate != '' && endDate != '') {
if (angular.isDefined(startDate)) {
startDate = Date.parse($filter('date')(startDate, 'yyyy-MM'));
}
if (angular.isDefined(endDate)) {
endDate = Date.parse($filter('date')(endDate, 'yyyy-MM'));
}
if (!isNaN(startDate) && !isNaN(endDate)) {
angular.forEach(collection, function(value, index) {
var obj = value[column];
var currentDate = Date.parse($filter('date')(obj, 'yyyy-MM'));
if ((currentDate >= startDate && endDate >= currentDate)) {
new_collection.push(value);
}
});
} else {
new_collection = collection;
}
} else {
new_collection = collection;
}
collection = new_collection;
}
return collection;
};
});
<div class="form-group col-md-2 input-group-sm mb-3">
<label for="exampleInputPassword1" class="text-sm font-weight-bold">Data Inicio</label>
<input type="text" name="startDate" class="form-control calendario" ng-model="startDate" data-date-format="yyyy-mm" ng-value="primeiroDia">
</div>
<div class="form-group col-md-2 input-group-sm mb-3">
<label for="exampleInputPassword1" class="text-sm font-weight-bold">Data Fim</label>
<input type="text" name="endDate" class="form-control calendario" ng-model="endDate" data-date-format="yyyy-mm" ng-value="ultimoDia">
</div>
<div class="col-sm-4">
<div class="card text-center">
<div class="card-header alert alert-info">
<h5 class="card-title">Prospects</h5>
<p class="card-text text-sm font-weight-bold text-dark" id="prospect"></p>
</div>
<div class="card-body" style="padding: 0px 5px 0px 5px; overflow: auto">
<div class="text-left connectedSortable" style="list-style: none;" id="ulItensContato">
<ul class="mb-0">
<li style="font-size: 13px; padding:10px;" ng-repeat="prospect in listaProspect | orderBy: 'prospectNome' | betweenDate:'prospeccaoPrevisao':startDate:endDate | filter:item | filter:vm.selectCidade track by $index">
<div class="timeline-panel">
<div class="timeline-heading text-center">
<a href="" class="text-danger font-weight-bold">{{prospect.prospectNome}}</a><br><br>
<button type="button" class="btn btn-outline-secondary border-0 btn-sm font-weight-bold">
{{prospect.prospectOperadora}}
</button> |
<button type="button" class="btn btn-outline-secondary border-0 btn-sm font-weight-bold">
<i class="fa fa-phone"></i> {{prospect.prospeccaoLinhas}}
</button> |
<button type="button" class="btn btn-outline-secondary border-0 btn-sm font-weight-bold" data-toggle="tooltip" data-placement="bottom" title="Vencimento Contrato">
<i class="fa fa-calendar"></i> {{prospect.prospeccaoVcto | date:'dd/MM/yyyy'}}
</button>
</div>
</div>
</li>
</ul>
</div>
<!-- timeline -->
</div>
</div>
</div>