310 lines
10 KiB
Mako
310 lines
10 KiB
Mako
## -*- coding: utf-8; -*-
|
|
|
|
<%def name="render_template()">
|
|
<script type="text/x-template" id="page-help-template">
|
|
<div>
|
|
|
|
% if help_url or help_markdown:
|
|
|
|
% if request.use_oruga:
|
|
<o-button icon-left="question-circle"
|
|
% if help_markdown:
|
|
@click="displayInit()"
|
|
% elif help_url:
|
|
tag="a" href="${help_url}"
|
|
target="_blank"
|
|
% endif
|
|
>
|
|
Help
|
|
</o-button>
|
|
|
|
% if can_edit_help:
|
|
## TODO: this dropdown is duplicated, below
|
|
<o-dropdown position="bottom-left"
|
|
## TODO: why does click not work here?!
|
|
:triggers="['click', 'hover']">
|
|
<template #trigger>
|
|
<o-button>
|
|
<o-icon icon="cog" />
|
|
</o-button>
|
|
</template>
|
|
<o-dropdown-item label="Edit Page Help"
|
|
@click="configureInit()" />
|
|
<o-dropdown-item label="Edit Fields Help"
|
|
@click="configureFieldsInit()" />
|
|
</o-dropdown>
|
|
% endif
|
|
|
|
% else:
|
|
## buefy
|
|
<b-field>
|
|
<p class="control">
|
|
<b-button icon-pack="fas"
|
|
icon-left="question-circle"
|
|
% if help_markdown:
|
|
@click="displayInit()"
|
|
% elif help_url:
|
|
tag="a" href="${help_url}"
|
|
target="_blank"
|
|
% endif
|
|
>
|
|
Help
|
|
</b-button>
|
|
</p>
|
|
% if can_edit_help:
|
|
## TODO: this dropdown is duplicated, below
|
|
<b-dropdown aria-role="list" position="is-bottom-left">
|
|
<template #trigger="{ active }">
|
|
<b-button>
|
|
<span><i class="fa fa-cog"></i></span>
|
|
</b-button>
|
|
</template>
|
|
<b-dropdown-item aria-role="listitem"
|
|
@click="configureInit()">
|
|
Edit Page Help
|
|
</b-dropdown-item>
|
|
<b-dropdown-item aria-role="listitem"
|
|
@click="configureFieldsInit()">
|
|
Edit Fields Help
|
|
</b-dropdown-item>
|
|
</b-dropdown>
|
|
% endif
|
|
</b-field>
|
|
% endif:
|
|
|
|
% elif can_edit_help:
|
|
|
|
## TODO: this dropdown is duplicated, above
|
|
% if request.use_oruga:
|
|
<o-dropdown position="bottom-left"
|
|
## TODO: why does click not work here?!
|
|
:triggers="['click', 'hover']">
|
|
<template #trigger>
|
|
<o-button>
|
|
<o-icon icon="question-circle" />
|
|
<o-icon icon="cog" />
|
|
</o-button>
|
|
</template>
|
|
<o-dropdown-item label="Edit Page Help"
|
|
@click="configureInit()" />
|
|
<o-dropdown-item label="Edit Fields Help"
|
|
@click="configureFieldsInit()" />
|
|
</o-dropdown>
|
|
% else:
|
|
<b-field>
|
|
<p class="control">
|
|
<b-dropdown aria-role="list" position="is-bottom-left">
|
|
<template #trigger>
|
|
<b-button>
|
|
% if request.use_oruga:
|
|
<o-icon icon="question-circle" />
|
|
<o-icon icon="cog" />
|
|
% else:
|
|
<span><i class="fa fa-question-circle"></i></span>
|
|
<span><i class="fa fa-cog"></i></span>
|
|
% endif
|
|
</b-button>
|
|
</template>
|
|
<b-dropdown-item aria-role="listitem"
|
|
@click="configureInit()">
|
|
Edit Page Help
|
|
</b-dropdown-item>
|
|
<b-dropdown-item aria-role="listitem"
|
|
@click="configureFieldsInit()">
|
|
Edit Fields Help
|
|
</b-dropdown-item>
|
|
</b-dropdown>
|
|
</p>
|
|
</b-field>
|
|
% endif
|
|
% endif
|
|
|
|
% if help_markdown:
|
|
<${b}-modal has-modal-card
|
|
% if request.use_oruga:
|
|
v-model:active="displayShowDialog"
|
|
% else:
|
|
:active.sync="displayShowDialog"
|
|
% endif
|
|
>
|
|
<div class="modal-card">
|
|
|
|
<header class="modal-card-head">
|
|
<p class="modal-card-title">${index_title}</p>
|
|
</header>
|
|
|
|
<section class="modal-card-body">
|
|
${h.render_markdown(help_markdown)}
|
|
</section>
|
|
|
|
<footer class="modal-card-foot">
|
|
% if help_url:
|
|
<b-button type="is-primary"
|
|
icon-pack="fas"
|
|
icon-left="external-link-alt"
|
|
tag="a" href="${help_url}"
|
|
target="_blank">
|
|
More Info
|
|
</b-button>
|
|
% endif
|
|
<b-button @click="displayShowDialog = false">
|
|
Close
|
|
</b-button>
|
|
</footer>
|
|
</div>
|
|
</${b}-modal>
|
|
% endif
|
|
|
|
% if can_edit_help:
|
|
|
|
<${b}-modal has-modal-card
|
|
% if request.use_oruga:
|
|
v-model:active="configureShowDialog"
|
|
% else:
|
|
:active.sync="configureShowDialog"
|
|
% endif
|
|
>
|
|
<div class="modal-card"
|
|
% if request.use_oruga:
|
|
style="margin: auto;"
|
|
% endif
|
|
>
|
|
|
|
<header class="modal-card-head">
|
|
<p class="modal-card-title">Configure Help</p>
|
|
</header>
|
|
|
|
<section class="modal-card-body">
|
|
|
|
<p class="block">
|
|
This help info applies to all views with the current
|
|
route prefix.
|
|
</p>
|
|
|
|
<b-field grouped>
|
|
|
|
<b-field label="Route Prefix">
|
|
<span>${route_prefix}</span>
|
|
</b-field>
|
|
|
|
<b-field label="URL Prefix">
|
|
<span>${master.get_url_prefix()}</span>
|
|
</b-field>
|
|
|
|
</b-field>
|
|
|
|
<b-field label="Help Link (URL)">
|
|
<b-input v-model="helpURL"
|
|
ref="helpURL"
|
|
expanded>
|
|
</b-input>
|
|
</b-field>
|
|
|
|
<b-field label="Help Text (Markdown)">
|
|
<b-input v-model="markdownText"
|
|
type="textarea" rows="8"
|
|
expanded>
|
|
</b-input>
|
|
</b-field>
|
|
|
|
</section>
|
|
|
|
<footer class="modal-card-foot">
|
|
<b-button @click="configureShowDialog = false">
|
|
Cancel
|
|
</b-button>
|
|
<b-button type="is-primary"
|
|
@click="configureSave()"
|
|
:disabled="configureSaving"
|
|
icon-pack="fas"
|
|
icon-left="save">
|
|
{{ configureSaving ? "Working, please wait..." : "Save" }}
|
|
</b-button>
|
|
</footer>
|
|
</div>
|
|
</${b}-modal>
|
|
|
|
% endif
|
|
|
|
</div>
|
|
</script>
|
|
</%def>
|
|
|
|
<%def name="declare_vars()">
|
|
<script type="text/javascript">
|
|
|
|
let PageHelp = {
|
|
|
|
template: '#page-help-template',
|
|
mixins: [FormPosterMixin],
|
|
|
|
methods: {
|
|
|
|
displayInit() {
|
|
this.displayShowDialog = true
|
|
},
|
|
|
|
% if can_edit_help:
|
|
configureInit() {
|
|
this.configureShowDialog = true
|
|
this.$nextTick(() => {
|
|
this.$refs.helpURL.focus()
|
|
})
|
|
},
|
|
|
|
configureFieldsInit() {
|
|
this.$emit('configure-fields-help')
|
|
this.$buefy.toast.open({
|
|
message: "Please see the gear icon next to configurable fields",
|
|
type: 'is-info',
|
|
duration: 4000, // 4 seconds
|
|
})
|
|
},
|
|
|
|
configureSave() {
|
|
this.configureSaving = true
|
|
let url = '${url('{}.edit_help'.format(route_prefix))}'
|
|
let params = {
|
|
help_url: this.helpURL,
|
|
markdown_text: this.markdownText,
|
|
}
|
|
this.submitForm(url, params, response => {
|
|
this.configureShowDialog = false
|
|
this.$buefy.toast.open({
|
|
message: "Info was saved; please refresh page to see changes.",
|
|
type: 'is-info',
|
|
duration: 4000, // 4 seconds
|
|
})
|
|
this.configureSaving = false
|
|
}, response => {
|
|
this.configureSaving = false
|
|
})
|
|
},
|
|
% endif
|
|
},
|
|
}
|
|
|
|
let PageHelpData = {
|
|
displayShowDialog: false,
|
|
|
|
% if can_edit_help:
|
|
configureShowDialog: false,
|
|
configureSaving: false,
|
|
helpURL: ${json.dumps(help_url or None)|n},
|
|
markdownText: ${json.dumps(help_markdown or None)|n},
|
|
% endif
|
|
}
|
|
|
|
</script>
|
|
</%def>
|
|
|
|
<%def name="make_component()">
|
|
<script type="text/javascript">
|
|
|
|
PageHelp.data = function() { return PageHelpData }
|
|
|
|
Vue.component('page-help', PageHelp)
|
|
<% request.register_component('page-help', 'PageHelp') %>
|
|
|
|
</script>
|
|
</%def>
|
|
|