3.7 同步弘则固收

src/Material/Material.service.ts

@@ -1,5 +1,6 @@
 import NewAxiosInstanceFunc from '../Service/NewAxiosInstance'
 import { INewResponse } from '../Service/INewResponse'
+
 import { IItemType } from './components/Item.component'
 import { IIndepthArticleItem } from 'Indepth/Indepth.service'
 export const visitorToken =
@@ -98,6 +99,7 @@ export interface IGetListBySearchItem {
   Pv: number
 }
 export interface IArcticleDetail {
+  ChartPermissionName: string //是否是固收
   Abstract: string // 摘要
   Annotation: string // 核心观点
   ArticleId: number
@@ -215,7 +217,97 @@ export enum EOrderStatus {
   Payed = 2, // 2:已支付
   Refund = 3 // 3:已退款
 }
+export interface IArticleInfoExpand extends IArticleInfo {
+  type: IArticleType
+  industry: IArticleIndustry
+  corpus: { tree: string } | null
+  field?: IArticleField
+  series?: IArticleSeries
+  author: IArticleAuthor
+  co_author?: IArticleAuthor[]
+  truncate?: number
+}
+export interface ISelect {
+  id: number
+  name: string
+  description?: string
+}
+export interface IArticleAuthor {
+  name?: string
+  phone_number?: string
+}
+export interface IArticleIndustry {
+  id: number
+  name: string
+  description: string
+  field: IArticleField[]
+  series: IArticleSeries[]
+}
 
+export interface IArticleSeries extends ISelect {
+  id: number
+  name: string
+  description: string
+  industry_id?: number
+}
+export interface IArticleField extends ISelect {
+  id: number
+  name: string
+  description: string
+  count?: number
+}
+export interface IArticleContent {
+  id: number
+  abstract: string
+  annotation: string
+  body: string
+  auto_save: string | null
+}
+
+export interface IArticleType extends ISelect {
+  id: number
+  name: string
+  description: string
+  count?: number
+}
+export interface IArticleInfo {
+  id: number
+  title: string
+  title_en: string
+  frequency: string
+  publish_date: Date
+  author_phone_number: number
+  cover: string
+  industry_id: number
+  field_id: number
+  series_id: number
+  type_id: number
+  is_focused: number
+  stock: string[]
+  content: IArticleContent
+  publish_status: number
+  publish_area: PublishArea
+  create_date: Date
+  update_date: Date
+  is_active: boolean
+}
+export enum PublishArea {
+  MAINLAND = 'mainland',
+  HK = 'hk',
+  ALL = 'all'
+}
+export interface IArticleContent {
+  id: number
+  abstract: string
+  annotation: string
+  body: string
+  auto_save: string | null
+}
+
+export interface IVmpDetails {
+  code: number
+  data: IArticleInfoExpand
+}
 export const MaterialService = {
   getHomeList: (params: IGetHomeListParams): INewResponse<IGetHomeListRes> =>
     NewAxiosInstanceFunc({
@@ -251,6 +343,12 @@ export const MaterialService = {
       method: 'get',
       params: { ArticleId }
     }),
+  getVmpDetails: (ArticleId: number): INewResponse<IVmpDetails> =>
+    NewAxiosInstanceFunc({
+      url: `/article/detail_vmp`,
+      method: 'get',
+      params: { ArticleId }
+    }),
   getResearchIntroduce: (): INewResponse<{ List: IIntroduceItem[] }> =>
     NewAxiosInstanceFunc({
       url: `/config/research/introduce`,

src/Material/MaterialInfo.tsx

@@ -42,6 +42,8 @@ const MaterialInfo: React.FC<IMaterialInfoProps> = props => {
     manual: true,
     formatResult: response => response.data.Data,
     onSuccess: res => {
+      res?.Detail.ChartPermissionName === '固收' &&
+        (res.Detail.Body = setDetailToken(res.Detail.Body, res.Detail.VmpAuthorization))
       res?.Detail && setWxShare(res?.Detail.Title, res.Detail.Abstract.replace(/<[^>]+>/g, ''), res?.Detail.ShareImg)
       res?.Detail?.IsSpecialArticle
         ? setSpecialType(ISpecialType.SpecialArticle)
@@ -49,6 +51,15 @@ const MaterialInfo: React.FC<IMaterialInfoProps> = props => {
     }
   })
 
+  // 同步弘则固收后处理iframe后面拼接token
+  const setDetailToken = (body: string, token: string) => {
+    const updatedRichText = body.replace(
+      /<iframe\s+src="([^"]*\/display\/(\d+))"([^>]*)><\/iframe>/g,
+      `<iframe src="$1?token=${token}"$3></iframe>`
+    )
+    return updatedRichText
+  }
+
   // 收藏/取消收藏
   const { run: applyCollect } = useRequest(MaterialService.postActicleCollect, {
     manual: true,
@@ -112,8 +123,7 @@ const MaterialInfo: React.FC<IMaterialInfoProps> = props => {
     })
   }
   const handleToRefresh = () => {
-    console.log('有没有触发')
-
+    // console.log('有没有触发')
     // refreshArcticleDetail()
   }
   return (
@@ -121,7 +131,10 @@ const MaterialInfo: React.FC<IMaterialInfoProps> = props => {
       <AskAdd visible={visibleAsk} ID={props.articleID} onApply={handleApplyComment} onCloseModel={handleOkAsk} />
       <ValidateEmpty loading={infoLoading} data={data}>
         <div className={`${media.isSmallMax ? styles['research-container-moblie'] : styles['art-white-bg']}`}>
-          {login2p.jwt && data?.HasPermission && data?.HasPermission === INewPermissionType.OK ? (
+          {login2p.jwt &&
+          data?.HasPermission &&
+          data?.HasPermission === INewPermissionType.OK &&
+          data?.Detail.ChartPermissionName !== '固收' ? (
             <div className={styles['material-info-option']}>
               <span className="material-option-item" onClick={() => setVisibleAsk(true)}>
                 <img src={CommentFillSvg} alt="icon" className="option-icon" />

src/Material/components/ArticleCard.tsx

@@ -35,7 +35,10 @@ const ArticleCard: React.FC<IArticleCard> = props => {
           dangerouslySetInnerHTML={{
             __html: item?.IsResearch
               ? `${formatLabel(item.LabelKeywordImgLink)}<span>${title || item?.Title}</span>`
-              : title || item?.Title
+              : `<img src=${
+                  item.LabelKeywordImgLink || 'https://hzstatic.hzinsights.com/cygx_web/config/gushou.png'
+                } alt="标签" class="mfyx-label-img" /><span>${title || item?.Title}</span>`
+            // title || item?.Title
           }}
         />
       </div>

src/Material/components/Research.container.tsx

@@ -1,13 +1,13 @@
-import React, { useEffect } from 'react'
+import React, { useEffect, useState } from 'react'
 import { Link } from 'react-router-dom'
 import useRequest from '@ahooksjs/use-request'
 import { useHistory } from 'react-router-dom'
 import dayjs from 'dayjs'
 
-import { Affix, Breadcrumb, Col, Divider, Row, Timeline, Typography, Watermark } from 'antd'
+import { Affix, Breadcrumb, Col, Divider, Row, Timeline, Typography, Watermark, Tag } from 'antd'
 
 import { VmpSeverError } from 'components/Empty'
-import { MaterialService, IArcticleInfo, IArcticleHotListItem } from '../Material.service'
+import { MaterialService, IArcticleInfo, IArcticleHotListItem, IArticleInfoExpand } from '../Material.service'
 import { useMedia } from 'Context/Media/MediaContext'
 import { useLogin2p } from 'Login2p/Login2pContext'
 import styles from '../css/MaterialInfo.module.scss'
@@ -22,7 +22,7 @@ type ResearchContainerProps = {
 const ResearchContainer: React.FC<ResearchContainerProps> = props => {
   const { info, handleToRefresh } = props
   // const [showDisclaimers, setShowDisclaimers] = useState(false)
-
+  const [articleInfo, setArticleInfo] = useState<IArticleInfoExpand>()
   const { data: hotList, run } = useRequest(MaterialService.getArcticleHotList, {
     manual: true,
     formatResult: response => response.data.Data?.List
@@ -34,9 +34,20 @@ const ResearchContainer: React.FC<ResearchContainerProps> = props => {
   const inlineStyleConfig = {
     titleLevel: media.isSmallMax ? 4 : 2
   }
+  const { run: getVmpGSDetails } = useRequest(MaterialService.getVmpDetails, {
+    manual: true,
+
+    onSuccess: res => {
+      const { data } = res.data.Data
+      setArticleInfo(data)
+    }
+  })
 
   useEffect(() => {
     run(info.Detail.ArticleId)
+    if (info.Detail.ChartPermissionName === '固收') {
+      getVmpGSDetails(info.Detail.ArticleId)
+    }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 
@@ -95,6 +106,21 @@ const ResearchContainer: React.FC<ResearchContainerProps> = props => {
               <div className="gray-text fz12">{dayjs(info.Detail.PublishDate).format('YYYY-MM-DD HH:mm')}</div>
             </div>
           </div>
+          {articleInfo && info?.HasPermission === INewPermissionType.OK && (
+            <p>
+              {articleInfo.industry ? <Tag color="blue">{articleInfo.industry?.name}</Tag> : <></>}
+              {articleInfo.field ? <Tag color="red">{articleInfo.field?.name}</Tag> : <></>}
+              {articleInfo.type ? <Tag color="purple">{articleInfo.type.name}</Tag> : <></>}
+              {articleInfo.frequency ? <Tag color="green">{articleInfo.frequency}</Tag> : <></>}
+              {articleInfo.series ? <Tag color="volcano">{articleInfo.series.name}</Tag> : <></>}
+              {articleInfo.stock?.length > 0 &&
+                articleInfo.stock?.map((item, index) => (
+                  <Tag color="cyan" key={`stock-${index}`}>
+                    {item}
+                  </Tag>
+                ))}
+            </p>
+          )}
           <Row gutter={24}>
             <Col
               xs={{ span: 24, offset: 0 }}
@@ -120,7 +146,8 @@ const ResearchContainer: React.FC<ResearchContainerProps> = props => {
                 )}
                 {
                   // annotation 可能能null
-                  info.Detail.Annotation?.replace('<p><br></p>', '') ? (
+                  info.Detail.Annotation?.replace('<p><br></p>', '') &&
+                  info?.HasPermission === INewPermissionType.OK ? (
                     <>
                       <Typography.Paragraph>
                         <Typography.Text style={{ fontSize: 20 }} italic strong>