diff --git a/static/app.js b/static/app.js
index fc18e86..e5ef6bc 100644
--- a/static/app.js
+++ b/static/app.js
@@ -577,16 +577,69 @@ $(document).ready(function() {
// 처방 목록 로드
function loadFormulas() {
+ // 100처방 이름 목록을 먼저 가져온 후 내 처방 렌더링
+ $.get('/api/official-formulas', function(offRes) {
+ const officialNames = new Map();
+ if (offRes.success) {
+ offRes.data.forEach(f => officialNames.set(f.formula_name, f.formula_number));
+ }
+
$.get('/api/formulas', function(response) {
if (response.success) {
const tbody = $('#formulasList');
tbody.empty();
response.data.forEach(formula => {
+ // 100처방 매칭: 정확 매칭 우선, 없으면 내 처방명이 100처방명으로 시작하는지 확인
+ let officialNum = officialNames.get(formula.formula_name);
+ if (officialNum == null) {
+ for (const [name, num] of officialNames) {
+ if (formula.formula_name.startsWith(name)) {
+ officialNum = num;
+ break;
+ }
+ }
+ }
+ const officialBadge = officialNum != null
+ ? ` 100처방 #${officialNum}`
+ : '';
+
+ // 처방명 스타일링: "어울림" 접두어 색상 처리
+ let displayName = formula.formula_name;
+ if (displayName.startsWith('어울림 ')) {
+ displayName = `어울림 ${displayName.substring(4)}`;
+ }
+
+ // 가감 정보 표시 (100처방 기반 처방)
+ let customInfo = '';
+ if (formula.official_formula_id && formula.is_custom) {
+ let details = [];
+ if (formula.custom_modified && formula.custom_modified.length > 0) {
+ details.push(...formula.custom_modified.map(m =>
+ `${m}`
+ ));
+ }
+ if (formula.custom_added && formula.custom_added.length > 0) {
+ details.push(...formula.custom_added.map(a =>
+ `+${a}`
+ ));
+ }
+ if (formula.custom_removed && formula.custom_removed.length > 0) {
+ details.push(...formula.custom_removed.map(r =>
+ `-${r}`
+ ));
+ }
+ if (details.length > 0) {
+ customInfo = `
${details.join('')}`;
+ }
+ } else if (formula.official_formula_id && !formula.is_custom) {
+ customInfo = ` 원방 그대로`;
+ }
+
tbody.append(`