Commit 830d4cef by zhangzhen

权益会员功能调试

parent 85d9f140
import http from "@/common/vmeitime-http/index.js"
// 查询充值记录列表
export const recordsList=(data)=>{
let url=`/recharge/list`
// 可购买的权益列表
export const equityMembersList=(data)=>{
let url=`/equityMembersOrderConfig/list`
return http.get(url,data)
}
export const createEquityMembers=(data)=>{
let url=`/equityMembersOrder/createEquityMembers`
return http.post(url,data)
}
......@@ -142,6 +142,13 @@
"style": {
"navigationBarTitleText": "设备控制"
}
},
{
"path" : "pages/vipCreate/vipCreate",
"style" :
{
"navigationBarTitleText" : "权益充值"
}
}
],
......
<template>
<view class="myInfo">
<view class="header" :style="{height: statusBarHeight+180+'px',paddingTop: statusBarHeight+'px'}">
<view class="header-content-box">
<view class="login-content">
<view v-if="loginStatus" class="flex-1 flex-row" @tap="onNavToSetUserInfo">
<view class="cu-avatar xl margin-left" >
<image class="avatar-bg" :src="assetsPath+'/avatar_bg.png'" mode="scaleToFill"></image>
<view class="avatar-box">
<image class="avatar-img" :src="userInfo.avatar|| assetsPath+'/logo_icon.png'" mode="scaleToFill" @tap.stop="onProview"></image>
</view>
</view>
<view class="flex-col margin-left">
<text class="text-title text-lg text-bold text-xxl">{{userInfo.nickName||"凑角_"+userName}}</text>
<!-- <view class="flex-row" style="margin-top: 10rpx;">
<text class="cuIcon-hotfill text-white"></text>
<text class="text-white text-lg">会员用户</text>
</view> -->
</view>
<view class="nav-right" @tap.stop="onNavToSetUserInfo">
<image class="img" :src="assetsPath+'/setting.png'" mode="scaleToFill"></image>
<text class="text-gray">修改资料</text>
</view>
</view>
<view v-else class="none-login margin-left" @tap="onNavToLogin">
<view class="cu-avatar xl round">
<image class="avatar-img" :src=" assetsPath+'/avatar_no.png'" mode="scaleToFill"></image>
</view>
<text class="text-gray margin-left" >授权登录</text>
</view>
<view class="flex-between amount-coupon" :style="{background:'url('+assetsPath+'/my_coupon_bg.png) 0 0 / 100% 100% no-repeat'}">
<view class="part-left">
<text v-if="loginStatus" class="text-title text-xl">会员用户专享</text>
<text v-else class="text-title text-xl">点击上方授权登录,才能享受优惠哦!</text>
</view>
<view v-if="loginStatus" class="flex-row" @tap="onNavToMyCoupon">
<text class="text-name text-xl">优惠券</text>
<text class="text-white text-xl text-bold">{{userInfo.number|| 0}}</text>
</view>
</view>
</view>
</view>
</view>
<view class="flex-col content-box">
<view class="user-action">
<view v-for="(item,k) in userAction" :key="k" v-if="item.show" class="action-box" >
<view :style="{background:item.color}" class="action-item" @tap="onActionNav(item,k)">
<view class="flex-1">
<text class="text-title text-lg">{{item.label}}</text>
</view>
<view class="img-box">
<image :src="item.iconUrl" mode="widthFix"></image>
</view>
</view>
</view>
</view>
<view class="main">
<view class="cu-list menu sm-border">
<view class="cu-item arrow" @tap="onHandle(6)">
<view class="content" style="position: relative;">
<image :src="assetsPath+'/my_list_3.png'" class="png" mode="aspectFit"></image>
<text class="text-title">我的车辆</text>
<view class="numberplate">
<text>{{userInfo.numberplate || ''}}</text>
</view>
</view>
</view>
<view class="cu-item arrow" @tap="onHandle(1)">
<view class="content">
<image :src="assetsPath+'/my_list_1.png'" class="png" mode="aspectFit"></image>
<text class="text-title">客服咨询</text>
</view>
</view>
<view class="cu-item arrow" @tap="onHandle(2)">
<view class="content">
<image :src="assetsPath+'/my_list_2.png'" class="png" mode="aspectFit"></image>
<text class="text-title">WIFI连接</text>
</view>
</view>
<view class="cu-item arrow" @tap="onHandle(3)">
<view class="content">
<image :src="assetsPath+'/my_list_3.png'" class="png" mode="aspectFit"></image>
<text class="text-title">全国门店</text>
</view>
</view>
<view class="cu-item arrow" @tap="onHandle(4)">
<view class="content">
<image :src="assetsPath+'/my_list_4.png'" class="png" mode="aspectFit"></image>
<text class="text-title">联系我们</text>
</view>
</view>
<view v-if="userInfo.isAdmin" class="cu-item arrow" @tap="onHandle(5)">
<view class="content">
<image :src="assetsPath+'/my_list_4.png'" class="png" mode="aspectFit"></image>
<text class="text-title">设备控制</text>
</view>
</view>
</view>
</view>
</view>
<!-- <view class="login-out" v-if="loginStatus">
<button class="cu-btn block bg-pink lg round" @tap="onLoginOut">
<text class="cuIcon-exit"></text>退出登录
</button>
</view> -->
<LoginPop ref="loginPop" @success="onCheckUserLogin" />
<f-tabbar></f-tabbar>
<uni-popup ref="popup" type="bottom" maskClick="false">
<view class="popup-content">
<view class="flex-between title-box">
<text class="text-black text-bold text-xl">无线WI-FI</text>
<text class="cuIcon-roundclose text-gray text-xxl" @tap="onClose"></text>
</view>
<view class="flex-col">
<view class="text">
<text class="text-title text-xl">WI-FI名称:</text>
<text class="text-title text-xxl">{{wifiData.name}}</text>
</view>
<view class="text">
<text class="text-title text-xl">WI-FI密码:</text>
<text class="text-title text-xxl">{{wifiData.password}}</text>
</view>
</view>
<view class="box-btn">
<button class="cu-btn line-pink lg" @tap="onCopy">复制密码</button>
<button class="cu-btn bg-pink lg" @tap='onConnectWifi'>一键连接</button>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import fTabbar from '@/components/module/f-tabbar/f-tabbar';
import {getUserInfo,loginOut,systemConfig} from "@/api/index.js"
import config from "@/config/index.config"
import LoginPop from "@/components/login/login"
import {deviceCtrlAuth} from '@/api/store.js'
export default {
components: {
fTabbar,
LoginPop
},
data() {
return {
loginStatus: true,
statusBarHeight: this.statusBarHeight,
assetsPath:config.assetsPath,
hostUrl: config.hostUrl,
userInfo:{},
userAction:[],
wifiData:{
name:"",
password:''
},
servicePhone:'',
userName:'',
deviceRole:false
}
},
onShow() {
this.userAction = [
{
label:"我的订单",
iconUrl:config.assetsPath+'/my_list_15.png',
routePath:"/pages/orderRecord/orderRecord",
type:"1",
color:"#FEF9EE",
show:true
},
{
label:"消费记录",
iconUrl:config.assetsPath+'/my_list_16.png',
routePath:"/pages/payRecord/index",
type:"2",
color:"#EEF3FE",
show:true
},
{
label:"保洁管理",
iconUrl:config.assetsPath+'/my_list_17.png',
routePath:"/pages/cleanManage/cleanManage",
type:"3",
color:"#F1EEFE",
show:false
},
{
label:"保洁记录",
iconUrl:config.assetsPath+'/my_list_17.png',
routePath:"/pages/cleanRecord/index",
type:"4",
color:"#F1EEFE",
show:false
}
];
this.onCheckUserLogin();
this.onGetSysConfig();
},
onLoad() {
console.log("我是V2版本")
// 隐藏原生的tabbar
uni.hideTabBar();
},
methods: {
onGetSysConfig(){
let sysConfigList = uni.getStorageSync('sysConfig')
if(!sysConfigList){
systemConfig().then(res=>{
if(res.data.code == 200){
uni.setStorage({
key:'sysConfig',
data: res.data.rows,
success: () => {
this.onGetSysConfig();
}
})
}
})
return;
}
let wifi = sysConfigList.find(item=>item.configKey === 'wechat.wifi')
if(wifi){
let w = wifi.configValue.split(';')
this.wifiData.name=w[0];
this.wifiData.password = w[1];
}
let s = sysConfigList.find(item=>item.configKey === 'wechat.customer.service.phone')
if(s){
this.servicePhone= s.configValue
}
},
onCheckUserLogin() {
let tokenHeaders = uni.getStorageSync("tokenHeaders");
if (tokenHeaders) {
this.onGetUserInfo();
} else {
this.loginStatus = false;
uni.removeStorage({
key:'userInfo'
})
this.userInfo = {}
}
},
onGetUserInfo() {
getUserInfo().then(res => {
if(res.data.code == 200){
this.userInfo = res.data.data;
this.userName = this.userInfo.phone.slice(-4);
uni.setStorageSync('userInfo',this.userInfo)
this.userAction = this.userAction.map(item=>{
let show = item.show;
if(item.type == '3' && this.userInfo.isCleaner){
show = true
}
if(item.type == '4' && this.userInfo.isAdmin && !this.userInfo.isCleaner){
show = true
}
return {
...item,
show
}
})
this.loginStatus = true;
}
})
},
onNavToLogin() {
this.$refs.loginPop.open();
},
onNavToMyCoupon(){
uni.navigateTo({
url:"/pages/couponList/index"
})
},
onActionNav(val,k){
if(val.routePath){
if(k===0){
uni.switchTab({
url:val.routePath
})
}else{
uni.navigateTo({
url:val.routePath
})
}
}
},
onNavToSetUserInfo(){
if(this.loginStatus==true){
uni.navigateTo({
url:"/pages/setUserInfo/index"
})
}
},
onHandle(val){
if(val ==1){
uni.makePhoneCall({
phoneNumber:this.servicePhone
})
}else if(val == 2){
if(this.wifiData.name && this.wifiData.password){
this.$refs.popup.open()
}else{
uni.showToast({
icon:"none",
title:"无法进行WIFI连接"
})
}
}else if(val === 3){
uni.navigateTo({
url:'/pages/storeList/storeList'
})
} else if(val === 4){
uni.navigateTo({
url:'/pages/useCouponIllustrate/useCouponIllustrate?keyData=call_us_images'
})
}else if(val === 5){
uni.navigateTo({
url:'/pages/deviceManage/index'
})
}else if(val === 6){
let num = this.userInfo.numberplate || '';
uni.navigateTo({
url:'/setting/license-plate-number/list?number='+num
})
}
},
onClose(){
this.$refs.popup.close()
},
onCopy(){
uni.setClipboardData({
data:this.wifiData.password
})
},
onConnectWifi(){
uni.startWifi({
success:()=>{
uni.connectWifi({
SSID:this.wifiData.name,
BSSID:this.wifiData.name,
password:this.wifiData.password,
success: () => {
uni.showToast({
icon:"none",
title:'连接成功'
})
},
fail: (err) => {
uni.showToast({
icon:'none',
title:"WIFI连接失败"
})
},
complete: (res) => {
console.log(res,909090)
}
})
}
})
},
onProview(){
uni.previewImage({
current:0,
urls: [this.userInfo.avatar]
})
},
// 退出登录,解除手机号与当前微信的绑定
onLoginOut(){
uni.showLoading({
title:"加载中"
})
loginOut().then(res=>{
console.log(res)
if(res.data.code == 200){
uni.showToast({
icon:"none",
title:"用户已退出登录"
})
this.loginStatus = false;
uni.clearStorage();
}
})
}
}
}
</script>
<style>
page {
/* background-color: #ffffff; */
}
</style>
<style lang="scss" scoped>
.myInfo {
display: flex;
flex-direction: column;
align-items: center;
width: 100vw;
min-height: 100vh;
overflow-x: hidden;
.header {
display: flex;
flex-direction: column;
width: 100%;
min-height: 360upx;
background: linear-gradient(90deg,rgba(228, 5, 131, 0.2) 20%,rgba(255,255,255,0.9));
.header-content-box {
display: flex;
flex: 1;
.login-content {
display: flex;
flex-direction: column;
width: 100%;
margin-top: 30upx;
>.flex-row {
position: relative;
align-items: center;
.cu-avatar{
position: relative;
background-color: transparent;
width: 80px;
height: 80px;
.avatar-bg{
width: 100%;
height: 100%;
}
.avatar-box{
position: absolute;
width: 80%;
height: 80%;
overflow: hidden;
z-index: 99;
}
}
.nav-right{
display: flex;
flex-direction: row;
align-items: center;
position: absolute;
right: 5vw;
// margin-top: 20upx;
.img{
width: 14px;
height: 16px;
margin-right: 6upx;
}
text{
font-size: 30upx;
}
}
}
.amount-coupon {
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 3% 28upx;
background-position: 0 0;
background-repeat: no-repeat;
background-size: 100% 100%;
height: 106upx;
padding: 0 30upx;
.part-left{
text{
color: #512C19;
}
}
.flex-row {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
.text-name{
color: #936E4C;
}
.text-white{
color: #E2177C;
margin-left: 20upx;
}
}
.line {
height: 90%;
border-left: 2upx solid #ffffff;
}
}
}
.none-login {
display: flex;
flex: 1;
flex-direction: row;
align-items: center;
width: 100%;
.cu-avatar{
width: 64px;
height: 64px;
border-radius: 50%;
background-color: #ffffff;
overflow: hidden;
.avatar-img{
width: 100%;
height: 100%;
}
}
.text-gray{
font-size: 40rpx;
color: #36122D;
font-weight: bold;
}
}
}
}
.content-box{
display: flex;
flex: 1;
flex-direction: column;
align-items: center;
width: 100%;
border-radius: 28upx 28upx 0 0;
margin-top: -28upx;
background-color: #ffffff;
box-shadow: 0rpx 0rpx 18rpx 2rpx rgba(81,6,49,0.3);
}
.user-action {
position: relative;
display: flex;
flex-direction: row;
width: 97%;
padding: 30upx 0;
z-index: 10;
.action-box{
width: 30%;
margin: 0 1.5%;
>.action-item {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
height: 88rpx;
border-radius: 12rpx;
.flex-1{
display: flex;
align-items: center;
justify-content: center;
}
.img-box{
display: flex;
align-items: flex-end;
width: 52upx;
height: 100%;
image{
width: 100%;
max-height: 40upx;
}
}
}
}
}
.main {
width: 100%;
.content{
display: flex;
flex-direction: row;
align-items: center;
}
}
}
.login-out{
width: 94%;
margin-top: 40upx;
}
.avatar-img{
width: 100%;
height: 100%;
border-radius: 50%;
}
.popup-content{
display: flex;
flex-direction: column;
width: 100vw;
min-height: 40vh;
background-color: #f1f1f1;
border-radius: 20upx 20upx 0 0;
.title-box{
padding: 30upx 20upx 0 20upx;
align-items: center;
.cuIcon-roundclose{
font-size: 68upx;
}
}
.flex-col{
display: flex;
flex: 1;
width: 100%;
flex-direction: column;
justify-content: center;
align-items: center;
.text{
width: 60%;
margin: 10upx 0;
}
}
.box-btn{
display: flex;
flex-direction: row;
padding: 30upx 0;
justify-content: center;
align-items: center;
margin-bottom: 10%;
.cu-btn{
margin: 0 5%;
}
}
}
.numberplate{
position: absolute;
right: 8upx;
top: 0;
height: 100%;
display: flex;
align-items: center;
}
</style>
\ No newline at end of file
<template>
<view class="vip-create">
<view class="banner-box">
<image :src="assetsPath+'/vip/bg.png'" mode="widthFix"></image>
<view class="footer-box">
<button class="cu-btn round bg-pink" @tap="onSubmit">立即充值</button>
</view>
</view>
</view>
</template>
<script>
import {equityMembersList,createEquityMembers} from "@/api/uerInfo.js";
import config from "@/config/index.config";
export default {
data() {
return {
assetsPath: config.assetsPath,
list:[],
index: 0
};
},
onLoad() {
this.onLoading();
},
methods:{
onLoading(){
equityMembersList().then(res => {
console.log(res,999999)
if(res.data.code == 200 && res.data.rows){
this.list = res.data.rows
}
})
},
onSubmit(){
createEquityMembers({
payType:1,
equityMembersConfigId:this.list[this.index].id
}).then(res =>{
console.log(res,9999)
if (res.data.data.jsConfig) {
wx.requestPayment({
"timeStamp": res.data.data.jsConfig.timeStamp,
"nonceStr": res.data.data.jsConfig.nonceStr,
"package": res.data.data.jsConfig.packages,
"signType": res.data.data.jsConfig.signType,
"paySign": res.data.data.jsConfig.paySign,
"success": (resp) => {
// 支付成功
uni.showToast({
icon: "success",
title: "下单成功",
success: () => {
}
})
},
"fail": (resp) => {
// 取消支付或支付失败
uni.showToast({
title: "取消支付"
})
},
"complete": (resp) => {
// 接口调用结束的回调函数(调用成功、失败都会执行)
}
});
}
})
}
}
}
</script>
<style lang="scss" scoped>
.vip-create{
display: flex;
flex-direction: column;
width: 100%;
}
.banner-box{
position: relative;
width: 100%;
}
image{
width: 100%;
}
.footer-box{
position: absolute;
left: 0;
bottom: 0;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
padding: 30upx;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment