Techsystech
/
web
mirror of https://github.com/OCA/web.git
3
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

[IMP] web_refresher: Backport refresh way from v17

pull/2787/head
Carlos Roca 2024-03-28 17:10:26 +01:00
parent baf589950a
commit 8ffee9f78e
10 changed files with 169 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web_refresher/README.rst
View File

@ -7,7 +7,7 @@ Web Refresher
!! This file is generated by oca-gen-addon-readme !!
!! changes will be overwritten. !!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! source digest: sha256:4ef545bbf655053c91d43dc4f35993c3a7e5cbe1c0989e5ca8a6d25bab77851b
!! source digest: sha256:72dfc3fadb6b640422ed2786d2036e3c550c09a4a55fed57e92c3caeb4b1b176
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
.. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png

10
web_refresher/__manifest__.py
View File

@ -9,13 +9,9 @@
"auto_install": False,
"assets": {
"web.assets_backend": [
"web_refresher/static/src/scss/refresher.scss",
"web_refresher/static/src/js/refresher.esm.js",
"web_refresher/static/src/js/control_panel.esm.js",
"web_refresher/static/src/js/pager.esm.js",
"web_refresher/static/src/xml/refresher.xml",
"web_refresher/static/src/xml/control_panel.xml",
"web_refresher/static/src/xml/pager.xml",
"web_refresher/static/src/**/*.scss",
"web_refresher/static/src/**/*.esm.js",
"web_refresher/static/src/**/*.xml",
],
},
}

3
web_refresher/static/description/index.html
View File

@ -1,3 +1,4 @@
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
@ -366,7 +367,7 @@ ul.auto-toc {
!! This file is generated by oca-gen-addon-readme !!
!! changes will be overwritten. !!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! source digest: sha256:4ef545bbf655053c91d43dc4f35993c3a7e5cbe1c0989e5ca8a6d25bab77851b
!! source digest: sha256:72dfc3fadb6b640422ed2786d2036e3c550c09a4a55fed57e92c3caeb4b1b176
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
<p><a class="reference external image-reference" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external image-reference" href="http://www.gnu.org/licenses/agpl-3.0-standalone.html"><img alt="License: AGPL-3" src="https://img.shields.io/badge/licence-AGPL--3-blue.png" /></a> <a class="reference external image-reference" href="https://github.com/OCA/web/tree/16.0/web_refresher"><img alt="OCA/web" src="https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github" /></a> <a class="reference external image-reference" href="https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_refresher"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external image-reference" href="https://runboat.odoo-community.org/builds?repo=OCA/web&amp;target_branch=16.0"><img alt="Try me on Runboat" src="https://img.shields.io/badge/runboat-Try%20me-875A7B.png" /></a></p>
<p>Adds a button next to the pager (in trees/kanban views) to refresh the displayed list.</p>

20
web_refresher/static/src/js/control_panel.esm.js
View File

@ -1,9 +1,27 @@
/** @odoo-module **/
/* Copyright 2024 Tecnativa - Carlos Roca
/* Copyright 2022 Tecnativa - Alexandre D. Díaz
* Copyright 2022 Tecnativa - Carlos Roca
* Copyright 2023 Taras Shabaranskyi
* License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). */
import {ControlPanel} from "@web/search/control_panel/control_panel";
import {Refresher} from "./refresher.esm";
import {patch} from "@web/core/utils/patch";
ControlPanel.components = Object.assign({}, ControlPanel.components, {
Refresher,
});
patch(ControlPanel.prototype, "web_refresher.ControlPanel", {
setup() {
this._super(...arguments);
const {config, searchModel} = this.env;
const forbiddenSubType = ["base_settings"];
if (!forbiddenSubType.includes(config.viewSubType)) {
this.refresherProps = {
searchModel: searchModel,
pagerProps: this.pagerProps,
};
}
},
});

9
web_refresher/static/src/js/pager.esm.js
View File

@ -1,9 +0,0 @@
/** @odoo-module **/
/* Copyright 2022 Tecnativa - Carlos Roca
* License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). */
import {Pager} from "@web/core/pager/pager";
import {Refresher} from "./refresher.esm";
Pager.components = Object.assign({}, Pager.components, {
Refresher,
});

115
web_refresher/static/src/js/refresher.esm.js
View File

@ -1,36 +1,109 @@
/** @odoo-module **/
/* Copyright 2022 Tecnativa - Alexandre D. Díaz
* Copyright 2022 Tecnativa - Carlos Roca
* Copyright 2023 Taras Shabaranskyi
* License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). */
const {Component} = owl;
import {useService} from "@web/core/utils/hooks";
import {Component} from "@odoo/owl";
import {useDebounced} from "@web/core/utils/timing";
export function useRefreshAnimation(timeout) {
const refreshClass = "o_content__refresh";
let timeoutId = null;
/**
* @returns {DOMTokenList|null}
*/
function contentClassList() {
const content = document.querySelector(".o_content");
return content ? content.classList : null;
}
function clearAnimationTimeout() {
if (timeoutId) {
clearTimeout(timeoutId);
}
timeoutId = null;
}
function animate() {
clearAnimationTimeout();
contentClassList().add(refreshClass);
timeoutId = setTimeout(() => {
contentClassList().remove(refreshClass);
clearAnimationTimeout();
}, timeout);
}
return animate;
}
export class Refresher extends Component {
setup() {
super.setup();
this.action = useService("action");
this.refreshAnimation = useRefreshAnimation(1000);
this.onClickRefresh = useDebounced(this.onClickRefresh, 200);
}
async _doRefresh() {
const viewAction = this.action.currentController.action;
// Allow refresh reports
if (["ir.actions.report", "ir.actions.client"].includes(viewAction.type)) {
const options = {};
if (this.env.config.breadcrumbs.length > 1) {
const breadcrumb = this.env.config.breadcrumbs.slice(-1);
await this.action.restore(breadcrumb.jsId);
} else {
options.clearBreadcrumbs = true;
}
return this.action.doAction(viewAction, options);
/**
* @returns {Boolean}
*/
get displayButton() {
const {searchModel, pagerProps} = this.props;
const hasSearchModel = searchModel && searchModel.search;
return Boolean(hasSearchModel || (pagerProps && pagerProps.onUpdate));
}
/**
* @returns {Boolean}
* @private
*/
_searchModelRefresh() {
const {searchModel} = this.props;
if (searchModel && typeof searchModel.search === "function") {
searchModel.search();
return true;
}
// Note: here we use the pager props, see xml
const {limit, offset} = this.props;
if (!limit && !offset) {
return;
return false;
}
/**
* @returns {Promise<Boolean>}
* @private
*/
async _pagerRefresh() {
const pagerProps = this.props.pagerProps;
if (pagerProps && typeof pagerProps.onUpdate === "function") {
const {limit, offset} = pagerProps;
await pagerProps.onUpdate({offset, limit});
return true;
}
return false;
}
/**
* @returns {Promise<Boolean>}
*/
async refresh() {
let updated = this._searchModelRefresh();
if (!updated) {
updated = await this._pagerRefresh();
}
return updated;
}
async onClickRefresh() {
const updated = await this.refresh();
if (updated) {
this.refreshAnimation();
}
return this.props.onUpdate({offset, limit});
}
}
Refresher.template = "web_refresher.Button";
Object.assign(Refresher, {
template: "web_refresher.Button",
props: {
searchModel: {type: Object, optional: true},
pagerProps: {type: Object, optional: true},
},
});

26
web_refresher/static/src/scss/refresher.scss
View File

@ -1,11 +1,23 @@
.oe_cp_refresher {
margin: auto 0 auto auto;
padding-left: 5px;
text-align: right;
margin: auto 0 auto 0;
user-select: none;
flex-grow: 1;
}
.o_cp_bottom_right.oe_cp_refresher {
display: flex;
flex-direction: row-reverse;
.o_content {
&__refresh {
animation: web_refresh 0.6s ease;
}
}
@keyframes web_refresh {
0% {
opacity: 1;
}
50% {
transform: translateY(10px);
opacity: 0.6;
}
100% {
opacity: 1;
}
}

34
web_refresher/static/src/xml/control_panel.xml
View File

@ -8,14 +8,9 @@
t-inherit-mode="extension"
owl="1"
>
<xpath expr="//div[hasclass('o_cp_bottom_right')]" position="after">
<div
t-if="!display['bottom-right']"
class="o_cp_bottom_right oe_cp_refresher"
role="search"
t-ref="refresher"
>
<Refresher />
<xpath expr="//div[hasclass('o_cp_pager')]" position="before">
<div class="oe_cp_refresher" role="search" t-ref="refresher">
<Refresher t-props="refresherProps" />
</div>
</xpath>
</t>
@ -25,14 +20,21 @@
t-inherit-mode="extension"
owl="1"
>
<xpath expr="//div[hasclass('o_cp_pager')]" position="after">
<div
t-if="!display['bottom-right']"
class="o_cp_bottom_right oe_cp_refresher"
role="search"
t-ref="refresher"
>
<Refresher />
<xpath expr="//div[hasclass('o_cp_pager')]" position="before">
<div class="oe_cp_refresher" role="search" t-ref="refresher">
<Refresher t-props="refresherProps" />
</div>
</xpath>
</t>
<t
t-name="web_refresher.FormControlPanel"
t-inherit="web.FormControlPanel"
t-inherit-mode="extension"
owl="1"
>
<xpath expr="//div[hasclass('o_cp_pager')]" position="before">
<div class="oe_cp_refresher" role="search" t-ref="refresher">
<Refresher t-props="refresherProps" />
</div>
</xpath>
</t>

17
web_refresher/static/src/xml/pager.xml
View File

@ -1,17 +0,0 @@
<?xml version="1.0" encoding="UTF-8" ?>
<!-- Copyright 2022 Tecnativa - Carlos Roca
License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). -->
<template>
<t
t-name="web_refresher.Pager"
t-inherit="web.Pager"
t-inherit-mode="extension"
owl="1"
>
<xpath expr="//span[hasclass('o_pager_counter')]" position="before">
<div class="oe_cp_refresher" role="search" t-ref="refresher">
<Refresher t-props="props" />
</div>
</xpath>
</t>
</template>

23
web_refresher/static/src/xml/refresher.xml
View File

@ -3,16 +3,19 @@
License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). -->
<template>
<t t-name="web_refresher.Button" owl="1">
<nav class="oe_refresher" aria-label="Pager">
<span aria-atomic="true">
<button
class="fa fa-refresh btn btn-icon oe_pager_refresh"
aria-label="Refresh"
t-on-click="_doRefresh"
title="Refresh"
tabindex="-1"
/>
</span>
<nav
class="oe_refresher"
aria-label="Refresher"
aria-atomic="true"
t-if="displayButton"
>
<button
class="fa fa-refresh btn btn-icon oe_pager_refresh"
aria-label="Refresh"
t-on-click="onClickRefresh"
title="Refresh"
tabindex="-1"
/>
</nav>
</t>
</template>