feat: 手动关联

src/plugins/KeyScaner.js

@@ -50,7 +50,7 @@ const KeyScaner = /** @class */ (function () {
         } else {
             if (ev.key.length == 1) {
                 var charCode = ev.key.charCodeAt(0);
-                console.log("key="+charCode);
+                // console.log("key="+charCode);
                 if (charCode >= 48 && charCode <= 57) {
                     if (ev.altKey) {
                         this.altBuf.push(ev.key);

src/views/collect/relCode/operateRelCode.vue

@@ -12,14 +12,18 @@
             <el-button-group
               style="display: flex; margin-top: 5px; float: right"
             >
+              <el-button size="mini" type="primary" @click.native="giveUp()" :loading="submitLoading"
+                         style="margin-right: 8px;border-radius: 5%;"
+              >放弃
+              </el-button>
               <el-button size="mini" type="primary" @click.native="submit()" :loading="submitLoading"
                         style="margin-right: 8px;border-radius: 5%;"
-              >添加草稿
+              >保存
-              </el-button>  
+              </el-button>
               <el-button size="mini" type="primary" @click.native="submit()" :loading="submitLoading"
                          style="margin-right: 8px;border-radius: 5%;"
-              >添加完成
+              >提交
-              </el-button>        
+              </el-button>
             </el-button-group>
           </el-row>
           <el-row>
@@ -95,6 +99,7 @@
                   v-model="relFormData.batchNo"
                   auto-complete="off"
                   style="width: 90%"
+                  :disabled="this.parentCode"
                   clearable
                 ></el-input>
               </el-form-item>
@@ -108,6 +113,7 @@
                   clearable
                   value-format="yyyy-MM-dd HH:mm:ss"
                   style="width: 90%"
+                  :disabled="this.parentCode"
                 >
                 </el-date-picker>
               </el-form-item>
@@ -121,6 +127,7 @@
                   clearable
                   value-format="yyyy-MM-dd HH:mm:ss"
                   style="width: 90%"
+                  :disabled="this.parentCode"
                 >
                 </el-date-picker>
               </el-form-item>
@@ -133,6 +140,7 @@
                   clearable
                   style="width: 90%"
                   placeholder="请输入备注"
+                  :disabled="this.parentCode"
                 ></el-input>
               </el-form-item>
             </el-col>
@@ -165,7 +173,7 @@
               </el-button-group>
             </el-col>
           </el-row>
-  
+
           <el-alert
             title="扫码结果:"
             :type="scanResultType"
@@ -196,8 +204,8 @@
             <span><strong>父级编码：{{ parentCode || '暂未录入'}}</strong> <strong>  (<span style="color: #FF0000;">{{ syxjsl || 0}}</span>/<span >{{ bhxjsl || 0}}</span>)</strong></span>
           </div>
           <div>
-              <el-table v-loading="loading" 
+              <el-table v-loading="loading"
-              :data="detailList" 
+              :data="detailList"
               style="width: 100%;" max-height="350" height="350"
               border
               :row-style="rowStyle"
@@ -210,7 +218,7 @@
             </div>
         </el-tab-pane>
       </el-tabs>
-      
+
       <el-dialog
         :title="title"
         :visible.sync="popDialogVisible"
@@ -220,46 +228,28 @@
         v-if="popDialogVisible"
         @close='popCloseDialog'
       >
-      <popRelCode
+      <sonRelCode
-          :popCloseDialog="popCloseDialog"
+          :closeDialog="this.popCloseDialog"
-          :popParentCode="popParentCode"
+          :opeParentCode="this.popParentCode"
-          :popRelFormData ="popRelFormData"
+          :opeRelFormData ="this.popRelFormData"
-      ></popRelCode>
+      ></sonRelCode>
     </el-dialog>
     </div>
   </template>
-  
+
   <script>
   import {enterCodeWeb} from "@/api/inout/order";
   import {addRelCode,scanCodeRelCode} from "@/api/collect/relCode";
-  import popRelCode from './popRelCode.vue';
+  import sonRelCode from './sonRelCode.vue';
   import A from "@/plugins/KeyScaner";
   export default {
     name: "operateRelCode",
     props: {
-      closeDialog: {
-        type: Function,
-        required: true,
-      },
       orderQuery: {
         type: Object,
         required: true,
-        default: {}
+        default: null
-      },
-      resetKey: {
-        type: Function,
-        required: true
       },
-      opeParentCode:{
-        type: String,
-        required: true,
-        default: ""
-      },
-      opeRelFormData:{
-        type: Object,
-        required: true,
-        default: {}
-      }
     },
     watch: {
       resetKey(newVal, oldVal) {
@@ -268,13 +258,6 @@
     },
     data() {
       return {
-        userInfo: {
-          inv: this.$store.getters.locInvName,
-          deptName: this.$store.getters.locDeptName,
-          userName: this.$store.getters.name,
-          userId: this.$store.getters.userId,
-          companyName: this.$store.getters.companyName,
-        },
         //扫码相关
         codeFormData: {
           code: "",
@@ -296,6 +279,9 @@
           workShop: null,
           lineName: null,
           lineManager: null,
+          packUnit: null,
+          bhxjsl: null,
+          packLayer: null,
           detailList:[]
         },
         detailList: [],
@@ -303,27 +289,15 @@
         errView: 0,
         actionEnable: false,
         formRules: {
-          // productCode: [
-          //   {required: true, message: "请输入产品编号", trigger: "blur"},
-          // ],
-          // subTypeNo: [
-          //   {required: true, message: "请输入类型编号", trigger: "blur"},
-          // ],
-          // cascadeRatio: [
-          //   {required: true, message: "请输入包装比例", trigger: "change"},
-          // ],
-          // packageSpec: [
-          //   {required: true, message: "请输入包装规格", trigger: "change"},
-          // ],
           batchNo: [
-            {required: true, message: "请输入批次号", trigger: "blur"},
+            {required: true, message: " ", trigger: "blur"},
           ],
           madeDate: [
-            {required: true, message: "请选入生产日期", trigger: "blur"},
+            {required: true, message: " ", trigger: "blur"},
           ],
           validateDate: [
-            {required: true, message: "请选入有效日期", trigger: "blur"},
+            {required: true, message: " ", trigger: "blur"},
-          ],      
+          ],
         },
         isScan: true,
         scanText: "扫码录入：",
@@ -358,15 +332,31 @@
         parentCode:null,
         bhxjsl:0,
         syxjsl:0,
+        packLayer: null,
         popDialogVisible:false,
         title:null,
         popParentCode:null,
-        popRelFormData:null,
+        popRelFormData:{
+          productCode: null,
+          subTypeNo: null,
+          cascadeRatio: null,
+          packageSpec: null,
+          comment: null,
+          batchNo: null,
+          madeDate: null,
+          validateDate: null,
+          workShop: null,
+          lineName: null,
+          lineManager: null,
+          packUnit: null,
+          bhxjsl: null,
+          detailList:[]
+        },
         popLevel:1,
       };
     },
     components: {
-      popRelCode
+      sonRelCode
     },
     methods: {
       splitChange() {
@@ -374,15 +364,39 @@
       },
       popCloseDialog() {
         this.popDialogVisible = false;
-        //清空
+        this.$refs.inputRef.focus();
-        this.detailList = [];
+
-        this.bhxjsl = 0;
+        if( this.bhxjsl === this.syxjsl){
-        this.syxjsl = 0;
+          this.$confirm("该层级已录入完成, 是否关闭?", "提示", {
-        this.parentCode = null
+            confirmButtonText: "确定",
-        
+            cancelButtonText: "取消",
+            type: "warning",
+          })
+            .then(() => {
+              this.relFormData.detailList = this.detailList
+              this.submit()
+            })
+            .catch(() => {
+            });
+        }
+
       },
       //添加条码
       addCode() {
+        //控制三期
+        if (this.relFormData.batchNo == null) {
+          this.$message.warning("请输入批次号！");
+          return;
+        }
+        if (this.relFormData.madeDate == null) {
+          this.$message.warning("请选择生产日期！");
+          return;
+        }
+        if (this.relFormData.validateDate == null) {
+          this.$message.warning("请选择失效日期！");
+          return;
+        }
+
         let tQuery = Object.assign(this.codeFormData);
         tQuery.curCode = this.codeFormData.code;
         tQuery.parentCode = this.parentCode;
@@ -393,32 +407,113 @@
             this.isSuccess = true;
             let data = response.data;
             if(data !== null){
-              if(this.detailList.some(item => item.curCode === data.curCode)) {
+              //1.确定是否为最大层级
-                //码重复提示
+              if (this.parentCode == null){
-                this.$message.warning("录入码重复！");
+                if (data.packLayer == 1) {
-              } else {
+                  this.$message.warning("该层级为最小包装层级无需进行码关联操作！");
-                if( this.bhxjsl !=0 && this.syxjsl != 0 && this.bhxjsl === this.syxjsl){
-                  //满了自动保存
-                  this.$message.warning("包含下级码已录满！");
                   return;
                 }
-                this.detailList.push(data);
+                this.relFormData.cpmctymc = data.cpmctymc;
-                //存在一个父级关联需-1
+                this.relFormData.productCode = data.productCode;
-                this.syxjsl = this.detailList.length - 1;
+                this.relFormData.subTypeNo = data.subTypeNo;
-              }
+                this.relFormData.cascadeRatio = data.cascadeRatio;
-              //判断是否是下级 
+                this.relFormData.bhxjsl = data.bhxjsl;
-              if(data.packLayer > 1){
+                this.relFormData.packageSpec = data.packageSpec;
-                this.relFormData = data;
+                this.relFormData.packLayer = data.packLayer;
+                this.relFormData.packUnit = data.packUnit;
+                this.relFormData.workShop = data.workShop;
+                this.relFormData.lineName = data.lineName;
+                this.relFormData.lineManager = data.lineManager;
+
                 this.parentCode = data.curCode;
                 this.bhxjsl = data.bhxjsl;
-                //弹框
+                this.detailList = [];
-                this.popDialogVisible = true;
+              }else {
-                this.popRelFormData = data;
+                if(this.detailList.some(item => item.curCode === data.curCode)) {
-                this.title = "手工关联:" + data.curCode;
+                  //码重复提示
-                this.popParentCode = data.curCode;
+                  this.$message.warning("录入码重复！");
+                  return;
+                } else {
+                  if(this.bhxjsl === this.syxjsl){
+                    //满了自动保存
+                    this.$message.warning("包含下级码已录满！");
+                    return;
+                  }
+                }
+
+                //判断是否是下级
+                if(data.packLayer == this.relFormData.packLayer) {
+                  //非当前编码的子层级码 是否进行替换操作
+                  this.$confirm("非当前编码的子层级码,是否进行替换操作?", "提示", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning",
+                  }).then(() => {
+                    this.relFormData.cpmctymc = data.cpmctymc;
+                    this.relFormData.productCode = data.productCode;
+                    this.relFormData.subTypeNo = data.subTypeNo;
+                    this.relFormData.cascadeRatio = data.cascadeRatio;
+                    this.relFormData.bhxjsl = data.bhxjsl;
+                    this.relFormData.packageSpec = data.packageSpec;
+                    this.relFormData.packLayer = data.packLayer;
+                    this.relFormData.packUnit = data.packUnit;
+                    this.relFormData.workShop = data.workShop;
+                    this.relFormData.lineName = data.lineName;
+                    this.relFormData.lineManager = data.lineManager;
+
+                    this.parentCode = data.curCode;
+                    this.bhxjsl = data.bhxjsl;
+                    this.detailList = [];
+                    })
+                    .catch(() => {
+                      return;
+                    });
+                }else if(data.packLayer == (this.relFormData.packLayer-1) ) {
+                  //下级码
+                  this.detailList.push(data);
+                  this.syxjsl = this.detailList.length;
+
+                  //判断是否还有下级码 如果有进行弹窗 关联
+                  if (data.packLayer > 1 && data.bhxjsl > 0){
+                    this.popRelFormData.cpmctymc = data.cpmctymc;
+                    this.popRelFormData.productCode = data.productCode;
+                    this.popRelFormData.subTypeNo = data.subTypeNo;
+                    this.popRelFormData.cascadeRatio = data.cascadeRatio;
+                    this.popRelFormData.bhxjsl = data.bhxjsl;
+                    this.popRelFormData.packageSpec = data.packageSpec;
+                    this.popRelFormData.packLayer = data.packLayer;
+                    this.popRelFormData.packUnit = data.packUnit;
+                    this.popRelFormData.workShop = data.workShop;
+                    this.popRelFormData.lineName = data.lineName;
+                    this.popRelFormData.lineManager = data.lineManager;
+
+                    this.popRelFormData.comment = this.relFormData.comment;
+                    this.popRelFormData.batchNo = this.relFormData.batchNo;
+                    this.popRelFormData.madeDate = this.relFormData.madeDate;
+                    this.popRelFormData.validateDate = this.relFormData.validateDate;
+
+                    this.popDialogVisible = true;
+                    this.title = "手工关联:" + data.curCode;
+                    this.popParentCode = data.curCode;
+                  }else {
+
+                    if( this.bhxjsl === this.syxjsl){
+                      this.$confirm("该层级已录入完成, 是否关闭?", "提示", {
+                        confirmButtonText: "确定",
+                        cancelButtonText: "取消",
+                        type: "warning",
+                      })
+                        .then(() => {
+                          this.relFormData.detailList = this.detailList
+                          this.submit()
+                        })
+                        .catch(() => {
+                        });
+                    }
+                  }
+                }
+              }
               }
-            }
-            
           }else{
             this.$message.error(response.message);
           }
@@ -433,7 +528,29 @@
         this.warnVisible = false;
         this.errVisible = false;
       },
-  
+      giveUp() {
+        this.relFormData = {
+          productCode: null,
+          subTypeNo: null,
+          cascadeRatio: null,
+          packageSpec: null,
+          comment: null,
+          batchNo: null,
+          madeDate: null,
+          validateDate: null,
+          workShop: null,
+          lineName: null,
+          lineManager: null,
+          packUnit: null,
+          bhxjsl: null,
+          detailList: []
+        }
+        this.detailList = []
+        this.parentCode = null
+        this.bhxjsl = 0
+        this.syxjsl = 0
+        this.packLayer = null
+      },
       submit(val) {
         if(this.detailList == null || this.detailList.length == 0){
           this.$message.warning("请先录入关联码！");
@@ -452,7 +569,11 @@
           return;
         }
         this.loading = true;
-        this.relFormData.detailList = this.detailList;
+
+        this.$set(this.relFormData, 'detailList', []);
+        this.detailList.forEach( item =>{
+          this.relFormData.detailList.push(item)
+        });
         addRelCode(this.relFormData).then((response) => {
           this.loading = false;
           if (response.code === 20000) {
@@ -466,7 +587,7 @@
           this.loading = false;
           this.clearRel();
         });
-  
+
       },
       // 刷新表单
       resetForm() {
@@ -483,7 +604,7 @@
         this.result = "";
         this.warnVisible = false;
         this.errVisible = false;
-  
+
         this.checkSuccess = true;
         this.codeFormData.code = this.scanCode.trim();
         let tQuery = {
@@ -546,11 +667,11 @@
           }
           this.loading = false;
         });
-  
+
       },
       printCodeResult(data, isSuccess) {
         const resultParts = ["扫码解析结果：" + data.code];
-  
+
         if (data.udi) {
           resultParts.push("层级标识: " + data.udi);
         }
@@ -571,8 +692,8 @@
       getInputFocus(event) {
         event.currentTarget.select();
       },
-  
+
-      clearRel() {        
+      clearRel() {
         this.relFormData = {
           productCode: null,
           subTypeNo: null,
@@ -597,16 +718,11 @@
         this.refreshCodesPanel()
       },
       init(){
-        if(this.opeParentCode !== ""){
+        if(this.orderQuery != null){
-          this.parentCode = this.opeParentCode;
+          this.relFormData = this.orderQuery;
-        }
+          this.bhxjsl = this.orderQuery.bhxjsl;
-        if(JSON.stringify(this.opeRelFormData) !=="{}"){
-          this.relFormData = this.opeRelFormData;
-          this.detailList.push(this.relFormData);
-          this.bhxjsl = this.relFormData.bhxjsl;
         }
       }
-  
     },
     filters: {},
     mounted() {
@@ -637,15 +753,15 @@
       this.$refs.inputRef.focus();
     },
     beforeDestroy() {
-      
+
     },
     created() {
       this.init();
     },
   };
   </script>
-  
+
-  
+
   <style scoped>
   .scroll-alert {
     width: 100%; /* 或者你需要的宽度 */
@@ -657,13 +773,13 @@
     padding: 10px;
     position: relative;
   }
-  
+
   .scroll-text {
     display: inline-block;
     padding-left: 100%; /* 初始位置在容器右侧 */
     animation: scroll 10s linear infinite; /* 滚动动画 */
   }
-  
+
   @keyframes scroll {
     from {
       transform: translateX(0);
@@ -672,12 +788,12 @@
       transform: translateX(-100%);
     }
   }
-  
+
   .query-form-item {
     margin-right: 5px;
     margin-bottom: 6px;
   }
-  
+
   #inputer {
     width: 100%;
     min-height: 30px;
@@ -687,7 +803,7 @@
     border-width: 0.1px;
     color: #4a4a4a;
   }
-  
+
   #inputer:focus {
     width: 100%;
     min-height: 30px;
@@ -697,11 +813,11 @@
     border-width: 0.1px;
     color: #4a4a4a;
   }
-  
+
   .ime-disabled {
     ime-mode: disabled;
   }
-  
+
   .result-display {
     border: 2px solid #ccc; /* 默认外框颜色 */
     border-radius: 10px;
@@ -711,33 +827,32 @@
     padding-left: 25px;
     /* 不设置背景颜色 */
   }
-  
+
   .result-success {
     border-color: #4CAF50; /* 成功时外框颜色 */
   }
-  
+
   .result-failure {
     border-color: #0080ff; /* 失败时外框颜色 */
   }
-  
+
   .result-text {
     height: 18px;
     /* 你可以在这里设置默认的文本颜色或其他样式 */
   }
-  
+
   .result-text-success {
     color: #4CAF50; /* 成功时文本颜色 */
     font-size: 14px;
   }
-  
+
   .result-text-failure {
     color: #0080ff; /* 失败时文本颜色 */
     font-size: 14px;
   }
-  
+
   .mar-left {
     margin-left: 20px;
   }
   </style>
-  
+
-  

src/views/collect/relCode/popRelCode.vue

@@ -1,62 +0,0 @@
-<template>
-    <div>
-    <operateRelCode
-    :opeParentCode="parentCode"
-    :opeRelFormData="relFormData"
-    ></operateRelCode>
-    </div>
-  </template>
-  
-  <script>
-  
-  import operateRelCode from "./operateRelCode"
-  
-  export default {
-    name: "popRelCode",
-    props: {
-      popCloseDialog: {
-        type: Function,
-        required: true,
-      },
-      popParentCode: {
-        type: String,
-        required: true,
-        default: ""
-      },
-      popRelFormData:{
-        type: Object,
-        required: true,
-        default: {}
-      }
-  
-    },
-    components: {
-        operateRelCode
-    },
-    data() {
-      return {
-        parentCode:"",
-        relFormData:{}
-      }
-    },
-    methods: {
-      init(){
-        if(this.popParentCode !==""){
-            this.parentCode = this.popParentCode;
-        }
-        if(JSON.stringify(this.popRelFormData) !== "{}"){
-            this.relFormData = this.popRelFormData;
-        }
-      }
-    },
-    created() {
-        this.init();
-    }
-  
-  }
-  </script>
-  
-  <style scoped>
-  
-  </style>
-  

src/views/collect/relCode/sonRelCode.vue

@@ -0,0 +1,745 @@
+<template>
+    <div>
+      <el-form
+        :model="relFormData"
+        :rules="formRules"
+        ref="dataForm"
+        @submit.native.prevent
+        label-width="110px"
+      >
+        <el-card>
+          <el-row style="margin-bottom: 8px">
+            <el-button-group
+              style="display: flex; margin-top: 5px; float: right"
+            >
+              <el-button size="mini" type="primary" @click.native="giveUp()" :loading="submitLoading"
+                         style="margin-right: 8px;border-radius: 5%;"
+              >放弃
+              </el-button>
+              <el-button size="mini" type="primary" @click.native="submit()" :loading="submitLoading"
+                         style="margin-right: 8px;border-radius: 5%;"
+              >保存
+              </el-button>
+              <el-button size="mini" type="primary" @click.native="submit()" :loading="submitLoading"
+                         style="margin-right: 8px;border-radius: 5%;"
+              >提交
+              </el-button>
+            </el-button-group>
+          </el-row>
+          <el-row>
+            <el-col :span="11">
+              <el-form-item prop="cpmctymc" class="query-form-item" label="产品名称:">
+                <el-input
+                  v-model="relFormData.cpmctymc"
+                  auto-complete="off"
+                  style="width: 90%"
+                  :disabled="true"
+                  clearable
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="packageSpec" class="query-form-item" label="规格型号:">
+                <el-input
+                  v-model="relFormData.packageSpec"
+                  auto-complete="off"
+                  style="width: 90%"
+                  :disabled="true"
+                  clearable
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="productCode" class="query-form-item" label="产品编码:">
+                <el-input
+                  v-model="relFormData.productCode"
+                  auto-complete="off"
+                  style="width: 90%"
+                  :disabled="true"
+                  clearable
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="cascadeRatio" class="query-form-item" label="包装比例:">
+                <el-input
+                  v-model="relFormData.cascadeRatio"
+                  auto-complete="off"
+                  style="width: 90%"
+                  :disabled="true"
+                  clearable
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="packLayer" class="query-form-item" label="当前层级:">
+                <el-input
+                  v-model="relFormData.packLayer"
+                  auto-complete="off"
+                  style="width: 90%"
+                  :disabled="true"
+                  clearable
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="packUnit" class="query-form-item" label="层级单位:">
+                <el-input
+                  v-model="relFormData.packUnit"
+                  auto-complete="off"
+                  style="width: 90%"
+                  :disabled="true"
+                  clearable
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="batchNo" class="query-form-item" label="批次号:">
+                <el-input
+                  v-model="relFormData.batchNo"
+                  auto-complete="off"
+                  style="width: 90%"
+                  :disabled="true"
+                  clearable
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="madeDate" class="query-form-item" label="生产日期:">
+                <el-date-picker
+                  v-model="relFormData.madeDate"
+                  type="datetime"
+                  placeholder="日期"
+                  clearable
+                  value-format="yyyy-MM-dd HH:mm:ss"
+                  style="width: 90%"
+                  :disabled="true"
+                >
+                </el-date-picker>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="validateDate" class="query-form-item" label="失效日期:">
+                <el-date-picker
+                  v-model="relFormData.validateDate"
+                  type="datetime"
+                  placeholder="日期"
+                  clearable
+                  value-format="yyyy-MM-dd HH:mm:ss"
+                  style="width: 90%"
+                  :disabled="true"
+                >
+                </el-date-picker>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item prop="comment" class="query-form-item" label="备注:">
+                <el-input
+                  v-model="relFormData.comment"
+                  auto-complete="off"
+                  clearable
+                  style="width: 90%"
+                  placeholder="请输入备注"
+                  :disabled="true"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-divider></el-divider>
+          <el-row>
+            <el-col :span="18">
+              <el-form-item prop="code" label="扫码录入:">
+                <el-input
+                  id="inputer"
+                  @focus="getInputFocus($event)"
+                  @keypress.enter.native="enterKey($event)"
+                  ref="inputRef"
+                  style="ime-mode: disabled"
+                  type="tel"
+                  placeholder="请点击输入框进行扫码设置或者扫码录入"
+                  v-model="scanCode"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-button-group>
+                <el-button
+                  type="primary"
+                  size="mini"
+                  @click.native.stop="enterKey()"
+                  style="margin-left: 15px"
+                >添加
+                </el-button>
+              </el-button-group>
+            </el-col>
+          </el-row>
+
+          <el-alert
+            title="扫码结果:"
+            :type="scanResultType"
+            :closable="false"
+            :description="result">
+          </el-alert>
+          <el-alert
+            v-if="warnVisible"
+            title="警告信息:"
+            type="warning"
+            :closable="true"
+            :dangerouslyUseHTMLString="true"
+            :description="warnResult">
+          </el-alert>
+          <el-alert
+            v-if="errVisible"
+            title="错误信息:"
+            type="warning"
+            :closable="true"
+            :dangerouslyUseHTMLString="true"
+            :description="errResult">
+          </el-alert>
+        </el-card>
+      </el-form>
+      <el-tabs type="border-card" style="margin: 15px">
+        <el-tab-pane label="关联详情">
+          <div>
+            <span><strong>父级编码：{{ parentCode || '暂未录入'}}</strong> <strong>  (<span style="color: #FF0000;">{{ syxjsl || 0}}</span>/<span >{{ bhxjsl || 0}}</span>)</strong></span>
+          </div>
+          <div>
+              <el-table v-loading="loading"
+              :data="detailList"
+              style="width: 100%;" max-height="350" height="350"
+              border
+              :row-style="rowStyle"
+              ref="multipleTable">
+                <el-table-column type="index" label="序号" width="50"></el-table-column>
+                <el-table-column label="追溯码" width="250" prop="curCode" show-overflow-tooltip></el-table-column>
+                <el-table-column label="层级" width="150" prop="packLayer" show-overflow-tooltip></el-table-column>
+                <el-table-column label="父级编码" width="250" prop="parentCode" show-overflow-tooltip></el-table-column>
+              </el-table>
+            </div>
+        </el-tab-pane>
+      </el-tabs>
+
+    </div>
+  </template>
+
+  <script>
+  import {enterCodeWeb} from "@/api/inout/order";
+  import {addRelCode,scanCodeRelCode} from "@/api/collect/relCode";
+  import A from "@/plugins/KeyScaner";
+  export default {
+    name: "operateRelCode",
+    props: {
+      closeDialog: {
+        type: Function,
+        required: true,
+      },
+      orderQuery: {
+        type: Object,
+        required: true,
+        default: null
+      },
+      resetKey: {
+        type: Function,
+        required: true
+      },
+      opeParentCode:{
+        type: String,
+        required: true,
+        default: null
+      },
+      opeRelFormData:{
+        type: Object,
+        required: true,
+        default: null
+      }
+    },
+    watch: {
+      resetKey(newVal, oldVal) {
+        this.$refs.inputRef.focus();
+      }
+    },
+    data() {
+      return {
+        //扫码相关
+        codeFormData: {
+          code: "",
+          batchNo: null,
+          produceDate: null,
+          expireDate: null,
+          serialNo: null,
+          relId: null,
+        },
+        relFormData: {
+          productCode: null,
+          subTypeNo: null,
+          cascadeRatio: null,
+          packageSpec: null,
+          comment: null,
+          batchNo: null,
+          madeDate: null,
+          validateDate: null,
+          workShop: null,
+          lineName: null,
+          lineManager: null,
+          packUnit: null,
+          bhxjsl: null,
+          detailList:[]
+        },
+        detailList: [],
+        checkPreInArray: [],
+        errView: 0,
+        actionEnable: false,
+        formRules: {
+          batchNo: [
+            {required: true, message: " ", trigger: "blur"},
+          ],
+          madeDate: [
+            {required: true, message: " ", trigger: "blur"},
+          ],
+          validateDate: [
+            {required: true, message: " ", trigger: "blur"},
+          ],
+        },
+        isScan: true,
+        scanText: "扫码录入：",
+        corpOrderIdDisabled: false,
+        isSupVesion: false,
+        loading: false,
+        index: null,
+        formVisible: false,
+        deleteLoading: false,
+        orderNo: null,
+        fromStorageOptions: [],
+        curRow: null,
+        dialogTableVisible: false,
+        selectRlVisible: false,
+        selectSpaceVisible: false,
+        sitcomScan: false,
+        sictomText: "",
+        originCode: "",
+        checkSuccess: false,
+        codeDetail: null,
+        fromDeptOptions: [],
+        submitLoading: false,
+        scanCode: "",
+        isSuccess: false,
+        result: "",
+        scanResultType: "success",
+        splitType: null,
+        warnResult: "",
+        errResult: "",
+        warnVisible: false,
+        errVisible: false,
+        parentCode:null,
+        bhxjsl:0,
+        syxjsl:0,
+        popDialogVisible:false,
+        title:null,
+        popParentCode:null,
+        popRelFormData:null,
+        popLevel:1,
+      };
+    },
+    methods: {
+      splitChange() {
+        this.$refs.inputRef.focus();
+      },
+      handleDataSent(data){
+        // this.relFormData = data;
+        // console.log("00000",data)
+      },
+      popCloseDialog() {
+        this.popDialogVisible = false;
+      },
+      //添加条码
+      addCode() {
+        //控制三期
+        if (this.relFormData.batchNo == null) {
+          this.$message.warning("请输入批次号！");
+          return;
+        }
+        if (this.relFormData.madeDate == null) {
+          this.$message.warning("请选择生产日期！");
+          return;
+        }
+        if (this.relFormData.validateDate == null) {
+          this.$message.warning("请选择失效日期！");
+          return;
+        }
+
+        let tQuery = Object.assign(this.codeFormData);
+        tQuery.curCode = this.codeFormData.code;
+        tQuery.parentCode = this.parentCode;
+        scanCodeRelCode(tQuery).then((response) => {
+          if (response.code === 20000) {
+            this.$refs.inputRef.focus();
+            this.$refs.inputRef.select();
+            this.isSuccess = true;
+            let data = response.data;
+            if(data !== null){
+              if(this.detailList.some(item => item.curCode === data.curCode)) {
+                //码重复提示
+                this.$message.warning("录入码重复！");
+                return;
+              } else {
+                if( this.bhxjsl !=0 && this.syxjsl != 0 && this.bhxjsl === this.syxjsl){
+                  //满了自动保存
+                  this.$message.warning("包含下级码已录满！");
+                  return;
+                }
+
+                if (this.relFormData.productCode){
+                  this.detailList.push(data);
+                }
+
+                //存在一个父级关联需-1
+                this.syxjsl = this.detailList.length;
+
+                if( this.bhxjsl === this.syxjsl){
+                    this.$confirm("该层级已录入完成, 是否关闭?", "提示", {
+                      confirmButtonText: "确定",
+                      cancelButtonText: "取消",
+                      type: "warning",
+                    })
+                      .then(() => {
+                        this.relFormData.detailList = this.detailList
+                        //触发保存 切换到上一级别
+                        this.submit()
+                        this.closeDialog()
+                      })
+                      .catch(() => {
+                      });
+                  }
+              }
+              //判断是否是下级
+              if(data.packLayer > 1){
+                this.relFormData.cpmctymc = data.cpmctymc;
+                this.relFormData.productCode = data.productCode;
+                  this.relFormData.subTypeNo = data.subTypeNo;
+                  this.relFormData.cascadeRatio = data.cascadeRatio;
+                  this.relFormData.bhxjsl = data.bhxjsl;
+                  this.relFormData.packageSpec = data.packageSpec;
+                  // this.relFormData.comment = data.comment;
+                  this.relFormData.packLayer = data.packLayer;
+                  this.relFormData.packUnit = data.packUnit;
+                  // this.relFormData.batchNo= data;
+                  // this.relFormData.madeDate= data;
+                  // this.relFormData.validateDate = data;
+                  this.relFormData.workShop = data.workShop;
+                  this.relFormData.lineName = data.lineName;
+                  this.relFormData.lineManager = data.lineManager;
+                  // this.relFormData.detailList:[]
+
+                // this.relFormData = data;
+                this.parentCode = data.curCode;
+                this.bhxjsl = data.bhxjsl;
+                //弹框
+                this.popDialogVisible = true;
+                this.popRelFormData =  this.relFormData;
+                this.title = "手工关联:" + data.curCode;
+                this.popParentCode = data.curCode;
+              }
+            }
+
+          }else{
+            this.$message.error(response.message);
+          }
+          this.loading = false;
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+      },
+
+      refreshCodesPanel() {
+        this.warnVisible = false;
+        this.errVisible = false;
+      },
+
+      submit() {
+        addRelCode(this.relFormData).then((response) => {
+          this.loading = false;
+          if (response.code === 20000) {
+            this.$message.success("保存成功！");
+            this.clearRel();
+          } else {
+            this.$message.error(response.message);
+          }
+        })
+        .catch(() => {
+          this.loading = false;
+          this.clearRel();
+        });
+
+      },
+      // 刷新表单
+      resetForm() {
+        if (this.$refs["dataForm"]) {
+          // 清空验证信息表单
+          this.$refs["dataForm"].clearValidate();
+          // 刷新表单
+          this.$refs["dataForm"].resetFields();
+        }
+      },
+      enterKey(event) {
+        this.warnResult = "";
+        this.errResult = "";
+        this.result = "";
+        this.warnVisible = false;
+        this.errVisible = false;
+
+        this.checkSuccess = true;
+        this.codeFormData.code = this.scanCode.trim();
+        let tQuery = {
+          originCode: this.originCode,
+          code: this.codeFormData.code.trim(),
+        };
+        enterCodeWeb(tQuery).then((response) => {
+          if (response.code === 20000) {
+            this.$refs.inputRef.focus();
+            this.$refs.inputRef.select();
+            this.isSuccess = true;
+            this.printCodeResult(response.data)
+            this.codeFormData.code = response.data.code;
+            this.scanCode = ""
+            this.addCode();
+          } else {
+            if (response.code == 502) {
+              this.checkSuccess = false;
+              this.isSuccess = false;
+              this.scanCode = ""
+              this.printCodeResult(response.data)
+              this.codeFormData.code = response.data.code;
+              this.originCode = this.codeFormData.code;
+            } else if (response.code == 501) {
+              this.checkSuccess = false;
+              this.scanCode = ""
+              this.$message.error(response.message);
+            } else if (response.code == 503) {
+              this.checkSuccess = false;
+              this.isSuccess = false;
+              this.scanCode = ""
+              this.printCodeResult(response.data)
+              this.codeFormData.code = response.data.code;
+              this.$confirm(response.message, "提示", {
+                type: "warning",
+              })
+                .then(() => {
+                  this.codeFormData.code = response.data.code;
+                  this.addCode();
+                })
+                .catch(() => {
+                  this.codeFormData.code = response.data.code;
+                });
+            } else if (response.code == 508) {
+              this.scanCode = ""
+              this.originCode = "";
+              this.codeFormData.code = "01" + response.data.nameCode;
+              this.originCode = this.codeFormData.code;
+            } else {
+              this.$alert(response.message, "提示", {
+                confirmButtonText: "确定",
+                type: "warning",
+                closeOnClickModal: true,
+                callback: (action) => {
+                  this.$refs.inputRef.focus();
+                  this.$refs.inputRef.select();
+                },
+              });
+            }
+          }
+          this.loading = false;
+        });
+
+      },
+      printCodeResult(data, isSuccess) {
+        const resultParts = ["扫码解析结果：" + data.code];
+
+        if (data.udi) {
+          resultParts.push("层级标识: " + data.udi);
+        }
+        if (data.batchNo) {
+          resultParts.push("批次号: " + data.batchNo);
+        }
+        if (data.produceDate) {
+          resultParts.push("生产日期: " + data.produceDate);
+        }
+        if (data.expireDate) {
+          resultParts.push("失效日期: " + data.expireDate);
+        }
+        if (data.serialNo) {
+          resultParts.push("序列号: " + data.serialNo);
+        }
+        this.result = resultParts.join(" , ");
+      },
+      getInputFocus(event) {
+        event.currentTarget.select();
+      },
+
+      clearRel() {
+        this.relFormData = {
+          productCode: null,
+          subTypeNo: null,
+          cascadeRatio: null,
+          packageSpec: null,
+          comment: null,
+          batchNo: null,
+          madeDate: null,
+          validateDate: null,
+          workShop: null,
+          lineName: null,
+          lineManager: null,
+          packUnit: null,
+          cpmctymc:null,
+        }
+        this.scanCode = "";
+        this.result = "";
+        this.detailList = [];
+        this.bhxjsl = 0;
+        this.syxjsl = 0;
+        this.parentCode = null;
+        this.refreshCodesPanel()
+      },
+      init(){
+        if(this.opeParentCode != null){
+          this.parentCode = this.opeParentCode;
+        }
+        if(this.opeRelFormData != null){
+          this.relFormData = this.opeRelFormData;
+          // this.detailList.push(this.relFormData);
+          this.bhxjsl = this.relFormData.bhxjsl;
+        }
+      }
+    },
+    filters: {},
+    mounted() {
+      document.body.ondrop = function (event) {
+        event.preventDefault();
+        event.stopPropagation();
+      };
+      var that = this;
+      var inputer = document.getElementById("inputer");
+      window.sc = new A.KeyScaner(inputer); //传入要监听的DOM节点
+      sc.onInput = function (text) {
+        if (text.includes("delete")) {
+          that.codeFormData.code = "";
+          that.sictomText = "";
+          that.originCode = "";
+          return;
+        }
+        if (that.sitcomScan) {
+          let tempTxt = text;
+          let str = tempTxt.replace(/[\r]/g, "");
+          that.sictomText = that.sictomText + str;
+          that.codeFormData.code = that.sictomText;
+        } else {
+          that.codeFormData.code = text;
+        }
+      };
+      inputer.focus();
+      this.$refs.inputRef.focus();
+    },
+    beforeDestroy() {
+
+    },
+    created() {
+      this.init();
+    },
+  };
+  </script>
+
+
+  <style scoped>
+  .scroll-alert {
+    width: 100%; /* 或者你需要的宽度 */
+    overflow: hidden;
+    white-space: nowrap;
+    box-sizing: border-box;
+    /*border: 1px solid #f56c6c; !* 类似于 Element UI 警告框的边框 *!*/
+    background-color: rgba(255, 235, 59, 0.1); /* 类似于 Element UI 警告框的背景色 */
+    padding: 10px;
+    position: relative;
+  }
+
+  .scroll-text {
+    display: inline-block;
+    padding-left: 100%; /* 初始位置在容器右侧 */
+    animation: scroll 10s linear infinite; /* 滚动动画 */
+  }
+
+  @keyframes scroll {
+    from {
+      transform: translateX(0);
+    }
+    to {
+      transform: translateX(-100%);
+    }
+  }
+
+  .query-form-item {
+    margin-right: 5px;
+    margin-bottom: 6px;
+  }
+
+  #inputer {
+    width: 100%;
+    min-height: 30px;
+    background-color: white;
+    border: #d0d0d0;
+    border-style: solid;
+    border-width: 0.1px;
+    color: #4a4a4a;
+  }
+
+  #inputer:focus {
+    width: 100%;
+    min-height: 30px;
+    background-color: white;
+    border: #0080ff;
+    border-style: solid;
+    border-width: 0.1px;
+    color: #4a4a4a;
+  }
+
+  .ime-disabled {
+    ime-mode: disabled;
+  }
+
+  .result-display {
+    border: 2px solid #ccc; /* 默认外框颜色 */
+    border-radius: 10px;
+    margin-top: 5px;
+    margin-left: 15px;
+    margin-right: 25px;
+    padding-left: 25px;
+    /* 不设置背景颜色 */
+  }
+
+  .result-success {
+    border-color: #4CAF50; /* 成功时外框颜色 */
+  }
+
+  .result-failure {
+    border-color: #0080ff; /* 失败时外框颜色 */
+  }
+
+  .result-text {
+    height: 18px;
+    /* 你可以在这里设置默认的文本颜色或其他样式 */
+  }
+
+  .result-text-success {
+    color: #4CAF50; /* 成功时文本颜色 */
+    font-size: 14px;
+  }
+
+  .result-text-failure {
+    color: #0080ff; /* 失败时文本颜色 */
+    font-size: 14px;
+  }
+
+  .mar-left {
+    margin-left: 20px;
+  }
+  </style>
+