refactor: streamline layout, views routing and component composition

Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent)

Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>

src/App.vue

@@ -90,10 +90,15 @@
           @reject-case="toast(`${activeCase?.id} 已转人工复核。`)"
         />
 
+        <TravelReimbursementCreateView
+          v-else-if="activeView === 'requests' && detailMode"
+          @back-to-requests="detailMode = false"
+        />
+
         <RequestsView
           v-else-if="activeView === 'requests'"
           :filtered-requests="filteredRequests"
-          @ask="handleOpenChat"
+          @ask="detailMode = true"
           @approve="handleApprove"
           @reject="handleReject"
           @create-request="openTravelCreate"
@@ -137,6 +142,7 @@ import { documents } from './data/requests.js'
 
 const loggedIn = ref(false)
 const travelCreateMode = ref(false)
+const detailMode = ref(false)
 
 function handleLogin(credentials) {
   if (credentials.username && credentials.password) {
@@ -162,10 +168,10 @@ const customRange = ref({ start: '2024-07-06', end: '2024-07-12' })
 const travelPrompts = ['帮我提交出差申请', '预订机票', '预订酒店', '预订火车票', '查询差旅政策']
 
 const topBarView = computed(() => {
-  if (travelCreateMode.value) {
+  if (travelCreateMode.value || detailMode.value) {
     return {
-      title: '差旅报销助手',
-      desc: '帮你填写报销、检查材料、跟踪进度'
+      title: '差旅报销详情',
+      desc: '查看报销单据详情、票据识别与审批进度'
     }
   }
   return currentView.value
@@ -191,6 +197,7 @@ function handleReject(request) {
 
 function handleNavigate(view) {
   travelCreateMode.value = false
+  detailMode.value = false
   setView(view)
 }