|
@@ -1,28 +1,26 @@
|
|
<template>
|
|
<template>
|
|
- <view :style="{ minHeight: sys.windowHeight + 'px' }" :class="[$tm.vx.state().tmVuetify.black ? 'black' : ' ']"
|
|
|
|
|
|
+ <view :class="[$tm.vx.state().tmVuetify.black ? 'black' : ' ']"
|
|
class="bodycont">
|
|
class="bodycont">
|
|
<tm-menubars ref="fenleig" title="分类" :shadow="0" :showback="true"></tm-menubars>
|
|
<tm-menubars ref="fenleig" title="分类" :shadow="0" :showback="true"></tm-menubars>
|
|
- <div class="cont" :style="{ height: (sys.windowHeight-80) + 'px' }">
|
|
|
|
- <tm-sheet black>
|
|
|
|
- <tm-sliderNav :style="{ height: (sys.windowHeight-80) + 'px' }" class="zuo fl" @change="change"
|
|
|
|
- :list="list" text color="red">
|
|
|
|
-
|
|
|
|
- </tm-sliderNav>
|
|
|
|
- <view class="fr you" :style="{ height: (sys.windowHeight-80) + 'px' }">
|
|
|
|
- <view class="huadong">
|
|
|
|
- <view class="py-10 text-size-g dianz mingri text-align-center mt-40">
|
|
|
|
- <image src="/static/img/88.png" mode="widthFix"></image>
|
|
|
|
- <text class="text-white">精选推荐</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="yiguicla mt-20 ml-20 fl" v-for="item in quanbuList" @click="sort(item.id)">
|
|
|
|
|
|
+ <div class="cont">
|
|
|
|
+ <tm-sliderNav :activeIndex="activeIndex" class="zuo fl" @change="change" :list="list" text color="red"></tm-sliderNav>
|
|
|
|
+ <view class="fr you">
|
|
|
|
+ <view class="huadong">
|
|
|
|
+ <view class="py-10 text-size-g dianz mingri text-align-center mt-40">
|
|
|
|
+ <image src="/static/img/88.png" mode="widthFix"></image>
|
|
|
|
+ <text class="text-white">精选推荐</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="yiguicla mt-20 fl" v-for="item in quanbuList" @click="sort(item.id)">
|
|
|
|
+ <view class="waicont">
|
|
<image :src="item.src" mode="widthFix"></image>
|
|
<image :src="item.src" mode="widthFix"></image>
|
|
<view class="wenzi text-align-center text-size-m mt-8">{{item.text}}</view>
|
|
<view class="wenzi text-align-center text-size-m mt-8">{{item.text}}</view>
|
|
</view>
|
|
</view>
|
|
- <view style="width:100%;height:40px;clear: both;"></view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
+ <tm-empty v-if="quanbuList.length ==0" label="暂无数据" color="white" icon="icon-paperplane-fill"></tm-empty>
|
|
|
|
+ <view style="width:100%;height:40px;clear: both;"></view>
|
|
</view>
|
|
</view>
|
|
- <view style="clear: both;"></view>
|
|
|
|
- </tm-sheet>
|
|
|
|
|
|
+ </view>
|
|
|
|
+ <view style="clear: both;"></view>
|
|
</div>
|
|
</div>
|
|
<!-- 弹出层消息 -->
|
|
<!-- 弹出层消息 -->
|
|
<tm-message ref="toast"></tm-message>
|
|
<tm-message ref="toast"></tm-message>
|
|
@@ -36,16 +34,15 @@
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
list: [],
|
|
list: [],
|
|
- quanbuList: [
|
|
|
|
- // {
|
|
|
|
- // src: '/static/img/45.png',
|
|
|
|
- // text: 'NEO CITY 涂鸦',
|
|
|
|
- // type: '手提包'
|
|
|
|
- // },
|
|
|
|
- ]
|
|
|
|
|
|
+ quanbuList: {},
|
|
|
|
+ activeIndex:0,
|
|
|
|
+ frist:2,
|
|
};
|
|
};
|
|
},
|
|
},
|
|
- onLoad() {
|
|
|
|
|
|
+ onLoad(e) {
|
|
|
|
+ this.activeIndex=e.index?e.index:0;
|
|
|
|
+ this.frist=e.index?1:2;
|
|
|
|
+ console.log(this.activeIndex)
|
|
},
|
|
},
|
|
created() {
|
|
created() {
|
|
this.sys = uni.getSystemInfoSync();
|
|
this.sys = uni.getSystemInfoSync();
|
|
@@ -60,7 +57,6 @@
|
|
method: 'get',
|
|
method: 'get',
|
|
data: that.reqData
|
|
data: that.reqData
|
|
}).then(res => {
|
|
}).then(res => {
|
|
- console.log(res.data);
|
|
|
|
if (res.data.code == 200) {
|
|
if (res.data.code == 200) {
|
|
res.data.data.forEach(item => {
|
|
res.data.data.forEach(item => {
|
|
that.list.push({
|
|
that.list.push({
|
|
@@ -69,7 +65,7 @@
|
|
title: item.category_name
|
|
title: item.category_name
|
|
})
|
|
})
|
|
})
|
|
})
|
|
- this.change(0)
|
|
|
|
|
|
+ this.change(this.activeIndex)
|
|
} else {
|
|
} else {
|
|
that.$refs.toast.show({
|
|
that.$refs.toast.show({
|
|
model: 'error',
|
|
model: 'error',
|
|
@@ -81,6 +77,11 @@
|
|
// 切换更换二级分类
|
|
// 切换更换二级分类
|
|
change(e) {
|
|
change(e) {
|
|
let that = this;
|
|
let that = this;
|
|
|
|
+ if(this.frist==2){
|
|
|
|
+ this.activeIndex=e;
|
|
|
|
+ }
|
|
|
|
+ this.frist=2;
|
|
|
|
+ console.log(e)
|
|
myRequest({
|
|
myRequest({
|
|
url: '/api/ShopGoods/getMallChildrenClassification',
|
|
url: '/api/ShopGoods/getMallChildrenClassification',
|
|
method: 'post',
|
|
method: 'post',
|
|
@@ -117,85 +118,95 @@
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
- /deep/ .tm-menubars .body {
|
|
|
|
- background-color: #1b1b1b !important;
|
|
|
|
|
|
+ page,uni-page-body,.bodycont{
|
|
|
|
+ height: 100% !important;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ }
|
|
|
|
+ // /deep/ .tm-menubars .body {
|
|
|
|
+ // background-color: #1b1b1b !important;
|
|
|
|
+ // }
|
|
|
|
+ .huadong{
|
|
|
|
+ width: 90%;
|
|
|
|
+ margin: 0 auto;
|
|
}
|
|
}
|
|
-
|
|
|
|
- // /deep/ .zhuti{padding: 10px 10px;}
|
|
|
|
- // page,.bodycont{height:100%;}
|
|
|
|
/deep/ .cont {
|
|
/deep/ .cont {
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
|
|
+ height: calc(100% - 45px) !important;
|
|
}
|
|
}
|
|
-
|
|
|
|
/deep/ .kuang {
|
|
/deep/ .kuang {
|
|
margin: 0 !important;
|
|
margin: 0 !important;
|
|
padding: 0px !important;
|
|
padding: 0px !important;
|
|
}
|
|
}
|
|
-
|
|
|
|
/deep/ .zuo .grey-darken-4.bk {
|
|
/deep/ .zuo .grey-darken-4.bk {
|
|
background-color: #0D0D0D !important;
|
|
background-color: #0D0D0D !important;
|
|
}
|
|
}
|
|
-
|
|
|
|
- /deep/ .zuo .uni-scroll-view-content {
|
|
|
|
- background-color: #0D0D0D !important;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
|
|
+ // /deep/ .zuo .uni-scroll-view-content {
|
|
|
|
+ // background-color: #0D0D0D !important;
|
|
|
|
+ // }
|
|
/deep/ .cont .shadow-white-5 {
|
|
/deep/ .cont .shadow-white-5 {
|
|
padding: 0px !important;
|
|
padding: 0px !important;
|
|
margin: 0px !important
|
|
margin: 0px !important
|
|
}
|
|
}
|
|
-
|
|
|
|
/deep/ .zuo .border-red-l-2.bk {
|
|
/deep/ .zuo .border-red-l-2.bk {
|
|
border-left-color: #0178FD !important;
|
|
border-left-color: #0178FD !important;
|
|
}
|
|
}
|
|
-
|
|
|
|
/deep/ .zuo .text-red,
|
|
/deep/ .zuo .text-red,
|
|
/deep/ .zuo .text-grey-darken-1 {
|
|
/deep/ .zuo .text-grey-darken-1 {
|
|
color: white !important;
|
|
color: white !important;
|
|
}
|
|
}
|
|
-
|
|
|
|
.yiguicla image {
|
|
.yiguicla image {
|
|
width: 100%;
|
|
width: 100%;
|
|
display: block;
|
|
display: block;
|
|
- margin: 0 auto;
|
|
|
|
|
|
+
|
|
margin-top: 5px;
|
|
margin-top: 5px;
|
|
border-radius: 10px;
|
|
border-radius: 10px;
|
|
}
|
|
}
|
|
-
|
|
|
|
- .yiguicla {
|
|
|
|
- width: 45%;
|
|
|
|
|
|
+ .waicont{
|
|
|
|
+ overflow: hidden;
|
|
border-radius: 10px;
|
|
border-radius: 10px;
|
|
|
|
+ width: 80%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ position: relative;
|
|
|
|
+ }
|
|
|
|
+ .yiguicla{
|
|
|
|
+ width: 50%;
|
|
position: relative;
|
|
position: relative;
|
|
padding: 0px !important;
|
|
padding: 0px !important;
|
|
|
|
+ text-align: center;
|
|
}
|
|
}
|
|
-
|
|
|
|
.wenzi {
|
|
.wenzi {
|
|
position: absolute;
|
|
position: absolute;
|
|
bottom: 0px;
|
|
bottom: 0px;
|
|
- background: #BCC2C7;
|
|
|
|
|
|
+ background: rgba(158,165,172,0.8);
|
|
color: white;
|
|
color: white;
|
|
width: 100%;
|
|
width: 100%;
|
|
- height: 25px;
|
|
|
|
- border-radius: 0px 0px 10px 10px;
|
|
|
|
|
|
+ height: 27px;
|
|
|
|
+ line-height: 27px;
|
|
|
|
+ font-size: 13px;
|
|
}
|
|
}
|
|
-
|
|
|
|
- // /deep/ .zuo uni-scroll-view{height: calc(100% - 45px) !important;}
|
|
|
|
.mingri image {
|
|
.mingri image {
|
|
width: 25px;
|
|
width: 25px;
|
|
margin-right: 12px;
|
|
margin-right: 12px;
|
|
vertical-align: middle;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
-
|
|
|
|
.mingri text {
|
|
.mingri text {
|
|
vertical-align: middle;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
-
|
|
|
|
.you {
|
|
.you {
|
|
- width: calc(100% - 100px);
|
|
|
|
|
|
+ width: calc(100% - 80px);
|
|
|
|
+ overflow: auto;
|
|
|
|
+ background-color: #1b1b1b !important;
|
|
|
|
+ height: 100%;
|
|
overflow: auto;
|
|
overflow: auto;
|
|
}
|
|
}
|
|
-
|
|
|
|
.zuo {
|
|
.zuo {
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
|
|
+ width: 80px !important;
|
|
|
|
+ text-align: center;
|
|
|
|
+ background-color: #0D0D0D !important;
|
|
|
|
+ }
|
|
|
|
+ /deep/ uni-scroll-view{
|
|
|
|
+ width: 80px !important;
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|