feat: login

src/pages/start/index.tsx

@@ -1,23 +1,76 @@
 import { Image } from '@tarojs/components';
-import { useLoad } from '@tarojs/taro';
 
-import { switchDefaultTab } from '@/utils/app';
+import { useLoad } from '@tarojs/taro';
+import Slogan from '@/components/slogan';
+import { PageUrl, RoleType } from '@/constants/app';
+import { ANCHOR_TAB_LIST, COMPANY_TAB_LIST } from '@/hooks/use-config';
+import store from '@/store';
+import { changeHomePage } from '@/store/actions';
+import { getRoleType, switchDefaultTab, switchRoleType } from '@/utils/app';
+import { switchTab } from '@/utils/route';
 
 import './index.less';
 
 const PREFIX = 'page-start';
 
 export default function Start() {
+  const mode = getRoleType();
   useLoad(() => {
     switchDefaultTab();
   });
+  const handleAnchor = async () => {
+    await switchRoleType(RoleType.Anchor);
+    store.dispatch(changeHomePage(ANCHOR_TAB_LIST[0].type));
+    await switchTab(ANCHOR_TAB_LIST[0].pagePath as PageUrl);
+  };
+
+  const handleCompany = async () => {
+    await switchRoleType(RoleType.Company);
+    store.dispatch(changeHomePage(COMPANY_TAB_LIST[0].type));
+    await switchTab(COMPANY_TAB_LIST[0].pagePath as PageUrl);
+  };
 
   return (
-    <div className={PREFIX}>
-      <div className={`${PREFIX}__app`}>
-        <Image className={`${PREFIX}__icon`} mode="aspectFit" src={require('@/statics/svg/slogan.svg')} />
-        <div className={`${PREFIX}__text`}>每天推荐海量高薪通告 </div>
-      </div>
+    <div className={`${PREFIX} ${mode ? '' : 'color-bg'}`}>
+      {mode && (
+        <div className={`${PREFIX}__app`}>
+          <Image className={`${PREFIX}__icon`} mode="aspectFit" src={require('@/statics/svg/slogan.svg')} />
+          <div className={`${PREFIX}__text`}>每天推荐海量高薪通告 </div>
+        </div>
+      )}
+      {!mode && (
+        <>
+          <div className={`${PREFIX}__role-app`}>
+            <div className={`${PREFIX}__greet`}>Hi，很高兴见到你</div>
+            <div className={`${PREFIX}__title`}>请选择您的身份</div>
+            <div className={`${PREFIX}__card`} onClick={handleAnchor}>
+              <Image
+                className={`${PREFIX}__avatar anchor`}
+                src="https://publiccdn.neighbourhood.com.cn/img/avatar_f.png"
+                mode="aspectFill"
+              />
+              <div className={`${PREFIX}__content`}>
+                <div className="title">我是主播</div>
+                <div className="desc">我要找工作</div>
+              </div>
+              <Image src={require('@/statics/svg/arrow-right.svg')} mode="aspectFill" className={`${PREFIX}__arrow`} />
+            </div>
+            <div className={`${PREFIX}__card`} onClick={handleCompany}>
+              <Image
+                className={`${PREFIX}__avatar company`}
+                src="https://publiccdn.neighbourhood.com.cn/img/avatar_m.png"
+                mode="aspectFill"
+              />
+              <div className={`${PREFIX}__content`}>
+                <div className="title">我是企业</div>
+                <div className="desc">我要招主播</div>
+              </div>
+              <Image src={require('@/statics/svg/arrow-right.svg')} mode="aspectFill" className={`${PREFIX}__arrow`} />
+            </div>
+          </div>
+          <Slogan />
+        </>
+      )}
     </div>
   );
 }