144 lines
6.7 KiB
Plaintext
144 lines
6.7 KiB
Plaintext
<!doctype html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<%- include('partials/favicon') %>
|
|
<title>AI - XAVIS</title>
|
|
<link rel="stylesheet" href="/public/styles.css" />
|
|
</head>
|
|
<body
|
|
data-ai-explore-dev-guest="<%= (typeof aiExploreDevGuestRestricted !== 'undefined' && aiExploreDevGuestRestricted) ? '1' : '0' %>"
|
|
class="<%= (typeof aiExploreDevGuestRestricted !== 'undefined' && aiExploreDevGuestRestricted) ? 'ai-explore-page ai-explore-dev-guest' : 'ai-explore-page' %>"
|
|
>
|
|
<% var aiGuestDev = typeof aiExploreDevGuestRestricted !== 'undefined' && aiExploreDevGuestRestricted; %>
|
|
<% var _opsLoggedIn = typeof opsUserEmail !== 'undefined' && opsUserEmail; %>
|
|
<div class="app-shell">
|
|
<%- include('partials/nav', { activeMenu: 'ai-explore', adminMode: typeof adminMode !== 'undefined' ? adminMode : false }) %>
|
|
<div class="content-area">
|
|
<header class="topbar">
|
|
<h1>AI</h1>
|
|
<% if (!_opsLoggedIn) { %>
|
|
<% if (aiGuestDev) { %>
|
|
<span class="top-action-link ai-explore-action-disabled" aria-disabled="true">AI 추가하기</span>
|
|
<% } else { %>
|
|
<a class="top-action-link" href="#">AI 추가하기</a>
|
|
<% } %>
|
|
<% } %>
|
|
</header>
|
|
<main class="container container-ai-full">
|
|
<% if (aiGuestDev) { %>
|
|
<p class="chat-api-warning" style="margin-bottom: 16px">로그인 후 이용 가능합니다.</p>
|
|
<% } %>
|
|
<section class="panel">
|
|
<p class="subtitle">지식 시험이나 지식 보강은 물론, 스킬들을 다양하게 조합한 맞춤형 AI를 탐색하고 사용해보세요.</p>
|
|
<form class="search-bar-wrap" id="aiExploreSearchForm" role="search">
|
|
<input
|
|
type="search"
|
|
id="aiExploreSearch"
|
|
placeholder="제목, 설명으로 검색하세요"
|
|
class="search-input"
|
|
autocomplete="off"
|
|
aria-label="AI 서비스 제목·설명 검색"
|
|
<% if (aiGuestDev) { %>disabled aria-disabled="true"<% } %>
|
|
/>
|
|
</form>
|
|
</section>
|
|
<section class="panel">
|
|
<h2>AI 서비스</h2>
|
|
<div class="ai-card-grid">
|
|
<a href="/ai-explore/prompts" class="ai-card ai-card-link">
|
|
<div class="ai-card-header">
|
|
<span class="status-chip public">공개중</span>
|
|
</div>
|
|
<h3>프롬프트</h3>
|
|
<p>업무별 기본 프롬프트를 모아 두고, 복사해 바로 활용할 수 있는 라이브러리입니다.</p>
|
|
<div class="tag-row"><span class="tag-chip">#프롬프트</span></div>
|
|
</a>
|
|
<% if (aiGuestDev) { %>
|
|
<article class="ai-card ai-card-disabled" aria-disabled="true">
|
|
<div class="ai-card-header">
|
|
<span class="status-chip public">공개중</span>
|
|
</div>
|
|
<h3>회의록 AI</h3>
|
|
<p>회의록을 자동으로 작성·요약·정리해주는 AI 서비스입니다.</p>
|
|
<div class="tag-row"><span class="tag-chip">#업무관리</span><span class="tag-chip">#회의록</span></div>
|
|
</article>
|
|
<% } else { %>
|
|
<a href="/ai-explore/meeting-minutes" class="ai-card ai-card-link">
|
|
<div class="ai-card-header">
|
|
<span class="status-chip public">공개중</span>
|
|
</div>
|
|
<h3>회의록 AI</h3>
|
|
<p>회의록을 자동으로 작성·요약·정리해주는 AI 서비스입니다.</p>
|
|
<div class="tag-row"><span class="tag-chip">#업무관리</span><span class="tag-chip">#회의록</span></div>
|
|
</a>
|
|
<% } %>
|
|
<% if (aiGuestDev) { %>
|
|
<article class="ai-card ai-card-disabled" aria-disabled="true">
|
|
<div class="ai-card-header">
|
|
<span class="status-chip public">공개중</span>
|
|
</div>
|
|
<h3>(회의록 기반) 업무 체크리스트 AI</h3>
|
|
<p>회의록에서 추출된 할 일과 개인 업무를 통합 관리하고, 등록·수정·삭제를 통해 완결성을 높이는 AI 비서입니다.</p>
|
|
<div class="tag-row"><span class="tag-chip">#업무관리</span><span class="tag-chip">#체크리스트</span></div>
|
|
</article>
|
|
<% } else { %>
|
|
<a href="/ai-explore/task-checklist" class="ai-card ai-card-link">
|
|
<div class="ai-card-header">
|
|
<span class="status-chip public">공개중</span>
|
|
</div>
|
|
<h3>(회의록 기반) 업무 체크리스트 AI</h3>
|
|
<p>회의록에서 추출된 할 일과 개인 업무를 통합 관리하고, 등록·수정·삭제를 통해 완결성을 높이는 AI 비서입니다.</p>
|
|
<div class="tag-row"><span class="tag-chip">#업무관리</span><span class="tag-chip">#체크리스트</span></div>
|
|
</a>
|
|
<% } %>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
(function () {
|
|
var form = document.getElementById("aiExploreSearchForm");
|
|
var input = document.getElementById("aiExploreSearch");
|
|
var grid = document.querySelector(".ai-card-grid");
|
|
if (!form || !input || !grid) return;
|
|
|
|
var devGuest = (document.body.getAttribute("data-ai-explore-dev-guest") || "0") === "1";
|
|
if (devGuest) return;
|
|
|
|
var cards = grid.querySelectorAll(".ai-card");
|
|
|
|
function cardTitleDescriptionText(el) {
|
|
var parts = [];
|
|
var h3 = el.querySelector("h3");
|
|
if (h3) parts.push(h3.textContent || "");
|
|
el.querySelectorAll("p").forEach(function (p) {
|
|
if (!p.closest(".tag-row")) parts.push(p.textContent || "");
|
|
});
|
|
return parts.join(" ").replace(/\s+/g, " ").trim().toLowerCase();
|
|
}
|
|
|
|
function applyFilter() {
|
|
var q = (input.value || "").trim().toLowerCase();
|
|
cards.forEach(function (el) {
|
|
var text = cardTitleDescriptionText(el);
|
|
var show = !q || text.indexOf(q) !== -1;
|
|
el.hidden = !show;
|
|
el.setAttribute("aria-hidden", show ? "false" : "true");
|
|
});
|
|
}
|
|
|
|
input.addEventListener("input", applyFilter);
|
|
input.addEventListener("search", applyFilter);
|
|
|
|
form.addEventListener("submit", function (e) {
|
|
e.preventDefault();
|
|
applyFilter();
|
|
});
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html>
|