[IMP] web_widget_numeric_step: display always on mobile

Mobile screens benefit most from this module's enhanced usability.

However, since the events used for displaying/hiding the +/- buttons depend on mouse, at the end you'll never see these buttons on mobile screens.

Thus, here's a new approach: smaller screens *always* display the buttons.

Besides, inputmode is now decimal, just like upstream float fields.

@moduon MT-4396
pull/2906/head
Jairo Llopis 2023-12-12 09:50:16 +00:00 committed by Carlos Roca
parent cd46f8958a
commit a9c6da55df
5 changed files with 8 additions and 8 deletions

View File

@ -7,7 +7,7 @@ Web Widget Numeric Step
!! This file is generated by oca-gen-addon-readme !! !! This file is generated by oca-gen-addon-readme !!
!! changes will be overwritten. !! !! changes will be overwritten. !!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! source digest: sha256:ed5b95972503b3ab497d91d69e432b90c9aff241888b2525cb6d8648a7e7fe5f !! source digest: sha256:c08fb28b580ac9ab7d0f86b19ed2ded973fdf39e527ecad4a74fd87e11689f6f
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
.. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png .. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png

View File

@ -5,7 +5,7 @@
{ {
"name": "Web Widget Numeric Step", "name": "Web Widget Numeric Step",
"category": "web", "category": "web",
"version": "16.0.1.0.0", "version": "16.0.1.0.1",
"author": "GRAP, Tecnativa, " "Odoo Community Association (OCA)", "author": "GRAP, Tecnativa, " "Odoo Community Association (OCA)",
"license": "AGPL-3", "license": "AGPL-3",
"website": "https://github.com/OCA/web", "website": "https://github.com/OCA/web",

View File

@ -1,4 +1,3 @@
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head> <head>
@ -367,7 +366,7 @@ ul.auto-toc {
!! This file is generated by oca-gen-addon-readme !! !! This file is generated by oca-gen-addon-readme !!
!! changes will be overwritten. !! !! changes will be overwritten. !!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! source digest: sha256:ed5b95972503b3ab497d91d69e432b90c9aff241888b2525cb6d8648a7e7fe5f !! source digest: sha256:c08fb28b580ac9ab7d0f86b19ed2ded973fdf39e527ecad4a74fd87e11689f6f
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! --> !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
<p><a class="reference external image-reference" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external image-reference" href="http://www.gnu.org/licenses/agpl-3.0-standalone.html"><img alt="License: AGPL-3" src="https://img.shields.io/badge/licence-AGPL--3-blue.png" /></a> <a class="reference external image-reference" href="https://github.com/OCA/web/tree/16.0/web_widget_numeric_step"><img alt="OCA/web" src="https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github" /></a> <a class="reference external image-reference" href="https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_widget_numeric_step"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external image-reference" href="https://runboat.odoo-community.org/builds?repo=OCA/web&amp;target_branch=16.0"><img alt="Try me on Runboat" src="https://img.shields.io/badge/runboat-Try%20me-875A7B.png" /></a></p> <p><a class="reference external image-reference" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external image-reference" href="http://www.gnu.org/licenses/agpl-3.0-standalone.html"><img alt="License: AGPL-3" src="https://img.shields.io/badge/licence-AGPL--3-blue.png" /></a> <a class="reference external image-reference" href="https://github.com/OCA/web/tree/16.0/web_widget_numeric_step"><img alt="OCA/web" src="https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github" /></a> <a class="reference external image-reference" href="https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_widget_numeric_step"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external image-reference" href="https://runboat.odoo-community.org/builds?repo=OCA/web&amp;target_branch=16.0"><img alt="Try me on Runboat" src="https://img.shields.io/badge/runboat-Try%20me-875A7B.png" /></a></p>
<p>This widget changes input number field and make it easier to increment the number thanks to 2 buttons (+ and -). <p>This widget changes input number field and make it easier to increment the number thanks to 2 buttons (+ and -).

View File

@ -11,11 +11,11 @@ export class NumericStep extends FloatField {
} }
_onFocusInput(ev) { _onFocusInput(ev) {
const $el = $(ev.target).parent().find(".widget_numeric_step_btn"); const $el = $(ev.target).parent().find(".widget_numeric_step_btn");
$el.removeClass("d-none"); $el.removeClass("d-lg-none");
} }
_onFocusOutInput(ev) { _onFocusOutInput(ev) {
const $el = $(ev.target).find(".widget_numeric_step_btn"); const $el = $(ev.target).find(".widget_numeric_step_btn");
$el.addClass("d-none"); $el.addClass("d-lg-none");
} }
_onStepClick(ev) { _onStepClick(ev) {
const $el = $(ev.target).parent().parent().find("input"); const $el = $(ev.target).parent().parent().find("input");

View File

@ -11,7 +11,7 @@ License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl.html).
t-on-mouseleave="_onFocusOutInput" t-on-mouseleave="_onFocusOutInput"
t-on-mouseenter="_onFocusInput" t-on-mouseenter="_onFocusInput"
> >
<div class="input-group-prepend d-none widget_numeric_step_btn"> <div class="input-group-prepend d-lg-none widget_numeric_step_btn">
<button <button
class="fa fa-minus btn btn-default btn_numeric_step" class="fa fa-minus btn btn-default btn_numeric_step"
aria-label="Minus" aria-label="Minus"
@ -27,11 +27,12 @@ License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl.html).
t-att-placeholder="props.placeholder" t-att-placeholder="props.placeholder"
t-att-type="props.inputType" t-att-type="props.inputType"
class="o_input input_numeric_step" class="o_input input_numeric_step"
inputmode="decimal"
t-att-step="props.step" t-att-step="props.step"
t-on-keydown="_onKeyDown" t-on-keydown="_onKeyDown"
t-on-wheel="_onWheel" t-on-wheel="_onWheel"
/> />
<div class="input-group-append d-none widget_numeric_step_btn"> <div class="input-group-append d-lg-none widget_numeric_step_btn">
<button <button
class="fa fa-plus btn btn-default btn_numeric_step" class="fa fa-plus btn btn-default btn_numeric_step"
aria-label="Plus" aria-label="Plus"