feat: update of partner

2025-05-15 01:02:00 +08:00
parent 7aafc3a789
commit d2ac64f20c
52 changed files with 1435 additions and 265 deletions
--- a/src/components/partner-kanban/index.tsx
+++ b/src/components/partner-kanban/index.tsx
@ -0,0 +1,148 @@
+import { Button, Image } from '@tarojs/components';
+
+import { Dialog } from '@taroify/core';
+import { Question } from '@taroify/icons';
+import { useCallback, useState, useEffect } from 'react';
+
+import { PageUrl } from '@/constants/app';
+import { PartnerProfitsState } from '@/types/partner';
+import { formatMoney, getPartnerProfitStat } from '@/utils/partner';
+import { navigateTo } from '@/utils/route';
+
+import './index.less';
+
+const PREFIX = 'partner-kanban';
+
+function TipDialog(props: { open: boolean; onClose: () => void }) {
+  return (
+    <Dialog open={props.open} onClose={props.onClose}>
+      <Dialog.Content>
+        <div className={`${PREFIX}-tip-dialog__container`}>
+          <div
+            className={`${PREFIX}-tip-dialog__title`}
+          >{`会员支付的收益无需提现，\n支付15日后自动分账至微信零钱`}</div>
+          <Button className={`${PREFIX}-tip-dialog__confirm-button`} onClick={props.onClose}>
+            我知道了
+          </Button>
+        </div>
+      </Dialog.Content>
+    </Dialog>
+  );
+}
+
+function WithdrawDialog(props: { open: boolean; onClose: () => void; count: number }) {
+  const handleWithdraw = useCallback(() => {}, []);
+  return (
+    <Dialog open={props.open} onClose={props.onClose}>
+      <Dialog.Content>
+        <div className={`${PREFIX}-withdraw-dialog__container`}>
+          <div className={`${PREFIX}-withdraw-dialog__title`}>本次申请提现金额为</div>
+          <div className={`${PREFIX}-withdraw-dialog__count`}>
+            {props.count}
+            <div className="yuan">元</div>
+          </div>
+          <div className={`${PREFIX}-withdraw-dialog__hint`}>单笔最大500元</div>
+          <Button className={`${PREFIX}-withdraw-dialog__confirm-button`} onClick={handleWithdraw}>
+            提现
+          </Button>
+          <div className={`${PREFIX}-withdraw-dialog__cancel-button`} onClick={props.onClose}>
+            取消
+          </div>
+        </div>
+      </Dialog.Content>
+    </Dialog>
+  );
+}
+
+type PartnerKanbanProps = {
+  simple?: boolean;
+};
+export default function PartnerKanban({ simple }: PartnerKanbanProps) {
+  const [tipOpen, setTipOpen] = useState(false);
+  const [withdrawOpen, setWithdrawOpen] = useState(false);
+  const [stats, setStats] = useState<PartnerProfitsState>({
+    withdraw: 0,
+    available: 0,
+    withdrawing: 0,
+  });
+  const total = stats.withdrawing + stats.available + stats.withdraw;
+  const handleNavigate = useCallback(() => {
+    navigateTo(PageUrl.Partner);
+  }, []);
+  const handleNavigateRecord = useCallback(() => {
+    navigateTo(PageUrl.WithdrawRecord);
+  }, []);
+  const handleViewTip = useCallback(() => {
+    setTipOpen(true);
+  }, []);
+  const handleTipClose = useCallback(() => {
+    setTipOpen(false);
+  }, []);
+  const handleViewWithdraw = useCallback(() => {
+    setWithdrawOpen(true);
+  }, []);
+  const handleWithdrawClose = useCallback(() => {
+    setWithdrawOpen(false);
+  }, []);
+  const getProfitStats = useCallback(async () => {
+    const data = await getPartnerProfitStat();
+    setStats(data);
+  }, []);
+  useEffect(() => {
+    getProfitStats();
+  }, []);
+  return (
+    <div className={`${PREFIX} ${simple ? `${PREFIX}__simple` : ''}`}>
+      <Image
+        className={`${PREFIX}__bg`}
+        src="https://publiccdn.neighbourhood.com.cn/img/partner_bg.png"
+        mode="aspectFill"
+      />
+      <div className={`${PREFIX}__content`}>
+        {simple && (
+          <div className={`${PREFIX}__button`} onClick={handleNavigate}>
+            查看详情
+            <Image
+              className={`${PREFIX}__button-image`}
+              mode="aspectFit"
+              src={require('@/statics/svg/caret-right.svg')}
+            />
+          </div>
+        )}
+        <div className={`${PREFIX}__total`}>
+          <div className={`${PREFIX}__title`}>总收益（元）</div>
+          <div className={`${PREFIX}__money`}>{formatMoney(total)}</div>
+        </div>
+        <div className={`${PREFIX}__details`}>
+          <div className={`${PREFIX}__details-part`}>
+            <div className={`${PREFIX}__title`}>可提现（元）</div>
+            <div className={`${PREFIX}__money`}>{formatMoney(stats.available)}</div>
+          </div>
+          <div className={`${PREFIX}__details-part`}>
+            <div className={`${PREFIX}__title`}>提现中（元）</div>
+            <div className={`${PREFIX}__money`}>{formatMoney(stats.withdrawing)}</div>
+          </div>
+          <div className={`${PREFIX}__details-part`}>
+            <div className={`${PREFIX}__title`}>
+              已提现（元）
+              {!simple && <Question onClick={handleViewTip} />}
+            </div>
+            <div className={`${PREFIX}__money`}>{formatMoney(stats.withdraw)}</div>
+          </div>
+        </div>
+        {!simple && (
+          <div className={`${PREFIX}__buttons`}>
+            <Button className={`${PREFIX}__withdraw`} onClick={handleViewWithdraw}>
+              提现
+            </Button>
+            <Button className={`${PREFIX}__record`} onClick={handleNavigateRecord}>
+              提现记录
+            </Button>
+          </div>
+        )}
+      </div>
+      {!simple && <TipDialog open={tipOpen} onClose={handleTipClose} />}
+      {!simple && <WithdrawDialog count={350} open={withdrawOpen} onClose={handleWithdrawClose} />}
+    </div>
+  );
+}