多条件判断选中元素回显

src/views/formula/component/funComponent/ifelse.vue

@@ -138,12 +138,14 @@
                 <span class="textblod mg-r-20" >IF</span>
                 
                 <vue-tags-input 
+                 :ref="`multiTagsInput_${conditionIndex}_${innerIndex}_tag2`"
                   v-model="conditionList[conditionIndex].formulaIfElse[innerIndex].tag2" 
                   :tags="conditionList[conditionIndex].formulaIfElse[innerIndex].tags2" 
                   @focus="setMultiFocus(conditionIndex, innerIndex, 'tag2')" 
                   @blur="inputBlurMulti(conditionIndex, innerIndex, 'tag2')" 
                   placeholder="输入/参数" 
                   @before-adding-tag="beforeAddingTag"
+                  @tag-clicked="handleMultiTagClick($event, conditionIndex, innerIndex, 'tag2')"
                 />
                 <span class="mg-l-20 mg-r-20">
                 <el-select 
@@ -164,12 +166,14 @@
                 </el-select>
                 </span>
                 <vue-tags-input 
+                  :ref="`multiTagsInput_${conditionIndex}_${innerIndex}_tag3`"
                   v-model="conditionList[conditionIndex].formulaIfElse[innerIndex].tag3" 
                   :tags="conditionList[conditionIndex].formulaIfElse[innerIndex].tags3" 
                   @focus="setMultiFocus(conditionIndex, innerIndex, 'tag3')" 
                   @blur="inputBlurMulti(conditionIndex, innerIndex, 'tag3')" 
                   placeholder="输入/参数" 
                   @before-adding-tag="beforeAddingTag"
+                  @tag-clicked="handleMultiTagClick($event, conditionIndex, innerIndex, 'tag3')"
                 />
                 <i class="el-icon-circle-plus-outline mg-l-20" style="color: #409EFF;cursor: pointer;" @click="addConditionItem(conditionIndex, innerIndex)"></i>
                 <i class="el-icon-delete mg-l-20" style="color: red;cursor: pointer;" @click="removeConditionItem(conditionIndex, innerIndex)" v-if="innerIndex > 0 || conditionIndex > 0"></i>
@@ -178,6 +182,7 @@
          <div class="flex jc-al-c mg-t-20" v-if="result == 1">
           <span class="textblod mg-r-10">满足</span>
           <vue-tags-input 
+            :ref="`multiTagsInput_${conditionIndex}_${innerIndex}_tag4`"
             v-model="conditionList[conditionIndex].tag4" 
             :tags="conditionList[conditionIndex].tags4" 
             @focus="setMultiFocus(conditionIndex, null, 'tag4')" 
@@ -185,12 +190,14 @@
             placeholder="输入/参数" 
             @before-adding-tag="beforeAddingTag" 
             @keyup.native="btKeyUp"
+            @tag-clicked="handleMultiTagClick($event, conditionIndex, innerIndex, 'tag4')"
           />
           
           <!-- 只在最后一个条件显示"不满足"输入框 -->
           <template v-if="conditionIndex === conditionList.length - 1">
             <span class="textblod mg-r-10 mg-l-20">不满足</span>
             <vue-tags-input 
+              :ref="`multiTagsInput_${conditionIndex}_${innerIndex}_tag5`"
               v-model="conditionList[conditionIndex].tag5" 
               :tags="conditionList[conditionIndex].tags5" 
               @focus="setMultiFocus(conditionIndex, null, 'tag5')" 
@@ -198,6 +205,7 @@
               placeholder="输入/参数" 
               @before-adding-tag="beforeAddingTag" 
               @keyup.native="btKeyUp"
+              @tag-clicked="handleMultiTagClick($event, conditionIndex, innerIndex, 'tag5')"
             />
           </template>
           
@@ -1910,7 +1918,22 @@ export default {
       this.$refs[refName].focus(); // 动态获取ref并调用focus方法
        this.$emit('clickTag',tag)
     },
-
+      // 处理多条件下的标签点击事件
+    handleMultiTagClick(info, conditionIndex, innerIndex, field) {
+      const { tag } = info;
+      // 设置当前焦点信息
+      this.setMultiFocus(conditionIndex, innerIndex, field);
+      // 获取对应的ref并聚焦
+      const refName = `multiTagsInput_${conditionIndex}_${innerIndex}_${field}`;
+      console.log(refName,'refName');
+      console.log(this.$refs,'this.$refs');
+      
+      if (this.$refs[refName]) {
+        this.$refs[refName][0].focus();
+      }
+      // 向父组件传递点击的标签信息
+      this.$emit('clickTag', tag);
+    },
 
   }
 }

src/views/formula/edit.vue

@@ -2383,7 +2383,7 @@ replaceSelectedElement(newItem) {
     //逻辑判断回显元素
     handleClickTagElse(item){
   
-      console.log(item,'item逻辑');
+  
   
               const keyParts =  item.tableElementKey.split('key');
               this.selectedTableKeyComp = keyParts.length > 1 ? 'key'+keyParts[1] : null;