feat: 广告

2025-07-07 01:15:50 +08:00
parent de7f0e14fe
commit e8cf28b6e9
18 changed files with 507 additions and 53 deletions
--- a/src/components/product-dialog/const.ts
+++ b/src/components/product-dialog/const.ts
@ -3,6 +3,7 @@ export const PREFIX = 'product-dialog';
 export enum DialogStatus {
  // 加载中
  LOADING = 'loading',
+  PRE_ACTION = 'pre_action',
  // 直接联系通告主
  JOB_CONTACT_DIRECT = 'job_contact_direct',
  // 联系客服去联系通告主 -> 订阅通知
@ -13,6 +14,7 @@ export enum DialogStatus {
  JOB_UNABLE_UNLOCK = 'job_unable_unlock',
  // 通告解锁次数用完，购买界面
  JOB_BUY = 'job_buy',
+  PREACTION_JOB_BUY = 'preaction_job_buy',
  // 加群二维码
  GROUP_QR_CODE = 'group_qr_code',
  // 确定加群
--- a/src/components/product-dialog/index.less
+++ b/src/components/product-dialog/index.less
@ -133,6 +133,7 @@
    &__header {
      .flex-row();
      .header-font();
+      font-size: 32px;

      .highlight {
        color: @blHighlightColor;
@ -143,7 +144,8 @@
    &__describe {
      .flex-row();
      .describe-font();
-      margin-top: 24px;
+      margin-top: 18px;
+      line-height: 40px;

      .highlight {
        color: @blHighlightColor;
@ -158,13 +160,13 @@

    &__item {
      position: relative;
-      width: 170px;
+      width: 182px;
      height: 192px;
      .flex-column();
      justify-content: center;
      border: 2px solid @blHighlightColor;
      border-radius: 8px;
-      margin-right: 24px;
+      margin-right: 15px;

      &:last-child {
        margin-right: 0;
@ -660,4 +662,4 @@
    }
  }

-}
+}
--- a/src/components/product-dialog/job/index.tsx
+++ b/src/components/product-dialog/job/index.tsx
@ -3,20 +3,24 @@ import Taro from '@tarojs/taro';
 import { Dialog } from '@taroify/core';
 import { useCallback, useEffect, useRef, useState } from 'react';

+import { PrejobPopup } from '@/components/prejob-popup';
 import { DialogStatus, PREFIX } from '@/components/product-dialog/const';
 import JobBuy from '@/components/product-dialog/steps-ui/job-buy';
 import ContactCustomerService from '@/components/product-dialog/steps-ui/job-contact-customer';
 import ContactDirect from '@/components/product-dialog/steps-ui/job-contact-direct';
 import UnableUnlockContent from '@/components/product-dialog/steps-ui/job-unable';
+import { EventName } from '@/constants/app';
+import { GET_CONTACT_TYPE } from '@/constants/job';
 import { DeclarationType, ProductType } from '@/constants/product';
 import { JobDetails } from '@/types/job';
 import { ProductInfo } from '@/types/product';
 import { logWithPrefix } from '@/utils/common';
+import { getSkipPrejobAction, setSkipPrejobAction } from '@/utils/job';
 import {
-  requestProductUseRecord,
-  requestProductBalance,
-  requestUseProduct,
  requestAllBuyProduct,
+  requestProductBalance,
+  requestProductUseRecord,
+  requestUseProduct,
 } from '@/utils/product';
 import Toast from '@/utils/toast';

@ -33,13 +37,31 @@ const log = logWithPrefix('product-job-dialog');
 function ProductJobDialog(props: Omit<IProps, 'visible'>) {
  const { data, onClose } = props;
  const [status, setStatus] = useState<DialogStatus>(DialogStatus.LOADING);
+  const [showContact, setShowContact] = useState(false);
+  const [showPrejob, setShowPrejob] = useState(false);
  const [publisherAcctNo, setPublisherAcctNo] = useState<string>('');
-  const initRef = useRef(() => {});
+  const initRef = useRef<(skipPreAction?: boolean, skipRecordGet?: boolean) => void | Promise<void>>(() => {});

  const handleCloseDialog = useCallback(() => {
+    setShowContact(false);
    onClose();
  }, [onClose]);

+  const handleClosePrejob = useCallback(() => {
+    setShowPrejob(false);
+  }, []);
+
+  const handleConfirmPrejob = useCallback(async (type: GET_CONTACT_TYPE) => {
+    if (type === GET_CONTACT_TYPE.VIP) {
+      const allowBuy = await requestAllBuyProduct(PRODUCT_CODE);
+      setShowContact(true);
+      setShowPrejob(false);
+      setStatus(allowBuy ? DialogStatus.PREACTION_JOB_BUY : DialogStatus.JOB_UNABLE_UNLOCK);
+    } else if (type === GET_CONTACT_TYPE.VIDEO) {
+      Taro.eventCenter.trigger(EventName.SHOW_VIDEO_REWARD);
+    }
+  }, []);
+
  const handleAfterBuy = useCallback(async () => {
    const time = await requestProductBalance(PRODUCT_CODE);
    if (time <= 0) {
@ -49,6 +71,8 @@ function ProductJobDialog(props: Omit<IProps, 'visible'>) {
    }
    const productInfo = await requestUseProduct(PRODUCT_CODE, { jobId: data.id });
    const declarationTypeResult = productInfo.declarationTypeResult;
+    setShowContact(true);
+    setShowPrejob(false);
    if (declarationTypeResult?.type === DeclarationType.Direct && declarationTypeResult.publisherAcctNo) {
      setStatus(DialogStatus.JOB_CONTACT_DIRECT);
      setPublisherAcctNo(declarationTypeResult.publisherAcctNo);
@ -62,8 +86,9 @@ function ProductJobDialog(props: Omit<IProps, 'visible'>) {
  }, [data]);

  useEffect(() => {
-    initRef.current = async () => {
+    initRef.current = async (skipPreAction?: boolean, skipRecordGet?: boolean) => {
      const handleContact = (declarationTypeResult?: ProductInfo['declarationTypeResult']) => {
+        setShowContact(true);
        if (declarationTypeResult?.type === DeclarationType.Direct && declarationTypeResult.publisherAcctNo) {
          setStatus(DialogStatus.JOB_CONTACT_DIRECT);
          setPublisherAcctNo(declarationTypeResult.publisherAcctNo);
@ -77,19 +102,34 @@ function ProductJobDialog(props: Omit<IProps, 'visible'>) {
        //   setStatus(DialogStatus.JOB_CONTACT_CS);
        //   return;
        // }
-        const result = await requestProductUseRecord(PRODUCT_CODE, { jobId: data.id });
-        log('requestProductUseRecord result', result);
-        if (result) {
-          handleContact(result.declarationTypeResult);
-          return;
+        if (!skipRecordGet) {
+          const result = await requestProductUseRecord(PRODUCT_CODE, { jobId: data.id });
+          log('requestProductUseRecord result', result);
+          if (result) {
+            handleContact(result.declarationTypeResult);
+            return;
+          }
        }
        const time = await requestProductBalance(PRODUCT_CODE);
        if (time <= 0) {
          const allowBuy = await requestAllBuyProduct(PRODUCT_CODE);
+          setShowContact(true);
          setStatus(allowBuy ? DialogStatus.JOB_BUY : DialogStatus.JOB_UNABLE_UNLOCK);
-        } else {
+        }
+        // 创建模卡之后可以直接解锁一次, 分享后解锁一次
+        else if (getSkipPrejobAction() || skipPreAction) {
          const productInfo = await requestUseProduct(PRODUCT_CODE, { jobId: data.id });
+          setShowPrejob(false);
+          if (!skipPreAction) {
+            setSkipPrejobAction(false);
+          }
          handleContact(productInfo.declarationTypeResult);
+        } else {
+          setShowPrejob(true);
+          setStatus(DialogStatus.PRE_ACTION);
+
+          // const productInfo = await requestUseProduct(PRODUCT_CODE, { jobId: data.id });
+          // handleContact(productInfo.declarationTypeResult);
        }
      } catch (e) {
        Toast.error('出错了，请重试');
@ -104,21 +144,44 @@ function ProductJobDialog(props: Omit<IProps, 'visible'>) {
    initRef.current();
  }, []);

+  useEffect(() => {
+    Taro.eventCenter.once(EventName.PRE_ACTION_SHARE_SUCCESS, () => {
+      initRef.current(true, true);
+    });
+    Taro.eventCenter.on(EventName.PRE_ACTION_VIDEO_SUCCESS, () => {
+      initRef.current(true, true);
+    });
+
+    return () => {
+      Taro.eventCenter.off(EventName.PRE_ACTION_SHARE_SUCCESS);
+      Taro.eventCenter.off(EventName.PRE_ACTION_VIDEO_SUCCESS);
+    };
+  }, []);
+
  if (status === DialogStatus.LOADING) {
    return null;
  }

  return (
-    <Dialog className={PREFIX} onClose={onClose} open>
-      <Dialog.Content>
-        {status === DialogStatus.JOB_CONTACT_CS && <ContactCustomerService onAfterConfirm={handleCloseDialog} />}
-        {status === DialogStatus.JOB_CONTACT_DIRECT && (
-          <ContactDirect publisherAcctNo={publisherAcctNo} onAfterConfirm={handleCloseDialog} onReport={handleReport} />
-        )}
-        {status === DialogStatus.JOB_BUY && <JobBuy onConfirm={handleAfterBuy} />}
-        {status === DialogStatus.JOB_UNABLE_UNLOCK && <UnableUnlockContent onConfirm={handleCloseDialog} />}
-      </Dialog.Content>
-    </Dialog>
+    <div>
+      <PrejobPopup open={showPrejob} onCancel={handleClosePrejob} onConfirm={handleConfirmPrejob} />
+      <Dialog className={PREFIX} onClose={onClose} open={showContact}>
+        <Dialog.Content>
+          {status === DialogStatus.JOB_CONTACT_CS && <ContactCustomerService onAfterConfirm={handleCloseDialog} />}
+          {status === DialogStatus.JOB_CONTACT_DIRECT && (
+            <ContactDirect
+              publisherAcctNo={publisherAcctNo}
+              onAfterConfirm={handleCloseDialog}
+              onReport={handleReport}
+            />
+          )}
+          {(status === DialogStatus.JOB_BUY || status === DialogStatus.PREACTION_JOB_BUY) && (
+            <JobBuy onConfirm={handleAfterBuy} justBuy={status === DialogStatus.PREACTION_JOB_BUY} />
+          )}
+          {status === DialogStatus.JOB_UNABLE_UNLOCK && <UnableUnlockContent onConfirm={handleCloseDialog} />}
+        </Dialog.Content>
+      </Dialog>
+    </div>
  );
 }

--- a/src/components/product-dialog/steps-ui/job-buy.tsx
+++ b/src/components/product-dialog/steps-ui/job-buy.tsx
@ -2,7 +2,7 @@ import Taro from '@tarojs/taro';

 import { Button } from '@taroify/core';
 import classNames from 'classnames';
-import { useCallback, useEffect, useState } from 'react';
+import { Fragment, useCallback, useEffect, useState } from 'react';

 import Badge from '@/components/badge';
 import { PREFIX } from '@/components/product-dialog/const';
@ -16,6 +16,7 @@ import { postSubscribe, subscribeMessage } from '@/utils/subscribe';
 import Toast from '@/utils/toast';

 interface IProps {
+  justBuy?: boolean;
  onConfirm: () => void;
 }

@ -29,22 +30,22 @@ interface Item {
 }

 const LIST: Item[] = [
-  { id: ProductSpecId.WeeklyVIP, title: '非会员', content: '每日2次', price: '免费', amt: 0 },
+  { id: ProductSpecId.WeeklyVIP, title: '日会员', content: '1天内免广告', price: '60播豆', amt: 6, badge: '限时体验' },
  {
    id: ProductSpecId.WeeklyVIP,
    title: '周会员',
-    content: '每日5次',
-    price: '60播豆',
-    amt: 6,
-    badge: '限时体验',
+    content: '7天内免广告',
+    price: '180播豆',
+    amt: 18,
+    badge: '4.2折',
  },
  {
    id: ProductSpecId.NewMonthlyVIP,
    title: '月会员',
-    content: '每日5次',
-    price: '180播豆',
-    amt: 18,
-    badge: ' 超值',
+    content: '30天内免广告',
+    price: '300播豆',
+    amt: 30,
+    badge: '1.6折',
  },
 ];

@ -75,6 +76,7 @@ export default function JobBuy(props: IProps) {
        type: OrderType.VIP,
        amt: getOrderPrice(selectItem.amt),
        productCode: ProductType.VIP,
+        // todo: 日会员的 productSpectId 是什么？
        productSpecId: selectItem.id,
      });
      log('handleBuy payInfo', payOrderNo, createPayInfo);
@ -107,14 +109,26 @@ export default function JobBuy(props: IProps) {
  return (
    <div className={`${PREFIX}__job-buy`}>
      <div className={`${PREFIX}__job-buy__header`}>
-        <div>今日通告对接次数</div>
-        <div className="highlight">已用完</div>
+        {props.justBuy ? (
+          <div>开通播络会员即可直接查看联系方式</div>
+        ) : (
+          <Fragment>
+            <div>今日通告对接次数</div>
+            <div className="highlight">已用完</div>
+          </Fragment>
+        )}
      </div>
      <div className={`${PREFIX}__job-buy__describe`}>
-        <div>请</div>
-        <div className="highlight">明日</div>
-        <div>再来 或 </div>
-        <div className="highlight">升级会员</div>
+        {props.justBuy ? (
+          <div>每天可查看10个联系方式</div>
+        ) : (
+          <Fragment>
+            <div>请</div>
+            <div className="highlight">明日</div>
+            <div>再来 或 </div>
+            <div className="highlight">升级会员</div>
+          </Fragment>
+        )}
      </div>
      <div className={`${PREFIX}__job-buy__container`}>
        {LIST.map(item => (