224 lines
7.4 KiB
JavaScript
Executable File
224 lines
7.4 KiB
JavaScript
Executable File
var userPic;
|
|
var falg = true;
|
|
$(function () {
|
|
$('#tab').TabPanel({tab:0,callback:function(no){
|
|
if(no==1 && falg){
|
|
uploadUserPhoto();falg = false;
|
|
}
|
|
|
|
}});
|
|
});
|
|
|
|
|
|
// function checkCoords()
|
|
// {
|
|
// //判断是否有裁剪
|
|
// if (parseInt($('#w').val())){
|
|
// var loading = WST.msg('图像处理中，请稍候...', {icon: 16,shade: [0.3, '#999999']});
|
|
// /*获取裁剪数据*/
|
|
// var photoData = {};
|
|
// photoData.x = $('#x').val();
|
|
// photoData.y = $('#y').val();
|
|
// photoData.w = $('#w').val();
|
|
// photoData.h = $('#h').val();
|
|
// photoData.photoSrc = $('#photoSrc').val();
|
|
// $.post(WST.U('Home/users/editUserPhoto'),photoData,function(data, textStatus){
|
|
// if(data.status==1)
|
|
// {
|
|
// layer.close(loading);
|
|
// //将上传的图片路径赋给全局变量
|
|
// userPic = data.data;
|
|
// $('#userPhotoPreview').html('<img id="userPhoto" class="ipt" src="'+WST.conf.ROOT+'/'+userPic+'?='+Math.random()+'" height="150" />');
|
|
// $('#userPhotoPreview1').html('<img id="userPhoto1" class="ipt" src="'+WST.conf.ROOT+'/'+userPic+'?='+Math.random()+'" height="150" />');
|
|
// $('#userPhotoCut').hide();
|
|
// $('#userPhoto').show();
|
|
// }else{
|
|
// WST.msg(data.msg,{icon:2});
|
|
// return false;
|
|
// }
|
|
// });
|
|
// return true;
|
|
// }
|
|
// WST.msg('请对图片裁剪后再进行提交',{icon:2});
|
|
// return false;
|
|
// }
|
|
|
|
/**
|
|
* [checkCoords 修改为上传oss的变化] mark 20180612
|
|
* @return {[type]} [description]
|
|
*/
|
|
function checkCoords()
|
|
{
|
|
//判断是否有裁剪
|
|
if (parseInt($('#w').val())){
|
|
var loading = WST.msg('图像处理中，请稍候...', {icon: 16,shade: [0.3, '#999999']});
|
|
/*获取裁剪数据*/
|
|
var photoData = {};
|
|
photoData.x = $('#x').val();
|
|
photoData.y = $('#y').val();
|
|
photoData.w = $('#w').val();
|
|
photoData.h = $('#h').val();
|
|
photoData.photoSrc = $('#photoSrc').val();
|
|
$.post(WST.U('Home/users/editUserPhoto'),photoData,function(data, textStatus){
|
|
if(data.status==1)
|
|
{
|
|
layer.close(loading);
|
|
//将上传的图片路径赋给全局变量
|
|
userPic = data.data;
|
|
$('#userPhotoPreview').html('<img id="userPhoto" class="ipt" src="'+WST.conf.IMGURL+'/'+userPic+'" height="150" />');
|
|
$('#userPhotoPreview1').html('<img id="userPhoto1" class="ipt" src="'+WST.conf.IMGURL+'/'+userPic+'" height="150" />');
|
|
$('#userPhotoCut').hide();
|
|
$('#userPhoto').show();
|
|
}else{
|
|
WST.msg(data.msg,{icon:2});
|
|
return false;
|
|
}
|
|
});
|
|
return true;
|
|
}
|
|
WST.msg('请对图片裁剪后再进行提交',{icon:2});
|
|
return false;
|
|
}
|
|
|
|
function uploadUserPhoto()
|
|
{
|
|
WST.upload({
|
|
pick:'#userPhotoPicker',
|
|
formData: {dir:'users',isCut:1},
|
|
accept: {extensions: 'gif,jpg,jpeg,png',mimeTypes: 'image/jpg,image/jpeg,image/png,image/gif'},
|
|
callback:function(f){
|
|
var json = WST.toJson(f);
|
|
if(json.status==1){
|
|
/*上传成功*/
|
|
$('#userPhotoCut').show();
|
|
$('#userPhoto').hide();
|
|
|
|
// var uploadPhotoSrc = WST.conf.ROOT+"/"+json.savePath+json.thumb+'?='+Math.random();
|
|
// 修改为oss地址 mark 20180612 by zl
|
|
var uploadPhotoSrc = WST.conf.IMGURL+"/"+json.savePath+json.thumb;
|
|
|
|
|
|
var cutCode = '<img src="'+uploadPhotoSrc+'" id="target" alt="" style="max-width:606;height:auto;" />';
|
|
cutCode += '<div id="preview-pane">';
|
|
cutCode += '<div><p align="center">裁剪预览</p>';
|
|
cutCode += '<div class="cut-help"><h4>操作帮助</h4>'
|
|
cutCode += '<p>请在裁剪区域放大缩小及移动选取框，选择要裁剪的范围，裁切宽高比例固定；裁切后的效果为右侧预览图所显示；保存提交后生效。</p></div></div>'
|
|
cutCode += '<div class="preview-container"><img src="'+uploadPhotoSrc+'" class="jcrop-preview" alt="Preview" /></div></div>';
|
|
$('#userPhotoCutBox>p').html(cutCode);
|
|
$('#photoSrc').val(json.savePath+json.thumb);
|
|
$('#userPic').val(json.savePath+json.thumb);
|
|
//初始化jcrop
|
|
jcropInit();
|
|
$('#uploadMsg').empty().hide();
|
|
|
|
}else{
|
|
WST.msg(json.msg,{icon:2});
|
|
}
|
|
},
|
|
progress:function(rate){
|
|
$('#uploadMsg').show().html('已上传'+rate+"%");
|
|
}
|
|
});
|
|
}
|
|
|
|
var jcrop_api;
|
|
function jcropInit(){
|
|
var boundx,
|
|
boundy,
|
|
|
|
$preview = $('#preview-pane'),
|
|
$pcnt = $('#preview-pane .preview-container'),
|
|
$pimg = $('#preview-pane .preview-container img'),
|
|
|
|
xsize = $pcnt.width(),
|
|
ysize = $pcnt.height();
|
|
|
|
$('#target').Jcrop({
|
|
onChange: updatePreview,
|
|
onSelect: updatePreview,
|
|
aspectRatio: 1,
|
|
},function(){
|
|
// Use the API to get the real image size
|
|
var bounds = this.getBounds();
|
|
boundx = bounds[0];
|
|
boundy = bounds[1];
|
|
//设置宽度以使文字居中
|
|
$('#img-src').css('width',boundx+'px');
|
|
|
|
// Store the API in the jcrop_api variable
|
|
jcrop_api = this;
|
|
jcrop_api.setSelect([0,0,150,150]);
|
|
|
|
// Move the preview into the jcrop container for css positioning
|
|
$preview.appendTo(jcrop_api.ui.holder);
|
|
});
|
|
|
|
function updatePreview(c)
|
|
{
|
|
if (parseInt(c.w) > 0)
|
|
{
|
|
var rx = xsize / c.w;
|
|
var ry = ysize / c.h;
|
|
|
|
$pimg.css({
|
|
width: Math.round(rx * boundx) + 'px',
|
|
height: Math.round(ry * boundy) + 'px',
|
|
marginLeft: '-' + Math.round(rx * c.x) + 'px',
|
|
marginTop: '-' + Math.round(ry * c.y) + 'px'
|
|
});
|
|
}
|
|
//设置裁剪的图片数据
|
|
$('#x').val(c.x);
|
|
$('#y').val(c.y);
|
|
$('#w').val(c.w);
|
|
$('#h').val(c.h);
|
|
};
|
|
}
|
|
|
|
|
|
$(function(){
|
|
/*日期插件*/
|
|
laydate({
|
|
elem: '#brithday', //需显示日期的元素选择器
|
|
event: 'click', //触发事件
|
|
format: 'YYYY-MM-DD', //日期格式
|
|
istime: false, //是否开启时间选择
|
|
isclear: true, //是否显示清空
|
|
istoday: true, //是否显示今天
|
|
issure: true, //是否显示确认
|
|
festival: true, //是否显示节日
|
|
min: '1900-01-01', //最小日期
|
|
max: '2099-12-31', //最大日期
|
|
fixed: false, //是否固定在可视区域
|
|
zIndex: 99999999 //css z-index
|
|
});
|
|
|
|
/* 表单验证 */
|
|
$('#userEditForm').validator({
|
|
fields: {
|
|
userName: {rule:"required",msg:{required:"请输入昵称"},tip:"请输入昵称"},
|
|
userSex: {rule:"checked;",msg:{checked:"至少选择一项"},tip:"请选择您的性别"}
|
|
},
|
|
valid: function(form){
|
|
var params = WST.getParams('.ipt');
|
|
if(!userPic){
|
|
userPic = $('#userPic').val();
|
|
}
|
|
//接收上传的头像路径
|
|
params.userPhoto = userPic;
|
|
var loading = WST.msg('正在提交数据，请稍后...', {icon: 16,time:60000});
|
|
$.post(WST.U('Home/Users/toEdit'),params,function(data,textStatus){
|
|
layer.close(loading);
|
|
var json = WST.toJson(data);
|
|
if(json.status=='1'){
|
|
WST.msg("操作成功",{icon:1});
|
|
return;
|
|
}else{
|
|
WST.msg(json.msg,{icon:2});
|
|
}
|
|
});
|
|
},
|
|
|
|
});
|
|
|
|
}); |