-Go服务器开发

要实现从客服工单进入跟进页面后，返回时仍然保持在客服工单标签页（而不是默认跳转到内催工单），可以通过以下方式解决：

解决方案

在跳转时保存当前标签页状态：在跳转到跟进页面时，将当前的 activeKey 通过路由参数传递过去。
返回时恢复标签页状态：在返回列表页面时，从路由参数中读取之前保存的 activeKey 并恢复。

修改后的代码

1. 修改 `workOrderQuery.vue`（工单查询页面）

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';

const router = useRouter();
const activeKey = ref('1'); // 默认是内催工单（key="1"）

// 跳转到跟进页面时，传递当前 activeKey
const handleFollowUp = (record) => {
  const recordData = encodeURIComponent(JSON.stringify(record));
  
  if (record.workOrderType === '协商客户') {
    router.push({
      name: 'NegotiatePage',
      query: { 
        record: recordData,
        fromTab: activeKey.value // 传递当前标签页 key
      }
    });
  } else if (record.workOrderType === '投诉客户') {
    router.push({
      name: 'ComplaintPage',
      query: { 
        record: recordData,
        fromTab: activeKey.value // 传递当前标签页 key
      }
    });
  } else if (record.workOrderType === '其他') {
    router.push({
      name: 'OtherWorkOrder',
      query: { 
        record: recordData,
        fromTab: activeKey.value // 传递当前标签页 key
      }
    });
  }
};
</script>

2. 修改跟进页面（如 `NegotiatePage.vue` / `ComplaintPage.vue` / `OtherWorkOrder.vue`）

<script setup>
import { useRouter, onBeforeMount } from 'vue-router';

const router = useRouter();

// 返回时带上原来的 tab key
const goBackToList = () => {
  const fromTab = router.currentRoute.value.query.fromTab || '1'; // 默认返回内催工单
  
  router.push({
    name: 'workOrderQuery',
    query: { 
      tab: fromTab // 返回时恢复原来的标签页
    }
});
</script>

3. 在 `workOrderQuery.vue` 监听路由变化

<script setup>
import { ref, watch } from 'vue';
import { useRoute } from 'vue-router';

const route = useRoute();
const activeKey = ref('1');

// ⚠️监听路由变化，如果 URL query.tab=2，则切换到客服工单
watch(
() => route.query.tab,
(newTab) => {
if (newTab && ['1', '2'].includes(newTab)) {
activeKey.value = newTab;
}
},
{ immediate: true }
);
</script>

关键点说明

✅ 跳转前存储状态：在点击“跟进”按钮时，把当前的 activeKey ('1'或'2') 通过 query.fromTab 传递给目标页面。
✅ 返回时恢复状态：从目标页面返回列表页时，通过 query.tab= 还原之前的标签页。
✅ 监听路由变化：使用 Vue Router 的 watch() 确保每次进入列表页都能正确显示对应的 Tab。