fe / yoho-blk · Commits

Go to a project

Authored by 王水玲
Commit ca42b741fe3502e119c89b7927f22762f3870eb3 1 parent 6b1ec837

vip 标识

Inline Side-by-side
Showing 41 changed files with 829 additions and 27 deletions
/**
* [个人中心]我的VIP
* @author: wsl(shuiling.wang@yoho.cn)
* @date: 2017/03/13
*/
'use strict';
const mcHandler = require('../models/menu-crumb-handler');
const vipModel = require('../models/vip');
const index = (req, res, next) => {
let uid = req.user.uid;
Promise.all([vipModel.vipIndex(uid), mcHandler.getMeThumb()]).then(result => {
const vipData = result[0];
const thumb = result[1];
res.display('index', {
module: 'me',
page: 'vip',
isMe: true,
content: {
nav: mcHandler.getMeCrumb('我的VIP'),
navigation: mcHandler.getSideMenu('我的VIP'),
banner: thumb,
vip: true,
title: '我的VIP',
vipData: vipData
}
});
}).catch(next);
};
module.exports = {
index
};
... ...
... ... @@ -60,6 +60,10 @@ const navigation = [
name: '我的有货币'
},
{
link: url('/me/vip'),
name: '我的VIP'
},
{
link: url('/me/setting'),
name: '个人设置'
},
... ...
/**
* [个人中心]我的VIP
* @author: wsl(shuiling.wang@yoho.cn)
* @date: 2017/03/13
*/
'use strict';
const api = global.yoho.API;
const moment = require('moment');
const _ = require('lodash');
const iconData = [
{
id: 1,
icon: ''
},
{
id: 2,
icon: ''
},
{
id: 3,
icon: ''
},
{
id: 4,
icon: ''
},
{
id: 5,
icon: ''
},
{
id: 6,
icon: ''
},
{
id: 9,
icon: ''
},
{
id: 10,
icon: ''
}
];
const vipIndex = (uid)=>{
return api.get('', {
method: 'app.passport.vip',
uid: uid,
private_key: '0ed29744ed318fd28d2c07985d3ba633'
}).then(vipInfo => {
let data = vipInfo.data, proportion = '0%', hasConsume = false;
let remainDays = Math.ceil(((data.vip_end_time) * 1000 - Date.now()) / 86400000);
let preferences = [];
let isVip = data.current_vip_level > 0 ? true : false;
if (+data.next_need_cost !== 0) {
proportion = data.current_year_cost * 100 / data.next_need_cost;
proportion = proportion > 100 ? 100 : proportion;
hasConsume = proportion > 0;
proportion = proportion + '%';
}
if (data.enjoy_preferential) {
_.forEach(data.enjoy_preferential, item => {
if (!_.find(iconData, {id: item.id})) {
return;
}
preferences.push({
id: item.id,
icon: _.find(iconData, {id: item.id}).icon,
favTxt: item.title,
description: item.description
});
});
}
return {
curTitle: data.next_vip_title ? data.current_vip_title : '金卡会员',
nextTitle: data.next_vip_title ? data.next_vip_title : '白金会员',
nextLevel: data.next_vip_level ? data.next_vip_level : 3,
curLevel: data.current_vip_level,
yearCost: Number(data.current_year_cost).toFixed(2),
totalCost: (+data.current_total_cost).toFixed(2),
list: preferences,
platinum: data.upgrade_need_cost > 0 ? false : true,
nextCost: Number(data.next_need_cost).toFixed(2),
balance: Number(data.upgrade_need_cost).toFixed(2),
proportion: proportion,
hasConsume: hasConsume,
reach: moment(data.vip_reach_time * 1000).format('YYYY.MM.DD'),
valid: moment(data.vip_start_time * 1000).format('YYYY.MM.DD'),
end: moment(data.vip_end_time * 1000).format('YYYY.MM.DD'),
remainDays: remainDays,
doubtLevel: isVip,
commonVip: !isVip
};
});
};
module.exports = {
vipIndex
};
... ...
... ... @@ -21,6 +21,7 @@ const setting = require(`${cRoot}/setting`);
const account = require(`${cRoot}/account`);
const favorite = require(`${cRoot}/favorite`);
const returns = require(`${cRoot}/returns`);
const vip = require(`${cRoot}/vip`);
// 个人中心首页/订单
router.get(['/', '/order'], auth, order.index);
... ... @@ -97,4 +98,7 @@ router.post('/collection/cancel', auth, favorite.cancel);
router.post('/collection/cancel/multi', auth, favorite.cancelMulti);
router.post('/collection/editorial/cancel', auth, favorite.editorialCancel);
// 我的VIP
router.get('/vip', auth, vip.index);
module.exports = router;
... ...
... ... @@ -65,6 +65,11 @@
{{> currency}}
{{/if}}
{{!-- 我的vip --}}
{{#if vip}}
{{> vip}}
{{/if}}
{{!-- 个人设置 --}}
{{#if setting}}
{{> setting}}
... ...
<div class="user-vip">
{{> common/subtitle}}
{{#vipData}}
<div class="my-vip block">
{{#unless commonVip}}
<div class="vip-level">
<span class="level">您的会员级别：</span>
<div class="vip-icon vipimg{{curLevel}}"></div>
</div>
<div class="vip-level">
<span class="level">当前可享优惠：</span>
<div class="favimg">
{{#each list}}
<div class="list">
<i class="iconfont">{{{icon}}}</i>
<span class="fav-font">{{favTxt}}</span>
</div>
{{/each}}
</div>
</div>
{{/unless}}
<div class="vip-level">
<span class="level">年度累计金额：</span>
<div class="year-amount">
<div class="price-account">
<div class="amount">￥{{yearCost}}</div>
<div class="balance">
{{#if platinum}}
<p>您已升至最高等级啦！</p>
{{else}}
<p>还差<span class="price">￥{{balance}}</span>就可以升级为{{nextTitle}}！</p>
{{/if}}
</div>
</div>
<p class="ps">VIP金额累计需订单成功签收满15天且无退换货</p>
<div class="amount-length">
<span class="line"></span>
<span class="line-black" style="width:{{proportion}}; {{#if hasConsume}}display: block;{{/if}}"></span>
<span class="left-r">
<i class="r-icon"></i>
{{curTitle}}
</span>
<span class="right-r">
<i class="r-icon"></i>
{{nextTitle}}
</span>
<span class="price-box">{{nextCost}}</span>
</div>
</div>
</div>
<div class="history">
<div class="level">历史消费总额：
<span class="hisamout">￥{{totalCost}}</span>
</div>
</div>
{{#unless commonVip}}
<div class="valid">
<div class="level">当前有效期：</div>
<div class="cur-time">
<div class="line"></div>
<div class="time-1">
<i class="r-icon"></i>
<span>{{reach}}</span><br>条件达成日期
</div>
<div class="time-2">
<i class="r-icon"></i>
<span>{{valid}}</span><br>生效日期
</div>
<div class="time-3">
<i class="r-icon"></i>
<span>{{end}}</span><br>优惠截止日期
</div>
<div class="line-b"></div>
<div class="date-box">VIP有效期{{remainDays}}天（数字年）</div>
</div>
</div>
{{/unless}}
</div>
{{/vipData}}
</div>
\ No newline at end of file
... ...
... ... @@ -48,7 +48,7 @@ const syncUserSession = (uid, req, res) => {
let name = user.nickname || user.profile_name || user.username;
if (!_.isEmpty(user)) {
let uidCookie = `${name}::${crypto.encryption('', user.uid + '')}::${user.username}::${token}`;
let uidCookie = `${name}::${crypto.encryption('', user.uid + '')}::${user.username}::${user.vip_info.title}::${token}`; // eslint-disable-line
req.session._TOKEN = token;
req.session._LOGIN_UID = uid;
... ...
... ... @@ -26,7 +26,7 @@ const saveRecentGoodInCookies = (oldSkns, res, addSkns) => {
*/
const index = (req, res, next) => {
req.params.channel = req.yoho.channel;
item.getProductItemData(req.params, req.url, req.user.uid).then(result => {
item.getProductItemData(req.params, req.url, req.user.uid, req.user.vip).then(result => {
if (_.isEmpty(result)) {
return next();
}
... ...
... ... @@ -8,6 +8,62 @@
const _ = require('lodash');
const helpers = global.yoho.helpers;
const _vipLevel = (vipTitle) => {
return (function(title) {
if (title === '普通会员') {
return 0;
} else if (title === '银卡会员') {
return 1;
} else if (title === '金卡会员') {
return 2;
} else if (title === '白金会员') {
return 3;
} else {
return 0;
}
}(vipTitle));
};
// vip 价格
const _getVipDataByProductBaseInfo = (data, vipLevel, uid) => {
vipLevel = _vipLevel(vipLevel) || 0;
uid = uid || 0;
if (_.isEmpty(_.get(data, 'vip', []))) {
return null;
}
let isVip = (_v) => _v > 0;
let isLogin = (_u) => _u > 0;
let isNormalUser = () => isLogin(uid) && !isVip(vipLevel);
let isVipUser = () => isLogin(uid) && isVip(vipLevel);
let vipData = {};
vipData.unLogin = isLogin(uid) ? false : helpers.urlFormat('/passport/login');
vipData.normalUser = isNormalUser();
if (isVipUser()) {
vipData.prices = {};
_.some(data.vip, (vip) => {
if (_vipLevel(vip.caption + '会员') === vipLevel) {
vipData.prices = {
price: vip.price,
name: vip.caption,
vipLevel: vipLevel
};
return true;
}
});
}
vipData.vipSchedualUrl = helpers.urlFormat('/home/vip', {
t: _.random(10000, 9999999)
});
return vipData;
};
/**
* 获取原图片路径
* @function _getForceSourceUrl
... ... @@ -315,9 +371,11 @@ const setBrandBanner = (base, brand, shop) => {
* 设置商品基本信息
* @function setProductData
* @param { Object } base 接口返货商品数据
* @param { String } vipLevel vip等级
* @param { String } uid 用户id
* @return { Object } 商品基本信息
*/
const setProductData = base => {
const setProductData = (base, vipLevel, uid) => {
let resData = {
id: base.product_id,
productSkn: base.product_skn,
... ... @@ -493,6 +551,8 @@ const setProductData = base => {
shareDesc: base.phrase
};
resData.vipPrice = _getVipDataByProductBaseInfo(base, vipLevel, uid);
return resData;
};
... ...
... ... @@ -78,9 +78,10 @@ const _getMultiResourceByBaseInfo = (base) => {
* @param { Object } 商品的参数
* @param { String } url 用户ID
* @param { String } uid 用户ID
* @param { String } vipLevel vip等级
* @return { Object } 返回单个商品的基本信息及品牌、材质、尺码、描述、详情等
*/
const getProductItemData = (params, url, uid) => {
const getProductItemData = (params, url, uid, vipLevel) => {
let pid = params[0];
// let gid = params[1];
... ... @@ -112,7 +113,7 @@ const getProductItemData = (params, url, uid) => {
result.mainPath = `/product${url}`;
// 商品基本信息
data.goodInfo = itemFun.setProductData(result);
data.goodInfo = itemFun.setProductData(result, vipLevel, uid);
// BRAND品牌简介
if (result.brand_info) {
... ...
... ... @@ -36,10 +36,31 @@
<p class="brand-name">{{brandName}}</p>
<p class="name">{{name}}</p>
<p class="intro">{{intro}}</p>
<p class="sell-price">¥{{round sellPrice 2}}</p>
<p class="sell-price">
¥{{round sellPrice 2}}
</p>
{{#if marketPrice}}
<p class="market-price">¥{{round marketPrice 2}}</p>
{{/if}}
<p class="desc">
{{# vipPrice}}
<span class="vip-price">
{{#if unLogin}}
<span class="unlogin">
登录后即可查看vip价格
</span>
<a class="login-url" href="{{unLogin}}">立即登录</a>
{{/if}}
{{#if normalUser}}
<span class="vip-price-item">您当前是普通会员，成为VIP享受更多优惠！</span>
{{/if}}
{{# prices}}
<span class="vip-icon vip-level-{{vipLevel}}"> </span>
<em class="cur"> {{price}} </em>
{{/ prices}}
</span>
{{/ vipPrice}}
</p>
<div class="trade-wrapper">
<div class="option-content">
... ...
... ... @@ -9,6 +9,18 @@ var _ = require('lodash');
const api = global.yoho.API;
const isVipPrice = (goods) => {
if (!goods) {
return goods;
} else {
_.forEach(goods, (g) => {
g.isVipPrice = g.sales_price !== g.last_vip_price && g.discount_tag === 'V';
});
return goods;
}
};
/*
* 加入购物车
* @function addToCart
... ... @@ -216,12 +228,16 @@ const filterCartData = (result, uid) => {
// 预售商品
let advancedGoods = [],
selectedAdvanceNum = 0,
lastTotalAdvanceMoney,
totalAdvanceMoney,
advancedCartData;
advancedCartData,
totalAdvanceVip,
totalOrdinaryVip;
// 普通商品
let ordinaryGoods = [],
selectedOrdinaryNum = 0,
lastTotalOrdinaryMoney,
totalOrdinaryMoney,
ordinaryCartData;
... ... @@ -246,7 +262,10 @@ const filterCartData = (result, uid) => {
// 预售商品
if (result.data && result.data.advance_cart_data) {
advancedCartData = result.data.advance_cart_data;
totalAdvanceMoney = advancedCartData.shopping_cart_data.last_order_amount;
lastTotalAdvanceMoney = advancedCartData.shopping_cart_data.last_order_amount;
totalAdvanceMoney = advancedCartData.shopping_cart_data.order_amount;
totalAdvanceVip = _.get(advancedCartData, 'shopping_cart_data.promotion_formula_list[1].promotion_amount', 0);
totalAdvanceVip = totalAdvanceVip ? totalOrdinaryVip.replace('-¥', '') : totalAdvanceVip;
advancedGoods = _.concat(advancedGoods, advancedCartData.goods_list);
invalidGoods = _.concat(invalidGoods, advancedCartData.off_shelves_goods_list);
advancedSoldOutGoods = _.concat(advancedSoldOutGoods, advancedCartData.sold_out_goods_list);
... ... @@ -270,7 +289,10 @@ const filterCartData = (result, uid) => {
// 普通商品
if (result.data && result.data.ordinary_cart_data) {
ordinaryCartData = result.data.ordinary_cart_data;
totalOrdinaryMoney = ordinaryCartData.shopping_cart_data.last_order_amount;
lastTotalOrdinaryMoney = ordinaryCartData.shopping_cart_data.last_order_amount;
totalOrdinaryMoney = ordinaryCartData.shopping_cart_data.order_amount;
totalOrdinaryVip = _.get(ordinaryCartData, 'shopping_cart_data.promotion_formula_list[1].promotion_amount', 0);
totalOrdinaryVip = totalOrdinaryVip ? totalOrdinaryVip.replace('-¥', '') : totalOrdinaryVip;
// 正常商品+库存不足商品
ordinaryGoods = _.concat(ordinaryGoods, ordinaryCartData.goods_list, ordinaryCartData.sold_out_goods_list);
... ... @@ -315,12 +337,14 @@ const filterCartData = (result, uid) => {
return _.merge(resData, {
hasGoods: advancedGoods.length || ordinaryGoods.length || invalidGoods.length,
preSalePros: (advancedSoldOutGoods.length || advancedGoods.length) ?
_.concat(advancedGoods, advancedSoldOutGoods) : [],
commonPros: ordinaryGoods,
invalidPros: invalidGoods,
isVipPrice(_.concat(advancedGoods, advancedSoldOutGoods)) : [],
commonPros: isVipPrice(ordinaryGoods),
invalidPros: isVipPrice(invalidGoods),
selectedNum: selectedAdvanceNum + selectedOrdinaryNum,
checkAll: totalNum === (selectedAdvanceNum + selectedOrdinaryNum),
totalMoney: totalAdvanceMoney + totalOrdinaryMoney,
lastOrderAmount: lastTotalAdvanceMoney + lastTotalOrdinaryMoney,
totalVip: parseFloat(totalAdvanceVip) + parseFloat(totalOrdinaryVip),
orderAmount: totalAdvanceMoney + totalOrdinaryMoney,
freeShippingTip: freeShippingTip,
noStorage
});
... ...
... ... @@ -37,7 +37,10 @@
{{/if}}
</li>
<li class="price-num">
<span class="price sale-price">¥ {{round sales_price 2}}</span>
<span class="price sale-price">
¥ {{round sales_price 2}}
{{#isVipPrice}}<br><i class="vip-tag">（VIP）</i>{{/isVipPrice}}
</span>
{{> cart/stepper }}
</li>
<li class="total-price-action">
... ... @@ -89,7 +92,10 @@
</div>
</li>
<li class="price-num">
<span class="price sale-price">¥ {{round sales_price 2}}</span>
<span class="price sale-price">
¥ {{round sales_price 2}}
{{#isVipPrice}}<br><i class="vip-tag">（VIP）</i>{{/isVipPrice}}
</span>
{{> cart/stepper }}
</li>
<li class="total-price-action">
... ... @@ -135,7 +141,11 @@
</div>
</li>
<li class="price-num">
<span class="price sale-price">¥ {{round sales_price 2}}</span>
<span class="price sale-price">
¥ {{round sales_price 2}}
{{#isVipPrice}}<br><i class="vip-tag">（VIP）</i>{{/isVipPrice}}
</span>
</span>
{{> cart/stepper }}
</li>
<li class="total-price-action">
... ...
... ... @@ -21,13 +21,19 @@
<div class="selected-num">已选<span>{{selectedNum}}</span>件</div>
<div class="checkout-total">
<div class="total-title">商品金额:</div>
<div class="total-money">¥<span> {{round totalMoney 2}}</span></div>
<div class="total-money">¥<span> {{round orderAmount 2}}</span></div>
</div>
{{#if totalVip}}
<div class="checkout-total vip-total">
<div class="total-title">VIP优惠:</div>
<div class="total-money">-¥<span> {{round totalVip 2}}</span></div>
</div>
{{/if}}
</div>
<div class="calculate">
<div class="checkout-total pay-total">
<div class="pay-title">应付金额（不含运费）:</div>
<div class="total-money">¥<span> {{round totalMoney 2}}</span></div>
<div class="total-money">¥<span> {{round lastOrderAmount 2}}</span></div>
</div>
</div>
<div class="checkout">
... ...
... ... @@ -27,15 +27,20 @@ module.exports = {
// service: 'http://192.168.102.205:8080/gateway/',
// search: 'http://192.168.102.216:8080/yohosearch/'
singleApi: 'http://single.yoho.cn/',
api: 'http://api.yoho.yohoops.org/',
service: 'http://service.yoho.yohoops.org/',
search: 'http://search.yohoops.org/yohosearch/'
// singleApi: 'http://single.yoho.cn/',
// api: 'http://api.yoho.yohoops.org/',
// service: 'http://service.yoho.yohoops.org/',
// search: 'http://search.yohoops.org/yohosearch/'
// singleApi: 'http://single.yoho.cn/',
// api: 'http://api-test3.yohops.com:9999/',
// service: 'http://service-test3.yohops.com:9999/',
// search: 'http://search.yohoops.org/yohosearch/'
api: 'http://dev-api.yohops.com:9999/',
service: 'http://dev-service.yohops.com:9999/',
singleApi: 'http://api-test1.yohops.com:9999/',
search: 'http://search.yohoops.org/yohosearch/'
},
useOneapm: false,
useCache: false,
... ...
'use strict';
const _ = require('lodash');
const Fn = require('lodash/fp');
const cookie = global.yoho.cookie;
const cache = global.yoho.cache;
const LoginService = require('../../apps/passport/models/login-service');
... ... @@ -21,6 +22,13 @@ module.exports = () => {
req.user.uid = cookie.getUid(req);
}
if (req.cookies._UID) {
let uidCookie = req.cookies._UID.split('::');
let getVip = Fn.nth(3);
req.user.vip = getVip(uidCookie);
}
// 从 SESSION 中获得 USERNAME
if (req.user.uid) {
req.user.username = req.session._USERNAME;
... ...
No preview for this file type
... ... @@ -2,7 +2,7 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
Created by FontForge 20120731 at Sun Jan 22 11:51:17 2017
Created by FontForge 20120731 at Thu Mar 16 13:58:47 2017
By admin
</metadata>
<defs>
... ... @@ -19,7 +19,7 @@ Created by FontForge 20120731 at Sun Jan 22 11:51:17 2017
bbox="-57 -212 7023 949"
underline-thickness="0"
underline-position="0"
unicode-range="U+0078-E6E8"
unicode-range="U+0078-E701"
/>
<missing-glyph
/>
... ... @@ -337,5 +337,47 @@ t-84.5 -203t-203 -84zM3515.5 896q-94.5 0 -181 -37t-149 -99.5t-99.5 -149t-37 -181
t202.5 -84t84 -203t-84 -203t-202.5 -84zM4216 896h180v-736h-180v736zM4396 95h-180l111 -223h130zM587 896l-190 -331l-190 331h-207l306 -533v-400h180v400l308 533h-207zM2611 549h-360v347h-180v-933h180v406h360v-406h180v933h-180v-347zM5229 471q56 66 56 154
q0 57 -24 112t-65 93q-41 36 -100 51q-56 15 -148 15h-156v-933h226q94 0 158 17q60 19 108 67q81 79 81 193q0 86 -46 152q-35 52 -90 79zM5084 542q-28 -27 -93 -27h-19v212h24q59 0 88 -26q28 -26 28 -79q0 -54 -28 -80zM4972 357h44q100 0 135 -33q36 -32 36 -79
q0 -49 -37 -80q-36 -31 -119 -31h-59v223zM5806 896h-180v-933h441v171h-261v762zM7023 896h-244l-313 -321v321h-180v-933h180v380l3 3l310 -383h240l-422 507z" />
<glyph glyph-name="icon-test1" unicode="&#xe6fa;" horiz-adv-x="1148"
d="M725 324zM694 324q0 -13 9.5 -22t22 -9t21.5 9t9 22t-9 22t-21.5 9t-22 -9t-9.5 -22zM352 -128h-22q-72 4 -137 35.5t-114 86.5q-49 54 -68 120.5t-5 132.5q13 64 56 115.5t108 81.5q24 9 36 -13q9 -24 -13 -36q-53 -25 -87.5 -66t-45.5 -93q-11 -53 5 -106.5t56 -98.5
q56 -64 136 -88.5t154.5 -10.5t128.5 58q39 33 64.5 84t27.5 104q6 102 -72 180q-33 33 -87 54t-161 43q-53 11 -96 39.5t-68 68.5q-49 79 -18 178q12 49 49.5 86.5t90.5 55.5q54 19 111.5 9.5t105.5 -45.5q13 -10 28 -25t33.5 -48.5t23.5 -70.5q11 -92 -58 -181
q-7 -8 -18.5 -9.5t-19.5 6.5q-9 7 -10.5 18.5t6.5 19.5q56 69 48 140q-4 28 -18 52.5t-25 35.5t-21 18q-32 24 -67 32.5t-58 5.5t-43 -11q-39 -13 -67.5 -41t-38.5 -63q-22 -80 13 -136q39 -63 130 -84q109 -22 171 -46t104 -65q95 -95 89 -221q-3 -63 -33 -124.5
t-78 -100.5q-97 -77 -226 -77zM951 284q-92 0 -158 71q-45 50 -46.5 113.5t42.5 110.5q8 8 19 8.5t19 -6.5q9 -9 9.5 -19.5t-7.5 -19.5q-29 -31 -27.5 -73t33.5 -78q29 -32 69 -44.5t78 -5.5t66 30q42 34 45 93q3 50 -36 89q-17 17 -45 28t-84 22q-68 14 -99 65
q-29 50 -11 108q8 28 31 51t53 34q69 23 131 -22q35 -25 47 -65t-7 -91q-4 -11 -14.5 -15t-21.5 0t-15 15t0 22q7 14 7.5 28.5t-3.5 24.5t-10 18.5t-10 12t-7 5.5q-35 25 -80 14q-41 -14 -50 -49q-11 -38 6 -65q20 -32 62 -40q62 -14 97 -27.5t59 -36.5q56 -56 53 -130
q-1 -38 -19 -73.5t-46 -59.5q-53 -43 -130 -43z" />
<glyph glyph-name="icon-test2" unicode="&#xe6fb;" horiz-adv-x="1162"
d="M965 390q-81 0 -138 71t-57 170t57.5 170t137.5 71t137.5 -71.5t57.5 -171.5q0 -68 -28 -123q-12 -28 -36 -55q-11 -13 -28 -26q-12 -10 -35 -22q-31 -13 -68 -13zM965 815q-58 0 -99 -54t-41 -132q0 -76 41 -130.5t99 -54.5q24 0 46 11h2q13 5 22 13l20 20q18 21 28 42
q22 44 22 99q0 78 -41 132t-99 54zM59 -126q-11 0 -19.5 8t-8.5 19q0 12 8 20t20 8h42q52 0 96 11q51 12 88 29q44 20 83 45q25 16 77 57q48 42 84 90q35 41 63 101q23 49 39 110q12 54 12 118q0 65 -23 134q-23 65 -65 112q-34 48 -94 77q-55 28 -119 28q-65 0 -118 -28
q-54 -28 -90 -70q-34 -39 -59 -97q-20 -58 -20 -112t20 -103q22 -50 52 -77q45 -46 75 -63q14 -8 32.5 -15.5t55 -15t72.5 -6t81.5 20t84.5 55.5q8 8 19 7t19 -9q8 -9 7.5 -19.5t-9.5 -19.5q-45 -43 -99.5 -65.5t-106 -23.5t-98 9.5t-85.5 32.5q-38 20 -89 71q-40 41 -62 96
q-24 60 -24 123q0 66 22 132q30 70 72 116q45 51 106 83q70 33 142 33q79 0 145 -33q62 -31 112 -90q44 -52 74 -129q27 -80 27 -152t-12 -131q-13 -58 -43 -123q-28 -60 -70 -112q-41 -53 -91 -98q-56 -44 -83 -62q-42 -28 -90 -48q-34 -16 -100 -33q-47 -10 -106 -13z
M776 352zM743 352q0 -14 9.5 -23.5t23.5 -9.5t23.5 9.5t9.5 23.5t-9.5 23.5t-23.5 9.5t-23.5 -9.5t-9.5 -23.5z" />
<glyph glyph-name="icon-test3" unicode="&#xe6fc;" horiz-adv-x="1160"
d="M897 598h-73q-14 0 -22.5 11t-5.5 24l52 199q5 20 27 20h210q11 0 19 -8.5t8 -19.5t-8 -18t-19 -7h-188l-37 -144h37q11 0 19.5 -8t8.5 -19q0 -12 -8 -21t-20 -9zM954 245q-46 0 -88.5 21t-73.5 58q-7 10 -5.5 21t11 18t21 5.5t17.5 -11.5q21 -27 52 -42t66 -15
q62 0 105.5 43.5t43.5 105.5t-43.5 105.5t-105.5 43.5h-64q-11 0 -19.5 8.5t-8.5 19.5t8.5 19t19.5 8h64q84 0 144 -60t60 -144t-60 -144t-144 -60zM57 -126q-11 0 -19.5 8t-8.5 19q0 12 8 20t20 8h42q52 0 96 11q51 12 88 29q44 20 83 45q26 16 77 57q48 42 85 90
q34 41 62 101q23 49 39 110q13 54 13 116q0 65 -24 134q-23 65 -65 112q-33 49 -93 79q-56 28 -120 28q-65 0 -118 -28q-54 -28 -90 -70q-36 -41 -57 -97q-20 -58 -20 -112t20 -103q22 -50 52 -77q45 -46 75 -63q14 -8 32.5 -15.5t55 -15t72.5 -6t81.5 20t84.5 55.5
q8 8 19 7t19 -9q8 -9 7.5 -19.5t-9.5 -19.5q-45 -43 -99 -65.5t-106 -23.5t-98 9.5t-86 32.5q-38 20 -89 71q-40 41 -62 96q-24 60 -24 123q0 66 22 132q28 71 68 116q49 52 109 83q69 33 141 33q79 0 145 -33q62 -31 112 -90q44 -52 74 -129q25 -71 28 -152q0 -72 -13 -131
q-13 -58 -43 -123q-28 -60 -69 -112q-42 -53 -92 -98q-55 -44 -83 -62q-42 -28 -90 -48q-34 -16 -99 -33q-47 -10 -107 -13zM741 249zM708 249q0 -14 9.5 -23.5t23.5 -9.5t23.5 9.5t9.5 23.5t-9.5 23.5t-23.5 9.5t-23.5 -9.5t-9.5 -23.5z" />
<glyph glyph-name="kuaisu" unicode="&#xe6fd;" horiz-adv-x="1181"
d="M173 -4q-12 0 -21 9l-144 148q-14 14 -4 30q9 19 28 15l261 -32q11 -1 18 -10.5t6 -21t-11 -18.5t-21 -4l-180 23l88 -92q9 -9 9 -20t-9 -20q-10 -7 -20 -7zM289 110q-13 0 -21 8t-8 19.5t8 19.5l700 703q36 37 87.5 37t88.5 -37q38 -37 38 -89.5t-36 -88.5l-246 -244
q-8 -8 -19.5 -8t-20 8.5t-8.5 19.5t9 20l244 245q20 21 20 47q0 28 -20 49q-20 20 -48.5 20t-49.5 -20l-699 -699q-10 -10 -19 -10zM309 -102q-52 0 -88 36l-67 67q-9 9 -9 20t8.5 19.5t20 8.5t19.5 -8l68 -68q19 -19 48.5 -19t48.5 19l405 405q9 9 20 9t19.5 -8.5t8.5 -20
t-8 -19.5l-405 -403q-38 -38 -89 -38zM879.5 -128q-11.5 0 -20 8.5t-8.5 19.5v557q0 11 8.5 19.5t20 8.5t20 -8.5t8.5 -19.5v-557q0 -11 -8.5 -19.5t-20 -8.5zM754 577h-557q-12 0 -20 8t-8 20.5t8 20t20 7.5h557q11 0 19.5 -8t8.5 -19.5t-8.5 -20t-19.5 -8.5z" />
<glyph glyph-name="niandu" unicode="&#xe6fe;"
d="M387 -69q-17 0 -23 16q-46 133 5 250q5 9 14.5 12t17.5 -1q9 -4 12.5 -14t-0.5 -18q-9 -16 -15.5 -39.5t-6 -72.5t18.5 -101q3 -10 -1 -18.5t-14 -12.5q-3 -1 -8 -1zM621 -128q-19 0 -24 20q-12 48 -14 87t6.5 70.5t16.5 48.5t23 44q32 53 34 92q0 10 7.5 17t18.5 6
q10 0 17 -7.5t6 -18.5q-1 -23 -8 -45.5t-13.5 -35.5t-19.5 -34q-14 -25 -20.5 -39.5t-13.5 -41t-5 -59t12 -75.5q2 -9 -3 -18t-15 -11h-5zM328 161q-88 0 -164 46.5t-120 126.5t-44 173.5t44 173.5t120 126.5t164.5 46.5t164 -46.5t120 -126.5t44.5 -173.5t-44 -173.5
t-119.5 -126.5t-165.5 -46.5zM328.5 805q-115.5 0 -197.5 -87t-82 -210.5t82 -210.5t197.5 -87t197.5 87t82 210.5t-82 210.5t-197.5 87zM710 236q-49 0 -100 18q-10 4 -14.5 12.5t-0.5 18.5t12.5 14t18.5 0q41 -14 84 -14q110 0 187.5 82.5t77.5 198.5t-77.5 198.5
t-187.5 82.5q-66 0 -130 -36q-8 -4 -18 -2t-16 11q-5 8 -2.5 18t10.5 16q75 42 156 42q86 0 158 -44t114 -120t42 -166t-42 -165.5t-114 -120t-158 -44.5z" />
<glyph glyph-name="vip" unicode="&#xe6ff;" horiz-adv-x="1243"
d="M799 -128q-12 0 -21 9t-9 21v487q0 12 9 21t21 9h109q33 0 68 5.5t73 20t67.5 37t48.5 59t19 83.5q0 50 -17 88t-43 60.5t-63 36.5t-72 19t-75 5h-115q-12 0 -21 9t-9 20.5t9 20.5t21 9h115q156 0 242.5 -70.5t86.5 -197.5q0 -51 -20.5 -97.5t-60 -84.5t-105.5 -60.5
t-149 -22.5h-79v-457q0 -12 -9 -21t-21 -9zM645 -128q-12 0 -20.5 9t-8.5 21v964q0 12 8.5 21t20.5 9t21 -9t9 -21v-964q0 -12 -9 -21t-21 -9zM339 -128q-21 0 -27 20l-310 961q-4 11 2 22t18 15q11 4 22 -1.5t15 -18.5l282 -872l277 872q4 12 14.5 17.5t22.5 2.5
q12 -4 17.5 -14.5t2.5 -22.5l-308 -961q-7 -20 -28 -20z" />
<glyph glyph-name="youhui" unicode="&#xe700;"
d="M414 -128q-53 0 -89 35l-287 288q-38 38 -38 90t38 89l400 401q8 8 18 8t17 -7.5t7 -17.5t-7 -17l-401 -401q-23 -23 -23 -55t23 -56l288 -287q21 -21 54 -21q31 0 54 23l483 484q24 27 24 54v288v0q0 32 -23 54.5t-55 22.5v0h-287q-34 0 -53 -22q-7 -8 -18 -8
q-10 0 -17 6q-8 7 -8 18q0 9 6 16q34 39 90 39h288q52 0 89 -37t37 -89v-288q0 -45 -37 -87l-485 -485q-38 -38 -88 -38v0zM590 205q-19 0 -23 18l-99 362q-1 3 -1 6q0 8 5.5 15t12.5 9q10 2 18.5 -3t11.5 -14l99 -362q2 -10 -3 -18.5t-15 -11.5q-1 -1 -6 -1v0zM382 276
q-27 0 -50 17.5t-31 44.5l-17 61q-13 47 20 80q16 16 38 21q32 9 61.5 -8.5t39.5 -50.5l17 -61q13 -47 -21 -80q-15 -16 -37 -21q-9 -3 -20 -3zM362 454q-4 0 -9 -1q-8 -2 -14 -8q-10 -10 -10 -23q0 -5 2 -9l17 -62q4 -14 16.5 -21t25.5 -4q8 2 15 8q13 14 8 33l-17 61
q-3 11 -13 18.5t-21 7.5zM710 338q-28 0 -51 17.5t-31 44.5l-17 61q-13 47 21 80q16 16 37 21q33 8 62.5 -9t38.5 -50l18 -61q3 -11 3 -23q0 -14 -7 -30.5t-17 -26.5q-16 -16 -37 -21q-10 -3 -20 -3zM689 516q-4 0 -8 -1q-8 -2 -14 -8q-10 -10 -10 -23q0 -5 1 -10l17 -61
q4 -14 16.5 -21t26.5 -4q8 3 14 8q14 14 9 33l-18 61q-3 12 -12.5 19t-21.5 7z" />
<glyph glyph-name="zazhi" unicode="&#xe701;"
d="M512 -97q-10 0 -17 7.5t-7 16.5v751q0 10 7 17.5t17 7.5t17 -7.5t7 -17.5v-752q0 -10 -7 -16.5t-17 -6.5zM512 -128h-1q-25 0 -43 18t-18 43v1q0 36 -26 62t-62 26h-225v0q-57 0 -97 40t-40 97v600q0 57 40 97t97 40h225q88 0 150 -63q62 63 150 63h225q57 0 97 -40
t40 -97v-600q0 -56 -40 -96.5t-97 -40.5h-225q-36 0 -62 -25.5t-26 -62.5q0 -26 -18 -44t-44 -18zM137 847q-37 0 -62.5 -26t-25.5 -62v-600q0 -37 25.5 -62.5t62.5 -25.5h225q56 0 96.5 -40t40.5 -97q0 -6 3.5 -9.5t9.5 -3.5v0q5 0 9 3.5t4 9.5v0q0 57 40 97t96 40h226
q36 0 62 26t26 62v600q0 36 -26 62t-62 26h-226q-80 0 -130 -67q-7 -9 -19.5 -9t-19.5 9q-50 67 -130 67h-225v0z" />
</font>
</defs></svg>
... ...
No preview for this file type
No preview for this file type

240 Bytes | W: 0px | H: 0px

1.69 KB | W: 0px | H: 0px

  • 2-up
  • Swipe
  • Onion skin
// 个人中心共用代码加载
require('./me');
... ...
... ... @@ -137,3 +137,5 @@
@import "setting/index";
@import "favorite/index";
@import "exchange";
@import "vip";
... ...
.user-vip {
min-height: 800px;
.subtitle {
padding-bottom: 12px !important;
}
.vip-level {
clear: both;
}
.level {
margin: 20px 15px 0 40px;
line-height: 31px;
float: left;
clear: both;
font-size: 14px;
color: #000;
}
.vip-icon {
margin-top: 20px;
width: 70px;
height: 26px;
float: left;
margin-bottom: 25px;
}
.vipimg1 {
background-image: resolve("me/vip/silver-vip.png");
background-size: contain;
}
.vipimg2 {
background-image: resolve("me/vip/gold-vip.png");
background-size: contain;
}
.vipimg3 {
background-image: resolve("me/vip/platinum-vip.png");
background-size: contain;
}
.favimg {
float: left;
width: 770px;
margin-top: 20px;
overflow: hidden;
}
.list {
width: 192px;
float: left;
margin-bottom: 25px;
i {
position: relative;
top: 5px;
font-size: 28px;
}
}
.fav-font {
line-height: 31px;
font-size: 14px;
color: #000;
padding-left: 5px;
box-sizing: border-box;
}
.year-amount {
float: left;
width: 600px;
margin-top: 20px;
}
.price-account {
height: auto;
overflow: hidden;
}
.amount {
font-size: 24px;
font-weight: bold;
color: #1b1b1b;
float: left;
line-height: 31px;
margin-left: -5px;
}
.ps {
font-size: 14px;
width: 100%;
margin-top: 15px;
display: block;
color: #999;
clear: both;
}
.line {
width: 100%;
height: 4px;
display: block;
background: #eee;
position: relative;
&:before {
content: "";
background: url("/me/vip/white-left.jpg") no-repeat;
background-position: -16px 0;
width: 4px;
height: 4px;
position: absolute;
left: 0;
}
&:after {
content: "";
background: url("/me/vip/white-right.jpg") no-repeat;
width: 4px;
height: 4px;
position: absolute;
right: 0;
}
}
.line-black {
height: 4px;
position: absolute;
top: 40px;
background: #1b1b1b;
display: none;
&:before {
content: "";
background: url("/me/vip/black-left.jpg") no-repeat;
background-position: -16px 0;
width: 4px;
height: 4px;
position: absolute;
left: 0;
}
&:after {
content: "";
background: url("/me/vip/black-right.jpg") no-repeat;
width: 4px;
height: 4px;
position: absolute;
right: 0;
}
}
.left-r {
position: absolute;
left: 80px;
top: 26px;
font-size: 13px;
}
.right-r {
position: absolute;
right: 80px;
top: 26px;
font-size: 13px;
}
.r-icon {
width: 12px;
height: 12px;
background: url("/me/vip/r.png") no-repeat;
background-size: contain;
display: block;
margin: 10px auto;
}
.amount-length {
width: 700px;
padding-top: 40px;
position: relative;
.price-box {
width: 81px;
height: 38px;
background: url("/me/vip/price-box.png") no-repeat;
background-size: contain;
display: block;
position: absolute;
right: 66px;
top: -8px;
color: #fff;
text-align: center;
line-height: 38px;
}
}
.balance {
font-size: 14px;
line-height: 31px;
float: left;
color: #1b1b1b;
margin-left: 30px;
.price {
font-size: 18px;
}
p {
float: left;
color: #1b1b1b;
font-size: 14px;
}
}
.history {
padding-top: 80px;
clear: both;
overflow: hidden;
}
.hisamout {
margin-left: 10px;
font-size: 28px;
color: #1b1b1b;
font-weight: bold;
vertical-align: middle;
}
.cur-time {
width: 700px;
float: left;
margin-top: 34px;
position: relative;
font-size: 14px;
color: #1b1b1b;
span {
line-height: 28px;
}
.time-1 {
position: absolute;
left: 13px;
top: -14px;
text-align: center;
}
.time-2 {
position: absolute;
left: 130px;
top: -14px;
text-align: center;
}
.time-3 {
position: absolute;
right: 13px;
top: -14px;
text-align: center;
}
.line-b {
width: 476px;
height: 4px;
background: #1b1b1b;
position: absolute;
top: 0;
right: 60px;
}
.r-icon {
margin: 10px auto 5px;
}
.date-box {
width: 201px;
height: 38px;
background: url("/me/vip/date-box.png") no-repeat;
background-size: contain;
position: absolute;
right: 192px;
top: -48px;
line-height: 38px;
text-align: center;
color: #fff;
}
}
.valid {
margin-top: 44px;
padding-top: 14px;
margin-bottom: 240px;
}
}
... ...
... ... @@ -85,6 +85,75 @@
margin-top: 38px;
}
.desc {
display: block;
margin-top: 28px;
}
.vip-price {
line-height: 14px;
color: #707070;
font-size: 14px;
display: inline-block;
vertical-align: top;
.login-url,
.cur {
color: #1b1b1b;
display: inline-block;
font-size: 14px;
}
.login-url {
color: #379ed6;
margin-left: 5px;
}
.cur {
position: relative;
top: 2px;
}
.unlogin {
color: #999;
display: inline-block;
}
.vip-price-item {
display: inline-block;
vertical-align: top;
}
.vip-schedual {
color: #999;
text-decoration: underline;
margin-left: 5px;
}
.vip-icon {
display: inline-block;
width: 70px;
height: 26px;
margin-right: 5px;
vertical-align: middle;
}
.vip-level-1 {
background: resolve("product/vip-1.png") no-repeat;
background-size: contain;
}
.vip-level-2 {
background: resolve("product/vip-2.png") no-repeat;
background-size: contain;
}
.vip-level-3 {
background: resolve("product/vip-3.png") no-repeat;
background-size: contain;
}
}
.market-price {
color: #c1c1c1;
font-size: 12px;
... ...
... ... @@ -139,6 +139,14 @@ $hoverColor: #379ed6;
padding: 59px 0;
font-size: 16px;
font-weight: bold;
text-align: center;
.vip-tag {
color: #379ed6;
font-size: 12px;
margin-top: 7px;
display: inline-block;
}
}
.price-num {
... ...
... ... @@ -94,6 +94,15 @@
}
}
.vip-total {
margin-top: 2px;
.total-title {
width: 62px;
text-align: right;
}
}
.pay-total {
float: right;
border-top: 2px solid #1b1b1b;
... ... @@ -101,7 +110,7 @@
}
.calculate {
margin-top: 15px;
margin-top: 25px;
height: 31px;
}
... ...
... ... @@ -230,13 +230,19 @@
<div class="selected-num">已选<span>{{selectedNum}}</span>件</div>
<div class="checkout-total">
<div class="total-title">商品金额:</div>
<div class="total-money">¥ <span>{{round totalMoney 2}}</span></div>
<div class="total-money">¥ <span>{{round orderAmount 2}}</span></div>
</div>
{{#if totalVip}}
<div class="checkout-total vip-total">
<div class="total-title">VIP优惠:</div>
<div class="total-money">-¥ <span>{{round totalVip 2}}</span></div>
</div>
{{/if}}
</div>
<div class="calculate">
<div class="checkout-total pay-total">
<div class="pay-title">应付金额（不含运费）:</div>
<div class="total-money">¥ <span>{{round totalMoney 2}}</span></div>
<div class="total-money">¥ <span>{{round lastOrderAmount 2}}</span></div>
</div>
</div>
<div class="checkout">
... ...