verdnatura/salix
verdnatura
/
salix
3
4
Fork 0
Code Issues Pull Requests 67 Releases Wiki Activity

#142 & #143 - New descriptors header

This commit is contained in:
Juan 2018-03-01 16:52:35 +01:00
parent 2c88d24e24
commit c0f34bdd37
14 changed files with 79 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
client/client/src/descriptor/descriptor.html
View File

@ -1,20 +1,26 @@
<vn-card margin-medium-v>
<div class="descriptor-header pointer" ui-sref="clients">
<i class="material-icons">person</i>
</div>
<div pad-medium class="data">
<vn-card margin-medium-v class="vn-descriptor">
<vn-horizontal class="header">
<a translate-attr="{title: 'Return to module index'}" ui-sref="clients">
<vn-icon icon="chevron_left"></vn-icon>
</a>
<vn-icon icon="person"></vn-icon>
<a translate-attr="{title: 'Preview'}" ui-sref="clientCard.summary">
<vn-icon icon="computer"></vn-icon>
</a>
</vn-horizontal>
<div pad-medium>
<h6>{{$ctrl.client.name}}</h6>
<div>
<span class="label" translate>Id</span> {{$ctrl.client.id}}
<vn-label translate>Id</vn-label> {{$ctrl.client.id}}
</div>
<div>
<span class="label" translate>Phone</span> {{$ctrl.client.phone | phone}}
<vn-label translate>Phone</vn-label> {{$ctrl.client.phone | phone}}
</div>
<div>
<span class="label" translate>Credit</span> {{$ctrl.client.credit | currency:'€':2}}
<vn-label translate>Credit</vn-label> {{$ctrl.client.credit | currency:'€':2}}
</div>
<div>
<span class="label" translate>Secured credit</span>
<vn-label translate>Secured credit</vn-label>
<span ng-if="$ctrl.client.creditInsurance">{{$ctrl.client.creditInsurance | currency:'€':2}}</span>
<span ng-if="!$ctrl.client.creditInsurance">-</span>
</div>

1
client/client/src/descriptor/descriptor.js
View File

@ -1,5 +1,4 @@
import ngModule from '../module';
import './style.scss';
ngModule.component('vnClientDescriptor', {
template: require('./descriptor.html'),

6
client/client/src/descriptor/style.scss
View File

@ -1,6 +0,0 @@
vn-client-descriptor {
.data .label {
font-size: .9em;
color: #666;
}
}

2
client/core/src/components/icon/icon.js
View File

@ -1,5 +1,5 @@
import ngModule from '../../module';
import './style.css';
import './style.scss';
class Icon {
constructor($attrs) {

8
client/core/src/components/icon/style.css
View File

@ -1,8 +0,0 @@
vn-icon {
display: inline-block;
font-size: 18pt;
}
vn-icon > i {
display: block;
font-size: inherit;
}

10
client/core/src/components/icon/style.scss Normal file
View File

@ -0,0 +1,10 @@
vn-icon {
display: inline-block;
font-size: 18pt;
& > i,
& > i.material-icons {
display: block;
font-size: inherit;
}
}

1
client/core/src/components/index.js
View File

@ -21,7 +21,6 @@ import './button/button';
import './check/check';
import './radio/radio';
import './textarea/textarea';
import './label/label';
import './icon-button/icon-button';
import './submit/submit';
import './combo/combo';

1
client/core/src/components/label/label.html
View File

@ -1 +0,0 @@
<label translate="*[text]*"></label>

12
client/core/src/components/label/label.js
View File

@ -1,12 +0,0 @@
import ngModule from '../../module';
import template from './label.html';
directive.$inject = ['vnTemplate'];
export default function directive(vnTemplate) {
return {
restrict: 'E',
template: (_, $attrs) =>
vnTemplate.get(template, $attrs)
};
}
ngModule.directive('vnLabel', directive);

3
client/core/src/components/tooltip/style.css
View File

@ -1,6 +1,3 @@
[vn-tooltip]{
cursor: help;
}
.tooltip {
display: none;
position: fixed;

32
client/item/src/descriptor/item-descriptor.html
View File

@ -1,23 +1,29 @@
<vn-card margin-medium-v>
<vn-card margin-medium-v class="vn-descriptor">
<vn-horizontal class="header">
<a translate-attr="{title: 'Return to module index'}" ui-sref="item.index">
<vn-icon icon="chevron_left"></vn-icon>
</a>
<vn-icon icon="inbox"></vn-icon>
<a translate-attr="{title: 'Preview'}" ui-sref="item.card.summary">
<vn-icon icon="computer"></vn-icon>
</a>
</vn-horizontal>
<vn-vertical>
<vn-auto class="descriptor-header pointer" ui-sref="item.index">
<img ng-src="/static/images/icon_item.png"/>
</vn-auto>
<vn-auto style="position: relative" pad-medium text-center>
<img
ng-src="http://verdnatura.es/vn-image-data/catalog/200x200/{{::$ctrl.item.image}}"
zoom-image="http://verdnatura.es/vn-image-data/catalog/900x900/{{::$ctrl.item.image}}" on-error-src/>
<a href="https://www.verdnatura.es/#!form=admin/items&filter={{::$ctrl.item.id}}" target="_blank"><vn-float-button icon="edit"
style="position: absolute; bottom: 1em; right: 1em;"
vn-visible-by="administrative"></vn-float-button>
</a>
<a href="https://www.verdnatura.es/#!form=admin/items&filter={{::$ctrl.item.id}}" target="_blank"><vn-float-button icon="edit"
style="position: absolute; bottom: 1em; right: 1em;"
vn-visible-by="administrative"></vn-float-button>
</a>
</vn-auto>
<vn-auto pad-medium>
<div><span translate>Id</span>: <b>{{$ctrl.item.id}}</b></div>
<div><span translate>Name</span>: <b>{{$ctrl.item.name}}</b></div>
<div ng-repeat="itemTag in $ctrl.item.itemTag | limitTo:4">
<div><span translate>{{itemTag.tag.name}}</span>: <b>{{itemTag.value}}</b></div>
</div>
<h6>{{$ctrl.item.name}}</h6>
<div><vn-label translate>Id</vn-label> {{$ctrl.item.id}}</div>
<div ng-repeat="itemTag in $ctrl.item.itemTag | limitTo:4">
<div><vn-label translate>{{itemTag.tag.name}}</vn-label> {{itemTag.value}}</div>
</div>
</vn-auto>
</vn-vertical>
</vn-card>

4
client/salix/src/locale/es.yml
View File

@ -16,4 +16,6 @@ Items: Artículos
name: Nombre
credit: Crédito
phone: Teléfono
creditInsurance: Crédito Asegurado
creditInsurance: Crédito Asegurado
Return to module index: Volver a la página principal del módulo
Preview: Vista previa

47
client/salix/src/styles/misc.scss
View File

@ -24,6 +24,10 @@ html [fixed-bottom-right] {
right: 2em;
}
vn-label {
font-size: .9em;
color: #666;
}
vn-button-bar {
display: block;
margin-top: $margin-small;
@ -113,23 +117,30 @@ vn-main-block {
padding-bottom: 1em;
}
}
.descriptor-header{
background: rgb(255,171,64);
color: white;
text-align: center;
i {
font-size: 51px;
}
img {
width: 51px;
height: 51px;
.vn-descriptor {
& .header {
background: #ffa410;
color: white;
justify-content: space-between;
align-items: stretch;
& > vn-icon {
padding: .1em;
font-size: 2.5em;
}
& > a {
display: flex;
align-items: center;
padding: .5em;
color: white;
text-decoration: none;
&:hover {
background-color: rgba(1, 1, 1, 0.1);
}
& > vn-icon {
font-size: 1.8em;
}
}
}
}
fieldset[disabled] .mdl-textfield .mdl-textfield__input, .mdl-textfield.is-disabled .mdl-textfield__input,
fieldset[disabled] .mdl-checkbox .mdl-checkbox__label, .mdl-checkbox.is-disabled .mdl-checkbox__label{
border: none !important;
color: inherit !important;
}
fieldset[disabled] .mdl-textfield .mdl-textfield__label, .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
color: rgb(255,171,64) !important;
}

4
e2e/helpers/selectors.js
View File

@ -167,7 +167,7 @@ export default {
},
itemBasicData: {
goToItemIndexButton: 'body > vn-app > vn-vertical > vn-vertical > ui-view > vn-item-card > vn-main-block > vn-horizontal > vn-auto > vn-item-descriptor > vn-card > div > vn-vertical > vn-auto.descriptor-header.pointer > img',
goToItemIndexButton: 'vn-item-descriptor [ui-sref="item.index"]',
basicDataButton: `${components.vnMenuItem}[ui-sref="item.card.data"]`,
typeSelect: `${components.vnAutocomplete}[field="$ctrl.item.typeFk"] > vn-vertical > ${components.vnTextfield}`,
typeSelectOptionTwo: `${components.vnAutocomplete}[field="$ctrl.item.typeFk"] > vn-vertical > vn-drop-down > vn-vertical:not(.ng-hide) > vn-auto:nth-child(2) > ul > li:nth-child(2)`,
@ -182,7 +182,7 @@ export default {
submitBasicDataButton: `${components.vnSubmit}`
},
itemTags: {
goToItemIndexButton: 'body > vn-app > vn-vertical > vn-vertical > ui-view > vn-item-card > vn-main-block > vn-horizontal > vn-auto > vn-item-descriptor > vn-card > div > vn-vertical > vn-auto.descriptor-header.pointer > img',
goToItemIndexButton: 'vn-item-descriptor [ui-sref="item.index"]',
tagsButton: `${components.vnMenuItem}[ui-sref="item.card.tags"]`,
firstTagSelect: `vn-horizontal:nth-child(3) > ${components.vnAutocomplete}[field="itemTag.tagFk"] > vn-vertical > ${components.vnTextfield}`,
firstTagSelectOptionOne: `vn-horizontal:nth-child(3) > ${components.vnAutocomplete}[field="itemTag.tagFk"] > vn-vertical > vn-drop-down > vn-vertical:not(.ng-hide) > vn-auto:nth-child(2) > ul > li:nth-child(1)`,