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 @@ @@ -10,7 +10,9 @@
10 <li class="list-item"> 10 <li class="list-item">
11 <span class="title">生日</span> 11 <span class="title">生日</span>
12 <span class="iconfont">&#xe604;</span> 12 <span class="iconfont">&#xe604;</span>
13 - <input class="s-title" type="date" value="1994-02-22" /> 13 + <span class="date-c">
  14 + <input class="s-title" type="date" value="1994-02-22" />
  15 + </span>
14 </li> 16 </li>
15 <li class="list-item"> 17 <li class="list-item">
16 <span class="title">性别</span> 18 <span class="title">性别</span>
@@ -10,7 +10,9 @@ @@ -10,7 +10,9 @@
10 <li class="list-item"> 10 <li class="list-item">
11 <span class="title">生日</span> 11 <span class="title">生日</span>
12 <span class="iconfont">&#xe604;</span> 12 <span class="iconfont">&#xe604;</span>
13 - <input class="s-title" type="date" value="1994-02-22" /> 13 + <span class="date-c">
  14 + <input class="s-title" type="date" value="1994-02-22" />
  15 + </span>
14 </li> 16 </li>
15 <li class="list-item"> 17 <li class="list-item">
16 <span class="title">性别</span> 18 <span class="title">性别</span>
@@ -10,7 +10,9 @@ @@ -10,7 +10,9 @@
10 <li class="list-item"> 10 <li class="list-item">
11 <span class="title">生日</span> 11 <span class="title">生日</span>
12 <span class="iconfont">&#xe604;</span> 12 <span class="iconfont">&#xe604;</span>
13 - <input class="s-title" type="date" value="1994-02-22" /> 13 + <span class="date-c">
  14 + <input class="s-title" type="date" value="1994-02-22" />
  15 + </span>
14 </li> 16 </li>
15 <li class="list-item"> 17 <li class="list-item">
16 <span class="title">性别</span> 18 <span class="title">性别</span>
@@ -31,7 +33,9 @@ @@ -31,7 +33,9 @@
31 <li class="list-item"> 33 <li class="list-item">
32 <span class="title">宝宝生日</span> 34 <span class="title">宝宝生日</span>
33 <span class="iconfont">&#xe604;</span> 35 <span class="iconfont">&#xe604;</span>
34 - <input class="s-title" type="date" value="1994-02-22" /> 36 + <span class="date-c">
  37 + <input class="s-title" type="date" value="1994-02-22" />
  38 + </span>
35 </li> 39 </li>
36 <li class="list-item"> 40 <li class="list-item">
37 <span class="title">宝宝性别</span> 41 <span class="title">宝宝性别</span>
@@ -232,3 +232,16 @@ exports.preferential = (req, res, next) => { @@ -232,3 +232,16 @@ exports.preferential = (req, res, next) => {
232 }).catch(next); 232 }).catch(next);
233 233
234 }; 234 };
  235 +
  236 +exports.modify = (req, res, next) => {
  237 + let params = {
  238 + uid: req.user.uid,
  239 + nickName: req.query.nickName,
  240 + gender: req.query.gender,
  241 + birthday: req.query.birthday
  242 + };
  243 +
  244 + indexModel.modify(params).then((result) => {
  245 + res.json(result);
  246 + }).catch(next);
  247 +};
@@ -244,7 +244,17 @@ const myDetails = (uid) => { @@ -244,7 +244,17 @@ const myDetails = (uid) => {
244 if (uid) { 244 if (uid) {
245 return api.all([_detailInfo(uid), _getCode(uid)]).then(result => { 245 return api.all([_detailInfo(uid), _getCode(uid)]).then(result => {
246 if (result[0].data) { 246 if (result[0].data) {
247 - result[0].data.gender = (result[0].data.gender === '1' ? '男' : '女'); 247 + let thisGender = result[0].data.gender;
  248 +
  249 + result[0].data.gender = (thisGender === '1' ? '男' : '女');
  250 + result[0].data.otherGender = (thisGender === '1' ? '女' : '男');
  251 + if (result[0].data.gender === '男') {
  252 + result[0].data.genderId = 1;
  253 + result[0].data.otherGenderId = 2;
  254 + } else {
  255 + result[0].data.genderId = 2;
  256 + result[0].data.otherGenderId = 1;
  257 + }
248 result[0].data.qrcodeLink = helpers.urlFormat('/home/user/qrcode', { 258 result[0].data.qrcodeLink = helpers.urlFormat('/home/user/qrcode', {
249 token: _.get(result[0], 'data.uid', null) ? 259 token: _.get(result[0], 'data.uid', null) ?
250 crypto.encryption('yoho9646yoho9646', _.get(result, 'data.uid', null) + '') : '', 260 crypto.encryption('yoho9646yoho9646', _.get(result, 'data.uid', null) + '') : '',
@@ -499,6 +509,18 @@ const getPreferential = (params) => { @@ -499,6 +509,18 @@ const getPreferential = (params) => {
499 }); 509 });
500 }; 510 };
501 511
  512 +const modify = (params) => {
  513 + return api.get('', {
  514 + method: 'app.passport.modifyBase',
  515 + uid: params.uid,
  516 + nick_name: params.nickName,
  517 + gender: params.gender,
  518 + birthday: params.birthday
  519 + }).then((result) => {
  520 + return result;
  521 + });
  522 +};
  523 +
502 module.exports = { 524 module.exports = {
503 index, 525 index,
504 myDetails, 526 myDetails,
@@ -507,4 +529,5 @@ module.exports = { @@ -507,4 +529,5 @@ module.exports = {
507 getGrade, 529 getGrade,
508 getPreferential, 530 getPreferential,
509 getGradeGrade, 531 getGradeGrade,
  532 + modify
510 }; 533 };
@@ -67,6 +67,7 @@ router.post('/orders/sure', auth, orderController.sure); // 确认收货 @@ -67,6 +67,7 @@ router.post('/orders/sure', auth, orderController.sure); // 确认收货
67 67
68 router.get('/', homeController.index); // 个人中心首页 68 router.get('/', homeController.index); // 个人中心首页
69 router.get('/mydetails', auth, homeController.myDetails); // 个人基本资料页面 69 router.get('/mydetails', auth, homeController.myDetails); // 个人基本资料页面
  70 +router.get('/mydetails/modify', homeController.modify); // 个人基本资料修改
70 71
71 // router.get('/grade', auth, homeController.grade); // 会员等级页 72 // router.get('/grade', auth, homeController.grade); // 会员等级页
72 router.get('/privilege', homeController.preferential); // 会员特权列表页 73 router.get('/privilege', homeController.preferential); // 会员特权列表页
1 <div class="personal-details yoho-page"> 1 <div class="personal-details yoho-page">
2 <ul> 2 <ul>
3 <li><span>头像</span><span><i class="head-portrait user-avatar" data-avatar="{{image head_ico 128 128}}"></i></span></li> 3 <li><span>头像</span><span><i class="head-portrait user-avatar" data-avatar="{{image head_ico 128 128}}"></i></span></li>
4 - <li><span>昵称</span><span>{{ nickname }}</span></li>  
5 - <li><span>性别</span><span>{{ gender }}</span></li>  
6 - <li><span>生日</span><span>{{ birthday }}</span></li> 4 + <li><span>昵称</span><span><input type="text" class="modify nick-name" value="{{ nickname }}" /></span></li>
  5 + <li><span>性别</span>
  6 + <span>
  7 + <select class="modify gender">
  8 + <option value="{{genderId}}">{{ gender }}</option>
  9 + <option value="{{otherGenderId}}">{{ otherGender }}</option>
  10 + </select>
  11 + </span>
  12 + </li>
  13 + <li><span>生日</span><span><input type="date" class="modify birthday" value="{{ birthday }}" /></span></li>
7 <li class="tap-hightlight"><span>会员等级</span> 14 <li class="tap-hightlight"><span>会员等级</span>
8 <span> 15 <span>
9 <a href="grade" class="grade"> 16 <a href="grade" class="grade">
@@ -22,3 +22,55 @@ myImage.src = avatar; @@ -22,3 +22,55 @@ myImage.src = avatar;
22 myImage.onload = function() { 22 myImage.onload = function() {
23 $userAvatar.css('background-image', 'url(' + avatar + ')'); 23 $userAvatar.css('background-image', 'url(' + avatar + ')');
24 }; 24 };
  25 +
  26 +import Page from 'yoho-page';
  27 +import tip from 'plugin/tip';
  28 +
  29 +class PersonDetail extends Page {
  30 + constructor() {
  31 + super();
  32 + this.selector = {
  33 + $modifyInp: $('.modify'),
  34 + $nickName: $('.nick-name'),
  35 + $gender: $('.gender'),
  36 + $birthday: $('.birthday'),
  37 + };
  38 +
  39 + this.init();
  40 + }
  41 +
  42 + init() {
  43 + this.bindEvents();
  44 + }
  45 +
  46 + bindEvents() {
  47 + this.selector.$modifyInp.on('blur', this.modifyInp.bind(this));
  48 + }
  49 +
  50 + modifyInp() {
  51 + if (!this.selector.$nickName.val()) {
  52 + tip.show('请输入昵称');
  53 + return false;
  54 + }
  55 + this.ajax({
  56 + url: '/home/mydetails/modify',
  57 + data: {
  58 + nickName: this.selector.$nickName.val(),
  59 + gender: this.selector.$gender.val(),
  60 + birthday: this.selector.$birthday.val()
  61 + },
  62 + }).then(result => {
  63 + if (result && result.code === 200) {
  64 + location.href = location.href;
  65 + } else {
  66 + tip.show(result.message);
  67 + }
  68 + }).catch(error => {
  69 + tip.show(error);
  70 + });
  71 + }
  72 +}
  73 +
  74 +$(() => {
  75 + new PersonDetail();
  76 +});
@@ -3,6 +3,14 @@ html { @@ -3,6 +3,14 @@ html {
3 background-color: #f0f0f0; 3 background-color: #f0f0f0;
4 } 4 }
5 5
  6 +input::-webkit-clear-button {
  7 + display: none;
  8 +}
  9 +
  10 +input::-webkit-calendar-picker-indicator {
  11 + display: none;
  12 +}
  13 +
6 ::-webkit-input-placeholder { 14 ::-webkit-input-placeholder {
7 color: #b0b0b0; 15 color: #b0b0b0;
8 } 16 }
@@ -73,6 +81,7 @@ html { @@ -73,6 +81,7 @@ html {
73 color: #b0b0b0; 81 color: #b0b0b0;
74 border: 0; 82 border: 0;
75 background: none; 83 background: none;
  84 + direction: rtl;
76 85
77 option { 86 option {
78 text-align: right; 87 text-align: right;
@@ -83,16 +92,27 @@ html { @@ -83,16 +92,27 @@ html {
83 } 92 }
84 } 93 }
85 94
86 - .s-title[type=date] {  
87 - margin-right: -25px;  
88 - }  
89 -  
90 .iconfont { 95 .iconfont {
91 float: right; 96 float: right;
92 font-size: 28px; 97 font-size: 28px;
93 color: #b0b0b0; 98 color: #b0b0b0;
94 } 99 }
95 100
  101 + .date-c {
  102 + position: relative;
  103 + width: 235px;
  104 + height: 100%;
  105 + overflow: hidden;
  106 + white-space: nowrap;
  107 + float: right;
  108 +
  109 + input {
  110 + position: absolute;
  111 + top: 0;
  112 + left: 0;
  113 + }
  114 + }
  115 +
96 &:last-child { 116 &:last-child {
97 border-bottom: 0; 117 border-bottom: 0;
98 } 118 }
@@ -93,6 +93,22 @@ @@ -93,6 +93,22 @@
93 } 93 }
94 } 94 }
95 95
  96 + .modify {
  97 + width: auto;
  98 + border: 0;
  99 + background: none;
  100 + color: #b0b0b0;
  101 + text-align: right;
  102 + }
  103 +
  104 + select {
  105 + direction: rtl;
  106 + }
  107 +
  108 + .modify.nick-name {
  109 + width: 100%;
  110 + }
  111 +
96 .tip { 112 .tip {
97 background: url("/home/index/xwf.png"); 113 background: url("/home/index/xwf.png");
98 background-size: 100%; 114 background-size: 100%;