优化后台UI
完善表单上传组件
This commit is contained in:
@@ -1,6 +1,17 @@
|
||||
define(['jquery', 'bootstrap', 'validator'], function ($, undefined, Validator) {
|
||||
var Form = {
|
||||
config: {
|
||||
editor: {
|
||||
"full":['source', 'undo', 'redo', 'code', 'quote', 'cut',
|
||||
'plainpaste', 'wordpaste', 'justifyleft', 'justifycenter', 'justifyright',
|
||||
'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
|
||||
'superscript', 'clearhtml', 'quickformat', 'selectall', '/',
|
||||
'formatblock', 'fontname', 'fontsize', 'forecolor', 'hilitecolor', 'bold',
|
||||
'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', 'image', 'multiimage', 'media', 'insertfile', 'table', 'hr', 'baidumap',
|
||||
'anchor', 'link', 'unlink','fullscreen'],
|
||||
"base":['undo', 'redo', 'quote', 'formatblock', 'fontname', 'fontsize', 'forecolor', 'hilitecolor', 'bold',
|
||||
'italic', 'underline', 'strikethrough', 'lineheight', 'image', 'media', 'table'],
|
||||
},
|
||||
fieldlisttpl: '<dd class="form-inline"><input type="text" name="<%=name%>[<%=index%>][key]" class="form-control" value="<%=row.key%>" size="10" /> <input type="text" name="<%=name%>[<%=index%>][value]" class="form-control" value="<%=row.value%>" /> <span class="btn btn-sm btn-danger btn-remove"><i class="fa fa-times"></i></span> <span class="btn btn-sm btn-primary btn-dragsort"><i class="fa fa-arrows"></i></span></dd>'
|
||||
},
|
||||
events: {
|
||||
@@ -90,8 +101,10 @@ define(['jquery', 'bootstrap', 'validator'], function ($, undefined, Validator)
|
||||
editor: function (form) {
|
||||
//绑定编辑器元素事件
|
||||
if ($(".form-editor", form).size() > 0) {
|
||||
var items = $(".form-editor", form).data('items') || 'full';
|
||||
require(['NKeditor'], function(){
|
||||
KindEditor.create('.form-editor', {
|
||||
items: Form.config.editor[items],
|
||||
uploadJson: "/admin/upload/editor'",
|
||||
fileManagerJson: "/admin/upload/filemanage"
|
||||
})
|
||||
@@ -261,12 +274,45 @@ define(['jquery', 'bootstrap', 'validator'], function ($, undefined, Validator)
|
||||
var name = $(this).siblings('input[type=hidden]').attr('name');
|
||||
layer.open({
|
||||
type: 2,
|
||||
shade: false,
|
||||
area: ['60%', '440px'],
|
||||
title: type == 'image' ? '图片' : '文件', //不显示标题
|
||||
area: ['60%', '410px'],
|
||||
title: false,
|
||||
closeBtn: false,
|
||||
shadeClose: true,
|
||||
content: ['/'+Config.module+'/upload/index?name='+name+'&type='+type+'&limit='+limit, 'no'],
|
||||
});
|
||||
})
|
||||
Form.events.imageDel();
|
||||
Form.events.fileDel();
|
||||
}
|
||||
},
|
||||
imageDel: function(){
|
||||
//绑定图片上传删除按钮
|
||||
if($('.picker-box .img-list .close').size() > 0){
|
||||
$('.picker-box .img-list .close').on('click', function(){
|
||||
var value = $('.picker-box input[type=hidden]').val().split(",");
|
||||
value = value.filter(val => val != $(this).parents('.item').data('id'))
|
||||
$(this).parents('.item').remove();
|
||||
if(value.length > 0){
|
||||
$('.picker-box input[type=hidden]').val(value.join(','));
|
||||
}else{
|
||||
$('.picker-box input[type=hidden]').val('');
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
fileDel: function(){
|
||||
//绑定文件上传删除按钮
|
||||
if($('.picker-box .file-list .close').size() > 0){
|
||||
$('.picker-box .file-list .close').on('click', function(){
|
||||
var value = $('.picker-box input[type=hidden]').val().split(",");
|
||||
value = value.filter(val => val != $(this).parents('.item').data('id'))
|
||||
$(this).parents('.item').remove();
|
||||
if(value.length > 0){
|
||||
$('.picker-box input[type=hidden]').val(value.join(','));
|
||||
}else{
|
||||
$('.picker-box input[type=hidden]').val('');
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
faselect: function (form) {
|
||||
@@ -538,7 +584,17 @@ define(['jquery', 'bootstrap', 'validator'], function ($, undefined, Validator)
|
||||
},
|
||||
custom: {},
|
||||
setFile: function(fileList, param){
|
||||
// console.log(fileList, param);
|
||||
var file = $('#fileList_'+param.name);
|
||||
var field = $('#field_'+param.name);
|
||||
var html = '<div class="item"><div class="thumb"><div class="close"><i class="fa fa-close"></i></div><img src="#" /></div></div>';
|
||||
for(var i = 0; i < 10; i++){
|
||||
file.append(html);
|
||||
}
|
||||
if(param.type == 'image'){
|
||||
Form.events.imageDel();
|
||||
}else if(param.type == 'file'){
|
||||
Form.events.fileDel();
|
||||
}
|
||||
layer.close(layer.index);
|
||||
}
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user