[IMP] web_widget_one2many_product_picker: BS grid columns

This commit is contained in:
Alexandre D. Díaz
2021-02-04 14:15:55 +01:00
parent 165de794da
commit 43e3191970
8 changed files with 54 additions and 20 deletions

View File

@@ -177,6 +177,13 @@ Other example for 'purchase.order.line' fields:
</form>
</field>
Boostrap Modifications:
~~~~~~~~~~~~~~~~~~~~~~~
The product picker view container have a custom media queries space adding a new screen size called 'xxl' (>= 1440px) and modifies the columns to have 24 instead of 12.
This means that you can use "col-xxl-" inside the product picker view container.
Usage
=====

View File

@@ -4,7 +4,7 @@
{
'name': 'Web Widget One2Many Product Picker',
'summary': 'Widget to select products on one2many fields',
'version': '12.0.2.0.0',
'version': '12.0.2.1.0',
'category': 'Website',
'author': "Tecnativa, "
"Odoo Community Association (OCA)",

View File

@@ -134,3 +134,10 @@ Other example for 'purchase.order.line' fields:
<field name="product_uom" class="mb-2" options="{'no_open': True, 'no_create': True, 'no_edit': True}" />
</form>
</field>
Boostrap Modifications:
~~~~~~~~~~~~~~~~~~~~~~~
The product picker view container have a custom media queries space adding a new screen size called 'xxl' (>= 1440px) and modifies the columns to have 24 instead of 12.
This means that you can use "col-xxl-" inside the product picker view container.

View File

@@ -377,19 +377,20 @@ ul.auto-toc {
<li><a class="reference internal" href="#widget-options" id="id3">Widget options:</a></li>
<li><a class="reference internal" href="#default-context" id="id4">Default context:</a></li>
<li><a class="reference internal" href="#examples" id="id5">Examples:</a></li>
<li><a class="reference internal" href="#boostrap-modifications" id="id6">Boostrap Modifications:</a></li>
</ul>
</li>
<li><a class="reference internal" href="#usage" id="id6">Usage</a><ul>
<li><a class="reference internal" href="#parts-of-the-widget" id="id7">Parts of the widget:</a></li>
<li><a class="reference internal" href="#preview" id="id8">Preview:</a></li>
<li><a class="reference internal" href="#usage" id="id7">Usage</a><ul>
<li><a class="reference internal" href="#parts-of-the-widget" id="id8">Parts of the widget:</a></li>
<li><a class="reference internal" href="#preview" id="id9">Preview:</a></li>
</ul>
</li>
<li><a class="reference internal" href="#known-issues-roadmap" id="id9">Known issues / Roadmap</a></li>
<li><a class="reference internal" href="#bug-tracker" id="id10">Bug Tracker</a></li>
<li><a class="reference internal" href="#credits" id="id11">Credits</a><ul>
<li><a class="reference internal" href="#authors" id="id12">Authors</a></li>
<li><a class="reference internal" href="#contributors" id="id13">Contributors</a></li>
<li><a class="reference internal" href="#maintainers" id="id14">Maintainers</a></li>
<li><a class="reference internal" href="#known-issues-roadmap" id="id10">Known issues / Roadmap</a></li>
<li><a class="reference internal" href="#bug-tracker" id="id11">Bug Tracker</a></li>
<li><a class="reference internal" href="#credits" id="id12">Credits</a><ul>
<li><a class="reference internal" href="#authors" id="id13">Authors</a></li>
<li><a class="reference internal" href="#contributors" id="id14">Contributors</a></li>
<li><a class="reference internal" href="#maintainers" id="id15">Maintainers</a></li>
</ul>
</li>
</ul>
@@ -562,34 +563,39 @@ options=&quot;{'search': [{'name': _('Starts With'), 'domain': [('name', '=like'
<span class="nt">&lt;/field&gt;</span>
</pre>
</div>
<div class="section" id="boostrap-modifications">
<h2><a class="toc-backref" href="#id6">Boostrap Modifications:</a></h2>
<p>The product picker view container have a custom media queries space adding a new screen size called xxl (&gt;= 1440px) and modifies the columns to have 24 instead of 12.
This means that you can use “col-xxl-” inside the product picker view container.</p>
</div>
</div>
<div class="section" id="usage">
<h1><a class="toc-backref" href="#id6">Usage</a></h1>
<h1><a class="toc-backref" href="#id7">Usage</a></h1>
<p>When you change the value of a field and switch to edit another record, the
changes will be applied to the previous record without having to click on
accept changes.</p>
<div class="section" id="parts-of-the-widget">
<h2><a class="toc-backref" href="#id7">Parts of the widget:</a></h2>
<h2><a class="toc-backref" href="#id8">Parts of the widget:</a></h2>
<blockquote>
<img alt="https://raw.githubusercontent.com/OCA/web/12.0/web_widget_one2many_product_picker/static/img/product_picker_anat.png" src="https://raw.githubusercontent.com/OCA/web/12.0/web_widget_one2many_product_picker/static/img/product_picker_anat.png" />
</blockquote>
</div>
<div class="section" id="preview">
<h2><a class="toc-backref" href="#id8">Preview:</a></h2>
<h2><a class="toc-backref" href="#id9">Preview:</a></h2>
<blockquote>
<img alt="https://raw.githubusercontent.com/OCA/web/12.0/web_widget_one2many_product_picker/static/img/product_picker.gif" src="https://raw.githubusercontent.com/OCA/web/12.0/web_widget_one2many_product_picker/static/img/product_picker.gif" />
</blockquote>
</div>
</div>
<div class="section" id="known-issues-roadmap">
<h1><a class="toc-backref" href="#id9">Known issues / Roadmap</a></h1>
<h1><a class="toc-backref" href="#id10">Known issues / Roadmap</a></h1>
<ul class="simple">
<li>Translations in the xml options attribute of the field that use the widget cant be exported automatically to be translated</li>
<li>The product card animations can be improved. Currently the card is recreated, so we lost some elements to apply correct effects.</li>
</ul>
</div>
<div class="section" id="bug-tracker">
<h1><a class="toc-backref" href="#id10">Bug Tracker</a></h1>
<h1><a class="toc-backref" href="#id11">Bug Tracker</a></h1>
<p>Bugs are tracked on <a class="reference external" href="https://github.com/OCA/web/issues">GitHub Issues</a>.
In case of trouble, please check there if your issue has already been reported.
If you spotted it first, help us smashing it by providing a detailed and welcomed
@@ -597,15 +603,15 @@ If you spotted it first, help us smashing it by providing a detailed and welcome
<p>Do not contact contributors directly about support or help with technical issues.</p>
</div>
<div class="section" id="credits">
<h1><a class="toc-backref" href="#id11">Credits</a></h1>
<h1><a class="toc-backref" href="#id12">Credits</a></h1>
<div class="section" id="authors">
<h2><a class="toc-backref" href="#id12">Authors</a></h2>
<h2><a class="toc-backref" href="#id13">Authors</a></h2>
<ul class="simple">
<li>Tecnativa</li>
</ul>
</div>
<div class="section" id="contributors">
<h2><a class="toc-backref" href="#id13">Contributors</a></h2>
<h2><a class="toc-backref" href="#id14">Contributors</a></h2>
<ul>
<li><p class="first"><a class="reference external" href="https://www.tecnativa.com">Tecnativa</a>:</p>
<blockquote>
@@ -619,7 +625,7 @@ If you spotted it first, help us smashing it by providing a detailed and welcome
</ul>
</div>
<div class="section" id="maintainers">
<h2><a class="toc-backref" href="#id14">Maintainers</a></h2>
<h2><a class="toc-backref" href="#id15">Maintainers</a></h2>
<p>This module is maintained by the OCA.</p>
<a class="reference external image-reference" href="https://odoo-community.org"><img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" /></a>
<p>OCA, or the Odoo Community Association, is a nonprofit organization whose

View File

@@ -0,0 +1,6 @@
$one2many-product-picker-grid-breakpoints: map-merge(
$grid-breakpoints,
(
xxl: 1440px,
)
);

View File

@@ -45,6 +45,8 @@
}
.oe_one2many_product_picker_view {
@include make-grid-columns($columns: 24, $breakpoints: $one2many-product-picker-grid-breakpoints);
overflow: auto;
> .row {

View File

@@ -69,7 +69,7 @@
</t>
<t t-name="One2ManyProductPicker.FlipCard">
<div class="oe_flip_container p-1 col-4 col-sm-4 col-md-2 col-lg-2 col-xl-1">
<div class="oe_flip_container p-1 col-12 col-sm-8 col-md-6 col-lg-4 col-xl-3 col-xxl-2">
<div t-attf-class="oe_flip_card {{!state &amp;&amp; 'disabled' || ''}}">
<div class="oe_flip_card_inner text-center">
<div t-attf-class="oe_flip_card_front p-0 {{(modified &amp;&amp; 'border-warning') || (state &amp;&amp; !is_virtual &amp;&amp; 'border-success') || ''}}">

View File

@@ -7,6 +7,12 @@
</xpath>
</template>
<template id="_assets_bootstrap" inherit_id="web._assets_bootstrap">
<xpath expr="link[2]">
<link type="text/css" rel="stylesheet" href="/web_widget_one2many_product_picker/static/src/scss/main_variables.scss"/>
</xpath>
</template>
<template id="assets_backend" name="account assets" inherit_id="web.assets_backend">
<xpath expr="." position="inside">
<link type="text/css" rel="stylesheet"