Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Print layout with no maps #587

Merged
merged 8 commits into from
Mar 8, 2024
+108 −50
Merged

Print layout with no maps #587

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
99741e0
clean code
volterra79 Feb 27, 2024
87f6e84
clean code
volterra79 Feb 27, 2024
e4d06ae
remove space
volterra79 Feb 27, 2024
6bbdb38
Disable scale an rotation when no maps are related to print setup
volterra79 Feb 27, 2024
62047f2
Handle no maps case print layout
volterra79 Feb 27, 2024
65b5246
refactor function `changeTemplate`
Raruto Feb 27, 2024
2b64ebf
Merge branch 'dev' into issue_586
volterra79 Mar 4, 2024
f687c51
Merge branch 'issue_586' of https://github.com/g3w-suite/g3w-client i…
volterra79 Mar 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 25 additions & 17 deletions src/app/gui/print/printservice.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -223,7 +223,9 @@ function PrintComponentService() {
maxx: [0, 0],
maxy: [0, 0]
};
this.state.visible && this.setInitState();
if (this.state.visible) {
this.setInitState();
}
};
}

Expand Down Expand Up @@ -260,30 +262,30 @@ proto.changeTemplate = function() {
if (!this.state.template) {
return;
}
const isPreviousAtlas = this.state.atlas;
const {
atlas,
maps,
labels
} = this.state.print.find(print => print.name === this.state.template);
this.state.maps = maps;
this.state.atlas = atlas;
this.state.labels = labels;
this.state.atlasValues = [];
this.state.atlas ?
const has_previous = this.state.atlas || 0 === this.state.maps.length;
const print = this.state.print.find(p => p.name === this.state.template)

this._clearPrint() :
this.state.maps = print.maps;
this.state.atlas = print.atlas;
this.state.labels = print.labels;
this.state.atlasValues = [];

isPreviousAtlas ?
this.showPrintArea(true) :
this._setPrintArea();
if (this.state.atlas) {
this._clearPrint();
} else if (has_previous) {
this.showPrintArea(true);
} else {
this._setPrintArea();
}
};

/**
* On change scala set print area
*/
proto.changeScale = function() {
this.state.scala && this._setPrintArea();
if (this.state.scala) {
this._setPrintArea();
}
};

/**
Expand Down Expand Up @@ -372,6 +374,7 @@ proto.print = function() {
return new Promise((resolve, reject) => {
//disable sidebar
GUI.disableSideBar(true);
//atlas print
if (this.state.atlas) {
const caller_download_id = ApplicationService.setDownload(true);
this.state.loading = true;
Expand Down Expand Up @@ -496,6 +499,11 @@ proto._calculateInternalPrintExtent = function() {
* @private
*/
proto._setPrintArea = function() {
//No maps set. Only attributes label
if (0 === this.state.maps.length) {
this._clearPrint();
return;
}
this.state.size = this._map.getSize();
const resolution = this._map.getView().getResolution();
this.state.currentScala = getScaleFromResolution(resolution, this._mapUnits);
Expand Down
1 change: 0 additions & 1 deletion src/app/gui/print/vue/printpage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@ const PrintPage = function(options={}) {

inherit(PrintPage, Component);


module.exports = PrintPage;


115 changes: 83 additions & 32 deletions src/components/Print.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@

<label for="scala" v-t="'sdk.print.scale'"></label>
<select
v-disabled="noMaps"
id="scala"
class="form-control"
@change="onChangeScale"
Expand All @@ -45,61 +46,103 @@
</select>

<label for="dpi">dpi</label>
<select class="form-control" @change="onChangeDpi" v-model="state.dpi" id="dpi" >
<option v-for="dpi in state.dpis" >{{ dpi }}</option>
<select
class="form-control"
@change="onChangeDpi"
v-model="state.dpi" id="dpi"
>
<option
v-for="dpi in state.dpis"
>{{ dpi }}</option>
</select>

<label for="rotation" v-t="'sdk.print.rotation'"></label>
<input min="-360" max="360" @input="onChangeRotation" v-model="state.rotation" id="rotation" class="form-control" type="number">
<input
v-disabled="noMaps"
min="-360"
max="360"
@input="onChangeRotation"
v-model="state.rotation"
id="rotation"
class="form-control"
type="number"
>
<label for="format" v-t="'sdk.print.format'"></label>

<select class="form-control" v-model="state.output.format" id="format">
<option v-for="format in state.formats" :value="format.value">{{ format.label }}</option>
<select
class="form-control"
v-model="state.output.format"
id="format"
>
<option
v-for="format in state.formats"
:value="format.value"
>{{ format.label }}</option>
</select>

</template>

<!-- since 3.8.7 -->
<!-- Needed to recreate a component on change template -->
<template v-else-if="!templateChanged">
<template v-if="state.atlas.field_name">
<select-atlas-field-values
@disable-print-button="setDisabledPrintButton"
@set-values="setAtlasValues"
:atlas="state.atlas"
:reset="!state.isShow"/>
</template>

<template v-else>
<fid-atlas-values
@disable-print-button="setDisabledPrintButton"
@set-values="setAtlasValues"
:atlas="state.atlas"
:reset="!state.isShow"/>
</template>
<template v-if="state.atlas.field_name">
<select-atlas-field-values
@disable-print-button="setDisabledPrintButton"
@set-values="setAtlasValues"
:atlas="state.atlas"
:reset="!state.isShow"/>
</template>

<template v-else>
<fid-atlas-values
@disable-print-button="setDisabledPrintButton"
@set-values="setAtlasValues"
:atlas="state.atlas"
:reset="!state.isShow"/>
</template>
</template>

<template v-if="state.labels && state.labels.length">
<div class="print-labels-content" style="margin-top: 5px;">
<label style="font-weight: bold; font-size: 1.1em; display: block; border-bottom: 2px solid #ffffff; margin-bottom: 5px;" class="skin-color" v-t="'sdk.print.labels'"></label>
<div class="labels-input-content" style="max-height: 120px; overflow-y: auto">
<span v-for="label in state.labels" :key="label.id">
<div
class="print-labels-content"
style="margin-top: 5px;"
>
<label
style="font-weight: bold; font-size: 1.1em; display: block; border-bottom: 2px solid #ffffff; margin-bottom: 5px;"
class="skin-color"
v-t="'sdk.print.labels'">
</label>
<div
class="labels-input-content"
style="max-height: 120px; overflow-y: auto"
>
<span
v-for="label in state.labels"
:key="label.id"
>
<label :for="`g3w_label_id_input_${label.id}`">{{label.id}}</label>
<input :id="`g3w_label_id_input_${label.id}`" class="form-control" v-model="label.text"/>
<input
:id="`g3w_label_id_input_${label.id}`"
class="form-control"
v-model="label.text"/>
</span>
</div>
</div>
</template>
</div>
<div class="box-footer" style="background-color: transparent">
<div
class="box-footer"
style="background-color: transparent"
>
<span>
<button
id="printbutton"
style="width:100%; font-weight: bold"
class="sidebar-button-run btn"
v-disabled="button.disabled"
@click.stop.prevent="print"
v-download v-t="'create_print'">
v-download
v-t="'create_print'">
</button>
</span>
</div>
Expand All @@ -121,10 +164,10 @@ export default {
return {
state: null,
/** @since 3.8.7 **/
templateChanged: false, // useful to redraw component related to change template
templateChanged: false, // useful to a redrawn component related to change template
button: {
class: "btn-success",
type:"stampa",
type :"print",
disabled: false
}
}
Expand All @@ -135,14 +178,22 @@ export default {
},
computed: {
disabled() {
return this.state.output.loading || (!!this.state.atlas && this.state.atlasValues.length === 0);
return this.state.output.loading || (!!this.state.atlas && 0 === this.state.atlasValues.length);
},
/**
* @since v3.10.0
* Check if current print has maps (only alphanumerical data)
* @return {boolean}
*/
noMaps() {
return 0 === this.state.maps.length;
}
},
methods: {
setDisabledPrintButton(bool=false){
setDisabledPrintButton(bool=false) {
this.button.disabled = bool;
},
setAtlasValues(values=[]){
setAtlasValues(values=[]) {
this.state.atlasValues = values;
},
async onChangeTemplate() {
Expand Down
Loading