import AddOutlined from "@mui/icons-material/AddOutlined";
import Checkbox from "@mui/material/Checkbox";
import Dialog from "@mui/material/Dialog";
import DialogActions from "@mui/material/DialogActions";
import DialogContent from "@mui/material/DialogContent";
import DialogTitle from "@mui/material/DialogTitle";
import FormControlLabel from "@mui/material/FormControlLabel";
import MenuItem from "@mui/material/MenuItem";
import TextField from "@mui/material/TextField";
import { useMemo, useState } from "react";
import { AdminSwitch } from "@/shared/ui/AdminSwitch.jsx";
import { Button } from "@/shared/ui/Button.jsx";
import { formatDecimal } from "@/shared/utils/rtpProbability.js";
import {
    applyDynamicStrategyDefaults,
    configToForm,
    correctAllStageProbabilities,
    formToConfig,
    nextStageMultiplier,
    stageSummary,
    validateLuckyGiftForm,
} from "../configForm.js";
import { formatNumber, formatPercent } from "../format.js";
import { OpsStatusBadge } from "./OpsStatusBadge.jsx";

export function LuckyGiftConfigDialog({ appOptions = [], config, mode = "edit", onClose, onSubmit, saving }) {
    const [form, setForm] = useState(() => configToForm(config));
    const [activeStage, setActiveStage] = useState("novice");
    const [validationErrors, setValidationErrors] = useState([]);

    const stageSummaries = useMemo(() => form.stages.map((stage) => stageSummary(stage, form)), [form]);
    const activeStageKey = form.stages.some((stage) => stage.stage === activeStage)
        ? activeStage
        : form.stages[0]?.stage;
    const activeStageConfig = form.stages.find((stage) => stage.stage === activeStageKey);
    const activeSummary = stageSummaries.find((summary) => summary.stageKey === activeStageKey);

    const updateField = (field, value) => {
        setValidationErrors([]);
        setForm((current) => {
            const next = { ...current, [field]: value };
            if (field === "strategy_version" && value === "dynamic_v3" && current.strategy_version !== "dynamic_v3") {
                return applyDynamicStrategyDefaults(next);
            }
            // 目标 RTP 决定各奖档概率的闭合解，改动后全部阶段重算，避免展示的概率和将要发布的值不一致。
            return field === "target_rtp_percent" ? correctAllStageProbabilities(next) : next;
        });
    };

    const updateStageField = (stageKey, field, value) => {
        setValidationErrors([]);
        setForm((current) => ({
            ...current,
            stages: current.stages.map((stage) => (stage.stage === stageKey ? { ...stage, [field]: value } : stage)),
        }));
    };

    const updateStageTier = (stageKey, tierIndex, patch) => {
        setValidationErrors([]);
        setForm((current) =>
            correctAllStageProbabilities({
                ...current,
                stages: current.stages.map((stage) =>
                    stage.stage === stageKey
                        ? {
                              ...stage,
                              tiers: stage.tiers.map((tier, index) =>
                                  index === tierIndex ? { ...tier, ...patch } : tier,
                              ),
                          }
                        : stage,
                ),
            }),
        );
    };

    const addStageTier = (stageKey) => {
        setValidationErrors([]);
        setForm((current) =>
            correctAllStageProbabilities({
                ...current,
                stages: current.stages.map((stage) =>
                    stage.stage === stageKey
                        ? {
                              ...stage,
                              tiers: [
                                  ...stage.tiers,
                                  {
                                      enabled: true,
                                      // 10 倍以上属于高倍档，默认只在奖池高水位时开放，防止新档位直接击穿保底线。
                                      highWaterOnly: nextStageMultiplier(stage.tiers) >= 10,
                                      multiplier: String(nextStageMultiplier(stage.tiers)),
                                      probabilityPercent: "0",
                                      tierId: "",
                                  },
                              ],
                          }
                        : stage,
                ),
            }),
        );
    };

    const removeStageTier = (stageKey, tierIndex) => {
        setValidationErrors([]);
        setForm((current) =>
            correctAllStageProbabilities({
                ...current,
                stages: current.stages.map((stage) =>
                    stage.stage === stageKey
                        ? { ...stage, tiers: stage.tiers.filter((_, index) => index !== tierIndex) }
                        : stage,
                ),
            }),
        );
    };

    const handleSubmit = (event) => {
        event.preventDefault();
        const errors = validateLuckyGiftForm(form);
        if (errors.length) {
            setValidationErrors(errors);
            return;
        }
        onSubmit(formToConfig(config, form));
    };

    const isCreate = mode === "create";
    const title = isCreate ? "添加幸运礼物配置" : config.is_default ? "发布幸运礼物配置" : "新增幸运礼物版本";

    return (
        <Dialog fullWidth maxWidth="lg" open onClose={saving ? undefined : onClose}>
            <form className="ops-config-form" onSubmit={handleSubmit}>
                <DialogTitle className="ops-config-title">
                    <span>{title}</span>
                    <small>
                        {form.app_code || "-"} / {form.pool_id || "default"} /{" "}
                        {config.is_default || isCreate ? "默认草稿" : `当前版本 v${config.rule_version ?? "-"}`}
                    </small>
                </DialogTitle>
                <DialogContent dividers>
                    <div className="ops-config-metrics">
                        <ConfigMetric label="应用" value={form.app_code || "-"} />
                        <ConfigMetric label="奖池" value={form.pool_id || "default"} />
                        <ConfigMetric label="策略" value={form.strategy_version} />
                        <ConfigMetric label="目标 RTP" value={formatPercent(Number(form.target_rtp_percent))} />
                        <ConfigMetric
                            label="资金拆分"
                            value={`${form.pool_rate_percent}% / ${form.profit_rate_percent}% / ${form.anchor_rate_percent}%`}
                        />
                        <ConfigMetric label="结算窗口" value={formatNumber(Number(form.settlement_window_wager))} />
                        <ConfigMetric label="状态" value={form.enabled ? "启用" : "停用"} />
                    </div>

                    {validationErrors.length ? (
                        <div className="ops-config-validation" role="alert">
                            <strong>配置不能发布</strong>
                            <ul>
                                {validationErrors.map((message) => (
                                    <li key={message}>{message}</li>
                                ))}
                            </ul>
                        </div>
                    ) : null}

                    <div className="ops-config-layout">
                        <aside className="ops-config-params" aria-label="基础参数">
                            <section className="ops-config-section">
                                <h3>规则身份</h3>
                                {isCreate ? (
                                    <TextField
                                        fullWidth
                                        required
                                        label="应用"
                                        select
                                        size="small"
                                        value={form.app_code}
                                        onChange={(event) => updateField("app_code", event.target.value)}
                                    >
                                        {appOptions.map(([value, label]) => (
                                            <MenuItem key={value} value={value}>
                                                {label}
                                            </MenuItem>
                                        ))}
                                    </TextField>
                                ) : (
                                    <TextField disabled fullWidth label="应用" size="small" value={form.app_code} />
                                )}
                                <TextField
                                    fullWidth
                                    required
                                    helperText="修改奖池 ID 会发布到新的奖池，不影响原奖池"
                                    label="奖池"
                                    size="small"
                                    value={form.pool_id}
                                    onChange={(event) => updateField("pool_id", event.target.value)}
                                />
                                <TextField
                                    fullWidth
                                    label="策略版本"
                                    select
                                    size="small"
                                    value={form.strategy_version}
                                    onChange={(event) => updateField("strategy_version", event.target.value)}
                                >
                                    <MenuItem value="dynamic_v3">dynamic_v3</MenuItem>
                                    <MenuItem value="fixed_v2">fixed_v2（历史兼容）</MenuItem>
                                </TextField>
                                <FormControlLabel
                                    control={
                                        <AdminSwitch
                                            checked={form.enabled}
                                            onChange={(event) => updateField("enabled", event.target.checked)}
                                        />
                                    }
                                    label={form.enabled ? "发布后立即启用" : "发布后保持停用"}
                                    sx={{ gap: 1, marginLeft: 0 }}
                                />
                            </section>

                            <section className="ops-config-section">
                                <h3>RTP 与奖池</h3>
                                <div className="ops-form-grid">
                                    <NumberField
                                        form={form}
                                        label="目标 RTP (%)"
                                        name="target_rtp_percent"
                                        step="0.01"
                                        onChange={updateField}
                                    />
                                    <NumberField
                                        form={form}
                                        label="公共奖池 (%)"
                                        name="pool_rate_percent"
                                        step="0.01"
                                        onChange={updateField}
                                    />
                                    <NumberField
                                        form={form}
                                        label="平台盈利 (%)"
                                        name="profit_rate_percent"
                                        step="0.01"
                                        onChange={updateField}
                                    />
                                    <NumberField
                                        form={form}
                                        helperText="必须与该奖池实际送礼类型（lucky / super_lucky）在各适用地区的返币比例一致，否则开奖账务校验会失败"
                                        label="主播收益 (%)"
                                        name="anchor_rate_percent"
                                        step="0.01"
                                        onChange={updateField}
                                    />
                                    <NumberField
                                        form={form}
                                        label="控制带宽 (%)"
                                        name="control_band_percent"
                                        step="0.01"
                                        onChange={updateField}
                                    />
                                    <NumberField
                                        form={form}
                                        label="结算窗口流水"
                                        name="settlement_window_wager"
                                        onChange={updateField}
                                    />
                                    <NumberField
                                        form={form}
                                        label="礼物参考金额"
                                        name="gift_price_reference"
                                        onChange={updateField}
                                    />
                                    <NumberField
                                        form={form}
                                        label="新手等价抽数"
                                        name="novice_max_equivalent_draws"
                                        onChange={updateField}
                                    />
                                    <NumberField
                                        form={form}
                                        label="普通等价抽数"
                                        name="normal_max_equivalent_draws"
                                        onChange={updateField}
                                    />
                                </div>
                            </section>
                            {form.strategy_version === "dynamic_v3" ? (
                                <DynamicStrategySections form={form} onChange={updateField} />
                            ) : null}
                        </aside>

                        <section className="ops-stage-designer" aria-label="阶段奖档设计">
                            <div className="ops-stage-tabs" role="tablist" aria-label="阶段奖档">
                                {stageSummaries.map((summary) => (
                                    <button
                                        aria-selected={summary.stageKey === activeStageKey}
                                        className={`ops-stage-tab ${summary.stageKey === activeStageKey ? "is-active" : ""} ${summary.ok ? "is-ok" : "is-warn"}`}
                                        key={summary.stageKey}
                                        role="tab"
                                        type="button"
                                        onClick={() => setActiveStage(summary.stageKey)}
                                    >
                                        <span>{summary.tabLabel}</span>
                                    </button>
                                ))}
                            </div>
                            {activeStageConfig ? (
                                <div className="ops-stage-stack">
                                    <div className="ops-stage-block__head">
                                        <div>
                                            <h3>{activeSummary?.stageLabel}</h3>
                                            <OpsStatusBadge
                                                label={`${activeSummary?.status} · 概率 ${formatDecimal(activeSummary?.probability)}% · 期望 RTP ${formatDecimal(activeSummary?.expected)}%`}
                                                tone={activeSummary?.ok ? "succeeded" : "warning"}
                                            />
                                        </div>
                                        <Button
                                            startIcon={<AddOutlined fontSize="small" />}
                                            onClick={() => addStageTier(activeStageConfig.stage)}
                                        >
                                            添加奖档
                                        </Button>
                                    </div>
                                    {form.strategy_version === "dynamic_v3" ? (
                                        <div className="ops-stage-thresholds">
                                            <TextField
                                                disabled={activeStageConfig.stage === "novice"}
                                                label="7 日充值门槛"
                                                size="small"
                                                slotProps={{ htmlInput: { min: 0, step: 1 } }}
                                                type="number"
                                                value={activeStageConfig.min_recharge_7d_coins}
                                                onChange={(event) =>
                                                    updateStageField(
                                                        activeStageConfig.stage,
                                                        "min_recharge_7d_coins",
                                                        event.target.value,
                                                    )
                                                }
                                            />
                                            <TextField
                                                disabled={activeStageConfig.stage === "novice"}
                                                label="30 日充值门槛"
                                                size="small"
                                                slotProps={{ htmlInput: { min: 0, step: 1 } }}
                                                type="number"
                                                value={activeStageConfig.min_recharge_30d_coins}
                                                onChange={(event) =>
                                                    updateStageField(
                                                        activeStageConfig.stage,
                                                        "min_recharge_30d_coins",
                                                        event.target.value,
                                                    )
                                                }
                                            />
                                        </div>
                                    ) : null}
                                    <div className="ops-tier-table">
                                        <div className="ops-tier-head" aria-hidden="true">
                                            <span>倍率</span>
                                            <span>概率 %</span>
                                            <span>高水位</span>
                                            <span>启用</span>
                                            <span>操作</span>
                                        </div>
                                        {activeStageConfig.tiers.map((tier, index) => (
                                            <div className="ops-tier-row" key={`${activeStageConfig.stage}-${index}`}>
                                                <TextField
                                                    required
                                                    size="small"
                                                    slotProps={{
                                                        htmlInput: { "aria-label": "倍率", min: 0, step: "0.01" },
                                                    }}
                                                    type="number"
                                                    value={tier.multiplier}
                                                    onChange={(event) =>
                                                        updateStageTier(activeStageConfig.stage, index, {
                                                            // 10 倍及以上强制只走高水位，输入时同步勾选并锁死，防止高倍档在低水位放开。
                                                            highWaterOnly:
                                                                Number(event.target.value) >= 10 || tier.highWaterOnly,
                                                            multiplier: event.target.value,
                                                        })
                                                    }
                                                />
                                                {/* 概率由目标 RTP 和倍率统一校正，保持只读可以避免运营手填后绕过服务端概率闭合校验。 */}
                                                <TextField
                                                    size="small"
                                                    slotProps={{
                                                        htmlInput: { "aria-label": "概率 %", readOnly: true },
                                                    }}
                                                    value={formatDecimal(tier.probabilityPercent)}
                                                />
                                                <Checkbox
                                                    checked={Boolean(tier.highWaterOnly)}
                                                    disabled={Number(tier.multiplier) >= 10}
                                                    size="small"
                                                    slotProps={{ input: { "aria-label": "高水位" } }}
                                                    onChange={(event) =>
                                                        updateStageTier(activeStageConfig.stage, index, {
                                                            highWaterOnly: event.target.checked,
                                                        })
                                                    }
                                                />
                                                <Checkbox
                                                    checked={tier.enabled !== false}
                                                    size="small"
                                                    slotProps={{ input: { "aria-label": "启用" } }}
                                                    onChange={(event) =>
                                                        updateStageTier(activeStageConfig.stage, index, {
                                                            enabled: event.target.checked,
                                                        })
                                                    }
                                                />
                                                <Button
                                                    disabled={activeStageConfig.tiers.length <= 1}
                                                    variant="danger"
                                                    onClick={() => removeStageTier(activeStageConfig.stage, index)}
                                                >
                                                    删除
                                                </Button>
                                            </div>
                                        ))}
                                    </div>
                                </div>
                            ) : null}
                        </section>
                    </div>
                </DialogContent>
                <DialogActions>
                    <Button disabled={saving} onClick={onClose}>
                        取消
                    </Button>
                    <Button disabled={saving} type="submit" variant="primary">
                        {saving ? "保存中" : "保存配置"}
                    </Button>
                </DialogActions>
            </form>
        </Dialog>
    );
}

function DynamicStrategySections({ form, onChange }) {
    return (
        <>
            <section className="ops-config-section">
                <h3>动态水位</h3>
                <div className="ops-form-grid">
                    <NumberField
                        disabled
                        form={form}
                        helperText="dynamic_v3 发布规则不注资，请在奖池水位中添加金币"
                        label="初始奖池金币"
                        name="initial_pool_coins"
                        onChange={onChange}
                    />
                    <NumberField form={form} label="连续未中奖保护" name="loss_streak_guarantee" onChange={onChange} />
                    <NumberField form={form} label="低水位金币" name="low_watermark_coins" onChange={onChange} />
                    <NumberField
                        form={form}
                        label="低水位非零因子 (%)"
                        name="low_water_nonzero_factor_percent"
                        step="0.01"
                        onChange={onChange}
                    />
                    <NumberField form={form} label="高水位金币" name="high_watermark_coins" onChange={onChange} />
                    <NumberField
                        form={form}
                        label="高水位非零因子 (%)"
                        name="high_water_nonzero_factor_percent"
                        step="0.01"
                        onChange={onChange}
                    />
                    <NumberField
                        form={form}
                        label="充值加权窗口 (ms)"
                        name="recharge_boost_window_ms"
                        onChange={onChange}
                    />
                    <NumberField
                        form={form}
                        label="充值加权因子 (%)"
                        name="recharge_boost_factor_percent"
                        step="0.01"
                        onChange={onChange}
                    />
                </div>
            </section>

            <section className="ops-config-section">
                <h3>大奖控制</h3>
                <div className="ops-form-grid">
                    <TextField
                        className="ops-form-grid__wide"
                        helperText="按从小到大填写，使用逗号分隔"
                        label="大奖倍率"
                        required
                        size="small"
                        value={form.jackpot_multipliers}
                        onChange={(event) => onChange("jackpot_multipliers", event.target.value)}
                    />
                    <NumberField
                        form={form}
                        label="全局大奖 RTP 上限 (%)"
                        name="jackpot_global_rtp_max_percent"
                        step="0.01"
                        onChange={onChange}
                    />
                    <NumberField
                        form={form}
                        label="用户每日 RTP 上限 (%)"
                        name="jackpot_user_day_rtp_max_percent"
                        step="0.01"
                        onChange={onChange}
                    />
                    <NumberField
                        form={form}
                        label="用户 72 小时 RTP 上限 (%)"
                        name="jackpot_user_72h_rtp_max_percent"
                        step="0.01"
                        onChange={onChange}
                    />
                    <NumberField
                        form={form}
                        label="用户每日大奖次数"
                        name="max_jackpot_hits_per_user_day"
                        onChange={onChange}
                    />
                    <NumberField
                        form={form}
                        label="50 美元等值消费门槛"
                        name="jackpot_spend_threshold_coins"
                        onChange={onChange}
                    />
                </div>
            </section>

            <section className="ops-config-section">
                <h3>六维返奖上限</h3>
                <div className="ops-form-grid">
                    <NumberField form={form} label="单次返奖上限" name="max_single_payout" onChange={onChange} />
                    <NumberField form={form} label="用户小时上限" name="user_hourly_payout_cap" onChange={onChange} />
                    <NumberField form={form} label="用户每日上限" name="user_daily_payout_cap" onChange={onChange} />
                    <NumberField form={form} label="设备每日上限" name="device_daily_payout_cap" onChange={onChange} />
                    <NumberField form={form} label="房间小时上限" name="room_hourly_payout_cap" onChange={onChange} />
                    <NumberField form={form} label="主播每日上限" name="anchor_daily_payout_cap" onChange={onChange} />
                </div>
            </section>
        </>
    );
}

function ConfigMetric({ label, value }) {
    return (
        <article className="ops-config-metric">
            <span>{label}</span>
            <strong>{value}</strong>
        </article>
    );
}

function NumberField({ disabled = false, form, helperText, label, name, onChange, step = "1" }) {
    return (
        <TextField
            disabled={disabled}
            helperText={helperText}
            label={label}
            required
            size="small"
            slotProps={{ htmlInput: { min: 0, step } }}
            type="number"
            value={form[name]}
            onChange={(event) => onChange(name, event.target.value)}
        />
    );
}
