创建版本
This commit is contained in:
@@ -0,0 +1,74 @@
|
||||
<form method="post" id="model_bill" name="model_bill">
|
||||
<table class="table table-form m-b-none">
|
||||
<tr>
|
||||
<td align="right" width="10%">单据名称</th>
|
||||
<td><input type="text" id="name" name="name" value="{{$bill->name}}" class="form-control input-sm"></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">单据编码</th>
|
||||
<td><input type="text" id="code" name="code" value="{{$bill->code}}" class="form-control input-sm"></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">单据路径</th>
|
||||
<td><input type="text" id="uri" name="uri" value="{{$bill->uri}}" class="form-control input-sm"></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">模型主表</td>
|
||||
<td>
|
||||
<select class="form-control input-sm" name="model_id" id="model_id">
|
||||
<option value="0"> - </option>
|
||||
@foreach($models as $_model)
|
||||
<option value="{{$_model->id}}" @if($_model->id == $bill->model_id) selected @endif>{{$_model->name}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">编号前缀</th>
|
||||
<td><input type="text" id="sn_prefix" name="sn_prefix" value="{{$bill->sn_prefix}}" class="form-control input-sm"></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">编号规则</th>
|
||||
<td><input type="text" id="sn_rule" name="sn_rule" value="{{$bill->sn_rule}}" class="form-control input-sm"></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">编号长度</th>
|
||||
<td><input type="text" id="sn_length" name="sn_length" value="{{$bill->sn_length}}" class="form-control input-sm"></td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<td align="right">审核类型</td>
|
||||
<td>
|
||||
<label class="radio-inline"><input type="radio" @if($bill['audit_type'] == 0) checked @endif value="0" name="audit_type"> 无 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($bill['audit_type'] == 1) checked @endif value="1" name="audit_type"> 固定流程 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($bill['audit_type'] == 2) checked @endif value="2" name="audit_type"> 自由流程 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($bill['audit_type'] == 3) checked @endif value="3" name="audit_type"> 审核 </label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">表单模式</td>
|
||||
<td>
|
||||
<label class="radio-inline"><input type="radio" @if($bill['form_type'] == 0) checked @endif value="0" name="form_type"> ERP </label>
|
||||
<label class="radio-inline"><input type="radio" @if($bill['form_type'] == 1) checked @endif value="1" name="form_type"> OA </label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">支持回收站</td>
|
||||
<td>
|
||||
<label class="radio-inline"><input type="radio" @if($bill['is_trash'] == 0) checked @endif value="0" name="is_trash"> 否 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($bill['is_trash'] == 1) checked @endif value="1" name="is_trash"> 是 </label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
<input type="hidden" name="id" value="{{$bill->id}}">
|
||||
</form>
|
||||
@@ -0,0 +1,107 @@
|
||||
{{$header["js"]}}
|
||||
|
||||
<div class="panel no-border" id="{{$header['master_table']}}-controller">
|
||||
@include('headers')
|
||||
<div class='list-jqgrid'>
|
||||
<div id="{{$header['master_table']}}-grid" style="width:100%;" class="ag-theme-balham"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
(function ($) {
|
||||
var table = '{{$header["master_table"]}}';
|
||||
var config = gdoo.grids[table];
|
||||
var action = config.action;
|
||||
var search = config.search;
|
||||
|
||||
action.dialogType = 'dialog';
|
||||
|
||||
// 自定义搜索方法
|
||||
search.searchInit = function (e) {
|
||||
var self = this;
|
||||
}
|
||||
|
||||
action.view = function(data) {
|
||||
var me = this;
|
||||
var grid = config.grid;
|
||||
var url = app.url('model/template/index', {bill_id: data.master_id});
|
||||
var index = layer.open({
|
||||
skin: 'layui-layer-frame',
|
||||
scrollbar: false,
|
||||
closeBtn: 2,
|
||||
title: data.master_name + '[视图]',
|
||||
type: 2,
|
||||
move: false,
|
||||
area: ['100%', '100%'],
|
||||
content: url,
|
||||
});
|
||||
}
|
||||
action.flow = function(data) {
|
||||
var me = this;
|
||||
var grid = config.grid;
|
||||
top.addTab('model/step/index2?bill_id=' + data.master_id, 'flow_step_index2', '单据流程');
|
||||
}
|
||||
action.permission = function(data) {
|
||||
var me = this;
|
||||
var grid = config.grid;
|
||||
var url = app.url('model/permission/index', {bill_id: data.master_id});
|
||||
var index = layer.open({
|
||||
skin: 'layui-layer-frame',
|
||||
scrollbar: false,
|
||||
closeBtn: 2,
|
||||
title: data.master_name + '[权限]',
|
||||
type: 2,
|
||||
move: false,
|
||||
area: ['100%', '100%'],
|
||||
content: url,
|
||||
});
|
||||
}
|
||||
|
||||
var options = new agGridOptions();
|
||||
var gridDiv = document.querySelector("#{{$header['master_table']}}-grid");
|
||||
gridDiv.style.height = getPanelHeight(48);
|
||||
|
||||
options.remoteDataUrl = '{{url()}}';
|
||||
options.remoteParams = search.advanced.query;
|
||||
options.columnDefs = config.cols;
|
||||
options.onRowDoubleClicked = function (params) {
|
||||
if (params.node.rowPinned) {
|
||||
return;
|
||||
}
|
||||
if (params.data == undefined) {
|
||||
return;
|
||||
}
|
||||
if (params.data.master_id > 0) {
|
||||
action.edit(params.data);
|
||||
}
|
||||
};
|
||||
|
||||
new agGrid.Grid(gridDiv, options);
|
||||
|
||||
// 自定义行按钮渲染
|
||||
options.actionCellBeforeRender = function(html, act, data) {
|
||||
if (act.action == 'flow') {
|
||||
if (data.audit_type == 1) {
|
||||
return html;
|
||||
}
|
||||
return '';
|
||||
} else {
|
||||
return html;
|
||||
}
|
||||
}
|
||||
|
||||
// 读取数据
|
||||
options.remoteData({page: 1});
|
||||
|
||||
// 绑定自定义事件
|
||||
var $gridDiv = $(gridDiv);
|
||||
$gridDiv.on('click', '[data-toggle="event"]', function () {
|
||||
var data = $(this).data();
|
||||
if (data.master_id > 0) {
|
||||
action[data.action](data);
|
||||
}
|
||||
});
|
||||
config.grid = options;
|
||||
})(jQuery);
|
||||
|
||||
</script>
|
||||
@include('footers')
|
||||
@@ -0,0 +1,311 @@
|
||||
<form class="form-horizontal form-controller" method="post" action="{{url()}}" id="flow-field" name="flow_field">
|
||||
|
||||
<div class="form-group">
|
||||
<div class="col-sm-3 control-label" for="model_id"><span style="color:red;">*</span> 模型名</div>
|
||||
<div class="col-sm-9 control-text b-t">
|
||||
<select class="form-control input-sm" name="model_id" id="model_id">
|
||||
@foreach($models as $v)
|
||||
<option value="{{$v['id']}}" @if($row['model_id'] == $v['id']) selected @endif>{{$v['name']}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="name">
|
||||
<span style="color:red;">*</span>
|
||||
字段别名
|
||||
<a class="hinted" href="javascript:;" title="例如客户名称"><i class="fa fa-question-circle"></i></a>
|
||||
</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<input class="form-control input-sm" type="text" name="name" value="{{$row['name']}}" id="name" onblur="app.pinyin('name','field');" required="required" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="field"><span style="color:red;">*</span>
|
||||
字段名
|
||||
<a class="hinted" href="javascript:;" title="只能由英文字母、数字和下划线组成，并且仅能字母开头"><i class="fa fa-question-circle"></i></a>
|
||||
</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<input class="form-control input-sm" type="text" id="field" name="field" value="{{$row['field']}}" required="required" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="form_type"><span style="color:red;">*</span> 编辑类别</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" name="form_type" id="form_type" required="required">
|
||||
<option value=""> - </option>
|
||||
{{:$titles = Gdoo\Model\Services\FieldService::title()}}
|
||||
@foreach($titles as $id => $title)
|
||||
<option value="{{$id}}" @if($row['form_type'] == $id) selected @endif>{{$title}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="content" class="b-t">
|
||||
@if($row['id'])
|
||||
{{Gdoo\Model\Services\FieldService::{'form_'.$row['form_type']}($row['setting'], $row['model_id'])}}
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="data_format">格式数据</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" name="data_format">
|
||||
<option value=""> - </option>
|
||||
<option value="text" @if($row['data_format'] == 'text') selected @endif>文本</option>
|
||||
<option value="number" @if($row['data_format'] == 'number') selected @endif>数字</option>
|
||||
<option value="money" @if($row['data_format'] == 'money') selected @endif>金额</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@verbatim
|
||||
<div id="app">
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="data_type">绑定数据</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" v-model="data_type" name="data_type" id="data_type" @change="changeDataType">
|
||||
<option value=""> - </option>
|
||||
<option v-for="item in dataType" :value="item.table">{{item.name}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-show="data_type">
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="data_field">映射字段</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" v-model="data_field" name="data_field" id="data_field">
|
||||
<option value=""> - </option>
|
||||
<option v-for="item in dataField" :value="item.key">{{item.name}}({{item.field}})</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="data_link">关联字段</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" v-model="data_link" name="data_link" id="data_link">
|
||||
<option value=""> - </option>
|
||||
<option v-for="item in dataLink" :value="item.field">{{item.name}}({{item.field}})</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="data_relation">关联关系</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" v-model="data_relation" name="data_relation" id="data_relation">
|
||||
<option value=""> - </option>
|
||||
<option v-for="item in dataRelation" :value="item.field">{{item.name}}({{item.field}})</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endverbatim
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="type">
|
||||
字段类型
|
||||
<a class="hinted" href="javascript:;" title="注意修改类型可能导致数据丢失，如果不建立字段请留空"><i class="fa fa-question-circle"></i></a>
|
||||
</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" name="type" onchange="setlength(this.value)" id="type">
|
||||
<option value="">-</option>
|
||||
@foreach($templates as $type => $template)
|
||||
<option value="{{$type}}" @if($row['type'] == $type) selected @endif>{{$type}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="length">
|
||||
字段长度
|
||||
<a class="hinted" href="javascript:;" title="注意长度值不能超界"><i class="fa fa-question-circle"></i></a>
|
||||
</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<input class="form-control input-sm" type="text" id="length" name="length" value="{{$row['length']}}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="length">不是NULL</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" name="not_null">
|
||||
<option value="0" @if($row['not_null'] == '0') selected @endif>否</option>
|
||||
<option value="1" @if($row['not_null'] == '1') selected @endif>是</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="length">字段默认值</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<div class="input-group input-group-sm">
|
||||
<div class="input-group-btn">
|
||||
<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
|
||||
选择 <span class="caret"></span>
|
||||
</button>
|
||||
<ul class="dropdown-menu" id="default-menu">
|
||||
<li><a href="javascript:;"> </a></li>
|
||||
<li><a href="javascript:;">NULL</a></li>
|
||||
<li><a href="javascript:;">Empty String</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<input type="text" id="default" class="form-control input-sm" name="default" value="{{$row['default']}}" @if($row['default'] == 'NULL' || $row['default'] == 'Empty String') readonly="readonly" @endif />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="index">
|
||||
字段索引
|
||||
<a class="hinted" href="javascript:;" title="注意必须理解索引的概念"><i class="fa fa-question-circle"></i></a>
|
||||
</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<select class="form-control input-sm" name="index">
|
||||
<option value=""> - </option>
|
||||
<option value="INDEX" @if($row['index'] == 'INDEX') selected @endif>普通</option>
|
||||
<option value="UNIQUE" @if($row['index'] == 'UNIQUE') selected @endif>唯一</option>
|
||||
<option value="PRIMARY" @if($row['index'] == 'PRIMARY') selected @endif>主键</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="tips">
|
||||
编辑提示
|
||||
<a class="hinted" href="javascript:;" title="显示在字段别名下方作为表单输入提示"><i class="fa fa-question-circle"></i></a>
|
||||
</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<input class="form-control input-sm" type="text" name="tips" value="{{$row['tips']}}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="is_index">列表显示</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_index'] == '0') checked @endif value="0" name="is_index">否</label>
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_index'] == '1') checked @endif value="1" name="is_index">是</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="is_search">列表搜索</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_search'] == '0') checked @endif value="0" name="is_search">否</label>
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_search'] == '1') checked @endif value="1" name="is_search">是</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="is_sort">字段菜单</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_menu'] == '0') checked @endif value="0" name="is_menu">否</label>
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_menu'] == '1') checked @endif value="1" name="is_menu">是</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="is_sort">列表排序</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_sort'] == '0') checked @endif value="0" name="is_sort">否</label>
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_sort'] == '1') checked @endif value="1" name="is_sort">是</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label" for="is_import">允许导入</label>
|
||||
<div class="col-sm-9 control-text">
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_import'] == '0') checked @endif value="0" name="is_import">否</label>
|
||||
<label class="radio-inline"><input type="radio" @if($row['is_import'] == '1') checked @endif value="1" name="is_import">是</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input name="id" type="hidden" value="{{$row['id']}}">
|
||||
<input name="parent_id" type="hidden" value="{{$parent_id}}">
|
||||
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
var types = JSON.parse('<?php echo json_encode($types, JSON_UNESCAPED_UNICODE); ?>') || {};
|
||||
var fields = JSON.parse('<?php echo json_encode($fields, JSON_UNESCAPED_UNICODE); ?>') || {};
|
||||
|
||||
var model_id = '{{$row["model_id"]}}';
|
||||
var data_link = '{{$row["data_link"]}}';
|
||||
var data_type = '{{$row["data_type"]}}';
|
||||
var data_field = '{{$row["data_field"]}}';
|
||||
|
||||
const vueData = {
|
||||
data() {
|
||||
return {
|
||||
data_relation: '',
|
||||
dataLink: fields,
|
||||
dataField: [],
|
||||
dataRelation: [
|
||||
{field: 'one2one', name: '一对一'},
|
||||
{field: 'one2many', name: '一对多'},
|
||||
{field: 'many2many', name: '多对多'}
|
||||
],
|
||||
dataType: types,
|
||||
data_link: data_link,
|
||||
data_type: data_type,
|
||||
data_field: data_field,
|
||||
}
|
||||
},mounted() {
|
||||
this.changeDataType();
|
||||
$('#form_type').off('change').on('change', function() {
|
||||
var loading = layer.msg('数据提交中...', {
|
||||
icon: 16,
|
||||
shade: 0.1,
|
||||
time: 1000 * 30
|
||||
});
|
||||
$.get("{{url('type')}}?type=" + this.value + '&model_id=' + model_id, function(data) {
|
||||
$("#content").html(data);
|
||||
}).complete(function() {
|
||||
layer.close(loading);
|
||||
});
|
||||
});
|
||||
$('#default-menu').on('click', 'a', function() {
|
||||
let value = $(this).text();
|
||||
$('#default').val(value);
|
||||
defaultReadonly(value);
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
changeDataType: function() {
|
||||
var me = this;
|
||||
$.getJSON(url('model/field/getColumns'), {table: me.data_type}, function(res) {
|
||||
me.dataField = res.data;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
Vue.createApp(vueData).mount('#app');
|
||||
|
||||
function setlength(value) {
|
||||
var types = {{json_encode($templates)}};
|
||||
if (value) {
|
||||
var type = types[value];
|
||||
$('#length').val(types[value]['length']);
|
||||
$('#default').val(types[value]['default']);
|
||||
defaultReadonly(types[value]['default']);
|
||||
}
|
||||
}
|
||||
|
||||
function defaultReadonly(value) {
|
||||
if (value == 'NULL' || value == 'Empty String') {
|
||||
$('#default').prop('readonly', true);
|
||||
} else {
|
||||
$('#default').prop('readonly', false);
|
||||
}
|
||||
}
|
||||
|
||||
ajaxSubmit('flow-field');
|
||||
</script>
|
||||
@@ -0,0 +1,102 @@
|
||||
<div class="panel">
|
||||
|
||||
<div class="wrapper-sm">
|
||||
<a class="btn btn-info btn-sm" data-toggle="field-edit" data-model_id="{{$model_id}}" href="javascript:;"><i class="icon icon-plus"></i> 新建</a>
|
||||
</div>
|
||||
|
||||
<div class="wrapper-sm b-t">
|
||||
<form method="post" id="myform" name="myform">
|
||||
|
||||
<table class="table table-bordered m-b-none table-hover b-t" id="table-sortable" url="{{url()}}">
|
||||
<thead>
|
||||
<tr>
|
||||
<th align="left">字段别名</th>
|
||||
<th align="left">字段名</th>
|
||||
<th align="center">数据绑定</th>
|
||||
<th align="center">数据关联</th>
|
||||
<th align="center">字段类型</th>
|
||||
<th align="center">字段索引</th>
|
||||
<th align="center">表单类型</th>
|
||||
<th align="center">ID</th>
|
||||
<th align="center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach($master->fields as $row)
|
||||
<tr id="{{$row['id']}}">
|
||||
<td align="left" class="move">{{$row['name']}}</td>
|
||||
<td align="left">{{$row['field']}}</td>
|
||||
<td align="center">
|
||||
@if($row['data_type'])
|
||||
{{$sets[$row['data_type']]['name']}}({{$row['data_field']}})
|
||||
@endif
|
||||
</td>
|
||||
<td align="center">
|
||||
{{$row['data_link']}}
|
||||
</td>
|
||||
<td align="center">@if($row['type']) {{$row['type']}}({{$row['length']}}) @endif</td>
|
||||
<td align="center">{{$row['index']}}</td>
|
||||
<td align="center">{{$row['form_type']}}</td>
|
||||
<td align="center">{{$row['id']}}</td>
|
||||
<td align="center">
|
||||
<a class="option" data-toggle="field-edit" data-id="{{$row['id']}}" data-parent_id="{{$model_id}}" data-model_id="{{$row['model_id']}}" href="javascript:;">编辑</a>
|
||||
@if($row['system'] == 0)
|
||||
<a class="option" href="javascript:app.confirm('{{url('delete',['id'=>$row['id'],'model_id'=>$model_id])}}','确定要删除吗？');">删除</a>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
|
||||
@foreach($sublist as $rows)
|
||||
@foreach($rows->fields as $row)
|
||||
<tr id="{{$row['id']}}">
|
||||
<td align="left" class="move"><span class="label label-primary">{{$rows->name}}</span> {{$row['name']}}</td>
|
||||
<td align="left">{{$row['field']}}</td>
|
||||
<td align="center">
|
||||
@if($row['data_type'])
|
||||
{{$sets[$row['data_type']]['name']}}({{$row['data_field']}})
|
||||
@endif
|
||||
</td>
|
||||
<td align="center">{{$row['data_link']}}</td>
|
||||
<td align="center">@if($row['type']) {{$row['type']}}({{$row['length']}}) @endif</td>
|
||||
<td align="center">{{$row['index']}}</td>
|
||||
<td align="center">{{$row['form_type']}}</td>
|
||||
<td align="center">{{$row['id']}}</td>
|
||||
<td align="center">
|
||||
<a class="option" data-toggle="field-edit" data-id="{{$row['id']}}" data-parent_id="{{$model_id}}" data-model_id="{{$row['model_id']}}">编辑</a>
|
||||
@if($row['system'] == 0)
|
||||
<a class="option" href="javascript:app.confirm('{{url('delete',['model_id'=>$model_id,'id'=>$row['id']])}}','确定要删除吗？');">删除</a>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function() {
|
||||
$('[data-toggle="field-edit"]').on('click', function() {
|
||||
var data = $(this).data();
|
||||
formDialog({
|
||||
title: '字段管理',
|
||||
url: app.url('model/field/create', data),
|
||||
storeUrl: app.url('model/field/create'),
|
||||
id: 'flow-field',
|
||||
dialogClass:'modal-md',
|
||||
success: function(res) {
|
||||
toastrSuccess(res.data);
|
||||
$(this).dialog("close");
|
||||
location.reload();
|
||||
},
|
||||
error: function(res) {
|
||||
toastrError(res.data);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,71 @@
|
||||
<form method="post" id="model" name="model">
|
||||
<table class="table table-form m-b-none">
|
||||
<tr>
|
||||
<td align="right" width="10%">模型名称</th>
|
||||
<td><input type="text" id="name" name="name" value="{{$model->name}}" onblur="app.pinyin('name','table');" class="form-control input-sm"></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">父节模型</td>
|
||||
<td>
|
||||
<select class="form-control input-sm" name="parent_id" id="parent_id">
|
||||
<option value="0"> - </option>
|
||||
@foreach($models as $_model)
|
||||
<option value="{{$_model->id}}" @if($_model->id == $model->parent_id) selected @endif>{{$_model->name}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">模型类型</td>
|
||||
<td>
|
||||
<select class="form-control input-sm" name="type" id="type">
|
||||
<option value="0" @if($model->type == 0) selected @endif> - </option>
|
||||
<option value="1" @if($model->type == 1) selected @endif>多行子表</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">关联外键</td>
|
||||
<td><input type="text" id="relation" name="relation" value="{{$model->relation}}" class="form-control input-sm"></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">数据表名</td>
|
||||
<td><input type="text" id="table" name="table" value="{{$model->table}}" class="form-control input-sm" @if($row->id > 0) readonly @endif></td>
|
||||
</tr>
|
||||
|
||||
<!--
|
||||
<tr>
|
||||
<td align="right">审核类型</td>
|
||||
<td>
|
||||
<label class="radio-inline"><input type="radio" @if($model['audit_type'] == 0) checked @endif value="0" name="audit_type"> 无 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($model['audit_type'] == 1) checked @endif value="1" name="audit_type"> 固定流程 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($model['audit_type'] == 2) checked @endif value="2" name="audit_type"> 自由流程 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($model['audit_type'] == 3) checked @endif value="3" name="audit_type"> 审核 </label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">支持回收站</td>
|
||||
<td>
|
||||
<label class="radio-inline"><input type="radio" @if($model['is_trash'] == 0) checked @endif value="0" name="is_trash"> 否 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($model['is_trash'] == 1) checked @endif value="1" name="is_trash"> 是 </label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">数据排序</td>
|
||||
<td>
|
||||
<label class="radio-inline"><input type="radio" @if($model['is_sort'] == 0) checked @endif value="1" name="is_sort"> 否 </label>
|
||||
<label class="radio-inline"><input type="radio" @if($model['is_sort'] == 1) checked @endif value="0" name="is_sort"> 是 </label>
|
||||
</td>
|
||||
</tr>
|
||||
-->
|
||||
|
||||
</table>
|
||||
<input type="hidden" name="id" value="{{$model->id}}">
|
||||
|
||||
</form>
|
||||
@@ -0,0 +1,92 @@
|
||||
{{$header["js"]}}
|
||||
|
||||
<div class="panel no-border" id="{{$header['master_table']}}-controller">
|
||||
@include('headers')
|
||||
<div class='list-jqgrid'>
|
||||
<div id="{{$header['master_table']}}-grid" style="width:100%;" class="ag-theme-balham"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
(function ($) {
|
||||
var table = '{{$header["master_table"]}}';
|
||||
var config = gdoo.grids[table];
|
||||
var action = config.action;
|
||||
var search = config.search;
|
||||
|
||||
action.dialogType = 'dialog';
|
||||
|
||||
// 自定义搜索方法
|
||||
search.searchInit = function (e) {
|
||||
var self = this;
|
||||
}
|
||||
|
||||
action.field = function(data) {
|
||||
var me = this;
|
||||
var grid = config.grid;
|
||||
var url = app.url('model/field/index', {model_id: data.master_id});
|
||||
var index = layer.open({
|
||||
skin: 'layui-layer-frame',
|
||||
scrollbar: false,
|
||||
closeBtn: 2,
|
||||
title: data.master_name + '[字段]',
|
||||
type: 2,
|
||||
move: false,
|
||||
area: ['100%', '100%'],
|
||||
content: url,
|
||||
});
|
||||
}
|
||||
|
||||
var options = new agGridOptions();
|
||||
var gridDiv = document.querySelector("#{{$header['master_table']}}-grid");
|
||||
gridDiv.style.height = getPanelHeight(48);
|
||||
|
||||
config.cols[0]['hide'] = true;
|
||||
config.cols[1]['hide'] = true;
|
||||
config.cols[2]['hide'] = true;
|
||||
options.autoGroupColumnDef = {
|
||||
headerName: '名称',
|
||||
width: 120,
|
||||
cellRendererParams: {
|
||||
checkbox: true,
|
||||
suppressCount: true,
|
||||
}
|
||||
};
|
||||
options.treeData = true;
|
||||
options.groupDefaultExpanded = -1;
|
||||
options.getDataPath = function(data) {
|
||||
return data.tree_path;
|
||||
};
|
||||
|
||||
options.remoteDataUrl = '{{url()}}';
|
||||
options.remoteParams = search.advanced.query;
|
||||
options.columnDefs = config.cols;
|
||||
options.onRowDoubleClicked = function (params) {
|
||||
if (params.node.rowPinned) {
|
||||
return;
|
||||
}
|
||||
if (params.data == undefined) {
|
||||
return;
|
||||
}
|
||||
if (params.data.master_id > 0) {
|
||||
action.edit(params.data);
|
||||
}
|
||||
};
|
||||
|
||||
new agGrid.Grid(gridDiv, options);
|
||||
|
||||
// 读取数据
|
||||
options.remoteData({page: 1});
|
||||
|
||||
// 绑定自定义事件
|
||||
var $gridDiv = $(gridDiv);
|
||||
$gridDiv.on('click', '[data-toggle="event"]', function () {
|
||||
var data = $(this).data();
|
||||
if (data.master_id > 0) {
|
||||
action[data.action](data);
|
||||
}
|
||||
});
|
||||
config.grid = options;
|
||||
})(jQuery);
|
||||
|
||||
</script>
|
||||
@include('footers')
|
||||
@@ -0,0 +1,60 @@
|
||||
<form method="post" class="form-horizontal" action="{{url('store')}}" id="mail" name="mail">
|
||||
|
||||
<table class="table table-form m-b-none">
|
||||
<tr>
|
||||
<td align="right" width="10%">名称</td>
|
||||
<td align="left">
|
||||
<input class="form-control input-sm" type="text" name="name" value="{{$row['name']}}">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">邮箱帐号</td>
|
||||
<td align="left">
|
||||
<input class="form-control input-sm" type="text" name="user" value="{{$row['user']}}">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">邮箱密码</td>
|
||||
<td align="left">
|
||||
<input class="form-control input-sm" type="text" name="password" value="{{$row['password']}}">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">SMTP服务器</td>
|
||||
<td align="left">
|
||||
<input class="form-control input-sm" type="text" name="smtp" value="{{$row['smtp']}}">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">服务器端口</td>
|
||||
<td align="left">
|
||||
<input class="form-control input-sm" type="text" name="port" value="{{$row['port']}}">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">连接方式</td>
|
||||
<td align="left">
|
||||
<select class="form-control input-sm" name="secure" id="secure">
|
||||
<option value="" @if($row['secure'] == '') selected @endif>默认</option>
|
||||
<option value="ssl" @if($row['secure'] == 'ssl') selected @endif>ssl</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">状态</td>
|
||||
<td align="left">
|
||||
<select class="form-control input-sm" name="status" id="status">
|
||||
<option value="1" @if($row['status'] == '1') selected @endif>启用</option>
|
||||
<option value="0" @if($row['status'] == '0') selected @endif>停用</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">排序</td>
|
||||
<td align="left">
|
||||
<input class="form-control input-sm" type="text" name="sort" value="{{$row['sort']}}">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<input type="hidden" name="id" value="{{$row['id']}}">
|
||||
</form>
|
||||
@@ -0,0 +1,100 @@
|
||||
{{$header["js"]}}
|
||||
|
||||
<div class="panel no-border" id="{{$header['master_table']}}-controller">
|
||||
@include('headers')
|
||||
<div class='list-jqgrid'>
|
||||
<div id="{{$header['master_table']}}-grid" style="width:100%;" class="ag-theme-balham"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
(function ($) {
|
||||
var table = '{{$header["master_table"]}}';
|
||||
var config = gdoo.grids[table];
|
||||
var action = config.action;
|
||||
var search = config.search;
|
||||
|
||||
action.dialogType = 'dialog';
|
||||
|
||||
action.refresh = function() {
|
||||
var me = this;
|
||||
var loading = layer.msg('模块更新中...', {
|
||||
icon: 16, shade: 0.1, time: 1000 * 120
|
||||
});
|
||||
$.post(app.url('model/module/refresh'), function(res) {
|
||||
if (res.status) {
|
||||
options.remoteData({page: 1});
|
||||
toastrSuccess(res.data);
|
||||
} else {
|
||||
toastrError(res.data);
|
||||
}
|
||||
},'json').complete(function() {
|
||||
layer.close(loading);
|
||||
});
|
||||
}
|
||||
|
||||
action.test = function() {
|
||||
var me = this;
|
||||
var grid = config.grid;
|
||||
var rows = grid.api.getSelectedRows();
|
||||
if (rows.length == 1) {
|
||||
formDialog({
|
||||
title: '测试邮件',
|
||||
url: app.url('system/mail/test', {id: rows[0].id}),
|
||||
storeUrl: app.url('system/mail/test'),
|
||||
id: 'mail_test',
|
||||
dialogClass:'modal-sm',
|
||||
success: function(res) {
|
||||
toastrSuccess(res.data);
|
||||
$(this).dialog("close");
|
||||
},
|
||||
error: function(res) {
|
||||
toastrError(res.data);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
toastrError('只能选择一条数据。');
|
||||
}
|
||||
}
|
||||
|
||||
// 自定义搜索方法
|
||||
search.searchInit = function (e) {
|
||||
var self = this;
|
||||
}
|
||||
|
||||
var options = new agGridOptions();
|
||||
var gridDiv = document.querySelector("#{{$header['master_table']}}-grid");
|
||||
gridDiv.style.height = getPanelHeight(48);
|
||||
|
||||
options.remoteDataUrl = '{{url()}}';
|
||||
options.remoteParams = search.advanced.query;
|
||||
options.columnDefs = config.cols;
|
||||
options.onRowDoubleClicked = function (params) {
|
||||
if (params.node.rowPinned) {
|
||||
return;
|
||||
}
|
||||
if (params.data == undefined) {
|
||||
return;
|
||||
}
|
||||
if (params.data.master_id > 0) {
|
||||
action.show(params.data);
|
||||
}
|
||||
};
|
||||
|
||||
new agGrid.Grid(gridDiv, options);
|
||||
|
||||
// 读取数据
|
||||
options.remoteData({page: 1});
|
||||
|
||||
// 绑定自定义事件
|
||||
var $gridDiv = $(gridDiv);
|
||||
$gridDiv.on('click', '[data-toggle="event"]', function () {
|
||||
var data = $(this).data();
|
||||
if (data.master_id > 0) {
|
||||
action[data.action](data);
|
||||
}
|
||||
});
|
||||
config.grid = options;
|
||||
})(jQuery);
|
||||
|
||||
</script>
|
||||
@include('footers')
|
||||
@@ -0,0 +1,147 @@
|
||||
<div class="panel">
|
||||
|
||||
<form method="post" action="{{url()}}" id="myform" name="myform">
|
||||
|
||||
<div class="wrapper-sm b-b">
|
||||
<a class="btn btn-default btn-sm" href="{{url('index',['bill_id'=>$bill_id])}}"><i class="fa fa-reply"></i> 返回</a>
|
||||
<button type="submit" class="btn btn-sm btn-success"><i class="fa fa-check"></i> 提交</button>
|
||||
</div>
|
||||
|
||||
<table class="table table-form m-b-none">
|
||||
<tr>
|
||||
<td align="right" width="10%">权限名称<span class="red">*</span></td>
|
||||
<td width="20%">
|
||||
<input type="text" id="name" name="name" value="{{$permission['name']}}" class="form-control input-sm input-inline">
|
||||
</td>
|
||||
<td align="right" width="10%">权限类型 <span class="red">*</span></td>
|
||||
<td width="20%">
|
||||
<select multiple="multiple" class="input-select2 form-control input-sm input-inline" name="type[]">
|
||||
<option value="create" @if(in_array('create', $permission['type'])) selected @endif>新增</option>
|
||||
<option value="edit" @if(in_array('edit', $permission['type'])) selected @endif>编辑</option>
|
||||
</select>
|
||||
</td>
|
||||
<td align="right" width="10%">权限范围 <span class="red">*</span></td>
|
||||
<td width="20%">
|
||||
{{App\Support\Dialog::search($permission, 'id=receive_id&name=receive_name&multi=1')}}
|
||||
</td>
|
||||
<td align="right"></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="panel">
|
||||
<table class="table table-bordered table-form">
|
||||
<tr>
|
||||
<td>名称</td>
|
||||
<td>字段</td>
|
||||
<td>字段可写</td>
|
||||
<td>字段保密</td>
|
||||
<td>验证规则</td>
|
||||
</tr>
|
||||
|
||||
@foreach($master['fields'] as $field)
|
||||
<tr>
|
||||
<td>
|
||||
{{$field->name}}
|
||||
</td>
|
||||
<td>
|
||||
{{$master->table}}.{{$field->field}}
|
||||
</td>
|
||||
<td>
|
||||
<input type="checkbox" @if($permission['data'][$master->table][$field->field]['w'] == 1) checked @endif class="field-edit" data-key="{{$master->table}}_{{$field->field}}" id="{{$master->table}}_{{$field->field}}_edit" name="data[{{$master->table}}][{{$field->field}}][w]" value="1">
|
||||
</td>
|
||||
<td>
|
||||
<input type="checkbox" @if($permission['data'][$master->table][$field->field]['s'] == 1) checked @endif class="field-secret" data-key="{{$master->table}}_{{$field->field}}" id="{{$master->table}}_{{$field->field}}_secret" name="data[{{$master->table}}][{{$field->field}}][s]" value="1">
|
||||
</td>
|
||||
<td>
|
||||
<select multiple data-placeholder="选择验证规则" class="form-control input-sm input-inline input-select2" style="width:200px;" name="data[{{$master->table}}][{{$field->field}}][v][]">
|
||||
<option value=""></option>
|
||||
@foreach($regulars as $key => $regular)
|
||||
<option @if(in_array($key, (array)$permission['data'][$master->table][$field->field]['v'])) selected @endif value="{{$key}}">{{$regular}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
@if($field['form_type'] == 'auto' || $field['form_type'] == 'sn' || $field['form_type'] == 'date')
|
||||
<label title="锁定将不允许修改字段的值">
|
||||
<input type="checkbox" value="1" @if($permission['data'][$master->table][$field->field]['m'] == 1) checked @endif name="data[{{$master->table}}][{{$field->field}}][m]"> 锁定
|
||||
</label>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
@endforeach
|
||||
|
||||
@foreach($sublist as $submodel)
|
||||
<tr>
|
||||
<td>
|
||||
<span class="label label-success">{{$submodel['name']}}</span> 权限
|
||||
</td>
|
||||
<td>
|
||||
{{$submodel->table}}@option
|
||||
</td>
|
||||
<td>
|
||||
</td>
|
||||
<td>
|
||||
</td>
|
||||
<td>
|
||||
<select multiple data-placeholder="选择验证规则" class="form-control input-sm input-inline input-select2" name="data[{{$submodel->table}}][{{$field->field}}][v][]">
|
||||
<option value=""></option>
|
||||
<option @if(in_array('required', (array)$permission['data'][$submodel->table]['@option']['v'])) selected @endif value="required">必填</option>
|
||||
</select>
|
||||
<label class="inline-checkbox"><input type="checkbox" @if($permission['data'][$submodel->table]['@option']['w'] == 1) checked @endif name="data[{{$submodel->table}}][@option][w]" value="1"> 增</label>
|
||||
|
||||
<label class="inline-checkbox"><input type="checkbox" @if($permission['data'][$submodel->table]['@option']['d'] == 1) checked @endif name="data[{{$submodel->table}}][@option][d]" value="1"> 删</label>
|
||||
</td>
|
||||
</tr>
|
||||
@foreach($submodel['fields'] as $field)
|
||||
<tr>
|
||||
<td>
|
||||
<span class="label label-primary">{{$submodel['name']}}</span>
|
||||
{{$field['name']}}
|
||||
</td>
|
||||
<td>
|
||||
{{$submodel->table}}.{{$field->field}}
|
||||
</td>
|
||||
<td>
|
||||
<input type="checkbox" @if($permission['data'][$submodel->table][$field->field]['w'] == 1) checked @endif class="field-edit" data-key="{{$submodel->table}}_{{$field->field}}" id="{{$submodel->table}}_{{$field->field}}_edit" name="data[{{$submodel->table}}][{{$field->field}}][w]" value="1">
|
||||
</td>
|
||||
<td>
|
||||
<input type="checkbox" @if($permission['data'][$submodel->table][$field->field]['s'] == 1) checked @endif class="field-secret" data-key="{{$submodel->table}}_{{$field->field}}" id="{{$submodel->table}}_{{$field->field}}_secret" name="data[{{$submodel->table}}][{{$field->field}}][s]" value="1">
|
||||
</td>
|
||||
<td>
|
||||
@if($field['form_type'] == 'auto' || $field['form_type'] == 'date')
|
||||
<label title="锁定将不允许修改宏控件的值">
|
||||
<input type="checkbox" value="1" @if($permission['data'][$submodel->table][$field->field]['m'] == 1) checked @endif name="data[{{$submodel->table}}][{{$field->field}}][m]"> 锁定
|
||||
</label>
|
||||
@else
|
||||
<select multiple data-placeholder="选择验证规则" class="form-control input-sm input-inline input-select2" name="data[{{$submodel->table}}][{{$field->field}}][v][]">
|
||||
<option value=""></option>
|
||||
@foreach($regulars as $key => $regular)
|
||||
<option @if(in_array($key, (array)$permission['data'][$submodel->table][$field->field]['v'])) selected @endif value="{{$key}}">{{$regular}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
@endif
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
@endforeach
|
||||
@endforeach
|
||||
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="panel">
|
||||
<table class="table table-form m-b-none">
|
||||
<tr>
|
||||
<td>
|
||||
<input type="hidden" name="id" value="{{$permission['id']}}">
|
||||
<input type="hidden" name="bill_id" value="{{$bill_id}}">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
@@ -0,0 +1,41 @@
|
||||
<div class="panel">
|
||||
|
||||
<div class="wrapper-sm">
|
||||
<a class="btn btn-info btn-sm" href="{{url('create',['bill_id'=>$bill_id])}}"><i class="icon icon-plus"></i> 新建</a>
|
||||
</div>
|
||||
|
||||
<div class="wrapper-sm b-t">
|
||||
<form method="post" action="{{url()}}" id="myform" name="myform">
|
||||
|
||||
<table class="table table-bordered table-hover m-b-none b-t" id="table-sortable" url="{{url()}}">
|
||||
<thead>
|
||||
<tr>
|
||||
<th align="left">权限名称</th>
|
||||
<th align="center">权限类型</th>
|
||||
<th align="center">权限范围</th>
|
||||
<th align="center">ID</th>
|
||||
<th align="center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@if($rows)
|
||||
@foreach($rows as $row)
|
||||
<tr id="{{$row['id']}}">
|
||||
<td align="left" class="move">{{$row['name']}}</td>
|
||||
<td align="center">{{$row['type']}}</td>
|
||||
<td align="center">{{$row['receive_name']}}</td>
|
||||
<td align="center">{{$row['id']}}</td>
|
||||
<td align="center">
|
||||
<a class="option" href="{{url('create',['bill_id'=>$row['bill_id'],'id'=>$row['id']])}}">编辑</a>
|
||||
@if($row['system'] == 0)
|
||||
<a class="option" onclick="app.confirm('{{url('delete',['id'=>$row['id']])}}','确定要删除吗？');" href="javascript:;">删除</a>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
@endif
|
||||
</tbody>
|
||||
</table>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,52 @@
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th align="center">序号</th>
|
||||
<th align="left">步骤</th>
|
||||
<th align="left">办理内容</th>
|
||||
<th align="center">办理人</th>
|
||||
<th align="center">办理类型</th>
|
||||
<th align="center">办理效率</th>
|
||||
<th align="center">办理时间</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@foreach($rows as $i => $row)
|
||||
<tr>
|
||||
<td align="center">
|
||||
{{$i + 1}}
|
||||
</td>
|
||||
<td align="left">
|
||||
{{$steps[$row['step_number']]['name']}}
|
||||
</td>
|
||||
<td align="left">
|
||||
{{$row[description]}}
|
||||
</td>
|
||||
<td align="center">
|
||||
{{$row[created_by]}}
|
||||
</td>
|
||||
<td align="center">
|
||||
@if($row[step_status] == 'back')
|
||||
退回
|
||||
@else
|
||||
审批
|
||||
@endif
|
||||
</td>
|
||||
<td align="center">
|
||||
<?php
|
||||
$start = $row['created_at'];
|
||||
if ($i) {
|
||||
$s = Carbon\Carbon::createFromTimeStamp($start);
|
||||
$e = Carbon\Carbon::createFromTimeStamp($end);
|
||||
echo $s->diffInHours($e).'小时';
|
||||
} else {
|
||||
echo '无';
|
||||
}
|
||||
$end = $start;
|
||||
?>
|
||||
</td>
|
||||
<td align="center">
|
||||
@datetime($row[created_at])
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</table>
|
||||
@@ -0,0 +1,72 @@
|
||||
<form class="form-horizontal" name="myturn" id="myturn" method="post">
|
||||
|
||||
<table class="table table-form">
|
||||
|
||||
<tr>
|
||||
<td align="right">办理类型</td>
|
||||
<td align="left">
|
||||
<label class="i-checks i-checks-sm"><input type="radio" class="process-step" name="step_status" value="next"><i></i>审批</label>
|
||||
@if($step->back == 1 && $step->number > 1)
|
||||
|
||||
|
||||
<label class="i-checks i-checks-sm"><input type="radio" class="process-step" name="step_status" value="back"><i></i>退回</label>
|
||||
@endif
|
||||
|
||||
|
||||
<label class="i-checks i-checks-sm"><input type="radio" class="process-step" name="step_status" value="reject"><i></i>拒绝</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right" width="20%">选择进程</td>
|
||||
<td align="left" width="80%">
|
||||
<div id="process-step"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">审批备注</td>
|
||||
<td align="left">
|
||||
<textarea class="form-control" rows="3" id="description" name="description"></textarea>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">提醒类型</td>
|
||||
<td align="left">
|
||||
<label class="i-checks i-checks-sm"><input type="checkbox" name="notify_sms" value="{{$notify['sms']}}" @if($notify['sms'])checked="checked" @endif><i></i>短信</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">提醒内容</td>
|
||||
<td align="left">
|
||||
<input type="text" class="form-control input-sm" name="notify_text" value="{{$notify['text']}}" readonly="readonly">
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
<input type="hidden" name="key" value="{{$key}}">
|
||||
</form>
|
||||
|
||||
<script type="text/javascript">
|
||||
$('.process-step').on('click', function() {
|
||||
if(this.value == 'reject') {
|
||||
$('#process-step').html('无');
|
||||
} else {
|
||||
var myform = $('#myform, #myturn').serialize();
|
||||
var query = $.param({type: this.value, model_id:'{{$step->model_id}}', step_sn:'{{$step->sn}}'});
|
||||
$.post('{{url("step")}}?' + query, myform, function(res) {
|
||||
$('#process-step').html(res);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function get_step_user()
|
||||
{
|
||||
var myform = $('#myform,#myturn').serialize();
|
||||
$.get('{{url("user")}}', myform, function(res) {
|
||||
$('#process-user').html(res.data);
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,145 @@
|
||||
<form method="post" action="<?php echo url(); ?>" id="conditionform" name="conditionform">
|
||||
|
||||
<?php
|
||||
if (sizeof($steps)):
|
||||
foreach ($steps as $step):
|
||||
?>
|
||||
<div class="panel">
|
||||
<table id="Condition<?php echo $step->id; ?>Ctrl" class="table table-form table-condensed table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="7" align="left">转入: <?php echo $step->name; ?></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="center">左括号</th>
|
||||
<th align="center">字段</th>
|
||||
<th align="center">条件</th>
|
||||
<th>值</th>
|
||||
<th>函数</th>
|
||||
<th align="center">右括号</th>
|
||||
<th align="center">逻辑</th>
|
||||
<th align="center">
|
||||
<a @click="create();" class="btn btn-xs btn-default"><i class="icon icon-plus"></i></a>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item,index) in items">
|
||||
<td>
|
||||
<select :name="'condition[<?php echo $step->id; ?>]['+index+'][l]'" v-model="item.l" class="input-sm form-control">
|
||||
<option value=""></option>
|
||||
<option value="(">(</option>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select :name="'condition[<?php echo $step->id; ?>]['+index+'][f]'" v-model="item.f" class="input-sm form-control">
|
||||
<option value=""></option>
|
||||
<?php
|
||||
foreach ($columns as $table => $column):
|
||||
foreach ($column['data'] as $field):
|
||||
?>
|
||||
<?php if ($field['auto'] == 1): ?>
|
||||
<option value="<?php echo $field['field']; ?>"><?php echo $field['name']; ?></option>
|
||||
<?php else: ?>
|
||||
<option value="<?php echo $table; ?>.<?php echo $field['field']; ?>">
|
||||
<?php if ($column['master'] == 0): ?>[<?php echo $column['name']; ?>]<?php endif; ?>
|
||||
<?php echo $field['name']; ?>
|
||||
</option>
|
||||
<?php endif; ?>
|
||||
<?php
|
||||
endforeach;
|
||||
endforeach;
|
||||
?>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select :name="'condition[<?php echo $step->id; ?>]['+index+'][c]'" v-model="item.c" class="input-sm form-control">
|
||||
<option value=""></option>
|
||||
<option value="==">等于</option>
|
||||
<option value="<>">不等于</option>
|
||||
<option value=">">大于</option>
|
||||
<option value="<">小于</option>
|
||||
<option value=">=">大于等于</option>
|
||||
<option value="<=">小于等于</option>
|
||||
<!--
|
||||
<option value="like">包含</option>
|
||||
<option value="not like">不包含</option>
|
||||
-->
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<input :name="'condition[<?php echo $step->id; ?>]['+index+'][v]'" v-model="item.v" class="input-sm form-control">
|
||||
</td>
|
||||
<td>
|
||||
<select :name="'condition[<?php echo $step->id; ?>]['+index+'][t]'" v-model="item.t" class="input-sm form-control">
|
||||
<option value=""></option>
|
||||
<option value="sum">SUM(合计)</option>
|
||||
<option value="count">COUNT(行数)</option>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select :name="'condition[<?php echo $step->id; ?>]['+index+'][r]'" v-model="item.r" class="input-sm form-control">
|
||||
<option value=""></option>
|
||||
<option value=")">)</option>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select :name="'condition[<?php echo $step->id; ?>]['+index+'][i]'" v-model="item.i" class="input-sm form-control">
|
||||
<option value=""></option>
|
||||
<option value="and">and</option>
|
||||
<option value="or">or</option>
|
||||
</select>
|
||||
</td>
|
||||
<td align="center">
|
||||
<a @click="remove(index);" data-condition="delete" class="btn btn-xs btn-default"><i class="icon icon-trash"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php
|
||||
endforeach;
|
||||
endif;
|
||||
?>
|
||||
|
||||
<script type="text/javascript">
|
||||
<?php foreach ($steps as $step): ?>
|
||||
var conditionCtrl = {
|
||||
data() {
|
||||
return {
|
||||
items: <?php echo json_encode((array)$condition[$step->id]); ?>
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
create: function() {
|
||||
var item = {};
|
||||
this.items.push(item);
|
||||
},
|
||||
remove: function(index) {
|
||||
this.items.splice(index, 1);
|
||||
}
|
||||
}
|
||||
};
|
||||
Vue.createApp(conditionCtrl).mount('#Condition<?php echo $step->id; ?>Ctrl');
|
||||
|
||||
<?php endforeach; ?>
|
||||
$('#myform').submit(function () {
|
||||
var url = $(this).attr('action');
|
||||
var data = $(this).serialize();
|
||||
$.post(url, data, function (res) {
|
||||
if (res.status) {
|
||||
toastrSuccess(res.data);
|
||||
} else {
|
||||
toastrError(res.data);
|
||||
}
|
||||
}, 'json');
|
||||
return false;
|
||||
});
|
||||
</script>
|
||||
|
||||
<input type="hidden" name="id" value="<?php echo $row->id; ?>">
|
||||
<input type="hidden" name="model_id" value="<?php echo $model->id; ?>">
|
||||
|
||||
</form>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,173 @@
|
||||
<form method="post" action="{{url()}}" id="mystep" name="mystep">
|
||||
|
||||
<div class="panel">
|
||||
<table class="table table-form">
|
||||
<tr>
|
||||
<td align="right" width="10%">节点名称<span class="red">*</span></td>
|
||||
<td>
|
||||
<input type="text" id="name" name="name" value="{{$row->name}}" class="form-control input-sm">
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
@if($row->type != 'start')
|
||||
<tr>
|
||||
<td align="right">执行目标</td>
|
||||
<td>
|
||||
<select class="form-control input-sm" name="type" id="type">
|
||||
<!--
|
||||
<option value="start" @if($row->type == 'start') selected @endif>开始</option>
|
||||
-->
|
||||
<option value=""> - </option>
|
||||
<option value="leader" @if($row->type == 'leader') selected @endif>直属领导</option>
|
||||
<option value="manager" @if($row->type == 'manager') selected @endif>部门主管</option>
|
||||
|
||||
<option value="team1" @if($row->type == 'team1') selected @endif>销售组1级</option>
|
||||
<option value="team2" @if($row->type == 'team2') selected @endif>销售组2级</option>
|
||||
<option value="team3" @if($row->type == 'team3') selected @endif>销售组3级</option>
|
||||
<option value="team4" @if($row->type == 'team4') selected @endif>销售组4级</option>
|
||||
<option value="team5" @if($row->type == 'team5') selected @endif>销售组5级</option>
|
||||
<option value="team6" @if($row->type == 'team6') selected @endif>销售组6级</option>
|
||||
<option value="team7" @if($row->type == 'team7') selected @endif>销售组7级</option>
|
||||
<option value="team8" @if($row->type == 'team8') selected @endif>销售组8级</option>
|
||||
<option value="team9" @if($row->type == 'team9') selected @endif>销售组9级</option>
|
||||
<option value="team10" @if($row->type == 'team10') selected @endif>销售组10级</option>
|
||||
|
||||
<option value="user" @if($row->type == 'user') selected @endif>指定办理人</option>
|
||||
<option value="role" @if($row->type == 'role') selected @endif>指定角色</option>
|
||||
<option value="created_id" @if($row->type == 'created_id') selected @endif>单据创建人ID</option>
|
||||
<option value="field" @if($row->type == 'field') selected @endif>指定字段</option>
|
||||
<option value="position" @if($row->type == 'position') selected @endif>职位</option>
|
||||
<option value="custom" @if($row->type == 'custom') selected @endif>自定义</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">执行规则</td>
|
||||
<td>
|
||||
<?php $type_value = ($row->type == 'field' ? '' : $row->type_value); ?>
|
||||
<span id="type_user" class="type" style="display:none;">
|
||||
{{App\Support\Dialog::user('user','type_value[user]', $type_value, 1, 0)}}
|
||||
</span>
|
||||
|
||||
<span id="type_role" class="type" style="display:none;">
|
||||
{{App\Support\Dialog::user('role','type_value[role]', $type_value, 1, 0)}}
|
||||
</span>
|
||||
|
||||
<span id="type_field" class="type" style="display:none;">
|
||||
<select class="form-control input-sm" name="type_value[field]">
|
||||
@if($columns[$model->table]['fields'])
|
||||
@foreach($columns[$model->table]['fields'] as $column)
|
||||
<option value="{{$column->field}}" @if($row->type_value == $column->field) selected @endif>{{$column->name}}</option>
|
||||
@endforeach
|
||||
@endif
|
||||
</select>
|
||||
</span>
|
||||
|
||||
<label class="checkbox-inline m-t-xs">
|
||||
<input name="select_org" type="checkbox" value="1" @if($row->select_org == 1) checked @endif>允许选择组织中人员
|
||||
</label>
|
||||
|
||||
<div class="m-t-xs">
|
||||
匹配不到人:
|
||||
<select class="form-control input-sm input-inline" name="nouser" id="nouser">
|
||||
<option value="0" @if($row->nouser == 0) selected @endif>由上节点选择执行人</option>
|
||||
<option value="1" @if($row->nouser == 1) selected @endif>自动跳过</option>
|
||||
<option value="2" @if($row->nouser == 2) selected @endif>转给指定人</option>
|
||||
</select>
|
||||
<span class="nouser" id="nouser_2" style="display:none;">
|
||||
<span class="form-inline">
|
||||
{{App\Support\Dialog::user('user','nouser_user_id', $row->nouser_user_id, 0, 0)}}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
@endif
|
||||
|
||||
<tr>
|
||||
<td align="right">执行模式</td>
|
||||
<td>
|
||||
<select class="form-control input-sm" name="run_mode" id="run_mode">
|
||||
<option value="1" @if($row->run_mode == 1) selected @endif>单人执行</option>
|
||||
<option value="2" @if($row->run_mode == 2) selected @endif>多人执行</option>
|
||||
<option value="3" @if($row->run_mode == 3) selected @endif>全体执行</option>
|
||||
<option value="4" @if($row->run_mode == 4) selected @endif>竞争执行</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">节点类型</td>
|
||||
<td>
|
||||
<select class="form-control input-sm" name="option" id="option">
|
||||
<option value="1" @if($row->option == 1) selected @endif>审核</option>
|
||||
<option value="0" @if($row->option == 0) selected @endif>知会</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">表单权限</td>
|
||||
<td>
|
||||
<select class="form-control input-sm" name="permission_id" id="permission_id">
|
||||
<option value=""> - </option>
|
||||
@foreach($permissions as $permission)
|
||||
<option value="{{$permission['id']}}" @if($row->permission_id == $permission['id']) selected @endif>{{$permission['name']}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="right">节点提醒</td>
|
||||
<td>
|
||||
<label class="checkbox-inline">
|
||||
<input name="notify[sms]" type="checkbox" id="notify-sms" value="1" @if($row->notify['sms'] == 1) checked @endif>短信
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
@if($row->type != 'start')
|
||||
<tr>
|
||||
<td align="right">节点退回</td>
|
||||
<td>
|
||||
<select class="form-control input-sm" name="back" id="back">
|
||||
<option value="0" @if($row->back == '0') selected @endif>无</option>
|
||||
<option value="1" @if($row->back == '1') selected @endif>上一步</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
@endif
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<input type="hidden" name="id" value="{{$row->id}}">
|
||||
<input type="hidden" name="bill_id" value="{{$bill->id}}">
|
||||
|
||||
</form>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
userType('{{$row->type}}');
|
||||
nouserType('{{$row->nouser}}');
|
||||
$('#type').on('change', function() {
|
||||
userType(this.value);
|
||||
});
|
||||
$('#nouser').on('change', function() {
|
||||
nouserType(this.value);
|
||||
});
|
||||
});
|
||||
|
||||
function nouserType(value) {
|
||||
value = value || '';
|
||||
$('.nouser').hide();
|
||||
$('#nouser_' + value).show();
|
||||
}
|
||||
|
||||
function userType(type) {
|
||||
type = type || '';
|
||||
$('.type').hide().prop('disabled', true);
|
||||
$('#type_' + type).show().prop('disabled', false);
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,49 @@
|
||||
<div class="panel">
|
||||
|
||||
@include('query')
|
||||
|
||||
<table class="table table-hover b-t" id="table-sortable" url="{{url()}}">
|
||||
<tr>
|
||||
<th align="left">节点名称</th>
|
||||
<th align="left">转入节点</th>
|
||||
<th align="center">执行目标</th>
|
||||
<th align="center">节点类型</th>
|
||||
<th align="center">节点颜色</th>
|
||||
<th align="center">ID</th>
|
||||
<th align="center"></th>
|
||||
</tr>
|
||||
@foreach($rows as $row)
|
||||
<tr id="{{$row->id}}">
|
||||
<td align="left" @if($row->type != "end" && $row->type != "start") class="move" @endif>
|
||||
@if($row->sn > 1)
|
||||
<span class="badge badge-bg">{{$row->sn}}</span>
|
||||
@endif
|
||||
{{$row->name}}
|
||||
</td>
|
||||
<td align="left">
|
||||
<?php $joins = explode(',', $row->join); ?>
|
||||
@foreach($joins as $id)
|
||||
{{$rows[$id]['name']}}
|
||||
@endforeach
|
||||
</td>
|
||||
<td align="center">{{$row->type}}</td>
|
||||
|
||||
<td align="center">@if($row->option == 1) 审核 @else 知会 @endif</td>
|
||||
|
||||
<td align="center"><span class="label label-{{$row->color}}">{{$row->color}}</span></td>
|
||||
<td align="center">{{$row->id}}</td>
|
||||
<td align="center">
|
||||
@if($row->type != 'end')
|
||||
<?php $condition = json_decode($row->condition, true); ?>
|
||||
<a class="option" href="{{url('condition',['model_id'=>$model->id,'id'=>$row->id])}}">条件({{count($condition)}})</a>
|
||||
<a class="option" href="{{url('create',['model_id'=>$model->id,'id'=>$row->id])}}">编辑</a>
|
||||
@endif
|
||||
@if($row->sn > 1)
|
||||
<a class="option" onclick="app.confirm('{{url('delete',['id'=>$row->id])}}','确定要删除吗？');" href="javascript:;">删除</a>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</table>
|
||||
</form>
|
||||
</div>
|
||||
@@ -0,0 +1,454 @@
|
||||
<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-end)";
|
||||
// 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(e) {
|
||||
nowStepId = $(e.target).attr('step_id');
|
||||
clearTimeout(intervalTimer);
|
||||
workStep.dblClick('base');
|
||||
});
|
||||
});
|
||||
|
||||
var workStep = {
|
||||
|
||||
init:function() {
|
||||
|
||||
jsPlumb.reset();
|
||||
|
||||
jsPlumb.bind("beforeDrop", beforeDropHandler);
|
||||
|
||||
$.post("{{url('index2')}}",{model_id:'{{$model_id}}'},function(res)
|
||||
{
|
||||
$('#rows').empty();
|
||||
var nLastStepId = 0;
|
||||
|
||||
if(res.status == true) {
|
||||
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 = 20;
|
||||
var top = 20;
|
||||
|
||||
var rows = res.data;
|
||||
var setd = {};
|
||||
|
||||
$.each(rows, function(id, row) {
|
||||
var title = '<span class="ep">' + (row.option == 1 ? '审核' : '知会') + '</span> ' + row.name;
|
||||
if (row.type == 'start') {
|
||||
title = '<span class="ep"><i class="icon icon-play"></i></span> ' + row.name;
|
||||
} else if(row.type == 'end') {
|
||||
title = '<span class="ep"><i class="icon icon-stop"></i></span> ' + row.name;
|
||||
}
|
||||
|
||||
var css = 'wf-step';
|
||||
if (row.type == 'start') {
|
||||
css = 'wf-step wf-step-start';
|
||||
} else if(row.type == 'end') {
|
||||
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":row.left+'px',"top":row.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("show")}}',{id:nowStepId, model_id:'{{$model_id}}'}, function(res) {
|
||||
$('#tree').html(res.data).show();
|
||||
})
|
||||
}
|
||||
},
|
||||
// 删除步骤
|
||||
deleted:function() {
|
||||
$.messager.confirm('操作警告','确认要删除该步骤吗?',function(btn) {
|
||||
if (btn) {
|
||||
$.post('{{url("delete")}}',{id:nowStepId, model_id:'{{$model_id}}'}, function(res) {
|
||||
if (res.status) {
|
||||
workStep.init();
|
||||
toastrSuccess('操作成功');
|
||||
}
|
||||
},'json');
|
||||
}
|
||||
|
||||
});
|
||||
},
|
||||
// 克隆步骤
|
||||
clone:function() {
|
||||
$.messager.confirm('操作警告','确认要克隆该步骤吗?',function(btn) {
|
||||
if (btn) {
|
||||
$.post('{{url("add")}}',{id:nowStepId,model_id:'{{$model_id}}'},function(data) {
|
||||
if(data.status) {
|
||||
workStep.init();
|
||||
toastrSuccess('操作成功');
|
||||
}
|
||||
},'json');
|
||||
}
|
||||
});
|
||||
},
|
||||
dblClick:function(tab) {
|
||||
if (nowStepId > 0) {
|
||||
if(tab == 'base') {
|
||||
$.dialog({
|
||||
title:'基本设置',
|
||||
url:'{{url("create")}}?model_id={{$model_id}}&id='+nowStepId+'&tab='+tab,
|
||||
dialogClass: 'modal-lg',
|
||||
buttons:[{
|
||||
class: 'btn-info',
|
||||
text:'<i class="fa fa-check-circle"></i> 提交',
|
||||
click: function() {
|
||||
var formData = $('#mystep').serialize();
|
||||
$.post('{{url("create")}}', formData, function(res) {
|
||||
if (res.status) {
|
||||
workStep.init();
|
||||
toastrSuccess('保存当前视图成功');
|
||||
}
|
||||
},'json');
|
||||
$(this).dialog("close");
|
||||
}
|
||||
},{
|
||||
text:'<i class="fa fa-times"></i> 取消',
|
||||
click: function() {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}]
|
||||
});
|
||||
}
|
||||
if (tab == 'condition') {
|
||||
$.dialog({
|
||||
title:'条件设置',
|
||||
url:'{{url("condition")}}?model_id={{$model_id}}&id='+nowStepId+'&tab='+tab,
|
||||
dialogClass: 'modal-lg',
|
||||
buttons:[{
|
||||
class: 'btn-info',
|
||||
text:'<i class="fa fa-check-circle"></i> 提交',
|
||||
click: function() {
|
||||
var formData = $('#conditionform').serialize();
|
||||
$.post('{{url("condition")}}', formData, function(res) {
|
||||
if (res.status) {
|
||||
workStep.init();
|
||||
toastrSuccess('保存当前视图成功');
|
||||
}
|
||||
},'json');
|
||||
$(this).dialog("close");
|
||||
}
|
||||
},{
|
||||
text:'<i class="fa fa-times"></i> 取消',
|
||||
click: function() {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}]
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
add:function() {
|
||||
$.post('{{url("add")}}',{model_id:'{{$model_id}}'},function(res) {
|
||||
if (res.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,model_id:'{{$model_id}}'},function(result) {
|
||||
if(result.status) {
|
||||
toastrSuccess('保存当前视图成功');
|
||||
}
|
||||
},'json');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.content-body {
|
||||
margin: 0;
|
||||
}
|
||||
.col-sm-10 {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
.col-sm-2 {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="panel">
|
||||
|
||||
<div class="panel-header">
|
||||
<a class="btn btn-sm btn-info" onclick="workStep.add();" href="javascript:;">新建步骤</a>
|
||||
<a class="btn btn-sm btn-default" onclick="workStep.init();" href="javascript:;">重新加载</a>
|
||||
<a href="javascript:;" onclick="workStep.clear();" class="btn btn-sm btn-default"><i class="fa fa-ban"></i> 清空连接</a>
|
||||
</div>
|
||||
|
||||
<div class="panel-body">
|
||||
<div class="m-t-sm">
|
||||
<div class="col-sm-10 m-b">
|
||||
<div class="graph" id="graph" data-toggle="context" data-target="#graph-menu">
|
||||
<div id="rows"></div>
|
||||
</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 class="clearfix"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,441 @@
|
||||
<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-end)";
|
||||
// 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(e) {
|
||||
nowStepId = $(e.target).attr('step_id');
|
||||
clearTimeout(intervalTimer);
|
||||
workStep.dblClick('base');
|
||||
});
|
||||
});
|
||||
|
||||
var workStep = {
|
||||
|
||||
init:function() {
|
||||
|
||||
jsPlumb.reset();
|
||||
|
||||
jsPlumb.bind("beforeDrop", beforeDropHandler);
|
||||
|
||||
$.post("{{url('index2')}}",{bill_id:'{{$bill_id}}'},function(res)
|
||||
{
|
||||
$('#rows').empty();
|
||||
var nLastStepId = 0;
|
||||
|
||||
if(res.status == true) {
|
||||
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 = 20;
|
||||
var top = 20;
|
||||
|
||||
var rows = res.data;
|
||||
var setd = {};
|
||||
|
||||
$.each(rows, function(id, row) {
|
||||
var title = '<span class="ep">' + (row.option == 1 ? '审核' : '知会') + '</span> ' + row.name;
|
||||
if (row.type == 'start') {
|
||||
title = '<span class="ep"><i class="icon icon-play"></i></span> ' + row.name;
|
||||
} else if(row.type == 'end') {
|
||||
title = '<span class="ep"><i class="icon icon-stop"></i></span> ' + row.name;
|
||||
}
|
||||
|
||||
var css = 'wf-step';
|
||||
if (row.type == 'start') {
|
||||
css = 'wf-step wf-step-start';
|
||||
} else if(row.type == 'end') {
|
||||
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":row.left+'px',"top":row.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("show")}}',{id:nowStepId, bill_id:'{{$bill_id}}'}, function(res) {
|
||||
$('#tree').html(res.data).show();
|
||||
})
|
||||
}
|
||||
},
|
||||
// 删除步骤
|
||||
deleted:function() {
|
||||
$.messager.confirm('操作警告','确认要删除该步骤吗?',function(btn) {
|
||||
if (btn) {
|
||||
$.post('{{url("delete")}}',{id:nowStepId, bill_id:'{{$bill_id}}'}, function(res) {
|
||||
if (res.status) {
|
||||
workStep.init();
|
||||
toastrSuccess('操作成功');
|
||||
}
|
||||
},'json');
|
||||
}
|
||||
|
||||
});
|
||||
},
|
||||
// 克隆步骤
|
||||
clone:function() {
|
||||
$.messager.confirm('操作警告','确认要克隆该步骤吗?',function(btn) {
|
||||
if (btn) {
|
||||
$.post('{{url("add")}}',{id:nowStepId,bill_id:'{{$bill_id}}'},function(data) {
|
||||
if(data.status) {
|
||||
workStep.init();
|
||||
toastrSuccess('操作成功');
|
||||
}
|
||||
},'json');
|
||||
}
|
||||
});
|
||||
},
|
||||
dblClick:function(tab) {
|
||||
if (nowStepId > 0) {
|
||||
if(tab == 'base') {
|
||||
$.dialog({
|
||||
title:'基本设置',
|
||||
url:'{{url("create")}}?bill_id={{$bill_id}}&id='+nowStepId+'&tab='+tab,
|
||||
dialogClass: 'modal-lg',
|
||||
buttons:[{
|
||||
class: 'btn-info',
|
||||
text:'<i class="fa fa-check-circle"></i> 提交',
|
||||
click: function() {
|
||||
var formData = $('#mystep').serialize();
|
||||
$.post('{{url("create")}}', formData, function(res) {
|
||||
if (res.status) {
|
||||
workStep.init();
|
||||
toastrSuccess('保存当前视图成功');
|
||||
}
|
||||
},'json');
|
||||
$(this).dialog("close");
|
||||
}
|
||||
},{
|
||||
text:'<i class="fa fa-times"></i> 取消',
|
||||
click: function() {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}]
|
||||
});
|
||||
}
|
||||
if (tab == 'condition') {
|
||||
$.dialog({
|
||||
title:'条件设置',
|
||||
url:'{{url("condition")}}?bill_id={{$bill_id}}&id='+nowStepId+'&tab='+tab,
|
||||
dialogClass: 'modal-lg',
|
||||
buttons:[{
|
||||
class: 'btn-info',
|
||||
text:'<i class="fa fa-check-circle"></i> 提交',
|
||||
click: function() {
|
||||
var formData = $('#conditionform').serialize();
|
||||
$.post('{{url("condition")}}', formData, function(res) {
|
||||
if (res.status) {
|
||||
workStep.init();
|
||||
toastrSuccess('保存当前视图成功');
|
||||
}
|
||||
},'json');
|
||||
$(this).dialog("close");
|
||||
}
|
||||
},{
|
||||
text:'<i class="fa fa-times"></i> 取消',
|
||||
click: function() {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}]
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
add:function() {
|
||||
$.post('{{url("add")}}',{bill_id:'{{$bill_id}}'},function(res) {
|
||||
if (res.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,bill_id:'{{$bill_id}}'},function(result) {
|
||||
if(result.status) {
|
||||
toastrSuccess('保存当前视图成功');
|
||||
}
|
||||
},'json');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
html { overflow: hidden; }
|
||||
.form-panel-body {
|
||||
overflow: hidden;
|
||||
}
|
||||
.graph-box {
|
||||
overflow: auto;
|
||||
width: 100vw;
|
||||
height: calc(100vh - 48px);
|
||||
}
|
||||
.content-body {
|
||||
margin: 0;
|
||||
}
|
||||
.font-thin {
|
||||
padding: 10px;
|
||||
padding-bottom: 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="form-panel">
|
||||
|
||||
<div class="form-panel-header">
|
||||
<div class="pull-right m-r-sm">
|
||||
<a class="btn btn-sm btn-info" onclick="workStep.add();" href="javascript:;">新建步骤</a>
|
||||
<a class="btn btn-sm btn-default" onclick="workStep.init();" href="javascript:;">重新加载</a>
|
||||
<a href="javascript:;" onclick="workStep.clear();" class="btn btn-sm btn-default"><i class="fa fa-ban"></i> 清空连接</a>
|
||||
<a href="javascript:;" onclick="workStep.save();" class="btn btn-sm btn-info"><i class="fa fa-random"></i> 保存连接和视图</a>
|
||||
<a class="btn btn-sm btn-default" data-toggle="closetab" data-id="flow_step_index2"><i class="fa fa-sign-out"></i> 退出</a>
|
||||
</div>
|
||||
<div class="font-thin">
|
||||
<i class="fa fa-file-text-o"></i> {{$bill['name']}}流程
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-panel-body">
|
||||
<div class="wrapper-xs graph-box">
|
||||
<div class="graph" id="graph" data-toggle="context" data-target="#graph-menu">
|
||||
<div id="rows"></div>
|
||||
</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>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,41 @@
|
||||
<div class="panel">
|
||||
<form class="form-horizontal" method="post" action="{{url()}}" id="moveform" name="moveform">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-form">
|
||||
<tr>
|
||||
<td align="right">工作步骤</td>
|
||||
<td align="left">
|
||||
<select id="batch_status" class="form-control input-sm">
|
||||
<option value=""> - </option>
|
||||
<option value="0">未发放</option>
|
||||
<option value="1">已发放</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right" width="15%">主办人</td>
|
||||
<td align="left">
|
||||
{{App\Support\Dialog::user('user','user_id', '', 0, 0)}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">工作状态</td>
|
||||
<td align="left">
|
||||
<select id="batch_status" class="form-control input-sm">
|
||||
<option value="0">未办理</option>
|
||||
<option value="1">已办理</option>
|
||||
<option value="2">全部</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="right">描述</td>
|
||||
<td align="left">
|
||||
<textarea class="form-control" id="batch_description"></textarea>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<input type="hidden" name="id" value="{{$row->id}}">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,961 @@
|
||||
<div class="panel">
|
||||
|
||||
<div class="wrapper-sm">
|
||||
<a class="btn btn-default btn-sm" href="{{url('index',['bill_id'=>$bill_id])}}"><i class="fa fa-reply"></i> 返回</a>
|
||||
<a id="add-form-group" class="btn btn-sm btn-info">
|
||||
<i class="fa fa-plus"></i>
|
||||
添加表单组
|
||||
</a>
|
||||
<!--
|
||||
<a onclick="preview()" class="btn btn-default">预览</a>
|
||||
-->
|
||||
<a onclick="submit()" class="btn btn-sm btn-success">
|
||||
<i class="fa fa-check"></i> 提交
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="wrapper-sm b-t">
|
||||
|
||||
<div class="col-sm-2 col-left m-b-xs">
|
||||
<div class="panel b-a panel-default tabs-box">
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="active"><a href="#1" data-toggle="tab">字段列表</a></li>
|
||||
<li class=""><a href="#2" data-toggle="tab">组件列表</a></li>
|
||||
</ul>
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane active" id="1">
|
||||
<ul class="list-group">
|
||||
<!-- 多行子表 -->
|
||||
@foreach($models as $model)
|
||||
@if($model['parent_id'])
|
||||
<div class="list-group-item fld field" data-col="12" data-hidden="0" data-readonly="0" data-title="" data-role_name="{{$model['role_name']}}" data-role_id="{{$model['role_id']}}" data-type="{{$model['type']}}" data-table="" data-field="{{$model['table']}}">
|
||||
<div class="title">
|
||||
<b>{{$model['name']}}</b>
|
||||
</div>
|
||||
<i class="move fa fa-w fa-arrows"></i>
|
||||
<i class="fa fa-w fa-remove" title="删除"></i>
|
||||
<div class="desc-sublist"></div>
|
||||
</div>
|
||||
@endif
|
||||
@foreach($model['fields'] as $field)
|
||||
<div class="list-group-item fld field" data-col="12" data-hidden="0" data-readonly="0" data-title="" data-role_name="{{$field['role_name']}}" data-role_id="{{$field['role_id']}}" data-type="@if($model['parent_id'] == 0) 0 @else {{$field['type']}} @endif" data-table="{{$model['table']}}" data-field="{{$field['field']}}">
|
||||
<div class="title">
|
||||
@if($model['parent_id'] > 0)
|
||||
<span class="model-title">[{{$model['name']}}]</span>
|
||||
@endif
|
||||
{{$field['name']}}
|
||||
</div>
|
||||
<i class="move fa fa-w fa-arrows"></i>
|
||||
<i class="remove fa fa-w fa-remove" title="删除"></i>
|
||||
@if($model['parent_id'] == 0)
|
||||
<div class="desc"></div>
|
||||
@endif
|
||||
</div>
|
||||
@endforeach
|
||||
|
||||
@endforeach
|
||||
<div class="list-group-item fld field" data-col="12" data-hidden="0" data-readonly="0" data-role_name="" data-role_id="" data-id="0" data-type="0" data-field="{flowlog}">
|
||||
<div class="title">流程记录</div>
|
||||
<i class="move fa fa-w fa-arrows"></i>
|
||||
<i class="remove fa fa-w fa-remove" title="删除"></i>
|
||||
<div class="desc"></div>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-pane" id="2">
|
||||
<ul class="list-group">
|
||||
<div class="list-group-item fld field" data-col="12" data-hidden="0" data-readonly="0" data-role_name="" data-role_id="" data-id="0" data-type="0" data-custom="1" data-field="{flowlog}">
|
||||
<div class="title">流程记录</div>
|
||||
<i class="move fa fa-w fa-arrows"></i>
|
||||
<i class="remove fa fa-w fa-remove" title="删除"></i>
|
||||
<div class="desc"></div>
|
||||
</div>
|
||||
<div class="list-group-item fld field" data-col="12" data-title="单行文本" data-hidden="0" data-readonly="0" data-role_name="" data-role_id="" data-id="0" data-type="0" data-custom="1" data-field="{text}">
|
||||
<div class="title">单行文本</div>
|
||||
<i class="move fa fa-w fa-arrows"></i>
|
||||
<i class="remove fa fa-w fa-remove" title="删除"></i>
|
||||
<div class="desc"></div>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-8">
|
||||
<div class="droppedFieldsBox" id="droppedFieldsBox"></div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-2 col-right">
|
||||
<div class="panel b-a panel-default tabs-box">
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="active"><a href="#11" data-toggle="tab">字段属性</a></li>
|
||||
<li class=""><a href="#22" data-toggle="tab">模板属性</a></li>
|
||||
</ul>
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane active" id="11">
|
||||
<div class="panel-body field-attr" id="fieldAttribute">
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_col">占用行比例</label>
|
||||
<div class="form-text">
|
||||
<select class="form-control input-sm" id="set_col" onchange="setCol(this.value)" required="required">
|
||||
<option value="12">12</option>
|
||||
<option value="11">11</option>
|
||||
<option value="10">10</option>
|
||||
<option value="9">9</option>
|
||||
<option value="8">8</option>
|
||||
<option value="7">7</option>
|
||||
<option value="6">6</option>
|
||||
<option value="5">5</option>
|
||||
<option value="4">4</option>
|
||||
<option value="3">3</option>
|
||||
<option value="2">2</option>
|
||||
<option value="1">1</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_readonly">字段只读</label>
|
||||
<div class="form-text">
|
||||
<select class="form-control input-sm" id="set_readonly" onchange="setField('readonly', this.value)" required="required">
|
||||
<option value="0">否</option>
|
||||
<option value="1">是</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_hide_title">标题</label>
|
||||
<div class="form-text">
|
||||
<input class="form-control input-sm" id="set_title" onblur="setField('title', this.value)">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_content">内容</label>
|
||||
<div class="form-text">
|
||||
<input class="form-control input-sm" id="set_content" onblur="setField('content', this.value)">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_hide_title">标题隐藏</label>
|
||||
<div class="form-text">
|
||||
<select class="form-control input-sm" id="set_hide_title" onchange="setField('hide_title', this.value)" required="required">
|
||||
<option value="0">否</option>
|
||||
<option value="1">是</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_readonly">字段宽度</label>
|
||||
<div class="form-text">
|
||||
<input class="form-control input-sm" id="set_width" onchange="setField('width', this.value)">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_hidden">字段可见</label>
|
||||
<div class="form-text">
|
||||
<select class="form-control input-sm" id="set_hidden" onchange="setField('hidden', this.value)" required="required">
|
||||
<option value="0">是</option>
|
||||
<option value="1">否</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_hidden">字段隐藏</label>
|
||||
<div class="form-text">
|
||||
<div class="select-group input-group" style="width:100%;"><input class="form-control input-inline input-sm" style="cursor:pointer;" readonly="readonly" data-multi="1" data-name="role_name" data-title="角色" data-url="user/role/dialog" data-id="role_id" data-toggle="dialog-view" id="role_name" />
|
||||
<div class="input-group-btn">
|
||||
<a data-toggle="dialog-clear" data-id="role_id" class="btn btn-sm btn-default"><i class="fa fa-times"></i></a>
|
||||
</div>
|
||||
<input type="hidden" id="role_id">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab-pane" id="22">
|
||||
<div class="panel-body field-attr">
|
||||
<form method="post" id="myform" name="myform">
|
||||
<div class="form-group">
|
||||
<label for="set_col">视图名称 <span class="red">*</span></label>
|
||||
<div class="form-text">
|
||||
<input type="text" id="name" name="name" value="{{$template['name']}}" class="form-control input-sm">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_col">视图编码 <span class="red">*</span></label>
|
||||
<div class="form-text">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon" style="display:inline-block;overflow:hidden;white-space:nowrap;width:100px;text-overflow:ellipsis;">{{$master_model['table']}}_</span>
|
||||
<input type="text" id="code" name="code" value="{{$template['code']}}" class="form-control input-sm">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_col">视图类型 <span class="red">*</span></label>
|
||||
<div class="form-text">
|
||||
<select multiple="multiple" class="input-select2 form-control input-sm" id="type" name="type[]" data-width="100%">
|
||||
<option value="create" @if(in_array('create', $template['type'])) selected @endif>新增</option>
|
||||
<option value="edit" @if(in_array('edit', $template['type'])) selected @endif>编辑</option>
|
||||
<option value="show" @if(in_array('show', $template['type'])) selected @endif>显示</option>
|
||||
<option value="print" @if(in_array('print', $template['type'])) selected @endif>打印</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_col">权限范围</label>
|
||||
<div class="form-text">
|
||||
{{App\Support\Dialog::search($template, 'id=receive_id&name=receive_name&multi=1')}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_col">打印方式</label>
|
||||
<div class="form-text">
|
||||
<select class="input-select2 form-control input-sm" id="print_type" name="print_type" data-width="100%">
|
||||
<option value=""> </option>
|
||||
<option value="html" @if($template['print_type'] == 'html') selected @endif>html</option>
|
||||
<option value="stiReport" @if($template['print_type'] == 'stiReport') selected @endif>StiReport</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_col">客户端</label>
|
||||
<div class="form-text">
|
||||
<select multiple="multiple" class="input-select2 form-control input-sm" id="client" name="client[]" data-width="100%">
|
||||
<option value="web" @if(in_array('web', $template['client'])) selected @endif>web</option>
|
||||
<option value="app" @if(in_array('app', $template['client'])) selected @endif>app</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_col">宽度</label>
|
||||
<div class="form-text">
|
||||
<input type="text" id="width" name="width" value="{{$template['width']}}" class="form-control input-sm">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="hidden" name="bill_id" id="bill_id" value="{{$bill_id}}">
|
||||
<input type="hidden" name="id" id="template_id" value="{{$template['id']}}">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@verbatim
|
||||
@endverbatim
|
||||
|
||||
<style>
|
||||
@media (min-width: 768px) {
|
||||
.col-sm-8 {
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.col-left {
|
||||
padding-left: 0;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.col-right {
|
||||
padding-left: 5px;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.panel-heading .panel-title {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.panel-heading .fa {
|
||||
vertical-align: middle;
|
||||
color: #999;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.panel-heading .fa:hover {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding: 10px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.desc {
|
||||
display: none;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
}
|
||||
.list-group-item:first-child {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.list-group {
|
||||
position: relative;
|
||||
height: 500px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.list-group .fa {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.list-group .field:hover {
|
||||
background-color: #eee;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.droppedFields > .remove {
|
||||
display: none;
|
||||
}
|
||||
.droppedFields .active > .remove {
|
||||
background-color: #ddd;
|
||||
display: block;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 5px;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
padding-left: 4px;
|
||||
line-height: 18px;
|
||||
}
|
||||
.droppedFields .active > .remove:hover {
|
||||
background-color: #ff0000;
|
||||
}
|
||||
|
||||
.droppedFields .title {
|
||||
padding: 8px;
|
||||
padding-left: 29px;
|
||||
}
|
||||
|
||||
.droppedFields .model-title {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.droppedFields > .move {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.droppedFields .active > .move {
|
||||
cursor: move;
|
||||
background-color: #23b7e5;
|
||||
display: block;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
top: 5px;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
padding-left: 4px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.droppedFields .field {
|
||||
border-top: #ddd solid 1px;
|
||||
border-bottom: #ddd solid 1px;
|
||||
border-right: #ddd solid 1px;
|
||||
border-left: #ddd solid 1px;
|
||||
background-color: #fff;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-top: -1px;
|
||||
white-space: nowrap;
|
||||
margin: 1px;
|
||||
}
|
||||
|
||||
.droppedFields .field {
|
||||
position: relative;
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
.droppedFields > .field:hover {
|
||||
border: 1px dashed #f6c483;
|
||||
}
|
||||
|
||||
.droppedFields > .field.active {
|
||||
border: 1px dashed #23b7e5;
|
||||
}
|
||||
|
||||
.droppedFields .fa {
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.droppedFields > .field.active .fa {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.droppedFields .desc {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.droppedFields .desc-sublist {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
min-height: 30px;
|
||||
border-top: #ddd solid 1px;
|
||||
white-space: nowrap;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.droppedFields .desc-sublist .fld {
|
||||
white-space: normal;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.droppedFields {
|
||||
min-height: 60px;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.highlightDroppable {
|
||||
border: 1px dashed #f6c483;
|
||||
background: #fffdfa;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-top: -1px;
|
||||
position: relative;
|
||||
margin: 1px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.field-attr .form-group label {
|
||||
width: 70px;
|
||||
float: left;
|
||||
vertical-align: middle;
|
||||
text-align: right;
|
||||
font-weight: normal;
|
||||
line-height: 28px;
|
||||
}
|
||||
.field-attr .form-group .form-text {
|
||||
margin-left: 80px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<!--
|
||||
@verbatim
|
||||
<div id="app">
|
||||
<div class="dragDemo">
|
||||
<draggable class="list-group"
|
||||
element="div"
|
||||
v-model="listLeft"
|
||||
:move="onMove"
|
||||
group="people"
|
||||
@start="isDragging=true"
|
||||
@end="isDragging=false">
|
||||
<div v-for="(item, key) in listLeft" :key="key">
|
||||
{{item.name}}-{{item.value}}
|
||||
</div>
|
||||
</draggable>
|
||||
<draggable class="list-group"
|
||||
element="div"
|
||||
v-model="listLeft1"
|
||||
:move="onMove"
|
||||
group="people"
|
||||
@start="isDragging=true"
|
||||
@end="isDragging=false">
|
||||
<div v-for="(item, key) in listLeft1" :key="key">
|
||||
{{item.name}}-{{item.value}}
|
||||
</div>
|
||||
</draggable>
|
||||
<draggable class="list-group"
|
||||
element="div"
|
||||
v-model="listRight"
|
||||
:move="onMove"
|
||||
group="people"
|
||||
@start="isDragging=true"
|
||||
@end="isDragging=false">
|
||||
<div v-for="(item,key) in listRight" :key="key">
|
||||
{{item.name}}-{{item.value}}
|
||||
</div>
|
||||
</draggable>
|
||||
</div>
|
||||
</div>
|
||||
@endverbatim
|
||||
|
||||
<script>
|
||||
new Vue({
|
||||
el: '#app',
|
||||
data() {
|
||||
return {
|
||||
isDragging:false,
|
||||
listLeft:[{
|
||||
name:'数据一',
|
||||
value:'1'
|
||||
}, {
|
||||
name:'数据二',
|
||||
value:'2'
|
||||
}, {
|
||||
name:'数据三',
|
||||
value:'3'
|
||||
}, {
|
||||
name:'数据四',
|
||||
value:'4'
|
||||
}, {
|
||||
name:'数据五',
|
||||
value:'5'
|
||||
}],
|
||||
listLeft1:[{
|
||||
name:'布局',
|
||||
value:'1'
|
||||
}, {
|
||||
name:'数据二',
|
||||
value:'2'
|
||||
}],
|
||||
listRight:[]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onMove({relatedContext, draggedContext}) {
|
||||
const relatedElement = relatedContext.element;
|
||||
const draggedElement = draggedContext.element;
|
||||
return (
|
||||
(!relatedElement || !relatedElement.fixed) && !draggedElement.fixed
|
||||
);
|
||||
},
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dragDemo {
|
||||
margin-top:50px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
color: #555;
|
||||
}
|
||||
.dragDemo .list-group {
|
||||
width: 300px;
|
||||
border: 1px solid #ddd;
|
||||
text-align: center;
|
||||
margin-right: 50px;
|
||||
}
|
||||
.dragDemo .list-group > div {
|
||||
padding:10px;
|
||||
border-bottom:1px dashed #ddd;
|
||||
}
|
||||
.dragDemo .list-group > div img {
|
||||
width:25px;
|
||||
height:25px;
|
||||
vertical-align: middle;
|
||||
padding-right:10px;
|
||||
}
|
||||
</style>
|
||||
-->
|
||||
|
||||
<script>
|
||||
|
||||
var fields = JSON.parse('{{$template["tpl"]}}');
|
||||
|
||||
var activeField = null;
|
||||
|
||||
var droppedFieldsBox = null;
|
||||
|
||||
function setCol(v) {
|
||||
activeField.attr('data-col', v);
|
||||
activeField.css({ width: 'calc(' + (v / 12 * 100) + '% - 2px'});
|
||||
}
|
||||
|
||||
function setField(f, v) {
|
||||
if (f == 'title') {
|
||||
activeField.find('.title').text(v);
|
||||
}
|
||||
activeField.attr('data-' + f, v);
|
||||
}
|
||||
|
||||
// 子表对话框
|
||||
gdoo.event.set('role_id', {
|
||||
onSelect(row) {
|
||||
var role_id = $('#role_id').val();
|
||||
var role_name = $('#role_id_text').val();
|
||||
setField('role_id', role_id);
|
||||
setField('role_name', role_name);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
|
||||
var sortableOptions = {
|
||||
opacity: 0.4,
|
||||
delay: 50,
|
||||
cursor: "move",
|
||||
handle: ".move",
|
||||
placeholder: "highlightDroppable ui-corner-all",
|
||||
forcePlaceholderSize: true,
|
||||
connectWith: '.droppedFields,.desc-sublist',
|
||||
stop: function (event, ui) {
|
||||
var type = ui.item.hasClass('component');
|
||||
if (type == undefined) {
|
||||
ui.item.attr('component', 1);
|
||||
ui.item.css({width:'100%'});
|
||||
}
|
||||
ui.item.trigger("click");
|
||||
|
||||
if(ui.item.data('type') == 1) {
|
||||
droppedFieldsBox.find('.desc-sublist:not(.ui-sortable)').sortable(sortableOptions);
|
||||
}
|
||||
|
||||
},
|
||||
start: function (event, ui) {
|
||||
ui.item.removeClass('list-group-item');
|
||||
var h = $(this).find(".highlightDroppable");
|
||||
h.outerWidth(ui.item[0].style.width);
|
||||
h.outerHeight(ui.item[0].style.height);
|
||||
h.html('拖放控件到这里');
|
||||
}, out: function (event, ui) {
|
||||
}
|
||||
}
|
||||
|
||||
function editDialog(options) {
|
||||
var defaultOptions = {
|
||||
title: '',
|
||||
html: '<div class="panel-body"><div class="form-group"><label>名字</label><input type="text" class="form-control input-sm" id="group_title"></div><div class="form-group"><label>类型</label><select class="form-control input-sm" id="group_type"><option value="panel">panel</option><option value="tabs">tabs</option></select></div><div class="form-group"><label>边框</label><select class="form-control input-sm" id="group_border"><option value="1">有</option><option value="0">无</option></select></div></div>',
|
||||
buttons: [{
|
||||
class: 'btn-default',
|
||||
text: '<i class="fa fa-remove"></i> 取消',
|
||||
click: function () {
|
||||
$(this).dialog('close');
|
||||
}
|
||||
},{
|
||||
class: 'btn-info',
|
||||
text: '<i class="fa fa-check"></i> 提交',
|
||||
click: function () {
|
||||
if(typeof options.onSubmit === 'function') {
|
||||
options.onSubmit.call(this);
|
||||
}
|
||||
}
|
||||
}]
|
||||
};
|
||||
|
||||
options = $.extend(defaultOptions, options);
|
||||
$.dialog(options);
|
||||
}
|
||||
|
||||
$(function() {
|
||||
|
||||
droppedFieldsBox = $('#droppedFieldsBox');
|
||||
|
||||
// 添加表单组
|
||||
$("#add-form-group").on('click', function() {
|
||||
editDialog({
|
||||
title: '添加表单组',
|
||||
onSubmit: function() {
|
||||
var title = $(this).find('#group_title').val();
|
||||
var type = $(this).find('group_type').val();
|
||||
var border = $(this).find('#group_border').val();
|
||||
|
||||
var size = $('.droppedFields').size() + 1;
|
||||
|
||||
droppedFieldsBox.append('<div class="panel b-a"><div class="panel-heading b-b"><span class="pull-right"><i class="fa fa-fw fa-pencil"></i><i class="fa fa-fw fa-remove"></i></span><span class="label bg-light panel-type">' + type + '</span> <span class="panel-title">' + title + '</span></div><div data-type="' + type + '" data-border="'+border+'" data-title="' + title + '" data-column="' + size + '" id="selected-column-' + size + '" class="droppedFields"></div></div>');
|
||||
$('.droppedFields:not(.ui-sortable)').sortable(sortableOptions);
|
||||
(this).dialog('close');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 编辑表单组
|
||||
droppedFieldsBox.on('click', '.panel-heading .fa-pencil', function() {
|
||||
|
||||
var heading = $(this).closest('.panel');
|
||||
var dropped = heading.find('.droppedFields');
|
||||
|
||||
editDialog({
|
||||
title: '编辑表单组',
|
||||
onShow: function() {
|
||||
var me = this;
|
||||
me.html(me.options['html']);
|
||||
$(this).find('#group_title').val(dropped.attr('data-title'));
|
||||
$(this).find('#group_type').val(dropped.attr('data-type'));
|
||||
$(this).find('#group_border').val(dropped.attr('data-border'));
|
||||
},
|
||||
onSubmit: function() {
|
||||
var title = $(this).find('#group_title').val();
|
||||
var type = $(this).find('group_type').val();
|
||||
var border = $(this).find('#group_border').val();
|
||||
dropped.attr('data-title', title);
|
||||
dropped.attr('data-type', type);
|
||||
dropped.attr('data-border', border);
|
||||
|
||||
heading.find('.panel-title').text(title);
|
||||
heading.find('.panel-type').text(type);
|
||||
heading.find('.panel-border').text(border);
|
||||
|
||||
$(this).dialog('close');
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
// 删除表单组
|
||||
droppedFieldsBox.on('click', '.panel-heading .fa-remove', function() {
|
||||
$(this).closest('.panel').remove();
|
||||
});
|
||||
|
||||
// 删除字段
|
||||
droppedFieldsBox.on('click', '.droppedFields .fa-remove', function() {
|
||||
$(this).closest('.field').remove();
|
||||
});
|
||||
|
||||
// 点击字段
|
||||
droppedFieldsBox.on('click', '.droppedFields .field', function(e) {
|
||||
|
||||
e.stopPropagation();
|
||||
|
||||
var me = $(this);
|
||||
activeField = me;
|
||||
|
||||
$(document).find('.droppedFields .field').removeClass('active');
|
||||
me.addClass('active');
|
||||
var data = me.data();
|
||||
|
||||
for (const key in data) {
|
||||
if (key == 'sortableItem') {
|
||||
continue;
|
||||
}
|
||||
var v = me.attr('data-' + key) || '';
|
||||
var $attr = $('#fieldAttribute');
|
||||
$attr.find('#set_' + key).val(v);
|
||||
if (key == 'role_name') {
|
||||
$attr.find('#role_id_text').val(v || '');
|
||||
} else {
|
||||
$attr.find('#' + key).val(v || '');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$('.fld').draggable({
|
||||
connectToSortable: '.droppedFields',
|
||||
helper: "clone",
|
||||
revert: "invalid",
|
||||
start: function (event, ui) {
|
||||
var width = ui.helper.parent().outerWidth();
|
||||
ui.helper.outerWidth(width);
|
||||
}
|
||||
});
|
||||
|
||||
// 初始化字段
|
||||
$.each(fields, function(k, form_group) {
|
||||
|
||||
var type = form_group.type;
|
||||
var size = form_group.column;
|
||||
var title = form_group.title;
|
||||
var border = form_group.border;
|
||||
var _fields = Array();
|
||||
|
||||
form_group.fields = form_group.fields || [];
|
||||
|
||||
$.each(form_group.fields, function(k, v) {
|
||||
var w = 'calc(' + (v.col / 12 * 100) + '% - 2px)';
|
||||
if (v.type == 0) {
|
||||
_fields.push('<div class="fld field" ' + attrJoin(v) + ' style="display:inline-block;width: ' + w + ';" title="'+ v.name +'"><div class="title">' + v.name + '</div><div class="desc"></div><i class="move fa fa-w fa-arrows"></i><i class="remove fa fa-w fa-remove" title="删除"></i></div>');
|
||||
} else {
|
||||
var _subs = [];
|
||||
v.fields = v.fields || [];
|
||||
$.each(v.fields, function(k, vv) {
|
||||
_subs.push('<div class="fld field" ' + attrJoin(vv, true) + ' title="'+ vv.name +'"><div class="title">' + vv.name + '</div><i class="move fa fa-w fa-arrows"></i><i class="remove fa fa-w fa-remove" title="删除"></i></div>');
|
||||
});
|
||||
_fields.push('<div class="fld field" ' + attrJoin(v) + ' style="display:inline-block;width: ' + w + ';" title="'+ v.name +'"><div class="title"> ' + v.name + '</div><i class="move fa fa-w fa-arrows"></i><i class="remove fa fa-w fa-remove" title="删除"></i><div class="desc-sublist">' + _subs.join('') + '</div></div>');
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
droppedFieldsBox.append('<div class="panel b-a"><div class="panel-heading b-b"><span class="pull-right"><i class="fa fa-fw fa-pencil"></i><i class="fa fa-fw fa-remove"></i></span><span class="label bg-light panel-type">panel</span> <span class="panel-title">' + title + '</span></div><div data-type="' + type + '" data-border="'+border+'" data-title="' + title + '" data-column="' + size + '" id="selected-column-' + size + '" class="droppedFields">' + _fields.join('') + '</div></div>');
|
||||
|
||||
});
|
||||
|
||||
$('.droppedFields:not(.ui-sortable)').sortable(sortableOptions);
|
||||
droppedFieldsBox.find('.desc-sublist:not(.ui-sortable)').sortable(sortableOptions);
|
||||
|
||||
$('.droppedFieldsBox').sortable({
|
||||
handle: '.panel-heading',
|
||||
opacity: 0.6,
|
||||
delay: 50,
|
||||
cursor: 'move',
|
||||
start: function (event, ui) {
|
||||
},
|
||||
update: function(event, ui) {
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
function attrJoin(data, subfld) {
|
||||
var fields = ['col', 'css', 'table', 'field', 'content', 'hidden', 'custom', 'title', 'readonly', 'type', 'width', 'hide_title', 'role_id', 'role_name'];
|
||||
var attr = [];
|
||||
for (let i = 0; i < fields.length; i++) {
|
||||
var field = fields[i];
|
||||
if (subfld == true && field == 'type') {
|
||||
continue;
|
||||
}
|
||||
|
||||
var v = data[field];
|
||||
if (field == 'hidden' || field == 'readonly' || field == 'type' || field == 'hide_title' || field == 'custom') {
|
||||
v = v == undefined ? 0 : v;
|
||||
}
|
||||
|
||||
if (field == 'content' || field == 'role_id' || field == 'role_name' || field == 'title') {
|
||||
v = v == undefined ? '' : v;
|
||||
}
|
||||
|
||||
if (field == 'width') {
|
||||
v = setInt(v);
|
||||
}
|
||||
attr.push('data-' + field + '="' + v + '"');
|
||||
}
|
||||
return attr.join(' ');
|
||||
}
|
||||
|
||||
function setInt(v) {
|
||||
var v = parseInt(v);
|
||||
return v > 0 ? v : '';
|
||||
}
|
||||
|
||||
function preview() {
|
||||
|
||||
console.log(getColumns());
|
||||
return;
|
||||
|
||||
var dialogContent, i, j;
|
||||
if (columns.length > 0) {
|
||||
var divWidth = 100 / columns.length;
|
||||
dialogContent = "<div>";
|
||||
for (i = 0; i < columns.length; i++) {
|
||||
dialogContent += "<div style='float:left;width=" + divWidth + "%;'>";
|
||||
dialogContent += "<ul><li><b>Column " + (i + 1) + "</b></li>";
|
||||
for (j = 0; j < columns[i].length; j++) {
|
||||
var obj = columns[i][j];
|
||||
dialogContent += "<li>" + obj.label + "</li>";
|
||||
}
|
||||
dialogContent += "</ul></div>";
|
||||
}
|
||||
dialogContent += "</div>";
|
||||
} else {
|
||||
dialogContent = '<div>Nothing to preview</div>';
|
||||
}
|
||||
|
||||
$(dialogContent).dialog({
|
||||
modal: true,
|
||||
width: 500,
|
||||
height: 400,
|
||||
buttons: {
|
||||
Ok: function () {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getColumns() {
|
||||
var res = [];
|
||||
$.each($(".droppedFields"), function(i, v) {
|
||||
|
||||
var groupTitle = $(v).attr('data-title');
|
||||
var groupType = $(v).attr('data-type');
|
||||
var groupBorder = $(v).attr('data-border');
|
||||
var groupColumn = $(v).attr('data-column');
|
||||
|
||||
var fields = $(v).children('.field');
|
||||
|
||||
var columns = [];
|
||||
|
||||
if (fields.length > 0) {
|
||||
|
||||
$.each(fields, function(k, v) {
|
||||
|
||||
var me = $(v);
|
||||
var type = me.data('type');
|
||||
|
||||
var _column = getColumn(me);
|
||||
|
||||
if(type == 1) {
|
||||
|
||||
var _fields = $(v).children('.desc-sublist').children('.field');
|
||||
|
||||
if (_fields.length > 0) {
|
||||
var __column = [];
|
||||
$.each(_fields, function(k, _v) {
|
||||
var _me = $(_v);
|
||||
__column.push(getColumn(_me));
|
||||
});
|
||||
_column.fields = __column;
|
||||
}
|
||||
}
|
||||
|
||||
columns.push(_column);
|
||||
|
||||
});
|
||||
res.push({title:groupTitle, border: groupBorder, type: groupType, column:groupColumn, fields:columns});
|
||||
}
|
||||
});
|
||||
return res;
|
||||
}
|
||||
|
||||
function getColumn(me) {
|
||||
var column = {};
|
||||
column.field = me.attr('data-field');
|
||||
column.css = me.attr('data-css');
|
||||
column.hidden = me.attr('data-hidden');
|
||||
column.width = me.attr('data-width');
|
||||
column.readonly = me.attr('data-readonly');
|
||||
column.hide_title = me.attr('data-hide_title');
|
||||
column.type = me.attr('data-type');
|
||||
column.table = me.attr('data-table');
|
||||
column.title = me.attr('data-title');
|
||||
column.role_id = me.attr('data-role_id');
|
||||
column.role_name = me.attr('data-role_name');
|
||||
column.custom = me.attr('data-custom');
|
||||
column.col = me.attr('data-col');
|
||||
column.content = me.attr('data-content');
|
||||
column.name = me.children(".title").text().trim();
|
||||
return column;
|
||||
}
|
||||
|
||||
function submit() {
|
||||
var columns = getColumns();
|
||||
var data = $('#myform').serialize() + '&' + $.param({columns: columns});
|
||||
$.post('{{url()}}', data, function (res) {
|
||||
if (res.status) {
|
||||
toastrSuccess(res.data);
|
||||
location.href = res.url;
|
||||
} else {
|
||||
toastrError(res.data);
|
||||
}
|
||||
}, 'json');
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,365 @@
|
||||
<div class="panel">
|
||||
|
||||
<div class="wrapper-sm">
|
||||
|
||||
<a class="btn btn-default btn-sm" href="{{url('index',['bill_id'=>$bill_id])}}"><i class="fa fa-reply"></i> 返回</a>
|
||||
<a onclick="submit()" class="btn btn-sm btn-success">
|
||||
<i class="fa fa-check"></i> 提交
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="wrapper-sm b-t">
|
||||
|
||||
@verbatim
|
||||
<div id="app">
|
||||
|
||||
<div class="col-sm-2 m-b">
|
||||
<div class="panel b-a panel-default">
|
||||
<div class="panel-heading">
|
||||
<div>字段列表</div>
|
||||
</div>
|
||||
<draggable class="list-group"
|
||||
v-model="listLeft"
|
||||
item-key="name"
|
||||
group="people"
|
||||
:sort="false"
|
||||
@start="isDragging=true"
|
||||
@end="isDragging=false">
|
||||
<template #item="{element}">
|
||||
<a class="list-group-item">
|
||||
{{element.name}}
|
||||
</a>
|
||||
</template>
|
||||
</draggable>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-2 m-b">
|
||||
<div class="panel b-a panel-default">
|
||||
<div class="panel-heading">
|
||||
<div>字段列表</div>
|
||||
</div>
|
||||
|
||||
<draggable class="list-group"
|
||||
v-model="listRight"
|
||||
item-key="name"
|
||||
group="people"
|
||||
@start="isDragging=true"
|
||||
@end="isDragging=false">
|
||||
<template #item="{element, index}">
|
||||
<a class="list-group-item" @click="clickItem(index, element)">
|
||||
{{element.name}}
|
||||
</a>
|
||||
</template>
|
||||
</draggable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endverbatim
|
||||
|
||||
<div class="col-sm-2 m-b">
|
||||
<div class="panel b-a panel-default">
|
||||
<div class="panel-heading">
|
||||
<div>字段列表</div>
|
||||
</div>
|
||||
|
||||
<form method="post" id="myform" name="myform">
|
||||
|
||||
<div class="panel-body">
|
||||
<div class="form-group">
|
||||
<label>视图名称 <span class="red">*</span></label>
|
||||
<input type="text" id="name" name="name" value="{{$template['name']}}" class="form-control input-sm">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="set_col">视图编码 <span class="red">*</span></label>
|
||||
<div class="form-text">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon">{{$model['table']}}_</span>
|
||||
<input type="text" id="code" name="code" value="{{$template['code']}}" class="form-control input-sm">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>视图类型</label>
|
||||
<select multiple="multiple" class="input-select2 form-control input-sm" id="type" name="type[]" data-width="100%">
|
||||
<option value="list" @if(in_array('list', $template['type'])) selected @endif>列表</option>
|
||||
<option value="dialog" @if(in_array('dialog', $template['type'])) selected @endif>对话框</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>权限范围 <span class="red">*</span></label>
|
||||
{{App\Support\Dialog::search($template, 'id=receive_id&name=receive_name&multi=1')}}
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>客户端 <span class="red">*</span></label>
|
||||
<select multiple="multiple" class="input-select2 form-control input-sm" data-width="100%" id="client" name="client[]">
|
||||
<option value="web" @if(in_array('web', $template['client'])) selected @endif>web</option>
|
||||
<option value="app" @if(in_array('app', $template['client'])) selected @endif>app</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="hidden" name="bill_id" id="bill_id" value="{{$bill_id}}">
|
||||
<input type="hidden" name="id" id="id" value="{{$template['id']}}">
|
||||
<input type="hidden" name="table" id="table" value="{{$model['table']}}_">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-sm-2 m-b">
|
||||
<div class="panel b-a panel-default">
|
||||
<div class="panel-heading">
|
||||
<div>字段属性</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="form-group">
|
||||
<label for="set_hidden">字段隐藏</label>
|
||||
<div class="select-group input-group" style="width:100%;">
|
||||
<input class="form-control input-inline input-sm" style="cursor:pointer;" readonly="readonly" data-multi="1" data-name="role_name" data-title="角色" data-url="user/role/dialog" data-id="role_id" data-toggle="dialog-view" id="role_id_text" />
|
||||
<div class="input-group-btn">
|
||||
<a data-toggle="dialog-clear" data-id="role_id" class="btn btn-sm btn-default"><i class="fa fa-times"></i></a>
|
||||
</div>
|
||||
<input type="hidden" id="role_id">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.col-sm-2 {
|
||||
padding: 0;
|
||||
padding-right: 10px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
var template = JSON.parse('{{json_encode($template, JSON_UNESCAPED_UNICODE)}}');
|
||||
var rightIndex = -1;
|
||||
var vueData = {
|
||||
components: {
|
||||
draggable: GdooVueComponents.draggable,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isDragging: false,
|
||||
listLeft: template.leftFields,
|
||||
listRight: template.rightFields
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickItem(index, item) {
|
||||
rightIndex = index;
|
||||
$('#role_id').val(item.role_id || '');
|
||||
$('#role_id_text').val(item.role_name || '');
|
||||
}
|
||||
}
|
||||
}
|
||||
var vm = Vue.createApp(vueData).mount('#app');
|
||||
|
||||
// 子表对话框
|
||||
gdoo.event.set('role_id', {
|
||||
clear() {
|
||||
vm.listRight[rightIndex]['role_id'] = '';
|
||||
vm.listRight[rightIndex]['role_name'] = '';
|
||||
},
|
||||
onSelect(row) {
|
||||
var role_id = $('#role_id').val();
|
||||
var role_name = $('#role_id_text').val();
|
||||
if (rightIndex >= 0) {
|
||||
vm.listRight[rightIndex]['role_id'] = role_id;
|
||||
vm.listRight[rightIndex]['role_name'] = role_name;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
});
|
||||
|
||||
function submit() {
|
||||
var data = vm.listRight;
|
||||
var data = $('#myform').serialize() + '&' + $.param({columns: data});
|
||||
$.post('{{url()}}', data, function (res) {
|
||||
if (res.status) {
|
||||
toastrSuccess(res.data);
|
||||
location.reload();
|
||||
} else {
|
||||
toastrError(res.data);
|
||||
}
|
||||
}, 'json');
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.col-sm-8 {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.panel-heading .panel-title {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.panel-heading .fa {
|
||||
vertical-align: middle;
|
||||
color: #999;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.panel-heading .fa:hover {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.desc {
|
||||
display: none;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.field {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.droppedFields .title > .fa {
|
||||
display: none;
|
||||
float: right;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.droppedFields .active .title > .fa {
|
||||
display: none;
|
||||
float: right;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.droppedFields .title:hover > .fa {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.list-group {
|
||||
position: relative;
|
||||
height: 500px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.list-group .fa {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.list-group .field:hover {
|
||||
background-color: #eee;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.droppedFields .field {
|
||||
cursor: move;
|
||||
border-top: #ddd solid 1px;
|
||||
border-bottom: #ddd solid 1px;
|
||||
border-right: #ddd solid 1px;
|
||||
border-left: #ddd solid 1px;
|
||||
background-color: #fff;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-top: -1px;
|
||||
white-space: nowrap;
|
||||
margin: 1px;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding: 10px;
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.droppedFields .title {
|
||||
background-color: #eee;
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.droppedFields .desc-sublist .title {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.droppedFields .active > .title {
|
||||
background-color: #0e90d2;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.droppedFields .fa {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.droppedFields .desc {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.droppedFields .desc-sublist {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
min-height: 30px;
|
||||
border-top: #ddd solid 1px;
|
||||
white-space: nowrap;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.droppedFields .subfld {
|
||||
white-space: normal;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.droppedFields {
|
||||
min-height: 60px;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.highlightDroppable {
|
||||
padding: 10px;
|
||||
border: 1px dashed #f6c483;
|
||||
background: #fffdfa;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-top: -1px;
|
||||
position: relative;
|
||||
margin: 1px;
|
||||
}
|
||||
|
||||
.desc-sublist .highlightDroppable {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<style>
|
||||
.dragDemo {
|
||||
margin-top:50px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
color: #555;
|
||||
}
|
||||
.dragDemo .list-group {
|
||||
width: 300px;
|
||||
border: 1px solid #ddd;
|
||||
text-align: center;
|
||||
margin-right: 50px;
|
||||
}
|
||||
.dragDemo .list-group > div {
|
||||
padding:10px;
|
||||
border-bottom:1px dashed #ddd;
|
||||
}
|
||||
.dragDemo .list-group > div img {
|
||||
width:25px;
|
||||
height:25px;
|
||||
vertical-align: middle;
|
||||
padding-right:10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,48 @@
|
||||
<div class="panel">
|
||||
|
||||
<div class="wrapper-sm">
|
||||
<a class="btn btn-info btn-sm" href="{{url('create',['bill_id'=>$bill_id])}}"><i class="icon icon-plus"></i> 新建表单</a>
|
||||
<a class="btn btn-info btn-sm" href="{{url('create2',['bill_id'=>$bill_id])}}"><i class="icon icon-plus"></i> 新建列表</a>
|
||||
</div>
|
||||
|
||||
<form method="post" action="{{url()}}" id="myform" name="myform">
|
||||
|
||||
<div class="wrapper-sm b-t">
|
||||
<table class="table table-bordered table-hover m-b-none b-t" id="table-sortable" url="{{url()}}">
|
||||
<thead>
|
||||
<tr>
|
||||
<th align="left">视图名称</th>
|
||||
<th align="center">视图类型</th>
|
||||
<th align="center">客户端</th>
|
||||
<th align="center">权限范围</th>
|
||||
<th align="center">ID</th>
|
||||
<th align="center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@if($rows)
|
||||
@foreach($rows as $row)
|
||||
<tr id="{{$row['id']}}">
|
||||
<td align="left" class="move">{{$row['name']}}</td>
|
||||
<td align="center">{{$row['type']}}</td>
|
||||
<td align="center">{{$row['client']}}</td>
|
||||
<td align="center">{{$row['receive_name']}}</td>
|
||||
<td align="center">{{$row['id']}}</td>
|
||||
<td align="center">
|
||||
@if($row['type'] == 'list')
|
||||
<a class="option" href="{{url('create2',['bill_id'=>$bill_id,'id'=>$row['id']])}}">编辑</a>
|
||||
@else
|
||||
<a class="option" href="{{url('create',['bill_id'=>$bill_id,'id'=>$row['id']])}}">编辑</a>
|
||||
@endif
|
||||
@if($row['system'] == 0)
|
||||
<a class="option" onclick="app.confirm('{{url('delete',['bill_id'=>$bill_id,'id'=>$row['id']])}}','确定要删除吗？');" href="javascript:;">删除</a>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
@endif
|
||||
</tbody>
|
||||
</table>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,102 @@
|
||||
<div class="todo-select b-b">
|
||||
<select id="todo-select" class="form-control input-xs input-inline">
|
||||
<option value="0">全部单据</option>
|
||||
@foreach($selects as $select)
|
||||
<option value="{{$select['id']}}">{{$select['name']}}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="todo-grid-box">
|
||||
<div class="list-jqgrid" id="todo-grid-controller">
|
||||
<div id="todo-grid" class="ag-theme-balham" style="width:100%;height:200px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function ($) {
|
||||
var gridDiv = document.querySelector("#todo-grid");
|
||||
var options = new agGridOptions();
|
||||
options.remoteDataUrl = '{{url()}}';
|
||||
options.remoteParams = {};
|
||||
options.rowMultiSelectWithClick = false;
|
||||
|
||||
function option(params) {
|
||||
if (params.data) {
|
||||
if (params.data.option == 1) {
|
||||
return '审核';
|
||||
} else {
|
||||
return '知会';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
options.components['link'] = function(params) {
|
||||
if (params.node.rowPinned) {
|
||||
return params.value;
|
||||
}
|
||||
var data = params.data;
|
||||
var key = data.url.replace(/\//g,'_');
|
||||
return '<a href="javascript:;" data-toggle="todo-grid" data-key="'+ key +'" data-url="' + data.url + '?id=' + data.data_id + '" data-name="'+ data.name + '" data-action="link">打开</a>';
|
||||
};
|
||||
|
||||
options.columnDefs = [
|
||||
{suppressMenu: true, type:'sn', cellClass:'text-center', headerName: '序号', width: 60},
|
||||
{suppressMenu: true, field: 'sn', cellClass:'text-center', headerName: '单据编号', minWidth: 160},
|
||||
{suppressMenu: true, field: 'name', cellClass:'text-center', headerName: '单据类型', width: 160},
|
||||
{suppressMenu: true, field: 'option', cellClass:'text-center', cellRenderer: option, headerName: '通知类型', width: 160},
|
||||
{suppressMenu: true, field: 'partner_name', cellClass:'text-center', headerName: '往来单位', width: 160},
|
||||
{suppressMenu: true, field: 'run_name', cellClass:'text-center', headerName: '状态', width: 160},
|
||||
{suppressMenu: true, field: 'user_name', cellClass:'text-center', headerName: '转交人', width: 160},
|
||||
{suppressMenu: true, type: 'datetime', cellClass:'text-center', field: 'created_at', headerName: '转交时间', width: 160},
|
||||
//{suppressMenu: true, field: 'id', cellClass:'text-center', headerName: 'ID', width: 80},
|
||||
{suppressMenu: true, field: 'link', cellClass:'text-center', sortable: false, cellRenderer: 'link', headerName: '', width: 60},
|
||||
];
|
||||
|
||||
options.onRowDoubleClicked = function (params) {
|
||||
if (params.node.rowPinned) {
|
||||
return;
|
||||
}
|
||||
var data = params.data;
|
||||
if (data == undefined) {
|
||||
return;
|
||||
}
|
||||
if (data.data_id > 0) {
|
||||
var key = data.url.replace(/\//g,'_');
|
||||
top.addTab(data.url + '?id=' + data.data_id, key, data.name);
|
||||
}
|
||||
};
|
||||
|
||||
new agGrid.Grid(gridDiv, options);
|
||||
|
||||
window.todoGrid = options;
|
||||
|
||||
// 读取数据
|
||||
options.remoteData();
|
||||
|
||||
gdoo.widgets['model_todo_widget'] = options;
|
||||
|
||||
var panel = $('#todo-grid-controller');
|
||||
panel.on('click', '[data-toggle="todo-grid"]', function() {
|
||||
var data = $(this).data();
|
||||
if (data.action == 'link') {
|
||||
top.addTab(data.url, data.key, data.name);
|
||||
}
|
||||
});
|
||||
|
||||
$('#todo-select').on('change', function() {
|
||||
var bill_id = $(this).val();
|
||||
options.remoteData({bill_id: bill_id, page: 1});
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
</script>
|
||||
<style type="text/css">
|
||||
.todo-grid-box {
|
||||
padding: 0 10px 10px 10px;
|
||||
}
|
||||
.todo-select {
|
||||
padding: 5px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user