Skip to Content
Version 6.1 by XWikiGuest on 2026/03/06 16:20
Show last authors
1 {{velocity}}
2 ## 新しい学校ページ作成フォーム（学校マスターデータ検索方式）
3
4 #set($currentUser = $xcontext.user)
5 #if($currentUser == 'XWiki.XWikiGuest')
6 {{error}}学校ページの作成にはログインが必要です。[[ログイン>>path:/xwiki/bin/login/XWiki/XWikiLogin]]してください。{{/error}}
7 #stop
8 #end
9
10 #if($request.action && $request.action == 'create' && $services.csrf.isTokenValid($request.form_token))
11 ## フォーム送信後の処理
12 #set($schoolCode = $request.schoolCode)
13 #set($schoolName = $request.schoolName)
14
15 ## バリデーション: 学校コードが13桁の数字であること（文科省形式）
16 #if(!$schoolCode || $schoolCode.length() != 13 || !$schoolCode.matches('^\d{13}$'))
17 {{error}}学校コードが不正です。学校名検索から選択してください。{{/error}}
18 #stop
19 #end
20
21 #set($targetPage = "Schools.${schoolCode}.WebHome")
22
23 #if($xwiki.exists($targetPage))
24 {{error}}この学校のページは既に存在します。[[既存のページを開く>>$targetPage]]{{/error}}
25 #else
26 ## ページを作成して学校テンプレートを適用
27 $response.sendRedirect($xwiki.getURL("Schools.${schoolCode}.WebHome", 'edit',
28 "template=SeitokaiCode.SchoolTemplate&schoolCode=${schoolCode}&schoolName=${escapetool.url($schoolName)}"))
29 #end
30 #else
31
32 = 新しい学校ページを作成 =
33
34 {{info}}
35 学校名で検索してページを作成します。１校で複数のページを持つことはできません。文科省の学校コード毎に学校ページを作成することができます。
36 {{/info}}
37
38 {{html clean="false"}}
39 <div class="school-create-form" style="max-width:600px;">
40 <form method="post" id="createSchoolForm">
41 <input type="hidden" name="action" value="create" />
42 <input type="hidden" name="form_token" value="$services.csrf.getToken()" />
43 <input type="hidden" name="schoolCode" id="schoolCode" />
44 <input type="hidden" name="schoolName" id="schoolName" />
45
46 <div class="form-group" style="margin-bottom:20px;">
47 <label style="font-weight:600;margin-bottom:6px;display:block;">学校を検索 <span style="color:#ef4444;">*</span></label>
48 <div style="position:relative;">
49 <input type="text" id="schoolSearchInput" class="form-control"
50 placeholder="学校名で検索（例: 日比谷、渋谷、北野...）"
51 autocomplete="off" style="padding-left:36px;" />
52 <span style="position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:0.9em;color:#999;pointer-events:none;"><svg class="ico" viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg></span>
53 <ul id="schoolSearchResults" style="display:none;position:absolute;top:100%;left:0;right:0;max-height:240px;overflow-y:auto;background:#fff;border:1px solid #e2e8f0;border-top:none;border-radius:0 0 8px 8px;box-shadow:0 4px 16px rgba(0,0,0,0.1);z-index:100;list-style:none;margin:0;padding:0;"></ul>
54 </div>
55 <small style="color:#94a3b8;font-size:0.82em;">文科省の学校マスターデータから候補を検索します。</small>
56 </div>
57
58 <!-- 選択結果 -->
59 <div id="selectedSchoolArea" style="display:none;margin-bottom:20px;">
60 <div style="background:#f0fdf4;border:1px solid #86efac;border-radius:10px;padding:16px 20px;">
61 <div style="display:flex;justify-content:space-between;align-items:flex-start;">
62 <div>
63 <div style="font-size:0.78em;color:#15803d;font-weight:600;">選択された学校</div>
64 <div id="selectedSchoolName" style="font-size:1.05em;font-weight:700;color:#166534;margin-top:4px;"></div>
65 <div id="selectedSchoolInfo" style="font-size:0.84em;color:#15803d;margin-top:2px;"></div>
66 <div id="selectedSchoolCode" style="font-family:monospace;font-size:0.82em;color:#166534;margin-top:2px;"></div>
67 </div>
68 <button type="button" onclick="clearSelection()" style="background:none;border:1px solid #86efac;border-radius:6px;cursor:pointer;color:#dc2626;font-size:0.82em;padding:4px 12px;">変更</button>
69 </div>
70 </div>
71 </div>
72
73 <!-- 重複チェック結果 -->
74 <div id="duplicateWarning" style="display:none;margin-bottom:20px;padding:14px 18px;background:#fef2f2;border:1px solid #fca5a5;border-radius:10px;font-size:0.88em;color:#991b1b;">
75 <strong><svg class="ico" viewBox="0 0 24 24"><path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg> この学校のページは既に存在します</strong>
76 <div style="margin-top:6px;"><a id="duplicateLink" href="#" style="color:#4f46e5;font-weight:600;">既存のページを開く →</a></div>
77 </div>
78
79 <!-- 作成ボタン -->
80 <div id="submitArea" style="display:none;">
81 <div style="padding:14px;background:#ecfdf5;border:1px solid #86efac;border-radius:10px;margin-bottom:16px;font-size:0.88em;color:#166534;">
82 <svg class="ico" viewBox="0 0 24 24" stroke-width="2.5"><path d="M20 6L9 17l-5-5"/></svg> この学校のページはまだ作成されていません。
83 </div>
84 <button type="submit" class="btn btn-primary" style="width:100%;">ページを作成</button>
85 </div>
86 </form>
87
88 <!-- 未選択時ヒント -->
89 <div id="searchHint" style="margin-top:20px;text-align:center;padding:24px;background:#f1f5f9;border-radius:10px;">
90 <div style="font-size:2em;margin-bottom:8px;"><svg class="ico" viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg></div>
91 <div style="font-size:0.9em;color:#94a3b8;">上の検索欄から学校名を入力してください</div>
92 </div>
93 </div>
94
95 <script>
96 (function() {
97 // 学校マスターデータをJSON APIから取得
98 var schools = [];
99 var schoolsLoaded = false;
100
101 // schools.json をロード（XWiki添付ファイルとして配置）
102 // 配置先: SeitokaiCode.SchoolMasterData の添付ファイル
103 fetch('/xwiki/rest/wikis/xwiki/spaces/SeitokaiCode/pages/SchoolMasterData/attachments/schools.json')
104 .then(function(r) { return r.json(); })
105 .then(function(data) { schools = data; schoolsLoaded = true; })
106 .catch(function() {
107 console.warn('学校マスターデータの読み込みに失敗しました。SeitokaiCode.SchoolMasterData に schools.json が添付されているか確認してください。');
108 });
109
110 var input = document.getElementById('schoolSearchInput');
111 var resultsList = document.getElementById('schoolSearchResults');
112 var debounceTimer = null;
113
114 input.addEventListener('input', function() {
115 clearTimeout(debounceTimer);
116 debounceTimer = setTimeout(function() { searchSchools(input.value); }, 200);
117 });
118
119 function searchSchools(query) {
120 if (!query || query.length < 1 || !schoolsLoaded) {
121 resultsList.style.display = 'none';
122 return;
123 }
124 var q = query.toLowerCase();
125 var results = schools.filter(function(s) {
126 return s.name.toLowerCase().indexOf(q) >= 0 ||
127 s.pref.indexOf(q) >= 0 ||
128 s.city.indexOf(q) >= 0 ||
129 s.code.indexOf(q) >= 0;
130 }).slice(0, 10);
131
132 resultsList.innerHTML = '';
133 if (results.length === 0) {
134 resultsList.innerHTML = '<li style="padding:14px;text-align:center;color:#94a3b8;">該当する学校が見つかりません</li>';
135 } else {
136 results.forEach(function(s) {
137 var li = document.createElement('li');
138 li.style.cssText = 'padding:10px 14px;cursor:pointer;border-bottom:1px solid #f1f5f9;';
139 li.innerHTML =
140 '<div style="font-weight:600;">' + s.name + '</div>' +
141 '<div style="font-size:0.82em;color:#94a3b8;margin-top:2px;">' +
142 s.pref + ' ' + s.city + ' ・ ' + s.type + '（' + s.est + '）' +
143 '</div>' +
144 '<div style="font-family:monospace;font-size:0.78em;color:#6366f1;">' + s.code + '</div>';
145 li.onmouseover = function() { this.style.background = '#f0f4ff'; };
146 li.onmouseout = function() { this.style.background = ''; };
147 li.onclick = function() { selectSchool(s); };
148 resultsList.appendChild(li);
149 });
150 }
151 resultsList.style.display = 'block';
152 }
153
154 window.selectSchool = function(school) {
155 // hidden フィールドにセット
156 document.getElementById('schoolCode').value = school.code;
157 document.getElementById('schoolName').value = school.name;
158
159 // UI更新
160 input.style.display = 'none';
161 resultsList.style.display = 'none';
162 document.getElementById('searchHint').style.display = 'none';
163
164 document.getElementById('selectedSchoolName').textContent = school.name;
165 document.getElementById('selectedSchoolInfo').textContent =
166 school.pref + ' ' + school.city + ' ・ ' + school.type + '（' + school.est + '）';
167 document.getElementById('selectedSchoolCode').textContent = '学校コード: ' + school.code;
168 document.getElementById('selectedSchoolArea').style.display = 'block';
169
170 // 重複チェック（XWikiにページが存在するか確認）
171 var targetPage = 'Schools.' + school.code + '.WebHome';
172 fetch('/xwiki/rest/wikis/xwiki/spaces/Schools/spaces/' + school.code + '/pages/WebHome')
173 .then(function(r) {
174 if (r.ok) {
175 // 既存ページあり
176 document.getElementById('duplicateWarning').style.display = 'block';
177 document.getElementById('duplicateLink').href =
178 '/xwiki/bin/view/Schools/' + school.code + '/';
179 document.getElementById('submitArea').style.display = 'none';
180 } else {
181 // 新規作成OK
182 document.getElementById('duplicateWarning').style.display = 'none';
183 document.getElementById('submitArea').style.display = 'block';
184 }
185 })
186 .catch(function() {
187 // APIエラー時は作成を許可（サーバー側で重複チェックもある）
188 document.getElementById('submitArea').style.display = 'block';
189 });
190 };
191
192 window.clearSelection = function() {
193 document.getElementById('schoolCode').value = '';
194 document.getElementById('schoolName').value = '';
195 document.getElementById('selectedSchoolArea').style.display = 'none';
196 document.getElementById('duplicateWarning').style.display = 'none';
197 document.getElementById('submitArea').style.display = 'none';
198 document.getElementById('searchHint').style.display = '';
199 input.style.display = '';
200 input.value = '';
201 input.focus();
202 };
203
204 // キーボードナビゲーション
205 var selectedIdx = -1;
206 input.addEventListener('keydown', function(e) {
207 var items = resultsList.querySelectorAll('li');
208 if (e.key === 'ArrowDown') {
209 e.preventDefault();
210 selectedIdx = Math.min(selectedIdx + 1, items.length - 1);
211 items.forEach(function(li, i) { li.style.background = i === selectedIdx ? '#f0f4ff' : ''; });
212 } else if (e.key === 'ArrowUp') {
213 e.preventDefault();
214 selectedIdx = Math.max(selectedIdx - 1, 0);
215 items.forEach(function(li, i) { li.style.background = i === selectedIdx ? '#f0f4ff' : ''; });
216 } else if (e.key === 'Enter' && selectedIdx >= 0) {
217 e.preventDefault();
218 items[selectedIdx].click();
219 selectedIdx = -1;
220 } else if (e.key === 'Escape') {
221 resultsList.style.display = 'none';
222 selectedIdx = -1;
223 }
224 });
225
226 // クリック外で閉じる
227 document.addEventListener('click', function(e) {
228 if (!e.target.closest('.school-create-form')) {
229 resultsList.style.display = 'none';
230 selectedIdx = -1;
231 }
232 });
233 })();
234 </script>
235 {{/html}}
236
237 #end
238 {{/velocity}}