//ROUTES
routes=[{
        path: '/divida_notificar/',
        async: function (routeTo, routeFrom, resolve, reject) {
			//NOT WORKING
            //$$('.infinite-scroll-preloader').remove();
            var doc = [];
            var storage = window.localStorage;
            var login = storage.getItem("login");
            var token = storage.getItem("token");
            var router = this;
            var app = router.app;
            app.preloader.show();
            app.request({
                url: URL_CALL",
                method: 'GET',
                dataType: 'json',

                headers: {

                },
                success: function (data, status, xhr) {
                    console.log(data.length);
					if (self.lastItem < 20) {
                    	$(self.$el).find('.infinite-scroll-preloader').remove();
                    }
                    $.each(data, function (idx, item) {
                        doc[idx] = {
                            "cod": item.cod,
                            "nome": item.nome,
                            "documento": item.documento,
                            "vencimento": moment(item.vencimento).format("DD/MM/YYYY"),
                            "valor_numerico": mvalor(item.valor_numerico)
                        };
                    });
                    app.preloader.hide();
                    resolve({
                        componentUrl: './pages/divida_notificar.html',
                    }, {context: {
                            documento: doc
                        }
                    });
                },
                error: function (xhr, status) {
                    app.preloader.hide();
                    app.dialog.alert("Não foi possível conectar-se ao servidor! Por favor tente novamente mais tarde!", "Ops...", null);
                    console.log(status);
                },
                statusCode: {
                    404: function (xhr) {
                        app.preloader.hide();
                        app.dialog.alert("Não foi posível conectar-se ao servidor!", "Ops...", null);
                    }
                }
            });
        }
    },
    {
        path: '/divida_detalhe/:cod/',
        async: function (routeTo, routeFrom, resolve, reject) {
            var not = [];
            var router = this;
            var app = router.app;
			var cod = routeTo.params.cod;
            app.preloader.show();
            setTimeout(function () {
                app.preloader.hide();
                resolve({
                    componentUrl: './pages/divida_detalhe.html',
                }, {context: {
                        cod: cod
                    }
                });
            }, 2000);
        },
    },
}
//TEMPLATE LIST VIEW
<template>
    <div class="page" data-name="divida_notificar">
        <div class="navbar">
            <div class="navbar-inner sliding">
                <div class="left">
                    <a href="#" class="link back">
                        <i class="icon icon-back"></i>
                        <span class="ios-only">Voltar</span>
                    </a>
                </div>
                <div class="title">Dívidas</div>
                <div class="right">
                    <a href="#" class="link icon-only panel-open" data-panel="left">
                        <i class="icon f7-icons ios-only">menu</i>
                        <i class="icon material-icons md-only">menu</i>
                    </a>
                </div>
            </div>
        </div>
        <div class="block-title">Documentos em aberto que serão notificados caso não sejam pagos ou baixados em até 5 dias.</div>
        <div data-infinite-distance="50" class="page-content infinite-scroll-content" @infinite="loadMore">
            <div class="block block-strong-inset">
                <div class="list media-list">
                    <ul class="lista_doc">
                        {{#each documento}}
                        <li class="action_status" cod='{{cod}}'>
                            <a href="/divida_detalhe/{{cod}}/" class="item-link item-content">
                                <div class="item-inner">
                                    <div class="item-title-row">
                                        <div class="item-title">Cód: {{cod}}</div>
                                        <div class="item-after">R$ {{valor_numerico}}</div>
                                    </div>
                                    <div class="item-subtitle">Nome: {{nome}}</div>
                                    <div class="item-text">Nº: {{cod}}</div>
                                    <div class="item-text">Vencimento: {{vencimento}}</div>
                                </div>
                            </a>
                        </li>
                        {{/each}}
                    </ul>
                </div>
            </div>
            {{#if showPreloaderOnLoad}}
            <div class="preloader infinite-scroll-preloader"></div>
            {{/if}}
        </div>
    </div>
</template>
<script>
return {
	data: function () {
		return {
            allowInfinite: true,
                    lastItem: 20,
            }
        },
		methods: {
		loadMore: function () {
			var self = this;
			var $ = self.$$;
			if (!self.allowInfinite)
				return;
			self.allowInfinite = false;
			var storage = window.localStorage;
			myapp.request({
				url: URL_CALL + "?limit=20&offset=" + self.lastItem,
				method: 'GET',
				dataType: 'json',
				headers: {

			},
			success: function (data) {
				var html = '';
				for (var i = 0; i < data.length; i++) {
					html += '<li class="action_status" cod=' + data[i].cod + '>';
					html += '<a href="/divida_detalhe/'+ data[i].cod +'/" class="item-link item-content">';
					html += '<div class="item-inner">';
					html += '<div class="item-title-row">';
					html += '<div class="item-title">CÓDIGO: ' + data[i].cod + '</div>';
					html += '<div class="item-after">R$ ' + mvalor(data[i].valor_numerico) + '</div>';
					html += '</div>';
					html += '<div class="item-subtitle">NOME: ' + data[i].nome + '</div>';
					html += '<div class="item-text">DOCUMENTO: ' + data[i].documento + '</div>';
					html += '<div class="item-text">VENCIMENTO: ' + moment(data[i].vencimento).format("DD/MM/YYYY") + '</div>';
					html += '</div>';
					html += '</a>';
					html += '</li>';
			}
			$(self.$el).find('.lista_doc').append(html);
				$(self.$el).find('.preloader').remove();
			},
			error: function (xhr, status) {
				myapp.dialog.alert("Ocorreu um erro inesperado! Por favor tente novamente mais tarde!", "Ops...", null);
			},
			statusCode: {
			404: function (xhr) {
				myapp.dialog.alert("Não foi posível conectar-se ao servidor!", "Ops...", null);
			}
		}
		});
		self.lastItem += 20;
		self.allowInfinite = true;
		}
	}
}
</script>

//TEMPLATE DETAIL
<template>
  <div class="page">
    <div class="navbar">
      <div class="navbar-inner sliding">
        <div class="left">
          <a href="#" class="back link">
            <i class="icon icon-back"></i>
            <span class="ios-only">Back</span>
          </a>
        </div>
        <div class="title">Detalhes {{cod}}</div>
      </div>
    </div>
    <div class="page-content">
      <div class="block block-strong">

      </div>

    </div>
  </div>
</template>
<script>
  return {}
</script>