This commit is contained in:
chashaobao
2025-12-02 21:18:50 +08:00
parent a07b015d8e
commit 288521ebd9
10 changed files with 381 additions and 143 deletions

View File

@ -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';
@ -11,9 +11,17 @@ import { OrderStatus, OrderType, ProductSpecId, ProductType } from '@/constants/
import { SubscribeTempId } from '@/constants/subscribe';
import { logWithPrefix } from '@/utils/common';
import { collectEvent, reportEvent } from '@/utils/event';
import { getOrderPrice, isCancelPay, requestCreatePayInfo, requestOrderInfo, requestPayment } from '@/utils/product';
import {
getOrderPrice,
isCancelPay,
requestCreatePayInfo,
requestOrderInfo,
requestPayment,
requestProductTypeList,
} from '@/utils/product';
import { postSubscribe, subscribeMessage } from '@/utils/subscribe';
import Toast from '@/utils/toast';
import { ProductSpecResult } from '@/types/product';
interface IProps {
onNext: () => void;
@ -82,22 +90,35 @@ const subscribe = async () => {
postSubscribe(TEMP_IDS, successIds);
};
const getJsonContent = (jsonString: string) => {
try {
return JSON.parse(jsonString);
} catch (e) {
return [];
}
};
export default function CompanyPublishJobBuy(props: IProps) {
const { onNext } = props;
const [selectItem, setSelectItem] = useState(LIST[0]);
const [productList, setProductList] = useState<ProductSpecResult[]>([]);
const [selectItem, setSelectItem] = useState<ProductSpecResult | undefined>();
const handleClickItem = useCallback((newSelectItem: Item) => setSelectItem(newSelectItem), []);
const handleClickItem = useCallback((newSelectItem: ProductSpecResult) => setSelectItem(newSelectItem), []);
const handleBuy = useCallback(async () => {
log('handleBuy');
reportEvent(ReportEventId.CLICK_PAY_PUBLISH_JOB);
if (!selectItem) {
Toast.error('请选择购买的产品');
return;
}
try {
Taro.showLoading();
const { payOrderNo, createPayInfo } = await requestCreatePayInfo({
type: OrderType.CompanyVip,
amt: getOrderPrice(selectItem.amt),
amt: selectItem.payPrice,
productCode: ProductType.BOSS_VIP_NEW,
productSpecId: selectItem.id,
productSpecId: selectItem.productSpecId,
});
log('handleBuy payInfo', payOrderNo, createPayInfo);
await requestPayment({
@ -121,8 +142,14 @@ export default function CompanyPublishJobBuy(props: IProps) {
log('handleBuy error', e);
}
}, [selectItem, onNext]);
const handleGetProductInfo = useCallback(async () => {
const result = await requestProductTypeList(ProductType.BOSS_VIP_NEW);
setProductList(result);
setSelectItem(result[0]);
}, []);
useEffect(() => {
handleGetProductInfo();
collectEvent(CollectEventName.CREATE_ORDER_VIEW, { orderType: OrderType.BossVip, source: 'user-page' });
}, []);
@ -130,19 +157,21 @@ export default function CompanyPublishJobBuy(props: IProps) {
<div className={`${PREFIX}__company-publish-job-buy`}>
<div className={`${PREFIX}__company-publish-job-buy__header`}></div>
<div className={`${PREFIX}__company-publish-job-buy__price-container`}>
{LIST.map(item => (
{productList.map(item => (
<div
key={item.price}
key={item.payPrice}
className={classNames(`${PREFIX}__company-publish-job-buy__item`, {
selected: item.amt === selectItem.amt,
disabled: item.amt === 0,
selected: selectItem && item.payPrice === selectItem.payPrice,
disabled: item.payPrice === 0,
})}
onClick={item.amt === 0 ? undefined : () => handleClickItem(item)}
onClick={item.payPrice === 0 ? undefined : () => handleClickItem(item)}
>
<div className={classNames(`${PREFIX}__company-publish-job-buy__item__title`, { free: item.amt === 0 })}>
<div
className={classNames(`${PREFIX}__company-publish-job-buy__item__title`, { free: item.payPrice === 0 })}
>
{item.title}
</div>
<div className={`${PREFIX}__company-publish-job-buy__item__price`}>{item.price}</div>
<div className={`${PREFIX}__company-publish-job-buy__item__price`}>{item.priceText}</div>
{item.badge && <Badge className={`${PREFIX}__company-publish-job-buy__item__badge`} text={item.badge} />}
</div>
))}
@ -152,20 +181,24 @@ export default function CompanyPublishJobBuy(props: IProps) {
<div className={`${PREFIX}__company-publish-job-buy__divider__title`}></div>
<div className={`${PREFIX}__company-publish-job-buy__divider__right-line`} />
</div>
<div className={`${PREFIX}__company-publish-job-buy__contents`}>
{selectItem.contents.map(i => (
<div
className={classNames(`${PREFIX}__company-publish-job-buy__content`, { highlight: i.highlight })}
key={i.content}
>
{i.content}
{i.inlineHighlight && <div className="highlight-span">{i.inlineHighlight}</div>}
{selectItem && (
<Fragment>
<div className={`${PREFIX}__company-publish-job-buy__contents`}>
{getJsonContent(selectItem.contentsJson).map(i => (
<div
className={classNames(`${PREFIX}__company-publish-job-buy__content`, { highlight: i.highlight })}
key={i.content}
>
{i.content}
{i.inlineHighlight && <div className="highlight-span">{i.inlineHighlight}</div>}
</div>
))}
</div>
))}
</div>
<Button className={`${PREFIX}__company-publish-job-buy__button`} onClick={handleBuy}>
{`支付${selectItem.amt}`}
</Button>
<Button className={`${PREFIX}__company-publish-job-buy__button`} onClick={handleBuy}>
{`支付${selectItem.showPrice}`}
</Button>
</Fragment>
)}
</div>
);
}