From 457034daad102e5ae94e9d728c396dfae21c3abd Mon Sep 17 00:00:00 2001 From: Juan Ferrer Toribio Date: Fri, 18 Oct 2019 21:36:30 +0200 Subject: [PATCH 1/7] Tests fixed --- e2e/helpers/components_selectors.js | 6 - e2e/helpers/extensions.js | 44 +++-- e2e/helpers/selectors.js | 179 +++++++++--------- e2e/paths/01-login/01_login.spec.js | 29 +-- .../03_edit_fiscal_data.spec.js | 4 +- .../12_lock_of_verified_data.spec.js | 4 +- .../05-ticket-module/13_services.spec.js | 4 +- e2e/paths/07-order-module/02_catalog.spec.js | 2 +- .../01_descriptor.spec.js | 2 +- .../components/button-menu/button-menu.html | 13 -- front/core/components/button-menu/index.html | 20 ++ .../button-menu/{button-menu.js => index.js} | 22 +-- .../{button-menu.spec.js => index.spec.js} | 0 front/core/components/button-menu/style.scss | 16 -- front/core/components/button/button.html | 6 - front/core/components/button/button.js | 34 ---- front/core/components/button/index.html | 11 ++ front/core/components/button/index.js | 46 +++++ front/core/components/button/style.scss | 86 ++++++++- front/core/components/card/card.js | 2 +- front/core/components/chip/index.html | 15 +- front/core/components/chip/index.js | 15 +- front/core/components/chip/index.spec.js | 12 +- front/core/components/chip/style.scss | 53 +++++- front/core/components/color-legend/index.html | 8 - front/core/components/color-legend/index.js | 24 --- front/core/components/color-legend/style.scss | 13 -- front/core/components/field/index.js | 48 +---- front/core/components/field/style.scss | 4 +- .../components/float-button/float-button.html | 3 - .../components/float-button/float-button.js | 8 - front/core/components/float-button/index.js | 13 ++ front/core/components/form-input/index.js | 54 +++++- .../components/icon-button/icon-button.html | 3 - .../components/icon-button/icon-button.js | 39 ---- front/core/components/icon-button/index.js | 14 ++ front/core/components/icon-button/style.scss | 25 +-- .../icon-focusable/icon-focusable.html | 1 - .../icon-focusable/icon-focusable.js | 29 --- .../core/components/icon-focusable/style.scss | 10 - .../core/components/icon-menu/icon-menu.html | 11 -- front/core/components/icon-menu/icon-menu.js | 41 ---- front/core/components/icon-menu/index.html | 11 ++ front/core/components/icon-menu/index.js | 14 ++ front/core/components/icon-menu/style.scss | 8 - front/core/components/index.js | 15 +- front/core/components/input-file/index.html | 83 ++++---- front/core/components/input-file/index.js | 26 +-- front/core/components/input-file/style.scss | 156 +-------------- front/core/components/input-range/index.html | 9 - front/core/components/input-range/index.js | 79 -------- front/core/components/input-range/style.scss | 14 -- front/core/components/list/style.scss | 3 +- .../components/multi-check/multi-check.js | 4 +- front/core/components/range/index.html | 4 + front/core/components/range/index.js | 50 +++++ front/core/components/range/style.scss | 84 ++++++++ .../core/components/scroll-up/scroll-up.html | 9 +- front/core/components/scroll-up/style.scss | 4 +- front/core/components/searchbar/style.scss | 1 + front/core/components/spinner/spinner.html | 12 +- front/core/components/spinner/spinner.js | 11 +- front/core/components/spinner/spinner.spec.js | 36 ++-- front/core/components/spinner/style.css | 3 - front/core/components/spinner/style.scss | 60 ++++++ front/core/components/step-control/style.scss | 6 - front/core/components/submit/index.js | 13 ++ front/core/components/submit/submit.html | 6 - front/core/components/submit/submit.js | 25 --- front/core/components/td-editable/index.js | 4 +- front/core/components/toggle/index.js | 13 +- front/core/components/toggle/style.scss | 3 + front/core/components/tooltip/tooltip.js | 2 +- front/core/directives/acl.js | 113 +++-------- front/core/directives/specs/acl.spec.js | 105 +++++++--- front/core/lib/input.js | 42 ---- front/core/module.js | 4 +- front/core/styles/background.scss | 6 + front/core/styles/font-family.scss | 23 +++ front/core/styles/global.scss | 40 ++++ front/core/styles/index.js | 3 +- front/core/styles/mdl-override.scss | 61 ------ front/core/styles/text.scss | 2 - front/core/styles/util.scss | 6 + front/core/styles/variables.scss | 2 + front/core/vendor.js | 7 +- front/package-lock.json | 41 ---- front/package.json | 6 - front/salix/components/app/style.scss | 41 ---- front/salix/components/descriptor/index.html | 24 +++ front/salix/components/descriptor/index.js | 11 ++ front/salix/components/descriptor/style.scss | 23 +-- front/salix/components/home/home.html | 2 +- front/salix/components/index.js | 14 +- front/salix/components/login/login.html | 2 - front/salix/components/main-menu/style.scss | 12 +- front/salix/components/summary/style.scss | 4 +- front/salix/styles/misc.scss | 70 ++++--- modules/agency/front/index/index.html | 3 +- modules/claim/front/action/index.html | 8 +- modules/claim/front/descriptor/index.html | 29 +-- modules/claim/front/dms/index/index.html | 11 +- modules/claim/front/summary/index.html | 8 +- .../client/front/address/create/index.html | 8 +- modules/client/front/basic-data/index.html | 130 +++++++------ .../insurance/create/index.html | 8 +- modules/client/front/descriptor/index.html | 29 +-- .../invoiceOut/front/descriptor/index.html | 21 +- modules/item/front/create/index.html | 14 +- modules/item/front/descriptor/index.html | 29 +-- modules/item/front/index/index.html | 3 +- modules/item/front/index/style.scss | 11 -- modules/item/front/last-entries/style.scss | 4 - modules/item/front/search-panel/index.js | 6 +- modules/order/front/descriptor/index.html | 29 +-- modules/order/front/filter/index.html | 19 +- modules/order/front/filter/style.scss | 4 +- modules/order/front/prices-popover/index.html | 35 +--- modules/route/front/descriptor/index.html | 29 +-- modules/ticket/front/descriptor/index.html | 38 +--- modules/ticket/front/index/index.html | 2 +- modules/ticket/front/index/style.scss | 13 -- modules/ticket/front/sale/index.html | 2 - modules/ticket/front/sale/style.scss | 7 - modules/ticket/front/services/index.html | 17 +- modules/ticket/front/services/index.js | 3 +- modules/ticket/front/services/index.spec.js | 2 +- modules/ticket/front/summary/index.html | 2 + modules/worker/front/calendar/index.html | 9 +- modules/worker/front/descriptor/index.html | 8 +- modules/worker/front/index/index.html | 3 +- modules/worker/front/index/index.js | 1 - modules/worker/front/index/style.scss | 11 -- 133 files changed, 1259 insertions(+), 1702 deletions(-) delete mode 100644 e2e/helpers/components_selectors.js delete mode 100644 front/core/components/button-menu/button-menu.html create mode 100644 front/core/components/button-menu/index.html rename front/core/components/button-menu/{button-menu.js => index.js} (83%) rename front/core/components/button-menu/{button-menu.spec.js => index.spec.js} (100%) delete mode 100644 front/core/components/button/button.html delete mode 100644 front/core/components/button/button.js create mode 100644 front/core/components/button/index.html create mode 100644 front/core/components/button/index.js delete mode 100644 front/core/components/color-legend/index.html delete mode 100644 front/core/components/color-legend/index.js delete mode 100644 front/core/components/color-legend/style.scss delete mode 100644 front/core/components/float-button/float-button.html delete mode 100644 front/core/components/float-button/float-button.js create mode 100644 front/core/components/float-button/index.js delete mode 100644 front/core/components/icon-button/icon-button.html delete mode 100644 front/core/components/icon-button/icon-button.js create mode 100644 front/core/components/icon-button/index.js delete mode 100644 front/core/components/icon-focusable/icon-focusable.html delete mode 100644 front/core/components/icon-focusable/icon-focusable.js delete mode 100644 front/core/components/icon-focusable/style.scss delete mode 100644 front/core/components/icon-menu/icon-menu.html delete mode 100644 front/core/components/icon-menu/icon-menu.js create mode 100644 front/core/components/icon-menu/index.html create mode 100644 front/core/components/icon-menu/index.js delete mode 100644 front/core/components/icon-menu/style.scss delete mode 100644 front/core/components/input-range/index.html delete mode 100644 front/core/components/input-range/index.js delete mode 100644 front/core/components/input-range/style.scss create mode 100644 front/core/components/range/index.html create mode 100644 front/core/components/range/index.js create mode 100644 front/core/components/range/style.scss delete mode 100644 front/core/components/spinner/style.css create mode 100644 front/core/components/spinner/style.scss create mode 100644 front/core/components/submit/index.js delete mode 100644 front/core/components/submit/submit.html delete mode 100644 front/core/components/submit/submit.js delete mode 100644 front/core/lib/input.js create mode 100644 front/core/styles/global.scss delete mode 100644 front/core/styles/mdl-override.scss create mode 100644 front/core/styles/util.scss create mode 100644 front/salix/components/descriptor/index.html delete mode 100644 modules/worker/front/index/style.scss diff --git a/e2e/helpers/components_selectors.js b/e2e/helpers/components_selectors.js deleted file mode 100644 index 3e2715ba2..000000000 --- a/e2e/helpers/components_selectors.js +++ /dev/null @@ -1,6 +0,0 @@ -export default { - vnTextfield: 'vn-textfield input', - vnInputNumber: 'vn-input-number input', - vnSubmit: 'vn-submit > input', - vnFloatButton: 'vn-float-button > button' -}; diff --git a/e2e/helpers/extensions.js b/e2e/helpers/extensions.js index ee964b534..4148a4a05 100644 --- a/e2e/helpers/extensions.js +++ b/e2e/helpers/extensions.js @@ -15,6 +15,16 @@ let asyncActions = { return exists; }, + hasClass: async function(selector, className) { + return await this.evaluate((selector, className) => { + document.querySelector(selector).classList.contains(className); + }, selector, className); + }, + + parsedUrl: async function() { + return new URL(await this.url()); + }, + // Salix specific extensions changeLanguageToEnglish: async function() { @@ -28,6 +38,15 @@ let asyncActions = { await this.autocompleteSearch(langSelector, 'English'); }, + doLogin: async function(userName, password) { + if (password == null) password = 'nightmare'; + await this.wait(`vn-login [name=user]`) + .clearInput(`vn-login [name=user]`) + .write(`vn-login [name=user]`, userName) + .write(`vn-login [name=password]`, password) + .click(`vn-login button[type=submit]`); + }, + login: async function(userName) { if (currentUser !== userName) { let logoutClicked = await this.clickIfExists('#logout'); @@ -47,11 +66,7 @@ let asyncActions = { this.goto(`${config.url}/#!/login`); } - await 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]`) + await this.doLogin(userName, null) .waitForURL('#!/') .changeLanguageToEnglish(); @@ -99,6 +114,10 @@ let asyncActions = { input.value = time; input.dispatchEvent(new Event('change')); }, selector, time); + }, + + isDisabled: async function(selector) { + return await this.hasClass(selector, 'disabled'); } }; @@ -124,21 +143,6 @@ let actions = { .catch(done); }, - resetLogin: function(done) { - this.then(() => { - currentUser = undefined; - done(); - }) - .catch(done); - }, - - parsedUrl: function(done) { - this.url() - .then(url => { - done(null, new URL(url)); - }).catch(done); - }, - getProperty: function(selector, property, done) { this.evaluate_now((selector, property) => { return document.querySelector(selector)[property].replace(/\s+/g, ' ').trim(); diff --git a/e2e/helpers/selectors.js b/e2e/helpers/selectors.js index bc68f96e4..96c2fe768 100644 --- a/e2e/helpers/selectors.js +++ b/e2e/helpers/selectors.js @@ -1,4 +1,3 @@ -import components from './components_selectors.js'; export default { globalItems: { @@ -22,29 +21,29 @@ export default { acceptButton: 'vn-confirm button[response=ACCEPT]' }, clientsIndex: { - searchClientInput: `${components.vnTextfield}`, + searchClientInput: `vn-textfield input`, searchButton: 'vn-searchbar vn-icon[icon="search"]', searchResult: 'vn-client-index .vn-list-item', - createClientButton: `${components.vnFloatButton}`, + createClientButton: `vn-float-button`, othersButton: 'vn-left-menu li[name="Others"] > a' }, createClientView: { - name: `${components.vnTextfield}[name="name"]`, - taxNumber: `${components.vnTextfield}[name="fi"]`, - socialName: `${components.vnTextfield}[name="socialName"]`, - street: `${components.vnTextfield}[name="street"]`, - postcode: `${components.vnTextfield}[name="postcode"]`, - city: `${components.vnTextfield}[name="city"]`, + name: `vn-textfield input[name="name"]`, + taxNumber: `vn-textfield input[name="fi"]`, + socialName: `vn-textfield input[name="socialName"]`, + street: `vn-textfield input[name="street"]`, + postcode: `vn-textfield input[name="postcode"]`, + city: `vn-textfield input[name="city"]`, 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"]`, + userName: `vn-textfield input[name="userName"]`, + email: `vn-textfield input[name="email"]`, salesPersonAutocomplete: `vn-autocomplete[ng-model="$ctrl.client.salesPersonFk"]`, - createButton: `${components.vnSubmit}`, + createButton: `button[type=submit]`, cancelButton: 'vn-button[href="#!/client/index"]' }, clientDescriptor: { - moreMenu: 'vn-client-descriptor vn-icon-menu > div > vn-icon', + moreMenu: 'vn-client-descriptor vn-icon-menu[icon=more_vert]', simpleTicketButton: '.vn-popover.shown .vn-drop-down li' }, clientBasicData: { @@ -56,17 +55,17 @@ export default { 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}` + saveButton: `button[type=submit]` }, clientFiscalData: { fiscalDataButton: 'vn-left-menu a[ui-sref="client.card.fiscalData"]', - socialNameInput: `${components.vnTextfield}[name="socialName"]`, - fiscalIdInput: `${components.vnTextfield}[name="fi"]`, + socialNameInput: `vn-textfield input[name="socialName"]`, + fiscalIdInput: `vn-textfield input[name="fi"]`, equalizationTaxCheckbox: 'vn-check[label="Is equalizated"]', acceptPropagationButton: 'vn-client-fiscal-data > vn-confirm button[response=ACCEPT]', - addressInput: `${components.vnTextfield}[name="street"]`, - postcodeInput: `${components.vnTextfield}[name="postcode"]`, - cityInput: `${components.vnTextfield}[name="city"]`, + addressInput: `vn-textfield input[name="street"]`, + postcodeInput: `vn-textfield input[name="postcode"]`, + cityInput: `vn-textfield input[name="city"]`, provinceAutocomplete: 'vn-autocomplete[ng-model="$ctrl.client.provinceFk"]', countryAutocomplete: 'vn-autocomplete[ng-model="$ctrl.client.countryFk"]', activeCheckbox: 'vn-check[label="Active"]', @@ -76,12 +75,12 @@ export default { hasToInvoiceCheckbox: 'vn-check[label="Has to invoice"]', invoiceByMailCheckbox: 'vn-check[label="Invoice by mail"]', viesCheckbox: 'vn-check[label="Vies"]', - saveButton: `${components.vnSubmit}` + saveButton: `button[type=submit]` }, clientBillingData: { 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"]`, + IBANInput: `vn-client-billing-data vn-textfield input[name="iban"]`, + dueDayInput: `vn-client-billing-data vn-input-number input[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"]', @@ -92,20 +91,20 @@ export default { newBankEntityBIC: 'vn-client-billing-data > vn-dialog vn-textfield[label="Swift / BIC"] input', newBankEntityCode: 'vn-client-billing-data > vn-dialog vn-textfield[label="Entity Code"] input', acceptBankEntityButton: 'vn-client-billing-data > vn-dialog button[response="ACCEPT"]', - saveButton: `${components.vnSubmit}` + saveButton: `button[type=submit]` }, clientAddresses: { addressesButton: 'vn-left-menu a[ui-sref="client.card.address.index"]', - createAddress: `vn-client-address-index ${components.vnFloatButton}`, + createAddress: `vn-client-address-index vn-float-button`, defaultCheckboxInput: 'vn-check[label="Default"]', - consigneeInput: `${components.vnTextfield}[name="nickname"]`, - streetAddressInput: `${components.vnTextfield}[name="street"]`, - postcodeInput: `${components.vnTextfield}[name="postalCode"]`, - cityInput: `${components.vnTextfield}[name="city"]`, + consigneeInput: `vn-textfield input[name="nickname"]`, + streetAddressInput: `vn-textfield input[name="street"]`, + postcodeInput: `vn-textfield input[name="postalCode"]`, + cityInput: `vn-textfield input[name="city"]`, 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"]`, + phoneInput: `vn-textfield input[name="phone"]`, + mobileInput: `vn-textfield input[name="mobile"]`, defaultAddress: 'vn-client-address-index div:nth-child(1) div[name="street"]', secondMakeDefaultStar: 'vn-client-address-index vn-card div:nth-child(2) vn-icon-button[icon="star_border"]', firstEditAddress: 'vn-client-address-index div:nth-child(1) > a', @@ -117,34 +116,34 @@ export default { 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}`, + saveButton: `button[type=submit]`, cancelCreateAddressButton: 'button[ui-sref="client.card.address.index"]', cancelEditAddressButton: 'vn-client-address-edit > form > vn-button-bar > vn-button > button' }, clientWebAccess: { webAccessButton: 'vn-left-menu a[ui-sref="client.card.webAccess"]', enableWebAccessCheckbox: 'vn-check[label="Enable web access"]', - userNameInput: `${components.vnTextfield}[name="name"]`, - saveButton: `${components.vnSubmit}` + userNameInput: `vn-textfield input[name="name"]`, + saveButton: `button[type=submit]` }, clientNotes: { - addNoteFloatButton: `${components.vnFloatButton}`, + addNoteFloatButton: `vn-float-button`, noteInput: 'vn-textarea[label="Note"]', - saveButton: `${components.vnSubmit}`, + saveButton: `button[type=submit]`, firstNoteText: 'vn-client-note .text' }, clientCredit: { - addCreditFloatButton: `${components.vnFloatButton}`, - creditInput: `${components.vnInputNumber}[name="credit"]`, - saveButton: `${components.vnSubmit}`, + addCreditFloatButton: `vn-float-button`, + creditInput: `vn-input-number input[name="credit"]`, + saveButton: `button[type=submit]`, firstCreditText: 'vn-client-credit-index vn-card > div vn-table vn-tbody > vn-tr' }, clientGreuge: { - addGreugeFloatButton: `${components.vnFloatButton}`, - amountInput: `${components.vnInputNumber}[name="amount"]`, - descriptionInput: `${components.vnTextfield}[name="description"]`, + addGreugeFloatButton: `vn-float-button`, + amountInput: `vn-input-number input[name="amount"]`, + descriptionInput: `vn-textfield input[name="description"]`, typeAutocomplete: 'vn-autocomplete[ng-model="$ctrl.greuge.greugeTypeFk"]', - saveButton: `${components.vnSubmit}`, + saveButton: `button[type=submit]`, firstGreugeText: 'vn-client-greuge-index vn-card > div vn-table vn-tbody > vn-tr' }, clientMandate: { @@ -163,7 +162,7 @@ export default { clientBalance: { balanceButton: 'vn-left-menu a[ui-sref="client.card.balance.index"]', companyAutocomplete: 'vn-client-balance-index vn-autocomplete[ng-model="$ctrl.companyFk"]', - newPaymentButton: `${components.vnFloatButton}`, + newPaymentButton: `vn-float-button`, 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"]', @@ -182,7 +181,7 @@ export default { }, itemsIndex: { searchIcon: 'vn-item-index vn-searchbar vn-icon[icon="search"]', - createItemButton: `${components.vnFloatButton}`, + createItemButton: `vn-float-button`, searchResult: 'vn-item-index a.vn-tr', searchResultPreviewButton: 'vn-item-index .buttons > [icon="desktop_windows"]', searchResultCloneButton: 'vn-item-index .buttons > [icon="icon-clone"]', @@ -208,16 +207,16 @@ export default { saveFieldsButton: 'vn-item-index vn-dialog vn-horizontal:nth-child(16) > vn-button > button' }, itemCreateView: { - temporalName: `${components.vnTextfield}[name="provisionalName"]`, + temporalName: `vn-textfield input[name="provisionalName"]`, 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"]' + createButton: `button[type=submit]`, + cancelButton: 'vn-button[ui-sref="item.index"]' }, itemDescriptor: { goBackToModuleIndexButton: 'vn-item-descriptor a[href="#!/item/index"]', - moreMenu: 'vn-item-descriptor vn-icon-menu > div > vn-icon', + moreMenu: 'vn-item-descriptor vn-icon-menu[icon=more_vert]', moreMenuRegularizeButton: '.vn-popover.shown .vn-drop-down li[name="Regularize stock"]', regularizeQuantityInput: 'vn-item-descriptor vn-dialog tpl-body > div > vn-textfield input', regularizeWarehouseAutocomplete: 'vn-item-descriptor vn-dialog vn-autocomplete[ng-model="$ctrl.warehouseFk"]', @@ -238,7 +237,7 @@ export default { longNameInput: 'vn-textfield[ng-model="$ctrl.item.longName"] input', isActiveCheckbox: 'vn-check[label="Active"]', priceInKgCheckbox: 'vn-check[label="Price in kg"]', - submitBasicDataButton: `${components.vnSubmit}` + submitBasicDataButton: `button[type=submit]` }, itemTags: { goToItemIndexButton: 'vn-item-descriptor [ui-sref="item.index"]', @@ -257,19 +256,19 @@ export default { 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"]', - submitItemTagsButton: `vn-item-tags ${components.vnSubmit}` + submitItemTagsButton: `vn-item-tags button[type=submit]` }, itemTax: { undoChangesButton: 'vn-item-tax vn-button-bar > vn-button[label="Undo changes"]', 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}` + submitTaxButton: `vn-item-tax button[type=submit]` }, itemBarcodes: { addBarcodeButton: 'vn-item-barcode vn-icon[icon="add_circle"]', - thirdCodeInput: `vn-item-barcode vn-horizontal:nth-child(3) > ${components.vnTextfield}`, - submitBarcodesButton: `vn-item-barcode ${components.vnSubmit}`, + thirdCodeInput: `vn-item-barcode vn-horizontal:nth-child(3) > vn-textfield input`, + submitBarcodesButton: `vn-item-barcode button[type=submit]`, firstCodeRemoveButton: 'vn-item-barcode vn-horizontal vn-none vn-icon[icon="delete"]' }, itemNiches: { @@ -281,13 +280,13 @@ export default { 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[ng-model="niche.warehouseFk"]', thirdCodeInput: 'vn-item-niche vn-horizontal:nth-child(3) > vn-textfield[label="Code"] input', - submitNichesButton: `vn-item-niche ${components.vnSubmit}` + submitNichesButton: `vn-item-niche button[type=submit]` }, itemBotanical: { - botanicalInput: `vn-item-botanical vn-horizontal:nth-child(1) > ${components.vnTextfield}`, + botanicalInput: `vn-item-botanical vn-horizontal:nth-child(1) > vn-textfield input`, 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}` + submitBotanicalButton: `vn-item-botanical button[type=submit]` }, itemSummary: { basicData: 'vn-item-summary [name="basicData"]', @@ -330,13 +329,13 @@ export default { 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', searchResultDate: 'vn-ticket-index vn-table vn-tbody > a:nth-child(1) > vn-td:nth-child(5)', - searchTicketInput: `vn-ticket-index ${components.vnTextfield}`, - searchWeeklyTicketInput: `vn-ticket-weekly-index ${components.vnTextfield}`, + searchTicketInput: `vn-ticket-index vn-textfield input`, + searchWeeklyTicketInput: `vn-ticket-weekly-index vn-textfield input`, searchWeeklyClearInput: 'vn-ticket-weekly-index vn-searchbar vn-icon[icon=clear]', - advancedSearchButton: 'vn-ticket-search-panel vn-submit[label="Search"] input', + advancedSearchButton: 'vn-ticket-search-panel button[type=submit]', searchButton: 'vn-ticket-index vn-searchbar vn-icon[icon="search"]', 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', + moreMenu: 'vn-ticket-index vn-icon-menu[icon=more_vert]', 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[ng-model="weekly.weekDay"] input', weeklyTicket: 'vn-ticket-weekly-index vn-table > div > vn-tbody > vn-tr', @@ -349,13 +348,13 @@ export default { 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}` + createButton: `button[type=submit]` }, ticketDescriptor: { idLabelValue: 'vn-ticket-descriptor vn-label-value[label="Id"]', stateLabelValue: 'vn-ticket-descriptor vn-label-value[label="State"]', goBackToModuleIndexButton: 'vn-ticket-descriptor a[ui-sref="ticket.index"]', - moreMenu: 'vn-ticket-descriptor vn-icon-menu > div > vn-icon', + moreMenu: 'vn-ticket-descriptor vn-icon-menu[icon=more_vert]', moreMenuAddStowaway: '.vn-popover.shown .vn-drop-down li[name="Add stowaway"]', moreMenuDeleteStowawayButton: '.vn-popover.shown .vn-drop-down li[name="Remove stowaway"]', moreMenuAddToTurn: '.vn-popover.shown .vn-drop-down li[name="Add turn"]', @@ -365,7 +364,7 @@ export default { changeShippedHourDialog: 'vn-ticket-descriptor vn-dialog[vn-id="changeShippedDialog"]', changeShippedHourInput: 'vn-dialog[vn-id="changeShippedDialog"] [ng-model="$ctrl.newShipped"]', addStowawayDialogFirstTicket: 'vn-ticket-descriptor > vn-add-stowaway > vn-dialog vn-table vn-tbody vn-tr', - shipButton: 'vn-ticket-descriptor > div > div.body > div.quicklinks vn-icon[icon="icon-stowaway"]', + shipButton: 'vn-ticket-descriptor vn-icon[icon="icon-stowaway"]', thursdayButton: 'vn-ticket-descriptor > vn-dialog > div > form > div.body > tpl-body > div > vn-tool-bar > vn-button:nth-child(4)', saturdayButton: 'vn-ticket-descriptor > vn-dialog > div > form > div.body > tpl-body > div > vn-tool-bar > vn-button:nth-child(6)', closeStowawayDialog: 'vn-ticket-descriptor > vn-add-stowaway > vn-dialog > div > button[class="close"]', @@ -380,7 +379,7 @@ export default { addNoteButton: 'vn-icon[icon="add_circle"]', firstNoteTypeAutocomplete: 'vn-autocomplete[ng-model="observation.observationTypeFk"]', firstDescriptionInput: 'vn-textfield[label="Description"] input', - submitNotesButton: `${components.vnSubmit}` + submitNotesButton: `button[type=submit]` }, ticketExpedition: { expeditionButton: 'vn-left-menu a[ui-sref="ticket.card.expedition"]', @@ -395,7 +394,7 @@ export default { 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]', - savePackagesButton: `${components.vnSubmit}` + savePackagesButton: `button[type=submit]` }, ticketSales: { saleButton: 'vn-left-menu a[ui-sref="ticket.card.sale"]', @@ -460,9 +459,9 @@ export default { }, ticketTracking: { trackingButton: 'vn-left-menu a[ui-sref="ticket.card.tracking.index"]', - createStateButton: `${components.vnFloatButton}`, + createStateButton: `vn-float-button`, stateAutocomplete: 'vn-ticket-tracking-edit vn-autocomplete[ng-model="$ctrl.stateFk"]', - saveButton: `${components.vnSubmit}`, + saveButton: `button[type=submit]`, cancelButton: 'vn-ticket-tracking-edit vn-button[ui-sref="ticket.card.tracking.index"]' }, ticketBasicData: { @@ -471,8 +470,8 @@ export default { 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', + nextStepButton: 'vn-step-control .buttons > section:last-child vn-button', + finalizeButton: 'vn-step-control .buttons > section:last-child button[type=submit]', stepTwoTotalPriceDif: 'vn-ticket-basic-data-step-two > form > vn-card > div > vn-horizontal > table > tfoot > tr > td:nth-child(4)', chargesReasonAutocomplete: 'vn-autocomplete[ng-model="$ctrl.ticket.option"]', }, @@ -487,7 +486,7 @@ export default { 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)', - saveButton: 'vn-ticket-request-create > form > div > vn-button-bar > vn-submit[label="Create"] input', + saveButton: 'vn-ticket-request-create button[type=submit]', firstDescription: 'vn-ticket-request-index vn-table vn-tr:nth-child(1) > vn-td:nth-child(2)', }, @@ -499,7 +498,7 @@ 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', + firstAddDescriptionButton: 'vn-ticket-service vn-icon-button[vn-tooltip="New service type"]', 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', @@ -507,22 +506,22 @@ export default { fistDeleteServiceButton: 'vn-ticket-service form vn-horizontal:nth-child(1) vn-icon-button[icon="delete"]', 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}`, + saveServiceButton: `button[type=submit]`, saveDescriptionButton: 'vn-ticket-service > vn-dialog[vn-id="createServiceTypeDialog"] > div > form > div.buttons > tpl-buttons > button' }, createStateView: { 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}` + saveStateButton: `button[type=submit]` }, claimsIndex: { - searchClaimInput: `vn-claim-index ${components.vnTextfield}`, + searchClaimInput: `vn-claim-index vn-textfield input`, searchResult: 'vn-claim-index vn-card > div > vn-table > div > vn-tbody > a', searchButton: 'vn-claim-index vn-searchbar vn-icon[icon="search"]' }, claimDescriptor: { - moreMenu: 'vn-claim-descriptor vn-icon-menu[vn-id="more-button"]', + moreMenu: 'vn-claim-descriptor vn-icon-menu[icon=more_vert]', moreMenuDeleteClaim: '.vn-popover.shown .vn-drop-down li[name="Delete claim"]', acceptDeleteClaim: 'vn-claim-descriptor > vn-confirm[vn-id="confirm-delete-claim"] button[response="ACCEPT"]' }, @@ -541,9 +540,9 @@ export default { }, claimBasicData: { claimStateAutocomplete: 'vn-claim-basic-data vn-autocomplete[ng-model="$ctrl.claim.claimStateFk"]', - responsabilityInputRange: 'vn-input-range', + responsabilityInputRange: 'vn-range', observationInput: 'vn-textarea[ng-model="$ctrl.claim.observation"] textarea', - saveButton: `${components.vnSubmit}` + saveButton: `button[type=submit]` }, 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', @@ -569,7 +568,7 @@ export default { 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}` + saveDevelopmentButton: `button[type=submit]` }, claimAction: { importClaimButton: 'vn-claim-action vn-button[label="Import claim"]', @@ -584,9 +583,9 @@ export default { searchResult: 'vn-order-index vn-card > div > vn-table > div > vn-tbody > a.vn-tr', searchResultDate: 'vn-order-index vn-table vn-tbody > a:nth-child(1) > vn-td:nth-child(4)', searchResultAddress: 'vn-order-index vn-table vn-tbody > a:nth-child(1) > vn-td:nth-child(6)', - searchOrderInput: `vn-order-index ${components.vnTextfield}`, + searchOrderInput: `vn-order-index vn-textfield input`, searchButton: 'vn-order-index vn-searchbar vn-icon[icon="search"]', - createOrderButton: `${components.vnFloatButton}`, + createOrderButton: `vn-float-button`, }, orderDescriptor: { returnToModuleIndexButton: 'vn-order-descriptor a[ui-sref="order.index"]', @@ -597,7 +596,7 @@ export default { addressAutocomplete: 'vn-autocomplete[label="Address"]', agencyAutocomplete: 'vn-autocomplete[label="Agency"]', landedDatePicker: 'vn-date-picker[label="Landed"]', - createButton: `${components.vnSubmit}`, + createButton: `button[type=submit]`, cancelButton: 'vn-button[href="#!/client/index"]' }, orderCatalog: { @@ -609,16 +608,16 @@ export default { 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-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', + searchTagButton: 'vn-order-catalog-search-panel button[type=submit]', + thirdFilterRemoveButton: 'vn-catalog-filter .chips > vn-chip:nth-child(3) vn-icon[icon=cancel]', + fourthFilterRemoveButton: 'vn-catalog-filter .chips > vn-chip:nth-child(4) vn-icon[icon=cancel]', }, orderBasicData: { clientAutocomplete: 'vn-autocomplete[label="Client"]', addressAutocomplete: 'vn-autocomplete[label="Address"]', agencyAutocomplete: 'vn-autocomplete[label="Agency"]', observationInput: 'vn-textarea[label="Observation"] textarea', - saveButton: `${components.vnSubmit}`, + saveButton: `button[type=submit]`, acceptButton: 'vn-order-basic-data vn-confirm[vn-id="confirm"] button[response="ACCEPT"]' }, orderLine: { @@ -636,7 +635,7 @@ export default { 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"]' + submitButton: 'vn-route-create button[type=submit]' }, routeDescriptor: { volume: 'vn-route-descriptor vn-label-value[label="Volume"] > section > span' @@ -653,7 +652,7 @@ export default { 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' + saveButton: 'vn-route-basic-data button[type=submit]' }, routeTickets: { firstTicketPriority: 'vn-route-tickets vn-tr:nth-child(1) vn-textfield[ng-model="ticket.priority"] input', @@ -668,7 +667,7 @@ export default { }, workerPbx: { extensionInput: 'vn-worker-pbx vn-textfield[ng-model="$ctrl.worker.sip.extension"] input', - saveButton: 'vn-worker-pbx vn-submit[label="Save"] input' + saveButton: 'vn-worker-pbx button[type=submit]' }, workerTimeControl: { timeDialogInput: '.vn-dialog.shown [ng-model="$ctrl.newTime"]', @@ -720,12 +719,12 @@ export default { navigateBackToIndex: 'vn-worker-descriptor vn-icon[icon="chevron_left"]' }, invoiceOutIndex: { - searchInvoiceOutInput: `vn-invoice-out-index ${components.vnTextfield}`, + searchInvoiceOutInput: `vn-invoice-out-index vn-textfield input`, searchButton: 'vn-invoice-out-index vn-searchbar vn-icon[icon="search"]', searchResult: 'vn-invoice-out-index vn-card > div > vn-table > div > vn-tbody > a.vn-tr', }, invoiceOutDescriptor: { - moreMenu: 'vn-invoice-out-descriptor vn-icon-menu[vn-id="more-button"]', + moreMenu: 'vn-invoice-out-descriptor vn-icon-menu[icon=more_vert]', moreMenuDeleteInvoiceOut: '.vn-popover.shown .vn-drop-down li[name="Delete Invoice"]', moreMenuBookInvoiceOut: '.vn-popover.shown .vn-drop-down li[name="Book invoice"]', moreMenuShowInvoiceOutPdf: '.vn-popover.shown .vn-drop-down li[name="Show invoice PDF"]', diff --git a/e2e/paths/01-login/01_login.spec.js b/e2e/paths/01-login/01_login.spec.js index e5a70703e..03acc98a8 100644 --- a/e2e/paths/01-login/01_login.spec.js +++ b/e2e/paths/01-login/01_login.spec.js @@ -1,56 +1,35 @@ import createNightmare from '../../helpers/nightmare'; - describe('Login path', () => { const nightmare = createNightmare(); it('should receive an error when the username is incorrect', async() => { - const username = 'nobody'; - const password = 'nightmare'; - const result = await nightmare - .wait(`vn-login input[name=user]`) - .write(`vn-login input[name=user]`, username) - .write(`vn-login input[name=password]`, password) - .click(`vn-login input[type=submit]`) + .doLogin('badUser', null) .waitForLastSnackbar(); expect(result.length).toBeGreaterThan(0); }); it('should receive an error when the username is blank', async() => { - const password = 'nightmare'; - const result = await nightmare - .clearInput(`vn-login input[name=user]`) - .write(`vn-login input[name=password]`, password) - .click(`vn-login input[type=submit]`) + .doLogin('', null) .waitForLastSnackbar(); expect(result.length).toBeGreaterThan(0); }); it('should receive an error when the password is incorrect', async() => { - const username = 'employee'; - const password = 'badpassword'; - const result = await nightmare - .write(`vn-login input[name=user]`, username) - .write(`vn-login input[name=password]`, password) - .click(`vn-login input[type=submit]`) + .doLogin('employee', 'badPassword') .waitForLastSnackbar(); expect(result.length).toBeGreaterThan(0); }); it('should log in', async() => { - const username = 'employee'; - const password = 'nightmare'; - const url = await nightmare - .write(`vn-login input[name=user]`, username) - .write(`vn-login input[name=password]`, password) - .click(`vn-login input[type=submit]`) + .doLogin('employee', null) .wait('#logout') .parsedUrl(); diff --git a/e2e/paths/02-client-module/03_edit_fiscal_data.spec.js b/e2e/paths/02-client-module/03_edit_fiscal_data.spec.js index ae3020d2a..cbe3722de 100644 --- a/e2e/paths/02-client-module/03_edit_fiscal_data.spec.js +++ b/e2e/paths/02-client-module/03_edit_fiscal_data.spec.js @@ -42,9 +42,7 @@ describe('Client Edit fiscalData path', () => { it('should not be able to edit the verified data checkbox', async() => { const result = await nightmare .wait(selectors.clientFiscalData.verifiedDataCheckbox) - .evaluate(selector => { - return document.querySelector(selector).getAttribute('disabled'); - }, selectors.clientFiscalData.verifiedDataCheckbox); + .isDisabled(selectors.clientFiscalData.verifiedDataCheckbox); expect(result).toBeTruthy(); }); diff --git a/e2e/paths/02-client-module/12_lock_of_verified_data.spec.js b/e2e/paths/02-client-module/12_lock_of_verified_data.spec.js index 52e2db237..398185ba5 100644 --- a/e2e/paths/02-client-module/12_lock_of_verified_data.spec.js +++ b/e2e/paths/02-client-module/12_lock_of_verified_data.spec.js @@ -16,9 +16,7 @@ describe('Client lock verified data path', () => { const result = await nightmare .wait(200) .wait(selectors.clientFiscalData.verifiedDataCheckbox) - .evaluate(selector => { - return document.querySelector(selector).getAttribute('disabled'); - }, selectors.clientFiscalData.verifiedDataCheckbox); + .isDisabled(selectors.clientFiscalData.verifiedDataCheckbox); expect(result).toBeTruthy(); }); diff --git a/e2e/paths/05-ticket-module/13_services.spec.js b/e2e/paths/05-ticket-module/13_services.spec.js index 31d262778..7172ab5a6 100644 --- a/e2e/paths/05-ticket-module/13_services.spec.js +++ b/e2e/paths/05-ticket-module/13_services.spec.js @@ -17,9 +17,7 @@ describe('Ticket services path', () => { const result = await nightmare .waitToClick(selectors.ticketService.addServiceButton) .wait(selectors.ticketService.firstAddDescriptionButton) - .evaluate(selector => { - return document.querySelector(selector).disabled; - }, selectors.ticketService.firstAddDescriptionButton); + .isDisabled(selectors.ticketService.firstAddDescriptionButton); expect(result).toBeTruthy(); }); diff --git a/e2e/paths/07-order-module/02_catalog.spec.js b/e2e/paths/07-order-module/02_catalog.spec.js index d2a862958..cad95741e 100644 --- a/e2e/paths/07-order-module/02_catalog.spec.js +++ b/e2e/paths/07-order-module/02_catalog.spec.js @@ -66,7 +66,7 @@ describe('Order catalog', () => { const result = await nightmare .waitToClick(selectors.orderCatalog.fourthFilterRemoveButton) .waitToClick(selectors.orderCatalog.thirdFilterRemoveButton) - .waitForNumberOfElements('section.product', 4) + .waitForNumberOfElements('.product', 4) .countElement('section.product'); expect(result).toEqual(4); diff --git a/e2e/paths/09-invoice-out-module/01_descriptor.spec.js b/e2e/paths/09-invoice-out-module/01_descriptor.spec.js index a00d6387d..fd3516d87 100644 --- a/e2e/paths/09-invoice-out-module/01_descriptor.spec.js +++ b/e2e/paths/09-invoice-out-module/01_descriptor.spec.js @@ -1,7 +1,7 @@ import selectors from '../../helpers/selectors.js'; import createNightmare from '../../helpers/nightmare'; -describe('InvoiceOut descriptor path', () => { +fdescribe('InvoiceOut descriptor path', () => { const nightmare = createNightmare(); let bookedDate; diff --git a/front/core/components/button-menu/button-menu.html b/front/core/components/button-menu/button-menu.html deleted file mode 100644 index 5beeb12fb..000000000 --- a/front/core/components/button-menu/button-menu.html +++ /dev/null @@ -1,13 +0,0 @@ -
- - - -
\ No newline at end of file diff --git a/front/core/components/button-menu/index.html b/front/core/components/button-menu/index.html new file mode 100644 index 000000000..b0977bb93 --- /dev/null +++ b/front/core/components/button-menu/index.html @@ -0,0 +1,20 @@ + + + \ No newline at end of file diff --git a/front/core/components/button-menu/button-menu.js b/front/core/components/button-menu/index.js similarity index 83% rename from front/core/components/button-menu/button-menu.js rename to front/core/components/button-menu/index.js index 99f3879ee..d31094d36 100644 --- a/front/core/components/button-menu/button-menu.js +++ b/front/core/components/button-menu/index.js @@ -1,17 +1,13 @@ import ngModule from '../../module'; -import Input from '../../lib/input'; +import Button from '../button'; import assignProps from '../../lib/assign-props'; import './style.scss'; -export default class ButtonMenu extends Input { +export default class ButtonMenu extends Button { constructor($element, $scope, $transclude) { super($element, $scope); this.$transclude = $transclude; - this.input = this.element.querySelector('.mdl-button'); - $element.on('click', e => { - if (!this.disabled) - this.onClick(e); - }); + $element.on('click', e => this.onClick(e)); } get model() { @@ -46,6 +42,7 @@ export default class ButtonMenu extends Input { } onClick(event) { + if (this.disabled) return; if (event.defaultPrevented) return; event.preventDefault(); this.emit('open'); @@ -85,15 +82,14 @@ export default class ButtonMenu extends Input { } ButtonMenu.$inject = ['$element', '$scope', '$transclude']; -ngModule.component('vnButtonMenu', { - template: require('./button-menu.html'), +ngModule.vnComponent('vnButtonMenu', { + template: require('./index.html'), + controller: ButtonMenu, bindings: { - label: '@', showField: '@?', selection: ' - {{$ctrl.label}} - - - \ No newline at end of file diff --git a/front/core/components/button/button.js b/front/core/components/button/button.js deleted file mode 100644 index 4e5cf50a2..000000000 --- a/front/core/components/button/button.js +++ /dev/null @@ -1,34 +0,0 @@ -import ngModule from '../../module'; -import Input from '../../lib/input'; -import './style.scss'; - -export default class Button extends Input { - constructor($element) { - super($element); - this.$element = $element; - this.input = this.element.querySelector('.mdl-button'); - - $element[0].addEventListener('click', event => { - if (this.disabled) - event.stopImmediatePropagation(); - }); - } - - $onInit() { - if (!this.type) - this.type = 'button'; - } -} -Button.$inject = ['$element']; - -ngModule.component('vnButton', { - controller: Button, - template: require('./button.html'), - bindings: { - label: '@?', - disabled: ' + + {{::$ctrl.label}} + + + + \ No newline at end of file diff --git a/front/core/components/button/index.js b/front/core/components/button/index.js new file mode 100644 index 000000000..e1a86eb5d --- /dev/null +++ b/front/core/components/button/index.js @@ -0,0 +1,46 @@ +import ngModule from '../../module'; +import FormInput from '../form-input'; +import './style.scss'; + +export default class Button extends FormInput { + constructor($element, $scope) { + super($element, $scope); + this.design = 'colored'; + this.input = this.element.querySelector('button'); + + let element = this.element; + element.tabIndex = 0; + element.classList.add('vn-button'); + this.element.addEventListener('keyup', e => this.onKeyup(e)); + this.element.addEventListener('click', e => this.onClick(e)); + } + + $onInit() { + this.element.classList.add(this.design); + if (!this.type) this.type = 'button'; + } + + onKeyup(event) { + if (event.code == 'Space') + this.onClick(event); + } + + onClick(event) { + if (event.defaultPrevented) return; + // event.preventDefault(); + + // FIXME: Don't stop event propagation + if (this.disabled) event.stopImmediatePropagation(); + } +} +Button.$inject = ['$element', '$scope']; + +ngModule.vnComponent('vnButton', { + controller: Button, + template: require('./index.html'), + bindings: { + icon: '@?', + type: '@?' + } +}); + diff --git a/front/core/components/button/style.scss b/front/core/components/button/style.scss index 84bd8659a..74dcbcf9b 100644 --- a/front/core/components/button/style.scss +++ b/front/core/components/button/style.scss @@ -1,5 +1,83 @@ -vn-button { - & > button > vn-icon { - vertical-align: middle; +@import "variables"; + +.vn-button { + display: inline-flex; + align-items: center; + justify-content: center; + height: 36px; + border: none; + border-radius: .1em; + font-family: vn-font-bold; + text-transform: uppercase; + font-size: 14px; + cursor: pointer; + box-sizing: border-box; + outline: none; + + & > button { + width: 100%; + padding: 0 12px; + box-sizing: border-box; + background-color: transparent; + border: none; + height: inherit; + color: inherit; + font: inherit; + display: block; + text-transform: inherit; + cursor: inherit; + outline: none; + display: flex; + align-items: center; + justify-content: center; + + & > vn-icon { + vertical-align: middle; + color: inherit; + font-size: 1.7em; + } } -} \ No newline at end of file + &.colored { + color: white; + background-color: $color-main; + box-shadow: 0 .15em .15em 0 rgba(0, 0, 0, .3); + transition: background 200ms ease-in-out; + + &:not(.disabled) { + &:hover, + &:focus { + background-color: lighten($color-main, 10%); + } + } + } + &.flat { + color: $color-main; + background-color: transparent; + box-shadow: none; + transition: background 200ms ease-in-out; + + &:not(.disabled) { + &:hover, + &:focus { + background-color: $color-hover-cd; + } + } + } + &:hover, + &:focus { + outline: none; + } + &.round { + border-radius: 50%; + height: 3.8em; + width: 3.8em; + + & > button > span { + display: none; + } + } + &.disabled { + opacity: .7; + cursor: initial; + } +} diff --git a/front/core/components/card/card.js b/front/core/components/card/card.js index b812ccf61..a37835995 100644 --- a/front/core/components/card/card.js +++ b/front/core/components/card/card.js @@ -7,7 +7,7 @@ export default function directive() { transclude: true, template: require('./card.html'), link: function($scope, $element, $attrs, $ctrl, $transclude) { - $element.addClass('demo-card-wide mdl-shadow--2dp bg-panel'); + $element.addClass('demo-card-wide vn-shadow bg-panel'); $transclude($scope, function(clone) { angular.element($element[0].querySelector('div')).append(clone); diff --git a/front/core/components/chip/index.html b/front/core/components/chip/index.html index 8696fd8bb..38a56923d 100644 --- a/front/core/components/chip/index.html +++ b/front/core/components/chip/index.html @@ -1,8 +1,7 @@ - - - - - - \ No newline at end of file +
+ + \ No newline at end of file diff --git a/front/core/components/chip/index.js b/front/core/components/chip/index.js index b35c00cbf..6a945559b 100644 --- a/front/core/components/chip/index.js +++ b/front/core/components/chip/index.js @@ -1,17 +1,12 @@ import ngModule from '../../module'; +import Component from '../../lib/component'; import './style.scss'; -export default class Chip { - -/** - * Remove chip event - */ - remove() { - if (this.onRemove) - this.onRemove(); +export default class Chip extends Component { + onRemove() { + if (!this.disabled) this.emit('remove'); } } - Chip.$inject = ['$element', '$scope', '$transclude']; ngModule.component('vnChip', { @@ -20,6 +15,6 @@ ngModule.component('vnChip', { transclude: true, bindings: { disabled: ' { controller = $componentController('vnChip', {$element, $scope, $transclude: () => {}}); })); - describe('remove()', () => { - it(`should call onRemove()`, () => { - controller.onRemove = () => {}; - spyOn(controller, 'onRemove'); - controller.remove(); + describe('onRemove()', () => { + it(`should emit remove event`, () => { + controller.emit = () => {}; + spyOn(controller, 'emit'); + controller.onRemove(); - expect(controller.onRemove).toHaveBeenCalledWith(); + expect(controller.emit).toHaveBeenCalledWith('remove'); }); }); }); diff --git a/front/core/components/chip/style.scss b/front/core/components/chip/style.scss index 81e81589c..ee7f46848 100644 --- a/front/core/components/chip/style.scss +++ b/front/core/components/chip/style.scss @@ -1,18 +1,53 @@ @import "variables"; vn-chip { + border-radius: 16px; + background-color: $color-bg; margin: 0 0.5em 0.5em 0; + color: $color-font; + font-size: 14px; + margin: .25em; + display: inline-flex; + align-items: center; + text-overflow: ellipsis; + white-space: nowrap; + height: 28px; + padding: 0 .7em; + overflow: hidden; - .mdl-chip { - background-color: rgba($color-main, 0.9); - color: #FFF + &.colored { + background-color: $color-main; + color: $color-font-dark; } - - .mdl-chip:active { - background-color: $color-main - } - - & > vn-one > span > span { + & > div { + display: flex; + align-items: center; max-width: 100%; + height: 100%; + + & > vn-avatar { + margin-left: -0.7em; + margin-right: .4em; + } } + & > vn-icon { + margin-left: .2em; + margin-right: -0.3em; + vertical-align: middle; + opacity: .6; + cursor: pointer; + transition: opacity 250ms ease-out; + + &:hover, + &:focus { + opacity: 1; + } + } +} + +vn-avatar { + display: inline-block; + height: 28px; + width: 28px; + border-radius: 50%; } \ No newline at end of file diff --git a/front/core/components/color-legend/index.html b/front/core/components/color-legend/index.html deleted file mode 100644 index 613fb2347..000000000 --- a/front/core/components/color-legend/index.html +++ /dev/null @@ -1,8 +0,0 @@ - - - {{legend.name}} - \ No newline at end of file diff --git a/front/core/components/color-legend/index.js b/front/core/components/color-legend/index.js deleted file mode 100644 index f72a501a7..000000000 --- a/front/core/components/color-legend/index.js +++ /dev/null @@ -1,24 +0,0 @@ -import ngModule from '../../module'; -import Component from '../../lib/component'; -import './style.scss'; - -export default class Controller extends Component { - constructor($element, $scope, $attrs) { - super($element, $scope); - this.$attrs = $attrs; - } - - onClick(legend) { - this.emit('click', {legend}); - } -} - -Controller.$inject = ['$element', '$scope', '$attrs']; - -ngModule.component('vnColorLegend', { - template: require('./index.html'), - controller: Controller, - bindings: { - data: ' this.onClick(e)); @@ -43,9 +42,11 @@ export default class Field extends FormInput { } set input(value) { - if (this.input) this.control.removeChild(this.input); + if (this.input) + this.control.removeChild(this.input); this._input = value; - this.control.appendChild(value); + if (value) + this.control.appendChild(value); } get input() { @@ -69,12 +70,10 @@ export default class Field extends FormInput { } set name(value) { - // super.name = value; this.input.name = value; } get name() { - // return super.name; return this.input.name; } @@ -86,36 +85,8 @@ export default class Field extends FormInput { 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; - this.classList.toggle('disabled', this._disabled); - } - - get disabled() { - return this._disabled; - } - - set readonly(value) { - this._readonly = boolTag(value); - this.input.readOnly = this._readonly; - this.classList.toggle('readonly', this._readonly); - } - - get readonly() { - return this._readonly; - } - set required(value) { - this._required = boolTag(value); + this._required = value; let required = this.element.querySelector('.required'); display(required, this._required); } @@ -182,6 +153,10 @@ export default class Field extends FormInput { fix.innerText = text || ''; } + refreshTabIndex() { + this.input.tabIndex = this.disabled ? -1 : this.tabIndex; + } + onClick() { // if (event.defaultPrevented) return; // event.preventDefault(); @@ -252,15 +227,10 @@ ngModule.vnComponent('vnField', { suffix: '@?', hint: '@?', error: ' .hint { - z-index: -1; padding: 4px 0; height: 12px; color: rgba(0, 0, 0, .4); @@ -255,11 +254,12 @@ transition-duration: 200ms; transition-timing-function: ease-in-out; opacity: 0; + visibility: hidden; &.filled { - z-index: 0; opacity: 1; transform: translateY(0); + visibility: visible; } } &.invalid { diff --git a/front/core/components/float-button/float-button.html b/front/core/components/float-button/float-button.html deleted file mode 100644 index e74a1fce7..000000000 --- a/front/core/components/float-button/float-button.html +++ /dev/null @@ -1,3 +0,0 @@ - \ No newline at end of file diff --git a/front/core/components/float-button/float-button.js b/front/core/components/float-button/float-button.js deleted file mode 100644 index beb3dd13b..000000000 --- a/front/core/components/float-button/float-button.js +++ /dev/null @@ -1,8 +0,0 @@ -import ngModule from '../../module'; - -ngModule.component('vnFloatButton', { - template: require('./float-button.html'), - bindings: { - icon: '@' - } -}); diff --git a/front/core/components/float-button/index.js b/front/core/components/float-button/index.js new file mode 100644 index 000000000..32ada7437 --- /dev/null +++ b/front/core/components/float-button/index.js @@ -0,0 +1,13 @@ +import ngModule from '../../module'; +import Button from '../button'; + +export default class FloatButton extends Button { + constructor($element, $scope) { + super($element, $scope); + this.element.classList.add('round'); + } +} + +ngModule.vnComponent('vnFloatButton', { + controller: FloatButton +}); diff --git a/front/core/components/form-input/index.js b/front/core/components/form-input/index.js index 74d98079c..0a1297788 100644 --- a/front/core/components/form-input/index.js +++ b/front/core/components/form-input/index.js @@ -9,6 +9,11 @@ import Component from '../../lib/component'; * @property {Boolean} disabled Put component in disabled mode */ export default class FormInput extends Component { + constructor($element, $scope) { + super($element, $scope); + this.classList = this.element.classList; + } + $onInit() { // XXX: Compatibility with old inputs let attrs = this.$element[0].attributes; @@ -41,6 +46,48 @@ export default class FormInput extends Component { get name() { return this.element.getAttribute('name'); } + + set disabled(value) { + this._disabled = boolTag(value); + this.input.disabled = this._disabled; + this.classList.toggle('disabled', this._disabled); + this.refreshTabIndex(); + } + + get disabled() { + return this._disabled; + } + + set readonly(value) { + this._readonly = boolTag(value); + this.input.readOnly = this._readonly; + this.classList.toggle('readonly', this._readonly); + } + + get readonly() { + return this._readonly; + } + + set tabIndex(value) { + this._tabIndex = value; + this.refreshTabIndex(); + } + + get tabIndex() { + return this._tabIndex; + } + + select() { + this.input.select(); + } + + focus() { + this.input.focus(); + } + + refreshTabIndex() { + this.element.tabIndex = this.disabled ? -1 : this.tabIndex; + } } ngModule.vnComponent('vnFormInput', { @@ -50,9 +97,14 @@ ngModule.vnComponent('vnFormInput', { field: '=?', name: '@?', disabled: ' - - \ No newline at end of file diff --git a/front/core/components/icon-button/icon-button.js b/front/core/components/icon-button/icon-button.js deleted file mode 100644 index ba3ccae3e..000000000 --- a/front/core/components/icon-button/icon-button.js +++ /dev/null @@ -1,39 +0,0 @@ -import ngModule from '../../module'; -import './style.scss'; - -export default class IconButton { - constructor($element) { - this.element = $element[0]; - - if (this.element.getAttribute('tabindex') == null) - this.element.tabIndex = 0; - - this.element.addEventListener('keyup', e => this.onKeyup(e)); - this.element.addEventListener('click', e => this.onClick(e)); - } - - onKeyup(event) { - if (event.code == 'Space') - this.onClick(event); - } - - onClick(event) { - if (event.defaultPrevented) return; - event.preventDefault(); - - // FIXME: Don't use Event.stopPropagation() - let button = this.element.querySelector('button'); - if (this.disabled || button.disabled) - event.stopImmediatePropagation(); - } -} - -IconButton.$inject = ['$element']; -ngModule.component('vnIconButton', { - controller: IconButton, - template: require('./icon-button.html'), - bindings: { - icon: '@', - disabled: ' button { - background-color: transparent; - display: block; - color: inherit; - border: 0; - padding: 0; - font-size: inherit; - &:hover { - background-color: initial; - } - & > vn-icon { - display: block; - font-size: inherit; - } + & > button { + padding: 0 !important; + } + &:focus { + opacity: .6; } } diff --git a/front/core/components/icon-focusable/icon-focusable.html b/front/core/components/icon-focusable/icon-focusable.html deleted file mode 100644 index 4bd8ad78a..000000000 --- a/front/core/components/icon-focusable/icon-focusable.html +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/front/core/components/icon-focusable/icon-focusable.js b/front/core/components/icon-focusable/icon-focusable.js deleted file mode 100644 index 691ee570f..000000000 --- a/front/core/components/icon-focusable/icon-focusable.js +++ /dev/null @@ -1,29 +0,0 @@ -import ngModule from '../../module'; -import './style.scss'; - -export default class IconFocusable { - constructor($element) { - $element[0].tabIndex = 0; - $element.on("keyup", event => this.onKeyDown(event, $element)); - } - - onKeyDown(event, $element) { - if (event.defaultPrevented) return; - if (event.keyCode == 32 || event.keyCode == 13) { - event.preventDefault(); - $element.triggerHandler('click'); - } - } -} - -IconFocusable.$inject = ['$element']; -ngModule.component('vnIconFocusable', { - controller: IconFocusable, - template: require('./icon-focusable.html'), - bindings: { - icon: '@', - className: '@?', - enabled: ' i, - & > i.material-icons { - display: block; - font-size: inherit; - } -} \ No newline at end of file diff --git a/front/core/components/icon-menu/icon-menu.html b/front/core/components/icon-menu/icon-menu.html deleted file mode 100644 index 93de718ff..000000000 --- a/front/core/components/icon-menu/icon-menu.html +++ /dev/null @@ -1,11 +0,0 @@ -
- - - - -
\ No newline at end of file diff --git a/front/core/components/icon-menu/icon-menu.js b/front/core/components/icon-menu/icon-menu.js deleted file mode 100644 index abc94504e..000000000 --- a/front/core/components/icon-menu/icon-menu.js +++ /dev/null @@ -1,41 +0,0 @@ -import ngModule from '../../module'; -import ButtonMenu from '../button-menu/button-menu'; -import './style.scss'; - -export default class IconMenu extends ButtonMenu { - constructor($element, $scope, $transclude) { - super($element, $scope); - this.$transclude = $transclude; - this.input = this.element.querySelector('.button'); - } -} -IconMenu.$inject = ['$element', '$scope', '$transclude']; - -ngModule.component('vnIconMenu', { - template: require('./icon-menu.html'), - bindings: { - label: '@', - showField: '@?', - selection: ' + + + + + \ No newline at end of file diff --git a/front/core/components/icon-menu/index.js b/front/core/components/icon-menu/index.js new file mode 100644 index 000000000..0549149a8 --- /dev/null +++ b/front/core/components/icon-menu/index.js @@ -0,0 +1,14 @@ +import ngModule from '../../module'; +import ButtonMenu from '../button-menu'; + +export default class IconMenu extends ButtonMenu { + constructor($element, $scope) { + super($element, $scope); + this.element.classList.add('flat'); + } +} + +ngModule.vnComponent('vnIconMenu', { + template: require('./index.html'), + controller: IconMenu +}); diff --git a/front/core/components/icon-menu/style.scss b/front/core/components/icon-menu/style.scss deleted file mode 100644 index df7a5e331..000000000 --- a/front/core/components/icon-menu/style.scss +++ /dev/null @@ -1,8 +0,0 @@ -vn-icon-menu { - cursor: pointer; - - vn-drop-down { - font-family: 'vn-font'; - outline: 0 - } -} \ No newline at end of file diff --git a/front/core/components/index.js b/front/core/components/index.js index 0433744f6..50c1a1bf8 100644 --- a/front/core/components/index.js +++ b/front/core/components/index.js @@ -10,36 +10,35 @@ import './subtitle/subtitle'; import './spinner/spinner'; import './snackbar/snackbar'; import './tooltip/tooltip'; -import './icon-menu/icon-menu'; -import './button-menu/button-menu'; import './popover/popover'; import './drop-down/drop-down'; import './menu/menu'; import './multi-check/multi-check'; -import './button/button'; -import './icon-button/icon-button'; -import './submit/submit'; import './card/card'; -import './float-button/float-button'; import './step-control/step-control'; import './label-value/label-value'; import './pagination/pagination'; import './searchbar/searchbar'; import './scroll-up/scroll-up'; import './autocomplete'; +import './button'; +import './button-menu'; import './calendar'; import './check'; import './chip'; -import './color-legend'; import './data-viewer'; import './date-picker'; import './field'; +import './float-button'; +import './icon-menu'; +import './icon-button'; import './input-number'; -import './input-range'; +import './range'; import './input-time'; import './input-file'; import './list'; import './radio'; +import './submit'; import './table'; import './td-editable'; import './textarea'; diff --git a/front/core/components/input-file/index.html b/front/core/components/input-file/index.html index 4e9c48631..58a2bea0c 100644 --- a/front/core/components/input-file/index.html +++ b/front/core/components/input-file/index.html @@ -1,42 +1,53 @@ -
-
-
-
-
+
+
+
+
+
+
+
{{$ctrl.value}}
- + type="file" + ng-model="$ctrl.files" + accept="{{$ctrl.accept}}"> +
-
-
-
- - info_outline - - - -
-
+
+
+
+ + + + + + +
+
+
+
+
+
+
+
diff --git a/front/core/components/input-file/index.js b/front/core/components/input-file/index.js index d0f93e4f8..3a0066e75 100644 --- a/front/core/components/input-file/index.js +++ b/front/core/components/input-file/index.js @@ -1,15 +1,13 @@ import ngModule from '../../module'; -import Input from '../../lib/input'; +import FormInput from '../form-input'; import './style.scss'; -export default class InputFile extends Input { +export default class InputFile extends FormInput { constructor($element, $scope) { super($element, $scope); - this.element = $element[0]; - this.hasFocus = false; this._multiple = false; this._value = 'Select a file'; - + this.input = this.element.querySelector('input'); this.registerEvents(); } @@ -106,26 +104,12 @@ export default class InputFile extends Input { } } -InputFile.$inject = ['$element', '$scope']; - -ngModule.component('vnInputFile', { +ngModule.vnComponent('vnInputFile', { template: require('./index.html'), controller: InputFile, - transclude: { - leftIcons: '?tLeftIcons', - rightIcons: '?tRightIcons' - }, bindings: { - label: '@?', - name: '@?', - disabled: ' .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 + input[type=file] { + display: none; } } \ No newline at end of file diff --git a/front/core/components/input-range/index.html b/front/core/components/input-range/index.html deleted file mode 100644 index 649e4de9f..000000000 --- a/front/core/components/input-range/index.html +++ /dev/null @@ -1,9 +0,0 @@ -
- - - - -
\ No newline at end of file diff --git a/front/core/components/input-range/index.js b/front/core/components/input-range/index.js deleted file mode 100644 index 8cfd898c7..000000000 --- a/front/core/components/input-range/index.js +++ /dev/null @@ -1,79 +0,0 @@ -import ngModule from '../../module'; -import Input from '../../lib/input'; -import './style.scss'; - -export default class inputRange extends Input { - constructor($element, $scope) { - super($element, $scope); - this.mdlElement = this.element.querySelector('.mdl-slider'); - componentHandler.upgradeElement(this.mdlElement); - this.mdlElement.addEventListener('change', () => { - this._value = this.input.value; - this.$.$applyAsync(); - if (this._value && this.onChange) - this.emit('change', {value: this._value}); - }); - } - - get value() { - return this._value; - } - - set value(value) { - this._value = value; - this.mdlElement.MaterialSlider.change(value); - } - - get max() { - return this.input.max; - } - - set max(value) { - this.input.max = value; - } - - get min() { - return this.input.min; - } - - set min(value) { - this.input.min = value; - } - - get step() { - return this.input.step; - } - - set step(value) { - this.input.step = value; - } - - get() { - return this._model; - } - - set model(value) { - this._model = value; - } - - set disabled(value) { - this.input.disabled = value; - } -} - -inputRange.$inject = ['$element', '$scope']; - -ngModule.component('vnInputRange', { - template: require('./index.html'), - controller: inputRange, - bindings: { - label: '@?', - disabled: '{{::$ctrl.label}} + + + \ No newline at end of file diff --git a/front/core/components/range/index.js b/front/core/components/range/index.js new file mode 100644 index 000000000..80410875a --- /dev/null +++ b/front/core/components/range/index.js @@ -0,0 +1,50 @@ +import ngModule from '../../module'; +import FormInput from '../form-input'; +import './style.scss'; + +export default class Range extends FormInput { + constructor($element, $scope) { + super($element, $scope); + this.input = this.element.querySelector('input'); + } + + get max() { + return this.input.max; + } + + set max(value) { + this.input.max = value; + } + + get min() { + return this.input.min; + } + + set min(value) { + this.input.min = value; + } + + get step() { + return this.input.step; + } + + set step(value) { + this.input.step = value; + } + + refreshTabIndex() { + this.input.tabIndex = this.disabled ? -1 : this.tabIndex; + } +} + +ngModule.vnComponent('vnRange', { + template: require('./index.html'), + controller: Range, + bindings: { + min: ' label { + font-size: 12px; + + &.main { + color: $color-main; + } + &.min-label { + float: left; + } + &.max-label { + float: right; + } + } + & > input { + cursor: pointer; + height: 30px; + display: block; + width: 100%; + background: transparent; + border-color: transparent; + -webkit-appearance: none; + margin: .2em 0; + + &:focus { + outline: none; + } + &::-moz-focus-outer { + border: 0; + } + @include range( + "-moz-range-thumb", + "-moz-range-track" + ); + @include range( + "-webkit-slider-thumb", + "-webkit-slider-runnable-track" + ); + @include range( + "-ms-thumb", + "-ms-track" + ); + &:disabled { + cursor: initial; + } + } +} diff --git a/front/core/components/scroll-up/scroll-up.html b/front/core/components/scroll-up/scroll-up.html index 3f3b309d5..a3748acc6 100644 --- a/front/core/components/scroll-up/scroll-up.html +++ b/front/core/components/scroll-up/scroll-up.html @@ -1,5 +1,6 @@ - \ No newline at end of file + vn-tooltip="Go up" + class="round"> + \ No newline at end of file diff --git a/front/core/components/scroll-up/style.scss b/front/core/components/scroll-up/style.scss index 0d5cd6c58..1bf7ea982 100644 --- a/front/core/components/scroll-up/style.scss +++ b/front/core/components/scroll-up/style.scss @@ -1,6 +1,6 @@ vn-scroll-up { - top: 5em; - right: 2.5em; + top: 5.5em; + right: 2em; display: none; position: fixed; } \ No newline at end of file diff --git a/front/core/components/searchbar/style.scss b/front/core/components/searchbar/style.scss index b3fa4b1a2..03cc0cd8d 100644 --- a/front/core/components/searchbar/style.scss +++ b/front/core/components/searchbar/style.scss @@ -2,6 +2,7 @@ vn-searchbar { display: block; + width: 100%; } .search-panel { diff --git a/front/core/components/spinner/spinner.html b/front/core/components/spinner/spinner.html index 47b6e42fe..b6a3af8be 100644 --- a/front/core/components/spinner/spinner.html +++ b/front/core/components/spinner/spinner.html @@ -1,2 +1,12 @@ -
+
+ + + +
\ No newline at end of file diff --git a/front/core/components/spinner/spinner.js b/front/core/components/spinner/spinner.js index ca87323d5..aee973aa6 100644 --- a/front/core/components/spinner/spinner.js +++ b/front/core/components/spinner/spinner.js @@ -1,19 +1,18 @@ import ngModule from '../../module'; import Component from '../../lib/component'; -import './style.css'; +import './style.scss'; /** * A spinner to inform the user about loading process. */ export default class Spinner extends Component { constructor($element, $scope) { - super($element); + super($element, $scope); this._enable = false; this.spinner = $element[0].firstChild; - componentHandler.upgradeElement(this.spinner); } /** - * Enables/disables the spinner. + * Activates/deactivates the spinner. * * @param {Boolean} value %true to enable, %false to disable */ @@ -35,14 +34,14 @@ export default class Spinner extends Component { * Activates the spinner. */ start() { - this.spinner.MaterialSpinner.start(); + this.spinner.style.display = 'block'; this._enable = true; } /** * Deactivates the spinner. */ stop() { - this.spinner.MaterialSpinner.stop(); + this.spinner.style.display = 'none'; this._enable = false; } } diff --git a/front/core/components/spinner/spinner.spec.js b/front/core/components/spinner/spinner.spec.js index cb23783f7..437139c8c 100644 --- a/front/core/components/spinner/spinner.spec.js +++ b/front/core/components/spinner/spinner.spec.js @@ -1,7 +1,6 @@ import './spinner.js'; describe('Component vnSpinner', () => { - let $scope; let $element; let controller; @@ -9,53 +8,44 @@ describe('Component vnSpinner', () => { $translateProvider.translations('en', {}); })); - beforeEach(angular.mock.inject(($componentController, $rootScope) => { - $scope = $rootScope.$new(); - $element = angular.element('
'); - controller = $componentController('vnSpinner', {$scope, $element}); + beforeEach(angular.mock.inject(($compile, $rootScope) => { + $element = $compile(``)($rootScope); + controller = $element.controller('vnSpinner'); })); + afterEach(() => { + $element.remove(); + }); + describe('enable()', () => { - it(`should call start() based on a boolean value passed as argument`, () => { + it(`should call start() when enable is set to true`, () => { spyOn(controller, 'start'); - spyOn(controller, 'stop'); controller.enable = true; expect(controller.start).toHaveBeenCalledWith(); - expect(controller.stop).not.toHaveBeenCalledWith(); }); - it(`should call stop() based on a boolean value passed as argument`, () => { - spyOn(controller, 'start'); + it(`should call stop() when enable is set to false`, () => { spyOn(controller, 'stop'); controller.enable = false; - expect(controller.start).not.toHaveBeenCalledWith(); expect(controller.stop).toHaveBeenCalledWith(); }); }); describe('start()', () => { - it(`should call start() on the controller.materialSpinner then set controllers._enable to be truthy`, () => { - controller.spinner = {MaterialSpinner: {start: () => {}}}; - spyOn(controller.spinner.MaterialSpinner, 'start'); - controller._enable = false; + it(`should set enable to true`, () => { controller.start(); - expect(controller.spinner.MaterialSpinner.start).toHaveBeenCalledWith(); - expect(controller._enable).toBeTruthy(); + expect(controller.enable).toBeTruthy(); }); }); describe('stop()', () => { - it(`should call stop() on the controller.materialSpinner then set controllers._enable to be truthy`, () => { - controller.spinner = {MaterialSpinner: {stop: () => {}}}; - spyOn(controller.spinner.MaterialSpinner, 'stop'); - controller._enable = true; + it(`should set enable to false`, () => { controller.stop(); - expect(controller.spinner.MaterialSpinner.stop).toHaveBeenCalledWith(); - expect(controller._enable).toBeFalsy(); + expect(controller.enable).toBeFalsy(); }); }); }); diff --git a/front/core/components/spinner/style.css b/front/core/components/spinner/style.css deleted file mode 100644 index fbcd1a0bf..000000000 --- a/front/core/components/spinner/style.css +++ /dev/null @@ -1,3 +0,0 @@ -vn-spinner { - display: inline-block; -} \ No newline at end of file diff --git a/front/core/components/spinner/style.scss b/front/core/components/spinner/style.scss new file mode 100644 index 000000000..3be908caf --- /dev/null +++ b/front/core/components/spinner/style.scss @@ -0,0 +1,60 @@ +@import "variables"; + +vn-spinner { + display: inline-block; + min-height: 28px; + min-width: 28px; + + & > .loader { + position: relative; + margin: 0 auto; + width: 100%; + height: 100%; + + &:before { + content: ''; + display: block; + padding-top: 100%; + } + & > .circular { + animation: rotate 2s linear infinite; + transform-origin: center center; + height: 100%; + width: 100%; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + margin: auto; + + & > .path { + stroke: $color-main; + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + stroke-linecap: square; + stroke-width: 6px; + animation: dash 1.5s ease-in-out infinite; + } + } + } + @keyframes rotate { + 100% { + transform: rotate(360deg); + } + } + @keyframes dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + } + 50% { + stroke-dasharray: 89, 200; + stroke-dashoffset: -35px; + } + 100% { + stroke-dasharray: 89, 200; + stroke-dashoffset: -124px; + } + } +} \ No newline at end of file diff --git a/front/core/components/step-control/style.scss b/front/core/components/step-control/style.scss index e1c29c9a2..9acc1f314 100644 --- a/front/core/components/step-control/style.scss +++ b/front/core/components/step-control/style.scss @@ -41,11 +41,5 @@ vn-step-control { & > .buttons > .step { display: flex } - & > .buttons > .step > .mdl-button { - line-height: 32px; - font-size: 12px; - padding: 0 12px; - height: 32px - } } } \ No newline at end of file diff --git a/front/core/components/submit/index.js b/front/core/components/submit/index.js new file mode 100644 index 000000000..ced73f0ba --- /dev/null +++ b/front/core/components/submit/index.js @@ -0,0 +1,13 @@ +import ngModule from '../../module'; +import Button from '../button'; + +export default class Controller extends Button { + constructor($element, $scope) { + super($element, $scope); + this.type = 'submit'; + } +} + +ngModule.vnComponent('vnSubmit', { + controller: Controller +}); diff --git a/front/core/components/submit/submit.html b/front/core/components/submit/submit.html deleted file mode 100644 index 6e77e4c16..000000000 --- a/front/core/components/submit/submit.html +++ /dev/null @@ -1,6 +0,0 @@ - - diff --git a/front/core/components/submit/submit.js b/front/core/components/submit/submit.js deleted file mode 100644 index 41d63cf1d..000000000 --- a/front/core/components/submit/submit.js +++ /dev/null @@ -1,25 +0,0 @@ -import ngModule from '../../module'; -import Input from '../../lib/input'; - -export default class Controller extends Input { - constructor($element, $scope) { - super($element, $scope); - this.$element = $element; - this.input = $element[0].querySelector('input'); - } - - set disabled(value) { - this.input.disabled = value; - } -} - -Controller.$inject = ['$element', '$scope']; - -ngModule.component('vnSubmit', { - template: require('./submit.html'), - controller: Controller, - bindings: { - label: '@?', - disabled: ' span { font-size: $input-font-size; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; } & > .btn { position: relative; diff --git a/front/core/components/tooltip/tooltip.js b/front/core/components/tooltip/tooltip.js index e0bc323eb..036ec6958 100644 --- a/front/core/components/tooltip/tooltip.js +++ b/front/core/components/tooltip/tooltip.js @@ -13,7 +13,7 @@ export default class Tooltip extends Component { constructor($element, $scope, $timeout) { super($element, $scope); this.$timeout = $timeout; - $element.addClass('vn-tooltip mdl-shadow--4dp'); + $element.addClass('vn-tooltip vn-shadow'); this.position = 'down'; this.margin = 10; } diff --git a/front/core/directives/acl.js b/front/core/directives/acl.js index f9df740cf..1cebddd42 100644 --- a/front/core/directives/acl.js +++ b/front/core/directives/acl.js @@ -1,110 +1,41 @@ import ngModule from '../module'; +import FormInput from '../components/form-input'; -function vnAcl(aclService, $timeout) { +function vnAcl(aclService) { let acls = []; - function getMaterialType(className) { - let type = ''; - if (className) { - type = className.replace('mdl-', '').replace('__input', ''); - type = type.charAt(0).toUpperCase() + type.slice(1); - } - return type; - } - function updateMaterial(input) { - if (input && input.className) { - let find = input.className.match(/mdl-[\w]+input/g); - if (find && find.length && find[0]) { - let type = getMaterialType(find[0]); - if (type && input.parentNode[`Material${type}`] && input.parentNode[`Material${type}`].updateClasses_) - input.parentNode[`Material${type}`].updateClasses_(); - } - } - } - function getDynamicConditions($attrs) { - let atributes = $attrs.$attr; - let conditions = {}; - - Object.keys(atributes).forEach(atribute => { - if (atribute.startsWith('aclConditionalTo')) { - let role = atributes[atribute].split('-').slice(-1)[0]; - conditions[atribute] = { - role: role - }; - } - }); - return conditions; - } - - function permissionElement($element, action) { - if (!aclService.hasAny(acls)) { - if (action === 'disabled') { - let element = $element[0]; - let selector = 'input, textarea, button, submit, md-checkbox'; - - if (element.$ctrl) { - element.setAttribute('disabled', 'true'); - element.$ctrl.disabled = true; - } - - if (!element.matches(selector)) - element = element.querySelector(selector); - - if (element) { - $timeout(() => { - element.setAttribute('disabled', 'true'); - updateMaterial(element); - }); - $element[0].querySelectorAll('vn-drop-down').forEach(element => { - element.parentNode.removeChild(element); - }); - } - } else - $element.remove(); - } - } - - function updateAcls(role, toAdd) { - let position = acls.indexOf(role); - - if (!toAdd && position > -1) - acls.splice(position, 1); - // XXX: add acl and enabled element if previusly was disabled - } - return { restrict: 'A', priority: -1, - link: function($scope, $element, $attrs) { + link: function(_, $element, $attrs) { acls = $attrs.vnAcl.split(',').map(i => i.trim()); if (acls[0] == '') return; - let action = $attrs.vnAclAction || 'disabled'; - let conditions = getDynamicConditions($attrs); + let action = $attrs.vnAclAction || 'disable'; - permissionElement($element, action); + if (aclService.hasAny(acls)) return; - if (Object.keys(conditions).length) { - let watchConditions = $scope.$watch(() => { - Object.keys(conditions).forEach(attrName => { - let hasPermission = $scope.$eval($attrs[attrName]); - if (!hasPermission) { - updateAcls(conditions[attrName].role, hasPermission); - permissionElement($element, action); - delete conditions[attrName]; - } - }); + if (action === 'disable') { + let element = $element[0]; + let elementToDisable = element.$ctrl; - if (Object.keys(conditions).length === 0) { - // unWacth - watchConditions(); - } - }); - } + if (!(elementToDisable instanceof FormInput)) { + let selector = 'input, textarea, button, submit'; + + if (!element.matches(selector)) + element = element.querySelector(selector); + + elementToDisable = element; + } + + if (elementToDisable) + elementToDisable.disabled = true; + } else + $element.remove(); } }; } -vnAcl.$inject = ['aclService', '$timeout']; +vnAcl.$inject = ['aclService']; ngModule.directive('vnAcl', vnAcl); diff --git a/front/core/directives/specs/acl.spec.js b/front/core/directives/specs/acl.spec.js index 523fb28bd..a7884a12d 100644 --- a/front/core/directives/specs/acl.spec.js +++ b/front/core/directives/specs/acl.spec.js @@ -1,54 +1,97 @@ describe('Directive acl', () => { - let scope; + let $scope; + let $element; let element; let compile; - let $timeout; beforeEach(angular.mock.module('vnCore', $translateProvider => { $translateProvider.translations('en', {}); })); - compile = (hasPermissions, _element) => { - inject(($compile, $rootScope, aclService, _$timeout_) => { - spyOn(aclService, 'hasAny').and.returnValue(hasPermissions); - scope = $rootScope.$new(); - $timeout = _$timeout_; - element = angular.element(_element); - $compile(element)(scope); - scope.$digest(); + beforeEach(inject(($httpBackend, aclService) => { + $httpBackend.whenGET('/api/Accounts/acl') + .respond({ + user: {id: 1, name: 'myUser'}, + roles: [ + {role: {name: 'myRole'}}, + {role: {name: 'myOtherRole'}} + ] + }); + aclService.load(); + $httpBackend.flush(); + })); + + afterEach(() => { + $element.remove(); + $scope.$destroy(); + }); + + compile = html => { + inject(($compile, $rootScope) => { + $scope = $rootScope.$new(); + $element = $compile(html)($scope); + $scope.$digest(); + element = $element[0]; }); }; - it('should not disable the input element as the user has permision', () => { - let html = `
`; - compile(true, html); - let input = element.find('input'); + it('should not disable the input element as the user owns the role', () => { + let html = ` +
+ +
+ `; + compile(html); + let input = element.querySelector('input'); - expect(input).toBeDefined(); - expect(input.attr('disabled')).toBeFalsy(); + expect(input.disabled).toBeFalsy(); }); - it('should delete the element as the user does not have permission and there is no action', () => { - let html = `
`; - compile(false, html); + it('should disable the element as the action is to disable and the user does not own the role', () => { + let html = ` +
+ +
+ `; + compile(html); + let input = element.querySelector('input'); - expect(element.children().length).toEqual(0); + expect(input.disabled).toBeTruthy(); }); - it('should disable the element as the action is to disable it but the user has no permission but present', () => { - let html = `
`; - compile(false, html); - let input = element.find('input'); - $timeout.flush(); + it('should keep the element as the action is to remove and the user owns the role', () => { + let html = ` +
+
+ +
+
+ `; + compile(html); + let div = element.querySelector('div'); - expect(input).toBeDefined(); - expect(input.attr('disabled')).toBeTruthy(); + expect(div).not.toBeNull(); }); - it('should delete any element with the tag vn-drop-down', () => { - let html = `
`; - compile(false, html); + it('should delete the element as the action is to remove and the user does not own the role', () => { + let html = ` +
+
+ +
+
+ `; + compile(html); + let div = element.querySelector('div'); - expect(element.find('vn-drop-down').length).toBe(0); + expect(div).toBeNull(); }); }); diff --git a/front/core/lib/input.js b/front/core/lib/input.js deleted file mode 100644 index b29d3fe37..000000000 --- a/front/core/lib/input.js +++ /dev/null @@ -1,42 +0,0 @@ -import Component from './component'; - -/** - * Component that host an input. - */ -export default class Input extends Component { - constructor($element, $scope) { - super($element, $scope); - this.input = this.element.querySelector('input'); - } - - set disabled(value) { - this.input.disabled = value == true; - this.mdlUpdate(); - } - - get disabled() { - return this.input.disabled; - } - - select() { - this.input.select(); - } - - focus() { - this.input.focus(); - } - - mdlUpdate() { - if (this.mdlElement) - this.mdlElement.updateClasses_(); - } -} -Input.$inject = ['$element', '$scope']; - -export const $options = { - bindings: { - label: '@?', - disabled: '=2.8.0 <3.0.0" - } - }, "angular-translate": { "version": "2.18.1", "resolved": "https://registry.npmjs.org/angular-translate/-/angular-translate-2.18.1.tgz", @@ -83,11 +65,6 @@ "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz", "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==" }, - "flatpickr": { - "version": "4.5.2", - "resolved": "https://registry.npmjs.org/flatpickr/-/flatpickr-4.5.2.tgz", - "integrity": "sha512-jDy4QYGpmiy7+Qk8QvKJ4spjDdxcx9cxMydmq1x427HkKWBw0qizLYeYM2F6tMcvvqGjU5VpJS55j4LnsaBblA==" - }, "js-yaml": { "version": "3.13.1", "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.13.1.tgz", @@ -97,11 +74,6 @@ "esprima": "^4.0.0" } }, - "material-design-lite": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/material-design-lite/-/material-design-lite-1.3.0.tgz", - "integrity": "sha1-0ATOP+6Zoe63Sni4oyUTSl8RcdM=" - }, "mg-crud": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/mg-crud/-/mg-crud-1.1.2.tgz", @@ -110,19 +82,6 @@ "angular": "^1.6.1" } }, - "moment": { - "version": "2.24.0", - "resolved": "https://registry.npmjs.org/moment/-/moment-2.24.0.tgz", - "integrity": "sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==" - }, - "moment-timezone": { - "version": "0.5.25", - "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.25.tgz", - "integrity": "sha512-DgEaTyN/z0HFaVcVbSyVCUU6HeFdnNC3vE4c9cgu2dgMTvjBUBdBzWfasTBmAW45u5OIMeCJtU8yNjM22DHucw==", - "requires": { - "moment": ">= 2.9.0" - } - }, "npm": { "version": "6.11.3", "resolved": "https://registry.npmjs.org/npm/-/npm-6.11.3.tgz", diff --git a/front/package.json b/front/package.json index 82798b28c..e17dbd08c 100644 --- a/front/package.json +++ b/front/package.json @@ -12,16 +12,10 @@ "@babel/polyfill": "^7.2.5", "@uirouter/angularjs": "^1.0.20", "angular": "^1.7.5", - "angular-animate": "^1.7.7", - "angular-aria": "^1.7.7", - "angular-moment": "^1.3.0", "angular-translate": "^2.18.1", "angular-translate-loader-partial": "^2.18.1", - "flatpickr": "^4.5.2", "js-yaml": "^3.13.1", - "material-design-lite": "^1.3.0", "mg-crud": "^1.1.2", - "moment-timezone": "^0.5.25", "npm": "^6.11.3", "oclazyload": "^0.6.3", "require-yaml": "0.0.1", diff --git a/front/salix/components/app/style.scss b/front/salix/components/app/style.scss index 29c14fe0b..530524773 100644 --- a/front/salix/components/app/style.scss +++ b/front/salix/components/app/style.scss @@ -1,12 +1,5 @@ @import "variables"; -body { - background-color: $color-bg; - overflow: auto; - height: 100%; - font-family: vn-font; - color: $color-font; -} vn-app { height: inherit; display: block; @@ -104,37 +97,3 @@ vn-app { } } } -form vn-horizontal { - align-items: center; - - & > * { - box-sizing: border-box; - min-height: 2.8em; - padding: 0 $spacing-sm; - - &:first-child { - padding-left: 0; - padding-right: $spacing-xs; - } - &:last-child { - padding-left: $spacing-xs; - padding-right: 0; - } - &:first-child:last-child { - padding: 0; - } - } - - @media screen and (max-width: $mobile-width) { - flex-direction: column; - align-items: initial; - - & > * { - &, - &:first-child, - &:last-child { - padding: 0; - } - } - } -} \ No newline at end of file diff --git a/front/salix/components/descriptor/index.html b/front/salix/components/descriptor/index.html new file mode 100644 index 000000000..a3ee34563 --- /dev/null +++ b/front/salix/components/descriptor/index.html @@ -0,0 +1,24 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/front/salix/components/descriptor/index.js b/front/salix/components/descriptor/index.js index 423b033ce..504812b15 100644 --- a/front/salix/components/descriptor/index.js +++ b/front/salix/components/descriptor/index.js @@ -1 +1,12 @@ +import ngModule from '../../module'; import './style.scss'; + +export default class QuickLinks {} + +ngModule.component('vnQuickLinks', { + template: require('./index.html'), + controller: QuickLinks, + bindings: { + links: ' * { - min-width: 1.8em; @extend %clickable; + min-width: 45px; + height: 45px; + box-sizing: border-box; display: flex; align-items: center; justify-content: center; - padding: .5em; color: inherit; & > vn-icon { + padding: 10px; + } + vn-icon { font-size: 1.8em; } } @@ -55,28 +59,25 @@ } } } - & > .quicklinks { + .quicklinks, + vn-quick-links { display: flex; align-items: center; justify-content: center; - padding: 0; & > a { - padding: $spacing-sm; - + padding: 0 $spacing-md; + margin: 0 $spacing-sm; + & > vn-icon { font-size: 1.8em; padding: 0; - - & > i { - line-height: 36px - } } } } } } -vn-popover { +.vn-popover { .vn-descriptor > .header > a:first-child { visibility: hidden; } diff --git a/front/salix/components/home/home.html b/front/salix/components/home/home.html index fa9cd9d67..b6aaeced1 100644 --- a/front/salix/components/home/home.html +++ b/front/salix/components/home/home.html @@ -4,7 +4,7 @@ ng-repeat="mod in ::$ctrl.modules" ui-sref="{{::mod.route.state}}" translate-attr="::{title: mod.name}" - class="mdl-shadow--4dp"> + class="vn-shadow">
diff --git a/front/salix/components/index.js b/front/salix/components/index.js index ca37b21d1..5724231ed 100644 --- a/front/salix/components/index.js +++ b/front/salix/components/index.js @@ -1,11 +1,11 @@ import './app/app'; -import './login/login'; -import './home/home'; -import './main-menu/main-menu'; import './background/background'; -import './side-menu/side-menu'; -import './left-menu/left-menu'; -import './topbar/topbar'; -import './user-popover'; import './descriptor'; +import './home/home'; +import './left-menu/left-menu'; +import './login/login'; +import './main-menu/main-menu'; +import './topbar/topbar'; +import './side-menu/side-menu'; import './summary'; +import './user-popover'; diff --git a/front/salix/components/login/login.html b/front/salix/components/login/login.html index 73154222c..b15714a23 100644 --- a/front/salix/components/login/login.html +++ b/front/salix/components/login/login.html @@ -4,14 +4,12 @@ *:hover { - color: $color-main; + & > * { + transition: color 250ms ease-out; } & > #user { vertical-align: middle; @@ -20,12 +20,16 @@ vn-main-menu { margin-right: .2em; cursor: pointer; } - & > vn-icon-button { - font-size: 2.1em; + & > .vn-button { + font-size: 1.2em; color: inherit; padding: 0; margin-left: .3em; } + & > :hover { + color: $color-main; + opacity: 1; + } } } diff --git a/front/salix/components/summary/style.scss b/front/salix/components/summary/style.scss index c9a2b74ab..9fd85be3c 100644 --- a/front/salix/components/summary/style.scss +++ b/front/salix/components/summary/style.scss @@ -20,6 +20,7 @@ & > vn-horizontal { flex-wrap: wrap; padding: $spacing-md; + overflow: hidden; h4 { margin-bottom: $spacing-md; @@ -28,7 +29,7 @@ line-height: 1; padding: 7px; padding-bottom: 4px; /* Bottom line-height fix */ - font-family: unset; + font-weight: lighter; background-color: $color-main-light; border-bottom: .1em solid $color-main; white-space: nowrap; @@ -38,7 +39,6 @@ & > * { margin: $spacing-sm; min-width: 14em; - overflow: hidden; padding: 0; } & > vn-auto { diff --git a/front/salix/styles/misc.scss b/front/salix/styles/misc.scss index 8066759ac..6dcaab060 100644 --- a/front/salix/styles/misc.scss +++ b/front/salix/styles/misc.scss @@ -1,31 +1,43 @@ @import "./variables"; @import "./effects"; -html, body { - margin: 0; - padding: 0; +form vn-horizontal { + align-items: stretch; + + & > * { + box-sizing: border-box; + min-height: 2.8em; + padding: 0 $spacing-sm; + + &:first-child { + padding-left: 0; + padding-right: $spacing-xs; + } + &:last-child { + padding-left: $spacing-xs; + padding-right: 0; + } + &:first-child:last-child { + padding: 0; + } + } + + @media screen and (max-width: $mobile-width) { + flex-direction: column; + align-items: initial; + + & > * { + &, + &:first-child, + &:last-child { + padding: 0; + } + } + } } -a:focus, -input:focus, -button:focus { - outline: none; -} -button::-moz-focus-inner, -input[type=submit]::-moz-focus-inner, -input[type=button]::-moz-focus-inner, -input[type=reset]::-moz-focus-inner { - border: none; -} -.unselectable { - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - user-select: none; -} -a, .link { + +.link { color: $color-font-link; - text-decoration: none; - outline: 0 } .link { cursor: pointer; @@ -34,6 +46,12 @@ a, .link { text-decoration: underline; } } +.unselectable { + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + user-select: none; +} vn-bg-title { display: block; text-align: center; @@ -77,9 +95,6 @@ html [pointer], .pointer{ html [noDrop], .noDrop{ cursor: no-drop; } -button { - @extend %clickable; -} vn-button-bar { display: block; margin-top: $spacing-sm; @@ -91,9 +106,6 @@ vn-tool-bar { margin-right: .6em; } } -input[type="submit"]:disabled, button:disabled { - opacity: 0.7; -} html [scrollable] { min-height: 1px; flex: 1; diff --git a/modules/agency/front/index/index.html b/modules/agency/front/index/index.html index cfe39c7f1..c2cd52faa 100644 --- a/modules/agency/front/index/index.html +++ b/modules/agency/front/index/index.html @@ -80,7 +80,8 @@ vn-tooltip="New zone" vn-bind="+" fixed-bottom-right> - diff --git a/modules/claim/front/action/index.html b/modules/claim/front/action/index.html index 65467d349..b502cf020 100644 --- a/modules/claim/front/action/index.html +++ b/modules/claim/front/action/index.html @@ -28,16 +28,18 @@ ng-click="$ctrl.showLastTickets($event)" vn-tooltip="Imports ticket lines"> - - + diff --git a/modules/claim/front/descriptor/index.html b/modules/claim/front/descriptor/index.html index 24efcc0fb..431989bbd 100644 --- a/modules/claim/front/descriptor/index.html +++ b/modules/claim/front/descriptor/index.html @@ -42,32 +42,9 @@ value="{{$ctrl.claim.ticketFk}}">
- + +
-
- + tabindex="-1" + icon="delete"> +
diff --git a/modules/claim/front/summary/index.html b/modules/claim/front/summary/index.html index 314d71bc9..46600c0da 100644 --- a/modules/claim/front/summary/index.html +++ b/modules/claim/front/summary/index.html @@ -30,16 +30,18 @@ - - +

Detail

diff --git a/modules/client/front/address/create/index.html b/modules/client/front/address/create/index.html index 8c30f9929..30e49590c 100644 --- a/modules/client/front/address/create/index.html +++ b/modules/client/front/address/create/index.html @@ -119,12 +119,10 @@ - + diff --git a/modules/client/front/basic-data/index.html b/modules/client/front/basic-data/index.html index eed8277af..ce80ea5a6 100644 --- a/modules/client/front/basic-data/index.html +++ b/modules/client/front/basic-data/index.html @@ -5,70 +5,68 @@ form="form" save="patch"> -
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/modules/client/front/credit-insurance/insurance/create/index.html b/modules/client/front/credit-insurance/insurance/create/index.html index f652f6011..a28fb605b 100644 --- a/modules/client/front/credit-insurance/insurance/create/index.html +++ b/modules/client/front/credit-insurance/insurance/create/index.html @@ -35,9 +35,9 @@ - + + \ No newline at end of file diff --git a/modules/client/front/descriptor/index.html b/modules/client/front/descriptor/index.html index 84f3ca10e..32d785fe3 100644 --- a/modules/client/front/descriptor/index.html +++ b/modules/client/front/descriptor/index.html @@ -63,31 +63,8 @@ ng-class="{bright: $ctrl.client.isTaxDataChecked == false}">
- + + \ No newline at end of file diff --git a/modules/invoiceOut/front/descriptor/index.html b/modules/invoiceOut/front/descriptor/index.html index 211560d28..3960c3925 100644 --- a/modules/invoiceOut/front/descriptor/index.html +++ b/modules/invoiceOut/front/descriptor/index.html @@ -33,24 +33,9 @@ value="{{$ctrl.invoiceOut.company.code}}"> - + + - - + + + + diff --git a/modules/item/front/descriptor/index.html b/modules/item/front/descriptor/index.html index cd12c253f..e273b02e4 100644 --- a/modules/item/front/descriptor/index.html +++ b/modules/item/front/descriptor/index.html @@ -64,32 +64,9 @@ ng-class="{bright: $ctrl.item.isActive == false}">
- + +
- +
- + + - +
+ class="colored"> {{$ctrl.category.value}} + class="colored"> {{$ctrl.type.value}} + class="colored"> {{::tag.value}} - +
\ No newline at end of file diff --git a/modules/order/front/filter/style.scss b/modules/order/front/filter/style.scss index 52125ace6..0cac5765f 100644 --- a/modules/order/front/filter/style.scss +++ b/modules/order/front/filter/style.scss @@ -39,10 +39,12 @@ vn-catalog-filter > div { } } .chips { + display: flex; flex-wrap: wrap; padding: $spacing-md; + overflow: hidden; + max-width: 100%; } - vn-autocomplete[vn-id="type"] .list { max-height: 20em } diff --git a/modules/order/front/prices-popover/index.html b/modules/order/front/prices-popover/index.html index 3a7f34462..a88e027ac 100644 --- a/modules/order/front/prices-popover/index.html +++ b/modules/order/front/prices-popover/index.html @@ -1,13 +1,11 @@
- - - + - +
@@ -74,32 +72,9 @@ - + +
- + +
-