feat:
This commit is contained in:
@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user