diff --git a/src/views/dataBoard/dataBoard.vue b/src/views/dataBoard/dataBoard.vue
index df56ae9..cff6545 100644
--- a/src/views/dataBoard/dataBoard.vue
+++ b/src/views/dataBoard/dataBoard.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="outer-d">
         <div class="title">
-            <img src="@/assets/images/dataBoard/title.png" alt="" />
+            <img src="@/assets/images/dataBoard/title.png" alt=""/>
         </div>
         <div class="total">
             <div class="total-left">{{ preTime(nowTime) }}</div>
@@ -13,7 +13,7 @@
                                 :startVal="dataInitOverview.userCount ? dataInitOverview.userCount : 0"
                                 :endVal="dataOverview.userCount"
                                 separator=""
-                                :duration="1500" />
+                                :duration="1500"/>
                         </span>
                         <span>人</span>
                     </div>
@@ -26,7 +26,7 @@
                                 :startVal="dataInitOverview.perCalorie ? dataInitOverview.perCalorie : 0"
                                 :endVal="dataOverview.perCalorie"
                                 separator=""
-                                :duration="1500" />
+                                :duration="1500"/>
                         </span>
                         <span>千卡</span>
                     </div>
@@ -39,28 +39,32 @@
                                 :startVal="dataInitOverview.perScore ? dataInitOverview.perScore : 0"
                                 :endVal="dataOverview.perScore"
                                 separator=""
-                                :duration="1500" />
+                                :duration="1500"/>
                         </span>
                         <span>分</span>
                     </div>
                     <div>人均营养分</div>
                 </div>
             </div>
-            <div class="total-right">{{mealType}} {{mealTimeStart && mealTimeEnd ? `(${mealTimeStart} ~ ${mealTimeEnd})` : ''}}</div>
+            <div class="total-right">{{ mealType }}
+                {{ mealTimeStart && mealTimeEnd ? `(${mealTimeStart} ~ ${mealTimeEnd})` : '' }}
+            </div>
         </div>
         <div class="table-top">
             <div>
-                <img class="voice-img" src="@/assets/images/bigScreen/voice.png" alt="" />
+                <img class="voice-img" src="@/assets/images/bigScreen/voice.png" alt=""/>
                 <span class="voice-span">
                 实时播报：
             </span>
             </div>
             <div class="scroll-container">
-<!--                <div class="scroll-content animal-css" :style="animationCss">-->
-                <div class="scroll-content" :style="animationCss" :class="[orderListData.length > 0 ? 'animal-css' : '']">
+                <!--                <div class="scroll-content animal-css" :style="animationCss">-->
+                <div class="scroll-content" :style="animationCss"
+                     :class="[orderListData.length > 0 ? 'animal-css' : '']">
                     <div v-for="(item,index) in orderListData" :key="`top-list-data-${index}`">
-                        <img style="border-radius: 8px" :src="item.avatarUrl || require('@/assets/images/bigScreen/user.png')" alt="" />
-                        {{preName(item.userName)}} {{item.score}}分 第{{item?.rank}}名；
+                        <img style="border-radius: 8px"
+                             :src="item.avatarUrl || require('@/assets/images/bigScreen/user.png')" alt=""/>
+                        {{ preName(item.userName) }} {{ item.score }}分 第{{ item?.rank }}名；
                     </div>
                 </div>
             </div>
@@ -71,38 +75,41 @@
                     <div>排名</div>
                     <div>
                         <div class="table-info-one">用户信息</div>
+                        <div class="table-info-userNo">用户编号</div>
                         <div class="table-title-point table-info-two">
                             健康得分
-                            <img src="@/assets/images/dataBoard/down.png" alt="" />
+                            <img src="@/assets/images/dataBoard/down.png" alt=""/>
                         </div>
                         <div class="table-info-three">下单时间</div>
                     </div>
                 </div>
                 <transition-group name="flip-list" tag="div" style="flex: 1;overflow: auto;">
                     <div class="table-item" v-for="(item, index) in listData.slice(0, 10)" :key="`list-data-${index}`">
-                    <div class="index-item">
-                        <template v-if="index === 0">
-                            <img src="@/assets/images/bigScreen/1.png" alt="" />
-                        </template>
-                        <template v-else-if="index === 1">
-                            <img src="@/assets/images/bigScreen/2.png" alt="" />
-                        </template>
-                        <template v-else-if="index === 2">
-                            <img src="@/assets/images/bigScreen/3.png" alt="" />
-                        </template>
-                        <template v-else>
-                            <div class="img-d">
-                                {{index+1}}
-                            </div>
-                        </template>
-                        <img style="border-radius: 8px" class="title-img" :src="item.avatarUrl || require('@/assets/images/bigScreen/user.png')" alt="" />
+                        <div class="index-item">
+                            <template v-if="index === 0">
+                                <img src="@/assets/images/bigScreen/1.png" alt=""/>
+                            </template>
+                            <template v-else-if="index === 1">
+                                <img src="@/assets/images/bigScreen/2.png" alt=""/>
+                            </template>
+                            <template v-else-if="index === 2">
+                                <img src="@/assets/images/bigScreen/3.png" alt=""/>
+                            </template>
+                            <template v-else>
+                                <div class="img-d">
+                                    {{ index + 1 }}
+                                </div>
+                            </template>
+                            <img style="border-radius: 8px" class="title-img"
+                                 :src="item.avatarUrl || require('@/assets/images/bigScreen/user.png')" alt=""/>
+                        </div>
+                        <div>
+                            <div class="table-info-one">{{ preName(item.userName) }}</div>
+                            <div class="table-info-userNo">{{ item.userNo }}</div>
+                            <div class="table-info-two" style="color: #FFB99C">{{ item.score }}</div>
+                            <div class="table-info-three">{{ preDate(item.pickupTime) }}</div>
+                        </div>
                     </div>
-                    <div>
-                        <div class="table-info-one">{{preName(item.userName)}}</div>
-                        <div class="table-info-two" style="color: #FFB99C">{{ item.score}}</div>
-                        <div class="table-info-three">{{preDate(item.pickupTime)}}</div>
-                    </div>
-                </div>
                 </transition-group>
             </div>
             <div class="table-right-d">
@@ -111,26 +118,29 @@
                 </div>
                 <div class="table-right-d-body">
                     <transition-group name="flip-list" tag="div" class="progress-d">
-                        <div class="progress-d-item" v-for="(item, index) in valList.slice(0, 6)" :key="`val-list-${index}`">
+                        <div class="progress-d-item" v-for="(item, index) in valList.slice(0, 6)"
+                             :key="`val-list-${index}`">
                             <div style="color: #FFFFFF;display: flex;align-items: center">
                                 <template v-if="index === 0">
-                                    <img src="@/assets/images/bigScreen/1.png" alt="" />
+                                    <img src="@/assets/images/bigScreen/1.png" alt=""/>
                                 </template>
                                 <template v-else-if="index === 1">
-                                    <img src="@/assets/images/bigScreen/2.png" alt="" />
+                                    <img src="@/assets/images/bigScreen/2.png" alt=""/>
                                 </template>
                                 <template v-else-if="index === 2">
-                                    <img src="@/assets/images/bigScreen/3.png" alt="" />
+                                    <img src="@/assets/images/bigScreen/3.png" alt=""/>
                                 </template>
                                 <template v-else>
                                     <div class="index-d">
-                                        {{index+1}}、
+                                        {{ index + 1 }}、
                                     </div>
                                 </template>
-                                <div class="index-name">{{item.foodName}}</div>
+                                <div class="index-name">{{ item.foodName }}</div>
                             </div>
                             <div>
-                                <div :style="{width: item.weightPoint + '%'}" style="border-radius: 50px;height: 100%;transition: width 0.5s ease-in-out;" :class="getProgressClass(item.weightPoint )"></div>
+                                <div :style="{width: item.weightPoint + '%'}"
+                                     style="border-radius: 50px;height: 100%;transition: width 0.5s ease-in-out;"
+                                     :class="getProgressClass(item.weightPoint )"></div>
                             </div>
                         </div>
                     </transition-group>
@@ -139,36 +149,37 @@
                         <div class="swiper-container" v-if="swiperList.length !== 0">
                             <div class="swiper-wrapper">
                                 <div class="swiper-slide" v-for="(item, index) in swiperList" :key="`slide-${index}`">
-                                        <!-- 图片轮播 -->
-                                        <img
-                                            v-if="item.type === 'image'"
-                                            :src="item.url"
-                                            class="swiper-content"
-                                            alt="轮播图片"
-                                        />
-                                        <!-- 视频轮播 -->
-                                        <video
-                                            v-else-if="item.type === 'video'"
-                                            class="swiper-content"
-                                            :ref="`videRef${index}`"
-                                            :src="item.url"
-                                            @ended="onVideoEnded"
-                                        >
-                                        </video>
-                                    </div>
+                                    <!-- 图片轮播 -->
+                                    <img
+                                        v-if="item.type === 'image'"
+                                        :src="item.url"
+                                        class="swiper-content"
+                                        alt="轮播图片"
+                                    />
+                                    <!-- 视频轮播 -->
+                                    <video
+                                        v-else-if="item.type === 'video'"
+                                        class="swiper-content"
+                                        :ref="`videRef${index}`"
+                                        :src="item.url"
+                                        @ended="onVideoEnded"
+                                    >
+                                    </video>
+                                </div>
                             </div>
                         </div>
                         <div class="no-data-d" v-else>
                             <div>
                                 <div style="display: flex;align-items: center;justify-content: center">
-                                    <img src="@/assets/images/bigScreen/noData.png" alt="" />
+                                    <img src="@/assets/images/bigScreen/noData.png" alt=""/>
                                 </div>
                                 <div class="no-data-msg">
                                     <div>
                                         欢迎用餐
                                     </div>
                                     <div>
-                                        <div>均衡饮食很重要</div> <div>你我生活都需要</div>
+                                        <div>均衡饮食很重要</div>
+                                        <div>你我生活都需要</div>
                                     </div>
                                 </div>
                             </div>
@@ -183,743 +194,792 @@
     </div>
 </template>
 <script>
-    import * as dayjs from "dayjs";
-    import 'dayjs/locale/zh-cn';
-    import Swiper from 'swiper';
-    import 'swiper/css/swiper.css';
-    import {httpRequest} from "@/XMLHttpRequest";
-    import countTo from "vue-count-to";
-    import {callBackMqttMessage, disconnectMqtt, initMqtt} from "@/utils/mqtt";
+import * as dayjs from "dayjs";
+import 'dayjs/locale/zh-cn';
+import Swiper from 'swiper';
+import 'swiper/css/swiper.css';
+import {httpRequest} from "@/XMLHttpRequest";
+import countTo from "vue-count-to";
+import {callBackMqttMessage, disconnectMqtt, initMqtt} from "@/utils/mqtt";
 
-    export default {
-        name: 'DataBoard',
-        components: {
-            countTo
-        },
-        data() {
-            return {
-                url: "https://dev.yixiong-tech.com:8081/nutrition/",
-                nowTimeInterval: null,
-                nowTime: dayjs(),
-                mealType: '',
-                mealTimeStart: '',
-                mealTimeEnd: '',
-                dataInitOverview: {
-                    userCount: 0,
-                    perCalorie: 0,
-                    perScore: 0
-                },
-                dataOverview: {
-                    userCount: 0,
-                    perCalorie: 0,
-                    perScore: 0
-                },
-                listData: [],
-                orderListData: [],
-                // 餐品热度数据：包含名称和热度值
-                valList: [],
-                // 轮播数据：支持图片和视频
-                swiperList: [],
-                // 轮播定时器
-                swiperTimer: null,
-                // 是否正在播放视频
-                isPlayingVideo: false,
-                // Swiper 实例引用
-                swiperInstance: null,
-            }
-        },
-        created() {
-            this.initMqttConnect();
-            this.initTime();
-            this.initData('');
-        },
-        computed: {
-            animationCss() {
-                return this.orderListData && this.orderListData.length > 0 ? {
-                    // animationName: 'scroll',
-                    animationDuration: (this.orderListData.length === 0 ? 0 : 45) + 's',
-                    animationTimingFunction: 'linear',
-                    // animationIterationCount: 'infinite',
-                    animationFillMode: 'forwards'
-                } : {}
-            }
-        },
-        mounted() {
-        },
-        beforeDestroy() {
-            if (this.nowTimeInterval) {
-                clearInterval(this.nowTimeInterval);
-            }
-            if (this.pollTimer) {
-                clearInterval(this.pollTimer);
-            }
-            if (this.swiperTimer) {
-                clearTimeout(this.swiperTimer);
-            }
-            if (this.swiperInstance) {
-                this.swiperInstance.destroy();
-            }
-            disconnectMqtt('db');
-        },
-        methods: {
-            initMqttConnect() {
-                const clientId = 'db-' + Math.random().toString(16).substring(2, 8);
-                console.log(clientId);
-                initMqtt(clientId, 'yx/device/rankingScreen/needUpdate', 'db', {
+export default {
+    name: 'DataBoard',
+    components: {
+        countTo
+    },
+    data() {
+        return {
+            url: "https://dev.yixiong-tech.com:8081/nutrition/",
+            nowTimeInterval: null,
+            nowTime: dayjs(),
+            mealType: '',
+            mealTimeStart: '',
+            mealTimeEnd: '',
+            dataInitOverview: {
+                userCount: 0,
+                perCalorie: 0,
+                perScore: 0
+            },
+            dataOverview: {
+                userCount: 0,
+                perCalorie: 0,
+                perScore: 0
+            },
+            listData: [],
+            orderListData: [],
+            // 餐品热度数据：包含名称和热度值
+            valList: [],
+            // 轮播数据：支持图片和视频
+            swiperList: [],
+            // 轮播定时器
+            swiperTimer: null,
+            // 是否正在播放视频
+            isPlayingVideo: false,
+            // Swiper 实例引用
+            swiperInstance: null,
+        }
+    },
+    created() {
+        this.initMqttConnect();
+        this.initTime();
+        this.initData('');
+    },
+    computed: {
+        animationCss() {
+            return this.orderListData && this.orderListData.length > 0 ? {
+                // animationName: 'scroll',
+                animationDuration: (this.orderListData.length === 0 ? 0 : 45) + 's',
+                animationTimingFunction: 'linear',
+                // animationIterationCount: 'infinite',
+                animationFillMode: 'forwards'
+            } : {}
+        }
+    },
+    mounted() {
+    },
+    beforeDestroy() {
+        if (this.nowTimeInterval) {
+            clearInterval(this.nowTimeInterval);
+        }
+        if (this.pollTimer) {
+            clearInterval(this.pollTimer);
+        }
+        if (this.swiperTimer) {
+            clearTimeout(this.swiperTimer);
+        }
+        if (this.swiperInstance) {
+            this.swiperInstance.destroy();
+        }
+        disconnectMqtt('db');
+    },
+    methods: {
+        initMqttConnect() {
+            const clientId = 'db-' + Math.random().toString(16).substring(2, 8);
+            console.log(clientId);
+            initMqtt(clientId, 'yx/device/rankingScreen/needUpdate', 'db', {
                 head: 'ws',
                 username: process.env.VUE_APP_DB_MQTT_USERNAME,
                 password: process.env.VUE_APP_DB_MQTT_PASSWORD
             })
                 .then(() => {
                     callBackMqttMessage('db', (data) => {
-                            console.log('[MQTT] 收到消息:', data.topic, dayjs().format('YYYY-MM-DD HH:mm:ss'), data.message);
-                            if (data.topic === 'yx/device/rankingScreen/needUpdate') {
-                                const msg = data.message;
-                                if (msg.type === 'RANKING_UPDATE') {
-                                    this.initData('');
-                                }
+                        console.log('[MQTT] 收到消息:', data.topic, dayjs().format('YYYY-MM-DD HH:mm:ss'), data.message);
+                        if (data.topic === 'yx/device/rankingScreen/needUpdate') {
+                            const msg = data.message;
+                            if (msg.type === 'RANKING_UPDATE') {
+                                this.initData('');
                             }
-                        });
-                    })
-                    .catch((err) => {
-                        console.error('[MQTT] 连接失败:', err);
-                    });
-            },
-            preName(name) {
-                if (!name) return;
-                if (name === '匿名用户') return name
-                if (name.length < 3) {
-                    return name.substring(0, 1) + '*'
-                } else {
-                    return name.replace(/^(.)(.*?)(.)$/, (match, first, middle, last) => {
-                        return first + '*'.repeat(middle.length) + last;
-                    })
-                }
-            },
-            preDate(d) {
-                if (!d) return;
-                return dayjs(d).format('HH:mm:ss');
-            },
-            reinitSwiper() {
-                if (this.swiperInstance) {
-                    this.swiperInstance.destroy(true, true);
-                    this.swiperInstance = null;
-                }
-                if (this.swiperTimer) {
-                    clearTimeout(this.swiperTimer);
-                }
-                if (this.swiperList.length > 1) {
-                    this.$nextTick(() => {
-                        this.initSwiper();
-                        this.startSwiperAutoPlay();
-                    });
-                }
-            },
-            initData(userId) {
-                let _this = this;
-                this.orderListData = [];
-                httpRequest("POST", this.url + 'neglect/large-screen/ranking' , {userId}, {"authorization": "57ee87183f2a4fa59683ec9ef41c8f5d"}).then(function (res) {
-                    if (res?.code === '00000') {
-                        _this.mealType = res.data.mealType;
-                        _this.dataOverview = res.data.dataOverview || {
-                            userCount: 0,
-                            perCalorie: 0,
-                            perScore: 0
-                        };
-                        _this.mealTimeStart = res.data.mealTimeStart;
-                        _this.mealTimeEnd = res.data.mealTimeEnd;
-                        _this.listData = res.data.userRankings || [];
-                        _this.orderListData = res.data.tickerItems || [];
-                        const maxWeight = res.data.foodRankings && res.data.foodRankings.length > 0 ? res.data.foodRankings[0].foodWeight || 0 : 0;
-                        _this.valList = (res.data.foodRankings || []).map((item) => {
-                            item['weightPoint'] = maxWeight === 0 ? 0 : parseFloat(((item?.foodWeight || 0) / maxWeight * 100).toFixed(2));
-                            return item;
-                        });
-                        // 广告数据从同一接口获取
-                        if (res.data.adImages && res.data.adImages.length > 0) {
-                            _this.swiperList = res.data.adImages;
-                            _this.reinitSwiper();
                         }
-                    }
-                }).catch(function(err) {
-                    console.log(err)
+                    });
                 })
-            },
-            preTime(time) {
-                return `${dayjs(time).format('YYYY年MM月DD日 HH:mm:ss')} ${dayjs(time).locale('zh-cn').format('dddd')}`
-            },
-            // 初始化时间
-            initTime() {
+                .catch((err) => {
+                    console.error('[MQTT] 连接失败:', err);
+                });
+        },
+        preName(name) {
+            if (!name) return;
+            if (name === '匿名用户') return name
+            if (name.length < 3) {
+                return name.substring(0, 1) + '*'
+            } else {
+                return name.replace(/^(.)(.*?)(.)$/, (match, first, middle, last) => {
+                    return first + '*'.repeat(middle.length) + last;
+                })
+            }
+        },
+        preDate(d) {
+            if (!d) return;
+            return dayjs(d).format('HH:mm:ss');
+        },
+        reinitSwiper() {
+            if (this.swiperInstance) {
+                this.swiperInstance.destroy(true, true);
+                this.swiperInstance = null;
+            }
+            if (this.swiperTimer) {
+                clearTimeout(this.swiperTimer);
+            }
+            if (this.swiperList.length > 1) {
+                this.$nextTick(() => {
+                    this.initSwiper();
+                    this.startSwiperAutoPlay();
+                });
+            }
+        },
+        initData(userId) {
+            let _this = this;
+            this.orderListData = [];
+            httpRequest("POST", this.url + 'neglect/large-screen/ranking', {userId}, {"authorization": "57ee87183f2a4fa59683ec9ef41c8f5d"}).then(function (res) {
+                if (res?.code === '00000') {
+                    _this.mealType = res.data.mealType;
+                    _this.dataOverview = res.data.dataOverview || {
+                        userCount: 0,
+                        perCalorie: 0,
+                        perScore: 0
+                    };
+                    _this.mealTimeStart = res.data.mealTimeStart;
+                    _this.mealTimeEnd = res.data.mealTimeEnd;
+                    _this.listData = res.data.userRankings || [{}];
+                    _this.orderListData = res.data.tickerItems || [];
+                    const maxWeight = res.data.foodRankings && res.data.foodRankings.length > 0 ? res.data.foodRankings[0].foodWeight || 0 : 0;
+                    _this.valList = (res.data.foodRankings || []).map((item) => {
+                        item['weightPoint'] = maxWeight === 0 ? 0 : parseFloat(((item?.foodWeight || 0) / maxWeight * 100).toFixed(2));
+                        return item;
+                    });
+                    // 广告数据从同一接口获取
+                    if (res.data.adImages && res.data.adImages.length > 0) {
+                        _this.swiperList = res.data.adImages;
+                        _this.reinitSwiper();
+                    }
+                }
+            }).catch(function (err) {
+                console.log(err)
+            })
+        },
+        preTime(time) {
+            return `${dayjs(time).format('YYYY年MM月DD日 HH:mm:ss')} ${dayjs(time).locale('zh-cn').format('dddd')}`
+        },
+        // 初始化时间
+        initTime() {
+            this.nowTime = dayjs();
+            this.nowTimeInterval = setInterval(() => {
                 this.nowTime = dayjs();
-                this.nowTimeInterval = setInterval(() => {
-                    this.nowTime = dayjs();
-                }, 1000);
-            },
-            // 根据热度值返回对应的进度条样式类
-            getProgressClass(val) {
-                if (val < 30) {
-                    return ['small-progress'];
+            }, 1000);
+        },
+        // 根据热度值返回对应的进度条样式类
+        getProgressClass(val) {
+            if (val < 30) {
+                return ['small-progress'];
+            }
+            if (val > 50) {
+                return ['large-progress'];
+            }
+            return ['middle-progress'];
+        },
+        // 初始化 Swiper
+        initSwiper() {
+            if (this.swiperList.length <= 1) return;
+            this.swiperInstance = new Swiper('.swiper-container', {
+                loop: true,
+                grabCursor: true,
+                slidesPerView: 1,
+                spaceBetween: 0,
+                on: {
+                    slideChangeTransitionEnd: () => {
+                        this.onSlideChangeTransitionEnd();
+                    },
+                    slideChange: () => {
+                        this.onSwiperSlideChange();
+                    }
                 }
-                if (val > 50) {
-                    return ['large-progress'];
+            });
+        },
+        // Swiper 滑动事件处理
+        onSwiperSlideChange() {
+            if (!this.swiperInstance || this.swiperList.length <= 1) return;
+            const realIndex = this.swiperInstance.activeIndex;
+
+            // 清除之前的定时器
+            if (this.swiperTimer) {
+                clearTimeout(this.swiperTimer);
+            }
+            const currentIndex = realIndex === 0 ? 0 : realIndex > this.swiperList.length ? 0 : realIndex - 1;
+            // 获取当前幻灯片数据
+            const currentItem = this.swiperList[currentIndex];
+            if (this.swiperList[currentIndex !== 0 ? currentIndex - 1 : this.swiperList.length - 1].type === 'video') {
+                const refD = this.$refs[`videRef${currentIndex !== 0 ? currentIndex - 1 : this.swiperList.length - 1}`];
+                if (refD && refD.length > 0 && refD[0]) {
+                    refD[0].currentTime = 0;
+                    refD[0].pause();
                 }
-                return ['middle-progress'];
-            },
-            // 初始化 Swiper
-            initSwiper() {
-                if (this.swiperList.length <= 1) return;
-                this.swiperInstance = new Swiper('.swiper-container', {
-                    loop: true,
-                    grabCursor: true,
-                    slidesPerView: 1,
-                    spaceBetween: 0,
-                    on: {
-                        slideChangeTransitionEnd: () => {
-                            this.onSlideChangeTransitionEnd();
-                        },
-                        slideChange: () => {
-                            this.onSwiperSlideChange();
+                const refD1 = this.$refs[`videRef${currentIndex === this.swiperList.length ? this.swiperList.length - 1 : currentIndex + 1}`];
+                if (refD1 && refD1.length > 0 && refD1[0]) {
+                    refD1[0].currentTime = 0;
+                    refD1[0].pause();
+                }
+            }
+            if (currentItem.type === 'image') {
+                // 图片：按设定时长自动切换
+                this.swiperTimer = setTimeout(() => {
+                    this.swiperInstance.slideNext();
+                }, 3000);
+            } else if (currentItem.type === 'video') {
+                // 视频：等待播放完毕后切换
+                this.isPlayingVideo = true;
+            }
+        },
+        onSlideChangeTransitionEnd() {
+            if (!this.swiperInstance) return
+            const realIndex = this.swiperInstance.activeIndex;
+            const currentIndex = realIndex === 0 ? 0 : realIndex > this.swiperList.length ? 0 : realIndex - 1;
+            const currentItem = this.swiperList[currentIndex];
+            if (currentItem.type === 'video') {
+                const refD = this.$refs[`videRef${currentIndex}`]
+                if (refD && refD.length > 0) {
+                    refD[0].muted = false;
+                    refD[0].play().catch((e) => {
+                        console.error(e)
+                        refD[0].muted = true;
+                        refD[0].play();
+                    })
+                }
+            }
+
+        },
+        // 视频播放完毕回调
+        onVideoEnded() {
+            this.isPlayingVideo = false;
+            if (this.swiperInstance) {
+                this.swiperInstance.slideNext();
+            }
+        },
+        // 启动轮播自动播放
+        startSwiperAutoPlay() {
+            // 初始化时触发一次
+            this.onSwiperSlideChange();
+        }
+    }
+}
+</script>
+<style scoped lang="less">
+.outer-d {
+    width: 100%;
+    height: 100%;
+    background: url("@/assets/images/bigScreen/bigBg.png") no-repeat;
+    background-size: 100% 100%;
+    display: flex;
+    flex-direction: column;
+
+    .title {
+        padding-top: 13px;
+        text-align: center;
+
+        img {
+            width: 500px;
+            height: 48px;
+        }
+    }
+
+    .total {
+        text-align: center;
+        display: flex;
+        justify-content: space-between;
+        margin-top: 20px;
+        padding: 0 140px;
+
+        .total-left, .total-right {
+            color: #8CCAFF;
+            font-size: 20px;
+            flex: 1;
+        }
+
+        .total-left {
+            text-align: left;
+        }
+
+        .total-right {
+            text-align: right;
+        }
+
+        .total-d {
+            width: 800px;
+            background: url("@/assets/images/dataBoard/total.png") no-repeat;
+            background-size: 100% 70%;
+            display: flex;
+            justify-content: space-between;
+            background-position: center bottom;
+            padding: 10px 120px 18px;
+
+            > div {
+                > div {
+                    &:nth-child(1) {
+                        color: #FFB99C;
+                        font-weight: bold;
+
+                        span {
+                            font-family: 'HarmonyOS Sans SC';
+
+                            &:nth-child(1) {
+                                font-size: 36px;
+                            }
+
+                            &:nth-child(2) {
+                                font-size: 24px;
+                                margin-left: 5px;
+                            }
                         }
                     }
-                });
-            },
-            // Swiper 滑动事件处理
-            onSwiperSlideChange() {
-                if (!this.swiperInstance || this.swiperList.length <= 1) return;
-                const realIndex = this.swiperInstance.activeIndex;
 
-                // 清除之前的定时器
-                if (this.swiperTimer) {
-                    clearTimeout(this.swiperTimer);
-                }
-                const currentIndex = realIndex === 0 ? 0 : realIndex > this.swiperList.length ? 0 : realIndex - 1;
-                // 获取当前幻灯片数据
-                const currentItem = this.swiperList[currentIndex];
-                if (this.swiperList[currentIndex !== 0 ? currentIndex - 1 : this.swiperList.length - 1].type === 'video') {
-                    const refD = this.$refs[`videRef${currentIndex !== 0 ? currentIndex - 1 : this.swiperList.length - 1}`];
-                    if (refD && refD.length > 0 && refD[0])  {
-                        refD[0].currentTime = 0;
-                        refD[0].pause();
-                    }
-                    const refD1 = this.$refs[`videRef${currentIndex === this.swiperList.length ? this.swiperList.length - 1 : currentIndex + 1 }`];
-                    if (refD1 && refD1.length > 0 && refD1[0])  {
-                        refD1[0].currentTime = 0;
-                        refD1[0].pause();
+                    &:nth-child(2) {
+                        color: #8CCAFF;
+                        font-size: 18px;
                     }
                 }
-                if (currentItem.type === 'image') {
-                    // 图片：按设定时长自动切换
-                    this.swiperTimer = setTimeout(() => {
-                        this.swiperInstance.slideNext();
-                    }, 3000);
-                } else if (currentItem.type === 'video') {
-                    // 视频：等待播放完毕后切换
-                    this.isPlayingVideo = true;
-                }
-            },
-            onSlideChangeTransitionEnd () {
-                if (!this.swiperInstance)  return
-                const realIndex = this.swiperInstance.activeIndex;
-                const currentIndex = realIndex === 0 ? 0 : realIndex > this.swiperList.length ? 0 : realIndex - 1;
-                const currentItem = this.swiperList[currentIndex];
-                if (currentItem.type === 'video') {
-                    const refD = this.$refs[`videRef${currentIndex}`]
-                    if (refD && refD.length > 0) {
-                        refD[0].muted = false;
-                        refD[0].play().catch((e) => {
-                            console.error(e)
-                            refD[0].muted = true;
-                            refD[0].play();
-                        })
-                    }
-                }
-
-            },
-            // 视频播放完毕回调
-            onVideoEnded() {
-                this.isPlayingVideo = false;
-                if (this.swiperInstance) {
-                    this.swiperInstance.slideNext();
-                }
-            },
-            // 启动轮播自动播放
-            startSwiperAutoPlay() {
-                // 初始化时触发一次
-                this.onSwiperSlideChange();
             }
         }
     }
-</script>
-<style scoped lang="less">
-    .outer-d {
-        width: 100%;
-        height: 100%;
-        background: url("@/assets/images/bigScreen/bigBg.png") no-repeat;
-        background-size: 100% 100%;
+
+    .table-top {
+        padding: 5px 140px;
         display: flex;
-        flex-direction: column;
+        align-items: center;
 
-        .title {
-            padding-top: 13px;
-            text-align: center;
-            img {
-                width: 500px;
-                height: 48px;
-            }
-        }
-
-        .total {
-            text-align: center;
-            display: flex;
-            justify-content: space-between;
-            margin-top: 20px;
-            padding: 0 140px;
-            .total-left, .total-right {
-                color: #8CCAFF;
-                font-size: 20px;
-                flex: 1;
-            }
-            .total-left {
-                text-align: left;
-            }
-            .total-right {
-                text-align: right;
-            }
-            .total-d {
-                width: 800px;
-                background: url("@/assets/images/dataBoard/total.png") no-repeat;
-                background-size: 100% 70%;
-                display: flex;
-                justify-content: space-between;
-                background-position: center bottom;
-                padding: 10px 120px 18px;
-                > div {
-                    > div {
-                            &:nth-child(1) {
-                                color: #FFB99C;
-                                font-weight: bold;
-                                span {
-                                    font-family: 'HarmonyOS Sans SC';
-                                    &:nth-child(1) {
-                                        font-size: 36px;
-                                    }
-                                    &:nth-child(2) {
-                                        font-size: 24px;
-                                        margin-left: 5px;
-                                    }
-                                }
-                            }
-                            &:nth-child(2) {
-                                color: #8CCAFF;
-                                font-size: 18px;
-                            }
-                    }
-                }
-            }
-        }
-
-        .table-top {
-            padding: 5px 140px;
+        > div {
             display: flex;
             align-items: center;
 
-            > div {
+            &:nth-child(1) {
+                .voice-img {
+                    width: 30px;
+                    height: 30px;
+                }
+
+                .voice-span {
+                    color: #8CCAFF;
+                    font-size: 20px;
+                    margin-left: 12px;
+                }
+            }
+
+            &:nth-child(2) {
                 display: flex;
-                align-items: center;
-                &:nth-child(1) {
-                    .voice-img {
-                        width: 30px;
-                        height: 30px;
+                padding-left: 5px;
+                color: #FFB99C;
+                font-size: 22px;
+
+                img {
+                    width: 35px;
+                    height: 35px;
+                    margin-right: 10px;
+                }
+
+                > div {
+                    padding: 0 45px 0 0;
+                    display: flex;
+                    align-items: center;
+                }
+            }
+        }
+    }
+
+    .bottom-d {
+        flex: 1;
+        padding: 10px 100px 20px;
+        display: flex;
+        overflow: hidden;
+
+        > div {
+            &:nth-child(1) {
+                width: 67%;
+            }
+
+            &:nth-child(2) {
+                width: 33%;
+            }
+        }
+
+        .table-d {
+            height: 100%;
+            display: flex;
+            flex-direction: column;
+
+            .table-title {
+                background: #2f487e;
+                border-radius: 5px;
+                padding: 3px 40px;
+                color: #8CCAFF;
+                font-size: 20px;
+                display: flex;
+
+                > div {
+                    display: flex;
+                    justify-content: space-between;
+
+                    &:nth-child(1) {
+                        width: 22%;
                     }
 
-                    .voice-span {
-                        color: #8CCAFF;
-                        font-size: 20px;
-                        margin-left: 12px;
+                    &:nth-child(2) {
+                        flex: 1;
                     }
                 }
-                &:nth-child(2) {
-                    display: flex;
-                    padding-left: 5px;
-                    color: #FFB99C;
-                    font-size: 22px;
 
+                .table-title-point {
+                    display: flex;
+                    align-items: center;
+                    position: relative;
+
+                    img {
+                        position: absolute;
+                        width: 18px;
+                        height: 18px;
+                        right: -8px;
+                    }
+                }
+
+                .table-info-one {
+                    width: 90px;
+                    text-align: left;
+                }
+
+                .table-info-userNo {
+                    width: 100px;
+                    text-align: left;
+                }
+
+                .table-info-two {
+                    width: 90px;
+                    text-align: center;
+                }
+
+                .table-info-three {
+                    width: 90px;
+                    text-align: center;
+
+                }
+            }
+
+            .table-item {
+                height: 10%;
+                padding: 15px 40px 3px;
+                color: #8CCAFF;
+                font-size: 18px;
+                display: flex;
+                align-items: center;
+
+                .table-info-one {
+                    width: 90px;
+                    text-align: left;
+                }
+
+                .table-info-userNo {
+                    width: 100px;
+                    text-align: left;
+                }
+
+                .table-info-two {
+                    width: 90px;
+                    text-align: center;
+                }
+
+                .table-info-three {
+                    width: 90px;
+                    text-align: center;
+
+                }
+
+                > div {
+                    display: flex;
+                    justify-content: space-between;
+
+                    &:nth-child(1) {
+                        width: 22%;
+                    }
+
+                    &:nth-child(2) {
+                        flex: 1;
+                    }
+                }
+
+                .index-item {
                     img {
                         width: 35px;
                         height: 35px;
-                        margin-right: 10px;
                     }
-                    > div {
-                        padding: 0 45px 0 0;
+
+                    .img-d {
+                        width: 35px;
+                        height: 35px;
                         display: flex;
                         align-items: center;
+                        justify-content: center;
+                        background: url("@/assets/images/bigScreen/4.png") no-repeat;
+                        background-size: 100% 100%;
+                        font-size: 18px;
+                    }
+
+                    .title-img {
+                        width: 35px !important;
+                        height: 35px !important;
+                        margin-right: 30px;
                     }
                 }
             }
         }
 
-        .bottom-d {
-            flex: 1;
-            padding: 10px 100px 20px;
+        .table-right-d {
+            padding-left: 60px;
+            color: #FFFFFF;
+            font-family: 'HarmonyOS Sans SC';
+            height: 100%;
             display: flex;
-            overflow: hidden;
+            flex-direction: column;
 
-            > div {
-                &:nth-child(1) {
-                    width: 67%;
-                }
-                &:nth-child(2) {
-                    width: 33%;
-                }
+            .table-right-d-title {
+                font-size: 20px;
+                background: #2f487e;
+                padding: 4px 20px;
+                border-radius: 5px;
             }
 
-            .table-d {
-                height: 100%;
+            .table-right-d-body {
+                flex: 1;
                 display: flex;
                 flex-direction: column;
-                .table-title {
-                    background: #2f487e;
-                    border-radius: 5px;
-                    padding: 3px 40px;
-                    color: #8CCAFF;
-                    font-size: 20px;
-                    display: flex;
-                    > div {
-                        display: flex;
-                        justify-content: space-between;
-                        &:nth-child(1) {
-                            width: calc(100% / 3);
-                        }
-                        &:nth-child(2) {
-                            width: calc(100% / 3 * 2);
-                        }
-                    }
+                overflow: hidden;
 
-                    .table-title-point {
-                        display: flex;
-                        align-items: center;
-                        position: relative;
+                .progress-d {
+                    padding: 20px 15px 15px;
+                    height: calc(100% - 270px);
+                    display: flex;
+                    flex-direction: column;
+                    overflow: hidden auto;
+
+                    .progress-d-item {
+                        margin-top: 10px;
+                        height: calc(100% / 6 - 10px);
 
                         img {
-                            position: absolute;
-                            width: 18px;
-                            height: 18px;
-                            right: -8px;
+                            width: 23px;
+                            height: 23px;
+                            margin-right: 15px;
                         }
-                    }
-                    .table-info-one {
-                        width: 90px;
-                        text-align: left;
-                    }
-                    .table-info-two {
-                        width: 90px;
-                        text-align: center;
-                    }
-                    .table-info-three {
-                        width: 90px;
-                        text-align: center;
 
-                    }
-                }
-                .table-item {
-                    height: 10%;
-                    padding: 15px 40px 3px;
-                    color: #8CCAFF;
-                    font-size: 18px;
-                    display: flex;
-                    align-items: center;
+                        > div {
+                            &:nth-child(1) {
+                                margin-bottom: 5px;
+                            }
 
-                    .table-info-one {
-                        width: 90px;
-                        text-align: left;
-                    }
-                    .table-info-two {
-                        width: 90px;
-                        text-align: center;
-                    }
-                    .table-info-three {
-                        width: 90px;
-                        text-align: center;
-
-                    }
-                    > div {
-                        display: flex;
-                        justify-content: space-between;
-                        &:nth-child(1) {
-                            width: calc(100% / 3);
+                            &:nth-child(2) {
+                                height: 10px;
+                                background: #1f2635;
+                                border-radius: 50px;
+                            }
                         }
-                        &:nth-child(2) {
-                            width: calc(100% / 3 * 2);
-                        }
-                    }
 
-                    .index-item {
-                        img {
-                            width: 35px;
-                            height: 35px;
-                        }
-                        .img-d {
-                            width: 35px;
-                            height: 35px;
+                        .index-d {
+                            height: 23px;
                             display: flex;
                             align-items: center;
                             justify-content: center;
-                            background: url("@/assets/images/bigScreen/4.png") no-repeat;
-                            background-size: 100% 100%;
-                            font-size: 18px;
+                            font-size: 20px;
+                            padding-left: 7px;
                         }
 
-                        .title-img {
-                            width: 35px !important;
-                            height: 35px !important;
-                            margin-right: 30px;
+                        .index-name {
+                            font-size: 20px;
                         }
                     }
                 }
-            }
 
-            .table-right-d {
-                padding-left: 60px;
-                color: #FFFFFF;
-                font-family: 'HarmonyOS Sans SC';
-                height: 100%;
-                display: flex;
-                flex-direction: column;
-
-                .table-right-d-title {
-                    font-size: 20px;
-                    background: #2f487e;
-                    padding: 4px 20px;
-                    border-radius: 5px;
-                }
-
-                .table-right-d-body {
+                .swiper-d {
                     flex: 1;
+                    height: 270px;
                     display: flex;
-                    flex-direction: column;
+                    align-items: center;
+                    justify-content: center;
+                    border-radius: 8px;
                     overflow: hidden;
-                    .progress-d {
-                        padding: 20px 15px 15px;
-                        height: calc(100% - 270px);
-                        display: flex;
-                        flex-direction: column;
-                        overflow: hidden auto;
-                        .progress-d-item {
-                            margin-top: 10px;
-                            height: calc(100% / 6 - 10px);
-                            img {
-                                width: 23px;
-                                height: 23px;
-                                margin-right: 15px;
-                            }
-                            >div {
-                                &:nth-child(1) {
-                                    margin-bottom: 5px;
-                                }
-                                &:nth-child(2) {
-                                    height: 10px;
-                                    background: #1f2635;
-                                    border-radius: 50px;
-                                }
-                            }
+                    position: relative;
+                    width: 100%;
+                    background: #183159;
 
-                            .index-d {
-                                height: 23px;
-                                display: flex;
-                                align-items: center;
-                                justify-content: center;
-                                font-size: 20px;
-                                padding-left: 7px;
-                            }
-
-                            .index-name {
-                                font-size: 20px;
-                            }
-                        }
+                    .swiper-container {
+                        width: 100%;
+                        height: 100%;
+                        position: relative;
                     }
 
-                    .swiper-d {
-                        flex: 1;
-                        height: 270px;
+                    .swiper-wrapper {
+                        width: 100%;
+                        height: 100%;
+                        display: flex;
+                    }
+
+                    .no-data-d {
+                        width: 100%;
+                        height: 100%;
                         display: flex;
                         align-items: center;
                         justify-content: center;
-                        border-radius: 8px;
-                        overflow: hidden;
-                        position: relative;
-                        width: 100%;
-                        background: #183159;
+                        position: absolute;
+                        top: 0;
+                        left: 0;
 
-                        .swiper-container {
-                            width: 100%;
-                            height: 100%;
-                            position: relative;
+                        img {
+                            width: 100px;
+                            height: 80px;
+                            margin-bottom: 10px;
                         }
 
-                        .swiper-wrapper {
-                            width: 100%;
-                            height: 100%;
-                            display: flex;
-                        }
+                        .no-data-msg {
+                            text-align: center;
 
-                        .no-data-d {
-                            width: 100%;
-                            height: 100%;
-                            display: flex;
-                            align-items: center;
-                            justify-content: center;
-                            position: absolute;
-                            top: 0;
-                            left: 0;
-                            img {
-                                width: 100px;
-                                height: 80px;
-                                margin-bottom: 10px;
-                            }
+                            > div {
+                                &:nth-child(1) {
+                                    font-size: 27px;
+                                }
 
-                            .no-data-msg {
-                                text-align: center;
-                                > div {
-                                    &:nth-child(1) {
-                                        font-size: 27px;
-                                    }
-                                    &:nth-child(2) {
-                                        margin-top: 5px;
-                                        font-size: 18px;
-                                        display: flex;
-                                        > div {
-                                            &:nth-child(1) {
-                                                padding-right: 13px;
-                                            }
-                                            &:nth-child(2) {
-                                                padding-left: 13px;
-                                            }
+                                &:nth-child(2) {
+                                    margin-top: 5px;
+                                    font-size: 18px;
+                                    display: flex;
+
+                                    > div {
+                                        &:nth-child(1) {
+                                            padding-right: 13px;
+                                        }
+
+                                        &:nth-child(2) {
+                                            padding-left: 13px;
                                         }
                                     }
                                 }
                             }
                         }
+                    }
 
-                        .swiper-slide {
-                            width: 100%;
-                            height: 100%;
-                            display: flex;
-                            align-items: center;
-                            justify-content: center;
-                            flex-shrink: 0;
-                        }
+                    .swiper-slide {
+                        width: 100%;
+                        height: 100%;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        flex-shrink: 0;
+                    }
 
-                        .swiper-content {
-                            width: 100%;
-                            height: 100%;
-                            object-fit: cover;
-                            display: block;
-                            animation: fadeIn 0.5s ease-in-out;
-                        }
+                    .swiper-content {
+                        width: 100%;
+                        height: 100%;
+                        object-fit: cover;
+                        display: block;
+                        animation: fadeIn 0.5s ease-in-out;
                     }
                 }
             }
         }
-
-        .footer-d {
-            font-size: 20px;
-            text-align: center;
-            padding-bottom: 10px;
-            color: #8CCAFF;
-        }
     }
 
-    .small-progress {
-        background: #45FFA1;
+    .footer-d {
+        font-size: 20px;
+        text-align: center;
+        padding-bottom: 10px;
+        color: #8CCAFF;
     }
+}
 
-    .middle-progress {
-        background: #FFFD45;
+.small-progress {
+    background: #45FFA1;
+}
+
+.middle-progress {
+    background: #FFFD45;
+}
+
+.large-progress {
+    background: linear-gradient(-90deg, #FF0048, #FFAB61);
+}
+
+// 列表排序动画
+.flip-list-move {
+    transition: transform 0.6s ease-in-out;
+}
+
+// 轮播淡入动画
+@keyframes fadeIn {
+    from {
+        opacity: 0;
     }
-
-    .large-progress {
-        background: linear-gradient(-90deg, #FF0048, #FFAB61);
+    to {
+        opacity: 1;
     }
+}
+
+::-webkit-scrollbar {
+    width: 2px; /* 垂直滚动条宽度 */
+    height: 2px; /* 水平滚动条高度 */
+}
+
+/* 滚动条轨道 */
+::-webkit-scrollbar-track {
+    background: #f1f1f1;
+    border-radius: 10px;
+}
+
+/* 滚动条滑块 */
+::-webkit-scrollbar-thumb {
+    background: #888;
+    border-radius: 10px;
+}
+
+/* 滑块悬停效果 */
+::-webkit-scrollbar-thumb:hover {
+    background: #555;
+}
+
+/* 滚动条两端按钮 */
+::-webkit-scrollbar-button {
+    display: none;
+}
+
+/* 边角（两个滚动条交汇处） */
+::-webkit-scrollbar-corner {
+    background: #f1f1f1;
+}
+
+.scroll-container {
+    flex: 1;
+    overflow: hidden;
+    white-space: nowrap;
+}
+
+.scroll-content {
+    display: inline-block;
+    width: 100%;
+
+    div {
+        display: flex;
+        align-items: center;
+        margin-right: 20px;
 
-    // 列表排序动画
-    .flip-list-move {
-        transition: transform 0.6s ease-in-out;
     }
+}
 
-    // 轮播淡入动画
-    @keyframes fadeIn {
-        from {
-            opacity: 0;
-        }
-        to {
-            opacity: 1;
-        }
+.animal-css {
+    animation: scroll;
+}
+
+@keyframes scroll {
+    0% {
+        transform: translateX(100%);
     }
-    ::-webkit-scrollbar {
-        width: 2px;  /* 垂直滚动条宽度 */
-        height: 2px; /* 水平滚动条高度 */
+    100% {
+        transform: translateX(-100%); /* 移动一半距离，因为复制了一份 */
     }
+}
 
-    /* 滚动条轨道 */
-    ::-webkit-scrollbar-track {
-        background: #f1f1f1;
-        border-radius: 10px;
-    }
-
-    /* 滚动条滑块 */
-    ::-webkit-scrollbar-thumb {
-        background: #888;
-        border-radius: 10px;
-    }
-
-    /* 滑块悬停效果 */
-    ::-webkit-scrollbar-thumb:hover {
-        background: #555;
-    }
-
-    /* 滚动条两端按钮 */
-    ::-webkit-scrollbar-button {
-        display: none;
-    }
-
-    /* 边角（两个滚动条交汇处） */
-    ::-webkit-scrollbar-corner {
-        background: #f1f1f1;
-    }
-
-    .scroll-container {
-        flex: 1;
-        overflow: hidden;
-        white-space: nowrap;
-    }
-
-    .scroll-content {
-        display: inline-block;
-        width: 100%;
-
-        div {
-            display: flex;
-            align-items: center;
-            margin-right: 20px;
-
-        }
-    }
-
-    .animal-css {
-        animation: scroll;
-    }
-
-    @keyframes scroll {
-        0% {
-            transform: translateX(100%);
-        }
-        100% {
-            transform: translateX(-100%); /* 移动一半距离，因为复制了一份 */
-        }
-    }
-
-    /* 鼠标悬停暂停 */
-    .scroll-container:hover .scroll-content {
-        animation-play-state: paused;
-    }
+/* 鼠标悬停暂停 */
+.scroll-container:hover .scroll-content {
+    animation-play-state: paused;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/mealSurplusInformation/mealSurplusInformation.vue b/src/views/mealSurplusInformation/mealSurplusInformation.vue
index e268a36..dd24458 100644
--- a/src/views/mealSurplusInformation/mealSurplusInformation.vue
+++ b/src/views/mealSurplusInformation/mealSurplusInformation.vue
@@ -119,16 +119,66 @@ export default {
             nutritionList: [],       // 营养秤实时数据
             unmadeList: [],          // 未制作列表
             madeList: [],            // 已制作列表
+            speechQueue: [],         // 语音播报队列 [{dishName, spoken}]
+            speaking: false,         // 是否正在播报
         }
     },
     created() {
         this.getKitchenInfo();
     },
     methods: {
+        // 语音播报：Web Speech API 依次播报队列中未播报的菜品
+        speakWarning() {
+            if (this.speaking) return;
+            const unspoken = this.speechQueue.filter(item => !item.spoken);
+            if (!unspoken.length) return;
+
+            this.speaking = true;
+            let index = 0;
+
+            const utterance = new SpeechSynthesisUtterance();
+            utterance.lang = 'zh-CN';
+            utterance.rate = 0.9;
+            utterance.volume = 1;
+
+            const playNext = () => {
+                if (index >= unspoken.length) {
+                    this.speaking = false;
+                    return;
+                }
+                const item = unspoken[index];
+                index++;
+                utterance.text = `${item.dishName}、余量不足，请注意补餐`;
+                console.log('[TTS] 开始播报:', utterance.text);
+                utterance.onend = () => {
+                    item.spoken = true;
+                    console.log('[TTS] 播报完成:', item.dishName);
+                    playNext();
+                };
+                utterance.onerror = (e) => {
+                    console.error('[TTS] 播报错误:', e.error);
+                    item.spoken = true;
+                    playNext();
+                };
+                speechSynthesis.speak(utterance);
+            };
+
+            playNext();
+        },
         getKitchenInfo() {
             var params = {};
             var _this = this;
 
+            let date = new Date();
+            let year = date.getFullYear();
+            let month = date.getMonth() + 1;
+            let day = date.getDate();
+            let hour = date.getHours();
+            let minute = date.getMinutes();
+            let second = date.getSeconds();
+            const times = "现在是：" + year + "年" + month + "月" + day + "号，" + hour + "点" + minute + "分" + second + "秒";
+            _this.speechQueue.push({dishName: times, spoken: false});
+
             httpRequest("GET", "https://dev.yixiong-tech.com:8081/nutrition/neglect/large-screen/kitchen", params, {
                 "X-DEVICE-CODE": "XIAOMI-00999",
                 "authorization": "57ee87183f2a4fa59683ec9ef41c8f5d"
@@ -165,6 +215,14 @@ export default {
                     }
                 }
 
+                // 余量不足的菜品直接推入播报队列
+                _this.nutritionList.forEach(function(item) {
+                    if (item.lowStock) {
+                        _this.speechQueue.push({dishName: item.dishName, spoken: false});
+                    }
+                });
+                _this.speakWarning();
+
                 setTimeout(function() {
                     _this.getKitchenInfo();
                 }, 10000);