/* S10 求人管理（複数求人の一覧・作成・編集／病院プロフィール連携） */
const { useState } = React;
const fInp2 = { width: "100%", padding: "10px 13px", borderRadius: 10, border: "1px solid var(--border-strong)", fontSize: 13.5, fontFamily: "var(--sans)", color: "var(--ink)", fontWeight: 500, background: "#fff", outline: "none" };
const fInpLinked = { ...fInp2, background: "var(--brand-50)", borderColor: "var(--brand-100)", color: "var(--brand-800)", cursor: "not-allowed" };
// 連携の解決：linked が true ならプロフィール値、false なら求人固有値
const resolveContent = (j, P) => (j.linked.content ? P.jobIntro : j.content);
const resolveNeeds = (j, P) => (j.linked.needs ? P.needs.join(" ／ ") : j.needs);
const resolveAppeals = (j, P) => (j.linked.appeals ? P.appeals : j.appeals);
const STATUS = {
published: { label: "公開中", c: "var(--fit)", bg: "var(--fit-bg)" },
draft: { label: "下書き", c: "var(--ink-3)", bg: "var(--surface-3)" },
};
/* ============================ エディタ用モジュールスコープコンポーネント ============================ */
/* NOTE: これらを JobEditor 内で定義すると、タイピング時に state 更新 → 再レンダーのたびに
新しい関数参照になり React が unmount/remount するため input からフォーカスが外れる。
モジュールスコープに定義することで参照が安定し、タイピングが正常に動作する。 */
function EditorSection({ icon: Icon, title, sub, right, children }) {
return (
{title}
{right}
{sub &&
{sub}
}
{children}
);
}
const EditorLabel = ({ children }) => (
{children}
);
const EditorField = ({ label, children, full }) => (
);
const EditorChip = ({ on, onClick, children, disabled }) => (
);
function EditorSelect({ value, onChange, options }) {
return (
);
}
const EditorLinkToggle = ({ field, linked, onToggle }) => {
const on = linked[field];
return (
);
};
function JobPostScreen({ nav, onScout }) {
const { HOSPITAL, PROFILE, JOBS } = window.SV_DATA;
const { Button, Card, Note, Pill } = window.SV_UI;
const Icons = window.SV_Icons;
const [jobs, setJobs] = useState(() => JSON.parse(JSON.stringify(JOBS)));
const [view, setView] = useState("list"); // "list" | "editor"
const [editing, setEditing] = useState(null); // 編集中の作業コピー
const newJob = () => ({
id: "job-" + Date.now(), title: "", roles: ["獣医師"], employment: "正社員（新卒）",
headcount: 1, start: "2027年4月", location: "東久留米院", payMin: 25, payMax: 35,
hours: "9:00–18:00（実働8h・シフト制）", holidays: "週休2日制",
benefits: ["社会保険完備"], content: "", appeals: [], needs: "",
plan: "プレミアム", status: "draft", applicants: 0, updated: "今日",
linked: { content: true, appeals: true, needs: true },
});
const openEditor = (job) => { setEditing(JSON.parse(JSON.stringify(job))); setView("editor"); };
const saveJob = (status) => {
const e = { ...editing, status: status || editing.status, updated: "今日" };
setJobs((prev) => prev.some((x) => x.id === e.id) ? prev.map((x) => (x.id === e.id ? e : x)) : [e, ...prev]);
setView("list");
};
const duplicateJob = (job) => {
const copy = { ...JSON.parse(JSON.stringify(job)), id: "job-" + Date.now(), title: job.title + "（コピー）", status: "draft", applicants: 0, updated: "今日" };
setJobs((prev) => [copy, ...prev]);
};
const removeJob = (id) => setJobs((prev) => prev.filter((x) => x.id !== id));
const toggleStatus = (id) => setJobs((prev) => prev.map((x) => (x.id === id ? { ...x, status: x.status === "published" ? "draft" : "published" } : x)));
return view === "list"
?
: ;
}
/* ============================ 一覧 ============================ */
function JobList({ jobs, PROFILE, HOSPITAL, openEditor, newJob, duplicateJob, removeJob, toggleStatus, nav, Icons, Button, Card, Note }) {
const published = jobs.filter((j) => j.status === "published").length;
const IconBtn = ({ icon: Icon, label, onClick, danger }) => (
);
return (
求人管理
求人 {jobs.length} 件 （公開中 {published}）
各求人は病院プロフィール（診療内容・アピール・求める人材像）と連携できます。連携中の項目はプロフィールを編集すると自動で全求人に反映され、個別に上書きも可能です。
{jobs.map((j) => {
const st = STATUS[j.status];
const linkCount = Object.values(j.linked).filter(Boolean).length;
return (
openEditor(j)} style={{ display: "flex", gap: 18, alignItems: "flex-start" }}>
{st.label}
{j.roles.map((r) => {r})}
{linkCount > 0 && 連携 {linkCount}}
{j.title || "（無題の求人）"}
{j.payMin}〜{j.payMax}万円
{j.start}
{j.location}
{j.employment}・{j.headcount}名
応募 {j.applicants} 名
e.stopPropagation()}>
openEditor(j)} />
toggleStatus(j.id)} />
duplicateJob(j)} />
removeJob(j.id)} />
更新 {j.updated}
);
})}
{jobs.length === 0 && (
求人がありません。
)}
);
}
const Fact = ({ icon: Icon, children }) => (
{children}
);
/* ============================ エディタ ============================ */
function JobEditor({ editing: j, setEditing, saveJob, PROFILE, HOSPITAL, Icons, Button, Card, Note }) {
const set = (patch) => setEditing((p) => ({ ...p, ...patch }));
const toggleIn = (key, v) => set({ [key]: j[key].includes(v) ? j[key].filter((x) => x !== v) : [...j[key], v] });
const [benefitInput, setBenefitInput] = useState("");
const addBenefit = () => { const v = benefitInput.trim(); if (v && !j.benefits.includes(v)) set({ benefits: [...j.benefits, v] }); setBenefitInput(""); };
// 連携トグル：OFF にするときはプロフィール値を求人固有値へコピーして編集可能に
const toggleLink = (field) => setEditing((p) => {
const wasLinked = p.linked[field];
const linked = { ...p.linked, [field]: !wasLinked };
const patch = { linked };
if (wasLinked) {
if (field === "content") patch.content = PROFILE.jobIntro;
if (field === "needs") patch.needs = PROFILE.needs.join(" ／ ");
if (field === "appeals") patch.appeals = [...PROFILE.appeals];
}
return { ...p, ...patch };
});
const roleOpts = ["獣医師", "動物看護師", "トリマー", "受付・事務"];
const empOpts = ["正社員（新卒）", "正社員（中途）", "パート・アルバイト"];
const startOpts = ["2027年4月", "2028年4月", "通年・応相談"];
const locOpts = ["東久留米院", "武蔵小金井院", "両院（応相談）"];
const planOpts = ["プレミアム", "スポンサー"];
const appealPresets = ["担当医制", "EBM（根拠重視）", "腫瘍・先端医療", "大学病院連携", "教育体制充実", "残業少なめ", "女性活躍", "院長が若手"];
const contentVal = resolveContent(j, PROFILE);
const needsVal = resolveNeeds(j, PROFILE);
const appealsVal = resolveAppeals(j, PROFILE);
return (