Skip to content

Commit e0b96bd

Browse files
authored
Merge pull request #535 from RabotaRu/v3.11.0
V3.11.0
2 parents d086fc6 + 6648a44 commit e0b96bd

File tree

32 files changed

+2291
-18
lines changed

32 files changed

+2291
-18
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ node_modules
88
/plugins
99
/src/hidden
1010
/cache
11+
/public/temp
1112

1213
./plugins.json
1314

README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ DocHub - инструмент описания архитектуры через
2121
* [Создание архитектурных фасадов (портал документации)](#facade);
2222
* [Анализ архитектуры](#analysis);
2323
* [Контроль консистентности](#problems);
24-
* [Расширяемая матамодель](#extmetamodel).
24+
* [Расширяемая метамодель](#extmetamodel).
2525

2626
## Быстрый старт
2727

@@ -118,7 +118,7 @@ DocHub умеет находить проблемы в описании архи
118118

119119
![Валидатор](pics/validators.png)
120120

121-
## <a name="extmetamodel"></a> Расширяемая матамодель
121+
## <a name="extmetamodel"></a> Расширяемая метамодель
122122

123123
Метамодель DocHub может быть расширена по вашему желанию. Есть возможность как модифицировать
124124
уже существующие сущности, так и создавать собственные.

example.env

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -153,7 +153,9 @@
153153
# По умолчанию кластер выключен (off).
154154
# VUE_APP_DOCHUB_CLUSTER= on / off
155155

156-
156+
# (FB) Включение поддержки HTML тэгов в markdown документах
157+
# По умолчанию поддержка выключена (off).
158+
# VUE_APP_DOCHUB_MARKDOWN_HTML= on / off
157159

158160
# ***********************************************************
159161
# Примеры конфигурирования

plugins.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44
"plugins/markaper",
55
"plugins/charts",
66
"plugins/devtool",
7-
"plugins/svg"
7+
"plugins/svg",
8+
"plugins/bpmnjs",
9+
"plugins/drawio"
810
]
911
}
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
2+
export default {
3+
props: {
4+
// Требуем обязательно передавать профайл документа
5+
profile: {
6+
type: Object,
7+
required: true
8+
},
9+
// Требуем обязательно передавать функцию получения контента
10+
getContent: {
11+
type: Function,
12+
required: true
13+
},
14+
// Получаем функцию сохранения контента если есть
15+
putContent: {
16+
type: Function,
17+
default: null,
18+
required: false
19+
},
20+
// Содержимое документа
21+
value: String
22+
},
23+
methods: {
24+
// Методы для реализации в компонентах
25+
// init() { },
26+
// applyContent(content) { },
27+
28+
// Регистрация ошибки
29+
registerError(error) {
30+
this.errors.push(error);
31+
},
32+
// Регистрация предупреждений
33+
registerWarning(warning) {
34+
this.warnings.push(warning);
35+
}
36+
},
37+
watch: {
38+
value(value) {
39+
this.applyContent(value);
40+
}
41+
},
42+
mounted() {
43+
this.init();
44+
this.applyContent(this.value);
45+
},
46+
data() {
47+
return {
48+
errors: [],
49+
warnings: [],
50+
data: null
51+
};
52+
}
53+
};
Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
<template>
2+
<div class="bpmnjs-document-modeler">
3+
<div
4+
v-html="`
5+
<style>
6+
.bpmnjs-document-modeler .bjs-breadcrumbs {
7+
left: 180px !important;
8+
top: 34px !important;
9+
}
10+
</style>
11+
`" />
12+
<div v-bind:id="descId" class="desk" />
13+
<v-toolbar dense floating elevation="0" color="rgba(0, 0, 0, 0.03)" class="toolbar">
14+
<v-btn v-if="putContent" icon v-on:click="save">
15+
<v-icon>mdi-content-save</v-icon>
16+
</v-btn>
17+
<v-btn icon v-on:click="onExit(false)">
18+
<v-icon>mdi-exit-run</v-icon>
19+
</v-btn>
20+
</v-toolbar>
21+
<v-dialog
22+
v-model="saveRequest"
23+
width="500">
24+
<v-card>
25+
<v-card-title class="text-h5 grey lighten-2">
26+
Сохранить?
27+
</v-card-title>
28+
29+
<v-card-text>
30+
В диаграмму внесены изменения. Если их не сохранить, то они будут утеряны.
31+
</v-card-text>
32+
33+
<v-divider />
34+
35+
<v-card-actions>
36+
<v-spacer />
37+
<v-btn
38+
text
39+
v-on:click="saveRequest = false; onExit(true)">
40+
Не сохранять
41+
</v-btn>
42+
<v-btn
43+
color="primary"
44+
text
45+
v-on:click="onExit(true)">
46+
Сохранить
47+
</v-btn>
48+
</v-card-actions>
49+
</v-card>
50+
</v-dialog>
51+
</div>
52+
</template>
53+
54+
<script>
55+
import BpmnModeler from 'bpmn-js/lib/Modeler';
56+
import BaseMixin from './BaseMixin.js';
57+
58+
export default {
59+
mixins: [BaseMixin],
60+
props: {
61+
// Требуем обязательно передавать профайл документа
62+
profile: {
63+
type: Object,
64+
required: true
65+
},
66+
// Требуем обязательно передавать функцию получения контента
67+
getContent: {
68+
type: Function,
69+
required: true
70+
}
71+
},
72+
data() {
73+
return {
74+
modeler: null,
75+
descId: `desc-${Date.now()}`,
76+
error: null,
77+
isChange: false,
78+
saveRequest: false
79+
};
80+
},
81+
methods: {
82+
async onExit(autosave) {
83+
if (autosave && this.isChange) await this.save();
84+
else if (this.isChange) {
85+
this.saveRequest = true;
86+
return;
87+
} else {
88+
this.saveRequest = false;
89+
}
90+
this.$emit('onEdit', false);
91+
},
92+
93+
init() {
94+
this.modeler = new BpmnModeler({
95+
container: `#${this.descId}`,
96+
keyboard: {
97+
bindTo: window
98+
}
99+
});
100+
101+
this.modeler.on('element.changed', () => this.isChange = true);
102+
},
103+
applyContent(content) {
104+
this.modeler.importXML(content);
105+
},
106+
107+
async save() {
108+
try {
109+
const { xml } = await this.modeler.saveXML({ format: true });
110+
await this.putContent(this.profile.source, xml);
111+
this.isChange = false;
112+
this.$emit('input', xml);
113+
} catch (err) {
114+
window.alert(`При сохранении возникла ошибка: ${err?.message}`);
115+
// eslint-disable-next-line no-console
116+
console.error(err);
117+
}
118+
}
119+
}
120+
};
121+
</script>
122+
123+
<style scoped>
124+
.desk {
125+
min-height: 1000px;
126+
height: calc(100vh - 48px);
127+
width: 100%;
128+
position: relative;
129+
}
130+
131+
.document {
132+
position: relative;
133+
}
134+
135+
.toolbar {
136+
position: absolute;
137+
left: 82px;
138+
top: 20px;
139+
background-color: 0 !important;
140+
color: 0 !important;
141+
border: 1px solid rgba(0, 0, 0, 0.2) !important;
142+
}
143+
</style>
Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
<template>
2+
<div class="bpmnjs-space bpmnjs-document-viewer">
3+
<div
4+
v-html="`
5+
<style>
6+
.bpmnjs-document-viewer .bjs-breadcrumbs {
7+
left: 70px !important;
8+
top: 34px !important;
9+
}
10+
</style>
11+
`" />
12+
<div ref="container" class="bpmnjs-viewer" v-bind:style="{ height}" />
13+
<v-toolbar
14+
v-if="putContent"
15+
dense
16+
floating
17+
elevation="0"
18+
color="rgba(0, 0, 0, 0.03)"
19+
class="toolbar">
20+
<v-btn icon title="Редактировать" v-on:click="onEdit">
21+
<v-icon>mdi-file-edit-outline</v-icon>
22+
</v-btn>
23+
</v-toolbar>
24+
</div>
25+
</template>
26+
27+
<script>
28+
import BpmnJS from 'bpmn-js/dist/bpmn-navigated-viewer.production.min.js';
29+
import BaseMixin from './BaseMixin.js';
30+
31+
export default {
32+
mixins: [BaseMixin],
33+
data() {
34+
return {
35+
bpmnViewer: null,
36+
height: '50vh'
37+
};
38+
},
39+
methods: {
40+
init() {
41+
this.bpmnViewer = new BpmnJS({
42+
container: this.$refs.container
43+
});
44+
this.bpmnViewer.on('import.done', (event) => {
45+
event.error && this.registerError(event.error);
46+
event.warnings && this.registerWarning(event.warnings);
47+
this.bpmnViewer.get('canvas').zoom('fit-viewport');
48+
//todo Стоит оптимизировать высоту изображения
49+
// const rect = this.bpmnViewer.get('canvas')._viewport.getBoundingClientRect();
50+
});
51+
},
52+
applyContent(content) {
53+
this.bpmnViewer.importXML(content);
54+
},
55+
onEdit() {
56+
this.$emit('onEdit', true);
57+
}
58+
}
59+
};
60+
</script>
61+
62+
<style scoped>
63+
.bpmnjs-space {
64+
position: relative;
65+
height: 50vh;
66+
width: 100%;
67+
}
68+
69+
.bpmnjs-viewer {
70+
height: 50vh;
71+
width: 100%;
72+
}
73+
74+
.bpmnjs-space:hover .toolbar {
75+
display: block;
76+
}
77+
78+
.bpmnjs-space .toolbar {
79+
display: none;
80+
position: absolute;
81+
left: 20px;
82+
top: 20px;
83+
background-color: 0 !important;
84+
color: 0 !important;
85+
border: 1px solid rgba(0, 0, 0, 0.2) !important;
86+
}
87+
88+
</style>

0 commit comments

Comments
 (0)