delete legacy flask-rendered html pages from initial prototype, since backend is now API-only
This commit is contained in:
burnettk
parent
2d5e7b36ec
commit
def02a5f56
|
|
@ -19,7 +19,6 @@ from spiffworkflow_backend.exceptions.api_error import api_error_blueprint
|
||||||
from spiffworkflow_backend.helpers.api_version import V1_API_PATH_PREFIX
|
from spiffworkflow_backend.helpers.api_version import V1_API_PATH_PREFIX
|
||||||
from spiffworkflow_backend.models.db import db
|
from spiffworkflow_backend.models.db import db
|
||||||
from spiffworkflow_backend.models.db import migrate
|
from spiffworkflow_backend.models.db import migrate
|
||||||
from spiffworkflow_backend.routes.admin_blueprint.admin_blueprint import admin_blueprint
|
|
||||||
from spiffworkflow_backend.routes.openid_blueprint.openid_blueprint import (
|
from spiffworkflow_backend.routes.openid_blueprint.openid_blueprint import (
|
||||||
openid_blueprint,
|
openid_blueprint,
|
||||||
)
|
)
|
||||||
|
|
@ -106,7 +105,6 @@ def create_app() -> flask.app.Flask:
|
||||||
|
|
||||||
app.register_blueprint(user_blueprint)
|
app.register_blueprint(user_blueprint)
|
||||||
app.register_blueprint(api_error_blueprint)
|
app.register_blueprint(api_error_blueprint)
|
||||||
app.register_blueprint(admin_blueprint, url_prefix="/admin")
|
|
||||||
app.register_blueprint(openid_blueprint, url_prefix="/openid")
|
app.register_blueprint(openid_blueprint, url_prefix="/openid")
|
||||||
|
|
||||||
# preflight options requests will be allowed if they meet the requirements of the url regex.
|
# preflight options requests will be allowed if they meet the requirements of the url regex.
|
||||||
|
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
"""__init__."""
|
|
||||||
|
|
@ -1,187 +0,0 @@
|
||||||
"""APIs for dealing with process groups, process models, and process instances."""
|
|
||||||
from typing import Union
|
|
||||||
|
|
||||||
from flask import Blueprint
|
|
||||||
from flask import flash
|
|
||||||
from flask import redirect
|
|
||||||
from flask import render_template
|
|
||||||
from flask import request
|
|
||||||
from flask import url_for
|
|
||||||
from werkzeug.wrappers import Response
|
|
||||||
|
|
||||||
from spiffworkflow_backend.services.process_instance_processor import (
|
|
||||||
ProcessInstanceProcessor,
|
|
||||||
)
|
|
||||||
from spiffworkflow_backend.services.process_instance_service import (
|
|
||||||
ProcessInstanceService,
|
|
||||||
)
|
|
||||||
from spiffworkflow_backend.services.process_model_service import ProcessModelService
|
|
||||||
from spiffworkflow_backend.services.spec_file_service import SpecFileService
|
|
||||||
from spiffworkflow_backend.services.user_service import UserService
|
|
||||||
|
|
||||||
admin_blueprint = Blueprint(
|
|
||||||
"admin", __name__, template_folder="templates", static_folder="static"
|
|
||||||
)
|
|
||||||
|
|
||||||
ALLOWED_BPMN_EXTENSIONS = {"bpmn", "dmn"}
|
|
||||||
|
|
||||||
|
|
||||||
@admin_blueprint.route("/process-groups", methods=["GET"])
|
|
||||||
def process_group_list() -> str:
|
|
||||||
"""Process_group_list."""
|
|
||||||
process_groups = ProcessModelService.get_process_groups()
|
|
||||||
return render_template("process_group_list.html", process_groups=process_groups)
|
|
||||||
|
|
||||||
|
|
||||||
@admin_blueprint.route("/process-groups/<process_group_id>", methods=["GET"])
|
|
||||||
def process_group_show(process_group_id: str) -> str:
|
|
||||||
"""Show_process_group."""
|
|
||||||
process_group = ProcessModelService.get_process_group(process_group_id)
|
|
||||||
return render_template("process_group_show.html", process_group=process_group)
|
|
||||||
|
|
||||||
|
|
||||||
@admin_blueprint.route("/process-models/<process_model_id>", methods=["GET"])
|
|
||||||
def process_model_show(process_model_id: str) -> Union[str, Response]:
|
|
||||||
"""Show_process_model."""
|
|
||||||
process_model = ProcessModelService.get_process_model(process_model_id)
|
|
||||||
files = SpecFileService.get_files(process_model, extension_filter="bpmn")
|
|
||||||
current_file_name = process_model.primary_file_name
|
|
||||||
if current_file_name is None:
|
|
||||||
flash("No primary_file_name", "error")
|
|
||||||
return redirect(url_for("admin.process_group_list"))
|
|
||||||
bpmn_xml = SpecFileService.get_data(process_model, current_file_name)
|
|
||||||
return render_template(
|
|
||||||
"process_model_show.html",
|
|
||||||
process_model=process_model,
|
|
||||||
bpmn_xml=bpmn_xml,
|
|
||||||
files=files,
|
|
||||||
current_file_name=current_file_name,
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
@admin_blueprint.route(
|
|
||||||
"/process-models/<process_model_id>/<file_name>", methods=["GET"]
|
|
||||||
)
|
|
||||||
def process_model_show_file(process_model_id: str, file_name: str) -> str:
|
|
||||||
"""Process_model_show_file."""
|
|
||||||
process_model = ProcessModelService.get_process_model(process_model_id)
|
|
||||||
bpmn_xml = SpecFileService.get_data(process_model, file_name)
|
|
||||||
files = SpecFileService.get_files(process_model, extension_filter="bpmn")
|
|
||||||
return render_template(
|
|
||||||
"process_model_show.html",
|
|
||||||
process_model=process_model,
|
|
||||||
bpmn_xml=bpmn_xml,
|
|
||||||
files=files,
|
|
||||||
current_file_name=file_name,
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
@admin_blueprint.route(
|
|
||||||
"/process-models/<process_model_id>/upload-file", methods=["POST"]
|
|
||||||
)
|
|
||||||
def process_model_upload_file(process_model_id: str) -> Response:
|
|
||||||
"""Process_model_upload_file."""
|
|
||||||
process_model = ProcessModelService.get_process_model(process_model_id)
|
|
||||||
|
|
||||||
if "file" not in request.files:
|
|
||||||
flash("No file part", "error")
|
|
||||||
request_file = request.files["file"]
|
|
||||||
# If the user does not select a file, the browser submits an
|
|
||||||
# empty file without a filename.
|
|
||||||
if request_file.filename == "" or request_file.filename is None:
|
|
||||||
flash("No selected file", "error")
|
|
||||||
else:
|
|
||||||
if request_file and _allowed_file(request_file.filename):
|
|
||||||
if request_file.filename is not None:
|
|
||||||
SpecFileService.add_file(
|
|
||||||
process_model, request_file.filename, request_file.stream.read()
|
|
||||||
)
|
|
||||||
ProcessModelService.save_process_model(process_model)
|
|
||||||
|
|
||||||
return redirect(
|
|
||||||
url_for("admin.process_model_show", process_model_id=process_model.id)
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
@admin_blueprint.route(
|
|
||||||
"/process_models/<process_model_id>/edit/<file_name>", methods=["GET"]
|
|
||||||
)
|
|
||||||
def process_model_edit(process_model_id: str, file_name: str) -> str:
|
|
||||||
"""Edit_bpmn."""
|
|
||||||
process_model = ProcessModelService.get_process_model(process_model_id)
|
|
||||||
bpmn_xml = SpecFileService.get_data(process_model, file_name)
|
|
||||||
|
|
||||||
return render_template(
|
|
||||||
"process_model_edit.html",
|
|
||||||
bpmn_xml=bpmn_xml.decode("utf-8"),
|
|
||||||
process_model=process_model,
|
|
||||||
file_name=file_name,
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
@admin_blueprint.route(
|
|
||||||
"/process-models/<process_model_id>/save/<file_name>", methods=["POST"]
|
|
||||||
)
|
|
||||||
def process_model_save(process_model_id: str, file_name: str) -> Union[str, Response]:
|
|
||||||
"""Process_model_save."""
|
|
||||||
process_model = ProcessModelService.get_process_model(process_model_id)
|
|
||||||
SpecFileService.update_file(process_model, file_name, request.get_data())
|
|
||||||
if process_model.primary_file_name is None:
|
|
||||||
flash("No primary_file_name", "error")
|
|
||||||
return redirect(url_for("admin.process_group_list"))
|
|
||||||
bpmn_xml = SpecFileService.get_data(process_model, process_model.primary_file_name)
|
|
||||||
return render_template(
|
|
||||||
"process_model_edit.html",
|
|
||||||
bpmn_xml=bpmn_xml.decode("utf-8"),
|
|
||||||
process_model=process_model,
|
|
||||||
file_name=file_name,
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
@admin_blueprint.route("/process-models/<process_model_id>/run", methods=["GET"])
|
|
||||||
def process_model_run(process_model_id: str) -> Union[str, Response]:
|
|
||||||
"""Process_model_run."""
|
|
||||||
user = UserService.create_user("Mr. Test", "internal", "Mr. Test")
|
|
||||||
process_instance = (
|
|
||||||
ProcessInstanceService.create_process_instance_from_process_model_identifier(
|
|
||||||
process_model_id, user
|
|
||||||
)
|
|
||||||
)
|
|
||||||
processor = ProcessInstanceProcessor(process_instance)
|
|
||||||
processor.do_engine_steps()
|
|
||||||
result = processor.get_data()
|
|
||||||
|
|
||||||
process_model = ProcessModelService.get_process_model(process_model_id)
|
|
||||||
files = SpecFileService.get_files(process_model, extension_filter="bpmn")
|
|
||||||
current_file_name = process_model.primary_file_name
|
|
||||||
if current_file_name is None:
|
|
||||||
flash("No primary_file_name", "error")
|
|
||||||
return redirect(url_for("admin.process_group_list"))
|
|
||||||
bpmn_xml = SpecFileService.get_data(process_model, current_file_name)
|
|
||||||
|
|
||||||
return render_template(
|
|
||||||
"process_model_show.html",
|
|
||||||
process_model=process_model,
|
|
||||||
bpmn_xml=bpmn_xml,
|
|
||||||
result=result,
|
|
||||||
files=files,
|
|
||||||
current_file_name=current_file_name,
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
# def _find_or_create_user(username: str = "test_user1") -> Any:
|
|
||||||
# """Find_or_create_user."""
|
|
||||||
# user = UserModel.query.filter_by(username=username).first()
|
|
||||||
# if user is None:
|
|
||||||
# user = UserModel(username=username)
|
|
||||||
# db.session.add(user)
|
|
||||||
# db.session.commit()
|
|
||||||
# return user
|
|
||||||
|
|
||||||
|
|
||||||
def _allowed_file(filename: str) -> bool:
|
|
||||||
"""_allowed_file."""
|
|
||||||
return (
|
|
||||||
"." in filename
|
|
||||||
and filename.rsplit(".", 1)[1].lower() in ALLOWED_BPMN_EXTENSIONS
|
|
||||||
)
|
|
||||||
|
|
@ -1,26 +0,0 @@
|
||||||
import BpmnViewer from "bpmn-js";
|
|
||||||
|
|
||||||
var viewer = new BpmnViewer({
|
|
||||||
container: "#canvas",
|
|
||||||
});
|
|
||||||
|
|
||||||
viewer
|
|
||||||
.importXML(pizzaDiagram)
|
|
||||||
.then(function (result) {
|
|
||||||
const { warnings } = result;
|
|
||||||
|
|
||||||
console.log("success !", warnings);
|
|
||||||
|
|
||||||
viewer.get("canvas").zoom("fit-viewport");
|
|
||||||
})
|
|
||||||
.catch(function (err) {
|
|
||||||
const { warnings, message } = err;
|
|
||||||
|
|
||||||
console.log("something went wrong:", warnings, message);
|
|
||||||
});
|
|
||||||
|
|
||||||
export function sayHello() {
|
|
||||||
console.log("hello");
|
|
||||||
}
|
|
||||||
|
|
||||||
window.foo = "bar";
|
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,18 +0,0 @@
|
||||||
{
|
|
||||||
"name": "spiffworkflow-backend",
|
|
||||||
"version": "0.0.0",
|
|
||||||
"description": "Serve up Spiff Workflows to the World!",
|
|
||||||
"main": "index.js",
|
|
||||||
"scripts": {
|
|
||||||
"test": "echo \"Error: no test specified\" && exit 1"
|
|
||||||
},
|
|
||||||
"author": "",
|
|
||||||
"license": "ISC",
|
|
||||||
"dependencies": {
|
|
||||||
"bpmn-js": "^9.1.0",
|
|
||||||
"bpmn-js-properties-panel": "^1.1.1"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"webpack-cli": "^4.9.2"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,2 +0,0 @@
|
||||||
.example {
|
|
||||||
}
|
|
||||||
|
|
@ -1,23 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
{% block head %}
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="{{ url_for('admin.static', filename='style.css') }}"
|
|
||||||
/>
|
|
||||||
<title>{% block title %}{% endblock %}</title>
|
|
||||||
{% endblock %}
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h1>{{ self.title() }}</h1>
|
|
||||||
{% with messages = get_flashed_messages(with_categories=true) %} {% if
|
|
||||||
messages %}
|
|
||||||
<ul class="flashes">
|
|
||||||
{% for category, message in messages %}
|
|
||||||
<li class="{{ category }}">{{ message }}</li>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
{% endif %} {% endwith %} {% block content %}{% endblock %}
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
{% extends "layout.html" %} {% block title %}Process Groups{% endblock %} {%
|
|
||||||
block content %}
|
|
||||||
<table>
|
|
||||||
<tbody>
|
|
||||||
{# here we iterate over every item in our list#} {% for process_group in
|
|
||||||
process_groups %}
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<a
|
|
||||||
href="{{ url_for('admin.process_group_show', process_group_id=process_group.id) }}"
|
|
||||||
>{{ process_group.display_name }}</a
|
|
||||||
>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{% endfor %}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
{% extends "layout.html" %}
|
|
||||||
{% block title %}Process Group: {{ process_group.id }}{% endblock %}
|
|
||||||
{% block content %}
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onclick="window.location.href='{{ url_for( 'admin.process_group_list') }}';"
|
|
||||||
>
|
|
||||||
Back
|
|
||||||
</button>
|
|
||||||
<table>
|
|
||||||
<tbody>
|
|
||||||
{# here we iterate over every item in our list#}
|
|
||||||
{% for process_model in process_group.process_models %}
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<a
|
|
||||||
href="{{ url_for('admin.process_model_show', process_model_id=process_model.id) }}"
|
|
||||||
>{{ process_model.display_name }}</a
|
|
||||||
>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{% endfor %}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
@ -1,167 +0,0 @@
|
||||||
{% extends "layout.html" %} {% block title %}
|
|
||||||
Process Model Edit: {{ process_model.id }}
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
{% block head %}
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
|
|
||||||
<!-- example styles -->
|
|
||||||
<!-- required modeler styles -->
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/bpmn-js.css" />
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/diagram-js.css" />
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/bpmn-font/css/bpmn.css" />
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/bpmn-js-properties-panel/dist/assets/properties-panel.css">
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/bpmn-js-properties-panel/dist/assets/element-templates.css">
|
|
||||||
|
|
||||||
<!-- modeler distro -->
|
|
||||||
<script src="https://unpkg.com/bpmn-js@9.1.0/dist/bpmn-modeler.development.js"></script>
|
|
||||||
|
|
||||||
<!-- needed for this example only -->
|
|
||||||
<script src="https://unpkg.com/jquery@3.3.1/dist/jquery.js"></script>
|
|
||||||
|
|
||||||
<!-- example styles -->
|
|
||||||
<style>
|
|
||||||
html, body, #canvas {
|
|
||||||
height: 100%;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.diagram-note {
|
|
||||||
background-color: rgba(66, 180, 21, 0.7);
|
|
||||||
color: White;
|
|
||||||
border-radius: 5px;
|
|
||||||
font-family: Arial;
|
|
||||||
font-size: 12px;
|
|
||||||
padding: 5px;
|
|
||||||
min-height: 16px;
|
|
||||||
width: 50px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.needs-discussion:not(.djs-connection) .djs-visual > :nth-child(1) {
|
|
||||||
stroke: rgba(66, 180, 21, 0.7) !important; /* color elements as red */
|
|
||||||
}
|
|
||||||
|
|
||||||
#save-button {
|
|
||||||
position: fixed;
|
|
||||||
bottom: 20px;
|
|
||||||
left: 20px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
<div id="result">{{ result }}</div>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onclick="window.location.href='{{ url_for( 'admin.process_model_show_file', process_model_id=process_model.id, file_name=file_name ) }}';"
|
|
||||||
>
|
|
||||||
Back
|
|
||||||
</button>
|
|
||||||
<button type="button" onclick="exportDiagram()">Save</button>
|
|
||||||
<!-- <div class="modeler"> -->
|
|
||||||
<div id="canvas"></div>
|
|
||||||
<div id="properties"></div>
|
|
||||||
<!-- </div> -->
|
|
||||||
|
|
||||||
<meta id="bpmn_xml" data-name="{{bpmn_xml}}" />
|
|
||||||
<script>
|
|
||||||
// import BpmnModeler from '/admin/static/node_modules/bpmn-js/lib/Modeler.js';
|
|
||||||
// import {
|
|
||||||
// BpmnPropertiesPanelModule,
|
|
||||||
// BpmnPropertiesProviderModule,
|
|
||||||
// } from '/admin/static/node_modules/bpmn-js-properties-panel/dist/index.js';
|
|
||||||
//
|
|
||||||
// const bpmnModeler = new BpmnModeler({
|
|
||||||
// container: '#canvas',
|
|
||||||
// propertiesPanel: {
|
|
||||||
// parent: '#properties'
|
|
||||||
// },
|
|
||||||
// additionalModules: [
|
|
||||||
// BpmnPropertiesPanelModule,
|
|
||||||
// BpmnPropertiesProviderModule
|
|
||||||
// ]
|
|
||||||
// });
|
|
||||||
|
|
||||||
// modeler instance
|
|
||||||
var bpmnModeler = new BpmnJS({
|
|
||||||
container: "#canvas",
|
|
||||||
keyboard: {
|
|
||||||
bindTo: window,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Save diagram contents and print them to the console.
|
|
||||||
*/
|
|
||||||
async function exportDiagram() {
|
|
||||||
try {
|
|
||||||
var data = await bpmnModeler.saveXML({ format: true });
|
|
||||||
//POST request with body equal on data in JSON format
|
|
||||||
fetch("/admin/process-models/{{ process_model.id }}/save/{{ file_name }}", {
|
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "text/xml",
|
|
||||||
},
|
|
||||||
body: data.xml,
|
|
||||||
})
|
|
||||||
.then((response) => response.json())
|
|
||||||
//Then with the data from the response in JSON...
|
|
||||||
.then((data) => {
|
|
||||||
console.log("Success:", data);
|
|
||||||
})
|
|
||||||
//Then with the error genereted...
|
|
||||||
.catch((error) => {
|
|
||||||
console.error("Error:", error);
|
|
||||||
});
|
|
||||||
|
|
||||||
alert("Diagram exported. Check the developer tools!");
|
|
||||||
} catch (err) {
|
|
||||||
console.error("could not save BPMN 2.0 diagram", err);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Open diagram in our modeler instance.
|
|
||||||
*
|
|
||||||
* @param {String} bpmnXML diagram to display
|
|
||||||
*/
|
|
||||||
async function openDiagram(bpmnXML) {
|
|
||||||
// import diagram
|
|
||||||
try {
|
|
||||||
await bpmnModeler.importXML(bpmnXML);
|
|
||||||
|
|
||||||
// access modeler components
|
|
||||||
var canvas = bpmnModeler.get("canvas");
|
|
||||||
var overlays = bpmnModeler.get("overlays");
|
|
||||||
|
|
||||||
// zoom to fit full viewport
|
|
||||||
canvas.zoom("fit-viewport");
|
|
||||||
|
|
||||||
// attach an overlay to a node
|
|
||||||
overlays.add("SCAN_OK", "note", {
|
|
||||||
position: {
|
|
||||||
bottom: 0,
|
|
||||||
right: 0,
|
|
||||||
},
|
|
||||||
html: '<div class="diagram-note">Mixed up the labels?</div>',
|
|
||||||
});
|
|
||||||
|
|
||||||
// add marker
|
|
||||||
canvas.addMarker("SCAN_OK", "needs-discussion");
|
|
||||||
} catch (err) {
|
|
||||||
console.error("could not import BPMN 2.0 diagram", err);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// trying to use the python variable bpmn_xml directly causes the xml to have escape sequences
|
|
||||||
// and using the meta tag seems to help with that
|
|
||||||
var bpmn_xml = $("#bpmn_xml").data();
|
|
||||||
openDiagram(bpmn_xml.name);
|
|
||||||
|
|
||||||
// wire save button
|
|
||||||
$("#save-button").click(exportDiagram);
|
|
||||||
</script>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
@ -1,159 +0,0 @@
|
||||||
{% extends "layout.html" %} {% block title %}Process Model: {{ process_model.id
|
|
||||||
}}{% endblock %} {% block head %} {{ super() }}
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
|
|
||||||
<script src="{{ url_for('admin.static', filename='node_modules/bpmn-js/dist/bpmn-viewer.development.js') }}"></script>
|
|
||||||
|
|
||||||
<!-- viewer distro (without pan and zoom) -->
|
|
||||||
<!--
|
|
||||||
<script src="https://unpkg.com/bpmn-js@9.1.0/dist/bpmn-viewer.development.js"></script>
|
|
||||||
-->
|
|
||||||
|
|
||||||
<!-- required viewer styles -->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/bpmn-js.css"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<!-- viewer distro (with pan and zoom) -->
|
|
||||||
<script src="https://unpkg.com/bpmn-js@9.1.0/dist/bpmn-navigated-viewer.development.js"></script>
|
|
||||||
|
|
||||||
<!-- needed for this example only -->
|
|
||||||
<script src="https://unpkg.com/jquery@3.3.1/dist/jquery.js"></script>
|
|
||||||
|
|
||||||
<!-- example styles -->
|
|
||||||
<style>
|
|
||||||
html,
|
|
||||||
body,
|
|
||||||
#canvas {
|
|
||||||
height: 90%;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.diagram-note {
|
|
||||||
background-color: rgba(66, 180, 21, 0.7);
|
|
||||||
color: White;
|
|
||||||
border-radius: 5px;
|
|
||||||
font-family: Arial;
|
|
||||||
font-size: 12px;
|
|
||||||
padding: 5px;
|
|
||||||
min-height: 16px;
|
|
||||||
width: 50px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.needs-discussion:not(.djs-connection) .djs-visual > :nth-child(1) {
|
|
||||||
stroke: rgba(66, 180, 21, 0.7) !important; /* color elements as red */
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
{% endblock %} {% block content %}
|
|
||||||
<div id="result">{{ result }}</div>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onclick="window.location.href='{{ url_for( 'admin.process_group_show', process_group_id=process_model.process_group_id ) }}';"
|
|
||||||
>
|
|
||||||
Back
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onclick="window.location.href='{{ url_for( 'admin.process_model_run' , process_model_id=process_model.id ) }}';"
|
|
||||||
>
|
|
||||||
Run
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onclick="window.location.href='{{ url_for( 'admin.process_model_edit' , process_model_id=process_model.id, file_name=current_file_name ) }}';"
|
|
||||||
>
|
|
||||||
Edit
|
|
||||||
</button>
|
|
||||||
|
|
||||||
{% if files %}
|
|
||||||
<h3>BPMN Files</h3>
|
|
||||||
<ul>
|
|
||||||
{% for file in files %}
|
|
||||||
<li>
|
|
||||||
<a
|
|
||||||
href="{{ url_for('admin.process_model_show_file', process_model_id=process_model.id, file_name=file.name) }}"
|
|
||||||
>{{ file.name }}</a
|
|
||||||
>
|
|
||||||
{% if file.name == current_file_name %} (current) {% endif %}
|
|
||||||
</li>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
<form
|
|
||||||
method="post"
|
|
||||||
action="/admin/process-models/{{process_model.id}}/upload-file"
|
|
||||||
enctype="multipart/form-data"
|
|
||||||
>
|
|
||||||
<input type="file" name="file" />
|
|
||||||
<input type="submit" value="Upload" />
|
|
||||||
</form>
|
|
||||||
|
|
||||||
<div id="canvas"></div>
|
|
||||||
|
|
||||||
<meta id="bpmn_xml" data-name="{{bpmn_xml}}" />
|
|
||||||
<script>
|
|
||||||
var diagramUrl =
|
|
||||||
"https://cdn.staticaly.com/gh/bpmn-io/bpmn-js-examples/dfceecba/starter/diagram.bpmn";
|
|
||||||
|
|
||||||
// viewer instance
|
|
||||||
var bpmnViewer = new BpmnJS({
|
|
||||||
container: "#canvas",
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Open diagram in our viewer instance.
|
|
||||||
*
|
|
||||||
* @param {String} bpmnXML diagram to display
|
|
||||||
*/
|
|
||||||
async function openDiagram(bpmnXML) {
|
|
||||||
// import diagram
|
|
||||||
try {
|
|
||||||
await bpmnViewer.importXML(bpmnXML);
|
|
||||||
|
|
||||||
// access viewer components
|
|
||||||
var canvas = bpmnViewer.get("canvas");
|
|
||||||
var overlays = bpmnViewer.get("overlays");
|
|
||||||
|
|
||||||
// zoom to fit full viewport
|
|
||||||
canvas.zoom("fit-viewport");
|
|
||||||
|
|
||||||
// attach an overlay to a node
|
|
||||||
overlays.add("SCAN_OK", "note", {
|
|
||||||
position: {
|
|
||||||
bottom: 0,
|
|
||||||
right: 0,
|
|
||||||
},
|
|
||||||
html: '<div class="diagram-note">Mixed up the labels?</div>',
|
|
||||||
});
|
|
||||||
|
|
||||||
// add marker
|
|
||||||
canvas.addMarker("SCAN_OK", "needs-discussion");
|
|
||||||
} catch (err) {
|
|
||||||
console.error("could not import BPMN 2.0 diagram", err);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
var bpmn_xml = $("#bpmn_xml").data();
|
|
||||||
openDiagram(bpmn_xml.name);
|
|
||||||
|
|
||||||
// load external diagram file via AJAX and open it
|
|
||||||
//$.get(diagramUrl, openDiagram, 'text');
|
|
||||||
</script>
|
|
||||||
<!--
|
|
||||||
Thanks for trying out our BPMN toolkit!
|
|
||||||
If you'd like to learn more about what our library,
|
|
||||||
continue with some more basic examples:
|
|
||||||
* https://github.com/bpmn-io/bpmn-js-examples/overlays
|
|
||||||
* https://github.com/bpmn-io/bpmn-js-examples/interaction
|
|
||||||
* https://github.com/bpmn-io/bpmn-js-examples/colors
|
|
||||||
* https://github.com/bpmn-io/bpmn-js-examples/commenting
|
|
||||||
To get a bit broader overview over how bpmn-js works,
|
|
||||||
follow our walkthrough:
|
|
||||||
* https://bpmn.io/toolkit/bpmn-js/walkthrough/
|
|
||||||
Related starters:
|
|
||||||
* https://raw.githubusercontent.com/bpmn-io/bpmn-js-examples/starter/modeler.html
|
|
||||||
-->
|
|
||||||
{% endblock %}
|
|
||||||
Loading…
Reference in New Issue