| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109 |
- <!DOCTYPE html>
- <html lang="zh-CN"><head>
- <meta charset="utf-8"/>
- <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
- <title>漳州文化生态保护区数字驾驶舱</title>
- <script src="https://modao.cc/agent-py/static/source/js/tailwindcss.js"></script>
- <script src="https://modao.cc/agent-py/static/source/js/iconify-icon.min.js"></script>
- <script src="https://modao.cc/agent-py/static/source/js/echarts.min.js"></script>
- <style>
- @keyframes pulseDot { 0%,100% { transform:scale(1); opacity:.75 } 50% { transform:scale(1.75); opacity:1 } }
- @keyframes draw { from { stroke-dashoffset: 480 } to { stroke-dashoffset: 0 } }
- @keyframes flicker { 0%,100% { opacity:.8 } 50% { opacity:1 } }
- .pulse-dot { animation:pulseDot 1.8s infinite ease-in-out; }
- .route { stroke-dasharray: 12 9; animation: draw 14s linear infinite; }
- .lantern { animation:flicker 3s ease-in-out infinite; }
- :root { --brick:#b64d3c; --brick-deep:#62302d; --gold:#e5bd72; --sand:#f5e5bd; --ink:#2d1a1b; }
- body { background:#2d1a1b !important; color:var(--sand); }
- main { background:linear-gradient(135deg,#2d1a1b 0%,#452224 48%,#5a2b27 100%) !important; background-image:radial-gradient(circle at 52% 24%,rgba(190,78,55,.25),transparent 35%),linear-gradient(90deg,rgba(229,189,114,.07) 1px,transparent 1px),linear-gradient(0deg,rgba(229,189,114,.055) 1px,transparent 1px),repeating-linear-gradient(0deg,rgba(255,231,190,.03) 0 1px,transparent 1px 9px) !important; background-size:auto,42px 42px,42px 42px,100% 10px !important; }
- header { background:rgba(48,25,27,.84) !important; border-color:rgba(229,189,114,.7) !important; box-shadow:0 12px 32px rgba(18,8,9,.38),inset 0 -1px rgba(245,213,149,.22),0 0 30px rgba(182,77,60,.12) !important; backdrop-filter:blur(14px); }
- nav a { border-radius:4px; border:1px solid transparent; }
- nav a:hover, nav a.border-\[\#d3ae65\] { background:rgba(182,77,60,.82); border-color:rgba(229,189,114,.9); box-shadow:0 0 16px rgba(182,77,60,.2); }
- article, section.border, aside.border { border-color:rgba(207,139,101,.56) !important; background:rgba(61,33,33,.7) !important; box-shadow:inset 0 0 28px rgba(194,77,54,.13),0 10px 24px rgba(18,8,9,.14),0 0 18px rgba(182,77,60,.06); backdrop-filter:blur(10px); }
- article > div, section > div { border-color:rgba(207,139,101,.4) !important; }
- button { border-color:rgba(207,139,101,.62) !important; }
- button:hover { border-color:var(--gold) !important; box-shadow:0 0 14px rgba(229,189,114,.16); }
- svg path { vector-effect:non-scaling-stroke; }
- </style>
- </head>
- <body class="m-0 min-w-[1180px] overflow-x-hidden bg-[#24100f] font-serif text-[#f7edcd]">
- <main class="relative min-h-screen bg-[#24100f]" style="background-image:radial-gradient(circle at 50% 32%, rgba(137,47,35,.38), transparent 38%), linear-gradient(90deg, rgba(191,143,70,.05) 1px, transparent 1px), linear-gradient(0deg, rgba(191,143,70,.04) 1px, transparent 1px); background-size:auto, 42px 42px, 42px 42px;">
- <div class="pointer-events-none absolute inset-0 opacity-20" style="background-image:repeating-linear-gradient(135deg, transparent 0 22px, rgba(207,159,79,.18) 23px 24px, transparent 25px 47px);"></div>
- <div class="relative z-10 flex min-h-screen flex-col px-5 pb-4">
- <header class="relative -mx-5 flex min-h-[112px] w-[calc(100%+2.5rem)] shrink-0 items-center gap-8 overflow-hidden border-b border-[#c69b51]/70 bg-gradient-to-r from-[#2b1115] via-[#4b1d20] to-[#321317] px-7 py-4 shadow-[0_5px_22px_rgba(18,7,9,.35)] backdrop-blur-sm">
- <div class="pointer-events-none absolute inset-x-7 bottom-0 h-px bg-gradient-to-r from-transparent via-[#e0b86d]/80 to-transparent"></div>
- <div class="pointer-events-none absolute right-8 top-2 h-16 w-40 opacity-25" style="background-image:radial-gradient(circle, rgba(224,184,109,.55) 1px, transparent 1px); background-size:14px 14px;"></div>
- <div class="flex min-w-0 flex-1 items-center gap-5"><div class="min-w-0 order-1"><div class="flex items-center gap-5"><div class="truncate text-[24px] font-bold tracking-[.18em] text-[#ead6a6] [text-shadow:0_0_10px_rgba(225,194,125,.16)]">闽南文化(漳州)生态保护区</div><a aria-label="闽南文化主页" class="hidden" href="home.html"><svg aria-hidden="true" class="h-14 w-16" fill="none" viewbox="0 0 80 64" xmlns="http://www.w3.org/2000/svg"><path d="M8 39C19 36 30 30 40 18C49 29 60 34 72 38" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.2"></path><path d="M13 42V51M67 40V49M18 37C27 34 35 27 40 20C47 28 54 33 64 37" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8"></path><path d="M7 55C22 45 34 49 46 54C57 59 67 56 73 48C77 43 76 37 71 35C66 33 62 37 63 41C64 44 67 45 69 43" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8"></path><path d="M48 30V45" stroke="currentColor" stroke-linecap="round" stroke-width="1.8"></path><path d="M39 27H44V32H39Z" fill="#9f4026" stroke="#9f4026" stroke-linejoin="round"></path><path d="M19 37V43" stroke="#9f4026" stroke-linecap="round" stroke-width="1.8"></path></svg></a></div><div class="mt-1 text-xs tracking-[.32em] text-[#c9ac76]">数字驾驶舱 · 守护一城古韵</div></div></div>
- <nav class="relative z-10 flex shrink-0 items-center justify-end gap-5 text-base text-[#d8c18d]"><a aria-label="首页" class="grid h-9 w-9 place-items-center rounded text-[#f2c66f] transition hover:bg-[#b64d3c]" href="home.html"><svg aria-hidden="true" class="h-7 w-8" fill="none" viewbox="0 0 80 64" xmlns="http://www.w3.org/2000/svg"><path d="M8 39C19 36 30 30 40 18C49 29 60 34 72 38" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.2"></path><path d="M13 42V51M67 40V49M18 37C27 34 35 27 40 20C47 28 54 33 64 37" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8"></path><path d="M7 55C22 45 34 49 46 54C57 59 67 56 73 48C77 43 76 37 71 35C66 33 62 37 63 41C64 44 67 45 69 43" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8"></path><path d="M48 30V45" stroke="currentColor" stroke-linecap="round" stroke-width="1.8"></path><path d="M39 27H44V32H39Z" fill="#9f4026" stroke="#9f4026" stroke-linejoin="round"></path><path d="M19 37V43" stroke="#9f4026" stroke-linecap="round" stroke-width="1.8"></path></svg></a><a class="border-b border-transparent px-3 py-3 transition hover:border-[#d3ae65] hover:text-[#f0d9a0]" href="protection-overview.html">保护概况</a><a class="border-b border-transparent px-3 py-3 transition hover:border-[#d3ae65] hover:text-[#f0d9a0]" href="culture-resources.html">文化资源</a><a class="border-b border-transparent px-3 py-3 transition hover:border-[#d3ae65] hover:text-[#f0d9a0]" href="heritage-experience.html">传承体验</a><a class="border-b border-transparent px-3 py-3 transition hover:border-[#d3ae65] hover:text-[#f0d9a0]" href="culture-tourism.html">文旅融合</a><a class="border-b border-transparent px-3 py-3 transition hover:border-[#d3ae65] hover:text-[#f0d9a0]" href="public-communication.html">公众传播</a><a class="border-b border-transparent px-3 py-3 transition hover:border-[#d3ae65] hover:text-[#f0d9a0]" href="digital-archives.html">数字档案</a></nav></header>
- <section class="mt-3 grid grid-cols-4 gap-3">
- <article class="relative overflow-hidden rounded-sm border border-[#7f4034] bg-[#351817]/75 p-3 shadow-[inset_0_0_22px_rgba(194,77,54,.12)]">
- <div class="absolute left-0 top-0 h-full w-1 bg-[#be624b]"></div><p class="flex items-center gap-1.5 text-xs text-[#d4b6a2]"><iconify-icon class="text-[#e28a60]" icon="solar:medal-ribbons-star-linear" width="16"></iconify-icon>非遗代表性项目</p><div class="mt-1 flex items-end justify-between"><p class="text-2xl font-bold text-[#fae8b1]">368<span class="ml-1 text-xs font-normal">项</span></p><span class="text-xs text-[#dd9871]">较上月 ↑ 12 项</span></div><div _echarts_instance_="ec_1787105435428" class="mt-2 h-7" id="mini1" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><div style="position: relative; width: 312px; height: 28px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" height="28" style="position: absolute; left: 0px; top: 0px; width: 312px; height: 28px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;" width="312"></canvas></div></div>
- </article>
- <article class="relative overflow-hidden rounded-sm border border-[#7f4034] bg-[#351817]/75 p-3 shadow-[inset_0_0_22px_rgba(194,77,54,.12)]"><p class="flex items-center gap-1.5 text-xs text-[#d4b6a2]"><iconify-icon class="text-[#e28a60]" icon="solar:user-id-linear" width="16"></iconify-icon>非遗代表性传承人</p><div class="mt-1 flex items-end justify-between"><p class="text-2xl font-bold text-[#fae8b1]">286<span class="ml-1 text-xs font-normal">位</span></p><span class="text-xs text-[#e28a60]">较上月 ↑ 8 位</span></div><div _echarts_instance_="ec_1787105435429" class="mt-2 h-7" id="mini2" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><div style="position: relative; width: 312px; height: 28px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" height="28" style="position: absolute; left: 0px; top: 0px; width: 312px; height: 28px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;" width="312"></canvas></div></div></article>
- <article class="relative overflow-hidden rounded-sm border border-[#7f4034] bg-[#351817]/75 p-3 shadow-[inset_0_0_22px_rgba(194,77,54,.12)]"><p class="flex items-center gap-1.5 text-xs text-[#d4b6a2]"><iconify-icon class="text-[#e3bd65]" icon="solar:buildings-2-linear" width="16"></iconify-icon>不可移动文物</p><div class="mt-1 flex items-end justify-between"><p class="text-2xl font-bold text-[#fae8b1]">1,248<span class="ml-1 text-xs font-normal">处</span></p><span class="text-xs text-[#e3bd65]">较上月 ↑ 35 处</span></div><div _echarts_instance_="ec_1787105435430" class="mt-2 h-7" id="mini3" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><div style="position: relative; width: 312px; height: 28px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" height="28" style="position: absolute; left: 0px; top: 0px; width: 312px; height: 28px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;" width="312"></canvas></div></div></article>
- <article class="relative overflow-hidden rounded-sm border border-[#7f4034] bg-[#351817]/75 p-3 shadow-[inset_0_0_22px_rgba(194,77,54,.12)]"><p class="flex items-center gap-1.5 text-xs text-[#d4b6a2]"><iconify-icon class="text-[#d79b67]" icon="solar:database-linear" width="16"></iconify-icon>文化数字资源</p><div class="mt-1 flex items-end justify-between"><p class="text-2xl font-bold text-[#fae8b1]">32.45<span class="ml-1 text-xs font-normal">万条</span></p><span class="text-xs text-[#d79b67]">较上月 ↑ 2.31 万条</span></div><div _echarts_instance_="ec_1787105435431" class="mt-2 h-7" id="mini4" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><div style="position: relative; width: 312px; height: 28px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" height="28" style="position: absolute; left: 0px; top: 0px; width: 312px; height: 28px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;" width="312"></canvas></div></div></article>
- </section>
- <section class="mt-3 grid h-[600px] grid-cols-[280px_minmax(0,1fr)_330px] gap-3">
- <aside class="flex min-h-0 flex-col gap-3">
- <article class="rounded-sm border border-[#7f4034] bg-[#351817]/75 p-3"><div class="mb-2 flex items-center justify-between border-b border-[#7f4034]/70 pb-2"><h2 class="font-bold text-[#f5df9e]">文化资源分类</h2><iconify-icon class="text-[#e28a60]" icon="solar:alt-arrow-right-linear"></iconify-icon></div>
- <div class="space-y-0.5 text-xs">
- <div class="flex items-center gap-2 border-b border-[#6a342d]/60 py-2"><span class="text-[#d8a957]">01</span><iconify-icon icon="solar:medal-ribbons-star-linear" width="19"></iconify-icon><div class="flex-1"><b>非遗项目</b><p class="mt-0.5 text-[10px] text-[#b99380]">传统技艺、仪式节庆</p></div><b class="text-[#f6e4b2]">368</b></div>
- <div class="flex items-center gap-2 border-b border-[#6a342d]/60 py-2"><span class="text-[#d8a957]">02</span><iconify-icon icon="solar:user-id-linear" width="19"></iconify-icon><div class="flex-1"><b>非遗传承人</b><p class="mt-0.5 text-[10px] text-[#b99380]">国家级、省级、市级</p></div><b class="text-[#f6e4b2]">286</b></div>
- <div class="flex items-center gap-2 border-b border-[#6a342d]/60 py-2"><span class="text-[#d8a957]">03</span><iconify-icon icon="solar:buildings-2-linear" width="19"></iconify-icon><div class="flex-1"><b>不可移动文物</b><p class="mt-0.5 text-[10px] text-[#b99380]">古厝、古建筑、古遗址</p></div><b class="text-[#f6e4b2]">1,248</b></div>
- <div class="flex items-center gap-2 border-b border-[#6a342d]/60 py-2"><span class="text-[#d8a957]">04</span><iconify-icon icon="solar:home-2-linear" width="19"></iconify-icon><div class="flex-1"><b>传统村落</b><p class="mt-0.5 text-[10px] text-[#b99380]">历史文化名村</p></div><b class="text-[#f6e4b2]">156</b></div>
- <div class="flex items-center gap-2 pt-2"><span class="text-[#d8a957]">05</span><iconify-icon icon="solar:music-note-2-linear" width="19"></iconify-icon><div class="flex-1"><b>闽南方言</b><p class="mt-0.5 text-[10px] text-[#b99380]">传习、展示、交流</p></div><b class="text-[#f6e4b2]">98</b></div>
- </div>
- </article>
- <article class="min-h-0 flex-1 rounded-sm border border-[#7f4034] bg-[#351817]/75 p-3"><div class="flex items-center justify-between border-b border-[#7f4034]/70 pb-2"><h2 class="font-bold text-[#f5df9e]">保护态势</h2><span class="rounded border border-[#a85643] px-2 py-0.5 text-[10px] text-[#e28a60]">实时</span></div><div class="flex items-center gap-3 py-4"><div class="relative grid h-24 w-24 place-items-center rounded-full" style="background:conic-gradient(#c95b43 0 86%, #6b3029 86% 100%);"><div class="grid h-[68px] w-[68px] place-items-center rounded-full bg-[#351817]"><b class="text-2xl text-[#fae8b1]">86</b><span class="text-[10px] text-[#c19b87]">综合指数</span></div></div><div><p class="font-bold text-[#f1e0ad]">整体平稳</p><p class="mt-2 text-xs text-[#c6a18c]">较上月提升 <span class="text-[#e28a60]">3.2%</span></p></div></div><div class="space-y-3 border-t border-[#6a342d]/70 pt-3 text-xs"><div class="flex justify-between"><span><i class="mr-2 inline-block h-2 w-2 rounded-full bg-[#cf684c]"></i>正常开放</span><b>46 处</b></div><div class="flex justify-between"><span><i class="mr-2 inline-block h-2 w-2 rounded-full bg-[#e1b85d]"></i>修缮保护</span><b>32 处</b></div><div class="flex justify-between"><span><i class="mr-2 inline-block h-2 w-2 rounded-full bg-[#d56b53]"></i>待提升</span><b>18 处</b></div></div></article>
- </aside>
- <section class="relative min-h-0 overflow-hidden rounded-sm border border-[#7d4936] bg-[#2d1616]/85 p-3">
- <div class="flex items-center justify-between"><div><h2 class="flex items-center gap-1.5 font-bold text-[#f5df9e]"><iconify-icon class="text-[#df925f]" icon="solar:map-point-wave-linear" width="19"></iconify-icon>漳州市文化资源分布图</h2><p class="mt-1 text-[10px] tracking-widest text-[#d59c75]">一城古厝 · 满目花香 · 山海共生</p></div><div class="flex gap-1 text-[11px]"><button class="flex items-center gap-1 rounded-sm border border-[#d86a49] bg-[#8f382d] px-3 py-1 text-[#ffe0a0]"><iconify-icon icon="solar:map-linear" width="13"></iconify-icon>全部</button><button class="flex items-center gap-1 rounded-sm border border-[#704033] px-3 py-1 text-[#d7b49b]"><iconify-icon icon="solar:buildings-2-linear" width="13"></iconify-icon>文物</button><button class="flex items-center gap-1 rounded-sm border border-[#704033] px-3 py-1 text-[#d7b49b]"><iconify-icon icon="solar:medal-ribbons-star-linear" width="13"></iconify-icon>非遗</button><button class="flex items-center gap-1 rounded-sm border border-[#704033] px-3 py-1 text-[#d7b49b]"><iconify-icon icon="solar:palace-linear" width="13"></iconify-icon>村落</button><button class="flex items-center gap-1 rounded-sm border border-[#704033] px-3 py-1 text-[#d7b49b]"><iconify-icon icon="solar:chat-round-dots-linear" width="13"></iconify-icon>传承所</button></div></div>
- <div class="absolute inset-x-5 bottom-8 top-20 overflow-hidden rounded border border-[#6e3a31]/70 bg-[radial-gradient(ellipse_at_52%_48%,rgba(149,53,38,.44),transparent_64%)]">
- <div class="absolute inset-0 opacity-25" style="background-image:linear-gradient(rgba(216,106,73,.28) 1px,transparent 1px),linear-gradient(90deg,rgba(216,106,73,.28) 1px,transparent 1px);background-size:28px 28px;"></div>
- <svg aria-label="漳州市行政区域轮廓图" class="absolute inset-[4%_10%] h-[92%] w-[80%] drop-shadow-[0_0_18px_rgba(213,91,65,.42)]" preserveaspectratio="none" style="" viewbox="0 0 760 420">
- <path d="M110 42 L208 19 L289 36 L357 19 L445 48 L558 39 L646 82 L682 128 L662 162 L710 203 L681 239 L698 287 L657 334 L668 378 L599 398 L538 378 L480 404 L402 382 L344 397 L282 370 L213 382 L154 343 L94 317 L69 265 L91 220 L55 181 L82 128 Z" fill="rgba(121,48,39,.54)" stroke="#e07c59" stroke-width="4"></path>
- <path d="M110 42 L156 151 L282 135 L289 36 M208 19 L282 135 L402 103 L357 19 M445 48 L402 103 L514 155 L558 39 M646 82 L514 155 L662 162 M156 151 L94 317 M156 151 L282 135 L344 237 L282 370 M402 103 L344 237 L480 404 M514 155 L482 260 L599 398 M662 162 L482 260 L698 287 M344 237 L482 260" fill="none" opacity=".9" stroke="#c6634c" stroke-width="2"></path>
- <path d="M55 181 L156 151 L282 135 L402 103 L514 155 L662 162 M94 317 L344 237 L482 260 L698 287" fill="none" opacity=".85" stroke="#d7ae57" stroke-dasharray="6 7" stroke-width="1.4"></path>
- <path d="M631 261 Q671 268 698 287 M619 315 Q648 325 657 334 M610 365 Q642 368 668 378" fill="none" opacity=".85" stroke="#e7b968" stroke-width="2"></path>
- </svg>
- <div class="absolute right-4 top-3 grid h-12 w-12 place-items-center rounded-full border border-[#bf8749] bg-[#351a18]/85 text-center text-[9px] text-[#f3d88e]"><span class="absolute top-1">N</span><iconify-icon class="text-[#dc704e]" icon="solar:navigation-arrow-up-linear" width="28"></iconify-icon></div>
- <div class="absolute left-[26%] top-[15%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">华安</div><div class="absolute left-[42%] top-[10%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">长泰</div><div class="absolute left-[52%] top-[27%] rounded bg-[#4a1e1a]/90 px-2 py-1 text-[10px] font-bold text-[#ffe0a0]">芗城·龙文</div><div class="absolute left-[66%] top-[34%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">龙海</div><div class="absolute left-[34%] top-[48%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">南靖</div><div class="absolute left-[51%] top-[53%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">平和</div><div class="absolute left-[70%] top-[57%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">漳浦</div><div class="absolute left-[28%] top-[73%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">云霄</div><div class="absolute left-[46%] top-[78%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">诏安</div><div class="absolute left-[66%] top-[76%] rounded bg-[#351817]/85 px-2 py-1 text-[10px] text-[#f4d695]">东山</div>
- <div class="absolute left-[48%] top-[31%] flex items-center gap-1"><i class="pulse-dot h-4 w-4 rounded-full border-2 border-[#ffe0a0] bg-[#d65c43] shadow-[0_0_12px_#d4513c]"></i><span class="rounded bg-[#321615]/90 px-1.5 py-0.5 text-[9px] text-[#ffe0a0]">漳州古城</span></div>
- <div class="absolute left-[37%] top-[50%] flex items-center gap-1"><i class="h-3.5 w-3.5 rotate-45 border border-[#ffe0a0] bg-[#c9884a] shadow-[0_0_8px_#c9884a]"></i><span class="rounded bg-[#321615]/90 px-1.5 py-0.5 text-[9px] text-[#f5d987]">南靖土楼</span></div>
- <div class="absolute left-[59%] top-[48%] flex items-center gap-1"><i class="h-3.5 w-3.5 rounded-sm border border-[#ffd1aa] bg-[#bd624b]"></i><span class="rounded bg-[#321615]/90 px-1.5 py-0.5 text-[9px] text-[#f1b78e]">剪瓷雕</span></div>
- <div class="absolute left-[70%] top-[61%] flex items-center gap-1"><i class="h-3.5 w-3.5 rounded-full border border-[#ffe6ae] bg-[#d6a74e]"></i><span class="rounded bg-[#321615]/90 px-1.5 py-0.5 text-[9px] text-[#f4d695]">赵家堡</span></div>
- <div class="absolute left-[45%] top-[70%] flex items-center gap-1"><i class="h-3.5 w-3.5 rotate-45 border border-[#ffd1aa] bg-[#e1825d]"></i><span class="rounded bg-[#321615]/90 px-1.5 py-0.5 text-[9px] text-[#f2bd98]">闽南传承所</span></div>
- <div class="absolute left-[63%] top-[77%] flex items-center gap-1"><i class="h-3.5 w-3.5 rounded-sm border border-[#ffd1aa] bg-[#bd624b]"></i><span class="rounded bg-[#321615]/90 px-1.5 py-0.5 text-[9px] text-[#f1b78e]">东山关帝庙</span></div>
- </div>
- <div class="absolute bottom-3 left-4 flex items-center gap-4 text-[10px] text-[#dfc1a9]"><span><i class="mr-1 inline-block h-2.5 w-2.5 rounded-full border border-[#ffe0a0] bg-[#d65c43]"></i>文物</span><span><i class="mr-1 inline-block h-2.5 w-2.5 rounded-sm border border-[#ffd1aa] bg-[#bd624b]"></i>非遗项目</span><span><i class="mr-1 inline-block h-2.5 w-2.5 rotate-45 border border-[#ffe0a0] bg-[#c9884a]"></i>传统村落</span><span><i class="mr-1 inline-block h-2.5 w-2.5 rotate-45 border border-[#ffd1aa] bg-[#e1825c]"></i>传承所</span><span class="text-[#b98d74]">数据更新:2026-08-11 17:20</span></div>
- </section>
- <aside class="flex min-h-0 flex-col gap-3"><article class="rounded-sm border border-[#7f4034] bg-[#351817]/75 p-3"><div class="flex items-center justify-between border-b border-[#7f4034]/70 pb-2"><h2 class="font-bold text-[#f5df9e]">数字档案点位</h2><span class="flex items-center gap-1 text-[10px] text-[#e28a60]"><i class="pulse-dot h-1.5 w-1.5 rounded-full bg-[#cf684c]"></i>监测中</span></div><div class="mt-3 flex gap-3"><button aria-label="查看漳州古城影像缩略图" class="group relative h-20 w-28 shrink-0 overflow-hidden rounded border border-[#b99857] bg-[#6d4d2b] text-left transition hover:border-[#e1b65b] hover:shadow-[0_0_14px_rgba(225,182,91,.28)]" title="查看漳州古城影像" type="button"><img alt="Zhangzhou ancient city red brick arcade at dusk" class="h-full w-full object-cover opacity-70 transition duration-300 group-hover:scale-105 group-hover:opacity-90" src="https://modao.cc/agent-py/media/generated_images/2026-08-12/6c0f118cb21a4564ae26d81eb2a2dcf0.jpg"/><span class="absolute inset-0 grid place-items-center bg-[#351817]/0 text-[10px] text-[#fff0bd] opacity-0 transition group-hover:bg-[#351817]/55 group-hover:opacity-100"><iconify-icon icon="solar:eye-linear" width="17"></iconify-icon></span><span class="absolute bottom-1 left-1 rounded bg-[#54351f]/90 px-1.5 py-0.5 text-[9px]">古城夜色</span></button><div><h3 class="font-bold text-[#f8e5ac]">漳州古城</h3><span class="text-[10px] text-[#e1b861]">核心区</span><p class="mt-1 text-[10px] leading-4 text-[#c19b87]">骑楼与红砖古厝交织,保留闽南生活肌理。</p></div></div><div class="mt-3 space-y-2 text-[11px] text-[#c6a18c]"><p class="flex justify-between border-b border-[#6a342d]/60 pb-1"><span>所在区域</span><b class="text-[#ebdfb8]">芗城区</b></p><p class="flex justify-between border-b border-[#6a342d]/60 pb-1"><span>资源类型</span><b class="text-[#ebdfb8]">历史文化街区</b></p><p class="flex justify-between border-b border-[#6a342d]/60 pb-1"><span>保护级别</span><b class="text-[#ebdfb8]">国家级历史文化街区</b></p></div><div class="mt-3 flex flex-wrap gap-1"><span class="rounded bg-[#71362e] px-2 py-1 text-[10px] text-[#f0b28a]">古城街区</span><span class="rounded bg-[#71362e] px-2 py-1 text-[10px] text-[#f0b28a]">传统聚落</span><span class="rounded bg-[#66502c] px-2 py-1 text-[10px] text-[#f0d37d]">历史建筑</span></div><div class="mt-3"><div class="mb-1 flex justify-between text-[10px]"><span>数字档案完整度</span><b class="text-[#f0a16d]">92%</b></div><div class="h-1.5 overflow-hidden rounded-full bg-[#5b2925]"><div class="h-full w-[92%] rounded-full bg-gradient-to-r from-[#c95b43] to-[#d7b254]"></div></div></div></article>
- <article class="min-h-0 flex-1 rounded-sm border border-[#7f4034] bg-[#351817]/75 p-3"><div class="flex items-center justify-between border-b border-[#7f4034]/70 pb-2"><h2 class="font-bold text-[#f5df9e]">最近更新动态</h2><span class="rounded border border-[#a85643] px-2 py-0.5 text-[10px] text-[#e28a60]">更多</span></div><div class="relative mt-3 space-y-4 border-l border-[#883f34] pl-4 text-[11px] text-[#d4b6a2]"><div><i class="absolute -left-1 mt-1 h-2 w-2 rounded-full bg-[#cf684c] ring-4 ring-[#351817]"></i><p>新增《水仙花雕刻技艺》影像资料</p><span class="text-[10px] text-[#bb8e79]">17:20 · 芗城档案馆</span></div><div><i class="absolute -left-1 mt-[62px] h-2 w-2 rounded-full bg-[#d9ae59] ring-4 ring-[#351817]"></i><p>完成漳州古城骑楼三维建模复核</p><span class="text-[10px] text-[#bb8e79]">14:46 · 古城保护中心</span></div><div><p>新建南靖土楼口述史音频 26 条</p><span class="text-[10px] text-[#bb8e79]">09:30 · 非遗中心</span></div></div><div class="mt-4 rounded border border-[#8f7341]/60 bg-[#6b4f2c]/20 p-2 text-[11px] text-[#dec78d]"><iconify-icon class="mr-1 align-middle" icon="solar:bell-bing-linear"></iconify-icon>本月完成 18 处传统建筑巡查</div></article></aside>
- </section>
- <section class="mt-4 grid grid-cols-[1.05fr_.95fr_1.1fr] gap-3">
- <article class="rounded-sm border border-[#7f4034] bg-[#351817]/75 p-4 shadow-[inset_0_0_22px_rgba(194,77,54,.12)]">
- <div class="flex items-center justify-between border-b border-[#7f4034]/70 pb-2"><div><h2 class="font-bold text-[#f5df9e]">工作机制</h2><p class="mt-1 text-[10px] tracking-widest text-[#c19b87]">建设管理 · 统筹保障</p></div><iconify-icon class="text-[#df925f]" icon="solar:clipboard-list-linear" width="21"></iconify-icon></div>
- <div class="mt-3 space-y-2.5"><div class="flex items-start gap-3 rounded border border-[#713b31] bg-[#2b1515]/70 p-2.5"><span class="grid h-8 w-8 shrink-0 place-items-center rounded border border-[#b97e48] bg-[#6a4329] text-[#f2d488]"><iconify-icon icon="solar:buildings-2-linear" width="18"></iconify-icon></span><div><h3 class="text-xs font-bold text-[#fae8b1]">机构建设</h3><p class="mt-1 text-[10px] leading-4 text-[#bf9986]">建立独立健全的国家级文化生态保护区建设管理机构。</p></div></div><div class="flex items-start gap-3 rounded border border-[#713b31] bg-[#2b1515]/70 p-2.5"><span class="grid h-8 w-8 shrink-0 place-items-center rounded border border-[#b9644a] bg-[#703129] text-[#f0b08a]"><iconify-icon icon="solar:calendar-mark-linear" width="18"></iconify-icon></span><div><h3 class="text-xs font-bold text-[#fae8b1]">统筹管理</h3><p class="mt-1 text-[10px] leading-4 text-[#bf9986]">将保护区建设纳入当地政府年度工作任务和考核评价体系。</p></div></div><div class="flex items-start gap-3 rounded border border-[#713b31] bg-[#2b1515]/70 p-2.5"><span class="grid h-8 w-8 shrink-0 place-items-center rounded border border-[#b97e48] bg-[#6a4329] text-[#f2d488]"><iconify-icon icon="solar:users-group-rounded-linear" width="18"></iconify-icon></span><div><h3 class="text-xs font-bold text-[#fae8b1]">专职人员</h3><p class="mt-1 text-[10px] leading-4 text-[#bf9986]">配备一定数量的专职工作人员,满足建设工作需求。</p></div></div></div>
- </article>
- <article class="rounded-sm border border-[#7f4034] bg-[#351817]/75 p-4 shadow-[inset_0_0_22px_rgba(194,77,54,.12)]">
- <div class="flex items-center justify-between border-b border-[#7f4034]/70 pb-2"><div><h2 class="font-bold text-[#f5df9e]">传承人梯队</h2><p class="mt-1 text-[10px] tracking-widest text-[#c19b87]">技艺传习与青年培养</p></div><iconify-icon class="text-[#df925f]" icon="solar:users-group-rounded-linear" width="21"></iconify-icon></div>
- <div class="mt-4 space-y-3 text-xs"><div><div class="mb-1 flex justify-between"><span>国家级代表性传承人</span><b class="text-[#f3d181]">18 位</b></div><div class="h-2 overflow-hidden rounded-full bg-[#582722]"><div class="h-full w-[82%] rounded-full bg-gradient-to-r from-[#b54a39] to-[#dfae52]"></div></div></div><div><div class="mb-1 flex justify-between"><span>省级代表性传承人</span><b class="text-[#f3d181]">76 位</b></div><div class="h-2 overflow-hidden rounded-full bg-[#582722]"><div class="h-full w-[68%] rounded-full bg-gradient-to-r from-[#b54a39] to-[#dfae52]"></div></div></div><div><div class="mb-1 flex justify-between"><span>市县级传承骨干</span><b class="text-[#f3d181]">192 位</b></div><div class="h-2 overflow-hidden rounded-full bg-[#582722]"><div class="h-full w-[91%] rounded-full bg-gradient-to-r from-[#b54a39] to-[#dfae52]"></div></div></div></div>
- <div class="mt-5 grid grid-cols-2 gap-2"><div class="rounded border border-[#744034] bg-[#291515]/70 p-3"><p class="text-[10px] text-[#ba947e]">青年学员入库</p><p class="mt-1 text-lg font-bold text-[#fae8b1]">1,684 <span class="text-[10px] font-normal">人</span></p><p class="text-[10px] text-[#e17a55]">环比增长 11.4%</p></div><div class="rounded border border-[#744034] bg-[#291515]/70 p-3"><p class="text-[10px] text-[#ba947e]">传习所常态课程</p><p class="mt-1 text-lg font-bold text-[#fae8b1]">42 <span class="text-[10px] font-normal">门</span></p><p class="text-[10px] text-[#d9b25b]">本周新增 3 门</p></div></div>
- </article>
- <article class="rounded-sm border border-[#7f4034] bg-[#351817]/75 p-4 shadow-[inset_0_0_22px_rgba(194,77,54,.12)]">
- <div class="flex items-center justify-between border-b border-[#7f4034]/70 pb-2"><div><h2 class="font-bold text-[#f5df9e]">本周巡查计划</h2><p class="mt-1 text-[10px] tracking-widest text-[#c19b87]">重点资源动态巡护</p></div><span class="flex items-center gap-1 text-[10px] text-[#e6a36f]"><i class="pulse-dot h-1.5 w-1.5 rounded-full bg-[#cf684c]"></i>12 项进行中</span></div>
- <div class="mt-3 space-y-2 text-xs"><div class="flex items-center gap-3 rounded border border-[#723b32] bg-[#2a1515]/70 p-2.5"><span class="grid h-8 w-8 place-items-center rounded border border-[#b97e48] bg-[#6a4329] text-[#f2d488]"><iconify-icon icon="solar:buildings-2-linear" width="18"></iconify-icon></span><div class="flex-1"><b>南靖土楼群汛期安全巡检</b><p class="mt-1 text-[10px] text-[#bd9681]">南靖县书洋镇 · 08:30—11:30</p></div><span class="text-[10px] text-[#e5b762]">今日</span></div><div class="flex items-center gap-3 rounded border border-[#723b32] bg-[#2a1515]/70 p-2.5"><span class="grid h-8 w-8 place-items-center rounded border border-[#b9644a] bg-[#703129] text-[#f0b08a]"><iconify-icon icon="solar:microphone-3-linear" width="18"></iconify-icon></span><div class="flex-1"><b>闽南传承所设备校准</b><p class="mt-1 text-[10px] text-[#bd9681]">诏安县梅岭镇 · 14:00—16:00</p></div><span class="text-[10px] text-[#e58b62]">明日</span></div><div class="flex items-center gap-3 rounded border border-[#723b32] bg-[#2a1515]/70 p-2.5"><span class="grid h-8 w-8 place-items-center rounded border border-[#b97e48] bg-[#6a4329] text-[#f2d488]"><iconify-icon icon="solar:camera-linear" width="18"></iconify-icon></span><div class="flex-1"><b>古城历史建筑影像补采</b><p class="mt-1 text-[10px] text-[#bd9681]">芗城区古城片区 · 09:00—17:00</p></div><span class="text-[10px] text-[#d8b15d]">周四</span></div></div>
- </article>
- </section>
- <footer class="mt-4 flex h-7 shrink-0 items-center justify-between border-t border-[#7f4034]/60 text-[10px] text-[#bb8e79]"><span>漳州市文化和旅游局 · 文化遗产保护中心</span><span>数据来源:市级文化资源数据库 · 实时汇聚</span><span id="clock">2026-08-19 10:10:41</span></footer>
- </div>
- </main>
- <script>
- const chartColors=['#bf604c','#d97652','#d7b254','#c8865b'];
- const chartData=[[3,4,6,5,7,8,11,10,15,17],[2,4,5,4,7,6,10,8,12,14],[3,5,7,6,9,10,14,12,16,18],[2,3,4,5,3,7,9,8,11,13]];
- chartData.forEach((data,i)=>{const el=document.getElementById('mini'+(i+1));const chart=echarts.init(el);chart.setOption({animationDuration:1600,grid:{left:0,right:0,top:1,bottom:0},xAxis:{show:false,type:'category',data:data.map((_,j)=>j)},yAxis:{show:false,type:'value'},series:[{type:'line',data,smooth:true,symbol:'none',lineStyle:{color:chartColors[i],width:2},areaStyle:{color:chartColors[i],opacity:.15}}]});window.addEventListener('resize',()=>chart.resize());});
- function updateClock(){const d=new Date();document.getElementById('clock').textContent=d.getFullYear()+'-'+String(d.getMonth()+1).padStart(2,'0')+'-'+String(d.getDate()).padStart(2,'0')+' '+String(d.getHours()).padStart(2,'0')+':'+String(d.getMinutes()).padStart(2,'0')+':'+String(d.getSeconds()).padStart(2,'0');} setInterval(updateClock,1000);
- </script>
- </body></html>
|