feat: 代招代发
This commit is contained in:
chashaobao
@ -1,17 +1,21 @@
|
||||
import { Button, Text } from '@tarojs/components';
|
||||
import { Button } from '@tarojs/components';
|
||||
import Taro from '@tarojs/taro';
|
||||
|
||||
import { Cell } from '@taroify/core';
|
||||
import { useCallback, useState, useEffect } from 'react';
|
||||
import { Cell, Dialog } from '@taroify/core';
|
||||
import { Fragment, useCallback, useEffect, useState } from 'react';
|
||||
|
||||
import PageLoading from '@/components/page-loading';
|
||||
import { PublishJobQrCodeDialog } from '@/components/product-dialog/publish-job';
|
||||
import CompanyPublishJobBuy from '@/components/product-dialog/steps-ui/company-publish-job-buy';
|
||||
import SafeBottomPadding from '@/components/safe-bottom-padding';
|
||||
import { ISelectOption, PopupSelect } from '@/components/select';
|
||||
import { ISelectOption } from '@/components/select';
|
||||
import { PageUrl } from '@/constants/app';
|
||||
import { JobManageStatus } from '@/constants/job';
|
||||
import { OrderStatus, OrderType, ProductSpecId, ProductType } from '@/constants/product';
|
||||
import { usePublishJob } from '@/hooks/use-publish-job';
|
||||
import { BatchPublishGroup } from '@/types/group';
|
||||
import { logWithPrefix } from '@/utils/common';
|
||||
import { requestJobDetail } from '@/utils/job';
|
||||
import {
|
||||
getOrderPrice,
|
||||
isCancelPay,
|
||||
@ -22,7 +26,6 @@ import {
|
||||
} from '@/utils/product';
|
||||
import { navigateTo } from '@/utils/route';
|
||||
import Toast from '@/utils/toast';
|
||||
|
||||
import './index.less';
|
||||
|
||||
interface CityValue extends BatchPublishGroup {
|
||||
@ -35,11 +38,7 @@ interface CityOption extends ISelectOption<CityValue> {
|
||||
|
||||
const PREFIX = 'user-batch-publish';
|
||||
const log = logWithPrefix(PREFIX);
|
||||
const SERVICE_ILLUSTRATE = `服务方式：帮您把招聘需求发到众多同城合作主播群
|
||||
群发次数：杭州、广州发3次，其他城市1次
|
||||
内容要求：仅限带货主播招聘需求，其他不发
|
||||
主播联系：内容中留招聘方联系方式，主播直接联系`;
|
||||
const cityValues: CityValue[] = [
|
||||
export const cityValues: CityValue[] = [
|
||||
{ cityCode: '440100', cityName: '广州', count: 800 },
|
||||
{ cityCode: '440300', cityName: '深圳', count: 100 },
|
||||
{ cityCode: '330100', cityName: '杭州', count: 750 },
|
||||
@ -79,20 +78,14 @@ const calcPrice = (city: CityValue | null) => {
|
||||
return { price, originalPrice, productSpecId };
|
||||
};
|
||||
|
||||
export default function UserBatchPublish() {
|
||||
export default function UserBatchPublish({ cityCode, jobId }: { cityCode: string; jobId: string }) {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [showCitySelect, setShowCitySelect] = useState(false);
|
||||
const [showQrCode, setShowQrCode] = useState(false);
|
||||
const [city, setCity] = useState<CityOption['value'] | null>(null);
|
||||
const [cityOptions, setCityOptions] = useState<CityOption[]>([]);
|
||||
const { price, originalPrice, productSpecId } = calcPrice(city);
|
||||
const [showPublishJob, setShowPublishJob] = useState(false);
|
||||
|
||||
const handleClickCity = useCallback(() => setShowCitySelect(true), []);
|
||||
|
||||
const handleSelectCity = useCallback(value => {
|
||||
setCity(value);
|
||||
setShowCitySelect(false);
|
||||
}, []);
|
||||
const [showBuy, setShowBuy, handlePublishJob] = usePublishJob(jobId);
|
||||
|
||||
const handleClickViewGroup = useCallback(() => navigateTo(PageUrl.GroupList, { city: city?.cityCode }), [city]);
|
||||
|
||||
@ -114,6 +107,14 @@ export default function UserBatchPublish() {
|
||||
setShowQrCode(true);
|
||||
return;
|
||||
}
|
||||
|
||||
const jobDetail = await requestJobDetail(jobId);
|
||||
|
||||
if (jobDetail.status !== JobManageStatus.Open) {
|
||||
setShowPublishJob(true);
|
||||
return;
|
||||
}
|
||||
|
||||
const { payOrderNo, createPayInfo } = await requestCreatePayInfo({
|
||||
type: OrderType.GroupBatchPublish,
|
||||
amt: getOrderPrice(price),
|
||||
@ -141,21 +142,25 @@ export default function UserBatchPublish() {
|
||||
Toast.error(isCancelPay(e) ? '取消购买' : '购买失败请重试');
|
||||
log('handleBuy error', e);
|
||||
}
|
||||
}, [price, productSpecId]);
|
||||
}, [jobId, price, productSpecId]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!cityCode) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const cOptions: CityOption[] = cityValues.map(value => ({ value, label: value.cityName }));
|
||||
const initCity = (cOptions.find(o => o.label === '重庆') || cOptions[0]).value;
|
||||
const initCity = cityValues.find(o => o.cityCode === cityCode);
|
||||
|
||||
setLoading(false);
|
||||
setCity(initCity);
|
||||
setCityOptions(cOptions);
|
||||
log('init data done', cOptions);
|
||||
if (initCity) {
|
||||
setCity(initCity);
|
||||
} else {
|
||||
Toast.info('当前城市不支持代发');
|
||||
}
|
||||
} catch (e) {
|
||||
Toast.error('加载失败请重试');
|
||||
}
|
||||
}, []);
|
||||
}, [cityCode]);
|
||||
|
||||
if (loading) {
|
||||
return <PageLoading />;
|
||||
@ -164,38 +169,46 @@ export default function UserBatchPublish() {
|
||||
return (
|
||||
<div className={PREFIX}>
|
||||
{/*<Image mode="widthFix" className={`${PREFIX}__header-image`} src="https://neighbourhood.cn/pubJob.png" />*/}
|
||||
<div className={`${PREFIX}__title`}>请选择城市</div>
|
||||
<Cell isLink align="center" className={`${PREFIX}__cell`} title={city?.cityName} onClick={handleClickCity} />
|
||||
<div className={`${PREFIX}__title`}>可购买群数</div>
|
||||
<Cell align="center" className={`${PREFIX}__cell`} title={city?.count} />
|
||||
<div className={`${PREFIX}__title`}>服务费用</div>
|
||||
<div className={`${PREFIX}__cost-describe`}>
|
||||
<div className={`${PREFIX}__cost-describe__price`}>{`${price}元`}</div>
|
||||
<div className={`${PREFIX}__cost-describe__original_price`}>{`原价：${originalPrice}元`}</div>
|
||||
</div>
|
||||
<div className={`${PREFIX}__title`}>服务说明</div>
|
||||
<div className={`${PREFIX}__illustrate`}>
|
||||
<Text>{SERVICE_ILLUSTRATE}</Text>
|
||||
<div className={`${PREFIX}__illustrate__describe`}>
|
||||
<div>附：</div>
|
||||
<div className={`${PREFIX}__illustrate__describe__view`} onClick={handleClickViewGroup}>
|
||||
播络合作群列表
|
||||
</div>
|
||||
</div>
|
||||
服务方式：帮您把招聘需求<div className="underline">发到本地主播群，投递量大幅增加</div>
|
||||
</div>
|
||||
<Button className={`${PREFIX}__buy-button`} onClick={handleClickBuy}>
|
||||
立即购买
|
||||
</Button>
|
||||
<div className={`${PREFIX}__title`}>当前通告城市</div>
|
||||
<Cell align="center" className={`${PREFIX}__cell`} title={city ? city.cityName : '暂不支持代发'} />
|
||||
{city && (
|
||||
<Fragment>
|
||||
<div className={`${PREFIX}__extra`} onClick={handleClickViewGroup}>
|
||||
查看该城市合作群列表
|
||||
</div>
|
||||
<div className={`${PREFIX}__title`}>可购买群数</div>
|
||||
<Cell align="center" className={`${PREFIX}__cell`} title={city?.count} />
|
||||
<div className={`${PREFIX}__title`}>服务费用</div>
|
||||
<div className={`${PREFIX}__cost-describe`}>
|
||||
<div className={`${PREFIX}__cost-describe__price`}>{`${price}元`}</div>
|
||||
<div className={`${PREFIX}__cost-describe__original_price`}>{`原价：${originalPrice}元`}</div>
|
||||
</div>
|
||||
|
||||
<Button className={`${PREFIX}__buy-button`} onClick={handleClickBuy}>
|
||||
立即购买
|
||||
</Button>
|
||||
</Fragment>
|
||||
)}
|
||||
<SafeBottomPadding />
|
||||
<div>
|
||||
<PopupSelect
|
||||
value={city}
|
||||
options={cityOptions}
|
||||
open={showCitySelect}
|
||||
onSelect={handleSelectCity}
|
||||
onClose={() => setShowCitySelect(false)}
|
||||
/>
|
||||
<PublishJobQrCodeDialog onClose={() => setShowQrCode(false)} open={showQrCode} />
|
||||
<Dialog open={showBuy} onClose={() => setShowBuy(false)}>
|
||||
<Dialog.Content>
|
||||
<CompanyPublishJobBuy onNext={handlePublishJob} />
|
||||
</Dialog.Content>
|
||||
</Dialog>
|
||||
<Dialog open={showPublishJob} onClose={() => setShowPublishJob(false)}>
|
||||
<Dialog.Content>
|
||||
<div className={`${PREFIX}__publish-title`}>请先发布通告</div>
|
||||
<Button className={`${PREFIX}__publish-button`} onClick={handlePublishJob}>
|
||||
发布该通告
|
||||
</Button>
|
||||
</Dialog.Content>
|
||||
</Dialog>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user