Skip to content
Permalink
Browse files

[IMP] project,web: Added ability to set cover image on kanban

Previously, we could only set cover image on a kanban view
of project task. This commit makes the feature generic so
now cover image can be added to any kanban view.

Technical notes:
- Code to set cover images is moved from project to web
  to make the feature generic
- Field used to display the cover image has to be set as
  'data-field' attribute on the kanban dropdown's  menu
  related to cover image
- Developer will have to take care while designing kanban
  views with cover image ability in such a way that it
  does not break the design

Task - 32108
  • Loading branch information...
vas-odoo authored and dja-odoo committed Jul 12, 2018
1 parent 48ab391 commit d050602af9d5c901c5d3f33bed19ebc926b1225c
@@ -36,7 +36,6 @@
'data/project_mail_template_data.xml',
'data/project_data.xml',
],
'qweb': ['static/src/xml/project.xml'],
'demo': ['data/project_demo.xml'],
'test': [
],
@@ -1,13 +1,8 @@
odoo.define('project.update_kanban', function (require) {
'use strict';

var core = require('web.core');
var Dialog = require('web.Dialog');
var KanbanRecord = require('web.KanbanRecord');

var QWeb = core.qweb;
var _t = core._t;

KanbanRecord.include({
//--------------------------------------------------------------------------
// Private
@@ -25,89 +20,5 @@ KanbanRecord.include({
}
},

//--------------------------------------------------------------------------
// Handlers
//--------------------------------------------------------------------------

/**
* @override
* @private
*/
_onKanbanActionClicked: function (ev) {
var self = this;
if (this.modelName === 'project.task' && $(ev.currentTarget).data('type') === 'set_cover') {
ev.preventDefault();

var domain = [['res_model', '=', 'project.task'], ['res_id', '=', this.id], ['mimetype', 'ilike', 'image']];
this._rpc({
model: 'ir.attachment',
method: 'search_read',
domain: domain,
fields: ['id', 'name'],
})
.then(open_cover_images_dialog);
} else {
this._super.apply(this, arguments, ev);
}

function open_cover_images_dialog(attachment_ids) {
self.imageUploadID = _.uniqueId('o_cover_image_upload');
self.image_only = true; // prevent uploading of other file types
var coverID = self.record.displayed_image_id && self.record.displayed_image_id.raw_value;
var $content = $(QWeb.render("project.SetCoverModal", {
cover_id: coverID,
attachment_ids: attachment_ids,
widget: self
}));
var $imgs = $content.find('.o_kanban_task_cover_image');
var dialog = new Dialog(self, {
title: _t("Set a Cover Image"),
buttons: [{text: _t("Select"), classes: attachment_ids.length ? 'btn-primary' : 'd-none', close: true, disabled: !coverID, click: function () {
var $img = $imgs.filter('.o_selected').find('img');
var data = {
id: $img.data('id'),
display_name: $img.data('name')
};
self._updateRecord({displayed_image_id: data});
}}, {text: _t('Upload and Set'), classes: attachment_ids.length ? '' : 'btn-primary', close: false, click: function () {
$content.find('input.o_input_file').click();
}}, {text: _t("Remove Cover Image"), classes: coverID ? '' : 'd-none', close: true, click: function () {
self._updateRecord({displayed_image_id: false});
}}, {text: _t("Discard"), close: true}],
$content: $content,
});
dialog.opened().then(function () {
var $selectBtn = dialog.$footer.find('.btn-primary');
$content.on('click', '.o_kanban_task_cover_image', function (ev) {
$imgs.not(ev.currentTarget).removeClass('o_selected');
$selectBtn.prop('disabled', !$(ev.currentTarget).toggleClass('o_selected').hasClass('o_selected'));
});

$content.on('dblclick', '.o_kanban_task_cover_image', function (ev) {
var $img = $(ev.currentTarget).find('img');
var data = {
id: $img.data('id'),
display_name: $img.data('name')
};
self._updateRecord({displayed_image_id: data});
dialog.close();
});
$content.on('change', 'input.o_input_file', function (event) {
$content.find('form.o_form_binary_form').submit();
});
$(window).on(self.imageUploadID, function () {
var images = Array.prototype.slice.call(arguments, 1);
self._updateRecord({
displayed_image_id: {
id: images[0].id,
display_name: images[0].filename
}
});
dialog.close();
});
});
dialog.open();
}
},
});
});
@@ -55,24 +55,3 @@
}
}

.o_kanban_task_cover_container {
.o_kanban_task_cover_image {
display: inline-block;
position: relative;
height: 120px;
width: 120px;
margin: 10px;
cursor: pointer;
outline: 2px solid transparent;
box-shadow: 0px 0px 1px 1px #ccc;
&.o_selected {
outline-color: $o-brand-primary;
}
> img {
@include o-position-absolute($top: 0, $left: 0, $right: 0, $bottom: 0);
margin: auto;
max-height: 100%;
max-width: 100%;
}
}
}

This file was deleted.

Oops, something went wrong.

This file was deleted.

Oops, something went wrong.
@@ -16,10 +16,4 @@
<script type="text/javascript" src="/project/static/src/js/portal_rating.js"/>
</xpath>
</template>

<template id="qunit_suite" name="project_test" inherit_id="web.qunit_suite">
<xpath expr="//t[@t-set='head']" position="inside">
<script type="text/javascript" src="/project/static/tests/project_tests.js"></script>
</xpath>
</template>
</odoo>
@@ -570,7 +570,7 @@
<span class="fa fa-ellipsis-v"/>
</a>
<div class="dropdown-menu" role="menu">
<a t-if="widget.editable" role="menuitem" type="set_cover" class="dropdown-item">Set Cover Image</a>
<a t-if="widget.editable" role="menuitem" type="set_cover" class="dropdown-item o_kanban_set_cover" data-field="displayed_image_id">Set Cover Image</a>
<a name="%(portal.portal_share_action)d" role="menuitem" type="action" class="dropdown-item">Share</a>
<a t-if="widget.editable" role="menuitem" type="edit" class="dropdown-item">Edit Task</a>
<a t-if="widget.deletable" role="menuitem" type="delete" class="dropdown-item">Delete</a>
Oops, something went wrong.

0 comments on commit d050602

Please sign in to comment.
You can’t perform that action at this time.