bug修复

src/views/order/intention/Step2.vue

@@ -127,7 +127,7 @@
                 <span
                   class="tag-value"
                   @click.stop="focusConditionTag(index)"
-                  >{{ cond.value || "空值" }}</span
+                  >{{ cond.value }}</span
                 >
                 <el-icon class="tag-edit-icon" size="14"><Edit /></el-icon>
               </el-tag>
@@ -193,7 +193,7 @@
             </div>
           </div>
 
-          <!-- 参数对比弹窗 - 使用query.vue的实现但保留step2的样式 -->
+          <!-- 参数对比弹窗 -->
           <el-dialog
             v-model="compareDialogVisible"
             title="参数对比"
@@ -277,21 +277,19 @@
 
 <script setup>
 import { ref, computed, watch, onMounted, nextTick } from "vue";
-import {
+import { carTypeOptions, allParts } from "@/data/stepMockData";
-  carTypeOptions,
-  allParts, // 保留原始数据，但实际查询会使用新的查询逻辑
-} from "@/data/stepMockData";
 import CarModelDialog from "@/components/CarModelDialog.vue";
 import { ElMessage, ElEmpty } from "element-plus";
+import { Search, Edit, RefreshLeft } from "@element-plus/icons-vue";
 
-// 接收props和定义emit，保留step2的原有逻辑
+// 接收props和定义emit
 const props = defineProps({
   form: Object,
   selectedCarType: String,
 });
 const emit = defineEmits(["update:form", "prev-step", "next-step"]);
 
-// 彻底双向绑定，保留step2的原有逻辑
+// 双向绑定
 const selectedCarTypeProxy = computed({
   get() {
     return props.form?.selectedCarType ?? "";
@@ -304,7 +302,7 @@ const selectedCarTypeProxy = computed({
   },
 });
 
-// 从query.vue引入的查询相关变量
+// 查询相关变量
 const currentInput = ref("");
 const searchInput = ref(null);
 const inputWidth = ref(600);
@@ -320,15 +318,15 @@ const activePossibleFieldIndex = ref(-1);
 // 解析后的条件和查询结果
 const parsedConditions = ref([]);
 const showResults = ref(false);
-const filteredData = ref([]); // 使用query.vue的filteredData替代原有的queryResultList
+const filteredData = ref([]);
 
-// 对比相关，整合query.vue的逻辑但保留step2的样式和部分逻辑
+// 对比相关
 const compareDialogVisible = ref(false);
 const selectedCompareList = computed(() =>
   filteredData.value.filter((i) => i.selected)
 );
 
-// 生成对比表格数据 - 采用query.vue的实现
+// 生成对比表格数据
 const compareTableData = computed(() => {
   if (selectedCompareList.value.length === 0) return [];
 
@@ -370,7 +368,7 @@ const compareTableData = computed(() => {
   });
 });
 
-// 定义可查询的字段 - 来自query.vue
+// 定义可查询的字段
 const allFields = [
   { key: "productNumber", label: "品号" },
   { key: "name", label: "品名/物料名称" },
@@ -385,7 +383,7 @@ const allFields = [
   { key: "image", label: "图片" },
 ];
 
-// 模拟数据 - 来自query.vue，实际项目中可能从API获取
+// 模拟数据
 const mockData = [
   {
     productNumber: "D311299000045-00005",
@@ -645,7 +643,7 @@ const handleInputContainerClick = (e) => {
 // 处理输入框点击事件 - 支持点击已输入值显示下拉
 const handleInputClick = () => {
   const index = findCursorConditionIndex();
-  const parts = currentInput.value.split(/[;；]/);
+  const parts = currentInput.value.split(";");
 
   if (index >= 0 && index < parts.length) {
     const part = parts[index].trim();
@@ -662,14 +660,14 @@ const handleInputMouseUp = () => {
   handleInputClick();
 };
 
-// 聚焦到指定的条件标签
+// 聚焦到指定的条件标签 - 修复问题2
 const focusConditionTag = (index) => {
   const parts = currentInput.value.split(/[;；]/);
-  if (index < parts.length) {
+  if (index < 0 || index >= parts.length) return;
+
   // 将光标定位到该条件
   selectedConditionIndex.value = index;
-    const inputEl = searchInput.value.$el.querySelector("input");
+  const inputEl = searchInput.value?.$el.querySelector("input");
-
   if (!inputEl) return;
 
   // 计算该条件在输入框中的位置
@@ -678,14 +676,16 @@ const focusConditionTag = (index) => {
     cursorPos += parts[i].length + 1; // +1 是分号的长度
   }
 
-    // 设置光标位置
+  // 设置光标位置到该条件的末尾
   setTimeout(() => {
     inputEl.focus();
-      inputEl.setSelectionRange(cursorPos, cursorPos + parts[index].length);
+    inputEl.setSelectionRange(
+      cursorPos + parts[index].length,
+      cursorPos + parts[index].length
+    );
     // 触发该条件的建议显示
     triggerConditionSuggestions(parts[index].trim());
   }, 0);
-  }
 };
 
 // 触发特定条件的建议显示
@@ -899,33 +899,34 @@ const handleInput = (value) => {
   activePossibleFieldIndex.value = -1;
 };
 
-// 选择可能的字段
+// 选择可能的字段 - 修复问题4
 const selectPossibleField = (field) => {
+  // 始终在当前条件上操作，不修改其他条件
   const parts = currentInput.value.split(/[;；]/);
-  let targetIndex =
+  let targetIndex = parts.length - 1;
-    selectedConditionIndex.value >= 0
-      ? selectedConditionIndex.value
-      : parts.length - 1;
 
-  // 确保索引有效
+  // 如果最后一个条件为空，使用前一个
-  if (targetIndex < 0 || targetIndex >= parts.length) {
+  if (parts.length > 0 && parts[targetIndex].trim() === "") {
-    targetIndex = parts.length - 1;
+    targetIndex = Math.max(0, parts.length - 2);
   }
 
   // 获取当前部分的值
   let targetPart = parts[targetIndex] || "";
 
-  // 在当前值前添加字段名和冒号
+  // 检查是否已有字段
+  if (targetPart.includes(":")) {
+    // 已有字段，添加新条件
+    const newPart = `${field.label}:`;
+    parts.push(newPart);
+    targetIndex = parts.length - 1;
+  } else {
+    // 没有字段，在当前值前添加字段名和冒号
     parts[targetIndex] = `${field.label}:${targetPart}`;
-
-  // 重新拼接条件，清理多余分号，并确保末尾有分号
-  currentInput.value = parts.join(";").replace(/;;+/g, ";").trim();
-
-  // 如果当前部分不为空且不以分号结尾，则添加分号
-  if (currentInput.value && !currentInput.value.endsWith(";")) {
-    currentInput.value += ";";
   }
 
+  // 重新拼接条件，清理多余分号
+  currentInput.value = parts.join(";").replace(/;;+/g, ";").trim();
+
   // 保持建议框显示，允许继续编辑
   setTimeout(() => {
     handleInput(currentInput.value);
@@ -974,17 +975,15 @@ const getOperator = (conditionValue) => {
   return operators.find((op) => conditionValue.startsWith(op));
 };
 
-// 选择建议项 - 支持替换已有条件的值
+// 选择建议项 - 修复问题1和问题3
 const selectSuggestion = (item) => {
   const parts = currentInput.value.split(/[;；]/);
-  let targetIndex =
+  // 总是在最后一个条件上操作，确保新条件添加到末尾
-    selectedConditionIndex.value >= 0
+  let targetIndex = parts.length - 1;
-      ? selectedConditionIndex.value
-      : parts.length - 1;
 
-  // 确保索引有效
+  // 如果最后一个条件为空，使用前一个
-  if (targetIndex < 0 || targetIndex >= parts.length) {
+  if (parts.length > 0 && parts[targetIndex].trim() === "") {
-    targetIndex = parts.length - 1;
+    targetIndex = Math.max(0, parts.length - 2);
   }
 
   let targetPart = parts[targetIndex] || "";
@@ -1010,20 +1009,21 @@ const selectSuggestion = (item) => {
         // 普通值替换
         parts[targetIndex] = `${fieldPart}${item.label}`;
       }
+
+      // 问题1：值选择后自动添加分号
+      parts[targetIndex] += ";";
     } else {
       // 无字段时直接处理值
       parts[targetIndex] = item.label;
+
+      // 问题1：值选择后自动添加分号
+      parts[targetIndex] += ";";
     }
   }
 
-  // 重新拼接条件，清理多余分号，并确保末尾有分号
+  // 重新拼接条件，清理多余分号
   currentInput.value = parts.join(";").replace(/;;+/g, ";").trim();
 
-  // 如果当前部分不为空且不以分号结尾，则添加分号
-  if (currentInput.value && !currentInput.value.endsWith(";")) {
-    currentInput.value += ";";
-  }
-
   // 保持建议框显示，允许继续编辑
   setTimeout(() => {
     handleInput(currentInput.value);
@@ -1144,7 +1144,7 @@ const parseConditions = (input) => {
   return conditions;
 };
 
-// 处理查询 - 采用query.vue的实现
+// 处理查询
 const handleSearch = () => {
   if (!currentInput.value.trim()) return;
 
@@ -1226,12 +1226,6 @@ const removeCondition = (index) => {
     .join(";")
     .replace(/[;；]+/g, ";")
     .trim();
-
-  // 确保末尾有分号
-  if (currentInput.value && !currentInput.value.endsWith(";")) {
-    currentInput.value += ";";
-  }
-
   parsedConditions.value = parseConditions(currentInput.value);
   filteredData.value = filterData(parsedConditions.value).map((item) => ({
     ...item,
@@ -1258,7 +1252,7 @@ const clearAll = () => {
   }
 };
 
-// 保留step2的原有生命周期钩子
+// 生命周期钩子
 onMounted(() => {
   initializeValues();
   updateInputWidth();
@@ -1300,7 +1294,7 @@ watch(
   }
 );
 
-// 保留step2的原有功能方法
+// 切换选择状态
 function toggleSelect(item) {
   // 统计已选中的数量
   const selectedCount = filteredData.value.filter((i) => i.selected).length;
@@ -1311,6 +1305,7 @@ function toggleSelect(item) {
   item.selected = !item.selected;
 }
 
+// 打开对比弹窗
 function onCompare() {
   if (selectedCompareList.value.length === 0) {
     ElMessage.warning("请先选择要对比的卡片");
@@ -1319,6 +1314,7 @@ function onCompare() {
   compareDialogVisible.value = true;
 }
 
+// 下一步
 function onNextStep() {
   const selected = filteredData.value.filter((i) => i.selected);
   if (selected.length !== 1) {
@@ -1342,7 +1338,7 @@ function onNextStep() {
 </script>
 
 <style scoped lang="scss">
-// 保留step2的原有样式
+// 原有样式保持不变
 .step2-container {
   background: #fff;
   padding: 24px;
@@ -1767,7 +1763,7 @@ function onNextStep() {
   text-align: left;
 }
 .result-card-name {
-  font-size: 15px;
+  font-size: 13px;
   color: #333;
   font-weight: 500;
   margin-bottom: 4px;
@@ -1917,6 +1913,7 @@ function onNextStep() {
   padding: 10px 15px;
   background-color: #f0f7ff;
   border-bottom: 1px solid #e4e7ed;
+  border-bottom: 1px solid #e4e7ed;
   display: flex;
   align-items: center;
   gap: 8px;