[IMP] website: allow to add a website page from the new content menu
See merge commit for more information. task-2687506
This commit is contained in:
Younn Olivier
@@ -176,6 +176,9 @@
|
||||
'website/static/src/services/website_service.js',
|
||||
'website/static/src/components/navbar/navbar.js',
|
||||
'website/static/src/components/dialog/dialog.js',
|
||||
'website/static/src/components/dialog/dialog.scss',
|
||||
'website/static/src/components/switch/switch.js',
|
||||
'website/static/src/components/switch/switch.scss',
|
||||
'website/static/src/systray_items/*.js',
|
||||
'website/static/src/systray_items/*.scss',
|
||||
],
|
||||
|
||||
@@ -597,8 +597,8 @@ class Website(Home):
|
||||
url = page['url']
|
||||
|
||||
if ext_special_case: # redirect non html pages to backend to edit
|
||||
return werkzeug.utils.redirect('/web#id=' + str(page.get('view_id')) + '&view_type=form&model=ir.ui.view')
|
||||
return werkzeug.utils.redirect(url + "?enable_editor=1")
|
||||
return '/web#id=' + str(page.get('view_id')) + '&view_type=form&model=ir.ui.view'
|
||||
return url + "?enable_editor=1"
|
||||
|
||||
@http.route("/website/get_switchable_related_views", type="json", auth="user", website=True)
|
||||
def get_switchable_related_views(self, key):
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
/** @odoo-module **/
|
||||
|
||||
import { Dialog } from '@web/core/dialog/dialog';
|
||||
import { Switch } from '@website/components/switch/switch';
|
||||
|
||||
const { xml, useState } = owl;
|
||||
|
||||
export class WebsiteDialog extends Dialog {
|
||||
setup() {
|
||||
@@ -44,3 +47,46 @@ WebsiteDialog.bodyTemplate = "website.DialogBody";
|
||||
WebsiteDialog.footerTemplate = "website.DialogFooter";
|
||||
WebsiteDialog.size = "modal-md";
|
||||
WebsiteDialog.contentClass = "o_website_dialog";
|
||||
|
||||
export class AddPageDialog extends WebsiteDialog {
|
||||
setup() {
|
||||
super.setup();
|
||||
|
||||
this.title = this.env._t("New Page");
|
||||
this.primaryTitle = this.env._t("Create");
|
||||
|
||||
this.state = useState({
|
||||
addMenu: true,
|
||||
name: '',
|
||||
});
|
||||
}
|
||||
|
||||
onChangeAddMenu(value) {
|
||||
this.state.addMenu = value;
|
||||
}
|
||||
|
||||
async primaryClick() {
|
||||
await this.props.addPage(this.state.name, this.state.addMenu);
|
||||
this.close();
|
||||
}
|
||||
}
|
||||
AddPageDialog.props = {
|
||||
...WebsiteDialog.props,
|
||||
addPage: Function,
|
||||
};
|
||||
AddPageDialog.components = {
|
||||
Switch,
|
||||
};
|
||||
AddPageDialog.bodyTemplate = xml`
|
||||
<div>
|
||||
<div class="form-group row">
|
||||
<label class="col-form-label col-md-3">
|
||||
Page Title
|
||||
</label>
|
||||
<div class="col-md-9">
|
||||
<input type="text" t-model="state.name" class="form-control" required="required"/>
|
||||
</div>
|
||||
</div>
|
||||
<Switch extraClasses="'offset-md-3 col-md-9 text-left'" label="'Add to menu'" value="state.addMenu" onChange="(value) => this.onChangeAddMenu(value)"/>
|
||||
</div>
|
||||
`;
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
.o_website_dialog {
|
||||
label {
|
||||
font-weight: $font-weight-bold;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
/** @odoo-module **/
|
||||
|
||||
const { Component, xml } = owl;
|
||||
|
||||
const NO_OP = () => {};
|
||||
|
||||
export class Switch extends Component {
|
||||
setup() {
|
||||
this.extraClasses = this.props.extraClasses ? ` ${this.props.extraClasses}` : '';
|
||||
}
|
||||
}
|
||||
Switch.props = {
|
||||
value: Boolean,
|
||||
extraClasses: String,
|
||||
label: {type: String, optional: true},
|
||||
onChange: { Function, optional: true },
|
||||
};
|
||||
Switch.defaultProps = {
|
||||
onChange: NO_OP,
|
||||
};
|
||||
Switch.template = xml`
|
||||
<label t-att-class="'o_switch' + extraClasses">
|
||||
<input type="checkbox" t-att-checked="props.value" t-on-change="(ev) => props.onChange(ev.target.checked)"/>
|
||||
<span/>
|
||||
<div t-if="props.label"><t t-esc="props.label"/></div>
|
||||
</label>
|
||||
`;
|
||||
@@ -0,0 +1,52 @@
|
||||
$o-we-switch-size: 1.2em !default;
|
||||
$o-we-switch-inactive-color: rgba($text-muted, 0.4) !default;
|
||||
.o_switch {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
|
||||
> input {
|
||||
display: none;
|
||||
|
||||
+ span {
|
||||
margin-right: 0.5em;
|
||||
border-radius: $o-we-switch-size;
|
||||
width: $o-we-switch-size * 1.7;
|
||||
padding-left: 3px;
|
||||
padding-right: 3px;
|
||||
background-color: $o-we-switch-inactive-color;
|
||||
font-size: $o-we-switch-size * 1.09;
|
||||
line-height: $o-we-switch-size;
|
||||
color: $o-we-switch-inactive-color;
|
||||
transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1);
|
||||
|
||||
&:after {
|
||||
content: "\f057"; // fa-times-circle
|
||||
font-family: 'FontAwesome';
|
||||
color: white;
|
||||
transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1);
|
||||
}
|
||||
}
|
||||
|
||||
&:checked + span {
|
||||
background: $o-brand-primary;
|
||||
|
||||
&:after {
|
||||
content: "\f058"; // fa-check-circle
|
||||
margin-left: ($o-we-switch-size * 1.7) - $o-we-switch-size;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.o_switch_danger_success {
|
||||
> input {
|
||||
&:not(:checked) + span {
|
||||
background: $o-we-color-danger;
|
||||
}
|
||||
&:checked + span {
|
||||
background: $o-we-color-success;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
import { registry } from '@web/core/registry';
|
||||
import { useService } from '@web/core/utils/hooks';
|
||||
import { ConfirmationDialog } from "@web/core/confirmation_dialog/confirmation_dialog";
|
||||
import { WebsiteDialog, AddPageDialog } from "@website/components/dialog/dialog";
|
||||
import { useHotkey } from "@web/core/hotkeys/hotkey_hook";
|
||||
|
||||
const { Component, xml, useState, onWillStart } = owl;
|
||||
@@ -123,7 +123,15 @@ export class NewContentModal extends Component {
|
||||
return this.state.newContentElements.filter(({status}) => status !== MODULE_STATUS.NOT_INSTALLED).concat(this.state.newContentElements.filter(({status}) => status === MODULE_STATUS.NOT_INSTALLED));
|
||||
}
|
||||
|
||||
createNewPage() {}
|
||||
createNewPage() {
|
||||
this.dialogs.add(AddPageDialog, {
|
||||
addPage: async (name, addMenu) => {
|
||||
const url = `/website/add/${encodeURIComponent(name)}`;
|
||||
const res = await this.website.sendRequest(url, { add_menu: addMenu || '' });
|
||||
this.website.goToWebsite({ path: res });
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async installModule(id, redirectUrl) {
|
||||
await this.orm.call(
|
||||
@@ -148,9 +156,10 @@ export class NewContentModal extends Component {
|
||||
|
||||
const {id, name} = this.modulesInfo[element.moduleXmlId];
|
||||
const dialogProps = {
|
||||
title: this.env._t("Install"),
|
||||
title: element.title,
|
||||
body: _.str.sprintf(this.newContentText.installNeeded, name),
|
||||
confirm: async () => {
|
||||
primaryTitle: this.env._t("Install"),
|
||||
primaryClick: async () => {
|
||||
// Update the NewContentElement with installing icon and text.
|
||||
this.state.newContentElements = this.state.newContentElements.map(el => {
|
||||
if (el.moduleXmlId === element.moduleXmlId) {
|
||||
@@ -175,9 +184,8 @@ export class NewContentModal extends Component {
|
||||
console.error(error);
|
||||
}
|
||||
},
|
||||
cancel: () => {},
|
||||
};
|
||||
this.dialogs.add(ConfirmationDialog, dialogProps);
|
||||
this.dialogs.add(WebsiteDialog, dialogProps);
|
||||
}
|
||||
}
|
||||
NewContentModal.template = "website.NewContentModal";
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
<div class="row">
|
||||
<NewContentElement t-if="isDesigner"
|
||||
name="'New Page'"
|
||||
onClick="() => createNewPage()"
|
||||
onClick="() => this.createNewPage()"
|
||||
title="'New Page'">
|
||||
<i class="fa fa-file-o"/>
|
||||
<p>Page</p>
|
||||
|
||||
@@ -94,12 +94,6 @@
|
||||
<t t-set="is_system" t-value="env.user.has_group('base.group_system')"/>
|
||||
<t t-set="is_designer" t-value="env.user.has_group('website.group_website_designer')"/>
|
||||
|
||||
<div t-if='is_designer' class="col-md-4 mb8 o_new_content_element">
|
||||
<a href="#" data-action="new_page" aria-label="New page" title="New page">
|
||||
<i class="fa fa-file-o"/>
|
||||
<p>Page</p>
|
||||
</a>
|
||||
</div>
|
||||
<t t-set="mod" t-value="env.ref('base.module_website_blog')"/>
|
||||
<div name="module_website_blog" t-if='is_system' t-cache="is_system"
|
||||
t-att-data-module-id="mod.id"
|
||||
|
||||
Reference in New Issue
Block a user