update

src/views/mes/deviceledger/detail/editIndex.vue

@@ -156,10 +156,7 @@
             </el-col>
           </el-row>
         </el-form>
-<!--        <template #footer>
+
-          <el-button @click="submitForm" type="primary" :disabled="formLoading || fileUploading">{{ t('common.ok') }}</el-button>
-          <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
-        </template>-->
       </div>
 
       <div class="device-ledger-detail-tabs">
@@ -177,11 +174,20 @@
                 <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
               </el-button>
             </div>
-            <el-table v-loading="tableLoading" :data="criticalComponentTableData" :stripe="true" :show-overflow-tooltip="true">
+            <el-table v-loading="tableLoading" :data="editableCriticalComponentRows" :stripe="true" :show-overflow-tooltip="true">
               <el-table-column :label="t('EquipmentManagement.EquipmentLedger.componentCode')" align="center" prop="code" min-width="140" sortable />
               <el-table-column :label="t('EquipmentManagement.EquipmentLedger.componentName')" align="center" prop="name" min-width="140" sortable />
-              <el-table-column :label="t('EquipmentManagement.EquipmentKeyItems.count')" align="center" prop="count"
+                            <el-table-column :label="t('EquipmentManagement.EquipmentKeyItems.count')" align="center" prop="count" min-width="180">
-          min-width="180" />
+                <template #default="scope">
+                  <el-input-number
+                    v-model="scope.row.count"
+                    :min="0"
+                    :precision="0"
+                    controls-position="right"
+                    class="!w-full"
+                  />
+                </template>
+              </el-table-column>
               <el-table-column :label="t('EquipmentManagement.EquipmentLedger.componentDesc')" align="center" prop="description" min-width="180" />
               <el-table-column :label="t('EquipmentManagement.EquipmentLedger.remark')" align="center" prop="remark" min-width="180" />
               <el-table-column :label="t('EquipmentManagement.EquipmentLedger.createTime')" align="center" prop="createTime" :formatter="dateFormatter" width="180" sortable />
@@ -189,7 +195,11 @@
           </el-tab-pane>
 
 
-        </el-tabs>
+                </el-tabs>
+      </div>
+      <div class="device-ledger-action-bar">
+        <el-button @click="handleCancelEdit">{{ t('common.cancel') }}</el-button>
+        <el-button type="primary" :loading="formLoading" :disabled="fileUploading" @click="submitForm">{{ t('common.save') }}</el-button>
       </div>
     </div>
     <el-dialog v-model="criticalComponentDialogVisible" :title="t('EquipmentManagement.EquipmentLedger.gjTitle')" width="1200px" class="device-ledger-transfer-dialog"
@@ -230,8 +240,17 @@
                            min-width="140" sortable />
           <el-table-column :label="t('EquipmentManagement.EquipmentKeyItems.description')" align="center"
                            prop="description" min-width="180" />
-          <!--        <el-table-column :label="t('EquipmentManagement.EquipmentKeyItems.count')" align="center" prop="count"
+          <!--                      <el-table-column :label="t('EquipmentManagement.EquipmentKeyItems.count')" align="center" prop="count" min-width="180">
-                    min-width="180" />-->
+                <template #default="scope">
+                  <el-input-number
+                    v-model="scope.row.count"
+                    :min="0"
+                    :precision="0"
+                    controls-position="right"
+                    class="!w-full"
+                  />
+                </template>
+              </el-table-column>-->
           <el-table-column :label="t('EquipmentManagement.EquipmentKeyItems.remark')" align="center" prop="remark"
                            min-width="180" />
           <el-table-column :label="t('EquipmentManagement.EquipmentKeyItems.createTime')" align="center" prop="createTime"
@@ -376,8 +395,9 @@ const queryParams = reactive({
 const bjQueryParams = reactive({
   pageNo: 1,
   pageSize: 10,
-  name: undefined,
+  barCode: undefined as string | undefined,
-  categoryId: undefined
+  name: undefined as string | undefined,
+  categoryId: undefined as number | undefined
 })
 
 const handleQuery = () => {
@@ -404,36 +424,32 @@ const bjResetQuery = () => {
 
 const handleSelectionChange = (rows: CriticalComponentVO[]) => {
   selectedIds.value = rows.map((r) => r.id).filter((id): id is number => typeof id === 'number')
-  // 获取当前页所有行的 id
+  // 获取当前页所有行<EFBFBD>?id
   const currentPageIds = rows.map(item => item.id)
 
   // 从已选中的数组中移除当前页的数据
   selectedRows.value = selectedRows.value.filter(
     item => !currentPageIds.includes(item.id)
   )
-  // 添加当前页新选中的数据
+  // 添加当前页新选中的数<EFBFBD>?  selectedRows.value.push(...rows)
-  selectedRows.value.push(...rows)
 }
 
 // 存储当前已选中的行
-const currentSelectedRows = ref([])
 
-// select 事件：row 是当前操作的行，selected 是操作后的状态
+const handleSelect = (selection: any[], row: any) => {
-const handleSelect = (selection, row) => {
   // 判断是选中还是取消选中
   const isSelected = selection.includes(row)
   if (isSelected) {
-    // console.log(`✅ 行被选中: ID=${row.id}, Name=${row.name}`)
+    // console.log(`<EFBFBD>?行被选中: ID=${row.id}, Name=${row.name}`)
     ids.value.push(row.id)
   } else {
 
     ids.value = ids.value.filter(
       item => item !== row.id
     )
-    // console.log(`❌ 行被取消选中: ID=${row.id}, Name=${row.name}`)
+    // console.log(`<EFBFBD>?行被取消选中: ID=${row.id}, Name=${row.name}`)
   }
-  // 更新当前选中状态
+  // 更新当前选中状<EFBFBD>?  currentSelectedRows.value = selection
-  currentSelectedRows.value = selection
 }
 
 
@@ -451,6 +467,7 @@ const confirmCriticalComponentDialog = () => {
   //const selected = Array.from(new Set(criticalComponentDraft.value.map((v) => Number(v)).filter((v) => validMap.has(v))))
   formData.value.componentIds = filterValidSelectedIds(ids.value, criticalComponentOptions.value)
   criticalComponentDialogVisible.value = false
+  syncCriticalComponentRows()
   //multipleTableRef.value.clearSelection()
 }
 const filterValidSelectedIds = (selectedIds: any[], options: SelectionOption[]) => {
@@ -474,35 +491,31 @@ const confirmBeijianDialog = () => {
 
 const bjHandleSelectionChange = (rows: CriticalComponentVO[]) => {
   bjSelectedIds.value = rows.map((r) => r.id).filter((id): id is number => typeof id === 'number')
-  // 获取当前页所有行的 id
+  // 获取当前页所有行<EFBFBD>?id
   const currentPageIds = rows.map(item => item.id)
 
   // 从已选中的数组中移除当前页的数据
   bjSelectedRows.value = bjSelectedRows.value.filter(
     item => !currentPageIds.includes(item.id)
   )
-  // 添加当前页新选中的数据
+  // 添加当前页新选中的数<EFBFBD>?  bjSelectedRows.value.push(...rows)
-  bjSelectedRows.value.push(...rows)
 }
 
 // 存储当前已选中的行
-const bjCurrentSelectedRows = ref([])
 
-// select 事件：row 是当前操作的行，selected 是操作后的状态
+const bjHandleSelect = (selection: any[], row: any) => {
-const bjHandleSelect = (selection, row) => {
   // 判断是选中还是取消选中
   const isSelected = selection.includes(row)
   if (isSelected) {
-    // console.log(`✅ 行被选中: ID=${row.id}, Name=${row.name}`)
+    // console.log(`<EFBFBD>?行被选中: ID=${row.id}, Name=${row.name}`)
     bjIds.value.push(row.id)
   } else {
     bjIds.value = bjIds.value.filter(
       item => item !== row.id
     )
-    // console.log(`❌ 行被取消选中: ID=${row.id}, Name=${row.name}`)
+    // console.log(`<EFBFBD>?行被取消选中: ID=${row.id}, Name=${row.name}`)
   }
-  // 更新当前选中状态
+  // 更新当前选中状<EFBFBD>?  bjCurrentSelectedRows.value = selection
-  bjCurrentSelectedRows.value = selection
 }
 
 
@@ -517,7 +530,6 @@ const getList = async () => {
     const data = await CriticalComponentApi.getCriticalComponentPage(queryParams)
     list.value = data.list
     total.value = data.total
-    // 数据加载后，重新设置选中状态
     nextTick(() => {
       toggleSelection()
     })
@@ -534,7 +546,6 @@ const bjGetList = async () => {
     const data = await ProductApi.getProductPage(bjQueryParams)
     bjList.value = data.list
     bjTotal.value = data.total
-    // 数据加载后，重新设置选中状态
     nextTick(() => {
       bjToggleSelection()
     })
@@ -542,13 +553,11 @@ const bjGetList = async () => {
     loading.value = false
   }
 }
-// 切换选中状态
 const toggleSelection = () => {
   if (!multipleTableRef.value || !selectedRows.value.length) return
 
   // 遍历当前页的数据
   list.value.forEach(row => {
-    // 检查这一行是否在已选中数组中
     const isSelected = selectedRows.value.some(item => item.id === row.id)
 
     if (isSelected) {
@@ -561,13 +570,11 @@ const toggleSelection = () => {
   })
 }
 
-// 切换选中状态
 const bjToggleSelection = () => {
   if (!bjMultipleTableRef.value || !bjSelectedRows.value.length) return
 
   // 遍历当前页的数据
   bjList.value.forEach(row => {
-    // 检查这一行是否在已选中数组中
     const isSelected = bjSelectedRows.value.some(item => item.id === row.id)
 
     if (isSelected) {
@@ -606,13 +613,12 @@ const setDefaultSelections = () => {
       let row = {
         id: undefined
       }
-      multipleTableRef.value.toggleRowSelection(row, true)
+      multipleTableRef.value!.toggleRowSelection(row, true)
     }
     // 遍历数据，找到需要选中的行
     list.value.forEach(row => {
-      let id = row.id;
       if (rawSubjectIds.includes(row.id)) {
-        multipleTableRef.value.toggleRowSelection(row, true)
+        multipleTableRef.value!.toggleRowSelection(row, true)
       }
     })
   })
@@ -721,6 +727,7 @@ const criticalComponentOptions = ref<SelectionOption[]>([])
 const beijianOptions = ref<SelectionOption[]>([])
 const savedCriticalComponentOptions = ref<SelectionOption[]>([])
 const savedBeijianOptions = ref<SelectionOption[]>([])
+const editableCriticalComponentRows = ref<any[]>([])
 
 const buildCriticalComponentOptions = (items: any[] = []): SelectionOption[] =>
   (items ?? [])
@@ -769,9 +776,11 @@ const criticalComponentDisplay = computed(() =>
 const beijianDisplay = computed(() =>
   formatSelectedSummary(formData.value.beijianIds ?? [], mergeSelectionOptions(beijianOptions.value, savedBeijianOptions.value))
 )
-const criticalComponentTableData = computed(() => {
+const buildCriticalComponentTableRows = () => {
   const detailList = (detailData.value as any)?.componentList
-  if (Array.isArray(detailList) && detailList.length) return detailList
+  if (Array.isArray(detailList) && detailList.length) {
+    return detailList.map((item: any) => ({ ...item, count: normalizeNumberish(item?.count) ?? 0 }))
+  }
 
   const selectedIds = new Set<number>((formData.value.componentIds ?? []).map((id: any) => Number(id)).filter((id: number) => !Number.isNaN(id)))
   if (!selectedIds.size) return []
@@ -789,12 +798,17 @@ const criticalComponentTableData = computed(() => {
       id,
       code: nameParts.length ? code : '',
       name: nameParts.length ? nameParts.join('-') : label,
+      count: 0,
       description: '',
       remark: '',
       createTime: undefined
     }
   })
-})
+}
+
+const syncCriticalComponentRows = () => {
+  editableCriticalComponentRows.value = buildCriticalComponentTableRows()
+}
 
 const clearCriticalComponent = () => {
   formData.value.componentIds = []
@@ -895,8 +909,65 @@ const bindFormData = (detail: DeviceLedgerVO) => {
   savedCriticalComponentOptions.value = buildCriticalComponentOptions((detail as any)?.componentList ?? [])
   savedBeijianOptions.value = buildBeijianOptions((detail as any)?.beijianList ?? [])
 }
+  syncCriticalComponentRows()
 
 const criticalExportLoading = ref(false)
+
+const normalizeFileUrlAsJsonArrayString = (value: any): string | undefined => {
+  if (value === null || value === undefined || value === '') return undefined
+  if (typeof value === 'string') return value.trim() || undefined
+  if (Array.isArray(value)) return JSON.stringify(value)
+  return JSON.stringify(value)
+}
+
+const buildSubmitData = () => {
+  const componentRows = editableCriticalComponentRows.value.map((row: any) => ({
+    ...row,
+    id: normalizeNumberish(row?.id),
+    count: normalizeNumberish(row?.count) ?? 0
+  })).filter((row: any) => row.id !== undefined)
+  formData.value.componentIds = componentRows.map((row: any) => row.id)
+
+  const data = {
+    ...(formData.value as any),
+    isScheduled: normalizeNumberish((formData.value as any).isScheduled) ?? 0,
+    ratedCapacity: normalizeNumberish((formData.value as any).ratedCapacity),
+    deviceType: normalizeNumberish(formData.value.deviceType),
+    deviceLine: normalizeNumberish((formData.value as any).deviceLine),
+    productionDate: normalizeYmd(formData.value.productionDate),
+    factoryEntryDate: normalizeYmd(formData.value.factoryEntryDate),
+    deviceManager: formData.value.deviceManagerIds?.length ? formData.value.deviceManagerIds.join(',') : undefined,
+    componentId: formData.value.componentIds?.length ? formData.value.componentIds.join(',') : undefined,
+    componentList: componentRows,
+    beijianId: formData.value.beijianIds?.length ? formData.value.beijianIds.join(',') : undefined,
+    fileUrl: normalizeFileUrlAsJsonArrayString((formData.value as any).fileUrl)
+  } as unknown as DeviceLedgerVO
+
+  delete (data as any).deviceManagerIds
+  delete (data as any).componentIds
+  delete (data as any).beijianIds
+  return data
+}
+
+const submitForm = async () => {
+  if (fileUploading.value) {
+    message.warning(t('common.loading'))
+    return
+  }
+  await formRef.value?.validate?.()
+  formLoading.value = true
+  try {
+    await DeviceLedgerApi.updateDeviceLedger(buildSubmitData())
+    message.success(t('common.updateSuccess'))
+    await getDetail()
+  } finally {
+    formLoading.value = false
+  }
+}
+
+const handleCancelEdit = async () => {
+  await getDetail()
+}
 const handleExportCriticalComponent = async () => {
   if (!deviceId.value) return
   try {
@@ -928,11 +999,8 @@ const getDetail = async () => {
 }
 
 
-// 方法1：直接监听 data
+watch(bjList, (newData) => {
-watch(bjList, (newData, oldData) => {
-  // 可以在这里执行相关操作
   if (newData.length > 0) {
-    // 数据加载完成后的操作
     setBJDefaultSelections()
   }
 }, { deep: true })
@@ -951,13 +1019,12 @@ const setBJDefaultSelections = () => {
       let row = {
         id: undefined
       }
-      bjMultipleTableRef.value.toggleRowSelection(row, true)
+      bjMultipleTableRef.value!.toggleRowSelection(row, true)
     }
     // 遍历数据，找到需要选中的行
     bjList.value.forEach(row => {
-      let id = row.id;
       if (rawSubjectIds.includes(row.id)) {
-        bjMultipleTableRef.value.toggleRowSelection(row, true)
+        bjMultipleTableRef.value!.toggleRowSelection(row, true)
       }
     })
   })
@@ -968,6 +1035,7 @@ async function initForm() {
     formLoading.value = true
     try {
       const detail = await DeviceLedgerApi.getDeviceLedger(deviceId.value)
+      detailData.value = detail
       const templateJson = (detail as any)?.templateJson
       const parsedTemplateJson = typeof templateJson === 'string'
         ? JSON.parse(templateJson)
@@ -990,6 +1058,7 @@ async function initForm() {
       }
       savedCriticalComponentOptions.value = buildCriticalComponentOptions((detail as any)?.componentList ?? [])
       savedBeijianOptions.value = buildBeijianOptions((detail as any)?.beijianList ?? [])
+      syncCriticalComponentRows()
     } finally {
       formLoading.value = false
     }
@@ -1010,7 +1079,7 @@ onMounted(async () => {
 .device-ledger-detail-body {
   position: relative;
   max-height: 100vh;
-  padding-top: 2px;
+  padding: 2px 0 72px;
 }
 
 .device-ledger-detail-title {
@@ -1062,6 +1131,22 @@ onMounted(async () => {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+.device-ledger-action-bar {
+/*  position: sticky;
+  bottom: 0;*/
+  position: fixed;
+  right: 24px;
+  bottom: 0;
+  left: 240px;
+  z-index: 10;
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 12px 16px;
+  border-top: 1px solid var(--el-border-color-lighter);
+  background: var(--el-bg-color);
+  box-shadow: 0 -4px 12px rgb(0 0 0 / 6%);
+}
 </style>
 
 
@@ -1069,3 +1154,13 @@ onMounted(async () => {
 
 
 
+
+
+
+
+
+
+
+
+
+