diff --git a/apps/frontend/src/pages/worker/WorkerHallPage.tsx b/apps/frontend/src/pages/worker/WorkerHallPage.tsx index c2fe55c9..545cd349 100644 --- a/apps/frontend/src/pages/worker/WorkerHallPage.tsx +++ b/apps/frontend/src/pages/worker/WorkerHallPage.tsx @@ -140,7 +140,7 @@ export default function WorkerHallPage() { { label: '当前余额', value: worker ? formatMoney(worker.wallet.availableAmount) : '-', - note: '可用于冻结押金', + note: worker ? `冻结押金 ${formatMoney(worker.wallet.frozenDepositAmount)}` : '可用于抢单冻结', }, { label: '接单上限', @@ -151,17 +151,7 @@ export default function WorkerHallPage() { note: remainingSlots === null ? '当前等级待配置' - : `还能再接 ${remainingSlots} 单`, - }, - { - label: '冻结押金', - value: worker ? formatMoney(worker.wallet.frozenDepositAmount) : '-', - note: '当前已占用金额', - }, - { - label: '问题单', - value: `${problemCount} 单`, - note: problemCount ? '建议优先处理' : '当前暂无问题单', + : `待验收 ${pendingAcceptanceCount} 单 / 问题单 ${problemCount} 单`, }, ] @@ -257,72 +247,50 @@ export default function WorkerHallPage() { <>
{orders.map((order) => { - const requirementFields = getRequirementFields(order) const disabledReason = resolveGrabDisabledReason( order, worker, remainingSlots, ) - const zeroDeposit = Number(order.freezeDepositAmount || 0) <= 0 return (
-
-
- setDetailOrder(order)}> - {order.productName || order.workOrderNo} - - - {order.categoryName || '默认分类'} - -
-
- - {zeroDeposit ? '免押金' : '需押金'} - - - {formatRequirementShortLabel(requirementFields)} - -
-
- -
+
+ setDetailOrder(order)} + > + {order.productName || order.workOrderNo} + - 工单号：{order.workOrderNo} + {order.categoryName || '默认分类'} - 订单号：{order.platformOrderId || '-'} + 订单号：{order.platformOrderId || order.workOrderNo}
-
+
{formatMoney(order.rewardAmount)}
-
- 所需保证金：{formatMoney(order.freezeDepositAmount)} - 发布时间：{formatDateTime(resolvePublishedTime(order))} -
+ + 所需保证金：{formatMoney(order.freezeDepositAmount)} +
-
-
- 资料要求 - {formatRequirementPreview(requirementFields)} -
-
- 抢单判断 - - {disabledReason || buildGrabReadyHint(order)} - -
-
+ {disabledReason ? ( + + {disabledReason} + + ) : null}
{canSubmitAcceptance(row) ? ( - ) : null} @@ -270,119 +254,114 @@ export default function WorkerOrdersPage() {
-
- - 全部订单 - - {Number(overviewQuery.data?.all || 0)} - - 当前账号历史接单总数 - - {STATUS_OVERVIEW.map((item) => ( - - {item.label} - - {Number(overviewQuery.data?.[item.key] || 0)} - - {item.note} - + + {STATUS_SUMMARY_ITEMS.map((item) => ( + + + + {item.note} + + ))} -
+ - -
- - } - onChange={(event) => { - const nextValue = event.target.value - setKeywordInput(nextValue) - if (!nextValue.trim()) { - setKeyword('') - setPage(1) + + + + + + } + onChange={(event) => { + const nextValue = event.target.value + setKeywordInput(nextValue) + if (!nextValue.trim()) { + setKeyword('') + setPage(1) + } + }} + onPressEnter={applyKeywordSearch} + /> + + + + 当前筛选： + {STATUS_OPTIONS.find((item) => item.value === status)?.label || '全部订单'} + + + + { + const countKey = item.value || 'all' + return { + value: item.value || 'all', + label: `${item.label} (${Number(overviewQuery.data?.[countKey] || 0)})`, } + })} + onChange={(value) => { + const nextStatus = String(value) === 'all' ? '' : String(value) + setStatus(nextStatus) + setPage(1) }} - onPressEnter={applyKeywordSearch} /> - - - - 当前筛选：{STATUS_OPTIONS.find((item) => item.value === status)?.label || '全部订单'} - -
+ -
- {STATUS_OPTIONS.map((item) => { - const active = status === item.value - const countKey = item.value || 'all' - return ( - - ) - })} -
- - - rowKey="workOrderId" - loading={ordersQuery.isLoading} - dataSource={orders} - columns={columns} - locale={{ - emptyText: ordersQuery.error ? ( - - ) : ( - - ), - }} - pagination={{ - current: pagination?.page || page, - pageSize: pagination?.pageSize || pageSize, - total: pagination?.total || 0, - showSizeChanger: true, - pageSizeOptions: [10, 20, 50, 100], - showTotal: (total) => `共 ${total} 条`, - onChange: (nextPage, nextPageSize) => { - setPage(nextPage) - setPageSize(nextPageSize) - }, - }} - scroll={{ x: 1160 }} - /> + + rowKey="workOrderId" + size="small" + loading={ordersQuery.isLoading} + dataSource={orders} + columns={columns} + locale={{ + emptyText: ordersQuery.error ? ( + + ) : ( + + ), + }} + pagination={{ + current: pagination?.page || page, + pageSize: pagination?.pageSize || pageSize, + total: pagination?.total || 0, + showSizeChanger: true, + pageSizeOptions: [10, 20, 50, 100], + showTotal: (total) => `共 ${total} 条`, + onChange: (nextPage, nextPageSize) => { + setPage(nextPage) + setPageSize(nextPageSize) + }, + }} + scroll={{ x: 1160 }} + /> + {canSubmitAcceptance(detailOrder) ? ( - ) : null} diff --git a/apps/frontend/src/pages/worker/WorkerProfilePage.tsx b/apps/frontend/src/pages/worker/WorkerProfilePage.tsx index bf03b907..d424bdcb 100644 --- a/apps/frontend/src/pages/worker/WorkerProfilePage.tsx +++ b/apps/frontend/src/pages/worker/WorkerProfilePage.tsx @@ -12,22 +12,27 @@ import { useQuery, useQueryClient } from '@tanstack/react-query' import { Alert, App, + Avatar, Button, Card, + Col, Descriptions, Empty, Form, Input, InputNumber, Modal, + Row, Select, Space, + Statistic, Table, + Tabs, Tag, Typography, } from 'antd' import type { TableColumnsType } from 'antd' -import { useRef, useState, type ReactNode, type RefObject } from 'react' +import { useState } from 'react' import { useNavigate } from 'react-router' import { @@ -39,13 +44,14 @@ import { fetchWorkerWalletLedgers, logoutWorker, } from '@/services/worker' -import { clearWorkerSession } from '@/utils/worker-auth' import type { WorkerFinanceRequest, WorkerProfileSummary, WorkerUser, WorkerWalletLedger, } from '@/types/worker-platform' +import { formatDateTime } from '@/utils/date-time' +import { clearWorkerSession } from '@/utils/worker-auth' type RechargeFormValues = { amount?: number @@ -66,13 +72,21 @@ type PasswordFormValues = { confirmPassword?: string } +type MetricCardItem = { + label: string + value: number + note: string + prefix?: string + suffix?: string + precision?: number +} + export default function WorkerProfilePage() { const { message } = App.useApp() const navigate = useNavigate() const queryClient = useQueryClient() - const ledgerSectionRef = useRef(null) - const requestSectionRef = useRef(null) + const [activeTab, setActiveTab] = useState('account') const [ledgerPage, setLedgerPage] = useState(1) const [ledgerPageSize, setLedgerPageSize] = useState(10) const [ledgerType, setLedgerType] = useState('') @@ -152,21 +166,17 @@ export default function WorkerProfilePage() { } } - function scrollToSection(ref: RefObject) { - ref.current?.scrollIntoView({ behavior: 'smooth', block: 'start' }) - } - function jumpToLedgerSection(nextLedgerType = '') { setLedgerType(nextLedgerType) setLedgerPage(1) - scrollToSection(ledgerSectionRef) + setActiveTab('ledger') } function jumpToRequestSection(nextRequestType = '', nextStatus = '') { setRequestType(nextRequestType) setRequestStatus(nextStatus) setRequestPage(1) - scrollToSection(requestSectionRef) + setActiveTab('requests') } async function submitRecharge(values: RechargeFormValues) { @@ -232,7 +242,7 @@ export default function WorkerProfilePage() { title: '时间', dataIndex: 'createdAt', width: 180, - render: (value) => String(value || '-'), + render: (value) => formatDateTime(String(value || '')), }, { title: '类型', @@ -287,7 +297,7 @@ export default function WorkerProfilePage() { title: '申请时间', dataIndex: 'createdAt', width: 180, - render: (value) => String(value || '-'), + render: (value) => formatDateTime(String(value || '')), }, { title: '类型', @@ -385,7 +395,7 @@ export default function WorkerProfilePage() { {!worker && !profileQuery.isLoading ? : null} {worker ? ( - <> + {!canUseFinanceActions ? ( ) : null} - -
-
-
- {String(worker.displayName || worker.username || '打') - .trim() - .slice(0, 1) - .toUpperCase()} -
-
-
- - {worker.displayName || worker.username} - - - - {worker.level?.name || '未分级'} - - - {formatWorkerStatus(worker.status)} - - -
- - 账号：{worker.username} - - - 手机号：{worker.phone || '-'} - -
-
-
- - 累计充值 - - {formatMoney(worker.wallet.totalCreditedAmount)} - - - - 累计结算 - - {formatMoney(worker.wallet.totalSettledAmount)} - - -
-
- -
- {buildMetricCards(worker, summary).map((item) => ( -
- {item.label} - {item.value} - {item.note} -
- ))} -
- - -
- } - title="充值申请" - description="线下充值后提交金额与备注，等待管理员入账。" - tone="blue" - disabled={!canUseFinanceActions} - onClick={() => setRechargeOpen(true)} - /> - } - title="提现申请" - description="填写收款账号并发起提现，系统会保留申请记录。" - tone="green" - disabled={!canUseFinanceActions} - onClick={() => setWithdrawOpen(true)} - /> - } - title="资金流水" - description="查看充值、押金冻结、结算奖励等钱包变动明细。" - tone="slate" - onClick={() => jumpToLedgerSection()} - /> - } - title="提现记录" - description="快速查看提现申请状态、审核备注和收款信息。" - tone="orange" - onClick={() => jumpToRequestSection('withdraw')} - /> - } - title="修改密码" - description="更新接单账号密码，修改后会要求重新登录。" - tone="violet" - onClick={() => setPasswordOpen(true)} - /> - } - title="联系管理员" - description="查看处理说明和当前账号资料，沟通充值、提现或审核问题。" - tone="amber" - onClick={() => setContactOpen(true)} - /> - } - title="退出登录" - description="当前设备退出接单端登录，会清理本地登录态。" - tone="rose" - onClick={submitLogout} - /> -
- - - - {worker.username} - {worker.displayName} - {worker.phone || '-'} - + + + + {resolveWorkerInitial(worker)} + + + + {worker.displayName || worker.username} + + + 账号：{worker.username} + + + 手机号：{worker.phone || '-'} + + + {formatWorkerStatus(worker.status)} - - - {worker.level?.name || '-'} - - - {formatMoney(worker.level?.permissions.depositFreeAmount || 0)} - - - {worker.level?.permissions.maxActiveOrders || 0} 单 - - - {worker.reviewNote || '-'} - - - {worker.createdAt || '-'} - - - {worker.updatedAt || '-'} - - + {worker.level?.name || '未分级'} + + -
- - { - setRequestType(nextType) - setRequestPage(1) - }} - /> - { + setLedgerType(nextType) + setLedgerPage(1) + }} + /> + + + } > - 刷新 - - - } - > - - rowKey="requestId" - size="small" - loading={requestsQuery.isLoading} - dataSource={requestsQuery.data?.data.items || []} - columns={requestColumns} - locale={{ - emptyText: requestsQuery.error - ? requestsQuery.error instanceof Error - ? requestsQuery.error.message - : '读取申请记录失败' - : '暂无申请记录', - }} - pagination={{ - current: requestsQuery.data?.data.pagination.page || requestPage, - pageSize: requestsQuery.data?.data.pagination.pageSize || requestPageSize, - total: requestsQuery.data?.data.pagination.total || 0, - showSizeChanger: true, - pageSizeOptions: [10, 20, 50], - showTotal: (total) => `共 ${total} 条`, - onChange: (nextPage, nextPageSize) => { - setRequestPage(nextPage) - setRequestPageSize(nextPageSize) - }, - }} - scroll={{ x: 980 }} - /> - -
- + + rowKey="ledgerId" + size="small" + loading={ledgersQuery.isLoading} + dataSource={ledgersQuery.data?.data.items || []} + columns={ledgerColumns} + locale={{ + emptyText: ledgersQuery.error + ? ledgersQuery.error instanceof Error + ? ledgersQuery.error.message + : '读取钱包流水失败' + : '暂无钱包流水', + }} + pagination={{ + current: ledgersQuery.data?.data.pagination.page || ledgerPage, + pageSize: ledgersQuery.data?.data.pagination.pageSize || ledgerPageSize, + total: ledgersQuery.data?.data.pagination.total || 0, + showSizeChanger: true, + pageSizeOptions: [10, 20, 50], + showTotal: (total) => `共 ${total} 条`, + onChange: (nextPage, nextPageSize) => { + setLedgerPage(nextPage) + setLedgerPageSize(nextPageSize) + }, + }} + scroll={{ x: 920 }} + /> + + ), + }, + { + key: 'requests', + label: '申请记录', + children: ( + + { + setRequestStatus(nextStatus) + setRequestPage(1) + }} + /> + + + } + > + + rowKey="requestId" + size="small" + loading={requestsQuery.isLoading} + dataSource={requestsQuery.data?.data.items || []} + columns={requestColumns} + locale={{ + emptyText: requestsQuery.error + ? requestsQuery.error instanceof Error + ? requestsQuery.error.message + : '读取申请记录失败' + : '暂无申请记录', + }} + pagination={{ + current: requestsQuery.data?.data.pagination.page || requestPage, + pageSize: requestsQuery.data?.data.pagination.pageSize || requestPageSize, + total: requestsQuery.data?.data.pagination.total || 0, + showSizeChanger: true, + pageSizeOptions: [10, 20, 50], + showTotal: (total) => `共 ${total} 条`, + onChange: (nextPage, nextPageSize) => { + setRequestPage(nextPage) + setRequestPageSize(nextPageSize) + }, + }} + scroll={{ x: 980 }} + /> + + ), + }, + ]} + /> + ) : null} - + - + passwordForm.submit()} > -
+ void -}) { - return ( - - ) -} - -function buildMetricCards(worker: WorkerUser, summary?: WorkerProfileSummary) { +function buildMetricCards(worker: WorkerUser, summary?: WorkerProfileSummary): MetricCardItem[] { return [ { label: '账户余额', - value: formatMoney(worker.wallet.availableAmount), + value: toYuan(worker.wallet.availableAmount), note: '可用于抢单冻结或提现申请', + prefix: '￥', + precision: 2, }, { label: '冻结押金', - value: formatMoney(worker.wallet.frozenDepositAmount), + value: toYuan(worker.wallet.frozenDepositAmount), note: '抢单后冻结，验收通过会自动释放', + prefix: '￥', + precision: 2, + }, + { + label: '累计充值', + value: toYuan(worker.wallet.totalCreditedAmount), + note: '管理员已处理的累计充值金额', + prefix: '￥', + precision: 2, + }, + { + label: '累计结算', + value: toYuan(worker.wallet.totalSettledAmount), + note: '已经结算入账的报酬金额', + prefix: '￥', + precision: 2, }, { label: '提现中金额', - value: formatMoney(summary?.pendingWithdrawAmount), + value: toYuan(summary?.pendingWithdrawAmount), note: '待管理员处理的提现申请金额', + prefix: '￥', + precision: 2, }, { label: '累计成单', - value: `${Number(summary?.acceptedOrderCount || 0)} 单`, + value: Number(summary?.acceptedOrderCount || 0), note: '已完成并验收通过的工单数量', + suffix: '单', }, ] } @@ -945,10 +928,21 @@ function resolveAvailableForWithdraw( ) } +function resolveWorkerInitial(worker: WorkerUser | undefined) { + return String(worker?.displayName || worker?.username || '打') + .trim() + .slice(0, 1) + .toUpperCase() +} + function formatMoney(value: number | undefined) { return `￥${((Number(value || 0) || 0) / 100).toFixed(2)}` } +function toYuan(value: number | undefined) { + return Number(((Number(value || 0) || 0) / 100).toFixed(2)) +} + function formatWorkerStatus(status: string) { if (status === 'active') return '已审核' if (status === 'pending_review') return '待审核' diff --git a/apps/frontend/src/styles/main.css b/apps/frontend/src/styles/main.css index 196cbced..126d0fe6 100644 --- a/apps/frontend/src/styles/main.css +++ b/apps/frontend/src/styles/main.css @@ -1476,10 +1476,6 @@ select { display: grid; } - .worker-profile-hero-head { - flex-direction: column; - } - .worker-hall-toolbar { width: 100%; justify-content: flex-start; @@ -1713,20 +1709,25 @@ select { .worker-hall-summary-strip { display: grid; - grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); - gap: 12px; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 0; + border: 1px solid #e5e7eb; + border-radius: 12px; + overflow: hidden; + background: #ffffff; } .worker-hall-summary-item { min-width: 0; - padding: 12px 14px; - border-radius: 12px; - border: 1px solid #e2e8f0; - background: #f8fafc; + padding: 14px 16px; display: grid; gap: 4px; } +.worker-hall-summary-item + .worker-hall-summary-item { + border-left: 1px solid #e5e7eb; +} + .worker-hall-summary-label { color: #64748b; font-size: 12px; @@ -1762,25 +1763,18 @@ select { .worker-hall-card { min-width: 0; - padding: 18px 18px 16px; - border-radius: 16px; + padding: 16px; + border-radius: 14px; background: #ffffff; - border: 1px solid #edf0f5; - box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06); + border: 1px solid #e5e7eb; + box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04); display: grid; - gap: 14px; -} - -.worker-hall-card-head { - display: flex; - justify-content: space-between; - align-items: flex-start; gap: 12px; } .worker-hall-card-title { display: grid; - gap: 6px; + gap: 4px; min-width: 0; } @@ -1788,65 +1782,32 @@ select { margin: 0; } -.worker-hall-card-badges { - display: flex; - flex-wrap: wrap; - justify-content: flex-end; +.worker-hall-card-link { + display: block; + max-width: 100%; + font-weight: 600; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.worker-hall-card-amount-row { + display: grid; gap: 6px; } -.worker-hall-card-order { - display: grid; - gap: 4px; -} - -.worker-hall-card-main { - display: grid; - gap: 8px; -} - .worker-hall-card-amount { color: #f97316; - font-size: 34px; + font-size: 32px; line-height: 1; font-weight: 700; } -.worker-hall-card-side { - display: grid; - gap: 4px; - color: #94a3b8; +.worker-hall-card-deposit, +.worker-hall-card-hint { + margin: 0; font-size: 12px; -} - -.worker-hall-card-meta { - display: grid; - gap: 10px; -} - -.worker-hall-card-meta-row { - display: grid; - gap: 6px; -} - -.worker-hall-card-meta-row span { - color: #64748b; - font-size: 12px; -} - -.worker-hall-card-meta-row strong { - color: #334155; - font-weight: 500; line-height: 1.5; - overflow-wrap: anywhere; -} - -.worker-hall-card-danger { - color: #dc2626 !important; -} - -.worker-hall-card-safe { - color: #16a34a !important; } .worker-hall-card-actions { @@ -1862,332 +1823,6 @@ select { gap: 16px; } -.worker-orders-overview-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); - gap: 16px; -} - -.worker-orders-overview-card { - border: 1px solid #e2e8f0; - box-shadow: 0 14px 32px rgba(15, 23, 42, 0.04); -} - -.worker-orders-overview-card .ant-card-body { - display: grid; - gap: 8px; -} - -.worker-orders-overview-card.total { - background: - linear-gradient(135deg, rgba(20, 50, 74, 0.96), rgba(27, 93, 115, 0.92)), - #14324a; -} - -.worker-orders-overview-card.total .worker-orders-overview-label, -.worker-orders-overview-card.total .worker-orders-overview-value, -.worker-orders-overview-card.total .worker-orders-overview-note { - color: #f8fafc; -} - -.worker-orders-overview-card.tone-blue { - border-top: 3px solid #2563eb; -} - -.worker-orders-overview-card.tone-gold { - border-top: 3px solid #d97706; -} - -.worker-orders-overview-card.tone-red { - border-top: 3px solid #dc2626; -} - -.worker-orders-overview-card.tone-green { - border-top: 3px solid #059669; -} - -.worker-orders-overview-card.tone-slate { - border-top: 3px solid #64748b; -} - -.worker-orders-overview-label { - color: #64748b; - font-size: 13px; -} - -.worker-orders-overview-value { - color: #0f172a; - font-size: 28px; - line-height: 1.1; -} - -.worker-orders-overview-note { - color: #94a3b8; - font-size: 12px; - line-height: 1.5; -} - -.worker-orders-table-card .ant-card-body { - display: grid; - gap: 18px; -} - -.worker-orders-toolbar { - display: flex; - gap: 16px; - align-items: center; - justify-content: space-between; - flex-wrap: wrap; -} - -.worker-orders-search { - width: min(520px, 100%); -} - -.worker-orders-status-tabs { - display: flex; - gap: 10px; - flex-wrap: wrap; -} - -.worker-orders-status-tab { - padding: 10px 14px; - border-radius: 14px; - border: 1px solid #dbe4ee; - background: #f8fafc; - color: #475569; - display: inline-flex; - align-items: center; - gap: 10px; - cursor: pointer; - transition: - border-color 0.18s ease, - background 0.18s ease, - color 0.18s ease, - transform 0.18s ease; -} - -.worker-orders-status-tab:hover { - transform: translateY(-1px); - border-color: #90b7cf; -} - -.worker-orders-status-tab strong { - font-size: 13px; -} - -.worker-orders-status-tab.is-active { - border-color: transparent; - background: linear-gradient(135deg, #1b5d73, #237b77); - color: #f8fafc; - box-shadow: 0 10px 24px rgba(27, 93, 115, 0.24); -} - -.worker-profile-hero { - overflow: hidden; - border: 1px solid rgba(25, 94, 125, 0.14); - background: - radial-gradient(circle at top right, rgba(116, 227, 214, 0.18), transparent 30%), - linear-gradient(135deg, #14324a 0%, #1b5d73 55%, #237b77 100%); -} - -.worker-profile-hero .ant-card-body { - display: grid; - gap: 24px; -} - -.worker-profile-hero-head { - display: flex; - justify-content: space-between; - gap: 24px; - align-items: flex-start; -} - -.worker-profile-identity { - display: flex; - align-items: center; - gap: 16px; - min-width: 0; -} - -.worker-profile-avatar { - width: 72px; - height: 72px; - border-radius: 22px; - display: grid; - place-items: center; - flex-shrink: 0; - background: rgba(255, 255, 255, 0.15); - border: 1px solid rgba(255, 255, 255, 0.24); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22); - color: #ffffff; - font-size: 28px; - font-weight: 700; -} - -.worker-profile-identity-copy { - display: grid; - gap: 6px; - min-width: 0; -} - -.worker-profile-identity-copy .ant-typography { - color: rgba(239, 248, 255, 0.88); -} - -.worker-profile-identity-title { - display: flex; - align-items: center; - gap: 12px; - flex-wrap: wrap; -} - -.worker-profile-identity-title .ant-typography { - margin: 0; - color: #ffffff; -} - -.worker-profile-tag { - border-color: transparent; - background: rgba(255, 255, 255, 0.14); - color: #f8fafc; -} - -.worker-profile-hero-side { - display: flex; - gap: 24px; - flex-wrap: wrap; - justify-content: flex-end; -} - -.worker-profile-hero-side .ant-space { - padding: 10px 14px; - border-radius: 14px; - background: rgba(255, 255, 255, 0.1); -} - -.worker-profile-hero-side .ant-typography { - color: rgba(239, 248, 255, 0.88); -} - -.worker-profile-metrics { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); - gap: 14px; -} - -.worker-profile-metric { - display: grid; - gap: 6px; - padding: 16px 18px; - border-radius: 18px; - background: rgba(255, 255, 255, 0.1); - border: 1px solid rgba(255, 255, 255, 0.12); -} - -.worker-profile-metric-label, -.worker-profile-metric-note { - color: rgba(239, 248, 255, 0.75); - font-size: 12px; -} - -.worker-profile-metric-value { - color: #ffffff; - font-size: 26px; - line-height: 1.2; -} - -.worker-profile-actions { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); - gap: 16px; -} - -.worker-profile-action-card { - width: 100%; - padding: 18px; - border-radius: 18px; - border: 1px solid #e2e8f0; - background: #ffffff; - text-align: left; - display: grid; - gap: 10px; - cursor: pointer; - transition: - transform 0.18s ease, - box-shadow 0.18s ease, - border-color 0.18s ease; - box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04); -} - -.worker-profile-action-card:hover { - transform: translateY(-2px); - box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08); -} - -.worker-profile-action-card:disabled { - cursor: not-allowed; - opacity: 0.58; - transform: none; - box-shadow: none; -} - -.worker-profile-action-icon { - width: 48px; - height: 48px; - border-radius: 14px; - display: grid; - place-items: center; - font-size: 20px; -} - -.worker-profile-action-title { - color: #0f172a; - font-size: 16px; - font-weight: 600; -} - -.worker-profile-action-description { - color: #64748b; - font-size: 13px; - line-height: 1.6; -} - -.worker-profile-action-card.is-blue .worker-profile-action-icon { - background: #dbeafe; - color: #2563eb; -} - -.worker-profile-action-card.is-green .worker-profile-action-icon { - background: #dcfce7; - color: #16a34a; -} - -.worker-profile-action-card.is-slate .worker-profile-action-icon { - background: #e2e8f0; - color: #334155; -} - -.worker-profile-action-card.is-orange .worker-profile-action-icon { - background: #ffedd5; - color: #ea580c; -} - -.worker-profile-action-card.is-violet .worker-profile-action-icon { - background: #ede9fe; - color: #7c3aed; -} - -.worker-profile-action-card.is-amber .worker-profile-action-icon { - background: #fef3c7; - color: #d97706; -} - -.worker-profile-action-card.is-rose .worker-profile-action-icon { - background: #ffe4e6; - color: #e11d48; -} - .worker-amount-positive { color: #047857; } @@ -2253,12 +1888,7 @@ select { flex-direction: column; } - .worker-hall-summary-strip { - grid-template-columns: 1fr; - } - - .worker-hall-toolbar, - .worker-orders-toolbar { + .worker-hall-toolbar { align-items: stretch; flex-direction: column; } @@ -2275,23 +1905,20 @@ select { padding: 16px; } - .worker-hall-card-head, .worker-hall-card-actions { align-items: stretch; flex-direction: column; } - .worker-orders-search { - width: 100%; +} + +@media (max-width: 480px) { + .worker-hall-summary-strip { + grid-template-columns: 1fr; } - .worker-orders-status-tab { - flex: 1 1 calc(50% - 10px); - justify-content: space-between; - } - - .worker-profile-hero-side { - width: 100%; - justify-content: flex-start; + .worker-hall-summary-item + .worker-hall-summary-item { + border-top: 1px solid #e5e7eb; + border-left: 0; } }