Merge branch 'test' of https://newgitea.sxczgkj.cn/czg_team/cashier_wx into prod
This commit is contained in:
11
.gitignore
vendored
11
.gitignore
vendored
@@ -2,4 +2,13 @@
|
||||
/unpackage
|
||||
node_modules/
|
||||
.vscode/
|
||||
.hbuilderx/
|
||||
.hbuilderx/
|
||||
/.idea/inspectionProfiles/Project_Default.xml
|
||||
/.idea/.gitignore
|
||||
/.idea/cashier_wx.iml
|
||||
/.idea/jsLibraryMappings.xml
|
||||
/.idea/misc.xml
|
||||
/.idea/modules.xml
|
||||
/.idea/uniappSupport.xml
|
||||
/.idea/UniappTool.xml
|
||||
/.idea/vcs.xml
|
||||
|
||||
@@ -31,6 +31,14 @@ export const APIuser = (data) => {
|
||||
})
|
||||
}
|
||||
|
||||
export const updateUserInfoReq = (data) => {
|
||||
return request({
|
||||
url: url + '/user',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
//获取手机号
|
||||
export const APIuserphone = (data) => {
|
||||
return request({
|
||||
|
||||
125
common/api/market/package.js
Normal file
125
common/api/market/package.js
Normal file
@@ -0,0 +1,125 @@
|
||||
// 引入 request 文件
|
||||
import request from '@/common/api/request.js'
|
||||
import {
|
||||
prveUrl
|
||||
} from './config.js'
|
||||
|
||||
const orderPrveUrl = '/order'
|
||||
|
||||
let platformType = '';
|
||||
let payType = '';
|
||||
// #ifdef MP-WEIXIN
|
||||
platformType = 'wechat'
|
||||
payType = 'wechatPay'
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
platformType = 'alipay'
|
||||
payType = 'aliPay'
|
||||
// #endif
|
||||
|
||||
export const getPackage = (data) => {
|
||||
return request({
|
||||
url: prveUrl + '/user/package',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export const getPackageDetail = (data) => {
|
||||
return request({
|
||||
url: prveUrl + '/user/package/detail/' + data.id,
|
||||
method: 'get',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export const helpPage = (data) => {
|
||||
return request({
|
||||
url: prveUrl + '/user/package/help/page',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
export const order = (data) => {
|
||||
return request({
|
||||
url: prveUrl + '/user/package/order',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export const createOrder = (data) => {
|
||||
return request({
|
||||
url: prveUrl + '/user/package/order',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
export const cancel = (data) => {
|
||||
return request({
|
||||
url: prveUrl + '/user/package/cancel',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export const help = (data) => {
|
||||
return request({
|
||||
url: prveUrl + '/user/package/help',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export const orderDetail = (data) => {
|
||||
return request({
|
||||
url: prveUrl + '/user/package/order/detail',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export const ppOrderPay = (data) => {
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
const openId = uni.cache.get('userInfo').wechatOpenId;
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
const openId = uni.cache.get('userInfo').alipayOpenId;
|
||||
// #endif
|
||||
return request({
|
||||
url: orderPrveUrl + '/user/ppOrder/pay',
|
||||
method: 'post',
|
||||
data: {
|
||||
platformType,
|
||||
payType,
|
||||
openId,
|
||||
...data
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
export const applyRefund = (data) => {
|
||||
return request({
|
||||
url: orderPrveUrl + '/user/ppOrder/applyRefund',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export const cancelRefund = (data) => {
|
||||
return request({
|
||||
url: orderPrveUrl + '/user/ppOrder/cancelRefund',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
80
common/api/order/gbOrder.js
Normal file
80
common/api/order/gbOrder.js
Normal file
@@ -0,0 +1,80 @@
|
||||
// 引入 request 文件
|
||||
import request from '@/common/api/request.js'
|
||||
const url = '/order'
|
||||
|
||||
let platformType = '';
|
||||
let payType='';
|
||||
// #ifdef MP-WEIXIN
|
||||
platformType = 'wechat'
|
||||
payType='wechatPay'
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
platformType = 'alipay'
|
||||
payType='aliPay'
|
||||
// #endif
|
||||
|
||||
export const warePage = (data) => {
|
||||
return request({
|
||||
url: url + '/user/gbOrder/ware/page',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export const wareDetail = (data) => {
|
||||
return request({
|
||||
url: url + '/user/gbOrder/ware/detail',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export const record = (data) => {
|
||||
return request({
|
||||
url: url + '/user/gbOrder/record/page',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export const recordDetail = (data) => {
|
||||
return request({
|
||||
url: url + '/user/gbOrder/record/detail',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
export const exchange = (data) => {
|
||||
// #ifdef MP-WEIXIN
|
||||
const openId=uni.cache.get('userInfo').wechatOpenId;
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
const openId=uni.cache.get('userInfo').alipayOpenId;
|
||||
// #endif
|
||||
return request({
|
||||
url: url + '/user/gbOrder/exchange',
|
||||
method: 'post',
|
||||
data: {
|
||||
platformType,
|
||||
payType,
|
||||
openId,
|
||||
...data
|
||||
}
|
||||
})
|
||||
}
|
||||
export const applyRefund = (data) => {
|
||||
return request({
|
||||
url: url + '/user/gbOrder/applyRefund',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export const cancelRefund = (data) => {
|
||||
return request({
|
||||
url: url + '/user/gbOrder/cancelRefund',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
@@ -1,138 +1,143 @@
|
||||
export default (params) => {
|
||||
let url = params.url;
|
||||
let method = params.method || "get";
|
||||
let data = params.data || {};
|
||||
let type = params.type || 1;
|
||||
let toast = params.toast || true;
|
||||
let token = uni.cache.get("token") || "";
|
||||
const shopId = uni.cache.get("shopId") * 1;
|
||||
const userInfo = uni.cache.get("userInfo") || {};
|
||||
// #ifdef H5
|
||||
token = "21f0a0b10e1d40ce9c6464037fedb792";
|
||||
// #endif
|
||||
let header = {
|
||||
version: uni.conf.version,
|
||||
type: uni.getSystemInfoSync().platform,
|
||||
// #ifdef APP-PLUS
|
||||
platformType: "APP",
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
platformType: "H5",
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
platformType: "WX",
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
platformType: "ALI",
|
||||
// #endif
|
||||
token,
|
||||
id: userInfo.id || "",
|
||||
shopId: shopId || "",
|
||||
userId: userInfo.id || "",
|
||||
};
|
||||
if (toast) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true,
|
||||
});
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
const timeoutDuration = params.timeout || 10000; // 可以通过 params 传入超时时间,默认 10 秒
|
||||
uni.request({
|
||||
url: uni.conf.baseUrl + url,
|
||||
method: method,
|
||||
header: header,
|
||||
data: data,
|
||||
timeout: timeoutDuration,
|
||||
success(response) {
|
||||
const res = response.data;
|
||||
// 根据返回的状态码做出对应的操作
|
||||
//获取成功
|
||||
if (res.code == 200) {
|
||||
uni.hideLoading();
|
||||
uni.hideToast();
|
||||
resolve(res.data ? res.data : true);
|
||||
} else {
|
||||
switch (res.code) {
|
||||
case "501":
|
||||
uni.cache.remove("shopId");
|
||||
// uni.showToast({
|
||||
// title: '',
|
||||
// icon: "none",
|
||||
// success: () => {
|
||||
|
||||
// }
|
||||
// })
|
||||
setTimeout(() => {
|
||||
uni.reLaunch({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
}, 1000);
|
||||
break;
|
||||
case 404:
|
||||
uni.showToast({
|
||||
title: "请求地址不存在...",
|
||||
duration: 2000,
|
||||
});
|
||||
break;
|
||||
default:
|
||||
// 是否提示
|
||||
if (toast) {
|
||||
uni.showToast({
|
||||
title: (() => {
|
||||
// 1. 获取原始提示文本(兜底空字符串避免报错)
|
||||
const originMsg = res.message || res.msg || res.error || "";
|
||||
// 2. 定义要匹配的前缀
|
||||
const exceptionPrefix = "Exception:";
|
||||
// 3. 判断是否包含目标前缀
|
||||
if (originMsg.includes(exceptionPrefix)) {
|
||||
// 截取前缀后的内容 → 去除首尾空格 → 限制最大20个字符
|
||||
return originMsg
|
||||
.slice(
|
||||
originMsg.indexOf(exceptionPrefix) +
|
||||
exceptionPrefix.length
|
||||
)
|
||||
.trim()
|
||||
.slice(0, 20);
|
||||
} else {
|
||||
// 不包含则按原逻辑截取前20个字符
|
||||
return originMsg.slice(0, 20);
|
||||
}
|
||||
})(),
|
||||
icon: "none",
|
||||
success: () => {
|
||||
// 修复:去掉多余的 res 参数(避免覆盖外层 res)
|
||||
setTimeout(() => {
|
||||
reject(false);
|
||||
}, 1000);
|
||||
},
|
||||
});
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
fail(err) {
|
||||
if (err.errMsg.indexOf("request:fail") !== -1) {
|
||||
if (err.errMsg.indexOf("timeout") !== -1) {
|
||||
if (toast) {
|
||||
uni.showToast({
|
||||
title: `请求超时,请稍后重试`,
|
||||
icon: "error",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
reject(err);
|
||||
},
|
||||
complete() {
|
||||
// 不管成功还是失败都会执行
|
||||
setTimeout((res) => {
|
||||
uni.hideLoading();
|
||||
uni.hideToast();
|
||||
}, 10000);
|
||||
},
|
||||
});
|
||||
}).catch((e) => {});
|
||||
};
|
||||
export default async (params) => {
|
||||
let url = params.url;
|
||||
let method = params.method || "get";
|
||||
let data = params.data || {};
|
||||
let type = params.type || 1;
|
||||
let toast = params.toast || true;
|
||||
let token = uni.cache.get("token") || "";
|
||||
const shopId = uni.cache.get("shopId") * 1;
|
||||
const userInfo = uni.cache.get("userInfo") || {};
|
||||
// #ifdef H5
|
||||
token = "b61c8b0f1c9d47ad924e33c48b496ce6";
|
||||
// #endif
|
||||
let header = {
|
||||
version: uni.conf.version,
|
||||
type: uni.getSystemInfoSync().platform,
|
||||
// #ifdef APP-PLUS
|
||||
platformType: "APP",
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
platformType: "H5",
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
platformType: "WX",
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
platformType: "ALI",
|
||||
// #endif
|
||||
token,
|
||||
id: userInfo.id || "",
|
||||
shopId: shopId || "",
|
||||
userId: userInfo.id || "",
|
||||
};
|
||||
if (toast) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true,
|
||||
});
|
||||
}
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
const timeoutDuration = params.timeout || 10000; // 可以通过 params 传入超时时间,默认 10 秒
|
||||
uni.request({
|
||||
url: uni.conf.baseUrl + url,
|
||||
method: method,
|
||||
header: header,
|
||||
data: data,
|
||||
timeout: timeoutDuration,
|
||||
success(response) {
|
||||
const res = response.data;
|
||||
// 根据返回的状态码做出对应的操作
|
||||
//获取成功
|
||||
if (res.code == 200) {
|
||||
uni.hideLoading();
|
||||
uni.hideToast();
|
||||
resolve(res.data ? res.data : true);
|
||||
} else {
|
||||
switch (res.code) {
|
||||
case "501":
|
||||
uni.cache.remove("shopId");
|
||||
// uni.showToast({
|
||||
// title: '',
|
||||
// icon: "none",
|
||||
// success: () => {
|
||||
|
||||
// }
|
||||
// })
|
||||
setTimeout(() => {
|
||||
uni.reLaunch({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
}, 1000);
|
||||
break;
|
||||
case 404:
|
||||
uni.showToast({
|
||||
title: "请求地址不存在...",
|
||||
duration: 2000,
|
||||
});
|
||||
break;
|
||||
default:
|
||||
// 是否提示
|
||||
if (toast) {
|
||||
uni.showToast({
|
||||
title: (() => {
|
||||
// 1. 获取原始提示文本(兜底空字符串避免报错)
|
||||
const originMsg = res.message || res.msg ||
|
||||
res
|
||||
.error || "";
|
||||
// 2. 定义要匹配的前缀
|
||||
const exceptionPrefix = "Exception:";
|
||||
// 3. 判断是否包含目标前缀
|
||||
if (originMsg.includes(exceptionPrefix)) {
|
||||
// 截取前缀后的内容 → 去除首尾空格 → 限制最大20个字符
|
||||
return originMsg
|
||||
.slice(
|
||||
originMsg.indexOf(
|
||||
exceptionPrefix) +
|
||||
exceptionPrefix.length
|
||||
)
|
||||
.trim()
|
||||
.slice(0, 20);
|
||||
} else {
|
||||
// 不包含则按原逻辑截取前20个字符
|
||||
return originMsg.slice(0, 20);
|
||||
}
|
||||
})(),
|
||||
icon: "none",
|
||||
success: () => {
|
||||
// 修复:去掉多余的 res 参数(避免覆盖外层 res)
|
||||
setTimeout(() => {
|
||||
reject(false);
|
||||
}, 1000);
|
||||
},
|
||||
});
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
fail(err) {
|
||||
if (err.errMsg.indexOf("request:fail") !== -1) {
|
||||
if (err.errMsg.indexOf("timeout") !== -1) {
|
||||
if (toast) {
|
||||
uni.showToast({
|
||||
title: `请求超时,请稍后重试`,
|
||||
icon: "error",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
reject(err);
|
||||
},
|
||||
complete() {
|
||||
// 不管成功还是失败都会执行
|
||||
setTimeout((res) => {
|
||||
uni.hideLoading();
|
||||
uni.hideToast();
|
||||
}, 10000);
|
||||
},
|
||||
});
|
||||
}).catch((e) => {});
|
||||
};
|
||||
@@ -1,5 +1,5 @@
|
||||
// const debug = process.env.NODE_ENV == 'development' ? true : false;
|
||||
const debug = false;
|
||||
const debug = true; // false线上 true本地
|
||||
// #ifdef H5
|
||||
const proxyApi = "/api";
|
||||
// #endif
|
||||
@@ -32,13 +32,14 @@ uni.conf = {
|
||||
baseUrlwws,
|
||||
};
|
||||
|
||||
console.log('uni.conf',uni.conf)
|
||||
|
||||
export const changeEnv = (env) => {
|
||||
if (env === "test") {
|
||||
let baseUrl = "http://192.168.1.42"
|
||||
let baseUrlwws="ws://192.168.1.42:2348"
|
||||
// #ifdef H5
|
||||
baseUrl = "/api"
|
||||
baseUrlwws="http://192.168.1.42:2348"
|
||||
// #endif
|
||||
uni.conf = {
|
||||
debug: true,
|
||||
@@ -47,7 +48,7 @@ export const changeEnv = (env) => {
|
||||
phpChatWx: 'ws://192.168.1.42:2348',
|
||||
version: 100,
|
||||
autoRemoveCache,
|
||||
baseUrlwws: "ws://192.168.1.42:2348",
|
||||
baseUrlwws,
|
||||
};
|
||||
}
|
||||
if (env === "prod") {
|
||||
@@ -59,4 +60,6 @@ export const changeEnv = (env) => {
|
||||
baseUrlwws: "wss://czgeatws.sxczgkj.com/wss",
|
||||
};
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
export default uni.conf
|
||||
230
components/attract-popup.vue
Normal file
230
components/attract-popup.vue
Normal file
@@ -0,0 +1,230 @@
|
||||
<!-- 私域引流 -->
|
||||
<template>
|
||||
<u-popup :show="show" mode="center" :safeAreaInsetBottom="false">
|
||||
<view class="new_preview">
|
||||
<view class="header">{{ shopInfo.shopName }}</view>
|
||||
<view class="content">
|
||||
<view class="title">{{ form.title }}</view>
|
||||
<view class="img_wrap">
|
||||
<image class="img" :show-menu-by-longpress="true" :src="form.qrCode" @click=""></image>
|
||||
</view>
|
||||
<view class="intro">
|
||||
{{ form.content }}
|
||||
</view>
|
||||
<view class="foot">
|
||||
{{ form.note }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="close" @click="closeHandle">
|
||||
<u-icon name="close" color="#fff" size="14"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import dayjs from 'dayjs';
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { config } from '@/common/api/market/drainageConfig.js';
|
||||
import { checkArrayElementsExist } from '@/utils/util.js';
|
||||
|
||||
const shopInfo = ref('');
|
||||
|
||||
const props = defineProps({
|
||||
type: {
|
||||
type: String,
|
||||
default: 'home' // 调用的位置 home首页 order支付成功后
|
||||
}
|
||||
});
|
||||
|
||||
const show = ref(false);
|
||||
const form = ref({});
|
||||
const drainageHomeKey = 'drainageHome';
|
||||
function closeHandle() {
|
||||
switch (props.type) {
|
||||
case 'home':
|
||||
// 在首页关闭
|
||||
switch (form.value.homeType) {
|
||||
case 'only':
|
||||
// 仅显示1次
|
||||
uni.cache.set(drainageHomeKey, {
|
||||
value: form.value.homeType
|
||||
});
|
||||
break;
|
||||
case 'day':
|
||||
// 每天显示1次
|
||||
uni.cache.set(drainageHomeKey, {
|
||||
value: form.value.homeType,
|
||||
time: dayjs().format('YYYY-MM-DD')
|
||||
});
|
||||
break;
|
||||
case 'every':
|
||||
// 每次onload都显示
|
||||
uni.cache.set(drainageHomeKey, {
|
||||
value: form.value.homeType
|
||||
});
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
break;
|
||||
case 'order':
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
show.value = false;
|
||||
}
|
||||
|
||||
// 显示逻辑
|
||||
function showHandle() {
|
||||
switch (props.type) {
|
||||
case 'home':
|
||||
// 首页
|
||||
if (form.value.homeEnable == 0) return;
|
||||
let drainage = uni.cache.get(drainageHomeKey);
|
||||
|
||||
console.log('drainage', drainage);
|
||||
|
||||
if (!drainage || form.value.homeType != drainage.value) {
|
||||
uni.cache.set(drainageHomeKey, '');
|
||||
show.value = true;
|
||||
} else {
|
||||
switch (drainage.value) {
|
||||
case 'only':
|
||||
// 存在则证明已经显示过一次,则不在显示
|
||||
break;
|
||||
case 'day':
|
||||
// 判断是不是用一天,同一天不显示,不是同一天则显示
|
||||
let localDay = drainage.time;
|
||||
let currentDay = dayjs().format('YYYY-MM-DD');
|
||||
if (localDay != currentDay) {
|
||||
show.value = true;
|
||||
}
|
||||
break;
|
||||
case 'every':
|
||||
// 页面每次onload会触发显示
|
||||
show.value = true;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'order':
|
||||
// 订单 只要包含用餐类型就显示
|
||||
let shopMode = shopInfo.value.eatModel.split(',');
|
||||
if (checkArrayElementsExist(shopMode, form.value.orderType, true) && form.value.orderEnable) {
|
||||
show.value = true;
|
||||
}
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 获取私域引流配置
|
||||
async function configAjax() {
|
||||
try {
|
||||
const shopId = uni.cache.get('shopId');
|
||||
const res = await config({ shopId: shopId });
|
||||
form.value = res;
|
||||
showHandle();
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
configAjax
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
shopInfo.value = uni.cache.get('shopInfo');
|
||||
if (props.type == 'home') {
|
||||
configAjax();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.new_preview {
|
||||
--bg: #3f3b37;
|
||||
--color: #f6dfc4;
|
||||
--borderColor: #f6dfc45b;
|
||||
width: 90vw;
|
||||
background-color: var(--bg);
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
.close {
|
||||
--size: 70upx;
|
||||
width: var(--size);
|
||||
height: var(--size);
|
||||
border-radius: 50%;
|
||||
background-color: var(--bg);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
bottom: calc(var(--size) * -1 - 20upx);
|
||||
left: 50%;
|
||||
margin-left: calc(var(--size) / 2 * -1);
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
color: var(--color);
|
||||
height: 50px;
|
||||
border-bottom: 1px dashed var(--borderColor);
|
||||
}
|
||||
|
||||
.content {
|
||||
padding-bottom: 14px;
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
color: var(--color);
|
||||
height: 50px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.img_wrap {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.img {
|
||||
--size: 220px;
|
||||
width: var(--size);
|
||||
height: var(--size);
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.intro {
|
||||
height: 40px;
|
||||
font-size: 14px;
|
||||
color: var(--color);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 14px;
|
||||
}
|
||||
|
||||
.foot {
|
||||
height: 40px;
|
||||
color: var(--borderColor);
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 14px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,114 +1,93 @@
|
||||
<template>
|
||||
<view>
|
||||
<!-- 私域引流 -->
|
||||
<up-popup
|
||||
:show="show"
|
||||
mode="center"
|
||||
round="16rpx"
|
||||
closeOnClickOverlay
|
||||
@close="close"
|
||||
:safeAreaInsetBottom="false"
|
||||
>
|
||||
<view class="preview-box">
|
||||
<view class="u-flex" style="align-items: stretch">
|
||||
<view
|
||||
class="u-flex-1 u-p-r-24 u-flex u-flex-col"
|
||||
style="align-items: start; justify-content: space-between"
|
||||
>
|
||||
<view>
|
||||
<view class="font-14 font-bold color-333">{{
|
||||
drainageConfig.title
|
||||
}}</view>
|
||||
<view class="u-m-t-16 font-12 color-666">{{
|
||||
drainageConfig.content
|
||||
}}</view>
|
||||
</view>
|
||||
<view>
|
||||
<!-- 私域引流 -->
|
||||
<up-popup :show="show" mode="center" round="16rpx" closeOnClickOverlay @close="close" :safeAreaInsetBottom="false">
|
||||
<view class="preview-box">
|
||||
<view class="u-flex" style="align-items: stretch">
|
||||
<view class="u-flex-1 u-p-r-24 u-flex u-flex-col" style="align-items: start; justify-content: space-between">
|
||||
<view>
|
||||
<view class="font-14 font-bold color-333">{{ drainageConfig.title }}</view>
|
||||
<view class="u-m-t-16 font-12 color-666">{{ drainageConfig.content }}</view>
|
||||
</view>
|
||||
|
||||
<view class="color-999 font-12 u-m-t-16">{{
|
||||
drainageConfig.note
|
||||
}}</view>
|
||||
</view>
|
||||
<view class="color-999 font-12 u-m-t-16">{{ drainageConfig.note }}</view>
|
||||
</view>
|
||||
|
||||
<image
|
||||
:show-menu-by-longpress="true"
|
||||
:src="drainageConfig.qrCode"
|
||||
style="width: 240rpx; height: 240rpx"
|
||||
mode="aspectFit"
|
||||
></image>
|
||||
</view>
|
||||
<image :show-menu-by-longpress="true" :src="drainageConfig.qrCode" style="width: 240rpx; height: 240rpx" mode="aspectFit"></image>
|
||||
</view>
|
||||
|
||||
<view class="close" @click="close">
|
||||
<up-icon name="close-circle" size="34" color="#fff"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</up-popup>
|
||||
</view>
|
||||
<view class="close" @click="close">
|
||||
<up-icon name="close-circle" size="34" color="#fff"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</up-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as drainageConfigApi from "@/common/api/market/drainageConfig.js";
|
||||
import { ref, reactive, computed, watch, onMounted } from "vue";
|
||||
import * as drainageConfigApi from '@/common/api/market/drainageConfig.js';
|
||||
import { ref, reactive, computed, watch, onMounted } from 'vue';
|
||||
|
||||
const showPreview = defineModel({
|
||||
type: Boolean,
|
||||
default: false,
|
||||
type: Boolean,
|
||||
default: false
|
||||
});
|
||||
|
||||
const show=ref(false);
|
||||
const emit = defineEmits(["close"]);
|
||||
const show = ref(false);
|
||||
const emit = defineEmits(['close']);
|
||||
|
||||
function close() {
|
||||
show.value = false;
|
||||
emit("close");
|
||||
show.value = false;
|
||||
emit('close');
|
||||
}
|
||||
const drainageConfig = ref({});
|
||||
async function getDrainageConfig() {
|
||||
const shopId = uni.cache.get("shopId");
|
||||
const drainageConfigRes = await drainageConfigApi.config({
|
||||
shopId: shopId,
|
||||
});
|
||||
drainageConfig.value = drainageConfigRes;
|
||||
if (drainageConfig.value.isEnable) {
|
||||
show.value = true;
|
||||
} else {
|
||||
close();
|
||||
}
|
||||
const shopId = uni.cache.get('shopId');
|
||||
const drainageConfigRes = await drainageConfigApi.config({
|
||||
shopId: shopId
|
||||
});
|
||||
drainageConfig.value = drainageConfigRes;
|
||||
if (drainageConfig.value.isEnable) {
|
||||
show.value = true;
|
||||
} else {
|
||||
close();
|
||||
}
|
||||
}
|
||||
// onMounted(() => {
|
||||
// getDrainageConfig();
|
||||
// });
|
||||
watch(
|
||||
() => showPreview.value,
|
||||
(newVal) => {
|
||||
if (newVal) {
|
||||
getDrainageConfig();
|
||||
}
|
||||
}
|
||||
() => showPreview.value,
|
||||
(newVal) => {
|
||||
if (newVal) {
|
||||
getDrainageConfig();
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.u-flex-col {
|
||||
flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.preview {
|
||||
padding: 8rpx 32rpx;
|
||||
border-radius: 12rpx;
|
||||
background: $my-main-color;
|
||||
color: #ffffff;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
line-height: 40rpx;
|
||||
padding: 8rpx 32rpx;
|
||||
border-radius: 12rpx;
|
||||
background: $my-main-color;
|
||||
color: #ffffff;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.preview-box {
|
||||
width: 700rpx;
|
||||
padding: 32rpx 28rpx;
|
||||
position: relative;
|
||||
.close {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -100rpx;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
width: 700rpx;
|
||||
padding: 32rpx 28rpx;
|
||||
position: relative;
|
||||
.close {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -100rpx;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
41
components/look-qrcode/look-qrcode.vue
Normal file
41
components/look-qrcode/look-qrcode.vue
Normal file
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<modal v-model="show" title="查看券码" :showBottom="false">
|
||||
<view class="u-p-28">
|
||||
<view class="u-flex u-row-center">
|
||||
<up-qrcode cid="ex1" :size="104" :val="qrcode"></up-qrcode>
|
||||
</view>
|
||||
<view class="u-m-t-22 u-flex u-row-center">
|
||||
<text>{{ qrcode }}</text>
|
||||
<view @click="copyCode">
|
||||
<image src="/static/icon/copy.png" class="u-m-l-24 copy"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</modal>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import modal from '@/components/modal.vue'
|
||||
const props = defineProps({
|
||||
qrcode: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
})
|
||||
const show = defineModel({
|
||||
default: false
|
||||
})
|
||||
|
||||
function copyCode() {
|
||||
uni.setClipboardData({
|
||||
data: props.qrcode
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.copy {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
</style>
|
||||
97
components/modal.vue
Normal file
97
components/modal.vue
Normal file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<view>
|
||||
<up-popup
|
||||
:show="show"
|
||||
mode="center"
|
||||
:safeAreaInsetBottom="mode === 'bottom' ? true : false"
|
||||
>
|
||||
<view class="popup-content">
|
||||
<view class="top u-flex u-row-between">
|
||||
<text class="font-bold u-font-32 color-333">{{ title }}</text>
|
||||
<up-icon size="18" name="close" @click="show = false"></up-icon>
|
||||
</view>
|
||||
<up-line></up-line>
|
||||
<scroll-view style="max-height: 50vh" :scroll-y="true">
|
||||
<slot></slot>
|
||||
</scroll-view>
|
||||
<template v-if="showBottom">
|
||||
<up-line></up-line>
|
||||
|
||||
<view class="bottom">
|
||||
<view class="btn cancel" @click="close">{{ cancelText }}</view>
|
||||
<view class="btn success" @click="confirm">{{ confirmText }}</view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</up-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
mode: {
|
||||
type: String,
|
||||
default: "center",
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: "标题",
|
||||
},
|
||||
confirmText: {
|
||||
type: String,
|
||||
default: "确认",
|
||||
},
|
||||
cancelText: {
|
||||
type: String,
|
||||
default: "取消",
|
||||
},
|
||||
showBottom: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
});
|
||||
const show = defineModel({
|
||||
type: Boolean,
|
||||
default: false,
|
||||
});
|
||||
const emits = defineEmits(["close", "confirm"]);
|
||||
function close() {
|
||||
show.value = false;
|
||||
emits("close");
|
||||
}
|
||||
function confirm() {
|
||||
emits("confirm");
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.popup-content {
|
||||
background: #fff;
|
||||
width: 640rpx;
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
.top {
|
||||
padding: 40rpx 48rpx;
|
||||
}
|
||||
.bottom {
|
||||
padding: 48rpx 52rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 50rpx;
|
||||
.btn {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 18rpx 60rpx;
|
||||
border-radius: 100rpx;
|
||||
font-size: 32rpx;
|
||||
border: 2rpx solid transparent;
|
||||
&.success {
|
||||
background-color: $my-main-color;
|
||||
color: #fff;
|
||||
}
|
||||
&.cancel {
|
||||
border-color: $my-main-color;
|
||||
color: $my-main-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,43 +1,49 @@
|
||||
<template>
|
||||
<view>
|
||||
<!-- 生成公众号二维码 -->
|
||||
<we-qrcode @generate="(e) => qrcodeResult(e)"></we-qrcode>
|
||||
<view>
|
||||
<!-- 生成公众号二维码 -->
|
||||
<we-qrcode @generate="(e) => qrcodeResult(e)"></we-qrcode>
|
||||
|
||||
<officialAccount
|
||||
followIndex="order"
|
||||
:wechatAcQrcode="wechatAcQrcode"
|
||||
v-if="showOfficialAccount"
|
||||
@close="modelClose($event, 'officialAccount')"
|
||||
/>
|
||||
<Drainage v-model="showDrainage" @close="modelClose($event, 'drainage')" />
|
||||
</view>
|
||||
<officialAccount followIndex="order" :wechatAcQrcode="wechatAcQrcode" v-if="showOfficialAccount" @close="modelClose($event, 'officialAccount')" />
|
||||
<!-- <Drainage v-model="showDrainage" @close="modelClose($event, 'drainage')" /> -->
|
||||
<attractPopup type="order" ref="attractPopupRef" />
|
||||
</view>
|
||||
</template>
|
||||
<script setup>
|
||||
import weQrcode from "@/components/wechat-ac-qrcode.vue";
|
||||
<script setup>
|
||||
import weQrcode from '@/components/wechat-ac-qrcode.vue';
|
||||
|
||||
import { ref, watch, computed, reactive, toRaw } from "vue";
|
||||
import officialAccount from "@/components/official-account.vue";
|
||||
import Drainage from "@/components/drainage.vue";
|
||||
import attractPopup from '@/components/attract-popup.vue';
|
||||
import { ref, watch, computed, reactive, toRaw } from 'vue';
|
||||
import officialAccount from '@/components/official-account.vue';
|
||||
import Drainage from '@/components/drainage.vue';
|
||||
|
||||
const attractPopupRef = ref(null);
|
||||
|
||||
const showDrainage = defineModel({
|
||||
type: Boolean,
|
||||
default: false,
|
||||
type: Boolean,
|
||||
default: false
|
||||
});
|
||||
|
||||
watch(showDrainage, (newVal, oldVal) => {
|
||||
console.log('modelValue 变化:', { newVal, oldVal });
|
||||
if (newVal == true) {
|
||||
attractPopupRef.value.configAjax();
|
||||
}
|
||||
});
|
||||
|
||||
const showOfficialAccount = ref(false);
|
||||
|
||||
function modelClose(e, type) {
|
||||
console.log("modelClose", type);
|
||||
if (type == "drainage") {
|
||||
showOfficialAccount.value = true;
|
||||
return;
|
||||
}
|
||||
console.log('modelClose', type);
|
||||
if (type == 'drainage') {
|
||||
showOfficialAccount.value = true;
|
||||
return;
|
||||
}
|
||||
}
|
||||
const wechatAcQrcode = ref("");
|
||||
const userinfo = uni.cache.get("userInfo") || {};
|
||||
const codeVal = ref(userinfo.wechatAcQrcode || "");
|
||||
console.log("codeVal", codeVal.value);
|
||||
const wechatAcQrcode = ref('');
|
||||
const userinfo = uni.cache.get('userInfo') || {};
|
||||
const codeVal = ref(userinfo.wechatAcQrcode || '');
|
||||
console.log('codeVal', codeVal.value);
|
||||
function qrcodeResult(e) {
|
||||
wechatAcQrcode.value = e;
|
||||
wechatAcQrcode.value = e;
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,34 +0,0 @@
|
||||
// const debug = process.env.NODE_ENV == 'development' ? true : false;
|
||||
const debug = false
|
||||
// #ifdef H5
|
||||
const proxyApi = "/api"
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN || APP || MP-ALIPAY
|
||||
const proxyApi = 'http://192.168.1.42' // 调试地址
|
||||
const proxyApiwws = 'ws://192.168.1.42:2348' // 调试地址
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
const baseUrl = debug ? proxyApi : "http://192.168.1.42"
|
||||
const baseUrlwws = 'ws://192.168.1.42:2348'
|
||||
// #endif
|
||||
|
||||
// #ifdef APP || MP-WEIXIN || MP-ALIPAY
|
||||
const baseUrl = debug ? proxyApi : 'https://cashier.sxczgkj.com' // 线上
|
||||
const baseUrlwws = debug ? proxyApiwws : 'wss://czgeatws.sxczgkj.com/wss' // 线上
|
||||
// #endif
|
||||
|
||||
|
||||
const version = '100'
|
||||
const autoRemoveCache = {
|
||||
count: 100000,
|
||||
size: 100000
|
||||
}
|
||||
uni.conf = {
|
||||
debug,
|
||||
baseUrl,
|
||||
version,
|
||||
autoRemoveCache,
|
||||
baseUrlwws
|
||||
}
|
||||
@@ -11,7 +11,9 @@ function get(key) {
|
||||
return ''
|
||||
}
|
||||
|
||||
|
||||
// #ifdef H5
|
||||
return res.value
|
||||
// #endif
|
||||
|
||||
if (res.expiretime && res.expiretime < Date.now()) {
|
||||
remove(key)
|
||||
|
||||
1
framework/bootstrap.js
vendored
1
framework/bootstrap.js
vendored
@@ -1,4 +1,3 @@
|
||||
import './0-conf'
|
||||
import './1-utils'
|
||||
import './2-url'
|
||||
import './3-pro'
|
||||
|
||||
97
groupBuying/components/modal.vue
Normal file
97
groupBuying/components/modal.vue
Normal file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<view>
|
||||
<up-popup
|
||||
:show="show"
|
||||
mode="center"
|
||||
:safeAreaInsetBottom="mode === 'bottom' ? true : false"
|
||||
>
|
||||
<view class="popup-content">
|
||||
<view class="top u-flex u-row-between">
|
||||
<text class="font-bold u-font-32 color-333">{{ title }}</text>
|
||||
<up-icon size="18" name="close" @click="show = false"></up-icon>
|
||||
</view>
|
||||
<up-line></up-line>
|
||||
<scroll-view style="max-height: 50vh" :scroll-y="true">
|
||||
<slot></slot>
|
||||
</scroll-view>
|
||||
<template v-if="showBottom">
|
||||
<up-line></up-line>
|
||||
|
||||
<view class="bottom">
|
||||
<view class="btn cancel" @click="close">{{ cancelText }}</view>
|
||||
<view class="btn success" @click="confirm">{{ confirmText }}</view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</up-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
mode: {
|
||||
type: String,
|
||||
default: "center",
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: "标题",
|
||||
},
|
||||
confirmText: {
|
||||
type: String,
|
||||
default: "确认",
|
||||
},
|
||||
cancelText: {
|
||||
type: String,
|
||||
default: "取消",
|
||||
},
|
||||
showBottom: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
});
|
||||
const show = defineModel({
|
||||
type: Boolean,
|
||||
default: false,
|
||||
});
|
||||
const emits = defineEmits(["close", "confirm"]);
|
||||
function close() {
|
||||
show.value = false;
|
||||
emits("close");
|
||||
}
|
||||
function confirm() {
|
||||
emits("confirm");
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.popup-content {
|
||||
background: #fff;
|
||||
width: 640rpx;
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
.top {
|
||||
padding: 40rpx 48rpx;
|
||||
}
|
||||
.bottom {
|
||||
padding: 48rpx 52rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 50rpx;
|
||||
.btn {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 18rpx 60rpx;
|
||||
border-radius: 100rpx;
|
||||
font-size: 32rpx;
|
||||
border: 2rpx solid transparent;
|
||||
&.success {
|
||||
background-color: $my-main-color;
|
||||
color: #fff;
|
||||
}
|
||||
&.cancel {
|
||||
border-color: $my-main-color;
|
||||
color: $my-main-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
74
groupBuying/components/status.vue
Normal file
74
groupBuying/components/status.vue
Normal file
@@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<text class="status " :class="returnClass">{{status}}</text>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed } from 'vue'
|
||||
|
||||
const props=defineProps({
|
||||
status:{
|
||||
default:''
|
||||
}
|
||||
})
|
||||
const list =ref( [{
|
||||
name: '全部',
|
||||
value: ''
|
||||
},
|
||||
{
|
||||
name: '待成团',
|
||||
value: '',
|
||||
class:'success'
|
||||
},
|
||||
{
|
||||
name: '待核销',
|
||||
value: '',
|
||||
class:'warning'
|
||||
},
|
||||
{
|
||||
name: '已核销',
|
||||
value: ''
|
||||
},
|
||||
{
|
||||
name: '退款',
|
||||
value: '',
|
||||
class:'error'
|
||||
},
|
||||
])
|
||||
const returnClass=computed(()=>{
|
||||
if(props.status=='已退款'){
|
||||
return 'gray';
|
||||
}
|
||||
const item=list.value.find(v=>props.status.includes(v.name))
|
||||
return item?item.class:''
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.status {
|
||||
padding: 8rpx 18rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #333;
|
||||
|
||||
&.success {
|
||||
border-color: rgba(123, 209, 54, 1);
|
||||
color: rgba(123, 209, 54, 1);
|
||||
background: rgba(123, 209, 54, 0.12);
|
||||
}
|
||||
&.warning{
|
||||
border-color: rgba(255, 141, 40, 1);
|
||||
color: rgba(255, 141, 40, 1);
|
||||
background: rgba(255, 141, 40, 0.12);
|
||||
}
|
||||
&.error {
|
||||
border-color: #FF1C1C;
|
||||
color: #FF1C1C;
|
||||
background: rgba(255, 28, 28, 0.18);
|
||||
}
|
||||
&.gray{
|
||||
color: #bbb;
|
||||
background-color: #f7f7f7;
|
||||
border-color: #bbb;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
250
groupBuying/confirm-order/confirm-order.vue
Normal file
250
groupBuying/confirm-order/confirm-order.vue
Normal file
@@ -0,0 +1,250 @@
|
||||
<template>
|
||||
<view class="min-page bg-f7 u-font-28 color-333 u-p-30">
|
||||
<view class="info">
|
||||
<view class="goods u-flex u-col-center u-p-t-22 u-p-b-22 u-border-bottom">
|
||||
<up-image width="158rpx" height="158rpx" radius="14rpx" :src="item.goodsImg"></up-image>
|
||||
<view class=" u-flex-1 u-p-l-16">
|
||||
<view class="u-flex u-col-center u-row-between">
|
||||
<view class="u-flex tuan-members">
|
||||
<image :src="imgs.pin" class="pin" mode=""></image>
|
||||
<text class="">{{item.groupPeopleNum}}人团</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-t-16 u-flex u-col-center u-row-between">
|
||||
<view style="max-width: 326rpx;">
|
||||
<view class="font-bold u-line-1" v-if="item">{{item.wareName}}</view>
|
||||
<view class="u-flex u-m-t-10 u-col-center ">
|
||||
<view class="price">
|
||||
<text class="u-font-30">¥</text>
|
||||
<text class="u-font-48 font-bold">{{item.groupPrice}} </text>
|
||||
</view>
|
||||
<view class="old-price u-m-l-32">
|
||||
<text>¥</text>
|
||||
<text>{{item.originalPrice}} </text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-p-l-10 color-333 no-wrap">
|
||||
数量:{{item.number}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="shop ">
|
||||
<view class="u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">可核销门店:</text>
|
||||
<text>{{item.shopName}}</text>
|
||||
</view>
|
||||
<view class="u-m-t-32 u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">门店地址:</text>
|
||||
<text>{{item.shopAddress}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-20 u-p-t-28 u-p-b-28">
|
||||
<view class="u-flex u-row-between u-p-t-20 u-p-b-20">
|
||||
<text>商品总额</text>
|
||||
<text class="u-font-32">¥{{totalPayPrice}}</text>
|
||||
</view>
|
||||
<view class="u-flex u-row-between u-p-t-20 u-p-b-20">
|
||||
<text>支付方式</text>
|
||||
<text class="u-font-32">微信支付</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view style="height: 100px;"></view>
|
||||
<view class="u-flex bottom">
|
||||
<view>
|
||||
<text class="color-666">合计:</text>
|
||||
<text class="price">¥{{totalPayPrice}}</text>
|
||||
</view>
|
||||
<view class="btn" @click="payExchange">去支付</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as Api from '@/common/api/order/gbOrder.js'
|
||||
import {
|
||||
pay
|
||||
} from '@/utils/pay.js'
|
||||
import {
|
||||
getOpenId
|
||||
} from '@/utils/uniapp.js'
|
||||
|
||||
const imgs = {
|
||||
bg: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/d21f2dfd7bec44618f2d5e4b88372b08.png',
|
||||
pin: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/3947892924dd481782331513aff00eb3.png'
|
||||
}
|
||||
|
||||
const item = reactive({})
|
||||
onShow(() => {
|
||||
const data = uni.getStorageSync('group_buying_order')
|
||||
const wareImgs = data.wareImgs.split(',').filter(v => v)
|
||||
data.goodsImg = wareImgs[0]
|
||||
Object.assign(item, data)
|
||||
console.log(item)
|
||||
})
|
||||
|
||||
function dingyue() {
|
||||
return new Promise((revlove, reject) => {
|
||||
uni.requestSubscribeMessage({
|
||||
tmplIds: ['JGPAGmqcPEgWB6mvAl0SC5cMqr5H5Qjcim8JCpHAZd0',
|
||||
'F4OyUhe_ZQ9BR731jlkaN2QXAUaA3HBZuUeVPfraSz0'
|
||||
],
|
||||
success(res) {},
|
||||
complete() {
|
||||
revlove()
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
async function payExchange() {
|
||||
await dingyue();
|
||||
uni.showLoading({
|
||||
title: '支付中……'
|
||||
})
|
||||
const openId = await getOpenId()
|
||||
uni.hideLoading()
|
||||
if (openId) {
|
||||
Api.exchange({
|
||||
paramId: item.id,
|
||||
shopId: item.shopId,
|
||||
number: item.number,
|
||||
groupOrderNo: item.groupOrderNo || '',
|
||||
openId
|
||||
}).then(orderRes => {
|
||||
pay(orderRes.payInfo).then(res => {
|
||||
console.log(res)
|
||||
|
||||
if (res) {
|
||||
uni.redirectTo({
|
||||
url: '/groupBuying/success/index?detailId=' + orderRes.record
|
||||
.id + '&shopId=' + orderRes.record.shopId
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '开团失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '鉴权失败,开团失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
import {
|
||||
BigNumber
|
||||
} from "bignumber.js";
|
||||
const totalPrice = computed(() => {
|
||||
if (!item.groupPrice) {
|
||||
return 0;
|
||||
}
|
||||
return BigNumber(item.number).times(item.originalPrice).toNumber()
|
||||
})
|
||||
|
||||
const totalPayPrice = computed(() => {
|
||||
if (!item.groupPrice) {
|
||||
return 0;
|
||||
}
|
||||
return BigNumber(item.number).times(item.groupPrice).toNumber()
|
||||
})
|
||||
|
||||
|
||||
let shareItem = null
|
||||
|
||||
function share(item) {
|
||||
shareItem = item
|
||||
}
|
||||
onShareAppMessage(() => {
|
||||
console.log('onShareAppMessage')
|
||||
console.log(shareItem)
|
||||
const query = `groupOrderNo=${shareItem.groupOrderNo}&shopId=${shareItem.shopId}`
|
||||
return wxShare({
|
||||
title: shareItem.wareJson.wareName,
|
||||
imageUrl: shareItem.goodsImg,
|
||||
path: '/groupBuying/detail/index' + '?' + query,
|
||||
query,
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.info {
|
||||
border-radius: 16rpx;
|
||||
background-color: #fff;
|
||||
padding: 0 24rpx;
|
||||
|
||||
.goods {
|
||||
background-color: #fff;
|
||||
padding: 22rpx 0;
|
||||
|
||||
.pin {
|
||||
width: 60rpx;
|
||||
height: 38rpx;
|
||||
}
|
||||
|
||||
.tuan-members {
|
||||
padding: 0 16rpx 0 0;
|
||||
border-radius: 0 6rpx 6rpx 0;
|
||||
background: #4C2828;
|
||||
color: #f5d9ad;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
color: #666666;
|
||||
text-decoration-line: line-through;
|
||||
}
|
||||
}
|
||||
|
||||
.u-font-48 {
|
||||
font-size: 48rpx;
|
||||
}
|
||||
|
||||
.shop {
|
||||
padding: 22rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
padding: 42rpx 28rpx 60rpx 28rpx;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 14rpx 70rpx;
|
||||
border-radius: 200rpx;
|
||||
background: #E8AD7B;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
771
groupBuying/detail/index.vue
Normal file
771
groupBuying/detail/index.vue
Normal file
@@ -0,0 +1,771 @@
|
||||
<template>
|
||||
<view class="min-page bg-f7 color-333 u-font-28 relative">
|
||||
<view class="top" :style="topStyle">
|
||||
<up-navbar bg-color="transparent" :fixed="false" :placeholder="false" :title="title" left-icon-color="#fff"
|
||||
@leftClick="back('/groupBuying/index/index')" title-color="#fff"></up-navbar>
|
||||
<view class="u-flex info u-col-center">
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="time" v-if="item.status=='待成团'||item.wareGroupStatus=='ing'">
|
||||
<text class="color-666">剩余成团时间:</text>
|
||||
<view class="u-font-32">
|
||||
<text class="number">{{returnNum(0)}}</text>
|
||||
<text class="gap">:</text>
|
||||
<text class="number">{{returnNum(1)}}</text>
|
||||
<text class="gap">:</text>
|
||||
<text class="number">{{returnNum(2)}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods u-flex u-col-center">
|
||||
<up-image width="158rpx" height="158rpx" radius="14rpx" :src="item.goodsImg"></up-image>
|
||||
<view class=" u-flex-1 u-p-l-16">
|
||||
<view class="u-flex u-col-center u-row-between">
|
||||
<view class="u-flex tuan-members">
|
||||
<image :src="imgs.pin" class="pin" mode=""></image>
|
||||
<text class="">{{item.groupPeopleNum}}人团</text>
|
||||
</view>
|
||||
<template v-if="item.id">
|
||||
<statusVue :status="item.status"></statusVue>
|
||||
</template>
|
||||
<template v-else>
|
||||
<statusVue v-if="item.wareGroupStatus=='ing'" status="待成团"></statusVue>
|
||||
<view v-else></view>
|
||||
</template>
|
||||
|
||||
</view>
|
||||
<view class="u-m-t-16 u-flex u-col-center">
|
||||
<view style="width: 356rpx;">
|
||||
<view class="font-bold u-line-1" v-if="item&&item.wareJson">{{item.wareJson
|
||||
.wareName}}</view>
|
||||
<view class="u-flex u-m-t-10 u-col-center ">
|
||||
<view class="price">
|
||||
<text class="u-font-30">¥</text>
|
||||
<text class="u-font-48 font-bold">{{item.wareGroupPrice}} </text>
|
||||
</view>
|
||||
<view class="old-price u-m-l-32">
|
||||
<text>¥</text>
|
||||
<text>{{item.wareOriginalPrice}} </text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-p-l-16 color-333 no-wrap" v-if="item.id">
|
||||
数量:{{item.num}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="refund" v-if="item.status=='退款中'">已申请退款,需等待商家审核</view>
|
||||
<view class="shop-box">
|
||||
<view class="u-flex u-row-center u-flex-col u-col-center" v-if="item.status=='待核销'||item.status=='退款中'">
|
||||
<up-qrcode :val="item.verifyCode" :size="104"></up-qrcode>
|
||||
<view class="u-flex u-m-t-22 u-m-b-18 u-col-center">
|
||||
<text>{{item.verifyCode}}</text>
|
||||
<image @click="copyText(item.verifyCode)" class="copy" src="/groupBuying/static/image/copy.png">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="shop ">
|
||||
<view class="u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">可核销门店:</text>
|
||||
<text>{{item.shopName}}</text>
|
||||
</view>
|
||||
<view class="u-m-t-32 u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">门店地址:</text>
|
||||
<text>{{item.shopAddress}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="members" v-if="item.status!='已退款'">
|
||||
<view class="list" v-if="item.users&&item.users.length">
|
||||
<view class="item" v-for="(user,index) in item.users" :key="index">
|
||||
<view class="box">
|
||||
<view class="u-flex relative">
|
||||
<up-avatar size="140rpx" :src="user.userAvatar"></up-avatar>
|
||||
<view class="u-flex u-row-center absolute">
|
||||
<text class="tuanzhang" v-if="index==0">团长</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="u-line-1 u-m-t-16 color-000 text-center">{{user.userName}}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="item" v-if="item.status=='待成团'">
|
||||
<view class="box">
|
||||
<view class="u-flex relative">
|
||||
<view class="add-box u-flex u-row-center">
|
||||
<up-icon color="#D9D9D9" name="plus"></up-icon>
|
||||
<button open-type="share" class="share" @click="share(item)">分享</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-line-1 u-m-t-16 color-000 text-center">等待参团</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-center" v-if="item.wareGroupStatus=='ing'&&!item.id">
|
||||
<view class="pin-btn" @click="fastBuy">立即参与拼团</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="item.id">
|
||||
<view class="order">
|
||||
<view class="u-flex u-row-between">
|
||||
<view class="font-bold u-font-32">订单信息</view>
|
||||
|
||||
<view class="u-flex color-666" @click="showOrder=!showOrder" style="align-items: baseline;">
|
||||
<text class="u-m-r-18">{{showOrder?'收起':'展开'}}</text>
|
||||
<view class="guodu" :class="{rotate:!showOrder}">
|
||||
<up-icon name="arrow-down" bold></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-t-16" v-if="showOrder">
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">商品总额</view>
|
||||
<view class="">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">实付金额</view>
|
||||
<view class="">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">订单号</view>
|
||||
<view class="">{{item.orderNo}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">支付时间</view>
|
||||
<view class="">{{item.payTime}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item"
|
||||
v-if="item.groupEndTime&&item.wareGroupStatus=='success'">
|
||||
<view class="color-666">成团时间</view>
|
||||
<view class="">{{item.groupEndTime}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item" v-if="item.verifyTime">
|
||||
<view class="color-666">核销时间</view>
|
||||
<view class="">{{item.verifyTime}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
</view>
|
||||
<view style="height: 100px;"></view>
|
||||
<view class="btns" v-if="item.id">
|
||||
<template v-if="item.status=='待成团'">
|
||||
<view class="btn" @click="refund(item)" v-if="canRefund(item)">申请退款</view>
|
||||
<button open-type="share" class="btn main" @click="share(item)">邀请好友</button>
|
||||
</template>
|
||||
<template v-if="item.status=='待核销'">
|
||||
<view class="btn" @click="refund(item)" v-if="canRefund(item)">申请退款</view>
|
||||
</template>
|
||||
<template v-if="item.status=='退款中'">
|
||||
<view class="btn" @click="cancelRefund(item)">取消退款</view>
|
||||
</template>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- 需要支付的弹窗 -->
|
||||
<up-popup :show="popupData.show" mode="bottom" closeOnClickOverlay @close="popupData.show = false">
|
||||
<view class="popup-content">
|
||||
<view class="popup-content-top u-flex u-row-right">
|
||||
<up-icon name="close" bold="" @click="popupData.show = false"></up-icon>
|
||||
</view>
|
||||
<view class="goods-info" v-if="item&&item.wareJson">
|
||||
<view class="u-flex">
|
||||
<image class="cover" :src="item.goodsImg"></image>
|
||||
<view class="u-flex u-flex-1 u-row-between u-p-l-16 u-col-center">
|
||||
<view style="max-width: 340rpx;">
|
||||
<view class="u-font-32 font-bold u-line-1" v-if="item && item.wareJson">
|
||||
{{item.wareJson.wareName}}</view>
|
||||
|
||||
<view class="u-m-t-12 color-666 u-line-2">{{item.wareJson.wareDetail}}</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="price">¥{{item.wareGroupPrice}}</view>
|
||||
<view class="old-price">¥{{item.wareOriginalPrice}}</view>
|
||||
<view class="limitBuyNum" v-if="item.wareJson.limitBuyNum">
|
||||
限购{{item.wareJson.limitBuyNum}} </view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="popup-content-bottom u-flex u-row-between u-col-center">
|
||||
<view class="u-flex u-col-baseline">
|
||||
<text class="color-666">合计:</text>
|
||||
<text class=" price">{{totalPrice}}</text>
|
||||
</view>
|
||||
<view class="u-flex">
|
||||
<up-icon name="minus-circle" size="20" color="#666" @click="changeNumber('-')"></up-icon>
|
||||
<text class="u-m-l-20 u-m-r-20">{{number}}</text>
|
||||
<up-icon name="plus-circle-fill" size="20" color="#ED5A2E" @click="changeNumber('+')"></up-icon>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-42 u-flex u-row-center">
|
||||
<view class="btn" @click="payExchange">去支付</view>
|
||||
</view>
|
||||
</view>
|
||||
</up-popup>
|
||||
<!-- 兑换确认弹窗end -->
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
Storelogin
|
||||
} from '@/stores/user.js';
|
||||
const storelogin = Storelogin();
|
||||
import {
|
||||
back
|
||||
} from '@/utils/uniapp.js'
|
||||
import statusVue from '@/groupBuying/components/status.vue'
|
||||
import * as Api from '@/common/api/order/gbOrder.js'
|
||||
import {
|
||||
wxShare
|
||||
} from '@/utils/share.js'
|
||||
import {
|
||||
computed,
|
||||
reactive
|
||||
} from 'vue'
|
||||
import {
|
||||
getRemainingHMS
|
||||
} from '@/utils/countdown.js'
|
||||
|
||||
const imgs = {
|
||||
bg: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/d21f2dfd7bec44618f2d5e4b88372b08.png',
|
||||
pin: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/3947892924dd481782331513aff00eb3.png'
|
||||
}
|
||||
const popupData = reactive({
|
||||
show: false,
|
||||
item: null
|
||||
});
|
||||
|
||||
const number = ref(1)
|
||||
|
||||
import {
|
||||
BigNumber
|
||||
} from "bignumber.js";
|
||||
const totalPrice = computed(() => {
|
||||
if (!item.wareGroupPrice) {
|
||||
return 0;
|
||||
}
|
||||
return BigNumber(number.value).times(item.wareGroupPrice).toNumber()
|
||||
})
|
||||
|
||||
function changeNumber(step) {
|
||||
if (step === '-') {
|
||||
if (number.value == 1) {
|
||||
return
|
||||
}
|
||||
number.value--
|
||||
return
|
||||
}
|
||||
if (step === '+') {
|
||||
if (item.wareJson.limitBuyNum == -10086) {
|
||||
number.value++
|
||||
return
|
||||
}
|
||||
if (number.value >= item.wareJson.limitBuyNum) {
|
||||
return uni.showToast({
|
||||
title: '最多可购买' + item.wareJson.limitBuyNum + '份',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
number.value++
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
function fastBuy() {
|
||||
popupData.show = true
|
||||
}
|
||||
|
||||
async function payExchange() {
|
||||
uni.setStorageSync('group_buying_order', {
|
||||
...item,
|
||||
...item.wareJson,
|
||||
number: number.value,
|
||||
id: item.wareId || '',
|
||||
originalPrice: item.wareOriginalPrice,
|
||||
groupPrice: item.wareGroupPrice,
|
||||
wareImgs: item.wareJson.wareImgs.join(','),
|
||||
groupOrderNo: item.groupOrderNo || '',
|
||||
})
|
||||
uni.navigateTo({
|
||||
url: '/groupBuying/confirm-order/confirm-order'
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
const canRefundStatus = ['待成团', '待核销']
|
||||
|
||||
function canRefund(item) {
|
||||
if (canRefundStatus.includes(item.status)) {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
const topStyle = {
|
||||
backgroundImage: 'url(' + imgs.bg + ')'
|
||||
}
|
||||
const showOrder = ref(true)
|
||||
|
||||
function copyText(text) {
|
||||
uni.setClipboardData({
|
||||
data: text,
|
||||
success() {}
|
||||
})
|
||||
}
|
||||
const query = reactive({
|
||||
shopId: '',
|
||||
detailId: '',
|
||||
})
|
||||
|
||||
async function init(opt) {
|
||||
// 获取小程序进入场景和参数
|
||||
const launchOptions = uni.getLaunchOptionsSync();
|
||||
console.log(launchOptions);
|
||||
// 获取链接上的参数
|
||||
const launchOptionsQuery = launchOptions.query;
|
||||
console.log('launchOptionsQuery', launchOptionsQuery);
|
||||
Object.assign(query, launchOptionsQuery)
|
||||
console.log(opt)
|
||||
Object.assign(query, opt)
|
||||
console.log(query)
|
||||
await storelogin.actionslogin()
|
||||
getDetail()
|
||||
}
|
||||
const item = reactive({})
|
||||
|
||||
function getDetail() {
|
||||
Api.recordDetail(query).then(res => {
|
||||
console.log('getDetail',res)
|
||||
const wareJson = JSON.parse(res.wareJson)
|
||||
wareJson.wareImgs = wareJson.wareImgs.split(',').filter(v => v)
|
||||
res.wareJson = wareJson;
|
||||
res.goodsImg = wareJson.wareImgs[0];
|
||||
Object.assign(item, res)
|
||||
console.log('item', item)
|
||||
uni.cache.set('shopId', item.shopId)
|
||||
if (!item.id && item.wareGroupStatus != 'ing') {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '拼团已结束',
|
||||
showCancel: false,
|
||||
success() {
|
||||
uni.redirectTo({
|
||||
url: '/groupBuying/index/index',
|
||||
})
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
})
|
||||
}
|
||||
onLoad(init)
|
||||
|
||||
let timer = null
|
||||
let nowTime = ref(Date.now())
|
||||
timer = setInterval(() => {
|
||||
nowTime.value = Date.now()
|
||||
}, 1000)
|
||||
|
||||
const returnTime = computed(() => {
|
||||
nowTime.value
|
||||
return getRemainingHMS(item)
|
||||
})
|
||||
|
||||
function returnNum(index) {
|
||||
return returnTime.value.split(':')[index]
|
||||
}
|
||||
|
||||
|
||||
function refund(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否申请退款?',
|
||||
showCancel: true,
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
Api.applyRefund({
|
||||
recordId: item.id,
|
||||
orderNo: item.orderNo,
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '申请成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
getDetail()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function cancelRefund(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否取消退款?',
|
||||
showCancel: true,
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
Api.cancelRefund({
|
||||
recordId: item.id,
|
||||
orderNo: item.orderNo,
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '取消成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
getDetail()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
let shareItem = null
|
||||
|
||||
function share(item) {
|
||||
shareItem = item
|
||||
}
|
||||
onShareAppMessage(() => {
|
||||
console.log('onShareAppMessage')
|
||||
console.log(shareItem)
|
||||
const query = `groupOrderNo=${shareItem.groupOrderNo}&shopId=${shareItem.shopId}`
|
||||
return wxShare({
|
||||
title: shareItem.wareJson.wareName,
|
||||
imageUrl: shareItem.goodsImg,
|
||||
path: '/groupBuying/detail/index' + '?' + query,
|
||||
query,
|
||||
})
|
||||
})
|
||||
|
||||
const title=computed(()=>{
|
||||
if(!item.id&&item.wareGroupStatus=='ing'){
|
||||
return '拼团特惠'
|
||||
}
|
||||
return '订单详情'
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.top {
|
||||
height: 422rpx;
|
||||
background-size: cover;
|
||||
|
||||
.info {
|
||||
padding: 32rpx 30rpx 0 30rpx;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bottom {
|
||||
margin: 0 28rpx;
|
||||
transform: translateY(-160rpx);
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.time {
|
||||
padding: 18rpx 24rpx;
|
||||
background: #FFF4E2;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
|
||||
.number {
|
||||
padding: 6rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #ED5A2E;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
margin-left: 18rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
|
||||
.gap {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goods {
|
||||
background-color: #fff;
|
||||
padding: 22rpx 24rpx;
|
||||
|
||||
.pin {
|
||||
width: 60rpx;
|
||||
height: 38rpx;
|
||||
}
|
||||
|
||||
.tuan-members {
|
||||
padding: 0 16rpx 0 0;
|
||||
border-radius: 0 6rpx 6rpx 0;
|
||||
background: #4C2828;
|
||||
color: #f5d9ad;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
color: #666666;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
}
|
||||
|
||||
.u-font-48 {
|
||||
font-size: 48rpx;
|
||||
}
|
||||
|
||||
.shop-box {
|
||||
background: #fff;
|
||||
padding: 32rpx 30rpx 28rpx 30rpx;
|
||||
border-radius: 0 0 16rpx 16rpx;
|
||||
}
|
||||
|
||||
.copy {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-left: 22rpx;
|
||||
}
|
||||
|
||||
.shop {
|
||||
border-radius: 8rpx;
|
||||
background: #F8F8F8;
|
||||
padding: 16rpx 34rpx;
|
||||
}
|
||||
|
||||
.relative {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.members {
|
||||
padding: 26rpx 24rpx;
|
||||
border-radius: 16rpx;
|
||||
margin-top: 32rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.item {
|
||||
width: calc(100% / 3);
|
||||
display: flex;
|
||||
margin-bottom: 32rpx;
|
||||
|
||||
.add-box {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border: 2rpx dashed #D9D9D9;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.share {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:nth-of-type(3n-1) {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.absolute {
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.tuanzhang {
|
||||
padding: 8rpx 18rpx;
|
||||
border-radius: 20rpx;
|
||||
background: #ED5A2E;
|
||||
color: #fff;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order {
|
||||
padding: 32rpx 28rpx;
|
||||
border-radius: 16rpx;
|
||||
margin-top: 32rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
padding: 16rpx 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btns {
|
||||
position: fixed;
|
||||
left: 87rpx;
|
||||
right: 87rpx;
|
||||
bottom: 0;
|
||||
padding-bottom: 60rpx;
|
||||
display: flex;
|
||||
gap: 40rpx;
|
||||
|
||||
.btn {
|
||||
flex: 1;
|
||||
padding: 16rpx 28rpx;
|
||||
border-radius: 200rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
line-height: 1;
|
||||
margin: 0;
|
||||
justify-content: center;
|
||||
border: 2rpx solid #E8AD7B;
|
||||
background: #FFF;
|
||||
color: #E8AD7B;
|
||||
|
||||
&.main {
|
||||
background-color: #E8AD7B;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.guodu {
|
||||
transition: all .3s;
|
||||
}
|
||||
|
||||
.pin-btn {
|
||||
padding: 14rpx 60rpx;
|
||||
border-radius: 200rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
justify-content: center;
|
||||
border: 2rpx solid #E8AD7B;
|
||||
background: #E8AD7B;
|
||||
color: #fff;
|
||||
margin-top: 32rpx;
|
||||
}
|
||||
|
||||
.rotate {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
.refund {
|
||||
padding: 18rpx 164rpx;
|
||||
border-radius: 0 0 16rpx 16rpx;
|
||||
background: #FFF4E2;
|
||||
font-weight: 700;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
font-size: 28rpx;
|
||||
min-height: 300px;
|
||||
|
||||
.popup-content-top {
|
||||
padding: 32rpx 28rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
}
|
||||
|
||||
.goods-info {
|
||||
padding: 32rpx 28rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
|
||||
.cover {
|
||||
width: 184rpx;
|
||||
height: 184rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #d9d9d9;
|
||||
|
||||
&.bg-fff {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #ed5a2e;
|
||||
line-height: 46rpx;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
font-size: 32rpx;
|
||||
color: #999;
|
||||
text-decoration-line: line-through;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.limitBuyNum {
|
||||
color: #666;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.popup-content-bottom {
|
||||
padding: 20rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
padding: 22rpx 214rpx;
|
||||
align-items: flex-start;
|
||||
gap: 20rpx;
|
||||
border-radius: 66rpx;
|
||||
background: #e8ad7b;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
font-size: 700;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
696
groupBuying/goodsDetail/goodsDetail.vue
Normal file
696
groupBuying/goodsDetail/goodsDetail.vue
Normal file
@@ -0,0 +1,696 @@
|
||||
<template>
|
||||
<view class="color-333 u-font-28" v-if="item.id">
|
||||
<view class="relative">
|
||||
<up-swiper height="428rpx" :list="coverImgs" @click="prveImg"></up-swiper>
|
||||
<view class="share-box">
|
||||
分享
|
||||
<button class="share" open-type="share">分享</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="sku">
|
||||
<view class="u-flex u-col-center">
|
||||
<text class="price">¥{{item.groupPrice}}</text>
|
||||
<text class="old-price">¥{{item.originalPrice}}</text>
|
||||
</view>
|
||||
<view>
|
||||
<view class="u-m-t-16 text" v-if="item.limitBuyNum&&item.limitBuyNum!='-10086'"> 限购{{item.limitBuyNum}}份 </view>
|
||||
<view class="text u-m-t-10">已团:{{item.groupedNum||0}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods">
|
||||
<view class="goods-name">{{item.wareName}}</view>
|
||||
<view class="u-m-t-20 color-666">
|
||||
{{item.wareDetail}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-f7" style="height: 32rpx"></view>
|
||||
<view class="desc">
|
||||
<view class="u-flex">
|
||||
<view class="color-666 no-wrap" style="min-width: 180rpx;">可核销门店:</view>
|
||||
<view class="">{{item.shopName}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-16 u-col-baseline">
|
||||
<view class="color-666 no-wrap" style="min-width: 180rpx;">门店地址:</view>
|
||||
<view class="">{{item.shopAddress}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<template v-if="item.gbOrderList.length">
|
||||
<view class="bg-f7" style="height: 32rpx"></view>
|
||||
<view class="groups">
|
||||
<view class="color-000 u-m-b-28 u-font-32 font-700">立即拼团</view>
|
||||
<view class="item u-flex" v-for="(item,index) in item.gbOrderList" :key="index">
|
||||
<up-avatar size="76rpx" :src="item.avatar"></up-avatar>
|
||||
<view class="u-flex u-flex-1 u-p-l-22 u-col-center u-row-between">
|
||||
<view>立即购买购
|
||||
<view class="color-000 u-line-1" style="max-width: 180rpx;">{{item.nickName}}</view>
|
||||
<view class="main-color u-m-t-2">差{{returnNeedPerpole(item)}}人拼成</view>
|
||||
</view>
|
||||
<view class="u-m-t-22">
|
||||
<text class="color-666">剩余:</text>
|
||||
<text class="main-color">{{getRemainingHMS(item)}}</text>
|
||||
</view>
|
||||
|
||||
<view class="btn" @click="fastBuy(item)">快速拼成</view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<view class="bg-f7" style="height: 24rpx"></view>
|
||||
|
||||
<view class="goods-detail" v-if="item.goodsCategory!='优惠券'">
|
||||
<view class="u-flex u-row-center">
|
||||
<view class="title">商品详情</view>
|
||||
</view>
|
||||
<view class="u-m-t-32">
|
||||
<image class="w-full" v-for="(item,index) in item.wareCommentImgs" :key="index" mode="widthFix"
|
||||
:src="item">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="height: 140px"></view>
|
||||
<view class="fixed-bottom u-flex u-row-center">
|
||||
<view v-if="isCanExchange" class="btn" @click="exchangeClick">
|
||||
{{returnBtmText}}
|
||||
</view>
|
||||
<view class="btn gray" v-else>
|
||||
{{returnBtmText}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- 需要支付的弹窗 -->
|
||||
<up-popup :show="popupData.show" mode="bottom" closeOnClickOverlay @close="popupData.show = false">
|
||||
<view class="popup-content">
|
||||
<view class="popup-content-top u-flex u-row-right">
|
||||
<up-icon name="close" bold="" @click="popupData.show = false"></up-icon>
|
||||
</view>
|
||||
<view class="goods-info">
|
||||
<view class="u-flex">
|
||||
<image class="cover" :src="coverImgs[0]"></image>
|
||||
<view class="u-flex u-flex-1 u-row-between u-p-l-16 u-col-center">
|
||||
<view>
|
||||
<view class="u-font-32 font-bold">{{item.wareName}}</view>
|
||||
|
||||
<view class="u-m-t-12 color-666 u-line-2">{{item.wareDetail}}</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="price">¥{{item.groupPrice}}</view>
|
||||
<view class="old-price">¥{{item.originalPrice}}</view>
|
||||
<view class="limitBuyNum" v-if="item.limitBuyNum&&item.limitBuyNum!=-10086"> 限购{{item.limitBuyNum}} </view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="bottom u-flex u-row-between u-col-center">
|
||||
<view class="u-flex u-col-baseline">
|
||||
<text class="color-666">合计:</text>
|
||||
<text class=" price">{{totalPrice}}</text>
|
||||
</view>
|
||||
<view class="u-flex">
|
||||
<up-icon name="minus-circle" size="20" color="#666" @click="changeNumber('-')"></up-icon>
|
||||
<text class="u-m-l-20 u-m-r-20">{{number}}</text>
|
||||
<up-icon name="plus-circle-fill" size="20" color="#ED5A2E" @click="changeNumber('+')"></up-icon>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-42 u-flex u-row-center">
|
||||
<view class="btn" @click="payExchange">去支付</view>
|
||||
</view>
|
||||
</view>
|
||||
</up-popup>
|
||||
<!-- 兑换确认弹窗end -->
|
||||
</view>
|
||||
</template>
|
||||
<script setup>
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
watch
|
||||
} from "vue";
|
||||
import dayjs from "dayjs";
|
||||
import {wxShare} from '@/utils/share.js'
|
||||
import {
|
||||
getOpenId
|
||||
} from '@/utils/uniapp.js'
|
||||
import modal from "@/groupBuying/components/modal.vue";
|
||||
import * as Api from '@/common/api/order/gbOrder.js'
|
||||
import {
|
||||
pay
|
||||
} from '@/utils/pay.js'
|
||||
import {
|
||||
Storelogin
|
||||
} from '@/stores/user.js';
|
||||
const storelogin = Storelogin();
|
||||
|
||||
const imgs = {
|
||||
bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/9fd6a3ad2b384f6cb4e88ed6b77bd334.png",
|
||||
};
|
||||
const number = ref(1)
|
||||
|
||||
import {
|
||||
BigNumber
|
||||
} from "bignumber.js";
|
||||
const totalPrice = computed(() => {
|
||||
if (!item.groupPrice) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
return BigNumber(number.value).times(item.groupPrice).toNumber()
|
||||
})
|
||||
|
||||
function changeNumber(step) {
|
||||
if (step === '-') {
|
||||
if (number.value == 1) {
|
||||
return
|
||||
}
|
||||
number.value--
|
||||
return
|
||||
}
|
||||
if (step === '+') {
|
||||
if(item.limitBuyNum==-10086){
|
||||
number.value++
|
||||
return
|
||||
}
|
||||
if(number.value>=item.limitBuyNum){
|
||||
return uni.showToast({
|
||||
title:'最多可购买'+item.limitBuyNum+'份',
|
||||
icon:'none'
|
||||
})
|
||||
}
|
||||
number.value++
|
||||
return
|
||||
}
|
||||
}
|
||||
const modalData = reactive({
|
||||
show: false,
|
||||
});
|
||||
|
||||
function prveImg(index) {
|
||||
uni.previewImage({
|
||||
urls: coverImgs.value,
|
||||
current: index
|
||||
})
|
||||
}
|
||||
|
||||
const popupData = reactive({
|
||||
show: false,
|
||||
item: null
|
||||
});
|
||||
|
||||
function exchangeClick() {
|
||||
popupData.show = true
|
||||
|
||||
}
|
||||
|
||||
function fastBuy(item) {
|
||||
popupData.item = item;
|
||||
popupData.show = true
|
||||
}
|
||||
watch(() => popupData.show, (newval) => {
|
||||
if (!newval) {
|
||||
popupData.item = null
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
function dingyue() {
|
||||
return new Promise((revlove, reject) => {
|
||||
uni.requestSubscribeMessage({
|
||||
tmplIds: ['JGPAGmqcPEgWB6mvAl0SC5cMqr5H5Qjcim8JCpHAZd0',
|
||||
'F4OyUhe_ZQ9BR731jlkaN2QXAUaA3HBZuUeVPfraSz0'
|
||||
],
|
||||
success(res) {},
|
||||
complete() {
|
||||
revlove()
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
async function payExchange() {
|
||||
uni.setStorageSync('group_buying_order', {
|
||||
...item,
|
||||
number: number.value,
|
||||
groupOrderNo: popupData.item ? popupData.item.groupOrderNo : '',
|
||||
})
|
||||
uni.navigateTo({
|
||||
url: '/groupBuying/confirm-order/confirm-order'
|
||||
})
|
||||
return
|
||||
await dingyue();
|
||||
uni.showLoading({
|
||||
title: '支付中……'
|
||||
})
|
||||
const openId = await getOpenId()
|
||||
uni.hideLoading()
|
||||
if (openId) {
|
||||
Api.exchange({
|
||||
paramId: item.id,
|
||||
shopId: item.shopId,
|
||||
number: number.value,
|
||||
groupOrderNo: popupData.item ? popupData.item.groupOrderNo : '',
|
||||
openId
|
||||
}).then(orderRes => {
|
||||
popupData.show = false;
|
||||
pay(orderRes.payInfo).then(res => {
|
||||
console.log(res)
|
||||
|
||||
if (res) {
|
||||
uni.redirectTo({
|
||||
url: '/groupBuying/success/index?detailId=' + orderRes.record
|
||||
.id
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '开团失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '鉴权失败,兑换失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const item = reactive({
|
||||
goodsDescription: []
|
||||
})
|
||||
|
||||
const isCanExchange = computed(() => {
|
||||
|
||||
if (item.quantity <= 0) {
|
||||
return false
|
||||
}
|
||||
if (item.limitQuota && item.boughtCount >= item.limitQuota) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
})
|
||||
|
||||
const returnBtmText = computed(() => {
|
||||
if (isCanExchange.value) {
|
||||
return '立即开团'
|
||||
}
|
||||
if (pointsUser.pointBalance < item.requiredPoints) {
|
||||
const num = item.requiredPoints - pointsUser.pointBalance
|
||||
return `积分不足,还差${num}积分`
|
||||
}
|
||||
if (item.quantity <= 0) {
|
||||
return `库存不足`
|
||||
}
|
||||
if (item.limitQuota && item.boughtCount >= item.limitQuota) {
|
||||
return `单人兑换已达上限`
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
const query = reactive({
|
||||
shopId: '',
|
||||
wareId: '',
|
||||
groupOrderNo: ''
|
||||
})
|
||||
|
||||
|
||||
const coverImgs = ref([])
|
||||
|
||||
async function init(opt) {
|
||||
// 获取小程序进入场景和参数
|
||||
const launchOptions = uni.getLaunchOptionsSync();
|
||||
console.log(launchOptions);
|
||||
// 获取链接上的参数
|
||||
const launchOptionsQuery = launchOptions.query;
|
||||
console.log('launchOptionsQuery', launchOptionsQuery);
|
||||
Object.assign(query, launchOptionsQuery)
|
||||
console.log(opt)
|
||||
Object.assign(query, opt)
|
||||
console.log(query)
|
||||
await storelogin.actionslogin()
|
||||
getDetail()
|
||||
}
|
||||
|
||||
function getDetail() {
|
||||
Api.wareDetail(query).then(res => {
|
||||
res.wareCommentImgs = res.wareCommentImgs.split(',').filter(v => v)
|
||||
Object.assign(item, res)
|
||||
console.log(item)
|
||||
coverImgs.value = res.wareImgs.split(',')
|
||||
uni.cache.set('shopId',item.shopId)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 计算剩余时间差(毫秒)
|
||||
* @param {Object} item - 包含groupEndTime的订单/拼团对象
|
||||
* @returns {number} 剩余时间(毫秒)
|
||||
*/
|
||||
function returnRemainingTime(item) {
|
||||
if (!item?.groupEndTime) return 0; // 容错:无结束时间则返回0
|
||||
return dayjs(item.groupEndTime).valueOf() - dayjs().valueOf();
|
||||
}
|
||||
|
||||
/**
|
||||
* 将毫秒差格式化为 HH:MM:SS(最多72小时)
|
||||
* @param {number} ms - 时间差(毫秒)
|
||||
* @returns {string} 格式化后的时分秒(如 09:09:09、72:00:00、00:00:00)
|
||||
*/
|
||||
function formatTimeToHMS(ms) {
|
||||
// 边界1:已过期/无剩余时间 → 显示00:00:00
|
||||
if (ms <= 0) return '00:00:00';
|
||||
|
||||
// 边界2:超过72小时 → 按72小时算(72*60*60*1000 = 259200000毫秒)
|
||||
const maxMs = 72 * 60 * 60 * 1000;
|
||||
const validMs = Math.min(ms, maxMs);
|
||||
|
||||
// 转换为总秒数(取整,避免小数)
|
||||
const totalSeconds = Math.floor(validMs / 1000);
|
||||
|
||||
// 拆解小时、分钟、秒
|
||||
const hours = Math.floor(totalSeconds / 3600);
|
||||
const remainingSeconds = totalSeconds % 3600;
|
||||
const minutes = Math.floor(remainingSeconds / 60);
|
||||
const seconds = remainingSeconds % 60;
|
||||
|
||||
// 补零(确保两位数,如 9 → 09)
|
||||
const pad = (num) => String(num).padStart(2, '0');
|
||||
return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`;
|
||||
}
|
||||
|
||||
|
||||
let timer = null
|
||||
let nowTime = ref(Date.now())
|
||||
timer = setInterval(() => {
|
||||
nowTime.value = Date.now()
|
||||
}, 1000)
|
||||
|
||||
// 组合使用:获取格式化后的剩余时间
|
||||
function getRemainingHMS(item) {
|
||||
nowTime.value
|
||||
const ms = returnRemainingTime(item);
|
||||
return formatTimeToHMS(ms);
|
||||
}
|
||||
|
||||
|
||||
function returnNeedPerpole(data) {
|
||||
return data.groupPeopleNum - data.currentPeopleNum
|
||||
}
|
||||
|
||||
|
||||
onLoad(init)
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.showShareMenu()
|
||||
// #endif
|
||||
onShareAppMessage(() => {
|
||||
|
||||
const query = `wareId=${item.id}&shopId=${item.shopId}`
|
||||
return wxShare({
|
||||
title: item.wareName,
|
||||
imageUrl: coverImgs.value[0],
|
||||
path: '/groupBuying/goodsDetail/goodsDetail' + '?' + query,
|
||||
query,
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$topHeight: 350rpx;
|
||||
|
||||
.top-img {
|
||||
width: 750rpx;
|
||||
height: $topHeight;
|
||||
}
|
||||
|
||||
.top {
|
||||
margin: 14rpx 18rpx;
|
||||
background-size: cover;
|
||||
height: $topHeight;
|
||||
box-sizing: border-box;
|
||||
padding-left: 70rpx;
|
||||
padding-top: 95rpx;
|
||||
|
||||
.name {
|
||||
color: #000000;
|
||||
font-size: 36rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.info {
|
||||
color: #333333;
|
||||
font-size: 48rpx;
|
||||
font-weight: 700;
|
||||
margin-top: 62rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sku {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 36rpx;
|
||||
align-items: center;
|
||||
background: linear-gradient(90deg, #ff4a63 0%, #fd1f48 100%);
|
||||
|
||||
.price {
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
margin-left: 16rpx;
|
||||
color: #E7E7E7;
|
||||
opacity: .85;
|
||||
font-weight: 700;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goods {
|
||||
padding: 20rpx 28rpx;
|
||||
background: #fff;
|
||||
|
||||
.goods-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.desc {
|
||||
padding: 32rpx 28rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.goods-detail {
|
||||
padding: 32rpx;
|
||||
|
||||
.title {
|
||||
position: relative;
|
||||
padding: 0 22rpx;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 100%;
|
||||
width: 70rpx;
|
||||
height: 2rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
background: linear-gradient(90deg, #f7f8f9 0%, #c9cbcc 100%);
|
||||
}
|
||||
|
||||
&::after {
|
||||
left: 100%;
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
display: block;
|
||||
width: 70rpx;
|
||||
height: 2rpx;
|
||||
background: linear-gradient(90deg, #c9cbcc 0%, #f7f8f9 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixed-bottom {
|
||||
position: fixed;
|
||||
background-color: #fff;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding-bottom: 30px;
|
||||
padding-top: 32rpx;
|
||||
background-color: #fff;
|
||||
bottom: 0;
|
||||
z-index: 10;
|
||||
|
||||
|
||||
.btn {
|
||||
padding: 22rpx;
|
||||
border-radius: 200rpx;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
width: 556rpx;
|
||||
text-align: center;
|
||||
background-color: #E8AD7B;
|
||||
|
||||
&.gray {
|
||||
background: #9999992b;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.waring {
|
||||
background-color: rgba(255, 204, 0, 0.09);
|
||||
padding: 32rpx 24rpx;
|
||||
color: #ff8d28;
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
font-size: 28rpx;
|
||||
min-height: 300px;
|
||||
|
||||
.popup-content-top {
|
||||
padding: 32rpx 28rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
}
|
||||
|
||||
.goods-info {
|
||||
padding: 32rpx 28rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
|
||||
.cover {
|
||||
width: 184rpx;
|
||||
height: 184rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #d9d9d9;
|
||||
|
||||
&.bg-fff {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #ed5a2e;
|
||||
line-height: 46rpx;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
font-size: 32rpx;
|
||||
color: #999;
|
||||
text-decoration-line: line-through;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.limitBuyNum {
|
||||
color: #666;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bottom {
|
||||
padding: 20rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
padding: 22rpx 214rpx;
|
||||
align-items: flex-start;
|
||||
gap: 20rpx;
|
||||
border-radius: 66rpx;
|
||||
background: #e8ad7b;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
font-size: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.groups {
|
||||
padding: 28rpx 22rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
padding: 28rpx 0;
|
||||
border-bottom: 2rpx solid #EDEDED;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.main-color {
|
||||
color: #ed5a2e;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 8rpx 26rpx;
|
||||
border-radius: 36rpx;
|
||||
background: #E8AD7B;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.share-box{
|
||||
top: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
padding: 4rpx 30rpx;
|
||||
border-radius: 0 0 0 24rpx;
|
||||
color: #ed5a2e; font-weight: 700;
|
||||
background: #FFF;
|
||||
overflow: hidden;
|
||||
.share{
|
||||
position: absolute;
|
||||
left:0;
|
||||
right: 0;
|
||||
top:0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
25
groupBuying/index/components/perpole-number.vue
Normal file
25
groupBuying/index/components/perpole-number.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
|
||||
<view class="u-flex box">
|
||||
<text class="color-333" v-if="modelValue">modelValue</text>
|
||||
<text v-else class="color-999">成团人数</text>
|
||||
<view class="u-flex u-m-l-20">
|
||||
<up-icon name="arrow-down" color="#999" size="14"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
const modelValue=defineModel({
|
||||
default:''
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.box{
|
||||
padding: 12rpx 24rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #DDDFE6;
|
||||
}
|
||||
</style>
|
||||
@@ -1,54 +1,72 @@
|
||||
<template>
|
||||
<view class="min-page bg-f7 u-font-28">
|
||||
<up-navbar bg-color="transparent" :placeholder="false" title="拼团特惠" left-icon-color="#fff"
|
||||
title-color="#fff"></up-navbar>
|
||||
<view class="top" :style="topStyle">
|
||||
<view class="u-flex info u-col-center">
|
||||
<image :src="imgs.map" class="map"></image>
|
||||
<view class="u-line-1 u-m-l-20">这里是店铺名称</view>
|
||||
<up-sticky :offsetTop="0" :customNavHeight="0">
|
||||
<view class="top" :style="topStyle">
|
||||
<up-navbar bg-color="transparent" :fixed="false" :placeholder="false" title="拼团特惠" @leftClick="back()"
|
||||
left-icon-color="#fff" title-color="#fff"></up-navbar>
|
||||
<view class="u-flex info u-col-center">
|
||||
<image :src="imgs.map" class="map"></image>
|
||||
<view class="u-line-1 u-m-l-20">{{shopInfo.shopName||''}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="steps">
|
||||
<view class="step" v-for="(item,index) in steps" :key="index">
|
||||
<text class="index">{{index+1}}</text>
|
||||
<text class="text">{{item}}</text>
|
||||
<template v-if="index<steps.length-1">
|
||||
<text class="icon">
|
||||
{{'>'}}
|
||||
</text>
|
||||
<text class="icon icon1">
|
||||
{{'>'}}
|
||||
</text>
|
||||
</template>
|
||||
<view class="translateY20">
|
||||
<view class="steps">
|
||||
<view class="step" v-for="(item,index) in steps" :key="index">
|
||||
<text class="index">{{index+1}}</text>
|
||||
<text class="text">{{item}}</text>
|
||||
<template v-if="index<steps.length-1">
|
||||
<text class="icon">
|
||||
{{'>'}}
|
||||
</text>
|
||||
<text class="icon icon1">
|
||||
{{'>'}}
|
||||
</text>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
<view class="filters ">
|
||||
<view class="u-flex tabs">
|
||||
<view class="tab" v-for="(item,index) in tabs.list" :class="{'active':tabs.sel==index}"
|
||||
@click="tabs.sel=index">{{item}}</view>
|
||||
</view>
|
||||
|
||||
<view class="u-flex u-col-center" v-if="tabs.sel==0">
|
||||
<up-search v-model="query.wareName" @search="refresh" @clear="refresh"
|
||||
@custom="refresh"></up-search>
|
||||
<!-- <perpoleNumber v-model="query.groupPeopleNum"></perpoleNumber> -->
|
||||
</view>
|
||||
<view class="u-flex orderStatus" v-if="tabs.sel==1">
|
||||
<view class="orderState" :class="{'active':orders.sel==index}"
|
||||
v-for="(item,index) in orders.list" :key="index" @click="orders.sel=index">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="step"></view>
|
||||
<view class="step"></view>
|
||||
</view>
|
||||
|
||||
<up-sticky>
|
||||
<view class="filters"></view>
|
||||
|
||||
|
||||
</up-sticky>
|
||||
|
||||
<view class="lists">
|
||||
<view class="item" v-for="(item,index) in 10" :key="index">
|
||||
|
||||
<up-image width="218rpx" radius="16rpx" height="218rpx"></up-image>
|
||||
<view class="lists" v-if="tabs.sel==0">
|
||||
<view class="item" v-for="(item,index) in list" :key="index" @click="toDetail(item)">
|
||||
|
||||
<up-image width="218rpx" radius="16rpx" height="218rpx" :src="returnCoverImg(item)"></up-image>
|
||||
<view class="u-flex-1 u-p-l-16">
|
||||
<view class="u-flex u-col-center">
|
||||
<text class="numbers">3人团</text>
|
||||
<text class="u-line-1 font-bold u-m-l-18 name">这里是商品名称啊啊嗷嗷啊啊</text>
|
||||
<text class="numbers">{{item.groupPeopleNum}}人团</text>
|
||||
<text class="u-line-1 font-bold u-m-l-18 name">{{item.wareName}}</text>
|
||||
</view>
|
||||
<view class="members">已团:9999</view>
|
||||
<view class="members">已团:{{item.groupedNum}}</view>
|
||||
<view class="info">
|
||||
<view class="left">
|
||||
<view class="">
|
||||
<text class="u-font-24">拼团到手</text>
|
||||
<text class="u-font-32 font-bold"> ¥333</text>
|
||||
<text class="u-font-32 font-bold"> ¥{{item.groupPrice}}</text>
|
||||
</view>
|
||||
<view style="opacity: 0.84;">
|
||||
<view style="opacity: 0.84;">
|
||||
<text class="u-font-24">原价</text>
|
||||
<text class=""> ¥333</text>
|
||||
<text class=""> ¥{{item.originalPrice}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
@@ -58,22 +76,368 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="orders" v-else-if="tabs.sel==1">
|
||||
<view class="item" v-for="(item,index) in list" :key="index" @click="toOrderDetail(item)">
|
||||
<view class="u-flex u-col-center u-row-between">
|
||||
<text class="numbers">{{item.groupPeopleNum}}人团</text>
|
||||
<statusVue :status="item.status"></statusVue>
|
||||
</view>
|
||||
<view class="u-m-t-32 u-flex">
|
||||
<up-image width="154rpx" height="154rpx" :src="item.goodsImg"></up-image>
|
||||
<view class="u-flex-1 u-flex u-p-l-30 u-col-center u-row-between">
|
||||
<view>
|
||||
<view class="">{{item.wareJson.wareName}}</view>
|
||||
<view class="u-m-t-34 price">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<text class="u-font-40 font-bold">x{{item.num}}</text>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
<view class="u-m-t-32 info">
|
||||
<view class="u-flex u-col-center">
|
||||
<text class="title">可核销门店:</text>
|
||||
<text class="stitle">{{item.shopName}}</text>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-32 u-col-center">
|
||||
<text class="title ">门店地址:</text>
|
||||
<text class="stitle">{{item.shopAddress}}</text>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-32 u-col-center" v-if="item.groupEndTime&&item.wareGroupStatus=='success'">
|
||||
<text class="title">成团时间:</text>
|
||||
<text class="stitle ">{{item.groupEndTime}}</text>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-32 u-col-center" v-if="showTime(item)">
|
||||
<text class="title">剩余成团时间:</text>
|
||||
<text class="stitle price">{{returnTime(item)}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btns" v-if="showBtns(item)">
|
||||
<template v-if="item.status=='待核销'">
|
||||
<view class="btn " @click.stop="lookCode(item)">查看券码</view>
|
||||
<button class="btn black" @click.stop="refund(item)">申请退款</button>
|
||||
</template>
|
||||
<template v-else-if="item.status=='退款中'">
|
||||
<view class="btn " @click.stop="lookCode(item)">查看券码</view>
|
||||
<view class="btn black" @click.stop="cancelRefund(item)">取消退款</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view class="btn " @click.stop="refund(item)" v-if="canRefund(item)">申请退款</view>
|
||||
<button open-type="share" class="btn black" @click.stop="share(item)"
|
||||
v-if="showShare(item)">邀请好友</button>
|
||||
</template>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<LookQrcode v-model="modalData.show" :qrcode="qrcode"></LookQrcode>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
APIusershopInfodetail
|
||||
} from '@/common/api/member.js'
|
||||
import {
|
||||
back
|
||||
} from '@/utils/uniapp.js'
|
||||
import LookQrcode from "@/components/look-qrcode/look-qrcode.vue";
|
||||
import {
|
||||
wxShare
|
||||
} from '@/utils/share.js'
|
||||
import {
|
||||
getRemainingHMS
|
||||
} from '@/utils/countdown.js'
|
||||
import {
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import * as Api from '@/common/api/order/gbOrder.js'
|
||||
import perpoleNumber from './components/perpole-number.vue'
|
||||
import statusVue from '@/groupBuying/components/status.vue'
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
watch
|
||||
} from 'vue'
|
||||
|
||||
const canRefundStatus = ['待成团', '待核销']
|
||||
|
||||
function canRefund(item) {
|
||||
if (canRefundStatus.includes(item.status)) {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
const modalData = reactive({
|
||||
show: false,
|
||||
});
|
||||
const qrcode = ref("");
|
||||
|
||||
function lookCode(item) {
|
||||
qrcode.value = item.verifyCode
|
||||
modalData.show = true;
|
||||
}
|
||||
|
||||
const imgs = {
|
||||
bg: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/d21f2dfd7bec44618f2d5e4b88372b08.png',
|
||||
bg1: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/604c3f917daa41af9239145196c6d3f3.png',
|
||||
map: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/0a293f6e1a6a4e7b956379a5b6701104.png',
|
||||
pin:'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/a9a4f8f59a6d4a46abf91141df3531fb.png'
|
||||
pin: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/3/4bcce5bdfa074f2a838a0209fac24241.png'
|
||||
}
|
||||
|
||||
const shopInfo = ref({})
|
||||
|
||||
const steps = ['发起拼团', '邀请好友', '成团优惠']
|
||||
|
||||
const topStyle = {
|
||||
backgroundImage: 'url(' + imgs.bg + ')'
|
||||
}
|
||||
const tabs = reactive({
|
||||
list: ['活动列表', '我的拼团'],
|
||||
sel: 0
|
||||
})
|
||||
const orders = reactive({
|
||||
list: [{
|
||||
name: '全部',
|
||||
value: ''
|
||||
},
|
||||
{
|
||||
name: '待成团',
|
||||
value: '待成团'
|
||||
},
|
||||
{
|
||||
name: '待核销',
|
||||
value: '待核销'
|
||||
},
|
||||
{
|
||||
name: '已核销',
|
||||
value: '已核销'
|
||||
},
|
||||
{
|
||||
name: '退款',
|
||||
value: '退款'
|
||||
},
|
||||
],
|
||||
sel: 0
|
||||
})
|
||||
|
||||
const query = reactive({
|
||||
page: 1,
|
||||
size: 10,
|
||||
wareName: '',
|
||||
groupPeopleNum: '',
|
||||
shopId: uni.cache.get('shopId'),
|
||||
})
|
||||
|
||||
const list = ref([])
|
||||
const isEnd = ref(false)
|
||||
|
||||
const status = computed(() => {
|
||||
return orders.list[orders.sel].value
|
||||
})
|
||||
|
||||
watch(() => status.value, () => {
|
||||
refresh()
|
||||
})
|
||||
|
||||
function getData() {
|
||||
if (tabs.sel == 0) {
|
||||
Api.warePage(query).then(res => {
|
||||
const newArr = res.records || []
|
||||
if (query.page == 1) {
|
||||
list.value = newArr
|
||||
} else {
|
||||
list.value.push(...newArr)
|
||||
}
|
||||
isEnd.value = query.page >= res.totalPage * 1 ? true : false
|
||||
})
|
||||
return
|
||||
}
|
||||
if (tabs.sel == 1) {
|
||||
const {
|
||||
page,
|
||||
size,
|
||||
shopId
|
||||
} = query
|
||||
Api.record({
|
||||
page,
|
||||
size,
|
||||
shopId,
|
||||
status: status.value,
|
||||
}).then(res => {
|
||||
const newArr = (res.records || []).map(v => {
|
||||
const wareJson = JSON.parse(v.wareJson)
|
||||
wareJson.wareImgs = wareJson.wareImgs.split(',').filter(v => v)
|
||||
return {
|
||||
...v,
|
||||
goodsImg: wareJson.wareImgs[0],
|
||||
wareJson,
|
||||
}
|
||||
})
|
||||
|
||||
if (query.page == 1) {
|
||||
list.value = newArr
|
||||
} else {
|
||||
list.value.push(...newArr)
|
||||
}
|
||||
console.log(list.value)
|
||||
isEnd.value = query.page >= res.totalPage * 1 ? true : false
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
function toDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: '/groupBuying/goodsDetail/goodsDetail?wareId=' + item.id + '&shopId=' + item.shopId
|
||||
})
|
||||
}
|
||||
|
||||
function toOrderDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: '/groupBuying/detail/index?detailId=' + item.id + '&shopId=' + item.shopId
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function returnCoverImg(item) {
|
||||
if (!item.wareImgs) {
|
||||
return ''
|
||||
}
|
||||
const arr = item.wareImgs.split(',')
|
||||
return arr[0]
|
||||
}
|
||||
|
||||
function refresh() {
|
||||
query.page = 1
|
||||
isEnd.value = false
|
||||
getData()
|
||||
}
|
||||
|
||||
function refund(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否申请退款?',
|
||||
showCancel: true,
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
Api.applyRefund({
|
||||
recordId: item.id,
|
||||
orderNo: item.orderNo,
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '申请成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
refresh()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function cancelRefund(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否取消退款?',
|
||||
showCancel: true,
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
Api.cancelRefund({
|
||||
recordId: item.id,
|
||||
orderNo: item.orderNo,
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '取消成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
refresh()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
watch(() => tabs.sel, (newval) => {
|
||||
orders.sel = 0
|
||||
refresh()
|
||||
})
|
||||
|
||||
function showBtns(item) {
|
||||
if (item.status == '已退款') {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
function showShare(item) {
|
||||
if (item.status == '待成团') {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
function showTime(item) {
|
||||
if (item.status == '待成团') {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
|
||||
let shareItem = null
|
||||
|
||||
function share(item) {
|
||||
shareItem = item
|
||||
}
|
||||
|
||||
onShareAppMessage(() => {
|
||||
console.log('onShareAppMessage')
|
||||
console.log(shareItem)
|
||||
const query = `groupOrderNo=${shareItem.groupOrderNo}&shopId=${shareItem.shopId}`
|
||||
return wxShare({
|
||||
title: shareItem.wareJson.wareName,
|
||||
imageUrl: shareItem.goodsImg,
|
||||
path: '/groupBuying/detail/index' + '?' + query,
|
||||
query,
|
||||
})
|
||||
})
|
||||
onShow(getData)
|
||||
onLoad((opt) => {
|
||||
const shopId=opt.shopId||uni.cache.get('shopId')
|
||||
query.shopId=shopId
|
||||
uni.cache.set('shopId',query.shopId)
|
||||
console.log('opt',opt);
|
||||
APIusershopInfodetail({
|
||||
shopId: shopId
|
||||
}).then(res => {
|
||||
console.log(res);
|
||||
shopInfo.value = res.shopInfo
|
||||
uni.cache.set('shopInfo', res.shopInfo)
|
||||
uni.cache.set('shopId', res.shopInfo.id)
|
||||
})
|
||||
})
|
||||
|
||||
let timer = null
|
||||
let nowTime = ref(Date.now())
|
||||
timer = setInterval(() => {
|
||||
nowTime.value = Date.now()
|
||||
}, 1000)
|
||||
|
||||
function returnTime(item) {
|
||||
nowTime.value
|
||||
return getRemainingHMS(item)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@@ -82,7 +446,7 @@
|
||||
background-size: cover;
|
||||
|
||||
.info {
|
||||
padding: 190rpx 30rpx 0 30rpx;
|
||||
padding: 32rpx 30rpx 0 30rpx;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
@@ -100,10 +464,11 @@
|
||||
gap: 20rpx;
|
||||
border-radius: 14rpx 14rpx 0 0;
|
||||
background: linear-gradient(90deg, #FFF5E6 0%, #FFD2CA 100%);
|
||||
transform: translateY(-20rpx);
|
||||
align-items: center;
|
||||
|
||||
.step {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.index {
|
||||
@@ -173,15 +538,18 @@
|
||||
background-size: cover;
|
||||
transform: translateY(-10rpx);
|
||||
display: flex;
|
||||
|
||||
.left {
|
||||
width: 306rpx;
|
||||
color: #fff;
|
||||
padding: 16rpx 22rpx;
|
||||
}
|
||||
.right{
|
||||
|
||||
.right {
|
||||
padding-left: 16rpx;
|
||||
margin-top: 30rpx;
|
||||
.pin{
|
||||
|
||||
.pin {
|
||||
width: 76rpx;
|
||||
height: 54rpx;
|
||||
}
|
||||
@@ -189,9 +557,134 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.filters{
|
||||
|
||||
.filters {
|
||||
padding: 16rpx 28rpx;
|
||||
border-radius: 6rpx 6rpx 16rpx 16rpx;
|
||||
background: #FFF;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
padding: 32rpx 88rpx;
|
||||
|
||||
.tabs {
|
||||
transition: all .3s linear;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #ED5A2E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.translateY20 {
|
||||
transform: translateY(-20rpx);
|
||||
}
|
||||
|
||||
.orderStatus {
|
||||
padding: 26rpx 28rpx;
|
||||
justify-content: space-between;
|
||||
height: 100rpx;
|
||||
|
||||
.orderState {
|
||||
color: #999;
|
||||
transition: all .3s linear;
|
||||
|
||||
&.active {
|
||||
color: #000;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.orders {
|
||||
padding: 0 26rpx 36rpx;
|
||||
|
||||
.item {
|
||||
padding: 32rpx 24rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #FFF;
|
||||
margin-bottom: 32rpx;
|
||||
|
||||
.numbers {
|
||||
background-color: #ED5A2E;
|
||||
padding: 16rpx 30rpx;
|
||||
border-radius: 12rpx;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.price {
|
||||
color: #ED5A2E;
|
||||
font-weight: 700;
|
||||
line-height: 36rpx;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.info {
|
||||
padding: 16rpx 34rpx;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
border-radius: 8rpx;
|
||||
background: #F8F8F8;
|
||||
|
||||
.title {
|
||||
min-width: 208rpx;
|
||||
padding-right: 8rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.stitle {
|
||||
color: #666;
|
||||
|
||||
&.price {
|
||||
font-size: 32rpx;
|
||||
color: #ed5a2e;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.btns {
|
||||
margin-top: 28rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 34rpx;
|
||||
|
||||
.btn {
|
||||
line-height: 1;
|
||||
margin: 0;
|
||||
padding: 12rpx 14rpx;
|
||||
border-radius: 10rpx;
|
||||
border: 2rpx solid #D9D9D9;
|
||||
background: #FFF;
|
||||
font-size: 28rpx;
|
||||
|
||||
&.black {
|
||||
border-color: #343030;
|
||||
background-color: #343030;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.copy {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
</style>
|
||||
BIN
groupBuying/static/image/copy.png
Normal file
BIN
groupBuying/static/image/copy.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
934
groupBuying/success/index.vue
Normal file
934
groupBuying/success/index.vue
Normal file
@@ -0,0 +1,934 @@
|
||||
<template>
|
||||
|
||||
<view>
|
||||
<template v-if="item.status=='待核销'">
|
||||
<view class="min-page bg-f7 color-333 u-font-28 relative">
|
||||
<up-navbar bg-color="#F8F8F8" :fixed="true" :placeholder="true" title="支付成功"
|
||||
@leftClick="uni.navigateBack()"></up-navbar>
|
||||
|
||||
<view class="bottom">
|
||||
<view class="u-p-32 u-flex u-row-center u-col-center u-flex-col bg-fff">
|
||||
<image :src="imgs.success" mode="" class="success-icon"></image>
|
||||
<view class="u-font-36 font-bold u-m-t-16">拼团成功</view>
|
||||
</view>
|
||||
|
||||
<view class="shop ">
|
||||
<view class="u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">可核销门店:</text>
|
||||
<text>{{item.shopName}}</text>
|
||||
</view>
|
||||
<view class="u-m-t-32 u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">门店地址:</text>
|
||||
<text>{{item.shopAddress}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="goods u-flex u-col-center">
|
||||
<up-image width="158rpx" height="158rpx" radius="14rpx" :src="item.goodsImg"></up-image>
|
||||
<view class=" u-flex-1 u-p-l-16">
|
||||
<view class="u-flex u-col-center u-row-between">
|
||||
<view class="u-flex tuan-members">
|
||||
<image :src="imgs.pin" class="pin" mode=""></image>
|
||||
<text class="">{{item.groupPeopleNum}}人团</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-t-16 u-flex u-col-center">
|
||||
<view style="width: 356rpx;">
|
||||
<view class="font-bold" v-if="item.wareJson">{{item.wareJson
|
||||
.wareName}}</view>
|
||||
<view class="u-flex u-m-t-10 u-col-center ">
|
||||
<view class="price">
|
||||
<text class="u-font-30">¥</text>
|
||||
<text class="u-font-48 font-bold">{{item.wareGroupPrice}} </text>
|
||||
</view>
|
||||
<view class="old-price u-m-l-32">
|
||||
<text>¥</text>
|
||||
<text>{{item.wareOriginalPrice}} </text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-p-l-16 color-333">
|
||||
数量:{{item.num}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="members">
|
||||
<view class="list">
|
||||
<view class="item" v-for="(user,index) in item.users" :key="index">
|
||||
<view class="box">
|
||||
<view class="u-flex relative">
|
||||
<up-avatar size="140rpx" :src="user.userAvatar"></up-avatar>
|
||||
<view class="u-flex u-row-center absolute">
|
||||
<text class="tuanzhang" v-if="index==0">团长</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="u-line-1 u-m-t-16 color-000 text-center">{{user.userName}}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="item" v-if="false">
|
||||
<view class="box">
|
||||
<view class="u-flex relative">
|
||||
<view class="add-box u-flex u-row-center">
|
||||
<up-icon color="#D9D9D9" name="plus"></up-icon>
|
||||
<button open-type="share" class="share" @click="share(item)">分享</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-line-1 u-m-t-16 color-000 text-center">等待参团</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
<view class="order">
|
||||
<view class="u-flex u-row-between">
|
||||
<view class="font-bold u-font-32">订单信息</view>
|
||||
|
||||
<view class="u-flex color-666" @click="showOrder=!showOrder" style="align-items: baseline;">
|
||||
<text class="u-m-r-18">{{showOrder?'收起':'展开'}}</text>
|
||||
<view class="guodu" :class="{rotate:!showOrder}">
|
||||
<up-icon name="arrow-down" bold></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-16" v-if="showOrder">
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">商品总额</view>
|
||||
<view class="">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">实付金额</view>
|
||||
<view class="">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">订单号</view>
|
||||
<view class="">{{item.orderNo}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">支付时间</view>
|
||||
<view class="">{{item.payTime}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view style="height: 100px;"></view>
|
||||
<view class="btns">
|
||||
<view class="btn" @click="toPinIndex">继续拼团</view>
|
||||
<button class="btn main" @click="toOrderDetail(item)">查看订单</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-if="item.status=='待成团'">
|
||||
<view class="min-page bg-f7 color-333 u-font-28 relative">
|
||||
<view class="top" :style="topStyle">
|
||||
<up-navbar bg-color="transparent" :fixed="false" :placeholder="false" title="支付成功"
|
||||
left-icon-color="#fff" @leftClick="uni.navigateBack()" title-color="#fff"></up-navbar>
|
||||
<view class="u-flex info u-col-center">
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom bottom1">
|
||||
<view class="time" v-if="item.status=='待成团'">
|
||||
<text class="color-666">剩余成团时间:</text>
|
||||
<view class="u-font-32">
|
||||
<text class="number">{{returnNum(0)}}</text>
|
||||
<text class="gap">:</text>
|
||||
<text class="number">{{returnNum(1)}}</text>
|
||||
<text class="gap">:</text>
|
||||
<text class="number">{{returnNum(2)}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods u-flex u-col-center">
|
||||
<up-image width="158rpx" height="158rpx" radius="14rpx" :src="item.goodsImg"></up-image>
|
||||
<view class=" u-flex-1 u-p-l-16">
|
||||
<view class="u-flex u-col-center u-row-between">
|
||||
<view class="u-flex tuan-members">
|
||||
<image :src="imgs.pin" class="pin" mode=""></image>
|
||||
<text class="">{{item.groupPeopleNum}}人团</text>
|
||||
</view>
|
||||
<statusVue :status="item.status"></statusVue>
|
||||
|
||||
</view>
|
||||
<view class="u-m-t-16 u-flex u-col-center u-row-between">
|
||||
<view style="max-width: 356rpx;">
|
||||
<view class="font-bold u-line-1" v-if="item.wareJson">{{item.wareJson
|
||||
.wareName}}</view>
|
||||
<view class="u-flex u-m-t-10 u-col-center ">
|
||||
<view class="price">
|
||||
<text class="u-font-30">¥</text>
|
||||
<text class="u-font-48 font-bold">{{item.wareGroupPrice}} </text>
|
||||
</view>
|
||||
<view class="old-price u-m-l-32">
|
||||
<text>¥</text>
|
||||
<text>{{item.wareOriginalPrice}} </text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-p-l-16 color-333 no-wrap">
|
||||
数量:{{item.num}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="shop-box">
|
||||
<view class="shop ">
|
||||
<view class="u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">可核销门店:</text>
|
||||
<text>{{item.shopName}}</text>
|
||||
</view>
|
||||
<view class="u-m-t-32 u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">门店地址:</text>
|
||||
<text>{{item.shopAddress}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="members">
|
||||
<view class="list">
|
||||
<view class="item" v-for="(user,index) in item.users" :key="index">
|
||||
<view class="box">
|
||||
<view class="u-flex relative">
|
||||
<up-avatar size="140rpx" :src="user.userAvatar"></up-avatar>
|
||||
<view class="u-flex u-row-center absolute">
|
||||
<text class="tuanzhang" v-if="index==0">团长</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="u-line-1 u-m-t-16 color-000 text-center">{{user.userName}}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="item">
|
||||
<view class="box">
|
||||
<view class="u-flex relative">
|
||||
<view class="add-box u-flex u-row-center">
|
||||
<up-icon color="#D9D9D9" name="plus"></up-icon>
|
||||
<button open-type="share" class="share" @click="share(item)">分享</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-line-1 u-m-t-16 color-000 text-center">等待参团</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-center" v-if="item.status=='待成团'">
|
||||
<view class="pin-btn">邀请好友参团
|
||||
<button open-type="share" class="share">邀请好友参团</button>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="order">
|
||||
<view class="u-flex u-row-between">
|
||||
<view class="font-bold u-font-32">订单信息</view>
|
||||
|
||||
<view class="u-flex color-666" @click="showOrder=!showOrder" style="align-items: baseline;">
|
||||
<text class="u-m-r-18">{{showOrder?'收起':'展开'}}</text>
|
||||
<view class="guodu" :class="{rotate:!showOrder}">
|
||||
<up-icon name="arrow-down" bold></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-16" v-if="showOrder">
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">商品总额</view>
|
||||
<view class="">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">实付金额</view>
|
||||
<view class="">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">订单号</view>
|
||||
<view class="">{{item.orderNo}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">支付时间</view>
|
||||
<view class="">{{item.payTime}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
<template v-if="item.status=='已退款'">
|
||||
<view class="min-page bg-f7 color-333 u-font-28 relative">
|
||||
<view class="top" :style="topStyle">
|
||||
<up-navbar bg-color="transparent" :fixed="false" :placeholder="false" title="订单详情"
|
||||
left-icon-color="#fff" @leftClick="uni.navigateBack()" title-color="#fff"></up-navbar>
|
||||
<view class="u-flex info u-col-center">
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom bottom1">
|
||||
<view class="time" v-if="item.status=='待成团'">
|
||||
<text class="color-666">剩余成团时间:</text>
|
||||
<view class="u-font-32">
|
||||
<text class="number">{{returnNum(0)}}</text>
|
||||
<text class="gap">:</text>
|
||||
<text class="number">{{returnNum(1)}}</text>
|
||||
<text class="gap">:</text>
|
||||
<text class="number">{{returnNum(2)}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods u-flex u-col-center" style="border-radius: 16rpx;">
|
||||
<up-image width="158rpx" height="158rpx" radius="14rpx" :src="item.goodsImg"></up-image>
|
||||
<view class=" u-flex-1 u-p-l-16">
|
||||
<view class="u-flex u-col-center u-row-between">
|
||||
<view class="u-flex tuan-members">
|
||||
<image :src="imgs.pin" class="pin" mode=""></image>
|
||||
<text class="">{{item.groupPeopleNum}}人团</text>
|
||||
</view>
|
||||
<statusVue :status="item.status"></statusVue>
|
||||
|
||||
</view>
|
||||
<view class="u-m-t-16 u-flex u-col-center u-row-between">
|
||||
<view style="max-width: 356rpx;">
|
||||
<view class="font-bold u-line-1" v-if="item.wareJson">{{item.wareJson
|
||||
.wareName}}</view>
|
||||
<view class="u-flex u-m-t-10 u-col-center ">
|
||||
<view class="price">
|
||||
<text class="u-font-30">¥</text>
|
||||
<text class="u-font-48 font-bold">{{item.wareGroupPrice}} </text>
|
||||
</view>
|
||||
<view class="old-price u-m-l-32">
|
||||
<text>¥</text>
|
||||
<text>{{item.wareOriginalPrice}} </text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-p-l-16 color-333 no-wrap">
|
||||
数量:{{item.num}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="shop-box">
|
||||
<view class="shop ">
|
||||
<view class="u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">可核销门店:</text>
|
||||
<text>{{item.shopName}}</text>
|
||||
</view>
|
||||
<view class="u-m-t-32 u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">门店地址:</text>
|
||||
<text>{{item.shopAddress}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<view class="order">
|
||||
<view class="u-flex u-row-between">
|
||||
<view class="font-bold u-font-32">订单信息</view>
|
||||
|
||||
<view class="u-flex color-666" @click="showOrder=!showOrder" style="align-items: baseline;">
|
||||
<text class="u-m-r-18">{{showOrder?'收起':'展开'}}</text>
|
||||
<view class="guodu" :class="{rotate:!showOrder}">
|
||||
<up-icon name="arrow-down" bold></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-16" v-if="showOrder">
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">商品总额</view>
|
||||
<view class="">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">实付金额</view>
|
||||
<view class="">¥{{item.payAmount}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">订单号</view>
|
||||
<view class="">{{item.orderNo}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between item">
|
||||
<view class="color-666">支付时间</view>
|
||||
<view class="">{{item.payTime}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import statusVue from '@/groupBuying/components/status.vue'
|
||||
import * as Api from '@/common/api/order/gbOrder.js'
|
||||
import {
|
||||
wxShare
|
||||
} from '@/utils/share.js'
|
||||
import {
|
||||
computed,
|
||||
reactive
|
||||
} from 'vue'
|
||||
import {
|
||||
getRemainingHMS
|
||||
} from '@/utils/countdown.js'
|
||||
|
||||
function toPinIndex() {
|
||||
uni.redirectTo({
|
||||
url: '/groupBuying/index/index'
|
||||
})
|
||||
}
|
||||
const imgs = {
|
||||
bg: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/d21f2dfd7bec44618f2d5e4b88372b08.png',
|
||||
pin: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/3947892924dd481782331513aff00eb3.png',
|
||||
success: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/3/6a75acd0c0db4bfe9937854b2b2df3f0.png'
|
||||
}
|
||||
|
||||
|
||||
const topStyle = {
|
||||
backgroundImage: 'url(' + imgs.bg + ')'
|
||||
}
|
||||
const showOrder = ref(true)
|
||||
|
||||
function copyText(text) {
|
||||
uni.setClipboardData({
|
||||
data: text,
|
||||
success() {}
|
||||
})
|
||||
}
|
||||
const query = reactive({
|
||||
shopId: '',
|
||||
detailId: '',
|
||||
})
|
||||
|
||||
function init(opt) {
|
||||
console.log(opt)
|
||||
Object.assign(query, opt)
|
||||
getDetail()
|
||||
}
|
||||
const item = reactive({})
|
||||
|
||||
function getDetail() {
|
||||
try {
|
||||
Api.recordDetail(query).then(res => {
|
||||
if (!res) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '当前商品已下架或者不存在',
|
||||
showCancel: false,
|
||||
success(res) {
|
||||
uni.redirectTo({
|
||||
url: '/groupBuying/index/index'
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
console.log(res, 'res')
|
||||
const wareJson = JSON.parse(res.wareJson)
|
||||
wareJson.wareImgs = wareJson.wareImgs.split(',').filter(v => v)
|
||||
res.wareJson = wareJson;
|
||||
res.goodsImg = wareJson.wareImgs[0];
|
||||
Object.assign(item, res)
|
||||
console.log('item', item)
|
||||
})
|
||||
} catch (err) {
|
||||
console.log('err', err)
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
onLoad(init)
|
||||
|
||||
let timer = null
|
||||
let nowTime = ref(Date.now())
|
||||
timer = setInterval(() => {
|
||||
nowTime.value = Date.now()
|
||||
}, 1000)
|
||||
|
||||
const returnTime = computed(() => {
|
||||
nowTime.value
|
||||
return getRemainingHMS(item)
|
||||
})
|
||||
|
||||
function returnNum(index) {
|
||||
return returnTime.value.split(':')[index]
|
||||
}
|
||||
|
||||
|
||||
function refund(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否申请退款?',
|
||||
showCancel: true,
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
Api.applyRefund({
|
||||
recordId: item.id,
|
||||
orderNo: item.orderNo,
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '申请成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
getDetail()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onShareAppMessage(() => {
|
||||
console.log('onShareAppMessage')
|
||||
console.log(item)
|
||||
const query = `groupOrderNo=${item.groupOrderNo}&shopId=${item.shopId}`
|
||||
return wxShare({
|
||||
title: item.wareJson.wareName,
|
||||
imageUrl: item.goodsImg,
|
||||
path: '/groupBuying/detail/index' + '?' + query,
|
||||
query,
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
function toOrderDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: '/groupBuying/detail/index?detailId=' + item.id + '&shopId=' + item.shopId
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.top {
|
||||
height: 422rpx;
|
||||
background-size: cover;
|
||||
|
||||
.info {
|
||||
padding: 32rpx 30rpx 0 30rpx;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bottom {
|
||||
background-color: #fff;
|
||||
padding: 0 28rpx;
|
||||
|
||||
.time {
|
||||
padding: 18rpx 24rpx;
|
||||
background: #FFF4E2;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
|
||||
.number {
|
||||
padding: 6rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #ED5A2E;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
margin-left: 18rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
|
||||
.gap {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goods {
|
||||
background-color: #fff;
|
||||
padding: 22rpx 24rpx 0;
|
||||
border-radius: 0 0 16rpx 16rpx;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.pin {
|
||||
width: 60rpx;
|
||||
height: 38rpx;
|
||||
}
|
||||
|
||||
.tuan-members {
|
||||
padding: 0 16rpx 0 0;
|
||||
border-radius: 0 6rpx 6rpx 0;
|
||||
background: #4C2828;
|
||||
color: #f5d9ad;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
color: #666666;
|
||||
text-decoration-line: line-through;
|
||||
}
|
||||
}
|
||||
|
||||
.u-font-48 {
|
||||
font-size: 48rpx;
|
||||
}
|
||||
|
||||
.shop-box {
|
||||
background: #fff;
|
||||
padding: 32rpx 30rpx 28rpx 30rpx;
|
||||
border-radius: 0 0 16rpx 16rpx;
|
||||
}
|
||||
|
||||
.copy {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-left: 22rpx;
|
||||
}
|
||||
|
||||
.shop {
|
||||
border-radius: 8rpx;
|
||||
background: #F8F8F8;
|
||||
padding: 16rpx 34rpx;
|
||||
}
|
||||
|
||||
.relative {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.members {
|
||||
padding: 26rpx 24rpx;
|
||||
border-radius: 16rpx;
|
||||
margin-top: 32rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.item {
|
||||
width: calc(100% / 3);
|
||||
display: flex;
|
||||
margin-bottom: 32rpx;
|
||||
|
||||
.add-box {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border: 2rpx dashed #D9D9D9;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.share {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// &:nth-of-type(2n) {
|
||||
// justify-content: center;
|
||||
// }
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.absolute {
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.tuanzhang {
|
||||
padding: 8rpx 18rpx;
|
||||
border-radius: 20rpx;
|
||||
background: #ED5A2E;
|
||||
color: #fff;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.btns {
|
||||
position: fixed;
|
||||
left: 87rpx;
|
||||
right: 87rpx;
|
||||
bottom: 0;
|
||||
padding-bottom: 60rpx;
|
||||
display: flex;
|
||||
gap: 40rpx;
|
||||
|
||||
.btn {
|
||||
flex: 1;
|
||||
padding: 16rpx 28rpx;
|
||||
border-radius: 200rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
line-height: 1;
|
||||
margin: 0;
|
||||
justify-content: center;
|
||||
border: 2rpx solid #E8AD7B;
|
||||
background: #FFF;
|
||||
color: #E8AD7B;
|
||||
|
||||
&.main {
|
||||
background-color: #E8AD7B;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.guodu {
|
||||
transition: all .3s;
|
||||
}
|
||||
|
||||
.pin-btn {
|
||||
padding: 14rpx 60rpx;
|
||||
border-radius: 200rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
justify-content: center;
|
||||
border: 2rpx solid #E8AD7B;
|
||||
background: #E8AD7B;
|
||||
color: #fff;
|
||||
position: relative;
|
||||
|
||||
.share {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.rotate {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
.order {
|
||||
padding: 32rpx 28rpx;
|
||||
border-radius: 16rpx;
|
||||
margin: 14rpx 30rpx 30rpx 30rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
padding: 16rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.refund {
|
||||
padding: 18rpx 164rpx;
|
||||
border-radius: 0 0 16rpx 16rpx;
|
||||
background: #FFF4E2;
|
||||
font-weight: 700;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.success-icon {
|
||||
width: 102rpx;
|
||||
height: 102rpx;
|
||||
}
|
||||
|
||||
.bg-fff {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.bottom1 {
|
||||
margin: 0 28rpx;
|
||||
padding: 0;
|
||||
transform: translateY(-160rpx);
|
||||
background-color: transparent;
|
||||
|
||||
.time {
|
||||
padding: 18rpx 24rpx;
|
||||
background: #FFF4E2;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
|
||||
.number {
|
||||
padding: 6rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #ED5A2E;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
margin-left: 18rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
|
||||
.gap {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goods {
|
||||
background-color: #fff;
|
||||
padding: 32rpx 24rpx 0;
|
||||
border-radius: 0;
|
||||
margin-top: 0;
|
||||
|
||||
.pin {
|
||||
width: 60rpx;
|
||||
height: 38rpx;
|
||||
}
|
||||
|
||||
.tuan-members {
|
||||
padding: 0 16rpx 0 0;
|
||||
border-radius: 0 6rpx 6rpx 0;
|
||||
background: #4C2828;
|
||||
color: #f5d9ad;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.u-font-48 {
|
||||
font-size: 48rpx;
|
||||
}
|
||||
|
||||
.shop-box {
|
||||
background: #fff;
|
||||
padding: 32rpx 30rpx 28rpx 30rpx;
|
||||
border-radius: 0 0 16rpx 16rpx;
|
||||
}
|
||||
|
||||
.copy {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-left: 22rpx;
|
||||
}
|
||||
|
||||
.shop {
|
||||
border-radius: 8rpx;
|
||||
background: #F8F8F8;
|
||||
padding: 16rpx 34rpx;
|
||||
}
|
||||
|
||||
.relative {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.members {
|
||||
padding: 26rpx 24rpx;
|
||||
border-radius: 16rpx;
|
||||
margin-top: 32rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.item {
|
||||
width: calc(100% / 3);
|
||||
display: flex;
|
||||
|
||||
|
||||
.add-box {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border: 2rpx dashed #D9D9D9;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.share {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:nth-of-type(3n-1) {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.absolute {
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.tuanzhang {
|
||||
padding: 8rpx 18rpx;
|
||||
border-radius: 20rpx;
|
||||
background: #ED5A2E;
|
||||
color: #fff;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order {
|
||||
padding: 32rpx 28rpx;
|
||||
border-radius: 16rpx;
|
||||
margin: 0;
|
||||
margin-top: 32rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
padding: 16rpx 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
2
main.js
2
main.js
@@ -1,6 +1,8 @@
|
||||
import App from './App'
|
||||
import uviewPlus from '@/uni_modules/uview-plus'
|
||||
import './framework/bootstrap'
|
||||
import config from '@/common/config.js'
|
||||
|
||||
// #ifndef VUE3
|
||||
import Vue from 'vue'
|
||||
import './uni.promisify.adaptor'
|
||||
|
||||
75
pages.json
75
pages.json
@@ -354,10 +354,9 @@
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
,{
|
||||
, {
|
||||
"root": "groupBuying",
|
||||
"pages": [
|
||||
{
|
||||
"pages": [{
|
||||
"path": "index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "拼团特惠",
|
||||
@@ -370,6 +369,76 @@
|
||||
"navigationBarTitleText": "拼团特惠",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "detail/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单详情",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goodsDetail/goodsDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "拼团特惠"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "success/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "支付成功",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "confirm-order/confirm-order",
|
||||
"style": {
|
||||
"navigationBarTitleText": "确认订单"
|
||||
}
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "userPackage",
|
||||
"pages": [
|
||||
{
|
||||
"path": "index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goodsDetail/goodsDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "套餐详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/order",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "confirm-order/confirm-order",
|
||||
"style": {
|
||||
"navigationBarTitleText": "确认订单"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "members/members",
|
||||
"style": {
|
||||
"navigationBarTitleText": "查看全部"
|
||||
}
|
||||
}
|
||||
|
||||
]
|
||||
|
||||
@@ -5,28 +5,26 @@
|
||||
<image class="bg" :src="shopExtend[0].value" mode="aspectFill"
|
||||
v-if="!isJsonArrayString(shopExtend[0].value)"></image>
|
||||
<swiper class="swiper" autoplay circular v-else>
|
||||
<swiper-item class="swiper-item" v-for="item in JSON.parse(shopExtend[0].value)">
|
||||
<swiper-item class="swiper-item" v-for="(item, index) in JSON.parse(shopExtend[0].value)"
|
||||
:key="index">
|
||||
<image class="swiper-bg" :src="item"></image>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</template>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="userInfo u-flex">
|
||||
<up-avatar size="61px" :default-url="imgs.defaultAvatar"></up-avatar>
|
||||
<view class="u-flex-1 u-flex u-row-between u-p-l-16 u-p-r-16">
|
||||
<view>
|
||||
<view class="u-flex">
|
||||
<view class="u-font-32 color-333 font-bold u-line-1" style="max-width: 320rpx;">HI,欢迎回来</view>
|
||||
<view class="u-font-32 color-333 font-bold u-line-1" style="max-width: 320rpx">HI,欢迎回来</view>
|
||||
<view class="vip" v-if="shopUserInfo.isVip">会员身份</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-10 u-font-24 color-666">
|
||||
<text>优惠券:{{allConfig.couponNum}}</text>
|
||||
<text class="u-m-l-22">积分:{{allConfig.pointNum}}</text>
|
||||
<text>优惠券:{{ allConfig.couponNum }}</text>
|
||||
<text class="u-m-l-22">积分:{{ allConfig.pointNum }}</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<image :src="imgs.code" class="code"></image>
|
||||
</view>
|
||||
@@ -52,11 +50,9 @@
|
||||
<view class="desc">-自助下单 快人一步-</view>
|
||||
</view>
|
||||
<image :src="imgs.big_orderFood" class="big_img"></image>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
<view class="groupBuying" v-if="allConfig.group">
|
||||
<view class="groupBuying" @click="toGroupBuying">
|
||||
<view class="u-flex u-col-center">
|
||||
<image class="img" :src="imgs.groupBuying"></image>
|
||||
<view class="u-font-32 color-333 font-700 u-m-l-12">快乐拼单</view>
|
||||
@@ -64,9 +60,10 @@
|
||||
|
||||
<view class="u-font-28 color-999">一键分享,快速拼单</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="points" @click="toIntegralMall" v-if="allConfig.pointsMall">
|
||||
<view class="points" @click="toIntegralMall">
|
||||
<view>
|
||||
<view class="title">积分乐园</view>
|
||||
<view class="desc">好物兑换 畅花积分</view>
|
||||
@@ -74,6 +71,14 @@
|
||||
<image class="img" :src="imgs.points"></image>
|
||||
</view>
|
||||
|
||||
<view class="points taocan" @click="toTaocan">
|
||||
<view>
|
||||
<view class="title">套餐推广</view>
|
||||
<view class="desc">邀好友助力,套餐更优惠</view>
|
||||
</view>
|
||||
<image class="img" :src="imgs.taocan"></image>
|
||||
</view>
|
||||
|
||||
<view class="bottom_menus">
|
||||
<view class="item" @click="tomember">
|
||||
<image :src="imgs.vip" class="img"></image>
|
||||
@@ -85,15 +90,14 @@
|
||||
<view class="title">充值</view>
|
||||
<view class="desc">充值享更多优惠</view>
|
||||
</view>
|
||||
<view class="item" @click="toFenxiao" v-if="allConfig.distribution">
|
||||
<view class="item" @click="toFenxiao">
|
||||
<image :src="imgs.share" class="img"></image>
|
||||
<view class="title">股东共享</view>
|
||||
<view class="desc">邀请好友,获得佣金</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view style="height: 90px;"></view>
|
||||
<view style="height: 90px"></view>
|
||||
<u-popup :show="popupShow" :safe-area-inset-bottom="false" mode="center" @close="popupShow = false">
|
||||
<view class="popup-content">
|
||||
<view class="header-wrap">
|
||||
@@ -112,27 +116,33 @@
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<!-- 私域引流弹窗 -->
|
||||
<attractPopup type="home" ref="attractPopupRef" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import attractPopup from '@/components/attract-popup.vue';
|
||||
import {
|
||||
homeData
|
||||
} from '@/common/api/market/index.js'
|
||||
} from '@/common/api/market/index.js';
|
||||
import {
|
||||
getMemberConfig,
|
||||
getRechargeConfig,
|
||||
} from "@/common/api/index/index.js";
|
||||
getRechargeConfig
|
||||
} from '@/common/api/index/index.js';
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
defineProps,
|
||||
defineEmits,
|
||||
onMounted
|
||||
} from "vue";
|
||||
} from 'vue';
|
||||
import {
|
||||
isJsonArrayString
|
||||
} from "@/utils/util.js";
|
||||
} from '@/utils/util.js';
|
||||
|
||||
const attractPopupRef = ref(null);
|
||||
|
||||
const imgs = {
|
||||
recharge: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/2f22c0ced494497e8d6f981832b191c9.png',
|
||||
share: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/bcb8d461e96d445ba40256079da775b3.png',
|
||||
@@ -143,31 +153,38 @@
|
||||
groupBuying: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/117745e0f3db48b489f9d4e5c5967043.png',
|
||||
points: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/df0758f7b86449f89f882e50226e17c7.png',
|
||||
code: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/044dcaf913054f03a9db7983f048b1e6.png',
|
||||
defaultAvatar: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/b98d2c7110e847f996e8d7ba4342f0a5.png'
|
||||
}
|
||||
defaultAvatar: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/b98d2c7110e847f996e8d7ba4342f0a5.png',
|
||||
taocan: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/1eb9aa9b865b47b39ab9d7ac404601a9.png'
|
||||
};
|
||||
// 定义接收的属性
|
||||
const props = defineProps({
|
||||
shopExtend: {
|
||||
type: Array,
|
||||
default: [],
|
||||
},
|
||||
default: []
|
||||
}
|
||||
});
|
||||
|
||||
function toGroupBuying() {
|
||||
uni.navigateTo({
|
||||
url: '/groupBuying/index/index'
|
||||
})
|
||||
}
|
||||
|
||||
function toFenxiao() {
|
||||
uni.navigateTo({
|
||||
url: "/distribution/shop-detail/index?shopId=" + uni.cache.get("shopId"),
|
||||
url: '/distribution/shop-detail/index?shopId=' + uni.cache.get('shopId')
|
||||
});
|
||||
}
|
||||
|
||||
function toIntegralMall() {
|
||||
uni.navigateTo({
|
||||
url: "/scoreShop/index/index?shopId=" + uni.cache.get("shopId"),
|
||||
url: '/scoreShop/index/index?shopId=' + uni.cache.get('shopId')
|
||||
});
|
||||
}
|
||||
|
||||
import {
|
||||
productStore
|
||||
} from "@/stores/user.js";
|
||||
} from '@/stores/user.js';
|
||||
import {
|
||||
onShow
|
||||
} from '@dcloudio/uni-app';
|
||||
@@ -181,10 +198,10 @@
|
||||
// 预点单
|
||||
function beforehandOrderHandle() {
|
||||
popupShow.value = false;
|
||||
uni.cache.set("dinersNum", 1);
|
||||
uni.cache.set("tableCode", shopUserInfo.id);
|
||||
uni.cache.set('dinersNum', 1);
|
||||
uni.cache.set('tableCode', shopUserInfo.id);
|
||||
uni.navigateTo({
|
||||
url: "/pages/product/index?type=beforehand",
|
||||
url: '/pages/product/index?type=beforehand'
|
||||
});
|
||||
}
|
||||
|
||||
@@ -195,51 +212,57 @@
|
||||
await store.scanCodeactions();
|
||||
}
|
||||
|
||||
function toTaocan() {
|
||||
uni.navigateTo({
|
||||
url: '/userPackage/index/index'
|
||||
})
|
||||
}
|
||||
|
||||
const memberindex = (url) => {
|
||||
uni.pro.navigateTo(url, {
|
||||
shopId: uni.cache.get("shopId"),
|
||||
type: "index",
|
||||
shopId: uni.cache.get('shopId'),
|
||||
type: 'index'
|
||||
});
|
||||
};
|
||||
const shopUserInfo = reactive({})
|
||||
Object.assign(shopUserInfo, uni.cache.get("shopUserInfo") || {})
|
||||
const shopUserInfo = reactive({});
|
||||
Object.assign(shopUserInfo, uni.cache.get('shopUserInfo') || {});
|
||||
|
||||
function tomember() {
|
||||
if (isMember.value) {
|
||||
const shopId = uni.cache.get("shopId");
|
||||
const shopId = uni.cache.get('shopId');
|
||||
if (!shopUserInfo.isVip) {
|
||||
uni.navigateTo({
|
||||
url: "/user/vip/buy-vip?shopId=" + shopId,
|
||||
url: '/user/vip/buy-vip?shopId=' + shopId
|
||||
});
|
||||
return;
|
||||
}
|
||||
uni.navigateTo({
|
||||
url: "/user/vip/vip?shopId=" + shopId,
|
||||
url: '/user/vip/vip?shopId=' + shopId
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "暂未开放",
|
||||
icon: "none",
|
||||
title: '暂未开放',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function toCharge() {
|
||||
if (isCharge.value) {
|
||||
const shopId = uni.cache.get("shopId");
|
||||
const shopId = uni.cache.get('shopId');
|
||||
uni.navigateTo({
|
||||
url: "/pages/user/member/czzx?shopId=" + shopId,
|
||||
url: '/pages/user/member/czzx?shopId=' + shopId
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "暂未开放",
|
||||
icon: "none",
|
||||
title: '暂未开放',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
const getQueryString = (url, name) => {
|
||||
//解码
|
||||
var reg = new RegExp("(^|&|/?)" + name + "=([^&|/?]*)(&|/?|$)", "i");
|
||||
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i');
|
||||
var r = url.substr(1).match(reg);
|
||||
if (r != null) {
|
||||
return r[2];
|
||||
@@ -253,10 +276,10 @@
|
||||
async function getVipConfig() {
|
||||
try {
|
||||
const res1 = await getMemberConfig({
|
||||
shopId: uni.cache.get("shopId")
|
||||
shopId: uni.cache.get('shopId')
|
||||
});
|
||||
const res2 = await getRechargeConfig({
|
||||
shopId: uni.cache.get("shopId")
|
||||
shopId: uni.cache.get('shopId')
|
||||
});
|
||||
|
||||
isMember.value = +res1.memberConfig.isOpen;
|
||||
@@ -266,7 +289,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const allConfig = reactive({
|
||||
takeout: 0,
|
||||
group: 0,
|
||||
@@ -274,21 +296,22 @@
|
||||
distribution: 0,
|
||||
couponNum: 0,
|
||||
pointNum: 0
|
||||
})
|
||||
});
|
||||
|
||||
function getHomeData() {
|
||||
homeData().then(res => {
|
||||
Object.assign(allConfig, res)
|
||||
})
|
||||
homeData().then((res) => {
|
||||
Object.assign(allConfig, res);
|
||||
imgs.defaultAvatar = res.userAvatar ? res.userAvatar : imgs.defaultAvatar
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
updateData()
|
||||
updateData();
|
||||
});
|
||||
|
||||
function updateData() {
|
||||
Object.assign(shopUserInfo, uni.cache.get("shopUserInfo") || {})
|
||||
Object.assign(shopUserInfo, uni.cache.get('shopUserInfo') || {});
|
||||
getVipConfig();
|
||||
getHomeData()
|
||||
getHomeData();
|
||||
}
|
||||
defineExpose({
|
||||
updateData
|
||||
@@ -469,11 +492,13 @@
|
||||
align-items: center;
|
||||
align-self: stretch;
|
||||
border-radius: 24rpx;
|
||||
background: #FFF;
|
||||
transform: translateY(-36rpx);
|
||||
background: #fff;
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
margin-top: -36rpx;
|
||||
|
||||
.vip {
|
||||
background: #FA720A;
|
||||
background: #fa720a;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
padding: 6rpx 10rpx;
|
||||
@@ -487,10 +512,8 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.new-menus-box {
|
||||
margin: 0 16rpx 34rpx 16rpx;
|
||||
margin: 0 16rpx 0 16rpx;
|
||||
|
||||
.new-menus {
|
||||
display: flex;
|
||||
@@ -518,7 +541,7 @@
|
||||
.line {
|
||||
width: 2rpx;
|
||||
height: 156rpx;
|
||||
background: #EDEDED;
|
||||
background: #ededed;
|
||||
}
|
||||
|
||||
.takeout {}
|
||||
@@ -550,7 +573,7 @@
|
||||
|
||||
.groupBuying {
|
||||
padding: 16rpx 38rpx;
|
||||
border-top: 2rpx solid #EDEDED;
|
||||
border-top: 2rpx solid #ededed;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@@ -575,7 +598,7 @@
|
||||
}
|
||||
|
||||
.points {
|
||||
margin-top: 34rpx;
|
||||
margin-top: 10px;
|
||||
background-color: #fff;
|
||||
padding: 16rpx 68rpx;
|
||||
border-radius: 16rpx;
|
||||
@@ -589,10 +612,17 @@
|
||||
}
|
||||
}
|
||||
|
||||
.taocan {
|
||||
.img {
|
||||
width: 117px;
|
||||
height: 117px;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom_menus {
|
||||
display: flex;
|
||||
gap: 14rpx;
|
||||
margin-top: 34rpx;
|
||||
margin-top: 10px;
|
||||
|
||||
.item {
|
||||
flex: 1;
|
||||
@@ -601,7 +631,7 @@
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
border-radius: 18rpx;
|
||||
background: #FFF;
|
||||
background: #fff;
|
||||
|
||||
.img {
|
||||
width: 39px;
|
||||
|
||||
@@ -2312,7 +2312,6 @@
|
||||
}, onMessage);
|
||||
|
||||
|
||||
console.log('onLoad:e', e);
|
||||
cartStore.setOldOrder({
|
||||
detailMap: {},
|
||||
originAmount: 0
|
||||
@@ -2499,9 +2498,12 @@
|
||||
console.log('onMounted:限时折扣', cartStore.limitTimeDiscount);
|
||||
}
|
||||
onMounted(async () => {
|
||||
// #ifdef MP-WEIXIN
|
||||
await proxy.$onLaunched;
|
||||
// #endif
|
||||
// 获取当前页面栈
|
||||
const pages = getCurrentPages();
|
||||
|
||||
// 获取当前页面实例
|
||||
const currentPage = pages[pages.length - 1];
|
||||
// 获取页面参数
|
||||
|
||||
1311
pages/user/user.vue
1311
pages/user/user.vue
File diff suppressed because it is too large
Load Diff
@@ -166,7 +166,7 @@
|
||||
uni.hideLoading()
|
||||
if (openId) {
|
||||
pointGoodsApi.exchange({
|
||||
pointsGoodsId: item.id,
|
||||
paramId: item.id,
|
||||
shopId: item.shopId,
|
||||
number: 1,
|
||||
price: item.extraPrice,
|
||||
|
||||
@@ -87,8 +87,12 @@
|
||||
// }
|
||||
|
||||
function toDetail() {
|
||||
if(!pointsUser.value||!pointsUser.value.id){
|
||||
return
|
||||
}
|
||||
|
||||
uni.navigateTo({
|
||||
url: '/pages/user/member/billDetails?type=2&shopId=' + query.shopId + '&id=' + (pointsUser.value.id ||
|
||||
url: '/pages/user/member/billDetails?type=2&shopId=' + query.shopId + '&id=' + (pointsUser.value?pointsUser.value.id :
|
||||
'')
|
||||
})
|
||||
}
|
||||
|
||||
1
src/auto-imports.d.ts
vendored
1
src/auto-imports.d.ts
vendored
@@ -38,6 +38,7 @@ declare global {
|
||||
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
|
||||
const onScopeDispose: typeof import('vue')['onScopeDispose']
|
||||
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
|
||||
const onShareAppMessage: typeof import('@dcloudio/uni-app')['onShareAppMessage']
|
||||
const onShow: typeof import('@dcloudio/uni-app')['onShow']
|
||||
const onUnload: typeof import('@dcloudio/uni-app')['onUnload']
|
||||
const onUnmounted: typeof import('vue')['onUnmounted']
|
||||
|
||||
BIN
static/icon/copy.png
Normal file
BIN
static/icon/copy.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
@@ -233,6 +233,10 @@ export const useWebSocket = defineStore('socketTask', () => {
|
||||
|
||||
// 发送消息
|
||||
const sendMessage = (data) => {
|
||||
console.log('data',data)
|
||||
if(!data){
|
||||
return
|
||||
}
|
||||
if (isConnected.value && data) {
|
||||
// console.log('发送消息', data);
|
||||
socketTask.value.send({
|
||||
|
||||
@@ -49,6 +49,7 @@ export const Storelogin = defineStore("login", {
|
||||
rawData: infoRes.rawData,
|
||||
source: "wechat",
|
||||
});
|
||||
console.log('APIuserlogin',res);
|
||||
if (res) {
|
||||
this.token = res.token;
|
||||
this.miniAppOpenId = res.userInfo
|
||||
@@ -95,6 +96,9 @@ export const Storelogin = defineStore("login", {
|
||||
},
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
resolve(true)
|
||||
// #endif
|
||||
});
|
||||
},
|
||||
},
|
||||
@@ -115,6 +119,18 @@ export const productStore = defineStore("product", {
|
||||
getLocation() {
|
||||
return new Promise((resolve, reject) => {
|
||||
console.log("获取经纬度");
|
||||
// #ifdef H5
|
||||
resolve({
|
||||
accuracy: 65,
|
||||
altitude: 0,
|
||||
errMsg: "getLocation:ok",
|
||||
horizontalAccuracy: 65,
|
||||
latitude: 23.129163,
|
||||
longitude: 113.264435,
|
||||
speed: -1,
|
||||
verticalAccuracy: 65,
|
||||
});
|
||||
// #endif
|
||||
uni.getLocation({
|
||||
type: "wgs84",
|
||||
altitude: true,
|
||||
@@ -167,6 +183,13 @@ export const productStore = defineStore("product", {
|
||||
*/
|
||||
async scanCodeactions(q) {
|
||||
console.log("扫码内容", q);
|
||||
// #ifdef H5
|
||||
uni.navigateTo({
|
||||
url:'/pages/product/index'
|
||||
})
|
||||
return
|
||||
// #endif
|
||||
|
||||
return new Promise(async (resolve, reject) => {
|
||||
if (q) {
|
||||
console.log(q);
|
||||
@@ -206,7 +229,7 @@ export const productStore = defineStore("product", {
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// #ifdef APP || MP-WEIXIN || MP-ALIPAY
|
||||
// #ifdef APP || MP-WEIXIN || MP-ALIPAY
|
||||
uni.scanCode({
|
||||
success: async (res) => {
|
||||
let tableCode = this.getQueryString(
|
||||
@@ -298,11 +321,11 @@ export const productStore = defineStore("product", {
|
||||
]) {
|
||||
resolve(
|
||||
true
|
||||
);
|
||||
);
|
||||
} else {
|
||||
reject(
|
||||
false
|
||||
);
|
||||
);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
97
userPackage/components/modal.vue
Normal file
97
userPackage/components/modal.vue
Normal file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<view>
|
||||
<up-popup
|
||||
:show="show"
|
||||
mode="center"
|
||||
:safeAreaInsetBottom="mode === 'bottom' ? true : false"
|
||||
>
|
||||
<view class="popup-content">
|
||||
<view class="top u-flex u-row-between">
|
||||
<text class="font-bold u-font-32 color-333">{{ title }}</text>
|
||||
<up-icon size="18" name="close" @click="show = false"></up-icon>
|
||||
</view>
|
||||
<up-line></up-line>
|
||||
<scroll-view style="max-height: 50vh" :scroll-y="true">
|
||||
<slot></slot>
|
||||
</scroll-view>
|
||||
<template v-if="showBottom">
|
||||
<up-line></up-line>
|
||||
|
||||
<view class="bottom">
|
||||
<view class="btn cancel" @click="close">{{ cancelText }}</view>
|
||||
<view class="btn success" @click="confirm">{{ confirmText }}</view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</up-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
mode: {
|
||||
type: String,
|
||||
default: "center",
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: "标题",
|
||||
},
|
||||
confirmText: {
|
||||
type: String,
|
||||
default: "确认",
|
||||
},
|
||||
cancelText: {
|
||||
type: String,
|
||||
default: "取消",
|
||||
},
|
||||
showBottom: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
});
|
||||
const show = defineModel({
|
||||
type: Boolean,
|
||||
default: false,
|
||||
});
|
||||
const emits = defineEmits(["close", "confirm"]);
|
||||
function close() {
|
||||
show.value = false;
|
||||
emits("close");
|
||||
}
|
||||
function confirm() {
|
||||
emits("confirm");
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.popup-content {
|
||||
background: #fff;
|
||||
width: 640rpx;
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
.top {
|
||||
padding: 40rpx 48rpx;
|
||||
}
|
||||
.bottom {
|
||||
padding: 48rpx 52rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 50rpx;
|
||||
.btn {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 18rpx 60rpx;
|
||||
border-radius: 100rpx;
|
||||
font-size: 32rpx;
|
||||
border: 2rpx solid transparent;
|
||||
&.success {
|
||||
background-color: $my-main-color;
|
||||
color: #fff;
|
||||
}
|
||||
&.cancel {
|
||||
border-color: $my-main-color;
|
||||
color: $my-main-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
109
userPackage/components/status.vue
Normal file
109
userPackage/components/status.vue
Normal file
@@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<!-- 显示中文状态名称,而非原始英文值 -->
|
||||
<text class="status" :class="returnClass">{{ statusName }}</text>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
// 接收父组件传入的英文状态值(ing/wait_verify等)
|
||||
const props = defineProps({
|
||||
status: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
})
|
||||
|
||||
// 状态映射表:英文值 → 中文名称 + 样式类
|
||||
const statusMap = ref([{
|
||||
name: '进行中', // 显示的中文
|
||||
value: 'ing', // 匹配的英文状态
|
||||
class: 'success' // 样式类
|
||||
},
|
||||
{
|
||||
name: '待核销',
|
||||
value: 'wait_verify',
|
||||
class: 'warning'
|
||||
},
|
||||
{
|
||||
name: '已核销',
|
||||
value: 'finish',
|
||||
class: 'primary' // 新增已核销专属样式
|
||||
},
|
||||
{
|
||||
name: '退款中',
|
||||
value: 'refunding',
|
||||
class: 'error' // 退款中复用error样式
|
||||
},
|
||||
{
|
||||
name: '已退款',
|
||||
value: 'refund',
|
||||
class: 'disabled' // 已退款复用error样式
|
||||
},
|
||||
{
|
||||
name: '已取消',
|
||||
value: 'cancel',
|
||||
class: 'disabled' // 新增已取消样式
|
||||
},
|
||||
{
|
||||
name: '超时',
|
||||
value: 'timeout',
|
||||
class: 'disabled' // 超时复用已取消样式
|
||||
}
|
||||
])
|
||||
|
||||
// 计算要显示的中文名称
|
||||
const statusName = computed(() => {
|
||||
const item = statusMap.value.find(v => v.value === props.status)
|
||||
return item ? item.name : props.status // 未匹配到则显示原始值
|
||||
})
|
||||
|
||||
// 计算要绑定的样式类
|
||||
const returnClass = computed(() => {
|
||||
const item = statusMap.value.find(v => v.value === props.status)
|
||||
return item ? item.class : ''
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.status {
|
||||
padding: 8rpx 18rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #333;
|
||||
font-size: 24rpx;
|
||||
|
||||
// 进行中
|
||||
&.success {
|
||||
border-color: rgba(123, 209, 54, 1);
|
||||
color: rgba(123, 209, 54, 1);
|
||||
background: rgba(123, 209, 54, 0.12);
|
||||
}
|
||||
|
||||
// 待核销
|
||||
&.warning {
|
||||
border-color: rgba(255, 141, 40, 1);
|
||||
color: rgba(255, 141, 40, 1);
|
||||
background: rgba(255, 141, 40, 0.12);
|
||||
}
|
||||
|
||||
// 已核销(新增)
|
||||
&.primary {
|
||||
border-color: rgba(41, 148, 255, 1);
|
||||
color: rgba(41, 148, 255, 1);
|
||||
background: rgba(41, 148, 255, 0.12);
|
||||
}
|
||||
|
||||
// 退款中/已退款
|
||||
&.error {
|
||||
border-color: #FF1C1C;
|
||||
color: #FF1C1C;
|
||||
background: rgba(255, 28, 28, 0.18);
|
||||
}
|
||||
|
||||
// 已取消/超时(新增)
|
||||
&.disabled {
|
||||
border-color: rgba(153, 153, 153, 1);
|
||||
color: rgba(153, 153, 153, 1);
|
||||
background: rgba(153, 153, 153, 0.12);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
356
userPackage/confirm-order/confirm-order.vue
Normal file
356
userPackage/confirm-order/confirm-order.vue
Normal file
@@ -0,0 +1,356 @@
|
||||
<template>
|
||||
<view class="min-page bg-f7 u-font-28 color-333 u-p-30">
|
||||
<view class="info">
|
||||
<view class="goods u-flex u-col-center u-p-t-22 u-p-b-22 ">
|
||||
<view class="img-box">
|
||||
<up-image width="158rpx" height="158rpx" radius="14rpx" :src="item.goodsImg"></up-image>
|
||||
<view class="tag" v-if="item.tieredDiscount&&item.tieredDiscount.length>0">阶梯优惠</view>
|
||||
</view>
|
||||
<view class=" u-flex-1 u-p-l-16 u-flex u-row-between u-col-center">
|
||||
<view>
|
||||
<view class="font-bold u-line-2 u-font-32">{{item.packageName}}</view>
|
||||
<view style="max-width: 336rpx;" class="u-line-1 u-m-t-10 color-666">{{item.description}}</view>
|
||||
|
||||
</view>
|
||||
<view class="u-p-l-10 ">
|
||||
<!-- <view class="color-333 no-wrap">
|
||||
数量:{{item.number}}
|
||||
</view> -->
|
||||
<view class=" font-bold price ">
|
||||
<text class="u-font-26"> ¥</text>
|
||||
<text class="u-font-40">{{item.price}}</text>
|
||||
</view>
|
||||
<view class=" old-price">
|
||||
¥{{item.originPrice}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="shop ">
|
||||
<view class="u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">可核销门店:</text>
|
||||
<text>{{item.shopName}}</text>
|
||||
</view>
|
||||
<view class="u-m-t-32 u-flex">
|
||||
<text style="min-width: 180rpx;" class="color-666">门店地址:</text>
|
||||
<text>{{item.shopAddress}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-32 up-border-top u-p-t-28 u-p-b-28">
|
||||
|
||||
<view class="u-flex u-row-between u-p-t-16 u-p-b-16">
|
||||
<text class="u-font-32 font-bold">支付方式</text>
|
||||
<text class="">微信支付</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
<view class="desc" v-if="item.tieredDiscount&&item.tieredDiscount.length>0">
|
||||
|
||||
<view class="u-flex u-row-between ">
|
||||
<view class="name">分享说明</view>
|
||||
<view class="u-flex color-666" @click="showDesc=!showDesc" style="align-items: baseline;">
|
||||
<text class="u-m-r-18">{{showDesc?'收起':'展开'}}</text>
|
||||
<view class="guodu" :class="{rotate:!showDesc}">
|
||||
<up-icon name="arrow-down" bold></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<template v-if="showDesc">
|
||||
<view class="u-m-t-26 text-center table" v-if="item.tieredDiscount">
|
||||
<view class="u-flex header color-666">
|
||||
<view class="u-flex-1 u-p-t-32 u-p-b-32">分享人数</view>
|
||||
<view class="u-flex-1 u-p-t-32 u-p-b-32">购买价格(元)</view>
|
||||
</view>
|
||||
<view class="u-flex row" v-for="(step,index) in item.tieredDiscount" :key="index">
|
||||
<view class="u-flex-1 u-p-t-32 u-p-b-32">{{step.peopleNum}}</view>
|
||||
<view class="u-flex-1 u-p-t-32 u-p-b-32">¥{{step.price}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-26">
|
||||
<view>
|
||||
分享期限(小时):{{item.expireHours}}
|
||||
</view>
|
||||
<view class="u-m-t-10">
|
||||
规定期限内的助力才会被计入
|
||||
</view>
|
||||
<view class="u-m-t-40">
|
||||
如何才是分享成功?被分享人只需要点击《助力》,提示助力成功后即可
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view style="height: 100px;"></view>
|
||||
<view class="u-flex bottom">
|
||||
<view>
|
||||
<text class="color-666">实付:</text>
|
||||
<text class="price">¥{{totalPayPrice}}</text>
|
||||
</view>
|
||||
<view class="btn" @click="payExchange">去支付</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as Api from '@/common/api/market/package.js'
|
||||
import {
|
||||
pay
|
||||
} from '@/utils/pay.js'
|
||||
import {
|
||||
getOpenId
|
||||
} from '@/utils/uniapp.js'
|
||||
|
||||
const imgs = {
|
||||
bg: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/d21f2dfd7bec44618f2d5e4b88372b08.png',
|
||||
pin: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/3947892924dd481782331513aff00eb3.png'
|
||||
}
|
||||
|
||||
const showDesc = ref(true)
|
||||
|
||||
const item = reactive({})
|
||||
onShow(() => {
|
||||
const data = uni.getStorageSync('group_buying_order')
|
||||
data.goodsImg = data.images[0]
|
||||
Object.assign(item, data)
|
||||
console.log(item)
|
||||
})
|
||||
|
||||
function dingyue() {
|
||||
return new Promise((revlove, reject) => {
|
||||
uni.requestSubscribeMessage({
|
||||
tmplIds: ['JGPAGmqcPEgWB6mvAl0SC5cMqr5H5Qjcim8JCpHAZd0',
|
||||
'F4OyUhe_ZQ9BR731jlkaN2QXAUaA3HBZuUeVPfraSz0'
|
||||
],
|
||||
success(res) {},
|
||||
complete() {
|
||||
revlove()
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
async function payExchange() {
|
||||
// await dingyue();
|
||||
uni.showLoading({
|
||||
title: '支付中……'
|
||||
})
|
||||
let paramId = item.paramId
|
||||
if (!paramId) {
|
||||
paramId = await Api.createOrder({
|
||||
packageId: item.id,
|
||||
shopId: item.shopId,
|
||||
})
|
||||
}
|
||||
if (!paramId) {
|
||||
return uni.showToast({
|
||||
title: '创建订单失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
const openId = await getOpenId()
|
||||
uni.hideLoading()
|
||||
if (openId) {
|
||||
Api.ppOrderPay({
|
||||
paramId,
|
||||
shopId: item.shopId,
|
||||
number: item.number,
|
||||
openId
|
||||
}).then(orderRes => {
|
||||
pay(orderRes.payInfo).then(res => {
|
||||
console.log(res)
|
||||
|
||||
if (res) {
|
||||
uni.redirectTo({
|
||||
url: '/userPackage/order/detail?orderId=' + paramId + '&shopId=' +
|
||||
item.shopId
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '购买失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '鉴权失败,开团失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
import {
|
||||
BigNumber
|
||||
} from "bignumber.js";
|
||||
const totalPrice = computed(() => {
|
||||
if (!item.groupPrice) {
|
||||
return 0;
|
||||
}
|
||||
return BigNumber(item.number).times(item.originalPrice).toNumber()
|
||||
})
|
||||
|
||||
const totalPayPrice = computed(() => {
|
||||
if (!item.price) {
|
||||
return 0;
|
||||
}
|
||||
return BigNumber(item.number).times(item.price).toNumber()
|
||||
})
|
||||
|
||||
|
||||
let shareItem = null
|
||||
|
||||
function share(item) {
|
||||
shareItem = item
|
||||
}
|
||||
onShareAppMessage(() => {
|
||||
console.log('onShareAppMessage')
|
||||
console.log(shareItem)
|
||||
const query = `groupOrderNo=${shareItem.groupOrderNo}&shopId=${shareItem.shopId}`
|
||||
return wxShare({
|
||||
title: shareItem.wareJson.wareName,
|
||||
imageUrl: shareItem.goodsImg,
|
||||
path: '/groupBuying/detail/index' + '?' + query,
|
||||
query,
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.info {
|
||||
border-radius: 16rpx;
|
||||
background-color: #fff;
|
||||
padding: 0 24rpx;
|
||||
|
||||
.goods {
|
||||
background-color: #fff;
|
||||
padding: 22rpx 0;
|
||||
|
||||
.pin {
|
||||
width: 60rpx;
|
||||
height: 38rpx;
|
||||
}
|
||||
|
||||
.tuan-members {
|
||||
padding: 0 16rpx 0 0;
|
||||
border-radius: 0 6rpx 6rpx 0;
|
||||
background: #4C2828;
|
||||
color: #f5d9ad;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
color: #666666;
|
||||
text-decoration-line: line-through;
|
||||
}
|
||||
}
|
||||
|
||||
.u-font-48 {
|
||||
font-size: 48rpx;
|
||||
}
|
||||
|
||||
.shop {
|
||||
padding: 16rpx 34rpx;
|
||||
margin: 32rpx 30rpx;
|
||||
background-color: #F8F8F8;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
padding: 42rpx 28rpx 60rpx 28rpx;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 14rpx 70rpx;
|
||||
border-radius: 200rpx;
|
||||
background: #E8AD7B;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.img-box {
|
||||
position: relative;
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background: #4C2828;
|
||||
border-radius: 12rpx 0 16rpx 0;
|
||||
color: #faeac6;
|
||||
font-size: 24rpx;
|
||||
font-weight: 700;
|
||||
padding: 4rpx 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.desc {
|
||||
padding: 32rpx 46rpx;
|
||||
background-color: #fff;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.name {
|
||||
font-weight: 700;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.table {
|
||||
border: 2rpx solid #EDEDED;
|
||||
border-radius: 8rpx;
|
||||
margin: 0 52rpx;
|
||||
|
||||
.header {
|
||||
background: #f8f8f88f;
|
||||
}
|
||||
|
||||
.row {
|
||||
border-top: 2rpx solid #EDEDED;
|
||||
|
||||
&:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rotate {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
884
userPackage/goodsDetail/goodsDetail.vue
Normal file
884
userPackage/goodsDetail/goodsDetail.vue
Normal file
@@ -0,0 +1,884 @@
|
||||
<template>
|
||||
<view class="color-333 u-font-28 min-page bg-f7" v-if="item.id">
|
||||
<view class="relative">
|
||||
<up-swiper height="428rpx" :list="item.images" @click="prveImg"></up-swiper>
|
||||
<view class="share-box">
|
||||
分享
|
||||
<button class="share" open-type="share">分享</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="sku">
|
||||
<view class="u-flex u-col-center">
|
||||
<text class="price">¥{{item.price}}</text>
|
||||
<text class="old-price">¥{{item.originPrice}}</text>
|
||||
</view>
|
||||
<view>
|
||||
<view class="u-m-t-16 text" v-if="item.limitBuyNum"> 限购{{item.limitBuyNum}}份 </view>
|
||||
<view class="text u-m-t-10">已售:{{item.saleNum||0}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods">
|
||||
<view class="goods-name">{{item.packageName}}</view>
|
||||
<view class="u-m-t-20 color-666">
|
||||
{{item.description}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-f7" style="height: 32rpx"></view>
|
||||
<view class="desc">
|
||||
<view class="u-flex">
|
||||
<view class="color-666 no-wrap" style="min-width: 180rpx;">可核销门店:</view>
|
||||
<view class="">{{item.shopName}}</view>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-16 u-col-baseline">
|
||||
<view class="color-666 no-wrap" style="min-width: 180rpx;">门店地址:</view>
|
||||
<view class="">{{item.shopAddress}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<template v-if="flase">
|
||||
<view class="bg-f7" style="height: 32rpx"></view>
|
||||
<view class="groups">
|
||||
<view class="color-000 u-m-b-28 u-font-32 font-700">立即拼团</view>
|
||||
<view class="item u-flex" v-for="(item,index) in item.gbOrderList" :key="index">
|
||||
<up-avatar size="76rpx" :src="item.avatar"></up-avatar>
|
||||
<view class="u-flex u-flex-1 u-p-l-22 u-col-center u-row-between">
|
||||
<view>
|
||||
<view class="color-000 u-line-1" style="max-width: 180rpx;">{{item.nickName}}</view>
|
||||
<view class="main-color u-m-t-2">差{{returnNeedPerpole(item)}}人拼成</view>
|
||||
</view>
|
||||
<view class="u-m-t-22">
|
||||
<text class="color-666">剩余:</text>
|
||||
<text class="main-color">{{getRemainingHMS(item)}}</text>
|
||||
</view>
|
||||
|
||||
<view class="btn" @click="fastBuy(item)">快速拼成</view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
<view class="bg-f7" style="height: 24rpx"></view>
|
||||
<view class="goods-group">
|
||||
<view class="u-flex u-row-between">
|
||||
<view class="name">套餐商品</view>
|
||||
<view class="u-flex color-666" @click="showGroup=!showGroup" style="align-items: baseline;">
|
||||
<text class="u-m-r-18">{{showGroup?'收起':'展开'}}</text>
|
||||
<view class="guodu" :class="{rotate:!showGroup}">
|
||||
<up-icon name="arrow-down" bold></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="u-m-t-36" v-if="showGroup">
|
||||
<view v-for="(item,index) in item.packageContent" :key="index">
|
||||
<view class="">
|
||||
<text>{{item.name}}</text>
|
||||
<text class="u-m-l-30">{{item.packageProducts.length}}选{{item.num}}</text>
|
||||
</view>
|
||||
<view class="u-m-t-48">
|
||||
<view class="u-flex u-m-t-32 u-row-between" v-for="(goods,goodsIndex) in item.packageProducts"
|
||||
:key="goodsIndex">
|
||||
<text>{{goods.name}}</text>
|
||||
<view class="u-flex text-right">
|
||||
<text class="color-666 u-m-r-42">{{goods.num}}</text>
|
||||
<view style="min-width: 110rpx;">¥{{goods.price}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view class="desc" v-if="item.tieredDiscount&&item.tieredDiscount.length>0">
|
||||
<view class="u-flex u-row-between">
|
||||
<view class="name">分享说明</view>
|
||||
<view class="u-flex color-666" @click="showDesc=!showDesc" style="align-items: baseline;">
|
||||
<text class="u-m-r-18">{{showDesc?'收起':'展开'}}</text>
|
||||
<view class="guodu" :class="{rotate:!showDesc}">
|
||||
<up-icon name="arrow-down" bold></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<template v-if="showDesc">
|
||||
<view class="u-m-t-26 text-center table">
|
||||
<view class="u-flex header color-666">
|
||||
<view class="u-flex-1 u-p-t-32 u-p-b-32">分享人数</view>
|
||||
<view class="u-flex-1 u-p-t-32 u-p-b-32">购买价格(元)</view>
|
||||
</view>
|
||||
<view class="u-flex row" v-for="(step,index) in item.tieredDiscount" :key="index">
|
||||
<view class="u-flex-1 u-p-t-32 u-p-b-32">{{step.peopleNum}}</view>
|
||||
<view class="u-flex-1 u-p-t-32 u-p-b-32">¥{{step.price}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-26" >
|
||||
<view>
|
||||
分享期限(小时):{{item.expireHours}}
|
||||
</view>
|
||||
<view class="u-m-t-10">
|
||||
规定期限内的助力才会被计入
|
||||
</view>
|
||||
<view class="u-m-t-40">
|
||||
如何才是分享成功?被分享人只需要点击《助力》,提示助力成功后即可
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view class="desc">
|
||||
<view class="u-flex u-row-between">
|
||||
<view class="name">使用说明</view>
|
||||
<view class="u-flex color-666" @click="useDescShow=!useDescShow" style="align-items: baseline;">
|
||||
<text class="u-m-r-18">{{useDescShow?'收起':'展开'}}</text>
|
||||
<view class="guodu" :class="{rotate:!useDescShow}">
|
||||
<up-icon name="arrow-down" bold></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<template v-if="useDescShow">
|
||||
<view class="u-m-t-16 color-666">
|
||||
<view>
|
||||
1、可用时间段:{{canuseTime}}
|
||||
</view>
|
||||
<view v-if="item.otherDesc">
|
||||
2、其他使用说明:{{item.otherDesc}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view class="goods-detail" v-if="item.goodsCategory!='优惠券'">
|
||||
<view class="u-flex u-row-center">
|
||||
<view class="title">商品详情</view>
|
||||
</view>
|
||||
<view class="u-m-t-32">
|
||||
<image class="w-full" v-for="(item,index) in item.detailImages" :key="index" mode="widthFix" :src="item">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="height: 140px"></view>
|
||||
<view class="fixed-bottom ">
|
||||
<!-- <view v-if="isCanExchange" class="btn" @click="exchangeClick">
|
||||
{{returnBtmText}}
|
||||
</view> -->
|
||||
<view v-if="isCanExchange" class="btn" @click="payExchange">
|
||||
{{returnBtmText}}
|
||||
</view>
|
||||
<view class="btn gray u-m-t-32" @click="createOrder" v-if="item.tieredDiscount&&item.tieredDiscount.length>0">
|
||||
发起助力
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- 需要支付的弹窗 -->
|
||||
<up-popup :show="popupData.show" mode="bottom" closeOnClickOverlay @close="popupData.show = false">
|
||||
<view class="popup-content">
|
||||
<view class="popup-content-top u-flex u-row-right">
|
||||
<up-icon name="close" bold="" @click="popupData.show = false"></up-icon>
|
||||
</view>
|
||||
<view class="goods-info">
|
||||
<view class="u-flex">
|
||||
<image class="cover" :src="coverImgs[0]"></image>
|
||||
<view class="u-flex u-flex-1 u-row-between u-p-l-16 u-col-center">
|
||||
<view>
|
||||
<view class="u-font-32 font-bold">{{item.packageName}}</view>
|
||||
|
||||
<view class="u-m-t-12 color-666 u-line-2">{{item.otherDesc}}</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="price">¥{{item.price}}</view>
|
||||
<view class="old-price">¥{{item.originPrice}}</view>
|
||||
<view class="limitBuyNum" v-if="item.limitBuyNum"> 限购{{item.limitBuyNum}} </view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="bottom u-flex u-row-between u-col-center">
|
||||
<view class="u-flex u-col-baseline">
|
||||
<text class="color-666">合计:</text>
|
||||
<text class=" price">{{totalPrice}}</text>
|
||||
</view>
|
||||
<view class="u-flex">
|
||||
<up-icon name="minus-circle" size="20" color="#666" @click="changeNumber('-')"></up-icon>
|
||||
<text class="u-m-l-20 u-m-r-20">{{number}}</text>
|
||||
<up-icon name="plus-circle-fill" size="20" color="#ED5A2E" @click="changeNumber('+')"></up-icon>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-42 u-flex u-row-center">
|
||||
<view class="btn" @click="payExchange">去支付</view>
|
||||
</view>
|
||||
</view>
|
||||
</up-popup>
|
||||
<!-- 兑换确认弹窗end -->
|
||||
</view>
|
||||
</template>
|
||||
<script setup>
|
||||
import {
|
||||
Storelogin
|
||||
} from '@/stores/user.js';
|
||||
const storelogin = Storelogin();
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
watch
|
||||
} from "vue";
|
||||
import dayjs from "dayjs";
|
||||
import {
|
||||
wxShare
|
||||
} from '@/utils/share.js'
|
||||
import {
|
||||
getOpenId
|
||||
} from '@/utils/uniapp.js'
|
||||
import modal from "@/groupBuying/components/modal.vue";
|
||||
import * as Api from '@/common/api/market/package.js'
|
||||
import {
|
||||
pay
|
||||
} from '@/utils/pay.js'
|
||||
const imgs = {
|
||||
bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/9fd6a3ad2b384f6cb4e88ed6b77bd334.png",
|
||||
};
|
||||
const number = ref(1)
|
||||
|
||||
const showGroup = ref(true)
|
||||
const showDesc = ref(true)
|
||||
const useDescShow=ref(true)
|
||||
|
||||
import {
|
||||
BigNumber
|
||||
} from "bignumber.js";
|
||||
const totalPrice = computed(() => {
|
||||
if (!item.price) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
return BigNumber(number.value).times(item.price).toNumber()
|
||||
})
|
||||
|
||||
function changeNumber(step) {
|
||||
if (step === '-') {
|
||||
if (number.value == 1) {
|
||||
return
|
||||
}
|
||||
number.value--
|
||||
return
|
||||
}
|
||||
if (step === '+') {
|
||||
if (item.limitBuyNum == -10086) {
|
||||
number.value++
|
||||
return
|
||||
}
|
||||
if (number.value >= item.limitBuyNum) {
|
||||
return uni.showToast({
|
||||
title: '最多可购买' + item.limitBuyNum + '份',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
number.value++
|
||||
return
|
||||
}
|
||||
}
|
||||
const modalData = reactive({
|
||||
show: false,
|
||||
});
|
||||
|
||||
function prveImg(index) {
|
||||
uni.previewImage({
|
||||
urls: coverImgs.value,
|
||||
current: index
|
||||
})
|
||||
}
|
||||
|
||||
const popupData = reactive({
|
||||
show: false,
|
||||
item: null
|
||||
});
|
||||
|
||||
function exchangeClick() {
|
||||
popupData.show = true
|
||||
|
||||
}
|
||||
|
||||
function fastBuy(item) {
|
||||
popupData.item = item;
|
||||
popupData.show = true
|
||||
}
|
||||
watch(() => popupData.show, (newval) => {
|
||||
if (!newval) {
|
||||
popupData.item = null
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
function dingyue() {
|
||||
return new Promise((revlove, reject) => {
|
||||
uni.requestSubscribeMessage({
|
||||
tmplIds: ['JGPAGmqcPEgWB6mvAl0SC5cMqr5H5Qjcim8JCpHAZd0',
|
||||
'F4OyUhe_ZQ9BR731jlkaN2QXAUaA3HBZuUeVPfraSz0'
|
||||
],
|
||||
success(res) {},
|
||||
complete() {
|
||||
revlove()
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
async function createOrder(){
|
||||
Api.createOrder({
|
||||
packageId:item.id,
|
||||
shopId: item.shopId,
|
||||
}).then(res=>{
|
||||
if(res){
|
||||
uni.navigateTo({
|
||||
url:'/userPackage/order/detail?orderId='+res
|
||||
})
|
||||
}else{
|
||||
uni.showToast({
|
||||
title:'发起助力失败',
|
||||
icon:'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
async function payExchange() {
|
||||
uni.setStorageSync('group_buying_order', {
|
||||
...item,
|
||||
number: number.value,
|
||||
})
|
||||
uni.navigateTo({
|
||||
url: '/userPackage/confirm-order/confirm-order'
|
||||
})
|
||||
return
|
||||
await dingyue();
|
||||
uni.showLoading({
|
||||
title: '支付中……'
|
||||
})
|
||||
const openId = await getOpenId()
|
||||
uni.hideLoading()
|
||||
if (openId) {
|
||||
Api.exchange({
|
||||
paramId: item.id,
|
||||
shopId: item.shopId,
|
||||
number: number.value,
|
||||
groupOrderNo: popupData.item ? popupData.item.groupOrderNo : '',
|
||||
openId
|
||||
}).then(orderRes => {
|
||||
popupData.show = false;
|
||||
pay(orderRes.payInfo).then(res => {
|
||||
console.log(res)
|
||||
|
||||
if (res) {
|
||||
uni.redirectTo({
|
||||
url: '/groupBuying/success/index?detailId=' + orderRes.record
|
||||
.id
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '开团失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '鉴权失败,兑换失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const item = reactive({
|
||||
goodsDescription: []
|
||||
})
|
||||
|
||||
const isCanExchange = computed(() => {
|
||||
|
||||
if (item.quantity <= 0) {
|
||||
return false
|
||||
}
|
||||
if (item.limitQuota && item.boughtCount >= item.limitQuota) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
})
|
||||
|
||||
const returnBtmText = computed(() => {
|
||||
if (isCanExchange.value) {
|
||||
return '立即购买'
|
||||
}
|
||||
if (pointsUser.pointBalance < item.requiredPoints) {
|
||||
const num = item.requiredPoints - pointsUser.pointBalance
|
||||
return `积分不足,还差${num}积分`
|
||||
}
|
||||
if (item.quantity <= 0) {
|
||||
return `库存不足`
|
||||
}
|
||||
if (item.limitQuota && item.boughtCount >= item.limitQuota) {
|
||||
return `单人兑换已达上限`
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
const query = reactive({
|
||||
shopId: '',
|
||||
id: '',
|
||||
})
|
||||
|
||||
|
||||
const coverImgs = ref([])
|
||||
|
||||
async function init(opt) {
|
||||
// 获取小程序进入场景和参数
|
||||
const launchOptions = uni.getLaunchOptionsSync();
|
||||
console.log(launchOptions);
|
||||
// 获取链接上的参数
|
||||
const launchOptionsQuery = launchOptions.query;
|
||||
console.log('launchOptionsQuery', launchOptionsQuery);
|
||||
Object.assign(query, launchOptionsQuery)
|
||||
console.log(opt)
|
||||
Object.assign(query, opt)
|
||||
console.log(query)
|
||||
await storelogin.actionslogin()
|
||||
getDetail()
|
||||
}
|
||||
|
||||
function getDetail() {
|
||||
Api.getPackageDetail(query).then(res => {
|
||||
Object.assign(item, res)
|
||||
console.log(item)
|
||||
coverImgs.value = res.images
|
||||
uni.cache.set('shopId', item.shopId)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 计算剩余时间差(毫秒)
|
||||
* @param {Object} item - 包含groupEndTime的订单/拼团对象
|
||||
* @returns {number} 剩余时间(毫秒)
|
||||
*/
|
||||
function returnRemainingTime(item) {
|
||||
if (!item?.groupEndTime) return 0; // 容错:无结束时间则返回0
|
||||
return dayjs(item.groupEndTime).valueOf() - dayjs().valueOf();
|
||||
}
|
||||
|
||||
/**
|
||||
* 将毫秒差格式化为 HH:MM:SS(最多72小时)
|
||||
* @param {number} ms - 时间差(毫秒)
|
||||
* @returns {string} 格式化后的时分秒(如 09:09:09、72:00:00、00:00:00)
|
||||
*/
|
||||
function formatTimeToHMS(ms) {
|
||||
// 边界1:已过期/无剩余时间 → 显示00:00:00
|
||||
if (ms <= 0) return '00:00:00';
|
||||
|
||||
// 边界2:超过72小时 → 按72小时算(72*60*60*1000 = 259200000毫秒)
|
||||
const maxMs = 72 * 60 * 60 * 1000;
|
||||
const validMs = Math.min(ms, maxMs);
|
||||
|
||||
// 转换为总秒数(取整,避免小数)
|
||||
const totalSeconds = Math.floor(validMs / 1000);
|
||||
|
||||
// 拆解小时、分钟、秒
|
||||
const hours = Math.floor(totalSeconds / 3600);
|
||||
const remainingSeconds = totalSeconds % 3600;
|
||||
const minutes = Math.floor(remainingSeconds / 60);
|
||||
const seconds = remainingSeconds % 60;
|
||||
|
||||
// 补零(确保两位数,如 9 → 09)
|
||||
const pad = (num) => String(num).padStart(2, '0');
|
||||
return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`;
|
||||
}
|
||||
|
||||
|
||||
let timer = null
|
||||
let nowTime = ref(Date.now())
|
||||
timer = setInterval(() => {
|
||||
nowTime.value = Date.now()
|
||||
}, 1000)
|
||||
|
||||
// 组合使用:获取格式化后的剩余时间
|
||||
function getRemainingHMS(item) {
|
||||
nowTime.value
|
||||
const ms = returnRemainingTime(item);
|
||||
return formatTimeToHMS(ms);
|
||||
}
|
||||
|
||||
|
||||
function returnNeedPerpole(data) {
|
||||
return data.groupPeopleNum - data.currentPeopleNum
|
||||
}
|
||||
|
||||
|
||||
onLoad(init)
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.showShareMenu()
|
||||
// #endif
|
||||
onShareAppMessage(() => {
|
||||
const query = `id=${item.id}&shopId=${item.shopId}`
|
||||
return wxShare({
|
||||
title: item.wareName,
|
||||
imageUrl: coverImgs.value[0],
|
||||
path: '/userPackage/goodsDetail/goodsDetail' + '?' + query,
|
||||
query,
|
||||
})
|
||||
})
|
||||
|
||||
const canuseTime=computed(()=>{
|
||||
return item.useWeeks.join('、')+' '+item.useTimes
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$topHeight: 350rpx;
|
||||
|
||||
.top-img {
|
||||
width: 750rpx;
|
||||
height: $topHeight;
|
||||
}
|
||||
|
||||
.top {
|
||||
margin: 14rpx 18rpx;
|
||||
background-size: cover;
|
||||
height: $topHeight;
|
||||
box-sizing: border-box;
|
||||
padding-left: 70rpx;
|
||||
padding-top: 95rpx;
|
||||
|
||||
.name {
|
||||
color: #000000;
|
||||
font-size: 36rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.info {
|
||||
color: #333333;
|
||||
font-size: 48rpx;
|
||||
font-weight: 700;
|
||||
margin-top: 62rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sku {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 36rpx;
|
||||
align-items: center;
|
||||
background: linear-gradient(90deg, #ff4a63 0%, #fd1f48 100%);
|
||||
|
||||
.price {
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
margin-left: 16rpx;
|
||||
color: #E7E7E7;
|
||||
opacity: .85;
|
||||
font-weight: 700;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goods {
|
||||
padding: 20rpx 28rpx;
|
||||
background: #fff;
|
||||
|
||||
.goods-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.desc {
|
||||
padding: 32rpx 28rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.goods-detail {
|
||||
padding: 32rpx;
|
||||
|
||||
.title {
|
||||
position: relative;
|
||||
padding: 0 22rpx;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 100%;
|
||||
width: 70rpx;
|
||||
height: 2rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
background: linear-gradient(90deg, #f7f8f9 0%, #c9cbcc 100%);
|
||||
}
|
||||
|
||||
&::after {
|
||||
left: 100%;
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
display: block;
|
||||
width: 70rpx;
|
||||
height: 2rpx;
|
||||
background: linear-gradient(90deg, #c9cbcc 0%, #f7f8f9 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixed-bottom {
|
||||
position: fixed;
|
||||
left: 98rpx;
|
||||
right: 98rpx;
|
||||
padding-bottom: 30px;
|
||||
padding-top: 32rpx;
|
||||
bottom: 0;
|
||||
z-index: 10;
|
||||
|
||||
.btn {
|
||||
padding: 22rpx;
|
||||
border-radius: 200rpx;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
width: 556rpx;
|
||||
text-align: center;
|
||||
background-color: #E8AD7B;
|
||||
border: 1px solid transparent;
|
||||
|
||||
&.gray {
|
||||
background: #fff;
|
||||
color: #E8AD7B;
|
||||
border-color: #E8AD7B;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.waring {
|
||||
background-color: rgba(255, 204, 0, 0.09);
|
||||
padding: 32rpx 24rpx;
|
||||
color: #ff8d28;
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
font-size: 28rpx;
|
||||
min-height: 300px;
|
||||
|
||||
.popup-content-top {
|
||||
padding: 32rpx 28rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
}
|
||||
|
||||
.goods-info {
|
||||
padding: 32rpx 28rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
|
||||
.cover {
|
||||
width: 184rpx;
|
||||
height: 184rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #d9d9d9;
|
||||
|
||||
&.bg-fff {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #ed5a2e;
|
||||
line-height: 46rpx;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
font-size: 32rpx;
|
||||
color: #999;
|
||||
text-decoration-line: line-through;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.limitBuyNum {
|
||||
color: #666;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bottom {
|
||||
padding: 20rpx;
|
||||
border-bottom: 1px solid #ededed;
|
||||
|
||||
.price {
|
||||
color: #ed5a2e;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
padding: 22rpx 214rpx;
|
||||
align-items: flex-start;
|
||||
gap: 20rpx;
|
||||
border-radius: 66rpx;
|
||||
background: #e8ad7b;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
font-size: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.groups {
|
||||
padding: 28rpx 22rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
padding: 28rpx 0;
|
||||
border-bottom: 2rpx solid #EDEDED;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.main-color {
|
||||
color: #ed5a2e;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 8rpx 26rpx;
|
||||
border-radius: 36rpx;
|
||||
background: #E8AD7B;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.share-box {
|
||||
top: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
padding: 4rpx 30rpx;
|
||||
border-radius: 0 0 0 24rpx;
|
||||
color: #ed5a2e;
|
||||
font-weight: 700;
|
||||
background: #FFF;
|
||||
overflow: hidden;
|
||||
|
||||
.share {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-group {
|
||||
padding: 32rpx 46rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.name {
|
||||
font-weight: 700;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.rotate {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
.desc {
|
||||
padding: 32rpx 46rpx;
|
||||
background-color: #fff;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.name {
|
||||
font-weight: 700;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.table {
|
||||
border: 2rpx solid #EDEDED;
|
||||
border-radius: 8rpx;
|
||||
margin: 0 52rpx;
|
||||
|
||||
.header {
|
||||
background: #f8f8f88f;
|
||||
}
|
||||
|
||||
.row {
|
||||
border-top: 2rpx solid #EDEDED;
|
||||
|
||||
&:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rotate {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
.guodu {
|
||||
transition: all .3s;
|
||||
}
|
||||
</style>
|
||||
25
userPackage/index/components/perpole-number.vue
Normal file
25
userPackage/index/components/perpole-number.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
|
||||
<view class="u-flex box">
|
||||
<text class="color-333" v-if="modelValue">modelValue</text>
|
||||
<text v-else class="color-999">成团人数</text>
|
||||
<view class="u-flex u-m-l-20">
|
||||
<up-icon name="arrow-down" color="#999" size="14"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
const modelValue=defineModel({
|
||||
default:''
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.box{
|
||||
padding: 12rpx 24rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #DDDFE6;
|
||||
}
|
||||
</style>
|
||||
861
userPackage/index/index.vue
Normal file
861
userPackage/index/index.vue
Normal file
@@ -0,0 +1,861 @@
|
||||
<template>
|
||||
<view class="min-page bg-f7 u-font-28">
|
||||
<up-sticky :offsetTop="0" :customNavHeight="0">
|
||||
<view class="top" :style="topStyle">
|
||||
<up-navbar bg-color="transparent" :fixed="false" :placeholder="false" title="套餐推广" @leftClick="back()"
|
||||
left-icon-color="#fff" title-color="#fff"></up-navbar>
|
||||
<view class="u-flex info u-col-center">
|
||||
<image :src="imgs.map" class="map"></image>
|
||||
<view class="u-line-1 u-m-l-20">{{shopInfo.shopName||''}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="">
|
||||
|
||||
<view class="filters ">
|
||||
<view class="u-flex tabs">
|
||||
<view class="tab" v-for="(item,index) in tabs.list" :class="{'active':tabs.sel==index}"
|
||||
@click="tabs.sel=index">{{item}}</view>
|
||||
</view>
|
||||
|
||||
<view class="u-flex u-col-center" v-if="tabs.sel==0">
|
||||
<up-search v-model="query.packageName" @search="refresh" @clear="refresh"
|
||||
@custom="refresh"></up-search>
|
||||
<!-- <perpoleNumber v-model="query.groupPeopleNum"></perpoleNumber> -->
|
||||
</view>
|
||||
<view class="u-flex orderStatus" v-if="tabs.sel==1">
|
||||
<view class="orderState" :class="{'active':orders.sel==index}"
|
||||
v-for="(item,index) in orders.list" :key="index" @click="orders.sel=index">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</up-sticky>
|
||||
|
||||
|
||||
<view class="lists" v-if="tabs.sel==0">
|
||||
<view class="item" v-for="(item,index) in list" :key="index" @click="toDetail(item)">
|
||||
<view class="relative img-box">
|
||||
<up-image width="218rpx" radius="16rpx" height="218rpx" :src="returnCoverImg(item)"></up-image>
|
||||
<view class="tag" v-if="isHasDiscount(item)">阶梯优惠</view>
|
||||
</view>
|
||||
<view class="u-flex-1 u-p-l-16" style="max-width: 416rpx;">
|
||||
<view class="u-line-1 name">{{item.packageName}}</view>
|
||||
<view class="desc u-line-1 u-m-t-10">
|
||||
{{item.description}}
|
||||
</view>
|
||||
<view class="sale-number">已售{{item.saleNum||0}}</view>
|
||||
<view class="info ">
|
||||
<view class="left u-flex u-col-baseline">
|
||||
<text class="u-font-24" v-if="isHasDiscount(item)">最低到手</text>
|
||||
<text class="u-font-40 font-bold"> ¥{{minPrice(item)}}</text>
|
||||
<text class="color-999 old-price"> ¥{{item.originPrice}}</text>
|
||||
|
||||
</view>
|
||||
<view class="right">
|
||||
<image class="pin" :src="imgs.pin"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="orders" v-else-if="tabs.sel==1">
|
||||
<view class="item" v-for="(item,index) in list" :key="index" @click="toOrderDetail(item)">
|
||||
<view class="u-flex u-col-center u-row-between">
|
||||
</view>
|
||||
<view class="u-m-t-32 u-flex">
|
||||
<view class="img-box">
|
||||
<up-image width="174rpx" height="174rpx" radius="12rpx" :src="item.goodsImg"></up-image>
|
||||
<view class="tag" v-if="isHasDiscount(item)">阶梯优惠</view>
|
||||
</view>
|
||||
<view class="u-flex-1 u-flex u-p-l-30 u-col-center u-row-between">
|
||||
<view style="max-width: 336rpx;">
|
||||
<view class="u-line-2 font-bold u-font-32">{{item.packageName}}</view>
|
||||
<view class="u-line-1 u-m-t-10 color-666" >{{item.packageName}}
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<statusVue :status="item.status"></statusVue>
|
||||
<view class="u-m-t-16">
|
||||
<template v-if="item.status=='ing'||item.status=='timeout'">
|
||||
<view class=" main-color main-color">
|
||||
当前到手
|
||||
</view>
|
||||
<view class=" font-bold price main-color u-m-t-4">
|
||||
<text class="u-font-26"> ¥</text>
|
||||
<text class="u-font-40">{{nowPrice(item)}}</text>
|
||||
</view>
|
||||
<view class=" main-color old-price" v-if="item">
|
||||
¥{{item.originPrice}}
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<template v-if="item&&item.finalPrice">
|
||||
<view class=" font-bold price main-color" >
|
||||
<text class="u-font-26"> ¥</text>
|
||||
<text class="u-font-40">{{item.finalPrice}}</text>
|
||||
</view>
|
||||
<view class=" main-color old-price" >
|
||||
¥{{item.originPrice}}
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view class=" font-bold price main-color" >
|
||||
<text class="u-font-26"> ¥</text>
|
||||
<text class="u-font-40">{{item.price}}</text>
|
||||
</view>
|
||||
<view class=" main-color old-price" >
|
||||
¥{{item.originPrice}}
|
||||
</view>
|
||||
</template>
|
||||
</template>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
<view class="u-m-t-32 info">
|
||||
<view class="u-flex u-col-center">
|
||||
<text class="title">可核销门店:</text>
|
||||
<text class="stitle">{{item.shopName}}</text>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-32 u-col-center">
|
||||
<text class="title ">门店地址:</text>
|
||||
<text class="stitle">{{item.shopAddress}}</text>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-32 u-col-center u-row-between" v-if="showTime(item)">
|
||||
<view>
|
||||
<text class="title">剩余分享时间:</text>
|
||||
<text class="stitle price">{{returnTime(item)}}</text>
|
||||
</view>
|
||||
<text class="u-font-24 color-666 font-bold">已成功分享{{item.shareNum}}人</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btns" v-if="item&&item.status">
|
||||
|
||||
<template v-if="item.status=='ing'">
|
||||
<view class="btn " @click.stop="cancelOrder(item)">取消活动</view>
|
||||
<view class="btn " @click.stop="nowBuy(item)">立即购买</view>
|
||||
<button class="btn black" open-type="share" @click.stop="share(item)">分享</button>
|
||||
</template>
|
||||
<template v-if="item.status=='timeout'">
|
||||
<view class="btn " @click.stop="cancelOrder(item)">取消活动</view>
|
||||
<view class="btn " @click.stop="nowBuy(item)">立即购买</view>
|
||||
</template>
|
||||
<template v-if="item.status=='wait_verify'">
|
||||
<view class="btn " @click.stop="refund(item)">申请退款</view>
|
||||
<button class="btn black" @click.stop="lookCode(item)">查看券码</button>
|
||||
</template>
|
||||
<template v-if="item.status=='refunding'">
|
||||
<view class="btn " @click.stop="lookCode(item)">查看券码</view>
|
||||
<button class="btn black" @click.stop="cancelRefund(item)">取消退款</button>
|
||||
</template>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<LookQrcode v-model="modalData.show" :qrcode="qrcode"></LookQrcode>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
back
|
||||
} from '@/utils/uniapp.js'
|
||||
import LookQrcode from "@/components/look-qrcode/look-qrcode.vue";
|
||||
import {
|
||||
wxShare
|
||||
} from '@/utils/share.js'
|
||||
import {
|
||||
getRemainingHMS
|
||||
} from '@/utils/countdown.js'
|
||||
import {
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import * as Api from '@/common/api/market/package.js'
|
||||
import perpoleNumber from './components/perpole-number.vue'
|
||||
import statusVue from '@/userPackage/components/status.vue'
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
watch
|
||||
} from 'vue'
|
||||
|
||||
import {
|
||||
APIusershopInfodetail
|
||||
} from '@/common/api/member.js'
|
||||
|
||||
|
||||
// 判断是否有阶梯优惠
|
||||
function isHasDiscount(item) {
|
||||
return item.tieredDiscount && item.tieredDiscount.length
|
||||
}
|
||||
const canRefundStatus = ['待成团', '待核销']
|
||||
|
||||
function canRefund(item) {
|
||||
if (canRefundStatus.includes(item.status)) {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
const modalData = reactive({
|
||||
show: false,
|
||||
});
|
||||
const qrcode = ref("");
|
||||
|
||||
function lookCode(item) {
|
||||
qrcode.value = item.verifyCode
|
||||
modalData.show = true;
|
||||
}
|
||||
|
||||
const imgs = {
|
||||
bg: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/dd298d6a503d432f832f3c7c2bb7fb0e.png',
|
||||
bg1: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/604c3f917daa41af9239145196c6d3f3.png',
|
||||
map: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/0a293f6e1a6a4e7b956379a5b6701104.png',
|
||||
pin: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/5/8eaf3bdd44ce422889e5feeb30bcb2ea.png'
|
||||
}
|
||||
|
||||
const shopInfo = ref(uni.cache.get('shopInfo'))
|
||||
|
||||
const steps = ['发起拼团', '邀请好友', '成团优惠']
|
||||
|
||||
const topStyle = {
|
||||
backgroundImage: 'url(' + imgs.bg + ')'
|
||||
}
|
||||
const tabs = reactive({
|
||||
list: ['活动列表', '我的活动'],
|
||||
sel: 0
|
||||
})
|
||||
const orders = reactive({
|
||||
list: [{
|
||||
name: '全部',
|
||||
value: ''
|
||||
},
|
||||
{
|
||||
name: '进行中',
|
||||
value: 'ing'
|
||||
},
|
||||
{
|
||||
name: '待核销',
|
||||
value: 'wait_verify'
|
||||
},
|
||||
{
|
||||
name: '已核销',
|
||||
value: 'finish'
|
||||
},
|
||||
{
|
||||
name: '退款',
|
||||
value: 'ref'
|
||||
},
|
||||
],
|
||||
sel: 0
|
||||
})
|
||||
|
||||
const query = reactive({
|
||||
page: 1,
|
||||
size: 10,
|
||||
packageName: '',
|
||||
groupPeopleNum: '',
|
||||
shopId: uni.cache.get('shopId'),
|
||||
})
|
||||
|
||||
const list = ref([])
|
||||
const isEnd = ref(false)
|
||||
|
||||
const status = computed(() => {
|
||||
return orders.list[orders.sel].value
|
||||
})
|
||||
|
||||
watch(() => status.value, () => {
|
||||
refresh()
|
||||
})
|
||||
|
||||
async function nowBuy(item) {
|
||||
uni.setStorageSync('group_buying_order', {
|
||||
...item,
|
||||
number: 1,
|
||||
price: nowPrice(item),
|
||||
paramId: item.id
|
||||
})
|
||||
uni.navigateTo({
|
||||
url: '/userPackage/confirm-order/confirm-order'
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function getData() {
|
||||
if (tabs.sel == 0) {
|
||||
Api.getPackage(query).then(res => {
|
||||
const newArr = res.records || []
|
||||
if (query.page == 1) {
|
||||
list.value = newArr
|
||||
} else {
|
||||
list.value.push(...newArr)
|
||||
}
|
||||
isEnd.value = query.page >= res.totalPage * 1 ? true : false
|
||||
})
|
||||
return
|
||||
}
|
||||
if (tabs.sel == 1) {
|
||||
const {
|
||||
page,
|
||||
size,
|
||||
shopId
|
||||
} = query
|
||||
Api.order({
|
||||
page,
|
||||
size,
|
||||
shopId,
|
||||
status: status.value,
|
||||
}).then(res => {
|
||||
const newArr = (res.records || []).map(v => {
|
||||
return {
|
||||
...v,
|
||||
goodsImg: v.images[0],
|
||||
}
|
||||
})
|
||||
|
||||
if (query.page == 1) {
|
||||
list.value = newArr
|
||||
} else {
|
||||
list.value.push(...newArr)
|
||||
}
|
||||
console.log(list.value)
|
||||
isEnd.value = query.page >= res.totalPage * 1 ? true : false
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
function toDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: '/userPackage/goodsDetail/goodsDetail?id=' + item.id + '&shopId=' + item.shopId
|
||||
})
|
||||
}
|
||||
|
||||
function toOrderDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: '/userPackage/order/detail?orderId=' + item.id + '&shopId=' + item.shopId
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function returnCoverImg(item) {
|
||||
if (!item.images) {
|
||||
return ''
|
||||
}
|
||||
return item.images[0]
|
||||
}
|
||||
|
||||
function nowPrice(item) {
|
||||
|
||||
if (!item.tieredDiscount.length) {
|
||||
return 0
|
||||
}
|
||||
let nowStep = null
|
||||
for (let i in item.tieredDiscount) {
|
||||
const nowItem = item.tieredDiscount[i]
|
||||
const nextItem = item.tieredDiscount[i + 1]
|
||||
if (!nextItem) {
|
||||
if (item.shareNum >= nowItem.peopleNum) {
|
||||
nowStep = nowItem
|
||||
}
|
||||
} else {
|
||||
if (item.shareNum >= nowItem.peopleNum && item.shareNum < nextItem.peopleNum) {
|
||||
nowStep = nowItem
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log('nowStep', nowStep);
|
||||
return nowStep ? nowStep.price : item.price
|
||||
}
|
||||
|
||||
|
||||
function refresh() {
|
||||
query.page = 1
|
||||
isEnd.value = false
|
||||
getData()
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function cancelOrder(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否取消该活动?',
|
||||
showCancel: true,
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
Api.cancel({
|
||||
orderId: item.id,
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '取消成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
refresh()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function refund(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否申请退款?',
|
||||
showCancel: true,
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
Api.applyRefund({
|
||||
recordId: item.id,
|
||||
orderNo: item.orderNo,
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '申请成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
refresh()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function cancelRefund(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否取消退款?',
|
||||
showCancel: true,
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
Api.cancelRefund({
|
||||
recordId: item.id,
|
||||
orderNo: item.orderNo,
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '取消成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
refresh()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
watch(() => tabs.sel, (newval) => {
|
||||
orders.sel = 0
|
||||
refresh()
|
||||
})
|
||||
|
||||
function showBtns(item) {
|
||||
if (item.status == '已退款') {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
function showShare(item) {
|
||||
if (item.status == '待成团') {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
function showTime(item) {
|
||||
if (item.status == 'ing') {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
|
||||
let shareItem = null
|
||||
|
||||
function share(item) {
|
||||
shareItem = item
|
||||
}
|
||||
|
||||
onShareAppMessage(() => {
|
||||
console.log('onShareAppMessage')
|
||||
console.log(shareItem)
|
||||
const query = `orderId=${shareItem.id}&shopId=${shareItem.shopId}`
|
||||
return wxShare({
|
||||
title: shareItem.packageName,
|
||||
imageUrl: shareItem.goodsImg,
|
||||
path: '/userPackage/order/detail' + '?' + query,
|
||||
query,
|
||||
})
|
||||
})
|
||||
|
||||
onLoad(() => {
|
||||
APIusershopInfodetail({
|
||||
shopId: uni.cache.get('shopId')
|
||||
}).then(res => {
|
||||
console.log(res);
|
||||
shopInfo.value = res.shopInfo
|
||||
uni.cache.set('shopInfo', res.shopInfo)
|
||||
})
|
||||
})
|
||||
|
||||
onShow(getData)
|
||||
|
||||
|
||||
let timer = null
|
||||
let nowTime = ref(Date.now())
|
||||
timer = setInterval(() => {
|
||||
nowTime.value = Date.now()
|
||||
}, 1000)
|
||||
|
||||
function returnTime(item) {
|
||||
nowTime.value
|
||||
return getRemainingHMS(item,'expireTime')
|
||||
}
|
||||
|
||||
function minPrice(item) {
|
||||
if (!item || item.tieredDiscount <= 0) {
|
||||
return item.price
|
||||
}
|
||||
return item.tieredDiscount[item.tieredDiscount.length - 1].price
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.top {
|
||||
height: 422rpx;
|
||||
background-size: cover;
|
||||
|
||||
.info {
|
||||
padding: 32rpx 30rpx 0 30rpx;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.map {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.steps {
|
||||
display: flex;
|
||||
padding: 20rpx 20rpx;
|
||||
gap: 20rpx;
|
||||
border-radius: 14rpx 14rpx 0 0;
|
||||
background: linear-gradient(90deg, #FFF5E6 0%, #FFD2CA 100%);
|
||||
align-items: center;
|
||||
|
||||
.step {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.index {
|
||||
border-radius: 60rpx;
|
||||
color: #fff;
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
line-height: 44rpx;
|
||||
text-align: center;
|
||||
background: #E55626;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #5A352F;
|
||||
margin-left: 10rpx;
|
||||
margin-right: 22rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.icon {
|
||||
color: rgba(90, 53, 47, 0.42);
|
||||
}
|
||||
|
||||
.icon1 {
|
||||
color: #5A352F;
|
||||
}
|
||||
}
|
||||
|
||||
.lists {
|
||||
padding: 18rpx 10rpx;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
padding: 32rpx 16rpx;
|
||||
border-radius: 32rpx;
|
||||
background: #FFF;
|
||||
margin-bottom: 14rpx;
|
||||
|
||||
.img-box {
|
||||
position: relative;
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 8rpx 18rpx;
|
||||
border-radius: 16rpx 0;
|
||||
background: #4C2828;
|
||||
color: #faeac6;
|
||||
font-size: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.desc {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.sale-number {
|
||||
margin-top: 16rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.numbers {
|
||||
background: #4C2828;
|
||||
padding: 8rpx 18rpx;
|
||||
border-radius: 10rpx;
|
||||
font-weight: 700;
|
||||
color: #FAEAC6;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.name {
|
||||
max-width: 334rpx;
|
||||
}
|
||||
|
||||
.members {
|
||||
margin-top: 26rpx;
|
||||
background: #FDF1CB;
|
||||
padding: 4rpx 18rpx;
|
||||
border-radius: 10rpx 10rpx 10rpx 0;
|
||||
width: fit-content;
|
||||
font-size: 24rpx;
|
||||
font-weight: 700;
|
||||
color: #ED5A2E;
|
||||
}
|
||||
|
||||
.info {
|
||||
background: linear-gradient(270deg, #FFF7F4 44.8%, #ffffff00 89.37%);
|
||||
width: 452rpx;
|
||||
height: 92rpx;
|
||||
border-radius: 12rpx;
|
||||
background-size: cover;
|
||||
transform: translateY(-10rpx);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.left {
|
||||
width: 306rpx;
|
||||
padding: 16rpx 22rpx;
|
||||
color: #eb532a;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.old-price {
|
||||
text-decoration: line-through;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.right {
|
||||
background-color: #ED5A2E;
|
||||
border-radius: 0 16rpx 16rpx 0;
|
||||
padding-right: 10rpx;
|
||||
padding-left: 16rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.pin {
|
||||
width: 76rpx;
|
||||
height: 54rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.filters {
|
||||
padding: 16rpx 28rpx;
|
||||
border-radius: 6rpx 6rpx 16rpx 16rpx;
|
||||
background: #FFF;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
padding: 32rpx 88rpx;
|
||||
|
||||
.tabs {
|
||||
transition: all .3s linear;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #ED5A2E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.translateY20 {
|
||||
transform: translateY(-20rpx);
|
||||
}
|
||||
|
||||
.orderStatus {
|
||||
padding: 26rpx 28rpx;
|
||||
justify-content: space-between;
|
||||
height: 100rpx;
|
||||
|
||||
.orderState {
|
||||
color: #999;
|
||||
transition: all .3s linear;
|
||||
|
||||
&.active {
|
||||
color: #000;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.orders {
|
||||
padding: 0 26rpx 36rpx;
|
||||
margin-top: 32rpx;
|
||||
.item {
|
||||
padding: 32rpx 24rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #FFF;
|
||||
margin-bottom: 32rpx;
|
||||
|
||||
.main-color {
|
||||
color: #eb532a;
|
||||
}
|
||||
|
||||
.img-box {
|
||||
position: relative;
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 8rpx 18rpx;
|
||||
border-radius: 16rpx 0;
|
||||
background: #4C2828;
|
||||
color: #faeac6;
|
||||
font-size: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.old-price {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.numbers {
|
||||
background-color: #ED5A2E;
|
||||
padding: 16rpx 30rpx;
|
||||
border-radius: 12rpx;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.price {
|
||||
color: #ED5A2E;
|
||||
font-weight: 700;
|
||||
line-height: 36rpx;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.info {
|
||||
padding: 16rpx 34rpx;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
border-radius: 8rpx;
|
||||
background: #F8F8F8;
|
||||
|
||||
.title {
|
||||
min-width: 208rpx;
|
||||
padding-right: 8rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.stitle {
|
||||
color: #666;
|
||||
|
||||
&.price {
|
||||
font-size: 32rpx;
|
||||
color: #ed5a2e;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.btns {
|
||||
margin-top: 28rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 34rpx;
|
||||
|
||||
.btn {
|
||||
min-width: 148rpx;
|
||||
line-height: 1;
|
||||
margin: 0;
|
||||
padding: 12rpx 14rpx;
|
||||
border-radius: 10rpx;
|
||||
border: 2rpx solid #D9D9D9;
|
||||
background: #FFF;
|
||||
font-size: 28rpx;
|
||||
|
||||
&.black {
|
||||
border-color: #343030;
|
||||
background-color: #343030;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.copy {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
</style>
|
||||
72
userPackage/members/members.vue
Normal file
72
userPackage/members/members.vue
Normal file
@@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<view class="min-page color-333 u-font-28 ">
|
||||
<view class="u-font-32 font-bold ">助力人({{totalRow}}人)</view>
|
||||
<view class="list u-m-t-40">
|
||||
<view class="item" v-for="(item,index) in list" :key="index">
|
||||
<up-avatar size="140rpx" :src="item.userAvator"></up-avatar>
|
||||
<view class="u-m-t-16 u-line-1">{{item.userName}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<up-empty v-if="!list.length" text="暂无助力人"></up-empty>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
import { onReachBottom } from '@dcloudio/uni-app'
|
||||
import * as Api from '@/common/api/market/package.js'
|
||||
const query=reactive({
|
||||
page:1,size:50
|
||||
})
|
||||
|
||||
const totalRow=ref(0)
|
||||
const isEnd=ref(false)
|
||||
const list=ref([])
|
||||
function getList(){
|
||||
Api.helpPage(query).then(res=>{
|
||||
totalRow.value=res.totalRow||0
|
||||
isEnd.value= query.page>= res.totalPage*1 ?true :false
|
||||
if(query.page==1){
|
||||
list.value=res.records
|
||||
}else{
|
||||
list.value.push(...res.records)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onReachBottom(()=>{
|
||||
if(isEnd.value){
|
||||
return
|
||||
}
|
||||
query.page++
|
||||
getList()
|
||||
})
|
||||
onLoad((opt)=>{
|
||||
Object.assign(query,opt)
|
||||
getList()
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.min-page{
|
||||
padding: 32rpx 52rpx;
|
||||
}
|
||||
.list{
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
grid-column-gap: 28rpx;
|
||||
grid-row-gap: 32rpx;
|
||||
.item{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
.u-line-1{
|
||||
max-width: 140rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
1120
userPackage/order/detail.vue
Normal file
1120
userPackage/order/detail.vue
Normal file
File diff suppressed because it is too large
Load Diff
13
userPackage/order/order.vue
Normal file
13
userPackage/order/order.vue
Normal file
@@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
BIN
userPackage/static/image/copy.png
Normal file
BIN
userPackage/static/image/copy.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
51
utils/countdown.js
Normal file
51
utils/countdown.js
Normal file
@@ -0,0 +1,51 @@
|
||||
import dayjs from "dayjs"
|
||||
|
||||
/**
|
||||
* 计算剩余时间差(毫秒)
|
||||
* @param {Object} item - 包含groupEndTime的订单/拼团对象
|
||||
* @returns {number} 剩余时间(毫秒)
|
||||
*/
|
||||
function returnRemainingTime(item,key) {
|
||||
if(!item[key]) return 0; // 容错:无结束时间则返回0
|
||||
return dayjs(item[key]).valueOf() - dayjs().valueOf();
|
||||
}
|
||||
|
||||
/**
|
||||
* 将毫秒差格式化为 HH:MM:SS(最多72小时)
|
||||
* @param {number} ms - 时间差(毫秒)
|
||||
* @returns {string} 格式化后的时分秒(如 09:09:09、72:00:00、00:00:00)
|
||||
*/
|
||||
function formatTimeToHMS(ms) {
|
||||
// 边界1:已过期/无剩余时间 → 显示00:00:00
|
||||
if (ms <= 0) return '00:00:00';
|
||||
|
||||
// 边界2:超过72小时 → 按72小时算(72*60*60*1000 = 259200000毫秒)
|
||||
const maxMs = 72 * 60 * 60 * 1000;
|
||||
const validMs = Math.min(ms, maxMs);
|
||||
|
||||
// 转换为总秒数(取整,避免小数)
|
||||
const totalSeconds = Math.floor(validMs / 1000);
|
||||
|
||||
// 拆解小时、分钟、秒
|
||||
const hours = Math.floor(totalSeconds / 3600);
|
||||
const remainingSeconds = totalSeconds % 3600;
|
||||
const minutes = Math.floor(remainingSeconds / 60);
|
||||
const seconds = remainingSeconds % 60;
|
||||
|
||||
// 补零(确保两位数,如 9 → 09)
|
||||
const pad = (num) => String(num).padStart(2, '0');
|
||||
return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`;
|
||||
}
|
||||
|
||||
|
||||
let timer = null
|
||||
let nowTime = ref(Date.now())
|
||||
timer = setInterval(() => {
|
||||
nowTime.value = Date.now()
|
||||
}, 1000)
|
||||
|
||||
// 组合使用:获取格式化后的剩余时间
|
||||
export function getRemainingHMS(item,key='groupEndTime') {
|
||||
const ms = returnRemainingTime(item,key);
|
||||
return formatTimeToHMS(ms);
|
||||
}
|
||||
6
utils/share.js
Normal file
6
utils/share.js
Normal file
@@ -0,0 +1,6 @@
|
||||
export function wxShare(par) {
|
||||
return {
|
||||
...par,
|
||||
type: 2
|
||||
}
|
||||
}
|
||||
@@ -1,12 +1,13 @@
|
||||
export const back = () => {
|
||||
export const back = (url) => {
|
||||
console.log('调用返回方法back');
|
||||
try {
|
||||
const arr = getCurrentPages()
|
||||
if (arr.length >= 2) {
|
||||
return uni.navigateBack()
|
||||
} else {
|
||||
|
||||
uni.reLaunch({
|
||||
url: '/pages/index/index'
|
||||
url: url?url:'/pages/index/index'
|
||||
})
|
||||
}
|
||||
} catch (error) {
|
||||
|
||||
@@ -475,4 +475,24 @@ export function includesString(target, searchStr, options = {}) {
|
||||
|
||||
// 4. 执行包含判断
|
||||
return processedTarget.includes(processedSearch);
|
||||
}
|
||||
|
||||
/**
|
||||
* 校验一维基础类型数组A的元素是否存在于数组B(支持部分/全部存在,默认全部存在)
|
||||
* @param {Array<string|number|boolean>} arrA - 待校验的一维数组
|
||||
* @param {Array<string|number|boolean>} arrB - 参考的一维数组
|
||||
* @param {boolean} [partial=false] - 是否校验「部分存在」(true=部分存在,false=全部存在,默认false)
|
||||
* @returns {boolean} 校验结果
|
||||
*/
|
||||
export function checkArrayElementsExist(arrA, arrB, partial = false) {
|
||||
// 边界处理:空数组特殊逻辑
|
||||
if (arrA.length === 0) return !partial
|
||||
|
||||
// 转Set优化查找性能(一维数组核心优化)
|
||||
const bSet = new Set(arrB)
|
||||
|
||||
// 核心逻辑:partial=true → some(部分存在),partial=false → every(全部存在)
|
||||
return partial ?
|
||||
arrA.some(item => bSet.has(item)) :
|
||||
arrA.every(item => bSet.has(item))
|
||||
}
|
||||
@@ -14,6 +14,7 @@ module.exports = defineConfig({
|
||||
"vue",
|
||||
{
|
||||
"@dcloudio/uni-app": [
|
||||
"onShareAppMessage",
|
||||
"onLoad",
|
||||
"onShow",
|
||||
"onHide",
|
||||
|
||||
Reference in New Issue
Block a user