@@ -15,28 +15,24 @@
< image style = "width: 70px;height: 70px;border-radius: 50%;" :src = "userInfo.photo" @click ="showDiaLog" >
< / image >
< view style = "display: flex;flex-direction: column;margin-left: 10px;" v-if = "userInfo.nick!=''" >
< view style = "display: flex;flex-direction: column;margin-left: 10px;" >
< text style = "font-size: 16px;color: #fff;" @click ="showDiaLog" > {{ userInfo.nick }} < / text >
< text style = "font-size: 14px;color: #fff;" > { { userInfo . mobile } } < / text >
< / view >
< view style = "display: flex;flex-direction: column;margin-left: 10px;" v-if = "userInfo.nick==''" >
< text style = "font-size: 16px;color: #fff;" @click ="showDiaLog" > 完善信息 < / text >
< / view >
< / view >
< / view >
< view
style = "background: #fff ;flex-flow: 1; height: calc(100vh - 50vw - 48px); width: 100%; margin-top: -18vw;border-top-left-radius: 25px;border-top-right-radius: 25px;border-bottom-left-radius: 25px;border-bottom-right- radius: 25px;" >
style = "background: #F7F7F7 ;flex-flow: 1; height: calc(100vh - 50vw - 48px); width: 100%; margin-top: -18vw;border-radius: 25px;" >
< scroll-view scroll -y = " true "
style = " height: 100%; width: 100%; padding-top: 10px;
border-top-left-radius: 25px;border-top-right-radius: 25px;border-bottom-left-radius: 25px;border-bottom-right-radius: 25px;"
style = " height: 100%; width: 100%; padding: 15px;border-radius: 25px; box-sizing: border-box;"
bindscrolltoupper = "upper" bindscrolltolower = "lower" bindscroll = "scroll" >
< view style = " display: flex;flex-direction: column;
padding-top: 5vw;padding-left: 5vw;padding-right: 5vw;">
<!-- < view
style = " display: flex;flex-direction: column; padding-top: 5vw;padding-left: 5vw;padding-right: 5vw;">
< view style = "display: flex;flex-direction: row;align-items: center;" >
@@ -67,89 +63,256 @@
< / view >
< / view >
< / view > -- >
<!-- 预约记录 -- >
< view
style = "display: flex;flex-direction: column; border-radius: 10px;background: #fff; padding: 10px;" >
< text style = "font-size: 15px; color: #101010;font-weight: 600;font-family: sans-serif;" > 预约记录 < / text >
< view style = "display: flex;flex-direction: row;align-items: center;margin-top: 10px;" >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< view style = "position: relative;width: 35px;height: 35px;" >
< image style = "width: 25px;height: 25px;margin-left: 5px; margin-top: 5px; "
src = "../../static/basket_icon.png" mode = "aspectFill" > < / image >
< view v-if = "data.count>0" style = "border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
position: absolute;
top: 2px;
right: 0px;
padding: 2px 5px;
width: auto;" > { { data . count } } < / view >
< / view >
< text style = "font-size: 13px; color: #101010;margin-top: 5px;" > 全部预约 < / text >
< / view >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< view style = "position: relative;width: 35px;height: 35px;" >
< image style = "width: 25px;height: 25px;margin-left: 5px; margin-top: 10px; "
src = "../../static/basket_icon.png" mode = "aspectFill" > < / image >
< view v-if = "data.count>0" style = "border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
position: absolute;
top: 2px;
right: 0px;
padding: 2px 5px;
width: auto;" > { { data . count } } < / view >
< / view >
< text style = "font-size: 13px; color: #101010;margin-top: 5px;" > 待提菜 < / text >
< / view >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< view style = "position: relative;width: 35px;height: 35px;" >
< image style = "width: 25px;height: 25px;margin-left: 5px; margin-top: 10px; "
src = "../../static/basket_icon.png" mode = "aspectFill" > < / image >
< view v-if = "data.count>0" style = "border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
position: absolute;
top: 2px;
right: 0px;
padding: 2px 5px;
width: auto;" > { { data . count } } < / view >
< / view >
< text style = "font-size: 13px; color: #101010;margin-top: 5px;" > 已提菜 < / text >
< / view >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< view style = "position: relative;width: 35px;height: 35px;" >
< image style = "width: 25px;height: 25px;margin-left: 5px; margin-top: 10px; "
src = "../../static/basket_icon.png" mode = "aspectFill" > < / image >
< view v-if = "data.count==0" style = "border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
position: absolute;
top: 2px;
right: 0px;
padding: 2px 5px;
width: auto;" > { { data . count } } < / view >
< / view >
< text style = "font-size: 13px; color: #101010;margin-top: 5px;" > 过期未提 < / text >
< / view >
< / view >
< / view >
<!-- < loading-state ref = "pageView" @request ="request" > - - >
<!-- 订单记录 -- >
< view
style = "display: flex;flex-direction: column; border-radius: 10px;background: #fff; padding: 10px; margin-top: 10px;" >
< view v-if = "banKInfo!=null" style = "display: flex;flex-direction: column; margin-top: 15px;
border-top: 2px #f3f3f3 solid;padding-top: 15px; margin-left: 4vw;margin-right: 4vw;" >
< view style = "display: flex;flex-direction: row;align-items: center;" >
< text style = "flex: 1;" > { { banKInfo . storeName } } < / text >
< text style = "margin-left: 10px;margin-right: 5px;" > 变更 < / text >
< image src = "../../static/right_icon.png" style = "width: 15px;height: 15px;" > < / image >
< text style = "font-size: 15px; color: #101010;font-weight: 600;font-family: sans-serif;" > 订单记录 < / text >
< view style = "display: flex;flex-direction: row;align-items: center;margin-top: 10px; " >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< view style = "position: relative;width: 35px;height: 35px;" >
< image style = "width: 25px;height: 25px;margin-left: 5px; margin-top: 5px; "
src = "../../static/basket_icon.png" mode = "aspectFill" > < / image >
< view v-if = "data.count>0" style = "border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
position: absolute;
top: 2px;
right: 0px;
padding: 2px 5px;
width: auto;" > { { data . count } } < / view >
< / view >
< text style = "font-size: 13px; color: #101010;margin-top: 5px;" > 待付款 < / text >
< / view >
< view style = "display: flex;flex-direction: row;align-items: center;margin-top: 15px;" >
< image src = "https://supervise.yxtsoft.com/lpk/image/date.png"
style = "width: 20px;height: 20px;" > < / image >
< text style = "margin-left: 5px;flex: 1;color: #ECAF4A;" > 营业时间 : { { banKInfo . businessHours } } < / text >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< view style = "position: relative;width: 35px;height: 35px;" >
< image style = "width: 25px;height: 25px;margin-left: 5px; margin-top: 10px; "
src = "../../static/basket_icon.png" mode = "aspectFill" > < / image >
< view v-if = "data.count==0" style = "border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
position: absolute;
top: 2px;
right: 0px;
padding: 2px 5px;
width: auto;" > { { data . count } } < / view >
< / view >
< text style = "font-size: 13px; color: #101010;margin-top: 5px;" > 已付款 < / text >
< / view >
< view style = "display: flex;flex-direction: row;align-items: center;margin-top: 10px;" >
< image src = "https://supervise.yxtsoft.com/lpk/image/location.png"
style = "width: 20px;height: 20px;" > < / image >
< text style = "margin-left: 5px;flex: 1; color: #ECAF4A;" > { { banKInfo . address } } < / text >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< / view >
< view style = "display: flex;flex-direction: row;align-items: center;margin-top: 15px;" >
< text style = "flex: 1;" > 提菜人 < / text >
< text style = "margin-left: 10px;margin-right: 5px;" > { { banKInfo . name } } < / text >
< image src = "../../static/right_icon.png" style = "width: 15px;height: 15px;" > < / image >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center; " >
< / view >
< view style = "display: flex;flex-direction: row;align-items: center;margin-top: 10px;" >
< text style = "flex: 1;" > 联系信息 < / text >
< text style = "margin-left: 10px;margin-right: 5px;" > { { banKInfo . phone } } < / text >
< image src = "../../static/right_icon.png" style = "width: 15px;height: 15px;" > < / image >
< / view >
< / view >
< view style = "display: flex;flex-direction: column;margin-top: 15px;margin-left: 4vw;margin-right: 4vw;
border-top: 2px #f3f3f3 solid;padding-top: 15px;" >
< / view >
<!-- 转赠记录 -- >
< view
style = "display: flex;flex-direction: column; border-radius: 10px;background: #fff; padding: 10px; margin-top: 10px;" >
< text style = "font-size: 15px; color: #101010;font-weight: 600;font-family: sans-serif;" > 转赠记录 < / text >
< view style = "display: flex;flex-direction: row;align-items: center;margin-top: 10px;" >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< view style = "position: relative;width: 35px;height: 35px;" >
< image style = "width: 25px;height: 25px;margin-left: 5px; margin-top: 5px; "
src = "../../static/basket_icon.png" mode = "aspectFill" > < / image >
< view v-if = "data.count>0" style = "border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
position: absolute;
top: 2px;
right: 0px;
padding: 2px 5px;
width: auto;" > { { data . count } } < / view >
< view style = "display: flex;flex-direction: row;align-items: center;" >
< view style = "display: flex;flex-direction: row;align-items: center; flex: 1;" >
< view style = "background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;" > < / view >
< view style = "background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;" > < / view >
< text style = "margin-left: 8px;font-size: 18px;color: #333;font-weight: 600;font-family: sans-serif;" > 推荐有礼 < / text >
< / view >
< text style = "font-size: 13px; color: #101010;margin-top: 5px;" > 赠与我的 < / text >
< / view >
< view style = "display: flex;flex-direction: row;align-items: center;" >
< text style = "margin-left: 10px;margin-right: 5px;" > 马上推荐 < / text >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< view style = "position: relative;width: 35px;height: 35px;" >
< image style = "width: 25px;height: 25px;margin-left: 5px; margin-top: 10px; "
src = "../../static/basket_icon.png" mode = "aspectFill" > < / image >
< view v-if = "data.count>0" style = "border-radius: 50%;text-align: center;background: #f00;color: #fff;font-size: 8px;
position: absolute;
top: 2px;
right: 0px;
padding: 2px 5px;
width: auto;" > { { data . count } } < / view >
< / view >
< text style = "font-size: 13px; color: #101010;margin-top: 5px;" > 我的转赠 < / text >
< / view >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< / view >
< view
style = "flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
< / view >
< / view >
< / view >
< view style = "display: flex;flex-direction: column; border-radius: 10px;background: #fff;
padding: 10px; margin-top: 10px;width: 100%;box-sizing: border-box;" >
< view style = "display: flex;flex-direction: row;justify-content: space-between;width: 100%;" >
< view style = "display: flex;flex-direction: row;align-items: center;flex: 1;" >
< text
style = "font-size: 15px;color: #101010;font-weight: 600;font-family: sans-serif;" > 推荐有礼 < / text >
< image src = "../../static/share_gift.png"
style = "margin-left: 5px; width: 20px;height: 20px;" > < / image >
< / view >
<!-- < view style = "display: flex;flex-direction: row;align-items: center;" @click ="" >
< text style = "margin-right: 5px;color: #FF9900;font-size: 12px;" > 马上邀请 < / text >
< image src = "../../static/right_icon.png" style = "width: 15px;height: 15px;" > < / image >
< / view > -- >
< button open -type = " share " class = 'sharebtn' >
< view
style = "display: flex;flex-direction: row;align-items: center;justify-content: flex-end;" >
< text style = "margin-right: 5px;color: #FF9900;font-size: 12px;" > 马上邀请 < / text >
< image src = "../../static/right_icon.png" style = "width: 15px;height: 15px;" > < / image >
< / view >
< / view >
< text style = "font-size: 12px;color: #4B4B4B; margin-top: 8px;" > 邀请新朋友后 , 您和您的朋友将获得 “ 蔬菜品鉴礼包 ” 。 < / text >
< view style = "display: flex;flex-direction: row;align-items: center; " >
< image :src = "recommend.iconUrl" style = "width: 35%;height: 150px; border-radius: 10px;" mode = "aspectFill" >
< / image >
< view style = "display: flex;flex-direction: column; margin-left: 20px; " >
< view v-for = "(child,pos) in recommend.recordList" :key="pos"
style = "display: flex;flex-direction: column;" >
< text style = "color: #424242; font-size: 12px;line-height: 20px;" > * { { child . content } } < / text >
< / view >
< / view >
< / view >
< / button >
< / view >
< view style = "height: 150px;" > < / view >
< text style = "font-size: 12px;color: #4B4B4B; margin-top: 8px;" > 邀请新朋友后 , 您和您的朋友将获得 “ 蔬菜品鉴礼包 ” 。 < / text >
<!-- < view style = "display: flex;flex-direction: row;align-items: center; " >
< image :src = "recommend.iconUrl" style = "width: 35%;height: 150px; border-radius: 10px;"
mode = "aspectFill" >
< / image >
< view style = "display: flex;flex-direction: column; margin-left: 20px; " >
< view v-for = "(child,pos) in recommend.recordList" :key="pos"
style = "display: flex;flex-direction: column;" >
< text style = "color: #424242; font-size: 12px;line-height: 20px;" > * { { child . content } } < / text >
< / view >
< / view >
< / view > -- >
< / view >
<!-- < / loading-state > -- >
@@ -157,101 +320,21 @@
< / view >
<!-- 弹窗蒙版 -- >
< view class = "model" catchtouchmove = 'preventTouchMove' v -if = ' showModal ' @click.stop ="colseDialog()" > < / view >
< view class = "modalDlg" catchtouchmove = 'preventTouchMove' v -if = ' showModal ' >
< view style = "display:flex;flex-direction: column;justify-content: center;align-items: center;
margin-top: 20px;" >
< image src = "../../static/logo_icon.png" style = "width: 20vw;height: 20vw;" > < / image >
< text style = "margin-top: 10px;" > 汇融云菜窖 < / text >
< text style = "margin-top: 10px;" > 邀请补全您的个人信息 < / text >
< text style = "margin-top: 10px;" > ( 头像 、 昵称 ) < / text >
< view style = "display: flex;flex-direction: column;
margin-top: 20px;" >
< view
style = "display: flex;flex-direction: row; justify-content: space-between;align-items: center;" >
< text > 头像 < / text >
< image :src = "dialogInfo.url"
style = "width: 40px; height: 40px; border-radius: 50%;background-color: #ccc;" > < / image >
< / view >
< view
style = "display: flex;flex-direction: row; justify-content: space-between;align-items: center;" >
< text > 昵称 < / text >
< input placeholder = "请输入昵称"
style = "font-size: 30rpx;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;"
:value = "dialogInfo.name" @input ="onKeyInput1" / >
< / view >
< view
style = "display: flex;flex-direction: row; justify-content: space-between;align-items: center;" >
< text > 手机号码 < / text >
< input placeholder = "请输入手机号码" type = "number" maxlength = "11"
style = "font-size: 30rpx;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;"
:value = "dialogInfo.mobile" @input ="onKeyInput2" / >
< / view >
< / view >
< / view >
< view style = "display: flex;flex-direction: row;margin-top: 20px;" >
< button style = "flex: 1;" class = 'btn1' @click ="colseDialog()" > 取消 < / button >
< button style = "flex: 1;" class = 'btn2' open -type = " chooseAvatar " @chooseavatar ="onChooseAvatar"
v-if = "chooseAvatar" > 上传头像 < / button >
< button style = "flex: 1;" class = 'btn2' @click ="saveDialog()" v-if = "!chooseAvatar" > 确定 < / button >
< / view >
< / view >
< ! - - 弹窗蒙版 - - >
< view class = "model" catchtouchmove = 'preventTouchMove' v -if = ' showModal2 ' @click.stop ="colseDialog2()" > < / view >
< view class = "modalDlg" catchtouchmove = 'preventTouchMove' v -if = ' showModal2 ' >
< view style = "display:flex;flex-direction: column;justify-content: center;align-items: center;
margin-top: 20px;" >
< image src = "../../static/logo.png" style = "width: 20vw;height: 20vw;" > < / image >
< text style = "margin-top: 10px;" > 汇融云菜窖 < / text >
< text style = "margin-top: 10px;" > 申请获取您的手机号码 < / text >
< / view >
< view style = "display: flex;flex-direction: row;margin-top: 20px;" >
< button style = "flex: 1;" class = 'btn1' @click ="colseDialog()" > 拒绝 < / button >
< button style = "flex: 1;" class = 'btn2' open -type = " getPhoneNumber " > 允许 < / button >
< / view >
< / view >
< / view >
< / template >
< script >
//引入bus
import bus from '@/common/bus' ;
import config from '@/common/config.js'
export default {
data ( ) {
return {
uploadAction : config . baseUrl + "/lpkcustomer/uploadfile" ,
showModal : false ,
showModal2 : false ,
chooseAvatar : true ,
page : {
startHeight : 0 ,
endHeight : 0
} ,
data : { } ,
data : {
count : "1" ,
} ,
userInfo : {
nick : "" ,
mobile : "绑定手机号" ,
@@ -263,8 +346,8 @@
mobile : ""
} ,
headImage : "" ,
recommend : { } ,
banKInfo : null
recommend : { } ,
banKInfo : null
}
} ,
onShow ( ) {
@@ -275,7 +358,6 @@
}
this . getUserInfo ( )
this . getStoreBySid ( )
this . myRecommend ( )
} ,
onLoad ( options ) {
@@ -308,141 +390,72 @@
} )
} ,
getStoreBySi d( ) {
myRecommen d( ) {
let _this = this
_this . $api . getStoreBySid ( getApp ( ) . globalData . sid ) . then ( ( resp ) => {
_this . banKInfo = resp
} ) . catch ( e => {
} )
} ,
myRecommend ( ) {
let _this = this
_this . $api . myRecommend ( getApp ( ) . globalData . sid ) . then ( ( resp ) => {
_this . recommend = resp
_this . recommend = resp
} ) . catch ( e => {
} )
} ,
showDiaLog ( ) {
// this.showModal = true
uni . navigateTo ( {
url : '/pages/me/base_info'
} )
} ,
colseDialog ( ) {
this . showModal = false
} ,
saveDialog ( ) {
let _this = this
if ( this . stringIsEmpty ( this . dialogInfo . name ) ) {
this . shortToast ( '请输入昵称' )
return
}
if ( this . dialogInfo . mobile . length != 11 ) {
this . shortToast ( '手机号码格式不对' )
return
}
var params = {
sid : getApp ( ) . globalData . sid ,
photo : _this . headImage ,
nick : _this . dialogInfo . name ,
mobile : _this . dialogInfo . mobile
}
_this . $api . uploadHandImage ( params ) . then ( ( resp ) => {
// if (resp.success) {
_this . chooseAvatar = true
_this . colseDialog ( )
_this . userInfo = {
nick : _this . dialogInfo . name ,
mobile : _this . dialogInfo . mobile ,
photo : _this . headImage
}
} ) . catch ( e => {
console . log ( 'eeeee' , e )
onShareAppMessage : function ( res ) {
console . log ( "res" , res )
console . log ( "data" , res . target . dataset )
var data = res . target . dataset . info
// ①
let shareData = JSON . stringify ( {
// params: {
// code: data.code,
// codeKey: data.codeKey,
// customerSid: ''
// },
// functionName: 'bindCard',
// url: '/pages/detail/detail_affeection?sid=' + data.sid
url : '/pages/home/cloudCard2?shareSid=' + getApp ( ) . globalData . sid ,
functionName : 'share'
} )
// 转码传输
let value = encodeURIComponent ( shareData )
} ,
showDiaLog2 ( ) {
this . showModal2 = true
} ,
colseDialog2 ( ) {
this . showModal2 = false
} ,
onKeyInput1 ( event ) {
this . dialogInfo . name = event . target . value
} ,
onKeyInput2 ( event ) {
this . dialogInfo . mobile = event . target . value
} ,
onChooseAvatar ( e ) {
this . dialogInfo . url = e . detail . avatarUrl ;
this . uploadImage ( e . detail . avatarUrl )
} ,
uploadImage ( imagePath ) {
let _this = this
wx . uploadFile ( {
url : _this . uploadAction , // 上传图片的接口地址
fileType : "image" ,
filePath : imagePath , // 图片文件路径
name : 'file' , // 文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容
success : ( res ) => {
// 上传成功后, 将服务器返回的图片地址更新到image标签中
let info = JSON . parse ( res . data )
_this . headImage = info . data . fullUrl
_this . chooseAvatar = false
return {
title : '汇融惠享-云菜窖' ,
// ②
path : '/pages/login/login?data=' + value ,
imageUrl : 'https://supervise.yxtsoft.com/lpk/image/shareAffeection.png' , //自定义图片路径,显示图片长宽比是 5:4。
success : function ( res ) {
console . log ( 'aaaa' , "分享成功" )
} ,
fail : function ( res ) {
console . log ( res ) ;
// 转发失败
console . log ( 'aaaa' , "用户点击了取消" )
}
} )
}
} ,
}
}
< / script >
< style >
. btn1 {
font - size : 18 px ;
color : # 949094 ;
. share btn {
margin - right : - 10 px ;
background : # fff ;
height : 13 vw ;
line - height : 13 vw ;
text - align : center ;
border- bottom - left - radius : 20 px ;
/* font-size: 12px;
color: #fff;
width: 30vw;
border-radius: 20px; */
}
. btn1 : : after {
/* border: none; */
}
. btn2 {
font - size : 18 px ;
color : # FB913C ;
background : # fff ;
height : 13 vw ;
line - height : 13 vw ;
text - align : center ;
border - bottom - right - radius : 20 px ;
}
. btn2 : : after {
/* border: none; */
. share btn: : after {
border: none ;
}
@@ -455,34 +468,4 @@
/* 让背景图基于容器大小伸缩 */
background - size : 100 % 100 % ;
}
/* 弹窗样式 */
. model {
position : absolute ;
width : 100 % ;
height : 100 % ;
background : # 000 ;
z - index : 999 ;
opacity : 0.5 ;
top : 0 ;
left : 0 ;
display : flex ;
align - items : center ;
justify - content : center ;
}
. modalDlg {
/* 设置超出滚动 */
position : absolute ;
top : 50 vw ;
left : 10 vw ;
width : 80 % ;
z - index : 9999 ;
background - color : # fff ;
border - radius : 20 px ;
display : flex ;
flex - direction : column ;
}
< / style >