hxx/uni-app-shopping
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

拨号api

Browse Source
This commit is contained in:
jqtmviyu@gmail.com 2021-03-05 22:32:07 +08:00
parent ea33ee8b36
commit aa8b768eb6
1 changed files with 131 additions and 108 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

239
src/pages/my/my.vue
View File

@ -1,72 +1,90 @@
<template>
<view>
<view class="user">
<!-- 1. 已登录 -->
<block v-if="userInfo.nickName">
<image class="user_avatar_bg" :src="userInfo.avatarUrl" mode="aspectFill"></image>
<u-avatar :src="userInfo.avatarUrl" mode="circle" :sex-icon="userInfo.gender===1? 'man' : 'woman'" show-sex="true" size="large" show-level="true" level-icon="level"></u-avatar>
<text class="user_nickName">{{userInfo.nickName}}</text>
</block>
<!-- 2. 未登录 -->
<button v-else open-type="getUserInfo" @getuserinfo="getUserInfo" class="user_btn">去登录</button>
</view>
<view>
<view class="user">
<!-- 1. 已登录 -->
<block v-if="userInfo.nickName">
<image
class="user_avatar_bg"
:src="userInfo.avatarUrl"
mode="aspectFill"
></image>
<u-avatar
:src="userInfo.avatarUrl"
mode="circle"
:sex-icon="userInfo.gender===1? 'man' : 'woman'"
show-sex="true"
size="large"
show-level="true"
level-icon="level"
></u-avatar>
<text class="user_nickName">{{userInfo.nickName}}</text>
</block>
<!-- 2. 未登录 -->
<button
v-else
open-type="getUserInfo"
@getuserinfo="getUserInfo"
class="user_btn"
>去登录</button>
</view>
<!-- 3 菜单:宫格布局 -->
<view class="grid">
<u-grid
:col="4"
:border="false"
>
<u-grid-item>
<u-icon
name="file-text"
:size="46"
></u-icon>
<view class="grid-text">待付款</view>
</u-grid-item>
<u-grid-item>
<u-icon
name="car"
:size="46"
></u-icon>
<view class="grid-text">待收货</view>
</u-grid-item>
<u-grid-item>
<u-icon
name="rmb-circle"
:size="46"
></u-icon>
<view class="grid-text">退货/退款</view>
</u-grid-item>
<u-grid-item>
<u-icon
name="order"
:size="46"
></u-icon>
<view class="grid-text">全部订单</view>
</u-grid-item>
</u-grid>
</view>
<!-- 3 菜单:宫格布局 -->
<view class="grid">
<u-grid
:col="4"
:border="false"
>
<u-grid-item>
<u-icon
name="file-text"
:size="46"
></u-icon>
<view class="grid-text">待付款</view>
</u-grid-item>
<u-grid-item>
<u-icon
name="car"
:size="46"
></u-icon>
<view class="grid-text">待收货</view>
</u-grid-item>
<u-grid-item>
<u-icon
name="rmb-circle"
:size="46"
></u-icon>
<view class="grid-text">退货/退款</view>
</u-grid-item>
<u-grid-item>
<u-icon
name="order"
:size="46"
></u-icon>
<view class="grid-text">全部订单</view>
</u-grid-item>
</u-grid>
</view>
<!-- 4. 单元格布局 -->
<u-cell-group>
<u-cell-item
icon="setting-fill"
title="个人设置"
:arrow="false"
></u-cell-item>
<u-cell-item
icon="server-man"
title="联系客服"
value="400-618-40000"
></u-cell-item>
<u-cell-item
icon="integral-fill"
title="当前版本"
value="v4.1.1"
></u-cell-item>
</u-cell-group>
</view>
<!-- 4. 单元格布局 -->
<u-cell-group>
<u-cell-item
icon="setting-fill"
title="个人设置"
:arrow="false"
></u-cell-item>
<u-cell-item
icon="server-man"
title="联系客服"
value="400-618-40000"
@click="phoneCall"
></u-cell-item>
<u-cell-item
icon="integral-fill"
title="当前版本"
value="v4.1.1"
></u-cell-item>
</u-cell-group>
</view>
</template>
<script>
@ -83,56 +101,61 @@ export default {
getUserInfo({detail: {userInfo}}){
this.userInfo = userInfo
uni.setStorageSync("userInfo",userInfo)
},
phoneCall(){
uni.makePhoneCall({
phoneNumber: '114'
})
}
},
}
</script>
<style lang="scss">
page {
background-color: #f9f9f9;
}
.user {
position: relative;
height: 330rpx;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
overflow: hidden;
.user_btn {
background-color: #07c160;
color: #fff;
width: 400rpx;
&::after {
border: none;
page {
background-color: #f9f9f9;
}
.user {
position: relative;
height: 330rpx;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
overflow: hidden;
.user_btn {
background-color: #07c160;
color: #fff;
width: 400rpx;
&::after {
border: none;
}
}
.user_avatar {
width: 172rpx;
height: 172rpx;
border-radius: 50%;
overflow: hidden;
}
.user_nickName {
font-size: 32rpx;
margin-top: 20rpx;
color: #fff;
}
}
.user_avatar {
width: 172rpx;
height: 172rpx;
border-radius: 50%;
overflow: hidden;
}
.user_nickName {
font-size: 32rpx;
margin-top: 20rpx;
color: #fff;
}
}
.user_avatar_bg {
width: 120%;
height: 120%;
position: absolute;
left: -10%;
top: -10%;
z-index: -1;
filter: blur(30px) grayscale(20%);
}
.user_avatar_bg {
width: 120%;
height: 120%;
position: absolute;
left: -10%;
top: -10%;
z-index: -1;
filter: blur(30px) grayscale(20%);
}
.grid {
margin: 20rpx;
border-radius: 5rpx;
}
.grid {
margin: 20rpx;
border-radius: 5rpx;
}
</style>