feat:群代发默认选项修改 + 加群卡片
This commit is contained in:
41
src/components/join-group-hint/index.less
Normal file
41
src/components/join-group-hint/index.less
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
@import '@/styles/common.less';
|
||||||
|
@import '@/styles/variables.less';
|
||||||
|
|
||||||
|
.join-group-hint {
|
||||||
|
.flex-row();
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 32px 24px;
|
||||||
|
margin-top: 24px;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
|
||||||
|
&__icon {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
margin-right: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__left {
|
||||||
|
flex: 1;
|
||||||
|
padding-left: 8px;
|
||||||
|
&-title {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 32px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
&-desc {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 28px;
|
||||||
|
line-height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&__right {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__button {
|
||||||
|
.button(@width: 186px, @height: 64px, @fontSize: 28px, @fontWeight: 400, @borderRadius: 32px, @highlight: 0);
|
||||||
|
}
|
||||||
|
}
|
58
src/components/join-group-hint/index.tsx
Normal file
58
src/components/join-group-hint/index.tsx
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
import { Button, Image } from '@tarojs/components';
|
||||||
|
import Taro from '@tarojs/taro';
|
||||||
|
|
||||||
|
import { Plus } from '@taroify/icons';
|
||||||
|
import { useCallback, useState } from 'react';
|
||||||
|
|
||||||
|
import { RoleType } from '@/constants/app';
|
||||||
|
import { CacheKey } from '@/constants/cache-key';
|
||||||
|
import { CITY_CODE_TO_NAME_MAP } from '@/constants/city';
|
||||||
|
import { GROUPS } from '@/constants/group';
|
||||||
|
import { getRoleTypeWithDefault } from '@/utils/app';
|
||||||
|
import { openCustomerServiceChat } from '@/utils/common';
|
||||||
|
import { getCurrentCityCode } from '@/utils/location';
|
||||||
|
import { checkCityCode, validCityCode } from '@/utils/user';
|
||||||
|
|
||||||
|
import './index.less';
|
||||||
|
|
||||||
|
const PREFIX = 'join-group-hint';
|
||||||
|
|
||||||
|
export function JoinGroupHint() {
|
||||||
|
const cityCode = getCurrentCityCode();
|
||||||
|
const roleType = getRoleTypeWithDefault();
|
||||||
|
const group = GROUPS.find(g => String(g.cityCode) === cityCode);
|
||||||
|
const [clicked, setClicked] = useState(!!Taro.getStorageSync(CacheKey.JOIN_GROUP_CARD_CLICKED));
|
||||||
|
const handleClick = useCallback(() => {
|
||||||
|
if (!checkCityCode(cityCode)) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (group) {
|
||||||
|
openCustomerServiceChat(group.serviceUrl);
|
||||||
|
Taro.setStorageSync(CacheKey.JOIN_GROUP_CARD_CLICKED, true);
|
||||||
|
setClicked(true);
|
||||||
|
}
|
||||||
|
}, [cityCode, group]);
|
||||||
|
if (!group || !validCityCode(cityCode) || clicked) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={PREFIX}>
|
||||||
|
<Image
|
||||||
|
className={`${PREFIX}__icon`}
|
||||||
|
src="https://publiccdn.neighbourhood.com.cn/img/group-avatar.png"
|
||||||
|
mode="aspectFit"
|
||||||
|
/>
|
||||||
|
<div className={`${PREFIX}__left`}>
|
||||||
|
<div className={`${PREFIX}__left-title`}>{CITY_CODE_TO_NAME_MAP.get(cityCode)}主播招聘群</div>
|
||||||
|
<div className={`${PREFIX}__left-desc`}>{roleType === RoleType.Anchor ? '高薪工作早知道' : '免费招主播'}</div>
|
||||||
|
</div>
|
||||||
|
<div className={`${PREFIX}__right`}>
|
||||||
|
<Button className={`${PREFIX}__button`} onClick={handleClick}>
|
||||||
|
<Plus />
|
||||||
|
加入该群
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
@ -40,18 +40,18 @@ const SERVICE_ILLUSTRATE = `服务方式:帮您把招聘需求发到众多同
|
|||||||
内容要求:仅限带货主播招聘需求,其他不发
|
内容要求:仅限带货主播招聘需求,其他不发
|
||||||
主播联系:内容中留招聘方联系方式,主播直接联系`;
|
主播联系:内容中留招聘方联系方式,主播直接联系`;
|
||||||
const cityValues: CityValue[] = [
|
const cityValues: CityValue[] = [
|
||||||
{ cityCode: '440100', cityName: '广州', count: 300 }, // 800
|
{ cityCode: '440100', cityName: '广州', count: 800 },
|
||||||
{ cityCode: '440300', cityName: '深圳', count: 100 },
|
{ cityCode: '440300', cityName: '深圳', count: 100 },
|
||||||
{ cityCode: '330100', cityName: '杭州', count: 300 }, // 750
|
{ cityCode: '330100', cityName: '杭州', count: 750 },
|
||||||
{ cityCode: '110100', cityName: '北京', count: 100 }, // 150
|
{ cityCode: '110100', cityName: '北京', count: 150 },
|
||||||
{ cityCode: '510100', cityName: '成都', count: 100 },
|
{ cityCode: '510100', cityName: '成都', count: 100 },
|
||||||
// { cityCode: '500100', cityName: '重庆', count: 50 },
|
{ cityCode: '500100', cityName: '重庆', count: 50 },
|
||||||
{ cityCode: '430100', cityName: '长沙', count: 50 },
|
{ cityCode: '430100', cityName: '长沙', count: 50 },
|
||||||
{ cityCode: '350200', cityName: '厦门', count: 50 },
|
{ cityCode: '350200', cityName: '厦门', count: 50 },
|
||||||
{ cityCode: '310100', cityName: '上海', count: 100 }, // 150
|
{ cityCode: '310100', cityName: '上海', count: 150 },
|
||||||
{ cityCode: '420100', cityName: '武汉', count: 50 }, // 80
|
{ cityCode: '420100', cityName: '武汉', count: 80 },
|
||||||
{ cityCode: '610100', cityName: '西安', count: 50 }, // 60
|
{ cityCode: '610100', cityName: '西安', count: 60 },
|
||||||
{ cityCode: '410100', cityName: '郑州', count: 100 }, // 150
|
{ cityCode: '410100', cityName: '郑州', count: 150 },
|
||||||
].sort((a, b) => b.count - a.count);
|
].sort((a, b) => b.count - a.count);
|
||||||
const MIN_GROUP_SIZE = 20;
|
const MIN_GROUP_SIZE = 20;
|
||||||
const GROUP_OPTIONS = [
|
const GROUP_OPTIONS = [
|
||||||
@ -62,7 +62,7 @@ const GROUP_OPTIONS = [
|
|||||||
{ value: 100, productSpecId: ProductSpecId.GroupBatchPublish100, label: '100', price: 68 },
|
{ value: 100, productSpecId: ProductSpecId.GroupBatchPublish100, label: '100', price: 68 },
|
||||||
{ value: 150, productSpecId: ProductSpecId.GroupBatchPublish150, label: '150', price: 98 },
|
{ value: 150, productSpecId: ProductSpecId.GroupBatchPublish150, label: '150', price: 98 },
|
||||||
{ value: 300, productSpecId: ProductSpecId.GroupBatchPublish300, label: '300', price: 128 },
|
{ value: 300, productSpecId: ProductSpecId.GroupBatchPublish300, label: '300', price: 128 },
|
||||||
{ value: 500, productSpecId: ProductSpecId.GroupBatchPublish500, label: '500', price: 188 }, // 168
|
{ value: 500, productSpecId: ProductSpecId.GroupBatchPublish500, label: '500', price: 168 },
|
||||||
{ value: 750, productSpecId: ProductSpecId.GroupBatchPublish750, label: '750', price: 188 },
|
{ value: 750, productSpecId: ProductSpecId.GroupBatchPublish750, label: '750', price: 188 },
|
||||||
{ value: 800, productSpecId: ProductSpecId.GroupBatchPublish800, label: '800', price: 198 },
|
{ value: 800, productSpecId: ProductSpecId.GroupBatchPublish800, label: '800', price: 198 },
|
||||||
{ value: 1000, productSpecId: ProductSpecId.GroupBatchPublish1000, label: '1000', price: 288 },
|
{ value: 1000, productSpecId: ProductSpecId.GroupBatchPublish1000, label: '1000', price: 288 },
|
||||||
@ -146,7 +146,7 @@ export default function UserBatchPublish() {
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
try {
|
try {
|
||||||
const cOptions: CityOption[] = cityValues.map(value => ({ value, label: value.cityName }));
|
const cOptions: CityOption[] = cityValues.map(value => ({ value, label: value.cityName }));
|
||||||
const initCity = cOptions[0].value;
|
const initCity = (cOptions.find(o => o.label === '重庆') || cOptions[0]).value;
|
||||||
|
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
setCity(initCity);
|
setCity(initCity);
|
||||||
|
@ -12,4 +12,5 @@ export enum CacheKey {
|
|||||||
INVITE_CODE = '__invite_code__',
|
INVITE_CODE = '__invite_code__',
|
||||||
AGREEMENT_SIGNED = '__agreement_signed__',
|
AGREEMENT_SIGNED = '__agreement_signed__',
|
||||||
CITY_CODES = '__city_codes__',
|
CITY_CODES = '__city_codes__',
|
||||||
|
JOIN_GROUP_CARD_CLICKED = '__join_group_card_clicked__',
|
||||||
}
|
}
|
||||||
|
@ -232,4 +232,8 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.join-group-hint {
|
||||||
|
margin: 24px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -17,6 +17,7 @@ import { navigateTo } from '@/utils/route';
|
|||||||
|
|
||||||
import './index.less';
|
import './index.less';
|
||||||
import onChangeEventDetail = SwiperProps.onChangeEventDetail;
|
import onChangeEventDetail = SwiperProps.onChangeEventDetail;
|
||||||
|
import { JoinGroupHint } from '@/components/join-group-hint';
|
||||||
|
|
||||||
interface IProps {
|
interface IProps {
|
||||||
editable: boolean;
|
editable: boolean;
|
||||||
@ -207,6 +208,7 @@ export default function ProfileViewFragment(props: IProps) {
|
|||||||
>{`${coverIndex + 1}/${profile.materialVideoInfoList.length}`}</div>
|
>{`${coverIndex + 1}/${profile.materialVideoInfoList.length}`}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{!editable && <JoinGroupHint />}
|
||||||
<div className={`${PREFIX}__body`}>
|
<div className={`${PREFIX}__body`}>
|
||||||
<div className={`${PREFIX}__basic-info`}>
|
<div className={`${PREFIX}__basic-info`}>
|
||||||
<div className={`${PREFIX}__basic-info__name-container`}>
|
<div className={`${PREFIX}__basic-info__name-container`}>
|
||||||
@ -228,7 +230,9 @@ export default function ProfileViewFragment(props: IProps) {
|
|||||||
{index ? (
|
{index ? (
|
||||||
<div className={`${PREFIX}__info-group__header__title`}>{data.title}</div>
|
<div className={`${PREFIX}__info-group__header__title`}>{data.title}</div>
|
||||||
) : (
|
) : (
|
||||||
<DevDiv className={`${PREFIX}__info-group__header__title`} OnDev={onDev}>{data.title}</DevDiv>
|
<DevDiv className={`${PREFIX}__info-group__header__title`} OnDev={onDev}>
|
||||||
|
{data.title}
|
||||||
|
</DevDiv>
|
||||||
)}
|
)}
|
||||||
{editable && (
|
{editable && (
|
||||||
<div className={`${PREFIX}__info-group__header__edit`} onClick={() => handleEditGroupItem(data.type)}>
|
<div className={`${PREFIX}__info-group__header__edit`} onClick={() => handleEditGroupItem(data.type)}>
|
||||||
|
@ -37,6 +37,7 @@ import Toast from '@/utils/toast';
|
|||||||
import { isNeedCreateMaterial } from '@/utils/user';
|
import { isNeedCreateMaterial } from '@/utils/user';
|
||||||
|
|
||||||
import './index.less';
|
import './index.less';
|
||||||
|
import { JoinGroupHint } from '@/components/join-group-hint';
|
||||||
|
|
||||||
const PREFIX = 'job-detail';
|
const PREFIX = 'job-detail';
|
||||||
const log = logWithPrefix(PREFIX);
|
const log = logWithPrefix(PREFIX);
|
||||||
@ -282,6 +283,8 @@ export default function JobDetail() {
|
|||||||
{data.companyName && <div className={`${PREFIX}__company`}>{`公司:${data.companyName}`}</div>}
|
{data.companyName && <div className={`${PREFIX}__company`}>{`公司:${data.companyName}`}</div>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{!isOwner && <JoinGroupHint />}
|
||||||
|
|
||||||
<div className={`${PREFIX}__content`}>
|
<div className={`${PREFIX}__content`}>
|
||||||
<div className={`${PREFIX}__content-title`}>职位描述</div>
|
<div className={`${PREFIX}__content-title`}>职位描述</div>
|
||||||
<div className={`${PREFIX}__tags`}>
|
<div className={`${PREFIX}__tags`}>
|
||||||
|
@ -156,14 +156,18 @@ export const getCityCodes = (): string[] => {
|
|||||||
return !cachedValue || !Array.isArray(cachedValue) ? [] : cachedValue;
|
return !cachedValue || !Array.isArray(cachedValue) ? [] : cachedValue;
|
||||||
};
|
};
|
||||||
export const setCityCodes = (cityCode: string[]) => Taro.setStorageSync(CacheKey.CITY_CODES, cityCode);
|
export const setCityCodes = (cityCode: string[]) => Taro.setStorageSync(CacheKey.CITY_CODES, cityCode);
|
||||||
export const checkCityCode = (cityCode: string): boolean => {
|
export const validCityCode = (cityCode: string) => {
|
||||||
const cachedCityCodes = getCityCodes();
|
const cachedCityCodes = getCityCodes();
|
||||||
const isNewCityCode = cachedCityCodes.indexOf(cityCode) === -1;
|
const isNewCityCode = cachedCityCodes.indexOf(cityCode) === -1;
|
||||||
if (cachedCityCodes.length === 2 && isNewCityCode) {
|
return !(cachedCityCodes.length === 2 && isNewCityCode);
|
||||||
|
};
|
||||||
|
export const checkCityCode = (cityCode: string): boolean => {
|
||||||
|
if (!validCityCode(cityCode)) {
|
||||||
Toast.info('最多只能进入2个城市');
|
Toast.info('最多只能进入2个城市');
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
if (isNewCityCode) {
|
const cachedCityCodes = getCityCodes();
|
||||||
|
if (cachedCityCodes.indexOf(cityCode) === -1) {
|
||||||
setCityCodes([...cachedCityCodes, cityCode]);
|
setCityCodes([...cachedCityCodes, cityCode]);
|
||||||
}
|
}
|
||||||
return true;
|
return true;
|
||||||
|
Reference in New Issue
Block a user