新建外卖详情页

main.js

@@ -29,7 +29,7 @@ export function createApp() {
 	app.config.globalProperties.$system = plus.os.name;
 	// #endif
 	app.config.globalProperties.$systemInfo = systemInfo
-	uni.setStorageSync('version', '1.0.4.sp29')
+	uni.setStorageSync('version', '1.0.5')
 	app.config.globalProperties.$version = uni.getStorageSync('version')
 	app.use(globalMethods);
 	return {

pages.json

@@ -97,11 +97,17 @@
 				},
 				{
 					"path": "taobao/add-shopping-order/add-shopping-order",
-					"style" : 
+					"style": {
-					{
 						"navigationBarTitleText": "新增淘宝购物订单",
 						"navigationStyle": "custom"
 					}
+				},
+				{
+					"path": "taobao/shangou-order-detail/shangou-order-detail",
+					"style": {
+						"navigationBarTitleText": "淘宝闪购订单详情",
+						"navigationStyle": "custom"
+					}
 				}
 			]
 		},

pages/other/train-tickets/fliggy-train-tickets/fliggy-train-tickets.vue

@@ -118,7 +118,9 @@
 										<view class="codefun-flex-row codefun-items-center">
 											<view v-if="computeSeatNo(item.seatNo)"
 												class="codefun-flex-col codefun-justify-start codefun-items-center codefun-shrink-0 text-wrapper_3">
-												<text class="font_11 text_21">{{ computeSeatNo(item.seatNo) }}</text>
+												<view class="font_11 text_21">
+													{{
+														computeSeatNo(item.seatNo) }}</view>
 											</view>
 											<text class="font_12 text_22 codefun-ml-4">{{ item.carriage }}车厢
 												{{ item.seatNo }}号</text>
@@ -695,6 +697,9 @@ const showFristAndLastNumber = (str) => {
 					border-radius: 6rpx;
 					width: 66rpx;
 					height: 32rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
 					border: solid 1rpx #d3d3d3;
 				}
 
@@ -770,13 +775,10 @@ const showFristAndLastNumber = (str) => {
 				}
 
 				.font_11 {
-					font-size: 26rpx;
-					line-height: 30rpx;
 					color: #979797;
-				}
+					font-size: 12px;
-
+					line-height: 32rpx;
-				.text_21 {
+					height: 32rpx;
-					line-height: 28rpx;
 				}
 			}
 		}

pages/other/train-tickets/qunar-train-tickets/qunar-train-tickets.vue

@@ -339,8 +339,8 @@ page {
 		.text-wrapper {
 			border-radius: 25rpx;
 			width: 106rpx;
-			height: 50rpx;
+			height: 24px;
-			border: solid 1rpx #28c2dd;
+			border: solid 0.5px #28c2dd;
 
 			.text_6 {
 				color: #28c2dd;

pages/shopping/index.vue

@@ -50,8 +50,7 @@ const menuList = ref([
 		bgColor: ["#FFF0DA", "#FFFFFF"],
 		btnBg: "#FF953C",
 		shadowColor: "#FF953C",
-		// url: "/pages/shopping/taobao/list-index"
+		url: "/pages/shopping/taobao/list-index"
-		url: ""
 	}, {
 		name: "快手",
 		icon: "kuaishou",

pages/shopping/jingdong/list-index.vue

@@ -110,11 +110,13 @@
 
 <script setup>
 import { ref, computed, onMounted, getCurrentInstance } from 'vue';
-import { onShow } from '@dcloudio/uni-app';
+import { onShow, onLoad } from '@dcloudio/uni-app';
 import ShoppingCard from '@/components/shopping/jingdong/shopping-card.vue';
 import { util } from '@/utils/common.js';
 import { shoppingType, waimaiType, defaultDataList } from './json/order.json';
 
+const { proxy } = getCurrentInstance();
+
 const showActionMenu = ref(false);
 const actionMenuState = ref({ x: 0, y: 0, item: null });
 
@@ -136,14 +138,22 @@ const buttonGroup = [
 	}, {
 		name: "新增秒送订单",
 		click: () => {
-			// uni.showToast({
-			// 	title: '开发中，敬请期待',
-			// 	icon: 'none'
-			// });
 			uni.navigateTo({
 				url: '/pages/shopping/jingdong/add-waimai/add-waimai'
 			});
 		}
+	}, {
+		name: "切换推荐商品图片",
+		click: () => {
+			// 先滚动到页面底部，动画完成后再弹出图片选择器
+			uni.pageScrollTo({
+				scrollTop: 999999,
+				duration: 300
+			});
+			setTimeout(() => {
+				chooseImage();
+			}, 400);
+		}
 	},
 ]
 /**
@@ -291,7 +301,24 @@ onMounted(() => {
 	}, 100);
 });
 
+
+onLoad(() => {
+	proxy.$apiUserEvent('all', {
+		type: 'event',
+		key: 'shopping',
+		prefix: '.uni.other.',
+		value: '京东'
+	})
+})
+
 onShow(() => {
+	// #ifdef APP-PLUS
+	util.setAndroidSystemBarColor('#FFFFFF')
+	setTimeout(() => {
+		plus.navigator.setStatusBarStyle("dark");
+	}, 500);
+	// #endif
+
 	// 检查是否已经初始化过
 	const isInit = uni.getStorageSync('isInitJingdong');
 
@@ -321,6 +348,7 @@ onShow(() => {
 	}
 
 	console.log('screenshotImage.value', screenshotImage.value)
+
 });
 
 // 长按替换截图 - 选择图片

pages/shopping/taobao/list-index.vue

@@ -5,7 +5,8 @@
 				@button-click="util.clickTitlePopupButton" tipLayerType="jingdong-shopping-list" isTipLayer
 				tipLayerText="添加订单信息">
 				<template v-slot:left>
-					<image class="back-icon" src="/static/image/shopping/taobao/back.png" mode="aspectFit"></image>
+					<image class="back-icon" src="/static/image/shopping/taobao/back.png" mode="aspectFit"
+						@click="util.goBack()"></image>
 				</template>
 				<template v-slot:center>
 					<view class="search-box flex-align-center">
@@ -80,11 +81,19 @@
 			</view>
 			<listCard v-if="displayList.length > 0" :list="displayList" @click-item="goDetail"
 				@longpress="onItemLongPress" />
-			<view v-else class="null-data-box flex-center flex-column">
+			<view v-else-if="displayList.length == 0 && currentTab != 2" class="null-data-box flex-center flex-column">
 				<image style="width: 254rpx;height: 200rpx;" src="/static/image/shopping/taobao/null.png"></image>
 				<text
 					style="font-size: 28rpx;color: #7C8495;line-height: 28rpx;margin-top: 16rpx;font-weight: 500;">您还没有相关的订单</text>
 			</view>
+			<view v-else-if="displayList.length == 0 && currentTab == 2"
+				class="null-data-box shangou flex-center flex-column">
+				<image style="width: 254rpx;height: 200rpx;" src="/static/image/shopping/taobao/waimai/null.png">
+				</image>
+				<text class="null-text">您还没有闪购订单</text>
+				<text class="tip-text">时机正好，去闪购逛逛还能抽免单！</text>
+				<view class="go-btn">去闪购逛逛</view>
+			</view>
 			<view class="bottom-fixed" style="height: 1000rpx;">
 				<view v-if="!selectedImage" class="upload-screenshot-box" @touchstart="handleTouchStart"
 					@touchend="handleTouchEnd">
@@ -160,15 +169,25 @@
 			<view class="p-footer" @click="bottomImgPopup.close()">取消</view>
 		</view>
 	</uni-popup>
+
+	<!-- 水印 -->
+	<view v-if="$isVip()">
+		<watermark dark="light" source="uni_alipay_shopping_taobao" />
+		<liu-drag-button :canDocking="false" @clickBtn="$goRechargePage('watermark', 'uni_alipay_shopping_taobao')">
+			<c-lottie ref="cLottieRef" :src='$watermark()' width="94px" height='74px' :loop="true"></c-lottie>
+		</liu-drag-button>
+	</view>
 </template>
 
 <script setup>
-import { ref, computed, onMounted, getCurrentInstance, reactive } from 'vue';
+import { ref, computed, getCurrentInstance, reactive } from 'vue';
-import { onShow } from '@dcloudio/uni-app';
+import { onShow, onLoad } from '@dcloudio/uni-app';
 import { util } from '@/utils/common.js';
 import listCard from './components/list-card/list-card.vue';
 import { defualtData } from './json/order.json'
 
+const { proxy } = getCurrentInstance();
+
 const instance = getCurrentInstance();
 const mockList = ref([]);
 const menuState = reactive({
@@ -191,7 +210,23 @@ const selectBottomImg = (type) => {
 	});
 };
 
+onLoad(() => {
+	proxy.$apiUserEvent('all', {
+		type: 'event',
+		key: 'shopping',
+		prefix: '.uni.other.',
+		value: '淘宝'
+	})
+})
+
 onShow(() => {
+	// #ifdef APP-PLUS
+	util.setAndroidSystemBarColor('#FFFFFF')
+	setTimeout(() => {
+		plus.navigator.setStatusBarStyle("dark");
+	}, 500);
+	// #endif
+
 	// 加载缓存数据
 	let storageData = uni.getStorageSync('taobaoShopping');
 
@@ -502,7 +537,7 @@ const updateFilterList = () => {
 	}
 	filterList.value = sourceList.map((name, index) => ({
 		name,
-		disabled: index === 2 && currentTab.value === 1 // 示例：只有待发货可以被禁用
+		disabled: false
 	}));
 };
 
@@ -888,6 +923,36 @@ const deleteOrder = (id) => {
 
 .null-data-box {
 	padding: 68rpx;
+
+	&.shangou {
+		.null-text {
+			font-size: 28rpx;
+			color: #7C8495;
+			line-height: 28rpx;
+			margin-top: 16rpx;
+			font-weight: 500;
+		}
+
+		.tip-text {
+			font-size: 30rpx;
+			color: #A5A8AE;
+			line-height: 30rpx;
+			margin-top: 32rpx;
+		}
+
+		.go-btn {
+			width: 198rpx;
+			height: 80rpx;
+			background-color: #FC620B;
+			border-radius: 12rpx;
+			color: #FFFFFF;
+			text-align: center;
+			line-height: 80rpx;
+			font-size: 30rpx;
+			font-weight: 500;
+			margin-top: 32rpx;
+		}
+	}
 }
 
 .bottom-fixed {

pages/shopping/taobao/shangou-order-detail/shangou-order-detail.vue

@@ -0,0 +1,376 @@
+<template>
+	<view>
+		<nav-bar class="nav-bar" title="" :bgColor="order.statusType == 'wait_recv' ? 'transparent' : '#FFFFFF'"
+			:buttonGroup="buttonGroup" @button-click="util.clickTitlePopupButton" tipLayerType="jingdong-shopping-list"
+			isTipLayer tipLayerText="添加订单信息">
+			<template v-slot:left>
+				<image class="back-icon" src="/static/image/shopping/taobao/back.png" mode="aspectFit"
+					@click="util.goBack()"></image>
+			</template>
+			<template v-slot:right>
+				<view class="right-box flex-align-center">
+					<view v-if="order.statusType == 'wait_recv'" class="item flex-column flex-align-center"
+						style="background-color: #FFFFFF;width: 70rpx;">
+						<image class="icon" src="/static/image/shopping/taobao/waimai/shuaxin.png"></image>
+						<text class="text">刷新</text>
+					</view>
+					<view class="item flex-column flex-align-center" style="background-color: #FFFFFF;width: 70rpx;">
+						<image class="icon" src="/static/image/shopping/taobao/waimai/kefu.png"></image>
+						<text class="text">客服</text>
+					</view>
+					<view class="item flex-column flex-align-center">
+						<image class="icon" src="/static/image/shopping/taobao/xiaoxi.png"></image>
+						<text class="text" style="opacity: 0;">消息</text>
+					</view>
+				</view>
+			</template>
+		</nav-bar>
+
+		<view v-if="order.statusType != 'wait_recv'" class="wait_pay">
+			<view class="flex-align-center">
+				<text v-if="order.statusType == 'wait_pay'" class="main-text">待支付，剩余15:00</text>
+				<text v-else class="main-text">{{ order.statusType == 'success' ? '订单已送达' : '订单已取消' }}</text>
+				<uni-icons v-if="order.statusType != 'closed'" type="right" size="16" color="#1A1A1A"></uni-icons>
+			</view>
+			<view v-if="order.statusType == 'wait_pay'" class="flex-align-center notice-box">
+				<image style="width:26rpx;height: 26rpx;" src="/static/image/shopping/taobao/waimai/notice.png"></image>
+				<text class="notice-text">15分钟内未支付,订单将自动取消</text>
+			</view>
+		</view>
+		<view class="deliver-info">
+			<view v-if="order.statusType == 'closed' || order.statusType == 'success'" class="bold-text">
+				{{ order.statusType == 'closed' ? '抱歉，我们会努力改进' : '已送到指定位置，请及时取餐' }}
+			</view>
+			<view v-if="order.statusType == 'wait_recv' || order.statusType == 'wait_pay'"
+				style="justify-content: baseline;">
+				<text class="label">预计</text>
+				<text class="time">16:32-16:47</text>
+			</view>
+			<view v-if="order.statusType != 'closed'" class="flex"
+				style="margin-top: 26rpx;justify-content: flex-start;">
+				<text class="label">送至</text>
+				<view class="flex-1 address-info">
+					<text>金星哈哈哈哈哈哈哈和和哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈 王总(女士) 12563259856</text>
+					<text class="split"></text>
+					<text class="edit-text">修改</text>
+					<uni-icons type="right" size="12" color="#8C8C8C"></uni-icons>
+				</view>
+			</view>
+			<view v-if="order.statusType == 'wait_recv'" class="flex"
+				style="margin-top: 26rpx;justify-content: flex-start;">
+				<text class="label">服务</text>
+				<view class="flex-1 address-info">
+					<text style="color: #1AA35B;">超20分钟免单-生效中</text>
+					<text> 若超时，即11:57后送达赔4元可叠加红包</text>
+					<uni-icons type="right" size="12" color="#8C8C8C"></uni-icons>
+				</view>
+			</view>
+		</view>
+		<view v-if="order.statusType == 'wait_pay'" class="wait_pay-buttom">
+			<view class="button flex-center flex-column">
+				<text style="font-size: 32rpx;line-height: 32rpx;">去支付 ￥15.6</text>
+				<text style="font-size: 24rpx;line-height: 24rpx;margin-top: 4rpx;">支持更多支付方式</text>
+			</view>
+		</view>
+		<view class="icon-list-item flex">
+			<view class="flex-1 flex-align-center icon-box"
+				:class="{ 'flex-justify-center': order.statusType == 'closed' }">
+				<template v-for="(item, index) in items" :key="index">
+					<view v-if="item.show()" class="item flex-center flex-column">
+						<image class="img" :src="item.image" mode="aspectFit"></image>
+						<text :style="{ color: item.color || '#1a1a1a	' }">{{ item.text }}</text>
+					</view>
+				</template>
+			</view>
+
+			<view v-if="order.statusType == 'wait_recv' || order.statusType == 'success'"
+				class="flex-align-center more">
+				<view style="margin-right: 18rpx;color: #E9E9E9;">|</view>
+				<view class="item flex-center flex-column" style="width: auto;min-width: 0;margin-right: 0;">
+					<image class="img" src="/static/image/shopping/taobao/waimai/gengduo.png" mode="aspectFit">
+					</image>
+					<text>更多</text>
+				</view>
+			</view>
+
+		</view>
+
+	</view>
+</template>
+
+<script setup>
+import { ref, reactive } from 'vue';
+import { util } from '@/utils/common.js';
+const order = ref({
+	statusType: "wait_pay"
+})
+
+const items = [
+	{
+		image: "/static/image/shopping/taobao/waimai/zhaorenfu.png",
+		text: "找人付",
+		show: () => {
+			return order.value.statusType == 'wait_pay'
+		}
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/gaidingdan.png",
+		text: "修改订单信息",
+		show: () => order.value.statusType == 'wait_pay' || order.value.statusType == 'wait_recv',
+		color: "#FE6306"
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/shenqingshouhou.png",
+		text: "申请售后",
+		show: () => order.value.statusType == 'success',
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/zaimaiyidan.png",
+		text: "再买一单",
+		show: () => order.value.statusType == 'success',
+		color: "#FE6306"
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/pingjiayinhongbao.png",
+		text: "评价赢红包",
+		show: () => order.value.statusType == 'success',
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/lianxi.png",
+		text: "联系商家",
+		show: () => order.value.statusType == 'wait_recv' || order.value.statusType == 'success'
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/lianxi.png",
+		text: "联系骑士",
+		show: () => order.value.statusType == 'wait_recv' || order.value.statusType == 'success'
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/cuidan.png",
+		text: "催单",
+		show: () => order.value.statusType == 'wait_recv'
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/quxiaodingdan.png",
+		text: "取消订单",
+		show: () => order.value.statusType == 'wait_pay' || order.value.statusType == 'wait_recv'
+	},
+	{
+		image: "/static/image/shopping/taobao/waimai/dianhuashangjia.png",
+		text: "电话商家",
+		show: () => order.value.statusType == 'closed'
+	}
+]
+
+
+</script>
+
+<style lang="less" scoped>
+::v-deep .uni-navbar__header-btns {
+	width: auto !important;
+}
+
+::v-deep .uni-navbar__header-container {
+	padding: 0 14rpx;
+	padding-left: 34rpx;
+}
+
+.nav-bar {
+	background-color: #ffffff;
+
+	.back-icon {
+		width: 40rpx;
+		height: 40rpx;
+	}
+
+	.search-box {
+		background-color: #F1F5F8;
+		padding: 0 18rpx;
+		width: 100%;
+		border-radius: 16rpx;
+
+		.search-icon {
+			width: 26rpx;
+			height: 26rpx;
+			margin-right: 10rpx;
+		}
+
+		.input {
+			width: 100%;
+			height: 72rpx;
+			font-size: 26rpx;
+
+			::v-deep .input-placeholder {
+				color: #7E8C9D;
+			}
+		}
+	}
+
+	.right-box {
+		.item {
+			margin-left: 30rpx;
+			height: 70rpx;
+			border-radius: 12rpx;
+			align-items: center;
+			justify-content: center;
+			flex-direction: column;
+
+			.icon {
+				width: 40rpx;
+				height: 40rpx;
+			}
+
+			.text {
+				font-size: 18rpx;
+				color: #1A1A1A;
+				line-height: 18rpx;
+			}
+		}
+	}
+}
+
+.wait_pay {
+	padding: 32rpx 16rpx;
+	padding-bottom: 18rpx;
+	background-color: #ffffff;
+
+	.main-text {
+		font-weight: 400;
+		font-size: 48rpx;
+		line-height: 48rpx;
+		color: #1A1A1A;
+		font-weight: 600;
+		margin-right: 8rpx;
+		margin-left: 16rpx;
+	}
+
+	.notice-box {
+		padding: 28rpx 16rpx;
+		margin-top: 30rpx;
+		background-color: #FAFAFA;
+		border-radius: 8rpx;
+
+		.notice-text {
+			font-size: 26rpx;
+			color: #1A1A1A;
+			line-height: 26rpx;
+		}
+	}
+}
+
+.deliver-info {
+	background-color: #FFFFFF;
+	padding: 32rpx 32rpx 0;
+
+	.bold-text {
+		font-size: 40rpx;
+		color: #1A1A1A;
+		line-height: 40rpx;
+		font-weight: 500;
+	}
+
+	.label {
+		font-size: 26rpx;
+		color: #1A1A1A;
+		line-height: 26rpx;
+		font-weight: 500;
+		margin-right: 10rpx;
+	}
+
+	.time {
+		font-weight: 500;
+		font-size: 40rpx;
+		color: #1A1A1A;
+		line-height: 40rpx;
+	}
+
+	.address-info {
+		font-weight: 400;
+		font-size: 26rpx;
+		color: #1A1A1A;
+		line-height: 40rpx;
+		margin-top: -8rpx;
+
+		.split {
+			display: inline-block;
+			height: 18rpx;
+			width: 1rpx;
+			background-color: #D8D8D8;
+			margin: 0 14rpx;
+		}
+
+		.edit-text {
+			color: #7C8495;
+			margin-right: 2rpx;
+		}
+	}
+
+}
+
+.wait_pay-buttom {
+	padding: 0 32rpx;
+	background-color: #ffffff;
+
+	.button {
+		background-color: #FE6306;
+		width: 100%;
+		height: 80rpx;
+		border-radius: 12rpx;
+		flex-direction: column;
+		color: #FFFFFF;
+	}
+}
+
+.icon-list-item {
+	background-color: #FFFFFF;
+	padding: 0 28rpx;
+	padding-top: 32rpx;
+	padding-bottom: 28rpx;
+
+	.icon-box {
+		width: 100rpx;
+		overflow: hidden;
+		overflow-x: auto;
+		justify-content: space-around;
+	}
+
+	.item {
+		flex-shrink: 0;
+		min-width: 102rpx;
+		text-align: center;
+		margin-right: 18rpx;
+
+		.img {
+			width: 32rpx;
+			height: 32rpx;
+		}
+
+		text {
+			font-size: 24rpx;
+			color: #1A1A1A;
+			line-height: 26rpx;
+			margin-top: 10rpx;
+			white-space: nowrap;
+		}
+
+
+	}
+
+	.more {
+		flex-shrink: 0;
+	}
+
+
+}
+
+.orange {
+	color: #FE6306 !important;
+}
+</style>
+<style>
+@import "/common/main.css";
+
+page {
+	background-color: #F1F5F8;
+}
+</style>

pages/shopping/taobao/shopping-order-detail/shopping-order-detail.vue

@@ -345,6 +345,14 @@
 			</view>
 		</view>
 	</view>
+
+	<!-- 水印 -->
+	<view v-if="$isVip()">
+		<watermark dark="light" source="uni_alipay_shopping_taobao" />
+		<liu-drag-button :canDocking="false" @clickBtn="$goRechargePage('watermark', 'uni_alipay_shopping_taobao')">
+			<c-lottie ref="cLottieRef" :src='$watermark()' width="94px" height='74px' :loop="true"></c-lottie>
+		</liu-drag-button>
+	</view>
 </template>
 
 <script setup>