UNPKG

zettapi_client

Version:

Admin panel and client-side CRUD operations in angular to use with zettapi_server rest api to get started quickly in any CMS project.

157 lines (142 loc) 6.83 kB
<uib-tabset active="activeTab"> <!-- LOAD/NEW --> <uib-tab index="0"> <uib-tab-heading> <i class="fa fa-list"></i> As minhas listagens </uib-tab-heading> <div class="container-fluid"> <!--LIST WITH DATA--> <ul class="api-list-item api-md list-unstyled"> <li ng-repeat="savedItem in savedItems"> <a ng-click="loadReport(savedItem, 4)" class="listlink">{{savedItem.name}}</a> <a ng-click="removeReport(savedItem)" class="btn btn-danger btn-xs pull-right"><i class="fa fa-trash" aria-hidden="true"></i> apagar</a> <a ng-click="loadReport(savedItem, 1)" class="btn btn-primary btn-xs api-edit pull-right"><i class="fa fa-pencil" aria-hidden="true"></i> editar</a> </li> </ul> <!--LIST WITHOUT DATA--> <h6 ng-if="savedItems.length === 0" class="text-info"><i class="fa fa-exclamation-circle" aria-hidden="true"></i> Ainda não guardou nenhuma listagem parametrizada</h6> <!--NEW LIST ITEM--> <button type="button" ng-click="reset()" class="btn btn-primary btn-md pull-right" style="margin-top:20px;">Criar nova listagem <i class="fa fa-plus"></i></button> </div> </uib-tab> <!-- INCLUDE --> <uib-tab index="1"> <uib-tab-heading> <i class="fa fa-plus"></i> Dados a incluir na minha listagem </uib-tab-heading> <div class="container-fluid"> <uib-accordion close-others="false"> <div uib-accordion-group class="panel-default" is-open="tab.isOpen" ng-repeat="tab in fieldTabs"> <uib-accordion-heading> {{tab.name}} <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': tab.isOpen, 'glyphicon-chevron-right': !tab.isOpen}"></i> </uib-accordion-heading> <div class="col-md-3 col-sm-4 col-xs-6" ng-repeat="field in fields | filter: {tab: tab.name}"> <input type="checkbox" checklist-model="item.select" checklist-value="field.id" class="w3-check" ng-class="{'input-lg':useInputLarge}"> <label class="w3-validate">{{field.caption}}</label> </div> </div> </uib-accordion> </div> </uib-tab> <!-- FILTER --> <uib-tab index="2"> <uib-tab-heading> <i class="fa fa-filter"></i> Filtrar </uib-tab-heading> <div class="container-fluid"> <a class="pull-right btn btn-md btn-info" ng-click="appendQuery()" style="margin-bottom:15px;">Adicionar Linha <i class="fa fa-plus"></i></a> <table class="table table-bordered"> <thead> <tr> <th>Informação</th> <th>Operador</th> <th>Valor</th> <th></th> </tr> </thead> <tbody> <tr ng-repeat="query in item.query track by $index"> <td><select selector model="query.field" options="fields" label-attr="caption" placeholder="Indique o campo..."></select></td> <td> <zl-query-builder field="query.field" model="query" key="operator" zl-class="form-control" ng-class="{'input-lg':useInputLarge}"></zl-query-builder> </td> <td> <zl-dynamic-field field="query.field" model="query" key="value" zl-class="form-control" ng-class="{'input-lg':useInputLarge}"></zl-dynamic-field> </td> <td class="text-right"> <button type="button" ng-click="removeQuery($index)" class="btn btn-danger" ng-class="{'btn-lg':useInputLarge}"><i class="fa fa-trash"></i></button> </td> </tr> </tbody> </table> </div> </uib-tab> <!-- SORT --> <uib-tab index="3"> <uib-tab-heading> <i class="fa fa-sort-alpha-asc"></i> Ordenar </uib-tab-heading> <div class="container-fluid"> <div class="col-sm-6 form-group"> <label>Campo</label> <select ng-model="item.sort.field" ng-options="field.id as field.caption for field in fields" class="form-control input-lg"></select> </div> <div class="col-sm-6"> <br> <input type="radio" ng-model="item.sort.type" ng-value="1" class="w3-radio" /> <label class="w3-validate">Ascendente</label>&nbsp;&nbsp; <input type="radio" ng-model="item.sort.type" ng-value="-1" class="w3-radio" /> <label class="w3-validate">Descendente</label> </div> </div> </uib-tab> <!-- VIEW --> <uib-tab index="4"> <uib-tab-heading> <i class="fa fa-eye"></i> Visualizar </uib-tab-heading> <div class="container-fluid"> <ul class="list-unstyled list-inline"> <li><a ng-click="getReport(item)" class="btn btn-primary btn-md">Ver no Ecrã <i class="fa fa-desktop" aria-hidden="true"></i></a></li> <li><a href="{{getExcelUrl(item)}}" target="_blank" class="btn btn-primary btn-md">Ver em Excel <i class="fa fa-file-excel-o" aria-hidden="true"></i></a></li> <!--<li><a href="#" target="_blank" class="btn btn-primary btn-md">Ver em PDF <i class="fa fa-file-pdf-o" aria-hidden="true"></i></a></li>--> <li ng-if="!!items">Resultados: {{items.length}}</li> </ul> <div ng-if="!!items" class="row"> <!--SEARCH--> <div class="col-sm-12" style="margin:20px 0;"> <div class="input-group" ng-class="{'input-group-lg':useInputLarge}"> <span class="input-group-addon">{{search.inverted ? 'Excluindo' : 'Incluindo'}} <input type="checkbox" ng-model="search.inverted" /></span> <input type="text" class="form-control" placeholder="Criterio de Pesquisa" ng-model="search.text" /> <span class="input-group-btn"><button class="btn btn-primary" type="button" ng-click="applySearch(search)" ng-disabled="!search.text"><i class="fa fa-search"></i></button></span> </div> </div> <!--TABLE--> <div class="col-sm-12 table-responsive"> <table ng-table-dynamic="tableParams with cols" class="table table-bordered"> <tr ng-repeat="row in $data"> <td ng-repeat="col in $columns">{{row[col.field]}}</td> </tr> </table> </div> </div> </div> </uib-tab> <!-- SAVE --> <uib-tab index="5"> <uib-tab-heading> <i class="fa fa-save"></i> Guardar </uib-tab-heading> <div class="container-fluid"> <div class="col-sm-12 form-group"> <label>Nome</label> <div class="input-group" ng-class="{'input-group-lg':useInputLarge}"> <input type="text" ng-model="item.name" ng-disabled="!!item._id" class="form-control" ng-class="{'input-lg':useInputLarge}"> <div class="input-group-btn"> <button type="button" ng-click="saveReport(item)" class="btn btn-primary">Guardar <i class="fa fa-save"></i></button> </div> </div> </div> </div> </uib-tab> </uib-tabset>