| | |
| | | const adjustedRectsa = ref([]); |
| | | const adjustedRectsb = ref([]); |
| | | const adjustedRectsc = ref([]); |
| | | const adjustedRectsd = ref([]); |
| | | const adjustedRectse = ref([]); |
| | | const subRectsCounts = ref([]); |
| | | const subRectsCountsa = ref([]); |
| | | const subRectsCountsb = ref([]); |
| | | const subRectsCountsc = ref([]); |
| | | const subRectsCountsd = ref([]); |
| | | const subRectsCountse = ref([]); |
| | | const currentRow = reactive({}); // å½åè¡çæ°æ® |
| | | const showAlert = ref(false) |
| | | const alertMessage = ref('') |
| | |
| | | const cell2=ref(true); |
| | | const cell3=ref(true); |
| | | const cell4=ref(true); |
| | | const cell5=ref(true); |
| | | const cell6=ref(true); |
| | | const canEdit = ref(true); |
| | | const selectedRow = ref(null); |
| | | const temperingtotal = ref(0); |
| | |
| | | top: 53/55, |
| | | })); |
| | | subRectsCountsc.value = data.bigStorageCageInfos[0][4].map(rect => rect.count); |
| | | adjustedRectsd.value = data.bigStorageCageInfos[0][5].map((rect, index) => ({ |
| | | id: index + 1, |
| | | height: 20/55, |
| | | top: 53/55, |
| | | })); |
| | | subRectsCountsd.value = data.bigStorageCageInfos[0][5].map(rect => rect.count); |
| | | adjustedRectse.value = data.bigStorageCageInfos[0][6].map((rect, index) => ({ |
| | | id: index + 1, |
| | | height: 20/55, |
| | | top: 53/55, |
| | | })); |
| | | subRectsCountse.value = data.bigStorageCageInfos[0][6].map(rect => rect.count); |
| | | }else{ |
| | | adjustedRects.value = '', |
| | | adjustedRectsa.value = '', |
| | | adjustedRectsb.value = '', |
| | | adjustedRectsc.value = '' |
| | | adjustedRectsc.value = '', |
| | | adjustedRectsd.value = '', |
| | | adjustedRectse.value = '' |
| | | } |
| | | }; |
| | | // è®¡ç®æ¯ä¸ªå¤§ç©å½¢çæ ·å¼ |
| | |
| | | } |
| | | return subRects; |
| | | }; |
| | | // è®¡ç®æ¯ä¸ªå¤§ç©å½¢çæ ·å¼ |
| | | const rectStyled = (rect, index) => ({ |
| | | position: 'absolute', |
| | | width: '170px', |
| | | right: '0px', |
| | | top: `${index*rect.top}px`, |
| | | height: `${rect.height}px`, |
| | | }); |
| | | // è®¡ç®æ¯ä¸ªå°ç©å½¢çæ ·å¼åæ°é |
| | | const getSubRectsd = (rectIndex) => { |
| | | const count = subRectsCountsd.value[rectIndex]; |
| | | const subRects = []; |
| | | for (let i = 0; i < count; i++) { |
| | | subRects.push({}); |
| | | } |
| | | return subRects; |
| | | }; |
| | | // è®¡ç®æ¯ä¸ªå¤§ç©å½¢çæ ·å¼ |
| | | const rectStylee = (rect, index) => ({ |
| | | position: 'absolute', |
| | | width: '170px', |
| | | right: '0px', |
| | | top: `${index*rect.top}px`, |
| | | height: `${rect.height}px`, |
| | | }); |
| | | // è®¡ç®æ¯ä¸ªå°ç©å½¢çæ ·å¼åæ°é |
| | | const getSubRectse = (rectIndex) => { |
| | | const count = subRectsCountse.value[rectIndex]; |
| | | const subRects = []; |
| | | for (let i = 0; i < count; i++) { |
| | | subRects.push({}); |
| | | } |
| | | return subRects; |
| | | }; |
| | | // è®¡ç®æ¯ä¸ªå°ç©å½¢çæ ·å¼ |
| | | const subRectStylec = (rectIndex, subIndex) => { |
| | | const width = '18px'; |
| | | const marginRight = '8px'; |
| | | const totalWidth = 6 * (parseInt(width) + parseInt(marginRight)); |
| | | const right = `${(subIndex * (parseInt(width) + parseInt(marginRight))) / totalWidth * 100}%`; |
| | | return { |
| | | position: 'absolute', |
| | | width, |
| | | height: '100%', |
| | | marginRight, |
| | | top: '0px', |
| | | backgroundColor: '#911005', |
| | | right, |
| | | }; |
| | | }; |
| | | // è®¡ç®æ¯ä¸ªå°ç©å½¢çæ ·å¼ |
| | | const subRectStyled = (rectIndex, subIndex) => { |
| | | const width = '18px'; |
| | | const marginRight = '8px'; |
| | | const totalWidth = 6 * (parseInt(width) + parseInt(marginRight)); |
| | | const right = `${(subIndex * (parseInt(width) + parseInt(marginRight))) / totalWidth * 100}%`; |
| | | return { |
| | | position: 'absolute', |
| | | width, |
| | | height: '100%', |
| | | marginRight, |
| | | top: '0px', |
| | | backgroundColor: '#911005', |
| | | right, |
| | | }; |
| | | }; |
| | | // è®¡ç®æ¯ä¸ªå°ç©å½¢çæ ·å¼ |
| | | const subRectStylee = (rectIndex, subIndex) => { |
| | | const width = '18px'; |
| | | const marginRight = '8px'; |
| | | const totalWidth = 6 * (parseInt(width) + parseInt(marginRight)); |
| | |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell2" style="width: 170px;height: 53px;position: relative;top:72px;left: 445px;"> |
| | | <div v-show="cell2" style="width: 170px;height: 53px;position: relative;top:70px;left: 445px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectsa" :key="rect.id" :style="rectStylea(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectsa(rectIndex)" |
| | |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell3" style="width: 170px;height: 53px;position: relative;top:81px;left: 445px;"> |
| | | <div v-show="cell3" style="width: 170px;height: 53px;position: relative;top:76px;left: 445px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectsb" :key="rect.id" :style="rectStyleb(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectsb(rectIndex)" |
| | |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell4" style="width: 170px;height: 53px;position: relative;top:89px;left: 445px;"> |
| | | <div v-show="cell4" style="width: 170px;height: 53px;position: relative;top:84px;left: 445px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectsc" :key="rect.id" :style="rectStylec(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectsc(rectIndex)" |
| | | :key="subIndex" |
| | | :style="subRectStylec(rectIndex, subIndex)" |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell5" style="width: 170px;height: 53px;position: relative;top:-16px;left: 45px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectsd" :key="rect.id" :style="rectStyled(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectsd(rectIndex)" |
| | | :key="subIndex" |
| | | :style="subRectStyled(rectIndex, subIndex)" |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell6" style="width: 170px;height: 53px;position: relative;top:-6px;left: 45px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectse" :key="rect.id" :style="rectStylee(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectse(rectIndex)" |
| | | :key="subIndex" |
| | | :style="subRectStylee(rectIndex, subIndex)" |
| | | ></div> |
| | | </div> |
| | | </div> |
| | |
| | | .img-dlpl{ |
| | | margin-left: 20px; |
| | | margin-top: 0px; |
| | | background-image:url('/ganghuaqian.png'); |
| | | background-image:url('/src/assets/ganghuaqian.png'); |
| | | background-repeat: no-repeat; |
| | | background-attachment: local; |
| | | min-height: 380px; |
| | |
| | | const adjustedRectsb = ref([]); |
| | | const adjustedRectsc = ref([]); |
| | | const adjustedRectsd = ref([]); |
| | | const adjustedRectse = ref([]); |
| | | const subRectsCounts = ref([]); |
| | | const subRectsCountsa = ref([]); |
| | | const subRectsCountsb = ref([]); |
| | | const subRectsCountsc = ref([]); |
| | | const subRectsCountsd = ref([]); |
| | | const subRectsCountse = ref([]); |
| | | const currentRow = reactive({}); // å½åè¡çæ°æ® |
| | | const currentLack = reactive({}); |
| | | const currentPage2 = ref(1) |
| | |
| | | adjustedRects.value = data.bigStorageCageInfos[0][1].map((rect, index) => ({ |
| | | id: index + 1, |
| | | height: 15/55, |
| | | top: 33/55, |
| | | top: 64/55, |
| | | })); |
| | | subRectsCounts.value = data.bigStorageCageInfos[0][1].map(rect => rect.count); |
| | | adjustedRectsa.value = data.bigStorageCageInfos[0][2].map((rect, index) => ({ |
| | | id: index + 1, |
| | | height: 15/55, |
| | | top: 33/55, |
| | | top: 64/55, |
| | | })); |
| | | subRectsCountsa.value = data.bigStorageCageInfos[0][2].map(rect => rect.count); |
| | | adjustedRectsb.value = data.bigStorageCageInfos[0][3].map((rect, index) => ({ |
| | | id: index + 1, |
| | | height: 15/55, |
| | | top: 33/55, |
| | | top: 64/55, |
| | | })); |
| | | subRectsCountsb.value = data.bigStorageCageInfos[0][3].map(rect => rect.count); |
| | | adjustedRectsc.value = data.bigStorageCageInfos[0][4].map((rect, index) => ({ |
| | | id: index + 1, |
| | | height: 15/55, |
| | | top: 33/55, |
| | | top: 64/55, |
| | | })); |
| | | subRectsCountsc.value = data.bigStorageCageInfos[0][4].map(rect => rect.count); |
| | | adjustedRectsd.value = data.bigStorageCageInfos[0][5].map((rect, index) => ({ |
| | | id: index + 1, |
| | | height: 15/55, |
| | | top: 33/55, |
| | | top: 64/55, |
| | | })); |
| | | subRectsCountsd.value = data.bigStorageCageInfos[0][5].map(rect => rect.count); |
| | | adjustedRectse.value = data.bigStorageCageInfos[0][6].map((rect, index) => ({ |
| | | id: index + 1, |
| | | height: 15/55, |
| | | top: 64/55, |
| | | })); |
| | | subRectsCountse.value = data.bigStorageCageInfos[0][6].map(rect => rect.count); |
| | | |
| | | }else{ |
| | | adjustedRects.value = '', |
| | | adjustedRectsa.value = '', |
| | | adjustedRectsb.value = '', |
| | | adjustedRectsc.value = '' |
| | | adjustedRectsd.value = '' |
| | | adjustedRectsc.value = '', |
| | | adjustedRectsd.value = '', |
| | | adjustedRectse.value = '' |
| | | } |
| | | }; |
| | | const getAlertText = (alarmCode) => { |
| | |
| | | left, |
| | | }; |
| | | }; |
| | | // è®¡ç®æ¯ä¸ªå°ç©å½¢çæ ·å¼åæ°é |
| | | const getSubRectse = (rectIndex) => { |
| | | const count = subRectsCountse.value[rectIndex]; |
| | | const subRects = []; |
| | | for (let i = 0; i < count; i++) { |
| | | subRects.push({}); |
| | | } |
| | | return subRects; |
| | | }; |
| | | // è®¡ç®æ¯ä¸ªå°ç©å½¢çæ ·å¼ |
| | | const subRectStylee = (rectIndex, subIndex) => { |
| | | const width = '18px'; |
| | | const marginLeft = '3px'; |
| | | const totalWidth = 6 * (parseInt(width) + parseInt(marginLeft)); |
| | | const left = `${(subIndex * (parseInt(width) + parseInt(marginLeft))) / totalWidth * 100}%`; |
| | | return { |
| | | position: 'absolute', |
| | | width, |
| | | height: '100%', |
| | | marginLeft, |
| | | top: '0px', |
| | | backgroundColor: '#911005', |
| | | left, |
| | | }; |
| | | }; |
| | | const iframeUrl = ref(''); |
| | | const handlehistorical = (row) => { |
| | | blindb.value = true; |
| | |
| | | > |
| | | </div> |
| | | </div> |
| | | <div class="img-car4" :style="'z-index:999;left:588px;top:' + 450*carPosition[1] + 'px;position:absolute;'"> |
| | | <div class="img-car4" :style="'z-index:999;left:580px;top:' + 450*carPosition[1] + 'px;position:absolute;'"> |
| | | <div |
| | | v-for="(rect, index) in adjust" |
| | | :key="rect.id" |
| | |
| | | </div> |
| | | </div> |
| | | <div style="position: relative;"> |
| | | <div v-show="cell1" style="width: 150px;height: 33px;position: relative;top:292px;left: 418px;"> |
| | | <div v-show="cell1" style="width: 150px;height: 64px;position: relative;top:82px;left: 415px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRects" :key="rect.id" :style="rectStyle(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRects(rectIndex)" |
| | |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell2" style="width: 150px;height: 33px;position: relative;top:295px;left: 418px;"> |
| | | <div v-show="cell2" style="width: 150px;height: 64px;position: relative;top:88px;left: 415px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectsa" :key="rect.id" :style="rectStylea(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectsa(rectIndex)" |
| | |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell3" style="width: 150px;height: 33px;position: relative;top:298px;left: 418px;"> |
| | | <div v-show="cell3" style="width: 150px;height: 64px;position: relative;top:93px;left: 415px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectsb" :key="rect.id" :style="rectStyleb(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectsb(rectIndex)" |
| | |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell4" style="width: 150px;height: 33px;position: relative;top:301px;left: 418px;"> |
| | | <div v-show="cell4" style="width: 150px;height: 64px;position: relative;top:99px;left: 415px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectsc" :key="rect.id" :style="rectStylec(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectsc(rectIndex)" |
| | |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell5" style="width: 150px;height: 33px;position: relative;top:304px;left: 418px;"> |
| | | <div v-show="cell5" style="width: 150px;height: 64px;position: relative;top:105px;left: 415px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectsd" :key="rect.id" :style="rectStyled(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectsd(rectIndex)" |
| | | :key="subIndex" |
| | | :style="subRectStyled(rectIndex, subIndex)" |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell6" style="width: 150px;height: 64px;position: relative;top:28px;left: 40px;"> |
| | | <div v-for="(rect, rectIndex) in adjustedRectse" :key="rect.id" :style="rectStyled(rect, rectIndex)"> |
| | | <div |
| | | v-for="(subRect, subIndex) in getSubRectse(rectIndex)" |
| | | :key="subIndex" |
| | | :style="subRectStylee(rectIndex, subIndex)" |
| | | ></div> |
| | | </div> |
| | | </div> |
| | |
| | | .img-zkdlpl{ |
| | | margin-left: 20px; |
| | | margin-top: 0px; |
| | | background-image:url('/zhongkong.png'); |
| | | background-image:url('/src/assets/zhongkong.png'); |
| | | background-repeat: no-repeat; |
| | | background-attachment: local; |
| | | min-height: 500px; |