hawind/gdoo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

创建版本

Browse Source
This commit is contained in:
hawind
2021-02-22 12:17:00 +08:00
commit af555f49c3
2332 changed files with 369202 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Gdoo/Workflow/views/step/edit.blade.php
+820
View File
@@ -0,0 +1,820 @@
<script type="text/javascript">
var rows = {{json_encode($rows)}};
var condition = {
// 检查公式
checkExp:function(text)
{
if(text.indexOf("(") >= 0) {
var num1 = text.split("(").length;
var num2 = text.split(")").length;
if(num1 != num2) {
return false;
}
}
return true;
},
/**
* 增加左括号表达式，会断行
*/
addLeft:function(id)
{
var oObj = getId('condition_list_'+id);
var current = 0;
//检查是否有条件
if(oObj.options.length > 0)
{
for( var i = 0;i < oObj.options.length;i++) {
if(oObj.options[i].selected) {
current = oObj.selectedIndex;
break;
}
}
if(current == 0) {
current = oObj.options.length-1;
}
} else {
//有条件才能添加左括号表达式
toastrError('请先添加条件，再选择括号', '步骤设计');
return;
}
var sText = oObj.options[current].text;
//已经有条件的话
if( (sText.trim().substr(-3,3) == 'AND') || (sText.trim().substr(-2,2) == 'OR'))
{
toastrError('无法编辑已经存在关系的条件', '步骤设计');
return;
}
var sRelation = getId('relation_'+id).value;
if(sText.indexOf('(') >= 0)
{
if(!condition.CheckExp(sText))
{
toastrError('条件表达式书写错误,请检查括号匹配', '步骤设计');
return;
} else {
sText = sText + " " + sRelation;
}
} else {
sText = sText + " " + sRelation;
}
oObj.options[current].text = sText;
var oMyop = document.createElement('option');
oMyop.text = "(";
var nPos = oObj.options.length;
oObj.appendChild(oMyop,nPos);
},
/**
* 增加右括号表达式
*/
addRight:function(id)
{
var oObj = getId('condition_list_'+id);
var current = 0;
if(oObj.options.length > 0) {
for (var i = 0;i < oObj.options.length;i++) {
if(oObj.options[i].selected) {
current = oObj.selectedIndex;
break;
}
}
if(current == 0) {
current = oObj.options.length-1;
}
} else {
toastrError('请先添加条件，再选择括号');
return;
}
var sText = oObj.options[current].text;
if((sText.trim().substr(-3,3)=='AND') || (sText.trim().substr(-2,2)=='OR'))
{
toastrError('无法编辑已经存在关系的条件');
return;
}
if(sText.trim().substr(-1,1)=='(')
{
toastrError('请添加条件');
return;
}
if(!condition.checkExp(sText))
{
sText = sText + ")";
}
oObj.options[current].text = sText;
},
add:function(id)
{
var sField = $('#field_'+id).val(),sCon = $('#condition_'+id).val(),sValue = $('#item_value_'+id).val();
var bAdd = true;
if(sField !=='' && sCon !=='' && sValue !=='')
{
var oObj = getId('condition_list_'+id);
if( oObj.length > 0) {
var sLength = oObj.options.length;
var sText = oObj.options[sLength-1].text;
if(!condition.checkExp(sText)) {
bAdd = false;
}
}
if(sValue.indexOf("'") >= 0) {
toastrError("值中不能含有'号");
return;
}
// 字段有[]的时候不加`符号
sField = sField.indexOf("[") == 0 ? sField : "`" + sField + "`";
var sNewText = sField + " " + sCon + " '" + sValue + "'";
for( var i=0;i<oObj.options.length;i++ ) {
if( oObj.options[i].text.indexOf(sNewText)>=0 ) {
toastrError('条件重复');
return;
}
}
var sRelation = $('#relation_'+id).val();
if(bAdd)
{
var oMyop = document.createElement('option');
var nPos = oObj.options.length;
oMyop.text = sNewText;
oObj.appendChild(oMyop,nPos);
if(nPos > 0) {
oObj.options[nPos-1].text += " " + sRelation;
}
}
else
{
if(oObj.options[sLength-1].text.trim().substr(-1,1)=='(')
{
oObj.options[sLength-1].text += sNewText;
} else {
oObj.options[sLength-1].text += " " + sRelation + " " + sNewText;
}
}
} else {
toastrError('请补充完整条件');
return;
}
},
deleted:function(id)
{
var oObj = getId('condition_list_'+id);
for (var i = 0;i < oObj.options.length;i++ ) {
if(oObj.options[i].selected) {
if(typeof oObj.options[i+1] == 'undefined') {
if(typeof oObj.options[i-1] !== 'undefined') {
oObj.options[i-1].text = oObj.options[i-1].text.replace(/(AND|OR)$/,'');
}
}
oObj.removeChild(oObj.options[i]);
i--;
}
}
},
clear:function(id) {
$('#condition_list_'+id).empty();
},
//根据基本信息的下一步骤，设置《条件设置》tab的条件列表
init:function()
{
var step = $('#select_next_step input:checked');
$('#ctbody').empty();
for(var i = 0; i < step.length; i++)
{
var id = step[i].value;
var text = step[i].title;
var node = getId('tpl').innerHTML;
var html = node.replace(/\@id/g,id);
html = html.replace(/\@text/g,text);
$('#ctbody').append(html);
var list = rows[id].condition.split("\n");
for (var j = 0; j < list.length; j++) {
if(list[j])
{
$('#condition_list_'+id).append('<option>'+list[j]+'</option>');
}
}
}
},
//弹窗回调保存事件
save:function()
{
var formData = $('#my_form_step').serialize();
var nextStep = $('#select_next_step input:checked');
var condition = {};
for (var i = 0; i < nextStep.length; i++)
{
var id = nextStep[i].value;
var list = getId('condition_list_'+id).options;
var rows = [];
for (var j = 0; j < list.length; j++) {
if(list[j].text) {
rows.push(list[j].text);
}
}
// 空条件就赋值empty
condition[id] = rows.length > 0 ? rows : 'empty';
}
var param = {conditions:condition};
//console.log(formData);
$.post("{{url()}}",formData+'&'+$.param(param),function(data) {
if(data.status) {
workStep.init();
toastrSuccess('操作成功', '步骤设计');
}
},'json');
}
}
function selectUser()
{
var value = getId('select_user_type').value;
if(value == '0') {
$('#lock_info').html("允许修改办理人相关选项");
}
else {
$('#lock_info').html("允许修改办理人相关选项及默认会签人");
}
$('#select_process_user').hide();
$('#select_user').hide();
$('#select_field_user').hide();
if(value == 6)
$('#select_user').show();
if(value == 7)
$('#select_field_user').show();
if(value == 8)
$('#select_process_user').show();
}
function getId(id) {
return !id ? null : document.getElementById(id);
}
$(function()
{
condition.init();
selectUser();
$("[data-toggle='tooltip']").tooltip();
// 表单字段 checkbox 点击交互函数
$('#write').click(function()
{
if(this.checked)
{
check('write',true);
$('#secret').attr({'disabled':true,'checked':false});
$('#check').attr('checked',false).removeAttr('disabled');
} else {
check('write',false);
$('#secret').attr('checked',false).removeAttr('disabled');
$('#check').attr({'disabled':true,'checked':false});
}
});
$('#secret').click(function()
{
if(this.checked)
{
check('secret',true)
$('#write').attr({'disabled':true,'checked':false});
} else {
check('secret',false);
$('#write').attr('checked',false).removeAttr('disabled');
}
});
$('#check').click(function()
{
if(this.checked) {
check('check',true)
check('micro',true)
} else {
check('check',false);
check('micro',false);
}
});
$("input[name='write[]']").click(function() {
write_click(this);
$('#write').removeAttr('disabled');
if($('#write').attr('checked')==true) {
$('#write').attr('checked',false)
}
});
$("input[name='secret[]']").click(function() {
secret_click(this);
$('#secret').removeAttr('disabled');
if($('#secret').attr('checked')==true){
$('#secret').attr('checked',false)
}
});
$("input[name='check[]']").click(function() {
check_click(this);
$('#check').removeAttr('disabled');
if($('#check').attr('checked') == true) {
$('#check').attr('checked',false)
}
});
$("input[name='micro[]']").click(function() {
$('#check').removeAttr('disabled');
if($('#check').attr('checked')==true){
$('#check').attr('checked',false)
}
});
// 字段默认设置
var process_str = '{{$field_select['write']}}';
var parr = process_str.split(',');
for( i=0;i<parr.length;i++ ) {
if(parr[i]!=='') {
$('#write_'+parr[i]).click();
write_click(getId('write_'+parr[i]));
}
}
var hidden_str = '{{$field_select['secret']}}';
var harr = hidden_str.split(',');
for(i=0;i<harr.length;i++) {
if(harr[i]!=='') {
$('#secret_'+harr[i]).click();
secret_click(getId('secret_'+harr[i]));
}
}
var micro_str = '{{$field_select['auto']}}';
var marr = micro_str.split(',');
for(i=0;i<marr.length;i++) {
if(marr[i] !== '') {
getId('micro_'+marr[i]).checked = true;
}
}
@if($field_select['check'])
var checkjson = jQuery.parseJSON('{{$field_select['check']}}');
$.each(checkjson,function(i,n)
{
$('#regex_'+i).click();
check_click(getId('regex_'+i));
$('#regexList_'+i).val(n);
});
@endif
});
// 表单字段 checkbox 点击交互函数
//可写字段
function write_click(d)
{
var id = $(d).attr('key');
if(d.disabled == false)
{
if(d.checked)
{
$('#secret_'+id).attr('disabled',true);
if($('#regex_'+id))
{
$('#regex_'+id).attr('checked',false).removeAttr('disabled');
$('#regexList_'+id).hide();
}
if($('#micro_'+id))
{
$('#micro_'+id).attr('checked',false).removeAttr('disabled');
$('#micro_'+id).parent().css('color','#000');
}
}
else
{
$('#secret_'+id).attr('checked',false).removeAttr('disabled');
if($('#regex_'+id))
{
$('#regex_'+id).attr({'disabled':true,'checked':false});
$('#regexList_'+id).attr('disabled',true).hide();
}
if($('#micro_'+id))
{
$('#micro_'+id).attr({'disabled':true,'checked':false});
$('#micro_'+id).parent().css('color','#a0a0a0');
}
}
}
}
//字段验证
function check_click(d)
{
if (d == null) {
return;
}
var id = $(d).attr('key');
if(d.disabled == false)
{
if(d.checked)
{
$('#regexList_'+id).removeAttr('disabled').show();
}
else
{
$('#regexList_'+id).attr('disabled',true).hide();
}
}
}
//保密字段
function secret_click(d)
{
var id = $(d).attr('key');
if(d.disabled == false)
{
if(d.checked) {
$('#write_'+id).attr({'disabled':true,'checked':false});
} else {
$('#write_'+id).removeAttr('disabled').attr('checked',false);
}
}
}
//checkbox全选及反选操作
function check(desc, act)
{
if(desc == 'write') {
$("input[name='write[]']").each(function() {
if(this.disabled == false) {
this.checked = act;
}
write_click(this);
})
} else if(desc == 'secret') {
$("input[name='secret[]']").each(function() {
if(this.disabled == false) {
this.checked = act;
}
secret_click(this);
})
} else if(desc == 'check') {
$("input[name='check[]']").each(function() {
if(this.disabled == false) {
this.checked = act;
}
check_click(this);
})
} else if(desc == 'micro') {
$("input[name='micro[]']").each(function() {
if(this.disabled == false) {
this.checked = act;
}
})
}
}
</script>
<ul class="nav nav-tabs m-t padder" role="tablist">
<li class="active"><a href="#tabs-1" data-toggle="tab">基本设置</a></li>
<li><a href="#tabs-2" data-toggle="tab">办理权限</a></li>
<li><a href="#tabs-3" data-toggle="tab">表单字段</a></li>
<li><a href="#tabs-4" data-toggle="tab">条件设置</a></li>
</ul>
<form class="form-horizontal" action="{{url()}}" method="post" id="my_form_step" name="my_form_step">
<div class="tab-content">
<div class="tab-pane active" id="tabs-1">
<table class="table table-form">
<tr>
<td width="15%">流程名称</td>
<td><input type="text" id="title" name="title" value="{{$row['title']}}" class="form-control input-sm"></td>
</tr>
<tr>
<td>步骤序号</td>
<td><input type="text" id="number" name="number" value="{{$row['number']}}" class="form-control input-sm"></td>
</tr>
<tr>
<td>办理时限</td>
<td><div class="input-group">
<span class="bg-white input-group-addon">小时</span>
<input type="text" id="timeout" name="timeout" value="{{$row['timeout']}}" class="form-control input-sm">
<span class="bg-white input-group-addon"><a href="javascript:;" class="hinted" title="允许为小数，表示接收工作后办理的时限，为空表示不限时。"><i class="icon icon-info-sign"></i></a></span>
</div>
</td>
</tr>
<tr>
<td>步骤类型</td>
<td><select name="type" class="form-control input-sm" id="type">
<option value="1" @if($row['type']==1) selected @endif>普通节点</option>
<option value="2" @if($row['type']==2) selected @endif>开始节点</option>
<option value="3" @if($row['type']==3) selected @endif>结束节点</option>
<option value="4" @if($row['type']==4) selected @endif>子流程节点</option>
</select>
</td>
</tr>
<tr>
<td>其他选项</td>
<td><label class="checkbox-inline"><input type="checkbox" name="last" value="1" @if($row['last']==1) checked @endif> 允许退回</label>&nbsp;
<label class="checkbox-inline"><input type="checkbox" name="deny" value="1" @if($row['deny']==1) checked @endif> 允许拒绝</label>&nbsp;
<label class="checkbox-inline"><input type="checkbox" name="print" value="1" @if($row['print']==1) checked @endif> 允许打印</label>
</td>
</tr>
<tr>
<td>提醒发起人</td>
<td><div class="input-group">
<input name="notification_text[0]" type="text" class="form-control input-sm" value="{{$row['notification_text']['0']}}">
<span class="bg-white input-group-addon">
<label class="p-t-none checkbox-inline" title="短信提醒:发起人"><input type="checkbox" name="notification_type[0][]" @if(is_array($row['notification_type']['0']) && in_array(1,$row['notification_type']['0'])) checked @endif value="1"> 短信</label>&nbsp;
<label class="p-t-none checkbox-inline" title="邮件提醒:发起人"><input type="checkbox" name="notification_type[0][]" @if(is_array($row['notification_type']['0']) && in_array(2,$row['notification_type']['0'])) checked @endif value="2"> 邮件</label>&nbsp;
<label class="p-t-none checkbox-inline" title="即时通提醒:发起人"><input type="checkbox" name="notification_type[0][]" @if(is_array($row['notification_type']['0']) && in_array(3,$row['notification_type']['0'])) checked @endif value="3"> 即时通</label>
</span>
</div>
</td>
</tr>
<tr>
<td>提醒下一步经办人</td>
<td><div class="input-group">
<input name="notification_text[1]" type="text" class="form-control input-sm" value="{{$row['notification_text']['1']}}">
<span class="bg-white input-group-addon">
<label class="p-t-none checkbox-inline" title="短信提醒:下一步经办人"><input type="checkbox" name="notification_type[1][]" @if(is_array($row['notification_type']['1']) && in_array(1,(array)$row['notification_type']['1'])) checked @endif value="1"> 短信</label>&nbsp;
<label class="p-t-none checkbox-inline" title="邮件提醒:下一步经办人"><input type="checkbox" name="notification_type[1][]" @if(is_array($row['notification_type']['1']) && in_array(2,(array)$row['notification_type']['1'])) checked @endif value="2"> 邮件</label>&nbsp;
<label class="p-t-none checkbox-inline" title="即时通提醒:下一步经办人"><input type="checkbox" name="notification_type[1][]" @if(is_array($row['notification_type']['1']) && in_array(3,(array)$row['notification_type']['1'])) checked @endif value="3"> 即时通</label>
</span>
</div>
</td>
</tr>
<tr>
<td>提醒下一步会签人</td>
<td><div class="input-group">
<input name="notification_text[2]" type="text" class="form-control input-sm" value="{{$row['notification_text']['2']}}">
<span class="bg-white input-group-addon">
<label class="p-t-none checkbox-inline" title="短信提醒:下一步会签人"><input type="checkbox" name="notification_type[2][]" @if(is_array($row['notification_type']['2']) && in_array(1,$row['notification_type']['2'])) checked @endif value="1"> 短信</label>&nbsp;
<label class="p-t-none checkbox-inline" title="邮件提醒:下一步会签人"><input type="checkbox" name="notification_type[2][]" @if(is_array($row['notification_type']['2']) && in_array(2,$row['notification_type']['2'])) checked @endif value="2"> 邮件</label>&nbsp;
<label class="p-t-none checkbox-inline" title="即时通提醒:下一步会签人"><input type="checkbox" name="notification_type[2][]" @if(is_array($row['notification_type']['2']) && in_array(3,$row['notification_type']['2'])) checked @endif value="3"> 即时通</label>
</span>
</div>
</td>
</tr>
<tr>
<td>下一步骤</td>
<td><div id="select_next_step">
@if($rows)
@foreach($rows as $k => $v)
<label class="checkbox-inline"><input type="checkbox" id="step_{{$v['id']}}" value="{{$v['id']}}" title="{{$v['title']}}" @if(in_array($k,$row['joinArray'])) checked @endif disabled> {{$v['title']}}</label>&nbsp;&nbsp;
@endforeach
@endif
</div>
</td>
</tr>
</table>
</div>
<div class="tab-pane" id="tabs-2">
<table class="table table-form">
<tr>
<td width="15%">经办权限</td>
<td>{{App\Support\Dialog::search($row,'id=permission_id&name=permission_name&multi=1')}}</td>
</tr>
<tr>
<td>选人过滤范围</td>
<td><div class="input-group">
<select class="form-control input-sm" name="user_filter" id="user_filter">
<option value="0">选择指定办理人</option>
<option value="1">选择本部门</option>
<option value="3">选择上级部门</option>
<option value="4">选择下级部门</option>
<option value="2">选择本岗位</option>
</select>
<span class="bg-white input-group-addon"><a href="javascript:;" class="hinted" title="选人过滤规则在流程转交选择办理人员时生效。默认设置为只能选择指定办理人员"><i class="icon icon-info-sign"></i></a></span>
</div>
</td>
</tr>
<tr>
<td>自动选人规则</td>
<td><div class="input-group">
<select class="form-control input-sm" name="select_user_type" id="select_user_type" onchange="selectUser()">
<option value="0" @if($row['select_user_type']==0) selected @endif >不自动选择</option>
<option value="1" @if($row['select_user_type']==1) selected @endif >选择发起人</option>
<option value="9" @if($row['select_user_type']==9) selected @endif >选择发起人本部门主管</option>
<option value="10" @if($row['select_user_type']==10) selected @endif >选择发起人上级主管领导</option>
<option value="11" @if($row['select_user_type']==11) selected @endif >选择发起人上级分管领导</option>
<option value="12" @if($row['select_user_type']==12) selected @endif >选择发起人一级部门主管</option>
<option value="13" @if($row['select_user_type']==13) selected @endif >选择发起人直属领导</option>
<option value="2" @if($row['select_user_type']==2) selected @endif >选择经办人本部门主管</option>
<option value="3" @if($row['select_user_type']==3) selected @endif >选择经办人上级主管领导</option>
<option value="4" @if($row['select_user_type']==4) selected @endif >选择经办人上级分管领导</option>
<option value="5" @if($row['select_user_type']==5) selected @endif >选择经办人一级部门主管</option>
<option value="14" @if($row['select_user_type']==14) selected @endif >选择经办人直属领导</option>
<option value="6" @if($row['select_user_type']==6) selected @endif >选择指定人员</option>
<option value="7" @if($row['select_user_type']==7) selected @endif >选择表单字段</option>
<option value="8" @if($row['select_user_type']==8) selected @endif >选择指定步骤办理人</option>
</select>
<span class="bg-white input-group-addon">
<a href="javascript:;" class="hinted" title="自动选人规则,使流程办理人通过指定规则智能选择。默认设置为：不自动选择。注意，请同时设置好经办权限，自动选人规则才能生效。"> <i class="icon icon-info-sign"></i></a>
</span>
</div>
<div class="m-t" id="select_field_user" style="display:none;">
<label>根据表单字段选择办理人</label>
<select class="form-control input-sm" name="select_field_user">
@if($fields)
@foreach($fields as $k => $v)
<option value="{{$v['itemid']}}" @if($row['select_user_sign']==$v['itemid']) selected @endif>{{$v['title']}}</option>
@endforeach
@endif
</select>
</div>
<div class="m-t" id="select_process_user" style="display:none;">
<label>选择此步骤第一次办理时的办理人</label>
<select class="form-control input-sm" name="select_process_user">
@if($rows)
@foreach($rows as $k => $v)
<option value="{{$k}}" @if($row['select_user_sign']==$k) selected @endif>{{$v['title']}}</option>
@endforeach
@endif
</select>
</div>
<div class="m-t" id="select_user" style="display:none;">
<div class="form-group">
<label class="col-sm-2 control-label">主办人</label>
<div class="col-sm-10">
{{App\Support\Dialog::user('user','select_user_id',$row['select_user_id'], 0, 0)}}
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">会签人</label>
<div class="col-sm-10">
{{App\Support\Dialog::user('user','select_user_sign',$row['select_user_sign'], 1, 0)}}
</div>
</div>
</div>
<div id="lock" class="m-t">
<label id="lock_info"></label>
<select class="form-control input-sm" name="select_user_lock">
<option value="0" @if($row['select_user_lock'] == 0) selected @endif>允许</option>
<option value="1" @if($row['select_user_lock'] == 1) selected @endif>不允许</option>
</select>
</div>
</td>
</tr>
</table>
</div>
<div class="tab-pane" id="tabs-3">
<table class="table m-b-none">
<thead>
<tr>
<th align="left" width="140">字段名称</th>
<th align="left" width="140">控件类型</th>
<th align="left" style="width:80px;"><label class="checkbox-inline"><input type="checkbox" id="write"> 可写字段</label></th>
<th align="left" style="width:80px;"><label class="checkbox-inline"><input type="checkbox" id="secret"> 保密字段</label></th>
<th align="left" style="width:120px;"><label class="checkbox-inline"><input type="checkbox" id="check"> 字段规则</label></th>
</tr>
</thead>
@if(isset($fields))
<tbody id="loop">
<tr>
<td>[流程公共附件]</td>
<td><span class="label label-info">公共附件</span></td>
<td><label><input type="checkbox" name="write[]" key="attach" value="[attach@]" id="write_attach"></label></td>
<td><label><input type="checkbox" name="secret[]" value="[attach@]" key="attach" id="secret_attach"></label></td>
<td>无</td>
</tr>
@if($fields)
@foreach($fields as $k => $v)
<tr>
<td>{{$v['title']}}</td>
<td>{{$v['desc']}}</td>
<td><label><input type="checkbox" name="write[]" key="{{$v['itemid']}}" value="{{$v['title']}}" id="write_{{$v['itemid']}}"></label></td>
<td><label><input type="checkbox" name="secret[]" value="{{$v['title']}}" key="{{$v['itemid']}}" id="secret_{{$v['itemid']}}"></label></td>
<td class="form-inline">
@if(!isset($v['datafld']))
<label><input type="checkbox" key="{{$v['itemid']}}" disabled="true" value="{{$v['title']}}" name="check[]" id="regex_{{$v['itemid']}}"></label>&nbsp;
<select class="input-sm form-control" style="display:none;" disabled name="check_select[]" id="regexList_{{$v['itemid']}}">
@foreach(config('default.regular') as $i => $j)
<option value="{{$i}}">{{$j['title']}}</option>
@endforeach
</select>
@else
<label title="锁定将不允许修改宏控件的值">
<input type="checkbox" key="{{$v['itemid']}}" value="{{$v['title']}}" disabled="true" name="micro[]" id="micro_{{$v['itemid']}}">&nbsp;锁定
</label>
@endif
</td>
</tr>
@endforeach
@endif
</tbody>
@endif
</table>
</div>
<div class="tab-pane" id="tabs-4">
<div id="tpl" style="display:none;">
<table class="table m-b-none">
<tr>
<td>
<div class="h5">转入步骤 @text</div>
</td>
</tr>
<tr>
<td>
<div class="form-inline">
<select class="input-sm form-control" id="field_@id">
<option value="">字段</option>
@if($fields)
@foreach($fields as $k => $v)
<option>{{$v['title']}}</option>
@endforeach @endif
<option value="[发起人姓名]">[发起人姓名]</option>
<option value="[发起人职位]">[发起人职位]</option>
<option value="[发起人岗位]">[发起人岗位]</option>
<option value="[发起人部门]">[发起人部门]</option>
<option value="[经办人姓名]">[经办人姓名]</option>
<option value="[经办人职位]">[经办人职位]</option>
<option value="[经办人岗位]">[经办人岗位]</option>
<option value="[经办人部门]">[经办人部门]</option>
<option value="[步骤号]">[步骤号]</option>
<option value="[流程设计步骤号]">[流程设计步骤号]</option>
<option value="[公共附件名称]">[公共附件名称]</option>
<option value="[公共附件个数]">[公共附件个数]</option>
</select>
<div class="input-group">
<!--
<span class="input-group-addon">条件</span>
-->
<select class="input-sm form-control" id="condition_@id">
<option value="==">等于</option>
<option value="&lt;&gt;">不等于</option>
<option value="&gt;">大于</option>
<option value="&lt;">小于</option>
<option value="&gt;=">大于等于</option>
<option value="&lt;=">小于等于</option>
<option value="include">包含</option>
<option value="exclude">不包含</option>
</select>
</div>
<div class="input-group">
<!--
<span class="input-group-addon">值</span>
-->
<input type="text" class="input-sm form-control" id="item_value_@id">
</div>
<div class="input-group">
<!--
<span class="input-group-addon">关系</span>
-->
<select class="input-sm form-control" id="relation_@id">
<option value="AND">与</option>
<option value="OR">或</option>
</select>
</div>
<div class="btn-group">
<a class="btn btn-sm btn-default" onclick="condition.addLeft('@id')">(</a>
<a class="btn btn-sm btn-default" onclick="condition.addRight('@id')">)</a>
<a class="btn btn-sm btn-default" onclick="condition.add('@id')">新增</a>
<a class="btn btn-sm btn-default" onclick="condition.deleted('@id')">删行</a>
<a class="btn btn-sm btn-default" onclick="condition.clear('@id')">清空</a>
</div>
<div class="m-t-sm">
<select class="form-control input-sm" id="condition_list_@id" multiple="true" style="width:100%;height:80px;"></select>
</div>
</div>
</td>
</tr>
</table>
</div>
<div id="ctbody"></div>
</div>
</div>
<input type="hidden" name="id" value="{{$row['id']}}">
</form>
app/Gdoo/Workflow/views/step/index.blade.php
+425
View File
@@ -0,0 +1,425 @@
<script src="{{$asset_url}}/vendor/jquery.plumb.min.js" type="text/javascript"></script>
<script type="text/javascript">
var intervalTimer = null;
var nowStepId = null;
var normalStepSelector = ".wf-step:not(.wf-step-start,.wf-step-end)";
// 判断连接器是否指向了自己
var isConnectToSelf = function(param) {
return param.sourceId === param.targetId
},
isFromStartToEnd = function(param) {
return param.sourceId === "step_-1" && param.targetId === "step_0"
},
// 判断连接步骤是否重复
stepIsRepeat = function(param){
// 获取同一scope下的链接器，判断当前链接是否有重复
var cnts = jsPlumb.getConnections(param.scope);
if(cnts.length > 0) {
for(var i = 0, len = cnts.length; i < len; i++) {
// 如果有链接器 sourceId 及 targetId 都相等，那大概也许可能就相等了。
if(param.sourceId === cnts[i].sourceId && param.targetId === cnts[i].targetId) {
return true;
}
}
}
return false;
};
// 连接前的事件
var beforeDropHandler = function(param) {
if(isConnectToSelf(param)) {
toastrError('连接点不能是自己。');
return false;
}
// 连接步骤是否重复
if(stepIsRepeat(param)) {
toastrError('连接点已经存在。');
return false;
}
// 连接步骤是结束
if(isFromStartToEnd(param)) {
return false;
}
return true;
};
$(document).ready(function()
{
// 获取步骤图
workStep.init();
$('#graph').contextmenu({'target':'#graph-menu'});
// 阻止非空白处的右键事件，不出现菜单
//$container.on("contextmenu", "*", function(evt) {
//evt.stopPropagation();
//});
// 点击或双击事件,这里进行了一个单击事件延迟，因为同时绑定了双击事件
$("#rows").on('click','div', function() {
clearTimeout(intervalTimer);
intervalTimer = setTimeout(function() {
workStep.click();
},300);
}).on('dblclick','div',function() {
clearTimeout(intervalTimer);
workStep.dblClick('base');
});
});
var workStep = {
init:function() {
jsPlumb.reset();
jsPlumb.bind("beforeDrop", beforeDropHandler);
$.post("{{url('index')}}",{work_id:'{{$work_id}}'},function(data)
{
$('#rows').empty();
var nLastStepId = 0;
if(data.total > 0) {
jsPlumb.importDefaults({
DragOptions:{cursor:'pointer'},
ConnectionOverlays:[
["Arrow",{location:1,id:"arrow",width:10,length:8}]
],
Anchor:'Continuous',
Endpoint :"Blank",
EndpointStyle:{radius:3,strokeStyle:'#1e8151'},
HoverPaintStyle:{radius:3,strokeStyle:'#999'},
ConnectorZIndex:5,
HoverPaintStyle:workStep.connectorHoverStyle
});
if(!$.support.leadingWhitespace) {
// ie9以下，用VML画图
jsPlumb.setRenderMode(jsPlumb.VML);
} else {
// 其他浏览器用SVG
jsPlumb.setRenderMode(jsPlumb.SVG);
}
// 第一次循环，生成页面元素div
var left = 0;
var top = 0;
$.each(data.rows, function(i, row) {
if(row.posX == 0 && row.posY == 0) {
left = 20;
top = 20;
if(nLastStepId == 0) {
}
else if(nLastStepId %5 == 0) {
top += 60;
left = 20;
} else {
left+= 160;
}
} else {
left = row.posX;
top = row.posY;
}
var title = '<span class="ep">' + row.number + '</span>&nbsp;' + row.title;
if(row.number == -1) {
title = '<span class="ep"><i class="icon icon-play"></i></span>&nbsp;' + row.title;
} else if(row.number == 0) {
title = '<span class="ep"><i class="icon icon-stop"></i></span>&nbsp;' + row.title;
}
var css = 'wf-step';
if(row.number == -1) {
css = 'wf-step wf-step-start';
} else if(row.number == 0) {
css = 'wf-step wf-step-end';
}
var nodeDiv = document.createElement('div');
var $node = $(nodeDiv);
$node.attr("id", "step_"+row.id)
.attr("join", row.join)
.attr("step_id", row.id)
.css({"left":left+'px',"top":top+'px',"cursor":"move"})
.addClass(css)
.html(title);
/*
$(normalStepSelector).on('mousedown', function(e) {
//if(row.number > 0) {
nowStepId = $(e.target).attr('step_id');
// $(this).contextmenu({'target':'#step-menu'});
//}
//e.stopPropagation();
});
*/
$("#rows").append($node);
// 索引变量
nLastStepId++;
});
// 绑定右键操作菜单
$(normalStepSelector).on('mousedown', function(e) {
nowStepId = $(e.target).attr('step_id');
$(this).contextmenu({'target':'#step-menu'});
// e.stopPropagation();
});
// 使之可拖动
jsPlumb.draggable($(".wf-step"));
$(".ep").each(function(i,e) {
var p = $(e).parent();
jsPlumb.makeSource($(e), {
parent:p,
anchor:"Continuous",
endpoint:"Blank",
paintStyle:{
strokeStyle:"#3399cc",
fillStyle:"transparent",
radius:2,
lineWidth:2
},
// stub 线条弯曲角度 gap 距离节点位置 cornerRadius 线条圆角
connector:["Flowchart",{stub:[10, 30], gap:0, cornerRadius:3, alwaysRespectStubs:true}],
connectorStyle:workStep.connectorPaintStyle,
hoverPaintStyle:workStep.endpointHoverStyle,
connectorHoverStyle:workStep.connectorHoverStyle,
dragOptions:{},
maxConnections:-1
});
});
// 绑定删除确认操作
jsPlumb.bind("click",function(e) {
jsPlumb.detach(e);
});
// 连接关联的步骤
$('.wf-step').each(function(i) {
var id = $(this).attr('id');
var join = $(this).attr('join');
var joinArray = join.split(",");
$.each(joinArray,function(j, n) {
if(n > 0) {
jsPlumb.connect({source:id, target:"step_"+n});
}
})
});
jsPlumb.makeTarget($('.wf-step'), {
dropOptions: {hoverClass:"dragHover", activeClass:"active"},
anchor: "Continuous",
maxConnections: 5
});
}
},'json');
},
connectorPaintStyle:{
lineWidth:2,
strokeStyle:"#3399cc",
joinstyle:"round",
outlineColor:"white",
dashstyle:"0",
outlineWidth:2
},
connectorHoverStyle:{
lineWidth:2,
strokeStyle:"#999999",
outlineWidth:2,
dashstyle:"4 1",
outlineColor:"white"
},
endpointHoverStyle:{
strokeStyle:"#216477"
},
// 清空所有连接
clear:function() {
jsPlumb.detachEveryConnection();
jsPlumb.deleteEveryEndpoint();
},
// 单击事件
click:function() {
if(nowStepId > 0)
{
$('#tree').hide();
$.post('{{url("view")}}',{id:nowStepId,work_id:'{{$work_id}}'}, function(res)
{
$('#tree').html(res.data).show();
})
}
},
// 删除步骤
deleted:function() {
$.messager.confirm('操作警告','确认要删除该步骤吗?',function(btn) {
if (btn == true) {
$.post('{{url("delete")}}',{id:nowStepId,work_id:'{{$work_id}}'},function(data) {
if(data.status) {
workStep.init();
toastrSuccess('操作成功');
}
},'json');
}
});
},
// 克隆步骤
clone:function() {
$.messager.confirm('操作警告','确认要克隆该步骤吗?',function(btn) {
if (btn == true) {
$.post('{{url("add")}}',{id:nowStepId,work_id:'{{$work_id}}'},function(data) {
if(data.status) {
workStep.init();
toastrSuccess('操作成功');
}
},'json');
}
});
},
dblClick:function(tab) {
if(nowStepId > 0) {
var box = $.dialog({
title:'步骤设计',
dialogClass: 'modal-lg',
backdrop: 'static',
url:'{{url("edit")}}?work_id={{$work_id}}&id='+nowStepId+'&tab='+tab,
buttons:[{
text:'<i class="fa fa-check-circle"></i> 提交',
click:function() {
condition.save();
$(this).dialog("close");
}
},{
text:'<i class="icon icon-minus"></i> 取消',
click:function() {
$(this).dialog("close");
//box.dialog('close');
}
}/*,{
text:'刷新',handler:function() {
box.dialog('refresh');
}
}*/]
});
}
},
add:function() {
$.post('{{url("add")}}',{work_id:'{{$work_id}}'},function(data) {
if(data.status) {
workStep.init();
toastrSuccess('操作成功');
}
},'json');
},
save:function() {
var join = [],position = [];
var rows = jsPlumb.getConnections();
if(rows.length == 0) {
toastrError('请先建立连接');
return;
}
for (var i = 0; i < rows.length; i++) {
var sourceId = rows[i].sourceId.substring(5);
var targetId = rows[i].targetId.substring(5);
join[i] = {id:sourceId,target:targetId};
}
$('#rows div').each(function(i) {
if(this.id.substring(0,5) == 'step_') {
var stepId = this.id.substring(5);
var left = $(this).css('left');
var top = $(this).css('top');
position[i] = {'id':stepId,'posX':left,'posY':top};
}
});
$.post('{{url("save")}}',{join:join,position:position,work_id:'{{$work_id}}'},function(result) {
if (result.status) {
toastrSuccess('保存当前视图成功');
}
},'json');
}
}
</script>
<div class="panel">
<div class="panel-heading b-b b-light">
{{$work['title']}} <span class="badge badge-empty">{{$work['id']}}</span>
</div>
<div class="padder-v clearfix">
<div class="col-sm-10 m-b">
<div class="m-b">
<a class="btn btn-info" onclick="workStep.add();" href="javascript:;">新建步骤</a>
<a class="btn btn-default" onclick="workStep.init();" href="javascript:;">重新加载</a>
<a href="javascript:;" onclick="workStep.clear();" class="btn btn-default"><i class="fa fa-ban"></i> 清空连接</a>
</div>
<div class="graph" id="graph" data-toggle="context" data-target="#graph-menu">
<div id="rows"></div>
<!--
<a href="javascript:;" data-toggle="tooltip" title="" data-original-title="从步骤图形框序号上拖出一条链接线到想要的步骤上，双击步骤图形框设置基本属性，单击鼠标右键弹出功能菜单。"><i class="icon icon-info-sign"></i></a>
-->
</div>
<div id="graph-menu">
<ul class="dropdown-menu" role="menu">
<li role="presentation"><a role="menuitem" onclick="workStep.add();" href="javascript:;">新建步骤</a></li>
<li role="presentation" class="divider"></li>
<li role="presentation"><a role="menuitem" onclick="workStep.save();" href="javascript:;">保存视图</a></li>
<li role="presentation"><a role="menuitem" onclick="workStep.init();" href="javascript:;">重新加载</a></li>
</ul>
</div>
<div id="step-menu">
<ul class="dropdown-menu" role="menu">
<li role="presentation"><a role="menuitem" onclick="workStep.dblClick('base');" href="javascript:;">基本设置</a></li>
<li role="presentation"><a role="menuitem" onclick="workStep.dblClick('handle');" href="javascript:;">经办权限</a></li>
<li role="presentation"><a role="menuitem" onclick="workStep.dblClick('field');" href="javascript:;">表单字段</a></li>
<li role="presentation"><a role="menuitem" onclick="workStep.dblClick('condition');" href="javascript:;">条件设置</a></li>
<li role="presentation" class="divider"></li>
<li role="presentation"><a role="menuitem" onclick="workStep.clone();" href="javascript:;">克隆该步骤</a></li>
<li role="presentation"><a role="menuitem" onclick="workStep.deleted();" href="javascript:;">删除该步骤</a></li>
</ul>
</div>
</div>
<div class="col-sm-2">
<div class="panel panel-default">
<div class="panel-heading">基本信息</div>
<div class="panel-body">
<div id="tree"></div>
</div>
<div class="panel-heading b-t">表单字段</div>
<div class="panel-body">
<div id="tree"></div>
</div>
<div class="panel-heading b-t">办理人员</div>
<div class="panel-body">
<div id="tree"></div>
</div>
</div>
<div class="m-b">
<a href="javascript:;" onclick="workStep.save();" class="btn btn-lg btn-block btn-info"><i class="fa fa-random"></i> 保存连接和视图</a>
</div>
</div>
</div>
</div>