|
|
@ -3,24 +3,34 @@ |
|
|
<view class="top"> |
|
|
<view class="top"> |
|
|
<uni-notice-bar show-get-more show-icon more-text="查看更多" text="年末大礼:uni-app1.4 新增百度、支付宝小程序。插件市场重磅上线!" |
|
|
<uni-notice-bar show-get-more show-icon more-text="查看更多" text="年末大礼:uni-app1.4 新增百度、支付宝小程序。插件市场重磅上线!" |
|
|
@getmore="getMore" /> |
|
|
@getmore="getMore" /> |
|
|
<uni-notice-bar show-icon scrollable |
|
|
</view> |
|
|
text="uni-app 版正式发布,开发一次,同时发布iOS、Android、H5、微信小程序、支付宝小程序、百度小程序、头条小程序等7大平台。" /> |
|
|
<view class="my-message"> |
|
|
|
|
|
<view class="left"> |
|
|
|
|
|
<image :src="userInfo.img" mode=""></image> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="right"> |
|
|
|
|
|
{{userInfo.username}} |
|
|
|
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
<view class="middle"> |
|
|
<view class="middle"> |
|
|
<uni-section title="我的資金" type="line" padding> |
|
|
<uni-section title="我的资金" type="line" padding> |
|
|
<text>錢包餘額</text> |
|
|
<uni-group mode="card"> |
|
|
|
|
|
<view>啦啦啦</view> |
|
|
|
|
|
</uni-group> |
|
|
</uni-section> |
|
|
</uni-section> |
|
|
</view> |
|
|
</view> |
|
|
<view class="foot"> |
|
|
<view class="foot"> |
|
|
<uni-section title="更多服務" type="line" padding> |
|
|
<uni-section title="更多服务" type="line"> |
|
|
<uni-grid :column="4" :highlight="true" @change="change"> |
|
|
<uni-group mode="card"> |
|
|
|
|
|
<uni-grid :column="3" @change="change" :showBorder="false" :square="true"> |
|
|
<uni-grid-item v-for="(item, index) in list" :index="index" :key="index"> |
|
|
<uni-grid-item v-for="(item, index) in list" :index="index" :key="index"> |
|
|
<view class="grid-item-box" style="background-color: #fff;" > |
|
|
<view class="grid-item-box" style="background-color: #fff;"> |
|
|
<uni-icons type="image" :size="30" color="#777" /> |
|
|
<uni-icons type="image" :size="30" color="#777" /> |
|
|
<text class="text">{{item}}</text> |
|
|
<text class="text">{{item.title}}</text> |
|
|
</view> |
|
|
</view> |
|
|
</uni-grid-item> |
|
|
</uni-grid-item> |
|
|
</uni-grid> |
|
|
</uni-grid> |
|
|
|
|
|
</uni-group> |
|
|
</uni-section> |
|
|
</uni-section> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
@ -30,35 +40,79 @@ |
|
|
export default { |
|
|
export default { |
|
|
data() { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
|
list:['美團外賣','支付助手','廣告助手','上傳圖片','消息通知','我的信息','我的短信','我的頭像'] |
|
|
list:[{ |
|
|
|
|
|
url: '/pages/userInfo/about/about', |
|
|
|
|
|
title: '关于节点', |
|
|
|
|
|
img: '' |
|
|
|
|
|
},{ |
|
|
|
|
|
url: '/pages/userInfo/contact/contact', |
|
|
|
|
|
title: '联系我们', |
|
|
|
|
|
img: '' |
|
|
|
|
|
},{ |
|
|
|
|
|
url: '/pages/userInfo/extends/extends', |
|
|
|
|
|
title: '邀请他人', |
|
|
|
|
|
img: '' |
|
|
|
|
|
},{ |
|
|
|
|
|
url: '/pages/userInfo/inviteLog/inviteLog', |
|
|
|
|
|
title: '邀请记录', |
|
|
|
|
|
img: '' |
|
|
|
|
|
},{ |
|
|
|
|
|
url: '/pages/userInfo/notice/notice', |
|
|
|
|
|
title: '通知公告', |
|
|
|
|
|
img: '' |
|
|
|
|
|
},{ |
|
|
|
|
|
url: '/pages/userInfo/withdraw/withdraw', |
|
|
|
|
|
title: '提现记录', |
|
|
|
|
|
img: '' |
|
|
|
|
|
}], |
|
|
|
|
|
pageUrl: '' |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
methods: { |
|
|
methods: { |
|
|
change(e) { |
|
|
change(e) { |
|
|
// this.index = e.detail.index |
|
|
|
|
|
let { |
|
|
let { |
|
|
index |
|
|
index |
|
|
} = e.detail |
|
|
} = e.detail |
|
|
this.list[index].badge && this.list[index].badge++ |
|
|
this.list[index].badge && this.list[index].badge++ |
|
|
|
|
|
this.pageUrl = this.list[index].url |
|
|
uni.showToast({ |
|
|
console.log('this.pageUrl',this.pageUrl) |
|
|
title: `点击第${index+1}个宫格`, |
|
|
/** 跳转指定页面*/ |
|
|
icon: 'none' |
|
|
uni.navigateTo({ |
|
|
}) |
|
|
url: this.pageUrl |
|
|
|
|
|
}); |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style lang="scss"> |
|
|
<style lang="scss"> |
|
|
.middle { |
|
|
.container{ |
|
|
margin-top: 80px; |
|
|
font-family:‘Franklin Gothic Medium’, ‘Arial Narrow’, Arial, sans-serif; |
|
|
|
|
|
} |
|
|
|
|
|
.my-message { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
justify-content: flex-start; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
padding: 20rpx; |
|
|
|
|
|
|
|
|
|
|
|
.left { |
|
|
|
|
|
width: 100rpx; |
|
|
|
|
|
height: 100rpx; |
|
|
|
|
|
margin-right: 20rpx; |
|
|
|
|
|
|
|
|
|
|
|
>image { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 100%; |
|
|
|
|
|
border-radius: 50%; |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.foot { |
|
|
.right { |
|
|
margin-top: 80px; |
|
|
font-size: 12px; |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// .container { |
|
|
// .container { |
|
|
// .top { |
|
|
// .top { |
|
|
// width: 100vw; |
|
|
// width: 100vw; |
|
|
|