czg_team/cashier_wx
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
gyq
2025-09-28 19:27:18 +08:00
parent 7895455b97
commit 3243f16cff
5 changed files with 639 additions and 513 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
common/api/index/index.js
View File

@@ -22,9 +22,29 @@ export const APIhome = (data) => {
// 获取咖啡 // 获取咖啡
export const userdict = (data) => { export const userdict = (data) => {
return request({ return request({
url: '/account/user/dict', url: '/account/user/dict',
method: 'GET', method: 'GET',
data: data, data: data,
toast: false toast: false
}) })
} }
// 获取当前店铺会员开通配置信息
export const getMemberConfig = (data) => {
return request({
url: '/market/user/member/config',
method: 'GET',
data: data,
toast: false
})
}
// 获取充值配置
export const getRechargeConfig = (data) => {
return request({
url: '/market/user/recharge/config',
method: 'GET',
data: data,
toast: false
})
}

87
components/coupon-modal.vue
View File

@@ -2,11 +2,11 @@
<template> <template>
<up-popup :show="show" bgColor="transparent"> <up-popup :show="show" bgColor="transparent">
<view class="container"> <view class="container">
<view class="content"> <view class="content" :class="`content${currentNum}`">
<image class="bg" src="https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/6520f3cfae594480aa2e612ff4ad121c.png" mode="widthFix"></image> <image class="bg" :src="bgUrl" mode="widthFix"></image>
<view class="swiper-wrap"> <view class="swiper-wrap" :class="`swiper-wrap${currentNum}`">
<swiper class="swiper" @change="swiperChange"> <swiper class="swiper" :class="[`swiper${currentNum}`]" @change="swiperChange">
<swiper-item class="swiper-item" v-for="(item, index) in couponList" :key="index"> <swiper-item class="swiper-item" :class="[`swiper-item${currentNum}`]" v-for="(item, index) in couponList" :key="index">
<view class="item" v-for="val in item" :key="val.id"> <view class="item" v-for="val in item" :key="val.id">
<image <image
class="item-bg" class="item-bg"
@@ -54,7 +54,7 @@
</view> </view>
</swiper-item> </swiper-item>
</swiper> </swiper>
<view class="dot-wrap"> <view class="dot-wrap" v-if="couponList.length > 1">
<view class="page-btn"> <view class="page-btn">
<up-icon name="arrow-left" :color="swiperIndex == 0 ? '#fa746a' : '#f6171b'" size="16"></up-icon> <up-icon name="arrow-left" :color="swiperIndex == 0 ? '#fa746a' : '#f6171b'" size="16"></up-icon>
</view> </view>
@@ -66,7 +66,7 @@
</view> </view>
</view> </view>
</view> </view>
<view class="btn-wrap" @click="getHandle"> <view class="btn-wrap" :class="[`btn-wrap${currentNum}`]" @click="getHandle">
<image class="btn-img" src="https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/a7ea3211baf84cc8b77171d4f88c7f9e.png" mode="widthFix"></image> <image class="btn-img" src="https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/a7ea3211baf84cc8b77171d4f88c7f9e.png" mode="widthFix"></image>
<text class="t">全部领取（{{ couponCount }}张）</text> <text class="t">全部领取（{{ couponCount }}张）</text>
</view> </view>
@@ -84,6 +84,15 @@ import dayjs from 'dayjs';
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
import { getCouponPopup, receivePopUp } from '@/common/api/member.js'; import { getCouponPopup, receivePopUp } from '@/common/api/member.js';
const currentNum = ref(1);
const swiperCheck = ref(3);
const bgUrlList = ref({
1: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/0/20c159a4cd664d8a843d82eb9b5a5e0e.png',
2: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/0/d6b11e76f03b495d84f07791b3ce1c3e.png',
3: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/0/f41a5bffdc1c474eb5bb41ed0035c91b.png'
});
const bgUrl = ref('');
const couponCount = ref(0); const couponCount = ref(0);
const swiperIndex = ref(0); const swiperIndex = ref(0);
const couponList = ref([]); const couponList = ref([]);
@@ -114,12 +123,24 @@ async function getCouponPopupAjax() {
.format('YYYY-MM-DD HH:mm:ss'); .format('YYYY-MM-DD HH:mm:ss');
} }
}); });
console.log('res===', res);
show.value = true; show.value = true;
couponCount.value = res.length; couponCount.value = res.length;
couponList.value = _.chunk(res, 3); couponList.value = _.chunk(res, swiperCheck.value);
console.log('couponList.value===', couponList.value);
console.log('couponList.value[0].length===', couponList.value[0].length);
if (couponList.value[0].length >= swiperCheck.value) {
bgUrl.value = bgUrlList.value[3];
currentNum.value = 3;
}
if (couponList.value[0].length == 2) {
bgUrl.value = bgUrlList.value[2];
currentNum.value = 2;
}
if (couponList.value[0].length <= 1) {
bgUrl.value = bgUrlList.value[1];
currentNum.value = 1;
}
} }
} catch (error) { } catch (error) {
console.log(error); console.log(error);
@@ -163,7 +184,9 @@ onMounted(() => {
.content { .content {
width: 94vw; width: 94vw;
position: relative; position: relative;
padding-left: 24upx; &.content3 {
padding-left: 24upx;
}
.close { .close {
position: absolute; position: absolute;
left: 50%; left: 50%;
@@ -179,19 +202,43 @@ onMounted(() => {
height: 70%; height: 70%;
position: absolute; position: absolute;
left: 18%; left: 18%;
top: 96upx; &.swiper-wrap1 {
top: 162upx;
}
&.swiper-wrap2 {
top: 140upx;
}
&.swiper-wrap3 {
top: 96upx;
}
.swiper { .swiper {
width: 100%; width: 100%;
height: 90%;
background-color: #fff; background-color: #fff;
&.swiper1 {
height: 44%;
}
&.swiper2 {
height: 70%;
}
&.swiper3 {
height: 90%;
}
.swiper-item { .swiper-item {
width: 100%; width: 100%;
height: 100%; height: 100%;
display: grid; display: grid;
grid-template-columns: 1fr; grid-template-columns: 1fr;
grid-template-rows: repeat(3, 1fr);
grid-column-gap: 0; grid-column-gap: 0;
grid-row-gap: 12upx; grid-row-gap: 12upx;
&.swiper-item1 {
grid-template-rows: repeat(1, 1fr);
}
&.swiper-item2 {
grid-template-rows: repeat(2, 1fr);
}
&.swiper-item3 {
grid-template-rows: repeat(3, 1fr);
}
.item { .item {
background-color: #e20410; background-color: #e20410;
border-radius: 12upx; border-radius: 12upx;
@@ -315,7 +362,15 @@ onMounted(() => {
width: 60%; width: 60%;
position: absolute; position: absolute;
left: 20%; left: 20%;
bottom: 38upx; &.btn-wrap1 {
bottom: 74upx;
}
&.btn-wrap2 {
bottom: 74upx;
}
&.btn-wrap3 {
bottom: 38upx;
}
.btn-img { .btn-img {
width: 100%; width: 100%;
} }

7
pages/index/index.vue
View File

@@ -125,7 +125,7 @@
<up-loadmore :status="formhomelist.status" fontSize="14" color="#999" iconSize="14" /> <up-loadmore :status="formhomelist.status" fontSize="14" color="#999" iconSize="14" />
</view> --> </view> -->
</view> </view>
<indexs v-if="showindex == 'shopIndex'" :shopExtend="orderVIP.shopExtendList"></indexs> <indexs ref="indexsRef" v-if="showindex == 'shopIndex'" :shopExtend="orderVIP.shopExtendList"></indexs>
<!-- <CouponModal></CouponModal> --> <!-- <CouponModal></CouponModal> -->
</view> </view>
</template> </template>
@@ -319,6 +319,9 @@ onPageScroll((res) => {
isSticky.value = res.scrollTop > elementTop.value ? true : false; isSticky.value = res.scrollTop > elementTop.value ? true : false;
uni.$u.debounce((store.scrollTop = res.scrollTop), 500); uni.$u.debounce((store.scrollTop = res.scrollTop), 500);
}); });
const indexsRef = ref(null);
onShow(async () => { onShow(async () => {
try { try {
uni.getLocation({ uni.getLocation({
@@ -343,6 +346,8 @@ onShow(async () => {
} }
} }
}); });
indexsRef.value.getVipConfig();
} catch (error) { } catch (error) {
try { try {
let successres = await APIgeocodelocation({ let successres = await APIgeocodelocation({

283
pages/index/indexs.vue
View File

@@ -1,11 +1,16 @@
<template> <template>
<view class="content"> <view class="content">
<view class="contentbox" <view
:style="'background:url('+(shopExtend?shopExtend[0].value:'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/shuangbackground.png')+') no-repeat center center / cover' "> class="contentbox"
:style="
'background:url(' +
(shopExtend ? shopExtend[0].value : 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/shuangbackground.png') +
') no-repeat center center / cover'
"
>
<view class="contentboxitem flex-between"> <view class="contentboxitem flex-between">
<view class="contentboxitemleft flex-colum" @click="scanCodehandle(0)"> <view class="contentboxitemleft flex-colum" @click="scanCodehandle(0)">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xdiancan.png" mode="aspectFill"> <image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xdiancan.png" mode="aspectFill"></image>
</image>
<text class="contentboxitemlefttextone">点餐</text> <text class="contentboxitemlefttextone">点餐</text>
<text class="contentboxitemlefttexttow">在线点不排队</text> <text class="contentboxitemlefttexttow">在线点不排队</text>
</view> </view>
@@ -13,8 +18,7 @@
<!-- <view class="contentboxitemright_item flex-between" <!-- <view class="contentboxitemright_item flex-between"
@click="memberindex('user/member/memberdetails')"> --> @click="memberindex('user/member/memberdetails')"> -->
<view class="contentboxitemright_item flex-between" @click="tomember"> <view class="contentboxitemright_item flex-between" @click="tomember">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xvip.png" mode="aspectFill"> <image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xvip.png" mode="aspectFill"></image>
</image>
<view class="contentboxitemright_itembox flex-colum"> <view class="contentboxitemright_itembox flex-colum">
<text>会员</text> <text>会员</text>
<text>入会享权益</text> <text>入会享权益</text>
@@ -25,8 +29,7 @@
> --> > -->
<view class="contentboxitemright_item flex-between" @click="toCharge"> <view class="contentboxitemright_item flex-between" @click="toCharge">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xchong.png" <image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xchong.png" mode="aspectFill"></image>
mode="aspectFill"></image>
<view class="contentboxitemright_itembox flex-colum"> <view class="contentboxitemright_itembox flex-colum">
<text>充值</text> <text>充值</text>
<text>充值享更多优惠</text> <text>充值享更多优惠</text>
@@ -39,153 +42,183 @@
</template> </template>
<script setup> <script setup>
import { import { getMemberConfig, getRechargeConfig } from '@/common/api/index/index.js';
ref, import { ref, reactive, defineProps, defineEmits, onMounted } from 'vue';
reactive,
defineProps,
defineEmits
} from 'vue';
// 定义接收的属性 // 定义接收的属性
const props = defineProps({ const props = defineProps({
shopExtend: { shopExtend: {
type: Array, type: Array,
default: [] default: []
} }
});
import { productStore } from '@/stores/user.js';
const scanCodehandle = async (i) => {
const store = productStore();
await store.scanCodeactions();
};
const memberindex = (url) => {
uni.pro.navigateTo(url, {
shopId: uni.cache.get('shopId'),
type: 'index'
}); });
};
import { function tomember() {
productStore if (isMember.value) {
} from '@/stores/user.js'; const shopUserInfo = uni.cache.get('shopUserInfo') || {};
const shopId = uni.cache.get('shopId');
const scanCodehandle = async (i) => { if (!shopUserInfo.isVip) {
const store = productStore();
await store.scanCodeactions()
}
const memberindex = (url) => {
uni.pro.navigateTo(url, {
shopId: uni.cache.get('shopId'),
type: 'index',
})
}
function tomember() {
const shopUserInfo = uni.cache.get('shopUserInfo')||{}
const shopId = uni.cache.get('shopId')
if(!shopUserInfo.isVip){
uni.navigateTo({ uni.navigateTo({
url: '/user/vip/buy-vip?shopId=' + shopId url: '/user/vip/buy-vip?shopId=' + shopId
}) });
return return;
} }
uni.navigateTo({ uni.navigateTo({
url: '/user/vip/vip?shopId=' + shopId url: '/user/vip/vip?shopId=' + shopId
}) });
} else {
uni.showToast({
title: '暂未开放',
icon: 'none'
});
} }
}
function toCharge() { function toCharge() {
const shopId = uni.cache.get('shopId') if (isCharge.value) {
const shopId = uni.cache.get('shopId');
uni.navigateTo({ uni.navigateTo({
url: '/pages/user/member/czzx?shopId='+shopId url: '/pages/user/member/czzx?shopId=' + shopId
}) });
} else {
uni.showToast({
title: '暂未开放',
icon: 'none'
});
} }
const getQueryString = (url, name) => { //解码 }
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i') const getQueryString = (url, name) => {
var r = url.substr(1).match(reg) //解码
if (r != null) { var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i');
return r[2] var r = url.substr(1).match(reg);
} if (r != null) {
return null; return r[2];
} }
return null;
};
// 获取会员配置
const isMember = ref(0);
const isCharge = ref(0);
async function getVipConfig() {
try {
const res1 = await getMemberConfig({ shopId: uni.cache.get('shopId') });
const res2 = await getRechargeConfig({ shopId: uni.cache.get('shopId') });
isMember.value = +res1.memberConfig.isOpen;
isCharge.value = +res2.isEnable;
} catch (error) {
console.log(error);
}
}
onMounted(() => {
getVipConfig();
});
defineExpose({
getVipConfig
});
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
page { page {
background: #F6F8FA; background: #f6f8fa;
} }
.content { .content {
.contentbox { .contentbox {
position: relative; position: relative;
width: 100%; width: 100%;
height: 1046rpx; height: 1046rpx;
padding: 0 24rpx; padding: 0 24rpx;
.contentboxitem { .contentboxitem {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
width: 90%; width: 90%;
left: 50%; left: 50%;
transform: translate(-50%, 50%); transform: translate(-50%, 50%);
padding: 38rpx 0 26rpx 0; padding: 38rpx 0 26rpx 0;
background: rgba(255, 255, 255, 0.98); background: rgba(255, 255, 255, 0.98);
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16); box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
.contentboxitemleft { .contentboxitemleft {
width: 50%; width: 50%;
border-right: 2rpx solid #623618; border-right: 2rpx solid #623618;
image { image {
width: 134rpx; width: 134rpx;
height: 134rpx; height: 134rpx;
}
.contentboxitemlefttextone {
margin-top: 10rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #333333;
}
.contentboxitemlefttexttow {
margin-top: 2rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
} }
.contentboxitemright { .contentboxitemlefttextone {
width: 50%; margin-top: 10rpx;
padding: 0 34rpx; font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #333333;
}
.contentboxitemright_item:nth-child(2) { .contentboxitemlefttexttow {
margin-top: 30rpx; margin-top: 2rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.contentboxitemright {
width: 50%;
padding: 0 34rpx;
.contentboxitemright_item:nth-child(2) {
margin-top: 30rpx;
}
.contentboxitemright_item {
image {
width: 96rpx;
height: 96rpx;
} }
.contentboxitemright_item { .contentboxitemright_itembox {
image { width: 170rpx;
width: 96rpx;
height: 96rpx; text:nth-child(1) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #333333;
} }
.contentboxitemright_itembox { text:nth-child(2) {
width: 170rpx; margin-top: 2rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
text:nth-child(1) { font-weight: 400;
font-family: Source Han Sans CN, Source Han Sans CN; font-size: 24rpx;
font-weight: 400; color: #999999;
font-size: 32rpx;
color: #333333;
}
text:nth-child(2) {
margin-top: 2rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
} }
} }
} }
} }
} }
} }
</style> }
</style>

753
pages/user/user.vue
View File

@@ -1,25 +1,30 @@
<template> <template>
<view class="container"> <view class="container">
<image class="topBack" <image
:src="userInfo.shopExtendList?(userInfo.shopExtendList[1].value?userInfo.shopExtendList[1].value:'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/myTopBack.png'):'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/myTopBack.png'" class="topBack"
mode="aspectFill"></image> :src="
userInfo.shopExtendList
? userInfo.shopExtendList[1].value
? userInfo.shopExtendList[1].value
: 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/myTopBack.png'
: 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/myTopBack.png'
"
mode="aspectFill"
></image>
<view class="myContent"> <view class="myContent">
<view class="my_info flex-between"> <view class="my_info flex-between">
<view class="my_info_left"> <view class="my_info_left">
<image class="my_info_left_head" :src="userInfo.headImg" mode="aspectFill"></image> <image class="my_info_left_head" :src="userInfo.headImg" mode="aspectFill"></image>
<view class="name">{{userInfo.nickName}}</view> <view class="name">{{ userInfo.nickName }}</view>
</view> </view>
<image class="my_info_right_qr" src="/static/icon/code.png" mode="aspectFill"> <image class="my_info_right_qr" src="/static/icon/code.png" mode="aspectFill"></image>
</image>
<!-- <image class="my_info_right_qr" @click="clickEvent" v-if="userInfo.isVip == 1 && ShopId" <!-- <image class="my_info_right_qr" @click="clickEvent" v-if="userInfo.isVip == 1 && ShopId"
:src="'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_qRcode.png'" mode="aspectFill"> :src="'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_qRcode.png'" mode="aspectFill">
</image> </image>
<view class="my_info_right" @click="clickEvent" v-if="userInfo.isVip == 0 && ShopId"> <view class="my_info_right" @click="clickEvent" v-if="userInfo.isVip == 0 && ShopId">
<text>免费入会</text> <text>免费入会</text>
</view> --> </view> -->
</view> </view>
<up-gap height="26rpx" bg-color="#F9F9F9"></up-gap> <up-gap height="26rpx" bg-color="#F9F9F9"></up-gap>
@@ -29,33 +34,27 @@
<view class="amount"> <view class="amount">
<view class="u-flex u-flex-between u-m-t-20"> <view class="u-flex u-flex-between u-m-t-20">
<view class="u-flex"> <view class="u-flex">
<image style="width: 50rpx;height: 37rpx;" <image style="width: 50rpx; height: 37rpx" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/storedValue.png" mode="aspectFill"></image>
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/storedValue.png"
mode="aspectFill">
</image>
<text class="color-333 font-14 u-m-l-20">储值</text> <text class="color-333 font-14 u-m-l-20">储值</text>
</view> </view>
<view class="u-flex color-666" @click="toChargeList"> <view class="u-flex color-666" @click="toChargeList">
<text class="font-12 u-m-r-4">{{rechargeTotal}}家店</text> <text class="font-12 u-m-r-4">{{ rechargeTotal }}家店</text>
<up-icon name="arrow-down" color="#666" size="12px"></up-icon> <up-icon name="arrow-down" color="#666" size="12px"></up-icon>
</view> </view>
</view> </view>
<view class="card-list"> <view class="card-list">
<view class="card-list-item" v-for="(item,index) in rechargeList" :key="index" <view class="card-list-item" v-for="(item, index) in rechargeList" :key="index" @click="toCharge(item)">
@click="toCharge(item)"> <up-image radius="20rpx" width="182rpx" height="182rpx" :src="item.logo"></up-image>
<up-image radius="20rpx" width="182rpx" height="182rpx" :src="item.logo"> </up-image>
<view class="info text-center"> <view class="info text-center">
<view class="color-333 u-m-t-14 "> <view class="color-333 u-m-t-14">
<text class="font-10">¥</text> <text class="font-10">¥</text>
<text class="font-16 font-700 ">{{item.amount}}</text> <text class="font-16 font-700">{{ item.amount || '0.00' }}</text>
</view> </view>
<view class="font-12 color-666 u-line-1">{{item.shopName}}</view> <view class="font-12 color-666 u-line-1">{{ item.shopName }}</view>
</view> </view>
</view> </view>
<view class="u-flex u-flex-column u-flex-center" style="width: 12px;" v-if="rechargeList.length" <view class="u-flex u-flex-column u-flex-center" style="width: 12px" v-if="rechargeList.length" @click="toChargeList">
@click="toChargeList">
<view class="text-center color-333 font-12">查看全部</view> <view class="text-center color-333 font-12">查看全部</view>
</view> </view>
</view> </view>
@@ -63,44 +62,65 @@
<view class="vip u-m-t-40"> <view class="vip u-m-t-40">
<view class="u-flex u-flex-between u-m-t-20"> <view class="u-flex u-flex-between u-m-t-20">
<view class="u-flex"> <view class="u-flex">
<image style="width: 50rpx;height: 40rpx;" src="/static/icon/vip.png" mode="aspectFill"> <image style="width: 50rpx; height: 40rpx" src="/static/icon/vip.png" mode="aspectFill"></image>
</image>
<text class="color-333 font-14 u-m-l-20">会员</text> <text class="color-333 font-14 u-m-l-20">会员</text>
</view> </view>
<view class="u-flex color-666" @click="tomemberList"> <view class="u-flex color-666" @click="tomemberList">
<text class="font-12 u-m-r-4">{{memberTotal}}家店</text> <text class="font-12 u-m-r-4">{{ memberTotal }}家店</text>
<up-icon name="arrow-down" color="#666" size="12px"></up-icon> <up-icon name="arrow-down" color="#666" size="12px"></up-icon>
</view> </view>
</view> </view>
<view class="card-list"> <view class="card-list">
<view class="card-list-item" v-for="(item,index) in memberList" :key="index" <view class="card-list-item" v-for="(item, index) in memberList" :key="index" @click="tomember(item)">
@click="tomember(item)">
<up-image radius="20rpx" width="182rpx" height="182rpx" :src="item.logo"></up-image> <up-image radius="20rpx" width="182rpx" height="182rpx" :src="item.logo"></up-image>
<view class="info text-center"> <view class="info text-center">
<view class="font-12 color-666 u-m-t-14 u-line-1">{{item.shopName}}</view> <view class="font-12 color-666 u-m-t-14 u-line-1">{{ item.shopName }}</view>
</view> </view>
</view> </view>
<view class="u-flex u-flex-column u-flex-center" style="width: 12px;" v-if="memberList.length"> <view class="u-flex u-flex-column u-flex-center" style="width: 12px" v-if="memberList.length">
<view class="text-center color-333 font-12" @click="tomemberList">查看全部</view> <view class="text-center color-333 font-12" @click="tomemberList">查看全部</view>
</view> </view>
</view> </view>
</view> </view>
<view class="amount">
<view class="u-flex u-flex-between u-m-t-20">
<view class="u-flex">
<image style="width: 50rpx; height: 44rpx" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png" mode="aspectFill"></image>
<text class="color-333 font-14 u-m-l-20">积分</text>
</view>
<view class="u-flex color-666" @click="toCoin">
<text class="font-12 u-m-r-4">{{ coinTotal }}家店</text>
<up-icon name="arrow-down" color="#666" size="12px"></up-icon>
</view>
</view>
<view class="card-list">
<view class="card-list-item" v-for="(item, index) in coinList" :key="index" @click="toCoin(item)">
<up-image radius="20rpx" width="182rpx" height="182rpx" :src="item.logo"></up-image>
<view class="info text-center">
<view class="color-333 u-m-t-14">
<text class="font-10">¥</text>
<text class="font-16 font-700">{{ item.accountPoints || '0.00' }}</text>
</view>
<view class="font-12 color-666 u-line-1">{{ item.shopName }}</view>
</view>
</view>
<view class="u-flex u-flex-column u-flex-center" style="width: 12px" v-if="coinList.length" @click="toCoin">
<view class="text-center color-333 font-12">查看全部</view>
</view>
</view>
</view>
</view> </view>
<view class="my_item my_fun u-m-t-30"> <view class="my_item my_fun u-m-t-30">
<view class="my_fun_list"> <view class="my_fun_list">
<view class="my_list_item" v-for="(item,index) in myFunList" :key="index" <view class="my_list_item" v-for="(item, index) in myFunList" :key="index" @click="clickTo(item, index)">
@click="clickTo(item,index)">
<view class="my_list_item_left"> <view class="my_list_item_left">
<image class="my_list_item_icon" :src="item.icon" mode="aspectFill"></image> <image class="my_list_item_icon" :src="item.icon" mode="aspectFill"></image>
<view class="my_list_item_name">{{item.name}}</view> <view class="my_list_item_name">{{ item.name }}</view>
</view> </view>
<view class="my_list_item_right u-flex "> <view class="my_list_item_right u-flex">
<text v-if="item.type=='score'" class="font-12 ">{{userInfo.accountPoints || 0}}</text> <text v-if="item.type == 'score'" class="font-12">{{ userInfo.accountPoints || 0 }}</text>
<!-- <text v-else-if="item.type=='my_coupon'" class="font-12 ">{{userInfo.couponNum || 0}}</text> --> <!-- <text v-else-if="item.type=='my_coupon'" class="font-12 ">{{userInfo.couponNum || 0}}</text> -->
<text class="font-12 color-999" v-else>查看</text> <text class="font-12 color-999" v-else>查看</text>
<u-icon class="u-m-t-2" name="arrow-right" color="#999999" size="12"></u-icon> <u-icon class="u-m-t-2" name="arrow-right" color="#999999" size="12"></u-icon>
@@ -108,394 +128,387 @@
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { import { ref, computed, onMounted, reactive } from 'vue';
ref, import { onLoad, onReady, onShow } from '@dcloudio/uni-app';
computed, import { productStore } from '@/stores/user.js';
onMounted, import * as vipApi from '@/common/api/market/vip.js';
reactive import * as rechargeApi from '@/common/api/market/recharge.js';
} from "vue"; import { pointsShopList } from '@/common/api/account/points.js';
import {
onLoad,
onReady,
onShow
} from '@dcloudio/uni-app'
import {
productStore
} from '@/stores/user.js';
import * as vipApi from '@/common/api/market/vip.js'
import * as rechargeApi from '@/common/api/market/recharge.js'
const store = productStore();
const store = productStore(); const myFunList = ref([
const myFunList = ref([{ // {
name: "积分", // name: "积分",
type: "score", // type: "score",
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png", // icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png",
url: '/user/score/list' // url: '/user/score/list'
}, // },
{ {
name: "优惠券", name: '优惠券',
type: "my_coupon", type: 'my_coupon',
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_coupon.png" icon: 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_coupon.png'
},
// {
// name: "我的订单",
// type: "my_order",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_order.png"
// },
// { name: "收货地址", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_address.png"},
// {
// name: "个人资料",
// type: "myself",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/personal.png"
// },
// {
// name: "我的会员卡",
// type: "my_member",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_member.png"
// },
// { name: "关于", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/inRegard.png"},
])
const userInfo = reactive({})
const ShopId = ref(uni.cache.get('shopId'))
console.log('ShopId', uni.cache.get('shopId'))
function tomemberList() {
uni.navigateTo({
url: '/pages/user/member/list'
})
} }
// {
// name: "我的订单",
// type: "my_order",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_order.png"
// },
// { name: "收货地址", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_address.png"},
// {
// name: "个人资料",
// type: "myself",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/personal.png"
// },
// {
// name: "我的会员卡",
// type: "my_member",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_member.png"
// },
// { name: "关于", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/inRegard.png"},
]);
function tomember(item) { const userInfo = reactive({});
uni.navigateTo({
url: '/user/vip/vip?shopId=' + item.shopId
})
}
const clickEvent = () => { const ShopId = ref(uni.cache.get('shopId'));
if (ShopId.value) { console.log('ShopId', uni.cache.get('shopId'));
if (!userInfo.isVip) {
uni.navigateTo({
url: '/user/vip/buy-vip?shopId=' + ShopId.value
})
} else {
uni.navigateTo({
url: '/user/vip/vip?shopId=' + ShopId.value
})
}
// if (userInfo.isVip == 0) { function tomemberList() {
uni.navigateTo({
url: '/pages/user/member/list'
});
}
function tomember(item) {
uni.navigateTo({
url: '/user/vip/vip?shopId=' + item.shopId
});
}
// uni.pro.navigateTo('user/member/memberdetails', { const clickEvent = () => {
// shopId: uni.cache.get('shopId') if (ShopId.value) {
// }) if (!userInfo.isVip) {
// } else {
// uni.pro.navigateTo('user/member/paycode', {
// shopId: uni.cache.get('shopId'),
// shopInfo: JSON.stringify(uni.cache.get('orderVIP').shopInfo)
// })
// }
} else {
uni.pro.navigateTo('member/list', {
type: 'user_payCode'
})
}
}
// 我的资产
const Myassets = () => {
if (uni.cache.get('shopId')) {
uni.pro.navigateTo('user/member/memberdetails', {
shopId: uni.cache.get('shopId'),
type: 'index'
})
} else {
uni.pro.navigateTo('user/member/list', {
shopId: uni.cache.get('shopId'),
type: 'index'
})
}
}
function toCharge(item) {
uni.navigateTo({
url: '/pages/user/member/czzx?shopId=' + item.shopId
})
}
function toChargeList() {
uni.navigateTo({
url: '/pages/user/member/amount-list'
})
}
const clickTo = (item, index) => {
if (item.url) {
uni.navigateTo({ uni.navigateTo({
url:item.url url: '/user/vip/buy-vip?shopId=' + ShopId.value
}) });
return
}
let shopId = null;
switch (item.type) {
case 'my_order':
uni.pro.switchTab('order/index')
break
case 'my_member':
uni.pro.navigateTo('user/member/list')
break
case 'recharge':
if (uni.cache.get('shopId') && uni.cache.get('token')) {
uni.pro.navigateTo('member/index', {
shopId: uni.cache.get('shopId'),
type: 'index',
})
} else {
uni.pro.navigateTo('member/list', {
type: 'user_recharge'
})
}
break
case 'points': //积分
if (uni.cache.get('shopId') && uni.cache.get('token')) {
uni.pro.navigateTo('/pagesPoints/index/index', {
shopId: uni.cache.get('shopId'),
type: 'user',
})
} else {
uni.pro.navigateTo('member/list', {
type: 'user_points'
})
}
break;
case 'my_coupon': //优惠券
uni.pro.navigateTo('user/coupon', {
shopId: uni.cache.get('shopId') || ''
})
break;
case 'myself': //内部页面
uni.pro.navigateTo('user/myself')
break;
case 'scan_applet':
uni.navigateToMiniProgram(JSON.parse(item.value))
break
case 'absolute': //外链url
uni.navigateTo({
url: `/pages/webview/webview?url=${item.menuUrl}`
});
break;
}
}
const memberList = ref([])
const rechargeList = ref([])
const memberTotal=ref(0)
const rechargeTotal=ref(0)
async function getData() {
const res = await vipApi.list()
memberTotal.value=res.length
memberList.value = res.slice(0, 3);
const res1 = await rechargeApi.list()
rechargeTotal.value=res1.length
rechargeList.value = res1.slice(0, 3);
}
onShow(() => {
store.actionsAPIuser()
if (uni.cache.get('shopId')) {
Object.assign(userInfo, uni.cache.get('orderVIP'))
} else { } else {
Object.assign(userInfo, { uni.navigateTo({
...uni.cache.get('userInfo'), url: '/user/vip/vip?shopId=' + ShopId.value
...uni.cache.get('userInfo').assetsSummary });
})
} }
getData()
}) // if (userInfo.isVip == 0) {
// uni.pro.navigateTo('user/member/memberdetails', {
// shopId: uni.cache.get('shopId')
// })
// } else {
// uni.pro.navigateTo('user/member/paycode', {
// shopId: uni.cache.get('shopId'),
// shopInfo: JSON.stringify(uni.cache.get('orderVIP').shopInfo)
// })
// }
} else {
uni.pro.navigateTo('member/list', {
type: 'user_payCode'
});
}
};
// 我的资产
const Myassets = () => {
if (uni.cache.get('shopId')) {
uni.pro.navigateTo('user/member/memberdetails', {
shopId: uni.cache.get('shopId'),
type: 'index'
});
} else {
uni.pro.navigateTo('user/member/list', {
shopId: uni.cache.get('shopId'),
type: 'index'
});
}
};
function toCharge(item) {
uni.navigateTo({
url: '/pages/user/member/czzx?shopId=' + item.shopId
});
}
function toChargeList() {
uni.navigateTo({
url: '/pages/user/member/amount-list'
});
}
const clickTo = (item, index) => {
if (item.url) {
uni.navigateTo({
url: item.url
});
return;
}
let shopId = null;
switch (item.type) {
case 'my_order':
uni.pro.switchTab('order/index');
break;
case 'my_member':
uni.pro.navigateTo('user/member/list');
break;
case 'recharge':
if (uni.cache.get('shopId') && uni.cache.get('token')) {
uni.pro.navigateTo('member/index', {
shopId: uni.cache.get('shopId'),
type: 'index'
});
} else {
uni.pro.navigateTo('member/list', {
type: 'user_recharge'
});
}
break;
case 'points': //积分
if (uni.cache.get('shopId') && uni.cache.get('token')) {
uni.pro.navigateTo('/pagesPoints/index/index', {
shopId: uni.cache.get('shopId'),
type: 'user'
});
} else {
uni.pro.navigateTo('member/list', {
type: 'user_points'
});
}
break;
case 'my_coupon': //优惠券
uni.pro.navigateTo('user/coupon', {
shopId: uni.cache.get('shopId') || ''
});
break;
case 'myself': //内部页面
uni.pro.navigateTo('user/myself');
break;
case 'scan_applet':
uni.navigateToMiniProgram(JSON.parse(item.value));
break;
case 'absolute': //外链url
uni.navigateTo({
url: `/pages/webview/webview?url=${item.menuUrl}`
});
break;
}
};
const memberList = ref([]);
const rechargeList = ref([]);
const memberTotal = ref(0);
const rechargeTotal = ref(0);
const coinTotal = ref(0);
const coinList = ref([]);
async function getData() {
const res = await vipApi.list();
memberTotal.value = res.length;
memberList.value = res.slice(0, 3);
const res1 = await rechargeApi.list();
rechargeTotal.value = res1.length;
rechargeList.value = res1.slice(0, 3);
const res3 = await pointsShopList();
coinTotal.value = res3.length;
coinList.value = res3;
}
function toCoin() {
uni.navigateTo({
url: '/user/score/list'
});
}
onShow(() => {
store.actionsAPIuser();
if (uni.cache.get('shopId')) {
Object.assign(userInfo, uni.cache.get('orderVIP'));
} else {
Object.assign(userInfo, {
...uni.cache.get('userInfo'),
...uni.cache.get('userInfo').assetsSummary
});
}
getData();
});
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.topBack { .topBack {
width: 100%; width: 100%;
height: 400rpx; height: 400rpx;
position: absolute; position: absolute;
}
.myContent {
position: relative;
z-index: 1;
padding: 298rpx 0 0 0;
.my_info {
align-items: center;
background-color: #fff;
padding: 32rpx 32rpx;
border-radius: 18rpx;
.my_info_left {
display: flex;
align-items: center;
.my_info_left_head {
width: 84rpx;
height: 84rpx;
margin-right: 18rpx;
border-radius: 50%;
}
.name {
font-weight: 400;
font-size: 36rpx;
color: #333333;
}
}
.my_info_right {
width: 136rpx;
height: 48rpx;
background-color: #e3ad7f;
border-radius: 24rpx;
display: flex;
align-items: center;
justify-content: center;
text {
font-weight: 500;
font-size: 24rpx;
color: #ffffff;
}
}
.my_info_right_qr {
width: 40rpx;
height: 40rpx;
}
} }
.myContent { .my_item {
position: relative; background-color: #fff;
z-index: 1; padding: 0 32rpx;
padding: 298rpx 0 0 0; border-radius: 18rpx;
.my_info { .my_item_title {
align-items: center; font-weight: bold;
background-color: #fff; font-size: 32rpx;
padding: 32rpx 32rpx; color: #333333;
border-radius: 18rpx; font-family: Source Han Sans CN, Source Han Sans CN;
}
}
.my_info_left { .my_assets {
.my_item_title {
margin-bottom: 26rpx;
}
.my_assets_list {
display: flex;
justify-content: space-around;
padding: 0 38rpx;
.my_list_item {
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
.my_info_left_head { .my_list_item_icon {
width: 84rpx; width: 52rpx;
height: 84rpx; height: 44rpx;
margin-right: 18rpx;
border-radius: 50%;
} }
.name { .my_list_item_name {
font-weight: 400;
font-size: 36rpx;
color: #333333;
}
}
.my_info_right {
width: 136rpx;
height: 48rpx;
background-color: #E3AD7F;
border-radius: 24rpx;
display: flex;
align-items: center;
justify-content: center;
text {
font-weight: 500; font-weight: 500;
font-size: 24rpx; font-size: 24rpx;
color: #FFFFFF; color: #333333;
margin-top: 16rpx;
margin-bottom: 16rpx;
}
.my_list_item_num {
font-weight: 400;
font-size: 20rpx;
color: #e3ad7f;
} }
} }
}
}
.my_info_right_qr { .my_fun {
width: 40rpx; .my_item_title {
height: 40rpx; margin-bottom: 18rpx;
}
} }
.my_fun_list {
display: flex;
flex-direction: column;
.my_list_item {
.my_item {
background-color: #fff;
padding: 0 32rpx;
border-radius: 18rpx;
.my_item_title {
font-weight: bold;
font-size: 32rpx;
color: #333333;
font-family: Source Han Sans CN, Source Han Sans CN;
}
}
.my_assets {
.my_item_title {
margin-bottom: 26rpx;
}
.my_assets_list {
display: flex; display: flex;
justify-content: space-around; align-items: center;
padding: 0 38rpx; justify-content: space-between;
padding: 24rpx 0 26rpx 0;
border-bottom: 1rpx solid #e5e5e5;
.my_list_item { .my_list_item_left {
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
.my_list_item_icon { .my_list_item_icon {
width: 52rpx; width: 44rpx;
height: 44rpx; height: 44rpx;
margin-right: 18rpx;
} }
.my_list_item_name { .my_list_item_name {
font-weight: 500;
font-size: 24rpx;
color: #333333;
margin-top: 16rpx;
margin-bottom: 16rpx;
}
.my_list_item_num {
font-weight: 400; font-weight: 400;
font-size: 20rpx; font-size: 28rpx;
color: #E3AD7F; color: #333333;
} }
} }
} }
}
.my_fun { .my_list_item:last-child {
.my_item_title { border-bottom: none;
margin-bottom: 18rpx;
}
.my_fun_list {
display: flex;
flex-direction: column;
.my_list_item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 24rpx 0 26rpx 0;
border-bottom: 1rpx solid #E5E5E5;
.my_list_item_left {
display: flex;
align-items: center;
.my_list_item_icon {
width: 44rpx;
height: 44rpx;
margin-right: 18rpx;
}
.my_list_item_name {
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
}
}
.my_list_item:last-child {
border-bottom: none;
}
} }
} }
} }
}
.card-list {
display: grid;
grid-template-columns: repeat(4, 1fr);
column-gap: 40rpx;
margin-top: 20rpx;
.card-list-item {
max-width: 182rpx;
box-shadow: 8rpx 8rpx 32rpx 0 #0b18390f;
border-radius: 0 0 20rpx 20rpx;
.info {
.card-list { padding-bottom: 16rpx;
display: grid;
grid-template-columns: repeat(4, 1fr);
column-gap: 40rpx;
margin-top: 20rpx;
.card-list-item {
max-width: 182rpx;
box-shadow: 8rpx 8rpx 32rpx 0 #0b18390f;
border-radius: 0 0 20rpx 20rpx; border-radius: 0 0 20rpx 20rpx;
overflow: hidden;
.info {
padding-bottom: 16rpx;
border-radius: 0 0 20rpx 20rpx;
overflow: hidden;
}
} }
} }
</style> }
</style>