You've already forked qlg.tsgz.moe
Init Repo
This commit is contained in:
root
224
hyhproject/home2/view/default/users/user.js
Executable file
224
hyhproject/home2/view/default/users/user.js
Executable file
@ -0,0 +1,224 @@
|
||||
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});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
Reference in New Issue
Block a user