diff --git a/components/common/auto-width-input.vue b/components/common/auto-width-input.vue
new file mode 100644
index 0000000..43d2ac5
--- /dev/null
+++ b/components/common/auto-width-input.vue
@@ -0,0 +1,148 @@
+<template>
+	<view class="auto-width-input-container" :class="{ 'is-textarea': type === 'textarea' }">
+		<!-- 测量层：用于计算宽度的影藏文本，必须保持与 input 相同的字体样式 -->
+		<text v-if="type !== 'textarea'" class="measure-text" :style="[inputStyle, { visibility: 'hidden', position: 'absolute', whiteSpace: 'nowrap' }]">
+			{{ modelValue || placeholder }}
+		</text>
+
+		<!-- 输入层 -->
+		<template v-if="type !== 'textarea'">
+			<input class="auto-input" :type="type" :value="modelValue" :placeholder="placeholder" :placeholder-style="placeholderStyle"
+				:style="[inputStyle, { width: inputWidth }]" @input="onInput" :maxlength="maxlength" />
+		</template>
+		<template v-else>
+			<textarea class="auto-textarea" :value="modelValue" :placeholder="placeholder" :placeholder-style="placeholderStyle"
+				:style="[inputStyle]" @input="onInput" :maxlength="maxlength" auto-height />
+		</template>
+	</view>
+</template>
+
+<script setup>
+import { ref, computed, watch, nextTick, getCurrentInstance, onMounted } from 'vue';
+
+const props = defineProps({
+	modelValue: {
+		type: [String, Number],
+		default: ''
+	},
+	type: {
+		type: String,
+		default: 'text' // 支持所有原生类型如 'number', 'tel', 'digit' 或 'textarea'
+	},
+	placeholder: {
+		type: String,
+		default: '请输入'
+	},
+	placeholderStyle: {
+		type: String,
+		default: 'color: #999;'
+	},
+	fontSize: {
+		type: String,
+		default: '28rpx'
+	},
+	fontWeight: {
+		type: String,
+		default: 'normal'
+	},
+	color: {
+		type: String,
+		default: '#1A1A1A'
+	},
+	maxlength: {
+		type: Number,
+		default: 140
+	},
+	minWidth: {
+		type: String,
+		default: '20rpx'
+	},
+	extraWidth: {
+		type: Number,
+		default: 10 // 额外的缓冲像素，防止文字抖动
+	}
+});
+
+const emit = defineEmits(['update:modelValue', 'change']);
+const instance = getCurrentInstance();
+const inputWidth = ref(props.minWidth);
+
+const inputStyle = computed(() => ({
+	fontSize: props.fontSize,
+	fontWeight: props.fontWeight,
+	color: props.color,
+	fontFamily: 'inherit'
+}));
+
+/**
+ * 核心逻辑：测量隐藏文本的物理宽度
+ */
+const updateWidth = () => {
+	if (props.type === 'textarea') return;
+	nextTick(() => {
+		const query = uni.createSelectorQuery().in(instance.proxy);
+		query.select('.measure-text').boundingClientRect(data => {
+			if (data && data.width) {
+				heatWidth(data.width);
+			}
+		}).exec();
+	});
+};
+
+const heatWidth = (width) => {
+	// 加上一点额外的空间，避免在某些平台上因为小数点或字体渲染导致的文字换行
+	inputWidth.value = (width + props.extraWidth) + 'px';
+};
+
+const onInput = (e) => {
+	const val = e.detail.value;
+	emit('update:modelValue', val);
+	emit('change', val);
+};
+
+// 监听值的变化实时更新宽度
+watch(() => props.modelValue, () => {
+	updateWidth();
+});
+
+// 初始化
+onMounted(() => {
+	updateWidth();
+});
+</script>
+
+<style lang="less" scoped>
+.auto-width-input-container {
+	position: relative;
+	display: inline-block;
+	vertical-align: middle;
+	
+	&.is-textarea {
+		width: 100%;
+	}
+
+	.measure-text {
+		left: -9999rpx;
+		top: -9999rpx;
+		pointer-events: none;
+	}
+
+	.auto-input {
+		min-width: v-bind('props.minWidth');
+		padding: 0;
+		margin: 0;
+		text-align: inherit; // 继承父级的对齐方式
+		height: 1.4em; // 自动适应行高
+		line-height: 1.4em;
+	}
+
+	.auto-textarea {
+		width: 100%;
+		min-height: 1.4em;
+		padding: 0;
+		margin: 0;
+		line-height: 1.4em;
+		display: block;
+	}
+}
+</style>
diff --git a/components/message/chat/chat-layout.vue b/components/message/chat/chat-layout.vue
index 8bc4cb0..2c910bd 100644
--- a/components/message/chat/chat-layout.vue
+++ b/components/message/chat/chat-layout.vue
@@ -16,7 +16,7 @@
                                 :src="chatInfo.img || `/static/image/phone-message/${phone}/default.png`">
                             </image>
                             <text v-if="phone != 'iphone'" class="title">{{ chatInfo.title }}</text>
-                            <text v-if="phone == 'oppo'" class="second-text">重庆</text>
+                            <text v-if="phone == 'oppo' && chatInfo.area" class="second-text">{{ chatInfo.area }}</text>
                         </view>
                         <view class="right flex-align-center">
                             <image v-if="phone == 'mi'" class="img shrink-0"
diff --git a/components/shopping/jingdong/shopping-card.vue b/components/shopping/jingdong/shopping-card.vue
index bb8c7c1..a353b5a 100644
--- a/components/shopping/jingdong/shopping-card.vue
+++ b/components/shopping/jingdong/shopping-card.vue
@@ -63,8 +63,8 @@
                 <view class="product-info">
                     <text class="product-title">{{ item.products[0].title }}</text>
                     <text class="product-desc" v-if="item.products[0].desc">{{ item.products[0].desc }}</text>
-                    <view class="product-tags" v-if="item.products[0].tags && item.products[0].tags.length">
-                        <text class="tag" v-for="(tag, index) in item.products[0].tags" :key="index">{{ tag }}</text>
+                    <view class="product-tags" v-if="item.products[0].service">
+                        <text class="tag">{{ item.products[0].service }}</text>
                     </view>
                 </view>
             </template>
@@ -120,7 +120,7 @@
             </template>
             <template v-else-if="item.promoType === 'text'">
                 <text class="promo-text text-basic">本单可享 <text class="highlight">{{ item.promoHighlight
-                        }}</text>，快去支付吧~</text>
+                }}</text>，快去支付吧~</text>
             </template>
             <template v-else>
                 <text class="promo-text text-basic">当笔订单返现成功到账，<text style="color: #E31700;">点击领取</text></text>
diff --git a/main.js b/main.js
index eb31d1d..299796a 100644
--- a/main.js
+++ b/main.js
@@ -27,7 +27,7 @@ export function createApp() {
 	const systemInfo = uni.getStorageSync('systemInfo') || {}
 	app.config.globalProperties.$system = systemInfo.platform == 'ios' ? 'iOS' : 'Android'
 	app.config.globalProperties.$systemInfo = systemInfo
-	uni.setStorageSync('version', '1.0.3.sp17')
+	uni.setStorageSync('version', '1.0.4.sp2')
 	app.config.globalProperties.$version = uni.getStorageSync('version')
 	app.use(globalMethods);
 	return {
diff --git a/pages/message/list-index.vue b/pages/message/list-index.vue
index cfd59ad..e6640bd 100644
--- a/pages/message/list-index.vue
+++ b/pages/message/list-index.vue
@@ -48,6 +48,10 @@
 						<text class="add-label required">联系人</text>
 						<input class="add-input" v-model="addForm.title" placeholder="请输入名称或号码" />
 					</view>
+					<view class="add-row" v-if="data.phone == 'oppo'">
+						<text class="add-label">地区</text>
+						<input class="add-input" v-model="addForm.area" placeholder="请输入地区" />
+					</view>
 					<view class="add-row between" v-if="data.phone == 'iphone'">
 						<text class="add-label">取消通知</text>
 						<switch :checked="addForm.noNotice" @change="addForm.noNotice = !addForm.noNotice" />
@@ -313,6 +317,7 @@ const openAddPopup = () => {
 	addForm.title = ''
 	addForm.img = ''
 	addForm.content = ''
+	addForm.area = ''
 	addForm.unRead = false
 	addForm.unReadNumber = 1
 	addForm.noNotice = false
@@ -347,6 +352,7 @@ const editItem = (item) => {
 	addForm.img = item.img || ''
 	addForm.imgShape = item.imgShape || 'circle'
 	addForm.content = ''
+	addForm.area = item.area || ''
 	addForm.unRead = !!item.unRead
 	addForm.unReadNumber = item.unReadNumber || 0
 	addForm.noNotice = item.noNotice || false
@@ -387,6 +393,7 @@ const confirmAdd = async () => {
 			defaultList.value[idx].unReadNumber = addForm.unReadNumber
 			defaultList.value[idx].noNotice = addForm.noNotice
 			defaultList.value[idx].imgShape = addForm.imgShape
+			defaultList.value[idx].area = addForm.area
 			defaultList.value[idx].time = time
 		}
 	} else {
@@ -399,6 +406,7 @@ const confirmAdd = async () => {
 			img: finalImgPath,
 			title: addForm.title.trim(),
 			imgShape: addForm.imgShape,
+			area: addForm.area,
 			chatList: addForm.content.trim() ? [
 				{
 					id: stringUtil.uuid(),
diff --git a/pages/other/ranking/ranking.vue b/pages/other/ranking/ranking.vue
index 7157dca..01ab5b3 100644
--- a/pages/other/ranking/ranking.vue
+++ b/pages/other/ranking/ranking.vue
@@ -9,21 +9,25 @@
 				:style="type == 'skin' ? { backgroundColor: skinBgColor } : {}">
 				<template v-if="type == 'skin'">
 					<view v-if="!isEdit" class="title">{{ title }}</view>
-					<input v-else class="title title-input" v-model="title" placeholder="请输入排名标题" />
+					<input v-else class="title title-input" v-model="title" maxlength="12" placeholder="请输入排名标题" />
 					<image class="img happy" src="/static/image/other/ranking/happy.png"></image>
 					<image class="img sad" src="/static/image/other/ranking/sad.png"></image>
 				</template>
-				<image class="watermark" :class="{}" src="/static/image/other/card/shuiyin2.png" mode="heightFix">
+				<image v-if="$isVip()" class="watermark" :class="{}" src="/static/image/other/card/shuiyin2.png"
+					mode="heightFix">
 				</image>
 
 				<view class="ranking-table">
 					<view v-for="(item, index) in tierList" :key="index" class="ranking-row">
 						<view class="label-box" :style="{ backgroundColor: item.bgColor }"
 							@click="changeRowBgColor(index)">
-							<text class="label-text" :class="{ 'with-stroke': item.hasStroke }"
+							<!-- <text class="label-text" :class="{ 'with-stroke': item.hasStroke }"
 								:style="{ color: item.textColor }">
 								{{ item.label }}
-							</text>
+							</text> -->
+							<image :style="`height:60rpx;width:160rpx;`"
+								:src="`/static/image/other/ranking/${type == 'skin' ? item.img + '_skin' : item.img}.png`">
+							</image>
 						</view>
 
 						<view class="items-box ranking-item-list" :id="'row-' + index">
@@ -88,17 +92,21 @@
 							:css="`display: flex; min-height: 148rpx; border-bottom: ${index === tierList.length - 1 ? 'none' : '3rpx solid #333'};`">
 							<l-painter-view
 								:css="`width: 176rpx; min-height: 148rpx; background-color: ${item.bgColor}; display: flex; align-items: center; justify-content: center; border-right: 3rpx solid #333;`">
-								<l-painter-text :text="item.label"
-									:css="`font-size: 52rpx; font-weight: bold; color: ${item.textColor}; ${item.hasStroke ? 'text-shadow: 2rpx 2rpx 0 #000, -2rpx -2rpx 0 #000, 2rpx -2rpx 0 #000, -2rpx 2rpx 0 #000, 0 2rpx 0 #000, 0 -2rpx 0 #000, 2rpx 0 0 #000, -2rpx 0 0 #000;' : ''}`" />
+								<!-- <l-painter-text :text="item.label"
+									:css="`font-size: 52rpx; font-weight: bold; color: ${item.textColor}; ${item.hasStroke ? 'text-shadow: 2rpx 2rpx 0 #000, -2rpx -2rpx 0 #000, 2rpx -2rpx 0 #000, -2rpx 2rpx 0 #000, 0 2rpx 0 #000, 0 -2rpx 0 #000, 2rpx 0 0 #000, -2rpx 0 0 #000;' : ''}`" /> -->
+								<l-painter-image
+									:src="`/static/image/other/ranking/${type == 'skin' ? item.img + '_skin' : item.img}.png`"
+									:css="`height: 60rpx; width: 160rpx;`" mode="heightFix" />
 							</l-painter-view>
-							<l-painter-view :css="`flex: 1; padding: 14rpx 16rpx; display: flex; align-items: center;`">
+							<l-painter-view
+								:css="`flex: 1; display: flex; align-items: center;height: 148rpx;width:490rpx;padding:0 12rpx;`">
 								<l-painter-image v-for="(img, imgIdx) in item.images" :key="imgIdx" :src="img"
-									css="width: 110rpx; height: 110rpx; margin: 0 6rpx; object-fit: cover;"
+									css="width: 105rpx; height: 105rpx; margin: 0 8rpx; object-fit: cover;"
 									mode="aspectFill" />
 							</l-painter-view>
 						</l-painter-view>
 					</l-painter-view>
-					<l-painter-view
+					<l-painter-view v-if="$isVip()"
 						:css="type == 'skin' ? `position: absolute;bottom: 32rpx;right: 14rpx;` : `position: absolute;top: 50%;right: 50%;transform: translate(50%, -50%);`">
 						<l-painter-image src="/static/image/other/card/shuiyin2.png"
 							css="width: 194rpx;height: 56rpx;" />
@@ -112,8 +120,18 @@
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue';
-import { onLoad } from '@dcloudio/uni-app';
+import {
+	ref,
+	reactive,
+	getCurrentInstance
+} from 'vue';
+import {
+	onLoad
+} from '@dcloudio/uni-app';
+
+const {
+	proxy
+} = getCurrentInstance();
 
 const type = ref("base");
 const title = ref("xx排名");
@@ -123,16 +141,62 @@ const isSnapshot = ref(false);
 const isEdit = ref(false);
 const rightButtonText = ref("编辑");
 
-const tierList = ref([
-	{ label: '夯', bgColor: '#D5171C', textColor: '#FFFFFF', hasStroke: true, images: [] },
-	{ label: '顶级', bgColor: '#FF6A0B', textColor: '#FFFFFF', hasStroke: true, images: [] },
-	{ label: '人上人', bgColor: '#FFF06A', textColor: '#FFFFFF', hasStroke: true, images: [] },
-	{ label: 'NPC', bgColor: '#FDF5C8', textColor: '#FFFFFF', hasStroke: true, images: [] },
-	{ label: '拉完了', bgColor: '#FFFFFF', textColor: '#FFFFFF', hasStroke: true, images: [] }
+const tierList = ref([{
+	label: '夯',
+	bgColor: '#D5171C',
+	img: 'hang',
+	textColor: '#FFFFFF',
+	hasStroke: true,
+	images: [],
+	width: 60,
+},
+{
+	label: '顶级',
+	bgColor: '#FF6A0B',
+	img: 'dingji',
+	textColor: '#FFFFFF',
+	hasStroke: true,
+	images: [],
+	width: 104,
+},
+{
+	label: '人上人',
+	bgColor: '#FFF06A',
+	img: 'renshangren',
+	textColor: '#FFFFFF',
+	hasStroke: true,
+	images: [],
+	width: 156,
+},
+{
+	label: 'NPC',
+	bgColor: '#FDF5C8',
+	img: 'npc',
+	textColor: '#FFFFFF',
+	hasStroke: true,
+	images: [],
+	width: 110,
+},
+{
+	label: '拉完了',
+	bgColor: '#FFFFFF',
+	img: 'lawanle',
+	textColor: '#FFFFFF',
+	hasStroke: true,
+	images: [],
+	width: 156,
+}
 ]);
 
 // --- 生命周期：加载缓存 ---
 onLoad(() => {
+	// 进入页面埋点
+	proxy.$apiUserEvent('all', {
+		type: 'click',
+		key: 'ranking',
+		value: "从夯倒拉排名"
+	})
+	// 获取缓存数据
 	const cache = uni.getStorageSync('ranking_config_data');
 	if (cache) {
 		title.value = cache.title || title.value;
@@ -163,7 +227,9 @@ const getDragStyle = (tIdx, iIdx) => {
 			transition: 'none'
 		};
 	}
-	return { transition: 'transform 0.3s ease' };
+	return {
+		transition: 'transform 0.3s ease'
+	};
 };
 
 const onTouchStart = (e, tIdx, iIdx) => {
@@ -187,7 +253,11 @@ const onTouchMove = (e) => {
 const onTouchEnd = () => {
 	if (drag.tierIndex === -1) return;
 
-	const { tierIndex, imgIdx, moveX } = drag;
+	const {
+		tierIndex,
+		imgIdx,
+		moveX
+	} = drag;
 	const rowData = tierList.value[tierIndex].images;
 
 	// 估算单个item跨度 (100rpx宽度 + 12rpx间距 ≈ 56px，建议根据真机微调)
@@ -228,7 +298,10 @@ const deleteImage = (tIdx, iIdx) => {
 
 const onRightClick = async () => {
 	if (isEdit.value) {
-		uni.showLoading({ title: '正在持久化图片...', mask: true });
+		uni.showLoading({
+			title: '正在持久化图片...',
+			mask: true
+		});
 		// 1. 深度遍历并持久化所有临时图片
 		for (let tierIdx = 0; tierIdx < tierList.value.length; tierIdx++) {
 			const tier = tierList.value[tierIdx];
@@ -258,7 +331,10 @@ const onRightClick = async () => {
 			tierList: tierList.value
 		});
 		uni.hideLoading();
-		uni.showToast({ title: '已保存', icon: 'none' });
+		uni.showToast({
+			title: '已保存',
+			icon: 'none'
+		});
 	}
 	isEdit.value = !isEdit.value;
 	rightButtonText.value = isEdit.value ? "确定" : "编辑";
@@ -304,7 +380,10 @@ const removeLocalFile = (path) => {
 };
 
 const handleSave = () => {
-	uni.showLoading({ title: '生成中...', mask: true });
+	uni.showLoading({
+		title: '生成中...',
+		mask: true
+	});
 	isSnapshot.value = true;
 };
 
@@ -317,8 +396,13 @@ const onPainterSuccess = (path) => {
 
 	uni.saveImageToPhotosAlbum({
 		filePath: path,
-		success: () => uni.showToast({ title: '保存成功' }),
-		fail: () => uni.showToast({ title: '保存失败', icon: 'none' }),
+		success: () => uni.showToast({
+			title: '保存成功'
+		}),
+		fail: () => uni.showToast({
+			title: '保存失败',
+			icon: 'none'
+		}),
 		complete: done
 	});
 };
@@ -358,7 +442,7 @@ const changeRowBgColor = (index) => {
 
 	// 自动适配文字颜色 (深色背景用白色，浅色用黑色)
 	const darkColors = ['#D5171C', '#1777FF', '#333333'];
-	tierList.value[index].textColor = darkColors.includes(colors[nextIdx]) ? '#FFFFFF' : '#333333';
+	tierList.value[index].textColor = darkColors.includes(colors[nextIdx]) ? '#FFFFFF' : '#FFFFFF';
 };
 
 /**
@@ -459,13 +543,13 @@ function hslToHex(h, s, l) {
 	flex: 1;
 	display: flex;
 	align-items: center;
-	padding: 14rpx 8rpx;
+	padding: 14rpx 12rpx;
 	flex-wrap: wrap;
 }
 
 .item-wrapper {
-	width: 100rpx;
-	height: 100rpx;
+	width: 105rpx;
+	height: 105rpx;
 	position: relative;
 	margin: 0 6rpx;
 	touch-action: none;
@@ -526,6 +610,8 @@ function hslToHex(h, s, l) {
 .bottom-tabs {
 	position: fixed;
 	bottom: 40rpx;
+	bottom: calc(32rpx + env(safe-area-inset-bottom));
+	bottom: calc(32rpx + constant(safe-area-inset-bottom));
 	width: 100%;
 	display: flex;
 	justify-content: center;
@@ -559,6 +645,7 @@ function hslToHex(h, s, l) {
 	}
 
 	.title {
+		width: 260px;
 		position: absolute;
 		top: 30rpx;
 		left: 50%;
@@ -570,10 +657,10 @@ function hslToHex(h, s, l) {
 	}
 
 	.title-input {
+		min-width: 260px;
 		background: rgba(255, 255, 255, 0.5);
 		border-radius: 8rpx;
 		padding: 4rpx 12rpx;
-		width: 300rpx;
 		border: 1rpx dashed #1777FF;
 	}
 
diff --git a/pages/shopping/jingdong/add-order/add-order.vue b/pages/shopping/jingdong/add-order/add-order.vue
index 336d848..281b92f 100644
--- a/pages/shopping/jingdong/add-order/add-order.vue
+++ b/pages/shopping/jingdong/add-order/add-order.vue
@@ -7,27 +7,334 @@
 				<text>{{ item.label }}</text>
 			</view>
 		</view>
+
+		<!-- 等待付款 -->
+		<template v-if="activeTab == 'dengdaifukuan'">
+			<view class="tip-box">
+				<picker mode="multiSelector" :range="timeRange" :value="timeValue" @change="handleTimeChange">
+					<text>还剩
+						<text style="color: #DD223F;font-weight: 500; margin-left: 10rpx;">{{ order.statusDesc }}</text>
+						<image class="edit-icon" src="/static/image/common/edit.png"></image>
+						订单自动取消
+					</text>
+				</picker>
+			</view>
+			<view class="address-info">
+				<view class="flex-1">
+					<view>
+						<image class="location" src="/static/image/shopping/jingdong/detail/location.png"></image>
+						<view class="name-box animate-scale">
+							<auto-width-input v-model="order.consignee" fontSize="30rpx" fontWeight="500"
+								placeholder="姓名" />
+							<image class="edit-icon" src="/static/image/common/edit.png"></image>
+						</view>
+						<view class="number-box animate-scale">
+							<auto-width-input v-model="order.phone" fontSize="26rpx" placeholder="电话" color="#8C8C8C" />
+							<image class="edit-icon" src="/static/image/common/edit.png"></image>
+						</view>
+					</view>
+					<view class="address-box animate-scale">
+						<auto-width-input v-model="order.fullAddress" type="textarea" fontSize="26rpx" placeholder="地址"
+							color="#8C8C8C" />
+						<image class="edit-icon" src="/static/image/common/edit.png"></image>
+					</view>
+				</view>
+				<view class="edit-btn">
+					<text>修改</text>
+				</view>
+			</view>
+		</template>
+
+		<!-- 正在出库 -->
+		<template v-if="activeTab == 'zhengzaichuku'">
+			<view class="outbound-info">
+				<image class="outbound-icon" src="/static/image/shopping/jingdong/detail/xiadan.png" mode="aspectFit">
+				</image>
+				<view class="outbound-info-content">
+					<view class="title-info">
+						<view>
+							<text>已下单 </text>
+							<text>预计明天 09:00-15:00送达</text>
+						</view>
+						<uni-icons type="right" size="10" color="#1A1A1A"></uni-icons>
+					</view>
+					<text class="desc">快递运输 · 温馨提示：您的订单预计3月11日09:00- 15:53送达</text>
+					<view class="address-box">
+						<view class="top">
+							<text class="address">华哈哈哈哈哈哈哈哈哈2栋 22-1</text>
+							<view class="edit-btn">修改</view>
+						</view>
+						<view class="phone">肖战123****1234</view>
+					</view>
+				</view>
+			</view>
+		</template>
+
+		<!-- 已取消 -->
+		<template v-if="activeTab == 'yiquxiao'">
+			<view class="cancel-progress-box">
+				<view class="cancel-content">
+					<view class="title-row">
+						<view class="left">
+							<image class="icon" src="/static/image/shopping/jingdong/detail/tuikuan.png"
+								mode="aspectFit">
+							</image>
+							<text class="title">取消/退款进度</text>
+						</view>
+
+						<uni-icons type="right" size="10" color="#1A1A1A"></uni-icons>
+					</view>
+					<text class="desc">您的订单已取消，请查看取消进度详情。</text>
+				</view>
+			</view>
+
+			<view class="order-status-box">
+				<view class="status-main">
+					<image class="status-icon" src="/static/image/shopping/jingdong/detail/xiadan.png" mode="aspectFit">
+					</image>
+					<view class="status-content">
+						<view class="title-row">
+							<text class="title">已下单</text>
+							<uni-icons type="right" size="10" color="#1A1A1A"></uni-icons>
+						</view>
+					</view>
+				</view>
+				<view class="progress-box">
+					<text class="desc">您提交了订单，请等待系统确认</text>
+				</view>
+				<view class="bottom-box">
+					<view class="dot"></view>
+					<view>
+						<text class="desc">华哈哈哈哈哈哈哈哈哈2栋 22-1</text>
+						<view class="name">肖战123****1234</view>
+					</view>
+				</view>
+			</view>
+		</template>
+
+		<!-- 签收 -->
+		<template v-if="activeTab == 'yiqianshou'">
+			<view class="order-status-box">
+				<view class="status-main">
+					<image class="status-icon" src="/static/image/shopping/jingdong/detail/qianshou.png"
+						mode="aspectFit">
+					</image>
+					<view class="status-content">
+						<view class="title-row">
+							<text class="title" style="color: #1A1A1A;">已签收</text>
+							<uni-icons type="right" size="10" color="#1A1A1A"></uni-icons>
+						</view>
+					</view>
+				</view>
+				<view class="progress-box" style="height: 192rpx;">
+					<text class="text">快递运输 · 温馨提示：您的订单预计3月11日09:00- 15:53送达</text>
+					<view class="upload-box">
+						<view class="info-box">
+							<view class="image-box">
+
+							</view>
+							<text class="name">肖战</text>
+						</view>
+						<view class="btn-box">
+							<view class="btn grey">联系Ta</view>
+							<view class="btn red">打赏Ta</view>
+						</view>
+
+					</view>
+				</view>
+				<view class="bottom-box">
+					<view class="dot"></view>
+					<view>
+						<text class="desc">华哈哈哈哈哈哈哈哈哈2栋 22-1</text>
+						<view class="name">肖战123****1234</view>
+					</view>
+				</view>
+			</view>
+		</template>
+
+		<!-- 商品卡片 -->
+		<view class="product-card">
+			<view class="title-box">
+				<view class="left-box">
+					<image class="img" src="/static/image/shopping/jingdong/detail/ziyin.png"></image>
+					<view class="title flex animate-scale">
+						<auto-width-input v-model="order.products[0].name" fontSize="26rpx" fontWeight="700"
+							placeholder="请输入店铺名称" color="#1A1A1A" />
+						<image class="edit-icon" src="/static/image/common/edit.png"></image>
+					</view>
+				</view>
+				<uni-icons class="right-icon" size="14" color="#1A1A1A" type="right"></uni-icons>
+			</view>
+			<view class="product-info">
+				<view class="image-box" @click="chooseImage">
+					<view v-if="!order.products[0].image" class="w100 h100 flex flex-center"
+						style="background-color: #eeeeee;">
+						<image style="width: 60rpx;height: 60rpx;" src="/static/image/common/add.png"></image>
+					</view>
+					<image v-else class="w100 h100" :src="order.products[0].image"></image>
+				</view>
+				<view class="info-box">
+					<view class="name flex animate-scale">
+						<auto-width-input class="name" v-model="order.products[0].title" fontSize="26rpx"
+							fontWeight="700" placeholder="商品标题名称" color="#1A1A1A" />
+						<image class="edit-icon" src="/static/image/common/edit.png"></image>
+					</view>
+					<view class="flex flex-align-center animate-scale">
+						<auto-width-input class="desc" v-model="order.products[0].desc" type="textarea" fontSize="22rpx"
+							placeholder="商品描述" color="#87868E" />
+						<image class="edit-icon" src="/static/image/common/edit.png"></image>
+					</view>
+
+					<view class="flex flex-align-center animate-scale">
+						<auto-width-input class="desc" v-model="order.products[0].service" type="textarea"
+							fontSize="22rpx" placeholder="请输入服务" color="#A96F24" />
+						<image class="edit-icon" src="/static/image/common/edit.png"></image>
+					</view>
+				</view>
+				<view class="price-box">
+					<view class="price wx-font-medium flex-align-center animate-scale">￥<text
+							style="font-size: 36rpx;">{{ order.totalPrice }}</text>
+						<!-- <auto-width-input style="min-width: 20px;" class="price" v-model="order.products[0].price"
+							type="number" fontSize="36rpx" placeholder="价格" color="#1A1A1A" fontWeight="500" />
+						<image class="edit-icon" style="margin-left: 0;" src="/static/image/common/edit.png"></image> -->
+					</view>
+				</view>
+			</view>
+			<view v-if="activeTab == 'dengdaifukuan' || activeTab == 'yiquxiao'" class="btn-box flex"
+				style="margin-top: 60rpx;">
+				<view class="left flex-1 flex-center " style="border-right : 1rpx solid #D8D8D8;">
+					<image class="img" src="/static/image/shopping/jingdong/detail/dianpukefu.png"></image>
+					<view class="name flex-column flex-align-center">
+						<text>店铺客服</text>
+						<text v-if="activeTab == 'dengdaifukuan'" class="text">商品/活动</text>
+					</view>
+				</view>
+				<view class="right flex-1 flex-center ">
+					<image class="img" src="/static/image/shopping/jingdong/detail/jingdongkefu.png"></image>
+					<view class="name flex-column flex-align-center">
+						<text>京东客服</text>
+						<text v-if="activeTab == 'dengdaifukuan'" class="text">物流/平台</text>
+					</view>
+				</view>
+			</view>
+			<view v-else class="btn-box">
+				<view class="btn" :class="{ red: btn == '送朋友' }" v-for="btn in btnList">
+					<image v-if="btn == '送朋友'" class="icon" src="/static/image/shopping/jingdong/detail/gift.png">
+					</image>
+					{{ btn }}
+				</view>
+			</view>
+		</view>
+
+		<!-- 商品总价 -->
+		<view v-if="activeTab == 'dengdaifukuan' || activeTab == 'yiquxiao'" class="product-price">
+			<view class="title flex-justify-between">
+				<text>商品总价</text>
+				<view class="wx-font-medium flex flex-align-center"><text
+						style="font-size: 32rpx;font-weight: 500;">￥</text>
+					<auto-width-input class="wx-font-medium" v-model="order.totalPrice" fontSize="32rpx"
+						placeholder="商品总价" color="#1A1A1A" fontWeight="500" type="number" />
+					<image class="edit-icon" src="/static/image/common/edit.png"></image>
+				</view>
+			</view>
+			<view class="item flex-justify-between">
+				<text class="label">运费</text>
+				<view class="wx-font-medium flex flex-align-center">￥
+					<auto-width-input class="wx-font-medium" v-model="order.carriage" fontSize="32rpx" placeholder="运费"
+						color="#1A1A1A" fontWeight="500" type="number" />
+					<image class="edit-icon" src="/static/image/common/edit.png"></image>
+				</view>
+			</view>
+			<view class="price">需付款 <text class="number wx-font-medium">￥{{ (Number(order.totalPrice) +
+				Number(order.carriage))
+			}}</text></view>
+		</view>
+
+
 	</view>
 </template>
 
 <script setup>
 import { onLoad } from "@dcloudio/uni-app";
-import { ref } from "vue";
+import { ref, computed } from "vue";
 
-import { shoppingType } from "../json/order.json"
+import { shoppingType, shoppingClassfiy } from "../json/order.json";
+import AutoWidthInput from "@/components/common/auto-width-input.vue";
 
 const activeTab = ref("dengdaifukuan");
 const navTitle = ref("新增订单");
+const order = ref(shoppingClassfiy[activeTab.value]);
+
+// 初始化默认地址信息，防止渲染时为空
+if (order.value) {
+	order.value.consignee = order.value.consignee || "肖战";
+	order.value.phone = order.value.phone || "152633221112";
+	order.value.fullAddress = order.value.fullAddress || "上海市浦东新区世纪大道123号";
+}
+
+// 时间选择器数据
+const timeRange = ref([
+	Array.from({ length: 24 }, (_, i) => (i < 10 ? '0' + i : i + '')), // 时
+	Array.from({ length: 60 }, (_, i) => (i < 10 ? '0' + i : i + '')),  // 分
+	Array.from({ length: 60 }, (_, i) => (i < 10 ? '0' + i : i + ''))   // 秒
+]);
+
+// 当前选择器索引
+const timeValue = computed(() => {
+	if (!order.value || !order.value.statusDesc) return [0, 0, 0];
+	const parts = order.value.statusDesc.split(' : ');
+	if (parts.length !== 3) return [0, 0, 0];
+	return [
+		parseInt(parts[0]) || 0,
+		parseInt(parts[1]) || 0,
+		parseInt(parts[2]) || 0
+	];
+});
+
+/**
+ * 修改倒计时时间
+ */
+const handleTimeChange = (e) => {
+	const val = e.detail.value;
+	const h = timeRange.value[0][val[0]];
+	const m = timeRange.value[1][val[1]];
+	const s = timeRange.value[2][val[2]];
+	order.value.statusDesc = `${h} : ${m} : ${s}`;
+};
 
 onLoad((options) => {
 });
 
+/**
+ * 选择图片
+ */
+const chooseImage = () => {
+	uni.chooseImage({
+		count: 1,
+		sizeType: ['original', 'compressed'],
+		sourceType: ['album', 'camera'],
+		success: (res) => {
+			order.value.products[0].image = res.tempFilePaths[0];
+		}
+	});
+}
+
+/**
+ * 切换tab
+ * @param item 
+ */
 const switchTab = (item) => {
 	activeTab.value = item.key;
+	order.value = shoppingClassfiy[activeTab.value];
+	if (order.value) {
+		order.value.consignee = order.value.consignee || "肖战";
+		order.value.phone = order.value.phone || "152633221112";
+		order.value.fullAddress = order.value.fullAddress || "上海市浦东新区世纪大道123号";
+	}
 }
 </script>
 
-<style lang="less">
+<style lang="less" scoped>
 .tab-box {
 	padding: 22rpx 24rpx;
 	display: flex;
@@ -58,4 +365,623 @@ const switchTab = (item) => {
 	}
 
 }
+
+.title-box {
+	display: flex;
+	align-items: center;
+
+	.wait-icon {
+		width: 40rpx;
+		height: 40rpx;
+		margin-right: 12rpx;
+	}
+
+	text {
+		font-size: 36rpx;
+		font-weight: 500;
+		color: #1a1a1a;
+	}
+}
+
+.right-box {
+	display: flex;
+
+	.icon {
+		width: 40rpx;
+		height: 40rpx;
+		margin-left: 20rpx;
+	}
+}
+
+.tip-box {
+	width: 100%;
+	text-align: center;
+	font-size: 26rpx;
+	line-height: 26rpx;
+	color: #1a1a1a;
+	margin-bottom: 16rpx;
+}
+
+.address-info {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 30rpx 22rpx;
+	background-color: #ffffff;
+	border-radius: 24rpx;
+	margin: 0 16rpx;
+
+	.location {
+		width: 28rpx;
+		height: 28rpx;
+		margin-right: 14rpx;
+	}
+
+	.name-box,
+	.number-box {
+		display: inline-flex;
+		align-items: center;
+		vertical-align: middle;
+		margin-right: 16rpx;
+	}
+
+	.address-box {
+		display: flex;
+		align-items: center;
+		margin-top: 8rpx;
+	}
+
+	.name {
+		font-size: 30rpx;
+		color: #1A1A1A;
+		font-weight: 500;
+	}
+
+	.number {
+		font-size: 26rpx;
+		color: #8C8C8C;
+	}
+
+	.address {
+		color: #8C8C8C;
+		font-size: 26rpx;
+		line-height: 42rpx;
+	}
+
+	.edit-btn {
+
+		height: 54rpx;
+		border-radius: 8rpx;
+		border: 1rpx solid #C5C5C5;
+		padding: 0 52rpx;
+		font-size: 26rpx;
+		line-height: 52rpx;
+		color: #1A1A1A;
+		margin-left: 28rpx;
+
+		text {
+			white-space: nowrap;
+		}
+
+	}
+}
+
+.outbound-info {
+	display: flex;
+	align-items: flex-start;
+	background-color: #ffffff;
+	border-radius: 24rpx;
+	margin: 10rpx 16rpx;
+	padding: 22rpx 22rpx 30rpx;
+
+	.outbound-icon {
+		width: 46rpx;
+		height: 46rpx;
+		margin-right: 16rpx;
+	}
+
+	.outbound-info-content {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+
+		.title-info {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			font-size: 30rpx;
+			line-height: 46rpx;
+			font-weight: 500;
+			color: #1A1A1A;
+		}
+
+		.desc {
+			margin-top: 4rpx;
+			font-size: 26rpx;
+			color: #8C8C8C;
+			line-height: 36rpx;
+		}
+
+		.address-box {
+			margin-top: 18rpx;
+
+			.top {
+				display: flex;
+				justify-content: space-between;
+
+				.edit-btn {
+					width: 116rpx;
+					height: 54rpx;
+					border-radius: 8rpx 8rpx 8rpx 8rpx;
+					border: 1rpx solid #C5C5C5;
+					text-align: center;
+					font-size: 26rpx;
+					line-height: 50rpx;
+					color: #1A1A1A;
+				}
+			}
+
+			.address {
+				font-size: 30rpx;
+				line-height: 30rpx;
+				color: #1A1A1A;
+				font-weight: 500;
+				margin-top: 8rpx;
+			}
+
+			.phone {
+				font-size: 26rpx;
+				color: #8C8C8C;
+				line-height: 26rpx;
+			}
+		}
+	}
+}
+
+.cancel-progress-box {
+	display: flex;
+	align-items: center;
+	background-color: #ffffff;
+	border-radius: 24rpx;
+	margin: 10rpx 16rpx;
+	padding: 26rpx 22rpx 30rpx;
+
+	.cancel-icon {
+		width: 60rpx;
+		height: 60rpx;
+		margin-right: 16rpx;
+	}
+
+	.cancel-content {
+		flex: 1;
+
+		.title-row {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+
+			.left {
+				display: flex;
+				align-items: center;
+			}
+
+			.icon {
+				width: 46rpx;
+				height: 46rpx;
+				margin-right: 16rpx;
+			}
+
+			.title {
+				font-size: 30rpx;
+				line-height: 30rpx;
+				font-weight: 500;
+				color: #1A1A1A;
+			}
+		}
+
+		.desc {
+			margin-top: 4rpx;
+			font-size: 26rpx;
+			color: #8C8C8C;
+			line-height: 36rpx;
+		}
+	}
+}
+
+.order-status-box {
+	background-color: #ffffff;
+	border-radius: 24rpx;
+	margin: 16rpx;
+	padding: 22rpx 22rpx 30rpx;
+
+	.status-main {
+		display: flex;
+		align-items: flex-start;
+
+		.status-icon {
+			width: 46rpx;
+			height: 46rpx;
+			margin-right: 16rpx;
+		}
+
+		.status-content {
+			flex: 1;
+
+			.title-row {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				.title {
+					font-size: 28rpx;
+					font-weight: 700;
+					color: #E40C24;
+				}
+			}
+
+			.desc {
+				margin-top: 4rpx;
+				font-size: 26rpx;
+				color: #8C8C8C;
+				line-height: 36rpx;
+			}
+		}
+	}
+
+	.progress-box {
+		margin-left: 22rpx;
+		border-left: 0.5px solid #F83021;
+		margin-top: 6rpx;
+		padding-left: 40rpx;
+		font-size: 26rpx;
+		color: #8C8C8C;
+		height: 62rpx;
+
+
+		.text {
+			font-size: 26rpx;
+			color: #8C8C8C;
+			line-height: 36rpx;
+		}
+
+		.upload-box {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			background-color: #F7F8FC;
+			margin-top: 18rpx;
+			border-radius: 8rpx;
+			padding: 6rpx;
+
+			.info-box {
+				display: flex;
+				align-items: center;
+			}
+
+			.btn-box {
+				display: flex;
+
+				.btn {
+					margin-left: 16rpx;
+					border-radius: 8rpx;
+					height: 46rpx;
+					line-height: 42rpx;
+					font-size: 22rpx;
+					color: #1A1A1A;
+					line-height: 46rpx;
+					padding: 0 22rpx;
+				}
+
+				.grey {
+					border: 0.5px solid #C5C5C5;
+					color: #1A1A1A;
+				}
+
+				.red {
+					border: 0.5px solid #ED1C04;
+					color: #ED1C04;
+				}
+			}
+
+			.image-box {
+				width: 56rpx;
+				height: 56rpx;
+				background: #CBCEDA;
+				border-radius: 50%;
+				overflow: hidden;
+				margin-right: 14rpx;
+			}
+
+			.name {
+				font-size: 22rpx;
+				color: #3D3D3D;
+			}
+		}
+	}
+
+	.bottom-box {
+		display: flex;
+		padding-left: 16rpx;
+
+		.dot {
+			width: 14rpx;
+			height: 14rpx;
+			background: #F83021;
+			opacity: 0.5;
+			border-radius: 50%;
+			margin-right: 32rpx;
+			margin-top: 12rpx;
+		}
+
+		.desc {
+			font-size: 30rpx;
+			color: #1A1A1A;
+			line-height: 30rpx;
+			font-weight: 500;
+		}
+
+		.name {
+			font-size: 26rpx;
+			color: #8C8C8C;
+			line-height: 26rpx;
+			margin-top: 12rpx;
+		}
+	}
+
+	.address-timeline {
+		position: relative;
+		margin-top: 10rpx;
+		padding-left: 76rpx;
+
+		.line {
+			position: absolute;
+			left: 29rpx;
+			top: -40rpx;
+			bottom: 30rpx;
+			width: 2rpx;
+			background-color: #F8D3D7;
+		}
+
+		.dot {
+			position: absolute;
+			left: 21rpx;
+			bottom: 40rpx;
+			width: 18rpx;
+			height: 18rpx;
+			background-image: radial-gradient(circle, #F8A7AD 100%, transparent);
+			border-radius: 50%;
+		}
+
+		.info {
+			display: flex;
+			flex-direction: column;
+
+			.address {
+				font-size: 28rpx;
+				font-weight: 700;
+				color: #1A1A1A;
+				line-height: 42rpx;
+			}
+
+			.user {
+				margin-top: 4rpx;
+				font-size: 24rpx;
+				color: #8C8C8C;
+				line-height: 36rpx;
+			}
+		}
+	}
+}
+
+.product-card {
+	padding: 28rpx 22rpx;
+	margin: 16rpx;
+	background-color: #FFFFFF;
+	border-radius: 24rpx;
+
+	.title-box {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+
+		.left-box {
+			display: flex;
+			align-items: center;
+			flex: 1;
+			width: 200px;
+
+			.img {
+				width: 50rpx;
+				height: 26rpx;
+				margin-right: 8rpx;
+				flex-shrink: 0;
+			}
+
+			.title {
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				font-size: 26rpx;
+				color: #1A1A1A;
+				line-height: 26rpx;
+				font-weight: 700;
+			}
+		}
+
+
+
+		.right-icon {
+			margin-left: 12rpx;
+		}
+	}
+
+	.product-info {
+		display: flex;
+		margin-top: 14rpx;
+
+		.image-box {
+			width: 152rpx;
+			height: 152rpx;
+			border-radius: 24rpx;
+			overflow: hidden;
+			margin-right: 24rpx;
+		}
+
+		.info-box {
+			flex: 1;
+			margin-right: 44rpx;
+			overflow: hidden;
+
+			.name {
+				width: 100%;
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				font-size: 26rpx;
+				color: #1A1A1A;
+				line-height: 26rpx;
+				font-weight: 700;
+			}
+
+			.desc {
+				margin-top: 16rpx;
+				font-size: 22rpx;
+				color: #87868E;
+				display: -webkit-box;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+			}
+
+			.tag {
+				font-size: 22rpx;
+				color: #A96F24;
+				margin-top: 18rpx;
+			}
+		}
+
+		.price-box {
+			font-weight: 500;
+			font-size: 28rpx;
+			color: #1A1A1A;
+
+			.price {
+				font-weight: 500;
+			}
+		}
+	}
+
+	.btn-box {
+		display: flex;
+		justify-content: flex-end;
+		margin-top: 26rpx;
+
+		.btn {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 144rpx;
+			white-space: nowrap;
+			font-size: 22rpx;
+			line-height: 22rpx;
+			height: 60rpx;
+			line-height: 58rpx;
+			border-radius: 8rpx;
+			border: 1rpx solid #C7C7C7;
+			color: #1A1A1A;
+			margin-left: 22rpx;
+
+			.icon {
+				width: 28rpx;
+				height: 28rpx;
+				margin-right: 6rpx;
+			}
+
+
+		}
+
+		.red {
+			color: #F10F1A;
+			border: 0.5px solid #F10F1A;
+		}
+
+
+		.img {
+			width: 32rpx;
+			height: 32rpx;
+			flex-shrink: 0;
+			margin-right: 14rpx;
+		}
+	}
+
+	.name {
+		font-size: 26rpx;
+		color: #1A1A1A;
+	}
+
+	.text {
+		font-size: 22rpx;
+		color: #87868E;
+		line-height: 24rpx;
+		margin-top: 8rpx;
+	}
+}
+
+.product-price {
+	background-color: #FFFFFF;
+	padding: 38rpx 22rpx;
+	border-radius: 24rpx;
+	margin: 16rpx;
+
+	.title {
+		font-size: 32rpx;
+		color: #1A1A1A;
+		line-height: 32rpx;
+		font-weight: 700;
+	}
+
+	.item {
+		margin-top: 36rpx;
+
+		.label {
+			color: #87868E;
+			font-size: 26rpx;
+			line-height: 26rpx;
+		}
+
+		.value {
+			font-size: 32rpx;
+			line-height: 32rpx;
+			font-weight: 500;
+		}
+	}
+
+	.price {
+		display: flex;
+		justify-content: flex-end;
+		margin-top: 32rpx;
+		font-size: 26rpx;
+		color: #ED1C04;
+		line-height: 26rpx;
+		font-weight: 500;
+		align-items: baseline;
+
+		.number {
+			font-size: 36rpx;
+			font-weight: 500;
+			margin-left: 6rpx;
+		}
+	}
+}
 </style>
+<style>
+/* 直接在页面导入公共样式 */
+@import '/common/main.css';
+
+.edit-icon {
+	width: 28rpx;
+	height: 28rpx;
+	margin-left: 0;
+	flex-shrink: 0;
+}
+</style>
\ No newline at end of file
diff --git a/pages/shopping/jingdong/json/order.json b/pages/shopping/jingdong/json/order.json
index 703b473..9584e3a 100644
--- a/pages/shopping/jingdong/json/order.json
+++ b/pages/shopping/jingdong/json/order.json
@@ -5,15 +5,19 @@
             "shopType": "self",
             "shopName": "安野屋 (AARYE) 京联名哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好梦",
             "status": "等待付款",
-            "statusDesc": "20小时11分钟",
+            "statusDesc": "18 : 25 : 46",
+            "consignee": "肖战",
+            "phone": "152633221112",
+            "fullAddress": "上海市浦东新区世纪大道123号",
+            "totalPrice": "69.00",
+            "carriage": "0.00",
             "products": [
                 {
-                    "image": "/static/image/shopping/jingdong/product1.png",
-                    "title": "安野哈哈哈哈哈哈哈哈哈哈哈哈好好",
+                    "image": "",
+                    "name": "哈哈哈哈哈",
+                    "title": "安野屋（AARYE）红红火火恍恍惚惚哈哈哈哈哈好",
                     "desc": "联名哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好梦",
-                    "tags": [
-                        "无理由退货政策"
-                    ],
+                    "service": "无理由退货政策",
                     "price": "69.00",
                     "count": "1"
                 }
diff --git a/pages/shopping/jingdong/list-index.vue b/pages/shopping/jingdong/list-index.vue
index ccec90e..8dc10a3 100644
--- a/pages/shopping/jingdong/list-index.vue
+++ b/pages/shopping/jingdong/list-index.vue
@@ -1,11 +1,11 @@
 <template>
 	<view class="top-fixed">
-		<nav-bar title="京东" bgColor="#F0F4F9">
+		<nav-bar title="京东" bgColor="#F0F4F9" :buttonGroup="buttonGroup" @button-click="util.clickTitlePopupButton">
 			<template v-slot:center>
 				<view class="search-box">
 					<image class="search-icon" src="/static/image/shopping/jingdong/search-icon.png" mode="aspectFit">
 					</image>
-					<input class="input" type="text" placeholder="搜索我的订单" disabled />
+					<input class="input" type="text" placeholder="搜索我的订单" />
 				</view>
 			</template>
 			<template v-slot:right>
@@ -69,7 +69,7 @@
 		<view class="action-menu-bubble" :style="{ left: actionMenuState.x + 'px', top: actionMenuState.y + 'px' }"
 			@click.stop>
 			<view class="menu-item" @click.stop="editOrder">修改</view>
-			<view class="bubble-arrow"></view>
+			<view class="menu-line"></view>
 			<view class="menu-item" @click.stop="handleDeleteOrder">删除</view>
 			<view class="bubble-arrow"></view>
 		</view>
@@ -79,33 +79,85 @@
 <script setup>
 import { ref, computed, onMounted, getCurrentInstance } from 'vue';
 import ShoppingCard from '@/components/shopping/jingdong/shopping-card.vue';
+import { util } from '@/utils/common.js';
 
 const showActionMenu = ref(false);
 const actionMenuState = ref({ x: 0, y: 0, item: null });
 
+//导航栏菜单按钮
+const buttonGroup = [
+	{
+		name: "新增购物",
+		click: () => {
+			uni.navigateTo({
+				url: '/pages/shopping/jingdong/add-order/add-order'
+			});
+		}
+	},
+]
+/**
+ * 长按弹出气泡菜单
+ * @param data 
+ */
 const handleLongPress = (data) => {
-	let touch = data.event.touches[0];
-	if (!touch && data.event.changedTouches) touch = data.event.changedTouches[0];
-	if (touch) {
+	console.log("长按", data);
+	const event = data.event;
+	let x = 0;
+	let y = 0;
+
+	// 兼容不同平台的坐标获取
+	if (event.touches && event.touches.length > 0) {
+		x = event.touches[0].clientX;
+		y = event.touches[0].clientY;
+	} else if (event.changedTouches && event.changedTouches.length > 0) {
+		x = event.changedTouches[0].clientX;
+		y = event.changedTouches[0].clientY;
+	} else {
+		// 兜底处理 (如模拟器点击或 detail 携带)
+		x = event.clientX || (event.detail && event.detail.x) || 0;
+		y = event.clientY || (event.detail && event.detail.y) || 0;
+	}
+
+	if (x || y) {
 		actionMenuState.value = {
-			x: touch.clientX,
-			y: touch.clientY,
+			x: x,
+			y: y,
 			item: data.item
 		};
 		showActionMenu.value = true;
+	} else {
+		console.warn("无法获取长按坐标");
 	}
 };
 
+/**
+ * 修改订单
+ */
+const editOrder = () => {
+	const item = actionMenuState.value.item;
+	if (!item) return;
+	showActionMenu.value = false;
+	uni.navigateTo({
+		url: '/pages/shopping/jingdong/add-order/add-order?id=' + item.id + '&type=' + item.shopType
+	});
+};
+
+/**
+ * 点击订单卡片
+ * @param item 订单项
+ */
 const handleCardClick = (item) => {
 	if (item.shopType !== "waimai") {
 		uni.navigateTo({
 			url: '/pages/shopping/jingdong/order-detail/order-detail?id=' + item.id
 		});
-	}
+	} else {
 
+	}
 };
 
 
+
 /**
  * 删除订单
  */
@@ -229,7 +281,7 @@ const mockOrderList = ref([
 				image: '/static/image/shopping/jingdong/product1.png',
 				title: '超值哈哈哈哈哈哈哈哈哈哈哈哈哈哈好一人份',
 				desc: '不支持7天无理由退货',
-				tags: [],
+				service: "",
 				price: '69.00',
 				count: 1,
 			}
@@ -250,6 +302,7 @@ const mockOrderList = ref([
 				image: '/static/image/shopping/jingdong/product1.png',
 				title: '超值哈哈哈哈哈哈哈哈哈哈哈哈哈哈好热 少糖',
 				desc: '不支持7天无理由退货',
+				service: "",
 				tags: [],
 				price: '69.00',
 				count: 1,
@@ -269,6 +322,7 @@ const mockOrderList = ref([
 				image: '/static/image/shopping/jingdong/product1.png',
 				title: '超值哈哈哈哈哈哈哈哈哈哈哈哈哈哈好热 少糖',
 				desc: '不支持7天无理由退货',
+				service: "",
 				tags: [],
 				price: '69.00',
 				count: 1,
@@ -286,6 +340,7 @@ const mockOrderList = ref([
 				image: '/static/image/shopping/jingdong/product1.png',
 				title: '多肉桃桃哈哈哈哈哈哈哈哈哈哈好和和好',
 				desc: '不支持7天无理由退货',
+				service: "",
 				tags: [],
 				price: '69.00',
 				count: 1,
@@ -327,6 +382,7 @@ const mockOrderList = ref([
 				title: '多肉桃桃哈哈哈哈哈哈哈哈哈哈好和和好',
 				desc: '不支持7天无理由退货',
 				tags: [],
+				service: "",
 				price: '69.00',
 				count: 1,
 			}
@@ -344,6 +400,7 @@ const mockOrderList = ref([
 				title: '安野哈哈哈哈哈哈哈哈哈哈哈哈好好',
 				desc: '联名哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好梦',
 				tags: ['无理由退货政策'],
+				service: "无理由退货政策",
 				price: '69.00',
 				count: 1,
 			}
@@ -365,6 +422,7 @@ const mockOrderList = ref([
 				title: '安野哈哈哈哈哈哈哈哈哈哈哈哈好好',
 				desc: '联名哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好梦',
 				tags: ['无理由退货政策'],
+				service: "无理由退货政策",
 				price: '69.00',
 				count: 1,
 			}
@@ -387,6 +445,7 @@ const mockOrderList = ref([
 				title: '安野哈哈哈哈哈哈哈哈哈哈哈哈好好',
 				desc: '联名哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好梦',
 				tags: ['无理由退货政策'],
+				service: "无理由退货政策",
 				price: '69.00',
 				count: 1,
 			}
@@ -407,6 +466,7 @@ const mockOrderList = ref([
 				title: '安野哈哈哈哈哈哈哈哈哈哈哈哈好好',
 				desc: '联名哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好梦',
 				tags: ['无理由退货政策'],
+				service: "无理由退货政策",
 				price: '1669.00',
 				count: 1,
 			}
@@ -425,6 +485,7 @@ const mockOrderList = ref([
 				title: '安野哈哈哈哈哈哈哈哈哈哈哈哈好好',
 				desc: '联名哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好梦',
 				tags: ['无理由退货政策'],
+				service: "无理由退货政策",
 				price: '1669.00',
 				count: 1,
 			}
diff --git a/static/image/common/edit.png b/static/image/common/edit.png
new file mode 100644
index 0000000..09bc8cb
Binary files /dev/null and b/static/image/common/edit.png differ
diff --git a/static/image/other/dingji.png b/static/image/other/dingji.png
new file mode 100644
index 0000000..6e98fca
Binary files /dev/null and b/static/image/other/dingji.png differ
diff --git a/static/image/other/hang.png b/static/image/other/hang.png
new file mode 100644
index 0000000..889bdf4
Binary files /dev/null and b/static/image/other/hang.png differ
diff --git a/static/image/other/lawanle.png b/static/image/other/lawanle.png
new file mode 100644
index 0000000..bc8f976
Binary files /dev/null and b/static/image/other/lawanle.png differ
diff --git a/static/image/other/npc.png b/static/image/other/npc.png
new file mode 100644
index 0000000..816422b
Binary files /dev/null and b/static/image/other/npc.png differ
diff --git a/static/image/other/ranking/dingji.png b/static/image/other/ranking/dingji.png
new file mode 100644
index 0000000..e0213c6
Binary files /dev/null and b/static/image/other/ranking/dingji.png differ
diff --git a/static/image/other/ranking/dingji_skin.png b/static/image/other/ranking/dingji_skin.png
new file mode 100644
index 0000000..754ec6e
Binary files /dev/null and b/static/image/other/ranking/dingji_skin.png differ
diff --git a/static/image/other/ranking/hang.png b/static/image/other/ranking/hang.png
new file mode 100644
index 0000000..e0ff1fb
Binary files /dev/null and b/static/image/other/ranking/hang.png differ
diff --git a/static/image/other/ranking/hang_skin.png b/static/image/other/ranking/hang_skin.png
new file mode 100644
index 0000000..3154568
Binary files /dev/null and b/static/image/other/ranking/hang_skin.png differ
diff --git a/static/image/other/ranking/lawanle.png b/static/image/other/ranking/lawanle.png
new file mode 100644
index 0000000..1a043d2
Binary files /dev/null and b/static/image/other/ranking/lawanle.png differ
diff --git a/static/image/other/ranking/lawanle_skin.png b/static/image/other/ranking/lawanle_skin.png
new file mode 100644
index 0000000..38c8e64
Binary files /dev/null and b/static/image/other/ranking/lawanle_skin.png differ
diff --git a/static/image/other/ranking/npc.png b/static/image/other/ranking/npc.png
new file mode 100644
index 0000000..2d0f093
Binary files /dev/null and b/static/image/other/ranking/npc.png differ
diff --git a/static/image/other/ranking/npc_skin.png b/static/image/other/ranking/npc_skin.png
new file mode 100644
index 0000000..2ec8a30
Binary files /dev/null and b/static/image/other/ranking/npc_skin.png differ
diff --git a/static/image/other/ranking/renshangren.png b/static/image/other/ranking/renshangren.png
new file mode 100644
index 0000000..e3f1376
Binary files /dev/null and b/static/image/other/ranking/renshangren.png differ
diff --git a/static/image/other/ranking/renshangren_skin.png b/static/image/other/ranking/renshangren_skin.png
new file mode 100644
index 0000000..9bb0e44
Binary files /dev/null and b/static/image/other/ranking/renshangren_skin.png differ
diff --git a/static/image/other/renshangren.png b/static/image/other/renshangren.png
new file mode 100644
index 0000000..6227157
Binary files /dev/null and b/static/image/other/renshangren.png differ