Authored by 郭成尧

del-shop-channel

... ... @@ -6,8 +6,6 @@
*/
'use strict';
// const _ = require('lodash');
// const helpers = global.yoho.helpers;
const mRoot = '../models';
const brandModel = require(`${mRoot}/brand`);
... ... @@ -16,46 +14,6 @@ const brandModel = require(`${mRoot}/brand`);
*/
module.exports = {
/* 品牌店铺页面 */
index: (req, res) => {
res.render('brand/index', {
module: 'channel',
page: 'brand',
domain: req.domain
});
},
/* 获取品牌店铺介绍 */
getShopInfo: (req, res) => {
brandModel.getBrandData({
domain: req.query.domain,
uid: req.user.uid
}).then(result => {
res.json(result);
});
},
/* 获取商品列表 */
getBrandShopGoods: (req, res) => {
brandModel.getBrandShopGoodsData({
sort: req.body.sort,
page: req.body.page,
channel: req.body.filter.channel || 'men',
gender: req.body.filter.gender || '1,2,3',
brand: req.body.filter.brand,
shopId: req.body.filter.shopId,
order: req.body.filter.order || 's_t_desc',
limit: req.body.filter.limit || '60',
color: req.body.filter.color,
price: req.body.filter.price,
size: req.body.filter.size,
pd: req.body.filter.pd,
tagsFilter: req.body.filter.tagsFilter
}).then(result => {
res.json(result);
});
},
/* 品牌列表页 */
brandList: (req, res) => {
... ... @@ -75,26 +33,6 @@ module.exports = {
});
},
/* 品牌店铺分享页面 */
brandShare: (req, res) => {
res.render('brand/brand-share', {
module: 'channel',
page: 'brand-share'
});
},
/* 收藏店铺 */
collectShop: (req, res) => {
brandModel.collectShopData({
shopId: req.body.shopId,
favId: req.body.favId,
uid: req.user.uid,
type: 'shop'
}).then(result => {
res.json(result);
});
},
/* 全部分类 */
cate: (req, res) => {
res.render('brand/cate', {
... ...
... ... @@ -22,92 +22,6 @@ const yhChannel = {
module.exports = {
/**
* 从接口获取品牌店铺数据
* @returns {*}
*/
getShopInfoData(params) {
let finalParams = {
method: 'app.shops.getIntro',
shop_id: params.shopId
};
if (params.uid) {
Object.assign(finalParams, {
uid: params.uid
});
}
return api.get('', finalParams);
},
/**
* 通过品牌域名获取品牌信息
* @param params
*/
getBrandInfoByDomain(params) {
return api.get('', {
method: 'web.brand.byDomain',
domain: params.domain
});
},
getShopsDecoratorList(params) {
return api.get('', {
method: 'app.shopsdecorator.getList',
});
},
/**
* 从接口获取品牌店铺商品数据
* @returns {*}
*/
getBrandShopGoodsOriginData(params) {
return api.get('', {
method: 'app.search.brand',
yh_channel: params.channel ? yhChannel[params.channel].channel : '1',
brand: params.brand,
shop_id: params.shopId,
order: params.order,
limit: params.limit,
page: params.page,
gender: params.gender,
color: params.color,
price: params.price,
size: params.size,
p_d: params.pd,
sort: params.sort,
tags_filter: params.tagsFilter
});
},
/**
* 收藏取消收藏店铺
* @param params
* @returns {*}
*/
collectShopOriginData(params) {
let finalParams = {
id: params.shopId,
fav_id: params.shopId,
uid: params.uid,
type: params.type
};
if (params.isFav) {
Object.assign(finalParams, {
method: 'app.favorite.add'
});
} else {
Object.assign(finalParams, {
method: 'app.favorite.cancel'
});
}
return api.get('', finalParams);
},
/**
* 从接口获取品牌列表页数据
* @returns {*}
*/
... ... @@ -127,16 +41,5 @@ module.exports = {
method: 'app.sort.get'
})
);
},
/**
* 从接口获取品类资源位数据
* @returns {*}
*/
getCateResource(params) {
return api.get('', Object.assign(params, {
method: 'app.sort.get'
})
);
}
};
... ...
... ... @@ -5,14 +5,12 @@
* Time: 13:51
*/
'use strict';
const path = require('path');
const api = global.yoho.API;
const helpers = global.yoho.helpers;
const brandApi = require('./brand-api');
const logger = global.yoho.logger;
const _ = require('lodash');
const processProductList = require(path.join(global.utils, '/beautify/product')).processProductList;
const camelCase = global.yoho.camelCase;
/**
* 处理品牌一览品牌列表数据
... ... @@ -53,94 +51,6 @@ const handleBrandList = origin => {
};
/**
* 获取品牌店铺数据
* @param params
* @returns {*|Promise.<TResult>}
*/
const getBrandData = params => {
let finalResult = {};
return api.all([
brandApi.getBrandInfoByDomain({domain: params.domain})
]).then(result => {
if (result[0].code === 200) {
/* 品牌有店铺 */
if (result[0].data.shop_id) {
return api.all([
brandApi.getShopInfoData({
shopId: result[0].data.shop_id,
uid: params.uid
})
]).then(subResult => {
if (subResult[0].code === 200) {
/* TODO 判断是否是使用 BLK 模板,不使用 BLK 模板的就直接返回 */
if (subResult[0].data.shop_template_type === '2') {
Object.assign(finalResult, {
/* TODO 背景图取资源位,接口未开发 */
brandBg: 'http://7xwj52.com1.z0.glb.clouddn.com/brandbg.jpg',
/* TODO 是否显示店铺 LOGO,接口未开发 */
showBrandLogo: false,
brandLogo: subResult[0].data.shop_logo,
brandName: subResult[0].data.shop_name,
brandIntro: subResult[0].data.shop_intro
});
return finalResult;
} else {
logger.info('no BLK template');
}
} else {
logger.error('getShopInfoData api code no 200');
}
});
} else {
logger.info('brand has no shop');
}
} else {
logger.error('getBrandOriginData api code no 200');
}
});
};
/**
* 获取品牌店铺商品数据
* @param params
* @returns {*|Promise.<TResult>}
*/
const getBrandShopGoodsData = params => {
let finalResult = {};
return api.all([brandApi.getBrandShopGoodsOriginData(params)]).then(result => {
if (result[0].code === 200) {
Object.assign(finalResult, {
data: {
productList: processProductList(result[0].data.productList)
}
});
} else {
logger.error('getBrandShopGoodsOriginData api code no 200');
}
return camelCase(finalResult);
});
};
/**
* 收藏店铺
* @param params
* @returns {*|Promise.<TResult>}
*/
const collectShopData = params => {
return api.all([brandApi.collectShopOriginData(params)]).then(result => {
return result[0];
});
};
/**
* 获取品牌列表页数据
* @param params
*/
... ... @@ -234,24 +144,7 @@ const getCateListData = params => {
});
};
/**
* 获取品类资源位数据
* @param params
* @returns {*|Promise.<TResult>}
*/
const getCateResource = params => {
let finalResult = {};
return brandApi.getCateResource(params).then(result => {
return finalResult;
});
};
module.exports = {
getBrandData,
getBrandShopGoodsData,
getBrandListData,
getCateListData,
getCateResource,
collectShopData
getCateListData
};
... ...
... ... @@ -16,15 +16,10 @@ const router = expressRouter();
router.get('/', channel.index); // 首页
router.get('/channel/resources.json', channel.resources); // 资源位接口
router.get('/channel/goods.json', channel.goods); // 首页查询商品列表
router.get('/brand', brand.index); // 店铺首页
router.get('/get-shop-info', brand.getShopInfo); // 店铺介绍
router.post('/get-brand-shop-goods', brand.getBrandShopGoods); // 店铺介绍
router.get('/brand-list', brand.brandList); // 品牌列表页
router.get('/get-brand-list', brand.getBrandList); // 获取品牌列表数据
router.get('/brand-share', brand.brandShare); // 品牌店铺分享
router.get('/cate-resource', brand.cateResource); // 品类资源位页面
router.post('/collect-shop', brand.collectShop); // 收藏品牌店铺
router.get('/cate', brand.cate); // 全部分类
router.get('/get-cate-list', brand.getCateList); // 全部分类数据列表
... ...
<div id="brand-share">
<brand-share-box></brand-share-box>
</div>
<div id="brand">
<brand-box></brand-box>
</div>
\ No newline at end of file
... ... @@ -50,6 +50,18 @@ exports.module = {
},
/**
* TODO 从接口获得店铺装修资源
* @param params
* @returns {*}
*/
getShopsDecoratorList(params) {
return api.get('', {
method: 'app.shopsdecorator.getList',
shop_id: params.shopId
});
},
/**
* 从接口获取品牌店铺商品数据
* @returns {*}
*/
... ...
/**
* Created by PhpStorm.
* User: Targaryen
* Date: 2016/7/22
* Time: 14:30
*/
const Vue = require('yoho-vue');
const lazyload = require('yoho-vue-lazyload');
const brandShareBox = require('channel/brand-share-box.vue');
require('common/vue-filter');
Vue.use(lazyload);
new Vue({
el: '#brand-share',
components: {
brandShareBox
}
});
/**
* Created by PhpStorm.
* User: Targaryen
* Date: 2016/7/19
* Time: 16:05
*/
const Vue = require('yoho-vue');
const lazyload = require('yoho-vue-lazyload');
const infinitScroll = require('yoho-vue-infinite-scroll');
const brandBox = require('channel/brand-box.vue');
Vue.use(lazyload);
Vue.use(infinitScroll);
new Vue({
el: '#brand',
components: {
brandBox
}
});
<template>
<brand-top-bar v-bind:share-data="shareData"></brand-top-bar>
<brand-shop-top v-bind:shop-info="shopInfo"></brand-shop-top>
<goods-list v-bind:data="productList"></goods-list>
<drawer v-ref:drawer>
<filter :config.once="filterConfig"></filter>
</drawer>
</template>
<script>
const $ = require('yoho-jquery');
const qs = require('yoho-qs');
const bus = require('common/vue-bus');
const tip = require('common/tip');
const brandTopBar = require('channel/brand-top-bar.vue'); // 顶部栏,包括返回、收藏店铺、分享,打开筛选页面
const brandShopTop = require('channel/brand-shop-top.vue'); // 店铺头部信息
const goodsList = require('product/list.vue');
const drawer = require('product/drawer.vue');
const filter = require('product/filter.vue');
require('common/vue-filter');
module.exports = {
data() {
return {
domain: qs.domain,
shareData: {}, // 分享相关数据
shopInfo: {}, // 店铺介绍相关数据
sortConfig: global.sortConfig,
filterConfig: global.filterConfig,
// query
url: '/get-brand-shop-goods',
sort: '',
filter: {},
page: 0, // page= 0 未搜索, 1 并且productList.length =0 没有数据, page = page_total 全部加载完
totalPage: 3,
// 产品列表
productList: [],
// state:
inSearching: false
};
},
watch: {
domain: function() {
this.getShopInfo();
},
/* sort 和 filter 改变 都会触发 重新搜索 (想象成清空所有分页) */
sort: function() {
this.research();
},
filter: function() {
this.research();
}
},
methods: {
/* 获取店铺简介相关数据 */
getShopInfo() {
$.get({
url: '/get-shop-info',
data: { domain: this.domain }
}).done(result => {
if (result) {
this.shopInfo = result;
this.shopInfo.showBrandInfo = true;
this.shareData = {
title: result.brandName,
link: '/brand-share?domain=' + this.domain,
img: result.brandBg
};
} else {
this.shopInfo.showBrandInfo = false;
}
}).fail(() => {
tip('网络错误');
});
},
getProductList() {
let data = {};
$.ajax({
url: this.url,
data: data
}).done(result => {
this.productList = result.data.productList;
}).fail(() => {
tip('网络错误');
});
},
search: function() {
const self = this;
if (this.inSearching) {
return;
}
if (this.page && this.page + 1 > this.totalPage) {
return;
}
this.inSearching = true;
this.page++;
$.post(this.url, {
sort: this.sort,
filter: this.filter,
page: this.page
}).done(result => {
this.productList = result.data.productList;
}).fail(error => {
self.page--;
console.log(error);
}).always(() => {
self.inSearching = false;
});
},
openFilterSub: function() {
console.log('TODO: open filter sub');
},
/**
*
*/
research: function() {
this.page = 0;
this.$set('productList', []);
this.search();
}
},
components: {
brandTopBar,
brandShopTop,
goodsList,
drawer,
filter
},
created() {
this.getShopInfo();
// this.search();
bus.$on('list.paging', function() {
this.search();
});
bus.$on('sort.change', function({ val }) {
console.log(val);
this.sort = val;
});
/**
* 筛选组件 筛选值变更,触发 filter.change事件
* 1. 重新搜索
* 2. 关闭 drawer 组件
*/
bus.$on('filter.change', function({ val }) {
console.log(val);
this.filter = val;
this.$refs.drawer.on = false;
});
/**
* 筛选组件 打开二级晒寻,通过bridge 打开APP view
* 1. 打开view
* 2. 监听 router.back ,重新设置 筛选值
*/
bus.$on('filter.sub.show', function({val}) {
this.openFilterSub(val);
});
}
};
</script>
<template>
<div class="brand-share">
<div class="brand-top-box" v-bind:style="{ 'background-image': `url(${brandBg})` }"></div>
<div class="brand-title">{{ brandName }}</div>
<div class="brand-intro">{{ brandIntro }}</div>
<div class="tip">进入 BLK 选购潮品</div>
<div class="arrow">i</div>
<img v-lazy="brandBg | resize 752 365">
</div>
<share-bottom></share-bottom>
</template>
<style>
.brand-share {
.brand-top-box {
width: 100%;
height: 468px;
color: #fff;
background-color: #000;
position: relative;
}
.brand-title {
margin: 30px;
font-weight: 700;
font-size: 32px;
color: #000;
font-style: italic;
}
.brand-intro {
margin: 30px;
min-height: 400px;
}
.tip {
width: 100%;
text-align: center;
font-size: 36px;
margin: 10px 0;
}
.arrow {
width: 100%;
text-align: center;
margin-bottom: 20px;
}
img {
width: 100%;
height: 365px;
}
}
</style>
<script>
const brandShopTop = require('channel/brand-shop-top.vue');
const shareBottom = require('channel/share-bottom.vue');
module.exports = {
/* TODO 数据需要从接口获取 */
data() {
return {
brandName: 'COLORMAD',
brandBg: 'http://7xwj52.com1.z0.glb.clouddn.com/brandbg.jpg',
brandIntro: 'COLORMAD坚持女性的时尚美丽不应为牺牲健康为代价,以健康,时尚,科技为理念,' +
'研发健康无伤害的新概念甲油。'
};
},
components: {
brandShopTop,
shareBottom
}
};
</script>
<template>
<div v-if="shopInfo.showBrandInfo" class="brand-top-box" v-bind:style="{ 'background-image': `url(${shopInfo.brandBg})` }">
<div class="brand-bottom">
<img v-if="shopInfo.showBrandLogo" v-lazy="brandIntro.brandLogo" alt="{{ shopInfo.brandName }}">
<div v-else class="brand-title">{{ shopInfo.brandName }}</div>
<hr>
<div v-show="showMore" transition="brand-intro" v-bind:class="{ 'brand-short': !showMore }">{{ shopInfo.brandIntro }}</div>
</div>
<div v-if="!showMore" class="showmore expand" @click="introTrans()"><span class="icon">&#xe602;</span></div>
<div v-else class="showmore collapse" @click="introTrans()"><span class="icon">&#xe617;</span></div>
</div>
</template>
<style>
.brand-top-box {
width: 100%;
height: 468px;
color: #fff;
background-color: #000;
position: relative;
.brand-bottom {
width: 100%;
position: absolute;
bottom: 20px;
padding: 0 30px;
.brand-title {
font-weight: 700;
font-size: 32px;
font-style: italic;
margin: 5px 0;
}
hr {
width: 100%;
border: #fff solid 1px;
border-top: none;
margin: 5px 0;
}
.brand-intro-transition {
transition: all 0.3s ease;
font-size: 16px;
line-height: 32px;
width: 90%;
height: 220px;
overflow-y: auto;
}
.brand-intro-enter,
.brand-intro-leave {
height: 60px;
}
.brand-short {
height: 60px !important;
display: -webkit-box !important;
font-size: 16px;
line-height: 32px;
width: 90%;
text-overflow: ellipsis;
overflow-y: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
}
.showmore {
width: 60px;
height: 60px;
position: absolute;
bottom: 10px;
right: 30px;
font-size: 32px;
}
}
</style>
<script>
module.exports = {
props: {
shopInfo: {
type: Object
}
},
data() {
return {
showMore: false
};
},
methods: {
introTrans() {
this.showMore = this.showMore !== true;
}
}
};
</script>
<template>
<div class="top-box clearfix">
<span class="icon back" @click="goBack()">&#xe606;</span>
<div class="right">
<span class="icon" v-bind:class="{'favorite': shareData.isFav}" @click="collectShop()">&#xe609;</span>
<span class="icon share" @click="goShare()">&#xe60e;</span>
<span class="icon filter" @click="showFilter()">&#xe60b;</span>
</div>
</div>
</template>
<style>
.top-box {
width: 100%;
height: 60px;
padding: 0 20px;
position: fixed;
top: 60px;
left: 0;
z-index: 99;
color: #fff;
font-size: 48px;
.back {
width: 60px;
height: 60px;
float: left;
}
.right {
height: 60px;
float: right;
margin: 0;
padding: 0;
span {
width: 60px;
height: 60px;
margin: 0 5px;
}
.favorite {
color: #000;
}
}
}
</style>
<script>
const yoho = require('yoho');
const $ = require('yoho-jquery');
const tip = require('common/tip');
module.exports = {
props: {
shareData: {
type: Object
}
},
methods: {
goShare() {
yoho.goShare(this.shareData, function() {}, function() {});
},
goBack() {
yoho.goBack({}, function() {}, function() {});
},
/* 收藏或者取消收藏店铺 */
collectShop() {
/* TODO 获取数据策略待确定 */
let data = {
shopId: this.shareData.shopId,
isFav: this.shareData.isFav
};
$.post({
url: '/collect-shop',
data: data
}).done(result => {
if (result.code === 200) {
this.shareData.isFav = this.shareData.isFav !== true;
} else {
tip('网络错误');
}
}).fail(() => {
tip('网络错误');
});
},
showFilter() {
}
}
};
</script>
<template>
<div class="share-bottom clearfix" v-bind:class="{ 'hidden': close }">
<!-- TODO iconfont 要换-->
<span class="icon close" @click="closeBottom()">&#xe609;</span>
<img v-lazy="">
<a href="javascript:;" class="new-user">新用户送千元礼包</a>
<a href="http://m.yohoblk.com" class="download">立即下载</a>
</div>
</template>
<style>
.share-bottom {
width: 100%;
padding: 20px 10px;
background: #fff;
position: fixed;
left: 0;
bottom: 0;
height: 100px;
border-top: #ececec solid 2px;
.close {
position: fixed;
left: 0;
bottom: 60px;
font-size: 40px;
}
img {
float: left;
}
a {
border: #000 solid 2px;
padding: 10px;
border-radius: 40px;
}
.new-user {
float: left;]
border: #fff solid 2px;
}
.download {
float: right;
}
}
.hidden {
display: none;
}
</style>
<script>
module.exports = {
data() {
return {
close: false
};
},
methods: {
closeBottom() {
this.close = true;
}
}
};
</script>
\ No newline at end of file