adam/aiyushanuninew
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 优化分销中心、购物车和订单详情页功能

Browse Source 
- 在分销中心页面添加导航栏并优化UI显示
- 在购物车页面增加打包费计算和显示
- 在订单详情页优化订单状态显示和导航逻辑
This commit is contained in:
yindongqi 2025-04-13 21:23:15 +08:00
parent 58359af16d
commit a93999c041
9 changed files with 2824 additions and 2600 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
pages/cart/cart.vue
View File

@ -1,10 +1,5 @@
<template>
<uv-navbar
:fixed="false"
:title="title"
left-arrow
@leftClick="$onClickLeft"
/>
<uv-navbar :fixed="false" :title="title" left-arrow @leftClick="$onClickLeft" />
<view class="cart-popup">
<view class="top flex justify-between">
<text>已点{{ getCartGoodsNumber }}份</text>
@ -37,8 +32,22 @@
</scroll-view>
</view>
<view class="fixed-bottom flex justify-between align-center bg-white ">
<view class="mx-2 ont-weight-light">应付:<text class="text-danger">￥{{ getCartGoodsPrice }}</text></view>
<view ><uv-button style="background-color: #52ac41;" type="warning" color="#52ac41" :customStyle="customStyle" size="large" text="去结算" @click="toPay"></uv-button></view>
<view class="mx-2 ont-weight-light">
<view>商品总价: ￥{{ (getCartGoodsPrice - getPackingFee).toFixed(2) }}</view>
<view>打包费: ￥{{ getPackingFee.toFixed(2) }}</view>
<view>应付: <text class="text-danger">￥{{ getCartGoodsPrice }}</text></view>
</view>
<view>
<uv-button
style="background-color: #52ac41;"
type="warning"
color="#52ac41"
:customStyle="customStyle"
size="large"
text="去结算"
@click="toPay">
</uv-button>
</view>
</view>
<uv-toast ref="uToast"></uv-toast>
</template>
@ -70,13 +79,23 @@ const getCartGoodsNumber = computed(() => { //计算购物车总数
}
return cart.value.reduce((acc, cur) => acc + cur.number, 0)
})
const getCartGoodsPrice = computed(() =>{ //计算购物车总价
const getCartGoodsPrice = computed(() => {
//计算购物车总价（商品价格+打包费）
if (cart.value.length == 0) {
return 0
}
let price = cart.value.reduce((acc, cur) => acc + cur.number * cur.price, 0);
return parseFloat(price).toFixed(2);
let total = cart.value.reduce((acc, cur) => {
const itemPrice = cur.price * cur.number;
const boxPrice = (cur.boxFee || 0) * cur.number;
return acc + itemPrice + boxPrice;
}, 0);
return parseFloat(total).toFixed(2);
})
const getPackingFee = computed(() => {
// 计算打包费（根据每个商品的boxFee计算）
return cart.value.reduce((acc, cur) => acc + cur.number * (cur.boxFee || 0), 0);
});
const customStyle = computed(() => {
return {
paddingLeft: '60rpx',
@ -159,6 +178,7 @@ const toPay = () => {
font-size: 24rpx;
text-align: right;
}
.cart-list {
background-color: #ffffff;
width: 100%;
@ -202,6 +222,7 @@ const toPay = () => {
font-size: $font-size-sm;
color: $text-color-base;
}
.props {
color: $text-color-assist;
font-size: 24rpx;

63
pages/components/pages/fenxiao/fenxiao.vue
View File

@ -1,12 +1,13 @@
<template>
<view class="page flex-col">
<uv-navbar :fixed="false" title="分销中心" left-arrow @leftClick="$onClickLeft" />
<view class="page flex-col" v-if="isDistributor">
<!-- 头部导航 -->
<view class="flex-col">
<view class="flex-row">
<!-- <view class="flex-row">
<view class="flex-row">
<text class="header-title">分销中心</text>
</view>
</view>
</view> -->
<!-- 用户信息 -->
<view class="user-info">
@ -17,17 +18,11 @@
</view>
<view class="flex-row" style="align-items: center">
<text class="user-id">ID: {{ userId }}</text>
<text class="invite-code" @tap="showInviteCodePopup"
>复查邀请码</text
>
<text class="invite-code" @tap="showInviteCodePopup">邀请码</text>
</view>
</view>
<view class="share-btn" @tap="share">
<image
class="share-icon"
src="/static/images/share.png"
mode="aspectFill"
></image>
<image class="share-icon" src="/static/images/share.png" mode="aspectFill"></image>
<text class="share-text">分享</text>
</view>
</view>
@ -61,25 +56,14 @@
<view class="details-list flex-col">
<view class="details-title">
<text>佣金明细 </text>
<text style="margin-top: 6rpx; font-size: 22rpx; color: #999999"
>佣金将于每月15日结算至您的银行卡账号中</text
>
<text style="margin-top: 6rpx; font-size: 22rpx; color: #999999">（佣金将于每月15日结算至您的银行卡账号中）</text>
</view>
<!-- 佣金明细列表 -->
<view v-if="commissionList.length > 0">
<view
v-for="(item, index) in commissionList"
:key="index"
class="detail-item"
@tap="addCommission"
>
<view v-for="(item, index) in commissionList" :key="index" class="detail-item" @tap="addCommission">
<view class="detail-left">
<image
class="user-avatar"
:src="item.avatar"
mode="aspectFill"
></image>
<image class="user-avatar" :src="item.avatar" mode="aspectFill"></image>
<view class="detail-info">
<text class="detail-name">{{ item.name }}</text>
<text class="detail-date">下单日期: {{ item.date }}</text>
@ -104,28 +88,14 @@
</view>
<!-- 邀请码弹窗 -->
<view
class="invite-popup-mask"
v-if="showInvitePopup"
@tap="closeInviteCodePopup"
>
<view class="invite-popup-mask" v-if="showInvitePopup" @tap="closeInviteCodePopup">
<view class="invite-popup-content" @tap.stop>
<view class="invite-popup-box">
<image
class="invite-popup-avatar"
:src="userAvatar"
mode="aspectFill"
></image>
<view class="invite-popup-id">会员ID: {{ userId }}</view>
<image class="invite-popup-avatar" :src="userAvatar" mode="aspectFill"></image>
<view class="invite-popup-id">分销员ID: {{ userId }}</view>
<view class="invite-popup-qrcode-container">
<uv-qrcode
ref="qrcode"
canvas-id="qrcode"
:value="userId"
:size="260"
background-color="#FFFFFF"
foreground-color="#000000"
></uv-qrcode>
<uv-qrcode ref="qrcode" canvas-id="qrcode" :value="userId" :size="260" background-color="#FFFFFF"
foreground-color="#000000"></uv-qrcode>
</view>
</view>
</view>
@ -143,6 +113,9 @@ import { getDistributorInfo, getCommissionList } from "@/api/distributor";
const main = useMainStore();
const { isLogin } = storeToRefs(main);
//是否是分销商
const isDistributor = ref(false);
// 用户信息
const userAvatar = ref("/static/images/avatar.png");
const userName = ref("爱喝汤的小力");
@ -197,6 +170,7 @@ const getCommissionData = async () => {
// 修改getDistributorInfo调用，传入spreadUid参数
let data = await getDistributorInfo({ id: spreadUid.value });
if (data) {
isDistributor.value = true;
userName.value = data.name || "爱喝汤的小力";
userId.value = data.id || "1234567890";
totalCommission.value = data.totalCommission || "0.00";
@ -209,6 +183,7 @@ const getCommissionData = async () => {
const getOrderCommissionList = async () => {
let data = await getCommissionList({ distributorId: userId.value, page: 1, limit: 10 });
if (data) {
commissionList.value = data.map(item => ({
avatar: item.avatar || '/static/images/avatar.png',
name: item.realName || '用户',

24
pages/components/pages/fenxiao/fenxiaorequestform.vue
View File

@ -1,7 +1,7 @@
<template>
<uv-navbar
:fixed="false"
title="填写信息"
title="申请成为分销员"
left-arrow
@leftClick="$onClickLeft"
/>
@ -20,24 +20,24 @@
<view class="form-container" style=" padding: 40rpx 20rpx; border-radius: 20rpx;">
<!-- 姓名 -->
<view class="form-item" style="">
<text class="form-label">姓名</text>
<text class="form-label">姓名<text style="color: red;"> *</text></text>
<input
class="form-input"
type="text"
v-model="formData.name"
placeholder="请输入"
placeholder="请输入姓名"
placeholder-class="placeholder"
/>
</view>
<!-- 电话 -->
<view class="form-item">
<text class="form-label">电话</text>
<text class="form-label">电话<text style="color: red;"> *</text></text>
<input
class="form-input"
type="number"
v-model="formData.phone"
placeholder="请输入"
placeholder="请输入电话"
placeholder-class="placeholder"
maxlength="11"
/>
@ -50,43 +50,43 @@
class="form-input"
type="text"
v-model="formData.workUnit"
placeholder="请输入"
placeholder="请输入工作单位"
placeholder-class="placeholder"
/>
</view>
<!-- 银行卡号 -->
<view class="form-item">
<text class="form-label">银行卡号</text>
<text class="form-label">银行卡号<text style="color: red;"> *</text></text>
<input
class="form-input"
type="number"
v-model="formData.bankCardNumber"
placeholder="请输入"
placeholder="请输入银行卡号（结算佣金时需要）"
placeholder-class="placeholder"
/>
</view>
<!-- 收款人姓名 -->
<view class="form-item">
<text class="form-label">收款人</text>
<text class="form-label">开户名<text style="color: red;"> *</text></text>
<input
class="form-input"
type="text"
v-model="formData.recipientName"
placeholder="请输入"
placeholder="请输入开户名（结算佣金时需要）"
placeholder-class="placeholder"
/>
</view>
<!-- 开户行 -->
<view class="form-item">
<text class="form-label">开户行</text>
<text class="form-label">开户行<text style="color: red;"> *</text></text>
<input
class="form-input"
type="text"
v-model="formData.bankName"
placeholder="请输入"
placeholder="请输入开户行（结算佣金时需要）"
placeholder-class="placeholder"
/>
</view>

94
pages/components/pages/invoice/invoice.vue
View File

@ -1,10 +1,5 @@
<template>
<uv-navbar
:fixed="false"
title="开票信息管理"
left-arrow
@leftClick="$onClickLeft"
/>
<uv-navbar :fixed="false" title="开票信息管理" left-arrow @leftClick="$onClickLeft" />
<view class="container">
<view class="bg-white invoice-form">
<!-- 发票类型选择 -->
@ -25,69 +20,39 @@
<!-- 企业单位表单 -->
<block v-if="invoiceType === 'company'">
<view class="form-item">
<text class="label">发票抬头</text>
<input
type="text"
placeholder="请输入发票抬头(必填)"
placeholderClass="placeholder"
class="input-field"
v-model="companyForm.invoiceTitle"
/>
<text class="label">发票抬头<text class="required"> *</text></text>
<input type="text" placeholder="请输入发票抬头(必填)" placeholderClass="placeholder" class="input-field"
v-model="companyForm.invoiceTitle" />
</view>
<view class="form-item">
<text class="label">税号</text>
<input
type="text"
placeholder="请写纳税人识别号(必填)"
placeholderClass="placeholder"
class="input-field"
v-model="companyForm.taxNumber"
/>
<text class="label">税号<text class="required"> *</text></text>
<input type="text" placeholder="请写纳税人识别号(必填)" placeholderClass="placeholder" class="input-field"
v-model="companyForm.taxNumber" />
</view>
<view class="form-item">
<text class="label">单位地址</text>
<input
type="text"
placeholder="公司地址(选填)"
placeholderClass="placeholder"
class="input-field"
v-model="companyForm.companyAddress"
/>
<input type="text" placeholder="公司地址(选填)" placeholderClass="placeholder" class="input-field"
v-model="companyForm.companyAddress" />
</view>
<view class="form-item">
<text class="label">电话号码</text>
<input
type="text"
placeholder="公司电话(选填)"
placeholderClass="placeholder"
class="input-field"
v-model="companyForm.companyPhone"
/>
<input type="text" placeholder="公司电话(选填)" placeholderClass="placeholder" class="input-field"
v-model="companyForm.companyPhone" />
</view>
<view class="form-item">
<text class="label">开户银行</text>
<input
type="text"
placeholder="开户银行(选填)"
placeholderClass="placeholder"
class="input-field"
v-model="companyForm.bankName"
/>
<input type="text" placeholder="开户银行(选填)" placeholderClass="placeholder" class="input-field"
v-model="companyForm.bankName" />
</view>
<view class="form-item">
<text class="label">银行账户</text>
<input
type="text"
placeholder="银行账户(选填)"
placeholderClass="placeholder"
class="input-field"
v-model="companyForm.bankAccount"
/>
<input type="text" placeholder="银行账户(选填)" placeholderClass="placeholder" class="input-field"
v-model="companyForm.bankAccount" />
</view>
</block>
@ -95,13 +60,8 @@
<block v-else>
<view class="form-item">
<text class="label">发票抬头<text class="required"> *</text></text>
<input
type="text"
placeholder="请输入个人发票抬头(必填)"
placeholderClass="placeholder"
class="input-field"
v-model="personalForm.invoiceTitle"
/>
<input type="text" placeholder="请输入个人发票抬头(必填)" placeholderClass="placeholder" class="input-field"
v-model="personalForm.invoiceTitle" />
</view>
<!-- <view class="form-item">
@ -136,7 +96,7 @@ const invoiceType = ref('company')
// 企业单位表单数据
const companyForm = reactive({
userId: '123',
userId: '',
invoiceTitle: '', // 发票抬头
taxNumber: '', // 纳税人识别号
companyAddress: '', // 单位地址
@ -147,7 +107,7 @@ const companyForm = reactive({
// 个人/非企业单位表单数据
const personalForm = reactive({
userId: '123',
userId: '',
invoiceTitle: '', // 个人发票抬头
// taxNumber: '' // 个人税号（可能为空）
})
@ -327,10 +287,24 @@ const getUserInvoice = async (id) => {
}
}
onLoad(() => {
onLoad((option) => {
// 获取用户信息
console.log('用户ID:', member.value.id)
// 接收传入的userId参数
if (option.userId) {
companyForm.userId = option.userId
personalForm.userId = option.userId
} else {
uni.showToast({
title: '未获取到用户ID，请重新进入',
icon: 'none'
})
setTimeout(() => {
uni.navigateBack()
}, 3000)
}
// 获取用户发票信息
getUserInvoice(member.value.id)
})

283
pages/components/pages/orders/detail.vue
View File

@ -5,29 +5,46 @@
left-arrow
@leftClick="$onClickLeft"
/>
<view class="container" style="padding:20rpx;">
<view style="padding-bottom: 100rpx;">
<view class="container" style="padding: 20rpx">
<view style="padding-bottom: 100rpx">
<view class="bg-white">
<view class="section">
<!-- store info begin -->
<list-cell :hover="false">
<view class="w-100 d-flex align-items-center">
<view class="d-flex flex-column w-60">
<view class="w-100 font-size-lg text-color-base text-truncate">{{ order.shop.name }}</view>
<view
class="w-100 font-size-lg text-color-base text-truncate"
>{{ order.shop.name }}</view
>
</view>
<view class="d-flex justify-content-end align-items-center w-40">
<view class="iconfont-yshop icon-mobile" @click="makePhoneCall(order.shop)" style="font-size: 45rpx;margin-right: 40rpx;"></view>
<view class="iconfont-yshop icon-location" @click="openLocation(order.shop)" style="font-size: 45rpx;"></view>
<view
class="iconfont-yshop icon-mobile"
@click="makePhoneCall(order.shop)"
style="font-size: 45rpx; margin-right: 40rpx"
></view>
<view
class="iconfont-yshop icon-location"
@click="openLocation(order.shop)"
style="font-size: 45rpx"
></view>
</view>
</view>
</list-cell>
<!-- store info end -->
<list-cell :hover="false" padding="50rpx 30rpx">
<view class="w-100 d-flex flex-column">
<view v-if="order.paid == 0" class="d-flex align-items-center just-content-center mb-40">
<view
v-if="order.paid == 0"
class="d-flex align-items-center just-content-center mb-40"
>
<view class="font-size-lg text-color-error">订单未支付</view>
</view>
<view v-if="order.paid > 0" class="d-flex align-items-center just-content-center">
<view
v-if="order.paid > 0"
class="d-flex align-items-center just-content-center"
>
<view class="sort-num">{{ order.numberId }}</view>
</view>
<!-- steps begin -->
@ -38,58 +55,124 @@
<view class="iconfont-yshop icon-lamp"></view>
</view>
<view class="steps__img-column-item">
<view class="iconfont-yshop icon-daojishi" v-if="{active: order.paid == 1 && order.status == 0}"></view>
<view class="iconfont-yshop icon-daojishi unactive" v-else></view>
<view
class="iconfont-yshop icon-daojishi"
v-if="{ active: order.paid == 1 && order.status == 0 }"
></view>
<view
class="iconfont-yshop icon-daojishi unactive"
v-else
></view>
</view>
<view class="steps__img-column-item" v-if="order.orderType == 'takeout'">
<view class="iconfont-yshop icon-takeout" v-if="order.status == 1"></view>
<view class="iconfont-yshop icon-takeout unactive" v-else></view>
<view
class="steps__img-column-item"
v-if="order.orderType == 'takeout'"
>
<view
class="iconfont-yshop icon-takeout"
v-if="order.status == 1"
></view>
<view
class="iconfont-yshop icon-takeout unactive"
v-else
></view>
</view>
<view class="steps__img-column-item">
<view class="iconfont-yshop icon-doorbell" v-if="order.status >= 2"></view>
<view class="iconfont-yshop icon-doorbell unactive" v-else></view>
<view
class="iconfont-yshop icon-doorbell"
v-if="order.status >= 2"
></view>
<view
class="iconfont-yshop icon-doorbell unactive"
v-else
></view>
</view>
</view>
<view class="steps__text-column">
<view class="steps__text-column-item active">
<view class="steps__column-item-line bg-transparent"></view>
<view
class="steps__column-item-line bg-transparent"
></view>
<view class="steps__text-column-item-text">已下单</view>
<view class="steps__column-item-line"></view>
</view>
<view class="steps__text-column-item activ" :class="{active: order.paid == 1}">
<view
class="steps__text-column-item activ"
:class="{ active: order.paid == 1 }"
>
<view class="steps__column-item-line"></view>
<view class="steps__text-column-item-text">制作中</view>
<view class="steps__column-item-line"></view>
</view>
<view class="steps__text-column-item" :class="{active: order.status == 1}" v-if="order.orderType == 'takeout'">
<view
class="steps__text-column-item"
:class="{ active: order.status == 1 }"
v-if="order.orderType == 'takeout'"
>
<view class="steps__column-item-line"></view>
<view class="steps__text-column-item-text">配送中</view>
<view class="steps__column-item-line bg-transparent"></view>
<view
class="steps__column-item-line bg-transparent"
></view>
</view>
<view class="steps__text-column-item" :class="{active: order.status >= 2}">
<view
class="steps__text-column-item"
:class="{ active: order.status >= 2 }"
>
<view class="steps__column-item-line"></view>
<view class="steps__text-column-item-text">
{{ order.orderType == 'takeout' ? '已送达' : '请取餐' }}
{{ order.orderType == "takeout" ? "已送达" : "请取餐" }}
</view>
<view class="steps__column-item-line bg-transparent"></view>
<view
class="steps__column-item-line bg-transparent"
></view>
</view>
</view>
</view>
</view>
<!-- steps end -->
<view v-if="order.status==0 && order.paid > 0" class="d-flex just-content-center align-items-center font-size-base text-color-assist mb-40">
您前面还有 <text class="text-color-primary mr-10 ml-10" style="color: #52ac41;">{{order.preNum}}</text> 单待制作
<view
v-if="order.status == 0 && order.paid > 0"
class="d-flex just-content-center align-items-center font-size-base text-color-assist mb-40"
>
您前面还有
<text
class="text-color-primary mr-10 ml-10"
style="color: #52ac41"
>{{ order.preNum }}</text
>
单待制作
</view>
<!-- goods begin -->
<view class="w-100 d-flex flex-column position-relative mt-30" style="margin-bottom: -40rpx;">
<view class="w-100 d-flex align-items-center mb-40" v-for="(good, index) in order.products" :key="index">
<view
class="w-100 d-flex flex-column position-relative mt-30"
style="margin-bottom: -40rpx"
>
<view
class="w-100 d-flex align-items-center mb-40"
v-for="(good, index) in order.products"
:key="index"
>
<view class="d-flex flex-column w-60 overflow-hidden">
<view class="font-size-lg text-color-base mb-10 text-truncate">{{ good.title }}</view>
<view class="font-size-sm text-color-assist text-truncate">{{ good.spec }}</view>
<view
class="font-size-lg text-color-base mb-10 text-truncate"
>{{ good.title }}</view
>
<view
class="font-size-sm text-color-assist text-truncate"
>{{ good.spec }}</view
>
</view>
<view class="d-flex w-40 align-items-center justify-content-between pl-30">
<view class="font-size-base text-color-base">x{{ good.number }}</view>
<view class="font-size-base text-color-base font-weight-bold">￥{{ good.price }}</view>
<view
class="d-flex w-40 align-items-center justify-content-between pl-30"
>
<view class="font-size-base text-color-base"
>x{{ good.number }}</view
>
<view
class="font-size-base text-color-base font-weight-bold"
>￥{{ good.price }}</view
>
</view>
</view>
</view>
@ -101,15 +184,34 @@
<!-- goods begin -->
<list-cell :hover="false" padding="30rpx 30rpx">
<view class="w-100 d-flex flex-column position-relative">
<view class="w-100 d-flex align-items-center mb-40" v-for="(good, index) in order.cartInfo" :key="index">
<image :src="good.image" mode="aspectFill" class="image"></image>
<view
class="w-100 d-flex align-items-center mb-40"
v-for="(good, index) in order.cartInfo"
:key="index"
>
<image
:src="good.image"
mode="aspectFill"
class="image"
></image>
<view class="d-flex flex-column w-60 overflow-hidden">
<view class="font-size-lg text-color-base mb-10 text-truncate">{{ good.title }}</view>
<view class="font-size-sm text-color-assist text-truncate">{{ good.spec }}</view>
<view
class="font-size-lg text-color-base mb-10 text-truncate"
>{{ good.title }}</view
>
<view class="font-size-sm text-color-assist text-truncate">{{
good.spec
}}</view>
</view>
<view class="d-flex w-40 align-items-center justify-content-between pl-30">
<view class="font-size-base text-color-base">x{{ good.number }}</view>
<view class="font-size-base text-color-base font-weight-bold">￥{{ good.price }}</view>
<view
class="d-flex w-40 align-items-center justify-content-between pl-30"
>
<view class="font-size-base text-color-base"
>x{{ good.number }}</view
>
<view class="font-size-base text-color-base font-weight-bold"
>￥{{ good.price }}</view
>
</view>
</view>
</view>
@ -120,7 +222,9 @@
<view class="w-100 d-flex flex-column">
<view class="pay-cell">
<view>支付方式</view>
<view class="font-weight-bold">{{ order.statusDto.payType }}</view>
<view class="font-weight-bold">{{
order.statusDto.payType
}}</view>
</view>
<view class="pay-cell">
<view>订单金额</view>
@ -148,7 +252,9 @@
<view class="w-100 d-flex flex-column">
<view class="pay-cell">
<view>下单时间</view>
<view class="font-weight-bold">{{ formatDateTime(order.createTime )}}</view>
<view class="font-weight-bold">{{
formatDateTime(order.createTime)
}}</view>
</view>
<view class="pay-cell">
<view>下单门店</view>
@ -167,26 +273,46 @@
<view class="w-100 d-flex flex-column">
<view class="pay-cell">
<view>享用方式</view>
<view class="font-weight-bold">{{order.orderType == 'takein' ? '自取' : '外卖'}}</view>
<view class="font-weight-bold">{{
order.orderType == "takein" ? "自取" : "外卖"
}}</view>
</view>
<view class="pay-cell">
<view>取餐时间</view>
<view class="font-weight-bold">{{order.getTime ? formatDateTime(order.getTime) : '立即取餐'}}</view>
<view class="font-weight-bold">{{
order.getTime ? formatDateTime(order.getTime) : "立即取餐"
}}</view>
</view>
<view class="pay-cell">
<view>制作完成时间</view>
<view class="font-weight-bold">{{ order.deliveryTime ? formatDateTime(order.deliveryTime) : '无' }}</view>
<view class="font-weight-bold">{{
order.deliveryTime ? formatDateTime(order.deliveryTime) : "无"
}}</view>
</view>
<view class="pay-cell">
<view>备注</view>
<view class="font-weight-bold">{{ order.remark ? order.remark : '无' }}</view>
<view class="font-weight-bold">{{
order.remark ? order.remark : "无"
}}</view>
</view>
</view>
</list-cell>
<!-- order other info end -->
</view>
<view class="fixed-bottom flex justify-end bg-white p-2" v-if="order.paid > 0 && order.refundStatus == 0">
<view class="mr-1"><uv-button type="success" v-if="order.status < 2" :plain="true" size="small" text="确认收到餐" @click="receive(order)"></uv-button></view>
<view
class="fixed-bottom flex justify-end bg-white p-2"
v-if="order.paid > 0 && order.refundStatus == 0"
>
<view class="mr-1"
><uv-button
type="success"
v-if="order.status < 2"
:plain="true"
size="small"
text="确认收到餐"
@click="receive(order)"
></uv-button
></view>
<!-- <view><uv-button type="warning" :plain="true" size="small" text="申请退款" @click="refund(order)"></uv-button></view> -->
</view>
</view>
@ -194,32 +320,27 @@
</template>
<script setup>
import {
ref
} from 'vue'
import { onLoad} from '@dcloudio/uni-app'
import { formatDateTime } from '@/utils/util'
import {
orderDetail,
orderReceive,
} from '@/api/order'
const title = ref('订单详情')
import { ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import { formatDateTime } from "@/utils/util";
import { orderDetail, orderReceive } from "@/api/order";
const title = ref("订单详情");
const order = ref({
shop:{name:''},
statusDto:{payType:''}
})
const numForMading = ref(5)
shop: { name: "" },
statusDto: { payType: "" },
});
const numForMading = ref(5);
onLoad((option) => {
detail(option.id);
})
});
const detail = async (id) => {
let data = await orderDetail(id);
if (data) {
order.value = data;
}
}
};
const openLocation = () => {
let shop = order.value.shop;
uni.openLocation({
@ -228,18 +349,18 @@ const openLocation = () => {
longitude: parseFloat(shop.lng),
fail(res) {
console.log(res);
}
},
});
}
};
const makePhoneCall = () => {
let shop = order.value.shop;
uni.makePhoneCall({
phoneNumber: shop.mobile,
fail(res) {
console.log(res)
}
})
}
console.log(res);
},
});
};
// 确认收到货
const receive = async (order) => {
@ -247,17 +368,22 @@ const receive = async(order) => {
if (data) {
// await getOrders(true)
uni.redirectTo({
url: '/pages/order/order'
})
}
url: "/pages/components/pages/orders/detail?id=" + order.orderId,
});
}
};
//提交退款
const refund = (order) => {
uni.navigateTo({
url: '/pages/components/pages/orders/refund?orderId=' + order.orderId + '&payPrice=' + order.payPrice + '&totalPrice=' + order.totalPrice
})
}
url:
"/pages/components/pages/orders/refund?orderId=" +
order.orderId +
"&payPrice=" +
order.payPrice +
"&totalPrice=" +
order.totalPrice,
});
};
</script>
<style lang="scss" scoped>
@ -268,7 +394,6 @@ const refund = (order) => {
border-radius: 8rpx;
}
.pay-cell {
width: 100%;
display: flex;
@ -283,8 +408,6 @@ const refund = (order) => {
}
}
/* #ifdef H5 */
page {
min-height: 100%;
@ -308,7 +431,6 @@ const refund = (order) => {
line-height: 48rpx;
}
@mixin arch {
content: "";
position: absolute;
@ -409,7 +531,10 @@ const refund = (order) => {
}
}
}
.icon-lamp, .icon-daojishi, .icon-takeout, .icon-doorbell{
.icon-lamp,
.icon-daojishi,
.icon-takeout,
.icon-doorbell {
font-size: 60rpx;
}
.iconfont-yshop {

520
pages/components/pages/pay/pay.vue
View File

@ -1,17 +1,14 @@
<template>
<uv-navbar
:fixed="false"
:title="title"
left-arrow
@leftClick="$onClickLeft"
/>
<uv-navbar :fixed="false" :title="title" left-arrow @leftClick="$onClickLeft" />
<view class="container position-relative">
<view style="margin-bottom: 130rpx;">
<view style="margin-bottom: 130rpx">
<view class="section-1">
<template v-if="store.distance > 0">
<list-cell class="location">
<view class="flex-fill d-flex justify-content-between align-items-center">
<view class="store-name flex-fill">{{ orderType == 'takeout' ? '外卖配送' : '点餐自取' }}</view>
<view class="store-name flex-fill">{{
orderType == "takeout" ? "外卖配送" : "点餐自取"
}}</view>
<uv-switch activeColor="#52ac41" v-model="active" @change="takout">
</uv-switch>
</view>
@ -23,7 +20,7 @@
<view v-if="address.realName" class="w-100 d-flex flex-column">
<view class="d-flex align-items-center justify-content-between mb-10">
<view class="font-size-lg text-color-base">
{{ address.address + ' ' + address.detail }}
{{ address.address + " " + address.detail }}
</view>
<image src="/static/images/navigator-1.png" class="arrow"></image>
</view>
@ -42,18 +39,17 @@
<view class="section-1">
<template>
<list-cell class="location" @click="goToShop">
<list-cell class="location">
<view class="flex-fill d-flex justify-content-between align-items-center">
<view class="store-name flex-fill">{{ store.name }}</view>
<image src="/static/images/navigator-1.png" class="arrow"></image>
<!-- <image src="/static/images/navigator-1.png" class="arrow"></image> -->
</view>
</list-cell>
</template>
<template>
<list-cell arrow class="meal-time" v-if="orderType == 'takein'">
<view class="flex-fill d-flex justify-content-between align-items-center"
@click="takeinTIme = !takeinTIme">
<view class="flex-fill d-flex justify-content-between align-items-center" @click="takeinTIme = !takeinTIme">
<view class="title">取餐时间</view>
<view class="time">
{{ takeinRange[defaultSelector[0]].name }}
@ -68,7 +64,7 @@
<view class="title flex-fill">联系电话</view>
<view class="time"><input class="text-right" placeholder="请输入手机号码" :value="member.mobile" />
</view>
<button class="contact-tip font-size-sm">自动填写</button>
<!-- <button class="contact-tip font-size-sm" @click="fillMobile">自动填写</button> -->
</view>
</list-cell>
</template>
@ -79,8 +75,8 @@
<view class="flex-fill">预计送达时间</view>
<view class="mr-10">
{{ defaultTime }}
<u-picker :default-time="defaultTime" v-model="takeoutTIme" :params="paramsTime"
mode="time" @cancel="cancelTime" @confirm="choiceTime"></u-picker>
<u-picker :default-time="defaultTime" v-model="takeoutTIme" :params="paramsTime" mode="time"
@cancel="cancelTime" @confirm="choiceTime"></u-picker>
</view>
</view>
</view>
@ -93,21 +89,23 @@
<list-cell last v-for="(item, index) in cart" :key="index">
<view class="w-100 d-flex flex-column">
<view class="d-flex align-items-center mb-10">
<view
class="d-flex flex-fill justify-content-between align-items-center text-color-base font-size-lg">
<image style="width: 80rpx;height: 80rpx;" mode="aspectFill" :src="item.image">
<view class="d-flex flex-fill justify-content-between align-items-center text-color-base font-size-lg">
<image style="width: 80rpx; height: 80rpx" mode="aspectFill" :src="item.image">
</image>
</view>
<view class="name-and-props overflow-hidden">
<view class="text-color-base font-size-lg">{{ item.name }}</view>
<view class="text-color-base font-size-lg">{{
item.name
}}</view>
</view>
<view
class="d-flex flex-fill justify-content-between align-items-center text-color-base font-size-lg">
<view class="d-flex flex-fill justify-content-between align-items-center text-color-base font-size-lg">
<view>x{{ item.number }}</view>
<view>￥{{ item.price }}</view>
</view>
</view>
<view class="text-truncate font-size-base text-color-assist">{{ item.valueStr }}</view>
<view class="text-truncate font-size-base text-color-assist">{{
item.valueStr
}}</view>
</view>
</list-cell>
</view>
@ -130,6 +128,19 @@
<view>￥{{ store.canhePrice }}</view>
</view>
</list-cell> -->
<list-cell>
<view class="flex-fill d-flex justify-content-between align-items-center">
<view class="text-color-base">打包费</view>
<view>￥{{ getPackingFee.toFixed(2) }}</view>
</view>
</list-cell>
<list-cell v-if="orderType == 'takeout'">
<view class="flex-fill d-flex justify-content-between align-items-center">
<view class="text-color-base">配送费</view>
<view>￥{{ store.deliveryPrice }}</view>
</view>
</list-cell>
<list-cell arrow @click="goToPackages">
<view class="flex-fill d-flex justify-content-between align-items-center">
@ -142,13 +153,12 @@
</view>
<view v-else class="text-color-primary">可用优惠券{{ coupons }}张</view>
</view>
</list-cell>
<list-cell last>
<view class="flex-fill d-flex justify-content-end align-items-center">
<view>
总计￥{{ total }}
<text v-if="orderType == 'takeout'">,配送费￥{{ store.deliveryPrice }}</text>
<!-- <text v-if="orderType == 'takeout'">,配送费￥{{ store.deliveryPrice }}</text> -->
<text v-if="coupon.value">,￥-{{ coupon.value }}</text>
,实付
@ -159,7 +169,7 @@
</view>
<!-- 购物车列表 end -->
<view class="d-flex align-items-center justify-content-start font-size-sm text-color-warning"
style="padding: 20rpx 0;">
style="padding: 20rpx 0">
</view>
<!-- 支付方式 begin -->
<view class="payment">
@ -179,7 +189,8 @@
<view class="d-flex align-items-center justify-content-between w-100" @click="setPayType('weixin')">
<view class="iconfont iconwxpay line-height-100 payment-icon" style="color: #52ac41"></view>
<view class="flex-fill">微信支付</view>
<view class="iconfont line-height-100 checkbox checked iconradio-button-on" style="color: #52ac41;" v-if="payType == 'weixin'">
<view class="iconfont line-height-100 checkbox checked iconradio-button-on" style="color: #52ac41"
v-if="payType == 'weixin'">
</view>
<view class="iconfont line-height-100 checkbox iconradio-button-off" v-else></view>
</view>
@ -189,7 +200,8 @@
<view class="d-flex align-items-center justify-content-between w-100" @click="setPayType('alipay')">
<view class="iconfont-yshop icon-alipay line-height-100 payment-icon" style="color: #07b4fd"></view>
<view class="flex-fill">支付宝</view>
<view class="iconfont line-height-100 checkbox checked iconradio-button-on" v-if="payType == 'alipay'" ></view>
<view class="iconfont line-height-100 checkbox checked iconradio-button-on" v-if="payType == 'alipay'">
</view>
<view class="iconfont line-height-100 checkbox iconradio-button-off" v-else></view>
</view>
</list-cell>
@ -198,30 +210,32 @@
<!-- 支付方式 end -->
<!-- 备注 begin -->
<list-cell last @click="goToRemark">
<view class="d-flex flex-fill align-items-center justify-content-between overflow-hidden" style="margin-bottom: 110rpx;">
<view class="d-flex flex-fill align-items-center justify-content-between overflow-hidden"
style="margin-bottom: 110rpx">
<view class="flex-shrink-0 mr-20">备注</view>
<view class="text-color-primary flex-fill text-truncate text-right" style="color: #52ac41">{{ form.remark || '备注' }}
<view class="text-color-primary flex-fill text-truncate text-right" style="color: #52ac41">{{ form.remark ||
"备注" }}
</view>
</view>
</list-cell>
<!-- 备注 end -->
</view>
<!-- 付款栏 begin -->
<view style="z-index: 1;"
<view style="z-index: 1"
class="w-100 pay-box position-fixed fixed-bottom d-flex align-items-center justify-content-between bg-white">
<view class="font-size-sm" style="margin-left: 20rpx;">合计：</view>
<view class="font-size-sm" style="margin-left: 20rpx">合计：</view>
<view class="font-size-lg flex-fill">￥{{ amount }}</view>
<view class="bg-primary h-100 d-flex align-items-center just-content-center text-color-white font-size-base"
style="padding: 0 60rpx; background-color: #52ac41;" @tap="debounce(submit, 500)">付款</view>
style="padding: 0 60rpx; background-color: #52ac41" @tap="debounce(submit, 500)">付款</view>
</view>
<!-- 付款栏 end -->
<modal :show="ensureAddressModalVisible" custom :mask-closable="false" :radius="'0rpx'" width="90%">
<view class="modal-content">
<view class="d-flex justify-content-end">
<image src="/static/images/pay/close.png" style="width: 40rpx; height: 40rpx;"
<image src="/static/images/pay/close.png" style="width: 40rpx; height: 40rpx"
@tap="ensureAddressModalVisible = false"></image>
</view>
<view class="d-flex just-content-center align-items-center" style="margin-bottom: 40px;">
<view class="d-flex just-content-center align-items-center" style="margin-bottom: 40px">
<view class="font-size-extra-lg text-color-base">请再次确认下单地址</view>
</view>
<view
@ -230,11 +244,17 @@
<view>{{ address.phone }}</view>
</view>
<view class="d-flex font-size-sm text-color-assist align-items-center justify-content-between mb-40">
<view style="max-width: 60%;">{{ address.address + address.detail }}</view>
<button type="primary" size="mini" plain class="change-address-btn" style="white-space: nowrap;"
@click="chooseAddress">修改地址</button>
<view style="max-width: 60%">{{
address.address + address.detail
}}</view>
<button type="primary" size="mini" plain class="change-address-btn" style="white-space: nowrap"
@click="chooseAddress">
修改地址
</button>
</view>
<button type="primary" class="pay_btn" @tap="debounce(pay, 500)">确认并付款</button>
<button type="primary" class="pay_btn" @tap="debounce(pay, 500)">
确认并付款
</button>
</view>
</modal>
<uv-toast ref="uToast"></uv-toast>
@ -242,169 +262,176 @@
</template>
<script setup>
import {
ref,
computed,
nextTick
} from 'vue'
import { useMainStore } from '@/store/store'
import { storeToRefs } from 'pinia'
import { onLoad,onShow ,onPullDownRefresh,onHide} from '@dcloudio/uni-app'
import { formatDateTime,isWeixin } from '@/utils/util'
import debounce from '@/uni_modules/uv-ui-tools/libs/function/debounce'
import { ref, computed, nextTick } from "vue";
import { useMainStore } from "@/store/store";
import { storeToRefs } from "pinia";
import { onLoad, onShow, onPullDownRefresh, onHide } from "@dcloudio/uni-app";
import { formatDateTime, isWeixin } from "@/utils/util";
import debounce from "@/uni_modules/uv-ui-tools/libs/function/debounce";
import {
orderSubmit,
payUnify,
getWechatConfig
} from '@/api/order'
import {
couponCount
} from '@/api/coupon'
import { orderSubmit, payUnify, getWechatConfig } from "@/api/order";
import { couponCount } from "@/api/coupon";
// #ifdef H5
import * as jweixin from 'weixin-js-sdk'
import * as jweixin from "weixin-js-sdk";
// #endif
const main = useMainStore()
const { orderType,address, store,location,isLogin,member,mycoupon } = storeToRefs(main)
const distributorId = ref(null) // 分销商ID
const active = ref(false)
const title = ref('支付')
const jsStr = ref('')
const cart = ref([])
const main = useMainStore();
const { orderType, address, store, location, isLogin, member, mycoupon } =
storeToRefs(main);
const distributorId = ref(null); // 分销商ID
const active = ref(false);
const title = ref("支付");
const jsStr = ref("");
const cart = ref([]);
const form = ref({
remark: ''
})
const ensureAddressModalVisible = ref(false)
const takeoutTIme = ref(false) // 外卖取餐时间picker
remark: "",
});
const ensureAddressModalVisible = ref(false);
const takeoutTIme = ref(false); // 外卖取餐时间picker
const paramsTime = ref({
year: false,
month: false,
day: false,
hour: true,
minute: true,
second: false
})
const defaultTime = ref('00:00')
const takeinTIme = ref(false) // 到店自取时间selector
const takeinRange = ref([{
name: '立即用餐',
value: 0
second: false,
});
const defaultTime = ref("00:00");
const takeinTIme = ref(false); // 到店自取时间selector
const takeinRange = ref([
{
name: "立即用餐",
value: 0,
},
{
name: '10分钟后',
value: 10
name: "10分钟后",
value: 10,
},
{
name: '20分钟后',
value: 20
name: "20分钟后",
value: 20,
},
{
name: '30分钟后',
value: 30
name: "30分钟后",
value: 30,
},
{
name: '40分钟后',
value: 40
name: "40分钟后",
value: 40,
},
{
name: '50分钟后',
value: 50
}
])
const defaultSelector = ref([0])
const payType = ref('weixin') // 付款方式
const coupons = ref(0) // 可用优惠券数量
const coupon = ref(main.mycoupon) // 选中的
name: "50分钟后",
value: 50,
},
]);
const defaultSelector = ref([0]);
const payType = ref("weixin"); // 付款方式
const coupons = ref(0); // 可用优惠券数量
const coupon = ref(main.mycoupon); // 选中的
const subscribeMss = ref({
'takein': '',
'takeout': '',
'takein_made': '',
'takeout_made': ''
})// 微信订阅信息
const uToast = ref()
takein: "",
takeout: "",
takein_made: "",
takeout_made: "",
}); // 微信订阅信息
const uToast = ref();
// 在script部分添加打包费计算属性
const getPackingFee = computed(() => {
// 计算打包费（根据每个商品的boxFee计算）
return cart.value.reduce((acc, cur) => acc + cur.number * (cur.boxFee || 0), 0);
});
// 修改total计算属性
const total = computed(() => {
return cart.value.reduce((acc, cur) => acc + cur.number * cur.price, 0);
})
const amount = computed(() =>{
let amount = cart.value.reduce((acc, cur) => acc + cur.number * cur.price, 0);
let total = cart.value.reduce((acc, cur) => acc + cur.number * cur.price, 0) + getPackingFee.value;
// 加配送费
if (store.value.distance > 0 && orderType.value == 'takeout') {
if (store.value.distance > 0 && orderType.value == "takeout") {
total += parseFloat(store.value.deliveryPrice);
}
return total.toFixed(2);
});
// 修改amount计算属性
const amount = computed(() => {
let amount = cart.value.reduce((acc, cur) => acc + cur.number * cur.price, 0) + getPackingFee.value;
// 加配送费
if (store.value.distance > 0 && orderType.value == "takeout") {
amount += parseFloat(store.value.deliveryPrice);
}
// 减去优惠券
if (main.mycoupon.hasOwnProperty('id')) {
if (main.mycoupon.hasOwnProperty("id")) {
amount -= parseFloat(main.mycoupon.value);
}
return amount.toFixed(2);
})
});
onShow(() => {
coupon.value = main.mycoupon
coupon.value = main.mycoupon;
let date = new Date(new Date().getTime() + 3600000); // 一个小时后
let hour = date.getHours();
let minute = date.getMinutes();
if (hour < 10) {
hour = '0' + hour;
hour = "0" + hour;
}
if (minute < 10) {
minute = '0' + minute;
minute = "0" + minute;
}
defaultTime.value = hour + ':' + minute;
defaultTime.value = hour + ":" + minute;
console.log('member:',member.value)
console.log("member:", member.value);
if(orderType.value == 'takeout'){
active.value = true
if (orderType.value == "takeout") {
active.value = true;
} else {
active.value = false
active.value = false;
}
getCoupons();
let paytype = uni.getStorageSync('paytype');
payType.value = paytype ? paytype : 'weixin';
})
let paytype = uni.getStorageSync("paytype");
payType.value = paytype ? paytype : "weixin";
});
onHide(() => {
subscribeMss.value = [];
coupons.value = 0;
})
});
onLoad((option) => {
cart.value = uni.getStorageSync('cart')
cart.value = uni.getStorageSync("cart");
if (option.remark) {
form.value.remark = option.remark
form.value.remark = option.remark;
}
})
});
const getSubscribeMss = async () => {
let data = []
let data = [];
if (data) {
subscribeMss.value = data;
}
}
};
// 更改支付方式
const setPayType = (paytype) => {
payType.value = 'weixin';
payType.value = "weixin";
payType.value = paytype;
uni.setStorage({
key: 'paytype',
data: paytype
})
}
key: "paytype",
data: paytype,
});
};
const getCoupons = async () => {
//0=通用,1=自取,2=外卖
let type = orderType.value == 'takein' ? 1 : 2;
let type = orderType.value == "takein" ? 1 : 2;
let data = await couponCount({
shop_id: store.value.id ? store.value.id : 0,
type: type
type: type,
});
if (data) {
coupons.value = data;
}
}
};
// 选择时间
const choiceTime = (value) => {
let hour = value.hour;
@ -414,50 +441,53 @@ const choiceTime = (value) => {
let nowhour = date.getHours();
let nowminute = date.getMinutes();
if ((hour * 60 * 60 + minute * 60) * 1000 - 3600000 < (nowhour * 60 * 60 + nowminute * 60) * 1000) {
if (
(hour * 60 * 60 + minute * 60) * 1000 - 3600000 <
(nowhour * 60 * 60 + nowminute * 60) * 1000
) {
uToast.value.show({
message: '请至少选择一个小时之后',
type: 'error'
message: "请至少选择一个小时之后",
type: "error",
});
return
return;
}
if (hour < 10) {
hour = '0' + hour;
hour = "0" + hour;
}
if (minute < 10) {
minute = '0' + minute;
minute = "0" + minute;
}
defaultTime,value = hour + ':' + minute;
defaultTime, (value = hour + ":" + minute);
takeoutTIme.value = false;
}
};
const cancelTime = (value) => {
takeoutTIme.value = false;
}
};
// 到店自取-取消选择取餐时间
const takeinCancelTime = (value) => {
takeinTIme.value = false;
}
};
// 到店自取-选择取餐时间
const takeinConfirmTime = (value) => {
defaultSelector.value = value;
}
};
// 是否外卖开关
const takout = (value) => {
let type = 'takeout';
let type = "takeout";
if (value == false) {
type = 'takein';
type = "takein";
}
main.SET_ORDER_TYPE(type);
// 如果存在优惠券看看需不需要清除
if (coupon.value.hasOwnProperty('type')) {
if (coupon.value.hasOwnProperty("type")) {
//0=通用,1=自取,2=外卖
if (coupon.value.type != 0) {
if (coupon.value.type == 1 && orderType.value == 'takeout') {
if (coupon.value.type == 1 && orderType.value == "takeout") {
coupon.value = {};
}
if (coupon.value.type == 2 && orderType.value == 'takeint') {
if (coupon.value.type == 2 && orderType.value == "takeint") {
coupon.value = {};
}
}
@ -465,64 +495,81 @@ const takout = (value) => {
subscribeMss.value = [];
coupons.value = 0;
getCoupons();
}
};
const goToRemark = () => {
uni.navigateTo({
url: '/pages/components/pages/remark/remark?remark=' + form.value.remark
url: "/pages/components/pages/remark/remark?remark=" + form.value.remark,
});
}
};
const chooseAddress = () => {
uni.navigateTo({
url: '/pages/components/pages/address/address?is_choose=true&scene=pay'
url: "/pages/components/pages/address/address?is_choose=true&scene=pay",
});
}
};
const goToPackages = () => {
let newamount = amount.value;
let coupon_id = coupon.value.id ? coupon.value.id : 0;
let type = orderType.value == 'takein' ? 1 : 2;
let type = orderType.value == "takein" ? 1 : 2;
let shop_id = store.value.id;
uni.navigateTo({
url: '/pages/components/pages/packages/index?amount=' + newamount + '&coupon_id=' + coupon_id +
'&shop_id=' + shop_id + '&type=' + type
url:
"/pages/components/pages/packages/index?amount=" +
newamount +
"&coupon_id=" +
coupon_id +
"&shop_id=" +
shop_id +
"&type=" +
type,
});
}
};
const goToShop = () => {
uni.navigateTo({
url: `/pages/components/pages/shop/shop`
url: `/pages/components/pages/shop/shop`,
});
}
};
const submit = () => {
if (orderType.value == 'takeout') {
// 外卖类型
if (typeof address.value.id == 'undefined') {
if (orderType.value == "takeout") {
// 检查是否有商品可以单独配送
const hasAloneSell = cart.value.some(item => item.aloneSell === 1);
if (!hasAloneSell) {
uToast.value.show({
message: '请选择收货地址',
type: 'error'
message: "所选商品不能单独配送",
type: "error",
});
return
return;
}
// 外卖类型
if (typeof address.value.id == "undefined") {
uToast.value.show({
message: "请选择收货地址",
type: "error",
});
return;
}
// 起送价钱
if (store.value.min_price > total.value) {
uToast.value.show({
message: '本店外卖起送价为￥' + store.value.min_price,
type: 'error'
message: "本店外卖起送价为￥" + store.value.min_price,
type: "error",
});
return
return;
}
pay();
} else {
pay();
}
}
};
const pay = async () => {
let that = this;
// #ifdef MP-WEIXIN
await new Promise(function (revolve) {
//订阅号信息id
let subscribeMss = ['8qDIfzfL19eFT-qG1PRQJBbzZSTxpzUDo3nDa1bxc3M'];
let subscribeMss = ["8qDIfzfL19eFT-qG1PRQJBbzZSTxpzUDo3nDa1bxc3M"];
// wx.showModal({ // 显示微信模态对话框
// title: '温馨提示', // 对话框标题
@ -543,18 +590,17 @@ const pay = async() => {
// }
// }
// })
revolve(true)
revolve(true);
});
// #endif
uni.showLoading({
title: '加载中'
title: "加载中",
});
let data = {
orderType: orderType.value, // 购买类型:takein=自取,takeout=外卖
addressId:orderType.value == 'takeout' ? address.value.id : 0, // 外卖配送地址
addressId: orderType.value == "takeout" ? address.value.id : 0, // 外卖配送地址
shopId: store.value.id, // 店铺id
mobile: member.value.mobile, // 联系电话
gettime: takeinRange.value[defaultSelector.value[0]].value, // 取餐时间
@ -569,11 +615,24 @@ const pay = async() => {
cart.value.forEach((item, index) => {
data.productId.push(item.id);
data.spec.push(item.valueStr.replace(/,/g, '|'));
data.spec.push(item.valueStr.replace(/,/g, "|"));
//data.spec.push(item.valueStr);
data.number.push(item.number);
});
if (!data.orderType || !data.shopId || data.shopId == "undefined" || data.shopId == null) {
uToast.value.show({
message: "订单信息不完整，请重新下单",
type: "error"
});
setTimeout(() => {
uni.switchTab({
url: "/pages/menu/menu"
});
}, 3000);
return;
}
//console.log(data);
let order = await orderSubmit(data);
if (!order) {
@ -581,31 +640,30 @@ const pay = async() => {
return;
}
main.DEL_COUPON()
main.DEL_COUPON();
if (payType.value == 'weixin') {
if (payType.value == "weixin") {
// 微信支付
weixinPay(order);
} else if (payType.value == 'yue') {
} else if (payType.value == "yue") {
// 余额支付
balancePay(order);
} else if (payType.value == 'alipay') {
} else if (payType.value == "alipay") {
// 余额支付
aliPay(order);
}
uni.hideLoading()
return
}
uni.hideLoading();
return;
};
const balancePay = async (order) => {
let from = 'routine'
let from = "routine";
// #ifdef H5
from = 'h5'
from = "h5";
// #endif
let pay = await payUnify({
uni: order.orderId,
from: from,
paytype: 'yue'
paytype: "yue",
});
uni.hideLoading();
@ -613,22 +671,22 @@ const balancePay = async(order) => {
return;
}
member.value.money -= amount.value
main.SET_MEMBER(member.value)
uni.removeStorageSync('cart');
member.value.money -= amount.value;
main.SET_MEMBER(member.value);
uni.removeStorageSync("cart");
uni.switchTab({
url: '/pages/order/order',
url: "/pages/order/order",
fail(res) {
console.log(res);
}
},
});
}
};
const weixinPay = async (order) => {
let from = 'routine'
let from = "routine";
// #ifdef H5
from = 'h5'
from = "h5";
if (isWeixin()) {
from = 'wechat'
from = "wechat";
}
// #endif
@ -636,72 +694,67 @@ const weixinPay = async(order) => {
let data = await payUnify({
uni: order.orderId,
from: from,
paytype: 'weixin'
paytype: "weixin",
});
console.log('param2:',data)
console.log("param2:", data);
if (!data) {
uni.hideLoading();
return;
}
if (data.trade_type == 'MWEB') {
if (data.trade_type == "MWEB") {
// #ifdef H5
// 微信外的H5
console.log('data:',data)
console.log("data:", data);
location.href = data.data;
// #endif
console.log('data1:',data)
} else if (data.trade_type == 'JSAPI') {
console.log('param:',data)
console.log("data1:", data);
} else if (data.trade_type == "JSAPI") {
console.log("param:", data);
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay',
provider: "wxpay",
timeStamp: data.data.timeStamp,
nonceStr: data.data.nonceStr,
package: data.data.package,
signType: 'MD5',
signType: "MD5",
paySign: data.data.paySign,
success: function (res) {
uni.removeStorageSync('cart');
uni.removeStorageSync("cart");
uni.switchTab({
url: `/pages/order/order?t=${Date.now()}`
url: `/pages/order/order`,
});
},
fail: function (err) {
console.log('fail:' + JSON.stringify(err));
}
console.log("fail:" + JSON.stringify(err));
},
});
// #endif
} else if (data.trade_type == 'W-JSAPI'){
} else if (data.trade_type == "W-JSAPI") {
//公众号支付
}else if (data.trade_type == 'APP') {
}
} else if (data.trade_type == "APP") {
}
};
const aliPay = async (order) => {
// #ifdef H5
//let that = this;
if (isWeixin()) {
uni.showToast({
title: '请普通浏览器打开进行支付宝支付~',
icon: 'none'
})
return
title: "请普通浏览器打开进行支付宝支付~",
icon: "none",
});
return;
}
let data = await payUnify({
uni: order.orderId,
from: 'h5',
paytype: 'alipay'
from: "h5",
paytype: "alipay",
});
console.log('data:',data.data)
console.log("data:", data.data);
// 支付宝支付，这里只要提交表单
let form = data.data
const div = document.createElement('formdiv');
let form = data.data;
const div = document.createElement("formdiv");
div.innerHTML = form;
document.body.appendChild(div);
//document.forms[0].setAttribute('target', ' self');
@ -709,13 +762,18 @@ const aliPay = async(order) => {
//div.remove();
// #endif
};
const fillMobile = () => {
if (member.value && member.value.mobile) {
member.value.mobile = member.value.mobile;
} else {
uToast.value.show({
message: "未获取到手机号",
type: "error"
});
}
};
</script>
<style lang="scss" scoped>

71
pages/menu/menu.vue
View File

@ -55,7 +55,8 @@
<!-- <view class="" style=" width: 95%; height: 85%; border-radius: 26px; background-color: lightgray;">
</view> -->
<!-- {{ ads.list[0].image }} -->
<image :src="ads.list[0].image" mode="aspectFill" class="shop-banner" style="background-color:lightgray; border-radius: 2ch;"></image>
<image :src="ads.list[0].image" mode="aspectFill" class="shop-banner"
style="background-color:lightgray; border-radius: 2ch;"></image>
</view>
@ -164,7 +165,8 @@
<scroll-view class="modal-body" scroll-y>
<view v-if="good.image" class="modal-image">
<image mode="aspectFill" style="width: 100%; height: 100%; border-radius: 22rpx;" :src="good.image"></image>
<image mode="aspectFill" style="width: 100%; height: 100%; border-radius: 22rpx;"
:src="good.image"></image>
</view>
<view class="modal-content">
@ -220,11 +222,23 @@
<uv-popup ref="popup" mode="bottom" class="cart-popup">
<template #default>
<view class="cart-popup-container">
<view class="popup-header">
<text @tap="handleCartClear">清空</text>
</view>
<scroll-view class="cart-items" scroll-y>
<view class="items-wrapper">
<!-- 添加打包费行 -->
<view class="cart-item packing-fee" @tap="toPackingFeeDetail">
<view class="item-info">
<view class="item-name">打包费</view>
</view>
<view class="item-price">
<text>￥{{ getPackingFee }}</text>
</view>
</view>
<view class="cart-item" v-for="(item, index) in cart" :key="index">
<view class="item-info">
<view class="item-name">{{ item.name }}</view>
@ -350,10 +364,19 @@
//计算购物车总数
return cart.value.reduce((acc, cur) => acc + cur.number, 0);
});
// const getCartGoodsPrice = computed(() => {
// //计算购物车总价
// let price = cart.value.reduce((acc, cur) => acc + cur.number * cur.price, 0);
// return parseFloat(price).toFixed(2);
// });
const getCartGoodsPrice = computed(() => {
//计算购物车总价
let price = cart.value.reduce((acc, cur) => acc + cur.number * cur.price, 0);
return parseFloat(price).toFixed(2);
//计算购物车总价（商品价格+餐饮盒费用）
let total = cart.value.reduce((acc, cur) => {
const itemPrice = cur.price * cur.number;
const boxPrice = (cur.boxFee || 0) * cur.number; // 计算每个商品的餐饮盒费用
return acc + itemPrice + boxPrice;
}, 0);
return parseFloat(total).toFixed(2);
});
const disabledPay = computed(() => {
//是否达到起送价
@ -402,7 +425,7 @@
});
const openCartShow = () => {
isCartShow.value = false;
// isCartShow.value = false;
};
const in_array = (search, array) => {
for (var i in array) {
@ -544,7 +567,6 @@
});
if (data) {
ads.value = data;
console.log("ads1111:", ads.value);
}
}
const takout = (force = false) => {
@ -719,6 +741,7 @@
// sizeCalcState.value = true
// }
const handleAddToCart = (cate, newGood, num) => {
console.log("handleAddToCart121212:", cate, newGood, num);
//添加到购物车
const index = cart.value.findIndex((item) => {
if (newGood) {
@ -727,6 +750,11 @@
return item.id === newGood.id;
}
});
// 计算餐饮盒费用（假设每个商品需要1个餐饮盒，每个0.5元）
const boxFee = newGood.boxFee || 0; // 如果没有设置boxFee则默认0.5元
if (index > -1) {
cart.value[index].number += num;
} else {
@ -738,6 +766,8 @@
number: num,
image: newGood.image,
valueStr: good.value.valueStr,
boxFee: boxFee, // 添加餐饮盒费用
aloneSell: newGood.aloneSell,
});
}
uni.setStorageSync("cart", JSON.parse(JSON.stringify(cart.value)));
@ -892,6 +922,17 @@
uni.hideLoading();
};
const getPackingFee = computed(() => {
// 计算打包费（根据每个商品的boxFee计算）
return cart.value.reduce((acc, cur) => acc + cur.number * (cur.boxFee || 0), 0);
});
const toPackingFeeDetail = () => {
// uni.navigateTo({
// url: "/pages/components/pages/packing-fee/packing-fee"
// });
};
</script>
<style lang="scss" scoped>
@ -1421,6 +1462,22 @@
text-align: right;
}
// 添加打包费样式
.packing-fee {
border-bottom: 1px dashed #eee;
padding: 20rpx 0;
.item-info {
flex: 1;
}
.item-price {
font-size: 28rpx;
color: #999;
padding: 0 20rpx;
}
}
.cart-items {
max-height: calc(70vh - 80rpx);
}

6
pages/mine/mine.vue
View File

@ -239,7 +239,7 @@ const serv = (item) => {
return;
}
if (item.pages === "/pages/components/pages/fenxiao/fenxiao") {
if (member.value.spreadUid === 0 || member.value.spreadUid === null || member.value.spreadUid === '0') {
if (member.value.spreadUid === 0 || member.value.spreadUid === null || member.value.spreadUid === '0' || member.value.spreadUid === "") {
uni.navigateTo({
url: `/pages/components/pages/fenxiao/fenxiaorequestform?id=${member.value.id}`,
});
@ -248,6 +248,10 @@ const serv = (item) => {
url: `${item.pages}?spreadUid=${member.value.spreadUid}`,
});
}
} else if(item.pages === "/pages/components/pages/invoice/invoice") {
uni.navigateTo({
url: `/pages/components/pages/invoice/invoice?userId=${member.value.id}`,
});
} else {
uni.navigateTo({
url: item.pages,

20
pages/order/order.vue
View File

@ -128,14 +128,19 @@
import { ref, computed } from "vue";
import { useMainStore } from "@/store/store";
import { storeToRefs } from "pinia";
import { onLoad, onPullDownRefresh, onReachBottom } from "@dcloudio/uni-app";
import {
onLoad,
onPullDownRefresh,
onReachBottom,
onShow,
} from "@dcloudio/uni-app";
import { formatDateTime, kmUnit } from "@/utils/util";
import { orderGetOrders, orderReceive } from "@/api/order";
import { applyInvoice } from "@/api/order";
// 确保导入payUnify方法
import { payUnify } from '@/api/order';
import { isWeixin } from '@/utils/util';
import { payUnify } from "@/api/order";
import { isWeixin } from "@/utils/util";
const main = useMainStore();
const { isLogin } = storeToRefs(main);
@ -181,10 +186,15 @@ onLoad(() => {
if (!isLogin.value) {
uni.navigateTo({ url: "/pages/components/pages/login/login" });
}
getOrders(false);
onShow();
});
onShow(() => {
if (isLogin.value) {
getOrders(true); // 每次显示页面时刷新订单数据
}
});
onPullDownRefresh(() => {
getOrders(false);
getOrders(true);
});
onReachBottom(() => {
getOrders(false);