完成易购商品的立即购买功能

packages/shop/goods/index.css

@@ -271,24 +271,6 @@ image {
     height: 40rpx;
 }
 
-.car_right {
-    width: 470rpx;
-    height: 70rpx;
-    background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
-    border-radius: 100rpx 100rpx 100rpx 100rpx;
-    font-size: 36rpx;
-    color: #FFFFFF;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    margin-top: 26rpx;
-}
-
-.car_right_disabled {
-    background: #CCCCCC;
-    color: #FFFFFF;
-}
-
 .cars {
     display: flex;
     flex-direction: column;
@@ -311,13 +293,6 @@ image {
     top: -10rpx;
 }
 
-.car_right .input {
-    font-size: 36rpx;
-    color: #FFFFFF;
-    font-weight: 700;
-}
-
-
 .shadow {
     background: rgba(0, 0, 0, 0.4);
     position: fixed;
@@ -569,7 +544,6 @@ image {
 
 .popup-header {
     display: flex;
-    width: 90%;
     padding-left: 80rpx;
     margin: 20rpx 0;
 }
@@ -623,8 +597,12 @@ image {
     border-radius: 40rpx;
     padding: 10rpx 15rpx;
     white-space: nowrap;
+    margin: 20rpx 30rpx;
+    display: inline-block;
+    width: auto;
 }
 
+
 .itemSize_active {
     background: #FF370B;
     color: #fff;
@@ -640,6 +618,7 @@ image {
 .itemSize_top {
     display: flex;
     margin-left: 30rpx;
+    position: relative;
 }
 
 .itemSize_info {
@@ -657,4 +636,201 @@ image {
     font-weight: 500;
     margin-top: 10rpx;
     color: red;
+}
+
+.car_right_box {
+    display: flex;
+    font-size: 30rpx;
+}
+
+.car_right {
+    width: 220rpx;
+    height: 70rpx;
+    /* background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%); */
+    background: #ff712c;
+    border-radius: 20rpx 0 0 20rpx;
+    color: #FFFFFF;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-top: 26rpx;
+}
+
+.seckill {
+    width: 220rpx;
+    height: 70rpx;
+    background: #ff3b31;
+    border-radius: 0 20rpx 20rpx 0;
+    color: #FFFFFF;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-top: 26rpx;
+}
+
+.car_right2 {
+    width: 470rpx;
+    height: 70rpx;
+    background: #ffb1a5;
+    border-radius: 100rpx 100rpx 100rpx 100rpx;
+    font-size: 36rpx;
+    color: #FFFFFF;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-top: 26rpx;
+}
+
+/* 立即购买弹窗样式 */
+.address-section {
+    background-color: #fff;
+}
+
+.address-info {
+    padding: 20rpx 30rpx;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-bottom: 1rpx solid #eee;
+    margin-bottom: 20rpx;
+    font-size: 26rpx;
+    font-weight: bold;
+}
+
+.address-main {
+    flex: 1;
+}
+
+.address-name-phone {
+    display: flex;
+    align-items: center;
+    margin-bottom: 10rpx;
+}
+
+.name {
+    margin-right: 20rpx;
+}
+
+.phone {
+    color: #666;
+}
+
+.address-detail {
+    color: #666;
+    line-height: 40rpx;
+    display: flex;
+    align-items: center;
+}
+
+.copy-icon {
+    width: 30rpx;
+    height: 30rpx;
+    background: url('https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_copy.png') no-repeat center;
+    background-size: contain;
+    margin-left: 10rpx;
+}
+
+.address-arrow {
+    color: #999;
+}
+
+.quantity-control {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    position: absolute;
+    bottom: 10rpx;
+    right: 40rpx;
+}
+
+.decrease-btn {
+    width: 40rpx;
+    height: 40rpx;
+    background-color: #f5f5f5;
+    border: 1rpx solid #ccc;
+    border-radius: 50%;
+    line-height: 33rpx;
+    text-align: center;
+    font-size: 28rpx;
+    color: #333;
+}
+
+.increase-btn {
+    width: 40rpx;
+    height: 40rpx;
+    background-color: #ff502a;
+    border-radius: 50%;
+    line-height: 33rpx;
+    text-align: center;
+    font-size: 28rpx;
+    color: #ffffff;
+}
+
+.quantity {
+    font-size: 28rpx;
+    color: #333;
+    margin: 0 20rpx;
+    min-width: 40rpx;
+    text-align: center;
+}
+
+.payment-section {
+    background-color: #fff;
+    margin-bottom: 20rpx;
+    margin-top: 15rpx;
+}
+
+.payment-item {
+    padding: 30rpx;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-bottom: 1rpx solid #eee;
+}
+
+.payment-icon {
+    width: 40rpx;
+    height: 40rpx;
+    margin-right: 20rpx;
+}
+
+.payment-icon image {
+    width: 100%;
+    height: 100%;
+}
+
+.payment-content {
+    flex: 1;
+}
+
+.payment-name {
+    font-size: 28rpx;
+    margin-bottom: 5rpx;
+}
+
+.payment-desc {
+    font-size: 26rpx;
+    color: #333;
+}
+
+.payment-select {
+    color: #FF7658;
+}
+
+.pay-button {
+    width: 50%;
+    height: 70rpx;
+    margin: 0 auto;
+    line-height: 70rpx;
+    text-align: center;
+    background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
+    color: #fff;
+    font-size: 34rpx;
+    font-weight: bold;
+    border-radius: 50rpx;
+}
+
+.car_right_buy {
+    width: 220rpx;
+    margin-left: 20rpx;
 }

packages/shop/goods/index.vue

@@ -175,23 +175,29 @@
 				</view>
 			</view>
 
-			<view class="car_right" v-if="
+			<view class="car_right_box">
-				info.commodity_goods_info_list[currentGGIndex].stock_quantity > 0 &&
+				<view class="car_right" v-if="
-				(!info.commodity_goods_info_list[currentGGIndex].cart_count ||
+					info.commodity_goods_info_list[currentGGIndex].stock_quantity > 0 &&
-					info.commodity_goods_info_list[currentGGIndex].cart_count.count == 0)
+					(!info.commodity_goods_info_list[currentGGIndex].cart_count ||
-			" @click="addCar">
+						info.commodity_goods_info_list[currentGGIndex].cart_count.count == 0)
-				加入购物车
+				" @click="addCar">
+					加入购物车
+				</view>
+
+				<view class="car_right" @click="changeCar" v-if="
+					info.commodity_goods_info_list[currentGGIndex].cart_count.count > 0
+					&& info.commodity_goods_info_list[currentGGIndex].stock_quantity > 0
+				">
+					加入购物车
+				</view>
+
+				<view class="seckill" v-if="info.commodity_goods_info_list[currentGGIndex].stock_quantity != 0"
+					@click="showBuyPopup">
+					立即购买
+				</view>
 			</view>
 
-			<view class="car_right" @click="changeCar" v-if="
+			<view class="car_right2" v-if="info.commodity_goods_info_list[currentGGIndex].stock_quantity < 1">
-				info.commodity_goods_info_list[currentGGIndex].cart_count.count > 0
-				&& info.commodity_goods_info_list[currentGGIndex].stock_quantity > 0
-			">
-				加入购物车
-			</view>
-
-			<view class="car_right car_right_disabled"
-				v-if="info.commodity_goods_info_list[currentGGIndex].stock_quantity < 1">
 				已售罄
 			</view>
 		</view>
@@ -298,7 +304,7 @@
 					<view class="itemSize_name" style="display: flex;">
 						<view v-if="currentGG.is_same_day" class="isDay">当日达</view>{{ changeName }}
 					</view>
-					<view class="itemSize_price">￥{{ changePrice }}/袋</view>
+					<view class="itemSize_price">￥{{ changePrice }}/{{ goodsUnit }}</view>
 				</view>
 			</view>
 			<view class="itemSizeBox" v-for="(item, index) in info.commodity_goods_info_list" :key="item.id"
@@ -307,6 +313,75 @@
 					{{ item.goods_spec }} / {{ item.goods_unit }}</text>
 			</view>
 		</u-popup>
+
+		<!-- 立即购买 -->
+		<u-popup :show="showBuy" round="20rpx" mode="bottom" @close="closeBuy">
+			<view class="popup-header">
+				<h3 class="popup-header-h3">立即购买</h3>
+				<view class="popup-header-view" @click="closeBuy">取消</view>
+			</view>
+			<view class="address-section">
+				<view class="address-info" @click="editAddress()">
+					<view class="address-main" v-if="defAddress && Object.keys(defAddress).length > 0">
+						<view class="address-name-phone">
+							<text class="name">{{ defAddress.name }}</text>
+							<text class="phone">{{ defAddress.phone }}</text>
+						</view>
+						<view class="address-detail">
+							{{ defAddress.address }}{{ defAddress.house_number }}
+							<view class="copy-icon" @click.stop="copyAddress" />
+						</view>
+					</view>
+					<view class="address-main" v-else>
+						<view class="address-name-phone">
+							<text class="name">请选择收货地址</text>
+						</view>
+					</view>
+					<view class="address-arrow"><u-icon name="arrow-right" size="25"></u-icon></view>
+				</view>
+			</view>
+			<view class="itemSize_top">
+				<image :src="changeImg" class="itemSize-img"></image>
+				<view class="itemSize_info">
+					<view class="itemSize_name">{{ changeName }}</view>
+					<view class="itemSize_price">￥{{ changePrice }}/{{ goodsUnit }}</view>
+				</view>
+				<view class="quantity-control">
+					<view class="decrease-btn" @tap.stop="decreaseQuantity()">-</view>
+					<view class="quantity">{{ changeCount }}</view>
+					<view class="increase-btn" @tap.stop="increaseQuantity()">+</view>
+				</view>
+			</view>
+			<view class="itemSize" v-for="(item, index) in info.commodity_goods_info_list" :key="item.id"
+				@click="changeGG(item, index)" :class="index == currentGGIndex ? 'itemSize_active' : ''">
+				{{ item.goods_name }} {{ item.goods_spec }} / {{ item.goods_unit }}
+			</view>
+			<view class="fenge"></view>
+			<!-- 支付方式 -->
+			<view class="payment-section">
+				<view class="payment-item" @click="selectPayment('wechat')">
+					<view class="payment-icon">
+						<image
+							src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_wechat.png"
+							mode="aspectFit"></image>
+					</view>
+					<view class="payment-content">
+						<view class="payment-name">微信支付</view>
+					</view>
+					<view class="payment-select" v-if="selectedPayment === 'wechat'">
+						<image
+							src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check2.png"
+							mode="aspectFit" style="width: 30rpx; height: 30rpx;"></image>
+					</view>
+					<view class="payment-select" v-else>
+						<image
+							src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check1.png"
+							mode="aspectFit" style="width: 30rpx; height: 30rpx;"></image>
+					</view>
+				</view>
+			</view>
+			<view class="pay-button" @click="submitBuyOrder">立即支付</view>
+		</u-popup>
 	</view>
 </template>
 
@@ -345,10 +420,16 @@ export default {
 			comments: [],
 			show: false,
 			showSize: false,
+			// 立即购买相关
+			showBuy: false,
+			changeCount: 0,
+			defAddress: {},
+			selectedPayment: 'wechat', // 默认微信支付
 
 			changeImg: "",
 			changeName: "",
 			changePrice: "",
+			goodsUnit: "",
 			selectedGoods: null, // 保存传入的商品规格信息
 			qrcodePath: null, // 存储当前页面的二维码路径
 		};
@@ -478,6 +559,7 @@ export default {
 				this.changeImg = picUrl + this.currentGG.commodity_pic[0]
 				this.changeName = this.currentGG.goods_alias
 				this.changePrice = this.currentGG.sales_price
+				this.goodsUnit = this.currentGG.goods_unit
 			});
 		},
 
@@ -508,8 +590,73 @@ export default {
 			this.changeImg = picUrl + item.commodity_pic[0]
 			this.changeName = item.goods_alias
 			this.changePrice = item.sales_price
+			this.goodsUnit = item.goods_unit
 			this.getComment(item.goods_id)
 		},
+		// 立即购买相关方法
+		showBuyPopup() {
+			this.changeCount = 1;
+			this.showBuy = true;
+			// 检查是否有选中的地址
+			const selectedAddress = uni.getStorageSync('selectedAddress');
+			if (selectedAddress && Object.keys(selectedAddress).length > 0) {
+				this.defAddress = selectedAddress;
+				// 清除选中状态，避免重复应用
+				uni.removeStorageSync('selectedAddress');
+			} else {
+				// 如果没有选中的地址，则获取默认地址
+				this.getUserAddress();
+			}
+		},
+		closeBuy() {
+			this.showBuy = false;
+			uni.removeStorageSync('selectedAddress');
+			this.changeCount = 1;
+		},
+		editAddress() {
+			NavgateTo('/packages/shop/address/index');
+		},
+		// 数量加减
+		decreaseQuantity() {
+			if (this.changeCount > 1) {
+				this.changeCount--;
+			}
+		},
+		increaseQuantity() {
+			const stock = this.info.commodity_goods_info_list[this.currentGGIndex].stock_quantity;
+			if (this.changeCount < stock) {
+				this.changeCount++;
+			} else {
+				uni.showToast({
+					title: '库存不足',
+					icon: 'none'
+				});
+			}
+		},
+		// 获取默认收货地址
+		getUserAddress() {
+			request(apiArr.getUserDefAddress, "POST", {}).then(res => {
+				this.defAddress = res.default_address;
+			});
+		},
+		// 选择支付方式
+		selectPayment(type) {
+			this.selectedPayment = type;
+		},
+		// 复制收货地址
+		copyAddress() {
+			if (this.defAddress && Object.keys(this.defAddress).length > 0) {
+				uni.setClipboardData({
+					data: this.defAddress.address + this.defAddress.house_number,
+					success: () => {
+						uni.showToast({
+							title: '地址复制成功',
+							icon: 'success'
+						});
+					}
+				});
+			}
+		},
 		car() {
 			NavgateTo("../shopCar/index");
 		},
@@ -627,6 +774,69 @@ export default {
 		closeSize() {
 			this.showSize = false;
 		},
+		// 提交立即购买订单
+		submitBuyOrder() {
+			// 检查是否选择了收货地址
+			if (!this.defAddress || !this.defAddress.address) {
+				uni.showToast({
+					title: '请选择收货地址',
+					icon: 'none'
+				});
+				return;
+			}
+
+			// 根据平台设置不同的trans_type值
+			// 小程序: 71, App: 51
+			const systemInfo = uni.getSystemInfoSync();
+			let trans_type = 51; // 默认App环境
+
+			// 运行时判断是否为小程序环境
+			if (systemInfo.platform === 'devtools' || systemInfo.platform === 'unknown') {
+				trans_type = 71; // 开发工具或未知环境默认为小程序
+			}
+
+			// 条件编译：针对不同平台设置不同值
+			// #ifdef MP
+			trans_type = 71; // 所有小程序平台
+			// #endif
+
+			// #ifdef APP-PLUS
+			trans_type = 51; // App平台
+			// #endif
+
+			// 原始逻辑：创建订单后再进行支付
+			const params = {
+				user_id: uni.getStorageSync('userId'),
+				// 固定设置为1
+				order_cate: 1,
+				goods_list: [{
+					supplier_id: this.info.supplier_id,
+					supplier_name: this.currentGG.supplier_name || '',
+					is_same_day: this.currentGG.is_same_day,
+					receiving_name: this.defAddress.name,
+					receiving_phone: this.defAddress.phone,
+					receiving_address: this.defAddress.address + this.defAddress.house_number,
+					merchant_id: this.defAddress.address_id,
+					goods_and_count: [{
+						goods_id: this.currentGG.id,
+						count: this.changeCount,
+						price: this.currentGG.sales_price
+					}]
+				}]
+			}
+			console.log("🚀 ~ params:", params)
+
+			request(apiArr.createOrder, "POST", params).then(resVal => {
+				const param = {
+					order_id: resVal.order_id,
+					user_id: uni.getStorageSync('userId'),
+					trans_type: trans_type
+				}
+				request(apiArr.mergePreorder, "POST", param).then(res => {
+					this.handleMergePreorderResponse(res, resVal.order_id);
+				})
+			})
+		},
 		// 获取评论
 		getComment(id) {
 			let params = {}

packages/shop/groupPurchaseDetail/index.css

@@ -909,7 +909,6 @@ image {
 }
 
 .itemSize {
-    width: 30%;
     font-size: 26rpx;
     color: #333;
     background: #F6F7FB;
@@ -917,6 +916,8 @@ image {
     padding: 10rpx 15rpx;
     white-space: nowrap;
     margin: 20rpx 30rpx;
+    display: inline-block;
+    width: auto;
 }
 
 .itemSize_active {

packages/shop/groupPurchaseDetail/index.vue

@@ -324,7 +324,7 @@
         <image :src="changeImg" class="itemSize-img"></image>
         <view class="itemSize_info">
           <view class="itemSize_name">{{ changeName }}</view>
-          <view class="itemSize_price">￥{{ changePrice }}/袋</view>
+          <view class="itemSize_price">￥{{ changePrice }}/{{ goodsUnit }}</view>
         </view>
       </view>
       <view class="itemSize" v-for="(item, index) in info.commodity_goods_info_list" :key="item.id"
@@ -382,7 +382,7 @@
         <image :src="changeImg" class="itemSize-img"></image>
         <view class="itemSize_info">
           <view class="itemSize_name">{{ changeName }}</view>
-          <view class="itemSize_price">￥{{ changePrice }}/袋</view>
+          <view class="itemSize_price">￥{{ changePrice }}/{{ goodsUnit }}</view>
         </view>
         <view class="quantity-control">
           <view class="decrease-btn" @tap.stop="decreaseQuantity()">-</view>
@@ -557,6 +557,7 @@ export default {
       changeImg: "",
       changeName: "",
       changePrice: "",
+      goodsUnit: "",
 
       endTime: "",
       endTheCountdownDay: '',
@@ -1043,6 +1044,7 @@ export default {
           this.changeImg = this.currentGG.commodity_pic[0];
           this.changeName = this.currentGG.goods_alias;
           this.changePrice = this.currentGG.sales_price;
+          this.goodsUnit = this.currentGG.goods_unit;
         } else {
           // 商品列表为空时的处理
           this.currentGG = null;
@@ -1050,6 +1052,7 @@ export default {
           this.changeImg = '';
           this.changeName = '';
           this.changePrice = '';
+          this.goodsUnit = '';
         }
       });
     },
@@ -1079,6 +1082,7 @@ export default {
       this.changeImg = item.commodity_pic[0]
       this.changeName = item.goods_alias
       this.changePrice = item.sales_price
+      this.goodsUnit = item.goods_unit;
     },
     car() {
       const item = {