fix(query): 修复查询结果表头提示与全量排序 (#164)

* fix(grid): 修复查询结果表头提示与排序

修复 MySQL 查询结果列元数据取错库名的问题，并补齐查询结果全量排序链路，避免表头提示与排序行为失效。

* fix(query): 修复结果排序重复列名报错

src/components/grid/DataGrid.vue

@@ -98,7 +98,7 @@ const props = defineProps<{
 const emit = defineEmits<{
   reload: [sql?: string, whereInput?: string];
   paginate: [offset: number, limit: number, whereInput?: string, orderBy?: string];
-  sort: [column: string, direction: "asc" | "desc" | null, whereInput?: string];
+  sort: [column: string, columnIndex: number, direction: "asc" | "desc" | null, whereInput?: string];
 }>();
 
 const hasData = computed(() => props.result.columns.length > 0);
@@ -203,6 +203,7 @@ const showCellDetail = ref(false);
 const transposeRowIndex = ref<number | null>(null);
 const showTranspose = ref(false);
 const sortCol = ref<string | null>(null);
+const sortColIndex = ref<number | null>(null);
 const sortDir = ref<"asc" | "desc">("asc");
 const searchText = ref("");
 const searchSuggestions = ref<string[]>([]);
@@ -599,21 +600,23 @@ const activeCellDetail = computed(() => {
   };
 });
 
-function toggleSort(colName: string) {
+function toggleSort(colName: string, colIdx: number) {
   if (isResizing) return;
-  if (sortCol.value === colName) {
+  if (sortCol.value === colName && sortColIndex.value === colIdx) {
     if (sortDir.value === "asc") {
       sortDir.value = "desc";
-      emit("sort", colName, "desc", activeWhereInput.value);
+      emit("sort", colName, colIdx, "desc", activeWhereInput.value);
     } else {
       sortCol.value = null;
+      sortColIndex.value = null;
       sortDir.value = "asc";
-      emit("sort", colName, null, activeWhereInput.value);
+      emit("sort", colName, colIdx, null, activeWhereInput.value);
     }
   } else {
     sortCol.value = colName;
+    sortColIndex.value = colIdx;
     sortDir.value = "asc";
-    emit("sort", colName, "asc", activeWhereInput.value);
+    emit("sort", colName, colIdx, "asc", activeWhereInput.value);
   }
 }
 
@@ -1415,17 +1418,23 @@ defineExpose({
                   >
                     #
                   </div>
-                  <Tooltip v-for="(col, colIdx) in result.columns" :key="col">
+                  <Tooltip v-for="(col, colIdx) in result.columns" :key="`${col}-${colIdx}`">
                     <TooltipTrigger as-child>
                       <div
                         class="shrink-0 px-3 py-1.5 border-r border-border whitespace-nowrap cursor-pointer hover:bg-accent/50 select-none relative overflow-hidden"
                         :style="{ width: `var(--col-w-${colIdx})` }"
-                        @click="toggleSort(col)"
+                        @click="toggleSort(col, colIdx)"
                       >
                         <span class="flex min-w-0 items-center gap-1 overflow-hidden">
                           <span class="min-w-0 truncate">{{ col }}</span>
-                          <ArrowUp v-if="sortCol === col && sortDir === 'asc'" class="h-3 w-3 shrink-0" />
-                          <ArrowDown v-else-if="sortCol === col && sortDir === 'desc'" class="h-3 w-3 shrink-0" />
+                          <ArrowUp
+                            v-if="sortCol === col && sortColIndex === colIdx && sortDir === 'asc'"
+                            class="h-3 w-3 shrink-0"
+                          />
+                          <ArrowDown
+                            v-else-if="sortCol === col && sortColIndex === colIdx && sortDir === 'desc'"
+                            class="h-3 w-3 shrink-0"
+                          />
                         </span>
                         <div
                           class="absolute right-0 top-0 bottom-0 w-1.5 cursor-col-resize hover:bg-primary/30"
@@ -1434,12 +1443,14 @@ defineExpose({
                       </div>
                     </TooltipTrigger>
                     <TooltipContent
-                      v-if="columnTypeMap.get(col)"
+                      v-if="columnTypeMap.get(col) || columnCommentMap.get(col)"
                       side="bottom"
                       class="text-xs grid grid-cols-[auto_1fr] gap-x-2"
                     >
-                      <span class="text-muted-foreground">{{ t("grid.columnType") }}</span>
-                      <span :class="typeColorClass(columnTypeMap.get(col)!)">{{ columnTypeMap.get(col) }}</span>
+                      <template v-if="columnTypeMap.get(col)">
+                        <span class="text-muted-foreground">{{ t("grid.columnType") }}</span>
+                        <span :class="typeColorClass(columnTypeMap.get(col)!)">{{ columnTypeMap.get(col) }}</span>
+                      </template>
                       <template v-if="columnCommentMap.get(col)">
                         <span class="text-muted-foreground">{{ t("grid.columnComment") }}</span>
                         <span>{{ columnCommentMap.get(col) }}</span>