pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[REF] website_sale: multi-image notebook design

Browse Source
This commit is contained in:
stefanorigano
2018-04-10 17:54:11 +02:00
committed by Jeremy Kersten
parent 4f6f562c97
commit 8bda69b02b
3 changed files with 90 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/website_sale/static/src/less/website_sale_backend.less
+62
View File
@@ -0,0 +1,62 @@
.o_website_sale_image_list .o_kanban_view.o_kanban_ungrouped.o_attachments_previews {
width: auto;
.o_kanban_record.o_attachment.o_website_sale_image_card {
border: none;
background: none;
margin: 0 0 @grid-gutter-width*0.2;
padding: @o-mail-attachment-margin;
.o-flex(0, 1, 50%);
@media (min-width: @screen-sm-min) {
.o-flex(0, 0, percentage(1/3));
}
@media (min-width: @screen-md-min) {
.o-flex(0, 0, percentage(1/5));
}
@media (min-width: @screen-lg-min){
.o-flex(0, 0, percentage(1/6));
}
.o_image_box {
padding-top: 50%;
@media (min-width: @screen-sm-min) {
padding-top: 75%;
}
}
.o_image_overlay {
bottom: 16%;
background: fade(@gray-darker, 20%);
}
.o_website_sale_image_card_title {
.o-text-overflow(block);
padding:6px;
position: relative;
background: @gray-lighter;
color:@headings-color;
}
.o_website_sale_image_card_remove, .o_website_sale_image_card_size {
.o-position-absolute(0, 0);
border-radius: 0 2px;
}
.o_website_sale_image_card_size {
left: 0;
right: auto;
border-radius: 0 0 2px;
font-weight: normal;
font-size: @font-size-small - 1;
&.label-normal {
background-color: @gray-lighter;
color: @text-color;
}
}
}
}
addons/website_sale/views/product_views.xml
+27 -11
View File
@@ -89,20 +89,36 @@
</button>
</button>
<xpath expr="//notebook[last()]" position="inside">
<page string="Images" groups="base.group_no_one">
<field name="product_image_ids" mode="kanban" context="{'default_name': name, 'default_product_tmpl_id': active_id}">
<kanban string="Product Images">
<page string="Images">
<field name="product_image_ids" class="o_website_sale_image_list" context="{'default_name': name, 'default_product_tmpl_id': active_id}">
<kanban string="Product Images" class="o_attachments_previews">
<field name="name"/>
<field name="image" />
<field name="image"/>
<templates>
<t t-name="kanban-box">
<div class="oe_kanban_global_click">
<a t-if="!read_only_mode" type="delete" class="fa fa-times pull-right"/>
<div class="o_kanban_image">
<img t-if="record.image.raw_value" t-att-src="'data:image/png;base64,'+record.image.raw_value"/>
</div>
<div class="oe_kanban_details">
<field name="name"/>
<div class="o_attachment oe_kanban_global_click o_website_sale_image_card">
<div class="o_attachment_wrap">
<div class="o_image_box">
<div class="o_attachment_image" t-att-style="'background-image:url(data:image/png;base64,'+record.image.raw_value +')'"/>
<div t-attf-class="o_image_overlay" t-att-title="record.name.value"/>
<div class="o_website_sale_image_card_title" t-att-title="record.name.value">
<field name="name"/>
</div>
</div>
<t t-set="size" t-value="[record.image.value][0]"/>
<t t-set="size_status" t-value="'normal'" t-if="size.indexOf('Bytes') !== -1 or ( size.indexOf('Kb') !== -1 and size[2]=='.')"/>
<t t-set="size_status" t-value="'warning'" t-elif="( size.indexOf('Kb') !== -1 and size[3]=='.')"/>
<t t-set="size_status" t-value="'danger'" t-else=""/>
<t t-set="message" t-value="'Acceptable file size'" t-if="size_status == 'normal'"></t>
<t t-set="message" t-value="'Huge file size. The image should be optimized/reduced.'" t-elif="size_status == 'warning'"></t>
<t t-set="message" t-value="'Optimization required! Reduce the image size or increase your compression settings.'" t-else=""></t>
<span t-attf-class="o_website_sale_image_card_size label label-#{size_status}" t-att-title="message">
<t t-esc="record.image.value"/>
</span>
<a t-if="!read_only_mode" type="delete" class="btn btn-xs btn-default o_website_sale_image_card_remove"><i class="fa fa-trash"/></a>
</div>
</div>
</t>
addons/website_sale/views/templates.xml
+1
View File
@@ -5,6 +5,7 @@
<xpath expr="." position="inside">
<script type="text/javascript" src="/website_sale/static/src/js/website_sale_backend.js"></script>
<link rel="stylesheet" href="/website_sale/static/src/less/website_sale_dashboard.less"/>
<link rel="stylesheet" href="/website_sale/static/src/less/website_sale_backend.less"/>
</xpath>
</template>