magic-csb/boluo-app-main
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 代招代发

Browse Source
This commit is contained in:
chashaobao
2025-11-06 00:06:03 +08:00
parent 5e3e6903cb
commit 4d146fb1e4
14 changed files with 300 additions and 162 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/user-batch-publish/index.less
View File

@ -13,9 +13,9 @@
&__title {
font-size: 32px;
line-height: 48px;
font-weight: 500;
color: @blColor;
margin-top: 24px;
margin-top: 32px;
font-weight: 400;
color: #1d2129;
&:first-child {
margin-top: 0;
@ -30,13 +30,21 @@
margin-top: 24px;
}
&__extra {
margin-top: 24px;
font-weight: 400;
font-size: 24px;
line-height: 40px;
color: @blHighlightColor;
}
&__cost-describe {
height: 100px;
padding: 0 32px;
border-radius: 16px;
.flex-row();
justify-content: space-between;
background: #FFFFFF;
background: #ffffff;
margin-top: 24px;
&__price {
@ -64,9 +72,22 @@
line-height: 48px;
font-weight: 400;
color: @blColorG2;
background: #FFFFFF;
background: #ffffff;
border-radius: 16px;
.underline {
display: inline;
font-weight: 500;
font-size: 32px;
line-height: 48px;
color: @blColor;
position: relative;
background-image: linear-gradient(to bottom, rgba(109, 61, 245, 0.6) 0%, rgba(109, 61, 245, 0.6) 100%);
background-repeat: no-repeat;
background-size: 100% 12px;
background-position: bottom;
}
&__describe {
.flex-row();
font-size: 28px;
@ -86,4 +107,16 @@
.button(@width: 100%; @height: 80px; @fontSize: 32px);
margin-top: 40px;
}
&__publish-title {
font-size: 36px;
font-weight: 500;
line-height: 56px;
color: @blColor;
}
&__publish-button {
.button(@width: 360px, @height: 72px, @fontSize: 28px, @fontWeight: 400, @borderRadius: 44px);
margin: 40px auto auto;
}
}

117
src/components/user-batch-publish/index.tsx
View File

@ -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>
);