How to open tree view when click on kanban card when use
oe_kanban_global_click
It goes to form view but i want on click, goes to tree view. Below code i used:
<templates>
<t t-name="kanban-box">
<div t-attf-class="oe_kanban_color_#{kanban_getcolor(record.color.raw_value)} oe_kanban_card oe_kanban_global_click">
<div class="o_kanban_record_bottom">
<div class="oe_kanban_bottom_left">
<span><strong>Weather: </strong><t t-esc="record.weather_type.value"/></span>
</div>
<div class="oe_kanban_bottom_right">
<span><strong>Humidity: </strong><t t-esc="record.humidity.value"/>%</span>
</div>
</div>
</div>
</t>
</templates>
Related
I need your help, I have some divs in a view in odoo 13, I need to bring the data from an external model "maintenance.stage" render them in those divs, can someone give me an example of how to do it with a controller to bring those logs and be able to display them in those divs? every time i add a new record it should render in those divs.
enter image description here
enter image description here
I hope this helps,
This is a controller exemple:
class ControllerExemple(http.Controller):
#http.route('/path/', auth='public', type='http',
methods=["GET","POST"], website=True)
def function_exemple(self):
obj = request.env['maintenance.stage'].browse(<id>)
return request.render("module.your_view_id", {'object': obj})
There is a exemple view :
<template id="your_view_id" name="Something">
<t t-call="website.layout">
<div class="container">
<div><span t-out="object.the_field_you_need"/></div>
</div>
</t>
</template>
It seems that you have several values to display, so use the foreach in your template :
<template id="your_view_id" name="Something">
<t t-call="website.layout">
<t t-foreach="object.the_field_you_need" t-as="value">
<div class="container">
<div><span t-out="value"/></div>
</div>
</t>
</t>
</template>
https://odoo-master.readthedocs.io/en/master/reference/qweb.html
I have a script that needs to output the results of an answer on a modal window. But currently it isn't rendering. The results output correctly outside of the modal HTML; even inspecting the modal source when it is visible shows the data isn't rendering; i.e. the results aren't hidden from view, they aren't calculated at all.
The full source is at
http://www.sic-parvis-magna.com/sicpm/mayan-vue/index.html
The variables in question are userAnswer, userAnswerDisplay, and userMessage
<div class="modal">
<div class="modal-background"></div>
<div class="modal-card">
<section class="modal-card-body">
<div v-if="userAnswer !== -1">
<div id="user-answer" v-html="userAnswerDisplay"></div>
<div id="user-answer-message" v-html="userMessage"></div>
<div id="user-hint"></div>
</div>
</section>
<footer class="modal-card-foot">
<button class="button is-success">Save changes</button>
<button class="button modal-close">Cancel</button>
</footer>
<button class="modal-close is-large" aria-label="close"></button>
</div>
</div>
The problem is your modal template is outside the Vue app (i.e., section#mainapp), so that template is not processed by Vue:
<section id="mainapp">...</section>
<div class="modal">...</div> <!-- FIXME: Move this into section above -->
Move the modal into section#mainapp for the computed properties to be evaluated.
demo
I am developing an Angular 4 application using ngx-bootstrap modals heavily. I am currently using the template + modalService way of opening up modals. During a click event, this line of code is called:
#ViewChild() worklistTemplate;
// ...
this.modalRef = this.modalService.show(this.worklistTemplate, this.config);
And the worklist template looks like this:
<ng-template #worklistTemplate>
<app-action-view
[leftButtons]="leftButtons"
[labelHeader]="modalHeader"
[labelIcon]="modalIcon"
[modalRef]="modalRef">
<div class="row modal-info-panel">
<div class="col-xs-4 modal-user-info">
<fa name="mars" class="gender-icon"></fa>
<div class="field-panel">
<input type="text"
[ngModel]="rowInfo.lastName"
[ngClass]="{ 'modal-editable-field': modalFieldsEditable }"
[disabled]="!modalFieldsEditable">
<input type="text"
[ngModel]="rowInfo.firstName"
[ngClass]="{ 'modal-editable-field': modalFieldsEditable }"
[disabled]="!modalFieldsEditable">
<div>
<label for="modal-mrn">MRN --</label>
<input id="modal-mrn" type="text"
[ngModel]="rowInfo.mrn"
[ngClass]="{ 'modal-editable-field': modalFieldsEditable }"
[disabled]="!modalFieldsEditable">
</div>
<div>
<label for="modal-dob">DOB --</label>
<input id="modal-dob" type="text"
[ngModel]="rowInfo.birthDate"
[ngClass]="{ 'modal-editable-field': modalFieldsEditable }"
[disabled]="!modalFieldsEditable">
</div>
<div class="edit-panel">
<fa *ngIf=modalFieldsEditable class="worklist-edit-buttons green-hover link" name="floppy-o" tooltip="Save" (click)=saveChanges()></fa>
<fa *ngIf=modalFieldsEditable class="worklist-edit-buttons red-hover link" name="times" tooltip="Cancel" (click)=toggleModalFields()></fa>
</div>
</div>
</div>
<div class="col-xs-8 modal-id-info">
Associated ID
<div class="full-width">
<div class="row" *ngFor="let i of rowInfo.associatedIDs">
<div class="col-xs-6 cell">{{i.id}}</div><div class="col-xs-6 cell">{{i.source}}</div>
</div>
</div>
</div>
</div>
<div class="row" id="modal-table">
<app-table-view
[columns]="objDetailsCols"
[tableData]="objDetailsData"
[expandTemplate]="rowImageContainer"
[expandColStyle]="expandColStyle">
</app-table-view>
</div>
<div *ngIf="resolvePanelVisible" class="resolve-panel"
[#slideRight]>
<div class="resolve-label">
<fa class="lt-icon" name="wrench"></fa>
Resolve QA Issue
</div>
<div class="resolve-body">
Hello, World!
</div>
<div class="resolve-footer">
<a>Validate</a>
<a>Resolve</a>
<a>Reload</a>
<a (click)="toggleResolvePanel()">Close</a>
</div>
</div>
</app-action-view>
</ng-template>
The modal can be closed by clicking outside of the modal boundaries or there is a button inside the ActionViewComponent that calls modalRef.hide().
Memory usage increases drastically as more and more modals are opened. In fact, if I open the modal around 5 times, the application becomes sluggish and almost unusable. This is especially apparent if there are many rows in our TableViewComponent.
Is there a problem with the way I am using the modals, or is this an issue related to ngx-bootstrap modals? OR, is the issue related to the browser and unavoidable? I am developing on Chrome 62 right now.
I have verified that onDestroy is never called on the TableViewComponent inside the modal. It is not even called if I navigate to a different page component, though another table (not in the template) does have onDestroy called when navigating from the page.
Any feedback is appreciated greatly- I have been stuck for way too long on this.
This is an issue of ngx-bootstrap, unfortunately. I created a pull request (https://github.com/valor-software/ngx-bootstrap/pull/3179) so this will be fixed as soon as my PR is merged and new version is released.
based on the solution that work perfectly for the chevron (Bootstrap 3 Collapse show state with Chevron icon):
function toggleChevron(e) {
$(e.target)
.prev('.panel-heading')
.find('i.indicator')
.toggleClass('glyphicon-chevron-down glyphicon-chevron-up');
}
$('#accordion').on('hidden.bs.collapse shown.bs.collapse', toggleChevron);
There is a way to change also the panel class from .panel-default to .panel-primary when then panel is open?
i've this panel setup:
<div class="panel panel-default">
<div class="panel-heading" data-toggle="collapse" data-parent="#accordion" data-target="#collapse6">
<h4 class="panel-title">
<a class="accordion-toggle">PANEL TITLE</a><i class="indicator glyphicon glyphicon-chevron-right pull-right"></i>
</h4>
</div>
<div id="collapse6" class="panel-collapse collapse">
<div class="panel-body">
<fieldset>
...
</fieldset>
</div>
</div>
</div>
thank you so much.
The following code would help. So on click you select the parent element of the target which would be the div tag containing panel-default class and then you just toggle panel-default and panel-primary classes.
function toggleChevron(e) {
$(e.target).parent().toggleClass('panel-default');
$(e.target).parent().toggleClass('panel-primary');
$(e.target)
.prev('.panel-heading')
.find("i.indicator")
.toggleClass('glyphicon-chevron-down glyphicon-chevron-up');
}
$('#accordion').on('hidden.bs.collapse', toggleChevron);
$('#accordion').on('shown.bs.collapse', toggleChevron);
link: http://jsfiddle.net/saa93/hpzj2z5a/1/
I've managed to create a new hook in the default template of prestashop but I can't place "featured products" under "image slider" (see image to understand what I mean).
http://oi59.tinypic.com/15s95oy.jpg
I've added a segment of header.tpl and the place where I've put my div. Do you know what I should change in order to get the final result?
<!-- Header -->
<div id="header" class="grid_9 alpha omega">
<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
<img class="logo" src="{$logo_url}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if}/>
</a>
<div id="header_right" class="grid_9 omega">
{$HOOK_TOP}
</div>
</div>
<div id="columns" class="grid_9 alpha omega clearfix">
<!-- Left -->
<div id="left_column" class="column grid_2 alpha">
{$HOOK_LEFT_COLUMN}
</div>
<!-- Center -->
<div id="center_column" class=" grid_5">
<div id="myCustomHook"> {hook h='displayTop2'} </div><!--my hook-->
{/if}
If both "Featured Products" and "Image Slider" are attached to the same hook, you can set their positions within the hook from BackOffice > Modules > Positions.
You can also make this for a better control of position :
{hook h='displayTop' mod='slider'}
{hook h='displayTop' mod='homefeat'}