主要改动: - SQL: biz_support_unit → biz_org, 加 org_type, 加 business_nature; 删 biz_execution_unit, biz_service_org - SQL: biz_project.support_unit_id/name + service_org_id/name → org_id/name/type - SQL: biz_meeting.support_unit_name → org_name - SQL: biz_person.work_unit → org_id (FK) - 后端: 新 BizOrg entity/mapper/service/controller - 后端: BizProject/BizMeeting 字段重命名 - 后端: 删 12 个 BizSupportUnit/BizExecutionUnit/BizServiceOrg Java 文件 - 后端: BizPersonImportVO.workUnit → orgName (导入时查 biz_org 取 org_id) - 后端: BizAuthController.registerExecutor 完整实现 (原 registerSupplier stub) - 前端: 新 admin/Orgs.vue + manager/Orgs.vue (原 SupportUnits) - 前端: RegisterExecutor.vue (原 RegisterSupplier, 单页 2 步) - 前端: sponsor/executor/manager 多个文件 workUnit → orgId/orgName 重命名 - 前端: 统一 supplier → executor, 业务命名 sponsor(赞助方) / executor(执行方=供应商) - 前端: 全工程 execution → executor (company type / role / person unit_type)
105 lines
5.5 KiB
HTML
105 lines
5.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>2025-2030健康规划弧形时间轴</title>
|
|
<style>
|
|
*{margin:0;padding:0;box-sizing:border-box;font-family:"Microsoft YaHei",sans-serif}
|
|
body{background:#fff;display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px}
|
|
.container{position:relative;width:2109px;height:960px;max-width:100%}
|
|
/* 中心Logo+年份 */
|
|
.center-box{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);text-align:center;z-index:10}
|
|
.logo{width:84px;height:84px;margin:0 auto 16px;display:grid;grid-template-columns:1fr 1fr;gap:6px}
|
|
.logo-item{background:#c70f2c}
|
|
.logo-item:nth-child(1){border-radius:4px 0 0 0}
|
|
.logo-item:nth-child(2){border-radius:0 4px 0 0}
|
|
.logo-item:nth-child(3){border-radius:0 0 0 4px}
|
|
.logo-item:nth-child(4){border-radius:0 0 4px 0;position:relative}
|
|
.logo-item:nth-child(4)::after{content:"";position:absolute;top:-13px;right:-13px;width:22px;height:22px;background:#c70f2c;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
|
|
.year-text{font-size:58px;color:#c70f2c;font-weight:bold}
|
|
/* 节点基础样式 */
|
|
.arc-node{position:absolute;display:flex;flex-direction:column;align-items:center;transform-origin:center bottom;z-index:5}
|
|
.hex{width:92px;height:80px;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);display:flex;justify-content:center;align-items:center;font-size:34px;font-weight:bold;color:#fff;margin-bottom:10px}
|
|
.hex-dark{background:linear-gradient(135deg,#ed232b,#c70f2c)}
|
|
.hex-light{background:linear-gradient(135deg,#f296a6,#e9a8b6)}
|
|
.dot-wrap{width:26px;height:26px;border-radius:50%;background:#f3b3a3;display:flex;justify-content:center;align-items:center;margin-bottom:6px}
|
|
.dot-core{width:11px;height:11px;border-radius:50%;background:#c70f2c}
|
|
.desc-text{font-size:29px;color:#c70f2c;text-align:center;line-height:1.55}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<!-- SVG绘制弧形背景与主线 -->
|
|
<svg width="2109" height="960" style="position:absolute;top:0;left:0;z-index:1">
|
|
<!-- 外层浅红弧形底色 -->
|
|
<path d="M 100 700 A 950 950 0 0 1 2009 700" fill="#fddede"/>
|
|
<!-- 内层白色弧形遮罩 -->
|
|
<path d="M 130 700 A 920 920 0 0 1 1979 700" fill="#ffffff"/>
|
|
<!-- 红色弧形主线 -->
|
|
<path d="M 115 700 A 935 935 0 0 1 1994 700" stroke="#e5222a" stroke-width="2" fill="none"/>
|
|
</svg>
|
|
|
|
<div class="center-box">
|
|
<div class="logo">
|
|
<div class="logo-item"></div>
|
|
<div class="logo-item"></div>
|
|
<div class="logo-item"></div>
|
|
<div class="logo-item"></div>
|
|
</div>
|
|
<div class="year-text">2025-2030年</div>
|
|
</div>
|
|
|
|
<!-- 沿圆弧极坐标均匀排布8个节点,圆心(1054,700),半径935px -->
|
|
<!-- 节点1 角度150° -->
|
|
<div class="arc-node" style="left:calc(1054px + 935px * cos(150deg));top:calc(700px - 935px * sin(150deg))">
|
|
<div class="hex hex-dark">01</div>
|
|
<div class="dot-wrap"><div class="dot-core"></div></div>
|
|
<div class="desc-text">触达100万+家医<br>疗卫生服务机构</div>
|
|
</div>
|
|
<!-- 节点2 角度130° -->
|
|
<div class="arc-node" style="left:calc(1054px + 935px * cos(130deg));top:calc(700px - 935px * sin(130deg))">
|
|
<div class="hex hex-light">02</div>
|
|
<div class="dot-wrap"><div class="dot-core"></div></div>
|
|
<div class="desc-text">300万+专业医护<br>人员广泛参与</div>
|
|
</div>
|
|
<!-- 节点3 角度110° -->
|
|
<div class="arc-node" style="left:calc(1054px + 935px * cos(110deg));top:calc(700px - 935px * sin(110deg))">
|
|
<div class="hex hex-dark">03</div>
|
|
<div class="dot-wrap"><div class="dot-core"></div></div>
|
|
<div class="desc-text">培训100万+名健<br>康科普创作志愿<br>者</div>
|
|
</div>
|
|
<!-- 节点4 角度90° 顶部正中 -->
|
|
<div class="arc-node" style="left:calc(1054px + 935px * cos(90deg));top:calc(700px - 935px * sin(90deg))">
|
|
<div class="hex hex-light">04</div>
|
|
<div class="dot-wrap"><div class="dot-core"></div></div>
|
|
<div class="desc-text">赋能10万+名健康<br>科普传播志愿者</div>
|
|
</div>
|
|
<!-- 节点5 角度70° -->
|
|
<div class="arc-node" style="left:calc(1054px + 935px * cos(70deg));top:calc(700px - 935px * sin(70deg))">
|
|
<div class="hex hex-dark">05</div>
|
|
<div class="dot-wrap"><div class="dot-core"></div></div>
|
|
<div class="desc-text">知识普及10亿+<br>人次人民群众</div>
|
|
</div>
|
|
<!-- 节点6 角度50° -->
|
|
<div class="arc-node" style="left:calc(1054px + 935px * cos(50deg));top:calc(700px - 935px * sin(50deg))">
|
|
<div class="hex hex-light">06</div>
|
|
<div class="dot-wrap"><div class="dot-core"></div></div>
|
|
<div class="desc-text">覆盖4万+个<br>乡镇、街道</div>
|
|
</div>
|
|
<!-- 节点7 角度30° -->
|
|
<div class="arc-node" style="left:calc(1054px + 935px * cos(30deg));top:calc(700px - 935px * sin(30deg))">
|
|
<div class="hex hex-dark">07</div>
|
|
<div class="dot-wrap"><div class="dot-core"></div></div>
|
|
<div class="desc-text">1000万个流量平<br>台(用户数10万+)</div>
|
|
</div>
|
|
<!-- 节点8 角度10° -->
|
|
<div class="arc-node" style="left:calc(1054px + 935px * cos(10deg));top:calc(700px - 935px * sin(10deg))">
|
|
<div class="hex hex-light">08</div>
|
|
<div class="dot-wrap"><div class="dot-core"></div></div>
|
|
<div class="desc-text">建设1万个<br>健康小屋</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|