列表上的易懂活动无权限时，跳转详情页

src/Activity/ActivityTypeDetail.tsx

@@ -10,6 +10,7 @@ import { ReactComponent as CityImg } from 'assets/city.svg'
 import NewImg from 'assets/new.png'
 
 import { useLogin2p } from 'Login2p/Login2pContext'
+import { useMedia } from 'Context/Media/MediaContext'
 import { ActivityService, IActivityTypeDetailRes, IArticleListItem, IListndustrialItem } from './Activity.service'
 import NoPermission, { INewPermissionType, ISpecialType, ITryType } from 'Material/components/NoPermission'
 import AudioControler from './components/AudioControler'
@@ -31,9 +32,12 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
   const { activityID } = props
   const login2p = useLogin2p()
   const history = useHistory()
+  const media = useMedia()
+
   const [refreshFlag, setRefreshFlag] = useState<boolean>(false)
   const [visibleLink, setVisibleLink] = useState<boolean>(false)
   const [openContinuePay, setOpenContinuePay] = useState<boolean>(false) // 去继续支付
+  const [openPayProcess, setOpenPayProcess] = useState<boolean>(false) // 付费报名
 
   useEffect(() => {
     const code = sessionStorage.getItem('invite_code') || login2p.inviteCode
@@ -122,10 +126,11 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
     }
   }
   const handleToRefresh = () => {
-    // todo
+    // 支付之后刷新页面
     refreshDetail()
     setRefreshFlag(!refreshFlag)
     setOpenContinuePay(false)
+    setOpenPayProcess(false)
   }
 
   // 取消订单
@@ -136,10 +141,14 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
   // 继续支付
   const handleToContinuePay = () => {
     if (!data?.OrderCode) return
-    // todo 打开支付码
+    // 打开支付码
     setOpenContinuePay(true)
   }
   const formatCountdown = <Countdown countdown={data?.PayTimeCountdown || 0} />
+  // 点数不足付费报名
+  const handlePayForSignUp = () => {
+    setOpenPayProcess(true)
+  }
 
   return (
     <div className={styles['activity-detail-page']}>
@@ -157,7 +166,7 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
                 {data?.Detail ? (
                   <div
                     className={`activity-detail-content ${
-                      data?.HasPermission !== INewPermissionType.OK && data?.IsShowWxPay
+                      data?.HasPermission !== INewPermissionType.OK && data?.IsShowWxPay && !media.isSmallMax
                         ? 'activity-content-nopower'
                         : ''
                     }`}
@@ -179,12 +188,6 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
                             去支付
                           </NButton>
                         </div>
-                        <PayProcessModel
-                          dataInfo={data}
-                          tryType={ITryType.Activity}
-                          continuePayFlag={openContinuePay}
-                          onRefresh={handleToRefresh}
-                        />
                       </div>
                     )}
                     <div className="activity-detail-title">
@@ -418,6 +421,7 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
                             item={data?.Detail}
                             btnGrous="detail"
                             onChangeSomething={refreshDetail}
+                            onNeedToDoSome={handlePayForSignUp}
                           />
                         </div>
                       )}
@@ -431,7 +435,8 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
                     {!activityDetailLoading &&
                     login2p.jwt &&
                     data?.HasPermission !== INewPermissionType.OK &&
-                    data?.IsShowWxPay ? (
+                    data?.IsShowWxPay &&
+                    !media.isSmallMax ? (
                       <div className="activity-paynopermission-wrapper">
                         <div className="white-wrapper" />
                         <div className="white-bg">
@@ -448,7 +453,7 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
                 {!activityDetailLoading &&
                 login2p.jwt &&
                 data?.HasPermission !== INewPermissionType.OK &&
-                !data?.IsShowWxPay ? (
+                media.isSmallMax ? (
                   <NoPermission
                     hasPermission={data?.HasPermission}
                     detailID={activityID}
@@ -463,6 +468,15 @@ const ActivityTypeDetail: React.FC<IActivityTypeDetail> = props => {
                     border={true}
                   />
                 ) : null}
+                {!activityDetailLoading && !!data ? (
+                  <PayProcessModel
+                    dataInfo={data as IActivityTypeDetailRes}
+                    tryType={ITryType.Activity}
+                    open={openPayProcess}
+                    continuePayFlag={openContinuePay}
+                    onRefresh={handleToRefresh}
+                  />
+                ) : null}
               </Col>
               <Col flex={'542px'} xs={0} sm={0} md={0} lg={0} xl={24} xxl={24}>
                 <ResearchActivity isRefresh={refreshFlag} />

src/Activity/components/ActivityBtn.component.tsx

@@ -2,8 +2,8 @@ import React, { useEffect, useState } from 'react'
 import useRequest from '@ahooksjs/use-request/es'
 import { useLocation, useHistory } from 'react-router-dom'
 
-import { Modal, Input, message, Tooltip, Radio, RadioChangeEvent, Space } from 'antd'
-import TipsSvg from 'assets/tips.svg'
+import { Modal, Input, message, Tooltip, Radio, RadioChangeEvent } from 'antd'
+// import TipsSvg from 'assets/tips.svg'
 
 import {
   ActivityService,
@@ -25,8 +25,6 @@ import Picture from './Picture'
 import { MaterialService } from 'Material/Material.service'
 import { INewestItem } from 'Newest/Newest.service'
 import { IMyActivityItem } from 'Personal/Personal.service'
-import YiDongModel from './YiDongModel'
-import PayProcessModel from 'Material/components/PayProcessModel'
 import styles from '../css/ActivityCard.module.scss'
 
 export enum IActivityBtnType {
@@ -67,9 +65,18 @@ export interface IActivityBtnComponent {
   btnClass?: 'act-btn-sm' | 'research-btn-sm' // 按钮的自定义样式
   btnGrous?: 'smcard' | 'detail' | 'bigcard' // smcard-如首页的小卡片，detail-如活动详情页，bigcard-如列表的大卡片
   onChangeSomething?: (activityId?: number) => void // 子组件变更后的操作
+  onNeedToDoSome?: () => void // 父组件的操作
 }
 const ActivityBtnComponent: React.FC<IActivityBtnComponent> = props => {
-  const { item, isSpecial = false, selfChange = false, btnClass, btnGrous = 'smcard', onChangeSomething } = props
+  const {
+    item,
+    isSpecial = false,
+    selfChange = false,
+    btnClass,
+    btnGrous = 'smcard',
+    onChangeSomething,
+    onNeedToDoSome
+  } = props
 
   const [visible, setVisible] = useState(false)
   const [callVisible, setCallVisible] = useState(false) // 报名方式选择的弹框
@@ -83,9 +90,7 @@ const ActivityBtnComponent: React.FC<IActivityBtnComponent> = props => {
   const [emailVisible, setEmailVisible] = useState<boolean>() // 含有邮箱填写的弹框
   const [actionType, setActionType] = useState<IActivityBtnType | IActivitySpecialBtnType>() // 记录点击了哪个按钮操作
   const [resourceCountData, setResourceCountData] = useState({ CompanyPoints: '0', ActivityPoints: '0' }) // 记录活动扣点数据
-  const [openYidongModel, setOpenYidongModel] = useState(false) // 易懂支付弹框提示
   // const [visibleApply, setVisibleApply] = useState(false) // 普通申请权限弹框
-  const [visibleBuyCard, setVisibleBuyCard] = useState(false) // 购买畅读卡弹框
 
   const login2p = useLogin2p()
   const location = useLocation()
@@ -354,10 +359,6 @@ const ActivityBtnComponent: React.FC<IActivityBtnComponent> = props => {
 
     return { title: title[type] }
   }
-  // 关闭易懂支付提示弹框
-  const handleCloseYidong = () => {
-    setOpenYidongModel(true)
-  }
   // 权限判断
   const handleCheckPower = (HasPermission: INewPermissionType, isResearch: boolean, isResearchSpecial: boolean) => {
     // 如果接口没返回权限则跳过
@@ -365,12 +366,6 @@ const ActivityBtnComponent: React.FC<IActivityBtnComponent> = props => {
 
     // 1.先判断权限，无权限则弹框
     if (HasPermission !== INewPermissionType.OK) {
-      // 如果是易懂活动，无权限时，弹框
-      // todo 缺个字段判断是否进入支付流程
-      if (btnGrous !== 'detail' && (item as IActivityTypeListItem)?.IsYidongActivity) {
-        setOpenYidongModel(true)
-        return false
-      }
       // 列表的按钮点击，无权限时，需要进入详情页
       if (btnGrous !== 'detail') {
         isSpecial
@@ -722,53 +717,58 @@ const ActivityBtnComponent: React.FC<IActivityBtnComponent> = props => {
     }
     // 3.研选扣点
     if (!res.CheckPoints) {
-      // todo 如果需要付费
-      Modal.warning({
-        title: '提示',
-        content: (
-          <div className="reset-pm">
-            <p>
-              <span>点数不足，您可以通过单场付费 ¥1299 参与或者联系销售机构充值</span>
-            </p>
-            <div>
-              当前剩余点数：<span className={styles['link-text']}>{res.CompanyPoints}</span>
-            </div>
-            <div>
-              本次会议扣除点数：<span className={styles['link-text']}>{res.ActivityPoints}</span>
-            </div>
-          </div>
-        ),
-        cancelText: '取消',
-        okText: '付费报名',
-        onOk: () => {
-          setVisibleBuyCard(true)
-        },
-        width: 520,
-        centered: true
-      })
-
-      Modal.warning({
-        title: '点数不足',
-        content: (
-          <div className="reset-pm">
-            <p>
-              <span>您的研选服务点数不足，若想报名，请联系对口销售升级套餐</span>
-              {/* <img src={TipsSvg} alt="icon" className={styles['link-tips-icon']} /> */}
-            </p>
-            <div>
-              当前剩余点数：<span className={styles['link-text']}>{res.CompanyPoints}</span>
+      // todo 如果需要付费 需要判断一下（需要加字段，是否需要支付,提示文案里的价格需要替换）
+      if (true) {
+        Modal.warning({
+          title: '提示',
+          content: (
+            <div className="reset-pm">
+              <p>
+                <span>点数不足，您可以通过单场付费 ¥1299 参与或者联系销售机构充值</span>
+              </p>
+              <div>
+                当前剩余点数：<span className={styles['link-text']}>{res.CompanyPoints}</span>
+              </div>
+              <div>
+                本次会议扣除点数：<span className={styles['link-text']}>{res.ActivityPoints}</span>
+              </div>
             </div>
-            <div>
-              本次会议扣除点数：<span className={styles['link-text']}>{res.ActivityPoints}</span>
+          ),
+          cancelText: '取消',
+          okText: '付费报名',
+          onOk: () => {
+            onNeedToDoSome && onNeedToDoSome()
+          },
+          width: 520,
+          centered: true
+        })
+        return
+      } else {
+        // 常规提示（不需要支付的）
+        Modal.warning({
+          title: '点数不足',
+          content: (
+            <div className="reset-pm">
+              <p>
+                <span>您的研选服务点数不足，若想报名，请联系对口销售升级套餐</span>
+                {/* <img src={TipsSvg} alt="icon" className={styles['link-tips-icon']} /> */}
+              </p>
+              <div>
+                当前剩余点数：<span className={styles['link-text']}>{res.CompanyPoints}</span>
+              </div>
+              <div>
+                本次会议扣除点数：<span className={styles['link-text']}>{res.ActivityPoints}</span>
+              </div>
             </div>
-          </div>
-        ),
-        okText: '知道了',
-        width: 520,
-        centered: true
-      })
-      return
+          ),
+          okText: '知道了',
+          width: 520,
+          centered: true
+        })
+        return
+      }
     }
+
     setResourceCountData({ CompanyPoints: res.CompanyPoints, ActivityPoints: res.ActivityPoints })
     // 4.邮箱绑定
     if (!res.CheckEmail) {
@@ -886,14 +886,6 @@ const ActivityBtnComponent: React.FC<IActivityBtnComponent> = props => {
         onCloseModel={handleOKApply}
       />
       <Picture visible={!!bigImg} imgSrc={bigImg} onClose={handleToCloseBigImg} />
-      {/* <YiDongModel visible={openYidongModel} handleClose={handleCloseYidong}  /> */}
-      {/* <PayProcessModel
-        dataInfo={dataInfo}
-        tryType={ITryType.Activity}
-        open={visibleBuyCard}
-        // applyTrial={visibleApply}
-        // onRefresh={onRefresh}
-      /> */}
       {isSpecial ? (
         <>
           <NButton

src/Activity/components/ActivityCard.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useState } from 'react'
 import useRequest from '@ahooksjs/use-request/es'
 import { useLocation, useHistory } from 'react-router-dom'
 
@@ -47,6 +47,7 @@ const ActivityCard: React.FC<IActivityCard> = props => {
   const history = useHistory()
   const login2p = useLogin2p()
   const location = useLocation()
+
   const stateString = [
     { state: IStateStringType.Waitting, name: '未开始', className: 'waitting-div' },
     { state: IStateStringType.Going, name: '进行中', className: 'going-div' },
@@ -64,13 +65,18 @@ const ActivityCard: React.FC<IActivityCard> = props => {
     }
   })
   const handleToDetail = (item: IActivityTypeListItem | IActivitySpecialListItem | INewestItem | IMyActivityItem) => {
-    // todo 易懂活动，无研选权限需要购买畅读卡
+    // 易懂活动，无权限时跳转详情页
     if (
       item?.AuthInfo?.HasPermission &&
       item?.AuthInfo?.HasPermission !== INewPermissionType.OK &&
       (item?.YidongActivityUrl || (item as IActivityTypeListItem)?.IsYidongActivity)
     ) {
-      return message.error('您暂无权限参加此活动，若想参加可以申请开通对应的试用权限')
+      window.open(
+        `${window.location.origin}/activity/detail/${
+          (item as IActivityTypeListItem)?.ActivityId || (item as INewestItem)?.SourceId
+        }`
+      )
+      // return message.error('您暂无权限参加此活动，若想参加可以申请开通对应的试用权限')
     }
     // 易懂同步过来的活动 直接跳转
     if (
@@ -99,6 +105,7 @@ const ActivityCard: React.FC<IActivityCard> = props => {
     }
     onOpenVideoOrAudio && onOpenVideoOrAudio(item)
   }
+
   if (!item) return null
   return (
     <>

src/Activity/components/YiDongModel.tsx

@@ -21,7 +21,7 @@ interface IYiDongModelProps {
 }
 
 /**
- * 易懂提示弹框
+ * 易懂提示弹框 不需要了（废弃
  */
 const YiDongModel: React.FC<IYiDongModelProps> = props => {
   const { visible, dataInfo, handleClose, onRefresh } = props
@@ -35,12 +35,10 @@ const YiDongModel: React.FC<IYiDongModelProps> = props => {
     onSuccess: res => {
       res.data.Ret === 200 ? message.success('已提交给您的对口销售，请耐心等待。') : message.info(res.data.Msg)
       handleToClose()
-      // setImageUrl(undefined)
     }
   })
   const handleToClose = () => {
     // 关闭前把名片给清除了
-    // setImageUrl(undefined)
     handleClose()
   }
   const handleBackClose = () => {
@@ -76,7 +74,6 @@ const YiDongModel: React.FC<IYiDongModelProps> = props => {
                 </div>
               }
             >
-              {/* <InfoCircleOutlined style={{ fontSize: 16 }} /> */}
               <img src={TipsSvg} alt="icon" className="paymodel-tips-icon" />
             </Tooltip>
           </div>

src/Collections/RecentInfo.tsx

@@ -121,7 +121,6 @@ const RecentInfo: React.FC<IRecentInfoProps> = props => {
       const url = `${window.location.origin}/indepth/info/${ChartPermissionId}/${list[0].IndustrialManagementId}`
       window.open(url)
     }
-    // todo 如有多个需打开弹框
   }
   // 滚动到指定位置
   const handleScrollToSubject = (ArticleId: number, ID: number) => {

src/Community/components/ResearchActivity.tsx

@@ -48,12 +48,15 @@ const ResearchActivity: React.FC<{ isRefresh?: boolean }> = props => {
 
   // 跳转到详情页
   const handleToDetail = (item: IActivityTypeListItem) => {
+    // 易懂活动，无权限时跳转详情页
     if (
       item?.AuthInfo?.HasPermission &&
       item?.AuthInfo?.HasPermission !== INewPermissionType.OK &&
       (item?.YidongActivityUrl || (item as IActivityTypeListItem)?.IsYidongActivity)
     ) {
-      return message.error('您暂无权限参加此活动，若想参加可以申请开通对应的试用权限')
+      window.open(`${window.location.origin}/activity/detail/${(item as IActivityTypeListItem).ActivityId}`)
+      // return message.error('您暂无权限参加此活动，若想参加可以申请开通对应的试用权限')
+      return
     }
     // 易懂同步过来的活动 直接跳转
     if ((item as IActivityTypeListItem)?.IsYidongActivity) {

src/Material/components/PayProcessModel.tsx

@@ -41,7 +41,7 @@ const PayProcessModel: React.FC<IPayProcessModelProps> = props => {
       manual: true,
       formatResult: response => response.data,
       onSuccess: res => {
-        // todo
+        // 订单创建成功打开支付二维码弹框
         res.Success ? setVisibleOrderCode(true) : message.error(res.Msg || res.ErrMsg)
       }
     }
@@ -53,7 +53,7 @@ const PayProcessModel: React.FC<IPayProcessModelProps> = props => {
       manual: true,
       formatResult: response => response.data,
       onSuccess: res => {
-        // todo
+        // 订单创建成功打开支付二维码弹框
         res.Success ? setVisibleOrderCode(true) : message.error(res.Msg || res.ErrMsg)
       }
     }
@@ -66,7 +66,6 @@ const PayProcessModel: React.FC<IPayProcessModelProps> = props => {
     }
   })
   useEffect(() => {
-    // todo
     if (open) {
       // 开启支付流程
       handleOpenBuyModel()
@@ -168,7 +167,6 @@ const PayProcessModel: React.FC<IPayProcessModelProps> = props => {
 
   // 订单支付结果
   const handleDoPayResult = (OrderRes: IOrderPayStatusRes) => {
-    // todo
     console.log('OrderRes', OrderRes)
     setPayInfo(OrderRes)
     switch (OrderRes.OrderStatus) {
@@ -199,7 +197,7 @@ const PayProcessModel: React.FC<IPayProcessModelProps> = props => {
         visible={visibleOrderCode}
         codeUrl={articleOrderInfo?.Data.CodeUrl || activityOrderInfo?.Data.CodeUrl || ''}
         orderCode={articleOrderInfo?.Data.OrderCode || activityOrderInfo?.Data.OrderCode || ''}
-        // countDown={todo}
+        // countDown={todo} 需要后端返回订单剩余支付时间
         onCloseModel={handleCloseCode}
         onSendPayResult={handleDoPayResult}
       />

src/Material/components/VideoAudioCard.tsx

@@ -83,7 +83,6 @@ const VideoAudioCard: React.FC<IVideoAudioCard> = props => {
   }
   // 收藏与取消收藏
   const handleCollectOrNot = (e: React.MouseEvent<HTMLElement, MouseEvent>) => {
-    // todo
     e.stopPropagation()
     applyCollect(item.SourceId || item.Id, item.Type)
   }

src/NewPageHeader.tsx

@@ -372,7 +372,6 @@ const NewPage: React.FC = props => {
           </Col>
         </Row>
       )}
-      {/* todo */}
       <ApplyPermission visible={visibleApply} onCloseModel={handleOKApply} />
     </div>
   )

src/Newest/components/NewestLibrary.tsx

@@ -53,7 +53,6 @@ const NewestLibrary: React.FC = props => {
     // ids && setActTagKeyword(ids.split(',').map(item => item))
     // !pid && !ids && setTagCheckList([])
 
-    // todo
     getNewestList({ PageSize: pageSize, CurrentIndex: 1, HashtagKeyword: themeKeyword, LabelKeyword: actTagKeyword })
 
     // eslint-disable-next-line react-hooks/exhaustive-deps

src/Personal/Personal.service.ts

@@ -13,7 +13,7 @@ export interface IMyActivityItem {
   ActivityType: number // 活动线上线下类型 1线上，0 线下，2线下
   ActivityTypeId: number
   ActivityTypeName: string
-  ArticleList: null // todo
+  ArticleList: null
   AudioLink?: boolean //是否展示回放按钮
   AuthInfo: IAuthInfo
   ChartPermissionId: number

src/Personal/PersonalIndex.tsx

@@ -52,7 +52,7 @@ const beforeUpload = (file: RcFile) => {
 /**个人中心 */
 const PersonalIndex: React.FC = () => {
   const login2p = useLogin2p()
-  const [actMenu, setActMenu] = useState<number>(IMyMenuType.Order)
+  const [actMenu, setActMenu] = useState<number>(IMyMenuType.Schedule)
   const [visibleApply, setVisibleApply] = useState(false)
 
   const [menuOption, setMenuOption] = useState<{ key: IMyMenuType; name: string }[]>([