#
Junjie
2025-08-01 728ad81fa10d2879654c5f9ae4314db94eafb865
src/main/webapp/views/shuttleNew.html
@@ -106,10 +106,10 @@
                            </select>
                        </div>
                    </div>
                    <div class="overflow-x-auto" style="height: 500px;">
                    <div class="overflow-auto" style="height: 500px;">
                        <table class="w-full table-striped">
                            <thead>
                            <tr class="text-left text-slate-300 border-b border-slate-600">
                            <tr class="text-left text-slate-300 border-b border-slate-600 bg-slate-800 sticky top-0 z-10">
                                <th class="py-3 px-4">编号</th>
                                <th class="py-3 px-4">工作号</th>
                                <th class="py-3 px-4">任务状态</th>
@@ -131,39 +131,39 @@
                            </tr>
                            </thead>
                            <tbody>
                            <tr v-for="(item,idx) in shuttleList" :key="idx" class="hover:bg-slate-700">
                                <td class="py-3 px-4">{{ item.shuttleNo }}</td>
                                <td class="py-3 px-4">{{ item.taskNo }}</td>
                                <td class="py-3 px-4">{{ item.protocolStatus$ }}</td>
                                <td class="py-3 px-4">{{ item.deviceStatus$ }}</td>
                                <td class="py-3 px-4">{{ item.mode$ }}</td>
                                <td class="py-3 px-4">{{ item.currentLocNo }}</td>
                                <td class="py-3 px-4">{{ item.currentCode }}</td>
                                <td class="py-3 px-4">
                                    <div class="w-full bg-gray-200 rounded-full h-2.5">
                                        <div v-if="item.batteryPower>=70&&item.batteryPower<=100">
                                            <div class="bg-green-500 h-2.5 rounded-full" :style="{width: item.batteryPower + '%'}"></div>
                                <tr v-for="(item,idx) in shuttleList" :key="idx" class="hover:bg-slate-700">
                                    <td class="py-3 px-4">{{ item.shuttleNo }}</td>
                                    <td class="py-3 px-4">{{ item.taskNo }}</td>
                                    <td class="py-3 px-4">{{ item.protocolStatus$ }}</td>
                                    <td class="py-3 px-4">{{ item.deviceStatus$ }}</td>
                                    <td class="py-3 px-4">{{ item.mode$ }}</td>
                                    <td class="py-3 px-4">{{ item.currentLocNo }}</td>
                                    <td class="py-3 px-4">{{ item.currentCode }}</td>
                                    <td class="py-3 px-4">
                                        <div class="w-full bg-gray-200 rounded-full h-2.5">
                                            <div v-if="item.batteryPower>=70&&item.batteryPower<=100">
                                                <div class="bg-green-500 h-2.5 rounded-full" :style="{width: item.batteryPower + '%'}"></div>
                                            </div>
                                            <div v-else-if="item.batteryPower>=40&&item.batteryPower<70">
                                                <div class="bg-yellow-500 h-2.5 rounded-full" :style="{width: item.batteryPower + '%'}"></div>
                                            </div>
                                            <div v-else>
                                                <div class="red h-2.5 rounded-full" :style="{width: item.batteryPower + '%'}"></div>
                                            </div>
                                        </div>
                                        <div v-else-if="item.batteryPower>=40&&item.batteryPower<70">
                                            <div class="bg-yellow-500 h-2.5 rounded-full" :style="{width: item.batteryPower + '%'}"></div>
                                        </div>
                                        <div v-else>
                                            <div class="red h-2.5 rounded-full" :style="{width: item.batteryPower + '%'}"></div>
                                        </div>
                                    </div>
                                    <span class="text-xs text-gray-500">{{ item.batteryPower }}%</span>
                                </td>
                                <td class="py-3 px-4">{{ item.extend.voltage }}</td>
                                <td class="py-3 px-4">{{ item.speed }}</td>
                                <td class="py-3 px-4">{{ item.hasPallet$ }}</td>
                                <td class="py-3 px-4">{{ item.hasLift$ }}</td>
                                <td class="py-3 px-4">{{ item.hasCharge$ }}</td>
                                <td class="py-3 px-4">{{ item.statusErrorCode$ }}</td>
<!--                                <td class="py-3 px-4">{{ item.suspendState }}</td>-->
                                <td class="py-3 px-4">{{ item.lowerPower }}</td>
                                <td class="py-3 px-4">{{ item.demo$ }}</td>
                                <td class="py-3 px-4">{{ item.pakMk$ }}</td>
                            </tr>
                                        <span class="text-xs text-gray-500">{{ item.batteryPower }}%</span>
                                    </td>
                                    <td class="py-3 px-4">{{ item.extend.voltage }}</td>
                                    <td class="py-3 px-4">{{ item.speed }}</td>
                                    <td class="py-3 px-4">{{ item.hasPallet$ }}</td>
                                    <td class="py-3 px-4">{{ item.hasLift$ }}</td>
                                    <td class="py-3 px-4">{{ item.hasCharge$ }}</td>
                                    <td class="py-3 px-4">{{ item.statusErrorCode$ }}</td>
    <!--                                <td class="py-3 px-4">{{ item.suspendState }}</td>-->
                                    <td class="py-3 px-4">{{ item.lowerPower }}</td>
                                    <td class="py-3 px-4">{{ item.demo$ }}</td>
                                    <td class="py-3 px-4">{{ item.pakMk$ }}</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
@@ -202,7 +202,7 @@
                        </div>
                    </div>
                    <div class="bg-slate-700 p-4 rounded-lg">
                        <h3 class="text-lg font-medium mb-2">设备维护</h3>
                        <h3 class="text-lg font-medium mb-2">设备指令</h3>
                        <div class="flex flex-wrap gap-2" style="display: flex;justify-content: center;">
                            <button class="btn bg-slate-600 hover:bg-slate-500" @click="shuttleOperator('palletLift')">
                                <i class="fas fa-level-up mr-1"></i>托盘顶升
@@ -406,9 +406,9 @@
        },
        methods: {
            init() {
                this.websocketConnect();
                this.consoleInterval = setInterval(() => {
                    this.websocketConnect();
                    this.getShuttleStateInfo() //获取四向穿梭车信息
                }, 1000)
            },
@@ -545,6 +545,8 @@
                    requestParam.distLocNo = this.controlData.targetLocNo;
                }else if (type == 'palletLift') {
                    requestParam.shuttleTaskMode = 1;
                }else if (type == 'palletDown') {
                    requestParam.shuttleTaskMode = 2;
                }else if (type == 'chargeOn') {
                    requestParam.shuttleTaskMode = 15;
                }else if (type == 'chargeOff') {
@@ -592,18 +594,20 @@
                });
            },
            websocketConnect() {
                this.ws = new WebSocket("ws://" + window.location.host + baseUrl + "/console/websocket");
                this.ws.onopen = this.webSocketOnOpen
                this.ws.onerror = this.webSocketOnError
                this.ws.onmessage = this.webSocketOnMessage
                this.ws.onclose = this.webSocketClose
                if (this.ws == null) {
                    this.ws = new WebSocket("ws://" + window.location.host + baseUrl + "/console/websocket");
                    this.ws.onopen = this.webSocketOnOpen
                    this.ws.onerror = this.webSocketOnError
                    this.ws.onmessage = this.webSocketOnMessage
                    this.ws.onclose = this.webSocketClose
                }
            },
            webSocketOnOpen(e) {
                console.log("open");
            },
            webSocketOnError(e) {
                this.ws = null;
                console.log(e);
                this.websocketConnect();
            },
            webSocketOnMessage(e) {
                const result = JSON.parse(e.data);
@@ -612,12 +616,16 @@
                }
            },
            webSocketClose(e) {
                this.ws = null;
                console.log("close");
                this.websocketConnect();
            },
            sendWs(message) {
                if (this.ws == null) {
                    return;
                }
                if (this.ws.readyState == WebSocket.OPEN) {
                    this.ws.send(message)
                    this.ws.send(message);
                }
            }
        }