fe / yohobuywap-node · Commits

Go to a project

Authored by 李靖
Commit d01c357990d6149a39962075d6def79545a3fba7 1 parent bdeab3d0

个人信息页支持修改

Inline Side-by-side
Showing 10 changed files with 152 additions and 12 deletions
... ... @@ -10,7 +10,9 @@
<li class="list-item">
<span class="title">生日</span>
<span class="iconfont">&#xe604;</span>
<input class="s-title" type="date" value="1994-02-22" />
<span class="date-c">
<input class="s-title" type="date" value="1994-02-22" />
</span>
</li>
<li class="list-item">
<span class="title">性别</span>
... ...
... ... @@ -10,7 +10,9 @@
<li class="list-item">
<span class="title">生日</span>
<span class="iconfont">&#xe604;</span>
<input class="s-title" type="date" value="1994-02-22" />
<span class="date-c">
<input class="s-title" type="date" value="1994-02-22" />
</span>
</li>
<li class="list-item">
<span class="title">性别</span>
... ...
... ... @@ -10,7 +10,9 @@
<li class="list-item">
<span class="title">生日</span>
<span class="iconfont">&#xe604;</span>
<input class="s-title" type="date" value="1994-02-22" />
<span class="date-c">
<input class="s-title" type="date" value="1994-02-22" />
</span>
</li>
<li class="list-item">
<span class="title">性别</span>
... ... @@ -31,7 +33,9 @@
<li class="list-item">
<span class="title">宝宝生日</span>
<span class="iconfont">&#xe604;</span>
<input class="s-title" type="date" value="1994-02-22" />
<span class="date-c">
<input class="s-title" type="date" value="1994-02-22" />
</span>
</li>
<li class="list-item">
<span class="title">宝宝性别</span>
... ...
... ... @@ -232,3 +232,16 @@ exports.preferential = (req, res, next) => {
}).catch(next);
};
exports.modify = (req, res, next) => {
let params = {
uid: req.user.uid,
nickName: req.query.nickName,
gender: req.query.gender,
birthday: req.query.birthday
};
indexModel.modify(params).then((result) => {
res.json(result);
}).catch(next);
};
... ...
... ... @@ -244,7 +244,17 @@ const myDetails = (uid) => {
if (uid) {
return api.all([_detailInfo(uid), _getCode(uid)]).then(result => {
if (result[0].data) {
result[0].data.gender = (result[0].data.gender === '1' ? '男' : '女');
let thisGender = result[0].data.gender;
result[0].data.gender = (thisGender === '1' ? '男' : '女');
result[0].data.otherGender = (thisGender === '1' ? '女' : '男');
if (result[0].data.gender === '男') {
result[0].data.genderId = 1;
result[0].data.otherGenderId = 2;
} else {
result[0].data.genderId = 2;
result[0].data.otherGenderId = 1;
}
result[0].data.qrcodeLink = helpers.urlFormat('/home/user/qrcode', {
token: _.get(result[0], 'data.uid', null) ?
crypto.encryption('yoho9646yoho9646', _.get(result, 'data.uid', null) + '') : '',
... ... @@ -499,6 +509,18 @@ const getPreferential = (params) => {
});
};
const modify = (params) => {
return api.get('', {
method: 'app.passport.modifyBase',
uid: params.uid,
nick_name: params.nickName,
gender: params.gender,
birthday: params.birthday
}).then((result) => {
return result;
});
};
module.exports = {
index,
myDetails,
... ... @@ -507,4 +529,5 @@ module.exports = {
getGrade,
getPreferential,
getGradeGrade,
modify
};
... ...
... ... @@ -67,6 +67,7 @@ router.post('/orders/sure', auth, orderController.sure); // 确认收货
router.get('/', homeController.index); // 个人中心首页
router.get('/mydetails', auth, homeController.myDetails); // 个人基本资料页面
router.get('/mydetails/modify', homeController.modify); // 个人基本资料修改
// router.get('/grade', auth, homeController.grade); // 会员等级页
router.get('/privilege', homeController.preferential); // 会员特权列表页
... ...
<div class="personal-details yoho-page">
<ul>
<li><span>头像</span><span><i class="head-portrait user-avatar" data-avatar="{{image head_ico 128 128}}"></i></span></li>
<li><span>昵称</span><span>{{ nickname }}</span></li>
<li><span>性别</span><span>{{ gender }}</span></li>
<li><span>生日</span><span>{{ birthday }}</span></li>
<li><span>昵称</span><span><input type="text" class="modify nick-name" value="{{ nickname }}" /></span></li>
<li><span>性别</span>
<span>
<select class="modify gender">
<option value="{{genderId}}">{{ gender }}</option>
<option value="{{otherGenderId}}">{{ otherGender }}</option>
</select>
</span>
</li>
<li><span>生日</span><span><input type="date" class="modify birthday" value="{{ birthday }}" /></span></li>
<li class="tap-hightlight"><span>会员等级</span>
<span>
<a href="grade" class="grade">
... ...
... ... @@ -22,3 +22,55 @@ myImage.src = avatar;
myImage.onload = function() {
$userAvatar.css('background-image', 'url(' + avatar + ')');
};
import Page from 'yoho-page';
import tip from 'plugin/tip';
class PersonDetail extends Page {
constructor() {
super();
this.selector = {
$modifyInp: $('.modify'),
$nickName: $('.nick-name'),
$gender: $('.gender'),
$birthday: $('.birthday'),
};
this.init();
}
init() {
this.bindEvents();
}
bindEvents() {
this.selector.$modifyInp.on('blur', this.modifyInp.bind(this));
}
modifyInp() {
if (!this.selector.$nickName.val()) {
tip.show('请输入昵称');
return false;
}
this.ajax({
url: '/home/mydetails/modify',
data: {
nickName: this.selector.$nickName.val(),
gender: this.selector.$gender.val(),
birthday: this.selector.$birthday.val()
},
}).then(result => {
if (result && result.code === 200) {
location.href = location.href;
} else {
tip.show(result.message);
}
}).catch(error => {
tip.show(error);
});
}
}
$(() => {
new PersonDetail();
});
... ...
... ... @@ -3,6 +3,14 @@ html {
background-color: #f0f0f0;
}
input::-webkit-clear-button {
display: none;
}
input::-webkit-calendar-picker-indicator {
display: none;
}
::-webkit-input-placeholder {
color: #b0b0b0;
}
... ... @@ -73,6 +81,7 @@ html {
color: #b0b0b0;
border: 0;
background: none;
direction: rtl;
option {
text-align: right;
... ... @@ -83,16 +92,27 @@ html {
}
}
.s-title[type=date] {
margin-right: -25px;
}
.iconfont {
float: right;
font-size: 28px;
color: #b0b0b0;
}
.date-c {
position: relative;
width: 235px;
height: 100%;
overflow: hidden;
white-space: nowrap;
float: right;
input {
position: absolute;
top: 0;
left: 0;
}
}
&:last-child {
border-bottom: 0;
}
... ...
... ... @@ -93,6 +93,22 @@
}
}
.modify {
width: auto;
border: 0;
background: none;
color: #b0b0b0;
text-align: right;
}
select {
direction: rtl;
}
.modify.nick-name {
width: 100%;
}
.tip {
background: url("/home/index/xwf.png");
background-size: 100%;
... ...