<!-- components/FormPage.vue -->
<template>
    <div class="form-page">
        <el-form ref="formRef" :model="localData" label-width="120px" size="default">
            <!-- Tabs -->
            <el-tabs v-model="activeTab" @tab-click="handleTabClick" :before-leave="handleBeforeLeave">
                <el-tab-pane label="基础信息" name="basic"></el-tab-pane>
                <el-tab-pane label="产品计划" name="productPlan"></el-tab-pane>
                <el-tab-pane label="首期缴费" name="firstPayment"></el-tab-pane>
                <el-tab-pane label="介绍人" name="introducer"></el-tab-pane>
                <el-tab-pane label="邮寄信息" name="postal"></el-tab-pane>
                <el-tab-pane label="关联记录" name="related"></el-tab-pane>
                <el-tab-pane label="附件" name="attachment"></el-tab-pane>
            </el-tabs>

            <!-- 基础信息 Tab 内容 -->
            <div v-if="activeTab === 'basic'" class="tab-content">
                <!-- 签单信息 -->
                <div class="section">
                    <h3 class="sectionTitle">基础信息</h3>
                    <SearchForm ref="basicInfoFormRef" :config="basicInfoFormConfig" v-model="basicInfoFormData" />
                </div>

                <!-- 保单信息 -->
                <div class="section">
                    <h3 class="sectionTitle">保单信息</h3>
                    <SearchForm ref="policyInfoFormRef" :config="policyInfoFormConfig" v-model="policyInfoFormData" />
                </div>


            </div>
            <!-- 产品计划 Tab 内容 -->
            <div v-else-if="activeTab === 'productPlan'" class="tab-content">
                <!-- 基本计划 -->
                <div class="section">
                    <h3 class="sectionTitle">基本计划</h3>
                    <SearchForm ref="basicPlanFormRef" :config="basicPlanFormConfig" v-model="basicPlanFormData"
                        @selectChange="(prop, value, item) => handleSelectChange(prop, value, item, 'basicPlan')" />
                </div>

                <!-- 附加计划（可编辑表格） -->
                <div class="section">
                    <h3 class="sectionTitle">附加计划</h3>
                    <EditableTable v-model="localData.additionalPlans" :row-config="additionalPlansConfig"
                        @batch-save="handleBatchSave" :disabled="props.mode === 'viewDetail'" />
                </div>
            </div>
            <!-- 首期缴费 Tab 内容 -->
            <div v-else-if="activeTab === 'firstPayment'" class="tab-content">
                <!-- 签单信息 -->
                <div class="section">
                    <h3 class="sectionTitle">缴费信息</h3>
                    <SearchForm ref="firstPremiumFormRef" :config="firstPremiumFormConfig"
                        v-model="firstPremiumFormData" />
                    <h3 class="sectionTitle">首期对账信息</h3>
                    <el-table :data="firstPremiumTableData" border style="width: 100%">
                        <el-table-column prop="createTime" label="申请对账日期" width="180"
                            :formatter="(row, col, val) => formatToDateTime(val, 'YYYY-MM-DD HH:mm:ss')" />
                        <el-table-column prop="reconciliationStatus" label="对账状态" width="180" />
                        <el-table-column prop="paymentMethod" label="缴费方式" width="180" />
                        <el-table-column prop="paymentAmount" label="汇款金额" width="180" />
                        <el-table-column prop="paymentCurrency" label="汇款币种" width="180" />
                        <el-table-column prop="recognizedAmount" label="认定金额" width="180" />
                        <el-table-column prop="recognizedCurrency" label="认定币种" width="180" />
                    </el-table>
                </div>
            </div>
            <!-- 介绍人 Tab 内容 -->
            <div v-else-if="activeTab === 'introducer'" class="tab-content">
                <!-- 签单信息 -->
                <div class="section">
                    <h3 class="sectionTitle">介绍人信息</h3>
                    <h5>第一位默认是客户主要负责人，客户资料出现在介绍人（主）账号下，其他介绍人不会看到客户信息</h5>
                    <EditableTable v-model="introducerTableData" :row-config="introducerConfig"
                        @batch-save="handleBatchSave" :disabled="props.mode === 'viewDetail'" />
                </div>
            </div>
            <!-- 邮寄信息 Tab 内容 -->
            <div v-else-if="activeTab === 'postal'" class="tab-content">
                <div class="section">
                    <h3 class="sectionTitle">邮寄信息</h3>
                    <SearchForm ref="postalFormRef" :config="postalFormConfig" v-model="postalFormData" />
                </div>
            </div>
            <!-- 关联记录 Tab 内容 -->
            <div v-else-if="activeTab === 'related'" class="tab-content">
                <div class="section">
                    <h3 class="sectionTitle">关联记录</h3>
                    <el-table :data="relatedTableData" border style="width: 100%">
                        <el-table-column prop="fnaNo" label="流程编号" width="180" />
                        <el-table-column prop="policyNo" label="保单号" width="180" />
                        <el-table-column prop="customerName" label="客户姓名" width="180" />
                        <el-table-column prop="createTime" label="创建时间" width="180"
                            :formatter="(row) => formatToDate(row.createTime)" />
                        <el-table-column fixed="right" label="操作" min-width="120">
                            <template #default>
                                <el-button link type="primary" size="small" @click="viewRecordDetail">
                                    查看
                                </el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
            </div>
            <!-- 附件 Tab 内容 -->
            <div v-else-if="activeTab === 'attachment'" class="tab-content">
                <div class="section">
                    <h3 class="sectionTitle">附件</h3>
                    <el-button type="primary" @click="fileUploadDialogFlag = true"
                        :disabled="props.mode === 'viewDetail'">
                        <el-icon class="el-icon--right">
                            <Upload />
                        </el-icon>上传附件
                    </el-button>
                    <el-table :data="attachmentTableData" border style="width: 100%">
                        <el-table-column v-for="(column, index) in attachmentTableColumns" :key="index"
                            :prop="column.prop" :label="column.label" :width="column.width" :sortable="column.sortable"
                            :formatter="column.formatter" />
                        <el-table-column fixed="right" label="操作" min-width="120">
                            <template #default>
                                <el-button link type="primary" size="small" @click="handleClick"
                                    :disabled="props.mode === 'viewDetail'">
                                    修改
                                </el-button><el-button link type="danger" size="small" @click="handleClick"
                                    :disabled="props.mode === 'viewDetail'">
                                    删除
                                </el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
            </div>
            <!-- 其他 Tab 占位（你可以按需填充） -->
            <div v-else class="tab-placeholder">
                <el-empty description="该 Tab 内容待开发" />
            </div>
            <!-- 底部按钮 -->
            <div class="form-footer">
                <el-button size="default" @click="handleCancel">取消</el-button>
                <el-button type="primary" size="default" @click="handleSubmit">确认</el-button>
            </div>
        </el-form>

        <CommonDialog dialogTitle='文件导入' dialogWidth='80%' :openDialog=fileUploadDialogFlag :showAction='true'
            :showClose='true' @close='fileUploadDialogFlag = false; files = ""'
            @confirm='fileUploadDialogFlag = false; files = ""'>
            <FileUpload v-model="files" :data="{ obiectTableName: 'policy_follow', objectBizId: props.policyBizId }"
                :file-type="['xlsx', 'xls', 'doc', 'docx', 'pdf', 'txt', 'jpg', 'jpeg', 'png', 'gif']"
                :action="'/oss/api/oss/batch/upload'" :limit="10" :fileSize="15" :name="'files'"
                @uploadEnd="handleUploadEnd" />
        </CommonDialog>
    </div>
</template>

<script setup>
import { ref, reactive, watch, nextTick, onMounted, computed } from 'vue'
import SearchForm from '@/components/SearchForm/SearchForm.vue'
import CommonDialog from '@/components/commonDialog'
import { ElMessage, ElMessageBox } from 'element-plus'
import { Delete, Edit, Search, Share, Upload } from '@element-plus/icons-vue'
import { getPolicyfollow, getProductList } from '@/api/sign/underwritingMain'
import { uploadOssFileList } from '@/api/common'
import { getProcessDetail } from '@/api/sign/fna'
import { premiumReconciliationList } from '@/api/sign/policy'
import { loadDicts, getDictLabel } from '@/utils/useDict'
import { getNowTime, formatToDate, formatToDateTime } from '@/utils/date'
import EditableTable from '@/components/csf-common/EditableTable.vue'
import useUserStore from '@/store/modules/user'

const { proxy } = getCurrentInstance()
proxy.useDictLists(['sys_no_yes', 'csf_ap_frequency', 'bx_currency_type', 'csf_ap_first_issue', 'csf_ap_dividend', 'csf_fortune_status', 'csf_ap_mailing_method', 'receipt_status'])
const router = useRouter()
const userStore = useUserStore()
const files = ref('')
const fileUploadDialogFlag = ref(false)
// 记录每个 tab 是否有未保存的修改（dirty 状态）
const tabDirty = ref({
    basic: false,
    productPlan: false,
    firstPayment: false,
    introducer: false,
    postal: false,
    related: false,
    attachment: false
})
// ===== Props & Emits =====
const props = defineProps({
    modelValue: {
        type: Object,
        default: () => ({})
    },
    mode: {
        type: String,
        default: 'viewDetail'
    },
    policyBizId: {
        type: String,
        default: ''
    }
})

const emit = defineEmits(['update:modelValue', 'submit', 'cancel', 'saveRow'])

const introducerTableData = ref([])
const introducerConfig = [
    {
        type: 'select',
        prop: 'brokerBizId',
        label: '转介人',
        api: '/insurance/base/api/userSaleExpand/page',
        keywordField: 'realName',
        requestParams: { pageNo: 1, pageSize: 20 },
        placeholder: '输入转介人名称搜索',
        debounceWait: 500, // 自定义防抖时间
        onChangeExtraFields: {
            broker: 'realName',// 选中后自动填 broker = raw.realName
            brokerName: 'realName',
            internalCode: 'code',
            team: 'teamName',
            phone: 'phone',
        },
        transform: (res) => {
            return (res?.data.records || []).map(item => ({
                value: item.clientUserBizId,
                label: item.realName,
                ...item
            }))
        },
    },

    // {
    //     type: 'select',
    //     prop: 'gender',
    //     label: '性别',
    //     span: 4,
    //     options: [
    //         { value: 'male', label: '男' },
    //         { value: 'female', label: '女' }
    //     ]
    // },
    {
        type: 'input',
        prop: 'phone',
        label: '手机号码',
        span: 4,
        disabled: true
    },
    {
        type: 'input',
        prop: 'internalCode',
        label: '内部编号',
        span: 4,
        disabled: true
    },
    {
        type: 'input',
        prop: 'team',
        label: '所属团队',
        span: 4,
        disabled: true
    }, {
        type: 'input',
        prop: 'brokerRatio',
        label: '分配比例%',
        span: 4,
        inputType: 'integer',
        rules: [
            { required: true, message: '请输入比例' },
            {
                validator: (rule, value, cb) => {
                    const n = Number(value)
                    if (isNaN(n) || n < 0 || n > 100) cb(new Error('0～100'))
                    else cb()
                }
            }
        ]
    }, {
        type: 'textarea',
        prop: 'remark',
        label: '备注',
        span: 4
    },
]

// 附加计划表格
const additionalPlansConfig = [
    {
        type: 'input',
        prop: 'product',
        label: '产品名称',
        span: 4,
    }, {
        type: 'input',
        prop: 'frequency',
        label: '付款频率',
        span: 4,
    }, {
        type: 'input',
        prop: 'term',
        label: '保障期限',
        span: 4,
    }, {
        type: 'input',
        prop: 'phone',
        label: '付款频率',
        span: 4,
    }, {
        type: 'input',
        prop: 'periods',
        label: '供款期数',
        span: 4,
    }, {
        type: 'input',
        prop: 'currency',
        label: '保单币种',
        span: 4,
    }, {
        type: 'input',
        prop: 'premium',
        label: '每期保费',
        span: 4,
    }, {
        type: 'input',
        prop: 'fee',
        label: '保单征费',
        span: 4,
    },
]


function handleBatchSave(validRows) {
    console.log('批量提交:', validRows)
    // 调用 API
    introducerTableData.value = validRows
}

function applyViewMode(fields, mode) {
    if (mode === 'viewDetail') {

        return fields.map(item => ({
            ...item,
            disabled: true
        }));
    }
    // 非查看模式：保留原对象，可选择性移除 disabled
    return fields.map(item => {
        // 如果你希望编辑模式下完全不禁用，可以删除 disabled 属性
        const newItem = { ...item };
        delete newItem.disabled;
        return newItem;
    });
}


const newOrderData = ref({})
const basicInfoFormRef = ref()
const basicInfoFormData = ref({})
const basicInfoFormConfig = ref([
    {
        type: 'date',
        prop: 'signDate',
        label: '签单日',
    }, {
        type: 'select',
        prop: 'signer',
        label: '签单员',
        api: '/insurance/base/api/userSignExpand/page',
        keywordField: 'realName',
        requestParams: { pageNo: 1, pageSize: 20 },
        placeholder: '输入签单员姓名搜索',
        debounceWait: 500, // 自定义防抖时间
        onChangeExtraFields: {
            signerBizId: 'userSignBizId',
            practiceCode: 'practiceCode',
        },
        valueKey: 'realName',
        labelKey: 'realName',
        transform: (res) => {
            return res?.data.records || []
        },
        rules: [
            { required: true, message: '请选择签单员', trigger: 'blur' },
        ],

    }, {
        type: 'input',
        prop: 'practiceCode',
        label: '签单员执业编号',

    }, {
        type: 'select',
        prop: 'signLocation',
        label: '签单地点',
        dictType: 'csf_ap_meeting_point',
    },

])


// 保单信息
const policyInfoFormRef = ref()
const policyInfoFormData = ref({})
const policyInfoFormConfig = ref([
    {
        type: 'input',
        prop: 'policyNo',
        label: '保单号',
    }, {
        type: 'date',
        prop: 'effectiveDate',
        label: '保单生效日',
    }, {
        type: 'date',
        prop: 'policyExpirationDate',
        label: '保单截止日',
    }, {
        type: 'date',
        prop: 'underwritingDate',
        label: '保单核保日',
    }, {
        type: 'date',
        prop: 'receiptDate',
        label: '保单回执日',
    }, {
        type: 'select',
        prop: 'receiptStatus',
        label: '回执状态',
        dictType: 'receipt_status',
    }, {
        type: 'select',
        prop: 'directPaymentEnabled',
        label: '是否开通直接支付',
        dictType: 'sys_no_yes',
    }, {
        type: 'input',
        prop: 'policyHolder',
        label: '保单持有人',
    }, {
        type: 'input',
        prop: 'insured',
        label: '保单受保人',
    }, {
        type: 'input',
        prop: 'insuredAge',
        label: '受保人年龄',
    }, {
        type: 'input',
        prop: 'gracePeriod',
        label: '宽限期（天）',
        inputType: 'decimal',
        rules: [
            { pattern: /^\d+$/, message: '只能输入正整数', trigger: 'blur' }
        ]
    }, {
        type: 'select',
        prop: 'isJoin',
        label: '是否参加递增保障权益',
        dictType: 'sys_no_yes',
    },
])

// 基本计划
const basicPlanFormRef = ref()
const basicPlanFormData = ref({})
const basicPlanFormConfig = ref([
    {
        type: 'select',
        prop: 'insuranceCompanyBizId',
        label: '保险公司',
        api: '/insurance/base/api/insuranceCompany/page',
        keywordField: 'queryContent',
        requestParams: { pageNo: 1, pageSize: 500 },
        placeholder: '输入保险公司名称搜索',
        debounceWait: 500, // 自定义防抖时间
        valueKey: 'insuranceCompanyBizId',
        labelKey: 'fullName',
        transform: (res) => {
            return res?.data.records || []
        },
        onChangeExtraFields: {
            insuranceCompany: 'fullName',
        },
    }, {
        type: 'select',
        prop: 'productCate',
        label: '保险险种',
        api: '/insurance/base/api/insuranceCategory/page',
        keywordField: 'name',
        requestParams: { pageNo: 1, pageSize: 20 },
        placeholder: '输入保险险种名称搜索',
        debounceWait: 500, // 自定义防抖时间
        valueKey: 'insuranceCategoryBizId',
        labelKey: 'name',
        transform: (res) => {
            return res?.data.records || []
        },
        onChangeExtraFields: {
            insuranceCategoryCode: 'code',
        },

    },
    {
        type: 'select',
        prop: 'productName',
        label: '产品名称',
        api: '/product/api/relProjectProductLaunch/parameter/page',
        keywordField: 'productName',
        requestParams: () => ({
            tenantBizId: userStore.projectInfo.tenantBizId,
            projectBizId: userStore.projectInfo.projectBizId,
            fieldBizId: 'field_olk1qZe81qHHKXbw',
            fieldValueBizId: 'field_value_uOfJH5ucA2YwJpbn',
            // ✅ 确认这里用的是正确的字段（code 或 bizId）
            categoryCodeList: [basicPlanFormData.value.insuranceCategoryCode || ''],
            insuranceCompanyBizIdList: [basicPlanFormData.value.insuranceCompanyBizId || ''],
            pageNo: 1,
            pageSize: 20
        }),
        placeholder: '请选择产品名称',
        debounceWait: 500,
        valueKey: 'productName',
        labelKey: 'productName',
        transform: (res) => {
            console.log('======子组件选择选项后，父组件接收的值 :', res?.data.records || [])
            return res?.data.records || []
        },
        onChangeExtraFields: {
            apiAttributeSettingDtoList: 'apiAttributeSettingDtoList',
            productLaunchBizId: 'productLaunchBizId',
            insuranceCategoryCode: 'code',
            // 如果需要，也可以回填其他字段
        },
    },
    {
        type: 'select',
        prop: 'paymentFrequency',
        label: '付款频率',
        dictType: 'csf_ap_frequency',
    }, {
        type: 'input',
        prop: 'guaranteePeriod',
        label: '保障期限',
    }, {
        type: 'input',
        prop: 'sumInsured',
        label: '保额（重疾险）',
    }, {
        type: 'select',
        prop: 'issueNumber',
        label: '供款期数',
    }, {
        type: 'select',
        prop: 'policyCurrency',
        label: '保单币种',
        dictType: 'bx_currency_type'
    }, {
        type: 'input',
        prop: 'initialPremium',
        label: '每期保费',
        inputType: 'decimal',
        decimalDigits: 2,
        visible: (formData) => formData.commissionBizType == 'R',
        rules: [
            { required: true, message: '请输入金额', trigger: 'blur' },
            { pattern: /^\d+(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'blur' }
        ]
    }, {
        type: 'input',
        prop: 'policyLevy',
        label: '保单征费',
        inputType: 'decimal',
        decimalDigits: 2,
        visible: (formData) => formData.commissionBizType == 'R',
        rules: [
            { required: true, message: '请输入金额', trigger: 'blur' },
            { pattern: /^\d+(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'blur' }
        ]
    }, {
        type: 'select',
        prop: 'isPrepay',
        label: '是否预缴',
        dictType: 'sys_no_yes'
    }, {
        type: 'select',
        prop: 'isTraceable',
        label: '是否追溯',
        dictType: 'sys_no_yes'
    }, {
        type: 'date',
        prop: 'retroactiveDate',
        label: '回溯日期',
    }, {
        type: 'select',
        prop: 'initialPaymentMethod',
        label: '首期付款方式',
        dictType: 'csf_ap_first_issue'
    }, {
        type: 'select',
        prop: 'renewalPaymentMethod',
        label: '续期付款方式',
        dictType: 'csf_ap_first_issue'
    }, {
        type: 'select',
        prop: 'dividendDistributionMethod',
        label: '红利付款方式',
        dictType: 'csf_ap_dividend'
    },
])


// 首期保费
const firstPremiumTableData = ref([])
const firstPremiumFormRef = ref()
const firstPremiumFormData = ref({})
const firstPremiumFormConfig = ref([
    {
        type: 'input',
        prop: 'initialPremium',
        label: '首期保费',
        inputType: 'decimal',
        decimalDigits: 2,
        rules: [
            { required: true, message: '请输入金额', trigger: 'blur' },
            { pattern: /^\d+(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'blur' }
        ]
    }, {
        type: 'input',
        prop: 'policyLevy',
        label: '保单征费',
        inputType: 'decimal',
        decimalDigits: 2,
        rules: [
            { required: true, message: '请输入金额', trigger: 'blur' },
            { pattern: /^\d+(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'blur' }
        ]
    }, {
        type: 'select',
        prop: 'initialPaymentMethod',
        label: '首期缴费方式',
        dictType: 'csf_ap_first_issue'
    }, {
        type: 'input',
        prop: 'initialPremiumPaid',
        label: '首期已缴保费',
        inputType: 'decimal',
        decimalDigits: 2,
        rules: [
            { required: true, message: '请输入金额', trigger: 'blur' },
            { pattern: /^\d+(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'blur' }
        ]
    }, {
        type: 'input',
        prop: 'initialPremiumDue',
        label: '首期待缴保费',
        inputType: 'decimal',
        decimalDigits: 2,
        rules: [
            { required: true, message: '请输入金额', trigger: 'blur' },
            { pattern: /^\d+(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'blur' }
        ]
    }, {
        type: 'input',
        prop: 'initialPremiumTotal',
        label: '首期缴费总额',
        inputType: 'decimal',
        decimalDigits: 2,
        rules: [
            { required: true, message: '请输入金额', trigger: 'blur' },
            { pattern: /^\d+(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'blur' }
        ]
    },
    // {
    //     type: 'select',
    //     prop: 'initialPaymentStatus',
    //     label: '缴费状态',
    //     multiple: true,
    //     dictType: 'reconciliation_status'
    // }, 
    {
        type: 'date',
        prop: 'latestPaymentDate',
        label: '最晚缴费日',
        placeholder: '请选择'
    }, {
        type: 'input',
        prop: 'initialPremiumDiscount',
        label: '首期保费优惠金额',
        inputType: 'decimal',
        decimalDigits: 2,
        rules: [
            { required: true, message: '请输入金额', trigger: 'blur' },
            { pattern: /^\d+(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'blur' }
        ]
    },
])

// 邮寄信息
const postalFormRef = ref(null)
const postalFormData = ref({})
const postalFormConfig = ref([
    {
        type: 'select',
        prop: 'mailingMethod',
        label: '寄送方式',
        dictType: 'csf_mailing_method'
    }, {
        type: 'input',
        prop: 'deliveryNo',
        label: '快递单号',
        visible: (formData) => formData.mailingMethod == '2'
    }, {
        type: 'date',
        prop: 'brokerSignDate',
        label: '我司签收日',
        rules: [
            { required: true, message: '请输入我司签收日', trigger: 'blur' }
        ]
    }, {
        type: 'date',
        prop: 'customerSignDate',
        label: '客户签收日',
        rules: [
            { required: true, message: '请输入客户签收日', trigger: 'blur' }
        ]
    },
])


// 关联记录
const relatedTableData = ref([])
const attachmentTableData = ref([])
const attachmentTableColumns = ref([
    { prop: 'originalName', label: '文件名', sortable: true, width: '150', formatter: (row) => row.originalName || '-' },
    { prop: 'fileType', label: '文件类型', sortable: true, width: '150', formatter: (row) => row.fileType || '-' },
    { prop: 'createTime', label: '上传时间', sortable: true, width: '150', formatter: (row) => row.createTime || '-' },
    { prop: 'creatorName', label: '上传人', sortable: true, width: '150', formatter: (row) => row.creatorName || '-' },
])

// ===== 本地响应式数据 =====
const defaultFormData = () => ({})


// ✅ 使用 ref 而不是 reactive
const localData = ref(defaultFormData())

// ✅ 只在挂载时初始化一次（避免 watch 形成闭环）
onMounted(async () => {
    if (props.modelValue) {
        console.log('🚀 父组件 props.modelValue 挂载时:', props.modelValue)
        // 深拷贝 + 合并默认值，防止缺失字段
        localData.value = { ...defaultFormData(), ...props.modelValue }
    }
    try {

        getPolicyfollowDetail()
    } catch (error) {
        console.error('字典加载失败', error)
    } finally {

    }
    // 应用查看模式到基本信息表格
    basicInfoFormConfig.value = basicInfoFormConfig ? applyViewMode(basicInfoFormConfig.value, props.mode) : []
    policyInfoFormConfig.value = policyInfoFormConfig ? applyViewMode(policyInfoFormConfig.value, props.mode) : []

})
// 监听基本信息（basic）
watch(
    [
        basicInfoFormData,
        policyInfoFormData,
    ],
    () => {
        tabDirty.value.basic = true
    },
    { deep: true }
)
// 监听首期保费（firstPayment）
watch(
    firstPremiumFormData,
    () => {
        tabDirty.value.firstPayment = true
    },
    { deep: true }
)
// 监听邮寄信息
watch(
    postalFormData,
    () => {
        tabDirty.value.postal = true
    },
    { deep: true })
// 监听基本计划（productPlan）
watch(
    basicPlanFormData,
    () => {
        tabDirty.value.productPlan = true
    },
    { deep: true }
)
// ✅ 监听 localData 变化，emit 出去（用于 v-model）
watch(
    () => localData.value,
    (newVal) => {
        console.log('========父组件监测的localData:', newVal)
        emit('update:modelValue', newVal)
    },
    { deep: true }
)
// ===== 表单引用 & 验证规则 =====
const formRef = ref()
const activeTab = ref('basic')
// ========================
// ✅ 新增：切换前确认
// ========================
const handleBeforeLeave = async (newTabName, oldTabName) => {
    console.log('切换前确认-----------------------', newTabName, oldTabName)
    if (tabDirty.value[oldTabName]) {
        try {
            await ElMessageBox.confirm(
                `“${getTabLabel(oldTabName)}” 未提交，确定要切换吗？`,
                '提示',
                {
                    confirmButtonText: '继续切换',
                    cancelButtonText: '取消',
                    type: 'warning'
                }
            )
            return true // 允许切换
        } catch {
            return false // 阻止切换
        }
    }
    return true // 无未保存内容，允许切换
}
const getTabLabel = (name) => {
    const labels = {
        basic: '基础信息',
        productPlan: '产品计划',
        firstPayment: '首期缴费',
        introducer: '介绍人',
        postal: '邮寄信息',
        related: '关联记录',
        attachment: '附件'
    }
    return labels[name] || name
}
const handleTabClick = (tab) => {
    if (tab.props.name === 'firstPayment') {
        firstPremiumFormConfig.value = firstPremiumFormConfig ? applyViewMode(firstPremiumFormConfig.value, props.mode) : []
        if (!policyInfoFormData.value.policyNo) return
        getPremiumReconciliationList(policyInfoFormData.value.policyNo)
    } else if (tab.props.name === 'postal') {
        postalFormConfig.value = postalFormConfig ? applyViewMode(postalFormConfig.value, props.mode) : []
    } else if (tab.props.name === 'related') {
        getRelationRecord(newOrderData.value.fnaBizId)
    } else if (tab.props.name === 'attachment') {
        getAttachmentListDetail(newOrderData.value.policyBizId)
    } else if (tab.props.name === 'productPlan') {
        basicPlanFormConfig.value = basicPlanFormConfig ? applyViewMode(basicPlanFormConfig.value, props.mode) : []
    } else if (tab.props.name === 'introducer') {
        // introducerConfig.value = introducerConfig ? applyViewMode(introducerConfig.value, props.mode) : []
    } else if (tab.props.name === 'basic') {
        basicInfoFormConfig.value = basicInfoFormConfig ? applyViewMode(basicInfoFormConfig.value, props.mode) : []
    }
}

const handleSubmit = () => {
    formRef.value?.validate((valid) => {
        if (valid) {
            console.log('提交数据', introducerTableData.value)
            if (activeTab.value === 'postal') {
                emit('submit', { ...postalFormData.value, activeTab: activeTab.value })
            } else if (activeTab.value === 'firstPayment') {
                emit('submit', { ...firstPremiumFormData.value, activeTab: activeTab.value })
            } else if (activeTab.value === 'attachment') {
                emit('submit', { activeTab: activeTab.value })
            } else if (activeTab.value === 'introducer') {
                emit('submit', { ...introducerTableData.value, activeTab: activeTab.value })
            } else if (activeTab.value === 'basic') {
                emit('submit', { ...basicInfoFormData.value, activeTab: activeTab.value, ...policyInfoFormData.value })
            } else if (activeTab.value === 'productPlan') {
                emit('submit', { ...basicPlanFormData.value, activeTab: activeTab.value, ...localData.additionalPlans })
            }

        }
    })
}

const handleCancel = () => {
    emit('cancel')
}

const handleClick = (tab) => {
    activeTab.value = tab.name
}

// 如果外部 modelValue 更新（比如重新加载数据），同步到 localData
watch(
    () => props.modelValue,
    (newVal) => {
        if (newVal) {
            Object.assign(localData, defaultFormData(), newVal)
        }
    },
    { deep: true }
)

// 查询新单跟进详情
const getPolicyfollowDetail = () => {
    if (!props.policyBizId) {
        return
    }
    getPolicyfollow(props.policyBizId).then(res => {
        if (res.code === 200) {
            console.log('====父组件在赋值basicPlanFormData前', basicPlanFormData.value)
            newOrderData.value = res.data
            policyInfoFormData.value = { ...transformToFormData(res.data, policyInfoFormConfig.value) };
            basicPlanFormData.value = { ...transformToFormData(res.data, basicPlanFormConfig.value) };
            basicInfoFormData.value = { ...transformToFormData(res.data, basicInfoFormConfig.value) };
            firstPremiumFormData.value = { ...transformToFormData(res.data, firstPremiumFormConfig.value) };
            introducerTableData.value = res.data.brokerList || []
            console.log('====父组件在赋值basicPlanFormData后', basicPlanFormData.value)
        }

    })
}

// 查询附件列表
const getAttachmentListDetail = (policyBizId) => {
    if (!policyBizId) {
        return
    }
    const params = {
        objectBizId: policyBizId,
        pageNo: 1,
        pageSize: 100,
    }
    uploadOssFileList(params).then(res => {
        if (res.code === 200) {
            attachmentTableData.value = res.data || []
            console.log('attachmentTableData', res.data)
        }
    })
}

// 附件上传方法
const handleUploadEnd = (code) => {
    if (code === 200) {
        ElMessage.success('上传文件成功')
        fileUploadDialogFlag.value = false
        files.value = ''
        getAttachmentListDetail(props.policyBizId)
    } else {
        ElMessage.error('上传文件失败')
    }
}

// 组装表单数据
const transformToFormData = (apiData, formConfig) => {
    const formData = {};

    formConfig.forEach(item => {
        const { prop, dictType } = item;

        let value = null;

        // 特殊映射（按需添加）
        switch (prop) {
            case 'signLocation':
                value = apiData.signLocation;
                break;
            default:
                value = apiData[prop];
        }

        // 处理字典字段：如果配置了 dictType，且值是 number，转为 string
        if (dictType && typeof value === 'number') {
            value = String(value);
        }

        formData[prop] = value ?? null;
    });

    return formData;
};
// 获取首期保费对账列表
const getPremiumReconciliationList = (policyNo) => {
    const params = {
        policyNo: policyNo,
        pageNo: 1,
        pageSize: 100,
    }
    premiumReconciliationList(params).then(res => {
        if (res.code === 200) {
            firstPremiumTableData.value = res.data.records || []
        }
    })
}

// 获取关联流程记录
const getRelationRecord = (fnaBizId) => {
    getProcessDetail(fnaBizId).then(res => {
        if (res.code === 200) {
            relatedTableData.value = [res.data] || []
            console.log('relationRecordData', res.data)
        }
    })
}

const viewRecordDetail = (e) => {
    router.push({
        path: '/sign/FnaList/edit',
        query: {
            fnaBizId: newOrderData.value.fnaBizId,
            type: 'edit',
            status: newOrderData.value.status,
            source: 'newOrder',
            appointmentBizId: newOrderData.value.appointmentBizId
        }
    })
}
const handleSelectChange = async (prop, value, item, type) => {
    await nextTick()
    // console.log('======子组件选择选项后，父组件接收的值 :', basicPlanFormData.value)
    if (type === 'basicPlan') {
        const params = {
            tenantBizId: userStore.projectInfo.tenantBizId,
            projectBizId: userStore.projectInfo.projectBizId,
            fieldBizId: 'field_olk1qZe81qHHKXbw',
            fieldValueBizId: 'field_value_uOfJH5ucA2YwJpbn',
            insuranceCompanyBizIdList: [basicPlanFormData.value.insuranceCompanyBizId],
            categoryCodeList: [basicPlanFormData.value.insuranceCategoryCode],
            pageNo: 1,
            pageSize: 100,
        }
        console.log('====父组件拿到值，去调用产品列表查询接口', params)
        getProductLists(params)

    }
}

// 获取产品列表
const getProductLists = (params) => {
    getProductList(params).then(res => {
        if (res.code === 200) {
            console.log('productList', res.data.records || [])
            // productList.value = res.data.records || []
        }
    })
}

defineExpose({
    getPolicyfollowDetail
})

</script>

<style scoped>
.form-page {
    padding: 10px;
    background: #fff;
    border-radius: 4px;
    padding-top: 0;
}

.tab-placeholder {
    padding: 40px 0;
}

.form-footer {
    text-align: center;
    margin-top: 30px;
}

.sectionTitle {
    margin: 0 0 15px 0;
    font-size: 16px;
    line-height: 1;
    position: relative;
    padding-left: 16px;
}

.sectionTitle::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 6px;
    height: 20px;
    background-color: #007bff;
    border-radius: 5px;
}

.section h5 {
    margin: 0;
    font-size: 14px;
    line-height: 1;
    position: relative;
    background-color: rgba(0, 119, 238, 0.05);
    color: #383838;
    padding: 15px 10px;
    border-radius: 4px;
}
</style>