djb-eapim/elink-test-master
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

스크립트 기능 추가

Browse Source
This commit is contained in:
yunjy
2022-08-19 10:37:36 +09:00
parent f5fb0e39ee
commit 83568bd9d5
15 changed files with 790 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/templates/page/add-edit-script-info.html
+169
View File
@@ -0,0 +1,169 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
layout:decorator="layout/default_layout">
<div class="content-wrapper" layout:fragment="content">
<!-- Content Header (Page header) -->
<section class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 th:if="${scriptInfo.id == null}">스크립트 정보 등록</h1>
<h1 th:unless="${scriptInfo.id == null}">스크립트 정보 수정</h1>
</div>
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active">스크립트 관리</li>
</ol>
</div>
</div>
</div>
<!-- /.container-fluid -->
</section>
<!-- Main content -->
<section class="content" style="padding-bottom: 1rem;">
<div class="container-fluid">
<form id="form" class="inputForm" action="#" th:action="@{/manage/saveScriptInfo}"
th:object="${scriptInfo}" method="post">
<div class="card card-default">
<div class="card-header">
<h3 class="card-title">Basic Info</h3>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="form-group row">
<label class="col-sm-3 col-form-label">스크립트 명<small>(*)</small></label>
<div class="col-sm-9">
<input id="scriptName" type="text" th:field="*{scriptName}" class="form-control">
<span th:if="${#fields.hasErrors('scriptName')}"
th:errors="*{scriptName}" class="text-danger"></span>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group row">
<label class="col-sm-3 col-form-label">스크립트 설명<small>(*)</small></label>
<div class="col-sm-9">
<input id="scriptName" type="text" th:field="*{scriptDesc}" class="form-control">
<span th:if="${#fields.hasErrors('scriptDesc')}"
th:errors="*{scriptDesc}" class="text-danger"></span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="card card-default">
<div class="card-header">
<h3 class="card-title">Script Code</h3>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-12">
<div class="form-group row">
<label class="col-sm-1 col-form-label">Script Editor</label>
<div class="col-sm-11">
<div id="scriptCode" class="shadow-sm" style="height:400px"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<input type="hidden" th:field="*{id}">
<button type="submit" class="btn btn-primary mr-2">Submit</button>
<button type="button" class="btn btn-secondary"
onclick="history.go(-1);">Cancel</button>
</form>
</div>
</section>
</div>
<th:block layout:fragment="script">
<link rel="stylesheet" data-name="vs/editor/editor.main"
th:href="@{/plugins/vs/editor/editor.main.css}">
<script>var require = { paths: { 'vs': '../../plugins/vs' } };</script>
<script th:src="@{/plugins/vs/loader.js}"></script>
<script th:src="@{/plugins/vs/editor/editor.main.nls.js}"></script>
<script th:src="@{/plugins/vs/editor/editor.main.js}"></script>
<script th:inline="javascript">
var urlForSidebar = "/manage/findAllScriptInfos";
let editor
const isNew = [[${scriptInfo.id == null}]];
function setMonaco(elementId, initValue){
var targetDivElement = document.getElementById(elementId);
editor = monaco.editor.create(targetDivElement, {
value: initValue,
language: 'java',
minimap: {
enabled: false
},
wordWrap: 'on',
wrappingStrategy: 'simple',
wordWrapBreakAfterCharacters: '',
wordWrapBreakBeforeCharacters: '',
wrappingIndent: 'none',
automaticLayout: true
});
const readonlyRange = new monaco.Range (1, 0, 7, 0)
editor.onKeyDown (e => {
const contains = editor.getSelections().findIndex (range => readonlyRange.intersectRanges (range))
let currentLineNumber = editor.getPosition().lineNumber
let lineCount = editor.getModel().getLineCount();
console.log(e.ctrlKey)
if(e.ctrlKey && e.keyCode == 33){
return
}
switch(e.keyCode){
case 13:
case 14:
case 15:
case 16:
case 17:
case 18:
case 63:
return
}
const matchTailPart = lineCount == currentLineNumber || lineCount - 1 == currentLineNumber;
if (contains !== -1 || matchTailPart) {
e.stopPropagation ()
e.preventDefault () // for Ctrl+C, Ctrl+V
return false;
}
});
$('#form').submit(function(eventObj) {
$('#scriptName').prop( "disabled", false );
$("<input />").attr("type", "hidden")
.attr("name", elementId)
.attr("value", editor.getValue())
.appendTo("#form");
return true;
});
}
setMonaco('scriptCode', [[${scriptInfo.scriptCode}]]);
if(isNew == false){
$('#scriptName').prop( "disabled", true );
}
$('#scriptName').on("change keyup paste", function(){
const scriptName = $('#scriptName').val();
const currentTextLength = editor.getModel().getLinesContent()[3].length + 1;
const newText = `public class ${scriptName} implements Script{`;
editor.executeEdits("my-source",
[{ range: new monaco.Range(4, 1, 4, currentTextLength), text: newText, forceMoveMarkers: true }]);
});
</script>
</th:block>
</html>