|
|
@@ -454,12 +454,23 @@
|
|
|
</el-table-column>
|
|
|
<el-table-column label="物料名称" align="center" prop="materialName" >
|
|
|
<template #default="{ row }">
|
|
|
- <el-input
|
|
|
+ <!-- 新增物料行：显示tooltip和必填红色边框 -->
|
|
|
+ <el-tooltip
|
|
|
v-if="row.isNew"
|
|
|
+ effect="warning"
|
|
|
+ content="必填项"
|
|
|
+ placement="top"
|
|
|
+ :disabled="row.materialName?.trim()"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
v-model="row.materialName"
|
|
|
- placeholder="请输入物料名称"
|
|
|
+ placeholder="请输入物料名称（必填）"
|
|
|
style="width: 100%"
|
|
|
+ :class="{ 'is-required-input': row.isNew && !row.materialName?.trim() }"
|
|
|
+ :disabled="isMaterialDisabled(row)"
|
|
|
/>
|
|
|
+ </el-tooltip>
|
|
|
+ <!-- 非新增行：正常显示 -->
|
|
|
<span v-else>{{ row.materialName }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
@@ -493,7 +504,28 @@
|
|
|
</el-table-column>
|
|
|
<el-table-column label="消耗数量" align="center" prop="quantity" width="120px">
|
|
|
<template #default="{ row }">
|
|
|
+ <!-- 新增物料行：显示tooltip、必填红色边框、禁止输入0 -->
|
|
|
+ <el-tooltip
|
|
|
+ v-if="row.isNew"
|
|
|
+ effect="warning"
|
|
|
+ content="必填项，需大于0"
|
|
|
+ placement="top"
|
|
|
+ :disabled="row.quantity > 0"
|
|
|
+ >
|
|
|
<el-input-number
|
|
|
+ v-model="row.quantity"
|
|
|
+ :precision="4"
|
|
|
+ :min="1"
|
|
|
+ :controls="false"
|
|
|
+ style="width: 100%"
|
|
|
+ :class="{ 'is-required-input': row.isNew && row.quantity <= 0 }"
|
|
|
+ :disabled="isMaterialDisabled(row)"
|
|
|
+ placeholder="请输入（必填）"
|
|
|
+ />
|
|
|
+ </el-tooltip>
|
|
|
+ <!-- 非新增行：正常显示 -->
|
|
|
+ <el-input-number
|
|
|
+ v-else
|
|
|
v-model="row.quantity"
|
|
|
:precision="4"
|
|
|
:min="0"
|
|
|
@@ -2435,4 +2467,33 @@ const handleRowClick = (row) => {
|
|
|
border: 1px solid #dcdfe6 !important;
|
|
|
}
|
|
|
|
|
|
+/* 必填输入框红色边框样式（含hover状态） */
|
|
|
+:deep(.is-required-input .el-input__inner) {
|
|
|
+ border-color: #f56c6c !important; /* Element错误色 */
|
|
|
+ box-shadow: 0 0 0 1px rgba(227, 59, 59, 0.2) !important; /* 错误阴影 */
|
|
|
+}
|
|
|
+:deep(.is-required-input .el-input-number__input) {
|
|
|
+ border-color: #f56c6c !important;
|
|
|
+ box-shadow: 0 0 0 1px rgba(238, 85, 85, 0.2) !important;
|
|
|
+}
|
|
|
+
|
|
|
+/* 鼠标悬停时保持红色边框（覆盖Element默认hover样式） */
|
|
|
+:deep(.is-required-input .el-input__inner:hover) {
|
|
|
+ border-color: #f56c6c !important;
|
|
|
+}
|
|
|
+:deep(.is-required-input .el-input-number__input:hover) {
|
|
|
+ border-color: #f56c6c !important;
|
|
|
+}
|
|
|
+
|
|
|
+/* Tooltip提示样式优化 */
|
|
|
+:deep(.el-tooltip__popper.is-warning) {
|
|
|
+ background-color: #fff3cd !important;
|
|
|
+ border-color: #ffeeba !important;
|
|
|
+ color: #856404 !important;
|
|
|
+}
|
|
|
+:deep(.el-tooltip__popper.is-warning .el-tooltip__arrow) {
|
|
|
+ border-top-color: #ffeeba !important;
|
|
|
+ border-bottom-color: #ffeeba !important;
|
|
|
+}
|
|
|
+
|
|
|
</style>
|
zhangcl