From 8a70b6f369fdee32ceabefdd5abaf42f3c1d25bb Mon Sep 17 00:00:00 2001
From: peng <peng.com>
Date: 星期一, 13 十月 2025 14:57:42 +0800
Subject: [PATCH] 定制商品

---
 pages/order/constomize/constomize.vue |  198 +++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 198 insertions(+), 0 deletions(-)

diff --git a/pages/order/constomize/constomize.vue b/pages/order/constomize/constomize.vue
new file mode 100644
index 0000000..a3fefc4
--- /dev/null
+++ b/pages/order/constomize/constomize.vue
@@ -0,0 +1,198 @@
+<template>
+	<view class="customize-container">
+		<!-- 璁㈠崟淇℃伅澶撮儴 -->
+		<view class="order-header">
+			<view class="order-info">
+				<text class="label">璁㈠崟缂栧彿锛�</text>
+				<text class="value">{{ orderSn }}</text>
+			</view>
+			<view class="template-info">
+				<text class="label">妯℃澘鍚嶇О锛�</text>
+				<text class="value">{{ templateName }}</text>
+			</view>
+		</view>
+		
+		<!-- 閫変腑鐨勬ā鏉挎牱寮� -->
+		<view class="template-preview" v-if="chooseImg">
+			<text class="section-title">閫変腑鐨勬ā鏉垮浘鐗�</text>
+			<view class="image-wrapper">
+				<image :src="chooseImg" mode="widthFix" class="template-image"></image>
+			</view>
+		</view>
+		
+		<!-- 瀹氬埗鍐呭鍒楄〃 -->
+		<view class="content-section">
+			<text class="section-title">瀹氬埗鍐呭</text>
+			<view class="content-list" v-if="customizeList.length > 0">
+				<view class="content-item" v-for="(item, index) in customizeList" :key="index">
+					<view class="item-header">
+						<text class="sub-name">{{ item.subName }}</text>
+					</view>
+					<view class="item-content">
+						<!-- 鏂囨湰绫诲瀷鍐呭 -->
+						<text v-if="item.contentType === 'TEXT'" class="text-content">{{ item.content }}</text>
+						
+						<!-- 鍥剧墖绫诲瀷鍐呭 -->
+						<view v-else-if="item.contentType === 'IMAGE'" class="image-content">
+							<image :src="item.content" mode="widthFix" class="custom-image"></image>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="empty-tip" v-else>
+				鏆傛棤瀹氬埗淇℃伅
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { getOrderCustomize } from "@/api/order.js";
+	export default {
+		data() {
+			return {
+				orderSn: '',
+				templateName: '',
+				chooseImg: '',
+				customizeList: []
+			}
+		},
+		methods: {
+			
+		},
+		async onLoad(options) {
+			if(options.sn){
+				const res = await getOrderCustomize(options.sn)
+				console.log('鑾峰彇鍒扮殑妯℃澘濉啓淇℃伅涓猴細',JSON.stringify(res))
+				if(res.data && res.data.result && res.data.result.length > 0) {
+					// 浠庣涓�涓厓绱犱腑鎻愬彇璁㈠崟淇℃伅
+					const firstItem = res.data.result[0];
+					this.orderSn = firstItem.orderSn || '';
+					this.templateName = firstItem.templateName || '';
+					this.chooseImg = firstItem.chooseImg || '';
+					
+					// 淇濆瓨瀹氬埗鍐呭鍒楄〃
+					this.customizeList = res.data.result;
+				}
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.customize-container {
+		padding: 20rpx;
+		background-color: #f5f5f5;
+		min-height: 100vh;
+	}
+	
+	.order-header {
+		background-color: #fff;
+		padding: 30rpx;
+		border-radius: 10rpx;
+		margin-bottom: 20rpx;
+		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+	}
+	
+	.order-info, .template-info {
+		margin-bottom: 15rpx;
+		display: flex;
+	}
+	
+	.order-info:last-child, .template-info:last-child {
+		margin-bottom: 0;
+	}
+	
+	.label {
+		font-size: 28rpx;
+		color: #666;
+		width: 180rpx;
+	}
+	
+	.value {
+		font-size: 28rpx;
+		color: #333;
+		flex: 1;
+	}
+	
+	.template-preview {
+		background-color: #fff;
+		border-radius: 10rpx;
+		padding: 30rpx;
+		margin-bottom: 20rpx;
+		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+	}
+	
+	.content-section {
+		background-color: #fff;
+		border-radius: 10rpx;
+		padding: 30rpx;
+		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+	}
+	
+	.section-title {
+		font-size: 32rpx;
+		font-weight: bold;
+		color: #333;
+		margin-bottom: 20rpx;
+		display: block;
+	}
+	
+	.image-wrapper {
+		text-align: center;
+	}
+	
+	.template-image {
+		max-width: 100%;
+		border-radius: 10rpx;
+		border: 1rpx solid #eee;
+	}
+	
+	.content-list {
+		display: flex;
+		flex-direction: column;
+		gap: 30rpx;
+	}
+	
+	.content-item {
+		padding: 20rpx;
+		border: 1rpx solid #eee;
+		border-radius: 10rpx;
+	}
+	
+	.item-header {
+		border-bottom: 1rpx solid #eee;
+		padding-bottom: 15rpx;
+		margin-bottom: 15rpx;
+	}
+	
+	.sub-name {
+		font-size: 30rpx;
+		font-weight: bold;
+		color: #333;
+	}
+	
+	.text-content {
+		font-size: 28rpx;
+		color: #666;
+		line-height: 1.6;
+	}
+	
+	.image-content {
+		width: 100%;
+		text-align: center;
+	}
+	
+	.custom-image {
+		max-width: 100%;
+		border-radius: 10rpx;
+	}
+	
+	.empty-tip {
+		text-align: center;
+		padding: 60rpx 0;
+		font-size: 28rpx;
+		color: #999;
+	}
+</style>
\ No newline at end of file

--
Gitblit v1.8.0