feat: PC需求实现 P747投标企业信用报告入口及购买流程优化

apps/bigmember_pc/src/api/modules/detail.js

@@ -27,6 +27,15 @@ export function ajaxGetContentInfo(data) {
     data
   })
 }
+// 获取详情页引流关键词
+export function ajaxGetContentInfoGuideKeys(data) {
+  data = qs.stringify(data)
+  return request({
+    method: 'post',
+    url: '/publicapply/entCreditReport/keys',
+    data
+  })
+}
 
 // 获取详情页关联、推荐等信息
 export function ajaxGetContentOtherInfo(data) {

apps/bigmember_pc/src/assets/style/page/article.scss

@@ -6,6 +6,11 @@
       cursor: pointer;
     }
 
+    .report-preview-highlight-guide:hover {
+      color: #2cb7ca;
+      text-decoration: none;
+    }
+
     .step-items:hover .item-label {
       text-decoration: underline;
       color: #fe7379;

apps/bigmember_pc/src/router/modules/order.js

@@ -300,7 +300,8 @@ export default [
         components: commonOrder({
           headerAdsense: () =>
             import('@/views/order/components/credit-report/header-adsense.vue'),
-          info: () => import('@/views/order/components/credit-report/info.vue')
+          info: () => import('@/views/order/components/credit-report/info.vue'),
+          title: () => import('@/views/order/components/credit-report/title.vue'),
         }),
         children: [
           {

apps/bigmember_pc/src/views/article-content/components/ContentHeader.vue

@@ -276,14 +276,14 @@ const infoType = computed(() => {
       <div class="credit-report">
         <div class="report-container">
           <div class="report-text">
-            通过信用背书、风险预警、政策适配，赋能投标突围
+            获取投标企业信用报告，展示投标实力
           </div>
           <button
             class="report-btn"
             :data-info-type="infoType"
             @click="doOpenCreditReportPage($event, buyerName)"
           >
-            下载投标企业信用报告
+            点击下载
           </button>
         </div>
       </div>

apps/bigmember_pc/src/views/article-content/composables/useArticleUtil.js

@@ -95,10 +95,11 @@ export function doOpenCreditReportPage(event, buyer = '') {
   const infoType = event.target.dataset.infoType || event.currentTarget.dataset.infoType || ''
   const breakName = `${btnName}_${infoType}`
   // 自定义埋点上报事件（数据统计需求：点击信用报告按钮要求统计到当前标讯的信息类型）
+  const openURL = '/swordfish/page_big_pc/free/report/preview?source=bidCreditReportPreview&buyer' + buyer
   try {
     window.__EasyJTrack.addTrack(breakName)
-    window.open('/swordfish/page_big_pc/order/credit-report?buyer=' + buyer, '_blank')
+    window.open(openURL, '_blank')
   } catch (error) {
-    window.open('/swordfish/page_big_pc/order/credit-report?buyer=' + buyer, '_blank')
+    window.open(openURL, '_blank')
   }
 }

apps/bigmember_pc/src/views/article-content/composables/useContentStore.js

@@ -3,7 +3,7 @@ import { computed, reactive, ref } from 'vue'
 import useContentExpandModel from '@jy/data-models/modules/article/model/expand'
 import {
   ajaxGetArticlePreAgentInfo,
-  ajaxGetContentInfo,
+  ajaxGetContentInfo, ajaxGetContentInfoGuideKeys,
   ajaxGetContentOtherInfo
 } from '@/api/modules/detail'
 import { getUserResource } from '@/api/modules/bi'
@@ -82,6 +82,21 @@ async function useContentStore() {
     }
   })
 
+  await ajaxGetContentInfoGuideKeys().then(res => {
+    if (res?.error_code === 0 && res?.data) {
+      const guideKeys = res.data?.matchKeys?.split(',') || []
+      let guideLink = res.data?.link || '#'
+
+      const guideTip = res.data?.loginCw || '获取投标企业信用报告，展示投标实力'
+      Content.addGuideKey('企业信用报告引流', guideKeys, function ({ buyer }) {
+        if (guideLink !== '#') {
+          guideLink = guideLink + (guideLink.lastIndexOf('?') !== -1 ? '&buyer=' : '?buyer=') + buyer
+        }
+        return `<span>$1&nbsp;<a target='_blank' class='highlight-text keyword-underline report-preview-highlight-guide' href='${guideLink}'>${guideTip}</a>&nbsp;</span>`
+      })
+    }
+  })
+
   await ajaxGetContentInfo({ token: AgentInfo.value.token })
     .then((res) => {
       if (res.error_code === 0) {

apps/bigmember_pc/src/views/order/components/credit-report/info.vue

@@ -1,16 +1,16 @@
 <template>
   <div class="report-order-info">
-    <div class="report-order-info__header flex flex-justify-between">
-      <div>
-        <p class="report-role">报告作用：</p>
-        <p class="report-desc">
-          信用报告通过信用背书、风险预警、政策适配，三大核心作用，成为投标企业参与市场竞争的关键工具。
-        </p>
-      </div>
-      <button type="button" class="sample-btn" @click="onViewReportSample">
-        查看报告样例
-      </button>
-    </div>
+<!--    <div class="report-order-info__header flex flex-justify-between">-->
+<!--      <div>-->
+<!--        <p class="report-role">报告作用：</p>-->
+<!--        <p class="report-desc">-->
+<!--          信用报告通过信用背书、风险预警、政策适配，三大核心作用，成为投标企业参与市场竞争的关键工具。-->
+<!--        </p>-->
+<!--      </div>-->
+<!--      <button type="button" class="sample-btn" @click="onViewReportSample">-->
+<!--        查看报告样例-->
+<!--      </button>-->
+<!--    </div>-->
     <div class="report-order-info__main">
       <el-form
         :model="ruleForm"

apps/bigmember_pc/src/views/order/components/credit-report/title.vue

@@ -0,0 +1,10 @@
+<template>
+</template>
+
+<script>
+export default {
+  name: 'order-title'
+}
+</script>
+
+<style scoped></style>

apps/bigmember_pc/src/views/reportDownload/preview.vue

@@ -23,10 +23,9 @@
         <p>您的浏览器不支持PDF预览，请<a :href="pdfUrl">点击下载</a></p>
       </object>
       <AdSense
-        v-show="!loginFlag"
         ref="adSense"
         class="ad-sense ad-fixed"
-        :code="code"
+        :code="code + (loginFlag ? '-login' : '')"
         @openUrl="openUrl"
       ></AdSense>
     </div>
@@ -114,8 +113,12 @@ export default {
     openUrl() {
       // 打开登录弹框or跳转登录页面
       // location.href = '/notin/page?source=bidCreditReportPreview'
-      const redirectUrl = '/swordfish/page_big_pc/order/credit-report'
-      this.$showLoginDialog(false, redirectUrl)
+      const redirectUrl = '/swordfish/page_big_pc/order/credit-report?from=preview&buyer=' + (this.$route.query?.buyer || '')
+      if (this.loginFlag) {
+        window.open(redirectUrl, '_blank')
+      } else {
+        this.$showLoginDialog(false, redirectUrl)
+      }
     }
   }
 }

data/data-models/modules/article/model/content.js

@@ -6,6 +6,9 @@ import { replaceKeywordWithRichText } from '@jy/util'
 const thirdPartyVerify = useThirdPartyVerifyModel()
 
 class ContentModel extends BaseModel {
+  // 引流关键词组
+  _highlightGuideKeyMaps = {}
+
   constructor(config) {
     super(config)
   }
@@ -18,7 +21,15 @@ class ContentModel extends BaseModel {
         summary: false
       },
       content: useCommonTitleModel().createModel(),
-      summary: useSummaryModel().createModel()
+      summary: useSummaryModel().createModel(),
+    }
+  }
+
+  // 关键词组替换
+  addGuideKey (desc, keys, fn) {
+    this._highlightGuideKeyMaps[desc] = {
+      keys,
+      fn
     }
   }
 
@@ -45,7 +56,7 @@ class ContentModel extends BaseModel {
       } catch (error) {
         console.log(error)
       }
-      
+
       try {
         result.content.contentHighlighted = this.highlightContentHTML(result.content.content, data, result)
       } catch (error) {
@@ -131,6 +142,22 @@ class ContentModel extends BaseModel {
     if (content) {
       content = thirdPartyVerify.replaceKeysAndInsertMark(content)
     }
+
+    // 插入画像引流关键词
+    if (content && baseInfo) {
+      for (const guideKey in this._highlightGuideKeyMaps) {
+        const guideKeyItem = this._highlightGuideKeyMaps[guideKey]
+        if (Array.isArray(guideKeyItem?.keys)) {
+          for (let i = 0; i < guideKeyItem.keys.length; i++) {
+            const rKey = guideKeyItem.keys[i]
+            const rRich = typeof guideKeyItem.fn === 'function' ? guideKeyItem.fn({ rKey, guideKey, buyer: summary.originMap.buyer }) : '<span class="highlight-text">$1</span>'
+            content = replaceKeywordWithRichText(content, rKey, rRich)
+          }
+        }
+      }
+    }
+
+
     // ------------------
     // 关键词高亮
     let highlightKeys = []

packages/util/modules/format/str.js

@@ -114,7 +114,8 @@ export function replaceKeyword(
 export function replaceKeywordWithRichText (
   htmlString,
   keyword,
-  richChar = '<span class="highlight-text">$1</span>'
+  richChar = '<span class="highlight-text">$1</span>',
+  skipClassName = ['keyword', 'highlight-text']
 ) {
   if (!keyword || !richChar || keyword === '略') return htmlString
 
@@ -151,7 +152,11 @@ export function replaceKeywordWithRichText (
       node.parentNode.replaceChild(frag, node)
     } else if (node.nodeType === Node.ELEMENT_NODE) {
       // 如果是元素节点，递归其子节点
-      Array.from(node.childNodes).forEach(replaceText)
+      const skip = skipClassName.some(sk => node.className.indexOf(sk) !== -1)
+      // 跳过已经高亮的元素子节点
+      if (!skip) {
+        Array.from(node.childNodes).forEach(replaceText)
+      }
     }
   }