This commit is contained in:
parent
1db31e0ed7
commit
91fb79033b
|
|
@ -29,5 +29,5 @@ export const frequentlyPurchaseApi = (data) => {
|
|||
|
||||
//购物车-零售购物车预检
|
||||
export const checkOrderApi = (data) => {
|
||||
return request.post('/order/RetailOrder/checkOrder', data);
|
||||
return request.post('/order/order/checkOrder', data);
|
||||
}
|
||||
48
api/order.js
48
api/order.js
|
|
@ -1,41 +1,57 @@
|
|||
import request from '@/utils/request';
|
||||
|
||||
//提交零售订单(支付一起)
|
||||
export const createOrderApi = (data)=>{
|
||||
return request.post('/order/RetailOrder/createOrder', data);
|
||||
export const createOrderApi = (data) => {
|
||||
return request.post('/order/order/createOrder', data);
|
||||
}
|
||||
|
||||
//订单列表
|
||||
export const orderListApi = (data)=>{
|
||||
return request.get('/order/retailOrder/order_list', data);
|
||||
export const orderListApi = (data) => {
|
||||
return request.get('/order/order/order_list', data);
|
||||
}
|
||||
|
||||
//订单详情
|
||||
export const orderDetailApi = (data)=>{
|
||||
return request.get('/order/RetailOrder/detail', data);
|
||||
export const orderDetailApi = (data) => {
|
||||
return request.get('/order/order/detail', data);
|
||||
}
|
||||
|
||||
//重新发起支付
|
||||
export const rePaymentApi = (data)=>{
|
||||
return request.post('/order/RetailOrder/Repayment', data);
|
||||
export const rePaymentApi = (data) => {
|
||||
return request.post('/order/order/Repayment', data);
|
||||
}
|
||||
|
||||
//订单数量统计
|
||||
export const orderCountApi = (data)=>{
|
||||
return request.post('/order/RetailOrder/order_count', data);
|
||||
export const orderCountApi = (data) => {
|
||||
return request.post('/order/order/order_count', data);
|
||||
}
|
||||
|
||||
//取消订单
|
||||
export const cancelOrderApi = (data)=>{
|
||||
return request.post('/order/RetailOrder/cancel_order', data);
|
||||
export const cancelOrderApi = (data) => {
|
||||
return request.post('/order/order/cancel_order', data);
|
||||
}
|
||||
|
||||
//订单确认收货
|
||||
export const confirmReceiptApi = (data)=>{
|
||||
return request.post('/order/RetailOrder/confirm_receipt', data);
|
||||
export const confirmReceiptApi = (data) => {
|
||||
return request.post('/order/order/confirm_receipt', data);
|
||||
}
|
||||
|
||||
//订单再次购买
|
||||
export const purchaseAgainApi = (data)=>{
|
||||
return request.get('/order/RetailOrder/purchase_again', data);
|
||||
export const purchaseAgainApi = (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
58
api/user.js
|
|
@ -1,57 +1,63 @@
|
|||
import request from '@/utils/request';
|
||||
|
||||
// 密码登录
|
||||
export const userLoginApi = (data)=>{
|
||||
return request.post('/login/account', data, {
|
||||
noAuth: true
|
||||
});
|
||||
export const userLoginApi = (data) => {
|
||||
return request.post('/login/account', data, {
|
||||
noAuth: true
|
||||
});
|
||||
}
|
||||
|
||||
// 微信登录
|
||||
export const userLoginWeixinApi = (data)=>{
|
||||
return request.post('/login/mnpLogin', data, {
|
||||
noAuth: true
|
||||
});
|
||||
export const userLoginWeixinApi = (data) => {
|
||||
return request.post('/login/mnpLogin', data, {
|
||||
noAuth: true
|
||||
});
|
||||
}
|
||||
|
||||
// 微信获取手机号
|
||||
export const getMobileByMnpApi = (data)=>{
|
||||
return request.post('/user/User/getMobileByMnp', data, {
|
||||
noAuth: true
|
||||
});
|
||||
export const getMobileByMnpApi = (data) => {
|
||||
return request.post('/user/User/getMobileByMnp', data, {
|
||||
noAuth: true
|
||||
});
|
||||
}
|
||||
|
||||
// 更新信息
|
||||
export const loginUpdateUserApi = (data)=>{
|
||||
return request.post('/login/updateUser', data);
|
||||
export const loginUpdateUserApi = (data) => {
|
||||
return request.post('/login/updateUser', data);
|
||||
}
|
||||
|
||||
// 添加地址
|
||||
export const addressCreateApi = (data)=>{
|
||||
return request.post('/user/address/create', data);
|
||||
export const addressCreateApi = (data) => {
|
||||
return request.post('/user/address/create', data);
|
||||
}
|
||||
|
||||
// 修改地址
|
||||
export const addressEditApi = (data)=>{
|
||||
return request.post('/user/address/edit', data);
|
||||
export const addressEditApi = (data) => {
|
||||
return request.post('/user/address/edit', data);
|
||||
}
|
||||
|
||||
// 删除地址
|
||||
export const addressDeleteApi = (data)=>{
|
||||
return request.post('/user/address/delete', data);
|
||||
export const addressDeleteApi = (data) => {
|
||||
return request.post('/user/address/delete', data);
|
||||
}
|
||||
|
||||
// 地址列表
|
||||
export const addressListsApi = (data)=>{
|
||||
return request.get('/user/address/lists', data);
|
||||
export const addressListsApi = (data) => {
|
||||
return request.get('/user/address/lists', data);
|
||||
}
|
||||
|
||||
// 地址详情
|
||||
export const addressDetailApi = (data)=>{
|
||||
return request.get('/user/address/detail', data);
|
||||
export const addressDetailApi = (data) => {
|
||||
return request.get('/user/address/detail', data);
|
||||
}
|
||||
|
||||
// 自提点列表
|
||||
export const merchantListApi = (data)=>{
|
||||
return request.get('/merchant/merchant/lists', data);
|
||||
export const merchantListApi = (data) => {
|
||||
return request.get('/merchant/merchant/lists', data);
|
||||
}
|
||||
|
||||
|
||||
// 充值
|
||||
export const rechargeApi = (data) => {
|
||||
return request.post('/user/user/recharge', data);
|
||||
}
|
||||
|
|
@ -1,19 +1,10 @@
|
|||
let BASE_URL
|
||||
import store from "@/store/user.js"
|
||||
// 环境
|
||||
// let env = "dev"
|
||||
// let env = "test"
|
||||
// let env = "prod"
|
||||
// let env = "local"
|
||||
let env = "liu";
|
||||
let env = "dev"
|
||||
// let env = "liu";
|
||||
|
||||
switch (env) {
|
||||
case 'prod':
|
||||
BASE_URL = 'https://erp.lihaink.cn';
|
||||
break;
|
||||
case 'test':
|
||||
BASE_URL = 'https://ceshi-erp.lihaink.cn';
|
||||
break;
|
||||
case 'liu':
|
||||
BASE_URL = 'http://192.168.1.201:8545';
|
||||
break;
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 191 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
|
|
@ -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">
|
||||
page {
|
||||
background: #FAFAFA;
|
||||
|
|
@ -20,6 +205,7 @@
|
|||
position: absolute;
|
||||
right: 28rpx;
|
||||
top: 50%;
|
||||
z-index: 11;
|
||||
transform: translateY(-50%);
|
||||
width: 110rpx;
|
||||
height: 52rpx;
|
||||
|
|
@ -33,7 +219,12 @@
|
|||
}
|
||||
|
||||
.multiple-card {
|
||||
padding-top: 24rpx;
|
||||
height: calc(100vh - 90rpx);
|
||||
padding-bottom: 12rpx;
|
||||
|
||||
.u-loadmore {
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.multiple-card-item {
|
||||
display: flex;
|
||||
|
|
@ -52,6 +243,9 @@
|
|||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
color: #444444;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.multiple-card-item-left-tag {
|
||||
|
|
@ -84,9 +278,10 @@
|
|||
|
||||
.multiple-card-item-left-info {
|
||||
display: flex;
|
||||
padding-right: 10rpx;
|
||||
|
||||
&:nth-child(1) {
|
||||
margin-bottom: 10rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
|
|
@ -104,6 +299,7 @@
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
|
||||
.multiple-card-item-right-distance {
|
||||
margin-bottom: 20rpx;
|
||||
|
|
@ -151,64 +347,3 @@
|
|||
}
|
||||
}
|
||||
</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>
|
||||
|
|
@ -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>
|
||||
.orderVerification {
|
||||
padding-top: 68rpx;
|
||||
|
|
@ -36,8 +157,6 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.scan {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -72,6 +191,7 @@
|
|||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
transition: opacity .3;
|
||||
}
|
||||
|
||||
::v-deep .u-popup__content {
|
||||
|
|
@ -150,7 +270,6 @@
|
|||
.popup-goods-total-num {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
|
||||
}
|
||||
|
||||
.popup-goods-total-price {
|
||||
|
|
@ -164,63 +283,3 @@
|
|||
}
|
||||
}
|
||||
</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>
|
||||
|
|
@ -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>
|
||||
|
|
@ -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">
|
||||
.detail {
|
||||
width: 710rpx;
|
||||
|
|
@ -74,46 +158,29 @@
|
|||
|
||||
.popup-goods-total {
|
||||
text-align: right;
|
||||
margin-bottom: 50rpx;
|
||||
|
||||
.popup-goods-total-num {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
color: #20B128;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-goods-total-price {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
.batch-write {
|
||||
display: flex;
|
||||
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>
|
||||
|
||||
<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>
|
||||
|
|
@ -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">
|
||||
page {
|
||||
background: #FAFAFA;
|
||||
|
|
@ -20,6 +225,7 @@
|
|||
position: absolute;
|
||||
right: 28rpx;
|
||||
top: 50%;
|
||||
z-index: 10;
|
||||
transform: translateY(-50%);
|
||||
width: 110rpx;
|
||||
height: 52rpx;
|
||||
|
|
@ -33,6 +239,7 @@
|
|||
}
|
||||
|
||||
.order-list {
|
||||
position: relative;
|
||||
padding-top: 24rpx;
|
||||
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 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -127,65 +360,3 @@
|
|||
}
|
||||
}
|
||||
</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
54
pages.json
|
|
@ -9,6 +9,13 @@
|
|||
}
|
||||
},
|
||||
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
|
||||
{
|
||||
"path": "pages/member/member",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员充值",
|
||||
"enablePullDownRefresh": false,
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
|
|
@ -21,51 +28,34 @@
|
|||
"bounce": "none"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/test",
|
||||
"style": {
|
||||
"navigationBarTitleText": "购物",
|
||||
"disableScroll": true,
|
||||
"enablePullDownRefresh": false,
|
||||
"app-plus": {
|
||||
// 将回弹属性关掉
|
||||
"bounce": "none"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
}, {
|
||||
"path": "pages/login/login",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登录",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
// "navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
}, {
|
||||
"path": "pages/cart/cart",
|
||||
"style": {
|
||||
"navigationBarTitleText": "购物车",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
}, {
|
||||
"path": "pages/code/code",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}, {
|
||||
"path": "pages/my/my",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人中心",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/code/code",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
|
||||
],
|
||||
"subPackages": [{
|
||||
"root": "multipleShop",
|
||||
|
|
@ -80,7 +70,8 @@
|
|||
"path": "verificationOrder/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "核销订单",
|
||||
"enablePullDownRefresh": false
|
||||
"enablePullDownRefresh": false,
|
||||
"disableScroll": true
|
||||
}
|
||||
}, {
|
||||
"path": "verificationOrder/detail",
|
||||
|
|
@ -194,10 +185,7 @@
|
|||
}
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
],
|
||||
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "",
|
||||
|
|
|
|||
|
|
@ -1,453 +1,462 @@
|
|||
<template>
|
||||
<view class="wrap">
|
||||
<up-navbar placeholder :autoBack="true">
|
||||
<template #center>
|
||||
<view style="display: flex;align-items: center;width: 100%;justify-content: flex-start;margin-left: 100rpx;">
|
||||
<view class="tabs" :class="{'tabs-active': tabsActive==index}" v-for="(item, index) in list" :key="index"
|
||||
@click="changeTab(index)">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</up-navbar>
|
||||
<view class="wrap">
|
||||
<up-navbar placeholder :autoBack="true">
|
||||
<template #center>
|
||||
<view
|
||||
style="display: flex;align-items: center;width: 100%;justify-content: flex-start;margin-left: 100rpx;">
|
||||
<view class="tabs" :class="{'tabs-active': tabsActive==index}" v-for="(item, index) in list"
|
||||
:key="index" @click="changeTab(index)">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</up-navbar>
|
||||
|
||||
<swiper class="swiper-box" :current="swiperCurrent" @animationfinish="animationfinish">
|
||||
<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%;">
|
||||
<view class="page-box1" style="padding-top: 60rpx;">
|
||||
<view class="total">
|
||||
<view>共计<text style="color: #20B128;">{{cartList.length}}</text>件</view>
|
||||
<view v-if="!isAdmin" @click="isAdmin=true;">管理</view>
|
||||
<view v-else @click="isAdmin=false;">完成</view>
|
||||
</view>
|
||||
<view v-if="cartList.length>0" class="list">
|
||||
<view class="shop-item" v-for="(item, index) in cartList" :key="index" @click="openGoodPopup(item)">
|
||||
<view class="shop-check" @click.stop="checkItem(item, !item.check)">
|
||||
<image v-if="!item.check" src="@/static/icon/n-check.png"></image>
|
||||
<image v-else src="@/static/icon/check.png"></image>
|
||||
</view>
|
||||
<image class="shop-img" :src="item.imgs"></image>
|
||||
<view class="shop-content">
|
||||
<view class="title">
|
||||
<view class="name u-line-2">{{item.goods_name}}</view>
|
||||
<view class="tip u-line-1">{{item.unit_name}}</view>
|
||||
</view>
|
||||
<view class="price-btn">
|
||||
<view class="price">￥{{item.sell}}</view>
|
||||
<view class="btn">
|
||||
<view class="num">{{item.cart_num}}</view>
|
||||
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else style="margin-top: 100rpx;">
|
||||
<up-empty text="购物车空空如也"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y @refresherrefresh="refresherrefresh(2)" :refresher-triggered="triggered" refresher-enabled refresher-background="#F6F6F6" style="height: 100%;width: 100%;">
|
||||
<view class="page-box1">
|
||||
<view v-if="frequentlyList.length>0" class="list">
|
||||
<view class="shop-item" v-for="(item, index) in frequentlyList" :key="index" @click="openGoodPopup(item)">
|
||||
<image class="shop-img" :src="item.imgs"></image>
|
||||
<view class="shop-content" style="width: 490rpx;">
|
||||
<view class="title">
|
||||
<view class="name u-line-2">{{item.name}}</view>
|
||||
<!-- <view class="tip u-line-1">{{item.spec}}</view> -->
|
||||
<view class="tip u-line-1">{{item.unit_name}}</view>
|
||||
</view>
|
||||
<view class="price-btn">
|
||||
<view class="price">￥{{item.sell}}</view>
|
||||
<view class="btn">
|
||||
<up-button size="small" plain color="#20b128" shape="circle">加入购物车</up-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else style="margin-top: 100rpx;">
|
||||
<up-empty text="没有常买的商品"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<swiper class="swiper-box" :current="swiperCurrent" @animationfinish="animationfinish">
|
||||
<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%;">
|
||||
<view class="page-box1" style="padding-top: 60rpx;">
|
||||
<view class="total">
|
||||
<view>共计<text style="color: #20B128;">{{cartList.length}}</text>件</view>
|
||||
<view v-if="!isAdmin" @click="isAdmin=true;">管理</view>
|
||||
<view v-else @click="isAdmin=false;">完成</view>
|
||||
</view>
|
||||
<view v-if="cartList.length>0" class="list">
|
||||
<view class="shop-item" v-for="(item, index) in cartList" :key="index"
|
||||
@click="openGoodPopup(item)">
|
||||
<view class="shop-check" @click.stop="checkItem(item, !item.check)">
|
||||
<image v-if="!item.check" src="@/static/icon/n-check.png"></image>
|
||||
<image v-else src="@/static/icon/check.png"></image>
|
||||
</view>
|
||||
<image class="shop-img" :src="item.imgs"></image>
|
||||
<view class="shop-content">
|
||||
<view class="title">
|
||||
<view class="name u-line-2">{{item.goods_name}}</view>
|
||||
<view class="tip u-line-1">{{item.unit_name}}</view>
|
||||
</view>
|
||||
<view class="price-btn">
|
||||
<view class="price">￥{{item.sell}}</view>
|
||||
<view class="btn">
|
||||
<view class="num">{{item.cart_num}}</view>
|
||||
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else style="margin-top: 100rpx;">
|
||||
<up-empty text="购物车空空如也"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y @refresherrefresh="refresherrefresh(2)" :refresher-triggered="triggered"
|
||||
refresher-enabled refresher-background="#F6F6F6" style="height: 100%;width: 100%;">
|
||||
<view class="page-box1">
|
||||
<view v-if="frequentlyList.length>0" class="list">
|
||||
<view class="shop-item" v-for="(item, index) in frequentlyList" :key="index"
|
||||
@click="openGoodPopup(item)">
|
||||
<image class="shop-img" :src="item.imgs"></image>
|
||||
<view class="shop-content" style="width: 490rpx;">
|
||||
<view class="title">
|
||||
<view class="name u-line-2">{{item.name}}</view>
|
||||
<!-- <view class="tip u-line-1">{{item.spec}}</view> -->
|
||||
<view class="tip u-line-1">{{item.unit_name}}</view>
|
||||
</view>
|
||||
<view class="price-btn">
|
||||
<view class="price">￥{{item.sell}}</view>
|
||||
<view class="btn">
|
||||
<up-button size="small" plain color="#20b128"
|
||||
shape="circle">加入购物车</up-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else style="margin-top: 100rpx;">
|
||||
<up-empty text="没有常买的商品"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
|
||||
</view>
|
||||
<up-transition :show="tabsActive==0">
|
||||
<view class="fiexd-btn-box cart-btn">
|
||||
<view class="cart-check" @click="changeAll(checkAll===cartInfo.count)">
|
||||
<image v-if="checkAll!=cartInfo.count" src="@/static/icon/n-check.png"></image>
|
||||
<image v-else src="@/static/icon/check.png"></image>
|
||||
<text style="font-size: 24rpx;">全选</text>
|
||||
<text style="font-size: 24rpx;" v-if="checkAll">({{checkAll}})</text>
|
||||
</view>
|
||||
<view v-if="!isAdmin" class="btn-boxs">
|
||||
<view class="all-price">
|
||||
<view style="width: 80rpx;">合计:</view>
|
||||
<view class="price">
|
||||
<text style="font-size: 24rpx;">¥</text>
|
||||
<text style="font-size: 34rpx;">{{c_price0}}</text>
|
||||
<text style="font-size: 24rpx;">.{{c_price1}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 200rpx;">
|
||||
<up-button color="#20b128" shape="circle" :disabled="!checkAll" @click="settleAccounts">去结算<text
|
||||
v-if="checkAll">({{checkAll}})</text></up-button>
|
||||
</view>
|
||||
</view>
|
||||
<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;"><up-button @click="deleteCartList()" size="small" plain color="#989898"
|
||||
shape="circle">删除</up-button></view>
|
||||
</view>
|
||||
</view>
|
||||
</up-transition>
|
||||
<goodPopup ref="goodRef" :show="showGoodPopup" @close="showGoodPopup=false" @change="changeGood" />
|
||||
</view>
|
||||
<up-transition :show="tabsActive==0">
|
||||
<view class="fiexd-btn-box cart-btn">
|
||||
<view class="cart-check" @click="changeAll(checkAll===cartInfo.count)">
|
||||
<image v-if="checkAll!=cartInfo.count" src="@/static/icon/n-check.png"></image>
|
||||
<image v-else src="@/static/icon/check.png"></image>
|
||||
<text style="font-size: 24rpx;">全选</text>
|
||||
<text style="font-size: 24rpx;" v-if="checkAll">({{checkAll}})</text>
|
||||
</view>
|
||||
<view v-if="!isAdmin" class="btn-boxs">
|
||||
<view class="all-price">
|
||||
<view style="width: 80rpx;">合计:</view>
|
||||
<view class="price">
|
||||
<text style="font-size: 24rpx;">¥</text>
|
||||
<text style="font-size: 34rpx;">{{c_price0}}</text>
|
||||
<text style="font-size: 24rpx;">.{{c_price1}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 200rpx;">
|
||||
<up-button color="#20b128" shape="circle" :disabled="!checkAll" @click="settleAccounts">去结算<text
|
||||
v-if="checkAll">({{checkAll}})</text></up-button>
|
||||
</view>
|
||||
</view>
|
||||
<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;"><up-button @click="deleteCartList()" size="small" plain color="#989898"
|
||||
shape="circle">删除</up-button></view>
|
||||
</view>
|
||||
</view>
|
||||
</up-transition>
|
||||
<goodPopup ref="goodRef" :show="showGoodPopup" @close="showGoodPopup=false" @change="changeGood" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onShow
|
||||
} from "@dcloudio/uni-app"
|
||||
import {
|
||||
computed,
|
||||
ref,
|
||||
watch
|
||||
} from 'vue';
|
||||
import {
|
||||
cartListApi,
|
||||
cartChangeApi,
|
||||
cartCreateApi,
|
||||
cartDeleteApi,
|
||||
frequentlyPurchaseApi
|
||||
} from "@/api/cart.js"
|
||||
import goodPopup from "@/components/goodPopup.vue"
|
||||
import useCartStore from "@/store/cart.js"
|
||||
import {
|
||||
onShow
|
||||
} from "@dcloudio/uni-app"
|
||||
import {
|
||||
computed,
|
||||
ref,
|
||||
watch
|
||||
} from 'vue';
|
||||
import {
|
||||
cartListApi,
|
||||
cartChangeApi,
|
||||
cartCreateApi,
|
||||
cartDeleteApi,
|
||||
frequentlyPurchaseApi
|
||||
} from "@/api/cart.js"
|
||||
import goodPopup from "@/components/goodPopup.vue"
|
||||
import useCartStore from "@/store/cart.js"
|
||||
|
||||
const cartStore = useCartStore();
|
||||
const cartStore = useCartStore();
|
||||
|
||||
// 创建响应式数据
|
||||
const list = ref(['购物车', '常买']);
|
||||
const tabsActive = ref(0)
|
||||
// 定义方法
|
||||
const changeTab = (e) => {
|
||||
tabsActive.value = e;
|
||||
swiperCurrent.value = e;
|
||||
}
|
||||
// 创建响应式数据
|
||||
const list = ref(['购物车', '常买']);
|
||||
const tabsActive = ref(0)
|
||||
// 定义方法
|
||||
const changeTab = (e) => {
|
||||
tabsActive.value = e;
|
||||
swiperCurrent.value = e;
|
||||
}
|
||||
|
||||
const swiperCurrent = ref(0);
|
||||
const animationfinish = ({
|
||||
detail: {
|
||||
current
|
||||
}
|
||||
}) => {
|
||||
swiperCurrent.value = current;
|
||||
tabsActive.value = current;
|
||||
if (swiperCurrent.value == 1) getFrequentlyPurchase();
|
||||
}
|
||||
const swiperCurrent = ref(0);
|
||||
const animationfinish = ({
|
||||
detail: {
|
||||
current
|
||||
}
|
||||
}) => {
|
||||
swiperCurrent.value = current;
|
||||
tabsActive.value = current;
|
||||
if (swiperCurrent.value == 1) getFrequentlyPurchase();
|
||||
}
|
||||
|
||||
// 结算
|
||||
const settleAccounts = () => {
|
||||
let list = [];
|
||||
cartList.value.forEach(item => {
|
||||
if (item.check) list.push(item.cart_id);
|
||||
})
|
||||
cartStore.setCartList(list);
|
||||
uni.navigateTo({
|
||||
url: '/pagesOrder/settle/settle'
|
||||
})
|
||||
}
|
||||
// 删除
|
||||
const deleteCartList = () => {
|
||||
let list = [];
|
||||
if(!cartList.value.length) return uni.showToast({ title: '请选择商品', icon: 'none' });
|
||||
cartList.value.forEach(item => {
|
||||
if (item.check) list.push(item.cart_id);
|
||||
})
|
||||
cartDeleteApi({
|
||||
cart_id: list
|
||||
}).then(() => {
|
||||
getcartList(false);
|
||||
})
|
||||
}
|
||||
// 结算
|
||||
const settleAccounts = () => {
|
||||
let list = [];
|
||||
cartList.value.forEach(item => {
|
||||
if (item.check) list.push(item.id);
|
||||
})
|
||||
cartStore.setCartList(list);
|
||||
uni.navigateTo({
|
||||
url: '/pagesOrder/settle/settle'
|
||||
})
|
||||
}
|
||||
// 删除
|
||||
const deleteCartList = () => {
|
||||
let list = [];
|
||||
if (!cartList.value.length) return uni.showToast({
|
||||
title: '请选择商品',
|
||||
icon: 'none'
|
||||
});
|
||||
cartList.value.forEach(item => {
|
||||
if (item.check) list.push(item.cart_id);
|
||||
})
|
||||
cartDeleteApi({
|
||||
cart_id: list
|
||||
}).then(() => {
|
||||
getcartList(false);
|
||||
})
|
||||
}
|
||||
|
||||
// 购物车相关
|
||||
const addCart = (id, cart_num) => { //加入购物车
|
||||
cartCreateApi({
|
||||
cart_num: +cart_num,
|
||||
goods_id: id
|
||||
}).then(res => {
|
||||
getcartList();
|
||||
})
|
||||
}
|
||||
const isAdmin = ref(false); //是否管理
|
||||
// 购物车相关
|
||||
const addCart = (id, cart_num) => { //加入购物车
|
||||
cartCreateApi({
|
||||
cart_num: +cart_num,
|
||||
goods_id: id
|
||||
}).then(res => {
|
||||
getcartList();
|
||||
})
|
||||
}
|
||||
const isAdmin = ref(false); //是否管理
|
||||
|
||||
|
||||
// 选择商品相关
|
||||
const showGoodPopup = ref(false);
|
||||
const goodRef = ref(null);
|
||||
const goodData = ref({});
|
||||
const openGoodPopup = (item) => { // 打开数量/重量弹窗
|
||||
goodData.value = JSON.parse(JSON.stringify(item));
|
||||
goodRef.value.setData(goodData.value);
|
||||
showGoodPopup.value = true;
|
||||
};
|
||||
const changeGood = (data) => { // 确定选择商品重量
|
||||
showGoodPopup.value = false;
|
||||
addCart(data.goods_id || data.id, data.cart_num);
|
||||
}
|
||||
// 选择商品相关
|
||||
const showGoodPopup = ref(false);
|
||||
const goodRef = ref(null);
|
||||
const goodData = ref({});
|
||||
const openGoodPopup = (item) => { // 打开数量/重量弹窗
|
||||
goodData.value = JSON.parse(JSON.stringify(item));
|
||||
goodRef.value.setData(goodData.value);
|
||||
showGoodPopup.value = true;
|
||||
};
|
||||
const changeGood = (data) => { // 确定选择商品重量
|
||||
showGoodPopup.value = false;
|
||||
addCart(data.goods_id || data.id, data.cart_num);
|
||||
}
|
||||
|
||||
const cartList = ref([]);
|
||||
const cartInfo = ref({});
|
||||
const getcartList = (check = true) => {
|
||||
cartListApi().then(res => {
|
||||
if (check) {
|
||||
res.data.lists = res.data.lists.map(item => {
|
||||
item.check = true;
|
||||
return item;
|
||||
})
|
||||
checkAll.value = res.data?.count || 0
|
||||
} else {
|
||||
checkAll.value = 0
|
||||
}
|
||||
cartList.value = res.data.lists;
|
||||
cartInfo.value = {
|
||||
total_price: res.data?.extend.total_price || '0.00',
|
||||
count: res.data?.count || 0
|
||||
}
|
||||
setTimeout(()=>{
|
||||
triggered.value = false;
|
||||
}, 300)
|
||||
})
|
||||
}
|
||||
const cartList = ref([]);
|
||||
const cartInfo = ref({});
|
||||
const getcartList = (check = true) => {
|
||||
cartListApi().then(res => {
|
||||
if (check) {
|
||||
res.data.lists = res.data.lists.map(item => {
|
||||
item.check = true;
|
||||
return item;
|
||||
})
|
||||
checkAll.value = res.data?.count || 0
|
||||
} else {
|
||||
checkAll.value = 0
|
||||
}
|
||||
cartList.value = res.data.lists;
|
||||
cartInfo.value = {
|
||||
total_price: res.data?.extend.total_price || '0.00',
|
||||
count: res.data?.count || 0
|
||||
}
|
||||
setTimeout(() => {
|
||||
triggered.value = false;
|
||||
}, 300)
|
||||
})
|
||||
}
|
||||
|
||||
const c_price0 = computed(() => {
|
||||
let price = cartInfo.value.total_price + '';
|
||||
return price.split('.')[0] || '0';
|
||||
})
|
||||
const c_price1 = computed(() => {
|
||||
let price = cartInfo.value.total_price + '';
|
||||
return price.split('.')[1] || '00';
|
||||
})
|
||||
const c_price0 = computed(() => {
|
||||
let price = cartInfo.value.total_price + '';
|
||||
return price.split('.')[0] || '0';
|
||||
})
|
||||
const c_price1 = computed(() => {
|
||||
let price = cartInfo.value.total_price + '';
|
||||
return price.split('.')[1] || '00';
|
||||
})
|
||||
|
||||
// 选中
|
||||
let checkAll = ref(0)
|
||||
const checkItem = (item, type) => {
|
||||
item.check = type;
|
||||
let price = Number(cartInfo.value.total_price);
|
||||
if (type) {
|
||||
price += item.sell * item.cart_num;
|
||||
checkAll.value++;
|
||||
} else {
|
||||
price -= item.sell * item.cart_num;
|
||||
checkAll.value--;
|
||||
}
|
||||
cartInfo.value.total_price = price.toFixed(2);
|
||||
}
|
||||
const changeAll = (flag = false) => {
|
||||
let count = 0;
|
||||
cartList.value.forEach(item => {
|
||||
item.check = !flag;
|
||||
if (!flag) count += item.sell * item.cart_num;
|
||||
})
|
||||
if (!flag) {
|
||||
checkAll.value = cartInfo.value.count;
|
||||
} else {
|
||||
checkAll.value = 0;
|
||||
}
|
||||
cartInfo.value.total_price = count.toFixed(2);
|
||||
}
|
||||
// 选中
|
||||
let checkAll = ref(0)
|
||||
const checkItem = (item, type) => {
|
||||
item.check = type;
|
||||
let price = Number(cartInfo.value.total_price);
|
||||
if (type) {
|
||||
price += item.sell * item.cart_num;
|
||||
checkAll.value++;
|
||||
} else {
|
||||
price -= item.sell * item.cart_num;
|
||||
checkAll.value--;
|
||||
}
|
||||
cartInfo.value.total_price = price.toFixed(2);
|
||||
}
|
||||
const changeAll = (flag = false) => {
|
||||
let count = 0;
|
||||
cartList.value.forEach(item => {
|
||||
item.check = !flag;
|
||||
if (!flag) count += item.sell * item.cart_num;
|
||||
})
|
||||
if (!flag) {
|
||||
checkAll.value = cartInfo.value.count;
|
||||
} else {
|
||||
checkAll.value = 0;
|
||||
}
|
||||
cartInfo.value.total_price = count.toFixed(2);
|
||||
}
|
||||
|
||||
// 常买记录
|
||||
const frequentlyList = ref([]);
|
||||
const where = ref({
|
||||
page_no: 1,
|
||||
page_size: 25
|
||||
})
|
||||
const getFrequentlyPurchase = () => {
|
||||
frequentlyPurchaseApi({
|
||||
...where.value
|
||||
}).then(res => {
|
||||
frequentlyList.value = res.data;
|
||||
setTimeout(()=>{
|
||||
triggered.value = false;
|
||||
}, 300)
|
||||
})
|
||||
}
|
||||
// 常买记录
|
||||
const frequentlyList = ref([]);
|
||||
const where = ref({
|
||||
page_no: 1,
|
||||
page_size: 25
|
||||
})
|
||||
const getFrequentlyPurchase = () => {
|
||||
frequentlyPurchaseApi({
|
||||
...where.value
|
||||
}).then(res => {
|
||||
frequentlyList.value = res.data;
|
||||
setTimeout(() => {
|
||||
triggered.value = false;
|
||||
}, 300)
|
||||
})
|
||||
}
|
||||
|
||||
const triggered = ref(false);
|
||||
const refresherrefresh = (type=1)=>{
|
||||
triggered.value = true;
|
||||
if(type==1) getcartList();
|
||||
if(type==2) getFrequentlyPurchase();
|
||||
}
|
||||
const triggered = ref(false);
|
||||
const refresherrefresh = (type = 1) => {
|
||||
triggered.value = true;
|
||||
if (type == 1) getcartList();
|
||||
if (type == 2) getFrequentlyPurchase();
|
||||
}
|
||||
|
||||
onShow(() => {
|
||||
getcartList();
|
||||
})
|
||||
onShow(() => {
|
||||
getcartList();
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.tabs {
|
||||
color: #444444;
|
||||
font-size: 32rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.tabs {
|
||||
color: #444444;
|
||||
font-size: 32rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.tabs-active {
|
||||
color: #20B128;
|
||||
// font-size: 34rpx;
|
||||
transition: 300ms;
|
||||
}
|
||||
.tabs-active {
|
||||
color: #20B128;
|
||||
// font-size: 34rpx;
|
||||
transition: 300ms;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh - var(--window-top));
|
||||
width: 100%;
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
.wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh - var(--window-top));
|
||||
width: 100%;
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
|
||||
.swiper-box {
|
||||
flex: 1;
|
||||
}
|
||||
.swiper-box {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.page-box1 {
|
||||
position: relative;
|
||||
.page-box1 {
|
||||
position: relative;
|
||||
|
||||
.total {
|
||||
padding: 0 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
top: var(--window-top);
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
font-size: 26rpx;
|
||||
color: #444;
|
||||
}
|
||||
.total {
|
||||
padding: 0 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
top: var(--window-top);
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
font-size: 26rpx;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.list {
|
||||
margin: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
.list {
|
||||
margin: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.shop-item {
|
||||
padding: 20rpx;
|
||||
border-bottom: 1rpx solid #f6f6f6;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
.shop-item {
|
||||
padding: 20rpx;
|
||||
border-bottom: 1rpx solid #f6f6f6;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
|
||||
.shop-check {
|
||||
width: 60rpx;
|
||||
height: 120rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.shop-check {
|
||||
width: 60rpx;
|
||||
height: 120rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.shop-img {
|
||||
height: 120rpx;
|
||||
width: 120rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 14rpx;
|
||||
}
|
||||
.shop-img {
|
||||
height: 120rpx;
|
||||
width: 120rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 14rpx;
|
||||
}
|
||||
|
||||
.shop-content {
|
||||
width: 430rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
.shop-content {
|
||||
width: 430rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.title {
|
||||
.name {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.title {
|
||||
.name {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.tip {
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
margin: 12rpx 0;
|
||||
}
|
||||
}
|
||||
.tip {
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
margin: 12rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #F55726;
|
||||
}
|
||||
.price {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #F55726;
|
||||
}
|
||||
|
||||
.price-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.price-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.num {
|
||||
margin: 0 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.num {
|
||||
margin: 0 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cart-btn {
|
||||
.cart-btn {
|
||||
|
||||
.cart-check {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.cart-check {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
}
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-boxs {
|
||||
display: flex;
|
||||
.btn-boxs {
|
||||
display: flex;
|
||||
|
||||
.all-price {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 20rpx;
|
||||
.all-price {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 20rpx;
|
||||
|
||||
.price {
|
||||
color: #20B128;
|
||||
display: table-cell;
|
||||
vertical-align: bottom;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.price {
|
||||
color: #20B128;
|
||||
display: table-cell;
|
||||
vertical-align: bottom;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -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>
|
||||
|
|
@ -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>
|
||||
|
|
@ -181,8 +181,6 @@
|
|||
import useUserStore from "@/store/user";
|
||||
const userStore = useUserStore();
|
||||
|
||||
|
||||
|
||||
const test = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pageQuota/quotation/index'
|
||||
|
|
@ -190,9 +188,6 @@
|
|||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*商品列表滚动隐藏头部导航 */
|
||||
const instance = getCurrentInstance(); // 获取组件实例
|
||||
const targetHeight = ref(0)
|
||||
|
|
@ -202,10 +197,9 @@
|
|||
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);
|
||||
|
|
@ -241,7 +235,9 @@
|
|||
cartCreateApi({
|
||||
cart_num: cart_num,
|
||||
is_new: 0, // 是否直接购买0否1是
|
||||
goods_id: id
|
||||
// goods_id: id,
|
||||
store_id: where.value.store_id,
|
||||
product_id: id
|
||||
}).then(res => {
|
||||
getCartList();
|
||||
}).catch(err => {
|
||||
|
|
@ -267,7 +263,8 @@
|
|||
page_no: 1,
|
||||
page_size: 25,
|
||||
name: '',
|
||||
order: ''
|
||||
order: '',
|
||||
store_id: '2'
|
||||
})
|
||||
const loading = ref(true);
|
||||
const goodList = ref([]);
|
||||
|
|
@ -384,6 +381,7 @@
|
|||
}
|
||||
|
||||
const navTo = (url) => {
|
||||
// if (!userStore.token || !userStore.userInfo.mobile) return uni.showModal({
|
||||
if (!userStore.token) return uni.showModal({
|
||||
content: '您需要先登录才可使用该功能, 是否前去登录',
|
||||
success: (e) => {
|
||||
|
|
@ -429,7 +427,10 @@
|
|||
userStore.setUserInfo({});
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
console.log(data);
|
||||
addCart(data.id, data.cart_num);
|
||||
}
|
||||
// 结算
|
||||
|
|
@ -453,18 +454,20 @@
|
|||
total_price: res.data?.extend?.total_price || '0.00',
|
||||
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);
|
||||
getGoodList();
|
||||
|
||||
})
|
||||
|
||||
onShow(() => {
|
||||
getCartList();
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
const instance = getCurrentInstance(); // 获取组件实例
|
||||
const getWXDom = () => {
|
||||
|
|
|
|||
|
|
@ -1,127 +1,349 @@
|
|||
<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">
|
||||
.detail {
|
||||
width: 710rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
margin: 24rpx auto 0;
|
||||
padding: 0 30rpx 24rpx;
|
||||
box-sizing: border-box;
|
||||
page {
|
||||
background: #FAFAFA;
|
||||
}
|
||||
|
||||
.detail-order_num {
|
||||
height: 78rpx;
|
||||
line-height: 78rpx;
|
||||
margin-bottom: 24rpx;
|
||||
font-weight: 600;
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
border-bottom: 2rpx solid #f1f1f1;
|
||||
}
|
||||
.multiple {
|
||||
padding-bottom: 30rpx;
|
||||
|
||||
.detail-form {
|
||||
border-bottom: 2rpx solid #f1f1f1;
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
.detail-form-item {
|
||||
margin-bottom: 16rpx;
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-goods {
|
||||
.multiple-search {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 630rpx;
|
||||
border-radius: 16rpx;
|
||||
margin-bottom: 20rpx;
|
||||
padding-bottom: 1rpx;
|
||||
height: 90rpx;
|
||||
background-color: #fff;
|
||||
padding: 0 24rpx;
|
||||
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;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-goods-total {
|
||||
text-align: right;
|
||||
.multiple-card {
|
||||
height: calc(100vh - 90rpx);
|
||||
padding-bottom: 12rpx;
|
||||
|
||||
.popup-goods-total-num {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
.u-loadmore {
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.popup-goods-total-price {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
.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>
|
||||
|
||||
<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>
|
||||
|
|
@ -132,6 +132,7 @@
|
|||
|
||||
const showWeixin = ref(true); //是否显示微信登录
|
||||
const isAgree = ref(false); //是否同意协议
|
||||
const tempUser = ref(null);
|
||||
|
||||
const weixinLogin = () => {
|
||||
if (!isAgree.value) return uni.$u.toast('请先阅读并同意协议');
|
||||
|
|
@ -146,9 +147,12 @@
|
|||
}).then(res => {
|
||||
uni.hideLoading();
|
||||
userStore.setToken(res.data.token);
|
||||
userStore.setUserInfo(res.data);
|
||||
|
||||
if (!res.data.mobile) { //未绑定手机号
|
||||
tempUser.value = res.data;
|
||||
return showBind.value = true;
|
||||
} else {
|
||||
userStore.setUserInfo(res.data);
|
||||
}
|
||||
navToIndex();
|
||||
})
|
||||
|
|
@ -167,7 +171,20 @@
|
|||
getMobileByMnpApi({
|
||||
code: e.detail.code
|
||||
}).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 {
|
||||
console.log("用户拒绝授权");
|
||||
|
|
|
|||
|
|
@ -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
182
pages/my/my.vue
|
|
@ -1,16 +1,54 @@
|
|||
<template>
|
||||
<view>
|
||||
<up-navbar title="我的" bgColor="rgba(0,0,0,0)" :autoBack="true">
|
||||
<up-navbar title="我的" :autoBack="true" bgColor="transparent" :fixed="true">
|
||||
</up-navbar>
|
||||
<view class="user-info">
|
||||
<image class="bg" src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/e3a7b202404261113002322.webp"
|
||||
mode="widthFix"></image>
|
||||
<view class="u-card">
|
||||
<up-avatar :src="userInfo.avatar" size="80"></up-avatar>
|
||||
<view class="content">
|
||||
<view class="u-phone">{{userInfo.nickname}}</view>
|
||||
<view class="u-id">ID: {{userInfo.id}}</view>
|
||||
<view style="display: flex;margin-bottom: 44rpx;">
|
||||
<up-avatar :src="userInfo.avatar" size="56"></up-avatar>
|
||||
<view class="content">
|
||||
<view class="u-phone">{{userInfo.nickname}}</view>
|
||||
<view class="u-id">ID: {{userInfo.id}}</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>
|
||||
|
||||
|
|
@ -24,16 +62,21 @@
|
|||
<view class="">待付款</view>
|
||||
<view class="badge" v-if="orderCount.no_pay">{{orderCount.no_pay}}</view>
|
||||
</view>
|
||||
|
||||
<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>
|
||||
<view class="">待收货</view>
|
||||
<view class="">待核销</view>
|
||||
<view class="badge" v-if="orderCount.receiving">{{orderCount.receiving}}</view>
|
||||
</view>
|
||||
<!-- <view class="list-item">
|
||||
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/96915202404261403582769.png"></image>
|
||||
<view class="">售后/退款</view>
|
||||
</view> -->
|
||||
|
||||
<view class="list-item" @click="navTo(2)">
|
||||
<image src="/static/icon/done.webp">
|
||||
</image>
|
||||
<view class="">已核销</view>
|
||||
<view class="badge" v-if="orderCount.receiving">{{orderCount.receiving}}</view>
|
||||
</view>
|
||||
|
||||
<view class="list-item" @click="navTo()">
|
||||
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/abdcd202404261406199643.png">
|
||||
</image>
|
||||
|
|
@ -45,8 +88,8 @@
|
|||
|
||||
<view class="card">
|
||||
<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="/pageQuota/Balance/index"></up-cell> -->
|
||||
</up-cell-group>
|
||||
</view>
|
||||
|
||||
|
|
@ -102,7 +145,7 @@
|
|||
}
|
||||
|
||||
onShow(() => {
|
||||
userInfo.value = userStore.userInfo;
|
||||
userInfo.value = userStore.userInfo;
|
||||
getOrderCount();
|
||||
})
|
||||
</script>
|
||||
|
|
@ -112,7 +155,7 @@
|
|||
overflow: hidden;
|
||||
position: relative;
|
||||
width: 750rpx;
|
||||
height: 450rpx;
|
||||
height: 436rpx;
|
||||
/* #ifdef H5 */
|
||||
height: 350rpx;
|
||||
/* #endif */
|
||||
|
|
@ -128,9 +171,8 @@
|
|||
.u-card {
|
||||
box-sizing: border-box;
|
||||
padding: 50rpx 0 50rpx 50rpx;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
bottom: 50rpx;
|
||||
top: 100rpx;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
|
||||
|
|
@ -150,33 +192,115 @@
|
|||
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 {
|
||||
margin: 20rpx;
|
||||
height: 140rpx;
|
||||
position: relative;
|
||||
|
||||
.order-info {
|
||||
height: 220rpx;
|
||||
width: 710rpx;
|
||||
background-color: #fff;
|
||||
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-size: 35% 100%;
|
||||
background-size: 28% 100%;
|
||||
background-position: right;
|
||||
background-repeat: no-repeat;
|
||||
margin: 0 auto;
|
||||
padding: 28rpx 0 40rpx 0;
|
||||
|
||||
.info-head {
|
||||
margin-left: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
margin: 0 0 30rpx 30rpx;
|
||||
}
|
||||
|
||||
.info-list {
|
||||
|
|
|
|||
|
|
@ -4,29 +4,29 @@
|
|||
还剩<text>{{countDown}}</text>订单自动取消
|
||||
</view>
|
||||
<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 style="color: #333;display: flex;align-items: center;">
|
||||
<up-icon name="map"></up-icon>
|
||||
<text style="margin: 0 10rpx;">自提点</text>
|
||||
</view>
|
||||
<view v-if="shopInfo.mer_id">
|
||||
<view style="color: #333;">
|
||||
{{shopInfo.mer_name}}
|
||||
<text v-if="shopInfo.recommend"
|
||||
style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text>
|
||||
</view>
|
||||
<view style="font-size: 24rpx;color: #333;">
|
||||
{{shopInfo.mer_address}}
|
||||
</view>
|
||||
<view>
|
||||
<view v-if="shopInfo.service_phone">
|
||||
<text style="margin-right: 10rpx;">{{shopInfo.real_name||shopInfo.mer_real_name}}</text>
|
||||
<text>{{shopInfo.service_phone}}</text>
|
||||
</view>
|
||||
<text v-if="shopInfo.distance"
|
||||
style="color: #20b128;font-size: 22rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text>
|
||||
</view>
|
||||
<view v-if="shopInfo.id">
|
||||
<view style="color: #333;">
|
||||
{{shopInfo.name}}
|
||||
<!-- <text v-if="shopInfo.recommend"
|
||||
style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text> -->
|
||||
</view>
|
||||
<view style="font-size: 24rpx;color: #333;">
|
||||
{{shopInfo.detailed_address}}
|
||||
</view>
|
||||
<view>
|
||||
<view v-if="shopInfo.phone">
|
||||
<text style="margin-right: 10rpx;">{{shopInfo.name||shopInfo.mer_real_name}}</text>
|
||||
<text>{{shopInfo.phone}}</text>
|
||||
</view>
|
||||
<!-- <text v-if="shopInfo.distance"
|
||||
style="color: #20b128;font-size: 22rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -65,29 +65,34 @@
|
|||
</view>
|
||||
<view class="m-card m-good" v-for="(item,index) in datas.goods_list" :key="index">
|
||||
<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 class="body-content">
|
||||
<view>
|
||||
<view class="title">
|
||||
<view>{{item.class_name}}</view>
|
||||
<view>¥{{item.sell}}</view>
|
||||
<view>{{item.store_name}}</view>
|
||||
<view>¥{{item.price}}</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view>{{}}</view>
|
||||
<view>x{{item.nums}}{{item.unit_name}}</view>
|
||||
</view>
|
||||
<view class="time">
|
||||
{{item.msg}}
|
||||
</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 v-if="datas.goods_list" class="row">
|
||||
<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 class="row">
|
||||
<view>运费</view>
|
||||
|
|
@ -95,8 +100,8 @@
|
|||
</view>
|
||||
<view class="row-need">
|
||||
<view style="margin-right: 10rpx;">需付款</view>
|
||||
<view v-if="datas.total">
|
||||
<text>¥</text>{{c_price(datas.total, 0)}}<text>.{{c_price(datas.total, 1)}}</text>
|
||||
<view v-if="datas.pay_price">
|
||||
<text>¥</text>{{c_price(datas.pay_price, 0)}}<text>.{{c_price(datas.pay_price, 1)}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -105,8 +110,8 @@
|
|||
<block v-if="datas.paid==0">
|
||||
<view class="row">
|
||||
<view>订单编号</view>
|
||||
<up-copy :content="datas.number">
|
||||
<text>{{datas.number}} | 复制</text>
|
||||
<up-copy :content="datas.order_id">
|
||||
<text>{{datas.order_id}} | 复制</text>
|
||||
</up-copy>
|
||||
</view>
|
||||
<view class="row">
|
||||
|
|
@ -122,12 +127,13 @@
|
|||
<block v-else>
|
||||
<view v-if="datas.goods_list" class="row">
|
||||
<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 class="row">
|
||||
<view>订单编号</view>
|
||||
<up-copy :content="datas.number">
|
||||
<text>{{datas.number}} | 复制</text>
|
||||
<up-copy :content="datas.order_id">
|
||||
<text>{{datas.order_id}} | 复制</text>
|
||||
</up-copy>
|
||||
</view>
|
||||
<view class="row">
|
||||
|
|
@ -140,27 +146,27 @@
|
|||
</view>
|
||||
<view class="row" style="margin-bottom: 0;">
|
||||
<view>支付状态</view>
|
||||
<view v-if="datas.paid">已支付</view>
|
||||
<view v-if="datas.paid == 1">已支付</view>
|
||||
<view v-else class="red">待支付</view>
|
||||
</view>
|
||||
</block>
|
||||
</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">
|
||||
<view style="color: #777777;" @click="showCancel=true">取消订单</view>
|
||||
<view style="width: 450rpx;">
|
||||
<up-button color="#20B128" shape="circle" @click="rePay" :throttleTime="1000">立即支付
|
||||
¥{{datas.total}}</up-button>
|
||||
¥{{datas.pay_price}}</up-button>
|
||||
</view>
|
||||
</block>
|
||||
<block v-else>
|
||||
<view></view>
|
||||
<view style="width: 450rpx;">
|
||||
<up-button v-if="datas.status==0||datas.status==1" color="#20B128" shape="circle"
|
||||
@click="showTake=true">确认收货</up-button>
|
||||
<up-button v-else color="#20B128" plain shape="circle" @click="purchaseAgain">再次购买</up-button>
|
||||
<!-- <up-button v-if="datas.status==0||datas.status==1" color="#20B128" shape="circle"
|
||||
@click="showTake=true">确认收货</up-button> -->
|
||||
<up-button color="#20B128" plain shape="circle" @click="purchaseAgain">再次购买</up-button>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
|
|
@ -188,6 +194,7 @@
|
|||
import orderCanclePopup from "@/components/orderCanclePopup.vue";
|
||||
import shopListPopupVue from "@/components/shopListPopup.vue";
|
||||
import modal from "@/components/modal.vue";
|
||||
import QRCode from "@/uni_modules/uview-plus/components/u-qrcode/u-qrcode.vue";
|
||||
import {
|
||||
orderDetailApi,
|
||||
cancelOrderApi,
|
||||
|
|
@ -227,7 +234,8 @@
|
|||
order_id: datas.value.id
|
||||
}).then(res => {
|
||||
datas.value = res.data;
|
||||
shopInfo.value = res.data.merchant_info;
|
||||
|
||||
shopInfo.value = res.data.store_info;
|
||||
if (addressList.value.length > 0 && res.data.paid) {
|
||||
addressInfo.value = addressList.value.find(item => item.address_id == res.data.address_id);
|
||||
} else {
|
||||
|
|
@ -319,7 +327,7 @@
|
|||
}
|
||||
})
|
||||
}
|
||||
getMerchantList();
|
||||
// getMerchantList();
|
||||
// 定位
|
||||
const LoadAddress = () => {
|
||||
uni.getLocation({
|
||||
|
|
@ -445,7 +453,7 @@
|
|||
onLoad((option) => {
|
||||
uni.setNavigationBarTitle({
|
||||
title: option.type == 0 ? '等待付款' : '订单详情'
|
||||
})
|
||||
});
|
||||
if (option.id) {
|
||||
datas.value.id = option.id;
|
||||
getDetails()
|
||||
|
|
@ -480,6 +488,21 @@
|
|||
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 {
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
<view class="body-content">
|
||||
<view style="display: flex;flex: 1;flex-shrink: 0;">
|
||||
<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
|
||||
|
|
@ -23,7 +23,7 @@
|
|||
<up-icon name="arrow-right-double" color="#20B128"></up-icon>
|
||||
</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 v-if="datas.paid==0" class="item-btn">
|
||||
<view style="width: 80px;"><up-button size="small" plain color="#989898" shape="circle"
|
||||
|
|
|
|||
|
|
@ -212,7 +212,7 @@
|
|||
orderListApi({
|
||||
page_no: where.value[type].page_no,
|
||||
page_size: where.value[type].page_size,
|
||||
number: keyword.value,
|
||||
order_id: keyword.value,
|
||||
status: status,
|
||||
paid: paid
|
||||
}).then(res => {
|
||||
|
|
|
|||
|
|
@ -1,103 +1,104 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- <view class="m-card row">
|
||||
<view class="">
|
||||
<!-- <view class="m-card row">
|
||||
<up-cell-group>
|
||||
<up-cell title="请添加自提点" :isLink="true" :border="false" @click="shopListShow=true"></up-cell>
|
||||
</up-cell-group>
|
||||
</view> -->
|
||||
<view class="m-card m-address">
|
||||
<view class="address-info">
|
||||
<view class="top" style="align-items: flex-start;">
|
||||
<view style="color: #333;display: flex;align-items: center;">
|
||||
<up-icon name="map"></up-icon>
|
||||
<text style="margin: 0 10rpx;">自提点</text>
|
||||
</view>
|
||||
<view v-if="shopInfo.mer_id">
|
||||
<view>
|
||||
{{shopInfo.mer_name}}
|
||||
<text v-if="shopInfo.recommend"
|
||||
style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text>
|
||||
</view>
|
||||
<view>
|
||||
<view v-if="shopInfo.service_phone" @click="onCall(shopInfo.service_phone)">
|
||||
<text style="margin-right: 10rpx;">{{shopInfo.mer_real_name}}</text>
|
||||
<text>{{shopInfo.service_phone}}</text>
|
||||
</view>
|
||||
<text v-if="shopInfo.distance"
|
||||
style="color: #20b128;font-size: 20rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-btn">
|
||||
<view style="width: 80px;"><up-button @click="shopListShow=true" size="small" shape="circle" color="#f6f6f6"
|
||||
:customStyle="{color:'#666666'}">修改</up-button></view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="!addressInfo.address_id" class="m-card row">
|
||||
<up-cell-group>
|
||||
<up-cell title="我的地址" :isLink="true" :border="false" @click="openAddress()"></up-cell>
|
||||
</up-cell-group>
|
||||
</view>
|
||||
<view v-else class="m-card m-address">
|
||||
<view class="address-info">
|
||||
<view class="top">
|
||||
<up-icon name="account"></up-icon>
|
||||
<view class="t-name">{{addressInfo.real_name}}</view>
|
||||
<view>{{addressInfo.phone}}</view>
|
||||
</view>
|
||||
<view class="bottom u-line-2">
|
||||
{{addressInfo.detail}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-btn">
|
||||
<view style="width: 80px;"><up-button @click="showAddress = true" size="small" shape="circle" color="#f6f6f6"
|
||||
:customStyle="{color:'#666666'}">修改</up-button></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card m-good" v-for="(item,index) in cartList" :key="index">
|
||||
<view class="image">
|
||||
<up-image width="160rpx" height="160rpx" :src="item.imgs"></up-image>
|
||||
</view>
|
||||
<view class="body-content">
|
||||
<view>
|
||||
<view class="title">
|
||||
<view>{{item.name}}</view>
|
||||
<view>¥{{item.price}}</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view>{{item.unit_name}}</view>
|
||||
<view>x{{item.cart_num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="time">
|
||||
{{orderInfo.delivery_msg}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card good-info">
|
||||
<view class="head-title">价格明细</view>
|
||||
<view class="row">
|
||||
<view>商品总价 <text>共计{{cartList.length}}款商品</text></view>
|
||||
<view><text>¥</text>{{c_price(orderInfo.total, 0)}}<text>.{{c_price(orderInfo.total, 1)}}</text></view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view>运费</view>
|
||||
<view><text>¥</text>0<text>.00</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card good-info">
|
||||
<view class="head-title">支付方式</view>
|
||||
<view class="row">
|
||||
<view class="icon-text"><up-icon name="weixin-circle-fill" color="#20b128" size="22"
|
||||
style="margin-right: 10rpx;"></up-icon> 微信支付</view>
|
||||
<view class="icon">
|
||||
<image v-if="true" src="@/static/icon/check.png"></image>
|
||||
<image v-else src="@/static/icon/n-check.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="m-card order-remark">
|
||||
<!-- <view class="m-card m-address">
|
||||
<view class="address-info">
|
||||
<view class="top" style="align-items: flex-start;">
|
||||
<view style="color: #333;display: flex;align-items: center;">
|
||||
<up-icon name="map"></up-icon>
|
||||
<text style="margin: 0 10rpx;">自提点</text>
|
||||
</view>
|
||||
<view v-if="shopInfo.mer_id">
|
||||
<view>
|
||||
{{shopInfo.mer_name}}
|
||||
<text v-if="shopInfo.recommend"
|
||||
style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text>
|
||||
</view>
|
||||
<view>
|
||||
<view v-if="shopInfo.service_phone" @click="onCall(shopInfo.service_phone)">
|
||||
<text style="margin-right: 10rpx;">{{shopInfo.mer_real_name}}</text>
|
||||
<text>{{shopInfo.service_phone}}</text>
|
||||
</view>
|
||||
<text v-if="shopInfo.distance"
|
||||
style="color: #20b128;font-size: 20rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-btn">
|
||||
<view style="width: 80px;"><up-button @click="shopListShow=true" size="small" shape="circle"
|
||||
color="#f6f6f6" :customStyle="{color:'#666666'}">修改</up-button></view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view v-if="!addressInfo.address_id" class="m-card row">
|
||||
<up-cell-group>
|
||||
<up-cell title="我的地址" :isLink="true" :border="false" @click="openAddress()"></up-cell>
|
||||
</up-cell-group>
|
||||
</view>
|
||||
<view v-else class="m-card m-address">
|
||||
<view class="address-info">
|
||||
<view class="top">
|
||||
<up-icon name="account"></up-icon>
|
||||
<view class="t-name">{{addressInfo.real_name}}</view>
|
||||
<view>{{addressInfo.phone}}</view>
|
||||
</view>
|
||||
<view class="bottom u-line-2">
|
||||
{{addressInfo.detail}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-btn">
|
||||
<view style="width: 80px;"><up-button @click="showAddress = true" size="small" shape="circle"
|
||||
color="#f6f6f6" :customStyle="{color:'#666666'}">修改</up-button></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card m-good" v-for="(item,index) in cartList" :key="index">
|
||||
<view class="image">
|
||||
<up-image width="160rpx" height="160rpx" :src="item.imgs"></up-image>
|
||||
</view>
|
||||
<view class="body-content">
|
||||
<view>
|
||||
<view class="title">
|
||||
<view>{{item.name}}</view>
|
||||
<view>¥{{item.price}}</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view>{{item.unit_name}}</view>
|
||||
<view>x{{item.cart_num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="time">
|
||||
{{orderInfo.delivery_msg}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card good-info">
|
||||
<view class="head-title">价格明细</view>
|
||||
<view class="row">
|
||||
<view>商品总价 <text>共计{{cartList.length}}款商品</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><text>¥</text>0<text>.00</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card good-info">
|
||||
<view class="head-title">支付方式</view>
|
||||
<view class="row">
|
||||
<view class="icon-text"><up-icon name="weixin-circle-fill" color="#20b128" size="22"
|
||||
style="margin-right: 10rpx;"></up-icon> 微信支付</view>
|
||||
<view class="icon">
|
||||
<image v-if="true" src="@/static/icon/check.png"></image>
|
||||
<image v-else src="@/static/icon/n-check.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="m-card order-remark">
|
||||
<view class="head-title">
|
||||
<text>订单备注</text>
|
||||
<text>0/200</text>
|
||||
|
|
@ -105,408 +106,436 @@
|
|||
<up-textarea style="background-color: #F6F6F6;" v-model="formData.remark" placeholder="暂无备注内容"
|
||||
:height="100"></up-textarea>
|
||||
</view> -->
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
<view class="fiexd-btn-box">
|
||||
<view class="tips">
|
||||
<view style="margin-right: 20rpx;">共 {{ cartList.length }} 款</view>
|
||||
<view class="all">
|
||||
<text style="color: #000;">合计: </text>
|
||||
<text>￥</text>
|
||||
<block v-if="orderInfo.total">
|
||||
<text style="font-size: 32rpx;font-weight: bold;">{{c_price(orderInfo.total, 0)}}</text>
|
||||
<text>.{{c_price(orderInfo.total, 1)}}</text>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 200rpx;">
|
||||
<up-button color="#20B128" shape="circle" @click="submitOrder" :throttleTime="1000">预付款提交</up-button>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
<view class="fiexd-btn-box">
|
||||
<view class="tips">
|
||||
<view style="margin-right: 20rpx;">共 {{ cartList.length }} 款</view>
|
||||
<view class="all">
|
||||
<text style="color: #000;">合计: </text>
|
||||
<text>￥</text>
|
||||
<block v-if="orderInfo.total_price">
|
||||
<text style="font-size: 32rpx;font-weight: bold;">{{c_price(orderInfo.total_price, 0)}}</text>
|
||||
<text>.{{c_price(orderInfo.total_price, 1)}}</text>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 200rpx;">
|
||||
<up-button color="#20B128" shape="circle" @click="submitOrder" :throttleTime="1000">预付款提交</up-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<addressPopup ref="addressRef" :show="showAddress" :list="addressList" @close="showAddress=false"
|
||||
@change="changeAddress" />
|
||||
<shopListPopupVue ref="shopRef" :show="shopListShow" :list="merchantList" @close="shopListShow=false"
|
||||
@change="changeShop" @search="searchShop" />
|
||||
<modal title="尚未设置收货地址" content="您还没有添加收货地址，请点击添加" cancleText="添加地址" confirmText="继续支付" :show="toastAddressShow"
|
||||
@close="addAddress" @change="goPay" />
|
||||
<!-- <modal title="是否要拨打电话" :content="`即将拨打电话${phone}`" cancleText="取消" confirmText="拨打" :show="callShow" @close="callShow = false"
|
||||
<addressPopup ref="addressRef" :show="showAddress" :list="addressList" @close="showAddress=false"
|
||||
@change="changeAddress" />
|
||||
<shopListPopupVue ref="shopRef" :show="shopListShow" :list="merchantList" @close="shopListShow=false"
|
||||
@change="changeShop" @search="searchShop" />
|
||||
<modal title="尚未设置收货地址" content="您还没有添加收货地址，请点击添加" cancleText="添加地址" confirmText="继续支付" :show="toastAddressShow"
|
||||
@close="addAddress" @change="goPay" />
|
||||
<!-- <modal title="是否要拨打电话" :content="`即将拨打电话${phone}`" cancleText="取消" confirmText="拨打" :show="callShow" @close="callShow = false"
|
||||
@change="onCall" /> -->
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onLoad,
|
||||
onShow
|
||||
} from "@dcloudio/uni-app"
|
||||
import {
|
||||
nextTick,
|
||||
ref
|
||||
} from "vue"
|
||||
import addressPopup from "@/components/addressPopup.vue";
|
||||
import shopListPopupVue from "@/components/shopListPopup.vue";
|
||||
import useCartStore from "@/store/cart.js";
|
||||
import modal from "@/components/modal.vue";
|
||||
import {
|
||||
checkOrderApi
|
||||
} from "@/api/cart.js";
|
||||
import {
|
||||
addressListsApi,
|
||||
merchantListApi
|
||||
} from "@/api/user.js";
|
||||
import {
|
||||
createOrderApi
|
||||
} from "@/api/order.js";
|
||||
import {
|
||||
onLoad,
|
||||
onShow
|
||||
} from "@dcloudio/uni-app"
|
||||
import {
|
||||
nextTick,
|
||||
ref
|
||||
} from "vue"
|
||||
import addressPopup from "@/components/addressPopup.vue";
|
||||
import shopListPopupVue from "@/components/shopListPopup.vue";
|
||||
import useCartStore from "@/store/cart.js";
|
||||
import modal from "@/components/modal.vue";
|
||||
import {
|
||||
checkOrderApi
|
||||
} from "@/api/cart.js";
|
||||
import {
|
||||
addressListsApi,
|
||||
merchantListApi
|
||||
} from "@/api/user.js";
|
||||
import {
|
||||
createOrderApi
|
||||
} from "@/api/order.js";
|
||||
|
||||
const cartStore = useCartStore();
|
||||
const cartStore = useCartStore();
|
||||
|
||||
const formData = ref({
|
||||
remark: ""
|
||||
})
|
||||
const formData = ref({
|
||||
remark: ""
|
||||
})
|
||||
|
||||
const isAddress = ref(false);
|
||||
const toastAddressShow = ref(false);
|
||||
const isAddress = ref(false);
|
||||
const toastAddressShow = ref(false);
|
||||
|
||||
|
||||
// 选择地址
|
||||
const addressRef = ref(null);
|
||||
const showAddress = ref(false);
|
||||
const addressInfo = ref({});
|
||||
const changeAddress = (e) => {
|
||||
addressInfo.value = e;
|
||||
showAddress.value = false;
|
||||
isAddress.value = true;
|
||||
}
|
||||
const openAddress = () => {
|
||||
if (addressList.length > 0) showAddress.value = true;
|
||||
else uni.navigateTo({
|
||||
url: '/pagesOrder/addressEdit/addressEdit'
|
||||
})
|
||||
}
|
||||
// 选择地址
|
||||
const addressRef = ref(null);
|
||||
const showAddress = ref(false);
|
||||
const addressInfo = ref({});
|
||||
const changeAddress = (e) => {
|
||||
addressInfo.value = e;
|
||||
showAddress.value = false;
|
||||
isAddress.value = true;
|
||||
}
|
||||
const openAddress = () => {
|
||||
if (addressList.length > 0) showAddress.value = true;
|
||||
else uni.navigateTo({
|
||||
url: '/pagesOrder/addressEdit/addressEdit'
|
||||
})
|
||||
}
|
||||
|
||||
// 地址相关
|
||||
const addressList = ref([]);
|
||||
const getAddressList = () => {
|
||||
addressListsApi().then(res => {
|
||||
addressList.value = res.data.lists;
|
||||
addressList.value.forEach(item => {
|
||||
if (item.is_default) {
|
||||
addressInfo.value = item;
|
||||
isAddress.value = true;
|
||||
}
|
||||
})
|
||||
if (!isAddress.value && addressList.value.length > 0) {
|
||||
addressInfo.value = addressList.value[0];
|
||||
isAddress.value = true;
|
||||
}
|
||||
if (addressInfo.value.address_id) {
|
||||
nextTick(() => {
|
||||
addressRef.value.setCheck(addressInfo.value.address_id);
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
// 地址相关
|
||||
const addressList = ref([]);
|
||||
const getAddressList = () => {
|
||||
addressListsApi().then(res => {
|
||||
addressList.value = res.data.lists;
|
||||
addressList.value.forEach(item => {
|
||||
if (item.is_default) {
|
||||
addressInfo.value = item;
|
||||
isAddress.value = true;
|
||||
}
|
||||
})
|
||||
if (!isAddress.value && addressList.value.length > 0) {
|
||||
addressInfo.value = addressList.value[0];
|
||||
isAddress.value = true;
|
||||
}
|
||||
if (addressInfo.value.address_id) {
|
||||
nextTick(() => {
|
||||
addressRef.value.setCheck(addressInfo.value.address_id);
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 提货点相关
|
||||
const shopRef = ref(null);
|
||||
const shopListShow = ref(false);
|
||||
const merchantList = ref([]);
|
||||
const myAddressInfo = ref({
|
||||
long: "",
|
||||
lat: ""
|
||||
})
|
||||
const shopInfo = ref({
|
||||
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 shopRef = ref(null);
|
||||
const shopListShow = ref(false);
|
||||
const merchantList = ref([]);
|
||||
const myAddressInfo = ref({
|
||||
long: "",
|
||||
lat: ""
|
||||
})
|
||||
const shopInfo = ref({
|
||||
mer_id: ''
|
||||
});
|
||||
|
||||
// 拨打电话
|
||||
// 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) => {
|
||||
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);
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 选择地址
|
||||
const addAddress = () => {
|
||||
toastAddressShow.value = false;
|
||||
nextTick(() => {
|
||||
showAddress.value = true;
|
||||
})
|
||||
}
|
||||
// 继续支付
|
||||
const goPay = () => {
|
||||
toastAddressShow.value = false;
|
||||
isAddress.value = true;
|
||||
submitOrder();
|
||||
}
|
||||
// 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 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 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 changeShop = (e) => {
|
||||
shopInfo.value = e;
|
||||
shopListShow.value = false;
|
||||
}
|
||||
const searchShop = (e) => {
|
||||
getMerchantList(e)
|
||||
}
|
||||
|
||||
const c_price = (price, index = 0) => {
|
||||
price = price + '';
|
||||
return price.split('.')[index] || (index ? '00' : '0');
|
||||
}
|
||||
// 拨打电话
|
||||
// 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
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onLoad(options => {
|
||||
checkOrder();
|
||||
})
|
||||
onShow(() => {
|
||||
getAddressList();
|
||||
})
|
||||
// 选择地址
|
||||
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>
|
||||
|
||||
<style lang="scss">
|
||||
.m-card {
|
||||
margin: 20rpx;
|
||||
border-radius: 14rpx;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
}
|
||||
.m-card {
|
||||
margin: 20rpx;
|
||||
border-radius: 14rpx;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.row {
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.row {
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.m-address {
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #999999;
|
||||
.m-address {
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #999999;
|
||||
|
||||
.address-info {
|
||||
width: 510rpx;
|
||||
.address-info {
|
||||
width: 510rpx;
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
.top {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
|
||||
.t-name {
|
||||
color: #444;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
}
|
||||
.t-name {
|
||||
color: #444;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.m-good {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
.m-good {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.image {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 14rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.image {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 14rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.body-content {
|
||||
width: 490rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
color: #989898;
|
||||
.body-content {
|
||||
width: 490rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
color: #989898;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
color: #444;
|
||||
}
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.tips {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.tips {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.time {
|
||||
background-color: #F6F6F6;
|
||||
padding: 5rpx 10rpx;
|
||||
font-size: 26rpx;
|
||||
color: #444;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.time {
|
||||
background-color: #F6F6F6;
|
||||
padding: 5rpx 10rpx;
|
||||
font-size: 26rpx;
|
||||
color: #444;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.good-info {
|
||||
margin-bottom: 20rpx;
|
||||
.good-info {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.head-title {
|
||||
margin-bottom: 18rpx;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
.head-title {
|
||||
margin-bottom: 18rpx;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 18rpx;
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 18rpx;
|
||||
|
||||
.red {
|
||||
color: #F55726;
|
||||
}
|
||||
.red {
|
||||
color: #F55726;
|
||||
}
|
||||
|
||||
.icon-text {
|
||||
display: flex;
|
||||
}
|
||||
.icon-text {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.icon {
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.row-need {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
color: #F55726;
|
||||
}
|
||||
.row-need {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
color: #F55726;
|
||||
}
|
||||
|
||||
text {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
text {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.order-remark {
|
||||
.head-title {
|
||||
margin-bottom: 18rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
.order-remark {
|
||||
.head-title {
|
||||
margin-bottom: 18rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
margin-right: 20rpx;
|
||||
.tips {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
margin-right: 20rpx;
|
||||
|
||||
.all {
|
||||
color: #F55726;
|
||||
}
|
||||
}
|
||||
.all {
|
||||
color: #F55726;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 860 B |
Loading…
Reference in New Issue