refactor(client): 优化页面多处细节与样式兼容性

1. 调整全局滚动条样式仅适配Firefox浏览器,修复Chrome下表头错位问题
2. 替换站点logo为Ant Design风格图标并优化样式
3. 重构客户拜访列表操作栏:合并详情按钮到下拉菜单,缩小操作列宽度
4. 优化操作按钮文本与主键判断逻辑,使用key替代文本匹配
This commit is contained in:
andyesfly committed 2026-09-19 16:12:41 +08:00
1 parent 4fe77be1af
commit ae79d5157b
4 files changed
+29 -21

No files matched your search

+8 -4
View File
@@ -296,10 +296,14 @@ ol {
background: rgba(255, 255, 255, 0.4);
}
// Firefox
* {
scrollbar-width: thin;
scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
// Firefox 专用(Chrome/Edge 不支持 -moz-appearance,会忽略整块)
// 注意:Chrome 121+ 一旦设置 scrollbar-width,就会覆盖上面的 ::-webkit-scrollbar,
// 导致滚动条实际 10px 而 ::-webkit-scrollbar 仍报 4px,antd 据此计算固定列偏移会让表头与表体错位 6px
@supports (-moz-appearance: none) {
* {
scrollbar-width: thin;
scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}
}
// Firefox 深色变体
+5 -3
View File
@@ -6,7 +6,7 @@
<div class="sider-inner">
<!-- Logo区域 -->
<div class="logo" @click="$router.push('/dashboard')">
<img src="@/assets/vue.svg" alt="logo" class="logo-img" />
<ThunderboltOutlined class="logo-img" />
<h1 v-show="!collapsed" class="logo-title">智能电网IoT</h1>
</div>
@@ -114,6 +114,7 @@ import {
DownOutlined,
LogoutOutlined,
LockOutlined,
ThunderboltOutlined,
} from '@ant-design/icons-vue'
import { usePermissionStore, type MenuNode } from '@/stores/permission'
@@ -331,8 +332,9 @@ function handleUserMenuClick({ key }: { key: string }) {
}
.logo-img {
width: 32px;
height: 32px;
font-size: 32px;
color: #1890ff;
filter: drop-shadow(0 2px 4px rgba(24, 144, 255, 0.3));
flex-shrink: 0;
}
+14 -11
View File
@@ -233,11 +233,11 @@
size="small"
@click="handlePrimary(record)"
>{{ primaryAction(record)!.label }}</a-button>
<a-button type="link" size="small" @click="openDetail(record)">查看详情</a-button>
<a-dropdown trigger="click">
<a-button type="link" size="small">更多 <DownOutlined /></a-button>
<template #overlay>
<a-menu @click="({ key }) => handleMore(key as string, record)">
<a-menu-item key="detail">查看详情</a-menu-item>
<a-menu-item key="edit">编辑</a-menu-item>
<a-menu-item v-if="canSurvey(record)" key="survey">一键发起勘察派单</a-menu-item>
<a-menu-item v-if="record.status === 0" key="reassign">改派</a-menu-item>
@@ -550,7 +550,7 @@ const columns = [
{ title: '计划与到场时间 / GPS签到', key: 'plan', width: 190 },
{ title: '现场意向与成果评级', key: 'intent', width: 190 },
{ title: '当前状态', key: 'status', width: 140, align: 'center' as const },
{ title: '操作', key: 'action', width: 230, align: 'center' as const, fixed: 'right' as const },
{ title: '操作', key: 'action', width: 170, align: 'center' as const, fixed: 'right' as const },
];
const rowSelection = computed(() => ({
@@ -762,24 +762,27 @@ function canSurvey(record: CustomerVisitInfo) {
);
}
function primaryAction(record: CustomerVisitInfo): { label: string } | null {
if (record.status === VISIT_STATUS.PENDING) return { label: '执行跟进' };
if (record.status === VISIT_STATUS.EVIDENCE) return { label: '审核现场取证' };
if (record.status === VISIT_STATUS.SURVEY) return { label: '查看关联工程' };
if (canSurvey(record)) return { label: '一键发起勘察派单' };
type PrimaryActionKey = 'follow' | 'review' | 'project' | 'survey';
function primaryAction(record: CustomerVisitInfo): { key: PrimaryActionKey; label: string } | null {
if (record.status === VISIT_STATUS.PENDING) return { key: 'follow', label: '执行跟进' };
if (record.status === VISIT_STATUS.EVIDENCE) return { key: 'review', label: '审核取证' };
if (record.status === VISIT_STATUS.SURVEY) return { key: 'project', label: '查看工程' };
if (canSurvey(record)) return { key: 'survey', label: '发起派单' };
return null;
}
function handlePrimary(record: CustomerVisitInfo) {
const action = primaryAction(record);
if (!action) return;
if (action.label === '执行跟进') return handleFollow(record);
if (action.label === '审核现场取证') return openReview(record);
if (action.label === '查看关联工程') return handleViewProject(record);
if (action.label === '一键发起勘察派单') return handleSurvey(record);
if (action.key === 'follow') return handleFollow(record);
if (action.key === 'review') return openReview(record);
if (action.key === 'project') return handleViewProject(record);
if (action.key === 'survey') return handleSurvey(record);
}
function handleMore(key: string, record: CustomerVisitInfo) {
if (key === 'detail') return openDetail(record);
if (key === 'edit') return router.push({ name: 'CustomerVisitEdit', params: { id: record.id } });
if (key === 'survey') return handleSurvey(record);
if (key === 'reassign') return openReassign(record);