update
This commit is contained in:
@@ -0,0 +1,176 @@
|
||||
<!doctype html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Billing Validator — 周报 (2026-01-21)</title>
|
||||
<style>
|
||||
:root{
|
||||
/* 调整为浅色但非纯白的配色 */
|
||||
--bg: #eef3f8; /* 页面背景:柔和的浅蓝灰 */
|
||||
--text: #0f1722; /* 深色文字 */
|
||||
--accent: #1f6feb; /* 主色 */
|
||||
--muted: #556678; /* 次要文字 */
|
||||
--card-bg: #fbfdff; /* 卡片背景:非常浅但不是纯白 */
|
||||
--panel-bg: #fcfdff; /* 面板背景:接近卡片但有轻微差别 */
|
||||
--tag-bg: rgba(31,111,235,0.08);
|
||||
}
|
||||
/* 全局 box-sizing,避免 padding/margin 导致元素尺寸计算超出容器 */
|
||||
*, *::before, *::after { box-sizing: border-box; }
|
||||
/* 不显示浏览器滚动条,幻灯片与容器自己收缩/适配 */
|
||||
html,body{height:100%;margin:0;background:var(--bg);font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial; color:var(--text);overflow:hidden}
|
||||
/* 视口内边距:在大屏上留出更多背景边缘,避免幻灯片看起来过于靠边 */
|
||||
.viewport{display:flex;align-items:center;justify-content:center;height:100%;padding:clamp(24px, 4vw, 120px);box-sizing:border-box;overflow:hidden}
|
||||
/* 固定 16:9 的幻灯片尺寸 */
|
||||
.slide{
|
||||
/* 在 4K 等大屏上占更多空间,同时在小屏时使用视口百分比;受限于可见高度 */
|
||||
/* 略减宽度上限并留出更多外围空白 */
|
||||
width: min(3600px, 92vw);
|
||||
aspect-ratio: 16 / 9;
|
||||
height: auto;
|
||||
max-height: 98vh;
|
||||
background:linear-gradient(180deg,var(--card-bg),#fbfdff);
|
||||
box-shadow:0 10px 30px rgba(15,23,34,0.12);
|
||||
border-radius:12px;
|
||||
/* 增大最小内边距,确保内容远离边缘;在大屏上仍可放大 */
|
||||
padding: clamp(24px, 3.5vw, 80px);
|
||||
box-sizing:border-box;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:1.6em;
|
||||
overflow:hidden; /* 确保 slide 内部内容不会溢出可视区域 */
|
||||
position:relative; /* 作为裁剪和定位上下文 */
|
||||
max-width:3600px; /* 在大屏幕上允许更大展示 */
|
||||
}
|
||||
/* 基于 slide 宽度与高度的字体缩放:在空间不足时文字会自动变小,优先同时兼顾宽高,尽量避免出现滚动条 */
|
||||
.slide { --slide-font: clamp(10px, calc(0.8vw + 0.6vh), 20px); font-size: var(--slide-font); }
|
||||
.header{display:flex;align-items:flex-start;justify-content:space-between}
|
||||
/* 使用 em,使字号随 .slide 的 font-size 缩放 */
|
||||
.title{font-size:1.6em;font-weight:700;color:var(--text)}
|
||||
.subtitle{font-size:0.85em;color:var(--muted);margin-top:0.4em}
|
||||
/* 内容区使用可收缩的弹性布局,防止子元素撑开父容器 */
|
||||
.content{display:flex;gap:2em;flex:1;min-height:0;width:100%;box-sizing:border-box;padding:0.2em}
|
||||
/* 列和面板需要在 flex 布局中可收缩:min-width:0/box-sizing:border-box */
|
||||
.col{flex:1;background:transparent;padding:1.1em 1.4em;border-radius:8px;display:flex;flex-direction:column;min-height:0;min-width:0;box-sizing:border-box}
|
||||
/* 不使用内部滚动条:让文字自动换行并通过字体缩放适配空间;若仍溢出,会被裁剪,避免滚动条 */
|
||||
.panel{background:linear-gradient(180deg,var(--panel-bg),#fbfdff);padding: clamp(16px, 1.6vw, 48px);border-radius:10px;box-shadow:0 6px 16px rgba(15,23,34,0.04);flex:1;min-height:0;min-width:0;overflow:hidden;border:1px solid rgba(15,23,34,0.04);box-sizing:border-box;max-height:100%;max-width:100%}
|
||||
/* 确保列表内不会意外增加宽度或高度 */
|
||||
.panel ul, .panel ol {margin:0;box-sizing:border-box}
|
||||
h3{font-size:1.1em}
|
||||
ul{margin:0;padding-left:1.125em;color:var(--text);line-height:1.6}
|
||||
ol{margin:0;padding-left:1.125em;color:var(--text);line-height:1.6}
|
||||
li{margin-bottom:0.4em}
|
||||
/* 每个子项内部的元信息(状态/负责人/备注) */
|
||||
.item-meta{margin-top:0.5em;color:var(--muted);font-size:0.95em;display:block}
|
||||
.tag{background:var(--tag-bg);color:var(--accent);padding:0.25em 0.6em;border-radius:999px;font-weight:600;font-size:0.85em;display:inline-block;margin-bottom:0.45em}
|
||||
.meta-text{color:var(--muted);display:block;margin:0.25em 0 0 0;padding-left:0.4em}
|
||||
.muted{color:var(--muted);font-size:0.95em}
|
||||
.footer{display:flex;justify-content:space-between;align-items:center;margin-top:1.4em}
|
||||
.pill{background:rgba(31,111,235,0.10);color:var(--accent);padding:0.5em 0.9em;border-radius:999px;font-weight:600;font-size:0.95em;border:1px solid rgba(31,111,235,0.06)}
|
||||
/* 使幻灯片在小屏幕上缩放以适应视口 */
|
||||
@media (max-width:1300px){
|
||||
/* 小屏幕上适当减小字体和内边距 */
|
||||
.slide{width:92vw}
|
||||
.slide { --slide-font: clamp(11px, 1.6vw, 16px); }
|
||||
.slide{padding:1.1em}
|
||||
}
|
||||
@media (max-width:900px){
|
||||
.slide{width:96vw}
|
||||
.slide { --slide-font: clamp(10px, 2.0vw, 14px); }
|
||||
.slide{padding:0.6em}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="viewport">
|
||||
<div class="slide" role="document" aria-label="Billing Validator 周报 2026-01-21">
|
||||
<div class="header">
|
||||
<div>
|
||||
<div class="title">Billing Validator — 周报</div>
|
||||
<div class="subtitle">2026-01-21</div>
|
||||
</div>
|
||||
<div class="pill">单页汇报 · 16:9</div>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<div class="col">
|
||||
<div class="panel">
|
||||
<h3>一、上周完成的工作</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<strong>部署与测试</strong>
|
||||
<div class="item-meta">
|
||||
<span class="tag">Action</span>
|
||||
<div class="meta-text">Billing Validator 新架构已部署到 workstation</div>
|
||||
<div class="meta-text">Status: 已启动 Sutherland LLA 测试</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<strong>与业务侧沟通(Paulina)</strong>
|
||||
<div class="item-meta">
|
||||
<span class="tag">Deliverable</span>
|
||||
<div class="meta-text">完成需适配场景清单(节前已适配 19 个 FTE 场景)</div>
|
||||
<div class="meta-text">Vendor list: 已提供</div>
|
||||
<div class="meta-text">SOP: 已提供新版撰写指导;4 个 meta-info table 可做成全局</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<strong>与 IT 对接</strong>
|
||||
<div class="item-meta">
|
||||
<span class="tag">Coordination</span>
|
||||
<div class="meta-text">说明需求并传达上线初步计划</div>
|
||||
<div class="meta-text">Sizing: 预计本周完成</div>
|
||||
<div class="meta-text">上线初步目标: 2026-03-31</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<strong>数据对接(chenyao3)</strong>
|
||||
<div class="item-meta">
|
||||
<span class="tag">Data</span>
|
||||
<div class="meta-text">澄清若干数据需求;Productive time per day 与 workday 的需求暂时搁置</div>
|
||||
<div class="meta-text">历史数据范围: 最近 6 个月</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="panel">
|
||||
<h3>二、本周 Key Action</h3>
|
||||
<ol>
|
||||
<li>完成 4 个场景的适配
|
||||
<ul>
|
||||
<li>Sutherland-LAS-Premium</li>
|
||||
<li>Sutherland-LAS-STD</li>
|
||||
<li>IBM-NA-STD</li>
|
||||
<li>IBM-LAS-STD</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>针对业务反馈定位并修复 Sutherland LLA 场景中的测试问题</li>
|
||||
<li>修改并验证文件上传到数据库的逻辑(当前代码已开发完成,状态:待测试/部署)</li>
|
||||
<li>跟进 IT sizing 结果并确认资源/上线窗口</li>
|
||||
<li>跟进 Paulina 提供剩余 FTE 场景的 SOP</li>
|
||||
</ol>
|
||||
|
||||
<h3 style="margin-top:14px">三、Risks / Help needed</h3>
|
||||
<ul>
|
||||
<li>需要 Paulina 持续提供其他 FTE 场景的 SOP(Help Needed)</li>
|
||||
</ul>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<div class="muted">进度简明扼要 — 如需更详细数据请在会后补充</div>
|
||||
<div class="muted">生成时间: 2026-01-21</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user