feat: partner enrty

src/components/partner-entry/index.less

@@ -0,0 +1,115 @@
+@import '@/styles/variables.less';
+@import '@/styles/common.less';
+
+.partner-fragment-entry {
+  &__join {
+    .flex-column();
+    text-align: center;
+    min-height: 280px;
+    padding: 32px 40px;
+    box-sizing: border-box;
+    background: linear-gradient(2.75deg, #ffffff 7.9%, #f2edff 97.24%);
+    border-radius: 16px;
+    margin-bottom: 24px;
+
+    &-title {
+      font-family: 'Alimama ShuHeiTi';
+      font-style: normal;
+      font-weight: 700;
+      font-size: 32px;
+      line-height: 40px;
+      color: @blColor;
+      margin-bottom: 16px;
+      .flex-row();
+
+      .highlight {
+        color: @blHighlightColor;
+        font-family: 'DIN Alternate';
+        font-weight: 700;
+        font-size: 50px;
+        line-height: 56px;
+        padding: 0 8px;
+      }
+    }
+    &-desc {
+      font-size: 26px;
+      line-height: 32px;
+      color: @blColorG1;
+      margin-bottom: 32px;
+    }
+    &-button {
+      .button(@width: 273px, @height: 72px, @fontSize: 28px, @fontWeight: 400, @borderRadius: 43px);
+      background: rgba(109, 61, 245, 0.12);
+      text-align: center;
+      color: @blHighlightColor;
+    }
+  }
+
+  &__kanban {
+    min-height: 280px;
+    box-sizing: border-box;
+    border-radius: 16px;
+    margin-bottom: 24px;
+    padding: 36px 40px;
+    position: relative;
+    background: #6d3df5;
+    color: #fff;
+    &-button {
+      position: absolute;
+      top: 44px;
+      right: 56px;
+      font-size: 24px;
+      line-height: 24px;
+      &__image {
+        width: 20px;
+        height: 20px;
+        display: inline-block;
+        margin-left: 4px;
+      }
+    }
+    &-title {
+      font-style: normal;
+      font-weight: 400;
+      letter-spacing: 0.02em;
+      opacity: 0.7;
+    }
+    &-money {
+      font-family: 'Helvetica Neue';
+      font-style: normal;
+      font-weight: 700;
+    }
+    &-total {
+      margin-bottom: 24px;
+      .partner-fragment-entry__kanban {
+        &-title {
+          font-size: 26px;
+          line-height: 40px;
+          margin-bottom: 12px;
+        }
+        &-money {
+          font-size: 48px;
+          line-height: 42px;
+        }
+      }
+    }
+    &-details {
+      .flex-row();
+      &-part {
+        flex: 1;
+
+        .partner-fragment-entry__kanban {
+          &-title {
+            font-size: 24px;
+            line-height: 36px;
+            margin-bottom: 4px;
+          }
+          &-money {
+            font-size: 32px;
+            line-height: 42px;
+          }
+        }
+
+      }
+    }
+  }
+}

src/components/partner-entry/index.tsx

@@ -0,0 +1,60 @@
+import { Button, Image } from '@tarojs/components';
+
+import { useState } from 'react';
+import './index.less';
+
+const PREFIX = 'partner-fragment-entry';
+
+function JoinEntry() {
+  return (
+    <div className={`${PREFIX}__join`}>
+      <div className={`${PREFIX}__join-title`}>
+        加入播络合伙人，高达<span className="highlight">75%</span>分成
+      </div>
+      <div className={`${PREFIX}__join-desc`}>模式简单，分成比例高，欢迎各位群主、经纪人或机构</div>
+      <Button className={`${PREFIX}__join-button`}>立即加入</Button>
+    </div>
+  );
+}
+
+function PartnerKanban() {
+  return (
+    <div className={`${PREFIX}__kanban`}>
+      <div className={`${PREFIX}__kanban-button`}>
+        查看详情
+        <Image
+          className={`${PREFIX}__kanban-button__image`}
+          mode="aspectFit"
+          src={require('@/statics/svg/caret-right.svg')}
+        />
+      </div>
+      <div className={`${PREFIX}__kanban-total`}>
+        <div className={`${PREFIX}__kanban-title`}>总收益（元）</div>
+        <div className={`${PREFIX}__kanban-money`}>1666.66</div>
+      </div>
+      <div className={`${PREFIX}__kanban-details`}>
+        <div className={`${PREFIX}__kanban-details-part`}>
+          <div className={`${PREFIX}__kanban-title`}>可提现（元）</div>
+          <div className={`${PREFIX}__kanban-money`}>666.23</div>
+        </div>
+        <div className={`${PREFIX}__kanban-details-part`}>
+          <div className={`${PREFIX}__kanban-title`}>提现中（元）</div>
+          <div className={`${PREFIX}__kanban-money`}>666.23</div>
+        </div>
+        <div className={`${PREFIX}__kanban-details-part`}>
+          <div className={`${PREFIX}__kanban-title`}>待分账（元）</div>
+          <div className={`${PREFIX}__kanban-money`}>666.23</div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default function PartnerEntry() {
+  const [state] = useState(1);
+
+  if (state === 0) {
+    return <JoinEntry />;
+  }
+  return <PartnerKanban />;
+}

src/constants/app.ts

@@ -71,6 +71,7 @@ export enum PageUrl {
   CertificationManage = 'pages/certification-manage/index',
   ProtocolWebview = 'pages/protocol-webview/index',
   PrivacyWebview = 'pages/privacy-webview/index',
+  Partner = 'pages/partner/index',
 }
 
 export enum PluginUrl {

src/hooks/use-config.tsx

@@ -94,6 +94,7 @@ export const APP_CONFIG: AppConfigType = {
     PageUrl.CertificationManage,
     PageUrl.ProtocolWebview,
     PageUrl.PrivacyWebview,
+    PageUrl.Partner,
     // PageUrl.DevDebug,
   ],
   window: {

src/pages/partner/index.config.ts

@@ -0,0 +1,3 @@
+export default definePageConfig({
+  navigationBarTitleText: '合伙人',
+});

src/pages/partner/index.less

@@ -0,0 +1,10 @@
+@import '@/styles/common.less';
+@import '@/styles/variables.less';
+
+.partner {
+  &__tabs {
+    --tabs-active-color: @blHighlightColor;
+    --tabs-nav-background-color: #fff;
+    --tabs-wrap-height: 98px;
+  }
+}

src/pages/partner/index.tsx

@@ -0,0 +1,23 @@
+import { Tabs } from '@taroify/core';
+
+import './index.less';
+
+const PREFIX = 'partner';
+
+export default function Partner() {
+  return (
+    <div className={PREFIX}>
+      <Tabs swipeable className={`${PREFIX}__tabs`}>
+        <Tabs.TabPane value={0} title="简介">
+          简介
+        </Tabs.TabPane>
+        <Tabs.TabPane value={1} title="邀请名单">
+          邀请名单
+        </Tabs.TabPane>
+        <Tabs.TabPane value={2} title="我的收益">
+          我的收益
+        </Tabs.TabPane>
+      </Tabs>
+    </div>
+  );
+}

src/pages/user/index.tsx

@@ -6,6 +6,7 @@ import { useCallback } from 'react';
 import CustomNavigationBar from '@/components/custom-navigation-bar';
 import HomePage from '@/components/home-page';
 import LoginButton from '@/components/login-button';
+import PartnerEntry from '@/components/partner-entry';
 import Slogan from '@/components/slogan';
 import SwitchBar from '@/components/switch-bar';
 import { RoleType, PageUrl } from '@/constants/app';
@@ -68,6 +69,7 @@ export default function User() {
             />
           </Button>
         </div>
+        <PartnerEntry />
         {roleType === RoleType.Anchor && <AnchorFragment />}
         {roleType === RoleType.Company && <CompanyFragment />}
       </div>

src/statics/svg/caret-right.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.5 3.75L13.75 10L7.5 16.25" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/utils/company.ts

@@ -9,8 +9,7 @@ export const postCertification = async (data: ICertificationRequest) => {
   return result;
 };
 
-export const getPhone = async(code: string): Promise<{phoneNumber: string}> => {
-  const result = await http.post<{ code :string }>(API.GET_PHONE, { data: {code} });
+export const getPhone = async (code: string): Promise<{ code: string }> => {
+  const result = await http.post<{ code: string }>(API.GET_PHONE, { data: { code } });
   return result;
-
-}
+};