<template>
|
<!-- 会员详情 -->
|
<view>
|
<view class="header flex flex-v align-center">
|
<image class="header-img" src="../../static/images/head-img.jpg"></image>
|
<text class="font-18 mt-5">333</text>
|
<text class="font-14 mt-5">会员编号: 101010</text>
|
<view class="flex align-center mt-5">
|
<text class="font-12 mr-10">{{handlePhone(15569216885)}}</text>
|
<text class="icon iconfont" :class="isHidePhone?'iconyanjing':'iconyanjing1'" @click="isHidePhone=!isHidePhone"></text>
|
</view>
|
<view class="flex mt-10">
|
<view class="icon-box mr-20" @click="call">
|
<text class="icon iconfont icondianhua blue"></text>
|
</view>
|
<view class="icon-box" @click="sendMessage">
|
<text class="icon iconfont iconxinxiduanxinsixinduihua blue"></text>
|
</view>
|
</view>
|
</view>
|
<view class="content">
|
<view class="content-row flex justify-around">
|
<view class="center">
|
<text class="font-18 red">600.00</text>
|
<text class="font-14 mt-10 block">余额</text>
|
</view>
|
<view class="center">
|
<text class="font-18 green">600.00</text>
|
<text class="font-14 mt-10 block">赠送余额</text>
|
</view>
|
<view class="center">
|
<text class="font-18 blue">600.00</text>
|
<text class="font-14 mt-10 block">累计消费</text>
|
</view>
|
</view>
|
<view class="content-row flex flex-wrap">
|
<view class="detail-item">
|
<navigator url="./editMember" hover-class="none" >
|
<image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail1.png"></image>
|
<text class="mt-5">会员信息</text>
|
</navigator>
|
</view>
|
<view class="detail-item">
|
<navigator url="./projectPlan" hover-class="none" >
|
<image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail2.png"></image>
|
<text class="font-14 mt-5">项目/套餐</text>
|
</navigator>
|
</view>
|
<view class="detail-item">
|
<navigator url="./membershipCard" hover-class="none" >
|
<image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail3.png"></image>
|
<text class="mt-5">卡项</text>
|
</navigator>
|
</view>
|
<view class="detail-item">
|
<navigator url="./skinDetection" hover-class="none" >
|
<image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail4.png"></image>
|
<text class="mt-5">皮肤检测</text>
|
</navigator>
|
</view>
|
<view class="detail-item">
|
<navigator url="../workbench/orderList" hover-class="none" >
|
<image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail5.png"></image>
|
<text class="mt-5">订单记录</text>
|
</navigator>
|
</view>
|
<view class="detail-item">
|
<navigator url="../workbench/serviceOrderList" hover-class="none" >
|
<image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail6.png"></image>
|
<text class="mt-5">服务单记录</text>
|
</navigator>
|
</view>
|
<view class="detail-item">
|
<image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail7.png"></image>
|
<text class="mt-5">跟进记录</text>
|
</view>
|
<view class="detail-item">
|
<navigator url="" hover-class="none" >
|
<image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail3.png"></image>
|
<text class="mt-5">会员档案</text>
|
</navigator>
|
</view>
|
</view>
|
</view>
|
<view class="sticky-footer flex justify-between">
|
<navigator url="../workbench/selectProduct/index" class="btn">
|
<button class="white-btn">开单</button>
|
</navigator>
|
<navigator url="../workbench/selectService" class="btn">
|
<button class="blue-btn">预约</button>
|
</navigator>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default{
|
data(){
|
return{
|
isHidePhone: true
|
}
|
},
|
methods:{
|
handlePhone(val){
|
if(this.isHidePhone){
|
return this.$utils.encryptAccount(val);
|
}
|
return val;
|
},
|
call(){
|
uni.makePhoneCall({
|
phoneNumber: '15200889645',
|
success: (res) => {
|
|
},
|
fail: (err) => {
|
|
}
|
})
|
},
|
sendMessage(){
|
// #ifdef APP-PLUS
|
let msg = plus.messaging.createMessage(plus.messaging.TYPE_SMS);
|
msg.to = ['15200889645'];
|
msg.body = 'This is HTML5 Plus example test message';
|
plus.messaging.sendMessage(msg);
|
// #endif
|
}
|
}
|
}
|
</script>
|
|
<style>
|
.status_bar{
|
background: #518EFF;
|
color: #FFFFFF;
|
}
|
.header{
|
background: #518EFF;
|
color: #FFFFFF;
|
border-bottom-left-radius: 20px;
|
border-bottom-right-radius: 20px;
|
padding: 0 15px 15px;
|
}
|
.header-img{
|
width: 80px;
|
height: 80px;
|
border-radius: 50%;
|
}
|
.icon-box{
|
width: 28px;
|
height: 28px;
|
line-height: 28px;
|
text-align: center;
|
background: #FFFFFF;
|
border-radius: 50%;
|
}
|
.icon{
|
font-size: 18px;
|
}
|
.content{
|
padding: 0 10px;
|
}
|
.content-row{
|
border: 1px solid #EDEAF4;
|
background: #FFFFFF;
|
margin-top: 10px;
|
padding: 15px 0;
|
border-radius: 4px;
|
box-shadow:0 6px 6px rgba(237,234,244,0.5);
|
}
|
.detail-item{
|
width: 25%;
|
margin: 10px 0;
|
text-align: center;
|
font-size: 12px;
|
}
|
.detail-icon{
|
display: block;
|
width: 24px;
|
height: 24px;
|
margin: 0 auto 5px;
|
}
|
.sticky-footer{
|
margin: 0 -8px;
|
}
|
.btn{
|
width: 100%;
|
margin: 0 8px;
|
}
|
</style>
|