mobile / tt-yoho-app · Commits

Go to a project

Authored by 肖亚东
Commit fcdd88ef836a41c5495be63ade150d2cd76562d6 1 parent 8b4b9700

品类全部品牌不显示问题：头条列表渲染不支持字典循环，故转换成数组 — review by 黄敬囿

Inline Side-by-side
Showing 9 changed files with 231 additions and 218 deletions
Component({
properties: {
data: {
type: null,
},
onlyTextBrand: {//纯文本展示品牌 '0' 图文品牌 '1' 纯文字品牌
type: String,
value: '0'
}
},
data: {
textBrandKey:[],
textBrandData:[]
},
ready: function () {
//头条列表渲染不支持字典循环，故转换成数组 2018/12/7
if (onlyTextBrand == '1') {
let textBrandKey = [];
let textBrandData = [];
for (const iterator of Object.keys(this.properties.data)) {
textBrandData.push(this.properties.data[iterator]);
textBrandKey.push(iterator);
}
this.setData({
textBrandData,
textBrandKey
})
}
},
methods: {
brandItemTapped: function(event) {
this.triggerEvent('brandItemTapped', event);
}
}
})
... ...
<block tt:if="{{onlyTextBrand == '0'}}">
<view class='rowType2'>
<block tt:for="{{data}}" tt:key="{{index}}" tt:for-item="item">
<view class='item' tt:if="{{item.type == 2}}" bindtap="brandItemTapped" data-brand-item="{{item}}" data-F_ID="{{1003}}" data-F_INDEX="{{3}}" data-I_INDEX="{{index}}">
<image src="{{item.brand_ico}}" class="item_img" mode="aspectFit"></image>
<text class='item_title'>{{item.brand_name}}</text>
</view>
</block>
</view>
</block>
<block tt:if="{{onlyTextBrand == '1'}}">
<view class='rowType'>
<block tt:for="{{textBrandData}}" tt:key="{{index}}" tt:for-item="item">
<view id="{{textBrandKey[index] == '0-9' ? 'last' : textBrandKey[index]}}" class='sessionTitle'>
<text class='sessionText'>{{textBrandKey[index] == '0-9' ? '0' : textBrandKey[index]}}</text>
</view>
<block tt:for="{{item}}" tt:key="{{unique}}" tt:for-item="item">
<view class='row' tt:if="{{item.type == 2}}" bindtap="brandItemTapped" data-brand-item="{{item}}" data-F_ID="{{1003}}" data-F_INDEX="{{3}}" data-I_INDEX="{{index}}">
<view class='rowContent'>
<text class='title'>{{item.brand_name}}</text>
<view class='new' tt:if="{{item.is_show_new == 'Y'}}">
<text class='text'>NEW</text>
</view>
<view class='hot' tt:if="{{item.is_hot == 'Y'}}">
<text class='text'>HOT</text>
</view>
</view>
<view class='spaceLine'/>
</view>
</block>
</block>
</view>
</block>
... ...
.rowType .sessionTitle {
display: flex;
align-items: center;
height: 58rpx;
width: 100%;
background: #F0F0F0;
}
.rowType .sessionTitle .sessionText {
text-align: left;
margin-left: 30rpx;
font-weight: bold;
font-family: PingFang SC;
font-size: 28rpx;
color: #B0B0B0;
letter-spacing: -0.39px;
}
.row {
height: 88rpx;
width: 100%;
background-color-color: white;
}
.row .rowContent {
display: flex;
align-items: center;
height: 86rpx;
width: 92%;
margin-left: 4%;
flex-direction: row;
background-color: white;
}
.row .spaceLine {
height: 2rpx;
width: 92%;
margin-left: 4%;
background-color: #F0F0F0;
}
.row .rowContent .title {
text-align: left;
max-width: 500rpx;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-family: PingFang SC;
font-size: 28rpx;
color: #444444;
letter-spacing: -0.39px;
}
.row .rowContent .hot {
display: flex;
align-items: center;
height: 30rpx;
width: 76rpx;
margin-left: 40rpx;
justify-content: center;
background-color: #D0021B;
border-radius: 104rpx;
font-family: PingFang SC;
}
.row .rowContent .new {
display: flex;
align-items: center;
height: 30rpx;
width: 76rpx;
background-color: green;
margin-left: 40rpx;
justify-content: center;
border-radius: 104rpx;
font-family: PingFang SC;
}
.row .rowContent .hot .text {
text-align: left;
font-family: PingFang SC Medium;
font-size: 24rpx;
color: #FFFFFF;
letter-spacing: -0.33px;
}
.row .rowContent .new .text {
text-align: left;
font-family: PingFang SC Medium;
font-size: 24rpx;
color: #FFFFFF;
letter-spacing: -0.33px;
}
.rowType2 {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.rowType2 .item {
width: 224rpx;
height: 210rpx;
margin-left: 20rpx;
display: flex;
flex-direction: column;
}
.rowType2 .item .item_img{
width: 224rpx;
height: 100rpx;
margin-top: 41rpx;
}
.rowType2 .item .item_title{
width: 224rpx;
height: 30rpx;
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-family: PingFang SC;
font-size: 24rpx;
color: #B0B0B0;
letter-spacing: -0.33px;
margin-top: 20rpx;
}
\ No newline at end of file
... ...
... ... @@ -7,14 +7,6 @@ Component({
data: {
},
// attached: function () {
// try {
// console.log('===========Component================');
// console.log(this.properties.data);
// console.log('====================================');
// } catch(e) {
// }
// },
methods: {
onButtonTapped: function (event) {
this.triggerEvent('tapOperationBar', event);
... ...
... ... @@ -41,8 +41,7 @@ Page({
duration: 1000,
banner: [],
custom_brands: '',
brandsTextFilter: [],
currentBrandFliter: 0,
switchData:{},
all_list: [],
hot_list: [],
... ... @@ -59,8 +58,7 @@ Page({
cacheBrandResourceDataForKid: '',
hotKeyword: {},
searching: false,
switchData:{}
searching: false
},
/**
... ... @@ -105,10 +103,15 @@ Page({
},
onReachBottom: function () {
},
switchBrandFliter: function (event) {
let currentBrandFliter = event.detail.currentTarget.dataset.brandFliter;
let brandsTextFilter = this.data.switchData.brandsTextFilter;
this.setData({
currentBrandFliter,
switchData:{brandsTextFilter,currentBrandFliter}
});
},
... ... @@ -165,9 +168,6 @@ Page({
new_list,
all_list_key,
});
console.log('============3=======================');
console.log(brandListData);
console.log('====================================');
} else {
this.fetchBrandList();
}
... ... @@ -180,8 +180,6 @@ Page({
this.setData({
banner,
custom_brands,
brandsTextFilter,
currentBrandFliter,
switchData:{brandsTextFilter,currentBrandFliter}
});
} else {
... ... @@ -203,19 +201,12 @@ Page({
api.get({data:param})
.then(data => {
let json = parseListResources(data.data);
console.log('===============1====================');
console.log(json);
console.log('====================================');
let all_list = json.all_list;
let hot_list = json.hot_list;
let new_list = json.new_list;
let all_list_key = json.all_list_key;
//记录缓存数据
let key = that.data.currentChannelId;
console.log('===============&&&====================');
console.log(key);
console.log('====================================');
if (key == 1) {
that.setData({
cacheBrandListDataForMen: json,
... ... @@ -240,6 +231,7 @@ Page({
console.log('============2=======================');
console.log(this.data.all_list);
console.log(all_list);
console.log(all_list_key);
console.log('====================================');
})
.catch(error => {
... ... @@ -292,8 +284,6 @@ Page({
that.setData({
banner,
custom_brands,
brandsTextFilter,
currentBrandFliter,
switchData:{brandsTextFilter,currentBrandFliter}
});
})
... ... @@ -343,7 +333,7 @@ Page({
},
brandItemTapped: function(event) {
let brandItem = event.currentTarget.dataset.brandItem;
let brandItem = event.detail.currentTarget.dataset.brandItem;
let shop_id = brandItem.shop_id;
if (shop_id) {
... ... @@ -374,7 +364,11 @@ Page({
handlerAlphaTap(e) {
let { ap } = e.target.dataset;
let ap = e.target.dataset.ap;
console.log('====================================');
console.log(e);
console.log(ap);
console.log('====================================');
this.setData({ scrollToView: ap });
},
... ... @@ -406,24 +400,18 @@ function parseListResources(json) {
let reg = /^[a-zA-Z]*$/;
let all_list = {};
let otherList = [];
let all_list_key = {};
let all_list_key = [];
for (let k in all_list_old) {
all_list_key.push(k);
if (reg.test(k)) {
all_list_key[k] = {
key: k,
};
all_list[k] = all_list_old[k];
} else {
Array.prototype.push.apply(otherList, all_list_old[k]);
}
}
all_list['0-9'] = otherList;
all_list_key['0-9'] = {
key: '0-9',
};
for (var i = 0; i < hot_list.length; i++) {
let item = hot_list[i];
... ... @@ -434,17 +422,12 @@ function parseListResources(json) {
let item = new_list[i];
item.brand_ico = item.brand_ico.replace(/{width}/g, 368).replace(/{height}/g, 184).replace('{mode}', 2);
}
console.log('============4=======================');
console.log(all_list);
console.log('====================================');
return {
all_list,
hot_list,
new_list,
all_list_key,
};
}
function parseResourceResources(json) {
... ...
... ... @@ -3,6 +3,7 @@
"usingComponents": {
"brandSearch": "../../components/category/brandSearch/brandSearch",
"brandSwitcher": "../../components/category/brandSwitcher/brandSwitcher",
"genderSwitcher": "../../components/category/gender-switcher/gender-switcher"
"genderSwitcher": "../../components/category/gender-switcher/gender-switcher",
"allBrandsComponent": "../../components/category/allBrands/allBrands"
}
}
\ No newline at end of file
... ...
... ... @@ -37,57 +37,20 @@
<brandSwitcher data='{{switchData}}' catchswitchBrandFliter="switchBrandFliter"></brandSwitcher>
<view>{{currentBrandFliter}}</view>
<view>{{all_list.length}}</view>
<block tt:if="{{currentBrandFliter == 0}}">
<view>{{all_list.length}}</view>
<block tt:for="{{all_list}}" tt:key="{{index}}" tt:for-item="item">
<view id="{{index == '0-9' ? 'last' : index}}" class='sessionTitle'>
<text class='sessionText'>{{index == '0-9' ? '0' : index}}</text>
</view>
<block tt:for="{{item}}" tt:key="{{unique}}" tt:for-item="item">
<view class='row' tt:if="{{item.type == 2}}" bindtap="brandItemTapped" data-brand-item="{{item}}" data-F_ID="{{1003}}" data-F_INDEX="{{3}}" data-I_INDEX="{{index}}">
<view class='rowContent'>
<text class='title'>{{item.brand_name}}</text>
<view class='new' tt:if="{{item.is_show_new == 'Y'}}">
<text class='text'>NEW</text>
</view>
<view class='hot' tt:if="{{item.is_hot == 'Y'}}">
<text class='text'>HOT</text>
</view>
</view>
<view class='spaceLine'/>
</view>
</block>
</block>
<block tt:if="{{switchData.currentBrandFliter == 0}}">
<allBrandsComponent data="{{all_list}}" onlyTextBrand="1" bindbrandItemTapped="brandItemTapped"></allBrandsComponent>
</block>
<block tt:elif="{{currentBrandFliter == 1}}">
<view class='rowType2'>
<block tt:for="{{new_list}}" tt:key="{{index}}" tt:for-item="item">
<view class='item' tt:if="{{item.type == 2}}" bindtap="brandItemTapped" data-brand-item="{{item}}" data-F_ID="{{1003}}" data-F_INDEX="{{3}}" data-I_INDEX="{{index}}">
<image src="{{item.brand_ico}}" class="item_img" mode="aspectFit"></image>
<text class='item_title'>{{item.brand_name}}</text>
</view>
</block>
</view>
<block tt:elif="{{switchData.currentBrandFliter == 1}}">
<allBrandsComponent data="{{new_list}}" bindbrandItemTapped="brandItemTapped"></allBrandsComponent>
</block>
<block tt:elif="{{currentBrandFliter == 2}}">
<view class='rowType2'>
<block tt:for="{{hot_list}}" tt:key="{{index}}" tt:for-item="item">
<view class='item' tt:if="{{item.type == 2}}" bindtap="brandItemTapped" data-brand-item="{{item}}" data-F_ID="{{1003}}" data-F_INDEX="{{3}}" data-I_INDEX="{{index}}">
<image src="{{item.brand_ico}}" class="item_img" mode="aspectFit"></image>
<text class='item_title'>{{item.brand_name}}</text>
</view>
</block>
</view>
<block tt:elif="{{switchData.currentBrandFliter == 2}}">
<allBrandsComponent data="{{hot_list}}" bindbrandItemTapped="brandItemTapped"></allBrandsComponent>
</block>
</scroll-view>
<view class="alphanet-selector" data-id="selector" catchtouchstart="handlerAlphaTap" catchtouchmove="handlerMove" tt:if="{{currentBrandFliter == 0}}">
<view class="selector-one" data-ap="{{item.key=='0-9' ? 'last' : item.key}}" tt:for="{{all_list_key}}" tt:key="unique">
{{item.key=="0-9" ? '0' : item.key}}
<view class="alphanet-selector" data-id="selector" catchtouchstart="handlerAlphaTap" catchtouchmove="handlerMove" tt:if="{{switchData.currentBrandFliter == 0}}">
<view class="selector-one" data-ap="{{item.key=='0-9' ? 'last' : item}}" tt:for="{{all_list_key}}" tt:key="unique">
{{(item=="0-9" || item=="0~9") ? '0' : item}}
</view>
</view>
</view>
... ...
... ... @@ -91,134 +91,6 @@
margin-top: 10rpx;
}
.sessionTitle {
display: flex;
align-items: center;
height: 58rpx;
width: 100%;
background: #F0F0F0;
}
.sessionTitle .sessionText {
text-align: left;
margin-left: 30rpx;
font-weight: bold;
font-family: PingFang SC;
font-size: 28rpx;
color: #B0B0B0;
letter-spacing: -0.39px;
}
.row {
height: 88rpx;
width: 100%;
background: white;
}
.row .rowContent {
display: flex;
align-items: center;
height: 86rpx;
width: 92%;
margin-left: 4%;
flex-direction: row;
background: white;
}
.row .spaceLine {
height: 2rpx;
width: 92%;
margin-left: 4%;
background: #F0F0F0;
}
.row .rowContent .title {
text-align: left;
max-width: 500rpx;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-family: PingFang SC;
font-size: 28rpx;
color: #444444;
letter-spacing: -0.39px;
}
.row .rowContent .hot {
display: flex;
align-items: center;
height: 30rpx;
width: 76rpx;
margin-left: 40rpx;
justify-content: center;
background: #D0021B;
border-radius: 104rpx;
}
.row .rowContent .new {
display: flex;
align-items: center;
height: 30rpx;
width: 76rpx;
background: green;
margin-left: 40rpx;
justify-content: center;
border-radius: 104rpx;
}
.row .rowContent .hot .text {
text-align: left;
font-family: PingFang SC Medium;
font-size: 24rpx;
color: #FFFFFF;
letter-spacing: -0.33px;
}
.row .rowContent .new .text {
text-align: left;
font-family: PingFang SC Medium;
font-size: 24rpx;
color: #FFFFFF;
letter-spacing: -0.33px;
}
.rowType2 {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.rowType2 .item {
width: 224rpx;
height: 210rpx;
margin-left: 20rpx;
display: flex;
flex-direction: column;
}
.rowType2 .item .item_img{
width: 224rpx;
height: 100rpx;
margin-top: 41rpx;
}
.rowType2 .item .item_title{
width: 224rpx;
height: 30rpx;
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-family: PingFang SC;
font-size: 24rpx;
color: #B0B0B0;
letter-spacing: -0.33px;
margin-top: 20rpx;
}
.alphanet-selector {
position: absolute;
top: 0px;
... ... @@ -241,7 +113,7 @@
font-style: normal;
font-stretch: normal;
text-align: center;
font-family: PingFang SC Medium;
font-family: PingFang SC;
font-size: 22rpx;
color: #444444;
letter-spacing: 0.79px;
... ...