创建版本
This commit is contained in:
@@ -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>
|
||||
Reference in New Issue
Block a user