From 4c0c7752dc996baba58f33aa101a7385752061a3 Mon Sep 17 00:00:00 2001
From: zxl <763096477@qq.com>
Date: 星期二, 06 一月 2026 17:02:00 +0800
Subject: [PATCH] 厨师

---
 pages/kitchen/KitchenCover.vue     |   70 +++++++
 pages.json                         |   20 ++
 pages/kitchen/KitchenCustomize.vue |  366 ++++++++++++++++++++++++++++++++++++++++
 components/TopBar.vue              |   27 ++
 api/kitchen.js                     |   30 +++
 components/custom-tabbar.vue       |    3 
 pages/tabbar/index/home.vue        |   12 
 7 files changed, 515 insertions(+), 13 deletions(-)

diff --git a/api/kitchen.js b/api/kitchen.js
new file mode 100644
index 0000000..2f2a03a
--- /dev/null
+++ b/api/kitchen.js
@@ -0,0 +1,30 @@
+import { http, Method } from "@/utils/request.js";
+
+export function getKitchenBanner(){
+    return http.request({
+        url: "/lmk/kitchen/banner",
+        method: Method.GET,
+    })
+}
+
+export function getKitchenTag(){
+    return http.request({
+        url: "/lmk/kitchen/kitchenTag",
+        method: Method.GET,
+    })
+}
+
+export function getKitchenCover(){
+    return http.request({
+        url: "/lmk/kitchen/kitchenCover",
+        method: Method.GET,
+    })
+}
+
+export function getKitchenGoods(param){
+    return http.request({
+        url: "/lmk/kitchen/kitchenGoods",
+        method: Method.GET,
+        params:param
+    })
+}
\ No newline at end of file
diff --git a/components/TopBar.vue b/components/TopBar.vue
index 60d3e81..fce4d17 100644
--- a/components/TopBar.vue
+++ b/components/TopBar.vue
@@ -1,5 +1,5 @@
 <template>
-	<view class="top-bar" :style="{paddingTop: statusBarHeight + 'px'}">
+	<view class="top-bar" :style="{paddingTop: statusBarHeight + 'px', backgroundColor: bgColor}" :class="{'has-bg': bgColor !== 'transparent'}">
 		<view class="top-bar-content">
 			<!-- 鏍囬鍒楄〃 -->
 			<scroll-view class="title-scroll" scroll-x="true" scroll-with-animation :scroll-left="scrollLeft">
@@ -31,6 +31,10 @@
 			textColor: {
 				type: String,
 				default: 'white'
+			},
+			bgColor: {
+				type: String,
+				default: 'transparent'
 			}
 		},
 		data() {
@@ -44,6 +48,11 @@
 						title: '鎺ㄨ崘'
 					},
 					{
+						index: 'kitchenCustomize',
+						pagePath: '/pages/kitchen/KitchenCustomize',
+						title: '鍘ㄦ埧瀹氬埗'
+					},
+					{
 						index: 'shop',
 						pagePath: '/pages/commodity-square/commoditySquare',
 						title: '鍟嗗搧骞垮満'
@@ -53,11 +62,11 @@
 						pagePath: '/pages/mine/activity/reportActivity',
 						title: '娲诲姩'
 					},
-					{
-						index: 'health',
-						pagePath: '/pages/health/healthVideo',
-						title: '澶у仴搴�'
-					}
+					// {
+					// 	index: 'health',
+					// 	pagePath: '/pages/health/healthVideo',
+					// 	title: '澶у仴搴�'
+					// }
 				]
 			};
 		},
@@ -98,6 +107,10 @@
 			left: 0;
 			right: 0;
 			z-index: 999;
+		}
+
+		.top-bar.has-bg {
+			box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
 		}
 		
 		.top-bar .top-bar-content {
@@ -144,4 +157,4 @@
 			/* background-color: white; */
 			border-radius: 4rpx;
 		}
-</style>
\ No newline at end of file
+</style>
diff --git a/components/custom-tabbar.vue b/components/custom-tabbar.vue
index d4577e8..4713f8b 100644
--- a/components/custom-tabbar.vue
+++ b/components/custom-tabbar.vue
@@ -41,8 +41,9 @@
 						"key": 'index'
 					},
 					{
+						// KitchenVideo
 						// "pagePath": "/pages/tabbar/category/category",
-						"pagePath": "/pages/kitchen/KitchenVideo",
+						"pagePath": "/pages/kitchen/KitchenCover",
 
 						"iconPath": "/static/tabbar/category.png",
 						"selectedIconPath": "/static/tabbar/category-s.png",
diff --git a/pages.json b/pages.json
index 4ce0090..98bcec1 100644
--- a/pages.json
+++ b/pages.json
@@ -22,7 +22,11 @@
       "style": {
         // "navigationBarTitleText" : "瑙嗛",
         "enablePullDownRefresh": false,
-        "navigationStyle": "custom"
+        "navigationStyle": "custom",
+        "componentPlaceholder": {
+          "u-icon": "view"
+        }
+        
         // 闅愯棌椤堕儴瀵艰埅鏍�
       }
     },
@@ -1919,6 +1923,20 @@
             "navigationStyle": "custom"
             // 闅愯棌绯荤粺瀵艰埅鏍�
           }
+        },
+        {
+          "path": "KitchenCustomize",
+          "style": {
+            "navigationBarTitleText": "绁炲帹瀹氬埗",
+            "navigationStyle": "custom"
+          }
+        },
+        {
+          "path": "KitchenCover",
+          "style": {
+            "navigationBarTitleText": "绁炲帹灏侀潰",
+            "navigationStyle": "custom"
+          }
         }
       ]
     },
diff --git a/pages/kitchen/KitchenCover.vue b/pages/kitchen/KitchenCover.vue
new file mode 100644
index 0000000..82ad194
--- /dev/null
+++ b/pages/kitchen/KitchenCover.vue
@@ -0,0 +1,70 @@
+<template>
+	<view class="page-container">
+		<scroll-view scroll-y="true" class="scroll-view">
+			<image v-if="coverUrl" :src="coverUrl" mode="widthFix" class="bg-image"></image>
+			<view v-else class="empty-text">鏆傛棤</view>
+
+			<!-- 搴曢儴鐣欏嚭瀵艰埅鏍忛珮搴︾殑绌洪棿 -->
+			<view class="safe-area-bottom"></view>
+		</scroll-view>
+		<custom-tabbar bgColor="#ffffff" selected="kitchen"></custom-tabbar>
+	</view>
+</template>
+
+<script>
+	import { getKitchenCover } from "@/api/kitchen.js";
+	export default {
+		data() {
+			return {
+				coverUrl: ''
+			};
+		},
+		onLoad() {
+			this.fetchCover();
+		},
+		methods: {
+			async fetchCover() {
+				try {
+					const res = await getKitchenCover();
+					if (res.statusCode === 200 && res.data.data && res.data.data.length > 0) {
+						this.coverUrl = res.data.data[0].coverUrl;
+					}
+				} catch (e) {
+					console.error("鑾峰彇绁炲帹灏侀潰澶辫触", e);
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.page-container {
+		width: 100vw;
+		height: 100vh;
+		position: relative;
+		overflow: hidden;
+		background-color: #ffffff;
+	}
+
+	.scroll-view {
+		width: 100%;
+		height: 100%;
+	}
+
+	.bg-image {
+		width: 100%;
+		display: block;
+	}
+
+	.empty-text {
+		text-align: center;
+		padding-top: 300rpx;
+		color: #999;
+		font-size: 28rpx;
+	}
+
+	.safe-area-bottom {
+		height: 120rpx; // 涓哄簳閮ㄥ鑸爮鐣欏嚭绌洪棿
+		width: 100%;
+	}
+</style>
diff --git a/pages/kitchen/KitchenCustomize.vue b/pages/kitchen/KitchenCustomize.vue
new file mode 100644
index 0000000..6aceca8
--- /dev/null
+++ b/pages/kitchen/KitchenCustomize.vue
@@ -0,0 +1,366 @@
+<template>
+    <view class="page">
+        <top-bar selectedTitleIndex="kitchenCustomize" textColor="black" bgColor="#ffffff" @changeTab="topBarChange"></top-bar>
+        <view class="banner">
+            <image class="banner-img" :src="banner" mode="aspectFill"></image>
+        </view>
+        <view class="content">
+            <scroll-view class="tags-scroll" scroll-x="true" :show-scrollbar="false">
+                <view class="tags">
+                    <view v-for="tag in tags" :key="tag.value" class="tag" :class="{ active: tag.selected }"
+                        @click="toggleTag(tag)">
+                        <text>{{ tag.label }}</text>
+                    </view>
+                </view>
+            </scroll-view>
+            <!-- 鏂板鍟嗗搧鍒楄〃 -->
+            <view class="product-list">
+                <view v-for="item in products" :key="item.id" class="product-card" @click="goToDetail(item)">
+                    <image class="product-img" :src="item.coverImg" mode="aspectFill"></image>
+                    <view>
+                        <view class="product-top">
+                            <view class="product-name">{{ item.comboName }}</view>
+                            <view class="product-num">{{ item.num }}</view>
+
+                        </view>
+                        <view class="product-info">
+                            <view class="product-remark">{{ item.remark }}</view>
+                            <view class="product-bottom">
+                                <view class="product-orign-price">
+                                    <text class="symbol">鍘熶环锟�</text>
+                                    <text class="value">{{ item.orginPrice }}</text>
+                                </view>
+                                <view class="product-price">
+                                    <text class="symbol">锟�</text>
+                                    <text class="value">{{ item.price }}</text>
+                                </view>
+                            </view>
+                        </view>
+
+                    </view>
+                </view>
+                <view v-if="products.length === 0" class="empty-tip">
+                    鏆傛棤鐩稿叧鍟嗗搧
+                </view>
+                <!-- 鍔犺浇鏇村鎻愮ず -->
+                <view class="load-more-tip" v-else>
+                    <text v-if="loadStatus === 'loading'">鍔犺浇涓�...</text>
+                    <text v-else-if="loadStatus === 'noMore'">娌℃湁鏇村浜�</text>
+                    <text v-else>涓婃媺鍔犺浇鏇村</text>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+<script>
+import { getKitchenTag, getKitchenBanner, getKitchenGoods } from "@/api/kitchen.js";
+import TopBar from "@/components/TopBar.vue";
+export default {
+    components: {
+        TopBar,
+    },
+    data() {
+        return {
+            banner: '',
+            tags: [],
+            // 鏂板妯℃嫙鍟嗗搧鏁版嵁
+            queryParams: {
+                tagId: '',
+                pageSize: 5,
+                pageNumber: 1,
+            },
+            loadStatus: 'more', // more, loading, noMore
+            products: []
+        };
+    },
+    computed: {
+        // 鏂板杩囨护閫昏緫
+        // filteredProducts() {
+        //     const selectedValues = this.tags.filter(t => t.selected).map(t => t.value);
+        //     if (selectedValues.length === 0) {
+        //         return this.products;
+        //     }
+        //     // 鏂板鍒ゆ柇鏄惁鍖呭惈'鍏ㄩ儴'鏍囩
+        //     if (selectedValues.includes('all')) {
+        //         return this.products;
+        //     }
+        //     return this.products.filter(item => selectedValues.includes(item.category));
+        // }
+    },
+    onLoad() {
+        this.initData();
+    },
+    onReachBottom() {
+        if (this.loadStatus === 'more') {
+            this.queryParams.pageNumber++;
+            this.getProductList();
+        }
+    },
+    methods: {
+        async initData() {
+            await getKitchenBanner().then(res => {
+                if (res.statusCode === 200) {
+                    this.banner = res.data.data[0].coverUrl;
+                    console.log(res)
+                }
+            });
+            await getKitchenTag().then(res => {
+                if (res.statusCode === 200) {
+                    if (res.data.data.length > 0) {
+                        this.tags = res.data.data
+                            .sort((a, b) => (a.sort || 0) - (b.sort || 0))
+                            .map((item, index) => ({
+                                label: item.tagName,
+                                value: item.id,
+                                selected: index === 0
+                            }));
+                    }
+                }
+            });
+            this.queryParams.tagId = this.tags[0].value;
+            this.getProductList();
+
+        },
+        getProductList() {
+            if (this.loadStatus === 'loading') return;
+            this.loadStatus = 'loading';
+            getKitchenGoods(this.queryParams).then(res => {
+                if (res.statusCode === 200) {
+                    const newList = res.data.data || [];
+                    if (this.queryParams.pageNumber === 1) {
+                        this.products = newList;
+                    } else {
+                        this.products = this.products.concat(newList);
+                    }
+                    
+                    // 鍒ゆ柇鏄惁杩樻湁鏇村鏁版嵁
+                    if (newList.length < this.queryParams.pageSize) {
+                        this.loadStatus = 'noMore';
+                    } else {
+                        this.loadStatus = 'more';
+                    }
+                } else {
+                    this.loadStatus = 'more';
+                }
+            }).catch(() => {
+                this.loadStatus = 'more';
+            });
+        },
+        toggleTag(tag) {
+            console.log("鐐瑰嚮浜嗘爣绛�:", tag);
+            if (tag.selected) return; // 宸茬粡鏄�変腑鐘舵�佸垯涓嶉噸澶嶅姞杞�
+
+            // 灏嗘墍鏈夋爣绛捐涓烘湭閫変腑锛岀劧鍚庡皢褰撳墠鐐瑰嚮鐨勬爣绛捐涓洪�変腑锛堝崟閫夐�昏緫锛�
+            this.tags.forEach(t => {
+                t.selected = (t.value === tag.value);
+            });
+            
+            // 閲嶇疆鍒嗛〉鍙傛暟
+            this.queryParams.tagId = tag.value;
+            this.queryParams.pageNumber = 1;
+            this.products = [];
+            this.loadStatus = 'more';
+            
+            // 閲嶆柊鑾峰緱鍟嗗搧
+            this.getProductList();
+        },
+        goToDetail(item) {
+            console.log("璺宠浆璇︽儏:", item);
+            uni.navigateTo({
+                url: `/pages/product/goods?id=${item.skuId}&goodsId=${item.goodsId}`
+            });
+        },
+        topBarChange(titleObj) {
+            console.log("椤堕儴瀵艰埅鍒囨崲:", titleObj);
+            if (titleObj.pagePath) {
+                if (titleObj.pagePath.includes('home')) {
+                    uni.reLaunch({
+                        url: titleObj.pagePath
+                    });
+                } else {
+                    uni.navigateTo({
+                        url: titleObj.pagePath
+                    });
+                }
+            }
+        }
+    }
+};
+</script>
+<style lang="scss" scoped>
+.page {
+    min-height: 100vh;
+    background-color: #f4f4f4;
+    padding-top: 160rpx; // 澧炲姞绌洪棿锛岀‘淇濅笉涓庡鑸爮閲嶅彔
+}
+
+.banner {
+    width: 100%;
+    height: 450rpx;
+    padding: 24rpx;
+    border-radius: 24rpx;
+    box-sizing: border-box;
+    margin-top: 10rpx; // 棰濆澧炲姞涓�鐐归棿璺�
+}
+
+.banner-img {
+    width: 100%;
+    height: 100%;
+    border-radius: 24rpx;
+}
+
+.content {
+    padding: 24rpx;
+}
+
+.tags-scroll {
+    width: 100%;
+    white-space: nowrap;
+}
+
+.tags {
+    display: flex;
+    flex-wrap: nowrap;
+    padding: 10rpx 0;
+}
+
+.tag {
+    height: 80rpx;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 30rpx;
+    color: black;
+    border: 1rpx solid #e5e5e5;
+    border-radius: 25rpx 25rpx 0 0; 
+    background-color: #f7f7f7;
+    white-space: nowrap;
+    flex-shrink: 0;
+}
+
+.tag.active {
+    background: linear-gradient(to bottom, #d2c29e, #FFFFFF);
+    border-color: linear-gradient(to bottom, #d2c29e, #FFFFFF);
+}
+
+// 鏂板鍟嗗搧鍒楄〃鏍峰紡
+.product-list {
+    display: flex;
+    flex-direction: column;
+    gap: 24rpx;
+}
+
+.product-card {
+    background-color: #ffffff;
+    border-radius: 20rpx;
+    padding: 20rpx;
+    box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
+}
+
+.product-img {
+    background-color: #999;
+    width: 100%;
+    height: 350rpx;
+    border-radius: 12rpx;
+    flex-shrink: 0;
+}
+
+.product-info {
+    flex: 1;
+    margin-left: 20rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    overflow: hidden; // 纭繚瀛愬厓绱犳孩鍑洪殣钘�
+}
+
+.product-top {
+    flex: 1;
+    margin-left: 20rpx;
+    display: flex;
+    // flex-direction: column;
+    // justify-content: space-between;
+}
+
+.product-name {
+    font-size: 30rpx;
+    font-weight: bold;
+    color: #333;
+    line-height: 1.4;
+}
+
+.product-num {
+    width: 80rpx;
+    border-radius: 25rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 24rpx;
+    margin-left: 10rpx;
+    color: #ae9e7f;
+    background-color: #f6f2e3;
+}
+
+.product-remark {
+    font-size: 24rpx;
+    color: #999;
+    flex: 1; // 鍗犳嵁鍓╀綑绌洪棿
+    margin-right: 20rpx;
+    white-space: nowrap; // 涓嶆崲琛�
+    overflow: hidden; // 婧㈠嚭闅愯棌
+    text-overflow: ellipsis; // 鏄剧ず鐪佺暐鍙�
+}
+
+.product-bottom {
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-end;
+}
+
+.product-orign-price {
+    font-size:24rpx;
+    color: #999;
+    text-decoration: line-through;
+}
+
+.product-price {
+    color: #ff573e;
+
+    .symbol {
+        font-size: 24rpx;
+    }
+
+    .value {
+        font-size: 50rpx;
+        font-weight: bold;
+    }
+}
+
+.buy-btn {
+    padding: 10rpx 24rpx;
+    background-color: #333;
+    color: #fff;
+    font-size: 24rpx;
+    border-radius: 30rpx;
+}
+
+.empty-tip {
+    text-align: center;
+    padding: 100rpx 0;
+    color: #999;
+    font-size: 28rpx;
+}
+
+.load-more-tip {
+    text-align: center;
+    padding: 30rpx 0;
+    color: #999;
+    font-size: 24rpx;
+}
+.topBar {
+	position: fixed;
+	top: 20rpx;
+	left: 20rpx;
+	z-index: 1000
+}
+</style>
diff --git a/pages/tabbar/index/home.vue b/pages/tabbar/index/home.vue
index 11528ac..d38ceb0 100644
--- a/pages/tabbar/index/home.vue
+++ b/pages/tabbar/index/home.vue
@@ -402,12 +402,14 @@
 	},
 	onShow() {
 		getSessionId().then(res=>{
-			console.log('res',JSON.stringify(res))
-      if (res.code === 200){
+			console.log('鎵ц浜唎nshow')
+      if (res.statusCode === 200){
         this.pageSessionNo = res.data.data
         if(this.pageSessionNo){
           let	param = Object.assign({},this.actionParam);
+		  console.log("鎵撳嵃param",param)
           this.actionParam.sessionId = this.pageSessionNo
+		  console.log("鎵撳嵃this.actionParam",this.actionParam)
           param.sessionId = this.pageSessionNo
           userAction(param)
         }
@@ -457,7 +459,8 @@
     if (this.sendOnShow)return
     param.pageStatus = "LEAVE"
     // if (this.isNotEmpty(param.sessionId)){
-      console.log("绂诲紑椤甸潰寮�濮嬭褰�")
+    console.log(param)
+      console.log("onUnload绂诲紑椤甸潰寮�濮嬭褰�")
       //TODO 椤甸潰鍒锋柊 瀵艰嚧onshow鏈墽琛岋紝瀵艰嚧sessionId鏈祴鍊�
       userAction(param)
     // }
@@ -472,8 +475,9 @@
     userAction(param)
   },
 	onLoad(option) {
+		console.log('瑙﹀彂onLoad')
 		if(option.shareId){
-			console.log('瑙﹀彂onLoad')
+			
 			this.actionParam.shareId = option.shareId;
 			this.actionParam.joinType = 'SHARE'
 			uni.setStorage({

--
Gitblit v1.8.0