?? editworkflowdefinition.aspx
字號:
?<%@ Page Language="C#" MasterPageFile="~/Admin/Default.master" AutoEventWireup="true"
CodeBehind="EditWorkflowDefinition.aspx.cs" Inherits="Agile.OA.Web.Admin.EditWorkflowDefinition" %>
<asp:Content ID="Content" ContentPlaceHolderID="Content" runat="server">
<script type="text/javascript">
$(
function()
{
var fromElement;
var toElement;
//$("#DefinitionContainer > ul").idTabs();
$("#DefinitionContainer > ul").idTabs();
$("#TemplateContent").attr("src", $("#<%= this.Template.ClientID %>").val() == "" ? "" : "../Definition/" + $("#<%= this.Template.ClientID %>").val());
PageMethods.GetWorkflowLayout($("#<%= this.Id.ClientID %>").val(),
function(result)
{
$("#Diagram").html(result);
$("oval, roundrect").draggable(
{
containment: "parent"
});
});
$.hotkeys.add("del",
function()
{
var id = $(fromElement).attr("id");
if (id != null)
{
$("curve[@fromElement=" + id + "], line[@fromElement=" + id + "]").remove();
$("curve[@toElement=" + id + "], line[@toElement=" + id + "]").remove();
}
$(fromElement).remove();
});
$("#Diagram").bind("contextmenu",
function()
{
event.returnValue = false;
});
$("#Diagram").mouseup(
function()
{
$(this).css("cursor", "default");
});
$("curve, line").livequery("mousedown",
function(e)
{
if (e.button == 1)
{
fromElement = this;
$("curve, line").attr("strokecolor", "black");
$("oval, roundrect").attr("fillcolor", "green");
$(this).attr("strokecolor", "red");
}
});
$("oval.Initial, roundrect").livequery("dblclick",
function()
{
var result = window.showModalDialog(encodeURI("ChooseWorkflowProperty.aspx?Name=" + $(this).text() + "&Description=" + $(this).attr("title") + "&Template=" + $("#<%= this.Template.ClientID %>").val() + "&Permissions=" + $(this).attr("permissions") + "&Controls=" + $(this).attr("controls")), window, "dialogWidth:800px;dialogHeight:600px;center:1;help:1;resizable:0;scroll:1;status:0;");
if (result != null)
{
var elements = result.split("&");
for (var i = 0, j = elements.length; i < j; i++)
{
var attributes = elements[i].split("=");
if (attributes.length == 2)
{
if (attributes[0] == "Name")
{
$(fromElement).find("textbox").text(attributes[1]);
}
else if (attributes[0] == "Description")
{
$(fromElement).attr("title", attributes[1]);
}
else
{
$(fromElement).attr(attributes[0], attributes[1]);
}
}
}
}
});
$("oval, roundrect").livequery("mousedown",
function(e)
{
fromElement = this;
$("curve, line").attr("strokecolor", "black");
$("oval, roundrect").attr("fillcolor", "green");
$(this).attr("fillcolor", "red");
if (e.button == 1)
{
$(this).css("cursor", "move");
}
else if (e.button == 2)
{
$(this).parent().css("cursor", "crosshair");
}
});
$("oval, roundrect").livequery("mouseout",
function(e)
{
$(this).css("cursor", "default");
});
$("oval, roundrect").livequery("mouseover",
function(e)
{
$(this).css("cursor", "crosshair");
});
$("oval, roundrect").livequery("mouseup",
function(e)
{
toElement = this;
var fromId = $(fromElement).attr("id");
var toId = $(toElement).attr("id");
if (e.button == 1)
{
$("curve[@fromElement=" + fromId + "], line[@fromElement=" + fromId + "]").each(
function()
{
RefreshRoute(this, fromElement, $("#" + $(this).attr("toElement"))[0]);
});
$("curve[@toElement=" + toId + "], line[@toElement=" + toId + "]").each(
function()
{
RefreshRoute(this, $("#" + $(this).attr("fromElement"))[0], toElement);
});
$(this).css("cursor", "crosshair");
}
else if (e.button == 2)
{
var fromClass = $(fromElement).attr("class");
if (fromClass == "Initial ui-draggable" || fromClass == "Normal ui-draggable" && $("curve[@toElement=" + fromId + "], line[@toElement=" + fromId + "]").length > 0)
{
if (fromId == toId)
{
if ($("curve[@fromElement=" + fromId + "][@toElement=" + toId + "]").length == 0)
{
$("#Diagram").append("<v:curve style='z-index:1;position:absolute' from='0,0' control1='80,-80' control2='-80,-80' filled='false' fillcolor='white' strokecolor='black' strokeweight='1.8px'><v:stroke opacity='1' startarrow='oval' startarrowwidth='narrow' startarrowlength='short' endarrow='classic' endarrowwidth='wide' endarrowlength='long'></v:stroke></v:curve>");
RefreshRoute($("curve:last")[0], fromElement, toElement);
}
}
else
{
if ($("line[@fromElement=" + fromId + "][@toElement=" + toId + "]").length == 0)
{
$("#Diagram").append("<v:line style='z-index:1;position:absolute' from='0,0' to='0,0' strokecolor='black' strokeweight='1.8px'><v:stroke opacity='1' startarrow='oval' startarrowwidth='narrow' startarrowlength='short' endarrow='classic' endarrowwidth='wide' endarrowlength='long'></v:stroke></v:line>");
RefreshRoute($("line:last")[0], fromElement, toElement);
}
}
}
$(this).parent().css("cursor", "default");
}
});
$("#<%= this.Template.ClientID %>").change(
function()
{
$("#TemplateContent").attr("src", $(this).val() == "" ? "" : "../Definition/" + $(this).val());
});
$("#Initial, #Normal, #Completed").click(
function()
{
var id = $(this).attr("id");
if (id == "Initial")
{
if ($("oval." + id).length == 0)
{
$("#Diagram").append("<v:oval id='" + NewGuid() + "' class='Initial' title='開始' style='z-index:1;position:absolute;left:300px;top:300px;width:90px;height:60px' filled='true' fillcolor='green' strokecolor='black' strokeweight='1px'><v:extrusion on='true' foredepth='0' backdepth='12pt' color='white' diffusity='72089f'></v:extrusion><v:fill type='frame' opacity='0.5'></v:fill><v:textbox contentEditable='true' style='font-size:12px;color:#ffffff;word-break:break-all;font-family:System;text-align:center;vertical-align:middle' inset='5pt,5pt,5pt,5pt'>開始</v:textbox></v:oval>");
$("oval:last").draggable(
{
containment: "parent"
});
}
}
else if (id == "Completed")
{
if ($("oval." + id).length == 0)
{
$("#Diagram").append("<v:oval id='" + NewGuid() + "' class='Completed' title='結束' style='z-index:1;position:absolute;left:300px;top:500px;width:90px;height:60px' filled='true' fillcolor='green' strokecolor='black' strokeweight='1px'><v:extrusion on='true' foredepth='0' backdepth='12pt' color='white' diffusity='72089f'></v:extrusion><v:fill type='frame' opacity='0.5'></v:fill><v:textbox contentEditable='true' style='font-size:12px;color:#ffffff;word-break:break-all;font-family:System;text-align:center;vertical-align:middle' inset='5pt,5pt,5pt,5pt'>結束</v:textbox></v:oval>");
$("oval:last").draggable(
{
containment: "parent"
});
}
}
else if (id == "Normal")
{
$("#Diagram").append("<v:roundrect id='" + NewGuid() + "' class='Normal' title='任務' style='z-index:1;position:absolute;left:300px;top:400px;width:90px;height:60px' filled='true' fillcolor='green' strokecolor='black' strokeweight='1px'><v:extrusion on='true' foredepth='0' backdepth='12pt' color='white' diffusity='72089f'></v:extrusion><v:fill type='frame' opacity='0.5'></v:fill><v:textbox contentEditable='true' style='font-size:12px;color:#ffffff;word-break:break-all;font-family:System;text-align:center;vertical-align:middle' inset='5pt,5pt,5pt,5pt'>任務</v:textbox></v:roundrect>");
$("roundrect:last").draggable(
{
containment: "parent"
});
}
});
$("#Save").click(
function()
{
var result = new String();
if ($("oval.Initial").length == 0)
{
result = "請增加『開 始』任務";
}
else if ($("oval.Completed").length == 0)
{
result = "請增加『結 束』任務";
}
else
{
$("oval.Initial").each(
function()
{
var id = $(this).attr("id");
var name = $(this).text();
if ($("line[@fromElement=" + id + "]").length == 0)
{
result = "請指定任務『" + name + "』的相關路由";
}
else if ($(this).attr("Permissions") == null)
{
result = "請指定任務『" + name + "』的相關權限";
}
});
$("roundrect.Normal").each(
function()
{
var id = $(this).attr("id");
var name = $(this).text();
if ($("line[@fromElement=" + id + "]").length == 0 || $("line[@toElement=" + id + "]").length == 0)
{
result = "請指定任務『" + name + "』的相關路由";
}
else if ($(this).attr("Permissions") == null)
{
result = "請指定任務『" + name + "』的相關權限";
}
});
$("oval.Completed").each(
function()
{
var id = $(this).attr("id");
var name = $(this).text();
if ($("line[@toElement=" + id + "]").length == 0)
{
result = "請指定任務『" + name + "』的相關路由";
}
});
}
if (result.length == 0)
{
PageMethods.SaveWorkflowDefinition($("#<%= this.Id.ClientID %>").val(), $("#<%= this.Name.ClientID %>").val(), $("#<%= this.Description.ClientID %>").val(), $("#<%= this.Template.ClientID %>").val(), $("#Diagram").html());
location.href = "ListWorkflowDefinition.aspx";
}
else
{
alert(result);
}
});
});
function RefreshRoute(route, from, to)
{
var fromCenterLeft = 0, fromCenterTop = 0, fromHeight = 0, fromLeft = 0, fromTop = 0, fromWidth = 0, ra = 0, rf = 0, rt = 0, toCenterLeft = 0, toCenterTop = 0, toHeight = 0, toLeft = 0, toTop = 0, toWidth = 0;
fromLeft = parseFloat(from.style.left);
fromTop = parseFloat(from.style.top);
fromWidth = parseFloat(from.style.width);
fromHeight = parseFloat(from.style.height);
fromCenterLeft = fromLeft + fromWidth / 2;
fromCenterTop = fromTop + fromHeight / 2;
toLeft = parseFloat(to.style.left);
toTop = parseFloat(to.style.top);
toWidth = parseFloat(to.style.width);
toHeight = parseFloat(to.style.height);
toCenterLeft = toLeft + toWidth / 2;
toCenterTop = toTop + toHeight / 2;
if (from.id == to.id)
{
fromLeft = fromCenterLeft + fromWidth / 2;
fromTop = fromCenterTop;
toLeft = toCenterLeft;
toTop = toCenterTop - toHeight / 2;
}
else
{
ra = Math.atan(Math.abs((toCenterTop - fromCenterTop) / (toCenterLeft - fromCenterLeft)));
rf = Math.atan(fromHeight / fromWidth);
rt = Math.atan(toHeight / toWidth);
if (ra < rf)
{
fromLeft = fromCenterLeft - Sign(fromCenterLeft - toCenterLeft) * fromWidth / 2;
fromTop = fromCenterTop - Sign(fromCenterTop - toCenterTop) * fromWidth * Math.tan(ra) / 2;
}
else
{
fromLeft = fromCenterLeft - Sign(fromCenterLeft - toCenterLeft) * fromHeight / (2 * Math.tan(ra));
fromTop = fromCenterTop - Sign(fromCenterTop - toCenterTop) * fromHeight / 2;
}
if (ra < rt)
{
toLeft = toCenterLeft + Sign(fromCenterLeft - toCenterLeft) * toWidth / 2;
toTop = toCenterTop + Sign(fromCenterTop - toCenterTop) * toWidth * Math.tan(ra) / 2;
}
else
{
toLeft = toCenterLeft + Sign(fromCenterLeft - toCenterLeft) * toHeight / (2 * Math.tan(ra));
toTop = toCenterTop + Sign(fromCenterTop - toCenterTop) * toHeight / 2;
}
}
route.style.left = fromLeft;
route.style.top = fromTop;
route.to = (toLeft - fromLeft) + "," + (toTop - fromTop);
route.fromElement = from.id;
route.toElement = to.id;
}
function Sign(value)
{
var result = 0;
if (value < 0)
{
result = -1;
}
else if (value > 0)
{
result = 1;
}
return result;
}
function S4()
{
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
function NewGuid()
{
return S4() + S4() + S4() + S4() + S4() + S4() + S4() + S4();
}
</script>
<div id="DefinitionContainer" class="usual">
<ul>
<li><a href="#InstanceContainer">流程信息</a></li>
<li><a href="#TemplateContainer">流程模板</a></li>
<li><a href="#DiagramContainer">流程圖形</a></li>
</ul>
<div id="InstanceContainer">
<table class="Container">
<tr>
<td colspan="2">
<asp:HiddenField ID="Id" runat="server" />
</td>
</tr>
<tr>
<td class="Name">
名 稱：
</td>
<td class="Value">
<asp:TextBox ID="Name" runat="server" CssClass="{required: true}" MaxLength="20"
ToolTip="請輸入名稱"></asp:TextBox>
</td>
</tr>
<tr>
<td class="Name">
描 述：
</td>
<td class="Value">
<asp:TextBox ID="Description" runat="server" SkinID="Description" MaxLength="100"
TextMode="MultiLine"></asp:TextBox>
</td>
</tr>
<tr>
<td class="Name">
模 板：
</td>
<td class="Value">
<asp:DropDownList ID="Template" runat="server">
</asp:DropDownList>
</td>
</tr>
</table>
</div>
<div id="TemplateContainer">
<iframe id="TemplateContent" frameborder="0" height="100%" scrolling="no" width="100%">
</iframe>
</div>
<div id="DiagramContainer">
<table class="Container">
<tr>
<td class="Top">
<input id="Initial" type="button" class="Button" value="開 始" />
<input id="Normal" type="button" class="Button" value="任 務" />
<input id="Completed" type="button" class="Button" value="結 束" />
<input id="Save" type="button" class="Button" value="保 存" />
</td>
</tr>
<tr>
<td>
<div id="Diagram" class="Diagram">
</div>
</td>
</tr>
</table>
</div>
</div>
</asp:Content>
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -