修改首页页面样式,添加个人中心入口

main
jinna 2 years ago
parent 7e07a90ab9
commit 290343055a
  1. 69
      pages.json
  2. 92
      pages/pages_zhentou/homePage/homePage.vue
  3. BIN
      static/image/person.png

@ -204,40 +204,41 @@
"navigationBarBackgroundColor": "#F1F1F1" "navigationBarBackgroundColor": "#F1F1F1"
} }
}, }
"tabBar": { // "tabBar": {
"color": "#7A7E83", // "color": "#7A7E83",
"selectedColor": "#007AFF", // "selectedColor": "#007AFF",
"borderStyle": "black", // "borderStyle": "black",
"backgroundColor": "#F8F8F8", // "backgroundColor": "#F8F8F8",
"list": [{ // "list": [
"pagePath": "pages/pages_zhentou/homePage/homePage",
// "iconPath": "static/component.png",
// "selectedIconPath": "static/componentHL.png",
"text": "首页"
},
// { // {
// "pagePath": "pages/tabBar/form/form", // "pagePath": "pages/pages_zhentou/homePage/homePage",
// "iconPath": "static/api.png", // // "iconPath": "static/component.png",
// "selectedIconPath": "static/apiHL.png", // // "selectedIconPath": "static/componentHL.png",
// "text": "自定义表单" // "text": "首页"
// }, // },
{ // // {
"pagePath": "pages/pages_zhentou/order/order", // // "pagePath": "pages/tabBar/form/form",
// "iconPath": "static/api.png", // // "iconPath": "static/api.png",
// "selectedIconPath": "static/apiHL.png", // // "selectedIconPath": "static/apiHL.png",
"text": "订单" // // "text": "自定义表单"
}, { // // },
"pagePath": "pages/pages_zhentou/form/form", // {
// "iconPath": "static/extui.png", // "pagePath": "pages/pages_zhentou/order/order",
// "selectedIconPath": "static/extuiHL.png", // // "iconPath": "static/api.png",
"text": "报名单" // // "selectedIconPath": "static/apiHL.png",
}, { // "text": "订单"
"pagePath": "pages/pages_zhentou/myPage/myPage", // }, {
// "iconPath": "static/template.png", // "pagePath": "pages/pages_zhentou/form/form",
// "selectedIconPath": "static/templateHL.png", // // "iconPath": "static/extui.png",
"text": "我的" // // "selectedIconPath": "static/extuiHL.png",
} // "text": "报名单"
] // }, {
} // "pagePath": "pages/pages_zhentou/myPage/myPage",
// // "iconPath": "static/template.png",
// // "selectedIconPath": "static/templateHL.png",
// "text": "我的"
// }
// ]
// }
} }

@ -4,11 +4,19 @@
<image class="img" mode="widthFix" src="../../../static/image/bag.jpg"></image> <image class="img" mode="widthFix" src="../../../static/image/bag.jpg"></image>
<!-- <img class="img" src="../../../static/image/bag.jpg" mode=""></img> --> <!-- <img class="img" src="../../../static/image/bag.jpg" mode=""></img> -->
</view> </view>
<view class="per_box" @click="turnMyPage">
<view class="image_box">
<image class="img" src="../../../static/image/person.png" mode=""></image>
</view>
<view class="per_txt">
我的
</view>
</view>
<view class="bottom_box"> <view class="bottom_box">
<button class="btn" @click="addForm">填写报名单其他渠道已购买</button> <!-- <button class="btn" @click="addForm">填写报名单其他渠道已购买</button> -->
<button class="btn" v-if="!hasUserInfo &&canIUseGetUserProfile" @click="getUserProfile">定制</button> <button class="btn" v-if="!hasUserInfo &&canIUseGetUserProfile" @click="getUserProfile">立即定制</button>
<button v-else-if="!hasPhone" class="btn" @getphonenumber="getphonenumber">定制</button> <button v-else-if="!hasPhone" class="btn" @getphonenumber="getphonenumber">立即定制</button>
<button v-else class="btn" @click="clickCustom">定制</button> <button v-else class="btn" @click="clickCustom">立即定制</button>
</view> </view>
</view> </view>
</template> </template>
@ -44,6 +52,12 @@
clickCustom() { clickCustom() {
console.log('点击定制'); console.log('点击定制');
}, },
//
turnMyPage(){
uni.navigateTo({
url:"/pages/pages_zhentou/myPage/myPage"
})
},
// //
addForm() { addForm() {
// console.log('') // console.log('')
@ -123,14 +137,45 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.img_box { .img_box {
padding-bottom: 180rpx;
.img { .img {
width: 100%; width: 100%;
} }
} }
.per_box{
width: 70rpx;
height: 118rpx;
background: rgba(255, 255, 255, 0.8);
border-radius: 20rpx 20rpx 20rpx 20rpx;
position: fixed;
top: 30rpx;
right: 30rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
cursor: pointer;
.image_box{
width: 44rpx;
height: 44rpx;
.img{
width: 100%;
height: 100%;
}
}
.per_txt{
margin-top: 10rpx;
color: #333;
font-size: 24rpx;
}
}
.bottom_box { .bottom_box {
width: 100%; width: 100%;
height: 290rpx; height: 180rpx;
border-radius: 30rpx 30rpx 0rpx 0rpx; border-radius: 30rpx 30rpx 0rpx 0rpx;
background: #fff; background: #fff;
position: fixed; position: fixed;
@ -138,7 +183,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; // justify-content: center;
.btn { .btn {
@ -150,25 +195,26 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-top: 30rpx;
&:first-child { // &:first-child {
background: #E9B332; // background: #E9B332;
margin-bottom: 40rpx; // margin-bottom: 40rpx;
display: flex; // display: flex;
flex-direction: column; // flex-direction: column;
.form_txt{ // .form_txt{
height: 50rpx; // height: 50rpx;
font-size: 28rpx; // font-size: 28rpx;
display: flex; // display: flex;
align-items: center; // align-items: center;
} // }
.form_txt1{ // .form_txt1{
height: 30rpx; // height: 30rpx;
display: flex; // display: flex;
align-items: center; // align-items: center;
} // }
} // }
} }
} }
</style> </style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Loading…
Cancel
Save