我的页面、个人资料、会员充值页面修改
This commit is contained in:
GaoHao
@@ -178,11 +178,11 @@
|
||||
"navigationBarTitleText": "优惠券"
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
"path": "pages/user/information",
|
||||
"path": "pages/user/my_info",
|
||||
"style": {
|
||||
"navigationBarTitleText": "完善信息",
|
||||
"navigationStyle": "custom"
|
||||
"navigationBarTitleText": "个人资料"
|
||||
}
|
||||
},
|
||||
// {
|
||||
|
||||
332
pages/member/index - 副本.vue
Normal file
332
pages/member/index - 副本.vue
Normal file
@@ -0,0 +1,332 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<card :userInfo="userInfo"></card>
|
||||
<view class="therecontent">
|
||||
<input type="number" v-model="amount" placeholder="自定义金额">
|
||||
</view>
|
||||
<view class="fourcontent flex-start">
|
||||
<view class="fourcontentlnage" v-for="(item,index) in listdata" :key="index">
|
||||
<view class="flex-colum" :class="index == inputshow?'fourcontentitems':'fourcontentitem'"
|
||||
@click="clickinput(item,index)">
|
||||
<text>{{item.minNum}}元</text>
|
||||
<text style="margin-top: 10rpx;">充{{item.minNum}}送{{item.handselNum}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fivecontent" @tap="$u.debounce(userbalancerechangesub, 500)">
|
||||
立即充值
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import card from './components/card.vue'
|
||||
export default {
|
||||
components: {
|
||||
card
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
inputshow: 0,
|
||||
listdata: [],
|
||||
amount: '',
|
||||
userInfo: {},
|
||||
shopId: ''
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.shopId = e.shopId
|
||||
if (e.type == 'list') { //从列表进来的
|
||||
this.paygetShopByMember(e.shopId)
|
||||
} else {
|
||||
this.paygetShopByMember(e.shopId)
|
||||
}
|
||||
this.paygetActive(e.shopId) //列表
|
||||
|
||||
},
|
||||
methods: {
|
||||
async paygetShopByMember(w) {
|
||||
let res = await this.api.paygetShopByMember({
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
userId: uni.cache.get('userInfo').id,
|
||||
shopId: this.shopId
|
||||
})
|
||||
this.userInfo = res.data.list[0]
|
||||
},
|
||||
async paygetActive() {
|
||||
let res = await this.api.paygetActive({
|
||||
shopId: this.shopId,
|
||||
page: 1,
|
||||
pageSize: 10
|
||||
})
|
||||
try {
|
||||
this.listdata = res.data.list
|
||||
this.amount = res.data.list[0].minNum
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
},
|
||||
async userbalancerechangesub() {
|
||||
if (this.amount == null || this.amount == '') {
|
||||
uni.showToast({
|
||||
title: '金额不能为空',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.amount <= 0) {
|
||||
uni.showToast({
|
||||
title: '金额必须大于0',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let res = await this.api.paymemeberIn({
|
||||
shopId: this.shopId, // 判断显示哪家的作品,
|
||||
amount: this.amount // 判断显示哪家的作品,
|
||||
})
|
||||
if (res.code == 0) {
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true
|
||||
})
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay', //支付类型-固定值
|
||||
partnerid: res.data.appId, // 微信支付商户号
|
||||
timeStamp: res.data.timeStamp, // 时间戳（单位：秒）
|
||||
nonceStr: res.data.nonceStr, // 随机字符串
|
||||
package: res.data.package, // 固定值
|
||||
signType: res.data.signType, //固定值
|
||||
paySign: res.data.paySign, //签名
|
||||
success: (res) => {
|
||||
uni.showToast({
|
||||
title: "支付成功"
|
||||
})
|
||||
uni.hideLoading()
|
||||
setTimeout(res => {
|
||||
uni.navigateBack()
|
||||
}, 500)
|
||||
},
|
||||
fail: (res) => {
|
||||
uni.hideLoading()
|
||||
}
|
||||
});
|
||||
uni.hideLoading()
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
clickinput(a, b) {
|
||||
console.log(a, b)
|
||||
this.inputshow = b
|
||||
this.amount = a.minNum
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0 28rpx;
|
||||
|
||||
.towcontentitem {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
padding: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
background: linear-gradient(126deg, #FFFBF2 0%, #F2D093 100%);
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
|
||||
&::after {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 68rpx;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 240rpx;
|
||||
height: 232rpx;
|
||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/member.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.towcontentitemimage {
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 12rpx;
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
.towcontentitemone {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
|
||||
.towcontentitemoneimage {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.towcontentitemonetext {
|
||||
height: 76rpx;
|
||||
margin-left: 16rpx;
|
||||
|
||||
.towcontentitemonetextone {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontentitemonetexttow {
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemprogressa {
|
||||
padding: 8rpx 44rpx;
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-top: 54rpx;
|
||||
}
|
||||
|
||||
.towcontentitemtow {
|
||||
margin-top: 84rpx;
|
||||
z-index: 10;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
.towcontentitevip {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 92rpx;
|
||||
height: 40rpx;
|
||||
font-size: 20rpx;
|
||||
background: #F4C380;
|
||||
border-radius: 0rpx 12rpx 0rpx 12rpx;
|
||||
text-align: center;
|
||||
line-height: 40rpx;
|
||||
color: #fff;
|
||||
font-family: Source Han Sans CN-Medium;
|
||||
font-weight: Medium;
|
||||
|
||||
}
|
||||
|
||||
.towcontentitemthere {
|
||||
margin-left: 92rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: Medium;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
|
||||
.towcontentitemtheretext {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.therecontent {
|
||||
margin-top: 32rpx;
|
||||
position: relative;
|
||||
padding: 22rpx 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
|
||||
input {
|
||||
padding-left: 30rpx;
|
||||
text-align: right;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.therecontent::after {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 32rpx;
|
||||
transform: translateY(-50%);
|
||||
content: '￥';
|
||||
display: inline-block;
|
||||
width: 28rpx;
|
||||
height: 40rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fourcontent {
|
||||
.fourcontentlnage {
|
||||
width: 33.33%;
|
||||
|
||||
.fourcontentitem {
|
||||
margin: 24rpx 10rpx;
|
||||
padding: 16rpx 0;
|
||||
text-align: center;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
// border: 1rpx solid #333333;
|
||||
font-size: 28rpx;
|
||||
font-family: Roboto-Medium, Roboto;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fourcontentitems {
|
||||
margin: 24rpx 10rpx;
|
||||
padding: 16rpx 0;
|
||||
text-align: center;
|
||||
border-radius: 8rpx;
|
||||
background: #F1CB66;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
border: 2rpx solid #F1CB66;
|
||||
font-size: 28rpx;
|
||||
font-family: Roboto-Medium, Roboto;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fivecontent {
|
||||
position: relative;
|
||||
bottom: 44rpx;
|
||||
margin-top: 62rpx;
|
||||
padding: 20rpx 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-size: 36rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
background: #F1CB66;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,9 +1,30 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<card :userInfo="userInfo"></card>
|
||||
<view class="card_info flex-colum">
|
||||
<view class="title">账户余额(元)</view>
|
||||
<view class="card_info_con flex-between">
|
||||
<view class="balance">{{userInfo.amount || '0.00'}}</view>
|
||||
<view class="card_info_con_right flex-end">
|
||||
<view class="card_info_con_right_item flex-colum" v-for="(item,index) in cardManageList" :key="index">
|
||||
<image class="card_info_con_right_item_icon" :src="item.icon" mode="aspectFill"></image>
|
||||
<text class="card_info_con_right_item_text">{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="therecontent">
|
||||
<input type="number" v-model="amount" placeholder="自定义金额">
|
||||
</view>
|
||||
<view class="rechargeList">
|
||||
<view class="rechargeList_f" v-for="(item,index) in listdata" :key="index">
|
||||
<viwe class="rechargeList_item flex-colum">
|
||||
<view class="rechargeList_item_title">充值</view>
|
||||
<view class="rechargeList_item_amount">￥<text>{{item.minNum}}</text></view>
|
||||
<view class="rechargeList_item_handsel">赠送{{item.handselNum}}元</view>
|
||||
</viwe>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fourcontent flex-start">
|
||||
<view class="fourcontentlnage" v-for="(item,index) in listdata" :key="index">
|
||||
<view class="flex-colum" :class="index == inputshow?'fourcontentitems':'fourcontentitem'"
|
||||
@@ -31,7 +52,13 @@
|
||||
listdata: [],
|
||||
amount: '',
|
||||
userInfo: {},
|
||||
shopId: ''
|
||||
shopId: '',
|
||||
|
||||
cardManageList: [
|
||||
{name: "明细",icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/detail.png"},
|
||||
{name: "管理",icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/manage.png"}
|
||||
],
|
||||
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
@@ -132,8 +159,75 @@
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0 28rpx;
|
||||
|
||||
padding: 0 20rpx;
|
||||
|
||||
.card_info{
|
||||
width: 100%;
|
||||
height: 182rpx;
|
||||
background: linear-gradient( 132deg, #D6B68D 0%, #E6D6BC 100%);
|
||||
border-radius: 12rpx;
|
||||
padding: 32rpx 28rpx;
|
||||
align-items: initial;
|
||||
.title{
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.card_info_con{
|
||||
align-items: flex-end;
|
||||
.balance{
|
||||
font-weight: 400;
|
||||
font-size: 48rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.card_info_con_right{
|
||||
.card_info_con_right_item{
|
||||
margin-left: 64rpx;
|
||||
.card_info_con_right_item_icon{
|
||||
width: 40rpx;
|
||||
height: 36rpx;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
.card_info_con_right_item_text{
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rechargeList{
|
||||
display: flex;
|
||||
.rechargeList_f{
|
||||
width: 33.333%;
|
||||
.rechargeList_item{
|
||||
height: 168rpx;
|
||||
background: linear-gradient( 133deg, #F9F6ED 0%, #FFFFFF 100%);
|
||||
border-radius: 0rpx 48rpx 0rpx 0rpx;
|
||||
border: 4rpx solid #DCC19E;
|
||||
align-items: initial;
|
||||
.rechargeList_item_title,.rechargeList_item_handsel{
|
||||
font-weight: 400;
|
||||
font-size: 20rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.rechargeList_item_amount{
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
text{
|
||||
font-size: 44rpx;
|
||||
}
|
||||
}
|
||||
.rechargeList_item_handsel{
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitem {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
本店招牌菜
|
||||
</view>
|
||||
<view class="panelfive">
|
||||
<scroll-view :scroll-into-view="leftIntoView" :scroll-with-animation="false">
|
||||
<scroll-view :scroll-x="true" :scroll-with-animation="false">
|
||||
<view class="panelfive_list">
|
||||
<view class="panelfiveitem" @click="clickspecifications(item,index,index,'热销')"
|
||||
v-for="(item,index) in shopProductList.hots" :key="index">
|
||||
|
||||
333
pages/user/my_info.vue
Normal file
333
pages/user/my_info.vue
Normal file
@@ -0,0 +1,333 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
|
||||
<view class="info_list">
|
||||
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">头像</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<button class="list_item_right_head" type="default" open-type="chooseAvatar" @chooseavatar="uploadImg">
|
||||
<image class="list_item_right_head" :src="userHeadImg" mode="aspectFill"></image>
|
||||
</button>
|
||||
<u-icon name="arrow-right" color="#999999" size="16"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">昵称</view>
|
||||
<view class="list_item_right" style="width: 100%;">
|
||||
<u-input v-model="nickName" type="text" input-align="right" placeholder="请输入不支持特殊字符10个字以内" :custom-style="{color:'#333',fontSize: '28rpx',border:'none'}" placeholder-style="color:#999;font-size: 28rpx"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">账号</view>
|
||||
<view class="list_item_right ">
|
||||
<button open-type="getPhoneNumber" @getphonenumber="getPhone">
|
||||
<view class="flex-colum-end">
|
||||
<view class="text">{{phonetitle || '请授权手机号'}}</view>
|
||||
<view class="place" v-if="phonetitle">绑定的手机号不能修改</view>
|
||||
</view>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">性别</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<view class="place r" @click="sexShow = true">{{sexText}}</view>
|
||||
<u-picker @cancel="sexShow = false" :show="sexShow" :columns="sexList" keyName="label" @confirm="confirmSex"></u-picker>
|
||||
<u-icon name="arrow-right" color="#999999" size="16"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">生日</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<view class="place r" @click="calendarShow = true">生日一旦填写不能修改</view>
|
||||
<!-- <u-calendar @close="calendarShow = false" monthNum="99" minDate="1945-01-01" maxDate="2055-12-12" :show="calendarShow" mode="single" @confirm="confirmCalendar"></u-calendar> -->
|
||||
<!-- <u-picker :show="calendarShow" ref="uPicker" :columns="columns" @confirm="confirm" @change="changeHandler"></u-picker> -->
|
||||
<!-- <picker :show="calendarShow" mode="date"></picker> -->
|
||||
<u-datetime-picker
|
||||
mode="date"
|
||||
@cancel="calendarShow = false"
|
||||
:show="calendarShow"
|
||||
:minDate="-2208988800000"
|
||||
v-model="value1"
|
||||
@confirm="confirmTime"
|
||||
></u-datetime-picker>
|
||||
<u-icon name="arrow-right" color="#999999" size="16"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item" @click="boxClick">
|
||||
<view class="list_item_left">绑定微信</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<view class="text r">已绑定</view>
|
||||
<u-icon name="arrow-right" color="#999999" size="16"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="save" @click="sumbit">保存</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: {
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
sexShow: false,
|
||||
calendarShow: false,
|
||||
sexText: '请选择',
|
||||
value1: Number(new Date()),
|
||||
form: {
|
||||
sex: 1,
|
||||
address: '', //地址
|
||||
type: '', //品类
|
||||
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
|
||||
other: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore',
|
||||
},
|
||||
sexList: [
|
||||
[{
|
||||
value: 1,
|
||||
label: '男'
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
label: '女'
|
||||
},]
|
||||
],
|
||||
|
||||
userInfo: uni.cache.get('userInfo'),
|
||||
userHeadImg: "",
|
||||
nickName: '',
|
||||
phonetitle: ""
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
|
||||
},
|
||||
onLoad() {
|
||||
this.userInfo = uni.cache.get('userInfo')
|
||||
this.userHeadImg = this.userInfo.headImg;
|
||||
this.nickName = this.userInfo.nickName;
|
||||
this.sex = this.userInfo.sex;
|
||||
this.phonetitle = this.userInfo.telephone ? (this.userInfo.telephone.substr(0, 3) + "****" + this.userInfo.telephone.substr(7)) : ""
|
||||
this.date = this.getDate({ format: true})
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
/**
|
||||
* 确定生日
|
||||
* @param {Object} e
|
||||
*/
|
||||
confirmTime(e) {
|
||||
console.log(e);
|
||||
console.log(this.getDate(e.value))
|
||||
},
|
||||
|
||||
/**
|
||||
* 确定性别
|
||||
* @param {Object} e
|
||||
*/
|
||||
confirmSex(e) {
|
||||
this.sexShow = false;
|
||||
this.sex = e.value[0].value;
|
||||
this.sexText = e.value[0].label;
|
||||
console.log(e)
|
||||
},
|
||||
|
||||
getDate(time) { //年月日
|
||||
const date = new Date(time);
|
||||
// const date = new Date();
|
||||
let year = date.getFullYear();
|
||||
let month = date.getMonth() + 1;
|
||||
let day = date.getDate();
|
||||
|
||||
|
||||
month = month > 9 ? month : '0' + month;
|
||||
day = day > 9 ? day : '0' + day;
|
||||
return `${year}-${month}-${day}`;
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取手机号
|
||||
* @param {Object} d
|
||||
*/
|
||||
async getPhone(d) {
|
||||
if (d.detail.iv) {
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: async (data) => {
|
||||
console.log(data)
|
||||
let res = await this.api.userwxlogins({
|
||||
code: data.code,
|
||||
encryptedData: d.detail.encryptedData,
|
||||
iv: d.detail.iv,
|
||||
})
|
||||
this.phonetitle = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 取消绑定/退出登录
|
||||
*/
|
||||
boxClick() {
|
||||
uni.showModal({
|
||||
title: '注意',
|
||||
content: '确定要取消绑定吗？',
|
||||
success: async (res) => {
|
||||
if (res.confirm) {
|
||||
try {
|
||||
await this.api.loginOut();
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
uni.cache.clear();
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 上传头像
|
||||
* @param {Object} e
|
||||
*/
|
||||
uploadImg(e) {
|
||||
console.log(e)
|
||||
const {
|
||||
avatarUrl
|
||||
} = e.detail
|
||||
console.log(e)
|
||||
console.log(e.detail)
|
||||
// this.userHeadImg = avatarUrl
|
||||
uni.uploadFile({
|
||||
url: 'https://wxcashiertest.sxczgkj.cn/cashierService/common/upload',
|
||||
// url: uni.conf.baseUrl + '/common/upload',
|
||||
filePath: avatarUrl,
|
||||
header: {
|
||||
environment: 'app',
|
||||
type: 'android',
|
||||
version: '1.7.3',
|
||||
},
|
||||
name: "file",
|
||||
formData: {
|
||||
file: avatarUrl,
|
||||
},
|
||||
success: (uploadFileRes) => {
|
||||
let {
|
||||
data
|
||||
} = JSON.parse(uploadFileRes.data)
|
||||
this.userHeadImg = data
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
async sumbit() {
|
||||
let res = await this.api.upUserInfo({
|
||||
headImg: this.userHeadImg,
|
||||
nickName: this.nickName,
|
||||
sex: this.sex,
|
||||
telephone: this.phonetitle == '请授权手机号' ? '' : this.phonetitle
|
||||
})
|
||||
if (res.code == 0) {
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
HeighT() { //手机类型的尺寸
|
||||
return this.$store.getters.is_BarHeight
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
.container{
|
||||
.info_list{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 20rpx;
|
||||
.list_item{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 24rpx 0;
|
||||
border-bottom: 1rpx solid #E5E5E5;
|
||||
.list_item_left{
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.list_item_right{
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
.list_item_right_head{
|
||||
width: 98rpx;
|
||||
height: 98rpx;
|
||||
border-radius: 50rpx;
|
||||
margin-right: 16rpx;
|
||||
padding: 0;
|
||||
}
|
||||
.place{
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
line-height: initial;
|
||||
}
|
||||
.text{
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
line-height: initial;
|
||||
}
|
||||
|
||||
.r{
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
button{
|
||||
text{
|
||||
color: #fff!important;
|
||||
}
|
||||
}
|
||||
button::after{
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.save{
|
||||
width: 502rpx;
|
||||
height: 96rpx;
|
||||
line-height: 96rpx;
|
||||
text-align: center;
|
||||
background: #E0E0E0;
|
||||
border-radius: 48rpx;
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #999999;
|
||||
position: fixed;
|
||||
bottom: 100rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
384
pages/user/user - 副本.vue
Normal file
384
pages/user/user - 副本.vue
Normal file
@@ -0,0 +1,384 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- <view class="user-info-wrap" @click="clickinformation">
|
||||
<view style="width: 108rpx; height: 108rpx;border-radius: 50%;">
|
||||
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-if="userInfo.headImg"
|
||||
:src="userInfo.headImg" mode="aspectFill">
|
||||
</image>
|
||||
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-else src="@/static/avatar.png"
|
||||
mode="aspectFill">
|
||||
</image>
|
||||
</view>
|
||||
<view class="info flex-colum-start">
|
||||
<text class="phone">{{userInfo.nickName || '无'}}</text>
|
||||
</view>
|
||||
</view> -->
|
||||
<navseat :opacity='opacity' class="navseat" title='个人中心' :iconshow="false" :titleshow='true'></navseat>
|
||||
<view class="boxtop">
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<view :style="{'height':Topdistance+'px'}"></view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view :style="{'height':HeighT.customBar+HeighT.heightBar+'px'}"></view>
|
||||
<!-- #endif -->
|
||||
<view class="boxtop_top flex-between">
|
||||
<view class="boxtop_topleft">
|
||||
<view class="flex-start" v-if="userInfo" @click="clickinformation">
|
||||
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-if="userInfo.headImg"
|
||||
:src="userInfo.headImg" mode="aspectFill">
|
||||
</image>
|
||||
<text>{{userInfo.nickName || '无'}}</text>
|
||||
</view>
|
||||
<view class="flex-start" v-else @click="loginClick">
|
||||
<text>去登录</text>
|
||||
</view>
|
||||
</view>
|
||||
<image style="width: 44rpx; height: 42.26rpx;" @click="clickphone()"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/kf.png" mode="aspectFill">
|
||||
</view>
|
||||
|
||||
<image @click="memberlist" class="boxtop_botton"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/member.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="userinfoone" v-if="teblist.length!=0">
|
||||
<view class="userinfoonebox">
|
||||
<view class="userinfooneboxitem flex-between" @click="clickinfo(item,index)"
|
||||
v-for="(item,index) in teblist" :key="index">
|
||||
<view class="userinfooneboxitemleft flex-start">
|
||||
<image :src="item.shareImg" mode="aspectFill"></image>
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
<u-icon name="arrow-right" color="#575B66" size="28"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<listitem :list='list' v-if="list.length!=0"></listitem>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
|
||||
import listitem from "@/components/listitem.vue";
|
||||
import navseat from '@/components/navseat.vue'
|
||||
export default {
|
||||
components: {
|
||||
listitem,
|
||||
navseat
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
titlename: '个人中心',
|
||||
opacity: false,
|
||||
userInfo: {},
|
||||
teblist: [],
|
||||
list: [],
|
||||
Topdistance: '',
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
computed: {
|
||||
HeighT() { //手机类型的尺寸
|
||||
return this.$store.getters.is_BarHeight
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(() => {
|
||||
this.$nextTick(() => {
|
||||
this.GetTop()
|
||||
});
|
||||
}, 1000)
|
||||
// 当组件挂载完成后获取距离
|
||||
|
||||
},
|
||||
onPageScroll(e) {
|
||||
if (e.scrollTop <= 44) { //搜索导航栏
|
||||
this.opacity = false
|
||||
} else {
|
||||
this.opacity = true
|
||||
}
|
||||
|
||||
},
|
||||
onShow() {
|
||||
if (uni.cache.get('token')) {
|
||||
this.init_fn()
|
||||
this.loginwxuserInfo()
|
||||
this.tbPlatformDict()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickphone() {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: uni.cache.get('userInfo').custPhone
|
||||
});
|
||||
},
|
||||
clickinformation() {
|
||||
uni.pro.navigateTo('user/information')
|
||||
},
|
||||
//获取元素距离顶部的距离
|
||||
GetTop() {
|
||||
this.$u.getRect('.content').then(res => {
|
||||
console.log(1111, res)
|
||||
this.Topdistance = res.height //滚动距离
|
||||
})
|
||||
},
|
||||
memberlist() {
|
||||
if (uni.cache.get('token')) {
|
||||
uni.pro.navigateTo('member/list')
|
||||
} else {
|
||||
this.loginClick()
|
||||
}
|
||||
},
|
||||
//退出登录
|
||||
boxClick() {
|
||||
uni.showModal({
|
||||
title: '注意',
|
||||
content: '确定要退出登录吗？',
|
||||
success: async (res) => {
|
||||
if (res.confirm) {
|
||||
try {
|
||||
await this.api.loginOut();
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
uni.cache.clear();
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
loginClick() {
|
||||
uni.cache.clear();
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
},
|
||||
// 精选推荐
|
||||
// 下面初始数据
|
||||
init_fn() {
|
||||
this.list = []
|
||||
this.form = {
|
||||
address: uni.cache.get('getLocationstorage').address, //地址
|
||||
lng: uni.cache.get('getLocationstorage').lng,
|
||||
lat: uni.cache.get('getLocationstorage').lat,
|
||||
type: '', //品类
|
||||
orderBy: 5, //0.今日上新 1.离我最近 2.销量优先 3.价格优先 4.热榜推荐
|
||||
other: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
dateType: '',
|
||||
status: 'loadmore'
|
||||
}
|
||||
this.onLoadlist()
|
||||
},
|
||||
async onLoadlist() {
|
||||
try {
|
||||
let res = await this.api.indexlist(this.form)
|
||||
if (res.data.pages < this.form.page) {
|
||||
this.form.status = 'nomore'
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
this.form.page = ++this.form.page;
|
||||
setTimeout(() => {
|
||||
this.list = [...this.list, ...res.data.list];
|
||||
this.form.status = 'loading';
|
||||
if (res.data.pageNum == res.data.pages) {
|
||||
this.form.status = 'nomore';
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
} catch (e) {}
|
||||
},
|
||||
clickinfo(item, index) {
|
||||
switch (item.jumpType) {
|
||||
case 'scan': //特殊处理点击
|
||||
switch (item.value) {
|
||||
case 'loginOut':
|
||||
this.boxClick()
|
||||
break;
|
||||
}
|
||||
break;
|
||||
case 'scan_applet':
|
||||
uni.navigateToMiniProgram(JSON.parse(item.value))
|
||||
break
|
||||
case 'relative': //内部页面
|
||||
uni.pro.navigateTo(item.absUrl)
|
||||
break;
|
||||
case 'absolute': //外链url
|
||||
uni.navigateTo({
|
||||
url: `/pages/webview/webview?url=${item.menuUrl}`
|
||||
});
|
||||
break;
|
||||
}
|
||||
},
|
||||
async loginwxuserInfo() {
|
||||
let res = await this.api.loginwxuserInfo({
|
||||
userId: uni.cache.get('userInfo').id
|
||||
})
|
||||
if (res.code == 0) {
|
||||
uni.cache.set('userInfo', res.data);
|
||||
this.userInfo = uni.cache.get('userInfo')
|
||||
}
|
||||
},
|
||||
async tbPlatformDict() {
|
||||
let res = await this.api.tbPlatformDict({
|
||||
type: 'ownMenu'
|
||||
})
|
||||
// console.log(res)
|
||||
if (res.code == 0) {
|
||||
this.teblist = res.data
|
||||
}
|
||||
},
|
||||
// / 更换头像
|
||||
onChooseAvatar(e) {
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
})
|
||||
console.log(e.detail.avatarUrl)
|
||||
let file = e.detail.avatarUrl;
|
||||
uploadImage(file, 'avatar',
|
||||
result => {
|
||||
//将上传后的图片以对象（官方要求的格式）的形式存入uni-file-picker的value值imageValue（imageValue值的结构为数组包对象）用于图片回显
|
||||
// let objAge = {
|
||||
// 'url': result,
|
||||
// 'extname': 'png',
|
||||
// 'name': 'imgss.png'
|
||||
// };
|
||||
// this.userlist.avatar.push(objAge)
|
||||
this.userInfo.avatar = result
|
||||
console.log(this.userInfo.avatar)
|
||||
uni.hideLoading()
|
||||
}, result => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
},
|
||||
orderHandle(type) {
|
||||
this.useStorage.set('orderType', type);
|
||||
uni.switchTab({
|
||||
url: '/pages/order/order'
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.user-info-wrap {
|
||||
position: relative;
|
||||
padding: 48rpx 32rpx 88rpx 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 750rpx;
|
||||
background: #FFD158;
|
||||
border-radius: 0rpx 0rpx 40rpx 0rpx;
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
padding-left: $paddingSize;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.name {
|
||||
input {
|
||||
text-align: left;
|
||||
font-size: 32upx;
|
||||
}
|
||||
}
|
||||
|
||||
.phone {
|
||||
padding-top: 8upx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-info-wrap::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
bottom: 40rpx;
|
||||
right: 0;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
background-image: radial-gradient(40rpx at 0px 0px, rgba(0, 0, 0, 0) 40rpx, #fff 40rpx);
|
||||
}
|
||||
|
||||
.boxtop {
|
||||
width: 100%;
|
||||
height: 542rpx;
|
||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/user.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
|
||||
.boxtop_top {
|
||||
padding: 0 32rpx;
|
||||
margin-top: 52rpx;
|
||||
|
||||
.boxtop_topleft {
|
||||
.flex-start {
|
||||
text {
|
||||
margin-left: 18rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.boxtop_botton {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translatex(-50%);
|
||||
width: 654rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.userinfoone {
|
||||
position: relative;
|
||||
padding: 48rpx 28rpx;
|
||||
width: 100%;
|
||||
// top: -40rpx;
|
||||
background: #F6F6F6;
|
||||
// border-radius: 40rpx 0 0rpx 0rpx;
|
||||
|
||||
.userinfoonebox {
|
||||
padding: 32rpx 20rpx 32rpx 52rpx;
|
||||
border-radius: 22rpx;
|
||||
background: #FFFFFF;
|
||||
width: 100%;
|
||||
|
||||
.userinfooneboxitem {
|
||||
width: 100%;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.userinfooneboxitemleft {
|
||||
image {
|
||||
width: 41.33rpx;
|
||||
height: 36.9rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-left: 32rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.userinfooneboxitem:nth-child(1) {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,78 +1,74 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- <view class="user-info-wrap" @click="clickinformation">
|
||||
<view style="width: 108rpx; height: 108rpx;border-radius: 50%;">
|
||||
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-if="userInfo.headImg"
|
||||
:src="userInfo.headImg" mode="aspectFill">
|
||||
</image>
|
||||
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-else src="@/static/avatar.png"
|
||||
mode="aspectFill">
|
||||
</image>
|
||||
|
||||
<image class="topBack" :src="'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/myTopBack.png'" mode="aspectFill"></image>
|
||||
<view class="myContent">
|
||||
<view class="my_info flex-between">
|
||||
<view class="my_info_left">
|
||||
<image class="my_info_left_head" :src="userInfo.headImg" mode="aspectFill"></image>
|
||||
<view class="name">{{userInfo.nickName || '无'}}</view>
|
||||
</view>
|
||||
<image class="my_info_right_qr" v-if="userInfo" :src="'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_qRcode.png'" mode="aspectFill"></image>
|
||||
<view class="my_info_right" v-else>
|
||||
<text>免费入会</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info flex-colum-start">
|
||||
<text class="phone">{{userInfo.nickName || '无'}}</text>
|
||||
</view>
|
||||
</view> -->
|
||||
<navseat :opacity='opacity' class="navseat" title='个人中心' :iconshow="false" :titleshow='true'></navseat>
|
||||
<view class="boxtop">
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<view :style="{'height':Topdistance+'px'}"></view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view :style="{'height':HeighT.customBar+HeighT.heightBar+'px'}"></view>
|
||||
<!-- #endif -->
|
||||
<view class="boxtop_top flex-between">
|
||||
<view class="boxtop_topleft">
|
||||
<view class="flex-start" v-if="userInfo" @click="clickinformation">
|
||||
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-if="userInfo.headImg"
|
||||
:src="userInfo.headImg" mode="aspectFill">
|
||||
</image>
|
||||
<text>{{userInfo.nickName || '无'}}</text>
|
||||
</view>
|
||||
<view class="flex-start" v-else @click="loginClick">
|
||||
<text>去登录</text>
|
||||
|
||||
|
||||
<view class="my_item my_assets">
|
||||
<view class="my_item_title">我的资产</view>
|
||||
<view class="my_assets_list">
|
||||
<view class="my_list_item" @click="clickTo(item,index)" v-for="(item,index) in myAssetsList" :key="index">
|
||||
<image class="my_list_item_icon" :src="item.icon" mode="aspectFill"></image>
|
||||
<view class="my_list_item_name">{{item.name}}</view>
|
||||
<view class="my_list_item_num">{{item.num || '**'}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<image style="width: 44rpx; height: 42.26rpx;" @click="clickphone()"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/kf.png" mode="aspectFill">
|
||||
</view>
|
||||
|
||||
<view class="my_item my_fun">
|
||||
<view class="my_item_title">我的功能</view>
|
||||
<view class="my_fun_list">
|
||||
<view class="my_list_item" @click="clickTo(item,index)" v-for="(item,index) in myFunList" :key="index">
|
||||
<view class="my_list_item_left">
|
||||
<image class="my_list_item_icon" :src="item.icon" mode="aspectFill"></image>
|
||||
<view class="my_list_item_name">{{item.name}}</view>
|
||||
</view>
|
||||
<view class="my_list_item_right">
|
||||
<u-icon name="play-right-fill" color="#999999" size="12"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<image @click="memberlist" class="boxtop_botton"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/member.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="userinfoone" v-if="teblist.length!=0">
|
||||
<view class="userinfoonebox">
|
||||
<view class="userinfooneboxitem flex-between" @click="clickinfo(item,index)"
|
||||
v-for="(item,index) in teblist" :key="index">
|
||||
<view class="userinfooneboxitemleft flex-start">
|
||||
<image :src="item.shareImg" mode="aspectFill"></image>
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
<u-icon name="arrow-right" color="#575B66" size="28"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<listitem :list='list' v-if="list.length!=0"></listitem>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
|
||||
import listitem from "@/components/listitem.vue";
|
||||
import navseat from '@/components/navseat.vue'
|
||||
export default {
|
||||
components: {
|
||||
listitem,
|
||||
navseat
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
titlename: '个人中心',
|
||||
opacity: false,
|
||||
userInfo: {},
|
||||
teblist: [],
|
||||
list: [],
|
||||
Topdistance: '',
|
||||
myAssetsList: [
|
||||
{ name: "储值", type: "recharge", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/storedValue.png"},
|
||||
{ name: "积分", type: "my_coupon", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png"},
|
||||
{ name: "优惠券", type: "my_coupon", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/coupon.png"},
|
||||
{ name: "权益卡", type: "my_coupon", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/equityCard.png"}
|
||||
],
|
||||
myFunList: [
|
||||
{ name: "我的优惠券", type: "my_coupon", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_coupon.png"},
|
||||
{ name: "我的订单", type: "my_order", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_order.png"},
|
||||
{ name: "收货地址", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_address.png"},
|
||||
{ name: "个人资料", type: "my_info", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/personal.png"},
|
||||
{ name: "我的会员卡", type: "my_member", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_member.png"},
|
||||
{ name: "关于", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/inRegard.png"},
|
||||
],
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
@@ -82,22 +78,9 @@
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(() => {
|
||||
this.$nextTick(() => {
|
||||
this.GetTop()
|
||||
});
|
||||
}, 1000)
|
||||
// 当组件挂载完成后获取距离
|
||||
|
||||
},
|
||||
onPageScroll(e) {
|
||||
if (e.scrollTop <= 44) { //搜索导航栏
|
||||
this.opacity = false
|
||||
} else {
|
||||
this.opacity = true
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
onShow() {
|
||||
if (uni.cache.get('token')) {
|
||||
this.init_fn()
|
||||
@@ -106,115 +89,6 @@
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickphone() {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: uni.cache.get('userInfo').custPhone
|
||||
});
|
||||
},
|
||||
clickinformation() {
|
||||
uni.pro.navigateTo('user/information')
|
||||
},
|
||||
//获取元素距离顶部的距离
|
||||
GetTop() {
|
||||
this.$u.getRect('.content').then(res => {
|
||||
console.log(1111, res)
|
||||
this.Topdistance = res.height //滚动距离
|
||||
})
|
||||
},
|
||||
memberlist() {
|
||||
if (uni.cache.get('token')) {
|
||||
uni.pro.navigateTo('member/list')
|
||||
} else {
|
||||
this.loginClick()
|
||||
}
|
||||
},
|
||||
//退出登录
|
||||
boxClick() {
|
||||
uni.showModal({
|
||||
title: '注意',
|
||||
content: '确定要退出登录吗？',
|
||||
success: async (res) => {
|
||||
if (res.confirm) {
|
||||
try {
|
||||
await this.api.loginOut();
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
uni.cache.clear();
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
loginClick() {
|
||||
uni.cache.clear();
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
},
|
||||
// 精选推荐
|
||||
// 下面初始数据
|
||||
init_fn() {
|
||||
this.list = []
|
||||
this.form = {
|
||||
address: uni.cache.get('getLocationstorage').address, //地址
|
||||
lng: uni.cache.get('getLocationstorage').lng,
|
||||
lat: uni.cache.get('getLocationstorage').lat,
|
||||
type: '', //品类
|
||||
orderBy: 5, //0.今日上新 1.离我最近 2.销量优先 3.价格优先 4.热榜推荐
|
||||
other: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
dateType: '',
|
||||
status: 'loadmore'
|
||||
}
|
||||
this.onLoadlist()
|
||||
},
|
||||
async onLoadlist() {
|
||||
try {
|
||||
let res = await this.api.indexlist(this.form)
|
||||
if (res.data.pages < this.form.page) {
|
||||
this.form.status = 'nomore'
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
this.form.page = ++this.form.page;
|
||||
setTimeout(() => {
|
||||
this.list = [...this.list, ...res.data.list];
|
||||
this.form.status = 'loading';
|
||||
if (res.data.pageNum == res.data.pages) {
|
||||
this.form.status = 'nomore';
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
} catch (e) {}
|
||||
},
|
||||
clickinfo(item, index) {
|
||||
switch (item.jumpType) {
|
||||
case 'scan': //特殊处理点击
|
||||
switch (item.value) {
|
||||
case 'loginOut':
|
||||
this.boxClick()
|
||||
break;
|
||||
}
|
||||
break;
|
||||
case 'scan_applet':
|
||||
uni.navigateToMiniProgram(JSON.parse(item.value))
|
||||
break
|
||||
case 'relative': //内部页面
|
||||
uni.pro.navigateTo(item.absUrl)
|
||||
break;
|
||||
case 'absolute': //外链url
|
||||
uni.navigateTo({
|
||||
url: `/pages/webview/webview?url=${item.menuUrl}`
|
||||
});
|
||||
break;
|
||||
}
|
||||
},
|
||||
async loginwxuserInfo() {
|
||||
let res = await this.api.loginwxuserInfo({
|
||||
userId: uni.cache.get('userInfo').id
|
||||
@@ -233,152 +107,198 @@
|
||||
this.teblist = res.data
|
||||
}
|
||||
},
|
||||
// / 更换头像
|
||||
onChooseAvatar(e) {
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
})
|
||||
console.log(e.detail.avatarUrl)
|
||||
let file = e.detail.avatarUrl;
|
||||
uploadImage(file, 'avatar',
|
||||
result => {
|
||||
//将上传后的图片以对象（官方要求的格式）的形式存入uni-file-picker的value值imageValue（imageValue值的结构为数组包对象）用于图片回显
|
||||
// let objAge = {
|
||||
// 'url': result,
|
||||
// 'extname': 'png',
|
||||
// 'name': 'imgss.png'
|
||||
// };
|
||||
// this.userlist.avatar.push(objAge)
|
||||
this.userInfo.avatar = result
|
||||
console.log(this.userInfo.avatar)
|
||||
uni.hideLoading()
|
||||
}, result => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
// 下面初始数据
|
||||
init_fn() {
|
||||
|
||||
},
|
||||
orderHandle(type) {
|
||||
this.useStorage.set('orderType', type);
|
||||
uni.switchTab({
|
||||
url: '/pages/order/order'
|
||||
clickphone() {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: uni.cache.get('userInfo').custPhone
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
loginClick() {
|
||||
uni.cache.clear();
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
},
|
||||
|
||||
clickTo(item, index) {
|
||||
switch (item.type) {
|
||||
case 'my_order':
|
||||
uni.switchTab({
|
||||
url: '/pages/order/order'
|
||||
});
|
||||
break
|
||||
case 'my_member':
|
||||
if (uni.cache.get('token')) {
|
||||
uni.pro.navigateTo('member/list')
|
||||
} else {
|
||||
this.loginClick()
|
||||
}
|
||||
break
|
||||
case 'recharge':
|
||||
uni.pro.navigateTo('member/index')
|
||||
break
|
||||
case 'my_coupon': //内部页面
|
||||
uni.pro.navigateTo('user/coupon')
|
||||
break;
|
||||
case 'my_info': //内部页面
|
||||
uni.pro.navigateTo('user/my_info')
|
||||
break;
|
||||
case 'scan_applet':
|
||||
uni.navigateToMiniProgram(JSON.parse(item.value))
|
||||
break
|
||||
|
||||
case 'absolute': //外链url
|
||||
uni.navigateTo({
|
||||
url: `/pages/webview/webview?url=${item.menuUrl}`
|
||||
});
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.user-info-wrap {
|
||||
position: relative;
|
||||
padding: 48rpx 32rpx 88rpx 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 750rpx;
|
||||
background: #FFD158;
|
||||
border-radius: 0rpx 0rpx 40rpx 0rpx;
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
padding-left: $paddingSize;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.name {
|
||||
input {
|
||||
text-align: left;
|
||||
font-size: 32upx;
|
||||
}
|
||||
}
|
||||
|
||||
.phone {
|
||||
padding-top: 8upx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-info-wrap::after {
|
||||
|
||||
.topBack{
|
||||
width: 100%;
|
||||
height: 400rpx;
|
||||
position: absolute;
|
||||
content: '';
|
||||
bottom: 40rpx;
|
||||
right: 0;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
background-image: radial-gradient(40rpx at 0px 0px, rgba(0, 0, 0, 0) 40rpx, #fff 40rpx);
|
||||
}
|
||||
|
||||
.boxtop {
|
||||
width: 100%;
|
||||
height: 542rpx;
|
||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/user.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.myContent{
|
||||
position: relative;
|
||||
|
||||
.boxtop_top {
|
||||
z-index: 1;
|
||||
padding: 298rpx 20rpx 0 20rpx;
|
||||
.my_info{
|
||||
height: 172rpx;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
padding: 0 32rpx;
|
||||
margin-top: 52rpx;
|
||||
|
||||
.boxtop_topleft {
|
||||
.flex-start {
|
||||
text {
|
||||
margin-left: 18rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
border-radius: 18rpx;
|
||||
.my_info_left{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.my_info_left_head{
|
||||
width: 84rpx;
|
||||
height: 84rpx;
|
||||
margin-right: 18rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.name{
|
||||
font-weight: 400;
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
.my_info_right{
|
||||
width: 136rpx;
|
||||
height: 48rpx;
|
||||
background-color: #E3AD7F;
|
||||
border-radius: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text{
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
.my_info_right_qr{
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.my_item{
|
||||
background-color: #fff;
|
||||
padding: 22rpx 32rpx;
|
||||
border-radius: 18rpx;
|
||||
margin-top: 16rpx;
|
||||
.my_item_title{
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
}
|
||||
}
|
||||
|
||||
.my_assets{
|
||||
.my_item_title{
|
||||
margin-bottom: 26rpx;
|
||||
}
|
||||
.my_assets_list{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 38rpx;
|
||||
.my_list_item{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.my_list_item_icon{
|
||||
width: 52rpx;
|
||||
height: 44rpx;
|
||||
}
|
||||
.my_list_item_name{
|
||||
font-weight: 500;
|
||||
font-size: 36rpx;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
margin-top: 16rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.boxtop_botton {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translatex(-50%);
|
||||
width: 654rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.userinfoone {
|
||||
position: relative;
|
||||
padding: 48rpx 28rpx;
|
||||
width: 100%;
|
||||
// top: -40rpx;
|
||||
background: #F6F6F6;
|
||||
// border-radius: 40rpx 0 0rpx 0rpx;
|
||||
|
||||
.userinfoonebox {
|
||||
padding: 32rpx 20rpx 32rpx 52rpx;
|
||||
border-radius: 22rpx;
|
||||
background: #FFFFFF;
|
||||
width: 100%;
|
||||
|
||||
.userinfooneboxitem {
|
||||
width: 100%;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.userinfooneboxitemleft {
|
||||
image {
|
||||
width: 41.33rpx;
|
||||
height: 36.9rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-left: 32rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
.my_list_item_num{
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
font-size: 20rpx;
|
||||
color: #E3AD7F;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.userinfooneboxitem:nth-child(1) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.my_fun{
|
||||
.my_item_title{
|
||||
margin-bottom: 18rpx;
|
||||
}
|
||||
.my_fun_list{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.my_list_item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 24rpx 0 26rpx 0;
|
||||
border-bottom: 1rpx solid #E5E5E5;
|
||||
.my_list_item_left{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.my_list_item_icon{
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
.my_list_item_name{
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
.my_list_item:last-child{
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user