weipengfei
/
purchase-let
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

更新

This commit is contained in:
1154079537 2024-06-05 18:45:30 +08:00
parent 1db31e0ed7
commit 91fb79033b
27 changed files with 3899 additions and 1379 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
api/cart.js
View File

@ -29,5 +29,5 @@ export const frequentlyPurchaseApi = (data) => {
//购物车-零售购物车预检 //购物车-零售购物车预检
export const checkOrderApi = (data) => { export const checkOrderApi = (data) => {
return request.post('/order/RetailOrder/checkOrder', data); return request.post('/order/order/checkOrder', data);
} }

48
api/order.js
View File

@ -1,41 +1,57 @@
import request from '@/utils/request'; import request from '@/utils/request';
//提交零售订单(支付一起) //提交零售订单(支付一起)
export const createOrderApi = (data)=>{ export const createOrderApi = (data) => {
return request.post('/order/RetailOrder/createOrder', data); return request.post('/order/order/createOrder', data);
} }
//订单列表 //订单列表
export const orderListApi = (data)=>{ export const orderListApi = (data) => {
return request.get('/order/retailOrder/order_list', data); return request.get('/order/order/order_list', data);
} }
//订单详情 //订单详情
export const orderDetailApi = (data)=>{ export const orderDetailApi = (data) => {
return request.get('/order/RetailOrder/detail', data); return request.get('/order/order/detail', data);
} }
//重新发起支付 //重新发起支付
export const rePaymentApi = (data)=>{ export const rePaymentApi = (data) => {
return request.post('/order/RetailOrder/Repayment', data); return request.post('/order/order/Repayment', data);
} }
//订单数量统计 //订单数量统计
export const orderCountApi = (data)=>{ export const orderCountApi = (data) => {
return request.post('/order/RetailOrder/order_count', data); return request.post('/order/order/order_count', data);
} }
//取消订单 //取消订单
export const cancelOrderApi = (data)=>{ export const cancelOrderApi = (data) => {
return request.post('/order/RetailOrder/cancel_order', data); return request.post('/order/order/cancel_order', data);
} }
//订单确认收货 //订单确认收货
export const confirmReceiptApi = (data)=>{ export const confirmReceiptApi = (data) => {
return request.post('/order/RetailOrder/confirm_receipt', data); return request.post('/order/order/confirm_receipt', data);
} }
//订单再次购买 //订单再次购买
export const purchaseAgainApi = (data)=>{ export const purchaseAgainApi = (data) => {
return request.get('/order/RetailOrder/purchase_again', data); return request.get('/order/order/purchase_again', data);
}
// 核销
// 核销订单列表
export const writeListApi = (data) => {
return request.post('/order/order/write_list', data);
}
// 单个订单核销
export const writeOrderApi = (data) => {
return request.post('/order/order/writeoff_order', data);
}
// 核销数量统计
export const writeCountApi = (data) => {
return request.post('/order/order/write_count', data);
} }

58
api/user.js
View File

@ -1,57 +1,63 @@
import request from '@/utils/request'; import request from '@/utils/request';
// 密码登录 // 密码登录
export const userLoginApi = (data)=>{ export const userLoginApi = (data) => {
return request.post('/login/account', data, { return request.post('/login/account', data, {
noAuth: true noAuth: true
}); });
} }
// 微信登录 // 微信登录
export const userLoginWeixinApi = (data)=>{ export const userLoginWeixinApi = (data) => {
return request.post('/login/mnpLogin', data, { return request.post('/login/mnpLogin', data, {
noAuth: true noAuth: true
}); });
} }
// 微信获取手机号 // 微信获取手机号
export const getMobileByMnpApi = (data)=>{ export const getMobileByMnpApi = (data) => {
return request.post('/user/User/getMobileByMnp', data, { return request.post('/user/User/getMobileByMnp', data, {
noAuth: true noAuth: true
}); });
} }
// 更新信息 // 更新信息
export const loginUpdateUserApi = (data)=>{ export const loginUpdateUserApi = (data) => {
return request.post('/login/updateUser', data); return request.post('/login/updateUser', data);
} }
// 添加地址 // 添加地址
export const addressCreateApi = (data)=>{ export const addressCreateApi = (data) => {
return request.post('/user/address/create', data); return request.post('/user/address/create', data);
} }
// 修改地址 // 修改地址
export const addressEditApi = (data)=>{ export const addressEditApi = (data) => {
return request.post('/user/address/edit', data); return request.post('/user/address/edit', data);
} }
// 删除地址 // 删除地址
export const addressDeleteApi = (data)=>{ export const addressDeleteApi = (data) => {
return request.post('/user/address/delete', data); return request.post('/user/address/delete', data);
} }
// 地址列表 // 地址列表
export const addressListsApi = (data)=>{ export const addressListsApi = (data) => {
return request.get('/user/address/lists', data); return request.get('/user/address/lists', data);
} }
// 地址详情 // 地址详情
export const addressDetailApi = (data)=>{ export const addressDetailApi = (data) => {
return request.get('/user/address/detail', data); return request.get('/user/address/detail', data);
} }
// 自提点列表 // 自提点列表
export const merchantListApi = (data)=>{ export const merchantListApi = (data) => {
return request.get('/merchant/merchant/lists', data); return request.get('/merchant/merchant/lists', data);
}
// 充值
export const rechargeApi = (data) => {
return request.post('/user/user/recharge', data);
} }

13
config/app.js
View File

@ -1,19 +1,10 @@
let BASE_URL let BASE_URL
import store from "@/store/user.js" import store from "@/store/user.js"
// 环境 // 环境
// let env = "dev" let env = "dev"
// let env = "test" // let env = "liu";
// let env = "prod"
// let env = "local"
let env = "liu";
switch (env) { switch (env) {
case 'prod':
BASE_URL = 'https://erp.lihaink.cn';
break;
case 'test':
BASE_URL = 'https://ceshi-erp.lihaink.cn';
break;
case 'liu': case 'liu':
BASE_URL = 'http://192.168.1.201:8545'; BASE_URL = 'http://192.168.1.201:8545';
break; break;

BIN
multipleShop/images/charge_bg.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 191 KiB

BIN
multipleShop/images/write_done.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

263
multipleShop/index/index.vue
View File

@ -1,3 +1,188 @@
<template>
<view class="multiple">
<view class="multiple-search">
<u-search v-model="queryParams.name" :animation="true" :showAction="false" bgColor="#f6f6f6"
placeholder="请输入门店"></u-search>
<view class="multiple-search-txt" @click.native="handleSearch">搜索</view>
</view>
<view class="multiple-card">
<scroll-view :scroll-y="true" style="height:100%;" @scrolltolower="onReachBottom">
<view class="multiple-card-wrap" style="padding-top: 12rpx;">
<block v-for="(item,indx) in shopList" :key="indx">
<view class="multiple-card-item" :class="{active:currShop == item.id}"
@click="onChooseShop(item.id)">
<view class="multiple-card-item-left">
<view class="multiple-card-item-left-title">{{item.name}}</view>
<view class="multiple-card-item-left-tag">
<text class="yellow" v-if="item.is_store == 1">可自提</text>
<text class="green" v-if="item.is_send == 1">可配送</text>
</view>
<view class="multiple-card-item-left-info">
<u-image src="../../multipleShop/images/location_small.webp" width="24rpx"
height="24rpx" />
<text>{{item.detailed_address || '-'}}</text>
</view>
<view class="multiple-card-item-left-info">
<u-image src="../../multipleShop/images/time.webp" width="24rpx" height="24rpx" />
<text
v-if="item.day_start && item.day_end">{{item.day_start + '-' + item.day_end}}</text>
<text v-else>9:00-18:00</text>
</view>
</view>
<view class="multiple-card-item-right">
<view class="multiple-card-item-right-distance">距离{{parseDistance(item.distance)}}
</view>
<view class="multiple-card-item-right-icon">
<view style="margin-right: 30rpx;" @click.stop="onPhoneCall(item.phone)">
<u-image src="../../multipleShop/images/phone.webp" width="48rpx"
height="48rpx" />
</view>
<view @click.stop="onNavgation(item)">
<u-image src="../../multipleShop/images/location.webp" width="48rpx"
height="48rpx" />
</view>
</view>
</view>
</view>
</block>
</view>
<u-loadmore :status="status" iconColor="#666" />
</scroll-view>
</view>
</view>
</template>
<script setup>
import {
reactive,
ref,
} from "vue";
import {
shopListApi
} from "@/api/multipleShop.js";
import {
onLoad,
onShow
} from "@dcloudio/uni-app";
const currShop = ref(''); // 选择门店
const shopList = ref([]); // 门店列表
const status = ref(''); // 滚动状态
// 查询参数
const queryParams = reactive({
longitude: '',
latitude: '',
phone: '',
name: '',
page_no: 1,
page_size: 6
})
// 初始化
onLoad(() => {
// 获取定位
getLocation();
});
// 门店选择
const onChooseShop = (id) => {
currShop.value = id;
setTimeout(() => {
uni.reLaunch({
url: '/pages/index/index?id=' + id,
fail(err) {
console.log(err);
}
})
}, 300)
}
// 触底刷新
const onReachBottom = () => {
getShopList();
}
// 搜索
const handleSearch = () => {
shopList.value = [];
queryParams.page_no = 1;
status.value = '';
getShopList();
}
// 获取门店
const getShopList = () => {
if (status.value == 'nomore') return;
if (status.value == 'loading') return;
status.value == 'loading';
shopListApi(queryParams).then(res => {
let len = res.data.lists;
status.value = queryParams.page_size > len ? 'nomore' : 'loadmore';
shopList.value = shopList.value.concat(res.data.lists);
if (status.value == 'loadmore') queryParams.page_no += 1;
})
}
// 门店距离处理
const parseDistance = (e) => {
if (!e) return '-';
if (e > 1) {
return (e.toFixed(1)) + 'km';
} else {
return (e * 1000).toFixed(0) + 'm';
}
}
// 拨打门店电话
const onPhoneCall = (phone) => {
if (!phone) return;
uni.makePhoneCall({
phoneNumber: phone
})
}
// 导航
const onNavgation = (item) => {
uni.openLocation({
latitude: Number(item.latitude),
longitude: Number(item.longitude),
})
}
// 获取定位
const getLocation = () => {
let location = uni.getStorageSync('location');
if (location) {
let [lng, lat] = location.split(',');
queryParams.longitude = lng;
queryParams.latitude = lat;
// 加载店铺列表
getShopList();
} else {
uni.getLocation({
type: "gcj02",
success(res) {
queryParams.latitude = res.latitude;
queryParams.longitude = res.longitude;
// 加载店铺列表
getShopList();
// 避免下次再获取
uni.setStorageSync('location', `${res.longitude},${res.latitude}`)
}
})
}
}
</script>
<style lang="scss"> <style lang="scss">
page { page {
background: #FAFAFA; background: #FAFAFA;
@ -20,6 +205,7 @@
position: absolute; position: absolute;
right: 28rpx; right: 28rpx;
top: 50%; top: 50%;
z-index: 11;
transform: translateY(-50%); transform: translateY(-50%);
width: 110rpx; width: 110rpx;
height: 52rpx; height: 52rpx;
@ -33,7 +219,12 @@
} }
.multiple-card { .multiple-card {
padding-top: 24rpx; height: calc(100vh - 90rpx);
padding-bottom: 12rpx;
.u-loadmore {
padding-bottom: 40rpx;
}
.multiple-card-item { .multiple-card-item {
display: flex; display: flex;
@ -52,6 +243,9 @@
font-weight: bold; font-weight: bold;
font-size: 28rpx; font-size: 28rpx;
color: #444444; color: #444444;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.multiple-card-item-left-tag { .multiple-card-item-left-tag {
@ -84,9 +278,10 @@
.multiple-card-item-left-info { .multiple-card-item-left-info {
display: flex; display: flex;
padding-right: 10rpx;
&:nth-child(1) { &:nth-child(1) {
margin-bottom: 10rpx; margin-bottom: 16rpx;
} }
text { text {
@ -104,6 +299,7 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: 30%; width: 30%;
flex-shrink: 0;
.multiple-card-item-right-distance { .multiple-card-item-right-distance {
margin-bottom: 20rpx; margin-bottom: 20rpx;
@ -150,65 +346,4 @@
} }
} }
} }
</style> </style>
<template>
<view class="multiple">
<view class="multiple-search">
<u-search :animation="true" :showAction="false" bgColor="#f6f6f6" placeholder="请输入门店"></u-search>
<view class="multiple-search-txt">搜索</view>
</view>
<view class="multiple-card">
<view class="multiple-card-item active" v-for="item in 10">
<view class="multiple-card-item-left">
<view class="multiple-card-item-left-title">泸州春雨路自提中转中心</view>
<view class="multiple-card-item-left-tag">
<text class="yellow">可自提</text>
<text class="green">可配送</text>
</view>
<view class="multiple-card-item-left-info">
<u-image src="../images/location_small.webp" width="24rpx" height="24rpx" />
<text>四川省泸州市龙马潭区一环春雨路一段107号一环路117号</text>
</view>
<view class="multiple-card-item-left-info">
<u-image src="../images/time.webp" width="24rpx" height="24rpx" />
<text>09:00-20:00</text>
</view>
</view>
<view class="multiple-card-item-right">
<view class="multiple-card-item-right-distance">距离1km</view>
<view class="multiple-card-item-right-icon">
<view style="margin-right: 30rpx;">
<u-image src="../images/phone.webp" width="48rpx" height="48rpx" />
</view>
<u-image src="../images/location.webp" width="48rpx" height="48rpx" />
</view>
</view>
</view>
</view>
</view>
</template>
<script setup>
import {
shopListApi
} from "@/api/multipleShop.js";
import {
onLoad
} from "@dcloudio/uni-app"
// 获取门店
const getShopList = () => {
shopListApi().then(res => {
console.log(res);
})
}
onLoad(() => {
getShopList();
})
</script>

187
multipleShop/orderVerification/index.vue
View File

@ -1,3 +1,124 @@
<template>
<view class="orderVerification">
<!-- 输入核销码 -->
<view class="verification">
<view class="num">1</view>
<view class="verification-title">核销券码</view>
<u-input v-model="writeCode" inputAlign="center" :customStyle="{'border-color':'#38BE41 !important'}"
placeholder="请输入核销券码"></u-input>
<view class="verification-btn" :style="{opacity:writeCode?1:'.6'}" @click="onConfirmWrite">确认核销</view>
</view>
<!-- 二维码 -->
<view class="verification">
<view class="num">2</view>
<view class="verification-title" style="margin-bottom: 48rpx;">二维码核销</view>
<view class="scan">
<view class="scan1" @click="onScanToWrite">
<u-image width="84rpx" height="84rpx" src="../images/scan.png"></u-image>
</view>
</view>
</view>
<!-- 弹框 -->
<u-popup :show="show" @close="close" @open="open" mode="center">
<view class="popup">
<view class="popup-wrap">
<view class="popup-title">请确认核销订单</view>
<view class="popup-order_num">订单编号:wxo1709797879549583601</view>
<view class="popup-goods">
<view class="popup-goods-left">
<u-image width="100rpx" height="100rpx" radius="8rpx" />
</view>
<view class="popup-goods-right">
<view class="popup-goods-right-info">
<text class='goods_name'>黄牛牛肉</text>
<text class="goods_price">￥10.00</text>
</view>
<view class="popup-goods-num">x5</view>
<view class="popup-goods-total">
<text class="popup-goods-total-num">共5件商品，总金额</text>
<text class="popup-goods-total-price">￥50.00</text>
</view>
</view>
</view>
<view class="verification-btn">确认核销</view>
</view>
</view>
</u-popup>
</view>
</template>
<script setup>
import {
ref
} from "vue";
import {
writeOrderApi
} from "@/api/order.js";
const show = ref(false);
const writeCode = ref('');
// 确认核销
const onConfirmWrite = () => {
if (!writeCode) return;
writeOrderApi({
verify_code: writeCode.value
}).then(res => {
if (res.code == 1) {
uni.showToast({
title: '核销成功',
icon: 'none',
success() {
uni.$u.sleep(1500).then(rrr => {
uni.navigateBack();
})
}
})
} else {
uni.showToast({
title: '核销失败',
icon: 'none',
success() {
writeCode.value = '';
}
})
}
})
}
// 切换到核销
const onScanToWrite = () => {
uni.scanCode({
success(resp) {
writeOrderApi({
verify_code: resp.result
}).then(res => {
if (res.code == 1) {
uni.showToast({
title: '核销成功',
icon: 'none',
success() {
uni.$u.sleep(1500).then(rrr => {
uni.navigateBack();
})
}
})
} else {
uni.showToast({
title: '核销失败',
icon: 'none'
})
}
})
}
})
}
</script>
<style lang="scss" scoped> <style lang="scss" scoped>
.orderVerification { .orderVerification {
padding-top: 68rpx; padding-top: 68rpx;
@ -36,8 +157,6 @@
text-align: center; text-align: center;
} }
.scan { .scan {
display: flex; display: flex;
align-items: center; align-items: center;
@ -72,6 +191,7 @@
font-size: 32rpx; font-size: 32rpx;
color: #FFFFFF; color: #FFFFFF;
text-align: center; text-align: center;
transition: opacity .3;
} }
::v-deep .u-popup__content { ::v-deep .u-popup__content {
@ -150,7 +270,6 @@
.popup-goods-total-num { .popup-goods-total-num {
font-size: 24rpx; font-size: 24rpx;
color: #666666; color: #666666;
} }
.popup-goods-total-price { .popup-goods-total-price {
@ -163,64 +282,4 @@
} }
} }
} }
</style> </style>
<template>
<view class="orderVerification">
<!-- 输入核销码 -->
<view class="verification">
<view class="num">1</view>
<view class="verification-title">核销券码</view>
<u-input inputAlign="center" :customStyle="{'border-color':'#38BE41 !important'}"
placeholder="请输入核销券码"></u-input>
<view class="verification-btn">确认核销</view>
</view>
<!-- 二维码 -->
<view class="verification">
<view class="num">2</view>
<view class="verification-title" style="margin-bottom: 48rpx;">二维码核销</view>
<view class="scan">
<view class="scan1">
<u-image width="54rpx" height="50rpx" src="../images/scan.png"></u-image>
</view>
</view>
</view>
<!-- 弹框 -->
<u-popup :show="show" @close="close" @open="open" mode="center">
<view class="popup">
<view class="popup-wrap">
<view class="popup-title">请确认核销订单</view>
<view class="popup-order_num">订单编号:wxo1709797879549583601</view>
<view class="popup-goods">
<view class="popup-goods-left">
<u-image width="100rpx" height="100rpx" radius="8rpx" />
</view>
<view class="popup-goods-right">
<view class="popup-goods-right-info">
<text class='goods_name'>黄牛牛肉</text>
<text class="goods_price">￥10.00</text>
</view>
<view class="popup-goods-num">x5</view>
<view class="popup-goods-total">
<text class="popup-goods-total-num">共5件商品，总金额</text>
<text class="popup-goods-total-price">￥50.00</text>
</view>
</view>
</view>
<view class="verification-btn">确认核销</view>
</view>
</view>
</u-popup>
</view>
</template>
<script setup>
import {
ref
} from "vue";
const show = ref(true);
</script>

127
multipleShop/test.vue Normal file
View File

@ -0,0 +1,127 @@
<style lang="scss">
.detail {
width: 710rpx;
background: #FFFFFF;
border-radius: 12rpx;
margin: 24rpx auto 0;
padding: 0 30rpx 24rpx;
box-sizing: border-box;
.detail-order_num {
height: 78rpx;
line-height: 78rpx;
margin-bottom: 24rpx;
font-weight: 600;
font-size: 26rpx;
color: #333333;
border-bottom: 2rpx solid #f1f1f1;
}
.detail-form {
border-bottom: 2rpx solid #f1f1f1;
margin-bottom: 24rpx;
.detail-form-item {
margin-bottom: 16rpx;
font-size: 26rpx;
color: #333333;
}
}
.popup-goods {
display: flex;
justify-content: space-between;
width: 630rpx;
border-radius: 16rpx;
margin-bottom: 20rpx;
padding-bottom: 1rpx;
box-sizing: border-box;
border-bottom: 2rpx solid #f1f1f1;
.popup-goods-left {
margin-right: 24rpx;
}
.popup-goods-right {
flex-grow: 1;
.popup-goods-right-info {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20rpx;
.goods_name {
font-size: 24rpx;
color: #333333;
}
.goods_price {
font-weight: bold;
font-size: 24rpx;
color: #060606;
}
}
.popup-goods-num {
margin-bottom: 20rpx;
font-size: 24rpx;
color: #777777;
text-align: right;
}
}
}
.popup-goods-total {
text-align: right;
.popup-goods-total-num {
font-size: 24rpx;
color: #666666;
}
.popup-goods-total-price {
font-size: 26rpx;
color: #333;
}
}
}
</style>
<template>
<view class="detail">
<view class="detail-order_num">订单编号:123123123</view>
<view class="detail-form">
<view class="detail-form-item">收货人：</view>
<view class="detail-form-item">核销码：</view>
<view class="detail-form-item">联系电话：</view>
<view class="detail-form-item">核销门店：</view>
<view class="detail-form-item">核销时间：</view>
</view>
<view class="popup-goods">
<view class="popup-goods-left">
<u-image width="100rpx" height="100rpx" radius="8rpx" />
</view>
<view class="popup-goods-right">
<view class="popup-goods-right-info">
<text class='goods_name'>黄牛牛肉</text>
<text class="goods_price">￥10.00</text>
</view>
<view class="popup-goods-num">x5</view>
</view>
</view>
<view class="popup-goods-total">
<text class="popup-goods-total-num">共5件商品，总金额</text>
<text class="popup-goods-total-price">￥50.00</text>
</view>
</view>
</template>
<script setup>
uni.login({
success(res) {
console.log(res);
}
})
</script>

137
multipleShop/verificationOrder/detail.vue
View File

@ -1,3 +1,87 @@
<template>
<view class="detail">
<view class="detail-order_num">订单编号:{{shopInfo.order_id}}</view>
<view class="detail-form">
<view class="detail-form-item">收货人：{{shopInfo.real_name || '-'}}</view>
<view class="detail-form-item">核销码：{{shopInfo.verify_code || '-'}}</view>
<view class="detail-form-item">核销门店：{{shopInfo.store_name || '-'}}</view>
<view class="detail-form-item">核销时间：{{shopInfo?.goods_list[0]?.writeoff_time || ''}}
</view>
</view>
<view class="popup-goods">
<view class="popup-goods-left">
<u-image width="100rpx" height="100rpx" radius="8rpx" :src="shopInfo.goods_list[0].image" />
</view>
<view class="popup-goods-right">
<view class="popup-goods-right-info">
<text class='goods_name'>{{shopInfo?.goods_list[0]?.store_name || ''}}</text>
<text class="goods_price">￥{{shopInfo?.goods_list[0]?.price || '0.00'}}</text>
</view>
<view class="popup-goods-num">x{{shopInfo?.goods_list[0]?.cart_num || 0}}</view>
</view>
</view>
<view class="popup-goods-total">
<text class="popup-goods-total-num">共计{{shopInfo.total_num || 0}}件</text>
</view>
<view class="batch-write" @click="onClickToWrite">
<up-image width="36rpx" height="36rpx" src="@/multipleShop/images/scan.png" />
<view>扫码核销</view>
</view>
</view>
</template>
<script setup>
import {
onLoad
} from "@dcloudio/uni-app";
import {
ref,
getCurrentInstance
} from "vue";
import {
writeOrderApi
} from "@/api/order.js";
const instance = getCurrentInstance().proxy;
// 订单详情
const shopInfo = ref({});
onLoad(() => {
const eventChannel = instance.getOpenerEventChannel();
eventChannel.on('transferDataToDetail', function(data) {
shopInfo.value = data;
})
})
// 切换到核销
const onClickToWrite = () => {
uni.scanCode({
success(resp) {
writeOrderApi({
verify_code: resp.result
}).then(res => {
if (res.code == 1) {
uni.showToast({
title: '核销成功',
icon: 'none',
success() {
uni.$u.sleep(1500).then(rrr => {
uni.navigateBack();
})
}
})
} else {
uni.showToast({
title: '核销失败',
icon: 'none'
})
}
})
}
})
}
</script>
<style lang="scss"> <style lang="scss">
.detail { .detail {
width: 710rpx; width: 710rpx;
@ -74,46 +158,29 @@
.popup-goods-total { .popup-goods-total {
text-align: right; text-align: right;
margin-bottom: 50rpx;
.popup-goods-total-num { .popup-goods-total-num {
font-size: 24rpx; font-size: 24rpx;
color: #666666; color: #20B128;
font-weight: 600;
} }
}
.popup-goods-total-price { .batch-write {
font-size: 26rpx; display: flex;
color: #333; justify-content: center;
align-items: center;
width: 670rpx;
height: 90rpx;
background: #20B128;
border-radius: 20rpx;
&>view {
font-size: 32rpx;
color: #FFFFFF;
margin-left: 8rpx;
} }
} }
} }
</style> </style>
<template>
<view class="detail">
<view class="detail-order_num">订单编号:123123123</view>
<view class="detail-form">
<view class="detail-form-item">收货人：</view>
<view class="detail-form-item">核销码：</view>
<view class="detail-form-item">核销门店：</view>
<view class="detail-form-item">核销时间：</view>
</view>
<view class="popup-goods">
<view class="popup-goods-left">
<u-image width="100rpx" height="100rpx" radius="8rpx" />
</view>
<view class="popup-goods-right">
<view class="popup-goods-right-info">
<text class='goods_name'>黄牛牛肉</text>
<text class="goods_price">￥10.00</text>
</view>
<view class="popup-goods-num">x5</view>
</view>
</view>
<view class="popup-goods-total">
<text class="popup-goods-total-num">共5件商品，总金额</text>
<text class="popup-goods-total-price">￥50.00</text>
</view>
</view>
</template>

297
multipleShop/verificationOrder/index.vue
View File

@ -1,3 +1,208 @@
<template>
<view class="order">
<view class="order-search">
<u-search v-model="queryParams.name" :animation="true" :showAction="false" bgColor="#f6f6f6"
placeholder="请输入门店" @confirm="onSearch"></u-search>
<view class="order-search-txt" @click.native="onSearch">搜索</view>
</view>
<view class="order-tab">
<view class="order-tab-item" @click="onTabChange(1)" :class="{'order-tab-active':queryParams.status==1}">
待配送({{wCount.no_send}})</view>
<view class="order-tab-item" @click="onTabChange(2)" :class="{'order-tab-active':queryParams.status==2}">
已配送({{wCount.send}})</view>
</view>
<view class="order-list">
<scroll-view style="height: 100%;" :scroll-y="true" @scrolltolower="onScrollToLower">
<view class="order-list-wrap">
<block v-for="(item,indx) in wiriteList" :key="indx">
<view class="order-list-item" @click="onClickToDetail(item)" v-if="queryParams.status == 1">
<view class="order-list-item-order_num">订单编号:{{item.order_id}}</view>
<view class="order-list-item-trans">
<view class="order-list-item-trans-right">
<view class="order-type">{{item.shipping_type == 1?'配送订单':'自提订单'}} </view>
<view class="order-reciver">收货人：{{item.real_name}}</view>
<view class="order-verification-time">商品信息：{{item.goods_list[0].store_name}}</view>
</view>
<view class="order-list-item-trans-left" @click.stop="onClickToWrite(item)">
<up-image width="76rpx" height="76rpx" src="@/multipleShop/images/scan.png" />
</view>
</view>
</view>
<!-- 已经核销 -->
<view class="order-list-item" @click="onClickToDetail(item)" v-if="queryParams.status == 2">
<view class="order-list-item-order_num">订单编号:{{item.order_id}}</view>
<view class="order-list-item-trans">
<view class="order-list-item-trans-left" @click.stop="onClickToWrite(item)">
<up-image width="76rpx" height="76rpx" src="@/multipleShop/images/write_done.png" />
</view>
<view class="order-list-item-trans-right">
<view class="order-type">{{item.shipping_type == 1?'配送订单':'自提订单'}} </view>
<view class="order-reciver">收货人：{{item.real_name}}</view>
<view class="order-verification-time">商品信息：{{item.goods_list[0].store_name}}</view>
</view>
</view>
</view>
</block>
</view>
<view class="load-wrap">
<up-loadmore :status="status" />
</view>
</scroll-view>
<view class="batch-write" @click="onPatchWrite">
<up-image width="36rpx" height="36rpx" src="@/multipleShop/images/scan.png" />
<view>扫码核销</view>
</view>
</view>
</view>
</template>
<script setup>
import {
onLoad,
onShow,
} from "@dcloudio/uni-app";
import {
reactive,
ref
} from "vue";
import {
writeListApi,
writeOrderApi,
writeCountApi
} from "@/api/order.js";
// 搜索条件
const onSearch = () => {
queryParams.value.page_no = 1;
status.value = '';
wiriteList.value = [];
getList();
}
// tab切换
const onTabChange = (e) => {
queryParams.value.status = e;
queryParams.value.page_no = 1;
status.value = '';
wiriteList.value = [];
getList();
}
// 详情页面
const onClickToDetail = (item) => {
uni.navigateTo({
url: "/multipleShop/verificationOrder/detail",
success(res) {
res.eventChannel.emit('transferDataToDetail', item)
}
})
}
// 切换到核销
const onClickToWrite = (item) => {
uni.scanCode({
success(resp) {
writeOrderApi({
verify_code: resp.result
}).then(res => {
if (res.code == 1) {
uni.showToast({
title: '核销成功',
icon: 'none',
success() {
uni.$u.sleep(1500).then(rrr => {
status.value = '';
queryParams.value.page_no = 1;
wiriteList.value = [];
getList();
})
}
})
} else {
uni.showToast({
title: '核销失败',
icon: 'none'
})
}
})
}
})
// uni.navigateTo({
// url: "/multipleShop/verification/detail?id=" + item.id
// })
}
// 输入核销码核销
const onPatchWrite = () => {
uni.navigateTo({
url: "/multipleShop/orderVerification/index"
})
}
// 滚动到底部
const onScrollToLower = (e) => {
getList();
}
// 核销数量统计
const wCount = ref({
no_send: 0,
send: 0
});
const writeCount = () => {
writeCountApi(queryParams.value).then(res => {
let {
no_send,
send
} = res.data;
wCount.value.no_send = no_send;
wCount.value.send = send;
})
}
// 加载状态
const status = ref('');
const wiriteList = ref([]);
// 获取列表
const queryParams = ref({
status: 1,
name: '', //查询字段
page_no: 1,
page_size: 10
})
const getList = () => {
if (status.value == 'loading') return;
if (status.value == 'nomore') return;
status.value = 'loading';
writeListApi(queryParams.value).then(res => {
let len = res.data.list;
status.value = queryParams.value.page_size > len.length ? 'nomore' : 'loadmore';
wiriteList.value = wiriteList.value.concat(len);
if (status.value == 'loadmore') queryParams.value.page_no += 1;
});
// 核销记录统计
writeCount();
}
onShow(() => {
//清空选择 刷新页面
onSearch();
getList();
})
</script>
<style lang="scss"> <style lang="scss">
page { page {
background: #FAFAFA; background: #FAFAFA;
@ -20,6 +225,7 @@
position: absolute; position: absolute;
right: 28rpx; right: 28rpx;
top: 50%; top: 50%;
z-index: 10;
transform: translateY(-50%); transform: translateY(-50%);
width: 110rpx; width: 110rpx;
height: 52rpx; height: 52rpx;
@ -33,6 +239,7 @@
} }
.order-list { .order-list {
position: relative;
padding-top: 24rpx; padding-top: 24rpx;
height: calc(100vh - 90rpx - 24rpx - 30rpx); height: calc(100vh - 90rpx - 24rpx - 30rpx);
@ -90,8 +297,34 @@
} }
} }
} }
.load-wrap {
padding: 20rpx 0 400rpx 0;
}
.batch-write {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
bottom: 100rpx;
left: 50%;
transform: translateX(-50%);
width: 670rpx;
height: 90rpx;
background: #20B128;
border-radius: 20rpx;
&>view {
font-size: 32rpx;
color: #FFFFFF;
margin-left: 8rpx;
}
}
} }
.order-tab { .order-tab {
display: flex; display: flex;
align-items: center; align-items: center;
@ -126,66 +359,4 @@
} }
} }
} }
</style> </style>
<template>
<view class="order">
<view class="order-search">
<u-search :animation="true" :showAction="false" bgColor="#f6f6f6" placeholder="请输入门店"></u-search>
<view class="order-search-txt">搜索</view>
</view>
<view class="order-tab">
<view class="order-tab-item" @click="onTabChange(1)" :class="{'order-tab-active':orderTab==1}">待配送(0)</view>
<view class="order-tab-item" @click="onTabChange(2)" :class="{'order-tab-active':orderTab==2}">已配送(0)</view>
</view>
<view class="order-list">
<scroll-view style="height: 100%;" :scroll-y="true" @scroll="onScroll">
<view class="order-list-wrap">
<view class="order-list-item" v-for="item in 10">
<view class="order-list-item-order_num">订单编号:123123123123</view>
<view class="order-list-item-trans">
<view class="order-list-item-trans-right">
<view class="order-type">配送订单</view>
<view class="order-reciver">收货人：李斯</view>
<view class="order-verification-time">商品信息：黄牛牛腩块2kg*5</view>
</view>
<view class="order-list-item-trans-left">
<u-image width="76rpx" height="76rpx" src="../../multipleShop/images/scan.png" />
</view>
</view>
</view>
</view>
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
</u-empty>
</scroll-view>
</view>
</view>
</template>
<script setup>
import {
onLoad
} from "@dcloudio/uni-app";
import {
ref
} from "vue";
// tab切换
const orderTab = ref(1);
const onTabChange = (e) => {
orderTab.value = e;
}
uni.login({
success(res) {
console.log(res);
}
})
const onScroll = (e) => {
console.log(e);
}
</script>

54
pages.json
View File

@ -9,6 +9,13 @@
} }
}, },
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/member/member",
"style": {
"navigationBarTitleText": "会员充值",
"enablePullDownRefresh": false,
}
},
{ {
"path": "pages/index/index", "path": "pages/index/index",
"style": { "style": {
@ -21,51 +28,34 @@
"bounce": "none" "bounce": "none"
} }
} }
}, }, {
{
"path": "pages/index/test",
"style": {
"navigationBarTitleText": "购物",
"disableScroll": true,
"enablePullDownRefresh": false,
"app-plus": {
// 将回弹属性关掉
"bounce": "none"
}
}
},
{
"path": "pages/login/login", "path": "pages/login/login",
"style": { "style": {
"navigationBarTitleText": "登录", "navigationBarTitleText": "",
"enablePullDownRefresh": false, "enablePullDownRefresh": false
"navigationStyle": "custom" // "navigationStyle": "custom"
} }
}, }, {
{
"path": "pages/cart/cart", "path": "pages/cart/cart",
"style": { "style": {
"navigationBarTitleText": "购物车", "navigationBarTitleText": "购物车",
"enablePullDownRefresh": false, "enablePullDownRefresh": false,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, }, {
{ "path": "pages/code/code",
"style": {
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}, {
"path": "pages/my/my", "path": "pages/my/my",
"style": { "style": {
"navigationBarTitleText": "个人中心", "navigationBarTitleText": "个人中心",
"enablePullDownRefresh": false, "enablePullDownRefresh": false,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
},
{
"path": "pages/code/code",
"style": {
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
} }
], ],
"subPackages": [{ "subPackages": [{
"root": "multipleShop", "root": "multipleShop",
@ -80,7 +70,8 @@
"path": "verificationOrder/index", "path": "verificationOrder/index",
"style": { "style": {
"navigationBarTitleText": "核销订单", "navigationBarTitleText": "核销订单",
"enablePullDownRefresh": false "enablePullDownRefresh": false,
"disableScroll": true
} }
}, { }, {
"path": "verificationOrder/detail", "path": "verificationOrder/detail",
@ -194,10 +185,7 @@
} }
] ]
} }
], ],
"globalStyle": { "globalStyle": {
"navigationBarTextStyle": "black", "navigationBarTextStyle": "black",
"navigationBarTitleText": "", "navigationBarTitleText": "",

817
pages/cart/cart.vue
View File

@ -1,453 +1,462 @@
<template> <template>
<view class="wrap"> <view class="wrap">
<up-navbar placeholder :autoBack="true"> <up-navbar placeholder :autoBack="true">
<template #center> <template #center>
<view style="display: flex;align-items: center;width: 100%;justify-content: flex-start;margin-left: 100rpx;"> <view
<view class="tabs" :class="{'tabs-active': tabsActive==index}" v-for="(item, index) in list" :key="index" style="display: flex;align-items: center;width: 100%;justify-content: flex-start;margin-left: 100rpx;">
@click="changeTab(index)"> <view class="tabs" :class="{'tabs-active': tabsActive==index}" v-for="(item, index) in list"
{{item}} :key="index" @click="changeTab(index)">
</view> {{item}}
</view> </view>
</template> </view>
</up-navbar> </template>
</up-navbar>
<swiper class="swiper-box" :current="swiperCurrent" @animationfinish="animationfinish"> <swiper class="swiper-box" :current="swiperCurrent" @animationfinish="animationfinish">
<swiper-item class="swiper-item"> <swiper-item class="swiper-item">
<scroll-view scroll-y @refresherrefresh="refresherrefresh(1)" :refresher-triggered="triggered" refresher-enabled refresher-background="#F6F6F6" style="height: 100%;width: 100%;"> <scroll-view scroll-y @refresherrefresh="refresherrefresh(1)" :refresher-triggered="triggered"
<view class="page-box1" style="padding-top: 60rpx;"> refresher-enabled refresher-background="#F6F6F6" style="height: 100%;width: 100%;">
<view class="total"> <view class="page-box1" style="padding-top: 60rpx;">
<view>共计<text style="color: #20B128;">{{cartList.length}}</text>件</view> <view class="total">
<view v-if="!isAdmin" @click="isAdmin=true;">管理</view> <view>共计<text style="color: #20B128;">{{cartList.length}}</text>件</view>
<view v-else @click="isAdmin=false;">完成</view> <view v-if="!isAdmin" @click="isAdmin=true;">管理</view>
</view> <view v-else @click="isAdmin=false;">完成</view>
<view v-if="cartList.length>0" class="list"> </view>
<view class="shop-item" v-for="(item, index) in cartList" :key="index" @click="openGoodPopup(item)"> <view v-if="cartList.length>0" class="list">
<view class="shop-check" @click.stop="checkItem(item, !item.check)"> <view class="shop-item" v-for="(item, index) in cartList" :key="index"
<image v-if="!item.check" src="@/static/icon/n-check.png"></image> @click="openGoodPopup(item)">
<image v-else src="@/static/icon/check.png"></image> <view class="shop-check" @click.stop="checkItem(item, !item.check)">
</view> <image v-if="!item.check" src="@/static/icon/n-check.png"></image>
<image class="shop-img" :src="item.imgs"></image> <image v-else src="@/static/icon/check.png"></image>
<view class="shop-content"> </view>
<view class="title"> <image class="shop-img" :src="item.imgs"></image>
<view class="name u-line-2">{{item.goods_name}}</view> <view class="shop-content">
<view class="tip u-line-1">{{item.unit_name}}</view> <view class="title">
</view> <view class="name u-line-2">{{item.goods_name}}</view>
<view class="price-btn"> <view class="tip u-line-1">{{item.unit_name}}</view>
<view class="price">￥{{item.sell}}</view> </view>
<view class="btn"> <view class="price-btn">
<view class="num">{{item.cart_num}}</view> <view class="price">￥{{item.sell}}</view>
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon> <view class="btn">
</view> <view class="num">{{item.cart_num}}</view>
</view> <u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
</view> </view>
</view> </view>
</view> </view>
<view v-else style="margin-top: 100rpx;"> </view>
<up-empty text="购物车空空如也" </view>
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png"> <view v-else style="margin-top: 100rpx;">
</up-empty> <up-empty text="购物车空空如也"
</view> icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
<view style="width: 100%;height: 200rpx;"></view> </up-empty>
</view> </view>
</scroll-view> <view style="width: 100%;height: 200rpx;"></view>
</swiper-item> </view>
<swiper-item class="swiper-item"> </scroll-view>
<scroll-view scroll-y @refresherrefresh="refresherrefresh(2)" :refresher-triggered="triggered" refresher-enabled refresher-background="#F6F6F6" style="height: 100%;width: 100%;"> </swiper-item>
<view class="page-box1"> <swiper-item class="swiper-item">
<view v-if="frequentlyList.length>0" class="list"> <scroll-view scroll-y @refresherrefresh="refresherrefresh(2)" :refresher-triggered="triggered"
<view class="shop-item" v-for="(item, index) in frequentlyList" :key="index" @click="openGoodPopup(item)"> refresher-enabled refresher-background="#F6F6F6" style="height: 100%;width: 100%;">
<image class="shop-img" :src="item.imgs"></image> <view class="page-box1">
<view class="shop-content" style="width: 490rpx;"> <view v-if="frequentlyList.length>0" class="list">
<view class="title"> <view class="shop-item" v-for="(item, index) in frequentlyList" :key="index"
<view class="name u-line-2">{{item.name}}</view> @click="openGoodPopup(item)">
<!-- <view class="tip u-line-1">{{item.spec}}</view> --> <image class="shop-img" :src="item.imgs"></image>
<view class="tip u-line-1">{{item.unit_name}}</view> <view class="shop-content" style="width: 490rpx;">
</view> <view class="title">
<view class="price-btn"> <view class="name u-line-2">{{item.name}}</view>
<view class="price">￥{{item.sell}}</view> <!-- <view class="tip u-line-1">{{item.spec}}</view> -->
<view class="btn"> <view class="tip u-line-1">{{item.unit_name}}</view>
<up-button size="small" plain color="#20b128" shape="circle">加入购物车</up-button> </view>
</view> <view class="price-btn">
</view> <view class="price">￥{{item.sell}}</view>
</view> <view class="btn">
</view> <up-button size="small" plain color="#20b128"
</view> shape="circle">加入购物车</up-button>
<view v-else style="margin-top: 100rpx;"> </view>
<up-empty text="没有常买的商品" </view>
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png"> </view>
</up-empty> </view>
</view> </view>
<view style="width: 100%;height: 200rpx;"></view> <view v-else style="margin-top: 100rpx;">
</view> <up-empty text="没有常买的商品"
</scroll-view> icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
</swiper-item> </up-empty>
</swiper> </view>
<view style="width: 100%;height: 200rpx;"></view>
</view>
</scroll-view>
</swiper-item>
</swiper>
</view> </view>
<up-transition :show="tabsActive==0"> <up-transition :show="tabsActive==0">
<view class="fiexd-btn-box cart-btn"> <view class="fiexd-btn-box cart-btn">
<view class="cart-check" @click="changeAll(checkAll===cartInfo.count)"> <view class="cart-check" @click="changeAll(checkAll===cartInfo.count)">
<image v-if="checkAll!=cartInfo.count" src="@/static/icon/n-check.png"></image> <image v-if="checkAll!=cartInfo.count" src="@/static/icon/n-check.png"></image>
<image v-else src="@/static/icon/check.png"></image> <image v-else src="@/static/icon/check.png"></image>
<text style="font-size: 24rpx;">全选</text> <text style="font-size: 24rpx;">全选</text>
<text style="font-size: 24rpx;" v-if="checkAll">({{checkAll}})</text> <text style="font-size: 24rpx;" v-if="checkAll">({{checkAll}})</text>
</view> </view>
<view v-if="!isAdmin" class="btn-boxs"> <view v-if="!isAdmin" class="btn-boxs">
<view class="all-price"> <view class="all-price">
<view style="width: 80rpx;">合计:</view> <view style="width: 80rpx;">合计:</view>
<view class="price"> <view class="price">
<text style="font-size: 24rpx;">¥</text> <text style="font-size: 24rpx;">¥</text>
<text style="font-size: 34rpx;">{{c_price0}}</text> <text style="font-size: 34rpx;">{{c_price0}}</text>
<text style="font-size: 24rpx;">.{{c_price1}}</text> <text style="font-size: 24rpx;">.{{c_price1}}</text>
</view> </view>
</view> </view>
<view style="width: 200rpx;"> <view style="width: 200rpx;">
<up-button color="#20b128" shape="circle" :disabled="!checkAll" @click="settleAccounts">去结算<text <up-button color="#20b128" shape="circle" :disabled="!checkAll" @click="settleAccounts">去结算<text
v-if="checkAll">({{checkAll}})</text></up-button> v-if="checkAll">({{checkAll}})</text></up-button>
</view> </view>
</view> </view>
<view v-else class="btn-boxs"> <view v-else class="btn-boxs">
<!-- <view style="width: 100px;margin-right: 20rpx;"><up-button size="small" plain color="#989898" shape="circle">移入收藏夹</up-button></view> --> <!-- <view style="width: 100px;margin-right: 20rpx;"><up-button size="small" plain color="#989898" shape="circle">移入收藏夹</up-button></view> -->
<view style="width: 100px;"><up-button @click="deleteCartList()" size="small" plain color="#989898" <view style="width: 100px;"><up-button @click="deleteCartList()" size="small" plain color="#989898"
shape="circle">删除</up-button></view> shape="circle">删除</up-button></view>
</view> </view>
</view> </view>
</up-transition> </up-transition>
<goodPopup ref="goodRef" :show="showGoodPopup" @close="showGoodPopup=false" @change="changeGood" /> <goodPopup ref="goodRef" :show="showGoodPopup" @close="showGoodPopup=false" @change="changeGood" />
</template> </template>
<script setup> <script setup>
import { import {
onShow onShow
} from "@dcloudio/uni-app" } from "@dcloudio/uni-app"
import { import {
computed, computed,
ref, ref,
watch watch
} from 'vue'; } from 'vue';
import { import {
cartListApi, cartListApi,
cartChangeApi, cartChangeApi,
cartCreateApi, cartCreateApi,
cartDeleteApi, cartDeleteApi,
frequentlyPurchaseApi frequentlyPurchaseApi
} from "@/api/cart.js" } from "@/api/cart.js"
import goodPopup from "@/components/goodPopup.vue" import goodPopup from "@/components/goodPopup.vue"
import useCartStore from "@/store/cart.js" import useCartStore from "@/store/cart.js"
const cartStore = useCartStore(); const cartStore = useCartStore();
// 创建响应式数据 // 创建响应式数据
const list = ref(['购物车', '常买']); const list = ref(['购物车', '常买']);
const tabsActive = ref(0) const tabsActive = ref(0)
// 定义方法 // 定义方法
const changeTab = (e) => { const changeTab = (e) => {
tabsActive.value = e; tabsActive.value = e;
swiperCurrent.value = e; swiperCurrent.value = e;
} }
const swiperCurrent = ref(0); const swiperCurrent = ref(0);
const animationfinish = ({ const animationfinish = ({
detail: { detail: {
current current
} }
}) => { }) => {
swiperCurrent.value = current; swiperCurrent.value = current;
tabsActive.value = current; tabsActive.value = current;
if (swiperCurrent.value == 1) getFrequentlyPurchase(); if (swiperCurrent.value == 1) getFrequentlyPurchase();
} }
// 结算 // 结算
const settleAccounts = () => { const settleAccounts = () => {
let list = []; let list = [];
cartList.value.forEach(item => { cartList.value.forEach(item => {
if (item.check) list.push(item.cart_id); if (item.check) list.push(item.id);
}) })
cartStore.setCartList(list); cartStore.setCartList(list);
uni.navigateTo({ uni.navigateTo({
url: '/pagesOrder/settle/settle' url: '/pagesOrder/settle/settle'
}) })
} }
// 删除 // 删除
const deleteCartList = () => { const deleteCartList = () => {
let list = []; let list = [];
if(!cartList.value.length) return uni.showToast({ title: '请选择商品', icon: 'none' }); if (!cartList.value.length) return uni.showToast({
cartList.value.forEach(item => { title: '请选择商品',
if (item.check) list.push(item.cart_id); icon: 'none'
}) });
cartDeleteApi({ cartList.value.forEach(item => {
cart_id: list if (item.check) list.push(item.cart_id);
}).then(() => { })
getcartList(false); cartDeleteApi({
}) cart_id: list
} }).then(() => {
getcartList(false);
})
}
// 购物车相关 // 购物车相关
const addCart = (id, cart_num) => { //加入购物车 const addCart = (id, cart_num) => { //加入购物车
cartCreateApi({ cartCreateApi({
cart_num: +cart_num, cart_num: +cart_num,
goods_id: id goods_id: id
}).then(res => { }).then(res => {
getcartList(); getcartList();
}) })
} }
const isAdmin = ref(false); //是否管理 const isAdmin = ref(false); //是否管理
// 选择商品相关 // 选择商品相关
const showGoodPopup = ref(false); const showGoodPopup = ref(false);
const goodRef = ref(null); const goodRef = ref(null);
const goodData = ref({}); const goodData = ref({});
const openGoodPopup = (item) => { // 打开数量/重量弹窗 const openGoodPopup = (item) => { // 打开数量/重量弹窗
goodData.value = JSON.parse(JSON.stringify(item)); goodData.value = JSON.parse(JSON.stringify(item));
goodRef.value.setData(goodData.value); goodRef.value.setData(goodData.value);
showGoodPopup.value = true; showGoodPopup.value = true;
}; };
const changeGood = (data) => { // 确定选择商品重量 const changeGood = (data) => { // 确定选择商品重量
showGoodPopup.value = false; showGoodPopup.value = false;
addCart(data.goods_id || data.id, data.cart_num); addCart(data.goods_id || data.id, data.cart_num);
} }
const cartList = ref([]); const cartList = ref([]);
const cartInfo = ref({}); const cartInfo = ref({});
const getcartList = (check = true) => { const getcartList = (check = true) => {
cartListApi().then(res => { cartListApi().then(res => {
if (check) { if (check) {
res.data.lists = res.data.lists.map(item => { res.data.lists = res.data.lists.map(item => {
item.check = true; item.check = true;
return item; return item;
}) })
checkAll.value = res.data?.count || 0 checkAll.value = res.data?.count || 0
} else { } else {
checkAll.value = 0 checkAll.value = 0
} }
cartList.value = res.data.lists; cartList.value = res.data.lists;
cartInfo.value = { cartInfo.value = {
total_price: res.data?.extend.total_price || '0.00', total_price: res.data?.extend.total_price || '0.00',
count: res.data?.count || 0 count: res.data?.count || 0
} }
setTimeout(()=>{ setTimeout(() => {
triggered.value = false; triggered.value = false;
}, 300) }, 300)
}) })
} }
const c_price0 = computed(() => { const c_price0 = computed(() => {
let price = cartInfo.value.total_price + ''; let price = cartInfo.value.total_price + '';
return price.split('.')[0] || '0'; return price.split('.')[0] || '0';
}) })
const c_price1 = computed(() => { const c_price1 = computed(() => {
let price = cartInfo.value.total_price + ''; let price = cartInfo.value.total_price + '';
return price.split('.')[1] || '00'; return price.split('.')[1] || '00';
}) })
// 选中 // 选中
let checkAll = ref(0) let checkAll = ref(0)
const checkItem = (item, type) => { const checkItem = (item, type) => {
item.check = type; item.check = type;
let price = Number(cartInfo.value.total_price); let price = Number(cartInfo.value.total_price);
if (type) { if (type) {
price += item.sell * item.cart_num; price += item.sell * item.cart_num;
checkAll.value++; checkAll.value++;
} else { } else {
price -= item.sell * item.cart_num; price -= item.sell * item.cart_num;
checkAll.value--; checkAll.value--;
} }
cartInfo.value.total_price = price.toFixed(2); cartInfo.value.total_price = price.toFixed(2);
} }
const changeAll = (flag = false) => { const changeAll = (flag = false) => {
let count = 0; let count = 0;
cartList.value.forEach(item => { cartList.value.forEach(item => {
item.check = !flag; item.check = !flag;
if (!flag) count += item.sell * item.cart_num; if (!flag) count += item.sell * item.cart_num;
}) })
if (!flag) { if (!flag) {
checkAll.value = cartInfo.value.count; checkAll.value = cartInfo.value.count;
} else { } else {
checkAll.value = 0; checkAll.value = 0;
} }
cartInfo.value.total_price = count.toFixed(2); cartInfo.value.total_price = count.toFixed(2);
} }
// 常买记录 // 常买记录
const frequentlyList = ref([]); const frequentlyList = ref([]);
const where = ref({ const where = ref({
page_no: 1, page_no: 1,
page_size: 25 page_size: 25
}) })
const getFrequentlyPurchase = () => { const getFrequentlyPurchase = () => {
frequentlyPurchaseApi({ frequentlyPurchaseApi({
...where.value ...where.value
}).then(res => { }).then(res => {
frequentlyList.value = res.data; frequentlyList.value = res.data;
setTimeout(()=>{ setTimeout(() => {
triggered.value = false; triggered.value = false;
}, 300) }, 300)
}) })
} }
const triggered = ref(false); const triggered = ref(false);
const refresherrefresh = (type=1)=>{ const refresherrefresh = (type = 1) => {
triggered.value = true; triggered.value = true;
if(type==1) getcartList(); if (type == 1) getcartList();
if(type==2) getFrequentlyPurchase(); if (type == 2) getFrequentlyPurchase();
} }
onShow(() => { onShow(() => {
getcartList(); getcartList();
}) })
</script> </script>
<style lang="scss"> <style lang="scss">
.tabs { .tabs {
color: #444444; color: #444444;
font-size: 32rpx; font-size: 32rpx;
margin-right: 30rpx; margin-right: 30rpx;
} }
.tabs-active { .tabs-active {
color: #20B128; color: #20B128;
// font-size: 34rpx; // font-size: 34rpx;
transition: 300ms; transition: 300ms;
} }
.wrap { .wrap {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: calc(100vh - var(--window-top)); height: calc(100vh - var(--window-top));
width: 100%; width: 100%;
background-color: #f6f6f6; background-color: #f6f6f6;
} }
.swiper-box { .swiper-box {
flex: 1; flex: 1;
} }
.swiper-item { .swiper-item {
height: 100%; height: 100%;
} }
.page-box1 { .page-box1 {
position: relative; position: relative;
.total { .total {
padding: 0 20rpx; padding: 0 20rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
position: fixed; position: fixed;
top: var(--window-top); top: var(--window-top);
left: 0; left: 0;
right: 0; right: 0;
z-index: 100; z-index: 100;
height: 60rpx; height: 60rpx;
line-height: 60rpx; line-height: 60rpx;
font-size: 26rpx; font-size: 26rpx;
color: #444; color: #444;
} }
.list { .list {
margin: 20rpx; margin: 20rpx;
border-radius: 20rpx; border-radius: 20rpx;
overflow: hidden; overflow: hidden;
.shop-item { .shop-item {
padding: 20rpx; padding: 20rpx;
border-bottom: 1rpx solid #f6f6f6; border-bottom: 1rpx solid #f6f6f6;
background-color: #fff; background-color: #fff;
display: flex; display: flex;
.shop-check { .shop-check {
width: 60rpx; width: 60rpx;
height: 120rpx; height: 120rpx;
display: flex; display: flex;
align-items: center; align-items: center;
image { image {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
} }
} }
.shop-img { .shop-img {
height: 120rpx; height: 120rpx;
width: 120rpx; width: 120rpx;
margin-right: 20rpx; margin-right: 20rpx;
border-radius: 14rpx; border-radius: 14rpx;
} }
.shop-content { .shop-content {
width: 430rpx; width: 430rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
.title { .title {
.name { .name {
font-size: 28rpx; font-size: 28rpx;
} }
.tip { .tip {
color: #999; color: #999;
font-size: 24rpx; font-size: 24rpx;
margin: 12rpx 0; margin: 12rpx 0;
} }
} }
.price { .price {
font-size: 30rpx; font-size: 30rpx;
font-weight: bold; font-weight: bold;
color: #F55726; color: #F55726;
} }
.price-btn { .price-btn {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.btn { .btn {
display: flex; display: flex;
align-items: center; align-items: center;
.num { .num {
margin: 0 20rpx; margin: 0 20rpx;
text-align: center; text-align: center;
} }
} }
} }
} }
} }
} }
} }
.cart-btn { .cart-btn {
.cart-check { .cart-check {
display: flex; display: flex;
align-items: center; align-items: center;
image { image {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
margin: 0 10rpx; margin: 0 10rpx;
} }
} }
.btn-boxs { .btn-boxs {
display: flex; display: flex;
.all-price { .all-price {
display: flex; display: flex;
align-items: center; align-items: center;
margin-right: 20rpx; margin-right: 20rpx;
.price { .price {
color: #20B128; color: #20B128;
display: table-cell; display: table-cell;
vertical-align: bottom; vertical-align: bottom;
font-weight: bold; font-weight: bold;
} }
} }
} }
} }
</style> </style>

276
pages/charge/charge.vue Normal file
View File

@ -0,0 +1,276 @@
<!-- 会员充值 -->
<style lang="scss">
.member {
// padding-top: 40rpx;
padding: 40rpx 0 300rpx 0;
.card {
background: linear-gradient(to right, #F7EED7, #E7DAAF);
height: 302rpx;
margin: 0 30rpx 30rpx;
border-radius: 10rpx;
padding: 20rpx 0 0 20rpx;
box-sizing: border-box;
.card-info {
display: flex;
align-items: center;
margin-bottom: 30rpx;
.card-info-right {
margin-left: 40rpx;
.phone {
margin-bottom: 12rpx;
font-weight: 600;
font-size: 32rpx;
color: #444444;
}
.level {
font-size: 28rpx;
color: #7B5232;
}
}
}
.money {
display: flex;
font-size: 28rpx;
color: #FFFFFF;
margin-bottom: 34rpx;
text {
margin-right: 116rpx;
}
}
.charge {
display: flex;
align-items: center;
padding-right: 38rpx;
.charge-left {
flex: 1;
margin-right: 30rpx;
&>view {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10rpx;
text {
font-size: 22rpx;
color: #A26341;
}
}
}
.charge-right {
width: 148rpx;
height: 52rpx;
line-height: 52rpx;
background: #7B5232;
border-radius: 30rpx;
font-size: 22rpx;
color: #FFFFFF;
text-align: center;
}
}
}
.rules {
background: #FFFFFF;
border-radius: 16rpx;
margin: 0 30rpx 30rpx;
padding: 30rpx;
.rules-title {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 34rpx;
.rules-title-main {
font-weight: 600;
font-size: 32rpx;
color: #444444;
}
.rules-title-record {
display: flex;
align-items: center;
font-size: 28rpx;
color: #444444;
}
}
.rules-con {
display: flex;
flex-wrap: wrap;
.rules-con-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 188rpx;
height: 220rpx;
border: 2rpx solid #F1F1F1;
border-radius: 16rpx;
margin-bottom: 28rpx;
&:not(:nth-child(3n)) {
margin-right: 26rpx;
}
.rules-con-item-main {
margin-bottom: 10rpx;
font-size: 30rpx;
color: #333333;
}
.rules-con-item-sub {
margin-bottom: 30rpx;
font-size: 24rpx;
color: #777777;
}
.rules-con-item-amount {
text {
font-weight: 600;
font-size: 32rpx;
color: #333333;
}
.symbol {
font-size: 20rpx;
}
}
}
}
}
.attention {
margin: 0 30rpx;
.attention-title {
position: relative;
font-weight: 600;
font-size: 32rpx;
color: #262626;
margin-bottom: 20rpx;
margin-left: 10rpx;
text {
margin-left: 14rpx;
}
&::before {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 0;
width: 6rpx;
height: 100%;
border-radius: 4rpx;
background: #FF8056;
}
}
.attention-tips {
font-size: 24rpx;
color: #7A7A7A;
margin-bottom: 30rpx;
}
}
.member-btn {
position: fixed;
bottom: 80rpx;
left: 50%;
transform: translateX(-50%);
width: 670rpx;
height: 80rpx;
line-height: 80rpx;
background: #EFCC6E;
border-radius: 40rpx;
font-size: 32rpx;
color: #FFFFFF;
text-align: center;
}
}
</style>
<template>
<view class="member">
<view class="card">
<view class="card-info">
<up-image width="100rpx" height="100rpx" />
<view class="card-info-right">
<view class="phone">155****4444</view>
<view class="level">初级会员 享受9折优惠</view>
</view>
</view>
<view class="money">
<text>余额：10000</text>
<view>充值</view>
</view>
<view class="charge">
<view class="charge-left">
<view>
<text>当前已充值1000，升级还需2000</text>
<text>Lv.2</text>
</view>
<up-line-progress :percentage="30" activeColor="#A26341" inactiveColor="#fff"
height="8rpx"></up-line-progress>
</view>
<view class="charge-right">升级会员</view>
</view>
</view>
<!-- 充值规格 -->
<view class="rules">
<view class="rules-title">
<view class="rules-title-main">充值规格</view>
<view class="rules-title-record">
充值记录
<up-icon name="arrow-right"></up-icon>
</view>
</view>
<view class="rules-con">
<view class="rules-con-item" v-for="item in 4">
<view class="rules-con-item-main">基础会员</view>
<view class="rules-con-item-sub">永久</view>
<view class="rules-con-item-amount">
<text class="symbol">￥</text>
<text>1000</text>
</view>
</view>
<view class="rules-con-define">
<up-input placeholder="点击输入金额" type="number" color="#333" fontSize="28rpx"
:placeholderStyle="{color:'#989898'}">
<template #prefix>
<up-text text="自定义金额" color="#111" size="30rpx" margin="0 3px 0 0" type="tips"></up-text>
</template>
</up-input>
</view>
</view>
</view>
<!-- 注意事项 -->
<view class="attention">
<view class="attention-title"><text>注意事项：</text></view>
<view class="attention-tips">1、充值后帐户的金额不能提现，可用于消费使用</view>
<view class="attention-tips">2、账户充值出现问题可联系平台客服，也可拨打平台客服咨询热线4008888888</view>
</view>
<view class="member-btn">
确认充值
</view>
</view>
</template>

898
pages/index/index - 副本.vue Normal file
View File

@ -0,0 +1,898 @@
<template>
<view class="content">
<up-navbar placeholder style="z-index: 10080;">
<template #left>
<view style="font-size: 30rpx;font-weight: bold;" @click="test">惠农批发 </view>
</template>
</up-navbar>
<view class="navbar">
<view style="width: 400rpx;">
<up-search placeholder="请输入商品" @search="searchKeyword" @clear="searchKeyword" v-model="keyword"
:showAction="false"></up-search>
</view>
<view class="nav-item" @click="navTo('/pages/cart/cart')">
<image src="@/static/tab/ba.png"></image>
<text>购物车</text>
</view>
<view class="nav-item" @click="navTo('/pagesOrder/order/order?type=0')">
<image src="@/static/tab/da.png"></image>
<text>我的订单</text>
</view>
<view class="nav-item" @click="navTo('/pages/my/my')">
<image src="@/static/tab/ca.png"></image>
<text>个人中心</text>
</view>
</view>
<view class='headScoll' ref='headscroll' :style="{height:isScroll?'0':'200rpx'}">
<scroll-view class="head-view" scroll-x @scrolltolower="getgoodClassList(0)">
<view class="list">
<view class="item" :class="{'item-active': topActive===item.id}"
v-for="(item, index) in goodClassList" :key="index" @click="changeOne(item, index)">
<view class="c-img"><up-image height="100rpx" width="100rpx" :src="item.pic"></up-image></view>
<view class="c-text u-line-1">{{item.name}}</view>
</view>
<view class="item" style="width: 80rpx;height: 20rpx;">
</view>
</view>
</scroll-view>
<view class="r-btn" @click="show=1">
<view>全</view>
<view>部</view>
<up-icon name="list"></up-icon>
</view>
</view>
<viewPopup nav v-if="show===1" @close="show=0">
<view class="cateOne">
<view class="head-title">全部分类</view>
<scroll-view scroll-y style="height: 600rpx;">
<view class="list">
<view class="item" :class="{'item-active': topActive===item.id}"
v-for="(item, index) in goodClassList" :key="index" @click="changeOne(item, index)">
<view class="c-img"><up-image height="100rpx" width="100rpx" :src="item.pic"></up-image>
</view>
<view class="c-text u-line-1">{{item.name}}</view>
</view>
</view>
</scroll-view>
</view>
</viewPopup>
<view class="scroll-box">
<scroll-view class="left" scroll-y @scrolltolower="getgoodClassList(topActive)">
<view class="item u-line-1" :class="{'item-active': leftActive===item.id}"
v-for="(item, index) in goodClassTow" :key="index" @click="changeTwo(item, index)">{{item.name}}
</view>
<view style="width: 100%;height: 450rpx;"></view>
</scroll-view>
<view class="right">
<view class="classify">
<scroll-view style="height: 90rpx;" scroll-x @scrolltolower="getgoodClassList(leftActive)">
<view class="classify-list">
<view class="classify-list-item u-line-1" :class="{'item-active': rightActive===item.id}"
v-for="(item, index) in goodClassThree" :key="index" @click="changeThree(item, index)">
{{item.name}}
</view>
<view style="width: 70rpx;flex-shrink: 0;"></view>
</view>
</scroll-view>
<view class="done" @click="show=2">
<up-icon name="arrow-down"></up-icon>
</view>
<view class="order-by">
<view class="item" :class="{'order-active': where.order==''}" @click="changeOrder('')">综合</view>
<view class="item" :class="{'order-active': where.order=='desc'||where.order=='asc'}"
@click="changeOrder(where.order=='asc'?'desc':'asc')">价格</view>
<view class="item" :class="{'order-active': where.order=='sales'}"
@click="changeOrder('sales')">销量</view>
</view>
</view>
<viewPopup v-if="show===2" @close="show=0">
<view class="cateOne">
<scroll-view scroll-y style="height: 230rpx;" @scrolltolower="getgoodClassList(leftActive)">
<view class="classify-list">
<view class="classify-list-item u-line-1"
:class="{'item-active': rightActive===item.id}"
v-for="(item, index) in goodClassThree" :key="index"
@click="changeThree(item, index)">
{{item.name}}
</view>
</view>
</scroll-view>
</view>
</viewPopup>
<scroll-view class="list" id='drag_area' style="overscroll-behavior: none;" @scroll="hideHeadView"
scroll-y @scrolltolower="loadMoreGood">
<view class="shop-item" v-for="(item, index) in goodList" :key="item.id"
@click="openGoodPopup(item)">
<view class="shop-img">
<up-image width="120rpx" height="120rpx" :src="item.image"></up-image>
</view>
<view class="shop-content">
<view class="title">
<view class="name u-line-2">{{item.store_name}}</view>
<view class="tip u-line-1">
<text>{{item.spec}}</text>
<!-- <text>{{item.brand_name}}|</text> -->
<!-- <text>{{item.class_name}}|</text> -->
<!-- <text>{{item.unit_name}}</text> -->
</view>
</view>
<view class="price-btn">
<view class="price">￥{{item.price}}</view>
<view class="btn">
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
</view>
</view>
</view>
</view>
<view style="width: 100%;height: 350rpx;"></view>
</scroll-view>
</view>
</view>
<view class="fiexd-btn-box">
<view class="price-info">
<view class="row">
<view>合计</view>
<view class="price">¥<text style="font-size: 36rpx;">{{cartInfo.total_price}}</text></view>
</view>
<!-- <view class="row">
<view style="color: #777;">原价 ¥50.00</view>
<view class="price">优惠 ¥0.00</view>
</view> -->
</view>
<view class="btn">
<up-button color="#20b128" :disabled="cartInfo.count==0" @click="settleAccounts">结算</up-button>
</view>
<view class="cart" @click="navTo('/pages/cart/cart')">
<image src="@/static/icon/cart.png"></image>
<view class="badge">{{cartInfo.count}}</view>
</view>
</view>
<goodPopup ref="goodRef" :show="showGoodPopup" @close="showGoodPopup=false" @change="changeGood" />
</view>
</template>
<script setup>
import {
onLoad,
onShow
} from "@dcloudio/uni-app"
import {
reactive,
ref,
onMounted
} from "vue"
import {
goodListApi,
goodClassListApi
} from "@/api/good.js"
import {
cartCreateApi,
cartChangeApi,
cartListApi
} from "@/api/cart.js"
import viewPopup from "@/components/viewPopup.vue"
import goodPopup from "@/components/goodPopup.vue"
import useCartStore from "@/store/cart.js"
import {
getCurrentInstance
} from 'vue';
import useUserStore from "@/store/user";
const userStore = useUserStore();
const test = () => {
uni.navigateTo({
url: '/pageQuota/quotation/index'
})
}
/*商品列表滚动隐藏头部导航 */
const instance = getCurrentInstance(); // 获取组件实例
const targetHeight = ref(0)
const isScroll = ref(false)
let lastScollTop = 0
const hideHeadView = (e) => {
if (e.detail.scrollTop <= 0 || e.detail.scrollTop >= targetHeight.value) return
isScroll.value = e.detail.scrollTop > lastScollTop
lastScollTop = e.detail.scrollTop
}
/*商品列表滚动隐藏头部导航结束 */
const cartStore = useCartStore();
const show = ref(0);
const topActive = ref(0);
const changeOne = async (item, index) => {
topActive.value = item.id;
show.value = 0;
goodClassTow.value = item?.children || [];
goodClassThree.value = goodClassTow.value[0]?.children || [];
leftActive.value = goodClassTow.value[0]?.id || '';
rightActive.value = goodClassThree.value[0]?.id || '';
getGoodList();
if (!item.isLoading && item.id) getgoodClassList(topActive.value); // 判断是否加载过数据, 加载过则不进行加载,节约资源
}
const leftActive = ref(0);
const changeTwo = (item, index) => {
leftActive.value = item.id;
show.value = 0;
goodClassThree.value = item?.children || [];
rightActive.value = goodClassThree.value[0]?.id || '';
getGoodList();
if (!item.isLoading && item.id) getgoodClassList(leftActive.value, 1); // 判断是否加载过数据, 加载过则不进行加载,节约资源
}
const rightActive = ref(0);
const changeThree = (item, index) => {
rightActive.value = item.id;
show.value = 0;
getGoodList();
}
const addCart = (id, cart_num) => { //加入购物车
cartCreateApi({
cart_num: cart_num,
is_new: 0, // 是否直接购买0否1是
goods_id: id
}).then(res => {
getCartList();
}).catch(err => {
console.log(err);
uni.$u.toast('添加失败')
})
}
const keyword = ref('');
const searchKeyword = () => {
where.value.name = keyword.value;
getGoodList();
}
const changeOrder = (order) => {
console.log('排序', order);
where.value.order = order;
getGoodList();
}
const where = ref({
page_no: 1,
page_size: 25,
name: '',
order: ''
})
const loading = ref(true);
const goodList = ref([]);
const getGoodList = (loadmore = false) => {
loading.value = true;
let class_id = rightActive.value || leftActive.value || topActive.value || '';
let class_all = '';
// 若分类没有选中时,则直接查询上一级分类
if (rightActive.value == '') class_all = leftActive.value;
if (leftActive.value == '') class_all = topActive.value;
if (topActive.value == '') class_all = '';
if (class_all) class_id = ""; //只能带其中一个
if (loadmore) where.value.page_no++;
else where.value.page_no = 1;
goodListApi({
...where.value,
class_all: class_all,
class: class_id
}).then(res => {
if (loadmore) goodList.value.push(...res.data.lists);
else goodList.value = res.data.lists;
})
}
// 商品列表触底
const loadMoreGood = () => {
console.log('触底了');
getGoodList(true);
}
const goodClassList = ref([]); // 一级分类
const goodClassTow = ref([]); // 二级分类
const goodClassThree = ref([]); // 三级分类
const classMap = new Map();
const getgoodClassList = (pid = 0, three = 0) => {
let page_no = classMap.get(pid) || 1;
console.log(classMap.get(pid));
goodClassListApi({
pid: pid,
page_no: page_no,
page_size: 30,
three: three
}).then(res => {
if (pid == 0) { // 加载一级分类时设置全部分类
if (!res.data?.lists?.length) return;
res.data?.lists?.unshift({
id: "",
name: "全部",
pic: "https://lihai001.oss-cn-chengdu.aliyuncs.com/def/35adb202404271727457954.png",
children: []
})
res.data.lists = res.data.lists.map(item => {
if (!item.children) item.children = [];
item.children?.unshift({
id: "",
pid: item.id, //子分类的全部选项其实就是它本身
name: "全部",
})
item.children = item.children.map(t => {
if (!t.children) t.children = [];
t.children?.unshift({
id: "",
pid: t.id,
name: "全部",
})
return t;
})
return item;
})
// 给所有子级分配
goodClassList.value = [...goodClassList.value, ...res.data?.lists];
goodClassTow.value = goodClassList.value[0]?.children || [];
goodClassThree.value = goodClassTow.value[0]?.children || [];
topActive.value = goodClassList.value[0]?.id;
leftActive.value = goodClassTow.value[0]?.id;
rightActive.value = goodClassThree.value[0]?.id;
} else {
let flag = 1;
goodClassList.value.forEach(item => { // 给相应的一级分类添加子菜单
if (item.id == pid) {
if (!item.children) {
item.children = [];
item.children.unshift({
id: "",
pid: item.id,
name: "全部",
})
}
item.children = [...item.children, ...res.data.lists];
item.isLoading = true;
goodClassTow.value = item.children;
flag = 0;
}
})
if (flag) goodClassTow.value.forEach(item => { //给响应的二级子分类添加菜单
if (item.id == pid) {
if (!item.children) {
item.children = [];
item.children.unshift({
id: "",
pid: item.id,
name: "全部",
})
}
item.children = [...item.children, ...res.data.lists];
item.isLoading = true;
goodClassThree.value = item.children;
}
})
}
page_no++;
classMap.set(pid, page_no);
})
}
const navTo = (url) => {
if (!userStore.token) return uni.showModal({
content: '您需要先登录才可使用该功能, 是否前去登录',
success: (e) => {
if (e.confirm) {
userStore.setToken('');
userStore.setUserInfo({});
uni.navigateTo({
url: '/pages/login/login'
})
} else {
userStore.setToken('');
userStore.setUserInfo({});
}
}
})
uni.navigateTo({
url: url
})
}
// 选择商品相关
const showGoodPopup = ref(false);
const goodRef = ref(null);
const goodData = ref({});
const openGoodPopup = (item) => { // 打开数量/重量弹窗
goodData.value = item;
goodRef.value.setData(item);
showGoodPopup.value = true;
};
const changeGood = (data) => { // 确定选择商品重量
showGoodPopup.value = false;
if (!userStore.token) return uni.showModal({
content: '您需要先登录才可使用该功能, 是否前去登录',
success: (e) => {
if (e.confirm) {
userStore.setToken('');
userStore.setUserInfo({});
uni.navigateTo({
url: '/pages/login/login'
})
} else {
userStore.setToken('');
userStore.setUserInfo({});
}
}
})
addCart(data.id, data.cart_num);
}
// 结算
const settleAccounts = () => {
uni.navigateTo({
url: '/pagesOrder/settle/settle'
})
}
// 购物车相关
const cartInfo = ref({
total_price: '0.00',
count: 0
})
const getCartList = (res) => {
cartListApi({
page_no: 1,
page_size: 100,
}).then(res => {
cartInfo.value = {
total_price: res.data?.extend?.total_price || '0.00',
count: res.data?.count || 0
}
cartStore.setCartList(res.data?.lists.map(item => item.cart_id))
})
}
onLoad(() => {
getgoodClassList(0);
getGoodList();
})
onShow(() => {
getCartList();
})
onMounted(() => {
const instance = getCurrentInstance(); // 获取组件实例
const getWXDom = () => {
let query = uni.createSelectorQuery().in(instance).select("#drag_area");
query
.fields({
size: true,
scrollOffset: true,
},
(data) => {
targetHeight.value = data.scrollHeight - data.height
}
)
.exec();
}
setTimeout(() => {
getWXDom()
}, 500)
})
</script>
<style lang="scss">
.content {
background-color: #fff;
}
.navbar {
padding: 0 20rpx;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 22rpx;
color: #777;
.nav-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
image {
height: 40rpx;
width: 40rpx;
}
}
}
.head-view {
background-color: #fff;
height: 180rpx;
width: 750rpx;
.list {
height: 100%;
display: flex;
align-items: center;
padding: 0 20rpx;
font-size: 22rpx;
.item {
width: 120rpx;
flex-shrink: 0;
margin-right: 20rpx;
display: flex;
flex-direction: column;
align-items: center;
.c-img {
height: 100rpx;
width: 100rpx;
flex-shrink: 0;
border-radius: 50%;
border: 2px solid transparent;
overflow: hidden;
}
.c-text {
width: 100%;
text-align: center;
box-sizing: border-box;
padding: 2rpx 4rpx 3rpx 4rpx;
border-radius: 50rpx;
margin-top: 5rpx;
}
}
.item-active {
.c-img {
border: 2px solid #20b128;
}
.c-text {
background-color: #20b128;
color: #fff;
}
}
}
}
.r-btn {
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 60rpx;
font-size: 24rpx;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-shadow: -10rpx 0 60rpx 1rpx rgba(0, 0, 0, 0.3);
}
.cateOne {
background-color: #fff;
.head-title {
color: #666666;
font-size: 30rpx;
height: 80rpx;
line-height: 80rpx;
padding-left: 30rpx;
}
.list {
padding: 20rpx 20rpx;
font-size: 22rpx;
display: grid;
grid-template-columns: repeat(5, 1fr);
justify-content: center;
grid-gap: 20rpx;
.item {
width: 120rpx;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
.c-img {
height: 100rpx;
width: 100rpx;
flex-shrink: 0;
border-radius: 50%;
border: 2px solid transparent;
overflow: hidden;
}
.c-text {
width: 100%;
text-align: center;
box-sizing: border-box;
padding: 2rpx 4rpx 3rpx 4rpx;
border-radius: 50rpx;
margin-top: 5rpx;
}
}
.item-active {
.c-img {
border: 2px solid #20b128;
}
.c-text {
background-color: #20b128;
color: #fff;
}
}
}
.classify-list {
padding: 20rpx 30rpx;
font-size: 22rpx;
display: grid;
grid-template-columns: repeat(3, 1fr);
justify-content: center;
grid-gap: 20rpx;
.classify-list-item {
flex-shrink: 0;
text-align: center;
width: 150rpx;
height: 42rpx;
line-height: 42rpx;
background: #F6F6F6;
border-radius: 22rpx 22rpx 22rpx 22rpx;
border: 1rpx solid transparent;
}
.item-active {
border: 1rpx solid #20b128;
color: #20b128;
background-color: rgba(#20b128, 0.1);
}
}
}
.scroll-box {
// background-color: red;
display: flex;
.left {
height: calc(100vh - var(--window-top) - var(--window-bottom) - 300rpx);
/* #ifdef H5 */
height: calc(100vh - 44px - 100rpx);
/* #endif */
width: 170rpx;
box-sizing: border-box;
background-color: #f6f6f6;
font-size: 24rpx;
.item {
height: 96rpx;
line-height: 96rpx;
text-align: center;
}
.item-active {
background-color: #fff;
position: relative;
color: #20b128;
&::before {
content: '';
background-color: #20b128;
width: 6rpx;
height: 48rpx;
border-radius: 10rpx;
position: absolute;
left: 0;
top: 50%;
transform: translate(0, -50%);
}
}
}
.right {
height: calc(100vh - var(--window-top) - 300rpx);
/* #ifdef H5 */
height: calc(100vh - 96px + 20rpx);
/* #endif */
width: 580rpx;
box-sizing: border-box;
position: relative;
overflow: hidden;
.classify {
height: 150rpx;
background-color: #fff;
border-bottom: 1rpx solid #f6f6f6;
position: relative;
font-size: 24rpx;
.classify-list {
display: flex;
padding: 20rpx;
.classify-list-item {
flex-shrink: 0;
text-align: center;
width: 108rpx;
height: 42rpx;
line-height: 42rpx;
background: #F6F6F6;
border-radius: 22rpx 22rpx 22rpx 22rpx;
margin-right: 20rpx;
border: 1rpx solid transparent;
}
.item-active {
border: 1rpx solid #20b128;
color: #20b128;
background-color: rgba(#20b128, 0.1);
}
}
.done {
height: 90rpx;
width: 60rpx;
position: absolute;
top: 0;
right: 0;
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
}
.order-by {
display: flex;
justify-content: flex-end;
align-items: center;
.item {
padding-right: 20rpx;
}
.order-active {
color: #20b128;
}
}
}
.list {
height: calc(100vh - var(--window-top) - 400rpx);
/* #ifdef H5 */
height: calc(100vh - 44px - 200rpx);
/* #endif */
.shop-item {
padding: 20rpx;
border-bottom: 1rpx solid #f6f6f6;
background-color: #fff;
display: flex;
.shop-img {
height: 120rpx;
width: 120rpx;
margin-right: 20rpx;
border-radius: 14rpx;
overflow: hidden;
}
.shop-content {
width: 380rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
.title {
.name {
font-size: 28rpx;
}
.tip {
color: #999;
font-size: 24rpx;
margin: 2rpx 0;
}
}
.price {
font-size: 30rpx;
font-weight: bold;
color: #F55726;
}
.price-btn {
display: flex;
justify-content: space-between;
.btn {
display: flex;
align-items: center;
.num {
width: 60rpx;
text-align: center;
}
}
}
}
}
}
}
}
.fiexd-btn-box {
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
height: 140rpx;
height: calc(constant(safe-area-inset-bottom) + 140rpx);
/* 适用于iOS设备 */
height: calc(env(safe-area-inset-bottom) + 140rpx);
/* 适用于Android设备 */
padding-top: 40rpx;
.price-info {
.row {
display: flex;
font-size: 26rpx;
align-items: center;
&>view {
margin-right: 15rpx;
}
.price {
color: #F55726;
}
}
}
.btn {
width: 200rpx;
}
.cart {
position: absolute;
top: -40rpx;
left: 40rpx;
image {
width: 80rpx;
height: 80rpx;
}
.badge {
position: absolute;
top: 0;
right: 0;
background-color: #F55726;
color: #fff;
border-radius: 50%;
width: 26rpx;
height: 26rpx;
text-align: center;
line-height: 26rpx;
font-size: 18rpx;
}
}
}
.headScoll {
position: relative;
overflow: hidden;
transition: 400ms;
}
</style>

29
pages/index/index.vue
View File

@ -181,8 +181,6 @@
import useUserStore from "@/store/user"; import useUserStore from "@/store/user";
const userStore = useUserStore(); const userStore = useUserStore();
const test = () => { const test = () => {
uni.navigateTo({ uni.navigateTo({
url: '/pageQuota/quotation/index' url: '/pageQuota/quotation/index'
@ -190,9 +188,6 @@
} }
/*商品列表滚动隐藏头部导航 */ /*商品列表滚动隐藏头部导航 */
const instance = getCurrentInstance(); // 获取组件实例 const instance = getCurrentInstance(); // 获取组件实例
const targetHeight = ref(0) const targetHeight = ref(0)
@ -202,10 +197,9 @@
if (e.detail.scrollTop <= 0 || e.detail.scrollTop >= targetHeight.value) return if (e.detail.scrollTop <= 0 || e.detail.scrollTop >= targetHeight.value) return
isScroll.value = e.detail.scrollTop > lastScollTop isScroll.value = e.detail.scrollTop > lastScollTop
lastScollTop = e.detail.scrollTop lastScollTop = e.detail.scrollTop
} }
/*商品列表滚动隐藏头部导航结束 */
/*商品列表滚动隐藏头部导航结束 */
const cartStore = useCartStore(); const cartStore = useCartStore();
const show = ref(0); const show = ref(0);
const topActive = ref(0); const topActive = ref(0);
@ -241,7 +235,9 @@
cartCreateApi({ cartCreateApi({
cart_num: cart_num, cart_num: cart_num,
is_new: 0, // 是否直接购买0否1是 is_new: 0, // 是否直接购买0否1是
goods_id: id // goods_id: id,
store_id: where.value.store_id,
product_id: id
}).then(res => { }).then(res => {
getCartList(); getCartList();
}).catch(err => { }).catch(err => {
@ -267,7 +263,8 @@
page_no: 1, page_no: 1,
page_size: 25, page_size: 25,
name: '', name: '',
order: '' order: '',
store_id: '2'
}) })
const loading = ref(true); const loading = ref(true);
const goodList = ref([]); const goodList = ref([]);
@ -384,6 +381,7 @@
} }
const navTo = (url) => { const navTo = (url) => {
// if (!userStore.token || !userStore.userInfo.mobile) return uni.showModal({
if (!userStore.token) return uni.showModal({ if (!userStore.token) return uni.showModal({
content: '您需要先登录才可使用该功能, 是否前去登录', content: '您需要先登录才可使用该功能, 是否前去登录',
success: (e) => { success: (e) => {
@ -429,7 +427,10 @@
userStore.setUserInfo({}); userStore.setUserInfo({});
} }
} }
}) });
console.log(data);
addCart(data.id, data.cart_num); addCart(data.id, data.cart_num);
} }
// 结算 // 结算
@ -453,18 +454,20 @@
total_price: res.data?.extend?.total_price || '0.00', total_price: res.data?.extend?.total_price || '0.00',
count: res.data?.count || 0 count: res.data?.count || 0
} }
cartStore.setCartList(res.data?.lists.map(item => item.cart_id)) cartStore.setCartList(res.data?.lists.map(item => item.id))
}) })
} }
onLoad(() => { onLoad((opt) => {
if (opt.id) where.value.store_id = opt.id;
getgoodClassList(0); getgoodClassList(0);
getGoodList(); getGoodList();
}) })
onShow(() => { onShow(() => {
getCartList(); getCartList();
}) })
onMounted(() => { onMounted(() => {
const instance = getCurrentInstance(); // 获取组件实例 const instance = getCurrentInstance(); // 获取组件实例
const getWXDom = () => { const getWXDom = () => {

456
pages/index/test.vue
View File

@ -1,127 +1,349 @@
<style lang="scss">
.detail {
width: 710rpx;
background: #FFFFFF;
border-radius: 12rpx;
margin: 24rpx auto 0;
padding: 0 30rpx 24rpx;
box-sizing: border-box;
.detail-order_num {
height: 78rpx;
line-height: 78rpx;
margin-bottom: 24rpx;
font-weight: 600;
font-size: 26rpx;
color: #333333;
border-bottom: 2rpx solid #f1f1f1;
}
.detail-form {
border-bottom: 2rpx solid #f1f1f1;
margin-bottom: 24rpx;
.detail-form-item {
margin-bottom: 16rpx;
font-size: 26rpx;
color: #333333;
}
}
.popup-goods {
display: flex;
justify-content: space-between;
width: 630rpx;
border-radius: 16rpx;
margin-bottom: 20rpx;
padding-bottom: 1rpx;
box-sizing: border-box;
border-bottom: 2rpx solid #f1f1f1;
.popup-goods-left {
margin-right: 24rpx;
}
.popup-goods-right {
flex-grow: 1;
.popup-goods-right-info {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20rpx;
.goods_name {
font-size: 24rpx;
color: #333333;
}
.goods_price {
font-weight: bold;
font-size: 24rpx;
color: #060606;
}
}
.popup-goods-num {
margin-bottom: 20rpx;
font-size: 24rpx;
color: #777777;
text-align: right;
}
}
}
.popup-goods-total {
text-align: right;
.popup-goods-total-num {
font-size: 24rpx;
color: #666666;
}
.popup-goods-total-price {
font-size: 26rpx;
color: #333;
}
}
}
</style>
<template> <template>
<view class="detail"> <view class="multiple">
<view class="detail-order_num">订单编号:123123123</view> <view class="multiple-search">
<view class="detail-form"> <u-search v-model="queryParams.name" :animation="true" :showAction="false" bgColor="#f6f6f6"
<view class="detail-form-item">收货人：</view> placeholder="请输入门店"></u-search>
<view class="detail-form-item">核销码：</view> <view class="multiple-search-txt" @click.native="handleSearch">搜索</view>
<view class="detail-form-item">联系电话：</view>
<view class="detail-form-item">核销门店：</view>
<view class="detail-form-item">核销时间：</view>
</view> </view>
<view class="popup-goods"> <view class="multiple-card">
<view class="popup-goods-left"> <scroll-view :scroll-y="true" style="height:100%;" @scrolltolower="onReachBottom">
<u-image width="100rpx" height="100rpx" radius="8rpx" /> <view class="multiple-card-wrap" style="padding-top: 12rpx;">
</view> <block v-for="(item,indx) in shopList" :key="indx">
<view class="popup-goods-right"> <view class="multiple-card-item" :class="{active:currShop == item.id}"
<view class="popup-goods-right-info"> @click="onChooseShop(item.id)">
<text class='goods_name'>黄牛牛肉</text> <view class="multiple-card-item-left">
<text class="goods_price">￥10.00</text> <view class="multiple-card-item-left-title">{{item.name}}</view>
<view class="multiple-card-item-left-tag">
<text class="yellow" v-if="item.is_store == 1">可自提</text>
<text class="green" v-if="item.is_send == 1">可配送</text>
</view>
<view class="multiple-card-item-left-info">
<u-image src="../../multipleShop/images/location_small.webp" width="24rpx"
height="24rpx" />
<text>{{item.detailed_address || '-'}}</text>
</view>
<view class="multiple-card-item-left-info">
<u-image src="../../multipleShop/images/time.webp" width="24rpx" height="24rpx" />
<text
v-if="item.day_start && item.day_end">{{item.day_start + '-' + item.day_end}}</text>
<text v-else>9:00-18:00</text>
</view>
</view>
<view class="multiple-card-item-right">
<view class="multiple-card-item-right-distance">距离{{parseDistance(item.distance)}}
</view>
<view class="multiple-card-item-right-icon">
<view style="margin-right: 30rpx;" @click.stop="onPhoneCall(item.phone)">
<u-image src="../../multipleShop/images/phone.webp" width="48rpx"
height="48rpx" />
</view>
<view @click.stop="onNavgation(item)">
<u-image src="../../multipleShop/images/location.webp" width="48rpx"
height="48rpx" />
</view>
</view>
</view>
</view>
</block>
</view> </view>
<view class="popup-goods-num">x5</view>
</view>
</view>
<view class="popup-goods-total"> <u-loadmore :status="status" iconColor="#666" />
<text class="popup-goods-total-num">共5件商品，总金额</text> </scroll-view>
<text class="popup-goods-total-price">￥50.00</text>
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
uni.login({ import {
success(res) { reactive,
console.log(res); ref,
} } from "vue";
import {
shopListApi
} from "@/api/multipleShop.js";
import {
onLoad,
onShow
} from "@dcloudio/uni-app";
const currShop = ref(''); // 选择门店
const shopList = ref([]); // 门店列表
const status = ref(''); // 滚动状态
// 查询参数
const queryParams = reactive({
longitude: '',
latitude: '',
phone: '',
name: '',
page_no: 1,
page_size: 6
}) })
</script>
// 初始化
onLoad(() => {
// 获取定位
getLocation();
});
// 门店选择
const onChooseShop = (id) => {
currShop.value = id;
setTimeout(() => {
uni.reLaunch({
url: '/pages/index/index?id=' + id,
fail(err) {
console.log(err);
}
})
}, 300)
}
// 触底刷新
const onReachBottom = () => {
getShopList();
}
// 搜索
const handleSearch = () => {
shopList.value = [];
queryParams.page_no = 1;
status.value = '';
getShopList();
}
// 获取门店
const getShopList = () => {
if (status.value == 'nomore') return;
if (status.value == 'loading') return;
status.value == 'loading';
shopListApi(queryParams).then(res => {
let len = res.data.lists;
status.value = queryParams.page_size > len ? 'nomore' : 'loadmore';
shopList.value = shopList.value.concat(res.data.lists);
if (status.value == 'loadmore') queryParams.page_no += 1;
})
}
// 门店距离处理
const parseDistance = (e) => {
if (!e) return '-';
if (e > 1) {
return (e.toFixed(1)) + 'km';
} else {
return (e * 1000).toFixed(0) + 'm';
}
}
// 拨打门店电话
const onPhoneCall = (phone) => {
if (!phone) return;
uni.makePhoneCall({
phoneNumber: phone
})
}
// 导航
const onNavgation = (item) => {
uni.openLocation({
latitude: Number(item.latitude),
longitude: Number(item.longitude),
})
}
// 获取定位
const getLocation = () => {
let location = uni.getStorageSync('location');
if (location) {
let [lng, lat] = location.split(',');
queryParams.longitude = lng;
queryParams.latitude = lat;
// 加载店铺列表
getShopList();
} else {
uni.getLocation({
type: "gcj02",
success(res) {
queryParams.latitude = res.latitude;
queryParams.longitude = res.longitude;
// 加载店铺列表
getShopList();
// 避免下次再获取
uni.setStorageSync('location', `${res.longitude},${res.latitude}`)
}
})
}
}
</script>
<style lang="scss">
page {
background: #FAFAFA;
}
.multiple {
padding-bottom: 30rpx;
.multiple-search {
position: sticky;
top: 0;
z-index: 10;
display: flex;
height: 90rpx;
background-color: #fff;
padding: 0 24rpx;
box-sizing: border-box;
.multiple-search-txt {
position: absolute;
right: 28rpx;
top: 50%;
z-index: 11;
transform: translateY(-50%);
width: 110rpx;
height: 52rpx;
line-height: 52rpx;
text-align: center;
background: #FFFFFF;
border-radius: 30rpx 30rpx 30rpx 30rpx;
font-size: 28rpx;
color: #20B128;
}
}
.multiple-card {
height: calc(100vh - 90rpx);
padding-bottom: 12rpx;
.u-loadmore {
padding-bottom: 40rpx;
}
.multiple-card-item {
display: flex;
background: #FFFFFF;
border-radius: 16rpx;
margin: 0 24rpx 20rpx;
padding: 30rpx 0 42rpx 30rpx;
overflow: hidden;
.multiple-card-item-left {
width: 70%;
border-right: 2rpx solid #F1F1F1;
.multiple-card-item-left-title {
margin-bottom: 14rpx;
font-weight: bold;
font-size: 28rpx;
color: #444444;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.multiple-card-item-left-tag {
display: flex;
flex-wrap: wrap;
align-items: center;
margin-bottom: 16rpx;
text {
width: 90rpx;
height: 42rpx;
line-height: 42rpx;
text-align: center;
border-radius: 8rpx;
font-size: 24rpx;
margin-right: 16rpx;
padding: 4rpx 10rpx;
}
.yellow {
background-color: #FFF8F1;
color: #FFB76D;
}
.green {
color: #20B128;
background-color: #F2FFF3;
}
}
.multiple-card-item-left-info {
display: flex;
padding-right: 10rpx;
&:nth-child(1) {
margin-bottom: 16rpx;
}
text {
font-weight: 400;
font-size: 24rpx;
color: #777777;
margin-left: 4rpx;
}
}
}
.multiple-card-item-right {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 30%;
flex-shrink: 0;
.multiple-card-item-right-distance {
margin-bottom: 20rpx;
font-size: 22rpx;
color: #777777;
}
.multiple-card-item-right-icon {
display: flex;
align-items: center;
}
}
}
.active {
position: relative;
border: 2rpx solid #20B128;
&::after {
content: "";
display: block;
position: absolute;
right: -34rpx;
bottom: -8rpx;
width: 0;
height: 0;
border-left: 50rpx solid transparent;
border-right: 50rpx solid transparent;
border-bottom: 50rpx solid #20B128;
transform: rotate(135deg);
}
&::before {
content: "√";
display: block;
position: absolute;
right: 10rpx;
bottom: 4rpx;
color: #fff;
z-index: 11;
font-weight: bold;
}
}
}
}
</style>

21
pages/login/login.vue
View File

@ -132,6 +132,7 @@
const showWeixin = ref(true); //是否显示微信登录 const showWeixin = ref(true); //是否显示微信登录
const isAgree = ref(false); //是否同意协议 const isAgree = ref(false); //是否同意协议
const tempUser = ref(null);
const weixinLogin = () => { const weixinLogin = () => {
if (!isAgree.value) return uni.$u.toast('请先阅读并同意协议'); if (!isAgree.value) return uni.$u.toast('请先阅读并同意协议');
@ -146,9 +147,12 @@
}).then(res => { }).then(res => {
uni.hideLoading(); uni.hideLoading();
userStore.setToken(res.data.token); userStore.setToken(res.data.token);
userStore.setUserInfo(res.data);
if (!res.data.mobile) { //未绑定手机号 if (!res.data.mobile) { //未绑定手机号
tempUser.value = res.data;
return showBind.value = true; return showBind.value = true;
} else {
userStore.setUserInfo(res.data);
} }
navToIndex(); navToIndex();
}) })
@ -167,7 +171,20 @@
getMobileByMnpApi({ getMobileByMnpApi({
code: e.detail.code code: e.detail.code
}).then(res => { }).then(res => {
navToIndex(); //手机号获取成功 可以本地缓存用户信息以及token
userStore.setUserInfo(res.data);
//身份授权成功 核销人员
if (res.is_staff == 1) {
userStore.setUserInfo(res.data);
uni.reLaunch({
url: "/multipleShop/verificationOrder/index"
})
} else { // 直接选择门店
uni.reLaunch({
url: "/multipleShop/index/index"
})
}
}) })
} else { } else {
console.log("用户拒绝授权"); console.log("用户拒绝授权");

359
pages/member/member.vue Normal file
View File

@ -0,0 +1,359 @@
<!-- 会员充值 -->
<!-- <style lang="scss">
.member {
padding: 40rpx 0 300rpx 0;
.card {
background: linear-gradient(to right, #F7EED7, #E7DAAF);
height: 302rpx;
margin: 0 30rpx 30rpx;
border-radius: 10rpx;
padding: 20rpx 0 0 20rpx;
box-sizing: border-box;
.card-info {
display: flex;
align-items: center;
margin-bottom: 30rpx;
.card-info-right {
margin-left: 40rpx;
.phone {
margin-bottom: 12rpx;
font-weight: 600;
font-size: 32rpx;
color: #444444;
}
.level {
font-size: 28rpx;
color: #7B5232;
}
}
}
}
}
</style>
<template>
<view class="member">
<view class="card">
<view class="card-info">
<up-image width="100rpx" height="100rpx" />
<view class="card-info-right">
<view class="phone">155****4444</view>
<view class="level">初级会员 享受9折优惠</view>
</view>
</view>
<view></view>
</view>
</view>
</template> -->
<!-- 会员充值 -->
<style lang="scss">
.member {
// padding-top: 40rpx;
padding: 40rpx 0 300rpx 0;
.card {
background: linear-gradient(to right, #F7EED7, #E7DAAF);
height: 302rpx;
margin: 0 30rpx 30rpx;
border-radius: 10rpx;
padding: 20rpx 0 0 20rpx;
box-sizing: border-box;
.card-info {
display: flex;
align-items: center;
margin-bottom: 30rpx;
.card-info-right {
margin-left: 40rpx;
.phone {
margin-bottom: 12rpx;
font-weight: 600;
font-size: 32rpx;
color: #444444;
}
.level {
font-size: 28rpx;
color: #7B5232;
}
}
}
.money {
display: flex;
font-size: 28rpx;
color: #FFFFFF;
margin-bottom: 34rpx;
text {
margin-right: 116rpx;
}
}
.charge {
display: flex;
align-items: center;
padding-right: 38rpx;
.charge-left {
flex: 1;
margin-right: 30rpx;
&>view {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10rpx;
text {
font-size: 22rpx;
color: #A26341;
}
}
}
.charge-right {
width: 148rpx;
height: 52rpx;
line-height: 52rpx;
background: #7B5232;
border-radius: 30rpx;
font-size: 22rpx;
color: #FFFFFF;
text-align: center;
}
}
}
.rules {
background: #FFFFFF;
border-radius: 16rpx;
margin: 0 30rpx 30rpx;
padding: 30rpx;
.rules-title {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 34rpx;
.rules-title-main {
font-weight: 600;
font-size: 32rpx;
color: #444444;
}
.rules-title-record {
display: flex;
align-items: center;
font-size: 28rpx;
color: #444444;
}
}
.rules-con {
display: flex;
flex-wrap: wrap;
.rules-con-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 188rpx;
height: 220rpx;
border: 2rpx solid #F1F1F1;
border-radius: 16rpx;
margin-bottom: 28rpx;
&:not(:nth-child(3n)) {
margin-right: 26rpx;
}
.rules-con-item-main {
margin-bottom: 10rpx;
font-size: 30rpx;
color: #333333;
}
.rules-con-item-sub {
margin-bottom: 30rpx;
font-size: 24rpx;
color: #777777;
}
.rules-con-item-amount {
text {
font-weight: 600;
font-size: 32rpx;
color: #333333;
}
.symbol {
font-size: 20rpx;
}
}
}
}
}
.attention {
margin: 0 30rpx;
.attention-title {
position: relative;
font-weight: 600;
font-size: 32rpx;
color: #262626;
margin-bottom: 20rpx;
margin-left: 10rpx;
text {
margin-left: 14rpx;
}
&::before {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 0;
width: 6rpx;
height: 100%;
border-radius: 4rpx;
background: #FF8056;
}
}
.attention-tips {
font-size: 24rpx;
color: #7A7A7A;
margin-bottom: 30rpx;
}
}
.member-btn {
position: fixed;
bottom: 0rpx;
left: 50%;
transform: translateX(-50%);
height: 110rpx;
background-color: #F6F6F6;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
padding-bottom: constant(safe-area-inset-bottom);
/* 兼容 iOS < 11.2 */
padding-bottom: env(safe-area-inset-bottom);
/* 兼容 iOS >= 11.2 */
.btn-wrap {
width: 670rpx;
height: 80rpx;
line-height: 80rpx;
margin: 0 auto;
background: #EFCC6E;
border-radius: 40rpx;
font-size: 32rpx;
color: #FFFFFF;
text-align: center;
}
}
}
</style>
<template>
<view class="member">
<view class="card">
<view class="card-info">
<up-image width="100rpx" height="100rpx" />
<view class="card-info-right">
<view class="phone">155****4444</view>
<view class="level">初级会员 享受9折优惠</view>
</view>
</view>
<view class="money">
<text>余额：10000</text>
<view>充值</view>
</view>
<view class="charge">
<view class="charge-left">
<view>
<text>当前已充值1000，升级还需2000</text>
<text>Lv.2</text>
</view>
<up-line-progress :percentage="30" activeColor="#A26341" inactiveColor="#fff"
height="8rpx"></up-line-progress>
</view>
<view class="charge-right">升级会员</view>
</view>
</view>
<!-- 充值规格 -->
<view class="rules">
<view class="rules-title">
<view class="rules-title-main">充值规格</view>
<view class="rules-title-record">
充值记录
<up-icon name="arrow-right"></up-icon>
</view>
</view>
<view class="rules-con">
<view class="rules-con-item" v-for="item in 4">
<view class="rules-con-item-main">基础会员</view>
<view class="rules-con-item-sub">永久</view>
<view class="rules-con-item-amount">
<text class="symbol">￥</text>
<text>1000</text>
</view>
</view>
<view class="rules-con-define">
<up-input placeholder="点击输入金额" type="number" color="#333" fontSize="28rpx"
:placeholderStyle="{color:'#989898'}">
<template #prefix>
<up-text text="自定义金额" color="#111" size="30rpx" margin="0 3px 0 0" type="tips"></up-text>
</template>
</up-input>
</view>
</view>
</view>
<!-- 注意事项 -->
<view class="attention">
<view class="attention-title"><text>注意事项：</text></view>
<view class="attention-tips">1、充值后帐户的金额不能提现，可用于消费使用</view>
<view class="attention-tips">2、账户充值出现问题可联系平台客服，也可拨打平台客服咨询热线4008888888</view>
</view>
<view class="member-btn">
<view class="btn-wrap">
确认充值
</view>
</view>
</view>
</template>
<script>
import {
rechargeApi
} from "@/api/user.js";
rechargeApi({
price: 1000
}).then(res => {
console.log(res);
})
</script>

182
pages/my/my.vue
View File

@ -1,16 +1,54 @@
<template> <template>
<view> <view>
<up-navbar title="我的" bgColor="rgba(0,0,0,0)" :autoBack="true"> <up-navbar title="我的" :autoBack="true" bgColor="transparent" :fixed="true">
</up-navbar> </up-navbar>
<view class="user-info"> <view class="user-info">
<image class="bg" src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/e3a7b202404261113002322.webp" <image class="bg" src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/e3a7b202404261113002322.webp"
mode="widthFix"></image> mode="widthFix"></image>
<view class="u-card"> <view class="u-card">
<up-avatar :src="userInfo.avatar" size="80"></up-avatar> <view style="display: flex;margin-bottom: 44rpx;">
<view class="content"> <up-avatar :src="userInfo.avatar" size="56"></up-avatar>
<view class="u-phone">{{userInfo.nickname}}</view> <view class="content">
<view class="u-id">ID: {{userInfo.id}}</view> <view class="u-phone">{{userInfo.nickname}}</view>
<view class="u-id">ID: {{userInfo.id}}</view>
</view>
</view> </view>
<view class="u-card-level">
<view class="u-level-item">
<view class="u-level-item-num">123</view>
<view class="u-level-item-txt">会员等级</view>
</view>
<view class="u-level-item">
<view class="u-level-item-num">123</view>
<view class="u-level-item-txt">可享折扣</view>
</view>
<view class="u-level-item">
<view class="u-level-item-num">123</view>
<view class="u-level-item-txt">可用余额</view>
</view>
</view>
</view>
</view>
<view class="member">
<view class="member-wrap">
<view class="member-left">
<up-image width="36rpx" height="36rpx" src="/static/icon/silver.webp"></up-image>
<text>初级会员</text>
<up-line direction="col" color="#707070" margin="0 10rpx" length="12"></up-line>
<view>活动期间下单即享初级会员</view>
</view>
<view class="member-right">立即下单</view>
</view>
<view class="member-progress">
<view>
<text>当前已充值1000，升级还需2000</text>
<text>Lv.2</text>
</view>
<up-line-progress :percentage="30" activeColor="#A26341" inactiveColor="#fff"
height="8rpx"></up-line-progress>
</view> </view>
</view> </view>
@ -24,16 +62,21 @@
<view class="">待付款</view> <view class="">待付款</view>
<view class="badge" v-if="orderCount.no_pay">{{orderCount.no_pay}}</view> <view class="badge" v-if="orderCount.no_pay">{{orderCount.no_pay}}</view>
</view> </view>
<view class="list-item" @click="navTo(2)"> <view class="list-item" @click="navTo(2)">
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/45241202404261403353935.png"> <image src="/static/icon/wait.webp">
</image> </image>
<view class="">待收货</view> <view class="">待核销</view>
<view class="badge" v-if="orderCount.receiving">{{orderCount.receiving}}</view> <view class="badge" v-if="orderCount.receiving">{{orderCount.receiving}}</view>
</view> </view>
<!-- <view class="list-item">
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/96915202404261403582769.png"></image> <view class="list-item" @click="navTo(2)">
<view class="">售后/退款</view> <image src="/static/icon/done.webp">
</view> --> </image>
<view class="">已核销</view>
<view class="badge" v-if="orderCount.receiving">{{orderCount.receiving}}</view>
</view>
<view class="list-item" @click="navTo()"> <view class="list-item" @click="navTo()">
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/abdcd202404261406199643.png"> <image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/abdcd202404261406199643.png">
</image> </image>
@ -45,8 +88,8 @@
<view class="card"> <view class="card">
<up-cell-group> <up-cell-group>
<up-cell title="我的余额" :isLink="true" url="/pageQuota/Balance/index"></up-cell>
<up-cell title="我的地址" :isLink="true" url="/pagesOrder/addressList/addressList"></up-cell> <up-cell title="我的地址" :isLink="true" url="/pagesOrder/addressList/addressList"></up-cell>
<!-- <up-cell title="我的余额" :isLink="true" url="/pageQuota/Balance/index"></up-cell> -->
</up-cell-group> </up-cell-group>
</view> </view>
@ -102,7 +145,7 @@
} }
onShow(() => { onShow(() => {
userInfo.value = userStore.userInfo; userInfo.value = userStore.userInfo;
getOrderCount(); getOrderCount();
}) })
</script> </script>
@ -112,7 +155,7 @@
overflow: hidden; overflow: hidden;
position: relative; position: relative;
width: 750rpx; width: 750rpx;
height: 450rpx; height: 436rpx;
/* #ifdef H5 */ /* #ifdef H5 */
height: 350rpx; height: 350rpx;
/* #endif */ /* #endif */
@ -128,9 +171,8 @@
.u-card { .u-card {
box-sizing: border-box; box-sizing: border-box;
padding: 50rpx 0 50rpx 50rpx; padding: 50rpx 0 50rpx 50rpx;
display: flex;
position: absolute; position: absolute;
bottom: 50rpx; top: 100rpx;
left: 0; left: 0;
z-index: 2; z-index: 2;
@ -150,33 +192,115 @@
font-size: 24rpx; font-size: 24rpx;
} }
} }
.u-card-level {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 40rpx;
.u-level-item {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
&:not(:nth-last-child(1)) {
margin-right: 100rpx;
}
.u-level-item-num {
font-weight: 600;
font-size: 32rpx;
color: #333333;
margin-bottom: 8rpx;
}
.u-level-item-txt {
font-size: 26rpx;
color: #444444;
}
}
}
}
}
.member {
width: 710rpx;
margin: 0 auto;
background: linear-gradient(135deg, #FFF9E8 0%, #F3E7C0 100%);
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(113, 113, 113, 0.11);
border-radius: 12rpx;
padding: 0 18rpx 22rpx 22rpx;
box-sizing: border-box;
.member-wrap {
display: flex;
align-items: center;
justify-content: space-between;
height: 78rpx;
margin-bottom: 20rpx;
.member-left {
display: flex;
align-items: center;
text {
font-weight: bold;
font-size: 26rpx;
color: #060606;
}
view {
font-size: 24rpx;
color: #060606;
}
}
.member-right {
width: 136rpx;
height: 56rpx;
line-height: 56rpx;
background: #FFFFFF;
border-radius: 28rpx;
font-weight: 600;
font-size: 24rpx;
color: #7D661E;
text-align: center;
}
}
.member-progress {
&>view {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10rpx;
text {
font-size: 22rpx;
color: #A26341;
}
}
} }
} }
.order-info-box { .order-info-box {
margin: 20rpx;
height: 140rpx;
position: relative;
.order-info { .order-info {
height: 220rpx;
width: 710rpx; width: 710rpx;
background-color: #fff; background-color: #fff;
border-radius: 14rpx; border-radius: 14rpx;
position: absolute;
top: -80rpx;
left: 0;
z-index: 3;
background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/def/a8863202404261349533191.png'); background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/def/a8863202404261349533191.png');
background-size: 35% 100%; background-size: 28% 100%;
background-position: right; background-position: right;
background-repeat: no-repeat; background-repeat: no-repeat;
margin: 0 auto;
padding: 28rpx 0 40rpx 0;
.info-head { .info-head {
margin-left: 20rpx;
margin-top: 20rpx;
margin-bottom: 20rpx;
font-size: 32rpx; font-size: 32rpx;
font-weight: bold;
margin: 0 0 30rpx 30rpx;
} }
.info-list { .info-list {

107
pagesOrder/detail/detail.vue
View File

@ -4,29 +4,29 @@
还剩<text>{{countDown}}</text>订单自动取消 还剩<text>{{countDown}}</text>订单自动取消
</view> </view>
<view class="m-card m-address" style="margin-top: 20rpx;"> <view class="m-card m-address" style="margin-top: 20rpx;">
<view class="address-info" @click="callPhone(shopInfo.service_phone)"> <view class="address-info" @click="callPhone(shopInfo.phone)">
<view class="top" style="align-items: flex-start;"> <view class="top" style="align-items: flex-start;">
<view style="color: #333;display: flex;align-items: center;"> <view style="color: #333;display: flex;align-items: center;">
<up-icon name="map"></up-icon> <up-icon name="map"></up-icon>
<text style="margin: 0 10rpx;">自提点</text> <text style="margin: 0 10rpx;">自提点</text>
</view> </view>
<view v-if="shopInfo.mer_id"> <view v-if="shopInfo.id">
<view style="color: #333;"> <view style="color: #333;">
{{shopInfo.mer_name}} {{shopInfo.name}}
<text v-if="shopInfo.recommend" <!-- <text v-if="shopInfo.recommend"
style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text> style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text> -->
</view> </view>
<view style="font-size: 24rpx;color: #333;"> <view style="font-size: 24rpx;color: #333;">
{{shopInfo.mer_address}} {{shopInfo.detailed_address}}
</view> </view>
<view> <view>
<view v-if="shopInfo.service_phone"> <view v-if="shopInfo.phone">
<text style="margin-right: 10rpx;">{{shopInfo.real_name||shopInfo.mer_real_name}}</text> <text style="margin-right: 10rpx;">{{shopInfo.name||shopInfo.mer_real_name}}</text>
<text>{{shopInfo.service_phone}}</text> <text>{{shopInfo.phone}}</text>
</view> </view>
<text v-if="shopInfo.distance" <!-- <text v-if="shopInfo.distance"
style="color: #20b128;font-size: 22rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text> style="color: #20b128;font-size: 22rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text> -->
</view> </view>
</view> </view>
</view> </view>
</view> </view>
@ -65,29 +65,34 @@
</view> </view>
<view class="m-card m-good" v-for="(item,index) in datas.goods_list" :key="index"> <view class="m-card m-good" v-for="(item,index) in datas.goods_list" :key="index">
<view class="image"> <view class="image">
<up-image :src="item.imgs" width="120rpx" height="120rpx"></up-image> <up-image :src="item.image" width="120rpx" height="120rpx"></up-image>
</view> </view>
<view class="body-content"> <view class="body-content">
<view> <view>
<view class="title"> <view class="title">
<view>{{item.class_name}}</view> <view>{{item.store_name}}</view>
<view>¥{{item.sell}}</view> <view>¥{{item.price}}</view>
</view> </view>
<view class="tips"> <view class="tips">
<view>{{}}</view> <view>{{}}</view>
<view>x{{item.nums}}{{item.unit_name}}</view> <view>x{{item.nums}}{{item.unit_name}}</view>
</view> </view>
<view class="time">
{{item.msg}}
</view>
</view> </view>
</view> </view>
</view> </view>
<view class="qr_code">
<QRCode :val="datas.verify_code" :size="150"></QRCode>
<view style="font-weight: bold;color: #333;font-size: 26;">
核销码 {{datas.verify_code}}
</view>
</view>
<view class="m-card good-info" v-if="datas.paid==0"> <view class="m-card good-info" v-if="datas.paid==0">
<view v-if="datas.goods_list" class="row"> <view v-if="datas.goods_list" class="row">
<view>商品总价 <text>共计{{datas.goods_list.length}}款商品</text></view> <view>商品总价 <text>共计{{datas.goods_list.length}}款商品</text></view>
<view><text>¥</text>{{c_price(datas.total, 0)}}<text>.{{c_price(datas.total, 1)}}</text></view> <view><text>¥</text>{{c_price(datas.total_price, 0)}}<text>.{{c_price(datas.total_price, 1)}}</text>
</view>
</view> </view>
<view class="row"> <view class="row">
<view>运费</view> <view>运费</view>
@ -95,8 +100,8 @@
</view> </view>
<view class="row-need"> <view class="row-need">
<view style="margin-right: 10rpx;">需付款</view> <view style="margin-right: 10rpx;">需付款</view>
<view v-if="datas.total"> <view v-if="datas.pay_price">
<text>¥</text>{{c_price(datas.total, 0)}}<text>.{{c_price(datas.total, 1)}}</text> <text>¥</text>{{c_price(datas.pay_price, 0)}}<text>.{{c_price(datas.pay_price, 1)}}</text>
</view> </view>
</view> </view>
</view> </view>
@ -105,8 +110,8 @@
<block v-if="datas.paid==0"> <block v-if="datas.paid==0">
<view class="row"> <view class="row">
<view>订单编号</view> <view>订单编号</view>
<up-copy :content="datas.number"> <up-copy :content="datas.order_id">
<text>{{datas.number}} | 复制</text> <text>{{datas.order_id}} | 复制</text>
</up-copy> </up-copy>
</view> </view>
<view class="row"> <view class="row">
@ -122,12 +127,13 @@
<block v-else> <block v-else>
<view v-if="datas.goods_list" class="row"> <view v-if="datas.goods_list" class="row">
<view>实付款</view> <view>实付款</view>
<view><text>¥</text>{{c_price(datas.total, 0)}}<text>.{{c_price(datas.total, 1)}}</text></view> <view><text>¥</text>{{c_price(datas.pay_price, 0)}}<text>.{{c_price(datas.pay_price, 1)}}</text>
</view>
</view> </view>
<view class="row"> <view class="row">
<view>订单编号</view> <view>订单编号</view>
<up-copy :content="datas.number"> <up-copy :content="datas.order_id">
<text>{{datas.number}} | 复制</text> <text>{{datas.order_id}} | 复制</text>
</up-copy> </up-copy>
</view> </view>
<view class="row"> <view class="row">
@ -140,27 +146,27 @@
</view> </view>
<view class="row" style="margin-bottom: 0;"> <view class="row" style="margin-bottom: 0;">
<view>支付状态</view> <view>支付状态</view>
<view v-if="datas.paid">已支付</view> <view v-if="datas.paid == 1">已支付</view>
<view v-else class="red">待支付</view> <view v-else class="red">待支付</view>
</view> </view>
</block> </block>
</view> </view>
<view style="width: 100%;height: 200rpx;"></view> <view style="width: 100%;height: 200rpx;"></view>
<view class="fiexd-btn-box" v-if="datas.number"> <view class="fiexd-btn-box" v-if="datas.order_id">
<block v-if="!datas.paid"> <block v-if="!datas.paid">
<view style="color: #777777;" @click="showCancel=true">取消订单</view> <view style="color: #777777;" @click="showCancel=true">取消订单</view>
<view style="width: 450rpx;"> <view style="width: 450rpx;">
<up-button color="#20B128" shape="circle" @click="rePay" :throttleTime="1000">立即支付 <up-button color="#20B128" shape="circle" @click="rePay" :throttleTime="1000">立即支付
¥{{datas.total}}</up-button> ¥{{datas.pay_price}}</up-button>
</view> </view>
</block> </block>
<block v-else> <block v-else>
<view></view> <view></view>
<view style="width: 450rpx;"> <view style="width: 450rpx;">
<up-button v-if="datas.status==0||datas.status==1" color="#20B128" shape="circle" <!-- <up-button v-if="datas.status==0||datas.status==1" color="#20B128" shape="circle"
@click="showTake=true">确认收货</up-button> @click="showTake=true">确认收货</up-button> -->
<up-button v-else color="#20B128" plain shape="circle" @click="purchaseAgain">再次购买</up-button> <up-button color="#20B128" plain shape="circle" @click="purchaseAgain">再次购买</up-button>
</view> </view>
</block> </block>
</view> </view>
@ -188,6 +194,7 @@
import orderCanclePopup from "@/components/orderCanclePopup.vue"; import orderCanclePopup from "@/components/orderCanclePopup.vue";
import shopListPopupVue from "@/components/shopListPopup.vue"; import shopListPopupVue from "@/components/shopListPopup.vue";
import modal from "@/components/modal.vue"; import modal from "@/components/modal.vue";
import QRCode from "@/uni_modules/uview-plus/components/u-qrcode/u-qrcode.vue";
import { import {
orderDetailApi, orderDetailApi,
cancelOrderApi, cancelOrderApi,
@ -227,7 +234,8 @@
order_id: datas.value.id order_id: datas.value.id
}).then(res => { }).then(res => {
datas.value = res.data; datas.value = res.data;
shopInfo.value = res.data.merchant_info;
shopInfo.value = res.data.store_info;
if (addressList.value.length > 0 && res.data.paid) { if (addressList.value.length > 0 && res.data.paid) {
addressInfo.value = addressList.value.find(item => item.address_id == res.data.address_id); addressInfo.value = addressList.value.find(item => item.address_id == res.data.address_id);
} else { } else {
@ -319,7 +327,7 @@
} }
}) })
} }
getMerchantList(); // getMerchantList();
// 定位 // 定位
const LoadAddress = () => { const LoadAddress = () => {
uni.getLocation({ uni.getLocation({
@ -445,7 +453,7 @@
onLoad((option) => { onLoad((option) => {
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
title: option.type == 0 ? '等待付款' : '订单详情' title: option.type == 0 ? '等待付款' : '订单详情'
}) });
if (option.id) { if (option.id) {
datas.value.id = option.id; datas.value.id = option.id;
getDetails() getDetails()
@ -480,6 +488,21 @@
color: #333333; color: #333333;
} }
.qr_code {
margin: 0 20rpx 20rpx;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 500rpx;
background: #fff;
border-radius: 5px;
view {
margin-top: 44rpx;
}
}
.m-address { .m-address {
margin-bottom: 20rpx; margin-bottom: 20rpx;
display: flex; display: flex;

4
pagesOrder/order/component/good.vue
View File

@ -15,7 +15,7 @@
<view class="body-content"> <view class="body-content">
<view style="display: flex;flex: 1;flex-shrink: 0;"> <view style="display: flex;flex: 1;flex-shrink: 0;">
<view v-for="(item,index) in datas.goods_list" :key="index"> <view v-for="(item,index) in datas.goods_list" :key="index">
<image class="image" :src="item.imgs"></image> <image class="image" :src="item.image"></image>
</view> </view>
</view> </view>
<view <view
@ -23,7 +23,7 @@
<up-icon name="arrow-right-double" color="#20B128"></up-icon> <up-icon name="arrow-right-double" color="#20B128"></up-icon>
</view> </view>
</view> </view>
<view class="all">共 {{datas.goods_count}} 件商品, 总金额 <text>¥{{datas.total}}</text> </view> <view class="all">共 {{datas.goods_count}} 件商品, 总金额 <text>¥{{datas.total_price}}</text> </view>
</view> </view>
<view v-if="datas.paid==0" class="item-btn"> <view v-if="datas.paid==0" class="item-btn">
<view style="width: 80px;"><up-button size="small" plain color="#989898" shape="circle" <view style="width: 80px;"><up-button size="small" plain color="#989898" shape="circle"

2
pagesOrder/order/order.vue
View File

@ -212,7 +212,7 @@
orderListApi({ orderListApi({
page_no: where.value[type].page_no, page_no: where.value[type].page_no,
page_size: where.value[type].page_size, page_size: where.value[type].page_size,
number: keyword.value, order_id: keyword.value,
status: status, status: status,
paid: paid paid: paid
}).then(res => { }).then(res => {

941
pagesOrder/settle/settle.vue
View File

@ -1,103 +1,104 @@
<template> <template>
<view class=""> <view class="">
<!-- <view class="m-card row"> <!-- <view class="m-card row">
<up-cell-group> <up-cell-group>
<up-cell title="请添加自提点" :isLink="true" :border="false" @click="shopListShow=true"></up-cell> <up-cell title="请添加自提点" :isLink="true" :border="false" @click="shopListShow=true"></up-cell>
</up-cell-group> </up-cell-group>
</view> --> </view> -->
<view class="m-card m-address"> <!-- <view class="m-card m-address">
<view class="address-info"> <view class="address-info">
<view class="top" style="align-items: flex-start;"> <view class="top" style="align-items: flex-start;">
<view style="color: #333;display: flex;align-items: center;"> <view style="color: #333;display: flex;align-items: center;">
<up-icon name="map"></up-icon> <up-icon name="map"></up-icon>
<text style="margin: 0 10rpx;">自提点</text> <text style="margin: 0 10rpx;">自提点</text>
</view> </view>
<view v-if="shopInfo.mer_id"> <view v-if="shopInfo.mer_id">
<view> <view>
{{shopInfo.mer_name}} {{shopInfo.mer_name}}
<text v-if="shopInfo.recommend" <text v-if="shopInfo.recommend"
style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text> style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text>
</view> </view>
<view> <view>
<view v-if="shopInfo.service_phone" @click="onCall(shopInfo.service_phone)"> <view v-if="shopInfo.service_phone" @click="onCall(shopInfo.service_phone)">
<text style="margin-right: 10rpx;">{{shopInfo.mer_real_name}}</text> <text style="margin-right: 10rpx;">{{shopInfo.mer_real_name}}</text>
<text>{{shopInfo.service_phone}}</text> <text>{{shopInfo.service_phone}}</text>
</view> </view>
<text v-if="shopInfo.distance" <text v-if="shopInfo.distance"
style="color: #20b128;font-size: 20rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text> style="color: #20b128;font-size: 20rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view class="address-btn"> <view class="address-btn">
<view style="width: 80px;"><up-button @click="shopListShow=true" size="small" shape="circle" color="#f6f6f6" <view style="width: 80px;"><up-button @click="shopListShow=true" size="small" shape="circle"
:customStyle="{color:'#666666'}">修改</up-button></view> color="#f6f6f6" :customStyle="{color:'#666666'}">修改</up-button></view>
</view> </view>
</view> </view> -->
<view v-if="!addressInfo.address_id" class="m-card row"> <view v-if="!addressInfo.address_id" class="m-card row">
<up-cell-group> <up-cell-group>
<up-cell title="我的地址" :isLink="true" :border="false" @click="openAddress()"></up-cell> <up-cell title="我的地址" :isLink="true" :border="false" @click="openAddress()"></up-cell>
</up-cell-group> </up-cell-group>
</view> </view>
<view v-else class="m-card m-address"> <view v-else class="m-card m-address">
<view class="address-info"> <view class="address-info">
<view class="top"> <view class="top">
<up-icon name="account"></up-icon> <up-icon name="account"></up-icon>
<view class="t-name">{{addressInfo.real_name}}</view> <view class="t-name">{{addressInfo.real_name}}</view>
<view>{{addressInfo.phone}}</view> <view>{{addressInfo.phone}}</view>
</view> </view>
<view class="bottom u-line-2"> <view class="bottom u-line-2">
{{addressInfo.detail}} {{addressInfo.detail}}
</view> </view>
</view> </view>
<view class="address-btn"> <view class="address-btn">
<view style="width: 80px;"><up-button @click="showAddress = true" size="small" shape="circle" color="#f6f6f6" <view style="width: 80px;"><up-button @click="showAddress = true" size="small" shape="circle"
:customStyle="{color:'#666666'}">修改</up-button></view> color="#f6f6f6" :customStyle="{color:'#666666'}">修改</up-button></view>
</view> </view>
</view> </view>
<view class="m-card m-good" v-for="(item,index) in cartList" :key="index"> <view class="m-card m-good" v-for="(item,index) in cartList" :key="index">
<view class="image"> <view class="image">
<up-image width="160rpx" height="160rpx" :src="item.imgs"></up-image> <up-image width="160rpx" height="160rpx" :src="item.imgs"></up-image>
</view> </view>
<view class="body-content"> <view class="body-content">
<view> <view>
<view class="title"> <view class="title">
<view>{{item.name}}</view> <view>{{item.name}}</view>
<view>¥{{item.price}}</view> <view>¥{{item.price}}</view>
</view> </view>
<view class="tips"> <view class="tips">
<view>{{item.unit_name}}</view> <view>{{item.unit_name}}</view>
<view>x{{item.cart_num}}</view> <view>x{{item.cart_num}}</view>
</view> </view>
</view> </view>
<view class="time"> <view class="time">
{{orderInfo.delivery_msg}} {{orderInfo.delivery_msg}}
</view> </view>
</view> </view>
</view> </view>
<view class="m-card good-info"> <view class="m-card good-info">
<view class="head-title">价格明细</view> <view class="head-title">价格明细</view>
<view class="row"> <view class="row">
<view>商品总价 <text>共计{{cartList.length}}款商品</text></view> <view>商品总价 <text>共计{{cartList.length}}款商品</text></view>
<view><text>¥</text>{{c_price(orderInfo.total, 0)}}<text>.{{c_price(orderInfo.total, 1)}}</text></view> <view><text>¥</text>{{c_price(orderInfo.pay_price, 0)}}<text>.{{c_price(orderInfo.pay_price, 1)}}</text>
</view> </view>
<view class="row"> </view>
<view>运费</view> <view class="row">
<view><text>¥</text>0<text>.00</text></view> <view>运费</view>
</view> <view><text>¥</text>0<text>.00</text></view>
</view> </view>
<view class="m-card good-info"> </view>
<view class="head-title">支付方式</view> <view class="m-card good-info">
<view class="row"> <view class="head-title">支付方式</view>
<view class="icon-text"><up-icon name="weixin-circle-fill" color="#20b128" size="22" <view class="row">
style="margin-right: 10rpx;"></up-icon> 微信支付</view> <view class="icon-text"><up-icon name="weixin-circle-fill" color="#20b128" size="22"
<view class="icon"> style="margin-right: 10rpx;"></up-icon> 微信支付</view>
<image v-if="true" src="@/static/icon/check.png"></image> <view class="icon">
<image v-else src="@/static/icon/n-check.png"></image> <image v-if="true" src="@/static/icon/check.png"></image>
</view> <image v-else src="@/static/icon/n-check.png"></image>
</view> </view>
</view> </view>
<!-- <view class="m-card order-remark"> </view>
<!-- <view class="m-card order-remark">
<view class="head-title"> <view class="head-title">
<text>订单备注</text> <text>订单备注</text>
<text>0/200</text> <text>0/200</text>
@ -105,408 +106,436 @@
<up-textarea style="background-color: #F6F6F6;" v-model="formData.remark" placeholder="暂无备注内容" <up-textarea style="background-color: #F6F6F6;" v-model="formData.remark" placeholder="暂无备注内容"
:height="100"></up-textarea> :height="100"></up-textarea>
</view> --> </view> -->
<view style="width: 100%;height: 200rpx;"></view> <view style="width: 100%;height: 200rpx;"></view>
<view class="fiexd-btn-box"> <view class="fiexd-btn-box">
<view class="tips"> <view class="tips">
<view style="margin-right: 20rpx;">共 {{ cartList.length }} 款</view> <view style="margin-right: 20rpx;">共 {{ cartList.length }} 款</view>
<view class="all"> <view class="all">
<text style="color: #000;">合计: </text> <text style="color: #000;">合计: </text>
<text>￥</text> <text>￥</text>
<block v-if="orderInfo.total"> <block v-if="orderInfo.total_price">
<text style="font-size: 32rpx;font-weight: bold;">{{c_price(orderInfo.total, 0)}}</text> <text style="font-size: 32rpx;font-weight: bold;">{{c_price(orderInfo.total_price, 0)}}</text>
<text>.{{c_price(orderInfo.total, 1)}}</text> <text>.{{c_price(orderInfo.total_price, 1)}}</text>
</block> </block>
</view> </view>
</view> </view>
<view style="width: 200rpx;"> <view style="width: 200rpx;">
<up-button color="#20B128" shape="circle" @click="submitOrder" :throttleTime="1000">预付款提交</up-button> <up-button color="#20B128" shape="circle" @click="submitOrder" :throttleTime="1000">预付款提交</up-button>
</view> </view>
</view> </view>
<addressPopup ref="addressRef" :show="showAddress" :list="addressList" @close="showAddress=false" <addressPopup ref="addressRef" :show="showAddress" :list="addressList" @close="showAddress=false"
@change="changeAddress" /> @change="changeAddress" />
<shopListPopupVue ref="shopRef" :show="shopListShow" :list="merchantList" @close="shopListShow=false" <shopListPopupVue ref="shopRef" :show="shopListShow" :list="merchantList" @close="shopListShow=false"
@change="changeShop" @search="searchShop" /> @change="changeShop" @search="searchShop" />
<modal title="尚未设置收货地址" content="您还没有添加收货地址，请点击添加" cancleText="添加地址" confirmText="继续支付" :show="toastAddressShow" <modal title="尚未设置收货地址" content="您还没有添加收货地址，请点击添加" cancleText="添加地址" confirmText="继续支付" :show="toastAddressShow"
@close="addAddress" @change="goPay" /> @close="addAddress" @change="goPay" />
<!-- <modal title="是否要拨打电话" :content="`即将拨打电话${phone}`" cancleText="取消" confirmText="拨打" :show="callShow" @close="callShow = false" <!-- <modal title="是否要拨打电话" :content="`即将拨打电话${phone}`" cancleText="取消" confirmText="拨打" :show="callShow" @close="callShow = false"
@change="onCall" /> --> @change="onCall" /> -->
</view> </view>
</template> </template>
<script setup> <script setup>
import { import {
onLoad, onLoad,
onShow onShow
} from "@dcloudio/uni-app" } from "@dcloudio/uni-app"
import { import {
nextTick, nextTick,
ref ref
} from "vue" } from "vue"
import addressPopup from "@/components/addressPopup.vue"; import addressPopup from "@/components/addressPopup.vue";
import shopListPopupVue from "@/components/shopListPopup.vue"; import shopListPopupVue from "@/components/shopListPopup.vue";
import useCartStore from "@/store/cart.js"; import useCartStore from "@/store/cart.js";
import modal from "@/components/modal.vue"; import modal from "@/components/modal.vue";
import { import {
checkOrderApi checkOrderApi
} from "@/api/cart.js"; } from "@/api/cart.js";
import { import {
addressListsApi, addressListsApi,
merchantListApi merchantListApi
} from "@/api/user.js"; } from "@/api/user.js";
import { import {
createOrderApi createOrderApi
} from "@/api/order.js"; } from "@/api/order.js";
const cartStore = useCartStore(); const cartStore = useCartStore();
const formData = ref({ const formData = ref({
remark: "" remark: ""
}) })
const isAddress = ref(false); const isAddress = ref(false);
const toastAddressShow = ref(false); const toastAddressShow = ref(false);
// 选择地址 // 选择地址
const addressRef = ref(null); const addressRef = ref(null);
const showAddress = ref(false); const showAddress = ref(false);
const addressInfo = ref({}); const addressInfo = ref({});
const changeAddress = (e) => { const changeAddress = (e) => {
addressInfo.value = e; addressInfo.value = e;
showAddress.value = false; showAddress.value = false;
isAddress.value = true; isAddress.value = true;
} }
const openAddress = () => { const openAddress = () => {
if (addressList.length > 0) showAddress.value = true; if (addressList.length > 0) showAddress.value = true;
else uni.navigateTo({ else uni.navigateTo({
url: '/pagesOrder/addressEdit/addressEdit' url: '/pagesOrder/addressEdit/addressEdit'
}) })
} }
// 地址相关 // 地址相关
const addressList = ref([]); const addressList = ref([]);
const getAddressList = () => { const getAddressList = () => {
addressListsApi().then(res => { addressListsApi().then(res => {
addressList.value = res.data.lists; addressList.value = res.data.lists;
addressList.value.forEach(item => { addressList.value.forEach(item => {
if (item.is_default) { if (item.is_default) {
addressInfo.value = item; addressInfo.value = item;
isAddress.value = true; isAddress.value = true;
} }
}) })
if (!isAddress.value && addressList.value.length > 0) { if (!isAddress.value && addressList.value.length > 0) {
addressInfo.value = addressList.value[0]; addressInfo.value = addressList.value[0];
isAddress.value = true; isAddress.value = true;
} }
if (addressInfo.value.address_id) { if (addressInfo.value.address_id) {
nextTick(() => { nextTick(() => {
addressRef.value.setCheck(addressInfo.value.address_id); addressRef.value.setCheck(addressInfo.value.address_id);
}) })
} }
}) })
} }
// 提货点相关 // 提货点相关
const shopRef = ref(null); const shopRef = ref(null);
const shopListShow = ref(false); const shopListShow = ref(false);
const merchantList = ref([]); const merchantList = ref([]);
const myAddressInfo = ref({ const myAddressInfo = ref({
long: "", long: "",
lat: "" lat: ""
}) })
const shopInfo = ref({ const shopInfo = ref({
mer_id: '' mer_id: ''
}); });
const getMerchantList = (mer_name = null) => {
merchantListApi({
...myAddressInfo.value,
mer_name: mer_name ? mer_name : ''
}).then(res => {
merchantList.value = res.data.lists;
if (mer_name === null && myAddressInfo.value.long && merchantList.value.length > 0 && !shopInfo
.value.mer_id) {
shopInfo.value = merchantList.value[0];
shopInfo.value.recommend = 1;
nextTick(() => {
shopRef.value.setCheck(shopInfo.value.mer_id);
})
}
})
}
getMerchantList();
// 定位
const LoadAddress = () => {
uni.getLocation({
success: (res) => {},
fail: (err) => {
uni.$u.toast('定位失败, 请手动选择提货点!')
},
complete: (res) => {
myAddressInfo.value.long = res.longitude || "";
myAddressInfo.value.lat = res.latitude || "";
getMerchantList();
}
})
}
LoadAddress();
const changeShop = (e) => {
shopInfo.value = e;
shopListShow.value = false;
}
const searchShop = (e) => {
getMerchantList(e)
}
// 拨打电话
// const callShow = ref(false)
// const phone = ref('');
// const callphone = (e) => {
// callShow.value = true;
// phone.value = e;
// }
const onCall = (e) => {
uni.makePhoneCall({
phoneNumber: e,
success() {
callShow.value = false
}
})
}
// 选择地址 const getMerchantList = (mer_name = null) => {
const addAddress = () => { merchantListApi({
toastAddressShow.value = false; ...myAddressInfo.value,
nextTick(() => { mer_name: mer_name ? mer_name : ''
showAddress.value = true; }).then(res => {
}) merchantList.value = res.data.lists;
} if (mer_name === null && myAddressInfo.value.long && merchantList.value.length > 0 && !shopInfo
// 继续支付 .value.mer_id) {
const goPay = () => { shopInfo.value = merchantList.value[0];
toastAddressShow.value = false; shopInfo.value.recommend = 1;
isAddress.value = true; nextTick(() => {
submitOrder(); shopRef.value.setCheck(shopInfo.value.mer_id);
} })
}
})
}
// 提交订单 // getMerchantList();
const submitOrder = () => { // 定位
if (!shopInfo.value.mer_id) { const LoadAddress = () => {
uni.$u.toast('请先选择提货点'); uni.getLocation({
return shopListShow.value = true; success: (res) => {},
} fail: (err) => {
if (!isAddress.value) return toastAddressShow.value = true; uni.$u.toast('定位失败, 请手动选择提货点!')
createOrder(); },
} complete: (res) => {
// 订单相关 myAddressInfo.value.long = res.longitude || "";
const cartList = ref([]); myAddressInfo.value.lat = res.latitude || "";
const orderInfo = ref({}); getMerchantList();
const checkOrder = () => { }
checkOrderApi({ })
cart_id: cartStore.cartList }
}).then(res => { // LoadAddress();
cartList.value = res.data.cart_list;
orderInfo.value = res.data.order;
})
}
const createOrder = () => {
createOrderApi({
cart_id: cartStore.cartList,
address_id: addressInfo.value.address_id,
mer_id: shopInfo.value.mer_id,
pay_type: 1
}).then(res => {
if (!res.data?.nonceStr) return uni.$u.toast('支付失败!');
uni.requestPayment({
provider: 'wxpay',
timeStamp: res.data.timeStamp,
nonceStr: res.data.nonceStr,
package: res.data.package,
signType: res.data.signType,
paySign: res.data.paySign,
success: (e) => {
if (e.errMsg == 'requestPayment:ok') {
uni.showModal({
title: '订单支付成功',
confirmText: '查看订单',
cancelText: '继续购买',
success: (e) => {
if (e.confirm) uni.redirectTo({
url: '/pagesOrder/order/order?back=-1&type=2'
})
else uni.navigateBack();
}
})
} else uni.$u.toast('支付失败')
},
fail: (e) => {
uni.$u.toast('用户取消支付');
uni.redirectTo({
url: '/pagesOrder/order/order?back=-1&type=1'
})
}
})
}).catch(err => {
uni.$u.toast('网络错误')
})
}
const c_price = (price, index = 0) => { const changeShop = (e) => {
price = price + ''; shopInfo.value = e;
return price.split('.')[index] || (index ? '00' : '0'); shopListShow.value = false;
} }
const searchShop = (e) => {
getMerchantList(e)
}
onLoad(options => { // 拨打电话
checkOrder(); // const callShow = ref(false)
}) // const phone = ref('');
onShow(() => { // const callphone = (e) => {
getAddressList(); // callShow.value = true;
}) // phone.value = e;
// }
const onCall = (e) => {
uni.makePhoneCall({
phoneNumber: e,
success() {
callShow.value = false
}
})
}
// 选择地址
const addAddress = () => {
toastAddressShow.value = false;
nextTick(() => {
showAddress.value = true;
})
}
// 继续支付
const goPay = () => {
toastAddressShow.value = false;
isAddress.value = true;
submitOrder();
}
// 提交订单
const submitOrder = () => {
// if (!shopInfo.value.mer_id) {
// uni.$u.toast('请先选择提货点');
// return shopListShow.value = true;
// }
if (!isAddress.value) return toastAddressShow.value = true;
createOrder();
}
// 订单相关
const cartList = ref([]);
const orderInfo = ref({});
const checkOrder = () => {
checkOrderApi({
cart_id: cartStore.cartList
}).then(res => {
cartList.value = res.data.cart_list;
orderInfo.value = res.data.order;
})
}
const pay_type = ref(1);
const createOrder = () => {
createOrderApi({
cart_id: cartStore.cartList,
address_id: addressInfo.value.address_id,
mer_id: shopInfo.value.mer_id,
pay_type: 1,
store_id: 2
}).then(res => {
console.log(res);
if (pay_type.value == 3) {
if (res.code == 1) {
uni.showToast({
title: res.msg,
icon: "none",
success() {
setTimeout(() => {
uni.redirectTo({
url: '/pagesOrder/order/order?back=-1&type=2'
})
}, 1500)
}
})
} else {
uni.$u.toast(res.msg);
}
} else {
console.log(1);
if (!res.data?.nonceStr) return uni.$u.toast('支付失败!');
console.log(2);
uni.requestPayment({
provider: 'wxpay',
timeStamp: res.data.timeStamp,
nonceStr: res.data.nonceStr,
package: res.data.package,
signType: res.data.signType,
paySign: res.data.paySign,
success: (e) => {
if (e.errMsg == 'requestPayment:ok') {
uni.showModal({
title: '订单支付成功',
confirmText: '查看订单',
cancelText: '继续购买',
success: (e) => {
if (e.confirm) uni.redirectTo({
url: '/pagesOrder/order/order?back=-1&type=2'
})
else uni.navigateBack();
}
})
} else uni.$u.toast('支付失败')
},
fail: (e) => {
uni.$u.toast('用户取消支付');
uni.redirectTo({
url: '/pagesOrder/order/order?back=-1&type=1'
})
}
})
}
}).catch(err => {
uni.$u.toast('网络错误')
})
}
const c_price = (price, index = 0) => {
price = price + '';
return price.split('.')[index] || (index ? '00' : '0');
}
onLoad(options => {
checkOrder();
})
onShow(() => {
getAddressList();
})
</script> </script>
<style lang="scss"> <style lang="scss">
.m-card { .m-card {
margin: 20rpx; margin: 20rpx;
border-radius: 14rpx; border-radius: 14rpx;
background-color: #fff; background-color: #fff;
padding: 20rpx; padding: 20rpx;
} }
.row { .row {
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
} }
.m-address { .m-address {
margin-bottom: 20rpx; margin-bottom: 20rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
color: #999999; color: #999999;
.address-info { .address-info {
width: 510rpx; width: 510rpx;
.top { .top {
display: flex; display: flex;
font-size: 28rpx; font-size: 28rpx;
.t-name { .t-name {
color: #444; color: #444;
margin: 0 10rpx; margin: 0 10rpx;
} }
} }
.bottom { .bottom {
font-size: 24rpx; font-size: 24rpx;
} }
} }
} }
.m-good { .m-good {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 20rpx; margin-bottom: 20rpx;
.image { .image {
width: 160rpx; width: 160rpx;
height: 160rpx; height: 160rpx;
margin-right: 20rpx; margin-right: 20rpx;
border-radius: 14rpx; border-radius: 14rpx;
overflow: hidden; overflow: hidden;
} }
.body-content { .body-content {
width: 490rpx; width: 490rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
color: #989898; color: #989898;
.title { .title {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-size: 28rpx; font-size: 28rpx;
color: #444; color: #444;
} }
.tips { .tips {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-size: 24rpx; font-size: 24rpx;
margin-top: 10rpx; margin-top: 10rpx;
} }
.time { .time {
background-color: #F6F6F6; background-color: #F6F6F6;
padding: 5rpx 10rpx; padding: 5rpx 10rpx;
font-size: 26rpx; font-size: 26rpx;
color: #444; color: #444;
border-radius: 10rpx; border-radius: 10rpx;
} }
} }
} }
.good-info { .good-info {
margin-bottom: 20rpx; margin-bottom: 20rpx;
.head-title { .head-title {
margin-bottom: 18rpx; margin-bottom: 18rpx;
color: #000; color: #000;
font-weight: bold; font-weight: bold;
} }
.row { .row {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin-bottom: 18rpx; margin-bottom: 18rpx;
.red { .red {
color: #F55726; color: #F55726;
} }
.icon-text { .icon-text {
display: flex; display: flex;
} }
.icon { .icon {
image { image {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
} }
} }
} }
.row-need { .row-need {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
color: #F55726; color: #F55726;
} }
text { text {
font-size: 22rpx; font-size: 22rpx;
} }
} }
.order-remark { .order-remark {
.head-title { .head-title {
margin-bottom: 18rpx; margin-bottom: 18rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
} }
.tips { .tips {
font-size: 28rpx; font-size: 28rpx;
color: #999; color: #999;
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
flex: 1; flex: 1;
margin-right: 20rpx; margin-right: 20rpx;
.all { .all {
color: #F55726; color: #F55726;
} }
} }
</style> </style>

BIN
static/icon/done.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
static/icon/silver.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
static/icon/wait.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 860 B