Files
smart_grid_iot/系统设计/UI/客户拜访记录/code.html
T
andyesfly 1c83e09fa1 feat: 完成客户拜访模块全功能开发
本次提交实现了完整的客户拜访业务系统:
1.  新增对象存储上传服务,支持S3兼容协议的RustFS存储
2.  完善客户拜访实体与数据库表结构,补充全业务字段
3.  开发拜访台账与记录的前后端接口,包含增删改查、批量创建、状态流转等能力
4.  新增拜访表单页面与路由,支持父级菜单补全面包屑
5.  新增勘察列表页预填客户ID跳转逻辑
6.  补充UI设计文档与页面截图
7.  调整日志中间件跳过上传路由,优化RBAC权限配置
2026-09-14 11:42:10 +08:00

19 lines
32 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&amp;display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css2?family=hankenGrotesk:wght@100..900&amp;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"></script><script id="tailwind-config">tailwind.config={"darkMode":"class","theme":{"extend":{"colors":{"secondary-fixed-dim":"#d2bbff","secondary":"#712ae2","secondary-fixed":"#eaddff","on-primary":"#ffffff","surface-container-lowest":"#ffffff","error":"#ba1a1a","on-error":"#ffffff","on-surface":"#0d1c2c","on-primary-fixed-variant":"#0040a1","outline-variant":"#c2c6d8","tertiary-fixed-dim":"#6bd8cb","on-secondary-fixed-variant":"#5a00c6","tertiary-container":"#008378","primary-container":"#136bfb","secondary-container":"#8a4cfc","tertiary":"#00685f","on-tertiary-fixed-variant":"#005049","on-secondary-fixed":"#25005a","surface-container-highest":"#d5e4fa","surface-container-low":"#eef4ff","background":"#f8f9ff","on-error-container":"#93000a","inverse-primary":"#b2c5ff","surface-dim":"#ccdbf1","on-primary-fixed":"#001847","surface-container-high":"#dbe9ff","outline":"#727787","status-warn":"#e0852b","on-secondary":"#ffffff","surface-tint":"#0056d2","bg-page":"#eef3f8","surface-variant":"#d5e4fa","primary":"#0054cd","on-tertiary-container":"#f4fffc","inverse-surface":"#233142","text-muted":"#5b6b7e","on-tertiary":"#ffffff","accent-subtle":"rgba(29,111,255,0.08)","primary-fixed":"#dae2ff","tertiary-fixed":"#89f5e7","surface-bright":"#f8f9ff","on-primary-container":"#fefcff","on-background":"#0d1c2c","primary-fixed-dim":"#b2c5ff","border-rule":"#dbe4ee","status-error":"#dc2626","inverse-on-surface":"#e9f1ff","error-container":"#ffdad6","on-tertiary-fixed":"#00201d","on-secondary-container":"#fffbff","on-surface-variant":"#424655","surface":"#ffffff","surface-container":"#e5efff"},"borderRadius":{"DEFAULT":"0.25rem","lg":"0.5rem","xl":"0.75rem","full":"9999px"},"spacing":{"md":"16px","sm":"12px","xl":"40px","container-max":"1200px","base":"4px","xs":"8px","gutter":"16px","lg":"24px"},"fontFamily":{"body-md":["hankenGrotesk"],"headline-md-mobile":["hankenGrotesk"],"caption-sm":["hankenGrotesk"],"label-bold":["hankenGrotesk"],"headline-md":["hankenGrotesk"],"title-sm":["hankenGrotesk"],"data-mono":["jetbrainsMono"],"display-lg":["hankenGrotesk"]},"fontSize":{"body-md":["15px",{"lineHeight":"24px","fontWeight":"400"}],"headline-md-mobile":["20px",{"lineHeight":"26px","fontWeight":"700"}],"caption-sm":["12px",{"lineHeight":"14px","fontWeight":"700"}],"label-bold":["13px",{"lineHeight":"16px","fontWeight":"700"}],"headline-md":["23px",{"lineHeight":"28px","fontWeight":"700"}],"title-sm":["17px",{"lineHeight":"24px","fontWeight":"700"}],"data-mono":["12px",{"lineHeight":"16px","fontWeight":"500"}],"display-lg":["32px",{"lineHeight":"40px","fontWeight":"700"}]}}}}</script></head><body class="bg-background font-body-md text-body-md text-on-surface antialiased"><aside class="fixed left-0 top-0 h-full w-72 bg-inverse-surface text-inverse-on-surface z-50 flex flex-col justify-between shadow-[0_1px_8px_rgba(0,0,0,0.04)]"><div class="flex flex-col flex-1 min-h-0"><div class="h-16 px-md flex items-center gap-sm bg-inverse-surface"><div class="w-10 h-10 rounded-lg bg-primary flex items-center justify-center text-on-primary shadow-sm"><span class="material-symbols-outlined text-[24px]">bolt</span></div><div class="flex flex-col"><div class="flex items-center gap-xs"><span class="font-headline-md text-headline-md text-white tracking-wide">XT-POWER</span><span class="font-caption-sm text-caption-sm bg-primary px-xs py-0.5 rounded text-white">OS</span></div><span class="font-caption-sm text-caption-sm text-outline-variant tracking-wider">鑫潼智电 · 智能配用电中枢</span></div></div><div class="flex-1 overflow-y-auto px-xs py-md"><nav class="flex flex-col gap-1" data-active-classes="bg-primary text-white font-label-bold rounded-lg shadow-sm"><a class="flex items-center gap-sm px-md py-sm rounded-lg text-outline-variant hover:bg-surface-container-highest/10 hover:text-white transition-colors" data-path="workbench" href="#"><span class="material-symbols-outlined text-[20px]">dashboard</span><span class="font-label-bold text-label-bold">运营工作台</span></a><div class="flex flex-col"><a class="flex items-center justify-between px-md py-sm rounded-lg bg-primary text-white font-label-bold shadow-sm transition-colors" data-path="customer-management" href="#"><div class="flex items-center gap-sm"><span class="material-symbols-outlined text-[20px]">apartment</span><span class="font-label-bold text-label-bold">客户管理</span></div><span class="material-symbols-outlined text-[16px]">expand_more</span></a><div class="flex flex-col ml-lg pl-md mt-1 mb-1 gap-1 border-l border-outline/30"><a aria-current="page" class="px-sm py-1.5 rounded-lg text-white font-label-bold text-caption-sm bg-white/10 transition-colors flex items-center gap-xs" data-path="customer-profiles" href="#"><span class="w-1.5 h-1.5 rounded-full bg-tertiary-fixed"></span>客户拜访与档案</a><a class="px-sm py-1.5 rounded text-outline-variant hover:text-white font-label-bold text-caption-sm transition-colors flex items-center gap-xs" data-path="electrical-topology" href="#"><span class="w-1.5 h-1.5 rounded-full bg-outline-variant/40"></span>空间拓扑与用电架构</a><a class="px-sm py-1.5 rounded text-outline-variant hover:text-white font-label-bold text-caption-sm transition-colors flex items-center gap-xs" data-path="wechat-app-authorization" href="#"><span class="w-1.5 h-1.5 rounded-full bg-outline-variant/40"></span>微信小程序授权</a></div></div><a class="flex items-center gap-sm px-md py-sm rounded-lg text-outline-variant hover:bg-surface-container-highest/10 hover:text-white transition-colors" data-path="project-management" href="#"><span class="material-symbols-outlined text-[20px]">assignment</span><span class="font-label-bold text-label-bold">项目管理</span></a><a class="flex items-center gap-sm px-md py-sm rounded-lg text-outline-variant hover:bg-surface-container-highest/10 hover:text-white transition-colors" data-path="work-orders" href="#"><span class="material-symbols-outlined text-[20px]">send_time_extension</span><span class="font-label-bold text-label-bold">运营派单</span></a><a class="flex items-center gap-sm px-md py-sm rounded-lg text-outline-variant hover:bg-surface-container-highest/10 hover:text-white transition-colors" data-path="device-monitoring" href="#"><span class="material-symbols-outlined text-[20px]">sensors</span><span class="font-label-bold text-label-bold">设备监控</span></a><a class="flex items-center gap-sm px-md py-sm rounded-lg text-outline-variant hover:bg-surface-container-highest/10 hover:text-white transition-colors" data-path="analytics-reports" href="#"><span class="material-symbols-outlined text-[20px]">query_stats</span><span class="font-label-bold text-label-bold">统计报表</span></a><a class="flex items-center gap-sm px-md py-sm rounded-lg text-outline-variant hover:bg-surface-container-highest/10 hover:text-white transition-colors" data-path="system-settings" href="#"><span class="material-symbols-outlined text-[20px]">settings</span><span class="font-label-bold text-label-bold">系统管理</span></a></nav></div></div><div class="p-md m-sm rounded-lg bg-surface-container-highest/5 backdrop-blur-sm border border-outline/20"><div class="flex items-center justify-between mb-xs"><div class="flex items-center gap-xs"><span class="relative flex h-2 w-2"><span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-tertiary-fixed opacity-75"></span><span class="relative inline-flex rounded-full h-2 w-2 bg-tertiary-container"></span></span><span class="font-caption-sm text-caption-sm text-white">边缘网关通信链路</span></div><span class="font-data-mono text-data-mono text-tertiary-fixed">在线 24/24</span></div><div class="flex items-center justify-between font-data-mono text-data-mono text-outline-variant"><span>时延: 14ms</span><span>丢包: 0.00%</span></div></div></aside><div class="pl-72 min-h-screen flex flex-col"><header class="fixed top-0 left-72 right-0 h-16 bg-surface/90 backdrop-blur-md z-40 shadow-[0_1px_8px_rgba(0,0,0,0.04)] px-lg flex items-center justify-between gap-md"><div class="flex items-center gap-lg flex-1 max-w-2xl"><div class="flex items-center gap-xs px-sm py-1 rounded-full bg-tertiary-container/10 border border-tertiary-container/20"><span class="material-symbols-outlined text-tertiary text-[16px]">sync</span><span class="font-caption-sm text-caption-sm text-tertiary font-bold">ICC 实时数据正常同步</span><span class="font-data-mono text-data-mono text-text-muted">120FPS</span></div><div class="relative flex-1"><span class="material-symbols-outlined absolute left-sm top-1/2 -translate-y-1/2 text-text-muted text-[18px]">search</span><input class="w-full pl-9 pr-sm py-1.5 rounded-lg bg-background border border-border-rule text-body-md font-body-md text-on-surface placeholder:text-text-muted focus:outline-none focus:border-primary transition-colors" placeholder="按变电所编码、变压器回路或客户名称全局检索 (Ctrl + K)..." type="text"/></div></div><div class="flex items-center gap-md"><button class="relative p-sm rounded-lg hover:bg-surface-container text-on-surface-variant hover:text-on-surface transition-colors"><span class="material-symbols-outlined text-[22px]">notifications</span><span class="absolute top-1.5 right-1.5 w-2 h-2 rounded-full bg-status-error"></span></button><button class="p-sm rounded-lg hover:bg-surface-container text-on-surface-variant hover:text-on-surface transition-colors"><span class="material-symbols-outlined text-[22px]">apps</span></button><div class="h-5 w-[1px] bg-border-rule"></div><div class="flex items-center gap-sm pl-xs"><div class="w-8 h-8 rounded-full bg-primary flex items-center justify-center shadow-sm"><span class="material-symbols-outlined text-on-primary text-[18px]">person</span></div><div class="flex flex-col text-left"><span class="font-label-bold text-label-bold text-on-surface leading-tight">李工</span><span class="font-data-mono text-data-mono text-text-muted leading-tight">主控工程师 · 调度中心</span></div><span class="material-symbols-outlined text-text-muted text-[16px]">keyboard_arrow_down</span></div></div></header><main class="w-full pt-16 px-lg py-lg flex-1 bg-background"><div class="flex flex-col w-full gap-lg pb-xl">
<!-- 面包屑导航与页头标题区 -->
<div class="flex flex-col gap-xs">
<nav class="flex items-center gap-xs text-text-muted font-caption-sm text-caption-sm">
<span class="hover:text-primary cursor-pointer transition-colors">客户管理</span>
<span class="material-symbols-outlined text-[14px]">chevron_right</span>
<span class="hover:text-primary cursor-pointer transition-colors">客户拜访管理</span>
<span class="material-symbols-outlined text-[14px]">chevron_right</span>
<span class="text-on-surface font-bold">新增客户拜访记录</span>
</nav>
<div class="flex flex-wrap items-center justify-between gap-md mt-1"><div class="flex items-center gap-sm"><div class="w-10 h-10 rounded-lg bg-surface-container-high flex items-center justify-center text-primary shadow-sm"><span class="material-symbols-outlined text-[24px]">handshake</span></div><div><div class="flex items-center gap-xs"><h1 class="font-headline-md text-headline-md text-on-surface">新增拜访跟进记录</h1><span class="px-xs py-0.5 rounded text-primary font-caption-sm text-caption-sm bg-primary/10 font-bold">售前CRM跟进</span></div><p class="font-caption-sm text-caption-sm text-text-muted mt-0.5">聚焦售前需求沟通、合作意向摸排与跟进计划,轻量高效记录</p></div></div><div class="flex items-center gap-xs"><button class="px-md py-1.5 rounded-lg bg-surface text-text-muted hover:text-on-surface border border-border-rule font-caption-sm text-caption-sm transition-colors flex items-center gap-1 shadow-sm" type="button"><span class="material-symbols-outlined text-[16px]">history</span><span>历史跟进台账</span></button></div></div>
</div>
<!-- 双栏主次架构 (8 : 4) -->
<div class="grid grid-cols-1 lg:grid-cols-12 gap-lg items-start"><div class="lg:col-span-8 flex flex-col gap-lg min-w-0"><section class="bg-surface rounded-xl p-lg shadow-sm flex flex-col gap-md"><div class="flex items-center justify-between pb-sm bg-surface-container-low/40 -mx-lg -mt-lg px-lg pt-md rounded-t-xl"><div class="flex items-center gap-xs"><div class="w-2 h-4 rounded-full bg-primary"></div><h2 class="font-title-sm text-title-sm text-on-surface">模块一:拜访基本信息</h2><span class="font-data-mono text-data-mono text-text-muted">(Visit Details)</span></div><span class="text-status-warn font-caption-sm text-caption-sm flex items-center gap-1"><span class="material-symbols-outlined text-[14px]">info</span>* 为必填项</span></div><div class="grid grid-cols-1 md:grid-cols-2 gap-md pt-xs"><div class="flex flex-col gap-1.5 md:col-span-2"><label class="font-label-bold text-label-bold text-on-surface flex items-center justify-between"><span>关联客户 <span class="text-status-error">*</span></span><span class="font-caption-sm text-caption-sm text-text-muted font-normal">支持客户全称或拼音首字母智能检索</span></label><div class="w-full flex items-center justify-between px-md py-2.5 rounded-lg bg-background text-on-surface cursor-pointer shadow-inner"><div class="flex items-center gap-sm"><span class="material-symbols-outlined text-primary text-[20px]">business</span><div class="flex items-center gap-xs"><span class="font-label-bold text-label-bold text-on-surface">华中师范大学南湖校区</span><span class="px-1.5 py-0.5 bg-primary/10 text-primary font-data-mono text-data-mono rounded">CUST-2026-0012</span></div></div><div class="flex items-center gap-xs"><span class="px-xs py-0.5 rounded font-caption-sm text-caption-sm bg-primary/10 text-primary font-bold">重点推进客户</span><span class="material-symbols-outlined text-text-muted text-[18px]">arrow_drop_down</span></div></div></div><div class="flex flex-col gap-1.5 md:col-span-2"><label class="font-label-bold text-label-bold text-on-surface">拜访方式 <span class="text-status-error">*</span></label><div class="grid grid-cols-2 sm:grid-cols-4 gap-xs"><button class="flex items-center justify-center gap-1 py-2 px-sm rounded-lg bg-primary text-on-primary font-label-bold text-label-bold shadow-sm" type="button"><span class="material-symbols-outlined text-[16px]">pin_drop</span><span>现场拜访</span></button><button class="flex items-center justify-center gap-1 py-2 px-sm rounded-lg bg-surface-container-low text-on-surface font-label-bold text-label-bold hover:bg-surface-container transition-colors" type="button"><span class="material-symbols-outlined text-[16px]">handshake</span><span>商务拜访</span></button><button class="flex items-center justify-center gap-1 py-2 px-sm rounded-lg bg-surface-container-low text-on-surface font-label-bold text-label-bold hover:bg-surface-container transition-colors" type="button"><span class="material-symbols-outlined text-[16px]">phone_in_talk</span><span>电话沟通</span></button><button class="flex items-center justify-center gap-1 py-2 px-sm rounded-lg bg-surface-container-low text-on-surface font-label-bold text-label-bold hover:bg-surface-container transition-colors" type="button"><span class="material-symbols-outlined text-[16px]">videocam</span><span>线上会议</span></button></div></div><div class="flex flex-col gap-1.5"><label class="font-label-bold text-label-bold text-on-surface">拜访时间 <span class="text-status-error">*</span></label><div class="flex items-center justify-between px-md py-2 rounded-lg bg-background text-on-surface shadow-inner"><div class="flex items-center gap-xs"><span class="material-symbols-outlined text-text-muted text-[18px]">calendar_today</span><span class="font-data-mono text-data-mono">2026-03-28 14:30 ~ 16:00</span></div><span class="font-caption-sm text-caption-sm text-primary font-bold bg-primary/10 px-xs py-0.5 rounded">1.5h</span></div></div><div class="flex flex-col gap-1.5"><label class="font-label-bold text-label-bold text-on-surface">业务负责人及陪同人员 <span class="text-status-error">*</span></label><div class="flex items-center gap-xs"><div class="flex-1 flex items-center gap-xs px-sm py-2 rounded-lg bg-background shadow-inner text-on-surface"><span class="w-5 h-5 rounded-full bg-primary text-white flex items-center justify-center text-[10px] font-bold">李</span><span class="font-body-md text-body-md">李志敏</span><span class="font-caption-sm text-caption-sm text-text-muted">(负责人)</span></div><div class="flex-1 flex items-center gap-xs px-sm py-2 rounded-lg bg-background shadow-inner text-on-surface"><span class="w-5 h-5 rounded-full bg-surface-container-highest text-on-surface flex items-center justify-center text-[10px] font-bold">王</span><input class="w-full bg-transparent focus:outline-none text-body-md font-body-md text-on-surface" type="text" value="王助理 (商务陪同)"/></div></div></div><div class="flex flex-col gap-1.5"><label class="font-label-bold text-label-bold text-on-surface">客户接待人及职务 <span class="text-status-error">*</span></label><div class="flex items-center gap-xs"><input class="w-1/3 px-md py-2 rounded-lg bg-background font-body-md text-body-md text-on-surface focus:outline-none focus:bg-surface shadow-inner" type="text" value="张科长"/><input class="flex-1 px-md py-2 rounded-lg bg-background font-body-md text-body-md text-on-surface focus:outline-none focus:bg-surface shadow-inner" type="text" value="后勤保卫处负责人"/></div></div><div class="flex flex-col gap-1.5"><label class="font-label-bold text-label-bold text-on-surface">接待人联系方式</label><div class="flex items-center px-sm py-2 rounded-lg bg-background shadow-inner gap-1"><span class="material-symbols-outlined text-text-muted text-[16px]">smartphone</span><input class="w-full bg-transparent focus:outline-none text-on-surface font-data-mono text-data-mono" type="text" value="138-7102-9201"/></div></div></div></section><section class="bg-surface rounded-xl p-lg shadow-sm flex flex-col gap-md"><div class="flex items-center justify-between pb-sm bg-surface-container-low/40 -mx-lg -mt-lg px-lg pt-md rounded-t-xl"><div class="flex items-center gap-xs"><div class="w-2 h-4 rounded-full bg-secondary"></div><h2 class="font-title-sm text-title-sm text-on-surface">模块二:沟通内容与意向评估</h2><span class="font-data-mono text-data-mono text-text-muted">(Communication &amp; Intent)</span></div></div><div class="flex flex-col gap-md pt-xs"><div class="flex flex-col gap-1.5"><label class="font-label-bold text-label-bold text-on-surface">客户合作意向评级 <span class="text-status-error">*</span></label><div class="grid grid-cols-1 md:grid-cols-3 gap-md"><div class="relative p-md rounded-xl bg-primary/5 shadow-sm cursor-pointer flex flex-col gap-xs ring-2 ring-primary"><div class="flex items-center justify-between"><div class="flex items-center gap-xs"><span class="w-6 h-6 rounded-full bg-primary text-white flex items-center justify-center font-bold text-[12px]">A</span><span class="font-label-bold text-label-bold text-primary">高意向 · 近期推进</span></div><span class="material-symbols-outlined text-primary text-[20px]">radio_button_checked</span></div><p class="font-caption-sm text-caption-sm text-on-surface-variant leading-relaxed">客户需求迫切,有明确预算意向或近期采购计划,拟安排方案深化对接。</p></div><div class="relative p-md rounded-xl bg-surface-container-low hover:bg-surface-container cursor-pointer flex flex-col gap-xs transition-colors"><div class="flex items-center justify-between"><div class="flex items-center gap-xs"><span class="w-6 h-6 rounded-full bg-surface-container-highest text-on-surface flex items-center justify-center font-bold text-[12px]">B</span><span class="font-label-bold text-label-bold text-on-surface">中意向 · 方案比选</span></div><span class="material-symbols-outlined text-outline-variant text-[20px]">radio_button_unchecked</span></div><p class="font-caption-sm text-caption-sm text-text-muted leading-relaxed">认可智电升级方向,处于多家厂商对比及内部论证期,需递交产品方案。</p></div><div class="relative p-md rounded-xl bg-surface-container-low hover:bg-surface-container cursor-pointer flex flex-col gap-xs transition-colors"><div class="flex items-center justify-between"><div class="flex items-center gap-xs"><span class="w-6 h-6 rounded-full bg-surface-container-highest text-text-muted flex items-center justify-center font-bold text-[12px]">C</span><span class="font-label-bold text-label-bold text-text-muted">低意向 · 储备客情</span></div><span class="material-symbols-outlined text-outline-variant text-[20px]">radio_button_unchecked</span></div><p class="font-caption-sm text-caption-sm text-text-muted leading-relaxed">日常商务拜访维系,短期内暂无实质性预算规划,列入潜在客户储备库。</p></div></div></div><div class="flex flex-col gap-1.5"><label class="font-label-bold text-label-bold text-on-surface flex items-center justify-between"><span>客户关注诉求与痛点 (多选)</span><span class="font-caption-sm text-caption-sm text-text-muted font-normal">支持多选标注意向重点</span></label><div class="flex flex-wrap gap-xs"><div class="px-sm py-1.5 rounded-lg bg-primary/10 text-primary font-label-bold text-label-bold flex items-center gap-1 cursor-pointer"><span class="material-symbols-outlined text-[16px]">check</span><span>用电安全监管与隐患排查</span></div><div class="px-sm py-1.5 rounded-lg bg-primary/10 text-primary font-label-bold text-label-bold flex items-center gap-1 cursor-pointer"><span class="material-symbols-outlined text-[16px]">check</span><span>节能降耗与能耗考核</span></div><div class="px-sm py-1.5 rounded-lg bg-surface-container-low text-text-muted font-label-bold text-label-bold flex items-center gap-1 hover:bg-surface-container cursor-pointer transition-colors"><span class="material-symbols-outlined text-[16px]">add</span><span>配电室托管代运维</span></div><div class="px-sm py-1.5 rounded-lg bg-primary/10 text-primary font-label-bold text-label-bold flex items-center gap-1 cursor-pointer"><span class="material-symbols-outlined text-[16px]">check</span><span>能耗可视化数字大屏</span></div><div class="px-sm py-1.5 rounded-lg bg-surface-container-low text-text-muted font-label-bold text-label-bold flex items-center gap-1 hover:bg-surface-container cursor-pointer transition-colors"><span class="material-symbols-outlined text-[16px]">add</span><span>成本预算控制与分期投入</span></div><div class="px-sm py-1.5 rounded-lg bg-surface-container-low text-text-muted font-label-bold text-label-bold flex items-center gap-1 hover:bg-surface-container cursor-pointer transition-colors"><span class="material-symbols-outlined text-[16px]">add</span><span>政府节能绿色补贴申报</span></div></div></div><div class="flex flex-col gap-1.5"><div class="flex items-center justify-between"><label class="font-label-bold text-label-bold text-on-surface">拜访沟通纪要与关键反馈 <span class="text-status-error">*</span></label><div class="flex items-center gap-xs"><button class="px-xs py-1 rounded bg-surface-container-high hover:bg-surface-container-highest text-primary font-caption-sm text-caption-sm flex items-center gap-1 transition-colors" type="button"><span class="material-symbols-outlined text-[14px]">format_quote</span><span>常用纪要模板</span></button></div></div><textarea class="w-full p-md rounded-lg bg-background font-body-md text-body-md text-on-surface focus:outline-none focus:bg-surface shadow-inner leading-relaxed resize-none" placeholder="详细记录本次拜访交流核心内容、客户真实顾虑、决策链关键成员态度等..." rows="4">本次拜访与后勤保卫处张科长深度沟通。校方高度认可智电升级对校园用电安全的价值,当前核心痛点在于夜间缺乏有效巡检监管手段,且校领导要求在暑期前确定初步技术方案。客户对SaaS平台可视化大屏和预警功能非常感兴趣,表示可协助安排分管副校长进行二次方案汇报。</textarea></div></div></section><section class="bg-surface rounded-xl p-lg shadow-sm flex flex-col gap-md"><div class="flex items-center justify-between pb-sm bg-surface-container-low/40 -mx-lg -mt-lg px-lg pt-md rounded-t-xl"><div class="flex items-center gap-xs"><div class="w-2 h-4 rounded-full bg-tertiary"></div><h2 class="font-title-sm text-title-sm text-on-surface">模块三:后续跟进计划</h2><span class="font-data-mono text-data-mono text-text-muted">(Next Step Plan)</span></div></div><div class="grid grid-cols-1 md:grid-cols-2 gap-md pt-xs"><div class="flex flex-col gap-1.5"><label class="font-label-bold text-label-bold text-on-surface">预计下次回访时间 <span class="text-status-error">*</span></label><div class="flex items-center justify-between px-md py-2.5 rounded-lg bg-background text-on-surface shadow-inner"><div class="flex items-center gap-xs"><span class="material-symbols-outlined text-text-muted text-[18px]">event</span><span class="font-data-mono text-data-mono">2026-04-03 (下周五前)</span></div><span class="material-symbols-outlined text-text-muted text-[18px]">arrow_drop_down</span></div></div><div class="flex flex-col gap-1.5"><label class="font-label-bold text-label-bold text-on-surface">下一步行动目标 <span class="text-status-error">*</span></label><div class="flex items-center justify-between px-md py-2.5 rounded-lg bg-background text-on-surface shadow-inner"><span class="font-body-md text-body-md text-on-surface">提报定制化初步解决方案与产品演示</span><span class="material-symbols-outlined text-text-muted text-[18px]">expand_more</span></div></div><div class="flex flex-col gap-1.5 md:col-span-2"><label class="font-label-bold text-label-bold text-on-surface flex items-center justify-between"><span>现场交流照片 / 拜访资料 (选填)</span><span class="font-caption-sm text-caption-sm text-text-muted font-normal">支持上传名片、工位交流或会议材料照片,上限 2 张</span></label><div class="grid grid-cols-1 sm:grid-cols-3 gap-md"><div class="p-md rounded-xl bg-surface-container-low hover:bg-surface-container-high/60 cursor-pointer flex flex-col items-center justify-center gap-xs text-center transition-all group shadow-inner"><div class="w-10 h-10 rounded-full bg-white shadow-sm flex items-center justify-center text-primary group-hover:scale-110 transition-transform"><span class="material-symbols-outlined text-[22px]">add_photo_alternate</span></div><span class="font-caption-sm text-caption-sm text-text-muted">点击上传资料/名片</span></div><div class="relative rounded-xl overflow-hidden bg-surface-container flex flex-col h-28 border border-border-rule/40"><img class="w-full h-full object-cover" src="https://lh3.googleusercontent.com/aida-public/AB6AXuDPVmCC_uea8k3MK8n2pMyZF_ZX9k2oim2DOp2PFPUd8rC6IfyEMorU6V9uf4l_Ah0vZBXfFNpgbgjn_GNfxUN1MgcmmM4DZbsBg2APoMUxRgTQI2g5tPaouE7MNxUlxOVJcal9Gjg_WN7KN7MTaj-fAyZOyoIBcLfPddtWX5p6sWIwP2DaivRVuXYLGaEIG0pwJ8apwOdeF2TebTItxEACKawg9UxvLvqeZJbGc-tl0qarX4EelT_E"/><div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent flex items-end justify-between p-xs text-white"><span class="font-caption-sm text-[11px] truncate">会谈签到单.jpg</span><button class="w-5 h-5 rounded-full bg-black/50 hover:bg-status-error flex items-center justify-center" type="button"><span class="material-symbols-outlined text-[12px]">delete</span></button></div></div></div></div></div></section><div class="bg-surface rounded-xl p-md shadow-sm flex items-center justify-between gap-md"><span class="font-caption-sm text-caption-sm text-text-muted">信息录入后将自动同步至客户拜访档案与售前漏斗统计</span><div class="flex items-center gap-sm"><button class="py-2 px-lg rounded-full bg-transparent text-text-muted hover:text-on-surface font-label-bold text-label-bold transition-colors" type="button">取消</button><button class="py-2 px-lg rounded-full bg-surface-container-high hover:bg-surface-container-highest text-on-surface font-label-bold text-label-bold transition-colors" type="button">暂存草稿</button><button class="py-2 px-xl rounded-full bg-primary text-on-primary font-label-bold text-label-bold shadow-md hover:bg-primary-container transition-all flex items-center gap-1" type="button"><span class="material-symbols-outlined text-[18px]">check</span><span>保存并提交拜访记录</span></button></div></div></div><div class="lg:col-span-4 flex flex-col gap-lg sticky top-20"><div class="bg-surface rounded-xl p-lg shadow-sm flex flex-col gap-md"><div class="flex items-center justify-between pb-xs"><div class="flex items-center gap-xs"><span class="material-symbols-outlined text-primary text-[20px]">domain</span><h3 class="font-title-sm text-title-sm text-on-surface">客户概况速览</h3></div><span class="font-caption-sm text-caption-sm px-1.5 py-0.5 rounded bg-primary/10 text-primary font-bold">重点客户</span></div><div class="p-md rounded-lg bg-surface-container-low flex flex-col gap-xs"><span class="font-label-bold text-label-bold text-on-surface">华中师范大学南湖校区</span><div class="grid grid-cols-2 gap-y-xs gap-x-sm font-caption-sm text-caption-sm text-text-muted mt-1"><div>建档时间: <span class="font-data-mono text-on-surface font-bold">2024-09-12</span></div><div>跟进频次: <span class="font-data-mono text-primary font-bold">第 3 次</span></div><div>上次回访: <span class="font-data-mono text-on-surface">14 天前</span></div><div>意向状态: <span class="text-primary font-bold">方案推进中</span></div></div></div><div class="flex flex-col gap-xs"><span class="font-caption-sm text-caption-sm text-text-muted">售前推进关键里程碑:</span><div class="flex flex-col gap-1.5"><div class="flex items-center gap-xs text-caption-sm font-caption-sm text-text-muted"><span class="w-4 h-4 rounded-full bg-primary text-white flex items-center justify-center text-[10px]">✓</span><span>建立客情对接 (2026-03-14)</span></div><div class="flex items-center gap-xs text-caption-sm font-caption-sm text-primary font-bold"><span class="w-4 h-4 rounded-full bg-primary text-white flex items-center justify-center text-[10px]">2</span><span>现场需求交流与痛点识别 (今日)</span></div><div class="flex items-center gap-xs text-caption-sm font-caption-sm text-text-muted"><span class="w-4 h-4 rounded-full bg-surface-container-highest text-text-muted flex items-center justify-center text-[10px]">3</span><span>提报定制化解决方案</span></div><div class="flex items-center gap-xs text-caption-sm font-caption-sm text-text-muted"><span class="w-4 h-4 rounded-full bg-surface-container-highest text-text-muted flex items-center justify-center text-[10px]">4</span><span>商务合同与合作签约</span></div></div></div></div><div class="bg-surface rounded-xl p-lg shadow-sm flex flex-col gap-xs"><div class="flex items-center gap-xs text-on-surface font-label-bold text-label-bold"><span class="material-symbols-outlined text-primary text-[18px]">tips_and_updates</span><span>售前回访沟通要点</span></div><ul class="font-caption-sm text-caption-sm text-text-muted flex flex-col gap-1.5 list-disc pl-4 leading-relaxed mt-1"><li>明确客户今年度用电安全及能耗改造预算周期与立项审批流程。</li><li>重点沟通客户核心关注诉求,避免前期过度陷入复杂的硬件工程施工细节。</li><li>拜访结束后及时在 24 小时内记录沟通纪要,并明确下次回访或方案提报时间节点。</li></ul></div></div></div>
</div></main></div></body></html>