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-12-24 00:41:36 +08:00
parent ec96058d5d
commit e38114d32b
8 changed files with 311 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/partner-intro/index.tsx
View File

@ -146,25 +146,6 @@ export default function PartnerIntro() {
</Swiper>
</div>
<div className={`${PREFIX}__block`}>
<div className={`${PREFIX}__title`}>
群主认证
<div className={`${PREFIX}__recommend`}>
<GoodJob />
强烈推荐
</div>
</div>
<div className={`${PREFIX}__card ${PREFIX}__special`}>
<div className={`${PREFIX}__body`}>
<div className="center">
完成群主认证后，群成员通过该群访问任何人分享的播络小程序进行注册，你都能获得分成
</div>
</div>
<Button className={`${PREFIX}__service`} onClick={handleConfirm}>
立即认证
</Button>
</div>
</div>
<div className={`${PREFIX}__block`}>
<div className={`${PREFIX}__title`}>3重收益</div>
<div className={`${PREFIX}__card`}>
@ -194,6 +175,25 @@ export default function PartnerIntro() {
</div>
</div>
</div>
<div className={`${PREFIX}__block`}>
<div className={`${PREFIX}__title`}>
群主认证
<div className={`${PREFIX}__recommend`}>
<GoodJob />
强烈推荐
</div>
</div>
<div className={`${PREFIX}__card ${PREFIX}__special`}>
<div className={`${PREFIX}__body`}>
<div className="center">
完成群主认证后，群成员通过该群访问任何人分享的播络小程序进行注册，你都能获得分成
</div>
</div>
<Button className={`${PREFIX}__service`} onClick={handleConfirm}>
立即认证
</Button>
</div>
</div>
<div className={`${PREFIX}__block`}>
<div className={`${PREFIX}__title`}>交流群</div>
<div className={`${PREFIX}__card ${PREFIX}__special`}>

13
src/components/prejob-popup/index.tsx
View File

@ -9,7 +9,7 @@ import SafeBottomPadding from '@/components/safe-bottom-padding';
import { PageUrl } from '@/constants/app';
import { CacheKey } from '@/constants/cache-key';
import { GET_CONTACT_TYPE } from '@/constants/job';
import { switchTab, navigateTo } from '@/utils/route';
import { navigateTo, switchTab } from '@/utils/route';
import './index.less';
interface IProps {
@ -42,6 +42,13 @@ const GET_CONTACT_TYPE_OPTIONS = [
// desc: '群内定期发放会员，免费报单',
// btnText: '进群',
// },
{
type: GET_CONTACT_TYPE.INVITE,
icon: '',
title: '邀请运营进群（进会员）',
desc: '每邀请进一个主播群送一个日会员',
btnText: '邀请',
},
];
export function PrejobPopup({ onCancel, isCreateResume, onConfirm }: IProps) {
@ -53,6 +60,10 @@ export function PrejobPopup({ onCancel, isCreateResume, onConfirm }: IProps) {
navigateTo(PageUrl.MaterialUploadVideo);
onConfirm(type);
}
if (type === GET_CONTACT_TYPE.INVITE) {
navigateTo(PageUrl.InviteOperations);
onConfirm(type);
}
if (type === GET_CONTACT_TYPE.VIP) {
setOpenPopup(false);
setOpenDialog(true);

2
src/constants/app.ts
View File

@ -37,6 +37,7 @@ export enum OpenSource {
AnchorPage = 'anchor_page',
MaterialViewPage = 'material_view_page',
GroupOwnerCertificate = 'group_owner_certificate',
InviteOperations = 'invite_operations',
}
export enum PageUrl {
@ -82,6 +83,7 @@ export enum PageUrl {
GiveVip = 'pages/give-vip/index',
GroupOwnerCertificate = 'pages/group-owner-certification/index',
PartnerShareVip = 'pages/partner-share-vip/index',
InviteOperations = 'pages/invite-operations/index',
}
export enum PluginUrl {

1
src/constants/job.ts
View File

@ -214,4 +214,5 @@ export enum GET_CONTACT_TYPE {
VIP = 'vip',
MATERIAL = 'material',
GROUP = 'group',
INVITE = 'invite',
}

1
src/hooks/use-config.tsx
View File

@ -101,6 +101,7 @@ export const APP_CONFIG: AppConfigType = {
PageUrl.GiveVip,
PageUrl.GroupOwnerCertificate,
PageUrl.PartnerShareVip,
PageUrl.InviteOperations,
PageUrl.AccelerateDelegatePublish,
// PageUrl.DevDebug,
],

3
src/pages/invite-operations/index.config.ts Normal file
View File

@ -0,0 +1,3 @@
export default definePageConfig({
navigationBarTitleText: '邀请运营',
});

156
src/pages/invite-operations/index.less Normal file
View File

@ -0,0 +1,156 @@
@import '@/styles/variables.less';
@import '@/styles/common.less';
.invite-operations {
&__main {
padding-left: 24px;
padding-right: 24px;
position: relative;
}
&__block {
margin-bottom: 12px;
position: relative;
}
&__card {
background: #fff;
border-radius: 24px;
padding: 32px;
position: relative;
}
&__edging {
position: absolute;
font-weight: 400;
font-size: 26px;
line-height: 28px;
color: #946724;
padding: 18px 24px;
background: #FFF4F0;
border-radius:0 0 24px 24px;
bottom: 0;
left: 0;
right: 0;
}
&__lined-wrapper {
text-align: center;
margin-top: 40px;
}
&__lined-title {
text-align: center;
font-weight: 400;
font-size: 28px;
line-height: 40px;
color: #333333;
position: relative;
display: inline-block;
&:before {
content: '';
position: absolute;
left: -68px;
width: 56px;
height: 1px;
background: #ccc;
top: 50%;
}
&:after {
content: '';
position: absolute;
right: -68px;
width: 56px;
height: 1px;
background: #ccc;
top: 50%;
}
}
&__h1 {
font-weight: 500;
font-size: 32px;
line-height: 40px;
color: #1d2129;
margin-bottom: 16px;
margin-top: 32px;
position: relative;
z-index: 0;
&:first-child {
margin-top: 0;
}
&.center {
text-align: center;
}
.highlight {
color: @blHighlightColor;
display: inline-block;
}
}
&__body {
font-weight: 400;
font-size: 28px;
line-height: 40px;
color: @blColor;
}
&__title {
margin-bottom: 24px;
font-weight: 500;
font-size: 32px;
line-height: 32px;
color: #1d2129;
&:before {
left: -138px;
width: 120px;
}
&:after {
right: -138px;
width: 120px;
}
}
&__copy {
.button(@height: 72px; @width: 384px; @fontSize: 28px; @fontWeight: 400; @borderRadius: 44px; @highlight: 0);
margin-top: 32px;
}
&__city-select {
background: #F7F7F7;
border-radius: 16px;
padding: 34px 32px;
font-weight: 400;
font-size: 32px;
margin-top: 24px;
line-height: 32px;
color: #333333;
display: flex;
justify-content: space-between;
}
&__qrcode {
width: 280px;
height: 280px;
background: #6F7686;
display: block;
margin: auto auto 24px;
}
&__action-block {
background: #F7F7F7;
border-radius: 16px;
padding: 32px 0;
.flex-column();
text-align: center;
color: @blHighlightColor;
font-size: 28px;
font-weight: 400;
}
}

117
src/pages/invite-operations/index.tsx Normal file
View File

@ -0,0 +1,117 @@
import { Button, Image } from '@tarojs/components';
import Taro from '@tarojs/taro';
import { Arrow } from '@taroify/icons';
import { Fragment, useCallback, useEffect, useState } from 'react';
import { EventName, OpenSource, PageUrl } from '@/constants/app';
import { CITY_CODE_TO_NAME_MAP } from '@/constants/city';
import useLocation from '@/hooks/use-location';
import useUserInfo from '@/hooks/use-user-info';
import { StaffInfo } from '@/types/partner';
import { copy } from '@/utils/common';
import { getStaffInfo } from '@/utils/partner';
import { navigateTo } from '@/utils/route';
import './index.less';
const PREFIX = 'invite-operations';
export default function InviteOperations() {
const location = useLocation();
const userInfo = useUserInfo();
const [cityCode, setCityCode] = useState<string>(location.cityCode);
const [staffInfo, setStaffInfo] = useState<StaffInfo | null>(null);
const handleClickCityMenu = useCallback(() => {
navigateTo(PageUrl.CitySearch, { city: cityCode || location.cityCode, source: OpenSource.InviteOperations });
}, [cityCode, location.cityCode]);
const handleCityChange = useCallback(data => {
console.log('handleCityChange', data);
const { openSource, cityCode: cCode } = data;
if (openSource !== OpenSource.InviteOperations) {
return;
}
setCityCode(cCode);
}, []);
const handleCopy = useCallback(() => {
copy(`我的ID是：${userInfo.userId}，邀你进主播群`);
}, [userInfo.userId]);
useEffect(() => {
Taro.eventCenter.on(EventName.SELECT_CITY, handleCityChange);
return () => {
Taro.eventCenter.off(EventName.SELECT_CITY, handleCityChange);
};
}, [handleCityChange]);
useEffect(() => {
if (!cityCode) return;
getStaffInfo(cityCode)
.then(data => {
setStaffInfo(data);
})
.catch(() => {
setStaffInfo(null);
});
}, [cityCode]);
return (
<div className={PREFIX}>
<div className={`${PREFIX}__main`}>
<div className={`${PREFIX}__block`}>
<div className={`${PREFIX}__lined-wrapper`}>
<div className={`${PREFIX}__lined-title ${PREFIX}__title`}>活动说明</div>
</div>
<div className={`${PREFIX}__card`}>
<div className={`${PREFIX}__h1 center`}>邀请播络运营进带货主播群</div>
<div className={`${PREFIX}__h1 center`} style={{ paddingBottom: `48rpx` }}>
每邀请进一个群送一个日会员
</div>
<div className={`${PREFIX}__edging`}>注：只能邀请带货主播群，请勿邀请其他群</div>
</div>
</div>
<div className={`${PREFIX}__block`}>
<div className={`${PREFIX}__lined-wrapper`}>
<div className={`${PREFIX}__lined-title ${PREFIX}__title`}>邀请方法</div>
</div>
<div className={`${PREFIX}__card`}>
<div className={`${PREFIX}__body`}>
<div className={`${PREFIX}__h1`}>
加运营为好友并将以下信息 <div className="highlight">粘贴发送给运营</div>
</div>
<div className={`${PREFIX}__action-block`}>
<div>我的ID是：{userInfo.userId}，邀你进主播群</div>
<Button className={`${PREFIX}__copy`} onClick={handleCopy}>
复制
</Button>
</div>
<div className={`${PREFIX}__lined-wrapper`}>
<div className={`${PREFIX}__lined-title`}>选择城市，添加运营</div>
</div>
<div className={`${PREFIX}__city-select`} onClick={handleClickCityMenu}>
{cityCode ? CITY_CODE_TO_NAME_MAP.get(cityCode) : '请选择城市'}
<Arrow size={16} />
</div>
{staffInfo && (
<Fragment>
<div className={`${PREFIX}__lined-wrapper`}>
<div className={`${PREFIX}__lined-title`}>长按并识别二维码添加运营</div>
</div>
<Image
className={`${PREFIX}__qrcode`}
src={staffInfo.staffQrCode}
showMenuByLongpress
mode="aspectFill"
/>
</Fragment>
)}
</div>
</div>
</div>
</div>
</div>
);
}