Skip to content

Commit fc266c5

Browse files
lisa-fehrjohnblackspear
lisa-fehr
authored and
johnblackspear
committed
Basic printable view
1 parent 3cf0131 commit fc266c5

19 files changed

Lines changed: 467 additions & 16 deletions

File tree

‎ProcessMaker/Http/Controllers/Process/ModelerPrintController.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
namespace ProcessMaker\Http\Controllers\Process;
44

55
use Illuminate\Http\Request;
6+
use ProcessMaker\Http\Controllers\Controller;
67
use ProcessMaker\Models\Process;
78

89
class ModelerPrintController extends Controller

‎resources/js/processes/modeler/components/ModelerApp.vue‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -102,9 +102,6 @@
102102
svg
103103
};
104104
105-
// eslint-disable-next-line no-console
106-
console.log(data);
107-
108105
const savedSuccessfully = (response) => {
109106
this.process.updated_at = response.data.updated_at;
110107
// Now show alert

‎resources/js/processes/modeler/print/PrintableDiagram.vue‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<template>
2+
<div class="page-content ml-2" id="processPrint">
3+
<h1>{{processName}}</h1>
4+
<p><i class="far fa-clock"></i> Updated {{updatedAt}} by {{author}}</p>
5+
<div id="diagramContainer" class="printable-svg bg-white w-50 m-auto mb-5">
6+
<div v-html="svg"/>
7+
</div>
8+
9+
<h4 class="mt-5">Process Elements</h4>
10+
<div id="diagram-documentation">
11+
<ElementDoc v-for="node in documentNodes" :bpmnNode="node" :key="node.id"/>
12+
</div>
13+
</div>
14+
</template>
15+
16+
<script>
17+
import ElementDoc from './components/ElementDoc';
18+
import documentableBpmnNodes from './parseBpmnDocumentation';
19+
20+
export default {
21+
name: 'PrintableDiagram',
22+
props: [
23+
'processName',
24+
'updatedAt',
25+
'author',
26+
'svg',
27+
'bpmn',
28+
],
29+
components: {
30+
ElementDoc,
31+
},
32+
data: function() {
33+
return {
34+
bpmnString: this.bpmn,
35+
documentNodes: documentableBpmnNodes(this.bpmn),
36+
};
37+
},
38+
};
39+
</script>

‎resources/js/processes/modeler/print/components/BpmnTypeIcon.vue‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<template>
2+
<i :class="icon.class" :style="icon.style" :title="icon.title"></i>
3+
</template>
4+
<script>
5+
export default {
6+
name: "BpmnTypeIcon",
7+
props: ["icon"]
8+
};
9+
</script>

‎resources/js/processes/modeler/print/components/BpmnTypeImage.vue‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<template>
2+
<img :src="icon.src" :class="icon.class" :style="icon.style" :title="icon.title" />
3+
</template>
4+
<script>
5+
export default {
6+
name: "BpmnTypeImage",
7+
props: ["icon"]
8+
};
9+
</script>

‎resources/js/processes/modeler/print/components/ElementDoc.vue‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<template>
2+
<div class="card mb-3 mr-2 ml-2">
3+
<div class="card-header">
4+
<bpmn-type-image v-if="icon.type === 'image'" :icon="icon" height="14"/>
5+
<bpmn-type-icon v-else-if="icon.type === 'icon'" :icon="icon" />
6+
[{{ bpmnNode.type }}]:
7+
<strong>{{ bpmnNode.name }}</strong>
8+
({{ bpmnNode.id }})
9+
</div>
10+
<div v-if="hasBodyText" class="card-body">
11+
<span v-if="bpmnNode.textHtml" v-html="bpmnNode.textHtml" />
12+
<span v-if="bpmnNode.documentationHtml" v-html="bpmnNode.documentationHtml" />
13+
</div>
14+
<div v-else class="card-body text-secondary">No Documentation Found.</div>
15+
</div>
16+
</template>
17+
18+
<script>
19+
import BpmnTypeImage from "./BpmnTypeImage";
20+
import BpmnTypeIcon from "./BpmnTypeIcon";
21+
import icons from "../icons";
22+
23+
export default {
24+
name: "ElementDoc",
25+
props: ["bpmnNode"],
26+
computed: {
27+
hasBodyText: function() {
28+
return !!this.bpmnNode.textHtml || !!this.bpmnNode.documentationHtml;
29+
},
30+
icon: function() {
31+
const knownIcon = icons[this.bpmnNode.type];
32+
if (knownIcon) {
33+
return knownIcon;
34+
}
35+
return { type: "unknown" };
36+
}
37+
},
38+
components: { BpmnTypeImage, BpmnTypeIcon }
39+
};
40+
</script>

‎resources/js/processes/modeler/print/icons/annotations.js‎

Lines changed: 9 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎resources/js/processes/modeler/print/icons/endEvents.js‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
const endEventColor = '#ED4757';
2+
const endEvents = {
3+
'bpmn:endEvent':
4+
{
5+
type: 'icon',
6+
class: 'far fa-circle',
7+
style: `color:${endEventColor};`,
8+
title: 'End Event',
9+
},
10+
'bpmn:endEvent:messageEventDefinition':
11+
{
12+
type: 'icon',
13+
class: 'far fa-envelope',
14+
style: `color:${endEventColor};`,
15+
title: 'Message End Event',
16+
},
17+
'bpmn:endEvent:errorEventDefinition':
18+
{
19+
type: 'image',
20+
src: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxMSAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNzM4NDQgNy4wMjgyOEM4LjgyNTY1IDQuNjg1MTIgOS45MTI3OSAyLjM0MzEgMTEgMEMxMC4xMjkzIDQuMTgwNjIgOS4yNTk1MSA4LjM1OTIxIDguMzg4NzcgMTIuNTM4OEM2Ljk2ODk2IDEwLjgxMjEgNS41NDkxNSA5LjA4NDI3IDQuMTI5MzQgNy4zNTc1OUMyLjc1MzI0IDkuMjM4MzcgMS4zNzYxIDExLjExOTIgMCAxM0MxLjIyODE4IDkuMTQwMjMgMi40NTUzNyA1LjI4MDQ1IDMuNjgzNTUgMS40MjA2MUM1LjAzNDgyIDMuMjg5ODQgNi4zODcxMiA1LjE1OTA2IDcuNzM4NDQgNy4wMjgyOFoiIGZpbGw9IiNFRDQ3NTciLz4KPC9zdmc+Cg==',
21+
title: 'Error End Event',
22+
},
23+
};
24+
export default endEvents;

‎resources/js/processes/modeler/print/icons/flows.js‎

Lines changed: 15 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎resources/js/processes/modeler/print/icons/gateways.js‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
const gatewayColor = '#000';
2+
const gateways = {
3+
'bpmn:exclusiveGateway':
4+
{
5+
type: 'icon',
6+
class: 'fa fa-times',
7+
style: `color:${gatewayColor};`,
8+
title: 'Exclusive Gateway',
9+
},
10+
'bpmn:inclusiveGateway':
11+
{
12+
type: 'icon',
13+
class: 'far fa-circle',
14+
style: `color:${gatewayColor};`,
15+
title: 'Inclusive Gateway',
16+
},
17+
'bpmn:parallelGateway':
18+
{
19+
type: 'icon',
20+
class: 'fa fa-plus',
21+
style: `color:${gatewayColor};`,
22+
title: 'Parallel Gateway',
23+
},
24+
'bpmn:eventBasedGateway':
25+
{
26+
type: 'image',
27+
src: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTU0cHgiIGhlaWdodD0iMTU0cHgiIHZpZXdCb3g9IjAgMCAxNTQgMTU0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA1MC4yICg1NTA0NykgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+ZXZlbnQtYmFzZWQtZ2F0ZXdheS1zeW1ib2w8L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0iZXZlbnQtYmFzZWQtZ2F0ZXdheS1zeW1ib2wiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQuMDAwMDAwLCA0LjAwMDAwMCkiIHN0cm9rZT0iIzAwMDAwMCI+CiAgICAgICAgICAgIDxjaXJjbGUgaWQ9Ik92YWwiIHN0cm9rZS13aWR0aD0iOCIgY3g9IjczIiBjeT0iNzMiIHI9IjczIj48L2NpcmNsZT4KICAgICAgICAgICAgPGNpcmNsZSBpZD0iT3ZhbC1Db3B5IiBzdHJva2Utd2lkdGg9IjgiIGN4PSI3My41IiBjeT0iNzMuNSIgcj0iNTUuNSI+PC9jaXJjbGU+CiAgICAgICAgICAgIDxwb2x5Z29uIGlkPSJQb2x5Z29uIiBzdHJva2Utd2lkdGg9IjciIHBvaW50cz0iNzMuMDcyNTgwNiA0MSAxMDcuMTQ1MTYxIDY1LjgyNzc5MDcgOTQuMTMwNTkzNiAxMDYgNTIuMDE0NTY3NyAxMDYgMzkgNjUuODI3NzkwNyI+PC9wb2x5Z29uPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+',
28+
title: 'Event Based Gateway',
29+
},
30+
};
31+
export default gateways;

0 commit comments

Comments
 (0)