diff --git a/apps/frontend/src/components/worker/WorkerContactModal.tsx b/apps/frontend/src/components/worker/WorkerContactModal.tsx new file mode 100644 index 00000000..c6172f75 --- /dev/null +++ b/apps/frontend/src/components/worker/WorkerContactModal.tsx @@ -0,0 +1,79 @@ +import { Alert, Button, Descriptions, Image, Modal, Space, Typography } from 'antd' + +import { formatMoney, formatWorkerStatus } from '@/pages/worker/worker-profile-view-utils' +import type { WorkerFinanceConfig, WorkerUser } from '@/types/worker-platform' + +export type WorkerContactModalProps = { + open: boolean + onClose: () => void + isMobile?: boolean + worker?: WorkerUser | null + financeConfig?: WorkerFinanceConfig | null + title?: string +} + +export function WorkerContactModal({ + open, + onClose, + isMobile = false, + worker, + financeConfig, + title = '联系客服', +}: WorkerContactModalProps) { + return ( + + 我知道了 + + } + onCancel={onClose} + > + + + {financeConfig?.adminContact?.wechatQrCodeImage ? ( +
+ 客服微信二维码 +
+ ) : ( + + 客服暂未配置微信二维码,请按下方账号信息联系。 + + )} + + + {worker?.username || '-'} + + {worker?.displayName || '-'} + + {worker?.phone || '-'} + + + {formatWorkerStatus(worker?.status || '')} + + + {formatMoney(worker?.wallet?.availableAmount)} + + + + 建议沟通时一起提供:申请类型、金额、订单号或转账备注、收款方式,以及当前账号信息。 + +
+
+ ) +} diff --git a/apps/frontend/src/pages/worker/WorkerHallPage.tsx b/apps/frontend/src/pages/worker/WorkerHallPage.tsx index a7f62b01..83e28528 100644 --- a/apps/frontend/src/pages/worker/WorkerHallPage.tsx +++ b/apps/frontend/src/pages/worker/WorkerHallPage.tsx @@ -3,6 +3,7 @@ import { ArrowRightOutlined, CheckCircleOutlined, ClockCircleOutlined, + CustomerServiceOutlined, FireOutlined, PushpinOutlined, QuestionCircleOutlined, @@ -35,6 +36,8 @@ import { import { useEffect, useRef, useState } from 'react' import { Link } from 'react-router' +import { WorkerContactModal } from '@/components/worker/WorkerContactModal' + import { fetchWorkerHallCategories, fetchWorkerHallOrders, @@ -83,6 +86,7 @@ export default function WorkerHallPage() { const [grabbingId, setGrabbingId] = useState(0) const [sharingOrder, setSharingOrder] = useState(null) const [leaderboardOpen, setLeaderboardOpen] = useState(false) + const [contactOpen, setContactOpen] = useState(false) const [leaderboardPeriod, setLeaderboardPeriod] = useState('all') const [sharingQuantity, setSharingQuantity] = useState(1) const [submittingSharing, setSubmittingSharing] = useState(false) @@ -236,6 +240,7 @@ export default function WorkerHallPage() { setFailedImageKeys({}) }, [allCategories.length, allIconUrl]) const worker = profileQuery.data?.data.worker + const financeConfig = profileQuery.data?.data.financeConfig const isInternalWorker = worker?.workerType === 'internal' const activeCount = Number(profileQuery.data?.data.summary.activeOrderCount || 0) const pendingAcceptanceCount = hallSummaryQuery.data?.pendingAcceptanceCount || 0 @@ -411,6 +416,16 @@ export default function WorkerHallPage() { + +
+
@@ -1298,6 +1316,14 @@ export default function WorkerHallPage() { ) : null} + + setContactOpen(false)} + isMobile={isMobile} + worker={worker} + financeConfig={financeConfig} + /> ) } diff --git a/apps/frontend/src/pages/worker/WorkerProfileAccountModals.tsx b/apps/frontend/src/pages/worker/WorkerProfileAccountModals.tsx index af9492ab..1b873095 100644 --- a/apps/frontend/src/pages/worker/WorkerProfileAccountModals.tsx +++ b/apps/frontend/src/pages/worker/WorkerProfileAccountModals.tsx @@ -17,7 +17,8 @@ import type { WorkerFinanceConfig, WorkerSessionDevice, WorkerUser } from '@/typ import { formatDateTime } from '@/utils/date-time' import { isWorkerPasswordStrong, WORKER_PASSWORD_RULE_MESSAGE } from '@/utils/worker-password' -import { formatMoney, formatWorkerStatus } from './worker-profile-view-utils' +import { WorkerContactModal } from '@/components/worker/WorkerContactModal' +import { formatWorkerStatus } from './worker-profile-view-utils' export type PasswordFormValues = { currentPassword?: string @@ -184,60 +185,13 @@ export function WorkerProfileAccountModals({ - setContactOpen(false)}> - 我知道了 - - } - onCancel={() => setContactOpen(false)} - > - - - {financeConfig?.adminContact?.wechatQrCodeImage ? ( -
- 管理员微信二维码 -
- ) : ( - - 管理员暂未配置微信二维码,请按下方账号信息联系。 - - )} - - - {worker?.username || '-'} - - {worker?.displayName || '-'} - - {worker?.phone || '-'} - - - {formatWorkerStatus(worker?.status || '')} - - - {formatMoney(worker?.wallet.availableAmount)} - - - - 建议沟通时一起提供:申请类型、金额、订单号或转账备注、收款方式,以及当前账号信息。 - -
-
+ onClose={() => setContactOpen(false)} + isMobile={isMobile} + worker={worker} + financeConfig={financeConfig} + /> setContactOpen(true)}> + + 联系客服 + + ``` + - 采用浅暖橙背景(`#fff7ed`)+ 优雅橙边框(`#fed7aa`)+ 微动效,与打手端整体暖橙调性浑然一体,点击即弹出客服微信与账号卡片。 +3. **桌面端同步补齐入口**: + - 在桌面端头部操作按钮栏(刷新与排行榜旁)新增 ``。 +4. **验证门禁全绿通过 [确信度: 100%]**: + - 前端 59 个自动化测试全绿(**59 pass / 0 fail**); + - 前端 `format:check`、`lint:check`、`typecheck`、`build` 均零错误零警告通过; + - 后端 504 个自动化测试全绿(**501 pass / 3 skipped / 0 fail**)。 +