i need to sort my report ascending or descending
according to "a.sales_count"
<tr t-foreach="percent" t-as="a">
<t></t>
<td style="white-space: text-nowrap;">
<span t-esc="a.name"/>
</td>
<td style="white-space: text-nowrap;">
<t t-if="a.sales_count == 0">
<strong>There are no sold kind in stock</strong>
</t>
<t t-elif="a.sales_count > 0">
<span t-esc="a.sales_count"/>
</t>
</td>
<td style="white-space: text-nowrap;">
<span t-esc="a.purchase_count"/>
</td>
</tr>
Try below code,
<tr t-foreach="sorted(percent, key= lambda x:x.get('sales_count')" t-as="a">
<td style="white-space: text-nowrap;">
<span t-esc="a.name"/>
</td>
<td style="white-space: text-nowrap;">
<t t-if="a.sales_count == 0">
<strong>There are no sold kind in stock</strong>
</t>
<t t-elif="a.sales_count > 0">
<span t-esc="a.sales_count"/>
</t>
</td>
<td style="white-space: text-nowrap;">
<span t-esc="a.purchase_count"/>
</td>
Hope this will help you
Related
I have a Vuetify data table with draggable rows. Working well. Here is my code:
<template v-slot:body="props">
<draggable
:list="props.items"
tag="tbody"
>
<tr
v-for="(item, index) in props.items"
:key="index"
#drop="dropIntoParentRelationship($event, index)"
#dragover.prevent
#dragenter.prevent
#dragstart="startDrag($event, item, index)"
>
<td>
<v-icon
v-if="!_.isEmpty(item.children)"
color="#68007d"
#click="show = !show"
>add_circle</v-icon>
</td>
<td>
<v-checkbox
v-if="item.parent"
color="#68007d"
></v-checkbox>
</td>
<td v-if="item.parent">
<div class="text-truncate" style="max-width: 230px;">
{{ item.product_title }}
</div>
</td>
<td>
<div class="text-truncate" style="max-width: 230px;">
{{ item.sku }}
</div>
</td>
<td class="text-center">
<country-flag
:country='countryFlags[item.marketplace]'
size='normal'
class='text-center'
/>
</td>
<td class="text-center">
<p class="mt-4">{{item.quantity}}</p>
</td>
<td class="">
<p class="mt-4">{{item.currency_symbol}}{{item.price}}</p>
</td>
<td class="text-center">
<v-icon
:color="item.on_shopify ? 'green darken-4' : 'red darken-4'"
>
{{ item.on_shopify ? 'done' : 'close' }}
</v-icon>
</td>
<td class="text-center">
<v-icon
:color="item.uploaded ? 'green darken-4' : 'red darken-4'"
>
{{ item.uploaded ? 'done' : 'close' }}
</v-icon>
</td>
</tr>
</draggable>
</template>
The issue however is that I want to display children data in a row underneath the parent data which I could then also drag and drop and I'm lost on how to do this.
Any ideas?
I am trying to make a filter for my table but i see a problem there. Maybe the problem is from table structure couse i fetch all structure as it is on mysql. Does anyone help to make this filter in right way.
The collapse content under comment is the head i display when i want to filter
<table class="table table-hover align-middle mb-0">
<thead class="">
<tr>
<th><input type="checkbox" class="form-check-input" v-model="selectAll" title="Select All"></th>
<th v-if="!isHidden[index]" v-for="(header, index) in visibleHeaders" :key="index" scope="col">
{{ header }}
</th>
<th>ACTION</th>
</tr>
</thead>
<!-- Collapsed content ./ -->
<thead class="collapse" id="collapseFilter">
<tr>
<th>#</th>
<th v-for="(header, index) in visibleHeaders" scope="col">
<select id="" class="form-select" >
<option v-for="column in leads">
<div v-for="(atr, key, index) in column">
{{atr}}
</div>
</option>
</select>
</th>
</tr>
</thead>
<!-- ./ Collapse contet -->
<tbody>
<tr v-show="leads.length" v-for="column in leads" >
<td>
<input type="checkbox" class="form-check-input" v-model="selected" :value="column.id" />
</td>
<td v-if="!isHidden[index]" v-for="(atr, key, index) in column">
<div v-if="atr == 'new'">
<span class="badge bg-info">{{ atr }}</span>
</div>
<div v-else-if="atr == 'contract'">
<span class="badge bg-success">{{ atr }}</span>
</div>
<div v-else>
<span >{{ atr }}</span>
</div>
</td>
<td>
<button #click="editLead(column.id)" type="button" class="btn btn-sm btn-secondary" data-mdb-toggle="modal" data-mdb-target="#editLeadModal" >
<i class="fa-solid fa-eye"></i>
</button>
</td>
</tr>
<tr v-show="!leads.length">
<td colspan="12" class="text-center">Sorry :( No data found.</td>
</tr>
</tbody>
</table>
If i try to loop only v-for="column in lead"
I'm creating a custom module for odoo 11. I would like to add information to the customer invoices. I tried changing the sale.report_invoice_layouted which inherits report_invoice_document. Changes i made in sale.report_invoice_layouted Qweb are visible when printing the pdf. For example I change the field l.name to l.price_unit and this works.
But no I created a custom module and have this template.xml
<odoo>
<data>
<template id="report_invoice_document_tenure_inherit" inherit_id="sale.report_invoice_layouted" priority="16">
<xpath expr="////span[#t-field='l.name']" position="replace">
<span t-field="l.price_unit"/>
</xpath>
</template>
</data>
This has no effect at all. Nothing is changed in the printed pdf. I checked "Reload attachment" and it is set to off.
Any ideas on what I'm doing wrong?
Edit:
this is the original sale.report_invoice_layouted which I'm trying to change via module:
<?xml version="1.0"?>
<data inherit_id="account.report_invoice_document">
<xpath expr="//table/tbody/tr/td[#id='subtotal']" position="attributes">
<attribute name="groups">!sale.group_show_price_total</attribute>
</xpath>
<xpath expr="//table/tbody/tr/td[#id='subtotal']" position="after">
<td class="text-right" groups="sale.group_show_price_total">
<span t-field="l.price_total" t-options="{"widget": "monetary", "display_currency": o.currency_id}"/>
</td>
</xpath>
<xpath expr="//table" position="attributes">
<attribute name="groups">!sale.group_sale_layout</attribute>
</xpath>
<xpath expr="//table" position="after">
<t groups="sale.group_sale_layout" t-foreach="o.order_lines_layouted()" t-as="page" name="lines_layouted">
<table class="table table-condensed">
<thead>
<tr>
<th>Description</th>
<th class="text-right">Quantity</th>
<th class="text-right">Unit Price</th>
<th t-if="display_discount" class="text-right" groups="sale.group_discount_per_so_line">Disc.(%)</th>
<th class="text-right">Taxes</th>
<th class="text-right">Amount</th>
</tr>
</thead>
<tbody class="invoice_tbody">
<t t-foreach="page" t-as="layout_category">
<t t-if="layout_category_size > 1 or page_size > 1" groups="sale.group_sale_layout">
<tr class="active">
<td colspan="7" style="font-weight: bold; border-bottom: 1px solid black;">•
<t t-esc="layout_category['name']"/>
</td>
</tr>
</t>
<!-- Lines associated -->
<t t-foreach="layout_category['lines']" t-as="l">
<tr>
<td><span t-field="l.name"/>
<span>TEST</span></td>
<td class="text-right">
<span t-field="l.quantity"/>
<span t-field="l.uom_id" groups="product.group_uom"/>
</td>
<td class="text-right">
<span t-field="l.price_unit"/>
</td>
<td t-if="display_discount" class="text-right" groups="sale.group_discount_per_so_line">
<span t-field="l.discount"/>
</td>
<td class="text-right">
<span t-esc="', '.join(map(lambda x: x.description or x.name, l.invoice_line_tax_ids))"/>
</td>
<td class="text-right">
<span t-field="l.price_subtotal" t-options="{"widget": "monetary", "display_currency": o.currency_id}"/>
</td>
<td class="text-right" groups="sale.group_show_price_total">
<span t-field="l.price_total" t-options="{"widget": "monetary", "display_currency": o.currency_id}"/>
</td>
</tr>
</t>
<t t-if="(layout_category_size > 1 or page_size > 1) and layout_category['subtotal']" groups="sale.group_sale_layout">
<tr class="text-right">
<td colspan="6">
<strong>Subtotal: </strong>
<t t-set="subtotal" t-value="sum(line.price_subtotal for line in layout_category['lines'])"/>
<span t-esc="subtotal" t-options="{'widget': 'monetary', 'display_currency': o.currency_id}"/>
</td>
</tr>
</t>
</t>
</tbody>
</table>
<t t-if="page_index < page_size - 1" groups="sale.group_sale_layout">
<p style="page-break-before:always;"> </p>
</t>
</t>
</xpath>
Replace your code:
<xpath expr="//t[#name='lines_layouted']//tbody/t/t[2]//span[#t-field='l.name']" position="replace">
<span t-field="l.price_unit"/>
</xpath>
I am creating a friends component that lists users friends based on a response from an endpoint.
I want to render the responses into rows of a table as part of this I would like to use the bootstrap striped-table class
https://getbootstrap.com/docs/4.0/content/tables/#striped-rows
when I do a v-for the table renders correctly but the rows are only showing one background color
This is my template code
<template>
<div>
<h5 class="mb-4">Friends</h5>
<table class="table table-borderless table-striped ">
<tbody>
<div v-for="(friend, index) in UserStore.friends">
<tr>
<td class="text-center" style="width: 100px;">
<img style="width: 100px;" :src="friend.avatar" alt="User Image" class="rounded-circle">
</td>
<td>
{{friend.name}}<br>
<small>29 years old on Friday</small>
</td>
<td class="text-center" style="width: 80px;">
<i class="fa fa-gift"></i>
</td>
</tr>
</div>
</tbody>
</table>
<div v-if="!UserStore.friends">
<h6>You don't have any friends :(</h6>
Lets solve that Right now!
</div>
</div>
</template>
You should use a template element to render these rows. .table-striped works with sibling rows and in your code the rows are not siblings because they each have a div parent, so each row is seen as the first row.
<tbody>
<template v-for="(friend, index) in UserStore.friends">
<tr>
<td class="text-center" style="width: 100px;">
<img style="width: 100px;" :src="friend.avatar" alt="User Image" class="rounded-circle">
</td>
<td>
{{friend.name}}<br>
<small>29 years old on Friday</small>
</td>
<td class="text-center" style="width: 80px;">
<i class="fa fa-gift"></i>
</td>
</tr>
</template>
</tbody>
I have set both the header and the footer to fixed but still cannot get the content to adjust in IPhone.
Here is my layout code
<body>
<div data-role="page" #(Page.Id == null ? string.Empty : "id=" + Page.Id) data-fullscreen="false">
#* #RenderSection("MoreCode", false)*#
#if (IsSectionDefined("Header"))
{
<div data-role="header" data-position="fixed">
#RenderSection("Header", false)
</div><!-- /header -->
}
<div data-role="content">
#RenderBody()
</div><!-- /content -->
<div data-role="footer" data-tap-toggle="false" data-position="fixed">
<div class="center-wrapper">
<table border="0">
<tr>
<td>
<label for="basic">
Place Of Interest
</label>
</td>
</tr>
<tr>
<td>
<table border="0">
<tr>
<td>
Terms of Use
</td>
<td>
<label for="basic">
|
</label>
</td>
<td>
Privacy Policy
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
</body>
Here is my View
<h3 style='color:#4FA600; font-weight:bold;'>#ViewBag.Number</h3>
<table border="1" width="100%">
<tr>
<td align="center" valign=middle style=' font-weight:bold; color:#FFFFFF; background:#4FA600; '>
<label for="basic">Available Documents</label>
</td>
</tr>
<tr>
<td>
<table width="100%" height="100%">
<tr>
<td align="left" valign="middle" style=' font-weight:bold;'>
Type
</td>
<td align="center" valign="middle" style=' font-weight:bold;'>
Description
</td>
</tr>
#{
foreach(var row in Model)
{
<tr>
<td align="left" valign="middle">
#row.DocType
</td>
<td align="center" valign="middle">
#row.Description
</td>
</tr>
}
}
</table>
</td>
</tr>
</table>
Isnt jquerymobile suppose to manually adjust? It renders fine in firefox. What can I do to make the content fully display?
\The issue was I had this in my css:
[data-role=page]{height: 100% !important; position:relative !important;}
I got this code from use theme roller not sure why this messed it up. Maybe someone can clarify would be appreciated