vnDataViewer

This commit is contained in:
Juan Ferrer 2019-10-02 19:24:42 +02:00
parent ac5d9b909b
commit 87add6cd33
27 changed files with 554 additions and 473 deletions

View File

@ -0,0 +1,25 @@
<div ng-if="$ctrl.hasData">
<div ng-transclude></div>
<vn-pagination
model="$ctrl.model">
</vn-pagination>
</div>
<div
class="empty-rows"
ng-if="!$ctrl.hasData"
ng-switch="$ctrl.status">
<vn-spinner
ng-switch-when="loading"
enable="true">
</vn-spinner>
<span
ng-switch-when="clear"
translate>
Enter a new search
</span>
<span
ng-switch-when="empty"
translate>
No results
</span>
</div>

View File

@ -0,0 +1,39 @@
import ngModule from '../../module';
import './style.scss';
export default class DataViewer {
get computedData() {
return this.data || (this.model && this.model.data);
}
get computedLoading() {
return this.isLoading || (this.model && this.model.isRefreshing);
}
get hasData() {
let data = this.computedData;
return data && data.length;
}
get status() {
if (this.hasData)
return null;
if (this.computedLoading)
return 'loading';
if (this.computedData)
return 'empty';
else
return 'clear';
}
}
ngModule.component('vnDataViewer', {
template: require('./index.html'),
transclude: true,
controller: DataViewer,
bindings: {
model: '<?',
data: '<?',
isLoading: '<?'
}
});

View File

@ -0,0 +1,14 @@
@import "variables";
vn-data-viewer {
display: block;
& > .empty-rows {
display: block;
text-align: center;
padding: 1.5em;
box-sizing: border-box;
color: $color-font-secondary;
font-size: 1.4em;
}
}

View File

@ -37,6 +37,7 @@ import './calendar';
import './check';
import './chip';
import './color-legend';
import './data-viewer';
import './input-number';
import './input-time';
import './input-file';

View File

@ -1,11 +1,2 @@
<div class="table">
<vn-empty-rows ng-if="$ctrl.isRefreshing">
<vn-spinner enable="$ctrl.isRefreshing"></vn-spinner>
</vn-empty-rows>
<vn-empty-rows ng-if="$ctrl.model && !$ctrl.isRefreshing && !$ctrl.model.data">
<span translate>Enter a new search</span>
</vn-empty-rows>
<vn-empty-rows ng-if="$ctrl.model && !$ctrl.isRefreshing && $ctrl.model.data.length == 0">
<span translate>No results</span>
</vn-empty-rows>
<div class="table" ng-transclude>
</div>

View File

@ -8,18 +8,6 @@ export default class Table {
this.field = null;
this.order = null;
this.autoLoad = true;
$transclude($scope.$parent, clone => {
angular.element($element[0].querySelector('.table')).append(clone);
});
}
get isRefreshing() {
return (this.model && this.model.isRefreshing);
}
get isPaging() {
return (this.model && this.model.isPaging);
}
setOrder(field, order) {

View File

@ -1,7 +1,7 @@
@import "./effects";
.vn-list {
max-width: 36em;
max-width: $width-sm;
margin: 0 auto;
a.vn-list-item {

View File

@ -6,7 +6,7 @@ $mobile-width: 800px;
// Width
$width-xs: 25em;
$width-sm: 32em;
$width-sm: 34em;
$width-md: 50em;
$width-lg: 80em;
$width-xl: 100em;

View File

@ -5,7 +5,10 @@
form="form"
save="patch">
</vn-watcher>
<form name="form" ng-submit="$ctrl.onSubmit()" compact>
<form
name="form"
ng-submit="$ctrl.onSubmit()"
class="vn-w-md">
<vn-card pad-large>
<vn-horizontal>
<vn-textfield
@ -73,7 +76,14 @@
</vn-horizontal>
</vn-card>
<vn-button-bar>
<vn-submit label="Save" vn-acl="deliveryBoss"></vn-submit>
<vn-button label="Undo changes" ng-if="watcher.dataChanged()" ng-click="watcher.loadOriginalData()"></vn-button>
<vn-submit
label="Save"
vn-acl="deliveryBoss">
</vn-submit>
<vn-button
label="Undo changes"
ng-if="watcher.dataChanged()"
ng-click="watcher.loadOriginalData()">
</vn-button>
</vn-button-bar>
</form>

View File

@ -1,6 +1,10 @@
<div class="main-with-right-menu">
<div class="vn-list vn-w-sm">
<vn-card ng-if="data.length">
<vn-data-viewer
data="data"
is-loading="!data"
class="vn-w-sm">
<vn-card>
<div class="vn-list">
<a
ng-repeat="row in data"
translate-attr="{title: 'Edit'}"
@ -52,14 +56,9 @@
</vn-horizontal>
</vn-horizontal>
</a>
</vn-card>
</div>
<vn-bg-title ng-if="!data">
<vn-spinner enable="true"></vn-spinner>
</vn-bg-title>
<vn-bg-title ng-if="data.length == 0" translate>
No records found
</vn-bg-title>
</vn-card>
</vn-data-viewer>
</div>
<vn-side-menu side="right">
<vn-zone-calendar

View File

@ -1,5 +1,9 @@
<div class="main-with-right-menu">
<vn-card ng-if="data.length" class="vn-w-xs">
<vn-data-viewer
data="data"
is-loading="!data"
class="vn-w-xs">
<vn-card>
<vn-table>
<vn-tbody>
<vn-tr ng-repeat="row in data | orderBy:'day'">
@ -15,12 +19,7 @@
</vn-tbody>
</vn-table>
</vn-card>
<vn-bg-title ng-if="!data">
<vn-spinner enable="true"></vn-spinner>
</vn-bg-title>
<vn-bg-title ng-if="data.length == 0" translate>
No records found
</vn-bg-title>
</vn-data-viewer>
</div>
<vn-side-menu side="right">
<vn-zone-calendar

View File

@ -4,11 +4,10 @@
filter="::$ctrl.filter"
limit="20"
data="zones"
auto-load="false">
auto-load="true">
</vn-crud-model>
<div>
<div class="vn-list">
<vn-card pad-medium-h>
<vn-card class="vn-w-sm pad-medium-h">
<vn-searchbar
panel="vn-zone-search-panel"
model="model"
@ -17,8 +16,12 @@
vn-focus>
</vn-searchbar>
</vn-card>
</div>
<vn-card margin-medium-v margin-huge-bottom compact>
<vn-data-viewer
model="model"
class="vn-w-md"
margin-medium-top
margin-huge-bottom>
<vn-card>
<vn-table model="model">
<vn-thead>
<vn-tr>
@ -60,7 +63,7 @@
</vn-tbody>
</vn-table>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</vn-data-viewer>
</div>
<vn-dialog
vn-id="summary"

View File

@ -1,4 +1,8 @@
<vn-card ng-if="data.length" class="vn-w-xs">
<vn-data-viewer
data="data"
is-loading="!data"
class="vn-w-xs">
<vn-card>
<vn-table>
<vn-tbody>
<vn-tr ng-repeat="row in data | orderBy:'warehouse.name'">
@ -13,13 +17,8 @@
</vn-tr>
</vn-tbody>
</vn-table>
</vn-card>
<vn-bg-title ng-if="!data">
<vn-spinner enable="true"></vn-spinner>
</vn-bg-title>
<vn-bg-title ng-if="data.length == 0" translate>
No records found
</vn-bg-title>
</vn-card>
</vn-data-viewer>
<vn-float-button
icon="add"
translate-attr="{title: 'Add'}"

View File

@ -6,7 +6,9 @@
data="$ctrl.addresses"
auto-load="true">
</vn-crud-model>
<div compact>
<vn-data-viewer
model="model"
class="vn-w-md">
<vn-card pad-medium>
<div
ng-repeat="address in $ctrl.addresses"
@ -61,14 +63,13 @@
</vn-vertical>
</a>
</div>
</vn-card>
<vn-float-button
</vn-card>
</vn-data-viewer>
<vn-float-button
vn-bind="+"
fixed-bottom-right
vn-tooltip="New address"
ui-sref="client.card.address.create"
icon="add"
label="Add">
</vn-float-button>
<vn-pagination model="model"></vn-pagination>
</div>
</vn-float-button>

View File

@ -3,7 +3,8 @@
url="/client/api/receipts/filter"
params="$ctrl.params"
limit="20"
data="$ctrl.balances">
data="$ctrl.balances"
auto-load="true">
</vn-crud-model>
<vn-crud-model
vn-id="riskModel"
@ -11,7 +12,7 @@
filter="$ctrl.filter"
data="$ctrl.clientRisks">
</vn-crud-model>
<div>
<div class="vn-w-lg">
<vn-card class="pad-medium margin-medium-bottom">
<vn-horizontal
style="align-items: center;">
@ -40,11 +41,12 @@
</vn-one>
</vn-horizontal>
</vn-card>
<vn-data-viewer model="model">
<vn-card>
<vn-table model="model">
<vn-thead>
<vn-tr>
<vn-th default-order>Date</vn-th>
<vn-th>Date</vn-th>
<vn-th>Creation date</vn-th>
<vn-th>Employee</vn-th>
<vn-th>Reference</vn-th>
@ -98,7 +100,7 @@
</vn-tbody>
</vn-table>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</vn-data-viewer>
</div>
<vn-float-button
vn-acl="administrative"

View File

@ -1,4 +1,6 @@
<div class="vn-w-md">
<vn-data-viewer
data="$ctrl.classifications"
class="vn-w-md">
<vn-card pad-medium>
<vn-horizontal
ng-repeat="classification in $ctrl.classifications track by classification.id"
@ -46,13 +48,8 @@
</vn-horizontal>
</vn-one>
</vn-horizontal>
<vn-horizontal ng-if="model.data.length == 0">
<vn-one ad-small translate>
No results
</vn-one>
</vn-horizontal>
</vn-card>
</div>
</vn-data-viewer>
<vn-float-button
ng-if="$ctrl.canCreateNew()"
vn-tooltip="New contract"

View File

@ -4,15 +4,19 @@
filter="::$ctrl.filter"
link="{clientFk: $ctrl.$stateParams.id}"
limit="20"
data="credits" auto-load="false">
data="credits"
order="created DESC"
auto-load="true">
</vn-crud-model>
<div class="vn-w-md">
<vn-data-viewer
model="model"
class="vn-w-md">
<vn-card>
<vn-table model="model">
<vn-thead>
<vn-tr>
<vn-th field="created" default-order="DESC">Since</vn-th>
<vn-th>Employee</vn-th>
<vn-th field="created">Since</vn-th>
<vn-th field="workerFk">Employee</vn-th>
<vn-th field="amount" number>Credit</vn-th>
</vn-tr>
</vn-thead>
@ -25,8 +29,7 @@
</vn-tbody>
</vn-table>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</div>
</vn-data-viewer>
<vn-float-button
icon="add"
ui-sref="client.card.credit.create"

View File

@ -4,14 +4,18 @@
link="{clientFk: $ctrl.$stateParams.id}"
filter="::$ctrl.filter"
limit="20"
data="$ctrl.clientDms">
data="$ctrl.clientDms"
order="dmsFk DESC"
auto-load="true">
</vn-crud-model>
<div class="vn-w-lg">
<vn-data-viewer
model="model"
class="vn-w-lg">
<vn-card>
<vn-table model="model">
<vn-thead>
<vn-tr>
<vn-th field="dmsFk" default-order="DESC" shrink>Id</vn-th>
<vn-th field="dmsFk" shrink>Id</vn-th>
<vn-th field="dmsTypeFk" shrink>Type</vn-th>
<vn-th field="hardCopyNumber" shrink number>Order</vn-th>
<vn-th field="reference" shrink>Reference</vn-th>
@ -95,8 +99,7 @@
</vn-tbody>
</vn-table>
</vn-card>
</div>
<vn-pagination model="model"></vn-pagination>
</vn-data-viewer>
<vn-worker-descriptor-popover
vn-id="workerDescriptor">
</vn-worker-descriptor-popover>

View File

@ -11,7 +11,9 @@
path="/client/api/greuges/{{$ctrl.$stateParams.id}}/sumAmount"
options="mgEdit">
</mg-ajax>
<div class="vn-w-md">
<vn-data-viewer
model="model"
class="vn-w-md">
<vn-card
ng-if="model.data.length > 0"
style="text-align: right;"
@ -43,8 +45,7 @@
</vn-table>
</vn-vertical>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</div>
</vn-data-viewer>
<vn-float-button
icon="add"
ui-sref="client.card.greuge.create"

View File

@ -17,6 +17,7 @@
vn-focus>
</vn-searchbar>
</vn-card>
<vn-data-viewer model="model">
<vn-card margin-medium-v>
<a
ng-repeat="client in clients track by client.id"
@ -53,14 +54,8 @@
</vn-horizontal>
</vn-horizontal>
</a>
<vn-empty-rows translate ng-if="model.data.length === 0">
No results
</vn-empty-rows>
<vn-empty-rows translate ng-if="model.data === null">
Enter a new search
</vn-empty-rows>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</vn-data-viewer>
</div>
</div>
<a ui-sref="client.create" vn-tooltip="New client" vn-bind="+" fixed-bottom-right>

View File

@ -5,9 +5,12 @@
link="{clientFk: $ctrl.$stateParams.id}"
limit="20"
data="mandates"
auto-load="false">
order="created DESC"
auto-load="true">
</vn-crud-model>
<div class="vn-w-md">
<vn-data-viewer
model="model"
class="vn-w-md">
<vn-card>
<vn-table model="model">
<vn-thead>
@ -15,7 +18,7 @@
<vn-th field="id" number>Id</vn-th>
<vn-th field="companyFk">Company</vn-th>
<vn-th field="mandateTypeFk">Type</vn-th>
<vn-th field="created" default-order="DESC">Register date</vn-th>
<vn-th field="created">Register date</vn-th>
<vn-th field="finished">End date</vn-th>
</vn-tr>
</vn-thead>
@ -30,5 +33,4 @@
</vn-tbody>
</vn-table>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</vn-vertical>
</vn-data-viewer>

View File

@ -6,7 +6,9 @@
data="notes"
auto-load="true">
</vn-crud-model>
<div class="vn-w-md">
<vn-data-viewer
model="model"
class="vn-w-md">
<vn-card pad-medium>
<div class="note"
ng-repeat="note in notes"
@ -22,12 +24,8 @@
{{::note.text}}
</vn-horizontal>
</div>
<div ng-if="model.data.length == 0" ad-small translate>
No results
</div>
</vn-card>
</div>
</vn-data-viewer>
<a vn-tooltip="New note"
ui-sref="client.card.note.create({id: $ctrl.$stateParams.id})"
vn-bind="+"

View File

@ -4,15 +4,18 @@
link="{clientFk: $ctrl.$stateParams.id}"
limit="20"
data="recoveries"
auto-load="false">
order="started DESC"
auto-load="true">
</vn-crud-model>
<div class="vn-w-md">
<vn-data-viewer
model="model"
class="vn-w-md">
<vn-card>
<vn-table model="model">
<vn-thead>
<vn-tr>
<vn-th></vn-th>
<vn-th field="started" default-order="DESC">Since</vn-th>
<vn-th field="started">Since</vn-th>
<vn-th field="finished">To</vn-th>
<vn-th field="amount" number>Amount</vn-th>
<vn-th field="period" number>Period</vn-th>
@ -38,8 +41,7 @@
</vn-tbody>
</vn-table>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</div>
</vn-data-viewer>
<vn-float-button
icon="add"
fixed-bottom-right

View File

@ -5,14 +5,17 @@
link="{clientFk: $ctrl.$stateParams.id}"
limit="20"
data="samples"
auto-load="false">
order="created DESC"
auto-load="true">
</vn-crud-model>
<div class="vn-w-md">
<vn-data-viewer
model="model"
class="vn-w-md">
<vn-card>
<vn-table model="model">
<vn-thead>
<vn-tr>
<vn-th field="created" default-order="DESC">Sent</vn-th>
<vn-th field="created">Sent</vn-th>
<vn-th>Description</vn-th>
<vn-th field="workerFk">Worker</vn-th>
<vn-th field="companyFk">Company</vn-th>
@ -36,14 +39,16 @@
</vn-tbody>
</vn-table>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</div>
</vn-data-viewer>
<vn-worker-descriptor-popover
vn-id="workerDescriptor"
worker-fk="$ctrl.selectedWorker">
</vn-worker-descriptor-popover>
<a ui-sref="client.card.sample.create" vn-tooltip="Send sample"
vn-bind="+" fixed-bottom-right>
<a
ui-sref="client.card.sample.create"
vn-tooltip="Send sample"
vn-bind="+"
fixed-bottom-right>
<vn-float-button icon="add"></vn-float-button>
</a>

View File

@ -3,23 +3,27 @@
url="/client/api/clients/getTransactions"
link="{clientFk: $ctrl.$stateParams.id}"
limit="20"
data="transactions" auto-load="false">
data="transactions"
order="created DESC"
auto-load="true">
</vn-crud-model>
<div class="vn-w-md">
<vn-data-viewer
model="model"
class="vn-w-md">
<vn-card>
<vn-table model="model">
<vn-thead>
<vn-tr>
<vn-th>State</vn-th>
<vn-th field="id"number>Id</vn-th>
<vn-th shrink>State</vn-th>
<vn-th field="id" number>Id</vn-th>
<vn-th field="created">Date</vn-th>
<vn-th field="amount" number>Amount</vn-th>
<vn-th field="created" default-order="DESC">Payed</vn-th>
<vn-th>Confirm</vn-th>
<vn-th shrink></vn-th>
</vn-tr>
</vn-thead>
<vn-tbody>
<vn-tr ng-repeat="transaction in transactions">
<vn-td style="width: 3em; text-align: center">
<vn-td shrink>
<vn-icon
vn-tooltip="{{$ctrl.getFormattedMessage(transaction)}}"
ng-show="::((transaction.errorMessage || transaction.responseMessage) && !transaction.isConfirmed)"
@ -32,14 +36,14 @@
</vn-icon>
</vn-td>
<vn-td number>{{::transaction.id}}</vn-td>
<vn-td number>{{::transaction.amount | currency: 'EUR':2}}</vn-td>
<vn-td>{{::transaction.created | dateTime:'dd/MM/yyyy HH:mm'}}</vn-td>
<vn-td style="width: 3em; text-align: center">
<vn-td number>{{::transaction.amount | currency: 'EUR':2}}</vn-td>
<vn-td shrink>
<vn-icon-button
icon="done_all"
vn-acl="administrative"
vn-acl-action="remove"
vn-tooltip="Confirm transaction"
translate-attr="{title: 'Confirm transaction'}"
ng-show="::!transaction.isConfirmed"
ng-click="$ctrl.confirm(transaction)">
</vn-icon-button>
@ -48,5 +52,4 @@
</vn-tbody>
</vn-table>
</vn-card>
<vn-pagination model="model"></vn-pagination>
</div>
</vn-data-viewer>

View File

@ -1,6 +1,5 @@
Web Payment: Pago Web
Confirmed: Confirmado
Payed: Pagado
Confirm transaction: Confirmar transacción
Confirm: Confirmar
State: Estado

View File

@ -7,7 +7,9 @@
limit="20"
auto-load="true">
</vn-crud-model>
<div>
<vn-data-viewer
model="model"
class="vn-w-lg">
<vn-card>
<vn-table model="model">
<vn-thead>
@ -95,7 +97,7 @@
</vn-table>
<vn-pagination model="model"></vn-pagination>
</vn-card>
</div>
</vn-data-viewer>
<vn-worker-descriptor-popover
vn-id="workerDescriptor"
worker-fk="$ctrl.selectedWorker">