diff --git a/components/base/navbar.vue b/components/base/navbar.vue
index 34d6fee..0ec7d43 100644
--- a/components/base/navbar.vue
+++ b/components/base/navbar.vue
@@ -90,7 +90,7 @@
 					return
 				}
 				uni.reLaunch({
-					url: '/pages/index/index'
+					url: '/pages/index/category' // 主页被换成商品页面了
 				})
 			}
 		}
diff --git a/components/base/tabbar.vue b/components/base/tabbar.vue
index 7ee54a7..aef3d18 100644
--- a/components/base/tabbar.vue
+++ b/components/base/tabbar.vue
@@ -33,7 +33,7 @@
 						"selectedIconPath": "/static/image/tabbar/product-list-active.png",
 						"iconPath": "/static/image/tabbar/product-list.png",
 						"pagePath": "/pages/index/category",
-						"title": "商品列表",
+						"title": "首页",
 						key: 'category',
 					},
 					{
@@ -91,7 +91,7 @@
 			z-index: 999999;
 			bottom: 0;
 			left: 0;
-			color: #BCBCBC;
+			color: #000;
 
 			.tabbar-item {
 				flex: 1;
diff --git a/components/couponPopup/newCouponPopup.vue b/components/couponPopup/newCouponPopup.vue
new file mode 100644
index 0000000..c1eff77
--- /dev/null
+++ b/components/couponPopup/newCouponPopup.vue
@@ -0,0 +1,98 @@
+<template>
+    <view class="new-coupon-popup">
+        <uv-popup ref="popup" @change="change" min-height="400rpx" closeable>
+            <view class="coupon-content">
+                <text class="coupon-title">恭喜获得</text>
+                <view class="coupon-list">
+                    <view class="coupon-item">
+                        <text class="coupon-name">优惠券名称</text>
+                        <text class="coupon-desc">优惠券描述</text>
+                    </view>
+                    <view class="coupon-item">
+                        <text class="coupon-name">优惠券名称</text>
+                        <text class="coupon-desc">优惠券描述</text>
+                    </view>
+                </view>
+                <view class="coupon-btn" hover-class="coupon-btn-hover" @click="getCoupon">
+                    <text class="coupon-btn-text">立即领取</text>
+                </view>
+            </view>
+        </uv-popup>
+    </view>
+</template>
+
+<script>
+export default {
+    name: 'newCouponPopup',
+    data() {
+        return {
+            couponList: []
+        }
+    },
+    mounted() {
+        // this.getCouponList()
+        // this.$refs.popup.open()
+    },
+    methods: {
+        getCouponList() {
+            this.$api.getCouponList().then(res => {
+                this.couponList = res.data
+            })
+        },
+        getCoupon() {
+            uni.showToast({
+                title: '领取成功~',
+                icon: 'success'
+            })
+            this.$refs.popup.close()
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+.coupon-content{
+    padding: 40rpx 20rpx;
+    background-color: #fff;
+    border-radius: 20rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 40rpx;
+    position: relative;
+    .coupon-title{
+        color: black;
+        text-align: center;
+        font-size: 32rpx;
+        font-weight: 600;
+    }
+    .coupon-list{
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 20rpx;
+        .coupon-item{
+            width: 660rpx;
+            height: 180rpx;
+            background-color: $uni-color;
+            border-radius: 10rpx;
+        }
+    }
+    .coupon-btn-hover{
+        opacity: 0.7;
+    }
+    .coupon-btn{
+        width: 570rpx;
+        height: 110rpx;
+        background-color: $uni-color;
+        border-radius: 55rpx;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        .coupon-btn-text{
+            color: #fff;
+            font-size: 30rpx;
+        }
+    }
+}
+</style>
diff --git a/components/product/productItem.vue b/components/product/productItem.vue
index d075580..6480f68 100644
--- a/components/product/productItem.vue
+++ b/components/product/productItem.vue
@@ -2,8 +2,10 @@
 	<view class="item" @click="$emit('click')">
 		<!-- 商品图片 -->
 		<view class="item-image">
-			<image :src="item.image &&
+			<!-- <image :src="item.image &&
 			item.image.split(',')[0]" mode="aspectFill">
+			</image> -->
+			<image src="@/static/image/红烧肉.png" mode="aspectFill" class="item-image-img">
 			</image>
 		</view>
 
@@ -11,7 +13,7 @@
 		<view class="info">
 			<!-- 商品标题 -->
 			<view class="title">
-				{{ item.title }}
+				<!-- {{ item.title }} -->豆角炒鸡蛋
 			</view>
 
 			<!-- 价格 -->
@@ -29,8 +31,9 @@
 						class="price-img"></image>
 				</view>
 			</view> -->
-			
-			<view class="price-section">
+
+			<!-- 价格区 -->
+			<!-- <view class="price-section">
 				<view class="price">
 					<view class="money">
 						￥<text>{{ item.price }}</text>
@@ -42,14 +45,14 @@
 					</view>
 				</view>
 				
-				<!-- <view class="oldPrice">
+				<view class="oldPrice">
 					<view class="money">
 						￥<text>{{ item.oldPrice }}</text>
 						<text class="unit">/元每件</text>
 					</view>
 					<view class="price-imgs">
 					</view>
-				</view> -->
+				</view>
 				
 				<view class="member-price">
 					<view class="price">
@@ -85,7 +88,7 @@
 						</view>
 					</view>
 				</view>
-			</view>
+			</view> -->
 
 			<!-- 销量 -->
 			<view class="sales-volume">
@@ -95,19 +98,24 @@
 				</view>
 
 				<view class="sales-volume-number">
-					已售出{{ item.payNum }}+单
+					已售出{{ item.payNum }}单
 				</view>
 			</view>
 
+			<!-- 价格 -->
+			<view :style="{ color: '#FF2A2A'}">
+				<text style="font-size: 18rpx;">￥</text><text style="font-size: 30rpx;">9.9</text>
+			</view>
+
 			<!-- 购买按钮 -->
-			<view class=""
-			style="display: flex;justify-content: space-between;">
-				<view @click.stop="purchase(item.id)" class="buy-btn">
-					购买
+			<view class="" style="display: flex;justify-content: space-between;">
+				<view @click.stop="purchase(item.id)" class="buy-btn buy-order">
+					立即下单
 				</view>
-				
+
 				<view @click.stop="addCart(item)" class="buy-btn">
-					加入购物车
+					<uv-badge type="error" max="9" :value="1" absolute :offset="[-10, 1]" bg-color="#FF2A2A"></uv-badge>
+					加购物车
 				</view>
 			</view>
 		</view>
@@ -175,22 +183,23 @@
 
 <style scoped lang="scss">
 	.item {
-		width: 100%;
-		padding: 15rpx 20rpx;
+		width: 92%;
+		margin: 20rpx auto;
+		padding: 20rpx 10rpx;
 		align-items: center;
 		display: flex;
 		box-sizing: border-box;
 		border-bottom: 1rpx solid #00000012;
 		background: white;
-		border-radius: 20rpx;
-		margin-bottom: 20rpx;
-		box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.05);
+		border-radius: 10rpx;
+		// margin-bottom: 20rpx;
+		// box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.05);
 
 		// 商品图片
 		.item-image {
-			width: 220rpx;
-			height: 220rpx;
-			border-radius: 12rpx;
+			width: 200rpx;
+			height: 200rpx;
+			
 			overflow: hidden;
 
 			image {
@@ -201,15 +210,15 @@
 
 		// 商品信息
 		.info {
-			padding: 15rpx 0rpx 15rpx 25rpx;
+			// height: 220rpx;
+			padding: 15rpx 0rpx 15rpx 15rpx;
 			color: #555;
-			width: calc(100% - 220rpx);
+			width: calc(100% - 200rpx);
 			box-sizing: border-box;
 			overflow: hidden;
 			display: flex;
 			flex-direction: column;
-			gap: 10rpx;
-			
+			gap: 4rpx;
 			// 商品标题
 			.title {
 				font-size: 30rpx;
@@ -306,7 +315,7 @@
 				}
 
 				.sales-volume-number {
-					color: #B8B8B8;
+					color: #999;
 					font-size: 24rpx;
 					padding-left: 8rpx;
 				}
@@ -317,14 +326,21 @@
 				background: $uni-color;
 				color: white;
 				display: inline-block;
-				padding: 8rpx 18rpx;
+				padding: 10rpx 24rpx;
 				border-radius: 10rpx;
 				width: fit-content;
-				font-size: 26rpx;
+				font-size: 23rpx;
 				font-weight: 500;
 				box-shadow: 0 2rpx 6rpx rgba(255,68,0,0.2);
 				transition: all 0.3s;
 				margin-top: 4rpx;
+				position: relative;
+			}
+
+			.buy-order{
+				background: inherit;
+				border: 3rpx solid $uni-color;
+				color: $uni-color;
 			}
 		}
 	}
diff --git a/pages/index/category-test.vue b/pages/index/category-test.vue
new file mode 100644
index 0000000..090cd3d
--- /dev/null
+++ b/pages/index/category-test.vue
@@ -0,0 +1,348 @@
+<template>
+    <view class="page">
+        <!-- 导航栏 -->
+        <!-- <navbar   bgColor="#019245" color="#fff" /> -->
+
+        <!-- 搜索栏 -->
+        <view class="search">
+            <image src="/static/image/中森明菜.webp" mode="aspectFill" class="search-img"></image>
+            <view style="position: relative;">
+                <uv-search placeholder="陕西苹果" bgColor="#fff" @search="search" @change="search" @custom="search"
+                    v-model="queryParams.title" height="70rpx" :showAction="false" actionText=" "></uv-search>
+                <text class="search-text" @click="search">搜索</text>
+            </view>
+        </view>
+
+        <!-- 商品列表 -->
+        <view style="position: 20rpx;" v-if="queryParams.title">
+            <productList :list="list" />
+        </view>
+
+        <!-- 分类商品列表 -->
+        <view class="category" v-else>
+
+            <view class="tabs">
+                <uv-tabs :list="category" :activeStyle="{ color: '#f00', fontWeight: 600 }" lineColor="#f00"
+                    :inactiveStyle="{ color: 'rgba(0,0,0,.8)' }" lineHeight="8rpx" lineWidth="50rpx" :current="current"
+                    @click="clickTabs"></uv-tabs>
+            </view>
+
+            <!-- 原来的选择框 -->
+            <uv-vtabs :list="category[current].children" :current="currentChildren" keyName="name" :chain="false"
+                @change="change">
+                <!-- 可有可无 -->
+                <!-- <view class="list">
+					<template v-for="(item, index) in category[current].children">
+						<uv-vtabs-item :index="index" :key="index">
+							<view class="category-item">
+								<view class="category-title">
+									{{ item.name }}
+								</view>
+								
+								<productItem :item="pro"
+								v-for="(pro, i) in item.shopList" :key="i"
+								@click="$utils.navigateTo(`/pages_order/product/productDetail?id=${pro.id}`)" />
+							</view>
+						</uv-vtabs-item>
+					</template>
+</view> -->
+
+                <uv-vtabs-item>
+                    <view class="category-item">
+                        <productItem :item="pro" v-for="(pro, i) in categoryList.shopList" :key="i"
+                            @click="$utils.navigateTo(`/pages_order/product/productDetail?id=${pro.id}`)" />
+
+                        <uv-empty v-if="categoryList.shopList.length == 0" text="还没有呢" />
+                    </view>
+                </uv-vtabs-item>
+            </uv-vtabs>
+            <!-- <view class="content">
+				<uv-vtabs :chain="chain" :list="list" 
+					:barItemBadgeStyle="{ 
+						right: '20rpx', 
+						top: '12rpx' 
+					}"
+					:barStyle="{
+						boxShadow: '0 0 18rpx 0rpx rgba(0, 0, 0, 0.1)',
+						fontWeight: '600',
+						textAlign: 'center',
+						backgroundColor: '#F5F5F5',
+						
+					}"
+					:barItemStyle="{
+						color: 'black'
+					}"	
+					:barItemActiveLineStyle="{ 
+						height: '35%',
+						top: '32.5%',
+						bottom: 'auto',
+						left: '2%',
+						borderRadius: '4rpx',
+						width: '8rpx'
+					}"
+					@change="tabChange" height="1100rpx">
+					<uv-vtabs-item>
+						 <view class="item" v-for="(item2, index2) in list2" :key="index2">
+							<view class="item-title">
+								<text class="text">{{ item2.name }}</text>
+							</view>
+							<view class="item-content">
+								<text class="text">{{ item2.desc }}</text>
+							</view>
+						</view> -->
+            <view class="category-item">
+                <productItem :item="item2" v-for="(item2, i) in list2" :key="i"
+                    @click="$utils.navigateTo(`/pages_order/product/productDetail?id=${item2.id}`)" />
+
+                <uv-empty v-if="list2.length == 0" text="还没有呢" />
+            </view>
+            </uv-vtabs-item>
+            </uv-vtabs>
+        </view>
+    </view>
+
+    <!-- tabbar -->
+    <tabber select="category" />
+    </view>
+</template>
+
+<script>
+import productItem from '@/components/product/productItem.vue';
+import mixinsList from '@/mixins/list.js'
+import {
+    mapState
+} from 'vuex'
+import tabber from '@/components/base/tabbar.vue'
+import productList from '@/components/user/productList.vue'
+export default {
+    mixins: [mixinsList],
+    components: {
+        productItem,
+        tabber,
+        productList,
+    },
+    data() {
+        return {
+            mixinsListApi: 'getClassShopPageList',
+            current: 0,
+            currentChildren: 0,
+        }
+    },
+    computed: {
+        ...mapState(['category']),
+        categoryList() {
+            return this.category[this.current]?.children?.[this.currentChildren] || {};
+        },
+    },
+    onLoad({
+        search,
+        cid
+    }) {
+        console.log('我是cid', cid);
+        console.log('我是category', this.category);
+        if (search) {
+            this.queryParams.title = search
+        }
+
+
+        if (this.category.length > 0 && cid) {
+            this.category.forEach((n, i) => {
+                if (n.id == cid) {
+                    this.current = i
+                }
+            })
+            // this.queryParams.classId = cid
+        } else if (this.category.length > 0) {
+            // this.queryParams.classId = this.category[0].id
+        }
+    },
+    methods: {
+        change(e) {
+            // this.queryParams.classId = this.category[e].id
+            this.currentChildren = e
+
+        },
+        tabChange(index) {
+            console.log('选项改变：', index);
+            this.value = index
+        },
+        clickTabs({ index }) {
+            this.current = index
+            this.currentChildren = 0
+            console.log(this.category, this.category[index].children);
+
+        },
+        search() {
+            for (let i = 0; i < 10; i++) {
+                delete this.queryParams[i]
+            }
+            this.queryParams.pageSize = 10
+            this.getData()
+        },
+    }
+}
+</script>
+
+<style scoped lang="scss">
+.page {
+
+    // background-color: #f5f5ff;
+    /deep/ .uv-vtabs {
+        height: calc(100vh - 470rpx) !important;
+    }
+
+    // /deep/ .uv-vtabs__bar {
+    // 	height: calc(100vh - 600rpx) !important;
+    // }
+
+    /deep/ .uv-vtabs__content {
+        height: calc(100vh - 500rpx) !important;
+    }
+
+    .search {
+        background: $uni-color;
+        height: 280rpx;
+        padding-left: 20rpx;
+
+        .search-img {
+            width: 120rpx;
+            height: 120rpx;
+            margin: 40rpx 0 0 10rpx;
+            border-radius: 50%;
+        }
+
+        .search-text {
+            position: absolute;
+            right: 80rpx;
+            top: 50%;
+            transform: translateY(-50%);
+            color: $uni-color;
+        }
+
+        /deep/ .uv-search__action {
+            background-color: $uni-color;
+            color: #FFFFFF;
+            padding: 10rpx 20rpx;
+            border-radius: 30rpx;
+        }
+    }
+
+    /deep/ .uv-vtabs__content {
+        background: transparent !important;
+        overflow: hidden;
+    }
+}
+
+.header {
+    padding: 30rpx;
+    font-size: 30rpx;
+    color: #333;
+}
+
+.item {
+    padding: 10rpx 20rpx;
+
+    &-title {
+        .text {
+            font-weight: 700;
+            font-size: 32rpx;
+            color: #111;
+        }
+    }
+
+    &-content {
+        padding: 20rpx 0;
+
+        .text {
+            line-height: 48rpx;
+            font-size: 30rpx;
+            color: #111;
+            /* #ifndef APP-NVUE */
+            word-break: break-all;
+            /* #endif */
+        }
+    }
+}
+
+.gap {
+    padding: 0 30rpx;
+}
+
+.category {
+    /* background-color: green; */
+    font-size: 30rpx;
+    color: #333;
+
+    .category-title {
+        position: relative;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        height: 120rpx;
+
+        &::before,
+        &::after {
+            position: absolute;
+            top: 50%;
+            content: '';
+            width: 10%;
+            border-top: 2rpx solid black;
+        }
+
+        &::before {
+            left: 25%;
+        }
+
+        &::after {
+            right: 25%;
+        }
+    }
+
+    /deep/ .uv-vtabs {
+        width: 750rpx;
+        overflow: hidden;
+    }
+
+    .list {
+        width: 100%;
+        padding: 0rpx 20rpx;
+        box-sizing: border-box;
+    }
+
+}
+
+.header {
+    padding: 30rpx;
+    font-size: 30rpx;
+    color: #333;
+}
+
+.item {
+    padding: 10rpx 20rpx;
+
+    &-title {
+        .text {
+            font-weight: 700;
+            font-size: 32rpx;
+            color: #111;
+        }
+    }
+
+    &-content {
+        padding: 20rpx 0;
+
+        .text {
+            line-height: 48rpx;
+            font-size: 30rpx;
+            color: #111;
+            /* #ifndef APP-NVUE */
+            word-break: break-all;
+            /* #endif */
+        }
+    }
+}
+
+.gap {
+    padding: 0 30rpx;
+}
+</style>
\ No newline at end of file
diff --git a/pages/index/category.vue b/pages/index/category.vue
index 1f0d01e..0d6b51c 100644
--- a/pages/index/category.vue
+++ b/pages/index/category.vue
@@ -5,10 +5,11 @@
 
 		<!-- 搜索栏 -->
 		<view class="search">
-			<image src="/static/image/中森明菜.webp" mode="aspectFill" class="search-img"></image>
+			<image src="/static/image/logo.png" mode="aspectFill" class="search-img"></image>
 			<view style="position: relative;">
 				<uv-search placeholder="陕西苹果" bgColor="#fff" @search="search" @change="search" @custom="search"
-					v-model="queryParams.title" height="70rpx" :showAction="false" actionText=" "></uv-search>
+					:searchIconSize="40" v-model="queryParams.title" height="75rpx" :showAction="false"
+					actionText=" "></uv-search>
 				<text class="search-text" @click="search">搜索</text>
 			</view>
 		</view>
@@ -21,63 +22,39 @@
 		<!-- 分类商品列表 -->
 		<view class="category" v-else>
 
+			<!-- 这是顶部的内容 -->
 			<!-- <view class="tabs">
-				<uv-tabs :list="category" :activeStyle="{color : '#f00', fontWeight : 600}" lineColor="#f00"
-					:inactiveStyle="{color: 'rgba(0,0,0,.8)'}" lineHeight="8rpx" lineWidth="50rpx" :current="current"
+				<uv-tabs :list="category" :activeStyle="{ color: '#f00', fontWeight: 600 }" lineColor="#f00"
+					:inactiveStyle="{ color: 'rgba(0,0,0,.8)' }" lineHeight="8rpx" lineWidth="50rpx" :current="current"
 					@click="clickTabs"></uv-tabs>
 			</view> -->
 
-			<!-- 原来的选择框 -->
-			<!-- <uv-vtabs :list="category[current].children" :current="currentChildren" keyName="name" :chain="false"
-				@change="change"> -->
-			<!-- 可有可无 -->
-			<!-- <view class="list">
-					<template v-for="(item, index) in category[current].children">
-						<uv-vtabs-item :index="index" :key="index">
-							<view class="category-item">
-								<view class="category-title">
-									{{ item.name }}
-								</view>
-								
-								<productItem :item="pro"
-								v-for="(pro, i) in item.shopList" :key="i"
-								@click="$utils.navigateTo(`/pages_order/product/productDetail?id=${pro.id}`)" />
-							</view>
-						</uv-vtabs-item>
-					</template>
-				</view> -->
-
-			<!-- <uv-vtabs-item>
+			<uv-vtabs :list="category[2].children" :barStyle="{
+					boxShadow: '0 0 18rpx 0rpx rgba(0, 0, 0, 0.1)',
+					fontWeight: '600',
+					textAlign: 'center',
+					backgroundColor: '#F5F5F5',
+
+				}" :barItemStyle="{
+					color: 'black'
+				}" :barItemActiveLineStyle="{
+					height: '35%',
+					top: '32.5%',
+					bottom: 'auto',
+					left: '2%',
+					borderRadius: '4rpx',
+					width: '8rpx'
+				}" :current="currentChildren" keyName="name" :chain="false" @change="change">
+
+				<uv-vtabs-item>
 					<view class="category-item">
 						<productItem :item="pro" v-for="(pro, i) in categoryList.shopList" :key="i"
-							@click="$utils.navigateTo(`/pages_order/product/productDetail?id=${pro.id}`)" />
+							@click="navigateToDetail(pro.id)" />
 
 						<uv-empty v-if="categoryList.shopList.length == 0" text="还没有呢" />
 					</view>
 				</uv-vtabs-item>
-			</uv-vtabs> -->
-			<view class="content">
-				<uv-vtabs :chain="chain" :list="list" :barItemBadgeStyle="{ right: '20rpx', top: '12rpx' }"
-					barStyle="box-shadow: 0 0 6rpx 6rpx rgba(0, 0, 0, 0.1);" @change="tabChange" height="1100rpx">
-					<uv-vtabs-item>
-						<view class="item" v-for="(item2, index2) in list2" :key="index2">
-							<view class="item-title">
-								<text class="text">{{ item2.name }}</text>
-							</view>
-							<view class="item-content">
-								<text class="text">{{ item2.desc }}</text>
-							</view>
-						</view>
-					</uv-vtabs-item>
-					<!-- try -->
-					<view class="category-item">
-						<productItem :item="item2" v-for="(item2, i) in list2" :key="i"
-							@click="$utils.navigateTo(`/pages_order/product/productDetail?id=${item2.id}`)" />
-
-						<uv-empty v-if="list2.length == 0" text="还没有呢" />
-					</view>
-				</uv-vtabs>
-			</view>
+			</uv-vtabs>
 		</view>
 
 		<!-- tabbar -->
@@ -86,288 +63,240 @@
 </template>
 
 <script>
-const getList = [{
-	name: 'uv-ui简介',
-	childrens: [{
-		// name: 'uv-ui简介',
-		desc: '1. uv-ui最初是在uview2.x的基础上进行改进优化，支持vue3等优化，最重要的是支持单独导入直接使用，无需在main.js中进行配置。\n\n2. uv-ui来源于社区，也回归到社区，正是有一群热爱uni-app生态的同学推着它前行，而我们也一如既往的承诺，uv-ui永久开源，永远免费。但是会在下载处进行广告配置，作为开发团队的研发费用的部分来源，所以希望大家理解。'
-	}]
-}, {
-	name: 'uv-ui特点',
-	childrens: [{
-		name: '全端兼容',
-		desc: 'uv-ui支持App（vue）、App（nvue）、H5、小程序、VUE2、VUE3，支持nvue原生渲染。uv-ui的组件都是多端自适应的，底层会抹平很多小程序平台的差异或bug。'
-	}, {
-		name: '集成工具',
-		desc: 'uv-ui中的uv-ui-tools组件集成了强大的网络请求 HTTP 及常用的工具函数，无需自己再去寻找，并且直接挂载在uni上面，方便使用，只需要在mian.js中引入即可，更多工具请参考：https://www.uvui.cn/js/http.html。使用方式请参考：https://www.uvui.cn/components/setting.html。'
-	}, {
-		name: '主题扩展',
-		desc: 'uv-ui中的uv-ui-tools组件下面的theme.scss为主题文件，直接在uni.scss中引入主题即可，可以根据自己的需求进行扩展。下面也有说明具体使用方式。使用方法请参考：https://www.uvui.cn/components/setting.html'
-	}]
-}, {
-	name: '更新日志',
-	badge: {
-		isDot: true
+import productItem from '@/components/product/productItem.vue';
+import mixinsList from '@/mixins/list.js'
+import {
+	mapState
+} from 'vuex'
+import tabber from '@/components/base/tabbar.vue'
+import productList from '@/components/user/productList.vue'
+export default {
+	mixins: [mixinsList],
+	components: {
+		productItem,
+		tabber,
+		productList,
 	},
-	childrens: [{
-		name: '更新日志',
-		desc: 'uv-ui的重大更新在更新日志中都有所说明，如果在开发的过程中遇到文档不完善，可以提供给我们，我们会持续完善，非常感谢大家的支持。更新日志：https://www.uvui.cn/components/changelog.html'
-	}]
-}, {
-	name: '设计规范',
-	childrens: [{
-		name: '设计规范',
-		desc: '为了约束合成更多优秀的组件和模板，打造优质的体验，我们拟定了一些UI界面设计和建议。同时部分之间会有依赖，这是为了减少代码冗余的同时提高开发效率，模块化是我们的基础。如果大家有好的建议，可以提出进行改进。'
-	}]
-}, {
-	name: '交流反馈',
-	childrens: [{
-		name: '交流反馈',
-		desc: 'uv-ui为采用MIT许可证的开源项目，使用完全免费。欢迎加QQ群交流反馈，一起学习，共同进步。QQ群： 549833913'
-	}]
-}]
-	import productItem from '@/components/product/productItem.vue';
-	import mixinsList from '@/mixins/list.js'
-	import {
-		mapState
-	} from 'vuex'
-	import tabber from '@/components/base/tabbar.vue'
-	import productList from '@/components/user/productList.vue'
-	export default {
-		mixins: [mixinsList],
-		components: {
-			productItem,
-			tabber,
-			productList,
-		},
-		data() {
-			return {
-				mixinsListApi: 'getClassShopPageList',
-				current : 0,
-				currentChildren : 0,
-				list: [],
-				chain: false,
-				value: 0
-			}
-		},
-		computed: {
-			...mapState(['category']),
-			categoryList(){
-				return this.category[this.current].children[this.currentChildren]
-			},
-			list2() {
-				const _list = this.list[this.value]?.childrens;
-				return _list ? _list : [];
-			}
+	data() {
+		return {
+			mixinsListApi: 'getClassShopPageList',
+			current: 0,
+			currentChildren: 0,
+		}
+	},
+	computed: {
+		...mapState(['category']),
+		categoryList() {
+			// return this.category[this.current].children[this.currentChildren]
+			return this.category[2].children[this.currentChildren]
 		},
-		onReady(){
-			// 模拟接口请求数据
-			uni.showLoading({
-				title: '加载中'
+	},
+	onLoad({
+		search,
+		cid
+	}) {
+		if (search) {
+			this.queryParams.title = search
+		}
+		// this.$store.commit('getCategoryList')
+		if (this.category.length > 0 && cid) {
+			this.category.forEach((n, i) => {
+				if (n.id == cid) {
+					this.current = i
+				}
 			})
-			setTimeout(() => {
-				this.list = getList;
-				uni.hideLoading();
-			}, 200)
-			
-			
+			// this.queryParams.classId = cid
+		} else if (this.category.length > 0) {
+			// this.queryParams.classId = this.category[0].id
+		}
+	},
+	methods: {
+		change(e) {
+			// this.queryParams.classId = this.category[e].id
+			this.currentChildren = e
 		},
-		onLoad({
-			search,
-			cid
-		}) {
-			console.log('我是cid', cid);
-			console.log('我是category', this.category);
-			if (search) {
-				this.queryParams.title = search
-			}
-			// this.$store.commit('getCategoryList')
-			if(this.category.length > 0 && cid){
-
-				this.category.forEach((n, i) => {
-					if(n.id == cid){
-						this.current = i
-					}
-				})
-				// this.queryParams.classId = cid
-			}else if (this.category.length > 0) {
-				// this.queryParams.classId = this.category[0].id
+		clickTabs({ index }) {
+			this.current = index
+			this.currentChildren = 0
+		},
+		search() {
+			for (let i = 0; i < 10; i++) {
+				delete this.queryParams[i]
 			}
+			this.queryParams.pageSize = 10
+			this.getData()
 		},
-		methods: {
-			change(e) {
-				// this.queryParams.classId = this.category[e].id
-				this.currentChildren = e
-				
-			},
-			tabChange(index){
-				console.log('选项改变：', index);
-				this.value = index
-			},
-			clickTabs({index}){
-				this.current = index
-				this.currentChildren = 0
-			},
-			search(){
-				for(let i = 0;i < 10;i++){
-					delete this.queryParams[i]
-				}
-				this.queryParams.pageSize = 10
-				this.getData()
-			},
+		navigateToDetail(id) {
+			console.log('跳转到商品详情页:', id);
+		// 	uni.navigateTo({
+		// 		url: `/pages_order/product/productDetail?id=${id}`
+		// 	})
+			this.$utils.navigateTo(`/pages_order/product/productDetail?id=${id}`);
 		}
 	}
+}
 </script>
 
 <style scoped lang="scss">
-	.page {
-		/deep/ .uv-vtabs {
-			height: calc(100vh - 470rpx) !important;
-		}
+.page {
+
+	// background-color: #f5f5ff;
+	/deep/ .uv-vtabs {
+		height: calc(100vh - 470rpx) !important;
+	}
+
+	/deep/ .uv-vtabs__bar {
+		height: calc(100vh - 470rpx) !important;
+	}
+
+	/deep/ .uv-vtabs__content {
+		height: calc(100vh - 470rpx) !important;
+	}
 
-		// /deep/ .uv-vtabs__bar {
-		// 	height: calc(100vh - 600rpx) !important;
-		// }
+	.search {
+		background: $uni-color;
+		height: 280rpx;
+		padding-left: 20rpx;
 
-		/deep/ .uv-vtabs__content {
-			height: calc(100vh - 500rpx) !important;
+		.search-img {
+			width: 120rpx;
+			height: 120rpx;
+			margin: 40rpx 0 10rpx 10rpx;
+			border-radius: 50%;
 		}
 
-		.search {
-			background: $uni-color;
-			height: 280rpx;
-			padding-left: 20rpx;
-			.search-img{
-				width: 120rpx;
-				height: 120rpx;
-				margin: 40rpx 0 0 10rpx;
-				border-radius: 50%;
-			}
-			.search-text{
-				position: absolute;
-				right: 80rpx;
-				top: 50%;
-				transform: translateY(-50%);
-				color: $uni-color;
-			}
-			/deep/ .uv-search__action {
-				background-color: $uni-color;
-				color: #FFFFFF;
-				padding: 10rpx 20rpx;
-				border-radius: 30rpx;
-			}
+		.search-text {
+			position: absolute;
+			right: 80rpx;
+			top: 50%;
+			transform: translateY(-50%);
+			color: $uni-color;
 		}
 
-		/deep/ .uv-vtabs__content {
-			background: transparent !important;
-			overflow: hidden;
+		/deep/ .uv-search__action {
+			background-color: $uni-color;
+			color: #FFFFFF;
+			padding: 10rpx 20rpx;
+			border-radius: 30rpx;
 		}
 	}
 
-	.header {
-		padding: 30rpx;
-		font-size: 30rpx;
-		color: #333;
+	/deep/ .uv-vtabs__content {
+		background: transparent !important;
+		overflow: hidden;
 	}
-	.item {
-		padding: 10rpx 20rpx;
-		&-title {
-			.text {
-				font-weight: 700;
-				font-size: 32rpx;
-				color: #111;
-			}
-		}
-		&-content {
-			padding: 20rpx 0;
-			.text {
-				line-height: 48rpx;
-				font-size: 30rpx;
-				color: #111;
-				/* #ifndef APP-NVUE */
-				word-break: break-all;
-				/* #endif */
-			}
+}
+
+.header {
+	padding: 30rpx;
+	font-size: 30rpx;
+	color: #333;
+}
+
+.item {
+	padding: 10rpx 20rpx;
+
+	&-title {
+		.text {
+			font-weight: 700;
+			font-size: 32rpx;
+			color: #111;
 		}
 	}
-	.gap {
-		padding: 0 30rpx;
+
+	&-content {
+		padding: 20rpx 0;
+
+		.text {
+			line-height: 48rpx;
+			font-size: 30rpx;
+			color: #111;
+			/* #ifndef APP-NVUE */
+			word-break: break-all;
+			/* #endif */
+		}
 	}
+}
 
-	.category {
-		/* background-color: green; */
-		font-size: 30rpx;
-		color: #333;
-		.category-title{
-			position: relative;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			height: 120rpx;
-			
-			&::before,
-			&::after {
-				position: absolute;
-				top: 50%;
-				content: '';
-				width: 10%;
-				border-top: 2rpx solid black;
-			}
-			
-			&::before {
-				left: 25%;
-			}
-			
-			&::after {
-				right: 25%;
-			}
+.gap {
+	padding: 0 30rpx;
+}
+
+.category {
+	/* background-color: green; */
+	font-size: 30rpx;
+	color: #333;
+
+	.category-title {
+		position: relative;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		height: 120rpx;
+
+		&::before,
+		&::after {
+			position: absolute;
+			top: 50%;
+			content: '';
+			width: 10%;
+			border-top: 2rpx solid black;
 		}
-		
-		/deep/ .uv-vtabs {
-			width: 750rpx;
-			overflow: hidden;
+
+		&::before {
+			left: 25%;
 		}
-		
-		.list {
-			width: 100%;
-			padding: 0rpx 20rpx;
-			box-sizing: border-box;
+
+		&::after {
+			right: 25%;
 		}
-		
 	}
 
-		.header {
-			padding: 30rpx;
-			font-size: 30rpx;
-			color: #333;
-		}
-	
-		.item {
-			padding: 10rpx 20rpx;
-	
-			&-title {
-				.text {
-					font-weight: 700;
-					font-size: 32rpx;
-					color: #111;
-				}
-			}
-	
-			&-content {
-				padding: 20rpx 0;
-	
-				.text {
-					line-height: 48rpx;
-					font-size: 30rpx;
-					color: #111;
-					/* #ifndef APP-NVUE */
-					word-break: break-all;
-					/* #endif */
-				}
-			}
+	/deep/ .uv-vtabs {
+		width: 750rpx;
+		overflow: hidden;
+	}
+
+	.list {
+		width: 100%;
+		padding: 0rpx 20rpx;
+		box-sizing: border-box;
+	}
+
+}
+
+.header {
+	padding: 30rpx;
+	font-size: 30rpx;
+	color: #333;
+}
+
+.item {
+	padding: 10rpx 20rpx;
+
+	&-title {
+		.text {
+			font-weight: 700;
+			font-size: 32rpx;
+			color: #111;
 		}
-	
-		.gap {
-			padding: 0 30rpx;
+	}
+
+	&-content {
+		padding: 20rpx 0;
+
+		.text {
+			line-height: 48rpx;
+			font-size: 30rpx;
+			color: #111;
+			/* #ifndef APP-NVUE */
+			word-break: break-all;
+			/* #endif */
 		}
+	}
+}
+
+.gap {
+	padding: 0 30rpx;
+}
 </style>
\ No newline at end of file
diff --git a/pages_order/components/order/placeOrder.vue b/pages_order/components/order/placeOrder.vue
new file mode 100644
index 0000000..2dfbc1d
--- /dev/null
+++ b/pages_order/components/order/placeOrder.vue
@@ -0,0 +1,234 @@
+<template>
+    <view class="place-order">
+        <uv-popup ref="popup" @change="change" mode="bottom">
+            <view class="place-order-content">
+
+                <view class="place-order-title">
+                    <image src="@/static/image/多人下单.webp" mode="aspectFit" class="place-order-title-image"></image>
+                    <text class="number">2563</text><text>人下单</text>
+                </view>
+
+                <!-- 选择取餐地点 -->
+                <view class="place-order-address">
+                    <uv-icon name="map-fill" color="#019245" size="55rpx">
+                    </uv-icon>
+                    <text style="font-size: 42rpx;">
+                        请选择取餐地点
+                    </text>
+                    <view class="place-order-address-arrow">
+                        <uv-icon name="arrow-right" size="40rpx">
+                        </uv-icon>
+                    </view>
+                </view>
+
+                <uv-gap height="20rpx" bgColor="#F7F7F7" />
+
+                <!-- 货品信息 -->
+                <view class="item">
+                    <image src="@/static/image/红烧肉.png" mode="aspectFill" class="item-image"></image>
+                    <view style="font-size: 36rpx;">
+                        <view>豆角炒鸡蛋</view>
+                        <view style="color: red; ">￥9.9</view>
+                        <view style="margin-top: 30rpx;">
+                            <uv-number-box v-model="value" button-size="36"></uv-number-box>
+                        </view>
+                    </view>
+                </view>
+
+                <!-- 选项框 -->
+                <uv-radio-group v-model="payMethod">
+                    <view class="option-box">
+                        <view class="option-box-item">
+                            <uv-icon name="weixin-circle-fill" size="70rpx" color="#019245" />
+                            <text style="flex: 1;">
+                                微信支付
+                            </text>
+                            <uv-radio activeColor="#019245" size="40rpx" name="weixin" />
+                        </view>
+                        <view class="option-box-item">
+                            <uv-icon name="red-packet" size="70rpx" color="#019245" />
+                            <text style="flex: 1;">
+                                账户余额
+                                <text style="color: gray; margin-left: 20rpx;">(余额: ￥0)
+                                </text>
+                            </text>
+                            <uv-radio activeColor="#019245" size="40rpx" name="account" />
+                        </view>
+                    </view>
+                </uv-radio-group>
+
+                <uv-gap height="20rpx" bgColor="#F7F7F7" />
+
+                <!-- 优惠 -->
+                <view class="discount">
+                    <text style="font-size: 35rpx;">优惠</text>
+                    <view style="display: flex; align-items: center; gap: 20rpx">
+                        <image src="@/static/image/券.webp" mode="aspectFill" class="discount-image" />
+                        <text>新用户立减</text>
+                        <text style="color: red;">-￥2</text>
+                    </view>
+                </view>
+
+                <uv-gap height="20rpx" bgColor="#F7F7F7" />
+
+                <!-- 备注 -->
+                <view class="remark">
+                    <text style="align-self: start;">备注</text>
+                    <textarea class="remark-textarea" placeholder="请输入您需要备注的内容" />
+                </view>
+
+                <!-- 购物车与支付 -->
+                <view class="cart-pay">
+                    <view class="cart">
+                        <uv-icon name="shopping-cart-fill" size="60rpx" color="#019245" label="加入购物车" labelPos="bottom"
+                            labelSize="25rpx" />
+                    </view>
+                    <view class="pay">
+                        立即支付
+                    </view>
+                </view>
+            </view>
+        </uv-popup>
+    </view>
+</template>
+
+<script>    
+export default {
+    name: 'placeOrder',
+    data() {
+        return {
+            value: 1,
+            payMethod: 'weixin'
+        }
+    },
+    methods: {
+        // 添加open方法，用于外部调用打开弹窗
+        open() {
+            this.$refs.popup.open();
+        },
+        // 添加change方法，用于处理弹窗状态变化
+        change(e) {
+            console.log('弹窗状态变化:', e);
+            // 可以在这里添加弹窗打开或关闭后的逻辑处理
+        }
+    },
+    mounted(){
+        this.open()
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.place-order-title{
+    font-size: 35rpx;
+    height: 90rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    .number{
+        color: $uni-color;
+    }
+    .text{
+        color: #000;
+    }
+    .place-order-title-image{
+        width: 100rpx;
+        height: 50rpx;
+    }
+}
+.place-order-address{
+    display: flex;
+    height: 80rpx;
+    line-height: 80rpx;
+    // background-color: red;
+    gap: 30rpx;
+    padding-left: 20rpx;
+    position: relative;
+    text{
+        font-size: 32rpx;
+        font-weight: 500;
+    }
+    .place-order-address-arrow{
+        position: absolute;
+        right: 20rpx;
+        top: 50%;
+        transform: translateY(-50%);
+    }
+}
+.item{
+    display: flex;
+    padding: 40rpx;
+    gap: 40rpx;
+    &-image{
+        width: 250rpx;
+        height: 200rpx;
+    }
+}
+.option-box{
+    display: flex;
+    flex-direction: column;
+    gap: 40rpx;
+    width: 100%;
+    &-item{
+        display: flex;
+        gap: 20rpx;
+        align-items: center;
+        font-size: 32rpx;
+        padding: 0 40rpx;
+    }
+}
+.discount{
+    height: 130rpx;
+    display: flex;
+    align-items: center;
+    width: 90%;
+    justify-content: space-between;
+    padding:0rpx 40rpx 0rpx 40rpx;
+    // gap: 20rpx;
+    .discount-image{
+        width: 36rpx;
+        height: 36rpx;
+        border-radius: 10rpx;
+    }
+}
+.remark{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 20rpx 40rpx;
+    // background-color: red;
+    
+    text{
+        font-size: 32rpx;
+        font-weight: 500;
+    }
+    .remark-textarea{
+        width: 80%;
+        height: 180rpx;
+        // border: 1rpx solid #000;
+        // border-radius: 10rpx;
+        // padding: 20rpx;
+    }   
+}
+.cart-pay{
+    // background-color: red;
+    height: 130rpx;
+    display: flex;
+    .cart{
+        width: 30%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+    .pay{
+        width: 70%;
+        background-color: $uni-color;
+        color: #fff;
+        text-align: center;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 32rpx;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/pages_order/components/product/submit.vue b/pages_order/components/product/submit.vue
index 2d94176..bfc8d2a 100644
--- a/pages_order/components/product/submit.vue
+++ b/pages_order/components/product/submit.vue
@@ -8,40 +8,28 @@
 				客服
 			</view>
 		</view> -->
-		
-		<button
-		open-type="contact"
-		class="service-icon">
-			<uv-icon
-			name="kefu-ermai"
-			size="45rpx"
-			></uv-icon>
-			</image>
+
+		<button open-type="share" class="service-icon">
+			<uv-icon name="share-square" size="65rpx" color="black"></uv-icon>
 			<view class="title">
-				客服
+				分享
 			</view>
 		</button>
 
-        <button
-		class="service-icon give"
-		@click="$emit('toSend')">
-			<uv-icon
-			name="gift-fill"
-			size="45rpx"
-			color="#eb3300"
-			></uv-icon>
+		<button class="service-icon " @click="$emit('addCart')">
+			<uv-icon name="shopping-cart" size="75rpx" color="black"></uv-icon>
 			<view class="title">
-				送礼
+				购物车
 			</view>
 		</button>
 
-		<view class="submit-btn">
-			<view class="l"
+		<view class="submit-btn" @click="$emit('submit')">
+			<!-- <view class="l"
 			@click="$emit('addCart')">
 				加入购物车
-			</view>
-			<view class="r" @click="$emit('submit')">
-				{{ submiitTitle }}
+			</view> -->
+			<view class="r">
+				<!-- {{ submiitTitle }} -->立即下单
 			</view>
 		</view>
 	</view>
@@ -64,8 +52,8 @@
 
 			}
 		},
-		methods: {
 
+		methods: {
 		}
 	}
 </script>
@@ -79,21 +67,20 @@
 		background-color: #fff;
 		height: 120rpx;
 		display: flex;
-		justify-content: center;
+		justify-content: space-between;
 		align-items: center;
 		font-size: 24rpx;
-		padding: 0rpx 20rpx;
+		padding: 0rpx 0rpx 0rpx 20rpx;
 		box-sizing: border-box;
 
 		// 联系客服
 		.service-icon {
 			padding: 0;
 			margin: 0;
-			background-color: transparent;
 			display: flex;
 			flex-direction: column;
 			justify-content: center;
-			margin: 0 20rpx;
+			margin: 0 0 0 40rpx;
 			flex-shrink: 0;
 			align-items: center;
 			&::after{
@@ -107,7 +94,7 @@
 
 			.title {
 				font-size: 26rpx;
-				color: #666666;
+				color: black;
 				line-height: 40rpx;
 			}
 		}
@@ -122,11 +109,12 @@
 		}
 
 		.submit-btn {
-			width: calc(100% - 140rpx);
-			height: 80rpx;
+			width: calc(100% - 400rpx);
+			// height: 80rpx;
+			height: 100%;
 			color: #fff;
-			border-radius: 40rpx;
-			font-size: 28rpx;
+			// border-radius: 40rpx;
+			font-size: 32rpx;
 			margin-left: 40rpx;
 			display: flex;
 			justify-content: center;
diff --git a/pages_order/product/productDetail.vue b/pages_order/product/productDetail.vue
index 68b704e..8655664 100644
--- a/pages_order/product/productDetail.vue
+++ b/pages_order/product/productDetail.vue
@@ -1,28 +1,40 @@
 <template>
 	<view class="page">
 		<!-- 导航栏 -->
-		<!-- <navbar title="商品详情" leftClick @leftClick="$utils.navigateBack" /> -->
-		
-		<view class="leftClick"
+		<navbar title="详情页" leftClick @leftClick="$utils.navigateBack" bgColor="#019245" color="#fff" />
+
+		<!-- <view class="leftClick"
 		@click="$utils.navigateBack">
 			<uv-icon
 			size="30rpx"
 			color="#fff"
 			name="arrow-left"></uv-icon>
-		</view>
+		</view> -->
 
 		<view class="swipe">
 			<uv-swiper :list="productDetail.image
-			&& productDetail.image.split(',')" indicator height="750rpx"></uv-swiper>
+			&& productDetail.image.split(',')" @change="e => current1 = e.current" indicator height="650rpx">
+				<!-- 指示器 -->
+				<template v-slot:indicator>
+					<view class="indicator">
+						<view class="indicator__dot" v-for="(item, index) in productDetail.image
+							&& productDetail.image.split(',')" :key="index" :class="[index === current1 && 'indicator__dot--active']">
+						</view>
+					</view>
+				</template>
+			</uv-swiper>
 		</view>
 
 		<!-- 商品标题 -->
 		<view class="info">
+			<view class="new-price">
+				<text>￥</text><text :style="{fontSize:'50rpx'}">9.9</text>
+			</view>
 			<view class="title">
-				{{ productDetail.title }}
+				<!-- {{ productDetail.title }} -->豆角炒鸡蛋
 			</view>
-		
-			<view class="price">
+
+			<!-- <view class="price">
 				<view class="money">
 					￥<text>{{ productDetail.price }}</text>
 					<text class="unit">/元每件</text>
@@ -31,20 +43,19 @@
 					￥<text>{{ productDetail.oldPrice }}</text>
 					<text class="unit">/元</text>
 				</view>
-			</view>
-			
-			<view class="price">
+			</view> -->
+
+			<!-- <view class="price">
 				<view class="money">
 					￥<text>{{ productDetail.goldPrice }}</text>
 					<text class="unit">/元每件</text>
 				</view>
 				<view class="price-imgs">
-					<image :src="configList.vip_money_one" mode="aspectFill"
-						class="price-img"></image>
+					<image :src="configList.vip_money_one" mode="aspectFill" class="price-img"></image>
 				</view>
-			</view>
-			
-			<view class="price">
+			</view> -->
+
+			<!-- <view class="price">
 				<view class="money">
 					￥<text>{{ productDetail.silverPrice }}</text>
 					<text class="unit">/元每件</text>
@@ -53,9 +64,9 @@
 					<image :src="configList.vip_money_two" mode="aspectFill" class="price-img">
 					</image>
 				</view>
-			</view>
-			
-			<view class="price">
+			</view> -->
+
+			<!-- <view class="price">
 				<view class="money">
 					￥<text>{{ productDetail.diamondPrice }}</text>
 					<text class="unit">/元每件</text>
@@ -64,11 +75,11 @@
 					<image :src="configList.vip_money_three" mode="aspectFill" class="price-img">
 					</image>
 				</view>
-			</view>
+			</view> -->
 		</view>
 
 		<!-- 服务 -->
-		<view class="server">
+		<!-- <view class="server">
 			<view class="setver-main">
 				<view class="title">服务</view>
 				<view class="descript">
@@ -79,7 +90,7 @@
 			<view class="server-arraw">
 				<uv-icon name="arrow-right"></uv-icon>
 			</view>
-		</view>
+		</view> -->
 
 		<!-- 参数 -->
 		<view v-if="productDetail.sku" class="params">
@@ -97,22 +108,20 @@
 
 		<!-- 商品详情 -->
 		<view class="item-line">
-			<view class="before"></view>
+			<!-- <view class="before"></view> -->
 			<view class="label">商品详情</view>
 		</view>
 
 		<uv-parse :content="productDetail.details"></uv-parse>
 
 		<!-- 分享和购买按钮 -->
-		<submit 
-		@service="service" 
-		@toSend="toSend"
-		@submit="submit" 
-		@addCart="addCart"
-		:detail="productDetail" />
+		<submit @service="service" @toSend="toSend" @submit="submit" @addCart="addCart" :detail="productDetail" />
 
 		<!-- 联系客服 -->
 		<customerServicePopup ref="customerServicePopup" />
+		<newCouponPopup ref="newCouponPopup" />
+		<placeOrder ref="placeOrder" />
+		<uv-safe-bottom />
 	</view>
 </template>
 
@@ -120,12 +129,15 @@
 	import submit from '../components/product/submit.vue'
 	import submitUnitSelect from '../components/product/submitUnitSelect.vue'
 	import customerServicePopup from '@/components/config/customerServicePopup.vue'
-
+	import newCouponPopup from '@/components/couponPopup/newCouponPopup.vue'
+	import placeOrder from '../components/order/placeOrder.vue'
 	export default {
 		components: {
 			submit,
 			submitUnitSelect,
-			customerServicePopup
+			customerServicePopup,
+			newCouponPopup,
+			placeOrder
 		},
 		data() {
 			return {
@@ -134,6 +146,7 @@
 					details: '',
 				},
 				id: 0,
+				current1: 0
 			}
 		},
 		onLoad(args) {
@@ -152,7 +165,8 @@
 				this.$api('addCart', {
 					shopId : this.id,
 					num : 1,
-				}, res => {
+				}, 
+				res => {
 					if(res.code == 200){
 						uni.showToast({
 							title: '加入购物车成功',
@@ -163,11 +177,11 @@
 			},
 			// 立即下单
 			submit() {
-				this.$store.commit('setPayOrderProduct', [
-					this.productDetail
-				])
-
-				this.$utils.navigateTo('/pages_order/order/createOrder')
+				this.$refs.placeOrder.open()
+				// this.$store.commit('setPayOrderProduct', [
+				// 	this.productDetail
+				// ])
+				// this.$utils.navigateTo('/pages_order/order/createOrder')
 			},
 			toSend(){
 				this.$store.commit('setPayOrderProduct', [
@@ -211,21 +225,51 @@
 			z-index: 99;
 		}
 		
-		.swipe {}
+		.swipe {
+			// 这是轮播图的指示器自定义样式
+			@mixin flex($direction: row) {
+				/* #ifndef APP-NVUE */
+				display: flex;
+				/* #endif */
+				flex-direction: $direction;
+			}
+		
+			.indicator {
+				@include flex(row);
+				justify-content: center;
+		
+				&__dot {
+					height: 8px;
+					width: 8px;
+					border-radius: 100%;
+					background-color: #fff;
+					margin: 0 5px;
+					transition: background-color 0.3s;
+		
+					&--active {
+						background-color: $uni-color;
+					}
+				}
+			}
+		}
 
 		// 商品标题
 		.info {
 			padding: 20rpx;
+			padding-left: 30rpx;
 			background-color: #fff;
 			display: flex;
 			flex-direction: column;
 			gap: 14rpx;
+			border-bottom: 30rpx #F7F7F7 solid;
+			.new-price{
+				color: $uni-color-second;
+			}
 			.title {
-				font-size: 36rpx;
-				font-weight: 900;
+				font-size: 30rpx;
+				font-weight: 600;
 			}
 		}
-
 		// 服务 & 参数
 		.server,
 		.params {
diff --git a/static/image/logo.png b/static/image/logo.png
new file mode 100644
index 0000000..c124b0f
Binary files /dev/null and b/static/image/logo.png differ
diff --git a/static/image/券.webp b/static/image/券.webp
new file mode 100644
index 0000000..b363e12
Binary files /dev/null and b/static/image/券.webp differ
diff --git a/static/image/多人下单.webp b/static/image/多人下单.webp
new file mode 100644
index 0000000..7eaf4e6
Binary files /dev/null and b/static/image/多人下单.webp differ
diff --git a/static/image/红烧肉.png b/static/image/红烧肉.png
new file mode 100644
index 0000000..d9ead52
Binary files /dev/null and b/static/image/红烧肉.png differ
diff --git a/uni.scss b/uni.scss
index 6b6a8aa..e38d268 100644
--- a/uni.scss
+++ b/uni.scss
@@ -13,6 +13,7 @@
  */
 /* 颜色变量 */
 $uni-color: #019245;
+$uni-color-second: #FF2A2A;
 
 /* 行为相关颜色 */
 $uni-color-primary: #007aff;