From f23e0326aa05a1c5b47d4aec4c06e73d0d86b8e7 Mon Sep 17 00:00:00 2001 From: huangxiaoqiang <huangxiaoqiang@hnkhzn.com> Date: 星期二, 29 七月 2025 17:43:15 +0800 Subject: [PATCH] 代码提交 --- 项目代码/WCS/WIDESEAWCS_Client/src/views/Home.vue | 1063 ++++++++++++++++++++++++++++++---------------------------- 1 files changed, 555 insertions(+), 508 deletions(-) diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WIDESEAWCS_Client/src/views/Home.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WIDESEAWCS_Client/src/views/Home.vue" index 8852039..0ad79c8 100644 --- "a/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WIDESEAWCS_Client/src/views/Home.vue" +++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WIDESEAWCS_Client/src/views/Home.vue" @@ -1,572 +1,586 @@ <template> + <div> + 111 + </div> <div class="title"> - <el-row style="height:100%"> - <el-col :span="16"> + <el-row :gutter="20" style="height:100%"> + <el-col :span="8"> + <span style="position: relative; top: 100px;left: 30px;">绗竴灞�</span> + <el-row :gutter="20" style="height:1000px"> + <el-col :span="8"></el-col> + <el-col :span="8"> + <div class="line-container"> + <div class="RGVline"></div> + <div :class="updateRGVOne()" :style="{ marginTop: RGV01.LevelPoint + 'px' }" ref="childDot" @click="mouseClick">1</div> + <div :class="updateRGVTwo()" :style="{ marginTop: RGV02.LevelPoint + 'px' }" ref="childDot" @click="mouseClick">2</div> + </div> + </el-col> + <el-col :span="8"> + <div> + <div v-for="(group, index) in groupedLines(linescopy1)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" + :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" + :positionY="line.positionY" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 118px;"></div> + <div v-for="(group, index) in groupedLines(linescopy2)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" + :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" + :positionY="line.positionY" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 115px;"></div> + <div v-for="(group, index) in groupedLines(linescopy3)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" + :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" + :positionY="line.positionY" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 112px;"></div> + <div v-for="(group, index) in groupedLines(linescopy4)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" + :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" + :positionY="line.positionY" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 109px;"></div> + <div v-for="(group, index) in groupedLines(linescopy5)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" + :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" + :positionY="line.positionY" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 107px;"></div> + <div v-for="(group, index) in groupedLines(linescopy6)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" + :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" + :positionY="line.positionY" :condition="line.condition" /> + </div> + </div> + </div> + </el-col> + </el-row> + + </el-col> + <el-col :span="8"> <!-- 鍫嗗灈鏈� --> <div style="position: relative; top: 50px;"> <div class="stackerDiv"> <div class="stackDivName">涓�鍙峰爢鍨涙満</div> - <LineComponent :x="xValue1" ref="lineComponent1" :equipNo="1"></LineComponent> + <LineComponent :x="xValue1" ref="stacker1" :equipNo="SC01"></LineComponent> </div> <el-divider></el-divider> <div class="stackerDiv"> <div class="stackDivName">浜屽彿鍫嗗灈鏈�</div> - <LineComponent :x="xValue2" ref="lineComponent2" :equipNo="2"></LineComponent> + <LineComponent :x="xValue2" ref="stacker2" :equipNo="SC02"></LineComponent> </div> - <div class="stackerDiv"> + <el-divider></el-divider> + <div class="stackerDiv"> <div class="stackDivName">涓夊彿鍫嗗灈鏈�</div> - <LineComponent :x="xValue2" ref="lineComponent2" :equipNo="2"></LineComponent> + <LineComponent :x="xValue3" ref="stacker3" :equipNo="SC03"></LineComponent> </div> - <div class="stackerDiv"> + <el-divider></el-divider> + <div class="stackerDiv"> <div class="stackDivName">鍥涘彿鍫嗗灈鏈�</div> - <LineComponent :x="xValue2" ref="lineComponent2" :equipNo="2"></LineComponent> + <LineComponent :x="xValue4" ref="stacker4" :equipNo="SC04"></LineComponent> + </div> + <el-divider></el-divider> + <div class="stackerDiv"> + <div class="stackDivName">浜斿彿鍫嗗灈鏈�</div> + <LineComponent :x="xValue5" ref="stacker5" :equipNo="SC05"></LineComponent> + </div> + <el-divider></el-divider> + <div class="stackerDiv"> + <div class="stackDivName">鍏彿鍫嗗灈鏈�</div> + <LineComponent :x="xValue6" ref="stacker6" :equipNo="SC06"></LineComponent> </div> </div> </el-col> - </el-row> - <el-row :gutter="20" class="cardWidthrow"> - <el-col :span="7"> - <div class="cardWidth"> - <div> - <span style="position: relative; top: 100px;left: 10px;">绗竴灞傚墠</span> - <div v-for="(group, index) in groupedLines(linescopy1)" :key="index"> - <div class="positionY-group"> - <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" - :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" - :positionY="line.positionY" - :condition="line.condition" /> - </div> - </div> - </div> - <!-- <el-divider class="divider"></el-divider> - <div> - <span style="position: relative; top: 120px;left: 30px;">绗簩灞�</span> - <div v-for="(group, index) in groupedLines(linescopy2)" :key="index"> - <div class="positionY-group"> - <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" - :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" - :positionY="line.positionY" url="api/Equipment/GetLineInfoByNo" - :condition="line.condition" /> - </div> - </div> - </div> - <el-divider class="divider"></el-divider> - <div> - <span style="position: relative; top: 120px;left: 30px;">绗笁灞�</span> - <div v-for="(group, index) in groupedLines(linescopy3)" :key="index"> - <div class="positionY-group"> - <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" - :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" - :positionY="line.positionY" url="api/Equipment/GetLineInfoByNo" - :condition="line.condition" /> - </div> - </div> - </div> --> - </div> - </el-col> - <!-- <el-col :span="12"> + <!-- <el-col :span="8"> <div> - <span style="position: relative; top: 120px;left: 30px;">绗洓灞�</span> - <div v-for="(group, index) in groupedLines(linescopy4)" :key="index"> + <div v-for="(group, index) in groupedLines(linescopy3)" :key="index"> <div class="positionY-group"> - <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" - :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" - :positionY="line.positionY" url="api/Equipment/GetLineInfoByNo" - :condition="line.condition" /> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo" + :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY" + url="api/Equipment/GetLineInfoByNo" :condition="line.condition" /> </div> </div> - </div> - </el-col> - <el-col :span="12"> - <div> - <span style="position: relative; top: 120px;left: 30px;">绗簲灞�</span> - <div v-for="(group, index) in groupedLines(linescopy5)" :key="index"> + <div style="margin-top: 105px;"></div> + <div v-for="(group, index) in groupedLines(linescopy3)" :key="index"> <div class="positionY-group"> - <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" - :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX" - :positionY="line.positionY" url="api/Equipment/GetLineInfoByNo" - :condition="line.condition" /> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo" + :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY" + url="api/Equipment/GetLineInfoByNo" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 105px;"></div> + <div v-for="(group, index) in groupedLines(linescopy3)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo" + :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY" + url="api/Equipment/GetLineInfoByNo" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 105px;"></div> + <div v-for="(group, index) in groupedLines(linescopy3)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo" + :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY" + url="api/Equipment/GetLineInfoByNo" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 100px;"></div> + <div v-for="(group, index) in groupedLines(linescopy3)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo" + :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY" + url="api/Equipment/GetLineInfoByNo" :condition="line.condition" /> + </div> + </div> + <div style="margin-top: 100px;"></div> + <div v-for="(group, index) in groupedLines(linescopy3)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo" + :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY" + url="api/Equipment/GetLineInfoByNo" :condition="line.condition" /> </div> </div> </div> </el-col> --> </el-row> + <el-row :gutter="20" class="cardWidthrow"> + <el-col :span="12"> + <div> + <span style="position: relative; top: 120px;left: 30px;">绗簩灞�</span> + <div v-for="(group, index) in groupedLines(linescopy4)" :key="index"> + <div class="positionY-group"> + <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo" + :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY" + url="api/Equipment/GetLineInfoByNo" :condition="line.condition" /> + </div> + </div> + </div> + </el-col> + + </el-row> + </div> + </template> <script> -import { ref, reactive } from "vue"; +import { onMounted, ref, reactive } from "vue"; +// import StackerInfo from "./StackerInfo.vue"; +// import LineInfo from "./LineInfo.vue"; import LineInfoCopy from "./LineInfocopy.vue"; import LineComponent from './LineComponent.vue'; import eventBus from "../uitils/eventBus"; + + export default { data() { return { - //#region 绗竴灞� linescopy1: [ - //#region 绗竴鎺� { - equipNo: "1103", + equipNo: "1005", imgType: "1", - positionX: 1, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, { - equipNo: "1102", + equipNo: "1006", imgType: "1", - positionX: 2, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, - { - equipNo: "2103", - imgType: "1", - positionX: 2, - positionY: 1, - condition: false, - }, - // { - // equipNo: "2102", - // imgType: "1", - // positionX: 5, - // positionY: 1, - // condition: false, - // }, - //#endregion - //#region 绗簩鎺� { - equipNo: "1104", + equipNo: "1007", imgType: "1", - positionX: 1, - positionY: 4, + positionX: 0.6, + positionY: 20, condition: false, }, { - equipNo: "1101", + equipNo: "1008", imgType: "1", - positionX: 2, - positionY: 4, + positionX: 0.6, + positionY: 20, + condition: false, + }, { + equipNo: "2002", + imgType: "1", + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2104", + equipNo: "2001", imgType: "1", - positionX: 2, - positionY: 4, + positionX: 26, + positionY: 8, condition: false, }, - // { - // equipNo: "2101", - // imgType: "1", - // positionX: 5, - // positionY: 2, - // condition: false, - // }, - //#endregion + { + equipNo: "2004", + imgType: "1", + positionX: 26, + positionY: 20, + condition: false, + }, + { + equipNo: "2003", + imgType: "1", + positionX: 26, + positionY: 20, + condition: false, + }, ], - //#endregion - - //#region 绗簩灞� linescopy2: [ - //#region 绗竴鎺� { - equipNo: "1204", + equipNo: "1009", imgType: "1", - positionX: 1, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, { - equipNo: "1203", + equipNo: "1010", imgType: "1", - positionX: 2, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, - { - equipNo: "2204", - imgType: "1", - positionX: 4, - positionY: 1, - condition: false, - }, - { - equipNo: "2203", - imgType: "1", - positionX: 5, - positionY: 1, - condition: false, - }, - //#endregion - //#region 绗簩鎺� { - equipNo: "1205", + equipNo: "1011", imgType: "1", - positionX: 1, - positionY: 2, + positionX: 0.6, + positionY: 20, condition: false, }, { - equipNo: "1202", + equipNo: "1012", imgType: "1", - positionX: 2, - positionY: 2, + positionX: 0.6, + positionY: 20, + condition: false, + }, { + equipNo: "2006", + imgType: "1", + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2205", + equipNo: "2005", imgType: "1", - positionX: 4, - positionY: 2, + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2202", + equipNo: "2008", imgType: "1", - positionX: 5, - positionY: 2, - condition: false, - }, - //#endregion - - //#region 绗笁鎺� - { - equipNo: "1206", - imgType: "1", - positionX: 1, - positionY: 3, + positionX: 26, + positionY: 20, condition: false, }, { - equipNo: "1201", + equipNo: "2007", imgType: "1", - positionX: 2, - positionY: 3, + positionX: 26, + positionY: 20, condition: false, }, - { - equipNo: "2205", - imgType: "1", - positionX: 4, - positionY: 3, - condition: false, - }, - { - equipNo: "2201", - imgType: "1", - positionX: 5, - positionY: 3, - condition: false, - }, - //#endregion - ], - //#endregion - - //#region 绗笁灞� linescopy3: [ - //#region 绗竴鎺� { - equipNo: "1304", + equipNo: "1017", imgType: "1", - positionX: 1, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, { - equipNo: "1303", + equipNo: "1018", imgType: "1", - positionX: 2, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, - { - equipNo: "2304", - imgType: "1", - positionX: 4, - positionY: 1, - condition: false, - }, - { - equipNo: "2303", - imgType: "1", - positionX: 5, - positionY: 1, - condition: false, - }, - //#endregion - //#region 绗簩鎺� { - equipNo: "1305", + equipNo: "1019", imgType: "1", - positionX: 1, - positionY: 2, + positionX: 0.6, + positionY: 20, condition: false, }, { - equipNo: "1302", + equipNo: "1020", imgType: "1", - positionX: 2, - positionY: 2, + positionX: 0.6, + positionY: 20, + condition: false, + }, { + equipNo: "2010", + imgType: "1", + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2305", + equipNo: "2009", imgType: "1", - positionX: 4, - positionY: 2, + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2302", + equipNo: "2012", imgType: "1", - positionX: 5, - positionY: 2, - condition: false, - }, - //#endregion - - //#region 绗笁鎺� - { - equipNo: "1306", - imgType: "1", - positionX: 1, - positionY: 3, + positionX: 26, + positionY: 20, condition: false, }, { - equipNo: "1301", + equipNo: "2011", imgType: "1", - positionX: 2, - positionY: 3, + positionX: 26, + positionY: 20, condition: false, }, - { - equipNo: "2305", - imgType: "1", - positionX: 4, - positionY: 3, - condition: false, - }, - { - equipNo: "2301", - imgType: "1", - positionX: 5, - positionY: 3, - condition: false, - }, - //#endregion - ], - //#endregion - - //#region 绗洓灞� linescopy4: [ - //#region 绗竴鎺� { - equipNo: "1404", + equipNo: "1021", imgType: "1", - positionX: 1, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, { - equipNo: "1403", + equipNo: "1022", imgType: "1", - positionX: 2, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, - { - equipNo: "2404", - imgType: "1", - positionX: 4, - positionY: 1, - condition: false, - }, - { - equipNo: "2403", - imgType: "1", - positionX: 5, - positionY: 1, - condition: false, - }, - //#endregion - //#region 绗簩鎺� { - equipNo: "1405", + equipNo: "1023", imgType: "1", - positionX: 1, - positionY: 2, + positionX: 0.6, + positionY: 20, condition: false, }, { - equipNo: "1402", + equipNo: "1024", imgType: "1", - positionX: 2, - positionY: 2, + positionX: 0.6, + positionY: 20, + condition: false, + }, { + equipNo: "2014", + imgType: "1", + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2405", + equipNo: "2013", imgType: "1", - positionX: 4, - positionY: 2, + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2402", + equipNo: "2016", imgType: "1", - positionX: 5, - positionY: 2, - condition: false, - }, - //#endregion - - //#region 绗笁鎺� - { - equipNo: "1406", - imgType: "1", - positionX: 1, - positionY: 3, + positionX: 26, + positionY: 20, condition: false, }, { - equipNo: "1401", + equipNo: "2015", imgType: "1", - positionX: 2, - positionY: 3, + positionX: 26, + positionY: 20, condition: false, }, - { - equipNo: "2405", - imgType: "1", - positionX: 4, - positionY: 3, - condition: false, - }, - { - equipNo: "2401", - imgType: "1", - positionX: 5, - positionY: 3, - condition: false, - }, - //#endregion - ], - //#endregion - - //#region 绗簲灞� linescopy5: [ - //#region 绗竴鎺� { - equipNo: "1504", + equipNo: "1031", imgType: "1", - positionX: 1, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, { - equipNo: "1503", + equipNo: "1032", imgType: "1", - positionX: 2, - positionY: 1, + positionX: 0.6, + positionY: 8, condition: false, }, - { - equipNo: "2504", - imgType: "1", - positionX: 4, - positionY: 1, - condition: false, - }, - { - equipNo: "2503", - imgType: "1", - positionX: 5, - positionY: 1, - condition: false, - }, - //#endregion - //#region 绗簩鎺� { - equipNo: "1505", + equipNo: "1033", imgType: "1", - positionX: 1, - positionY: 2, + positionX: 0.6, + positionY: 20, condition: false, }, { - equipNo: "1502", + equipNo: "1034", imgType: "1", - positionX: 2, - positionY: 2, + positionX: 0.6, + positionY: 20, + condition: false, + }, { + equipNo: "2018", + imgType: "1", + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2505", + equipNo: "2017", imgType: "1", - positionX: 4, - positionY: 2, + positionX: 26, + positionY: 8, condition: false, }, { - equipNo: "2502", + equipNo: "2020", imgType: "1", - positionX: 5, - positionY: 2, - condition: false, - }, - //#endregion - - //#region 绗笁鎺� - { - equipNo: "1506", - imgType: "1", - positionX: 1, - positionY: 3, + positionX: 26, + positionY: 20, condition: false, }, { - equipNo: "1501", + equipNo: "2019", imgType: "1", - positionX: 2, - positionY: 3, + positionX: 26, + positionY: 20, condition: false, }, - { - equipNo: "2505", - imgType: "1", - positionX: 4, - positionY: 3, - condition: false, - }, - { - equipNo: "2501", - imgType: "1", - positionX: 5, - positionY: 3, - condition: false, - }, - //#endregion - ], - //#endregion + linescopy6: [ + { + equipNo: "1035", + imgType: "1", + positionX: 0.6, + positionY: 8, + condition: false, + }, + { + equipNo: "1036", + imgType: "1", + positionX: 0.6, + positionY: 8, + condition: false, + }, + { + equipNo: "1037", + imgType: "1", + positionX: 0.6, + positionY: 20, + condition: false, + }, + { + equipNo: "1038", + imgType: "1", + positionX: 0.6, + positionY: 20, + condition: false, + }, { + equipNo: "2022", + imgType: "1", + positionX: 26, + positionY: 8, + condition: false, + }, + { + equipNo: "2021", + imgType: "1", + positionX: 26, + positionY: 8, + condition: false, + }, + { + equipNo: "2024", + imgType: "1", + positionX: 26, + positionY: 20, + condition: false, + }, + { + equipNo: "2023", + imgType: "1", + positionX: 26, + positionY: 20, + condition: false, + }, + ], + StackerCrane: { + Automatic: "", + Fault: "", + CurrentLayer: "", + CurrentRow: "1", + CurrentColumn: "", + CurrentTaskNum: "", + Running: "", + DeviceName: "", + }, xValue1: 0, xValue2: 0, + xValue3: 0, + xValue4: 0, + xValue5: 0, + xValue6: 0, timer1: null, // 瀹氭椂鍣ㄥ彉閲� timer2: null, // 瀹氭椂鍣ㄥ彉閲� - result1: 0, - result1: 1, + RGV01:{ + Automatic: "", + Fault: "", + LevelPoint:0, + CurrentTaskNum: "", + Running: "", + DeviceName: "", + DeviceCode:"RGV01", + }, + RGV02:{ + Automatic: "", + Fault: "", + LevelPoint:1280, + CurrentTaskNum: "", + Running: "", + DeviceName: "", + DeviceCode:"RGV02", + }, + RGV03:{ + Automatic: "", + Fault: "", + LevelPoint:0, + CurrentTaskNum: "", + Running: "", + DeviceName: "", + DeviceCode:"", + }, }; }, components: { @@ -588,158 +602,119 @@ }); return Object.values(groups); }, - async increase() { - this.xValue1 += 100; - this.xValue2 += 100; - // let abc = this.xValue + 100; - // for (this.xValue; this.xValue < abc; this.xValue++) { - // await this.delay(10); - if (this.xValue1 > 1120) { - this.xValue1 = 1120; - this.xValue2 = 1120; - } - this.$nextTick(() => { - this.$refs.lineComponent1.moveDot(this.xValue1); - }); - this.$nextTick(() => { - this.$refs.lineComponent2.moveDot(this.xValue2); - }); - // } + updateRGVOne(){ + if(this.RGV01.Automatic=="鑱旀満妯″紡"&&this.RGV01.Fault!="鏁呴殰"&&this.RGV01.Running=="寰呮満"){ + return 'dot-Automatic '; + } + else if(this.RGV01.Automatic=="鑱旀満妯″紡"&&this.RGV01.Fault!="鏁呴殰"&&this.RGV01.Running=="杩愯涓�"){ + return 'dot-Running '; + }else if(this.RGV01.Fault=="鏁呴殰"){ + return 'dot-Fault '; + }else{ + return 'dot-Fault '; + } }, - async decrease() { - this.xValue1 -= 100; - this.xValue2 -= 100; - if (this.xValue1 < 0) { - this.xValue1 = 0; - this.xValue2 = 0; - } - // let abc = this.xValue - 100; - // for (this.xValue; this.xValue > abc; this.xValue--) { - // await this.delay(10); - this.$nextTick(() => { - this.$refs.lineComponent1.moveDot(this.xValue1); - }); - this.$nextTick(() => { - this.$refs.lineComponent2.moveDot(this.xValue2); - }); - // } + updateRGVTwo(){ + if(this.RGV02.Automatic=="鑱旀満妯″紡"&&this.RGV02.Fault!="鏁呴殰"&&this.RGV02.Running=="寰呮満"){ + return 'dot-Automatic '; + } + else if(this.RGV02.Automatic=="鑱旀満妯″紡"&&this.RGV01.Fault!="鏁呴殰"&&this.RGV02.Running=="杩愯涓�"){ + return 'dot-Running '; + }else if(this.RGV02.Fault=="鏁呴殰"){ + return 'dot-Fault '; + }else{ + return 'dot-Fault '; + } }, - delay(ms) { - return new Promise(resolve => setTimeout(resolve, ms)); + updateRGV03(){ + if(this.RGV03.Automatic=="鑱旀満妯″紡"&&this.RGV03.Fault!="鏁呴殰"&&this.RGV03.Running=="寰呮満"){ + return 'dot-Automatic '; + } + else if(this.RGV03.Automatic=="鑱旀満妯″紡"&&this.RGV03.Fault!="鏁呴殰"&&this.RGV03.Running=="杩愯涓�"){ + return 'dot-Running '; + }else if(this.RGV03.Fault=="鏁呴殰"){ + return 'dot-Fault '; + }else{ + return 'dot-Fault '; + } }, - startTimer() { - // 寮�鍚畾鏃跺櫒锛屾瘡3绉掓墽琛屼竴娆� - this.timer1 = setInterval(() => { - // 鎵ц瀹氭椂鍣ㄧ殑鎿嶄綔 - this.methodofexecution(1) - if (this.result1 <= 0) { - this.result1 = 0 - } - this.$nextTick(() => { - this.$refs.lineComponent1.moveDot(this.result1); - }); - }, 3000); - // 寮�鍚畾鏃跺櫒锛屾瘡3绉掓墽琛屼竴娆� - this.timer2 = setInterval(() => { - // 鎵ц瀹氭椂鍣ㄧ殑鎿嶄綔 - this.methodofexecution(2) - if (this.result2 <= 0) { - this.result2 = 0 - } - this.$nextTick(() => { - this.$refs.lineComponent2.moveDot(this.result2); - }); - }, 3000); - }, - stopTimer() { - // 鍏抽棴瀹氭椂鍣� - clearInterval(this.timer1); - clearInterval(this.timer2); - }, - //鑾峰彇骞惰绠楀爢鍨涙満浣嶇疆 - methodofexecution(equipNo, data, x) { - if (x) { - let WalkingLaserValue = data.r_Stack_WalkingLaserValue; - let Value = ((WalkingLaserValue - 1200) / 50) + 10 - if (equipNo === 1) { - this.result1 = Value - } - else if (equipNo === 2) { - this.result2 = Value - } - } else { - // this.$message({ - // type: "error", - // message: "x.message", - // }); - } - } }, computed: { }, mounted() { - // 鍒濆鍖栭〉闈㈡椂寮�鍚畾鏃跺櫒 - // this.startTimer(); - // // 鐩戝惉璺敱鍙樺寲 - // this.$router.beforeEach((to, from, next) => { - // this.stopTimer(); // 鍏抽棴瀹氭椂鍣� - // next(); // 缁х画璺敱瀵艰埅 - // }); }, created() { eventBus.on('stackerData', eventData => { - // 鏇存柊缁勪欢鐨勬暟鎹� - this.methodofexecution(parseInt(eventData.plcName, 10), eventData.data, true) - const lineComponentsMap = { - 1: 'lineComponent1', - 2: 'lineComponent2', + + const stackerComponentsMap = { + "SC01": 'stacker1', + "SC02": 'stacker2', + "SC03": 'stacker3', + "SC04": 'stacker4', + "SC05": 'stacker5', + "SC06": 'stacker6', }; - - const resultsMap = { - 1: this.result1, - 2: this.result2, - }; - - const componentKey = lineComponentsMap[eventData.plcName]; - const result = resultsMap[eventData.plcName]; - - if (componentKey && result !== undefined) { + const componentKey = stackerComponentsMap[eventData.data.deviceCode]; + if (componentKey) { + this.StackerCrane.Automatic=eventData.data.automatic; + this.StackerCrane.Fault=eventData.data.fault; + this.StackerCrane.Running=eventData.data.running; + this.StackerCrane.CurrentColumn=eventData.data.currentColumn; + this.StackerCrane.CurrentLayer=eventData.data.currentLayer; + this.StackerCrane.LevelPoint=eventData.data.levelPoint; + this.StackerCrane.DeviceName=eventData.data.deviceName; this.$nextTick(() => { - this.$refs[componentKey].moveDot(result); + this.$refs[componentKey].moveDot(this.StackerCrane); }); } }); + eventBus.on('RGVData', eventData => { + + if(eventData.data.deviceCode=="RGV01"){ + this.RGV01.Automatic=eventData.data.automatic; + this.RGV01.Fault=eventData.data.fault; + this.RGV01.Running=eventData.data.running; + this.RGV01.LevelPoint=eventData.data.levelPoint; + this.RGV01.DeviceName=eventData.data.deviceName; + console.log(this.RGV01.LevelPoint) + }else if(eventData.data.deviceCode=="RGV02"){ + this.RGV02.Automatic=eventData.data.automatic; + this.RGV02.Fault=eventData.data.fault; + this.RGV02.Running=eventData.data.running; + this.RGV02.LevelPoint=eventData.data.levelPoint; + this.RGV02.DeviceName=eventData.data.deviceName; + }else if(eventData.data.deviceCode=="RGV03"){ + this.RGV03.Automatic=eventData.data.automatic; + this.RGV03.Fault=eventData.data.fault; + this.RGV03.Running=eventData.data.running; + this.RGV03.LevelPoint=eventData.data.levelPoint; + this.RGV03.DeviceName=eventData.data.deviceName; + } + + }); + eventBus.on("LineData", eventData => { const stationMap = { - "11": this.linescopy1, - "10": this.linescopy1, - "12": this.linescopy2, - "22": this.linescopy2, - "13": this.linescopy3, - "23": this.linescopy3, - "14": this.linescopy4, - "24": this.linescopy4, - "15": this.linescopy5, - "25": this.linescopy5 + "SC01": this.linescopy1, + "SC02": this.linescopy2, + "SC03": this.linescopy3, + "SC04": this.linescopy4, + "SC05": this.linescopy5, + "SC06": this.linescopy6, + "SC07": this.linescopy7, }; - var station = eventData.station_code; - var layer = station.substring(0, 2); - - if (stationMap[layer]) { - stationMap[layer].forEach((line) => { + var station = eventData.stationChildCode; + if (stationMap[eventData.roadway]) { + stationMap[eventData.roadway].forEach((line) => { if (line.equipNo === station) { - line.condition = eventData.r_Line_HasPallet === 1; + line.condition = eventData.inStock; } }) } }) - - for (let i = 1; i < 6; i++) { - this.methodofexecution(i, null, false) - } }, }; </script> @@ -749,8 +724,7 @@ margin-bottom: 10px; } */ .title { - height: 800px; - margin-left: 20px; + height: 1500px; } .cardWidth { @@ -779,7 +753,7 @@ .stackerDiv { border: 1px solid rgba(0, 195, 255, 0.822); - width: 1600px; + width: 980px; padding-left: 3px; } @@ -788,4 +762,77 @@ color: rgba(0, 195, 255, 0.822); margin-bottom: 12px; } +.dot-Running { + position: absolute; + top: -5px; + width: 20px; + height: 20px; + border-radius: 50%; + background-color: #409eff; + transition: transform 0.3s ease; + display: flex; + justify-content: center; + align-items: center; + font-size: 9px; + font-weight: bold; + color: white; +} +.dot-Automatic { + position: absolute; + top: -5px; + width: 20px; + height: 20px; + border-radius: 50%; + background-color: #0df705; + transition: transform 0.3s ease; + display: flex; + justify-content: center; + align-items: center; + font-size: 9px; + font-weight: bold; + color: white; +} + +.dot-Fault { + position: absolute; + top: -5px; + width: 20px; + height: 20px; + /* right:0px; */ + border-radius: 50%; + background-color: #f80410; + transition: transform 0.3s ease; + display: flex; + justify-content: center; + align-items: center; + font-size: 9px; + font-weight: bold; + color: white; +} + + +.line-container { + position: relative; + height: 1280px; + background-color: #ecf5ff; + width: 20px; + top:30px; + left:200px +} +.RGVline { + position: absolute; + top: 0; + left: 0; + right: 0; + height: 2px; + background-color: #a0cfff; +} +.line { + position: absolute; + top: 0; + left: 0; + right: 0; + height: 2px; + background-color: #a0cfff; +} </style> \ No newline at end of file -- Gitblit v1.9.3