feat: ui

src/components/partner-intro/index.tsx

@@ -57,21 +57,21 @@ export default function PartnerIntro() {
         const canvas = res[0].node;
         const ctx = canvas.getContext('2d');
 
-        canvas.width = 1500;
+        canvas.width = 550*2;
-        canvas.height = 2668;
+        canvas.height = 918*2;
         ctx.scale(2, 2);
 
         // 绘制背景图片
         const bgImage = canvas.createImage();
-        const poster = 'https://publiccdn.neighbourhood.com.cn/img/poster.png'
+        const poster = 'https://publiccdn.neighbourhood.com.cn/img/share-coupon-poster.png';
         bgImage.src = poster;
         bgImage.onload = () => {
-          ctx.drawImage(bgImage, 0, 0, 750, 1334);
+          ctx.drawImage(bgImage, 0, 0, 550, 918);
 
           const qrCodeImage = canvas.createImage();
           qrCodeImage.src = qrCode; // 假设 getQrcode() 返回的是二维码图片的路径
           qrCodeImage.onload = () => {
-            ctx.drawImage(qrCodeImage, 235, 894, 280, 280); // 绘制二维码，位置和大小
+            ctx.drawImage(qrCodeImage, 196, 600, 160, 160); // 绘制二维码，位置和大小
             saveCanvasToTempFile().then(tempPath => {
               resolve(tempPath);
             });
@@ -163,10 +163,10 @@ export default function PartnerIntro() {
 
       <div className={`${PREFIX}__footer`}>
         <Button className={`${PREFIX}__download-button`} onClick={savePoster}>
-          下载海报
+          朋友圈海报
         </Button>
         <Button className={`${PREFIX}__share-button`} openType="share">
-          分享邀请
+          赠送会员给好友
         </Button>
       </div>
     </div>

src/components/user-batch-publish/index.tsx

@@ -36,7 +36,7 @@ interface CityOption extends ISelectOption<CityValue> {
 const PREFIX = 'user-batch-publish';
 const log = logWithPrefix(PREFIX);
 const SERVICE_ILLUSTRATE = `服务方式：帮您把招聘需求发到众多同城合作主播群
-群发次数：杭州、广州发3次，其他城市1次
+群发次数：每日1次，连发3天
 内容要求：仅限带货主播招聘需求，其他不发
 主播联系：内容中留招聘方联系方式，主播直接联系`;
 const cityValues: CityValue[] = [

src/pages/give-vip/index.less

@@ -1 +1,130 @@
-.give-vip {}
+@import '@/styles/variables.less';
+@import '@/styles/common.less';
+
+.give-vip {
+  padding: 40px 24px 200px 24px;
+  &__hint {
+    font-size: 28px;
+    line-height: 48px;
+    color: @blColorG2;
+    gap: 12px;
+    .flex-row();
+    justify-content: center;
+  }
+  &__icon {
+    width: 65px;
+    height: 65px;
+  }
+  &__title {
+    margin-top: 24px;
+    font-weight: 500;
+    font-size: 40px;
+    line-height: 48px;
+    color: @blColor;
+    text-align: center;
+    flex: 0 1 auto;
+    gap: 12px;
+    .flex-row();
+    justify-content: center;
+    .highlight {
+      margin-left: -12px;
+      display: inline-block;
+      color: @blHighlightColor;
+    }
+  }
+  &__bg {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+  }
+  &__info {
+    &-block {
+      margin-top: 48px;
+    }
+    &-title {
+      font-weight: 500;
+      font-size: 32px;
+      line-height: 32px;
+      color: #1d2129;
+      margin-bottom: 24px;
+    }
+    &-card {
+      box-sizing: border-box;
+      background: #ffffff;
+      border-radius: 24px;
+      padding: 32px;
+    }
+    &-body {
+      font-weight: 400;
+      font-size: 28px;
+      line-height: 40px;
+      color: #333333;
+      margin-bottom: 32px;
+    }
+    &-img {
+      width: 100%;
+      height: 614px;
+    }
+  }
+  &__footer {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    padding: 12px 32px;
+    box-shadow: 0px -4px 20px 0px #00000014;
+    box-sizing: border-box;
+    background: #ffffff;
+  }
+
+  &__footer-body {
+    .flex-row();
+    justify-content: center;
+  }
+  &__button {
+    .button(@height: 88px; @fontSize: 32px; @fontWeight: 500; @borderRadius: 44px;);
+    width: 400px;
+  }
+  &__coupon {
+    &-info {
+      position: relative;
+      margin-top: 32px;
+      padding: 24px;
+      box-sizing: border-box;
+      border-radius: 24px;
+
+      .flex-column();
+      justify-content: center;
+    }
+
+    &-title {
+      font-weight: 500;
+      font-size: 32px;
+      line-height: 48px;
+      color: @blHighlightColor;
+      margin-bottom: 8px;
+    }
+    &-intro {
+      font-size: 28px;
+      line-height: 40px;
+      margin-bottom: 12px;
+      color: @blColor;
+      gap: 4px;
+      .flex-row();
+      .highlight {
+        font-weight: 600;
+        font-size: 32px;
+        line-height: 56px;
+        color: @blHighlightColor;
+      }
+    }
+    &-valid {
+      font-size: 28px;
+      line-height: 40px;
+
+      color: @blColorG2;
+    }
+  }
+}

src/pages/give-vip/index.tsx

@@ -1,6 +1,11 @@
-import { Button } from '@taroify/core';
+import { Image, Button } from '@tarojs/components';
 
+import { Fragment, useCallback } from 'react';
+
+import SafeBottomPadding from '@/components/safe-bottom-padding';
+import { PageUrl } from '@/constants/app';
 import { logWithPrefix } from '@/utils/common';
+import { switchTab } from '@/utils/route';
 
 import './index.less';
 
@@ -8,5 +13,59 @@ const PREFIX = 'give-vip';
 const log = logWithPrefix(PREFIX);
 
 export default function GiveVip() {
-  return <div className={PREFIX}></div>;
+  const handleNavigate = useCallback(() => {
+    switchTab(PageUrl.Job);
+  }, []);
+  return (
+    <div className={PREFIX}>
+      <Fragment>
+        <div className={`${PREFIX}__title`}>
+          <Image src="https://publiccdn.neighbourhood.com.cn/img/partner-yes.svg" className={`${PREFIX}__icon`} />
+          <div>宝子，播络会员领取成功</div>
+        </div>
+        <div className={`${PREFIX}__coupon-info`}>
+          <Image src="https://publiccdn.neighbourhood.com.cn/img/parnet-share-bg.png" className={`${PREFIX}__bg`} />
+          <div className={`${PREFIX}__coupon-title`}>播络日会员</div>
+          <div className={`${PREFIX}__coupon-intro`}>
+            会员有效期内可增加<div className="highlight">10次</div>报单机会
+          </div>
+          <div className={`${PREFIX}__coupon-valid`}>有效期至：2025年/8/26 22:23:56</div>
+        </div>
+      </Fragment>
+      <Fragment>
+        <div className={`${PREFIX}__hint`}>
+          <Image
+            src="https://publiccdn.neighbourhood.com.cn/img/link-invalid.svg"
+            mode="aspectFit"
+            className={`${PREFIX}__icon`}
+          />
+          <div className={`${PREFIX}__hint-title`}>宝子，链接已失效</div>
+        </div>
+        <div className={`${PREFIX}__title`}>
+          请联系分享人<div className="highlight">再次分享</div>
+        </div>
+      </Fragment>
+      <div className={`${PREFIX}__info-block`}>
+        <div className={`${PREFIX}__info-title`}>播络简介</div>
+        <div className={`${PREFIX}__info-card`}>
+          <div className={`${PREFIX}__info-body`}>
+            播络通告整理汇集了本地每日新增带货主播通告，方便大家及时找到高薪工作
+          </div>
+          <Image
+            className={`${PREFIX}__info-img`}
+            src="https://publiccdn.neighbourhood.com.cn/img/partner-share-coupon-img.png"
+            mode="heightFix"
+          />
+        </div>
+      </div>
+      <div className={`${PREFIX}__footer`}>
+        <div className={`${PREFIX}__footer-body`}>
+          <Button className={`${PREFIX}__button`} onClick={handleNavigate}>
+            立即使用
+          </Button>
+        </div>
+        <SafeBottomPadding />
+      </div>
+    </div>
+  );
 }

src/pages/job-select-my-publish/index.less

@@ -56,27 +56,7 @@
     &__icon {
       width: 48px;
       height: 48px;
-    }
-
-    &__block {
       margin-top: 24px;
-      .flex-row();
-      gap: 16px;
-    }
-
-    &__status {
-      font-size: 28px;
-      line-height: 32px;
-      font-weight: 400;
-      color: @blColorG1;
-
-      &.open {
-        color: @blHighlightColor;
-      }
-
-      &.error {
-        color: #FF5051;
-      }
     }
   }
 }

src/pages/job-select-my-publish/index.tsx

@@ -6,7 +6,6 @@ import classNames from 'classnames';
 import { useCallback, useState } from 'react';
 
 import { EventName, OpenSource } from '@/constants/app';
-import { JOB_MANAGE_STATUS_TITLE_MAP, JobManageStatus } from '@/constants/job';
 import { JobManageInfo } from '@/types/job';
 import { getJobLocation, requestJobManageList } from '@/utils/job';
 import { getPageQuery, navigateBack } from '@/utils/route';
@@ -16,14 +15,7 @@ import Toast from '@/utils/toast';
 import './index.less';
 
 const PREFIX = 'page-job-select-my-publish';
-const STATUS_CLASS_MAP = {
+
-  [JobManageStatus.WaitVerify]: 'pending',
-  [JobManageStatus.Open]: 'open',
-  [JobManageStatus.Pending]: 'pending',
-  [JobManageStatus.Error]: 'error',
-  [JobManageStatus.Close]: 'close',
-  [JobManageStatus.Expire]: 'close',
-};
 export default function JobSelectMyPublish() {
   const [list, setList] = useState<JobManageInfo[]>([]);
   const [jobId, setJobId] = useState<string | null>('1');
@@ -65,18 +57,13 @@ export default function JobSelectMyPublish() {
             </div>
             <div className={`${PREFIX}__right`}>
               <div className={`${PREFIX}__right__time`}>{formatTime(item.updated)}</div>
-              <div className={`${PREFIX}__right__block`}>
+              {item.id === jobId && (
-                <div className={classNames(`${PREFIX}__right__status`, { [STATUS_CLASS_MAP[item.status]]: true })}>
+                <Image
-                  {JOB_MANAGE_STATUS_TITLE_MAP[item.status]}
+                  mode="aspectFit"
-                </div>
+                  className={`${PREFIX}__right__icon`}
-                {item.id === jobId && (
+                  src={require('@/statics/svg/success.svg')}
-                  <Image
+                />
-                    mode="aspectFit"
+              )}
-                    className={`${PREFIX}__right__icon`}
-                    src={require('@/statics/svg/success.svg')}
-                  />
-                )}
-              </div>
             </div>
           </div>
         ))}

src/pages/partner/index.tsx

@@ -20,7 +20,12 @@ export default function Partner() {
   };
   useShareAppMessage(() => {
     console.log('Partner inviteCode', inviteCode);
-    return getCommonShareMessage({ useCapture: false, inviteCode });
+    return getCommonShareMessage({
+      useCapture: false,
+      inviteCode,
+      title: '宝子，送你个播络会员，找工作更方便',
+      imageUrl: 'https://publiccdn.neighbourhood.com.cn/img/share-coupon.png',
+    });
   });
 
   return (

src/pages/user-batch-publish/index.tsx

@@ -82,7 +82,7 @@ export default function BizService() {
               <div className={`${PREFIX}__delegate-h5`}>服务说明</div>
               <div className={`${PREFIX}__delegate-card`}>
                 <div className={`${PREFIX}__delegate-body`}>服务方式：帮您把招聘需求发到众多同城合作主播群</div>
-                <div className={`${PREFIX}__delegate-body`}>群发次数：杭州、广州发3次，其他城市1次</div>
+                <div className={`${PREFIX}__delegate-body`}>群发次数：每日1次，连发3天</div>
                 <div className={`${PREFIX}__delegate-body`}>内容要求：仅限带货主播招聘需求，其他不发</div>
                 <div className={`${PREFIX}__delegate-body`}>主播联系：内容中留招聘方联系方式，主播直接联系</div>
               </div>

src/utils/share.ts

@@ -20,6 +20,7 @@ interface ShareAppProps {
   inviteCode?: string;
   title?: string;
   path?: PageUrl;
+  imageUrl?: string;
   params?: Record<string, BL.Anything>;
 }
 
@@ -28,6 +29,7 @@ export const getCommonShareMessage = ({
   inviteCode,
   title,
   path,
+  imageUrl: _imageUrl,
   params = {},
 }: ShareAppProps = {}): ShareAppMessageReturn => {
   const inviteParams = inviteCode ? { c: inviteCode } : undefined;
@@ -36,6 +38,6 @@ export const getCommonShareMessage = ({
   return {
     title: title || `昨天新增了${getRandomCount()}条主播通告，宝子快来看看`,
     path: sharePath,
-    imageUrl: useCapture ? undefined : imageUrl,
+    imageUrl: useCapture ? undefined : _imageUrl || imageUrl,
   };
 };