From 89de2bbaf2e81ab3fa7a8c2aad3b76bc81033d3d Mon Sep 17 00:00:00 2001
From: xuxueyang <xuxy@fengyuntec.com>
Date: 星期二, 23 七月 2024 18:44:27 +0800
Subject: [PATCH] update 订单功能(花店端)

---
 sub_pages/customer/trade/detail.vue |  607 ++++++++++++++++++++++++++++--------------------------
 1 files changed, 315 insertions(+), 292 deletions(-)

diff --git a/sub_pages/customer/trade/detail.vue b/sub_pages/customer/trade/detail.vue
index f1330a8..5575bf8 100644
--- a/sub_pages/customer/trade/detail.vue
+++ b/sub_pages/customer/trade/detail.vue
@@ -1,345 +1,368 @@
 <template>
-	<view class="trade-detail">
-		<view class="top-img-container">
-			<image src="" class="top-img"></image>
-			<view class="icon-container">
-				<image src="../../../static/common/icon-sc.png" class="icon-sc"></image>
-				<view class="num">12</view>
-			</view>
-			<view class="icon-container">
-				<image src="../../../static/common/icon-shop.png" class="icon-shop"></image>
+  <view class="trade-detail">
+    <view class="top-img-container">
+      <image :src="dto.cover" class="top-img"></image>
+      <view class="icon-container">
+        <image src="../../../static/common/icon-sc.png" class="icon-sc"></image>
+        <view class="num">12</view>
+      </view>
+      <view class="icon-container">
+        <image src="../../../static/common/icon-shop.png" class="icon-shop"></image>
 
-			</view>
-		</view>
-		<view class="info-container">
-			<view class="title">
-				<view class="level m-r-15">B级</view>
-				<view class="">
-					{{dto.name || '-'}}
-				</view>
-			</view>
-			<view class="desc m-t-12">
-				<view class="m-r-15">已售:7</view>
-				<view class="m-r-15">剩余:13</view>
-				<view class=" ">10支/扎</view>
-			</view>
-			<view class="flex m-t-12">
-				<view class="price m-r-a">
-					<span class="num">28.01</span>
-					元/扎
-				</view>
-				<view class="m-l-a m-r-15">
-					<image src="../../../static/common/icon-kf.png" class="icon-kf m-l-15 img100"></image>
+      </view>
+    </view>
+    <view class="trade-info-container">
+      <view class="title">
+        <view class="level m-r-15">{{ dto.levelStr || '-' }}级</view>
+        <view class="">
+          {{ dto.name || '-' }}
+        </view>
+      </view>
+      <view class="desc m-t-12">
+        <view class="m-r-15">已售:{{ dto.sales || 0 }}</view>
+        <view class="m-r-15">剩余:{{ dto.stock || 0 }}</view>
+        <view class=" ">{{ dto.unit || '-' }}支/扎</view>
+      </view>
+      <view class="flex m-t-12">
+        <view class="price m-r-a">
+          <span class="num">{{ dto.price || '-' }}</span>
+          元/扎
+        </view>
+        <view class="m-l-a m-r-15">
+          <image src="../../../static/common/icon-kf.png" class="icon-kf m-l-15 img100"></image>
 
-				</view>
-				<view class="m-r-0 gwc">
-					+ 购物车
-				</view>
-			</view>
-		</view>
-		<view class="line">
+        </view>
+        <view class="m-r-0 gwc" @click="submitShopping(dto)">
+          + 购物车
+        </view>
+      </view>
+    </view>
+    <view class="line">
 
-		</view>
-		<view class="info-detail">
-			<view class="title-before-blue" style="padding-top: 0rpx;padding-bottom: 0rpx;">详情</view>
-			<view class="flex m-t-8">
-				<view class="label">枝长:</view>
-				<view class="value">70-75cm</view>
-			</view>
-			<view class="flex m-t-8">
-				<view class="label">枝粗:</view>
-				<view class="value">中等粗细</view>
-			</view>
-			<view class="flex m-t-8">
-				<view class="label">均匀度:</view>
-				<view class="value">1-2支不均匀</view>
-			</view>
-		</view>
-		<view class="line">
+    </view>
+    <view class="info-detail" v-if="dto.params">
+      <view class="title-before-blue" style="padding-top: 0rpx;padding-bottom: 0rpx;">详情</view>
+      <view class="flex m-t-8" v-for="(param,index) of dto.params" :key="index">
+        <view class="label">{{ param.name}}:</view>
+        <view class="value">{{ param.value || '-'}}</view>
+      </view>
+<!--      <view class="flex m-t-8">-->
+<!--        <view class="label">枝粗:</view>-->
+<!--        <view class="value">中等粗细</view>-->
+<!--      </view>-->
+<!--      <view class="flex m-t-8">-->
+<!--        <view class="label">均匀度:</view>-->
+<!--        <view class="value">1-2支不均匀</view>-->
+<!--      </view>-->
+    </view>
+    <view class="line">
 
-		</view>
+    </view>
 
-		<view class="info-brand m-t-12" @click.stop="openbrand">
-			<view class="title-before-blue" style="padding-top: 0rpx;padding-bottom: 0rpx;">店铺</view>
-			<view class="flex">
-				<image class="store-logo"></image>
-				<view>
-					<view class="store-name">花仙子</view>
-					<view class="store-address">云南省-昆明市-官渡区</view>
-				</view>
-				<view class="store-to m-l-a m-r-0">进入店铺</view>
-			</view>
-		</view>
-		<view class="m-t-20 shop-recommend-container">
-			<view class="shop-recommend-title">店铺推荐</view>
-			<view class="flex">
-				<view v-for="i in 3" :key="i" class="shop-recommend">
-					<image src="" class="shop-recommend-image"></image>
-					<view class="shop-recommend-title m-t-8">
-						<view class="level m-r-15">B级</view>
-						<view class="">
-							{{dto.name || '-'}}
-						</view>
-					</view>
-					<view class="shop-recommend-price m-t-8">
-						¥23.01/扎
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="line">
+    <view class="info-brand m-t-12" @click.stop="openbrand">
+      <view class="title-before-blue" style="padding-top: 0rpx;padding-bottom: 0rpx;">店铺</view>
+      <view class="flex">
+        <image class="store-logo"></image>
+        <view>
+          <view class="store-name">{{dto.supplierName||'-'}}</view>
+          <view class="store-address">{{dto.supplierStation||'-'}}</view>
+        </view>
+        <view class="store-to m-l-a m-r-0">进入店铺</view>
+      </view>
+    </view>
+    <view class="m-t-20 shop-recommend-container"  v-if="false">
+      <view class="shop-recommend-title">店铺推荐</view>
+      <view class="flex">
+        <view v-for="i in 3" :key="i" class="shop-recommend">
+          <image src="" class="shop-recommend-image"></image>
+          <view class="shop-recommend-title m-t-8">
+            <view class="level m-r-15">B级</view>
+            <view class="">
+              {{ dto.name || '-' }}
+            </view>
+          </view>
+          <view class="shop-recommend-price m-t-8">
+            ¥23.01/扎
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="line">
 
-		</view>
-		<view class="comment-container m-t-12">
-			<view class="title-before-blue" style="padding-top: 0rpx;padding-bottom: 0rpx;">
-				<view>评价</view>
-				<view class="desc">
-					7条评论
-					<uni-icons type="right" size="18" color="#B3B3B3"></uni-icons>
+    </view>
+    <view class="comment-container m-t-12" v-if="false">
+      <view class="title-before-blue" style="padding-top: 0rpx;padding-bottom: 0rpx;">
+        <view>评价</view>
+        <view class="desc">
+          7条评论
+          <uni-icons type="right" size="18" color="#B3B3B3"></uni-icons>
 
-				</view>
-			</view>
-			<view v-for="i in 3" :key="i" class="m-t-20 flex user-item">
-				<image class="user-icon m-r-10"></image>
-				<view>
-					<view class="name">用户名3370</view>
-					<view class="comment">非常棒,会回购</view>
-				</view>
-				<view class="stars">
+        </view>
+      </view>
+      <view v-for="i in 3" :key="i" class="m-t-20 flex user-item">
+        <image class="user-icon m-r-10"></image>
+        <view>
+          <view class="name">用户名3370</view>
+          <view class="comment">非常棒,会回购</view>
+        </view>
+        <view class="stars">
 
-				</view>
-				<view class="date">
-					04-07 08:00
-				</view>
-			</view>
-		</view>
+        </view>
+        <view class="date">
+          04-07 08:00
+        </view>
+      </view>
+    </view>
 
-	</view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				dto: {
+export default {
+  data() {
+    return {
+      id: '',
+      dto: {}
+    }
+  },
+  onLoad(options) {
+    this.id = options.id || ''
+    if (this.id) {
+      this.getDetail()
+    }
+  },
+  methods: {
+    async getDetail() {
+      this.$message.showLoading()
+      const {
+        code,
+        data
+      } = await this.$http.request('get', '/api/customer/flower/list/view', {
+        params: {
+          id: this.id
+        }
+      })
+      if (code === 0) {
+        this.dto = {
+          ...data,
+        }
+      }
 
-				}
-			}
-		},
-		methods: {
-			openbrand() {
-				uni.navigateTo({
-					url: '/sub_pages/customer/shop/shop?id=' + (this.dto.id || '')
-				})
-			}
-		}
-	}
+      this.$message.hideLoading()
+
+    },
+    openbrand() {
+      uni.navigateTo({
+        url: '/sub_pages/customer/shop/shop?id=' + (this.dto.id || '')
+      })
+    }
+  }
+}
 </script>
 
 <style lang="scss" scoped>
-	.trade-detail {
-		background-color: #FFFFFF;
+.trade-detail {
+  background-color: #FFFFFF;
 
-		.info-container {
-			padding: 46rpx 30rpx;
-			border-radius: 40rpx 40rpx 0rpx 0rpx;
+  .trade-info-container {
+    padding: 46rpx 30rpx;
+    border-radius: 40rpx 40rpx 0rpx 0rpx;
 
-			.title {
-				font-weight: 600;
-				font-size: 36rpx;
-				color: #000000;
-				line-height: 50rpx;
+    .title {
+      font-weight: 600;
+      font-size: 36rpx;
+      color: #000000;
+      line-height: 50rpx;
 
-				.level {
-					color: #20613D;
-				}
-			}
+      .level {
+        color: #20613D;
+      }
+    }
 
-			.desc {
-				font-weight: 400;
-				font-size: 28rpx;
-				color: #666666;
-				line-height: 40rpx;
-			}
+    .desc {
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #666666;
+      line-height: 40rpx;
+    }
 
-			.price {
-				font-weight: 600;
-				font-size: 28rpx;
-				color: #CF0000;
-				line-height: 40rpx;
+    .price {
+      font-weight: 600;
+      font-size: 28rpx;
+      color: #CF0000;
+      line-height: 40rpx;
 
-				.num {
-					font-size: 48rpx;
-					line-height: 66rpx;
-				}
-			}
+      .num {
+        font-size: 48rpx;
+        line-height: 66rpx;
+      }
+    }
 
-			.icon-kf {
-				width: 44rpx;
-				height: 44rpx;
-			}
+    .icon-kf {
+      width: 44rpx;
+      height: 44rpx;
+    }
 
-			.gwc {
-				width: 168rpx;
-				height: 48rpx;
-				border-radius: 30rpx;
-				border: 2rpx solid #20613D;
-				font-size: 24rpx;
-				color: #20613D;
-				line-height: 48rpx;
-				text-align: center;
-			}
+    .gwc {
+      width: 168rpx;
+      height: 48rpx;
+      border-radius: 30rpx;
+      border: 2rpx solid #20613D;
+      font-size: 24rpx;
+      color: #20613D;
+      line-height: 48rpx;
+      text-align: center;
+    }
 
-		}
+  }
 
-		.line {
-			min-height: 20rpx;
-			background: #F7F7F7;
-		}
+  .line {
+    min-height: 20rpx;
+    background: #F7F7F7;
+  }
 
-		.info-detail {
-			padding: 18rpx 30rpx;
+  .info-detail {
+    padding: 18rpx 30rpx;
 
-			.label {
-				font-weight: 400;
-				font-size: 28rpx;
-				color: #666666;
-				line-height: 40rpx;
-				min-width: 160rpx;
-				margin-right: 20rpx;
-			}
+    .label {
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #666666;
+      line-height: 40rpx;
+      min-width: 160rpx;
+      margin-right: 20rpx;
+    }
 
-			.value {
-				font-weight: 400;
-				font-size: 28rpx;
-				color: #666666;
-				line-height: 40rpx;
-			}
-		}
+    .value {
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #666666;
+      line-height: 40rpx;
+    }
+  }
 
-		.shop-recommend-title {
-			font-weight: 400;
-			font-size: 24rpx;
-			color: #666666;
-			line-height: 34rpx;
-		}
+  .shop-recommend-title {
+    font-weight: 400;
+    font-size: 24rpx;
+    color: #666666;
+    line-height: 34rpx;
+  }
 
 
-		.shop-recommend-container {
-			padding: 24rpx 30rpx;
+  .shop-recommend-container {
+    padding: 24rpx 30rpx;
 
-			.shop-recommend {
-				.shop-recommend-image {
-					width: 214rpx;
-					height: 214rpx;
-					background-size: 100% 100%;
-					border-radius: 8rpx;
-				}
+    .shop-recommend {
+      .shop-recommend-image {
+        width: 214rpx;
+        height: 214rpx;
+        background-size: 100% 100%;
+        border-radius: 8rpx;
+      }
 
-				.shop-recommend-title {
-					font-weight: 600;
-					font-size: 28rpx;
-					color: #000000;
-					line-height: 40rpx;
+      .shop-recommend-title {
+        font-weight: 600;
+        font-size: 28rpx;
+        color: #000000;
+        line-height: 40rpx;
 
-					.level {
-						color: #20613D;
-						;
-					}
-				}
-			}
-		}
+        .level {
+          color: #20613D;;
+        }
+      }
+    }
+  }
 
-		.comment-container {
-			padding: 18rpx 30rpx;
+  .comment-container {
+    padding: 18rpx 30rpx;
 
-			.desc {
-				font-weight: 400;
-				font-size: 24rpx;
-				color: #666666;
-				line-height: 34rpx;
-			}
+    .desc {
+      font-weight: 400;
+      font-size: 24rpx;
+      color: #666666;
+      line-height: 34rpx;
+    }
 
-			.user-item {
-				.user-icon {
-					width: 72rpx;
-					height: 72rpx;
-					background-size: 100% 100%;
-					border-radius: 50%;
-				}
+    .user-item {
+      .user-icon {
+        width: 72rpx;
+        height: 72rpx;
+        background-size: 100% 100%;
+        border-radius: 50%;
+      }
 
-				.name {
-					font-weight: 600;
-					font-size: 24rpx;
-					color: #000000;
-					line-height: 34rpx;
-				}
+      .name {
+        font-weight: 600;
+        font-size: 24rpx;
+        color: #000000;
+        line-height: 34rpx;
+      }
 
-				.comment {
-					font-weight: 400;
-					font-size: 24rpx;
-					color: #666666;
-					line-height: 34rpx;
-				}
+      .comment {
+        font-weight: 400;
+        font-size: 24rpx;
+        color: #666666;
+        line-height: 34rpx;
+      }
 
-				.date {
-					font-weight: 400;
-					font-size: 24rpx;
-					color: #666666;
-					line-height: 72rpx;
-				}
-			}
-		}
+      .date {
+        font-weight: 400;
+        font-size: 24rpx;
+        color: #666666;
+        line-height: 72rpx;
+      }
+    }
+  }
 
 
-		.top-img-container {
-			position: relative;
+  .top-img-container {
+    position: relative;
 
-			.top-img {
-				width: 750rpx;
-				height: 764rpx;
-			}
+    .top-img {
+      width: 750rpx;
+      height: 764rpx;
+    }
 
-			.icon-container {
-				position: absolute;
-				top: 20rpx;
-				width: 80rpx;
-				height: 80rpx;
-				background: rgba(0, 0, 0, 0.42);
+    .icon-container {
+      position: absolute;
+      top: 20rpx;
+      width: 80rpx;
+      height: 80rpx;
+      background: rgba(0, 0, 0, 0.42);
 
-				.icon-sc {
-					width: 54rpx;
-					height: 54rpx;
-					margin: 0 auto;
-					margin-top: 12rpx;
-				}
+      .icon-sc {
+        width: 54rpx;
+        height: 54rpx;
+        margin: 0 auto;
+        margin-top: 12rpx;
+      }
 
-				.icon-shop {
-					width: 54rpx;
-					height: 54rpx;
-					margin: 0 auto;
-					margin-top: 12rpx;
-				}
+      .icon-shop {
+        width: 54rpx;
+        height: 54rpx;
+        margin: 0 auto;
+        margin-top: 12rpx;
+      }
 
-				.num {
-					font-weight: 400;
-					font-size: 20rpx;
-					color: #FFFFFF;
-					line-height: 28rpx;
-					position: absolute;
-					top: 6prx;
-					right: 16rpx;
-				}
-			}
+      .num {
+        font-weight: 400;
+        font-size: 20rpx;
+        color: #FFFFFF;
+        line-height: 28rpx;
+        position: absolute;
+        top: 6prx;
+        right: 16rpx;
+      }
+    }
 
-			.icon-container:last-child {
-				left: 120rpx;
-			}
+    .icon-container:last-child {
+      left: 120rpx;
+    }
 
-			.icon-container:first-child {
-				left: 20rpx;
-			}
+    .icon-container:first-child {
+      left: 20rpx;
+    }
 
-		}
-	}
+  }
+}
 </style>
\ No newline at end of file

--
Gitblit v1.9.3