2026-03-10

属性变动增加【置空】

src/views/modules/shopOrder/productionReport/searchSfdcRollsReport.vue

@@ -207,27 +207,71 @@
     </el-pagination>
     <Chooselist ref="baseList"  @getBaseData="getBaseData"></Chooselist>
     <!-- 属性变动对话框 -->
-    <el-dialog title="属性变动" :close-on-click-modal="false" v-drag :visible.sync="attributeChangeDialogVisible" width="450px">
+    <el-dialog title="属性变动" :close-on-click-modal="false" v-drag :visible.sync="attributeChangeDialogVisible" width="480px">
       <el-form :model="attributeChangeForm" label-position="top" style="margin-top: -5px;">
         <el-row :gutter="20">
           <el-col :span="24">
             <el-form-item label="上级标签号">
-              <el-input v-model="attributeChangeForm.parentRollNo" placeholder="请输入上级标签号"></el-input>
+              <div class="attr-input-row">
+                <el-input
+                  v-model="attributeChangeForm.parentRollNo"
+                  placeholder="请输入上级标签号"
+                  :disabled="attributeClearFlags.parentRollNo"
+                  :class="{ 'is-cleared': attributeClearFlags.parentRollNo }">
+                </el-input>
+                <el-button
+                  size="small"
+                  :type="attributeClearFlags.parentRollNo ? 'warning' : 'default'"
+                  class="clear-btn"
+                  @click="toggleClear('parentRollNo')">
+                  {{ attributeClearFlags.parentRollNo ? '取消置空' : '置空' }}
+                </el-button>
+              </div>
             </el-form-item>
           </el-col>
           <el-col :span="24">
             <el-form-item label="合约号码">
-              <el-input v-model="attributeChangeForm.batchNo" placeholder="请输入合约号码"></el-input>
+              <div class="attr-input-row">
+                <el-input
+                  v-model="attributeChangeForm.batchNo"
+                  placeholder="请输入合约号码"
+                  :disabled="attributeClearFlags.batchNo"
+                  :class="{ 'is-cleared': attributeClearFlags.batchNo }">
+                </el-input>
+                <el-button
+                  size="small"
+                  :type="attributeClearFlags.batchNo ? 'warning' : 'default'"
+                  class="clear-btn"
+                  @click="toggleClear('batchNo')">
+                  {{ attributeClearFlags.batchNo ? '取消置空' : '置空' }}
+                </el-button>
+              </div>
             </el-form-item>
           </el-col>
           <el-col :span="24">
             <el-form-item label="备注说明">
-              <el-input type="textarea" :rows="3" v-model="attributeChangeForm.remark" placeholder="请输入备注说明"></el-input>
+              <div class="attr-input-row attr-input-row--textarea">
+                <el-input
+                  type="textarea"
+                  :rows="3"
+                  v-model="attributeChangeForm.remark"
+                  placeholder="请输入备注说明"
+                  :disabled="attributeClearFlags.remark"
+                  :class="{ 'is-cleared': attributeClearFlags.remark }">
+                </el-input>
+                <el-button
+                  size="small"
+                  :type="attributeClearFlags.remark ? 'warning' : 'default'"
+                  class="clear-btn"
+                  @click="toggleClear('remark')">
+                  {{ attributeClearFlags.remark ? '取消置空' : '置空' }}
+                </el-button>
+              </div>
             </el-form-item>
           </el-col>
         </el-row>
       </el-form>
-      <el-footer style="height:35px;margin-top: 55px;text-align:center">
+      <el-footer style="height:35px;margin-top: 60px;text-align:center">
         <el-button type="success" @click="saveAttributeChange()">保存</el-button>
         <el-button type="primary" @click="attributeChangeDialogVisible=false">关闭</el-button>
       </el-footer>
@@ -518,6 +562,11 @@ import labelPrintTemplates from '@/mixins/labelPrintTemplates.js';
           batchNo: '',
           remark: ''
         },
+        attributeClearFlags: {
+          parentRollNo: false,
+          batchNo: false,
+          remark: false
+        },
         searchExpanded: true,
         searchData: {
           site:'',
@@ -1348,24 +1397,38 @@ import labelPrintTemplates from '@/mixins/labelPrintTemplates.js';
           this.$message.warning(`标签号 ${rollNos} 状态为"已入库"或"已消耗"，不允许属性变动！`);
           return false;
         }
-        // 重置表单
+        // 重置表单及置空标志
         this.attributeChangeForm = {
           parentRollNo: '',
           batchNo: '',
           remark: ''
         };
+        this.attributeClearFlags = {
+          parentRollNo: false,
+          batchNo: false,
+          remark: false
+        };
         this.attributeChangeDialogVisible = true;
       },
+      toggleClear(field) {
+        this.attributeClearFlags[field] = !this.attributeClearFlags[field];
+        if (this.attributeClearFlags[field]) {
+          this.attributeChangeForm[field] = '';
+        }
+      },
       saveAttributeChange(){
-        // 构建更新数据列表
+        // 构建更新数据列表，置空标志为 true 时对应字段传 null
         const updateList = this.selectionDataList.map(item => {
           return {
             site: item.site,
             rollNo: item.rollNo,
             orderNo: item.orderNo,
-            parentRollNo: this.attributeChangeForm.parentRollNo,
-            batchNo: this.attributeChangeForm.batchNo,
-            remark: this.attributeChangeForm.remark
+            parentRollNo: this.attributeClearFlags.parentRollNo ? null : this.attributeChangeForm.parentRollNo,
+            batchNo: this.attributeClearFlags.batchNo ? null : this.attributeChangeForm.batchNo,
+            remark: this.attributeClearFlags.remark ? null : this.attributeChangeForm.remark,
+            parentRollNoClear: this.attributeClearFlags.parentRollNo,
+            batchNoClear: this.attributeClearFlags.batchNo,
+            remarkClear: this.attributeClearFlags.remark
           }
         })
         updateSfdcRollsAttribute(updateList).then(({data}) => {
@@ -1752,6 +1815,46 @@ import labelPrintTemplates from '@/mixins/labelPrintTemplates.js';
   padding-top: 0;
 }
 
+/* 属性变动 - 输入框+置空按钮行 */
+.attr-input-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.attr-input-row--textarea {
+  align-items: flex-start;
+}
+
+.attr-input-row .el-input {
+  flex: 1;
+}
+
+.attr-input-row .el-textarea {
+  flex: 1;
+}
+
+.clear-btn {
+  flex-shrink: 0;
+  min-width: 72px;
+}
+
+/* 置空状态输入框样式 */
+.attr-input-row .is-cleared /deep/ .el-input__inner,
+.attr-input-row .is-cleared /deep/ .el-textarea__inner {
+  background-color: #fef6ec;
+  border-color: #f5a623;
+  color: #999;
+  text-decoration: line-through;
+}
+
+.clear-tip {
+  margin-top: 4px;
+  font-size: 12px;
+  color: #e6a23c;
+  line-height: 1.5;
+}
+
 /* 标签打印对话框样式 */
 .print-dialog {
   /deep/ .el-dialog__header {