// 爆文库管理（官方精选爆款笔记，C端爆文库 + AI 仿写素材）
const { useState: VS, useEffect: VE, useCallback: VC } = React;
const {
	Card: VC1, Table: VT, Button: VB, Modal: VM, Form: VF, Input: VI, Select: VS2,
	Switch: VW, Popconfirm: VP, message: VMg, Space: VSP, Tag: VTg
} = antd;

NR.Pages.ViralPage = function ViralPage() {
	const [list, setList] = VS([]);
	const [total, setTotal] = VS(0);
	const [page, setPage] = VS(1);
	const [loading, setLoading] = VS(false);
	const [modalOpen, setModalOpen] = VS(false);
	const [editing, setEditing] = VS(null);
	const [form] = VF.useForm();

	const load = VC(async (p = 1, kw = "", industry = "") => {
		setLoading(true);
		try {
			const data = await NR.api("viral_list", { page: p, size: 10, keyword: kw, industry });
			setList(data.list); setTotal(data.total); setPage(data.page);
		} catch (e) { VMg.error(e.message); }
		finally { setLoading(false); }
	}, []);

	VE(() => { load(); }, []);

	const openEdit = (record) => {
		setEditing(record || null);
		setModalOpen(true);
		setTimeout(() => {
			form.setFieldsValue(record ? {
				industry: record.industry, title: record.title, content: record.content,
				tags: record.tags, cover: record.cover, source: record.source,
				enabled: Number(record.enabled) === 1,
			} : { enabled: true, industry: "装修", source: "官方精选", cover: "linear-gradient(135deg,#667eea,#764ba2)" });
		}, 0);
	};

	const save = async () => {
		const values = await form.validateFields();
		try {
			await NR.api("viral_save", {
				viral_id: editing ? editing.viral_id : 0,
				industry: values.industry || "通用", title: values.title,
				content: values.content || "", tags: values.tags || "",
				cover: values.cover || "", source: values.source || "官方精选",
				enabled: values.enabled ? 1 : 0,
			}, "POST");
			VMg.success("已保存"); setModalOpen(false); load(page);
		} catch (e) { VMg.error(e.message); }
	};

	const del = async (record) => {
		try {
			await NR.api("viral_del", { viral_id: record.viral_id }, "POST");
			VMg.success("已删除"); load(page);
		} catch (e) { VMg.error(e.message); }
	};

	const columns = [
		{ title: "ID", dataIndex: "viral_id", width: 60 },
		{ title: "行业", dataIndex: "industry", width: 80, render: v => <VTg color="blue">{v}</VTg> },
		{ title: "标题", dataIndex: "title", width: 300, ellipsis: true },
		{ title: "内容", dataIndex: "content", ellipsis: true },
		{ title: "标签", dataIndex: "tags", width: 180, ellipsis: true },
		{ title: "被用", dataIndex: "use_count", width: 70 },
		{ title: "启用", dataIndex: "enabled", width: 70, render: v => Number(v) === 1 ? <VTg color="green">是</VTg> : <VTg>否</VTg> },
		{
			title: "操作", width: 140, render: (_, r) => (
				<VSP>
					<VB size="small" onClick={() => openEdit(r)}>编辑</VB>
					<VP title="确认删除？" onConfirm={() => del(r)}>
						<VB size="small" danger>删除</VB>
					</VP>
				</VSP>
			)
		},
	];

	return (
		<VC1
			title="爆文库（C端精选笔记库 + AI 仿写素材）"
			extra={
				<VSP>
					<VI.Search placeholder="搜索标题/内容/标签" allowClear style={{ width: 220 }} onSearch={kw => load(1, kw)} />
					<VB type="primary" onClick={() => openEdit(null)}>新增笔记</VB>
				</VSP>
			}
		>
			<VT
				rowKey="viral_id" columns={columns} dataSource={list} loading={loading}
				pagination={{ current: page, total, pageSize: 10, showTotal: t => `共 ${t} 条`, onChange: p => load(p) }}
			/>
			<VM
				title={editing ? "编辑笔记" : "新增笔记"} open={modalOpen}
				onOk={save} onCancel={() => setModalOpen(false)} width={640} destroyOnClose
			>
				<VF form={form} layout="vertical">
					<VF.Item name="industry" label="行业">
						<VS2 options={["装修", "厨房", "收纳", "食品", "家电", "养生", "餐饮", "美业", "零售", "通用"].map(v => ({ value: v, label: v }))} />
					</VF.Item>
					<VF.Item name="title" label="标题" rules={[{ required: true, message: "必填" }]}>
						<VI placeholder="爆款标题：数字+钩子词" />
					</VF.Item>
					<VF.Item name="content" label="正文" rules={[{ required: true, message: "必填" }]}>
						<VI.TextArea rows={8} placeholder="300-500 字，短段落，适度 emoji" />
					</VF.Item>
					<VF.Item name="tags" label="标签（逗号分隔）">
						<VI placeholder="装修日记,老房翻新,避坑指南" />
					</VF.Item>
					<VF.Item name="cover" label="封面图 URL（留空则前端渐变兜底）">
						<VI placeholder="https://... 或留空" />
					</VF.Item>
					<VF.Item name="source" label="来源"><VI placeholder="官方精选" /></VF.Item>
					<VF.Item name="enabled" label="启用" valuePropName="checked"><VW /></VF.Item>
				</VF>
			</VM>
		</VC1>
	);
};