layui.use([ 'laypage', 'layer', 'table', 'element','form','upload'], function(){
var laypage = layui.laypage //分页
,layer = layui.layer //弹层
,table = layui.table //表格
,element = layui.element //元素操作
,form = layui.form
,upload = layui.upload;
var tableIds = 'photoalbumlist';
//第一个实例
table.render({
elem: '#'+tableIds
,url: '/dictionary/photoalbumform' //数据接口
,where:{token:csrfToken}
,method:'post'
,page: true //开启分页
,height:600
,text:'数据加载中'
,id:'tablerReload'
,cols: [[ //表头
// {type: "checkbox", width:50}
{type:'numbers'}
,{field: 'name', title: '相册分类名称', align:'center'}
,{field: 'sort', title: '排序',width:80, edit: 'text',align:'center',sort: true,templet:"#sortBox"}
,{field: 'check_img', title: '选中', width:150,align:'center',templet:function(d){
return '';
}}
,{field: 'uncheck_img', title: '未选中', width:150,align:'center',templet:function(d){
return '';
}}
,{field: 'is_show', title: '是否下架',width:100, align:'center', templet:"#Toexamine",templet:function(d){
if(d.is_show == 2){
return ''
} else {
return ''
}
}}
,{field: 'create_at', title: '添加时间', width:200,align:'center'}
,{field: 'update_at', title: '更新时间', width:200,align:'center'}
,{fixed: 'right',title:'操作', width: 180, align:'center', toolbar: '#operate'}
]]
});
table.reload('tablerReload'); //重新加载
//列表操作
table.on('tool('+tableIds+')', function(obj){
var layEvent = obj.event,
data = obj.data;
if(layEvent === 'edit'){
layer.open({
type: 2,
title: '修改户型',
closeBtn: 1, //不显示关闭按钮
shade: [0],
area: ['600px', '500px'],
anim: 2,
content: ['/dictionary/photoalbumedit?id='+data.id, 'yes'], //iframe的url,no代表不显示滚动条
});
} else if(layEvent === 'del') {
layer.confirm('您确定要删除吗?',{ btn: ['确定', '取消']},function () {
$.post('/dictionary/photoalbumdel',{'id':data.id,type:'del'},function (data) {
if(data.code == 200)
{
layer.msg(data.msg);
table.reload('tablerReload');
} else if(data.code == 300 ) {
layer.msg(data.msg);
}
})
})
}
});
/* 列表操作 edit 修改后执行 */
table.on('edit('+tableIds+')', function(obj){
var data = obj.data;
if(obj.field=="sort"){
$.post('/dictionary/photoalbumdel',{id:data.id,sort:data.sort,type:'sort'},function (data) {
if(data.code == 200)
{
layer.msg(data.msg);
} else if(data.code == 300 ) {
layer.msg(data.msg);
}
})
}
})
//显示或隐藏
form.on('switch(switchTest)', function(data){
var state = '';
if(data.elem.name == 1){
state = 2;
}else if(data.elem.name == 2){
state = 1;
}
layer.confirm('确定要修改此操作吗?',{btn: ['确定', '取消']},function () {
$.post('/dictionary/photoalbumdel',{id:data.value,type:'is_show',is_show:state},function (data) {
if(data.data != null){
layer.msg(data.msg);
return false;
}
layer.msg(data.msg);
table.reload('tablerReload');
})
},function (aa) {
table.reload('tablerReload');
})
});
var $ = layui.$, active = {
addData: function(){ //获取选中数据
layer.open({
type: 2,
title: '添加相册分类',
closeBtn: 1, //不显示关闭按钮
shade: [0],
area: ['600px', '500px'],
anim: 2,
content: ['/dictionary/photoalbumadd', 'yes'], //iframe的url,no代表不显示滚动条
});
// var checkStatus = table.checkStatus('idTest')
// ,data = checkStatus.data;
// layer.alert(JSON.stringify(data));
}
};
$('.demoTable .layui-btn').on('click', function(){
var type = $(this).data('type');
active[type] ? active[type].call(this) : '';
});
// //修改
// form.on('submit(editphotoalbum)', function(data){
// $.post('/dictionary/photoalbumeditform',{'data':data.field,'token':csrfToken},function (data) {
// if(data.code == 200)
// {
// layer.msg(data.msg);
// parent.layui.table.reload('tablerReload');
// TableClose();
// // parent.layui.table.reload(tableIds);
// } else if(data.code == 300 ) {
// layer.msg(data.msg);
// }
// })
// return false;
// });
// //添加
// form.on('submit(addphotoalbum)', function(data){
// $.post('/dictionary/photoalbumaddform',{'data':data.field,'token':csrfToken},function (data) {
// if(data.code == 200)
// {
// layer.msg(data.msg);
// // parent.layui.table.reload(tableIds);
// parent.layui.table.reload('tablerReload');
// TableClose();
// } else if(data.code == 300 ) {
// layer.msg(data.msg);
// }
// })
// return false;
// });
//添加图片上传
upload.render({
elem: '#test1'
,url: '/house/createimg'
,data:{token:csrfToken}
,field:'check_img'
,size:1000 //限制上传图片的大小,单位为KB
,exts: 'png|jpg|jpeg' //只允许上传压缩文件
,auto:false
,bindAction:'#addcity'
,choose: function(obj){
obj.preview(function(index, file, result){
$('#demo1').attr('src', result); //图片链接(base64)
});
}
});
//添加图片上传
upload.render({
elem: '#test2'
,url: '/house/createimg'
,data:{token:csrfToken}
,field:'uncheck_img'
,size:1000 //限制上传图片的大小,单位为KB
,exts: 'png|jpg|jpeg' //只允许上传压缩文件
,auto:false
,bindAction:'#addcity'
,choose: function(obj){
obj.preview(function(index, file, result){
$('#demo2').attr('src', result); //图片链接(base64)
});
}
});
// 点击放大图片
$('.layui_magnify').on('click', function(){
var _src = $(this).attr('src');
layui.layer.open({
type: 1,
title: false, //是否显示标题
area: ['60%', '80%'],
shade: 0.6, //透明度
closeBtn: 1, //按钮 1有,0无
shadeClose: true,
content: '',
});
});
//添加
form.on('submit(addphotoalbum)', function(data){
var index = layer.msg('数据提交中,请稍候',{icon: 16,time:false,shade:0.8}); //数据提交提示
var formData = new FormData($('#add_photo')[0]);
//layer.msg(data.msg);
$.ajax({
cache : true,
type : "post",
url : '/dictionary/photoalbumaddform',
data : formData, // 你的formid
// async : false, //async 默认为true异步,修改为false为同步
contentType: false, //jax 中 contentType 设置为 false 是为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件
processData: false, //当设置为true的时候,jquery ajax 提交的时候不会序列化 data,而是直接使用data
// error : function(request) {
// layer.close(index); //关闭数据提交信息
// layer.alert("网络超时");
// },
success : function(data) {
if (data.code == 200) {
layer.msg(data.msg);
parent.layui.table.reload('tablerReload');
TableClose();
} else if(data.code == 300){
layer.msg(data.msg);
layer.msg(ReturnInfo(data.data),{icon:5});
}
}
});
return false;
});
//修改
form.on('submit(editphotoalbum)', function(data){
var index = layer.msg('数据提交中,请稍候',{icon: 16,time:false,shade:0.8}); //数据提交提示
var formData = new FormData($('#photo_form')[0]);
$.ajax({
cache : true,
type : "post",
url : '/dictionary/photoalbumeditform',
data : formData, // 你的formid
// async : false, //async 默认为true异步,修改为false为同步
contentType: false, //jax 中 contentType 设置为 false 是为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件
processData: false, //当设置为true的时候,jquery ajax 提交的时候不会序列化 data,而是直接使用data
error : function(request) {
layer.close(index); //关闭数据提交信息
layer.alert("网络超时");
},
success : function(data) {
if (data.code == 200) {
layer.msg(data.msg);
parent.layui.table.reload('tablerReload');
TableClose();
} else if(data.code == 300){
layer.msg(data.msg);
layer.msg(ReturnInfo(data.data));
}
}
});
return false;
});
});