ソースを参照

pms BOM 选择物料 数量 输入框 保持焦点

zhangcl 3 週間 前
コミット
2be1c71109
1 ファイル変更18 行追加5 行削除
  1. 18 5
      src/views/pms/bom/MaterialList.vue

+ 18 - 5
src/views/pms/bom/MaterialList.vue

@@ -2,7 +2,7 @@
   <Dialog v-model="dialogVisible" :title="t('iotMaintain.selectMaterials')"
           style="width: 1300px; min-height: 300px" :close-on-click-modal="false" @close="handleClose">
 
-    <!-- 新增设备分类和BOM节点信息显示 -->
+    <!-- 设备分类和BOM节点信息显示 -->
     <div style="margin: 0 0px 15px; background: #f5f7fa; padding: 12px 20px; border-radius: 4px;">
       <el-row>
         <el-col :span="12">
@@ -52,7 +52,7 @@
       </el-form>
     </ContentWrap>
 
-    <!-- 新增:已选物料标签区域 -->
+    <!-- 已选物料标签区域 -->
     <ContentWrap v-if="selectedRows.length > 0"
                  style="margin: -10px 0px 10px; padding: 10px 15px; background: #f8fafc; border-radius: 4px; border: 1px solid #ebeef5;">
       <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 8px;">
@@ -137,6 +137,7 @@ import { dateFormatter } from '@/utils/formatTime'
 import * as MaterialApi from '@/api/pms/material'
 import {defaultProps, handleTree} from "@/utils/tree";
 import * as MaterialGroupApi from '@/api/pms/materialgroup'
+import { shallowRef, nextTick } from 'vue'
 
 defineOptions({
   name: 'MaterialList'
@@ -244,7 +245,7 @@ const handleClose = () => {
   emit('close')
 };
 
-// 新增:移除标签方法
+// 移除标签方法
 const removeTag = (material: MaterialApi.MaterialVO) => {
   // 从已选列表中移除
   const index = selectedRows.value.findIndex(item => item.id === material.id);
@@ -329,7 +330,7 @@ const getTextWidth = (text: string) => {
 
 // 生成行唯一标识
 const rowKey = (row: any) => {
-  return `${row.id}-${Date.now()}`; // 确保行更新时重新渲染
+  return `${row.id}`; // 确保行更新时重新渲染
 };
 
 // 确认选择
@@ -433,7 +434,7 @@ onUnmounted(() => {
   }
 }
 
-/* 新增表格容器样式 */
+/* 表格容器样式 */
 .table-container {
   width: 100%;
   overflow-x: auto;
@@ -485,4 +486,16 @@ onUnmounted(() => {
   width: 95% !important; /* 保留5%空间避免溢出 */
 }
 
+/* 确保输入框获得焦点时保持可见 */
+:deep(.el-input__inner:focus) {
+  border-color: #409eff !important;
+  box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2) !important;
+}
+
+/* 输入框获得焦点时提升层级 */
+.quantity-input:deep(.el-input__inner) {
+  position: relative;
+  z-index: 2;
+}
+
 </style>