本次提交实现了完整的客户拜访业务系统: 1. 新增对象存储上传服务,支持S3兼容协议的RustFS存储 2. 完善客户拜访实体与数据库表结构,补充全业务字段 3. 开发拜访台账与记录的前后端接口,包含增删改查、批量创建、状态流转等能力 4. 新增拜访表单页面与路由,支持父级菜单补全面包屑 5. 新增勘察列表页预填客户ID跳转逻辑 6. 补充UI设计文档与页面截图 7. 调整日志中间件跳过上传路由,优化RBAC权限配置
108 lines
28 KiB
HTML
108 lines
28 KiB
HTML
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta content="width=device-width, initial-scale=1.0" name="viewport"><link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css2?family=hankenGrotesk:wght@100..900&display=swap" rel="stylesheet"><style>@layer base{html,body{margin:0;padding:0;}body{overscroll-behavior:none;}main>:first-child{margin-top:0!important;}main>:last-child{margin-bottom:0!important;}}::-webkit-scrollbar{display:none;}</style><script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script><script id="tailwind-config">tailwind.config = { darkMode: "class", theme: { extend: { "colors": { "on-error": "#ffffff", "border-rule": "#dbe4ee", "secondary-fixed": "#eaddff", "on-surface": "#0d1c2c", "tertiary": "#00685f", "secondary": "#712ae2", "on-primary-fixed-variant": "#0040a1", "on-tertiary": "#ffffff", "surface-container-low": "#eef4ff", "secondary-fixed-dim": "#d2bbff", "primary-container": "#136bfb", "primary-fixed": "#dae2ff", "on-secondary-fixed-variant": "#5a00c6", "on-tertiary-fixed-variant": "#005049", "tertiary-container": "#008378", "surface": "#ffffff", "text-muted": "#5b6b7e", "on-background": "#0d1c2c", "primary": "#0054cd", "outline-variant": "#c2c6d8", "surface-container-highest": "#d5e4fa", "on-primary-container": "#fefcff", "background": "#f8f9ff", "on-secondary-fixed": "#25005a", "surface-container-high": "#dbe9ff", "surface-container-lowest": "#ffffff", "bg-page": "#f4f7fb", "surface-container": "#e5efff", "on-primary": "#ffffff", "tertiary-fixed": "#89f5e7", "status-warn": "#e0852b", "tertiary-fixed-dim": "#6bd8cb", "outline": "#727787", "accent-subtle": "rgba(29,111,255,0.08)", "on-primary-fixed": "#001847", "inverse-primary": "#b2c5ff", "inverse-surface": "#233142", "on-secondary-container": "#fffbff", "surface-bright": "#f8f9ff", "on-tertiary-container": "#f4fffc", "on-tertiary-fixed": "#00201d", "primary-fixed-dim": "#b2c5ff", "inverse-on-surface": "#e9f1ff", "status-error": "#dc2626", "surface-tint": "#0056d2", "on-secondary": "#ffffff", "error": "#ba1a1a", "on-error-container": "#93000a", "surface-dim": "#ccdbf1", "surface-variant": "#d5e4fa", "secondary-container": "#8a4cfc", "error-container": "#ffdad6", "on-surface-variant": "#424655" }, "borderRadius": { "DEFAULT": "0.25rem", "lg": "0.5rem", "xl": "0.75rem", "full": "9999px" }, "spacing": { "lg": "24px", "base": "4px", "xs": "8px", "container-max": "1200px", "sm": "12px", "xl": "40px", "md": "16px", "gutter": "16px" }, "fontFamily": { "body-md": ["hankenGrotesk"], "caption-sm": ["hankenGrotesk"], "title-sm": ["hankenGrotesk"], "data-mono": ["jetbrainsMono", "monospace"], "label-bold": ["hankenGrotesk"], "headline-md": ["hankenGrotesk"], "headline-md-mobile": ["hankenGrotesk"], "display-lg": ["hankenGrotesk"] }, "fontSize": { "body-md": ["15px", { "lineHeight": "24px", "fontWeight": "400" }], "caption-sm": ["12px", { "lineHeight": "14px", "fontWeight": "700" }], "title-sm": ["17px", { "lineHeight": "24px", "fontWeight": "700" }], "data-mono": ["12px", { "lineHeight": "16px", "fontWeight": "500" }], "label-bold": ["13px", { "lineHeight": "16px", "fontWeight": "700" }], "headline-md": ["23px", { "lineHeight": "28px", "fontWeight": "700" }], "headline-md-mobile": ["20px", { "lineHeight": "26px", "fontWeight": "700" }], "display-lg": ["32px", { "lineHeight": "40px", "fontWeight": "700" }] } } } };</script></head><body class="bg-bg-page font-body-md text-body-md text-on-surface antialiased flex min-h-screen overflow-x-hidden"><!-- Minimal Top Global Navbar -->
|
|
<aside class="w-64 bg-[#0f172a] text-slate-300 flex-shrink-0 flex flex-col justify-between min-h-screen z-30 shadow-xl border-r border-slate-800">
|
|
<div>
|
|
<!-- Brand Logo -->
|
|
<div class="h-16 flex items-center px-lg border-b border-slate-800/80 gap-sm bg-[#0b1120]">
|
|
<img alt="XT-POWER Logo" class="h-8 w-auto object-contain" src="https://lh3.googleusercontent.com/aida/AEtjO1WEv-XpuvR6vI25Vg_b5kVa78sajEgqBSsbRjAXtXERG5rnQ0hjJNA7KEvKDG35aTm9975DUcxd1r__Mn0LJ4roIr35JhgLX6FmEDm6uma7hvkH3ptsQUHddesMFTsq5j4A62SGpFYFltxzOmw2H5UHfickwkRfcVPrXmm6JgC_LKoALuxUNakbkFkEh7HiTo1D8nhRvkWnILfZKZHl0yIujUYdbhhBgTw36BARKf_hYtvKLzYjV2tVjek">
|
|
<div class="flex flex-col">
|
|
<span class="font-title-sm text-white font-bold tracking-tight text-[15px] leading-tight">鑫潼智电</span>
|
|
<span class="font-data-mono text-[10px] text-slate-400 leading-tight tracking-wider">XT-POWER OS <span class="text-primary-fixed">v3.8</span></span>
|
|
</div>
|
|
</div>
|
|
<!-- Navigation Links -->
|
|
<nav class="p-sm space-y-xs text-[13px]">
|
|
<a href="#" class="flex items-center gap-sm px-sm py-xs rounded-lg text-slate-400 hover:text-white hover:bg-slate-800/60 transition-colors">
|
|
<span class="material-symbols-outlined text-[18px]">dashboard</span>
|
|
<span class="">运营工作台</span>
|
|
</a>
|
|
<a href="#" class="flex items-center gap-sm px-sm py-xs rounded-lg text-slate-400 hover:text-white hover:bg-slate-800/60 transition-colors">
|
|
<span class="material-symbols-outlined text-[18px]">contacts</span>
|
|
<span class="">客户管理</span>
|
|
</a>
|
|
<!-- Active Menu Group: 项目管理 -->
|
|
<div class="space-y-xs pt-xs">
|
|
<div class="flex items-center justify-between px-sm py-xs rounded-lg bg-slate-800/80 text-white font-medium">
|
|
<div class="flex items-center gap-sm">
|
|
<span class="material-symbols-outlined text-[18px] text-primary-fixed">engineering</span>
|
|
<span class="">项目管理</span>
|
|
</div>
|
|
<span class="material-symbols-outlined text-[16px] text-slate-400">expand_more</span>
|
|
</div>
|
|
<div class="pl-8 pr-xs space-y-xs border-l border-slate-800 ml-4 py-xs">
|
|
<a href="#" class="block px-xs py-base rounded text-slate-400 hover:text-white hover:bg-slate-800/40 text-[12px] transition-colors">全周期工程看板</a>
|
|
<a href="#" class="flex items-center justify-between px-xs py-base rounded bg-primary/20 text-primary-fixed font-bold text-[12px] border-l-2 border-primary pl-2">现场勘察派单 <span class="w-1.5 h-1.5 rounded-full bg-primary-fixed"></span></a>
|
|
<a href="#" class="block px-xs py-base rounded text-slate-400 hover:text-white hover:bg-slate-800/40 text-[12px] transition-colors">项目合同管理</a>
|
|
<a href="#" class="block px-xs py-base rounded text-slate-400 hover:text-white hover:bg-slate-800/40 text-[12px] transition-colors">工程安装派单</a>
|
|
<a href="#" class="block px-xs py-base rounded text-slate-400 hover:text-white hover:bg-slate-800/40 text-[12px] transition-colors">工程竣工验收</a>
|
|
</div>
|
|
</div>
|
|
<a href="#" class="flex items-center gap-sm px-sm py-xs rounded-lg text-slate-400 hover:text-white hover:bg-slate-800/60 transition-colors">
|
|
<span class="material-symbols-outlined text-[18px]">assignment</span>
|
|
<span class="">运营派单</span>
|
|
</a>
|
|
<a href="#" class="flex items-center gap-sm px-sm py-xs rounded-lg text-slate-400 hover:text-white hover:bg-slate-800/60 transition-colors">
|
|
<span class="material-symbols-outlined text-[18px]">grid_view</span>
|
|
<span class="">设备监控</span>
|
|
</a>
|
|
<a href="#" class="flex items-center gap-sm px-sm py-xs rounded-lg text-slate-400 hover:text-white hover:bg-slate-800/60 transition-colors">
|
|
<span class="material-symbols-outlined text-[18px]">bar_chart</span>
|
|
<span class="">统计报表</span>
|
|
</a>
|
|
<a href="#" class="flex items-center gap-sm px-sm py-xs rounded-lg text-slate-400 hover:text-white hover:bg-slate-800/60 transition-colors">
|
|
<span class="material-symbols-outlined text-[18px]">settings</span>
|
|
<span class="">系统管理</span>
|
|
</a>
|
|
</nav>
|
|
</div>
|
|
<!-- Sidebar Footer / Cluster Status -->
|
|
<div class="p-md border-t border-slate-800/80 bg-[#0b1120]/60">
|
|
<div class="flex items-center justify-between text-[11px] text-slate-400">
|
|
<div class="flex items-center gap-base">
|
|
<span class="w-2 h-2 rounded-full bg-emerald-400 animate-pulse"></span>
|
|
<span class="">华东区 · 枢纽调度</span>
|
|
</div>
|
|
<span class="font-data-mono text-emerald-400 font-bold">正常</span>
|
|
</div>
|
|
</div>
|
|
</aside><main class="flex-1 min-w-0 bg-bg-page flex flex-col min-h-screen"><header class="h-16 w-full bg-surface border-b border-border-rule sticky top-0 z-40 px-lg flex items-center justify-between shadow-[0_1px_4px_rgba(0,0,0,0.03)]">
|
|
<!-- Breadcrumbs & Quick Search -->
|
|
<div class="flex items-center gap-md">
|
|
<nav class="flex items-center gap-xs text-caption-sm">
|
|
<a class="text-text-muted hover:text-primary transition-colors" href="#">项目管理</a>
|
|
<span class="material-symbols-outlined text-[14px] text-text-muted">chevron_right</span>
|
|
<span class="text-text-muted">现场勘察派单</span>
|
|
<span class="material-symbols-outlined text-[14px] text-text-muted">chevron_right</span>
|
|
<span class="font-data-mono font-bold text-primary px-sm py-base rounded-full bg-accent-subtle text-[11px]">WH-SURV-2026-0302</span>
|
|
</nav>
|
|
<div class="relative hidden md:block">
|
|
<input type="text" placeholder="全局搜索电表/断路器/派单编号..." class="w-64 pl-8 pr-md py-base bg-surface-container-low text-on-surface rounded-full text-caption-sm border border-border-rule focus:outline-none focus:ring-1 focus:ring-primary">
|
|
<span class="material-symbols-outlined absolute left-2.5 top-1/2 -translate-y-1/2 text-[16px] text-text-muted pointer-events-none">search</span>
|
|
</div>
|
|
</div>
|
|
<!-- Status badge, Notification, and User profile -->
|
|
<div class="flex items-center gap-md">
|
|
<div class="hidden sm:flex items-center gap-base bg-tertiary/10 text-tertiary px-sm py-base rounded-full text-caption-sm">
|
|
<span class="w-2 h-2 rounded-full bg-tertiary animate-pulse"></span>
|
|
<span class="font-medium">ICC 客资直通已联通</span>
|
|
</div>
|
|
<button class="relative p-base rounded-full text-text-muted hover:text-on-surface hover:bg-surface-container-low transition-colors" title="通知" type="button">
|
|
<span class="material-symbols-outlined text-[20px]">notifications</span>
|
|
<span class="absolute top-1 right-1 w-2 h-2 rounded-full bg-error"></span>
|
|
</button>
|
|
<button class="p-base rounded-full text-text-muted hover:text-on-surface hover:bg-surface-container-low transition-colors" title="帮助与SOP手册" type="button">
|
|
<span class="material-symbols-outlined text-[20px]">help_outline</span>
|
|
</button>
|
|
<div class="h-5 w-[1px] bg-border-rule"></div>
|
|
<div class="flex items-center gap-sm">
|
|
<div class="w-8 h-8 rounded-full bg-primary-container text-on-primary flex items-center justify-center font-bold text-caption-sm shadow-sm">李</div>
|
|
<div class="flex flex-col text-left">
|
|
<span class="font-label-bold text-on-surface text-caption-sm leading-tight">李工 <span class="text-[11px] font-normal text-text-muted">主控工程师</span></span>
|
|
<span class="font-data-mono text-[10px] text-text-muted leading-tight">调度中心 · 席位04</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header><div class="space-y-md max-w-5xl mx-auto w-full px-lg py-md"><!-- Wizard Header & Step Indicator --><div class="bg-surface rounded-xl p-md shadow-sm border border-border-rule/60"><div class="flex flex-col sm:flex-row sm:items-center justify-between gap-xs pb-sm border-b border-border-rule/60 mb-sm"><div><h1 class="font-headline-md text-headline-md text-on-surface tracking-tight">现场勘察派单向导</h1><p class="font-body-md text-caption-sm text-text-muted">标准化派发配电房现场测绘任务,向共享电工推单并回传拓扑参数</p></div><span class="px-sm py-base rounded-full bg-surface-container-low text-primary font-data-mono text-caption-sm self-start sm:self-auto font-medium">STEP 01 / 03</span></div><!-- 3-Step Horizontal Progress Bar --><div class="grid grid-cols-1 md:grid-cols-3 gap-xs"><div class="flex items-center gap-sm p-sm rounded-lg bg-primary/5 border border-primary/20"><div class="w-8 h-8 rounded-full bg-primary text-on-primary flex items-center justify-center font-bold text-caption-sm shrink-0 shadow-sm">1</div><div class="min-w-0"><div class="font-label-bold text-caption-sm text-primary">基本信息与现场环境</div><div class="text-[11px] text-text-muted truncate">目标客户、区域与回路</div></div></div><div class="flex items-center gap-sm p-sm rounded-lg bg-surface-container-lowest border border-border-rule/50 opacity-75"><div class="w-8 h-8 rounded-full bg-surface-container text-on-surface-variant flex items-center justify-center font-bold text-caption-sm shrink-0">2</div><div class="min-w-0"><div class="font-label-bold text-caption-sm text-on-surface">技术要点与回执标准</div><div class="text-[11px] text-text-muted truncate">标准SOP模版、拍照指标</div></div></div><div class="flex items-center gap-sm p-sm rounded-lg bg-surface-container-lowest border border-border-rule/50 opacity-75"><div class="w-8 h-8 rounded-full bg-surface-container text-on-surface-variant flex items-center justify-center font-bold text-caption-sm shrink-0">3</div><div class="min-w-0"><div class="font-label-bold text-caption-sm text-on-surface">指派电工与服务报酬</div><div class="text-[11px] text-text-muted truncate">匹配电工、LBS距离与费率</div></div></div></div></div><!-- Active Wizard Step Container --><div class="space-y-md"><!-- STEP 1: Basic Information & Environment --><div class="bg-surface rounded-xl p-lg shadow-sm border border-border-rule/60 space-y-md"><div class="flex items-center justify-between pb-xs border-b border-border-rule/50"><div class="flex items-center gap-xs"><span class="material-symbols-outlined text-primary text-[22px]">corporate_fare</span><h2 class="font-title-sm text-title-sm text-on-surface font-bold">第 1 步:勘察基本信息与现场环境</h2></div><span class="font-caption-sm text-caption-sm text-text-muted">已自动关联 ICC 客资档案</span></div><div class="grid grid-cols-1 md:grid-cols-2 gap-md"><div><label class="block font-label-bold text-caption-sm text-on-surface mb-xs">关联客户及工程单位 <span class="text-error">*</span></label><div class="relative"><select class="w-full px-md py-xs bg-surface-container-low text-on-surface rounded-lg text-body-md focus:outline-none focus:ring-1 focus:ring-primary border border-border-rule appearance-none"><option selected="">武汉软件工程职业学院(实训中心)</option><option>华中师范大学南湖校区二期</option><option>光谷微电子产业园动力站</option></select><span class="material-symbols-outlined absolute right-sm top-1/2 -translate-y-1/2 text-text-muted pointer-events-none">arrow_drop_down</span></div></div><div><label class="block font-label-bold text-caption-sm text-on-surface mb-xs">勘察任务标题 <span class="text-error">*</span></label><input class="w-full px-md py-xs bg-surface-container-low text-on-surface rounded-lg text-body-md focus:outline-none focus:ring-1 focus:ring-primary border border-border-rule font-medium" type="text" value="实训楼智能配电改造一期工程现场测绘"></div></div><div class="grid grid-cols-1 md:grid-cols-3 gap-md"><div><label class="block font-label-bold text-caption-sm text-on-surface mb-xs">具体勘察物理区域 <span class="text-error">*</span></label><input class="w-full px-md py-xs bg-surface-container-low text-on-surface rounded-lg text-body-md focus:outline-none focus:ring-1 focus:ring-primary border border-border-rule" type="text" value="实训主楼 1F低压室 / 2~3F强电井"></div><div><label class="block font-label-bold text-caption-sm text-on-surface mb-xs">主进线规约与断路器容量</label><input class="w-full px-md py-xs bg-surface-container-low text-on-surface rounded-lg text-body-md focus:outline-none focus:ring-1 focus:ring-primary border border-border-rule font-data-mono" type="text" value="380V / 400A MCCB (SCB10-630kVA)"></div><div><label class="block font-label-bold text-caption-sm text-on-surface mb-xs">预估分支测绘回路数 <span class="text-error">*</span></label><div class="flex items-center gap-xs"><input class="w-full px-md py-xs bg-surface-container-low text-on-surface rounded-lg text-body-md focus:outline-none focus:ring-1 focus:ring-primary border border-border-rule font-data-mono font-bold text-primary" type="number" value="40"><span class="text-caption-sm font-label-bold text-text-muted">路</span></div></div></div><div class="grid grid-cols-1 md:grid-cols-2 gap-md pt-xs"><div><label class="block font-label-bold text-caption-sm text-on-surface mb-xs">现场技术联系人</label><input class="w-full px-md py-xs bg-surface-container-low text-on-surface rounded-lg text-body-md focus:outline-none focus:ring-1 focus:ring-primary border border-border-rule" type="text" value="程建业 (项目主管) - 138****9201"></div><div><label class="block font-label-bold text-caption-sm text-on-surface mb-xs">要求期望到场时限</label><input class="w-full px-md py-xs bg-surface-container-low text-on-surface rounded-lg text-body-md focus:outline-none focus:ring-1 focus:ring-primary border border-border-rule font-data-mono" type="text" value="接单后 45 分钟内 (计划窗口: 03-03 至 03-04)"></div></div></div><!-- STEP 2: Technical SOP & Receipts (Compact & Template-Driven) --><div class="bg-surface rounded-xl p-lg shadow-sm border border-border-rule/60 space-y-md"><div class="flex flex-col sm:flex-row sm:items-center justify-between gap-xs pb-xs border-b border-border-rule/50"><div class="flex items-center gap-xs"><span class="material-symbols-outlined text-secondary text-[22px]">fact_check</span><h2 class="font-title-sm text-title-sm text-on-surface font-bold">第 2 步:勘察技术要点与回执标准</h2></div><!-- Template Quick Fill --><div class="flex items-center gap-xs"><span class="text-caption-sm text-text-muted">SOP规范模板:</span><button class="inline-flex items-center gap-base px-sm py-base rounded-full bg-secondary/10 text-secondary hover:bg-secondary/20 text-caption-sm font-label-bold transition-colors" type="button"><span class="material-symbols-outlined text-[16px]">auto_fix_high</span>标准配电改造模板(已应用 5 项)</button></div></div><div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-sm"><div class="p-sm rounded-lg bg-surface-container-low border border-border-rule/50 flex flex-col justify-between space-y-xs"><div class="flex items-center justify-between"><span class="font-label-bold text-caption-sm text-on-surface">1. 变压器铭牌与备用容量</span><span class="px-sm py-base bg-error/10 text-error font-caption-sm rounded text-[11px] font-bold">必填</span></div><div class="text-[12px] text-text-muted">核验额定容量、短路阻抗与加装余量</div><div class="flex items-center justify-between pt-base border-t border-border-rule/30 text-caption-sm font-data-mono text-primary font-medium"><span class="">现场照片</span><span class="">≥ 2 张</span></div></div><div class="p-sm rounded-lg bg-surface-container-low border border-border-rule/50 flex flex-col justify-between space-y-xs"><div class="flex items-center justify-between"><span class="font-label-bold text-caption-sm text-on-surface">2. 母排厚度与电缆线径测绘</span><span class="px-sm py-base bg-error/10 text-error font-caption-sm rounded text-[11px] font-bold">必填</span></div><div class="text-[12px] text-text-muted">确认铜排规格与开合式CT安装净空</div><div class="flex items-center justify-between pt-base border-t border-border-rule/30 text-caption-sm font-data-mono text-primary font-medium"><span class="">现场照片</span><span class="">≥ 3 张</span></div></div><div class="p-sm rounded-lg bg-surface-container-low border border-border-rule/50 flex flex-col justify-between space-y-xs"><div class="flex items-center justify-between"><span class="font-label-bold text-caption-sm text-on-surface">3. 老旧断路器脱扣特性清查</span><span class="px-sm py-base bg-error/10 text-error font-caption-sm rounded text-[11px] font-bold">必填</span></div><div class="text-[12px] text-text-muted">统计品牌型号、额定kA值与分断曲线</div><div class="flex items-center justify-between pt-base border-t border-border-rule/30 text-caption-sm font-data-mono text-primary font-medium"><span class="">清单格式</span><span class="">表单直填</span></div></div><div class="p-sm rounded-lg bg-surface-container-low border border-border-rule/50 flex flex-col justify-between space-y-xs"><div class="flex items-center justify-between"><span class="font-label-bold text-caption-sm text-on-surface">4. DIN 导轨剩余安装空间实测</span><span class="px-sm py-base bg-error/10 text-error font-caption-sm rounded text-[11px] font-bold">必填</span></div><div class="text-[12px] text-text-muted">实测 35mm 导轨可用深度与安装间距</div><div class="flex items-center justify-between pt-base border-t border-border-rule/30 text-caption-sm font-data-mono text-primary font-medium"><span class="">照片回传</span><span class="">含卷尺 1 张</span></div></div><div class="p-sm rounded-lg bg-surface-container-low border border-border-rule/50 flex flex-col justify-between space-y-xs"><div class="flex items-center justify-between"><span class="font-label-bold text-caption-sm text-on-surface">5. 竖井 4G/LoRa 物联网场强测试</span><span class="px-sm py-base bg-error/10 text-error font-caption-sm rounded text-[11px] font-bold">必填</span></div><div class="text-[12px] text-text-muted">无线信号强度检测,RSRP > -85dBm</div><div class="flex items-center justify-between pt-base border-t border-border-rule/30 text-caption-sm font-data-mono text-primary font-medium"><span class="">手持测仪</span><span class="">信号截图</span></div></div><div class="p-sm rounded-lg border border-dashed border-border-rule flex flex-col items-center justify-center text-text-muted hover:border-primary/50 hover:text-primary transition-colors cursor-pointer space-y-base"><span class="material-symbols-outlined text-[24px]">add_circle</span><span class="font-label-bold text-caption-sm">+ 自定义勘察检查项</span></div></div></div><!-- STEP 3: Electrician Assignment & Remuneration --><div class="bg-surface rounded-xl p-lg shadow-sm border border-border-rule/60 space-y-md"><div class="flex items-center justify-between pb-xs border-b border-border-rule/50"><div class="flex items-center gap-xs"><span class="material-symbols-outlined text-tertiary text-[22px]">engineering</span><h2 class="font-title-sm text-title-sm text-on-surface font-bold">第 3 步:指派电工与服务报酬</h2></div><span class="font-caption-sm text-caption-sm text-tertiary font-medium">根据 LBS 距离与持证资质智能优选</span></div><div class="grid grid-cols-1 md:grid-cols-2 gap-md"><!-- Electrician Candidate 1: Selected --><div class="p-md rounded-xl bg-accent-subtle/40 border-2 border-primary relative cursor-pointer flex items-start gap-md"><div class="w-12 h-12 rounded-full bg-primary/10 text-primary font-bold text-title-sm flex items-center justify-center shrink-0">赵</div><div class="flex-1 space-y-xs"><div class="flex items-center justify-between"><div class="flex items-center gap-xs"><span class="font-title-sm font-bold text-on-surface">赵志强</span><span class="px-sm py-base rounded-full bg-primary text-on-primary text-[10px] font-bold">首选推荐 99.4%</span></div><span class="material-symbols-outlined text-primary text-[20px]">check_circle</span></div><div class="flex items-center gap-md text-caption-sm text-text-muted"><span class="flex items-center gap-base"><span class="material-symbols-outlined text-[14px]">near_me</span>距离 1.8 km</span><span class="flex items-center gap-base text-status-warn font-data-mono font-bold"><span class="material-symbols-outlined text-[14px]">star</span>4.98 分</span><span class="text-tertiary font-medium">特种低压电工证已核验</span></div><div class="font-data-mono text-[11px] text-text-muted">预计 25 分钟到场 · 近30天勘察 24 场全部按时交付</div></div></div><!-- Electrician Candidate 2: Alternative --><div class="p-md rounded-xl bg-surface-container-low border border-border-rule hover:border-outline-variant transition-all cursor-pointer flex items-start gap-md opacity-85"><div class="w-12 h-12 rounded-full bg-surface-container-high text-on-surface-variant font-bold text-title-sm flex items-center justify-center shrink-0">王</div><div class="flex-1 space-y-xs"><div class="flex items-center justify-between"><div class="flex items-center gap-xs"><span class="font-title-sm font-bold text-on-surface">王建国</span><span class="px-sm py-base rounded-full bg-surface-container text-text-muted text-[10px] font-bold">资深班组长</span></div><button class="text-caption-sm font-label-bold text-primary hover:underline" type="button">改选此人</button></div><div class="flex items-center gap-md text-caption-sm text-text-muted"><span class="flex items-center gap-base"><span class="material-symbols-outlined text-[14px]">near_me</span>距离 3.5 km</span><span class="flex items-center gap-base font-data-mono"><span class="material-symbols-outlined text-[14px]">star</span>4.92 分</span><span class="">高低压带电作业资质</span></div><div class="font-data-mono text-[11px] text-text-muted">预计 40 分钟到场 · 历史累计勘察 68 场</div></div></div></div><!-- Remuneration & SLA Summary Box --><div class="p-md rounded-xl bg-surface-container-low border border-border-rule/50 flex flex-col md:flex-row md:items-center justify-between gap-md"><div class="flex items-center gap-md flex-wrap text-caption-sm"><div class="space-y-base"><span class="text-text-muted block">基础出场工时费</span><span class="font-data-mono font-bold text-on-surface">¥ 350.00</span></div><div class="h-6 w-[1px] bg-border-rule"></div><div class="space-y-base"><span class="text-text-muted block">40路测点补贴 (¥5/路)</span><span class="font-data-mono font-bold text-on-surface">¥ 200.00</span></div><div class="h-6 w-[1px] bg-border-rule"></div><div class="space-y-base"><span class="text-text-muted block">履约质保要求</span><span class="text-tertiary font-bold">SLA-GRADE A (24h回传)</span></div></div><div class="flex items-baseline gap-xs text-right"><span class="font-caption-sm text-text-muted">应付勘察劳务总报酬:</span><span class="font-display-lg text-headline-md font-bold text-primary">¥ 550.00</span></div></div></div></div></div><!-- Fixed Sticky Bottom Action Toolbar --><footer class="mt-auto sticky bottom-4 z-30 max-w-5xl mx-auto w-full px-lg pb-md"><div class="bg-surface/95 backdrop-blur rounded-2xl p-md shadow-lg border border-border-rule flex flex-col sm:flex-row items-center justify-between gap-md"><div class="flex items-center gap-xs text-text-muted font-caption-sm text-caption-sm"><span class="material-symbols-outlined text-[18px] text-tertiary">verified</span><span class="">向导已填报 3/3 核心项 · 数据直连共享电工协同网</span></div><div class="flex items-center gap-sm w-full sm:w-auto justify-end"><button class="px-md py-xs rounded-full bg-surface-container hover:bg-surface-container-high text-on-surface-variant font-label-bold text-caption-sm transition-colors" type="button">上一步</button><button class="px-md py-xs rounded-full bg-surface-container-low hover:bg-surface-container text-on-surface font-label-bold text-caption-sm transition-colors border border-border-rule" type="button">保存为草稿</button><button class="px-lg py-xs rounded-full bg-primary hover:bg-primary-container text-on-primary font-label-bold text-body-md shadow-md hover:shadow-lg transition-all inline-flex items-center gap-base" type="button"><span class="material-symbols-outlined text-[18px]">send</span>确认并推送共享电工派单</button></div></div></footer></main>
|
|
|
|
</body></html> |