mirror of
https://github.com/NaiboWang/EasySpider.git
synced 2025-04-20 22:15:08 +08:00
右键删除
This commit is contained in:
parent
192a44611a
commit
e0de56633d
@ -8,6 +8,26 @@
|
|||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#contextMenu {
|
||||||
|
position: absolute;
|
||||||
|
background-color: white;
|
||||||
|
padding: 3px!important;
|
||||||
|
text-align: center;
|
||||||
|
border: 1px solid darkblue;
|
||||||
|
border-radius: 3px;
|
||||||
|
/*width: 120px;*/
|
||||||
|
}
|
||||||
|
|
||||||
|
#contextMenu div{
|
||||||
|
height: 30px;
|
||||||
|
padding-top: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#contextMenu div:hover {
|
||||||
|
background-color: rgba(211,211,211,0.4) !important;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
label{
|
label{
|
||||||
margin-left: 2px;
|
margin-left: 2px;
|
||||||
}
|
}
|
||||||
|
@ -44,18 +44,18 @@
|
|||||||
<button type="button" data=2 draggable="true" class="btn btn-outline-primary options">Click Element</button>
|
<button type="button" data=2 draggable="true" class="btn btn-outline-primary options">Click Element</button>
|
||||||
<button type="button" data=3 draggable="true" class="btn btn-outline-primary options">Collect Data</button>
|
<button type="button" data=3 draggable="true" class="btn btn-outline-primary options">Collect Data</button>
|
||||||
<button type="button" data=4 draggable="true" class="btn btn-outline-primary options">Input Text</button>
|
<button type="button" data=4 draggable="true" class="btn btn-outline-primary options">Input Text</button>
|
||||||
<button type="button" data=5 draggable="true" class="btn btn-outline-primary options">Custom Action</button>
|
<button type="button" data=5 draggable="true" class="btn btn-outline-primary options" style="font-weight: bold; font-size: 14px!important;">Custom Action</button>
|
||||||
<button type="button" data=6 draggable="true" style="font-size: 14px!important;" class="btn btn-outline-primary options">Change Option</button>
|
<button type="button" data=6 draggable="true" style="font-size: 14px!important;" class="btn btn-outline-primary options">Change Option</button>
|
||||||
<button type="button" data=7 draggable="true" class="btn btn-outline-primary options">Mouse Move</button>
|
<button type="button" data=7 draggable="true" class="btn btn-outline-primary options">Mouse Move</button>
|
||||||
<button type="button" data=8 draggable="true" class="btn btn-outline-primary options">Loop</button>
|
<button type="button" data=8 draggable="true" class="btn btn-outline-primary options" style="font-weight: bold">Loop</button>
|
||||||
<button type="button" data=9 draggable="true" class="btn btn-outline-primary options">If Condition</button>
|
<button type="button" data=9 draggable="true" class="btn btn-outline-primary options" style="font-weight: bold">If Condition</button>
|
||||||
<div>-----------------</div>
|
<div>-----------------</div>
|
||||||
<button type="button" data=13 class="btn btn-outline-primary options" title="Adjust the position of the next node/operation to be inserted">Set Anchor</button>
|
<button type="button" data=13 draggable="true" class="btn btn-outline-primary options" title="Adjust the position of the next node/operation to be inserted">Set Anchor</button>
|
||||||
<button type="button" data=10 class="btn btn-outline-primary options">Cut Element</button>
|
<button type="button" data=10 class="btn btn-outline-primary options">Cut Element</button>
|
||||||
<button type="button" data=11 class="btn btn-outline-primary options">Copy Element</button>
|
<button type="button" data=11 class="btn btn-outline-primary options">Copy Element</button>
|
||||||
<button type="button" data=12 class="btn btn-outline-primary options">Del Element</button>
|
<button type="button" data=12 class="btn btn-outline-primary options">Del Element</button>
|
||||||
<button type="button" data=0 class="btn btn-outline-primary2 options">Cancel</button>
|
<button type="button" data=0 class="btn btn-outline-primary2 options">Cancel</button>
|
||||||
<div style="text-align: left;margin: 10px;font-size:15px!important">Click button above and then click the flowchart to insert.</div>
|
<div style="text-align: left;margin: 10px;font-size:15px!important">Drag button above to the flowchart to insert.</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top:20px;border: solid;height:850px;overflow: auto;width:58%;float:right" id="flowchart_graph">
|
<div style="margin-top:20px;border: solid;height:850px;overflow: auto;width:58%;float:right" id="flowchart_graph">
|
||||||
|
@ -329,6 +329,11 @@ function branchClick(e) {
|
|||||||
function elementMousedown(e) {
|
function elementMousedown(e) {
|
||||||
if (e.button == 2) //右键点击
|
if (e.button == 2) //右键点击
|
||||||
{
|
{
|
||||||
|
try{
|
||||||
|
document.getElementById("contextMenu").remove();
|
||||||
|
} catch {
|
||||||
|
|
||||||
|
}
|
||||||
if (nowNode != null) {
|
if (nowNode != null) {
|
||||||
nowNode.style.borderColor = "skyblue";
|
nowNode.style.borderColor = "skyblue";
|
||||||
}
|
}
|
||||||
@ -342,6 +347,11 @@ function elementMousedown(e) {
|
|||||||
|
|
||||||
//元素点击事件
|
//元素点击事件
|
||||||
function elementClick(e) {
|
function elementClick(e) {
|
||||||
|
try{
|
||||||
|
document.getElementById("contextMenu").remove();
|
||||||
|
} catch (e) {
|
||||||
|
|
||||||
|
}
|
||||||
if (nowNode != null) {
|
if (nowNode != null) {
|
||||||
nowNode.style.borderColor = "skyblue";
|
nowNode.style.borderColor = "skyblue";
|
||||||
}
|
}
|
||||||
@ -429,10 +439,10 @@ function toolBoxKernel(e, para = null) {
|
|||||||
{
|
{
|
||||||
position2--;
|
position2--;
|
||||||
}
|
}
|
||||||
console.log(element);
|
// console.log(element);
|
||||||
nodeList[actionSequence[pId2]]["sequence"].splice(position2 + 1, 0, element[0]); //在相应位置添加新元素
|
nodeList[actionSequence[pId2]]["sequence"].splice(position2 + 1, 0, element[0]); //在相应位置添加新元素
|
||||||
refresh(); //重新渲染页面
|
refresh(); //重新渲染页面
|
||||||
console.log(nodeList[element[0]]);
|
// console.log(nodeList[element[0]]);
|
||||||
app._data.nowArrow = { "position": nodeList[element[0]]["position"], "pId": nodeList[element[0]]["parentId"], "num": 0 };
|
app._data.nowArrow = { "position": nodeList[element[0]]["position"], "pId": nodeList[element[0]]["parentId"], "num": 0 };
|
||||||
$("#" + nodeList[element[0]]["id"]).click();
|
$("#" + nodeList[element[0]]["id"]).click();
|
||||||
} else {
|
} else {
|
||||||
@ -642,7 +652,7 @@ function refresh(nowArrowReset = true) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function deleteElement() {
|
function deleteElement() {
|
||||||
if (nowNode.getAttribute("id") == 0) {
|
if (nowNode == null || nowNode.getAttribute("id") == 0) {
|
||||||
showError(LANG("当前未选中元素!", "No element is selected now!"));
|
showError(LANG("当前未选中元素!", "No element is selected now!"));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@ -676,7 +686,26 @@ function deleteElement() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
document.oncontextmenu = function() {
|
document.oncontextmenu = function() {
|
||||||
return false;
|
// 创建一个包含删除选项的右键菜单
|
||||||
|
let contextMenu = document.createElement("div");
|
||||||
|
contextMenu.id = "contextMenu";
|
||||||
|
contextMenu.innerHTML = `<div>${LANG("删除元素", "Delete Element")}`;
|
||||||
|
|
||||||
|
// 设置右键菜单的样式
|
||||||
|
contextMenu.style.position = "absolute";
|
||||||
|
contextMenu.style.left = event.clientX + "px";
|
||||||
|
contextMenu.style.top = event.clientY + "px";
|
||||||
|
contextMenu.style.width = LANG("140px", "180px");
|
||||||
|
|
||||||
|
// 添加删除元素的功能
|
||||||
|
contextMenu.addEventListener("click", function() {
|
||||||
|
// myElement.remove(); // 删除元素
|
||||||
|
deleteElement();
|
||||||
|
contextMenu.remove(); // 删除右键菜单
|
||||||
|
});
|
||||||
|
|
||||||
|
// 将右键菜单添加到文档中
|
||||||
|
document.body.appendChild(contextMenu);
|
||||||
} //屏蔽右键菜单
|
} //屏蔽右键菜单
|
||||||
//删除元素
|
//删除元素
|
||||||
|
|
||||||
|
@ -49,13 +49,13 @@
|
|||||||
<button type="button" data=7 draggable="true" class="btn btn-outline-primary options">移动到元素</button>
|
<button type="button" data=7 draggable="true" class="btn btn-outline-primary options">移动到元素</button>
|
||||||
<button type="button" data=8 draggable="true" class="btn btn-outline-primary options" style="font-weight: bold">循环</button>
|
<button type="button" data=8 draggable="true" class="btn btn-outline-primary options" style="font-weight: bold">循环</button>
|
||||||
<button type="button" data=9 draggable="true" class="btn btn-outline-primary options" style="font-weight: bold">判断条件</button>
|
<button type="button" data=9 draggable="true" class="btn btn-outline-primary options" style="font-weight: bold">判断条件</button>
|
||||||
<div>-----------------</div>
|
<div>----------</div>
|
||||||
<button type="button" data=13 class="btn btn-outline-primary options" title="调整下一个要插入的节点的位置">调整锚点</button>
|
<button type="button" data=13 draggable="true" class="btn btn-outline-primary options" title="调整下一个要插入的节点的位置">调整锚点</button>
|
||||||
<button type="button" data=10 class="btn btn-outline-primary options">剪切元素</button>
|
<button type="button" data=10 class="btn btn-outline-primary options">剪切元素</button>
|
||||||
<button type="button" data=11 class="btn btn-outline-primary options">复制元素</button>
|
<button type="button" data=11 class="btn btn-outline-primary options">复制元素</button>
|
||||||
<button type="button" data=12 class="btn btn-outline-primary options">删除元素</button>
|
<button type="button" data=12 class="btn btn-outline-primary options">删除元素</button>
|
||||||
<button type="button" data=0 class="btn btn-outline-primary2 options">取消操作</button>
|
<button type="button" data=0 class="btn btn-outline-primary2 options">取消操作</button>
|
||||||
<div style="text-align: left;margin: 10px;font-size:15px!important">提示:点击上方操作按钮后点击要放置元素的位置处的箭头,可按取消操作按钮取消。</div>
|
<div style="text-align: left;margin: 10px;font-size:15px!important">提示:拖动上方按钮到流程图箭头处以添加操作,也可以点击按钮再点击箭头。</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top:20px;border: solid;height:850px;overflow: auto;width:58%;float:right" id="flowchart_graph">
|
<div style="margin-top:20px;border: solid;height:850px;overflow: auto;width:58%;float:right" id="flowchart_graph">
|
||||||
|
Loading…
x
Reference in New Issue
Block a user