初始化
This commit is contained in:
leiking
@@ -0,0 +1,256 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="card profile">
|
||||
<view class="row between">
|
||||
<view class="row">
|
||||
<image class="avatar" :src="avatarUrl" mode="aspectFill" />
|
||||
<view class="uinfo">
|
||||
<view class="u">微信用户</view>
|
||||
<view class="muted s">会员档案 · {{ tag }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="badge">VIP</view>
|
||||
</view>
|
||||
|
||||
<view class="stats row">
|
||||
<view class="st">
|
||||
<view class="v">{{ points }}</view>
|
||||
<view class="muted l">积分</view>
|
||||
</view>
|
||||
<view class="sep"></view>
|
||||
<view class="st">
|
||||
<view class="v">¥{{ balance }}</view>
|
||||
<view class="muted l">储值</view>
|
||||
</view>
|
||||
<view class="sep"></view>
|
||||
<view class="st">
|
||||
<view class="v">{{ visitCount }}</view>
|
||||
<view class="muted l">到店</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="card menu">
|
||||
<view class="cell row between" @tap="goAppointments">
|
||||
<view class="c-l">
|
||||
<view class="c-t">我的预约</view>
|
||||
<view class="muted c-s">待到店 / 改约 / 取消</view>
|
||||
</view>
|
||||
<view class="arr">›</view>
|
||||
</view>
|
||||
<view class="cell row between" @tap="goCoupons">
|
||||
<view class="c-l">
|
||||
<view class="c-t">我的卡券 / 次卡</view>
|
||||
<view class="muted c-s">剩余次数 / 去使用</view>
|
||||
</view>
|
||||
<view class="arr">›</view>
|
||||
</view>
|
||||
<view class="cell row between" @tap="goRecords">
|
||||
<view class="c-l">
|
||||
<view class="c-t">消费记录</view>
|
||||
<view class="muted c-s">近 7 天 / 30 天</view>
|
||||
</view>
|
||||
<view class="arr">›</view>
|
||||
</view>
|
||||
<view class="cell row between" @tap="goSkin">
|
||||
<view class="c-l">
|
||||
<view class="c-t">我的肤质档案</view>
|
||||
<view class="muted c-s">肤质 / 需求 / 建议</view>
|
||||
</view>
|
||||
<view class="arr">›</view>
|
||||
</view>
|
||||
<view class="cell row between" @tap="goMsg">
|
||||
<view class="c-l">
|
||||
<view class="c-t">消息提醒</view>
|
||||
<view class="muted c-s">预约成功 / 到店提醒</view>
|
||||
</view>
|
||||
<view class="arr">›</view>
|
||||
</view>
|
||||
<view class="cell row between" @tap="goStore">
|
||||
<view class="c-l">
|
||||
<view class="c-t">门店设置</view>
|
||||
<view class="muted c-s">地址 / 电话 / 技师团队</view>
|
||||
</view>
|
||||
<view class="arr">›</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="card block">
|
||||
<view class="title">定位与附近流量</view>
|
||||
<view class="muted line">用于附近门店匹配与推荐展示</view>
|
||||
<view class="btn btn-ghost loc" @tap="getLoc">获取定位</view>
|
||||
<view class="muted line" v-if="locText">{{ locText }}</view>
|
||||
</view>
|
||||
|
||||
<view class="card foot">
|
||||
<view class="row between">
|
||||
<view class="muted">版本 {{ version }}</view>
|
||||
<view class="kefu" @tap="call">联系客服</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<AiFloat />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AiFloat from '@/components/AiFloat.vue'
|
||||
import { storeProfile } from '@/common/mockData'
|
||||
|
||||
export default {
|
||||
components: { AiFloat },
|
||||
data() {
|
||||
return {
|
||||
avatarUrl:
|
||||
'https://coresg-normal.trae.ai/api/ide/v1/text_to_image?prompt=photorealistic%20portrait%20avatar%2C%20friendly%20woman%2C%20clean%20background%2C%20soft%20studio%20lighting%2C%20high-end%20beauty%20brand%20style%2C%2035mm%2C%20ultra%20detail&image_size=square',
|
||||
points: 1260,
|
||||
balance: 200,
|
||||
visitCount: 12,
|
||||
tag: '敏感肌 · 高复购',
|
||||
locText: '',
|
||||
version: '1.0.0',
|
||||
store: storeProfile
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goAppointments() {
|
||||
uni.navigateTo({ url: '/pages/appointments/list' })
|
||||
},
|
||||
goCoupons() {
|
||||
uni.navigateTo({ url: '/pages/coupons/list' })
|
||||
},
|
||||
goRecords() {
|
||||
uni.navigateTo({ url: '/pages/records/list' })
|
||||
},
|
||||
goSkin() {
|
||||
uni.navigateTo({ url: '/pages/profile/skin' })
|
||||
},
|
||||
goMsg() {
|
||||
uni.navigateTo({ url: '/pages/messages/settings' })
|
||||
},
|
||||
goStore() {
|
||||
uni.navigateTo({ url: '/pages/store/detail' })
|
||||
},
|
||||
getLoc() {
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: (res) => {
|
||||
this.locText = `已获取：${res.latitude.toFixed(6)}, ${res.longitude.toFixed(6)}`
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({ title: '未授权定位', icon: 'none' })
|
||||
}
|
||||
})
|
||||
},
|
||||
call() {
|
||||
uni.makePhoneCall({ phoneNumber: this.store.phone })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.profile {
|
||||
padding: 26rpx;
|
||||
}
|
||||
.avatar {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
border-radius: 999rpx;
|
||||
background: rgba(17, 24, 39, 0.06);
|
||||
border: 1rpx solid rgba(17, 24, 39, 0.08);
|
||||
}
|
||||
.uinfo {
|
||||
margin-left: 18rpx;
|
||||
}
|
||||
.u {
|
||||
font-size: 38rpx;
|
||||
font-weight: 950;
|
||||
}
|
||||
.s {
|
||||
margin-top: 10rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.badge {
|
||||
padding: 12rpx 16rpx;
|
||||
border-radius: 999rpx;
|
||||
background: rgba(59, 130, 246, 0.14);
|
||||
color: #1d4ed8;
|
||||
font-size: 24rpx;
|
||||
font-weight: 950;
|
||||
}
|
||||
.stats {
|
||||
margin-top: 22rpx;
|
||||
padding: 18rpx;
|
||||
border-radius: 18rpx;
|
||||
background: rgba(17, 24, 39, 0.04);
|
||||
}
|
||||
.st {
|
||||
flex: 1;
|
||||
}
|
||||
.v {
|
||||
font-size: 32rpx;
|
||||
font-weight: 950;
|
||||
}
|
||||
.l {
|
||||
margin-top: 6rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.sep {
|
||||
width: 1rpx;
|
||||
height: 48rpx;
|
||||
background: rgba(17, 24, 39, 0.08);
|
||||
}
|
||||
.menu {
|
||||
margin-top: 18rpx;
|
||||
padding: 10rpx 22rpx;
|
||||
}
|
||||
.cell {
|
||||
padding: 18rpx 0;
|
||||
border-top: 1rpx solid rgba(17, 24, 39, 0.08);
|
||||
}
|
||||
.cell:first-of-type {
|
||||
border-top: 0;
|
||||
}
|
||||
.c-t {
|
||||
font-size: 30rpx;
|
||||
font-weight: 950;
|
||||
}
|
||||
.c-s {
|
||||
margin-top: 8rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.arr {
|
||||
font-size: 40rpx;
|
||||
color: rgba(17, 24, 39, 0.4);
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
.block {
|
||||
padding: 22rpx;
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
.title {
|
||||
font-weight: 950;
|
||||
font-size: 30rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
.line {
|
||||
padding: 8rpx 0;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.loc {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.foot {
|
||||
margin-top: 18rpx;
|
||||
padding: 18rpx 22rpx;
|
||||
}
|
||||
.kefu {
|
||||
padding: 12rpx 16rpx;
|
||||
border-radius: 999rpx;
|
||||
background: rgba(17, 24, 39, 0.06);
|
||||
font-size: 26rpx;
|
||||
font-weight: 900;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user