feat:
This commit is contained in:
chashaobao
@ -2,7 +2,7 @@ import { Button } from '@tarojs/components';
|
||||
import Taro from '@tarojs/taro';
|
||||
|
||||
import { Cell, Dialog } from '@taroify/core';
|
||||
import { Fragment, useCallback, useEffect, useState } from 'react';
|
||||
import { Fragment, useCallback, useEffect, useMemo, useState } from 'react';
|
||||
|
||||
import PageLoading from '@/components/page-loading';
|
||||
import { PublishJobQrCodeDialog } from '@/components/product-dialog/publish-job';
|
||||
@ -11,9 +11,10 @@ import SafeBottomPadding from '@/components/safe-bottom-padding';
|
||||
import { ISelectOption, PopupSelect } from '@/components/select';
|
||||
import { PageUrl } from '@/constants/app';
|
||||
import { JobManageStatus } from '@/constants/job';
|
||||
import { OrderStatus, OrderType, ProductSpecId, ProductType } from '@/constants/product';
|
||||
import { OrderStatus, OrderType, ProductType } from '@/constants/product';
|
||||
import useCityOperators from '@/hooks/use-city-operators';
|
||||
import { usePublishJob } from '@/hooks/use-publish-job';
|
||||
import { BatchPublishGroup } from '@/types/group';
|
||||
import { CityConfigListItem } from '@/types/location';
|
||||
import { logWithPrefix } from '@/utils/common';
|
||||
import { requestJobDetail } from '@/utils/job';
|
||||
import {
|
||||
@ -28,65 +29,29 @@ import { navigateTo } from '@/utils/route';
|
||||
import Toast from '@/utils/toast';
|
||||
import './index.less';
|
||||
|
||||
interface CityValue extends BatchPublishGroup {
|
||||
cityName: string;
|
||||
}
|
||||
|
||||
interface CityOption extends ISelectOption<CityValue> {
|
||||
value: CityValue;
|
||||
interface CityOption extends ISelectOption<CityConfigListItem> {
|
||||
value: CityConfigListItem;
|
||||
}
|
||||
|
||||
const PREFIX = 'user-batch-publish';
|
||||
const log = logWithPrefix(PREFIX);
|
||||
export const cityValues: CityValue[] = [
|
||||
{ cityCode: '440100', cityName: '广州', count: 800 },
|
||||
{ cityCode: '440300', cityName: '深圳', count: 100 },
|
||||
{ cityCode: '330100', cityName: '杭州', count: 750 },
|
||||
{ cityCode: '110100', cityName: '北京', count: 150 },
|
||||
{ cityCode: '510100', cityName: '成都', count: 100 },
|
||||
{ cityCode: '500100', cityName: '重庆', count: 50 },
|
||||
{ cityCode: '430100', cityName: '长沙', count: 50 },
|
||||
{ cityCode: '350200', cityName: '厦门', count: 50 },
|
||||
{ cityCode: '310100', cityName: '上海', count: 150 },
|
||||
{ cityCode: '420100', cityName: '武汉', count: 80 },
|
||||
{ cityCode: '610100', cityName: '西安', count: 60 },
|
||||
{ cityCode: '410100', cityName: '郑州', count: 150 },
|
||||
].sort((a, b) => b.count - a.count);
|
||||
const MIN_GROUP_SIZE = 20;
|
||||
const GROUP_OPTIONS = [
|
||||
{ value: MIN_GROUP_SIZE, productSpecId: ProductSpecId.GroupBatchPublish20, label: '20', price: 18 },
|
||||
{ value: 50, productSpecId: ProductSpecId.GroupBatchPublish50, label: '50', price: 40 },
|
||||
{ value: 60, productSpecId: ProductSpecId.GroupBatchPublish60, label: '60', price: 48 },
|
||||
{ value: 80, productSpecId: ProductSpecId.GroupBatchPublish80, label: '80', price: 58 },
|
||||
{ value: 100, productSpecId: ProductSpecId.GroupBatchPublish100, label: '100', price: 68 },
|
||||
{ value: 150, productSpecId: ProductSpecId.GroupBatchPublish150, label: '150', price: 98 },
|
||||
{ value: 300, productSpecId: ProductSpecId.GroupBatchPublish300, label: '300', price: 128 },
|
||||
{ value: 500, productSpecId: ProductSpecId.GroupBatchPublish500, label: '500', price: 168 },
|
||||
{ value: 750, productSpecId: ProductSpecId.GroupBatchPublish750, label: '750', price: 188 },
|
||||
{ value: 800, productSpecId: ProductSpecId.GroupBatchPublish800, label: '800', price: 198 },
|
||||
{ value: 1000, productSpecId: ProductSpecId.GroupBatchPublish1000, label: '1000', price: 288 },
|
||||
];
|
||||
|
||||
const calcPrice = (city: CityValue | null) => {
|
||||
if (!city) {
|
||||
return {};
|
||||
}
|
||||
const { count } = city;
|
||||
const originalPrice = count * 1;
|
||||
const price = GROUP_OPTIONS.find(o => o.value === count)?.price || 18;
|
||||
const productSpecId = GROUP_OPTIONS.find(o => o.value === count)?.productSpecId || ProductSpecId.GroupBatchPublish20;
|
||||
return { price, originalPrice, productSpecId };
|
||||
};
|
||||
const cityOptions: CityOption[] = cityValues.map(value => ({ value, label: value.cityName }));
|
||||
export default function UserBatchPublish({ cityCode, jobId }: { cityCode?: string; jobId?: string }) {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [showQrCode, setShowQrCode] = useState(false);
|
||||
const [selectable, setSelectable] = useState(false);
|
||||
const [showCitySelect, setShowCitySelect] = useState(false);
|
||||
const [city, setCity] = useState<CityOption['value'] | null>(null);
|
||||
const { price, originalPrice, productSpecId } = calcPrice(city);
|
||||
const [city, setCity] = useState<CityConfigListItem | null>(null);
|
||||
const [showPublishJob, setShowPublishJob] = useState(false);
|
||||
|
||||
const cityOperators = useCityOperators();
|
||||
|
||||
const availableCities = useMemo(() => cityOperators.filter(c => c.sendCount), [cityOperators]);
|
||||
const cityOptions: CityOption[] = useMemo(
|
||||
() => availableCities.map(value => ({ value, label: value.cityName })),
|
||||
[availableCities]
|
||||
);
|
||||
|
||||
const [showBuy, setShowBuy, handlePublishJob] = usePublishJob(jobId);
|
||||
const handleClickCity = useCallback(() => setShowCitySelect(true), []);
|
||||
|
||||
@ -102,7 +67,7 @@ export default function UserBatchPublish({ cityCode, jobId }: { cityCode?: strin
|
||||
// setShowQrCode(true);
|
||||
// return;
|
||||
// }
|
||||
if (!price || !productSpecId) {
|
||||
if (!city || !city.payPrice || !city.showPrice || !city.sendCount || !city.productSpecId) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
@ -127,10 +92,10 @@ export default function UserBatchPublish({ cityCode, jobId }: { cityCode?: strin
|
||||
|
||||
const { payOrderNo, createPayInfo } = await requestCreatePayInfo({
|
||||
type: OrderType.GroupBatchPublish,
|
||||
amt: getOrderPrice(price),
|
||||
amt: city.payPrice,
|
||||
// amt: 1,
|
||||
productCode: ProductType.GroupBatchPublish,
|
||||
productSpecId: productSpecId,
|
||||
productSpecId: city.productSpecId,
|
||||
});
|
||||
log('handleBuy payInfo', payOrderNo, createPayInfo);
|
||||
await requestPayment({
|
||||
@ -152,14 +117,14 @@ export default function UserBatchPublish({ cityCode, jobId }: { cityCode?: strin
|
||||
Toast.error(isCancelPay(e) ? '取消购买' : '购买失败请重试');
|
||||
log('handleBuy error', e);
|
||||
}
|
||||
}, [jobId, price, productSpecId]);
|
||||
}, [cityCode, jobId, city]);
|
||||
|
||||
useEffect(() => {
|
||||
// if (!cityCode) {
|
||||
// return;
|
||||
// }
|
||||
if (!availableCities.length) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const initCity = cityCode ? cityValues.find(o => o.cityCode === cityCode) : cityValues[0];
|
||||
const initCity = cityCode ? availableCities.find(o => o.cityCode === cityCode) : availableCities[0];
|
||||
|
||||
setSelectable(!cityCode);
|
||||
|
||||
@ -172,7 +137,7 @@ export default function UserBatchPublish({ cityCode, jobId }: { cityCode?: strin
|
||||
} catch (e) {
|
||||
Toast.error('加载失败请重试');
|
||||
}
|
||||
}, [cityCode]);
|
||||
}, [availableCities, cityCode]);
|
||||
|
||||
if (loading) {
|
||||
return <PageLoading />;
|
||||
@ -203,11 +168,13 @@ export default function UserBatchPublish({ cityCode, jobId }: { cityCode?: strin
|
||||
查看该城市合作群列表
|
||||
</div>
|
||||
<div className={`${PREFIX}__title`}>可购买群数</div>
|
||||
<Cell align="center" className={`${PREFIX}__cell`} title={city?.count} />
|
||||
<Cell align="center" className={`${PREFIX}__cell`} title={city?.sendCount} />
|
||||
<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 className={`${PREFIX}__cost-describe__price`}>{`${city?.showPrice}元`}</div>
|
||||
<div
|
||||
className={`${PREFIX}__cost-describe__original_price`}
|
||||
>{`原价：${city?.originalPrice || city?.sendCount}元`}</div>
|
||||
</div>
|
||||
|
||||
<Button className={`${PREFIX}__buy-button`} onClick={handleClickBuy}>
|
||||
|
||||
Reference in New Issue
Block a user