diff --git a/src/views/dashboard/graphs/TopList.vue b/src/views/dashboard/graphs/TopList.vue
index 6eb9ee12..8c998c9b 100644
--- a/src/views/dashboard/graphs/TopList.vue
+++ b/src/views/dashboard/graphs/TopList.vue
@@ -105,6 +105,7 @@ function viewTrace(item: { name: string; id: string; value: unknown }) {
     ...item,
     queryOrder: QueryOrders[1].value,
     status: Status[2].value,
+    id: item.id || item.name,
     metricValue: [
       { label: props.config.metrics[0], data: item.value, value: item.name },
     ],
diff --git a/src/views/dashboard/related/trace/Header.vue b/src/views/dashboard/related/trace/Header.vue
index 14b1f02a..d46a60c9 100644
--- a/src/views/dashboard/related/trace/Header.vue
+++ b/src/views/dashboard/related/trace/Header.vue
@@ -13,7 +13,7 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License. -->
 <template>
-  <div class="conditions flex-h">
+  <div class="conditions flex-h" v-show="!filters.id">
     <el-radio-group v-model="conditions" @change="changeCondition">
       <el-radio-button
         v-for="(item, index) in items"
@@ -135,7 +135,7 @@ async function init() {
     }
   }
   conditions.value = (items.value[0] && items.value[0].label) || "";
-  if (filters.id) {
+  if (!filters.id) {
     state.service = selectorStore.currentService.id;
     if (dashboardStore.entity === EntityType[2].value) {
       state.endpoint = selectorStore.currentPod.id;
@@ -213,6 +213,7 @@ function setCondition() {
     serviceId: state.service || undefined,
     endpointId: state.endpoint || undefined,
     serviceInstanceId: state.instance || undefined,
+    traceId: filters.refId || undefined,
   };
   for (const k of items.value) {
     if (