AI回复内容，岗位卡片的点击事件绑定问题解决

components/md-render/md-render.vue

@@ -2,17 +2,44 @@
     <view class="markdown-body">
         <!-- 根据不同平台使用不同的渲染方式 -->
         <!-- #ifdef MP-WEIXIN -->
-        <rich-text class="markdownRich" id="markdown-content" :nodes="renderedHtml" @itemclick="handleItemClick" />
+        <!-- 微信小程序端：使用v-for遍历岗位卡片列表，每个卡片单独渲染，支持点击事件 -->
+        <scroll-view class="markdownRich" id="markdown-content">
+            <!-- 渲染普通markdown内容 -->
+            <rich-text :nodes="renderedHtml" />
+            
+            <!-- 单独渲染岗位卡片，支持点击事件 -->
+            <view v-if="localJobCardsList.length > 0" class="job-cards-container">
+                <view 
+                    v-for="(card, index) in localJobCardsList" 
+                    :key="index"
+                    class="custom-card"
+                    @tap="navigateToJobDetail(card.jobId)"
+                >
+                    <view class="card-title">
+                        <text class="title-text">{{ card.jobTitle }}</text>
+                        <view class="card-salary">{{ card.salary }}</view>
+                    </view>
+                    <view class="card-company">{{ card.location }}·{{ card.companyName }}</view>
+                    <view class="card-info">
+                        <view class="info-item">
+                            <view class="card-tag">{{ card.education }}</view>
+                            <view class="card-tag">{{ card.experience }}</view>
+                        </view>
+                        <view class="info-item">查看详情<view class="position-nav"></view></view>
+                    </view>
+                </view>
+            </view>
+        </scroll-view>
         <!-- #endif -->
         <!-- #ifndef MP-WEIXIN -->
-        <view class="markdown-body" v-html="renderedHtml"></view>
+        <view class="markdown-body" v-html="renderedHtml" @click="handleH5Click"></view>
         <!-- #endif -->
     </view>
 </template>
 
 <script setup>
-import { computed, onMounted, inject } from 'vue';
-import { parseMarkdown, codeDataList } from '@/utils/markdownParser';
+import { computed, onMounted, inject, ref, watch, nextTick } from 'vue';
+import { parseMarkdown, codeDataList, jobCardsList } from '@/utils/markdownParser';
 const { navTo } = inject('globalFunction');
 const props = defineProps({
     content: {
@@ -26,30 +53,191 @@ const props = defineProps({
 });
 
 const renderedHtml = computed(() => parseMarkdown(props.content));
+const markdownContainer = ref(null);
+// 响应式岗位卡片列表，用于微信小程序端单独渲染
+const localJobCardsList = ref([]);
 
-const handleItemClick = (e) => {
-    let { attrs } = e.detail.node;
-    console.log(attrs);
-    let { 'data-copy-index': codeDataIndex, 'data-job-id': jobId, class: className } = attrs;
-    switch (className) {
-        case 'custom-card':
-            return navTo('/packageA/pages/post/post?jobId=' + jobId);
-        case 'custom-more':
-            return navTo('/packageA/pages/moreJobs/moreJobs?jobId=' + jobId);
-        case 'copy-btn':
-            uni.setClipboardData({
-                data: codeDataList[codeDataIndex],
-                showToast: false,
-                success() {
-                    uni.showToast({
-                        title: '复制成功',
-                        icon: 'none',
-                    });
+// 监听content的变化，当内容更新时，解析岗位卡片
+watch(() => props.content, (newContent) => {
+    if (newContent) {
+        // 直接调用parseMarkdown来触发jobCardsList的更新
+        parseMarkdown(newContent);
+        // 将解析器生成的岗位卡片列表赋值给响应式数据
+        localJobCardsList.value = [...jobCardsList];
+        console.log('Content changed, jobCardsList updated:', localJobCardsList.value);
+    }
+}, { immediate: true });
+
+// 同时监听renderedHtml的变化作为备份
+watch(() => renderedHtml.value, (newVal) => {
+    console.log('renderedHtml changed, jobCardsList from parser:', jobCardsList);
+    // 将解析器生成的岗位卡片列表赋值给响应式数据
+    localJobCardsList.value = [...jobCardsList];
+});
+
+// 微信小程序端导航到岗位详情页面
+const navigateToJobDetail = (jobId) => {
+    console.log('navigateToJobDetail called with jobId:', jobId);
+    if (jobId && jobId !== 'undefined' && jobId !== 'null') {
+        // 跳转到岗位详情页面
+        uni.navigateTo({
+            url: `/packageA/pages/post/post?jobId=${jobId}`,
+            success: (res) => {
+                console.log('navigateTo success:', res);
             },
+            fail: (err) => {
+                console.error('navigateTo failed:', err);
+                // 如果navigateTo失败，尝试redirectTo
+                uni.redirectTo({
+                    url: `/packageA/pages/post/post?jobId=${jobId}`,
+                    success: (res2) => {
+                        console.log('redirectTo success:', res2);
+                    },
+                    fail: (err2) => {
+                        console.error('redirectTo also failed:', err2);
+                        // 如果还是失败，显示错误提示
+                        uni.showToast({
+                            title: '跳转失败，请稍后重试',
+                            icon: 'none'
+                        });
+                    }
+                });
+            }
+        });
+    } else {
+        console.error('Invalid jobId:', jobId);
+        uni.showToast({
+            title: '岗位信息不完整',
+            icon: 'none'
         });
-            break;
     }
 };
+
+// 微信小程序端点击事件处理已移除，改用v-for遍历岗位卡片列表，每个卡片单独渲染，支持点击事件
+// 微信小程序端和H5端的jobId取值方式一致，都是从JSON数据的appJobUrl字段提取
+// 不同的是，微信小程序端现在使用v-for遍历渲染，而H5端使用v-html渲染
+
+// H5平台点击事件处理
+// 微信小程序端和H5端的jobId取值方式一致，都是从JSON数据的appJobUrl字段提取
+// 不同的是，H5端可以直接从DOM属性获取，而微信小程序端使用v-for遍历渲染
+const handleH5Click = (e) => {
+    console.log('H5 click event triggered:', e.target);
+    let target = e.target;
+    // 查找最接近的带有class的元素
+    while (target && target.tagName !== 'BODY') {
+        console.log('Checking target:', target, 'className:', target.className, 'tagName:', target.tagName);
+        
+        // 直接使用closest方法查找，不依赖className
+        const cardElement = target.closest('.custom-card');
+        const moreElement = target.closest('.custom-more');
+        
+        console.log('Found elements:', { cardElement, moreElement });
+        
+        if (cardElement) {
+            // 尝试多种方式获取jobId
+            let jobId = cardElement.getAttribute('data-job-id');
+            console.log('Found custom-card, data-job-id attribute:', jobId);
+            
+            // 如果data-job-id为空，尝试从onclick事件中提取jobId
+            if (!jobId) {
+                const onclick = cardElement.getAttribute('onclick');
+                if (onclick) {
+                    const match = onclick.match(/jobId=(\w+)/);
+                    if (match && match[1]) {
+                        jobId = match[1];
+                        console.log('Extracted jobId from onclick:', jobId);
+                    }
+                }
+            }
+            
+            if (jobId) {
+                console.log('Final jobId for navigation:', jobId);
+                try {
+                    // 直接使用uni.navigateTo，避免navTo函数的潜在问题
+                    uni.navigateTo({
+                        url: `/packageA/pages/post/post?jobId=${jobId}`,
+                        success: (res) => {
+                            console.log('navigateTo success:', res);
+                        },
+                        fail: (err) => {
+                            console.error('navigateTo failed:', err);
+                            // 如果navigateTo失败，尝试redirectTo
+                            uni.redirectTo({
+                                url: `/packageA/pages/post/post?jobId=${jobId}`,
+                                success: (res2) => {
+                                    console.log('redirectTo success:', res2);
+                                },
+                                fail: (err2) => {
+                                    console.error('redirectTo also failed:', err2);
+                                }
+                            });
+                        }
+                    });
+                } catch (error) {
+                    console.error('Navigation error:', error);
+                }
+                return;
+            } else {
+                console.error('No jobId found for custom-card');
+            }
+        } else if (moreElement) {
+            // 尝试多种方式获取jobId
+            let jobId = moreElement.getAttribute('data-job-id');
+            console.log('Found custom-more, data-job-id attribute:', jobId);
+            
+            // 如果data-job-id为空，尝试从onclick事件中提取jobId
+            if (!jobId) {
+                const onclick = moreElement.getAttribute('onclick');
+                if (onclick) {
+                    const match = onclick.match(/jobId=(\w+)/);
+                    if (match && match[1]) {
+                        jobId = match[1];
+                        console.log('Extracted jobId from onclick:', jobId);
+                    }
+                }
+            }
+            
+            if (jobId) {
+                console.log('Final jobId for more jobs:', jobId);
+                try {
+                    // 直接使用uni.navigateTo，避免navTo函数的潜在问题
+                    uni.navigateTo({
+                        url: `/packageA/pages/moreJobs/moreJobs?jobId=${jobId}`,
+                        success: (res) => {
+                            console.log('navigateTo success:', res);
+                        },
+                        fail: (err) => {
+                            console.error('navigateTo failed:', err);
+                            // 如果navigateTo失败，尝试redirectTo
+                            uni.redirectTo({
+                                url: `/packageA/pages/moreJobs/moreJobs?jobId=${jobId}`,
+                                success: (res2) => {
+                                    console.log('redirectTo success:', res2);
+                                },
+                                fail: (err2) => {
+                                    console.error('redirectTo also failed:', err2);
+                                }
+                            });
+                        }
+                    });
+                } catch (error) {
+                    console.error('Navigation error:', error);
+                }
+                return;
+            } else {
+                console.error('No jobId found for custom-more');
+            }
+        }
+        
+        target = target.parentElement;
+    }
+};
+
+// 移除旧的事件监听逻辑，改用全局点击处理
+
+onMounted(() => {
+    console.log('onMounted called');
+});
 </script>
 
 <style lang="scss">
@@ -322,107 +510,422 @@ ol {
     padding: 0
 /* #endif */
 
+/* H5端和小程序端样式优化 */
 .custom-card
-    background: #FFFFFF
-    box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0,0,0,0.04)
-    border-radius: 20rpx
-    padding: 28rpx 24rpx
-    font-weight: 400
-    font-size: 28rpx
-    color: #333333
-    margin-bottom: 20rpx
-    position: relative
-    display: flex
-    flex-direction: column
-    /* 确保在小程序中边距正确应用 */
-    /* #ifdef MP-WEIXIN */
-    margin-left: auto
-    margin-right: auto
-    width: 100%
-    box-sizing: border-box
-    /* #endif */
+    background: #FFFFFF !important
+    box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0,0,0,0.04) !important
+    border-radius: 20rpx !important
+    padding: 28rpx 24rpx !important
+    font-weight: 400 !important
+    font-size: 28rpx !important
+    color: #333333 !important
+    margin-bottom: 22rpx !important
+    position: relative !important
+    display: block !important
+    flex-direction: column !important
+    /* 确保在所有平台中边距正确应用 */
+    margin-left: auto !important
+    margin-right: auto !important
+    width: 100% !important
+    box-sizing: border-box !important
+    text-decoration: none !important
+    overflow: hidden !important
 
-    .card-title
-        font-weight: 600
-        display: flex
-        align-items: center
-        justify-content: space-between
-        margin-bottom: 16rpx
+.custom-card .card-title
+    font-weight: 600 !important
+    display: flex !important
+    align-items: center !important
+    justify-content: space-between !important
+    margin-bottom: 16rpx !important
 
-        .title-text
-            font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif
-            max-width: calc(100% - 160rpx)
-            overflow: hidden
-            text-overflow: ellipsis
-            font-size: 30rpx
-            line-height: 1.4
+.custom-card .card-title .title-text
+    font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif !important
+    max-width: calc(100% - 160rpx) !important
+    overflow: hidden !important
+    text-overflow: ellipsis !important
+    font-size: 32rpx !important
+    line-height: 1.4 !important
+    white-space: nowrap !important
+    margin-bottom: 0 !important
 
-        .card-salary
-            font-family: DIN-Medium
-            font-size: 28rpx
-            color: #FF6E1C
-            line-height: 1.4
+.custom-card .card-title .card-salary
+    font-family: DIN-Medium !important
+    font-size: 32rpx !important
+    color: #4C6EFB !important
+    line-height: 1.4 !important
+    font-weight: 500 !important
+    margin-bottom: 0 !important
 
-    .card-company
-        margin-bottom: 22rpx
-        max-width: 100%
-        overflow: hidden
-        text-overflow: ellipsis
-        color: #6C7282
-        line-height: 1.4
+.custom-card .card-company
+    margin-bottom: 18rpx !important
+    max-width: 100% !important
+    overflow: hidden !important
+    text-overflow: ellipsis !important
+    color: #6C7282 !important
+    line-height: 1.4 !important
+    white-space: nowrap !important
+    font-size: 28rpx !important
+    margin-top: 0 !important
+    display: block !important
 
-    .card-info
-        display: flex
-        align-items: center
-        justify-content: space-between
-        padding-right: 40rpx
+.custom-card .card-tags
+    display: flex !important
+    flex-wrap: wrap !important
+    margin-bottom: 24rpx !important
 
-        .info-item
-            display: flex
-            position: relative
-            align-items: center
+.custom-card .card-tag
+    font-weight: 400 !important
+    font-size: 24rpx !important
+    color: #6C7282 !important
+    width: fit-content !important
+    background: #F4F4F4 !important
+    border-radius: 4rpx !important
+    padding: 6rpx 20rpx !important
+    margin-right: 20rpx !important
+    margin-bottom: 14rpx !important
+    display: inline-flex !important
+    align-items: center !important
+    justify-content: center !important
+    height: 30rpx !important
+    line-height: 30rpx !important
 
-            &:last-child
-                color: #256BFA
-                font-size: 28rpx
-                padding-right: 10rpx
+.custom-card .card-bottom
+    display: flex !important
+    justify-content: space-between !important
+    font-size: 24rpx !important
+    color: #6C7282 !important
+    margin-top: 0 !important
+    margin-bottom: 0 !important
 
-    .position-nav
-        position: absolute
-        right: -10rpx
-        top: 50%
-        transform: translateY(-50%)
+.custom-card .card-bottom .info-item
+    display: flex !important
+    align-items: center !important
+    justify-content: center !important
+    margin-bottom: 0 !important
 
-    .position-nav::before
-        position: absolute
-        left: 0
-        top: -4rpx
-        content: ''
-        width: 4rpx
-        height: 16rpx
-        border-radius: 2rpx
-        background: #256BFA
-        transform: translate(0, -50%) rotate(-45deg)
+.custom-card .card-info
+    display: flex !important
+    align-items: center !important
+    justify-content: space-between !important
+    padding-right: 40rpx !important
 
-    .position-nav::after
-        position: absolute
-        left: 0
-        top: -4rpx
-        content: ''
-        width: 4rpx
-        height: 16rpx
-        border-radius: 2rpx
-        background: #256BFA
-        transform: rotate(45deg)
+.custom-card .card-info .info-item
+    display: flex !important
+    position: relative !important
+    align-items: center !important
 
-    .card-tag
-        font-weight: 500
-        font-size: 24rpx
-        color: #333333
-        width: fit-content
-        background: #F4F4F4
-        border-radius: 4rpx
-        padding: 4rpx 20rpx
-        margin-right: 16rpx
-        margin-bottom: 0
+.custom-card .card-info .info-item:last-child
+    color: #256BFA !important
+    font-size: 28rpx !important
+    padding-right: 10rpx !important
+
+.custom-card .position-nav
+    position: absolute !important
+    right: -10rpx !important
+    top: 50% !important
+    transform: translateY(-50%) !important
+
+.custom-card .position-nav::before
+    position: absolute !important
+    left: 0 !important
+    top: -4rpx !important
+    content: '' !important
+    width: 4rpx !important
+    height: 16rpx !important
+    border-radius: 2rpx !important
+    background: #256BFA !important
+    transform: translate(0, -50%) rotate(-45deg) !important
+
+.custom-card .position-nav::after
+    position: absolute !important
+    left: 0 !important
+    top: -4rpx !important
+    content: '' !important
+    width: 4rpx !important
+    height: 16rpx !important
+    border-radius: 2rpx !important
+    background: #256BFA !important
+    transform: rotate(45deg) !important
+
+/* 为微信小程序专门优化的样式选择器 */
+/* #ifdef MP-WEIXIN */
+.job-cards-container .custom-card
+    background: #FFFFFF !important
+    box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0,0,0,0.04) !important
+    border-radius: 20rpx !important
+    padding: 28rpx 24rpx !important
+    font-weight: 400 !important
+    font-size: 28rpx !important
+    color: #333333 !important
+    margin-bottom: 22rpx !important
+    position: relative !important
+    display: block !important
+    flex-direction: column !important
+    margin-left: auto !important
+    margin-right: auto !important
+    width: 100% !important
+    box-sizing: border-box !important
+    text-decoration: none !important
+    overflow: hidden !important
+
+.job-cards-container .custom-card .card-title
+    font-weight: 600 !important
+    display: flex !important
+    align-items: center !important
+    justify-content: space-between !important
+    margin-bottom: 16rpx !important
+
+.job-cards-container .custom-card .card-title .title-text
+    font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif !important
+    max-width: calc(100% - 160rpx) !important
+    overflow: hidden !important
+    text-overflow: ellipsis !important
+    font-size: 32rpx !important
+    line-height: 1.4 !important
+    white-space: nowrap !important
+    margin-bottom: 0 !important
+
+.job-cards-container .custom-card .card-title .card-salary
+    font-family: DIN-Medium !important
+    font-size: 32rpx !important
+    color: #4C6EFB !important
+    line-height: 1.4 !important
+    font-weight: 500 !important
+    margin-bottom: 0 !important
+
+.job-cards-container .custom-card .card-company
+    margin-bottom: 18rpx !important
+    max-width: 100% !important
+    overflow: hidden !important
+    text-overflow: ellipsis !important
+    color: #6C7282 !important
+    line-height: 1.4 !important
+    white-space: nowrap !important
+    font-size: 28rpx !important
+    margin-top: 0 !important
+    display: block !important
+
+.job-cards-container .custom-card .card-info
+    display: flex !important
+    align-items: center !important
+    justify-content: space-between !important
+    padding-right: 40rpx !important
+
+.job-cards-container .custom-card .card-info .info-item
+    display: flex !important
+    position: relative !important
+    align-items: center !important
+
+.job-cards-container .custom-card .card-info .info-item:last-child
+    color: #256BFA !important
+    font-size: 28rpx !important
+    padding-right: 10rpx !important
+
+.job-cards-container .custom-card .card-info .info-item .card-tag
+    font-weight: 400 !important
+    font-size: 24rpx !important
+    color: #6C7282 !important
+    width: fit-content !important
+    background: #F4F4F4 !important
+    border-radius: 4rpx !important
+    padding: 6rpx 20rpx !important
+    margin-right: 20rpx !important
+    margin-bottom: 14rpx !important
+    display: inline-flex !important
+    align-items: center !important
+    justify-content: center !important
+    height: 30rpx !important
+    line-height: 30rpx !important
+
+.job-cards-container .custom-card .position-nav
+    position: absolute !important
+    right: -10rpx !important
+    top: 50% !important
+    transform: translateY(-50%) !important
+
+.job-cards-container .custom-card .position-nav::before
+    position: absolute !important
+    left: 0 !important
+    top: -4rpx !important
+    content: '' !important
+    width: 4rpx !important
+    height: 16rpx !important
+    border-radius: 2rpx !important
+    background: #256BFA !important
+    transform: translate(0, -50%) rotate(-45deg) !important
+
+.job-cards-container .custom-card .position-nav::after
+    position: absolute !important
+    left: 0 !important
+    top: -4rpx !important
+    content: '' !important
+    width: 4rpx !important
+    height: 16rpx !important
+    border-radius: 2rpx !important
+    background: #256BFA !important
+    transform: rotate(45deg) !important
+/* #endif */
+
+/* 额外的H5端样式优化 */
+/* #ifndef MP-WEIXIN */
+/* 确保样式能正确应用到v-html生成的内容，使用深度选择器 */
+.markdown-body {
+    /* 确保样式能正确应用到v-html生成的内容 */
+    & > div {
+        display: flex !important;
+        flex-direction: column !important;
+    }
+    
+    /* 为v-html生成的a标签添加样式，使用!important确保优先级 */
+    & > div > a.custom-card,
+    & > a.custom-card,
+    & * > a.custom-card,
+    & * * > a.custom-card {
+        display: block !important;
+        margin-bottom: 22rpx !important;
+        background: #FFFFFF !important;
+        box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0,0,0,0.04) !important;
+        border-radius: 20rpx !important;
+        padding: 28rpx 24rpx !important;
+        font-weight: 400 !important;
+        font-size: 28rpx !important;
+        color: #333333 !important;
+        text-decoration: none !important;
+        overflow: hidden !important;
+    }
+    
+    /* 为v-html生成的内容添加样式 */
+    & > div > a.custom-card .card-title,
+    & > a.custom-card .card-title,
+    & * > a.custom-card .card-title,
+    & * * > a.custom-card .card-title {
+        font-weight: 600 !important;
+        display: flex !important;
+        align-items: center !important;
+        justify-content: space-between !important;
+        margin-bottom: 16rpx !important;
+    }
+    
+    & > div > a.custom-card .card-title .title-text,
+    & > a.custom-card .card-title .title-text,
+    & * > a.custom-card .card-title .title-text,
+    & * * > a.custom-card .card-title .title-text {
+        font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif !important;
+        font-size: 32rpx !important;
+        line-height: 1.4 !important;
+        color: #333333 !important;
+        max-width: calc(100% - 160rpx) !important;
+        overflow: hidden !important;
+        text-overflow: ellipsis !important;
+        white-space: nowrap !important;
+        margin-bottom: 0 !important;
+    }
+    
+    & > div > a.custom-card .card-title .card-salary,
+    & > a.custom-card .card-title .card-salary,
+    & * > a.custom-card .card-title .card-salary,
+    & * * > a.custom-card .card-title .card-salary {
+        font-family: DIN-Medium !important;
+        font-size: 32rpx !important;
+        color: #4C6EFB !important;
+        line-height: 1.4 !important;
+        font-weight: 500 !important;
+        margin-bottom: 0 !important;
+    }
+    
+    & > div > a.custom-card .card-company,
+    & > a.custom-card .card-company,
+    & * > a.custom-card .card-company,
+    & * * > a.custom-card .card-company {
+        margin-bottom: 18rpx !important;
+        font-size: 28rpx !important;
+        color: #6C7282 !important;
+        line-height: 1.4 !important;
+        max-width: 100% !important;
+        overflow: hidden !important;
+        text-overflow: ellipsis !important;
+        white-space: nowrap !important;
+        margin-top: 0 !important;
+        display: block !important;
+    }
+    
+    & > div > a.custom-card .card-tags,
+    & > a.custom-card .card-tags,
+    & * > a.custom-card .card-tags,
+    & * * > a.custom-card .card-tags {
+        display: flex !important;
+        flex-wrap: wrap !important;
+        margin-bottom: 24rpx !important;
+    }
+    
+    & > div > a.custom-card .card-tag,
+    & > a.custom-card .card-tag,
+    & * > a.custom-card .card-tag,
+    & * * > a.custom-card .card-tag {
+        font-weight: 400 !important;
+        font-size: 24rpx !important;
+        color: #6C7282 !important;
+        width: fit-content !important;
+        background: #F4F4F4 !important;
+        border-radius: 4rpx !important;
+        padding: 6rpx 20rpx !important;
+        margin-right: 20rpx !important;
+        margin-bottom: 14rpx !important;
+        display: inline-flex !important;
+        align-items: center !important;
+        justify-content: center !important;
+        height: 30rpx !important;
+        line-height: 30rpx !important;
+    }
+    
+    & > div > a.custom-card .card-bottom,
+    & > a.custom-card .card-bottom,
+    & * > a.custom-card .card-bottom,
+    & * * > a.custom-card .card-bottom {
+        display: flex !important;
+        justify-content: space-between !important;
+        font-size: 24rpx !important;
+        color: #6C7282 !important;
+        margin-top: 0 !important;
+        margin-bottom: 0 !important;
+    }
+    
+    & > div > a.custom-card .card-bottom .info-item,
+    & > a.custom-card .card-bottom .info-item,
+    & * > a.custom-card .card-bottom .info-item,
+    & * * > a.custom-card .card-bottom .info-item {
+        display: flex !important;
+        align-items: center !important;
+        justify-content: center !important;
+        margin-bottom: 0 !important;
+    }
+    
+    & > div > a.custom-card .card-info,
+    & > a.custom-card .card-info,
+    & * > a.custom-card .card-info,
+    & * * > a.custom-card .card-info {
+        display: flex !important;
+        align-items: center !important;
+        justify-content: space-between !important;
+        padding-right: 40rpx !important;
+    }
+    
+    & > div > a.custom-card .card-info .info-item,
+    & > a.custom-card .card-info .info-item,
+    & * > a.custom-card .card-info .info-item,
+    & * * > a.custom-card .card-info .info-item {
+        display: flex !important;
+        align-items: center !important;
+    }
+    
+    & > div > a.custom-card .card-info .info-item:last-child,
+    & > a.custom-card .card-info .info-item:last-child,
+    & * > a.custom-card .card-info .info-item:last-child,
+    & * * > a.custom-card .card-info .info-item:last-child {
+        color: #256BFA !important;
+        font-size: 28rpx !important;
+        padding-right: 10rpx !important;
+    }
+}
+/* #endif */
 </style>

utils/markdownParser.js

@@ -5,6 +5,7 @@ import parseHtml from '@/lib/html-parser.js';
 
 export let codeDataList = []
 export let jobMoreMap = new Map()
+export let jobCardsList = []
 
 const md = new MarkdownIt({
     html: true, // 允许 HTML 标签
@@ -18,11 +19,46 @@ const md = new MarkdownIt({
         if (lang === 'job-json') {
             const result = safeExtractJson(str);
             if (result) { // json解析成功
-                const jobId = result.appJobUrl.split('jobId=')[1]
-                let domContext = `<a class="custom-card" data-job-id="${jobId}"><div class="card-title"><span class="title-text">${result.jobTitle}</span><div class="card-salary">${result.salary}</div></div><div class="card-company">${result.location}·${result.companyName}</div><div class="card-info"><div class="info-item"><div class="card-tag">${result.education}</div><div class="card-tag">${result.experience}</div></div><div class="info-item">查看详情<div class="position-nav"></div></div></div></a>`
+                let jobId = result.appJobUrl;
+                // If appJobUrl contains 'jobId=', extract the value after it, otherwise use it directly
+                if (jobId && jobId.includes('jobId=')) {
+                    jobId = jobId.split('jobId=')[1];
+                    // 如果还有额外的参数，只取jobId部分
+                    if (jobId.includes('&')) {
+                        jobId = jobId.split('&')[0];
+                    }
+                }
+                console.log('Job JSON result:', result, 'Extracted jobId:', jobId);
+                
+                // 确保jobId有效
+                if (!jobId || jobId === 'undefined' || jobId === 'null') {
+                    console.error('Invalid jobId extracted:', jobId, 'from appJobUrl:', result.appJobUrl);
+                    // 尝试从其他字段获取jobId
+                    if (result.jobId) {
+                        jobId = result.jobId;
+                        console.log('Using jobId from result.jobId:', jobId);
+                    }
+                }
+                
+                // 添加到岗位卡片列表，供小程序端单独渲染
+                jobCardsList.push({
+                    jobId,
+                    jobTitle: result.jobTitle,
+                    salary: result.salary,
+                    location: result.location,
+                    companyName: result.companyName,
+                    education: result.education,
+                    experience: result.experience
+                });
+                
+                // 生成岗位卡片HTML，注意：微信小程序rich-text组件只支持部分HTML属性
+                // 使用普通的href属性，微信小程序rich-text会将其转换为可点击链接
+                // 添加data-job-id属性，方便获取jobId
+                // 为所有平台添加onclick事件，微信小程序可能会忽略，但H5端会生效
+                let domContext = `<a class="custom-card" href="/packageA/pages/post/post?jobId=${jobId}" data-job-id="${jobId}" data-jobid="${jobId}" onclick="if(typeof uni !== 'undefined'){uni.navigateTo({url: '/packageA/pages/post/post?jobId=${jobId}'});return false;}"><div class="card-title"><span class="title-text">${result.jobTitle}</span><div class="card-salary">${result.salary}</div></div><div class="card-company">${result.location}·${result.companyName}</div><div class="card-info"><div class="info-item"><div class="card-tag">${result.education}</div><div class="card-tag">${result.experience}</div></div><div class="info-item">查看详情<div class="position-nav"></div></div></div></a>`
                 if (result.data) {
                     jobMoreMap.set(jobId, result.data)
-                    domContext += `<a class="custom-more" data-job-id="${jobId}">查看更多岗位<div class="more-icon"></div></a>`
+                    domContext += `<a class="custom-more" href="/packageA/pages/moreJobs/moreJobs?jobId=${jobId}" data-job-id="${jobId}" data-jobid="${jobId}" onclick="if(typeof uni !== 'undefined'){uni.navigateTo({url: '/packageA/pages/moreJobs/moreJobs?jobId=${jobId}'});return false;}">查看更多岗位<div class="more-icon"></div></a>`
                 }
                 return domContext
             }
@@ -122,6 +158,7 @@ export function parseMarkdown(content) {
     content = content.replace(/<\s*\/\s*think\s*&gt;/gi, '')
     
     codeDataList = []
+    jobCardsList = [] // 清空岗位卡片列表，避免重复
     const unsafeHtml = md.render(content || '')
     
     // 在markdown渲染后再次过滤，确保没有遗漏