From a9d5e870788d602d1988f10dde3b1dd5e1e487af Mon Sep 17 00:00:00 2001 From: Juan Ferrer Toribio Date: Thu, 10 Oct 2019 00:47:29 +0200 Subject: [PATCH] vnField alpha with ngModel --- e2e/helpers/extensions.js | 16 +- e2e/helpers/selectors.js | 252 +++++++++--------- front/core/components/autocomplete/index.html | 16 +- front/core/components/autocomplete/index.js | 16 +- front/core/components/autocomplete/style.scss | 24 +- front/core/components/check/index.js | 4 +- front/core/components/date-picker/index.js | 2 - .../core/components/drop-down/drop-down.html | 6 +- front/core/components/drop-down/drop-down.js | 2 +- front/core/components/drop-down/style.scss | 13 +- front/core/components/field/index.html | 4 +- front/core/components/field/index.js | 65 +++-- front/core/components/field/style.scss | 147 +++++----- front/core/components/form-input/index.js | 58 ++++ front/core/components/icon-button/style.scss | 6 +- front/core/components/index.js | 2 +- .../core/components/input-file/index.spec.js | 2 +- front/core/components/input-file/style.scss | 154 ++++++++++- front/core/components/input-number/index.html | 22 +- front/core/components/input-number/index.js | 1 - front/core/components/input-time/index.js | 1 - .../components/multi-check/multi-check.html | 2 +- front/core/components/popover/popover.js | 5 +- front/core/components/radio/index.js | 4 +- .../core/components/searchbar/searchbar.html | 45 ++-- front/core/components/searchbar/style.scss | 5 - front/core/components/textarea/index.js | 26 ++ front/core/components/textarea/index.spec.js | 39 +++ front/core/components/textarea/style.scss | 24 -- front/core/components/textarea/textarea.html | 9 - front/core/components/textarea/textarea.js | 43 --- .../core/components/textarea/textarea.spec.js | 56 ---- front/core/components/textfield/style.scss | 162 ----------- .../core/components/textfield/textfield.html | 41 --- front/core/components/textfield/textfield.js | 95 +------ .../components/textfield/textfield.spec.js | 84 ------ front/core/components/toggle/index.js | 11 +- front/core/components/toggle/style.scss | 6 +- front/core/directives/uvc.html | 2 +- front/core/lib/input.js | 70 +---- front/core/services/config.js | 73 +++++ front/core/services/index.js | 1 + front/salix/components/app/style.scss | 47 +++- front/salix/components/index.js | 2 +- front/salix/components/login/login.html | 6 +- front/salix/components/login/style.scss | 2 - .../salix/components/main-menu/main-menu.html | 10 +- front/salix/components/main-menu/main-menu.js | 8 - .../user-configuration-popover/index.js | 158 ----------- .../user-configuration-popover/index.spec.js | 96 ------- .../index.html | 20 +- front/salix/components/user-popover/index.js | 94 +++++++ .../components/user-popover/index.spec.js | 63 +++++ .../locale/es.yml | 0 .../style.scss | 2 +- front/salix/index.js | 1 + front/salix/module.js | 8 +- front/salix/services/index.js | 0 modules/agency/front/basic-data/index.html | 16 +- modules/agency/front/create/index.html | 13 +- modules/agency/front/delivery-days/index.html | 6 +- modules/agency/front/edit/index.html | 14 +- modules/agency/front/events/index.html | 32 +-- modules/agency/front/exclusions/index.html | 8 +- modules/agency/front/exclusions/index.js | 15 +- .../front/location-search-panel/index.html | 8 +- modules/agency/front/location/index.html | 2 +- modules/agency/front/search-panel/index.html | 6 +- modules/agency/front/summary/index.html | 2 +- modules/agency/front/warehouses/index.html | 4 +- modules/claim/front/action/index.html | 4 +- modules/claim/front/basic-data/index.html | 19 +- modules/claim/front/detail/index.html | 4 +- modules/claim/front/development/index.html | 10 +- modules/claim/front/dms/index/index.js | 9 +- modules/claim/front/search-panel/index.html | 16 +- modules/claim/front/summary/index.html | 2 +- .../client/front/address/create/index.html | 64 +++-- modules/client/front/address/edit/index.html | 76 ++++-- modules/client/front/address/index/index.html | 2 +- .../client/front/balance/create/index.html | 8 +- modules/client/front/balance/create/index.js | 8 +- modules/client/front/balance/index/index.html | 5 +- modules/client/front/balance/index/index.js | 6 +- modules/client/front/basic-data/index.html | 20 +- modules/client/front/billing-data/index.html | 72 ++--- modules/client/front/billing-data/index.js | 2 +- modules/client/front/contact/index.html | 7 +- modules/client/front/create/index.html | 65 +++-- .../front/credit-insurance/create/index.html | 6 +- .../insurance/create/index.html | 6 +- modules/client/front/credit/create/index.html | 2 +- modules/client/front/dms/create/index.html | 25 +- modules/client/front/dms/create/index.js | 9 +- modules/client/front/dms/edit/index.html | 22 +- modules/client/front/dms/index/index.html | 2 +- modules/client/front/fiscal-data/index.html | 55 ++-- modules/client/front/greuge/create/index.html | 8 +- modules/client/front/module.js | 2 +- modules/client/front/note/create/index.html | 5 +- modules/client/front/postcode/index.html | 13 +- .../client/front/recovery/create/index.html | 8 +- modules/client/front/sample/create/index.html | 4 +- modules/client/front/search-panel/index.html | 20 +- modules/client/front/sms/index.html | 11 +- modules/client/front/summary/index.html | 22 +- modules/client/front/web-access/index.html | 11 +- .../invoiceOut/front/search-panel/index.html | 18 +- modules/item/front/barcode/index.html | 2 +- modules/item/front/basic-data/index.html | 41 ++- modules/item/front/botanical/index.html | 6 +- modules/item/front/create/index.html | 8 +- modules/item/front/descriptor/index.html | 4 +- modules/item/front/descriptor/index.js | 7 +- modules/item/front/diary/index.html | 2 +- modules/item/front/index/index.html | 2 +- modules/item/front/last-entries/index.html | 4 +- modules/item/front/niche/index.html | 4 +- .../front/request-search-panel/index.html | 16 +- modules/item/front/request/index.html | 8 +- modules/item/front/request/style.scss | 4 +- modules/item/front/search-panel/index.html | 20 +- modules/item/front/tags/index.html | 10 +- modules/item/front/tax/index.html | 10 +- modules/order/front/basic-data/index.html | 13 +- .../front/catalog-search-panel/index.html | 4 +- modules/order/front/catalog/index.html | 4 +- modules/order/front/create/card.html | 8 +- modules/order/front/filter/index.html | 32 +-- modules/order/front/index/index.html | 2 +- modules/order/front/prices-popover/index.html | 2 +- modules/order/front/search-panel/index.html | 22 +- modules/order/front/summary/index.html | 2 +- modules/route/front/basic-data/index.html | 19 +- modules/route/front/create/index.html | 11 +- modules/route/front/index/index.js | 7 +- modules/route/front/search-panel/index.html | 18 +- modules/route/front/summary/index.html | 3 +- modules/route/front/tickets/index.html | 6 +- .../front/basic-data/step-one/index.html | 16 +- .../front/basic-data/step-three/index.html | 4 +- modules/ticket/front/create/card.html | 10 +- modules/ticket/front/create/card.js | 8 +- modules/ticket/front/descriptor/index.html | 2 +- modules/ticket/front/dms/create/index.html | 25 +- modules/ticket/front/dms/create/index.js | 9 +- modules/ticket/front/dms/edit/index.html | 26 +- modules/ticket/front/dms/index/index.html | 2 +- modules/ticket/front/index/index.html | 2 +- modules/ticket/front/note/index.html | 4 +- modules/ticket/front/package/index.html | 6 +- .../ticket/front/request/create/index.html | 14 +- modules/ticket/front/request/index/index.html | 2 +- modules/ticket/front/sale-checked/index.html | 2 +- modules/ticket/front/sale-tracking/index.html | 2 +- modules/ticket/front/sale/editDiscount.html | 2 +- modules/ticket/front/sale/index.html | 27 +- modules/ticket/front/search-panel/index.html | 32 +-- modules/ticket/front/services/index.html | 13 +- modules/ticket/front/summary/index.html | 2 +- modules/ticket/front/tracking/edit/index.html | 4 +- modules/ticket/front/weekly/create/index.html | 10 +- modules/ticket/front/weekly/index/index.html | 4 +- modules/travel/front/index/index.html | 4 +- modules/travel/front/search-panel/index.html | 18 +- modules/worker/front/account/index.html | 2 +- modules/worker/front/basic-data/index.html | 9 +- modules/worker/front/department/index.html | 5 +- modules/worker/front/pbx/index.html | 2 +- modules/worker/front/search-panel/index.html | 18 +- modules/worker/front/time-control/index.html | 2 +- 171 files changed, 1687 insertions(+), 1809 deletions(-) create mode 100644 front/core/components/form-input/index.js create mode 100644 front/core/components/textarea/index.js create mode 100644 front/core/components/textarea/index.spec.js delete mode 100644 front/core/components/textarea/style.scss delete mode 100644 front/core/components/textarea/textarea.html delete mode 100644 front/core/components/textarea/textarea.js delete mode 100644 front/core/components/textarea/textarea.spec.js delete mode 100644 front/core/components/textfield/style.scss delete mode 100644 front/core/components/textfield/textfield.html delete mode 100644 front/core/components/textfield/textfield.spec.js create mode 100644 front/core/services/config.js delete mode 100644 front/salix/components/user-configuration-popover/index.js delete mode 100644 front/salix/components/user-configuration-popover/index.spec.js rename front/salix/components/{user-configuration-popover => user-popover}/index.html (86%) create mode 100644 front/salix/components/user-popover/index.js create mode 100644 front/salix/components/user-popover/index.spec.js rename front/salix/components/{user-configuration-popover => user-popover}/locale/es.yml (100%) rename front/salix/components/{user-configuration-popover => user-popover}/style.scss (94%) create mode 100644 front/salix/services/index.js diff --git a/e2e/helpers/extensions.js b/e2e/helpers/extensions.js index c000a471a..fb36e3279 100644 --- a/e2e/helpers/extensions.js +++ b/e2e/helpers/extensions.js @@ -19,16 +19,9 @@ let actions = { clearInput: function(selector, done) { this.wait(selector) .evaluate(selector => { - let field = document.querySelector(selector) - .closest('*[model], *[field], *[value]'); - let $ctrl = field.$ctrl; - - if (field.classList.contains('vn-field')) { - $ctrl.field = null; - $ctrl.$.$apply(); - } else - $ctrl.value = null; - + let $ctrl = document.querySelector(selector).closest('.vn-field').$ctrl; + $ctrl.field = null; + $ctrl.$.$apply(); $ctrl.input.dispatchEvent(new Event('change')); }, selector) .then(done) @@ -41,6 +34,7 @@ let actions = { let doLogin = () => { this.wait(`vn-login input[name=user]`) + .clearInput(`vn-login input[name=user]`) .write(`vn-login input[name=user]`, userName) .write(`vn-login input[name=password]`, 'nightmare') .click(`vn-login input[type=submit]`) @@ -85,7 +79,7 @@ let actions = { }, changeLanguageToEnglish: function(done) { - let langSelector = '.user-configuration vn-autocomplete[field="$ctrl.lang"]'; + let langSelector = '.user-popover vn-autocomplete[ng-model="$ctrl.lang"]'; this.waitToClick('#user') .wait(langSelector) diff --git a/e2e/helpers/selectors.js b/e2e/helpers/selectors.js index d9cba7aca..667ab467e 100644 --- a/e2e/helpers/selectors.js +++ b/e2e/helpers/selectors.js @@ -11,11 +11,11 @@ export default { claimsButton: '.modules-menu > li[ui-sref="claim.index"]', returnToModuleIndexButton: 'a[ui-sref="order.index"]', userMenuButton: 'vn-topbar #user', - userLocalWarehouse: '.user-configuration vn-autocomplete[field="$ctrl.localWarehouseFk"]', - userLocalBank: '.user-configuration vn-autocomplete[field="$ctrl.localBankFk"]', - userLocalCompany: '.user-configuration vn-autocomplete[field="$ctrl.localCompanyFk"]', - userWarehouse: '.user-configuration vn-autocomplete[field="$ctrl.warehouseFk"]', - userCompany: '.user-configuration vn-autocomplete[field="$ctrl.companyFk"]', + userLocalWarehouse: '.user-popover vn-autocomplete[ng-model="$ctrl.localWarehouseFk"]', + userLocalBank: '.user-popover vn-autocomplete[ng-model="$ctrl.localBankFk"]', + userLocalCompany: '.user-popover vn-autocomplete[ng-model="$ctrl.localCompanyFk"]', + userWarehouse: '.user-popover vn-autocomplete[ng-model="$ctrl.warehouseFk"]', + userCompany: '.user-popover vn-autocomplete[ng-model="$ctrl.companyFk"]', userConfigFirstAutocompleteClear: '#localWarehouse .icons > vn-icon[icon=clear]', userConfigSecondAutocompleteClear: '#localBank .icons > vn-icon[icon=clear]', userConfigThirdAutocompleteClear: '#localCompany .icons > vn-icon[icon=clear]', @@ -35,11 +35,11 @@ export default { street: `${components.vnTextfield}[name="street"]`, postcode: `${components.vnTextfield}[name="postcode"]`, city: `${components.vnTextfield}[name="city"]`, - province: `vn-autocomplete[field="$ctrl.client.provinceFk"]`, - country: `vn-autocomplete[field="$ctrl.client.countryFk"]`, + province: `vn-autocomplete[ng-model="$ctrl.client.provinceFk"]`, + country: `vn-autocomplete[ng-model="$ctrl.client.countryFk"]`, userName: `${components.vnTextfield}[name="userName"]`, email: `${components.vnTextfield}[name="email"]`, - salesPersonAutocomplete: `vn-autocomplete[field="$ctrl.client.salesPersonFk"]`, + salesPersonAutocomplete: `vn-autocomplete[ng-model="$ctrl.client.salesPersonFk"]`, createButton: `${components.vnSubmit}`, cancelButton: 'vn-button[href="#!/client/index"]' }, @@ -49,13 +49,13 @@ export default { }, clientBasicData: { basicDataButton: 'vn-left-menu a[ui-sref="client.card.basicData"]', - nameInput: 'vn-textfield[field="$ctrl.client.name"] input', - contactInput: 'vn-textfield[field="$ctrl.client.contact"] input', - phoneInput: 'vn-textfield[field="$ctrl.client.phone"] input', - mobileInput: 'vn-textfield[field="$ctrl.client.mobile"] input', - emailInput: 'vn-textfield[field="$ctrl.client.email"] input', - salesPersonAutocomplete: 'vn-autocomplete[field="$ctrl.client.salesPersonFk"]', - channelAutocomplete: 'vn-autocomplete[field="$ctrl.client.contactChannelFk"]', + nameInput: 'vn-textfield[ng-model="$ctrl.client.name"] input', + contactInput: 'vn-textfield[ng-model="$ctrl.client.contact"] input', + phoneInput: 'vn-textfield[ng-model="$ctrl.client.phone"] input', + mobileInput: 'vn-textfield[ng-model="$ctrl.client.mobile"] input', + emailInput: 'vn-textfield[ng-model="$ctrl.client.email"] input', + salesPersonAutocomplete: 'vn-autocomplete[ng-model="$ctrl.client.salesPersonFk"]', + channelAutocomplete: 'vn-autocomplete[ng-model="$ctrl.client.contactChannelFk"]', saveButton: `${components.vnSubmit}` }, clientFiscalData: { @@ -67,8 +67,8 @@ export default { addressInput: `${components.vnTextfield}[name="street"]`, postcodeInput: `${components.vnTextfield}[name="postcode"]`, cityInput: `${components.vnTextfield}[name="city"]`, - provinceAutocomplete: 'vn-autocomplete[field="$ctrl.client.provinceFk"]', - countryAutocomplete: 'vn-autocomplete[field="$ctrl.client.countryFk"]', + provinceAutocomplete: 'vn-autocomplete[ng-model="$ctrl.client.provinceFk"]', + countryAutocomplete: 'vn-autocomplete[ng-model="$ctrl.client.countryFk"]', activeCheckbox: 'vn-check[label="Active"]', frozenCheckbox: 'vn-check[label="Frozen"]', invoiceByAddressCheckbox: 'vn-check[label="Invoice by address"]', @@ -79,14 +79,14 @@ export default { saveButton: `${components.vnSubmit}` }, clientBillingData: { - payMethodAutocomplete: 'vn-client-billing-data vn-autocomplete[field="$ctrl.client.payMethodFk"]', + payMethodAutocomplete: 'vn-client-billing-data vn-autocomplete[ng-model="$ctrl.client.payMethodFk"]', IBANInput: `vn-client-billing-data ${components.vnTextfield}[name="iban"]`, dueDayInput: `vn-client-billing-data ${components.vnInputNumber}[name="dueDay"]`, receivedCoreLCRCheckbox: 'vn-client-billing-data vn-check[label="Received LCR"]', receivedCoreVNLCheckbox: 'vn-client-billing-data vn-check[label="Received core VNL"]', receivedB2BVNLCheckbox: 'vn-client-billing-data vn-check[label="Received B2B VNL"]', - swiftBicAutocomplete: 'vn-client-billing-data vn-autocomplete[field="$ctrl.client.bankEntityFk"]', - clearswiftBicButton: 'vn-client-billing-data vn-autocomplete[field="$ctrl.client.bankEntityFk"] .icons > vn-icon[icon=clear]', + swiftBicAutocomplete: 'vn-client-billing-data vn-autocomplete[ng-model="$ctrl.client.bankEntityFk"]', + clearswiftBicButton: 'vn-client-billing-data vn-autocomplete[ng-model="$ctrl.client.bankEntityFk"] .icons > vn-icon[icon=clear]', newBankEntityButton: 'vn-client-billing-data vn-icon-button[vn-tooltip="New bank entity"] > button', newBankEntityName: 'vn-client-billing-data > vn-dialog vn-textfield[label="Name"] input', newBankEntityBIC: 'vn-client-billing-data > vn-dialog vn-textfield[label="Swift / BIC"] input', @@ -102,8 +102,8 @@ export default { streetAddressInput: `${components.vnTextfield}[name="street"]`, postcodeInput: `${components.vnTextfield}[name="postalCode"]`, cityInput: `${components.vnTextfield}[name="city"]`, - provinceAutocomplete: 'vn-autocomplete[field="$ctrl.address.provinceFk"]', - agencyAutocomplete: 'vn-autocomplete[field="$ctrl.address.agencyModeFk"]', + provinceAutocomplete: 'vn-autocomplete[ng-model="$ctrl.address.provinceFk"]', + agencyAutocomplete: 'vn-autocomplete[ng-model="$ctrl.address.agencyModeFk"]', phoneInput: `${components.vnTextfield}[name="phone"]`, mobileInput: `${components.vnTextfield}[name="mobile"]`, defaultAddress: 'vn-client-address-index div:nth-child(1) div[name="street"]', @@ -112,10 +112,10 @@ export default { secondEditAddress: 'vn-client-address-index div:nth-child(2) > a', activeCheckbox: 'vn-check[label="Enabled"]', equalizationTaxCheckbox: 'vn-client-address-edit vn-check[label="Is equalizated"]', - firstObservationTypeAutocomplete: 'vn-client-address-edit [name=observations] :nth-child(1) [field="observation.observationTypeFk"]', - firstObservationDescriptionInput: 'vn-client-address-edit [name=observations] :nth-child(1) [model="observation.description"] input', - secondObservationTypeAutocomplete: 'vn-client-address-edit [name=observations] :nth-child(2) [field="observation.observationTypeFk"]', - secondObservationDescriptionInput: 'vn-client-address-edit [name=observations] :nth-child(2) [model="observation.description"] input', + firstObservationTypeAutocomplete: 'vn-client-address-edit [name=observations] :nth-child(1) [ng-model="observation.observationTypeFk"]', + firstObservationDescriptionInput: 'vn-client-address-edit [name=observations] :nth-child(1) [ng-model="observation.description"] input', + secondObservationTypeAutocomplete: 'vn-client-address-edit [name=observations] :nth-child(2) [ng-model="observation.observationTypeFk"]', + secondObservationDescriptionInput: 'vn-client-address-edit [name=observations] :nth-child(2) [ng-model="observation.description"] input', addObservationButton: 'vn-client-address-edit div[name="observations"] vn-icon-button[icon="add_circle"]', saveButton: `${components.vnSubmit}`, cancelCreateAddressButton: 'button[ui-sref="client.card.address.index"]', @@ -143,7 +143,7 @@ export default { addGreugeFloatButton: `${components.vnFloatButton}`, amountInput: `${components.vnInputNumber}[name="amount"]`, descriptionInput: `${components.vnTextfield}[name="description"]`, - typeAutocomplete: 'vn-autocomplete[field="$ctrl.greuge.greugeTypeFk"]', + typeAutocomplete: 'vn-autocomplete[ng-model="$ctrl.greuge.greugeTypeFk"]', saveButton: `${components.vnSubmit}`, firstGreugeText: 'vn-client-greuge-index vn-card > div vn-table vn-tbody > vn-tr' }, @@ -162,10 +162,10 @@ export default { }, clientBalance: { balanceButton: 'vn-left-menu a[ui-sref="client.card.balance.index"]', - companyAutocomplete: 'vn-client-balance-index vn-autocomplete[field="$ctrl.companyFk"]', + companyAutocomplete: 'vn-client-balance-index vn-autocomplete[ng-model="$ctrl.companyFk"]', newPaymentButton: `${components.vnFloatButton}`, - newPaymentBank: 'vn-client-balance-create vn-autocomplete[field="$ctrl.receipt.bankFk"]', - newPaymentAmountInput: 'vn-client-balance-create vn-input-number[field="$ctrl.receipt.amountPaid"] input', + newPaymentBank: 'vn-client-balance-create vn-autocomplete[ng-model="$ctrl.receipt.bankFk"]', + newPaymentAmountInput: 'vn-client-balance-create vn-input-number[ng-model="$ctrl.receipt.amountPaid"] input', saveButton: 'vn-client-balance-create vn-button[label="Save"]', firstBalanceLine: 'vn-client-balance-index vn-tbody > vn-tr:nth-child(1) > vn-td:nth-child(8)' @@ -209,9 +209,9 @@ export default { }, itemCreateView: { temporalName: `${components.vnTextfield}[name="provisionalName"]`, - typeAutocomplete: 'vn-autocomplete[field="$ctrl.item.typeFk"]', - intrastatAutocomplete: 'vn-autocomplete[field="$ctrl.item.intrastatFk"]', - originAutocomplete: 'vn-autocomplete[field="$ctrl.item.originFk"]', + typeAutocomplete: 'vn-autocomplete[ng-model="$ctrl.item.typeFk"]', + intrastatAutocomplete: 'vn-autocomplete[ng-model="$ctrl.item.intrastatFk"]', + originAutocomplete: 'vn-autocomplete[ng-model="$ctrl.item.originFk"]', createButton: `${components.vnSubmit}`, cancelButton: 'button[ui-sref="item.index"]' }, @@ -220,7 +220,7 @@ export default { moreMenu: 'vn-item-descriptor vn-icon-menu > div > vn-icon', moreMenuRegularizeButton: '.vn-popover.shown .vn-drop-down li[name="Regularize stock"]', regularizeQuantityInput: 'vn-item-descriptor > vn-dialog > div > form > div.body > tpl-body > div > vn-textfield > div > div > div.infix > input', - regularizeWarehouseAutocomplete: 'vn-item-descriptor vn-dialog vn-autocomplete[field="$ctrl.warehouseFk"]', + regularizeWarehouseAutocomplete: 'vn-item-descriptor vn-dialog vn-autocomplete[ng-model="$ctrl.warehouseFk"]', editButton: 'vn-item-card vn-item-descriptor vn-float-button[icon="edit"]', regularizeSaveButton: 'vn-item-descriptor > vn-dialog > div > form > div.buttons > tpl-buttons > button', inactiveIcon: 'vn-item-descriptor vn-icon[icon="icon-unavailable"]', @@ -229,13 +229,13 @@ export default { itemBasicData: { basicDataButton: 'vn-left-menu a[ui-sref="item.card.basicData"]', goToItemIndexButton: 'vn-item-descriptor [ui-sref="item.index"]', - typeAutocomplete: 'vn-autocomplete[field="$ctrl.item.typeFk"]', - intrastatAutocomplete: 'vn-autocomplete[field="$ctrl.item.intrastatFk"]', + typeAutocomplete: 'vn-autocomplete[ng-model="$ctrl.item.typeFk"]', + intrastatAutocomplete: 'vn-autocomplete[ng-model="$ctrl.item.intrastatFk"]', nameInput: 'vn-textfield[label="Name"] input', - relevancyInput: 'vn-input-number[label="Relevancy"] input', - originAutocomplete: 'vn-autocomplete[field="$ctrl.item.originFk"]', - expenceAutocomplete: 'vn-autocomplete[field="$ctrl.item.expenceFk"]', - longNameInput: 'vn-textfield[field="$ctrl.item.longName"] input', + relevancyInput: 'vn-input-number[ng-model="Relevancy"] input', + originAutocomplete: 'vn-autocomplete[ng-model="$ctrl.item.originFk"]', + expenceAutocomplete: 'vn-autocomplete[ng-model="$ctrl.item.expenceFk"]', + longNameInput: 'vn-textfield[ng-model="$ctrl.item.longName"] input', isActiveCheckbox: 'vn-check[label="Active"]', priceInKgCheckbox: 'vn-check[label="Price in kg"]', submitBasicDataButton: `${components.vnSubmit}` @@ -243,17 +243,17 @@ export default { itemTags: { goToItemIndexButton: 'vn-item-descriptor [ui-sref="item.index"]', tagsButton: 'vn-left-menu a[ui-sref="item.card.tags"]', - fourthTagAutocomplete: 'vn-item-tags vn-horizontal:nth-child(4) > vn-autocomplete[field="itemTag.tagFk"]', + fourthTagAutocomplete: 'vn-item-tags vn-horizontal:nth-child(4) > vn-autocomplete[ng-model="itemTag.tagFk"]', fourthValueInput: 'vn-item-tags vn-horizontal:nth-child(4) > vn-textfield[label="Value"] input', fourthRelevancyInput: 'vn-item-tags vn-horizontal:nth-child(4) > vn-textfield[label="Relevancy"] input', fourthRemoveTagButton: 'vn-item-tags vn-horizontal:nth-child(4) vn-icon-button[icon="delete"]', - fifthTagAutocomplete: 'vn-item-tags vn-horizontal:nth-child(5) > vn-autocomplete[field="itemTag.tagFk"]', + fifthTagAutocomplete: 'vn-item-tags vn-horizontal:nth-child(5) > vn-autocomplete[ng-model="itemTag.tagFk"]', fifthValueInput: 'vn-item-tags vn-horizontal:nth-child(5) > vn-textfield[label="Value"] input', fifthRelevancyInput: 'vn-item-tags vn-horizontal:nth-child(5) > vn-textfield[label="Relevancy"] input', - sixthTagAutocomplete: 'vn-item-tags vn-horizontal:nth-child(6) > vn-autocomplete[field="itemTag.tagFk"]', + sixthTagAutocomplete: 'vn-item-tags vn-horizontal:nth-child(6) > vn-autocomplete[ng-model="itemTag.tagFk"]', sixthValueInput: 'vn-item-tags vn-horizontal:nth-child(6) > vn-textfield[label="Value"] input', sixthRelevancyInput: 'vn-item-tags vn-horizontal:nth-child(6) > vn-textfield[label="Relevancy"] input', - seventhTagAutocomplete: 'vn-item-tags vn-horizontal:nth-child(7) > vn-autocomplete[field="itemTag.tagFk"]', + seventhTagAutocomplete: 'vn-item-tags vn-horizontal:nth-child(7) > vn-autocomplete[ng-model="itemTag.tagFk"]', seventhValueInput: 'vn-item-tags vn-horizontal:nth-child(7) > vn-textfield[label="Value"] input', seventhRelevancyInput: 'vn-item-tags vn-horizontal:nth-child(7) > vn-textfield[label="Relevancy"] input', addItemTagButton: 'vn-item-tags vn-icon-button[icon="add_circle"]', @@ -261,9 +261,9 @@ export default { }, itemTax: { undoChangesButton: 'vn-item-tax vn-button-bar > vn-button[label="Undo changes"]', - firstClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(1) > vn-autocomplete[field="tax.taxClassFk"]', - secondClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(2) > vn-autocomplete[field="tax.taxClassFk"]', - thirdClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(3) > vn-autocomplete[field="tax.taxClassFk"]', + firstClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(1) > vn-autocomplete[ng-model="tax.taxClassFk"]', + secondClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(2) > vn-autocomplete[ng-model="tax.taxClassFk"]', + thirdClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(3) > vn-autocomplete[ng-model="tax.taxClassFk"]', submitTaxButton: `vn-item-tax ${components.vnSubmit}` }, itemBarcodes: { @@ -274,19 +274,19 @@ export default { }, itemNiches: { addNicheButton: 'vn-item-niche vn-icon[icon="add_circle"]', - firstWarehouseAutocomplete: 'vn-item-niche vn-autocomplete[field="niche.warehouseFk"]', + firstWarehouseAutocomplete: 'vn-item-niche vn-autocomplete[ng-model="niche.warehouseFk"]', firstCodeInput: 'vn-item-niche vn-horizontal:nth-child(1) > vn-textfield[label="Code"] input', - secondWarehouseAutocomplete: 'vn-item-niche vn-horizontal:nth-child(2) > vn-autocomplete[field="niche.warehouseFk"]', + secondWarehouseAutocomplete: 'vn-item-niche vn-horizontal:nth-child(2) > vn-autocomplete[ng-model="niche.warehouseFk"]', secondCodeInput: 'vn-item-niche vn-horizontal:nth-child(2) > vn-textfield[label="Code"] input', secondNicheRemoveButton: 'vn-item-niche vn-horizontal:nth-child(2) > vn-none > vn-icon-button[icon="delete"]', - thirdWarehouseAutocomplete: 'vn-item-niche vn-horizontal:nth-child(3) > vn-autocomplete[field="niche.warehouseFk"]', + thirdWarehouseAutocomplete: 'vn-item-niche vn-horizontal:nth-child(3) > vn-autocomplete[ng-model="niche.warehouseFk"]', thirdCodeInput: 'vn-item-niche vn-horizontal:nth-child(3) > vn-textfield[label="Code"] input', submitNichesButton: `vn-item-niche ${components.vnSubmit}` }, itemBotanical: { botanicalInput: `vn-item-botanical vn-horizontal:nth-child(1) > ${components.vnTextfield}`, - genusAutocomplete: 'vn-item-botanical vn-autocomplete[field="$ctrl.botanical.genusFk"]', - speciesAutocomplete: 'vn-item-botanical vn-autocomplete[field="$ctrl.botanical.specieFk"]', + genusAutocomplete: 'vn-item-botanical vn-autocomplete[ng-model="$ctrl.botanical.genusFk"]', + speciesAutocomplete: 'vn-item-botanical vn-autocomplete[ng-model="$ctrl.botanical.specieFk"]', submitBotanicalButton: `vn-item-botanical ${components.vnSubmit}` }, itemSummary: { @@ -301,7 +301,7 @@ export default { secondTicketId: 'vn-item-diary vn-tbody > vn-tr:nth-child(2) > vn-td:nth-child(2) > span', firstBalance: 'vn-item-diary vn-tbody > vn-tr:nth-child(1) > vn-td.balance', fourthBalance: 'vn-item-diary vn-tbody > vn-tr:nth-child(4) > vn-td.balance', - warehouseAutocomplete: 'vn-item-diary vn-autocomplete[field="$ctrl.warehouseFk"]', + warehouseAutocomplete: 'vn-item-diary vn-autocomplete[ng-model="$ctrl.warehouseFk"]', }, itemLog: { anyLineCreated: 'vn-item-log > vn-log vn-tbody > vn-tr', @@ -324,8 +324,8 @@ export default { setOk: 'vn-ticket-summary vn-button[label="SET OK"] > button' }, ticketsIndex: { - openAdvancedSearchButton: 'vn-ticket-index vn-searchbar t-right-icons > vn-icon[icon="keyboard_arrow_down"]', - advancedSearchInvoiceOut: 'vn-ticket-search-panel vn-textfield[model="filter.refFk"] input', + openAdvancedSearchButton: 'vn-ticket-index vn-searchbar .append > vn-icon[icon="keyboard_arrow_down"]', + advancedSearchInvoiceOut: 'vn-ticket-search-panel vn-textfield[ng-model="filter.refFk"] input', newTicketButton: 'vn-ticket-index > a', searchResult: 'vn-ticket-index vn-card > div > vn-table > div > vn-tbody > a.vn-tr', searchWeeklyResult: 'vn-ticket-weekly-index vn-table vn-tbody > vn-tr', @@ -338,17 +338,17 @@ export default { searchWeeklyButton: 'vn-ticket-weekly-index vn-searchbar vn-icon[icon="search"]', moreMenu: 'vn-ticket-index vn-icon-menu[vn-id="more-button"] > div > vn-icon', moreMenuWeeklyTickets: '.vn-popover.shown .vn-drop-down li:nth-child(2)', - sixthWeeklyTicket: 'vn-ticket-weekly-index vn-table vn-tr:nth-child(6) vn-autocomplete[field="weekly.weekDay"] input', + sixthWeeklyTicket: 'vn-ticket-weekly-index vn-table vn-tr:nth-child(6) vn-autocomplete[ng-model="weekly.weekDay"] input', weeklyTicket: 'vn-ticket-weekly-index vn-table > div > vn-tbody > vn-tr', firstWeeklyTicketDeleteIcon: 'vn-ticket-weekly-index vn-tr:nth-child(1) vn-icon-button[icon="delete"]', acceptDeleteTurn: 'vn-ticket-weekly-index > vn-confirm[vn-id="deleteWeekly"] button[response="ACCEPT"]' }, createTicketView: { - clientAutocomplete: 'vn-ticket-create vn-autocomplete[field="$ctrl.clientFk"]', - addressAutocomplete: 'vn-ticket-create vn-autocomplete[field="$ctrl.addressFk"]', - deliveryDateInput: 'vn-ticket-create vn-date-picker[field="$ctrl.landed"]', - warehouseAutocomplete: 'vn-ticket-create vn-autocomplete[field="$ctrl.warehouseFk"]', - agencyAutocomplete: 'vn-ticket-create vn-autocomplete[field="$ctrl.ticket.agencyModeFk"]', + clientAutocomplete: 'vn-ticket-create vn-autocomplete[ng-model="$ctrl.clientFk"]', + addressAutocomplete: 'vn-ticket-create vn-autocomplete[ng-model="$ctrl.addressFk"]', + deliveryDateInput: 'vn-ticket-create vn-date-picker[ng-model="$ctrl.landed"]', + warehouseAutocomplete: 'vn-ticket-create vn-autocomplete[ng-model="$ctrl.warehouseFk"]', + agencyAutocomplete: 'vn-ticket-create vn-autocomplete[ng-model="$ctrl.ticket.agencyModeFk"]', createButton: `${components.vnSubmit}` }, ticketDescriptor: { @@ -377,7 +377,7 @@ export default { ticketNotes: { firstNoteRemoveButton: 'vn-icon[icon="delete"]', addNoteButton: 'vn-icon[icon="add_circle"]', - firstNoteTypeAutocomplete: 'vn-autocomplete[field="observation.observationTypeFk"]', + firstNoteTypeAutocomplete: 'vn-autocomplete[ng-model="observation.observationTypeFk"]', firstDescriptionInput: 'vn-textfield[label="Description"] input', submitNotesButton: `${components.vnSubmit}` }, @@ -390,7 +390,7 @@ export default { ticketPackages: { packagesButton: 'vn-left-menu a[ui-sref="ticket.card.package"]', firstPackageAutocomplete: 'vn-autocomplete[label="Package"]', - firstQuantityInput: 'vn-input-number[label="Quantity"] input', + firstQuantityInput: 'vn-input-number[ng-model="Quantity"] input', firstRemovePackageButton: 'vn-icon-button[vn-tooltip="Remove package"]', addPackageButton: 'vn-icon-button[vn-tooltip="Add package"]', clearPackageAutocompleteButton: 'vn-autocomplete[label="Package"] .icons > vn-icon[icon=clear]', @@ -409,7 +409,7 @@ export default { moreMenuReserve: '.vn-popover.shown .vn-drop-down li[name="Mark as reserved"]', moreMenuUnmarkReseved: '.vn-popover.shown .vn-drop-down li[name="Unmark as reserved"]', moreMenuUpdateDiscount: '.vn-popover.shown .vn-drop-down li[name="Update discount"]', - moreMenuUpdateDiscountInput: 'vn-ticket-sale vn-dialog form vn-ticket-sale-edit-discount vn-input-number[field="$ctrl.newDiscount"] input', + moreMenuUpdateDiscountInput: 'vn-ticket-sale vn-dialog form vn-ticket-sale-edit-discount vn-input-number[ng-model="$ctrl.newDiscount"] input', transferQuantityInput: '.vn-popover.shown vn-table > div > vn-tbody > vn-tr > vn-td-editable > span > text', transferQuantityCell: '.vn-popover.shown vn-table > div > vn-tbody > vn-tr > vn-td-editable', firstSaleClaimIcon: 'vn-ticket-sale vn-table vn-tbody > vn-tr:nth-child(1) vn-icon[icon="icon-claims"]', @@ -417,9 +417,9 @@ export default { firstSaleText: 'vn-table div > vn-tbody > vn-tr:nth-child(1)', firstSaleThumbnailImage: 'vn-ticket-sale:nth-child(1) vn-tr:nth-child(1) vn-td:nth-child(3) > img', firstSaleZoomedImage: 'body > div > div > img', - firstSaleQuantity: 'vn-input-number[field="sale.quantity"]:nth-child(1) input', + firstSaleQuantity: 'vn-input-number[ng-model="sale.quantity"]:nth-child(1) input', firstSaleQuantityCell: 'vn-ticket-sale vn-tr:nth-child(1) > vn-td-editable:nth-child(5)', - firstSaleQuantityClearInput: 'vn-textfield[model="sale.quantity"] div.suffix > i', + firstSaleQuantityClearInput: 'vn-textfield[ng-model="sale.quantity"] div.suffix > i', firstSaleIdInput: 'vn-ticket-sale vn-table vn-tbody > vn-tr:nth-child(1) > vn-td:nth-child(4) > vn-autocomplete input', firstSaleIdAutocomplete: 'vn-ticket-sale vn-table vn-tbody > vn-tr:nth-child(1) > vn-td:nth-child(4) > vn-autocomplete', idAutocompleteFirstResult: '.vn-popover.shown .vn-drop-down li', @@ -431,7 +431,7 @@ export default { firstSaleReservedIcon: 'vn-ticket-sale vn-tr:nth-child(1) > vn-td:nth-child(2) > vn-icon:nth-child(3)', firstSaleColour: 'vn-tr:nth-child(1) vn-fetched-tags section', firstSaleLength: 'vn-ticket-sale vn-tr:nth-child(1) vn-td-editable:nth-child(6) section:nth-child(3)', - firstSaleCheckbox: 'vn-ticket-sale vn-tr:nth-child(1) vn-check[field="sale.checked"]', + firstSaleCheckbox: 'vn-ticket-sale vn-tr:nth-child(1) vn-check[ng-model="sale.checked"]', secondSaleColour: 'vn-tr:nth-child(2) vn-fetched-tags section', secondSalePrice: 'vn-ticket-sale vn-tr:nth-child(2) vn-td:nth-child(7) > span', secondSaleDiscount: 'vn-ticket-sale vn-tr:nth-child(2) vn-td:nth-child(8)', @@ -446,11 +446,11 @@ export default { secondSaleConceptInput: 'vn-ticket-sale vn-table vn-tr:nth-child(2) > vn-td-editable.ng-isolate-scope.selected vn-textfield input', totalImport: 'vn-ticket-sale > vn-vertical > vn-card > div > vn-vertical > vn-horizontal > vn-one > p:nth-child(3) > strong', selectAllSalesCheckbox: 'vn-ticket-sale vn-thead vn-check', - secondSaleCheckbox: 'vn-ticket-sale vn-tr:nth-child(2) vn-check[field="sale.checked"]', - thirdSaleCheckbox: 'vn-ticket-sale vn-tr:nth-child(3) vn-check[field="sale.checked"]', + secondSaleCheckbox: 'vn-ticket-sale vn-tr:nth-child(2) vn-check[ng-model="sale.checked"]', + thirdSaleCheckbox: 'vn-ticket-sale vn-tr:nth-child(3) vn-check[ng-model="sale.checked"]', deleteSaleButton: 'vn-ticket-sale vn-tool-bar > vn-button[icon="delete"]', transferSaleButton: 'vn-ticket-sale vn-tool-bar > vn-button[icon="call_split"]', - moveToTicketInput: '.vn-popover.shown vn-textfield[model="$ctrl.transfer.ticketId"] input', + moveToTicketInput: '.vn-popover.shown vn-textfield[ng-model="$ctrl.transfer.ticketId"] input', moveToTicketInputClearButton: '.vn-popover.shown i[title="Clear"]', moveToTicketButton: '.vn-popover.shown vn-icon[icon="arrow_forward_ios"]', moveToNewTicketButton: '.vn-popover.shown vn-button[label="New ticket"]', @@ -461,20 +461,20 @@ export default { ticketTracking: { trackingButton: 'vn-left-menu a[ui-sref="ticket.card.tracking.index"]', createStateButton: `${components.vnFloatButton}`, - stateAutocomplete: 'vn-ticket-tracking-edit vn-autocomplete[field="$ctrl.stateFk"]', + stateAutocomplete: 'vn-ticket-tracking-edit vn-autocomplete[ng-model="$ctrl.stateFk"]', saveButton: `${components.vnSubmit}`, cancelButton: 'vn-ticket-tracking-edit vn-button[ui-sref="ticket.card.tracking.index"]' }, ticketBasicData: { basicDataButton: 'vn-left-menu a[ui-sref="ticket.card.basicData.stepOne"]', - clientAutocomplete: 'vn-autocomplete[field="$ctrl.clientFk"]', - addressAutocomplete: 'vn-autocomplete[field="$ctrl.ticket.addressFk"]', - agencyAutocomplete: 'vn-autocomplete[field="$ctrl.agencyModeId"]', - zoneAutocomplete: 'vn-autocomplete[field="$ctrl.zoneId"]', + clientAutocomplete: 'vn-autocomplete[ng-model="$ctrl.clientFk"]', + addressAutocomplete: 'vn-autocomplete[ng-model="$ctrl.ticket.addressFk"]', + agencyAutocomplete: 'vn-autocomplete[ng-model="$ctrl.agencyModeId"]', + zoneAutocomplete: 'vn-autocomplete[ng-model="$ctrl.zoneId"]', nextStepButton: 'vn-step-control > section > section.buttons > section:nth-child(2) > vn-button', finalizeButton: 'vn-step-control > section > section.buttons > section:nth-child(2) > vn-submit', stepTwoTotalPriceDif: 'vn-ticket-basic-data-step-two > form > vn-card > div > vn-horizontal > table > tfoot > tr > td:nth-child(4)', - chargesReasonAutocomplete: 'vn-autocomplete[field="$ctrl.ticket.option"]', + chargesReasonAutocomplete: 'vn-autocomplete[ng-model="$ctrl.ticket.option"]', }, ticketComponents: { base: 'vn-ticket-components tfoot > tr:nth-child(1) > td', @@ -485,7 +485,7 @@ export default { addRequestButton: 'vn-ticket-request-index > a > vn-float-button > button', request: 'vn-ticket-request-index > form > vn-card > div > vn-horizontal > vn-table > div > vn-tbody > vn-tr', descriptionInput: 'vn-ticket-request-create > form > div > vn-card > div > vn-horizontal:nth-child(1) > vn-textfield > div > div > div.infix > input', - atenderAutocomplete: 'vn-ticket-request-create vn-autocomplete[field="$ctrl.ticketRequest.atenderFk"]', + atenderAutocomplete: 'vn-ticket-request-create vn-autocomplete[ng-model="$ctrl.ticketRequest.atenderFk"]', quantityInput: 'vn-ticket-request-create vn-input-number input[name=quantity]', priceInput: 'vn-ticket-request-create vn-input-number input[name=price]', firstRemoveRequestButton: 'vn-ticket-request-index vn-icon[icon="delete"]:nth-child(1)', @@ -502,20 +502,20 @@ export default { ticketService: { addServiceButton: 'vn-ticket-service vn-icon-button[vn-tooltip="Add service"] > button', firstAddDescriptionButton: 'vn-ticket-service vn-icon-button[vn-tooltip="New service type"] > button', - firstDescriptionAutocomplete: 'vn-ticket-service vn-autocomplete[field="service.description"]', + firstDescriptionAutocomplete: 'vn-ticket-service vn-autocomplete[ng-model="service.description"]', firstQuantityInput: 'vn-ticket-service vn-input-number[label="Quantity"] input', firstPriceInput: 'vn-ticket-service vn-input-number[label="Price"] input', firstVatTypeAutocomplete: 'vn-ticket-service vn-autocomplete[label="Tax class"]', fistDeleteServiceButton: 'vn-ticket-card > vn-main-block > div.content-block.ng-scope > vn-ticket-service > form > vn-card > div > vn-one:nth-child(1) > vn-horizontal:nth-child(1) > vn-auto > vn-icon-button[icon="delete"]', - newDescriptionInput: 'vn-ticket-service > vn-dialog vn-textfield[model="$ctrl.newServiceType.name"] input', + newDescriptionInput: 'vn-ticket-service > vn-dialog vn-textfield[ng-model="$ctrl.newServiceType.name"] input', serviceLine: 'vn-ticket-service > form > vn-card > div > vn-one:nth-child(2) > vn-horizontal', saveServiceButton: `${components.vnSubmit}`, saveDescriptionButton: 'vn-ticket-service > vn-dialog[vn-id="createServiceTypeDialog"] > div > form > div.buttons > tpl-buttons > button' }, createStateView: { - stateAutocomplete: 'vn-autocomplete[field="$ctrl.stateFk"]', - workerAutocomplete: 'vn-autocomplete[field="$ctrl.workerFk"]', - clearStateInputButton: 'vn-autocomplete[field="$ctrl.stateFk"] .icons > vn-icon[icon=clear]', + stateAutocomplete: 'vn-autocomplete[ng-model="$ctrl.stateFk"]', + workerAutocomplete: 'vn-autocomplete[ng-model="$ctrl.workerFk"]', + clearStateInputButton: 'vn-autocomplete[ng-model="$ctrl.stateFk"] .icons > vn-icon[icon=clear]', saveStateButton: `${components.vnSubmit}` }, claimsIndex: { @@ -531,7 +531,7 @@ export default { claimSummary: { header: 'vn-claim-summary > vn-card > div > h5', state: 'vn-claim-summary vn-label-value[label="State"] > section > span', - observation: 'vn-claim-summary vn-textarea[model="$ctrl.summary.claim.observation"] > div > textarea', + observation: 'vn-claim-summary vn-textarea[ng-model="$ctrl.summary.claim.observation"] > div > textarea', firstSaleItemId: 'vn-claim-summary vn-horizontal > vn-auto:nth-child(4) > vn-table > div > vn-tbody > vn-tr:nth-child(1) > vn-td:nth-child(1) > span', firstSaleDescriptorImage: '.vn-popover.shown vn-item-descriptor img', itemDescriptorPopover: '.vn-popover.shown vn-item-descriptor', @@ -542,45 +542,45 @@ export default { firstActionTicketDescriptor: '.vn-popover.shown vn-ticket-descriptor' }, claimBasicData: { - claimStateAutocomplete: 'vn-claim-basic-data vn-autocomplete[field="$ctrl.claim.claimStateFk"]', + claimStateAutocomplete: 'vn-claim-basic-data vn-autocomplete[ng-model="$ctrl.claim.claimStateFk"]', responsabilityInputRange: 'vn-input-range', - observationInput: 'vn-textarea[field="$ctrl.claim.observation"] textarea', + observationInput: 'vn-textarea[ng-model="$ctrl.claim.observation"] textarea', saveButton: `${components.vnSubmit}` }, claimDetail: { secondItemDiscount: 'vn-claim-detail > vn-vertical > vn-card > div > vn-vertical > vn-table > div > vn-tbody > vn-tr:nth-child(2) > vn-td:nth-child(6) > span', - discountInput: '.vn-popover.shown vn-input-number[field="$ctrl.newDiscount"] > div > div > div.infix > input', + discountInput: '.vn-popover.shown vn-input-number[ng-model="$ctrl.newDiscount"] > div > div > div.infix > input', discoutPopoverMana: '.vn-popover.shown .content > div > vn-horizontal > h5', addItemButton: 'vn-claim-detail a vn-float-button', firstClaimableSaleFromTicket: 'vn-claim-detail > vn-dialog vn-tbody > vn-tr', claimDetailLine: 'vn-claim-detail > vn-vertical > vn-card > div > vn-vertical > vn-table > div > vn-tbody > vn-tr', - firstItemQuantityInput: 'vn-claim-detail vn-tr:nth-child(1) vn-input-number[field="saleClaimed.quantity"] input', + firstItemQuantityInput: 'vn-claim-detail vn-tr:nth-child(1) vn-input-number[ng-model="saleClaimed.quantity"] input', totalClaimed: 'vn-claim-detail > vn-vertical > vn-card > div > vn-vertical > vn-horizontal > div > vn-label-value:nth-child(2) > section > span', secondItemDeleteButton: 'vn-claim-detail > vn-vertical > vn-card > div > vn-vertical > vn-table > div > vn-tbody > vn-tr:nth-child(2) > vn-td:nth-child(8) > vn-icon-button > button > vn-icon > i' }, claimDevelopment: { addDevelopmentButton: 'vn-claim-development > vn-vertical > vn-card > div > vn-vertical > vn-one > vn-icon-button > button > vn-icon', firstDeleteDevelopmentButton: 'vn-claim-development > vn-vertical > vn-card > div > vn-vertical > form > vn-horizontal:nth-child(2) > vn-icon-button > button > vn-icon', - firstClaimReasonAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[field="claimDevelopment.claimReasonFk"]', - firstClaimResultAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[field="claimDevelopment.claimResultFk"]', - firstClaimResponsibleAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[field="claimDevelopment.claimResponsibleFk"]', - firstClaimWorkerAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[field="claimDevelopment.workerFk"]', - firstClaimRedeliveryAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[field="claimDevelopment.claimRedeliveryFk"]', - secondClaimReasonAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[field="claimDevelopment.claimReasonFk"]', - secondClaimResultAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[field="claimDevelopment.claimResultFk"]', - secondClaimResponsibleAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[field="claimDevelopment.claimResponsibleFk"]', - secondClaimWorkerAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[field="claimDevelopment.workerFk"]', - secondClaimRedeliveryAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[field="claimDevelopment.claimRedeliveryFk"]', + firstClaimReasonAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[ng-model="claimDevelopment.claimReasonFk"]', + firstClaimResultAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[ng-model="claimDevelopment.claimResultFk"]', + firstClaimResponsibleAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[ng-model="claimDevelopment.claimResponsibleFk"]', + firstClaimWorkerAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[ng-model="claimDevelopment.workerFk"]', + firstClaimRedeliveryAutocomplete: 'vn-claim-development vn-horizontal:nth-child(1) vn-autocomplete[ng-model="claimDevelopment.claimRedeliveryFk"]', + secondClaimReasonAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[ng-model="claimDevelopment.claimReasonFk"]', + secondClaimResultAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[ng-model="claimDevelopment.claimResultFk"]', + secondClaimResponsibleAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[ng-model="claimDevelopment.claimResponsibleFk"]', + secondClaimWorkerAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[ng-model="claimDevelopment.workerFk"]', + secondClaimRedeliveryAutocomplete: 'vn-claim-development vn-horizontal:nth-child(2) vn-autocomplete[ng-model="claimDevelopment.claimRedeliveryFk"]', saveDevelopmentButton: `${components.vnSubmit}` }, claimAction: { importClaimButton: 'vn-claim-action vn-button[label="Import claim"]', importTicketButton: 'vn-claim-action vn-button[label="Import ticket"]', secondImportableTicket: '.vn-popover.shown .content > div > vn-table > div > vn-tbody > vn-tr:nth-child(2)', - firstLineDestination: 'vn-claim-action vn-tr:nth-child(1) vn-autocomplete[field="saleClaimed.claimDestinationFk"]', - secondLineDestination: 'vn-claim-action vn-tr:nth-child(2) vn-autocomplete[field="saleClaimed.claimDestinationFk"]', + firstLineDestination: 'vn-claim-action vn-tr:nth-child(1) vn-autocomplete[ng-model="saleClaimed.claimDestinationFk"]', + secondLineDestination: 'vn-claim-action vn-tr:nth-child(2) vn-autocomplete[ng-model="saleClaimed.claimDestinationFk"]', firstDeleteLine: 'vn-claim-action vn-tr:nth-child(1) vn-icon-button[icon="delete"]', - isPaidWithManaCheckbox: 'vn-check[field="$ctrl.claim.isChargedToMana"]' + isPaidWithManaCheckbox: 'vn-check[ng-model="$ctrl.claim.isChargedToMana"]' }, ordersIndex: { searchResult: 'vn-order-index vn-card > div > vn-table > div > vn-tbody > a.vn-tr', @@ -606,14 +606,14 @@ export default { orderByAutocomplete: 'vn-autocomplete[label="Order by"]', plantRealmButton: 'vn-order-catalog > vn-side-menu vn-icon[icon="icon-plant"]', typeAutocomplete: 'vn-autocomplete[data="$ctrl.itemTypes"]', - itemIdInput: 'vn-order-catalog > vn-side-menu vn-catalog-filter vn-textfield[model="$ctrl.itemFk"] input', - itemTagValueInput: 'vn-order-catalog > vn-side-menu vn-catalog-filter vn-textfield[model="$ctrl.value"] input', - openTagSearch: 'vn-order-catalog > vn-side-menu > div > vn-catalog-filter > div > vn-vertical > vn-textfield[model="$ctrl.value"] > div > div > div.rightIcons > t-right-icons > i', - tagAutocomplete: 'vn-order-catalog-search-panel vn-autocomplete[field="filter.tagFk"]', - tagValueInput: 'vn-order-catalog-search-panel vn-textfield[model="filter.value"] input', + itemIdInput: 'vn-catalog-filter vn-textfield[ng-model="$ctrl.itemFk"] input', + itemTagValueInput: 'vn-catalog-filter vn-textfield[ng-model="$ctrl.value"] input', + openTagSearch: 'vn-catalog-filter > div > vn-vertical > vn-textfield[ng-model="$ctrl.value"] .append > i', + tagAutocomplete: 'vn-order-catalog-search-panel vn-autocomplete[ng-model="filter.tagFk"]', + tagValueInput: 'vn-order-catalog-search-panel vn-textfield[ng-model="filter.value"] input', searchTagButton: 'vn-order-catalog-search-panel > div > form > vn-horizontal:nth-child(3) > vn-submit > input', - thirdFilterRemoveButton: 'vn-order-catalog > vn-side-menu vn-catalog-filter > div > vn-horizontal.chips > vn-chip:nth-child(3) button', - fourthFilterRemoveButton: 'vn-order-catalog > vn-side-menu vn-catalog-filter > div > vn-horizontal.chips > vn-chip:nth-child(4) button', + thirdFilterRemoveButton: 'vn-catalog-filter > div > vn-horizontal.chips > vn-chip:nth-child(3) button', + fourthFilterRemoveButton: 'vn-catalog-filter > div > vn-horizontal.chips > vn-chip:nth-child(4) button', }, orderBasicData: { clientAutocomplete: 'vn-autocomplete[label="Client"]', @@ -633,11 +633,11 @@ export default { addNewRouteButton: 'vn-route-index > a[ui-sref="route.create"]' }, createRouteView: { - workerAutocomplete: 'vn-route-create vn-autocomplete[field="$ctrl.route.workerFk"]', - createdDatePicker: 'vn-route-create vn-date-picker[field="$ctrl.route.created"]', - vehicleAutoComplete: 'vn-route-create vn-autocomplete[field="$ctrl.route.vehicleFk"]', - agencyAutoComplete: 'vn-route-create vn-autocomplete[field="$ctrl.route.agencyModeFk"]', - descriptionInput: 'vn-route-create vn-textfield[field="$ctrl.route.description"] input', + workerAutocomplete: 'vn-route-create vn-autocomplete[ng-model="$ctrl.route.workerFk"]', + createdDatePicker: 'vn-route-create vn-date-picker[ng-model="$ctrl.route.created"]', + vehicleAutoComplete: 'vn-route-create vn-autocomplete[ng-model="$ctrl.route.vehicleFk"]', + agencyAutoComplete: 'vn-route-create vn-autocomplete[ng-model="$ctrl.route.agencyModeFk"]', + descriptionInput: 'vn-route-create vn-textfield[ng-model="$ctrl.route.description"] input', submitButton: 'vn-route-create vn-submit > input[type="submit"]' }, routeDescriptor: { @@ -647,29 +647,29 @@ export default { routeId: 'vn-route-summary > vn-card > div > vn-horizontal > vn-one:nth-child(1) > vn-label-value:nth-child(1) > section > span' }, routeBasicData: { - workerAutoComplete: 'vn-route-basic-data vn-autocomplete[field="$ctrl.route.workerFk"]', - vehicleAutoComplete: 'vn-route-basic-data vn-autocomplete[field="$ctrl.route.vehicleFk"]', - agencyAutoComplete: 'vn-route-basic-data vn-autocomplete[field="$ctrl.route.agencyModeFk"]', - kmStartInput: 'vn-route-basic-data vn-input-number[field="$ctrl.route.kmStart"] input', - kmEndInput: 'vn-route-basic-data vn-input-number[field="$ctrl.route.kmEnd"] input', - createdDateInput: 'vn-route-basic-data vn-date-picker[field="$ctrl.route.created"]', - startedHourInput: 'vn-route-basic-data vn-input-time[field="$ctrl.route.started"] input', - finishedHourInput: 'vn-route-basic-data vn-input-time[field="$ctrl.route.finished"] input', + workerAutoComplete: 'vn-route-basic-data vn-autocomplete[ng-model="$ctrl.route.workerFk"]', + vehicleAutoComplete: 'vn-route-basic-data vn-autocomplete[ng-model="$ctrl.route.vehicleFk"]', + agencyAutoComplete: 'vn-route-basic-data vn-autocomplete[ng-model="$ctrl.route.agencyModeFk"]', + kmStartInput: 'vn-route-basic-data vn-input-number[ng-model="$ctrl.route.kmStart"] input', + kmEndInput: 'vn-route-basic-data vn-input-number[ng-model="$ctrl.route.kmEnd"] input', + createdDateInput: 'vn-route-basic-data vn-date-picker[ng-model="$ctrl.route.created"]', + startedHourInput: 'vn-route-basic-data vn-input-time[ng-model="$ctrl.route.started"] input', + finishedHourInput: 'vn-route-basic-data vn-input-time[ng-model="$ctrl.route.finished"] input', saveButton: 'vn-route-basic-data vn-submit[label="Save"] input' }, routeTickets: { - firstTicketPriority: 'vn-route-tickets vn-tr:nth-child(1) vn-textfield[model="ticket.priority"] input', - secondTicketPriority: 'vn-route-tickets vn-tr:nth-child(2) vn-textfield[model="ticket.priority"] input', - thirdTicketPriority: 'vn-route-tickets vn-tr:nth-child(3) vn-textfield[model="ticket.priority"] input', - fourthTicketPriority: 'vn-route-tickets vn-tr:nth-child(4) vn-textfield[model="ticket.priority"] input', - eleventhTicketPriority: 'vn-route-tickets vn-tr:nth-child(11) vn-textfield[model="ticket.priority"] input', + firstTicketPriority: 'vn-route-tickets vn-tr:nth-child(1) vn-textfield[ng-model="ticket.priority"] input', + secondTicketPriority: 'vn-route-tickets vn-tr:nth-child(2) vn-textfield[ng-model="ticket.priority"] input', + thirdTicketPriority: 'vn-route-tickets vn-tr:nth-child(3) vn-textfield[ng-model="ticket.priority"] input', + fourthTicketPriority: 'vn-route-tickets vn-tr:nth-child(4) vn-textfield[ng-model="ticket.priority"] input', + eleventhTicketPriority: 'vn-route-tickets vn-tr:nth-child(11) vn-textfield[ng-model="ticket.priority"] input', firstTicketCheckbox: 'vn-route-tickets vn-tr:nth-child(1) vn-check', buscamanButton: 'vn-route-tickets vn-button[icon="icon-buscaman"]', firstTicketDeleteButton: 'vn-route-tickets vn-tr:nth-child(1) vn-icon[icon="delete"]', confirmButton: 'vn-route-tickets > vn-confirm button[response="ACCEPT"]' }, workerPbx: { - extensionInput: 'vn-worker-pbx vn-textfield[model="$ctrl.worker.sip.extension"] input', + extensionInput: 'vn-worker-pbx vn-textfield[ng-model="$ctrl.worker.sip.extension"] input', saveButton: 'vn-worker-pbx vn-submit[label="Save"] input' }, workerTimeControl: { diff --git a/front/core/components/autocomplete/index.html b/front/core/components/autocomplete/index.html index 90f936801..2e5cc39f6 100755 --- a/front/core/components/autocomplete/index.html +++ b/front/core/components/autocomplete/index.html @@ -1,4 +1,7 @@ -
+
@@ -7,9 +10,7 @@
+ type="button">
@@ -18,7 +19,7 @@ *
-
+
+
+ + +
diff --git a/front/core/components/autocomplete/index.js b/front/core/components/autocomplete/index.js index f57c68066..69114d028 100755 --- a/front/core/components/autocomplete/index.js +++ b/front/core/components/autocomplete/index.js @@ -209,13 +209,13 @@ export default class Autocomplete extends Field { this.field = value; } - onInputKeyDown(event) { - // if (event.defaultPrevented) return; + onContainerKeyDown(event) { + if (event.defaultPrevented) return; - switch (event.keyCode) { - case 38: // Up - case 40: // Down - case 13: // Enter + switch (event.code) { + case 'ArrowUp': + case 'ArrowDown': + case 'Enter': this.showDropDown(); break; default: @@ -228,7 +228,7 @@ export default class Autocomplete extends Field { event.preventDefault(); } - onInputMouseDown(event) { + onContainerMouseDown(event) { if (event.defaultPrevented) return; event.preventDefault(); this.showDropDown(); @@ -261,7 +261,7 @@ export default class Autocomplete extends Field { showDropDown(search) { this.assignDropdownProps(); - this.$.dropDown.show(this.input, search); + this.$.dropDown.show(this.container, search); } get fetchFunction() { diff --git a/front/core/components/autocomplete/style.scss b/front/core/components/autocomplete/style.scss index 60996553e..af45902cc 100755 --- a/front/core/components/autocomplete/style.scss +++ b/front/core/components/autocomplete/style.scss @@ -1,17 +1,23 @@ @import "effects"; vn-autocomplete.vn-field { - & > .container > .infix > .control { - overflow: hidden; + overflow: hidden; - & > input { - cursor: pointer; - text-overflow: ellipsis; - white-space: nowrap; + & > .container { + cursor: pointer; + + & > .infix > .control { overflow: hidden; - text-align: left; - padding-left: 0; - padding-right: 0; + + & > input { + cursor: pointer; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + text-align: left; + padding-left: 0; + padding-right: 0; + } } } } diff --git a/front/core/components/check/index.js b/front/core/components/check/index.js index 8ebb784f3..b9bd1bb2f 100644 --- a/front/core/components/check/index.js +++ b/front/core/components/check/index.js @@ -12,13 +12,13 @@ import './style.scss'; */ export default class Check extends Toggle { set field(value) { - this._field = value; + super.field = value; this.element.classList.toggle('checked', Boolean(value)); this.indeterminate = Boolean(value == null && this.tripleState); } get field() { - return this._field; + return super.field; } set checked(value) { diff --git a/front/core/components/date-picker/index.js b/front/core/components/date-picker/index.js index 96417f980..e46cde17e 100644 --- a/front/core/components/date-picker/index.js +++ b/front/core/components/date-picker/index.js @@ -9,8 +9,6 @@ class DatePicker extends Field { this.$translate = $translate; this.input = $compile(``)($scope)[0]; - this.control.appendChild(this.input); - this.initPicker(); } diff --git a/front/core/components/drop-down/drop-down.html b/front/core/components/drop-down/drop-down.html index d4dec9dd5..e9a37a675 100755 --- a/front/core/components/drop-down/drop-down.html +++ b/front/core/components/drop-down/drop-down.html @@ -6,10 +6,10 @@
+ placeholder="{{::'Search' | translate}}">
diff --git a/front/core/components/drop-down/drop-down.js b/front/core/components/drop-down/drop-down.js index 182ea49e0..e57de0b6d 100755 --- a/front/core/components/drop-down/drop-down.js +++ b/front/core/components/drop-down/drop-down.js @@ -106,8 +106,8 @@ export default class DropDown extends Component { */ show(parent, search) { this._activeOption = -1; - this.search = search; this.$.popover.show(parent || this.parent); + this.search = search; this.buildList(); } diff --git a/front/core/components/drop-down/style.scss b/front/core/components/drop-down/style.scss index a33186a6e..ce26c8508 100755 --- a/front/core/components/drop-down/style.scss +++ b/front/core/components/drop-down/style.scss @@ -13,18 +13,7 @@ display: block; width: 100%; box-sizing: border-box; - border: none; - font-size: inherit; - padding: .6em; - margin: 0!important; - &.not-empty label{ - display: none; - } - & .selected label { - font-size: inherit; - bottom: 2px; - color: $color-font-secondary; - } + padding: $spacing-sm; } & > vn-icon[icon=clear] { display: none; diff --git a/front/core/components/field/index.html b/front/core/components/field/index.html index 5e27c1fb3..c2e7a02c2 100644 --- a/front/core/components/field/index.html +++ b/front/core/components/field/index.html @@ -12,7 +12,7 @@ *
-
+
+
+
diff --git a/front/core/components/field/index.js b/front/core/components/field/index.js index c6cb26443..a14f21b35 100644 --- a/front/core/components/field/index.js +++ b/front/core/components/field/index.js @@ -1,8 +1,8 @@ import ngModule from '../../module'; -import Component from '../../lib/component'; +import FormInput from '../form-input'; import './style.scss'; -export default class Field extends Component { +export default class Field extends FormInput { constructor($element, $scope, $compile) { super($element, $scope); this.$compile = $compile; @@ -15,11 +15,13 @@ export default class Field extends Component { this.classList.add('vn-field'); this.element.addEventListener('click', e => this.onClick(e)); - let container = this.element.querySelector('.container'); - container.addEventListener('mousedown', e => this.onMouseDown(e)); + this.container = this.element.querySelector('.container'); + this.container.addEventListener('mousedown', e => this.onMouseDown(e)); } $onInit() { + super.$onInit(); + if (this.info) this.classList.add('has-icons'); this.input.addEventListener('focus', () => this.onFocus(true)); @@ -27,24 +29,26 @@ export default class Field extends Component { this.input.addEventListener('change', e => { this.emit('change', {event: e}); }); - - // XXX: Compatibility with old inputs - let attrs = this.$element[0].attributes; - if (!this.name && attrs.field) { - let split = attrs.field.nodeValue.split('.'); - this.name = split[split.length - 1]; - } } set field(value) { - this._field = value; + super.field = value; this.classList.toggle('not-empty', value != null && value !== ''); - if (this.form) this.form.$setDirty(); this.validateValue(); } get field() { - return this._field; + return super.field; + } + + set input(value) { + if (this.input) this.control.removeChild(this.input); + this._input = value; + this.control.appendChild(value); + } + + get input() { + return this._input; } set value(value) { @@ -71,6 +75,22 @@ export default class Field extends Component { return this.input.name; } + set placeholder(value) { + this.input.placeholder = value; + } + + get placeholder() { + return this.input.placeholder; + } + + set tabIndex(value) { + this.input.tabIndex = value; + } + + get tabIndex() { + return this.input.tabIndex; + } + set disabled(value) { this._disabled = boolTag(value); this.input.disabled = this._disabled; @@ -185,9 +205,9 @@ export default class Field extends Component { } buildInput(type) { - let template = ``; + let template = ``; this.input = this.$compile(template)(this.$)[0]; - this.control.appendChild(this.input); + this.type = type; } /** @@ -209,23 +229,18 @@ ngModule.vnComponent('vnField', { }, controller: Field, bindings: { - field: '=?', - label: '@?', - name: '@?', type: '@?', + placeholder: '@?', value: '=?', info: '@?', - disabled: ' .infix { position: relative; @@ -50,36 +49,40 @@ & > .control { height: 100%; flex: auto; - } - & > .control > input { - padding-top: 24px; - padding-bottom: 8px; - height: inherit; - outline: none; - border: none; - font-family: Arial, sans-serif; - display: block; - font-size: $input-font-size; - width: 100%; - background: 0; - color: inherit; - box-sizing: border-box; - &[type=time], - &[type=date] { - clip-path: inset(0 20px 0 0); - } - &[type=number] { - -moz-appearance: textfield; - - &::-webkit-outer-spin-button, - &::-webkit-inner-spin-button { - -webkit-appearance: none; - margin: 0; + & > * { + padding-top: 24px; + padding-bottom: 8px; + height: inherit; + outline: none; + border: none; + font-family: Arial, sans-serif; + display: block; + font-size: $input-font-size; + width: 100%; + background: 0; + color: inherit; + box-sizing: border-box; + min-height: 56px; + + &[type=time], + &[type=date] { + clip-path: inset(0 20px 0 0); + opacity: 0; + transition: opacity 200ms ease-in-out; + } + &[type=number] { + -moz-appearance: textfield; + + &::-webkit-outer-spin-button, + &::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } + } + &:invalid { + box-shadow: none; } - } - &:invalid { - box-shadow: none; } } } @@ -102,14 +105,16 @@ & > .prepend > prepend { padding-right: 12px; } - & > .append > append { - padding-left: 12px; - } - & > .icons > vn-icon { - cursor: pointer; - } - & > .icons > vn-icon[icon=clear] { - display: none; + & > .icons { + &.pre { + padding-left: 12px; + } + & > vn-icon { + cursor: pointer; + } + & > vn-icon[icon=clear] { + display: none; + } } & > .underline { position: absolute; @@ -133,29 +138,56 @@ } } } - &.not-empty > .container, - &.focused > .container, - &.invalid > .container { - & > .infix { - & > .fix { - opacity: 1; + &.dense { + & > .hint { + display: none; + } + & > .container > .infix { + & > label { + top: 8px; } + & > .control > * { + padding-top: 8px; + min-height: 40px; + } + } + &.not-empty, + &.focused, + &.invalid { + & > .container > .infix > label { + top: 0; + line-height: 8px; + } + } + } + &.not-empty, + &.focused, + &.invalid { + & > .container > .infix { & > label { top: 5px; color: $color-main; padding: 0; font-size: 12px; } + & > .control > * { + &[type=time], + &[type=date] { + opacity: 1; + } + } } } &.has-icons, &.not-empty:hover, &.not-empty.focused { - & > .container > .append > append { - padding-left: 0; - } - & > .container > .icons { - padding-left: 12px; + & > .container { + & > .append > append { + padding-left: 0; + } + & > .icons.pre { + padding-left: 12px; + } } } &:not(.disabled):not(.readonly) { @@ -173,14 +205,8 @@ } } } - &:not(.not-empty):not(.focused) > .container > .infix > .control > input { - &[type=time], - &[type=date] { - opacity: 0; - } - } &.readonly > .container { - & > .infix > .control > input { + & > .infix > .control > * { caret-color: transparent; } & > .underline.blur { @@ -189,11 +215,11 @@ } & > .hint { z-index: -1; - padding-top: 8px; - height: 20px; + padding: 4px 0; + height: 12px; color: rgba(0, 0, 0, .4); font-size: 12px; - transform: translateY(-15px); + transform: translateY(-12px); transition-property: opacity, transform, color; transition-duration: 200ms; transition-timing-function: ease-in-out; @@ -223,8 +249,3 @@ } } } -vn-table { - .vn-field { - margin: 0; - } -} diff --git a/front/core/components/form-input/index.js b/front/core/components/form-input/index.js new file mode 100644 index 000000000..74d98079c --- /dev/null +++ b/front/core/components/form-input/index.js @@ -0,0 +1,58 @@ +import ngModule from '../../module'; +import Component from '../../lib/component'; + +/** + * Base component for form inputs. + * + * @property {String} label Label to display along the component + * @property {any} field The value with which the element is linked + * @property {Boolean} disabled Put component in disabled mode + */ +export default class FormInput extends Component { + $onInit() { + // XXX: Compatibility with old inputs + let attrs = this.$element[0].attributes; + if (!this.name && attrs['ng-model']) { + let split = attrs['ng-model'].nodeValue.split('.'); + this.name = split[split.length - 1]; + } + + if (!this.ngModel) return; + this.ngModel.$render = () => { + this.field = this.ngModel.$viewValue; + }; + } + + set field(value) { + this._field = value; + + if (this.ngModel) + this.ngModel.$setViewValue(value); + } + + get field() { + return this._field; + } + + set name(value) { + this.element.setAttribute('name', value); + } + + get name() { + return this.element.getAttribute('name'); + } +} + +ngModule.vnComponent('vnFormInput', { + controller: FormInput, + bindings: { + label: '@?', + field: '=?', + name: '@?', + disabled: ' { beforeEach(angular.mock.inject(($componentController, $rootScope) => { $scope = $rootScope.$new(); $attrs = {field: '$ctrl.dms.file'}; - $element = angular.element('
'); + $element = angular.element('
'); controller = $componentController('vnInputFile', {$element, $scope, $attrs, $timeout, $transclude: () => {}}); controller.input = $element[0].querySelector('input'); controller.validate = () => {}; diff --git a/front/core/components/input-file/style.scss b/front/core/components/input-file/style.scss index 83a66a262..c5dd8922b 100644 --- a/front/core/components/input-file/style.scss +++ b/front/core/components/input-file/style.scss @@ -1,8 +1,6 @@ @import "variables"; -@import '../textfield/style.scss'; vn-input-file { - @extend vn-textfield; .value { color: $color-font-secondary; cursor: pointer; @@ -12,4 +10,156 @@ vn-input-file { input { display: none !important } + margin: 20px 0; + display: inline-block; + width: 100%; + + & > .container { + width: 100%; + position: relative; + padding-bottom: 2px; + display: flex; + + & > .textField { + width: 100%; + display: flex; + align-items: center; + position: relative; + padding-top: 4px; + } + } + + .leftIcons, .rightIcons, .suffix { + display: flex; + color: $color-font-secondary; + + .material-icons { + font-size: 20px !important + } + } + + .suffix vn-icon-button { + padding: 0 + } + + t-left-icons { + padding-right: 0.5em + } + + t-right-icons { + padding-left: 0.5em + } + + .infix { + position: relative; + display: block; + flex: auto; + width: 100%; + min-width: 0; + } + i.clear { + visibility: hidden; + cursor: pointer; + outline: 0; + + &:hover { + color: #222; + } + } + &:hover i.clear { + visibility: visible; + } + i.visible { + visibility: visible; + } + label { + position: absolute; + bottom: 0; + left: 0; + padding: 4px 0!important; + pointer-events: none; + color: $color-font-secondary; + transition-duration: .2s; + transition-timing-function: cubic-bezier(.4,0,.2,1); + } + &.not-empty label{ + bottom: 24px; + color: $color-main; + padding: 0; + font-size: 12px; + } + input { + outline: none; + border: none; + font-family: "Helvetica", "Arial", sans-serif; + display: block; + font-size: 16px; + width: 100%; + background: 0 0; + color: inherit; + padding: 4px; + box-sizing: border-box; + border-bottom: 0!important; + + &[type=number] { + -moz-appearance: textfield; + &::-webkit-outer-spin-button, + &::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } + } + &:invalid { + box-shadow: none; + } + } + .underline { + position: absolute; + bottom: 0; + height: 1px; + content: ' '; + pointer-events: none; + width: 100%; + background-color: $color-input-underline; + } + .selected.underline { + background-color: $color-main; + height: 2px; + left: 50%; + width: 0px !important; + transition-duration: 0.2s; + transition-timing-function: cubic-bezier(.4,0,.2,1); + } + + div.selected { + &.container{ + border-bottom: 0px; + } + label { + bottom: 24px; + color: $color-main; + font-size: 12px; + } + .selected.underline{ + left: 0; + width: 100%!important; + } + } + & > div.container > div.textField > div.infix.invalid { + @extend div.selected; + + & > span.mdl-textfield__error { + visibility: visible; + } + & > label { + color: #d50000; + } + } + .infix.invalid + .underline { + background-color: #d50000; + } + + label span:nth-child(2) { + color: $color-alert + } } \ No newline at end of file diff --git a/front/core/components/input-number/index.html b/front/core/components/input-number/index.html index 063aa0d56..ee6f50397 100644 --- a/front/core/components/input-number/index.html +++ b/front/core/components/input-number/index.html @@ -12,12 +12,23 @@ *
-
+
+ + +
+
+
+
- - -
-
diff --git a/front/core/components/input-number/index.js b/front/core/components/input-number/index.js index 970791d58..3ace0a016 100644 --- a/front/core/components/input-number/index.js +++ b/front/core/components/input-number/index.js @@ -78,7 +78,6 @@ export default class InputNumber extends Field { this.input.dispatchEvent(new Event('change')); } } -InputNumber.$inject = ['$element', '$scope', '$compile']; ngModule.vnComponent('vnInputNumber', { template: require('./index.html'), diff --git a/front/core/components/input-time/index.js b/front/core/components/input-time/index.js index 5d419f882..9c6ae0e4a 100644 --- a/front/core/components/input-time/index.js +++ b/front/core/components/input-time/index.js @@ -8,7 +8,6 @@ export default class InputTime extends Field { this.input = $compile(``)($scope)[0]; this.input.addEventListener('change', () => this.onValueUpdate()); - this.control.appendChild(this.input); } get field() { diff --git a/front/core/components/multi-check/multi-check.html b/front/core/components/multi-check/multi-check.html index c09fd246c..86c35d6d0 100644 --- a/front/core/components/multi-check/multi-check.html +++ b/front/core/components/multi-check/multi-check.html @@ -1,5 +1,5 @@ \ No newline at end of file diff --git a/front/core/components/popover/popover.js b/front/core/components/popover/popover.js index c76af3b44..af6edb79a 100644 --- a/front/core/components/popover/popover.js +++ b/front/core/components/popover/popover.js @@ -188,8 +188,9 @@ export default class Popover extends Component { } onBgMouseDown(event) { - if (event != this.lastMouseEvent) - this.hide(); + if (event == this.lastMouseEvent || event.defaultPrevented) return; + event.preventDefault(); + this.hide(); } } Popover.$inject = ['$element', '$scope', '$timeout', '$transitions', '$transclude', '$compile']; diff --git a/front/core/components/radio/index.js b/front/core/components/radio/index.js index be7c086a9..019668330 100644 --- a/front/core/components/radio/index.js +++ b/front/core/components/radio/index.js @@ -10,13 +10,13 @@ import './style.scss'; */ export default class Radio extends Toggle { set field(value) { - this._field = value; + super.field = value; this.element.classList.toggle('checked', Boolean(value) && value == this.val); } get field() { - return this._field; + return super.field; } set checked(value) { diff --git a/front/core/components/searchbar/searchbar.html b/front/core/components/searchbar/searchbar.html index d06c4247d..c231b9752 100644 --- a/front/core/components/searchbar/searchbar.html +++ b/front/core/components/searchbar/searchbar.html @@ -1,29 +1,30 @@
- - - - - - - - + + + + + + - - - - - - + + + + +
form > vn-horizontal > vn-icon-button { - color: black; - } } .search-panel { diff --git a/front/core/components/textarea/index.js b/front/core/components/textarea/index.js new file mode 100644 index 000000000..fc0834566 --- /dev/null +++ b/front/core/components/textarea/index.js @@ -0,0 +1,26 @@ +import ngModule from '../../module'; +import Field from '../field'; + +export default class Textarea extends Field { + constructor($element, $scope, $compile) { + super($element, $scope, $compile); + + let html = ``; + this.input = $compile(html)($scope)[0]; + } + + set rows(value) { + this.input.rows = typeof value == 'number' && value > 0 ? value : 3; + } + + get rows() { + return this.input.rows; + } +} + +ngModule.vnComponent('vnTextarea', { + controller: Textarea, + bindings: { + rows: ' { + let $element; + let $ctrl; + + beforeEach(angular.mock.module('vnCore', $translateProvider => { + $translateProvider.translations('en', {}); + })); + + beforeEach(angular.mock.inject(($compile, $rootScope) => { + $element = $compile(``)($rootScope); + $ctrl = $element.controller('vnTextarea'); + })); + + afterEach(() => { + $element.remove(); + }); + + describe('rows() setter', () => { + it(`should set rows property of the element to the given value if it's a valid number`, () => { + $ctrl.rows = 27; + + expect($ctrl.rows).toEqual(27); + }); + + it(`should set rows property of the element to 3 if the given value if it's null`, () => { + $ctrl.rows = null; + + expect($ctrl.rows).toEqual(3); + }); + + it(`should set rows property of the element to 3 if the given value if it's not a valid number`, () => { + $ctrl.rows = 'a'; + + expect($ctrl.rows).toEqual(3); + }); + }); +}); diff --git a/front/core/components/textarea/style.scss b/front/core/components/textarea/style.scss deleted file mode 100644 index 2f6b521b3..000000000 --- a/front/core/components/textarea/style.scss +++ /dev/null @@ -1,24 +0,0 @@ -@import "variables"; - -vn-textarea { - & > .mdl-textfield { - width: initial; - display: block; - } - label { - position: absolute; - bottom: 0; - pointer-events: none; - color: $color-font-secondary; - transition-duration: .2s; - transition-timing-function: cubic-bezier(.4,0,.2,1); - } - & textarea.ng-not-empty+label.placeholder{ - top: 5px; - color: $color-main; - padding: 0; - font-size: 12px; - visibility: visible!important; - content: normal!important; - } -} \ No newline at end of file diff --git a/front/core/components/textarea/textarea.html b/front/core/components/textarea/textarea.html deleted file mode 100644 index 6efe39f7a..000000000 --- a/front/core/components/textarea/textarea.html +++ /dev/null @@ -1,9 +0,0 @@ -
- - -
diff --git a/front/core/components/textarea/textarea.js b/front/core/components/textarea/textarea.js deleted file mode 100644 index 9b30546c3..000000000 --- a/front/core/components/textarea/textarea.js +++ /dev/null @@ -1,43 +0,0 @@ -import ngModule from '../../module'; -import './style.scss'; - -export default class Textarea { - constructor($element, $scope, $attrs, vnTemplate) { - this.$ = $scope; - this.$attrs = $attrs; - this.element = $element; - vnTemplate.normalizeInputAttrs($attrs); - this.textarea = this.element[0].querySelector('textarea'); - this.rows = null; - } - set model(value) { - this._model = value; - this.mdlUpdate(); - } - set rows(value) { - this.textarea.rows = value ? value : 3; - } - get model() { - return this._model; - } - mdlUpdate() { - let mdlField = this.element[0].firstChild.MaterialTextfield; - if (mdlField) - mdlField.updateClasses_(); - componentHandler.upgradeElement(this.element[0].firstChild); - } -} -Textarea.$inject = ['$element', '$scope', '$attrs', 'vnTemplate']; - -ngModule.component('vnTextarea', { - template: require('./textarea.html'), - controller: Textarea, - bindings: { - model: '=model', - label: '@?', - rows: '@?', - name: '@?', - disabled: ' { - let $scope; - let $attrs; - let $element; - let controller; - - beforeEach(angular.mock.module('vnCore', $translateProvider => { - $translateProvider.translations('en', {}); - })); - - beforeEach(angular.mock.inject(($componentController, $rootScope) => { - $scope = $rootScope.$new(); - $attrs = {field: '$ctrl.claim.observation'}; - $element = angular.element('