'use strict';
const Model = require('../models/material');
const index = (req, res, next) => {
let uid = req.user.uid;
Model.canLogin(uid).then(canLogin => {
if (canLogin === 'N') {
return next();
} else {
Model.getList({
page: 1,
maxSortId: 0,
middleSortId: 0,
smallSortId: 0
}).then(result => {
if (result && result.code === 200) {
res.render('material', Object.assign({
module: '3party',
page: 'material',
layout: false
}, result.product_list));
} else {
return next();
}
}).catch(next);
}
}).catch(next);
};
const newBrandList = (req, res, next) => {
Model.newBrandList(req).then(data => {
res.send(data);
}).catch(next);
};
const getCategory = (req, res, next) => {
Model.getCategory().then(data => {
res.send(data);
}).catch(next);
};
const getList = (req, res, next) => {
Model.getList(req.query).then(result => {
res.send(result);
}).catch(next);
};
const getRecommendlist = (req, res, next) => {
Model.getRecommendlist().then(result => {
res.send(result);
}).catch(next);
};
// exports.getIndexGuide = (req, res, next) => {
// channelModel.getIndexGuideData().then(data => {
// if (data.code !== 200) {
// const err = new Error('异常');
// throw err;
// }
// return channelModel.formatIndexGuideData(data.data);
// }).then(data => {
// return channelModel.getResourceData(data);
// }).then(data => {
// let result = {list: data, layout: false};
// res.render('guide', result);
// }).catch(next);
// };
// exports.hasNewUserFloor = (req, res, next) => {
// channelModel.hasNewUserFloor(req.yoho.channel, req.user.uid).then(data => {
// res.send(data);
// }).catch(next);
// };
module.exports = {
index,
newBrandList,
getCategory,
getList,
getRecommendlist
};
... ...
... ... @@ -3,6 +3,7 @@
* @author: htoooth<ht.anglenx@gmail.com>
* @date: 2016/11/08
*/
'use strict';
var express = require('express'),
path = require('path');
... ...
'use strict';
const platformApi = new global.yoho.ApiBase(global.yoho.config.domains.platformApi, {
name: 'imCs',
cache: global.yoho.cache,
useCache: false
});
const api = global.yoho.API;
const canLogin = (uid) => {
return platformApi.get('/platform/product/material/canlogin', {
uid: uid
}).then(result => {
if (result && result.code === 200) {
return result.data.canLogin;
}
});
};
const newBrandList = (req) => {
let channel = req.query.yh_channel || 1;
return api.get('', { method: 'app.brand.newBrandList', yh_channel: channel });
};
const getCategory = () => {
return api.get('', {method: 'web.regular.groupsort'});
};
const getList = (params) => {
return platformApi.get('/platform/product/material/getList', params, {
code: 200
});
};
const getRecommendlist = () => {
return platformApi.get('/platform/product/material/getRecommendlist', {
page: 1
}, {
code: 200
});
};
module.exports = {
canLogin,
newBrandList,
getCategory,
getList,
getRecommendlist
};
... ...
... ... @@ -9,11 +9,20 @@
const router = require('express').Router(); // eslint-disable-line
const cRoot = './controllers';
const auth = require(`${global.middleware}/auth`);
const ads = require(`${cRoot}/ads`); // 第三方广告平台对接
const robot = require(`${cRoot}/robot-check`); // 机器人检查
const materialController = require(`${cRoot}/material`);
router.get('/ads', ads.jump);
router.get('/check', robot.index);
router.post('/check', robot.check, robot.isHuman);
router.get('/material', auth, materialController.index);
router.get('/material/newBrandList', auth, materialController.newBrandList);
router.get('/material/getCategory', auth, materialController.getCategory);
router.get('/material/getList', auth, materialController.getList);
router.get('/material/getRecommendlist', auth, materialController.getRecommendlist);
module.exports = router;
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{title}}</title>
<meta name="keywords" content="{{keywords}}">
<meta name="description" content="{{description}}"> {{#if cononicalURL}}
<link rel="cononical" href="{{cononicalURL}}" /> {{/if}}
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta http-equiv="cleartype" content="on">
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta content="telephone=no" name="format-detection" />
<meta content="email=no" name="format-detection" /> {{#dnsPrefetch.hosts}}
<link rel="dns-prefetch" href="{{this}}"> {{/dnsPrefetch.hosts}}
{{#if devEnv}}
<link rel="stylesheet" href="//{{devHost}}:5002/css/base.css">
<link rel="stylesheet" href="//{{devHost}}:5002/css/{{#if cssModule}}{{cssModule}}.css{{^}}{{module}}.css{{/if}}">
{{^}}
<link rel="stylesheet" href="//{{#isEqual cdn 'qcloud'}}qcdn.yoho.cn{{^}}cdn.yoho.cn{{/isEqual}}/yohobuy-node/{{version}}/base.css">
<link rel="stylesheet" href="//{{#isEqual cdn 'qcloud'}}qcdn.yoho.cn{{^}}cdn.yoho.cn{{/isEqual}}/yohobuy-node/{{version}}/{{#if cssModule}}{{cssModule}}.css{{^}}{{module}}.css{{/if}}">
{{/if}}
</head>
<body>
<div class="product_material">
<h1><i class="logo"></i>商品素材列表页</h1>
<div class="line">
<label>品牌:</label>
<input id="brand" type="text" readonly="readonly">
<label for="" style="margin-left: 10px;">首次上架开始时间:</label>
<input type="date" class="sel start-time">
<label for="" style="margin-left: 10px;">首次上架结束时间:</label>
<input type="date" class="sel end-time">
<div id="brand_container"></div>
</div>
<div class="line">
<label for="">品类:</label>
<select name="" id="category-1" class="sel"></select>
<select name="" id="category-2" class="sel"></select>
<select name="" id="category-3" class="sel"></select>
<div class="search-recommend-btn">自动推荐</div>
<div class="search-btn">搜索</div>
</div>
<div class="table-data">
{{> tbl}}
</div>
<div class="mask"></div>
</div>
{{#if devEnv}}
<script src="//{{devHost}}:5002/libs.js"></script>
<script src="//{{devHost}}:5002/{{module}}.{{page}}.js"></script>
{{^}}
<script src="//{{#isEqual cdn 'qcloud'}}qcdn.yoho.cn{{^}}cdn.yoho.cn{{/isEqual}}/yohobuy-node/{{version}}/libs.js"></script>
<script src="//{{#isEqual cdn 'qcloud'}}qcdn.yoho.cn{{^}}cdn.yoho.cn{{/isEqual}}/yohobuy-node/{{version}}/{{module}}.{{page}}.js"></script>
{{> analysis}}
{{/if}}
</body>
</html>
... ...
<table border="1" class="table">
<tr>
<th>skn</th>
<th>商品前台名称</th>
<th>默认图片</th>
<th>经典款型</th>
<th>风格</th>
<th>图案纹理</th>
<th>工艺元素</th>
</tr>
{{#each product_list}}
<tr>
<td>{{productSkn}}</td>
<td><a href="/p{{productId}}.html" target="_blank">{{productName}}</a></td>
<td><a href="/p{{productId}}.html" target="_blank"><img src="{{picImgUrl}}" alt=""></a></td>
<td>{{standardVal}}</td>
<td>{{style}}</td>
<td>{{pattern}}</td>
<td>{{makeCrafts}}</td>
</tr>
{{/each}}
</table>
... ...
... ... @@ -36,7 +36,8 @@ module.exports = {
// service: 'http://dev-service.yohops.com:9999/',
imSocket: 'ws://socket.yohobuy.com:10240',
imCs: 'http://im.yohobuy.com/api'
imCs: 'http://im.yohobuy.com/api',
platformApi: 'http://172.16.6.210:8088/'
},
subDomains: {
host: '.yohobuy.com',
... ... @@ -82,7 +83,7 @@ module.exports = {
port: '4444' // influxdb port
},
console: {
level: 'info',
level: 'debug',
colorize: 'all',
prettyPrint: true
}
... ... @@ -129,7 +130,8 @@ if (isProduction) {
service: 'http://service.yoho.yohoops.org/',
search: 'http://search.yohoops.org/yohosearch/',
imSocket: 'ws://imsocket.yohobuy.com:10000',
imCs: 'https://imhttp.yohobuy.com/api'
imCs: 'https://imhttp.yohobuy.com/api',
platformApi: 'http://api.platform.yohoops.org'
},
memcache: {
master: ['memcache1.yohoops.org:12111', 'memcache2.yohoops.org:12111', 'memcache3.yohoops.org:12111'],
... ...
... ... @@ -16,11 +16,11 @@ module.exports = app => {
app.use(require('./apps/passport')); // 登录注册
app.use('/home', require('./apps/home')); // 会员中心
app.use(require('./apps/brands')); // 品牌一览
app.use('/guang', require('./apps/guang')); // 逛
app.use('/cart', require('./apps/cart'));// 购物车
app.use('/help', require('./apps/help'));// 帮助中心
app.use('/guang', require('./apps/guang')); // 逛
app.use('/cart', require('./apps/cart')); // 购物车
app.use('/help', require('./apps/help')); // 帮助中心
// 第三方,如广告联盟
app.use('/3party', require('./apps/3party'));
app.use('/service', require('./apps/service'));// 客服
app.use('/service', require('./apps/service')); // 客服
};
... ...
<div class="nav">
<span {{#if list.focus1}}class="focus"{{/if}} yh_channel="1" _index="1">男生</span>
<span {{#if list.focus2}}class="focus"{{/if}} yh_channel="2" _index="2">女生</span>
<span {{#if list.focus3}}class="focus"{{/if}} yh_channel="3" _index="3">潮童</span>
<span {{#if list.focus4}}class="focus"{{/if}} yh_channel="4" _index="4">创意生活</span>
</div>
{{#each list}}
<div class="title">{{name}}</div>
<div class="content">{{#each content}}{{#if brand_name_cn}}<span class="item" data-id="{{id}}">{{brand_name_cn}}</span>{{/if}}{{/each}}</div>
{{/each}}
... ...
<table border="1" class="table">
<tr>
<th>skn</th>
<th>商品前台名称</th>
<th>默认图片</th>
<th>经典款型</th>
<th>风格</th>
<th>图案纹理</th>
<th>工艺元素</th>
</tr>
{{#each product_list}}
<tr>
<td>{{productSkn}}</td>
<td><a href="/p{{productId}}.html" target="_blank">{{productName}}</a></td>
<td><a href="/p{{productId}}.html" target="_blank"><img src="{{picImgUrl}}" alt=""></a></td>
<td>{{standardVal}}</td>
<td>{{style}}</td>
<td>{{pattern}}</td>
<td>{{makeCrafts}}</td>
</tr>
{{/each}}
</table>
... ...

7.35 KB | W: | H:

6.57 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
var $ = require('yoho-jquery');
var _ = require('lodash');
var brandTmp = require('hbs/material/brand.hbs');
var tableTmp = require('hbs/material/tbl.hbs');
var $mask = $('.mask');
var $brand = $('#brand_container');
var query = {
page: 1,
maxSortId: 0,
middleSortId: 0,
smallSortId: 0
};
var brandList = {
list1: [],
list2: [],
list3: [],
list4: []
};
function brandItemEventBind() {
$('#brand_container .item').off().on('click', function() {
var id = $(this).data('id');
var text = $(this).text();
query.brandId = id;
$('#brand').val(text);
$mask.hide();
$brand.hide();
});
}
/* 获取品牌数据*/
function getBrandList(_index, yhChannel) {
$.get('/3party/material/newBrandList?yh_channel=' + yhChannel, function(data) {
var list = [];
list = Object.keys(data.data.all_list).map(item => {
return { name: item, content: data.data.all_list[item] };
});
list['focus' + _index] = true;
brandList['list' + _index] = list;
$('#brand_container').html(brandTmp({ list }));
brandItemEventBind();
});
}
function getCategoryOpt(opts) {
var html = '';
$.each(opts, function(k, c) {
html += '<option value="' + c.sort_id + '">' + c.sort_name + '</option>';
});
return html;
}
getBrandList(1, 1);
/* 获取品类数据*/
$.get('/3party/material/getCategory', function(res) {
var $category1 = $('#category-1'),
$category2 = $('#category-2'),
$category3 = $('#category-3'),
sub = [],
categoryData = [];
if (res && res.code === 200) {
categoryData = res.data.sort;
$category1.html(getCategoryOpt(categoryData));
query.maxSortId = $category1.find('option').eq(0).attr('value');
$category1.on('change', function() {
var id = $(this).val();
sub = _.find(categoryData, {sort_id: id}).sub;
$category2.html(getCategoryOpt(sub)).show();
$category3.html('').hide();
query.maxSortId = id;
query.middleSortId = $category2.find('option').eq(0).attr('value');
});
$category2.on('change', function() {
var id = $(this).val();
var third = _.find(sub, {sort_id: id}).sub;
$category3.html(getCategoryOpt(third)).show();
query.middleSortId = id;
query.smallSortId = $category3.find('option').eq(0).attr('value');
});
$category3.on('change', function() {
query.smallSortId = $(this).val();
});
}
});
/* 品牌点击*/
$('#brand').on('click', function() {
if ($brand.css('display') === 'none') {
$brand.css('display', 'block');
$mask.show();
} else {
$brand.hide();
$mask.hide();
}
});
$mask.click(function() {
$mask.hide();
$brand.hide();
});
$(document).on('click', '#brand_container .nav span', function() {
var yhChannel = $(this).attr('yh_channel');
var index = $(this).attr('_index');
$('#brand_container .nav span').removeClass('focus');
$(this).addClass('focus');
if (brandList['list' + index].length > 0) {
$('#brand_container').html(brandTmp({list: brandList['list' + index]}));
brandItemEventBind();
} else {
getBrandList(index, yhChannel);
}
});
$('.start-time').on('change', function() {
query.shelveTimeBegin = $(this).val() + ' 00:00:00';
});
$('.end-time').on('change', function() {
query.shelveTimeEnd = $(this).val() + ' 23:59:59';
});
$('.search-btn').on('click', function() {
$.ajax({
url: '/3party/material/getList',
data: query,
type: 'get',
success: function(data) {
if (data && data.code === 200) {
$('.table-data').html(tableTmp({product_list: data.data.product_list}));
}
}
});
});
$('.search-recommend-btn').on('click', function() {
$.ajax({
url: '/3party/material/getRecommendlist',
type: 'get',
success: function(data) {
if (data && data.code === 200) {
$('.table-data').html(tableTmp({product_list: data.data.product_list}));
}
}
});
});
... ...
var $ = require('yoho-jquery');
const brand_tmp = require('hbs/material/brand.hbs');
$('#filter').on('change', () => {
if ($('#filter').find('option:selected').attr('value') == 3) {
$('.date').show();
}
});
/* 品牌点击*/
$('#brand label').on('click', () => {
if ($('#brand_container').css('display') == 'none') {
$('#brand_container').css('display', 'block');
} else {
$('#brand_container').hide();
}
});
$(document).on('click', '#brand_container .nav span', function() {
$('#brand_container .nav span').removeClass('focus');
$(this).addClass('focus');
let yh_channel = $(this).attr('yh_channel');
getBrandList($(this).attr('_index'), yh_channel);
});
/* 获取品牌数据*/
function getBrandList(_index, yh_channel) {
$.get('/material/newBrandList?yh_channel=' + yh_channel, data => {
let list = [];
list = Object.keys(data.data.all_list).map(item => {
return { name: item, content: data.data.all_list[item] };
});
list['focus' + _index] = true;
$('#brand_container').html(brand_tmp({ list }));
});
}
getBrandList(1, 1);
/* 获取品类数据*/
$.get('/material/getCategory', data => {
console.log(data);
});
... ...
... ... @@ -738,7 +738,7 @@ function stopPollingQrCodeTimer() {
function initQrCode() {
// 不需要初始化
//drawQrCode('//m.yohobuy.com/signin.html');
// drawQrCode('//m.yohobuy.com/signin.html');
}
function getDesktopLoginType() {
... ...
@import "robot-check";
@import "../variables";
@import "material";
... ...
.product_material {
margin: auto;
font-family: '微软雅黑';
font-size: 14px;
.logo {
width: 171px;
height: 40px;
display: inline-block;
background-image: url(../img/sprite.3party.png);
background-position: 0px 0px;
vertical-align: middle;
margin-right: 10px;
}
input, select {
outline: none;
}
select {
margin-right: 10px;
}
h1 {
font-size: 22px;
margin: 0 0 50px;
text-align: left;
width: 100%;
padding: 20px;
color: #a5a5a5;
box-sizing: border-box;
border-bottom: 1px solid #e2e2e2;
background: #f7f7f7;
}
/* 过滤 */
.line {
width: 90%;
margin: 20px auto;
}
.sel {
width: 173px;
vertical-align: middle;
padding: 9px;
border-radius: 4px;
box-sizing: border-box;
border: 1px solid #d6d6d6;
}
label,
a {
vertical-align: middle;
}
/* 品牌 */
#brand {
position: relative;
height: 40px;
width: 173px;
padding: 10px;
border-radius: 4px;
box-sizing: border-box;
border: 1px solid #d6d6d6;
label {
cursor: pointer
}
}
#brand_container {
position: absolute;
width: 90%;
background: #101010;
z-index: 2;
display: none;
height: 640px;
overflow: auto;
.nav {
overflow: hidden;
span {
display: inline-block;
width: 25%;
text-align: center;
height: 40px;
line-height: 40px;
cursor: pointer;
float: left;
color: #fff;
}
.focus {
background: #ececec;
color: #000;
}
}
.title {
padding: 10px 20px;
background: #f9f9f9;
color: #292929;
font-weight: bold;
text-align: left;
box-sizing: border-box;
}
.content {
background: #fff;
padding: 0 10px;
box-sizing: border-box;
}
.item {
display: inline-block;
width: 10%;
padding: 5px 0;
text-align: center;
height: 20px;
line-height: 20px;
font-size: 12px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin: 5px 0;
&:hover {
background: #eee;
cursor: pointer;
border-radius: 5px;
}
}
}
#category-2 {
display: none;
}
#category-3 {
display: none;
}
.search-btn {
float: right;
border-radius: 4px;
background: #000;
padding: 10px 25px;
color: #fff;
font-size: 14px;
cursor: pointer;
margin-right: 20px;
}
.search-recommend-btn {
float: right;
border-radius: 4px;
background: #20a0ff;
padding: 10px 25px;
color: #fff;
font-size: 14px;
cursor: pointer;
}
/*表格*/
table {
width: 90%;
margin: 35px auto;
}
table {
table-layout: fixed;
empty-cells: show;
border-collapse: collapse;
img {
width: 80px;
}
}
td {
height: 36px;
}
.table {
border: 1px solid #d6d6d6;
color: #666;
}
.table th {
background-repeat: repeat-x;
height: 30px;
font-weight: bold;
}
.table td,
.table th {
border: 1px solid #d6d6d6;
padding: 5px;
text-align: center;
}
.table tr.alter {
background-color: #f5fafe;
}
.mask {
position: absolute;
top: 0;
width: 100%;
bottom: 0;
z-index: 1;
background: #000;
opacity: 0.6;
display: none;
}
}
... ...