사용자 매뉴얼·번호알기·gov-portal 대시보드와 메뉴 동선·수불 리포트를 보강한다.

- 사용자 매뉴얼: league/commonmark 기반 bag/manual(로그인 전용),
  ManualRenderer + Config\Manual manifest, 콘텐츠 8종, E2E
- 번호알기(봉투번호확인): bag/number-lookup, BagNumberLookup, E2E
- gov-portal 대시보드 시안(기본/strip)·기본코드관리 화면
- 메뉴 관리: 등록·수정 후 메뉴 화면 유지, 수정 버튼 클릭 시 상단 스크롤
- 수불/분석 리포트(LOT 수불·반품/파기·수급계획·추이) 표시 보강
- .gitignore: docs/ → /docs/ 앵커링(최상위 개발문서만 제외, app/Docs는 추적)

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
taekyoungc
2026-06-08 00:46:51 +09:00
parent 0f1d414f37
commit 8763876f19
77 changed files with 6139 additions and 182 deletions

View File

@@ -0,0 +1,15 @@
<?php
declare(strict_types=1);
/**
* 포털 헤더 브랜드 — components/header_brand 와 동일 SVG·문구
*
* @var string $brandHref
*/
$brandHref = $brandHref ?? base_url('dashboard/gov-portal');
?>
<a href="<?= esc($brandHref) ?>" class="gov-portal-brand">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" focusable="false">
<path fill="currentColor" d="M9 3a1 1 0 00-1 1v1H5.75a.75.75 0 000 1.5h12.5a.75.75 0 000-1.5H16V4a1 1 0 00-1-1H9zm9 4H6v11a2 2 0 002 2h8a2 2 0 002-2V7zM10 9a.75.75 0 01.75.75v6a.75.75 0 01-1.5 0v-6A.75.75 0 0110 9zm4 0a.75.75 0 01.75.75v6a.75.75 0 01-1.5 0v-6A.75.75 0 0114 9z"/>
</svg>
<span>종량제 시스템</span>
</a>

View File

@@ -0,0 +1,13 @@
.gov-portal-brand {
display: flex;
align-items: center;
gap: 0.4rem;
font-size: 0.9375rem;
font-weight: 700;
letter-spacing: -0.03em;
color: #fff;
text-decoration: none;
white-space: nowrap;
}
.gov-portal-brand:hover { color: #fff; opacity: 0.92; }
.gov-portal-brand svg { width: 24px; height: 24px; flex-shrink: 0; opacity: 0.95; }

View File

@@ -0,0 +1,15 @@
<script>
(function () {
var scale = 1;
var label = document.getElementById('fontZoomLabel');
var root = document.documentElement;
function applyScale() {
root.style.setProperty('--font-scale', String(scale));
if (label) label.textContent = Math.round(scale * 100) + '%';
}
var btnSm = document.getElementById('fontSmaller');
var btnLg = document.getElementById('fontLarger');
if (btnSm) btnSm.addEventListener('click', function () { scale = Math.max(0.85, scale - 0.05); applyScale(); });
if (btnLg) btnLg.addEventListener('click', function () { scale = Math.min(1.2, scale + 0.05); applyScale(); });
})();
</script>

View File

@@ -0,0 +1,3 @@
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>종량제 시스템</title>

View File

@@ -0,0 +1,24 @@
<?php
declare(strict_types=1);
/** @var string $activeVariant */
/** @var array $portalVariants */
/** @var string $mbName */
/** @var string $levelName */
/** @var string $lgLabel */
/** @var bool $showFontZoom */
$showFontZoom = $showFontZoom ?? true;
?>
<div class="portal-header-utils">
<?= view('home/_dashboard_gov_portal_variant_nav', ['portalVariants' => $portalVariants, 'activeVariant' => $activeVariant]) ?>
<span class="user-line"><?= esc($mbName) ?> · <?= esc($levelName) ?> · <?= esc($lgLabel) ?></span>
<?php if ($showFontZoom): ?>
<button type="button" class="extend-btn" onclick="alert('세션 연장(목업)')">시간연장</button>
<div class="font-zoom" title="글자 크기">
<button type="button" id="fontSmaller" aria-label="글자 작게"></button>
<span id="fontZoomLabel">100%</span>
<button type="button" id="fontLarger" aria-label="글자 크게">+</button>
</div>
<?php endif; ?>
<a href="<?= base_url('dashboard/simple') ?>" class="util-ico" title="기존 요약"><i class="fa-solid fa-table-columns"></i></a>
<a href="<?= base_url('logout') ?>" class="util-ico" title="로그아웃"><i class="fa-solid fa-right-from-bracket"></i></a>
</div>

View File

@@ -0,0 +1,71 @@
.portal-map-wrap {
position: relative;
width: 100%;
min-height: 200px;
background: #e8eef4;
}
.portal-map-wrap.is-fill { height: 100%; min-height: 220px; }
.portal-map-leaflet {
width: 100%;
height: 100%;
min-height: inherit;
z-index: 1;
}
.portal-map-wrap .leaflet-control-attribution {
font-size: 0.5625rem;
line-height: 1.2;
background: rgba(255, 255, 255, 0.85);
}
.portal-map-legend {
position: absolute;
left: 0.5rem;
bottom: 0.5rem;
z-index: 500;
display: flex;
flex-wrap: wrap;
gap: 0.25rem;
padding: 0.3rem 0.45rem;
background: rgba(255, 255, 255, 0.92);
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 6px;
font-size: 0.5625rem;
font-weight: 600;
color: #444;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
pointer-events: none;
}
.portal-map-legend span::before {
content: '';
display: inline-block;
width: 7px;
height: 7px;
border-radius: 50%;
margin-right: 0.2rem;
vertical-align: middle;
}
.portal-map-legend .lg-warehouse::before { background: #2563eb; }
.portal-map-legend .lg-shop::before { background: #10b981; }
.portal-map-legend .lg-flow::before { background: #f59e0b; }
.portal-map-lg-badge {
position: absolute;
top: 0.5rem;
left: 0.5rem;
z-index: 500;
background: rgba(255, 255, 255, 0.94);
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 6px;
padding: 0.35rem 0.55rem;
font-size: 0.6875rem;
font-weight: 700;
color: #1a2b4b;
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
pointer-events: none;
max-width: calc(100% - 1rem);
}
.portal-map-lg-badge small {
display: block;
font-size: 0.5625rem;
font-weight: 500;
color: #666;
margin-top: 0.1rem;
}

View File

@@ -0,0 +1,2 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/leaflet.min.css" crossorigin="anonymous" referrerpolicy="no-referrer"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/leaflet.min.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

View File

@@ -0,0 +1,117 @@
<?php
declare(strict_types=1);
/**
* OpenStreetMap(Leaflet) 목업 지도 — 지정판매소·창고·수불 지점 대략 표시
*
* @var string $lgLabel
* @var string $mapId
* @var string $mapHeight
* @var bool $mapFill
* @var array{centerLat:float,centerLng:float,zoom:int,markers:list<array>} $govMapPanel
*/
$mapId = $mapId ?? 'govPortalMap';
$mapHeight = $mapHeight ?? '200px';
$mapFill = $mapFill ?? false;
$govMapPanel = $govMapPanel ?? [
'centerLat' => 35.8714,
'centerLng' => 128.6014,
'zoom' => 11,
'markers' => [],
];
$wrapClass = 'portal-map-wrap' . ($mapFill ? ' is-fill' : '');
$wrapStyle = $mapFill ? '' : 'height:' . esc($mapHeight, 'attr') . ';';
?>
<div class="<?= esc($wrapClass, 'attr') ?>" id="<?= esc($mapId, 'attr') ?>-wrap"<?= $wrapStyle !== '' ? ' style="' . $wrapStyle . '"' : '' ?>>
<div class="portal-map-lg-badge">
<?= esc($lgLabel) ?>
<small>지정판매소·창고 (목업)</small>
</div>
<div id="<?= esc($mapId, 'attr') ?>" class="portal-map-leaflet" role="application" aria-label="<?= esc($lgLabel) ?> 판매·수불 지도"></div>
<div class="portal-map-legend" aria-hidden="true">
<span class="lg-warehouse">창고</span>
<span class="lg-shop">판매소</span>
<span class="lg-flow">수불</span>
</div>
</div>
<script>
(function () {
var mapId = <?= json_encode($mapId, JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_QUOT) ?>;
var cfg = <?= json_encode($govMapPanel, JSON_UNESCAPED_UNICODE | JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS) ?>;
var lgLabel = <?= json_encode($lgLabel, JSON_UNESCAPED_UNICODE | JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS) ?>;
function markerStyle(kind) {
if (kind === 'warehouse') return { color: '#2563eb', fill: '#3b82f6' };
if (kind === 'shop') return { color: '#059669', fill: '#10b981' };
return { color: '#d97706', fill: '#f59e0b' };
}
function initMap() {
var el = document.getElementById(mapId);
if (!el || typeof L === 'undefined') return;
if (el._govPortalMap) {
el._govPortalMap.remove();
el._govPortalMap = null;
}
var map = L.map(el, {
zoomControl: true,
scrollWheelZoom: false,
attributionControl: true,
}).setView([cfg.centerLat, cfg.centerLng], cfg.zoom || 11);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OSM</a>',
}).addTo(map);
(cfg.markers || []).forEach(function (m) {
var st = markerStyle(m.kind || 'flow');
var circle = L.circleMarker([m.lat, m.lng], {
radius: 7,
color: st.color,
fillColor: st.fill,
fillOpacity: 0.85,
weight: 2,
}).addTo(map);
if (m.title) {
circle.bindPopup('<strong>' + m.title + '</strong>');
}
});
L.circleMarker([cfg.centerLat, cfg.centerLng], {
radius: 9,
color: '#1a2b4b',
fillColor: '#4a69bd',
fillOpacity: 0.9,
weight: 2,
}).addTo(map).bindPopup('<strong>' + lgLabel + '</strong><br>담당 지자체');
var bounds = [];
(cfg.markers || []).forEach(function (m) { bounds.push([m.lat, m.lng]); });
if (bounds.length > 1) {
map.fitBounds(bounds, { padding: [28, 28], maxZoom: 13 });
}
el._govPortalMap = map;
setTimeout(function () { map.invalidateSize(); }, 120);
}
function boot() {
if (typeof L !== 'undefined') {
initMap();
return;
}
var el = document.getElementById(mapId);
if (el) {
el.innerHTML = '<div style="padding:1rem;text-align:center;font-size:12px;color:#666;">지도를 불러오지 못했습니다. 네트워크 연결을 확인해 주세요.</div>';
}
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', boot);
} else {
boot();
}
})();
</script>

View File

@@ -0,0 +1,43 @@
<?php
declare(strict_types=1);
/**
* 메뉴검색 + 하단 바로가기 칩
*
* @var string $variant teal|inline
* @var string $inputId
* @var list<array{label:string,url:string,keyword:string}> $menuSearchOptions
*/
$variant = $variant ?? 'teal';
$inputId = $inputId ?? 'menuSearch';
$menuSearchOptions = $menuSearchOptions ?? [];
?>
<?php if ($variant === 'inline'): ?>
<div class="search-inline portal-menu-search-block">
<div class="search-inline-row">
<label for="<?= esc($inputId, 'attr') ?>"><i class="fa-solid fa-magnifying-glass"></i> 메뉴검색</label>
<input type="search" id="<?= esc($inputId, 'attr') ?>" placeholder="메뉴명 (예: 재고, 발주)" autocomplete="off"/>
</div>
<?php if ($menuSearchOptions !== []): ?>
<div class="portal-menu-search-options" aria-label="자주 찾는 메뉴">
<?php foreach ($menuSearchOptions as $opt): ?>
<a href="#" class="menu-search-chip" data-url="<?= esc($opt['url'], 'attr') ?>" data-keyword="<?= esc($opt['keyword'], 'attr') ?>" title="<?= esc($opt['label']) ?>"><?= esc($opt['label']) ?></a>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
<?php else: ?>
<div class="search-teal portal-menu-search-block">
<strong><i class="fa-solid fa-magnifying-glass"></i> 메뉴검색</strong>
<div class="search-wrap">
<input type="search" id="<?= esc($inputId, 'attr') ?>" placeholder="메뉴명 입력 (예: 재고, 발주, 통계)" autocomplete="off"/>
<i class="fa-solid fa-magnifying-glass"></i>
</div>
<?php if ($menuSearchOptions !== []): ?>
<div class="portal-menu-search-options" aria-label="자주 찾는 메뉴">
<?php foreach ($menuSearchOptions as $opt): ?>
<a href="#" class="menu-search-chip" data-url="<?= esc($opt['url'], 'attr') ?>" data-keyword="<?= esc($opt['keyword'], 'attr') ?>" title="<?= esc($opt['label']) ?>"><?= esc($opt['label']) ?></a>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
<?php endif; ?>

View File

@@ -0,0 +1,48 @@
.portal-menu-search-options {
display: flex;
flex-wrap: wrap;
gap: 0.35rem;
margin-top: 0.5rem;
}
.menu-search-chip {
display: inline-flex;
align-items: center;
max-width: 100%;
padding: 0.22rem 0.5rem;
border-radius: 999px;
font-size: 0.625rem;
font-weight: 600;
line-height: 1.25;
letter-spacing: -0.02em;
text-decoration: none;
cursor: pointer;
border: 1px solid transparent;
transition: background 0.15s, color 0.15s, border-color 0.15s;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.search-teal .menu-search-chip,
.search-inline .menu-search-chip {
background: rgba(255, 255, 255, 0.22);
color: #fff;
border-color: rgba(255, 255, 255, 0.35);
}
.search-teal .menu-search-chip:hover,
.search-inline .menu-search-chip:hover {
background: #fff;
color: #00796b;
border-color: #fff;
}
.search-inline.portal-menu-search-block {
flex-direction: column;
align-items: stretch;
}
.search-inline.portal-menu-search-block .search-inline-row {
display: flex;
gap: 0.5rem;
align-items: center;
}
.search-inline.portal-menu-search-block input {
margin-top: 0;
}

View File

@@ -0,0 +1,118 @@
<script>
(function () {
var navData = <?= $govNavJson ?? '[]' ?>;
var activeIdx = <?= (int) ($govActiveParentIdx ?? 0) ?>;
var activeChildHref = <?= json_encode(strtolower(ltrim((string) ($govActiveChildHref ?? ''), '/')), JSON_UNESCAPED_UNICODE) ?>;
var listEl = document.getElementById('portalSidebarList');
var titleEl = document.getElementById('portalSidebarTitle');
if (listEl && navData.length) {
function renderSidebar(idx) {
var parent = navData[idx];
if (!parent) return;
if (titleEl) titleEl.textContent = parent.name || 'MY MENU';
listEl.innerHTML = '';
var items = parent.children && parent.children.length ? parent.children : null;
if (!items && parent.href) {
items = [{ name: parent.name, url: parent.url, href: parent.href }];
}
if (!items || !items.length) {
var empty = document.createElement('li');
empty.innerHTML = '<span class="menu-sub" style="opacity:.65;">하위 메뉴 없음</span>';
listEl.appendChild(empty);
return;
}
items.forEach(function (child, ci) {
var li = document.createElement('li');
var chHref = (child.href || '').toLowerCase().replace(/^\//, '');
var on = activeChildHref ? (chHref === activeChildHref) : (ci === 0);
if (child.href) {
li.innerHTML = '<a href="' + child.url + '" class="' + (on ? 'active' : '') + '">' +
'<span class="menu-ico">' + (on ? '×' : '+') + '</span>' + child.name + '</a>';
} else {
li.innerHTML = '<span class="menu-sub" style="opacity:.65;"><span class="menu-ico">+</span>' + child.name + '</span>';
}
listEl.appendChild(li);
});
}
function setActiveTrigger(idx) {
document.querySelectorAll('.portal-nav-trigger, .portal-nav-link[data-parent-idx]').forEach(function (el) {
var n = parseInt(el.getAttribute('data-parent-idx'), 10);
var on = n === idx;
el.classList.toggle('is-active', on);
if (el.classList.contains('portal-nav-trigger')) {
el.setAttribute('aria-expanded', on ? 'true' : 'false');
}
});
}
document.querySelectorAll('.portal-nav-trigger[data-parent-idx]').forEach(function (btn) {
btn.addEventListener('click', function (e) {
e.preventDefault();
var idx = parseInt(btn.getAttribute('data-parent-idx'), 10);
setActiveTrigger(idx);
renderSidebar(idx);
});
});
setActiveTrigger(activeIdx);
renderSidebar(activeIdx);
}
var searchInput = document.getElementById('menuSearch') || document.getElementById('menuSearchStrip');
function runMenuSearch(q) {
if (!q || !navData.length) return false;
q = q.toLowerCase();
for (var p = 0; p < navData.length; p++) {
var par = navData[p];
if ((par.name || '').toLowerCase().indexOf(q) !== -1) {
if (listEl) {
document.querySelectorAll('.portal-nav-trigger[data-parent-idx]').forEach(function (btn) {
if (parseInt(btn.getAttribute('data-parent-idx'), 10) === p) btn.click();
});
}
return true;
}
var ch = par.children || [];
for (var i = 0; i < ch.length; i++) {
if ((ch[i].name || '').toLowerCase().indexOf(q) !== -1 && ch[i].url) {
window.location.href = ch[i].url;
return true;
}
}
}
return false;
}
if (searchInput && navData.length) {
searchInput.addEventListener('keydown', function (e) {
if (e.key !== 'Enter') return;
var q = (searchInput.value || '').trim();
if (!q) return;
if (!runMenuSearch(q)) {
alert('일치하는 메뉴가 없습니다.');
}
});
}
document.querySelectorAll('.menu-search-chip').forEach(function (chip) {
chip.addEventListener('click', function (e) {
e.preventDefault();
var url = chip.getAttribute('data-url') || '';
var kw = chip.getAttribute('data-keyword') || '';
if (url) {
window.location.href = url;
return;
}
if (searchInput && kw) {
searchInput.value = kw;
if (!runMenuSearch(kw)) {
alert('일치하는 메뉴가 없습니다.');
}
}
});
});
})();
</script>

View File

@@ -0,0 +1,10 @@
<?php
declare(strict_types=1);
/**
* @deprecated 데이터는 Home 컨트롤러의 gov_portal_dashboard_view_data()로 전달합니다.
* 하위 호환용: include 시 컨트롤러와 동일한 변수를 주입합니다.
*/
helper('admin');
foreach (gov_portal_dashboard_view_data($lgLabel ?? '북구', $activeVariant ?? 'base') as $k => $v) {
$$k = $v;
}

View File

@@ -0,0 +1,59 @@
<?php
declare(strict_types=1);
/** @var list<array> $govNavItems */
/** @var int $govActiveParentIdx */
/** @var string $govActiveChildHref */
$activeParent = $govNavItems[$govActiveParentIdx] ?? $govNavItems[0] ?? null;
$sidebarTitle = $activeParent['name'] ?? 'MY MENU';
$activeChildHref = strtolower(ltrim((string) ($govActiveChildHref ?? ''), '/'));
?>
<aside class="sidebar">
<div class="my-menu-hd" id="portalSidebarTitle"><?= esc($sidebarTitle) ?></div>
<ul class="my-menu-list" id="portalSidebarList">
<?php if ($activeParent !== null): ?>
<?php if (! empty($activeParent['hasChildren'])): ?>
<?php foreach ($activeParent['children'] as $ci => $child): ?>
<?php
$childHref = strtolower(ltrim((string) ($child['href'] ?? ''), '/'));
$isChildActive = $activeChildHref !== ''
? ($childHref === $activeChildHref)
: ($ci === 0);
?>
<li>
<?php if ($child['href'] !== ''): ?>
<a href="<?= esc($child['url']) ?>" class="<?= $isChildActive ? 'active' : '' ?>">
<span class="menu-ico"><?= $isChildActive ? '×' : '+' ?></span>
<?= esc($child['name']) ?>
</a>
<?php else: ?>
<span class="menu-sub" style="opacity:.65;cursor:default;">
<span class="menu-ico">+</span><?= esc($child['name']) ?>
</span>
<?php endif; ?>
</li>
<?php endforeach; ?>
<?php elseif ($activeParent['href'] !== ''): ?>
<li>
<a href="<?= esc($activeParent['url']) ?>" class="active">
<span class="menu-ico">×</span><?= esc($activeParent['name']) ?>
</a>
</li>
<?php endif; ?>
<?php endif; ?>
</ul>
<div class="sidebar-blocks">
<div class="sb-teal">
<i class="fa-solid fa-mobile-screen"></i>
모바일 앱(예정)<br/>지정판매소 판매·스캔 연동
</div>
<div class="sb-gray">
<i class="fa-solid fa-repeat"></i> 통합 전환<br/>
<a href="<?= base_url('admin/select-local-government') ?>" style="color:#fff;text-decoration:underline;">지자체 선택</a>
</div>
<div class="sb-links">
<a href="<?= base_url('bag/help') ?>">나의 할일</a>
<a href="<?= base_url('dashboard') ?>">종합·그래프</a>
<a href="<?= base_url('bag/help') ?>">FAQ</a>
</div>
</div>
</aside>

View File

@@ -0,0 +1,23 @@
<?php
declare(strict_types=1);
/**
* 재고 경보 4단계 + 단계별 봉투 종류(대략)
*
* @var list<array{count:int,label:string,class:string,bags:list<string>}> $stockAlerts
*/
?>
<div class="alert-levels">
<?php foreach ($stockAlerts as $alert): ?>
<div class="alert-box <?= esc($alert['class'], 'attr') ?>">
<div class="n"><?= (int) $alert['count'] ?></div>
<div class="t"><?= esc($alert['label']) ?></div>
<?php if (! empty($alert['bags'])): ?>
<ul class="alert-bags" aria-label="<?= esc($alert['label']) ?> 봉투 종류">
<?php foreach ($alert['bags'] as $bagName): ?>
<li><?= esc($bagName) ?></li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
</div>
<?php endforeach; ?>
</div>

View File

@@ -0,0 +1,157 @@
.alert-levels {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0.5rem;
}
.alert-box {
text-align: center;
padding: 0.5rem 0.2rem 0.4375rem;
border-radius: 4px;
color: #fff;
font-weight: 700;
}
.alert-box .n { font-size: 1.25rem; line-height: 1.1; letter-spacing: -0.03em; }
.alert-box .t {
font-size: 0.6875rem;
font-weight: 500;
margin-top: 0.125rem;
letter-spacing: -0.02em;
}
.alert-box .alert-bags {
list-style: none;
margin: 0.35rem 0 0;
padding: 0;
width: 100%;
font-size: 0.5625rem;
font-weight: 500;
line-height: 1.3;
letter-spacing: -0.02em;
opacity: 0.92;
text-align: center;
}
.alert-box .alert-bags li {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 0.05rem 0;
}
.al-yellow .alert-bags { color: #333; opacity: 1; }
.al-blue { background: #3498db; }
.al-yellow { background: #f1c40f; color: #333; }
.al-yellow .n, .al-yellow .t { color: #333; }
.al-orange { background: #f39c12; }
.al-red { background: #e74c3c; }
.bar-row { margin-bottom: 0.4375rem; }
.bar-row .meta {
display: flex;
justify-content: space-between;
font-size: 0.6875rem;
color: var(--muted);
margin-bottom: 0.15rem;
letter-spacing: -0.02em;
}
.bar-track {
height: 7px;
background: #f1f5f9;
border-radius: 4px;
overflow: hidden;
}
.bar-fill { height: 100%; background: #f59e0b; border-radius: 4px; }
.card-low-stock {
display: flex;
flex-direction: column;
min-height: 100%;
}
.card-low-stock .card-bd {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
.card-low-stock .low-stock-grid {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-evenly;
gap: 0.75rem;
min-height: 9.5rem;
}
.grid .card-low-stock.stock-tall .low-stock-grid {
min-height: 100%;
gap: 1rem;
}
.card-low-stock .bar-row {
flex: 1 1 0;
display: flex;
flex-direction: column;
justify-content: center;
margin-bottom: 0;
min-height: 2.75rem;
}
.grid .card-low-stock.stock-tall .bar-row {
min-height: 3.25rem;
flex: 1 1 auto;
}
.card-low-stock .bar-row .meta { margin-bottom: 0.3rem; }
.grid .card-low-stock.stock-tall .bar-row .meta {
margin-bottom: 0.45rem;
font-size: 0.75rem;
}
.card-low-stock .bar-track {
flex: 1 1 auto;
height: auto;
min-height: 12px;
max-height: 2.25rem;
border-radius: 6px;
}
.grid .card-low-stock.stock-tall .bar-track {
min-height: 16px;
max-height: 3.25rem;
}
.card-low-stock .bar-fill { border-radius: 6px; }
.stock-pair.grid2 {
align-items: stretch;
}
.stock-pair.grid2 .card {
display: flex;
flex-direction: column;
min-height: 100%;
}
.stock-pair.grid2 .card-stock-alert .card-bd {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
.stock-pair.grid2 .card-stock-alert .alert-levels {
flex: 1;
align-items: stretch;
min-height: 9.5rem;
}
.stock-pair.grid2 .card-stock-alert .alert-box {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100%;
min-height: 100%;
padding: 0.625rem 0.3rem;
box-sizing: border-box;
border-radius: 6px;
}
.stock-pair.grid2 .card-stock-alert .alert-box .n {
font-size: 1.35rem;
}
.stock-pair.grid2 .card-stock-alert .alert-box .alert-bags {
font-size: 0.625rem;
margin-top: 0.45rem;
flex: 1;
display: flex;
flex-direction: column;
justify-content: flex-end;
gap: 0.12rem;
}
.stock-pair.grid2 .card-stock-alert .alert-box .alert-bags li {
white-space: normal;
line-height: 1.25;
}

View File

@@ -0,0 +1,23 @@
<?php
declare(strict_types=1);
/** @var list<array{name:string,percent:int}> $lowStock */
?>
<div class="card card-stock-alert">
<div class="card-hd"><span><i class="fa-solid fa-triangle-exclamation"></i> 재고 경보</span></div>
<div class="card-bd">
<?= view('home/_dashboard_gov_portal_stock_alert_levels', ['stockAlerts' => $stockAlerts]) ?>
</div>
</div>
<div class="card card-low-stock">
<div class="card-hd"><span><i class="fa-solid fa-box-open"></i> 부족 재고</span></div>
<div class="card-bd">
<div class="low-stock-grid">
<?php foreach ($lowStock as $item): ?>
<div class="bar-row">
<div class="meta"><span><?= esc($item['name']) ?></span><span><?= esc((string) $item['percent']) ?>%</span></div>
<div class="bar-track"><div class="bar-fill" style="width:<?= (int) $item['percent'] ?>%"></div></div>
</div>
<?php endforeach; ?>
</div>
</div>
</div>

View File

@@ -0,0 +1,89 @@
<?php
declare(strict_types=1);
/** gov-portal-strip 메인 대시보드 본문 */
?>
<div class="kpi-strip">
<div class="kpi-card">
<div class="ico"><i class="fa-solid fa-boxes-stacked"></i></div>
<div><div class="n ok">양호</div><div class="l">봉투 재고 상태</div></div>
</div>
<div class="kpi-card">
<div class="ico"><i class="fa-solid fa-inbox"></i></div>
<div><div class="n">12</div><div class="l">미처리 구매신청</div></div>
</div>
<div class="kpi-card">
<div class="ico"><i class="fa-solid fa-user-check"></i></div>
<div><div class="n">4</div><div class="l">승인 대기</div></div>
</div>
<div class="kpi-card">
<div class="ico"><i class="fa-solid fa-location-dot"></i></div>
<div><div class="n" style="font-size:.95rem;color:var(--text-dark);"><?= esc($lgLabel) ?></div><div class="l">담당 지자체</div></div>
</div>
</div>
<section class="hero">
<div class="hero-hd">
<span><i class="fa-solid fa-map"></i> GIS 통합 현황판</span>
<a href="<?= base_url('bag/flow') ?>">수불 조회 &gt;</a>
</div>
<div class="hero-body">
<div class="hero-map">
<?= view('home/_dashboard_gov_portal_map_panel', [
'mapId' => 'govPortalStripMap',
'mapFill' => true,
'lgLabel' => $lgLabel,
'govMapPanel' => $govMapPanel,
]) ?>
</div>
<div class="hero-tl">
<?php foreach ($timeline as $ev): ?>
<div class="item">
<span class="time"><?= esc($ev['time']) ?></span>
<span class="txt"><?= esc($ev['text']) ?></span>
</div>
<?php endforeach; ?>
</div>
</div>
</section>
<div class="grid2 stock-pair">
<?= view('home/_dashboard_gov_portal_stock_cards_pair', ['lowStock' => $lowStock, 'stockAlerts' => $stockAlerts]) ?>
</div>
<div class="grid2">
<div class="card">
<div class="card-hd"><i class="fa-regular fa-envelope"></i> 메시지</div>
<div class="card-bd">
<?php foreach ($notices as $n): ?>
<div class="notice-row">
<span class="notice-t"><?= esc($n['title']) ?></span>
<span class="notice-d"><?= esc($n['date']) ?></span>
</div>
<?php endforeach; ?>
<?= view('home/_dashboard_gov_portal_menu_search', [
'variant' => 'inline',
'inputId' => 'menuSearch',
'menuSearchOptions' => $menuSearchOptions,
]) ?>
</div>
</div>
<div class="card">
<div class="card-hd"><i class="fa-solid fa-chart-column"></i> 최근 7일 신청 · 바로가기</div>
<div class="card-bd">
<div class="bars">
<?php $maxReq = max($weeklyRequests); foreach ($weeklyRequests as $idx => $v): $h = (int) round(($v / $maxReq) * 100); ?>
<div class="col"><span><?= esc((string) $v) ?></span><div class="bar" style="height:<?= $h ?>%"></div><span>D<?= 6 - $idx ?></span></div>
<?php endforeach; ?>
</div>
<div class="quick-list" style="margin-top:.75rem;">
<?php foreach ($quickLinks as $link): ?>
<a href="<?= esc($link['url']) ?>">
<i class="fa-solid <?= esc($link['icon'], 'attr') ?>"></i>
<?= esc($link['label']) ?>
<span><?= esc($link['desc']) ?></span>
</a>
<?php endforeach; ?>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,81 @@
<?php
declare(strict_types=1);
/**
* gov-portal-strip 공통 페이지 셸 (상단 호버 메뉴 + 프로필 + 가로 MY MENU + 본문)
*
* @var string $stripInnerView 본문 partial 경로 (home/...)
* @var bool $stripIncludeWorkCss NDMS 작업화면 CSS 포함 여부
*/
helper('admin');
$govPortalNavPartial = gov_portal_nav_partial_vars(get_defined_vars());
$activeVariant = $activeVariant ?? 'strip';
$stripInnerView = (string) ($stripInnerView ?? '');
$stripIncludeWorkCss = ! empty($stripIncludeWorkCss);
$stripShowProfileLinks = ($stripShowProfileLinks ?? true) !== false;
?>
<!DOCTYPE html>
<html lang="ko">
<head>
<?= view('home/_dashboard_gov_portal_head') ?>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css"/>
<?php if (! $stripIncludeWorkCss): ?>
<?= view('home/_dashboard_gov_portal_map_leaflet_assets') ?>
<?php endif; ?>
<style>
<?php include __DIR__ . '/_dashboard_gov_portal_brand_css.php'; ?>
<?php include __DIR__ . '/_dashboard_gov_portal_topnav_css.php'; ?>
<?php include __DIR__ . '/_dashboard_gov_portal_strip_styles.php'; ?>
<?php if (! $stripIncludeWorkCss): ?>
<?php include __DIR__ . '/_dashboard_gov_portal_map_css.php'; ?>
<?php include __DIR__ . '/_dashboard_gov_portal_menu_search_css.php'; ?>
<?php include __DIR__ . '/_dashboard_gov_portal_stock_cards_css.php'; ?>
<?php endif; ?>
<?php if ($stripIncludeWorkCss): ?>
<?php include __DIR__ . '/_dashboard_gov_portal_workpage_css.php'; ?>
.page.strip-work-page .work-main { padding:0; background:transparent; }
<?php endif; ?>
</style>
</head>
<body>
<header class="portal-header">
<div class="portal-header-inner">
<?= view('home/_dashboard_gov_portal_brand', ['brandHref' => base_url('dashboard/gov-portal-strip')]) ?>
<?= view('home/_dashboard_gov_portal_topnav_hover', $govPortalNavPartial) ?>
<?= view('home/_dashboard_gov_portal_header_utils', [
'activeVariant' => $activeVariant,
'portalVariants' => $portalVariants,
'mbName' => $mbName,
'levelName' => $levelName,
'lgLabel' => $lgLabel,
]) ?>
</div>
</header>
<div class="page<?= $stripIncludeWorkCss ? ' strip-work-page' : '' ?>">
<div class="profile-inline">
<div>
<div class="name"><?= esc($mbName) ?>님, 환영합니다</div>
<div class="sub"><?= esc($lgLabel) ?> · <?= esc($levelName) ?> · 최근접속 <?= date('Y.m.d H:i') ?></div>
</div>
<?php if ($stripShowProfileLinks): ?>
<div style="display:flex;gap:.35rem;flex-wrap:wrap;">
<a href="<?= base_url('dashboard/simple') ?>">마이페이지</a>
<a href="<?= base_url('logout') ?>">로그아웃</a>
</div>
<?php endif; ?>
</div>
<?= view('home/_dashboard_gov_portal_strip_my_menu', $govPortalNavPartial) ?>
<?php if ($stripInnerView !== ''): ?>
<div class="<?= $stripIncludeWorkCss ? 'work-main' : 'strip-page-body' ?>">
<?= view($stripInnerView, get_defined_vars()) ?>
</div>
<?php endif; ?>
</div>
<?= view('home/_dashboard_gov_portal_nav_script_base', $govPortalNavPartial) ?>
<?= view('home/_dashboard_gov_portal_font_zoom_script') ?>
</body>
</html>

View File

@@ -0,0 +1,41 @@
<?php
declare(strict_types=1);
/**
* gov-portal-strip 가로 MY MENU (활성 대메뉴 하위 소메뉴 칩)
*
* @var list<array> $govNavItems
* @var int $govActiveParentIdx
* @var string $govActiveChildHref
*/
$activeParent = $govNavItems[$govActiveParentIdx] ?? $govNavItems[0] ?? null;
if ($activeParent === null) {
return;
}
$children = $activeParent['children'] ?? [];
if ($children === []) {
return;
}
$activeChildHref = strtolower(ltrim((string) ($govActiveChildHref ?? ''), '/'));
$sectionTitle = (string) ($activeParent['name'] ?? 'MY MENU');
?>
<nav class="strip-my-menu" aria-label="<?= esc($sectionTitle) ?> 하위 메뉴">
<span class="strip-my-menu-title">MY MENU · <?= esc($sectionTitle) ?></span>
<div class="strip-my-menu-chips">
<?php foreach ($children as $ci => $child): ?>
<?php if (($child['href'] ?? '') === ''): ?>
<span class="menu-sub" style="opacity:.55;font-size:.75rem;padding:.35rem .5rem;"><?= esc($child['name']) ?></span>
<?php else: ?>
<?php
$childHref = strtolower(ltrim((string) $child['href'], '/'));
$isActive = $activeChildHref !== ''
? ($childHref === $activeChildHref)
: ($ci === 0);
?>
<a href="<?= esc($child['url']) ?>" class="<?= $isActive ? 'active' : '' ?>">
<span class="menu-ico"><?= $isActive ? '×' : '+' ?></span>
<?= esc($child['name']) ?>
</a>
<?php endif; ?>
<?php endforeach; ?>
</div>
</nav>

View File

@@ -0,0 +1,67 @@
:root { --navy:#1a2b4b; --navy-deep:#002b4e; --blue:#007bff; --blue-menu:#4a69bd; --teal:#009688; --bg:#f0f4f8; --border:#dde4ec; --text:#444; --text-dark:#222; --muted:#888; --font-scale:1; }
* { box-sizing:border-box; margin:0; padding:0; }
html { font-size:calc(14px * var(--font-scale)); -webkit-text-size-adjust:100%; }
body { font-family:'Pretendard','Malgun Gothic','Noto Sans KR',sans-serif; font-size:.8125rem; font-weight:400; line-height:1.45; letter-spacing:-.02em; color:var(--text); background:var(--bg); min-height:100vh; -webkit-font-smoothing:antialiased; }
.page { padding:.875rem 1rem 1.25rem; max-width:1400px; margin:0 auto; }
.profile-inline { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; background:#4a5568; color:#fff; padding:1rem; border-radius:12px; margin-bottom:.875rem; }
.profile-inline .name { font-size:1rem; font-weight:700; }
.profile-inline .sub { font-size:.6875rem; opacity:.8; margin-top:.15rem; }
.profile-inline a { color:#fff; font-size:.75rem; font-weight:600; text-decoration:none; border:1px solid rgba(255,255,255,.4); padding:.3rem .55rem; border-radius:4px; }
.strip-my-menu {
display:flex; flex-wrap:wrap; align-items:center; gap:.35rem;
padding:.5rem .75rem; margin-bottom:.875rem;
background:#fff; border:1px solid var(--border); border-radius:10px;
box-shadow:0 1px 3px rgba(26,43,75,.05);
}
.strip-my-menu .strip-my-menu-title {
font-size:.6875rem; font-weight:700; color:var(--navy);
margin-right:.35rem; letter-spacing:.04em; white-space:nowrap;
}
.strip-my-menu .strip-my-menu-chips { display:flex; flex-wrap:wrap; gap:.35rem; flex:1; }
.strip-my-menu a {
display:inline-flex; align-items:center; gap:.25rem;
padding:.4rem .65rem; border-radius:10px;
background:var(--blue-menu); color:#fff; text-decoration:none;
font-size:.8125rem; font-weight:600;
border:1px solid rgba(255,255,255,.22);
}
.strip-my-menu a:hover { filter:brightness(1.06); }
.strip-my-menu a.active { background:#3d5a9e; border-color:rgba(255,255,255,.4); }
.strip-my-menu a .menu-ico { font-size:.625rem; width:.75rem; text-align:center; }
.kpi-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; margin-bottom:.875rem; }
@media(max-width:900px){.kpi-strip{grid-template-columns:repeat(2,1fr)}}
.kpi-card { background:#fff; border-radius:12px; border:1px solid var(--border); padding:.75rem 1rem; display:flex; align-items:center; gap:.75rem; box-shadow:0 1px 3px rgba(26,43,75,.05); }
.kpi-card .ico { width:40px; height:40px; border-radius:10px; background:#eef6ff; color:var(--blue); display:flex; align-items:center; justify-content:center; font-size:1rem; }
.kpi-card .n { font-size:1.35rem; font-weight:700; color:#2563eb; line-height:1.1; }
.kpi-card .n.ok { font-size:1.1rem; color:#10b981; }
.kpi-card .l { font-size:.6875rem; color:var(--muted); font-weight:600; margin-top:.1rem; }
.hero { background:#fff; border-radius:12px; border:1px solid var(--border); overflow:hidden; margin-bottom:.875rem; box-shadow:0 1px 3px rgba(26,43,75,.06); }
.hero-hd { display:flex; justify-content:space-between; align-items:center; padding:.6rem .875rem; border-bottom:1px solid var(--border); font-size:1rem; font-weight:700; color:var(--text-dark); }
.hero-hd a { font-size:.6875rem; font-weight:600; color:#fff; background:var(--blue); padding:.25rem .5rem; border-radius:3px; text-decoration:none; }
.hero-body { display:grid; grid-template-columns:1fr 200px; min-height:200px; }
@media(max-width:800px){.hero-body{grid-template-columns:1fr}}
.hero-map { position:relative; min-height:220px; overflow:hidden; }
.hero-tl { background:var(--navy-deep); color:#fff; padding:.4rem; overflow-y:auto; max-height:220px; }
.hero-tl .item { padding:.4rem .35rem; border-bottom:1px solid rgba(255,255,255,.1); font-size:.75rem; }
.hero-tl .time { font-weight:700; font-size:.8125rem; display:block; }
.hero-tl .txt { color:#4fc3f7; font-weight:600; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:.875rem; }
@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.card { background:#fff; border-radius:12px; border:1px solid var(--border); box-shadow:0 1px 3px rgba(26,43,75,.05); overflow:hidden; }
.card-hd { padding:.6rem .875rem; border-bottom:1px solid var(--border); font-weight:700; font-size:1rem; color:var(--text-dark); }
.card-hd i { color:var(--blue); margin-right:.3rem; }
.card-bd { padding:.875rem 1rem; }
.notice-t { font-size:.8125rem; font-weight:600; color:var(--text-dark); }
.notice-d { font-size:.6875rem; color:var(--blue); background:#eef6ff; padding:.1rem .35rem; border-radius:2px; font-weight:600; margin-left:.35rem; }
.notice-row { padding:.4rem 0; border-bottom:1px dashed #e8edf2; }
.bars { display:flex; align-items:flex-end; gap:4px; height:56px; }
.bars .col { flex:1; text-align:center; font-size:.625rem; color:var(--muted); font-weight:500; display:flex; flex-direction:column; justify-content:flex-end; gap:2px; }
.bars .bar { background:linear-gradient(180deg,#2563eb,#60a5fa); border-radius:3px 3px 0 0; min-height:4px; width:100%; }
.quick-list a { display:flex; align-items:center; gap:.5rem; padding:.4rem 0; text-decoration:none; color:var(--text); border-bottom:1px solid #f1f5f9; font-size:.8125rem; font-weight:600; }
.quick-list a:last-child { border-bottom:none; }
.quick-list a:hover { color:var(--blue); }
.quick-list span { font-size:.6875rem; font-weight:400; color:var(--muted); margin-left:auto; }
.search-inline { display:flex; gap:.5rem; background:var(--teal); padding:.65rem .75rem; border-radius:10px; color:#fff; align-items:center; margin-top:.5rem; }
.search-inline input { flex:1; border:none; border-radius:4px; padding:.4rem .5rem; font-size:.8125rem; font-family:inherit; }
.search-inline label { font-weight:700; font-size:.8125rem; white-space:nowrap; }
.stock-pair.grid2 { margin-bottom:.875rem; }

View File

@@ -0,0 +1,42 @@
<?php
declare(strict_types=1);
/**
* 대메뉴 클릭 → 좌측 MY MENU에 소메뉴 표시 (gov-portal 기본)
*
* @var list<array> $govNavItems
* @var int $govActiveParentIdx
* @var string $govCurrentPath
* @var list<string> $govDashboardAliases
*/
helper('admin');
?>
<nav class="portal-top-nav" id="portalTopNavClick" aria-label="대분류 메뉴">
<?php foreach ($govNavItems as $pIdx => $item): ?>
<?php
$isActive = ($pIdx === $govActiveParentIdx);
$hasChildren = ! empty($item['hasChildren']);
if ($hasChildren):
?>
<div class="portal-nav-item">
<button type="button"
class="portal-nav-trigger <?= $isActive ? 'is-active' : '' ?>"
data-parent-idx="<?= (int) $pIdx ?>"
aria-expanded="<?= $isActive ? 'true' : 'false' ?>">
<?= esc($item['name']) ?>
</button>
</div>
<?php elseif ($item['href'] !== ''): ?>
<div class="portal-nav-item">
<a href="<?= esc($item['url']) ?>"
class="portal-nav-link <?= $isActive ? 'is-active' : '' ?>"
data-parent-idx="<?= (int) $pIdx ?>">
<?= esc($item['name']) ?>
</a>
</div>
<?php else: ?>
<div class="portal-nav-item">
<span class="portal-nav-trigger" style="opacity:.5;cursor:default;"><?= esc($item['name']) ?></span>
</div>
<?php endif; ?>
<?php endforeach; ?>
</nav>

View File

@@ -0,0 +1,171 @@
/* 상단 메뉴바 — 기본·변형 동일 높이 */
.portal-header {
background: var(--navy);
color: #fff;
flex-shrink: 0;
}
.portal-header-inner {
display: flex;
align-items: stretch;
justify-content: space-between;
padding: 0 1rem;
min-height: 48px;
gap: 0.5rem;
flex-wrap: wrap;
}
.portal-top-nav {
display: flex;
flex-wrap: wrap;
align-items: stretch;
gap: 0 0.25rem;
min-height: 48px;
font-size: 0.875rem;
font-weight: 600;
}
.portal-nav-item {
display: flex;
align-items: stretch;
position: relative;
}
.portal-nav-link,
.portal-nav-trigger {
display: inline-flex;
align-items: center;
padding: 0 0.625rem;
min-height: 48px;
box-sizing: border-box;
color: rgba(255,255,255,.9);
text-decoration: none;
border: none;
border-bottom: 4px solid transparent;
background: transparent;
font: inherit;
letter-spacing: -0.02em;
cursor: pointer;
white-space: nowrap;
}
.portal-nav-link:hover,
.portal-nav-trigger:hover {
color: #fff;
font-weight: 700;
}
.portal-nav-link.is-active,
.portal-nav-trigger.is-active {
color: #fff;
font-weight: 700;
border-bottom-color: #fff;
}
.portal-nav-dropdown {
position: absolute;
left: 0;
top: 100%;
z-index: 300;
margin-top: -2px;
padding-top: 4px;
min-width: 12rem;
display: none;
}
.portal-nav-item:hover .portal-nav-dropdown,
.portal-nav-item:focus-within .portal-nav-dropdown {
display: block;
}
.portal-nav-dropdown-panel {
background: #fff;
border: 1px solid var(--border);
border-radius: 6px;
box-shadow: 0 6px 16px rgba(26,43,75,.12);
padding: 0.25rem 0;
}
.portal-nav-dropdown-panel a {
display: block;
padding: 0.45rem 0.75rem;
font-size: 0.8125rem;
font-weight: 600;
color: #334155;
text-decoration: none;
white-space: nowrap;
}
.portal-nav-dropdown-panel a:hover {
background: #eff6ff;
color: var(--blue-ui);
}
.portal-nav-dropdown-panel a.is-active {
background: #eff6ff;
color: var(--blue-ui);
font-weight: 700;
}
.portal-nav-dropdown-panel .no-link {
display: block;
padding: 0.45rem 0.75rem;
font-size: 0.8125rem;
color: #94a3b8;
cursor: default;
}
.portal-header-utils {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.75rem;
color: rgba(255,255,255,.92);
flex-wrap: wrap;
min-height: 48px;
}
.portal-header-utils .user-line {
max-width: 11rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.portal-header-utils .extend-btn {
background: var(--blue-ui);
border: none;
color: #fff;
padding: 0.25rem 0.5rem;
border-radius: 3px;
font-size: 0.6875rem;
font-weight: 600;
cursor: pointer;
}
.portal-header-utils .font-zoom {
display: inline-flex;
align-items: center;
gap: 0.2rem;
font-size: 0.6875rem;
border: 1px solid rgba(255,255,255,.25);
border-radius: 3px;
padding: 0.125rem 0.25rem;
background: rgba(0,0,0,.12);
}
.portal-header-utils .font-zoom button {
background: transparent;
border: none;
color: #fff;
width: 1.125rem;
height: 1.125rem;
cursor: pointer;
padding: 0;
}
.portal-header-utils .util-ico {
color: inherit;
text-decoration: none;
opacity: 0.88;
font-size: 0.875rem;
padding: 0.2rem;
}
.portal-header-utils .util-ico:hover { opacity: 1; color: #fff; }
.variant-nav {
display: inline-flex;
gap: 0.125rem;
padding: 0.125rem;
background: rgba(0,0,0,.15);
border-radius: 4px;
}
.variant-nav a {
font-size: 0.6875rem;
font-weight: 600;
padding: 0.2rem 0.45rem;
border-radius: 3px;
color: rgba(255,255,255,.78);
text-decoration: none;
}
.variant-nav a.on, .variant-nav a:hover { background: rgba(255,255,255,.18); color: #fff; }

View File

@@ -0,0 +1,59 @@
<?php
declare(strict_types=1);
/**
* 대메뉴 호버 시 소메뉴 드롭다운 (gov-portal-strip)
*
* @var list<array> $govNavItems
* @var int $govActiveParentIdx
* @var string $govCurrentPath
* @var list<string> $govDashboardAliases
*/
helper('admin');
?>
<nav class="portal-top-nav" aria-label="대분류 메뉴">
<?php foreach ($govNavItems as $pIdx => $item): ?>
<?php
$isActive = ($pIdx === $govActiveParentIdx);
$parentHref = $item['href'] ?? '';
$hasChildren = ! empty($item['hasChildren']);
$activeChild = null;
if ($hasChildren && ! empty($siteNavTree[$pIdx])) {
$activeChild = menu_active_child_for_parent($siteNavTree[$pIdx], $govCurrentPath, $govDashboardAliases);
}
?>
<div class="portal-nav-item">
<?php if ($hasChildren): ?>
<?php if ($parentHref !== ''): ?>
<a href="<?= esc($item['url']) ?>" class="portal-nav-link <?= $isActive ? 'is-active' : '' ?>">
<?= esc($item['name']) ?>
</a>
<?php else: ?>
<span class="portal-nav-trigger <?= $isActive ? 'is-active' : '' ?>" tabindex="0"><?= esc($item['name']) ?></span>
<?php endif; ?>
<div class="portal-nav-dropdown">
<div class="portal-nav-dropdown-panel">
<?php foreach ($item['children'] as $child): ?>
<?php if ($child['href'] !== ''): ?>
<?php
$childActive = $activeChild !== null
&& (int) ($activeChild->mm_idx ?? 0) === (int) ($child['idx'] ?? 0);
?>
<a href="<?= esc($child['url']) ?>" class="<?= $childActive ? 'is-active' : '' ?>">
<?= esc($child['name']) ?>
</a>
<?php else: ?>
<span class="no-link" title="메뉴 링크 미설정"><?= esc($child['name']) ?></span>
<?php endif; ?>
<?php endforeach; ?>
</div>
</div>
<?php elseif ($parentHref !== ''): ?>
<a href="<?= esc($item['url']) ?>" class="portal-nav-link <?= $isActive ? 'is-active' : '' ?>">
<?= esc($item['name']) ?>
</a>
<?php else: ?>
<span class="portal-nav-trigger" style="opacity:.5;"><?= esc($item['name']) ?></span>
<?php endif; ?>
</div>
<?php endforeach; ?>
</nav>

View File

@@ -0,0 +1,17 @@
<?php
declare(strict_types=1);
/** @var array<int, array{label: string, url: string}> $portalVariants */
/** @var string $activeVariant base|alt|strip */
?>
<nav class="variant-nav" aria-label="포털 시안 전환">
<?php foreach ($portalVariants as $v):
$key = match ($v['label']) {
'기본' => 'base',
'변형' => 'strip',
default => '',
};
$isActive = ($activeVariant ?? '') === $key;
?>
<a href="<?= esc($v['url']) ?>" class="<?= $isActive ? 'on' : '' ?>"><?= esc($v['label']) ?></a>
<?php endforeach; ?>
</nav>

View File

@@ -0,0 +1,192 @@
.main.work-main {
flex: 1;
min-width: 0;
overflow: auto;
background: #f5f7fa;
padding: 0.75rem 1rem 1.5rem;
}
.work-breadcrumb {
font-size: 0.6875rem;
color: #888;
margin-bottom: 0.5rem;
letter-spacing: -0.02em;
}
.work-breadcrumb a { color: #666; text-decoration: none; }
.work-breadcrumb a:hover { text-decoration: underline; }
.work-breadcrumb .sep { margin: 0 0.35rem; color: #bbb; }
.work-page-hd {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.work-page-title {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 1.125rem;
font-weight: 700;
color: #222;
letter-spacing: -0.03em;
}
.work-page-title .fav {
color: #f59e0b;
font-size: 0.875rem;
cursor: pointer;
opacity: 0.85;
}
.work-actions { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.btn-portal {
display: inline-flex;
align-items: center;
gap: 0.35rem;
padding: 0.4rem 0.85rem;
font-size: 0.75rem;
font-weight: 600;
border-radius: 3px;
border: 1px solid transparent;
text-decoration: none;
cursor: pointer;
letter-spacing: -0.02em;
line-height: 1.3;
}
.btn-portal-primary {
background: #00205b;
color: #fff;
border-color: #00205b;
}
.btn-portal-primary:hover { background: #003080; }
.btn-portal-secondary {
background: #fff;
color: #333;
border-color: #c5cdd8;
}
.btn-portal-secondary:hover { background: #f8fafc; }
.btn-portal-search {
background: #3366ff;
color: #fff;
border-color: #3366ff;
}
.btn-portal-search:hover { background: #2952cc; }
.btn-portal-reset {
background: #fff;
color: #555;
border-color: #c5cdd8;
}
.search-panel {
background: #fff;
border: 1px solid #d1d5db;
margin-bottom: 0.75rem;
}
.search-panel table {
width: 100%;
border-collapse: collapse;
font-size: 0.75rem;
}
.search-panel th {
width: 10%;
min-width: 5.5rem;
background: #f8fafc;
border: 1px solid #e5e7eb;
padding: 0.45rem 0.65rem;
font-weight: 600;
color: #444;
text-align: left;
vertical-align: middle;
}
.search-panel td {
border: 1px solid #e5e7eb;
padding: 0.35rem 0.5rem;
background: #fff;
}
.search-panel input,
.search-panel select {
width: 100%;
max-width: 14rem;
border: 1px solid #d1d5db;
padding: 0.3rem 0.45rem;
font-size: 0.75rem;
font-family: inherit;
border-radius: 2px;
}
.search-panel-foot {
display: flex;
justify-content: flex-end;
gap: 0.35rem;
padding: 0.5rem 0.65rem;
border-top: 1px solid #e5e7eb;
background: #fafbfc;
}
.table-toolbar {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 0.5rem;
margin-bottom: 0.4rem;
font-size: 0.75rem;
}
.table-toolbar .total strong { color: #3366ff; font-weight: 700; }
.table-toolbar .tools { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; }
.table-toolbar select {
border: 1px solid #d1d5db;
padding: 0.25rem 0.4rem;
font-size: 0.75rem;
}
.portal-data-table-wrap {
background: #fff;
border: 1px solid #d1d5db;
overflow: auto;
}
.portal-data-table {
width: 100%;
border-collapse: collapse;
font-size: 0.75rem;
}
.portal-data-table thead th {
background: #e8eef5;
color: #00205b;
font-weight: 700;
text-align: center;
padding: 0.5rem 0.4rem;
border: 1px solid #d1d5db;
white-space: nowrap;
}
.portal-data-table tbody td {
border: 1px solid #e5e7eb;
padding: 0.4rem 0.5rem;
text-align: center;
color: #333;
}
.portal-data-table tbody tr:nth-child(even) { background: #f9fafb; }
.portal-data-table tbody tr:hover { background: #eef6ff; }
.portal-data-table tbody tr.is-selected { background: #dbeafe; }
.portal-data-table tbody td.text-left { text-align: left; }
.portal-data-table tbody td a { color: #3366ff; text-decoration: none; }
.portal-data-table tbody td a:hover { text-decoration: underline; }
.portal-data-table .empty-row td {
padding: 2rem;
color: #888;
text-align: center;
}
.detail-section {
margin-top: 1rem;
}
.detail-section-hd {
font-size: 0.8125rem;
font-weight: 700;
color: #222;
margin-bottom: 0.4rem;
padding-bottom: 0.35rem;
border-bottom: 2px solid #00205b;
}
.flash-banner {
margin-bottom: 0.65rem;
padding: 0.5rem 0.75rem;
border-radius: 4px;
font-size: 0.75rem;
}
.flash-banner.ok { background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; }
.flash-banner.err { background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; }

View File

@@ -0,0 +1,224 @@
<?php
declare(strict_types=1);
/** @var list<object> $codeKinds */
/** @var array<int,int> $countMap */
/** @var bool $canManageKinds */
/** @var bool $canManageDetails */
/** @var object|null $selectedKind */
/** @var list<object> $detailList */
/** @var array<int,bool> $rowCanEdit */
/** @var int $totalCount */
/** @var array<string,string> $filters */
/** @var string $pageBaseUrl */
$canManageKinds = ! empty($canManageKinds);
$canManageDetails = ! empty($canManageDetails);
$selectedKindId = (int) ($selectedKind->ck_idx ?? 0);
$filters = is_array($filters ?? null) ? $filters : [];
$activeVariant = (string) ($activeVariant ?? 'base');
$pageBaseUrl = (string) ($pageBaseUrl ?? site_url(gov_portal_code_kinds_portal_path($activeVariant)));
$buildUrl = static function (array $extra = []) use ($filters, $selectedKindId, $pageBaseUrl): string {
$q = array_merge([
'search' => '1',
'q_code' => $filters['q_code'] ?? '',
'q_name' => $filters['q_name'] ?? '',
'q_state' => $filters['q_state'] ?? '',
'ck_idx' => $selectedKindId > 0 ? (string) $selectedKindId : '',
], $extra);
foreach ($q as $k => $v) {
if ($v === '' || $v === null) {
unset($q[$k]);
}
}
return $pageBaseUrl . '?' . http_build_query($q);
};
?>
<nav class="work-breadcrumb" aria-label="breadcrumb">
<a href="<?= base_url($activeVariant === 'strip' ? 'dashboard/gov-portal-strip' : 'dashboard/gov-portal') ?>">Home</a>
<span class="sep">&gt;</span>
<span>시스템관리</span>
<span class="sep">&gt;</span>
<span>기본 코드관리(포털 UI 시안)</span>
</nav>
<div class="work-page-hd">
<h1 class="work-page-title">
<span>기본 코드관리</span>
<span style="font-size:0.75rem;font-weight:600;color:#666;">포털 UI 시안</span>
<i class="fa-regular fa-star fav" title="즐겨찾기(목업)" aria-hidden="true"></i>
</h1>
<div class="work-actions">
<?php if ($canManageKinds): ?>
<a href="<?= base_url('admin/code-kinds/create') ?>" class="btn-portal btn-portal-primary">
<i class="fa-solid fa-plus"></i> 등록
</a>
<?php endif; ?>
<a href="<?= base_url('bag/code-kinds') ?>" class="btn-portal btn-portal-secondary" title="운영 중인 기본 코드관리 화면">
<i class="fa-solid fa-table-columns"></i> 운영 화면 (/bag/code-kinds)
</a>
</div>
</div>
<?php if (session()->getFlashdata('success')): ?>
<div class="flash-banner ok"><?= esc(session()->getFlashdata('success')) ?></div>
<?php endif; ?>
<?php if (session()->getFlashdata('error')): ?>
<div class="flash-banner err"><?= esc(session()->getFlashdata('error')) ?></div>
<?php endif; ?>
<form method="get" action="<?= esc($pageBaseUrl, 'attr') ?>" class="search-panel">
<input type="hidden" name="search" value="1"/>
<?php if ($selectedKindId > 0): ?>
<input type="hidden" name="ck_idx" value="<?= $selectedKindId ?>"/>
<?php endif; ?>
<table>
<tbody>
<tr>
<th>코드</th>
<td><input type="text" name="q_code" value="<?= esc($filters['q_code'] ?? '') ?>" placeholder="종류 코드"/></td>
<th>코드명</th>
<td><input type="text" name="q_name" value="<?= esc($filters['q_name'] ?? '') ?>" placeholder="종류명"/></td>
<th>사용여부</th>
<td>
<select name="q_state">
<option value="">전체</option>
<option value="1" <?= ($filters['q_state'] ?? '') === '1' ? 'selected' : '' ?>>사용</option>
<option value="0" <?= ($filters['q_state'] ?? '') === '0' ? 'selected' : '' ?>>미사용</option>
</select>
</td>
</tr>
</tbody>
</table>
<div class="search-panel-foot">
<a href="<?= esc($pageBaseUrl, 'attr') ?>" class="btn-portal btn-portal-reset">
<i class="fa-solid fa-rotate-left"></i> 초기화
</a>
<button type="submit" class="btn-portal btn-portal-search">
<i class="fa-solid fa-magnifying-glass"></i> 검색
</button>
</div>
</form>
<section aria-labelledby="codeKindTableLabel">
<div class="table-toolbar">
<div class="total">전체 <strong><?= number_format($totalCount) ?></strong> 건</div>
<div class="tools">
<span class="text-gray-500">코드 종류</span>
</div>
</div>
<div class="portal-data-table-wrap">
<table class="portal-data-table" id="codeKindTableLabel">
<thead>
<tr>
<th class="w-12">번호</th>
<th class="w-20">코드</th>
<th>코드명</th>
<th class="w-20">세부코드</th>
<th class="w-16">사용여부</th>
<th class="w-28">등록일</th>
<?php if ($canManageKinds): ?>
<th class="w-24">작업</th>
<?php endif; ?>
</tr>
</thead>
<tbody>
<?php if ($codeKinds !== []): ?>
<?php $i = 0; foreach ($codeKinds as $row): $i++; ?>
<?php $isSelected = (int) $row->ck_idx === $selectedKindId; ?>
<tr class="<?= $isSelected ? 'is-selected' : '' ?>"
onclick="window.location.href='<?= esc($buildUrl(['ck_idx' => (string) $row->ck_idx]), 'attr') ?>'"
style="cursor:pointer">
<td><?= (string) $i ?></td>
<td class="font-mono"><?= esc($row->ck_code) ?></td>
<td class="text-left"><?= esc($row->ck_name) ?></td>
<td><?= (int) ($countMap[$row->ck_idx] ?? 0) ?>개</td>
<td><?= (int) ($row->ck_state ?? 0) === 1 ? '사용' : '미사용' ?></td>
<td><?= esc($row->ck_regdate ?? '') ?></td>
<?php if ($canManageKinds): ?>
<td onclick="event.stopPropagation()">
<a href="<?= base_url('admin/code-kinds/edit/' . (int) $row->ck_idx) ?>">수정</a>
</td>
<?php endif; ?>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr class="empty-row">
<td colspan="<?= $canManageKinds ? '7' : '6' ?>">등록된 코드 종류가 없습니다.</td>
</tr>
<?php endif; ?>
</tbody>
</table>
</div>
</section>
<?php if ($selectedKind !== null): ?>
<section class="detail-section" aria-labelledby="codeDetailTableLabel">
<h2 class="detail-section-hd" id="codeDetailTableLabel">
세부코드 — <?= esc($selectedKind->ck_name) ?> (<?= esc($selectedKind->ck_code) ?>)
</h2>
<div class="table-toolbar">
<div class="total">세부 <strong><?= number_format(count($detailList)) ?></strong> 건</div>
<div class="tools">
<?php if ($canManageDetails): ?>
<a href="<?= base_url('admin/code-details/' . (int) $selectedKind->ck_idx . '/create') ?>" class="btn-portal btn-portal-primary">
<i class="fa-solid fa-plus"></i> 세부코드 등록
</a>
<?php endif; ?>
</div>
</div>
<div class="portal-data-table-wrap">
<table class="portal-data-table">
<thead>
<tr>
<th>번호</th>
<th>코드</th>
<th>코드명</th>
<th>범위</th>
<th>정렬</th>
<th>사용여부</th>
<th>등록일</th>
<?php if ($canManageDetails): ?>
<th>작업</th>
<?php endif; ?>
</tr>
</thead>
<tbody>
<?php if ($detailList !== []): ?>
<?php $dNo = 0; foreach ($detailList as $row): $dNo++; ?>
<?php
$isPlatform = (($row->cd_source ?? 'platform') === 'platform' && (int) ($row->cd_lg_idx ?? 0) === 0);
$scopeLabel = $isPlatform ? '공통' : '지자체';
?>
<tr>
<td><?= (string) $dNo ?></td>
<td class="font-mono"><?= esc($row->cd_code) ?></td>
<td class="text-left"><?= esc($row->cd_name) ?></td>
<td><?= esc($scopeLabel) ?></td>
<td><?= (int) ($row->cd_sort ?? 0) ?></td>
<td><?= (int) ($row->cd_state ?? 0) === 1 ? '사용' : '미사용' ?></td>
<td><?= esc($row->cd_regdate ?? '') ?></td>
<?php if ($canManageDetails): ?>
<td>
<?php if (! empty($rowCanEdit[$row->cd_idx])): ?>
<a href="<?= base_url('admin/code-details/edit/' . (int) $row->cd_idx) ?>">수정</a>
<?php else: ?>
<span style="color:#aaa">—</span>
<?php endif; ?>
</td>
<?php endif; ?>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr class="empty-row">
<td colspan="<?= $canManageDetails ? '8' : '7' ?>">등록된 세부코드가 없습니다.</td>
</tr>
<?php endif; ?>
</tbody>
</table>
</div>
</section>
<?php elseif ($codeKinds !== []): ?>
<p style="font-size:0.75rem;color:#888;margin-top:0.75rem;">위 표에서 코드 종류를 선택하면 세부코드가 표시됩니다.</p>
<?php endif; ?>

View File

@@ -0,0 +1,638 @@
<?php
declare(strict_types=1);
/**
* 공공 포털형 UI — 기본 레이아웃 (좌측 MY MENU)
*
* @var string $lgLabel
* @var string $activeVariant
*/
helper('admin');
$govPortalNavPartial = gov_portal_nav_partial_vars(get_defined_vars());
?>
<!DOCTYPE html>
<html lang="ko">
<head>
<?= view('home/_dashboard_gov_portal_head') ?>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css"/>
<?= view('home/_dashboard_gov_portal_map_leaflet_assets') ?>
<style>
:root {
--navy: #1a2b4b;
--navy-deep: #002b4e;
--blue: #0056b3;
--blue-ui: #007bff;
--blue-menu: #4a69bd;
--blue-light: #eef6ff;
--teal: #009688;
--bg: #f0f4f8;
--card: #fff;
--text: #444;
--text-dark: #222;
--muted: #888;
--border: #dde4ec;
--font-scale: 1;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html {
font-size: calc(14px * var(--font-scale));
-webkit-text-size-adjust: 100%;
}
body {
font-family: 'Pretendard', 'Malgun Gothic', 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif;
font-size: 0.8125rem; /* ~13px @14px root — 본문 */
font-weight: 400;
line-height: 1.45;
letter-spacing: -0.01em;
color: var(--text);
background: var(--bg);
min-height: 100vh;
display: flex;
flex-direction: column;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
<?php include __DIR__ . '/_dashboard_gov_portal_brand_css.php'; ?>
<?php include __DIR__ . '/_dashboard_gov_portal_topnav_css.php'; ?>
.layout {
display: flex;
flex: 1;
min-height: 0;
}
/* 좌측 사이드 */
.sidebar {
width: 168px;
flex-shrink: 0;
background: #fff;
border-right: 1px solid var(--border);
display: flex;
flex-direction: column;
font-size: 0.8125rem;
}
.my-menu-hd {
background: var(--navy);
color: #fff;
padding: 0.5rem 0.625rem;
font-weight: 700;
font-size: 0.6875rem; /* 11px — MY MENU 라벨 */
letter-spacing: 0.04em;
}
.my-menu-list { list-style: none; padding: 0.375rem 0.25rem; flex: 1; }
.my-menu-list li { margin: 0.1875rem 0.375rem; }
.my-menu-list a,
.my-menu-list .menu-sub {
display: flex;
align-items: center;
gap: 0.375rem;
padding: 0.4375rem 0.625rem;
margin: 0;
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.22);
text-decoration: none;
font-size: 0.8125rem; /* 13px */
font-weight: 600;
line-height: 1.35;
letter-spacing: -0.02em;
box-sizing: border-box;
transition: filter 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.my-menu-list a {
color: #fff;
background: var(--blue-menu);
}
.my-menu-list a .menu-ico,
.my-menu-list .menu-sub .menu-ico {
font-size: 0.625rem;
opacity: .9;
width: 0.75rem;
text-align: center;
flex-shrink: 0;
}
.my-menu-list a:hover { filter: brightness(1.06); border-color: rgba(255, 255, 255, 0.35); }
.my-menu-list a.active {
background: #3d5a9e;
font-weight: 700;
border-color: rgba(255, 255, 255, 0.4);
box-shadow: 0 1px 3px rgba(26, 43, 75, 0.12);
}
.my-menu-list a.menu-sub,
.my-menu-list .menu-sub {
background: var(--blue-light);
color: var(--blue);
font-size: 0.75rem;
font-weight: 600;
border-color: rgba(0, 86, 179, 0.18);
}
.sidebar-blocks { margin-top: auto; }
.sb-teal {
background: var(--teal);
color: #fff;
padding: 0.75rem 0.625rem;
font-size: 0.6875rem;
line-height: 1.5;
letter-spacing: -0.02em;
}
.sb-teal i { font-size: 1.125rem; margin-bottom: 0.25rem; display: block; }
.sb-gray {
background: #4a5568;
color: #fff;
padding: 0.625rem;
font-size: 0.6875rem;
line-height: 1.45;
}
.sb-links {
padding: 0.625rem;
background: #f5f7fa;
font-size: 0.6875rem;
}
.sb-links a {
display: block;
color: #555;
text-decoration: none;
padding: 0.1875rem 0;
letter-spacing: -0.02em;
font-weight: 600;
}
.sb-links a:hover { color: var(--blue-ui); }
/* 메인 그리드 */
.main {
flex: 1;
padding: 0.875rem 1rem 1rem;
overflow-y: auto;
}
.grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 0.875rem; /* ~14px */
align-items: stretch;
}
.grid .card-low-stock.stock-tall {
grid-row: span 2;
}
.card {
background: var(--card);
border-radius: 12px;
box-shadow: 0 1px 3px rgba(26,43,75,.06), 0 2px 8px rgba(26,43,75,.04);
border: 1px solid var(--border);
overflow: hidden;
}
.card-hd {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.625rem 0.875rem;
border-bottom: 1px solid var(--border);
font-weight: 700;
font-size: 1rem; /* ~16px 카드 제목 */
color: var(--text-dark);
letter-spacing: -0.03em;
line-height: 1.3;
}
.card-hd i {
color: var(--blue-ui);
margin-right: 0.3rem;
font-size: 0.875rem;
}
.card-bd { padding: 0.875rem 1rem; }
.span-3 { grid-column: span 3; }
.span-4 { grid-column: span 4; }
.span-5 { grid-column: span 5; }
.span-6 { grid-column: span 6; }
.span-8 { grid-column: span 8; }
.span-12 { grid-column: span 12; }
@media (max-width: 1200px) {
.span-3, .span-4, .span-5, .span-6, .span-8 { grid-column: span 12; }
.grid .card-low-stock.stock-tall { grid-row: span 1; }
.sidebar { width: 100%; border-right: none; border-bottom: 1px solid var(--border); }
.layout { flex-direction: column; }
.my-menu-list { display: flex; flex-wrap: wrap; }
}
.card-welcome {
background: #4a5568;
color: #fff;
border: none;
box-shadow: 0 2px 6px rgba(74,85,104,.25);
}
.card-welcome .card-bd { padding: 1rem 0.875rem; }
.welcome-hi {
font-size: 0.75rem;
color: rgba(255,255,255,.75);
letter-spacing: -0.02em;
}
.welcome-name {
font-size: 1rem;
font-weight: 700;
margin: 0.25rem 0 0.375rem;
letter-spacing: -0.03em;
}
.welcome-meta {
font-size: 0.6875rem;
color: rgba(255,255,255,.7);
line-height: 1.5;
letter-spacing: -0.02em;
}
.welcome-btns { display: flex; gap: 0.375rem; margin-top: 0.625rem; }
.welcome-btns a {
padding: 0.3125rem 0.625rem;
border-radius: 4px;
font-size: 0.75rem;
font-weight: 500;
text-decoration: none;
border: 1px solid rgba(255,255,255,.35);
background: rgba(255,255,255,.08);
color: #fff;
letter-spacing: -0.02em;
}
.welcome-btns a:hover { background: rgba(255,255,255,.18); }
.notice-item {
padding: 0.4375rem 0;
border-bottom: 1px dashed #e8edf2;
}
.notice-item:last-child { border-bottom: none; }
.notice-item .notice-title {
display: block;
font-size: 0.8125rem;
font-weight: 600;
color: var(--text-dark);
margin-bottom: 0.25rem;
line-height: 1.4;
letter-spacing: -0.02em;
}
.notice-item .notice-date {
display: inline-block;
font-size: 0.6875rem;
font-weight: 500;
color: var(--blue-ui);
background: var(--blue-light);
padding: 0.125rem 0.375rem;
border-radius: 2px;
letter-spacing: 0;
}
.stat-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.375rem;
text-align: center;
}
.stat-grid .num {
font-size: 1.5rem; /* ~22px */
font-weight: 700;
color: #2563eb;
line-height: 1.15;
letter-spacing: -0.03em;
}
.stat-grid .num.num-text { font-size: 1.125rem; color: #10b981; }
.stat-grid .lbl {
font-size: 0.6875rem;
color: var(--muted);
margin-top: 0.1875rem;
font-weight: 400;
letter-spacing: -0.02em;
}
.stat-foot {
margin-top: 0.625rem;
padding-top: 0.4375rem;
border-top: 1px solid var(--border);
font-size: 0.6875rem;
color: var(--muted);
letter-spacing: -0.02em;
}
<?php include __DIR__ . '/_dashboard_gov_portal_stock_cards_css.php'; ?>
.search-teal {
background: var(--teal);
color: #fff;
padding: 0.875rem;
border-radius: 12px;
height: 100%;
min-height: 5.5rem;
}
.search-teal strong {
font-size: 0.875rem;
font-weight: 600;
letter-spacing: -0.02em;
}
.search-teal input {
width: 100%;
margin-top: 0.4375rem;
padding: 0.4375rem 1.75rem 0.4375rem 0.625rem;
border: none;
border-radius: 4px;
font-size: 0.8125rem;
font-family: inherit;
letter-spacing: -0.02em;
}
.search-wrap { position: relative; }
.search-wrap i {
position: absolute;
right: 0.65rem;
top: 50%;
transform: translateY(-50%);
color: var(--muted);
}
<?php include __DIR__ . '/_dashboard_gov_portal_menu_search_css.php'; ?>
.desk-blue {
background: linear-gradient(160deg, #1a4a8a 0%, #007bff 100%);
color: #fff;
padding: 0.875rem;
border-radius: 12px;
font-size: 0.75rem;
line-height: 1.65;
letter-spacing: -0.02em;
height: 100%;
min-height: 5.5rem;
}
.desk-blue strong {
font-size: 0.875rem;
font-weight: 700;
display: block;
margin-bottom: 0.3rem;
letter-spacing: -0.03em;
}
<?php include __DIR__ . '/_dashboard_gov_portal_map_css.php'; ?>
.timeline-side {
background: var(--navy-deep);
color: #fff;
padding: 0.375rem 0.25rem;
max-height: 200px;
overflow-y: auto;
font-size: 0.75rem;
}
.timeline-side .item {
padding: 0.375rem 0.3125rem;
border-bottom: 1px solid rgba(255,255,255,.12);
}
.timeline-side .time {
display: block;
font-size: 0.8125rem;
font-weight: 700;
color: #fff;
letter-spacing: -0.02em;
margin-bottom: 0.125rem;
}
.timeline-side .ev-text {
font-size: 0.75rem;
font-weight: 600;
color: #4fc3f7;
line-height: 1.35;
letter-spacing: -0.02em;
}
.donut-wrap {
display: flex;
align-items: center;
gap: 1rem;
}
.donut {
width: 82px;
height: 82px;
border-radius: 50%;
background: conic-gradient(#3b82f6 0% 52%, #10b981 52% 80%, #f59e0b 80% 100%);
position: relative;
flex-shrink: 0;
}
.donut::after {
content: '52%';
position: absolute;
inset: 24%;
background: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 1.125rem;
color: var(--navy);
letter-spacing: -0.03em;
}
.donut-legend { list-style: none; font-size: 0.6875rem; color: var(--muted); line-height: 1.5; }
.mini-bars {
display: flex;
align-items: flex-end;
gap: 3px;
height: 64px;
}
.mini-bars .col {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
gap: 2px;
font-size: 0.625rem;
color: var(--muted);
font-weight: 500;
}
.mini-bars .bar {
width: 100%;
background: linear-gradient(180deg, #2563eb, #60a5fa);
border-radius: 3px 3px 0 0;
min-height: 4px;
}
.gis-btn {
background: var(--blue-ui);
color: #fff;
font-size: 0.6875rem;
font-weight: 500;
padding: 0.25rem 0.5rem;
border-radius: 3px;
text-decoration: none;
letter-spacing: -0.02em;
}
.flash-ok {
grid-column: 1 / -1;
background: #ecfdf5;
border: 1px solid #a7f3d0;
color: #065f46;
padding: 0.65rem 1rem;
border-radius: 8px;
font-size: 12px;
}
</style>
</head>
<body>
<header class="portal-header">
<div class="portal-header-inner">
<?= view('home/_dashboard_gov_portal_brand', ['brandHref' => base_url('dashboard/gov-portal')]) ?>
<?= view('home/_dashboard_gov_portal_topnav_click', $govPortalNavPartial) ?>
<?= view('home/_dashboard_gov_portal_header_utils', ['activeVariant' => $activeVariant, 'portalVariants' => $portalVariants, 'mbName' => $mbName, 'levelName' => $levelName, 'lgLabel' => $lgLabel]) ?>
</div>
</header>
<div class="layout">
<?= view('home/_dashboard_gov_portal_sidebar', $govPortalNavPartial) ?>
<main class="main">
<div class="grid">
<?php if (session()->getFlashdata('success')): ?>
<div class="flash-ok"><?= esc(session()->getFlashdata('success')) ?></div>
<?php endif; ?>
<!-- 사용자 정보 (스크린샷: 다크 그레이 프로필 카드) -->
<div class="card card-welcome span-3">
<div class="card-bd">
<p class="welcome-hi">안녕하세요.</p>
<p class="welcome-name"><?= esc($mbName) ?>님</p>
<p class="welcome-meta">아이디 <?= esc($mbId) ?><br/>최근접속 <?= date('Y.m.d H:i') ?></p>
<div class="welcome-btns">
<a href="<?= base_url(gov_portal_code_kinds_portal_path('base')) ?>">기본 코드관리</a>
<a href="<?= base_url('dashboard/simple') ?>">마이페이지</a>
<a href="<?= base_url('logout') ?>">로그아웃</a>
</div>
</div>
</div>
<!-- 메시지 -->
<div class="card span-4">
<div class="card-hd"><span><i class="fa-regular fa-envelope"></i> 메시지</span></div>
<div class="card-bd">
<?php foreach ($notices as $n): ?>
<div class="notice-item">
<span class="notice-title"><?= esc($n['title']) ?></span>
<span class="notice-date"><?= esc($n['date']) ?></span>
</div>
<?php endforeach; ?>
</div>
</div>
<!-- 핵심 지표 (메인 요약과 동일) -->
<div class="card span-5">
<div class="card-hd"><span><i class="fa-solid fa-warehouse"></i> 업무 현황 요약</span></div>
<div class="card-bd">
<div class="stat-grid">
<div>
<div class="num num-text">양호</div>
<div class="lbl">봉투 재고</div>
</div>
<div>
<div class="num">12</div>
<div class="lbl">미처리 구매신청</div>
</div>
<div>
<div class="num">4</div>
<div class="lbl">승인 대기</div>
</div>
</div>
<div class="stat-foot">
<i class="fa-solid fa-location-dot"></i> <?= esc($lgLabel) ?> · 기준일 <?= date('Y.m.d') ?>
</div>
</div>
</div>
<!-- 지도/타임라인 영역 -->
<div class="card span-8" style="padding:0;">
<div class="card-hd">
<span><i class="fa-solid fa-map"></i> 판매·수불 최근 동향</span>
<a href="<?= base_url('bag/flow') ?>" class="gis-btn">수불 통합 조회 &gt;</a>
</div>
<div style="display:grid;grid-template-columns:1fr 140px;">
<?= view('home/_dashboard_gov_portal_map_panel', [
'mapId' => 'govPortalMainMap',
'mapHeight' => '200px',
'lgLabel' => $lgLabel,
'govMapPanel' => $govMapPanel,
]) ?>
<div class="timeline-side">
<?php foreach ($timeline as $ev): ?>
<div class="item">
<span class="time"><?= esc($ev['time']) ?></span>
<span class="ev-text"><?= esc($ev['text']) ?></span>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<!-- 메뉴 검색 -->
<div class="span-4">
<?= view('home/_dashboard_gov_portal_menu_search', [
'variant' => 'teal',
'inputId' => 'menuSearch',
'menuSearchOptions' => $menuSearchOptions,
]) ?>
</div>
<!-- 서비스 데스크 -->
<div class="span-4">
<div class="desk-blue">
<strong><i class="fa-solid fa-headset"></i> 서비스 데스크</strong>
담당: 시스템 운영팀<br/>
문의: help@wxn.local (목업)<br/>
평일 09:00 ~ 18:00
</div>
</div>
<!-- 재고 경보 단계 -->
<div class="card span-4">
<div class="card-hd"><span><i class="fa-solid fa-triangle-exclamation"></i> 재고 경보</span></div>
<div class="card-bd">
<?= view('home/_dashboard_gov_portal_stock_alert_levels', ['stockAlerts' => $stockAlerts]) ?>
</div>
</div>
<!-- 부족 재고 — 2행 span으로 재고 구성 오른쪽 빈칸(4열)까지 세로 채움 -->
<div class="card card-low-stock stock-tall span-4">
<div class="card-hd"><span><i class="fa-solid fa-box-open"></i> 부족 재고</span></div>
<div class="card-bd">
<div class="low-stock-grid">
<?php foreach ($lowStock as $item): ?>
<div class="bar-row">
<div class="meta"><span><?= esc($item['name']) ?></span><span><?= esc((string) $item['percent']) ?>%</span></div>
<div class="bar-track"><div class="bar-fill" style="width:<?= (int) $item['percent'] ?>%"></div></div>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<!-- 7일 추이 -->
<div class="card span-4">
<div class="card-hd"><span><i class="fa-solid fa-chart-column"></i> 최근 7일 신청</span></div>
<div class="card-bd">
<?php $maxReq = max($weeklyRequests); ?>
<div class="mini-bars">
<?php foreach ($weeklyRequests as $idx => $v): ?>
<?php $h = (int) round(($v / $maxReq) * 100); ?>
<div class="col">
<span><?= esc((string) $v) ?></span>
<div class="bar" style="height:<?= $h ?>%"></div>
<span>D<?= 6 - $idx ?></span>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<!-- 재고 구성 -->
<div class="card span-4">
<div class="card-hd"><span><i class="fa-solid fa-chart-pie"></i> 재고 구성</span></div>
<div class="card-bd">
<div class="donut-wrap">
<div class="donut" aria-hidden="true"></div>
<ul class="donut-legend">
<?php foreach ($stockMix as $item): ?>
<li>
<span style="display:inline-block;width:7px;height:7px;border-radius:50%;background:<?= esc($item['color'], 'attr') ?>;vertical-align:middle;margin-right:3px;"></span>
<?= esc($item['name']) ?> <?= esc((string) $item['value']) ?>%
</li>
<?php endforeach; ?>
</ul>
</div>
</div>
</div>
</div>
</main>
</div>
<?= view('home/_dashboard_gov_portal_nav_script_base', $govPortalNavPartial) ?>
<?= view('home/_dashboard_gov_portal_font_zoom_script') ?>
</body>
</html>

View File

@@ -0,0 +1,143 @@
<?php
declare(strict_types=1);
/**
* 공공 포털형 — 기본 코드관리 (NDMS 스타일 본문 + gov-portal 상단·사이드 메뉴)
*/
helper('admin');
$govPortalNavPartial = gov_portal_nav_partial_vars(get_defined_vars());
$activeVariant = $activeVariant ?? 'base';
?>
<!DOCTYPE html>
<html lang="ko">
<head>
<?= view('home/_dashboard_gov_portal_head') ?>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css"/>
<style>
:root {
--navy: #1a2b4b;
--navy-deep: #002b4e;
--blue: #0056b3;
--blue-ui: #007bff;
--blue-menu: #4a69bd;
--blue-light: #eef6ff;
--teal: #009688;
--bg: #f0f4f8;
--text: #444;
--border: #dde4ec;
--font-scale: 1;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html {
font-size: calc(14px * var(--font-scale));
-webkit-text-size-adjust: 100%;
}
body {
font-family: 'Pretendard', 'Malgun Gothic', 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif;
font-size: 0.8125rem;
font-weight: 400;
line-height: 1.45;
letter-spacing: -0.01em;
color: var(--text);
background: var(--bg);
min-height: 100vh;
display: flex;
flex-direction: column;
}
<?php include __DIR__ . '/_dashboard_gov_portal_brand_css.php'; ?>
<?php include __DIR__ . '/_dashboard_gov_portal_topnav_css.php'; ?>
<?php include __DIR__ . '/_dashboard_gov_portal_workpage_css.php'; ?>
.layout {
display: flex;
flex: 1;
min-height: 0;
}
.sidebar {
width: 168px;
flex-shrink: 0;
background: #fff;
border-right: 1px solid var(--border);
display: flex;
flex-direction: column;
font-size: 0.8125rem;
}
.my-menu-hd {
background: var(--navy);
color: #fff;
padding: 0.5rem 0.625rem;
font-weight: 700;
font-size: 0.6875rem;
letter-spacing: 0.04em;
}
.my-menu-list { list-style: none; padding: 0.375rem 0.25rem; flex: 1; }
.my-menu-list li { margin: 0.1875rem 0.375rem; }
.my-menu-list a,
.my-menu-list .menu-sub {
display: flex;
align-items: center;
gap: 0.375rem;
padding: 0.4375rem 0.625rem;
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.22);
text-decoration: none;
font-size: 0.8125rem;
font-weight: 600;
line-height: 1.35;
letter-spacing: -0.02em;
}
.my-menu-list a {
color: #fff;
background: var(--blue-menu);
}
.my-menu-list a .menu-ico { font-size: 0.625rem; width: 0.75rem; text-align: center; }
.my-menu-list a.active {
background: #3d5a9e;
font-weight: 700;
border-color: rgba(255, 255, 255, 0.4);
}
.sidebar-blocks { padding: 0.5rem; font-size: 0.6875rem; }
.sb-teal {
background: var(--teal);
color: #fff;
padding: 0.5rem;
border-radius: 8px;
margin-bottom: 0.35rem;
line-height: 1.4;
}
.sb-gray {
background: #6b7280;
color: #fff;
padding: 0.5rem;
border-radius: 8px;
margin-bottom: 0.35rem;
line-height: 1.4;
}
.sb-links a { display: block; color: #3366ff; margin-top: 0.25rem; font-size: 0.6875rem; }
</style>
</head>
<body>
<header class="portal-header">
<div class="portal-header-inner">
<?= view('home/_dashboard_gov_portal_brand', ['brandHref' => base_url('dashboard/gov-portal')]) ?>
<?= view('home/_dashboard_gov_portal_topnav_click', $govPortalNavPartial) ?>
<?= view('home/_dashboard_gov_portal_header_utils', [
'activeVariant' => $activeVariant,
'portalVariants' => $portalVariants,
'mbName' => $mbName,
'levelName' => $levelName,
'lgLabel' => $lgLabel,
]) ?>
</div>
</header>
<div class="layout">
<?= view('home/_dashboard_gov_portal_sidebar', $govPortalNavPartial) ?>
<main class="main work-main">
<?= view('home/_gov_portal_code_kinds_body', get_defined_vars()) ?>
</main>
</div>
<?= view('home/_dashboard_gov_portal_nav_script_base', $govPortalNavPartial) ?>
<?= view('home/_dashboard_gov_portal_font_zoom_script') ?>
</body>
</html>

View File

@@ -0,0 +1,8 @@
<?php
declare(strict_types=1);
/**
* @deprecated 컨트롤러가 _dashboard_gov_portal_strip_layout 을 직접 렌더합니다.
*/
echo view('home/_dashboard_gov_portal_strip_layout', array_merge(get_defined_vars(), [
'stripInnerView' => 'home/_dashboard_gov_portal_strip_home_inner',
]));

View File

@@ -0,0 +1,10 @@
<?php
declare(strict_types=1);
/**
* @deprecated 컨트롤러가 _dashboard_gov_portal_strip_layout 을 직접 렌더합니다.
*/
echo view('home/_dashboard_gov_portal_strip_layout', array_merge(get_defined_vars(), [
'stripInnerView' => 'home/_gov_portal_code_kinds_body',
'stripIncludeWorkCss' => true,
'stripShowProfileLinks' => true,
]));