fix:id 修改

src/views/coalFeeding.vue

@@ -92,7 +92,7 @@
             >
               {{ row.label }}
             </div>
-              <div class="control-panel__label control-panel__label--motor" :style="{ minHeight: returnMotorHeight }">
+            <div class="control-panel__label control-panel__label--motor" :style="{ minHeight: returnMotorHeight }">
                 回车侧
               </div>
             </div>
@@ -108,9 +108,9 @@
                   {{ item.team }}
                 </span>
               </div>
-              <div class="control-panel__section" :id="'unit_up_'+index"
+              <div class="control-panel__section" :id="getUnitDropId('up', index)"
                 @dragover="onDjDragOver"
-                @drop="onDjDrop($event, item , 'unit_up_'+index,index)">
+                @drop="onDjDrop($event, item, getUnitDropId('up', index), index)">
                 <div
                   v-for="row in upperBlockRows"
                   :key="`upper-${item.team}-${row.key}`"
@@ -136,9 +136,9 @@
                 <div class="control-panel__cell control-panel__cell--motor" :style="{ minHeight: middleMotorHeight }">
                   <div class="control-panel__motor-grid">
                     <div
-                      v-for="dj in item.team_top.dianji"
+                      v-for="(dj, motorIndex) in item.team_top.dianji"
                       :key="dj.id"
-                      :id="dj.id"
+                      :id="'unit'+index+'_up_'+motorIndex"
                       class="control-panel__motor-card dianji_status"
                     >
                       <div class="flexs items_center gap0_25 justify_center">
@@ -175,6 +175,11 @@
                       <div class="items_center">
                         <span v-if="dj.eqm == '正常'" class="text_10 fontw600 text_emerald">{{ dj.eqm }}</span>
                         <span v-else class="text_10 fontw600 text_red">{{ dj.eqm }}</span>
+                        <span
+                          v-if="motorIndex < 2"
+                          :data-monitor-value="getMotorSlotId('up', index, motorIndex + 1)"
+                          style="display: none"
+                        ></span>
                       </div>
                     </div>
                   </div>
@@ -206,10 +211,10 @@
                 <span class="control-panel__value control-panel__value--temp">{{ item.tempera1 }}</span>
                 <span> °C</span>
               </div>
-              <div class="control-panel__section"  
+              <div class="control-panel__section"
-                :id="'unit_down_'+index"
+                :id="getUnitDropId('down', index)"
                 @dragover="onDjDragOver"
-                @drop="onDjDrop($event, item, 'unit_up_'+index,index)">
+                @drop="onDjDrop($event, item, getUnitDropId('down', index), index)">
                 <div
                   v-for="row in lowerBlockRows"
                   :key="`lower-${item.team}-${row.key}`"
@@ -234,8 +239,9 @@
                 <div class="control-panel__cell control-panel__cell--motor" :style="{ minHeight: returnMotorHeight }">
                   <div class="control-panel__motor-grid">
                     <div
-                      v-for="dj in item.team_bottom.dianji2"
+                      v-for="(dj, motorIndex) in item.team_bottom.dianji2"
                       :key="dj.id"
+                      :id="'unit'+index+'_down_'+motorIndex"
                       class="control-panel__motor-card dianji_status"
                     >
                       <div class="flexs items_center gap0_25 justify_center">
@@ -272,6 +278,11 @@
                       <div class="items_center">
                         <span v-if="dj.eqm == '正常'" class="text_10 fontw600 text_emerald">{{ dj.eqm }}</span>
                         <span v-else class="text_10 fontw600 text_red">{{ dj.eqm }}</span>
+                        <span
+                          v-if="motorIndex < 2"
+                          :data-monitor-value="getMotorSlotId('down', index, motorIndex + 1)"
+                          style="display: none"
+                        ></span>
                       </div>
                     </div>
                   </div>
@@ -1441,9 +1452,21 @@ const clearError = () => {
 const getCellId = (prefix: string | undefined, index: number) => {
   return prefix ? `${prefix}${index}` : undefined;
 };
+const getUnitDropId = (section: "up" | "down", index: number) => {
+  return `unit_${section}_${index}`;
+};
+const getMotorSlotId = (section: "up" | "down", index: number, slot: number) => {
+  return getMotorBindingKey(section, index, slot);
+};
 const getTempDropId = (side: "tempera1" | "tempera2", item: CoalUnit, index: number) => {
   return `${side}_unit${item.unit}_${index + 1}`;
 };
+const getUnitBindingKey = (section: "up" | "down", index: number) => {
+  return `binding_unit_${section}_${index}`;
+};
+const getMotorBindingKey = (section: "up" | "down", index: number, slot: number) => {
+  return `binding_motor_${section}_${index}_${slot}`;
+};
 const isTimeRow = (row: BlockRowConfig) => row.kind === "time";
 const getCellValue = (item: CoalUnit, row: BlockRowConfig) => {
   if (row.kind === "time" && row.section) {
@@ -1479,8 +1502,6 @@ const updateCellValue = (item: CoalUnit, row: BlockRowConfig, event: Event) => {
 const onPointDragStart = (event: DragEvent, point: PointItem) => {
   if (event.dataTransfer) {
     event.dataTransfer.setData('text/plain', JSON.stringify(point));
-    console.log('start000000000');
-    console.log('event.dataTransfer.getData("text/plain"):', JSON.parse(event.dataTransfer.getData("text/plain")));
   }
 };
 const onDjDragOver = (event: DragEvent) => {
@@ -1492,22 +1513,67 @@ const onDjDragOver = (event: DragEvent) => {
 };
 const pendingPointUpdates = ref<Array<{ key: string; value: string }>>([]);
 
-const onDjDrop = (event: DragEvent, dropItem: any, temp: string,index?:number) => {
+const getRolePointId = (unit: any, equipmentIndex: number, rolePointIndex: number) => {
+  return unit?.equipments?.[equipmentIndex]?.role_points?.[rolePointIndex]?.point_id;
+};
+
+const assignUnitTiming = (targetItem: CoalUnit, section: SectionKey, unit: any) => {
+  targetItem[section].run_time_sec = unit?.run_time_sec ?? "";
+  targetItem[section].stop_time_sec = unit?.stop_time_sec ?? "";
+  targetItem[section].acc_time_sec = unit?.acc_time_sec ?? "";
+  targetItem[section].bl_time_sec = unit?.bl_time_sec ?? "";
+};
+
+const onDjDrop = (event: DragEvent, dropItem: any, DomId: string,index:number) => {
   event.preventDefault();
   if (!event.dataTransfer) return;
-  const rawJson = event.dataTransfer.getData("text/plain");
+  const unitJson = event.dataTransfer.getData("text/plain");
-  if (!rawJson) return;
+  if (!unitJson) return;
-  const raw = JSON.parse(rawJson);
+  const unit = JSON.parse(unitJson);
-  const key = temp;
+  console.log('unit:', unit);
-  console.log('raw:', raw);
+  console.log('DomId:', DomId);
-  console.log('key:', key);
   console.log('index:', index);
   console.log('dropItem:', dropItem);
-  const existing = pendingPointUpdates.value.find((item) => item.key === key);
+  const targetItem = dataList[index];
-  if (existing) {
+  //1、unit与targetItem的元素Id绑定
-    existing.value = String(raw.id);
+  if (unit?.id) {
-  } else {
+      pendingPointUpdates.value.push({key: DomId, value: String(unit.id)});
-    pendingPointUpdates.value.push({ key, value: String(raw.id) });
+  }
+  //测点Id与电机DomId绑定
+  const djMotor1 = getRolePointId(unit, 0, 0);
+  const djMotor2 = getRolePointId(unit, 0, 1);
+  const djMotor3 = getRolePointId(unit, 1, 0);
+  const djMotor4 = getRolePointId(unit, 1, 1);
+  console.log('djMotor1:', djMotor1);
+  console.log('djMotor2:', djMotor2);
+  console.log('djMotor3:', djMotor1);
+  console.log('djMotor4:', djMotor1);
+  let djDomId1 = '', djDomId2 = '', djDomId3 = '', djDomId4 = '';
+  if (DomId.includes("unit_up_")) {
+    assignUnitTiming(targetItem, "team_top", unit);
+    djDomId1 = 'unit'+index+'_up_0';
+    djDomId2 = 'unit'+index+'_up_1';
+    djDomId3 = 'unit'+index+'_up_2';
+    djDomId4 = 'unit'+index+'_up_3';
+  }
+  if (DomId.includes("unit_down_")) {
+    assignUnitTiming(targetItem, "team_bottom", unit);
+    djDomId1 = 'unit'+index+'_down_0';
+    djDomId2 = 'unit'+index+'_down_1';
+    djDomId3 = 'unit'+index+'_down_2';
+    djDomId4 = 'unit'+index+'_down_3';
+  }
+  if (djMotor1) {
+    pendingPointUpdates.value.push({key: djDomId1, value: String(djMotor1)});
+  }
+  if (djMotor2) {
+    pendingPointUpdates.value.push({key: djDomId2, value: String(djMotor2)});
+  }
+  if (djMotor3) {
+    pendingPointUpdates.value.push({key: djDomId3, value: String(djMotor3)});
+  }
+  if (djMotor4) {
+    pendingPointUpdates.value.push({key: djDomId4, value: String(djMotor4)});
   }
 };
 
@@ -1560,6 +1626,7 @@ const toggleDjStop = (
 };
 const commitPointUpdates = () => {
   if (!pendingPointUpdates.value.length) return;
+  console.log('pendingPointUpdates',pendingPointUpdates.value);
   const data: Record<string, string> = {};
   pendingPointUpdates.value.forEach((item) => {
     data[item.key] = item.value;
@@ -1593,9 +1660,11 @@ const initWebSocket = () => {
       if (entries.length) {
         entries.forEach(([elementId]) => {
           const el = document.getElementById(elementId);
-          const span = el?.querySelector("span");
+          const valueTarget =
-          if (span) {
+            el?.querySelector<HTMLElement>("[data-monitor-value]") ||
-            span.textContent = data.data.value_text ?? "";
+            el?.querySelector<HTMLElement>("span");
+          if (valueTarget) {
+            valueTarget.textContent = data.data.value_text ?? "";
           }
         });
         // entries.forEach(([elementId]) => {