界面优化

main
syt 3 months ago
parent 8f79274eca
commit 58a1970278
  1. 7
      api/index.js
  2. 5
      pages.json
  3. 141
      pages/face/face.vue
  4. 134
      pages/index/index.vue
  5. 99
      pages/login/login.vue
  6. 64
      pages/mendainlist/mendainlist.vue
  7. 97
      pages/order/order.vue
  8. 123
      pages/user/index.vue
  9. 122
      pages/user/portrait/portrait.vue
  10. BIN
      static/logo.png
  11. BIN
      static/微信图片_20240725144850.png

@ -80,6 +80,13 @@ const api = {
data
})
},
newGetCity(data) {
return request({
url: 'api/newGetCity',
method: 'post',
data
})
},
ipGetCity(data) {
return request({
url: 'api/ipGetCity',

@ -3,6 +3,7 @@
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页",
"navigationBarTextStyle": "black",
"navigationStyle": "custom"
}
@ -83,8 +84,8 @@
]
},
"globalStyle": {
"navigationBarTextStyle": "#222222",
"navigationBarTitleText": "uni-app",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "",
"navigationBarBackgroundColor": "#F8A617",
"app-plus": {
"background": "#efeff4"

@ -1,18 +1,20 @@
<template>
<view>
<image src="@/static/bg.png" mode="" style="width: 100%;height: 928rpx;"></image>
<view class="top" @click="fanhui">
<view class="xuzou">
<uni-icons type="left" size="18"></uni-icons>
<image src="@/static/bg.png" mode="widthFix" class="bg" style="width: 100%;height: 928rpx;"></image>
<view class="top" :style="{'padding-top': top+'px'}">
<view class="xuzou" @click="fanhui">
<uni-icons type="left" size="22" style="margin-left: 25rpx;"></uni-icons>
<text class="title">人脸录入</text>
</view>
</view>
<view class="content" :style="{'top': (top+44)+'px'}">
<view class="xinxirl">
<view class="xinxirl1">请录入人脸</view>
<view class="xinxirl2">本店需刷人脸进店请点击拍摄提前录入人脸哦!</view>
<view class="xinxirl3">
<image class="xinxirl3img" src="@/static/相机.png" mode=""></image>
</view>
<view class="xinxirl4">拍摄</view>
</view>
<view class="fot">
<view class="tg" @click="previous">跳过</view>
@ -30,6 +32,7 @@
<view class="qudbtn" @click="qudbtn">确定</view>
</uni-popup>
</view>
</view>
</template>
@ -37,6 +40,7 @@
export default {
data() {
return {
top: 0,
url: "",
path: "",
yrenlianlist:[],
@ -44,12 +48,13 @@
userxixin:{}
}
},
onShow() {
onLoad() {
this.top = uni.getSystemInfoSync().statusBarHeight
this.memberInfo()
},
methods: {
fanhui(){
uni.navigateBack()
uni.navigateBack({delta:1})
},
memberInfo() {
this.$api.memberInfo().then(res => {
@ -63,48 +68,47 @@
})
},
pais(){
this.$refs.popup.open('center')
// this.$refs.popup.open('center')
this.chooseImage()
},
qudbtn(){
// this.$refs.popup.close('center')
// var tjlist=[...this.yrenlianlist,...this.jqrllist]
uni.uploadFile({
url: this.ymurl+'/api/uploadFile',
filePath:this.path,
url: that.ymurl+'/api/uploadFile',
filePath: that.path,
name: 'file',
formData: {
'user': 'test'
},
fail(err) {
console.log(11,err)
},
success: (res) => {
console.log('tjlist',JSON.parse(res.data));
var data=JSON.parse(res.data)
if(data.code==200){
uni.showToast({
icon: "none",
title: '上传成功',
duration: 5000,
});
this.$api.memberFace({face_id:data.data.file_id}).then(res=>{
that.$api.memberFace({face_id:data.data.file_id}).then(res=>{
if(res.code=='200'){
uni.showToast({
icon: "none",
title: '上传成功',
duration: 5000,
duration: 2000,
});
setTimeout(function(){
uni.switchTab({
url:'/pages/user/index'
})
},1000)
},2000)
}
})
}else{
uni.showToast({
icon: "none",
title: data.msg,
duration: 5000,
duration: 2000,
});
}
@ -114,18 +118,54 @@
},
chooseImage() {
var that=this
const that = this;
that.yrenlianlist=[]
uni.chooseImage({
count: 1,
success: function(res) {
console.log(111,res);
console.log(888,this);
that.url = res.tempFilePaths[0];
that.yrenlianlist.push(that.url)
uni.uploadFile({
url: that.ymurl+'/api/uploadFile',
filePath: res.tempFilePaths[0],
name: 'file',
formData: {
'user': 'test'
},
fail(err) {
console.log(11,err)
},
success: (res1) => {
console.log('tjlist',JSON.parse(res1.data));
var data=JSON.parse(res1.data)
if(data.code==200){
that.$api.memberFace({face_id:data.data.file_id}).then(res2=>{
if(res2.code=='200'){
uni.showToast({
icon: "none",
title: '上传成功',
duration: 2000,
});
setTimeout(function(){
uni.switchTab({
url:'/pages/user/index'
})
},2000)
}
})
}else{
uni.showToast({
icon: "none",
title: data.msg,
duration: 2000,
});
}
}
});
},
fail() {
that.$refs.popup.close('center')
fail(err) {
console.log(err)
// that.$refs.popup.close('center')
}
});
},
@ -213,8 +253,7 @@
.xinxirl {
text-align: center;
margin-top: -600rpx;
margin-top: 150rpx;
}
.xinxirl2 {
@ -231,14 +270,54 @@
font-size: 48rpx;
color: #222222;
}
.xinxirl4 {
font-weight: 500;
font-size: 36rpx;
color: #222222;
margin-top: 35rpx;
}
.bg{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
background: #f5f5f5;
}
.content{
width: 100%;
position: relative;
left: 0;
top: 0;
z-index: 2;
}
.top {
width: 100%;
left: 0;
z-index: 22;
top: 0;
height: 88rpx;
overflow: hidden;
position: fixed;
}
.top .xuzou{
width: 100%;
height: 88rpx;
display: flex;
position: fixed;
align-items: center;
position: relative;
z-index: 23;
}
.top .hs{
width: 100%;
height: 100%;
position: absolute;
top: 96rpx;
left: 20rpx;
left: 0;
top: 0;
z-index: 1;
}
.title {
padding-left: 14rpx;
}

@ -1,26 +1,27 @@
<template>
<view>
<image src="@/static/bg.png" mode="" style="width: 100%;height: 928rpx;"></image>
<view class="top">
<image src="@/static/bg.png" mode="" class="bg" style="width: 100%;height: 928rpx;"></image>
<view class="top" :style="{'padding-top': top+'px'}">
<view class="location">
<image class="dw" src="@/static/定位.png" mode="" style="width: 30rpx;height: 30rpx;"></image>
<view class="xuzou">{{city}}</view>
<!-- <picker @change="bindPickerChange" :value="index" :range="array">
<image class="jiantou" src="@/static/jiantou.png" mode="" style="width: 15rpx;height: 15rpx;"></image>
</picker> -->
</view>
<image src="@/static/bg.png" mode="widthFix" class="hs"></image>
</view>
<view class="content" :style="{'top': (top+44)+'px'}">
<view class="topimg">
<image class="topimg1" :src="tuijianlist[0].image.url" mode=""></image>
<image class="topimg1" src="https://bodybuilding.bsdong.cn/images/banner.png" mode=""></image>
</view>
<view class="mendian">
<view class="mendian1">
<view class="tj">门店推荐</view>
<view class="" @click="mendianlist">
找门店<uni-icons type="right" size="18"></uni-icons>
<view class="data1" @click="mendianlist">
找门店<uni-icons type="right" color="#999" size="18"></uni-icons>
</view>
</view>
<view class="mddz" v-for="(item,index) in tuijianlist" :key="index">
<view class="mddz1">
<image class="mddz1img" :src="item.image.url" mode=""></image>
<image class="mddz1img" style="border-radius: 10rpx;" :src="item.image.url" mode=""></image>
<view class="mddz1wz">{{item.name}}</view>
</view>
<view class="mddz2">
@ -50,7 +51,8 @@
</view>
</view>
</view>
<uni-popup ref="popup" background-color="#fff" :mask-click='false'>
</view>
<uni-popup ref="popup" background-color="#fff" :mask-click='false' :animation="false">
<view class="popbox">
<view class="close">
<image src="@/static/close-l.png" mode="" style="width: 44rpx;height: 44rpx;" @click="close">
@ -60,8 +62,8 @@
团购验券
</view>
<view class="input">
<input class="input1" type="text" placeholder="请输入抖音/美团券码" v-model="number"/>
<image class="saoma" src="@/static/扫一扫.png" mode=""></image>
<input class="input1" type="text" placeholder="请输入抖音/美团券码" v-model="scanCode"/>
<image class="saoma" @click="openScan()" src="@/static/扫一扫.png" mode=""></image>
</view>
<view class="yqbtn" @click="numberCheck">
验券
@ -75,6 +77,7 @@
export default {
data() {
return {
scanCode: "",
city:'',
number:'',
viplist:[],
@ -83,7 +86,8 @@
longitude:'',
tuijianlist:[],
iswanjie:false,
shoujidingwei:true
shoujidingwei:true,
top: 0
}
},
@ -93,11 +97,16 @@
path: '/pages/index/index'
}
},
onShow() {
onLoad() {
this.top = uni.getSystemInfoSync().statusBarHeight
},
onReady() {
this.viplist=[]
this.cardList(1)
// this.storeList(1)
if(!this.city){
this.getLocation()
}
},
onReachBottom(){
if(!this.iswanjie){
@ -105,6 +114,14 @@
}
},
methods: {
openScan() {
const that = this;
uni.scanCode({
success(res) {
that.scanCode = res.result;
}
})
},
handleNavigation(i) {
uni.openLocation({
longitude:Number(i.longitude),
@ -119,7 +136,7 @@
})
},
numberCheck(){
this.$api.numberCheck({number:this.number}).then(res=>{
this.$api.numberCheck({number:this.scanCode}).then(res=>{
if(res.code==200){
uni.showToast({
icon: "none",
@ -142,7 +159,7 @@
that.$api.nearStore({latitude:that.latitude,longitude:that.longitude,limit:1}).then(res=>{
that.tuijianlist=res.data
})
that.$api.ipGetCity().then(res=>{
that.$api.newGetCity({locations:that.longitude+","+that.latitude}).then(res=>{
console.log('res',res);
that.city=res.data.city
})
@ -212,6 +229,12 @@
this.$refs.popup.close('center')
},
taochan(i) {
if(!uni.getStorageSync("token")) {
uni.navigateTo({
url: "/pages/login/login"
})
return ;
}
uni.setStorageSync('xzmd','')
var that=this
var tuijianlist=JSON.stringify(that.tuijianlist[0])
@ -248,17 +271,32 @@
}
.input1 {
height: 91rpx;
flex: 1;
font-size: 30rpx;
color: #333;
}
.saoma {
width: 44rpx;
height: 44rpx;
}
.bg{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
background: #f5f5f5;
}
.content{
width: 100%;
min-height: 100vh;
position: relative;
left: 481rpx;
top: -70rpx
left: 0;
top: 0;
z-index: 2;
}
.input {
width: 531rpx;
height: 91rpx;
@ -268,9 +306,9 @@
padding: 0 20rpx;
margin: 0 auto;
margin-top: 48rpx;
/* background: url("@/static/.png") no-repeat;
background-position: 501rpx 15px;
background-size: 44rpx; */
display: flex;
align-items: center;
justify-content: space-between;
}
.popbox {
@ -300,11 +338,16 @@
margin-left: 24rpx;
background: #FFFFFF;
margin-top: 30rpx;
box-shadow: 0px 4rpx 13rpx 0px rgba(19,14,4,0.08);
border-radius: 20rpx;
overflow: hidden;
}
.btboxs {
display: flex;
flex-wrap: wrap;
padding-bottom: 25rpx;
overflow: hidden;
}
.btwz {
@ -318,23 +361,25 @@
.btwzjg {
margin-top: 15rpx;
margin-left: 24rpx;
margin-left: 15rpx;
margin-bottom: 26rpx;
white-space: nowrap;
overflow: hidden;
}
.btwzjg1 {
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 30rpx;
font-size: 28rpx;
color: #EF3D25;
}
.btwzjg2 {
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 24rpx;
font-size: 22rpx;
color: #CCCCCC;
padding-left: 15rpx;
padding-left: 10rpx;
text-decoration-line: line-through;
}
@ -396,11 +441,13 @@
}
.mddz2 {
margin-top: 32rpx;
margin-top: 25rpx;
display: flex;
}
.dz {
font-size: 26rpx;
color: #999;
margin-left: 17rpx;
}
@ -443,7 +490,12 @@
font-size: 34rpx;
color: #222222;
}
.mendian1 .data1{
font-size: 24rpx;
color: #999;
display: flex;
align-items: center;
}
.mendian1 {
display: flex;
justify-content: space-between;
@ -460,11 +512,30 @@
}
.top {
width: 100%;
left: 0;
z-index: 22;
height: 88rpx;
overflow: hidden;
position: fixed;
}
.top .location{
width: 100%;
height: 88rpx;
display: flex;
position: fixed;
align-items: center;
position: relative;
z-index: 23;
}
.top .hs{
width: 100%;
height: 100%;
position: absolute;
top: 96rpx;
left: 0;
top: 0;
z-index: 1;
}
.jiantou {
margin-left: 18rpx;
margin-top: 10rpx;
@ -490,7 +561,6 @@
box-shadow: 0rpx 4rpx 13rpx 0rpx rgba(19, 14, 4, 0.14);
border-radius: 20rpx;
margin: 0 auto;
margin-top: -750rpx;
}
.topimg1 {

@ -1,9 +1,16 @@
<template>
<view class="box">
<image src="@/static/bg.png" mode="" style="width: 100%;height: 928rpx;"></image>
<view class="top">登录</view>
<image class="img" src="@/static/微信图片_20240725144850.png" mode=""></image>
<view>
<image src="@/static/bg.png" mode="widthFix" class="bg" style="width: 100%;height: 928rpx;"></image>
<view class="top" @click="previous" :style="{'padding-top': top+'px'}">
<view class="xuzou">
<uni-icons type="left" size="22" style="margin-left: 25rpx;"></uni-icons>
<text class="title">登录</text>
</view>
<image src="@/static/bg.png" mode="widthFix" class="hs"></image>
</view>
<view class="content" :style="{'top': (top+44)+'px'}">
<image class="img" mode="widthFix" src="@/static/logo.png" ></image>
<view class="store">运动湾24小时自助健身</view>
<!-- <button class="btn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机号一键登录</button> -->
<!-- <button class="btn" open-type="getUserInfo" @getuserinfo="getUserInfo">获取用户信息</button> -->
<view class="btn">手机号快捷登录
@ -13,7 +20,7 @@
<view class="xieyi">
<checkbox-group v-model="checkboxValue1" @change='change' >
<label class="radio">
<checkbox value="r1"/>
<checkbox value="r1" color="#F8A617" />
已阅读并同意
<text class="xy" @click="yhxy('yonghu')">服务协议</text>
@ -23,6 +30,7 @@
</checkbox-group>
</view>
</view>
</view>
</template>
<script>
@ -32,7 +40,8 @@
checkboxValue1:[],
checked: false,
wxcode: '',
isSelct:false
isSelct:false,
top: 0
}
},
onReady() {
@ -47,6 +56,7 @@
},
onLoad() {
const that = this;
that.top = uni.getSystemInfoSync().statusBarHeight
uni.login({
success(res) {
console.log(787, res)
@ -57,6 +67,9 @@
},
methods: {
previous() {
uni.navigateBack()
},
getUserInfo(e) {
console.log(11111,e);
if (e.detail.userInfo) {
@ -142,32 +155,73 @@
</script>
<style scoped lang="less">
.top{
.bg{
width: 100%;
height: 100%;
position: absolute;
top: 96rpx;
left: 20rpx;
left: 0;
top: 0;
z-index: 1;
background: #f5f5f5;
}
.xy {
color: #0068AF;
.content{
width: 100%;
position: relative;
left: 0;
top: 0;
z-index: 2;
}
.box {
background: #FFFFFF;
height: 100vh;
.top {
width: 100%;
left: 0;
z-index: 22;
top: 0;
height: 88rpx;
overflow: hidden;
position: fixed;
}
.top .xuzou{
width: 100%;
height: 88rpx;
display: flex;
position: fixed;
align-items: center;
position: relative;
z-index: 23;
}
.top .hs{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
}
.xy {
color: #F8A617;
}
.xieyi {
text-align: center;
margin-top: 67rpx;
font-size: 26rpx;
color: #666;
}
.img {
margin: 133rpx;
width: 485rpx;
height: 470rpx;
margin-top: -560rpx;
width: 210rpx;
height: 210rpx;
margin: 250rpx auto 0;
border-radius: 20rpx;
display: block;
}
.store{
font-weight: 500;
font-size: 30rpx;
color: #333333;
text-align: center;
margin-top: 30rpx;
}
.btn {
width: 630rpx;
height: 98rpx;
@ -180,9 +234,10 @@
font-size: 30rpx;
color: #FFFFFF;
line-height: 98rpx;
letter-spacing: 1px;
margin: 0 auto;
text-align: center;
margin-top: 120rpx;
button {
width: 100%;
height: 100%;

@ -1,12 +1,14 @@
<template>
<view>
<image src="@/static/bg.png" mode="" style="width: 100%;height: 928rpx;"></image>
<view class="top" @click="previous">
<image src="@/static/bg.png" mode="widthFix" class="bg" style="width: 100%;height: 928rpx;"></image>
<view class="top" @click="previous" :style="{'padding-top': top+'px'}">
<view class="xuzou">
<uni-icons type="left" size="18"></uni-icons>
<uni-icons type="left" size="24" style="margin-left: 25rpx;"></uni-icons>
<text class="title">门店列表</text>
</view>
<image src="@/static/bg.png" mode="widthFix" class="hs"></image>
</view>
<view class="content" :style="{'top': (top+44)+'px'}">
<view class="mendian">
<view class="mddz" v-for="(item,index) in mendainlist" :key="index" @click="xzmd(item)">
<view class="mddz1">
@ -24,6 +26,7 @@
</view>
</view>
</view>
</view>
</template>
<script>
@ -33,11 +36,12 @@
mendainlist: [],
iswanjie:false,
page:1,
isshouye:''
isshouye:'',
top: 0
}
},
onLoad(e) {
console.log(123,e);
this.top = uni.getSystemInfoSync().statusBarHeight
this.isshouye=e.item
},
onShow() {
@ -97,15 +101,49 @@
<style scoped>
.mdleft{
width: 550rpx;
width: 620rpx;
}
.bg{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
background: #f5f5f5;
}
.content{
width: 100%;
position: relative;
left: 0;
top: 0;
z-index: 2;
}
.top {
width: 100%;
left: 0;
z-index: 22;
height: 88rpx;
overflow: hidden;
position: fixed;
}
.top .xuzou{
width: 100%;
height: 88rpx;
display: flex;
position: fixed;
align-items: center;
position: relative;
z-index: 23;
}
.top .hs{
width: 100%;
height: 100%;
position: absolute;
top: 96rpx;
left: 20rpx;
left: 0;
top: 0;
z-index: 1;
}
.title {
padding-left: 14rpx;
}
@ -116,7 +154,7 @@
}
.mddz2 {
margin-top: 32rpx;
margin-top: 25rpx;
display: flex;
justify-content: space-between;
}
@ -140,6 +178,7 @@
.mddz1img {
width: 60rpx;
border-radius: 10rpx;
height: 60rpx;
}
@ -163,8 +202,7 @@
}
.mendian {
position: absolute;
top: 152rpx;
left: 24rpx;
padding: 0 25rpx 25rpx;
overflow: hidden;
}
</style>

@ -1,12 +1,14 @@
<template>
<view>
<image src="@/static/bg.png" mode="" style="width: 100%;height: 928rpx;"></image>
<view class="top" @click="previous">
<image src="@/static/bg.png" mode="widthFix" class="bg" style="width: 100%;height: 928rpx;"></image>
<view class="top" @click="previous" :style="{'padding-top': top+'px'}">
<view class="xuzou">
<uni-icons type="left" size="18"></uni-icons>
<uni-icons type="left" size="22" style="margin-left: 25rpx;"></uni-icons>
<text class="title">订单确认</text>
</view>
<image src="@/static/bg.png" mode="widthFix" class="hs"></image>
</view>
<view class="content" :style="{'top': (top+44)+'px'}">
<view class="mendian">
<view class="mddz">
<view class="huiy">
@ -17,11 +19,10 @@
<view class="mddz1wz">{{mandianxinxi.name}}</view>
</view>
<view class="mddz2">
<view class="">
<view class="address">
<image class="mddz1img1" src="@/static/定位1.png" mode=""></image>
<text class="dz">地址{{mandianxinxi.address}}</text>
</view>
<!-- <image class="mddz1img2" src="@/static/电话o.png" mode=""></image> -->
<view class="qihuanmd" @click="qhmd">切换门店</view>
</view>
@ -37,10 +38,10 @@
<view class="taoctitle2">
<view class="smwz" v-if='vipxinxi.validity_num>0'>次数{{vipxinxi.validity_num}}</view>
<view class="smwz" v-if='vipxinxi.validity_day>0'>期限{{vipxinxi.validity_day}}</view>
<view class="smwz hengxian">原价{{vipxinxi.original_price}}</view>
<view class="smwz hengxian" v-if="vipxinxi.original_price">原价{{vipxinxi.original_price}}</view>
</view>
<view class="smwz">说明{{vipxinxi.introduce}}</view>
<view class="smwz">限购{{vipxinxi.buy_limit}}</view>
<view class="smwz" v-if="vipxinxi.introduce">说明{{vipxinxi.introduce}}</view>
<view class="smwz" v-if="vipxinxi.buy_limit >= 1">限购{{vipxinxi.buy_limit}}</view>
</view>
<view class="zhif">
<view class="zfwi">支付方式</view>
@ -52,7 +53,7 @@
</view>
<checkbox-group class="chgroup" v-model="checkboxValue1" @change='change'>
<label class="radio">
<checkbox value="r1" />
<checkbox value="r1" color="#F8A617" />
已阅读并同意
<text class="xy" @click="yhxy('yonghu')">用户协议</text>
</label>
@ -66,6 +67,7 @@
</view>
</view>
</view>
</view>
</template>
<script>
@ -74,16 +76,18 @@
return {
mandianxinxi: {},
vipxinxi: {},
yhxyactive: false
yhxyactive: false,
top: 0
}
},
onLoad(option) {
console.log('option', option);
var that = this
var tuijianlist = JSON.parse(option.tuijianlist)
var vipxinxi = JSON.parse(option.item)
var tuijianlist = JSON.parse(decodeURIComponent(option.tuijianlist))
var vipxinxi = JSON.parse(decodeURIComponent(option.item))
that.vipxinxi = vipxinxi
that.mandianxinxi = tuijianlist
that.top = uni.getSystemInfoSync().statusBarHeight
},
onShow() {
var xzmd = uni.getStorageSync('xzmd')
@ -167,6 +171,9 @@
position: fixed;
left: 24rpx;
bottom: 127rpx;
font-size: 26rpx;
color: #666;
}
.fot {
@ -180,6 +187,9 @@
bottom: 0;
display: flex;
justify-content: space-between;
font-weight: 500;
font-size: 30rpx;
color: #222222;
}
.fotwz {
@ -205,7 +215,7 @@
.zhif {
width: 650rpx;
padding: 20rpx 28rpx;
padding: 30rpx 28rpx;
margin-top: 20rpx;
background: #FFFFFF;
display: flex;
@ -241,6 +251,7 @@
.wxpay {
width: 44rpx;
height: 44rpx;
margin-right: 20rpx;
}
.taoctitle1wz {
@ -251,11 +262,10 @@
}
.smwz {
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 28rpx;
color: #999999;
margin-top: 23rpx;
margin-top: 20rpx;
}
.taoctitle1 {
@ -297,15 +307,50 @@
.huiy {
display: flex;
margin-bottom: 20rpx;
align-items: center;
}
.bg{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
background: #f5f5f5;
}
.content{
width: 100%;
position: relative;
left: 0;
top: 0;
z-index: 2;
}
.top {
width: 100%;
left: 0;
z-index: 22;
height: 88rpx;
overflow: hidden;
position: fixed;
}
.top .xuzou{
width: 100%;
height: 88rpx;
display: flex;
position: fixed;
align-items: center;
position: relative;
z-index: 23;
}
.top .hs{
width: 100%;
height: 100%;
position: absolute;
top: 96rpx;
left: 20rpx;
left: 0;
top: 0;
z-index: 1;
}
.title {
padding-left: 14rpx;
}
@ -333,14 +378,16 @@
}
.mddz2 {
margin-top: 32rpx;
margin-top: 20rpx;
display: flex;
justify-content: space-between;
}
.mddz2 .address{
flex: 1;
margin-right: 20rpx;
}
.dz {
margin-left: 17rpx;
font-family: PingFang SC;
font-weight: 500;
font-size: 26rpx;
color: #999999;
@ -376,12 +423,10 @@
box-shadow: 0rpx 3rpx 9rpx 0rpx rgba(19, 14, 4, 0.08);
border-radius: 20rpx;
margin-top: 24rpx;
padding: 45rpx 28rpx;
padding: 25rpx 28rpx;
}
.mendian {
position: absolute;
top: 152rpx;
left: 24rpx;
padding: 0 25rpx 25rpx;
overflow: hidden;
}
</style>

@ -1,26 +1,30 @@
<template>
<view>
<image src="@/static/bg.png" mode="" style="width: 100%;height: 928rpx;"></image>
<view class="top">
<image src="@/static/bg.png" mode="widthFix" class="bg" style="width: 100%;height: 928rpx;"></image>
<view class="top" :style="{'padding-top': top+'px'}">
<view class="xuzou">
<!-- <uni-icons type="left" size="18"></uni-icons> -->
<text class="title">我的</text>
<text class="title" style="margin-left: 25rpx;">我的</text>
</view>
<image src="@/static/bg.png" mode="widthFix" class="hs"></image>
</view>
<view class="mendian">
<image class="img" :src="userxixin.avatar?userxixin.avatar:avatar" mode="" @click="gengx"></image>
<view class="xinxi">
<view class="content" :style="{'top': (top+44)+'px'}">
<view class="mendian" @click="gengx">
<image class="img" :src="userxixin.avatar?userxixin.avatar:avatar" mode=""></image>
<view class="xinxi" v-if="userxixin.mobile">
<view class="">{{userxixin.nickname?userxixin.nickname:'微信用户'}}</view>
<view class="">{{userxixin.mobile?userxixin.mobile:'暂无手机号'}}</view>
</view>
<view class="renlbtn" @click="face(userxixin.face_id)">{{userxixin.face_id!=0?'已认证':'人脸录入'}}</view>
<view class="xinxi" v-else>
<view class=""style="text-align: left;">登录</view>
</view>
<view class="renlbtn" v-if="userxixin.mobile" @click.stop="face(userxixin.face_id)">{{userxixin.face_id!=0?'已认证':'人脸录入'}}</view>
</view>
<view class="huiy" v-if="viplist.length>0">
<view class="" v-for="(item,index) in viplist" :key="index" style="height: 223rpx;">
<image class="huiyimg" src="@/static/hbg.png" mode=""></image>
<view class="huiybox">
<image class="huiyboximg" src="@/static/huangguan.png" mode=""></image>
<view class="huiywz">会员套餐</view>
<view class="huiywz">会员套餐<text style="float: right; font-weight: normal; font-size: 26rpx;">{{item.status_name}}</text></view>
</view>
<view class="huiyxx">
<view class="">{{item.card_name}}
@ -38,15 +42,19 @@
</view>
</view>
</view>
<view class="huiy" v-else>
<view class="huiy" v-else @click="face()">
<image class="huiyimg" src="@/static/hbg.png" mode=""></image>
<view class="huiybox">
<image class="huiyboximg" src="@/static/huangguan.png" mode=""></image>
<view class="huiywz">会员套餐</view>
</view>
<view class="huiyxx">
<view class="">9.9元套餐
<text>7</text>
</view>
</view>
</view>
</view>
<!-- <button open-type="chooseAvatar" @chooseavatar='chooseAvatar'>获取头像</button> -->
</view>
</template>
@ -55,12 +63,20 @@
data() {
return {
userxixin: {},
avatar: require("@/static/huangguan.png"),
viplist: []
avatar: require("@/static/logo.png"),
viplist: [],
top: 0
}
},
onLoad() {
this.top = uni.getSystemInfoSync().statusBarHeight
},
onShow() {
if(uni.getStorageSync("token")){
this.memberInfo()
}else{
this.userxixin={}
}
},
onShareAppMessage() {
return {
@ -74,6 +90,12 @@
},
gengx() {
if(!uni.getStorageSync("token")) {
uni.navigateTo({
url: "/pages/login/login"
})
return ;
}
uni.navigateTo({
url: "/pages/user/portrait/portrait"
})
@ -93,6 +115,12 @@
uni.navigateBack()
},
face(face_id) {
if(!uni.getStorageSync("token")) {
uni.navigateTo({
url: "/pages/login/login"
})
return ;
}
if (face_id != 0) {
uni.showToast({
icon: "none",
@ -111,12 +139,56 @@
</script>
<style scoped>
.bg{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
background: #f5f5f5;
}
.content{
width: 100%;
position: relative;
left: 0;
top: 0;
z-index: 2;
}
.top {
width: 100%;
left: 0;
z-index: 22;
top: 0;
height: 88rpx;
overflow: hidden;
position: fixed;
}
.top .xuzou{
width: 100%;
height: 88rpx;
display: flex;
position: fixed;
align-items: center;
position: relative;
z-index: 23;
}
.top .hs{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
}
.huiybox {
display: flex;
margin-left: 50rpx;
position: relative;
top: -200rpx;
font-family: PingFang SC;
align-items: center;
font-weight: bold;
font-size: 34rpx;
color: #E7CAAD;
@ -125,6 +197,7 @@
.huiywz {
margin-left: 22rpx;
margin-top: 10rpx;
flex: 1;
}
.huiyxx {
@ -148,12 +221,8 @@
}
.huiy {
margin: 0 auto;
width: 722rpx;
height: 230rpx;
position: absolute;
top: 344rpx;
left: 24rpx;
padding: 0 25rpx 25rpx;
overflow: hidden;
}
.huiyimg {
@ -187,13 +256,6 @@
color: #FFFFFF;
}
.top {
display: flex;
position: absolute;
top: 96rpx;
left: 20rpx;
}
.title {
padding-left: 14rpx;
}
@ -246,10 +308,9 @@
}
.mendian {
position: absolute;
top: 206rpx;
left: 24rpx;
padding: 40rpx 25rpx 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
overflow: hidden;
}
</style>

@ -1,19 +1,20 @@
<template>
<view>
<image src="@/static/bg.png" mode="" style="width: 100%;height: 928rpx;"></image>
<view class="top">
<image src="@/static/bg.png" mode="widthFix" class="bg" style="width: 100%;height: 928rpx;"></image>
<view class="top" :style="{'padding-top': top+'px'}">
<view class="xuzou" @click="fanhui">
<uni-icons type="left" size="18"></uni-icons>
<text class="title">更新信息</text>
<uni-icons type="left" size="22" style="margin-left: 25rpx;"></uni-icons>
<text class="title">修改个人信息</text>
</view>
</view>
<view class="content" :style="{'top': (top+44)+'px'}">
<view class="form">
<uni-row>
<uni-col :span="12">
头像:
</uni-col>
<uni-col :span='5' :offset="7">
<uni-file-picker @delete='touxiangimg' v-model="imageValue" fileMediatype="image" @select="select" :limit="1" mode="grid"
<uni-file-picker @delete='touxiangimg' :disable-preview="true" :del-icon="false" v-model="imageValue" fileMediatype="image" @select="select" :limit="1" mode="grid"
@success="success" :image-styles="imageStyles" @fail="fail" />
</uni-col>
</uni-row>
@ -27,16 +28,19 @@
placeholder="请输入昵称" />
</uni-col>
</uni-row>
<view style="border-bottom: 1px solid #999999;"></view>
</view>
<button class="subbtn" @click="subbtn">确认</button>
<view class="fottuichu" @click="outLogin">退出登录</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
top: 0,
FormData: {
name: '',
avatar:''
@ -55,7 +59,8 @@
},
}
},
onShow() {
onLoad() {
this.top = uni.getSystemInfoSync().statusBarHeight
this.memberInfo()
},
@ -63,16 +68,35 @@
memberInfo() {
this.$api.memberInfo().then(res => {
this.userxixin = res.data
this.FormData.avatar=this.userxixin.avatar
console.log('this.userxixin ',this.userxixin );
this.FormData.avatar=this.userxixin.avatar_id
this.imageValue={
"name": this.userxixin.avatar.indexOf(".png") !=-1?'png':'jpg',
"url": this.userxixin.avatar
}
this.FormData.name=this.userxixin.nickname
console.log('this.userxixin ',this.FormData );
})
},
outLogin() {
this.$api.outLogin().then(res => {
const that = this;
uni.showModal({
title: '温馨提示',
content: "你是否要确定退出?",
confirmColor: "#F8A617",
confirmText: "退出",
success(res) {
if(res.confirm){
that.$api.outLogin().then(res => {
uni.showToast({
title: "退出成功"
})
setTimeout(()=>{
uni.removeStorageSync("token")
uni.reLaunch({
url: '/pages/login/login'
uni.navigateBack({delta: 1})
},2000)
})
}
}
})
},
fanhui(){
@ -109,11 +133,13 @@
subbtn() {
console.log(787,this.imageValue[0]);
this.$api.memberUpdate({nickname:this.FormData.name,avatar:this.FormData.avatar}).then(res=>{
console.log(123,res);
if(res.code==200){
uni.switchTab({
url: "/pages/user/index"
uni.showToast({
title: "修改成功"
})
setTimeout(()=>{
uni.navigateBack({delta: 1})
},2000)
}
})
},
@ -153,47 +179,81 @@
<style lang="scss" scoped>
.fottuichu {
width: 702rpx;
height: 80rpx;
// background: #999999;
font-family: PingFang SC;
width: 700rpx;
line-height: 98rpx;
background: #000;
font-weight: 500;
font-size: 30rpx;
color: #222222;
color: #fff;
text-align: center;
line-height: 80rpx;
border-radius: 25rpx;
margin: 500rpx auto;
height: 98rpx;
border-radius: 98rpx;
margin: 30rpx auto;
}
.bg{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
background: #f5f5f5;
}
.content{
width: 100%;
position: relative;
left: 0;
top: 0;
z-index: 2;
}
.top {
width: 100%;
left: 0;
z-index: 22;
top: 0;
height: 88rpx;
overflow: hidden;
position: fixed;
}
.top .xuzou{
width: 100%;
height: 88rpx;
display: flex;
position: fixed;
align-items: center;
position: relative;
z-index: 23;
}
.top .hs{
width: 100%;
height: 100%;
position: absolute;
top: 96rpx;
left: 20rpx;
left: 0;
top: 0;
z-index: 1;
}
.title {
padding-left: 14rpx;
}
.subbtn {
margin-top: 40rpx;
margin-left: 50rpx;
margin-top: 300rpx;
text-align: center;
line-height: 98rpx;
color: #fff;
width: 660rpx;
width: 700rpx;
height: 98rpx;
background: #F8A617;
border-radius: 49rpx;
border-radius: 98rpx;
}
.form {
width: 700rpx;
height: 250rpx;
background: #FFFFFF;
line-height: 120rpx;
padding: 25rpx;
margin-top: -765rpx;
box-sizing: border-box;
margin: 0 auto;
margin-top: 30rpx;
}
.custom-navigation-bar {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 125 KiB

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 66 KiB

Loading…
Cancel
Save