AI页面增加政策查询和岗位推荐的tab

pages/chat/components/ai-paging.vue

@@ -1,5 +1,23 @@
 <template>
     <view class="chat-container">
+        <!-- Tab切换 -->
+        <view class="tab-container">
+            <view 
+                class="tab-item" 
+                :class="{ active: activeTab === 'policy' }"
+                @click="switchTab('policy')"
+            >
+                政策查询
+            </view>
+            <view 
+                class="tab-item" 
+                :class="{ active: activeTab === 'job' }"
+                @click="switchTab('job')"
+            >
+                岗位推荐
+            </view>
+        </view>
+        
         <!-- #ifdef MP-WEIXIN -->
          <view class="chat-background" v-if="!messages.length">
             <image class="backlogo" src="/static/icon/backAI.png"></image>
@@ -51,6 +69,7 @@
             <!-- #endif -->
                 <view
                     v-for="(msg, index) in messages"
+                    v-show="shouldShowMessage(msg)"
                     :key="index"
                     :id="'msg-' + index"
                     class="chat-item"
@@ -352,6 +371,7 @@ const { speak, pause, resume, isSpeaking, isPaused, cancelAudio } = useTTSPlayer
 const instance = getCurrentInstance();
 
 // state
+const activeTab = ref('policy'); // 'policy' or 'job'
 const queries = ref([]);
 const guessList = ref([]);
 const scrollTop = ref(0);
@@ -571,11 +591,12 @@ const delfile = (file) => {
 const scrollToBottom = throttle(function () {
     nextTick(() => {
         try {
+            let query;
             // #ifdef MP-WEIXIN
-            const query = uni.createSelectorQuery().in(instance);
+            query = uni.createSelectorQuery().in(instance);
             // #endif
             // #ifndef MP-WEIXIN
-            const query = uni.createSelectorQuery();
+            query = uni.createSelectorQuery();
             // #endif
             
             query.select('.scrollView').boundingClientRect();
@@ -886,7 +907,42 @@ function getRandomJobQueries(queries, count = 2) {
     return shuffled.slice(0, count); // 取前 count 条
 }
 
-defineExpose({ scrollToBottom, closeGuess, closeFile, changeQueries, handleTouchCancel });
+// 切换tab
+function switchTab(tab) {
+    activeTab.value = tab;
+}
+
+// 检查消息是否应该显示在当前tab
+function shouldShowMessage(msg) {
+    if (msg.self) {
+        return true; // 用户自己的消息总是显示
+    }
+    
+    if (activeTab.value === 'policy') {
+        // 政策查询tab：显示除了岗位卡片以外的所有内容
+        // 岗位卡片通常包含特定的标记，如```job-json或岗位推荐等关键词
+        const isJobCard = msg.displayText && (
+            msg.displayText.includes('```job-json') ||
+            msg.displayText.includes('岗位推荐') ||
+            msg.displayText.includes('推荐岗位') ||
+            msg.displayText.includes('岗位信息') ||
+            (msg.displayText.includes('```') && msg.displayText.includes('公司') && msg.displayText.includes('薪资'))
+        );
+        return !isJobCard;
+    } else {
+        // 岗位推荐tab：只显示岗位卡片内容
+        const isJobCard = msg.displayText && (
+            msg.displayText.includes('```job-json') ||
+            msg.displayText.includes('岗位推荐') ||
+            msg.displayText.includes('推荐岗位') ||
+            msg.displayText.includes('岗位信息') ||
+            (msg.displayText.includes('```') && msg.displayText.includes('公司') && msg.displayText.includes('薪资'))
+        );
+        return isJobCard;
+    }
+}
+
+defineExpose({ scrollToBottom, closeGuess, closeFile, changeQueries, handleTouchCancel, switchTab });
 </script>
 
 <style lang="stylus" scoped>
@@ -1373,4 +1429,48 @@ image-margin-top = 40rpx
 .ai-loading view:nth-child(3) {
     animation-delay: 0s;
 }
+
+/* Tab切换样式 */
+.tab-container {
+    display: flex;
+    background: #FFFFFF;
+    border-bottom: 2rpx solid #F4F4F4;
+    padding: 0 44rpx;
+    height: 88rpx;
+    align-items: center;
+    z-index: 10;
+}
+
+.tab-item {
+    flex: 1;
+    text-align: center;
+    font-size: 28rpx;
+    font-weight: 500;
+    color: #666666;
+    line-height: 88rpx;
+    height: 88rpx;
+    position: relative;
+    transition: all 0.3s ease;
+}
+
+.tab-item.active {
+    color: #256BFA;
+    font-weight: bold;
+}
+
+.tab-item.active::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 60rpx;
+    height: 4rpx;
+    background: #256BFA;
+    border-radius: 2rpx;
+}
+
+.tab-item:active {
+    background-color: #F5F5F5;
+}
 </style>