用户头像

This commit is contained in:
devil_gong 2018-10-16 14:49:05 +08:00
parent 07d6be704a
commit e0fcaddb8b
15 changed files with 227 additions and 136 deletions

View File

@ -310,6 +310,7 @@ return array(
'common_linkage_province_format' => '请选择省份',
'common_linkage_city_format' => '请选择城市',
'common_linkage_county_format' => '请选择区/县',
'common_avatar_upload_title' => '头像上传',
// 性别
'common_gender_list' => array(

View File

@ -303,52 +303,5 @@ class CommonController extends Controller
$verify->Entry();
}
/**
* [UserLoginRecord 用户登录记录]
* @author Devil
* @blog http://gong.gg/
* @version 0.0.1
* @datetime 2017-03-09T11:37:43+0800
* @param [int] $user_id [用户id]
* @return [boolean] [记录成功true, 失败false]
*/
protected function UserLoginRecord($user_id = 0)
{
if(!empty($user_id))
{
$user = M('User')->field('*')->find($user_id);
if(!empty($user))
{
// 基础数据处理
$user['add_time_text'] = date('Y-m-d H:i:s', $user['add_time']);
$user['upd_time_text'] = date('Y-m-d H:i:s', $user['upd_time']);
$user['gender_text'] = L('common_gender_list')[$user['gender']]['name'];
$user['birthday_text'] = empty($user['birthday']) ? '' : date('Y-m-d', $user['birthday']);
$user['mobile_security']= empty($user['mobile']) ? '' : substr($user['mobile'], 0, 3).'***'.substr($user['mobile'], -3);
$user['email_security'] = empty($user['email']) ? '' : substr($user['email'], 0, 3).'***'.substr($user['email'], -3);
// 显示名称,根据规则优先展示
$user['user_name_view'] = $user['username'];
if(empty($user['user_name_view']))
{
$user['user_name_view'] = $user['nickname'];
}
if(empty($user['user_name_view']))
{
$user['user_name_view'] = $user['mobile_security'];
}
if(empty($user['user_name_view']))
{
$user['user_name_view'] = $user['email_security'];
}
// 存储session
$_SESSION['user'] = $user;
return !empty($_SESSION['user']);
}
}
return false;
}
}
?>

View File

@ -2,6 +2,8 @@
namespace Home\Controller;
use Service\UserService;
/**
* 个人资料
* @author Devil
@ -90,7 +92,7 @@ class PersonalController extends CommonController
if($m->where(array('id'=>$this->user['id']))->save())
{
// 更新用户session数据
$this->UserLoginRecord($this->user['id']);
UserService::UserLoginRecord($this->user['id']);
$this->ajaxReturn(L('common_operation_edit_success'));
} else {

View File

@ -2,6 +2,8 @@
namespace Home\Controller;
use Service\UserService;
/**
* 安全
* @author Devil
@ -395,7 +397,7 @@ class SafetyController extends CommonController
if(M('User')->where(array('id'=>$this->user['id']))->save($data) !== false)
{
// 更新用户session数据
$this->UserLoginRecord($this->user['id']);
UserService::UserLoginRecord($this->user['id']);
// 校验成功标记
unset($_SESSION['safety_'.$type]);

View File

@ -4,6 +4,7 @@ namespace Home\Controller;
use Service\OrderService;
use Service\GoodsService;
use Service\UserService;
/**
* 用户
@ -297,7 +298,7 @@ class UserController extends CommonController
// 清除验证码
$obj->Remove();
if($this->UserLoginRecord($user_id))
if(UserService::UserLoginRecord($user_id))
{
$this->ajaxReturn(L('common_reg_success'));
}
@ -374,7 +375,7 @@ class UserController extends CommonController
if(M('User')->where(array('id'=>$user['id']))->save($data) !== false)
{
// 登录记录
if($this->UserLoginRecord($user['id']))
if(UserService::UserLoginRecord($user['id']))
{
$this->ajaxReturn(L('common_login_success'));
}
@ -707,5 +708,17 @@ class UserController extends CommonController
}
redirect(__MY_URL__);
}
public function UserAvatarUpload()
{
// 登录校验
$this->Is_Login();
$params = $_POST;
$params['user'] = $this->user;
$params['img_field'] = 'file';
$ret = UserService::UserAvatarUpload($params);
$this->ajaxReturn($ret['msg'], $ret['code'], $ret['data']);
}
}
?>

View File

@ -16,6 +16,7 @@ return array(
// 个人资料展示列表
'personal_show_list' => array(
'avatar' => array('name' => '头像', 'tips' => '<a href="javascript:;" data-am-modal="{target:\'#user-avatar-popup\'}">修改</a>'),
'nickname' => array('name' => '昵称'),
'gender_text' => array('name' => '性别'),
'birthday_text' => array('name' => '生日'),

View File

@ -33,6 +33,8 @@
<dd>
<if condition="empty($user[$k])">
<span class="items-value-empty">{{:L('common_on_fill_in_the_text')}}</span>
<elseif condition="$k eq 'avatar'" />
<img src="{{$user[$k]}}" width="50" height="50" />
<else />
{{$user[$k]}}
</if>

View File

@ -1,3 +1,4 @@
<!-- 用户中心菜单 -->
<div class="user-sidebar am-offcanvas" id="user-offcanvas">
<div class="am-offcanvas-bar user-offcanvas-bar">
<ul class="am-list user-sidebar-list">
@ -28,42 +29,46 @@
</div>
<a href="javascript:;" class="am-icon-btn am-icon-th-list am-show-sm-only user-menu" data-am-offcanvas="{target: '#user-offcanvas'}"></a>
<!-- 头像修改 -->
<div class="am-popup common-cropper-popup" id="user-head-popup">
<!-- 用户头像修改 -->
<div class="am-popup common-cropper-popup" id="user-avatar-popup">
<div class="am-popup-inner">
<div class="am-popup-hd meila-radius">
<h4 class="am-popup-title">头像上传</h4>
<h4 class="am-popup-title">{{:L('common_avatar_upload_title')}}</h4>
<span data-am-modal-close class="am-close">&times;</span>
</div>
<div class="am-popup-bd">
<form enctype="multipart/form-data" method="post" action="<{$__ROOT__}>index.php?g=Update&c=UserInfo&f=Head">
<input type="hidden" name="MAX_FILE_SIZE" value="<{$max_file_size}>" />
<form class="am-form form-validation-user-avatar view-save" action="{{:U('Home/User/UserAvatarUpload')}}" method="POST" request-type="ajax-reload" enctype="multipart/form-data">
<input type="hidden" name="max_file_size" value="{{:MyC('home_max_limit_image', 2048000)}}" />
<div class="cropper-images-view">
<div class="img-container am-fl user-head-img-container">
<img src="__PUBLIC__/Home/{{$default_theme}}/Images/default-user-avatar.jpg" alt="Picture" />
<div class="img-container am-fl user-avatar-img-container">
<img src="{{$image_host}}/Public/Home/{{$default_theme}}/Images/default-user-avatar.jpg" alt="Picture" />
</div>
<div class="img-preview preview-lg am-fl am-radius user-head-img-preview am-hide-sm-only"></div>
<div class="img-preview preview-md am-fl am-radius user-head-img-preview "></div>
<div class="img-preview preview-sm am-fl am-radius user-head-img-preview "></div>
<input type="hidden" name="img_x" id="user-head-img_x" />
<input type="hidden" name="img_y" id="user-head-img_y" />
<input type="hidden" name="img_width" id="user-head-img_width" />
<input type="hidden" name="img_height" id="user-head-img_height" />
<input type="hidden" name="img_rotate" id="user-head-img_rotate" />
<div class="img-preview preview-lg am-fl am-radius user-avatar-img-preview am-hide-sm-only"></div>
<div class="img-preview preview-md am-fl am-radius user-avatar-img-preview "></div>
<div class="img-preview preview-sm am-fl am-radius user-avatar-img-preview "></div>
<input type="hidden" name="img_x" id="user-avatar-img_x" />
<input type="hidden" name="img_y" id="user-avatar-img_y" />
<input type="hidden" name="img_width" id="user-avatar-img_width" />
<input type="hidden" name="img_height" id="user-avatar-img_height" />
<input type="hidden" name="img_rotate" id="user-avatar-img_rotate" />
</div>
<div class="submit-operation">
<button type="button" class="am-btn am-btn-default am-fl am-icon-search-plus am-icon-sm am-btn-xs am-radius" data-method="zoom" data-option="0.1"></button>
<div class="am-form-group am-form-file am-fl">
<button type="button" class="am-btn am-btn-default am-btn-sm cropper-input-images-submit">
<i class="am-icon-cloud-upload"></i> 选择图片</button>
<input type="file" name="file" multiple accept="image/gif,image/jpeg,image/jpg,image/png" />
<i class="am-icon-cloud-upload"></i> {{:L('common_select_images_text')}}</button>
<input type="file" name="file" multiple accept="image/gif,image/jpeg,image/jpg,image/png" data-validation-message="{{:L('common_select_images_tips')}}" required />
</div>
<button type="button" class="am-btn am-btn-default am-fl am-icon-search-minus am-icon-sm am-btn-xs am-radius" data-method="zoom" data-option="-0.1"></button>
</div>
<button type="submit" class="am-btn am-btn-primary am-btn-sm am-radius head-submit">确认提交</button>
<span class="from-text-tips ml-cr-f00 none">请上传图片</span>
<button type="submit" class="am-btn am-btn-primary am-btn-sm am-radius head-submit btn-loading-example" data-am-loading="{loadingText: '{{:L('common_upload_loading_tips')}}'}">{{:L('common_operation_confirm')}}</button>
</form>
<div class="am-alert am-alert-secondary" data-am-alert>
<p>请在工作区域放大缩小及移动选取框,选择要裁剪的范围,裁切宽高比例固定;</p>
<p>裁切后的效果为右侧预览图所显示;</p>
<p>确认提交后生效。</p>
</div>
</div>
</div>
</div>

View File

@ -30,11 +30,11 @@
<div class="user-base">
<div class="user-base-left">
<div class="user-avatar">
<img src="<if condition="!empty($user['avatar'])">{{$user.avatar}}<else />__PUBLIC__/Home/{{$default_theme}}/Images/default-user-avatar.jpg</if>" />
<img src="{{$user.avatar}}" />
<p class="user-name">{{$user.user_name_view}}</p>
</div>
<div class="items">
<a href="javascript:;" class="am-icon-camera-retro" data-am-modal="{target:'#user-head-popup'}"> 修改头像</a>
<a href="javascript:;" class="am-icon-camera-retro" data-am-modal="{target:'#user-avatar-popup'}"> 修改头像</a>
<a href="{{:U('Home/Personal/SaveInfo')}}" class="am-icon-edit"> 修改资料</a>
<a href="{{:U('Home/UserAddress/Index')}}" class="am-icon-street-view"> 我的地址</a>
</div>

View File

@ -83,7 +83,7 @@ class UserService
$ret = params_checked($params, $p);
if($ret !== true)
{
return DataReturn($ret);
return DataReturn($ret, -1);
}
// 获取用户地址
@ -184,7 +184,7 @@ class UserService
$ret = params_checked($params, $p);
if($ret !== true)
{
return DataReturn($ret);
return DataReturn($ret, -1);
}
$m = M('UserAddress');
@ -269,7 +269,7 @@ class UserService
$ret = params_checked($params, $p);
if($ret !== true)
{
return DataReturn($ret);
return DataReturn($ret, -1);
}
// 软删除数据
@ -310,7 +310,7 @@ class UserService
$ret = params_checked($params, $p);
if($ret !== true)
{
return DataReturn($ret);
return DataReturn($ret, -1);
}
// 模型
@ -334,5 +334,153 @@ class UserService
}
}
/**
* [UserLoginRecord 用户登录记录]
* @author Devil
* @blog http://gong.gg/
* @version 0.0.1
* @datetime 2017-03-09T11:37:43+0800
* @param [int] $user_id [用户id]
* @return [boolean] [记录成功true, 失败false]
*/
public static function UserLoginRecord($user_id = 0)
{
if(!empty($user_id))
{
$user = M('User')->field('*')->find($user_id);
if(!empty($user))
{
// 基础数据处理
$user['add_time_text'] = date('Y-m-d H:i:s', $user['add_time']);
$user['upd_time_text'] = date('Y-m-d H:i:s', $user['upd_time']);
$user['gender_text'] = L('common_gender_list')[$user['gender']]['name'];
$user['birthday_text'] = empty($user['birthday']) ? '' : date('Y-m-d', $user['birthday']);
$user['mobile_security']= empty($user['mobile']) ? '' : substr($user['mobile'], 0, 3).'***'.substr($user['mobile'], -3);
$user['email_security'] = empty($user['email']) ? '' : substr($user['email'], 0, 3).'***'.substr($user['email'], -3);
// 显示名称,根据规则优先展示
$user['user_name_view'] = $user['username'];
if(empty($user['user_name_view']))
{
$user['user_name_view'] = $user['nickname'];
}
if(empty($user['user_name_view']))
{
$user['user_name_view'] = $user['mobile_security'];
}
if(empty($user['user_name_view']))
{
$user['user_name_view'] = $user['email_security'];
}
// 头像
if(!empty($user['avatar']))
{
if(substr($user['avatar'], 0, 4) != 'http')
{
$user['avatar'] = C('IMAGE_HOST').$user['avatar'];
}
} else {
$user['avatar'] = C('IMAGE_HOST').'/Public/Home/'.C('DEFAULT_THEME').'/Images/default-user-avatar.jpg';
}
// 存储session
$_SESSION['user'] = $user;
return !empty($_SESSION['user']);
}
}
return false;
}
/**
* 用户头像更新
* @author Devil
* @blog http://gong.gg/
* @version 1.0.0
* @date 2018-10-16
* @desc description
* @param [array] $params [输入参数]
*/
public function UserAvatarUpload($params = [])
{
// 请求参数
$p = [
[
'checked_type' => 'empty',
'key_name' => 'img_width',
'error_msg' => '图片宽度不能为空',
],
[
'checked_type' => 'empty',
'key_name' => 'img_height',
'error_msg' => '图片高度不能为空',
],
[
'checked_type' => 'isset',
'key_name' => 'img_x',
'error_msg' => '图片裁剪x坐标有误',
],
[
'checked_type' => 'isset',
'key_name' => 'img_y',
'error_msg' => '图片裁剪y坐标有误',
],
[
'checked_type' => 'empty',
'key_name' => 'img_field',
'error_msg' => '图片name字段值不能为空',
],
[
'checked_type' => 'empty',
'key_name' => 'user',
'error_msg' => '用户信息有误',
],
];
$ret = params_checked($params, $p);
if($ret !== true)
{
return DataReturn($ret, -1);
}
// 开始处理图片存储
// 定义图片目录
$root_path = ROOT_PATH;
$img_path = 'Public'.DS.'Upload'.DS.'user_avatar'.DS;
$date = DS.date('Y').DS.date('m').DS.date('d').DS;
// 图像类库
$images_obj = \Library\Images::Instance(['is_new_name'=>false]);
// 文件上传校验
$error = FileUploadError($params['img_field']);
if($error !== true)
{
return DataReturn($error, -2);
}
$original = $images_obj->GetCompressCut($_FILES[$params['img_field']], $root_path.$img_path.'original'.$date, 800, 800, $params['img_x'], $params['img_y'], $params['img_width'], $params['img_height']);
if(!empty($original))
{
$compr = $images_obj->GetBinaryCompress($root_path.$img_path.'original'.$date.$original, $root_path.$img_path.'compr'.$date, 200, 200);
$small = $images_obj->GetBinaryCompress($root_path.$img_path.'original'.$date.$original, $root_path.$img_path.'small'.$date, 50, 50);
}
if(empty($compr) || empty($small))
{
return DataReturn('图片有误,请换一张', -3);
}
// 更新用户头像
$data = [
'avatar' => DS.$img_path.'compr'.$date.$compr,
'upd_time' => time(),
];
if(M('User')->where(['id'=>$params['user']['id']])->save($data))
{
self::UserLoginRecord($params['user']['id']);
return DataReturn('上传成功', 0);
}
return DataReturn('上传失败', -100);
}
}
?>

View File

@ -707,6 +707,7 @@ button { outline: none !important;}
.common-cropper-popup .img-preview { margin-left:20px; border: 1px solid #eee; background-color: #f9f9f9; }
.common-cropper-popup .cropper-container, .cropper-input-images-submit { border-radius:2px; }
.common-cropper-popup .am-form-file input[type="file"] { margin-top: 0; }
.common-cropper-popup .am-form-group { width: auto; }
@media only screen and (max-width:641px){
.common-cropper-popup .img-preview { margin-left:10px; }
.common-cropper-popup .preview-md,

View File

@ -43,33 +43,6 @@ $(function()
}
}
//鼠标悬停信息
$("#wrap .item").mouseenter(function(){
$(this).children(".mp_tooltip").animate({left:-92,queue:true});
$(this).children(".mp_tooltip").css("visibility","visible");
$(this).children(".ibar_login_box").css("display","block");
});
$("#wrap .item").mouseleave(function(){
$(this).children(".mp_tooltip").css("visibility","hidden");
$(this).children(".mp_tooltip").animate({left:-121,queue:true});
$(this).children(".ibar_login_box").css("display","none");
});
$(".quick_toggle li").mouseover(function(){
$(this).children(".mp_qrcode").show();
$(this).children(".mp_tooltip").animate({left:-92,queue:true});
$(this).children(".mp_tooltip").css("visibility","visible");
});
$(".quick_toggle li").mouseleave(function(){
$(this).children(".mp_qrcode").hide();
$(this).children(".mp_tooltip").css("visibility","hidden");
$(this).children(".mp_tooltip").animate({left:-121,queue:true});
});
$(".return_top").click(function(){
ds.scrollTo(0, 0);
hideReturnTop();
});
// 商品分类子级内容显示/隐藏
$(".category-content li").hover(function() {
$(".category-content .category-list li.first .menu-in").css("display", "none");
@ -152,14 +125,15 @@ $(function()
});
var $image = $('.user-head-img-container > img'),
$dataX = $('#user-head-img_x'),
$dataY = $('#user-head-img_y'),
$dataHeight = $('#user-head-img_height'),
$dataWidth = $('#user-head-img_width'),
$dataRotate = $('#user-head-img_rotate'),
/**
* 用户头像上传插件初始化
*/
var $image = $('.user-avatar-img-container > img'),
$dataX = $('#user-avatar-img_x'),
$dataY = $('#user-avatar-img_y'),
$dataHeight = $('#user-avatar-img_height'),
$dataWidth = $('#user-avatar-img_width'),
$dataRotate = $('#user-avatar-img_rotate'),
options = {
// strict: false,
// responsive: false,
@ -196,7 +170,7 @@ $(function()
// zoomout: null,
aspectRatio: 1 / 1,
preview: '.user-head-img-preview',
preview: '.user-avatar-img-preview',
crop: function (data) {
$dataX.val(Math.round(data.x));
$dataY.val(Math.round(data.y));
@ -207,8 +181,8 @@ $(function()
};
$image.on({}).cropper(options);
// Methods
$(document.body).on('click', '[data-method]', function () {
// 缩放操作
$(document.body).on('click', '.common-cropper-popup [data-method]', function () {
var data = $(this).data(),
$target,
result;
@ -221,7 +195,7 @@ $(function()
try {
data.option = JSON.parse($target.val());
} catch (e) {
console.log(e.message);
Prompt(e.message);
}
}
}
@ -236,7 +210,7 @@ $(function()
try {
$target.val(JSON.stringify(result));
} catch (e) {
console.log(e.message);
Prompt(e.message);
}
}
@ -245,12 +219,9 @@ $(function()
// 头像图片上传
var $inputimage = $('.common-cropper-popup input[type="file"]'),
URL = window.URL || window.webkitURL,
blobURL;
var URL = window.URL || window.webkitURL, blobURL;
if (URL) {
$inputimage.change(function () {
$('.common-cropper-popup input[type="file"]').on('change', function () {
var files = this.files,
file;
@ -262,27 +233,19 @@ $(function()
$image.one('built.cropper', function () {
URL.revokeObjectURL(blobURL); // Revoke when load complete
}).cropper('reset', true).cropper('replace', blobURL);
//$inputimage.val('');
} else {
Prompt('Please choose an image file.');
}
}
});
} else {
$inputimage.parent().remove();
}
// 图片裁剪提交确认
$('.common-cropper-popup button[type="submit"]').on('click', function()
{
var v = $inputimage.val();
if(v.length == 0)
{
$(this).parents('.common-cropper-popup').find('.from-text-tips').removeClass('none');
Prompt('请上传图片');
return false;
$image.cropper('reset', true).cropper('replace', $image.attr('src'));
}
});
}
// 头像表单初始化
if($('form.form-validation-user-avatar').length > 0)
{
FromInit('form.form-validation-user-avatar');
}
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 336 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB