@ -0,0 +1,93 @@ | |||||
// Pages/travel/plan/main/index/index.js | |||||
Page({ | |||||
/** | |||||
* 页面的初始数据 | |||||
*/ | |||||
data: { | |||||
currentTab : 0, | |||||
list : [{ | |||||
iconPath: "/asset/img/icon-main.png", | |||||
selectedIconPath: "/asset/img/icon-main0.png", | |||||
text: "主日程"},{ | |||||
iconPath: "/asset/img/icon-wish.png", | |||||
selectedIconPath: "/asset/img/icon-wish0.png", | |||||
text: "愿望清单" | |||||
},{ | |||||
iconPath: "/asset/img/icon-ass.png", | |||||
selectedIconPath: "/asset/img/icon-ass0.png", | |||||
text: "副日程" | |||||
},{ | |||||
iconPath: "/asset/img/icon-member.png", | |||||
selectedIconPath: "/asset/img/icon-member0.png", | |||||
text: "成员" | |||||
}] | |||||
}, | |||||
switchTab: function (e) { | |||||
let that = this; | |||||
if (this.data.currentTab === e.target.dataset.current) { | |||||
return false; | |||||
} else { | |||||
that.setData({ | |||||
currentTab: e.target.dataset.current, | |||||
}); | |||||
} | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面加载 | |||||
*/ | |||||
onLoad: function (options) { | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面初次渲染完成 | |||||
*/ | |||||
onReady: function () { | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面显示 | |||||
*/ | |||||
onShow: function () { | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面隐藏 | |||||
*/ | |||||
onHide: function () { | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面卸载 | |||||
*/ | |||||
onUnload: function () { | |||||
}, | |||||
/** | |||||
* 页面相关事件处理函数--监听用户下拉动作 | |||||
*/ | |||||
onPullDownRefresh: function () { | |||||
}, | |||||
/** | |||||
* 页面上拉触底事件的处理函数 | |||||
*/ | |||||
onReachBottom: function () { | |||||
}, | |||||
/** | |||||
* 用户点击右上角分享 | |||||
*/ | |||||
onShareAppMessage: function () { | |||||
} | |||||
}) |
@ -0,0 +1,8 @@ | |||||
{ | |||||
"usingComponents": { | |||||
"main" : "/components/main/main", | |||||
"wish" : "/components/wish/wish", | |||||
"assistant" : "/components/assistant/assistant", | |||||
"member" : "/components/member/member" | |||||
} | |||||
} |
@ -0,0 +1,25 @@ | |||||
<!--Pages/travel/plan/main/index/index.wxml--> | |||||
<view hidden="{{currentTab == 0? false: true}}"> | |||||
<main /> | |||||
</view> | |||||
<view hidden="{{currentTab == 1? false: true}}"> | |||||
<wish /> | |||||
</view> | |||||
<view hidden="{{currentTab == 2? false: true}}"> | |||||
<assistant /> | |||||
</view> | |||||
<view hidden="{{currentTab == 3? false: true}}"> | |||||
<member /> | |||||
</view> | |||||
<view class="tab-bar"> | |||||
<view wx:for="{{list}}" wx:for-index="idx" wx:for-item="item" wx:key="prototype" class="tab-bar-item {{currentTab == idx ? 'active' : 'default'}}" data-current="{{idx}}" bindtap="switchTab"> | |||||
<cover-image src="{{currentTab === idx ? item.selectedIconPath : item.iconPath}}"></cover-image> | |||||
<text wx:for-index="idx" data-current="{{idx}}" src="{{currentTab == idx ? item.selectedIconPath : item.iconPath }}">{{item.text}}</text> | |||||
</view> | |||||
<image src="/asset/img/hangou1.png" mode="heightFix" class="hg"></image> | |||||
</view> | |||||
@ -0,0 +1,50 @@ | |||||
/* Pages/travel/plan/main/index/index.wxss */ | |||||
/* Pages/travel/follow/index/index.wxss */ | |||||
.tab-bar{ | |||||
width:100%; | |||||
position: fixed; | |||||
bottom:20px; | |||||
left:30px; | |||||
display: flex; | |||||
padding-bottom: env(safe-area-inset-bottom); | |||||
} | |||||
.tab-bar-item{ | |||||
width: 15%; | |||||
padding: 0; | |||||
margin: 0px; | |||||
padding-left: 1.5vw; | |||||
text-align: center; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
flex-direction: column; | |||||
height: 30%; | |||||
} | |||||
.default{ | |||||
font-weight: 550; | |||||
font-size: 12px; | |||||
color: #7B8B6F; | |||||
} | |||||
.active{ | |||||
font-size: 13px; | |||||
font-weight: 900; | |||||
color:black; | |||||
} | |||||
.tab-bar-item cover-image { | |||||
width: 25px; | |||||
height: 27px; | |||||
} | |||||
.hg{ | |||||
padding: 0; | |||||
margin: 0; | |||||
position: absolute; | |||||
width: 50px; | |||||
height: 130px; | |||||
left: 65%; | |||||
bottom: env(safe-area-inset-bottom); | |||||
} |