Я работаю с динамическим элементом creaiton в пользовательском интерфейсе, использую кординаты, и у меня есть проблемы, мне нужно создать различные представления div,
Для моего кода:
var listOfCordinates = [
{ machineType: "prep", stantionName: "Kalander", status: "Working", x: 20, y: 190 },
{ machineType: "fals", stantionName: "Line 1", status: "Working", x: 175, y: 170 },
{ machineType: "fals", stantionName: "Line 2", status: "Working", x: 175, y: 230 },
{ machineType: "fals", stantionName: "Line 3", status: "Working", x: 175, y: 290 },
{ machineType: "fals", stantionName: "Line 4", status: "Working", x: 175, y: 350 },
{ machineType: "cutting", stantionName: "CUT 01-102", status: "Working", x: 10, y: 290 },
{ machineType: "cutting", stantionName: "CUT 01-102", status: "Working", x: 10, y: 350 },
{ machineType: "lay", stantionName: "Lay01-102", status: "N/A", x: 10, y: 350 }
];
function createObject() {
$(listOfCordinates).each(function (i, data) {
console.log(data.machineType)
var object = `<div class="lpms3-box">
<div class="machine-icon">
<img src="/images/Lpms3/${data.machineType}.png" />
</div>
<div class="title-box">${data.stantionName}</div>
<div class="desc-box">${data.status}</div>
</div>`
$(".lpms3-objects").append(object);
});
getCords()
}
createObject()
function getCords() {
$(".lpms3-box").each(function (i, elm) {
const data = listOfCordinates[i]
$(this).css({
left: data.x,
top: data.y
});
});
}
Из списка, который я создаю элемент, и если у меня есть в списке LAY мне нужно построить другое представление, например:
var object = `<div class="lay-table">
<div class="title-box">${data.stantionName}Lay table 1</div>
<div class="desc-box">${data.status}</div>
</div>`
$(".lpms3-objects").append(object);
Но проблема в том, что previus элементов мне нужно построить, я пытаюсь использовать, если и переключатель, и это не поможет мне, как я могу решить эту проблему?